/* Stage 01 shell. Canvas content is independent of these UI tokens. */
body[data-route=home] #app{display:none!important}body[data-route=editor] .home-screen{display:none!important}
.home-screen{height:100dvh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 25%,var(--ui-surface),var(--ui-bg) 70%);color:var(--ui-text)}.home-header{height:72px;min-height:72px;padding:12px 24px;border-bottom:1px solid var(--ui-border);display:flex;align-items:center;justify-content:space-between;background:linear-gradient(var(--ui-panel),var(--ui-bg));box-shadow:var(--ui-inset)}.home-header>.arvo-art{width:180px;height:42px}.home-header-actions{display:flex;gap:8px}.home-header-actions button{display:flex;align-items:center;gap:8px}.home-header-actions .ui-icon{width:18px;height:18px}
.home-core{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 16px}.home-core h1{font-size:12px;letter-spacing:.35em;color:var(--ui-muted);font-weight:400;margin:12px 0 28px}.home-mark{width:220px;height:220px;position:relative;display:grid;place-items:center}.home-mark img{width:148px;height:148px;z-index:1;object-fit:contain;filter:drop-shadow(0 7px 14px #0003)}.home-mark canvas{position:absolute;width:220px;height:220px}.home-navigation{width:min(300px,100%);display:grid;gap:10px}.home-navigation button{min-height:44px;display:flex;align-items:center;justify-content:center;gap:10px}.home-navigation .ui-icon{width:18px;height:18px}.home-core>.hint{max-width:90%;text-align:center;overflow-wrap:anywhere}.home-core>#menu-audio-toggle{display:flex;align-items:center;gap:8px;margin-top:22px;background:transparent;border-color:transparent;font-size:12px;color:var(--ui-muted)}#menu-audio-toggle .ui-icon{width:17px;height:17px}body[data-theme=light] .home-mark img{background:linear-gradient(#fff,#e4e9ef);border:1px solid #b7c1cd;border-radius:50%;padding:26px}
.shell-dialog{width:min(860px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0!important;overflow:hidden}.shell-dialog>header{position:relative!important;top:auto!important;padding:18px 22px!important;margin:0!important;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--ui-border)}.shell-dialog>header h2{margin:0;font-size:19px}.shell-dialog>header button{font-size:0;min-width:36px}.shell-dialog>header button .ui-icon{width:18px;height:18px}.shell-dialog-body{padding:22px;overflow:auto;max-height:calc(100dvh - 118px)}.shell-dialog label{display:block;font-size:12px;color:var(--ui-muted);margin:0 0 16px}.shell-dialog label input,.shell-dialog label select{display:block;width:100%;margin-top:6px}.shell-dialog .dialog-actions{position:static!important;margin:20px 0 0!important;padding:16px 0 0!important;border-top:1px solid var(--ui-border);display:flex;justify-content:flex-end;gap:8px}.shell-dialog button .ui-icon{width:16px;height:16px}.shell-dialog button{display:inline-flex;align-items:center;justify-content:center;gap:7px}.shell-pair,.wizard-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.wizard-grid{grid-template-columns:minmax(0,1fr) 220px;gap:24px}.wizard-preview{align-self:start;border:1px solid var(--ui-border);border-radius:9px;background:radial-gradient(#24364a,#0a1420);padding:25px 16px}.wizard-preview img{width:100px;height:100px;display:block;margin:auto}.wizard-preview .hint{color:#b2c4d6;margin-bottom:0}.shell-error{color:var(--ui-danger);font-size:12px}.shell-error:empty{display:none}.shell-library-tools{display:flex;align-items:center;gap:10px;margin-bottom:18px}.shell-library-tools input{flex:1;min-width:0}.shell-library-tools .arvo-select{width:auto}.shell-project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.shell-project-card{min-width:0;overflow:hidden;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-bg)}.project-thumbnail{aspect-ratio:16/9;display:grid;place-items:center;background:var(--ui-surface);overflow:hidden}.project-thumbnail img{width:100%;height:100%;object-fit:contain}.project-thumbnail .ui-icon{width:34px;height:34px;color:var(--ui-muted)}.shell-project-card>strong,.shell-project-card>small{display:block;padding:0 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shell-project-card>strong{margin-top:12px}.shell-project-card>small{font-size:11px;color:var(--ui-muted);margin-top:4px}.project-card-actions{display:flex;gap:7px;justify-content:space-between;padding:12px}.project-card-actions button{font-size:11px;padding:6px}.shell-dialog *{scrollbar-width:thin;scrollbar-color:var(--ui-border) transparent}
body #app{grid-template-rows:72px minmax(0,1fr)}.editor-header{height:72px}.topbar{height:72px;position:relative;display:flex;align-items:center;justify-content:space-between;padding:0 18px;gap:8px;background:linear-gradient(var(--ui-panel),var(--ui-bg));border-bottom:1px solid var(--ui-border)}.topbar .brand{width:190px;margin-right:auto}.topbar .brand>.arvo-art{width:155px}.arvo-tagline{display:none!important}.topbar>.tabs{position:absolute;left:50%;transform:translateX(-50%);height:100%;padding:0;display:flex;align-items:center;gap:4px;border:0;background:transparent;width:auto}.topbar>.tabs button{flex:none;min-width:0;padding:11px 14px;border-radius:8px;color:var(--ui-muted);font-size:12px}.topbar>.tabs button.active{color:var(--ui-text);background:linear-gradient(var(--ui-surface),var(--ui-panel));box-shadow:inset 0 -2px #218de8,0 3px 12px #2487cf12}.top-actions{margin-left:auto;gap:5px}.top-actions button{font-size:12px;min-height:34px}.top-actions .ui-icon{width:17px;height:17px}#library-open{display:flex;align-items:center;gap:7px}#home-open{margin:0;width:28px;min-width:28px}.topbar>#right-toggle,.topbar>#left-toggle{position:absolute;top:80px;z-index:7;background:var(--ui-panel);width:26px;height:26px;min-height:26px;border:1px solid var(--ui-border)}.topbar>#left-toggle{left:20px}.topbar>#right-toggle{right:20px}.project-name-field{font-size:12px!important;display:block!important;margin:0 0 14px;color:var(--ui-muted);padding-top:4px}.project-name-field>span{font-size:12px}.project-name-field input{display:block;width:100%;max-width:100%;margin-top:6px;background:var(--ui-bg);border:1px solid var(--ui-border)}.project-commands .project-new{min-height:36px}.project-commands button,.project-commands .file{min-height:45px}.inspector-grid .number-slider{display:none}.inspector-grid .arvo-number{flex-wrap:nowrap}.inspector-grid .number-value{height:34px}.number-scrub{flex:none}.panel h2{font-size:12px;letter-spacing:.12em;text-transform:uppercase}.editor-sidebar,.inspector{background:linear-gradient(145deg,var(--ui-panel),var(--ui-bg));box-shadow:inset 0 1px #c6e1ff0a,var(--ui-shadow)}
input[type=range]::-webkit-slider-runnable-track{height:6px;border:1px solid var(--ui-border);background:linear-gradient(90deg,var(--slider-fill-start) 0%,var(--slider-fill-end) var(--range-fill,0%),var(--slider-empty) var(--range-fill,0%));box-shadow:inset 0 1px 2px #0005;border-radius:5px}input[type=range]::-webkit-slider-thumb{width:16px;height:16px;margin-top:-6px;border:1px solid var(--thumb-border);background:linear-gradient(var(--thumb-top),var(--thumb-bottom));box-shadow:0 2px 4px #0004,0 0 7px #3d90d12a}input[type=range]::-moz-range-track{height:5px;background:var(--ui-border)}input[type=range]::-moz-range-progress{height:5px;background:var(--ui-accent)}
input[type=checkbox]:not(.layer-link){width:32px!important;height:18px!important;min-height:18px!important;border-radius:18px;background:var(--ui-border);border:0;box-shadow:inset 0 1px 3px #0004}input[type=checkbox]:not(.layer-link)::after{content:'';position:absolute;left:2px;top:2px;width:14px;height:14px;border-radius:50%;border:0;background:linear-gradient(#fff,var(--switch-thumb-bottom));box-shadow:0 1px 3px #0005;transform:none;transition:left .14s}input[type=checkbox]:not(.layer-link):checked{background:linear-gradient(var(--switch-on-top),var(--switch-on-bottom))}input[type=checkbox]:not(.layer-link):checked::after{left:16px}input[type=checkbox]:disabled{opacity:.45}
.intro{transition:opacity .6s ease!important;will-change:opacity}.intro-exit{opacity:0!important;pointer-events:none}.intro .intro-title,.intro .intro-by{display:none!important}.intro .intro-emblem{width:min(340px,75vw);height:112px;background:none!important;border:0!important;box-shadow:none!important}.intro .intro-emblem img{width:100%;height:100%;object-fit:contain}.intro .intro-emblem::before,.intro .intro-emblem::after{display:none!important}
@media(min-width:1001px) and (max-width:1360px){.topbar .brand{width:150px}.topbar .brand>.arvo-art{width:130px}.top-actions .save-state{display:none}.topbar>.tabs button{padding:11px 10px}.top-actions #library-open{font-size:0}.top-actions #library-open .ui-icon{width:18px}.top-actions #save{font-size:0;width:28px;padding:5px}.top-actions #save::after{display:none}}
@media(min-width:601px) and (max-width:1000px){body #app,body.left-closed #app,body.right-closed #app,body.left-closed.right-closed #app{grid-template-rows:64px minmax(180px,44dvh) minmax(0,1fr)}.editor-header,.topbar{height:64px}.topbar .brand{width:60px}.topbar .brand>.arvo-art{width:56px}.topbar>.tabs button{padding:10px 7px;font-size:11px}.top-actions #library-open{font-size:0}.top-actions #save{display:none}.top-actions #undo,.top-actions #redo{width:26px;padding:3px}.topbar>#left-toggle,.topbar>#right-toggle{top:72px}.shell-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){body #app,body.left-closed #app,body.right-closed #app,body.left-closed.right-closed #app{grid-template-rows:56px clamp(164px,34dvh,360px) minmax(0,1fr)}.editor-header,.topbar{height:56px}.topbar{padding:0 8px;gap:4px}.topbar .brand{width:34px;margin-right:auto}.topbar .brand>.arvo-art{width:32px}.topbar #home-open{display:flex;width:28px;padding:4px}.top-actions #library-open{font-size:0;padding:5px;width:30px;min-height:44px}.top-actions #theme-toggle{min-height:44px;width:32px}.top-actions #app-settings-open{width:30px}.topbar>#left-toggle,.topbar>#right-toggle{display:none}.home-header{height:56px;min-height:56px;padding:8px 16px}.home-header>.arvo-art{width:130px;height:34px}.home-header-actions button{font-size:0;min-width:36px}.home-core{padding:12px 20px}.home-mark{width:180px;height:180px}.home-mark canvas{width:180px;height:180px}.home-mark img{width:122px;height:122px}.home-core h1{margin:8px 0 20px}.home-navigation{gap:8px}.home-core>#menu-audio-toggle{margin-top:12px}.home-core .hint{font-size:11px;margin-bottom:0}.wizard-grid{display:block}.wizard-preview{display:none}.shell-dialog-body{padding:16px}.shell-project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.shell-library-tools{flex-wrap:wrap}.shell-library-tools>input{width:100%;flex-basis:100%}.project-card-actions button{font-size:0;min-width:36px;min-height:40px}.project-card-actions .ui-icon{width:18px;height:18px}.project-name-field input{min-height:40px}.timeline{min-width:0;overflow:hidden}.transport{max-width:100%}.transport #time{white-space:nowrap}.arvo-number .number-value{min-height:36px}.sheet-handle{touch-action:none}}
@media(prefers-reduced-motion:reduce){.intro{transition-duration:160ms!important}input[type=checkbox]::after{transition:none!important}}

.layer-row[hidden]{display:none!important}.layer-row.dragging{opacity:.45}.layer-row.drop-target{border-top:2px solid #289bfa;background:var(--ui-selected)}.layer-drag-ghost{position:fixed;top:-200px;left:0;width:260px;height:42px;z-index:9999;background:var(--ui-panel);border:1px solid var(--ui-border);box-shadow:var(--ui-shadow)}

.layer-list{display:flex;flex-direction:column}
.layer-grip{touch-action:none;user-select:none}.layer-drag-ghost.pointer-ghost{pointer-events:none;opacity:.85}

.preset-library{padding:0!important;width:min(940px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:hidden;display:none}.preset-library[open]{display:flex;flex-direction:column}.preset-library>header{position:static!important;display:flex;align-items:center;justify-content:space-between;margin:0!important;padding:18px 22px!important;border-bottom:1px solid var(--ui-border)}.preset-library>header h2{margin:0;font-size:19px}.preset-library>.dialog-content{padding:18px 22px;min-height:0;overflow:auto}.library-categories{display:flex;gap:8px;margin-bottom:14px}.library-categories [aria-selected=true]{background:var(--ui-selected);border-color:var(--ui-focus)}.preset-library input[type=search]{width:100%;margin-bottom:14px}.preset-library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.preset-library-card{overflow:hidden;min-width:0;border:1px solid var(--ui-border);border-radius:9px;background:var(--ui-bg)}.preset-pick{width:100%;display:block;padding:0;border:0;border-radius:0;text-align:left;box-shadow:none;background:transparent}.preset-pick img{display:block;width:100%;height:128px;object-fit:contain;background:var(--ui-bg);pointer-events:none}.preset-pick strong,.preset-pick small{display:block;padding:0 12px}.preset-pick strong{margin-top:12px}.preset-pick small{font-size:11px;color:var(--ui-muted);font-weight:400;padding-bottom:12px;margin-top:5px}.preset-pick[aria-pressed=true]{outline:2px solid var(--ui-focus);outline-offset:-2px}.preset-card-actions{display:flex;flex-wrap:wrap;gap:4px;padding:7px}.preset-card-actions button{font-size:11px;padding:5px}.preset-save-actions{display:flex;gap:6px;flex-wrap:wrap;padding:10px 22px;border-top:1px solid var(--ui-border)}.preset-library>.dialog-actions{margin:0!important;position:static!important;padding:14px 22px!important;display:flex;justify-content:flex-end;gap:8px}.preset-preview-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:20;padding:9px 12px;border-radius:9px;background:var(--ui-panel);border:1px solid var(--ui-border);box-shadow:var(--ui-shadow);width:max-content;max-width:95%}.preset-preview-bar[hidden]{display:none}.preset-preview-bar strong{font-size:12px;margin-right:10px}.preset-preview-bar button{min-height:34px;font-size:12px}.preset-library .check{font-size:12px}
@media(max-width:600px){.preset-library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.preset-pick img{height:100px}.preset-library>.dialog-content{padding:14px}.preset-library>header{padding:14px!important}.preset-save-actions{padding:10px}.preset-save-actions button{font-size:11px}.preset-library>.dialog-actions{flex-wrap:wrap;padding:10px!important}.library-categories{gap:4px}.library-categories button{font-size:12px;padding:8px}.preset-preview-bar{top:0;gap:4px}.preset-preview-bar strong{flex-basis:100%}.preset-preview-bar button{font-size:11px}}

.preview-quality-settings{border-bottom:1px solid var(--ui-border);padding-bottom:16px;margin-bottom:18px}.preview-quality-settings h3{margin:0 0 16px;font-size:14px}.preview-quality-settings pre{font-size:11px;white-space:pre-wrap;background:var(--ui-bg);border-radius:7px;padding:12px}.preview-quality-custom[hidden]{display:none}.preview-quality-settings label{display:block;margin-bottom:12px;color:var(--ui-muted);font-size:12px}.preview-quality-settings label .arvo-select{margin-top:6px}
.settings-flat{padding:16px 0;border-bottom:1px solid var(--ui-border)}.settings-flat>h3{margin:0 0 16px;font-size:13px;font-weight:600}.settings-flat .settings-section-body{padding:0;border:0}.composition-dimensions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.composition-dimensions>label{min-width:0;font-size:11px}.composition-dimensions .arvo-number{margin-top:7px}.composition-dimensions .number-slider{display:none}.composition-dimensions .number-value{min-width:0;width:100%}.effect-catalog-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--ui-border);padding:5px 0}.effect-catalog-row>button{flex:1;text-align:left;border-color:transparent;background:transparent;box-shadow:none;min-height:42px}.effect-catalog-row>button[aria-pressed=true]{background:var(--ui-selected);border-color:var(--ui-border)}.effect-catalog-row .effect-toggle{margin:0;padding:0;flex-shrink:0}.preview-options{display:flex;align-items:center;justify-content:flex-end;gap:8px;width:100%;min-height:32px;margin-bottom:8px;position:relative;z-index:4}.preview-options>.hint{margin:0 auto 0 0;font-variant-numeric:tabular-nums}.preview-options>button,.preview-manual>summary{min-height:28px;padding:5px 10px;font-size:11px}.preview-manual>div{position:absolute;right:0;top:36px;width:220px;padding:14px;background:var(--ui-panel);border:1px solid var(--ui-border);border-radius:8px;box-shadow:var(--ui-shadow)}.preview-manual label{margin:0}.shape-segments{display:flex;gap:4px;margin-bottom:16px}.shape-segments>button{flex:1;min-width:0;padding:8px 4px;font-size:11px}.shape-segments>button[aria-pressed=true]{background:var(--ui-selected);border-color:var(--ui-accent)}.background-quick{display:flex;gap:8px;align-items:center;width:100%;margin-top:14px}.background-quick svg{width:16px;height:16px}#legacy-control-stash[hidden]{display:none!important}#inspector-scroll>[data-controls]{margin-top:18px;border-top:1px solid var(--ui-border);padding-top:8px}
#inspector-scroll>label{display:block;font-size:12px;color:var(--ui-muted);margin-bottom:14px}#inspector-scroll>label>.arvo-select,#inspector-scroll>label>.arvo-number{margin-top:7px}#inspector-scroll>label>input[type=color]{display:block;margin-top:7px}
.settings-flat>h3{color:var(--ui-text)}.shape-segments>button[aria-pressed=true]{color:var(--ui-text)}
.shell-dialog .text-action{display:inline-flex;width:auto;min-height:32px;padding:0!important;margin:0 0 10px;border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important;color:var(--ui-muted);font:inherit;font-size:12px;text-align:left;cursor:pointer;transition:color .14s}.shell-dialog .text-action:hover,.shell-dialog .text-action:active{color:var(--ui-text);background:transparent!important;box-shadow:none!important;text-decoration:underline;text-underline-offset:3px}.shell-dialog .text-action:focus-visible{outline:2px solid var(--ui-focus);outline-offset:4px}.shell-dialog input[type=file][hidden]{display:none!important}
.layer-menu[popover]{inset:auto;margin:0;max-height:calc(100dvh - 16px);max-width:calc(100vw - 16px);overflow:auto}.layer-menu button{min-height:36px;text-align:left}

/* Independent scene-effect controls must not flow into adjacent labels. */
.scene-effect-color-row,.scene-effect-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:36px;margin:12px 0;color:var(--ui-muted);font-size:12px;line-height:1.5}
.scene-effect-color-row>input[type=color]{flex:none;width:48px;min-width:48px;height:34px;margin:0}
.scene-effect-toggle-row>input{flex:none;margin:0}

.effect-catalog-row .effect-scope-label{display:block;margin-top:3px;font-size:11px;line-height:1.5;color:var(--ui-muted);font-weight:400;white-space:normal}.effect-target-hint{margin:4px 0 14px}
