:root{--bg:#07101f;--panel:#111b31;--line:#354766;--txt:#f7f9ff;--muted:#b2bdd8;--a:#5c7cff;--b:#2bd7c8}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(145deg,#07101f,#141c35);color:var(--txt);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif}
main{max-width:780px;margin:auto;padding:18px 14px 50px}.screen{background:rgba(17,27,49,.96);border:1px solid var(--line);border-radius:24px;padding:20px;box-shadow:0 22px 60px rgba(0,0,0,.35)}.hidden{display:none!important}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:22px}.logo{width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,var(--a),var(--b));display:grid;place-items:center;font-weight:900}.k{font-size:11px;color:#a9fff7;font-weight:900;letter-spacing:.12em}
h1{font-size:clamp(29px,8vw,52px);line-height:1.08;margin:0 0 14px}h2{font-size:clamp(22px,5vw,34px);line-height:1.35}.muted{color:var(--muted);line-height:1.75}.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.card,.btn,.answer{background:#17223a;border:1px solid #425475;color:#fff;border-radius:17px;padding:16px;cursor:pointer}.card strong{display:block;font-size:20px;margin-bottom:6px}.card p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}.btn{text-align:center;font-weight:850}.primary{background:linear-gradient(135deg,var(--a),#477dff 55%,var(--b));border:0}.privacy,.notice,.resultBox,.theoryBox{margin-top:14px;padding:17px;border-radius:18px;border:1px solid var(--line);background:#0e192d}.privacy{background:linear-gradient(135deg,rgba(92,124,255,.16),rgba(43,215,200,.06))}
.privacy h3,.notice h3{margin:0 0 8px}.points{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.point{padding:10px;border-radius:13px;background:#121f36;border:1px solid #33496c;color:#c5d0ea;font-size:12px}
.top{display:flex;justify-content:space-between}.progress{height:9px;background:#26334c;border-radius:999px;overflow:hidden;margin:16px 0 22px}.progress div{height:100%;background:linear-gradient(90deg,var(--a),var(--b))}
.answer{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.answer.selected{background:linear-gradient(135deg,#5b48d6,#277f92);border-color:#c3bcff}.dot{width:20px;height:20px;border:2px solid #91a0c6;border-radius:50%;display:grid;place-items:center}.answer.selected .dot{background:#75f1e4;color:#07101f}
.nav{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.bar{height:9px;background:#25314a;border-radius:999px;overflow:hidden;margin:10px 0}.bar div{height:100%;background:linear-gradient(90deg,var(--a),var(--b))}
.modeTag{display:inline-block;padding:5px 9px;border-radius:999px;background:#253559;color:#d9e2ff;font-size:11px;font-weight:800}.change{margin:12px 0;padding:12px;text-align:center;background:#27344c;border:1px solid #4a5a79;border-radius:15px;cursor:pointer}
@media(max-width:560px){.grid,.points{grid-template-columns:1fr}}