/* Editable text stays live. The carriage and three light maps are local raster assets. */
body[data-theme=lamp]{--backdrop:#020305;--paper:#444441;--ink:#171712;--metal:#57544d}
body[data-theme=lamp] .ambience{background:none}
body[data-theme=lamp] .paper{background:var(--paper);border-radius:64px 64px 2px 2px;box-shadow:0 -1px 0 #ffffff13,0 20px 70px #0007;--grain:.14}
body[data-theme=lamp] .paper:after{background:none}
body[data-theme=lamp] .paper-shadow{display:none}
body[data-theme=lamp] .rail{background:linear-gradient(#42433e,#0b0b0b 35%,#171716 65%,#030303 90%);box-shadow:0 4px 8px #0006}
body[data-theme=lamp] .rail-cap{background:linear-gradient(90deg,#050505,#22221f,#070707)}
body[data-theme=lamp][data-light=warm]{--paper:#4e4b43}
body[data-theme=lamp][data-light=contrast]{--paper:#424548}
.stage .paper .lamp-beam{width:clamp(520px,74vw,940px);height:clamp(520px,74vw,940px);left:0;top:0;bottom:auto;z-index:1;background-image:url('assets/scene/light-atlas-v2.png');background-repeat:no-repeat;background-size:300% 100%;background-position:0 0;clip-path:none;filter:brightness(1.2);opacity:var(--effect);mix-blend-mode:screen;pointer-events:none;transform:none;transition:left .085s cubic-bezier(.15,.8,.25,1),top .085s cubic-bezier(.15,.8,.25,1),opacity .2s;transform-origin:50% 96.3%}
body[data-light=warm] .stage .paper .lamp-beam{background-position:50% 0}
body[data-light=contrast] .stage .paper .lamp-beam{background-position:100% 0;filter:brightness(1.3)}
body[data-theme=terminal] .stage .paper .lamp-beam{display:none}
.stage .rail .carriage{width:var(--carriage-width,164px);height:calc(var(--carriage-width,164px)*958/1642);top:calc(var(--carriage-width,164px)*-690/1642);margin:0;left:0;background:none;border:0}
.carriage-sprite{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;filter:brightness(1.04);transform-origin:50% 70%}
body[data-light=contrast] .carriage-sprite{filter:brightness(.75) contrast(1.08)}
.striking .carriage-sprite{animation:mechanical-strike .13s ease-out}
.stage .text-window,.stage .input-capture{font-family:var(--print-font,'PT Mono',monospace);font-weight:400;font-kerning:normal;font-feature-settings:'calt' 1,'liga' 1;letter-spacing:0;font-synthesis:none}
.stage .text-window{text-shadow:none;line-height:var(--line-height);width:calc(var(--text-width) + 6px)}
.stage .printed-line{font-family:inherit;white-space:pre}
.stage .type-caret{width:1.5px;opacity:.65}
.stage .placeholder{font-family:var(--print-font,monospace);font-size:calc(var(--font-size)*.82)}
.stage .input-capture{width:calc(var(--text-width) + .2px);padding:0;border:0;word-break:break-all;overflow-wrap:anywhere;white-space:pre-wrap}
.icon-image{width:17px;height:17px;filter:brightness(0) invert(1);opacity:.7}
.fonts-sheet{width:min(820px,calc(100vw - 32px))}
.font-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 26px}
.font-option{display:block;text-align:left;padding:18px 12px;border-bottom:1px solid #ffffff0d;min-width:0;position:relative;border-radius:5px}
.font-option:hover{background:#ffffff05}
.font-option[aria-pressed=true]{background:#d9c49c0c;box-shadow:inset 2px 0 #d9c49c}
.font-option-title{display:block;font-size:10px;color:#a9b39b;margin-bottom:10px}
.font-option[aria-pressed=true] .font-option-title{color:#e2c99d}
.font-sample{display:block;font-size:20px;line-height:1.4;color:#ece2cf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-feature-settings:'calt' 1,'liga' 1;font-kerning:normal;font-weight:400}
.lights-sheet{width:min(610px,calc(100vw - 32px))}
.light-list{display:flex;flex-direction:column;gap:13px}
.light-option{display:flex;align-items:center;gap:20px;text-align:left;min-height:106px;border:1px solid #ffffff13;border-radius:7px;padding:9px;background:#ffffff02}
.light-option:hover{background:#ffffff05}
.light-option[aria-pressed=true]{border-color:#d3bb86;box-shadow:0 0 0 1px #d3bb861a}
.light-preview{display:block;width:126px;align-self:stretch;flex-shrink:0;min-height:88px;background:#45443e url('assets/scene/light-atlas-v2.png') 0 0 / 300% 100% no-repeat;background-blend-mode:screen;border-radius:4px}
.light-preview[data-light-preview=warm]{background-position:50% 0}
.light-preview[data-light-preview=contrast]{background-position:100% 0;background-color:#44484a}
.light-copy strong{display:block;font-size:12px;font-weight:500;margin-bottom:7px}
.light-copy small{font-size:10px;color:#929f86;line-height:1.6;display:block}
.calm .striking .carriage-sprite{animation:none}
@keyframes mechanical-strike{0%{transform:translateY(.8px)}45%{transform:translateY(-.8px)}100%{transform:translateY(0)}}
@media(max-width:1150px){.app-footer{padding-left:14px;padding-right:14px}.toolbar{gap:0}.tool-button{padding-left:10px;padding-right:10px}}
@media(max-width:650px){
  body[data-theme=lamp] .paper{border-radius:36px 36px 2px 2px}
  .stage .paper .lamp-beam{width:560px;height:560px}
  .toolbar{width:100%;justify-content:space-between;padding:6px 3px;gap:0}
  .tool-button{padding:6px 5px;font-size:8px;gap:5px;min-height:48px;flex:0 1 auto}
  .tool-button small{display:none}.tool-separator{margin:0 1px}
  .icon-only{padding-left:5px;padding-right:5px}
  .font-list{grid-template-columns:1fr;gap:0}.font-option{padding:16px 10px}.font-sample{font-size:20px}
  .light-option{gap:12px;padding:7px;min-height:100px}.light-preview{width:95px;min-height:86px}.light-copy strong{font-size:11px}.light-copy small{font-size:9px}
}
.stage .paper .lamp-beam{opacity:calc(var(--effect)*1.25)}
@media(max-width:650px){.tool-button{font-size:8px}.app-footer{padding-left:10px;padding-right:10px}.stage-prompt{bottom:16px}.stage-prompt span{display:none}}
/* Feather the raster atlas edges so a cropped light map never reveals its rectangle. */
.stage .paper .lamp-beam{width:clamp(680px,100vw,1380px);height:clamp(680px,100vw,1380px);mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%)}
@media(max-width:650px){.stage .paper .lamp-beam{width:620px;height:620px}}
.stage.carriage-returning .paper .lamp-beam{transition-duration:.3s}
.calm .stage .rail .carriage,.calm .stage .paper .lamp-beam{transition-duration:.04s}
.stage .paper .lamp-beam{width:clamp(680px,80vw,1160px);height:clamp(480px,52vw,740px)}
@media(max-width:650px){.stage .paper .lamp-beam{width:620px;height:520px}}
/* One mechanical step keeps the lamp and its carriage together in every frame. */
.stage .rail .carriage{transition:none}
.stage .paper .lamp-beam{transition:opacity .2s}