*{box-sizing:border-box}body{margin:0;background:#f3f3ed;color:#28493a;font:15px/1.65 system-ui,-apple-system,sans-serif}main{max-width:1160px;margin:auto;padding:24px 28px 34px}a{color:#446d53;text-underline-offset:4px}nav{display:flex;gap:24px;font-size:13px;margin-bottom:22px}header{display:flex;justify-content:space-between;align-items:center;gap:20px}h1{font-size:31px;line-height:1.35;margin:0;letter-spacing:-.02em}.eyebrow{font-size:11px;letter-spacing:.16em;color:#85917a;margin:0 0 7px}.badge{background:#e5ecdf;border:1px solid #d5dfce;padding:6px 13px;border-radius:99px;font-size:12px;white-space:nowrap}.intro{color:#7a8774;margin:10px 0 23px}.layout{display:grid;grid-template-columns:minmax(0,620px) minmax(310px,1fr);gap:32px;align-items:start}.stage{position:relative;width:100%;max-width:calc(100svh - 265px);aspect-ratio:1;overflow:hidden;isolation:isolate;border-radius:16px;background:#ff00ff;box-shadow:0 8px 28px #263b2610}video,.overlay{display:block;width:100%;height:100%;object-fit:contain}.overlay{position:absolute;inset:0;pointer-events:none}.wall{position:absolute;inset:0 0 0 58.3%;background:linear-gradient(100deg,#d6ded5,#c6d2c8 60%,#b9c7bf);border-left:4px solid #6f857c;box-shadow:-1px 0 3px #24382c33}.wall:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:#e9eee7}.no-wall .wall{display:none}.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:16px 0 10px}button{font:inherit;font-size:13px;border:1px solid #cdd8c6;border-radius:8px;padding:8px 12px;background:#fbfcf6;color:#42664d;cursor:pointer}button:hover{background:#e9efdf}.toolbar label{font-size:13px;color:#72826c;margin-left:8px;display:flex;gap:6px;align-items:center}input{accent-color:#456f55}.timeline{display:flex;align-items:center;gap:15px}.timeline input{flex:1;min-width:0}output{font-size:12px;color:#85907f;font-variant-numeric:tabular-nums;min-width:92px}.quiet{font-size:12px;color:#8a947f;margin:8px 0 0}.design-card{background:#fffefa;border:1px solid #dce3d5;border-radius:18px;padding:25px 22px;display:flex;gap:25px;align-items:center;box-shadow:0 9px 27px #263b2607}.paper{width:145px;aspect-ratio:1/2;flex:0 0 auto;background:linear-gradient(112deg,#e9ba56,#f5d577 55%,#e9bd5e);border:1px solid #b68d47;box-shadow:1px 5px 10px #593e1816;border-radius:1px;transform:rotate(-3deg)}.paper svg{display:block;width:100%;height:100%}.design-copy h2{font-size:21px;line-height:1.6;font-weight:550;margin:0 0 12px}.design-copy p{font-size:13px;color:#89917c}.colors{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.colors button{padding:7px 10px;font-size:12px}.colors button[aria-pressed=true]{background:#e9efdf;border-color:#90a382}.colors i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px}.meaning{color:#7b8873;font-size:13px;line-height:1.9;margin:22px 4px 16px}.links{display:flex;gap:20px;margin:0 4px 20px;font-size:13px}details{font-size:12px;color:#8a937d;margin:0 4px}summary{cursor:pointer}details p{margin:10px 0}@media(max-width:900px){main{padding:20px}.layout{grid-template-columns:1fr}.stage{max-width:560px}aside{max-width:620px}.design-card{justify-content:center}.design-copy{max-width:190px}h1{font-size:26px}.badge{font-size:11px}.toolbar label{margin-left:0}}@media(max-width:450px){.design-card{gap:18px;padding:20px 16px}.paper{width:128px}header{align-items:start}h1{font-size:23px}.badge{white-space:normal;max-width:108px}}

#scene{display:block;width:100%;height:100%;background:#ff00ff url(poster.webp) center/contain no-repeat}.stage{max-width:min(620px,calc(100svh - 320px))}.zoom-card{border-radius:16px;border:1px solid #dce3d5;background:#fffefa;overflow:hidden;margin-bottom:18px}.zoom-heading{display:flex;justify-content:space-between;padding:10px 16px;font-size:12px;color:#7d8875}#detail{display:block;width:100%;height:auto;max-height:300px;object-fit:contain;background:#edf0e7}.design-card{padding:18px;gap:20px}.paper{width:95px}.design-copy h2{font-size:18px;line-height:1.4}.design-copy p{margin:8px 0}.colors{margin-top:12px}.frame-tools{display:flex;align-items:center;gap:8px;margin:12px 0 0}.frame-tools label{margin-left:auto;font-size:12px;color:#71806a}select{border:1px solid #cdd8c6;padding:6px 8px;border-radius:7px;background:#fffefa;color:#42664d}button:disabled,input:disabled{opacity:.4;cursor:wait}.timeline output{min-width:110px}.meaning{margin:15px 4px 10px}.links{margin-bottom:12px}@media(max-width:900px){.stage{max-width:620px}.zoom-card{max-width:400px}.layout{gap:24px}}

.stage,#detail{background-color:#edf0e7;background-image:conic-gradient(#cbd2c7 25%,transparent 0 50%,#cbd2c7 0 75%,transparent 0);background-size:32px 32px}#scene{background:transparent url(poster.webp) center/contain no-repeat}.stage.small{max-width:240px}.paper img{display:block;width:100%;height:100%}.backgrounds{display:flex;gap:8px;margin:10px 0}.backgrounds [aria-pressed=true],#small[aria-pressed=true]{background:#e1ead8;border-color:#90a382}body[data-bg=forest] .stage,body[data-bg=forest] #detail{background:#172e25}body[data-bg=white] .stage,body[data-bg=white] #detail{background:#fff}body[data-bg=black] .stage,body[data-bg=black] #detail{background:#050605}

.idle-note{padding:22px;border:1px solid #dce3d5;border-radius:16px;background:#fffefa}.idle-note h2{font-size:19px;margin:0 0 10px}.idle-note p{color:#7b8873}.idle-note .links{flex-wrap:wrap;margin:18px 0 0}