:root{--navy:#0F2537;--navy-2:#173450;--navy-3:#21466A;--blue:#1E96FC;--muted:#8FA6BD;--soft:#B9C8D8;--star:#F5B301;--green:#18A058;--red:#FFB4B6}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Inter,Arial,sans-serif;background:var(--navy);color:#fff;-webkit-font-smoothing:antialiased}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
.hide{display:none!important}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.14em;font-size:15px}
.brand img{height:22px}

/* ---------- phone ---------- */
.rate{max-width:560px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;padding:18px 16px calc(24px + env(safe-area-inset-bottom))}
.rate header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
.rate header .who{font-size:13px;color:var(--muted);font-weight:700}
.rate h1{font-size:28px;line-height:1.1;font-weight:900;letter-spacing:-.02em}
.rate .lead{color:var(--soft);font-size:16px;line-height:1.45;margin-top:8px}
.groups{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.gbtn{border:0;border-radius:22px;background:var(--navy-2);padding:22px 14px;text-align:left;min-height:104px;display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.gbtn b{font-size:21px;font-weight:900}
.gbtn span{font-size:14px;color:var(--muted);font-weight:700}
.gbtn.done{background:var(--navy-3)}
.gbtn.done span{color:#7EE2A8}
.back{border:0;background:none;color:var(--muted);font-weight:800;font-size:15px;padding:6px 0;margin-bottom:10px;align-self:flex-start}
.topics{display:flex;flex-direction:column;gap:12px;margin-top:18px}
.topic{background:var(--navy-2);border-radius:22px;padding:16px 16px 12px}
.topic h2{font-size:18px;font-weight:850}
.topic p{font-size:14px;color:var(--muted);margin-top:3px;line-height:1.35}
.stars{display:flex;justify-content:space-between;margin-top:10px}
.star{border:0;background:none;width:52px;height:52px;display:grid;place-items:center;border-radius:14px;-webkit-tap-highlight-color:transparent}
.star svg{width:38px;height:38px;fill:none;stroke:#5E7891;stroke-width:1.6;transition:transform .12s}
.star.on svg{fill:var(--star);stroke:var(--star)}
.star:active svg{transform:scale(.88)}
.go{width:100%;border:0;border-radius:20px;padding:18px;font-size:19px;font-weight:850;background:var(--blue);color:#fff;margin-top:18px}
.go:disabled{opacity:.45}
.total{text-align:center;color:var(--soft);font-weight:700;margin-top:12px}
.err{color:var(--red);font-weight:700;min-height:1.4em;margin-top:10px;text-align:center}
.thanks{text-align:center;margin:auto 0}
.thanks .em{font-size:64px}
.thanks h1{margin-top:10px}
.closed{margin-top:18px;background:var(--navy-2);border-radius:18px;padding:14px 16px;color:var(--soft);font-weight:700}

/* ---------- projector ---------- */
.board{min-height:100vh;padding:3vh 3.4vw;display:flex;flex-direction:column}
.board header{display:flex;justify-content:space-between;align-items:center;font-size:1.5vw}
.board header .meta{color:var(--muted);font-weight:700;font-size:1.2vw}
.layout{flex:1;display:grid;grid-template-columns:1fr 22vw;gap:3vw;align-items:start;margin-top:3vh}
.layout h1{font-size:3.4vw;font-weight:900;letter-spacing:-.02em;margin-bottom:2.4vh}
.res{display:flex;flex-direction:column;gap:1.4vh}
.rrow{background:var(--navy-2);border-radius:1.4vw;padding:1.6vh 1.6vw;display:grid;grid-template-columns:3vw 12vw 1fr 9vw;align-items:center;gap:1.4vw}
.rrow.first{outline:.3vw solid var(--star)}
.rrow .rk{font-size:2.4vw;font-weight:900;color:var(--muted)}
.rrow .gn{font-size:2vw;font-weight:900}
.rrow .gn small{display:block;font-size:1vw;color:var(--muted);font-weight:700;margin-top:.3vh}
.rrow .tp{display:grid;grid-template-columns:repeat(5,1fr);gap:.8vw}
.rrow .tp div{font-size:.85vw;color:var(--muted);font-weight:700;line-height:1.2}
.rrow .tp div b{display:block;font-size:1.5vw;color:#fff;margin-top:.3vh}
.rrow .tp div b i{font-style:normal;color:var(--star)}
.rrow .tt{text-align:right;font-size:2.8vw;font-weight:900;color:var(--blue)}
.rrow .tt small{font-size:1.1vw;color:var(--muted)}
.qrbox{background:#fff;border-radius:2vw;padding:1.6vw;text-align:center;color:var(--navy)}
.qrbox img{width:100%;display:block}
.qrbox div{font-size:1.6vw;font-weight:900;margin-top:1vh}
.qrbox p{font-size:1vw;font-weight:700;color:#5B6B7C;margin-top:.4vh}
.status{margin-top:2vh;background:var(--navy-2);border-radius:1.4vw;padding:1.4vw;text-align:center;font-weight:800;font-size:1.3vw}
.status.off{color:var(--red)}
.ctl{position:fixed;right:1.4vw;bottom:1.4vw;display:flex;gap:.8vw}
.ctl button{border:0;border-radius:1vw;padding:.9vw 1.5vw;font-size:1.1vw;font-weight:800;background:var(--blue);color:#fff}
.ctl button.ghost{background:var(--navy-2);color:var(--soft)}
.keybox{max-width:420px;margin:18vh auto 0;display:flex;flex-direction:column;gap:14px;padding:0 16px}
.field{width:100%;border:0;border-radius:18px;padding:18px;font-size:30px;font-weight:800;background:#fff;color:var(--navy);outline:none;letter-spacing:.3em;text-align:center}
@media (max-width:900px){
  .layout{grid-template-columns:1fr}
  .rrow{grid-template-columns:28px 1fr auto;padding:14px}
  .rrow .tp{grid-column:1/-1;grid-template-columns:repeat(5,1fr)}
  .rrow .rk,.rrow .gn{font-size:18px}.rrow .gn small,.rrow .tp div{font-size:11px}.rrow .tp div b{font-size:16px}
  .rrow .tt{font-size:24px}.rrow .tt small{font-size:12px}
  .layout h1{font-size:26px}.board header{font-size:15px}.board header .meta{font-size:13px}
  .qrbox{max-width:260px}.qrbox div{font-size:18px}.qrbox p{font-size:12px}.status{font-size:15px}
  .ctl button{font-size:14px;padding:10px 14px}
}
.gbtn.locked{opacity:.45}
.gbtn.locked span{color:var(--muted)}
.gtog{display:inline-block;margin-top:.6vh;border:0;border-radius:999px;padding:.3vh .9vw;font-size:.9vw;font-weight:800;background:#3A2530;color:var(--red)}
.gtog.on{background:#163B2C;color:#7EE2A8}
@media (max-width:900px){.gtog{font-size:11px;padding:3px 9px}}
.share{display:flex;align-items:center;gap:16px;margin-top:22px;background:#fff;color:var(--navy);border-radius:22px;padding:14px}
.share img{width:120px;height:120px;flex:none;display:block}
.share b{display:block;font-size:18px;font-weight:900}
.share span{display:block;font-size:14px;color:#5B6B7C;font-weight:600;margin-top:4px;line-height:1.35}

/* ---------- poll: phone ---------- */
.ideas{display:flex;flex-direction:column;gap:12px;margin-top:20px}
.idea{background:var(--navy-2);border-radius:22px;padding:16px}
.idea .it{display:flex;gap:12px;align-items:flex-start}
.idea .num{flex:none;width:30px;height:30px;border-radius:50%;background:var(--navy-3);display:grid;place-items:center;font-weight:900;font-size:14px;color:var(--soft)}
.idea h2{font-size:18px;font-weight:850;line-height:1.25}
.idea p{font-size:14px;color:var(--muted);margin-top:3px;line-height:1.35}
.yns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.yn{border:0;border-radius:16px;padding:14px;font-size:17px;font-weight:850;background:var(--navy-3);color:var(--soft)}
.yn.yes.on{background:var(--green);color:#fff}
.yn.no.on{background:#E5484D;color:#fff}

/* ---------- poll: projector ---------- */
.plist{display:flex;flex-direction:column;gap:.45vh}
.prow{display:grid;grid-template-columns:2.4vw minmax(0,1fr) 18vw 9vw;align-items:center;gap:1vw;background:var(--navy-2);border-radius:.9vw;padding:.42vh 1.2vw}
.prow .pk{font-size:1.1vw;font-weight:900;color:var(--muted)}
.prow .pt{font-size:1.25vw;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pbar{height:1vh;border-radius:999px;background:var(--navy-3);overflow:hidden}
.pbar i{display:block;height:100%;background:var(--green);border-radius:999px;transition:width .4s}
.prow .pp{font-size:1.3vw;font-weight:900;text-align:right;white-space:nowrap}
.prow .pp small{font-size:.85vw;color:var(--muted);font-weight:700}
.top5{max-width:78vw;margin:2vh auto 0;text-align:center}
.top5 h1{font-size:4vw;font-weight:900;letter-spacing:-.02em}
.top5 .sub{color:var(--soft);font-size:1.4vw;margin-top:.6vh}
.tlist{display:flex;flex-direction:column;gap:1.4vh;margin-top:3.4vh;text-align:left}
.trow{display:grid;grid-template-columns:6vw minmax(0,1fr) 10vw;align-items:center;gap:1.6vw;background:var(--navy-2);border-radius:1.6vw;padding:1.4vh 2vw;animation:rise .5s both}
.trow.r1{box-shadow:inset .5vw 0 0 #F5B301;animation-delay:1.6s}.trow.r2{box-shadow:inset .5vw 0 0 #C3CDD8;animation-delay:1.2s}.trow.r3{box-shadow:inset .5vw 0 0 #CD7F32;animation-delay:.8s}.trow.r4{animation-delay:.4s}
@keyframes rise{from{opacity:0;transform:translateY(2vh)}}
.tcup{width:5.4vw;height:5.4vw}
.trank{width:4.4vw;height:4.4vw;margin:0 auto;border-radius:50%;background:var(--navy-3);display:grid;place-items:center;font-size:1.8vw;font-weight:900;color:var(--soft)}
.trow .tt b{display:block;font-size:2vw;font-weight:900}
.trow .tt small{display:block;font-size:1.1vw;color:var(--muted);font-weight:700;margin-top:.4vh}
.trow .tp{text-align:right;font-size:2.8vw;font-weight:900;color:var(--green)}
.trow .tp small{display:block;font-size:1vw;color:var(--muted)}