:root{--paper:#f3eee3;--panel:#fbf7ee;--ink:#292820;--green:#294b3d;--brass:#a98543;--line:#d8cbb6;--muted:#6c675e;--shadow:0 12px 25px rgba(53,42,23,.06)}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--paper);color:var(--ink);font-family:Georgia,'Times New Roman',serif}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}.studio{max-width:1580px;margin:auto;padding:15px 8px 35px}.intro{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:0 0 18px}.eyebrow{color:var(--brass);font:700 .66rem/1.2 system-ui,sans-serif;letter-spacing:.13em;text-transform:uppercase}.intro h1{font-size:1.75rem;font-weight:500;margin:5px 0 3px;color:var(--green)}.intro p{margin:0;color:var(--muted);font-style:italic}.intro-note{max-width:350px;color:var(--muted);font:400 .76rem/1.5 system-ui,sans-serif;text-align:right}.workspace{display:grid;grid-template-columns:minmax(0,1.93fr) minmax(305px,1fr);gap:15px;align-items:start}.main-area{min-width:0}.template-section{margin-bottom:14px}.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:0 0 8px}.section-heading h2{font-size:1rem;font-weight:600;margin:0}.section-heading span{font:500 .68rem system-ui,sans-serif;color:var(--muted)}.templates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.template-card{display:flex;align-items:center;gap:10px;min-width:0;padding:6px;border:1px solid var(--line);border-radius:6px;background:var(--panel);text-align:left;color:var(--ink)}.template-card img{width:90px;aspect-ratio:3/2;object-fit:cover;border-radius:3px}.template-card span{font-weight:600}.template-card small{display:block;margin-top:4px;color:var(--muted);font:400 .7rem system-ui,sans-serif}.template-card.active{border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}.template-card:hover,.surface-button:hover{border-color:var(--brass)}.preview-card,.side-panel{border:1px solid var(--line);border-top:3px solid var(--green);border-radius:7px;background:var(--panel);box-shadow:var(--shadow);overflow:hidden}.preview-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px}.preview-top h2{font-size:1.13rem;margin:4px 0 0}.secondary{padding:8px 11px;border:1px solid #c8b99e;border-radius:4px;background:#fffbf3;color:var(--green);font-weight:600;font-size:.8rem}.preview-stage{position:relative;width:100%;aspect-ratio:3/2;background:#e8e0d2}.preview-stage canvas{display:block;width:100%;height:100%;cursor:crosshair}.preview-stage.empty{display:grid;place-items:center;background:linear-gradient(145deg,#fbf8f0,#eee7d9)}.empty-state{max-width:480px;text-align:center;padding:30px}.empty-ornament{display:block;color:var(--brass);font-size:2rem}.empty-state h3{color:var(--green);font-size:1.5rem;font-weight:500;margin:5px 0}.empty-state em{font-size:1rem}.empty-state p{color:var(--muted);font:400 .83rem/1.6 system-ui,sans-serif}.preview-note{padding:10px 14px;margin:0;color:var(--muted);font:400 .7rem/1.4 system-ui,sans-serif}.side-panel{padding:15px;max-height:calc(100dvh - 110px);overflow-y:auto;scrollbar-color:#bbaa8d transparent}.side-heading h2{margin:4px 0;font-size:1.18rem}.side-heading p{margin:0 0 14px;color:var(--muted);font:400 .76rem/1.4 system-ui,sans-serif}.surface-list{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:14px}.surface-button{min-height:39px;padding:8px 10px;border:1px solid var(--line);border-radius:4px;background:#fffaf1;color:var(--ink);text-align:left;font-size:.8rem}.surface-button.selected{border-color:var(--green);background:#e7ece5;color:var(--green);font-weight:700}.surface-button small{display:block;margin-top:2px;color:var(--muted);font:400 .64rem system-ui,sans-serif}.editor{padding:13px 0;border-top:1px solid var(--line)}.editor-heading h3{margin:3px 0 12px;font-size:1.15rem}.mode-picker{display:flex;flex-wrap:wrap;gap:5px;padding:0;margin:0 0 12px;border:0}.mode-picker legend{font-weight:600;margin-bottom:7px}.mode-picker label{display:flex;align-items:center;gap:4px;padding:7px 8px;border:1px solid var(--line);border-radius:4px;background:#fffcf5;font:600 .73rem system-ui,sans-serif;cursor:pointer}.mode-picker input{accent-color:var(--green)}.finish-controls{display:grid;gap:11px}.finish-controls label{display:grid;gap:5px;font:600 .75rem system-ui,sans-serif}.finish-controls input[type=text],.finish-controls select{width:100%;padding:8px;border:1px solid var(--line);border-radius:3px;background:#fffdf7}.finish-controls input[type=color]{width:56px;height:34px;padding:2px;border:1px solid var(--line);background:#fffdf7}.finish-controls input[type=range]{width:100%;accent-color:var(--brass)}.finish-controls output{float:right;color:var(--green)}.position-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.text-button{justify-self:start;border:0;background:transparent;color:var(--green);text-decoration:underline;text-underline-offset:3px;font:600 .75rem system-ui,sans-serif;padding:4px 0}.library{padding-top:13px;border-top:1px solid var(--line)}.pattern-drop{display:grid;gap:4px;place-items:center;text-align:center;padding:17px;border:1px dashed #b7a98f;border-radius:5px;background:#fffaf1;cursor:pointer}.pattern-drop.drag{border-color:var(--green);background:#e8efe7}.pattern-drop strong{font-size:.85rem}.pattern-drop span,.muted{color:var(--muted);font:400 .72rem/1.4 system-ui,sans-serif}.pattern-drop button{margin-top:7px}.pattern-library{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:11px}.pattern-library .muted{grid-column:1/-1}.pattern-tile{border:1px solid var(--line);padding:4px;border-radius:4px;background:#fffdf7;text-align:left;min-width:0;color:var(--ink)}.pattern-tile img{display:block;width:100%;aspect-ratio:1;object-fit:cover}.pattern-tile span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 .66rem system-ui,sans-serif;margin:4px 2px 0}.pattern-tile.active{border-color:var(--green)}@media(max-width:800px){.workspace{grid-template-columns:1fr}.side-panel{max-height:none}.intro-note{display:none}}@media(max-width:520px){.studio{padding:10px 5px}.template-card img{width:68px}.template-card span{font-size:.78rem}.surface-list{grid-template-columns:1fr 1fr}.preview-top{flex-wrap:wrap}.preview-stage{aspect-ratio:3/2}}