@font-face{font-family:Geist;font-style:normal;font-weight:400;font-display:swap;src:url(/keychain/assets/geist-sans-latin-400-normal-gapTbOY8.woff2) format("woff2")}@font-face{font-family:Geist;font-style:normal;font-weight:500;font-display:swap;src:url(/keychain/assets/geist-sans-latin-500-normal-uokXdC-Q.woff2) format("woff2")}@font-face{font-family:Geist;font-style:normal;font-weight:600;font-display:swap;src:url(/keychain/assets/geist-sans-latin-600-normal-DFOURf8L.woff2) format("woff2")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/keychain/assets/ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2) format("woff2")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/keychain/assets/ibm-plex-mono-latin-500-normal-DSY6xOcd.woff2) format("woff2")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:600;font-display:swap;src:url(/keychain/assets/ibm-plex-mono-latin-600-normal-BgSNZQsw.woff2) format("woff2")}:root{color-scheme:dark;--bg: #0C0D0F;--surface: #121316;--surface-2: #191B1F;--surface-3: #1F2227;--canvas: #1B1C1F;--well: #060708;--inset: #101216;--line: #1C1F24;--edge-highlight: rgba(255, 255, 255, .07);--edge-highlight-strong: rgba(255, 255, 255, .1);--wash-selected: rgba(255, 255, 255, .07);--border: #26292F;--control-border: #707885;--artwork-paper: #f4f3ed;--border-strong: #3A3E47;--text-1: #E8EAED;--text-2: #9BA1AB;--text-3: #8E97A6;--accent: #1B6DEB;--accent-hover: #1558C4;--accent-fg: #FFFFFF;--accent-muted: rgba(27, 109, 235, .14);--ok: #3ECF8E;--warn: #E7B549;--err: #F4604F;--info: #5CA8FF;--ok-muted: rgba(62, 207, 142, .14);--warn-muted: rgba(231, 181, 73, .14);--err-muted: rgba(244, 96, 79, .14);--info-muted: rgba(92, 168, 255, .14);--axis-x: #FF4564;--axis-y: #55D65A;--axis-z: #45A3FF;--hover: rgba(255, 255, 255, .05);--press: rgba(255, 255, 255, .09);--ring: #5CA8FF;--selection: rgba(27, 109, 235, .25)}:root,[data-theme]{--status-printing: var(--accent);--status-idle: var(--ok);--status-queued: var(--info);--status-paused: var(--warn);--status-error: var(--err);--status-offline: var(--text-3);--focus: var(--ring);--surface-card: var(--surface);--surface-raised: var(--surface-2);--surface-overlay: var(--surface-3);--text-body: var(--text-1);--text-muted: var(--text-2);--scrim: rgba(0, 0, 0, .6)}[data-theme=paper]{color-scheme:light;--bg: #F7F6F3;--surface: #FFFFFF;--surface-2: #F2F0EB;--surface-3: #EAE7E0;--canvas: #EAE7E0;--well: #EFEDE8;--inset: #F7F6F3;--line: #ECE9E2;--edge-highlight: rgba(255, 255, 255, .6);--edge-highlight-strong: rgba(255, 255, 255, .9);--wash-selected: rgba(28, 27, 24, .06);--border: #E3E0D8;--control-border: #707885;--artwork-paper: #f4f3ed;--border-strong: #C9C5BA;--text-1: #1C1B18;--text-2: #5F5C55;--text-3: #97938A;--accent: #1B6DEB;--accent-hover: #1558C4;--accent-fg: #FFFFFF;--accent-muted: rgba(27, 109, 235, .1);--ok: #1D8A5A;--warn: #A87710;--err: #C2402F;--info: #2F6FD0;--ok-muted: rgba(29, 138, 90, .1);--warn-muted: rgba(168, 119, 16, .12);--err-muted: rgba(194, 64, 47, .1);--info-muted: rgba(47, 111, 208, .1);--hover: rgba(28, 27, 24, .045);--press: rgba(28, 27, 24, .09);--ring: #1558C4;--selection: rgba(27, 109, 235, .18);--scrim: rgba(28, 27, 24, .4)}:root{--font-sans: "Geist", "Helvetica Neue", Arial, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;--text-xs: 12px;--text-sm: 13px;--text-md: 14px;--text-lg: 16px;--text-xl: 20px;--stat-md: 20px;--stat-lg: 26px;--display-sm: 20px;--display-md: 26px;--display-lg: 40px;--leading-tight: 1.25;--leading-body: 1.5;--tracking-label: .08em;--tracking-display: -.02em;--text-body-size: var(--text-md)}:root{--sp-05: 2px;--sp-1: 4px;--sp-15: 6px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;--sp-10: 40px;--sp-12: 48px;--page-inset: var(--sp-6);--page-block: var(--sp-6);--page-gap: var(--sp-6);--region-gap: var(--sp-4);--region-pad: var(--sp-4);--row-pad-y: var(--sp-3);--row-pad-x: var(--sp-4);--inline-gap: var(--sp-2);--micro-gap: var(--sp-1);--layout-form: 880px;--r-sm: 3px;--r-md: 5px;--r-lg: 8px;--r-full: 999px;--r-panel: 6px;--r-window: 12px;--topbar-h: 44px;--toolbar-h: 46px;--traffic-inset: 78px;--rail-w: 216px;--rail-w-slim: 48px;--sidebar-w: var(--rail-w);--desktop-sidebar-w: 232px;--panel-w-min: 240px;--panel-w-max: 360px;--statusbar-h: 26px;--palette-w: 560px;--row-h: 44px;--row-h-dense: 32px;--control-h: 28px;--control-h-lg: 36px;--bw: 1px;--shadow-1: 0 1px 2px rgba(0, 0, 0, .18);--shadow-2: 0 4px 16px rgba(0, 0, 0, .28);--shadow-overlay: 0 12px 40px rgba(0, 0, 0, .4);--dur-fast: .12s;--dur-med: .2s;--ease: cubic-bezier(.3, 0, .2, 1)}[data-density=comfortable]{--control-h: 44px;--control-h-lg: 44px;--row-h: 44px}[data-density=dense]{--row-h: var(--row-h-dense)}@media(pointer:coarse),(max-width:760px){:root{--control-h: 44px;--control-h-lg: 44px;--row-h: 44px}}@media(max-width:720px){:root{--page-inset: var(--sp-3);--page-block: var(--sp-4);--page-gap: var(--sp-4);--region-pad: var(--sp-3);--row-pad-x: var(--sp-3)}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text-1);font-family:var(--font-mono);font-size:var(--text-md);line-height:var(--leading-body);-webkit-font-smoothing:antialiased}::selection{background:var(--selection)}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3{font-family:var(--font-sans);font-weight:600;letter-spacing:var(--tracking-display);line-height:var(--leading-tight);margin:0}.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:600}keychain-app{display:block;height:100dvh;font-family:var(--font-sans)}keychain-controls[kind=actions]{display:contents}keychain-controls[kind=left],keychain-controls[kind=right]{display:flex;flex-direction:column;height:100%;min-height:0}keychain-controls[kind=left]>.keychain-panel-scroll,keychain-controls[kind=right]>.keychain-panel-right{flex:1;min-height:0}keychain-app .panel.l{width:clamp(276px,23vw,352px)}keychain-app .panel.r{width:clamp(292px,25vw,380px)}.keychain-panel-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:var(--text-3) var(--surface)}.keychain-panel-right{min-height:0;display:flex;flex-direction:column}.keychain-panel-right>.keychain-panel-scroll{flex:1}.keychain-stack{display:flex;flex-direction:column;gap:10px;min-width:0}.keychain-field,.keychain-number{display:flex;flex-direction:column;gap:6px}.keychain-field>span,.keychain-number>span{display:flex;align-items:center;gap:4px;color:var(--text-2);font:11px var(--font-mono)}.keychain-text{width:100%;min-height:66px;resize:vertical;font:13px/1.35 var(--font-mono)}.keychain-row{display:flex;flex-wrap:wrap;gap:6px}.keychain-row .btn{flex:1;min-width:0;justify-content:center}.keychain-row .btn.on{background:var(--wash-selected);border-color:var(--accent)}.keychain-check{display:flex;align-items:center;gap:8px;min-height:28px;font:12px var(--font-mono);cursor:pointer}.keychain-check input{accent-color:var(--accent)}.keychain-check>span{display:flex;align-items:center;gap:4px}.keychain-color{display:flex;flex-direction:column;gap:6px}.keychain-color>span{color:var(--text-2);font:11px var(--font-mono)}.keychain-color input{width:100%;height:34px;padding:3px;border:1px solid var(--control-border);border-radius:var(--r-sm);background:var(--inset);cursor:pointer}.keychain-outcomes{display:flex;flex-direction:column;gap:6px}.keychain-outcome{min-height:56px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;padding:9px 11px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);color:var(--text-2);text-align:left;cursor:pointer}.keychain-outcome strong{color:var(--text-1);font:600 12px var(--font-sans)}.keychain-outcome span{font:10.5px/1.35 var(--font-sans)}.keychain-outcome:hover{background:var(--surface-3)}.keychain-outcome:focus-visible{outline:2px solid var(--focus);outline-offset:1px}.keychain-outcome.selected{border-color:var(--accent);background:var(--wash-selected);color:var(--text-1)}.keychain-drop{display:flex;flex-direction:column;gap:8px;padding:9px;border:1px dashed var(--border-strong);border-radius:var(--r-sm);background:var(--inset)}.keychain-drop.is-over{border-color:var(--accent);background:var(--wash-selected)}.keychain-drop .hint{margin:0}.keychain-message{margin:0;padding-top:10px;border-top:1px solid var(--border);font:12px/1.5 var(--font-sans)}.keychain-message.error{color:var(--err)}.keychain-message.warning{color:var(--warn)}.keychain-message.ok{color:var(--ok)}.keychain-stage-readout{position:absolute;z-index:3;left:50%;bottom:16px;transform:translate(-50%);display:flex;align-items:center;gap:10px;max-width:calc(100% - 24px);padding:7px 9px;border:1px solid var(--border);border-radius:var(--r-sm);background:color-mix(in srgb,var(--surface) 94%,transparent);color:var(--text-2);font-size:11px;white-space:nowrap;overflow:hidden}.keychain-export-panel{flex:none;display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-top:1px solid var(--border);background:var(--surface)}.keychain-export-status{display:flex;justify-content:space-between;align-items:center;gap:8px;color:var(--text-3);font:11px var(--font-mono)}.keychain-export-panel .keychain-export-trigger{width:100%;justify-content:center}.keychain-export-fields{display:flex;flex-direction:column;gap:16px;margin:0;padding:0;border:0;min-width:0}.keychain-export-dialog .keychain-message{padding-top:0;border-top:0}keychain-app ::selection{background:var(--selection);color:var(--text-1)}@media(max-width:760px){keychain-app{height:auto}keychain-app .app{height:auto;min-height:100dvh;overflow:visible}keychain-app .body{display:flex;flex-direction:column;overflow:visible}keychain-app .stage{order:-1;height:36dvh;min-height:220px;position:sticky;top:0;z-index:5;border-bottom:1px solid var(--border)}keychain-app .panel.l,keychain-app .panel.r{width:100%;overflow:visible;border:0}.keychain-panel-scroll,.keychain-panel-right{overflow:visible}keychain-app .top .acts .btn{width:44px;padding:0;font-size:0;justify-content:center}keychain-app .btn,keychain-app .ib{min-height:44px}.keychain-starters{grid-template-columns:repeat(4,minmax(0,1fr))}.keychain-starter{min-height:66px}.keychain-export-panel{position:sticky;bottom:0;z-index:12;padding:10px 12px max(10px,env(safe-area-inset-bottom));border-top-color:var(--border-strong)}keychain-app .status [slot=right]{display:none}}@media(prefers-reduced-motion:reduce){keychain-app *{scroll-behavior:auto!important;transition:none!important}}@media(max-width:760px){keychain-app input,keychain-app textarea,keychain-app select,keychain-app button,keychain-app strata-number{scroll-margin-top:calc(36dvh + 16px)}}.keychain-name{font-size:18px;line-height:1.4;resize:vertical;min-height:76px}.keychain-drop{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:20px 14px;border:1px dashed var(--border-strong);border-radius:var(--r-md);background:var(--inset)}.keychain-drop>strata-icon{color:var(--text-2)}.keychain-help{margin:0;color:var(--text-2);font:12px/1.5 var(--font-sans)}.keychain-artwork{display:flex;align-items:center;gap:8px;justify-content:space-between;overflow-wrap:anywhere}.keychain-check,.keychain-color{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}.keychain-check{justify-content:flex-start}.keychain-color input{width:48px;height:32px;padding:0;border:1px solid var(--border);background:transparent;cursor:pointer}.keychain-feedback{padding:0 16px 16px}.keychain-loop{width:100%;height:160px;background:var(--inset);border:1px solid var(--border);border-radius:var(--r-sm);touch-action:none;cursor:grab}.keychain-loop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.keychain-loop-track{fill:none;stroke:var(--text-3);stroke-width:.3;stroke-dasharray:1 1}.keychain-loop-body{fill:var(--surface-2);stroke:var(--text-2);stroke-width:.4}.keychain-loop-tab{fill:var(--accent);fill-opacity:.7;stroke:var(--accent);stroke-width:.4}.keychain-loop-hole{fill:var(--inset);stroke:var(--accent);stroke-width:.4}.keychain-sides{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.keychain-sides .btn{padding:6px 4px;font-size:12px}.keychain-upload:focus-within{outline:2px solid var(--accent);outline-offset:2px}.keychain-color{flex-direction:row}.keychain-font-upload{padding-top:10px}.keychain-upload{position:relative;overflow:hidden;justify-content:center}.keychain-upload input{position:absolute;inset:0;opacity:0;cursor:pointer}.keychain-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px 68px;text-align:center;color:var(--text-1);pointer-events:none}.keychain-empty strong{font:600 24px/1.2 var(--font-sans)}.keychain-empty p{margin:0;color:var(--text-2);font:14px/1.5 var(--font-sans);max-width:30ch}.keychain-empty .btn{pointer-events:auto}.keychain-stage-drop{position:absolute;inset:12px;z-index:20;display:grid;place-content:center;background:var(--surface);border:2px dashed var(--accent);border-radius:var(--r-md);pointer-events:none;font:600 20px/1.4 var(--font-sans)}.keychain-art-row{display:flex;align-items:center;gap:6px}.keychain-art-select{flex:1;min-width:0;justify-content:flex-start;overflow-wrap:anywhere;text-align:left;height:auto;white-space:normal}.keychain-art-select.on{background:var(--wash-selected);border-color:var(--accent)}.keychain-edit-heading{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.keychain-edit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.keychain-svg-color{display:flex;flex-direction:column;gap:10px;padding-top:12px;border-top:1px solid var(--border)}.keychain-stage-tools{position:absolute;left:12px;top:12px;z-index:3}.keychain-stage-tools .btn{background:var(--surface)}.keychain-stage-tools .btn[aria-pressed=true]{border-color:var(--accent);background:var(--wash-selected)}.keychain-stage-tools{display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 124px)}.keychain-stage-tools .keychain-help{flex-basis:100%;max-width:34ch;padding:4px 0;pointer-events:none}keychain-shape-gizmo{display:contents}.keychain-object-shape{position:absolute;inset:0;z-index:4;pointer-events:none}.keychain-object-shape svg{display:block;width:100%;height:100%;overflow:hidden;pointer-events:none}.keychain-object-outline{fill:none;stroke:var(--accent);stroke-width:1.25;opacity:.45;pointer-events:none}.keychain-object-stem{fill:none;stroke:var(--accent);stroke-width:1.5;pointer-events:none}.keychain-object-shape[data-dragging=true] .keychain-object-outline{stroke-width:2;opacity:1}.keychain-object-handle{pointer-events:all;touch-action:none;cursor:move;outline:none}.keychain-object-hit{fill:transparent}.keychain-object-dot{fill:var(--accent-fg);stroke:var(--accent);stroke-width:2;pointer-events:none}.keychain-object-handle:hover .keychain-object-dot,.keychain-object-handle:focus-visible .keychain-object-dot{fill:var(--accent);stroke:var(--accent-fg)}.keychain-object-handle:focus-visible .keychain-object-dot{stroke-width:3}.keychain-object-handle[aria-disabled=true]{pointer-events:none;opacity:.5}.keychain-object-value{position:absolute;transform:translate(-50%,-100%);padding:5px 8px;border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface);color:var(--text-1);font:500 12px/1.5 var(--font-mono);white-space:nowrap;pointer-events:none}.keychain-edit-grid>.keychain-field{min-width:0}.keychain-edit-grid strata-number .wb-number{width:100%;min-width:0}.keychain-position-grid>.keychain-field:last-child{grid-column:1 / -1}.keychain-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.keychain-shape-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;border:0;padding:0;margin:0;min-width:0}.keychain-shape-choice{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:76px;padding:8px 4px;border:1px solid var(--control-border);border-radius:var(--r-sm);background:var(--inset);color:var(--text-2);cursor:pointer;text-align:center;transition:background .14s ease-out,border-color .14s ease-out}.keychain-shape-choice input{position:absolute;width:1px;height:1px;opacity:0}.keychain-shape-choice svg{width:54px;height:34px;fill:var(--surface-3);stroke:currentColor;stroke-width:1.5}.keychain-shape-choice span{font:500 12px/1.3 var(--font-sans)}.keychain-shape-choice:hover{background:var(--surface-3);color:var(--text-1)}.keychain-shape-choice:has(input:checked){border-color:var(--accent);background:var(--wash-selected);color:var(--text-1)}.keychain-shape-choice:has(input:checked) svg{stroke:var(--accent)}.keychain-shape-choice:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:2px}.keychain-shape-plan{display:flex;flex-direction:column;gap:8px}.keychain-shape-preview{width:100%;height:160px;display:block;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--inset);touch-action:none}.keychain-shape-body{fill:var(--surface-2);stroke:var(--text-2);stroke-width:1;vector-effect:non-scaling-stroke}.keychain-shape-art{fill:var(--text-3);fill-opacity:.65;pointer-events:none}.keychain-shape-guide{stroke:var(--accent);stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:none}.keychain-shape-handle{cursor:ew-resize;outline:none}.keychain-shape-hit{fill:transparent}.keychain-shape-dot{fill:var(--accent);stroke:var(--accent-fg);stroke-width:1.5;vector-effect:non-scaling-stroke}.keychain-shape-handle:hover .keychain-shape-dot,.keychain-shape-handle:focus-visible .keychain-shape-dot{stroke:var(--focus);stroke-width:4}.keychain-corner-controls{display:flex;flex-direction:column;gap:8px}.keychain-corner-presets{display:flex;gap:6px}.keychain-corner-presets .btn{flex:1;justify-content:center;min-height:32px}.keychain-corner-presets .btn[aria-pressed=true]{border-color:var(--accent);background:var(--wash-selected);color:var(--text-1)}@media(max-width:760px){.keychain-shape-choice{min-height:80px}keychain-app .keychain-corner-presets .btn{min-height:44px}}.keychain-object-cross{fill:none;stroke:var(--accent);stroke-width:1.5;pointer-events:none}.keychain-object-handle:hover .keychain-object-cross,.keychain-object-handle:focus-visible .keychain-object-cross{stroke:var(--accent-fg)}
