:root{--paper:#f5f7f4;--panel:#fff;--panel-strong:#eef3f0;--ink:#171a18;--muted:#5d6862;--hairline:#d8dfda;--teal:#006d77;--cress:#a8d84f;--tomato:#c34b36;--gold:#b98c32;--shadow:0 18px 50px #171a181a;--font-display:Georgia, "Times New Roman", serif;--font-ui:"Trebuchet MS", Verdana, sans-serif}*{box-sizing:border-box}html,body{background:var(--paper);min-height:100%;color:var(--ink);font-family:var(--font-ui);margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}.studio{background:linear-gradient(90deg, #ffffffb8, #fff0 34%), repeating-linear-gradient(0deg, #171a180a 0 1px, transparent 1px 46px), var(--paper);grid-template-columns:minmax(300px,360px) minmax(0,1fr) minmax(300px,380px);min-height:100vh;display:grid}.sidebar,.inspector{border-color:var(--hairline);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffd1;min-width:0}.sidebar{border-right:1px solid var(--hairline)}.inspector{border-left:1px solid var(--hairline)}.pane-scroll{height:100vh;padding:22px;overflow-y:auto}.brand-row,.toolbar,.field-row,.tab-list,.status-row,.metric-grid{align-items:center;display:flex}.brand-row{justify-content:space-between;gap:14px;margin-bottom:24px}.brand-mark{border:1px solid var(--ink);background:var(--ink);width:42px;height:42px;color:var(--panel);font-family:var(--font-display);place-items:center;font-size:22px;display:grid}.brand-copy{min-width:0}.brand-copy strong,.section-heading,.preview-title,.inspector-title{font-family:var(--font-display);font-weight:700}.brand-copy strong{font-size:19px;display:block}.brand-copy span,.field label,.eyebrow,.muted,.metric span,.section-list small{color:var(--muted)}.brand-copy span{margin-top:3px;font-size:12px;display:block}.toolbar{gap:8px}.icon-button,.tab-button,.primary-button,.ghost-button{border:1px solid var(--hairline);background:var(--panel);color:var(--ink);border-radius:6px;justify-content:center;align-items:center;transition:background .16s,border-color .16s,transform .16s;display:inline-flex}.icon-button{width:36px;height:36px}.icon-button:hover,.tab-button:hover,.ghost-button:hover{border-color:var(--teal);background:var(--panel-strong)}.primary-button{border-color:var(--ink);background:var(--ink);width:100%;min-height:44px;color:var(--panel);gap:9px;margin-top:16px;font-weight:700}.primary-button:hover{transform:translateY(-1px)}.ghost-button{gap:8px;min-height:38px;padding:0 12px}.section-block{margin-top:24px}.section-heading{margin:0 0 14px;font-size:25px;line-height:1.1}.field{gap:7px;margin-bottom:14px;display:grid}.field label{font-size:12px;font-weight:700}.field input,.field select,.field textarea{border:1px solid var(--hairline);background:var(--panel);width:100%;color:var(--ink);border-radius:6px;outline:none}.field input,.field select{height:42px;padding:0 12px}.field textarea{resize:vertical;min-height:104px;padding:11px 12px;line-height:1.45}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--teal);box-shadow:0 0 0 3px #006d7724}.field-row{gap:10px}.field-row .field{flex:1}.stage{background:radial-gradient(circle at 12% 18%,#a8d84f3d,#0000 22%),linear-gradient(135deg,#e7efea,#f9faf7 38%,#d7e5e0);min-width:0;min-height:100vh;position:relative;overflow:hidden}.stage canvas{display:block}.stage-overlay{pointer-events:none;align-content:space-between;padding:clamp(24px,4vw,56px);display:grid;position:absolute;inset:0}.preview-top{justify-content:space-between;gap:16px;display:flex}.preview-title{max-width:min(780px,84vw);margin:0;font-size:clamp(42px,7vw,108px);line-height:.9}.preview-copy{color:#171a18b8;max-width:540px;margin:18px 0 0;font-size:17px;line-height:1.55}.eyebrow{text-transform:uppercase;margin:0 0 14px;font-size:12px;font-weight:700}.preview-beats{background:#171a1833;border:1px solid #171a1833;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;max-width:760px;display:grid}.beat{background:#f5f7f4c7;min-height:88px;padding:14px}.beat strong{margin-bottom:8px;font-size:13px;display:block}.beat span{color:var(--muted);font-size:12px;line-height:1.35;display:block}.inspector-title{margin:0;font-size:27px}.tab-list{gap:7px;margin:20px 0}.tab-button{flex:1;gap:6px;height:38px;font-size:12px;font-weight:700}.tab-button[data-active=true]{border-color:var(--ink);background:var(--ink);color:var(--panel)}.status-row{border-bottom:1px solid var(--hairline);justify-content:space-between;gap:10px;padding:12px 0}.status-pill{border:1px solid var(--hairline);background:var(--panel);border-radius:99px;align-items:center;gap:7px;min-height:28px;padding:0 10px;font-size:12px;font-weight:700;display:inline-flex}.status-dot{background:var(--cress);border-radius:50%;width:8px;height:8px}.metric-grid{align-items:stretch;gap:8px;margin:20px 0}.metric{border:1px solid var(--hairline);background:var(--panel);border-radius:6px;flex:1;min-width:0;padding:12px}.metric strong{font-family:var(--font-display);margin-top:7px;font-size:21px;display:block}.metric span{font-size:11px;font-weight:700}.section-list{gap:10px;margin:0;padding:0;list-style:none;display:grid}.section-list li{border:1px solid var(--hairline);background:var(--panel);border-radius:6px;padding:12px}.section-list strong,.section-list small{display:block}.section-list strong{margin-bottom:5px;font-size:14px}.section-list small{line-height:1.4}.swatches{grid-template-columns:repeat(5,1fr);gap:8px;margin-top:16px;display:grid}.swatch{aspect-ratio:1;border:1px solid #171a183d;border-radius:6px}.json-block{border:1px solid var(--hairline);color:#dce8df;background:#101412;border-radius:6px;max-height:360px;margin:0;padding:14px;font-size:12px;line-height:1.55;overflow:auto}@media (max-width:1180px){.studio{grid-template-columns:minmax(280px,340px) minmax(0,1fr)}.inspector{border-top:1px solid var(--hairline);border-left:0;grid-column:1/-1}.inspector .pane-scroll{height:auto}}@media (max-width:820px){.studio{grid-template-columns:1fr}.pane-scroll{height:auto}.sidebar,.inspector{border:0}.stage{min-height:720px}.preview-top{display:block}.preview-beats{grid-template-columns:1fr}.field-row,.metric-grid{display:grid}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}