:root{color:#294940;font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-synthesis:none}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;min-width:320px}button,input{font:inherit}button{cursor:pointer}body{background:#d2dfd6}.mobile-prototype{background:#e8efe9;margin:0 auto;max-width:520px;min-height:100%;overflow-x:hidden;position:relative}.screen{isolation:isolate;min-height:100dvh;overflow:hidden;position:relative}.screen-bg,.screen-bg img{height:100%;top:0;right:0;bottom:0;left:0;position:absolute;width:100%}.screen-bg{z-index:-2}.screen-bg:after{background:#041c1a42;content:"";top:0;right:0;bottom:0;left:0;position:absolute}.screen-bg img{object-fit:cover}.home-screen .screen-bg:after{background:#e7f3e81f}.quiz-screen .screen-bg:after,.reveal-screen .screen-bg:after{background:#0419188a}.result-screen .screen-bg:after{background:#082521a8}.quiz-screen .screen-bg img,.reveal-screen .screen-bg img,.result-screen .screen-bg img{object-position:center top}.home-screen{align-items:center;display:flex;flex-direction:column;justify-content:flex-end;padding:40px 24px 42px}.home-copy,.intro-copy{text-align:center}.home-copy{margin-top:auto;max-width:348px}.eyebrow{color:#8f6b32;font-size:12px;letter-spacing:.2em;margin:0 0 10px}.home-copy h1,.intro-copy h2{color:#31594d;font-family:Songti SC,STSong,serif;font-size:clamp(38px,11vw,48px);font-weight:600;letter-spacing:.08em;line-height:1.05;margin:0}.home-copy>.eyebrow{color:#d4ad62;text-shadow:0 1px 8px rgb(2 29 26 / 74%)}.home-copy h1{color:#f7ebc8;text-shadow:0 2px 12px rgb(2 29 26 / 86%)}.home-copy .lead{-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#05252147;border:1px solid rgb(255 239 195 / 16%);border-radius:11px;color:#fff8e2f5;padding:5px 9px;text-shadow:0 1px 8px rgb(2 29 26 / 80%)}.lead,.intro-copy p{color:#537368;font-size:15px;line-height:1.75;margin:18px auto 0}.key-box{background:#fffffbc2;border:1px solid rgb(188 157 91 / 42%);border-radius:22px;box-shadow:0 14px 35px #32544526;display:grid;gap:10px;margin-top:26px;padding:18px;text-align:left}.key-box label{color:#497266;font-size:13px}.key-box input{background:#ffffffc2;border:1px solid #b7c9bd;border-radius:12px;color:#31594d;font-size:14px;letter-spacing:.08em;outline:0;padding:12px 13px}.key-box input:focus{border-color:#6b9584;box-shadow:0 0 0 3px #4d7c681f}.error-text{color:#a24e44;font-size:12px;margin:0}.primary-button,.ghost-button{align-items:center;border-radius:999px;display:inline-flex;font-size:14px;font-weight:700;gap:7px;height:44px;justify-content:center;padding:0 18px}.primary-button{background:#315e50;border:1px solid #315e50;box-shadow:0 8px 18px #315e5033;color:#fffdf4}.primary-button:disabled{cursor:wait;opacity:.65}.ghost-button{background:#fffffab8;border:1px solid #89a496;color:#3e6a5c}.primary-button svg,.ghost-button svg{height:16px;width:16px}.unlock-meta{-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#0525213d;border:1px solid rgb(255 239 195 / 12%);border-radius:999px;color:#fff7dee0;display:flex;font-size:12px;gap:14px;justify-content:center;margin:22px auto 0;padding:5px 12px;text-shadow:0 1px 6px rgb(2 29 26 / 76%);width:fit-content}.demo-hint{color:#9b7941;font-size:12px;margin:12px 0 0}.intro-screen{justify-content:flex-start;padding-bottom:34px;padding-top:80px}.intro-copy{max-width:340px}.intro-screen .intro-copy{background:linear-gradient(180deg,#051e1cb8,#051e1c85);border:1px solid rgb(240 210 125 / 24%);border-radius:24px;box-shadow:0 12px 28px #0015132e;padding:15px 16px 17px}.intro-copy h2{font-size:clamp(30px,8vw,40px);line-height:1.25}.intro-screen .intro-copy h2{color:#fff7dc;text-shadow:0 2px 8px rgb(0 18 17 / 38%)}.intro-screen .intro-copy h2 span{display:block;letter-spacing:.025em;white-space:nowrap}.intro-copy p{font-size:14px;margin-top:14px}.intro-screen .intro-copy>p:not(.eyebrow){color:#dce8dc}.intro-figures{height:146px;margin:30px -24px 0;overflow:hidden;padding-block:8px;width:calc(100% + 48px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}.intro-track{animation:intro-marquee 58s linear infinite;display:flex;height:100%;width:max-content}.intro-group{display:flex;gap:10px;padding-right:10px}.intro-figure{animation:intro-figure-float 6.4s ease-in-out infinite;background:#f1f6efa3;border:2px solid #f8f4e7;border-radius:31px 31px 12px 12px;box-shadow:0 8px 22px #38514530;flex:0 0 76px;height:130px;overflow:hidden}.intro-figure:nth-child(3n){animation-delay:-2.2s;transform:translateY(6px) rotate(-.5deg)}.intro-figure:nth-child(4n){animation-delay:-4.2s;transform:translateY(-3px) rotate(.6deg)}.intro-figure img,.intro-figure span{display:block;height:100%;object-fit:cover;object-position:center top;width:100%}.intro-figure span{background:linear-gradient(120deg,#fffffb1a,#fffffb94,#fffffb1a)}@keyframes intro-marquee{0%{transform:translateZ(0)}to{transform:translate3d(-50%,0,0)}}@keyframes intro-figure-float{0%,to{translate:0 0}50%{translate:0 -6px}}.start-button{margin-top:auto;min-width:160px}.quiz-screen{display:flex;flex-direction:column;justify-content:center;padding:24px 20px 90px}.quiz-head{color:#c4d9cb;display:flex;font-size:12px;justify-content:space-between;left:20px;letter-spacing:.08em;position:absolute;right:20px;top:24px;z-index:2}.question-stage{background:#f8faf4e8;border:1px solid rgb(188 157 91 / 40%);border-radius:28px;box-shadow:0 20px 45px #0014133d;margin:0;padding:24px 18px;transform:translateY(28px)}.question-scene{color:#a27a3d;font-size:12px;letter-spacing:.16em;margin:0 0 12px}.question-stage h2{color:#31594d;font-family:Songti SC,STSong,serif;font-size:clamp(23px,6.3vw,30px);font-weight:600;line-height:1.45;margin:0;text-wrap:pretty}.question-options{display:grid;gap:9px;margin-top:22px}.question-option{align-items:flex-start;background:#f5f8f2;border:1px solid #c2d2c5;border-radius:15px;color:#42695c;display:flex;font-size:14px;gap:10px;line-height:1.6;padding:12px;text-align:left;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;width:100%}.question-option:hover{border-color:#7c9e8d;transform:translateY(-1px)}.question-option.selected{background:#3f6c5b;border-color:#3f6c5b;color:#fffdf7}.question-option:disabled{cursor:default}.option-index{align-items:center;background:#dce8dd;border-radius:50%;color:#416b5c;display:inline-flex;flex:0 0 24px;font-size:11px;height:24px;justify-content:center;margin-top:1px}.question-option.selected .option-index{background:#d5bd7b;color:#284c40}.question-option b{display:block;font-size:14px;font-weight:700}.quiz-bottom{align-items:center;bottom:20px;display:grid;gap:14px;grid-template-columns:42px 1fr 42px;left:20px;position:absolute;right:20px;z-index:2}.round-button{background:#fffffac2;border:1px solid #aabfb2;border-radius:50%;color:#3e6c5d;display:grid;height:42px;place-items:center;width:42px}.round-button:disabled{opacity:.35}.round-button svg{height:18px;width:18px}.progress-wrap{align-items:center;display:flex;gap:10px}.progress-track{background:#cde1d36b;border-radius:99px;height:5px;overflow:hidden;width:100%}.progress-track i{background:#d5bd7b;border-radius:inherit;display:block;height:100%;transition:width .25s ease}.progress-wrap span{color:#c4d9cb;font-size:11px;min-width:28px}.reveal-screen{align-items:center;display:flex;justify-content:center;padding:24px}.reveal-copy{align-items:center;color:#dceadf;display:flex;flex-direction:column;text-align:center}.reveal-copy svg{color:#d5bd7b;height:46px;width:46px}.reveal-copy p{font-size:14px;letter-spacing:.08em;margin:22px 0 10px}.reveal-copy strong{font-family:Songti SC,STSong,serif;font-size:23px;font-weight:500}.reveal-copy i{background:#bd9654;display:block;height:2px;margin-top:24px;position:relative;width:180px}.reveal-copy i:after{animation:reveal-progress 1.05s ease-in-out forwards;background:#f7ebbc;content:"";height:2px;left:0;position:absolute;top:0;width:0}@keyframes reveal-progress{to{width:100%}}.result-screen{overflow:visible}.result-scroll{padding:16px 16px 36px}.result-hero{aspect-ratio:9 / 16;background:#dce8df;border-radius:26px;box-shadow:0 16px 36px #0014134d;overflow:hidden;position:relative}.result-hero>img{height:100%;top:0;right:0;bottom:0;left:0;object-fit:cover;object-position:center center;opacity:0;position:absolute;transition:opacity .28s ease;width:100%}.result-hero.is-image-loaded>img{opacity:1}.result-title{align-items:flex-start;bottom:16px;color:#fffdf6;display:flex;flex-direction:column;gap:5px;left:16px;max-width:calc(100% - 32px);position:absolute;text-shadow:0 1px 5px rgb(0 23 20 / 76%);z-index:1}.result-title>*{-webkit-backdrop-filter:blur(8px) saturate(112%);backdrop-filter:blur(8px) saturate(112%);background:linear-gradient(135deg,#0c332d40,#051f1c1a);border:1px solid rgb(255 241 202 / 24%);border-radius:10px;box-shadow:inset 0 1px #ffffff26,0 5px 14px #0014121f;margin:0;max-width:100%;width:fit-content}.result-title p{color:#f0d27d;font-size:11px;letter-spacing:.12em;padding:3px 7px}.result-title h1{font-family:Songti SC,STSong,serif;font-size:clamp(30px,8vw,38px);font-weight:600;letter-spacing:.03em;line-height:1.12;padding:4px 9px 5px}.result-title strong{font-size:14px;padding:4px 8px}.result-title span{font-size:11px;line-height:1.5;opacity:.94;padding:4px 8px}.report-panel{background:#fffffbe8;border:1px solid rgb(174 194 179 / 72%);border-radius:22px;box-shadow:0 10px 24px #00191721;margin-top:14px;padding:20px}.section-title{align-items:center;color:#315f50;display:flex;font-family:Songti SC,STSong,serif;font-size:20px;font-weight:600;gap:8px;margin:0 0 14px}.section-title svg{color:#a97d3e;height:20px;width:20px}.report-lead{color:#466b5d;font-size:15px;line-height:1.85;margin:0;text-wrap:pretty}.axis-intro{color:#6f857a;font-size:12px;line-height:1.6;margin:-5px 0 6px}.radar-chart{display:grid;margin:3px auto 0;max-width:250px;place-items:center}.radar-chart svg{display:block;height:auto;width:100%}.radar-grid{fill:none;stroke:#dbe6dc;stroke-width:1}.radar-axis{stroke:#e3ece4;stroke-width:1}.radar-shape{fill:#396f5a38;stroke:#477a65;stroke-width:2}.radar-point{fill:#a87a39;stroke:#fffdf8;stroke-width:1.5}.radar-label{fill:#55776c;font-size:11px;font-weight:700}.radar-score{fill:#9a7440;font-size:10px;font-weight:800}.compact-axis-list{display:grid;gap:9px;margin-top:10px}.axis-row{align-items:center;color:#57766a;display:grid;font-size:12px;gap:8px;grid-template-columns:60px 1fr 28px}.axis-row i{background:#e2ece3;border-radius:99px;display:block;height:6px;overflow:hidden}.axis-row i b{background:#5a8a72;border-radius:inherit;display:block;height:100%}.axis-row em{color:#9a7440;font-size:11px;font-style:normal;text-align:right}.similarity-list{display:grid;gap:10px;list-style:none;margin:0;padding:0}.similarity-list li{background:#f5f8f3;border-radius:14px;color:#42695c;font-size:14px;line-height:1.7;padding:12px 13px 12px 35px;position:relative}.similarity-list li:before{color:#a97d3e;content:"◆";font-size:10px;left:15px;position:absolute;top:16px}.insight-grid{display:grid;gap:10px;grid-template-columns:1fr 1fr}.insight-grid article{background:#f4f8f4;border-radius:15px;color:#56766a;min-height:156px;padding:14px}.insight-grid svg{color:#aa7b3c;height:20px;width:20px}.insight-grid span{display:block;font-size:12px;margin-top:12px}.insight-grid p{color:#42695c;font-size:13px;line-height:1.65;margin:7px 0 0}.reading-row{border-top:1px solid #e0e9df;margin-top:16px;padding-top:14px}.reading-row span{color:#9a7440;font-size:12px}.reading-row p{color:#496d60;font-size:14px;line-height:1.75;margin:6px 0 0;text-wrap:pretty}.disclaimer{color:#bcd0c2;font-size:11px;line-height:1.6;margin:16px 8px;text-align:center}.action-row{display:grid;gap:10px;grid-template-columns:1.4fr 1fr}.action-row .primary-button,.action-row .ghost-button{padding:0 10px}.poster-capture{background:#123d39;border-radius:32px;color:#fff8df;height:640px;left:-10000px;overflow:hidden;pointer-events:none;position:fixed;top:0;width:358px}.poster-bg{top:0;right:0;bottom:0;left:0;position:absolute}.poster-bg{height:100%;object-fit:cover;object-position:center center;width:100%}.poster-content{display:flex;flex-direction:column;height:100%;justify-content:space-between;padding:24px 22px 20px;position:relative;z-index:1}.poster-brand{align-items:center;color:#fff4d2f0;display:flex;justify-content:space-between;text-shadow:0 1px 6px rgb(0 23 20 / 78%)}.poster-brand span{font-size:13px;font-weight:800}.poster-brand small{font-size:10px;opacity:.72}.poster-bottom{align-items:end;display:grid;gap:8px;grid-template-columns:minmax(0,1fr) 150px;margin-top:auto}.poster-main{align-items:flex-start;display:flex;flex-direction:column;gap:4px}.poster-main>*{-webkit-backdrop-filter:blur(8px) saturate(112%);backdrop-filter:blur(8px) saturate(112%);background:linear-gradient(135deg,#0c332d45,#051f1c1c);border:1px solid rgb(255 241 202 / 22%);box-shadow:0 5px 14px #0014121f;margin:0;text-shadow:0 1px 5px rgb(0 23 20 / 78%);width:fit-content}.poster-main>span{border-radius:999px;color:#f0d27d;display:inline-grid;font-size:9px;font-weight:800;height:20px;padding:0 7px;place-items:center}.poster-main h2{border-radius:8px;font-family:Songti SC,STSong,serif;font-size:30px;line-height:1.05;padding:3px 6px 4px}.poster-main strong{border-radius:7px;font-size:11px;padding:3px 6px}.poster-main p{border-radius:8px;color:#fffae8f0;font-size:10px;line-height:1.48;max-width:158px;padding:4px 6px}.poster-radar-card{-webkit-backdrop-filter:blur(8px) saturate(108%);backdrop-filter:blur(8px) saturate(108%);background:#0626223d;border:1px solid rgb(255 235 177 / 20%);border-radius:16px;padding:7px 6px 5px}.poster-radar-card>strong{color:#fff8dfeb;display:block;font-size:10px;text-align:center;text-shadow:0 1px 5px rgb(0 23 20 / 78%)}.poster-radar{margin:0 auto;max-width:138px}.poster-radar .radar-grid{stroke:#fff1c440}.poster-radar .radar-axis{stroke:#fff1c433}.poster-radar .radar-shape{fill:#f0d27d33;stroke:#f0d27d}.poster-radar .radar-point{fill:#f0d27d;stroke:#173f3a}.poster-radar .radar-label{fill:#fff8dfe0;font-size:13px}.poster-radar .radar-score{fill:#f0d27d;font-size:12px}.poster-overlay{align-items:center;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#081d1cd6;display:flex;height:100dvh;justify-content:center;left:50%;padding:14px;position:fixed;top:0;transform:translate(-50%);width:min(100vw,520px);z-index:100}.poster-preview{display:grid;gap:10px;grid-template-rows:auto minmax(0,1fr) auto;height:100%;max-height:748px;max-width:390px;text-align:center;width:100%}.poster-preview-head,.poster-preview-actions{align-items:center;color:#fff8dfe0;display:flex;justify-content:space-between}.poster-preview-head{padding-inline:2px}.poster-preview-head span{font-size:13px;font-weight:800}.poster-preview-head button{background:#ffffff1f;border:0;border-radius:50%;color:#fff8df;display:grid;height:32px;padding:0;place-items:center;width:32px}.poster-preview-head button svg{height:18px;width:18px}.poster-preview-media{display:grid;min-height:0;overflow:hidden;place-items:center;position:relative}.poster-preview img{border-radius:24px;box-shadow:0 24px 72px #00000057;height:min(100%,640px);max-width:100%;object-fit:contain;width:auto}.poster-preview-actions{padding:0 4px}.poster-preview-actions p{color:#fff8dfad;font-size:12px;margin:0}.poster-preview-actions button{align-items:center;background:#f0d27d;border:0;border-radius:999px;color:#173f3a;display:inline-flex;font-size:13px;font-weight:800;gap:6px;height:38px;padding:0 14px}.poster-preview-actions button:disabled{cursor:wait;opacity:.72}.poster-preview-actions button svg{height:15px;width:15px}@media(min-width:560px){body{padding:18px 0}.mobile-prototype{border-radius:24px;box-shadow:0 18px 54px #2b4a3d33}}@media(max-height:720px){.home-screen{padding-bottom:24px;padding-top:20px}.home-copy h1{font-size:36px}.lead{margin-top:10px}.key-box{margin-top:16px}.intro-screen{padding-top:42px}.intro-figures{height:116px;margin-top:15px;padding-block:5px}.intro-figure{flex-basis:60px;height:107px}.question-stage{padding:18px 16px;transform:translateY(18px)}.question-options{gap:7px;margin-top:14px}.question-option{padding-block:9px}}@media(prefers-reduced-motion:reduce){.intro-track,.intro-figure{animation:none}.intro-figures{overflow-x:auto;-webkit-mask-image:none;mask-image:none}.result-hero>img{transition:none}}
