:root{--night-900: #080a14;--night-800: #0e1120;--night-700: #151a2e;--night-600: #1e2440;--line: rgba(201, 162, 39, .22);--line-soft: rgba(236, 227, 207, .1);--parchment: #ece3cf;--parchment-dim: #b9b09a;--parchment-faint: #7d7768;--gold: #c9a227;--gold-bright: #e8c667;--gold-deep: #8a6d15;--gryffindor: #a01818;--slytherin: #1f6b47;--ravenclaw: #3a5ba0;--radius: 14px;--radius-sm: 9px;--serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", Georgia, serif;--sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--night-900);color:var(--parchment);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}.sky{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-2;background:radial-gradient(900px 520px at 18% -8%,rgba(201,162,39,.13),transparent 62%),radial-gradient(760px 480px at 92% 108%,rgba(58,91,160,.18),transparent 64%),linear-gradient(180deg,#0b0e1a,#0f1324 46%,#090b15)}.sky:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.35;background-image:radial-gradient(1px 1px at 12% 22%,rgba(236,227,207,.8),transparent),radial-gradient(1px 1px at 68% 12%,rgba(236,227,207,.55),transparent),radial-gradient(1px 1px at 34% 68%,rgba(236,227,207,.5),transparent),radial-gradient(1px 1px at 82% 54%,rgba(236,227,207,.7),transparent),radial-gradient(1px 1px at 52% 88%,rgba(236,227,207,.45),transparent),radial-gradient(1px 1px at 92% 78%,rgba(236,227,207,.5),transparent),radial-gradient(1px 1px at 24% 44%,rgba(236,227,207,.4),transparent)}.page{width:100%;max-width:560px;margin:0 auto;padding:22px 18px 56px}.display{font-family:var(--serif);font-weight:700;letter-spacing:.02em;line-height:1.28;margin:0;color:#fbf5e6}.kicker{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.22em;color:var(--gold-bright);text-transform:uppercase}.kicker:before,.kicker:after{content:"";width:18px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}.kicker:after{background:linear-gradient(90deg,var(--gold),transparent)}.muted{color:var(--parchment-dim)}.faint{color:var(--parchment-faint)}.rule{height:1px;border:0;margin:22px 0;background:linear-gradient(90deg,transparent,var(--line),transparent)}.card{position:relative;background:linear-gradient(180deg,#1e2440b8,#0e1120b8);border:1px solid var(--line);border-radius:var(--radius);padding:22px 20px;box-shadow:0 18px 44px #00000073,inset 0 1px #ece3cf0d}.card--framed:before,.card--framed:after{content:"";position:absolute;width:14px;height:14px;border:1px solid var(--gold);opacity:.5}.card--framed:before{top:8px;left:8px;border-right:0;border-bottom:0}.card--framed:after{bottom:8px;right:8px;border-left:0;border-top:0}.input{width:100%;padding:13px 14px;border-radius:var(--radius-sm);border:1px solid var(--line-soft);background:#080a1499;color:var(--parchment);font:inherit;font-size:16px;letter-spacing:.14em;transition:border-color .18s,box-shadow .18s}.input::placeholder{color:var(--parchment-faint);letter-spacing:.06em}.input:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 3px #c9a22724}.btn{width:100%;padding:14px 16px;border:0;border-radius:var(--radius-sm);background:linear-gradient(180deg,var(--gold-bright),var(--gold));color:#1d1608;font-family:var(--serif);font-size:16px;font-weight:700;letter-spacing:.14em;cursor:pointer;transition:transform .14s,filter .18s,opacity .18s;box-shadow:0 8px 22px #c9a22738}.btn:active{transform:scale(.985)}.btn:disabled{background:#ece3cf1a;color:var(--parchment-faint);box-shadow:none;cursor:not-allowed}.btn-ghost{width:100%;padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius-sm);background:transparent;color:var(--parchment-dim);font-family:var(--serif);font-size:14.5px;letter-spacing:.1em;cursor:pointer;transition:color .18s,border-color .18s}.btn-ghost:active{transform:scale(.985)}.btn-ghost:hover{color:var(--parchment);border-color:var(--gold)}.link-btn{border:0;background:none;padding:6px 2px;color:var(--parchment-faint);font:inherit;font-size:13px;cursor:pointer;transition:color .18s}.link-btn:hover{color:var(--gold-bright)}.link-btn:disabled{opacity:.4;cursor:default}.notice{margin:12px 0 0;padding:11px 13px;border-radius:var(--radius-sm);font-size:13px;line-height:1.6;background:#a0181824;border:1px solid rgba(224,90,90,.3);color:#f0b4b4}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 0 18px}.topbar-brand{display:flex;align-items:center;gap:9px;font-family:var(--serif);font-size:15px;font-weight:700;letter-spacing:.16em;color:var(--parchment)}.topbar-mark{width:26px;height:26px;display:grid;place-items:center;border:1px solid var(--gold);border-radius:50%;font-size:12px;color:var(--gold-bright)}.progress-track{height:2px;border-radius:2px;background:#ece3cf1a;overflow:hidden}.progress-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-bright));box-shadow:0 0 10px #e8c66780;transition:width .42s cubic-bezier(.22,1,.36,1)}.q-index{font-family:var(--serif);font-size:12.5px;letter-spacing:.18em;color:var(--parchment-faint)}.q-index b{color:var(--gold-bright);font-size:15px}.q-text{font-family:var(--serif);font-size:clamp(1.14rem,4.6vw,1.42rem);font-weight:700;line-height:1.66;color:#fbf5e6;margin:16px 0 22px}.opt{display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;padding:15px;margin-bottom:10px;border-radius:var(--radius-sm);border:1px solid var(--line-soft);background:#151a2e8c;color:var(--parchment);font:inherit;font-size:15px;line-height:1.6;cursor:pointer;transition:border-color .16s,background .16s,transform .12s}.opt:hover{border-color:#c9a22773}.opt:active{transform:scale(.99)}.opt.is-active{border-color:var(--gold);background:linear-gradient(180deg,#c9a22729,#c9a2270f);box-shadow:0 0 0 1px #c9a2274d,0 10px 24px #00000059}.opt-key{flex:0 0 auto;width:23px;height:23px;display:grid;place-items:center;margin-top:1px;border-radius:50%;border:1px solid var(--line);font-family:var(--serif);font-size:11.5px;font-weight:700;color:var(--parchment-dim);transition:all .16s}.opt.is-active .opt-key{background:var(--gold);border-color:var(--gold);color:#1d1608}.whisper{margin:0;padding:10px 0 0;font-family:var(--serif);font-size:13px;letter-spacing:.08em;color:var(--gold-bright);text-align:center}.portrait{position:relative;width:100%;aspect-ratio:3 / 4;max-width:250px;margin:0 auto;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--night-700);box-shadow:0 22px 50px #00000080}.portrait img{width:100%;height:100%;object-fit:cover;display:block}.portrait:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,transparent 58%,rgba(8,10,20,.72) 100%)}.house-tag{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:99px;font-size:11.5px;font-weight:700;letter-spacing:.12em;border:1px solid currentColor}.match-ring{display:inline-flex;align-items:baseline;gap:3px;font-family:var(--serif);color:var(--gold-bright)}.match-ring b{font-size:28px;line-height:1}.quote-block{margin:0;padding:14px 16px;border-left:2px solid var(--gold);background:#c9a22712;border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-family:var(--serif);font-size:15px;line-height:1.75;color:#f5ecd8}.trait-chips{display:flex;flex-wrap:wrap;gap:8px}.trait-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:99px;border:1px solid var(--line);background:#151a2e99;font-size:13px;color:var(--parchment)}.bar-row{margin-bottom:13px}.bar-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:6px}.bar-name{font-family:var(--serif);font-size:13.5px;letter-spacing:.08em;color:var(--parchment)}.bar-val{font-size:12px;color:var(--parchment-faint);font-variant-numeric:tabular-nums}.bar-track{height:6px;border-radius:99px;background:#ece3cf14;overflow:hidden}.bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-bright))}.bar-fill--dim{background:linear-gradient(90deg,#2e3a5c,#5b6d9e)}.grid-16{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.grid-16 figure{margin:0;text-align:center}.grid-16 .thumb{width:100%;aspect-ratio:3 / 4;border-radius:7px;overflow:hidden;border:1px solid var(--line-soft);background:var(--night-700);margin-bottom:5px}.grid-16 .thumb img{width:100%;height:100%;object-fit:cover;display:block}.grid-16 .thumb.is-you{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}.grid-16 figcaption{font-size:10px;line-height:1.3;color:var(--parchment-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.grid-16 .is-you+figcaption{color:var(--gold-bright)}.strip{display:flex;gap:7px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}.strip::-webkit-scrollbar{display:none}.strip img{flex:0 0 auto;width:60px;height:78px;object-fit:cover;object-position:top center;border-radius:6px;border:1px solid var(--line-soft);opacity:.72}.stat-row{display:flex;justify-content:space-around;text-align:center;gap:8px}.stat-num{font-family:var(--serif);font-size:1.6rem;font-weight:700;color:var(--gold-bright);line-height:1.1}.stat-label{font-size:11.5px;color:var(--parchment-faint);letter-spacing:.1em}.step{display:grid;grid-template-columns:26px minmax(0,1fr);gap:12px;padding:13px 0;border-top:1px solid var(--line-soft);font-size:13.5px;line-height:1.68;color:var(--parchment-dim)}.step:last-child{border-bottom:1px solid var(--line-soft)}.step-no{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line);font-family:var(--serif);font-size:12px;color:var(--gold-bright)}.step b{display:block;color:var(--parchment);font-weight:700;margin-bottom:2px}.mark{color:var(--gold-bright);font-weight:700}.mark-warn{color:#f0b4b4;font-weight:700}.rune{width:74px;height:74px;margin:0 auto 26px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-size:30px;box-shadow:0 0 34px #c9a2272e inset}.center-screen{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center}@media (max-width: 360px){.grid-16{grid-template-columns:repeat(3,1fr)}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}