/* Graphite night theme. Light-theme rules and product behavior are unchanged. */
:root[data-theme="dark"]{--paper:#242426;--white:#323235;--ink:#e8e4dd;--muted:#b9b3bc;--accent:#c49b9b;--cta:#875f68;--tint:#363036;--line:#454248;--deep:#d3a9ad;--error:#e4a0a0;background:#1c1c1e;color-scheme:dark}
:root[data-theme="dark"] .primary{color:#e8e4dd;box-shadow:0 7px 16px -10px #00000080,inset 0 1px 0 #00000029}
:root[data-theme="dark"] .button:after{background:radial-gradient(circle at 50% 50%,#3232353d 0,transparent 70%)}
:root[data-theme="dark"] .pack[aria-checked=true]{background:#323235;box-shadow:inset 0 0 0 1px var(--cta),0 7px 16px -14px #000000}
:root[data-theme="dark"] .pack-indicator{border:1px solid #454248}
:root[data-theme="dark"] .checkout input:focus{box-shadow:0 0 0 3px #00000020}
:root[data-theme="dark"] .checkout input::placeholder{color:#b9b3bc}
:root[data-theme="dark"] .status.error{background:#323235}
:root[data-theme="dark"] .status.ok{color:#b9b3bc;background:#323235}
:root[data-theme="dark"] .skeleton{background:linear-gradient(100deg,#323235 25%,#323235 45%,#323235 65%)}
:root[data-theme="dark"] .bottom-nav{border-top:1px solid #454248;background:#323235ed;box-shadow:0 -8px 26px -21px #00000055}
:root[data-theme="dark"] .bottom-nav:before{background:#323235d9}
:root[data-theme="dark"] .order-panel[data-state=paid]{background:#323235;border-color:#454248}
:root[data-theme="dark"] .order-panel[data-state=paid] .order-dot{background:#2c2c30;box-shadow:0 0 0 4px #000000}
:root[data-theme="dark"] .order-panel[data-state=error]{background:#323235;border-color:#454248}
@media(hover:hover) and (pointer:fine){:root[data-theme="dark"] .primary:hover{background:#4a363b;box-shadow:0 9px 21px -12px #00000077,inset 0 1px 0 #00000029}}
@media(min-width:521px){:root[data-theme="dark"] .app-shell{box-shadow:0 0 0 1px #000000,0 15px 60px #00000010}}
:root[data-theme="dark"] .live-dot{box-shadow:0 0 0 4px #0000001b}
:root[data-theme="dark"] .asya-home-card{border:1px solid #454248;background:linear-gradient(125deg,#323235 0%,#323235 55%,#323235 100%);box-shadow:0 9px 23px -23px #000000}
:root[data-theme="dark"] .asya-home-card:before{background:linear-gradient(90deg,#323235 5%,#323235e8 38%,#32323500 77%)}
:root[data-theme="dark"] .asya-home-card>img{filter:drop-shadow(0 8px 12px #c49b9b26)}
:root[data-theme="dark"] .shop-asya-link{border:1px solid #454248;background:linear-gradient(105deg,#323235,#323235)}
:root[data-theme="dark"] .shop-asya-link img{background:#323235}
:root[data-theme="dark"] .asya-tip img{background:#323235}
:root[data-theme="dark"] .asya-intro{background:radial-gradient(circle at 77% 42%,#323235 0%,#323235 54%,#323235 100%)}
:root[data-theme="dark"] .asya-portrait img{filter:drop-shadow(0 9px 13px #c49b9b1c)}
:root[data-theme="dark"] .asya-art-plan .asya-example{background:#323235}
:root[data-theme="dark"] .guide-asya{background:linear-gradient(120deg,#323235,#323235)!important}
@media(hover:hover) and (pointer:fine){:root[data-theme="dark"] .asya-home-card:hover{box-shadow:0 15px 27px -22px #000000}}
:root[data-theme="dark"] #view-home .hero-note{color:#b9b3bc}
:root[data-theme="dark"] .asya-home-card{background:#4a363b;box-shadow:inset 0 0 0 1px #000000,0 12px 28px -22px #000000}
:root[data-theme="dark"] .asya-home-card:before{background:linear-gradient(90deg,#4a363b 0%,#4a363b 39%,#4a363b00 78%)}
:root[data-theme="dark"] .asya-home-card:after{color:#c49b9b}
:root[data-theme="dark"] .asya-home-card>img{filter:drop-shadow(0 10px 17px #c49b9b2e)}
:root[data-theme="dark"] .asya-home-copy em{color:#c49b9b}
:root[data-theme="dark"] .asya-home-link{border-bottom:1px solid #4a363b}
:root[data-theme="dark"] .home-prompt{background:#2c2c30;color:#e8e4dd;box-shadow:0 12px 23px -20px #000000}
:root[data-theme="dark"] .home-prompt:before{color:#e8e4dd12}
:root[data-theme="dark"] .prompt-mark{color:#c49b9b}
:root[data-theme="dark"] .prompt-caption{color:#e8e4dd}
:root[data-theme="dark"] .prompt-caption span{color:#c49b9b}
:root[data-theme="dark"] .asya-intro{background:#323235}
:root[data-theme="dark"] .asya-intro:after{color:#c49b9b}
:root[data-theme="dark"] .asya-portrait img{filter:drop-shadow(0 10px 15px #c49b9b24)}
:root[data-theme="dark"] .asya-example-flow{background:#2c2c30;color:#e8e4dd}
:root[data-theme="dark"] .flow-heading{color:#c49b9b}
:root[data-theme="dark"] .flow-heading span:last-child{color:#b9b3bc}
:root[data-theme="dark"] .flow-bridge{color:#e8e4dd}
:root[data-theme="dark"] .flow-bridge>span{color:#c49b9b}
:root[data-theme="dark"] .flow-end{background:#323235}
:root[data-theme="dark"] .flow-end .live-dot{box-shadow:0 0 0 3px #0000001b}
:root[data-theme="dark"] .flow-end small{color:#b9b3bc}
:root[data-theme="dark"] .asya-possibilities p:not(.eyebrow){color:#b9b3bc}
:root[data-theme="dark"] .guide-asya{background:#323235!important;border-color:#4a363b!important}
:root[data-theme="dark"] .home-comics{border:1px solid #454248;background:#323235}
:root[data-theme="dark"] .home-comics>p{color:#b9b3bc}
:root[data-theme="dark"] .home-comics-footer{border-top:1px solid #454248;color:#c49b9b}
:root[data-theme="dark"] .asya-manual-avatar{background:#4a363b;border:1px solid #4a363b}
:root[data-theme="dark"] .asya-manual-intro{color:#b9b3bc}
:root[data-theme="dark"] .drawing-steps li>div>p{color:#b9b3bc}
:root[data-theme="dark"] .drawing-request{background:#323235;border:1px solid #454248}
:root[data-theme="dark"] .drawing-cost{background:#323235}
:root[data-theme="dark"] .drawing-cost span{color:#b9b3bc}
:root[data-theme="dark"] .drawing-photo-guide{background:#2c2c30;color:#e8e4dd}
:root[data-theme="dark"] .drawing-photo-guide .eyebrow{color:#c49b9b}
:root[data-theme="dark"] .drawing-photo-guide>p:not(.eyebrow){color:#e8e4dd}
:root[data-theme="dark"] .photo-instruction{border-top:1px solid #45424826}
:root[data-theme="dark"] .photo-instruction-label{color:#b9b3bc}
:root[data-theme="dark"] .photo-instruction-next{color:#c49b9b}
:root[data-theme="dark"] .sticker-guide>p:not(.eyebrow){color:#b9b3bc}
:root[data-theme="dark"] .sticker-flow span{color:#b9b3bc}
:root[data-theme="dark"] .starter-panel{background:#323235;border:1px solid #454248}
:root[data-theme="dark"] .starter-panel-number{color:#b9b3bc}
:root[data-theme="dark"] .starter-panel p{color:#b9b3bc}
:root[data-theme="dark"] .paint-scene{background:#323235;border:1px solid #454248}
:root[data-theme="dark"] .paint-scene:before{background:#4a363b}
:root[data-theme="dark"] .paint-stock{border-top:1px solid #454248}
:root[data-theme="dark"] .paint-stock>span{color:#b9b3bc}
:root[data-theme="dark"] .paint-stock>p{color:#b9b3bc}
:root[data-theme="dark"] .paint-empty-copy{border-top:1px solid #454248}
:root[data-theme="dark"] .paint-empty-copy p{color:#b9b3bc}
:root[data-theme="dark"] .paint-scene[data-empty=true]{background:#323235;border-color:#454248}
:root[data-theme="dark"] .paint-scene[data-empty=true]:before{background:#323235}
:root[data-theme="dark"] .asya-home-card[data-empty=true]{background:#323235;box-shadow:inset 0 0 0 1px #000000}
:root[data-theme="dark"] .asya-home-card[data-empty=true]:before{background:linear-gradient(90deg,#323235 0%,#323235 32%,#32323500 75%)}
:root[data-theme="dark"] .asya-home-card[data-empty=true]:after{color:#c49b9b}
:root[data-theme="dark"] .button:after{background:radial-gradient(circle at var(--touch-x,50%) var(--touch-y,50%),#32323546 0,transparent 72%)}
:root[data-theme="dark"] .primary{background:linear-gradient(110deg,#4a363b,#4a363b);box-shadow:0 7px 17px -10px #00000080,inset 0 1px 0 #00000035}
:root[data-theme="dark"] .pack[aria-checked=true],:root[data-theme="dark"] .web-pack[aria-pressed=true]{box-shadow:0 5px 15px -9px #0000004d,inset 0 0 0 1px #00000033}
:root[data-theme="dark"] .soft-ui-setting{border-bottom:1px solid var(--line,#454248);color:var(--ink,#b9b3bc)}
:root[data-theme="dark"] .soft-ui-setting small{color:var(--muted,#b9b3bc)}
:root[data-theme="dark"] .soft-ui-switch{background:#323235}
:root[data-theme="dark"] .soft-ui-switch:after{box-shadow:0 1px 3px #00000022}
:root[data-theme="dark"] [aria-pressed=true]>.soft-ui-switch{background:var(--accent,#4a363b)}
@media(hover:hover) and (pointer:fine){:root[data-theme="dark"] .home-help-link:hover,:root[data-theme="dark"] .home-comics:hover,:root[data-theme="dark"] .asya-home-card:hover{box-shadow:0 10px 24px -15px #00000044}}
:root[data-theme="dark"] #onboarding{background:#323235}
:root[data-theme="dark"] .onboard-portrait:before,:root[data-theme="dark"] .onboard-profile:before{background:linear-gradient(145deg,#323235,#4a363b)}
:root[data-theme="dark"] .onboard-doodle{color:#c49b9b}
:root[data-theme="dark"] .onboard-group{box-shadow:0 7px 16px -12px #00000044}
:root[data-theme="dark"] .telegram-dot{background:linear-gradient(150deg,#323235,#323235)}
:root[data-theme="dark"] .onboard-profile-card{border:1px solid #454248;background:#323235;box-shadow:0 9px 19px -15px #00000088}
:root[data-theme="dark"] .friend-avatar{background-color:#323235}
:root[data-theme="dark"] .onboard-profile-card strong{background:#323235}
:root[data-theme="dark"] .onboard-profile-card .profile-photo-slot{border:1px dashed #454248;color:#c49b9b}
:root[data-theme="dark"] .profile-pencil{color:#c49b9b;text-shadow:1px 1px #000000}
:root[data-theme="dark"] .onboard-example-label{color:#b9b3bc}
:root[data-theme="dark"] .onboard-names{background:radial-gradient(circle at 12px 14px,#3232354d 2px,transparent 3px),linear-gradient(135deg,#323235,#323235)}
:root[data-theme="dark"] .onboard-message{background:#323235;box-shadow:0 4px 12px -10px #00000044}
:root[data-theme="dark"] .onboard-message small{color:#b9b3bc}
:root[data-theme="dark"] .onboard-message small b{color:#b9b3bc}
:root[data-theme="dark"] .names-card{box-shadow:0 5px 13px -10px #00000044}
:root[data-theme="dark"] .onboard-scene-chat{background:linear-gradient(135deg,#323235,#323235)}
:root[data-theme="dark"] .onboard-answer>img{background:#323235}
:root[data-theme="dark"] .onboard-answer>div{background:#323235;box-shadow:0 7px 17px -12px #00000044}
:root[data-theme="dark"] .onboard-answer strong{background:#323235}
:root[data-theme="dark"] .onboard-modes span{background:#323235;border:1px solid #454248;color:#c49b9b}
:root[data-theme="dark"] .onboard-shell footer .button{box-shadow:0 7px 14px -8px #00000059}
:root[data-theme="dark"] .onboard-shell footer nav button:before{border:1px solid #454248}
@media(min-width:600px){:root[data-theme="dark"] .onboard-shell{box-shadow:0 8px 24px #00000012}}


/* Natural light is localized to the illustration, never to the page text. */
.paint-artwork{position:relative;display:block;width:calc(100% + 36px);height:270px;margin:54px -18px 0;isolation:isolate}
.paint-artwork>#paint-portrait{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;transition:filter .45s ease}
.paint-artwork>.desk-lamp{position:absolute;right:0;bottom:10px;width:26%;height:64%;object-fit:contain;opacity:0;pointer-events:none;transition:opacity .45s ease;z-index:2}
.paint-artwork:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 74% 79%,#ffcd8630 0%,#ffcb781a 25%,transparent 56%);mix-blend-mode:screen;transition:opacity .45s ease;z-index:1}
:root[data-theme="dark"] .paint-artwork>.desk-lamp,:root[data-theme="dark"] .paint-artwork:after{opacity:1}
:root[data-theme="dark"] .paint-artwork>#paint-portrait{filter:brightness(.82) saturate(.87)}
:root[data-theme="dark"] .paint-scene{background:#303034;border-color:#454248}
:root[data-theme="dark"] .paint-scene:before{background:#3a343a}
:root[data-theme="dark"] .primary{background:#875f68;color:#fff8f0;box-shadow:inset 0 1px 0 #ffffff12}
:root[data-theme="dark"] .bottom-nav{background:#29272bea;border-color:#454248;box-shadow:none}
:root[data-theme="dark"] .bottom-nav:before{background:#49383e}
:root[data-theme="dark"] .guide-asya{background:#363036!important;border-color:#55464d!important}
:root[data-theme="dark"] .asya-home-card{background:#363036;box-shadow:inset 0 0 0 1px #55464d}
:root[data-theme="dark"] .asya-home-card:before{background:linear-gradient(90deg,#363036 0%,#363036 39%,#36303600 78%)}
:root[data-theme="dark"] .asya-home-card>img,:root[data-theme="dark"] .asya-manual-avatar img{filter:brightness(.87) saturate(.85)}
:root[data-theme="dark"] .asya-home-copy em{color:#d3a9ad}
:root[data-theme="dark"] .soft-ui-switch{background:#575057}
:root[data-theme="dark"] .soft-ui-switch:after{background:#e8e4dd}
:root[data-theme="dark"] [aria-pressed=true]>.soft-ui-switch{background:#c49b9b}
:root[data-theme="dark"] .web-checkout input{background:var(--white);color:var(--ink)}
html.theme-changing,html.theme-changing *,html.theme-changing *:before,html.theme-changing *:after{transition:background-color .45s ease,color .45s ease,border-color .45s ease,box-shadow .45s ease,opacity .45s ease,filter .45s ease!important}
@media(max-width:359px){.paint-artwork{height:235px}}
@media(prefers-reduced-motion:reduce){html.theme-changing,html.theme-changing *,html.theme-changing *:before,html.theme-changing *:after,.paint-artwork>#paint-portrait,.paint-artwork>.desk-lamp,.paint-artwork:after{transition:none!important}}

/* The same sun/moon theme control on the home screen and in the cabinet. */
.theme-knob{position:relative;display:flex;align-items:center;justify-content:space-between;width:76px;height:42px;padding:0 10px;border:1px solid var(--line);border-radius:23px;background:var(--tint);color:var(--ink);font-size:21px;isolation:isolate;box-shadow:inset 0 1px 3px #0001;flex-shrink:0;cursor:pointer}.theme-thumb{position:absolute;left:4px;top:4px;width:32px;height:32px;background:var(--white);border-radius:50%;z-index:-1;box-shadow:0 2px 5px #0002;transition:transform .3s cubic-bezier(.2,.8,.2,1)}:root[data-theme=dark] .theme-thumb{transform:translateX(34px)}.theme-sun,.theme-moon{color:var(--ink);display:flex}.theme-knob svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.cabinet-controls{display:flex;flex-direction:column;align-items:flex-end;gap:10px}.cabinet-controls .theme-knob{margin:0}.cabinet-controls .cabinet-link{white-space:nowrap}@media(prefers-reduced-motion:reduce){.theme-thumb{transition:none}}