:root{--cp-bg:#070914;--cp-panel:#11182b;--cp-panel2:#151e34;--cp-line:#2b3a5b;--cp-yellow:#ffd026;--cp-cyan:#21c6ff;--cp-pink:#ff3f83;--cp-green:#3ce68a;--cp-text:#f7f8ff;--cp-muted:#8295c4}.counter-shell{max-width:1320px;margin:0 auto;padding:56px 36px 100px;color:var(--cp-text)}.counter-breadcrumb{display:flex;gap:12px;font:800 10px/1.2 Arial;color:var(--cp-muted);letter-spacing:.12em;margin-bottom:32px}.counter-breadcrumb a{color:var(--cp-yellow);text-decoration:none}.counter-hero{display:grid;grid-template-columns:1fr 300px;gap:56px;align-items:end;margin-bottom:48px}.counter-kicker,.counter-step-head small,.counter-alternatives small,.picker-head small,.share-head small{display:block;color:var(--cp-yellow);font:900 10px/1.2 Arial;letter-spacing:.16em}.counter-hero h1{font:900 clamp(58px,8vw,112px)/.82 Arial;margin:18px 0 24px;letter-spacing:-.07em}.counter-hero h1 em{color:var(--cp-yellow);font-style:normal}.counter-hero p{max-width:760px;color:#9eb3e8;font:500 17px/1.6 Arial}.counter-hero aside{min-height:190px;border:1px solid var(--cp-line);border-radius:20px;background:linear-gradient(145deg,#18233e,#0d1323);display:flex;flex-direction:column;justify-content:center;padding:28px}.counter-hero aside b{font:900 64px/.8 Arial;color:var(--cp-cyan)}.counter-hero aside strong{font:900 17px/1.2 Arial;margin-top:20px}.counter-hero aside small{color:var(--cp-muted);margin-top:7px}.counter-builder,.counter-results{border:1px solid var(--cp-line);border-radius:22px;background:var(--cp-panel);padding:28px;margin-top:22px}.counter-step-head{display:flex;gap:15px;align-items:center}.counter-step-head>span{display:grid;place-items:center;width:44px;height:44px;border:1px solid #3b4c70;border-radius:12px;color:var(--cp-yellow);font:900 16px Arial}.counter-step-head h2{font:900 clamp(25px,3vw,38px)/1 Arial;margin:5px 0 0}.counter-tabs{display:flex;gap:10px;margin:28px 0 20px}.counter-tabs button{display:flex;gap:12px;align-items:center;background:#0b1120;border:1px solid var(--cp-line);color:var(--cp-muted);border-radius:12px;padding:10px 16px;font:900 10px Arial;cursor:pointer}.counter-tabs button b{display:grid;place-items:center;width:27px;height:27px;border-radius:7px;background:#202d4a;color:white}.counter-tabs button.active{border-color:var(--cp-yellow);color:var(--cp-yellow)}.counter-tabs button.active b{background:var(--cp-yellow);color:#070914}.enemy-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.enemy-slot{min-height:124px;border:1px dashed #526584;border-radius:16px;background:#0a1020;color:var(--cp-muted);display:flex;align-items:center;justify-content:center;gap:16px;cursor:pointer;padding:14px;position:relative}.enemy-slot.empty strong{font:900 12px Arial}.enemy-slot.empty i{font-style:normal;display:grid;place-items:center;width:38px;height:38px;border:1px solid #53698e;border-radius:50%;color:var(--cp-cyan);font:900 25px Arial}.enemy-slot img{width:78px;height:78px;object-fit:contain}.enemy-slot .slot-copy{text-align:left;flex:1}.enemy-slot .slot-copy small{color:var(--cp-pink);font:800 8px Arial;letter-spacing:.12em}.enemy-slot .slot-copy b{display:block;font:900 20px Arial;margin-top:7px}.enemy-slot .slot-remove{position:absolute;right:10px;top:10px;border:0;background:#26324c;color:white;border-radius:6px;cursor:pointer}.enemy-slot[hidden]{display:none}.counter-context{display:grid;grid-template-columns:1fr 1.4fr auto;gap:12px;margin-top:20px;padding-top:20px;border-top:1px solid var(--cp-line)}.counter-context label span{display:block;color:var(--cp-muted);font:900 8px Arial;letter-spacing:.15em;margin:0 0 7px 4px}.counter-context select{width:100%;height:52px;border:1px solid #384b70;background:#0b1120;color:white;border-radius:11px;padding:0 14px;font:800 11px Arial}.counter-run{align-self:end;height:52px;border:0;border-radius:11px;background:var(--cp-yellow);color:#070914;padding:0 22px;font:900 10px Arial;cursor:pointer}.counter-run b{margin-left:26px}.counter-run:disabled{opacity:.55;cursor:wait}.counter-error{color:#ff6b84;border:1px solid #7a2841;background:#2d1420;border-radius:10px;padding:12px;margin:16px 0 0}.counter-result-head{display:flex;justify-content:space-between;gap:20px;align-items:center}.counter-actions{display:flex;gap:8px}.counter-actions button,.share-actions button{border:1px solid #3b4c70;background:#121c32;color:white;border-radius:10px;padding:13px 16px;font:900 9px Arial;cursor:pointer}.counter-actions button:last-child,.share-actions button:last-child{background:var(--cp-yellow);color:#070914;border-color:var(--cp-yellow)}.counter-versus{display:grid;grid-template-columns:1fr 70px 1fr;align-items:center;margin-top:28px}.counter-versus>span{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;border:1px solid #526584;color:var(--cp-yellow);font:900 16px Arial}.summary-roster{display:flex;gap:8px;align-items:center}.summary-roster.right{justify-content:flex-end}.summary-roster img{width:64px;height:64px;object-fit:contain;border-radius:12px;background:#080d19}.summary-roster b{font:900 18px Arial}.counter-scoreboard{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}.score-chip{border:1px solid var(--cp-line);background:#0b1120;border-radius:12px;padding:14px}.score-chip small{display:block;color:var(--cp-muted);font:900 8px Arial;letter-spacing:.12em}.score-chip b{display:block;color:var(--cp-green);font:900 22px Arial;margin-top:8px}.counter-team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.team-pick{position:relative;overflow:hidden;border:1px solid #34466b;border-radius:17px;background:linear-gradient(145deg,#17223b,#0c1222);padding:20px}.team-pick>span{position:absolute;right:14px;top:12px;color:#39496b;font:900 38px Arial}.team-pick img{width:92px;height:92px;object-fit:contain}.team-pick h3{font:900 25px Arial;margin:10px 0 5px}.team-pick .pick-stats{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.team-pick .pick-stats b{border-radius:7px;background:#0a1120;padding:7px 9px;color:var(--cp-cyan);font:900 9px Arial}.team-pick p{min-height:46px;color:#92a4d0;font:500 12px/1.45 Arial}.counter-analysis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}.analysis-card{border-left:3px solid var(--cp-cyan);border-radius:11px;background:#0b1120;padding:16px}.analysis-card:nth-child(2){border-color:var(--cp-yellow)}.analysis-card:nth-child(3){border-color:var(--cp-green)}.analysis-card small{color:var(--cp-muted);font:900 8px Arial;letter-spacing:.12em}.analysis-card strong{display:block;font:900 16px Arial;margin:8px 0}.analysis-card p{color:#8da0cd;font:500 11px/1.45 Arial;margin:0}.counter-alternatives{margin-top:26px;border-top:1px solid var(--cp-line);padding-top:22px}.counter-alternatives h3{margin:5px 0 14px;font:900 22px Arial}.counter-alternatives>div:last-child{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.bench-pick{display:flex;align-items:center;gap:9px;background:#0b1120;border:1px solid var(--cp-line);border-radius:10px;padding:9px}.bench-pick img{width:42px;height:42px;object-fit:contain}.bench-pick b{font:900 11px Arial}.bench-pick small{display:block;color:var(--cp-green);margin-top:4px}.counter-disclaimer{color:#7486b0;font:500 10px/1.5 Arial;margin:24px 0 0}.picker-modal,.share-modal{position:fixed;z-index:10000;inset:0;background:rgba(2,5,13,.86);backdrop-filter:blur(8px);display:grid;place-items:center;padding:20px}.picker-modal[hidden],.share-modal[hidden]{display:none}.picker-dialog,.share-dialog{width:min(980px,96vw);max-height:92vh;overflow:auto;border:1px solid #3d4e72;border-radius:20px;background:#11182b;padding:24px}.picker-head,.share-head{display:flex;align-items:center;justify-content:space-between}.picker-head h2,.share-head h2{font:900 26px Arial;margin:6px 0}.picker-head button,.share-head button{width:40px;height:40px;border:1px solid #3d4e72;border-radius:10px;background:#141e34;color:white;font-size:24px;cursor:pointer}.picker-dialog>input{width:100%;height:50px;border:1px solid #3d4e72;border-radius:10px;background:#090f1d;color:white;padding:0 16px;margin:18px 0;font-weight:800}.picker-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.picker-card{border:1px solid #2e3f61;border-radius:11px;background:#0b1120;color:white;padding:9px;cursor:pointer;text-align:left}.picker-card:hover{border-color:var(--cp-yellow);transform:translateY(-2px)}.picker-card img{display:block;width:100%;aspect-ratio:1;object-fit:contain}.picker-card b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:900 10px Arial;margin-top:5px}.share-formats{display:flex;justify-content:flex-end;gap:8px;margin:15px 0}.share-formats button{border:1px solid #3d4e72;border-radius:9px;background:#0c1323;color:#8fa1cc;padding:10px 13px;font:900 9px Arial;cursor:pointer}.share-formats button.active{border-color:var(--cp-yellow);color:var(--cp-yellow)}.share-formats small{margin-left:5px}.share-preview{display:grid;place-items:center;background:#080d18;border:1px solid #263653;border-radius:14px;padding:12px;max-height:64vh;overflow:auto}.share-preview canvas{display:block;max-width:100%;height:auto}.share-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
@media(max-width:900px){.counter-shell{padding:34px 16px 70px}.counter-hero{grid-template-columns:1fr}.counter-hero aside{display:none}.enemy-slots,.counter-team-grid{grid-template-columns:1fr}.counter-context{grid-template-columns:1fr}.counter-scoreboard,.counter-analysis{grid-template-columns:repeat(2,1fr)}.counter-alternatives>div:last-child{grid-template-columns:repeat(2,1fr)}.counter-versus{grid-template-columns:1fr}.counter-versus>span{margin:10px auto}.summary-roster.right{justify-content:flex-start}.counter-result-head{align-items:flex-start;flex-direction:column}.picker-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.counter-builder,.counter-results{padding:18px}.counter-tabs{display:grid}.counter-scoreboard,.counter-analysis{grid-template-columns:1fr}.picker-grid{grid-template-columns:repeat(2,1fr)}.counter-actions,.share-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.share-actions{grid-template-columns:1fr}.summary-roster img{width:50px;height:50px}}
