/* STUDIO'S FOUNDATION PANEL, for the website's agent demo (act 04). Captured 2026-10-18 from a sandbox Eden Studio (Moon Boots, fictional; dark chrome, Flat): every rule of Studio's stylesheets (index.html's inline <style> and lib/foundation-studio.css) that styles an element of #fdock in its captured states (Color, a brand colour's picker open, the Primary ramp, Text styles › Heading, Roles › Button), scoped under .sx-fdock with ids as [data-sx-id]. The wrapper carries the custom properties those rules and the panel's inline styles read; Foundation colour roles keep their var() chains, so changing a brand colour on .sx-fdock flows into the ramps' and roles' swatches that point at it. Re-capture, never hand-edit. */
.sx-fdock{--rail-solid:#121214;--muted:#75757a;--hover:rgba(255,255,255,.045);--ink:#F7F8F8;--chat-w:0px;--rail-w:70px;--bar:0px;--line:rgba(255,255,255,.08);--shadow-rail:rgba(0,0,0,.45);--ink-2:#A6A7A7;--faint:#47474b;--chrome-ground:#121214;--fs-col:320px;--ib-font:"Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif;--ib-label:#696a71;--ib-hover:#242427;--ib-ink:#f4f4f5;--ib-card:#1c1c1f;--ib-card-shadow:none;--ib-val:#c2c2c7;--ib-line-hi:rgba(255,255,255,.17);--ib-dot-ring:rgba(255,255,255,.22);--chrome-bg:#121214;--ib-line:rgba(255,255,255,.09);--sf-brand-colors-primary:#b3261e;--sf-brand-colors-secondary:#141414;--sf-brand-colors-accent:#c8a04a;--sf-primary-ramp-50:#fff8f7;--sf-primary-ramp-100:#ffd4cd;--sf-primary-ramp-200:#f5b2a8;--sf-primary-ramp-300:#e79286;--sf-primary-ramp-400:#d77164;--sf-primary-ramp-500:#c54f43;--sf-primary-ramp-600:#b3261e;--sf-primary-ramp-700:#860a08;--sf-primary-ramp-800:#580000;--sf-primary-ramp-900:#2c0000;--sf-neutral-colors-000:#ffffff;--sf-neutral-colors-50:#fafafa;--sf-neutral-colors-100:#f5f5f5;--sf-neutral-colors-200:#f0f0f0;--sf-neutral-colors-300:#e6e6e6;--sf-neutral-colors-400:#d4d4d4;--sf-neutral-colors-500:#a8a8a8;--sf-neutral-colors-600:#6e6e6e;--sf-neutral-colors-700:#4a4a4a;--sf-neutral-colors-800:#2e2e2e;--sf-neutral-colors-900:#1a1a1a;--sf-surfaces-status-success-50:#e8f5e3;--sf-surfaces-status-success-200:#64a864;--sf-surfaces-status-success-300:#1e7a1e;--sf-surfaces-status-error-50:#fdeaea;--sf-surfaces-status-error-200:#d86363;--sf-surfaces-status-error-300:#b71c1c;--sf-surfaces-status-warning-50:#fff4e0;--sf-surfaces-status-warning-200:#d68d3a;--sf-surfaces-status-warning-300:#ad5700;--sf-surfaces-status-info-50:#bbdaff;--sf-surfaces-status-info-200:#62a1f0;--sf-surfaces-status-info-300:#0169e9;--sf-surfaces-status-sale-300:#e91740;--check-a:#26272a;--check-b:#1a1b1d;--panel:#0F1011;--shadow:rgba(0,0,0,.55);--accent:#716cff;--ib-open:#29292c;--ib-val-hi:#dddddf;--ib-well:#151517;--ib-well-ink:#c6c6ca;--ib-link:#74757c;--ib-link-hi:#c4c4c8;--line-2:rgba(255,255,255,.14);--panel-2:#16181B;--sf-text-heading-lg-d-family:var(--sf-font-family-primary);--sf-text-heading-lg-d-size:40;--sf-text-heading-lg-d-weight:var(--sf-weight-weight-600);--sf-text-heading-lg-d-line-height:1.2;--sf-text-heading-lg-d-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-lg-m-family:var(--sf-font-family-primary);--sf-text-heading-lg-m-size:32;--sf-text-heading-lg-m-weight:var(--sf-weight-weight-600);--sf-text-heading-lg-m-line-height:1.2;--sf-text-heading-lg-m-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-md-d-family:var(--sf-font-family-primary);--sf-text-heading-md-d-size:32;--sf-text-heading-md-d-weight:var(--sf-weight-weight-600);--sf-text-heading-md-d-line-height:1.2;--sf-text-heading-md-d-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-md-m-family:var(--sf-font-family-primary);--sf-text-heading-md-m-size:24;--sf-text-heading-md-m-weight:var(--sf-weight-weight-600);--sf-text-heading-md-m-line-height:1.2;--sf-text-heading-md-m-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-s-d-family:var(--sf-font-family-primary);--sf-text-heading-s-d-size:24;--sf-text-heading-s-d-weight:var(--sf-weight-weight-500);--sf-text-heading-s-d-line-height:1.2;--sf-text-heading-s-d-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-s-m-family:var(--sf-font-family-primary);--sf-text-heading-s-m-size:20;--sf-text-heading-s-m-weight:var(--sf-weight-weight-500);--sf-text-heading-s-m-line-height:1.2;--sf-text-heading-s-m-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-xl-d-family:var(--sf-font-family-primary);--sf-text-heading-xl-d-size:60;--sf-text-heading-xl-d-weight:var(--sf-weight-weight-600);--sf-text-heading-xl-d-line-height:1;--sf-text-heading-xl-d-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-xl-m-family:var(--sf-font-family-primary);--sf-text-heading-xl-m-size:40;--sf-text-heading-xl-m-weight:var(--sf-weight-weight-600);--sf-text-heading-xl-m-line-height:1;--sf-text-heading-xl-m-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-xs-alt-d-family:var(--sf-font-family-primary);--sf-text-heading-xs-alt-d-size:18;--sf-text-heading-xs-alt-d-weight:var(--sf-weight-weight-500);--sf-text-heading-xs-alt-d-line-height:1.2;--sf-text-heading-xs-alt-d-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-xs-alt-m-family:var(--sf-font-family-primary);--sf-text-heading-xs-alt-m-size:18;--sf-text-heading-xs-alt-m-weight:var(--sf-weight-weight-500);--sf-text-heading-xs-alt-m-line-height:1.2;--sf-text-heading-xs-alt-m-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-xs-d-family:var(--sf-font-family-primary);--sf-text-heading-xs-d-size:20;--sf-text-heading-xs-d-weight:var(--sf-weight-weight-500);--sf-text-heading-xs-d-line-height:1.2;--sf-text-heading-xs-d-tracking:var(--sf-letter-spacing-snug);--sf-text-heading-xs-m-family:var(--sf-font-family-primary);--sf-text-heading-xs-m-size:18;--sf-text-heading-xs-m-weight:var(--sf-weight-weight-500);--sf-text-heading-xs-m-line-height:1.2;--sf-text-heading-xs-m-tracking:var(--sf-letter-spacing-snug);--line-strong:rgba(255,255,255,.22);--sf-surfaces-buttons-primary:var(--sf-brand-colors-primary);--sf-surfaces-buttons-primary-hover:var(--sf-primary-ramp-700);--sf-surfaces-buttons-brand:var(--sf-brand-colors-primary);--sf-surfaces-buttons-brand-fill:var(--sf-brand-colors-primary);--sf-surfaces-buttons-brand-fill-hover:var(--sf-primary-ramp-600);--sf-surfaces-buttons-brand-hover:var(--sf-primary-ramp-600);--sf-surfaces-buttons-fill:var(--sf-neutral-colors-black);--sf-surfaces-buttons-fill-hover:var(--sf-neutral-colors-800);--sf-surfaces-buttons-default:var(--sf-neutral-colors-400);--sf-surfaces-buttons-disabled:var(--sf-neutral-colors-50);--sf-surfaces-buttons-light:var(--sf-neutral-colors-200);--sf-surfaces-buttons-light-hover:var(--sf-neutral-colors-300);--sf-surfaces-buttons-inverse:var(--sf-neutral-colors-000);--sf-surfaces-buttons-inverse-fill:var(--sf-neutral-colors-000);--sf-surfaces-buttons-inverse-fill-hover:var(--sf-neutral-colors-200);--sf-surfaces-buttons-mid:var(--sf-neutral-colors-300);--sf-surfaces-buttons-hover-if-outline-only:var(--sf-neutral-colors-500);--sf-border-buttons-primary:var(--sf-surfaces-buttons-primary);--sf-border-buttons-brand:var(--sf-surfaces-buttons-brand);--sf-border-buttons-ghost:var(--sf-surfaces-background-always-white);--sf-border-buttons-focus:var(--sf-surfaces-buttons-focus);--sf-border-buttons-disabled:var(--sf-neutral-colors-400);--sf-font-family-primary:inter, sans-serif;--sf-weight-weight-600:600;--sf-letter-spacing-snug:-0.25;--sf-weight-weight-500:500;--sf-neutral-colors-black:#000000;--sf-surfaces-background-always-white:var(--sf-neutral-colors-000);--sf-surfaces-buttons-focus:var(--sf-brand-colors-primary);font-family:"Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;color:rgb(247, 248, 248)}
.sx-fdock *{box-sizing: border-box;}
.sx-fdock *{box-sizing: border-box;}
.sx-fdock .fdock{background: var(--rail-solid); backdrop-filter: none;}
.sx-fdock .dock-x{margin-left: auto; width: 28px; height: 28px; border: 0px; background: none; border-radius: 7px; font-size: 17px; line-height: 1; color: var(--muted); cursor: pointer;}
.sx-fdock .dock-x:hover{background: var(--hover); color: var(--ink);}
.sx-fdock .fdock{position: fixed; left: calc(var(--chat-w) + var(--rail-w) + var(--chat-w)); top: var(--bar); bottom: 0px; width: min(880px,calc(100vw - var(--rail-w) - 40px)); background: var(--rail-solid); border-right: 1px solid var(--line); box-shadow: 10px 0 28px var(--shadow-rail); z-index: 36; display: flex; flex-direction: column; clip-path: inset(0px 100% 0px 0px); visibility: hidden; transition: clip-path 0.14s, visibility linear 0.14s;}
.sx-fdock .fdock.open{clip-path: inset(0px -40px 0px 0px); visibility: visible; transition: clip-path 0.14s, visibility;}
.sx-fdock .fd-head{display: flex; align-items: center; gap: 12px; box-sizing: border-box; height: var(--bar,54px); min-height: 54px; flex: 0 0 auto; padding: 0px 8px 0px 16px; border-bottom: 1px solid var(--line);}
.sx-fdock .fd-edits{margin-left: auto; display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--ink-2);}
.sx-fdock .fd-edits:empty{display: none;}
.sx-fdock .fdock .dock-x{margin-left: 0px;}
.sx-fdock .fd-edits:empty + .dock-x{margin-left: auto;}
.sx-fdock :where(button, input, select, textarea, optgroup){font-family: inherit;}
.sx-fdock .fd-htitle{display: flex; align-items: baseline; gap: 9px; font-size: 13px; font-weight: 500;}
.sx-fdock .fd-htitle span{font-size: 11.5px; color: var(--faint); font-variant-numeric: tabular-nums;}
.sx-fdock .fd-body{flex: 1 1 0%; min-height: 0px; display: grid; grid-template-columns: 232px minmax(0px, 1fr);}
.sx-fdock .fd-nav{border-right: 0px; overflow: auto; padding: 18px 14px 36px;}
.sx-fdock .fd-main{overflow: auto; padding: 30px 34px 60px;}
.sx-fdock :is(.app > .tools, .dock, .fdock, .sdock, [data-sx-id="instrumentBar"], .rail-fly, .dock.rail-menu, .view-bar){background: var(--chrome-ground); border-color: transparent; box-shadow: none; backdrop-filter: none;}
.sx-fdock .fdock{--fs-col: 320px;}
.sx-fdock .fdock.fs-wide{width: calc(var(--fs-col) * 2);}
.sx-fdock .fdock.fs-wide .fd-body{grid-template-columns: var(--fs-col) var(--fs-col);}
.sx-fdock .fdock.fs-wide .fd-main{padding: 24px 24px 60px;}
.sx-fdock .fdock.fs-wide .fd-main:is(.fs-out, .fr-main){padding: 24px 24px 60px;}
.sx-fdock .fdock.fs-wide .fd-head{height: 54px; padding: 0px 12px 0px 20px;}
.sx-fdock .fd-tabs{display: flex; align-items: stretch; align-self: stretch; gap: 4px; margin-left: 28px;}
.sx-fdock .fd-tabs:empty{display: none;}
.sx-fdock .fd-nav.fs-inputs{padding: 18px 14px 40px; font-family: var(--ib-font);}
.sx-fdock .fs-in-sec{margin: 0px 0px 22px;}
.sx-fdock .fs-in-head{display: flex; align-items: center; gap: 8px; height: 28px; padding: 0px 4px; margin: 0px 0px 6px;}
.sx-fdock .fs-in-head .fs-chev{margin-right: 2px;}
.sx-fdock .fs-in-label{font-size: 10px; font-weight: 600; letter-spacing: 0.09em; text-transform: uppercase; color: var(--ib-label);}
.sx-fdock .fs-in-n{font-size: 10.5px; color: var(--ib-label); font-variant-numeric: tabular-nums;}
.sx-fdock .fs-add{margin-left: auto; width: 24px; height: 24px; display: grid; place-items: center; border: 0px; border-radius: 6px; background: none; color: var(--ib-label); font: 400 17px/1 var(--ib-font); cursor: pointer; padding: 0px;}
.sx-fdock .fs-add:hover{background: var(--ib-hover); color: var(--ib-ink);}
.sx-fdock .fs-cfgs{display: flex; flex-direction: column; gap: 6px;}
.sx-fdock .fs-cfg{border-radius: 10px; background: var(--ib-card); box-shadow: var(--ib-card-shadow); overflow: hidden;}
.sx-fdock .fs-cfg-row{position: relative; display: flex; align-items: center; gap: 10px; height: 40px; padding: 0px 30px 0px 10px; cursor: pointer; color: var(--ib-val); font-size: 12.5px;}
.sx-fdock .fs-cfg-row:hover{background: var(--ib-hover);}
.sx-fdock .fs-cfg-row:focus-visible{outline: 1px solid var(--ib-line-hi); outline-offset: -1px;}
.sx-fdock .fs-sw-btn{width: 20px; height: 20px; flex: 0 0 auto; border: 0px; border-radius: 50%; padding: 0px; cursor: pointer; box-shadow: inset 0 0 0 1px var(--ib-dot-ring);}
.sx-fdock .fs-cfg-v{font-family: var(--ib-font); font-size: 11.5px; color: inherit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums;}
.sx-fdock .fs-cfg-l{margin-left: auto; font-size: 11px; color: var(--ib-label); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0px;}
.sx-fdock .fs-dot{width: 5px; height: 5px; flex: 0 0 auto; border-radius: 50%; background: var(--ib-val);}
.sx-fdock .fs-tag{flex: 0 0 auto; padding: 1px 5px; border-radius: 4px; box-shadow: inset 0 0 0 1px var(--ib-line-hi); font-family: var(--ib-font); font-size: 9px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ib-label);}
.sx-fdock .fs-strip{display: flex; flex: 0 0 auto; align-items: stretch; width: 76px; height: 16px; border-radius: 999px; overflow: hidden; position: relative;}
.sx-fdock .fs-strip::after{content: ""; position: absolute; inset: 0px; border-radius: inherit; box-shadow: inset 0 0 0 1px var(--ib-dot-ring); pointer-events: none;}
.sx-fdock .fs-strip i{flex: 1 1 0px; min-width: 0px;}
.sx-fdock .fd-main.fs-out{padding: 32px 36px 80px; background: var(--chrome-bg);}
.sx-fdock .fs-fold{cursor: pointer; user-select: none;}
.sx-fdock .fs-fold:focus-visible{outline: 1px solid var(--ink-2); outline-offset: 3px;}
.sx-fdock .fs-chev{width: 0px; height: 0px; flex: 0 0 auto; border-left: 4.5px solid var(--faint); border-top: 4px solid transparent; border-bottom: 4px solid transparent; transform: rotate(90deg); transition: transform 0.14s;}
.sx-fdock .fs-fold:hover .fs-chev{border-left-color: var(--ink-2);}
.sx-fdock .fs-rail-title{margin: 2px 4px 18px; font-size: 15px; font-weight: 600; letter-spacing: -0.005em; color: var(--ink);}
.sx-fdock .fs-cap{text-transform: capitalize;}
.sx-fdock :is(.fdock .fd-head, .fdock .fd-body, .fd-nav, .fd-main, .fd-main.fs-out){background: var(--chrome-ground);}
.sx-fdock .fd-nav.fs-inputs{padding: 0px 0px 40px;}
.sx-fdock .fs-in-sec{margin: 0px;}
.sx-fdock .fs-in-head{height: 48px; margin: 0px; padding: 0px 20px; border-bottom: 1px solid var(--ib-line);}
.sx-fdock .fs-cfgs{gap: 0px;}
.sx-fdock .fs-cfg{border-radius: 0px; background: transparent; box-shadow: none; border-bottom: 1px solid var(--ib-line);}
.sx-fdock .fs-cfg-row{height: 48px; padding: 0px 40px 0px 20px;}
.sx-fdock :is(.fs-add, .fs-pick){border-radius: 0px;}
.sx-fdock .fd-main.fs-out{padding: 0px 0px 80px;}
.sx-fdock .fd-nav{padding: 18px 0px 36px;}
.sx-fdock .fd-nav.fs-inputs{padding: 18px 0px 40px;}
.sx-fdock .fd-nav :is(.fs-rail-title, .fd-searchw, .fd-tier){margin-left: 20px; margin-right: 20px;}
.sx-fdock .fd-nav .fs-in-sec:first-of-type .fs-in-head{border-top: 1px solid var(--ib-line);}
.sx-fdock [data-sx-id="fdock"] .fd-nav :is(.fs-idx-head, .fs-in-head, .fs-fam){padding-left: 20px; padding-right: 20px; margin-left: 0px; margin-right: 0px;}
.sx-fdock [data-sx-id="fdock"] .fd-nav .fs-in-head .fs-in-n{margin-right: auto;}
.sx-fdock [data-sx-id="fdock"] .fd-nav .fs-in-head .fs-add{margin-left: 0px;}
.sx-fdock [data-sx-id="fdock"] .fd-nav .fs-in-head .fs-chev{order: 10; margin: 0px 0px 0px 10px;}
.sx-fdock [data-sx-id="fdock"].fs-wide.fs-one{width: var(--fs-col);}
.sx-fdock [data-sx-id="fdock"].fs-one .fd-body{grid-template-columns: var(--fs-col);}
.sx-fdock [data-sx-id="fdock"].fs-one .fd-main{display: none;}
.sx-fdock .hp-prev{--c: transparent; background: linear-gradient(var(--c),var(--c)),repeating-conic-gradient(var(--check-a) 0 25%,var(--check-b) 0 50%) 0 0/8px 8px;}
.sx-fdock .hp-swatch{--c: transparent; background: linear-gradient(var(--c),var(--c)),repeating-conic-gradient(var(--check-a) 0 25%,var(--check-b) 0 50%) 0 0/8px 8px;}
.sx-fdock .hexpick{position: fixed; z-index: 2500; width: 248px; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 16px 40px var(--shadow); padding: 10px; display: flex; flex-direction: column; gap: 9px; user-select: none;}
.sx-fdock .hp-sv{position: relative; height: 150px; border-radius: 8px; cursor: crosshair; touch-action: none;}
.sx-fdock .hp-sv::before{content: ""; position: absolute; inset: 0px; border-radius: 8px;}
.sx-fdock .hp-sv::after{content: ""; position: absolute; inset: 0px; border-radius: 8px;}
.sx-fdock .hp-sv::before{background: linear-gradient(90deg, rgb(255, 255, 255), rgba(255, 255, 255, 0));}
.sx-fdock .hp-sv::after{background: linear-gradient(0deg, rgb(0, 0, 0), rgba(0, 0, 0, 0));}
.sx-fdock .hp-knob{position: absolute; width: 12px; height: 12px; margin: -6px 0px 0px -6px; border-radius: 50%; border: 2px solid rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.35) 0px 0px 0px 1px, rgba(0, 0, 0, 0.3) 0px 1px 3px; z-index: 1; pointer-events: none;}
.sx-fdock .hp-bar{position: relative; height: 12px; border-radius: 6px; cursor: pointer; touch-action: none;}
.sx-fdock .hp-hue{background: linear-gradient(90deg, rgb(255, 0, 0), rgb(255, 255, 0), rgb(0, 255, 0), rgb(0, 255, 255), rgb(0, 0, 255), rgb(255, 0, 255), rgb(255, 0, 0));}
.sx-fdock .hp-alpha{background: repeating-conic-gradient(var(--check-a) 0 25%,var(--check-b) 0 50%) 0 0/8px 8px;}
.sx-fdock .hp-alpha i{position: absolute; inset: 0px; border-radius: 6px;}
.sx-fdock .hp-bar .hp-knob{top: 50%;}
.sx-fdock .hp-row{display: flex; align-items: center; gap: 6px;}
.sx-fdock .hp-prev{width: 28px; height: 28px; border-radius: 6px; flex: 0 0 auto; box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 0px 1px inset;}
.sx-fdock .hp-hex{flex: 1 1 0%; min-width: 0px; height: 28px; border: 1px solid var(--line); border-radius: 6px; font-style: ; font-variant-ligatures: ; font-variant-caps: ; font-variant-east-asian: ; font-variant-alternates: ; font-variant-position: ; font-variant-emoji: ; font-weight: ; font-stretch: ; font-size: ; line-height: ; font-family: ; font-optical-sizing: ; font-size-adjust: ; font-kerning: ; font-feature-settings: ; font-variation-settings: ; font-language-override: ; padding: 0px 8px; text-transform: lowercase; font-variant-numeric: tabular-nums;}
.sx-fdock .hp-hex:focus{outline: none; border-color: var(--accent);}
.sx-fdock .hp-icon{width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); display: grid; place-items: center; cursor: pointer; color: var(--ink-2); flex: 0 0 auto; padding: 0px;}
.sx-fdock .hp-icon:hover{background: var(--hover); color: var(--ink);}
.sx-fdock .hp-opts{display: flex; gap: 6px; flex-wrap: wrap;}
.sx-fdock .hp-opt{height: 24px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 11.5px; color: var(--ink-2); padding: 0px 8px; cursor: pointer;}
.sx-fdock .hp-opt:hover{background: var(--hover);}
.sx-fdock .hp-label{font-size: 10.5px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--muted);}
.sx-fdock .hp-grid{display: grid; grid-template-columns: repeat(11, 1fr); gap: 3px; max-height: 96px; overflow: auto;}
.sx-fdock .hp-swatch{aspect-ratio: 1 / 1; border: 0px; border-radius: 50%; padding: 0px; cursor: pointer; box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 0px 1px inset;}
.sx-fdock .hp-swatch:hover{box-shadow: 0 0 0 2px var(--accent);}
.sx-fdock .linkbtn{border: 0px; background: none; color: var(--ink); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12px; cursor: pointer; padding: 0px; text-align: left;}
.sx-fdock .linkbtn:hover{text-decoration: underline;}
.sx-fdock .lock-act{margin-left: auto; font-size: 11.5px;}
.sx-fdock .hexpick.inline{position: static; width: auto; z-index: auto; box-shadow: none; border: 0px; border-radius: 0px; background: none; padding: 10px 14px 4px; gap: 8px;}
.sx-fdock [data-sx-id="fdock"] .fd-pick .hexpick.inline{padding: 14px 0px 18px; gap: 10px; border-bottom: 1px solid var(--line);}
.sx-fdock [data-sx-id="fdock"] .fd-pick .hexpick.inline :is(.hp-sv, .hp-bar, .hp-icon, .hp-prev, .hp-hex, .hp-opt){border-radius: 0px;}
.sx-fdock [data-sx-id="fdock"] .fd-pick .hexpick.inline .hp-sv::before{border-radius: 0px;}
.sx-fdock [data-sx-id="fdock"] .fd-pick .hexpick.inline .hp-sv::after{border-radius: 0px;}
.sx-fdock [data-sx-id="fdock"] .fd-pick .hexpick.inline :is(.hp-label, .hp-grid){display: none;}
.sx-fdock .fs-cfg.open > .fs-cfg-row{background: var(--ib-open); color: var(--ib-val-hi);}
.sx-fdock .fs-opt{display: grid; grid-template-columns: 58px minmax(0px, 1fr); align-items: center; gap: 8px; min-height: 32px;}
.sx-fdock .fs-opt-l{font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ib-label);}
.sx-fdock .fs-opt-c{display: flex; align-items: center; gap: 8px; min-width: 0px;}
.sx-fdock .fs-mini{flex: 1 1 0%; min-width: 0px; height: 28px; padding: 0px 8px; border: 0px; border-radius: 6px; background: var(--ib-well); color: var(--ib-well-ink); font: 12px var(--ib-font); outline: 0px;}
.sx-fdock input.fs-mini{font-family: var(--ib-font); font-size: 11.5px; font-variant-numeric: tabular-nums;}
.sx-fdock .fs-mini:focus{box-shadow: inset 0 0 0 1px var(--ib-line-hi);}
.sx-fdock .fs-acts{display: flex; gap: 14px; justify-content: flex-end; padding-top: 6px;}
.sx-fdock .fs-act{border: 0px; background: none; padding: 2px 0px; font: 500 11.5px var(--ib-font); color: var(--ib-link); cursor: pointer;}
.sx-fdock .fs-act:hover{color: var(--ib-link-hi);}
.sx-fdock .fs-sel-head{display: flex; align-items: center; gap: 12px; margin: 0px 0px 18px;}
.sx-fdock .fs-sel-head .fs-sw-btn{width: 28px; height: 28px; cursor: default;}
.sx-fdock .fs-sel-title{margin: 0px; font-size: 18px; font-weight: 500; color: var(--ink);}
.sx-fdock .fs-sel-v{margin-left: auto; font-size: 12px; color: var(--faint); font-variant-numeric: tabular-nums;}
.sx-fdock .fs-sel-opts{display: flex; flex-direction: column; gap: 4px;}
.sx-fdock .fd-pick{align-self: stretch; width: 100%; min-width: 0px;}
.sx-fdock [data-sx-id="fdock"] .fs-sel-head{display: none;}
.sx-fdock .fs-wcs{position: absolute; left: 9px; bottom: 8px; display: flex; flex-direction: column; align-items: flex-start; gap: 1px;}
.sx-fdock .fs-wc{display: inline-flex; align-items: baseline; gap: 4px; font-family: var(--ib-font); font-size: 9.5px; letter-spacing: 0.02em; white-space: nowrap; font-variant-numeric: tabular-nums;}
.sx-fdock .fs-wc b{font-family: var(--ib-font,inherit); font-size: 12px; font-weight: 600; letter-spacing: 0px;}
.sx-fdock .fs-wc.fail{opacity: 0.35;}
.sx-fdock .fs-num{flex: 0 0 auto; width: 64px;}
.sx-fdock .fs-num-note{font-size: 10.5px; color: var(--ib-label); white-space: nowrap;}
.sx-fdock .fs-check{display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0px 10px 0px 8px; border-radius: 6px; background: var(--ib-well); color: var(--ib-well-ink); font-size: 12px; cursor: pointer; white-space: nowrap;}
.sx-fdock .fs-check input{margin: 0px; width: 14px; height: 14px; accent-color: var(--ib-ink); cursor: pointer;}
.sx-fdock .fs-check:hover{color: var(--ib-ink);}
.sx-fdock .fs-steps{display: flex; flex-direction: column; margin: 8px -10px 4px;}
.sx-fdock .fs-step{position: relative; display: flex; align-items: center; gap: 10px; width: 100%; min-height: 42px; padding: 0px 10px; border: 0px; border-radius: 0px; background: var(--c); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12px; text-align: left; cursor: pointer;}
.sx-fdock .fs-step:hover{box-shadow: currentcolor 0px 0px 0px 1px inset;}
.sx-fdock .fs-step:focus-visible{outline: 2px solid var(--ink); outline-offset: -2px;}
.sx-fdock .fs-step-n{flex: 0 0 auto; min-width: 30px; font-weight: 600; font-variant-numeric: tabular-nums;}
.sx-fdock .fs-step-v{font-size: 11px; opacity: 0.75; font-variant-numeric: tabular-nums;}
.sx-fdock .fs-step-seed{padding: 1px 6px; border-radius: 999px; box-shadow: currentcolor 0px 0px 0px 1px inset; font-size: 9px; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.85;}
.sx-fdock .fs-step .fs-dot{background: currentcolor;}
.sx-fdock .fs-step .fs-wcs{position: static; margin-left: auto; flex: 0 0 auto; display: inline-flex; flex-direction: row; gap: 8px;}
.sx-fdock .fs-step .fs-wc{padding: 0px; background: none; font-size: 9.5px;}
.sx-fdock .fs-steps{margin-left: -20px; margin-right: -40px;}
.sx-fdock .fs-step{padding: 0px 40px 0px 20px;}
.sx-fdock .fs-sel-head .fs-strip{width: 96px; height: 20px;}
.sx-fdock .fd-main .fs-sel-opts .fs-steps{margin: 14px -24px 0px;}
.sx-fdock .fd-main .fs-sel-opts .fs-step{padding: 0px 24px;}
.sx-fdock .tok{width: 100%; height: 28px; border: 1px solid var(--line); border-radius: 6px; font: inherit; padding: 0px 8px; background: var(--panel); color: var(--ink);}
.sx-fdock .fd-node .n{margin-left: auto; font-size: 11px; font-weight: 400; color: var(--faint); font-variant-numeric: tabular-nums; letter-spacing: 0px;}
.sx-fdock .fd-node{display: flex; align-items: center; gap: 8px; width: 100%; min-height: 32px; border: 0px; background: none; border-radius: 0px; padding: 5px 8px; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12.5px; font-weight: 400; color: var(--ink-2); cursor: pointer; text-align: left;}
.sx-fdock .fd-node:hover{background: var(--hover); color: var(--ink);}
.sx-fdock .fd-node.on{background: var(--hover); color: var(--ink); font-weight: 400; box-shadow: inset 2px 0 0 var(--ink-2);}
.sx-fdock .fd-nl{display: flex; align-items: center; gap: 6px; min-width: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.sx-fdock .fs-idx-head{display: flex; align-items: center; gap: 8px; height: 28px; padding: 0px 8px; margin: 0px 0px 4px;}
.sx-fdock .fs-ts-row{margin: 0px 0px 12px; padding: 16px 20px; border: 1px solid var(--line-2); border-radius: 12px; background: var(--panel);}
.sx-fdock .fs-ts-head{display: flex; align-items: center; gap: 10px; margin-bottom: 10px;}
.sx-fdock .fs-ts-name{font-size: 13px; font-weight: 500; color: var(--ink);}
.sx-fdock .fs-ts-case{font-size: 10.5px; color: var(--muted);}
.sx-fdock .fs-ts-spec{color: var(--ink); margin: 0px 0px 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.sx-fdock .fs-ts-fields{display: grid; grid-template-columns: repeat(5, minmax(0px, 1fr)); gap: 10px;}
.sx-fdock .fs-ts-field{display: flex; flex-direction: column; gap: 4px; font-size: 10.5px; color: var(--muted);}
.sx-fdock .fs-ts-sel{height: 30px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--panel-2, transparent); color: var(--ink); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12px;}
.sx-fdock .fs-ts-num{height: 30px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--panel-2, transparent); color: var(--ink); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12px;}
.sx-fdock .fs-ts-sel{padding: 0px 6px;}
.sx-fdock .fs-ts-num{display: flex; align-items: center; gap: 4px; padding: 0px 8px;}
.sx-fdock .fs-ts-num input{flex: 1 1 0%; min-width: 0px; border: 0px; background: transparent; color: var(--ink); font: inherit;}
.sx-fdock :is(.fs-table, .fs-ts-row){border: 0px; border-radius: 0px; background: transparent;}
.sx-fdock .fs-ts-row{margin: 0px; padding: 16px 36px; border-bottom: 1px solid var(--line);}
.sx-fdock .fd-nav :is(.fd-node, .fd-sec){min-height: 44px; padding: 0px 20px; border-bottom: 1px solid var(--line);}
.sx-fdock .fd-nav .fd-node.on{box-shadow: inset 2px 0 0 var(--ink-2);}
.sx-fdock [data-sx-id="fdock"] .fd-main .fs-ts-row{padding-left: 0px; padding-right: 0px;}
.sx-fdock [data-sx-id="fdock"] .fs-ts-row{display: flex; flex-direction: column; gap: 12px; padding: 0px 0px 24px; margin: 0px 0px 24px; border-bottom: 1px solid var(--line);}
.sx-fdock [data-sx-id="fdock"] .fs-ts-row:last-child{border-bottom: 0px;}
.sx-fdock [data-sx-id="fdock"] .fs-ts-head{display: flex; align-items: center; gap: 8px;}
.sx-fdock [data-sx-id="fdock"] .fs-ts-name{font-size: 13px; font-weight: 600; color: var(--ink);}
.sx-fdock [data-sx-id="fdock"] .fs-ts-spec{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink);}
.sx-fdock [data-sx-id="fdock"] .fs-ts-fields{display: flex; flex-direction: column; gap: 8px;}
.sx-fdock [data-sx-id="fdock"] .fs-ts-field{display: grid; grid-template-columns: 88px minmax(0px, 1fr); align-items: center; gap: 12px; min-width: 0px;}
.sx-fdock [data-sx-id="fdock"] .fs-ts-field > span:first-child{font-size: 12px; color: var(--faint);}
.sx-fdock [data-sx-id="fdock"] .fs-ts-sel{width: 100%; min-width: 0px; box-sizing: border-box;}
.sx-fdock [data-sx-id="fdock"] .fs-ts-num{width: 100%; min-width: 0px; box-sizing: border-box;}
.sx-fdock [data-sx-id="fdock"] .fs-ts-num input{width: 100%; min-width: 0px;}
.sx-fdock [data-sx-id="fdock"] .fd-preview{display: flex; flex-direction: column; gap: 6px; margin: 4px 20px 8px;}
.sx-fdock [data-sx-id="fdock"] .fd-preview-in{width: 100%; box-sizing: border-box; height: 32px; padding: 0px 10px; border: 1px solid var(--line-2); border-radius: 0px; background: transparent; color: var(--ink); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px;}
.sx-fdock [data-sx-id="fdock"] .fd-preview-in::placeholder{color: var(--faint);}
.sx-fdock [data-sx-id="fdock"] .fd-preview-in:focus{outline: none; border-color: var(--ink);}
.sx-fdock .fd-main.fr-main{padding: 32px 48px 80px;}
.sx-fdock .fd-nav .fr-gap{margin-top: 20px;}
.sx-fdock .fr-head{max-width: 720px; margin: 0px 0px 28px;}
.sx-fdock .fr-head-t{display: flex; align-items: center; gap: 16px;}
.sx-fdock .fr-head-t h3{margin: 0px; font-size: 22px; font-weight: 500; color: var(--ink);}
.sx-fdock .fr-head-t .fs-act{margin-left: auto; font-size: 12px;}
.sx-fdock .fr-head-s{margin: 8px 0px 0px; font-size: 13px; line-height: 1.5; color: var(--ink-2);}
.sx-fdock .fr-head-u{margin: 4px 0px 0px; font-size: 12px; color: var(--faint);}
.sx-fdock .fr-attr{max-width: 860px; margin: 0px 0px 30px;}
.sx-fdock .fr-attr-h{display: flex; align-items: baseline; gap: 10px; padding: 0px 0px 8px; border-bottom: 1px solid var(--line);}
.sx-fdock .fr-attr-n{font-size: 15px; font-weight: 500; color: var(--ink);}
.sx-fdock .fr-attr-k{font-size: 12px; color: var(--faint);}
.sx-fdock .fr-tok{display: inline-flex; align-items: center; gap: 8px; height: 32px; max-width: 100%; padding: 0px 10px 0px 6px; border: 0px; border-radius: 6px; background: none; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12.5px; color: var(--ink); cursor: pointer; min-width: 0px;}
.sx-fdock .fr-tok:hover{background: var(--hover);}
.sx-fdock .fr-tn{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.sx-fdock .fr-num{flex: 0 0 auto; min-width: 16px; height: 16px; padding: 0px 4px; border-radius: 4px; box-shadow: inset 0 0 0 1px var(--line); font-style: normal; font-size: 10px; line-height: 16px; text-align: center; color: var(--ink-2); font-variant-numeric: tabular-nums;}
.sx-fdock .fr-none{font-size: 12px; color: var(--faint);}
.sx-fdock .fr-to{font-size: 12px; color: var(--ink-2); white-space: nowrap;}
.sx-fdock .fr-use{margin-left: 6px; font-size: 11.5px; color: var(--faint); white-space: nowrap; font-variant-numeric: tabular-nums;}
.sx-fdock .fr-lede{max-width: 720px; margin: -12px 0px 28px; font-size: 13px; line-height: 1.5; color: var(--ink-2);}
.sx-fdock .fr-srcs{display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 12px 0px 10px;}
.sx-fdock .fr-srcs-l{margin-right: 4px; font-size: 12px; color: var(--faint);}
.sx-fdock .fr-src{display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0px 4px 0px 11px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-strong); font-size: 12px; color: var(--ink);}
.sx-fdock .fr-src-x{width: 20px; height: 20px; border: 0px; border-radius: 50%; background: none; color: var(--faint); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 14px; line-height: 1; cursor: pointer; padding: 0px;}
.sx-fdock .fr-src-x:hover{background: var(--hover); color: var(--ink);}
.sx-fdock .fr-src-add{height: 28px; padding: 0px 11px; border: 0px; border-radius: 999px; background: none; box-shadow: inset 0 0 0 1px var(--line); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12px; color: var(--ink-2); cursor: pointer;}
.sx-fdock .fr-src-add:hover{color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-strong);}
.sx-fdock .fr-srcl{display: flex; flex-direction: column; align-items: flex-start; gap: 0px; padding: 2px 0px 6px;}
.sx-fdock [data-sx-id="fdock"] .fr-srcl.cards{align-items: stretch; margin: 0px -24px; padding: 0px;}
.sx-fdock [data-sx-id="fdock"] .fr-srcl > .fr-card{padding: 0px 24px;}
.sx-fdock [data-sx-id="fdock"] .fr-card .fr-use{margin-left: auto; color: inherit; opacity: 0.75;}
.sx-fdock [data-sx-id="fdock"] .fr-head-t h3{display: none;}
.sx-fdock [data-sx-id="fdock"] .fr-head-t{justify-content: flex-end;}
.sx-fdock [data-sx-id="fdock"] .fr-head{margin-bottom: 20px;}
