:root{--bg:#141015;--panel:#1f1921;--line:#3a2f3d;--text:#f4ecf1;--muted:#a99aa6;--accent:#d6456b;--ok:#4cc38a;--bad:#e5484d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:system-ui,-apple-system,PingFang SC,Noto Sans CJK SC,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--bg);height:100%;color:var(--text);margin:0}body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent}#app{height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);flex-direction:column;max-width:1600px;margin:0 auto;display:flex}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:8px 16px;display:flex}.brand{letter-spacing:.02em;font-weight:600}.pill{border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:2px 10px;font-size:12px}.pill.ok{color:var(--ok);border-color:var(--ok)}.pill.bad{color:var(--bad);border-color:var(--bad)}.layout{flex-direction:column;flex:1;gap:12px;min-height:0;padding:12px 16px;display:flex}.stage{background:#000;border-radius:12px;flex:1;min-height:0;position:relative;overflow:hidden}.panel{background:var(--panel);border-radius:12px;flex-direction:column;flex:none;gap:12px;padding:12px;display:flex}@media (orientation:landscape){.layout{flex-direction:row}.panel{width:300px;overflow-y:auto}}.stage video,.stage canvas{object-fit:contain;width:100%;height:100%;position:absolute;inset:0}.stage.mirror video,.stage.mirror canvas{transform:scaleX(-1)}.placeholder{color:var(--muted);place-items:center;font-size:15px;display:grid;position:absolute;inset:0}.hud{white-space:pre;pointer-events:none;background:#0000008c;border-radius:8px;padding:6px 10px;font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;position:absolute;top:8px;left:8px}.hud:empty{display:none}.controls{flex-wrap:wrap;align-items:center;gap:8px;display:flex}button{font:inherit;color:var(--text);border:1px solid var(--line);cursor:pointer;background:#2c2430;border-radius:10px;min-height:44px;padding:10px 14px;font-size:14px}button.primary{background:var(--accent);border-color:var(--accent)}button:disabled{opacity:.45;cursor:default}.toggle{align-items:center;gap:6px;min-height:44px;font-size:14px;display:flex}.fpslog{flex-direction:column;gap:6px;display:flex}.muted{color:var(--muted);font-size:13px}#msg:empty{display:none}input#device-name{font:inherit;color:var(--text);border:1px solid var(--line);background:#2c2430;border-radius:10px;padding:10px 12px;font-size:16px}.stage video{opacity:0;pointer-events:none}.stage{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.hint{color:var(--muted);pointer-events:none;background:#00000073;border-radius:8px;padding:4px 8px;font-size:12px;position:absolute;bottom:8px;right:8px}.stage.comparing .hint{color:var(--text)}.makeup{flex-direction:column;gap:8px;display:flex}.cats{flex-wrap:wrap;gap:6px;display:flex}.cat{border-radius:18px;flex:none;min-height:36px;padding:4px 12px;font-size:14px;position:relative}.cat.on{background:var(--accent);border-color:var(--accent)}.cat.active:after{content:"";background:#4cc38a;border-radius:50%;width:6px;height:6px;position:absolute;top:4px;right:4px}.swatch.none i{background:repeating-linear-gradient(45deg,#0000 0 5px,#ffffff40 5px 6px)}.swatches{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.swatch{background:0 0;border:2px solid #0000;border-radius:10px;flex-direction:column;align-items:center;gap:4px;min-height:0;padding:6px 2px;font-size:12px;display:flex}.swatch i{border-radius:50%;width:32px;height:32px;display:block;box-shadow:inset 0 0 0 1px #fff3}.swatch.on{border-color:var(--text)}.slider{grid-template-columns:5.5em 1fr 3ch;align-items:center;gap:8px;font-size:14px;display:grid}.slider input{width:100%}@media (orientation:portrait){.swatches{grid-template-columns:repeat(8,minmax(0,1fr))}.swatch{font-size:11px}.swatch i{width:26px;height:26px}}.topright{align-items:center;gap:8px;display:flex}button.lang{min-height:32px;padding:4px 10px;font-size:13px}.tabs{background:#2c2430;border-radius:12px;grid-template-columns:1fr 1fr 1fr;gap:4px;padding:4px;display:grid}.tab{background:0 0;border:none;min-height:40px}.tab.on{background:var(--accent)}body:not(.mode-tryon) .tryon-only,body:not(.mode-skin) .skin-only,body:not(.mode-learn) .learn-only{display:none!important}body.mode-skin .hint{display:none}.skin{flex-direction:column;gap:8px;display:flex}.qc-list{grid-template-columns:1fr auto auto;gap:2px 10px;font-size:13px;display:grid}.qc-list .v{text-align:right;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.qc-list .ok{color:var(--ok)}.qc-list .bad{color:var(--bad)}.qc-prompt{text-align:center;pointer-events:none;background:#0009;border-radius:999px;max-width:90%;padding:8px 16px;font-size:17px;position:absolute;top:12px;left:50%;transform:translate(-50%)}.qc-prompt.good{background:#1e7850d9}.qc-count{color:#fff;text-shadow:0 2px 12px #000;pointer-events:none;place-items:center;font-size:96px;font-weight:700;display:grid;position:absolute;inset:0}.thumb{object-fit:contain;background:#000;border-radius:8px;width:100%;max-height:180px}.trial summary{cursor:pointer;color:var(--muted);font-size:14px}.trial select{font:inherit;color:var(--text);border:1px solid var(--line);background:#2c2430;border-radius:10px;min-height:44px;padding:8px;font-size:16px}button.linkish{color:var(--muted);background:0 0;border:none;align-self:flex-start;min-height:32px;padding:0;font-size:13px;text-decoration:underline}dialog#consent{background:var(--panel);max-width:min(92vw,460px);color:var(--text);border:1px solid var(--line);border-radius:14px;padding:18px}dialog#consent::backdrop{background:#0009}dialog#consent p{color:var(--text);font-size:14px;line-height:1.55}body.mode-learn .stage #gl,body.mode-learn .stage #overlay{object-fit:cover;width:50%}body.mode-learn .stage #gl2{object-fit:cover;width:50%;left:50%}body.mode-learn .stage:after{content:"";background:var(--bg);width:2px;position:absolute;top:0;bottom:0;left:50%}body.mode-learn .hud,body.mode-learn .hint{display:none}.side-tag{pointer-events:none;z-index:1;background:#0000008c;border-radius:999px;padding:3px 10px;font-size:12px;position:absolute;top:8px}.side-tag.left{left:8px}.side-tag.right{left:calc(50% + 8px)}.learn{flex-direction:column;gap:8px;display:flex}.lbl{color:var(--muted);font-size:13px}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{border-radius:18px;min-height:36px;padding:4px 12px;font-size:14px}.chip.on{background:var(--accent);border-color:var(--accent)}.draft{color:#e0b252}.plan-head{flex-wrap:wrap;align-items:baseline;gap:8px;display:flex}.plan-head #btn-prep-open{margin-left:auto}.card{background:#2c2430;border-radius:12px;flex-direction:column;gap:10px;padding:12px;display:flex}.card-title{font-weight:600}.card-text{min-height:3em;font-size:17px;line-height:1.5}.card select{font:inherit;color:var(--text);border:1px solid var(--line);background:#1f1921;border-radius:8px;min-width:0;padding:6px;font-size:16px}.step-list{grid-template-columns:1fr 1fr;gap:4px;display:grid}.step{cursor:pointer;background:#2c2430;border-radius:8px;grid-template-columns:auto 1fr auto;align-items:center;gap:6px;min-height:36px;padding:4px 6px;font-size:13px;display:grid}.step input{width:18px;height:18px;margin:0}.step.cur{outline:2px solid var(--accent)}.step.off{color:var(--muted);background:0 0}.step .st{background:var(--line);border-radius:50%;width:8px;height:8px}.step.done .st{background:var(--ok)}.step.doing .st{background:#e0b252}.step.skipped .st{background:var(--muted)}.step-more{grid-column:1/-1;margin-top:4px}@media (orientation:landscape){body.mode-learn .panel{width:340px}}.legend{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.legend .st{border-radius:50%;width:8px;height:8px;margin-left:6px;display:inline-block}.legend .st.doing{background:#e0b252}.legend .st.done{background:var(--ok)}.legend .st.skipped{background:var(--muted)}.supplies{flex-wrap:wrap;gap:4px;display:flex}.chip.sup{min-height:32px;padding:2px 10px;font-size:13px}.chip.sup.on{border-color:var(--ok);background:#2f4a3c}#prep-env.ok{color:var(--ok)}#prep-env.bad{color:#e0b252}.mirror-img{transform:scaleX(-1)}body.mode-learn .qc-prompt{max-width:46%;font-size:15px;top:40px;left:25%}body.mode-learn .qc-count{right:50%}#prep-bare-thumb{max-height:110px}body:not(.dev) .dev-only{display:none!important}.look-desc{color:var(--text);min-height:1.4em;font-size:14px}.progress{flex-direction:column;gap:4px;display:flex}.progress .bar{background:#2c2430;border-radius:3px;height:6px;overflow:hidden}.progress .bar i{background:var(--ok);height:100%;transition:width .3s;display:block}.card-title{font-size:20px}.card-text{font-size:19px}.card-nav{justify-content:space-between;align-items:center;display:flex}.card-nav .arrow{min-height:40px;padding:6px 14px;font-size:14px}.big-actions{grid-template-columns:2fr 1fr;gap:8px;display:grid}.big-actions button{min-height:52px;font-size:16px}.steps-box summary{cursor:pointer;padding:6px 0}.steps-box{flex-direction:column;gap:6px;display:flex}.sup-row{grid-template-columns:3em 1fr;align-items:start;gap:6px;margin-bottom:4px;display:grid}.sup-h{color:var(--muted);padding-top:8px;font-size:12px}.sticky-cta{background:var(--panel);z-index:2;padding:8px 0 12px;position:sticky;bottom:-12px}.sticky-cta button{flex:1;min-height:52px;font-size:16px}body:not(.public) .public-only{display:none!important}.note{color:var(--muted);background:#2c2430;border-radius:10px;padding:8px 10px;font-size:13px;line-height:1.45}.note.wx{color:#ffe0a0;background:#4a3a14}.version{opacity:.7;font-size:11px}@media (orientation:portrait){body.mode-learn .layout{gap:8px;padding:8px}body.mode-learn .stage{flex:none;height:56dvh}body.mode-learn .panel{flex:1;min-height:0;overflow-y:auto}body.mode-learn .qc-prompt{font-size:13px;top:34px}}
