:root{--layout-min-width:560px;--bg-main:#0d1322;--bg-gradient-top:#151d31;--bg-gradient-bottom:#0a1020;--panel-bg:#162034f0;--card-bg:#121b2df0;--card-bg-soft:#18243af2;--border-soft:#94a3b829;--border-strong:#f4b94259;--text-main:#f4f7ff;--text-muted:#9aa8c7;--gold:#f4b942;--gold-bright:#ffd166;--primary:var(--gold);--primary-hover:var(--gold-bright);--secondary:#7c5cff;--accent-blue:#4f8cff;--danger:#ef6b5b;--success:#55d6a7;--border-soft-mid:#94a3b838;--border-soft-strong:#94a3b847;--active-bg:linear-gradient(180deg, #f4b94238, #f4b9421a);--active-border:#f4b942b3;--primary-12:#f4b9421f;--primary-18:#f4b9422e;--primary-28:#f4b94247;--primary-45:#f4b94273;--accent-blue-10:#4f8cff1a;--accent-blue-18:#4f8cff2e;--accent-blue-35:#4f8cff59;--danger-10:#ef6b5b1a;--danger-18:#ef6b5b2e;--danger-45:#ef6b5b73;--success-12:#55d6a71f;--success-35:#55d6a759;--secondary-14:#7c5cff24;--panel-shadow:0 14px 42px #0000006b, inset 0 1px 0 #ffffff08;--panel-shadow-hero:0 18px 52px #0000007a, 0 0 0 1px #94a3b814, inset 0 1px 0 #ffffff0d;--avatar-shadow:0 6px 18px #0000006b;--avatar-ring:#f4f7ff24;color:var(--text-main);background:var(--bg-main);font-synthesis:none;text-rendering:optimizelegibility;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{overflow-x:auto}body{min-width:var(--layout-min-width);background:radial-gradient(circle at top, #4f8cff14, transparent 34rem), linear-gradient(180deg, var(--bg-gradient-top) 0%, var(--bg-gradient-bottom) 100%);min-height:100vh;margin:0}button,input,select{font:inherit}button{cursor:pointer;border:0}button:disabled,select:disabled{cursor:not-allowed;opacity:.55}.app-shell{box-sizing:border-box;flex-direction:column;justify-content:center;width:min(1180px,100% - 32px);min-height:100vh;margin:0 auto;padding:24px 0;display:flex}h1,h2,p{margin-top:0}h2{margin-bottom:0;font-size:1.15rem}.draft-panel,.control-panel,.ai-recommend-panel,.error-banner{border:1px solid var(--border-soft);background:var(--card-bg);box-shadow:var(--panel-shadow);border-radius:24px}.hero-picker-panel{border:1px solid var(--border-soft-mid);background:linear-gradient(180deg, var(--card-bg-soft) 0%, var(--panel-bg) 100%);box-shadow:var(--panel-shadow-hero);border-radius:24px}.panel-heading span{color:var(--text-muted);font-size:.85rem;display:block}.error-banner{border-color:var(--danger-45);background:linear-gradient(180deg, #ef6b5b24, var(--card-bg));color:#ffd5cf;margin-bottom:18px;padding:16px 18px}.draft-grid{--ai-suggestions-panel-height:820px;--draft-hero-panel-height:820px;--ai-panel-width:160px;grid-template-columns:max-content max-content;justify-content:center;gap:18px;width:100%;display:grid}.control-panel,.hero-picker-panel,.ai-recommend-panel{padding:22px}.draft-panel{--draft-col-w:118px;--draft-pick-slot:56px;--draft-preban-slot:45px;box-sizing:border-box;width:max-content;height:var(--draft-hero-panel-height);grid-area:span 2/1;align-self:start;padding:16px;overflow-y:auto}.team-columns{grid-template-columns:repeat(2, var(--draft-col-w));gap:8px;display:grid}.team-column{min-width:0;width:var(--draft-col-w);border:1px solid var(--border-soft);background:var(--panel-bg);border-radius:18px;padding:8px 10px}.team-columns .team-column:first-child{background:linear-gradient(180deg, var(--accent-blue-10), var(--panel-bg));border-color:#4f8cff38}.team-columns .team-column:last-child{background:linear-gradient(180deg, var(--danger-10), var(--panel-bg));border-color:#ef6b5b33}.team-column>.panel-heading{justify-content:center;margin-bottom:10px}.team-column>.panel-heading h2{text-align:center}.preban-section{margin-bottom:18px}.section-label,.preban-section>span,.preban-column strong{color:var(--text-muted);font-size:.85rem;font-weight:700;display:block}.section-label,.preban-section>span{margin-bottom:10px}.preban-columns{grid-template-columns:repeat(2, var(--draft-col-w));gap:8px;display:grid}.preban-column{min-width:0;width:var(--draft-col-w);border:1px solid var(--border-soft);background:var(--panel-bg);border-radius:18px;padding:8px 10px}.preban-columns .preban-column:first-child{background:linear-gradient(180deg, var(--accent-blue-10), var(--panel-bg));border-color:#4f8cff33}.preban-columns .preban-column:last-child{background:linear-gradient(180deg, var(--danger-10), var(--panel-bg));border-color:#ef6b5b2e}.preban-columns .preban-column:first-child strong{color:#9ec5ff}.preban-columns .preban-column:last-child strong{color:#ffb4aa}.team-columns .team-column:first-child h2{color:#b8d4ff}.team-columns .team-column:last-child h2{color:#ffc2b8}.preban-column strong{text-align:center;margin-bottom:10px}.preban-slots{flex-direction:row;justify-content:center;align-items:center;gap:8px;display:flex}.panel-heading{justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;display:flex}.draft-heading{width:min(100%, calc(var(--draft-col-w) * 2 + 8px));max-width:100%}.draft-heading-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.draft-heading .panel-link-button{margin-top:0}.picker-row{grid-template-columns:1fr auto;gap:10px;display:grid}input,select{border:1px solid var(--border-soft-mid);background:var(--panel-bg);width:100%;color:var(--text-main);border-radius:14px;padding:12px 14px}input:focus,select:focus{border-color:var(--border-strong);box-shadow:0 0 0 2px var(--primary-12);outline:none}.pick-list{flex-direction:column;align-items:center;gap:10px;min-height:260px;margin-top:18px;display:flex}.empty-state{width:100%;color:var(--text-muted);margin:0;line-height:1.6}.pick-slot{flex:0 0 var(--draft-pick-slot);width:var(--draft-pick-slot);min-width:var(--draft-pick-slot);height:var(--draft-pick-slot);min-height:var(--draft-pick-slot);aspect-ratio:1;border:1px dashed var(--border-soft-mid);background:var(--panel-bg);border-radius:50%;place-items:center;display:grid;position:relative}.pick-slot.filled{background:0 0;border-color:#0000}.pick-slot.ban-protected{border-color:var(--success-35);box-shadow:0 0 0 2px var(--success-12)}.pick-slot.ban-protected.filled{box-shadow:none;background:0 0;border-color:#0000}.pick-slot.current-step{border-color:var(--primary-45);background:var(--primary-12);box-shadow:0 0 0 2px var(--primary-18)}.pick-slot.current-step.filled{box-shadow:none;background:0 0;border-color:#0000}.pick-slot.current-step.filled .hero-avatar,.pick-slot.current-step.filled .avatar-fallback{border-color:var(--primary);box-shadow:var(--avatar-shadow), 0 0 0 2px var(--primary-28)}.pick-slot.current-step.ban-protected{border-color:var(--primary-45)}.pick-slot.ban-protected.filled .hero-avatar,.pick-slot.ban-protected.filled .avatar-fallback{border-color:var(--success);box-shadow:var(--avatar-shadow), 0 0 0 2px var(--success-12)}.pick-slot-hero{width:var(--draft-pick-slot);height:var(--draft-pick-slot);position:relative}.pick-slot-hero .hero-avatar.small,.pick-slot-hero .avatar-fallback.small{box-sizing:border-box;width:100%;height:100%;font-size:.85rem}.pick-slot-hero.banned .hero-avatar,.pick-slot-hero.banned .avatar-fallback{box-shadow:none;border-color:#0000}.pick-slot-ban-badge{box-sizing:border-box;color:#fff5f3;pointer-events:none;z-index:1;background:#ef6b5b94;border:1px solid #ef6b5bbf;border-radius:50%;place-items:center;display:grid;position:absolute;inset:0}.pick-slot-ban-badge svg{width:58%;height:58%}.preban-slot{flex:0 0 var(--draft-preban-slot);flex-basis:var(--draft-preban-slot);width:var(--draft-preban-slot);min-width:var(--draft-preban-slot);height:var(--draft-preban-slot);min-height:var(--draft-preban-slot);box-sizing:border-box}.pick-slot.preban-slot.current-step:not(.filled){box-shadow:none}.pick-slot .hero-avatar.small,.pick-slot .avatar-fallback.small{box-sizing:border-box;width:var(--draft-pick-slot);height:var(--draft-pick-slot);font-size:.85rem}.preban-slot .hero-avatar.small,.preban-slot .avatar-fallback.small{width:var(--draft-preban-slot);height:var(--draft-preban-slot);font-size:.7rem}.picker-columns{flex-direction:row;grid-area:span 2/2;align-items:stretch;gap:18px;min-width:0;display:flex}.control-panel{grid-column:1/-1}.settings-heading{justify-content:space-between;align-items:center;gap:16px;display:flex}.settings-heading h2{margin-bottom:0}.language-controls{flex-shrink:0;align-items:center;gap:8px;display:inline-flex}.language-label{color:var(--text-muted);font-size:.85rem;font-weight:600}.language-controls>button{border:1px solid var(--border-soft-mid);background:var(--panel-bg);color:var(--text-muted);border-radius:999px;padding:8px 14px;font-weight:700;transition:border-color .15s,background .15s,color .15s}.language-controls>button:hover:not(:disabled):not(.active){border-color:var(--border-soft-strong);color:var(--text-main)}.language-menu-mobile,.first-pick-menu-mobile,.filter-menu-mobile,.filter-menu-row{display:none}.hero-picker-panel{--hero-picker-cols:4;--hero-picker-gap:18px;--picker-avatar:78px;--picker-cell:88px;--picker-avatar-font:1rem;--hero-scroll-gutter:16px;--hero-inner-width:calc(var(--hero-picker-cols) * var(--picker-cell) + (var(--hero-picker-cols) - 1) * var(--hero-picker-gap));--filter-tag-btn:42px;--filter-tag-icon:28px;--filter-tag-gap:8px;--filter-tag-radius:12px;--filter-tag-pad-block:6px;--filter-tag-pad-inline:10px;min-height:0;width:calc(var(--hero-inner-width) + 44px + var(--hero-scroll-gutter));min-width:calc(var(--hero-inner-width) + 44px + var(--hero-scroll-gutter));box-sizing:border-box;max-width:100%;height:var(--draft-hero-panel-height);flex-direction:column;flex:none;display:flex;overflow:hidden;container:hero-picker/inline-size}.hero-picker-panel>.panel-heading{flex-shrink:0}.ai-recommend-panel{width:var(--ai-panel-width);box-sizing:border-box;max-width:100%;height:var(--ai-suggestions-panel-height);--ai-list-avatar:56px;--ai-list-avatar-font:.85rem;flex-direction:column;flex:none;align-self:flex-start;min-height:0;margin-inline:0;padding:16px 12px;display:flex;overflow:hidden}.ai-recommend-panel .panel-heading{flex-shrink:0;margin-bottom:12px}.ai-recommend-error{color:#ffd5cf;overflow-wrap:anywhere;flex-shrink:0;margin:0 0 12px;font-size:.85rem;line-height:1.45}.ai-recommend-meta{color:var(--text-muted);flex-shrink:0;margin-bottom:12px;font-size:.85rem;line-height:1.45}.ai-recommend-meta strong{color:var(--text-main);font-weight:700}.ai-recommend-list{scrollbar-width:none;-ms-overflow-style:none;flex-direction:column;flex:auto;gap:8px;min-height:0;display:flex;overflow-y:auto}.ai-recommend-list::-webkit-scrollbar{width:0;height:0;display:none}.ai-recommend-completed{min-height:120px;color:var(--primary);letter-spacing:.06em;flex:1;justify-content:center;align-items:center;margin:0;font-size:1.05rem;font-weight:700;display:flex}.ai-recommend-card{width:100%;color:var(--text-main);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:12px;grid-template-columns:auto max-content;justify-content:start;align-items:center;gap:10px;margin:0;padding:4px 0;transition:background .15s;display:grid}.ai-recommend-card:hover:not(:disabled){background:var(--panel-bg)}.ai-recommend-card:disabled{cursor:not-allowed;opacity:.45}.ai-recommend-card.ban-suggestion-selected:not(:disabled){background:var(--primary-12);outline-offset:0;border-radius:12px;outline:1px solid #f4b9426b}.ai-recommend-card .hero-avatar.small,.ai-recommend-card .avatar-fallback.small{width:var(--ai-list-avatar);height:var(--ai-list-avatar);font-size:var(--ai-list-avatar-font);border:1px solid var(--avatar-ring)}.ai-recommend-meta{flex-direction:column;align-items:flex-start;gap:2px;display:flex}.ai-recommend-pct{font-variant-numeric:tabular-nums;letter-spacing:.02em;color:var(--text-muted);text-align:left;font-size:.9rem;font-weight:800}.ban-priority-label{letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);background:#26344f73;border-radius:999px;padding:1px 6px;font-size:.62rem;font-weight:800;line-height:1.2}.ban-priority-label.rank-1{color:var(--gold-bright);background:#f4b94229}.ban-priority-label.rank-2{color:#9ec5ff;background:var(--accent-blue-18)}.ban-priority-label.rank-3{color:#c4b8ff;background:var(--secondary-14)}.hero-picker-body{box-sizing:border-box;flex-direction:column;flex:1 1 0;align-items:flex-start;width:100%;min-height:0;display:flex;overflow:hidden}.first-pick-controls{flex-wrap:nowrap;align-items:center;gap:10px;width:100%;margin-top:18px;display:flex}.preban-settings{flex:none;align-items:center;gap:12px;min-width:0;display:flex}.first-pick-controls>button:not(.ios-switch){flex:1 1 0;min-width:0}.preban-toggle-row{justify-content:space-between;align-items:center;gap:10px;width:100%;display:flex}.preban-toggle-label{color:var(--text-muted);font-size:inherit;flex:1;min-width:0;font-weight:700}.mobile-preban-toggle{display:none}.desktop-preban-toggle{justify-content:flex-start;width:max-content}.desktop-preban-toggle .preban-toggle-label{flex:none}.preban-toggle-options{border:1px solid var(--border-soft-mid);background:var(--panel-bg);box-sizing:border-box;border-radius:999px;flex-shrink:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;min-width:96px;padding:4px;display:grid}.preban-toggle-options button{color:var(--text-muted);font-size:inherit;background:0 0;border:0;border-radius:999px;padding:4px 8px;font-weight:800}.ios-switch{box-sizing:border-box;cursor:pointer;background:#7878805c;border:0;border-radius:999px;flex-shrink:0;align-items:center;width:51px;min-width:51px;max-width:51px;height:31px;padding:2px;transition:background .2s;display:inline-flex;position:relative;overflow:hidden}.ios-switch.on{background:#34c759}.ios-switch-thumb{background:#fff;border-radius:50%;flex-shrink:0;width:27px;height:27px;margin-left:0;transition:margin .2s;display:block;box-shadow:0 2px 6px #00000047}.ios-switch.on .ios-switch-thumb{margin-left:auto}.first-pick-controls>button:not(.ios-switch),.preban-memory-options button,.panel-link-button{border:1px solid var(--border-soft-mid);background:var(--panel-bg);color:var(--text-muted);border-radius:14px;padding:12px 14px;font-weight:700;transition:border-color .15s,background .15s,color .15s}.first-pick-controls>button:not(.ios-switch):hover:not(:disabled):not(.active),.preban-memory-options button:hover:not(:disabled):not(.active),.panel-link-button:hover:not(:disabled){border-color:var(--border-soft-strong);color:var(--text-main)}.language-controls>button.active,.first-pick-controls>button.active:not(.ios-switch),.preban-toggle-options button.active,.preban-memory-options button.active,.warfare-rule-controls button.active{border-color:var(--active-border);background:var(--active-bg);color:var(--gold-bright)}.preban-memory-options{box-sizing:border-box;background:0 0;border:0;border-radius:0;flex:none;gap:6px;padding:0;display:flex}.preban-memory-options.is-hidden{visibility:hidden;pointer-events:none}.preban-memory-options button{font-size:inherit}.warfare-rule-section{gap:8px;margin-top:16px;display:grid}.warfare-rule-label{color:var(--text-muted);font-size:inherit;font-weight:600}.warfare-rule-controls{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.warfare-rule-controls button{border:1px solid var(--border-soft-mid);background:var(--panel-bg);color:var(--text-muted);font-weight:700;font-size:inherit;border-radius:14px;padding:12px 8px;transition:border-color .15s,background .15s,color .15s}.warfare-rule-controls button:hover:not(:disabled):not(.active){border-color:var(--border-soft-strong);color:var(--text-main)}.warfare-rule-mobile{display:none;position:relative}.compact-menu-button{border:1px solid var(--border-soft-mid);background:var(--panel-bg);width:100%;color:var(--text-muted);border-radius:14px;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;font-weight:700;display:flex}.compact-menu-button span:last-child{font-size:1.15rem;line-height:1}.compact-menu{z-index:10;border:1px solid var(--border-soft-mid);box-shadow:var(--panel-shadow);background:#121b2dfa;border-radius:16px;gap:4px;padding:6px;display:grid;position:absolute;top:calc(100% + 6px);left:0;right:0}.compact-menu button{width:100%;color:var(--text-muted);text-align:left;background:0 0;border:1px solid #0000;border-radius:12px;padding:10px 12px;font-weight:700}.compact-menu button.active{border-color:var(--active-border);background:var(--active-bg);color:var(--gold-bright)}.panel-link-button{color:var(--text-muted);background:0 0;border-radius:999px;margin-top:16px;padding:9px 14px}.panel-link-button:hover:not(:disabled){color:var(--primary);border-color:#f4b94259}.filters{box-sizing:border-box;flex-shrink:0;grid-template-columns:1fr;align-self:stretch;gap:12px;width:100%;margin-bottom:18px;display:grid}.icon-filter-group{gap:var(--filter-tag-gap);flex-wrap:wrap;display:flex}.icon-filter-group button{min-width:var(--filter-tag-btn);height:var(--filter-tag-btn);border:1px solid var(--border-soft-mid);border-radius:var(--filter-tag-radius);background:var(--panel-bg);color:var(--text-muted);padding:var(--filter-tag-pad-block) var(--filter-tag-pad-inline);place-items:center;font-weight:800;transition:border-color .15s,background .15s,color .15s;display:inline-grid}.icon-filter-group button:hover:not(:disabled):not(.active){border-color:var(--border-soft-strong);color:var(--text-main)}.icon-filter-group button.active{background:var(--secondary-14);color:#d8ccff;border-color:#7c5cff73}.icon-filter-group img{width:var(--filter-tag-icon);height:var(--filter-tag-icon);object-fit:contain}.hero-grid{grid-template-columns:repeat(var(--hero-picker-cols), minmax(var(--picker-cell), var(--picker-cell)));grid-auto-rows:minmax(var(--picker-cell), auto);align-items:start;gap:var(--hero-picker-gap);width:max-content;max-width:100%;min-height:0;min-width:min(100%, calc(var(--hero-inner-width) + var(--hero-scroll-gutter)));padding:6px var(--hero-scroll-gutter) 10px 0;box-sizing:border-box;flex:1 1 0;place-content:start;display:grid;overflow:hidden auto}.hero-card{min-width:var(--picker-cell);min-height:var(--picker-cell);color:var(--text-main);text-align:center;background:0 0;border:none;border-radius:18px;place-items:center;gap:0;padding:4px;display:grid;position:relative}.hero-card:hover:not(:disabled){transform:translateY(-2px)}.hero-card:hover:not(:disabled) .hero-avatar,.hero-card:hover:not(:disabled) .avatar-fallback{box-shadow:var(--avatar-shadow), 0 0 0 2px var(--primary-12);border-color:#f4b94259}.hero-card .hero-avatar,.hero-card .avatar-fallback{border:1px solid var(--avatar-ring)}.hero-card .hero-avatar.large,.hero-card .avatar-fallback.large{width:var(--picker-avatar);height:var(--picker-avatar);font-size:var(--picker-avatar-font)}.hero-card strong{background:var(--panel-bg);border:1px solid var(--border-soft-mid);color:var(--gold-bright);border-radius:999px;padding:4px 8px;font-size:.72rem;position:absolute;top:8px;right:8px}@container hero-picker (width<=420px){.hero-picker-panel{--picker-avatar:56px;--picker-cell:64px;--picker-avatar-font:.85rem;--filter-tag-btn:32px;--filter-tag-icon:22px;--filter-tag-gap:6px;--filter-tag-radius:10px;--filter-tag-pad-block:4px;--filter-tag-pad-inline:8px;--hero-inner-width:calc(var(--hero-picker-cols) * var(--picker-cell) + (var(--hero-picker-cols) - 1) * var(--hero-picker-gap))}}.hero-avatar,.avatar-fallback{border:1px solid var(--avatar-ring);color:#d6e4ff;object-fit:cover;box-shadow:var(--avatar-shadow);background:linear-gradient(145deg,#1a2740,#243552);border-radius:999px;place-items:center;font-weight:800;transition:border-color .15s,box-shadow .15s,transform .15s;display:inline-grid}.hero-avatar.large,.avatar-fallback.large{width:78px;height:78px;font-size:1rem}.hero-avatar.small,.avatar-fallback.small{flex:none;width:56px;height:56px;font-size:.85rem}code{color:var(--accent-blue)}h1,h2{color:var(--text-main)}@media (width<=960px) and (width>=821px){.hero-picker-panel{--hero-picker-cols:3;--hero-picker-gap:16px;--hero-inner-width:calc(var(--hero-picker-cols) * var(--picker-cell) + (var(--hero-picker-cols) - 1) * var(--hero-picker-gap));width:calc(var(--hero-inner-width) + 44px + var(--hero-scroll-gutter));min-width:calc(var(--hero-inner-width) + 44px + var(--hero-scroll-gutter))}.draft-grid,.picker-columns{gap:10px}}@media (width<=820px){.app-shell{width:min(100% - 20px,1180px);padding:28px 0}.draft-grid{grid-template-columns:minmax(0,max-content) minmax(0,max-content) minmax(0,max-content);justify-content:center;align-items:stretch;gap:8px}.control-panel{grid-area:1/1/auto/-1}.picker-columns{display:contents}.draft-panel{--draft-col-w:100px;--draft-pick-slot:46px;--draft-preban-slot:40px;grid-area:2/1;min-width:0;max-width:100%;overflow-x:auto}.hero-picker-panel{--hero-picker-cols:2;--hero-picker-gap:12px;--picker-avatar:60px;--picker-cell:68px;--picker-avatar-font:.85rem;--filter-tag-btn:32px;--filter-tag-icon:22px;--filter-tag-gap:6px;--filter-tag-radius:10px;--filter-tag-pad-block:4px;--filter-tag-pad-inline:8px;--hero-inner-width:calc(var(--hero-picker-cols) * var(--picker-cell) + (var(--hero-picker-cols) - 1) * var(--hero-picker-gap));width:calc(var(--hero-inner-width) + 44px + var(--hero-scroll-gutter));flex:none;grid-area:2/2;min-width:0;max-width:100%}.ai-recommend-panel{grid-area:2/3;align-self:start;margin-inline:0}.pick-list{min-height:260px}.picker-row,.filters{grid-template-columns:1fr}}@media (width<=720px){:root{--layout-min-width:0px}html{overflow-x:hidden}body{min-width:0;overflow-x:hidden}.app-shell{justify-content:flex-start;width:calc(100% - 16px);padding:12px 0 20px}.draft-grid{--ai-suggestions-panel-height:auto;--draft-hero-panel-height:auto;grid-template-columns:minmax(0,2fr) minmax(0,3fr);justify-content:stretch;align-items:stretch;gap:12px 8px}.control-panel,.draft-panel,.hero-picker-panel,.ai-recommend-panel{border-radius:18px;padding:16px}.control-panel{--mobile-menu-control-width:92px;--mobile-setting-label-font:16px;--mobile-menu-font:16px;--mobile-setting-gap:16px;grid-area:1/1/auto/-1;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 8px;display:grid}.settings-heading{display:contents}.settings-heading h2{grid-area:1/1/auto/-1}.language-controls>button{display:none}.language-controls{justify-content:flex-start;align-items:center;gap:var(--mobile-setting-gap);grid-area:2/1;width:max-content;min-width:0;max-width:100%;display:flex}.language-label,.first-pick-menu-mobile,.preban-toggle-label,.warfare-rule-label{font-size:var(--mobile-setting-label-font);font-weight:700;line-height:1}.language-menu-mobile{min-width:0;display:block;position:relative}.first-pick-controls{display:contents}.first-pick-controls>button:first-of-type,.first-pick-controls>button:nth-of-type(2){display:none}.first-pick-menu-mobile{justify-content:flex-start;align-items:center;gap:var(--mobile-setting-gap);color:var(--text-muted);grid-area:2/2;width:max-content;max-width:100%;font-weight:700;display:flex}.first-pick-menu-control{width:var(--mobile-menu-control-width);min-width:var(--mobile-menu-control-width);position:relative}.compact-menu-button{width:var(--mobile-menu-control-width);min-width:var(--mobile-menu-control-width);box-sizing:border-box;height:28px;min-height:28px;font-size:var(--mobile-menu-font);border-radius:10px;align-items:center;gap:6px;padding:0 8px;line-height:1}.compact-menu-button span:first-child{align-items:center;min-height:1em;line-height:1;display:inline-flex}.compact-menu-button span:last-child{justify-content:center;align-items:center;font-size:16px;line-height:1;display:inline-flex}.compact-menu{border-radius:12px;gap:2px;padding:4px;top:calc(100% + 4px)}.compact-menu button{box-sizing:border-box;height:28px;min-height:28px;font-size:var(--mobile-menu-font);border-radius:9px;align-items:center;padding:0 8px;line-height:1;display:flex}.preban-settings{display:contents}.preban-toggle-row{grid-area:3/1;width:max-content;min-width:0;max-width:100%}.desktop-preban-toggle{display:none}.mobile-preban-toggle{justify-content:flex-start;gap:var(--mobile-setting-gap);width:max-content;max-width:100%;display:flex}.mobile-preban-toggle .preban-toggle-label{flex:none}.ios-switch{width:46px;min-width:46px;max-width:46px;height:28px}.ios-switch-thumb{width:24px;height:24px}.preban-memory-options{grid-area:4/1/auto/-1;grid-template-columns:repeat(2,minmax(0,1fr));width:auto;display:grid}.preban-memory-options button{font-size:16px}.preban-memory-options.is-hidden{visibility:visible;display:none}.warfare-rule-section{justify-content:flex-start;align-items:center;gap:var(--mobile-setting-gap);grid-area:3/2;width:max-content;max-width:100%;margin-top:0;display:flex}.warfare-rule-label{white-space:nowrap}.warfare-rule-mobile{width:var(--mobile-menu-control-width);min-width:var(--mobile-menu-control-width)}.warfare-rule-controls{display:none}.warfare-rule-mobile{display:block}.picker-columns{grid-column:1;display:contents}.draft-panel{box-sizing:border-box;--draft-col-w:64px;--draft-pick-slot:56px;--draft-preban-slot:56px;grid-area:3/1;align-self:stretch;width:100%;max-width:100%;height:auto;max-height:none;overflow:visible}.draft-heading{width:100%}.team-columns,.preban-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%}.team-column{box-sizing:border-box;width:100%}.preban-column{box-sizing:border-box;flex-direction:column;align-items:center;gap:10px;width:100%;padding:8px;display:flex}.preban-column strong{text-align:center;white-space:nowrap;margin-bottom:0}.preban-slots{flex-direction:column;justify-content:center;gap:8px}.pick-list{min-height:0}.filters{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}.filters>input{grid-column:1;min-width:0}.filter-group-desktop{display:none}.filter-menu-row{--filter-menu-control-width:calc(var(--mobile-menu-control-width) * 2);flex-wrap:nowrap;grid-column:2;align-items:center;gap:8px;display:flex}.filter-menu-mobile{width:var(--filter-menu-control-width);min-width:var(--filter-menu-control-width);display:block;position:relative}.filter-menu-mobile .compact-menu-button{width:var(--filter-menu-control-width);min-width:var(--filter-menu-control-width);height:44px;min-height:44px}.filter-menu-mobile .compact-menu-button span:first-child{gap:8px}.filter-menu-mobile .compact-menu button{gap:8px;height:44px;min-height:44px}.filter-menu-mobile .compact-menu-icon{width:28px;height:28px}.compact-menu-icon{object-fit:contain;flex:none;width:18px;height:18px}.hero-picker-panel{--hero-picker-cols:3;--hero-picker-gap:8px;--picker-avatar:64px;--picker-cell:72px;--picker-avatar-font:.9rem;--filter-tag-btn:34px;--filter-tag-icon:22px;--filter-tag-gap:6px;--hero-scroll-gutter:0px;--hero-inner-width:calc(var(--hero-picker-cols) * var(--picker-cell) + (var(--hero-picker-cols) - 1) * var(--hero-picker-gap));box-sizing:border-box;grid-area:3/2;align-self:stretch;width:100%;min-width:0;max-width:100%;height:100%;min-height:0;overflow:hidden}.hero-picker-panel>.panel-heading span{display:none}.hero-picker-body{flex:auto;align-items:stretch;min-height:0;overflow:hidden}.hero-grid{grid-template-columns:repeat(auto-fill, minmax(max(var(--picker-cell), calc((100% - 2 * var(--hero-picker-gap)) / 3)), 1fr));flex:auto;justify-content:start;width:100%;min-width:0;max-width:100%;min-height:0;max-height:min(78vh,640px);padding-right:0;overflow-y:auto}.ai-recommend-panel{width:100%;max-width:100%;height:var(--mobile-ai-recommend-panel-height,262px);max-height:var(--mobile-ai-recommend-panel-height,262px);--ai-list-avatar:52px;--ai-list-avatar-font:.8rem;grid-area:2/1/auto/-1;align-self:stretch;margin-inline:0;overflow:hidden;container:ai-recommend/inline-size}.ai-recommend-list{overscroll-behavior:none;touch-action:manipulation;scrollbar-width:none;-ms-overflow-style:none;flex:auto;grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:min-content;align-content:start;gap:8px 4px;min-height:0;padding-bottom:0;display:grid;overflow:hidden}.ai-recommend-list::-webkit-scrollbar{width:0;height:0;display:none}.ai-recommend-card{text-align:center;grid-template-columns:minmax(0,1fr);justify-items:center;width:auto;min-width:0;padding:4px 2px}.ai-recommend-meta{align-items:center}.ai-recommend-completed{width:100%;min-height:80px}}@media (width<=600px){.app-shell{width:calc(100% - 12px);padding:10px 0 16px}.draft-grid,.picker-columns{gap:10px}.draft-panel{--draft-col-w:60px;--draft-pick-slot:52px;--draft-preban-slot:52px;padding:10px}.hero-picker-panel{--picker-avatar:60px;--picker-cell:68px;--picker-avatar-font:.86rem;--hero-picker-gap:6px;--filter-tag-btn:30px;--filter-tag-icon:20px;--filter-tag-gap:5px;--filter-tag-radius:9px;--filter-tag-pad-block:3px;--filter-tag-pad-inline:7px;--hero-inner-width:calc(var(--hero-picker-cols) * var(--picker-cell) + (var(--hero-picker-cols) - 1) * var(--hero-picker-gap))}.ai-recommend-panel{--mobile-ai-recommend-panel-height:252px;--ai-list-avatar:47px;--ai-list-avatar-font:.78rem}.first-pick-controls>button:not(.ios-switch),.panel-link-button{padding:10px 12px;font-size:.88rem}}@media (width<=380px){.draft-panel{--draft-col-w:58px;--draft-pick-slot:50px;--draft-preban-slot:50px}.hero-picker-panel{--picker-avatar:58px;--picker-cell:66px}.warfare-rule-controls button{padding:7px 1px;font-size:.68rem}}