/* ===== Debate screen: same arena palette (dark, gold vs red, Anton/Inter) ===== */
[hidden]{display:none!important}
body.in-debate .arena{visibility:hidden}
.debate{position:fixed;inset:0;z-index:10;margin:0 auto;max-width:480px;display:flex;flex-direction:column;
  background:var(--ink);box-shadow:0 0 80px rgba(0,0,0,.8);
  padding:max(10px,env(safe-area-inset-top)) 0 0}
.debate[hidden]{display:none}
.d-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 40% at 0% 30%,rgba(245,192,74,.16),transparent 70%),radial-gradient(60% 40% at 100% 30%,rgba(226,40,58,.16),transparent 70%),
  linear-gradient(180deg,#0d0a10,#07060a 60%)}
.d-top{display:flex;align-items:center;gap:10px;padding:0 12px}
.d-icon{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--glass);border:1px solid rgba(255,255,255,.12)}
.d-icon svg{width:21px;height:21px;fill:none;stroke:var(--gold-2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.d-head{flex:1;min-width:0;text-align:center}
.d-live{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.d-dot{width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 8px var(--red);animation:blink 1.4s steps(1) infinite}
.is-demo .d-dot{background:#8a8a8a;box-shadow:none;animation:none}
.d-topic{margin-top:3px;font-family:var(--display);font-weight:400;font-size:21px;line-height:1.08;letter-spacing:.01em;text-transform:uppercase;color:var(--text);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

.d-board{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin:10px 12px 0}
.corner{display:flex;flex-direction:column;padding:7px 12px;border-radius:12px;background:var(--glass)}
.corner b{font-family:var(--display);font-weight:400;font-size:20px;letter-spacing:.04em;text-transform:uppercase;line-height:1}
.corner span{font-size:10.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.corner-gold{border:1px solid rgba(245,192,74,.5);box-shadow:0 0 18px rgba(245,192,74,.15)}
.corner-gold b{color:var(--gold-2)}
.corner-red{text-align:right;align-items:flex-end;border:1px solid rgba(226,40,58,.55);box-shadow:0 0 18px rgba(226,40,58,.15)}
.corner-red b{color:#ff5a68}
.d-vs{font-family:var(--display);font-size:22px;letter-spacing:.08em;color:#fff;padding:1px 10px;border-radius:6px;
  background:linear-gradient(135deg,var(--red),var(--red-deep));box-shadow:0 0 18px rgba(226,40,58,.55);transform:skewX(-8deg)}
.d-progress{display:flex;align-items:center;gap:10px;margin:8px 14px 0;font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.d-progress i{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden}
.d-progress b{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--red));transition:width .5s}

/* feed */
.d-feed{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:12px 12px 18px;display:flex;flex-direction:column;gap:10px;scroll-padding-bottom:20px}
.banner{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-radius:12px;border:1px dashed rgba(246,239,226,.35);background:rgba(255,255,255,.04);font-size:12.5px;line-height:1.4;color:var(--muted)}
.banner b{font-size:11px;letter-spacing:.2em;color:var(--text)}
.ring-card{text-align:center;padding:12px 10px;border-radius:14px;background:linear-gradient(180deg,rgba(28,20,14,.7),rgba(12,9,12,.7));border:1px solid var(--line)}
.ring-kicker{font-size:10.5px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.ring-topic{margin-top:4px;font-size:16px;font-weight:800;line-height:1.3}
.ring-sides{margin-top:5px;font-size:12px;color:var(--muted)}

.turn{position:relative;max-width:86%;padding:9px 12px 10px;border-radius:16px;cursor:pointer;outline:none;
  animation:pop .28s ease-out both;transition:box-shadow .2s,transform .15s}
.turn-gold{align-self:flex-start;border-top-left-radius:4px;background:linear-gradient(180deg,rgba(60,44,14,.85),rgba(30,22,10,.9));border:1px solid rgba(245,192,74,.45)}
.turn-red{align-self:flex-end;border-top-right-radius:4px;background:linear-gradient(180deg,rgba(70,14,20,.85),rgba(34,8,12,.9));border:1px solid rgba(226,40,58,.5)}
.turn.is-answer{border-style:dashed}
.turn.is-selected,.turn:focus-visible{box-shadow:0 0 0 2px var(--gold-2),0 0 22px rgba(245,192,74,.35)}
.turn-red.is-selected,.turn-red:focus-visible{box-shadow:0 0 0 2px #ff5a68,0 0 22px rgba(226,40,58,.4)}
.turn-who{display:flex;align-items:baseline;gap:8px;margin-bottom:3px}
.turn-who b{font-family:var(--display);font-weight:400;font-size:15px;letter-spacing:.06em;text-transform:uppercase}
.turn-gold .turn-who b{color:var(--gold-2)} .turn-red .turn-who b{color:#ff6b78}
.turn-who span{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.turn-text{font-size:15px;line-height:1.45;font-weight:600;color:var(--text);white-space:pre-wrap}
.dots{display:flex;gap:5px;padding:6px 2px}
.dots i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:bob 1s ease-in-out infinite}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}

/* receipts */
.receipts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.rc{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:4px 9px 4px 7px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.04em;
  background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.18)}
.rc svg{width:13px;height:13px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round}
.rc-ok{color:#7be3a1;border-color:rgba(123,227,161,.45)}
.rc-warn{color:#ffcf6b;border-color:rgba(255,207,107,.45)}
.rc-bad{color:#ff7a85;border-color:rgba(255,122,133,.5)}
.rc-none{color:#b9b2a6;border-color:rgba(185,178,166,.35)}
.rc-wait{color:var(--muted)}
.rc-panel{flex-basis:100%;padding:9px 10px;border-radius:10px;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.1);font-size:12.5px;line-height:1.4;cursor:default}
.rc-claim{font-style:italic;color:var(--text);margin-bottom:6px}
.rc-row{display:grid;grid-template-columns:52px 1fr;gap:6px;margin-top:3px}
.rc-k{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding-top:2px}
.rc-v{color:var(--text);word-break:break-word}
.rc-link{color:var(--gold-2);word-break:break-all;text-decoration:underline}
.rc-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.tag{padding:2px 8px;border-radius:999px;font-size:10.5px;font-weight:800;border:1px solid currentColor}
.tag-trusted{color:#9fd3ff}
.tag-outside{color:#e7a6ff}
.rc-note{margin-top:7px;color:var(--muted)}
.rc-note-bad{color:#ff9aa3}

.mod{align-self:center;max-width:92%;text-align:center;padding:7px 12px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);font-size:13px;line-height:1.35;animation:pop .25s ease-out both}
.mod b{display:block;font-size:9.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:2px}
.note{align-self:center;max-width:92%;text-align:center;font-size:12.5px;color:var(--muted)}
.err{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:rgba(226,40,58,.12);border:1px solid rgba(226,40,58,.5);font-size:13px}
.err span{flex-basis:100%}

.judge{align-self:stretch;padding:12px 14px;border-radius:16px;background:linear-gradient(180deg,rgba(28,20,14,.92),rgba(12,9,12,.95));border:1px solid var(--gold);box-shadow:0 0 26px rgba(245,192,74,.25);animation:pop .3s ease-out both}
.judge-red{border-color:var(--red);box-shadow:0 0 26px rgba(226,40,58,.3)}
.judge-draw{border-color:rgba(246,239,226,.5);box-shadow:none}
.judge-title{font-size:10.5px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.judge-head{margin-top:2px;font-family:var(--display);font-size:30px;line-height:1;text-transform:uppercase;letter-spacing:.02em;color:var(--gold-2)}
.judge-red .judge-head{color:#ff6b78} .judge-draw .judge-head{color:var(--text)}
.judge-text{margin-top:6px;font-size:14px;line-height:1.45;font-weight:600}
.judge-row{margin-top:8px}
.judge-row span{font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.judge-row p{font-size:13px;line-height:1.4}
.judge-fine{margin-top:9px;font-size:11px;color:var(--muted)}

/* dock */
.d-dock{flex:none;display:flex;flex-direction:column;gap:8px;padding:10px 12px max(12px,env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(12,9,12,.9),rgba(7,6,10,.98));border-top:1px solid var(--line)}
.d-selected{display:flex;flex-direction:column;gap:7px}
.d-sel-head{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-2)}
.d-x{width:28px;height:28px;border-radius:8px;font-size:20px;line-height:1;color:var(--muted)}
.d-sel-actions,.d-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.d-hint{font-size:11.5px;color:var(--muted);text-align:center}
.d-btn{min-height:42px;padding:8px 10px;border-radius:12px;font-size:12.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  background:var(--glass);border:1px solid rgba(255,255,255,.16);transition:transform .15s,opacity .2s}
.d-btn:active{transform:scale(.97)}
.d-btn:disabled{opacity:.38;cursor:default}
.d-btn-gold{color:#1a1006;border:0;background:linear-gradient(135deg,var(--gold-2),var(--gold) 50%,#c9841f)}
.d-btn-red{border:0;background:linear-gradient(135deg,var(--red),var(--red-deep));box-shadow:0 0 16px rgba(226,40,58,.35)}
.d-define{display:flex;gap:8px}
.d-define input,.d-ask input,.sheet input{flex:1;min-width:0;height:42px;padding:0 12px;border-radius:12px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.14);
  color:var(--text);font:600 16px var(--ui);outline:0;caret-color:var(--gold)}
.d-define input:focus,.d-ask input:focus,.sheet input:focus{border-color:rgba(245,192,74,.6)}
.d-ask{display:flex;gap:6px;align-items:center}
.d-to{flex:none;height:42px;padding:0 10px;border-radius:12px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.d-to-gold{color:#1a1006;background:linear-gradient(135deg,var(--gold-2),var(--gold))}
.d-to-red{color:#fff;background:linear-gradient(135deg,var(--red),var(--red-deep))}
.d-mic{width:42px;height:42px}
.d-mic.is-on{border-color:var(--red);box-shadow:0 0 12px rgba(226,40,58,.6)}
.d-send{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,var(--gold-2),var(--gold) 50%,#c9841f)}
.d-send svg{width:20px;height:20px;fill:none;stroke:#1a1006;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* settings sheet */
.sheet{position:fixed;inset:0;z-index:30;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.sheet[hidden]{display:none}
.sheet-card{width:100%;max-width:480px;max-height:92vh;overflow-y:auto;padding:18px 16px max(18px,env(safe-area-inset-bottom));border-radius:20px 20px 0 0;
  background:linear-gradient(180deg,#1a130d,#0c090c);border:1px solid var(--line);border-bottom:0;animation:rise .25s ease-out}
.sheet-card h3{font-family:var(--display);font-weight:400;font-size:26px;letter-spacing:.03em;text-transform:uppercase;color:var(--gold-2)}
.sheet-copy{margin-top:6px;font-size:13.5px;line-height:1.45;color:var(--muted)}
.sheet-label{display:block;margin:12px 0 5px;font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.sheet-label small{font-weight:600;letter-spacing:.04em;text-transform:none;color:var(--muted)}
.sheet input{width:100%}
.sheet-keyrow{display:flex;gap:8px}
.sheet-status{min-height:18px;margin-top:10px;font-size:13px;color:var(--text)}
.sheet-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.sheet-actions .d-btn{flex:1}
.sheet-fine{margin-top:12px;font-size:11.5px;color:var(--muted)}

@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@keyframes bob{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(-4px);opacity:1}}
@keyframes rise{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}}