body[data-tool=cliff] [data-roulette] { display:none!important; }
#cliff-tool[hidden], .cliff-layout [hidden], .cliff-stage [hidden] { display:none!important; }
#cliff-tool { --cliff-ink:#273b44; --cliff-muted:#687e84; --cliff-line:#d9e4e2; --cliff-card:#fff; --cliff-mint:#dbede3; color:var(--cliff-ink); padding-bottom:28px; }
body[data-tool=cliff]:not(.cliff-only) .page-shell > main { display:flex; flex-direction:column; }
body[data-tool=cliff] main > .tool-tabs { order:-2; }
body[data-tool=cliff] main > [data-ad-position=top] { order:-1; margin-top:0; margin-bottom:24px; }
body[data-tool=cliff] main > [data-ad-position=footer] { order:1; margin-top:0; }
.cliff-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:0 0 22px; }
.cliff-eyebrow { font-size:9px; letter-spacing:2px; color:var(--cliff-muted); font-weight:750; margin:0 0 8px; }
.cliff-heading h1 { font-size:32px; letter-spacing:-1.4px; margin:0 0 9px; line-height:1.3; }
.cliff-heading h1 span { display:inline-block; font-size:12px; letter-spacing:0; margin-left:15px; vertical-align:middle; background:#e5eedb; color:#557450; padding:6px 10px; border-radius:20px; }
.cliff-heading p:last-child { font-size:13px; color:var(--cliff-muted); margin:0; line-height:1.7; }
.cliff-heading-badge { border:1px solid var(--cliff-line); border-radius:24px; padding:12px 16px; font-size:9px; letter-spacing:1.2px; white-space:nowrap; }
.cliff-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:18px; align-items:stretch; }
.cliff-arena-card { border:1px solid var(--cliff-line); border-radius:22px; overflow:hidden; min-width:0; background:var(--cliff-card); box-shadow:0 8px 32px #344e4807; display:flex; flex-direction:column; }
.cliff-scorebar { padding:17px 22px; display:flex; justify-content:space-between; gap:8px; align-items:center; font-size:11px; }
.cliff-scorebar>div:first-child { display:flex; align-items:center; gap:8px; }
.cliff-live-dot { width:7px; height:7px; border-radius:50%; background:#9caeb0; box-shadow:0 0 0 4px #9caeb012; }
#cliff-tool[data-state=running] .cliff-live-dot { background:#68a587; box-shadow:0 0 0 4px #68a58718; }
.cliff-score { display:flex; align-items:center; gap:18px; color:var(--cliff-muted); }
.cliff-score strong { font-size:18px; color:var(--cliff-ink); margin-left:6px; }
.cliff-score small { font-size:11px; }
.cliff-score time { font-variant-numeric:tabular-nums; font-size:12px; border-left:1px solid var(--cliff-line); padding-left:16px; }
.cliff-stage { position:relative; height:560px; min-height:280px; flex:1; overflow:hidden; isolation:isolate; background:linear-gradient(160deg,#e6efe9 0%,#dfecef 42%,#e6e2ee 100%); }
.cliff-stage canvas { position:absolute; inset:0; display:block; width:100%; height:100%; z-index:1; border:0; border-radius:0; box-shadow:none; will-change:auto; }
.cliff-sky-disc { position:absolute; width:290px; height:290px; border-radius:50%; background:#fff9e66b; top:-125px; right:-45px; }
.cliff-stage-word { position:absolute; top:24px; left:26px; font-size:11px; font-weight:800; letter-spacing:4px; color:#76908770; }
.cliff-labels { position:absolute; inset:0; pointer-events:none; z-index:3; overflow:hidden; }
.cliff-name { position:absolute; top:0; left:0; background:#ffffffdb; color:#334b52; border:1px solid #ffffffdf; border-radius:5px; padding:3px 6px; font-size:10px; font-weight:750; line-height:1.2; white-space:nowrap; max-width:140px; overflow:hidden; text-overflow:ellipsis; box-shadow:0 2px 5px #32455113; }
.cliff-name.is-winner { background:#fff2b0; border-color:#ebce66; color:#6c5420; }
.cliff-countdown { position:absolute; z-index:6; inset:0; display:grid; place-items:center; font-size:100px; font-weight:900; color:white; text-shadow:0 5px 0 #435f6470,0 12px 25px #435f6430; background:#304b4820; pointer-events:none; }
.cliff-result { position:absolute; z-index:7; top:45%; left:50%; transform:translate(-50%,-50%); width:min(85%,420px); text-align:center; padding:24px 20px; border:1px solid #ffffffc9; border-radius:18px; background:#fffaf0e0; backdrop-filter:blur(9px); color:#3f514b; box-shadow:0 16px 70px #384e4620; }
.cliff-result>span { font-size:10px; letter-spacing:2px; color:#a27a3c; }
.cliff-result strong { display:block; color:#334b45!important; font-size:clamp(24px,4vw,40px); margin:12px 0; overflow-wrap:anywhere; }
.cliff-result p { font-size:12px; margin:0; color:#7b8677; }
.cliff-graphics-error { position:absolute; z-index:8; inset:20%; display:grid; place-items:center; padding:20px; text-align:center; font-size:14px; line-height:1.8; background:var(--cliff-card); border-radius:16px; }
.cliff-arena-footer { padding:16px 22px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
#cliff-announcement { font-size:11px; line-height:1.5; color:var(--cliff-muted); margin:0; min-width:0; overflow-wrap:anywhere; }
.cliff-actions { display:flex; gap:7px; flex-shrink:0; }
.cliff-actions button { border:1px solid var(--cliff-line); border-radius:10px; padding:10px 13px; min-height:40px; color:var(--cliff-ink); background:var(--cliff-card); font-size:11px; white-space:nowrap; }
.cliff-actions #cliff-start { background:#315e4c; color:#fff; border-color:#315e4c; padding:10px 22px; font-weight:750; }
.cliff-actions #cliff-start span { margin-left:10px; color:#bde4cb; }
.cliff-actions button:disabled { opacity:.5; cursor:not-allowed; }
.cliff-roster-panel { border:1px solid var(--cliff-line); border-radius:22px; padding:21px 18px 16px; background:var(--cliff-card); min-width:0; display:flex; flex-direction:column; }
.cliff-roster-heading { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.cliff-roster-heading .cliff-eyebrow { font-size:8px; letter-spacing:1.5px; }
.cliff-roster-heading h2 { font-size:17px; margin:0; letter-spacing:-.6px; }
.cliff-roster-heading h2 span { display:inline-grid; place-items:center; min-width:23px; height:23px; font-size:11px; background:var(--cliff-mint); border-radius:7px; margin-left:5px; }
.cliff-count-controls { display:grid; grid-template-columns:32px minmax(42px,1fr) 16px 32px auto; align-items:center; gap:6px; min-width:0; margin:17px 0 0; padding:8px 10px 10px; border:1px solid var(--cliff-line); border-radius:11px; }
.cliff-count-controls legend { padding:0 5px; font-size:11px; color:var(--cliff-muted); }
.cliff-count-controls button { width:32px; height:34px; padding:0; border:0; border-radius:7px; background:var(--cliff-mint); color:var(--cliff-ink); font-size:19px; }
.cliff-count-controls input { width:100%; min-width:0; height:34px; box-sizing:border-box; border:1px solid var(--cliff-line); border-radius:7px; padding:4px; text-align:center; background:var(--cliff-card); color:var(--cliff-ink); font-size:16px; font-weight:750; appearance:textfield; }
.cliff-count-controls input::-webkit-inner-spin-button, .cliff-count-controls input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.cliff-count-controls span { font-size:12px; color:var(--cliff-muted); }.cliff-count-controls small { font-size:9px; color:var(--cliff-muted); white-space:nowrap; }
.cliff-count-controls button:disabled { opacity:.35; cursor:not-allowed; }.cliff-count-controls input:focus-visible { outline:2px solid #5b9b7c; outline-offset:1px; }
.cliff-roster-hint { font-size:11px; line-height:1.6; color:var(--cliff-muted); margin:13px 0 12px; }
.cliff-roster { display:grid; grid-template-columns:1fr 1fr; gap:7px; padding:0 4px 0 0; margin:0; border:0; overflow:auto; max-height:475px; min-width:0; scrollbar-width:thin; scrollbar-color:#bdcfca transparent; }
.cliff-fighter-card { position:relative; border:1px solid var(--cliff-line); border-radius:11px; background:var(--cliff-card); padding:7px 7px 8px; min-width:0; transition:opacity .2s,background .2s; }
.cliff-fighter-card:has(input[type=checkbox]:not(:checked)) { opacity:.45; }
.cliff-fighter-card.is-out { opacity:.4; filter:grayscale(.6); }
.cliff-fighter-card.is-champion { border-color:#d2ac5c; background:#fbf2db; }
.cliff-character-top { display:flex; align-items:center; gap:5px; margin-bottom:6px; }
.cliff-avatar { display:block; object-fit:cover; width:40px; height:44px; border-radius:9px; background:var(--fighter-tint,#e6ece4); }
.cliff-character-name { font-size:10px; color:var(--cliff-muted); flex:1; }
.cliff-character-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cliff-fighter-card input[type=checkbox] { width:14px; height:14px; margin:0; accent-color:#3d775c; cursor:pointer; }
.cliff-fighter-card input[type=text] { width:100%; min-width:0; height:28px; padding:4px 6px; font-size:11px; border:1px solid var(--cliff-line); border-radius:6px; background:transparent; color:var(--cliff-ink); box-sizing:border-box; }
.cliff-fighter-card input:focus-visible { outline:2px solid #5b9b7c; outline-offset:1px; }
.cliff-fighter-card input:disabled { opacity:1; -webkit-text-fill-color:var(--cliff-ink); }
.cliff-fighter-state { position:absolute; top:6px; right:6px; border-radius:4px; padding:3px 4px; font-size:9px; background:#e3eee8; color:#3a7256; }
.cliff-fighter-state[data-out=true] { background:#f2e0e0; color:#a25658; }
.cliff-fair-note { font-size:10px; color:var(--cliff-muted); text-align:center; margin:13px 0 0; }
.cliff-help { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:12px; padding:24px 12px 0; color:var(--cliff-muted); font-size:11px; }
.cliff-help b { color:#668774; font-size:9px; margin-right:6px; }
.cliff-help i { font-style:normal; color:#a5bab0; }
.cliff-help p { width:100%; text-align:center; font-size:10px; margin:0; }
html[data-theme=dark] #cliff-tool { --cliff-ink:#e0eae5; --cliff-muted:#a2b6af; --cliff-line:#3a5149; --cliff-card:#202e29; --cliff-mint:#355343; }
html[data-theme=dark] .cliff-fighter-card.is-champion { background:#554a2e; }
html[data-theme=dark] .cliff-heading h1 span { background:#344c3b; color:#bfdbb4; }
@media(max-width:1100px) { .cliff-layout { grid-template-columns:minmax(0,1fr) 270px; gap:12px; }.cliff-stage { height:490px; }.cliff-arena-footer { flex-wrap:wrap; }.cliff-roster-panel { padding:18px 13px; }.cliff-roster { max-height:470px; } }
@media(max-width:730px) { .tool-tabs { width:100%; box-sizing:border-box; }.tool-tabs button { min-width:0; flex:1; padding:11px 8px; }.cliff-heading { margin-bottom:16px; }.cliff-heading-badge { display:none; }.cliff-heading h1 { font-size:27px; }.cliff-heading h1 span { margin-left:9px; font-size:10px; }.cliff-heading p:last-child { font-size:11px; }.cliff-layout { grid-template-columns:1fr; }.cliff-stage { height:440px; flex:none; }.cliff-scorebar { padding:14px; }.cliff-arena-footer { padding:13px 14px; }.cliff-actions { margin-left:auto; }.cliff-roster { grid-template-columns:repeat(4,minmax(0,1fr)); max-height:none; overflow:visible; padding:0; }.cliff-avatar { width:25px; height:28px; font-size:20px; }.cliff-character-name { font-size:9px; }.cliff-help { gap:7px; font-size:10px; } }
@media(max-width:430px) { .cliff-stage { height:360px; }.cliff-roster { grid-template-columns:repeat(2,minmax(0,1fr)); }.cliff-avatar { width:32px; height:32px; }.cliff-character-name { font-size:11px; }.cliff-fighter-card input[type=text] { height:36px; font-size:16px; }.cliff-score { gap:10px; }.cliff-score time { padding-left:10px; }.cliff-name { font-size:8px; padding:2px 4px; max-width:95px; }.cliff-heading h1 span { font-size:9px; padding:5px 8px; }.cliff-actions #cliff-start { padding:10px 17px; } }
@media(max-width:730px) { .cliff-count-controls { grid-template-columns:44px minmax(42px,1fr) 16px 44px auto; }.cliff-count-controls button { width:44px; height:44px; }.cliff-count-controls input { height:44px; } }
body.cliff-only { overflow:hidden; }
body.cliff-only .topbar, body.cliff-only .ad-rail, body.cliff-only main>:not(#cliff-tool), body.cliff-only .cliff-heading, body.cliff-only .cliff-roster-panel, body.cliff-only .cliff-help, body.cliff-only .ad-placement { display:none!important; }
body.cliff-only .page-shell, body.cliff-only main, body.cliff-only #cliff-tool, body.cliff-only .cliff-layout { display:block; width:100%; min-width:0; max-width:none; margin:0; padding:0; }
body.cliff-only .cliff-arena-card { position:fixed; inset:0; border:0; border-radius:0; height:100dvh; display:grid; grid-template-rows:auto minmax(0,1fr) auto; }
body.cliff-only .cliff-stage { height:auto; min-height:0; }
body.cliff-only .cliff-scorebar { padding:8px 14px; }
body.cliff-only .cliff-arena-footer { padding:8px 14px; flex-wrap:nowrap; }
body.cliff-only .cliff-name { font-size:9px; }
@media(max-height:350px) { body.cliff-only #cliff-announcement { display:none; } body.cliff-only .cliff-actions { margin:auto; } body.cliff-only .cliff-actions button { min-height:30px; padding:6px 12px; } }