@font-face{font-family:Archivo Black;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/archivo-black-latin-400-normal-HW9MwEcM.woff)format("woff")}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--font-ui:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-brand:"Archivo Black", var(--font-ui);--bg:#f4f5f7;--panel:#fff;--control:#eef0f3;--button:#fff;--field:#fff;--text:#14161c;--muted:#565c68;--border:#d7dbe2;--border-strong:#868d9a;--border-hover:var(--border-strong);--teal:#0b6e68;--sun:#ffb703;--coral:#ef476f;--grape:#5b34e0;--accent:#0b6e68;--accent-hover:#085b56;--accent-key:#064b47;--accent-text:var(--accent);--on-accent:#fff;--link:var(--accent);--invite:#e6f3f2;--focus:#5b34e0;--slider:var(--accent);--danger:#b42318;--danger-text:#b42318;--on-danger:#fff;--danger-bg:#fdecea;--stage:#e7eaee;--format-edge:#b4bac4;--zoom-button:#ffffffeb;--scrollbar:#c9ced6;--tour-dim:#080a0e94;--tour-ring:var(--focus);--fig-photo:#dde1e7;--fig-hill:#a9b0bb;--fig-tile:#8fd3cc;--radius-sm:8px;--radius-control:12px;--radius-panel:16px;--radius-dialog:20px;--edge:0 2px 0 var(--border);--edge-accent:0 3px 0 var(--accent-key);--shadow-panel:0 1px 2px #1018280f;--shadow-pop:0 12px 32px #080a0e38;font-family:var(--font-ui);color:var(--text);background:var(--bg)}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0f1116;--panel:#181b22;--control:#21252e;--button:#21252e;--field:#13161c;--text:#eef0f4;--muted:#a4aab6;--border:#2e333d;--border-strong:#69707e;--teal:#3dd6c6;--sun:#ffc23d;--coral:#ff6f91;--grape:#9b82ff;--accent:#3dd6c6;--accent-hover:#66e3d6;--accent-key:#1c8f86;--accent-text:#3dd6c6;--on-accent:#0f1116;--link:#66e3d6;--invite:#12302e;--focus:#ffb703;--slider:#3dd6c6;--danger:#ff8a7a;--danger-text:#ff8a7a;--on-danger:#0f1116;--danger-bg:#3a1d1b;--stage:#090a0e;--format-edge:#ffffff24;--zoom-button:#21252eeb;--scrollbar:#3a404b;--tour-dim:#000000ad;--fig-photo:#2a2f39;--fig-hill:#4a515e;--fig-tile:#1c8f86;--edge:0 2px 0 #00000073;--shadow-panel:none;--shadow-pop:0 12px 32px #00000073}.collage-svg{--grout:#fff}*{box-sizing:border-box}body{background:var(--bg);margin:0}body.no-scroll{overflow:hidden}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.app{flex-direction:column;min-height:100vh;display:flex}.app-header{border-bottom:1px solid var(--border);background:var(--panel);justify-content:space-between;align-items:center;gap:12px;padding:16px 24px;display:flex}@media (width<=800px){.app-header{padding:12px 16px}}.app-title{color:var(--text);white-space:nowrap;flex:none;align-items:center;margin:0;font-size:20px;font-weight:700;line-height:0;text-decoration:none;display:flex}.brand-logo{display:block}.brand-cut{width:auto;height:30px;display:none}:root:not([data-theme=dark]) .brand-full.brand-light,:root[data-theme=dark] .brand-full.brand-dark{display:block}@media (width<=480px){.brand-cut{height:22px}:root:not([data-theme=dark]) .brand-full.brand-light,:root[data-theme=dark] .brand-full.brand-dark{display:none}:root:not([data-theme=dark]) .brand-compact.brand-light,:root[data-theme=dark] .brand-compact.brand-dark{display:block}}a.app-title{border-radius:var(--radius-sm)}.header-actions{align-items:center;gap:8px;min-width:0;display:flex}.help-menu{position:relative}.help-menu-button{min-height:40px;font:inherit;border:1px solid var(--border);border-radius:var(--radius-control);background:var(--button);color:var(--text);box-shadow:var(--edge);cursor:pointer;white-space:nowrap;align-items:center;gap:6px;padding:0 12px;font-size:14px;display:inline-flex}.help-menu-button:hover{border-color:var(--border-hover)}.help-menu-icon{background:var(--accent);width:18px;height:18px;color:var(--on-accent);border-radius:50%;place-items:center;font-size:12px;font-weight:700;display:inline-grid}.help-menu-list{z-index:9;border:1px solid var(--border);border-radius:var(--radius-control);background:var(--panel);min-width:200px;box-shadow:var(--shadow-pop);margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 6px);right:0}.help-menu-list[hidden]{display:none}.help-menu-list a,.help-menu-list button{width:100%;font:inherit;text-align:left;border-radius:var(--radius-sm);color:var(--text);cursor:pointer;background:0 0;border:0;padding:10px 12px;font-size:14px;text-decoration:none;display:block}.help-menu-list a:hover,.help-menu-list button:hover{background:var(--control)}.help-menu-list [aria-current=page]{font-weight:600}@media (width<=420px){.theme-option,.help-menu-button{padding:0 10px}.theme-label,.help-menu-label{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}.theme-toggle{border:1px solid var(--border);background:var(--control);border-radius:999px;flex-shrink:0;padding:2px;display:inline-flex}.theme-option{min-height:36px;font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:0 12px;font-size:14px}.theme-option:hover{color:var(--text)}.theme-option[aria-pressed=true]{background:var(--accent);color:var(--on-accent);font-weight:600}.app-main{flex:1;grid-template:"start preview""rest preview"1fr/300px minmax(0,1fr);align-items:start;gap:16px 24px;padding:24px;display:grid}.editor-start{grid-area:start}.editor-rest{grid-area:rest}.app-main>.preview{grid-area:preview}@media (width<=800px){.app-main{grid-template:none/minmax(0,1fr);gap:16px;padding:16px}.editor-start,.editor-rest,.app-main>.preview{grid-area:auto}}.app-main[hidden]{display:none}.controls{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel);flex-direction:column;align-self:start;gap:18px;padding:20px;display:flex}@media (width>=801px) and (height>=500px){.app{--header-h:65px;--preview-chrome:250px}html{scroll-padding-top:81px}.app-header{z-index:5;height:var(--header-h);background:var(--bg);padding-block:0;position:sticky;top:0}.app-main>.preview{top:calc(var(--header-h) + 24px);position:sticky}.app-main>.preview .zoom-viewport{max-height:min(680px, calc(100vh - var(--header-h) - 48px - var(--preview-chrome)));max-height:min(680px, calc(100dvh - var(--header-h) - 48px - var(--preview-chrome)))}}.control-group{flex-direction:column;gap:14px;display:flex}.control-group+.control-group{border-top:1px solid var(--border);padding-top:18px}.group-title{font-family:var(--font-brand);letter-spacing:.06em;text-transform:uppercase;color:var(--text);align-items:center;gap:12px;margin:0;font-size:11px;font-weight:400;line-height:14px;display:flex}.group-title:before{content:"";background:var(--teal);width:5px;height:12px;box-shadow:7px 2px 0 var(--coral);border-radius:2px;flex:none;margin-top:-2px}.help-field{flex-direction:column;gap:8px;display:flex;position:relative}.help-field[hidden]{display:none}.help-button{z-index:1;width:26px;height:26px;font:inherit;border:1px solid var(--border);background:var(--control);color:var(--muted);cursor:pointer;border-radius:50%;place-items:center;padding:0;font-size:13px;font-weight:700;line-height:1;display:grid;position:absolute;top:-5px;right:0}.help-button:before{content:"";position:absolute;inset:-6px -8px -2px}.help-button:hover{border-color:var(--border-hover);color:var(--text)}.help-button[aria-expanded=true]{border-color:var(--accent);background:var(--accent);color:var(--on-accent)}.help-text{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--control);color:var(--text);padding:10px 12px;font-size:13px;line-height:1.45}.help-text[hidden]{display:none}.help-text p{margin:0 0 6px}.help-more{color:var(--link)}.tour-invite{border:1px solid var(--accent);border-radius:var(--radius-control);background:var(--invite);flex-direction:column;gap:10px;padding:12px;display:flex}.tour-invite p{margin:0;font-size:14px;line-height:1.4}@media (height<=500px){.app-header{padding-block:8px}.app-main{gap:12px 16px;padding:12px 16px}.controls{gap:10px;padding:14px 16px}.tour-invite{gap:6px;padding:8px 10px}.tour-invite p{text-align:center;font-size:13px}.tour-invite .button-row{justify-content:center}.first-photos .button{min-height:44px}}@media (width<=800px){.controls{gap:14px}.control-group{gap:12px}.control-group+.control-group{padding-top:14px}.tour-invite{flex-flow:wrap;justify-content:center;align-items:center;gap:8px 12px;padding:10px 12px}.tour-invite p{text-align:center;flex:100%;font-size:13px}}[data-tour],.zoom-viewport{scroll-margin:calc(var(--header-h,0px) + 16px) 16px 16px}.tour-backdrop{z-index:30;position:fixed;inset:0}.tour-spotlight{z-index:31;border-radius:var(--radius-control);box-shadow:0 0 0 2px #fff, 0 0 0 5px var(--tour-ring), 0 0 0 9999px var(--tour-dim);pointer-events:none;transition:top .2s,left .2s,width .2s,height .2s;position:fixed}.tour-spotlight[hidden]{display:none}@media (prefers-reduced-motion:reduce){.tour-spotlight{transition:none}}.tour-popover{z-index:32;border:2px solid var(--tour-ring);border-radius:var(--radius-panel);background:var(--panel);width:min(340px,100vw - 24px);color:var(--text);box-shadow:inset 0 4px 0 var(--sun), var(--shadow-pop);flex-direction:column;gap:12px;padding:16px;display:flex;position:fixed}.tour-popover[data-caret]:before{content:"";background:var(--panel);border:2px solid var(--tour-ring);width:14px;height:14px;position:absolute;transform:rotate(45deg)}.tour-popover[data-caret][data-side=bottom]:before{top:-9px;left:calc(var(--caret) - 7px);border-bottom-color:#0000;border-right-color:#0000}.tour-popover[data-caret][data-side=top]:before{bottom:-9px;left:calc(var(--caret) - 7px);border-top-color:#0000;border-left-color:#0000}.tour-popover[data-caret][data-side=right]:before{left:-9px;top:calc(var(--caret) - 7px);border-top-color:#0000;border-right-color:#0000}.tour-popover[data-caret][data-side=left]:before{right:-9px;top:calc(var(--caret) - 7px);border-bottom-color:#0000;border-left-color:#0000}.tour-progress{gap:4px;margin-top:6px;display:flex}.tour-progress span{background:var(--border);border-radius:2px;width:18px;height:4px}.tour-progress span.done{background:var(--accent)}.tour-count{font-family:var(--font-brand);color:var(--text);margin:0;font-size:12px;font-weight:400;line-height:16px}.tour-title{margin:2px 0 4px;font-size:17px}.tour-text{margin:0;font-size:14px;line-height:1.45}.tour-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.tour-nav{gap:8px;display:flex}.help-page{width:100%;max-width:980px;color:var(--text);flex-direction:column;gap:40px;margin:0 auto;padding:32px 24px 48px;display:flex}@media (width<=800px){.help-page{gap:32px;padding:20px 16px 40px}}.help-page h1{font-family:var(--font-brand);margin:0 0 8px;font-size:32px;font-weight:400}.help-page [tabindex="-1"]:focus{outline:none}.help-page h1,.help-concept{scroll-margin-top:calc(var(--header-h,0px) + 16px)}.help-lead{max-width:640px;color:var(--muted);margin:0 0 16px;font-size:17px;line-height:1.5}.help-page .button{text-decoration:none}.help-section h2{font-family:var(--font-brand);margin:0 0 16px;font-size:22px;font-weight:400}.help-steps{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:0;padding:0;list-style:none;display:grid}.help-step,.help-concept{border:1px solid var(--border);border-radius:var(--radius-panel);background:var(--panel);box-shadow:var(--shadow-panel);flex-direction:column;gap:10px;padding:14px;display:flex}.help-concept:target{border-color:var(--accent)}.help-step h3,.help-concept h3{margin:0 0 4px;font-size:16px;line-height:1.3}.help-step h3{align-items:baseline;gap:8px;display:flex}.help-step p,.help-concept p{margin:0;font-size:14px;line-height:1.5}.help-step-number{background:var(--accent);width:22px;height:22px;color:var(--on-accent);border-radius:6px;flex:none;place-items:center;font-size:12px;display:inline-grid}@media (width<=600px){.help-steps{grid-template-columns:minmax(0,1fr)}.help-step{flex-direction:row;align-items:flex-start}.help-step>.help-figure{flex:0 0 104px}}.help-concepts{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;display:grid}.help-concept p.help-example{color:var(--muted);font-size:13px}.help-figure{border-radius:var(--radius-sm);background:var(--stage);padding:8px}.help-figure svg{width:100%;height:auto;max-height:110px;display:block}.help-figure.small svg{max-height:104px}.help-footer{margin:0}.fig-photo{fill:var(--fig-photo)}.fig-hill{fill:var(--fig-hill)}.fig-tile{fill:var(--fig-tile)}.fig-accent{fill:var(--accent)}.fig-panel{fill:var(--panel);stroke:var(--border);stroke-width:1px}.fig-word{letter-spacing:1px;fill:var(--text);font:800 13px system-ui,sans-serif}.fig-caption{fill:var(--muted);font:600 10px system-ui,sans-serif}.fig-line{fill:none;stroke:var(--text);stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round}.fig-crop{fill:none;stroke:#fff;stroke-width:2px;stroke-dasharray:4 3}.fig-swatch-a{fill:#f1dcc3}.fig-swatch-b{fill:#f6c3ab}.fig-swatch-c{fill:#b9d7f0}.field{flex-direction:column;gap:8px;display:flex}.field[hidden]{display:none}.photo-tools{flex-direction:column;gap:8px;display:flex}.first-photos{flex-direction:column;display:flex}.first-photos .button{justify-content:center;min-height:48px;font-size:16px;font-weight:600}.first-photos.has-photos .button{font-size:15px;font-weight:500}.uploader{gap:8px;display:flex}.uploader .button{flex:1 1 0;justify-content:center;min-height:44px}.photo-clear .button{min-height:44px}@media (width<=800px),(height<=500px){.photo-tools{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 12px;display:grid}.photo-tools>.first-photos,.photo-tools>.uploader{grid-column:1/-1}.photo-tools>.group-title{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}.field-label{color:var(--muted);font-size:13px;font-weight:600}.field input[type=range]{accent-color:var(--slider)}.text-input{border:1px solid var(--border-strong);border-radius:var(--radius-control);background:var(--field);color:var(--text);text-transform:uppercase;width:100%;min-width:0;padding:8px 12px;font-size:22px;font-weight:700}.select-input{font:inherit;border:1px solid var(--border-strong);border-radius:var(--radius-control);background:var(--field);color:var(--text);width:100%;min-width:0;min-height:40px;padding:8px 10px;font-size:15px}.background-row{align-items:stretch;gap:8px;display:flex}.color-input{border:1px solid var(--border-strong);border-radius:var(--radius-control);background:var(--field);cursor:pointer;flex:none;width:48px;min-height:40px;padding:3px}.button-row{flex-wrap:wrap;gap:8px;display:flex}.button{font:inherit;border:1px solid var(--border);border-radius:var(--radius-control);background:var(--button);color:var(--text);box-shadow:var(--edge);cursor:pointer;align-items:center;padding:8px 14px;font-size:14px;display:inline-flex}.button:hover:not(:disabled){border-color:var(--border-hover)}.button:active:not(:disabled){box-shadow:0 1px 0 var(--border);transform:translateY(1px)}.button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:var(--edge-accent)}.button.primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.button.primary:active:not(:disabled){box-shadow:0 1px 0 var(--accent-key)}.button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.button.compact{gap:6px;padding:6px 12px;font-size:13px}.hint{color:var(--muted);margin:0;font-size:12px}.hint.empty-hint{color:var(--text);font-size:13px}.preview{flex-direction:column;gap:12px;min-width:0;display:flex}.preview-bar{justify-content:space-between;align-items:center;gap:8px 16px;display:flex}.preview-bar .stats{flex:auto;min-width:0}.history-row{flex-wrap:nowrap;flex:none;gap:6px}.editor-actions{margin-top:4px}.editor-actions .button{font-weight:600}.editor-actions .button:not(.primary){font-weight:400}@media (width<=800px),(height<=500px){.history-row .history-label{display:none}.history-row .button{justify-content:center;min-width:44px;min-height:44px;padding:0 10px;font-size:20px}.editor-actions .button,.collage-frame .zoom-toolbar .button{min-height:44px}.zoom-controls .zoom-button{min-width:44px;height:44px}}.stats{color:var(--muted);flex-wrap:wrap;gap:6px 16px;min-height:18px;font-size:13px;display:flex}.stats-live:empty{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.stats-alert{color:var(--danger-text);font-weight:600}.preview-canvas{flex:1;justify-content:center;align-items:flex-start;min-height:260px;display:flex}.preview-canvas:has(>.collage-frame){min-height:0}.preview-canvas>.preview-empty{align-self:center}.collage-frame{flex-direction:column;gap:8px;width:100%;display:flex}.collage-frame.is-fullscreen{z-index:10;background:var(--bg);padding:12px;position:fixed;inset:0}.zoom{flex-direction:column;flex:1;gap:8px;min-height:0;display:flex;position:relative}.zoom-viewport{border-radius:var(--radius-panel);background:var(--stage);touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:zoom-in;height:clamp(260px,55vh,680px);min-height:96px;max-height:min(680px,75svh);position:relative;overflow:hidden}.zoom-viewport.is-zoomed{touch-action:none;cursor:grab}.is-fullscreen .zoom-viewport{flex:1;height:auto;max-height:none}.zoom-content{transform-origin:0 0;width:100%;height:100%;padding:8px}.zoom-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.zoom-controls{gap:6px;display:flex}.zoom-button{min-width:38px;height:38px;font:inherit;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--zoom-button);color:var(--text);cursor:pointer;font-size:18px;font-weight:600}.zoom-button.zoom-fit{padding:0 10px;font-size:14px}.zoom-button:disabled{opacity:.45;cursor:default}.collage-svg{width:100%;height:100%;display:block}.format-edge{fill:none;stroke:var(--format-edge);stroke-width:1px;vector-effect:non-scaling-stroke}.collage-svg image,.collage-svg .slot-hit{cursor:pointer}.lightbox{z-index:20;background:#080a0ee6;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:16px;display:flex;position:fixed;inset:0}.lightbox-image{object-fit:contain;border-radius:6px;flex:0 auto;max-width:100%;min-height:0;max-height:100%}.lightbox-bar{flex:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:min(480px,100%);display:grid}.lightbox-action{text-align:left;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px;min-height:52px}.lightbox-action-label{font-weight:600}.lightbox-action-description{font-size:12px;line-height:1.3}.lightbox-action:not(.primary) .lightbox-action-description{color:var(--muted)}.lightbox-close{grid-column:1/-1;justify-content:center}.lightbox-error{color:#ffb4a8;text-align:center;margin:0;font-size:14px}.lightbox-name{text-align:center;color:#fff;text-overflow:ellipsis;white-space:nowrap;grid-column:1/-1;min-width:0;font-size:14px;overflow:hidden}.framing-editor{border:1px solid var(--border);border-radius:var(--radius-dialog);background:var(--panel);width:min(720px,100%);height:100%;max-height:760px;color:var(--text);flex-direction:column;gap:10px;padding:12px;display:flex}.framing-title{color:var(--muted);text-align:center;margin:0;font-size:14px}.framing-title .for-touch{display:none}@media (pointer:coarse){.framing-title .for-touch{display:inline}.framing-title .for-mouse{display:none}}.framing-stage{border-radius:var(--radius-sm);background:var(--stage);touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab;flex:1;min-height:0;position:relative;overflow:hidden}.framing-stage:active{cursor:grabbing}.framing-stage:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}.framing-stage img{pointer-events:none;max-width:none;position:absolute}.framing-context{opacity:.35}.framing-window{outline:2px solid #fff;position:absolute;overflow:hidden;box-shadow:0 0 0 1px #00000080}.framing-loading{color:var(--muted);place-items:center;display:grid;position:absolute;inset:0}.framing-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.framing-zoom,.framing-actions{align-items:center;gap:8px;display:flex}.framing-zoom .button{height:38px}.letter-base{fill:var(--grout)}.preview-empty{color:var(--muted)}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.swap-banner{border:1px solid var(--accent);border-radius:var(--radius-control);background:var(--panel);color:var(--text);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;padding:8px 8px 8px 12px;font-size:14px;font-weight:600;display:flex}.swap-source rect{fill:none;vector-effect:non-scaling-stroke}.swap-source-halo{stroke:#0000008c;stroke-width:6px}.swap-source-line{stroke:#fff;stroke-width:3px;stroke-dasharray:8 5}.is-swapping .collage-svg image,.is-swapping .collage-svg .slot-hit{cursor:crosshair}.photo-picker{border:1px solid var(--border);border-radius:var(--radius-dialog);background:var(--panel);width:min(720px,100%);max-height:100%;color:var(--text);flex-direction:column;gap:10px;padding:12px;display:flex}.picker-title{text-align:center;margin:0;font-size:16px}.picker-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;min-height:0;padding:3px;display:grid;overflow-y:auto}.picker-item{border-radius:var(--radius-sm);background:var(--stage);min-width:0;color:var(--text);font:inherit;cursor:pointer;border:2px solid #0000;flex-direction:column;gap:4px;padding:4px;display:flex;position:relative}.picker-item:hover{border-color:var(--border)}.picker-item.is-current{border-color:var(--accent)}.picker-item img{aspect-ratio:1;object-fit:cover;border-radius:5px;width:100%;display:block}.picker-name{text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.picker-badge{background:var(--accent);color:var(--on-accent);border-radius:999px;padding:2px 6px;font-size:11px;font-weight:700;position:absolute;top:8px;left:8px}.picker-bar{justify-content:flex-end;display:flex}.custom-shape-row{flex-wrap:wrap;align-items:center;gap:6px 10px;display:flex}.shape-dialog{z-index:20;background:#080a0e99;padding:16px;display:flex;position:fixed;inset:0;overflow-y:auto}.shape-panel{border:1px solid var(--border);border-radius:var(--radius-dialog);background:var(--panel);width:min(720px,100%);color:var(--text);box-shadow:var(--shadow-pop);flex-direction:column;gap:12px;margin:auto;padding:16px;display:flex;position:relative}.shape-panel:before{content:"";z-index:2;border-radius:calc(var(--radius-dialog) - 1px) calc(var(--radius-dialog) - 1px) 0 0;background:var(--grape);pointer-events:none;height:5px;position:absolute;top:0;left:0;right:0}.shape-panel.is-dragging{outline:2px dashed var(--accent);outline-offset:-6px}.shape-title{margin:0;font-size:18px}.shape-intro{font-size:13px}.shape-previews{grid-template-columns:1fr 1fr;gap:12px;display:grid}.shape-figure{flex-direction:column;gap:6px;min-width:0;margin:0;display:flex}.shape-figure figcaption{color:var(--muted);text-align:center;font-size:12px}.shape-stage{aspect-ratio:1;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--stage);place-items:center;padding:8px;transition:opacity .12s;display:grid;overflow:hidden}.shape-stage.is-stale{opacity:.6}.shape-checker{background-color:#fff;background-image:conic-gradient(#e3e6eb 25%, transparent 0 50%, #e3e6eb 0 75%, transparent 0);background-size:16px 16px}.shape-stage canvas,.shape-stage svg{object-fit:contain;width:100%;max-width:100%;height:100%;max-height:100%;display:block}.shape-fill{fill:var(--accent)}.shape-drop{color:#565c68;width:100%;height:100%;font:inherit;cursor:pointer;background:0 0;border:0;font-size:13px}.shape-empty{color:var(--muted);text-align:center;font-size:13px}.shape-controls{flex-wrap:wrap;align-items:flex-end;gap:12px 20px;display:flex}.shape-controls .field{flex:180px}.shape-check{cursor:pointer;align-items:center;gap:8px;min-height:40px;font-size:14px;display:inline-flex}.shape-check input{width:18px;height:18px;accent-color:var(--slider)}.shape-summary,.shape-problem{min-height:1.4em;margin:0;font-size:13px}.shape-problem{color:var(--danger-text);font-weight:600}.shape-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.shape-bar-end{gap:8px;margin-left:auto;display:flex}.shape-bar .button{min-height:40px}.zoom-content{position:relative}.text-layer{pointer-events:none;width:calc(100% - 16px);height:calc(100% - 16px);position:absolute;inset:8px;overflow:visible}.text-overlay{pointer-events:auto;cursor:grab;touch-action:none;outline:none}.text-overlay.is-dragging{cursor:grabbing}.text-layer.is-passive .text-overlay{pointer-events:none}.text-overlay-hit{fill:#0000}.text-overlay-box{fill:none;stroke:var(--focus);stroke-width:2px;stroke-dasharray:6 4;vector-effect:non-scaling-stroke;pointer-events:none}.text-overlay:focus-visible .text-overlay-box{stroke-width:3px;stroke-dasharray:none}.text-overlays,.text-editor{flex-direction:column;gap:12px;display:flex}.text-editor{border:1px solid var(--border);border-radius:var(--radius-control);background:var(--panel);padding:12px}.text-area{font:inherit;border:1px solid var(--border-strong);border-radius:var(--radius-control);background:var(--field);color:var(--text);resize:vertical;width:100%;min-width:0;padding:8px 10px;font-size:16px}.text-list{flex-wrap:wrap;gap:6px;display:flex}.text-chip{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font:inherit;border:1px solid var(--border);background:var(--control);color:var(--text);cursor:pointer;border-radius:999px;padding:6px 10px;font-size:13px;overflow:hidden}.text-chip[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);font-weight:600}.swatch-row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.swatch{border:1px solid var(--border-hover);cursor:pointer;border-radius:50%;width:26px;height:26px;padding:0}.swatch[aria-pressed=true]{box-shadow:0 0 0 2px var(--panel), 0 0 0 4px var(--accent)}.swatch-row .color-input{width:40px;min-height:30px}@media (width<=800px){.swatch{width:34px;height:34px}.swatch-row{gap:10px}}.segmented{border:1px solid var(--border);background:var(--control);border-radius:999px;padding:2px;display:flex}.segmented button{min-height:36px;font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;flex:1;padding:0 8px;font-size:14px}.segmented button:hover{color:var(--text)}.segmented button[aria-pressed=true]{background:var(--accent);color:var(--on-accent);font-weight:600}.text-selected-row{display:none}@media (width<=800px){.text-selected-row{display:flex}}.font-picker{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;display:grid}.font-choice{border:1px solid var(--border);border-radius:var(--radius-control);background:var(--control);min-height:48px;color:var(--text);font:inherit;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:6px 8px;display:flex;position:relative}.font-choice:hover{border-color:var(--border-hover)}.font-choice[aria-pressed=true]{border-color:var(--accent);background:var(--panel);box-shadow:inset 0 0 0 1px var(--accent)}.font-choice[aria-pressed=true]:after{content:"";border:2px solid var(--panel);background:var(--sun);pointer-events:none;border-radius:4px;width:10px;height:10px;position:absolute;top:-5px;right:-5px}.font-name{fill:currentColor;width:100%;max-width:132px;height:18px;display:block}.font-style{color:var(--muted);font-size:12px}.font-choice[aria-busy=true] .font-style{color:var(--accent-text)}.project-button{min-width:0;max-width:220px;min-height:40px;font:inherit;text-align:left;border:1px solid var(--border);border-radius:var(--radius-control);background:var(--button);color:var(--text);box-shadow:var(--edge);cursor:pointer;align-items:center;gap:8px;padding:2px 12px 2px 10px;display:inline-flex}.project-button:hover{border-color:var(--border-hover)}.project-button-icon{color:var(--accent-text);flex:none;display:inline-grid}.project-button-text{flex-direction:column;min-width:0;line-height:1.2;display:flex}.project-button-name{white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:600;overflow:hidden}.project-button-status{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.project-button-status.is-alert{color:var(--danger-text);font-weight:600}@media (width<=480px){.app-header{gap:8px}.project-button{max-width:150px;padding-inline:8px}.project-button-icon{display:none}}.project-notice{border:1px solid var(--border);border-radius:var(--radius-control);background:var(--panel);color:var(--text);flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0;padding:10px 12px;font-size:13px;display:flex}.project-notice p{flex:260px;margin:0}.project-notice.is-alert{border-color:var(--danger);background:var(--danger-bg)}.projects-panel{width:min(640px,100%)}.projects-head{z-index:1;border-bottom:1px solid var(--border);border-radius:var(--radius-dialog) var(--radius-dialog) 0 0;background:var(--panel);justify-content:space-between;align-items:center;gap:12px;margin:-16px -16px 0;padding:16px;display:flex;position:sticky;top:-16px}.projects-empty{padding:12px 0}.project-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.project-row{border:1px solid var(--border);border-radius:var(--radius-control);background:var(--control);gap:12px;padding:10px;display:flex}.project-row.is-current{border-color:var(--accent)}.project-thumb{background:var(--stage);border-radius:6px;flex:none;place-items:center;width:88px;height:66px;display:grid;overflow:hidden}.project-thumb img{object-fit:contain;width:100%;height:100%;display:block}.project-thumb-empty{background:var(--fig-photo);border-radius:4px;width:40%;height:40%}.project-info{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.project-name{overflow-wrap:anywhere;flex-wrap:wrap;align-items:center;gap:6px;margin:0;font-size:15px;display:flex}.project-badge{background:var(--accent);color:var(--on-accent);border-radius:999px;padding:1px 8px;font-size:11px;font-weight:600}.projects-panel .button{min-height:40px}.project-rename{flex-direction:column;gap:8px;display:flex}.project-rename-input{width:100%;font:inherit;border:1px solid var(--border-strong);border-radius:var(--radius-control);background:var(--field);color:var(--text);padding:8px 10px;font-size:15px}.project-confirm{border:1px solid var(--danger);border-radius:var(--radius-sm);background:var(--danger-bg);flex-direction:column;gap:8px;padding:8px 10px;display:flex}.project-confirm p{margin:0;font-size:13px}.button.danger{background:var(--danger);border-color:var(--danger);color:var(--on-danger)}@media (width<=480px){.project-row{grid-template-columns:80px minmax(0,1fr);align-items:center;gap:6px 12px;display:grid}.project-thumb{grid-row:1/span 2;width:80px;height:60px}.project-info{display:contents}.project-info>.project-name{grid-column:2;align-self:end}.project-info>.hint{grid-column:2;align-self:start;margin:0}.project-info>:not(.project-name,.hint){grid-column:1/-1}.project-info>.project-rename{grid-area:1/2/span 2}.project-actions{grid-template-columns:1fr 1fr;display:grid}}.crash-screen{box-sizing:border-box;border:1px solid var(--border);border-radius:var(--radius-dialog);background:var(--panel);width:min(560px,100% - 32px);color:var(--text);margin:15vh auto 0;padding:24px}.crash-screen h1{margin:0 0 12px;font-size:22px}.crash-screen p{margin:0 0 20px;line-height:1.5}@media (width<=800px),(height<=500px){.project-button,.help-menu-button{min-height:44px}.help-menu-button{justify-content:center;min-width:44px}.theme-toggle{box-shadow:inset 0 0 0 1px var(--border);border:0;padding:0}.theme-option{min-width:44px;min-height:44px}.help-menu-list a,.help-menu-list button{align-items:center;min-height:44px;display:flex}.help-field{padding-top:4px}.help-field>.field{gap:14px}.help-button{top:-1px}.help-button:before{inset:-10px}.help-more{align-items:center;min-height:44px;display:inline-flex}.select-input{min-height:44px;font-size:16px}.field input[type=range]{min-height:44px;margin-block:0}.color-input,.swatch-row .color-input{width:44px;min-height:44px}.button.compact,.segmented button,.text-chip{min-height:44px}.swatch{width:34px;height:34px;position:relative}.swatch:before{content:"";position:absolute;inset:-6px}.swatch-row{gap:12px}.lightbox-bar .button,.framing-bar .button,.picker-bar .button{min-height:44px}.framing-editor .zoom-button{min-width:44px;height:44px}.framing-zoom .button{height:44px}.projects-panel .button,.shape-bar .button,.shape-check{min-height:44px}.project-rename-input{min-height:44px;font-size:16px}a.app-title,.help-page .button{min-height:44px}.projects-panel .hint a{align-items:center;width:fit-content;min-height:44px;display:flex}}@media (height<=500px){.editor-start{gap:6px}.editor-start>.field{gap:4px}.control-group{gap:10px}.control-group+.control-group{padding-top:10px}[data-tour],.zoom-viewport{scroll-margin-top:8px}}.download-bar{display:none}@media (width<=800px),(height<=499.98px){.download-bar{z-index:9;padding:8px calc(12px + env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) calc(12px + env(safe-area-inset-left,0px));background:var(--panel);border-top:1px solid var(--border);justify-content:center;display:flex;position:fixed;inset:auto 0 0}.download-bar[hidden]{display:none}.download-bar-actions{grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:8px;width:100%;max-width:520px;display:grid}.download-bar .button{white-space:nowrap;justify-content:center;gap:8px;min-width:0;min-height:44px;padding:0 12px;font-size:15px}.download-bar .button.primary{font-weight:600}.download-bar-icon{flex:none;width:20px;height:20px}.app-main.room-for-bar{padding-bottom:calc(16px + 61px + env(safe-area-inset-bottom,0px))}}@media (height<=499.98px){.download-bar{padding-top:7px;padding-bottom:calc(7px + env(safe-area-inset-bottom,0px))}}@media (width<=359.98px){.download-bar-long{display:none}}.gallery-panel{gap:12px}.gallery-status:empty{display:none}.gallery-notice{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--control);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;padding:8px 10px;font-size:14px;display:flex}.gallery-notice span{overflow-wrap:anywhere;flex:200px;min-width:0}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px 10px;margin:0;padding:2px;list-style:none;display:grid}.gallery-item{flex-direction:column;gap:2px;min-width:0;display:flex;position:relative}.gallery-item img{aspect-ratio:1;object-fit:cover;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--stage);width:100%;margin-bottom:4px;display:block}.gallery-name{text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:600;overflow:hidden}.gallery-uses{color:var(--muted);font-size:12px}.gallery-remove{color:#fff;cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;width:44px;height:44px;padding:0;display:grid;position:absolute;top:-2px;right:-2px}.gallery-remove-dot{background:#0f1116c7;border:1px solid #ffffffb3;border-radius:50%;place-items:center;width:32px;height:32px;display:grid}.gallery-remove svg{width:18px;height:18px}.gallery-remove:hover .gallery-remove-dot{background:#0f1116eb}.gallery-remove:focus-visible{outline:none}.gallery-remove:focus-visible .gallery-remove-dot{outline:3px solid var(--focus);outline-offset:2px}.gallery-section{margin:4px 0 0}.gallery-empty{color:var(--muted);margin:0;padding:12px 0}.gallery-foot{flex-wrap:wrap;justify-content:space-between;gap:8px;padding-top:4px;display:flex}@media (width<=800px),(height<=500px){.gallery-foot .button{min-height:44px}}.background-image,.background-tone{flex-direction:column;gap:8px;display:flex}.background-row .select-input{flex:1 1 0;min-width:0}.background-upload{white-space:nowrap;flex:none;justify-content:center}.background-image{border:1px solid var(--border);border-radius:var(--radius-control);background:var(--control);padding:10px}.background-image.is-inactive{border-style:dashed}.background-image-head{align-items:center;gap:10px;min-width:0;display:flex}.background-image-thumb{border-radius:var(--radius-sm);object-fit:cover;background:var(--stage);flex:none;width:48px;height:48px}.background-image.is-inactive .background-image-thumb{opacity:.6}.background-image-info{flex-direction:column;min-width:0;display:flex}.background-image-name{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;overflow:hidden}.background-image-actions{flex-wrap:wrap;gap:8px;display:flex}.background-error{color:var(--danger-text);margin:0;font-size:13px}.background-error:empty{display:none}.framing-veil{pointer-events:none;position:absolute;inset:0}@media (width>=801px) and (height>=501px){.background-row{flex-wrap:wrap}.background-row .select-input,.background-upload{flex:100%}}
