:root{--bg:#100f14;--bg-elevated:#17161d;--bg-panel:#1d1c25;--bg-panel-hover:#24232e;--text:#f0f0f3;--text-dim:#9b98a8;--border:#2f2d3a;--border-soft:#26242f;--accent:#7c5cff;--accent-hover:#8f73ff;--accent-soft:#7c5cff29;--accent-text:#fff;--success:#52c97a;--warning:#e8c14a;--danger:#e8546a;--radius:12px;--radius-sm:8px;--shadow-card:0 4px 16px #00000047;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font:16px/1.5 -apple-system,system-ui,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{width:100%;overflow-x:hidden}body{background:radial-gradient(1200px 600px at 15% -10%, #7c5cff14, transparent 60%), var(--bg);background-attachment:fixed;margin:0}h1,h2,h3{color:var(--text);letter-spacing:-.01em;font-weight:700}h3{text-transform:uppercase;letter-spacing:.04em;color:var(--text-dim);font-size:15px}button{font:inherit;color:var(--text);background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;padding:8px 14px;font-weight:600;transition:background-color .12s,border-color .12s,transform 80ms,opacity .12s}button:hover:not(:disabled){background:var(--bg-panel-hover);border-color:var(--accent)}button:active:not(:disabled){transform:scale(.97)}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.btn-primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}input[type=text],input:not([type]),textarea{font:inherit;color:var(--text);background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 10px;transition:border-color .12s}input[type=text]:focus,input:not([type]):focus,textarea:focus{border-color:var(--accent);outline:none}.card{background:var(--bg-panel);border:1px solid var(--border-soft);border-radius:var(--radius);box-shadow:var(--shadow-card);padding:16px}.segmented{background:var(--bg-elevated);border:1px solid var(--border);border-radius:999px;gap:2px;padding:3px;display:inline-flex}.segmented button{background:0 0;border:none;border-radius:999px;padding:6px 16px;font-size:14px}.segmented button:hover:not(:disabled){background:var(--bg-panel-hover)}.segmented button.active{background:var(--accent);color:var(--accent-text)}.segmented button.active:hover:not(:disabled){background:var(--accent-hover)}.badge{text-transform:uppercase;letter-spacing:.04em;background:var(--bg-elevated);color:var(--text-dim);white-space:nowrap;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:700;display:inline-block}.pick-row{text-align:left;border-radius:var(--radius-sm);background:var(--bg-elevated);border:1px solid var(--border-soft);flex-direction:column;gap:4px;padding:12px 14px;transition:border-color .12s,background-color .12s,transform 80ms;display:flex}.pick-row:hover:not(:disabled){border-color:var(--accent);background:var(--bg-panel-hover)}.pick-row.active{border-color:var(--accent);background:var(--accent-soft)}.app-shell{flex-direction:column;min-height:100svh;display:flex}.app-header{border-bottom:1px solid var(--border-soft);-webkit-backdrop-filter:blur(10px);z-index:10;background:#17161dd9;align-items:center;gap:24px;padding:12px 24px;display:flex;position:sticky;top:0}.app-header h1{white-space:nowrap;background:linear-gradient(135deg, var(--text) 40%, var(--accent-hover));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:19px}.app-header nav{background:var(--bg-elevated);border:1px solid var(--border);border-radius:999px;gap:2px;padding:3px;display:flex}.nav-link{color:var(--text-dim);border-radius:999px;padding:7px 16px;font-size:14px;font-weight:600;text-decoration:none;transition:color .12s,background-color .12s}.nav-link:hover{color:var(--text);background:var(--bg-panel-hover)}.nav-link.active{color:var(--accent-text);background:var(--accent)}.nav-link.active:hover{background:var(--accent-hover)}.app-main{flex:1;min-width:0;padding:24px}@media (width<=640px){.app-header{flex-direction:column;align-items:stretch;gap:8px;padding:10px 12px}.app-header h1{text-align:center;font-size:17px}.app-header nav{gap:2px}.nav-link{text-align:center;flex:1;padding:8px 4px;font-size:13px}.app-main{padding:12px}}
