:root{--ink:#30352f;--soft:#727767;--paper:#f7f5ed;--line:#dcded0;--green:#465d51;--rose:#ab6659}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,select,input{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:#fffdf6;border-radius:8px;padding:9px 12px;color:var(--ink);transition:background .15s,transform .15s}button:hover{background:#e9eddf}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8ba98e;outline-offset:3px}button:disabled{opacity:.35;cursor:default}header{display:flex;align-items:center;justify-content:space-between;max-width:1280px;margin:auto;padding:24px 34px;border-bottom:1px solid var(--line)}.brand{font:40px/1 Georgia,serif;text-decoration:none;color:var(--ink);letter-spacing:-2px}.brand span{color:var(--rose)}.brand small{display:block;font:8px/1.5 sans-serif;letter-spacing:2.6px;margin-top:9px}.header-right{display:flex;align-items:center;gap:28px;color:var(--soft);font-size:12px}.header-right button{border:0;background:none;padding-right:0;font-size:13px}main{max-width:1280px;margin:auto;padding:0 34px}.intro{display:flex;align-items:center;justify-content:space-between;padding:40px 0 35px}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:700;color:var(--soft);margin:0 0 10px}h1{font:58px/.99 Georgia,serif;letter-spacing:-2px;margin:0}h1 em{font-weight:normal;color:var(--rose)}.intro-copy{padding-right:36px;color:var(--soft);font-size:14px}.steps{display:flex;gap:28px;font-size:10px;margin-top:24px;color:#a48d73}.steps b{color:var(--green);font-size:11px;margin-left:6px;font-weight:500}.workshop{display:grid;grid-template-columns:minmax(0,1.46fr) minmax(300px,1fr);gap:26px;align-items:start}.left,.maker,.shelf{background:#fffdf7;border:1px solid var(--line);border-radius:13px;padding:22px}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}h2{font:23px/1.2 Georgia,serif;letter-spacing:-.4px;margin:0}.panel-heading .eyebrow{font-size:8px;margin-bottom:6px}.tag{font-size:10px;border:1px solid var(--line);padding:5px 9px;border-radius:20px;color:var(--soft)}#stage-wrap{width:100%;aspect-ratio:1;background:url('mat.webp') center/cover;border-radius:8px;overflow:hidden;position:relative;box-shadow:inset 0 0 0 1px #d7cbb83d}.canvas-container{touch-action:none}.stage-note{position:absolute;bottom:13px;left:0;width:100%;text-align:center;pointer-events:none;font-size:7px;letter-spacing:2px;color:#9b9485}canvas{touch-action:none}.stage-tools{display:flex;gap:6px;margin-top:14px}.stage-tools button{font-size:10px;padding:8px 10px}.stage-tools button:last-child{margin-left:auto}.hint-line{font-size:11px;min-height:30px;color:var(--soft);margin:12px 0}.starters{display:flex;gap:6px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:16px}.starters>span{width:100%;font-size:8px;margin:0 0 2px}.starters button{font-size:10px;padding:7px 9px}.dot{width:9px;height:9px;border-radius:50%;background:#c3b281}.select-label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;color:var(--soft);border-top:1px solid var(--line);padding-top:14px}select{max-width:185px;border:1px solid var(--line);border-radius:6px;background:#fffdf7;padding:6px;font-size:11px;color:var(--ink)}.shape-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:16px 0}.shape-buttons button{font-size:11px;padding:9px}.shape-buttons button.active{background:var(--green);color:white;border-color:var(--green)}.swatches{display:flex;gap:12px;margin:20px 0 24px}.swatches button{height:25px;width:25px;border-radius:50%;padding:0;background-image:url('paper.webp');background-size:200% 200%;box-shadow:0 1px 3px #0002}.swatches button:nth-child(1){background-position:0 0}.swatches button:nth-child(2){background-position:100% 0}.swatches button:nth-child(3){background-position:0 100%}.swatches button:nth-child(4){background-position:100% 100%}.swatches button.active{outline:2px solid var(--green);outline-offset:4px}.maker label:not(.select-label){display:block;font-size:11px;font-weight:500;margin-top:18px}output{float:right;color:var(--rose);font-size:10px}input[type=range]{width:100%;height:20px;margin:8px 0 0;accent-color:var(--green);cursor:pointer}.micro{font-size:10px;line-height:1.5;color:var(--soft);margin:10px 0}.two-controls{display:grid;grid-template-columns:1fr 1fr;gap:18px}.maker-footer{border-top:1px solid var(--line);margin-top:20px;padding-top:16px;display:flex;align-items:center;justify-content:space-between;gap:10px}.maker-footer span{font-size:9px;color:var(--soft)}.maker-footer button{font-size:10px}.shelf{margin-top:18px;padding:20px}.shelf h2{font-size:21px}.primary{width:100%;background:var(--green);color:#fff;border-color:var(--green);font-size:11px;margin:8px 0}.primary:hover{background:#344d3f}.saved{display:flex;gap:6px;align-items:center;padding:9px 0;border-bottom:1px solid #e7e8dd}.saved button:first-child{text-align:left;flex:1;font-size:10px}.saved button:last-child{font-size:10px;border:0;padding:8px}footer{display:flex;justify-content:space-between;gap:25px;padding:35px 0;color:#8d9082;font-size:9px}footer a{color:var(--green)}#guide{margin-top:24px;background:#e8ecdf;padding:24px;border-radius:12px}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;font-size:12px;color:var(--soft)}#guide[hidden]{display:none}@media(max-width:780px){header{padding:20px}.header-right>span{display:none}.brand{font-size:34px}main{padding:0 16px}.intro{padding:30px 4px;gap:12px}h1{font-size:43px}.intro-copy{font-size:11px;padding:0;max-width:165px}.intro-copy br{display:none}.steps{gap:10px;margin-top:15px;font-size:8px}.steps b{font-size:9px;margin-left:3px}.workshop{grid-template-columns:1fr;gap:16px}.left{padding:15px}.maker,.shelf{padding:18px}.panel-heading{margin-bottom:13px}h2{font-size:21px}.stage-tools button{font-size:10px;padding:8px}.hint-line{margin:9px 0;min-height:20px}.starters button{font-size:9px}.guide-grid{grid-template-columns:1fr;gap:0}footer{flex-direction:column;gap:8px;padding:28px 0}.stage-note{font-size:6px}.maker .two-controls{margin-top:0}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.left,aside,.maker{min-width:0}#stage-wrap{min-width:0;contain:inline-size}.canvas-container{max-width:100%}.curl-preview{width:120px;height:125px;background:url('mat.webp') center/cover;border-radius:8px;text-align:center;flex:none}.curl-preview canvas{width:120px;height:110px;display:block}.curl-preview span{font-size:6px;letter-spacing:1px;color:#827b6d}.maker>.panel-heading{margin-bottom:10px}.maker>.panel-heading h2{max-width:160px}@media(max-width:780px){.intro-copy{max-width:150px}.intro h1{font-size:39px}.intro{align-items:flex-end}.curl-preview{width:110px;height:115px}.curl-preview canvas{width:110px;height:100px}}

.curl-preview span{display:block;line-height:12px;height:12px}
