@font-face{font-family:'Fraunces';font-style:normal;font-weight:500 800;font-display:swap;src:url(fonts/fraunces-latin.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/jost-latin.woff2) format('woff2')}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
:root{
  --wall:#202C35; --wall-deep:#161d23; --shadow:#53616A; --table:#D6C8AE; --rind:#B65B32; --edge:#EAA56A; --candle:#FFD58A; --sage:#A6B5A2; --ink:#F5EDE0;
  --clay:#B0653E; --clay-hi:#C98358; --clay-lo:#8e4c2c; --engrave:#4b2713; --pocket:#241b14; --wood:#2b2018;
  --safe-t:env(safe-area-inset-top,0px); --safe-b:env(safe-area-inset-bottom,0px);
  --safe-l:env(safe-area-inset-left,0px); --safe-r:env(safe-area-inset-right,0px);
  --vvh:100dvh;
  --pressed:inset 0 2px 5px rgba(20,8,2,.5),inset 0 0 0 1px rgba(60,26,10,.35),0 1px 0 rgba(255,214,170,.12);
  --glow:inset 0 0 16px rgba(255,213,138,.7),inset 0 2px 5px rgba(20,8,2,.35),0 0 10px rgba(255,200,110,.3);
}
html,body{width:100%;height:100%;height:var(--vvh);overflow:hidden;overscroll-behavior:none;background:var(--wall-deep);color:var(--ink);
  font-family:'Jost',ui-rounded,system-ui,sans-serif;font-weight:500;-webkit-text-size-adjust:100%;user-select:none;-webkit-user-select:none;touch-action:manipulation}
[hidden]{display:none!important}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}

