:root{--font-family: "Inter", system-ui, Avenir, Helvetica, Arial, sans-serif;--line-height: 1.5;--font-weight: 400;--color-bg-base: #0f0f13;--color-bg-surface: #1a1a20;--color-bg-glass: rgba(30, 30, 35, .7);--color-border: rgba(255, 255, 255, .1);--color-border-hover: rgba(255, 255, 255, .2);--color-primary: #646cff;--color-primary-hover: #7b83ff;--color-accent: #ff0055;--color-text-main: #ffffff;--color-text-secondary: rgba(255, 255, 255, .7);--color-text-muted: rgba(255, 255, 255, .4);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--shadow-sm: 0 4px 6px rgba(0, 0, 0, .3);--shadow-md: 0 8px 16px rgba(0, 0, 0, .4);--glass-blur: blur(12px);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;max-width:100%;overflow-x:hidden!important}body{min-width:320px;min-height:100vh;background-color:var(--color-bg-base);color:var(--color-text-main);font-family:var(--font-family)}.app-container{width:100%;max-width:100%;overflow-x:hidden}#root{width:100%;max-width:1280px;margin:0 auto;padding:var(--spacing-md)}h1{font-size:2.5em;line-height:1.1;font-weight:700;background:linear-gradient(to right,#fff,#aaa);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:var(--spacing-lg)}h2{font-size:1.5em;margin-bottom:var(--spacing-md);color:var(--color-text-main)}.glass-panel{background:var(--color-bg-glass);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--color-border);border-radius:12px;padding:var(--spacing-lg);box-shadow:var(--shadow-sm)}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--color-bg-surface);color:var(--color-text-main);cursor:pointer;transition:all .25s;display:inline-flex;align-items:center;gap:var(--spacing-sm);justify-content:center}button:hover{border-color:var(--color-primary);background-color:#25252b}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}button.primary{background-color:var(--color-primary);color:#fff}button.primary:hover{background-color:var(--color-primary-hover)}button.danger{color:var(--color-accent);border-color:var(--color-accent);background:transparent}button.danger:hover{background-color:#ff00551a}button.icon-btn{padding:var(--spacing-sm);border-radius:50%;display:inline-flex;align-items:center;justify-content:center}input{background-color:#0003;border:1px solid var(--color-border);border-radius:6px;padding:var(--spacing-sm) var(--spacing-md);font-size:1rem;color:var(--color-text-main);width:100%;min-width:0;max-width:100%;box-sizing:border-box;transition:border-color .2s}input:focus{outline:none;border-color:var(--color-primary);background-color:#0006}label{display:block;margin-bottom:var(--spacing-xs);color:var(--color-text-secondary);font-size:.9rem}.flex-row{display:flex;gap:var(--spacing-md);align-items:center}.flex-col{display:flex;flex-direction:column;gap:var(--spacing-md)}.text-small{font-size:.85rem;color:var(--color-text-secondary)}.scroll-container{overflow-y:auto;max-height:60vh;padding-right:var(--spacing-sm)}.scroll-container::-webkit-scrollbar{width:8px}.scroll-container::-webkit-scrollbar-track{background:transparent}.scroll-container::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:4px}.app-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--spacing-lg);max-width:1400px;margin:0 auto;width:100%}@media(min-width:768px){.app-grid{grid-template-columns:450px minmax(0,1fr);align-items:start}}@media(min-width:1024px){.app-grid{grid-template-columns:500px minmax(0,1fr);align-items:start}}@media(max-width:768px){#root{padding:var(--spacing-sm)!important}.glass-panel{padding:var(--spacing-md)!important}.hide-on-mobile{display:none!important}.app-header{flex-direction:column!important;align-items:stretch!important;gap:15px!important}.header-actions{justify-content:space-between!important;width:100%}.header-actions button{flex:1}.mobile-col{flex-direction:column!important;align-items:stretch!important}.mobile-wrap{flex-wrap:wrap!important}h1{font-size:1.8em}h2{font-size:1.3em;margin-bottom:8px}.icon-btn{padding:6px}}
