/* Result-first layout; the platform brand tokens remain authoritative. */
.hero{padding-bottom:20px}.hero h1{font-size:30px}.hero-foot{margin-top:16px}.hero .intro{font-size:13px}
.has-result .hero,.has-result .steps{display:none}.has-result .mode-banner{margin-bottom:16px;padding:7px 12px;font-size:11px}
.has-result .shell{padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))}
.result-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:20px 0 18px}
.result-heading h1{font-size:27px;margin:0;letter-spacing:-.03em}.result-heading .eyebrow{margin:0 0 5px;font-size:11px}
.result-heading button{white-space:nowrap}.personal{padding:24px}.personal-job h2{font-size:21px}.personal-job .hint{margin:6px 0 12px;overflow-wrap:anywhere}
.qualification-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:6px;font-size:11px;color:#16855d;background:#e4f5ed}
.qualification-badge:before{content:'✓';font-weight:700}
.own-overview{display:grid;grid-template-columns:1fr 1fr;margin:22px 0;padding:0 0 4px}
.own-overview>div+div{border-left:1px solid var(--line);padding-left:24px}.own-overview span{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}
.own-overview strong{display:block;font:700 38px/1.15 var(--num);color:var(--brand);font-variant-numeric:tabular-nums}
.own-overview>div+div strong{font-size:25px;padding-top:8px;color:var(--ink)}.own-overview strong.rank-locked{font-size:22px;color:#8791a2;letter-spacing:1px}
.personal .metrics.small{padding:14px 8px;border-radius:10px}.personal .metrics.small span{font-size:10px}.personal .metrics.small b{font-size:17px}
#ranking-card .section-head{margin-bottom:16px;align-items:center}#ranking-card h2{font-size:20px}#list-count{margin:4px 0 0;font-size:11px}
.locked-columns{display:grid;grid-template-columns:.7fr 1.2fr 1fr 1fr;gap:8px;font-size:11px;color:#8490a3;padding:13px 5px;border-bottom:1px solid var(--line)}
.locked-columns span:nth-child(n+3){text-align:right}.lock-body{text-align:center;padding:23px 8px 12px;background:linear-gradient(180deg,#f8faff,#fff)}
.lock-symbol{display:grid;place-items:center;width:46px;height:46px;margin:0 auto 15px;border-radius:14px;color:var(--brand);background:var(--brand-soft)}.lock-symbol svg{width:23px;height:23px}
.lock-body h3{font-size:17px;margin:0 0 9px}.lock-body>p{font-size:12px;line-height:1.8;color:var(--muted);margin:0 auto 18px;max-width:330px}
.invite-progress-line{display:flex;justify-content:space-between;align-items:center;max-width:260px;margin:18px auto 4px;padding:10px 14px;background:var(--brand-softer);border-radius:9px;font-size:12px;color:var(--brand-ink)}
.invite-progress-line strong{font-family:var(--num);font-size:17px;color:var(--brand)}
.ranking-note{font-size:11px;line-height:1.8;color:var(--muted);border-top:1px solid var(--line);margin:18px 0 0;padding-top:13px}
.invite-rule{font-size:11px;color:var(--muted);line-height:1.8;margin:0 4px 12px}
.gap-metrics{padding:14px 6px;margin-bottom:10px}.gap-metrics b{font-size:19px}.gap-metrics span{font-size:10px}
.result-actions{position:fixed;bottom:0;left:0;right:0;z-index:20;border-top:1px solid var(--line);background:#fffffffa;box-shadow:0 -4px 18px #1b315908;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))}
.result-actions>div{max-width:832px;margin:auto;display:flex;gap:12px}.result-actions .primary{flex:1}.result-actions .secondary{min-width:100px}
#invite-dialog{width:min(460px,calc(100vw - 24px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid var(--line);border-radius:20px;padding:25px;color:var(--ink);box-shadow:0 18px 48px #17203329}
#invite-dialog::backdrop{background:#17203380;backdrop-filter:blur(2px)}body:has(#invite-dialog[open]){overflow:hidden}
.dialog-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.dialog-heading h2{font-size:22px}.dialog-heading .eyebrow{font-size:10px;letter-spacing:0}
.dialog-close{display:grid;place-items:center;flex:none;width:36px;height:36px;border:0;border-radius:50%;background:#f2f5fa;color:#667085;font-size:25px;cursor:pointer}
#invite-dialog .invite-code{padding:15px;margin:16px 0}#invite-dialog .invite-code strong{font-size:25px;user-select:all}#invite-dialog label{font-size:12px}#invite-dialog input{font-size:12px}
#invite-record-list{font-size:12px;line-height:1.8;color:var(--muted);padding:14px 0 0}.invite-record{display:flex;gap:16px;justify-content:space-between;padding:12px 0;border-bottom:1px solid #edf1f7}.invite-record strong{font-size:11px;color:#16855d}
#share-feedback{color:var(--brand);min-height:0}#share-feedback:empty{display:none}
@media(max-width:640px){.hero h1{font-size:26px}.hero-foot{gap:20px}.result-heading{margin:16px 0}.result-heading h1{font-size:23px}.personal{padding:20px 18px}.personal-job h2{font-size:19px}.own-overview strong{font-size:36px}.own-overview>div+div{padding-left:18px}.own-overview>div+div strong{font-size:23px}.own-overview strong.rank-locked{font-size:21px}.own-overview{margin:20px 0}.personal .metrics.small b{font-size:16px}#ranking-card{padding:21px 18px}.lock-body h3{font-size:16px}.gap-metrics b{font-size:17px}.result-actions button{font-size:13px}#invite-dialog{padding:22px 20px}}