:root{--ink:#18212b;--muted:#687487;--line:#dce3ea;--card:#fff;--bg:#f5f7fa;--accent:#315f72;--accent2:#e9f1f4;--danger:#a23b3b}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink)}
.shell{max-width:720px;margin:auto;min-height:100vh;padding:20px 16px 100px}.topbar{position:sticky;top:0;background:rgba(245,247,250,.96);backdrop-filter:blur(10px);z-index:4;padding:8px 0 12px}
.brand{font-weight:750;font-size:14px;letter-spacing:.02em}.progress-wrap{margin-top:10px}.progress{height:8px;background:#e0e5ea;border-radius:999px;overflow:hidden}.progress>div{height:100%;background:var(--accent);width:0}.progress-label{font-size:12px;color:var(--muted);margin-top:6px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 5px 18px rgba(30,45,55,.05)}
h1{font-size:28px;line-height:1.15;margin:0 0 10px}h2{font-size:23px;margin:0 0 12px}h3{font-size:18px;margin:24px 0 10px}
p{line-height:1.55}.muted{color:var(--muted)}.eyebrow{font-size:13px;color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.notice{background:#fff8e8;border:1px solid #efdcaa;border-radius:12px;padding:12px 14px;font-size:14px;margin:14px 0}
.question{margin:22px 0}.qtext{font-weight:650;line-height:1.4;margin-bottom:10px}.examples{font-size:14px;color:var(--muted);line-height:1.45;margin:-4px 0 18px}
.scale-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:7px;gap:6px}
.choices{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.choices.six{grid-template-columns:repeat(6,1fr)}
.choice input{display:none}.choice label{display:flex;align-items:center;justify-content:center;min-height:48px;border:1px solid #cbd4dd;border-radius:12px;background:#fff;font-weight:700;cursor:pointer}
.choice input:checked+label{background:var(--accent);color:white;border-color:var(--accent)}.choice small{display:block;font-weight:500}
.option-list{display:grid;gap:8px}.option{border:1px solid #cbd4dd;border-radius:12px;padding:12px 13px;background:#fff}.option label{display:flex;gap:10px;align-items:flex-start;cursor:pointer}.option input{margin-top:3px;transform:scale(1.15)}
input[type=text],textarea{width:100%;border:1px solid #cbd4dd;border-radius:12px;padding:13px;font:inherit;background:#fff}textarea{min-height:110px;resize:vertical}
.nav{position:fixed;bottom:0;left:0;right:0;background:rgba(255,255,255,.96);border-top:1px solid var(--line);padding:12px 16px;z-index:5}.nav-inner{max-width:720px;margin:auto;display:flex;justify-content:space-between;gap:12px}
button{font:inherit;border:0;border-radius:12px;padding:13px 18px;font-weight:700;cursor:pointer}.primary{background:var(--accent);color:white;flex:1}.secondary{background:#e9edf1;color:var(--ink)}.ghost{background:transparent;color:var(--accent)}
.topic-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.topic-num{font-size:13px;color:var(--muted);white-space:nowrap}
.pill{display:inline-block;border-radius:999px;padding:5px 9px;background:var(--accent2);color:var(--accent);font-size:12px;font-weight:700}
.review{font-size:14px}.hidden{display:none!important}.error{color:var(--danger);font-size:13px;margin-top:8px}.select-count{font-size:13px;color:var(--muted);margin:8px 0}
@media(max-width:520px){.shell{padding:12px 12px 92px}.card{padding:18px;border-radius:16px}h1{font-size:24px}h2{font-size:21px}.choices,.choices.six{gap:6px}.choice label{min-height:46px;border-radius:10px}.nav{padding:9px 12px}}

.reward-box{margin:20px 0;padding:18px;border:2px dashed #b9c7cf;border-radius:16px;text-align:center;background:#fbfcfd}
.reward-code{font-size:30px;font-weight:800;letter-spacing:.08em;margin:10px 0 16px}

.live-count{font-weight:700;padding:7px 10px;border-radius:10px;background:#f2f5f7;display:inline-block;margin-bottom:10px}
.live-count.count-complete{background:#e8f3ec;color:#235c36}