:root{
  color-scheme:dark;--bg:#08090b;--panel:rgba(18,20,25,.84);--border:rgba(255,255,255,.09);
  --text:#f6f7fb;--muted:#a6aab5;--accent:#9a8cff;--accent2:#6de7ff;--good:#8df3b1;
  --warn:#ffd98a;--bad:#ff9eaa;--shadow:0 24px 70px rgba(0,0,0,.35);--radius:20px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:
radial-gradient(circle at 50% -10%,rgba(154,140,255,.14),transparent 34rem),linear-gradient(180deg,#090a0d,#07080a);
color:var(--text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;line-height:1.5}
button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}
code,pre{font-family:"SFMono-Regular",ui-monospace,Menlo,Consolas,monospace}code{color:#d8d1ff}
.glow{position:fixed;pointer-events:none;filter:blur(80px);opacity:.16;z-index:-1}.glow-a{width:340px;height:340px;background:#7b61ff;top:10%;left:-120px}.glow-b{width:360px;height:360px;background:#48c8ff;right:-150px;top:40%}
.shell{width:min(1180px,calc(100% - 36px));margin:0 auto}
.topbar{position:sticky;top:0;z-index:20;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px max(18px,calc((100vw - 1180px)/2));border-bottom:1px solid var(--border);background:rgba(8,9,11,.74);backdrop-filter:blur(24px) saturate(160%)}
.brand{display:inline-flex;align-items:center;gap:10px;font-weight:750;letter-spacing:-.02em}.brand-mark{width:31px;height:31px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(145deg,#b6acff,#7866ff);color:#0a0a0c;font-size:20px}
.top-actions,.button-row,.hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.primary,.ghost,button.primary,button.ghost{border:1px solid transparent;border-radius:12px;padding:10px 14px;cursor:pointer;transition:.15s ease;font-weight:680}
.primary{background:linear-gradient(135deg,#a79cff,#7e6cff);color:#090a0d;box-shadow:0 9px 24px rgba(126,108,255,.2)}
.ghost{background:rgba(255,255,255,.045);border-color:var(--border);color:var(--text)}
.primary:hover,.ghost:hover{transform:translateY(-1px)}.ghost:hover{background:rgba(255,255,255,.075)}
.small{padding:8px 11px;border-radius:10px;font-size:13px}.tiny{padding:7px 10px;border-radius:9px;font-size:12px}
.hero{padding:86px 0 56px}.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:800;color:#b9afff}
h1{max-width:980px;margin:14px 0 18px;font-size:clamp(42px,7vw,84px);line-height:.98;letter-spacing:-.06em}
h1 span{color:transparent;background:linear-gradient(100deg,#c7c0ff,#7cecff);-webkit-background-clip:text;background-clip:text}
.hero-copy{max-width:790px;color:var(--muted);font-size:18px}.hero-actions{margin-top:26px}
.hero-flow{margin-top:52px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;color:var(--muted);font-size:13px}
.hero-flow div{display:flex;align-items:center;gap:9px}.hero-flow b{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:rgba(154,140,255,.12);color:#d7d1ff}.hero-flow i{color:#50535c;font-style:normal}
.grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(360px,.9fr);gap:20px;align-items:start}
.panel,.protocol-card,.limits-card{border:1px solid var(--border);background:var(--panel);backdrop-filter:blur(22px);border-radius:var(--radius);box-shadow:var(--shadow)}
.panel{padding:22px}.preview-panel{position:sticky;top:86px}
.panel-heading,.preview-top,.section-title-row,.options-title-row{display:flex;align-items:center;justify-content:space-between;gap:18px}
.panel h2,.section-head h2,.protocol-card h2,.limits-card h2{margin:4px 0 0;letter-spacing:-.035em}.panel h3,.panel h4{margin:0}
.form-panel>label+label{margin-top:14px}label{display:block;color:#d9dbe2;font-size:13px;font-weight:650}
input[type=text],select{width:100%;margin-top:7px;padding:11px 12px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:rgba(5,6,8,.68);color:var(--text);outline:none}
input[type=text]:focus,select:focus{border-color:rgba(154,140,255,.7);box-shadow:0 0 0 3px rgba(154,140,255,.1)}
input[type=checkbox]{width:16px;height:16px;accent-color:#9182ff}.hint{display:block;margin-top:6px;color:#7f838e;font-size:11px;font-weight:500}.optional{color:#777b85;font-weight:500}
.section-title-row{margin:28px 0 14px;align-items:flex-start}.section-title-row p,.options-title-row p,.delivery-card p{margin:4px 0 0;color:var(--muted);font-size:13px}.section-break{padding-top:22px;border-top:1px solid var(--border)}
.action-card,.trigger-card,.option-card,.delivery-card{border:1px solid rgba(255,255,255,.075);border-radius:15px;background:rgba(255,255,255,.025)}
.action-card,.trigger-card{padding:14px;margin-bottom:12px}.option-card{padding:12px;margin-top:10px;background:rgba(0,0,0,.15)}
.action-card-head,.option-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px}
.action-index,.trigger-index,.option-index{color:#b9afff;font-size:11px;letter-spacing:.09em;text-transform:uppercase;font-weight:800}
.remove-action,.remove-trigger,.remove-option{border:0;background:transparent;color:#8b8f99;cursor:pointer;padding:4px 7px}.remove-action:hover,.remove-trigger:hover,.remove-option:hover{color:var(--bad)}
.action-grid,.trigger-grid,.option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.option-description,.trigger-actions-field{grid-column:1/-1}
.check-row{margin-top:10px;display:flex;align-items:center;gap:8px;color:var(--muted);font-weight:500}
.options-section{margin-top:15px;padding-top:14px;border-top:1px solid rgba(255,255,255,.065)}.options-title-row{align-items:flex-start}.options-title-row h4{font-size:13px}
.delivery-card{margin-top:16px;padding:16px;display:flex;align-items:center;justify-content:space-between;gap:20px}.locked-pill{white-space:nowrap;border:1px solid rgba(141,243,177,.2);color:var(--good);background:rgba(141,243,177,.06);padding:6px 9px;border-radius:999px;font-size:11px;font-weight:750}
.status{font-size:11px;font-weight:800;padding:6px 9px;border-radius:999px;border:1px solid var(--border)}.status[data-state=ready]{color:var(--good)}.status[data-state=warning]{color:var(--warn)}.status[data-state=error]{color:var(--bad)}
.code{margin:16px 0;padding:16px;min-height:390px;max-height:620px;overflow:auto;border-radius:14px;background:#08090c;border:1px solid rgba(255,255,255,.07);color:#d8d8e5;font-size:12px;line-height:1.62;white-space:pre}.code-medium{min-height:330px;max-height:520px}
.secondary-row{margin-top:9px}.validation-box{margin-top:14px;display:grid;gap:7px}.validation-row{display:flex;gap:9px;align-items:flex-start;font-size:12px;color:var(--muted);padding:9px 10px;border-radius:10px;background:rgba(255,255,255,.028)}.validation-row b{width:18px;height:18px;display:grid;place-items:center;border-radius:50%;font-size:10px}.validation-row.ok b{color:var(--good)}.validation-row.warning b{color:var(--warn)}.validation-row.error b{color:var(--bad)}
.section-head{padding:78px 0 22px}.section-head p{max-width:760px;color:var(--muted)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.steps.four{grid-template-columns:repeat(4,1fr)}.step-card{border:1px solid var(--border);border-radius:16px;padding:18px;background:rgba(255,255,255,.025)}.step-no{color:#8d80f8;font-size:11px;font-weight:800}.step-card h3{margin:10px 0 7px;font-size:15px}.step-card p{margin:0;color:var(--muted);font-size:13px}
.path-card,.note{margin-top:14px;border:1px solid var(--border);border-radius:14px;padding:15px;background:rgba(255,255,255,.025);color:var(--muted);font-size:13px}.path-card span{display:block;margin-bottom:8px}.path{padding:10px 12px;background:#08090c;border-radius:10px;color:#dbd6ff;font-family:"SFMono-Regular",ui-monospace,monospace;overflow-wrap:anywhere}.warning-note{border-color:rgba(255,217,138,.16);background:rgba(255,217,138,.035)}.warning-note strong{color:var(--warn)}
.two-col{margin-top:20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.protocol-card,.limits-card{margin-top:20px;padding:22px}.schema-table-wrap{overflow-x:auto;margin-top:18px}table{width:100%;border-collapse:collapse;font-size:12px}th,td{text-align:left;padding:11px 10px;border-bottom:1px solid rgba(255,255,255,.07);vertical-align:top}th{color:#969aa5;font-size:10px;text-transform:uppercase;letter-spacing:.1em}td:first-child{width:29%}td:nth-child(2){width:19%;color:#c3bddf}td:nth-child(3){color:var(--muted)}
.limit-grid{margin-top:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.limit-grid div{border:1px solid var(--border);border-radius:13px;padding:14px;background:rgba(255,255,255,.02)}.limit-grid b{display:block;font-size:22px}.limit-grid span{display:block;color:var(--muted);font-size:12px}
.footer{display:flex;justify-content:space-between;gap:14px;padding:54px 0 34px;color:#6f737d;font-size:12px}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:10px 14px;border:1px solid var(--border);border-radius:12px;background:#17191f;box-shadow:var(--shadow);transition:.2s ease;z-index:100;font-size:13px}.toast.show{opacity:1;transform:translate(-50%,0)}
[hidden]{display:none!important}
@media(max-width:980px){.grid{grid-template-columns:1fr}.preview-panel{position:static}.steps.four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.shell{width:min(calc(100% - 24px),1180px)}.topbar{padding-inline:12px}.top-actions .ghost{display:none}.hero{padding-top:64px}h1{font-size:clamp(42px,14vw,66px)}.hero-copy{font-size:16px}.action-grid,.trigger-grid,.option-grid,.two-col,.steps,.steps.four,.limit-grid{grid-template-columns:1fr}.panel{padding:16px}.section-title-row,.panel-heading,.preview-top,.options-title-row,.delivery-card{align-items:flex-start}.section-title-row,.options-title-row,.delivery-card{flex-direction:column}.code{min-height:300px}.footer{flex-direction:column}}


/* Partner CI card artwork */
.card-appearance-heading{margin-bottom:14px}
.card-appearance-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.86fr);gap:14px;margin-bottom:22px}
.card-artwork-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.banner-spec-card{border:1px solid rgba(255,255,255,.075);border-radius:15px;background:rgba(255,255,255,.025);overflow:hidden}
.banner-spec-preview{aspect-ratio:20/9;margin:12px;border-radius:12px;border:1px dashed rgba(154,140,255,.48);background:
linear-gradient(135deg,rgba(154,140,255,.16),rgba(109,231,255,.08)),#090a0d;
display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background-size:cover;background-position:center;overflow:hidden}
.banner-spec-preview span{font-size:21px;font-weight:800;letter-spacing:-.04em;color:#dcd8ff}
.banner-spec-preview small{font-size:11px;color:#8d91a0}
.banner-spec-preview.has-image{border-style:solid}
.banner-spec-copy{padding:2px 14px 14px}.banner-spec-copy h4{margin:5px 0 7px;font-size:15px}.banner-spec-copy p{margin:0 0 12px;color:var(--muted);font-size:12px}
.banner-preview-button{display:inline-flex;align-items:center;cursor:pointer}
.banner-dimension-status{margin-top:9px;font-size:11px;color:#80848f}
.banner-dimension-status[data-state=good]{color:var(--good)}
.banner-dimension-status[data-state=warning]{color:var(--warn)}
.banner-dimension-status[data-state=error]{color:var(--bad)}
.steps.five{grid-template-columns:repeat(5,1fr)}
@media(max-width:1100px){.steps.five{grid-template-columns:repeat(3,1fr)}}
@media(max-width:980px){.card-appearance-grid{grid-template-columns:1fr}.steps.five{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.card-artwork-form,.steps.five{grid-template-columns:1fr}}