/* Isolated V7 review surface. These rules never apply to the live V6 pages. */
@import url('./surfaces.css');
:root{color-scheme:light;--page:#f1f3f7;--paper:#fff;--ink:#172238;--muted:#68768a;--line:#e2e6ee;--soft:#f5f6fa;--accent:#6255dd;--accent-soft:#eeeafe;--teal:#117d72;--night:#0b1528;--radius:22px;font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--page);color:var(--ink);-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a{color:inherit;text-decoration:none}button{color:inherit}input,textarea,select{min-width:0}button,a,input,textarea,select{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #8b7ef2}p{line-height:1.8}h1,h2,h3,p{margin-top:0}h1,h2,h3{letter-spacing:-.025em}svg{display:block;flex-shrink:0}button svg,a svg{pointer-events:none}[hidden]{display:none!important}.icon{width:19px;height:19px;stroke:currentColor;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6}.boot-message{text-align:center;margin:15vh 20px;color:var(--muted)}.muted{color:var(--muted)}.small{font-size:12px}.row{display:flex;align-items:center;gap:10px}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.stack{display:grid;gap:15px}.wide{width:100%}.fineprint{font-size:12px;line-height:1.8;color:var(--muted)}.eyebrow{font-size:11px;font-weight:650;letter-spacing:.12em;color:var(--muted)}.dot{width:6px;height:6px;border-radius:50%;background:currentColor;display:inline-block}.divider{height:1px;background:var(--line);margin:23px 0}.section-label{display:block;font-size:12px;color:var(--muted);margin-bottom:12px}.tag{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:11px;padding:5px 9px;border-radius:6px;background:#f0f2f7;color:#65718a}.tag.green{background:#e7f6ef;color:#187c5d}.tag.purple{background:var(--accent-soft);color:var(--accent)}.tag.amber{background:#fff4e0;color:#9b691d}.tag.red{background:#fff0f0;color:#b24a51}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:45px;border-radius:12px;border:1px solid var(--line);padding:12px 19px;background:#fff;font-size:13px;font-weight:600;transition:background .2s,transform .2s,box-shadow .2s}.button:hover{background:#f6f5ff;transform:translateY(-1px)}.button.primary{background:var(--accent);border-color:var(--accent);color:white;box-shadow:0 8px 18px #6255dd24}.button.primary:hover{background:#5346c9;box-shadow:0 10px 25px #6255dd36}.button.dark{background:#172238;border-color:#172238;color:white}.button.light{background:#f6f3ff;border-color:#f6f3ff;color:#2c244a}.button.ghost{background:transparent;border-color:transparent;color:var(--muted)}.button.compact{min-height:36px;padding:8px 13px;font-size:12px}.text-button{background:none;border:0;color:var(--accent);font-size:12px;display:inline-flex;gap:7px;align-items:center;padding:5px 0}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:39px;height:39px;border:1px solid var(--line);border-radius:11px;background:var(--paper);flex-shrink:0}.icon-button:hover{background:var(--accent-soft)}.preview-bar{height:34px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;font-size:10px;background:#e9e6f4;color:#645b7b;letter-spacing:.015em}.preview-bar nav{display:flex;align-items:center;gap:4px;height:100%}.preview-bar a{padding:7px 12px;border-radius:6px}.preview-bar a.active{background:#fff9;color:#453a83;font-weight:650}.preview-bar .preview-copy{display:flex;align-items:center;gap:8px}.preview-bar b{font-weight:650}.header{height:84px;padding:0 40px;display:flex;align-items:center;justify-content:space-between;gap:22px;max-width:1600px;margin:auto}.brand{display:inline-flex;align-items:center;gap:11px;font-weight:750;font-size:22px;letter-spacing:-.06em;flex-shrink:0}.brand-mark{width:37px;height:37px;display:grid;place-items:center;border-radius:12px;background:#171f36;color:white;box-shadow:inset 0 0 0 1px #fff2}.brand-mark svg{width:24px;height:24px}.brand small{display:block;font-size:9px;color:var(--muted);letter-spacing:.15em;font-weight:500;margin-top:2px}.header-nav{display:flex;align-items:center;gap:25px;font-size:13px;color:#626e81}.header-nav>button:not(.button){border:0;background:none;color:inherit;padding:9px 0}.header-nav>button:hover{color:var(--accent)}.header-end{display:flex;align-items:center;gap:16px}.free-label{color:var(--teal);display:flex;align-items:center;gap:7px;font-size:12px}.avatar{width:33px;height:33px;border-radius:50%;background:#e9e2fb;color:#665394;display:grid;place-items:center;font-size:12px;font-weight:600}.avatar.blue{background:#e3effa;color:#416782}.avatar.peach{background:#f9eae2;color:#93664d}.avatar.green{background:#e4f1eb;color:#4e7e69}.account-button{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);padding:5px 12px 5px 6px;border-radius:30px;font-size:12px}.page-footer{display:flex;align-items:center;justify-content:space-between;max-width:1500px;padding:26px 40px;margin:auto;color:#8a93a3;font-size:11px;gap:18px}.page-footer button{background:none;border:0;color:inherit;font:inherit}.login-main{max-width:1500px;margin:auto;padding:14px 40px 0}.login-layout{display:grid;grid-template-columns:minmax(0,1fr) 346px;gap:22px}.login-hero{position:relative;isolation:isolate;min-height:604px;overflow:hidden;border-radius:28px;background:radial-gradient(ellipse at 69% 58%,#233451 0,#122039 42%,#0e172b 72%);color:white;box-shadow:0 16px 46px #13223b0e}.login-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 91% 0,#716ace23,transparent 55%);pointer-events:none;z-index:-1}.hero-copy{position:relative;z-index:2;padding:43px 0 0 42px;width:52%;pointer-events:none}.hero-copy .eyebrow{color:#b9bddb;font-size:11px;letter-spacing:.18em;display:flex;align-items:center;gap:8px}.hero-copy h1{font-size:clamp(39px,4.2vw,65px);font-weight:600;line-height:1.23;letter-spacing:-.055em;margin:27px 0 22px;white-space:nowrap}.hero-copy h1 em{font-style:normal;background:linear-gradient(110deg,#e5d8ff,#a4b9ff);background-clip:text;color:transparent}.hero-copy p{color:#aab7cb;font-size:13px;max-width:275px;line-height:1.9}.hero-actions{position:relative;z-index:2;display:grid;gap:13px;justify-items:start;margin:30px 0 0 42px;pointer-events:none}.hero-actions .button{pointer-events:auto;padding:14px 21px;min-height:49px}.hero-actions small{font-size:11px;color:#92a5bf;letter-spacing:.04em}.hero-scene{position:absolute;inset:108px -9% 48px 32%;z-index:1;mask-image:linear-gradient(to right,transparent,#000 14%);cursor:grab}.hero-scene canvas,.stage-canvas canvas{display:block;width:100%;height:100%;outline:none}.hero-caption{position:absolute;z-index:2;bottom:29px;left:42px;right:32px;border-top:1px solid #b4c8ea24;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px;color:#a6b5c9}.hero-caption b{color:#d8e5f3;font-weight:500}.hero-orbit-label{position:absolute;z-index:2;right:29px;top:31px;padding:8px 11px;background:#b9c4f00a;border:1px solid #b9c4f026;border-radius:30px;font-size:10px;color:#bbc7e0;display:flex;align-items:center;gap:7px}.auth-card{background:#fff;border:1px solid var(--line);border-radius:26px;padding:30px 28px;display:flex;flex-direction:column;justify-content:center;box-shadow:0 8px 28px #14284203}.auth-card .auth-glyph{color:var(--accent);display:grid;place-items:center;width:45px;height:45px;background:var(--accent-soft);border-radius:15px;margin-bottom:21px}.auth-card h2{font-size:25px;font-weight:600;margin:0 0 10px}.auth-card>p{font-size:12px;line-height:1.8;color:var(--muted);margin-bottom:16px}.segment{display:flex;background:#f3f4f8;padding:4px;border-radius:11px;margin:10px 0 22px;gap:3px}.segment button{flex:1;border:0;padding:9px 10px;border-radius:8px;background:transparent;font-size:12px;color:var(--muted)}.segment button.selected{background:#fff;color:var(--ink);box-shadow:0 2px 6px #16213b0b;font-weight:650}.field{display:grid;gap:8px;font-size:12px;color:#647087;margin:0 0 16px}.field input,.field textarea,.field select{width:100%;padding:12px 13px;min-height:44px;border-radius:10px;border:1px solid var(--line);background:#fcfcfe;color:var(--ink);outline-offset:1px}.field input::placeholder,.field textarea::placeholder{color:#a3abba}.field textarea{resize:vertical;line-height:1.9;min-height:130px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.check-label{display:flex;align-items:flex-start;gap:8px;font-size:11px;color:var(--muted);line-height:1.7;margin:0 0 19px}.check-label input{accent-color:var(--accent);margin:3px 0 0}.auth-card .fineprint{text-align:center;margin:14px 0 0;font-size:10px}.auth-tail{display:flex;align-items:center;gap:8px;justify-content:center;color:#8a95a6;font-size:10px;border-top:1px solid var(--line);margin-top:25px;padding-top:19px}.login-under{display:grid;grid-template-columns:1.3fr repeat(4,1fr);gap:16px;align-items:center;margin-top:23px;padding:22px 4px;border-bottom:1px solid var(--line)}.login-under>div h3{font-size:15px;margin:0 0 4px;font-weight:600}.login-under>div p{font-size:11px;color:var(--muted);margin:0}.scene-link{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px;border:1px solid transparent;background:transparent;border-radius:14px;text-align:left}.scene-link:hover{background:#fff;border-color:var(--line)}.scene-glyph{width:38px;height:38px;background:#e6e6f3;color:#716a9c;display:grid;place-items:center;border-radius:12px}.scene-link:nth-of-type(2) .scene-glyph{background:#e8ece2;color:#78876a}.scene-link:nth-of-type(3) .scene-glyph{background:#f2e7dd;color:#ad855d}.scene-link:nth-of-type(4) .scene-glyph{background:#e3eaf7;color:#7185b4}.scene-link b{display:block;font-size:13px;font-weight:600}.scene-link small{display:block;font-size:10px;color:var(--muted);margin-top:5px}
/* The workbench has one visual focus and uses drawers for secondary work. */
body[data-page=play]{background:#edf0f5}.play-header{height:75px}.play-header .brand small{display:none}.play-main{max-width:1600px;margin:auto;padding:6px 30px 22px}.play-topline{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:17px}.scene-tabs{display:flex;gap:5px;background:#e3e7ef;border:1px solid #dfe4ec;padding:4px;border-radius:14px}.scene-tabs button{display:flex;align-items:center;gap:9px;padding:11px 23px;font-size:13px;border:0;background:transparent;color:#6d788b;border-radius:10px;white-space:nowrap}.scene-tabs button.selected{background:#fff;color:#222c43;box-shadow:0 2px 6px #26334b0b}.scene-tabs button .icon{width:17px;height:17px}.play-quiet{font-size:11px;color:#79859b;display:flex;align-items:center;gap:7px}.play-stage{min-height:580px;height:calc(100dvh - 228px);max-height:900px;position:relative;isolation:isolate;overflow:hidden;border-radius:26px;border:1px solid #1d2f48;background:radial-gradient(ellipse at 50% 48%,#253d57 0,#162b42 34%,#101e33 64%,#0b1528 100%);color:#fff;box-shadow:0 18px 35px #1c2e4b16;transition:border-radius .3s}.play-stage.cosmic{background:radial-gradient(ellipse at 50% 44%,#292448 0,#18253e 35%,#101728 70%,#0b1323 100%)}.play-stage:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 0,#6b63b612,transparent 60%);pointer-events:none}.stage-canvas{position:absolute;inset:82px 3% 127px;cursor:grab;transition:inset .5s}.stage-canvas canvas{touch-action:pan-y}.stage-top{position:absolute;top:29px;left:31px;right:28px;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;z-index:2}.stage-top .eyebrow{color:#9bafc9;font-size:10px;margin-bottom:12px;display:flex;align-items:center;gap:7px}.stage-top h1{font-size:27px;font-weight:550;margin:0 0 9px;letter-spacing:-.03em}.stage-top p{font-size:11px;color:#96a7bf;margin:0}.stage-tools{display:flex;gap:7px}.stage-tools .icon-button{color:#b9c7dc;background:#ffffff08;border-color:#aec6ed24;width:35px;height:35px;border-radius:10px}.stage-tools .icon-button:hover{background:#ffffff18}.stage-tools .icon{width:17px;height:17px}.machine-rail{position:absolute;left:28px;top:165px;z-index:3;display:grid;gap:8px}.machine-rail button{border-radius:12px;display:flex;align-items:center;gap:10px;text-align:left;background:#142439a8;border:1px solid #a5bed519;padding:12px;color:#8e9fb6;font-size:11px;backdrop-filter:blur(10px);min-width:113px}.machine-rail button.active{background:#b9c4f01a;border-color:#ab9cf879;color:#e9e4ff}.machine-rail .icon{width:17px;height:17px}.machine-rail small{font-size:8px;color:#8397b3;display:block;margin-top:4px}.skin-chip{position:absolute;bottom:28px;left:30px;z-index:3;background:#8d89cf12;border:1px solid #c3b6ef30;color:#c8c9ea;border-radius:12px;padding:11px 14px;font-size:11px;display:flex;align-items:center;gap:10px}.skin-chip small{display:block;color:#8095b2;font-size:9px;margin-top:4px}.skin-chip .icon{color:#ae9bdc}.stage-bottom{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;z-index:4;width:320px}.draw-button{height:54px;width:237px;border:1px solid #9e94ee;background:linear-gradient(110deg,#e9e4ff,#c6d9f6);color:#29213f;border-radius:15px;font-size:15px;font-weight:650;box-shadow:0 9px 35px #8c7cff22;display:flex;align-items:center;justify-content:space-between;padding:0 20px;transition:transform .2s,box-shadow .2s}.draw-button:hover{transform:translateY(-2px);box-shadow:0 12px 35px #aaa4ff40}.draw-hint{font-size:10px;color:#93a5bc;display:flex;align-items:center;gap:7px}.draw-hint kbd{font:inherit;border:1px solid #b7c9e82b;border-radius:4px;padding:2px 6px;color:#c3cfe2;background:#a4b9e908}.candidate-chip{position:absolute;right:28px;bottom:28px;z-index:3;display:flex;align-items:center;gap:14px;padding:14px 17px;border:1px solid #b5c9e125;border-radius:13px;background:#bed2f608;color:#cad6e8;font-size:12px}.candidate-chip small{display:block;color:#8295b0;font-size:10px;margin-top:5px}.play-bottomline{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:17px 4px 0;font-size:11px;color:#7b879a}.play-bottomline button{background:transparent;border:0;font:inherit;color:inherit;display:flex;align-items:center;gap:7px}.play-bottomline .icon{width:15px;height:15px}.stage-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:13px;color:#adc1d9;text-align:center;padding:30px}.stage-fallback .fallback-orb{position:absolute;width:195px;height:195px;border-radius:50%;border:1px solid #9bbbe442;background:radial-gradient(circle at 30% 24%,#b7ddff35,transparent 30%),linear-gradient(120deg,#a397ff1a,#32bfc612);box-shadow:inset -18px -12px 40px #050d2433,0 0 70px #829cd01a}.stage-fallback p{position:relative;top:135px;font-size:11px;max-width:280px}.play-stage.immersive{position:fixed;inset:0;max-height:none;width:100vw;height:100dvh;min-height:0;border:0;border-radius:0;z-index:100}.play-stage:fullscreen{width:100vw;height:100dvh;max-height:none;min-height:0;border-radius:0;border:0}.play-stage.immersive .stage-canvas{inset:3% 7% 4%}.play-stage.immersive .stage-ui{opacity:0;pointer-events:none}.stage-ui{transition:opacity .45s}.immersive-exit{position:absolute;right:24px;top:22px;z-index:7;color:#c5d1e8;border:1px solid #a1b4d32b;background:#18273dd9;border-radius:30px;padding:10px 15px;font-size:11px;display:none;align-items:center;gap:8px;opacity:0;transition:opacity .3s}.immersive .immersive-exit{display:flex;pointer-events:none}.immersive.controls-visible .immersive-exit,.immersive .immersive-exit:focus-visible{opacity:1;pointer-events:auto}.immersive-hint{display:none;position:absolute;bottom:26px;left:0;right:0;text-align:center;font-size:11px;color:#9eafc6;pointer-events:none}.immersive.controls-visible .immersive-hint{display:block}.result-overlay{position:absolute;inset:auto 0 35px;z-index:5;text-align:center}.result-overlay>span{display:block;font-size:11px;color:#a6b9d6;margin-bottom:8px}.result-overlay h2{font-size:31px;color:#eef4ff;font-weight:550;margin:0 0 18px}.result-overlay .row{justify-content:center}.result-overlay .button{min-height:40px;padding:10px 16px}.result-overlay .button.ghost{color:#bdc9df;background:#ffffff0a;border-color:#fff2}.play-stage.show-result .stage-canvas{inset:3% 8% 170px}.play-stage.busy:not(.immersive) .stage-top p{color:#d4c1ff}.play-stage.busy:not(.immersive) .machine-rail,.play-stage.busy:not(.immersive) .skin-chip,.play-stage.busy:not(.immersive) .candidate-chip{pointer-events:none;opacity:.35}.play-stage.busy:not(.immersive) .stage-bottom{opacity:0;pointer-events:none}
/* Dialogs provide secondary pages while keeping the three-route structure. */
dialog{border:1px solid var(--line);padding:0;border-radius:24px;color:var(--ink);background:#fff;box-shadow:0 35px 110px #07162c30;max-width:calc(100vw - 32px);width:760px;max-height:calc(100dvh - 50px)}dialog::backdrop{background:#0c192866;backdrop-filter:blur(5px)}.dialog-header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px 27px 17px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:3}.dialog-header h2{font-size:20px;font-weight:600;margin:0}.dialog-header .icon-button{border:0;background:#f2f4f8;width:32px;height:32px}.dialog-body{padding:24px 27px 29px}.dialog-body>p:first-child{font-size:13px;color:var(--muted)}dialog.drawer{width:438px;height:100dvh;max-height:100dvh;max-width:100vw;margin:0 0 0 auto;border-radius:22px 0 0 22px;border-right:0}.drawer .dialog-header{padding-top:28px}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.intro-card{padding:22px;border:1px solid var(--line);border-radius:17px;background:#fcfcfe}.intro-card .scene-glyph{margin-bottom:18px}.intro-card h3{font-size:16px;font-weight:600;margin:0 0 8px}.intro-card p{font-size:12px;color:var(--muted);margin:0 0 18px}.prices-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.price-card{border:1px solid var(--line);padding:21px 17px;border-radius:18px;background:#fafbfd;display:flex;flex-direction:column;align-items:flex-start}.price-card.featured{background:linear-gradient(145deg,#f1edff,#f6f7fc);border-color:#dcd3f4}.price-card h3{font-size:14px;margin:18px 0 12px}.price-card strong{font-size:31px;letter-spacing:-.06em;font-weight:600}.price-card strong small{font-size:12px;font-weight:400;letter-spacing:0;color:var(--muted)}.price-card p{font-size:11px;color:var(--muted);line-height:1.8;margin:17px 0 22px;flex:1}.price-card .button{width:100%;font-size:11px;padding:10px 6px;min-height:39px}.notice{padding:14px 16px;border:1px solid #dce2ef;background:#f3f6fc;border-radius:12px;font-size:12px;line-height:1.8;color:#697b96}.notice.purple{background:#f4f0ff;border-color:#e5dbfa;color:#78669e}.notice.amber{background:#fff9ec;border-color:#f0e3c6;color:#917548}.drawer .notice{font-size:11px}.drawer .segment{margin:12px 0 20px}.account-hero{display:flex;align-items:center;gap:13px;margin-bottom:23px}.account-hero .avatar{width:53px;height:53px;font-size:19px}.account-hero h3{font-size:19px;margin:0 0 4px}.account-hero p{font-size:11px;color:var(--muted);margin:0}.list-link{display:flex;align-items:center;gap:12px;padding:17px 0;border:0;border-bottom:1px solid var(--line);background:none;width:100%;text-align:left;font-size:13px}.list-link .icon:last-child{margin-left:auto;width:15px;height:15px;color:#8b96a8}.list-link small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.reward-hero{border-radius:19px;padding:26px 24px;background:radial-gradient(ellipse at 80% 10%,#514576,#20283f 80%);color:#fff;position:relative;overflow:hidden;margin-bottom:23px}.reward-hero h3{font-weight:500;font-size:27px;line-height:1.4;margin:11px 0 12px;max-width:280px}.reward-hero p{font-size:11px;color:#c0c7dc;max-width:260px;margin:0}.reward-hero .icon{position:absolute;right:20px;top:28px;width:65px;height:65px;color:#cbb5ff33;transform:rotate(-15deg)}.reward-hero .eyebrow{color:#b3a4d5}.reward-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.reward-pair>div{background:#f4f5fa;padding:16px;border-radius:14px;font-size:12px}.reward-pair strong{display:block;font-size:23px;margin:8px 0}.reward-pair small{color:var(--muted);font-size:10px}.copy-row{display:flex;gap:8px}.copy-row input{width:100%;min-width:0;border:1px solid var(--line);border-radius:10px;padding:12px;font-size:11px;background:#fafbfc;color:var(--muted)}.copy-row .button{flex-shrink:0}.simple-list{padding:0;list-style:none;font-size:12px;color:var(--muted);line-height:1.9}.simple-list li{margin:8px 0;padding-left:15px;position:relative}.simple-list li:before{content:"";width:4px;height:4px;border-radius:50%;background:#a6a0bb;position:absolute;left:1px;top:10px}.skin-preview{height:166px;background:radial-gradient(ellipse at center,#343552,#111c32);border-radius:16px;margin-bottom:17px;position:relative;display:grid;place-items:center;overflow:hidden}.skin-preview:before,.skin-preview:after{content:"";position:absolute;width:94px;height:94px;border-radius:50%;background:radial-gradient(circle at 27% 18%,#fff9,transparent 22%),linear-gradient(145deg,#8a77c9,#566fab 48%,#ddd9ff 49%,#91aaa6);box-shadow:inset -12px -8px 22px #11162f55,0 8px 30px #aca5ff33;transform:rotate(-24deg)}.skin-preview:after{width:55px;height:55px;left:20%;top:24px;opacity:.45;filter:blur(1px);transform:rotate(22deg)}.skin-preview span{position:absolute;bottom:12px;right:15px;font-size:10px;color:#bdc4df}.shop-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.shop-title h3{font-size:17px;margin:0}.shop-title strong{font-size:18px;color:var(--accent)}.shop-title strong small{font-size:11px;color:var(--muted);font-weight:400}.shop-card>p{font-size:12px;color:var(--muted);margin-top:13px}.shop-category{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:21px}.shop-category button{border:1px solid var(--line);border-radius:9px;background:#fff;padding:9px 14px;font-size:12px}.shop-category button.active{background:var(--accent-soft);border-color:#ddd5fa;color:var(--accent)}.mini-settings{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);gap:20px;font-size:12px}.mini-settings small{display:block;color:var(--muted);font-size:10px;margin-top:6px}.switch{width:36px;height:21px;position:relative;appearance:none;background:#c8cdd7;border-radius:20px;cursor:pointer;flex-shrink:0;transition:background .2s}.switch:after{content:"";position:absolute;left:3px;top:3px;width:15px;height:15px;border-radius:50%;background:white;transition:transform .2s}.switch:checked{background:var(--accent)}.switch:checked:after{transform:translateX(15px)}.mini-item{display:flex;align-items:center;justify-content:space-between;padding:15px;border:1px solid var(--line);border-radius:12px;font-size:12px;gap:15px}.mini-item small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:999;padding:13px 20px;background:#172338;color:#fff;border:1px solid #34435d;border-radius:13px;box-shadow:0 12px 40px #0b152530;max-width:min(90vw,560px);font-size:12px;text-align:center;line-height:1.7}.page-result-note{font-size:11px;line-height:1.8;color:var(--muted)}
/* Breakpoints are based on usable content width, not a fixed desktop canvas. */
@media(min-width:1550px){.login-hero{min-height:650px}.hero-copy{padding-top:59px}.hero-actions{margin-top:40px}.hero-scene{inset:95px -8% 51px 31%}}
@media(max-width:1190px){.header{padding:0 27px}.login-main{padding-left:27px;padding-right:27px}.login-layout{grid-template-columns:minmax(0,1fr) 318px;gap:18px}.auth-card{padding:26px 23px}.hero-copy{padding-left:31px}.hero-copy h1{font-size:45px}.hero-copy p{max-width:200px}.hero-actions{margin-left:31px}.hero-caption{left:31px}.hero-scene{inset:179px -14% 72px 22%}.login-under{grid-template-columns:1fr repeat(4,1fr);gap:4px}.scene-link{padding:8px;gap:7px}.scene-glyph{width:32px;height:32px}.scene-link small{font-size:9px}.header-nav{gap:18px}.machine-rail{top:155px}.machine-rail button{min-width:0;padding:10px}.machine-rail small{display:none}.candidate-chip{padding:11px}.stage-canvas{inset:96px 2% 135px}}
@media(max-width:900px){.login-layout{grid-template-columns:1fr}.login-hero{min-height:560px}.hero-copy h1{font-size:60px}.hero-copy{width:55%}.hero-copy p{max-width:280px}.hero-scene{inset:100px -7% 48px 35%}.auth-card{max-width:none;padding:30px;display:block}.auth-card .auth-glyph{display:none}.auth-card form{max-width:none}.auth-card .segment{max-width:300px}.auth-card .auth-inputs{display:grid;grid-template-columns:1fr 1fr;gap:14px}.auth-card .fineprint,.auth-tail{max-width:400px;margin-left:auto;margin-right:auto}.login-under{grid-template-columns:repeat(4,1fr)}.login-under>div:first-child{display:none}.play-topline{align-items:center}.scene-tabs button{padding:11px 14px}.play-topline .play-quiet{display:none}.play-header .header-nav{display:none}.stage-canvas{inset:100px 0 135px}.machine-rail{left:22px}.machine-rail button span{display:none}.skin-chip{left:22px;bottom:29px;padding:10px}.skin-chip>span{display:none}.candidate-chip{right:22px;bottom:28px;padding:13px}.candidate-chip>span{display:none}.stage-top{left:24px}.stage-top h1{font-size:25px}.play-main{padding:4px 22px 20px}.play-stage{height:calc(100dvh - 220px);min-height:570px}.header-end .free-label{display:none}.page-footer{padding:25px 28px}}
@media(max-width:600px){.preview-bar{padding:0 12px;height:33px}.preview-copy>span{display:none}.preview-bar a{padding:6px 8px;font-size:10px}.header{height:71px;padding:0 16px}.brand{font-size:20px;gap:8px}.brand-mark{width:33px;height:33px;border-radius:10px}.brand small{font-size:8px}.header-nav{gap:12px;font-size:11px}.header-nav .nav-how{display:none}.header-nav .button{padding:9px 12px;font-size:11px;min-height:38px}.login-main{padding:4px 14px 0}.login-hero{min-height:568px;border-radius:21px}.hero-copy{padding:28px 23px 0;width:100%}.hero-copy h1{font-size:42px;margin:23px 0 14px}.hero-copy p{font-size:11px;max-width:190px}.hero-copy .eyebrow{font-size:9px}.hero-orbit-label{top:24px;right:21px;font-size:8px;padding:6px 8px}.hero-scene{inset:175px -15% 95px 7%;mask-image:none}.hero-actions{position:absolute;bottom:81px;left:23px;margin:0}.hero-actions .button{min-height:42px;padding:11px 16px;font-size:11px}.hero-actions small{display:none}.hero-caption{bottom:24px;left:23px;right:23px;font-size:9px;padding-top:15px}.auth-card{border-radius:21px;padding:27px 24px}.auth-card .auth-inputs{display:block}.auth-card .segment{max-width:none}.login-under{grid-template-columns:1fr 1fr;gap:8px;margin-top:15px;padding-top:8px}.scene-link{gap:10px;padding:10px}.scene-link b{font-size:12px}.scene-link small{font-size:9px}.page-footer{padding:23px 20px;font-size:9px;flex-wrap:wrap}.play-main{padding:0 10px 13px}.play-header{height:65px}.play-header .brand small{display:none}.play-header .header-end{gap:8px}.account-button{padding:4px 8px 4px 4px;font-size:10px;gap:5px}.account-button .avatar{width:27px;height:27px;font-size:10px}.play-topline{margin-bottom:11px;gap:8px}.scene-tabs{gap:0;padding:3px;width:100%;border-radius:11px}.scene-tabs button{flex:1;padding:10px 3px;font-size:11px;justify-content:center;gap:5px;border-radius:8px}.scene-tabs button .icon{width:14px;height:14px}.play-topline>.button{display:none}.play-stage{height:calc(100dvh - 216px);min-height:510px;border-radius:20px}.stage-top{top:23px;left:21px;right:18px}.stage-top h1{font-size:22px;margin-bottom:7px}.stage-top p{font-size:9px;max-width:195px}.stage-top .eyebrow{font-size:8px;margin-bottom:11px}.stage-tools{gap:5px}.stage-tools .icon-button{width:30px;height:30px}.stage-tools .icon-button:first-child{display:none}.stage-canvas{inset:120px -2% 144px}.machine-rail{left:50%;transform:translateX(-50%);top:auto;bottom:109px;display:flex;gap:7px}.machine-rail button{padding:8px 11px;border-radius:9px;min-width:0}.machine-rail .icon{width:15px;height:15px}.machine-rail button span{display:block;font-size:9px}.machine-rail small{display:none}.stage-bottom{bottom:26px;width:218px;gap:10px}.draw-button{width:192px;height:46px;padding:0 15px;border-radius:12px;font-size:13px}.draw-hint{font-size:8px}.draw-hint .desktop-key{display:none}.candidate-chip{right:14px;bottom:47px;padding:9px;border-radius:10px}.candidate-chip .icon{width:17px;height:17px}.skin-chip{left:14px;bottom:47px;padding:9px;border-radius:10px}.skin-chip .icon{width:17px;height:17px}.play-bottomline{font-size:9px;margin:12px 5px 0;gap:7px}.play-bottomline .hide-mobile{display:none}.play-bottomline button{font-size:9px}.play-stage.immersive .stage-canvas{inset:10% 0 12%}.play-stage.show-result .stage-canvas{inset:5% 0 175px}.result-overlay{bottom:42px}.result-overlay h2{font-size:26px}.immersive-exit{right:16px;top:17px}.dialog-header{padding:20px}.dialog-body{padding:20px}.dialog-header h2{font-size:18px}dialog{max-width:calc(100vw - 20px);border-radius:19px}.intro-grid{grid-template-columns:1fr}.intro-card{padding:18px}.intro-card .scene-glyph{float:left;margin:0 14px 0 0}.prices-grid{grid-template-columns:1fr}.price-card{padding:20px;display:grid;grid-template-columns:1fr auto;gap:4px 15px;align-items:center}.price-card h3{margin:13px 0 4px}.price-card>.tag{justify-self:start}.price-card>strong{grid-row:2;grid-column:2}.price-card>p{grid-column:1/-1;margin:12px 0}.price-card>.button{grid-column:1/-1}.field-row{gap:10px}dialog.drawer{width:100%;border-radius:0;max-width:100vw}.reward-hero h3{font-size:26px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
