:root{color-scheme:dark;--bg-0: #080b10;--bg-1: #0c1118;--bg-2: #111823;--bg-3: #18202b;--surface: rgba(17, 23, 32, .78);--surface-2: rgba(255, 255, 255, .02);--surface-3: rgba(255, 255, 255, .04);--surface-pop: rgba(24, 32, 43, .96);--glass: blur(18px) saturate(115%);--panel: var(--surface);--panel-strong: var(--surface-pop);--line-soft: rgba(255, 255, 255, .06);--line: rgba(255, 255, 255, .08);--line-strong: rgba(255, 255, 255, .14);--text: #f3f6fa;--muted: #9ea9b7;--muted-2: #9ea9b7;--faint: #687586;--accent: #79b8ff;--accent-hover: #8fc4ff;--accent-2: #a3ccff;--accent-soft: rgba(121, 184, 255, .12);--accent-line: rgba(121, 184, 255, .22);--blue: #5ba8ff;--blue-soft: rgba(91, 168, 255, .08);--blue-line: rgba(91, 168, 255, .3);--red: #ff6b78;--red-soft: rgba(255, 107, 120, .06);--red-line: rgba(255, 107, 120, .22);--success: #80d6a3;--success-soft: rgba(128, 214, 163, .09);--success-line: rgba(128, 214, 163, .25);--warning: #e6b86a;--danger: #ff6b78;--r-xs: 6px;--r-sm: 8px;--r-md: 11px;--r-lg: 14px;--r-xl: 18px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--shadow: 0 18px 45px rgba(0, 0, 0, .28);--shadow-pop: 0 18px 45px rgba(0, 0, 0, .4);--inset-hi: inset 0 1px 0 rgba(255, 255, 255, .04);--sidebar: 176px;--sidebar-collapsed: 56px;--topbar-h: 52px;--ease: cubic-bezier(.23, 1, .32, 1);--mono: "IBM Plex Mono", ui-monospace, "Cascadia Code", "SFMono-Regular", "Courier New", monospace;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{min-width:320px;background:var(--bg-0)}body{margin:0;min-width:320px;min-height:100vh;color:var(--text);background:linear-gradient(160deg,#080b10,#0c1118);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button{color:inherit}button,select{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r-xs)}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-2)}h1,h2,h3,p{margin-top:0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:5px}::-webkit-scrollbar-track{background:transparent}@keyframes dfFadeUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes dfPopIn{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}@keyframes dfSpin{to{transform:rotate(360deg)}}@keyframes dfPulse{0%,to{opacity:1}50%{opacity:.45}}@keyframes dfShimmer{to{background-position:-200% 0}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:80ms!important}}.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}.eyebrow{display:block;color:var(--accent);font-size:11px;font-weight:600;letter-spacing:.06em}.app-shell{min-height:100vh;display:flex;flex-direction:column}.topbar{height:var(--topbar-h);flex:none;display:flex;align-items:center;gap:16px;padding:0 20px;background:var(--surface);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border-bottom:1px solid var(--line);box-shadow:var(--inset-hi);position:sticky;top:0;z-index:30}.topbar-brand{display:flex;align-items:center;gap:10px;min-width:0}.brand-mark{width:26px;height:26px;flex:none;display:flex;align-items:center;justify-content:center;border-radius:7px;background:linear-gradient(145deg,#5ba8ff,#3d7fd6);color:#081020;font-weight:650;font-size:14px}.brand-name{font-weight:650;font-size:15px;letter-spacing:.01em}.topbar-divider{width:1px;height:20px;background:var(--line)}.topbar-chips{display:flex;align-items:center;gap:8px;flex:1;min-width:0;overflow:hidden}.chip{font-size:12px;color:var(--muted);background:var(--surface-3);border:1px solid rgba(255,255,255,.07);border-radius:var(--r-xs);padding:3px 8px;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}.chip.side{background:var(--blue-soft);border-color:var(--accent-line)}.chip.side i{width:6px;height:6px;border-radius:50%;background:var(--blue);flex:none}.chip.meta{background:transparent;border:none;padding:3px 4px}.chip.meta i{width:6px;height:6px;border-radius:50%;background:var(--success);flex:none}.topbar-actions{display:flex;align-items:center;gap:8px;flex:none}.locale-btn{font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--muted);background:var(--surface-3);border:1px solid var(--line);border-radius:var(--r-sm);padding:6px 10px;transition:background .14s var(--ease),color .14s var(--ease)}.locale-btn:hover{background:#ffffff12;color:var(--text)}.signin-btn{font-size:13px;font-weight:600;color:#081020;background:var(--accent);border:none;border-radius:var(--r-sm);padding:7px 14px;transition:background .14s var(--ease),transform .12s var(--ease)}.signin-btn:hover{background:var(--accent-hover)}.signin-btn:active{transform:scale(.97)}.account-btn{display:flex;align-items:center;gap:8px;background:var(--surface-3);border:1px solid var(--line);border-radius:var(--r-sm);padding:5px 10px 5px 5px;color:var(--text);transition:background .14s var(--ease),border-color .14s var(--ease)}.account-btn:hover{background:#ffffff12;border-color:var(--line-strong)}.account-ini{width:24px;height:24px;border-radius:var(--r-xs);background:#79b8ff2e;color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:650;flex:none}.account-name{font-size:13px;font-weight:500}.layout-body{flex:1;display:flex;min-height:0}.sidebar{display:flex;flex-direction:column;gap:2px;width:var(--sidebar);flex:none;padding:12px 8px;border-right:1px solid var(--line-soft)}.nav-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:9px;border:none;background:transparent;color:var(--muted);font-size:13px;font-weight:450;text-align:left;transition:background .14s var(--ease),color .14s var(--ease)}.nav-item svg{flex:none}.nav-item:hover{background:#ffffff0f;color:var(--text)}.nav-item:active{transform:scale(.97)}.nav-item.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.nav-spacer{flex:1}.nav-foot{font-size:11px;color:var(--faint);padding:8px 10px;line-height:1.5}.main-stage{flex:1;min-width:0;overflow-y:auto;padding:20px 22px 28px}.mobile-nav{display:none}.page{max-width:1320px}.legal-footer{max-width:980px;margin:40px auto 0;color:#7f8b9e8c;font-size:11px;line-height:1.5;text-align:center}.primary-button,.secondary-button,.ghost-button,.danger-button{font-family:Inter,sans-serif;font-size:13px;font-weight:600;border-radius:9px;padding:8px 14px;transition:background .14s var(--ease),transform .12s var(--ease),border-color .14s var(--ease)}.primary-button{color:#081020;background:var(--accent);border:none}.primary-button:hover{background:var(--accent-hover)}.primary-button:active{transform:scale(.97)}.secondary-button{color:var(--text);background:#ffffff0d;border:1px solid rgba(255,255,255,.09);font-weight:500}.secondary-button:hover{background:#ffffff14}.ghost-button{color:var(--muted);background:var(--surface-3);border:1px solid var(--line);font-weight:500}.ghost-button:hover{background:#ffffff12;color:var(--text)}.danger-button{color:var(--muted);background:none;border:1px solid var(--line);font-weight:500}.danger-button:hover{color:var(--red);border-color:var(--red-line)}.icon-button{width:34px;height:34px;flex:none;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-3);color:var(--muted);font-size:18px;transition:background .14s var(--ease),color .14s var(--ease)}.icon-button:hover{background:#ffffff12;color:var(--text)}.glass-card{background:var(--surface);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow),var(--inset-hi)}.page-heading{margin-bottom:16px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}.page-heading h1{margin:0;font-size:19px;font-weight:650}.page-heading p{margin:2px 0 0;color:var(--muted);font-size:13px;line-height:1.5;max-width:620px}.heading-actions,.sheet-actions{display:flex;gap:8px}.section-label{margin-bottom:10px;display:flex;align-items:center;justify-content:space-between;gap:10px}.section-label>span{font-size:12px;font-weight:600;color:var(--muted)}.section-label>small{font-size:11px;color:var(--faint);font-family:var(--mono)}.error-banner{margin-bottom:12px;padding:10px 12px;display:flex;gap:10px;align-items:center;border:1px solid var(--red-line);border-radius:var(--r-md);background:#ff6b7812;color:var(--red);font-size:13px}.error-banner>span{font-weight:700}.error-banner p{margin:0;flex:1}.error-banner button{border:0;background:none;color:var(--red);text-decoration:underline}.draft-view{animation:dfFadeUp .2s var(--ease)}.draft-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}.draft-head h1{margin:0;font-size:19px;font-weight:650}.draft-head p{margin:2px 0 0;font-size:13px;color:var(--muted)}.draft-head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.phase-chip{font-size:12px;color:var(--muted);background:var(--surface-3);border:1px solid var(--line);border-radius:7px;padding:5px 10px;display:inline-flex;align-items:center;gap:7px}.phase-chip i{width:6px;height:6px;border-radius:50%;background:var(--blue);animation:dfPulse 2s ease-in-out infinite}.draft-context{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-2)}.side-toggle{display:flex;align-items:center;gap:6px}.side-toggle>span{font-size:12px;color:var(--muted);margin-right:2px}.side-toggle button{padding:5px 12px;border:1px solid var(--line);border-radius:7px;background:transparent;color:var(--muted);font-size:12px;font-weight:600;transition:background .14s var(--ease),color .14s var(--ease),border-color .14s var(--ease)}.side-toggle button.active.blue{border-color:var(--blue-line);background:var(--blue-soft);color:var(--blue)}.side-toggle button.active.red{border-color:var(--red-line);background:#ff6b781a;color:var(--red)}.ctx-select{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px}.ctx-select select{height:30px;padding:0 8px;border:1px solid var(--line);border-radius:7px;background:var(--bg-2);color:var(--muted);font-size:12px}.ctx-select select option{background:var(--bg-2)}.mobile-tabs{display:none}.draft-grid{display:grid;grid-template-columns:280px 1fr 280px;gap:14px;align-items:start}.draft-col{min-width:0}.col-rail{display:flex;flex-direction:column;gap:12px}.team-panel{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:10px;background:var(--surface);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow),var(--inset-hi);padding:14px}.team-accent{position:absolute;top:12px;bottom:12px;width:2px;border-radius:2px;opacity:.7}.team-panel.blue .team-accent{left:0;background:var(--blue)}.team-panel.red .team-accent{right:0;background:var(--red)}.team-head{display:flex;align-items:center;justify-content:space-between}.team-name{font-weight:600;font-size:14px}.team-panel.blue .team-name{color:var(--blue)}.team-panel.red .team-name{color:var(--red)}.team-count{font-size:11px;color:var(--faint)}.pick-slots{display:flex;flex-direction:column;gap:6px}.pick-slot{display:flex;align-items:center;gap:10px;padding:8px;min-height:60px;border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-soft);transition:background .14s var(--ease),border-color .14s var(--ease)}.pick-slot.filled{animation:dfPopIn .16s var(--ease)}.pick-slot:hover{background:#ffffff0a;border-color:var(--line)}.pick-slot>button{min-width:0;flex:1;padding:0;display:flex;gap:10px;align-items:center;border:0;background:none;text-align:left}.pick-index{display:none}.slot-copy{min-width:0;display:grid;gap:2px}.slot-copy b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pick-slot:not(.filled) .slot-copy b{color:var(--muted);font-weight:500}.slot-copy small{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pick-slot select{flex:none;max-width:96px;height:28px;padding:0 6px;border:1px solid var(--line-soft);border-radius:7px;background:var(--bg-2);color:var(--muted);font-size:11px}.pick-slot select option{background:var(--bg-2)}.champion-avatar{display:inline-flex;align-items:center;gap:8px}.champion-avatar img,.champion-avatar.placeholder{width:44px;height:44px;flex:0 0 auto;border-radius:9px;object-fit:cover;background:var(--bg-3);border:1px solid var(--line)}.champion-avatar.placeholder{display:grid;place-items:center;color:var(--faint);border:1px dashed var(--line-strong);font-size:18px}.filled .champion-avatar img{border-color:var(--line)}.ban-row{display:flex;align-items:center;gap:8px;padding-top:10px;border-top:1px solid var(--line-soft)}.ban-row>span{font-size:11px;color:var(--faint);flex:none}.ban-row>div{display:flex;gap:6px}.ban-row button{width:28px;height:28px;padding:0;border:0;background:none;border-radius:var(--r-xs);overflow:hidden}.ban-row .champion-avatar img{width:28px;height:28px;border-radius:var(--r-xs);border:0;filter:grayscale(.85);opacity:.75}.ban-row .champion-avatar.placeholder{width:28px;height:28px;border-radius:var(--r-xs);border:1px dashed rgba(255,255,255,.12);font-size:12px;color:transparent}.rec-hero,.rec-alts,.ban-recs,.analysis-card{background:var(--surface);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow),var(--inset-hi);padding:16px}.rec-hero{animation:dfFadeUp .22s var(--ease) both;padding:16px}.rec-alts{animation:dfFadeUp .22s var(--ease) 60ms both;padding:14px}.ban-recs{animation:dfFadeUp .22s var(--ease) .12s both;padding:14px}.analysis-card{animation:dfFadeUp .22s var(--ease) .18s both;padding:14px}.rec-hero-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:10px}.rec-hero-head .eyebrow{letter-spacing:.02em;font-size:12px}.rec-badge{font-size:11px;padding:2px 8px;border-radius:var(--r-xs);white-space:nowrap}.rec-badge.high{color:var(--success);background:var(--success-soft);border:1px solid var(--success-line)}.rec-badge.medium{color:var(--warning);background:#e6b86a17;border:1px solid rgba(230,184,106,.25)}.rec-badge.low{color:var(--muted);background:var(--surface-3);border:1px solid var(--line)}.role-switch{display:flex;gap:4px;margin-bottom:12px;flex-wrap:wrap}.role-switch button{font-size:11px;font-weight:500;padding:5px 10px;border-radius:7px;border:1px solid var(--line-soft);background:var(--surface-2);color:var(--muted);transition:background .14s var(--ease),color .14s var(--ease),border-color .14s var(--ease)}.role-switch button:hover{background:#ffffff0d;color:var(--text)}.role-switch button.active{background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent);font-weight:600}.rec-hero-body{display:flex;gap:14px;align-items:flex-start}.rec-hero-avatar img,.rec-hero-avatar.placeholder{width:88px;height:88px;flex:none;border-radius:12px;object-fit:cover;border:1px solid rgba(121,184,255,.35);box-shadow:0 0 0 3px #79b8ff14;background:var(--bg-3);animation:dfPopIn .16s var(--ease)}.rec-hero-avatar.placeholder{display:grid;place-items:center;color:var(--faint);border-style:dashed}.rec-hero-main{min-width:0;flex:1}.rec-title-row{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.rec-name{font-size:21px;font-weight:650}.rec-score{font-family:var(--mono);font-size:16px;color:var(--accent)}.rec-score small{font-size:11px;color:var(--faint)}.rec-sub{font-size:12px;color:var(--muted);margin:2px 0 10px}.rec-reasons{display:flex;flex-direction:column;gap:5px}.reason-row{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text)}.reason-row i{width:5px;height:5px;border-radius:50%;flex:none}.reason-row.positive i{background:var(--accent)}.reason-row.neutral i{background:var(--warning)}.reason-row.negative i{background:var(--red)}.rec-actions{display:flex;gap:8px;margin-top:14px}.rec-actions .primary-button{flex:1;padding:9px 14px}.rec-empty{padding:22px 8px;text-align:center;color:var(--muted);font-size:13px}.rec-alts-title,.ban-recs-title{font-size:12px;font-weight:600;color:var(--muted);margin-bottom:10px}.rec-alts-list{display:flex;flex-direction:column;gap:6px}.alt-wrap{position:relative}.alt-btn{width:100%;display:flex;align-items:center;gap:10px;background:var(--surface-2);border:1px solid var(--line-soft);border-radius:var(--r-md);padding:8px 10px;color:var(--text);text-align:left;transition:background .14s var(--ease),border-color .14s var(--ease)}.alt-btn:hover{background:#ffffff0d;border-color:var(--line-strong)}.alt-avatar img,.alt-avatar.placeholder{width:34px;height:34px;flex:none;border-radius:var(--r-sm);object-fit:cover;background:var(--bg-3);border:1px solid var(--line-soft)}.alt-avatar.placeholder{display:grid;place-items:center;color:var(--faint)}.alt-copy{min-width:0;flex:1}.alt-copy b{display:block;font-size:13px;font-weight:600}.alt-copy small{font-size:11px;color:var(--muted)}.alt-score{font-family:var(--mono);font-size:13px;color:var(--muted);flex:none}.alt-popover{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;background:var(--surface-pop);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-lg);box-shadow:var(--shadow-pop),inset 0 1px #ffffff0d;padding:12px;animation:dfPopIn .18s var(--ease);transform-origin:top center}.factor-grid{display:grid;grid-template-columns:1fr auto;gap:5px 14px;font-size:12px}.factor-grid>span:nth-child(odd){color:var(--muted)}.factor-grid>span:nth-child(2n){font-family:var(--mono);color:var(--text);text-align:right}.factor-grid>span.pos{color:var(--success)!important}.factor-total{margin-top:8px;padding-top:8px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:12px}.factor-total>span:first-child{color:var(--muted)}.factor-total>span:last-child{font-family:var(--mono);color:var(--accent)}.ban-recs-list{display:flex;gap:8px;flex-wrap:wrap}.ban-rec{flex:1;min-width:120px;display:flex;align-items:center;gap:9px;background:var(--red-soft);border:1px solid rgba(255,107,120,.16);border-radius:var(--r-md);padding:8px 10px}.ban-rec .champion-avatar img,.ban-rec .champion-avatar.placeholder{width:32px;height:32px;border-radius:var(--r-sm);filter:none;opacity:1}.ban-rec-copy{min-width:0}.ban-rec-copy b{display:block;font-size:13px;font-weight:600}.ban-rec-copy small{font-size:11px;color:var(--muted)}.ban-recs-empty{display:flex;gap:8px}.ban-recs-empty span{width:32px;height:32px;display:grid;place-items:center;border:1px dashed var(--line);border-radius:var(--r-sm);color:var(--faint);font-size:11px}.source-strip{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}.source-badge{padding:3px 8px;border-radius:var(--r-xs);font-size:11px;border:1px solid var(--success-line);background:var(--success-soft);color:var(--success)}.source-badge.demo{border-color:#e6b86a40;background:#e6b86a17;color:var(--warning)}.source-badge.warning{color:var(--warning);border-color:#e6b86a40;background:#e6b86a17}.provenance{margin:10px 0 0;color:var(--faint);font-size:11px;line-height:1.4}.provenance a{color:var(--muted)}.analysis-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}.analysis-head-copy b{display:block;font-size:12px;font-weight:600;color:var(--muted)}.analysis-head-copy small{display:block;font-size:12px;color:var(--faint);margin-top:2px}.analysis-run{display:flex;align-items:center;gap:8px}.analysis-run>small{font-size:11px;color:var(--faint)}.analysis-spinner{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--muted)}.analysis-spinner i{width:14px;height:14px;flex:none;border:2px solid rgba(121,184,255,.25);border-top-color:var(--accent);border-radius:50%;animation:dfSpin .8s linear infinite}.analysis-result{margin-top:12px;background:var(--accent-soft);border:1px solid rgba(121,184,255,.16);border-radius:var(--r-md);padding:12px;animation:dfFadeUp .2s var(--ease)}.analysis-result p{margin:0;font-size:13px;line-height:1.55;color:var(--text);white-space:pre-line}.analysis-result-foot{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.analysis-result-foot .provider-chip{font-family:var(--mono);font-size:11px;color:var(--faint);background:none;border:0;padding:0}.analysis-result-foot .provider-chip.grok{color:var(--accent)}.analysis-dismiss{font-size:12px;font-weight:500;color:var(--muted);background:none;border:none;padding:2px 4px}.analysis-dismiss:hover{color:var(--text)}.champion-dialog{width:min(920px,calc(100vw - 28px));max-height:min(780px,calc(100vh - 28px));padding:18px;border:1px solid var(--line-strong);border-radius:var(--r-xl);background:var(--surface-pop);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);color:var(--text);box-shadow:var(--shadow-pop)}.champion-dialog::backdrop{background:#020408b8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.dialog-head,.editor-head{display:flex;justify-content:space-between;align-items:flex-start}.dialog-head h2,.editor-head h2{margin:2px 0 12px;font-size:16px}.search-field{height:40px;padding:0 12px;display:flex;gap:9px;align-items:center;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-2);color:var(--muted)}.search-field input{width:100%;border:0;outline:0;background:transparent;color:var(--text)}.role-filters{margin:10px 0;display:flex;gap:6px;flex-wrap:wrap}.role-filters button{padding:6px 12px;border:1px solid var(--line);border-radius:7px;background:var(--surface-2);color:var(--muted);font-size:12px;font-weight:500}.role-filters button.active{border-color:var(--accent-line);background:var(--accent-soft);color:var(--accent);font-weight:600}.champion-grid{max-height:560px;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:6px;padding:3px}.champion-grid>button{padding:8px 4px;display:grid;justify-items:center;gap:5px;border:1px solid transparent;border-radius:var(--r-sm);background:transparent;color:var(--muted);font-size:11px}.champion-grid>button:hover{border-color:var(--line);background:#ffffff0a;color:var(--text)}.champion-grid>button:disabled{filter:grayscale(1);opacity:.25}.champion-grid .champion-avatar img{width:48px;height:48px}.preset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}.riot-import-card{margin-bottom:14px;padding:14px 16px;display:grid;grid-template-columns:1fr minmax(320px,.8fr);gap:12px 18px;align-items:center;border:1px solid var(--accent-line);border-radius:var(--r-lg);background:var(--surface);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);box-shadow:var(--shadow),var(--inset-hi)}.riot-import-card b{display:block;margin:4px 0;font-size:14px}.riot-import-card small{color:var(--muted);font-size:12px;line-height:1.5}.riot-import-controls{display:flex;gap:8px}.riot-import-controls input{min-width:0;flex:1;height:40px;padding:0 11px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-2);color:var(--text)}.riot-import-card>.form-error{grid-column:1 / -1}.preset-card{padding:14px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);box-shadow:var(--shadow),var(--inset-hi)}.preset-card>header{display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center;margin-bottom:10px}.player-avatar,.account-orb{display:grid;place-items:center;border-radius:10px;background:#79b8ff24;color:var(--accent);font-weight:650}.player-avatar{width:38px;height:38px;font-size:15px}.preset-card h2{margin:0 0 2px;font-size:14px}.preset-card header p{margin:0;color:var(--faint);font-size:11px;font-family:var(--mono)}.tier-chip{padding:3px 8px;border:1px solid var(--line);border-radius:var(--r-xs);background:var(--surface-3);color:var(--muted);font-size:11px;white-space:nowrap}.role-chips{margin-bottom:10px;display:flex;gap:5px;flex-wrap:wrap}.role-chips span{padding:2px 8px;border-radius:var(--r-xs);background:var(--blue-soft);border:1px solid rgba(91,168,255,.18);color:var(--muted);font-size:11px}.pool-preview{min-height:40px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}.pool-preview>div{display:grid;justify-items:center;gap:2px}.pool-preview .champion-avatar img{width:32px;height:32px;border-radius:var(--r-sm)}.pool-preview small{color:var(--accent);font-size:8px;letter-spacing:-1px}.preset-card footer{margin-top:12px;padding-top:12px;display:flex;justify-content:space-between;border-top:1px solid var(--line-soft)}.empty-state{min-height:180px;display:grid;place-items:center;align-content:center;gap:8px;border:1px dashed var(--line);border-radius:var(--r-lg);color:var(--muted)}.empty-state>span{font-size:26px;opacity:.4}.empty-state p{margin:0;font-size:13px}.editor-sheet{position:fixed;z-index:50;top:14px;right:14px;bottom:14px;width:min(680px,calc(100vw - 28px));padding:20px;overflow:auto;border:1px solid var(--line-strong);border-radius:var(--r-xl);background:var(--surface-pop);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);box-shadow:var(--shadow-pop);animation:dfPopIn .2s var(--ease)}.form-grid{display:grid;grid-template-columns:1.2fr 1fr .7fr;gap:10px}.form-grid label,.auth-card label,.profile-form label{display:grid;gap:6px;color:var(--muted);font-size:12px;font-weight:500}.form-grid input,.form-grid select,.comp-board-head input,.auth-card input,.profile-form input{width:100%;height:40px;padding:0 11px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-2);color:var(--text)}.form-grid select option{background:var(--bg-2)}.field-group{margin:18px 0}.field-group>span{color:var(--muted);font-size:12px;font-weight:500}.style-sliders{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.style-sliders label{display:grid;gap:8px;color:var(--muted);font-size:12px}.style-sliders label span{display:flex;justify-content:space-between}.style-sliders b{color:var(--text);font-family:var(--mono)}input[type=range]{accent-color:var(--accent)}.pool-editor{margin-top:22px;padding-top:15px;border-top:1px solid var(--line-soft)}.pool-picker{max-height:310px;margin-top:10px;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:5px}.pool-picker>div{padding:6px;border:1px solid var(--line-soft);border-radius:var(--r-sm);background:var(--surface-2)}.pool-picker>div.selected{border-color:var(--accent-line);background:var(--accent-soft)}.pool-picker>div>button:first-child{width:100%;padding:0;display:flex;gap:6px;align-items:center;border:0;background:none;text-align:left}.pool-picker .champion-avatar img{width:30px;height:30px;border-radius:var(--r-xs)}.pool-picker span{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.comfort-stars{margin-top:5px;display:flex}.comfort-stars button{padding:1px 2px;border:0;background:none;color:var(--faint);font-size:9px}.comfort-stars button.active{color:var(--accent)}.sheet-actions{position:sticky;bottom:-20px;margin:20px -20px -20px;padding:14px 20px;justify-content:flex-end;border-top:1px solid var(--line);background:var(--surface-pop)}.composition-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:12px}.composition-board,.champion-pool-panel,.saved-section,.history-preview{padding:16px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);box-shadow:var(--shadow),var(--inset-hi)}.comp-board-head{margin-bottom:14px;display:flex;gap:9px}.composition-slots{display:grid;gap:8px}.composition-slot{min-height:74px;padding:9px 12px;display:grid;grid-template-columns:70px 1fr;align-items:center;border:1px dashed var(--line-strong);border-radius:var(--r-md);background:var(--surface-2);transition:.15s var(--ease)}.composition-slot.over{border-color:var(--accent);background:var(--accent-soft)}.composition-slot .role-label{color:var(--muted);font-size:12px;font-weight:500}.drop-target{height:48px;display:grid;place-items:center;color:var(--faint);font-size:20px}.composition-slot>button{padding:0;display:flex;gap:10px;align-items:center;border:0;background:none;text-align:left}.composition-slot>button b{font-size:13px}.composition-slot>button small{margin-left:auto;color:var(--faint);font-size:16px}.composition-slot .champion-avatar img{width:48px;height:48px}.drag-pool{max-height:550px;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:5px;margin-top:10px}.drag-champion{padding:6px 3px;display:grid;justify-items:center;gap:4px;border:1px solid transparent;border-radius:var(--r-sm);background:transparent;color:var(--muted);font-size:11px;touch-action:none}.drag-champion:hover{border-color:var(--line);background:#ffffff0a}.drag-champion.dragging{z-index:60;border-color:var(--accent);background:var(--bg-3);box-shadow:var(--shadow)}.drag-champion .champion-avatar img{width:44px;height:44px}.saved-section{margin-top:12px}.saved-comps{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}.saved-comp{padding:11px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-2);color:var(--text);text-align:left;transition:border-color .14s var(--ease),background .14s var(--ease)}.saved-comp:hover{border-color:var(--line-strong);background:#ffffff0a}.saved-comp h3{margin-bottom:9px;font-size:13px}.saved-comp>div{display:flex;gap:4px}.saved-comp .champion-avatar img,.saved-comp .champion-avatar.placeholder{width:32px;height:32px;border-radius:var(--r-sm)}.saved-comp>small{color:var(--faint);font-size:11px}.history-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:12px}.history-list{display:grid;align-content:start;gap:6px}.history-list>button{min-height:60px;padding:11px 14px;display:grid;grid-template-columns:3px 1fr auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);text-align:left;transition:background .14s var(--ease),border-color .14s var(--ease)}.history-list>button:hover,.history-list>button.active{border-color:var(--line-strong);background:#ffffff0a}.history-side{width:3px;height:32px;border-radius:2px;background:var(--blue)}.history-side.red{background:var(--red)}.history-list b{display:block;margin-bottom:3px;font-size:13px}.history-list small{color:var(--muted);font-size:11px}.history-list>button>span:last-child{color:var(--faint)}.history-preview h2{font-size:16px;margin:4px 0 12px}.preview-team{margin-top:14px;padding:12px;border:1px solid var(--line);border-radius:var(--r-md)}.preview-team.blue{border-left:2px solid var(--blue)}.preview-team.red{border-left:2px solid var(--red)}.preview-team h3{font-size:13px}.preview-team>div{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.preview-team>div>div{min-width:0;display:grid;gap:4px;justify-items:center}.preview-team small{color:var(--muted);font-size:11px}.preview-team .champion-avatar{display:grid;justify-items:center}.preview-team .champion-avatar img,.preview-team .champion-avatar.placeholder{width:44px;height:44px}.account-page{max-width:640px}.auth-card,.account-card{padding:20px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);box-shadow:var(--shadow),var(--inset-hi)}.auth-card{width:min(430px,100%);margin:24px auto 0}.auth-card h1,.account-card h1{margin:6px 0;font-size:22px;font-weight:650}.auth-card>p,.account-card>p{color:var(--muted);font-size:13px;line-height:1.5}.auth-tabs{margin:20px 0 15px;padding:3px;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-2)}.auth-tabs button{height:34px;border:0;border-radius:var(--r-xs);background:none;color:var(--muted);font-size:13px;font-weight:600}.auth-tabs button.active{background:var(--bg-3);color:var(--text)}.auth-card form{display:grid;gap:12px}.auth-card form .primary-button{margin-top:6px}.security-note{margin-top:16px;padding:10px;border:1px solid var(--success-line);border-radius:var(--r-sm);background:var(--success-soft);color:var(--muted);font-size:12px}.form-error{margin:0;color:var(--danger);font-size:12px}.account-card{display:flex;flex-direction:column;gap:4px}.account-orb{width:52px;height:52px;margin-bottom:8px;border-radius:14px;font-size:20px}.profile-form{margin-top:14px;display:grid;gap:10px}.import-card{margin-top:15px;padding:12px;border:1px solid var(--accent-line);border-radius:var(--r-md);background:var(--accent-soft)}.import-card b{font-size:13px}.import-card p{margin:5px 0 10px;color:var(--muted);font-size:12px;line-height:1.5}.import-card>div{display:flex;gap:7px;justify-content:flex-end}.account-card .danger-button{margin-top:16px;align-self:flex-start}@media(max-width:1240px){:root{--sidebar: var(--sidebar-collapsed)}.nav-label,.nav-foot{display:none}.nav-item{justify-content:center;padding-inline:0}.draft-grid{grid-template-columns:220px 1fr 220px}.rec-hero-avatar img,.rec-hero-avatar.placeholder{width:72px;height:72px}}@media(max-width:980px){.composition-layout,.history-layout{grid-template-columns:1fr}}@media(max-width:760px){.topbar-divider,.topbar-chips .chip:not(.side),.account-name{display:none}.topbar{gap:12px;padding:0 14px}.sidebar{display:none}.main-stage{padding:14px 12px 20px}.mobile-nav{flex:none;display:grid;grid-template-columns:repeat(6,1fr);gap:2px;padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:#111720e0;-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border-top:1px solid var(--line);position:sticky;bottom:0;z-index:25}.mobile-nav button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;min-height:44px;border:none;border-radius:var(--r-sm);background:transparent;color:var(--faint)}.mobile-nav button small{font-size:9px}.mobile-nav button.active{background:var(--accent-soft);color:var(--accent)}.mobile-tabs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;margin-bottom:12px;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md)}.mobile-tabs button{padding:8px;min-height:44px;border:none;border-radius:7px;background:transparent;color:var(--muted);font-size:13px;font-weight:500;transition:background .14s var(--ease),color .14s var(--ease)}.mobile-tabs button.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.draft-grid{grid-template-columns:1fr}.draft-col{display:none}.draft-grid[data-mv=blue] .col-blue,.draft-grid[data-mv=advice] .col-rail,.draft-grid[data-mv=red] .col-red{display:block}.col-rail{display:none}.draft-grid[data-mv=advice] .col-rail{display:flex}.champion-grid{grid-template-columns:repeat(4,1fr);max-height:58vh}.form-grid,.style-sliders,.preset-grid,.riot-import-card{grid-template-columns:1fr}.riot-import-controls{flex-direction:column}.editor-sheet{top:0;right:0;bottom:0;left:0;width:100%;border-radius:0}.ban-recs-list{flex-direction:column}}@media(max-width:420px){.champion-grid{grid-template-columns:repeat(3,1fr)}.draft-head-actions{width:100%}.rec-hero-body{flex-direction:column}}