:root{color:#f5f5f3;background:#111;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#111}button,input,select,textarea{font:inherit}button{border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#242424;color:#f8f7f2;cursor:pointer}button:hover{background:#303030}.app-shell{display:grid;grid-template-columns:360px minmax(0,1fr);min-height:100vh}.control-panel{height:100vh;overflow-y:auto;border-right:1px solid rgba(255,255,255,.1);background:#171717;padding:22px}.brand{display:flex;gap:14px;align-items:center;margin-bottom:22px}.brand-mark{display:grid;width:48px;height:48px;place-items:center;border-radius:8px;background:#e51a2f;color:#fff;font-weight:900}.brand h1,.workspace-header h2{margin:0;font-size:20px;letter-spacing:0}.brand p,.hint,.eyebrow{margin:4px 0 0;color:#aaa59b;font-size:12px}.panel-section{padding:16px 0;border-top:1px solid rgba(255,255,255,.08)}.primary-controls{padding-top:4px}.primary-controls textarea{min-height:112px;font-size:24px;font-weight:800}.primary-controls input{font-size:18px;font-weight:800;text-transform:uppercase}.advanced-panel{border-top:1px solid rgba(255,255,255,.08)}.advanced-panel summary{display:flex;min-height:48px;align-items:center;justify-content:space-between;color:#d8d4ca;cursor:pointer;font-size:13px;list-style:none}.advanced-panel summary::-webkit-details-marker{display:none}.advanced-panel summary svg{transition:transform .16s ease}.advanced-panel[open] summary svg{transform:rotate(180deg)}label{display:grid;gap:8px;margin-bottom:14px;color:#d8d4ca;font-size:13px}input,select,textarea{width:100%;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#0f0f0f;color:#f8f7f2;outline:none;padding:10px 11px}textarea{min-height:76px;resize:vertical}input[type=color]{height:42px;padding:4px}input[type=range]{padding:0;accent-color:#e51a2f}.split{display:grid;grid-template-columns:1fr 1fr;gap:12px}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.segmented.two{grid-template-columns:repeat(2,1fr)}.segmented button{min-height:38px}.segmented button.active{border-color:#e51a2fcc;background:#e51a2f}.upload-button{display:flex;min-height:42px;align-items:center;justify-content:center;gap:8px;border:1px dashed rgba(255,255,255,.22);border-radius:8px;background:#101010;cursor:pointer}.upload-button input{display:none}.range-label{display:flex;justify-content:space-between}.mode-label{margin-bottom:10px;color:#d8d4ca;font-size:13px}.range-label b{color:#fff;font-weight:700}.workspace{display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-width:0;height:100vh;background:#0d0d0d}.workspace-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.08);background:#101010eb}.toolbar{display:flex;flex-wrap:wrap;gap:10px}.toolbar button{display:inline-flex;min-height:38px;align-items:center;gap:8px;padding:0 13px}.preview-stage{display:grid;min-height:0;place-items:center;padding:18px 26px;overflow:auto}.preview-stage canvas{display:block;max-width:min(100%,76vh);max-height:100%;width:auto;height:auto;box-shadow:0 18px 70px #0009}.status-bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:12px 24px;border-top:1px solid rgba(255,255,255,.08);background:#151515;color:#aaa59b;font-size:13px}@media (max-width: 900px){.app-shell{grid-template-columns:1fr}.control-panel,.workspace{height:auto}.workspace-header{align-items:flex-start;flex-direction:column}}