:root{color-scheme:light;--bg:#f1f4f8;--ink:#203044;--muted:#7087a3;--line:#d6e0ec;--blue:#243d5d;--light:#e7eef7}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.8}button,input,textarea{font:inherit}button,.button{border:1px solid var(--blue);background:var(--blue);color:white;padding:12px 24px;cursor:pointer;display:inline-block;text-decoration:none;text-align:center;font-weight:600;line-height:1.6;border-radius:2px}button:disabled{opacity:.45;cursor:default}button.secondary,.button.secondary{background:transparent;color:var(--blue);border-color:var(--line)}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #628bb8;outline-offset:3px}input:not([type=checkbox]){width:100%;padding:12px;border:1px solid var(--line);background:#f8fafd;color:var(--ink);border-radius:3px}input[type=checkbox]{width:19px;height:19px;accent-color:var(--blue)}label{display:block;margin:20px 0}label>span:first-child{display:block;margin-bottom:8px}a{color:var(--blue)}img{display:block;max-width:100%}.site-header{border-bottom:1px solid var(--line);padding:22px max(24px,calc((100vw - 1160px)/2));background:#f1f4f8ed}.brand{font-size:21px;letter-spacing:2px;text-decoration:none;font-weight:700}main{max-width:1160px;margin:0 auto;padding:36px 24px 70px}.loading{text-align:center;margin:80px 0}.muted,.small{color:var(--muted)}.small{font-size:13px}.hero{display:grid;grid-template-columns:1fr 420px;gap:70px;align-items:center;min-height:590px}.hero h1{font-size:clamp(32px,4.3vw,55px);line-height:1.5;letter-spacing:1px;margin:0 0 24px}.hero p{max-width:500px}.hero-photo{width:100%;max-width:380px;justify-self:center}.hero .button{margin-top:25px;min-width:240px}.meta{margin:16px 0;font-size:13px;color:var(--muted)}.section{margin:60px 0}.section h2{font-size:26px;line-height:1.5;margin-bottom:26px}.features{display:grid;grid-template-columns:1fr 1fr;gap:22px}.feature{background:white;border:1px solid var(--line);padding:20px;display:grid;grid-template-columns:105px 1fr;gap:20px;align-items:center}.feature h3{font-size:19px;margin:0 0 8px}.feature p{font-size:14px;margin:0}.asset{position:relative;overflow:hidden;background:#e9eef5;width:100%}.asset img{position:absolute;height:auto;max-width:none;display:block}.panel{background:#fff;border:1px solid var(--line);padding:32px;max-width:760px;margin:24px auto}.panel h1{font-size:30px;line-height:1.5;margin:0 0 18px}.panel h2{font-size:23px}.notice{background:var(--light);padding:16px;color:#465d79;margin:20px 0}.check{display:flex;gap:10px;align-items:flex-start;font-size:14px}.check>span{margin:0!important}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}.actions>*{flex:1;min-width:130px}.payment-grid{display:grid;grid-template-columns:1fr 300px;gap:32px;align-items:start}.payment-code{width:280px;max-width:100%;height:auto;margin:18px auto}.amount{font-size:36px;font-weight:700;margin:15px 0}.receipt{overflow-wrap:anywhere;font-size:13px}.status-dot{width:12px;height:12px;display:inline-block;margin-right:10px;border-radius:50%;background:#819bb9}.status-heading{font-size:27px;line-height:1.5}.scene-grid,.detail-grid{display:flex;flex-wrap:wrap;gap:12px}.chip{background:#f6f9fd;border:1px solid var(--line);color:#607f9f;padding:10px 18px;font-size:15px;font-weight:400}.chip.chosen{background:#e6effa;border-color:#7898be;color:#24466d}.scene-detail{margin-top:20px;padding-top:12px;border-top:1px solid var(--line)}.detail-grid .chip{font-size:14px;padding:7px 12px}.question{max-width:820px}.question-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:13px;padding-bottom:16px;border-bottom:1px solid var(--line)}.question h1{font-size:25px;margin:22px 0;line-height:1.7}.comparison{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:14px;margin:22px 0}.reference{padding:0;background:transparent;color:var(--ink);border:2px solid var(--line);font-weight:400;overflow:hidden}.reference.active{border-color:#365f90;background:#e8f0fa}.reference span{display:block;padding:8px;text-align:left;font-size:13px}.options{display:grid;gap:12px;margin:24px 0}.option{color:var(--ink);background:white;border:1px solid var(--line);font-weight:400;text-align:left;padding:15px;display:flex;gap:14px;align-items:center}.option.active{background:#eaf1fa;border-color:#7d9bc0}.option b{width:27px;height:27px;flex-shrink:0;border:1px solid var(--line);border-radius:50%;font-weight:400;text-align:center;font-size:14px;color:#6284aa;line-height:25px}.option.active b{background:#456c97;color:white}.hint{margin:22px 0;color:var(--muted);font-size:14px}.save-state{color:var(--muted);font-size:13px;min-height:25px}.help{color:#5d80ab;font-size:14px;margin:20px 0}.help summary{cursor:pointer}.report{max-width:980px;margin:auto}.report-cover{background:#20334c;color:white;padding:32px;margin-bottom:24px}.report-cover h1{font-size:32px}.report .heading{display:flex;align-items:center;gap:15px;margin:38px 0 20px}.heading b{font-style:italic;color:#7c99b8;font-size:31px}.heading h2{font-size:23px;margin:0}.report .card{padding:28px;background:white;border:1px solid var(--line);margin:20px 0}.report .card h3{margin:0 0 16px;font-size:21px}.examples{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:24px}.examples h3{font-size:16px!important}.swatches{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px;margin:18px 0 30px}.swatch span{display:block;height:65px;border:1px solid var(--line)}.swatch small{display:block;margin-top:5px;font-size:13px}.wear,.occasion{border-top:1px solid var(--line);padding-top:24px;margin-top:24px}.outfit-row{display:grid;grid-template-columns:minmax(150px,240px) 1fr;gap:30px;align-items:center}.outfit-row .asset{max-width:240px;margin:auto}.beauty{display:grid;grid-template-columns:1fr 1fr;gap:36px}.beauty .asset{max-width:230px;margin:0 auto 18px}.beauty p{font-size:15px}.beauty .small{font-size:13px}.footer{margin-top:46px;color:var(--muted);font-size:13px}.footer a{font-size:14px}#toast{display:none;position:fixed;left:50%;bottom:30px;transform:translateX(-50%);padding:14px 22px;background:#20334cf2;color:white;z-index:10;max-width:min(90vw,600px);border-radius:4px}dialog{border:1px solid var(--line);padding:20px;max-width:min(95vw,680px);max-height:95vh;background:var(--bg);color:var(--ink)}dialog::backdrop{background:#172537b8}dialog .asset{max-height:82vh}#close-image{margin-bottom:14px}dialog #zoom-content{width:min(80vw,530px)}.export-status{font-size:13px;color:var(--muted);margin-top:15px}.empty{padding:32px;text-align:center;color:var(--muted)}
@media(min-width:1000px){.report{max-width:920px}.report .scene-card{padding:30px}.question{margin-top:30px}.features .feature{min-height:190px}}
@media(max-width:700px){body{font-size:15px}.site-header{padding:18px 20px}.brand{font-size:18px;letter-spacing:1px}main{padding:24px 16px 50px}.hero{display:flex;flex-direction:column;gap:25px;min-height:0;align-items:stretch}.hero h1{font-size:32px;line-height:1.6;margin-bottom:16px}.hero-photo{width:84%;max-width:340px;align-self:center}.hero .button{display:block;width:100%;margin-top:24px}.hero-copy{display:contents}.hero .intro-copy{order:0}.hero-photo{order:1}.hero .hero-action{order:2}.features{grid-template-columns:1fr;gap:16px}.feature{grid-template-columns:88px 1fr;padding:16px;gap:18px}.feature h3{font-size:17px}.feature p{font-size:13px}.section{margin:40px 0}.section h2{font-size:23px}.panel{margin:12px 0;padding:22px 18px}.panel h1{font-size:25px}.payment-grid{grid-template-columns:1fr;gap:10px}.payment-code{max-width:250px}.question h1{font-size:21px}.comparison{gap:8px}.reference span{font-size:12px;padding:7px}.option{padding:12px;font-size:15px}.report-cover{padding:24px}.report-cover h1{font-size:26px}.report .card{padding:20px}.heading h2{font-size:20px}.swatches{grid-template-columns:repeat(3,1fr);gap:12px}.swatch span{height:55px}.examples{gap:14px}.examples p{font-size:13px}.beauty{gap:20px}.outfit-row{grid-template-columns:minmax(115px,42%) 1fr;gap:18px}.outfit-row p{font-size:13px;margin:8px 0}.actions{gap:10px}.actions button{padding:12px 16px}.report .heading{gap:10px}.report .card h3{font-size:18px}}
@media print{.site-header,.actions,.footer,#toast,dialog,.export-status{display:none!important}body{background:white}.report .card,.report-cover{break-inside:avoid}main{max-width:none;padding:0}}