:root{color-scheme:dark;--bg:#0d0d0e;--panel:#19191b;--panel2:#222225;--line:#303034;--text:#f6f4ef;--sub:#88888d;--light:#d5d0c3;--curve:cubic-bezier(.19,1,.22,1)}
*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{margin:0;min-height:100svh;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button,select,input{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--light);outline-offset:3px}svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linejoin:round;stroke-linecap:round}[hidden]{display:none!important}.app-shell{max-width:1600px;min-height:100svh;margin:auto;display:flex;flex-direction:column}.topbar{height:88px;border-bottom:1px solid #1d1d1f;padding:0 clamp(22px,4.4vw,78px);display:flex;align-items:center;justify-content:space-between;gap:12px}.brand-group{display:flex;align-items:center;gap:clamp(15px,2.7vw,39px);min-width:0}.logo{font-size:19px;line-height:1;font-weight:900;letter-spacing:-1.05px;text-decoration:none;color:var(--text);white-space:nowrap}.logo-dot{color:#a5a094}.brand-rule{height:24px;width:1px;background:#333336}.category-nav{display:flex;align-items:center;gap:4px;border-radius:10px;padding:4px;background:#19191b}.category{height:34px;padding:0 19px;border:0;background:transparent;color:#929196;font-size:12px;font-weight:650;border-radius:7px;transition:background .2s,color .2s}.category:hover{color:#f1f0ec}.category.active{color:var(--text);background:#343336;box-shadow:0 1px 3px #0004}.header-tools{display:flex;align-items:center;gap:3px}.round-label{color:#7f7d79;font-size:11px;font-weight:750;letter-spacing:1.2px;margin-right:17px;font-variant-numeric:tabular-nums}.icon-btn,.small-icon-btn{display:grid;place-items:center;border:0;color:#969599;background:transparent;border-radius:9px;transition:color .2s,background .2s}.icon-btn{height:39px;width:39px}.small-icon-btn{height:34px;width:34px}.icon-btn:hover,.small-icon-btn:hover{background:#232326;color:var(--text)}.small-icon-btn svg{width:17px;height:17px}.view{flex:1;display:grid;place-items:center;padding:26px clamp(12px,2.5vw,40px)}.battle{width:min(100%,895px);animation:opening .7s var(--curve) both}.battle-head{height:42px;margin:0 0 18px;display:flex;align-items:center;justify-content:space-between}.filter-wrap{display:flex;align-items:center;position:relative}.filter-wrap select{appearance:none;background:none;border:0;color:#e9e7e1;font-size:13px;font-weight:700;padding:10px 24px 10px 2px;cursor:pointer}.filter-wrap svg{position:absolute;right:3px;pointer-events:none;width:13px;height:13px;color:#88878b}.filter-wrap option,.picker-filters option{background:#202023}.battle-actions{display:flex;align-items:center;gap:13px}.text-btn{padding:9px 5px;color:#939398;font-size:12px;font-weight:680;border:0;background:transparent;transition:color .2s}.text-btn:hover{color:var(--text)}.toolbar-divider{width:1px;height:18px;background:#333338}.battle-stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2.4vw,27px);position:relative;isolation:isolate}.poster-card{height:min(62svh,608px);aspect-ratio:2/3;width:100%;max-width:404px;min-height:310px;position:relative;border:1px solid #323236;background:#202023;padding:0;border-radius:10px;overflow:hidden;box-shadow:0 22px 75px rgba(0,0,0,.33);transform:translateZ(0);transition:box-shadow .23s,border-color .23s;justify-self:center}.poster-card:hover:not(:disabled){box-shadow:0 25px 85px rgba(0,0,0,.63);border-color:#b6b2a7}.poster-card:active:not(:disabled){scale:.992}.poster-card.selected{border-color:#f5f2e6}.poster-img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;opacity:0;transition:opacity .3s ease,transform .65s var(--curve);background:linear-gradient(145deg,#333336,#171719)}.poster-img.ready{opacity:1}.poster-card:hover:not(:disabled) .poster-img{transform:scale(1.025)}.poster-img.failed{opacity:0}.poster-card.is-fallback::after{content:attr(data-fallback);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:26px;color:#9999a0;font-size:clamp(14px,1.8vw,22px);font-weight:800;letter-spacing:-.3px;text-align:center;line-height:1.3}.vote-corner{position:absolute;inset:auto 13px 13px auto;z-index:2;width:33px;height:33px;border-radius:50%;background:#f4f3ec;color:#111;display:grid;place-items:center;opacity:0;transform:scale(.7);transition:opacity .15s,transform .2s}.vote-corner svg{width:16px;height:16px;stroke-width:2.5}.selected .vote-corner{opacity:1;transform:scale(1)}.center-vs{position:absolute;z-index:3;pointer-events:none;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:57px;height:57px;background:#0d0d0e;border:1px solid #363638;border-radius:50%;font-size:11px;font-weight:900;letter-spacing:.5px;color:#c0bcb1}.result-pop{position:absolute;z-index:10;left:50%;bottom:25px;transform:translateX(-50%);background:#131315ed;box-shadow:0 14px 46px #000b;border:1px solid #4b4844;border-radius:12px;padding:14px 18px;min-width:182px;display:flex;flex-direction:column;align-items:center;gap:3px;animation:result-in .3s var(--curve)}.result-pop strong{font-size:28px;letter-spacing:-1.4px;font-weight:850}.result-pop span{font-size:11px;color:#afadb0;white-space:nowrap}.battle-bottom{min-height:50px;display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:15px}.bottom-btn{display:flex;align-items:center;gap:8px;color:#88888c;font-size:12px;font-weight:650;border:0;background:transparent;padding:12px 2px;transition:color .2s;white-space:nowrap}.bottom-btn:hover{color:#e9e7e1}.bottom-btn svg{height:17px;width:17px}.previous-vote{font-size:11px;color:#77777c;text-align:center;line-height:1.4}.footer{height:64px;display:flex;justify-content:space-between;align-items:center;padding:0 clamp(22px,4.4vw,78px);font-size:10px;color:#6a6a71;letter-spacing:1.3px;font-weight:750}.server-state{display:flex;align-items:center;gap:8px}.server-state i{height:6px;width:6px;border-radius:50%;background:#77777d}.server-state.online i{background:#8ba58f}.server-state.online{color:#8ba58f}.overlay{position:fixed;z-index:25;inset:0;display:flex;justify-content:center;align-items:center;padding:16px;background:#050506cb;backdrop-filter:blur(12px);animation:fade-in .18s}.modal{background:#1a1a1d;border:1px solid #353538;box-shadow:0 30px 100px #000d;border-radius:17px;padding:25px;animation:modal-in .29s var(--curve)}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:12px}.modal-head h2{font-size:19px;letter-spacing:-.5px;font-weight:780;margin:0}.modal-head .icon-btn{background:#242427;width:34px;height:34px}.chooser{width:min(95vw,688px);height:min(90dvh,810px);display:flex;flex-direction:column;min-height:440px}.chosen-previews{height:103px;display:flex;align-items:center;justify-content:center;gap:20px;margin:0 0 17px}.chosen-previews b{font-size:10px;color:#737177;letter-spacing:.5px}.chosen{height:97px;width:68px;border:2px solid transparent;padding:0;background:#303033;border-radius:8px;overflow:hidden;opacity:.62;transition:opacity .2s,border-color .2s,transform .2s}.chosen.active{opacity:1;border-color:#d6d0c4;transform:translateY(-2px)}.chosen img{width:100%;height:100%;object-fit:cover}.search-box{height:48px;border:1px solid #39393e;background:#27272b;border-radius:9px;display:flex;align-items:center;gap:12px;padding:0 13px}.search-box svg{width:17px;height:17px;color:#9f9ea3}.search-box input{background:transparent;color:var(--text);border:0;outline:0;width:100%;height:100%;font-size:14px}.search-box input::placeholder{color:#818186}.picker-filters{display:flex;justify-content:space-between;align-items:center;gap:12px;height:49px;font-weight:700;font-size:10px;letter-spacing:1.05px;color:#74747b}.picker-filters select{background:transparent;border:0;color:#d2d0ce;font-size:12px;letter-spacing:0;padding:9px 3px;max-width:52%}.search-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;overflow:auto;align-content:start;flex:1;min-height:0;padding:0 4px 6px 0;scrollbar-color:#444449 transparent;scrollbar-width:thin}.search-entry{position:relative;aspect-ratio:2/3;border:1px solid #343439;border-radius:7px;background:#2b2b2e;overflow:hidden;padding:0;transition:transform .22s var(--curve),border-color .22s}.search-entry:hover{transform:translateY(-3px);border-color:#d2cbbc}.search-entry img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .2s}.search-entry img.ready{opacity:1}.search-entry.in-match{border:2px solid #b7b4ab}.search-entry.in-match::after{content:'✓';position:absolute;right:4px;top:4px;width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:#eeece3;color:#151516;font-size:13px;font-weight:900}.search-entry.no-img::before{content:attr(data-name);position:absolute;inset:0;padding:10px;display:flex;justify-content:center;align-items:center;text-align:center;color:#a7a5a9;font-size:11px;font-weight:700}.apply-btn{display:flex;align-items:center;justify-content:center;gap:12px;background:#e2ded5;border:0;border-radius:9px;height:47px;flex-shrink:0;margin-top:17px;font-size:13px;font-weight:800;color:#111113;transition:background .2s}.apply-btn:hover{background:#fff}.apply-btn svg{height:16px;width:16px}.drawer{width:min(95vw,495px);max-height:min(85dvh,720px);display:flex;flex-direction:column}.drawer-body{min-height:130px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#444449 transparent}.rank-row,.history-row{display:flex;align-items:center;gap:12px;border-bottom:1px solid #303034;padding:10px 0;min-width:0}.rank-number{width:22px;color:#81818a;font-size:11px;flex:none}.rank-poster,.history-row img{width:38px;height:55px;object-fit:cover;background:#242427;border-radius:5px;flex:none}.rank-name{font-weight:700;font-size:13px;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rank-stat{font-size:13px;font-weight:800;text-align:right;min-width:65px}.rank-stat small{display:block;font-weight:500;color:#88878e;font-size:10px;margin-top:4px}.history-row img:last-child{opacity:.45}.history-summary{flex:1;min-width:0;font-size:12px;font-weight:700}.history-summary small{display:block;font-size:11px;font-weight:500;color:#88878e;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.empty-list{color:#9d9ca0;line-height:1.6;font-size:13px;text-align:center;margin:45px 0}.clear-btn{border:1px solid #444447;border-radius:8px;padding:10px 14px;background:transparent;color:#ababaf;font-size:12px;margin-top:19px}.clear-btn:hover{color:#fff}.ghost-cover{position:fixed;z-index:50;pointer-events:none;border:1px solid #b8b2a7;border-radius:10px;overflow:hidden;background:#252529;box-shadow:0 30px 90px #000a}.ghost-cover img{display:block;width:100%;height:100%;object-fit:cover}
@keyframes opening{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes modal-in{from{opacity:0;transform:translateY(15px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes result-in{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}
@media(min-width:700px){.poster-card{max-height:clamp(410px,59svh,608px)}.battle{width:min(100%,850px)}.battle-stage{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:699px){.topbar{height:72px;padding:0 14px}.brand-group{gap:10px}.logo{font-size:16px}.brand-rule{height:17px}.category-nav{gap:1px;padding:3px}.category{height:31px;padding:0 11px;font-size:11px}.round-label{display:none}.header-tools{gap:0}.icon-btn{height:34px;width:32px}.header-tools .icon-btn svg{height:17px;width:17px}.view{padding:12px 12px;align-items:center}.battle-head{margin-bottom:12px}.battle-stage{gap:10px}.poster-card{height:auto;min-height:0;aspect-ratio:2/3.2;max-width:none;border-radius:8px}.center-vs{width:36px;height:36px;font-size:10px}.battle-bottom{margin-top:13px}.previous-vote{font-size:10px;max-width:130px}.bottom-btn{font-size:11px;gap:5px}.bottom-btn svg{width:14px}.footer{height:52px;padding:0 15px}.modal{padding:19px 16px;border-radius:13px}.chooser{height:94dvh;width:100%;min-height:0}.chosen-previews{height:81px;gap:14px;margin-bottom:12px}.chosen{width:54px;height:76px}.search-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.picker-filters{height:42px}.search-box{height:43px}.apply-btn{height:44px}.result-pop{min-width:130px;padding:11px;bottom:11px}.result-pop strong{font-size:22px}.result-pop span{font-size:9px}}
@media(max-width:395px){.logo{font-size:14px}.brand-group{gap:7px}.category{padding:0 8px}.header-tools .icon-btn{width:29px}.battle-stage{gap:8px}.footer{height:45px}.previous-vote{max-width:105px}}
@media(max-height:780px) and (min-width:700px){.topbar{height:70px}.view{padding:10px 22px}.poster-card{height:min(58svh,520px)}.footer{height:45px}.battle-head{margin-bottom:8px}.battle-bottom{margin-top:6px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* Constrain grid-cell images independent of network-loaded intrinsic dimensions. */
.search-grid{grid-auto-rows:min-content;align-items:start}
.search-entry{display:block;min-width:0;min-height:0;height:auto;width:100%;align-self:start;aspect-ratio:2/3}
.search-entry img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.chosen{position:relative}
.chosen.is-fallback img{visibility:hidden}
.chosen.is-fallback::after{content:attr(data-fallback);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:4px;font-size:9px;color:#adabb0;line-height:1.2;overflow-wrap:anywhere}