/* ToolHub 150 expansion pages — scoped visual layer. */
body[data-expansion-tool]{
  --tool-accent:#38bdf8;
  --tool-accent-rgb:56,189,248;
  --tool-secondary:#818cf8;
  --tool-secondary-rgb:129,140,248;
  --tool-deep:#082f49;
  --accent:var(--tool-accent);
  --warm:var(--tool-secondary);
  position:relative;
  isolation:isolate;
  background-image:
    radial-gradient(circle at 12% 12%,rgba(var(--tool-accent-rgb),.11),transparent 30rem),
    radial-gradient(circle at 88% 32%,rgba(var(--tool-secondary-rgb),.09),transparent 32rem),
    linear-gradient(to right,rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.025) 1px,transparent 1px);
}
body[data-expansion-tool]::before,
body[data-expansion-tool]::after{content:"";position:fixed;z-index:-1;pointer-events:none;border-radius:999px;filter:blur(90px);opacity:.17}
body[data-expansion-tool]::before{width:26rem;height:26rem;left:-13rem;top:14rem;background:var(--tool-accent)}
body[data-expansion-tool]::after{width:30rem;height:30rem;right:-17rem;top:32rem;background:var(--tool-secondary)}

body[data-palette=violet]{--tool-accent:#a78bfa;--tool-accent-rgb:167,139,250;--tool-secondary:#ec4899;--tool-secondary-rgb:236,72,153;--tool-deep:#2e1065}
body[data-palette=sky]{--tool-accent:#38bdf8;--tool-accent-rgb:56,189,248;--tool-secondary:#6366f1;--tool-secondary-rgb:99,102,241;--tool-deep:#082f49}
body[data-palette=teal]{--tool-accent:#2dd4bf;--tool-accent-rgb:45,212,191;--tool-secondary:#38bdf8;--tool-secondary-rgb:56,189,248;--tool-deep:#042f2e}
body[data-palette=amber]{--tool-accent:#fbbf24;--tool-accent-rgb:251,191,36;--tool-secondary:#f97316;--tool-secondary-rgb:249,115,22;--tool-deep:#451a03}
body[data-palette=rose]{--tool-accent:#fb7185;--tool-accent-rgb:251,113,133;--tool-secondary:#c084fc;--tool-secondary-rgb:192,132,252;--tool-deep:#4c0519}
body[data-palette=emerald]{--tool-accent:#34d399;--tool-accent-rgb:52,211,153;--tool-secondary:#22d3ee;--tool-secondary-rgb:34,211,238;--tool-deep:#022c22}
body[data-palette=indigo]{--tool-accent:#818cf8;--tool-accent-rgb:129,140,248;--tool-secondary:#38bdf8;--tool-secondary-rgb:56,189,248;--tool-deep:#1e1b4b}
body[data-palette=cyan]{--tool-accent:#22d3ee;--tool-accent-rgb:34,211,238;--tool-secondary:#2dd4bf;--tool-secondary-rgb:45,212,191;--tool-deep:#083344}

body[data-expansion-tool] .tool-wrap{position:relative;padding-top:1.15rem}
body[data-expansion-tool] .crumb{margin-bottom:.9rem}
.expansion-hero{position:relative;max-width:64rem;margin-bottom:2rem;padding:2rem clamp(1rem,4vw,3rem) 2.15rem;border:1px solid rgba(var(--tool-accent-rgb),.22);border-radius:1.5rem;background:linear-gradient(145deg,rgba(var(--tool-accent-rgb),.075),rgba(15,23,42,.42) 48%,rgba(var(--tool-secondary-rgb),.06));box-shadow:0 28px 90px -52px rgba(var(--tool-accent-rgb),.9);overflow:hidden}
.expansion-hero::before{content:"";position:absolute;width:22rem;height:22rem;left:50%;top:-18rem;transform:translateX(-50%);border-radius:50%;background:var(--tool-accent);filter:blur(70px);opacity:.2;pointer-events:none}
.expansion-hero::after{content:"";position:absolute;inset:0;background-image:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.035) 50%,transparent 70%);transform:translateX(-100%);animation:expansion-sheen 8s ease-in-out infinite;pointer-events:none}
@keyframes expansion-sheen{0%,65%,100%{transform:translateX(-100%)}80%{transform:translateX(100%)}}
.exp-hero-icon{position:relative;display:grid;place-items:center;width:4.15rem;height:4.15rem;margin:0 auto .9rem;border:1px solid rgba(var(--tool-accent-rgb),.42);border-radius:1.15rem;color:var(--tool-accent);background:linear-gradient(145deg,rgba(var(--tool-accent-rgb),.18),rgba(var(--tool-secondary-rgb),.08));box-shadow:0 14px 40px -18px rgba(var(--tool-accent-rgb),.95),inset 0 1px rgba(255,255,255,.08);transform:rotate(-3deg)}
.exp-hero-icon svg{width:2rem;height:2rem;filter:drop-shadow(0 0 12px rgba(var(--tool-accent-rgb),.55))}
.expansion-hero .badge{position:relative;border-color:rgba(var(--tool-accent-rgb),.3);color:var(--tool-accent);background:rgba(var(--tool-accent-rgb),.075)}
.expansion-hero .badge::before{background:var(--tool-accent);box-shadow:0 0 14px var(--tool-accent)}
.expansion-hero h1{position:relative;margin-top:.9rem;font-size:clamp(2rem,5vw,3.15rem);letter-spacing:-.035em}
.expansion-hero h1 span{color:transparent;background:linear-gradient(100deg,#fff 8%,var(--tool-accent) 52%,var(--tool-secondary) 94%);background-clip:text;-webkit-background-clip:text}
.expansion-hero>p{position:relative;max-width:46rem;margin-inline:auto;font-size:clamp(.92rem,2vw,1.04rem)}
.exp-hero-points{position:relative;display:flex;align-items:center;justify-content:center;gap:.5rem 1.25rem;flex-wrap:wrap;margin-top:1.15rem;color:#94a3b8;font-size:.74rem}
.exp-hero-points span{display:inline-flex;align-items:center;gap:.38rem}
.exp-hero-points svg{width:.9rem;height:.9rem;color:var(--tool-accent)}

body[data-expansion-tool] #expansion-app{gap:1.4rem}
body[data-expansion-tool] .exp-panel{position:relative;overflow:hidden;border-color:rgba(var(--tool-accent-rgb),.2);background:linear-gradient(155deg,rgba(21,31,50,.94),rgba(12,20,35,.86));box-shadow:0 24px 70px -34px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.015) inset;transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease}
body[data-expansion-tool] .exp-panel:hover{border-color:rgba(var(--tool-accent-rgb),.38);box-shadow:0 28px 78px -35px rgba(var(--tool-accent-rgb),.42),0 0 0 1px rgba(255,255,255,.025) inset}
body[data-expansion-tool] .exp-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--tool-accent),var(--tool-secondary),transparent);opacity:.72}
.exp-panel-title{display:flex;align-items:center;gap:.65rem}
.exp-panel-icon{display:grid;place-items:center;width:2rem;height:2rem;border:1px solid rgba(var(--tool-accent-rgb),.28);border-radius:.6rem;color:var(--tool-accent);background:rgba(var(--tool-accent-rgb),.09)}
.exp-panel-icon svg{width:1rem;height:1rem}
body[data-expansion-tool] .panel-title h2{color:#e5edf7;letter-spacing:.1em}
body[data-expansion-tool] .field label{color:#aebdd0;font-weight:600}
body[data-expansion-tool] .input,
body[data-expansion-tool] .select,
body[data-expansion-tool] .textarea{border-color:rgba(var(--tool-accent-rgb),.15);background:rgba(6,12,24,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.025);transition:border-color .2s,box-shadow .2s,background .2s}
body[data-expansion-tool] .input:hover,
body[data-expansion-tool] .select:hover,
body[data-expansion-tool] .textarea:hover{border-color:rgba(var(--tool-accent-rgb),.32)}
body[data-expansion-tool] .input:focus,
body[data-expansion-tool] .select:focus,
body[data-expansion-tool] .textarea:focus{border-color:var(--tool-accent);background:rgba(8,16,30,.86);box-shadow:0 0 0 3px rgba(var(--tool-accent-rgb),.12),0 10px 30px -20px rgba(var(--tool-accent-rgb),.75)}
body[data-expansion-tool] .check input{accent-color:var(--tool-accent)}
body[data-expansion-tool] .check{border:1px solid transparent;border-radius:.55rem;padding:.38rem .45rem;margin-left:-.45rem;transition:.2s}
body[data-expansion-tool] .check:hover{border-color:rgba(var(--tool-accent-rgb),.2);background:rgba(var(--tool-accent-rgb),.05)}
body[data-expansion-tool] .btn{border-color:rgba(var(--tool-accent-rgb),.18);background:rgba(8,15,28,.72)}
body[data-expansion-tool] .btn:hover{border-color:rgba(var(--tool-accent-rgb),.5);color:var(--tool-accent);box-shadow:0 10px 28px -16px rgba(var(--tool-accent-rgb),.75)}
body[data-expansion-tool] .btn.primary{position:relative;color:var(--tool-deep);border-color:transparent;background:linear-gradient(110deg,var(--tool-accent),var(--tool-secondary));box-shadow:0 12px 32px -16px rgba(var(--tool-accent-rgb),.95);overflow:hidden}
body[data-expansion-tool] .btn.primary:hover{color:var(--tool-deep);filter:saturate(1.1) brightness(1.08);transform:translateY(-2px)}
body[data-expansion-tool] .btn svg{width:1rem;height:1rem}
body[data-expansion-tool] .status{border-color:rgba(var(--tool-accent-rgb),.16);border-left-color:var(--tool-accent);background:rgba(7,14,27,.68)}
body[data-expansion-tool] .privacy-note{display:flex;align-items:flex-start;gap:.55rem}
body[data-expansion-tool] .privacy-note svg{width:1rem;height:1rem;flex:none;margin-top:.14rem;color:var(--tool-accent)}
body[data-expansion-tool] .metric-grid{margin-bottom:.85rem}
body[data-expansion-tool] .metric{position:relative;overflow:hidden;border-color:rgba(var(--tool-accent-rgb),.16);background:linear-gradient(145deg,rgba(var(--tool-accent-rgb),.07),rgba(8,15,28,.72))}
body[data-expansion-tool] .metric::after{content:"";position:absolute;width:3.2rem;height:3.2rem;right:-1.7rem;top:-1.8rem;border-radius:50%;background:var(--tool-accent);filter:blur(20px);opacity:.16}
body[data-expansion-tool] .metric b{color:var(--tool-accent);text-shadow:0 0 18px rgba(var(--tool-accent-rgb),.22)}
body[data-expansion-tool] .code{border-color:rgba(var(--tool-accent-rgb),.2);background:linear-gradient(145deg,rgba(4,9,18,.96),rgba(8,15,29,.94));color:#d7f2ff;box-shadow:inset 0 1px rgba(255,255,255,.025)}
body[data-expansion-tool] .preview{border-color:rgba(var(--tool-accent-rgb),.22);background-image:linear-gradient(45deg,rgba(var(--tool-accent-rgb),.035) 25%,transparent 25%),linear-gradient(-45deg,rgba(var(--tool-accent-rgb),.035) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(var(--tool-accent-rgb),.035) 75%),linear-gradient(-45deg,transparent 75%,rgba(var(--tool-accent-rgb),.035) 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}

/* Purpose-built workspaces for expansion 200 and 250. */
body[data-workspace] #expansion-app{display:grid;align-items:start;gap:1.15rem}
body[data-workspace] .exp-workspace-strip{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:4.1rem;padding:.7rem .9rem;border:1px solid rgba(var(--tool-accent-rgb),.18);border-radius:1rem;background:linear-gradient(110deg,rgba(var(--tool-accent-rgb),.1),rgba(8,15,28,.78) 48%,rgba(var(--tool-secondary-rgb),.07));box-shadow:inset 0 1px rgba(255,255,255,.04)}
.exp-workspace-identity,.exp-workspace-signal{display:flex;align-items:center;gap:.7rem}
.exp-workspace-identity>span:last-child{display:grid;gap:.12rem}.exp-workspace-identity b{font:700 .72rem/1 "Fira Code",monospace;letter-spacing:.14em;color:var(--tool-accent)}.exp-workspace-identity small{font-size:.7rem;color:#94a3b8}
.exp-workspace-symbol{display:grid;place-items:center;width:2.65rem;height:2.65rem;border:1px solid rgba(var(--tool-accent-rgb),.27);border-radius:.8rem;color:var(--tool-accent);background:rgba(var(--tool-accent-rgb),.08)}.exp-workspace-symbol svg{width:1.25rem;height:1.25rem}
.exp-workspace-signal{font:600 .62rem/1 "Fira Code",monospace;letter-spacing:.08em;color:#a9bad0}.exp-workspace-signal>i{width:.46rem;height:.46rem;border-radius:50%;background:#34d399;box-shadow:0 0 12px #34d399}.exp-workspace-signal em{font-style:normal;color:#64748b}
body[data-workspace] .exp-control-deck,body[data-workspace] .exp-result-deck>.panel{padding:1.15rem}
body[data-workspace] .exp-control-deck>.panel-title,body[data-workspace] .exp-result-deck .panel-title{align-items:flex-start;margin-bottom:1rem}
body[data-workspace] .exp-control-deck>.panel-title>div,body[data-workspace] .exp-result-deck .panel-title>div{display:grid;gap:.28rem}
.exp-panel-kicker{font:700 .59rem/1 "Fira Code",monospace;letter-spacing:.14em;color:var(--tool-accent);opacity:.8}
body[data-workspace] .exp-panel-title{display:flex}
body[data-workspace] .exp-primary-actions{margin-top:1rem}
body[data-workspace] .exp-privacy,body[data-workspace] #exp-status{margin-top:.8rem}
.exp-result-chrome{display:none;align-items:center;gap:.4rem;height:1.7rem;margin:-1.15rem -1.15rem 1rem;padding:0 .8rem;border-bottom:1px solid rgba(var(--tool-accent-rgb),.14);background:rgba(3,8,18,.55)}
.exp-result-chrome>span{width:.42rem;height:.42rem;border-radius:50%;background:#fb7185}.exp-result-chrome>span:nth-child(2){background:#fbbf24}.exp-result-chrome>span:nth-child(3){background:#34d399}.exp-result-chrome b{margin-left:.3rem;font:500 .58rem/1 "Fira Code",monospace;color:#64748b}
body[data-workspace] .exp-signature{position:relative;min-height:7.4rem;margin:0 0 .85rem;border:1px solid rgba(var(--tool-accent-rgb),.18);overflow:hidden}
body[data-workspace] .exp-result-deck .code{min-height:12rem}

/* Transform desk: two physical endpoints with a transfer lane. */
body[data-workspace=transcode] #expansion-app{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
body[data-workspace=transcode] .exp-workspace-strip{border-radius:999px;padding-inline:1.15rem}
body[data-workspace=transcode] .exp-control-deck{border-radius:1.4rem 1.4rem .5rem 1.4rem}
body[data-workspace=transcode] .exp-result-deck>.panel{border-radius:1.4rem 1.4rem 1.4rem .5rem}
body[data-workspace=transcode] .exp-primary-actions .primary{min-width:10rem}
.exp-signature-transcode{display:grid;grid-template-columns:1fr 2.5rem 1fr;align-items:center;gap:.45rem;padding:.8rem;border-radius:1rem;background:linear-gradient(90deg,rgba(var(--tool-accent-rgb),.09),rgba(4,10,20,.78) 48%,rgba(var(--tool-secondary-rgb),.1))}
.exp-signature-transcode>div{display:grid;place-items:center;gap:.18rem;min-height:5.6rem;border:1px dashed rgba(var(--tool-accent-rgb),.24);border-radius:.75rem}.exp-signature-transcode small{font:600 .52rem "Fira Code",monospace;letter-spacing:.14em;color:#64748b}.exp-signature-transcode b{font:800 1.7rem "Fira Code",monospace;color:var(--tool-accent)}.exp-signature-transcode span{font-size:.6rem;color:#8392a7}.exp-signature-transcode>svg{width:1.2rem;color:var(--tool-secondary)}

/* Data grid: spreadsheet-like workspace with a wide result table. */
body[data-workspace=data] #expansion-app{grid-template-columns:minmax(18rem,4fr) minmax(0,7fr)}
body[data-workspace=data] .exp-workspace-strip{border-radius:.35rem;background-image:linear-gradient(rgba(var(--tool-accent-rgb),.05) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--tool-accent-rgb),.05) 1px,transparent 1px);background-size:28px 28px}
body[data-workspace=data] .exp-panel{border-radius:.35rem}
body[data-workspace=data] .field-grid{grid-template-columns:1fr}
body[data-workspace=data] .textarea{min-height:12rem;font-family:"Fira Code",monospace}
.exp-signature-data{display:grid;grid-template-columns:2.3rem repeat(3,1fr);grid-template-rows:1.8rem repeat(2,2.2rem);border-radius:.35rem;background:rgba(5,12,24,.82)}
.exp-signature-data>*{border-right:1px solid rgba(var(--tool-accent-rgb),.13);border-bottom:1px solid rgba(var(--tool-accent-rgb),.13)}.exp-signature-data>span{background:rgba(var(--tool-accent-rgb),.12)}.exp-signature-data>b{background:linear-gradient(90deg,rgba(var(--tool-accent-rgb),.13) 58%,transparent 58%);background-size:70% 4px;background-repeat:no-repeat;background-position:center}.exp-signature-data>em{position:absolute;left:.35rem;top:2.55rem;color:var(--tool-accent)}.exp-signature-data>em svg{width:1.15rem}

/* Live design lab: control rail next to a large checkerboard canvas. */
body[data-workspace=visual] #expansion-app{grid-template-columns:minmax(17rem,21rem) minmax(0,1fr)}
body[data-workspace=visual] .exp-workspace-strip{border-radius:0 0 1.2rem 1.2rem;border-top:3px solid var(--tool-accent)}
body[data-workspace=visual] .exp-control-deck{border-radius:1.2rem;background:linear-gradient(180deg,rgba(var(--tool-accent-rgb),.1),rgba(9,17,31,.92))}
body[data-workspace=visual] .exp-result-deck>.panel{border-radius:.5rem;padding:1.15rem}
body[data-workspace=visual] .exp-result-deck .preview:not(.hidden){min-height:16rem;display:grid;place-items:center}
.exp-signature-visual{display:grid;place-items:center;min-height:13rem!important;border-radius:.35rem;background-color:#0a1220;background-image:linear-gradient(45deg,rgba(255,255,255,.035) 25%,transparent 25%),linear-gradient(-45deg,rgba(255,255,255,.035) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(255,255,255,.035) 75%),linear-gradient(-45deg,transparent 75%,rgba(255,255,255,.035) 75%);background-size:22px 22px;background-position:0 0,0 11px,11px -11px,-11px 0}
.exp-canvas-object{position:relative;display:grid;place-items:center;width:6rem;height:6rem;border:1px solid var(--tool-accent);border-radius:1.1rem;color:var(--tool-accent);background:rgba(var(--tool-accent-rgb),.12);box-shadow:0 18px 48px -22px rgba(var(--tool-accent-rgb),.9)}.exp-canvas-object svg{width:2.2rem}.exp-canvas-object span{position:absolute;width:.5rem;height:.5rem;border:1px solid var(--tool-accent);background:#091321}.exp-canvas-object span:nth-of-type(1){left:-.3rem;top:-.3rem}.exp-canvas-object span:nth-of-type(2){right:-.3rem;top:-.3rem}.exp-canvas-object span:nth-of-type(3){right:-.3rem;bottom:-.3rem}.exp-canvas-object span:nth-of-type(4){left:-.3rem;bottom:-.3rem}.exp-signature-visual>small{position:absolute;right:.55rem;bottom:.4rem;font:500 .55rem "Fira Code",monospace;color:#64748b}

/* Protocol console: request composer and response frame. */
body[data-workspace=protocol] #expansion-app{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
body[data-workspace=protocol] .exp-workspace-strip{border-radius:.55rem;border-left:4px solid var(--tool-accent)}
body[data-workspace=protocol] .exp-control-deck,body[data-workspace=protocol] .exp-result-deck>.panel{border-radius:.55rem;background:linear-gradient(160deg,rgba(3,10,20,.97),rgba(8,19,31,.94))}
body[data-workspace=protocol] .exp-result-chrome{display:flex}
body[data-workspace=protocol] .field label,body[data-workspace=protocol] .input,body[data-workspace=protocol] .select,body[data-workspace=protocol] .textarea{font-family:"Fira Code",monospace}
.exp-signature-protocol{border-radius:.4rem;background:#050d18;font-family:"Fira Code",monospace}.exp-signature-protocol>div{display:flex;align-items:center;gap:.55rem;padding:.72rem;border-bottom:1px solid rgba(var(--tool-accent-rgb),.15);font-size:.64rem}.exp-signature-protocol>div span{padding:.25rem .4rem;border-radius:.25rem;color:var(--tool-deep);background:var(--tool-accent);font-weight:800}.exp-signature-protocol>div b{min-width:0;overflow:hidden;text-overflow:ellipsis;color:#bfdbfe}.exp-signature-protocol>div em{margin-left:auto;font-style:normal;color:#64748b}.exp-signature-protocol p{display:grid;gap:.5rem;padding:.75rem}.exp-signature-protocol p i{height:.3rem;border-radius:1rem;background:linear-gradient(90deg,rgba(var(--tool-accent-rgb),.42) 45%,transparent 45%)}.exp-signature-protocol p i:nth-child(2){width:72%}.exp-signature-protocol p i:nth-child(3){width:48%}.exp-signature-protocol code{position:absolute;right:.65rem;bottom:.45rem;font-size:.55rem;color:#34d399}

/* Text workbench: paired document editors with line rhythm. */
body[data-workspace=textlab] #expansion-app{grid-template-columns:1fr 1fr}
body[data-workspace=textlab] .exp-workspace-strip{border-radius:0;padding-left:1.25rem;border-left:2px solid var(--tool-accent)}
body[data-workspace=textlab] .exp-control-deck,body[data-workspace=textlab] .exp-result-deck>.panel{border-radius:.2rem;box-shadow:8px 8px 0 rgba(var(--tool-accent-rgb),.055)}
body[data-workspace=textlab] .textarea{min-height:14rem;line-height:1.75}
.exp-signature-text{display:grid;grid-template-columns:2rem 1fr 3rem;gap:.75rem;padding:.8rem;border-radius:.15rem;background:linear-gradient(90deg,rgba(var(--tool-accent-rgb),.055),transparent)}.exp-signature-text aside{text-align:right;font:500 .65rem/1.65rem "Fira Code",monospace;color:#475569;border-right:1px solid rgba(var(--tool-accent-rgb),.15);padding-right:.55rem}.exp-signature-text p{display:grid;align-content:center;gap:.62rem}.exp-signature-text p span{height:.3rem;border-radius:1rem;background:linear-gradient(90deg,var(--tool-accent) 12%,rgba(var(--tool-accent-rgb),.18) 12%);opacity:.75}.exp-signature-text p span:nth-child(2){width:72%}.exp-signature-text p span:nth-child(3){width:88%}.exp-signature-text p span:nth-child(4){width:55%}.exp-signature-text>svg{align-self:center;color:var(--tool-accent);opacity:.8}

/* Code studio: settings inspector beside a real editor surface. */
body[data-workspace=code] #expansion-app{grid-template-columns:minmax(17rem,4fr) minmax(0,8fr)}
body[data-workspace=code] .exp-workspace-strip{border-radius:.55rem .55rem 0 0;background:#07101d}
body[data-workspace=code] .exp-control-deck{border-radius:.4rem;background:#101a2a}
body[data-workspace=code] .exp-result-deck>.panel{border-radius:.4rem;background:#070e19}
body[data-workspace=code] .exp-result-chrome{display:flex}
body[data-workspace=code] .code,body[data-workspace=code] .textarea,body[data-workspace=code] .input{font-family:"Fira Code",monospace}
.exp-signature-code{border-radius:.35rem;background:#050b14;font-family:"Fira Code",monospace}.exp-signature-code header{display:flex;align-items:center;gap:.35rem;height:1.6rem;padding:0 .55rem;border-bottom:1px solid rgba(var(--tool-accent-rgb),.13);background:#0b1422}.exp-signature-code header i{width:.38rem;height:.38rem;border-radius:50%;background:#fb7185}.exp-signature-code header i:nth-child(2){background:#fbbf24}.exp-signature-code header i:nth-child(3){background:#34d399}.exp-signature-code header span{margin-left:.35rem;font-size:.55rem;color:#64748b}.exp-signature-code pre{margin:0;padding:.8rem;font-size:.67rem;line-height:1.7;color:#cbd5e1}.exp-signature-code pre b{color:#475569}.exp-signature-code pre em{color:#c084fc}.exp-signature-code pre strong{color:#34d399}.exp-signature-code pre span{color:#64748b}

/* Analysis board: metrics and chart dominate the result side. */
body[data-workspace=analyze] #expansion-app{grid-template-columns:minmax(18rem,4fr) minmax(0,7fr)}
body[data-workspace=analyze] .exp-workspace-strip{border-radius:1.4rem 1.4rem .45rem .45rem}
body[data-workspace=analyze] .exp-result-deck>.panel{border-radius:1.4rem;background:radial-gradient(circle at 88% 12%,rgba(var(--tool-accent-rgb),.13),transparent 15rem),rgba(10,18,32,.9)}
body[data-workspace=analyze] .metric-grid{grid-template-columns:repeat(3,1fr)}
body[data-workspace=analyze] .metric{min-height:5rem;display:grid;align-content:center}
.exp-signature-analyze{display:grid;grid-template-columns:1fr 7rem 2.5rem;align-items:center;gap:1rem;padding:.85rem 1rem;border-radius:1rem;background:linear-gradient(135deg,rgba(var(--tool-accent-rgb),.1),rgba(5,12,23,.72))}.exp-signature-analyze>div{display:flex;align-items:end;gap:.4rem;height:5.4rem;border-bottom:1px solid rgba(var(--tool-accent-rgb),.22)}.exp-signature-analyze>div i{flex:1;height:var(--bar);border-radius:.3rem .3rem 0 0;background:linear-gradient(var(--tool-secondary),var(--tool-accent));opacity:.75}.exp-signature-analyze>span{display:grid;gap:.35rem}.exp-signature-analyze>span b{font:800 .7rem "Fira Code",monospace;letter-spacing:.12em;color:var(--tool-accent)}.exp-signature-analyze>span small{font-size:.65rem;color:#7d8ca2}.exp-signature-analyze>svg{color:var(--tool-accent)}

/* Business dashboard: compact inputs and high-visibility forecast card. */
body[data-workspace=finance] #expansion-app{grid-template-columns:minmax(19rem,5fr) minmax(0,7fr)}
body[data-workspace=finance] .exp-workspace-strip{border-radius:1.2rem;background:linear-gradient(105deg,rgba(var(--tool-accent-rgb),.16),rgba(8,17,29,.86))}
body[data-workspace=finance] .exp-control-deck{border-radius:1.2rem .35rem .35rem 1.2rem}
body[data-workspace=finance] .exp-result-deck>.panel{border-radius:.35rem 1.2rem 1.2rem .35rem}
body[data-workspace=finance] .metric-grid{grid-template-columns:repeat(3,1fr)}
body[data-workspace=finance] .metric b{font-size:1.15rem}
.exp-signature-finance{display:grid;grid-template-columns:5.5rem 1fr 7rem;align-items:end;gap:1rem;padding:.85rem 1rem;border-radius:1rem;background:linear-gradient(135deg,rgba(var(--tool-accent-rgb),.12),rgba(3,12,20,.8))}.exp-finance-ring{display:grid;place-items:center;width:4.7rem;height:4.7rem;border-radius:50%;color:var(--tool-accent);background:conic-gradient(var(--tool-accent) 0 72%,rgba(var(--tool-accent-rgb),.12) 72%);box-shadow:inset 0 0 0 .75rem #0a1523}.exp-finance-ring svg{width:1.35rem}.exp-finance-bars{display:flex;align-items:end;gap:.38rem;height:5rem;border-bottom:1px solid rgba(var(--tool-accent-rgb),.2)}.exp-finance-bars i{flex:1;height:35%;border-radius:.25rem .25rem 0 0;background:linear-gradient(var(--tool-secondary),var(--tool-accent))}.exp-finance-bars i:nth-child(2){height:52%}.exp-finance-bars i:nth-child(3){height:44%}.exp-finance-bars i:nth-child(4){height:78%}.exp-finance-bars i:nth-child(5){height:92%}.exp-signature-finance>span{display:grid;gap:.3rem}.exp-signature-finance>span b{font:800 .66rem "Fira Code",monospace;color:var(--tool-accent);letter-spacing:.12em}.exp-signature-finance>span small{font-size:.62rem;color:#7f8da1}

/* Engineering bench: instrument controls, schematic and live readouts. */
body[data-workspace=engineering] #expansion-app{grid-template-columns:minmax(19rem,5fr) minmax(0,7fr)}
body[data-workspace=engineering] .exp-workspace-strip{border-radius:.25rem;border-width:2px;background-image:linear-gradient(rgba(var(--tool-accent-rgb),.07) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--tool-accent-rgb),.07) 1px,transparent 1px);background-size:18px 18px}
body[data-workspace=engineering] .exp-control-deck,body[data-workspace=engineering] .exp-result-deck>.panel{border-radius:.25rem;border-width:2px}
body[data-workspace=engineering] .field-grid{gap:.7rem}
body[data-workspace=engineering] .input,body[data-workspace=engineering] .select{border-radius:.2rem;font-family:"Fira Code",monospace}
body[data-workspace=engineering] .metric{border-radius:.2rem;border-left:3px solid var(--tool-accent)}
.exp-signature-engineering{display:grid;grid-template-columns:2.4rem 1fr 4.4rem 1fr 2.4rem;align-items:center;padding:1rem;border-radius:.2rem;background-image:linear-gradient(rgba(var(--tool-accent-rgb),.055) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--tool-accent-rgb),.055) 1px,transparent 1px);background-size:16px 16px}.exp-schematic-node{display:grid;place-items:center;width:2rem;height:2rem;border:2px solid var(--tool-accent);border-radius:50%;font:700 1rem "Fira Code",monospace;color:var(--tool-accent);background:#071321}.exp-wire{height:2px;background:var(--tool-accent);box-shadow:0 0 10px rgba(var(--tool-accent-rgb),.6)}.exp-component{display:grid;place-items:center;width:4rem;height:3.2rem;border:2px solid var(--tool-secondary);color:var(--tool-secondary);background:rgba(var(--tool-secondary-rgb),.08)}.exp-component svg{width:1.45rem}.exp-signature-engineering small{position:absolute;left:.6rem;bottom:.35rem;font:500 .5rem "Fira Code",monospace;color:#64748b;letter-spacing:.08em}
body[data-tool=resistor-color-code-calculator] .exp-component{border-radius:999px;background:linear-gradient(90deg,#d6b27a 0 18%,#78350f 18% 24%,#0f172a 24% 31%,#ef4444 31% 38%,#d6b27a 38% 70%,#fbbf24 70% 77%,#d6b27a 77%)}
body[data-tool=capacitor-code-converter] .exp-component{width:3rem;border:0;border-left:5px double var(--tool-secondary);border-right:5px double var(--tool-secondary);background:transparent}
body[data-tool=battery-runtime-calculator] .exp-component{border-radius:.35rem;box-shadow:inset 2.6rem 0 rgba(var(--tool-accent-rgb),.22)}
body[data-tool=temperature-unit-converter] .exp-component{width:1.5rem;border-radius:999px;background:linear-gradient(0deg,#fb7185,var(--tool-accent))}
body[data-tool=pressure-unit-converter] .exp-component{border-radius:50%;background:conic-gradient(from 225deg,var(--tool-accent),var(--tool-secondary),transparent 72%)}

/* Planning board: a full-width timeline instead of calculator columns. */
body[data-workspace=planner] #expansion-app{grid-template-columns:1fr}
body[data-workspace=planner] .exp-workspace-strip,body[data-workspace=planner] .exp-control-deck,body[data-workspace=planner] .exp-result-deck{grid-column:1/-1}
body[data-workspace=planner] .exp-workspace-strip{border-radius:1.2rem 1.2rem 0 0}
body[data-workspace=planner] .exp-control-deck{border-radius:0;display:grid;grid-template-columns:minmax(12rem,14rem) 1fr;gap:1rem 1.4rem}
body[data-workspace=planner] .exp-control-deck>.panel-title,body[data-workspace=planner] .exp-control-deck>.exp-privacy{grid-column:1/-1}
body[data-workspace=planner] .exp-control-deck>.field-grid{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr))}
body[data-workspace=planner] .exp-primary-actions{grid-column:1/-1}
body[data-workspace=planner] .exp-result-deck>.panel{border-radius:0 0 1.2rem 1.2rem}
.exp-signature-planner{display:grid;grid-template-columns:repeat(3,1fr) 3rem;align-items:center;gap:.55rem;padding:1rem;border-radius:.85rem;background:linear-gradient(90deg,rgba(var(--tool-accent-rgb),.1),rgba(5,12,22,.75))}.exp-signature-planner>div{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.25rem .5rem}.exp-signature-planner>div span{grid-column:1/-1;font:500 .55rem "Fira Code",monospace;color:#64748b}.exp-signature-planner>div i{height:.55rem;border-radius:1rem;background:linear-gradient(90deg,var(--tool-accent),var(--tool-secondary))}.exp-signature-planner>div b{font:700 .57rem "Fira Code",monospace;color:#a9bad0}.exp-signature-planner>em{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:.8rem;color:var(--tool-accent);background:rgba(var(--tool-accent-rgb),.1)}.exp-signature-planner>em svg{width:1.2rem}
body[data-tool=pomodoro-session-planner] .exp-signature-planner>div i{height:1rem;border-radius:50%;max-width:1rem}
body[data-tool=time-block-schedule-generator] .exp-signature-planner>div{border-left:3px solid var(--tool-accent);padding-left:.65rem}

body[data-expansion-tool] .seo{margin-top:3.4rem}
body[data-expansion-tool] .seo>.panel{position:relative;border-color:rgba(var(--tool-accent-rgb),.15);background:linear-gradient(155deg,rgba(20,30,48,.76),rgba(12,20,34,.72));overflow:hidden}
body[data-expansion-tool] .seo>.panel::before{content:"";position:absolute;left:0;top:1.1rem;bottom:1.1rem;width:2px;background:linear-gradient(transparent,var(--tool-accent),transparent);opacity:.75}
body[data-expansion-tool] .seo h2{display:flex;align-items:center;gap:.6rem}
body[data-expansion-tool] .seo h2::before{content:"";width:.55rem;height:.55rem;border-radius:50%;background:var(--tool-accent);box-shadow:0 0 14px var(--tool-accent)}
body[data-expansion-tool] .faq summary:hover{color:var(--tool-accent)}
body[data-expansion-tool] .faq summary::after{color:var(--tool-accent)}

/* Shared hero primitives */
.exp-hero-visual,.exp-hero-copy{position:relative;z-index:1}
.exp-hero-visual{width:max-content;margin-inline:auto}
.exp-hero-copy>p{max-width:46rem;margin-inline:auto;color:var(--muted);font-size:clamp(.92rem,2vw,1.04rem);line-height:1.75}
.exp-orbit{position:absolute;inset:50% auto auto 50%;border:1px solid rgba(var(--tool-accent-rgb),.24);border-radius:50%;pointer-events:none}
.exp-orbit-one{width:6.3rem;height:6.3rem;transform:translate(-50%,-50%)}
.exp-orbit-two{width:8.5rem;height:8.5rem;transform:translate(-50%,-50%);border-style:dashed;opacity:.48}

/* 01 Aurora: centered, orbital and atmospheric */
body[data-layout=aurora] .expansion-hero{padding-top:2.45rem;border-radius:2rem}
body[data-layout=aurora] .exp-hero-visual{margin-bottom:1.15rem}
body[data-layout=aurora] .exp-hero-icon{border-radius:50%;transform:none}
body[data-layout=aurora] .exp-orbit-two{animation:expansion-orbit 18s linear infinite}
body[data-layout=aurora] .exp-panel{border-radius:1.5rem}
body[data-layout=aurora] .exp-input-panel{background-image:radial-gradient(circle at 0 0,rgba(var(--tool-accent-rgb),.13),transparent 17rem)}
@keyframes expansion-orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}

/* 02 Split: asymmetric product landing page */
body[data-layout=split] .expansion-hero{max-width:72rem;display:grid;grid-template-columns:minmax(0,1fr) 12rem;grid-template-areas:"copy visual";align-items:center;gap:2.5rem;text-align:left;padding:2.4rem 3rem}
body[data-layout=split] .exp-hero-copy{grid-area:copy}
body[data-layout=split] .exp-hero-visual{grid-area:visual}
body[data-layout=split] .exp-hero-icon{width:7.4rem;height:7.4rem;margin:0;border-radius:2rem;transform:rotate(6deg)}
body[data-layout=split] .exp-hero-icon svg{width:3rem;height:3rem}
body[data-layout=split] .expansion-hero h1{font-size:clamp(2.2rem,5vw,3.5rem)}
body[data-layout=split] .exp-hero-copy>p{margin-inline:0;max-width:39rem}
body[data-layout=split] .exp-hero-points{justify-content:flex-start}
body[data-layout=split] #expansion-app{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
body[data-layout=split] .exp-input-panel{border-radius:1.5rem .65rem 1.5rem .65rem}
body[data-layout=split] .exp-result-panel{border-radius:.65rem 1.5rem .65rem 1.5rem}

/* 03 Blueprint: precise grid, sharper engineering surfaces */
body[data-layout=blueprint] .expansion-hero{max-width:70rem;text-align:left;border-radius:.45rem;border-width:2px;padding:2rem 2.2rem 2rem 8.2rem;background-image:linear-gradient(rgba(var(--tool-accent-rgb),.09) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--tool-accent-rgb),.09) 1px,transparent 1px),linear-gradient(145deg,rgba(var(--tool-accent-rgb),.1),rgba(9,18,33,.9));background-size:22px 22px,22px 22px,auto}
body[data-layout=blueprint] .exp-hero-visual{position:absolute;left:2rem;top:50%;transform:translateY(-50%)}
body[data-layout=blueprint] .exp-hero-icon{margin:0;border-radius:.3rem;transform:none}
body[data-layout=blueprint] .exp-orbit{border-radius:.25rem}
body[data-layout=blueprint] .exp-hero-copy>p{margin-inline:0}
body[data-layout=blueprint] .exp-hero-points{justify-content:flex-start}
body[data-layout=blueprint] .badge,body[data-layout=blueprint] .expansion-hero h1,body[data-layout=blueprint] .exp-panel-title{font-family:"Fira Code",monospace}
body[data-layout=blueprint] .exp-panel,body[data-layout=blueprint] .input,body[data-layout=blueprint] .select,body[data-layout=blueprint] .textarea,body[data-layout=blueprint] .code{border-radius:.35rem}
body[data-layout=blueprint] .exp-panel::after{content:"";position:absolute;right:.55rem;top:.55rem;width:.5rem;height:.5rem;border-top:1px solid var(--tool-accent);border-right:1px solid var(--tool-accent);opacity:.7}

/* 04 Terminal: command window with compact mono rhythm */
body[data-layout=terminal] .expansion-hero{max-width:68rem;text-align:left;border-radius:.75rem;padding:3.6rem 2rem 1.9rem;background:linear-gradient(160deg,rgba(2,8,18,.97),rgba(var(--tool-accent-rgb),.075));box-shadow:0 28px 80px -46px rgba(var(--tool-accent-rgb),.8),inset 0 0 0 1px rgba(255,255,255,.02)}
body[data-layout=terminal] .expansion-hero::before{width:.62rem;height:.62rem;left:1.25rem;top:1.25rem;transform:none;filter:none;opacity:1;background:#fb7185;box-shadow:1rem 0 #fbbf24,2rem 0 #34d399}
body[data-layout=terminal] .expansion-hero::after{animation:none;inset:2.7rem 0 auto;height:1px;transform:none;background:rgba(var(--tool-accent-rgb),.15)}
body[data-layout=terminal] .exp-hero-visual{position:absolute;right:1.7rem;top:3.8rem;margin:0;opacity:.9}
body[data-layout=terminal] .exp-hero-icon{width:3rem;height:3rem;margin:0;border-radius:.45rem;transform:none}
body[data-layout=terminal] .exp-orbit{display:none}
body[data-layout=terminal] .expansion-hero h1,body[data-layout=terminal] .badge,body[data-layout=terminal] .exp-panel-title,body[data-layout=terminal] .field label{font-family:"Fira Code",monospace}
body[data-layout=terminal] .expansion-hero h1::before{content:"> ";color:var(--tool-accent)}
body[data-layout=terminal] .exp-hero-copy>p{max-width:50rem;margin-inline:0;padding-right:4.5rem}
body[data-layout=terminal] .exp-hero-points{justify-content:flex-start}
body[data-layout=terminal] .exp-panel{border-radius:.55rem;background:linear-gradient(160deg,rgba(3,10,20,.96),rgba(8,19,31,.92))}
body[data-layout=terminal] .exp-panel::before{left:1rem;right:1rem;height:1px}
body[data-layout=terminal] .btn{border-radius:.35rem}

/* 05 Glass: soft translucent layers and floating cards */
body[data-layout=glass] .expansion-hero{max-width:67rem;border-radius:3rem;padding-block:2.7rem;background:linear-gradient(135deg,rgba(var(--tool-accent-rgb),.14),rgba(255,255,255,.035),rgba(var(--tool-secondary-rgb),.12));backdrop-filter:blur(24px);box-shadow:0 30px 90px -50px rgba(var(--tool-accent-rgb),.95),inset 0 1px rgba(255,255,255,.12)}
body[data-layout=glass] .exp-hero-icon{width:4.8rem;height:4.8rem;border-radius:1.8rem;transform:rotate(-8deg);background:rgba(var(--tool-accent-rgb),.12);backdrop-filter:blur(15px)}
body[data-layout=glass] .exp-orbit-one{width:7.5rem;height:7.5rem}
body[data-layout=glass] .exp-orbit-two{display:none}
body[data-layout=glass] .exp-panel{border-radius:2rem;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(10,20,36,.78));backdrop-filter:blur(24px)}
body[data-layout=glass] .exp-panel-icon{border-radius:50%}
body[data-layout=glass] .input,body[data-layout=glass] .select,body[data-layout=glass] .textarea,body[data-layout=glass] .code{border-radius:1rem}

/* 06 Editorial: strong type, open canvas and accent rule */
body[data-layout=editorial] .expansion-hero{max-width:72rem;display:grid;grid-template-columns:5rem minmax(0,1fr);gap:1.35rem;text-align:left;border:0;border-left:.35rem solid var(--tool-accent);border-radius:0;padding:1.35rem 1.2rem 1.5rem 2rem;background:transparent;box-shadow:none;overflow:visible}
body[data-layout=editorial] .expansion-hero::before,body[data-layout=editorial] .expansion-hero::after{display:none}
body[data-layout=editorial] .exp-hero-icon{width:4rem;height:4rem;margin:.15rem 0 0;border:0;border-radius:0;background:transparent;box-shadow:none;transform:none}
body[data-layout=editorial] .exp-hero-icon svg{width:2.5rem;height:2.5rem}
body[data-layout=editorial] .exp-orbit{display:none}
body[data-layout=editorial] .expansion-hero h1{max-width:54rem;font-size:clamp(2.5rem,6vw,4.2rem);line-height:1.02;margin-block:1rem .8rem}
body[data-layout=editorial] .exp-hero-copy>p{max-width:49rem;margin-inline:0;font-size:1.02rem}
body[data-layout=editorial] .exp-hero-points{justify-content:flex-start}
body[data-layout=editorial] #expansion-app{grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:2rem}
body[data-layout=editorial] .exp-panel{border-width:0 0 0 2px;border-radius:0;box-shadow:none;background:linear-gradient(90deg,rgba(var(--tool-accent-rgb),.06),transparent)}
body[data-layout=editorial] .exp-panel::before{display:none}

/* 07 Neon: luminous edges and angular visual marker */
body[data-layout=neon] .expansion-hero{max-width:68rem;border-color:rgba(var(--tool-accent-rgb),.56);border-radius:.8rem;box-shadow:0 0 0 1px rgba(var(--tool-secondary-rgb),.18),0 0 42px -16px rgba(var(--tool-accent-rgb),.75),inset 0 0 55px rgba(var(--tool-accent-rgb),.04)}
body[data-layout=neon] .expansion-hero::before{top:-20rem;opacity:.36}
body[data-layout=neon] .exp-hero-icon{width:4.5rem;height:4.5rem;border-radius:.6rem;transform:rotate(45deg);box-shadow:0 0 26px rgba(var(--tool-accent-rgb),.24)}
body[data-layout=neon] .exp-hero-icon svg{transform:rotate(-45deg)}
body[data-layout=neon] .exp-orbit{border-color:rgba(var(--tool-secondary-rgb),.4);box-shadow:0 0 16px rgba(var(--tool-secondary-rgb),.16)}
body[data-layout=neon] .expansion-hero h1 span{text-shadow:0 0 28px rgba(var(--tool-accent-rgb),.3)}
body[data-layout=neon] .exp-panel{border-radius:.7rem;box-shadow:0 0 0 1px rgba(var(--tool-secondary-rgb),.08),0 22px 62px -34px rgba(var(--tool-accent-rgb),.75)}
body[data-layout=neon] .exp-panel-icon{transform:rotate(45deg);border-radius:.3rem}
body[data-layout=neon] .exp-panel-icon svg{transform:rotate(-45deg)}

/* 08 Compact: dashboard header and dense workspace */
body[data-layout=compact] .expansion-hero{max-width:72rem;display:grid;grid-template-columns:4.5rem minmax(0,1fr);align-items:center;gap:1.2rem;text-align:left;padding:1.25rem 1.5rem;border-radius:1rem}
body[data-layout=compact] .expansion-hero::before{left:auto;right:-8rem;top:-10rem;transform:none}
body[data-layout=compact] .exp-hero-icon{width:3.8rem;height:3.8rem;margin:0;border-radius:1rem;transform:none}
body[data-layout=compact] .exp-orbit{display:none}
body[data-layout=compact] .expansion-hero h1{font-size:clamp(1.7rem,4vw,2.5rem);margin:.55rem 0 .35rem}
body[data-layout=compact] .exp-hero-copy>p{margin-inline:0;line-height:1.55}
body[data-layout=compact] .exp-hero-points{justify-content:flex-start;margin-top:.65rem}
body[data-layout=compact] #expansion-app{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.9rem}
body[data-layout=compact] .exp-panel{border-radius:.8rem;padding:.85rem}
body[data-layout=compact] .exp-panel-title{margin-bottom:.7rem}
body[data-layout=compact] .field-grid{gap:.6rem}

html[data-hub-theme] body[data-expansion-tool] .panel{--accent:var(--tool-accent)!important;--warm:var(--tool-secondary)!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-expansion-tool]{background-image:radial-gradient(circle at 12% 12%,rgba(var(--tool-accent-rgb),.1),transparent 30rem),radial-gradient(circle at 88% 32%,rgba(var(--tool-secondary-rgb),.08),transparent 32rem),linear-gradient(to right,color-mix(in srgb,var(--th-border) 22%,transparent) 1px,transparent 1px),linear-gradient(to bottom,color-mix(in srgb,var(--th-border) 22%,transparent) 1px,transparent 1px)!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-expansion-tool] .exp-panel,
html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-expansion-tool] .seo>.panel{border-color:color-mix(in srgb,var(--tool-accent) 25%,var(--th-border))!important;background:linear-gradient(150deg,color-mix(in srgb,var(--tool-accent) 5%,var(--th-panel)),var(--th-panel))!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-expansion-tool] .input,
html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-expansion-tool] .select,
html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-expansion-tool] .textarea,
html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-expansion-tool] .code{border-color:color-mix(in srgb,var(--tool-accent) 24%,var(--th-border))!important}
html[data-hub-theme=light] body[data-expansion-tool]::before,
html[data-hub-theme=light] body[data-expansion-tool]::after{opacity:.09}
html[data-hub-theme=light] body[data-expansion-tool] .expansion-hero{background:linear-gradient(145deg,rgba(var(--tool-accent-rgb),.09),rgba(255,255,255,.88) 50%,rgba(var(--tool-secondary-rgb),.07));border-color:rgba(var(--tool-accent-rgb),.25);box-shadow:0 26px 80px -48px rgba(var(--tool-accent-rgb),.65)}
html[data-hub-theme=light] body[data-expansion-tool] .expansion-hero h1 span{background:linear-gradient(100deg,#172033 8%,var(--tool-accent) 58%,var(--tool-secondary));background-clip:text;-webkit-background-clip:text;color:transparent!important}
html[data-hub-theme=light] body[data-expansion-tool] .exp-hero-points{color:#52627a}
html[data-hub-theme=light] body[data-expansion-tool] .field label{color:#42526a}
html[data-hub-theme=light] body[data-expansion-tool] .btn:not(.primary){background:#f8fafc!important;color:#334155!important}
html[data-hub-theme=light] body[data-expansion-tool] .btn.primary{color:var(--tool-deep)!important}
html[data-hub-theme=light] body[data-expansion-tool] .metric{background:linear-gradient(145deg,rgba(var(--tool-accent-rgb),.08),#f8fafc)!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-layout=editorial] .exp-panel{background:linear-gradient(90deg,rgba(var(--tool-accent-rgb),.065),transparent)!important;box-shadow:none!important}
html[data-hub-theme=light] body[data-layout=terminal] .expansion-hero{background:linear-gradient(155deg,#172033,#26354d)}
html[data-hub-theme=light] body[data-layout=terminal] .expansion-hero h1 span{background:linear-gradient(100deg,#fff,var(--tool-accent),var(--tool-secondary));background-clip:text;-webkit-background-clip:text}
html[data-hub-theme=light] body[data-layout=blueprint] .expansion-hero{background-image:linear-gradient(rgba(var(--tool-accent-rgb),.12) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--tool-accent-rgb),.12) 1px,transparent 1px),linear-gradient(145deg,rgba(var(--tool-accent-rgb),.12),rgba(255,255,255,.92))}

/* Workspace structure takes precedence over decorative page layouts. */
body[data-workspace=transcode] #expansion-app.exp-workspace,body[data-workspace=textlab] #expansion-app.exp-workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
body[data-workspace=data] #expansion-app.exp-workspace{grid-template-columns:minmax(18rem,4fr) minmax(0,7fr)}
body[data-workspace=visual] #expansion-app.exp-workspace{grid-template-columns:minmax(17rem,21rem) minmax(0,1fr)}
body[data-workspace=protocol] #expansion-app.exp-workspace{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
body[data-workspace=code] #expansion-app.exp-workspace{grid-template-columns:minmax(17rem,4fr) minmax(0,8fr)}
body[data-workspace=analyze] #expansion-app.exp-workspace{grid-template-columns:minmax(18rem,4fr) minmax(0,7fr)}
body[data-workspace=finance] #expansion-app.exp-workspace,body[data-workspace=engineering] #expansion-app.exp-workspace{grid-template-columns:minmax(19rem,5fr) minmax(0,7fr)}
body[data-workspace=planner] #expansion-app.exp-workspace{grid-template-columns:1fr}
body[data-workspace=transcode] #expansion-app .exp-control-deck{border-radius:1.4rem 1.4rem .5rem 1.4rem}body[data-workspace=transcode] #expansion-app .exp-result-deck>.panel{border-radius:1.4rem 1.4rem 1.4rem .5rem}
body[data-workspace=data] #expansion-app .exp-panel,body[data-workspace=engineering] #expansion-app .exp-panel{border-radius:.35rem}
body[data-workspace=protocol] #expansion-app .exp-panel,body[data-workspace=code] #expansion-app .exp-panel{border-radius:.55rem}
body[data-workspace=textlab] #expansion-app .exp-panel{border-radius:.2rem}
body[data-workspace=planner] #expansion-app .exp-control-deck{border-radius:0}body[data-workspace=planner] #expansion-app .exp-result-deck>.panel{border-radius:0 0 1.2rem 1.2rem}

/* Individual compositions: different DOM and interaction hierarchy, not panel repositioning. */
body[data-composition] #expansion-app.exp-workspace{display:block}
.exp-custom{position:relative;width:100%;color:#dce7f4}.exp-custom h2{margin:0;color:#f1f5f9;font-size:1rem;font-weight:800}.exp-custom .field-grid{gap:.75rem}.exp-custom .exp-privacy,.exp-custom #exp-status{margin-top:.75rem}.exp-custom .exp-signature{margin:0}.exp-custom .preview:not(.hidden){margin-bottom:.75rem}.exp-custom .code{min-height:10rem}.exp-output-tools{gap:.4rem}

/* Aurora composition: central instrument stage with a console below. */
.exp-compose-orbit{padding:1rem;border:1px solid rgba(var(--tool-accent-rgb),.2);border-radius:2rem;background:radial-gradient(circle at 50% 18%,rgba(var(--tool-accent-rgb),.15),transparent 23rem),rgba(7,14,27,.72);box-shadow:0 30px 90px -50px rgba(var(--tool-accent-rgb),.8)}
.exp-compose-orbit>header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.2rem .3rem 1rem}.exp-compose-orbit>header>div:first-child{display:flex;align-items:center;gap:.6rem;font:700 .68rem "Fira Code",monospace;letter-spacing:.12em;color:var(--tool-accent)}.exp-compose-orbit>header>div:first-child svg{width:1.1rem}
.exp-orbit-stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(15rem,.8fr);align-items:center;gap:1rem;min-height:10rem;padding:1rem;border-radius:999px;border:1px solid rgba(var(--tool-accent-rgb),.22);background:linear-gradient(110deg,rgba(var(--tool-accent-rgb),.08),rgba(3,9,18,.78));overflow:hidden}.exp-orbit-stage::before,.exp-orbit-stage::after{content:"";position:absolute;border:1px dashed rgba(var(--tool-accent-rgb),.2);border-radius:50%;pointer-events:none}.exp-orbit-stage::before{width:14rem;height:14rem;left:-6rem}.exp-orbit-stage::after{width:8rem;height:8rem;right:-3rem}.exp-orbit-stage .metric-grid{position:relative;z-index:1;margin:0}
.exp-orbit-console{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;margin-top:1rem}.exp-orbit-console>div{padding:1rem;border:1px solid rgba(var(--tool-accent-rgb),.15);border-radius:1.25rem;background:rgba(9,17,31,.78)}.exp-orbit-console h2{margin-bottom:.85rem}.exp-orbit-console .row{margin-top:.85rem}

/* Split composition: source and target are separated by a physical transfer column. */
.exp-compose-split{display:grid;grid-template-columns:minmax(0,1fr) 5.5rem minmax(0,1fr);align-items:stretch;min-height:29rem}
.exp-split-source,.exp-split-target{padding:1.15rem;border:1px solid rgba(var(--tool-accent-rgb),.2);background:linear-gradient(160deg,rgba(19,30,48,.94),rgba(8,16,29,.9))}.exp-split-source{border-radius:1.5rem 0 0 1.5rem}.exp-split-target{border-radius:0 1.5rem 1.5rem 0}
.exp-split-source>header,.exp-split-target>header{display:flex;align-items:center;gap:.65rem;margin-bottom:1rem}.exp-split-source>header>span,.exp-split-target>header>span{font:800 .58rem "Fira Code",monospace;letter-spacing:.12em;color:var(--tool-accent)}.exp-split-target>header .exp-output-tools{margin-left:auto}.exp-split-source>.row{margin-top:.85rem}
.exp-split-transfer{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.65rem;border-block:1px solid rgba(var(--tool-accent-rgb),.2);background:linear-gradient(180deg,rgba(var(--tool-accent-rgb),.04),rgba(var(--tool-secondary-rgb),.11),rgba(var(--tool-accent-rgb),.04))}.exp-split-transfer::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:linear-gradient(transparent,var(--tool-accent),transparent);opacity:.5}.exp-split-transfer>svg{position:relative;width:1.4rem;color:var(--tool-accent)}.exp-split-transfer .primary{position:relative;writing-mode:vertical-rl;min-height:8rem;padding:.75rem}.exp-split-transfer small{position:relative;font:600 .5rem "Fira Code",monospace;color:#64748b}.exp-split-target .exp-signature{margin-bottom:.75rem}

/* Blueprint composition: parameter ledger, drawing sheet and bottom readout. */
.exp-compose-blueprint{display:grid;grid-template-columns:minmax(17rem,4fr) minmax(0,7fr);grid-template-areas:"head head" "controls drawing" "readout readout";border:2px solid rgba(var(--tool-accent-rgb),.32);border-radius:.25rem;background-color:#081421;background-image:linear-gradient(rgba(var(--tool-accent-rgb),.07) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--tool-accent-rgb),.07) 1px,transparent 1px);background-size:20px 20px}
.exp-compose-blueprint>header{grid-area:head;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem .85rem;border-bottom:2px solid rgba(var(--tool-accent-rgb),.25);background:rgba(4,12,22,.82)}.exp-compose-blueprint>header>div:first-child{display:flex;align-items:center;gap:.55rem;font:700 .65rem "Fira Code",monospace;color:var(--tool-accent);letter-spacing:.12em}.exp-compose-blueprint>header svg{width:1.05rem}
.exp-blueprint-controls{grid-area:controls;padding:1rem;border-right:2px solid rgba(var(--tool-accent-rgb),.22)}.exp-blueprint-controls h2,.exp-blueprint-readout h2{margin-bottom:.85rem;font-family:"Fira Code",monospace}.exp-blueprint-controls .field-grid{grid-template-columns:1fr}
.exp-blueprint-drawing{grid-area:drawing;position:relative;display:grid;align-content:center;gap:.75rem;min-height:20rem;padding:2rem 1.2rem 1rem}.exp-blueprint-drawing>span{position:absolute;right:.55rem;top:.4rem;font:500 .52rem "Fira Code",monospace;color:#64748b}.exp-blueprint-drawing .exp-signature{background-color:rgba(4,13,23,.6)}
.exp-blueprint-readout{grid-area:readout;padding:1rem;border-top:2px solid rgba(var(--tool-accent-rgb),.22);background:rgba(4,12,22,.72)}.exp-blueprint-readout .code{min-height:7rem}

/* Terminal composition: everything inside a single command window. */
.exp-compose-terminal{border:1px solid rgba(var(--tool-accent-rgb),.35);border-radius:.7rem;background:#030914;box-shadow:0 35px 90px -50px rgba(var(--tool-accent-rgb),.95);overflow:hidden;font-family:"Fira Code",monospace}
.exp-compose-terminal>header{display:flex;align-items:center;gap:.42rem;height:2.6rem;padding:0 .85rem;border-bottom:1px solid rgba(var(--tool-accent-rgb),.18);background:#091321}.exp-compose-terminal>header>i{width:.55rem;height:.55rem;border-radius:50%;background:#fb7185}.exp-compose-terminal>header>i:nth-child(2){background:#fbbf24}.exp-compose-terminal>header>i:nth-child(3){background:#34d399}.exp-compose-terminal>header>b{margin-left:.35rem;font-size:.62rem;color:#708198}.exp-compose-terminal>header .exp-output-tools{margin-left:auto}
.exp-terminal-body{display:grid;grid-template-columns:minmax(18rem,5fr) minmax(0,7fr);min-height:26rem}.exp-terminal-command,.exp-terminal-output{padding:1rem}.exp-terminal-command{border-right:1px solid rgba(var(--tool-accent-rgb),.18)}.exp-terminal-command>span,.exp-terminal-output>span{display:block;margin-bottom:.85rem;font-size:.66rem;color:var(--tool-accent)}.exp-terminal-command .field-grid{grid-template-columns:1fr}.exp-terminal-command .row{margin-top:.85rem}.exp-terminal-output .exp-signature{margin-bottom:.75rem}.exp-terminal-output .code{border:0;background:#020711;box-shadow:none}
.exp-compose-terminal>footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.55rem .85rem;border-top:1px solid rgba(var(--tool-accent-rgb),.18);background:#07101d}.exp-compose-terminal>footer #exp-status{flex:1;margin:0}.exp-compose-terminal>footer code{font-size:.52rem;color:#526177}

/* Glass composition: result is the main stage, controls float as an overlay card. */
.exp-compose-glass{position:relative;min-height:34rem;padding:1rem 1rem 1rem 17rem;border:1px solid rgba(var(--tool-accent-rgb),.2);border-radius:2.5rem;background:radial-gradient(circle at 18% 18%,rgba(var(--tool-accent-rgb),.18),transparent 17rem),linear-gradient(135deg,rgba(255,255,255,.055),rgba(8,16,29,.78));backdrop-filter:blur(22px);overflow:hidden}
.exp-glass-stage{min-height:31.8rem;padding:1rem;border:1px solid rgba(255,255,255,.08);border-radius:1.7rem;background:rgba(3,10,20,.56);box-shadow:inset 0 1px rgba(255,255,255,.05)}.exp-glass-stage>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.85rem}.exp-glass-stage>header>span{font:700 .62rem "Fira Code",monospace;color:var(--tool-accent);letter-spacing:.12em}.exp-glass-stage .exp-signature{min-height:10rem;margin-bottom:.8rem;border-radius:1.2rem}
.exp-glass-controls{position:absolute;z-index:2;left:1rem;top:2.2rem;width:17rem;max-height:29.5rem;overflow:auto;padding:1rem;border:1px solid rgba(var(--tool-accent-rgb),.26);border-radius:1.6rem;background:linear-gradient(150deg,rgba(27,39,60,.93),rgba(8,17,31,.92));box-shadow:1.3rem 1.3rem 3.5rem -1.5rem rgba(0,0,0,.9)}.exp-glass-controls h2{margin:.7rem 0 .9rem}.exp-glass-controls .field-grid{grid-template-columns:1fr}.exp-glass-controls .row{margin-top:.85rem}.exp-glass-orb{display:grid;place-items:center;width:3.2rem;height:3.2rem;border-radius:50%;color:var(--tool-accent);background:rgba(var(--tool-accent-rgb),.14);box-shadow:0 0 32px rgba(var(--tool-accent-rgb),.25)}.exp-glass-orb svg{width:1.35rem}

/* Editorial composition: a vertical document with numbered sections. */
.exp-compose-editorial{border-left:.35rem solid var(--tool-accent);padding-left:1.3rem;background:linear-gradient(90deg,rgba(var(--tool-accent-rgb),.055),transparent 50%)}
.exp-compose-editorial>header,.exp-editorial-result>header{display:grid;grid-template-columns:3.2rem 1fr auto;align-items:center;gap:1rem;padding:.7rem 0 1rem;border-bottom:1px solid rgba(var(--tool-accent-rgb),.18)}.exp-compose-editorial>header>span,.exp-editorial-result>header>span,.exp-editorial-insight>span{font:900 2rem/1 "Fira Code",monospace;color:rgba(var(--tool-accent-rgb),.42)}.exp-compose-editorial>header small{font:700 .58rem "Fira Code",monospace;color:var(--tool-accent);letter-spacing:.12em}.exp-compose-editorial>header h2{margin-top:.3rem;font-size:1.25rem}
.exp-editorial-fields{padding:1.2rem 0}.exp-editorial-fields .field-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.exp-editorial-insight{display:grid;grid-template-columns:3.2rem minmax(0,1fr) minmax(13rem,.65fr);align-items:center;gap:1rem;padding:1rem 0;border-block:1px solid rgba(var(--tool-accent-rgb),.18)}.exp-editorial-insight .exp-signature{border-width:0 0 0 1px;background:transparent}.exp-editorial-insight .metric-grid{margin:0}
.exp-editorial-result{padding-top:.5rem}.exp-editorial-result>header{grid-template-columns:3.2rem 1fr auto}.exp-editorial-result>.preview,.exp-editorial-result>.code,.exp-editorial-result>#exp-status{margin-left:4.2rem}.exp-editorial-result .code{min-height:8rem;border-radius:0;border-width:0 0 0 1px;background:linear-gradient(90deg,rgba(var(--tool-accent-rgb),.05),transparent)}

/* Neon composition: a visible three-stage processing pipeline. */
.exp-compose-neon{padding:1rem;border:1px solid rgba(var(--tool-accent-rgb),.5);border-radius:.7rem;background:linear-gradient(145deg,rgba(3,9,18,.96),rgba(var(--tool-accent-rgb),.045));box-shadow:0 0 0 1px rgba(var(--tool-secondary-rgb),.12),0 0 44px -18px rgba(var(--tool-accent-rgb),.75)}
.exp-compose-neon>header{display:flex;align-items:center;gap:.8rem;padding-bottom:.85rem;border-bottom:1px solid rgba(var(--tool-accent-rgb),.23)}.exp-compose-neon>header>svg{width:2rem;height:2rem;padding:.35rem;border:1px solid var(--tool-accent);color:var(--tool-accent);transform:rotate(45deg)}.exp-compose-neon>header>div{display:grid}.exp-compose-neon>header small{font:600 .54rem "Fira Code",monospace;color:#64748b}.exp-compose-neon>header h2{color:var(--tool-accent);font-family:"Fira Code",monospace}.exp-compose-neon>header .exp-output-tools{margin-left:auto}
.exp-neon-flow{display:grid;grid-template-columns:5rem 2rem minmax(14rem,1fr) 2rem 5rem;align-items:center;justify-content:center;gap:.6rem;max-width:49rem;margin:1rem auto}.exp-neon-flow>div:not(.exp-neon-core){display:grid;place-items:center;gap:.2rem;width:4.5rem;height:4.5rem;border:1px solid rgba(var(--tool-accent-rgb),.42);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:rgba(var(--tool-accent-rgb),.08)}.exp-neon-flow>div b{color:var(--tool-accent);font:800 .8rem "Fira Code",monospace}.exp-neon-flow>div span{font:600 .5rem "Fira Code",monospace;color:#718198}.exp-neon-flow>svg{color:var(--tool-secondary);filter:drop-shadow(0 0 8px var(--tool-secondary))}.exp-neon-core{position:relative}.exp-neon-core .exp-signature{min-height:8rem;border-color:rgba(var(--tool-accent-rgb),.5);box-shadow:inset 0 0 25px rgba(var(--tool-accent-rgb),.08)}.exp-neon-core .primary{position:absolute;left:50%;bottom:.45rem;transform:translateX(-50%);white-space:nowrap}.exp-neon-core .primary:hover{transform:translate(-50%,-2px)}
.exp-neon-grid{display:grid;grid-template-columns:minmax(17rem,4fr) minmax(0,7fr);gap:1rem}.exp-neon-grid>div{padding:1rem;border:1px solid rgba(var(--tool-accent-rgb),.22);background:rgba(5,12,23,.76)}.exp-neon-grid>div:first-child .field-grid{grid-template-columns:1fr}.exp-neon-grid>div:first-child .row{margin-top:.8rem}

/* Compact dashboard composition: summary first, dense controls and output below. */
.exp-compose-dashboard{display:grid;grid-template-columns:minmax(18rem,5fr) minmax(0,7fr);grid-template-areas:"head head" "summary summary" "controls output";gap:.65rem;padding:.65rem;border:1px solid rgba(var(--tool-accent-rgb),.2);border-radius:.9rem;background:rgba(7,14,26,.8)}
.exp-compose-dashboard>header{grid-area:head;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.45rem .55rem}.exp-compose-dashboard>header small{font:700 .55rem "Fira Code",monospace;color:var(--tool-accent);letter-spacing:.12em}.exp-compose-dashboard>header h2{margin-top:.18rem;font-size:.82rem;color:#94a3b8}
.exp-dashboard-summary{grid-area:summary;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(16rem,.8fr);align-items:center;gap:.65rem}.exp-dashboard-summary .exp-signature{min-height:6.5rem;border-radius:.6rem}.exp-dashboard-summary .metric-grid{margin:0}
.exp-dashboard-controls{grid-area:controls;padding:.8rem;border:1px solid rgba(var(--tool-accent-rgb),.15);border-radius:.65rem;background:rgba(12,21,36,.8)}.exp-dashboard-output{grid-area:output;padding:.8rem;border:1px solid rgba(var(--tool-accent-rgb),.15);border-radius:.65rem;background:rgba(4,10,20,.8)}.exp-dashboard-output .code{min-height:9rem}

@media(max-width:900px){.expansion-hero{padding-top:1.6rem}.exp-hero-icon{width:3.7rem;height:3.7rem}.expansion-hero h1{font-size:clamp(1.85rem,8vw,2.55rem)}body[data-expansion-tool] #expansion-app,body[data-layout=split] #expansion-app,body[data-layout=editorial] #expansion-app,body[data-layout=compact] #expansion-app,body[data-workspace] #expansion-app.exp-workspace{grid-template-columns:1fr;gap:1rem}}
@media(max-width:900px){
  .exp-orbit-stage{grid-template-columns:1fr;border-radius:1.2rem}.exp-orbit-console{grid-template-columns:1fr}
  .exp-compose-split{grid-template-columns:1fr;min-height:0}.exp-split-source{border-radius:1.2rem 1.2rem 0 0}.exp-split-target{border-radius:0 0 1.2rem 1.2rem}.exp-split-transfer{min-height:5rem;border-inline:1px solid rgba(var(--tool-accent-rgb),.2);border-block:0;flex-direction:row}.exp-split-transfer::before{left:0;right:0;top:50%;bottom:auto;width:auto;height:1px}.exp-split-transfer .primary{writing-mode:horizontal-tb;min-height:0}.exp-split-transfer>svg{transform:rotate(90deg)}
  .exp-compose-blueprint{grid-template-columns:1fr;grid-template-areas:"head" "controls" "drawing" "readout"}.exp-blueprint-controls{border-right:0;border-bottom:2px solid rgba(var(--tool-accent-rgb),.22)}.exp-blueprint-drawing{min-height:13rem}.exp-compose-blueprint>header{align-items:flex-start}.exp-compose-blueprint>header>.row{justify-content:flex-end}
  .exp-terminal-body{grid-template-columns:1fr}.exp-terminal-command{border-right:0;border-bottom:1px solid rgba(var(--tool-accent-rgb),.18)}
  .exp-compose-glass{min-height:0;padding:1rem}.exp-glass-controls{position:relative;left:auto;top:auto;width:auto;max-height:none;margin-top:1rem}.exp-glass-stage{min-height:0}
  .exp-editorial-fields .field-grid{grid-template-columns:1fr 1fr}.exp-editorial-insight{grid-template-columns:3.2rem 1fr}.exp-editorial-insight .metric-grid{grid-column:2}.exp-editorial-result>.preview,.exp-editorial-result>.code,.exp-editorial-result>#exp-status{margin-left:0}
  .exp-neon-grid{grid-template-columns:1fr}.exp-dashboard-summary{grid-template-columns:1fr}.exp-compose-dashboard{grid-template-columns:1fr;grid-template-areas:"head" "summary" "controls" "output"}
}
@media(max-width:720px){
  body[data-layout=split] .expansion-hero,body[data-layout=compact] .expansion-hero{grid-template-columns:1fr;grid-template-areas:"visual" "copy";text-align:center;gap:.7rem;padding:1.5rem 1rem}
  body[data-layout=split] .exp-hero-copy,body[data-layout=compact] .exp-hero-copy{grid-area:copy}
  body[data-layout=split] .exp-hero-visual,body[data-layout=compact] .exp-hero-visual{grid-area:visual;margin-inline:auto}
  body[data-layout=split] .exp-hero-icon{width:4rem;height:4rem;margin-inline:auto;border-radius:1.1rem}
  body[data-layout=split] .exp-hero-icon svg{width:1.8rem;height:1.8rem}
  body[data-layout=split] .exp-hero-copy>p,body[data-layout=compact] .exp-hero-copy>p{margin-inline:auto}
  body[data-layout=split] .exp-hero-points,body[data-layout=compact] .exp-hero-points{justify-content:center}
  body[data-layout=blueprint] .expansion-hero{padding:5.5rem 1rem 1.5rem;text-align:center}
  body[data-layout=blueprint] .exp-hero-visual{left:50%;top:1rem;transform:translateX(-50%)}
  body[data-layout=blueprint] .exp-hero-copy>p{margin-inline:auto}
  body[data-layout=blueprint] .exp-hero-points{justify-content:center}
  body[data-layout=editorial] .expansion-hero{grid-template-columns:1fr;text-align:center;border-left:0;border-top:.3rem solid var(--tool-accent);padding:1.35rem .5rem}
  body[data-layout=editorial] .exp-hero-visual{margin-inline:auto}
  body[data-layout=editorial] .exp-hero-icon{margin-inline:auto}
  body[data-layout=editorial] .exp-hero-copy>p{margin-inline:auto}
  body[data-layout=editorial] .exp-hero-points{justify-content:center}
}
@media(max-width:560px){body[data-expansion-tool] .tool-wrap{padding-top:.8rem}.expansion-hero{border-radius:1.15rem;padding:1.35rem .85rem 1.45rem;margin-bottom:1rem}.exp-hero-icon{width:3.3rem;height:3.3rem;border-radius:.95rem;margin-bottom:.75rem}.exp-hero-icon svg{width:1.65rem;height:1.65rem}.exp-hero-points{gap:.45rem .8rem;margin-top:.9rem}.exp-hero-points span{font-size:.68rem}body[data-expansion-tool] .exp-panel{border-radius:.9rem}body[data-expansion-tool] .metric-grid{grid-template-columns:1fr 1fr}body[data-layout=terminal] .exp-hero-visual{right:.85rem;top:3.4rem}body[data-layout=terminal] .exp-hero-copy>p{padding-right:0}body[data-layout=terminal] .expansion-hero h1{padding-right:2.8rem}body[data-layout=editorial] .expansion-hero{border-radius:0}}
@media(max-width:700px){
  body[data-workspace] .exp-workspace-strip{align-items:flex-start;border-radius:.85rem;padding:.65rem}.exp-workspace-signal em{display:none}.exp-workspace-signal{padding-top:.25rem}.exp-workspace-identity small{font-size:.62rem}
  body[data-workspace] .exp-control-deck,body[data-workspace] .exp-result-deck>.panel{padding:.85rem}.exp-result-chrome{margin:-.85rem -.85rem .8rem}
  body[data-workspace] .exp-control-deck>.panel-title,body[data-workspace] .exp-result-deck .panel-title{gap:.55rem}.exp-panel-kicker{font-size:.52rem}body[data-workspace] .panel-title h2{font-size:.88rem}
  body[data-workspace] .exp-signature{min-height:6.5rem}.exp-signature-analyze{grid-template-columns:1fr 5.4rem 1.8rem}.exp-signature-finance{grid-template-columns:4.2rem 1fr}.exp-signature-finance>span{display:none}.exp-finance-ring{width:3.7rem;height:3.7rem;box-shadow:inset 0 0 0 .6rem #0a1523}
  body[data-workspace=planner] .exp-control-deck{display:block}body[data-workspace=planner] .exp-control-deck>.field-grid{grid-template-columns:1fr 1fr;margin-top:1rem}.exp-signature-planner{grid-template-columns:1fr}.exp-signature-planner>em{position:absolute;right:.6rem;top:.6rem}.exp-signature-planner>div{padding-right:3rem}
  .exp-custom{border-radius:.75rem}.exp-custom .field-grid{grid-template-columns:1fr}.exp-compose-orbit{padding:.7rem}.exp-orbit-console>div{padding:.8rem}.exp-orbit-stage{padding:.7rem}.exp-compose-split header{flex-wrap:wrap}.exp-split-source,.exp-split-target{padding:.85rem}.exp-split-target>header .exp-output-tools{width:100%;margin-left:0}.exp-compose-blueprint>header{display:grid}.exp-compose-blueprint>header>.row{justify-content:flex-start;flex-wrap:wrap}.exp-compose-terminal>header>b{max-width:9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.exp-compose-terminal>header .exp-output-tools{margin-left:auto}.exp-terminal-command,.exp-terminal-output{padding:.8rem}.exp-compose-terminal>footer code{display:none}
  .exp-compose-editorial{padding-left:.75rem}.exp-compose-editorial>header,.exp-editorial-result>header{grid-template-columns:2.2rem 1fr}.exp-compose-editorial>header>.row,.exp-editorial-result>header>.exp-output-tools{grid-column:2}.exp-editorial-fields .field-grid{grid-template-columns:1fr}.exp-editorial-insight{grid-template-columns:2.2rem 1fr}.exp-editorial-insight .metric-grid{grid-column:1/-1}.exp-compose-editorial>header>span,.exp-editorial-result>header>span,.exp-editorial-insight>span{font-size:1.35rem}
  .exp-neon-flow{grid-template-columns:3.4rem 1.2rem minmax(9rem,1fr) 1.2rem 3.4rem;gap:.25rem}.exp-neon-flow>div:not(.exp-neon-core){width:3.2rem;height:3.2rem}.exp-neon-flow>svg{width:1rem}.exp-neon-core .exp-signature{min-height:7rem}.exp-compose-neon{padding:.7rem}.exp-compose-neon>header{flex-wrap:wrap}.exp-compose-neon>header .exp-output-tools{margin-left:auto}
  .exp-compose-dashboard>header{align-items:flex-start;flex-direction:column}.exp-compose-dashboard>header>.row{flex-wrap:wrap}.exp-dashboard-controls,.exp-dashboard-output{padding:.65rem}
}
@media(max-width:430px){body[data-workspace=planner] .exp-control-deck>.field-grid{grid-template-columns:1fr}.exp-workspace-signal span{display:none}.exp-signature-transcode{grid-template-columns:1fr 1.7rem 1fr}.exp-signature-engineering{grid-template-columns:1.8rem 1fr 3.2rem 1fr 1.8rem}.exp-component{width:3rem}.exp-signature-analyze>span{display:none}.exp-signature-analyze{grid-template-columns:1fr 2rem}}
@media(prefers-reduced-motion:reduce){.expansion-hero::after{animation:none}}

/* Interactive browser and device test surfaces. */
.exp-test-zone{min-height:180px;width:100%;border:1px dashed rgba(var(--tool-accent-rgb),.62);border-radius:18px;background:rgba(var(--tool-accent-rgb),.09);color:inherit;display:grid;place-items:center;padding:2rem;text-align:center;font-weight:800;cursor:crosshair;transition:.2s ease}
.exp-test-zone:hover,.exp-test-zone:focus,.exp-test-zone.active{outline:none;border-style:solid;background:rgba(var(--tool-accent-rgb),.16);box-shadow:0 0 0 4px rgba(var(--tool-accent-rgb),.12)}