.editor-page { max-width: 1440px; padding: 0 40px 46px; margin: 0 auto; }
.editor-intro { display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: 70px; padding: 58px 0 46px; }
.intro-copy > .eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 21px; color: var(--teal); }
.intro-copy h1 { font-size: clamp(3rem, 4.55vw, 4.55rem); line-height: 1.075; font-weight: 650; letter-spacing: -.055em; margin-bottom: 23px; }
.intro-copy h1 > span { color: var(--accent); }
.intro-copy > p { max-width: 460px; color: var(--muted); font-size: 1rem; line-height: 1.8; margin-bottom: 23px; }
.intro-meta { display: flex; flex-wrap: wrap; gap: 10px 24px; color: var(--quiet); font-size: .59rem; font-family: var(--mono); letter-spacing: .065em; }
.intro-meta > span + span { border-left: 1px solid var(--border-strong); padding-left: 24px; }
.signal-art { min-height: 285px; position: relative; display: flex; align-items: center; justify-content: center; isolation: isolate; background-image: linear-gradient(#9ec5a408 1px, transparent 1px), linear-gradient(90deg, #9ec5a408 1px, transparent 1px); background-size: 25px 25px; }
.signal-art::before { content: ""; position: absolute; width: 200px; height: 200px; background: #bfe7650c; filter: blur(50px); border-radius: 50%; z-index: -1; }
.art-node { width: 290px; border: 1px solid #547449; background: #1c2825; box-shadow: 11px 12px 0 #0d151780, 0 0 60px #bed64c07; transform: rotate(-4deg); border-radius: 7px; position: relative; }
.art-node::before, .art-node::after { content: ""; position: absolute; height: 9px; width: 9px; border: 2px solid var(--accent); background: #1c2825; border-radius: 50%; top: 34px; }
.art-node::before { left: -6px; }
.art-node::after { right: -6px; }
.art-node-header { display: flex; align-items: center; gap: 10px; padding: 14px 20px; font-family: var(--mono); font-size: .78rem; border-bottom: 1px solid #3d5141; }
.art-node-icon { color: var(--accent); font-size: 1.45rem; line-height: 1; }
.art-node-index { color: var(--quiet); margin-left: auto; }
.art-node-body { padding: 23px 20px 27px; }
.art-node-body > span { font-family: var(--mono); font-size: .58rem; letter-spacing: .1em; color: var(--quiet); }
.art-values { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; font-size: 1.3rem; font-weight: 500; }
.art-values > span:first-child { color: var(--muted); }
.art-arrow { color: #648767; font-size: 1.5rem; }
.art-values > strong { font-weight: 500; color: var(--accent); }
.art-node-footer { border-top: 1px solid #3d5141; padding: 13px 18px; color: #92ad85; font-family: var(--mono); font-size: .52rem; letter-spacing: .03em; }
.art-node-footer .status-dot { width: 4px; height: 4px; margin-right: 6px; vertical-align: middle; }
.art-orbit { position: absolute; border: 1px solid #80965835; width: 115px; height: 90px; z-index: -1; }
.art-orbit-one { border-left: 0; border-bottom: 0; right: 6%; top: 26px; border-radius: 0 22px 0 0; }
.art-orbit-two { border-top: 0; border-right: 0; left: 4%; bottom: 26px; border-radius: 0 0 0 22px; }
.art-coordinate { position: absolute; color: #6d827b; font-size: .55rem; letter-spacing: .13em; font-family: var(--mono); }
.art-coordinate-top { top: 4px; left: 6%; }
.art-coordinate-bottom { bottom: 0; right: 3%; }
.art-cross { position: absolute; font-family: var(--mono); font-size: 1.35rem; color: #668276; }
.art-cross-one { right: 2%; top: 0; }
.art-cross-two { left: 0; bottom: -5px; }
.start-grid { display: grid; grid-template-columns: minmax(0, 2.12fr) minmax(285px, 1fr); gap: 25px; }
.import-card { padding: 29px 30px 0; overflow: hidden; transition: border-color .15s, background .15s; }
.import-card.is-dragover { border-color: var(--accent); background: #253225; }
.import-card .section-heading { margin-bottom: 12px; }
.import-card .section-heading h2 { font-size: 1.68rem; }
.import-card > .muted { font-size: .86rem; margin-bottom: 22px; }
.import-card textarea.code-input { font-family: var(--mono); font-size: .8rem; line-height: 1.75; height: 175px; min-height: 120px; padding: 18px; border-color: #34433e; background: #111a1c; border-radius: 6px; color: #b7d5c8; }
.import-card textarea.code-input::placeholder { color: #7b9187; }
.import-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 21px 0 25px; }
.import-controls > .input-hint { margin-left: auto; max-width: 155px; font-size: .68rem; }
.sample-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 17px 30px; margin: 0 -30px; background: #1b2525; border-top: 1px solid var(--border); font-size: .8rem; color: var(--quiet); }
.sample-icon { color: var(--teal); margin-right: 4px; font-size: 1.3rem; line-height: 1; }
.sample-row .text-button { font-size: .8rem; }
.getting-started { background: #151e20; padding: 28px 29px 25px; }
.getting-started > .eyebrow { font-size: .58rem; }
.getting-started h2 { font-size: 1.8rem; line-height: 1.2; margin-bottom: 21px; }
.steps { list-style: none; padding: 0; margin: 0 0 22px; }
.steps > li { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 18px; }
.steps > li:last-child { margin: 0; }
.step-number { font-family: var(--mono); font-size: .63rem; color: var(--teal); border: 1px solid #3b5650; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 5px; flex: 0 0 auto; }
.steps h3 { font-size: .87rem; font-weight: 550; margin: 0 0 5px; }
.steps p { color: var(--quiet); font-size: .77rem; line-height: 1.65; max-width: 230px; }
.getting-started > .text-link { font-size: .76rem; border-top: 1px solid var(--border); padding-top: 16px; width: 100%; justify-content: space-between; }
.feature-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; padding: 31px 3px 0; }
.feature-strip > div { display: flex; gap: 14px; align-items: flex-start; }
.feature-strip .icon { color: #89a88a; width: 22px; height: 22px; margin-top: 2px; }
.feature-strip strong { display: block; font-weight: 500; color: #c2cdc5; font-size: .8rem; }
.feature-strip small { display: block; margin-top: 4px; color: var(--quiet); font-size: .7rem; }
.creator-promo { max-width: 1440px; margin: 0 auto; padding: 56px 40px 76px; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .75fr); gap: 46px; align-items: center; border-top: 1px solid var(--border); }
.creator-video { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--border-strong); border-radius: 10px; background: #080c0d; box-shadow: 0 24px 70px #0005; }
.creator-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.creator-promo-copy h2 { font-size: clamp(1.8rem, 3vw, 2.75rem); }
.creator-promo-copy > p:not(.eyebrow) { color: var(--muted); font-size: .92rem; max-width: 530px; }
.creator-promo-copy .actions { margin-top: 24px; }
.creator-video-fallback { display: inline-block; margin-top: 18px; color: var(--quiet); font-size: .72rem; }
.editor-feedback { margin-top: 22px; }
.workspace { padding-top: 32px; }
.workspace-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 25px; gap: 25px; }
.workspace-heading h1 { font-size: 2.1rem; margin-bottom: 8px; overflow-wrap: anywhere; }
.workspace-heading .eyebrow { font-size: .6rem; margin-bottom: 8px; }
.workspace-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 15px; font-size: .8rem; color: var(--quiet); }
.workspace-actions { display: flex; align-items: center; gap: 25px; flex: 0 0 auto; }
.advanced-toggle { display: flex; gap: 10px; align-items: center; position: relative; cursor: pointer; font-size: .8rem; color: var(--muted); white-space: nowrap; }
.advanced-toggle input { position: absolute; opacity: 0; width: 34px; height: 22px; margin: 0; }
.switch-track { width: 34px; height: 20px; background: #34433d; border: 1px solid #4e6254; border-radius: 15px; position: relative; transition: background .15s; }
.switch-track::after { content: ""; width: 12px; height: 12px; position: absolute; left: 3px; top: 3px; border-radius: 50%; background: #a5b7a8; transition: transform .15s; }
.advanced-toggle input:checked + .switch-track { background: var(--accent); border-color: var(--accent); }
.advanced-toggle input:checked + .switch-track::after { background: #22331d; transform: translateX(14px); }
.advanced-toggle input:focus-visible + .switch-track { outline: 2px solid var(--accent); outline-offset: 4px; }
.advanced-toggle:has(input:checked) { color: var(--accent); }
.workspace-grid { display: grid; grid-template-columns: 240px minmax(0, 1fr) 258px; gap: 20px; align-items: start; }
.navigator { padding: 0; position: sticky; top: 20px; overflow: hidden; }
.navigator-heading { list-style: none; display: flex; align-items: center; gap: 10px; padding: 19px 18px 15px; font-size: .87rem; font-weight: 550; cursor: pointer; }
.navigator-heading::-webkit-details-marker { display: none; }
.navigator-heading::after { content: "⌄"; color: var(--quiet); margin-left: auto; }
.navigator:not([open]) .navigator-heading::after { content: "›"; }
.navigator-count { color: var(--quiet); border: 1px solid var(--border); font-family: var(--mono); font-size: .59rem; border-radius: 4px; padding: 0 5px; }
.navigator-search { padding: 0 13px 15px; }
.navigator-search input { font-size: .76rem; padding: 8px 10px !important; border-color: var(--border) !important; }
.move-tree { max-height: 600px; max-height: min(62vh, 710px); overflow-y: auto; padding: 0 9px 12px; }
.tree-slot { margin-bottom: 13px; }
.tree-slot:last-child { margin-bottom: 0; }
.tree-skill { display: flex; width: 100%; gap: 10px; align-items: center; border: 1px solid transparent; padding: 9px 10px; text-align: left; background: none; border-radius: 5px; color: var(--text); font-size: .85rem; }
.tree-skill:hover { background: var(--surface-raised); }
.tree-skill.is-selected { background: #c5f16a0d; border-color: #7a9c504d; color: var(--accent); }
.tree-skill-number { border: 1px solid #456044; background: #a1d56608; font-family: var(--mono); color: var(--accent); font-size: .65rem; width: 25px; height: 25px; border-radius: 4px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.tree-skill-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-branch { margin: 3px 0 4px 13px; border-left: 1px solid #3b4842; }
.tree-branch > summary { color: var(--quiet); font-size: .7rem; font-family: var(--mono); padding: 7px 6px 5px 14px; cursor: pointer; overflow-wrap: anywhere; }
.tree-node { display: flex; width: calc(100% + 1px); margin-left: -1px; align-items: center; gap: 9px; padding: 7px 7px 7px 14px; background: transparent; border: 0; border-left: 2px solid transparent; color: var(--muted); font-size: .7rem; text-align: left; }
.tree-node:hover { background: var(--surface-raised); color: var(--text); }
.tree-node.is-selected { color: var(--accent); background: #c7f3750b; border-left-color: var(--accent); }
.tree-node-index { font-family: var(--mono); color: var(--quiet); min-width: 17px; font-size: .59rem; }
.tree-node-kind { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-node-marker { margin-left: auto; width: 4px; height: 4px; border-radius: 50%; background: var(--teal); flex: 0 0 auto; }
.navigator-footnote { border-top: 1px solid var(--border); color: var(--quiet); font-size: .65rem; padding: 12px 17px; margin: 0; }
.tree-empty { padding: 20px 10px; font-size: .8rem; color: var(--quiet); }
.inspector { padding: 0; overflow: hidden; min-height: 415px; }
.inspector-heading { display: flex; justify-content: space-between; gap: 20px; padding: 22px 24px 18px; }
.inspector-heading .eyebrow { font-size: .57rem; margin-bottom: 8px; color: var(--teal); }
.inspector-heading h2 { margin-bottom: 7px; font-size: 1.6rem; overflow-wrap: anywhere; }
.selection-path { font-family: var(--mono); font-size: .64rem; color: var(--quiet); overflow-wrap: anywhere; }
.node-type-mark { height: 36px; width: 36px; border: 1px solid #38524a; border-radius: 7px; background: #63bb9b06; display: flex; align-items: center; justify-content: center; font-family: var(--mono); font-size: 1.2rem; color: var(--teal); flex: 0 0 auto; }
.inspector-tabs { display: flex; padding: 0 24px; gap: 25px; border-bottom: 1px solid var(--border); }
.inspector-tab { background: none; color: var(--quiet); border: 0; border-bottom: 2px solid transparent; font-size: .79rem; padding: 11px 0 13px; }
.inspector-tab.is-active { color: var(--accent); border-bottom-color: var(--accent); }
.inspector-tab .tiny-badge { margin-left: 5px; }
.field-list { padding: 0 24px; }
.field-row { display: grid; grid-template-columns: minmax(110px, .85fr) minmax(130px, 1fr); align-items: start; gap: 16px; border-bottom: 1px solid var(--border); padding: 18px 0; }
.field-row:last-child { border-bottom: 0; }
.field-label { padding-top: 7px; min-width: 0; }
.field-label > label { display: block; font-size: .8rem; overflow-wrap: anywhere; }
.field-key { font-family: var(--mono); font-size: .57rem; letter-spacing: .01em; color: var(--quiet); display: block; margin-top: 4px; overflow-wrap: anywhere; }
.field-help { display: block; color: var(--quiet); font-size: .69rem; line-height: 1.65; margin-top: 5px; }
.field-help a { color: var(--teal); }
.field-control { min-width: 0; }
.field-control input:not([type="checkbox"]), .field-control select { font-size: .81rem; font-family: var(--mono); padding: 9px 10px; }
.field-control .field-value-readonly { padding: 10px; border: 1px solid var(--border); border-radius: 5px; color: var(--muted); background: var(--surface-deep); display: block; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 180px; overflow-y: auto; font-size: .73rem; }
.field-control > .type-select { margin-top: 7px; font-size: .6rem; color: var(--quiet); padding: 5px 7px; background: none; border-color: var(--border); }
.field-control.is-changed > input, .field-control.is-changed > select, .field-control.is-changed > .boolean-control { border-color: #859b55; }
.boolean-control { display: flex; align-items: center; gap: 10px; min-height: 40px; background: var(--surface-deep); border: 1px solid var(--border-strong); border-radius: 5px; padding: 8px 10px; }
.boolean-control label { color: var(--muted); font-family: var(--mono); font-size: .79rem; cursor: pointer; }
.boolean-control input { cursor: pointer; margin: 0; }
.advanced-field-heading { color: var(--warning); font-family: var(--mono); font-size: .62rem; letter-spacing: .07em; margin: 0 -24px; padding: 15px 24px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: #e0ba6705; }
.field-preserved-note { color: var(--quiet); font-size: .73rem; padding: 16px 0; }
.field-preserved-note > button { color: var(--teal); font-size: inherit; }
.inspector-form-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 24px; background: var(--surface-deep); border-top: 1px solid var(--border); }
.inspector-form-footer .input-hint { font-size: .67rem; max-width: 195px; }
.inspector-form-footer .button { white-space: nowrap; }
.raw-panel { padding: 20px 24px 0; }
.raw-panel .field { margin-bottom: 11px; }
.raw-panel .input-hint { font-size: .72rem; }
.raw-json { font-family: var(--mono); font-size: .72rem; line-height: 1.65; tab-size: 2; min-height: 300px; resize: vertical; white-space: pre; overflow-x: auto; }
.raw-panel .inspector-form-footer { margin: 20px -24px 0; }
.workspace-context { display: flex; flex-direction: column; gap: 19px; }
.workspace-context > .card { padding: 22px; }
.workspace-context .eyebrow { font-size: .54rem; }
.workspace-context h3 { font-size: 1.07rem; }
.summary-list { font-size: .76rem; margin: 21px 0 19px; }
.summary-list > div { display: flex; justify-content: space-between; gap: 15px; margin-bottom: 10px; }
.summary-list dt { color: var(--quiet); }
.summary-list dd { color: var(--text); font-family: var(--mono); font-size: .73rem; margin: 0; }
.preservation-note { border-top: 1px solid var(--border); padding-top: 16px; display: flex; align-items: flex-start; gap: 10px; }
.preservation-note .icon { width: 17px; height: 17px; color: var(--teal); margin-top: 2px; }
.preservation-note p { font-size: .72rem; color: var(--quiet); }
.field-notes { background: transparent; border-style: dashed; }
.field-notes p { font-size: .77rem; color: var(--quiet); }
.field-notes .text-link { font-size: .72rem; }
.experiment-builder { border-color: #486450; }
.experiment-builder .eyebrow { color: var(--teal); }
.experiment-builder p { font-size: .76rem; }
.experiment-builder label { font-size: .73rem; }
.experiment-builder select, .experiment-builder textarea { font-size: .72rem; padding: 9px 10px; }
.experiment-builder textarea { font-family: var(--mono); }
.experiment-builder .field small { font-size: .65rem; }
.variant-current { font-size: .65rem; display: flex; flex-direction: column; gap: 4px; margin: -7px 0 17px; color: var(--quiet); }
.variant-current code { color: var(--teal); font-size: .95em; max-height: 65px; overflow: auto; }
.experiment-builder .button { font-size: .75rem; padding: 9px 11px; min-height: 39px; }
.diagnostics:empty { display: none; }
.diagnostic { border: 1px solid #385652; background: #18302c; border-radius: 5px; color: #adcec1; padding: 11px 14px; margin-bottom: 13px; font-size: .76rem; overflow-wrap: anywhere; }
.diagnostic.warning { border-color: #605139; background: #2d291f; color: #e4c794; }
.diagnostic.error { border-color: #794940; background: #382825; color: #f4b4a8; }
.diagnostic strong { font-weight: 550; }
.export-bar { position: sticky; bottom: 16px; z-index: 15; border: 1px solid #435344; border-radius: 8px; padding: 17px 20px; margin-top: 26px; background: #1c2825f5; backdrop-filter: blur(16px); box-shadow: 0 8px 35px #0004; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.export-bar-status { display: flex; align-items: center; gap: 12px; }
.export-bar-status strong { display: block; color: var(--text); font-size: .81rem; font-weight: 550; }
.export-bar-status div > span { display: block; color: var(--quiet); font-size: .69rem; margin-top: 4px; }
.export-bar-tools { display: flex; gap: 10px; align-items: center; flex: 0 0 auto; }
.toolbar-divider { width: 1px; height: 22px; background: var(--border-strong); margin: 0 3px; }
.export-bar-tools .button:not(.button-small) { min-height: 41px; font-size: .81rem; padding: 9px 15px; }
.change-list { margin: 18px 0 22px; border: 1px solid var(--border); border-radius: 6px; max-height: 290px; overflow-y: auto; }
.change-list .empty-diff { margin: 0; padding: 16px; font-size: .82rem; color: var(--muted); }
.change-entry { padding: 13px 16px; border-bottom: 1px solid var(--border); }
.change-entry:last-child { border-bottom: 0; }
.change-path { display: block; color: var(--quiet); font-family: var(--mono); font-size: .65rem; margin-bottom: 8px; overflow-wrap: anywhere; }
.change-values { display: flex; align-items: flex-start; gap: 12px; font-family: var(--mono); font-size: .76rem; }
.change-before { color: #d5a29a; white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; }
.change-after { color: var(--accent); white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; }
.change-arrow { color: var(--quiet); flex: 0 0 auto; }
.export-code { font-family: var(--mono); font-size: .7rem; line-height: 1.7; }
.export-dialog .field > label { display: flex; align-items: center; gap: 15px; }
.variant-results { margin-top: 35px; scroll-margin-top: 20px; }
.variant-results .section-heading { margin-bottom: 21px; }
.variant-results .section-heading p { font-size: .82rem; }
.variant-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.variant-card { padding: 22px; display: flex; flex-direction: column; }
.variant-card.is-baseline { border-color: #4d6545; background: #1d2922; }
.variant-card .eyebrow { font-size: .58rem; }
.variant-card h3 { font-family: var(--mono); font-size: .92rem; overflow-wrap: anywhere; }
.variant-card .change-list { margin: 0 0 16px; max-height: 150px; font-size: .7rem; }
.variant-card .change-entry { padding: 11px; }
.variant-card .change-path { font-size: .56rem; }
.variant-card .change-values { font-size: .69rem; }
.variant-card .diagnostic { font-size: .65rem; padding: 8px 10px; }
.variant-validation { color: var(--teal); font-size: .67rem; margin-bottom: 15px; }
.variant-card > p { font-size: .78rem; color: var(--muted); }
.variant-card .actions { margin-top: auto; gap: 8px; }
.variant-card .actions .button { font-size: .74rem; }
.variant-baseline-button { font-size: .67rem; color: var(--quiet); margin-top: 13px; align-self: flex-start; }
.variant-card .action-status { font-size: .7rem; }
.is-working .status-dot { animation: processing 1.1s ease-in-out infinite; }
@keyframes processing { 50% { opacity: .3; } }
@media (min-width: 1550px) { .editor-page, .creator-promo { max-width: 1500px; } .editor-intro { padding-top: 65px; padding-bottom: 56px; } .workspace-grid { grid-template-columns: 255px minmax(0, 1fr) 280px; } }
@media (max-width: 1200px) {
  .editor-page { padding-left: 28px; padding-right: 28px; }
  .creator-promo { padding-left: 28px; padding-right: 28px; gap: 32px; }
  .editor-intro { gap: 35px; }
  .intro-copy h1 { font-size: 3.55rem; }
  .workspace-grid { grid-template-columns: 215px minmax(0, 1fr); gap: 18px; }
  .workspace-context { grid-column: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
  .experiment-builder { grid-column: 1 / -1; }
  .experiment-builder form { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
  .experiment-builder form > .field:first-child { grid-column: 1; grid-row: 1; align-self: start; }
  .variant-current { grid-column: 1; grid-row: 1; margin-top: 83px; align-self: start; }
  .experiment-builder form > .field:has(textarea) { grid-column: 2; grid-row: 1 / 3; }
  .experiment-builder .button { grid-column: 1; grid-row: 2; align-self: end; margin-bottom: 18px; }
  .import-controls > .input-hint { flex-basis: 100%; max-width: none; margin-left: 0; }
  .import-card .section-heading .badge { font-size: .5rem; }
}
@media (max-width: 1000px) {
  .editor-intro { padding-top: 42px; padding-bottom: 36px; gap: 30px; }
  .intro-copy h1 { font-size: 3.15rem; }
  .signal-art { min-height: 270px; }
  .art-node { width: 255px; }
  .start-grid { grid-template-columns: minmax(0, 1.65fr) minmax(240px, 1fr); gap: 20px; }
  .import-card { padding-left: 23px; padding-right: 23px; }
  .sample-row { padding-left: 23px; padding-right: 23px; margin-left: -23px; margin-right: -23px; }
  .sample-row > span:not(.sample-icon) { display: none; }
  .getting-started { padding: 24px; }
  .workspace-actions { gap: 15px; }
  .export-bar { gap: 15px; padding: 15px; }
  .export-bar-tools { gap: 5px; }
  .export-bar-tools .button { font-size: .74rem; }
  .variant-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .editor-page { padding-left: 20px; padding-right: 20px; }
  .creator-promo { grid-template-columns: 1fr; padding: 42px 20px 58px; gap: 28px; }
  .creator-promo-copy .actions { align-items: stretch; }
  .creator-promo-copy .button { flex: 1 1 220px; }
  .editor-intro { grid-template-columns: 1fr; padding-top: 37px; padding-bottom: 30px; }
  .intro-copy h1 { font-size: clamp(3rem, 8vw, 4rem); }
  .intro-copy > p { max-width: 540px; font-size: .98rem; }
  .signal-art { display: none; }
  .intro-meta { font-size: .59rem; }
  .start-grid { grid-template-columns: 1fr; }
  .getting-started { padding: 24px; }
  .getting-started > h2 { font-size: 1.5rem; }
  .getting-started > h2 > br { display: none; }
  .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
  .steps > li { display: block; margin-bottom: 0; }
  .step-number { margin-bottom: 13px; }
  .steps p { max-width: none; font-size: .76rem; }
  .getting-started > .text-link { justify-content: flex-start; }
  .feature-strip { grid-template-columns: 1fr; gap: 20px; }
  .feature-strip strong { font-size: .9rem; }
  .feature-strip small { font-size: .76rem; }
  .import-card { padding-top: 25px; }
  .import-controls > .input-hint { font-size: .73rem; }
  .sample-row > span:not(.sample-icon) { display: initial; }
  .workspace-heading { align-items: flex-start; }
  .workspace-heading h1 { font-size: 1.9rem; }
  .workspace-actions { flex-direction: column-reverse; align-items: flex-end; gap: 13px; padding-top: 8px; }
  .workspace-actions .button { padding-right: 0; font-size: .7rem; }
  .workspace-grid { grid-template-columns: 1fr; gap: 20px; }
  .navigator { position: static; }
  .move-tree { max-height: 240px; }
  .navigator-heading { font-size: .94rem; padding: 17px 20px; }
  .navigator-search { padding: 0 15px 13px; }
  .tree-node { font-size: .8rem; padding-top: 9px; padding-bottom: 9px; }
  .tree-branch > summary { font-size: .77rem; }
  .navigator-footnote { font-size: .71rem; }
  .workspace-context { grid-column: 1; }
  .inspector-heading { padding: 23px; }
  .selection-path { font-size: .7rem; }
  .field-row { grid-template-columns: minmax(120px, 1fr) minmax(140px, 1fr); }
  .field-label label { font-size: .9rem; }
  .field-key { font-size: .65rem; }
  .field-help { font-size: .73rem; }
  .field-control input:not([type="checkbox"]), .field-control select { font-size: .89rem; }
  .field-control > .type-select { font-size: .65rem; }
  .export-bar { bottom: 10px; padding: 13px; margin-left: -6px; margin-right: -6px; flex-direction: column; align-items: stretch; gap: 12px; }
  .export-bar-status { justify-content: flex-start; padding: 0 3px; }
  .export-bar-status > div { display: flex; flex-wrap: wrap; column-gap: 15px; align-items: center; }
  .export-bar-status div > span { margin: 0; }
  .export-bar-status strong { font-size: .77rem; }
  .export-bar-status div > span { font-size: .68rem; }
  .export-bar-tools { gap: 5px; }
  .export-bar-tools .button { flex: 1; font-size: .75rem; padding: 8px; white-space: nowrap; }
  .export-bar-tools .button:not(.button-small) { font-size: .78rem; padding: 8px 10px; }
  .export-bar-tools .button-quiet { flex: 0 1 auto; font-size: .73rem; }
  .toolbar-divider { margin: 0 3px; }
  .export-bar-tools .button > span[aria-hidden] { display: none; }
  .export-bar-tools .button-quiet > span { display: none; }
  .variant-card { padding: 18px; }
  .variant-card h3 { font-size: .85rem; }
  .workspace-context .eyebrow { font-size: .6rem; }
  .workspace-context h3 { font-size: 1.15rem; }
  .workspace-context p { font-size: .82rem; }
}
@media (max-width: 480px) {
  .editor-intro { padding-top: 32px; }
  .intro-copy h1 { font-size: 2.85rem; }
  .intro-copy > .eyebrow { font-size: .61rem; }
  .intro-meta { gap: 10px 15px; font-size: .52rem; }
  .intro-meta > span + span { padding-left: 15px; }
  .import-card .section-heading .badge { display: none; }
  .import-card .section-heading h2 { font-size: 1.62rem; }
  .import-card > .muted { font-size: .87rem; }
  .import-controls { gap: 10px; }
  .import-controls .button { font-size: .83rem; padding: 11px 14px; }
  .sample-row { gap: 8px; }
  .sample-row > span:not(.sample-icon) { display: none; }
  .sample-row .text-button { font-size: .84rem; }
  .steps { grid-template-columns: 1fr; gap: 20px; }
  .steps > li { display: flex; }
  .steps h3 { font-size: .91rem; }
  .steps p { font-size: .8rem; }
  .step-number { margin-bottom: 0; }
  .workspace-actions { gap: 10px; }
  .advanced-toggle { font-size: .71rem; gap: 7px; }
  .workspace-meta { font-size: .71rem; gap: 10px; }
  .workspace-heading { gap: 15px; }
  .workspace-context { display: flex; }
  .experiment-builder form { display: block; }
  .variant-current { margin-top: -6px; }
  .experiment-builder .button { margin-bottom: 0; }
  .field-row { grid-template-columns: minmax(100px, .85fr) minmax(110px, 1fr); gap: 14px; }
  .field-list { padding: 0 20px; }
  .field-label label { font-size: .85rem; }
  .field-key { font-size: .61rem; }
  .field-help { font-size: .7rem; }
  .advanced-field-heading { margin: 0 -20px; padding-left: 20px; padding-right: 20px; }
  .inspector-form-footer { padding-left: 20px; padding-right: 20px; }
  .inspector-form-footer .input-hint { font-size: .67rem; }
  .variant-grid { grid-template-columns: 1fr; }
  .variant-results .section-heading { flex-direction: column; align-items: flex-start; gap: 15px; }
  .export-bar-tools .button { font-size: .71rem; padding: 7px 6px; }
  .export-bar-tools .button:not(.button-small) { font-size: .75rem; }
  .export-bar-tools .button-quiet { font-size: .68rem; }
  .toolbar-divider { display: none; }
}