*{box-sizing:border-box}body{margin:0;background:#f8f5ef;color:#332d29;font:15px/1.6 system-ui,-apple-system,sans-serif}main{max-width:1200px;margin:auto;padding:28px 36px 24px}.back{color:#6a746b;text-decoration:none;font-size:13px}.back:hover{text-decoration:underline}header{margin:26px 0}.eyebrow{font-size:11px;letter-spacing:.2em;color:#8c755f;margin:0 0 8px}h1{font-size:30px;font-weight:600;letter-spacing:-.03em;line-height:1.3;margin:0 0 9px}.intro{color:#81766c;margin:0}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 248px;gap:28px;align-items:start}.viewer{min-width:0}.stage{height:min(65vh,610px);min-height:360px;background:radial-gradient(ellipse at 42% 30%,#fffdf8 0%,#f1e9dc 68%,#e9decc 100%);border:1px solid #e4dacb;border-radius:22px;overflow:hidden;box-shadow:inset 0 0 60px #fff6}canvas{width:100%;height:100%;display:block;touch-action:pan-y;cursor:default}canvas.interactive{touch-action:none;cursor:grab}canvas.interactive:active{cursor:grabbing}#status{text-align:center;color:#8a7c6d;font-size:12px;min-height:20px;margin:13px 0}.view-actions{display:flex;justify-content:center;gap:8px}.controls{background:#fffcf7;border:1px solid #e7ded2;border-radius:18px;padding:22px;display:grid;gap:25px}label{display:grid;gap:10px;font-size:13px;color:#716657}select,button{min-height:44px;border:1px solid #ded4c6;border-radius:10px;padding:10px 13px;background:#fffdf8;color:#4f574d;font:inherit;cursor:pointer;transition:background .15s,border-color .15s}select{width:100%;font-size:14px;min-width:0}button:hover{border-color:#6f8b76;background:#f4f5ed}button:disabled{opacity:.45;cursor:wait}fieldset{display:grid;grid-template-columns:1fr 1fr;gap:8px;border:0;margin:0;padding:0;min-width:0}legend{font-size:13px;color:#716657;padding:0 0 12px}fieldset button{font-size:13px;padding:13px 4px}fieldset button::before{content:'';display:block;width:30px;height:30px;margin:0 auto 8px;border-radius:9px;box-shadow:inset 0 1px 2px #fff9,0 2px 4px #78634b18;background:linear-gradient(145deg,#edb8a0,#cc8a76)}fieldset [data-mode=glitter]::before{background:radial-gradient(circle at 30% 25%,#fff7bd 0 2px,transparent 3px),radial-gradient(circle at 72% 60%,white 0 1px,transparent 2px),radial-gradient(circle at 30% 80%,#ffeac1 0 1px,transparent 2px),linear-gradient(140deg,#b59aa6,#9d758d)}fieldset [data-mode=beads]::before{border-radius:50%;background:radial-gradient(circle,#78645b 0 22%,#d5b397 25%,#eed0b5 34%,#d4aa89 70%)}button[aria-pressed=true]{background:#edf2e9;border-color:#77907a;color:#305642}#save{background:#315d4b;border-color:#315d4b;color:white;font-size:13px}#save:hover{background:#234b3a}.lighting input{width:100%;accent-color:#577c61;cursor:ew-resize;min-height:26px;margin:0}.note{font-size:11px;line-height:1.8;color:#948777;margin:0}#error{font-size:13px;color:#ad473d}canvas:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #be8e53;outline-offset:3px}[hidden]{display:none!important}@media(max-width:720px){main{padding:18px 16px}.workspace{grid-template-columns:1fr;gap:20px}header{margin:22px 0}h1{font-size:24px}.stage{height:47vh;min-height:310px}.controls{padding:18px;gap:18px}fieldset{grid-template-columns:repeat(4,1fr)}fieldset button{font-size:12px}.note{font-size:12px}.view-actions button{font-size:13px}#save{min-height:48px}}@media(prefers-reduced-motion:reduce){button,select{transition:none}}
fieldset [data-mode=towel]::before{background:repeating-linear-gradient(73deg,transparent 0 3px,#ae816b55 4px 5px,transparent 6px 9px),repeating-linear-gradient(112deg,#ead0b9 0 3px,#d2ac8c 4px 6px,#e5c3a6 7px 9px);border-radius:9px}fieldset [data-mode=glitter]::before{background:radial-gradient(circle at 25% 30%,#fff9dd 0 1px,transparent 2px),radial-gradient(circle at 68% 70%,#fff 0 1px,transparent 2px),repeating-conic-gradient(#a48f9c 0% 25%,#c1aab8 0% 50%) 0/5px 5px}@media(max-width:720px){fieldset{grid-template-columns:repeat(2,minmax(0,1fr))}}

.lighting{display:grid;gap:8px;font-size:13px;color:#716657}.light-guide{display:flex;align-items:center;gap:10px}.light-dial{width:104px;height:104px;flex:none;background:#faf4e9;border-radius:50%}.light-orbit{fill:none;stroke:#d9cbb6;stroke-dasharray:3 5}.light-ticks{stroke:#c4b59f;stroke-width:1.5}.light-piece{fill:#dba58b;stroke:#bd876e}.light-ray,.light-rays{fill:none;stroke:#bb8539;stroke-width:1.8;stroke-linecap:round}.light-sun{fill:#f4cc73;stroke:#bb8539;stroke-width:1.5}.light-reading{display:grid;gap:6px;min-width:0}.light-reading output{font-weight:600;color:#665038;font-size:12px}.light-reading output span{display:block;color:#9c7439;font-variant-numeric:tabular-nums}.light-reading #light-hint{font-size:10px;line-height:1.7;color:#92816e}.light-range-labels{display:flex;justify-content:space-between;margin-top:-7px;color:#a09280;font-size:10px;font-variant-numeric:tabular-nums}