:root{--paper:#f4efe3;--paper2:#ebe5d4;--ink:#2f3a36;--mute:#6d776f;--sage:#7d9582;--sage-d:#587060;--mist:#8fa7b5;--mist-l:#dde7ea;--line:#d6cfbb}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{background:#e4dfd0}
body{font-family:-apple-system,"PingFang SC","Hiragino Sans GB","Noto Sans CJK SC","Microsoft YaHei",sans-serif;color:var(--ink);line-height:1.7;min-height:100vh;display:flex;justify-content:center}
.sheet{width:100%;max-width:420px;min-height:100vh;background:var(--paper);background-image:radial-gradient(rgba(125,149,130,.08) 1px,transparent 1.2px);background-size:14px 14px;padding:28px 22px calc(36px + env(safe-area-inset-bottom));position:relative;box-shadow:0 0 40px rgba(60,60,40,.08)}
.serif{font-family:"Songti SC","Noto Serif CJK SC","STSong",serif}
.fade{animation:fade .35s ease both}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.fade{animation:none}*{transition:none!important}}
/* home */
.home{display:flex;flex-direction:column;min-height:calc(100vh - 64px)}
.home .eyebrow{font-size:12px;letter-spacing:.3em;color:var(--sage-d);margin-top:30px}
.home h1{font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:44px;line-height:1.25;margin:18px 0 18px;font-weight:700;letter-spacing:.02em}
.home h1 em{font-style:normal;color:var(--sage-d);background:linear-gradient(transparent 62%,var(--mist-l) 62%)}
.home .lead{color:var(--mute);font-size:15px;max-width:300px}
.home .dots{display:flex;gap:8px;margin:26px 0}
.home .dots i{width:10px;height:10px;border-radius:50%;background:var(--sage);opacity:.35}
.home .dots i:nth-child(odd){background:var(--mist)}
.spacer{flex:1}
.btn{display:block;width:100%;border:0;border-radius:14px;padding:15px 18px;font-size:16px;letter-spacing:.1em;background:var(--sage-d);color:#fbf8ef;cursor:pointer;font-family:inherit;transition:background .2s,transform .1s}
.btn:active{transform:scale(.985)}
.btn:hover{background:#4a6252}
.btn.ghost{background:transparent;color:var(--sage-d);border:1px solid var(--sage)}
.btn.ghost:hover{background:var(--mist-l)}
.fine{font-size:11.5px;color:var(--mute);margin-top:16px;line-height:1.6}
/* quiz */
.top{display:flex;align-items:center;gap:12px;margin-bottom:26px}
.back{border:1px solid var(--line);background:transparent;color:var(--sage-d);width:34px;height:34px;border-radius:50%;font-size:16px;cursor:pointer;flex:none}
.back[disabled]{opacity:.3;cursor:default}
.bar{flex:1;height:6px;background:var(--paper2);border-radius:3px;overflow:hidden}
.bar b{display:block;height:100%;background:linear-gradient(90deg,var(--mist),var(--sage));border-radius:3px;transition:width .3s ease}
.count{font-size:12px;color:var(--mute);min-width:38px;text-align:right;font-variant-numeric:tabular-nums}
.qno{font-size:12px;letter-spacing:.25em;color:var(--sage-d)}
.scene{font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:23px;line-height:1.5;margin:10px 0 24px;font-weight:700}
.opts{display:flex;flex-direction:column;gap:12px}
.opt{display:flex;gap:12px;align-items:flex-start;text-align:left;width:100%;background:#fbf8ef;border:1px solid var(--line);border-radius:14px;padding:14px 14px;font-size:15px;color:var(--ink);cursor:pointer;font-family:inherit;line-height:1.55;transition:border-color .2s,background .2s}
.opt .k{flex:none;width:24px;height:24px;border-radius:50%;background:var(--mist-l);color:var(--sage-d);font-size:12px;display:flex;align-items:center;justify-content:center;margin-top:1px}
.opt:hover,.opt.on{border-color:var(--sage);background:#f1f4ec}
.opt.on .k{background:var(--sage-d);color:#fff}
/* result */
.res .eyebrow{font-size:12px;letter-spacing:.3em;color:var(--sage-d);margin-top:6px}
.res h1{font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:42px;line-height:1.2;margin:14px 0 8px;font-weight:700}
.res .tag{display:inline-block;font-size:14px;color:var(--sage-d);background:var(--mist-l);padding:4px 12px;border-radius:999px}
.res .sum{margin:20px 0 6px;font-size:15.5px}
.card{background:#fbf8ef;border:1px solid var(--line);border-radius:16px;padding:16px 18px;margin-top:16px}
.card h2{font-size:13px;letter-spacing:.2em;color:var(--sage-d);margin-bottom:8px;font-weight:600}
.card ul{list-style:none}
.card li{position:relative;padding-left:16px;font-size:14.5px;margin:4px 0}
.card li:before{content:"";position:absolute;left:2px;top:.8em;width:6px;height:6px;border-radius:50%;background:var(--sage)}
.card.risk li:before{background:var(--mist)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{font-size:13.5px;background:var(--paper2);padding:4px 12px;border-radius:999px}
.radar{display:block;margin:4px auto 0;width:100%;max-width:330px;height:auto}
.radar .grid{fill:none;stroke:var(--line);stroke-width:1}
.radar .shape{fill:rgba(125,149,130,.35);stroke:var(--sage-d);stroke-width:2;stroke-linejoin:round}
.radar text{font-size:11px;fill:var(--ink);font-family:inherit}
.radar text.top{fill:var(--sage-d);font-weight:700}
.radar circle{fill:var(--sage-d)}
.btns{display:flex;gap:12px;margin-top:22px}
.toast{text-align:center;font-size:13px;color:var(--sage-d);height:20px;margin-top:10px}

.res .tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.res .school{display:inline-block;font-size:12.5px;color:#fbf8ef;background:var(--sage-d);padding:4px 12px;border-radius:999px;letter-spacing:.08em}
.res .intro{margin:20px 0 6px;font-size:15.5px;line-height:1.85}
.res .top3{display:block;margin-top:10px;font-size:13.5px;color:var(--sage-d);padding-top:10px;border-top:1px dashed var(--line)}

.res .rarity{margin:2px 0 12px}
.res .badge{display:inline-block;font-size:13px;letter-spacing:.06em;padding:4px 12px;border-radius:999px;border:1px solid transparent}
.res .badge.r-rare{background:#3f5a68;color:#f4efe3}
.res .badge.r-mid{background:#a9bfc9;color:#2f3a36}
.res .badge.r-common{background:#dfe7dc;color:#4a6252;border-color:#b9c8b8}
.res .rnote{display:block;font-size:11px;color:var(--mute);margin-top:6px;line-height:1.5}
