:root{color-scheme:light;--ink: #191a1d;--muted: #66706b;--paper: #f4efe4;--surface: #fffdf7;--line: #d9d0bf;--terra: #e4572e;--teal: #126f73;--gold: #f0b429;--shadow: 0 24px 80px rgba(25, 26, 29, .16);font-family:Aptos,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(135deg,rgba(228,87,46,.14),transparent 36%),linear-gradient(315deg,rgba(18,111,115,.16),transparent 44%),var(--paper);color:var(--ink)}button,input,textarea{font:inherit}button{min-height:44px;border:0;border-radius:8px;background:var(--ink);color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;font-weight:800}button:hover{transform:translateY(-1px)}button:disabled,input:disabled{opacity:.5;cursor:not-allowed}textarea{width:100%;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);padding:12px;line-height:1.45;resize:vertical}input[type=range]{width:100%;accent-color:#ff0000}input[type=color]{width:40px;height:20px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:2px}.app-shell{min-height:100vh;padding:28px}.workspace{display:grid;grid-template-columns:minmax(300px,400px) minmax(0,1fr);gap:22px;max-width:1240px;margin:0 auto}.controls-panel,.preview-panel{border:1px solid rgba(25,26,29,.12);border-radius:8px;background:#fffdf7eb;box-shadow:var(--shadow)}.controls-panel{display:flex;flex-direction:column;gap:18px;padding:22px}.brand-lockup{display:flex;align-items:center;gap:14px}.brand-mark{width:56px;height:56px;display:grid;place-items:center;border-radius:8px;background:var(--terra);color:#fff;font-weight:950;letter-spacing:0}.eyebrow{margin:0 0 2px;color:var(--teal);font-weight:900;text-transform:uppercase;font-size:.78rem}h1{margin:0;font-size:clamp(1.8rem,2vw,2.35rem);line-height:1}.field{display:grid;gap:8px}.field>span{color:var(--muted);font-size:.84rem;font-weight:800}.field.compact{grid-template-columns:82px 1fr 44px;align-items:center;gap:12px}.field.compact strong{text-align:right;font-size:.9rem}.field.inline{grid-template-columns:1fr auto;align-items:center}.logo-controls{display:grid;gap:12px;border:1px solid var(--line);border-radius:8px;background:#ffffff9e;padding:14px}.logo-actions{display:grid;grid-template-columns:1fr auto;gap:10px}.safety-note{margin:0;color:var(--muted);font-size:.86rem;font-weight:700;line-height:1.35}.frame-controls{display:grid;gap:12px;border:1px solid var(--line);border-radius:8px;background:#ffffff9e;padding:14px}.group-heading{display:flex;align-items:center;gap:8px;color:var(--ink);font-weight:950}.group-heading svg{color:var(--teal)}.toggle-row{display:flex;align-items:center;gap:10px}.toggle-pair{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.toggle-row input{width:20px;height:20px;accent-color:#ff0000}.toggle-row span{color:var(--muted);font-size:.84rem;font-weight:800}.status-card{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:12px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:14px}.status-card svg{color:var(--teal)}.status-card strong,.status-card span{display:block}.status-card strong{margin-bottom:4px}.status-card span{color:var(--muted);line-height:1.35}.button-row{display:grid;grid-template-columns:auto 1fr;gap:10px}.export-control{position:relative;min-width:0}.export-trigger{width:100%}.export-menu{position:absolute;z-index:10;right:0;top:calc(100% + 8px);width:min(220px,100%);display:grid;gap:4px;border:1px solid var(--line);border-radius:8px;background:var(--surface);box-shadow:0 18px 45px #191a1d29;padding:6px}.export-menu button{width:100%;justify-content:flex-start;background:transparent;color:var(--ink);padding:0 12px}.export-menu button:hover{background:#e4572e1a}.secondary{background:#fff;color:var(--ink);border:1px solid var(--line);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.icon-button{width:44px;padding:0;background:var(--gold);color:var(--ink)}.preview-panel{min-height:calc(100vh - 56px);display:grid;grid-template-rows:auto minmax(0,1fr);padding:18px;overflow:hidden}.preview-toolbar{min-height:48px;display:flex;align-items:center;color:var(--muted);font-weight:800}.preview-toolbar p{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.canvas-stage{min-height:0;display:grid;place-items:center;padding:6px}canvas{width:min(100%,calc(100vh - 90px));max-width:920px;aspect-ratio:1;display:block;background:transparent;border-radius:0;box-shadow:0 18px 50px #191a1d2e}canvas.is-rounded{border-radius:24px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:860px){.app-shell{padding:14px}.workspace{grid-template-columns:1fr}.preview-panel{min-height:auto}.canvas-stage{padding:4px 0 0}}@media(max-width:520px){.controls-panel,.preview-panel{padding:14px}.button-row{grid-template-columns:1fr}.export-menu{width:100%}.field.compact{grid-template-columns:1fr}.field.compact strong{text-align:left}canvas{width:100%}}
