*{box-sizing:border-box}body{margin:0;background:#f3f0e9;color:#282321;font:16px system-ui,sans-serif}main{display:flex;min-height:100vh;align-items:center;justify-content:center;gap:25px;padding:20px}.stage{position:relative;width:min(58vw,600px);height:min(90vh,720px);background:radial-gradient(ellipse,#fff 20%,#e5e0d7);border-radius:16px;overflow:hidden}#puppet{position:absolute;width:1800px;height:2000px;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--fit,.3)) scaleY(var(--height,1));transform-origin:center center}.joint{position:absolute;inset:0;pointer-events:none}.layer{position:absolute;object-fit:fill;user-select:none;pointer-events:none}.joint-head{transform-origin:900px 760px}.joint-leftArm{transform-origin:540px 875px}.joint-rightArm{transform-origin:1250px 875px}.joint-leftLeg{transform-origin:825px 1340px}.joint-rightLeg{transform-origin:990px 1340px}aside{width:300px}h1{font-size:22px}small{font-size:12px}p{line-height:1.4}.controls{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}button{border:1px solid #aaa;border-radius:8px;background:white;padding:11px;cursor:pointer}button:hover{background:#e5defa}label{display:block;margin:16px 0}input{width:100%}.note{font-size:13px;color:#6d665f}body.embed{background:transparent}body.embed main{padding:0;min-height:100vh}body.embed .stage{width:100vw;height:100vh;background:transparent;border-radius:0}body.embed aside{display:none}@media(max-width:750px){main{flex-direction:column}.stage{width:100%;height:65vh}aside{width:100%}}