.moire-page{padding:clamp(34px,5vh,70px) 0 clamp(80px,11vw,160px)}
.moire-header{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.4fr);gap:32px;align-items:end;padding-bottom:22px;border-bottom:1px solid var(--ink)}
.moire-header h1{margin:0;font-size:clamp(55px,8.5vw,126px);font-weight:800;letter-spacing:-.07em;line-height:.76}
.moire-header>p{max-width:360px;margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.moire-workspace{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(290px,.5fr);gap:clamp(28px,5vw,76px);align-items:start;margin-top:clamp(34px,5vw,68px)}
.moire-stage{align-self:start;padding:0 clamp(10px,1.5vw,18px) clamp(10px,1.5vw,18px);background:#ded9d0}
.moire-canvas{position:relative;aspect-ratio:1;overflow:hidden;background:#f5efe4;box-shadow:0 18px 45px rgba(31,27,22,.08);cursor:grab;outline:none;touch-action:auto}
.moire-canvas.is-gesturing{cursor:grabbing;touch-action:none;user-select:none}
.moire-canvas svg{display:block;width:100%;height:100%}
.moire-selection{pointer-events:none}
.moire-selection rect,.moire-selection circle{fill:none;stroke:#fff;stroke-width:4;stroke-dasharray:10 9;opacity:.76;vector-effect:non-scaling-stroke}
.moire-selection path{fill:none;stroke:#fff;stroke-width:2;opacity:.62;vector-effect:non-scaling-stroke}
.moire-panel{min-width:0;max-width:390px;align-self:start}
.moire-actions{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:20px}
.moire-action-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:16px;width:100%;align-items:end}
.moire-actions button,.moire-downloads button,.moire-center-actions button{border:0;border-bottom:1px solid currentColor;border-radius:0;background:transparent;padding:5px 0;color:var(--muted);font:inherit;font-size:13px;cursor:pointer;text-align:left}
.moire-actions .moire-primary{color:var(--ink);font-size:18px;font-weight:700}
.moire-actions button:hover,.moire-downloads button:hover,.moire-center-actions button:hover{color:var(--ink)}
.moire-actions button:disabled{cursor:not-allowed;opacity:.35}
.moire-utility-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:13px}.moire-utility-row button{font-size:11px}.moire-utility-row button.is-active{color:var(--ink);font-weight:700}
.moire-controls{border-top:1px solid var(--ink)}
.moire-layer-bar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto auto;gap:5px;padding:12px 0;border-bottom:1px solid var(--line)}
.moire-layer-bar button{min-width:0;border:1px solid var(--line);background:transparent;padding:8px 5px;color:var(--muted);font:inherit;font-size:10px;cursor:pointer}.moire-layer-bar button[aria-selected=true]{border-color:var(--ink);background:var(--ink);color:#fff}.moire-layer-bar button[hidden]{display:none}.moire-layer-bar .moire-layer-add,.moire-layer-bar .moire-layer-remove{font-size:16px;line-height:1}
.moire-page [hidden]{display:none!important}
.moire-section{border-bottom:1px solid var(--line)}
.moire-section summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:pointer;padding:11px 0;color:var(--muted);font-size:11px;letter-spacing:.07em;text-transform:uppercase}.moire-section summary::-webkit-details-marker{display:none}.moire-section summary::after{content:'+';color:var(--muted);font-size:16px;font-weight:400;line-height:1}.moire-section[open] summary{color:var(--ink)}.moire-section[open] summary::after{content:'−'}.moire-section summary:focus-visible{outline:2px solid var(--ink);outline-offset:4px}.moire-section summary output{margin-left:auto;color:var(--ink);font-size:10px;letter-spacing:0}
.moire-section-body{padding:0 0 11px}.moire-controls label{display:block;margin:0 0 9px;color:var(--muted);font-size:12px}.moire-controls label:last-child{margin-bottom:0}.moire-controls label>span{display:flex;justify-content:space-between;gap:8px;margin-bottom:6px}.moire-controls output{color:var(--ink);font-variant-numeric:tabular-nums}.moire-controls select{width:100%;border:1px solid var(--line);border-radius:0;background:transparent;padding:8px;color:var(--ink);font:inherit;font-size:12px}.moire-controls input[type=range]{display:block;width:100%;accent-color:var(--ink)}
.moire-inline-controls{display:grid;grid-template-columns:1fr 1fr;gap:12px}.moire-inline-controls label{min-width:0}.moire-inline-controls input[type=color]{display:block;width:100%;height:32px;padding:2px;border:1px solid var(--line);border-radius:0;background:transparent;cursor:pointer}.moire-inline-controls .moire-check{display:flex;align-items:center;justify-content:space-between;gap:8px}.moire-inline-controls .moire-check input{width:auto;accent-color:var(--ink)}
.moire-hybrid-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 9px}.moire-hybrid-fields label{margin:0}.moire-center-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:13px}.moire-center-actions button{text-align:center;border:1px solid var(--line);padding:8px}.moire-center-actions button:hover{border-color:var(--ink)}
.moire-export-section{border-top:1px solid var(--ink)}.moire-export-options{display:grid;grid-template-columns:1fr;gap:10px}.moire-export-options label{display:flex;align-items:center;justify-content:space-between;margin:0;color:var(--muted);font-size:11px}.moire-export-options select{border:1px solid var(--line);border-radius:0;background:transparent;padding:7px;color:var(--ink);font:inherit;font-size:11px}.moire-downloads{display:flex;align-items:center;gap:18px;margin-top:15px;padding-top:12px;border-top:1px solid var(--ink)}
.moire-status{min-height:1.4em;margin:10px 0 0;color:var(--muted);font-size:11px}.moire-help{margin:12px 0 0;color:var(--muted);font-size:11px;line-height:1.5}
.moire-controls button:focus-visible,.moire-controls select:focus-visible,.moire-controls input:focus-visible,.moire-actions button:focus-visible,.moire-downloads button:focus-visible,.moire-center-actions button:focus-visible,.moire-canvas:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
@media(max-width:850px){.moire-workspace{grid-template-columns:1fr}.moire-panel{max-width:660px}}
@media(max-width:700px){.moire-page{padding-top:36px}.moire-header{grid-template-columns:1fr;gap:20px}.moire-header h1{font-size:clamp(58px,18vw,90px)}.moire-stage{width:100%;margin-left:0}.moire-panel{margin-top:7px}.moire-layer-bar{grid-template-columns:repeat(4,minmax(0,1fr)) auto auto}.moire-action-grid{gap:12px}.moire-inline-controls,.moire-hybrid-fields{gap:8px}}
@media(prefers-reduced-motion:reduce){.moire-canvas svg{animation:none!important}}