.app{position:fixed;inset:0;height:var(--vvh);display:grid;grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);background:var(--wall-deep)}
.topbar{display:flex;align-items:center;gap:6px;padding:calc(6px + var(--safe-t)) calc(8px + var(--safe-r)) 6px calc(8px + var(--safe-l));position:relative;z-index:6;background:linear-gradient(#10161b,#161d23);border-bottom:1px solid #2b3842}
.topbar .brand{font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:1.2rem;color:var(--table);letter-spacing:.01em;margin-left:8px;white-space:nowrap}
.spacer{flex:1 1 auto;min-width:0}


.btn{white-space:nowrap;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:12px;
  background:linear-gradient(var(--clay),#a85f39);color:#3d1f0f;font-weight:600;padding:0 11px;text-decoration:none;
  box-shadow:var(--pressed);transition:transform .08s,box-shadow .15s,background .15s}
.btn svg{filter:drop-shadow(0 1px 0 rgba(255,214,170,.38));color:var(--engrave)}
.btn:active{transform:translateY(1px) scale(.97);box-shadow:inset 0 3px 7px rgba(20,8,2,.6),inset 0 0 0 1px rgba(60,26,10,.45)}
.btn:focus-visible{outline:3px solid var(--candle);outline-offset:2px}
.btn.icon{width:44px;padding:0}
.btn.pill{border-radius:12px;padding:0 14px;font-size:.95rem}
.btn[disabled]{opacity:.42;cursor:default;box-shadow:inset 0 1px 3px rgba(20,8,2,.4);filter:saturate(.6)}
.btn.on,.btn[aria-pressed="true"]{background:linear-gradient(var(--clay-hi),#bd7448);color:#2e1608;box-shadow:var(--glow)}
.btn.primary{background:linear-gradient(var(--clay-hi),#bd7448);color:#2e1608;box-shadow:var(--glow)}
.btn.danger.armed{background:linear-gradient(#a8452f,#8f3524);color:#fbe9d8;box-shadow:inset 0 2px 6px rgba(20,4,0,.5)}
.btn.danger.armed svg{color:#fbe9d8}
.count{background:var(--candle);color:#3a1c0a;border-radius:7px;padding:0 6px;font-size:.75rem;line-height:18px;min-width:18px;text-align:center;font-weight:700}
.home-chip{margin-left:0}

.stage{position:relative;min-height:0;min-width:0;overflow:hidden;touch-action:none;--dock-b:8px;--dock-h:48px;--foot:63px;background:#10161b}
#scene,#patch-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}
.floaters{position:absolute;left:calc(8px + var(--safe-l));top:8px;display:flex;gap:8px;z-index:3}
.hint{position:absolute;left:50%;top:56%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;
  font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:1.15rem;color:var(--ink);text-shadow:0 2px 8px rgba(0,0,0,.85);transition:opacity .35s;z-index:2}
.hint.gone{opacity:0}
.hint .finger{width:64px;height:64px;animation:swipe 1.8s ease-in-out infinite}
.hint .finger circle{fill:rgba(245,237,224,.82);stroke:#f5ede0;stroke-width:2}
@keyframes swipe{0%{transform:translate(-46px,6px) scale(1)}45%{transform:translate(46px,-14px) scale(.86)}100%{transform:translate(-46px,6px) scale(1)}}
.toast{position:absolute;left:50%;top:10px;transform:translate(-50%,-14px);max-width:min(92%,420px);background:var(--table);color:#2a1a10;
  padding:9px 15px;border-radius:9px;font-size:.95rem;font-weight:600;text-align:center;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:5;box-shadow:0 6px 18px rgba(0,0,0,.5)}
.toast.show{opacity:1;transform:translate(-50%,0)}
#fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;display:none}
.r3d #fx{display:block}


.turn{position:absolute;left:calc(10px + var(--safe-l));bottom:calc(var(--dock-b) + 2px);width:52px;height:52px;border-radius:50%;z-index:3;touch-action:none;
  background:radial-gradient(circle at 50% 38%,#c0764a,#a35b37);box-shadow:var(--pressed),0 0 0 3px rgba(20,12,8,.5);color:var(--engrave);display:grid;place-items:center}
.turn svg{width:28px;height:28px;filter:drop-shadow(0 1px 0 rgba(255,214,170,.38))}
.turn.on{box-shadow:var(--glow),0 0 0 3px rgba(20,12,8,.5)}
.turn:focus-visible{outline:3px solid var(--candle);outline-offset:3px}
.r2d .turn,.r2d .turnhint{display:none}
.turnhint{position:absolute;left:calc(70px + var(--safe-l));bottom:calc(var(--dock-b) + 12px);opacity:0;transition:opacity .4s;pointer-events:none;z-index:3;
  background:var(--table);color:#2a1a10;border-radius:9px;padding:7px 13px 7px 12px;font-weight:700;font-size:.95rem;box-shadow:0 5px 14px rgba(0,0,0,.5)}
.turnhint::before{content:"";position:absolute;left:-8px;top:50%;margin-top:-7px;border:7px solid transparent;border-right:9px solid var(--table);border-left:0}
.turnhint.show{opacity:1}

.drawbar{position:absolute;left:0;right:0;bottom:0;padding:10px 10px calc(10px + var(--safe-b));display:flex;flex-direction:column;align-items:center;gap:8px;
  background:linear-gradient(rgba(16,22,27,0),rgba(16,22,27,.94) 42%);z-index:4}
.drawbar[hidden]{display:none}
.drawmsg{font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:1.05rem;color:var(--table);text-shadow:0 2px 4px #000;text-align:center}
.drawbtns{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}


.panel{background:linear-gradient(rgba(30,22,16,.86),rgba(20,15,11,.93)),url(assets/bench.webp) center/340px;border-top:3px solid #3a2a1e;box-shadow:0 -1px 0 #6f523a;display:flex;flex-direction:column;min-height:0;
  height:clamp(206px,33dvh,320px);padding-bottom:var(--safe-b);z-index:5}
.tabs{display:flex;gap:6px;padding:7px 8px 4px;flex:none}
.tab{flex:1;min-height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:6px;color:var(--table);background:rgba(10,6,3,.42);font-size:.9rem;font-weight:600;box-shadow:inset 0 1px 3px rgba(0,0,0,.45)}
.tab svg{width:20px;height:20px;color:var(--table)}
.tab.on{color:#2e1608;background:linear-gradient(var(--clay-hi),#bd7448);box-shadow:var(--glow)}
.tab.on svg{color:var(--engrave)}
.tabbody{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:6px 10px 10px;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.pane{display:none}.pane.on{display:block}
.lbl{font-size:.8rem;color:var(--table);opacity:.85;margin:6px 0 4px;letter-spacing:.04em;font-weight:600}
.row{display:flex;gap:8px;align-items:center}
.tools .tool{flex:1;flex-direction:column;gap:2px;font-size:.78rem;min-height:56px;padding:4px}
.tools .tool.plain{flex:0 0 64px}
.sizes .size{flex:1;min-height:48px}
.size i{display:block;width:var(--d);height:var(--d);border-radius:50%;background:var(--engrave);box-shadow:0 1px 0 rgba(255,214,170,.4)}
.tip{font-size:.82rem;color:var(--table);opacity:.8;margin-top:6px}
.opts{margin-top:6px}
.stamps{display:flex;flex-wrap:wrap;gap:6px}
.stamp{width:52px;height:52px;min-width:44px;min-height:44px;border-radius:12px;background:linear-gradient(var(--clay),#a85f39);box-shadow:var(--pressed);display:grid;place-items:center;padding:7px;color:var(--engrave)}
.stamp svg{width:100%;height:100%;fill:rgba(75,39,19,.35);stroke:currentColor;stroke-width:5;filter:drop-shadow(0 1px 0 rgba(255,214,170,.35))}
.sliders{display:flex;gap:12px;margin-top:8px}
.sliders.col{flex-direction:column;gap:2px}
.sliders label{flex:1 1 0;min-width:0;display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--table);min-height:44px;font-weight:600}
input[type=range]{flex:1;min-width:0;width:100%;height:44px;background:transparent;-webkit-appearance:none;appearance:none;touch-action:pan-x}
input[type=range]::-webkit-slider-runnable-track{height:10px;border-radius:5px;background:linear-gradient(90deg,#2a1d14,#8a5a36 60%,#d4a066);box-shadow:inset 0 2px 4px rgba(0,0,0,.65),0 1px 0 rgba(255,214,170,.14)}
input[type=range]::-moz-range-track{height:10px;border-radius:5px;background:linear-gradient(90deg,#2a1d14,#8a5a36 60%,#d4a066);box-shadow:inset 0 2px 4px rgba(0,0,0,.65)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#c9805a,#a85f39);margin-top:-10px;box-shadow:0 2px 5px rgba(0,0,0,.6),inset 0 -2px 4px rgba(60,26,10,.5)}
input[type=range]::-moz-range-thumb{width:28px;height:28px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#c9805a,#a85f39);border:0;box-shadow:0 2px 5px rgba(0,0,0,.6)}
input[type=range]:focus-visible{outline:3px solid var(--candle);outline-offset:-2px;border-radius:8px}
.huebar input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg,#c24a32,#d8993a,#d9c24a,#6f9a50,#4a9a98,#4a6fb0,#8460a8,#b84f7c,#c24a32)}
.huebar input[type=range]::-moz-range-track{background:linear-gradient(90deg,#c24a32,#d8993a,#d9c24a,#6f9a50,#4a9a98,#4a6fb0,#8460a8,#b84f7c,#c24a32)}

.shapegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:8px}
.shape{min-height:76px;border-radius:12px;background:var(--pocket);box-shadow:inset 0 3px 8px rgba(0,0,0,.7),0 1px 0 rgba(255,214,170,.12);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:4px 2px 4px;font-size:.7rem;gap:2px;position:relative;overflow:hidden;color:var(--table)}
.shape img,.shape canvas{width:52px;height:52px;object-fit:contain;pointer-events:none}
.shape.on,.lt.on,.stamp.on{box-shadow:var(--glow);background:#3a2a1d}
.stamp.on{background:linear-gradient(var(--clay-hi),#bd7448)}
.shape svg{width:40px;height:40px;color:var(--edge)}
.lightgrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.lt span{text-align:center;line-height:1.1}
.lt{min-height:72px;border-radius:12px;background:linear-gradient(var(--clay),#a85f39);box-shadow:var(--pressed);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:4px 2px;font-size:.68rem;gap:2px;overflow:hidden;color:#3d1f0f;font-weight:600;touch-action:none}
.lt svg{width:42px;height:42px;color:var(--engrave);stroke-width:1.5}
.lt img{width:42px;height:42px;object-fit:contain;pointer-events:none;filter:drop-shadow(0 1px 0 rgba(255,214,170,.3))}
.lt.on{background:linear-gradient(var(--clay-hi),#bd7448)}
.swatches{display:flex;flex-wrap:wrap;gap:8px}
.sw{flex:none;width:44px;height:44px;border-radius:50%;box-shadow:inset 0 3px 6px rgba(0,0,0,.55),0 0 0 3px rgba(20,12,8,.7)}
.sw.on{box-shadow:inset 0 3px 6px rgba(0,0,0,.4),0 0 0 3px var(--candle),0 0 12px rgba(255,213,138,.5)}
.stickers{display:flex;flex-wrap:wrap;gap:8px}
.stk{width:58px;height:58px;border-radius:12px;background:var(--pocket);box-shadow:inset 0 3px 8px rgba(0,0,0,.7),0 1px 0 rgba(255,214,170,.12);display:grid;place-items:center;padding:5px;min-width:44px;min-height:44px}
.stk img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.selbar{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 2px;padding:8px;border-radius:12px;background:rgba(10,6,3,.4);box-shadow:inset 0 2px 6px rgba(0,0,0,.5)}
.selbar[hidden]{display:none}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:44px;padding:0 14px;border-radius:12px;font-size:.88rem}


.patchview{position:fixed;inset:0;height:var(--vvh);z-index:20;background:#10161b}
.patchview[hidden]{display:none}
.ptop{position:absolute;left:0;right:0;top:0;background:linear-gradient(rgba(10,14,18,.88),transparent);border-bottom:0}
.pager{font-size:.9rem;color:var(--table);padding:0 6px}
.empty{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px;
  background:var(--table);color:#2a1a10;border-radius:12px;width:min(86%,360px);box-shadow:0 10px 30px rgba(0,0,0,.55)}
.empty[hidden],.card[hidden],.patchnote[hidden]{display:none}
.empty p{font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:1.3rem}
.empty .sub{font-family:'Jost',sans-serif;font-size:.98rem;font-weight:500}
.patchnote{position:absolute;left:50%;bottom:calc(10px + var(--safe-b));transform:translateX(-50%);background:var(--table);color:#2a1a10;border-radius:9px;padding:8px 14px;font-size:.85rem;font-weight:600;max-width:min(92%,460px);text-align:center}
.card{position:absolute;left:50%;bottom:calc(14px + var(--safe-b));transform:translateX(-50%);background:linear-gradient(rgba(30,22,16,.92),rgba(20,15,11,.96)),url(assets/bench.webp) center/300px;border-radius:14px;padding:12px;display:flex;gap:12px;align-items:center;box-shadow:0 10px 40px rgba(0,0,0,.65),inset 0 0 0 1px #4a3626;max-width:calc(100vw - 16px)}
.card canvas{width:96px;height:96px;border-radius:10px;background:#161d23;flex:none;box-shadow:inset 0 2px 8px rgba(0,0,0,.6)}
.cardbtns{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}


@media (min-aspect-ratio:6/5) and (min-width:700px){
  .app{grid-template-columns:340px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .topbar{grid-column:1/-1;grid-row:1}
  .stage{grid-column:2;grid-row:2}
  .panel{grid-column:1;grid-row:2;height:auto;border-top:0;border-right:3px solid #3a2a1e;box-shadow:1px 0 0 #6f523a}
  .sliders{flex-direction:column;gap:0}
  .lbl{font-size:.9rem}
  .tip{font-size:.9rem}
  .shape{font-size:.8rem}
  .lightgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lt{font-size:.82rem;min-height:84px}
  .lt svg,.lt img{width:46px;height:46px}
  .chip{font-size:.95rem}
}
@media (min-aspect-ratio:6/5) and (min-width:1000px){
  .app{grid-template-columns:300px minmax(0,1fr) 120px}
  .app .shelf{display:flex}
}
@media (min-aspect-ratio:6/5) and (min-width:1100px){
  .app{grid-template-columns:340px minmax(0,1fr) 168px}
}
.shelf{display:none;grid-column:3;grid-row:2;flex-direction:column;gap:10px;padding:12px 10px;background:linear-gradient(rgba(30,22,16,.86),rgba(20,15,11,.93)),url(assets/bench.webp) center/340px;border-left:3px solid #3a2a1e;box-shadow:-1px 0 0 #6f523a;overflow:hidden;z-index:5}
.shelf h2{font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:.95rem;color:var(--table);letter-spacing:.02em}
.shelf .lanterns{display:flex;flex-direction:column;gap:8px;overflow:hidden}
.shelf button.lantern{display:block;width:100%;aspect-ratio:1;border-radius:12px;background:#161d23;box-shadow:inset 0 3px 8px rgba(0,0,0,.7),0 1px 0 rgba(255,214,170,.12);padding:0;overflow:hidden}
.shelf canvas{width:100%;height:100%;display:block}
.shelf .none{font-size:.85rem;color:var(--table);opacity:.8;line-height:1.35}
@media (max-width:560px){
  .toast{top:52px;padding:6px 12px;font-size:.9rem}
  .topbar .brand{display:none}
  .btn.pill span:not(.count){display:none}
  .btn.pill{padding:0;width:44px}
  .drawbar .btn.pill span{display:inline}
  .drawbar .btn.pill{width:auto;padding:0 12px}
  
  .row.tools,.sizes,.lightgrid,.chips,.stickers,.stamps,.swatches{flex-wrap:nowrap;overflow-x:auto;touch-action:pan-x;-webkit-overflow-scrolling:touch;padding-bottom:4px}
  .lightgrid{display:flex}
  .lt{flex:0 0 66px}
  .tools .tool{flex:0 0 78px}
  .sizes .size{flex:0 0 72px}
  .stamp,.stk,.chip,.sw{flex:none}
  .shapegrid{grid-auto-flow:column;grid-template-columns:none;grid-template-rows:repeat(2,minmax(72px,auto));grid-auto-columns:78px;overflow-x:auto;touch-action:pan-x;padding-bottom:4px}
  .lbl{margin:4px 0 2px}
  #pane-light > .lbl:first-child{display:none}
  .lt{min-height:58px}
  .lt svg,.lt img{width:32px;height:32px}
  .tabbody{padding-bottom:6px}
  .tab span{font-size:.8rem}
}
@media (max-height:420px) and (min-aspect-ratio:6/5){
  .topbar{padding-top:calc(3px + var(--safe-t));padding-bottom:3px}
}
@media (prefers-reduced-motion:reduce){.hint .finger{animation:none}}

.tips{display:none;list-style:none;margin-top:14px;padding:12px;border-radius:12px;background:rgba(10,6,3,.4);box-shadow:inset 0 2px 6px rgba(0,0,0,.5);font-size:.85rem;color:var(--table);font-weight:500;line-height:1.35}
.tips li{margin:0 0 8px;padding-left:16px;position:relative}
.tips li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;border-radius:50%;background:var(--edge)}
@media (min-aspect-ratio:6/5) and (min-width:700px) and (min-height:560px){.tips{display:block}}
.ptop .btn.pill span{display:inline!important}
.ptop .btn.pill{width:auto!important;padding:0 14px!important}
.ptop .brand{display:block!important;font-size:1rem}
@media (max-width:1150px){.topbar .brand{display:none}}
.ptop .brand{display:block!important}


.fl[aria-pressed="true"]{background:linear-gradient(var(--clay-hi),#bd7448);box-shadow:var(--glow)}
.candleprompt{position:absolute;left:50%;bottom:var(--dock-b);transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:8px;box-sizing:border-box;height:var(--dock-h);
  padding:0 4px 0 12px;border-radius:10px;background:var(--table);color:#2a1a10;font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:1.02rem;
  box-shadow:0 6px 20px rgba(0,0,0,.55),0 0 22px rgba(255,200,110,.35);cursor:pointer;animation:promptbob 1.6s ease-in-out infinite;white-space:nowrap}
.candleprompt[hidden]{display:none}
.candleprompt svg.candle{width:26px;height:34px;color:#7a3e1e;stroke-width:1.6}
.candleprompt .x{background:rgba(60,34,18,.14);box-shadow:none;color:#2a1a10;width:44px;height:44px;border-radius:8px;margin:calc((var(--dock-h) - 50px) / 2) 0}
.candleprompt .x svg{color:#2a1a10;filter:none}
.candleprompt:focus-visible{outline:3px solid var(--candle);outline-offset:3px}
@keyframes promptbob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-5px)}}
.lightbar{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px}
.lightbar .lbl{margin:0}
.lightbar .chip{min-height:44px;padding:0 14px;flex:none}
.lightghost{position:fixed;width:64px;height:auto;pointer-events:none;z-index:60;transform:translate(-50%,-62%) rotate(-8deg);filter:drop-shadow(0 8px 10px rgba(0,0,0,.5))}
@media (prefers-reduced-motion:reduce){.candleprompt{animation:none}}
@media (max-width:560px){
  .lightbar{min-height:44px}
  .lightbar:has(#light-take[hidden]){display:none}
  .lightbar .lbl{font-size:.8rem}
  #pane-light .sliders{margin-top:2px}
  #pane-light .sliders.col{flex-direction:row;gap:12px}
  #pane-light .sliders.col label{flex-direction:column;align-items:stretch;justify-content:center;gap:0;font-size:.75rem}
  #pane-light .sliders.col input{width:100%}
  #pane-light .swatches{padding-bottom:2px}
  #pane-light > .lbl{display:none}
}


.lightsdock{position:absolute;right:8px;bottom:var(--dock-b);z-index:4;display:flex;align-items:center;gap:14px;pointer-events:none}
.lightsdock > *{pointer-events:auto}
.btn.pill.lights{min-height:var(--dock-h);width:auto;padding:0 16px 0 12px;gap:8px;border-radius:12px;font-family:'Fraunces',Georgia,serif;font-size:1.02rem;font-weight:700;
  background:linear-gradient(#3b4650,#2a343c);color:var(--table);box-shadow:var(--pressed),0 5px 16px rgba(0,0,0,.5)}
.btn.pill.lights span{display:inline}
.lights svg{color:var(--candle);fill:rgba(255,213,138,.2);filter:none}
.btn.pill.lights.dark{background:linear-gradient(#e6b777,#c98358);color:#2e1608;box-shadow:var(--glow),0 5px 16px rgba(0,0,0,.5)}
.btn.pill.lights.dark svg{color:#6a3410;fill:none}
.lightsprompt{position:relative;left:auto;bottom:auto;transform:none;padding:0 4px 0 16px;animation:promptnudge 1.4s ease-in-out infinite}
.lightsprompt::after{content:"";position:absolute;right:-12px;top:50%;margin-top:-8px;border:8px solid transparent;border-left:11px solid var(--table);border-right:0}
@keyframes promptnudge{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}


.topbar,.panel,.floaters,.turn,.shelf{transition:opacity .28s ease,transform .28s ease}
.app.show .topbar,.app.show .panel,.app.show .floaters,.app.show .turn,.app.show .shelf{transition-duration:.6s}
.app.show .topbar{opacity:0;transform:translateY(-16px);pointer-events:none}
.app.show .panel{opacity:0;transform:translateY(26px);pointer-events:none}
.app.show .shelf{opacity:0;pointer-events:none}
.app.show .floaters,.app.show .hint,.app.show .toast,.app.show .turnhint{opacity:0;pointer-events:none}
.app.waking .topbar,.app.waking .panel,.app.waking .floaters{pointer-events:none}
.app.show{background:#06090c}

.stage{transition:transform .32s ease}
.app.show .stage{transform:translate(var(--show-dx,0px),var(--show-dy,0px));transition-duration:.6s}
.stage::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .5s ease;background:linear-gradient(90deg,#06090c 0,rgba(6,9,12,.78) 2.5%,rgba(6,9,12,.35) 5%,rgba(6,9,12,.08) 7.5%,transparent 10%,transparent 90%,rgba(6,9,12,.08) 92.5%,rgba(6,9,12,.35) 95%,rgba(6,9,12,.78) 97.5%,#06090c 100%),linear-gradient(180deg,#06090c 0,rgba(6,9,12,.55) 3%,transparent 9%,transparent 94%,rgba(6,9,12,.7) 100%)}
.app.show .stage::after{opacity:1}
@media (min-aspect-ratio:6/5) and (min-width:700px){
  .app.show .panel{transform:translateX(-26px)}
}
@media (prefers-reduced-motion:reduce){
  .topbar,.panel,.floaters,.stage,.stage::after,.turn,.shelf,.app.show .topbar,.app.show .panel,.app.show .floaters,.app.show .stage{transition:opacity .12s linear}
  .app.show .topbar,.app.show .panel,.app.show .stage{transform:none}
  .lightsprompt{animation:none}
}

@media (max-width:560px){
  .stage{--dock-b:4px;--dock-h:44px;--foot:50px}
  .lightsdock{right:calc(6px + var(--safe-r));gap:12px}
  .btn.pill.lights{padding:0 13px 0 10px;font-size:.98rem;gap:6px}
  .candleprompt{left:calc(6px + var(--safe-l));transform:none;font-size:.98rem;gap:6px;padding-left:10px;animation:promptglow 1.6s ease-in-out infinite}
  .lightsprompt{left:auto;font-size:.95rem;padding-left:12px;animation:promptnudge 1.4s ease-in-out infinite}
  .turn{left:calc(6px + var(--safe-l))}
  @keyframes promptglow{0%,100%{box-shadow:0 6px 20px rgba(0,0,0,.55),0 0 14px rgba(255,200,110,.3)}50%{box-shadow:0 6px 20px rgba(0,0,0,.55),0 0 28px rgba(255,213,138,.8)}}
}
@media (max-width:560px) and (prefers-reduced-motion:reduce){.candleprompt,.lightsprompt{animation:none}}
@media (max-width:359px){
  .candleprompt svg.candle{display:none}
  .btn.pill.lights{padding:0 10px 0 8px;font-size:.92rem}
  .candleprompt{font-size:.92rem}
}


.sizelbl{display:flex;align-items:center;gap:10px}
.sizedot{display:inline-grid;place-items:center;width:64px;height:30px;border-radius:9px;background:rgba(10,6,3,.42);box-shadow:inset 0 1px 3px rgba(0,0,0,.5)}
.sizedot i{display:block;width:var(--dot,8px);height:var(--dot,8px);border-radius:50%;background:var(--table);box-shadow:0 0 0 1px rgba(20,8,2,.6)}
.sizes{flex-wrap:nowrap}
.sizes .size{min-width:44px;flex:1 1 0;padding:0 4px}
.stampbtns{margin-top:6px;flex-wrap:wrap}
.btn.more{width:100%;margin-top:10px;justify-content:center;min-height:48px;background:linear-gradient(#a85f39,#8f4d2c);color:#f5ede0;box-shadow:var(--pressed),0 0 0 2px rgba(255,213,138,.35)}
.btn.more svg{color:#f5ede0;filter:none}
.btn.more .chev{transition:transform .2s;margin-left:2px}
.btn.more[aria-expanded="true"] .chev{transform:rotate(180deg)}
.btn.more[aria-expanded="true"]{background:linear-gradient(var(--clay-hi),#bd7448);color:#2e1608}
.btn.more[aria-expanded="true"] svg{color:var(--engrave)}
.morebox{margin-top:8px;padding:8px 10px 10px;border-radius:12px;background:rgba(10,6,3,.34);box-shadow:inset 0 2px 6px rgba(0,0,0,.45)}
.row.wrap{flex-wrap:wrap}
.row.seg .chip{flex:1}
.morebox .tool.shave{flex-direction:row;gap:7px;min-height:44px;padding:0 14px;font-size:.88rem}
.morebox .chip{min-height:44px}
.morebox .chip svg{width:20px;height:20px}
.depths .chip{flex:1;gap:8px}
.dp{display:block;width:22px;height:22px;border-radius:50%;box-shadow:inset 0 2px 4px rgba(20,8,2,.55),0 1px 0 rgba(255,214,170,.35)}
.dp.d1{background:radial-gradient(circle at 50% 45%,#f0b176,#c97e4c)}
.dp.d2{background:radial-gradient(circle at 50% 45%,#ffdca0,#f0a45e)}
#zoom-read{opacity:.8;font-weight:700}
.zoombar{position:absolute;right:calc(8px + var(--safe-r));top:8px;display:flex;gap:8px;z-index:3}
.zoombar[hidden]{display:none}
.stampbar{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--dock-b) + 62px);display:flex;gap:8px;z-index:4;padding:8px;border-radius:14px;background:rgba(16,22,27,.82);box-shadow:0 6px 18px rgba(0,0,0,.5);max-width:calc(100% - 16px);flex-wrap:wrap;justify-content:center}
.stampbar[hidden]{display:none}
.stampbar .ok{background:linear-gradient(var(--clay-hi),#bd7448);box-shadow:var(--glow)}
.r2d .btn.more,.r2d .morebox,.r2d #opts-shave,.r2d .zoombar,.r2d .stampbar,.r2d #stamp-btns{display:none!important}