:root{--bg:#f4f6f9;--card:#fff;--ink:#1c2430;--muted:#6b7686;--accent:#2f6bff;--line:#dde2ea}@media(prefers-color-scheme:dark){:root{--bg:#12161c;--card:#1b222c;--ink:#e8edf4;--muted:#93a0b2;--line:#2a3340}}*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif;background:var(--bg);color:var(--ink)}a{color:var(--accent);text-decoration:none}.top{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:var(--card);border-bottom:1px solid var(--line)}.top nav{display:flex;gap:14px;align-items:center}.brand{font-weight:700;color:var(--ink);font-size:1.1rem}main{max-width:1200px;margin:0 auto;padding:20px 16px 60px}.center{text-align:center;margin-top:40px}.muted{color:var(--muted);font-size:.9rem}.error{color:#d33}.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}.narrow{max-width:380px;margin:30px auto;display:flex;flex-direction:column;gap:12px}label{display:flex;flex-direction:column;gap:4px;font-size:.9rem;margin-bottom:10px}label.check{flex-direction:row;align-items:center;gap:8px}input,select,textarea{padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font:inherit}input[type=color]{padding:2px;height:36px}button,.btn{padding:9px 14px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;font:inherit;display:inline-block}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button:disabled{opacity:.6;cursor:wait}button.link{border:none;background:none;color:var(--accent);padding:0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:24px}.product{display:flex;flex-direction:column;gap:6px;color:var(--ink);transition:transform .1s}.product:hover{transform:translateY(-2px);border-color:var(--accent)}.product .icon{font-size:2rem}.list{display:flex;flex-direction:column;gap:10px}.row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.actions{display:flex;gap:8px;flex-wrap:wrap}.badge{font-size:.75rem;padding:2px 8px;border-radius:20px;background:var(--line)}.badge.sent{background:#1f9d55;color:#fff}.editor{display:grid;grid-template-columns:340px 1fr;gap:20px;align-items:start}@media(max-width:820px){.editor{grid-template-columns:1fr}}.panel{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}.panel h2{margin-top:0}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.preview{display:flex;flex-direction:column;gap:12px}.toolbar{display:flex;gap:16px;align-items:center;flex-wrap:wrap;min-height:24px}.toolbar label{margin:0}.viewer{width:100%;height:clamp(240px,42vh,440px);border-radius:12px;overflow:hidden;border:1px solid var(--line)}.viewer canvas{display:block}.price .total{font-size:1.6rem;font-weight:700}.price .total small{font-size:.75rem;font-weight:400;color:var(--muted)}.params{background:var(--bg);padding:10px;border-radius:8px;font-size:.75rem;max-height:200px;overflow:auto}.tabs{display:flex;gap:6px;margin:6px 0 10px}.tabs button{flex:1}.tabs button.on{background:var(--accent);border-color:var(--accent);color:#fff}.item{border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:10px;background:var(--bg)}.item-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.item-head button{padding:2px 8px}.two>label,.item label{min-width:0}input[type=range]{width:100%;min-width:0}.layout2d{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px}.layout2d svg{width:100%;max-height:26vh;display:block;background:repeating-conic-gradient(#e9edf3,#e9edf3 25%,#f6f8fb 0%,#f6f8fb 50%) 50% / 12px 12px;border-radius:8px}.item.sel{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}@media(min-width:821px){.preview{position:sticky;top:12px;align-self:start;max-height:calc(100vh - 24px);overflow-y:auto}}.warn{color:#d98a00;font-size:.8rem;display:block;margin-bottom:10px}