:root{--accent: #b5532a;--bg: #faf8f4;--panel: #ffffff;--ink: #1d1b18;--muted: #8a857c;--line: #e7e3da;--radius: 10px;--shadow: 0 1px 2px rgba(0, 0, 0, .04), 0 8px 24px rgba(0, 0, 0, .06);font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink)}*{box-sizing:border-box}body{margin:0;background:var(--bg);-webkit-font-smoothing:antialiased}.app{display:grid;grid-template-columns:320px 1fr;min-height:100vh}.sidebar{background:var(--panel);border-right:1px solid var(--line);padding:24px 22px;display:flex;flex-direction:column;gap:26px;position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto}.brand h1{font-size:15px;letter-spacing:.16em;margin:0;font-weight:700}.brand p{margin:4px 0 0;font-size:12px;color:var(--muted)}.field{display:flex;flex-direction:column;gap:9px}.field>label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}.swatches{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.swatch{position:relative;width:40px;height:40px;border-radius:8px;border:1px solid var(--line);overflow:hidden;cursor:pointer;padding:0}.swatch input{position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;width:150%;height:150%;border:none;cursor:pointer;background:none}.swatch .remove{position:absolute;top:1px;right:1px;width:15px;height:15px;line-height:13px;font-size:12px;border-radius:50%;background:#0000008c;color:#fff;text-align:center;border:none;cursor:pointer;padding:0}.swatch-add{width:40px;height:40px;border-radius:8px;border:1px dashed var(--line);background:transparent;color:var(--muted);font-size:20px;cursor:pointer}.ref-upload{display:inline-block;margin-top:2px;font-size:11.5px;color:var(--accent);cursor:pointer;font-weight:600}.ref-upload input{display:none}.styles{display:grid;grid-template-columns:1fr 1fr;gap:8px}.style-btn{text-align:left;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--panel);cursor:pointer;font-size:12px;font-weight:600;color:var(--ink);transition:border-color .12s,box-shadow .12s}.style-btn small{display:block;font-weight:400;color:var(--muted);margin-top:3px;line-height:1.3}.style-btn[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}select,.text-input{width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel);font:inherit;font-size:13px;color:var(--ink)}.range-row{display:flex;align-items:center;gap:10px}.range-row input[type=range]{flex:1;accent-color:var(--accent)}.range-row b{min-width:18px;text-align:right;font-variant-numeric:tabular-nums}.seed-row{display:flex;gap:8px}.seed-row .text-input{flex:1;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:12px}.btn{border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:9px 12px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;color:var(--ink)}.btn.accent{background:var(--accent);border-color:var(--accent);color:#fff}.btn:active{transform:translateY(1px)}.btn.wide{width:100%;text-align:left;margin-bottom:6px}.btn.companion{display:flex;align-items:center;justify-content:space-between;gap:8px}.btn.companion .dots{display:inline-flex;gap:3px}.btn.companion .dots i{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.12)}.check{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);margin-top:2px;cursor:pointer}.check input{accent-color:var(--accent)}.toolbar{display:flex;align-items:center;gap:12px;margin-bottom:22px}.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}.seg button{border:none;background:var(--panel);padding:8px 16px;font:inherit;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer}.seg button.on{background:var(--accent);color:#fff}.gallery-section{margin-bottom:44px}.wall-surface{position:relative;width:100%;max-width:980px;margin:0 auto;background:#efece6;border-radius:6px;box-shadow:inset 0 0 0 1px #0000000a,inset 0 60px 120px #00000008}.wall-frame{position:absolute;background:#242220;border-radius:1px;box-shadow:0 8px 20px #00000038,0 2px 5px #00000024}.wall-mat{position:absolute;background:#f7f4ef;box-shadow:inset 0 0 0 1px #0000000d}.wall-art{position:absolute;overflow:hidden;box-shadow:inset 0 0 0 1px #0000000f}.wall-art svg{width:100%;height:100%;display:block}.wall-size{position:absolute;bottom:4px;left:50%;transform:translate(-50%);font-size:9px;letter-spacing:.05em;color:#ffffff80;opacity:0;transition:opacity .12s;pointer-events:none}.wall-frame:hover .wall-size{opacity:1}.link-btn{border:none;background:none;color:var(--muted);cursor:pointer;font:inherit;font-size:12px;margin-left:10px;text-decoration:underline}.link-btn:hover{color:var(--accent)}.gallery{padding:28px 32px 60px}.gallery-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:20px;flex-wrap:wrap;gap:8px}.gallery-head h2{margin:0;font-size:18px}.gallery-head .meta{font-size:12px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:24px}.piece{background:var(--panel);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;display:flex;flex-direction:column;gap:12px}.piece .frame{background:var(--panel);border:1px solid var(--line);border-radius:4px;overflow:hidden;display:flex}.piece .frame svg{width:100%;height:auto;display:block}.piece .cap{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted)}.piece .cap code{font-family:ui-monospace,SF Mono,Menlo,monospace}.piece .dl{display:flex;gap:6px}.piece .dl button{flex:1;border:1px solid var(--line);background:var(--panel);border-radius:6px;padding:6px 0;font:inherit;font-size:11px;font-weight:600;letter-spacing:.03em;color:var(--muted);cursor:pointer}.piece .dl button:hover:not(:disabled){color:var(--accent);border-color:var(--accent)}.piece .dl button:disabled{opacity:.5;cursor:default}.actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.actions button{border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:8px 13px;font:inherit;font-size:12px;font-weight:600;color:var(--ink);cursor:pointer}.actions button:first-child{border-color:var(--accent);color:var(--accent)}.actions button:hover:not(:disabled){background:var(--bg)}.actions button:disabled{opacity:.55;cursor:default}
