*{box-sizing:border-box}:root{--bg:#07111f;--bg2:#0b1b2f;--panel:#13263eb8;--panel2:#0c1b30eb;--text:#f1efe7;--muted:#b8c1c7;--line:#f1efe724;--accent:#88a9c3;--gold:#d0c5a3}html{scroll-behavior:smooth}body{color:var(--text);background:radial-gradient(circle at 50% 0,#26486cc7 0%,#0b1b2ff0 38%,#03070e 100%),linear-gradient(#07111f,#03070e);margin:0;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans TC,sans-serif}body:before{content:"";pointer-events:none;z-index:-1;background:radial-gradient(circle at 12% 8%,#88a9c31f,#0000 28%),radial-gradient(circle at 88% 18%,#d0c5a31a,#0000 26%),radial-gradient(circle at 50% 92%,#607e9c1f,#0000 32%);position:fixed;inset:0}main{width:min(1080px,92vw);margin:0 auto;padding:56px 0 96px}.hero{align-content:center;min-height:68vh;display:grid}h1,.title-zh{letter-spacing:-.055em;margin:0;font-size:clamp(2.3rem,7vw,5.4rem);line-height:1.02}.title-zh{margin-top:.12em}.intro-card,.question-card,.result,.feedback-card,.nickname-card{border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(#ffffff14,#ffffff08),#0a182c8a;border-radius:28px;box-shadow:0 28px 90px #00000040}.intro-card{max-width:820px;margin-top:32px;padding:26px;font-size:1.1rem;line-height:1.75}.zh{color:#e7e1d2}.fineprint,.instruction,.spectrum-subtitle{color:var(--muted);font-size:.95rem;line-height:1.7}.data-notice{border-top:1px solid var(--line);margin-top:16px;padding-top:16px}.nickname-card{max-width:820px;margin-top:24px;padding:24px 26px}.nickname-card label{gap:12px;font-size:1.05rem;line-height:1.75;display:grid}.nickname-card input[type=text],textarea{border:1px solid var(--line);width:100%;color:var(--text);font:inherit;background:#03070e94;border-radius:16px;padding:14px}.nickname-card input[type=text]:focus,textarea:focus{border-color:#d0c5a3b3;outline:none;box-shadow:0 0 0 3px #d0c5a31f}.question-list{gap:22px;display:grid}.question-card{padding:26px;scroll-margin-top:24px;position:relative}.q-meta{color:var(--accent);letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px;font-size:.85rem}.question-card h2{margin:0 0 8px;font-size:clamp(1.25rem,2.2vw,1.8rem);line-height:1.35}.question-card h3{color:#eee7d8;margin:0 0 16px;font-size:clamp(1.1rem,2vw,1.45rem);font-weight:500;line-height:1.45}.options{gap:12px;margin-top:18px;display:grid}.option{text-align:left;border:1px solid var(--line);width:100%;color:var(--text);cursor:pointer;background:#06122194;border-radius:18px;grid-template-columns:32px 1fr;gap:12px;padding:16px;line-height:1.55;transition:all .18s;display:grid}.option:hover{background:#ffffff13;transform:translateY(-1px)}.option.selected{border-color:#d0c5a3cc;box-shadow:0 0 0 1px #d0c5a340,0 0 28px #88a9c326}.label{color:var(--gold);font-weight:700}.actions{align-items:center;gap:18px;margin:34px 0;display:flex}.primary{color:#07111f;cursor:pointer;background:linear-gradient(135deg,#d0c5a3,#88a9c3);border:0;border-radius:999px;padding:14px 22px;font-weight:800;box-shadow:0 16px 36px #00000047}.primary:hover{transform:translateY(-1px)}.primary:disabled{opacity:.65;cursor:wait}.result{margin-top:40px;padding:clamp(18px,3.2vw,30px);position:relative;overflow:hidden}.result:before{content:"";pointer-events:none;background:radial-gradient(circle at 18% 4%,#88a9c32e,#0000 28%),radial-gradient(circle at 85% 10%,#d0c5a324,#0000 30%);position:absolute;inset:-1px}.result>*{position:relative}.result-heading{max-width:880px;margin-bottom:20px}.eyebrow{color:var(--gold);letter-spacing:.14em;text-transform:uppercase;margin:0 0 8px;font-size:.8rem;font-weight:800}.result h2{letter-spacing:-.035em;margin:0;font-size:clamp(1.65rem,3.5vw,2.8rem);line-height:1.08}.result h3{color:#eee7d8;margin:6px 0 0;font-size:clamp(1.22rem,2.6vw,2rem);font-weight:650;line-height:1.22}.result-intro{color:var(--muted);margin-top:14px;font-size:.98rem;line-height:1.68}.result-grid{grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 16px;display:grid}.result-grid-featured{align-items:stretch}.result-card{border:1px solid color-mix(in srgb, var(--result-color) 60%, transparent);background:linear-gradient(180deg, color-mix(in srgb, var(--result-color) 30%, transparent), #ffffff09), #07111fb8;box-shadow:0 0 34px color-mix(in srgb, var(--result-color) 16%, transparent), inset 0 1px 0 #ffffff14;border-radius:22px;min-height:178px;padding:14px 14px 12px;position:relative;overflow:hidden}.result-card:before{content:"";background:linear-gradient(90deg, color-mix(in srgb, var(--result-color) 40%, transparent), transparent 34%), radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--result-color) 28%, transparent), transparent 38%);opacity:.42;pointer-events:none;position:absolute;inset:0}.result-card-glow{background:var(--result-color);filter:blur(28px);opacity:.26;pointer-events:none;border-radius:999px;width:108px;height:108px;position:absolute;top:-42px;right:-42px}.result-card>*{position:relative}.result-card-top{align-items:flex-start;gap:8px;margin-bottom:6px;display:flex}.result-swatch{background:var(--result-color);width:34px;height:7px;box-shadow:0 0 18px color-mix(in srgb, var(--result-color) 55%, transparent);border-radius:999px;flex:none;margin-top:5px}.role{color:var(--muted);font-size:.78rem;line-height:1.32}.result-name{letter-spacing:-.02em;margin:6px 0 4px;font-size:clamp(1.08rem,1.65vw,1.34rem);font-weight:850;line-height:1.14}.result-zh{color:#eee7d8;font-size:.93rem;line-height:1.36}.story{gap:12px;margin-top:24px;display:grid}.story-featured{border:1px solid var(--line);background:#03070e42;border-radius:24px;padding:18px}.story-heading{max-width:860px;margin-bottom:2px}.story-heading p{color:var(--muted);margin:0;line-height:1.72}.story-heading .eyebrow{color:var(--gold);margin-bottom:8px}.story-block{border-left:5px solid var(--result-color);background:linear-gradient(90deg, color-mix(in srgb, var(--result-color) 16%, transparent), #ffffff09);border-radius:16px;padding:14px 15px;box-shadow:inset 0 0 0 1px #ffffff09}.story-label{color:color-mix(in srgb, var(--result-color) 78%, white);font-size:.84rem;font-weight:850}.story-block p,.q2-note{margin-bottom:0;line-height:1.75}.story-block p{margin-top:6px}.q2-note{border:1px solid var(--line);color:var(--muted);background:#ffffff0b;border-radius:16px;padding:15px}.q2-note strong{color:#eee7d8}.spectrum-section{border-top:1px solid var(--line);margin-top:34px;padding-top:26px}.spectrum-section h3{font-size:clamp(1.25rem,2.4vw,1.8rem)}.spectrum-subtitle{max-width:900px}.spectrum-wall{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.spectrum-chip{border:1px solid color-mix(in srgb, var(--chip-color) 62%, transparent);color:#eee7d8;background:#ffffff09;border-radius:999px;align-items:center;gap:6px;padding:7px 10px;font-size:.78rem;transition:all .16s;display:inline-flex}.spectrum-chip:hover{background:#fff1;transform:translateY(-1px)}.spectrum-chip.highlighted{background:color-mix(in srgb, var(--chip-color) 44%, #ffffff14);box-shadow:0 0 28px color-mix(in srgb, var(--chip-color) 34%, transparent);font-weight:800;transform:scale(1.05)}.spectrum-dot{background:var(--chip-color);width:8px;height:8px;box-shadow:0 0 12px var(--chip-color);border-radius:999px}.feedback-card{margin-top:34px;padding:24px}.feedback-card h3{margin-top:0}.feedback-card label{gap:8px;margin:18px 0;line-height:1.7;display:grid}textarea{resize:vertical;min-height:94px}.saved{color:#b9d8b5}.error{color:#e5a0a0}.generated-image-panel{border:1px solid var(--line);background:#ffffff0b;border-radius:20px;margin-top:24px;padding:16px;overflow:hidden}.generated-image-panel h3{margin:0 0 8px}.generated-result-image{background:#07111f;border:1px solid #f1efe729;border-radius:16px;width:100%;max-width:420px;height:auto;margin:14px auto 0;display:block;box-shadow:0 20px 56px #00000042}.share-export-root{pointer-events:none;opacity:1;z-index:-1;width:1080px;height:1350px;position:fixed;top:0;left:-20000px;overflow:hidden}.share-card-export{width:1080px;height:1350px;color:var(--text);background:radial-gradient(circle at 10% 2%,#88a9c342,#0000 26%),radial-gradient(circle at 94% 8%,#d0c5a32e,#0000 28%),linear-gradient(#10233b,#07111f 70%,#040914);border-radius:0;padding:46px;position:relative;overflow:hidden}.share-export-bg{pointer-events:none;background:linear-gradient(120deg,#ffffff0f,#0000 34%),radial-gradient(circle at 50% 100%,#88a9c324,#0000 36%);position:absolute;inset:0}.share-card-export>*{position:relative}.share-export-header{justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:34px;display:flex}.share-export-title{letter-spacing:-.06em;font-size:72px;font-weight:900;line-height:1.02}.share-export-subtitle{color:#eee7d8;margin-top:12px;font-size:32px;font-weight:700;line-height:1.2}.share-export-mark{color:var(--gold);letter-spacing:.08em;border:1px solid #d0c5a36b;border-radius:999px;flex:none;padding:10px 14px;font-size:16px;font-weight:900}.share-export-blocks{gap:18px;display:grid}.share-export-item{border:1px solid color-mix(in srgb, var(--result-color) 38%, #ffffff14);background:linear-gradient(90deg, color-mix(in srgb, var(--result-color) 18%, transparent), #ffffff0a);border-radius:26px;grid-template-columns:18px 1fr;gap:18px;padding:24px;display:grid}.share-export-color{background:var(--result-color);width:18px;box-shadow:0 0 18px color-mix(in srgb, var(--result-color) 65%, transparent);border-radius:999px}.share-export-copy{min-width:0}.share-export-item-label{color:color-mix(in srgb, var(--result-color) 78%, white);margin-bottom:10px;font-size:24px;font-weight:850;line-height:1.28}.share-export-item-name{letter-spacing:-.03em;word-break:break-word;font-size:42px;font-weight:900;line-height:1.14}.share-export-item-zh{color:#eee7d8;word-break:break-word;margin-top:8px;font-size:28px;line-height:1.34}.share-export-note{color:var(--muted);background:#ffffff0b;border:1px solid #f1efe724;border-radius:22px;margin-top:22px;padding:22px 24px}.share-export-note strong{color:#eee7d8;font-size:26px}.share-export-note p{word-break:break-word;margin:12px 0 0;font-size:22px;line-height:1.62}@media (max-width:900px){.result-grid{grid-template-columns:1fr}.result-card{min-height:0}}@media (max-width:760px){main{width:min(94vw,680px);padding-top:30px}.hero{min-height:70vh}.question-card,.result,.intro-card,.feedback-card,.nickname-card{border-radius:22px;padding:18px}.option{grid-template-columns:26px 1fr}.actions{gap:10px;display:grid}.result-heading{margin-bottom:14px}.result-intro{font-size:.9rem;line-height:1.62}.result-grid{grid-template-columns:1fr;gap:8px;margin:12px 0 14px}.result-card{border-radius:18px;padding:10px 11px 9px}.result-card-top{margin-bottom:4px}.result-swatch{width:30px;height:6px;margin-top:4px}.role{font-size:.72rem;line-height:1.22}.result-name{margin:4px 0 2px;font-size:1rem;line-height:1.12}.result-zh{font-size:.84rem;line-height:1.28}.story-featured{padding:14px}.story-block{padding:12px 13px}.generated-image-panel{padding:12px}.generated-result-image{border-radius:14px;max-width:100%}.spectrum-chip{font-size:.74rem}}