:root{--or:#e2801c;--or-d:#b85f0b;--ink:#1d2329;--mut:#66707a;--bg:#f4f5f7;--card:#fff;--line:#dde1e6;--ok:#1f8a4c;--bad:#c62828;--blue:#1f5fa8}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--blue)}
.top{background:var(--ink);color:#fff;padding:10px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.top b{color:var(--or)}
.top .sp{flex:1}
.top a{color:#fff}
.wrap{max-width:1100px;margin:0 auto;padding:16px}
.narrow{max-width:520px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px;margin:0 0 16px}
h1{font-size:1.4rem;margin:.2em 0 .6em}h2{font-size:1.15rem;margin:.2em 0 .6em}
label{display:block;font-weight:600;margin:12px 0 4px}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=date],input[type=search],select,textarea{width:100%;padding:11px 12px;border:1px solid #b9c0c8;border-radius:8px;font:inherit;background:#fff}
.radios{display:flex;gap:18px}.radios label{font-weight:400;display:flex;align-items:center;gap:6px;margin:4px 0}
.btn{display:inline-block;border:0;border-radius:8px;padding:11px 18px;font:600 15px/1.2 inherit;font-family:inherit;cursor:pointer;background:var(--or);color:#fff;text-decoration:none;text-align:center}
.btn:hover{background:var(--or-d)}
.btn.sec{background:#e7eaee;color:var(--ink)}.btn.sec:hover{background:#d5dae0}
.btn.dark{background:var(--ink)}.btn.green{background:var(--ok)}.btn.red{background:var(--bad)}
.btn.sm{padding:6px 10px;font-size:13px}
.btn[disabled]{opacity:.45;cursor:default}
.full{width:100%}
.err{background:#fdecea;color:var(--bad);border:1px solid #f5c2c0;padding:10px 12px;border-radius:8px;margin:10px 0}
.ok{background:#e7f5ec;color:var(--ok);border:1px solid #bfe3cc;padding:10px 12px;border-radius:8px;margin:10px 0}
.muted{color:var(--mut);font-size:.9rem}
table.t{width:100%;border-collapse:collapse;background:#fff}
table.t th,table.t td{border:1px solid var(--line);padding:6px 8px;text-align:left;vertical-align:middle;font-size:14px}
table.t th{background:#eef0f3}
.pass{color:var(--ok);font-weight:700}.fail{color:var(--bad);font-weight:700}
.sigbox{border:2px dashed #9aa3ad;border-radius:8px;background:#fff;touch-action:none;width:100%;height:180px;display:block}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.badge{display:inline-block;background:var(--or);color:#fff;border-radius:20px;padding:1px 8px;font-size:12px;font-weight:700}
.badge.grey{background:#8a939c}.badge.green{background:var(--ok)}.badge.red{background:var(--bad)}

/* ---- delegate app ---- */
body.app{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden;background:#111}
.app .top{padding:8px 12px;font-size:14px;flex-wrap:nowrap;white-space:nowrap;overflow:hidden}
.app .top #sessLbl{overflow:hidden;text-overflow:ellipsis;min-width:0}
.app .top .who{overflow:hidden;text-overflow:ellipsis;max-width:35%}
.app main{flex:1;overflow:auto;background:var(--bg)}
.app .pane{display:none;padding:12px;max-width:900px;margin:0 auto}
.app .pane.on{display:block}
#pSlides.on{display:flex;flex-direction:column;height:100%;padding:0;max-width:none;background:#111}
.stage{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;padding:6px}
.stage img{max-width:100%;max-height:100%;object-fit:contain;background:#fff;user-select:none;-webkit-user-drag:none}
.nav{display:flex;gap:8px;padding:8px;background:#1b1f24;align-items:center;color:#cfd5db;font-size:13px}
.nav .btn{flex:0 0 auto}.nav .mid{flex:1;text-align:center}
.live{background:var(--bad)!important}.live.on{background:var(--ok)!important}
.tabs{display:flex;background:var(--ink)}
.tabs button{flex:1;background:none;border:0;color:#c9d0d6;padding:10px 4px;font:600 13px inherit;font-family:inherit;cursor:pointer;position:relative}
.tabs button.on{color:#fff;box-shadow:inset 0 3px 0 var(--or)}
.tabs .dot{position:absolute;top:6px;right:calc(50% - 30px);width:9px;height:9px;border-radius:50%;background:var(--or);display:none}
.tabs .dot.show{display:block}
.hit{display:flex;gap:10px;padding:10px;border-bottom:1px solid var(--line);cursor:pointer;background:#fff}
.hit:hover{background:#fff7ee}.hit img{width:96px;height:auto;border:1px solid var(--line);flex:0 0 auto}
.hit mark{background:#ffe08a}
.q{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px;margin:0 0 12px}
.q .qt{font-weight:600;margin-bottom:8px}
.opt{display:flex;gap:10px;align-items:flex-start;padding:10px;border:1px solid var(--line);border-radius:8px;margin:6px 0;cursor:pointer;background:#fafbfc}
.opt input{margin-top:3px;transform:scale(1.25)}
.opt.sel{border-color:var(--or);background:#fff4e8}
.opt.right{border-color:var(--ok);background:#e7f5ec}.opt.wrong{border-color:var(--bad);background:#fdecea}

/* review card (presenter + delegates) */
.rev{background:var(--or);color:#fff;border-radius:6px;padding:4% 5%;width:100%;max-width:1400px;aspect-ratio:1.377;display:flex;flex-direction:column;font-size:clamp(14px,2.4vw,40px)}
.rev .rh{display:flex;justify-content:space-between;opacity:.95;font-size:.8em}
.rev .rq{text-align:center;font-weight:600;margin:3% 0 4%;line-height:1.3}
.rev .ro{padding:.25em .4em;margin:.15em 0;border-radius:6px;transition:opacity .5s}
.rev .ro.gone{opacity:0}
.rev .ro.correct{background:rgba(255,255,255,.18)}
.rev .ro small{opacity:.8;font-size:.55em;margin-left:.6em}

/* presenter */
body.pres{background:#000;color:#fff;height:100vh;overflow:hidden;margin:0}
.pres .pstage{position:absolute;inset:0 0 54px 0;display:flex;align-items:center;justify-content:center}
.pres .pstage img{max-width:100%;max-height:100%;object-fit:contain}
.pres #rev .rev{width:min(100%,calc((100vh - 80px)*1.377));margin:0 auto;font-size:clamp(14px,2.2vw,44px)}
.pres .bar{position:absolute;left:0;right:0;bottom:0;height:54px;background:#15191d;display:flex;align-items:center;gap:8px;padding:0 10px;font-size:14px}
.pres .bar .sp{flex:1}

@media print{
  .noprint,.top{display:none!important}
  body{background:#fff}
  .card{border:0;padding:0}
  .wrap{max-width:none;padding:0}
  table.t th,table.t td{font-size:11px;padding:3px 5px}
}

.scrollx{overflow-x:auto}
@media (max-width:600px){.app .top .who{display:none}}

/* delegate full screen mode */
body.app.fs .top, body.app.fs .tabs{display:none}
body.app.fs .stage{padding:0}
body.app.fs .nav{position:fixed;left:0;right:0;bottom:0;background:rgba(20,24,28,.85);opacity:0;pointer-events:none;transition:opacity .3s}
body.app.fs.navshow .nav{opacity:1;pointer-events:auto}
@media (max-width:600px){#bFs{padding:6px 8px}.nav{gap:5px}.nav .mid{font-size:11px}}

/* review card on delegate devices: fill the slide area, never taller than the screen */
#revBox{height:100%}
#revBox .rev{width:100%;height:100%;max-width:none;aspect-ratio:auto;padding:2.5% 4%;overflow:auto;
  font-size:clamp(11px, min(2.3vw, 4.2vh), 36px)}
#revBox .rev .rq{margin:1.5% 0 2.5%}

body.app.fs #accBar{display:none}

@media (max-width:600px){#bSnd{padding:6px 8px}}
