@font-face{font-family:Pixelify;src:url('/assets/fonts/pixelify-bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:VT;src:url('/assets/fonts/vt323.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{color-scheme:dark;--night:#091d27;--paper:#fff9e3;--muted:#b0c2c0;--gold:#ffc55c;--green:#188342;--display:Pixelify,monospace;--body:VT,monospace}
*{box-sizing:border-box}html{min-width:280px;scroll-behavior:smooth}body{margin:0;min-height:100svh;display:flex;flex-direction:column;background:#091d27;color:var(--paper);font-family:var(--body);font-size:21px;line-height:1.25;isolation:isolate}button,input,select{font:inherit}button,select{cursor:pointer}button,a,input,select{-webkit-tap-highlight-color:transparent}button{color:inherit}a{color:inherit;text-decoration:none}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #ffd879;outline-offset:5px}button:disabled{cursor:not-allowed;filter:saturate(.3);opacity:.58}button[hidden],[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:0;left:20px;transform:translateY(-150%);z-index:100;padding:12px 20px;background:var(--paper);color:var(--night)}.skip-link:focus{transform:translateY(12px)}
.night-scene{position:fixed;inset:0;z-index:-3;background:#0b2639 url('./assets/moonlight-backdrop-v1.png') center bottom/cover no-repeat;pointer-events:none}.night-scene::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#04131b30,transparent 24%,transparent 84%,#03121be6)}.lantern-light{position:fixed;width:220px;height:300px;z-index:-2;pointer-events:none;background:radial-gradient(ellipse,#ffb53224,transparent 65%);animation:lantern-breath 7s ease-in-out infinite alternate}.lantern-light--left{left:-20px;top:20%}.lantern-light--right{right:0;bottom:10%;animation-delay:-3s}
.site-header{flex-shrink:0;border-bottom:5px solid #27170f;box-shadow:0 3px #9c623934,0 8px 24px #0004;background:linear-gradient(#081a23e8,#081a23f5);position:relative;z-index:3}.site-header::after{content:"";position:absolute;height:4px;bottom:-3px;left:0;right:0;background:repeating-linear-gradient(90deg,#613b21 0 33px,#482d1d 33px 68px,#805332 68px 72px);opacity:.8}.header-inner{width:min(1120px,calc(100% - 64px));min-height:77px;margin:auto;display:flex;align-items:center;gap:42px}.brand{display:flex;align-items:center;gap:11px;white-space:nowrap;direction:ltr}.brand img{width:53px;height:58px;object-fit:contain;image-rendering:pixelated}.brand>span{font-family:var(--display);font-size:31px;color:#ffb44c;text-shadow:2px 3px #30160f}.brand b{color:var(--paper);font:inherit}.main-nav{display:flex;align-items:center;gap:31px;margin-inline-start:auto}.main-nav a,.nav-link{background:none;border:0;padding:8px 0;font-size:21px;position:relative}.main-nav a:hover,.nav-link:hover{color:var(--gold)}.main-nav a::after,.nav-link::after{content:"";position:absolute;inset-inline:0;bottom:0;height:2px;background:var(--gold);transform:scaleX(0);transition:transform .18s}.main-nav a:hover::after,.nav-link:hover::after{transform:scaleX(1)}.language-picker{display:flex;align-items:center;position:relative;gap:7px;padding-inline-start:27px;border-inline-start:1px solid #ffffff20;max-width:175px}.language-picker select{background:transparent;color:var(--paper);border:none;padding:8px 22px 8px 4px;appearance:none;max-width:123px;min-width:64px}.language-picker option{background:#102735;color:#fff9e3}.language-picker svg{width:22px;height:22px}.select-chevron{position:absolute;right:0;pointer-events:none;font:22px sans-serif}
.workbench{width:min(1080px,calc(100% - 100px));position:relative;margin:auto;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:start;gap:clamp(52px,6.5vw,100px);padding:54px 0 124px;isolation:isolate}.wood-frame{background:#683c24 url('/assets/site/wood-grain.svg') center/260px;border:3px solid #21170e;box-shadow:inset 0 3px #af7850,inset 3px 0 #915e3e,inset -4px -4px #392315,0 0 0 2px #845331,5px 7px 0 #0006;position:relative}.control-frame{padding:9px}.control-inner{background:linear-gradient(140deg,#0b202b,#081721);border:2px solid #422b1c;box-shadow:inset 0 0 0 2px #102b35;padding:29px 30px 31px}.control-inner h1{font-family:var(--display);font-weight:700;font-size:clamp(30px,3.1vw,45px);line-height:1.11;letter-spacing:-.6px;margin:0 0 24px;text-wrap:balance;text-shadow:2px 3px #0005}.control-inner h1 em{font-style:normal;color:var(--gold)}.field-label{display:block;margin-bottom:8px;font-size:22px}.url-field{display:flex;align-items:center;gap:10px;background:#203740;border:2px solid #809a9a;border-radius:3px;box-shadow:inset 0 3px #05131b70;padding:0 12px;min-width:0}.url-field:focus-within{border-color:var(--gold);box-shadow:0 0 0 2px #ffc55c30}.url-field svg{color:#9db5b6;width:23px}.url-field input{min-width:0;width:100%;height:45px;background:none;border:0;color:#f0f6ef;font-size:22px;outline:none!important;letter-spacing:.1px}.url-field:has(input[aria-invalid=true]){border-color:#ff937e}.url-field input::placeholder{color:#a4b8b9}.input-error{color:#ffad99;margin:8px 0 0;font-size:19px}.pixel-button{min-height:54px;border:2px solid #1b1d12;border-radius:3px;display:flex;align-items:center;justify-content:center;gap:12px;font-family:var(--display);font-weight:700;font-size:25px;position:relative;transition:filter .15s,translate .15s;box-shadow:inset 0 3px #ffffff38,inset 0 -4px #0003,3px 4px 0 #0007}.pixel-button:not(:disabled):hover{filter:brightness(1.12);translate:0 -1px}.pixel-button:not(:disabled):active{translate:0 2px;box-shadow:inset 0 2px #fff2,inset 0 -2px #0003,1px 1px 0 #0007}.generate-button{background:linear-gradient(#ffca55,#f4a42a);color:#261e13;width:100%;margin-top:18px;border-color:#a56321;box-shadow:inset 0 3px #ffe88a,inset 0 -4px #c47421,3px 4px #02090d}.magic-icon{width:23px;height:23px;fill:currentColor;stroke:none}.button-arrow{font-family:monospace;font-size:29px}.control-divider{height:2px;background:#263f49;box-shadow:0 1px #0005;margin:23px 0 19px}fieldset{padding:0;margin:0;border:0;min-width:0}legend{padding:0;margin-bottom:9px;font-size:22px}.style-options{display:flex;gap:12px}.style-swatch{width:56px;height:56px;border:2px solid #edead9;border-radius:5px;position:relative;padding:0;box-shadow:inset -3px -3px #0006,2px 3px #0008;transition:translate .16s}.style-swatch:hover{translate:0 -2px}.style-swatch--forest{background:linear-gradient(135deg,#17472e,#063d25)}.style-swatch--ink{background:linear-gradient(90deg,#fff9e3 47%,#0a141b 47%)}.style-swatch--midnight{background:linear-gradient(90deg,#fff9e3 47%,#18364e 47%)}.style-swatch--amber{background:linear-gradient(90deg,#fff9e3 47%,#694024 47%)}.style-swatch.is-selected{outline:2px solid #f5b744;outline-offset:2px;border-color:#fff9e3}.swatch-check{font:34px Arial,sans-serif;color:#fff9e3;text-shadow:1px 2px #09222f;opacity:0}.style-swatch.is-selected .swatch-check{opacity:1}.export-settings{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-top:20px}.format-options{display:flex;gap:10px}.format-button{background:#101f2b;border:2px solid #4a6570;border-radius:4px;min-height:47px;min-width:92px;padding:9px 13px;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:inset 0 -3px #0003;font-size:22px}.format-button svg{width:20px;height:23px}.format-button.is-selected{background:#154d31;border-color:#36a452;box-shadow:inset 0 2px #52b56844,inset 0 -3px #082e2066}.size-field{display:flex;flex-direction:column;gap:9px;min-width:80px}.size-field>span{font-size:18px;color:#b2c5c2}.size-field select{border:2px solid #4a6570;border-radius:4px;background:#122735;padding:9px 5px;color:var(--paper);min-height:47px;font-size:20px;max-width:104px}.size-field:has(select:disabled){opacity:.4}
.preview-section{padding-top:24px;min-width:0}.hanging-board{padding:12px;border-width:4px}.hanging-board::before{content:"";position:absolute;left:-8px;right:-8px;top:-13px;height:17px;background:#6b4027 url('/assets/site/wood-grain.svg') center/240px;border:3px solid #271a11;box-shadow:inset 0 3px #b87c48,0 4px #271a11;z-index:2}.board-pin{position:absolute;top:-29px;width:15px;height:43px;background:linear-gradient(90deg,#251f18,#6b6050 35%,#342e25 60%);border:2px solid #161815;z-index:3;box-shadow:1px 2px #0007}.board-pin::after{content:"";position:absolute;width:7px;height:7px;background:#9d9380;border:2px solid #302c22;bottom:4px;left:2px}.board-pin--left{left:22px}.board-pin--right{right:22px}.qr-paper{background:#fff9e3;aspect-ratio:1;border:2px solid #c0aa75;position:relative;overflow:hidden;box-shadow:inset 0 0 18px #a6813520}.qr-paper img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.qr-paper.is-pending img{opacity:.65}.qr-paper.is-pending::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 4px #d69a48;pointer-events:none}.preview-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#264639;text-align:center;padding:28px;gap:12px}.preview-empty svg{width:66px;height:66px;stroke-width:2;stroke-linejoin:miter}.preview-empty strong{font-family:var(--display);font-size:25px}.preview-empty p{margin:0;font-size:20px;max-width:230px}.download-button{width:100%;background:linear-gradient(#287e43,#15552d);margin-top:17px;border-color:#18371c;min-height:58px;box-shadow:inset 0 3px #65b36266,inset 0 -4px #0d321c,3px 4px #0008}.download-button>svg{width:25px;height:25px;stroke-width:2.5}.format-badge{font-family:var(--body);font-weight:400;font-size:20px;border-inline-start:1px solid #80ac7866;margin-inline-start:auto;padding-inline:18px}.download-button>svg{margin-inline-start:auto}.preview-meta{display:flex;align-items:flex-start;justify-content:center;gap:8px;margin:13px 0 0;min-height:23px;padding-inline:2px;font-size:19px;text-align:center;text-shadow:1px 2px 2px #00101b}.preview-meta p{margin:0}.ready-dot{width:6px;height:6px;background:#a2cc75;box-shadow:0 0 7px #bada7544;flex-shrink:0;margin-top:7px}.preview-meta.is-pending .ready-dot{background:var(--gold)}.preview-meta.is-error .ready-dot{background:#ff9e85}.privacy-note{display:flex;justify-content:center;align-items:center;gap:7px;color:#c5d2ca;text-shadow:1px 2px 2px #00101b;font-size:17px;margin:6px 0 0;text-align:center}.privacy-note svg{width:13px;height:15px}
.mascot-stage{position:absolute;width:230px;height:240px;left:calc(50% - 140px);bottom:0;pointer-events:none;z-index:2;contain:layout style;isolation:isolate}.mascot-stage>*{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.site-footer{background:#071620ef;border-top:2px solid #294142;display:flex;align-items:center;justify-content:center;gap:17px;padding:16px 32px;font-size:18px;min-height:56px;z-index:3;color:#c1d0cc}.site-footer p{margin:0}.pixel-heart{color:#f88752;text-shadow:1px 2px #391b1a;margin-inline-start:5px}.footer-leaf{color:#8aba64}.footer-help{background:none;border:0;color:#dbe3d6;border-inline-start:1px solid #62777d;padding:0 0 0 18px;font-size:18px}.footer-help:hover{color:var(--gold)}
dialog{color:var(--paper);background:#122b33;border:3px solid #93603a;box-shadow:0 0 0 3px #1b1510,0 24px 100px #000a;width:min(470px,calc(100% - 32px));max-height:calc(100svh - 40px);padding:0;overflow:auto}dialog::backdrop{background:#020f19cc;backdrop-filter:blur(4px)}.help-inner{padding:34px}.help-eyebrow{font-family:var(--display);font-size:18px;letter-spacing:3px;color:var(--gold)}.help-inner h2{font:700 32px/1.2 var(--display);margin:12px 0 24px}.dialog-close{position:absolute;inset-inline-end:10px;top:7px;font:30px Arial,sans-serif;background:none;border:0;width:40px;height:40px}.help-steps{list-style:none;counter-reset:steps;padding:0;margin:0}.help-steps li{counter-increment:steps;padding-inline-start:47px;position:relative;margin:22px 0}.help-steps li::before{content:"0"counter(steps);position:absolute;inset-inline-start:0;top:0;color:var(--gold);font-family:var(--display);font-size:24px}.help-steps strong{font-family:var(--display);font-size:22px}.help-steps p{color:#c3d1cc;margin:5px 0;line-height:1.35}.help-note{font-size:18px;color:#b9c9c4;border-top:1px solid #385259;padding-top:14px;line-height:1.35}.help-note+.help-note{border:0;padding:0}.noscript-note{position:fixed;inset:auto 15px 15px;background:#fff9e3;color:#18332b;padding:20px;z-index:50}
html[dir=rtl] .header-inner,html[dir=rtl] .workbench{direction:ltr}html[dir=rtl] .control-inner,html[dir=rtl] .preview-section,html[dir=rtl] .help-inner{direction:rtl}html[dir=rtl] .select-chevron{right:0}html[dir=rtl] .language-picker{direction:ltr}html[dir=rtl] .footer-help{padding:0 18px 0 0}html[lang=ar],html[lang=zh-Hans]{--display:Arial,"PingFang SC","Microsoft YaHei",sans-serif;--body:Arial,"PingFang SC","Microsoft YaHei",sans-serif}html[lang=ar] body,html[lang=zh-Hans] body{font-size:16px}html[lang=ar] .control-inner h1,html[lang=zh-Hans] .control-inner h1{font-size:clamp(27px,2.8vw,38px);line-height:1.45}html[lang=ar] .pixel-button,html[lang=zh-Hans] .pixel-button{font-size:20px}html[lang=ar] .brand>span,html[lang=zh-Hans] .brand>span{font-family:Pixelify,monospace}html[lang=ar] .preview-meta,html[lang=zh-Hans] .preview-meta,html[lang=ar] .privacy-note,html[lang=zh-Hans] .privacy-note{font-size:14px;line-height:1.5}html[lang=ar] legend,html[lang=zh-Hans] legend,html[lang=ar] .field-label,html[lang=zh-Hans] .field-label{font-size:17px}
@keyframes lantern-breath{from{opacity:.48}to{opacity:.88}}
@media(min-width:1000px) and (max-height:850px){.header-inner{min-height:65px}.brand img{height:49px;width:45px}.workbench{width:min(960px,calc(100% - 100px));padding:35px 0 83px;gap:76px}.control-inner{padding:22px 25px 25px}.control-inner h1{font-size:35px;margin-bottom:19px}.control-divider{margin:20px 0 16px}.export-settings{margin-top:17px}.style-swatch{width:49px;height:49px}.site-footer{min-height:48px;padding-block:12px}.mascot-stage{height:200px;width:200px;left:calc(50% - 125px)}}
@media(max-width:1050px){.header-inner{width:calc(100% - 48px);gap:25px}.workbench{width:calc(100% - 80px);gap:45px}.control-inner{padding:25px 22px}.control-inner h1{font-size:35px}.export-settings{flex-wrap:wrap;gap:18px}.size-field{flex-direction:row;align-items:center;gap:12px}.size-field select{min-height:38px;padding:4px 5px}.style-options{gap:10px}.style-swatch{height:48px;width:48px}.preview-section{padding-top:24px}.format-badge{padding-inline:12px}.download-button{font-size:22px}.brand>span{font-size:28px}.mascot-stage{left:calc(50% - 110px)}}
@media(max-width:760px){.header-inner{width:calc(100% - 28px);min-height:65px;gap:14px}.brand{gap:7px}.brand img{width:39px;height:44px}.brand>span{font-size:25px}.main-nav{display:none}.language-picker{margin-inline-start:auto;border:none;padding:0;gap:4px}.language-picker svg{width:19px}.language-picker select{max-width:107px;font-size:19px}.workbench{width:min(520px,calc(100% - 44px));grid-template-columns:minmax(0,1fr);gap:38px;padding:32px 0 100px}.control-inner{padding:25px 26px 28px}.control-inner h1{font-size:37px;line-height:1.12;margin-bottom:23px}.export-settings{flex-wrap:nowrap}.size-field{flex-direction:column;gap:9px;align-items:flex-start}.size-field select{height:46px;font-size:19px}.style-swatch{width:51px;height:51px}.preview-section{padding:0}.hanging-board{max-width:450px;margin:auto;width:100%}.download-button{font-size:25px}.night-scene{background-position:55% bottom}.night-scene::after{background:linear-gradient(#061b2860,#081c2770 40%,#061b2820 85%,#03121b)}.mascot-stage{width:160px;height:160px;bottom:0;left:calc(50% - 80px)}.site-footer{flex-wrap:wrap;gap:9px;padding:14px;font-size:17px}.footer-help{font-size:17px}.lantern-light{width:150px}.preview-meta{font-size:19px;min-height:23px}.privacy-note{font-size:17px}}
@media(max-width:380px){.header-inner{gap:5px}.brand>span{font-size:22px}.brand img{width:34px;height:38px}.language-picker select{max-width:91px;font-size:17px}.language-picker svg{display:none}.workbench{width:calc(100% - 30px);padding-top:25px}.control-inner{padding:22px 17px}.control-inner h1{font-size:31px}.export-settings{flex-wrap:wrap}.size-field{flex-direction:row;align-items:center}.format-button{min-width:90px}.url-field{padding-inline:9px;gap:7px}.url-field input{font-size:20px}.download-button{font-size:22px}.help-inner{padding:30px 22px}.site-footer{font-size:16px}.footer-help{font-size:16px}}
@media(min-width:761px){.control-inner{padding:23px 26px 25px}.control-inner h1{font-size:clamp(31px,2.8vw,40px);line-height:1.08;margin-bottom:19px}.field-label,legend{font-size:21px}.generate-button{min-height:50px;margin-top:15px}.control-divider{margin:19px 0 16px}.style-swatch{width:49px;height:49px}.export-settings{margin-top:17px}.workbench{padding-top:40px;padding-bottom:90px}.url-field input{height:43px}.format-button{min-height:44px;padding-block:7px}.size-field select{min-height:44px}.preview-section{padding-top:24px}}
@media(min-width:1000px) and (max-height:850px){.workbench{padding-top:28px;padding-bottom:65px}.control-inner h1{font-size:34px}.control-inner{padding:22px 23px}.preview-section{padding-top:22px}}
@media(max-width:760px){.export-settings{display:flex;flex-wrap:wrap;row-gap:16px}.size-field{flex-direction:row;align-items:center;gap:12px}.size-field select{height:39px;min-height:39px}.control-inner h1{font-size:34px}.control-inner{padding:23px 23px}.style-swatch{height:47px;width:47px}.workbench{padding-bottom:70px}}
@media(max-width:380px){.control-inner{padding:22px 17px}.control-inner h1{font-size:30px}}
@media(min-width:1000px) and (min-height:851px){.workbench{width:min(1000px,calc(100% - 100px));gap:80px;padding-bottom:70px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Painted, alpha-transparent art layers; never flatten controls or the mascot into scenery. */
.scene-stage{position:relative;width:100%;min-height:100svh;display:flex;flex-direction:column;isolation:isolate}
.painted-art{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.painted-art img{position:absolute;max-width:none;object-fit:fill;image-rendering:pixelated}
.menu-art img{width:102.26921%;height:299.24528%;left:-1.3409%;top:-91.32075%}
.control-art img{width:111.78744%;height:111.11111%;left:-5.99034%;top:-5.47386%}
.qr-board-art img{width:113.58696%;height:107.82459%;left:-6.79348%;top:-3.52537%}
.site-header{isolation:isolate;background:none;border:0;box-shadow:none;padding:10px 0}
.site-header::after{display:none}
.header-inner{width:calc(100% - 80px)}
.wood-frame{isolation:isolate;background:none;border:0;box-shadow:none}
.control-frame{padding:0}
.control-inner{background:none;border:0;box-shadow:none;padding:10% 10% 9%}
.hanging-board{aspect-ratio:1104/1163;padding:0;margin:0}
.hanging-board::before,.board-pin{display:none}
.qr-paper{position:absolute;top:20%;left:13%;width:74%;height:auto;aspect-ratio:1;border:0;background:transparent;box-shadow:none}
.qr-paper img{height:100%;width:100%}
.download-button{margin-top:10px}
.workbench{padding-bottom:95px}

/* A single 1536×1024 coordinate space keeps every painted layer on the supplied picture. */
@media(min-width:1000px) and (min-height:650px){
  body{display:grid;place-items:center;background:#04141f}
  .night-scene{filter:blur(18px);opacity:.28}
  .night-scene::after{display:none}
  .scene-stage{width:min(100vw,150svh);height:min(66.6666667vw,100svh);min-height:0;aspect-ratio:3/2;container-type:inline-size;display:block;margin:auto;background:url('./assets/moonlight-backdrop-v1.png') center/100% 100% no-repeat}
  .site-header{position:absolute;left:12%;top:1.2%;width:59%;height:9%;padding:0;z-index:4}
  .header-inner{width:90%;min-height:0;height:100%;gap:1.25cqw}
  .brand{gap:.6cqw}.brand img{width:3.5cqw;height:3.9cqw}.brand>span{font-size:2.15cqw}
  .main-nav{gap:1.6cqw}.main-nav a,.nav-link{font-size:1.4cqw;padding:.5cqw 0;white-space:nowrap}
  .language-picker{padding-inline-start:1.2cqw;gap:.3cqw;max-width:11cqw}.language-picker svg{width:1.4cqw;height:1.4cqw}.language-picker select{font-size:1.35cqw;max-width:8.8cqw;min-width:0;padding:.5cqw 1.2cqw .5cqw .25cqw}.select-chevron{font-size:1.6cqw}
  .workbench{position:absolute;inset:0;width:100%;height:100%;display:block;margin:0;padding:0;isolation:auto}
  .control-frame{position:absolute;left:15%;top:13%;width:31%;height:58%;padding:0}
  .control-inner{position:absolute;inset:8% 9% 7.5%;padding:0}
  .control-inner h1{font-size:2.65cqw;line-height:1.1;letter-spacing:-.025cqw;margin:0 0 1.1cqw}
  html:is([lang=tr],[lang=es],[lang=pt-BR],[lang=fr]) .control-inner h1{font-size:2.1cqw}
  .field-label,legend{font-size:1.48cqw;line-height:1.25;margin-bottom:.42cqw}
  .url-field{border-width:1px;padding:0 .65cqw;gap:.6cqw}.url-field svg{width:1.5cqw;height:1.5cqw}.url-field input{height:3.15cqw;font-size:1.5cqw}
  .pixel-button{font-size:1.75cqw;gap:.75cqw;border-width:2px;min-height:3.55cqw}
  .generate-button{margin-top:.95cqw;min-height:3.55cqw}.magic-icon{width:1.5cqw;height:1.5cqw}.button-arrow{font-size:1.85cqw}
  .control-divider{margin:1.25cqw 0 1cqw;height:1px}
  .style-options{gap:.9cqw}.style-swatch{width:3.55cqw;height:3.55cqw;border-radius:3px}.swatch-check{font-size:2.3cqw}
  .export-settings{margin-top:1.12cqw;gap:1cqw;flex-wrap:nowrap}.format-options{gap:.6cqw}.format-button{min-width:5.4cqw;min-height:3.15cqw;font-size:1.45cqw;padding:.35cqw .6cqw;gap:.45cqw}.format-button svg{width:1.25cqw;height:1.55cqw}
  .size-field{display:flex;flex-direction:column;align-items:flex-start;gap:.42cqw;min-width:0}.size-field>span{font-size:1.15cqw;white-space:nowrap}.size-field select{min-height:3.15cqw;height:3.15cqw;padding:.3cqw;font-size:1.3cqw;max-width:7cqw}
  .input-error{font-size:1.22cqw;line-height:1.15;margin:.5cqw 0 0}
  /* Keep inline validation and controls inside the painted panel. */
  .control-inner:has(.input-error:not([hidden])) h1{margin-bottom:.55cqw}
  .control-inner:has(.input-error:not([hidden])) .generate-button{margin-top:.45cqw}
  .control-inner:has(.input-error:not([hidden])) .control-divider{margin:.55cqw 0 .4cqw}
  .control-inner:has(.input-error:not([hidden])) .export-settings{margin-top:.45cqw}
  .preview-section{position:absolute;left:55.5%;top:15%;width:34.5%;padding:0}
  .hanging-board{width:100%;max-width:none}
  .download-button{margin-top:.35cqw;min-height:3.6cqw;font-size:1.8cqw}.download-button>svg{width:1.75cqw;height:1.75cqw}.format-badge{font-size:1.3cqw;padding-inline:1.2cqw}
  .preview-meta{margin-top:.7cqw;min-height:1.4cqw;font-size:1.25cqw;gap:.5cqw;line-height:1.2}.ready-dot{width:.4cqw;height:.4cqw;margin-top:.4cqw}
  .privacy-note{font-size:1.05cqw;margin-top:.35cqw;gap:.4cqw}.privacy-note svg{width:1cqw;height:1cqw}
  .mascot-stage{left:36%;bottom:16.4%;width:24%;height:29%}
  .site-footer{position:absolute;bottom:0;left:0;width:100%;height:5.4%;min-height:0;padding:.7cqw 2cqw;font-size:1.2cqw;gap:1.1cqw;background:#061622de}.footer-help{font-size:1.2cqw;padding-inline-start:1.1cqw}
  html[lang=ar] .control-inner h1,html[lang=zh-Hans] .control-inner h1{font-size:2.25cqw;line-height:1.4}
  html[lang=ar] .pixel-button,html[lang=zh-Hans] .pixel-button{font-size:1.45cqw}
  html[lang=ar] legend,html[lang=zh-Hans] legend,html[lang=ar] .field-label,html[lang=zh-Hans] .field-label{font-size:1.18cqw}
  html[lang=ar] .preview-meta,html[lang=zh-Hans] .preview-meta,html[lang=ar] .privacy-note,html[lang=zh-Hans] .privacy-note{font-size:1.05cqw}
  html[lang=ar] .main-nav a,html[lang=ar] .nav-link,html[lang=zh-Hans] .main-nav a,html[lang=zh-Hans] .nav-link{font-size:1.15cqw}
}
@media(max-width:999px),(max-height:649px){
  .control-frame{padding:0}.control-inner{padding:68px 10%}
  .hanging-board{padding:0;max-width:none}
  .site-header{width:calc(100% - 24px);margin:12px auto 0;padding:10px 0}
  .header-inner{width:88%;min-height:58px;gap:12px}
  .main-nav{gap:18px}.main-nav a,.nav-link{font-size:19px}
  .workbench{padding-top:34px;padding-bottom:85px}
}
@media(max-width:760px){
  .site-header{width:calc(100% - 14px);margin-top:8px;padding:9px 0}
  .header-inner{width:88%;min-height:47px;gap:4px}.brand img{width:34px;height:40px}.brand>span{font-size:24px}.language-picker select{font-size:17px;max-width:93px}.language-picker svg{display:none}
  .control-inner{padding:68px 10%}.control-inner h1{font-size:31px}
  .workbench{width:min(500px,calc(100% - 32px));gap:24px;padding-top:24px}
  .mascot-stage{height:150px;width:150px;bottom:0;left:calc(50% - 75px)}
}
@media(max-width:380px){.brand>span{font-size:21px}.brand img{width:29px;height:34px}.language-picker select{font-size:16px;max-width:85px}.header-inner{width:86%}.control-inner h1{font-size:28px}}

/* Give the companion its own rug between the controls and preview on small screens. */
@media(max-width:999px),(max-height:649px){
  .night-scene{background-size:auto 165svh;background-position:center top}
  .mascot-stage{position:relative;grid-row:2;grid-column:1/-1;justify-self:center;left:auto;bottom:auto;width:min(100%,420px);height:auto;aspect-ratio:5/3;overflow:hidden}
  .mascot-stage::before{content:"";position:absolute;inset:0;background:url('./assets/moonlight-backdrop-v1.png') 45% 70%/245% auto no-repeat;image-rendering:pixelated;mask-image:linear-gradient(180deg,transparent 38%,#000 70%,#000 93%,transparent);z-index:-1}
  .mascot-stage>.mascot-canvas{position:relative}
}

/* Readable, crawlable guidance below the original scene, in the selected language. */
.qr-guide{width:min(1080px,calc(100% - 40px));margin:40px auto 64px;padding:32px clamp(20px,4vw,54px);background:#0a202bea;border:1px solid #8e72424d;box-shadow:0 12px 48px #0003;border-radius:8px;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;font-size:16px;line-height:1.7;overflow-wrap:anywhere}
.qr-guide-inner{max-width:900px;margin:auto}.qr-guide h2{font-family:var(--display),system-ui,sans-serif;font-size:clamp(25px,3vw,34px);line-height:1.35;margin:18px 0;color:var(--gold)}.qr-guide h3{font-size:20px;line-height:1.5;margin:30px 0 12px}.qr-guide h4{font-size:16px;line-height:1.5;margin:0 0 8px}.qr-guide p{margin:0 0 16px;color:#d3e0dc}.guide-intro{max-width:76ch}.guide-back{color:var(--gold);text-decoration:underline;text-underline-offset:4px;font-size:14px}.guide-features{padding-inline-start:24px}.guide-features li{padding-block:3px}.guide-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding-inline-start:24px}.guide-steps li::marker{color:var(--gold);font-weight:700}.guide-faqs details{border-block-end:1px solid #75918740;padding:14px 0}.guide-faqs summary{cursor:pointer;font-weight:600;color:#fff9e3}.guide-faqs p{margin:12px 0 0}.guide-languages ul{display:flex;flex-wrap:wrap;gap:9px 16px;list-style:none;padding:0;margin:0}.guide-languages a{display:inline-block;padding:4px 0;color:#d3e0dc;text-decoration:underline;text-underline-offset:4px}.guide-languages a[aria-current=page],.guide-languages a:hover{color:var(--gold)}
@media(min-width:1000px) and (min-height:650px){body{grid-template-columns:100%;align-content:start}.scene-stage{flex-shrink:0}.qr-guide{margin-top:36px}}
@media(max-width:640px){.qr-guide{width:calc(100% - 24px);margin-top:20px;padding:24px 20px;font-size:15px}.guide-steps{grid-template-columns:1fr;gap:6px}}
@media(max-width:760px){
 .language-picker select,.size-field select{min-height:44px;height:44px}
 .dialog-close{width:44px;height:44px}
 .footer-help{min-height:44px;padding-block:8px}
}
/* Scripts outside our pixel fonts need native glyphs and a little more leading. */
html:is([lang=hi],[lang=bn],[lang=ur],[lang=fa],[lang=ta],[lang=ja],[lang=ko]){--display:system-ui,sans-serif;--body:system-ui,sans-serif}
@media(min-width:1000px) and (min-height:650px){
 html:is([lang=hi],[lang=bn],[lang=ur],[lang=fa],[lang=ta],[lang=ja],[lang=ko]) .control-inner h1{font-size:2.05cqw;line-height:1.35}
 html:is([lang=hi],[lang=bn],[lang=ur],[lang=fa],[lang=ta],[lang=ja],[lang=ko]) .pixel-button{font-size:1.3cqw}
 html:is([lang=hi],[lang=bn],[lang=ur],[lang=fa],[lang=ta],[lang=ja],[lang=ko]) :is(.field-label,legend,.main-nav a,.nav-link){font-size:1.12cqw}
 html:is([lang=hi],[lang=bn],[lang=ur],[lang=fa],[lang=ta],[lang=ja],[lang=ko]) :is(.preview-meta,.privacy-note,.site-footer){font-size:1cqw;line-height:1.5}
}