:root{color:#fff6f0;background:#13070c;font-family:Inter,PingFang SC,Microsoft YaHei,Hiragino Sans GB,Arial,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box;touch-action:manipulation}body{min-width:320px;min-height:100vh;margin:0;-webkit-text-size-adjust:100%}.app-shell{min-height:100vh;padding:32px;background:linear-gradient(112deg,#ff2f5a47,#13070c00 38%),linear-gradient(252deg,#ffb75229,#13070c00 40%),linear-gradient(180deg,#2a0712,#13070c 48%,#090609)}.app-shell.is-result{background:radial-gradient(circle at 12% 16%,var(--theme-glow),transparent 28%),radial-gradient(circle at 88% 12%,color-mix(in srgb,var(--accent-soft),transparent 74%),transparent 30%),linear-gradient(180deg,var(--stage-start) 0%,var(--stage-mid) 52%,var(--stage-end) 100%)}.quiz-stage{display:grid;grid-template-columns:minmax(240px,.82fr) minmax(0,1.18fr);width:min(1120px,100%);min-height:calc(100vh - 64px);margin:0 auto;border:1px solid rgba(255,225,211,.2);border-radius:8px;overflow:hidden;background:#17070ddb;box-shadow:0 28px 96px #00000080,0 0 0 1px #ff366014}.quiz-stage.is-result{border-color:color-mix(in srgb,var(--accent),transparent 58%);background:radial-gradient(circle at 84% 12%,var(--theme-glow),transparent 28%),linear-gradient(145deg,var(--stage-start) 0%,var(--stage-mid) 48%,var(--stage-end) 100%);box-shadow:0 28px 96px #0000008a,0 0 0 1px color-mix(in srgb,var(--accent),transparent 80%)}.brand-panel{display:flex;flex-direction:column;justify-content:space-between;gap:28px;padding:36px;background:linear-gradient(160deg,rgba(255,54,96,.18),rgba(255,183,82,.05) 54%,transparent),#ffffff09;border-right:1px solid rgba(255,225,211,.13)}.quiz-stage.is-result .brand-panel{background:linear-gradient(160deg,var(--brand-wash),rgba(255,246,240,.04) 54%,transparent),#ffffff06}.eyebrow,.question-index{margin:0;color:#ffb752;font-size:13px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}h1,h2,p{overflow-wrap:anywhere}h1{max-width:8em;margin:8px 0 0;font-size:clamp(40px,8vw,72px);line-height:.98;letter-spacing:0;text-shadow:0 0 28px rgba(255,47,90,.42),0 2px 0 rgba(0,0,0,.28)}.subtitle{max-width:24em;margin:18px 0 0;color:#fff6f0c2;font-size:16px;line-height:1.8}.rule-copy{max-width:21em;margin:auto 0 0;padding:16px;border:1px solid rgba(255,225,211,.15);border-radius:8px;color:#fff6f0b8;background:linear-gradient(180deg,#ffffff12,#ff2f5a0a);line-height:1.7}.question-panel,.result-panel{display:flex;flex-direction:column;justify-content:center;gap:20px;padding:44px}.progress-row{display:flex;justify-content:space-between;gap:16px;color:#fff6f09e;font-size:14px;font-weight:700}.progress-track,.mini-track{overflow:hidden;background:#ffffff1a}.progress-track{height:8px;border-radius:999px}.progress-fill,.mini-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff2f5a,#ff8a5c,#ffcf5a);transition:width .22s ease}.question-card,.result-card{border:1px solid rgba(255,225,211,.17);border-radius:8px;background:linear-gradient(180deg,#fff6f012,#ff2f5a0b),#ffffff09;box-shadow:inset 0 1px #ffffff14}.question-card{padding:28px}.question-card h2,.result-card h2{margin:12px 0 0;font-size:clamp(24px,4vw,36px);line-height:1.28;letter-spacing:0}.option-grid{display:grid;gap:12px;margin-top:28px}.option-button{display:grid;grid-template-columns:46px minmax(0,1fr);align-items:center;width:100%;min-height:64px;padding:10px 14px 10px 8px;border:1px solid rgba(255,225,211,.14);border-radius:8px;color:#fff6f0;font:inherit;text-align:left;background:#0c06099e;-webkit-user-select:none;user-select:none;cursor:pointer;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease}.option-button:hover,.option-button:focus-visible{border-color:#ff486de0;background:linear-gradient(90deg,#ff2f5a1f,#ffb7520a),#1c080fc7;box-shadow:0 8px 24px #ff2f5a1f;transform:translateY(-2px)}.option-button.selected{border-color:#ffcf5af0;background:linear-gradient(90deg,#ff2f5a3d,#ffb7521f),#1c080fdb;box-shadow:0 10px 30px #ff2f5a33;transform:translateY(-2px)}.option-button.is-disabled{cursor:default;pointer-events:none}.option-key{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:#18070d;font-weight:900;background:linear-gradient(135deg,#ffcf5a,#ff486d);box-shadow:0 0 18px #ff486d52}.option-label{min-width:0;color:#fff6f0f0;font-size:17px;line-height:1.5}.ghost-button,.primary-button,.share-button,.steam-button{min-height:44px;border-radius:8px;font:inherit;-webkit-user-select:none;user-select:none;cursor:pointer}.ghost-button{align-self:flex-start;padding:0 18px;border:1px solid rgba(255,225,211,.18);color:#fff6f0bd;background:transparent}.ghost-button.is-disabled{opacity:.38;cursor:not-allowed;pointer-events:none}.result-card{padding:34px;border-color:color-mix(in srgb,var(--accent),transparent 42%);background:radial-gradient(circle at 84% 12%,color-mix(in srgb,var(--accent),transparent 68%),transparent 22%),linear-gradient(155deg,var(--card-wash),transparent 52%),#ffffff0e;box-shadow:inset 0 1px color-mix(in srgb,var(--accent),transparent 72%),0 20px 54px #00000047}.result-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.result-heading{min-width:0}.result-avatar{width:88px;height:88px;flex:0 0 88px;border:3px solid color-mix(in srgb,var(--accent),#fff6f0 18%);border-radius:50%;object-fit:cover;background:#fff6f014;box-shadow:0 0 0 5px color-mix(in srgb,var(--accent),transparent 84%),0 12px 28px #0000003d}.character{margin:8px 0 0;color:var(--accent);font-size:20px;font-weight:800}.keyword-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.keyword-list span{padding:7px 10px;border:1px solid color-mix(in srgb,var(--accent),transparent 48%);border-radius:999px;color:var(--accent);background:color-mix(in srgb,var(--accent),transparent 88%);font-size:13px;font-weight:800}.result-copy{display:grid;gap:12px;margin-top:26px}.result-copy p{margin:0;color:#fff6f0d6;font-size:17px;line-height:1.85}.result-actions{display:grid;gap:10px;margin-top:30px}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:0 18px;border:0;color:#13070c;font-weight:900;background:linear-gradient(90deg,var(--accent),var(--accent-soft));box-shadow:0 14px 36px color-mix(in srgb,var(--accent),transparent 72%)}.share-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:0 18px;border:1px solid color-mix(in srgb,var(--accent),transparent 38%);color:var(--accent);font-weight:900;background:linear-gradient(90deg,color-mix(in srgb,var(--accent),transparent 84%),transparent),#0c06098f}.share-button:hover,.share-button:focus-visible{box-shadow:0 10px 28px color-mix(in srgb,var(--accent),transparent 78%);transform:translateY(-1px)}.action-icon{width:18px;height:18px;flex:0 0 auto;fill:currentColor}.steam-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:0 18px;border:1px solid color-mix(in srgb,var(--accent-soft),transparent 38%);color:#13070c;font-weight:900;text-decoration:none;background:linear-gradient(90deg,color-mix(in srgb,var(--accent),#fff6f0 44%),color-mix(in srgb,var(--accent-soft),#fff6f0 50%));box-shadow:0 12px 30px color-mix(in srgb,var(--accent),transparent 80%)}.steam-button:hover,.steam-button:focus-visible{transform:translateY(-1px);box-shadow:0 14px 34px color-mix(in srgb,var(--accent),transparent 72%)}@media(max-width:840px){.app-shell{padding:16px}.quiz-stage{grid-template-columns:1fr;min-height:calc(100vh - 32px)}.brand-panel{padding:24px;border-right:0;border-bottom:1px solid rgba(255,225,211,.12)}h1{max-width:100%;font-size:42px}.question-panel,.result-panel{padding:24px}}@media(max-width:520px){.question-card,.result-card{padding:20px}.result-hero{align-items:center;gap:12px}.result-avatar{width:68px;height:68px;flex-basis:68px;border-width:2px}.option-button{grid-template-columns:40px minmax(0,1fr);min-height:72px}.option-label,.result-copy p{font-size:16px}}