From 0a3c578978a43bdacbc72b0000c7825c5ed5e9bb Mon Sep 17 00:00:00 2001 From: Jack Granatowski Date: Tue, 7 Jul 2026 09:40:06 +0200 Subject: [PATCH 1/6] fix: preserve Bricks color preview placement --- SLASHED-for-WP/integrations/bricks/assets/editor-app/app.css | 2 +- .../integrations/bricks/editor-app/src/styles/panel.css | 3 --- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/SLASHED-for-WP/integrations/bricks/assets/editor-app/app.css b/SLASHED-for-WP/integrations/bricks/assets/editor-app/app.css index c78f9fe5..d242d650 100644 --- a/SLASHED-for-WP/integrations/bricks/assets/editor-app/app.css +++ b/SLASHED-for-WP/integrations/bricks/assets/editor-app/app.css @@ -1,2 +1,2 @@ -#slashed-rebemer-host{--rebemer-bg:#161a1d;--rebemer-fg:#e1e1e1;--rebemer-fg-muted:#8a8d95;--rebemer-border:#3d4752;--rebemer-accent:#e2b93b;--rebemer-accent-hover:#ffd042;--rebemer-input-bg:#293038;--rebemer-input-border:#3d4752;--rebemer-error:#ff4c4c;--rebemer-success:#4ade80;--rebemer-radius:4px;--rebemer-font:"Inter", -apple-system, blinkmacsystemfont, sans-serif}.rebemer-badge-host{opacity:0;pointer-events:none;flex:none;align-self:center;align-items:center;margin:0 4px;transition:opacity 80ms linear;display:inline-flex}.structure-item:hover .rebemer-badge-host,.structure-item:focus-within .rebemer-badge-host,li[data-id]:hover>.rebemer-badge-host,li[data-id]:focus-within>.rebemer-badge-host{opacity:1;pointer-events:auto}.rebemer-badge{font:600 9px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);letter-spacing:0;text-transform:none;color:var(--rebemer-fg-muted,#8a8d95);cursor:pointer;pointer-events:auto;background:0 0;border-radius:2px;margin:0;padding:1px 3px;display:inline}.rebemer-badge:hover{color:var(--rebemer-accent,#e2b93b);background:#e2b93b14}.rebemer-badge:focus-visible{outline:1px dotted var(--rebemer-accent,#e2b93b);outline-offset:1px;color:var(--rebemer-accent,#e2b93b)}.rebemer-panel{z-index:100000;background:var(--rebemer-bg);width:440px;max-width:calc(100vw - 40px);max-height:80vh;color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);outline:none;flex-direction:column;display:flex;position:fixed;top:80px;left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 10px 40px #0009}.rebemer-panel__header{border-bottom:1px solid var(--rebemer-border);justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.rebemer-panel__title{text-transform:uppercase;letter-spacing:.5px;color:#fff;margin:0;font-size:11px;font-weight:700}.rebemer-panel__subject{color:var(--rebemer-accent);text-transform:none;font-weight:500}.rebemer-panel__close{color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;border:0;padding:2px 6px;font-size:18px}.rebemer-panel__close:hover{color:#fff}.rebemer-panel__toolbar{border-bottom:1px solid var(--rebemer-border);flex-wrap:wrap;align-items:center;gap:12px;padding:10px 14px;display:flex}.rebemer-field{flex-direction:column;gap:4px;font-size:11px;display:flex}.rebemer-field--inline{flex-direction:row;align-items:center;gap:6px}.rebemer-field__label{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px}.rebemer-field select,.rebemer-field input[type=text]{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;padding:4px 6px}.rebemer-field select:focus,.rebemer-field input:focus{outline:1px solid var(--rebemer-accent)}.rebemer-panel__mode-hint{color:var(--rebemer-fg-muted);background:var(--rebemer-bg);border-bottom:1px solid var(--rebemer-border);margin:0;padding:5px 14px;font-size:11px;line-height:1.4}.rebemer-panel__notice{border-bottom:1px solid var(--rebemer-border);color:var(--rebemer-fg);background:#e2b93b14;margin:0;padding:8px 14px;font-size:11px;line-height:1.5}.rebemer-panel__notice--warn{background:#e2b93b29}.rebemer-panel__notice strong{color:var(--rebemer-accent);font-weight:600}.rebemer-panel__notice-skip{color:var(--rebemer-fg-muted);margin-top:2px;display:block}.rebemer-panel__body{flex-direction:column;flex:1;gap:6px;padding:8px 14px;display:flex;overflow-y:auto}.rebemer-row{border-radius:var(--rebemer-radius);margin-left:calc(var(--rebemer-row-depth,0) * 12px);background:#ffffff05;grid-template-columns:auto 1fr;align-items:center;gap:8px;padding:6px 8px;display:grid}.rebemer-row:hover{background:#ffffff0a}.rebemer-row--disabled{opacity:.45}.rebemer-row__include input{cursor:pointer}.rebemer-row__meta{align-items:baseline;gap:6px;min-width:0;display:flex}.rebemer-row__label{white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.rebemer-row__type{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.3px;font-size:9px}.rebemer-row__type--toggle{cursor:pointer;background:0 0;border:0;border-radius:2px;padding:1px 3px;line-height:1}.rebemer-row__type--toggle:hover:not(:disabled){color:var(--rebemer-fg);background:#ffffff0f}.rebemer-row__type--toggle:disabled{cursor:default;opacity:.5}.rebemer-row__type--block{color:var(--rebemer-accent);background:#e2b93b1f}.rebemer-row__type--block:hover:not(:disabled){background:#e2b93b33}.rebemer-row__hint{color:var(--rebemer-accent);text-transform:uppercase;letter-spacing:.5px;background:#e2b93b1f;border-radius:2px;padding:1px 4px;font-size:9px}.rebemer-row__inputs{grid-column:1/-1;align-items:center;gap:6px;display:flex}.rebemer-row__name{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);flex:1;align-items:stretch;display:flex;overflow:hidden}.rebemer-row__prefix{color:var(--rebemer-fg-muted);border-right:1px solid var(--rebemer-input-border);white-space:nowrap;background:#00000040;padding:4px 6px;font-size:11px}.rebemer-row__name input{color:var(--rebemer-fg);font:inherit;background:0 0;border:0;outline:0;flex:1;min-width:0;padding:4px 6px}.rebemer-row--suggested .rebemer-row__name input:not(:focus){color:var(--rebemer-fg-muted);font-style:italic}.rebemer-row__modifier{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;width:90px;padding:4px 6px}.rebemer-row__modifiers{flex-direction:column;flex:1;gap:4px;display:flex}.rebemer-row__modifier-row{align-items:center;gap:4px;display:flex}.rebemer-row__modifier-row .rebemer-row__modifier{flex:1;width:auto}.rebemer-row__modifier-remove{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;flex:none;padding:2px 6px;font-size:13px;line-height:1}.rebemer-row__modifier-remove:hover:not(:disabled){border-color:var(--rebemer-error);color:var(--rebemer-error)}.rebemer-row__modifier-add{border:1px dashed var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg-muted);font:inherit;cursor:pointer;text-align:left;background:0 0;width:-moz-fit-content;width:fit-content;padding:3px 7px;font-size:10px}.rebemer-row__modifier-add:hover:not(:disabled){border-color:var(--rebemer-fg-muted);color:var(--rebemer-fg)}.rebemer-row__op-toggle{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);grid-column:1/-1;align-items:center;width:-moz-fit-content;width:fit-content;margin-top:2px;display:inline-flex;overflow:hidden}.rebemer-row__op-btn{background:var(--rebemer-input-bg);border:0;border-left:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap;padding:4px 9px}.rebemer-row__op-btn:first-child{border-left:0}.rebemer-row__op-btn--on{color:var(--rebemer-accent);background:#e2b93b1f}.rebemer-row__op-btn:hover:not(.rebemer-row__op-btn--on){color:var(--rebemer-fg);background:#ffffff0f}.rebemer-row__family{grid-column:1/-1;align-items:center;gap:7px;margin-top:3px;display:flex}.rebemer-row__family-label{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;flex:none;font-size:9px}.rebemer-row__family-select{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;flex:1;min-width:0;padding:3px 6px;font-size:11px}.rebemer-row__family-select:focus{outline:1px solid var(--rebemer-accent)}.rebemer-row__info code,.rebemer-row__warn code{color:var(--rebemer-accent);background:#0000004d;border-radius:2px;padding:1px 4px;font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-row__recommend{border-left:2px solid var(--rebemer-success);color:var(--rebemer-fg);background:#4ade8014;border-radius:2px;grid-column:1/-1;margin:0;padding:6px 8px;font-size:11px;line-height:1.4}.rebemer-row__recommend code{color:var(--rebemer-accent);background:#0000004d;border-radius:2px;padding:1px 4px;font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-row__warn,.rebemer-row__info{border-radius:2px;grid-column:1/-1;margin:0;padding:5px 8px;font-size:11px;line-height:1.4}.rebemer-row__warn{color:var(--rebemer-fg);background:#e2b93b1f;border-left:2px solid #e2b93b}.rebemer-row__info{color:var(--rebemer-fg-muted);background:#63b3ed1a;border-left:2px solid #63b3ed}.rebemer-row__chips{flex-wrap:wrap;grid-column:1/-1;align-items:center;gap:4px;padding:4px 0 0;font-size:10px;display:flex}.rebemer-row__chips-label,.rebemer-row__chips-empty,.rebemer-row__chips-skip{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;font-size:9px}.rebemer-row__chips-skip{cursor:help;color:#c8a038;margin-left:auto}.rebemer-chip{border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg);white-space:nowrap;background:#0000004d;border-radius:2px;padding:2px 5px;font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-panel__footer{border-top:1px solid var(--rebemer-border);justify-content:flex-end;gap:8px;padding:10px 14px;display:flex}.rebemer-btn{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg);border-radius:var(--rebemer-radius);font:inherit;cursor:pointer;padding:6px 12px}.rebemer-btn:hover{border-color:var(--rebemer-fg-muted)}.rebemer-btn--primary{background:var(--rebemer-accent);border-color:var(--rebemer-accent);color:var(--rebemer-bg);font-weight:600}.rebemer-btn--primary:hover{background:var(--rebemer-accent-hover);border-color:var(--rebemer-accent-hover)}.rebemer-toast{z-index:100002;background:var(--rebemer-input-bg);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);cursor:pointer;padding:8px 12px;position:fixed;bottom:16px;right:16px;box-shadow:0 4px 12px #0006}.rebemer-toast--success{border-color:var(--rebemer-success)}.rebemer-toast--error{border-color:var(--rebemer-error);color:var(--rebemer-error)}.rebemer-class-hint{z-index:100003;background:var(--rebemer-bg);max-width:280px;color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);pointer-events:none;padding:8px 10px;position:fixed;box-shadow:0 6px 20px #00000080}.rebemer-class-hint[hidden]{display:none}.rebemer-class-hint__name{color:var(--rebemer-accent);font:600 11px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-class-hint__cat{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin-left:6px;font-size:9px}.rebemer-class-hint__cat[hidden]{display:none}.rebemer-class-hint__desc{color:var(--rebemer-fg);margin:4px 0 0}.rebemer-class-hint-btn{border:1px solid var(--rebemer-border,#3d4752);width:16px;height:16px;color:var(--rebemer-fg-muted,#8a8d95);font:700 10px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);cursor:help;opacity:.7;vertical-align:middle;background:0 0;border-radius:50%;flex:none;justify-content:center;align-items:center;margin-inline-start:4px;transition:opacity .12s,color .12s,border-color .12s;display:inline-flex}.rebemer-class-hint-btn:before{content:"?"}.rebemer-class-hint-btn:hover{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.rebemer-class-hint-btn:focus-visible{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.slashed-cp-launch{z-index:99999;background:var(--rebemer-bg);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);font:600 11px/1 var(--rebemer-font);letter-spacing:.3px;cursor:pointer;border-radius:999px;align-items:center;gap:7px;padding:7px 12px;transition:border-color .12s,color .12s,transform .12s;display:inline-flex;position:fixed;bottom:16px;right:16px;box-shadow:0 4px 16px #00000073}.slashed-cp-launch:hover{border-color:var(--rebemer-fg-muted);transform:translateY(-1px)}.slashed-cp-launch--on{border-color:var(--rebemer-accent);color:#fff}.slashed-cp-launch__dot{background:conic-gradient(from 210deg,#5b8cff,#b07cff,#ff6b6b,#ffd24a,#4ade80,#5b8cff);border-radius:50%;width:12px;height:12px;box-shadow:inset 0 0 0 1px #ffffff40}.slashed-cp-launch__txt{text-transform:uppercase}.slashed-cp{z-index:100001;background:var(--rebemer-bg);width:372px;max-width:calc(100vw - 32px);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);outline:none;flex-direction:column;display:flex;position:fixed;top:64px;bottom:64px;right:16px;overflow:hidden;box-shadow:0 12px 48px #0009}.slashed-cp__header{border-bottom:1px solid var(--rebemer-border);align-items:center;gap:10px;padding:10px 12px;display:flex}.slashed-cp__title{text-transform:uppercase;letter-spacing:.5px;color:#fff;flex:1;margin:0;font-size:11px;font-weight:700}.slashed-cp__close{color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;border:0;padding:2px 4px;font-size:18px;line-height:1}.slashed-cp__close:hover{color:#fff}.slashed-cp__seg{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);display:inline-flex;overflow:hidden}.slashed-cp__seg-btn{background:var(--rebemer-input-bg);border:0;border-left:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;text-transform:uppercase;letter-spacing:.4px;padding:5px 9px}.slashed-cp__seg-btn:first-child{border-left:0}.slashed-cp__seg-btn--on{background:var(--rebemer-accent);color:var(--rebemer-bg)}.slashed-cp__toolbar{border-bottom:1px solid var(--rebemer-border);flex-direction:column;gap:8px;padding:10px 12px;display:flex}.slashed-cp__search{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);width:100%;color:var(--rebemer-fg);font:inherit;box-sizing:border-box;padding:6px 8px}.slashed-cp__search:focus{outline:1px solid var(--rebemer-accent)}.slashed-cp__target{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.slashed-cp__target-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);font-size:9px}.slashed-cp__chip{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;border-radius:999px;padding:4px 10px}.slashed-cp__chip--on{background:var(--rebemer-accent);border-color:var(--rebemer-accent);color:var(--rebemer-bg)}.slashed-cp__body{flex:1;padding:6px 12px 12px;overflow-y:auto}.slashed-cp__empty{color:var(--rebemer-fg-muted);padding:12px 2px;font-size:11px}.slashed-cp__group{border-bottom:1px solid #ffffff0d;padding:10px 0 6px}.slashed-cp__group:last-child{border-bottom:0}.slashed-cp__group-head{margin:0 0 8px}.slashed-cp__group-title{color:#fff;text-transform:capitalize;align-items:baseline;gap:7px;margin:0;font-size:11px;font-weight:700;display:flex}.slashed-cp__group-tag{color:var(--rebemer-fg-muted);text-transform:none;font-size:10px;font-weight:500}.slashed-cp__group-count{font:600 9px/1 var(--rebemer-font);color:var(--rebemer-fg-muted);text-transform:none;background:#ffffff0f;border-radius:999px;margin-left:auto;padding:2px 6px}.slashed-cp__group-use{color:var(--rebemer-fg-muted);margin:2px 0 0;font-size:10px;line-height:1.4}.slashed-cp__section-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:8px 0 5px;font-size:9px}.slashed-cp__grid{grid-template-columns:repeat(auto-fill,minmax(38px,1fr));gap:7px 6px;display:grid}.slashed-cp__cell{flex-direction:column;align-items:center;gap:3px;min-width:0;display:flex}.slashed-cp__cap{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:9px;overflow:hidden}.slashed-cp__list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.slashed-cp__list-item{align-items:center;gap:8px;display:flex}.slashed-cp__list-name{color:var(--rebemer-fg);flex:none;font-size:11px}.slashed-cp__list-var{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;margin-left:auto;font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow:hidden}.slashed-cp-swatch{cursor:pointer;background:0 0;border:1px solid #7f7f7f73;border-radius:6px;flex:none;width:28px;height:28px;padding:0;position:relative;overflow:hidden}.slashed-cp-swatch:hover{border-color:var(--rebemer-accent)}.slashed-cp-swatch:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:1px}.slashed-cp-swatch__fill{background:var(--cp-solid);position:absolute;top:0;bottom:0;left:0;right:0}.slashed-cp-swatch--split .slashed-cp-swatch__fill{background:linear-gradient(135deg, var(--cp-l) 0 calc(50% - .5px), #00000059 calc(50% - .5px) calc(50% + .5px), var(--cp-d) calc(50% + .5px) 100%)}.slashed-cp-swatch--alpha{border-style:dashed}.slashed-cp__footer{border-top:1px solid var(--rebemer-border);color:var(--rebemer-fg-muted);align-items:center;gap:10px;padding:8px 12px;font-size:10px;display:flex}.slashed-cp__hint{margin-left:auto}.slashed-cp__hint code,.slashed-cp__footer code{color:var(--rebemer-accent);font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.slashed-cp__legend{align-items:center;gap:5px;display:inline-flex}.slashed-cp__legend-sw{background:linear-gradient(135deg,#fff 0 50%,#222 50% 100%);border:1px solid #7f7f7f73;border-radius:3px;width:12px;height:12px}.rebemer-toast--info{border-color:#63b3ed}.slashed-sf-color-btn{cursor:pointer;opacity:.65;border-radius:5px;flex-shrink:0;order:11;justify-content:center;align-items:center;width:28px;height:28px;margin-left:3px;transition:opacity .12s,background .12s;display:inline-flex}.slashed-sf-color-btn:hover{opacity:1;background:#5b8cff26}.slashed-sf-color-btn--active{opacity:1}.slashed-sf-color-btn--active:hover{background:0 0}.slashed-sf-color-btn__dot{background:conic-gradient(from 210deg,#5b8cff,#b07cff,#ff6b6b,#ffd24a,#4ade80,#5b8cff);border-radius:50%;flex-shrink:0;width:20px;height:20px;transition:width 80ms,height 80ms,border-radius .12s,box-shadow .12s;display:inline-block;box-shadow:inset 0 0 0 1px #fff3}.slashed-sf-color-btn--active .slashed-sf-color-btn__dot{border-radius:5px;width:28px;height:28px;transition:width 80ms,height 80ms,border-radius .12s;animation:2.4s ease-in-out infinite slashed-sf-active-glow}@keyframes slashed-sf-active-glow{0%,to{box-shadow:inset 0 0 0 1px #0003, 0 0 0 2px color-mix(in srgb, var(--sf-active-color,#fff) 60%, transparent), 0 0 7px color-mix(in srgb, var(--sf-active-color,#fff) 35%, transparent)}50%{box-shadow:inset 0 0 0 1px #0003, 0 0 0 2.5px color-mix(in srgb, var(--sf-active-color,#fff) 88%, transparent), 0 0 14px color-mix(in srgb, var(--sf-active-color,#fff) 50%, transparent)}}.bricks-control-preview:has(.slashed-sf-preview-label){position:relative}.slashed-sf-preview-label{color:#ff4040;pointer-events:none;text-shadow:0 0 3px #0009;justify-content:center;align-items:center;font:700 11px/1 system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.slashed-var-swatch{vertical-align:middle;background-color:#fff;background-image:linear-gradient(var(--slashed-swatch-color,transparent), var(--slashed-swatch-color,transparent)), linear-gradient(45deg, #7f7f7f59 25%, transparent 25%, transparent 75%, #7f7f7f59 75%), linear-gradient(45deg, #7f7f7f59 25%, transparent 25%, transparent 75%, #7f7f7f59 75%);background-position:0 0,0 0,4px 4px;background-size:auto,8px 8px,8px 8px;border:1px solid #7f7f7f73;border-radius:3px;flex:none;width:12px;height:12px;margin-right:7px;display:inline-block}.slashed-cp--docked{top:0;bottom:0;left:var(--cp-dock-left,320px);border-top-left-radius:0;border-bottom-left-radius:0;width:360px;right:auto;box-shadow:6px 0 32px #0000008c}.slashed-cp[data-mode=both] .slashed-cp__qu-sw,.slashed-cp[data-mode=both] .slashed-cp__scan-base,.slashed-cp[data-mode=both] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=both] .slashed-cp__fam-banner,.slashed-cp[data-mode=both] .slashed-cp__strip-sw{background:linear-gradient(135deg, var(--sw-l) 0 calc(50% - .5px), #00000059 calc(50% - .5px) calc(50% + .5px), var(--sw-d) calc(50% + .5px) 100%)}.slashed-cp[data-mode=light] .slashed-cp__qu-sw,.slashed-cp[data-mode=light] .slashed-cp__scan-base,.slashed-cp[data-mode=light] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=light] .slashed-cp__fam-banner,.slashed-cp[data-mode=light] .slashed-cp__strip-sw{background:var(--sw-l)}.slashed-cp[data-mode=dark] .slashed-cp__qu-sw,.slashed-cp[data-mode=dark] .slashed-cp__scan-base,.slashed-cp[data-mode=dark] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=dark] .slashed-cp__fam-banner,.slashed-cp[data-mode=dark] .slashed-cp__strip-sw{background:var(--sw-d)}.slashed-cp__sec{border-bottom:1px solid #ffffff0d;padding:10px 0 6px}.slashed-cp__sec:last-child{border-bottom:0}.slashed-cp__sec-title{text-transform:uppercase;letter-spacing:1px;color:var(--rebemer-fg-muted);margin:0 0 10px;font-size:9px;font-weight:700}.slashed-cp__sec--pal{padding-top:12px}.slashed-cp__qu-group{margin-bottom:10px}.slashed-cp__qu-group:last-child{margin-bottom:0}.slashed-cp__qu-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:0 0 4px;font-size:9px}.slashed-cp__qu-grid{grid-template-columns:1fr 1fr;gap:2px;display:grid}.slashed-cp__qu-cell{color:var(--rebemer-fg);font:11px/1.3 var(--rebemer-font);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:5px;align-items:center;gap:7px;min-width:0;padding:4px 6px;transition:background 80ms;display:flex}.slashed-cp__qu-cell:hover{background:#ffffff0f}.slashed-cp__qu-sw{border:1px solid #7f7f7f59;border-radius:5px;flex:0 0 22px;width:22px;height:22px;transition:border-color 80ms}.slashed-cp__qu-sw--alpha{border-style:dashed}.slashed-cp__qu-cell:hover .slashed-cp__qu-sw{border-color:var(--rebemer-accent)}.slashed-cp__qu-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.slashed-cp__pal-cat{text-transform:uppercase;letter-spacing:.8px;color:var(--rebemer-fg-muted);margin:10px 0 5px;font-size:9px;font-weight:700}.slashed-cp__pal-cat:first-of-type{margin-top:2px}.slashed-cp__scanner{border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);margin-bottom:4px;overflow:hidden}.slashed-cp__scan-item+.slashed-cp__scan-item{border-top:1px solid var(--rebemer-border)}.slashed-cp__scan-row{width:100%;color:var(--rebemer-fg);font:11px/1 var(--rebemer-font);cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:8px;padding:7px 10px;transition:background 80ms;display:flex}.slashed-cp__scan-row:hover,.slashed-cp__scan-row--open{background:#ffffff0a}.slashed-cp__scan-base{border:1px solid #7f7f7f4d;border-radius:4px;flex:0 0 18px;width:18px;height:18px}.slashed-cp__scan-name{flex:none;font-weight:600}.slashed-cp__scan-tagline{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:10px;overflow:hidden}.slashed-cp__scan-pre{flex:none;gap:3px;display:flex}.slashed-cp__scan-pre-sw{border:1px solid #7f7f7f33;border-radius:3px;width:14px;height:14px}.slashed-cp__scan-chev{color:var(--rebemer-fg-muted);flex:none;font-size:10px}.slashed-cp__fam{border-top:1px solid var(--rebemer-border);background:#0000001f;padding:10px 10px 12px}.slashed-cp__fam-banner{cursor:pointer;box-sizing:border-box;border:0;border-radius:7px;align-items:flex-end;width:100%;height:52px;margin-bottom:10px;padding:7px 10px;transition:opacity .12s;display:flex;overflow:hidden}.slashed-cp__fam-banner:hover{opacity:.85}.slashed-cp__fam-banner-lbl{font:700 9px/1 var(--rebemer-font);text-transform:uppercase;letter-spacing:2px;color:#ffffffe6;text-shadow:0 1px 3px #0009}.slashed-cp__fam-sec{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:8px 0 6px;font-size:9px}.slashed-cp__fam-sec:first-child{margin-top:0}.slashed-cp__fam-sec-range{text-transform:none;letter-spacing:0;color:#ffffff40;font-weight:400}.slashed-cp__strip{border-radius:5px;height:24px;display:flex;overflow:hidden}.slashed-cp__strip--alpha{opacity:.8;margin-top:4px}.slashed-cp__strip-sw{cursor:pointer;border:0;flex:1;min-width:0;padding:0;transition:flex .1s ease-out;position:relative}.slashed-cp__strip-sw:hover{box-shadow:inset 0 0 0 2px var(--rebemer-accent);flex:2}.slashed-cp__strip-sw--alpha{box-shadow:inset 0 0 0 1px #7f7f7f66}.slashed-cp__strip-sw--alpha:hover{box-shadow:inset 0 0 0 2px var(--rebemer-accent)}.slashed-cp__strip-sw:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px;z-index:1}.slashed-cp__alpha-btn{color:var(--rebemer-fg-muted);font:10px/1 var(--rebemer-font);cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;margin-top:8px;padding:0;display:flex}.slashed-cp__alpha-btn:hover{color:var(--rebemer-fg)}.slashed-cp__alpha-btn:focus-visible{outline:1px dotted var(--rebemer-accent);outline-offset:2px;color:var(--rebemer-fg)}.slashed-cp__qu-cell:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-cp__scan-row:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-cp__fam-banner:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-var-hint{z-index:100003;white-space:normal;overflow-wrap:break-word;background:var(--rebemer-bg,#161a1d);width:max-content;max-width:320px;color:var(--rebemer-fg,#e1e1e1);border:1px solid var(--rebemer-border,#3d4752);border-radius:var(--rebemer-radius,4px);font:12px/1.45 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);pointer-events:none;padding:6px 10px;position:fixed;box-shadow:0 6px 20px #00000080}.slashed-var-hint[hidden]{display:none}.slashed-var-hint__name{color:var(--rebemer-accent,#e2b93b);font:600 11px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.slashed-var-hint__cat{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted,#8a8d95);margin-left:6px;font-size:9px}.slashed-var-hint__cat[hidden]{display:none}.slashed-var-hint__desc{color:var(--rebemer-fg,#e1e1e1);margin:5px 0 0;padding:0;font-size:11px;line-height:1.5}.slashed-var-hint__desc[hidden]{display:none}.slashed-var-hint-btn{border:1px solid var(--rebemer-border,#3d4752);width:14px;min-width:14px;height:14px;min-height:14px;max-height:14px;color:var(--rebemer-fg-muted,#8a8d95);font:700 9px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);cursor:help;opacity:.6;vertical-align:middle;box-sizing:content-box;background:0 0;border-radius:50%;flex:none;justify-content:center;align-self:center;align-items:center;margin-left:6px;line-height:1;transition:opacity .12s,color .12s,border-color .12s;display:inline-flex}.slashed-var-hint-btn:before{content:"?"}.slashed-var-hint-btn:hover{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.slashed-var-hint-btn:focus-visible{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none} +#slashed-rebemer-host{--rebemer-bg:#161a1d;--rebemer-fg:#e1e1e1;--rebemer-fg-muted:#8a8d95;--rebemer-border:#3d4752;--rebemer-accent:#e2b93b;--rebemer-accent-hover:#ffd042;--rebemer-input-bg:#293038;--rebemer-input-border:#3d4752;--rebemer-error:#ff4c4c;--rebemer-success:#4ade80;--rebemer-radius:4px;--rebemer-font:"Inter", -apple-system, blinkmacsystemfont, sans-serif}.rebemer-badge-host{opacity:0;pointer-events:none;flex:none;align-self:center;align-items:center;margin:0 4px;transition:opacity 80ms linear;display:inline-flex}.structure-item:hover .rebemer-badge-host,.structure-item:focus-within .rebemer-badge-host,li[data-id]:hover>.rebemer-badge-host,li[data-id]:focus-within>.rebemer-badge-host{opacity:1;pointer-events:auto}.rebemer-badge{font:600 9px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);letter-spacing:0;text-transform:none;color:var(--rebemer-fg-muted,#8a8d95);cursor:pointer;pointer-events:auto;background:0 0;border-radius:2px;margin:0;padding:1px 3px;display:inline}.rebemer-badge:hover{color:var(--rebemer-accent,#e2b93b);background:#e2b93b14}.rebemer-badge:focus-visible{outline:1px dotted var(--rebemer-accent,#e2b93b);outline-offset:1px;color:var(--rebemer-accent,#e2b93b)}.rebemer-panel{z-index:100000;background:var(--rebemer-bg);width:440px;max-width:calc(100vw - 40px);max-height:80vh;color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);outline:none;flex-direction:column;display:flex;position:fixed;top:80px;left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 10px 40px #0009}.rebemer-panel__header{border-bottom:1px solid var(--rebemer-border);justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.rebemer-panel__title{text-transform:uppercase;letter-spacing:.5px;color:#fff;margin:0;font-size:11px;font-weight:700}.rebemer-panel__subject{color:var(--rebemer-accent);text-transform:none;font-weight:500}.rebemer-panel__close{color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;border:0;padding:2px 6px;font-size:18px}.rebemer-panel__close:hover{color:#fff}.rebemer-panel__toolbar{border-bottom:1px solid var(--rebemer-border);flex-wrap:wrap;align-items:center;gap:12px;padding:10px 14px;display:flex}.rebemer-field{flex-direction:column;gap:4px;font-size:11px;display:flex}.rebemer-field--inline{flex-direction:row;align-items:center;gap:6px}.rebemer-field__label{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px}.rebemer-field select,.rebemer-field input[type=text]{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;padding:4px 6px}.rebemer-field select:focus,.rebemer-field input:focus{outline:1px solid var(--rebemer-accent)}.rebemer-panel__mode-hint{color:var(--rebemer-fg-muted);background:var(--rebemer-bg);border-bottom:1px solid var(--rebemer-border);margin:0;padding:5px 14px;font-size:11px;line-height:1.4}.rebemer-panel__notice{border-bottom:1px solid var(--rebemer-border);color:var(--rebemer-fg);background:#e2b93b14;margin:0;padding:8px 14px;font-size:11px;line-height:1.5}.rebemer-panel__notice--warn{background:#e2b93b29}.rebemer-panel__notice strong{color:var(--rebemer-accent);font-weight:600}.rebemer-panel__notice-skip{color:var(--rebemer-fg-muted);margin-top:2px;display:block}.rebemer-panel__body{flex-direction:column;flex:1;gap:6px;padding:8px 14px;display:flex;overflow-y:auto}.rebemer-row{border-radius:var(--rebemer-radius);margin-left:calc(var(--rebemer-row-depth,0) * 12px);background:#ffffff05;grid-template-columns:auto 1fr;align-items:center;gap:8px;padding:6px 8px;display:grid}.rebemer-row:hover{background:#ffffff0a}.rebemer-row--disabled{opacity:.45}.rebemer-row__include input{cursor:pointer}.rebemer-row__meta{align-items:baseline;gap:6px;min-width:0;display:flex}.rebemer-row__label{white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.rebemer-row__type{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.3px;font-size:9px}.rebemer-row__type--toggle{cursor:pointer;background:0 0;border:0;border-radius:2px;padding:1px 3px;line-height:1}.rebemer-row__type--toggle:hover:not(:disabled){color:var(--rebemer-fg);background:#ffffff0f}.rebemer-row__type--toggle:disabled{cursor:default;opacity:.5}.rebemer-row__type--block{color:var(--rebemer-accent);background:#e2b93b1f}.rebemer-row__type--block:hover:not(:disabled){background:#e2b93b33}.rebemer-row__hint{color:var(--rebemer-accent);text-transform:uppercase;letter-spacing:.5px;background:#e2b93b1f;border-radius:2px;padding:1px 4px;font-size:9px}.rebemer-row__inputs{grid-column:1/-1;align-items:center;gap:6px;display:flex}.rebemer-row__name{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);flex:1;align-items:stretch;display:flex;overflow:hidden}.rebemer-row__prefix{color:var(--rebemer-fg-muted);border-right:1px solid var(--rebemer-input-border);white-space:nowrap;background:#00000040;padding:4px 6px;font-size:11px}.rebemer-row__name input{color:var(--rebemer-fg);font:inherit;background:0 0;border:0;outline:0;flex:1;min-width:0;padding:4px 6px}.rebemer-row--suggested .rebemer-row__name input:not(:focus){color:var(--rebemer-fg-muted);font-style:italic}.rebemer-row__modifier{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;width:90px;padding:4px 6px}.rebemer-row__modifiers{flex-direction:column;flex:1;gap:4px;display:flex}.rebemer-row__modifier-row{align-items:center;gap:4px;display:flex}.rebemer-row__modifier-row .rebemer-row__modifier{flex:1;width:auto}.rebemer-row__modifier-remove{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;flex:none;padding:2px 6px;font-size:13px;line-height:1}.rebemer-row__modifier-remove:hover:not(:disabled){border-color:var(--rebemer-error);color:var(--rebemer-error)}.rebemer-row__modifier-add{border:1px dashed var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg-muted);font:inherit;cursor:pointer;text-align:left;background:0 0;width:-moz-fit-content;width:fit-content;padding:3px 7px;font-size:10px}.rebemer-row__modifier-add:hover:not(:disabled){border-color:var(--rebemer-fg-muted);color:var(--rebemer-fg)}.rebemer-row__op-toggle{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);grid-column:1/-1;align-items:center;width:-moz-fit-content;width:fit-content;margin-top:2px;display:inline-flex;overflow:hidden}.rebemer-row__op-btn{background:var(--rebemer-input-bg);border:0;border-left:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap;padding:4px 9px}.rebemer-row__op-btn:first-child{border-left:0}.rebemer-row__op-btn--on{color:var(--rebemer-accent);background:#e2b93b1f}.rebemer-row__op-btn:hover:not(.rebemer-row__op-btn--on){color:var(--rebemer-fg);background:#ffffff0f}.rebemer-row__family{grid-column:1/-1;align-items:center;gap:7px;margin-top:3px;display:flex}.rebemer-row__family-label{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;flex:none;font-size:9px}.rebemer-row__family-select{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;flex:1;min-width:0;padding:3px 6px;font-size:11px}.rebemer-row__family-select:focus{outline:1px solid var(--rebemer-accent)}.rebemer-row__info code,.rebemer-row__warn code{color:var(--rebemer-accent);background:#0000004d;border-radius:2px;padding:1px 4px;font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-row__recommend{border-left:2px solid var(--rebemer-success);color:var(--rebemer-fg);background:#4ade8014;border-radius:2px;grid-column:1/-1;margin:0;padding:6px 8px;font-size:11px;line-height:1.4}.rebemer-row__recommend code{color:var(--rebemer-accent);background:#0000004d;border-radius:2px;padding:1px 4px;font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-row__warn,.rebemer-row__info{border-radius:2px;grid-column:1/-1;margin:0;padding:5px 8px;font-size:11px;line-height:1.4}.rebemer-row__warn{color:var(--rebemer-fg);background:#e2b93b1f;border-left:2px solid #e2b93b}.rebemer-row__info{color:var(--rebemer-fg-muted);background:#63b3ed1a;border-left:2px solid #63b3ed}.rebemer-row__chips{flex-wrap:wrap;grid-column:1/-1;align-items:center;gap:4px;padding:4px 0 0;font-size:10px;display:flex}.rebemer-row__chips-label,.rebemer-row__chips-empty,.rebemer-row__chips-skip{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;font-size:9px}.rebemer-row__chips-skip{cursor:help;color:#c8a038;margin-left:auto}.rebemer-chip{border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg);white-space:nowrap;background:#0000004d;border-radius:2px;padding:2px 5px;font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-panel__footer{border-top:1px solid var(--rebemer-border);justify-content:flex-end;gap:8px;padding:10px 14px;display:flex}.rebemer-btn{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg);border-radius:var(--rebemer-radius);font:inherit;cursor:pointer;padding:6px 12px}.rebemer-btn:hover{border-color:var(--rebemer-fg-muted)}.rebemer-btn--primary{background:var(--rebemer-accent);border-color:var(--rebemer-accent);color:var(--rebemer-bg);font-weight:600}.rebemer-btn--primary:hover{background:var(--rebemer-accent-hover);border-color:var(--rebemer-accent-hover)}.rebemer-toast{z-index:100002;background:var(--rebemer-input-bg);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);cursor:pointer;padding:8px 12px;position:fixed;bottom:16px;right:16px;box-shadow:0 4px 12px #0006}.rebemer-toast--success{border-color:var(--rebemer-success)}.rebemer-toast--error{border-color:var(--rebemer-error);color:var(--rebemer-error)}.rebemer-class-hint{z-index:100003;background:var(--rebemer-bg);max-width:280px;color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);pointer-events:none;padding:8px 10px;position:fixed;box-shadow:0 6px 20px #00000080}.rebemer-class-hint[hidden]{display:none}.rebemer-class-hint__name{color:var(--rebemer-accent);font:600 11px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-class-hint__cat{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin-left:6px;font-size:9px}.rebemer-class-hint__cat[hidden]{display:none}.rebemer-class-hint__desc{color:var(--rebemer-fg);margin:4px 0 0}.rebemer-class-hint-btn{border:1px solid var(--rebemer-border,#3d4752);width:16px;height:16px;color:var(--rebemer-fg-muted,#8a8d95);font:700 10px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);cursor:help;opacity:.7;vertical-align:middle;background:0 0;border-radius:50%;flex:none;justify-content:center;align-items:center;margin-inline-start:4px;transition:opacity .12s,color .12s,border-color .12s;display:inline-flex}.rebemer-class-hint-btn:before{content:"?"}.rebemer-class-hint-btn:hover{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.rebemer-class-hint-btn:focus-visible{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.slashed-cp-launch{z-index:99999;background:var(--rebemer-bg);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);font:600 11px/1 var(--rebemer-font);letter-spacing:.3px;cursor:pointer;border-radius:999px;align-items:center;gap:7px;padding:7px 12px;transition:border-color .12s,color .12s,transform .12s;display:inline-flex;position:fixed;bottom:16px;right:16px;box-shadow:0 4px 16px #00000073}.slashed-cp-launch:hover{border-color:var(--rebemer-fg-muted);transform:translateY(-1px)}.slashed-cp-launch--on{border-color:var(--rebemer-accent);color:#fff}.slashed-cp-launch__dot{background:conic-gradient(from 210deg,#5b8cff,#b07cff,#ff6b6b,#ffd24a,#4ade80,#5b8cff);border-radius:50%;width:12px;height:12px;box-shadow:inset 0 0 0 1px #ffffff40}.slashed-cp-launch__txt{text-transform:uppercase}.slashed-cp{z-index:100001;background:var(--rebemer-bg);width:372px;max-width:calc(100vw - 32px);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);outline:none;flex-direction:column;display:flex;position:fixed;top:64px;bottom:64px;right:16px;overflow:hidden;box-shadow:0 12px 48px #0009}.slashed-cp__header{border-bottom:1px solid var(--rebemer-border);align-items:center;gap:10px;padding:10px 12px;display:flex}.slashed-cp__title{text-transform:uppercase;letter-spacing:.5px;color:#fff;flex:1;margin:0;font-size:11px;font-weight:700}.slashed-cp__close{color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;border:0;padding:2px 4px;font-size:18px;line-height:1}.slashed-cp__close:hover{color:#fff}.slashed-cp__seg{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);display:inline-flex;overflow:hidden}.slashed-cp__seg-btn{background:var(--rebemer-input-bg);border:0;border-left:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;text-transform:uppercase;letter-spacing:.4px;padding:5px 9px}.slashed-cp__seg-btn:first-child{border-left:0}.slashed-cp__seg-btn--on{background:var(--rebemer-accent);color:var(--rebemer-bg)}.slashed-cp__toolbar{border-bottom:1px solid var(--rebemer-border);flex-direction:column;gap:8px;padding:10px 12px;display:flex}.slashed-cp__search{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);width:100%;color:var(--rebemer-fg);font:inherit;box-sizing:border-box;padding:6px 8px}.slashed-cp__search:focus{outline:1px solid var(--rebemer-accent)}.slashed-cp__target{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.slashed-cp__target-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);font-size:9px}.slashed-cp__chip{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;border-radius:999px;padding:4px 10px}.slashed-cp__chip--on{background:var(--rebemer-accent);border-color:var(--rebemer-accent);color:var(--rebemer-bg)}.slashed-cp__body{flex:1;padding:6px 12px 12px;overflow-y:auto}.slashed-cp__empty{color:var(--rebemer-fg-muted);padding:12px 2px;font-size:11px}.slashed-cp__group{border-bottom:1px solid #ffffff0d;padding:10px 0 6px}.slashed-cp__group:last-child{border-bottom:0}.slashed-cp__group-head{margin:0 0 8px}.slashed-cp__group-title{color:#fff;text-transform:capitalize;align-items:baseline;gap:7px;margin:0;font-size:11px;font-weight:700;display:flex}.slashed-cp__group-tag{color:var(--rebemer-fg-muted);text-transform:none;font-size:10px;font-weight:500}.slashed-cp__group-count{font:600 9px/1 var(--rebemer-font);color:var(--rebemer-fg-muted);text-transform:none;background:#ffffff0f;border-radius:999px;margin-left:auto;padding:2px 6px}.slashed-cp__group-use{color:var(--rebemer-fg-muted);margin:2px 0 0;font-size:10px;line-height:1.4}.slashed-cp__section-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:8px 0 5px;font-size:9px}.slashed-cp__grid{grid-template-columns:repeat(auto-fill,minmax(38px,1fr));gap:7px 6px;display:grid}.slashed-cp__cell{flex-direction:column;align-items:center;gap:3px;min-width:0;display:flex}.slashed-cp__cap{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:9px;overflow:hidden}.slashed-cp__list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.slashed-cp__list-item{align-items:center;gap:8px;display:flex}.slashed-cp__list-name{color:var(--rebemer-fg);flex:none;font-size:11px}.slashed-cp__list-var{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;margin-left:auto;font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow:hidden}.slashed-cp-swatch{cursor:pointer;background:0 0;border:1px solid #7f7f7f73;border-radius:6px;flex:none;width:28px;height:28px;padding:0;position:relative;overflow:hidden}.slashed-cp-swatch:hover{border-color:var(--rebemer-accent)}.slashed-cp-swatch:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:1px}.slashed-cp-swatch__fill{background:var(--cp-solid);position:absolute;top:0;bottom:0;left:0;right:0}.slashed-cp-swatch--split .slashed-cp-swatch__fill{background:linear-gradient(135deg, var(--cp-l) 0 calc(50% - .5px), #00000059 calc(50% - .5px) calc(50% + .5px), var(--cp-d) calc(50% + .5px) 100%)}.slashed-cp-swatch--alpha{border-style:dashed}.slashed-cp__footer{border-top:1px solid var(--rebemer-border);color:var(--rebemer-fg-muted);align-items:center;gap:10px;padding:8px 12px;font-size:10px;display:flex}.slashed-cp__hint{margin-left:auto}.slashed-cp__hint code,.slashed-cp__footer code{color:var(--rebemer-accent);font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.slashed-cp__legend{align-items:center;gap:5px;display:inline-flex}.slashed-cp__legend-sw{background:linear-gradient(135deg,#fff 0 50%,#222 50% 100%);border:1px solid #7f7f7f73;border-radius:3px;width:12px;height:12px}.rebemer-toast--info{border-color:#63b3ed}.slashed-sf-color-btn{cursor:pointer;opacity:.65;border-radius:5px;flex-shrink:0;order:11;justify-content:center;align-items:center;width:28px;height:28px;margin-left:3px;transition:opacity .12s,background .12s;display:inline-flex}.slashed-sf-color-btn:hover{opacity:1;background:#5b8cff26}.slashed-sf-color-btn--active{opacity:1}.slashed-sf-color-btn--active:hover{background:0 0}.slashed-sf-color-btn__dot{background:conic-gradient(from 210deg,#5b8cff,#b07cff,#ff6b6b,#ffd24a,#4ade80,#5b8cff);border-radius:50%;flex-shrink:0;width:20px;height:20px;transition:width 80ms,height 80ms,border-radius .12s,box-shadow .12s;display:inline-block;box-shadow:inset 0 0 0 1px #fff3}.slashed-sf-color-btn--active .slashed-sf-color-btn__dot{border-radius:5px;width:28px;height:28px;transition:width 80ms,height 80ms,border-radius .12s;animation:2.4s ease-in-out infinite slashed-sf-active-glow}@keyframes slashed-sf-active-glow{0%,to{box-shadow:inset 0 0 0 1px #0003, 0 0 0 2px color-mix(in srgb, var(--sf-active-color,#fff) 60%, transparent), 0 0 7px color-mix(in srgb, var(--sf-active-color,#fff) 35%, transparent)}50%{box-shadow:inset 0 0 0 1px #0003, 0 0 0 2.5px color-mix(in srgb, var(--sf-active-color,#fff) 88%, transparent), 0 0 14px color-mix(in srgb, var(--sf-active-color,#fff) 50%, transparent)}}.slashed-sf-preview-label{color:#ff4040;pointer-events:none;text-shadow:0 0 3px #0009;justify-content:center;align-items:center;font:700 11px/1 system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.slashed-var-swatch{vertical-align:middle;background-color:#fff;background-image:linear-gradient(var(--slashed-swatch-color,transparent), var(--slashed-swatch-color,transparent)), linear-gradient(45deg, #7f7f7f59 25%, transparent 25%, transparent 75%, #7f7f7f59 75%), linear-gradient(45deg, #7f7f7f59 25%, transparent 25%, transparent 75%, #7f7f7f59 75%);background-position:0 0,0 0,4px 4px;background-size:auto,8px 8px,8px 8px;border:1px solid #7f7f7f73;border-radius:3px;flex:none;width:12px;height:12px;margin-right:7px;display:inline-block}.slashed-cp--docked{top:0;bottom:0;left:var(--cp-dock-left,320px);border-top-left-radius:0;border-bottom-left-radius:0;width:360px;right:auto;box-shadow:6px 0 32px #0000008c}.slashed-cp[data-mode=both] .slashed-cp__qu-sw,.slashed-cp[data-mode=both] .slashed-cp__scan-base,.slashed-cp[data-mode=both] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=both] .slashed-cp__fam-banner,.slashed-cp[data-mode=both] .slashed-cp__strip-sw{background:linear-gradient(135deg, var(--sw-l) 0 calc(50% - .5px), #00000059 calc(50% - .5px) calc(50% + .5px), var(--sw-d) calc(50% + .5px) 100%)}.slashed-cp[data-mode=light] .slashed-cp__qu-sw,.slashed-cp[data-mode=light] .slashed-cp__scan-base,.slashed-cp[data-mode=light] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=light] .slashed-cp__fam-banner,.slashed-cp[data-mode=light] .slashed-cp__strip-sw{background:var(--sw-l)}.slashed-cp[data-mode=dark] .slashed-cp__qu-sw,.slashed-cp[data-mode=dark] .slashed-cp__scan-base,.slashed-cp[data-mode=dark] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=dark] .slashed-cp__fam-banner,.slashed-cp[data-mode=dark] .slashed-cp__strip-sw{background:var(--sw-d)}.slashed-cp__sec{border-bottom:1px solid #ffffff0d;padding:10px 0 6px}.slashed-cp__sec:last-child{border-bottom:0}.slashed-cp__sec-title{text-transform:uppercase;letter-spacing:1px;color:var(--rebemer-fg-muted);margin:0 0 10px;font-size:9px;font-weight:700}.slashed-cp__sec--pal{padding-top:12px}.slashed-cp__qu-group{margin-bottom:10px}.slashed-cp__qu-group:last-child{margin-bottom:0}.slashed-cp__qu-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:0 0 4px;font-size:9px}.slashed-cp__qu-grid{grid-template-columns:1fr 1fr;gap:2px;display:grid}.slashed-cp__qu-cell{color:var(--rebemer-fg);font:11px/1.3 var(--rebemer-font);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:5px;align-items:center;gap:7px;min-width:0;padding:4px 6px;transition:background 80ms;display:flex}.slashed-cp__qu-cell:hover{background:#ffffff0f}.slashed-cp__qu-sw{border:1px solid #7f7f7f59;border-radius:5px;flex:0 0 22px;width:22px;height:22px;transition:border-color 80ms}.slashed-cp__qu-sw--alpha{border-style:dashed}.slashed-cp__qu-cell:hover .slashed-cp__qu-sw{border-color:var(--rebemer-accent)}.slashed-cp__qu-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.slashed-cp__pal-cat{text-transform:uppercase;letter-spacing:.8px;color:var(--rebemer-fg-muted);margin:10px 0 5px;font-size:9px;font-weight:700}.slashed-cp__pal-cat:first-of-type{margin-top:2px}.slashed-cp__scanner{border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);margin-bottom:4px;overflow:hidden}.slashed-cp__scan-item+.slashed-cp__scan-item{border-top:1px solid var(--rebemer-border)}.slashed-cp__scan-row{width:100%;color:var(--rebemer-fg);font:11px/1 var(--rebemer-font);cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:8px;padding:7px 10px;transition:background 80ms;display:flex}.slashed-cp__scan-row:hover,.slashed-cp__scan-row--open{background:#ffffff0a}.slashed-cp__scan-base{border:1px solid #7f7f7f4d;border-radius:4px;flex:0 0 18px;width:18px;height:18px}.slashed-cp__scan-name{flex:none;font-weight:600}.slashed-cp__scan-tagline{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:10px;overflow:hidden}.slashed-cp__scan-pre{flex:none;gap:3px;display:flex}.slashed-cp__scan-pre-sw{border:1px solid #7f7f7f33;border-radius:3px;width:14px;height:14px}.slashed-cp__scan-chev{color:var(--rebemer-fg-muted);flex:none;font-size:10px}.slashed-cp__fam{border-top:1px solid var(--rebemer-border);background:#0000001f;padding:10px 10px 12px}.slashed-cp__fam-banner{cursor:pointer;box-sizing:border-box;border:0;border-radius:7px;align-items:flex-end;width:100%;height:52px;margin-bottom:10px;padding:7px 10px;transition:opacity .12s;display:flex;overflow:hidden}.slashed-cp__fam-banner:hover{opacity:.85}.slashed-cp__fam-banner-lbl{font:700 9px/1 var(--rebemer-font);text-transform:uppercase;letter-spacing:2px;color:#ffffffe6;text-shadow:0 1px 3px #0009}.slashed-cp__fam-sec{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:8px 0 6px;font-size:9px}.slashed-cp__fam-sec:first-child{margin-top:0}.slashed-cp__fam-sec-range{text-transform:none;letter-spacing:0;color:#ffffff40;font-weight:400}.slashed-cp__strip{border-radius:5px;height:24px;display:flex;overflow:hidden}.slashed-cp__strip--alpha{opacity:.8;margin-top:4px}.slashed-cp__strip-sw{cursor:pointer;border:0;flex:1;min-width:0;padding:0;transition:flex .1s ease-out;position:relative}.slashed-cp__strip-sw:hover{box-shadow:inset 0 0 0 2px var(--rebemer-accent);flex:2}.slashed-cp__strip-sw--alpha{box-shadow:inset 0 0 0 1px #7f7f7f66}.slashed-cp__strip-sw--alpha:hover{box-shadow:inset 0 0 0 2px var(--rebemer-accent)}.slashed-cp__strip-sw:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px;z-index:1}.slashed-cp__alpha-btn{color:var(--rebemer-fg-muted);font:10px/1 var(--rebemer-font);cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;margin-top:8px;padding:0;display:flex}.slashed-cp__alpha-btn:hover{color:var(--rebemer-fg)}.slashed-cp__alpha-btn:focus-visible{outline:1px dotted var(--rebemer-accent);outline-offset:2px;color:var(--rebemer-fg)}.slashed-cp__qu-cell:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-cp__scan-row:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-cp__fam-banner:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-var-hint{z-index:100003;white-space:normal;overflow-wrap:break-word;background:var(--rebemer-bg,#161a1d);width:max-content;max-width:320px;color:var(--rebemer-fg,#e1e1e1);border:1px solid var(--rebemer-border,#3d4752);border-radius:var(--rebemer-radius,4px);font:12px/1.45 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);pointer-events:none;padding:6px 10px;position:fixed;box-shadow:0 6px 20px #00000080}.slashed-var-hint[hidden]{display:none}.slashed-var-hint__name{color:var(--rebemer-accent,#e2b93b);font:600 11px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.slashed-var-hint__cat{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted,#8a8d95);margin-left:6px;font-size:9px}.slashed-var-hint__cat[hidden]{display:none}.slashed-var-hint__desc{color:var(--rebemer-fg,#e1e1e1);margin:5px 0 0;padding:0;font-size:11px;line-height:1.5}.slashed-var-hint__desc[hidden]{display:none}.slashed-var-hint-btn{border:1px solid var(--rebemer-border,#3d4752);width:14px;min-width:14px;height:14px;min-height:14px;max-height:14px;color:var(--rebemer-fg-muted,#8a8d95);font:700 9px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);cursor:help;opacity:.6;vertical-align:middle;box-sizing:content-box;background:0 0;border-radius:50%;flex:none;justify-content:center;align-self:center;align-items:center;margin-left:6px;line-height:1;transition:opacity .12s,color .12s,border-color .12s;display:inline-flex}.slashed-var-hint-btn:before{content:"?"}.slashed-var-hint-btn:hover{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.slashed-var-hint-btn:focus-visible{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none} /*$vite$:1*/ \ No newline at end of file diff --git a/SLASHED-for-WP/integrations/bricks/editor-app/src/styles/panel.css b/SLASHED-for-WP/integrations/bricks/editor-app/src/styles/panel.css index 5f1be093..73f658fa 100644 --- a/SLASHED-for-WP/integrations/bricks/editor-app/src/styles/panel.css +++ b/SLASHED-for-WP/integrations/bricks/editor-app/src/styles/panel.css @@ -802,9 +802,6 @@ li[data-id]:focus-within > .rebemer-badge-host { (it would show a static hex snapshot of an adaptive light-dark() token) and overlay a red ✕ so users instantly know the swatch cannot represent the adaptive value accurately. */ -.bricks-control-preview:has(.slashed-sf-preview-label) { - position: relative; -} .slashed-sf-preview-label { position: absolute; inset: 0; From 472b0b1723a187b1463f70101b292a847bc8ac31 Mon Sep 17 00:00:00 2001 From: Jack Granatowski Date: Tue, 7 Jul 2026 10:25:01 +0200 Subject: [PATCH 2/6] fix: avoid positioning Bricks SF preview label --- .../bricks/assets/editor-app/app.css | 2 +- .../bricks/editor-app/src/styles/panel.css | 16 +++++++++------- 2 files changed, 10 insertions(+), 8 deletions(-) diff --git a/SLASHED-for-WP/integrations/bricks/assets/editor-app/app.css b/SLASHED-for-WP/integrations/bricks/assets/editor-app/app.css index d242d650..abadbf2f 100644 --- a/SLASHED-for-WP/integrations/bricks/assets/editor-app/app.css +++ b/SLASHED-for-WP/integrations/bricks/assets/editor-app/app.css @@ -1,2 +1,2 @@ -#slashed-rebemer-host{--rebemer-bg:#161a1d;--rebemer-fg:#e1e1e1;--rebemer-fg-muted:#8a8d95;--rebemer-border:#3d4752;--rebemer-accent:#e2b93b;--rebemer-accent-hover:#ffd042;--rebemer-input-bg:#293038;--rebemer-input-border:#3d4752;--rebemer-error:#ff4c4c;--rebemer-success:#4ade80;--rebemer-radius:4px;--rebemer-font:"Inter", -apple-system, blinkmacsystemfont, sans-serif}.rebemer-badge-host{opacity:0;pointer-events:none;flex:none;align-self:center;align-items:center;margin:0 4px;transition:opacity 80ms linear;display:inline-flex}.structure-item:hover .rebemer-badge-host,.structure-item:focus-within .rebemer-badge-host,li[data-id]:hover>.rebemer-badge-host,li[data-id]:focus-within>.rebemer-badge-host{opacity:1;pointer-events:auto}.rebemer-badge{font:600 9px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);letter-spacing:0;text-transform:none;color:var(--rebemer-fg-muted,#8a8d95);cursor:pointer;pointer-events:auto;background:0 0;border-radius:2px;margin:0;padding:1px 3px;display:inline}.rebemer-badge:hover{color:var(--rebemer-accent,#e2b93b);background:#e2b93b14}.rebemer-badge:focus-visible{outline:1px dotted var(--rebemer-accent,#e2b93b);outline-offset:1px;color:var(--rebemer-accent,#e2b93b)}.rebemer-panel{z-index:100000;background:var(--rebemer-bg);width:440px;max-width:calc(100vw - 40px);max-height:80vh;color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);outline:none;flex-direction:column;display:flex;position:fixed;top:80px;left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 10px 40px #0009}.rebemer-panel__header{border-bottom:1px solid var(--rebemer-border);justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.rebemer-panel__title{text-transform:uppercase;letter-spacing:.5px;color:#fff;margin:0;font-size:11px;font-weight:700}.rebemer-panel__subject{color:var(--rebemer-accent);text-transform:none;font-weight:500}.rebemer-panel__close{color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;border:0;padding:2px 6px;font-size:18px}.rebemer-panel__close:hover{color:#fff}.rebemer-panel__toolbar{border-bottom:1px solid var(--rebemer-border);flex-wrap:wrap;align-items:center;gap:12px;padding:10px 14px;display:flex}.rebemer-field{flex-direction:column;gap:4px;font-size:11px;display:flex}.rebemer-field--inline{flex-direction:row;align-items:center;gap:6px}.rebemer-field__label{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px}.rebemer-field select,.rebemer-field input[type=text]{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;padding:4px 6px}.rebemer-field select:focus,.rebemer-field input:focus{outline:1px solid var(--rebemer-accent)}.rebemer-panel__mode-hint{color:var(--rebemer-fg-muted);background:var(--rebemer-bg);border-bottom:1px solid var(--rebemer-border);margin:0;padding:5px 14px;font-size:11px;line-height:1.4}.rebemer-panel__notice{border-bottom:1px solid var(--rebemer-border);color:var(--rebemer-fg);background:#e2b93b14;margin:0;padding:8px 14px;font-size:11px;line-height:1.5}.rebemer-panel__notice--warn{background:#e2b93b29}.rebemer-panel__notice strong{color:var(--rebemer-accent);font-weight:600}.rebemer-panel__notice-skip{color:var(--rebemer-fg-muted);margin-top:2px;display:block}.rebemer-panel__body{flex-direction:column;flex:1;gap:6px;padding:8px 14px;display:flex;overflow-y:auto}.rebemer-row{border-radius:var(--rebemer-radius);margin-left:calc(var(--rebemer-row-depth,0) * 12px);background:#ffffff05;grid-template-columns:auto 1fr;align-items:center;gap:8px;padding:6px 8px;display:grid}.rebemer-row:hover{background:#ffffff0a}.rebemer-row--disabled{opacity:.45}.rebemer-row__include input{cursor:pointer}.rebemer-row__meta{align-items:baseline;gap:6px;min-width:0;display:flex}.rebemer-row__label{white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.rebemer-row__type{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.3px;font-size:9px}.rebemer-row__type--toggle{cursor:pointer;background:0 0;border:0;border-radius:2px;padding:1px 3px;line-height:1}.rebemer-row__type--toggle:hover:not(:disabled){color:var(--rebemer-fg);background:#ffffff0f}.rebemer-row__type--toggle:disabled{cursor:default;opacity:.5}.rebemer-row__type--block{color:var(--rebemer-accent);background:#e2b93b1f}.rebemer-row__type--block:hover:not(:disabled){background:#e2b93b33}.rebemer-row__hint{color:var(--rebemer-accent);text-transform:uppercase;letter-spacing:.5px;background:#e2b93b1f;border-radius:2px;padding:1px 4px;font-size:9px}.rebemer-row__inputs{grid-column:1/-1;align-items:center;gap:6px;display:flex}.rebemer-row__name{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);flex:1;align-items:stretch;display:flex;overflow:hidden}.rebemer-row__prefix{color:var(--rebemer-fg-muted);border-right:1px solid var(--rebemer-input-border);white-space:nowrap;background:#00000040;padding:4px 6px;font-size:11px}.rebemer-row__name input{color:var(--rebemer-fg);font:inherit;background:0 0;border:0;outline:0;flex:1;min-width:0;padding:4px 6px}.rebemer-row--suggested .rebemer-row__name input:not(:focus){color:var(--rebemer-fg-muted);font-style:italic}.rebemer-row__modifier{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;width:90px;padding:4px 6px}.rebemer-row__modifiers{flex-direction:column;flex:1;gap:4px;display:flex}.rebemer-row__modifier-row{align-items:center;gap:4px;display:flex}.rebemer-row__modifier-row .rebemer-row__modifier{flex:1;width:auto}.rebemer-row__modifier-remove{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;flex:none;padding:2px 6px;font-size:13px;line-height:1}.rebemer-row__modifier-remove:hover:not(:disabled){border-color:var(--rebemer-error);color:var(--rebemer-error)}.rebemer-row__modifier-add{border:1px dashed var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg-muted);font:inherit;cursor:pointer;text-align:left;background:0 0;width:-moz-fit-content;width:fit-content;padding:3px 7px;font-size:10px}.rebemer-row__modifier-add:hover:not(:disabled){border-color:var(--rebemer-fg-muted);color:var(--rebemer-fg)}.rebemer-row__op-toggle{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);grid-column:1/-1;align-items:center;width:-moz-fit-content;width:fit-content;margin-top:2px;display:inline-flex;overflow:hidden}.rebemer-row__op-btn{background:var(--rebemer-input-bg);border:0;border-left:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap;padding:4px 9px}.rebemer-row__op-btn:first-child{border-left:0}.rebemer-row__op-btn--on{color:var(--rebemer-accent);background:#e2b93b1f}.rebemer-row__op-btn:hover:not(.rebemer-row__op-btn--on){color:var(--rebemer-fg);background:#ffffff0f}.rebemer-row__family{grid-column:1/-1;align-items:center;gap:7px;margin-top:3px;display:flex}.rebemer-row__family-label{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;flex:none;font-size:9px}.rebemer-row__family-select{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;flex:1;min-width:0;padding:3px 6px;font-size:11px}.rebemer-row__family-select:focus{outline:1px solid var(--rebemer-accent)}.rebemer-row__info code,.rebemer-row__warn code{color:var(--rebemer-accent);background:#0000004d;border-radius:2px;padding:1px 4px;font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-row__recommend{border-left:2px solid var(--rebemer-success);color:var(--rebemer-fg);background:#4ade8014;border-radius:2px;grid-column:1/-1;margin:0;padding:6px 8px;font-size:11px;line-height:1.4}.rebemer-row__recommend code{color:var(--rebemer-accent);background:#0000004d;border-radius:2px;padding:1px 4px;font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-row__warn,.rebemer-row__info{border-radius:2px;grid-column:1/-1;margin:0;padding:5px 8px;font-size:11px;line-height:1.4}.rebemer-row__warn{color:var(--rebemer-fg);background:#e2b93b1f;border-left:2px solid #e2b93b}.rebemer-row__info{color:var(--rebemer-fg-muted);background:#63b3ed1a;border-left:2px solid #63b3ed}.rebemer-row__chips{flex-wrap:wrap;grid-column:1/-1;align-items:center;gap:4px;padding:4px 0 0;font-size:10px;display:flex}.rebemer-row__chips-label,.rebemer-row__chips-empty,.rebemer-row__chips-skip{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;font-size:9px}.rebemer-row__chips-skip{cursor:help;color:#c8a038;margin-left:auto}.rebemer-chip{border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg);white-space:nowrap;background:#0000004d;border-radius:2px;padding:2px 5px;font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-panel__footer{border-top:1px solid var(--rebemer-border);justify-content:flex-end;gap:8px;padding:10px 14px;display:flex}.rebemer-btn{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg);border-radius:var(--rebemer-radius);font:inherit;cursor:pointer;padding:6px 12px}.rebemer-btn:hover{border-color:var(--rebemer-fg-muted)}.rebemer-btn--primary{background:var(--rebemer-accent);border-color:var(--rebemer-accent);color:var(--rebemer-bg);font-weight:600}.rebemer-btn--primary:hover{background:var(--rebemer-accent-hover);border-color:var(--rebemer-accent-hover)}.rebemer-toast{z-index:100002;background:var(--rebemer-input-bg);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);cursor:pointer;padding:8px 12px;position:fixed;bottom:16px;right:16px;box-shadow:0 4px 12px #0006}.rebemer-toast--success{border-color:var(--rebemer-success)}.rebemer-toast--error{border-color:var(--rebemer-error);color:var(--rebemer-error)}.rebemer-class-hint{z-index:100003;background:var(--rebemer-bg);max-width:280px;color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);pointer-events:none;padding:8px 10px;position:fixed;box-shadow:0 6px 20px #00000080}.rebemer-class-hint[hidden]{display:none}.rebemer-class-hint__name{color:var(--rebemer-accent);font:600 11px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-class-hint__cat{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin-left:6px;font-size:9px}.rebemer-class-hint__cat[hidden]{display:none}.rebemer-class-hint__desc{color:var(--rebemer-fg);margin:4px 0 0}.rebemer-class-hint-btn{border:1px solid var(--rebemer-border,#3d4752);width:16px;height:16px;color:var(--rebemer-fg-muted,#8a8d95);font:700 10px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);cursor:help;opacity:.7;vertical-align:middle;background:0 0;border-radius:50%;flex:none;justify-content:center;align-items:center;margin-inline-start:4px;transition:opacity .12s,color .12s,border-color .12s;display:inline-flex}.rebemer-class-hint-btn:before{content:"?"}.rebemer-class-hint-btn:hover{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.rebemer-class-hint-btn:focus-visible{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.slashed-cp-launch{z-index:99999;background:var(--rebemer-bg);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);font:600 11px/1 var(--rebemer-font);letter-spacing:.3px;cursor:pointer;border-radius:999px;align-items:center;gap:7px;padding:7px 12px;transition:border-color .12s,color .12s,transform .12s;display:inline-flex;position:fixed;bottom:16px;right:16px;box-shadow:0 4px 16px #00000073}.slashed-cp-launch:hover{border-color:var(--rebemer-fg-muted);transform:translateY(-1px)}.slashed-cp-launch--on{border-color:var(--rebemer-accent);color:#fff}.slashed-cp-launch__dot{background:conic-gradient(from 210deg,#5b8cff,#b07cff,#ff6b6b,#ffd24a,#4ade80,#5b8cff);border-radius:50%;width:12px;height:12px;box-shadow:inset 0 0 0 1px #ffffff40}.slashed-cp-launch__txt{text-transform:uppercase}.slashed-cp{z-index:100001;background:var(--rebemer-bg);width:372px;max-width:calc(100vw - 32px);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);outline:none;flex-direction:column;display:flex;position:fixed;top:64px;bottom:64px;right:16px;overflow:hidden;box-shadow:0 12px 48px #0009}.slashed-cp__header{border-bottom:1px solid var(--rebemer-border);align-items:center;gap:10px;padding:10px 12px;display:flex}.slashed-cp__title{text-transform:uppercase;letter-spacing:.5px;color:#fff;flex:1;margin:0;font-size:11px;font-weight:700}.slashed-cp__close{color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;border:0;padding:2px 4px;font-size:18px;line-height:1}.slashed-cp__close:hover{color:#fff}.slashed-cp__seg{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);display:inline-flex;overflow:hidden}.slashed-cp__seg-btn{background:var(--rebemer-input-bg);border:0;border-left:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;text-transform:uppercase;letter-spacing:.4px;padding:5px 9px}.slashed-cp__seg-btn:first-child{border-left:0}.slashed-cp__seg-btn--on{background:var(--rebemer-accent);color:var(--rebemer-bg)}.slashed-cp__toolbar{border-bottom:1px solid var(--rebemer-border);flex-direction:column;gap:8px;padding:10px 12px;display:flex}.slashed-cp__search{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);width:100%;color:var(--rebemer-fg);font:inherit;box-sizing:border-box;padding:6px 8px}.slashed-cp__search:focus{outline:1px solid var(--rebemer-accent)}.slashed-cp__target{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.slashed-cp__target-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);font-size:9px}.slashed-cp__chip{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;border-radius:999px;padding:4px 10px}.slashed-cp__chip--on{background:var(--rebemer-accent);border-color:var(--rebemer-accent);color:var(--rebemer-bg)}.slashed-cp__body{flex:1;padding:6px 12px 12px;overflow-y:auto}.slashed-cp__empty{color:var(--rebemer-fg-muted);padding:12px 2px;font-size:11px}.slashed-cp__group{border-bottom:1px solid #ffffff0d;padding:10px 0 6px}.slashed-cp__group:last-child{border-bottom:0}.slashed-cp__group-head{margin:0 0 8px}.slashed-cp__group-title{color:#fff;text-transform:capitalize;align-items:baseline;gap:7px;margin:0;font-size:11px;font-weight:700;display:flex}.slashed-cp__group-tag{color:var(--rebemer-fg-muted);text-transform:none;font-size:10px;font-weight:500}.slashed-cp__group-count{font:600 9px/1 var(--rebemer-font);color:var(--rebemer-fg-muted);text-transform:none;background:#ffffff0f;border-radius:999px;margin-left:auto;padding:2px 6px}.slashed-cp__group-use{color:var(--rebemer-fg-muted);margin:2px 0 0;font-size:10px;line-height:1.4}.slashed-cp__section-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:8px 0 5px;font-size:9px}.slashed-cp__grid{grid-template-columns:repeat(auto-fill,minmax(38px,1fr));gap:7px 6px;display:grid}.slashed-cp__cell{flex-direction:column;align-items:center;gap:3px;min-width:0;display:flex}.slashed-cp__cap{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:9px;overflow:hidden}.slashed-cp__list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.slashed-cp__list-item{align-items:center;gap:8px;display:flex}.slashed-cp__list-name{color:var(--rebemer-fg);flex:none;font-size:11px}.slashed-cp__list-var{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;margin-left:auto;font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow:hidden}.slashed-cp-swatch{cursor:pointer;background:0 0;border:1px solid #7f7f7f73;border-radius:6px;flex:none;width:28px;height:28px;padding:0;position:relative;overflow:hidden}.slashed-cp-swatch:hover{border-color:var(--rebemer-accent)}.slashed-cp-swatch:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:1px}.slashed-cp-swatch__fill{background:var(--cp-solid);position:absolute;top:0;bottom:0;left:0;right:0}.slashed-cp-swatch--split .slashed-cp-swatch__fill{background:linear-gradient(135deg, var(--cp-l) 0 calc(50% - .5px), #00000059 calc(50% - .5px) calc(50% + .5px), var(--cp-d) calc(50% + .5px) 100%)}.slashed-cp-swatch--alpha{border-style:dashed}.slashed-cp__footer{border-top:1px solid var(--rebemer-border);color:var(--rebemer-fg-muted);align-items:center;gap:10px;padding:8px 12px;font-size:10px;display:flex}.slashed-cp__hint{margin-left:auto}.slashed-cp__hint code,.slashed-cp__footer code{color:var(--rebemer-accent);font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.slashed-cp__legend{align-items:center;gap:5px;display:inline-flex}.slashed-cp__legend-sw{background:linear-gradient(135deg,#fff 0 50%,#222 50% 100%);border:1px solid #7f7f7f73;border-radius:3px;width:12px;height:12px}.rebemer-toast--info{border-color:#63b3ed}.slashed-sf-color-btn{cursor:pointer;opacity:.65;border-radius:5px;flex-shrink:0;order:11;justify-content:center;align-items:center;width:28px;height:28px;margin-left:3px;transition:opacity .12s,background .12s;display:inline-flex}.slashed-sf-color-btn:hover{opacity:1;background:#5b8cff26}.slashed-sf-color-btn--active{opacity:1}.slashed-sf-color-btn--active:hover{background:0 0}.slashed-sf-color-btn__dot{background:conic-gradient(from 210deg,#5b8cff,#b07cff,#ff6b6b,#ffd24a,#4ade80,#5b8cff);border-radius:50%;flex-shrink:0;width:20px;height:20px;transition:width 80ms,height 80ms,border-radius .12s,box-shadow .12s;display:inline-block;box-shadow:inset 0 0 0 1px #fff3}.slashed-sf-color-btn--active .slashed-sf-color-btn__dot{border-radius:5px;width:28px;height:28px;transition:width 80ms,height 80ms,border-radius .12s;animation:2.4s ease-in-out infinite slashed-sf-active-glow}@keyframes slashed-sf-active-glow{0%,to{box-shadow:inset 0 0 0 1px #0003, 0 0 0 2px color-mix(in srgb, var(--sf-active-color,#fff) 60%, transparent), 0 0 7px color-mix(in srgb, var(--sf-active-color,#fff) 35%, transparent)}50%{box-shadow:inset 0 0 0 1px #0003, 0 0 0 2.5px color-mix(in srgb, var(--sf-active-color,#fff) 88%, transparent), 0 0 14px color-mix(in srgb, var(--sf-active-color,#fff) 50%, transparent)}}.slashed-sf-preview-label{color:#ff4040;pointer-events:none;text-shadow:0 0 3px #0009;justify-content:center;align-items:center;font:700 11px/1 system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.slashed-var-swatch{vertical-align:middle;background-color:#fff;background-image:linear-gradient(var(--slashed-swatch-color,transparent), var(--slashed-swatch-color,transparent)), linear-gradient(45deg, #7f7f7f59 25%, transparent 25%, transparent 75%, #7f7f7f59 75%), linear-gradient(45deg, #7f7f7f59 25%, transparent 25%, transparent 75%, #7f7f7f59 75%);background-position:0 0,0 0,4px 4px;background-size:auto,8px 8px,8px 8px;border:1px solid #7f7f7f73;border-radius:3px;flex:none;width:12px;height:12px;margin-right:7px;display:inline-block}.slashed-cp--docked{top:0;bottom:0;left:var(--cp-dock-left,320px);border-top-left-radius:0;border-bottom-left-radius:0;width:360px;right:auto;box-shadow:6px 0 32px #0000008c}.slashed-cp[data-mode=both] .slashed-cp__qu-sw,.slashed-cp[data-mode=both] .slashed-cp__scan-base,.slashed-cp[data-mode=both] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=both] .slashed-cp__fam-banner,.slashed-cp[data-mode=both] .slashed-cp__strip-sw{background:linear-gradient(135deg, var(--sw-l) 0 calc(50% - .5px), #00000059 calc(50% - .5px) calc(50% + .5px), var(--sw-d) calc(50% + .5px) 100%)}.slashed-cp[data-mode=light] .slashed-cp__qu-sw,.slashed-cp[data-mode=light] .slashed-cp__scan-base,.slashed-cp[data-mode=light] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=light] .slashed-cp__fam-banner,.slashed-cp[data-mode=light] .slashed-cp__strip-sw{background:var(--sw-l)}.slashed-cp[data-mode=dark] .slashed-cp__qu-sw,.slashed-cp[data-mode=dark] .slashed-cp__scan-base,.slashed-cp[data-mode=dark] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=dark] .slashed-cp__fam-banner,.slashed-cp[data-mode=dark] .slashed-cp__strip-sw{background:var(--sw-d)}.slashed-cp__sec{border-bottom:1px solid #ffffff0d;padding:10px 0 6px}.slashed-cp__sec:last-child{border-bottom:0}.slashed-cp__sec-title{text-transform:uppercase;letter-spacing:1px;color:var(--rebemer-fg-muted);margin:0 0 10px;font-size:9px;font-weight:700}.slashed-cp__sec--pal{padding-top:12px}.slashed-cp__qu-group{margin-bottom:10px}.slashed-cp__qu-group:last-child{margin-bottom:0}.slashed-cp__qu-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:0 0 4px;font-size:9px}.slashed-cp__qu-grid{grid-template-columns:1fr 1fr;gap:2px;display:grid}.slashed-cp__qu-cell{color:var(--rebemer-fg);font:11px/1.3 var(--rebemer-font);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:5px;align-items:center;gap:7px;min-width:0;padding:4px 6px;transition:background 80ms;display:flex}.slashed-cp__qu-cell:hover{background:#ffffff0f}.slashed-cp__qu-sw{border:1px solid #7f7f7f59;border-radius:5px;flex:0 0 22px;width:22px;height:22px;transition:border-color 80ms}.slashed-cp__qu-sw--alpha{border-style:dashed}.slashed-cp__qu-cell:hover .slashed-cp__qu-sw{border-color:var(--rebemer-accent)}.slashed-cp__qu-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.slashed-cp__pal-cat{text-transform:uppercase;letter-spacing:.8px;color:var(--rebemer-fg-muted);margin:10px 0 5px;font-size:9px;font-weight:700}.slashed-cp__pal-cat:first-of-type{margin-top:2px}.slashed-cp__scanner{border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);margin-bottom:4px;overflow:hidden}.slashed-cp__scan-item+.slashed-cp__scan-item{border-top:1px solid var(--rebemer-border)}.slashed-cp__scan-row{width:100%;color:var(--rebemer-fg);font:11px/1 var(--rebemer-font);cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:8px;padding:7px 10px;transition:background 80ms;display:flex}.slashed-cp__scan-row:hover,.slashed-cp__scan-row--open{background:#ffffff0a}.slashed-cp__scan-base{border:1px solid #7f7f7f4d;border-radius:4px;flex:0 0 18px;width:18px;height:18px}.slashed-cp__scan-name{flex:none;font-weight:600}.slashed-cp__scan-tagline{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:10px;overflow:hidden}.slashed-cp__scan-pre{flex:none;gap:3px;display:flex}.slashed-cp__scan-pre-sw{border:1px solid #7f7f7f33;border-radius:3px;width:14px;height:14px}.slashed-cp__scan-chev{color:var(--rebemer-fg-muted);flex:none;font-size:10px}.slashed-cp__fam{border-top:1px solid var(--rebemer-border);background:#0000001f;padding:10px 10px 12px}.slashed-cp__fam-banner{cursor:pointer;box-sizing:border-box;border:0;border-radius:7px;align-items:flex-end;width:100%;height:52px;margin-bottom:10px;padding:7px 10px;transition:opacity .12s;display:flex;overflow:hidden}.slashed-cp__fam-banner:hover{opacity:.85}.slashed-cp__fam-banner-lbl{font:700 9px/1 var(--rebemer-font);text-transform:uppercase;letter-spacing:2px;color:#ffffffe6;text-shadow:0 1px 3px #0009}.slashed-cp__fam-sec{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:8px 0 6px;font-size:9px}.slashed-cp__fam-sec:first-child{margin-top:0}.slashed-cp__fam-sec-range{text-transform:none;letter-spacing:0;color:#ffffff40;font-weight:400}.slashed-cp__strip{border-radius:5px;height:24px;display:flex;overflow:hidden}.slashed-cp__strip--alpha{opacity:.8;margin-top:4px}.slashed-cp__strip-sw{cursor:pointer;border:0;flex:1;min-width:0;padding:0;transition:flex .1s ease-out;position:relative}.slashed-cp__strip-sw:hover{box-shadow:inset 0 0 0 2px var(--rebemer-accent);flex:2}.slashed-cp__strip-sw--alpha{box-shadow:inset 0 0 0 1px #7f7f7f66}.slashed-cp__strip-sw--alpha:hover{box-shadow:inset 0 0 0 2px var(--rebemer-accent)}.slashed-cp__strip-sw:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px;z-index:1}.slashed-cp__alpha-btn{color:var(--rebemer-fg-muted);font:10px/1 var(--rebemer-font);cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;margin-top:8px;padding:0;display:flex}.slashed-cp__alpha-btn:hover{color:var(--rebemer-fg)}.slashed-cp__alpha-btn:focus-visible{outline:1px dotted var(--rebemer-accent);outline-offset:2px;color:var(--rebemer-fg)}.slashed-cp__qu-cell:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-cp__scan-row:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-cp__fam-banner:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-var-hint{z-index:100003;white-space:normal;overflow-wrap:break-word;background:var(--rebemer-bg,#161a1d);width:max-content;max-width:320px;color:var(--rebemer-fg,#e1e1e1);border:1px solid var(--rebemer-border,#3d4752);border-radius:var(--rebemer-radius,4px);font:12px/1.45 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);pointer-events:none;padding:6px 10px;position:fixed;box-shadow:0 6px 20px #00000080}.slashed-var-hint[hidden]{display:none}.slashed-var-hint__name{color:var(--rebemer-accent,#e2b93b);font:600 11px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.slashed-var-hint__cat{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted,#8a8d95);margin-left:6px;font-size:9px}.slashed-var-hint__cat[hidden]{display:none}.slashed-var-hint__desc{color:var(--rebemer-fg,#e1e1e1);margin:5px 0 0;padding:0;font-size:11px;line-height:1.5}.slashed-var-hint__desc[hidden]{display:none}.slashed-var-hint-btn{border:1px solid var(--rebemer-border,#3d4752);width:14px;min-width:14px;height:14px;min-height:14px;max-height:14px;color:var(--rebemer-fg-muted,#8a8d95);font:700 9px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);cursor:help;opacity:.6;vertical-align:middle;box-sizing:content-box;background:0 0;border-radius:50%;flex:none;justify-content:center;align-self:center;align-items:center;margin-left:6px;line-height:1;transition:opacity .12s,color .12s,border-color .12s;display:inline-flex}.slashed-var-hint-btn:before{content:"?"}.slashed-var-hint-btn:hover{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.slashed-var-hint-btn:focus-visible{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none} +#slashed-rebemer-host{--rebemer-bg:#161a1d;--rebemer-fg:#e1e1e1;--rebemer-fg-muted:#8a8d95;--rebemer-border:#3d4752;--rebemer-accent:#e2b93b;--rebemer-accent-hover:#ffd042;--rebemer-input-bg:#293038;--rebemer-input-border:#3d4752;--rebemer-error:#ff4c4c;--rebemer-success:#4ade80;--rebemer-radius:4px;--rebemer-font:"Inter", -apple-system, blinkmacsystemfont, sans-serif}.rebemer-badge-host{opacity:0;pointer-events:none;flex:none;align-self:center;align-items:center;margin:0 4px;transition:opacity 80ms linear;display:inline-flex}.structure-item:hover .rebemer-badge-host,.structure-item:focus-within .rebemer-badge-host,li[data-id]:hover>.rebemer-badge-host,li[data-id]:focus-within>.rebemer-badge-host{opacity:1;pointer-events:auto}.rebemer-badge{font:600 9px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);letter-spacing:0;text-transform:none;color:var(--rebemer-fg-muted,#8a8d95);cursor:pointer;pointer-events:auto;background:0 0;border-radius:2px;margin:0;padding:1px 3px;display:inline}.rebemer-badge:hover{color:var(--rebemer-accent,#e2b93b);background:#e2b93b14}.rebemer-badge:focus-visible{outline:1px dotted var(--rebemer-accent,#e2b93b);outline-offset:1px;color:var(--rebemer-accent,#e2b93b)}.rebemer-panel{z-index:100000;background:var(--rebemer-bg);width:440px;max-width:calc(100vw - 40px);max-height:80vh;color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);outline:none;flex-direction:column;display:flex;position:fixed;top:80px;left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 10px 40px #0009}.rebemer-panel__header{border-bottom:1px solid var(--rebemer-border);justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.rebemer-panel__title{text-transform:uppercase;letter-spacing:.5px;color:#fff;margin:0;font-size:11px;font-weight:700}.rebemer-panel__subject{color:var(--rebemer-accent);text-transform:none;font-weight:500}.rebemer-panel__close{color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;border:0;padding:2px 6px;font-size:18px}.rebemer-panel__close:hover{color:#fff}.rebemer-panel__toolbar{border-bottom:1px solid var(--rebemer-border);flex-wrap:wrap;align-items:center;gap:12px;padding:10px 14px;display:flex}.rebemer-field{flex-direction:column;gap:4px;font-size:11px;display:flex}.rebemer-field--inline{flex-direction:row;align-items:center;gap:6px}.rebemer-field__label{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px}.rebemer-field select,.rebemer-field input[type=text]{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;padding:4px 6px}.rebemer-field select:focus,.rebemer-field input:focus{outline:1px solid var(--rebemer-accent)}.rebemer-panel__mode-hint{color:var(--rebemer-fg-muted);background:var(--rebemer-bg);border-bottom:1px solid var(--rebemer-border);margin:0;padding:5px 14px;font-size:11px;line-height:1.4}.rebemer-panel__notice{border-bottom:1px solid var(--rebemer-border);color:var(--rebemer-fg);background:#e2b93b14;margin:0;padding:8px 14px;font-size:11px;line-height:1.5}.rebemer-panel__notice--warn{background:#e2b93b29}.rebemer-panel__notice strong{color:var(--rebemer-accent);font-weight:600}.rebemer-panel__notice-skip{color:var(--rebemer-fg-muted);margin-top:2px;display:block}.rebemer-panel__body{flex-direction:column;flex:1;gap:6px;padding:8px 14px;display:flex;overflow-y:auto}.rebemer-row{border-radius:var(--rebemer-radius);margin-left:calc(var(--rebemer-row-depth,0) * 12px);background:#ffffff05;grid-template-columns:auto 1fr;align-items:center;gap:8px;padding:6px 8px;display:grid}.rebemer-row:hover{background:#ffffff0a}.rebemer-row--disabled{opacity:.45}.rebemer-row__include input{cursor:pointer}.rebemer-row__meta{align-items:baseline;gap:6px;min-width:0;display:flex}.rebemer-row__label{white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.rebemer-row__type{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.3px;font-size:9px}.rebemer-row__type--toggle{cursor:pointer;background:0 0;border:0;border-radius:2px;padding:1px 3px;line-height:1}.rebemer-row__type--toggle:hover:not(:disabled){color:var(--rebemer-fg);background:#ffffff0f}.rebemer-row__type--toggle:disabled{cursor:default;opacity:.5}.rebemer-row__type--block{color:var(--rebemer-accent);background:#e2b93b1f}.rebemer-row__type--block:hover:not(:disabled){background:#e2b93b33}.rebemer-row__hint{color:var(--rebemer-accent);text-transform:uppercase;letter-spacing:.5px;background:#e2b93b1f;border-radius:2px;padding:1px 4px;font-size:9px}.rebemer-row__inputs{grid-column:1/-1;align-items:center;gap:6px;display:flex}.rebemer-row__name{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);flex:1;align-items:stretch;display:flex;overflow:hidden}.rebemer-row__prefix{color:var(--rebemer-fg-muted);border-right:1px solid var(--rebemer-input-border);white-space:nowrap;background:#00000040;padding:4px 6px;font-size:11px}.rebemer-row__name input{color:var(--rebemer-fg);font:inherit;background:0 0;border:0;outline:0;flex:1;min-width:0;padding:4px 6px}.rebemer-row--suggested .rebemer-row__name input:not(:focus){color:var(--rebemer-fg-muted);font-style:italic}.rebemer-row__modifier{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;width:90px;padding:4px 6px}.rebemer-row__modifiers{flex-direction:column;flex:1;gap:4px;display:flex}.rebemer-row__modifier-row{align-items:center;gap:4px;display:flex}.rebemer-row__modifier-row .rebemer-row__modifier{flex:1;width:auto}.rebemer-row__modifier-remove{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;flex:none;padding:2px 6px;font-size:13px;line-height:1}.rebemer-row__modifier-remove:hover:not(:disabled){border-color:var(--rebemer-error);color:var(--rebemer-error)}.rebemer-row__modifier-add{border:1px dashed var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg-muted);font:inherit;cursor:pointer;text-align:left;background:0 0;width:-moz-fit-content;width:fit-content;padding:3px 7px;font-size:10px}.rebemer-row__modifier-add:hover:not(:disabled){border-color:var(--rebemer-fg-muted);color:var(--rebemer-fg)}.rebemer-row__op-toggle{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);grid-column:1/-1;align-items:center;width:-moz-fit-content;width:fit-content;margin-top:2px;display:inline-flex;overflow:hidden}.rebemer-row__op-btn{background:var(--rebemer-input-bg);border:0;border-left:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap;padding:4px 9px}.rebemer-row__op-btn:first-child{border-left:0}.rebemer-row__op-btn--on{color:var(--rebemer-accent);background:#e2b93b1f}.rebemer-row__op-btn:hover:not(.rebemer-row__op-btn--on){color:var(--rebemer-fg);background:#ffffff0f}.rebemer-row__family{grid-column:1/-1;align-items:center;gap:7px;margin-top:3px;display:flex}.rebemer-row__family-label{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;flex:none;font-size:9px}.rebemer-row__family-select{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);color:var(--rebemer-fg);font:inherit;flex:1;min-width:0;padding:3px 6px;font-size:11px}.rebemer-row__family-select:focus{outline:1px solid var(--rebemer-accent)}.rebemer-row__info code,.rebemer-row__warn code{color:var(--rebemer-accent);background:#0000004d;border-radius:2px;padding:1px 4px;font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-row__recommend{border-left:2px solid var(--rebemer-success);color:var(--rebemer-fg);background:#4ade8014;border-radius:2px;grid-column:1/-1;margin:0;padding:6px 8px;font-size:11px;line-height:1.4}.rebemer-row__recommend code{color:var(--rebemer-accent);background:#0000004d;border-radius:2px;padding:1px 4px;font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-row__warn,.rebemer-row__info{border-radius:2px;grid-column:1/-1;margin:0;padding:5px 8px;font-size:11px;line-height:1.4}.rebemer-row__warn{color:var(--rebemer-fg);background:#e2b93b1f;border-left:2px solid #e2b93b}.rebemer-row__info{color:var(--rebemer-fg-muted);background:#63b3ed1a;border-left:2px solid #63b3ed}.rebemer-row__chips{flex-wrap:wrap;grid-column:1/-1;align-items:center;gap:4px;padding:4px 0 0;font-size:10px;display:flex}.rebemer-row__chips-label,.rebemer-row__chips-empty,.rebemer-row__chips-skip{color:var(--rebemer-fg-muted);text-transform:uppercase;letter-spacing:.5px;font-size:9px}.rebemer-row__chips-skip{cursor:help;color:#c8a038;margin-left:auto}.rebemer-chip{border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg);white-space:nowrap;background:#0000004d;border-radius:2px;padding:2px 5px;font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-panel__footer{border-top:1px solid var(--rebemer-border);justify-content:flex-end;gap:8px;padding:10px 14px;display:flex}.rebemer-btn{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg);border-radius:var(--rebemer-radius);font:inherit;cursor:pointer;padding:6px 12px}.rebemer-btn:hover{border-color:var(--rebemer-fg-muted)}.rebemer-btn--primary{background:var(--rebemer-accent);border-color:var(--rebemer-accent);color:var(--rebemer-bg);font-weight:600}.rebemer-btn--primary:hover{background:var(--rebemer-accent-hover);border-color:var(--rebemer-accent-hover)}.rebemer-toast{z-index:100002;background:var(--rebemer-input-bg);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);cursor:pointer;padding:8px 12px;position:fixed;bottom:16px;right:16px;box-shadow:0 4px 12px #0006}.rebemer-toast--success{border-color:var(--rebemer-success)}.rebemer-toast--error{border-color:var(--rebemer-error);color:var(--rebemer-error)}.rebemer-class-hint{z-index:100003;background:var(--rebemer-bg);max-width:280px;color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);pointer-events:none;padding:8px 10px;position:fixed;box-shadow:0 6px 20px #00000080}.rebemer-class-hint[hidden]{display:none}.rebemer-class-hint__name{color:var(--rebemer-accent);font:600 11px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.rebemer-class-hint__cat{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin-left:6px;font-size:9px}.rebemer-class-hint__cat[hidden]{display:none}.rebemer-class-hint__desc{color:var(--rebemer-fg);margin:4px 0 0}.rebemer-class-hint-btn{border:1px solid var(--rebemer-border,#3d4752);width:16px;height:16px;color:var(--rebemer-fg-muted,#8a8d95);font:700 10px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);cursor:help;opacity:.7;vertical-align:middle;background:0 0;border-radius:50%;flex:none;justify-content:center;align-items:center;margin-inline-start:4px;transition:opacity .12s,color .12s,border-color .12s;display:inline-flex}.rebemer-class-hint-btn:before{content:"?"}.rebemer-class-hint-btn:hover{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.rebemer-class-hint-btn:focus-visible{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.slashed-cp-launch{z-index:99999;background:var(--rebemer-bg);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);font:600 11px/1 var(--rebemer-font);letter-spacing:.3px;cursor:pointer;border-radius:999px;align-items:center;gap:7px;padding:7px 12px;transition:border-color .12s,color .12s,transform .12s;display:inline-flex;position:fixed;bottom:16px;right:16px;box-shadow:0 4px 16px #00000073}.slashed-cp-launch:hover{border-color:var(--rebemer-fg-muted);transform:translateY(-1px)}.slashed-cp-launch--on{border-color:var(--rebemer-accent);color:#fff}.slashed-cp-launch__dot{background:conic-gradient(from 210deg,#5b8cff,#b07cff,#ff6b6b,#ffd24a,#4ade80,#5b8cff);border-radius:50%;width:12px;height:12px;box-shadow:inset 0 0 0 1px #ffffff40}.slashed-cp-launch__txt{text-transform:uppercase}.slashed-cp{z-index:100001;background:var(--rebemer-bg);width:372px;max-width:calc(100vw - 32px);color:var(--rebemer-fg);border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);font:12px/1.45 var(--rebemer-font);outline:none;flex-direction:column;display:flex;position:fixed;top:64px;bottom:64px;right:16px;overflow:hidden;box-shadow:0 12px 48px #0009}.slashed-cp__header{border-bottom:1px solid var(--rebemer-border);align-items:center;gap:10px;padding:10px 12px;display:flex}.slashed-cp__title{text-transform:uppercase;letter-spacing:.5px;color:#fff;flex:1;margin:0;font-size:11px;font-weight:700}.slashed-cp__close{color:var(--rebemer-fg-muted);cursor:pointer;background:0 0;border:0;padding:2px 4px;font-size:18px;line-height:1}.slashed-cp__close:hover{color:#fff}.slashed-cp__seg{border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);display:inline-flex;overflow:hidden}.slashed-cp__seg-btn{background:var(--rebemer-input-bg);border:0;border-left:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;text-transform:uppercase;letter-spacing:.4px;padding:5px 9px}.slashed-cp__seg-btn:first-child{border-left:0}.slashed-cp__seg-btn--on{background:var(--rebemer-accent);color:var(--rebemer-bg)}.slashed-cp__toolbar{border-bottom:1px solid var(--rebemer-border);flex-direction:column;gap:8px;padding:10px 12px;display:flex}.slashed-cp__search{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);border-radius:var(--rebemer-radius);width:100%;color:var(--rebemer-fg);font:inherit;box-sizing:border-box;padding:6px 8px}.slashed-cp__search:focus{outline:1px solid var(--rebemer-accent)}.slashed-cp__target{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.slashed-cp__target-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);font-size:9px}.slashed-cp__chip{background:var(--rebemer-input-bg);border:1px solid var(--rebemer-input-border);color:var(--rebemer-fg-muted);font:600 10px/1 var(--rebemer-font);cursor:pointer;border-radius:999px;padding:4px 10px}.slashed-cp__chip--on{background:var(--rebemer-accent);border-color:var(--rebemer-accent);color:var(--rebemer-bg)}.slashed-cp__body{flex:1;padding:6px 12px 12px;overflow-y:auto}.slashed-cp__empty{color:var(--rebemer-fg-muted);padding:12px 2px;font-size:11px}.slashed-cp__group{border-bottom:1px solid #ffffff0d;padding:10px 0 6px}.slashed-cp__group:last-child{border-bottom:0}.slashed-cp__group-head{margin:0 0 8px}.slashed-cp__group-title{color:#fff;text-transform:capitalize;align-items:baseline;gap:7px;margin:0;font-size:11px;font-weight:700;display:flex}.slashed-cp__group-tag{color:var(--rebemer-fg-muted);text-transform:none;font-size:10px;font-weight:500}.slashed-cp__group-count{font:600 9px/1 var(--rebemer-font);color:var(--rebemer-fg-muted);text-transform:none;background:#ffffff0f;border-radius:999px;margin-left:auto;padding:2px 6px}.slashed-cp__group-use{color:var(--rebemer-fg-muted);margin:2px 0 0;font-size:10px;line-height:1.4}.slashed-cp__section-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:8px 0 5px;font-size:9px}.slashed-cp__grid{grid-template-columns:repeat(auto-fill,minmax(38px,1fr));gap:7px 6px;display:grid}.slashed-cp__cell{flex-direction:column;align-items:center;gap:3px;min-width:0;display:flex}.slashed-cp__cap{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:9px;overflow:hidden}.slashed-cp__list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.slashed-cp__list-item{align-items:center;gap:8px;display:flex}.slashed-cp__list-name{color:var(--rebemer-fg);flex:none;font-size:11px}.slashed-cp__list-var{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;margin-left:auto;font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow:hidden}.slashed-cp-swatch{cursor:pointer;background:0 0;border:1px solid #7f7f7f73;border-radius:6px;flex:none;width:28px;height:28px;padding:0;position:relative;overflow:hidden}.slashed-cp-swatch:hover{border-color:var(--rebemer-accent)}.slashed-cp-swatch:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:1px}.slashed-cp-swatch__fill{background:var(--cp-solid);position:absolute;top:0;bottom:0;left:0;right:0}.slashed-cp-swatch--split .slashed-cp-swatch__fill{background:linear-gradient(135deg, var(--cp-l) 0 calc(50% - .5px), #00000059 calc(50% - .5px) calc(50% + .5px), var(--cp-d) calc(50% + .5px) 100%)}.slashed-cp-swatch--alpha{border-style:dashed}.slashed-cp__footer{border-top:1px solid var(--rebemer-border);color:var(--rebemer-fg-muted);align-items:center;gap:10px;padding:8px 12px;font-size:10px;display:flex}.slashed-cp__hint{margin-left:auto}.slashed-cp__hint code,.slashed-cp__footer code{color:var(--rebemer-accent);font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.slashed-cp__legend{align-items:center;gap:5px;display:inline-flex}.slashed-cp__legend-sw{background:linear-gradient(135deg,#fff 0 50%,#222 50% 100%);border:1px solid #7f7f7f73;border-radius:3px;width:12px;height:12px}.rebemer-toast--info{border-color:#63b3ed}.slashed-sf-color-btn{cursor:pointer;opacity:.65;border-radius:5px;flex-shrink:0;order:11;justify-content:center;align-items:center;width:28px;height:28px;margin-left:3px;transition:opacity .12s,background .12s;display:inline-flex}.slashed-sf-color-btn:hover{opacity:1;background:#5b8cff26}.slashed-sf-color-btn--active{opacity:1}.slashed-sf-color-btn--active:hover{background:0 0}.slashed-sf-color-btn__dot{background:conic-gradient(from 210deg,#5b8cff,#b07cff,#ff6b6b,#ffd24a,#4ade80,#5b8cff);border-radius:50%;flex-shrink:0;width:20px;height:20px;transition:width 80ms,height 80ms,border-radius .12s,box-shadow .12s;display:inline-block;box-shadow:inset 0 0 0 1px #fff3}.slashed-sf-color-btn--active .slashed-sf-color-btn__dot{border-radius:5px;width:28px;height:28px;transition:width 80ms,height 80ms,border-radius .12s;animation:2.4s ease-in-out infinite slashed-sf-active-glow}@keyframes slashed-sf-active-glow{0%,to{box-shadow:inset 0 0 0 1px #0003, 0 0 0 2px color-mix(in srgb, var(--sf-active-color,#fff) 60%, transparent), 0 0 7px color-mix(in srgb, var(--sf-active-color,#fff) 35%, transparent)}50%{box-shadow:inset 0 0 0 1px #0003, 0 0 0 2.5px color-mix(in srgb, var(--sf-active-color,#fff) 88%, transparent), 0 0 14px color-mix(in srgb, var(--sf-active-color,#fff) 50%, transparent)}}.bricks-control-preview:has(.slashed-sf-preview-label) .bricks-control-transparency-pattern{display:none}.slashed-sf-preview-label{color:#ff4040;pointer-events:none;text-shadow:0 0 3px #0009;justify-content:center;align-items:center;width:100%;height:100%;font:700 11px/1 system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;display:flex}.slashed-var-swatch{vertical-align:middle;background-color:#fff;background-image:linear-gradient(var(--slashed-swatch-color,transparent), var(--slashed-swatch-color,transparent)), linear-gradient(45deg, #7f7f7f59 25%, transparent 25%, transparent 75%, #7f7f7f59 75%), linear-gradient(45deg, #7f7f7f59 25%, transparent 25%, transparent 75%, #7f7f7f59 75%);background-position:0 0,0 0,4px 4px;background-size:auto,8px 8px,8px 8px;border:1px solid #7f7f7f73;border-radius:3px;flex:none;width:12px;height:12px;margin-right:7px;display:inline-block}.slashed-cp--docked{top:0;bottom:0;left:var(--cp-dock-left,320px);border-top-left-radius:0;border-bottom-left-radius:0;width:360px;right:auto;box-shadow:6px 0 32px #0000008c}.slashed-cp[data-mode=both] .slashed-cp__qu-sw,.slashed-cp[data-mode=both] .slashed-cp__scan-base,.slashed-cp[data-mode=both] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=both] .slashed-cp__fam-banner,.slashed-cp[data-mode=both] .slashed-cp__strip-sw{background:linear-gradient(135deg, var(--sw-l) 0 calc(50% - .5px), #00000059 calc(50% - .5px) calc(50% + .5px), var(--sw-d) calc(50% + .5px) 100%)}.slashed-cp[data-mode=light] .slashed-cp__qu-sw,.slashed-cp[data-mode=light] .slashed-cp__scan-base,.slashed-cp[data-mode=light] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=light] .slashed-cp__fam-banner,.slashed-cp[data-mode=light] .slashed-cp__strip-sw{background:var(--sw-l)}.slashed-cp[data-mode=dark] .slashed-cp__qu-sw,.slashed-cp[data-mode=dark] .slashed-cp__scan-base,.slashed-cp[data-mode=dark] .slashed-cp__scan-pre-sw,.slashed-cp[data-mode=dark] .slashed-cp__fam-banner,.slashed-cp[data-mode=dark] .slashed-cp__strip-sw{background:var(--sw-d)}.slashed-cp__sec{border-bottom:1px solid #ffffff0d;padding:10px 0 6px}.slashed-cp__sec:last-child{border-bottom:0}.slashed-cp__sec-title{text-transform:uppercase;letter-spacing:1px;color:var(--rebemer-fg-muted);margin:0 0 10px;font-size:9px;font-weight:700}.slashed-cp__sec--pal{padding-top:12px}.slashed-cp__qu-group{margin-bottom:10px}.slashed-cp__qu-group:last-child{margin-bottom:0}.slashed-cp__qu-label{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:0 0 4px;font-size:9px}.slashed-cp__qu-grid{grid-template-columns:1fr 1fr;gap:2px;display:grid}.slashed-cp__qu-cell{color:var(--rebemer-fg);font:11px/1.3 var(--rebemer-font);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:5px;align-items:center;gap:7px;min-width:0;padding:4px 6px;transition:background 80ms;display:flex}.slashed-cp__qu-cell:hover{background:#ffffff0f}.slashed-cp__qu-sw{border:1px solid #7f7f7f59;border-radius:5px;flex:0 0 22px;width:22px;height:22px;transition:border-color 80ms}.slashed-cp__qu-sw--alpha{border-style:dashed}.slashed-cp__qu-cell:hover .slashed-cp__qu-sw{border-color:var(--rebemer-accent)}.slashed-cp__qu-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.slashed-cp__pal-cat{text-transform:uppercase;letter-spacing:.8px;color:var(--rebemer-fg-muted);margin:10px 0 5px;font-size:9px;font-weight:700}.slashed-cp__pal-cat:first-of-type{margin-top:2px}.slashed-cp__scanner{border:1px solid var(--rebemer-border);border-radius:var(--rebemer-radius);margin-bottom:4px;overflow:hidden}.slashed-cp__scan-item+.slashed-cp__scan-item{border-top:1px solid var(--rebemer-border)}.slashed-cp__scan-row{width:100%;color:var(--rebemer-fg);font:11px/1 var(--rebemer-font);cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:8px;padding:7px 10px;transition:background 80ms;display:flex}.slashed-cp__scan-row:hover,.slashed-cp__scan-row--open{background:#ffffff0a}.slashed-cp__scan-base{border:1px solid #7f7f7f4d;border-radius:4px;flex:0 0 18px;width:18px;height:18px}.slashed-cp__scan-name{flex:none;font-weight:600}.slashed-cp__scan-tagline{color:var(--rebemer-fg-muted);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:10px;overflow:hidden}.slashed-cp__scan-pre{flex:none;gap:3px;display:flex}.slashed-cp__scan-pre-sw{border:1px solid #7f7f7f33;border-radius:3px;width:14px;height:14px}.slashed-cp__scan-chev{color:var(--rebemer-fg-muted);flex:none;font-size:10px}.slashed-cp__fam{border-top:1px solid var(--rebemer-border);background:#0000001f;padding:10px 10px 12px}.slashed-cp__fam-banner{cursor:pointer;box-sizing:border-box;border:0;border-radius:7px;align-items:flex-end;width:100%;height:52px;margin-bottom:10px;padding:7px 10px;transition:opacity .12s;display:flex;overflow:hidden}.slashed-cp__fam-banner:hover{opacity:.85}.slashed-cp__fam-banner-lbl{font:700 9px/1 var(--rebemer-font);text-transform:uppercase;letter-spacing:2px;color:#ffffffe6;text-shadow:0 1px 3px #0009}.slashed-cp__fam-sec{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted);margin:8px 0 6px;font-size:9px}.slashed-cp__fam-sec:first-child{margin-top:0}.slashed-cp__fam-sec-range{text-transform:none;letter-spacing:0;color:#ffffff40;font-weight:400}.slashed-cp__strip{border-radius:5px;height:24px;display:flex;overflow:hidden}.slashed-cp__strip--alpha{opacity:.8;margin-top:4px}.slashed-cp__strip-sw{cursor:pointer;border:0;flex:1;min-width:0;padding:0;transition:flex .1s ease-out;position:relative}.slashed-cp__strip-sw:hover{box-shadow:inset 0 0 0 2px var(--rebemer-accent);flex:2}.slashed-cp__strip-sw--alpha{box-shadow:inset 0 0 0 1px #7f7f7f66}.slashed-cp__strip-sw--alpha:hover{box-shadow:inset 0 0 0 2px var(--rebemer-accent)}.slashed-cp__strip-sw:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px;z-index:1}.slashed-cp__alpha-btn{color:var(--rebemer-fg-muted);font:10px/1 var(--rebemer-font);cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;margin-top:8px;padding:0;display:flex}.slashed-cp__alpha-btn:hover{color:var(--rebemer-fg)}.slashed-cp__alpha-btn:focus-visible{outline:1px dotted var(--rebemer-accent);outline-offset:2px;color:var(--rebemer-fg)}.slashed-cp__qu-cell:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-cp__scan-row:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-cp__fam-banner:focus-visible{outline:2px solid var(--rebemer-accent);outline-offset:-2px}.slashed-var-hint{z-index:100003;white-space:normal;overflow-wrap:break-word;background:var(--rebemer-bg,#161a1d);width:max-content;max-width:320px;color:var(--rebemer-fg,#e1e1e1);border:1px solid var(--rebemer-border,#3d4752);border-radius:var(--rebemer-radius,4px);font:12px/1.45 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);pointer-events:none;padding:6px 10px;position:fixed;box-shadow:0 6px 20px #00000080}.slashed-var-hint[hidden]{display:none}.slashed-var-hint__name{color:var(--rebemer-accent,#e2b93b);font:600 11px/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.slashed-var-hint__cat{text-transform:uppercase;letter-spacing:.5px;color:var(--rebemer-fg-muted,#8a8d95);margin-left:6px;font-size:9px}.slashed-var-hint__cat[hidden]{display:none}.slashed-var-hint__desc{color:var(--rebemer-fg,#e1e1e1);margin:5px 0 0;padding:0;font-size:11px;line-height:1.5}.slashed-var-hint__desc[hidden]{display:none}.slashed-var-hint-btn{border:1px solid var(--rebemer-border,#3d4752);width:14px;min-width:14px;height:14px;min-height:14px;max-height:14px;color:var(--rebemer-fg-muted,#8a8d95);font:700 9px/1 var(--rebemer-font,"Inter", -apple-system, BlinkMacSystemFont, sans-serif);cursor:help;opacity:.6;vertical-align:middle;box-sizing:content-box;background:0 0;border-radius:50%;flex:none;justify-content:center;align-self:center;align-items:center;margin-left:6px;line-height:1;transition:opacity .12s,color .12s,border-color .12s;display:inline-flex}.slashed-var-hint-btn:before{content:"?"}.slashed-var-hint-btn:hover{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none}.slashed-var-hint-btn:focus-visible{opacity:1;color:var(--rebemer-accent,#e2b93b);border-color:var(--rebemer-accent,#e2b93b);outline:none} /*$vite$:1*/ \ No newline at end of file diff --git a/SLASHED-for-WP/integrations/bricks/editor-app/src/styles/panel.css b/SLASHED-for-WP/integrations/bricks/editor-app/src/styles/panel.css index 73f658fa..87093837 100644 --- a/SLASHED-for-WP/integrations/bricks/editor-app/src/styles/panel.css +++ b/SLASHED-for-WP/integrations/bricks/editor-app/src/styles/panel.css @@ -797,17 +797,19 @@ li[data-id]:focus-within > .rebemer-badge-host { } } -/* ✕ overlay injected inside .bricks-control-preview when an --sf-color-* - token is the active value. We hide the native transparency-pattern span - (it would show a static hex snapshot of an adaptive light-dark() token) - and overlay a red ✕ so users instantly know the swatch cannot represent - the adaptive value accurately. */ +/* ✕ label injected inside .bricks-control-preview when an --sf-color-* + token is the active value. Do not set positioning on + .bricks-control-preview here: Bricks uses its own positioning to keep the + native swatch at the right side of the input row. */ +.bricks-control-preview:has(.slashed-sf-preview-label) .bricks-control-transparency-pattern { + display: none; +} .slashed-sf-preview-label { - position: absolute; - inset: 0; display: flex; align-items: center; justify-content: center; + width: 100%; + height: 100%; font: 700 11px/1 system-ui, sans-serif; color: #ff4040; pointer-events: none; From d99491ab6e068fa2405fce220c340fb9f732b4dc Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 7 Jul 2026 12:41:18 +0000 Subject: [PATCH 3/6] fix(admin-app): vendor optional/ CSS layers and track framework's dist/ rename sync-core.mjs only ever vendored core/ chrome layers, so main.ts's new `@framework-css/optional/components.css` import (and its tokens.components.css dependency) had no vendored source and broke `npm run build:admin-app` in CI. Also follow the framework's own badges/ -> dist/ rename for the full CSS bundle PreviewPanel.svelte imports, and re-sync src/ + framework-css/ to match the framework's current main. --- .../admin-app/.vendored-manifest.json | 112 +- .../admin-app/framework-css/core/layout.css | 144 +- .../admin-app/framework-css/core/macros.css | 82 +- .../admin-app/framework-css/core/themes.css | 47 +- .../admin-app/framework-css/core/tokens.css | 118 +- .../framework-css/core/tokens.layout.css | 17 +- .../framework-css/core/tokens.macros.css | 43 + .../{badges => dist}/slashed.full.css | 1512 ++++----- .../framework-css/optional/components.css | 309 ++ .../optional/tokens.components.css | 73 + .../admin-app/scripts/sync-core.mjs | 69 +- SLASHED-for-WP/admin-app/src/App.svelte | 4 +- .../src/components/CommandPalette.svelte | 2 +- .../src/components/DomainPanel.svelte | 3 + .../src/components/inputs/SliderRow.svelte | 141 +- .../src/components/panels/BordersPanel.svelte | 68 +- .../components/panels/ComponentsPanel.svelte | 464 +++ .../src/components/panels/EffectsPanel.svelte | 73 +- .../src/components/panels/HomePanel.svelte | 32 +- .../src/components/panels/LayoutPanel.svelte | 45 +- .../src/components/panels/MacrosPanel.svelte | 107 +- .../src/components/panels/MiscPanel.svelte | 51 +- .../src/components/panels/MotionPanel.svelte | 9 +- .../src/components/panels/SpacingPanel.svelte | 4 + .../components/panels/TypographyPanel.svelte | 18 + .../src/components/shell/PreviewPanel.svelte | 280 +- .../src/components/shell/SidebarNav.svelte | 3 +- .../src/data/api-index.generated.json | 1213 ++++++- .../admin-app/src/data/classes.generated.json | 2792 +++++++++++------ .../admin-app/src/data/domain-patterns.json | 7 +- .../src/data/token-registry.generated.json | 242 +- .../admin-app/src/lib/variableScales.ts | 40 + SLASHED-for-WP/admin-app/src/main.ts | 8 + SLASHED-for-WP/admin-app/vite.config.js | 7 +- SLASHED-for-WP/assets/admin-app/app.css | 2 +- SLASHED-for-WP/assets/admin-app/app.js | 1832 ++++++----- 36 files changed, 6979 insertions(+), 2994 deletions(-) rename SLASHED-for-WP/admin-app/framework-css/{badges => dist}/slashed.full.css (78%) create mode 100644 SLASHED-for-WP/admin-app/framework-css/optional/components.css create mode 100644 SLASHED-for-WP/admin-app/framework-css/optional/tokens.components.css create mode 100644 SLASHED-for-WP/admin-app/src/components/panels/ComponentsPanel.svelte create mode 100644 SLASHED-for-WP/admin-app/src/lib/variableScales.ts diff --git a/SLASHED-for-WP/admin-app/.vendored-manifest.json b/SLASHED-for-WP/admin-app/.vendored-manifest.json index 01834e0a..7f2af15b 100644 --- a/SLASHED-for-WP/admin-app/.vendored-manifest.json +++ b/SLASHED-for-WP/admin-app/.vendored-manifest.json @@ -3,209 +3,217 @@ "description": "Files vendored from the SLASHED framework configurator. DO NOT edit directly — make changes in codeslash-dev/SLASHED → configurator/src/ and re-run npm run sync.", "frameworkRepo": "https://github.com/codeslash-dev/SLASHED", "configuratorSrc": "configurator/src/", - "source": "github:codeslash-dev/slashed@main", - "syncedAt": "2026-07-03T18:27:12.207Z" + "source": "local", + "syncedAt": "2026-07-07T12:35:14.895Z" }, "vendoredFiles": [ { "file": "src/app.css", - "source": "github:codeslash-dev/slashed/configurator/src/app.css@main" + "source": "local:configurator/src/app.css" }, { "file": "src/App.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/App.svelte@main" + "source": "local:configurator/src/App.svelte" }, { "file": "src/components/CommandPalette.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/CommandPalette.svelte@main" + "source": "local:configurator/src/components/CommandPalette.svelte" }, { "file": "src/components/DomainPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/DomainPanel.svelte@main" + "source": "local:configurator/src/components/DomainPanel.svelte" }, { "file": "src/components/inputs/ClampField.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/inputs/ClampField.svelte@main" + "source": "local:configurator/src/components/inputs/ClampField.svelte" }, { "file": "src/components/inputs/ColorInput.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/inputs/ColorInput.svelte@main" + "source": "local:configurator/src/components/inputs/ColorInput.svelte" }, { "file": "src/components/inputs/OklchColorDesk.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/inputs/OklchColorDesk.svelte@main" + "source": "local:configurator/src/components/inputs/OklchColorDesk.svelte" }, { "file": "src/components/inputs/PowerKnobRow.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/inputs/PowerKnobRow.svelte@main" + "source": "local:configurator/src/components/inputs/PowerKnobRow.svelte" }, { "file": "src/components/inputs/RangeWithNumber.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/inputs/RangeWithNumber.svelte@main" + "source": "local:configurator/src/components/inputs/RangeWithNumber.svelte" }, { "file": "src/components/inputs/SliderRow.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/inputs/SliderRow.svelte@main" + "source": "local:configurator/src/components/inputs/SliderRow.svelte" }, { "file": "src/components/inputs/TokenRow.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/inputs/TokenRow.svelte@main" + "source": "local:configurator/src/components/inputs/TokenRow.svelte" }, { "file": "src/components/panels/AllTokensTab.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/AllTokensTab.svelte@main" + "source": "local:configurator/src/components/panels/AllTokensTab.svelte" }, { "file": "src/components/panels/BordersPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/BordersPanel.svelte@main" + "source": "local:configurator/src/components/panels/BordersPanel.svelte" }, { "file": "src/components/panels/CheatsheetPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/CheatsheetPanel.svelte@main" + "source": "local:configurator/src/components/panels/CheatsheetPanel.svelte" }, { "file": "src/components/panels/ColorsPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/ColorsPanel.svelte@main" + "source": "local:configurator/src/components/panels/ColorsPanel.svelte" + }, + { + "file": "src/components/panels/ComponentsPanel.svelte", + "source": "local:configurator/src/components/panels/ComponentsPanel.svelte" }, { "file": "src/components/panels/EffectsPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/EffectsPanel.svelte@main" + "source": "local:configurator/src/components/panels/EffectsPanel.svelte" }, { "file": "src/components/panels/ExportPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/ExportPanel.svelte@main" + "source": "local:configurator/src/components/panels/ExportPanel.svelte" }, { "file": "src/components/panels/GenericTokenPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/GenericTokenPanel.svelte@main" + "source": "local:configurator/src/components/panels/GenericTokenPanel.svelte" }, { "file": "src/components/panels/HomePanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/HomePanel.svelte@main" + "source": "local:configurator/src/components/panels/HomePanel.svelte" }, { "file": "src/components/panels/LayoutPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/LayoutPanel.svelte@main" + "source": "local:configurator/src/components/panels/LayoutPanel.svelte" }, { "file": "src/components/panels/MacrosPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/MacrosPanel.svelte@main" + "source": "local:configurator/src/components/panels/MacrosPanel.svelte" }, { "file": "src/components/panels/MiscPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/MiscPanel.svelte@main" + "source": "local:configurator/src/components/panels/MiscPanel.svelte" }, { "file": "src/components/panels/MotionPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/MotionPanel.svelte@main" + "source": "local:configurator/src/components/panels/MotionPanel.svelte" }, { "file": "src/components/panels/ShadowsPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/ShadowsPanel.svelte@main" + "source": "local:configurator/src/components/panels/ShadowsPanel.svelte" }, { "file": "src/components/panels/SpacingPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/SpacingPanel.svelte@main" + "source": "local:configurator/src/components/panels/SpacingPanel.svelte" }, { "file": "src/components/panels/ThemesPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/ThemesPanel.svelte@main" + "source": "local:configurator/src/components/panels/ThemesPanel.svelte" }, { "file": "src/components/panels/TypographyPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/TypographyPanel.svelte@main" + "source": "local:configurator/src/components/panels/TypographyPanel.svelte" }, { "file": "src/components/panels/WcagPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/panels/WcagPanel.svelte@main" + "source": "local:configurator/src/components/panels/WcagPanel.svelte" }, { "file": "src/components/shell/PreviewPanel.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/shell/PreviewPanel.svelte@main" + "source": "local:configurator/src/components/shell/PreviewPanel.svelte" }, { "file": "src/components/shell/SidebarNav.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/shell/SidebarNav.svelte@main" + "source": "local:configurator/src/components/shell/SidebarNav.svelte" }, { "file": "src/components/shell/StatusBar.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/shell/StatusBar.svelte@main" + "source": "local:configurator/src/components/shell/StatusBar.svelte" }, { "file": "src/components/shell/StudioHeader.svelte", - "source": "github:codeslash-dev/slashed/configurator/src/components/shell/StudioHeader.svelte@main" + "source": "local:configurator/src/components/shell/StudioHeader.svelte" }, { "file": "src/data/api-index.generated.json", - "source": "github:codeslash-dev/slashed/configurator/src/data/api-index.generated.json@main" + "source": "local:configurator/src/data/api-index.generated.json" }, { "file": "src/data/bundles.generated.json", - "source": "github:codeslash-dev/slashed/configurator/src/data/bundles.generated.json@main" + "source": "local:configurator/src/data/bundles.generated.json" }, { "file": "src/data/classes.generated.json", - "source": "github:codeslash-dev/slashed/configurator/src/data/classes.generated.json@main" + "source": "local:configurator/src/data/classes.generated.json" }, { "file": "src/data/domain-patterns.json", - "source": "github:codeslash-dev/slashed/configurator/src/data/domain-patterns.json@main" + "source": "local:configurator/src/data/domain-patterns.json" }, { "file": "src/data/token-registry.generated.json", - "source": "github:codeslash-dev/slashed/configurator/src/data/token-registry.generated.json@main" + "source": "local:configurator/src/data/token-registry.generated.json" }, { "file": "src/lib/basics.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/basics.ts@main" + "source": "local:configurator/src/lib/basics.ts" }, { "file": "src/lib/codec.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/codec.ts@main" + "source": "local:configurator/src/lib/codec.ts" }, { "file": "src/lib/colorUtils.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/colorUtils.ts@main" + "source": "local:configurator/src/lib/colorUtils.ts" }, { "file": "src/lib/domains.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/domains.ts@main" + "source": "local:configurator/src/lib/domains.ts" }, { "file": "src/lib/lumlockerPreview.svelte.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/lumlockerPreview.svelte.ts@main" + "source": "local:configurator/src/lib/lumlockerPreview.svelte.ts" }, { "file": "src/lib/persistence.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/persistence.ts@main" + "source": "local:configurator/src/lib/persistence.ts" }, { "file": "src/lib/powerKnobs.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/powerKnobs.ts@main" + "source": "local:configurator/src/lib/powerKnobs.ts" }, { "file": "src/lib/previewResolver.svelte.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/previewResolver.svelte.ts@main" + "source": "local:configurator/src/lib/previewResolver.svelte.ts" }, { "file": "src/lib/savedThemes.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/savedThemes.ts@main" + "source": "local:configurator/src/lib/savedThemes.ts" }, { "file": "src/lib/theme.svelte.ts", - "source": "github:codeslash-dev/slashed/configurator/src/lib/theme.svelte.ts@main" + "source": "local:configurator/src/lib/theme.svelte.ts" + }, + { + "file": "src/lib/variableScales.ts", + "source": "local:configurator/src/lib/variableScales.ts" }, { "file": "src/main.ts", - "source": "github:codeslash-dev/slashed/configurator/src/main.ts@main" + "source": "local:configurator/src/main.ts" }, { "file": "src/types.ts", - "source": "github:codeslash-dev/slashed/configurator/src/types.ts@main" + "source": "local:configurator/src/types.ts" }, { "file": "src/vite-env.d.ts", - "source": "github:codeslash-dev/slashed/configurator/src/vite-env.d.ts@main" + "source": "local:configurator/src/vite-env.d.ts" } ] } diff --git a/SLASHED-for-WP/admin-app/framework-css/core/layout.css b/SLASHED-for-WP/admin-app/framework-css/core/layout.css index 64a310a1..6d6e1f9f 100644 --- a/SLASHED-for-WP/admin-app/framework-css/core/layout.css +++ b/SLASHED-for-WP/admin-app/framework-css/core/layout.css @@ -23,6 +23,17 @@ .sf-section-group > .sf-section + .sf-section { padding-block-start: 0; } + /* Header — block padding on the standard spacing scale. Headers usually + want lighter vertical rhythm than .sf-section, so these map to + --sf-space-* directly. Only block padding is set; any inline gutter + (from .sf-section--guttered, a container, or the element itself) is + left intact. */ + .sf-header--xs { padding-block: var(--sf-space-xs); } + .sf-header--s { padding-block: var(--sf-space-s); } + .sf-header--m { padding-block: var(--sf-space-m); } + .sf-header--l { padding-block: var(--sf-space-l); } + .sf-header--xl { padding-block: var(--sf-space-xl); } + /* Collapse modifier */ .sf-section--collapse:has(+ .sf-section--collapse) { padding-block-end: calc(var(--sf-section-pad) / 2); @@ -55,7 +66,18 @@ background: linear-gradient(to right, transparent, var(--sf-divider-color), transparent); } - + /* Divide — rules between direct children, reusing .sf-divider's tokens. + Unlike .sf-divider (a standalone separator element), .sf-divide is + applied to the container and needs no extra markup per gap. */ + .sf-divide > * + * { + border-block-start: var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color); + } + .sf-divide--vertical > * + * { + border-block-start: none; + border-inline-start: var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color); + } + + /* Container */ .sf-container { container: sf-layout / inline-size; @@ -75,7 +97,62 @@ container-type: inline-size; } + /* Overlay — absolute-fill layout helper for overlays/backdrops. */ + .sf-overlay { + position: absolute; + inset: 0; + } + + /* .sf-fluid-cq: opt a subtree into a CONTAINER-relative fluid scale (issue + #497). By default --sf-text-* / --sf-space-* interpolate against 100vw (the + viewport); inside .sf-fluid-cq they interpolate against 100cqi (this box's + inline size), so type + spacing track the container the way the layout + primitives (.sf-grid-cols-*, .sf-content-grid, .sf-bento) already do. Use + on nested / narrow contexts (sidebars, cards, 1/3 columns) where a + viewport-driven scale would size text as if it spanned the full page. + + Why the tokens are RE-DECLARED (not just --sf-fluid-width flipped): the + --sf-text-* / --sf-space-* tokens are computed at :root, so their + var(--sf-fluid-width) is substituted there (100vw) and the *resolved* + length inherits down — overriding --sf-fluid-width lower in the tree can't + retroactively rewrite an already-computed inherited value. The scale is + therefore re-declared in-scope so var(--sf-fluid-width) re-resolves to + 100cqi. It is re-declared on the direct children, not the element itself: + a query container's own cq units resolve against its ANCESTOR container, so + the re-computation must happen one level in — children compute against + .sf-fluid-cq and deeper descendants inherit that resolved value. + + The formulas below are character-identical to their :root twins in + core/tokens.css (both read var(--sf-fluid-width)); keep the two copies in + sync if the generative formula ever changes (cf. themes.css SL-001). */ + .sf-fluid-cq { container-type: inline-size; } + .sf-fluid-cq > * { + --sf-fluid-width: 100cqi; + --sf-text-2xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale)); + --sf-text-xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale)); + --sf-text-s: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale)); + --sf-text-m: calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale)); + --sf-text-l: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale)); + --sf-text-xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale)); + --sf-text-2xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale)); + --sf-text-3xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale)); + --sf-text-4xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale)); + --sf-text-display-s: calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-m: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-l: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale)); + --sf-space-2xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale)); + --sf-space-xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale)); + --sf-space-s: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale)); + --sf-space-m: calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale)); + --sf-space-l: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale)); + --sf-space-xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale)); + --sf-space-2xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale)); + --sf-space-3xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale)); + --sf-space-4xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale)); + } + + /* Stack & gap */ .sf-stack { display: flex; @@ -215,6 +292,32 @@ .sf-grid--dense { grid-auto-flow: dense; } + /* Grid-flex — flexbox alternative to .sf-grid for item counts that + don't divide evenly: leftover last-row items stretch to fill the + row by default, or stay fixed-width and centered with --center. + CSS Grid keeps orphans pinned to their track; flex does not. */ + .sf-grid-flex { + display: flex; + flex-wrap: wrap; + gap: var(--sf-grid-gap); + } + .sf-grid-flex > * { + flex: 1 1 min(var(--sf-grid-min), 100%); + } + + .sf-grid-flex--center { justify-content: center; } + .sf-grid-flex--center > * { + flex-grow: 0; + flex-basis: min(var(--sf-grid-min), 100%); + } + + .sf-grid-flex--xs { --sf-grid-min: var(--sf-grid-min-xs); } + .sf-grid-flex--s { --sf-grid-min: var(--sf-grid-min-s); } + .sf-grid-flex--m { --sf-grid-min: var(--sf-grid-min-m); } + .sf-grid-flex--l { --sf-grid-min: var(--sf-grid-min-l); } + .sf-grid-flex--xl { --sf-grid-min: var(--sf-grid-min-xl); } + .sf-grid-flex--2xl { --sf-grid-min: var(--sf-grid-min-2xl); } + .sf-icon { display: inline-block; inline-size: var(--sf-icon-size, var(--sf-icon-m)); @@ -287,41 +390,41 @@ /* Background layer — absolutely-positioned cover media that sits behind a parent's content. The parent is auto-promoted to a positioned, isolated - stacking context via :has(), so .sf-bg composes natively under .sf-scrim - (background → scrim gradient → content). Works as a bare + stacking context via :has(), so .sf-bg-layer composes natively under .sf-scrim + (background → scrim gradient → content). Works as a bare or as a wrapper with a nested > img / > video. */ - :where(:has(> .sf-bg)) { + :where(:has(> .sf-bg-layer)) { position: relative; isolation: isolate; } - .sf-bg { + .sf-bg-layer { position: absolute; - inset: var(--sf-bg-inset); - inline-size: calc(100% - 2 * var(--sf-bg-inset)); - block-size: calc(100% - 2 * var(--sf-bg-inset)); - object-fit: var(--sf-bg-fit); - object-position: var(--sf-bg-position); - border-radius: var(--sf-bg-radius); - z-index: var(--sf-bg-z); + inset: var(--sf-bg-layer-inset); + inline-size: calc(100% - 2 * var(--sf-bg-layer-inset)); + block-size: calc(100% - 2 * var(--sf-bg-layer-inset)); + object-fit: var(--sf-bg-layer-fit); + object-position: var(--sf-bg-layer-position); + border-radius: var(--sf-bg-layer-radius); + z-index: var(--sf-bg-layer-z); pointer-events: none; } - .sf-bg > :is(img, video, picture) { + .sf-bg-layer > :is(img, video, picture) { inline-size: 100%; block-size: 100%; - object-fit: var(--sf-bg-fit); - object-position: var(--sf-bg-position); - border-radius: var(--sf-bg-radius); + object-fit: var(--sf-bg-layer-fit); + object-position: var(--sf-bg-layer-position); + border-radius: var(--sf-bg-layer-radius); pointer-events: none; } - .sf-bg > picture > img { + .sf-bg-layer > picture > img { inline-size: 100%; block-size: 100%; - object-fit: var(--sf-bg-fit); - object-position: var(--sf-bg-position); - border-radius: var(--sf-bg-radius); + object-fit: var(--sf-bg-layer-fit); + object-position: var(--sf-bg-layer-position); + border-radius: var(--sf-bg-layer-radius); pointer-events: none; } @@ -468,7 +571,6 @@ .sf-content-grid > .sf-breakout { grid-column: breakout; } .sf-content-grid > .sf-full-bleed { grid-column: full; } - .sf-bento { display: grid; grid-template-columns: repeat(var(--sf-bento-cols, var(--sf-bento-cols-default)), 1fr); diff --git a/SLASHED-for-WP/admin-app/framework-css/core/macros.css b/SLASHED-for-WP/admin-app/framework-css/core/macros.css index ede34be7..d574b189 100644 --- a/SLASHED-for-WP/admin-app/framework-css/core/macros.css +++ b/SLASHED-for-WP/admin-app/framework-css/core/macros.css @@ -310,6 +310,22 @@ .sf-scrim--bottom { --sf-scrim-direction: to top; } .sf-scrim--full { --sf-scrim-gradient: var(--sf-scrim-color); } + /* Named background surface preset (issue #523). Composes the + --sf-surface-bg-* token set (see tokens.macros.css) into one reusable, + named background: base colour + image/gradient/pattern, sizing, an + optional overlay layered above the image, and an optional animation. + Inert until a preset feeds the tokens. The overlay is the first + background-image layer so it paints ABOVE the image. */ + .sf-surface-bg { + background-color: var(--sf-surface-bg-color); + background-image: var(--sf-surface-bg-overlay), var(--sf-surface-bg-image); + background-size: var(--sf-surface-bg-size); + background-position: var(--sf-surface-bg-position); + background-repeat: var(--sf-surface-bg-repeat); + background-attachment: var(--sf-surface-bg-attachment); + animation: var(--sf-surface-bg-animation); + } + .sf-text-protect { text-shadow: var(--sf-scrim-text-shadow); } @@ -326,6 +342,14 @@ font-size: 0.85em; text-decoration: none; } + /* Alt-text form (accessible name for the glyph) — gated so a UA that + rejects the "value / string" grammar keeps the plain marker above + instead of dropping the whole declaration. */ + @supports (content: "x" / "y") { + .sf-link-external::after { + content: var(--sf-link-external-marker) / var(--sf-link-external-label); + } + } .sf-content-auto { content-visibility: auto; @@ -338,9 +362,11 @@ /* filter: drop-shadow() utilities — unlike box-shadow, follows the element's actual alpha shape (SVG icons, PNG cutouts, transparent logos). */ - .sf-drop-shadow-s { filter: var(--sf-drop-shadow-s); } - .sf-drop-shadow-m { filter: var(--sf-drop-shadow-m); } - .sf-drop-shadow-l { filter: var(--sf-drop-shadow-l); } + .sf-drop-shadow-xs { filter: var(--sf-drop-shadow-xs); } + .sf-drop-shadow-s { filter: var(--sf-drop-shadow-s); } + .sf-drop-shadow-m { filter: var(--sf-drop-shadow-m); } + .sf-drop-shadow-l { filter: var(--sf-drop-shadow-l); } + .sf-drop-shadow-xl { filter: var(--sf-drop-shadow-xl); } .sf-link--subtle:link, .sf-link--subtle:visited { @@ -361,4 +387,54 @@ text-decoration-line: none; } + /* Concave corner — a corner that curves AWAY from the box (revealing + whatever sits behind it), via a radial-gradient mask. Physical corner + names (mask geometry has no logical form, same rationale as + .sf-overflow-fade's physical directions). Cuts the element's full + paint at that corner — box-shadow/border don't survive the cut there; + put shadows on a wrapper if needed. Named to mirror the future + `corner-shape: scoop` keyword for an easy @supports migration. */ + .sf-corner-scoop { + /* stylelint-disable-next-line property-no-vendor-prefix -- required for Safari < 18 */ + -webkit-mask-image: radial-gradient(circle at var(--sf-corner-scoop-at), + transparent var(--sf-corner-scoop-size), + black calc(var(--sf-corner-scoop-size) + 0.5px)); + mask-image: radial-gradient(circle at var(--sf-corner-scoop-at), + transparent var(--sf-corner-scoop-size), + black calc(var(--sf-corner-scoop-size) + 0.5px)); + } + .sf-corner-scoop--top-left { --sf-corner-scoop-at: 0 0; } + .sf-corner-scoop--top-right { --sf-corner-scoop-at: 100% 0; } + .sf-corner-scoop--bottom-left { --sf-corner-scoop-at: 0 100%; } + .sf-corner-scoop--bottom-right { --sf-corner-scoop-at: 100% 100%; } + + /* Overlap recipe — one element intentionally overlapping the previous + one (e.g. an image pulled up over the card below it), via a negative + logical margin + a raised stacking context. Directional variants are + standalone (margins are distinct properties, not a re-pointable knob). */ + .sf-overlap, + .sf-overlap--down, + .sf-overlap--start, + .sf-overlap--end { + position: relative; + z-index: var(--sf-z-raised); + } + .sf-overlap { margin-block-start: calc(-1 * var(--sf-overlap-pull)); } + .sf-overlap--down { margin-block-end: calc(-1 * var(--sf-overlap-pull)); } + .sf-overlap--start { margin-inline-start: calc(-1 * var(--sf-overlap-pull)); } + .sf-overlap--end { margin-inline-end: calc(-1 * var(--sf-overlap-pull)); } + + /* Card-container recipe — the receiving side of an overlap: an isolated + stacking context with block-start padding compensation so in-flow + content clears an element intruding from above. The padding knob + defaults to the pull knob so one override tunes both. */ + .sf-overlap-host { + position: relative; + isolation: isolate; + /* var() fallback resolved on this element, not pre-baked at :root — + so a local --sf-overlap-pull override (even without setting + --sf-overlap-host-pad) is honored (#496-class pitfall). */ + padding-block-start: var(--sf-overlap-host-pad, var(--sf-overlap-pull)); + } + } diff --git a/SLASHED-for-WP/admin-app/framework-css/core/themes.css b/SLASHED-for-WP/admin-app/framework-css/core/themes.css index 8f501eba..d64dd0b5 100644 --- a/SLASHED-for-WP/admin-app/framework-css/core/themes.css +++ b/SLASHED-for-WP/admin-app/framework-css/core/themes.css @@ -1,7 +1,7 @@ /* SLASHED — core/themes.css @layer slashed.themes Light/dark activation, scoped theme color inheritance, LumLocker, and scheme-aware color adjustments. - Uses data-theme and token overrides. */ + Uses data-theme, .sf-theme-light/.sf-theme-dark aliases, and token overrides. */ @layer slashed.themes { @@ -12,10 +12,10 @@ } } - [data-theme="light"] { color-scheme: light; --sf-is-dark: 0; } - [data-theme="dark"] { color-scheme: dark; --sf-is-dark: 1; } + :is([data-theme="light"], .sf-theme-light) { color-scheme: light; --sf-is-dark: 0; } + :is([data-theme="dark"], .sf-theme-dark) { color-scheme: dark; --sf-is-dark: 1; } - :where([data-theme]:not(:root, html)) { + :where([data-theme]:not(:root, html), .sf-theme-light:not(:root, html), .sf-theme-dark:not(:root, html)) { background-color: var(--sf-color-bg); color: var(--sf-color-text); } @@ -42,13 +42,13 @@ ); } - :root[data-lumlocker] [data-theme="dark"] { + :root[data-lumlocker] :is([data-theme="dark"], .sf-theme-dark) { --sf-color-primary: oklch(from var(--sf-color-primary-source-dark, var(--sf-color-primary-source-light)) var(--sf-lumlocker) c h); --sf-color-secondary: oklch(from var(--sf-color-secondary-source-dark, var(--sf-color-secondary-source-light)) var(--sf-lumlocker) c h); --sf-color-tertiary: oklch(from var(--sf-color-tertiary-source-dark, var(--sf-color-tertiary-source-light)) var(--sf-lumlocker) c h); --sf-color-action: oklch(from var(--sf-color-action-source-dark, var(--sf-color-action-source-light)) var(--sf-lumlocker) c h); } - :root[data-lumlocker] [data-theme="light"] { + :root[data-lumlocker] :is([data-theme="light"], .sf-theme-light) { --sf-color-primary: oklch(from var(--sf-color-primary-source-light) var(--sf-lumlocker) c h); --sf-color-secondary: oklch(from var(--sf-color-secondary-source-light) var(--sf-lumlocker) c h); --sf-color-tertiary: oklch(from var(--sf-color-tertiary-source-light) var(--sf-lumlocker) c h); @@ -79,7 +79,7 @@ --sf-color-danger-source-dark: oklch(from var(--sf-color-danger-source-light) clamp(0.65, calc(0.95 - l * 0.5), 0.88) calc(c * 0.9) h); } - [data-theme="dark"] { + :is([data-theme="dark"], .sf-theme-dark) { --sf-color-primary: var(--sf-color-primary-source-dark); --sf-color-secondary: var(--sf-color-secondary-source-dark); @@ -122,9 +122,22 @@ --sf-color-warning-strong: oklch(from var(--sf-color-warning) clamp(0.70, calc(l + 0.05), 1) c h); --sf-color-info-strong: oklch(from var(--sf-color-info) clamp(0.70, calc(l + 0.15), 1) c h); --sf-color-danger-strong: oklch(from var(--sf-color-danger) clamp(0.70, calc(l + 0.15), 1) c h); + + /* :root-only aliases from tokens.css — var() resolves on the declaring + element, so without these re-declarations a nested [data-theme] + section inherits the :root-resolved (wrong-scheme) values (#496). */ + --sf-color-code-bg: var(--sf-color-inset); + --sf-color-bg--disabled: var(--sf-color-inset); + --sf-color-link--disabled: var(--sf-color-text--disabled); + --sf-scrollbar-thumb: var(--sf-color-neutral); + /* Non-sign() fallback: keeps inline code readable in engines with + oklch(from) but not sign() — the sign()-gated auto-contrast block + below overrides this with a proper per-background contrast calc + wherever sign() is supported. */ + --sf-color-code-text: var(--sf-color-text); } - [data-theme="light"] { + :is([data-theme="light"], .sf-theme-light) { --sf-color-primary: var(--sf-color-primary-source-light); --sf-color-secondary: var(--sf-color-secondary-source-light); @@ -167,12 +180,20 @@ --sf-color-warning-strong: oklch(from var(--sf-color-warning-source-light) calc(l - 0.25) c h); --sf-color-info-strong: oklch(from var(--sf-color-info-source-light) calc(l - 0.1) c h); --sf-color-danger-strong: oklch(from var(--sf-color-danger-source-light) calc(l - 0.1) c h); + + /* :root-only aliases — see the matching note in the dark block (#496). */ + --sf-color-code-bg: var(--sf-color-inset); + --sf-color-bg--disabled: var(--sf-color-inset); + --sf-color-link--disabled: var(--sf-color-text--disabled); + --sf-scrollbar-thumb: var(--sf-color-neutral); + /* Non-sign() fallback — see matching note in the dark block (#496). */ + --sf-color-code-text: var(--sf-color-text); } } @supports (color: oklch(from red l c h)) and (width: calc(1px * sign(1))) { - [data-theme="dark"] { + :is([data-theme="dark"], .sf-theme-dark) { --sf-color-text--on-primary: oklch(from var(--sf-color-primary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-secondary: oklch(from var(--sf-color-secondary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-tertiary: oklch(from var(--sf-color-tertiary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); @@ -183,8 +204,12 @@ --sf-color-text--on-info: oklch(from var(--sf-color-info) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-danger: oklch(from var(--sf-color-danger) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-inverse: oklch(from var(--sf-color-inverse) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); + /* Auto-contrast code text re-derived in-scope so it tracks the + per-scope --sf-color-code-bg above (#496). Same formula as + core/tokens.css — keep in sync. */ + --sf-color-code-text: oklch(from var(--sf-color-code-bg) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); } - [data-theme="light"] { + :is([data-theme="light"], .sf-theme-light) { --sf-color-text--on-primary: oklch(from var(--sf-color-primary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-secondary: oklch(from var(--sf-color-secondary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-tertiary: oklch(from var(--sf-color-tertiary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); @@ -195,6 +220,8 @@ --sf-color-text--on-info: oklch(from var(--sf-color-info) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-danger: oklch(from var(--sf-color-danger) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-inverse: oklch(from var(--sf-color-inverse) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); + /* See matching note in the dark block (#496). */ + --sf-color-code-text: oklch(from var(--sf-color-code-bg) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); } } diff --git a/SLASHED-for-WP/admin-app/framework-css/core/tokens.css b/SLASHED-for-WP/admin-app/framework-css/core/tokens.css index 35613a14..bcea0a84 100644 --- a/SLASHED-for-WP/admin-app/framework-css/core/tokens.css +++ b/SLASHED-for-WP/admin-app/framework-css/core/tokens.css @@ -114,7 +114,7 @@ /* @property — INTERACTION STATE FLAGS */ /* PUBLIC hooks for Style Queries — safe to set from consumer code, unlike --sf-is-dark above. Allow components to react to states toggled on - ancestors via .is-* classes. */ + ancestors via .sf-is-* classes. */ @property --sf-is-active { syntax: ""; inherits: true; initial-value: 0; } @property --sf-is-current { syntax: ""; inherits: true; initial-value: 0; } @property --sf-is-pressed { syntax: ""; inherits: true; initial-value: 0; } @@ -136,6 +136,13 @@ --sf-text-display-base-min / -max --sf-text-display-s endpoints. --sf-space-ratio-min / -max modular ratio of the SPACE scale. --sf-space-base-min / -max --sf-space-m endpoints (rem, unitless). + --sf-fluid-width the length every fluid clamp() + interpolates against. Defaults to + 100vw (viewport-relative). Override + to 100cqi on a container scope to make + the type + space + display scales + container-relative — see .sf-fluid-cq + in core/layout.css (issue #497). Registered as so they can be used as pow() exponents/operands and multiplied by 1rem in calc(). Requires CSS pow() (Chrome 125+, @@ -156,6 +163,15 @@ @property --sf-space-base-min { syntax: ""; inherits: true; initial-value: 1; } @property --sf-space-base-max { syntax: ""; inherits: true; initial-value: 2; } + /* Fluid interpolation driver — the length term every fluid clamp() below + measures against. Universal syntax ("*") not "": a registered + requires a computationally-independent initial-value, and 100vw + (viewport-dependent) is not one. The real default lives on :root; an + opt-in scope (e.g. .sf-fluid-cq) overrides it to 100cqi so the whole + generative scale becomes container-relative without duplicating a single + formula. */ + @property --sf-fluid-width { syntax: "*"; inherits: true; } + /* ── Output token @property registrations ────────────────────────────────── Radius + space: syntax enables CSS transitions on layout values — border-radius/padding/gap etc. now interpolate instead of snapping. @@ -175,6 +191,7 @@ @property --sf-radius-full { syntax: ""; inherits: true; initial-value: 9999px; } @property --sf-radius-pill { syntax: ""; inherits: true; initial-value: 9999px; } @property --sf-radius-outer { syntax: ""; inherits: true; initial-value: 0; } + @property --sf-media-radius { syntax: ""; inherits: true; initial-value: 0; } @property --sf-space-none { syntax: ""; inherits: true; initial-value: 0; } @property --sf-space-px { syntax: ""; inherits: true; initial-value: 1px; } @@ -208,17 +225,22 @@ @property --sf-shadow-2xl { syntax: "*"; inherits: true; } @property --sf-shadow-inner { syntax: "*"; inherits: true; } @property --sf-text-shadow-none { syntax: "*"; inherits: true; } + @property --sf-text-shadow-xs { syntax: "*"; inherits: true; } @property --sf-text-shadow-s { syntax: "*"; inherits: true; } @property --sf-text-shadow-m { syntax: "*"; inherits: true; } @property --sf-text-shadow-l { syntax: "*"; inherits: true; } + @property --sf-text-shadow-xl { syntax: "*"; inherits: true; } + @property --sf-drop-shadow-xs { syntax: "*"; inherits: true; } @property --sf-drop-shadow-s { syntax: "*"; inherits: true; } @property --sf-drop-shadow-m { syntax: "*"; inherits: true; } @property --sf-drop-shadow-l { syntax: "*"; inherits: true; } + @property --sf-drop-shadow-xl { syntax: "*"; inherits: true; } @property --sf-shadow-glow { syntax: "*"; inherits: true; } :root { --sf-fluid-min-vw: 22.5; --sf-fluid-max-vw: 90; + --sf-fluid-width: 100vw; /* interpolation driver; 100cqi on a container scope → container-relative fluid (#497) */ --sf-text-ratio-min: 1.25; --sf-text-ratio-max: 1.333; --sf-text-base-min: 1; @@ -491,6 +513,17 @@ oklch(from var(--sf-color-action-source-dark) clamp(0.62, calc(0.93 - l * 0.4), 0.78) c h / 0.55) ); + /* Alt selection — the opposite scheme's treatment, for a surface + that deliberately inverts colours relative to the page (e.g. a + dark card on a light page) where the default pairing above + would land with poor contrast. Consumed by .sf-selection--alt + (optional/utilities.css). */ + --sf-color-selection-bg--alt: light-dark( + oklch(from var(--sf-color-action-source-dark) clamp(0.62, calc(0.93 - l * 0.4), 0.78) c h / 0.55), + oklch(from var(--sf-color-action-source-light) l c h / 0.28) + ); + --sf-color-selection-text--alt: inherit; + /* ---------------------------------------------------------- Status triplets — strong (direction-dependent, uses light-dark) danger = destructive actions, form validation errors, negative states @@ -957,7 +990,7 @@ --sf-font-weight-interactive: var(--sf-font-weight-semibold); /* buttons, badges, nav */ --sf-font-weight-strong: var(--sf-font-weight-bold); /* / emphasis */ - /* State token — consumed by .is-current in states.css. + /* State token — consumed by .sf-is-current in states.css. Override to match your nav design (e.g. semibold for thin fonts). */ --sf-current-font-weight: var(--sf-font-weight-bold); @@ -971,20 +1004,20 @@ to --sf-text-m (N=0): 2xs=-3 … 4xl=5. Override the inputs above to reshape the whole scale; override an individual --sf-text-* to pin one. ---------------------------------------------------------- */ - --sf-text-2xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale)); - --sf-text-xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale)); - --sf-text-s: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale)); - --sf-text-m: calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale)); - --sf-text-l: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale)); - --sf-text-xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale)); - --sf-text-2xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale)); - --sf-text-3xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale)); - --sf-text-4xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale)); + --sf-text-2xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale)); + --sf-text-xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale)); + --sf-text-s: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale)); + --sf-text-m: calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale)); + --sf-text-l: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale)); + --sf-text-xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale)); + --sf-text-2xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale)); + --sf-text-3xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale)); + --sf-text-4xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale)); /* Display — reuses the type ratios with its own larger base (s=0, m=1, l=2). */ - --sf-text-display-s: calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale)); - --sf-text-display-m: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale)); - --sf-text-display-l: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-s: calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-m: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-l: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale)); /* ---------------------------------------------------------- Line heights & letter spacing @@ -1109,15 +1142,15 @@ /* Spacing — fluid (generative). Same engine as type; space uses base_max=2 (more dramatic growth than type's 1.25). Step exponent N relative to --sf-space-m (N=0): 2xs=-3 … 4xl=5. */ - --sf-space-2xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale)); - --sf-space-xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale)); - --sf-space-s: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale)); - --sf-space-m: calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale)); - --sf-space-l: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale)); - --sf-space-xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale)); - --sf-space-2xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale)); - --sf-space-3xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale)); - --sf-space-4xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale)); + --sf-space-2xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale)); + --sf-space-xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale)); + --sf-space-s: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale)); + --sf-space-m: calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale)); + --sf-space-l: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale)); + --sf-space-xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale)); + --sf-space-2xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale)); + --sf-space-3xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale)); + --sf-space-4xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale)); /* ---------------------------------------------------------- UI sizes @@ -1234,6 +1267,13 @@ Maths: outer = inner + padding ⇒ aligned curves at corners. */ --sf-radius-outer: calc(var(--sf-radius-m) + var(--sf-component-pad)); + /* Opt-in global media radius — 0 by default (off). Set to a + --sf-radius-* value to round /
globally: + :root { --sf-media-radius: var(--sf-radius-m); } + Applied via :where() in core/base.css so it never fights + .sf-bg-layer or a component's own radius. */ + --sf-media-radius: 0; + /* ---------------------------------------------------------- Shadows — BEM consumer API Use in your own classes: .card { box-shadow: var(--sf-shadow-m); } @@ -1286,6 +1326,10 @@ --sf-animation-slide-in-right: sf-slide-in-right var(--sf-duration-normal) var(--sf-ease-out) both; --sf-animation-scale-up: sf-scale-up var(--sf-duration-normal) var(--sf-ease-overshoot) both; --sf-animation-scale-down: sf-scale-down var(--sf-duration-normal) var(--sf-ease-in) both; + --sf-animation-slide-out-up: sf-slide-out-up var(--sf-duration-normal) var(--sf-ease-in) both; + --sf-animation-slide-out-down: sf-slide-out-down var(--sf-duration-normal) var(--sf-ease-in) both; + --sf-animation-slide-out-left: sf-slide-out-left var(--sf-duration-normal) var(--sf-ease-in) both; + --sf-animation-slide-out-right: sf-slide-out-right var(--sf-duration-normal) var(--sf-ease-in) both; --sf-animation-color-pulse: sf-color-pulse var(--sf-duration-slow) var(--sf-ease-in-out) infinite; --sf-animation-ping: sf-ping var(--sf-duration-slow) var(--sf-ease-out) infinite; --sf-animation-blink: sf-blink calc(1s * var(--sf-motion-scale)) steps(1, end) infinite; @@ -1310,6 +1354,11 @@ --sf-scroll-timeline-range-start: entry 0%; --sf-scroll-timeline-range-end: cover 30%; + /* Exit counterpart — element is well into view before starting to + leave, finishing exactly as it scrolls fully out. */ + --sf-scroll-timeline-range-exit-start: cover 70%; + --sf-scroll-timeline-range-exit-end: exit 100%; + /* ---------------------------------------------------------- Mask scrim — edge-fade stops for scroll reels / overflow. Use in a mask-image gradient to fade content near an edge: @@ -1454,14 +1503,18 @@ Text shadows — share --sf-shadow-color / --sf-shadow-strength ---------------------------------------------------------- */ --sf-text-shadow-none: none; - --sf-text-shadow-s: 0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), 0.7)); - --sf-text-shadow-m: 0 2px 4px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), 0.7)); - --sf-text-shadow-l: 0 4px 8px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), 0.7)); - + --sf-text-shadow-xs: 0 0.5px 1px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1), 0.7)); + --sf-text-shadow-s: 0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), 0.7)); + --sf-text-shadow-m: 0 2px 4px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), 0.7)); + --sf-text-shadow-l: 0 4px 8px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), 0.7)); + --sf-text-shadow-xl: 0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), 0.7)); + /* Drop shadows — for filter: drop-shadow() (respects alpha edges) */ - --sf-drop-shadow-s: drop-shadow(0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), 0.7))); - --sf-drop-shadow-m: drop-shadow(0 4px 6px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), 0.7))); - --sf-drop-shadow-l: drop-shadow(0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), 0.7))); + --sf-drop-shadow-xs: drop-shadow(0 0.5px 1px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1), 0.7))); + --sf-drop-shadow-s: drop-shadow(0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), 0.7))); + --sf-drop-shadow-m: drop-shadow(0 4px 6px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), 0.7))); + --sf-drop-shadow-l: drop-shadow(0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), 0.7))); + --sf-drop-shadow-xl: drop-shadow(0 16px 32px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), 0.7))); } } @@ -1550,6 +1603,11 @@ link text. Override with your own glyph (include leading space if you want one): `:root { --sf-link-external-marker: " →" }`. */ --sf-link-external-marker: " \2197"; /* " ↗" — consumed by .sf-link-external */ + /* Accessible name for the marker glyph, via the CSS alt-text syntax + (`content: / `) — read by screen readers in place + of the glyph, appended after the link's own text. Localise or + disable (together with the marker) per-site. */ + --sf-link-external-label: "opens in a new window or external site"; /* ---------------------------------------------------------- Section padding diff --git a/SLASHED-for-WP/admin-app/framework-css/core/tokens.layout.css b/SLASHED-for-WP/admin-app/framework-css/core/tokens.layout.css index d81c8347..dda29819 100644 --- a/SLASHED-for-WP/admin-app/framework-css/core/tokens.layout.css +++ b/SLASHED-for-WP/admin-app/framework-css/core/tokens.layout.css @@ -84,15 +84,20 @@ --sf-frame-ratio: 16 / 9; /* literal , valid in aspect-ratio */ /* ---------------------------------------------------------- - Background layer (.sf-bg) — cover media behind sibling content. + Background layer (.sf-bg-layer) — cover media behind sibling content. inset is a single length applied to every edge; the layer size is derived from it, so a non-zero inset still fills correctly. ---------------------------------------------------------- */ - --sf-bg-inset: 0; - --sf-bg-fit: cover; - --sf-bg-position: 50% 50%; - --sf-bg-radius: 0; - --sf-bg-z: -2; /* behind content; above the parent background */ + /* 0px, not bare 0 — .sf-bg-layer's inline-size/block-size multiply this by 2 + inside a calc() alongside a percentage; a unitless 0 makes that + calc() a / type mismatch (invalid at + computed-value time), silently collapsing .sf-bg-layer to its intrinsic + size. */ + --sf-bg-layer-inset: 0px; + --sf-bg-layer-fit: cover; + --sf-bg-layer-position: 50% 50%; + --sf-bg-layer-radius: 0; + --sf-bg-layer-z: -2; /* behind content; above the parent background */ /* ---------------------------------------------------------- Icon (boxed variant) — extras for .sf-icon--boxed. diff --git a/SLASHED-for-WP/admin-app/framework-css/core/tokens.macros.css b/SLASHED-for-WP/admin-app/framework-css/core/tokens.macros.css index 29e25f10..22eb8a5c 100644 --- a/SLASHED-for-WP/admin-app/framework-css/core/tokens.macros.css +++ b/SLASHED-for-WP/admin-app/framework-css/core/tokens.macros.css @@ -94,5 +94,48 @@ shadow halo behind glyphs, consumed by .sf-text-protect. */ --sf-scrim-text-shadow: 0 1px 3px oklch(0 0 0 / 0.6); + /* ---------------------------------------------------------- + Named background surface preset — input set for the .sf-surface-bg + macro (issue #523). One reusable, named background bundling a base + colour fallback + image/gradient/pattern + sizing + an optional + overlay + an optional animation. Define a preset by setting these + on a scope, then apply .sf-surface-bg to compose them: + .hero-surface { + --sf-surface-bg-image: url("/hero.avif"); + --sf-surface-bg-overlay: var(--sf-scrim-gradient); // reuse the scrim + --sf-surface-bg-animation: sf-pan 40s linear infinite; + } +
…
+ -overlay layers ABOVE -image (first background-image layer). Builds on + the existing scrim + gradient tokens rather than new infra; for a + blurred backdrop compose .sf-scrim / a filter on top. Inert by default + (image/overlay/animation = none) so the bare class is a no-op until a + preset feeds it. ---------------------------------------------------- */ + --sf-surface-bg-color: transparent; + --sf-surface-bg-image: none; + --sf-surface-bg-overlay: none; + --sf-surface-bg-size: cover; + --sf-surface-bg-position: center; + --sf-surface-bg-repeat: no-repeat; + --sf-surface-bg-attachment: scroll; + --sf-surface-bg-animation: none; + + /* ---------------------------------------------------------- + Concave corner — radius and corner position for .sf-corner-scoop. + Override per element: style="--sf-corner-scoop-size: var(--sf-radius-3xl)" + (cut radius) or style="--sf-corner-scoop-at: 0 0" (which corner). + ---------------------------------------------------------- */ + --sf-corner-scoop-size: var(--sf-radius-2xl); + --sf-corner-scoop-at: 100% 0; + + /* ---------------------------------------------------------- + Overlap recipe — how far .sf-overlap pulls into the adjacent + element. .sf-overlap-host's padding compensation defaults to this + same value via a var() fallback in the rule itself (not aliased + here — see core/macros.css), so one override on the host tunes + both unless --sf-overlap-host-pad is set independently. + ---------------------------------------------------------- */ + --sf-overlap-pull: var(--sf-space-xl); + } } diff --git a/SLASHED-for-WP/admin-app/framework-css/badges/slashed.full.css b/SLASHED-for-WP/admin-app/framework-css/dist/slashed.full.css similarity index 78% rename from SLASHED-for-WP/admin-app/framework-css/badges/slashed.full.css rename to SLASHED-for-WP/admin-app/framework-css/dist/slashed.full.css index f98b2f27..bebf3c06 100644 --- a/SLASHED-for-WP/admin-app/framework-css/badges/slashed.full.css +++ b/SLASHED-for-WP/admin-app/framework-css/dist/slashed.full.css @@ -1,4 +1,4 @@ -/* SLASHED v0.6.34 — slashed.full.css */ +/*! SLASHED v0.7.1 — slashed.full.css | MIT License | github.com/codeslash-dev/SLASHED */ /* ─── core/layers.css ─── */ /* SLASHED — core/layers.css @@ -139,7 +139,7 @@ /* @property — INTERACTION STATE FLAGS */ /* PUBLIC hooks for Style Queries — safe to set from consumer code, unlike --sf-is-dark above. Allow components to react to states toggled on - ancestors via .is-* classes. */ + ancestors via .sf-is-* classes. */ @property --sf-is-active { syntax: ""; inherits: true; initial-value: 0; } @property --sf-is-current { syntax: ""; inherits: true; initial-value: 0; } @property --sf-is-pressed { syntax: ""; inherits: true; initial-value: 0; } @@ -161,6 +161,13 @@ --sf-text-display-base-min / -max --sf-text-display-s endpoints. --sf-space-ratio-min / -max modular ratio of the SPACE scale. --sf-space-base-min / -max --sf-space-m endpoints (rem, unitless). + --sf-fluid-width the length every fluid clamp() + interpolates against. Defaults to + 100vw (viewport-relative). Override + to 100cqi on a container scope to make + the type + space + display scales + container-relative — see .sf-fluid-cq + in core/layout.css (issue #497). Registered as so they can be used as pow() exponents/operands and multiplied by 1rem in calc(). Requires CSS pow() (Chrome 125+, @@ -181,6 +188,15 @@ @property --sf-space-base-min { syntax: ""; inherits: true; initial-value: 1; } @property --sf-space-base-max { syntax: ""; inherits: true; initial-value: 2; } + /* Fluid interpolation driver — the length term every fluid clamp() below + measures against. Universal syntax ("*") not "": a registered + requires a computationally-independent initial-value, and 100vw + (viewport-dependent) is not one. The real default lives on :root; an + opt-in scope (e.g. .sf-fluid-cq) overrides it to 100cqi so the whole + generative scale becomes container-relative without duplicating a single + formula. */ + @property --sf-fluid-width { syntax: "*"; inherits: true; } + /* ── Output token @property registrations ────────────────────────────────── Radius + space: syntax enables CSS transitions on layout values — border-radius/padding/gap etc. now interpolate instead of snapping. @@ -200,6 +216,7 @@ @property --sf-radius-full { syntax: ""; inherits: true; initial-value: 9999px; } @property --sf-radius-pill { syntax: ""; inherits: true; initial-value: 9999px; } @property --sf-radius-outer { syntax: ""; inherits: true; initial-value: 0; } + @property --sf-media-radius { syntax: ""; inherits: true; initial-value: 0; } @property --sf-space-none { syntax: ""; inherits: true; initial-value: 0; } @property --sf-space-px { syntax: ""; inherits: true; initial-value: 1px; } @@ -233,17 +250,22 @@ @property --sf-shadow-2xl { syntax: "*"; inherits: true; } @property --sf-shadow-inner { syntax: "*"; inherits: true; } @property --sf-text-shadow-none { syntax: "*"; inherits: true; } + @property --sf-text-shadow-xs { syntax: "*"; inherits: true; } @property --sf-text-shadow-s { syntax: "*"; inherits: true; } @property --sf-text-shadow-m { syntax: "*"; inherits: true; } @property --sf-text-shadow-l { syntax: "*"; inherits: true; } + @property --sf-text-shadow-xl { syntax: "*"; inherits: true; } + @property --sf-drop-shadow-xs { syntax: "*"; inherits: true; } @property --sf-drop-shadow-s { syntax: "*"; inherits: true; } @property --sf-drop-shadow-m { syntax: "*"; inherits: true; } @property --sf-drop-shadow-l { syntax: "*"; inherits: true; } + @property --sf-drop-shadow-xl { syntax: "*"; inherits: true; } @property --sf-shadow-glow { syntax: "*"; inherits: true; } :root { --sf-fluid-min-vw: 22.5; --sf-fluid-max-vw: 90; + --sf-fluid-width: 100vw; /* interpolation driver; 100cqi on a container scope → container-relative fluid (#497) */ --sf-text-ratio-min: 1.25; --sf-text-ratio-max: 1.333; --sf-text-base-min: 1; @@ -516,6 +538,17 @@ oklch(from var(--sf-color-action-source-dark) clamp(0.62, calc(0.93 - l * 0.4), 0.78) c h / 0.55) ); + /* Alt selection — the opposite scheme's treatment, for a surface + that deliberately inverts colours relative to the page (e.g. a + dark card on a light page) where the default pairing above + would land with poor contrast. Consumed by .sf-selection--alt + (optional/utilities.css). */ + --sf-color-selection-bg--alt: light-dark( + oklch(from var(--sf-color-action-source-dark) clamp(0.62, calc(0.93 - l * 0.4), 0.78) c h / 0.55), + oklch(from var(--sf-color-action-source-light) l c h / 0.28) + ); + --sf-color-selection-text--alt: inherit; + /* ---------------------------------------------------------- Status triplets — strong (direction-dependent, uses light-dark) danger = destructive actions, form validation errors, negative states @@ -982,7 +1015,7 @@ --sf-font-weight-interactive: var(--sf-font-weight-semibold); /* buttons, badges, nav */ --sf-font-weight-strong: var(--sf-font-weight-bold); /* / emphasis */ - /* State token — consumed by .is-current in states.css. + /* State token — consumed by .sf-is-current in states.css. Override to match your nav design (e.g. semibold for thin fonts). */ --sf-current-font-weight: var(--sf-font-weight-bold); @@ -996,20 +1029,20 @@ to --sf-text-m (N=0): 2xs=-3 … 4xl=5. Override the inputs above to reshape the whole scale; override an individual --sf-text-* to pin one. ---------------------------------------------------------- */ - --sf-text-2xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale)); - --sf-text-xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale)); - --sf-text-s: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale)); - --sf-text-m: calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale)); - --sf-text-l: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale)); - --sf-text-xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale)); - --sf-text-2xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale)); - --sf-text-3xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale)); - --sf-text-4xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale)); + --sf-text-2xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale)); + --sf-text-xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale)); + --sf-text-s: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale)); + --sf-text-m: calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale)); + --sf-text-l: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale)); + --sf-text-xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale)); + --sf-text-2xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale)); + --sf-text-3xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale)); + --sf-text-4xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale)); /* Display — reuses the type ratios with its own larger base (s=0, m=1, l=2). */ - --sf-text-display-s: calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale)); - --sf-text-display-m: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale)); - --sf-text-display-l: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-s: calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-m: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-l: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale)); /* ---------------------------------------------------------- Line heights & letter spacing @@ -1134,15 +1167,15 @@ /* Spacing — fluid (generative). Same engine as type; space uses base_max=2 (more dramatic growth than type's 1.25). Step exponent N relative to --sf-space-m (N=0): 2xs=-3 … 4xl=5. */ - --sf-space-2xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale)); - --sf-space-xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale)); - --sf-space-s: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale)); - --sf-space-m: calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale)); - --sf-space-l: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale)); - --sf-space-xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale)); - --sf-space-2xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale)); - --sf-space-3xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale)); - --sf-space-4xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale)); + --sf-space-2xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale)); + --sf-space-xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale)); + --sf-space-s: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale)); + --sf-space-m: calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale)); + --sf-space-l: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale)); + --sf-space-xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale)); + --sf-space-2xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale)); + --sf-space-3xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale)); + --sf-space-4xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale)); /* ---------------------------------------------------------- UI sizes @@ -1259,6 +1292,13 @@ Maths: outer = inner + padding ⇒ aligned curves at corners. */ --sf-radius-outer: calc(var(--sf-radius-m) + var(--sf-component-pad)); + /* Opt-in global media radius — 0 by default (off). Set to a + --sf-radius-* value to round /
globally: + :root { --sf-media-radius: var(--sf-radius-m); } + Applied via :where() in core/base.css so it never fights + .sf-bg-layer or a component's own radius. */ + --sf-media-radius: 0; + /* ---------------------------------------------------------- Shadows — BEM consumer API Use in your own classes: .card { box-shadow: var(--sf-shadow-m); } @@ -1311,6 +1351,10 @@ --sf-animation-slide-in-right: sf-slide-in-right var(--sf-duration-normal) var(--sf-ease-out) both; --sf-animation-scale-up: sf-scale-up var(--sf-duration-normal) var(--sf-ease-overshoot) both; --sf-animation-scale-down: sf-scale-down var(--sf-duration-normal) var(--sf-ease-in) both; + --sf-animation-slide-out-up: sf-slide-out-up var(--sf-duration-normal) var(--sf-ease-in) both; + --sf-animation-slide-out-down: sf-slide-out-down var(--sf-duration-normal) var(--sf-ease-in) both; + --sf-animation-slide-out-left: sf-slide-out-left var(--sf-duration-normal) var(--sf-ease-in) both; + --sf-animation-slide-out-right: sf-slide-out-right var(--sf-duration-normal) var(--sf-ease-in) both; --sf-animation-color-pulse: sf-color-pulse var(--sf-duration-slow) var(--sf-ease-in-out) infinite; --sf-animation-ping: sf-ping var(--sf-duration-slow) var(--sf-ease-out) infinite; --sf-animation-blink: sf-blink calc(1s * var(--sf-motion-scale)) steps(1, end) infinite; @@ -1335,6 +1379,11 @@ --sf-scroll-timeline-range-start: entry 0%; --sf-scroll-timeline-range-end: cover 30%; + /* Exit counterpart — element is well into view before starting to + leave, finishing exactly as it scrolls fully out. */ + --sf-scroll-timeline-range-exit-start: cover 70%; + --sf-scroll-timeline-range-exit-end: exit 100%; + /* ---------------------------------------------------------- Mask scrim — edge-fade stops for scroll reels / overflow. Use in a mask-image gradient to fade content near an edge: @@ -1479,14 +1528,18 @@ Text shadows — share --sf-shadow-color / --sf-shadow-strength ---------------------------------------------------------- */ --sf-text-shadow-none: none; - --sf-text-shadow-s: 0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), 0.7)); - --sf-text-shadow-m: 0 2px 4px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), 0.7)); - --sf-text-shadow-l: 0 4px 8px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), 0.7)); - + --sf-text-shadow-xs: 0 0.5px 1px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1), 0.7)); + --sf-text-shadow-s: 0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), 0.7)); + --sf-text-shadow-m: 0 2px 4px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), 0.7)); + --sf-text-shadow-l: 0 4px 8px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), 0.7)); + --sf-text-shadow-xl: 0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), 0.7)); + /* Drop shadows — for filter: drop-shadow() (respects alpha edges) */ - --sf-drop-shadow-s: drop-shadow(0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), 0.7))); - --sf-drop-shadow-m: drop-shadow(0 4px 6px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), 0.7))); - --sf-drop-shadow-l: drop-shadow(0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), 0.7))); + --sf-drop-shadow-xs: drop-shadow(0 0.5px 1px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1), 0.7))); + --sf-drop-shadow-s: drop-shadow(0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), 0.7))); + --sf-drop-shadow-m: drop-shadow(0 4px 6px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), 0.7))); + --sf-drop-shadow-l: drop-shadow(0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), 0.7))); + --sf-drop-shadow-xl: drop-shadow(0 16px 32px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), 0.7))); } } @@ -1575,6 +1628,11 @@ link text. Override with your own glyph (include leading space if you want one): `:root { --sf-link-external-marker: " →" }`. */ --sf-link-external-marker: " \2197"; /* " ↗" — consumed by .sf-link-external */ + /* Accessible name for the marker glyph, via the CSS alt-text syntax + (`content: / `) — read by screen readers in place + of the glyph, appended after the link's own text. Localise or + disable (together with the marker) per-site. */ + --sf-link-external-label: "opens in a new window or external site"; /* ---------------------------------------------------------- Section padding @@ -1737,16 +1795,19 @@ --sf-grid-min-2xl: 28rem; /* ---------------------------------------------------------- - Equal columns (intrinsically responsive RAM) - min-col-N: minimum column width for the N-column preset. - Exact column count emerges from container ÷ min-col. + Equal columns — CSS multi-column flowing layout (not grid). + Content flows between columns like a newspaper: fills one + column top-to-bottom, continues at the top of the next. + Use for FAQ lists, prose, anything that should distribute + evenly without being pinned to discrete grid cells — reach + for .sf-grid/.sf-grid--fit instead when items need their own + fixed cell. ---------------------------------------------------------- */ - --sf-equal-min-col: 16rem; - --sf-equal-min-col-2: 28rem; - --sf-equal-min-col-3: 15rem; - --sf-equal-min-col-4: 16rem; - --sf-equal-min-col-6: 10rem; + --sf-equal-min-col: 16rem; --sf-equal-gap: var(--sf-gap); + --sf-equal-rule-width: 0; + --sf-equal-rule-style: solid; + --sf-equal-rule-color: var(--sf-color-border); /* ---------------------------------------------------------- Cover @@ -1760,15 +1821,20 @@ --sf-frame-ratio: 16 / 9; /* literal , valid in aspect-ratio */ /* ---------------------------------------------------------- - Background layer (.sf-bg) — cover media behind sibling content. + Background layer (.sf-bg-layer) — cover media behind sibling content. inset is a single length applied to every edge; the layer size is derived from it, so a non-zero inset still fills correctly. ---------------------------------------------------------- */ - --sf-bg-inset: 0; - --sf-bg-fit: cover; - --sf-bg-position: 50% 50%; - --sf-bg-radius: 0; - --sf-bg-z: -2; /* behind content; above the parent background */ + /* 0px, not bare 0 — .sf-bg-layer's inline-size/block-size multiply this by 2 + inside a calc() alongside a percentage; a unitless 0 makes that + calc() a / type mismatch (invalid at + computed-value time), silently collapsing .sf-bg-layer to its intrinsic + size. */ + --sf-bg-layer-inset: 0px; + --sf-bg-layer-fit: cover; + --sf-bg-layer-position: 50% 50%; + --sf-bg-layer-radius: 0; + --sf-bg-layer-z: -2; /* behind content; above the parent background */ /* ---------------------------------------------------------- Icon (boxed variant) — extras for .sf-icon--boxed. @@ -1918,6 +1984,49 @@ shadow halo behind glyphs, consumed by .sf-text-protect. */ --sf-scrim-text-shadow: 0 1px 3px oklch(0 0 0 / 0.6); + /* ---------------------------------------------------------- + Named background surface preset — input set for the .sf-surface-bg + macro (issue #523). One reusable, named background bundling a base + colour fallback + image/gradient/pattern + sizing + an optional + overlay + an optional animation. Define a preset by setting these + on a scope, then apply .sf-surface-bg to compose them: + .hero-surface { + --sf-surface-bg-image: url("/hero.avif"); + --sf-surface-bg-overlay: var(--sf-scrim-gradient); // reuse the scrim + --sf-surface-bg-animation: sf-pan 40s linear infinite; + } +
…
+ -overlay layers ABOVE -image (first background-image layer). Builds on + the existing scrim + gradient tokens rather than new infra; for a + blurred backdrop compose .sf-scrim / a filter on top. Inert by default + (image/overlay/animation = none) so the bare class is a no-op until a + preset feeds it. ---------------------------------------------------- */ + --sf-surface-bg-color: transparent; + --sf-surface-bg-image: none; + --sf-surface-bg-overlay: none; + --sf-surface-bg-size: cover; + --sf-surface-bg-position: center; + --sf-surface-bg-repeat: no-repeat; + --sf-surface-bg-attachment: scroll; + --sf-surface-bg-animation: none; + + /* ---------------------------------------------------------- + Concave corner — radius and corner position for .sf-corner-scoop. + Override per element: style="--sf-corner-scoop-size: var(--sf-radius-3xl)" + (cut radius) or style="--sf-corner-scoop-at: 0 0" (which corner). + ---------------------------------------------------------- */ + --sf-corner-scoop-size: var(--sf-radius-2xl); + --sf-corner-scoop-at: 100% 0; + + /* ---------------------------------------------------------- + Overlap recipe — how far .sf-overlap pulls into the adjacent + element. .sf-overlap-host's padding compensation defaults to this + same value via a var() fallback in the rule itself (not aliased + here — see core/macros.css), so one override on the host tunes + both unless --sf-overlap-host-pad is set independently. + ---------------------------------------------------------- */ + --sf-overlap-pull: var(--sf-space-xl); + } } @@ -2129,6 +2238,12 @@ block-size: auto; } + /* Zero-specificity so .sf-bg-layer, .sf-frame > img, and any component's own + radius (later layer or higher specificity) always win. */ + :where(img, figure) { + border-radius: var(--sf-media-radius); + } + img, video { object-fit: var(--sf-object-fit); object-position: var(--sf-object-position); @@ -2220,7 +2335,7 @@ /* SLASHED — core/themes.css @layer slashed.themes Light/dark activation, scoped theme color inheritance, LumLocker, and scheme-aware color adjustments. - Uses data-theme and token overrides. */ + Uses data-theme, .sf-theme-light/.sf-theme-dark aliases, and token overrides. */ @layer slashed.themes { @@ -2231,10 +2346,10 @@ } } - [data-theme="light"] { color-scheme: light; --sf-is-dark: 0; } - [data-theme="dark"] { color-scheme: dark; --sf-is-dark: 1; } + :is([data-theme="light"], .sf-theme-light) { color-scheme: light; --sf-is-dark: 0; } + :is([data-theme="dark"], .sf-theme-dark) { color-scheme: dark; --sf-is-dark: 1; } - :where([data-theme]:not(:root, html)) { + :where([data-theme]:not(:root, html), .sf-theme-light:not(:root, html), .sf-theme-dark:not(:root, html)) { background-color: var(--sf-color-bg); color: var(--sf-color-text); } @@ -2261,13 +2376,13 @@ ); } - :root[data-lumlocker] [data-theme="dark"] { + :root[data-lumlocker] :is([data-theme="dark"], .sf-theme-dark) { --sf-color-primary: oklch(from var(--sf-color-primary-source-dark, var(--sf-color-primary-source-light)) var(--sf-lumlocker) c h); --sf-color-secondary: oklch(from var(--sf-color-secondary-source-dark, var(--sf-color-secondary-source-light)) var(--sf-lumlocker) c h); --sf-color-tertiary: oklch(from var(--sf-color-tertiary-source-dark, var(--sf-color-tertiary-source-light)) var(--sf-lumlocker) c h); --sf-color-action: oklch(from var(--sf-color-action-source-dark, var(--sf-color-action-source-light)) var(--sf-lumlocker) c h); } - :root[data-lumlocker] [data-theme="light"] { + :root[data-lumlocker] :is([data-theme="light"], .sf-theme-light) { --sf-color-primary: oklch(from var(--sf-color-primary-source-light) var(--sf-lumlocker) c h); --sf-color-secondary: oklch(from var(--sf-color-secondary-source-light) var(--sf-lumlocker) c h); --sf-color-tertiary: oklch(from var(--sf-color-tertiary-source-light) var(--sf-lumlocker) c h); @@ -2298,7 +2413,7 @@ --sf-color-danger-source-dark: oklch(from var(--sf-color-danger-source-light) clamp(0.65, calc(0.95 - l * 0.5), 0.88) calc(c * 0.9) h); } - [data-theme="dark"] { + :is([data-theme="dark"], .sf-theme-dark) { --sf-color-primary: var(--sf-color-primary-source-dark); --sf-color-secondary: var(--sf-color-secondary-source-dark); @@ -2341,9 +2456,22 @@ --sf-color-warning-strong: oklch(from var(--sf-color-warning) clamp(0.70, calc(l + 0.05), 1) c h); --sf-color-info-strong: oklch(from var(--sf-color-info) clamp(0.70, calc(l + 0.15), 1) c h); --sf-color-danger-strong: oklch(from var(--sf-color-danger) clamp(0.70, calc(l + 0.15), 1) c h); + + /* :root-only aliases from tokens.css — var() resolves on the declaring + element, so without these re-declarations a nested [data-theme] + section inherits the :root-resolved (wrong-scheme) values (#496). */ + --sf-color-code-bg: var(--sf-color-inset); + --sf-color-bg--disabled: var(--sf-color-inset); + --sf-color-link--disabled: var(--sf-color-text--disabled); + --sf-scrollbar-thumb: var(--sf-color-neutral); + /* Non-sign() fallback: keeps inline code readable in engines with + oklch(from) but not sign() — the sign()-gated auto-contrast block + below overrides this with a proper per-background contrast calc + wherever sign() is supported. */ + --sf-color-code-text: var(--sf-color-text); } - [data-theme="light"] { + :is([data-theme="light"], .sf-theme-light) { --sf-color-primary: var(--sf-color-primary-source-light); --sf-color-secondary: var(--sf-color-secondary-source-light); @@ -2386,12 +2514,20 @@ --sf-color-warning-strong: oklch(from var(--sf-color-warning-source-light) calc(l - 0.25) c h); --sf-color-info-strong: oklch(from var(--sf-color-info-source-light) calc(l - 0.1) c h); --sf-color-danger-strong: oklch(from var(--sf-color-danger-source-light) calc(l - 0.1) c h); + + /* :root-only aliases — see the matching note in the dark block (#496). */ + --sf-color-code-bg: var(--sf-color-inset); + --sf-color-bg--disabled: var(--sf-color-inset); + --sf-color-link--disabled: var(--sf-color-text--disabled); + --sf-scrollbar-thumb: var(--sf-color-neutral); + /* Non-sign() fallback — see matching note in the dark block (#496). */ + --sf-color-code-text: var(--sf-color-text); } } @supports (color: oklch(from red l c h)) and (width: calc(1px * sign(1))) { - [data-theme="dark"] { + :is([data-theme="dark"], .sf-theme-dark) { --sf-color-text--on-primary: oklch(from var(--sf-color-primary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-secondary: oklch(from var(--sf-color-secondary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-tertiary: oklch(from var(--sf-color-tertiary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); @@ -2402,8 +2538,12 @@ --sf-color-text--on-info: oklch(from var(--sf-color-info) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-danger: oklch(from var(--sf-color-danger) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-inverse: oklch(from var(--sf-color-inverse) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); + /* Auto-contrast code text re-derived in-scope so it tracks the + per-scope --sf-color-code-bg above (#496). Same formula as + core/tokens.css — keep in sync. */ + --sf-color-code-text: oklch(from var(--sf-color-code-bg) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); } - [data-theme="light"] { + :is([data-theme="light"], .sf-theme-light) { --sf-color-text--on-primary: oklch(from var(--sf-color-primary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-secondary: oklch(from var(--sf-color-secondary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-tertiary: oklch(from var(--sf-color-tertiary) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); @@ -2414,6 +2554,8 @@ --sf-color-text--on-info: oklch(from var(--sf-color-info) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-danger: oklch(from var(--sf-color-danger) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); --sf-color-text--on-inverse: oklch(from var(--sf-color-inverse) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); + /* See matching note in the dark block (#496). */ + --sf-color-code-text: oklch(from var(--sf-color-code-bg) clamp(0.1, sign(var(--sf-contrast-threshold) - l) * 999, 0.95) 0 0); } } @@ -2464,6 +2606,17 @@ .sf-section-group > .sf-section + .sf-section { padding-block-start: 0; } + /* Header — block padding on the standard spacing scale. Headers usually + want lighter vertical rhythm than .sf-section, so these map to + --sf-space-* directly. Only block padding is set; any inline gutter + (from .sf-section--guttered, a container, or the element itself) is + left intact. */ + .sf-header--xs { padding-block: var(--sf-space-xs); } + .sf-header--s { padding-block: var(--sf-space-s); } + .sf-header--m { padding-block: var(--sf-space-m); } + .sf-header--l { padding-block: var(--sf-space-l); } + .sf-header--xl { padding-block: var(--sf-space-xl); } + /* Collapse modifier */ .sf-section--collapse:has(+ .sf-section--collapse) { padding-block-end: calc(var(--sf-section-pad) / 2); @@ -2496,7 +2649,18 @@ background: linear-gradient(to right, transparent, var(--sf-divider-color), transparent); } - + /* Divide — rules between direct children, reusing .sf-divider's tokens. + Unlike .sf-divider (a standalone separator element), .sf-divide is + applied to the container and needs no extra markup per gap. */ + .sf-divide > * + * { + border-block-start: var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color); + } + .sf-divide--vertical > * + * { + border-block-start: none; + border-inline-start: var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color); + } + + /* Container */ .sf-container { container: sf-layout / inline-size; @@ -2516,7 +2680,62 @@ container-type: inline-size; } + /* Overlay — absolute-fill layout helper for overlays/backdrops. */ + .sf-overlay { + position: absolute; + inset: 0; + } + + /* .sf-fluid-cq: opt a subtree into a CONTAINER-relative fluid scale (issue + #497). By default --sf-text-* / --sf-space-* interpolate against 100vw (the + viewport); inside .sf-fluid-cq they interpolate against 100cqi (this box's + inline size), so type + spacing track the container the way the layout + primitives (.sf-grid-cols-*, .sf-content-grid, .sf-bento) already do. Use + on nested / narrow contexts (sidebars, cards, 1/3 columns) where a + viewport-driven scale would size text as if it spanned the full page. + + Why the tokens are RE-DECLARED (not just --sf-fluid-width flipped): the + --sf-text-* / --sf-space-* tokens are computed at :root, so their + var(--sf-fluid-width) is substituted there (100vw) and the *resolved* + length inherits down — overriding --sf-fluid-width lower in the tree can't + retroactively rewrite an already-computed inherited value. The scale is + therefore re-declared in-scope so var(--sf-fluid-width) re-resolves to + 100cqi. It is re-declared on the direct children, not the element itself: + a query container's own cq units resolve against its ANCESTOR container, so + the re-computation must happen one level in — children compute against + .sf-fluid-cq and deeper descendants inherit that resolved value. + + The formulas below are character-identical to their :root twins in + core/tokens.css (both read var(--sf-fluid-width)); keep the two copies in + sync if the generative formula ever changes (cf. themes.css SL-001). */ + .sf-fluid-cq { container-type: inline-size; } + .sf-fluid-cq > * { + --sf-fluid-width: 100cqi; + --sf-text-2xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale)); + --sf-text-xs: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale)); + --sf-text-s: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale)); + --sf-text-m: calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale)); + --sf-text-l: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale)); + --sf-text-xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale)); + --sf-text-2xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale)); + --sf-text-3xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale)); + --sf-text-4xl: calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale)); + --sf-text-display-s: calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-m: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale)); + --sf-text-display-l: calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale)); + --sf-space-2xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale)); + --sf-space-xs: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale)); + --sf-space-s: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale)); + --sf-space-m: calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale)); + --sf-space-l: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale)); + --sf-space-xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale)); + --sf-space-2xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale)); + --sf-space-3xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale)); + --sf-space-4xl: calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale)); + } + + /* Stack & gap */ .sf-stack { display: flex; @@ -2656,6 +2875,32 @@ .sf-grid--dense { grid-auto-flow: dense; } + /* Grid-flex — flexbox alternative to .sf-grid for item counts that + don't divide evenly: leftover last-row items stretch to fill the + row by default, or stay fixed-width and centered with --center. + CSS Grid keeps orphans pinned to their track; flex does not. */ + .sf-grid-flex { + display: flex; + flex-wrap: wrap; + gap: var(--sf-grid-gap); + } + .sf-grid-flex > * { + flex: 1 1 min(var(--sf-grid-min), 100%); + } + + .sf-grid-flex--center { justify-content: center; } + .sf-grid-flex--center > * { + flex-grow: 0; + flex-basis: min(var(--sf-grid-min), 100%); + } + + .sf-grid-flex--xs { --sf-grid-min: var(--sf-grid-min-xs); } + .sf-grid-flex--s { --sf-grid-min: var(--sf-grid-min-s); } + .sf-grid-flex--m { --sf-grid-min: var(--sf-grid-min-m); } + .sf-grid-flex--l { --sf-grid-min: var(--sf-grid-min-l); } + .sf-grid-flex--xl { --sf-grid-min: var(--sf-grid-min-xl); } + .sf-grid-flex--2xl { --sf-grid-min: var(--sf-grid-min-2xl); } + .sf-icon { display: inline-block; inline-size: var(--sf-icon-size, var(--sf-icon-m)); @@ -2728,41 +2973,41 @@ /* Background layer — absolutely-positioned cover media that sits behind a parent's content. The parent is auto-promoted to a positioned, isolated - stacking context via :has(), so .sf-bg composes natively under .sf-scrim - (background → scrim gradient → content). Works as a bare + stacking context via :has(), so .sf-bg-layer composes natively under .sf-scrim + (background → scrim gradient → content). Works as a bare or as a wrapper with a nested > img / > video. */ - :where(:has(> .sf-bg)) { + :where(:has(> .sf-bg-layer)) { position: relative; isolation: isolate; } - .sf-bg { + .sf-bg-layer { position: absolute; - inset: var(--sf-bg-inset); - inline-size: calc(100% - 2 * var(--sf-bg-inset)); - block-size: calc(100% - 2 * var(--sf-bg-inset)); - object-fit: var(--sf-bg-fit); - object-position: var(--sf-bg-position); - border-radius: var(--sf-bg-radius); - z-index: var(--sf-bg-z); + inset: var(--sf-bg-layer-inset); + inline-size: calc(100% - 2 * var(--sf-bg-layer-inset)); + block-size: calc(100% - 2 * var(--sf-bg-layer-inset)); + object-fit: var(--sf-bg-layer-fit); + object-position: var(--sf-bg-layer-position); + border-radius: var(--sf-bg-layer-radius); + z-index: var(--sf-bg-layer-z); pointer-events: none; } - .sf-bg > :is(img, video, picture) { + .sf-bg-layer > :is(img, video, picture) { inline-size: 100%; block-size: 100%; - object-fit: var(--sf-bg-fit); - object-position: var(--sf-bg-position); - border-radius: var(--sf-bg-radius); + object-fit: var(--sf-bg-layer-fit); + object-position: var(--sf-bg-layer-position); + border-radius: var(--sf-bg-layer-radius); pointer-events: none; } - .sf-bg > picture > img { + .sf-bg-layer > picture > img { inline-size: 100%; block-size: 100%; - object-fit: var(--sf-bg-fit); - object-position: var(--sf-bg-position); - border-radius: var(--sf-bg-radius); + object-fit: var(--sf-bg-layer-fit); + object-position: var(--sf-bg-layer-position); + border-radius: var(--sf-bg-layer-radius); pointer-events: none; } @@ -2877,14 +3122,16 @@ } .sf-equal { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(min(var(--sf-equal-min-col), 100%), 1fr)); - gap: var(--sf-equal-gap); + column-width: var(--sf-equal-min-col); + column-gap: var(--sf-equal-gap); + column-rule: var(--sf-equal-rule-width) var(--sf-equal-rule-style) var(--sf-equal-rule-color); } - .sf-equal--2 { --sf-equal-min-col: var(--sf-equal-min-col-2); } - .sf-equal--3 { --sf-equal-min-col: var(--sf-equal-min-col-3); } - .sf-equal--4 { --sf-equal-min-col: var(--sf-equal-min-col-4); } - .sf-equal--6 { --sf-equal-min-col: var(--sf-equal-min-col-6); } + .sf-equal > * { break-inside: avoid; } + + .sf-equal--2 { column-count: 2; } + .sf-equal--3 { column-count: 3; } + .sf-equal--4 { column-count: 4; } + .sf-equal--6 { column-count: 6; } .sf-content-grid { @@ -2907,7 +3154,6 @@ .sf-content-grid > .sf-breakout { grid-column: breakout; } .sf-content-grid > .sf-full-bleed { grid-column: full; } - .sf-bento { display: grid; grid-template-columns: repeat(var(--sf-bento-cols, var(--sf-bento-cols-default)), 1fr); @@ -3259,6 +3505,22 @@ .sf-scrim--bottom { --sf-scrim-direction: to top; } .sf-scrim--full { --sf-scrim-gradient: var(--sf-scrim-color); } + /* Named background surface preset (issue #523). Composes the + --sf-surface-bg-* token set (see tokens.macros.css) into one reusable, + named background: base colour + image/gradient/pattern, sizing, an + optional overlay layered above the image, and an optional animation. + Inert until a preset feeds the tokens. The overlay is the first + background-image layer so it paints ABOVE the image. */ + .sf-surface-bg { + background-color: var(--sf-surface-bg-color); + background-image: var(--sf-surface-bg-overlay), var(--sf-surface-bg-image); + background-size: var(--sf-surface-bg-size); + background-position: var(--sf-surface-bg-position); + background-repeat: var(--sf-surface-bg-repeat); + background-attachment: var(--sf-surface-bg-attachment); + animation: var(--sf-surface-bg-animation); + } + .sf-text-protect { text-shadow: var(--sf-scrim-text-shadow); } @@ -3275,6 +3537,14 @@ font-size: 0.85em; text-decoration: none; } + /* Alt-text form (accessible name for the glyph) — gated so a UA that + rejects the "value / string" grammar keeps the plain marker above + instead of dropping the whole declaration. */ + @supports (content: "x" / "y") { + .sf-link-external::after { + content: var(--sf-link-external-marker) / var(--sf-link-external-label); + } + } .sf-content-auto { content-visibility: auto; @@ -3285,6 +3555,14 @@ font-variant-numeric: var(--sf-font-numeric, tabular-nums); } + /* filter: drop-shadow() utilities — unlike box-shadow, follows the element's + actual alpha shape (SVG icons, PNG cutouts, transparent logos). */ + .sf-drop-shadow-xs { filter: var(--sf-drop-shadow-xs); } + .sf-drop-shadow-s { filter: var(--sf-drop-shadow-s); } + .sf-drop-shadow-m { filter: var(--sf-drop-shadow-m); } + .sf-drop-shadow-l { filter: var(--sf-drop-shadow-l); } + .sf-drop-shadow-xl { filter: var(--sf-drop-shadow-xl); } + .sf-link--subtle:link, .sf-link--subtle:visited { text-decoration-line: none; @@ -3304,35 +3582,85 @@ text-decoration-line: none; } + /* Concave corner — a corner that curves AWAY from the box (revealing + whatever sits behind it), via a radial-gradient mask. Physical corner + names (mask geometry has no logical form, same rationale as + .sf-overflow-fade's physical directions). Cuts the element's full + paint at that corner — box-shadow/border don't survive the cut there; + put shadows on a wrapper if needed. Named to mirror the future + `corner-shape: scoop` keyword for an easy @supports migration. */ + .sf-corner-scoop { + /* stylelint-disable-next-line property-no-vendor-prefix -- required for Safari < 18 */ + -webkit-mask-image: radial-gradient(circle at var(--sf-corner-scoop-at), + transparent var(--sf-corner-scoop-size), + black calc(var(--sf-corner-scoop-size) + 0.5px)); + mask-image: radial-gradient(circle at var(--sf-corner-scoop-at), + transparent var(--sf-corner-scoop-size), + black calc(var(--sf-corner-scoop-size) + 0.5px)); + } + .sf-corner-scoop--top-left { --sf-corner-scoop-at: 0 0; } + .sf-corner-scoop--top-right { --sf-corner-scoop-at: 100% 0; } + .sf-corner-scoop--bottom-left { --sf-corner-scoop-at: 0 100%; } + .sf-corner-scoop--bottom-right { --sf-corner-scoop-at: 100% 100%; } + + /* Overlap recipe — one element intentionally overlapping the previous + one (e.g. an image pulled up over the card below it), via a negative + logical margin + a raised stacking context. Directional variants are + standalone (margins are distinct properties, not a re-pointable knob). */ + .sf-overlap, + .sf-overlap--down, + .sf-overlap--start, + .sf-overlap--end { + position: relative; + z-index: var(--sf-z-raised); + } + .sf-overlap { margin-block-start: calc(-1 * var(--sf-overlap-pull)); } + .sf-overlap--down { margin-block-end: calc(-1 * var(--sf-overlap-pull)); } + .sf-overlap--start { margin-inline-start: calc(-1 * var(--sf-overlap-pull)); } + .sf-overlap--end { margin-inline-end: calc(-1 * var(--sf-overlap-pull)); } + + /* Card-container recipe — the receiving side of an overlap: an isolated + stacking context with block-start padding compensation so in-flow + content clears an element intruding from above. The padding knob + defaults to the pull knob so one override tunes both. */ + .sf-overlap-host { + position: relative; + isolation: isolate; + /* var() fallback resolved on this element, not pre-baked at :root — + so a local --sf-overlap-pull override (even without setting + --sf-overlap-host-pad) is honored (#496-class pitfall). */ + padding-block-start: var(--sf-overlap-host-pad, var(--sf-overlap-pull)); + } + } /* ─── core/states.css ─── */ /* SLASHED — core/states.css @layer slashed.states Generic runtime states toggled by JS or ARIA: visibility, interactivity, selection, busy/current. - Prefix: .is-*; not utilities or component-specific variants. */ + Prefix: .sf-is-*; not utilities or component-specific variants. */ @layer slashed.states { - /* VISIBILITY */ + /* -- VISIBILITY -- */ - .is-hidden { + .sf-is-hidden { display: none !important; } - .is-invisible { + .sf-is-invisible { visibility: hidden; } - .is-visible { + .sf-is-visible { visibility: visible; } - /* INTERACTIVITY */ + /* -- INTERACTIVITY -- */ /* cursor: not-allowed inherits to children with pointer-events: auto — - intentional, part of the .is-disabled API surface. */ - .is-disabled { + intentional, part of the .sf-is-disabled API surface. */ + .sf-is-disabled { opacity: var(--sf-opacity-disabled); pointer-events: none; @@ -3340,24 +3668,24 @@ user-select: none; } - .is-readonly { + .sf-is-readonly { pointer-events: none; user-select: none; } - /* LOADING / ASYNC FEEDBACK */ + /* -- LOADING / ASYNC FEEDBACK -- */ - .is-loading { + .sf-is-loading { color: transparent !important; pointer-events: none; position: relative; } - .is-loading > * { + .sf-is-loading > * { opacity: 0 !important; } - .is-loading::after { + .sf-is-loading::after { content: ""; position: absolute; inset-block-start: 50%; @@ -3373,22 +3701,22 @@ animation: var(--sf-animation-spin); } - .is-busy { + .sf-is-busy { cursor: progress; } - .is-pending { + .sf-is-pending { opacity: var(--sf-state-pending-opacity); cursor: progress; } - img.is-skeleton, - .is-skeleton img { + img.sf-is-skeleton, + .sf-is-skeleton img { opacity: 0 !important; } - .is-skeleton { + .sf-is-skeleton { color: transparent !important; background: linear-gradient( 90deg, @@ -3403,168 +3731,95 @@ user-select: none; } - /* ACTIVE / SELECTED / CURRENT */ + /* -- ACTIVE / SELECTED / CURRENT -- */ - .is-active { + .sf-is-active { --sf-is-active: 1; } - .is-selected { + .sf-is-selected { background-color: var(--sf-color-bg--selected); } - .is-current { + .sf-is-current { --sf-is-current: 1; font-weight: var(--sf-current-font-weight, var(--sf-font-weight-bold)); } - .is-highlighted { + .sf-is-highlighted { background-color: var(--sf-color-bg--focus); } - .is-pressed { + .sf-is-pressed { --sf-is-pressed: 1; background-color: var(--sf-color-bg--selected); } - /* OPEN / CLOSED */ + /* -- OPEN / CLOSED -- */ - .is-open { + .sf-is-open { --sf-is-open: 1; } - .is-collapsed { + .sf-is-collapsed { --sf-is-open: 0; } - .is-expanded { + .sf-is-expanded { --sf-is-open: 1; } - /* VALIDATION / FEEDBACK */ + /* -- VALIDATION / FEEDBACK -- */ - .is-valid, - .is-success { + .sf-is-valid, + .sf-is-success { --sf-field-border-color: var(--sf-color-success); --sf-field-text-color: var(--sf-color-success-strong); } - .is-invalid, - .is-error { + .sf-is-invalid, + .sf-is-error { --sf-field-border-color: var(--sf-color-danger); --sf-field-text-color: var(--sf-color-danger-strong); } - .is-warning { + .sf-is-warning { --sf-field-border-color: var(--sf-color-warning); --sf-field-text-color: var(--sf-color-warning-strong); } - .is-info { + .sf-is-info { --sf-field-border-color: var(--sf-color-info); --sf-field-text-color: var(--sf-color-info-strong); } - .is-danger { + .sf-is-danger { --sf-field-border-color: var(--sf-color-danger); --sf-field-text-color: var(--sf-color-danger-strong); } - /* POSITION / STICKINESS */ - - .is-sticky { - position: sticky; - inset-block-start: var(--sf-sticky-offset, 0); - z-index: var(--sf-z-sticky); - } - - .is-pinned { - position: sticky; - inset-block-start: 0; - z-index: var(--sf-z-fixed); - } - - .is-fixed { - - position: fixed; - } - - .is-fullscreen { - - position: fixed; - inset: 0; - z-index: var(--sf-z-overlay); - } - - .is-resizable { - resize: both; - overflow: auto; - min-inline-size: var(--sf-space-xl, 3.55rem); - min-block-size: var(--sf-space-xl, 3.55rem); - } - - /* OVERFLOW / CLIPPING */ + /* -- DRAG & DROP -- */ - .is-clipped { - overflow: hidden !important; - } - - .is-scrollable { - overflow: auto; - overscroll-behavior: contain; - } - - .is-truncated { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - - /* DRAG & DROP */ - - .is-dragging { + .sf-is-dragging { opacity: var(--sf-opacity-muted); cursor: grabbing; } - .is-drop-target { + .sf-is-drop-target { outline: var(--sf-focus-ring-width) dashed var(--sf-color-action); outline-offset: var(--sf-focus-ring-offset); } - .is-draggable { + .sf-is-draggable { cursor: grab; } - /* OVERLAY / BACKDROP */ - - .is-overlay { - position: absolute; - inset: 0; - } - - /* FOCUS / INTERACTION MODIFIERS */ - - .is-clickable { - cursor: pointer; - } - - .is-unselectable { - user-select: none; - } + /* -- EMPTY STATE -- */ - .is-focused { - - outline: var(--sf-focus-ring-width) var(--sf-focus-ring-style, solid) var(--sf-focus-ring-color); - outline-offset: var(--sf-focus-ring-offset); - } - - /* EMPTY STATE */ - - .is-empty:empty { + .sf-is-empty:empty { display: none; } @@ -3589,8 +3844,8 @@ a, button, input, select, textarea, summary { transition-property: color, background-color, border-color, text-decoration-color, - fill, stroke, opacity, box-shadow, transform, filter, - backdrop-filter; + fill, stroke, opacity, box-shadow, transform, scale, translate, + filter, backdrop-filter; transition-duration: var(--sf-duration-fast); transition-timing-function: var(--sf-ease-out); } @@ -3646,6 +3901,35 @@ .sf-entrance--fade-right { animation-name: sf-slide-in-right; } .sf-entrance--scale-up { animation-name: sf-scale-up; } + + /* Exit counterpart of .sf-entrance--*: fires as the element scrolls + out of view. Every declaration below lives inside @supports — + unlike entrance (where a non-scroll fallback still ends visible), + an unconditional exit animation would leave content permanently + hidden on engines without animation-timeline: view() support, so + there is deliberately no fallback declaration outside @supports. */ + @supports (animation-timeline: view()) { + .sf-exit--fade, + .sf-exit--fade-up, + .sf-exit--fade-down, + .sf-exit--fade-left, + .sf-exit--fade-right, + .sf-exit--scale-down { + animation-duration: var(--sf-duration-slow); + animation-timing-function: var(--sf-ease-in); + animation-fill-mode: both; + animation-timeline: view(); + animation-range: var(--sf-scroll-timeline-range-exit-start, cover 70%) + var(--sf-scroll-timeline-range-exit-end, exit 100%); + } + .sf-exit--fade { animation-name: sf-fade-out; } + .sf-exit--fade-up { animation-name: sf-slide-out-up; } + .sf-exit--fade-down { animation-name: sf-slide-out-down; } + .sf-exit--fade-left { animation-name: sf-slide-out-left; } + .sf-exit--fade-right { animation-name: sf-slide-out-right; } + .sf-exit--scale-down { animation-name: sf-scale-down; } + } + } @keyframes sf-fade-in { from { opacity: 0; } to { opacity: 1; } } @@ -3657,6 +3941,11 @@ @keyframes sf-scale-up { from { opacity: 0; scale: 0.92; } to { opacity: 1; scale: 1; } } @keyframes sf-scale-down { from { opacity: 1; scale: 1; } to { opacity: 0; scale: 0.92; } } + @keyframes sf-slide-out-up { from { opacity: 1; translate: 0 0; } to { opacity: 0; translate: 0 -1rem; } } + @keyframes sf-slide-out-down { from { opacity: 1; translate: 0 0; } to { opacity: 0; translate: 0 1rem; } } + @keyframes sf-slide-out-left { from { opacity: 1; translate: 0 0; } to { opacity: 0; translate: -1rem 0; } } + @keyframes sf-slide-out-right { from { opacity: 1; translate: 0 0; } to { opacity: 0; translate: 1rem 0; } } + @keyframes sf-spin { to { rotate: 360deg; } } @keyframes sf-shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } } @@ -3921,7 +4210,7 @@ color: CanvasText !important; } - .is-loading::after { + .sf-is-loading::after { border-color: ButtonText !important; border-block-start-color: Highlight !important; } @@ -3989,6 +4278,16 @@ } + /* Fluid --sf-h*-size tokens resolve via 100vw clamp()s, which have no + reliable meaning on a print page box. Pin print heading sizes to + static pt values instead. */ + h1 { font-size: 24pt; } + h2 { font-size: 20pt; } + h3 { font-size: 16pt; } + h4 { font-size: 14pt; } + h5 { font-size: 12pt; } + h6 { font-size: 11pt; } + p { orphans: 3; widows: 3; @@ -4308,8 +4607,8 @@ /* ─── optional/tokens.components.css ─── */ /* SLASHED — optional/tokens.components.css @layer slashed.tokens - Reserved component token surface for the optional component module. - Prefix: --sf-*; declarations stay commented until matching classes ship. */ + Component token surface for the optional component module: card, field, + and button knobs. Prefix: --sf-*. */ @layer slashed.tokens { :root { @@ -4317,29 +4616,31 @@ /* ============================================================ * CARD TOKENS * ============================================================ - * * Concentric radius math: outer = inner + padding. Keeps inner * elements that use the global --sf-radius-m visually - * proportional inside a padded card. - * - * --sf-card-padding: var(--sf-space-l); - * --sf-card-gap: var(--sf-space-m); - * --sf-card-radius: var(--sf-radius-m); - * --sf-card-radius-outer: calc(var(--sf-card-radius) + var(--sf-card-padding)); - * --sf-card-bg: var(--sf-color-surface); - * --sf-card-border-width: var(--sf-border-width-1); - * --sf-card-border-color: var(--sf-color-border); - * --sf-card-shadow: var(--sf-shadow-s); - * - * Smart-card subcomponents (.sf-card__media / __avatar / __title and the + * proportional inside a padded card. */ + --sf-card-padding: var(--sf-space-l); + --sf-card-gap: var(--sf-space-m); + --sf-card-radius: var(--sf-radius-m); + --sf-card-radius-outer: calc(var(--sf-card-radius) + var(--sf-card-padding)); + --sf-card-bg: var(--sf-color-surface); + --sf-card-border-width: var(--sf-border-width-1); + --sf-card-border-color: var(--sf-color-border); + --sf-card-shadow: var(--sf-shadow-s); + /* Shadow escalation for the --elevated and --interactive modifiers. + * Both default to the same --sf-shadow-l step (elevated's resting shadow + * and interactive's hover shadow read as the same "lifted" level) — two + * tokens so each modifier can still be tuned independently. */ + --sf-card-shadow--elevated: var(--sf-shadow-l); + --sf-card-shadow--hover: var(--sf-shadow-l); + + /* Smart-card subcomponents (.sf-card__media / __avatar / __title and the * scoped button font-size override). Media defaults to the 16/9 ratio - * token; inner media radius mirrors the card's inner radius. - * - * --sf-card-media-ratio: var(--sf-ratio-video); - * --sf-card-media-radius: var(--sf-card-radius, var(--sf-radius-m)); - * --sf-card-heading-size: var(--sf-text-xl); - * --sf-card-btn-font-size: var(--sf-text-s); - */ + * token; inner media radius mirrors the card's inner radius. */ + --sf-card-media-ratio: var(--sf-ratio-video); + --sf-card-media-radius: var(--sf-card-radius, var(--sf-radius-m)); + --sf-card-heading-size: var(--sf-text-xl); + --sf-card-btn-font-size: var(--sf-text-s); /* ============================================================ * FIELD TOKENS @@ -4358,12 +4659,15 @@ --sf-btn-radius: var(--sf-radius-m); --sf-btn-padding-block: var(--sf-space-xs); --sf-btn-padding-inline: var(--sf-space-m); + --sf-btn-gap: var(--sf-space-2xs); + --sf-btn-font-size: var(--sf-text-m); + --sf-btn-font-weight: var(--sf-font-weight-interactive); + --sf-btn-min-height: var(--sf-touch-target); + --sf-btn-border-width: var(--sf-border-width-1); /* - * --sf-btn-gap: var(--sf-space-2xs); - * --sf-btn-font-size: var(--sf-text-m); - * --sf-btn-font-weight: var(--sf-font-weight-interactive); - * --sf-btn-min-height: var(--sf-touch-target); - * --sf-btn-border-width: var(--sf-border-width-1); + * Size modifiers (.sf-btn--xs/--s/--l/--xl) and the colour family + * (--sf-btn-color / --sf-btn-color--hover / --sf-btn-on-color) are + * rule-local overrides set in optional/components.css, not global knobs. * * Full-width: .sf-btn--block is unconditional; .sf-btn--block-cq * stretches to 100% only inside a query container narrower than 20rem @@ -4372,117 +4676,18 @@ * there is no token for it. */ - /* ============================================================ - * BADGE TOKENS - * ============================================================ - * - * --sf-badge-pad-x: var(--sf-space-2xs); - * --sf-badge-pad-y: var(--sf-space-3xs, 0.125rem); - * --sf-badge-radius: var(--sf-radius-pill, 9999px); - * --sf-badge-font-size: var(--sf-text-2xs); - * --sf-badge-font-weight: var(--sf-font-weight-interactive); - * --sf-badge-line-height: var(--sf-leading-tight); - */ - - /* ============================================================ - * TAG TOKENS - * ============================================================ - * - * --sf-tag-pad-x: var(--sf-space-xs); - * --sf-tag-pad-y: var(--sf-space-3xs, 0.125rem); - * --sf-tag-radius: var(--sf-radius-s); - * --sf-tag-gap: var(--sf-space-2xs); - * --sf-tag-font-size: var(--sf-text-xs); - * --sf-tag-bg: var(--sf-color-inset); - * --sf-tag-border-width: var(--sf-border-width-1); - * --sf-tag-border-color: var(--sf-color-border); - */ - - /* ============================================================ - * ALERT TOKENS - * ============================================================ - * - * --sf-alert-pad: var(--sf-space-m); - * --sf-alert-radius: var(--sf-radius-m); - * --sf-alert-gap: var(--sf-space-s); - * --sf-alert-border-width: var(--sf-border-width-1); - * --sf-alert-icon-size: var(--sf-icon-m); - */ - - /* ============================================================ - * AVATAR TOKENS - * ============================================================ - * - * --sf-avatar-size: 2.5rem; - * --sf-avatar-radius: var(--sf-radius-full, 50%); - * --sf-avatar-bg: var(--sf-color-inset); - * --sf-avatar-font-weight: var(--sf-font-weight-semibold); - * --sf-avatar-border-width: 0; - * --sf-avatar-border-color: var(--sf-color-border); - */ - - /* ============================================================ - * MODAL TOKENS - * ============================================================ - * - * --sf-modal-pad: var(--sf-space-l); - * --sf-modal-gap: var(--sf-space-m); - * --sf-modal-radius: var(--sf-radius-l); - * --sf-modal-max-inline: min(90vw, 32rem); - * --sf-modal-bg: var(--sf-color-surface); - * --sf-modal-shadow: var(--sf-shadow-xl); - * --sf-modal-backdrop-bg: color-mix(in oklab, var(--sf-color-neutral) 60%, transparent); - * --sf-modal-z: var(--sf-z-modal); - */ - - /* ============================================================ - * SKELETON TOKENS - * ============================================================ - * - * --sf-skeleton-bg: var(--sf-color-inset); - * --sf-skeleton-shimmer: var(--sf-color-raised); - * --sf-skeleton-radius: var(--sf-radius-s); - * --sf-skeleton-duration: 1.5s; - * --sf-skeleton-line-height: 0.8em; - */ - - /* ============================================================ - * FORM LAYOUT HELPER TOKENS - * Gap tokens for .sf-field, .sf-form-row, .sf-form-col, - * and .sf-form-inline declared in optional/components.css. - * ============================================================ - * - * --sf-field-gap: var(--sf-space-2xs); - * --sf-form-row-gap: var(--sf-space-m); - * --sf-form-col-gap: var(--sf-space-s); - * --sf-form-inline-gap: var(--sf-space-s); - */ - - /* ============================================================ - * TABLE TOKENS - * Sizing tokens for .sf-table declared in - * optional/components.css. - * ============================================================ - * - * --sf-table-cell-pad-block: var(--sf-space-xs); - * --sf-table-cell-pad-inline: var(--sf-space-s); - * --sf-table-border-color: var(--sf-color-border); - * --sf-table-stripe-bg: var(--sf-color-inset); - * --sf-table-header-weight: var(--sf-font-weight-semibold); - * --sf-table-compact-pad: var(--sf-space-3xs, 0.125rem); - */ - } } /* ─── optional/components.css ─── */ /* SLASHED — optional/components.css @layer slashed.components - Reserved component class surface for button, card, badge, tag, alert, - avatar, modal, skeleton, form layout helpers, and table. + Component class surface: button and card. - STAGED — all definitions are commented out until v0.8. - Imports optional component tokens (tokens are live where noted). */ + .sf-btn and .sf-card are LIVE since v0.7.0. These are the only two + components SLASHED ships — the framework stays BEM-first and token-first + and does not carry a broad component library. + Imports optional component tokens. */ @layer slashed.components { @@ -4490,21 +4695,37 @@ /* ============================================================ * .sf-btn * Interactive call-to-action element. Apply to {/if} - {#if showRaw && rawDefault} + {#if showPicker} + + {:else if showRawText} { isEditing = true; }} + onfocus={() => { isEditingRaw = true; }} onblur={() => { - isEditing = false; - if (!rawDraft.trim()) onReset(); + isEditingRaw = false; + const v = rawDraft.trim(); + if (!v) backToVariable(); + else onRawSet?.(v); + }} + onkeydown={(e) => { + if (e.key === "Enter") (e.currentTarget as HTMLInputElement).blur(); }} oninput={(e) => { rawDraft = (e.target as HTMLInputElement).value; - const v = rawDraft.trim(); - if (v && onRawSet) onRawSet(v); }} - class="w-full bg-black/5 dark:bg-white/5 border border-black/10 dark:border-white/10 rounded px-2 py-1.5 text-[11px] font-mono text-slate-700 dark:text-slate-300 placeholder:text-slate-500 focus:outline-none focus:border-indigo-500" + class="w-full bg-black/8 dark:bg-white/8 border border-indigo-500/50 rounded px-2 py-1.5 text-[11px] font-mono text-slate-700 dark:text-slate-300 placeholder:text-slate-500 focus:outline-none" /> + {#if canPick} + + {/if} {:else} - {#if rawDefault && !overridden} -

default: {rawDefault}

+ {#if hasVarInfo} + {#if canPick || currentRaw !== undefined} + + {:else} +

default: {rawDefault}

+ {/if} {/if} {/if} diff --git a/SLASHED-for-WP/admin-app/src/components/panels/BordersPanel.svelte b/SLASHED-for-WP/admin-app/src/components/panels/BordersPanel.svelte index f480d283..f018e8d8 100644 --- a/SLASHED-for-WP/admin-app/src/components/panels/BordersPanel.svelte +++ b/SLASHED-for-WP/admin-app/src/components/panels/BordersPanel.svelte @@ -3,6 +3,7 @@ import PowerKnobRow from '../inputs/PowerKnobRow.svelte'; import SliderRow from '../inputs/SliderRow.svelte'; import ColorInput from '../inputs/ColorInput.svelte'; + import { SPACE_SCALE, RADIUS_SCALE, BORDER_WIDTH_SCALE, type VarOption } from '../../lib/variableScales'; let { overrides, onSet, onReset }: { overrides: Record; @@ -23,13 +24,10 @@ { step: "2xl", name: "--sf-radius-2xl", default: 24, max: 80, step_size: 2, rawDefault: "calc(24px * var(--sf-radius-scale))" }, ]; - const COMPONENT_TOKENS = [ - { label: "Button radius", token: "--sf-btn-radius", unit: "rem", min: 0, max: 2, step: 0.05, default: 0.5, rawDefault: "var(--sf-radius-m)", help: "--sf-btn-radius" }, - { label: "Button padding block", token: "--sf-btn-padding-block", unit: "rem", min: 0, max: 1, step: 0.025, default: 0.375, rawDefault: "var(--sf-space-xs)", help: "--sf-btn-padding-block" }, - { label: "Button padding inline", token: "--sf-btn-padding-inline", unit: "rem", min: 0, max: 2, step: 0.025, default: 1, rawDefault: "var(--sf-space-m)", help: "--sf-btn-padding-inline" }, - { label: "Field radius", token: "--sf-field-radius", unit: "rem", min: 0, max: 2, step: 0.05, default: 0.5, rawDefault: "var(--sf-radius-m)", help: "--sf-field-radius" }, - { label: "Field padding block", token: "--sf-field-padding-block", unit: "rem", min: 0, max: 1, step: 0.025, default: 0.375, rawDefault: "var(--sf-space-xs)", help: "--sf-field-padding-block" }, - { label: "Field padding inline", token: "--sf-field-padding-inline", unit: "rem", min: 0, max: 2, step: 0.025, default: 0.75, rawDefault: "var(--sf-space-s)", help: "--sf-field-padding-inline" }, + const COMPONENT_TOKENS: Array<{ label: string; token: string; unit: string; min: number; max: number; step: number; default: number; rawDefault: string; help: string; variableOptions: VarOption[] }> = [ + { label: "Field radius", token: "--sf-field-radius", unit: "rem", min: 0, max: 2, step: 0.05, default: 0.5, rawDefault: "var(--sf-radius-m)", help: "--sf-field-radius", variableOptions: RADIUS_SCALE }, + { label: "Field padding block", token: "--sf-field-padding-block", unit: "rem", min: 0, max: 1, step: 0.025, default: 0.375, rawDefault: "var(--sf-space-xs)", help: "--sf-field-padding-block", variableOptions: SPACE_SCALE }, + { label: "Field padding inline", token: "--sf-field-padding-inline", unit: "rem", min: 0, max: 2, step: 0.025, default: 0.75, rawDefault: "var(--sf-space-s)", help: "--sf-field-padding-inline", variableOptions: SPACE_SCALE }, ]; const knobs = KNOBS_BY_DOMAIN["borders"] ?? []; @@ -41,8 +39,9 @@ let showFocusRing = $state(false); let showRadiusScale = $state(false); let showRadiusPreview = $state(false); + let showMediaRadius = $state(false); let showFineTune = $state(false); - let showComponents = $state(false); + let showFieldShape = $state(false); function parseNum(val: string | undefined, fallback: number, strip?: string): number { if (!val) return fallback; @@ -60,6 +59,7 @@ let borderStyle = $derived(overrides["--sf-border-style"] ?? "solid"); let focusRingColor = $derived(overrides["--sf-focus-ring-color"] ?? ""); let dividerColor = $derived(overrides["--sf-divider-color"] ?? ""); + let mediaRadius = $derived(parseNum(overrides["--sf-media-radius"]?.replace("rem",""), 0)); function getStyleCurrent(tokenName: string, defaultVal: string): string { return overrides[tokenName] ?? defaultVal; @@ -246,6 +246,7 @@ onChange={(v) => onSet("--sf-divider-width", `${v}px`)} onReset={() => onReset("--sf-divider-width")} rawDefault="var(--sf-border-width-1)" + variableOptions={BORDER_WIDTH_SCALE} currentRaw={overrides["--sf-divider-width"]} onRawSet={(v) => onSet("--sf-divider-width", v)} /> @@ -256,6 +257,7 @@ onChange={(v) => onSet("--sf-divider-gap", `${v}rem`)} onReset={() => onReset("--sf-divider-gap")} rawDefault="var(--sf-space-m)" + variableOptions={SPACE_SCALE} currentRaw={overrides["--sf-divider-gap"]} onRawSet={(v) => onSet("--sf-divider-gap", v)} /> @@ -380,17 +382,54 @@
- + +
+ + {#if showMediaRadius} +

+ --sf-media-radius — 0 by default (off). Rounds every <img>/<figure> globally via a + zero-specificity :where() rule; .sf-bg-layer and component-level radii still win. +

+ onSet("--sf-media-radius", `${v}rem`)} + onReset={() => onReset("--sf-media-radius")} + rawDefault="var(--sf-radius-m)" + variableOptions={RADIUS_SCALE} + currentRaw={overrides["--sf-media-radius"]} + onRawSet={(v) => onSet("--sf-media-radius", v)} + /> +
+
+
+ {/if} +
+ +
+ +
- {#if showComponents} + {#if showFieldShape}
{#each COMPONENT_TOKENS as t (t.token)} onSet(t.token, `${v}${t.unit}`)} onReset={() => onReset(t.token)} rawDefault={t.rawDefault} + variableOptions={t.variableOptions} currentRaw={overrides[t.token]} onRawSet={(v) => onSet(t.token, v)} /> diff --git a/SLASHED-for-WP/admin-app/src/components/panels/ComponentsPanel.svelte b/SLASHED-for-WP/admin-app/src/components/panels/ComponentsPanel.svelte new file mode 100644 index 00000000..e632a0d7 --- /dev/null +++ b/SLASHED-for-WP/admin-app/src/components/panels/ComponentsPanel.svelte @@ -0,0 +1,464 @@ + + +
+ + +
+ + {#if showButton} + +
+
Variant (preview only)
+
+ {#each BTN_VARIANTS as v (v)} + + {/each} +
+
Style
+
+ {#each BTN_STYLES as s (s.id)} + + {/each} +
+
Size
+
+ {#each BTN_SIZES as s (s)} + + {/each} +
+
+ + +
+
+ + +
+ +
+ +
+ {#each BUTTON_TOKENS as t (t.token)} + onSet(t.token, `${v}${t.unit}`)} + onReset={() => onReset(t.token)} + rawDefault={t.rawDefault} + variableOptions={t.variableOptions} + currentRaw={overrides[t.token]} + onRawSet={(v) => onSet(t.token, v)} + /> + {/each} + +
+
Label size — --sf-btn-font-size
+
+ {#each TEXT_STEPS as step (step)} + {@const cur = currentStep("--sf-btn-font-size", "text", TEXT_STEPS, "m")} + + {/each} +
+
+ +
+
Label weight — --sf-btn-font-weight
+
+ {#each WEIGHT_OPTIONS as w (w)} + {@const cur = overrides["--sf-btn-font-weight"] ?? "600"} + + {/each} +
+
+
+ {/if} +
+ +
+ + +
+ + {#if showCard} +
+ + + +
+ + +
+
+
+
+

Card title

+
+
+

Body copy showing padding, gap, and background live.

+
+
+ +
+
+
+ +
+ {#each CARD_TOKENS as t (t.token)} + onSet(t.token, `${v}${t.unit}`)} + onReset={() => onReset(t.token)} + rawDefault={t.rawDefault} + variableOptions={t.variableOptions} + currentRaw={overrides[t.token]} + onRawSet={(v) => onSet(t.token, v)} + /> + {/each} + +
+ Radius (outer, computed) + {(cardRadius + cardPadding).toFixed(2)}rem +
+

+ --sf-card-radius-outer = radius + padding (concentric math) — not independently overridable, always computed from the two sliders above. +

+ +
+
Background — --sf-card-bg
+
+ {#each BG_PRESETS as p (p.step)} + {@const cur = currentStep("--sf-card-bg", "color", BG_PRESETS.map(x => x.step), "surface")} + + {/each} +
+
+ +
+
Border color — --sf-card-border-color
+
+ {#each BORDER_PRESETS as p (p.step)} + {@const cur = currentStep("--sf-card-border-color", "color", BORDER_PRESETS.map(x => x.step), "border")} + + {/each} +
+
+ +
+
Shadow — --sf-card-shadow
+
+ {#each SHADOW_STEPS as step (step)} + {@const cur = currentStep("--sf-card-shadow", "shadow", SHADOW_STEPS, "s")} + + {/each} +
+
+ +
+
Elevated shadow — --sf-card-shadow--elevated
+
+ {#each SHADOW_STEPS as step (step)} + {@const cur = currentStep("--sf-card-shadow--elevated", "shadow", SHADOW_STEPS, "l")} + + {/each} +
+
+ +
+
Hover shadow (interactive) — --sf-card-shadow--hover
+
+ {#each SHADOW_STEPS as step (step)} + {@const cur = currentStep("--sf-card-shadow--hover", "shadow", SHADOW_STEPS, "l")} + + {/each} +
+
+ +
+
Media aspect ratio — --sf-card-media-ratio
+
+ {#each RATIO_STEPS as step (step)} + {@const cur = currentStep("--sf-card-media-ratio", "ratio", RATIO_STEPS, "video")} + + {/each} +
+
+ +
+
Title size — --sf-card-heading-size
+
+ {#each TEXT_STEPS as step (step)} + {@const cur = currentStep("--sf-card-heading-size", "text", TEXT_STEPS, "xl")} + + {/each} +
+
+ +
+
Nested button size — --sf-card-btn-font-size
+
+ {#each TEXT_STEPS as step (step)} + {@const cur = currentStep("--sf-card-btn-font-size", "text", TEXT_STEPS, "s")} + + {/each} +
+
+ +
+
Media object-fit — --sf-object-fit (global, affects all img/video)
+
+ {#each ["cover", "contain"] as fit (fit)} + {@const cur = overrides["--sf-object-fit"] ?? "cover"} + + {/each} +
+
+
+ {/if} +
+
diff --git a/SLASHED-for-WP/admin-app/src/components/panels/EffectsPanel.svelte b/SLASHED-for-WP/admin-app/src/components/panels/EffectsPanel.svelte index 338fa6c2..d9ca4727 100644 --- a/SLASHED-for-WP/admin-app/src/components/panels/EffectsPanel.svelte +++ b/SLASHED-for-WP/admin-app/src/components/panels/EffectsPanel.svelte @@ -16,11 +16,15 @@ ]; const TEXT_SHADOW_TOKENS = [ - { label: "Small", token: "--sf-text-shadow-s", default: "0 1px 2px oklch(…)" }, - { label: "Medium", token: "--sf-text-shadow-m", default: "0 2px 4px oklch(…)" }, - { label: "Large", token: "--sf-text-shadow-l", default: "0 4px 8px oklch(…)" }, + { label: "Extra small", token: "--sf-text-shadow-xs", default: "0 0.5px 1px oklch(…)" }, + { label: "Small", token: "--sf-text-shadow-s", default: "0 1px 2px oklch(…)" }, + { label: "Medium", token: "--sf-text-shadow-m", default: "0 2px 4px oklch(…)" }, + { label: "Large", token: "--sf-text-shadow-l", default: "0 4px 8px oklch(…)" }, + { label: "Extra large", token: "--sf-text-shadow-xl", default: "0 8px 16px oklch(…)" }, ]; + const DROP_SHADOW_STEPS = ["xs", "s", "m", "l", "xl"]; + function parseNum(val: string | undefined, fallback: number, strip?: string): number { if (!val) return fallback; const v = parseFloat(strip ? val.replace(strip, "") : val); @@ -43,6 +47,7 @@ let showScrollbar = $state(false); let showScrollShadow = $state(false); let showTextShadow = $state(false); + let showDropShadow = $state(false);
@@ -286,8 +291,54 @@ placeholder={t.default} oninput={(e) => { const v = (e.target as HTMLInputElement).value; - const trimmed = v.trim(); - trimmed ? onSet(t.token, trimmed) : onReset(t.token); + v.trim() ? onSet(t.token, v) : onReset(t.token); + }} + class="flex-1 min-w-0 bg-black/5 dark:bg-white/5 border border-black/10 dark:border-white/10 rounded px-1.5 py-1 text-[9px] font-mono text-slate-700 dark:text-slate-300 placeholder:text-slate-600 focus:outline-none focus:border-indigo-500" + /> + {#if t.token in overrides} + + {/if} +
+ {/each} +
+ {/if} + + +
+ + +
+ + {#if showDropShadow} +

+ filter: drop-shadow(…) — unlike box-shadow, follows the + element's actual alpha shape (SVG icons, PNG cutouts, transparent logos). Edit each token directly — + use none to disable. +

+
+ {#each [ + { label: "Extra small", token: "--sf-drop-shadow-xs", default: "drop-shadow(0 0.5px 1px oklch(…))" }, + { label: "Small", token: "--sf-drop-shadow-s", default: "drop-shadow(0 1px 2px oklch(…))" }, + { label: "Medium", token: "--sf-drop-shadow-m", default: "drop-shadow(0 4px 6px oklch(…))" }, + { label: "Large", token: "--sf-drop-shadow-l", default: "drop-shadow(0 8px 16px oklch(…))" }, + { label: "Extra large", token: "--sf-drop-shadow-xl", default: "drop-shadow(0 16px 32px oklch(…))" }, + ] as t (t.token)} +
+
{t.label}
+ { + const v = (e.target as HTMLInputElement).value; + v.trim() ? onSet(t.token, v) : onReset(t.token); }} class="flex-1 min-w-0 bg-black/5 dark:bg-white/5 border border-black/10 dark:border-white/10 rounded px-1.5 py-1 text-[9px] font-mono text-slate-700 dark:text-slate-300 placeholder:text-slate-600 focus:outline-none focus:border-indigo-500" /> @@ -297,6 +348,18 @@
{/each}
+ + +
+ {#each DROP_SHADOW_STEPS as step (step)} +
+ + {step} +
+ {/each} +
{/if}
diff --git a/SLASHED-for-WP/admin-app/src/components/panels/HomePanel.svelte b/SLASHED-for-WP/admin-app/src/components/panels/HomePanel.svelte index 6edb5ffc..0078d853 100644 --- a/SLASHED-for-WP/admin-app/src/components/panels/HomePanel.svelte +++ b/SLASHED-for-WP/admin-app/src/components/panels/HomePanel.svelte @@ -1,10 +1,11 @@
@@ -300,7 +314,7 @@
Radius (outer, computed) - {(cardRadius + cardPadding).toFixed(2)}rem + {outerRadiusUnknown ? "depends on variable" : `${(cardRadius + cardPadding).toFixed(2)}rem`}

--sf-card-radius-outer = radius + padding (concentric math) — not independently overridable, always computed from the two sliders above. diff --git a/SLASHED-for-WP/assets/admin-app/app.css b/SLASHED-for-WP/assets/admin-app/app.css index 8a4e3725..13e844df 100644 --- a/SLASHED-for-WP/assets/admin-app/app.css +++ b/SLASHED-for-WP/assets/admin-app/app.css @@ -1,3 +1,3 @@ /*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */ -@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-100:#ffe2e2;--color-red-300:#ffa3a3;--color-red-400:#ff6568;--color-red-500:#fb2c36;--color-red-700:#bf000f;--color-red-900:#82181a;--color-orange-400:#ff8b1a;--color-orange-600:#f05100;--color-amber-300:#ffd236;--color-amber-400:#fcbb00;--color-amber-500:#f99c00;--color-amber-600:#dd7400;--color-amber-700:#b75000;--color-emerald-100:#d0fae5;--color-emerald-200:#a4f4cf;--color-emerald-300:#5ee9b5;--color-emerald-400:#00d294;--color-emerald-500:#00bb7f;--color-emerald-600:#009767;--color-emerald-700:#007956;--color-emerald-800:#005f46;--color-emerald-900:#004e3b;--color-teal-400:#00d3bd;--color-teal-600:#009588;--color-sky-400:#00bcfe;--color-sky-600:#0084cc;--color-blue-500:#3080ff;--color-indigo-200:#c7d2ff;--color-indigo-300:#a4b3ff;--color-indigo-400:#7d87ff;--color-indigo-500:#625fff;--color-indigo-600:#4f39f6;--color-indigo-700:#432dd7;--color-indigo-800:#372aac;--color-violet-400:#a685ff;--color-violet-600:#7f22fe;--color-purple-500:#ac4bff;--color-purple-600:#9810fa;--color-pink-400:#fb64b6;--color-pink-600:#e30076;--color-rose-300:#ffa2ae;--color-rose-400:#ff667f;--color-rose-500:#ff2357;--color-rose-600:#e70044;--color-rose-700:#c20039;--color-rose-800:#a30037;--color-slate-50:#f8fafc;--color-slate-100:#f1f5f9;--color-slate-200:#e2e8f0;--color-slate-300:#cad5e2;--color-slate-400:#90a1b9;--color-slate-500:#62748e;--color-slate-600:#45556c;--color-slate-700:#314158;--color-slate-800:#1d293d;--color-slate-900:#0f172b;--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-black:900;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-widest:.1em;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--ease-in-out:cubic-bezier(.4, 0, .2, 1);--animate-spin:spin 1s linear infinite;--blur-sm:8px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--color-red-100:lab(92.243% 10.2865 3.83865);--color-red-300:lab(76.5514% 36.422 15.5335);--color-red-400:lab(63.7053% 60.745 31.3109);--color-red-500:lab(55.4814% 75.0732 48.8528);--color-red-700:lab(40.4273% 67.2623 53.7441);--color-red-900:lab(28.5139% 44.5539 29.0463);--color-orange-400:lab(70.0429% 42.5156 75.8207);--color-orange-600:lab(57.1026% 64.2584 89.8886);--color-amber-300:lab(86.4156% 6.13147 78.3961);--color-amber-400:lab(80.1641% 16.6016 99.2089);--color-amber-500:lab(72.7183% 31.8672 97.9407);--color-amber-600:lab(60.3514% 40.5624 87.1228);--color-amber-700:lab(47.2709% 42.9082 69.2966);--color-emerald-100:lab(94.9004% -17.0769 5.63836);--color-emerald-200:lab(90.2247% -31.039 9.47084);--color-emerald-300:lab(83.9203% -48.7124 13.8849);--color-emerald-400:lab(75.0771% -60.7313 19.4147);--color-emerald-500:lab(66.9756% -58.27 19.5419);--color-emerald-600:lab(55.0481% -49.9246 15.93);--color-emerald-700:lab(44.4871% -41.0396 11.0361);--color-emerald-800:lab(35.3675% -33.1188 8.04002);--color-emerald-900:lab(28.8637% -26.9249 5.45986);--color-teal-400:lab(76.0109% -53.3483 -2.27906);--color-teal-600:lab(55.0223% -41.0774 -3.90277);--color-sky-400:lab(70.687% -23.6078 -45.9483);--color-sky-600:lab(51.7754% -11.4712 -49.8349);--color-blue-500:lab(54.1736% 13.3369 -74.6839);--color-indigo-200:lab(84.4329% 3.18977 -23.9688);--color-indigo-300:lab(74.0235% 8.54138 -41.6075);--color-indigo-400:lab(59.866% 22.4834 -64.4485);--color-indigo-500:lab(48.295% 38.3129 -81.9673);--color-indigo-600:lab(38.4009% 52.6132 -92.3857);--color-indigo-700:lab(32.4486% 49.2217 -84.6695);--color-indigo-800:lab(26.6645% 37.9804 -68.6402);--color-violet-400:lab(62.8239% 34.9159 -60.0512);--color-violet-600:lab(41.088% 68.9966 -91.995);--color-purple-500:lab(52.0183% 66.11 -78.2316);--color-purple-600:lab(43.0295% 75.21 -86.5669);--color-pink-400:lab(64.5597% 64.3615 -12.7988);--color-pink-600:lab(49.5493% 79.8381 2.31768);--color-rose-300:lab(76.6339% 38.3549 9.68835);--color-rose-400:lab(64.4125% 63.0291 19.2068);--color-rose-500:lab(56.101% 79.4328 31.4532);--color-rose-600:lab(49.1882% 81.577 36.0311);--color-rose-700:lab(41.1651% 71.6251 30.3087);--color-rose-800:lab(34.6481% 60.802 20.1957);--color-slate-50:lab(98.1434% -.369519 -1.05966);--color-slate-100:lab(96.286% -.852436 -2.46847);--color-slate-200:lab(91.7353% -.998765 -4.76968);--color-slate-300:lab(84.7652% -1.94535 -7.93337);--color-slate-400:lab(65.5349% -2.25151 -14.5072);--color-slate-500:lab(48.0876% -2.03595 -16.5814);--color-slate-600:lab(35.5623% -1.74978 -15.4316);--color-slate-700:lab(26.9569% -1.47016 -15.6993);--color-slate-800:lab(16.132% -.318035 -14.6672);--color-slate-900:lab(7.78673% 1.82345 -15.0537)}}}@layer base{*,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.\@container{container-type:inline-size}.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.inset-x-0{inset-inline:0}.-top-0\.5{top:calc(var(--spacing) * -.5)}.top-0{top:0}.top-0\.5{top:calc(var(--spacing) * .5)}.top-1{top:var(--spacing)}.top-2{top:calc(var(--spacing) * 2)}.-right-0\.5{right:calc(var(--spacing) * -.5)}.right-0{right:0}.right-0\.5{right:calc(var(--spacing) * .5)}.right-2{right:calc(var(--spacing) * 2)}.bottom-0{bottom:0}.bottom-2{bottom:calc(var(--spacing) * 2)}.bottom-full{bottom:100%}.left-0{left:0}.left-1\/2{left:50%}.left-3{left:calc(var(--spacing) * 3)}.left-12{left:calc(var(--spacing) * 12)}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.z-\[100\]{z-index:100}.z-\[99998\]{z-index:99998}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mx-0\.5{margin-inline:calc(var(--spacing) * .5)}.mx-1{margin-inline:var(--spacing)}.mx-4{margin-inline:calc(var(--spacing) * 4)}.mx-auto{margin-inline:auto}.my-1{margin-block:var(--spacing)}.my-2{margin-block:calc(var(--spacing) * 2)}.-mt-px{margin-top:-1px}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mb-0\.5{margin-bottom:calc(var(--spacing) * .5)}.mb-1{margin-bottom:var(--spacing)}.mb-1\.5{margin-bottom:calc(var(--spacing) * 1.5)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.ml-0\.5{margin-left:calc(var(--spacing) * .5)}.ml-1{margin-left:var(--spacing)}.ml-auto{margin-left:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.list-item{display:list-item}.table{display:table}.h-1{height:var(--spacing)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-16{height:calc(var(--spacing) * 16)}.h-20{height:calc(var(--spacing) * 20)}.h-24{height:calc(var(--spacing) * 24)}.h-\[52px\]{height:52px}.h-full{height:100%}.h-px{height:1px}.h-screen{height:100vh}.max-h-80{max-height:calc(var(--spacing) * 80)}.max-h-\[360px\]{max-height:360px}.min-h-0{min-height:0}.min-h-10{min-height:calc(var(--spacing) * 10)}.min-h-\[34px\]{min-height:34px}.w-0\.5{width:calc(var(--spacing) * .5)}.w-1{width:var(--spacing)}.w-1\.5{width:calc(var(--spacing) * 1.5)}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-9{width:calc(var(--spacing) * 9)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-14{width:calc(var(--spacing) * 14)}.w-16{width:calc(var(--spacing) * 16)}.w-20{width:calc(var(--spacing) * 20)}.w-24{width:calc(var(--spacing) * 24)}.w-28{width:calc(var(--spacing) * 28)}.w-\[560px\]{width:560px}.w-full{width:100%}.w-px{width:1px}.w-screen{width:100vw}.max-w-28{max-width:calc(var(--spacing) * 28)}.max-w-\[95vw\]{max-width:95vw}.max-w-\[100px\]{max-width:100px}.max-w-\[320px\]{max-width:320px}.max-w-full{max-width:100%}.max-w-sm{max-width:var(--container-sm)}.min-w-0{min-width:0}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.border-collapse{border-collapse:collapse}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-0{--tw-translate-x:0;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-0\.5{--tw-translate-x:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-4{--tw-translate-x:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-full{--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.rotate-90{rotate:90deg}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-pointer{cursor:pointer}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-\[1fr_auto_1fr\]{grid-template-columns:1fr auto 1fr}.grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-px{gap:1px}:where(.space-y-0\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * .5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * .5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-px>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(1px * var(--tw-space-y-reverse));margin-block-end:calc(1px * calc(1 - var(--tw-space-y-reverse)))}.gap-x-2{column-gap:calc(var(--spacing) * 2)}.gap-y-0\.5{row-gap:calc(var(--spacing) * .5)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-l-xl{border-top-left-radius:var(--radius-xl);border-bottom-left-radius:var(--radius-xl)}.rounded-b{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-x{border-inline-style:var(--tw-border-style);border-inline-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-t-2{border-top-style:var(--tw-border-style);border-top-width:2px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-amber-500{border-color:var(--color-amber-500)}.border-amber-500\/20{border-color:#f99c0033}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/20{border-color:color-mix(in oklab, var(--color-amber-500) 20%, transparent)}}.border-black\/6{border-color:#0000000f}@supports (color:color-mix(in lab, red, red)){.border-black\/6{border-color:color-mix(in oklab, var(--color-black) 6%, transparent)}}.border-black\/8{border-color:#00000014}@supports (color:color-mix(in lab, red, red)){.border-black\/8{border-color:color-mix(in oklab, var(--color-black) 8%, transparent)}}.border-black\/10{border-color:#0000001a}@supports (color:color-mix(in lab, red, red)){.border-black\/10{border-color:color-mix(in oklab, var(--color-black) 10%, transparent)}}.border-black\/12{border-color:#0000001f}@supports (color:color-mix(in lab, red, red)){.border-black\/12{border-color:color-mix(in oklab, var(--color-black) 12%, transparent)}}.border-black\/20{border-color:#0003}@supports (color:color-mix(in lab, red, red)){.border-black\/20{border-color:color-mix(in oklab, var(--color-black) 20%, transparent)}}.border-emerald-500\/30{border-color:#00bb7f4d}@supports (color:color-mix(in lab, red, red)){.border-emerald-500\/30{border-color:color-mix(in oklab, var(--color-emerald-500) 30%, transparent)}}.border-indigo-400\/40{border-color:#7d87ff66}@supports (color:color-mix(in lab, red, red)){.border-indigo-400\/40{border-color:color-mix(in oklab, var(--color-indigo-400) 40%, transparent)}}.border-indigo-500{border-color:var(--color-indigo-500)}.border-indigo-500\/15{border-color:#625fff26}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/15{border-color:color-mix(in oklab, var(--color-indigo-500) 15%, transparent)}}.border-indigo-500\/20{border-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/20{border-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.border-indigo-500\/25{border-color:#625fff40}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/25{border-color:color-mix(in oklab, var(--color-indigo-500) 25%, transparent)}}.border-indigo-500\/30{border-color:#625fff4d}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/30{border-color:color-mix(in oklab, var(--color-indigo-500) 30%, transparent)}}.border-indigo-500\/40{border-color:#625fff66}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/40{border-color:color-mix(in oklab, var(--color-indigo-500) 40%, transparent)}}.border-indigo-500\/50{border-color:#625fff80}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/50{border-color:color-mix(in oklab, var(--color-indigo-500) 50%, transparent)}}.border-red-500\/30{border-color:#fb2c364d}@supports (color:color-mix(in lab, red, red)){.border-red-500\/30{border-color:color-mix(in oklab, var(--color-red-500) 30%, transparent)}}.border-rose-500\/20{border-color:#ff235733}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/20{border-color:color-mix(in oklab, var(--color-rose-500) 20%, transparent)}}.border-rose-500\/30{border-color:#ff23574d}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/30{border-color:color-mix(in oklab, var(--color-rose-500) 30%, transparent)}}.border-white\/6{border-color:#ffffff0f}@supports (color:color-mix(in lab, red, red)){.border-white\/6{border-color:color-mix(in oklab, var(--color-white) 6%, transparent)}}.border-white\/8{border-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.border-white\/8{border-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.border-white\/10{border-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.border-t-indigo-500{border-top-color:var(--color-indigo-500)}.bg-\[\#0a0a0f\]{background-color:#0a0a0f}.bg-\[\#0c0c15\]{background-color:#0c0c15}.bg-\[\#0d0d14\]{background-color:#0d0d14}.bg-\[\#1a1a2e\]{background-color:#1a1a2e}.bg-amber-400{background-color:var(--color-amber-400)}.bg-amber-500\/10{background-color:#f99c001a}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/10{background-color:color-mix(in oklab, var(--color-amber-500) 10%, transparent)}}.bg-amber-500\/20{background-color:#f99c0033}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/20{background-color:color-mix(in oklab, var(--color-amber-500) 20%, transparent)}}.bg-amber-600{background-color:var(--color-amber-600)}.bg-amber-600\/40{background-color:#dd740066}@supports (color:color-mix(in lab, red, red)){.bg-amber-600\/40{background-color:color-mix(in oklab, var(--color-amber-600) 40%, transparent)}}.bg-black\/3{background-color:#00000008}@supports (color:color-mix(in lab, red, red)){.bg-black\/3{background-color:color-mix(in oklab, var(--color-black) 3%, transparent)}}.bg-black\/4{background-color:#0000000a}@supports (color:color-mix(in lab, red, red)){.bg-black\/4{background-color:color-mix(in oklab, var(--color-black) 4%, transparent)}}.bg-black\/5{background-color:#0000000d}@supports (color:color-mix(in lab, red, red)){.bg-black\/5{background-color:color-mix(in oklab, var(--color-black) 5%, transparent)}}.bg-black\/6{background-color:#0000000f}@supports (color:color-mix(in lab, red, red)){.bg-black\/6{background-color:color-mix(in oklab, var(--color-black) 6%, transparent)}}.bg-black\/8{background-color:#00000014}@supports (color:color-mix(in lab, red, red)){.bg-black\/8{background-color:color-mix(in oklab, var(--color-black) 8%, transparent)}}.bg-black\/10{background-color:#0000001a}@supports (color:color-mix(in lab, red, red)){.bg-black\/10{background-color:color-mix(in oklab, var(--color-black) 10%, transparent)}}.bg-black\/12{background-color:#0000001f}@supports (color:color-mix(in lab, red, red)){.bg-black\/12{background-color:color-mix(in oklab, var(--color-black) 12%, transparent)}}.bg-black\/20{background-color:#0003}@supports (color:color-mix(in lab, red, red)){.bg-black\/20{background-color:color-mix(in oklab, var(--color-black) 20%, transparent)}}.bg-black\/30{background-color:#0000004d}@supports (color:color-mix(in lab, red, red)){.bg-black\/30{background-color:color-mix(in oklab, var(--color-black) 30%, transparent)}}.bg-black\/60{background-color:#0009}@supports (color:color-mix(in lab, red, red)){.bg-black\/60{background-color:color-mix(in oklab, var(--color-black) 60%, transparent)}}.bg-blue-500\/30{background-color:#3080ff4d}@supports (color:color-mix(in lab, red, red)){.bg-blue-500\/30{background-color:color-mix(in oklab, var(--color-blue-500) 30%, transparent)}}.bg-emerald-100{background-color:var(--color-emerald-100)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-emerald-500\/15{background-color:#00bb7f26}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/15{background-color:color-mix(in oklab, var(--color-emerald-500) 15%, transparent)}}.bg-emerald-500\/20{background-color:#00bb7f33}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/20{background-color:color-mix(in oklab, var(--color-emerald-500) 20%, transparent)}}.bg-emerald-500\/25{background-color:#00bb7f40}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/25{background-color:color-mix(in oklab, var(--color-emerald-500) 25%, transparent)}}.bg-emerald-600{background-color:var(--color-emerald-600)}.bg-indigo-400{background-color:var(--color-indigo-400)}.bg-indigo-400\/40{background-color:#7d87ff66}@supports (color:color-mix(in lab, red, red)){.bg-indigo-400\/40{background-color:color-mix(in oklab, var(--color-indigo-400) 40%, transparent)}}.bg-indigo-400\/50{background-color:#7d87ff80}@supports (color:color-mix(in lab, red, red)){.bg-indigo-400\/50{background-color:color-mix(in oklab, var(--color-indigo-400) 50%, transparent)}}.bg-indigo-500{background-color:var(--color-indigo-500)}.bg-indigo-500\/8{background-color:#625fff14}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/8{background-color:color-mix(in oklab, var(--color-indigo-500) 8%, transparent)}}.bg-indigo-500\/10{background-color:#625fff1a}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/10{background-color:color-mix(in oklab, var(--color-indigo-500) 10%, transparent)}}.bg-indigo-500\/15{background-color:#625fff26}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/15{background-color:color-mix(in oklab, var(--color-indigo-500) 15%, transparent)}}.bg-indigo-500\/20{background-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/20{background-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.bg-indigo-500\/30{background-color:#625fff4d}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/30{background-color:color-mix(in oklab, var(--color-indigo-500) 30%, transparent)}}.bg-indigo-500\/40{background-color:#625fff66}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/40{background-color:color-mix(in oklab, var(--color-indigo-500) 40%, transparent)}}.bg-indigo-500\/50{background-color:#625fff80}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/50{background-color:color-mix(in oklab, var(--color-indigo-500) 50%, transparent)}}.bg-indigo-500\/70{background-color:#625fffb3}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/70{background-color:color-mix(in oklab, var(--color-indigo-500) 70%, transparent)}}.bg-indigo-600{background-color:var(--color-indigo-600)}.bg-indigo-600\/10{background-color:#4f39f61a}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/10{background-color:color-mix(in oklab, var(--color-indigo-600) 10%, transparent)}}.bg-indigo-600\/15{background-color:#4f39f626}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/15{background-color:color-mix(in oklab, var(--color-indigo-600) 15%, transparent)}}.bg-indigo-600\/20{background-color:#4f39f633}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/20{background-color:color-mix(in oklab, var(--color-indigo-600) 20%, transparent)}}.bg-indigo-600\/25{background-color:#4f39f640}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/25{background-color:color-mix(in oklab, var(--color-indigo-600) 25%, transparent)}}.bg-indigo-600\/30{background-color:#4f39f64d}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/30{background-color:color-mix(in oklab, var(--color-indigo-600) 30%, transparent)}}.bg-purple-500\/40{background-color:#ac4bff66}@supports (color:color-mix(in lab, red, red)){.bg-purple-500\/40{background-color:color-mix(in oklab, var(--color-purple-500) 40%, transparent)}}.bg-red-100{background-color:var(--color-red-100)}.bg-rose-500\/20{background-color:#ff235733}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/20{background-color:color-mix(in oklab, var(--color-rose-500) 20%, transparent)}}.bg-rose-600{background-color:var(--color-rose-600)}.bg-rose-800{background-color:var(--color-rose-800)}.bg-rose-800\/40{background-color:#a3003766}@supports (color:color-mix(in lab, red, red)){.bg-rose-800\/40{background-color:color-mix(in oklab, var(--color-rose-800) 40%, transparent)}}.bg-slate-50{background-color:var(--color-slate-50)}.bg-slate-100{background-color:var(--color-slate-100)}.bg-slate-400\/60{background-color:#90a1b999}@supports (color:color-mix(in lab, red, red)){.bg-slate-400\/60{background-color:color-mix(in oklab, var(--color-slate-400) 60%, transparent)}}.bg-slate-500{background-color:var(--color-slate-500)}.bg-slate-800{background-color:var(--color-slate-800)}.bg-slate-900{background-color:var(--color-slate-900)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.bg-white\/8{background-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.bg-white\/8{background-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.bg-white\/10{background-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.bg-white\/10{background-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.bg-gradient-to-br{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-indigo-600\/20{--tw-gradient-from:#4f39f633}@supports (color:color-mix(in lab, red, red)){.from-indigo-600\/20{--tw-gradient-from:color-mix(in oklab, var(--color-indigo-600) 20%, transparent)}}.from-indigo-600\/20{--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-purple-600\/10{--tw-gradient-to:#9810fa1a}@supports (color:color-mix(in lab, red, red)){.to-purple-600\/10{--tw-gradient-to:color-mix(in oklab, var(--color-purple-600) 10%, transparent)}}.to-purple-600\/10{--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-1{padding:var(--spacing)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-2\.5{padding:calc(var(--spacing) * 2.5)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.px-0\.5{padding-inline:calc(var(--spacing) * .5)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-8{padding-block:calc(var(--spacing) * 8)}.pt-0\.5{padding-top:calc(var(--spacing) * .5)}.pt-1{padding-top:var(--spacing)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-\[15vh\]{padding-top:15vh}.pr-2{padding-right:calc(var(--spacing) * 2)}.pb-1{padding-bottom:var(--spacing)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pl-1{padding-left:var(--spacing)}.pl-2{padding-left:calc(var(--spacing) * 2)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.align-middle{vertical-align:middle}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[6px\]{font-size:6px}.text-\[7px\]{font-size:7px}.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[12px\]{font-size:12px}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.text-\[26px\]{font-size:26px}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-black{--tw-font-weight:var(--font-weight-black);font-weight:var(--font-weight-black)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.text-wrap{text-wrap:wrap}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.text-amber-600{color:var(--color-amber-600)}.text-amber-700{color:var(--color-amber-700)}.text-amber-700\/80{color:#b75000cc}@supports (color:color-mix(in lab, red, red)){.text-amber-700\/80{color:color-mix(in oklab, var(--color-amber-700) 80%, transparent)}}.text-emerald-300{color:var(--color-emerald-300)}.text-emerald-400{color:var(--color-emerald-400)}.text-emerald-600{color:var(--color-emerald-600)}.text-emerald-700{color:var(--color-emerald-700)}.text-emerald-800{color:var(--color-emerald-800)}.text-indigo-300{color:var(--color-indigo-300)}.text-indigo-600{color:var(--color-indigo-600)}.text-indigo-600\/60{color:#4f39f699}@supports (color:color-mix(in lab, red, red)){.text-indigo-600\/60{color:color-mix(in oklab, var(--color-indigo-600) 60%, transparent)}}.text-indigo-600\/70{color:#4f39f6b3}@supports (color:color-mix(in lab, red, red)){.text-indigo-600\/70{color:color-mix(in oklab, var(--color-indigo-600) 70%, transparent)}}.text-indigo-700{color:var(--color-indigo-700)}.text-indigo-800{color:var(--color-indigo-800)}.text-orange-600{color:var(--color-orange-600)}.text-pink-600{color:var(--color-pink-600)}.text-red-400{color:var(--color-red-400)}.text-red-700{color:var(--color-red-700)}.text-rose-400{color:var(--color-rose-400)}.text-rose-600{color:var(--color-rose-600)}.text-rose-700{color:var(--color-rose-700)}.text-sky-600{color:var(--color-sky-600)}.text-slate-200{color:var(--color-slate-200)}.text-slate-300{color:var(--color-slate-300)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-slate-900\/70{color:#0f172bb3}@supports (color:color-mix(in lab, red, red)){.text-slate-900\/70{color:color-mix(in oklab, var(--color-slate-900) 70%, transparent)}}.text-slate-900\/80{color:#0f172bcc}@supports (color:color-mix(in lab, red, red)){.text-slate-900\/80{color:color-mix(in oklab, var(--color-slate-900) 80%, transparent)}}.text-slate-900\/85{color:#0f172bd9}@supports (color:color-mix(in lab, red, red)){.text-slate-900\/85{color:color-mix(in oklab, var(--color-slate-900) 85%, transparent)}}.text-teal-600{color:var(--color-teal-600)}.text-violet-600{color:var(--color-violet-600)}.text-white{color:var(--color-white)}.text-white\/80{color:#fffc}@supports (color:color-mix(in lab, red, red)){.text-white\/80{color:color-mix(in oklab, var(--color-white) 80%, transparent)}}.capitalize{text-transform:capitalize}.uppercase{text-transform:uppercase}.italic{font-style:italic}.proportional-nums{--tw-numeric-spacing:proportional-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.overline{text-decoration-line:overline}.underline{text-decoration-line:underline}.placeholder-slate-400::placeholder{color:var(--color-slate-400)}.accent-indigo-500{accent-color:var(--color-indigo-500)}.opacity-0{opacity:0}.opacity-30{opacity:.3}.opacity-40{opacity:.4}.opacity-70{opacity:.7}.opacity-90{opacity:.9}.opacity-100{opacity:1}.mix-blend-difference{mix-blend-mode:difference}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow\/translate{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-black\/60{--tw-shadow-color:#0009}@supports (color:color-mix(in lab, red, red)){.shadow-black\/60{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-black) 60%, transparent) var(--tw-shadow-alpha), transparent)}}.shadow-emerald-600\/30{--tw-shadow-color:#0097674d}@supports (color:color-mix(in lab, red, red)){.shadow-emerald-600\/30{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-emerald-600) 30%, transparent) var(--tw-shadow-alpha), transparent)}}.shadow-indigo-600\/30{--tw-shadow-color:#4f39f64d}@supports (color:color-mix(in lab, red, red)){.shadow-indigo-600\/30{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-indigo-600) 30%, transparent) var(--tw-shadow-alpha), transparent)}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.drop-shadow{--tw-drop-shadow-size:drop-shadow(0 1px 2px var(--tw-drop-shadow-color,#0000001a)) drop-shadow(0 1px 1px var(--tw-drop-shadow-color,#0000000f));--tw-drop-shadow:drop-shadow(0 1px 2px #0000001a) drop-shadow(0 1px 1px #0000000f);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.invert{--tw-invert:invert(100%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.delay-5{transition-delay:5ms}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-all{-webkit-user-select:all;user-select:all}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.group-hover\:text-slate-500:is(:where(.group):hover *){color:var(--color-slate-500)}.group-hover\:text-slate-700:is(:where(.group):hover *){color:var(--color-slate-700)}.group-hover\:text-slate-900:is(:where(.group):hover *){color:var(--color-slate-900)}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.placeholder\:text-slate-500::placeholder{color:var(--color-slate-500)}.placeholder\:text-slate-600::placeholder{color:var(--color-slate-600)}@media (hover:hover){.hover\:border-black\/12:hover{border-color:#0000001f}@supports (color:color-mix(in lab, red, red)){.hover\:border-black\/12:hover{border-color:color-mix(in oklab, var(--color-black) 12%, transparent)}}.hover\:border-black\/14:hover{border-color:#00000024}@supports (color:color-mix(in lab, red, red)){.hover\:border-black\/14:hover{border-color:color-mix(in oklab, var(--color-black) 14%, transparent)}}.hover\:border-rose-500\/30:hover{border-color:#ff23574d}@supports (color:color-mix(in lab, red, red)){.hover\:border-rose-500\/30:hover{border-color:color-mix(in oklab, var(--color-rose-500) 30%, transparent)}}.hover\:bg-black\/4:hover{background-color:#0000000a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/4:hover{background-color:color-mix(in oklab, var(--color-black) 4%, transparent)}}.hover\:bg-black\/5:hover{background-color:#0000000d}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/5:hover{background-color:color-mix(in oklab, var(--color-black) 5%, transparent)}}.hover\:bg-black\/6:hover{background-color:#0000000f}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/6:hover{background-color:color-mix(in oklab, var(--color-black) 6%, transparent)}}.hover\:bg-black\/8:hover{background-color:#00000014}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/8:hover{background-color:color-mix(in oklab, var(--color-black) 8%, transparent)}}.hover\:bg-black\/12:hover{background-color:#0000001f}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/12:hover{background-color:color-mix(in oklab, var(--color-black) 12%, transparent)}}.hover\:bg-emerald-500:hover{background-color:var(--color-emerald-500)}.hover\:bg-emerald-500\/10:hover{background-color:#00bb7f1a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-emerald-500\/10:hover{background-color:color-mix(in oklab, var(--color-emerald-500) 10%, transparent)}}.hover\:bg-indigo-500:hover{background-color:var(--color-indigo-500)}.hover\:bg-indigo-500\/20:hover{background-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-500\/20:hover{background-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.hover\:bg-indigo-600\/25:hover{background-color:#4f39f640}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-600\/25:hover{background-color:color-mix(in oklab, var(--color-indigo-600) 25%, transparent)}}.hover\:bg-indigo-600\/30:hover{background-color:#4f39f64d}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-600\/30:hover{background-color:color-mix(in oklab, var(--color-indigo-600) 30%, transparent)}}.hover\:bg-indigo-600\/35:hover{background-color:#4f39f659}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-600\/35:hover{background-color:color-mix(in oklab, var(--color-indigo-600) 35%, transparent)}}.hover\:bg-rose-500:hover{background-color:var(--color-rose-500)}.hover\:bg-rose-500\/10:hover{background-color:#ff23571a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-rose-500\/10:hover{background-color:color-mix(in oklab, var(--color-rose-500) 10%, transparent)}}.hover\:bg-white\/8:hover{background-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.hover\:bg-white\/8:hover{background-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.hover\:bg-white\/12:hover{background-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.hover\:bg-white\/12:hover{background-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.hover\:text-emerald-300:hover{color:var(--color-emerald-300)}.hover\:text-indigo-600:hover{color:var(--color-indigo-600)}.hover\:text-rose-300:hover{color:var(--color-rose-300)}.hover\:text-rose-600:hover{color:var(--color-rose-600)}.hover\:text-rose-700:hover{color:var(--color-rose-700)}.hover\:text-slate-600:hover{color:var(--color-slate-600)}.hover\:text-slate-700:hover{color:var(--color-slate-700)}.hover\:text-slate-800:hover{color:var(--color-slate-800)}.hover\:text-slate-900:hover{color:var(--color-slate-900)}.hover\:text-white:hover{color:var(--color-white)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-100:hover{opacity:1}}.focus\:border-indigo-500:focus{border-color:var(--color-indigo-500)}.focus\:opacity-100:focus{opacity:1}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-25:disabled{opacity:.25}.disabled\:opacity-40:disabled{opacity:.4}@media (min-width:40rem){.sm\:block{display:block}.sm\:inline{display:inline}.sm\:gap-3{gap:calc(var(--spacing) * 3)}.sm\:opacity-0{opacity:0}.sm\:group-focus-within\:opacity-100:is(:where(.group):focus-within *){opacity:1}@media (hover:hover){.sm\:group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}}@media (min-width:48rem){.md\:block{display:block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:w-\[360px\]{width:360px}.md\:flex-1{flex:1}.md\:flex-none{flex:none}}.dark\:border-white\/6:where(.dark,.dark *){border-color:#ffffff0f}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/6:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 6%, transparent)}}.dark\:border-white\/8:where(.dark,.dark *){border-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/8:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.dark\:border-white\/10:where(.dark,.dark *){border-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/10:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.dark\:border-white\/12:where(.dark,.dark *){border-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/12:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.dark\:border-white\/20:where(.dark,.dark *){border-color:#fff3}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/20:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 20%, transparent)}}.dark\:bg-\[\#0a0a0f\]:where(.dark,.dark *){background-color:#0a0a0f}.dark\:bg-\[\#0a0a10\]:where(.dark,.dark *){background-color:#0a0a10}.dark\:bg-\[\#0c0c15\]:where(.dark,.dark *){background-color:#0c0c15}.dark\:bg-\[\#0d0d14\]:where(.dark,.dark *){background-color:#0d0d14}.dark\:bg-\[\#1a1a2e\]:where(.dark,.dark *){background-color:#1a1a2e}.dark\:bg-\[\#06060a\]:where(.dark,.dark *){background-color:#06060a}.dark\:bg-\[\#07070b\]:where(.dark,.dark *){background-color:#07070b}.dark\:bg-\[\#09090e\]:where(.dark,.dark *){background-color:#09090e}.dark\:bg-\[\#111118\]:where(.dark,.dark *){background-color:#111118}.dark\:bg-emerald-900\/40:where(.dark,.dark *){background-color:#004e3b66}@supports (color:color-mix(in lab, red, red)){.dark\:bg-emerald-900\/40:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-emerald-900) 40%, transparent)}}.dark\:bg-red-900\/40:where(.dark,.dark *){background-color:#82181a66}@supports (color:color-mix(in lab, red, red)){.dark\:bg-red-900\/40:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-red-900) 40%, transparent)}}.dark\:bg-slate-600\/60:where(.dark,.dark *){background-color:#45556c99}@supports (color:color-mix(in lab, red, red)){.dark\:bg-slate-600\/60:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-slate-600) 60%, transparent)}}.dark\:bg-white\/3:where(.dark,.dark *){background-color:#ffffff08}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/3:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 3%, transparent)}}.dark\:bg-white\/4:where(.dark,.dark *){background-color:#ffffff0a}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/4:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 4%, transparent)}}.dark\:bg-white\/5:where(.dark,.dark *){background-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/5:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.dark\:bg-white\/6:where(.dark,.dark *){background-color:#ffffff0f}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/6:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 6%, transparent)}}.dark\:bg-white\/8:where(.dark,.dark *){background-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/8:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.dark\:bg-white\/10:where(.dark,.dark *){background-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/10:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.dark\:bg-white\/12:where(.dark,.dark *){background-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/12:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.dark\:bg-white\/20:where(.dark,.dark *){background-color:#fff3}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/20:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 20%, transparent)}}.dark\:text-amber-300:where(.dark,.dark *){color:var(--color-amber-300)}.dark\:text-amber-400:where(.dark,.dark *){color:var(--color-amber-400)}.dark\:text-amber-500\/80:where(.dark,.dark *){color:#f99c00cc}@supports (color:color-mix(in lab, red, red)){.dark\:text-amber-500\/80:where(.dark,.dark *){color:color-mix(in oklab, var(--color-amber-500) 80%, transparent)}}.dark\:text-emerald-200:where(.dark,.dark *){color:var(--color-emerald-200)}.dark\:text-emerald-300:where(.dark,.dark *){color:var(--color-emerald-300)}.dark\:text-emerald-400:where(.dark,.dark *){color:var(--color-emerald-400)}.dark\:text-indigo-200:where(.dark,.dark *){color:var(--color-indigo-200)}.dark\:text-indigo-300:where(.dark,.dark *){color:var(--color-indigo-300)}.dark\:text-indigo-400:where(.dark,.dark *){color:var(--color-indigo-400)}.dark\:text-indigo-400\/60:where(.dark,.dark *){color:#7d87ff99}@supports (color:color-mix(in lab, red, red)){.dark\:text-indigo-400\/60:where(.dark,.dark *){color:color-mix(in oklab, var(--color-indigo-400) 60%, transparent)}}.dark\:text-indigo-400\/70:where(.dark,.dark *){color:#7d87ffb3}@supports (color:color-mix(in lab, red, red)){.dark\:text-indigo-400\/70:where(.dark,.dark *){color:color-mix(in oklab, var(--color-indigo-400) 70%, transparent)}}.dark\:text-orange-400:where(.dark,.dark *){color:var(--color-orange-400)}.dark\:text-pink-400:where(.dark,.dark *){color:var(--color-pink-400)}.dark\:text-red-300:where(.dark,.dark *){color:var(--color-red-300)}.dark\:text-rose-300:where(.dark,.dark *){color:var(--color-rose-300)}.dark\:text-rose-400:where(.dark,.dark *){color:var(--color-rose-400)}.dark\:text-sky-400:where(.dark,.dark *){color:var(--color-sky-400)}.dark\:text-slate-100:where(.dark,.dark *){color:var(--color-slate-100)}.dark\:text-slate-200:where(.dark,.dark *){color:var(--color-slate-200)}.dark\:text-slate-300:where(.dark,.dark *){color:var(--color-slate-300)}.dark\:text-slate-400:where(.dark,.dark *){color:var(--color-slate-400)}.dark\:text-slate-600:where(.dark,.dark *){color:var(--color-slate-600)}.dark\:text-slate-700:where(.dark,.dark *){color:var(--color-slate-700)}.dark\:text-teal-400:where(.dark,.dark *){color:var(--color-teal-400)}.dark\:text-violet-400:where(.dark,.dark *){color:var(--color-violet-400)}.dark\:text-white:where(.dark,.dark *){color:var(--color-white)}.dark\:text-white\/70:where(.dark,.dark *){color:#ffffffb3}@supports (color:color-mix(in lab, red, red)){.dark\:text-white\/70:where(.dark,.dark *){color:color-mix(in oklab, var(--color-white) 70%, transparent)}}.dark\:text-white\/80:where(.dark,.dark *){color:#fffc}@supports (color:color-mix(in lab, red, red)){.dark\:text-white\/80:where(.dark,.dark *){color:color-mix(in oklab, var(--color-white) 80%, transparent)}}.dark\:text-white\/85:where(.dark,.dark *){color:#ffffffd9}@supports (color:color-mix(in lab, red, red)){.dark\:text-white\/85:where(.dark,.dark *){color:color-mix(in oklab, var(--color-white) 85%, transparent)}}.dark\:placeholder-slate-600:where(.dark,.dark *)::placeholder{color:var(--color-slate-600)}@media (hover:hover){.dark\:group-hover\:text-slate-300:where(.dark,.dark *):is(:where(.group):hover *){color:var(--color-slate-300)}.dark\:group-hover\:text-white:where(.dark,.dark *):is(:where(.group):hover *){color:var(--color-white)}}.dark\:placeholder\:text-slate-400:where(.dark,.dark *)::placeholder{color:var(--color-slate-400)}@media (hover:hover){.dark\:hover\:border-white\/12:where(.dark,.dark *):hover{border-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:border-white\/12:where(.dark,.dark *):hover{border-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.dark\:hover\:border-white\/14:where(.dark,.dark *):hover{border-color:#ffffff24}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:border-white\/14:where(.dark,.dark *):hover{border-color:color-mix(in oklab, var(--color-white) 14%, transparent)}}.dark\:hover\:bg-white\/4:where(.dark,.dark *):hover{background-color:#ffffff0a}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/4:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 4%, transparent)}}.dark\:hover\:bg-white\/5:where(.dark,.dark *):hover{background-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/5:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.dark\:hover\:bg-white\/6:where(.dark,.dark *):hover{background-color:#ffffff0f}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/6:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 6%, transparent)}}.dark\:hover\:bg-white\/8:where(.dark,.dark *):hover{background-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/8:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.dark\:hover\:bg-white\/12:where(.dark,.dark *):hover{background-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/12:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.dark\:hover\:text-indigo-400:where(.dark,.dark *):hover{color:var(--color-indigo-400)}.dark\:hover\:text-rose-300:where(.dark,.dark *):hover{color:var(--color-rose-300)}.dark\:hover\:text-rose-400:where(.dark,.dark *):hover{color:var(--color-rose-400)}.dark\:hover\:text-slate-200:where(.dark,.dark *):hover{color:var(--color-slate-200)}.dark\:hover\:text-slate-300:where(.dark,.dark *):hover{color:var(--color-slate-300)}.dark\:hover\:text-slate-400:where(.dark,.dark *):hover{color:var(--color-slate-400)}.dark\:hover\:text-white:where(.dark,.dark *):hover{color:var(--color-white)}}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}.clampRange.svelte-iy59wr{appearance:none;pointer-events:none;background:0 0;margin:0}.clampRange.svelte-iy59wr::-webkit-slider-thumb{appearance:none;cursor:pointer;pointer-events:auto;background:0 0;border-radius:9999px;width:16px;height:16px}.clampRange.svelte-iy59wr::-moz-range-thumb{cursor:pointer;pointer-events:auto;background:0 0;border:0;border-radius:9999px;width:16px;height:16px}.clampRange.svelte-iy59wr::-moz-range-track{background:0 0}@layer slashed.tokens{@property --sf-color-primary-source-light{syntax:"";inherits:true;initial-value:oklch(47% .27 264)}@property --sf-color-secondary-source-light{syntax:"";inherits:true;initial-value:oklch(22% .04 264)}@property --sf-color-tertiary-source-light{syntax:"";inherits:true;initial-value:oklch(42% .22 295)}@property --sf-color-action-source-light{syntax:"";inherits:true;initial-value:oklch(50% .22 235)}@property --sf-color-neutral-source-light{syntax:"";inherits:true;initial-value:oklch(52% .025 260)}@property --sf-color-base-source-light{syntax:"";inherits:true;initial-value:oklch(96% .006 250)}@property --sf-color-success-source-light{syntax:"";inherits:true;initial-value:oklch(50% .16 145)}@property --sf-color-warning-source-light{syntax:"";inherits:true;initial-value:oklch(75% .17 80)}@property --sf-color-info-source-light{syntax:"";inherits:true;initial-value:oklch(48% .18 235)}@property --sf-color-danger-source-light{syntax:"";inherits:true;initial-value:oklch(48% .22 12)}:root{--sf-color-primary-source-light:#0137ee;--sf-color-secondary-source-light:#111a2d;--sf-color-tertiary-source-light:#5c10b4;--sf-color-action-source-light:#006c98;--sf-color-neutral-source-light:#616978;--sf-color-base-source-light:#eff2f6;--sf-color-success-source-light:#00791d;--sf-color-warning-source-light:#e2a000;--sf-color-info-source-light:#006693;--sf-color-danger-source-light:#af0040}@supports (color:lab(0% 0 0)){:root{--sf-color-primary-source-light:lab(33.7875% 46.3905 -95.4963);--sf-color-secondary-source-light:lab(9.22675% 1.07623 -14.3482);--sf-color-tertiary-source-light:lab(28.2584% 55.0822 -70.9314);--sf-color-action-source-light:lab(41.335% -12.4269 -63.6346);--sf-color-neutral-source-light:lab(44.2238% -1.00827 -9.19603);--sf-color-base-source-light:lab(95.3554% -.662148 -2.14612);--sf-color-success-source-light:lab(43.8665% -45.1423 39.6128);--sf-color-warning-source-light:lab(70.9465% 19.2186 87.3143);--sf-color-info-source-light:lab(39.3159% -14.401 -52.2544);--sf-color-danger-source-light:lab(37.1443% 71.0626 21.0806)}}@property --sf-color-primary-source-dark{syntax:"";inherits:true;initial-value:oklch(71.5% .243 264)}@property --sf-color-secondary-source-dark{syntax:"";inherits:true;initial-value:oklch(84% .036 264)}@property --sf-color-tertiary-source-dark{syntax:"";inherits:true;initial-value:oklch(74% .198 295)}@property --sf-color-action-source-dark{syntax:"";inherits:true;initial-value:oklch(70% .198 235)}@property --sf-color-neutral-source-dark{syntax:"";inherits:true;initial-value:oklch(69% .0225 260)}@property --sf-color-base-source-dark{syntax:"";inherits:true;initial-value:oklch(22% .003 250)}@property --sf-color-success-source-dark{syntax:"";inherits:true;initial-value:oklch(70% .144 145)}@property --sf-color-warning-source-dark{syntax:"";inherits:true;initial-value:oklch(65% .153 80)}@property --sf-color-info-source-dark{syntax:"";inherits:true;initial-value:oklch(71% .162 235)}@property --sf-color-danger-source-dark{syntax:"";inherits:true;initial-value:oklch(71% .198 12)}@property --sf-color-primary{syntax:"";inherits:true;initial-value:oklch(47% .27 264)}@property --sf-color-secondary{syntax:"";inherits:true;initial-value:oklch(22% .04 264)}@property --sf-color-tertiary{syntax:"";inherits:true;initial-value:oklch(42% .22 295)}@property --sf-color-action{syntax:"";inherits:true;initial-value:oklch(50% .22 235)}@property --sf-color-neutral{syntax:"";inherits:true;initial-value:oklch(52% .025 260)}@property --sf-color-base{syntax:"";inherits:true;initial-value:oklch(96% .006 250)}@property --sf-color-success{syntax:"";inherits:true;initial-value:oklch(50% .16 145)}@property --sf-color-warning{syntax:"";inherits:true;initial-value:oklch(75% .17 80)}@property --sf-color-info{syntax:"";inherits:true;initial-value:oklch(48% .18 235)}@property --sf-color-danger{syntax:"";inherits:true;initial-value:oklch(48% .22 12)}:root{--sf-color-primary:var(--sf-color-primary-source-light);--sf-color-secondary:var(--sf-color-secondary-source-light);--sf-color-tertiary:var(--sf-color-tertiary-source-light);--sf-color-action:var(--sf-color-action-source-light);--sf-color-neutral:var(--sf-color-neutral-source-light);--sf-color-base:var(--sf-color-base-source-light);--sf-color-success:var(--sf-color-success-source-light);--sf-color-warning:var(--sf-color-warning-source-light);--sf-color-info:var(--sf-color-info-source-light);--sf-color-danger:var(--sf-color-danger-source-light)}@property --sf-is-dark{syntax:"";inherits:true;initial-value:0}@property --sf-is-active{syntax:"";inherits:true;initial-value:0}@property --sf-is-current{syntax:"";inherits:true;initial-value:0}@property --sf-is-pressed{syntax:"";inherits:true;initial-value:0}@property --sf-is-open{syntax:"";inherits:true;initial-value:0}@property --sf-fluid-min-vw{syntax:"";inherits:true;initial-value:22.5}@property --sf-fluid-max-vw{syntax:"";inherits:true;initial-value:90}@property --sf-text-ratio-min{syntax:"";inherits:true;initial-value:1.25}@property --sf-text-ratio-max{syntax:"";inherits:true;initial-value:1.333}@property --sf-text-base-min{syntax:"";inherits:true;initial-value:1}@property --sf-text-base-max{syntax:"";inherits:true;initial-value:1.25}@property --sf-text-display-base-min{syntax:"";inherits:true;initial-value:2.4}@property --sf-text-display-base-max{syntax:"";inherits:true;initial-value:3}@property --sf-space-ratio-min{syntax:"";inherits:true;initial-value:1.25}@property --sf-space-ratio-max{syntax:"";inherits:true;initial-value:1.333}@property --sf-space-base-min{syntax:"";inherits:true;initial-value:1}@property --sf-space-base-max{syntax:"";inherits:true;initial-value:2}@property --sf-fluid-width{syntax:"*";inherits:true}@property --sf-radius-none{syntax:"";inherits:true;initial-value:0}@property --sf-radius-2xs{syntax:"";inherits:true;initial-value:0}@property --sf-radius-xs{syntax:"";inherits:true;initial-value:0}@property --sf-radius-s{syntax:"";inherits:true;initial-value:0}@property --sf-radius-m{syntax:"";inherits:true;initial-value:0}@property --sf-radius-l{syntax:"";inherits:true;initial-value:0}@property --sf-radius-xl{syntax:"";inherits:true;initial-value:0}@property --sf-radius-2xl{syntax:"";inherits:true;initial-value:0}@property --sf-radius-3xl{syntax:"";inherits:true;initial-value:0}@property --sf-radius-4xl{syntax:"";inherits:true;initial-value:0}@property --sf-radius-full{syntax:"";inherits:true;initial-value:9999px}@property --sf-radius-pill{syntax:"";inherits:true;initial-value:9999px}@property --sf-radius-outer{syntax:"";inherits:true;initial-value:0}@property --sf-media-radius{syntax:"";inherits:true;initial-value:0}@property --sf-space-none{syntax:"";inherits:true;initial-value:0}@property --sf-space-px{syntax:"";inherits:true;initial-value:1px}@property --sf-space-2xs{syntax:"";inherits:true;initial-value:0}@property --sf-space-xs{syntax:"";inherits:true;initial-value:0}@property --sf-space-s{syntax:"";inherits:true;initial-value:0}@property --sf-space-m{syntax:"";inherits:true;initial-value:0}@property --sf-space-l{syntax:"";inherits:true;initial-value:0}@property --sf-space-xl{syntax:"";inherits:true;initial-value:0}@property --sf-space-2xl{syntax:"";inherits:true;initial-value:0}@property --sf-space-3xl{syntax:"";inherits:true;initial-value:0}@property --sf-space-4xl{syntax:"";inherits:true;initial-value:0}@property --sf-gap{syntax:"";inherits:true;initial-value:0}@property --sf-content-gap{syntax:"";inherits:true;initial-value:0}@property --sf-gutter{syntax:"";inherits:true;initial-value:0}@property --sf-component-pad{syntax:"";inherits:true;initial-value:0}@property --sf-field-block{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--xs{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--s{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--m{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--l{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--xl{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--2xl{syntax:"";inherits:true;initial-value:0}@property --sf-shadow-none{syntax:"*";inherits:true}@property --sf-shadow-xs{syntax:"*";inherits:true}@property --sf-shadow-s{syntax:"*";inherits:true}@property --sf-shadow-m{syntax:"*";inherits:true}@property --sf-shadow-l{syntax:"*";inherits:true}@property --sf-shadow-xl{syntax:"*";inherits:true}@property --sf-shadow-2xl{syntax:"*";inherits:true}@property --sf-shadow-inner{syntax:"*";inherits:true}@property --sf-text-shadow-none{syntax:"*";inherits:true}@property --sf-text-shadow-xs{syntax:"*";inherits:true}@property --sf-text-shadow-s{syntax:"*";inherits:true}@property --sf-text-shadow-m{syntax:"*";inherits:true}@property --sf-text-shadow-l{syntax:"*";inherits:true}@property --sf-text-shadow-xl{syntax:"*";inherits:true}@property --sf-drop-shadow-xs{syntax:"*";inherits:true}@property --sf-drop-shadow-s{syntax:"*";inherits:true}@property --sf-drop-shadow-m{syntax:"*";inherits:true}@property --sf-drop-shadow-l{syntax:"*";inherits:true}@property --sf-drop-shadow-xl{syntax:"*";inherits:true}@property --sf-shadow-glow{syntax:"*";inherits:true}:root{--sf-fluid-min-vw:22.5;--sf-fluid-max-vw:90;--sf-fluid-width:100vw;--sf-text-ratio-min:1.25;--sf-text-ratio-max:1.333;--sf-text-base-min:1;--sf-text-base-max:1.25;--sf-text-display-base-min:2.4;--sf-text-display-base-max:3;--sf-space-ratio-min:1.25;--sf-space-ratio-max:1.333;--sf-space-base-min:1;--sf-space-base-max:2;--sf-color-scheme:light dark;--sf-lumlocker:.65;--sf-color-surface:var(--sf-color-base);--sf-color-text--on-base:var(--sf-color-text);--sf-color-text--on-primary:#eee;--sf-color-text--on-secondary:#eee;--sf-color-text--on-tertiary:#eee;--sf-color-text--on-action:#eee;--sf-color-text--on-neutral:#eee;--sf-color-text--on-success:#eee;--sf-color-text--on-warning:#030303;--sf-color-text--on-info:#eee;--sf-color-text--on-danger:#eee;--sf-color-text--on-inverse:#eee;--sf-color-code-text:#030303;--sf-color-border--focus:var(--sf-color-action);--sf-color-link--disabled:var(--sf-color-text--disabled);--sf-link-underline-offset:.15em;--sf-link-underline-thickness:auto;--sf-color-bg--disabled:var(--sf-color-inset);--sf-color-code-bg:var(--sf-color-inset);--sf-color-selection-text:inherit;--sf-color-mark-text:inherit;--sf-color-dim:#00000080;--sf-color-white:#fff;--sf-color-black:#000;--sf-scrollbar-thumb:var(--sf-color-neutral);--sf-scrollbar-track:transparent;--sf-shadow-strength:calc(.08 + var(--sf-is-dark) * .17);--sf-shadow-lightness:.15;--sf-shadow-glow-color:var(--sf-color-primary);--sf-opacity-disabled:.45;--sf-state-pending-opacity:.7;--sf-focus-ring-color:var(--sf-color-action);--sf-focus-ring-shadow:0 0 0 var(--sf-focus-ring-offset) var(--sf-color-bg,var(--sf-color-base-source-light,#fff)), 0 0 0 calc(var(--sf-focus-ring-offset) + var(--sf-focus-ring-width)) var(--sf-focus-ring-color);--sf-caret-color:var(--sf-color-action)}@supports (color:lab(0% 0 0)){:root{--sf-color-text--on-primary:lab(94.2% 0 0);--sf-color-text--on-secondary:lab(94.2% 0 0);--sf-color-text--on-tertiary:lab(94.2% 0 0);--sf-color-text--on-action:lab(94.2% 0 0);--sf-color-text--on-neutral:lab(94.2% 0 0);--sf-color-text--on-success:lab(94.2% 0 0);--sf-color-text--on-warning:lab(.903296% 0 0);--sf-color-text--on-info:lab(94.2% 0 0);--sf-color-text--on-danger:lab(94.2% 0 0);--sf-color-text--on-inverse:lab(94.2% 0 0);--sf-color-code-text:lab(.903296% 0 0);--sf-color-dim:lab(0% 0 0/.5);--sf-color-white:lab(100% 0 0);--sf-color-black:lab(0% 0 0)}}@supports (color:light-dark(white, black)) and (color:oklch(from red l c h)){:root{--sf-color-primary:light-dark(var(--sf-color-primary-source-light),var(--sf-color-primary-source-dark,oklch(from var(--sf-color-primary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-secondary:light-dark(var(--sf-color-secondary-source-light),var(--sf-color-secondary-source-dark,oklch(from var(--sf-color-secondary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-tertiary:light-dark(var(--sf-color-tertiary-source-light),var(--sf-color-tertiary-source-dark,oklch(from var(--sf-color-tertiary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-action:light-dark(var(--sf-color-action-source-light),var(--sf-color-action-source-dark,oklch(from var(--sf-color-action-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-neutral:light-dark(var(--sf-color-neutral-source-light),var(--sf-color-neutral-source-dark,oklch(from var(--sf-color-neutral-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-base:light-dark(var(--sf-color-base-source-light),var(--sf-color-base-source-dark,oklch(from var(--sf-color-base-source-light) clamp(.16, calc(1.18 - l), .24) calc(c * .5) h)));--sf-color-success:light-dark(var(--sf-color-success-source-light),var(--sf-color-success-source-dark,oklch(from var(--sf-color-success-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-warning:light-dark(var(--sf-color-warning-source-light),var(--sf-color-warning-source-dark,oklch(from var(--sf-color-warning-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-info:light-dark(var(--sf-color-info-source-light),var(--sf-color-info-source-dark,oklch(from var(--sf-color-info-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-danger:light-dark(var(--sf-color-danger-source-light),var(--sf-color-danger-source-dark,oklch(from var(--sf-color-danger-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-text:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.05, calc(l - .4 - var(--sf-contrast-bias)), .35) c h),oklch(from var(--sf-color-neutral) clamp(.7, calc(l + .25 + var(--sf-contrast-bias)), 1) c h));--sf-color-text--muted:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.35, calc(l - var(--sf-contrast-bias)), .62) c h),oklch(from var(--sf-color-neutral) clamp(.48, calc(l + var(--sf-contrast-bias)), .74) c h));--sf-color-text--secondary:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.15, calc(l - .25 - var(--sf-contrast-bias)), .45) c h),oklch(from var(--sf-color-neutral) clamp(.55, calc(l + .1 + var(--sf-contrast-bias)), .9) c h));--sf-color-text--placeholder:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.45, calc(l + .15), .75) c h),oklch(from var(--sf-color-neutral) clamp(.35, calc(l - .1), .65) c h));--sf-color-text--disabled:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.55, calc(l + .25), .82) c h),oklch(from var(--sf-color-neutral) clamp(.25, calc(l - .2), .55) c h));--sf-color-text--inverse:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.85, calc(l + .4), .98) c h),oklch(from var(--sf-color-neutral) clamp(.05, calc(l - .4), .35) c h));--sf-color-heading:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.05, calc(l - .4 - var(--sf-contrast-bias)), .35) c h),oklch(from var(--sf-color-neutral) clamp(.7, calc(l + .25 + var(--sf-contrast-bias)), 1) c h));--sf-color-border:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.7, calc(l + .35), .95) .005 h),oklch(from var(--sf-color-neutral) clamp(.25, calc(l - .3), .55) .005 h));--sf-color-border--subtle:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.75, calc(l + .4), .97) .005 h),oklch(from var(--sf-color-neutral) clamp(.2, calc(l - .38), .45) .005 h));--sf-color-border--strong:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.55, calc(l + .1), .85) .02 h),oklch(from var(--sf-color-neutral) clamp(.38, calc(l - .1), .65) .02 h));--sf-color-link:light-dark(oklch(from var(--sf-color-action) clamp(0, min(l - .07, .48), 1) c h),oklch(from var(--sf-color-action) clamp(.68, l, 1) c h));--sf-color-link--hover:light-dark(oklch(from var(--sf-color-action) clamp(0, min(l - .15, .4), 1) c h),oklch(from var(--sf-color-action) clamp(0, max(l + .1, .68), 1) c h));--sf-color-link--active:light-dark(oklch(from var(--sf-color-action) clamp(0, min(l - .21, .34), 1) c h),oklch(from var(--sf-color-action) clamp(0, max(l + .15, .74), 1) c h));--sf-color-link--visited:light-dark(oklch(from var(--sf-color-action) clamp(0, min(l - .07, .48), 1) c calc(h + 60)),oklch(from var(--sf-color-action) clamp(.68, l, 1) c calc(h + 60)));--sf-color-selection-bg:light-dark(oklch(from var(--sf-color-action-source-light) l c h / .28),oklch(from var(--sf-color-action-source-dark) clamp(.62, calc(.93 - l * .4), .78) c h / .55));--sf-color-selection-bg--alt:light-dark(oklch(from var(--sf-color-action-source-dark) clamp(.62, calc(.93 - l * .4), .78) c h / .55),oklch(from var(--sf-color-action-source-light) l c h / .28));--sf-color-selection-text--alt:inherit;--sf-color-success-strong:light-dark(oklch(from var(--sf-color-success-source-light) calc(l - .15) c h),oklch(from var(--sf-color-success) clamp(.7, calc(l + .15), 1) c h));--sf-color-warning-strong:light-dark(oklch(from var(--sf-color-warning-source-light) calc(l - .25) c h),oklch(from var(--sf-color-warning) clamp(.7, calc(l + .05), 1) c h));--sf-color-info-strong:light-dark(oklch(from var(--sf-color-info-source-light) calc(l - .1) c h),oklch(from var(--sf-color-info) clamp(.7, calc(l + .15), 1) c h));--sf-color-danger-strong:light-dark(oklch(from var(--sf-color-danger-source-light) calc(l - .1) c h),oklch(from var(--sf-color-danger) clamp(.7, calc(l + .15), 1) c h))}}@supports (color:oklch(from red l c h)){:root{--sf-color-bg:oklch(from var(--sf-color-base) calc(l + .02) c h);--sf-color-inset:oklch(from var(--sf-color-base) calc(l - .02) c h);--sf-color-raised:oklch(from var(--sf-color-base) calc(l + .04) c h);--sf-color-overlay:oklch(from var(--sf-color-base) l c h / .9);--sf-color-inverse:oklch(from var(--sf-color-base) calc(1 - l) c h);--sf-color-border--disabled:oklch(from var(--sf-color-border--subtle) l 0 h / .5);--sf-color-border--translucent:oklch(from var(--sf-color-neutral) l c h / .15);--sf-color-link--underline:oklch(from var(--sf-color-action) l c h / .3);--sf-color-bg--hover:oklch(from var(--sf-color-neutral) l c h / .08);--sf-color-bg--active:oklch(from var(--sf-color-neutral) l c h / .12);--sf-color-bg--selected:oklch(from var(--sf-color-action) l c h / .1);--sf-color-bg--focus:oklch(from var(--sf-color-action) l c h / .06);--sf-color-mark-bg:oklch(from var(--sf-color-warning) l c h / .25);--sf-color-success-subtle:oklch(from var(--sf-color-success) l c h / .12);--sf-color-success-muted:oklch(from var(--sf-color-success) l c h / .3);--sf-color-warning-subtle:oklch(from var(--sf-color-warning) l c h / .12);--sf-color-warning-muted:oklch(from var(--sf-color-warning) l c h / .3);--sf-color-info-subtle:oklch(from var(--sf-color-info) l c h / .1);--sf-color-info-muted:oklch(from var(--sf-color-info) l c h / .3);--sf-color-danger-subtle:oklch(from var(--sf-color-danger) l c h / .1);--sf-color-danger-muted:oklch(from var(--sf-color-danger) l c h / .3);--sf-gradient-primary:linear-gradient(in oklch 135deg, var(--sf-color-primary), oklch(from var(--sf-color-primary) calc(l - .08) c h));--sf-gradient-secondary:linear-gradient(in oklch 135deg, var(--sf-color-secondary), oklch(from var(--sf-color-secondary) calc(l - .08) c h));--sf-gradient-tertiary:linear-gradient(in oklch 135deg, var(--sf-color-tertiary), oklch(from var(--sf-color-tertiary) calc(l - .08) c h));--sf-gradient-brand:linear-gradient(in oklch 135deg, var(--sf-color-primary), oklch(from var(--sf-color-primary) l c calc(h + 30)));--sf-gradient-surface:linear-gradient(in oklab 180deg, var(--sf-color-surface), var(--sf-color-bg));--sf-gradient-fade--r:linear-gradient(in oklch to right, transparent, var(--sf-color-bg));--sf-gradient-fade--l:linear-gradient(in oklch to left, transparent, var(--sf-color-bg));--sf-gradient-fade--t:linear-gradient(in oklch to top, transparent, var(--sf-color-bg));--sf-gradient-fade--b:linear-gradient(in oklch to bottom, transparent, var(--sf-color-bg));--sf-shadow-glow:0 0 15px 2px oklch(from var(--sf-shadow-glow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7))}}@supports (color:oklch(from red l c h)) and (width:calc(1px * sign(1))){:root{--sf-color-code-text:oklch(from var(--sf-color-code-bg) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-primary:oklch(from var(--sf-color-primary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-secondary:oklch(from var(--sf-color-secondary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-tertiary:oklch(from var(--sf-color-tertiary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-action:oklch(from var(--sf-color-action) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-neutral:oklch(from var(--sf-color-neutral) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-success:oklch(from var(--sf-color-success) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-warning:oklch(from var(--sf-color-warning) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-info:oklch(from var(--sf-color-info) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-danger:oklch(from var(--sf-color-danger) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-inverse:oklch(from var(--sf-color-inverse) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0)}}@supports (color:oklch(from red l c h)){:root{--sf-palette-mix-50:4%;--sf-palette-mix-100:8%;--sf-palette-mix-200:20%;--sf-palette-mix-300:40%;--sf-palette-mix-400:65%;--sf-palette-mix-600:82%;--sf-palette-mix-700:62%;--sf-palette-mix-800:38%;--sf-palette-mix-900:18%;--sf-palette-mix-950:8%;--sf-color-primary-50:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-primary-100:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-primary-200:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-primary-300:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-primary-400:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-primary-500:var(--sf-color-primary);--sf-color-primary-600:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-primary-700:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-primary-800:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-primary-900:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-primary-950:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-primary-a5:oklch(from var(--sf-color-primary) l c h / .05);--sf-color-primary-a10:oklch(from var(--sf-color-primary) l c h / .1);--sf-color-primary-a30:oklch(from var(--sf-color-primary) l c h / .3);--sf-color-primary-a50:oklch(from var(--sf-color-primary) l c h / .5);--sf-color-primary-a80:oklch(from var(--sf-color-primary) l c h / .8);--sf-color-primary-superlight:var(--sf-color-primary-50);--sf-color-primary-xlight:var(--sf-color-primary-200);--sf-color-primary-lighter:var(--sf-color-primary-400);--sf-color-primary-darker:var(--sf-color-primary-600);--sf-color-primary-xdark:var(--sf-color-primary-800);--sf-color-primary-superdark:var(--sf-color-primary-950);--sf-color-primary--hover:var(--sf-color-primary-darker);--sf-color-primary--active:var(--sf-color-primary-xdark);--sf-color-primary-subtle:var(--sf-color-primary-a10);--sf-color-primary-muted:var(--sf-color-primary-a30);--sf-color-primary-ghost:var(--sf-color-primary-a5);--sf-color-secondary-50:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-secondary-100:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-secondary-200:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-secondary-300:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-secondary-400:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-secondary-500:var(--sf-color-secondary);--sf-color-secondary-600:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-secondary-700:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-secondary-800:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-secondary-900:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-secondary-950:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-secondary-a5:oklch(from var(--sf-color-secondary) l c h / .05);--sf-color-secondary-a10:oklch(from var(--sf-color-secondary) l c h / .1);--sf-color-secondary-a30:oklch(from var(--sf-color-secondary) l c h / .3);--sf-color-secondary-a50:oklch(from var(--sf-color-secondary) l c h / .5);--sf-color-secondary-a80:oklch(from var(--sf-color-secondary) l c h / .8);--sf-color-secondary-superlight:var(--sf-color-secondary-50);--sf-color-secondary-xlight:var(--sf-color-secondary-200);--sf-color-secondary-lighter:var(--sf-color-secondary-400);--sf-color-secondary-darker:var(--sf-color-secondary-600);--sf-color-secondary-xdark:var(--sf-color-secondary-800);--sf-color-secondary-superdark:var(--sf-color-secondary-950);--sf-color-secondary--hover:var(--sf-color-secondary-darker);--sf-color-secondary--active:var(--sf-color-secondary-xdark);--sf-color-secondary-subtle:var(--sf-color-secondary-a10);--sf-color-secondary-muted:var(--sf-color-secondary-a30);--sf-color-secondary-ghost:var(--sf-color-secondary-a5);--sf-color-tertiary-50:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-tertiary-100:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-tertiary-200:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-tertiary-300:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-tertiary-400:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-tertiary-500:var(--sf-color-tertiary);--sf-color-tertiary-600:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-tertiary-700:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-tertiary-800:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-tertiary-900:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-tertiary-950:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-tertiary-a5:oklch(from var(--sf-color-tertiary) l c h / .05);--sf-color-tertiary-a10:oklch(from var(--sf-color-tertiary) l c h / .1);--sf-color-tertiary-a30:oklch(from var(--sf-color-tertiary) l c h / .3);--sf-color-tertiary-a50:oklch(from var(--sf-color-tertiary) l c h / .5);--sf-color-tertiary-a80:oklch(from var(--sf-color-tertiary) l c h / .8);--sf-color-tertiary-superlight:var(--sf-color-tertiary-50);--sf-color-tertiary-xlight:var(--sf-color-tertiary-200);--sf-color-tertiary-lighter:var(--sf-color-tertiary-400);--sf-color-tertiary-darker:var(--sf-color-tertiary-600);--sf-color-tertiary-xdark:var(--sf-color-tertiary-800);--sf-color-tertiary-superdark:var(--sf-color-tertiary-950);--sf-color-tertiary--hover:var(--sf-color-tertiary-darker);--sf-color-tertiary--active:var(--sf-color-tertiary-xdark);--sf-color-tertiary-subtle:var(--sf-color-tertiary-a10);--sf-color-tertiary-muted:var(--sf-color-tertiary-a30);--sf-color-tertiary-ghost:var(--sf-color-tertiary-a5);--sf-color-action-50:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-action-100:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-action-200:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-action-300:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-action-400:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-action-500:var(--sf-color-action);--sf-color-action-600:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-action-700:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-action-800:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-action-900:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-action-950:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-action-a5:oklch(from var(--sf-color-action) l c h / .05);--sf-color-action-a10:oklch(from var(--sf-color-action) l c h / .1);--sf-color-action-a30:oklch(from var(--sf-color-action) l c h / .3);--sf-color-action-a50:oklch(from var(--sf-color-action) l c h / .5);--sf-color-action-a80:oklch(from var(--sf-color-action) l c h / .8);--sf-color-action-superlight:var(--sf-color-action-50);--sf-color-action-xlight:var(--sf-color-action-200);--sf-color-action-lighter:var(--sf-color-action-400);--sf-color-action-darker:var(--sf-color-action-600);--sf-color-action-xdark:var(--sf-color-action-800);--sf-color-action-superdark:var(--sf-color-action-950);--sf-color-action--hover:var(--sf-color-action-darker);--sf-color-action--active:var(--sf-color-action-xdark);--sf-color-action-subtle:var(--sf-color-action-a10);--sf-color-action-muted:var(--sf-color-action-a30);--sf-color-action-ghost:var(--sf-color-action-a5);--sf-color-neutral-50:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-neutral-100:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-neutral-200:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-neutral-300:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-neutral-400:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-neutral-500:var(--sf-color-neutral);--sf-color-neutral-600:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-neutral-700:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-neutral-800:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-neutral-900:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-neutral-950:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-neutral-a5:oklch(from var(--sf-color-neutral) l c h / .05);--sf-color-neutral-a10:oklch(from var(--sf-color-neutral) l c h / .1);--sf-color-neutral-a30:oklch(from var(--sf-color-neutral) l c h / .3);--sf-color-neutral-a50:oklch(from var(--sf-color-neutral) l c h / .5);--sf-color-neutral-a80:oklch(from var(--sf-color-neutral) l c h / .8);--sf-color-neutral-superlight:var(--sf-color-neutral-50);--sf-color-neutral-xlight:var(--sf-color-neutral-200);--sf-color-neutral-lighter:var(--sf-color-neutral-400);--sf-color-neutral-darker:var(--sf-color-neutral-600);--sf-color-neutral-xdark:var(--sf-color-neutral-800);--sf-color-neutral-superdark:var(--sf-color-neutral-950);--sf-color-neutral--hover:var(--sf-color-neutral-darker);--sf-color-neutral--active:var(--sf-color-neutral-xdark);--sf-color-neutral-subtle:var(--sf-color-neutral-a10);--sf-color-neutral-muted:var(--sf-color-neutral-a30);--sf-color-neutral-ghost:var(--sf-color-neutral-a5);--sf-color-base-50:oklch(from var(--sf-color-base) .97 c h);--sf-color-base-100:oklch(from var(--sf-color-base) .94 c h);--sf-color-base-200:oklch(from var(--sf-color-base) .88 c h);--sf-color-base-300:oklch(from var(--sf-color-base) .78 c h);--sf-color-base-400:oklch(from var(--sf-color-base) .65 c h);--sf-color-base-500:oklch(from var(--sf-color-base) .5 c h);--sf-color-base-600:oklch(from var(--sf-color-base) .37 c h);--sf-color-base-700:oklch(from var(--sf-color-base) .27 c h);--sf-color-base-800:oklch(from var(--sf-color-base) .17 c h);--sf-color-base-900:oklch(from var(--sf-color-base) .11 c h);--sf-color-base-950:oklch(from var(--sf-color-base) .06 c h);--sf-color-base-a5:oklch(from var(--sf-color-base) l c h / .05);--sf-color-base-a10:oklch(from var(--sf-color-base) l c h / .1);--sf-color-base-a30:oklch(from var(--sf-color-base) l c h / .3);--sf-color-base-a50:oklch(from var(--sf-color-base) l c h / .5);--sf-color-base-a80:oklch(from var(--sf-color-base) l c h / .8);--sf-color-base--hover:oklch(from var(--sf-color-base) clamp(.01, calc(l - .04 + var(--sf-is-dark) * .08), .99) c h);--sf-color-base--active:oklch(from var(--sf-color-base) clamp(.01, calc(l - .08 + var(--sf-is-dark) * .16), .99) c h);--sf-color-base-subtle:var(--sf-color-base-a10);--sf-color-base-muted:var(--sf-color-base-a30);--sf-color-base-ghost:var(--sf-color-base-a5)}}:root{--sf-space-scale:1;--sf-text-scale:1;--sf-text-display-scale:1;--sf-radius-scale:1;--sf-motion-scale:1;--sf-section-scale:1;--sf-font-body:system-ui, -apple-system, sans-serif;--sf-font-heading:var(--sf-font-body);--sf-font-display:var(--sf-font-heading);--sf-font-mono:ui-monospace, monospace;--sf-font-humanist:"Seravek", "Gill Sans Nova", "Ubuntu", "Calibri", "DejaVu Sans", source-sans-pro, sans-serif;--sf-font-geometric:"Avenir", "Montserrat", "Corbel", "URW Gothic", source-sans-pro, sans-serif;--sf-font-slab:"Rockwell", "Rockwell Nova", "Roboto Slab", "DejaVu Serif", "Sitka Small", serif;--sf-font-features:normal;--sf-font-variation:normal;--sf-optical-sizing:auto;--sf-font-weight-light:300;--sf-font-weight-normal:400;--sf-font-weight-medium:500;--sf-font-weight-semibold:600;--sf-font-weight-bold:700;--sf-font-weight-body:var(--sf-font-weight-normal);--sf-font-weight-heading:var(--sf-font-weight-semibold);--sf-font-weight-display:var(--sf-font-weight-bold);--sf-font-weight-interactive:var(--sf-font-weight-semibold);--sf-font-weight-strong:var(--sf-font-weight-bold);--sf-current-font-weight:var(--sf-font-weight-bold);--sf-text-2xs:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale));--sf-text-xs:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale));--sf-text-s:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale));--sf-text-m:calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale));--sf-text-l:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale));--sf-text-xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale));--sf-text-2xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale));--sf-text-3xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale));--sf-text-4xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale));--sf-text-display-s:calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale));--sf-text-display-m:calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale));--sf-text-display-l:calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale));--sf-leading-tight:1.1;--sf-leading-snug:1.3;--sf-leading-normal:1.5;--sf-leading-relaxed:1.625;--sf-leading-taper:0;--sf-display-s-line-height:var(--sf-leading-tight);--sf-display-m-line-height:1.05;--sf-display-l-line-height:1;--sf-tracking-tight:-.025em;--sf-tracking-normal:0;--sf-tracking-wide:.025em;--sf-tracking-wider:.05em;--sf-tracking-widest:.1em;--sf-font-numeric:tabular-nums;--sf-text-2xs-line-height:var(--sf-leading-relaxed);--sf-text-2xs-font-weight:var(--sf-font-weight-body);--sf-text-2xs-letter-spacing:var(--sf-tracking-normal);--sf-text-2xs-max-width:55ch;--sf-text-xs-line-height:calc(var(--sf-leading-relaxed) - 1 * var(--sf-leading-taper));--sf-text-xs-font-weight:var(--sf-font-weight-body);--sf-text-xs-letter-spacing:var(--sf-tracking-normal);--sf-text-xs-max-width:60ch;--sf-text-s-line-height:calc(var(--sf-leading-relaxed) - 2 * var(--sf-leading-taper));--sf-text-s-font-weight:var(--sf-font-weight-body);--sf-text-s-letter-spacing:var(--sf-tracking-normal);--sf-text-s-max-width:65ch;--sf-text-m-line-height:calc(var(--sf-leading-normal) - 3 * var(--sf-leading-taper));--sf-text-m-font-weight:var(--sf-font-weight-body);--sf-text-m-letter-spacing:var(--sf-tracking-normal);--sf-text-m-max-width:65ch;--sf-text-l-line-height:calc(var(--sf-leading-normal) - 4 * var(--sf-leading-taper));--sf-text-l-font-weight:var(--sf-font-weight-body);--sf-text-l-letter-spacing:var(--sf-tracking-normal);--sf-text-l-max-width:none;--sf-text-xl-line-height:calc(var(--sf-leading-snug) - 5 * var(--sf-leading-taper));--sf-text-xl-font-weight:var(--sf-font-weight-body);--sf-text-xl-letter-spacing:var(--sf-tracking-normal);--sf-text-xl-max-width:none;--sf-text-2xl-line-height:calc(var(--sf-leading-snug) - 6 * var(--sf-leading-taper));--sf-text-2xl-font-weight:var(--sf-font-weight-heading);--sf-text-2xl-letter-spacing:var(--sf-tracking-normal);--sf-text-2xl-max-width:none;--sf-text-3xl-line-height:calc(var(--sf-leading-tight) - 7 * var(--sf-leading-taper));--sf-text-3xl-font-weight:var(--sf-font-weight-heading);--sf-text-3xl-letter-spacing:var(--sf-tracking-tight);--sf-text-3xl-max-width:none;--sf-text-4xl-line-height:calc(var(--sf-leading-tight) - 8 * var(--sf-leading-taper));--sf-text-4xl-font-weight:var(--sf-font-weight-heading);--sf-text-4xl-letter-spacing:var(--sf-tracking-tight);--sf-text-4xl-max-width:none;--sf-icon-xs:.875em;--sf-icon-s:1em;--sf-icon-m:1.5em;--sf-icon-l:2em;--sf-icon-xl:3em;--sf-icon-2xl:4em;--sf-space-none:0;--sf-space-px:1px;--sf-space-2xs:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale));--sf-space-xs:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale));--sf-space-s:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale));--sf-space-m:calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale));--sf-space-l:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale));--sf-space-xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale));--sf-space-2xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale));--sf-space-3xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale));--sf-space-4xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale));--sf-size-xs:1.5rem;--sf-size-s:2rem;--sf-size-m:2.5rem;--sf-size-l:2.75rem;--sf-size-xl:3.5rem;--sf-container-narrow:38rem;--sf-container-prose:65ch;--sf-container-default:75rem;--sf-container-wide:90rem;--sf-container-full:100%;--sf-ratio-square:1;--sf-ratio-video:16 / 9;--sf-ratio-cinema:21 / 9;--sf-ratio-4-3:4 / 3;--sf-ratio-3-2:3 / 2;--sf-ratio-portrait:3 / 4;--sf-ratio-golden:1.618 / 1;--sf-border-scale:1;--sf-border-width-hairline:.5px;--sf-border-width-1:calc(1px * var(--sf-border-scale,1));--sf-border-width-2:calc(2px * var(--sf-border-scale,1));--sf-border-width-3:calc(3px * var(--sf-border-scale,1));--sf-border-width-4:calc(4px * var(--sf-border-scale,1));--sf-border-style:solid;--sf-border:var(--sf-border-width-1) var(--sf-border-style) var(--sf-color-border);--sf-border-subtle:var(--sf-border-width-1) var(--sf-border-style) var(--sf-color-border--subtle);--sf-border-strong:var(--sf-border-width-1) var(--sf-border-style) var(--sf-color-border--strong);--sf-divider-width:var(--sf-border-width-1);--sf-divider-style:solid;--sf-divider-color:var(--sf-color-border);--sf-divider-gap:var(--sf-space-m);--sf-radius-none:0;--sf-radius-2xs:calc(1px * var(--sf-radius-scale));--sf-radius-xs:calc(2px * var(--sf-radius-scale));--sf-radius-s:calc(4px * var(--sf-radius-scale));--sf-radius-m:calc(8px * var(--sf-radius-scale));--sf-radius-l:calc(12px * var(--sf-radius-scale));--sf-radius-xl:calc(16px * var(--sf-radius-scale));--sf-radius-2xl:calc(24px * var(--sf-radius-scale));--sf-radius-3xl:calc(32px * var(--sf-radius-scale));--sf-radius-4xl:calc(48px * var(--sf-radius-scale));--sf-radius-full:9999px;--sf-radius-pill:var(--sf-radius-full);--sf-radius-outer:calc(var(--sf-radius-m) + var(--sf-component-pad));--sf-media-radius:0;--sf-blur:12px;--sf-opacity-muted:.5;--sf-duration-none:0s;--sf-duration-instant:calc(.1s * var(--sf-motion-scale));--sf-duration-fast:calc(.15s * var(--sf-motion-scale));--sf-duration-normal:calc(.25s * var(--sf-motion-scale));--sf-duration-slow:calc(.4s * var(--sf-motion-scale));--sf-duration-slower:calc(.6s * var(--sf-motion-scale));--sf-theme-transition-duration:calc(.3s * var(--sf-motion-scale));--sf-ease-linear:linear;--sf-ease-out:cubic-bezier(.25, 0, .15, 1);--sf-ease-in:cubic-bezier(.5, 0, .75, .25);--sf-ease-in-out:cubic-bezier(.4, 0, .2, 1);--sf-ease-spring:linear(0, .5, 1.1, .95, 1.02, 1);--sf-ease-elastic:linear(0, .3, 1.2, .9, 1.05, 1);--sf-ease-bounce:linear(0, .35 18%, 1 32%, .86 42%, 1.02 56%, .98 72%, 1);--sf-ease-overshoot:linear(0, .6 30%, 1.08 55%, .98 75%, 1);--sf-animation-fade-in:sf-fade-in var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-fade-out:sf-fade-out var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-in-up:sf-slide-in-up var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-slide-in-down:sf-slide-in-down var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-slide-in-left:sf-slide-in-left var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-slide-in-right:sf-slide-in-right var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-scale-up:sf-scale-up var(--sf-duration-normal) var(--sf-ease-overshoot) both;--sf-animation-scale-down:sf-scale-down var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-out-up:sf-slide-out-up var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-out-down:sf-slide-out-down var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-out-left:sf-slide-out-left var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-out-right:sf-slide-out-right var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-color-pulse:sf-color-pulse var(--sf-duration-slow) var(--sf-ease-in-out) infinite;--sf-animation-ping:sf-ping var(--sf-duration-slow) var(--sf-ease-out) infinite;--sf-animation-blink:sf-blink calc(1s * var(--sf-motion-scale)) steps(1, end) infinite;--sf-animation-float:sf-float calc(3s * var(--sf-motion-scale)) var(--sf-ease-in-out) infinite;--sf-animation-spin:sf-spin var(--sf-duration-slower) linear infinite;--sf-animation-shimmer:sf-shimmer calc(1.5s * var(--sf-motion-scale)) var(--sf-ease-in-out) infinite;--sf-animation-delay-1:calc(75ms * var(--sf-motion-scale));--sf-animation-delay-2:calc(.15s * var(--sf-motion-scale));--sf-animation-delay-3:calc(.225s * var(--sf-motion-scale));--sf-animation-delay-4:calc(.3s * var(--sf-motion-scale));--sf-animation-delay-5:calc(.375s * var(--sf-motion-scale));--sf-scroll-timeline-range-start:entry 0%;--sf-scroll-timeline-range-end:cover 30%;--sf-scroll-timeline-range-exit-start:cover 70%;--sf-scroll-timeline-range-exit-end:exit 100%;--sf-mask-scrim-start:var(--sf-space-l);--sf-mask-scrim-end:var(--sf-space-l);--sf-z-below:-1;--sf-z-base:0;--sf-z-raised:1;--sf-z-sticky:1000;--sf-z-fixed:1010;--sf-z-dropdown:1020;--sf-z-overlay:1030;--sf-z-modal:1040;--sf-z-toast:1050;--sf-z-tooltip:1060;--sf-header-height-mobile:3.5rem;--sf-header-height-desktop:5rem;--sf-header-height:clamp(var(--sf-header-height-mobile), calc((var(--sf-header-height-desktop) - var(--sf-header-height-mobile)) / ((var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * 1rem) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-header-height-mobile)), var(--sf-header-height-desktop));--sf-sticky-offset-mobile:var(--sf-header-height-mobile);--sf-sticky-offset-desktop:var(--sf-header-height-desktop);--sf-sticky-offset:clamp(var(--sf-sticky-offset-mobile), calc((var(--sf-sticky-offset-desktop) - var(--sf-sticky-offset-mobile)) / ((var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * 1rem) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-sticky-offset-mobile)), var(--sf-sticky-offset-desktop));--sf-focus-ring-width:2px;--sf-focus-ring-offset:2px;--sf-focus-ring-style:solid;--sf-touch-target:var(--sf-size-l);--sf-contrast-bias:0;--sf-contrast-threshold:.6;--sf-safe-top:env(safe-area-inset-top,0px);--sf-safe-bottom:env(safe-area-inset-bottom,0px);--sf-safe-left:env(safe-area-inset-left,0px);--sf-safe-right:env(safe-area-inset-right,0px);--sf-print-page-margin:2cm;--sf-print-page-size:a4;--sf-print-base-size:11pt;--sf-object-fit:cover;--sf-object-position:50% 50%}@supports (color:oklch(from red l c h)){:root{--sf-shadow-color:oklch(from var(--sf-color-neutral) var(--sf-shadow-lightness) c h);--sf-shadow-none:none;--sf-shadow-xs:0 1px 2px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7));--sf-shadow-s:0 1px 2px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7)), 0 2px 6px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, var(--sf-shadow-strength), .7));--sf-shadow-m:0 1px 3px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7)), 0 4px 12px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7));--sf-shadow-l:0 2px 4px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7)), 0 8px 24px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), .7)), 0 16px 48px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7));--sf-shadow-xl:0 2px 8px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7)), 0 12px 36px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3.5), .7)), 0 24px 72px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), .7));--sf-shadow-2xl:0 4px 12px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .6), .7)), 0 20px 60px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 4), .7)), 0 40px 100px -8px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 5), .7));--sf-shadow-inner:inset 0 2px 4px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7));--sf-text-shadow-none:none;--sf-text-shadow-xs:0 .5px 1px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1), .7));--sf-text-shadow-s:0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), .7));--sf-text-shadow-m:0 2px 4px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7));--sf-text-shadow-l:0 4px 8px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), .7));--sf-text-shadow-xl:0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), .7));--sf-drop-shadow-xs:drop-shadow(0 .5px 1px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1), .7)));--sf-drop-shadow-s:drop-shadow(0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), .7)));--sf-drop-shadow-m:drop-shadow(0 4px 6px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7)));--sf-drop-shadow-l:drop-shadow(0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), .7)));--sf-drop-shadow-xl:drop-shadow(0 16px 32px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), .7)))}}:root{--sf-body-font-size:var(--sf-text-m);--sf-body-line-height:var(--sf-leading-normal);--sf-body-font-weight:var(--sf-font-weight-body);--sf-body-font-family:var(--sf-font-body);--sf-body-color:var(--sf-color-text);--sf-body-text-wrap:pretty;--sf-body-strong-weight:var(--sf-font-weight-strong);--sf-body-em-style:italic;--sf-code-font-size:.875em;--sf-heading-font-family:var(--sf-font-heading);--sf-heading-color:var(--sf-color-heading);--sf-heading-text-wrap:balance;--sf-h1-size:var(--sf-text-4xl);--sf-h1-line-height:var(--sf-leading-tight);--sf-h1-font-weight:var(--sf-font-weight-heading);--sf-h1-letter-spacing:var(--sf-tracking-tight);--sf-h2-size:var(--sf-text-3xl);--sf-h2-line-height:var(--sf-leading-tight);--sf-h2-font-weight:var(--sf-font-weight-heading);--sf-h2-letter-spacing:var(--sf-tracking-tight);--sf-h3-size:var(--sf-text-2xl);--sf-h3-line-height:var(--sf-leading-snug);--sf-h3-font-weight:var(--sf-font-weight-heading);--sf-h3-letter-spacing:var(--sf-tracking-normal);--sf-h4-size:var(--sf-text-xl);--sf-h4-line-height:var(--sf-leading-snug);--sf-h4-font-weight:var(--sf-font-weight-heading);--sf-h4-letter-spacing:var(--sf-tracking-normal);--sf-h5-size:var(--sf-text-l);--sf-h5-line-height:var(--sf-leading-normal);--sf-h5-font-weight:var(--sf-font-weight-heading);--sf-h5-letter-spacing:var(--sf-tracking-normal);--sf-h6-size:var(--sf-text-m);--sf-h6-line-height:var(--sf-leading-normal);--sf-h6-font-weight:var(--sf-font-weight-heading);--sf-h6-letter-spacing:var(--sf-tracking-wide);--sf-h1-max-width:none;--sf-h2-max-width:none;--sf-h3-max-width:none;--sf-h4-max-width:none;--sf-h5-max-width:none;--sf-h6-max-width:none;--sf-gap:var(--sf-space-m);--sf-content-gap:var(--sf-space-s);--sf-gutter:var(--sf-space-l);--sf-component-pad:var(--sf-space-m);--sf-field-block:var(--sf-space-l);--sf-field-required-marker:" *";--sf-link-external-marker:" ↗";--sf-link-external-label:"opens in a new window or external site";--sf-section-pad:var(--sf-section-pad--m);--sf-section-pad--xs:calc(var(--sf-space-xl) * var(--sf-section-scale));--sf-section-pad--s:calc(var(--sf-space-2xl) * var(--sf-section-scale));--sf-section-pad--m:calc(var(--sf-space-3xl) * var(--sf-section-scale));--sf-section-pad--l:calc(var(--sf-space-4xl) * var(--sf-section-scale));--sf-section-pad--xl:calc(var(--sf-space-4xl) * 1.5 * var(--sf-section-scale));--sf-section-pad--2xl:calc(var(--sf-space-4xl) * 2 * var(--sf-section-scale));--sf-transition-colors:color var(--sf-duration-normal) var(--sf-ease-out), background-color var(--sf-duration-normal) var(--sf-ease-out), border-color var(--sf-duration-normal) var(--sf-ease-out), text-decoration-color var(--sf-duration-normal) var(--sf-ease-out), fill var(--sf-duration-normal) var(--sf-ease-out), stroke var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-form-field:color var(--sf-duration-normal) var(--sf-ease-out), background-color var(--sf-duration-normal) var(--sf-ease-out), text-decoration-color var(--sf-duration-normal) var(--sf-ease-out), fill var(--sf-duration-normal) var(--sf-ease-out), stroke var(--sf-duration-normal) var(--sf-ease-out), border-color var(--sf-duration-fast) var(--sf-ease-out), box-shadow var(--sf-duration-fast) var(--sf-ease-out), opacity var(--sf-duration-fast) var(--sf-ease-out);--sf-transition-transform:transform var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-opacity:opacity var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-shadow:box-shadow var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-fast:color var(--sf-duration-fast) var(--sf-ease-out), background-color var(--sf-duration-fast) var(--sf-ease-out), border-color var(--sf-duration-fast) var(--sf-ease-out), box-shadow var(--sf-duration-fast) var(--sf-ease-out), opacity var(--sf-duration-fast) var(--sf-ease-out), transform var(--sf-duration-fast) var(--sf-ease-out), filter var(--sf-duration-fast) var(--sf-ease-out);--sf-transition-slow:color var(--sf-duration-slow) var(--sf-ease-in-out), background-color var(--sf-duration-slow) var(--sf-ease-in-out), border-color var(--sf-duration-slow) var(--sf-ease-in-out), box-shadow var(--sf-duration-slow) var(--sf-ease-in-out), opacity var(--sf-duration-slow) var(--sf-ease-in-out), transform var(--sf-duration-slow) var(--sf-ease-in-out), filter var(--sf-duration-slow) var(--sf-ease-in-out);--sf-transition-enter:color var(--sf-duration-normal) var(--sf-ease-out), background-color var(--sf-duration-normal) var(--sf-ease-out), border-color var(--sf-duration-normal) var(--sf-ease-out), box-shadow var(--sf-duration-normal) var(--sf-ease-out), opacity var(--sf-duration-normal) var(--sf-ease-out), transform var(--sf-duration-normal) var(--sf-ease-out), filter var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-exit:color var(--sf-duration-fast) var(--sf-ease-in), background-color var(--sf-duration-fast) var(--sf-ease-in), border-color var(--sf-duration-fast) var(--sf-ease-in), box-shadow var(--sf-duration-fast) var(--sf-ease-in), opacity var(--sf-duration-fast) var(--sf-ease-in), transform var(--sf-duration-fast) var(--sf-ease-in), filter var(--sf-duration-fast) var(--sf-ease-in);--sf-transition-overlay:overlay var(--sf-duration-normal) allow-discrete, display var(--sf-duration-normal) allow-discrete;--sf-stack-gap:var(--sf-content-gap);--sf-box-padding:var(--sf-space-m);--sf-box-border-width:0;--sf-box-border-color:var(--sf-color-border);--sf-center-max:var(--sf-container-default);--sf-center-gutter:var(--sf-gutter);--sf-cluster-gap:var(--sf-gap);--sf-cluster-align:center;--sf-cluster-justify:flex-start;--sf-sidebar-gap:var(--sf-gap);--sf-sidebar-min-width:50%;--sf-sidebar-width:18rem;--sf-switcher-threshold:30rem;--sf-switcher-gap:var(--sf-gap);--sf-grid-min:16rem;--sf-grid-gap:var(--sf-gap);--sf-grid-min-xs:10rem;--sf-grid-min-s:13rem;--sf-grid-min-m:16rem;--sf-grid-min-l:20rem;--sf-grid-min-xl:24rem;--sf-grid-min-2xl:28rem;--sf-equal-min-col:16rem;--sf-equal-gap:var(--sf-gap);--sf-equal-rule-width:0;--sf-equal-rule-style:solid;--sf-equal-rule-color:var(--sf-color-border);--sf-cover-min-height:100dvh;--sf-cover-padding:var(--sf-section-pad);--sf-frame-ratio:16 / 9;--sf-bg-layer-inset:0px;--sf-bg-layer-fit:cover;--sf-bg-layer-position:50% 50%;--sf-bg-layer-radius:0;--sf-bg-layer-z:-2;--sf-icon-box-pad:.5em;--sf-icon-box-radius:var(--sf-radius-s);--sf-icon-box-bg:var(--sf-color-inset);--sf-icon-box-border:var(--sf-border-width-1) solid var(--sf-color-border);--sf-reel-item-width:max-content;--sf-reel-gap:var(--sf-gap);--sf-reel-height:auto;--sf-imposter-margin:var(--sf-space-m);--sf-bento-cols-default:4;--sf-bento-row-default:10rem;--sf-bento-row-compact:6rem;--sf-bento-row-tall:16rem;--sf-bento-gap:var(--sf-gap);--sf-breakout-width:var(--sf-container-wide);--sf-content-width:var(--sf-container-default);--sf-prose-paragraph:var(--sf-content-gap);--sf-alternate-gap:var(--sf-content-gap);--sf-alternate-inner-gap:var(--sf-gap);--sf-flow-space:var(--sf-content-gap);--sf-line-clamp:3;--sf-aspect:16 / 9;--sf-prose-heading-gap:var(--sf-space-s);--sf-prose-list-gap:var(--sf-space-xs);--sf-prose-block-margin:var(--sf-space-m);--sf-prose-media-margin:var(--sf-space-m);--sf-prose-media-radius:var(--sf-radius-m);--sf-prose-figure-margin:var(--sf-space-l);--sf-prose-marker-color:var(--sf-color-primary);--sf-prose-figcaption-size:var(--sf-text-s);--sf-prose-blockquote-padding:var(--sf-space-m);--sf-prose-blockquote-border:var(--sf-border-width-2) solid var(--sf-color-border--subtle);--sf-prose-hr-margin:var(--sf-space-l);--sf-prose-nested-list-gap:var(--sf-space-2xs);--sf-prose-table-pad:var(--sf-space-xs);--sf-surface-color:var(--sf-color-base);--sf-scroll-shadow-size:2rem;--sf-content-intrinsic-size:500px;--sf-scrim-color:#0000008c;--sf-scrim-direction:to top;--sf-scrim-gradient:linear-gradient(var(--sf-scrim-direction), var(--sf-scrim-color), transparent);--sf-scrim-text-shadow:0 1px 3px #0009;--sf-surface-bg-color:transparent;--sf-surface-bg-image:none;--sf-surface-bg-overlay:none;--sf-surface-bg-size:cover;--sf-surface-bg-position:center;--sf-surface-bg-repeat:no-repeat;--sf-surface-bg-attachment:scroll;--sf-surface-bg-animation:none;--sf-corner-scoop-size:var(--sf-radius-2xl);--sf-corner-scoop-at:100% 0;--sf-overlap-pull:var(--sf-space-xl)}@supports (color:lab(0% 0 0)){:root{--sf-scrim-color:lab(0% 0 0/.55);--sf-scrim-text-shadow:0 1px 3px lab(0% 0 0/.6)}}:root{--sf-card-padding:var(--sf-space-l);--sf-card-gap:var(--sf-space-m);--sf-card-radius:var(--sf-radius-m);--sf-card-radius-outer:calc(var(--sf-card-radius) + var(--sf-card-padding));--sf-card-bg:var(--sf-color-surface);--sf-card-border-width:var(--sf-border-width-1);--sf-card-border-color:var(--sf-color-border);--sf-card-shadow:var(--sf-shadow-s);--sf-card-shadow--elevated:var(--sf-shadow-l);--sf-card-shadow--hover:var(--sf-shadow-l);--sf-card-media-ratio:var(--sf-ratio-video);--sf-card-media-radius:var(--sf-card-radius,var(--sf-radius-m));--sf-card-heading-size:var(--sf-text-xl);--sf-card-btn-font-size:var(--sf-text-s);--sf-field-radius:var(--sf-radius-m);--sf-field-padding-block:var(--sf-space-xs);--sf-field-padding-inline:var(--sf-space-s);--sf-btn-radius:var(--sf-radius-m);--sf-btn-padding-block:var(--sf-space-xs);--sf-btn-padding-inline:var(--sf-space-m);--sf-btn-gap:var(--sf-space-2xs);--sf-btn-font-size:var(--sf-text-m);--sf-btn-font-weight:var(--sf-font-weight-interactive);--sf-btn-min-height:var(--sf-touch-target);--sf-btn-border-width:var(--sf-border-width-1)}}@layer slashed.reset,slashed.base,slashed.forms;@layer slashed.layout{.sf-section{padding-block:var(--sf-section-pad)}.sf-section--xs{--sf-section-pad:var(--sf-section-pad--xs)}.sf-section--s{--sf-section-pad:var(--sf-section-pad--s)}.sf-section--m{--sf-section-pad:var(--sf-section-pad--m)}.sf-section--l{--sf-section-pad:var(--sf-section-pad--l)}.sf-section--xl{--sf-section-pad:var(--sf-section-pad--xl)}.sf-section--2xl{--sf-section-pad:var(--sf-section-pad--2xl)}.sf-section--guttered{padding-inline:var(--sf-gutter)}.sf-section--guttered .sf-container{padding-inline:0}.sf-section-group>.sf-section+.sf-section{padding-block-start:0}.sf-header--xs{padding-block:var(--sf-space-xs)}.sf-header--s{padding-block:var(--sf-space-s)}.sf-header--m{padding-block:var(--sf-space-m)}.sf-header--l{padding-block:var(--sf-space-l)}.sf-header--xl{padding-block:var(--sf-space-xl)}.sf-section--collapse:has(+.sf-section--collapse){padding-block-end:calc(var(--sf-section-pad) / 2)}.sf-section--collapse+.sf-section--collapse{padding-block-start:calc(var(--sf-section-pad) / 2)}.sf-divider{border:none;border-block-start:var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color);margin-block:var(--sf-divider-gap)}.sf-divider--vertical{border-block-start:none;border-inline-start:var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color);margin-block:0;margin-inline:var(--sf-divider-gap);align-self:stretch}.sf-divider--soft{--sf-divider-color:var(--sf-color-border--subtle)}.sf-divider--strong{--sf-divider-color:var(--sf-color-border--strong)}.sf-divider--dashed{--sf-divider-style:dashed}.sf-divider--dotted{--sf-divider-style:dotted}.sf-divider--gradient{block-size:var(--sf-divider-width);background:linear-gradient(to right, transparent, var(--sf-divider-color), transparent);border:none}.sf-divide>*+*{border-block-start:var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color)}.sf-divide--vertical>*+*{border-block-start:none;border-inline-start:var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color)}.sf-container{width:100%;max-width:var(--sf-container-default);padding-inline:var(--sf-gutter);margin-inline:auto;container:sf-layout/inline-size}.sf-container--narrow{max-width:var(--sf-container-narrow)}.sf-container--prose{max-width:var(--sf-container-prose)}.sf-container--wide{max-width:var(--sf-container-wide)}.sf-container--full{max-width:var(--sf-container-full)}.sf-cq{container-type:inline-size}.sf-overlay{position:absolute;inset:0}.sf-fluid-cq{container-type:inline-size}.sf-fluid-cq>*{--sf-fluid-width:100cqi;--sf-text-2xs:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale));--sf-text-xs:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale));--sf-text-s:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale));--sf-text-m:calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale));--sf-text-l:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale));--sf-text-xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale));--sf-text-2xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale));--sf-text-3xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale));--sf-text-4xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale));--sf-text-display-s:calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale));--sf-text-display-m:calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale));--sf-text-display-l:calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale));--sf-space-2xs:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale));--sf-space-xs:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale));--sf-space-s:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale));--sf-space-m:calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale));--sf-space-l:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale));--sf-space-xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale));--sf-space-2xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale));--sf-space-3xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale));--sf-space-4xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale))}.sf-stack{gap:var(--sf-stack-gap);flex-direction:column;display:flex}.sf-stack--xs{gap:var(--sf-space-xs)}.sf-stack--s{gap:var(--sf-space-s)}.sf-stack--m{gap:var(--sf-space-m)}.sf-stack--l{gap:var(--sf-space-l)}.sf-stack--xl{gap:var(--sf-space-xl)}.sf-stack--2xl{gap:var(--sf-space-2xl)}.sf-stack--center{align-items:center}.sf-stack--end{align-items:flex-end}.sf-stack--stretch{align-items:stretch}.sf-gap{gap:var(--sf-gap)}.sf-gap--xs{gap:var(--sf-space-xs)}.sf-gap--s{gap:var(--sf-space-s)}.sf-gap--m{gap:var(--sf-space-m)}.sf-gap--l{gap:var(--sf-space-l)}.sf-gap--xl{gap:var(--sf-space-xl)}.sf-gap--2xl{gap:var(--sf-space-2xl)}.sf-box{padding:var(--sf-box-padding);outline:var(--sf-box-border-width) solid var(--sf-box-border-color)}.sf-center{box-sizing:content-box;width:auto;max-inline-size:var(--sf-center-max);padding-inline:var(--sf-center-gutter);margin-inline:auto}.sf-center--intrinsic{flex-direction:column;align-items:center;display:flex}.sf-cluster{gap:var(--sf-cluster-gap);align-items:var(--sf-cluster-align);justify-content:var(--sf-cluster-justify);flex-wrap:wrap;display:flex}.sf-cluster--xs{gap:var(--sf-space-xs)}.sf-cluster--s{gap:var(--sf-space-s)}.sf-cluster--m{gap:var(--sf-space-m)}.sf-cluster--l{gap:var(--sf-space-l)}.sf-cluster--xl{gap:var(--sf-space-xl)}.sf-cluster--2xl{gap:var(--sf-space-2xl)}.sf-cluster--no-wrap{flex-wrap:nowrap}.sf-cluster--center{justify-content:center}.sf-cluster--end{justify-content:flex-end}.sf-cluster--between{justify-content:space-between}.sf-sidebar{gap:var(--sf-sidebar-gap);flex-wrap:wrap;display:flex}.sf-sidebar>:first-child{flex-basis:var(--sf-sidebar-width);flex-grow:1}.sf-sidebar>:last-child,.sf-sidebar--right>:first-child{min-inline-size:var(--sf-sidebar-min-width);flex-grow:999;flex-basis:0}.sf-sidebar--right>:last-child{flex-basis:var(--sf-sidebar-width);flex-grow:1}.sf-sidebar--narrow{--sf-sidebar-width:12rem}.sf-sidebar--wide{--sf-sidebar-width:26rem}.sf-switcher{gap:var(--sf-switcher-gap);flex-wrap:wrap;display:flex}.sf-switcher>*{flex-grow:1;flex-basis:calc((var(--sf-switcher-threshold) - 100%) * 999)}.sf-switcher--no-wrap{overflow-inline:auto;flex-wrap:nowrap;overflow-x:auto}.sf-switcher--vertical{flex-direction:column}.sf-grid{grid-template-columns:repeat(auto-fill, minmax(min(var(--sf-grid-min), 100%), 1fr));gap:var(--sf-grid-gap);display:grid}.sf-grid--fit{grid-template-columns:repeat(auto-fit, minmax(min(var(--sf-grid-min), 100%), 1fr))}.sf-grid--xs{--sf-grid-min:var(--sf-grid-min-xs)}.sf-grid--s{--sf-grid-min:var(--sf-grid-min-s)}.sf-grid--m{--sf-grid-min:var(--sf-grid-min-m)}.sf-grid--l{--sf-grid-min:var(--sf-grid-min-l)}.sf-grid--xl{--sf-grid-min:var(--sf-grid-min-xl)}.sf-grid--2xl{--sf-grid-min:var(--sf-grid-min-2xl)}.sf-grid--dense{grid-auto-flow:dense}.sf-grid-flex{gap:var(--sf-grid-gap);flex-wrap:wrap;display:flex}.sf-grid-flex>*{flex:1 1 min(var(--sf-grid-min), 100%)}.sf-grid-flex--center{justify-content:center}.sf-grid-flex--center>*{flex-grow:0;flex-basis:min(var(--sf-grid-min), 100%)}.sf-grid-flex--xs{--sf-grid-min:var(--sf-grid-min-xs)}.sf-grid-flex--s{--sf-grid-min:var(--sf-grid-min-s)}.sf-grid-flex--m{--sf-grid-min:var(--sf-grid-min-m)}.sf-grid-flex--l{--sf-grid-min:var(--sf-grid-min-l)}.sf-grid-flex--xl{--sf-grid-min:var(--sf-grid-min-xl)}.sf-grid-flex--2xl{--sf-grid-min:var(--sf-grid-min-2xl)}.sf-icon{inline-size:var(--sf-icon-size,var(--sf-icon-m));block-size:var(--sf-icon-size,var(--sf-icon-m));vertical-align:text-bottom;fill:currentColor;flex-shrink:0;display:inline-block}.sf-icon--xs{--sf-icon-size:var(--sf-icon-xs)}.sf-icon--s{--sf-icon-size:var(--sf-icon-s)}.sf-icon--m{--sf-icon-size:var(--sf-icon-m)}.sf-icon--l{--sf-icon-size:var(--sf-icon-l)}.sf-icon--xl{--sf-icon-size:var(--sf-icon-xl)}.sf-icon--2xl{--sf-icon-size:var(--sf-icon-2xl)}.sf-icon--boxed{inline-size:calc(var(--sf-icon-size,var(--sf-icon-m)) + var(--sf-icon-box-pad) * 2);block-size:calc(var(--sf-icon-size,var(--sf-icon-m)) + var(--sf-icon-box-pad) * 2);padding:var(--sf-icon-box-pad);border:var(--sf-icon-box-border);border-radius:var(--sf-icon-box-radius);background:var(--sf-icon-box-bg);box-sizing:border-box}.sf-cover{min-height:var(--sf-cover-min-height);padding-block:var(--sf-cover-padding);flex-direction:column;display:flex}.sf-cover>.sf-cover__center{margin-block:auto}.sf-cover--min{min-height:50dvh}.sf-cover--max{min-height:0;max-block-size:100dvh}.sf-cover--padding-s{padding-block:var(--sf-space-xl)}.sf-cover--padding-l{padding-block:var(--sf-space-4xl)}.sf-frame{aspect-ratio:var(--sf-frame-ratio);justify-content:center;align-items:center;display:flex;overflow:hidden}.sf-frame>img,.sf-frame>video{object-fit:cover;block-size:100%;inline-size:100%}.sf-frame--square{aspect-ratio:var(--sf-ratio-square)}.sf-frame--video{aspect-ratio:var(--sf-ratio-video)}.sf-frame--cinema{aspect-ratio:var(--sf-ratio-cinema)}.sf-frame--portrait{aspect-ratio:var(--sf-ratio-portrait)}.sf-frame--4-3{aspect-ratio:var(--sf-ratio-4-3)}.sf-frame--3-2{aspect-ratio:var(--sf-ratio-3-2)}.sf-frame--golden{aspect-ratio:var(--sf-ratio-golden)}:where(:has(>.sf-bg-layer)){isolation:isolate;position:relative}.sf-bg-layer{inset:var(--sf-bg-layer-inset);inline-size:calc(100% - 2 * var(--sf-bg-layer-inset));block-size:calc(100% - 2 * var(--sf-bg-layer-inset));object-fit:var(--sf-bg-layer-fit);object-position:var(--sf-bg-layer-position);border-radius:var(--sf-bg-layer-radius);z-index:var(--sf-bg-layer-z);pointer-events:none;position:absolute}.sf-bg-layer>:is(img,video,picture),.sf-bg-layer>picture>img{object-fit:var(--sf-bg-layer-fit);object-position:var(--sf-bg-layer-position);border-radius:var(--sf-bg-layer-radius);pointer-events:none;block-size:100%;inline-size:100%}.sf-reel{block-size:var(--sf-reel-height);gap:var(--sf-reel-gap);overflow-inline:auto;scroll-snap-type:inline mandatory;scroll-padding-inline:var(--sf-reel-gap);overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:var(--sf-scrollbar-thumb) var(--sf-scrollbar-track);display:flex;overflow-x:auto}.sf-reel::-webkit-scrollbar{block-size:6px}.sf-reel::-webkit-scrollbar-track{background:var(--sf-scrollbar-track);border-radius:var(--sf-radius-full)}.sf-reel::-webkit-scrollbar-thumb{background:var(--sf-scrollbar-thumb);border-radius:var(--sf-radius-full)}.sf-reel>*{flex:0 0 var(--sf-reel-item-width);scroll-snap-align:start}.sf-imposter{inset-block-start:50%;position:absolute;left:50%;translate:-50% -50%}.sf-imposter--fixed{position:fixed}.sf-imposter--contain{max-inline-size:calc(100% - var(--sf-imposter-margin) * 2);max-block-size:calc(100% - var(--sf-imposter-margin) * 2);overflow:auto}.sf-alternate{gap:var(--sf-alternate-gap);display:grid;container:sf-alternate/inline-size}.sf-alternate>*{gap:var(--sf-alternate-inner-gap);align-items:center;display:grid}@container sf-alternate (width>=48em){.sf-alternate>*{grid-template-columns:1fr 1fr}.sf-alternate>:nth-child(2n)>:first-child{order:2}.sf-alternate>:nth-child(2n)>:last-child{order:1}}.sf-pancake{grid-template-rows:auto 1fr auto;min-height:100dvh;display:grid}.sf-grid-cols-1{gap:var(--sf-grid-gap);display:grid}.sf-grid-cols-2,.sf-grid-cols-3,.sf-grid-cols-4,.sf-grid-cols-6{gap:var(--sf-grid-gap);display:grid;container:sf-grid/inline-size}@container (width>=30em){.sf-grid-cols-4{grid-template-columns:repeat(2,1fr)}.sf-grid-cols-6{grid-template-columns:repeat(3,1fr)}}@container (width>=48em){.sf-grid-cols-2{grid-template-columns:repeat(2,1fr)}.sf-grid-cols-3{grid-template-columns:repeat(3,1fr)}.sf-grid-cols-4{grid-template-columns:repeat(4,1fr)}.sf-grid-cols-6{grid-template-columns:repeat(6,1fr)}}.sf-grid-cols-1-2,.sf-grid-cols-2-1,.sf-grid-cols-1-3,.sf-grid-cols-3-1{gap:var(--sf-grid-gap);display:grid}@container (width>=48em){.sf-grid-cols-1-2{grid-template-columns:1fr 2fr}.sf-grid-cols-2-1{grid-template-columns:2fr 1fr}.sf-grid-cols-1-3{grid-template-columns:1fr 3fr}.sf-grid-cols-3-1{grid-template-columns:3fr 1fr}}.sf-equal{column-width:var(--sf-equal-min-col);column-gap:var(--sf-equal-gap);column-rule:var(--sf-equal-rule-width) var(--sf-equal-rule-style) var(--sf-equal-rule-color)}.sf-equal>*{break-inside:avoid}.sf-equal--2{column-count:2}.sf-equal--3{column-count:3}.sf-equal--4{column-count:4}.sf-equal--6{column-count:6}.sf-content-grid{grid-template-columns:[full-start] minmax(var(--sf-gutter), 1fr) [breakout-start] minmax(0, calc((var(--sf-breakout-width) - var(--sf-content-width)) / 2)) [content-start] min(var(--sf-content-width), 100% - var(--sf-gutter) * 2) [content-end] minmax(0, calc((var(--sf-breakout-width) - var(--sf-content-width)) / 2)) [breakout-end] minmax(var(--sf-gutter), 1fr) [full-end];display:grid}.sf-content-grid>*{grid-column:content}.sf-content-grid>.sf-breakout{grid-column:breakout}.sf-content-grid>.sf-full-bleed{grid-column:full}.sf-bento{grid-template-columns:repeat(var(--sf-bento-cols,var(--sf-bento-cols-default)), 1fr);grid-auto-rows:minmax(var(--sf-bento-row,var(--sf-bento-row-default)), auto);grid-auto-flow:dense;gap:var(--sf-bento-gap);display:grid;container:sf-bento/inline-size}@container (width<=29.99em){.sf-bento{grid-template-columns:1fr}}@container (width>=30em) and (width<=47.99em){.sf-bento{grid-template-columns:repeat(2,1fr)}}.sf-bento--2{--sf-bento-cols:2}.sf-bento--3{--sf-bento-cols:3}.sf-bento--6{--sf-bento-cols:6}.sf-bento--compact{--sf-bento-row:var(--sf-bento-row-compact)}.sf-bento--tall{--sf-bento-row:var(--sf-bento-row-tall)}.sf-bento-wide{grid-column:span 2}.sf-bento-full{grid-column:1/-1}.sf-bento-tall{grid-row:span 2}.sf-bento-featured{grid-area:span 2/span 2}.sf-subgrid{grid-template-columns:subgrid;display:grid}.sf-subgrid-rows{grid-template-rows:subgrid;display:grid}}@layer slashed.components{.sf-btn{--sf-btn-color:var(--sf-color-action);--sf-btn-color--hover:var(--sf-color-action--hover);--sf-btn-on-color:var(--sf-color-text--on-action);justify-content:center;align-items:center;gap:var(--sf-btn-gap,var(--sf-space-2xs));padding-block:var(--sf-btn-padding-block);padding-inline:var(--sf-btn-padding-inline);min-block-size:var(--sf-btn-min-height,var(--sf-touch-target));font-family:inherit;font-size:var(--sf-btn-font-size,var(--sf-text-m));font-weight:var(--sf-btn-font-weight,var(--sf-font-weight-interactive));line-height:var(--sf-leading-tight);white-space:nowrap;border:var(--sf-btn-border-width,var(--sf-border-width-1)) solid var(--sf-btn-color);border-radius:var(--sf-btn-radius);cursor:pointer;-webkit-user-select:none;user-select:none;appearance:none;transition:var(--sf-transition-form-field);background:var(--sf-btn-color);color:var(--sf-btn-on-color);text-decoration:none;display:inline-flex}.sf-btn:hover:not(:disabled,.sf-is-disabled,.sf-is-loading){background:var(--sf-btn-color--hover);border-color:var(--sf-btn-color--hover)}.sf-btn--primary{--sf-btn-color:var(--sf-color-primary);--sf-btn-color--hover:var(--sf-color-primary--hover);--sf-btn-on-color:var(--sf-color-text--on-primary)}.sf-btn--neutral{--sf-btn-color:var(--sf-color-neutral);--sf-btn-color--hover:var(--sf-color-neutral--hover);--sf-btn-on-color:var(--sf-color-text--on-neutral)}.sf-btn--success{--sf-btn-color:var(--sf-color-success);--sf-btn-color--hover:var(--sf-color-success-strong);--sf-btn-on-color:var(--sf-color-text--on-success)}.sf-btn--warning{--sf-btn-color:var(--sf-color-warning);--sf-btn-color--hover:var(--sf-color-warning-strong);--sf-btn-on-color:var(--sf-color-text--on-warning)}.sf-btn--info{--sf-btn-color:var(--sf-color-info);--sf-btn-color--hover:var(--sf-color-info-strong);--sf-btn-on-color:var(--sf-color-text--on-info)}.sf-btn--danger{--sf-btn-color:var(--sf-color-danger);--sf-btn-color--hover:var(--sf-color-danger-strong);--sf-btn-on-color:var(--sf-color-text--on-danger)}.sf-btn--secondary{color:var(--sf-btn-color);border-color:var(--sf-btn-color);background:0 0}.sf-btn--secondary:hover:not(:disabled,.sf-is-disabled,.sf-is-loading){background:color-mix(in oklab, var(--sf-btn-color) 8%, transparent);border-color:var(--sf-btn-color)}.sf-btn--ghost{color:var(--sf-btn-color);background:0 0;border-color:#0000}.sf-btn--ghost:hover:not(:disabled,.sf-is-disabled,.sf-is-loading){background:color-mix(in oklab, var(--sf-btn-color) 8%, transparent)}.sf-btn--outline{color:var(--sf-btn-color);border-color:var(--sf-btn-color);background:0 0}.sf-btn--outline:hover:not(:disabled,.sf-is-disabled,.sf-is-loading){background:var(--sf-btn-color);color:var(--sf-btn-on-color);border-color:var(--sf-btn-color)}.sf-btn--xs{--sf-btn-padding-block:var(--sf-space-3xs,.125rem);--sf-btn-padding-inline:var(--sf-space-xs);--sf-btn-font-size:var(--sf-text-xs);--sf-btn-min-height:var(--sf-size-xs)}.sf-btn--s{--sf-btn-padding-block:var(--sf-space-2xs);--sf-btn-padding-inline:var(--sf-space-s);--sf-btn-font-size:var(--sf-text-s);--sf-btn-min-height:var(--sf-size-s)}.sf-btn--l{--sf-btn-padding-block:var(--sf-space-s);--sf-btn-padding-inline:var(--sf-space-l);--sf-btn-font-size:var(--sf-text-l);--sf-btn-min-height:var(--sf-size-xl)}.sf-btn--xl{--sf-btn-padding-block:var(--sf-space-m);--sf-btn-padding-inline:var(--sf-space-xl);--sf-btn-font-size:var(--sf-text-xl);--sf-btn-min-height:calc(var(--sf-size-xl) + var(--sf-space-s))}.sf-btn:disabled,.sf-btn.sf-is-disabled{opacity:var(--sf-opacity-disabled);cursor:not-allowed;pointer-events:none}.sf-btn.sf-is-loading{cursor:wait;position:relative}.sf-btn.sf-is-loading>*{visibility:hidden}.sf-btn.sf-is-loading:after{content:"";border:2px solid;border-radius:var(--sf-radius-full);border-block-start-color:#0000;block-size:1em;inline-size:1em;margin:auto;position:absolute;inset:0}@media (prefers-reduced-motion:no-preference){.sf-btn.sf-is-loading:after{animation:sf-spin var(--sf-duration-slower) linear infinite}}.sf-btn--block{inline-size:100%}@container (width<=20rem){.sf-btn--block-cq{inline-size:100%}}.sf-card{padding:var(--sf-card-padding,var(--sf-space-l));background:var(--sf-card-bg,var(--sf-color-surface));border:var(--sf-card-border-width,var(--sf-border-width-1)) solid var(--sf-card-border-color,var(--sf-color-border));border-radius:var(--sf-card-radius-outer,calc(var(--sf-radius-m) + var(--sf-space-l)));box-shadow:var(--sf-card-shadow,var(--sf-shadow-s));display:block}.sf-card__header,.sf-card__body,.sf-card__footer{display:block}.sf-card__header{border-block-end:var(--sf-border-subtle);margin-block-end:var(--sf-card-gap,var(--sf-space-m));padding-block-end:var(--sf-card-gap,var(--sf-space-m))}.sf-card__footer{border-block-start:var(--sf-border-subtle);margin-block-start:var(--sf-card-gap,var(--sf-space-m));padding-block-start:var(--sf-card-gap,var(--sf-space-m))}.sf-card__media{inline-size:100%;aspect-ratio:var(--sf-card-media-ratio,var(--sf-ratio-video));object-fit:cover;border-radius:var(--sf-card-media-radius,var(--sf-card-radius,var(--sf-radius-m)));display:block;overflow:clip}.sf-card__avatar{inline-size:var(--sf-avatar-size,2.5rem);block-size:var(--sf-avatar-size,2.5rem);aspect-ratio:1;object-fit:cover;border-radius:var(--sf-radius-full);flex-shrink:0}.sf-card__title{font-size:var(--sf-card-heading-size,var(--sf-text-xl));color:var(--sf-color-heading)}.sf-card .sf-btn{--sf-btn-font-size:var(--sf-card-btn-font-size,var(--sf-text-s))}.sf-card--bordered{box-shadow:none}.sf-card--elevated{box-shadow:var(--sf-card-shadow--elevated,var(--sf-shadow-l));border-color:#0000}.sf-card--interactive{cursor:pointer;transition:var(--sf-transition-shadow)}.sf-card--interactive:hover,.sf-card--interactive:focus-within{box-shadow:var(--sf-card-shadow--hover,var(--sf-shadow-l))}@media (prefers-reduced-motion:no-preference){.sf-card--interactive{transition:var(--sf-transition-shadow), var(--sf-transition-transform)}.sf-card--interactive:hover,.sf-card--interactive:focus-within{transform:translateY(calc(-1 * var(--sf-space-2xs)))}}}@layer slashed.macros{.sf-prose{max-width:var(--sf-container-prose);overflow-wrap:break-word}.sf-prose>*+*{margin-block-start:var(--sf-prose-paragraph)}.sf-prose :is(h2,h3,h4,h5,h6)+*{margin-block-start:var(--sf-prose-heading-gap)}.sf-prose li+li{margin-block-start:var(--sf-prose-list-gap)}.sf-prose :is(blockquote,pre){margin-block:var(--sf-prose-block-margin)}.sf-prose blockquote{border-inline-start:var(--sf-prose-blockquote-border);padding-inline-start:var(--sf-prose-blockquote-padding);font-style:italic}.sf-prose img{margin-block:var(--sf-prose-media-margin);border-radius:var(--sf-prose-media-radius)}.sf-prose :is(ul,ol){padding-inline-start:1.25em}.sf-prose>:is(ul,ol){margin-block-end:0}.sf-prose :is(ul,ol) :is(ul,ol){margin-block-start:var(--sf-prose-nested-list-gap)}.sf-prose ul{list-style:outside}.sf-prose ol{list-style:decimal}.sf-prose ::marker{color:var(--sf-prose-marker-color)}.sf-prose hr{margin-block:var(--sf-prose-hr-margin)}.sf-prose figure{margin-block:var(--sf-prose-figure-margin)}.sf-prose figcaption{font-size:var(--sf-prose-figcaption-size);color:var(--sf-color-text--muted);margin-block-start:var(--sf-prose-list-gap)}.sf-prose table{margin-block:var(--sf-prose-block-margin);overflow-inline:auto;inline-size:100%;max-inline-size:100%;display:block;overflow-x:auto}.sf-prose :is(th,td){padding:var(--sf-prose-table-pad)}.sf-prose video{margin-block:var(--sf-prose-media-margin);border-radius:var(--sf-prose-media-radius)}.sf-prose .sf-not-prose>*+*,.sf-prose .sf-not-prose li+li{margin-block-start:0}.sf-prose .sf-not-prose :is(ul,ol){list-style:revert;padding-inline-start:revert}.sf-prose .sf-not-prose ::marker{color:inherit}.sf-prose .sf-not-prose blockquote{border-inline-start:0;margin-block:0;padding-inline-start:0;font-style:normal}.sf-prose .sf-not-prose hr{margin-block:0}.sf-prose .sf-not-prose img{border-radius:0;margin-block:0}.sf-prose .sf-not-prose figure{margin-block:0}.sf-prose .sf-not-prose figcaption{font-size:inherit;color:inherit;margin-block-start:0}.sf-prose .sf-not-prose table{display:revert;overflow-x:revert;overflow-inline:revert;inline-size:revert;max-inline-size:revert;margin-block:0}.sf-prose .sf-not-prose :is(th,td){padding:revert}.sf-prose .sf-not-prose video{border-radius:0;margin-block:0}.sf-flow>*+*{margin-block-start:var(--sf-flow-space)}.sf-truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.sf-line-clamp-2,.sf-line-clamp-3,.sf-line-clamp-N{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.sf-line-clamp-2{-webkit-line-clamp:2}.sf-line-clamp-3{-webkit-line-clamp:3}.sf-line-clamp-N{-webkit-line-clamp:var(--sf-line-clamp)}.sf-equal-height{align-items:stretch;display:flex}.sf-equal-height>*{flex:auto;block-size:auto}.sf-aspect{aspect-ratio:var(--sf-aspect,16 / 9)}.sf-scroll-shadow{overflow-block:auto;-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-scroll-shadow-size), black calc(100% - var(--sf-scroll-shadow-size)), transparent 100%);-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-scroll-shadow-size), black calc(100% - var(--sf-scroll-shadow-size)), transparent 100%);mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-scroll-shadow-size), black calc(100% - var(--sf-scroll-shadow-size)), transparent 100%);overflow-y:auto}.sf-scroll-snap{overflow-block:auto;scroll-snap-type:block mandatory;overscroll-behavior-block:contain;overflow-y:auto}.sf-scroll-snap>*{scroll-snap-align:start}.sf-overflow-fade,.sf-overflow-fade--right{-webkit-mask-image:linear-gradient(to right, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);-webkit-mask-image:linear-gradient(to right, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);mask-image:linear-gradient(to right, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);overflow:hidden}.sf-overflow-fade--left{-webkit-mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black 100%);-webkit-mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black 100%);mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black 100%);overflow:hidden}.sf-overflow-fade--top{-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black 100%);-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black 100%);mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black 100%);overflow:hidden}.sf-overflow-fade--bottom{-webkit-mask-image:linear-gradient(to bottom, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);-webkit-mask-image:linear-gradient(to bottom, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);mask-image:linear-gradient(to bottom, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);overflow:hidden}.sf-overflow-fade--block{-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);overflow:hidden}.sf-overflow-fade--inline{-webkit-mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);-webkit-mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);overflow:hidden}.sf-no-tap-highlight{-webkit-tap-highlight-color:transparent}.sf-surface{background:var(--sf-surface-color)}.sf-surface--primary{--sf-surface-color:var(--sf-color-primary);background:var(--sf-color-primary);color:var(--sf-color-text--on-primary)}.sf-surface--secondary{--sf-surface-color:var(--sf-color-secondary);background:var(--sf-color-secondary);color:var(--sf-color-text--on-secondary)}.sf-surface--tertiary{--sf-surface-color:var(--sf-color-tertiary);background:var(--sf-color-tertiary);color:var(--sf-color-text--on-tertiary)}.sf-surface--action{--sf-surface-color:var(--sf-color-action);background:var(--sf-color-action);color:var(--sf-color-text--on-action)}.sf-surface--neutral{--sf-surface-color:var(--sf-color-neutral);background:var(--sf-color-neutral);color:var(--sf-color-text--on-neutral)}.sf-surface--inverse{--sf-surface-color:var(--sf-color-inverse);background:var(--sf-color-inverse);color:var(--sf-color-text--on-inverse)}.sf-surface--success{--sf-surface-color:var(--sf-color-success);background:var(--sf-color-success);color:var(--sf-color-text--on-success)}.sf-surface--warning{--sf-surface-color:var(--sf-color-warning);background:var(--sf-color-warning);color:var(--sf-color-text--on-warning)}.sf-surface--info{--sf-surface-color:var(--sf-color-info);background:var(--sf-color-info);color:var(--sf-color-text--on-info)}.sf-surface--danger{--sf-surface-color:var(--sf-color-danger);background:var(--sf-color-danger);color:var(--sf-color-text--on-danger)}@supports (color:oklch(from red l c h)) and (width:calc(1px * sign(1))){:is(.sf-surface,.sf-surface--primary,.sf-surface--secondary,.sf-surface--tertiary,.sf-surface--action,.sf-surface--neutral,.sf-surface--inverse,.sf-surface--success,.sf-surface--warning,.sf-surface--info,.sf-surface--danger){--sf-surface-contrast:oklch(from var(--sf-surface-color) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0 / 1);background:var(--sf-surface-color);color:var(--sf-surface-contrast);--sf-color-text:var(--sf-surface-contrast);--sf-color-heading:var(--sf-surface-contrast);--sf-color-link:oklch(from var(--sf-surface-contrast) l calc(c + .08) h);--sf-color-link--hover:var(--sf-surface-contrast);--sf-color-link--underline:oklch(from var(--sf-surface-contrast) l c h / .5);--sf-color-text--secondary:oklch(from var(--sf-surface-contrast) l c h / .7);--sf-color-text--placeholder:oklch(from var(--sf-surface-contrast) l c h / .45);--sf-color-text--disabled:oklch(from var(--sf-surface-contrast) l c h / .3);--sf-color-border:oklch(from var(--sf-surface-contrast) l c h / .2);--sf-color-border--subtle:oklch(from var(--sf-surface-contrast) l c h / .12);--sf-color-border--strong:oklch(from var(--sf-surface-contrast) l c h / .35);--sf-focus-ring-color:var(--sf-surface-contrast);--sf-caret-color:var(--sf-surface-contrast);--sf-shadow-color:oklch(from var(--sf-surface-color) var(--sf-shadow-lightness) c h)}}.sf-scrim{isolation:isolate;position:relative}.sf-scrim:before{content:"";z-index:0;background:var(--sf-scrim-gradient);pointer-events:none;position:absolute;inset:0}.sf-scrim>:not(img,picture,video,svg,canvas),.sf-scrim__content{z-index:1;position:relative}.sf-scrim--top{--sf-scrim-direction:to bottom}.sf-scrim--bottom{--sf-scrim-direction:to top}.sf-scrim--full{--sf-scrim-gradient:var(--sf-scrim-color)}.sf-surface-bg{background-color:var(--sf-surface-bg-color);background-image:var(--sf-surface-bg-overlay), var(--sf-surface-bg-image);background-size:var(--sf-surface-bg-size);background-position:var(--sf-surface-bg-position);background-repeat:var(--sf-surface-bg-repeat);background-attachment:var(--sf-surface-bg-attachment);animation:var(--sf-surface-bg-animation)}.sf-text-protect{text-shadow:var(--sf-scrim-text-shadow)}.sf-text-gradient{background-image:var(--sf-gradient-primary);color:#0000;-webkit-background-clip:text;background-clip:text}.sf-link-external:after{content:var(--sf-link-external-marker);font-size:.85em;text-decoration:none;display:inline-block}@supports (content:"x" / "y"){.sf-link-external:after{content:var(--sf-link-external-marker) / var(--sf-link-external-label)}}.sf-content-auto{content-visibility:auto;contain-intrinsic-size:auto var(--sf-content-intrinsic-size,500px)}.sf-tabular-nums{font-variant-numeric:var(--sf-font-numeric,tabular-nums)}.sf-drop-shadow-xs{filter:var(--sf-drop-shadow-xs)}.sf-drop-shadow-s{filter:var(--sf-drop-shadow-s)}.sf-drop-shadow-m{filter:var(--sf-drop-shadow-m)}.sf-drop-shadow-l{filter:var(--sf-drop-shadow-l)}.sf-drop-shadow-xl{filter:var(--sf-drop-shadow-xl)}.sf-link--subtle:link,.sf-link--subtle:visited{text-decoration-line:none}.sf-link--subtle:is(:link,:visited):hover,.sf-link--subtle:is(:link,:visited):focus-visible{text-decoration-line:underline;text-decoration-color:currentColor}.sf-link--reverse:link,.sf-link--reverse:visited{text-decoration-line:underline}.sf-link--reverse:is(:link,:visited):hover,.sf-link--reverse:is(:link,:visited):focus-visible{text-decoration-line:none}.sf-corner-scoop{-webkit-mask-image:radial-gradient(circle at var(--sf-corner-scoop-at), transparent var(--sf-corner-scoop-size), black calc(var(--sf-corner-scoop-size) + .5px));-webkit-mask-image:radial-gradient(circle at var(--sf-corner-scoop-at), transparent var(--sf-corner-scoop-size), black calc(var(--sf-corner-scoop-size) + .5px));mask-image:radial-gradient(circle at var(--sf-corner-scoop-at), transparent var(--sf-corner-scoop-size), black calc(var(--sf-corner-scoop-size) + .5px))}.sf-corner-scoop--top-left{--sf-corner-scoop-at:0 0}.sf-corner-scoop--top-right{--sf-corner-scoop-at:100% 0}.sf-corner-scoop--bottom-left{--sf-corner-scoop-at:0 100%}.sf-corner-scoop--bottom-right{--sf-corner-scoop-at:100% 100%}.sf-overlap,.sf-overlap--down,.sf-overlap--start,.sf-overlap--end{z-index:var(--sf-z-raised);position:relative}.sf-overlap{margin-block-start:calc(-1 * var(--sf-overlap-pull))}.sf-overlap--down{margin-block-end:calc(-1 * var(--sf-overlap-pull))}.sf-overlap--start{margin-inline-start:calc(-1 * var(--sf-overlap-pull))}.sf-overlap--end{margin-inline-end:calc(-1 * var(--sf-overlap-pull))}.sf-overlap-host{isolation:isolate;padding-block-start:var(--sf-overlap-host-pad,var(--sf-overlap-pull));position:relative}}@layer slashed.utilities,slashed.states;@layer slashed.themes{@media (prefers-color-scheme:dark){:root:not([data-theme]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--sf-is-dark:1}}:is([data-theme=light],.sf-theme-light){--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--sf-is-dark:0}:is([data-theme=dark],.sf-theme-dark){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--sf-is-dark:1}:where([data-theme]:not(:root,html),.sf-theme-light:not(:root,html),.sf-theme-dark:not(:root,html)){background-color:var(--sf-color-bg);color:var(--sf-color-text)}@supports (color:oklch(from red l c h)){:root[data-lumlocker]{--sf-color-primary:var(--lightningcss-light,oklch(from var(--sf-color-primary-source-light) var(--sf-lumlocker) c h))var(--lightningcss-dark,oklch(from var(--sf-color-primary-source-dark,var(--sf-color-primary-source-light)) var(--sf-lumlocker) c h));--sf-color-secondary:var(--lightningcss-light,oklch(from var(--sf-color-secondary-source-light) var(--sf-lumlocker) c h))var(--lightningcss-dark,oklch(from var(--sf-color-secondary-source-dark,var(--sf-color-secondary-source-light)) var(--sf-lumlocker) c h));--sf-color-tertiary:var(--lightningcss-light,oklch(from var(--sf-color-tertiary-source-light) var(--sf-lumlocker) c h))var(--lightningcss-dark,oklch(from var(--sf-color-tertiary-source-dark,var(--sf-color-tertiary-source-light)) var(--sf-lumlocker) c h));--sf-color-action:var(--lightningcss-light,oklch(from var(--sf-color-action-source-light) var(--sf-lumlocker) c h))var(--lightningcss-dark,oklch(from var(--sf-color-action-source-dark,var(--sf-color-action-source-light)) var(--sf-lumlocker) c h))}:root[data-lumlocker] :is([data-theme=dark],.sf-theme-dark){--sf-color-primary:oklch(from var(--sf-color-primary-source-dark,var(--sf-color-primary-source-light)) var(--sf-lumlocker) c h);--sf-color-secondary:oklch(from var(--sf-color-secondary-source-dark,var(--sf-color-secondary-source-light)) var(--sf-lumlocker) c h);--sf-color-tertiary:oklch(from var(--sf-color-tertiary-source-dark,var(--sf-color-tertiary-source-light)) var(--sf-lumlocker) c h);--sf-color-action:oklch(from var(--sf-color-action-source-dark,var(--sf-color-action-source-light)) var(--sf-lumlocker) c h)}:root[data-lumlocker] :is([data-theme=light],.sf-theme-light){--sf-color-primary:oklch(from var(--sf-color-primary-source-light) var(--sf-lumlocker) c h);--sf-color-secondary:oklch(from var(--sf-color-secondary-source-light) var(--sf-lumlocker) c h);--sf-color-tertiary:oklch(from var(--sf-color-tertiary-source-light) var(--sf-lumlocker) c h);--sf-color-action:oklch(from var(--sf-color-action-source-light) var(--sf-lumlocker) c h)}:root{--sf-color-primary-source-dark:oklch(from var(--sf-color-primary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-secondary-source-dark:oklch(from var(--sf-color-secondary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-tertiary-source-dark:oklch(from var(--sf-color-tertiary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-action-source-dark:oklch(from var(--sf-color-action-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-neutral-source-dark:oklch(from var(--sf-color-neutral-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-base-source-dark:oklch(from var(--sf-color-base-source-light) clamp(.16, calc(1.18 - l), .24) calc(c * .5) h);--sf-color-success-source-dark:oklch(from var(--sf-color-success-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-warning-source-dark:oklch(from var(--sf-color-warning-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-info-source-dark:oklch(from var(--sf-color-info-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-danger-source-dark:oklch(from var(--sf-color-danger-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)}:is([data-theme=dark],.sf-theme-dark){--sf-color-primary:var(--sf-color-primary-source-dark);--sf-color-secondary:var(--sf-color-secondary-source-dark);--sf-color-tertiary:var(--sf-color-tertiary-source-dark);--sf-color-action:var(--sf-color-action-source-dark);--sf-color-neutral:var(--sf-color-neutral-source-dark);--sf-color-base:var(--sf-color-base-source-dark);--sf-color-surface:var(--sf-color-base);--sf-color-bg:oklch(from var(--sf-color-base) calc(l + .02) c h);--sf-color-inset:oklch(from var(--sf-color-base) calc(l - .02) c h);--sf-color-raised:oklch(from var(--sf-color-base) calc(l + .04) c h);--sf-color-overlay:oklch(from var(--sf-color-base) l c h / .9);--sf-color-inverse:oklch(from var(--sf-color-base) calc(1 - l) c h);--sf-color-success:var(--sf-color-success-source-dark);--sf-color-warning:var(--sf-color-warning-source-dark);--sf-color-info:var(--sf-color-info-source-dark);--sf-color-danger:var(--sf-color-danger-source-dark);--sf-color-text:oklch(from var(--sf-color-neutral) clamp(.7, calc(l + .25 + var(--sf-contrast-bias)), 1) c h);--sf-color-text--secondary:oklch(from var(--sf-color-neutral) clamp(.55, calc(l + .1 + var(--sf-contrast-bias)), .9) c h);--sf-color-text--placeholder:oklch(from var(--sf-color-neutral) clamp(.35, calc(l - .1), .65) c h);--sf-color-text--disabled:oklch(from var(--sf-color-neutral) clamp(.25, calc(l - .2), .55) c h);--sf-color-text--inverse:oklch(from var(--sf-color-neutral) clamp(.05, calc(l - .4), .35) c h);--sf-color-heading:oklch(from var(--sf-color-neutral) clamp(.7, calc(l + .25 + var(--sf-contrast-bias)), 1) c h);--sf-color-border:oklch(from var(--sf-color-neutral) clamp(.25, calc(l - .3), .55) .005 h);--sf-color-border--subtle:oklch(from var(--sf-color-neutral) clamp(.2, calc(l - .38), .45) .005 h);--sf-color-border--strong:oklch(from var(--sf-color-neutral) clamp(.38, calc(l - .1), .65) .02 h);--sf-color-link:oklch(from var(--sf-color-action) clamp(.68, l, 1) c h);--sf-color-link--hover:oklch(from var(--sf-color-action) clamp(0, max(l + .1, .68), 1) c h);--sf-color-link--active:oklch(from var(--sf-color-action) clamp(0, max(l + .15, .74), 1) c h);--sf-color-link--visited:oklch(from var(--sf-color-action) clamp(.68, l, 1) c calc(h + 60));--sf-color-selection-bg:oklch(from var(--sf-color-action-source-dark) clamp(.62, calc(.93 - l * .4), .78) c h / .55);--sf-color-success-strong:oklch(from var(--sf-color-success) clamp(.7, calc(l + .15), 1) c h);--sf-color-warning-strong:oklch(from var(--sf-color-warning) clamp(.7, calc(l + .05), 1) c h);--sf-color-info-strong:oklch(from var(--sf-color-info) clamp(.7, calc(l + .15), 1) c h);--sf-color-danger-strong:oklch(from var(--sf-color-danger) clamp(.7, calc(l + .15), 1) c h);--sf-color-code-bg:var(--sf-color-inset);--sf-color-bg--disabled:var(--sf-color-inset);--sf-color-link--disabled:var(--sf-color-text--disabled);--sf-scrollbar-thumb:var(--sf-color-neutral);--sf-color-code-text:var(--sf-color-text)}:is([data-theme=light],.sf-theme-light){--sf-color-primary:var(--sf-color-primary-source-light);--sf-color-secondary:var(--sf-color-secondary-source-light);--sf-color-tertiary:var(--sf-color-tertiary-source-light);--sf-color-action:var(--sf-color-action-source-light);--sf-color-neutral:var(--sf-color-neutral-source-light);--sf-color-base:var(--sf-color-base-source-light);--sf-color-surface:var(--sf-color-base);--sf-color-bg:oklch(from var(--sf-color-base) calc(l + .02) c h);--sf-color-inset:oklch(from var(--sf-color-base) calc(l - .02) c h);--sf-color-raised:oklch(from var(--sf-color-base) calc(l + .04) c h);--sf-color-overlay:oklch(from var(--sf-color-base) l c h / .9);--sf-color-inverse:oklch(from var(--sf-color-base) calc(1 - l) c h);--sf-color-success:var(--sf-color-success-source-light);--sf-color-warning:var(--sf-color-warning-source-light);--sf-color-info:var(--sf-color-info-source-light);--sf-color-danger:var(--sf-color-danger-source-light);--sf-color-text:oklch(from var(--sf-color-neutral-source-light) clamp(.05, calc(l - .4 - var(--sf-contrast-bias)), .35) c h);--sf-color-text--secondary:oklch(from var(--sf-color-neutral-source-light) clamp(.15, calc(l - .25 - var(--sf-contrast-bias)), .45) c h);--sf-color-text--placeholder:oklch(from var(--sf-color-neutral-source-light) clamp(.45, calc(l + .15), .75) c h);--sf-color-text--disabled:oklch(from var(--sf-color-neutral-source-light) clamp(.55, calc(l + .25), .82) c h);--sf-color-text--inverse:oklch(from var(--sf-color-neutral-source-light) clamp(.85, calc(l + .4), .98) c h);--sf-color-heading:oklch(from var(--sf-color-neutral-source-light) clamp(.05, calc(l - .4 - var(--sf-contrast-bias)), .35) c h);--sf-color-border:oklch(from var(--sf-color-neutral-source-light) clamp(.7, calc(l + .35), .95) .005 h);--sf-color-border--subtle:oklch(from var(--sf-color-neutral-source-light) clamp(.75, calc(l + .4), .97) .005 h);--sf-color-border--strong:oklch(from var(--sf-color-neutral-source-light) clamp(.55, calc(l + .1), .85) .02 h);--sf-color-link:oklch(from var(--sf-color-action) clamp(0, min(l - .07, .48), 1) c h);--sf-color-link--hover:oklch(from var(--sf-color-action) clamp(0, min(l - .15, .4), 1) c h);--sf-color-link--active:oklch(from var(--sf-color-action) clamp(0, min(l - .21, .34), 1) c h);--sf-color-link--visited:oklch(from var(--sf-color-action) clamp(0, min(l - .07, .48), 1) c calc(h + 60));--sf-color-selection-bg:oklch(from var(--sf-color-action-source-light) l c h / .28);--sf-color-success-strong:oklch(from var(--sf-color-success-source-light) calc(l - .15) c h);--sf-color-warning-strong:oklch(from var(--sf-color-warning-source-light) calc(l - .25) c h);--sf-color-info-strong:oklch(from var(--sf-color-info-source-light) calc(l - .1) c h);--sf-color-danger-strong:oklch(from var(--sf-color-danger-source-light) calc(l - .1) c h);--sf-color-code-bg:var(--sf-color-inset);--sf-color-bg--disabled:var(--sf-color-inset);--sf-color-link--disabled:var(--sf-color-text--disabled);--sf-scrollbar-thumb:var(--sf-color-neutral);--sf-color-code-text:var(--sf-color-text)}}@supports (color:oklch(from red l c h)) and (width:calc(1px * sign(1))){:is([data-theme=dark],.sf-theme-dark),:is([data-theme=light],.sf-theme-light){--sf-color-text--on-primary:oklch(from var(--sf-color-primary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-secondary:oklch(from var(--sf-color-secondary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-tertiary:oklch(from var(--sf-color-tertiary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-action:oklch(from var(--sf-color-action) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-neutral:oklch(from var(--sf-color-neutral) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-success:oklch(from var(--sf-color-success) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-warning:oklch(from var(--sf-color-warning) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-info:oklch(from var(--sf-color-info) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-danger:oklch(from var(--sf-color-danger) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-inverse:oklch(from var(--sf-color-inverse) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-code-text:oklch(from var(--sf-color-code-bg) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0)}}.sf-theme-transition{transition:--sf-color-primary var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-secondary var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-tertiary var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-action var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-neutral var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-base var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-success var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-warning var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-info var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-danger var(--sf-theme-transition-duration) var(--sf-ease-out)}@media (prefers-reduced-motion:reduce){.sf-theme-transition{transition:none}}}@layer slashed.motion,slashed.accessibility,slashed.print,slashed.legacy,slashed.overrides; +@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-100:#ffe2e2;--color-red-300:#ffa3a3;--color-red-400:#ff6568;--color-red-500:#fb2c36;--color-red-700:#bf000f;--color-red-900:#82181a;--color-orange-400:#ff8b1a;--color-orange-600:#f05100;--color-amber-300:#ffd236;--color-amber-400:#fcbb00;--color-amber-500:#f99c00;--color-amber-600:#dd7400;--color-amber-700:#b75000;--color-emerald-100:#d0fae5;--color-emerald-200:#a4f4cf;--color-emerald-300:#5ee9b5;--color-emerald-400:#00d294;--color-emerald-500:#00bb7f;--color-emerald-600:#009767;--color-emerald-700:#007956;--color-emerald-800:#005f46;--color-emerald-900:#004e3b;--color-teal-400:#00d3bd;--color-teal-600:#009588;--color-sky-400:#00bcfe;--color-sky-600:#0084cc;--color-blue-500:#3080ff;--color-indigo-200:#c7d2ff;--color-indigo-300:#a4b3ff;--color-indigo-400:#7d87ff;--color-indigo-500:#625fff;--color-indigo-600:#4f39f6;--color-indigo-700:#432dd7;--color-indigo-800:#372aac;--color-violet-400:#a685ff;--color-violet-600:#7f22fe;--color-purple-500:#ac4bff;--color-purple-600:#9810fa;--color-pink-400:#fb64b6;--color-pink-600:#e30076;--color-rose-300:#ffa2ae;--color-rose-400:#ff667f;--color-rose-500:#ff2357;--color-rose-600:#e70044;--color-rose-700:#c20039;--color-rose-800:#a30037;--color-slate-50:#f8fafc;--color-slate-100:#f1f5f9;--color-slate-200:#e2e8f0;--color-slate-300:#cad5e2;--color-slate-400:#90a1b9;--color-slate-500:#62748e;--color-slate-600:#45556c;--color-slate-700:#314158;--color-slate-800:#1d293d;--color-slate-900:#0f172b;--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-black:900;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-widest:.1em;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--ease-in-out:cubic-bezier(.4, 0, .2, 1);--animate-spin:spin 1s linear infinite;--blur-sm:8px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--color-red-100:lab(92.243% 10.2865 3.83865);--color-red-300:lab(76.5514% 36.422 15.5335);--color-red-400:lab(63.7053% 60.745 31.3109);--color-red-500:lab(55.4814% 75.0732 48.8528);--color-red-700:lab(40.4273% 67.2623 53.7441);--color-red-900:lab(28.5139% 44.5539 29.0463);--color-orange-400:lab(70.0429% 42.5156 75.8207);--color-orange-600:lab(57.1026% 64.2584 89.8886);--color-amber-300:lab(86.4156% 6.13147 78.3961);--color-amber-400:lab(80.1641% 16.6016 99.2089);--color-amber-500:lab(72.7183% 31.8672 97.9407);--color-amber-600:lab(60.3514% 40.5624 87.1228);--color-amber-700:lab(47.2709% 42.9082 69.2966);--color-emerald-100:lab(94.9004% -17.0769 5.63836);--color-emerald-200:lab(90.2247% -31.039 9.47084);--color-emerald-300:lab(83.9203% -48.7124 13.8849);--color-emerald-400:lab(75.0771% -60.7313 19.4147);--color-emerald-500:lab(66.9756% -58.27 19.5419);--color-emerald-600:lab(55.0481% -49.9246 15.93);--color-emerald-700:lab(44.4871% -41.0396 11.0361);--color-emerald-800:lab(35.3675% -33.1188 8.04002);--color-emerald-900:lab(28.8637% -26.9249 5.45986);--color-teal-400:lab(76.0109% -53.3483 -2.27906);--color-teal-600:lab(55.0223% -41.0774 -3.90277);--color-sky-400:lab(70.687% -23.6078 -45.9483);--color-sky-600:lab(51.7754% -11.4712 -49.8349);--color-blue-500:lab(54.1736% 13.3369 -74.6839);--color-indigo-200:lab(84.4329% 3.18977 -23.9688);--color-indigo-300:lab(74.0235% 8.54138 -41.6075);--color-indigo-400:lab(59.866% 22.4834 -64.4485);--color-indigo-500:lab(48.295% 38.3129 -81.9673);--color-indigo-600:lab(38.4009% 52.6132 -92.3857);--color-indigo-700:lab(32.4486% 49.2217 -84.6695);--color-indigo-800:lab(26.6645% 37.9804 -68.6402);--color-violet-400:lab(62.8239% 34.9159 -60.0512);--color-violet-600:lab(41.088% 68.9966 -91.995);--color-purple-500:lab(52.0183% 66.11 -78.2316);--color-purple-600:lab(43.0295% 75.21 -86.5669);--color-pink-400:lab(64.5597% 64.3615 -12.7988);--color-pink-600:lab(49.5493% 79.8381 2.31768);--color-rose-300:lab(76.6339% 38.3549 9.68835);--color-rose-400:lab(64.4125% 63.0291 19.2068);--color-rose-500:lab(56.101% 79.4328 31.4532);--color-rose-600:lab(49.1882% 81.577 36.0311);--color-rose-700:lab(41.1651% 71.6251 30.3087);--color-rose-800:lab(34.6481% 60.802 20.1957);--color-slate-50:lab(98.1434% -.369519 -1.05966);--color-slate-100:lab(96.286% -.852436 -2.46847);--color-slate-200:lab(91.7353% -.998765 -4.76968);--color-slate-300:lab(84.7652% -1.94535 -7.93337);--color-slate-400:lab(65.5349% -2.25151 -14.5072);--color-slate-500:lab(48.0876% -2.03595 -16.5814);--color-slate-600:lab(35.5623% -1.74978 -15.4316);--color-slate-700:lab(26.9569% -1.47016 -15.6993);--color-slate-800:lab(16.132% -.318035 -14.6672);--color-slate-900:lab(7.78673% 1.82345 -15.0537)}}}@layer base{*,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.\@container{container-type:inline-size}.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.inset-x-0{inset-inline:0}.-top-0\.5{top:calc(var(--spacing) * -.5)}.top-0{top:0}.top-0\.5{top:calc(var(--spacing) * .5)}.top-1{top:var(--spacing)}.top-2{top:calc(var(--spacing) * 2)}.-right-0\.5{right:calc(var(--spacing) * -.5)}.right-0{right:0}.right-0\.5{right:calc(var(--spacing) * .5)}.right-2{right:calc(var(--spacing) * 2)}.bottom-0{bottom:0}.bottom-2{bottom:calc(var(--spacing) * 2)}.bottom-full{bottom:100%}.left-0{left:0}.left-1\/2{left:50%}.left-3{left:calc(var(--spacing) * 3)}.left-12{left:calc(var(--spacing) * 12)}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.z-\[100\]{z-index:100}.z-\[99998\]{z-index:99998}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mx-0\.5{margin-inline:calc(var(--spacing) * .5)}.mx-1{margin-inline:var(--spacing)}.mx-4{margin-inline:calc(var(--spacing) * 4)}.mx-auto{margin-inline:auto}.my-1{margin-block:var(--spacing)}.my-2{margin-block:calc(var(--spacing) * 2)}.-mt-px{margin-top:-1px}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mb-0\.5{margin-bottom:calc(var(--spacing) * .5)}.mb-1{margin-bottom:var(--spacing)}.mb-1\.5{margin-bottom:calc(var(--spacing) * 1.5)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.ml-0\.5{margin-left:calc(var(--spacing) * .5)}.ml-1{margin-left:var(--spacing)}.ml-auto{margin-left:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.list-item{display:list-item}.table{display:table}.h-1{height:var(--spacing)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-16{height:calc(var(--spacing) * 16)}.h-20{height:calc(var(--spacing) * 20)}.h-24{height:calc(var(--spacing) * 24)}.h-\[52px\]{height:52px}.h-full{height:100%}.h-px{height:1px}.h-screen{height:100vh}.max-h-80{max-height:calc(var(--spacing) * 80)}.max-h-\[360px\]{max-height:360px}.min-h-0{min-height:0}.min-h-10{min-height:calc(var(--spacing) * 10)}.min-h-\[34px\]{min-height:34px}.w-0\.5{width:calc(var(--spacing) * .5)}.w-1{width:var(--spacing)}.w-1\.5{width:calc(var(--spacing) * 1.5)}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-9{width:calc(var(--spacing) * 9)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-14{width:calc(var(--spacing) * 14)}.w-16{width:calc(var(--spacing) * 16)}.w-20{width:calc(var(--spacing) * 20)}.w-24{width:calc(var(--spacing) * 24)}.w-28{width:calc(var(--spacing) * 28)}.w-\[560px\]{width:560px}.w-full{width:100%}.w-px{width:1px}.w-screen{width:100vw}.max-w-28{max-width:calc(var(--spacing) * 28)}.max-w-\[95vw\]{max-width:95vw}.max-w-\[100px\]{max-width:100px}.max-w-\[320px\]{max-width:320px}.max-w-full{max-width:100%}.max-w-sm{max-width:var(--container-sm)}.min-w-0{min-width:0}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.border-collapse{border-collapse:collapse}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-0{--tw-translate-x:0;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-0\.5{--tw-translate-x:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-4{--tw-translate-x:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-full{--tw-translate-x:100%;translate:var(--tw-translate-x) var(--tw-translate-y)}.rotate-90{rotate:90deg}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-pointer{cursor:pointer}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-\[1fr_auto_1fr\]{grid-template-columns:1fr auto 1fr}.grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-px{gap:1px}:where(.space-y-0\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * .5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * .5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-px>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(1px * var(--tw-space-y-reverse));margin-block-end:calc(1px * calc(1 - var(--tw-space-y-reverse)))}.gap-x-2{column-gap:calc(var(--spacing) * 2)}.gap-y-0\.5{row-gap:calc(var(--spacing) * .5)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-l-xl{border-top-left-radius:var(--radius-xl);border-bottom-left-radius:var(--radius-xl)}.rounded-b{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-x{border-inline-style:var(--tw-border-style);border-inline-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-t-2{border-top-style:var(--tw-border-style);border-top-width:2px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-amber-500{border-color:var(--color-amber-500)}.border-amber-500\/20{border-color:#f99c0033}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/20{border-color:color-mix(in oklab, var(--color-amber-500) 20%, transparent)}}.border-black\/6{border-color:#0000000f}@supports (color:color-mix(in lab, red, red)){.border-black\/6{border-color:color-mix(in oklab, var(--color-black) 6%, transparent)}}.border-black\/8{border-color:#00000014}@supports (color:color-mix(in lab, red, red)){.border-black\/8{border-color:color-mix(in oklab, var(--color-black) 8%, transparent)}}.border-black\/10{border-color:#0000001a}@supports (color:color-mix(in lab, red, red)){.border-black\/10{border-color:color-mix(in oklab, var(--color-black) 10%, transparent)}}.border-black\/12{border-color:#0000001f}@supports (color:color-mix(in lab, red, red)){.border-black\/12{border-color:color-mix(in oklab, var(--color-black) 12%, transparent)}}.border-black\/20{border-color:#0003}@supports (color:color-mix(in lab, red, red)){.border-black\/20{border-color:color-mix(in oklab, var(--color-black) 20%, transparent)}}.border-emerald-500\/30{border-color:#00bb7f4d}@supports (color:color-mix(in lab, red, red)){.border-emerald-500\/30{border-color:color-mix(in oklab, var(--color-emerald-500) 30%, transparent)}}.border-indigo-400\/40{border-color:#7d87ff66}@supports (color:color-mix(in lab, red, red)){.border-indigo-400\/40{border-color:color-mix(in oklab, var(--color-indigo-400) 40%, transparent)}}.border-indigo-500{border-color:var(--color-indigo-500)}.border-indigo-500\/15{border-color:#625fff26}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/15{border-color:color-mix(in oklab, var(--color-indigo-500) 15%, transparent)}}.border-indigo-500\/20{border-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/20{border-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.border-indigo-500\/25{border-color:#625fff40}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/25{border-color:color-mix(in oklab, var(--color-indigo-500) 25%, transparent)}}.border-indigo-500\/30{border-color:#625fff4d}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/30{border-color:color-mix(in oklab, var(--color-indigo-500) 30%, transparent)}}.border-indigo-500\/40{border-color:#625fff66}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/40{border-color:color-mix(in oklab, var(--color-indigo-500) 40%, transparent)}}.border-indigo-500\/50{border-color:#625fff80}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/50{border-color:color-mix(in oklab, var(--color-indigo-500) 50%, transparent)}}.border-red-500\/30{border-color:#fb2c364d}@supports (color:color-mix(in lab, red, red)){.border-red-500\/30{border-color:color-mix(in oklab, var(--color-red-500) 30%, transparent)}}.border-rose-500\/20{border-color:#ff235733}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/20{border-color:color-mix(in oklab, var(--color-rose-500) 20%, transparent)}}.border-rose-500\/30{border-color:#ff23574d}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/30{border-color:color-mix(in oklab, var(--color-rose-500) 30%, transparent)}}.border-white\/6{border-color:#ffffff0f}@supports (color:color-mix(in lab, red, red)){.border-white\/6{border-color:color-mix(in oklab, var(--color-white) 6%, transparent)}}.border-white\/8{border-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.border-white\/8{border-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.border-white\/10{border-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.border-t-indigo-500{border-top-color:var(--color-indigo-500)}.bg-\[\#0a0a0f\]{background-color:#0a0a0f}.bg-\[\#0c0c15\]{background-color:#0c0c15}.bg-\[\#0d0d14\]{background-color:#0d0d14}.bg-\[\#1a1a2e\]{background-color:#1a1a2e}.bg-amber-400{background-color:var(--color-amber-400)}.bg-amber-500\/10{background-color:#f99c001a}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/10{background-color:color-mix(in oklab, var(--color-amber-500) 10%, transparent)}}.bg-amber-500\/20{background-color:#f99c0033}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/20{background-color:color-mix(in oklab, var(--color-amber-500) 20%, transparent)}}.bg-amber-600{background-color:var(--color-amber-600)}.bg-amber-600\/40{background-color:#dd740066}@supports (color:color-mix(in lab, red, red)){.bg-amber-600\/40{background-color:color-mix(in oklab, var(--color-amber-600) 40%, transparent)}}.bg-black\/3{background-color:#00000008}@supports (color:color-mix(in lab, red, red)){.bg-black\/3{background-color:color-mix(in oklab, var(--color-black) 3%, transparent)}}.bg-black\/4{background-color:#0000000a}@supports (color:color-mix(in lab, red, red)){.bg-black\/4{background-color:color-mix(in oklab, var(--color-black) 4%, transparent)}}.bg-black\/5{background-color:#0000000d}@supports (color:color-mix(in lab, red, red)){.bg-black\/5{background-color:color-mix(in oklab, var(--color-black) 5%, transparent)}}.bg-black\/6{background-color:#0000000f}@supports (color:color-mix(in lab, red, red)){.bg-black\/6{background-color:color-mix(in oklab, var(--color-black) 6%, transparent)}}.bg-black\/8{background-color:#00000014}@supports (color:color-mix(in lab, red, red)){.bg-black\/8{background-color:color-mix(in oklab, var(--color-black) 8%, transparent)}}.bg-black\/10{background-color:#0000001a}@supports (color:color-mix(in lab, red, red)){.bg-black\/10{background-color:color-mix(in oklab, var(--color-black) 10%, transparent)}}.bg-black\/12{background-color:#0000001f}@supports (color:color-mix(in lab, red, red)){.bg-black\/12{background-color:color-mix(in oklab, var(--color-black) 12%, transparent)}}.bg-black\/20{background-color:#0003}@supports (color:color-mix(in lab, red, red)){.bg-black\/20{background-color:color-mix(in oklab, var(--color-black) 20%, transparent)}}.bg-black\/30{background-color:#0000004d}@supports (color:color-mix(in lab, red, red)){.bg-black\/30{background-color:color-mix(in oklab, var(--color-black) 30%, transparent)}}.bg-black\/60{background-color:#0009}@supports (color:color-mix(in lab, red, red)){.bg-black\/60{background-color:color-mix(in oklab, var(--color-black) 60%, transparent)}}.bg-blue-500\/30{background-color:#3080ff4d}@supports (color:color-mix(in lab, red, red)){.bg-blue-500\/30{background-color:color-mix(in oklab, var(--color-blue-500) 30%, transparent)}}.bg-emerald-100{background-color:var(--color-emerald-100)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-emerald-500\/15{background-color:#00bb7f26}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/15{background-color:color-mix(in oklab, var(--color-emerald-500) 15%, transparent)}}.bg-emerald-500\/20{background-color:#00bb7f33}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/20{background-color:color-mix(in oklab, var(--color-emerald-500) 20%, transparent)}}.bg-emerald-500\/25{background-color:#00bb7f40}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/25{background-color:color-mix(in oklab, var(--color-emerald-500) 25%, transparent)}}.bg-emerald-600{background-color:var(--color-emerald-600)}.bg-indigo-400{background-color:var(--color-indigo-400)}.bg-indigo-400\/40{background-color:#7d87ff66}@supports (color:color-mix(in lab, red, red)){.bg-indigo-400\/40{background-color:color-mix(in oklab, var(--color-indigo-400) 40%, transparent)}}.bg-indigo-400\/50{background-color:#7d87ff80}@supports (color:color-mix(in lab, red, red)){.bg-indigo-400\/50{background-color:color-mix(in oklab, var(--color-indigo-400) 50%, transparent)}}.bg-indigo-500{background-color:var(--color-indigo-500)}.bg-indigo-500\/8{background-color:#625fff14}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/8{background-color:color-mix(in oklab, var(--color-indigo-500) 8%, transparent)}}.bg-indigo-500\/10{background-color:#625fff1a}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/10{background-color:color-mix(in oklab, var(--color-indigo-500) 10%, transparent)}}.bg-indigo-500\/15{background-color:#625fff26}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/15{background-color:color-mix(in oklab, var(--color-indigo-500) 15%, transparent)}}.bg-indigo-500\/20{background-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/20{background-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.bg-indigo-500\/30{background-color:#625fff4d}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/30{background-color:color-mix(in oklab, var(--color-indigo-500) 30%, transparent)}}.bg-indigo-500\/40{background-color:#625fff66}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/40{background-color:color-mix(in oklab, var(--color-indigo-500) 40%, transparent)}}.bg-indigo-500\/50{background-color:#625fff80}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/50{background-color:color-mix(in oklab, var(--color-indigo-500) 50%, transparent)}}.bg-indigo-500\/70{background-color:#625fffb3}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/70{background-color:color-mix(in oklab, var(--color-indigo-500) 70%, transparent)}}.bg-indigo-600{background-color:var(--color-indigo-600)}.bg-indigo-600\/10{background-color:#4f39f61a}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/10{background-color:color-mix(in oklab, var(--color-indigo-600) 10%, transparent)}}.bg-indigo-600\/15{background-color:#4f39f626}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/15{background-color:color-mix(in oklab, var(--color-indigo-600) 15%, transparent)}}.bg-indigo-600\/20{background-color:#4f39f633}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/20{background-color:color-mix(in oklab, var(--color-indigo-600) 20%, transparent)}}.bg-indigo-600\/25{background-color:#4f39f640}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/25{background-color:color-mix(in oklab, var(--color-indigo-600) 25%, transparent)}}.bg-indigo-600\/30{background-color:#4f39f64d}@supports (color:color-mix(in lab, red, red)){.bg-indigo-600\/30{background-color:color-mix(in oklab, var(--color-indigo-600) 30%, transparent)}}.bg-purple-500\/40{background-color:#ac4bff66}@supports (color:color-mix(in lab, red, red)){.bg-purple-500\/40{background-color:color-mix(in oklab, var(--color-purple-500) 40%, transparent)}}.bg-red-100{background-color:var(--color-red-100)}.bg-rose-500\/20{background-color:#ff235733}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/20{background-color:color-mix(in oklab, var(--color-rose-500) 20%, transparent)}}.bg-rose-600{background-color:var(--color-rose-600)}.bg-rose-800{background-color:var(--color-rose-800)}.bg-rose-800\/40{background-color:#a3003766}@supports (color:color-mix(in lab, red, red)){.bg-rose-800\/40{background-color:color-mix(in oklab, var(--color-rose-800) 40%, transparent)}}.bg-slate-50{background-color:var(--color-slate-50)}.bg-slate-100{background-color:var(--color-slate-100)}.bg-slate-400\/60{background-color:#90a1b999}@supports (color:color-mix(in lab, red, red)){.bg-slate-400\/60{background-color:color-mix(in oklab, var(--color-slate-400) 60%, transparent)}}.bg-slate-500{background-color:var(--color-slate-500)}.bg-slate-800{background-color:var(--color-slate-800)}.bg-slate-900{background-color:var(--color-slate-900)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.bg-white\/8{background-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.bg-white\/8{background-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.bg-white\/10{background-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.bg-white\/10{background-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.bg-gradient-to-br{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-indigo-600\/20{--tw-gradient-from:#4f39f633}@supports (color:color-mix(in lab, red, red)){.from-indigo-600\/20{--tw-gradient-from:color-mix(in oklab, var(--color-indigo-600) 20%, transparent)}}.from-indigo-600\/20{--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-purple-600\/10{--tw-gradient-to:#9810fa1a}@supports (color:color-mix(in lab, red, red)){.to-purple-600\/10{--tw-gradient-to:color-mix(in oklab, var(--color-purple-600) 10%, transparent)}}.to-purple-600\/10{--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-1{padding:var(--spacing)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-2\.5{padding:calc(var(--spacing) * 2.5)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.px-0\.5{padding-inline:calc(var(--spacing) * .5)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-8{padding-block:calc(var(--spacing) * 8)}.pt-0\.5{padding-top:calc(var(--spacing) * .5)}.pt-1{padding-top:var(--spacing)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-\[15vh\]{padding-top:15vh}.pr-2{padding-right:calc(var(--spacing) * 2)}.pb-1{padding-bottom:var(--spacing)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pl-1{padding-left:var(--spacing)}.pl-2{padding-left:calc(var(--spacing) * 2)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.align-middle{vertical-align:middle}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[6px\]{font-size:6px}.text-\[7px\]{font-size:7px}.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[12px\]{font-size:12px}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.text-\[26px\]{font-size:26px}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-black{--tw-font-weight:var(--font-weight-black);font-weight:var(--font-weight-black)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.text-wrap{text-wrap:wrap}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.text-amber-600{color:var(--color-amber-600)}.text-amber-700{color:var(--color-amber-700)}.text-amber-700\/80{color:#b75000cc}@supports (color:color-mix(in lab, red, red)){.text-amber-700\/80{color:color-mix(in oklab, var(--color-amber-700) 80%, transparent)}}.text-emerald-300{color:var(--color-emerald-300)}.text-emerald-400{color:var(--color-emerald-400)}.text-emerald-600{color:var(--color-emerald-600)}.text-emerald-700{color:var(--color-emerald-700)}.text-emerald-800{color:var(--color-emerald-800)}.text-indigo-300{color:var(--color-indigo-300)}.text-indigo-600{color:var(--color-indigo-600)}.text-indigo-600\/60{color:#4f39f699}@supports (color:color-mix(in lab, red, red)){.text-indigo-600\/60{color:color-mix(in oklab, var(--color-indigo-600) 60%, transparent)}}.text-indigo-600\/70{color:#4f39f6b3}@supports (color:color-mix(in lab, red, red)){.text-indigo-600\/70{color:color-mix(in oklab, var(--color-indigo-600) 70%, transparent)}}.text-indigo-700{color:var(--color-indigo-700)}.text-indigo-800{color:var(--color-indigo-800)}.text-orange-600{color:var(--color-orange-600)}.text-pink-600{color:var(--color-pink-600)}.text-red-400{color:var(--color-red-400)}.text-red-700{color:var(--color-red-700)}.text-rose-400{color:var(--color-rose-400)}.text-rose-600{color:var(--color-rose-600)}.text-rose-700{color:var(--color-rose-700)}.text-sky-600{color:var(--color-sky-600)}.text-slate-200{color:var(--color-slate-200)}.text-slate-300{color:var(--color-slate-300)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-slate-900\/70{color:#0f172bb3}@supports (color:color-mix(in lab, red, red)){.text-slate-900\/70{color:color-mix(in oklab, var(--color-slate-900) 70%, transparent)}}.text-slate-900\/80{color:#0f172bcc}@supports (color:color-mix(in lab, red, red)){.text-slate-900\/80{color:color-mix(in oklab, var(--color-slate-900) 80%, transparent)}}.text-slate-900\/85{color:#0f172bd9}@supports (color:color-mix(in lab, red, red)){.text-slate-900\/85{color:color-mix(in oklab, var(--color-slate-900) 85%, transparent)}}.text-teal-600{color:var(--color-teal-600)}.text-violet-600{color:var(--color-violet-600)}.text-white{color:var(--color-white)}.text-white\/80{color:#fffc}@supports (color:color-mix(in lab, red, red)){.text-white\/80{color:color-mix(in oklab, var(--color-white) 80%, transparent)}}.capitalize{text-transform:capitalize}.uppercase{text-transform:uppercase}.italic{font-style:italic}.proportional-nums{--tw-numeric-spacing:proportional-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.overline{text-decoration-line:overline}.underline{text-decoration-line:underline}.placeholder-slate-400::placeholder{color:var(--color-slate-400)}.accent-indigo-500{accent-color:var(--color-indigo-500)}.opacity-0{opacity:0}.opacity-30{opacity:.3}.opacity-40{opacity:.4}.opacity-70{opacity:.7}.opacity-90{opacity:.9}.opacity-100{opacity:1}.mix-blend-difference{mix-blend-mode:difference}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow\/translate{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-black\/60{--tw-shadow-color:#0009}@supports (color:color-mix(in lab, red, red)){.shadow-black\/60{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-black) 60%, transparent) var(--tw-shadow-alpha), transparent)}}.shadow-emerald-600\/30{--tw-shadow-color:#0097674d}@supports (color:color-mix(in lab, red, red)){.shadow-emerald-600\/30{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-emerald-600) 30%, transparent) var(--tw-shadow-alpha), transparent)}}.shadow-indigo-600\/30{--tw-shadow-color:#4f39f64d}@supports (color:color-mix(in lab, red, red)){.shadow-indigo-600\/30{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-indigo-600) 30%, transparent) var(--tw-shadow-alpha), transparent)}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.drop-shadow{--tw-drop-shadow-size:drop-shadow(0 1px 2px var(--tw-drop-shadow-color,#0000001a)) drop-shadow(0 1px 1px var(--tw-drop-shadow-color,#0000000f));--tw-drop-shadow:drop-shadow(0 1px 2px #0000001a) drop-shadow(0 1px 1px #0000000f);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.invert{--tw-invert:invert(100%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.delay-5{transition-delay:5ms}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-all{-webkit-user-select:all;user-select:all}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.group-hover\:text-slate-500:is(:where(.group):hover *){color:var(--color-slate-500)}.group-hover\:text-slate-700:is(:where(.group):hover *){color:var(--color-slate-700)}.group-hover\:text-slate-900:is(:where(.group):hover *){color:var(--color-slate-900)}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.placeholder\:text-slate-500::placeholder{color:var(--color-slate-500)}.placeholder\:text-slate-600::placeholder{color:var(--color-slate-600)}@media (hover:hover){.hover\:border-black\/12:hover{border-color:#0000001f}@supports (color:color-mix(in lab, red, red)){.hover\:border-black\/12:hover{border-color:color-mix(in oklab, var(--color-black) 12%, transparent)}}.hover\:border-black\/14:hover{border-color:#00000024}@supports (color:color-mix(in lab, red, red)){.hover\:border-black\/14:hover{border-color:color-mix(in oklab, var(--color-black) 14%, transparent)}}.hover\:border-rose-500\/30:hover{border-color:#ff23574d}@supports (color:color-mix(in lab, red, red)){.hover\:border-rose-500\/30:hover{border-color:color-mix(in oklab, var(--color-rose-500) 30%, transparent)}}.hover\:bg-black\/4:hover{background-color:#0000000a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/4:hover{background-color:color-mix(in oklab, var(--color-black) 4%, transparent)}}.hover\:bg-black\/5:hover{background-color:#0000000d}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/5:hover{background-color:color-mix(in oklab, var(--color-black) 5%, transparent)}}.hover\:bg-black\/6:hover{background-color:#0000000f}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/6:hover{background-color:color-mix(in oklab, var(--color-black) 6%, transparent)}}.hover\:bg-black\/8:hover{background-color:#00000014}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/8:hover{background-color:color-mix(in oklab, var(--color-black) 8%, transparent)}}.hover\:bg-black\/12:hover{background-color:#0000001f}@supports (color:color-mix(in lab, red, red)){.hover\:bg-black\/12:hover{background-color:color-mix(in oklab, var(--color-black) 12%, transparent)}}.hover\:bg-emerald-500:hover{background-color:var(--color-emerald-500)}.hover\:bg-emerald-500\/10:hover{background-color:#00bb7f1a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-emerald-500\/10:hover{background-color:color-mix(in oklab, var(--color-emerald-500) 10%, transparent)}}.hover\:bg-indigo-500:hover{background-color:var(--color-indigo-500)}.hover\:bg-indigo-500\/20:hover{background-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-500\/20:hover{background-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.hover\:bg-indigo-600\/25:hover{background-color:#4f39f640}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-600\/25:hover{background-color:color-mix(in oklab, var(--color-indigo-600) 25%, transparent)}}.hover\:bg-indigo-600\/30:hover{background-color:#4f39f64d}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-600\/30:hover{background-color:color-mix(in oklab, var(--color-indigo-600) 30%, transparent)}}.hover\:bg-indigo-600\/35:hover{background-color:#4f39f659}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-600\/35:hover{background-color:color-mix(in oklab, var(--color-indigo-600) 35%, transparent)}}.hover\:bg-rose-500:hover{background-color:var(--color-rose-500)}.hover\:bg-rose-500\/10:hover{background-color:#ff23571a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-rose-500\/10:hover{background-color:color-mix(in oklab, var(--color-rose-500) 10%, transparent)}}.hover\:bg-white\/8:hover{background-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.hover\:bg-white\/8:hover{background-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.hover\:bg-white\/12:hover{background-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.hover\:bg-white\/12:hover{background-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.hover\:text-emerald-300:hover{color:var(--color-emerald-300)}.hover\:text-indigo-600:hover{color:var(--color-indigo-600)}.hover\:text-rose-300:hover{color:var(--color-rose-300)}.hover\:text-rose-600:hover{color:var(--color-rose-600)}.hover\:text-rose-700:hover{color:var(--color-rose-700)}.hover\:text-slate-600:hover{color:var(--color-slate-600)}.hover\:text-slate-700:hover{color:var(--color-slate-700)}.hover\:text-slate-800:hover{color:var(--color-slate-800)}.hover\:text-slate-900:hover{color:var(--color-slate-900)}.hover\:text-white:hover{color:var(--color-white)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-100:hover{opacity:1}}.focus\:border-indigo-500:focus{border-color:var(--color-indigo-500)}.focus\:opacity-100:focus{opacity:1}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-25:disabled{opacity:.25}.disabled\:opacity-40:disabled{opacity:.4}@media (min-width:40rem){.sm\:block{display:block}.sm\:inline{display:inline}.sm\:gap-3{gap:calc(var(--spacing) * 3)}.sm\:opacity-0{opacity:0}.sm\:group-focus-within\:opacity-100:is(:where(.group):focus-within *){opacity:1}@media (hover:hover){.sm\:group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}}@media (min-width:48rem){.md\:block{display:block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:w-\[360px\]{width:360px}.md\:flex-1{flex:1}.md\:flex-none{flex:none}}.dark\:border-white\/6:where(.dark,.dark *){border-color:#ffffff0f}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/6:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 6%, transparent)}}.dark\:border-white\/8:where(.dark,.dark *){border-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/8:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.dark\:border-white\/10:where(.dark,.dark *){border-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/10:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.dark\:border-white\/12:where(.dark,.dark *){border-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/12:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.dark\:border-white\/20:where(.dark,.dark *){border-color:#fff3}@supports (color:color-mix(in lab, red, red)){.dark\:border-white\/20:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-white) 20%, transparent)}}.dark\:bg-\[\#0a0a0f\]:where(.dark,.dark *){background-color:#0a0a0f}.dark\:bg-\[\#0a0a10\]:where(.dark,.dark *){background-color:#0a0a10}.dark\:bg-\[\#0c0c15\]:where(.dark,.dark *){background-color:#0c0c15}.dark\:bg-\[\#0d0d14\]:where(.dark,.dark *){background-color:#0d0d14}.dark\:bg-\[\#1a1a2e\]:where(.dark,.dark *){background-color:#1a1a2e}.dark\:bg-\[\#06060a\]:where(.dark,.dark *){background-color:#06060a}.dark\:bg-\[\#07070b\]:where(.dark,.dark *){background-color:#07070b}.dark\:bg-\[\#09090e\]:where(.dark,.dark *){background-color:#09090e}.dark\:bg-\[\#111118\]:where(.dark,.dark *){background-color:#111118}.dark\:bg-emerald-900\/40:where(.dark,.dark *){background-color:#004e3b66}@supports (color:color-mix(in lab, red, red)){.dark\:bg-emerald-900\/40:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-emerald-900) 40%, transparent)}}.dark\:bg-red-900\/40:where(.dark,.dark *){background-color:#82181a66}@supports (color:color-mix(in lab, red, red)){.dark\:bg-red-900\/40:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-red-900) 40%, transparent)}}.dark\:bg-slate-600\/60:where(.dark,.dark *){background-color:#45556c99}@supports (color:color-mix(in lab, red, red)){.dark\:bg-slate-600\/60:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-slate-600) 60%, transparent)}}.dark\:bg-white\/3:where(.dark,.dark *){background-color:#ffffff08}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/3:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 3%, transparent)}}.dark\:bg-white\/4:where(.dark,.dark *){background-color:#ffffff0a}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/4:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 4%, transparent)}}.dark\:bg-white\/5:where(.dark,.dark *){background-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/5:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.dark\:bg-white\/6:where(.dark,.dark *){background-color:#ffffff0f}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/6:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 6%, transparent)}}.dark\:bg-white\/8:where(.dark,.dark *){background-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/8:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.dark\:bg-white\/10:where(.dark,.dark *){background-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/10:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.dark\:bg-white\/12:where(.dark,.dark *){background-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/12:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.dark\:bg-white\/20:where(.dark,.dark *){background-color:#fff3}@supports (color:color-mix(in lab, red, red)){.dark\:bg-white\/20:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-white) 20%, transparent)}}.dark\:text-amber-300:where(.dark,.dark *){color:var(--color-amber-300)}.dark\:text-amber-400:where(.dark,.dark *){color:var(--color-amber-400)}.dark\:text-amber-500\/80:where(.dark,.dark *){color:#f99c00cc}@supports (color:color-mix(in lab, red, red)){.dark\:text-amber-500\/80:where(.dark,.dark *){color:color-mix(in oklab, var(--color-amber-500) 80%, transparent)}}.dark\:text-emerald-200:where(.dark,.dark *){color:var(--color-emerald-200)}.dark\:text-emerald-300:where(.dark,.dark *){color:var(--color-emerald-300)}.dark\:text-emerald-400:where(.dark,.dark *){color:var(--color-emerald-400)}.dark\:text-indigo-200:where(.dark,.dark *){color:var(--color-indigo-200)}.dark\:text-indigo-300:where(.dark,.dark *){color:var(--color-indigo-300)}.dark\:text-indigo-400:where(.dark,.dark *){color:var(--color-indigo-400)}.dark\:text-indigo-400\/60:where(.dark,.dark *){color:#7d87ff99}@supports (color:color-mix(in lab, red, red)){.dark\:text-indigo-400\/60:where(.dark,.dark *){color:color-mix(in oklab, var(--color-indigo-400) 60%, transparent)}}.dark\:text-indigo-400\/70:where(.dark,.dark *){color:#7d87ffb3}@supports (color:color-mix(in lab, red, red)){.dark\:text-indigo-400\/70:where(.dark,.dark *){color:color-mix(in oklab, var(--color-indigo-400) 70%, transparent)}}.dark\:text-orange-400:where(.dark,.dark *){color:var(--color-orange-400)}.dark\:text-pink-400:where(.dark,.dark *){color:var(--color-pink-400)}.dark\:text-red-300:where(.dark,.dark *){color:var(--color-red-300)}.dark\:text-rose-300:where(.dark,.dark *){color:var(--color-rose-300)}.dark\:text-rose-400:where(.dark,.dark *){color:var(--color-rose-400)}.dark\:text-sky-400:where(.dark,.dark *){color:var(--color-sky-400)}.dark\:text-slate-100:where(.dark,.dark *){color:var(--color-slate-100)}.dark\:text-slate-200:where(.dark,.dark *){color:var(--color-slate-200)}.dark\:text-slate-300:where(.dark,.dark *){color:var(--color-slate-300)}.dark\:text-slate-400:where(.dark,.dark *){color:var(--color-slate-400)}.dark\:text-slate-600:where(.dark,.dark *){color:var(--color-slate-600)}.dark\:text-slate-700:where(.dark,.dark *){color:var(--color-slate-700)}.dark\:text-teal-400:where(.dark,.dark *){color:var(--color-teal-400)}.dark\:text-violet-400:where(.dark,.dark *){color:var(--color-violet-400)}.dark\:text-white:where(.dark,.dark *){color:var(--color-white)}.dark\:text-white\/70:where(.dark,.dark *){color:#ffffffb3}@supports (color:color-mix(in lab, red, red)){.dark\:text-white\/70:where(.dark,.dark *){color:color-mix(in oklab, var(--color-white) 70%, transparent)}}.dark\:text-white\/80:where(.dark,.dark *){color:#fffc}@supports (color:color-mix(in lab, red, red)){.dark\:text-white\/80:where(.dark,.dark *){color:color-mix(in oklab, var(--color-white) 80%, transparent)}}.dark\:text-white\/85:where(.dark,.dark *){color:#ffffffd9}@supports (color:color-mix(in lab, red, red)){.dark\:text-white\/85:where(.dark,.dark *){color:color-mix(in oklab, var(--color-white) 85%, transparent)}}.dark\:placeholder-slate-600:where(.dark,.dark *)::placeholder{color:var(--color-slate-600)}@media (hover:hover){.dark\:group-hover\:text-slate-300:where(.dark,.dark *):is(:where(.group):hover *){color:var(--color-slate-300)}.dark\:group-hover\:text-white:where(.dark,.dark *):is(:where(.group):hover *){color:var(--color-white)}}.dark\:placeholder\:text-slate-400:where(.dark,.dark *)::placeholder{color:var(--color-slate-400)}@media (hover:hover){.dark\:hover\:border-white\/12:where(.dark,.dark *):hover{border-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:border-white\/12:where(.dark,.dark *):hover{border-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.dark\:hover\:border-white\/14:where(.dark,.dark *):hover{border-color:#ffffff24}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:border-white\/14:where(.dark,.dark *):hover{border-color:color-mix(in oklab, var(--color-white) 14%, transparent)}}.dark\:hover\:bg-white\/4:where(.dark,.dark *):hover{background-color:#ffffff0a}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/4:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 4%, transparent)}}.dark\:hover\:bg-white\/5:where(.dark,.dark *):hover{background-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/5:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.dark\:hover\:bg-white\/6:where(.dark,.dark *):hover{background-color:#ffffff0f}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/6:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 6%, transparent)}}.dark\:hover\:bg-white\/8:where(.dark,.dark *):hover{background-color:#ffffff14}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/8:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 8%, transparent)}}.dark\:hover\:bg-white\/12:where(.dark,.dark *):hover{background-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-white\/12:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.dark\:hover\:text-indigo-400:where(.dark,.dark *):hover{color:var(--color-indigo-400)}.dark\:hover\:text-rose-300:where(.dark,.dark *):hover{color:var(--color-rose-300)}.dark\:hover\:text-rose-400:where(.dark,.dark *):hover{color:var(--color-rose-400)}.dark\:hover\:text-slate-200:where(.dark,.dark *):hover{color:var(--color-slate-200)}.dark\:hover\:text-slate-300:where(.dark,.dark *):hover{color:var(--color-slate-300)}.dark\:hover\:text-slate-400:where(.dark,.dark *):hover{color:var(--color-slate-400)}.dark\:hover\:text-white:where(.dark,.dark *):hover{color:var(--color-white)}}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}.clampRange.svelte-iy59wr{appearance:none;pointer-events:none;background:0 0;margin:0}.clampRange.svelte-iy59wr::-webkit-slider-thumb{appearance:none;cursor:pointer;pointer-events:auto;background:0 0;border-radius:9999px;width:16px;height:16px}.clampRange.svelte-iy59wr::-moz-range-thumb{cursor:pointer;pointer-events:auto;background:0 0;border:0;border-radius:9999px;width:16px;height:16px}.clampRange.svelte-iy59wr::-moz-range-track{background:0 0}@layer slashed.tokens{@property --sf-color-primary-source-light{syntax:"";inherits:true;initial-value:oklch(47% .27 264)}@property --sf-color-secondary-source-light{syntax:"";inherits:true;initial-value:oklch(22% .04 264)}@property --sf-color-tertiary-source-light{syntax:"";inherits:true;initial-value:oklch(42% .22 295)}@property --sf-color-action-source-light{syntax:"";inherits:true;initial-value:oklch(50% .22 235)}@property --sf-color-neutral-source-light{syntax:"";inherits:true;initial-value:oklch(52% .025 260)}@property --sf-color-base-source-light{syntax:"";inherits:true;initial-value:oklch(96% .006 250)}@property --sf-color-success-source-light{syntax:"";inherits:true;initial-value:oklch(50% .16 145)}@property --sf-color-warning-source-light{syntax:"";inherits:true;initial-value:oklch(75% .17 80)}@property --sf-color-info-source-light{syntax:"";inherits:true;initial-value:oklch(48% .18 235)}@property --sf-color-danger-source-light{syntax:"";inherits:true;initial-value:oklch(48% .22 12)}:root{--sf-color-primary-source-light:#0137ee;--sf-color-secondary-source-light:#111a2d;--sf-color-tertiary-source-light:#5c10b4;--sf-color-action-source-light:#006c98;--sf-color-neutral-source-light:#616978;--sf-color-base-source-light:#eff2f6;--sf-color-success-source-light:#00791d;--sf-color-warning-source-light:#e2a000;--sf-color-info-source-light:#006693;--sf-color-danger-source-light:#af0040}@supports (color:lab(0% 0 0)){:root{--sf-color-primary-source-light:lab(33.7875% 46.3905 -95.4963);--sf-color-secondary-source-light:lab(9.22675% 1.07623 -14.3482);--sf-color-tertiary-source-light:lab(28.2584% 55.0822 -70.9314);--sf-color-action-source-light:lab(41.335% -12.4269 -63.6346);--sf-color-neutral-source-light:lab(44.2238% -1.00827 -9.19603);--sf-color-base-source-light:lab(95.3554% -.662148 -2.14612);--sf-color-success-source-light:lab(43.8665% -45.1423 39.6128);--sf-color-warning-source-light:lab(70.9465% 19.2186 87.3143);--sf-color-info-source-light:lab(39.3159% -14.401 -52.2544);--sf-color-danger-source-light:lab(37.1443% 71.0626 21.0806)}}@property --sf-color-primary-source-dark{syntax:"";inherits:true;initial-value:oklch(71.5% .243 264)}@property --sf-color-secondary-source-dark{syntax:"";inherits:true;initial-value:oklch(84% .036 264)}@property --sf-color-tertiary-source-dark{syntax:"";inherits:true;initial-value:oklch(74% .198 295)}@property --sf-color-action-source-dark{syntax:"";inherits:true;initial-value:oklch(70% .198 235)}@property --sf-color-neutral-source-dark{syntax:"";inherits:true;initial-value:oklch(69% .0225 260)}@property --sf-color-base-source-dark{syntax:"";inherits:true;initial-value:oklch(22% .003 250)}@property --sf-color-success-source-dark{syntax:"";inherits:true;initial-value:oklch(70% .144 145)}@property --sf-color-warning-source-dark{syntax:"";inherits:true;initial-value:oklch(65% .153 80)}@property --sf-color-info-source-dark{syntax:"";inherits:true;initial-value:oklch(71% .162 235)}@property --sf-color-danger-source-dark{syntax:"";inherits:true;initial-value:oklch(71% .198 12)}@property --sf-color-primary{syntax:"";inherits:true;initial-value:oklch(47% .27 264)}@property --sf-color-secondary{syntax:"";inherits:true;initial-value:oklch(22% .04 264)}@property --sf-color-tertiary{syntax:"";inherits:true;initial-value:oklch(42% .22 295)}@property --sf-color-action{syntax:"";inherits:true;initial-value:oklch(50% .22 235)}@property --sf-color-neutral{syntax:"";inherits:true;initial-value:oklch(52% .025 260)}@property --sf-color-base{syntax:"";inherits:true;initial-value:oklch(96% .006 250)}@property --sf-color-success{syntax:"";inherits:true;initial-value:oklch(50% .16 145)}@property --sf-color-warning{syntax:"";inherits:true;initial-value:oklch(75% .17 80)}@property --sf-color-info{syntax:"";inherits:true;initial-value:oklch(48% .18 235)}@property --sf-color-danger{syntax:"";inherits:true;initial-value:oklch(48% .22 12)}:root{--sf-color-primary:var(--sf-color-primary-source-light);--sf-color-secondary:var(--sf-color-secondary-source-light);--sf-color-tertiary:var(--sf-color-tertiary-source-light);--sf-color-action:var(--sf-color-action-source-light);--sf-color-neutral:var(--sf-color-neutral-source-light);--sf-color-base:var(--sf-color-base-source-light);--sf-color-success:var(--sf-color-success-source-light);--sf-color-warning:var(--sf-color-warning-source-light);--sf-color-info:var(--sf-color-info-source-light);--sf-color-danger:var(--sf-color-danger-source-light)}@property --sf-is-dark{syntax:"";inherits:true;initial-value:0}@property --sf-is-active{syntax:"";inherits:true;initial-value:0}@property --sf-is-current{syntax:"";inherits:true;initial-value:0}@property --sf-is-pressed{syntax:"";inherits:true;initial-value:0}@property --sf-is-open{syntax:"";inherits:true;initial-value:0}@property --sf-fluid-min-vw{syntax:"";inherits:true;initial-value:22.5}@property --sf-fluid-max-vw{syntax:"";inherits:true;initial-value:90}@property --sf-text-ratio-min{syntax:"";inherits:true;initial-value:1.25}@property --sf-text-ratio-max{syntax:"";inherits:true;initial-value:1.333}@property --sf-text-base-min{syntax:"";inherits:true;initial-value:1}@property --sf-text-base-max{syntax:"";inherits:true;initial-value:1.25}@property --sf-text-display-base-min{syntax:"";inherits:true;initial-value:2.4}@property --sf-text-display-base-max{syntax:"";inherits:true;initial-value:3}@property --sf-space-ratio-min{syntax:"";inherits:true;initial-value:1.25}@property --sf-space-ratio-max{syntax:"";inherits:true;initial-value:1.333}@property --sf-space-base-min{syntax:"";inherits:true;initial-value:1}@property --sf-space-base-max{syntax:"";inherits:true;initial-value:2}@property --sf-fluid-width{syntax:"*";inherits:true}@property --sf-radius-none{syntax:"";inherits:true;initial-value:0}@property --sf-radius-2xs{syntax:"";inherits:true;initial-value:0}@property --sf-radius-xs{syntax:"";inherits:true;initial-value:0}@property --sf-radius-s{syntax:"";inherits:true;initial-value:0}@property --sf-radius-m{syntax:"";inherits:true;initial-value:0}@property --sf-radius-l{syntax:"";inherits:true;initial-value:0}@property --sf-radius-xl{syntax:"";inherits:true;initial-value:0}@property --sf-radius-2xl{syntax:"";inherits:true;initial-value:0}@property --sf-radius-3xl{syntax:"";inherits:true;initial-value:0}@property --sf-radius-4xl{syntax:"";inherits:true;initial-value:0}@property --sf-radius-full{syntax:"";inherits:true;initial-value:9999px}@property --sf-radius-pill{syntax:"";inherits:true;initial-value:9999px}@property --sf-radius-outer{syntax:"";inherits:true;initial-value:0}@property --sf-media-radius{syntax:"";inherits:true;initial-value:0}@property --sf-space-none{syntax:"";inherits:true;initial-value:0}@property --sf-space-px{syntax:"";inherits:true;initial-value:1px}@property --sf-space-2xs{syntax:"";inherits:true;initial-value:0}@property --sf-space-xs{syntax:"";inherits:true;initial-value:0}@property --sf-space-s{syntax:"";inherits:true;initial-value:0}@property --sf-space-m{syntax:"";inherits:true;initial-value:0}@property --sf-space-l{syntax:"";inherits:true;initial-value:0}@property --sf-space-xl{syntax:"";inherits:true;initial-value:0}@property --sf-space-2xl{syntax:"";inherits:true;initial-value:0}@property --sf-space-3xl{syntax:"";inherits:true;initial-value:0}@property --sf-space-4xl{syntax:"";inherits:true;initial-value:0}@property --sf-gap{syntax:"";inherits:true;initial-value:0}@property --sf-content-gap{syntax:"";inherits:true;initial-value:0}@property --sf-gutter{syntax:"";inherits:true;initial-value:0}@property --sf-component-pad{syntax:"";inherits:true;initial-value:0}@property --sf-field-block{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--xs{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--s{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--m{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--l{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--xl{syntax:"";inherits:true;initial-value:0}@property --sf-section-pad--2xl{syntax:"";inherits:true;initial-value:0}@property --sf-shadow-none{syntax:"*";inherits:true}@property --sf-shadow-xs{syntax:"*";inherits:true}@property --sf-shadow-s{syntax:"*";inherits:true}@property --sf-shadow-m{syntax:"*";inherits:true}@property --sf-shadow-l{syntax:"*";inherits:true}@property --sf-shadow-xl{syntax:"*";inherits:true}@property --sf-shadow-2xl{syntax:"*";inherits:true}@property --sf-shadow-inner{syntax:"*";inherits:true}@property --sf-text-shadow-none{syntax:"*";inherits:true}@property --sf-text-shadow-xs{syntax:"*";inherits:true}@property --sf-text-shadow-s{syntax:"*";inherits:true}@property --sf-text-shadow-m{syntax:"*";inherits:true}@property --sf-text-shadow-l{syntax:"*";inherits:true}@property --sf-text-shadow-xl{syntax:"*";inherits:true}@property --sf-drop-shadow-xs{syntax:"*";inherits:true}@property --sf-drop-shadow-s{syntax:"*";inherits:true}@property --sf-drop-shadow-m{syntax:"*";inherits:true}@property --sf-drop-shadow-l{syntax:"*";inherits:true}@property --sf-drop-shadow-xl{syntax:"*";inherits:true}@property --sf-shadow-glow{syntax:"*";inherits:true}:root{--sf-fluid-min-vw:22.5;--sf-fluid-max-vw:90;--sf-fluid-width:100vw;--sf-text-ratio-min:1.25;--sf-text-ratio-max:1.333;--sf-text-base-min:1;--sf-text-base-max:1.25;--sf-text-display-base-min:2.4;--sf-text-display-base-max:3;--sf-space-ratio-min:1.25;--sf-space-ratio-max:1.333;--sf-space-base-min:1;--sf-space-base-max:2;--sf-color-scheme:light dark;--sf-lumlocker:.65;--sf-color-surface:var(--sf-color-base);--sf-color-text--on-base:var(--sf-color-text);--sf-color-text--on-primary:#eee;--sf-color-text--on-secondary:#eee;--sf-color-text--on-tertiary:#eee;--sf-color-text--on-action:#eee;--sf-color-text--on-neutral:#eee;--sf-color-text--on-success:#eee;--sf-color-text--on-warning:#030303;--sf-color-text--on-info:#eee;--sf-color-text--on-danger:#eee;--sf-color-text--on-inverse:#eee;--sf-color-code-text:#030303;--sf-color-border--focus:var(--sf-color-action);--sf-color-link--disabled:var(--sf-color-text--disabled);--sf-link-underline-offset:.15em;--sf-link-underline-thickness:auto;--sf-color-bg--disabled:var(--sf-color-inset);--sf-color-code-bg:var(--sf-color-inset);--sf-color-selection-text:inherit;--sf-color-mark-text:inherit;--sf-color-dim:#00000080;--sf-color-white:#fff;--sf-color-black:#000;--sf-scrollbar-thumb:var(--sf-color-neutral);--sf-scrollbar-track:transparent;--sf-shadow-strength:calc(.08 + var(--sf-is-dark) * .17);--sf-shadow-lightness:.15;--sf-shadow-glow-color:var(--sf-color-primary);--sf-opacity-disabled:.45;--sf-state-pending-opacity:.7;--sf-focus-ring-color:var(--sf-color-action);--sf-focus-ring-shadow:0 0 0 var(--sf-focus-ring-offset) var(--sf-color-bg,var(--sf-color-base-source-light,#fff)), 0 0 0 calc(var(--sf-focus-ring-offset) + var(--sf-focus-ring-width)) var(--sf-focus-ring-color);--sf-caret-color:var(--sf-color-action)}@supports (color:lab(0% 0 0)){:root{--sf-color-text--on-primary:lab(94.2% 0 0);--sf-color-text--on-secondary:lab(94.2% 0 0);--sf-color-text--on-tertiary:lab(94.2% 0 0);--sf-color-text--on-action:lab(94.2% 0 0);--sf-color-text--on-neutral:lab(94.2% 0 0);--sf-color-text--on-success:lab(94.2% 0 0);--sf-color-text--on-warning:lab(.903296% 0 0);--sf-color-text--on-info:lab(94.2% 0 0);--sf-color-text--on-danger:lab(94.2% 0 0);--sf-color-text--on-inverse:lab(94.2% 0 0);--sf-color-code-text:lab(.903296% 0 0);--sf-color-dim:lab(0% 0 0/.5);--sf-color-white:lab(100% 0 0);--sf-color-black:lab(0% 0 0)}}@supports (color:light-dark(white, black)) and (color:oklch(from red l c h)){:root{--sf-color-primary:light-dark(var(--sf-color-primary-source-light),var(--sf-color-primary-source-dark,oklch(from var(--sf-color-primary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-secondary:light-dark(var(--sf-color-secondary-source-light),var(--sf-color-secondary-source-dark,oklch(from var(--sf-color-secondary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-tertiary:light-dark(var(--sf-color-tertiary-source-light),var(--sf-color-tertiary-source-dark,oklch(from var(--sf-color-tertiary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-action:light-dark(var(--sf-color-action-source-light),var(--sf-color-action-source-dark,oklch(from var(--sf-color-action-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-neutral:light-dark(var(--sf-color-neutral-source-light),var(--sf-color-neutral-source-dark,oklch(from var(--sf-color-neutral-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-base:light-dark(var(--sf-color-base-source-light),var(--sf-color-base-source-dark,oklch(from var(--sf-color-base-source-light) clamp(.16, calc(1.18 - l), .24) calc(c * .5) h)));--sf-color-success:light-dark(var(--sf-color-success-source-light),var(--sf-color-success-source-dark,oklch(from var(--sf-color-success-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-warning:light-dark(var(--sf-color-warning-source-light),var(--sf-color-warning-source-dark,oklch(from var(--sf-color-warning-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-info:light-dark(var(--sf-color-info-source-light),var(--sf-color-info-source-dark,oklch(from var(--sf-color-info-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-danger:light-dark(var(--sf-color-danger-source-light),var(--sf-color-danger-source-dark,oklch(from var(--sf-color-danger-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)));--sf-color-text:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.05, calc(l - .4 - var(--sf-contrast-bias)), .35) c h),oklch(from var(--sf-color-neutral) clamp(.7, calc(l + .25 + var(--sf-contrast-bias)), 1) c h));--sf-color-text--muted:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.35, calc(l - var(--sf-contrast-bias)), .62) c h),oklch(from var(--sf-color-neutral) clamp(.48, calc(l + var(--sf-contrast-bias)), .74) c h));--sf-color-text--secondary:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.15, calc(l - .25 - var(--sf-contrast-bias)), .45) c h),oklch(from var(--sf-color-neutral) clamp(.55, calc(l + .1 + var(--sf-contrast-bias)), .9) c h));--sf-color-text--placeholder:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.45, calc(l + .15), .75) c h),oklch(from var(--sf-color-neutral) clamp(.35, calc(l - .1), .65) c h));--sf-color-text--disabled:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.55, calc(l + .25), .82) c h),oklch(from var(--sf-color-neutral) clamp(.25, calc(l - .2), .55) c h));--sf-color-text--inverse:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.85, calc(l + .4), .98) c h),oklch(from var(--sf-color-neutral) clamp(.05, calc(l - .4), .35) c h));--sf-color-heading:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.05, calc(l - .4 - var(--sf-contrast-bias)), .35) c h),oklch(from var(--sf-color-neutral) clamp(.7, calc(l + .25 + var(--sf-contrast-bias)), 1) c h));--sf-color-border:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.7, calc(l + .35), .95) .005 h),oklch(from var(--sf-color-neutral) clamp(.25, calc(l - .3), .55) .005 h));--sf-color-border--subtle:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.75, calc(l + .4), .97) .005 h),oklch(from var(--sf-color-neutral) clamp(.2, calc(l - .38), .45) .005 h));--sf-color-border--strong:light-dark(oklch(from var(--sf-color-neutral-source-light) clamp(.55, calc(l + .1), .85) .02 h),oklch(from var(--sf-color-neutral) clamp(.38, calc(l - .1), .65) .02 h));--sf-color-link:light-dark(oklch(from var(--sf-color-action) clamp(0, min(l - .07, .48), 1) c h),oklch(from var(--sf-color-action) clamp(.68, l, 1) c h));--sf-color-link--hover:light-dark(oklch(from var(--sf-color-action) clamp(0, min(l - .15, .4), 1) c h),oklch(from var(--sf-color-action) clamp(0, max(l + .1, .68), 1) c h));--sf-color-link--active:light-dark(oklch(from var(--sf-color-action) clamp(0, min(l - .21, .34), 1) c h),oklch(from var(--sf-color-action) clamp(0, max(l + .15, .74), 1) c h));--sf-color-link--visited:light-dark(oklch(from var(--sf-color-action) clamp(0, min(l - .07, .48), 1) c calc(h + 60)),oklch(from var(--sf-color-action) clamp(.68, l, 1) c calc(h + 60)));--sf-color-selection-bg:light-dark(oklch(from var(--sf-color-action-source-light) l c h / .28),oklch(from var(--sf-color-action-source-dark) clamp(.62, calc(.93 - l * .4), .78) c h / .55));--sf-color-selection-bg--alt:light-dark(oklch(from var(--sf-color-action-source-dark) clamp(.62, calc(.93 - l * .4), .78) c h / .55),oklch(from var(--sf-color-action-source-light) l c h / .28));--sf-color-selection-text--alt:inherit;--sf-color-success-strong:light-dark(oklch(from var(--sf-color-success-source-light) calc(l - .15) c h),oklch(from var(--sf-color-success) clamp(.7, calc(l + .15), 1) c h));--sf-color-warning-strong:light-dark(oklch(from var(--sf-color-warning-source-light) calc(l - .25) c h),oklch(from var(--sf-color-warning) clamp(.7, calc(l + .05), 1) c h));--sf-color-info-strong:light-dark(oklch(from var(--sf-color-info-source-light) calc(l - .1) c h),oklch(from var(--sf-color-info) clamp(.7, calc(l + .15), 1) c h));--sf-color-danger-strong:light-dark(oklch(from var(--sf-color-danger-source-light) calc(l - .1) c h),oklch(from var(--sf-color-danger) clamp(.7, calc(l + .15), 1) c h))}}@supports (color:oklch(from red l c h)){:root{--sf-color-bg:oklch(from var(--sf-color-base) calc(l + .02) c h);--sf-color-inset:oklch(from var(--sf-color-base) calc(l - .02) c h);--sf-color-raised:oklch(from var(--sf-color-base) calc(l + .04) c h);--sf-color-overlay:oklch(from var(--sf-color-base) l c h / .9);--sf-color-inverse:oklch(from var(--sf-color-base) calc(1 - l) c h);--sf-color-border--disabled:oklch(from var(--sf-color-border--subtle) l 0 h / .5);--sf-color-border--translucent:oklch(from var(--sf-color-neutral) l c h / .15);--sf-color-link--underline:oklch(from var(--sf-color-action) l c h / .3);--sf-color-bg--hover:oklch(from var(--sf-color-neutral) l c h / .08);--sf-color-bg--active:oklch(from var(--sf-color-neutral) l c h / .12);--sf-color-bg--selected:oklch(from var(--sf-color-action) l c h / .1);--sf-color-bg--focus:oklch(from var(--sf-color-action) l c h / .06);--sf-color-mark-bg:oklch(from var(--sf-color-warning) l c h / .25);--sf-color-success-subtle:oklch(from var(--sf-color-success) l c h / .12);--sf-color-success-muted:oklch(from var(--sf-color-success) l c h / .3);--sf-color-warning-subtle:oklch(from var(--sf-color-warning) l c h / .12);--sf-color-warning-muted:oklch(from var(--sf-color-warning) l c h / .3);--sf-color-info-subtle:oklch(from var(--sf-color-info) l c h / .1);--sf-color-info-muted:oklch(from var(--sf-color-info) l c h / .3);--sf-color-danger-subtle:oklch(from var(--sf-color-danger) l c h / .1);--sf-color-danger-muted:oklch(from var(--sf-color-danger) l c h / .3);--sf-gradient-primary:linear-gradient(in oklch 135deg, var(--sf-color-primary), oklch(from var(--sf-color-primary) calc(l - .08) c h));--sf-gradient-secondary:linear-gradient(in oklch 135deg, var(--sf-color-secondary), oklch(from var(--sf-color-secondary) calc(l - .08) c h));--sf-gradient-tertiary:linear-gradient(in oklch 135deg, var(--sf-color-tertiary), oklch(from var(--sf-color-tertiary) calc(l - .08) c h));--sf-gradient-brand:linear-gradient(in oklch 135deg, var(--sf-color-primary), oklch(from var(--sf-color-primary) l c calc(h + 30)));--sf-gradient-surface:linear-gradient(in oklab 180deg, var(--sf-color-surface), var(--sf-color-bg));--sf-gradient-fade--r:linear-gradient(in oklch to right, transparent, var(--sf-color-bg));--sf-gradient-fade--l:linear-gradient(in oklch to left, transparent, var(--sf-color-bg));--sf-gradient-fade--t:linear-gradient(in oklch to top, transparent, var(--sf-color-bg));--sf-gradient-fade--b:linear-gradient(in oklch to bottom, transparent, var(--sf-color-bg));--sf-shadow-glow:0 0 15px 2px oklch(from var(--sf-shadow-glow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7))}}@supports (color:oklch(from red l c h)) and (width:calc(1px * sign(1))){:root{--sf-color-code-text:oklch(from var(--sf-color-code-bg) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-primary:oklch(from var(--sf-color-primary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-secondary:oklch(from var(--sf-color-secondary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-tertiary:oklch(from var(--sf-color-tertiary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-action:oklch(from var(--sf-color-action) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-neutral:oklch(from var(--sf-color-neutral) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-success:oklch(from var(--sf-color-success) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-warning:oklch(from var(--sf-color-warning) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-info:oklch(from var(--sf-color-info) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-danger:oklch(from var(--sf-color-danger) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-inverse:oklch(from var(--sf-color-inverse) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0)}}@supports (color:oklch(from red l c h)){:root{--sf-palette-mix-50:4%;--sf-palette-mix-100:8%;--sf-palette-mix-200:20%;--sf-palette-mix-300:40%;--sf-palette-mix-400:65%;--sf-palette-mix-600:82%;--sf-palette-mix-700:62%;--sf-palette-mix-800:38%;--sf-palette-mix-900:18%;--sf-palette-mix-950:8%;--sf-color-primary-50:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-primary-100:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-primary-200:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-primary-300:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-primary-400:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-primary-500:var(--sf-color-primary);--sf-color-primary-600:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-primary-700:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-primary-800:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-primary-900:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-primary-950:color-mix(in oklab, var(--sf-color-primary) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-primary-a5:oklch(from var(--sf-color-primary) l c h / .05);--sf-color-primary-a10:oklch(from var(--sf-color-primary) l c h / .1);--sf-color-primary-a30:oklch(from var(--sf-color-primary) l c h / .3);--sf-color-primary-a50:oklch(from var(--sf-color-primary) l c h / .5);--sf-color-primary-a80:oklch(from var(--sf-color-primary) l c h / .8);--sf-color-primary-superlight:var(--sf-color-primary-50);--sf-color-primary-xlight:var(--sf-color-primary-200);--sf-color-primary-lighter:var(--sf-color-primary-400);--sf-color-primary-darker:var(--sf-color-primary-600);--sf-color-primary-xdark:var(--sf-color-primary-800);--sf-color-primary-superdark:var(--sf-color-primary-950);--sf-color-primary--hover:var(--sf-color-primary-darker);--sf-color-primary--active:var(--sf-color-primary-xdark);--sf-color-primary-subtle:var(--sf-color-primary-a10);--sf-color-primary-muted:var(--sf-color-primary-a30);--sf-color-primary-ghost:var(--sf-color-primary-a5);--sf-color-secondary-50:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-secondary-100:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-secondary-200:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-secondary-300:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-secondary-400:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-secondary-500:var(--sf-color-secondary);--sf-color-secondary-600:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-secondary-700:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-secondary-800:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-secondary-900:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-secondary-950:color-mix(in oklab, var(--sf-color-secondary) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-secondary-a5:oklch(from var(--sf-color-secondary) l c h / .05);--sf-color-secondary-a10:oklch(from var(--sf-color-secondary) l c h / .1);--sf-color-secondary-a30:oklch(from var(--sf-color-secondary) l c h / .3);--sf-color-secondary-a50:oklch(from var(--sf-color-secondary) l c h / .5);--sf-color-secondary-a80:oklch(from var(--sf-color-secondary) l c h / .8);--sf-color-secondary-superlight:var(--sf-color-secondary-50);--sf-color-secondary-xlight:var(--sf-color-secondary-200);--sf-color-secondary-lighter:var(--sf-color-secondary-400);--sf-color-secondary-darker:var(--sf-color-secondary-600);--sf-color-secondary-xdark:var(--sf-color-secondary-800);--sf-color-secondary-superdark:var(--sf-color-secondary-950);--sf-color-secondary--hover:var(--sf-color-secondary-darker);--sf-color-secondary--active:var(--sf-color-secondary-xdark);--sf-color-secondary-subtle:var(--sf-color-secondary-a10);--sf-color-secondary-muted:var(--sf-color-secondary-a30);--sf-color-secondary-ghost:var(--sf-color-secondary-a5);--sf-color-tertiary-50:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-tertiary-100:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-tertiary-200:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-tertiary-300:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-tertiary-400:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-tertiary-500:var(--sf-color-tertiary);--sf-color-tertiary-600:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-tertiary-700:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-tertiary-800:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-tertiary-900:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-tertiary-950:color-mix(in oklab, var(--sf-color-tertiary) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-tertiary-a5:oklch(from var(--sf-color-tertiary) l c h / .05);--sf-color-tertiary-a10:oklch(from var(--sf-color-tertiary) l c h / .1);--sf-color-tertiary-a30:oklch(from var(--sf-color-tertiary) l c h / .3);--sf-color-tertiary-a50:oklch(from var(--sf-color-tertiary) l c h / .5);--sf-color-tertiary-a80:oklch(from var(--sf-color-tertiary) l c h / .8);--sf-color-tertiary-superlight:var(--sf-color-tertiary-50);--sf-color-tertiary-xlight:var(--sf-color-tertiary-200);--sf-color-tertiary-lighter:var(--sf-color-tertiary-400);--sf-color-tertiary-darker:var(--sf-color-tertiary-600);--sf-color-tertiary-xdark:var(--sf-color-tertiary-800);--sf-color-tertiary-superdark:var(--sf-color-tertiary-950);--sf-color-tertiary--hover:var(--sf-color-tertiary-darker);--sf-color-tertiary--active:var(--sf-color-tertiary-xdark);--sf-color-tertiary-subtle:var(--sf-color-tertiary-a10);--sf-color-tertiary-muted:var(--sf-color-tertiary-a30);--sf-color-tertiary-ghost:var(--sf-color-tertiary-a5);--sf-color-action-50:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-action-100:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-action-200:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-action-300:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-action-400:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-action-500:var(--sf-color-action);--sf-color-action-600:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-action-700:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-action-800:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-action-900:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-action-950:color-mix(in oklab, var(--sf-color-action) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-action-a5:oklch(from var(--sf-color-action) l c h / .05);--sf-color-action-a10:oklch(from var(--sf-color-action) l c h / .1);--sf-color-action-a30:oklch(from var(--sf-color-action) l c h / .3);--sf-color-action-a50:oklch(from var(--sf-color-action) l c h / .5);--sf-color-action-a80:oklch(from var(--sf-color-action) l c h / .8);--sf-color-action-superlight:var(--sf-color-action-50);--sf-color-action-xlight:var(--sf-color-action-200);--sf-color-action-lighter:var(--sf-color-action-400);--sf-color-action-darker:var(--sf-color-action-600);--sf-color-action-xdark:var(--sf-color-action-800);--sf-color-action-superdark:var(--sf-color-action-950);--sf-color-action--hover:var(--sf-color-action-darker);--sf-color-action--active:var(--sf-color-action-xdark);--sf-color-action-subtle:var(--sf-color-action-a10);--sf-color-action-muted:var(--sf-color-action-a30);--sf-color-action-ghost:var(--sf-color-action-a5);--sf-color-neutral-50:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-50), var(--sf-color-surface));--sf-color-neutral-100:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-100), var(--sf-color-surface));--sf-color-neutral-200:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-200), var(--sf-color-surface));--sf-color-neutral-300:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-300), var(--sf-color-surface));--sf-color-neutral-400:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-400), var(--sf-color-surface));--sf-color-neutral-500:var(--sf-color-neutral);--sf-color-neutral-600:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-600), var(--sf-color-text));--sf-color-neutral-700:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-700), var(--sf-color-text));--sf-color-neutral-800:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-800), var(--sf-color-text));--sf-color-neutral-900:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-900), var(--sf-color-text));--sf-color-neutral-950:color-mix(in oklab, var(--sf-color-neutral) var(--sf-palette-mix-950), var(--sf-color-text));--sf-color-neutral-a5:oklch(from var(--sf-color-neutral) l c h / .05);--sf-color-neutral-a10:oklch(from var(--sf-color-neutral) l c h / .1);--sf-color-neutral-a30:oklch(from var(--sf-color-neutral) l c h / .3);--sf-color-neutral-a50:oklch(from var(--sf-color-neutral) l c h / .5);--sf-color-neutral-a80:oklch(from var(--sf-color-neutral) l c h / .8);--sf-color-neutral-superlight:var(--sf-color-neutral-50);--sf-color-neutral-xlight:var(--sf-color-neutral-200);--sf-color-neutral-lighter:var(--sf-color-neutral-400);--sf-color-neutral-darker:var(--sf-color-neutral-600);--sf-color-neutral-xdark:var(--sf-color-neutral-800);--sf-color-neutral-superdark:var(--sf-color-neutral-950);--sf-color-neutral--hover:var(--sf-color-neutral-darker);--sf-color-neutral--active:var(--sf-color-neutral-xdark);--sf-color-neutral-subtle:var(--sf-color-neutral-a10);--sf-color-neutral-muted:var(--sf-color-neutral-a30);--sf-color-neutral-ghost:var(--sf-color-neutral-a5);--sf-color-base-50:oklch(from var(--sf-color-base) .97 c h);--sf-color-base-100:oklch(from var(--sf-color-base) .94 c h);--sf-color-base-200:oklch(from var(--sf-color-base) .88 c h);--sf-color-base-300:oklch(from var(--sf-color-base) .78 c h);--sf-color-base-400:oklch(from var(--sf-color-base) .65 c h);--sf-color-base-500:oklch(from var(--sf-color-base) .5 c h);--sf-color-base-600:oklch(from var(--sf-color-base) .37 c h);--sf-color-base-700:oklch(from var(--sf-color-base) .27 c h);--sf-color-base-800:oklch(from var(--sf-color-base) .17 c h);--sf-color-base-900:oklch(from var(--sf-color-base) .11 c h);--sf-color-base-950:oklch(from var(--sf-color-base) .06 c h);--sf-color-base-a5:oklch(from var(--sf-color-base) l c h / .05);--sf-color-base-a10:oklch(from var(--sf-color-base) l c h / .1);--sf-color-base-a30:oklch(from var(--sf-color-base) l c h / .3);--sf-color-base-a50:oklch(from var(--sf-color-base) l c h / .5);--sf-color-base-a80:oklch(from var(--sf-color-base) l c h / .8);--sf-color-base--hover:oklch(from var(--sf-color-base) clamp(.01, calc(l - .04 + var(--sf-is-dark) * .08), .99) c h);--sf-color-base--active:oklch(from var(--sf-color-base) clamp(.01, calc(l - .08 + var(--sf-is-dark) * .16), .99) c h);--sf-color-base-subtle:var(--sf-color-base-a10);--sf-color-base-muted:var(--sf-color-base-a30);--sf-color-base-ghost:var(--sf-color-base-a5)}}:root{--sf-space-scale:1;--sf-text-scale:1;--sf-text-display-scale:1;--sf-radius-scale:1;--sf-motion-scale:1;--sf-section-scale:1;--sf-font-body:system-ui, -apple-system, sans-serif;--sf-font-heading:var(--sf-font-body);--sf-font-display:var(--sf-font-heading);--sf-font-mono:ui-monospace, monospace;--sf-font-humanist:"Seravek", "Gill Sans Nova", "Ubuntu", "Calibri", "DejaVu Sans", source-sans-pro, sans-serif;--sf-font-geometric:"Avenir", "Montserrat", "Corbel", "URW Gothic", source-sans-pro, sans-serif;--sf-font-slab:"Rockwell", "Rockwell Nova", "Roboto Slab", "DejaVu Serif", "Sitka Small", serif;--sf-font-features:normal;--sf-font-variation:normal;--sf-optical-sizing:auto;--sf-font-weight-light:300;--sf-font-weight-normal:400;--sf-font-weight-medium:500;--sf-font-weight-semibold:600;--sf-font-weight-bold:700;--sf-font-weight-body:var(--sf-font-weight-normal);--sf-font-weight-heading:var(--sf-font-weight-semibold);--sf-font-weight-display:var(--sf-font-weight-bold);--sf-font-weight-interactive:var(--sf-font-weight-semibold);--sf-font-weight-strong:var(--sf-font-weight-bold);--sf-current-font-weight:var(--sf-font-weight-bold);--sf-text-2xs:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale));--sf-text-xs:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale));--sf-text-s:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale));--sf-text-m:calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale));--sf-text-l:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale));--sf-text-xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale));--sf-text-2xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale));--sf-text-3xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale));--sf-text-4xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale));--sf-text-display-s:calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale));--sf-text-display-m:calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale));--sf-text-display-l:calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale));--sf-leading-tight:1.1;--sf-leading-snug:1.3;--sf-leading-normal:1.5;--sf-leading-relaxed:1.625;--sf-leading-taper:0;--sf-display-s-line-height:var(--sf-leading-tight);--sf-display-m-line-height:1.05;--sf-display-l-line-height:1;--sf-tracking-tight:-.025em;--sf-tracking-normal:0;--sf-tracking-wide:.025em;--sf-tracking-wider:.05em;--sf-tracking-widest:.1em;--sf-font-numeric:tabular-nums;--sf-text-2xs-line-height:var(--sf-leading-relaxed);--sf-text-2xs-font-weight:var(--sf-font-weight-body);--sf-text-2xs-letter-spacing:var(--sf-tracking-normal);--sf-text-2xs-max-width:55ch;--sf-text-xs-line-height:calc(var(--sf-leading-relaxed) - 1 * var(--sf-leading-taper));--sf-text-xs-font-weight:var(--sf-font-weight-body);--sf-text-xs-letter-spacing:var(--sf-tracking-normal);--sf-text-xs-max-width:60ch;--sf-text-s-line-height:calc(var(--sf-leading-relaxed) - 2 * var(--sf-leading-taper));--sf-text-s-font-weight:var(--sf-font-weight-body);--sf-text-s-letter-spacing:var(--sf-tracking-normal);--sf-text-s-max-width:65ch;--sf-text-m-line-height:calc(var(--sf-leading-normal) - 3 * var(--sf-leading-taper));--sf-text-m-font-weight:var(--sf-font-weight-body);--sf-text-m-letter-spacing:var(--sf-tracking-normal);--sf-text-m-max-width:65ch;--sf-text-l-line-height:calc(var(--sf-leading-normal) - 4 * var(--sf-leading-taper));--sf-text-l-font-weight:var(--sf-font-weight-body);--sf-text-l-letter-spacing:var(--sf-tracking-normal);--sf-text-l-max-width:none;--sf-text-xl-line-height:calc(var(--sf-leading-snug) - 5 * var(--sf-leading-taper));--sf-text-xl-font-weight:var(--sf-font-weight-body);--sf-text-xl-letter-spacing:var(--sf-tracking-normal);--sf-text-xl-max-width:none;--sf-text-2xl-line-height:calc(var(--sf-leading-snug) - 6 * var(--sf-leading-taper));--sf-text-2xl-font-weight:var(--sf-font-weight-heading);--sf-text-2xl-letter-spacing:var(--sf-tracking-normal);--sf-text-2xl-max-width:none;--sf-text-3xl-line-height:calc(var(--sf-leading-tight) - 7 * var(--sf-leading-taper));--sf-text-3xl-font-weight:var(--sf-font-weight-heading);--sf-text-3xl-letter-spacing:var(--sf-tracking-tight);--sf-text-3xl-max-width:none;--sf-text-4xl-line-height:calc(var(--sf-leading-tight) - 8 * var(--sf-leading-taper));--sf-text-4xl-font-weight:var(--sf-font-weight-heading);--sf-text-4xl-letter-spacing:var(--sf-tracking-tight);--sf-text-4xl-max-width:none;--sf-icon-xs:.875em;--sf-icon-s:1em;--sf-icon-m:1.5em;--sf-icon-l:2em;--sf-icon-xl:3em;--sf-icon-2xl:4em;--sf-space-none:0;--sf-space-px:1px;--sf-space-2xs:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale));--sf-space-xs:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale));--sf-space-s:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale));--sf-space-m:calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale));--sf-space-l:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale));--sf-space-xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale));--sf-space-2xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale));--sf-space-3xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale));--sf-space-4xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale));--sf-size-xs:1.5rem;--sf-size-s:2rem;--sf-size-m:2.5rem;--sf-size-l:2.75rem;--sf-size-xl:3.5rem;--sf-container-narrow:38rem;--sf-container-prose:65ch;--sf-container-default:75rem;--sf-container-wide:90rem;--sf-container-full:100%;--sf-ratio-square:1;--sf-ratio-video:16 / 9;--sf-ratio-cinema:21 / 9;--sf-ratio-4-3:4 / 3;--sf-ratio-3-2:3 / 2;--sf-ratio-portrait:3 / 4;--sf-ratio-golden:1.618 / 1;--sf-border-scale:1;--sf-border-width-hairline:.5px;--sf-border-width-1:calc(1px * var(--sf-border-scale,1));--sf-border-width-2:calc(2px * var(--sf-border-scale,1));--sf-border-width-3:calc(3px * var(--sf-border-scale,1));--sf-border-width-4:calc(4px * var(--sf-border-scale,1));--sf-border-style:solid;--sf-border:var(--sf-border-width-1) var(--sf-border-style) var(--sf-color-border);--sf-border-subtle:var(--sf-border-width-1) var(--sf-border-style) var(--sf-color-border--subtle);--sf-border-strong:var(--sf-border-width-1) var(--sf-border-style) var(--sf-color-border--strong);--sf-divider-width:var(--sf-border-width-1);--sf-divider-style:solid;--sf-divider-color:var(--sf-color-border);--sf-divider-gap:var(--sf-space-m);--sf-radius-none:0;--sf-radius-2xs:calc(1px * var(--sf-radius-scale));--sf-radius-xs:calc(2px * var(--sf-radius-scale));--sf-radius-s:calc(4px * var(--sf-radius-scale));--sf-radius-m:calc(8px * var(--sf-radius-scale));--sf-radius-l:calc(12px * var(--sf-radius-scale));--sf-radius-xl:calc(16px * var(--sf-radius-scale));--sf-radius-2xl:calc(24px * var(--sf-radius-scale));--sf-radius-3xl:calc(32px * var(--sf-radius-scale));--sf-radius-4xl:calc(48px * var(--sf-radius-scale));--sf-radius-full:9999px;--sf-radius-pill:var(--sf-radius-full);--sf-radius-outer:calc(var(--sf-radius-m) + var(--sf-component-pad));--sf-media-radius:0;--sf-blur:12px;--sf-opacity-muted:.5;--sf-duration-none:0s;--sf-duration-instant:calc(.1s * var(--sf-motion-scale));--sf-duration-fast:calc(.15s * var(--sf-motion-scale));--sf-duration-normal:calc(.25s * var(--sf-motion-scale));--sf-duration-slow:calc(.4s * var(--sf-motion-scale));--sf-duration-slower:calc(.6s * var(--sf-motion-scale));--sf-theme-transition-duration:calc(.3s * var(--sf-motion-scale));--sf-ease-linear:linear;--sf-ease-out:cubic-bezier(.25, 0, .15, 1);--sf-ease-in:cubic-bezier(.5, 0, .75, .25);--sf-ease-in-out:cubic-bezier(.4, 0, .2, 1);--sf-ease-spring:linear(0, .5, 1.1, .95, 1.02, 1);--sf-ease-elastic:linear(0, .3, 1.2, .9, 1.05, 1);--sf-ease-bounce:linear(0, .35 18%, 1 32%, .86 42%, 1.02 56%, .98 72%, 1);--sf-ease-overshoot:linear(0, .6 30%, 1.08 55%, .98 75%, 1);--sf-animation-fade-in:sf-fade-in var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-fade-out:sf-fade-out var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-in-up:sf-slide-in-up var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-slide-in-down:sf-slide-in-down var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-slide-in-left:sf-slide-in-left var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-slide-in-right:sf-slide-in-right var(--sf-duration-normal) var(--sf-ease-out) both;--sf-animation-scale-up:sf-scale-up var(--sf-duration-normal) var(--sf-ease-overshoot) both;--sf-animation-scale-down:sf-scale-down var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-out-up:sf-slide-out-up var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-out-down:sf-slide-out-down var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-out-left:sf-slide-out-left var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-slide-out-right:sf-slide-out-right var(--sf-duration-normal) var(--sf-ease-in) both;--sf-animation-color-pulse:sf-color-pulse var(--sf-duration-slow) var(--sf-ease-in-out) infinite;--sf-animation-ping:sf-ping var(--sf-duration-slow) var(--sf-ease-out) infinite;--sf-animation-blink:sf-blink calc(1s * var(--sf-motion-scale)) steps(1, end) infinite;--sf-animation-float:sf-float calc(3s * var(--sf-motion-scale)) var(--sf-ease-in-out) infinite;--sf-animation-spin:sf-spin var(--sf-duration-slower) linear infinite;--sf-animation-shimmer:sf-shimmer calc(1.5s * var(--sf-motion-scale)) var(--sf-ease-in-out) infinite;--sf-animation-delay-1:calc(75ms * var(--sf-motion-scale));--sf-animation-delay-2:calc(.15s * var(--sf-motion-scale));--sf-animation-delay-3:calc(.225s * var(--sf-motion-scale));--sf-animation-delay-4:calc(.3s * var(--sf-motion-scale));--sf-animation-delay-5:calc(.375s * var(--sf-motion-scale));--sf-scroll-timeline-range-start:entry 0%;--sf-scroll-timeline-range-end:cover 30%;--sf-scroll-timeline-range-exit-start:cover 70%;--sf-scroll-timeline-range-exit-end:exit 100%;--sf-mask-scrim-start:var(--sf-space-l);--sf-mask-scrim-end:var(--sf-space-l);--sf-z-below:-1;--sf-z-base:0;--sf-z-raised:1;--sf-z-sticky:1000;--sf-z-fixed:1010;--sf-z-dropdown:1020;--sf-z-overlay:1030;--sf-z-modal:1040;--sf-z-toast:1050;--sf-z-tooltip:1060;--sf-header-height-mobile:3.5rem;--sf-header-height-desktop:5rem;--sf-header-height:clamp(var(--sf-header-height-mobile), calc((var(--sf-header-height-desktop) - var(--sf-header-height-mobile)) / ((var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * 1rem) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-header-height-mobile)), var(--sf-header-height-desktop));--sf-sticky-offset-mobile:var(--sf-header-height-mobile);--sf-sticky-offset-desktop:var(--sf-header-height-desktop);--sf-sticky-offset:clamp(var(--sf-sticky-offset-mobile), calc((var(--sf-sticky-offset-desktop) - var(--sf-sticky-offset-mobile)) / ((var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * 1rem) * (100vw - var(--sf-fluid-min-vw) * 1rem) + var(--sf-sticky-offset-mobile)), var(--sf-sticky-offset-desktop));--sf-focus-ring-width:2px;--sf-focus-ring-offset:2px;--sf-focus-ring-style:solid;--sf-touch-target:var(--sf-size-l);--sf-contrast-bias:0;--sf-contrast-threshold:.6;--sf-safe-top:env(safe-area-inset-top,0px);--sf-safe-bottom:env(safe-area-inset-bottom,0px);--sf-safe-left:env(safe-area-inset-left,0px);--sf-safe-right:env(safe-area-inset-right,0px);--sf-print-page-margin:2cm;--sf-print-page-size:a4;--sf-print-base-size:11pt;--sf-object-fit:cover;--sf-object-position:50% 50%}@supports (color:oklch(from red l c h)){:root{--sf-shadow-color:oklch(from var(--sf-color-neutral) var(--sf-shadow-lightness) c h);--sf-shadow-none:none;--sf-shadow-xs:0 1px 2px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7));--sf-shadow-s:0 1px 2px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7)), 0 2px 6px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, var(--sf-shadow-strength), .7));--sf-shadow-m:0 1px 3px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7)), 0 4px 12px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7));--sf-shadow-l:0 2px 4px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7)), 0 8px 24px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), .7)), 0 16px 48px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7));--sf-shadow-xl:0 2px 8px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .5), .7)), 0 12px 36px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3.5), .7)), 0 24px 72px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), .7));--sf-shadow-2xl:0 4px 12px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * .6), .7)), 0 20px 60px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 4), .7)), 0 40px 100px -8px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 5), .7));--sf-shadow-inner:inset 0 2px 4px 0 oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7));--sf-text-shadow-none:none;--sf-text-shadow-xs:0 .5px 1px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1), .7));--sf-text-shadow-s:0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), .7));--sf-text-shadow-m:0 2px 4px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7));--sf-text-shadow-l:0 4px 8px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), .7));--sf-text-shadow-xl:0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), .7));--sf-drop-shadow-xs:drop-shadow(0 .5px 1px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1), .7)));--sf-drop-shadow-s:drop-shadow(0 1px 2px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 1.5), .7)));--sf-drop-shadow-m:drop-shadow(0 4px 6px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2), .7)));--sf-drop-shadow-l:drop-shadow(0 8px 16px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 2.5), .7)));--sf-drop-shadow-xl:drop-shadow(0 16px 32px oklch(from var(--sf-shadow-color) l c h / clamp(0, calc(var(--sf-shadow-strength) * 3), .7)))}}:root{--sf-body-font-size:var(--sf-text-m);--sf-body-line-height:var(--sf-leading-normal);--sf-body-font-weight:var(--sf-font-weight-body);--sf-body-font-family:var(--sf-font-body);--sf-body-color:var(--sf-color-text);--sf-body-text-wrap:pretty;--sf-body-strong-weight:var(--sf-font-weight-strong);--sf-body-em-style:italic;--sf-code-font-size:.875em;--sf-heading-font-family:var(--sf-font-heading);--sf-heading-color:var(--sf-color-heading);--sf-heading-text-wrap:balance;--sf-h1-size:var(--sf-text-4xl);--sf-h1-line-height:var(--sf-leading-tight);--sf-h1-font-weight:var(--sf-font-weight-heading);--sf-h1-letter-spacing:var(--sf-tracking-tight);--sf-h2-size:var(--sf-text-3xl);--sf-h2-line-height:var(--sf-leading-tight);--sf-h2-font-weight:var(--sf-font-weight-heading);--sf-h2-letter-spacing:var(--sf-tracking-tight);--sf-h3-size:var(--sf-text-2xl);--sf-h3-line-height:var(--sf-leading-snug);--sf-h3-font-weight:var(--sf-font-weight-heading);--sf-h3-letter-spacing:var(--sf-tracking-normal);--sf-h4-size:var(--sf-text-xl);--sf-h4-line-height:var(--sf-leading-snug);--sf-h4-font-weight:var(--sf-font-weight-heading);--sf-h4-letter-spacing:var(--sf-tracking-normal);--sf-h5-size:var(--sf-text-l);--sf-h5-line-height:var(--sf-leading-normal);--sf-h5-font-weight:var(--sf-font-weight-heading);--sf-h5-letter-spacing:var(--sf-tracking-normal);--sf-h6-size:var(--sf-text-m);--sf-h6-line-height:var(--sf-leading-normal);--sf-h6-font-weight:var(--sf-font-weight-heading);--sf-h6-letter-spacing:var(--sf-tracking-wide);--sf-h1-max-width:none;--sf-h2-max-width:none;--sf-h3-max-width:none;--sf-h4-max-width:none;--sf-h5-max-width:none;--sf-h6-max-width:none;--sf-gap:var(--sf-space-m);--sf-content-gap:var(--sf-space-s);--sf-gutter:var(--sf-space-l);--sf-component-pad:var(--sf-space-m);--sf-field-block:var(--sf-space-l);--sf-field-required-marker:" *";--sf-link-external-marker:" ↗";--sf-link-external-label:"opens in a new window or external site";--sf-section-pad:var(--sf-section-pad--m);--sf-section-pad--xs:calc(var(--sf-space-xl) * var(--sf-section-scale));--sf-section-pad--s:calc(var(--sf-space-2xl) * var(--sf-section-scale));--sf-section-pad--m:calc(var(--sf-space-3xl) * var(--sf-section-scale));--sf-section-pad--l:calc(var(--sf-space-4xl) * var(--sf-section-scale));--sf-section-pad--xl:calc(var(--sf-space-4xl) * 1.5 * var(--sf-section-scale));--sf-section-pad--2xl:calc(var(--sf-space-4xl) * 2 * var(--sf-section-scale));--sf-transition-colors:color var(--sf-duration-normal) var(--sf-ease-out), background-color var(--sf-duration-normal) var(--sf-ease-out), border-color var(--sf-duration-normal) var(--sf-ease-out), text-decoration-color var(--sf-duration-normal) var(--sf-ease-out), fill var(--sf-duration-normal) var(--sf-ease-out), stroke var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-form-field:color var(--sf-duration-normal) var(--sf-ease-out), background-color var(--sf-duration-normal) var(--sf-ease-out), text-decoration-color var(--sf-duration-normal) var(--sf-ease-out), fill var(--sf-duration-normal) var(--sf-ease-out), stroke var(--sf-duration-normal) var(--sf-ease-out), border-color var(--sf-duration-fast) var(--sf-ease-out), box-shadow var(--sf-duration-fast) var(--sf-ease-out), opacity var(--sf-duration-fast) var(--sf-ease-out);--sf-transition-transform:transform var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-opacity:opacity var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-shadow:box-shadow var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-fast:color var(--sf-duration-fast) var(--sf-ease-out), background-color var(--sf-duration-fast) var(--sf-ease-out), border-color var(--sf-duration-fast) var(--sf-ease-out), box-shadow var(--sf-duration-fast) var(--sf-ease-out), opacity var(--sf-duration-fast) var(--sf-ease-out), transform var(--sf-duration-fast) var(--sf-ease-out), filter var(--sf-duration-fast) var(--sf-ease-out);--sf-transition-slow:color var(--sf-duration-slow) var(--sf-ease-in-out), background-color var(--sf-duration-slow) var(--sf-ease-in-out), border-color var(--sf-duration-slow) var(--sf-ease-in-out), box-shadow var(--sf-duration-slow) var(--sf-ease-in-out), opacity var(--sf-duration-slow) var(--sf-ease-in-out), transform var(--sf-duration-slow) var(--sf-ease-in-out), filter var(--sf-duration-slow) var(--sf-ease-in-out);--sf-transition-enter:color var(--sf-duration-normal) var(--sf-ease-out), background-color var(--sf-duration-normal) var(--sf-ease-out), border-color var(--sf-duration-normal) var(--sf-ease-out), box-shadow var(--sf-duration-normal) var(--sf-ease-out), opacity var(--sf-duration-normal) var(--sf-ease-out), transform var(--sf-duration-normal) var(--sf-ease-out), filter var(--sf-duration-normal) var(--sf-ease-out);--sf-transition-exit:color var(--sf-duration-fast) var(--sf-ease-in), background-color var(--sf-duration-fast) var(--sf-ease-in), border-color var(--sf-duration-fast) var(--sf-ease-in), box-shadow var(--sf-duration-fast) var(--sf-ease-in), opacity var(--sf-duration-fast) var(--sf-ease-in), transform var(--sf-duration-fast) var(--sf-ease-in), filter var(--sf-duration-fast) var(--sf-ease-in);--sf-transition-overlay:overlay var(--sf-duration-normal) allow-discrete, display var(--sf-duration-normal) allow-discrete;--sf-stack-gap:var(--sf-content-gap);--sf-box-padding:var(--sf-space-m);--sf-box-border-width:0;--sf-box-border-color:var(--sf-color-border);--sf-center-max:var(--sf-container-default);--sf-center-gutter:var(--sf-gutter);--sf-cluster-gap:var(--sf-gap);--sf-cluster-align:center;--sf-cluster-justify:flex-start;--sf-sidebar-gap:var(--sf-gap);--sf-sidebar-min-width:50%;--sf-sidebar-width:18rem;--sf-switcher-threshold:30rem;--sf-switcher-gap:var(--sf-gap);--sf-grid-min:16rem;--sf-grid-gap:var(--sf-gap);--sf-grid-min-xs:10rem;--sf-grid-min-s:13rem;--sf-grid-min-m:16rem;--sf-grid-min-l:20rem;--sf-grid-min-xl:24rem;--sf-grid-min-2xl:28rem;--sf-equal-min-col:16rem;--sf-equal-gap:var(--sf-gap);--sf-equal-rule-width:0;--sf-equal-rule-style:solid;--sf-equal-rule-color:var(--sf-color-border);--sf-cover-min-height:100dvh;--sf-cover-padding:var(--sf-section-pad);--sf-frame-ratio:16 / 9;--sf-bg-layer-inset:0px;--sf-bg-layer-fit:cover;--sf-bg-layer-position:50% 50%;--sf-bg-layer-radius:0;--sf-bg-layer-z:-2;--sf-icon-box-pad:.5em;--sf-icon-box-radius:var(--sf-radius-s);--sf-icon-box-bg:var(--sf-color-inset);--sf-icon-box-border:var(--sf-border-width-1) solid var(--sf-color-border);--sf-reel-item-width:max-content;--sf-reel-gap:var(--sf-gap);--sf-reel-height:auto;--sf-imposter-margin:var(--sf-space-m);--sf-bento-cols-default:4;--sf-bento-row-default:10rem;--sf-bento-row-compact:6rem;--sf-bento-row-tall:16rem;--sf-bento-gap:var(--sf-gap);--sf-breakout-width:var(--sf-container-wide);--sf-content-width:var(--sf-container-default);--sf-prose-paragraph:var(--sf-content-gap);--sf-alternate-gap:var(--sf-content-gap);--sf-alternate-inner-gap:var(--sf-gap);--sf-flow-space:var(--sf-content-gap);--sf-line-clamp:3;--sf-aspect:16 / 9;--sf-prose-heading-gap:var(--sf-space-s);--sf-prose-list-gap:var(--sf-space-xs);--sf-prose-block-margin:var(--sf-space-m);--sf-prose-media-margin:var(--sf-space-m);--sf-prose-media-radius:var(--sf-radius-m);--sf-prose-figure-margin:var(--sf-space-l);--sf-prose-marker-color:var(--sf-color-primary);--sf-prose-figcaption-size:var(--sf-text-s);--sf-prose-blockquote-padding:var(--sf-space-m);--sf-prose-blockquote-border:var(--sf-border-width-2) solid var(--sf-color-border--subtle);--sf-prose-hr-margin:var(--sf-space-l);--sf-prose-nested-list-gap:var(--sf-space-2xs);--sf-prose-table-pad:var(--sf-space-xs);--sf-surface-color:var(--sf-color-base);--sf-scroll-shadow-size:2rem;--sf-content-intrinsic-size:500px;--sf-scrim-color:#0000008c;--sf-scrim-direction:to top;--sf-scrim-gradient:linear-gradient(var(--sf-scrim-direction), var(--sf-scrim-color), transparent);--sf-scrim-text-shadow:0 1px 3px #0009;--sf-surface-bg-color:transparent;--sf-surface-bg-image:none;--sf-surface-bg-overlay:none;--sf-surface-bg-size:cover;--sf-surface-bg-position:center;--sf-surface-bg-repeat:no-repeat;--sf-surface-bg-attachment:scroll;--sf-surface-bg-animation:none;--sf-corner-scoop-size:var(--sf-radius-2xl);--sf-corner-scoop-at:100% 0;--sf-overlap-pull:var(--sf-space-xl)}@supports (color:lab(0% 0 0)){:root{--sf-scrim-color:lab(0% 0 0/.55);--sf-scrim-text-shadow:0 1px 3px lab(0% 0 0/.6)}}:root{--sf-card-padding:var(--sf-space-l);--sf-card-gap:var(--sf-space-m);--sf-card-radius:var(--sf-radius-m);--sf-card-radius-outer:calc(var(--sf-card-radius) + var(--sf-card-padding));--sf-card-bg:var(--sf-color-surface);--sf-card-border-width:var(--sf-border-width-1);--sf-card-border-color:var(--sf-color-border);--sf-card-shadow:var(--sf-shadow-s);--sf-card-shadow--elevated:var(--sf-shadow-l);--sf-card-shadow--hover:var(--sf-shadow-l);--sf-card-media-ratio:var(--sf-ratio-video);--sf-card-media-radius:var(--sf-card-radius,var(--sf-radius-m));--sf-card-heading-size:var(--sf-text-xl);--sf-card-btn-font-size:var(--sf-text-s);--sf-field-radius:var(--sf-radius-m);--sf-field-padding-block:var(--sf-space-xs);--sf-field-padding-inline:var(--sf-space-s);--sf-btn-radius:var(--sf-radius-m);--sf-btn-padding-block:var(--sf-space-xs);--sf-btn-padding-inline:var(--sf-space-m);--sf-btn-gap:var(--sf-space-2xs);--sf-btn-font-size:var(--sf-text-m);--sf-btn-font-weight:var(--sf-font-weight-interactive);--sf-btn-min-height:var(--sf-touch-target);--sf-btn-border-width:var(--sf-border-width-1)}}@layer slashed.reset,slashed.base,slashed.forms;@layer slashed.layout{.sf-section{padding-block:var(--sf-section-pad)}.sf-section--xs{--sf-section-pad:var(--sf-section-pad--xs)}.sf-section--s{--sf-section-pad:var(--sf-section-pad--s)}.sf-section--m{--sf-section-pad:var(--sf-section-pad--m)}.sf-section--l{--sf-section-pad:var(--sf-section-pad--l)}.sf-section--xl{--sf-section-pad:var(--sf-section-pad--xl)}.sf-section--2xl{--sf-section-pad:var(--sf-section-pad--2xl)}.sf-section--guttered{padding-inline:var(--sf-gutter)}.sf-section--guttered .sf-container{padding-inline:0}.sf-section-group>.sf-section+.sf-section{padding-block-start:0}.sf-header--xs{padding-block:var(--sf-space-xs)}.sf-header--s{padding-block:var(--sf-space-s)}.sf-header--m{padding-block:var(--sf-space-m)}.sf-header--l{padding-block:var(--sf-space-l)}.sf-header--xl{padding-block:var(--sf-space-xl)}.sf-section--collapse:has(+.sf-section--collapse){padding-block-end:calc(var(--sf-section-pad) / 2)}.sf-section--collapse+.sf-section--collapse{padding-block-start:calc(var(--sf-section-pad) / 2)}.sf-divider{border:none;border-block-start:var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color);margin-block:var(--sf-divider-gap)}.sf-divider--vertical{border-block-start:none;border-inline-start:var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color);margin-block:0;margin-inline:var(--sf-divider-gap);align-self:stretch}.sf-divider--soft{--sf-divider-color:var(--sf-color-border--subtle)}.sf-divider--strong{--sf-divider-color:var(--sf-color-border--strong)}.sf-divider--dashed{--sf-divider-style:dashed}.sf-divider--dotted{--sf-divider-style:dotted}.sf-divider--gradient{block-size:var(--sf-divider-width);background:linear-gradient(to right, transparent, var(--sf-divider-color), transparent);border:none}.sf-divide>*+*{border-block-start:var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color)}.sf-divide--vertical>*+*{border-block-start:none;border-inline-start:var(--sf-divider-width) var(--sf-divider-style) var(--sf-divider-color)}.sf-container{width:100%;max-width:var(--sf-container-default);padding-inline:var(--sf-gutter);margin-inline:auto;container:sf-layout/inline-size}.sf-container--narrow{max-width:var(--sf-container-narrow)}.sf-container--prose{max-width:var(--sf-container-prose)}.sf-container--wide{max-width:var(--sf-container-wide)}.sf-container--full{max-width:var(--sf-container-full)}.sf-cq{container-type:inline-size}.sf-overlay{position:absolute;inset:0}.sf-fluid-cq{container-type:inline-size}.sf-fluid-cq>*{--sf-fluid-width:100cqi;--sf-text-2xs:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -3) * 1rem)) * var(--sf-text-scale));--sf-text-xs:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -2) * 1rem)) * var(--sf-text-scale));--sf-text-s:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), -1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), -1) * 1rem)) * var(--sf-text-scale));--sf-text-m:calc(clamp(calc(var(--sf-text-base-min) * 1rem), calc((var(--sf-text-base-max) - var(--sf-text-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * 1rem), calc(var(--sf-text-base-max) * 1rem)) * var(--sf-text-scale));--sf-text-l:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-scale));--sf-text-xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-scale));--sf-text-2xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 3) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 3) * 1rem)) * var(--sf-text-scale));--sf-text-3xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 4) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 4) * 1rem)) * var(--sf-text-scale));--sf-text-4xl:calc(clamp(calc(var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc((var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) - var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-base-min) * pow(var(--sf-text-ratio-min), 5) * 1rem), calc(var(--sf-text-base-max) * pow(var(--sf-text-ratio-max), 5) * 1rem)) * var(--sf-text-scale));--sf-text-display-s:calc(clamp(calc(var(--sf-text-display-base-min) * 1rem), calc((var(--sf-text-display-base-max) - var(--sf-text-display-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * 1rem), calc(var(--sf-text-display-base-max) * 1rem)) * var(--sf-text-display-scale));--sf-text-display-m:calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 1) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 1) * 1rem)) * var(--sf-text-display-scale));--sf-text-display-l:calc(clamp(calc(var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc((var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) - var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-text-display-base-min) * pow(var(--sf-text-ratio-min), 2) * 1rem), calc(var(--sf-text-display-base-max) * pow(var(--sf-text-ratio-max), 2) * 1rem)) * var(--sf-text-display-scale));--sf-space-2xs:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -3) * 1rem)) * var(--sf-space-scale));--sf-space-xs:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -2) * 1rem)) * var(--sf-space-scale));--sf-space-s:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), -1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), -1) * 1rem)) * var(--sf-space-scale));--sf-space-m:calc(clamp(calc(var(--sf-space-base-min) * 1rem), calc((var(--sf-space-base-max) - var(--sf-space-base-min)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * 1rem), calc(var(--sf-space-base-max) * 1rem)) * var(--sf-space-scale));--sf-space-l:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 1) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 1) * 1rem)) * var(--sf-space-scale));--sf-space-xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 2) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 2) * 1rem)) * var(--sf-space-scale));--sf-space-2xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 3) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 3) * 1rem)) * var(--sf-space-scale));--sf-space-3xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 4) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 4) * 1rem)) * var(--sf-space-scale));--sf-space-4xl:calc(clamp(calc(var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc((var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) - var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5)) / (var(--sf-fluid-max-vw) - var(--sf-fluid-min-vw)) * (var(--sf-fluid-width) - var(--sf-fluid-min-vw) * 1rem) + var(--sf-space-base-min) * pow(var(--sf-space-ratio-min), 5) * 1rem), calc(var(--sf-space-base-max) * pow(var(--sf-space-ratio-max), 5) * 1rem)) * var(--sf-space-scale))}.sf-stack{gap:var(--sf-stack-gap);flex-direction:column;display:flex}.sf-stack--xs{gap:var(--sf-space-xs)}.sf-stack--s{gap:var(--sf-space-s)}.sf-stack--m{gap:var(--sf-space-m)}.sf-stack--l{gap:var(--sf-space-l)}.sf-stack--xl{gap:var(--sf-space-xl)}.sf-stack--2xl{gap:var(--sf-space-2xl)}.sf-stack--center{align-items:center}.sf-stack--end{align-items:flex-end}.sf-stack--stretch{align-items:stretch}.sf-gap{gap:var(--sf-gap)}.sf-gap--xs{gap:var(--sf-space-xs)}.sf-gap--s{gap:var(--sf-space-s)}.sf-gap--m{gap:var(--sf-space-m)}.sf-gap--l{gap:var(--sf-space-l)}.sf-gap--xl{gap:var(--sf-space-xl)}.sf-gap--2xl{gap:var(--sf-space-2xl)}.sf-box{padding:var(--sf-box-padding);outline:var(--sf-box-border-width) solid var(--sf-box-border-color)}.sf-center{box-sizing:content-box;width:auto;max-inline-size:var(--sf-center-max);padding-inline:var(--sf-center-gutter);margin-inline:auto}.sf-center--intrinsic{flex-direction:column;align-items:center;display:flex}.sf-cluster{gap:var(--sf-cluster-gap);align-items:var(--sf-cluster-align);justify-content:var(--sf-cluster-justify);flex-wrap:wrap;display:flex}.sf-cluster--xs{gap:var(--sf-space-xs)}.sf-cluster--s{gap:var(--sf-space-s)}.sf-cluster--m{gap:var(--sf-space-m)}.sf-cluster--l{gap:var(--sf-space-l)}.sf-cluster--xl{gap:var(--sf-space-xl)}.sf-cluster--2xl{gap:var(--sf-space-2xl)}.sf-cluster--no-wrap{flex-wrap:nowrap}.sf-cluster--center{justify-content:center}.sf-cluster--end{justify-content:flex-end}.sf-cluster--between{justify-content:space-between}.sf-sidebar{gap:var(--sf-sidebar-gap);flex-wrap:wrap;display:flex}.sf-sidebar>:first-child{flex-basis:var(--sf-sidebar-width);flex-grow:1}.sf-sidebar>:last-child,.sf-sidebar--right>:first-child{min-inline-size:var(--sf-sidebar-min-width);flex-grow:999;flex-basis:0}.sf-sidebar--right>:last-child{flex-basis:var(--sf-sidebar-width);flex-grow:1}.sf-sidebar--narrow{--sf-sidebar-width:12rem}.sf-sidebar--wide{--sf-sidebar-width:26rem}.sf-switcher{gap:var(--sf-switcher-gap);flex-wrap:wrap;display:flex}.sf-switcher>*{flex-grow:1;flex-basis:calc((var(--sf-switcher-threshold) - 100%) * 999)}.sf-switcher--no-wrap{overflow-inline:auto;flex-wrap:nowrap;overflow-x:auto}.sf-switcher--vertical{flex-direction:column}.sf-grid{grid-template-columns:repeat(auto-fill, minmax(min(var(--sf-grid-min), 100%), 1fr));gap:var(--sf-grid-gap);display:grid}.sf-grid--fit{grid-template-columns:repeat(auto-fit, minmax(min(var(--sf-grid-min), 100%), 1fr))}.sf-grid--xs{--sf-grid-min:var(--sf-grid-min-xs)}.sf-grid--s{--sf-grid-min:var(--sf-grid-min-s)}.sf-grid--m{--sf-grid-min:var(--sf-grid-min-m)}.sf-grid--l{--sf-grid-min:var(--sf-grid-min-l)}.sf-grid--xl{--sf-grid-min:var(--sf-grid-min-xl)}.sf-grid--2xl{--sf-grid-min:var(--sf-grid-min-2xl)}.sf-grid--dense{grid-auto-flow:dense}.sf-grid-flex{gap:var(--sf-grid-gap);flex-wrap:wrap;display:flex}.sf-grid-flex>*{flex:1 1 min(var(--sf-grid-min), 100%)}.sf-grid-flex--center{justify-content:center}.sf-grid-flex--center>*{flex-grow:0;flex-basis:min(var(--sf-grid-min), 100%)}.sf-grid-flex--xs{--sf-grid-min:var(--sf-grid-min-xs)}.sf-grid-flex--s{--sf-grid-min:var(--sf-grid-min-s)}.sf-grid-flex--m{--sf-grid-min:var(--sf-grid-min-m)}.sf-grid-flex--l{--sf-grid-min:var(--sf-grid-min-l)}.sf-grid-flex--xl{--sf-grid-min:var(--sf-grid-min-xl)}.sf-grid-flex--2xl{--sf-grid-min:var(--sf-grid-min-2xl)}.sf-icon{inline-size:var(--sf-icon-size,var(--sf-icon-m));block-size:var(--sf-icon-size,var(--sf-icon-m));vertical-align:text-bottom;fill:currentColor;flex-shrink:0;display:inline-block}.sf-icon--xs{--sf-icon-size:var(--sf-icon-xs)}.sf-icon--s{--sf-icon-size:var(--sf-icon-s)}.sf-icon--m{--sf-icon-size:var(--sf-icon-m)}.sf-icon--l{--sf-icon-size:var(--sf-icon-l)}.sf-icon--xl{--sf-icon-size:var(--sf-icon-xl)}.sf-icon--2xl{--sf-icon-size:var(--sf-icon-2xl)}.sf-icon--boxed{inline-size:calc(var(--sf-icon-size,var(--sf-icon-m)) + var(--sf-icon-box-pad) * 2);block-size:calc(var(--sf-icon-size,var(--sf-icon-m)) + var(--sf-icon-box-pad) * 2);padding:var(--sf-icon-box-pad);border:var(--sf-icon-box-border);border-radius:var(--sf-icon-box-radius);background:var(--sf-icon-box-bg);box-sizing:border-box}.sf-cover{min-height:var(--sf-cover-min-height);padding-block:var(--sf-cover-padding);flex-direction:column;display:flex}.sf-cover>.sf-cover__center{margin-block:auto}.sf-cover--min{min-height:50dvh}.sf-cover--max{min-height:0;max-block-size:100dvh}.sf-cover--padding-s{padding-block:var(--sf-space-xl)}.sf-cover--padding-l{padding-block:var(--sf-space-4xl)}.sf-frame{aspect-ratio:var(--sf-frame-ratio);justify-content:center;align-items:center;display:flex;overflow:hidden}.sf-frame>img,.sf-frame>video{object-fit:cover;block-size:100%;inline-size:100%}.sf-frame--square{aspect-ratio:var(--sf-ratio-square)}.sf-frame--video{aspect-ratio:var(--sf-ratio-video)}.sf-frame--cinema{aspect-ratio:var(--sf-ratio-cinema)}.sf-frame--portrait{aspect-ratio:var(--sf-ratio-portrait)}.sf-frame--4-3{aspect-ratio:var(--sf-ratio-4-3)}.sf-frame--3-2{aspect-ratio:var(--sf-ratio-3-2)}.sf-frame--golden{aspect-ratio:var(--sf-ratio-golden)}:where(:has(>.sf-bg-layer)){isolation:isolate;position:relative}.sf-bg-layer{inset:var(--sf-bg-layer-inset);inline-size:calc(100% - 2 * var(--sf-bg-layer-inset));block-size:calc(100% - 2 * var(--sf-bg-layer-inset));object-fit:var(--sf-bg-layer-fit);object-position:var(--sf-bg-layer-position);border-radius:var(--sf-bg-layer-radius);z-index:var(--sf-bg-layer-z);pointer-events:none;position:absolute}.sf-bg-layer>:is(img,video,picture),.sf-bg-layer>picture>img{object-fit:var(--sf-bg-layer-fit);object-position:var(--sf-bg-layer-position);border-radius:var(--sf-bg-layer-radius);pointer-events:none;block-size:100%;inline-size:100%}.sf-reel{block-size:var(--sf-reel-height);gap:var(--sf-reel-gap);overflow-inline:auto;scroll-snap-type:inline mandatory;scroll-padding-inline:var(--sf-reel-gap);overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:var(--sf-scrollbar-thumb) var(--sf-scrollbar-track);display:flex;overflow-x:auto}.sf-reel::-webkit-scrollbar{block-size:6px}.sf-reel::-webkit-scrollbar-track{background:var(--sf-scrollbar-track);border-radius:var(--sf-radius-full)}.sf-reel::-webkit-scrollbar-thumb{background:var(--sf-scrollbar-thumb);border-radius:var(--sf-radius-full)}.sf-reel>*{flex:0 0 var(--sf-reel-item-width);scroll-snap-align:start}.sf-imposter{inset-block-start:50%;position:absolute;left:50%;translate:-50% -50%}.sf-imposter--fixed{position:fixed}.sf-imposter--contain{max-inline-size:calc(100% - var(--sf-imposter-margin) * 2);max-block-size:calc(100% - var(--sf-imposter-margin) * 2);overflow:auto}.sf-alternate{gap:var(--sf-alternate-gap);display:grid;container:sf-alternate/inline-size}.sf-alternate>*{gap:var(--sf-alternate-inner-gap);align-items:center;display:grid}@container sf-alternate (width>=48em){.sf-alternate>*{grid-template-columns:1fr 1fr}.sf-alternate>:nth-child(2n)>:first-child{order:2}.sf-alternate>:nth-child(2n)>:last-child{order:1}}.sf-pancake{grid-template-rows:auto 1fr auto;min-height:100dvh;display:grid}.sf-grid-cols-1{gap:var(--sf-grid-gap);display:grid}.sf-grid-cols-2,.sf-grid-cols-3,.sf-grid-cols-4,.sf-grid-cols-6{gap:var(--sf-grid-gap);display:grid;container:sf-grid/inline-size}@container (width>=30em){.sf-grid-cols-4{grid-template-columns:repeat(2,1fr)}.sf-grid-cols-6{grid-template-columns:repeat(3,1fr)}}@container (width>=48em){.sf-grid-cols-2{grid-template-columns:repeat(2,1fr)}.sf-grid-cols-3{grid-template-columns:repeat(3,1fr)}.sf-grid-cols-4{grid-template-columns:repeat(4,1fr)}.sf-grid-cols-6{grid-template-columns:repeat(6,1fr)}}.sf-grid-cols-1-2,.sf-grid-cols-2-1,.sf-grid-cols-1-3,.sf-grid-cols-3-1{gap:var(--sf-grid-gap);display:grid}@container (width>=48em){.sf-grid-cols-1-2{grid-template-columns:1fr 2fr}.sf-grid-cols-2-1{grid-template-columns:2fr 1fr}.sf-grid-cols-1-3{grid-template-columns:1fr 3fr}.sf-grid-cols-3-1{grid-template-columns:3fr 1fr}}.sf-equal{column-width:var(--sf-equal-min-col);column-gap:var(--sf-equal-gap);column-rule:var(--sf-equal-rule-width) var(--sf-equal-rule-style) var(--sf-equal-rule-color)}.sf-equal>*{break-inside:avoid}.sf-equal--2{column-count:2}.sf-equal--3{column-count:3}.sf-equal--4{column-count:4}.sf-equal--6{column-count:6}.sf-content-grid{grid-template-columns:[full-start] minmax(var(--sf-gutter), 1fr) [breakout-start] minmax(0, calc((var(--sf-breakout-width) - var(--sf-content-width)) / 2)) [content-start] min(var(--sf-content-width), 100% - var(--sf-gutter) * 2) [content-end] minmax(0, calc((var(--sf-breakout-width) - var(--sf-content-width)) / 2)) [breakout-end] minmax(var(--sf-gutter), 1fr) [full-end];display:grid}.sf-content-grid>*{grid-column:content}.sf-content-grid>.sf-breakout{grid-column:breakout}.sf-content-grid>.sf-full-bleed{grid-column:full}.sf-bento{grid-template-columns:repeat(var(--sf-bento-cols,var(--sf-bento-cols-default)), 1fr);grid-auto-rows:minmax(var(--sf-bento-row,var(--sf-bento-row-default)), auto);grid-auto-flow:dense;gap:var(--sf-bento-gap);display:grid;container:sf-bento/inline-size}@container (width<=29.99em){.sf-bento{grid-template-columns:1fr}}@container (width>=30em) and (width<=47.99em){.sf-bento{grid-template-columns:repeat(2,1fr)}}.sf-bento--2{--sf-bento-cols:2}.sf-bento--3{--sf-bento-cols:3}.sf-bento--6{--sf-bento-cols:6}.sf-bento--compact{--sf-bento-row:var(--sf-bento-row-compact)}.sf-bento--tall{--sf-bento-row:var(--sf-bento-row-tall)}.sf-bento-wide{grid-column:span 2}.sf-bento-full{grid-column:1/-1}.sf-bento-tall{grid-row:span 2}.sf-bento-featured{grid-area:span 2/span 2}.sf-subgrid{grid-template-columns:subgrid;display:grid}.sf-subgrid-rows{grid-template-rows:subgrid;display:grid}}@layer slashed.components{.sf-btn{--sf-btn-color:var(--sf-color-action);--sf-btn-color--hover:var(--sf-color-action--hover);--sf-btn-on-color:var(--sf-color-text--on-action);justify-content:center;align-items:center;gap:var(--sf-btn-gap,var(--sf-space-2xs));padding-block:var(--sf-btn-padding-block);padding-inline:var(--sf-btn-padding-inline);min-block-size:var(--sf-btn-min-height,var(--sf-touch-target));font-family:inherit;font-size:var(--sf-btn-font-size,var(--sf-text-m));font-weight:var(--sf-btn-font-weight,var(--sf-font-weight-interactive));line-height:var(--sf-leading-tight);white-space:nowrap;border:var(--sf-btn-border-width,var(--sf-border-width-1)) solid var(--sf-btn-color);border-radius:var(--sf-btn-radius);cursor:pointer;-webkit-user-select:none;user-select:none;appearance:none;transition:var(--sf-transition-form-field);background:var(--sf-btn-color);color:var(--sf-btn-on-color);text-decoration:none;display:inline-flex}.sf-btn:hover:not(:disabled,.sf-is-disabled,.sf-is-loading){background:var(--sf-btn-color--hover);border-color:var(--sf-btn-color--hover)}.sf-btn--primary{--sf-btn-color:var(--sf-color-primary);--sf-btn-color--hover:var(--sf-color-primary--hover);--sf-btn-on-color:var(--sf-color-text--on-primary)}.sf-btn--neutral{--sf-btn-color:var(--sf-color-neutral);--sf-btn-color--hover:var(--sf-color-neutral--hover);--sf-btn-on-color:var(--sf-color-text--on-neutral)}.sf-btn--success{--sf-btn-color:var(--sf-color-success);--sf-btn-color--hover:var(--sf-color-success-strong);--sf-btn-on-color:var(--sf-color-text--on-success)}.sf-btn--warning{--sf-btn-color:var(--sf-color-warning);--sf-btn-color--hover:var(--sf-color-warning-strong);--sf-btn-on-color:var(--sf-color-text--on-warning)}.sf-btn--info{--sf-btn-color:var(--sf-color-info);--sf-btn-color--hover:var(--sf-color-info-strong);--sf-btn-on-color:var(--sf-color-text--on-info)}.sf-btn--danger{--sf-btn-color:var(--sf-color-danger);--sf-btn-color--hover:var(--sf-color-danger-strong);--sf-btn-on-color:var(--sf-color-text--on-danger)}.sf-btn--secondary{color:var(--sf-btn-color);border-color:var(--sf-btn-color);background:0 0}.sf-btn--secondary:hover:not(:disabled,.sf-is-disabled,.sf-is-loading){background:color-mix(in oklab, var(--sf-btn-color) 8%, transparent);border-color:var(--sf-btn-color)}.sf-btn--ghost{color:var(--sf-btn-color);background:0 0;border-color:#0000}.sf-btn--ghost:hover:not(:disabled,.sf-is-disabled,.sf-is-loading){background:color-mix(in oklab, var(--sf-btn-color) 8%, transparent)}.sf-btn--outline{color:var(--sf-btn-color);border-color:var(--sf-btn-color);background:0 0}.sf-btn--outline:hover:not(:disabled,.sf-is-disabled,.sf-is-loading){background:var(--sf-btn-color);color:var(--sf-btn-on-color);border-color:var(--sf-btn-color)}.sf-btn--xs{--sf-btn-padding-block:var(--sf-space-3xs,.125rem);--sf-btn-padding-inline:var(--sf-space-xs);--sf-btn-font-size:var(--sf-text-xs);--sf-btn-min-height:var(--sf-size-xs)}.sf-btn--s{--sf-btn-padding-block:var(--sf-space-2xs);--sf-btn-padding-inline:var(--sf-space-s);--sf-btn-font-size:var(--sf-text-s);--sf-btn-min-height:var(--sf-size-s)}.sf-btn--l{--sf-btn-padding-block:var(--sf-space-s);--sf-btn-padding-inline:var(--sf-space-l);--sf-btn-font-size:var(--sf-text-l);--sf-btn-min-height:var(--sf-size-xl)}.sf-btn--xl{--sf-btn-padding-block:var(--sf-space-m);--sf-btn-padding-inline:var(--sf-space-xl);--sf-btn-font-size:var(--sf-text-xl);--sf-btn-min-height:calc(var(--sf-size-xl) + var(--sf-space-s))}.sf-btn:disabled,.sf-btn.sf-is-disabled{opacity:var(--sf-opacity-disabled);cursor:not-allowed;pointer-events:none}.sf-btn.sf-is-loading{cursor:wait;position:relative}.sf-btn.sf-is-loading>*{visibility:hidden}.sf-btn.sf-is-loading:after{content:"";border:2px solid;border-radius:var(--sf-radius-full);border-block-start-color:#0000;block-size:1em;inline-size:1em;margin:auto;position:absolute;inset:0}@media (prefers-reduced-motion:no-preference){.sf-btn.sf-is-loading:after{animation:sf-spin var(--sf-duration-slower) linear infinite}}.sf-btn--block{inline-size:100%}@container (width<=20rem){.sf-btn--block-cq{inline-size:100%}}.sf-card{padding:var(--sf-card-padding,var(--sf-space-l));background:var(--sf-card-bg,var(--sf-color-surface));border:var(--sf-card-border-width,var(--sf-border-width-1)) solid var(--sf-card-border-color,var(--sf-color-border));border-radius:var(--sf-card-radius-outer,calc(var(--sf-radius-m) + var(--sf-space-l)));box-shadow:var(--sf-card-shadow,var(--sf-shadow-s));display:block}.sf-card__header,.sf-card__body,.sf-card__footer{display:block}.sf-card__header{border-block-end:var(--sf-border-subtle);margin-block-end:var(--sf-card-gap,var(--sf-space-m));padding-block-end:var(--sf-card-gap,var(--sf-space-m))}.sf-card__footer{border-block-start:var(--sf-border-subtle);margin-block-start:var(--sf-card-gap,var(--sf-space-m));padding-block-start:var(--sf-card-gap,var(--sf-space-m))}.sf-card__media{inline-size:100%;aspect-ratio:var(--sf-card-media-ratio,var(--sf-ratio-video));object-fit:cover;border-radius:var(--sf-card-media-radius);display:block;overflow:clip}.sf-card__avatar{inline-size:var(--sf-avatar-size,2.5rem);block-size:var(--sf-avatar-size,2.5rem);aspect-ratio:1;object-fit:cover;border-radius:var(--sf-radius-full);flex-shrink:0}.sf-card__title{font-size:var(--sf-card-heading-size,var(--sf-text-xl));color:var(--sf-color-heading)}.sf-card .sf-btn{--sf-btn-font-size:var(--sf-card-btn-font-size,var(--sf-text-s))}.sf-card--bordered{box-shadow:none}.sf-card--elevated{box-shadow:var(--sf-card-shadow--elevated,var(--sf-shadow-l));border-color:#0000}.sf-card--interactive{cursor:pointer;transition:var(--sf-transition-shadow)}.sf-card--interactive:hover,.sf-card--interactive:focus-within{box-shadow:var(--sf-card-shadow--hover,var(--sf-shadow-l))}@media (prefers-reduced-motion:no-preference){.sf-card--interactive{transition:var(--sf-transition-shadow), var(--sf-transition-transform)}.sf-card--interactive:hover,.sf-card--interactive:focus-within{transform:translateY(calc(-1 * var(--sf-space-2xs)))}}}@layer slashed.macros{.sf-prose{max-width:var(--sf-container-prose);overflow-wrap:break-word}.sf-prose>*+*{margin-block-start:var(--sf-prose-paragraph)}.sf-prose :is(h2,h3,h4,h5,h6)+*{margin-block-start:var(--sf-prose-heading-gap)}.sf-prose li+li{margin-block-start:var(--sf-prose-list-gap)}.sf-prose :is(blockquote,pre){margin-block:var(--sf-prose-block-margin)}.sf-prose blockquote{border-inline-start:var(--sf-prose-blockquote-border);padding-inline-start:var(--sf-prose-blockquote-padding);font-style:italic}.sf-prose img{margin-block:var(--sf-prose-media-margin);border-radius:var(--sf-prose-media-radius)}.sf-prose :is(ul,ol){padding-inline-start:1.25em}.sf-prose>:is(ul,ol){margin-block-end:0}.sf-prose :is(ul,ol) :is(ul,ol){margin-block-start:var(--sf-prose-nested-list-gap)}.sf-prose ul{list-style:outside}.sf-prose ol{list-style:decimal}.sf-prose ::marker{color:var(--sf-prose-marker-color)}.sf-prose hr{margin-block:var(--sf-prose-hr-margin)}.sf-prose figure{margin-block:var(--sf-prose-figure-margin)}.sf-prose figcaption{font-size:var(--sf-prose-figcaption-size);color:var(--sf-color-text--muted);margin-block-start:var(--sf-prose-list-gap)}.sf-prose table{margin-block:var(--sf-prose-block-margin);overflow-inline:auto;inline-size:100%;max-inline-size:100%;display:block;overflow-x:auto}.sf-prose :is(th,td){padding:var(--sf-prose-table-pad)}.sf-prose video{margin-block:var(--sf-prose-media-margin);border-radius:var(--sf-prose-media-radius)}.sf-prose .sf-not-prose>*+*,.sf-prose .sf-not-prose li+li{margin-block-start:0}.sf-prose .sf-not-prose :is(ul,ol){list-style:revert;padding-inline-start:revert}.sf-prose .sf-not-prose ::marker{color:inherit}.sf-prose .sf-not-prose blockquote{border-inline-start:0;margin-block:0;padding-inline-start:0;font-style:normal}.sf-prose .sf-not-prose hr{margin-block:0}.sf-prose .sf-not-prose img{border-radius:0;margin-block:0}.sf-prose .sf-not-prose figure{margin-block:0}.sf-prose .sf-not-prose figcaption{font-size:inherit;color:inherit;margin-block-start:0}.sf-prose .sf-not-prose table{display:revert;overflow-x:revert;overflow-inline:revert;inline-size:revert;max-inline-size:revert;margin-block:0}.sf-prose .sf-not-prose :is(th,td){padding:revert}.sf-prose .sf-not-prose video{border-radius:0;margin-block:0}.sf-flow>*+*{margin-block-start:var(--sf-flow-space)}.sf-truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.sf-line-clamp-2,.sf-line-clamp-3,.sf-line-clamp-N{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.sf-line-clamp-2{-webkit-line-clamp:2}.sf-line-clamp-3{-webkit-line-clamp:3}.sf-line-clamp-N{-webkit-line-clamp:var(--sf-line-clamp)}.sf-equal-height{align-items:stretch;display:flex}.sf-equal-height>*{flex:auto;block-size:auto}.sf-aspect{aspect-ratio:var(--sf-aspect,16 / 9)}.sf-scroll-shadow{overflow-block:auto;-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-scroll-shadow-size), black calc(100% - var(--sf-scroll-shadow-size)), transparent 100%);-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-scroll-shadow-size), black calc(100% - var(--sf-scroll-shadow-size)), transparent 100%);mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-scroll-shadow-size), black calc(100% - var(--sf-scroll-shadow-size)), transparent 100%);overflow-y:auto}.sf-scroll-snap{overflow-block:auto;scroll-snap-type:block mandatory;overscroll-behavior-block:contain;overflow-y:auto}.sf-scroll-snap>*{scroll-snap-align:start}.sf-overflow-fade,.sf-overflow-fade--right{-webkit-mask-image:linear-gradient(to right, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);-webkit-mask-image:linear-gradient(to right, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);mask-image:linear-gradient(to right, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);overflow:hidden}.sf-overflow-fade--left{-webkit-mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black 100%);-webkit-mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black 100%);mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black 100%);overflow:hidden}.sf-overflow-fade--top{-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black 100%);-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black 100%);mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black 100%);overflow:hidden}.sf-overflow-fade--bottom{-webkit-mask-image:linear-gradient(to bottom, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);-webkit-mask-image:linear-gradient(to bottom, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);mask-image:linear-gradient(to bottom, black 0, black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);overflow:hidden}.sf-overflow-fade--block{-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);-webkit-mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);mask-image:linear-gradient(to bottom, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);overflow:hidden}.sf-overflow-fade--inline{-webkit-mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);-webkit-mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);mask-image:linear-gradient(to right, transparent 0, black var(--sf-mask-scrim-start), black calc(100% - var(--sf-mask-scrim-end)), transparent 100%);overflow:hidden}.sf-no-tap-highlight{-webkit-tap-highlight-color:transparent}.sf-surface{background:var(--sf-surface-color)}.sf-surface--primary{--sf-surface-color:var(--sf-color-primary);background:var(--sf-color-primary);color:var(--sf-color-text--on-primary)}.sf-surface--secondary{--sf-surface-color:var(--sf-color-secondary);background:var(--sf-color-secondary);color:var(--sf-color-text--on-secondary)}.sf-surface--tertiary{--sf-surface-color:var(--sf-color-tertiary);background:var(--sf-color-tertiary);color:var(--sf-color-text--on-tertiary)}.sf-surface--action{--sf-surface-color:var(--sf-color-action);background:var(--sf-color-action);color:var(--sf-color-text--on-action)}.sf-surface--neutral{--sf-surface-color:var(--sf-color-neutral);background:var(--sf-color-neutral);color:var(--sf-color-text--on-neutral)}.sf-surface--inverse{--sf-surface-color:var(--sf-color-inverse);background:var(--sf-color-inverse);color:var(--sf-color-text--on-inverse)}.sf-surface--success{--sf-surface-color:var(--sf-color-success);background:var(--sf-color-success);color:var(--sf-color-text--on-success)}.sf-surface--warning{--sf-surface-color:var(--sf-color-warning);background:var(--sf-color-warning);color:var(--sf-color-text--on-warning)}.sf-surface--info{--sf-surface-color:var(--sf-color-info);background:var(--sf-color-info);color:var(--sf-color-text--on-info)}.sf-surface--danger{--sf-surface-color:var(--sf-color-danger);background:var(--sf-color-danger);color:var(--sf-color-text--on-danger)}@supports (color:oklch(from red l c h)) and (width:calc(1px * sign(1))){:is(.sf-surface,.sf-surface--primary,.sf-surface--secondary,.sf-surface--tertiary,.sf-surface--action,.sf-surface--neutral,.sf-surface--inverse,.sf-surface--success,.sf-surface--warning,.sf-surface--info,.sf-surface--danger){--sf-surface-contrast:oklch(from var(--sf-surface-color) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0 / 1);background:var(--sf-surface-color);color:var(--sf-surface-contrast);--sf-color-text:var(--sf-surface-contrast);--sf-color-heading:var(--sf-surface-contrast);--sf-color-link:oklch(from var(--sf-surface-contrast) l calc(c + .08) h);--sf-color-link--hover:var(--sf-surface-contrast);--sf-color-link--underline:oklch(from var(--sf-surface-contrast) l c h / .5);--sf-color-text--secondary:oklch(from var(--sf-surface-contrast) l c h / .7);--sf-color-text--placeholder:oklch(from var(--sf-surface-contrast) l c h / .45);--sf-color-text--disabled:oklch(from var(--sf-surface-contrast) l c h / .3);--sf-color-border:oklch(from var(--sf-surface-contrast) l c h / .2);--sf-color-border--subtle:oklch(from var(--sf-surface-contrast) l c h / .12);--sf-color-border--strong:oklch(from var(--sf-surface-contrast) l c h / .35);--sf-focus-ring-color:var(--sf-surface-contrast);--sf-caret-color:var(--sf-surface-contrast);--sf-shadow-color:oklch(from var(--sf-surface-color) var(--sf-shadow-lightness) c h)}}.sf-scrim{isolation:isolate;position:relative}.sf-scrim:before{content:"";z-index:0;background:var(--sf-scrim-gradient);pointer-events:none;position:absolute;inset:0}.sf-scrim>:not(img,picture,video,svg,canvas),.sf-scrim__content{z-index:1;position:relative}.sf-scrim--top{--sf-scrim-direction:to bottom}.sf-scrim--bottom{--sf-scrim-direction:to top}.sf-scrim--full{--sf-scrim-gradient:var(--sf-scrim-color)}.sf-surface-bg{background-color:var(--sf-surface-bg-color);background-image:var(--sf-surface-bg-overlay), var(--sf-surface-bg-image);background-size:var(--sf-surface-bg-size);background-position:var(--sf-surface-bg-position);background-repeat:var(--sf-surface-bg-repeat);background-attachment:var(--sf-surface-bg-attachment);animation:var(--sf-surface-bg-animation)}.sf-text-protect{text-shadow:var(--sf-scrim-text-shadow)}.sf-text-gradient{background-image:var(--sf-gradient-primary);color:#0000;-webkit-background-clip:text;background-clip:text}.sf-link-external:after{content:var(--sf-link-external-marker);font-size:.85em;text-decoration:none;display:inline-block}@supports (content:"x" / "y"){.sf-link-external:after{content:var(--sf-link-external-marker) / var(--sf-link-external-label)}}.sf-content-auto{content-visibility:auto;contain-intrinsic-size:auto var(--sf-content-intrinsic-size,500px)}.sf-tabular-nums{font-variant-numeric:var(--sf-font-numeric,tabular-nums)}.sf-drop-shadow-xs{filter:var(--sf-drop-shadow-xs)}.sf-drop-shadow-s{filter:var(--sf-drop-shadow-s)}.sf-drop-shadow-m{filter:var(--sf-drop-shadow-m)}.sf-drop-shadow-l{filter:var(--sf-drop-shadow-l)}.sf-drop-shadow-xl{filter:var(--sf-drop-shadow-xl)}.sf-link--subtle:link,.sf-link--subtle:visited{text-decoration-line:none}.sf-link--subtle:is(:link,:visited):hover,.sf-link--subtle:is(:link,:visited):focus-visible{text-decoration-line:underline;text-decoration-color:currentColor}.sf-link--reverse:link,.sf-link--reverse:visited{text-decoration-line:underline}.sf-link--reverse:is(:link,:visited):hover,.sf-link--reverse:is(:link,:visited):focus-visible{text-decoration-line:none}.sf-corner-scoop{-webkit-mask-image:radial-gradient(circle at var(--sf-corner-scoop-at), transparent var(--sf-corner-scoop-size), black calc(var(--sf-corner-scoop-size) + .5px));-webkit-mask-image:radial-gradient(circle at var(--sf-corner-scoop-at), transparent var(--sf-corner-scoop-size), black calc(var(--sf-corner-scoop-size) + .5px));mask-image:radial-gradient(circle at var(--sf-corner-scoop-at), transparent var(--sf-corner-scoop-size), black calc(var(--sf-corner-scoop-size) + .5px))}.sf-corner-scoop--top-left{--sf-corner-scoop-at:0 0}.sf-corner-scoop--top-right{--sf-corner-scoop-at:100% 0}.sf-corner-scoop--bottom-left{--sf-corner-scoop-at:0 100%}.sf-corner-scoop--bottom-right{--sf-corner-scoop-at:100% 100%}.sf-overlap,.sf-overlap--down,.sf-overlap--start,.sf-overlap--end{z-index:var(--sf-z-raised);position:relative}.sf-overlap{margin-block-start:calc(-1 * var(--sf-overlap-pull))}.sf-overlap--down{margin-block-end:calc(-1 * var(--sf-overlap-pull))}.sf-overlap--start{margin-inline-start:calc(-1 * var(--sf-overlap-pull))}.sf-overlap--end{margin-inline-end:calc(-1 * var(--sf-overlap-pull))}.sf-overlap-host{isolation:isolate;padding-block-start:var(--sf-overlap-host-pad,var(--sf-overlap-pull));position:relative}}@layer slashed.utilities,slashed.states;@layer slashed.themes{@media (prefers-color-scheme:dark){:root:not([data-theme]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--sf-is-dark:1}}:is([data-theme=light],.sf-theme-light){--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--sf-is-dark:0}:is([data-theme=dark],.sf-theme-dark){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--sf-is-dark:1}:where([data-theme]:not(:root,html),.sf-theme-light:not(:root,html),.sf-theme-dark:not(:root,html)){background-color:var(--sf-color-bg);color:var(--sf-color-text)}@supports (color:oklch(from red l c h)){:root[data-lumlocker]{--sf-color-primary:var(--lightningcss-light,oklch(from var(--sf-color-primary-source-light) var(--sf-lumlocker) c h))var(--lightningcss-dark,oklch(from var(--sf-color-primary-source-dark,var(--sf-color-primary-source-light)) var(--sf-lumlocker) c h));--sf-color-secondary:var(--lightningcss-light,oklch(from var(--sf-color-secondary-source-light) var(--sf-lumlocker) c h))var(--lightningcss-dark,oklch(from var(--sf-color-secondary-source-dark,var(--sf-color-secondary-source-light)) var(--sf-lumlocker) c h));--sf-color-tertiary:var(--lightningcss-light,oklch(from var(--sf-color-tertiary-source-light) var(--sf-lumlocker) c h))var(--lightningcss-dark,oklch(from var(--sf-color-tertiary-source-dark,var(--sf-color-tertiary-source-light)) var(--sf-lumlocker) c h));--sf-color-action:var(--lightningcss-light,oklch(from var(--sf-color-action-source-light) var(--sf-lumlocker) c h))var(--lightningcss-dark,oklch(from var(--sf-color-action-source-dark,var(--sf-color-action-source-light)) var(--sf-lumlocker) c h))}:root[data-lumlocker] :is([data-theme=dark],.sf-theme-dark){--sf-color-primary:oklch(from var(--sf-color-primary-source-dark,var(--sf-color-primary-source-light)) var(--sf-lumlocker) c h);--sf-color-secondary:oklch(from var(--sf-color-secondary-source-dark,var(--sf-color-secondary-source-light)) var(--sf-lumlocker) c h);--sf-color-tertiary:oklch(from var(--sf-color-tertiary-source-dark,var(--sf-color-tertiary-source-light)) var(--sf-lumlocker) c h);--sf-color-action:oklch(from var(--sf-color-action-source-dark,var(--sf-color-action-source-light)) var(--sf-lumlocker) c h)}:root[data-lumlocker] :is([data-theme=light],.sf-theme-light){--sf-color-primary:oklch(from var(--sf-color-primary-source-light) var(--sf-lumlocker) c h);--sf-color-secondary:oklch(from var(--sf-color-secondary-source-light) var(--sf-lumlocker) c h);--sf-color-tertiary:oklch(from var(--sf-color-tertiary-source-light) var(--sf-lumlocker) c h);--sf-color-action:oklch(from var(--sf-color-action-source-light) var(--sf-lumlocker) c h)}:root{--sf-color-primary-source-dark:oklch(from var(--sf-color-primary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-secondary-source-dark:oklch(from var(--sf-color-secondary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-tertiary-source-dark:oklch(from var(--sf-color-tertiary-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-action-source-dark:oklch(from var(--sf-color-action-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-neutral-source-dark:oklch(from var(--sf-color-neutral-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-base-source-dark:oklch(from var(--sf-color-base-source-light) clamp(.16, calc(1.18 - l), .24) calc(c * .5) h);--sf-color-success-source-dark:oklch(from var(--sf-color-success-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-warning-source-dark:oklch(from var(--sf-color-warning-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-info-source-dark:oklch(from var(--sf-color-info-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h);--sf-color-danger-source-dark:oklch(from var(--sf-color-danger-source-light) clamp(.65, calc(.95 - l * .5), .88) calc(c * .9) h)}:is([data-theme=dark],.sf-theme-dark){--sf-color-primary:var(--sf-color-primary-source-dark);--sf-color-secondary:var(--sf-color-secondary-source-dark);--sf-color-tertiary:var(--sf-color-tertiary-source-dark);--sf-color-action:var(--sf-color-action-source-dark);--sf-color-neutral:var(--sf-color-neutral-source-dark);--sf-color-base:var(--sf-color-base-source-dark);--sf-color-surface:var(--sf-color-base);--sf-color-bg:oklch(from var(--sf-color-base) calc(l + .02) c h);--sf-color-inset:oklch(from var(--sf-color-base) calc(l - .02) c h);--sf-color-raised:oklch(from var(--sf-color-base) calc(l + .04) c h);--sf-color-overlay:oklch(from var(--sf-color-base) l c h / .9);--sf-color-inverse:oklch(from var(--sf-color-base) calc(1 - l) c h);--sf-color-success:var(--sf-color-success-source-dark);--sf-color-warning:var(--sf-color-warning-source-dark);--sf-color-info:var(--sf-color-info-source-dark);--sf-color-danger:var(--sf-color-danger-source-dark);--sf-color-text:oklch(from var(--sf-color-neutral) clamp(.7, calc(l + .25 + var(--sf-contrast-bias)), 1) c h);--sf-color-text--secondary:oklch(from var(--sf-color-neutral) clamp(.55, calc(l + .1 + var(--sf-contrast-bias)), .9) c h);--sf-color-text--placeholder:oklch(from var(--sf-color-neutral) clamp(.35, calc(l - .1), .65) c h);--sf-color-text--disabled:oklch(from var(--sf-color-neutral) clamp(.25, calc(l - .2), .55) c h);--sf-color-text--inverse:oklch(from var(--sf-color-neutral) clamp(.05, calc(l - .4), .35) c h);--sf-color-heading:oklch(from var(--sf-color-neutral) clamp(.7, calc(l + .25 + var(--sf-contrast-bias)), 1) c h);--sf-color-border:oklch(from var(--sf-color-neutral) clamp(.25, calc(l - .3), .55) .005 h);--sf-color-border--subtle:oklch(from var(--sf-color-neutral) clamp(.2, calc(l - .38), .45) .005 h);--sf-color-border--strong:oklch(from var(--sf-color-neutral) clamp(.38, calc(l - .1), .65) .02 h);--sf-color-link:oklch(from var(--sf-color-action) clamp(.68, l, 1) c h);--sf-color-link--hover:oklch(from var(--sf-color-action) clamp(0, max(l + .1, .68), 1) c h);--sf-color-link--active:oklch(from var(--sf-color-action) clamp(0, max(l + .15, .74), 1) c h);--sf-color-link--visited:oklch(from var(--sf-color-action) clamp(.68, l, 1) c calc(h + 60));--sf-color-selection-bg:oklch(from var(--sf-color-action-source-dark) clamp(.62, calc(.93 - l * .4), .78) c h / .55);--sf-color-success-strong:oklch(from var(--sf-color-success) clamp(.7, calc(l + .15), 1) c h);--sf-color-warning-strong:oklch(from var(--sf-color-warning) clamp(.7, calc(l + .05), 1) c h);--sf-color-info-strong:oklch(from var(--sf-color-info) clamp(.7, calc(l + .15), 1) c h);--sf-color-danger-strong:oklch(from var(--sf-color-danger) clamp(.7, calc(l + .15), 1) c h);--sf-color-code-bg:var(--sf-color-inset);--sf-color-bg--disabled:var(--sf-color-inset);--sf-color-link--disabled:var(--sf-color-text--disabled);--sf-scrollbar-thumb:var(--sf-color-neutral);--sf-color-code-text:var(--sf-color-text)}:is([data-theme=light],.sf-theme-light){--sf-color-primary:var(--sf-color-primary-source-light);--sf-color-secondary:var(--sf-color-secondary-source-light);--sf-color-tertiary:var(--sf-color-tertiary-source-light);--sf-color-action:var(--sf-color-action-source-light);--sf-color-neutral:var(--sf-color-neutral-source-light);--sf-color-base:var(--sf-color-base-source-light);--sf-color-surface:var(--sf-color-base);--sf-color-bg:oklch(from var(--sf-color-base) calc(l + .02) c h);--sf-color-inset:oklch(from var(--sf-color-base) calc(l - .02) c h);--sf-color-raised:oklch(from var(--sf-color-base) calc(l + .04) c h);--sf-color-overlay:oklch(from var(--sf-color-base) l c h / .9);--sf-color-inverse:oklch(from var(--sf-color-base) calc(1 - l) c h);--sf-color-success:var(--sf-color-success-source-light);--sf-color-warning:var(--sf-color-warning-source-light);--sf-color-info:var(--sf-color-info-source-light);--sf-color-danger:var(--sf-color-danger-source-light);--sf-color-text:oklch(from var(--sf-color-neutral-source-light) clamp(.05, calc(l - .4 - var(--sf-contrast-bias)), .35) c h);--sf-color-text--secondary:oklch(from var(--sf-color-neutral-source-light) clamp(.15, calc(l - .25 - var(--sf-contrast-bias)), .45) c h);--sf-color-text--placeholder:oklch(from var(--sf-color-neutral-source-light) clamp(.45, calc(l + .15), .75) c h);--sf-color-text--disabled:oklch(from var(--sf-color-neutral-source-light) clamp(.55, calc(l + .25), .82) c h);--sf-color-text--inverse:oklch(from var(--sf-color-neutral-source-light) clamp(.85, calc(l + .4), .98) c h);--sf-color-heading:oklch(from var(--sf-color-neutral-source-light) clamp(.05, calc(l - .4 - var(--sf-contrast-bias)), .35) c h);--sf-color-border:oklch(from var(--sf-color-neutral-source-light) clamp(.7, calc(l + .35), .95) .005 h);--sf-color-border--subtle:oklch(from var(--sf-color-neutral-source-light) clamp(.75, calc(l + .4), .97) .005 h);--sf-color-border--strong:oklch(from var(--sf-color-neutral-source-light) clamp(.55, calc(l + .1), .85) .02 h);--sf-color-link:oklch(from var(--sf-color-action) clamp(0, min(l - .07, .48), 1) c h);--sf-color-link--hover:oklch(from var(--sf-color-action) clamp(0, min(l - .15, .4), 1) c h);--sf-color-link--active:oklch(from var(--sf-color-action) clamp(0, min(l - .21, .34), 1) c h);--sf-color-link--visited:oklch(from var(--sf-color-action) clamp(0, min(l - .07, .48), 1) c calc(h + 60));--sf-color-selection-bg:oklch(from var(--sf-color-action-source-light) l c h / .28);--sf-color-success-strong:oklch(from var(--sf-color-success-source-light) calc(l - .15) c h);--sf-color-warning-strong:oklch(from var(--sf-color-warning-source-light) calc(l - .25) c h);--sf-color-info-strong:oklch(from var(--sf-color-info-source-light) calc(l - .1) c h);--sf-color-danger-strong:oklch(from var(--sf-color-danger-source-light) calc(l - .1) c h);--sf-color-code-bg:var(--sf-color-inset);--sf-color-bg--disabled:var(--sf-color-inset);--sf-color-link--disabled:var(--sf-color-text--disabled);--sf-scrollbar-thumb:var(--sf-color-neutral);--sf-color-code-text:var(--sf-color-text)}}@supports (color:oklch(from red l c h)) and (width:calc(1px * sign(1))){:is([data-theme=dark],.sf-theme-dark),:is([data-theme=light],.sf-theme-light){--sf-color-text--on-primary:oklch(from var(--sf-color-primary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-secondary:oklch(from var(--sf-color-secondary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-tertiary:oklch(from var(--sf-color-tertiary) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-action:oklch(from var(--sf-color-action) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-neutral:oklch(from var(--sf-color-neutral) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-success:oklch(from var(--sf-color-success) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-warning:oklch(from var(--sf-color-warning) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-info:oklch(from var(--sf-color-info) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-danger:oklch(from var(--sf-color-danger) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-text--on-inverse:oklch(from var(--sf-color-inverse) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0);--sf-color-code-text:oklch(from var(--sf-color-code-bg) clamp(.1, sign(var(--sf-contrast-threshold) - l) * 999, .95) 0 0)}}.sf-theme-transition{transition:--sf-color-primary var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-secondary var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-tertiary var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-action var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-neutral var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-base var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-success var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-warning var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-info var(--sf-theme-transition-duration) var(--sf-ease-out), --sf-color-danger var(--sf-theme-transition-duration) var(--sf-ease-out)}@media (prefers-reduced-motion:reduce){.sf-theme-transition{transition:none}}}@layer slashed.motion,slashed.accessibility,slashed.print,slashed.legacy,slashed.overrides; /*$vite$:1*/ \ No newline at end of file diff --git a/SLASHED-for-WP/assets/admin-app/app.js b/SLASHED-for-WP/assets/admin-app/app.js index 2966d225..b630fdef 100644 --- a/SLASHED-for-WP/assets/admin-app/app.js +++ b/SLASHED-for-WP/assets/admin-app/app.js @@ -1,6 +1,6 @@ -var e=Array.isArray,t=Array.prototype.indexOf,n=Array.prototype.includes,r=Array.from,i=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyDescriptors,s=Object.prototype,c=Array.prototype,l=Object.getPrototypeOf,u=Object.isExtensible;function d(e){return typeof e==`function`}var f=()=>{};function p(e){for(var t=0;t{e=n,t=r}),resolve:e,reject:t}}function h(e,t){if(Array.isArray(e))return e;if(t===void 0||!(Symbol.iterator in e))return Array.from(e);let n=[];for(let r of e)if(n.push(r),n.length===t)break;return n}var g=1<<24,_=1024,v=2048,y=4096,b=8192,x=16384,S=32768,C=1<<25,w=65536,T=1<<19,E=1<<20,D=1<<25,O=65536,k=1<<21,A=1<<22,ee=1<<23,j=Symbol(`$state`),te=Symbol(`legacy props`),ne=Symbol(``),M=Symbol(`attributes`),re=Symbol(`class`),ie=Symbol(`style`),ae=Symbol(`text`),oe=Symbol(`form reset`),se=new class extends Error{name=`StaleReactionError`;message="The reaction that called `getAbortSignal()` was re-run or destroyed"},N=!!globalThis.document?.contentType&&globalThis.document.contentType.includes(`xml`);function ce(e){throw Error(`https://svelte.dev/e/lifecycle_outside_component`)}function le(){throw Error(`https://svelte.dev/e/async_derived_orphan`)}function ue(e,t,n){throw Error(`https://svelte.dev/e/each_key_duplicate`)}function de(e){throw Error(`https://svelte.dev/e/effect_in_teardown`)}function fe(){throw Error(`https://svelte.dev/e/effect_in_unowned_derived`)}function pe(e){throw Error(`https://svelte.dev/e/effect_orphan`)}function me(){throw Error(`https://svelte.dev/e/effect_update_depth_exceeded`)}function he(e){throw Error(`https://svelte.dev/e/props_invalid_value`)}function ge(){throw Error(`https://svelte.dev/e/state_descriptors_fixed`)}function _e(){throw Error(`https://svelte.dev/e/state_prototype_fixed`)}function ve(){throw Error(`https://svelte.dev/e/state_unsafe_mutation`)}function ye(){throw Error(`https://svelte.dev/e/svelte_boundary_reset_onerror`)}var be={},xe=Symbol(`uninitialized`),Se=`http://www.w3.org/1999/xhtml`,Ce=`http://www.w3.org/2000/svg`;function we(){console.warn(`https://svelte.dev/e/derived_inert`)}function Te(e){console.warn(`https://svelte.dev/e/hydration_mismatch`)}function Ee(){console.warn(`https://svelte.dev/e/select_multiple_invalid_value`)}function De(){console.warn(`https://svelte.dev/e/svelte_boundary_reset_noop`)}var P=!1;function Oe(e){P=e}var ke;function Ae(e){if(e===null)throw Te(),be;return ke=e}function je(){return Ae(pn(ke))}function F(e){if(P){if(pn(ke)!==null)throw Te(),be;ke=e}}function Me(e=1){if(P){for(var t=e,n=ke;t--;)n=pn(n);ke=n}}function Ne(e=!0){for(var t=0,n=ke;;){if(n.nodeType===8){var r=n.data;if(r===`]`){if(t===0)return n;--t}else(r===`[`||r===`[!`||r[0]===`[`&&!isNaN(Number(r.slice(1))))&&(t+=1)}var i=pn(n);e&&n.remove(),n=i}}function Pe(e){if(!e||e.nodeType!==8)throw Te(),be;return e.data}function Fe(e){return e===this.v}function Ie(e,t){return e==e?e!==t||typeof e==`object`&&!!e||typeof e==`function`:t==t}function Le(e){return!Ie(e,this.v)}var Re=!1,ze=!1,Be=null;function Ve(e){Be=e}function He(e){return Ke(`getContext`).get(e)}function Ue(e,t=!1,n){Be={p:Be,i:!1,c:null,e:null,s:e,x:null,r:tr,l:ze&&!t?{s:null,u:null,$:[]}:null}}function We(e){var t=Be,n=t.e;if(n!==null){t.e=null;for(var r of n)kn(r)}return e!==void 0&&(t.x=e),t.i=!0,Be=t.p,e??{}}function Ge(){return!ze||Be!==null&&Be.l===null}function Ke(e){return Be===null&&ce(e),Be.c??=new Map(qe(Be)||void 0)}function qe(e){let t=e.p;for(;t!==null;){let e=t.c;if(e!==null)return e;t=t.p}return null}var Je=[];function Ye(){var e=Je;Je=[],p(e)}function Xe(e){if(Je.length===0&&!jt){var t=Je;queueMicrotask(()=>{t===Je&&Ye()})}Je.push(e)}function Ze(){for(;Je.length>0;)Ye()}function Qe(e){var t=tr;if(t===null)return Qn.f|=ee,e;if(!(t.f&32768)&&!(t.f&4))throw e;$e(e,t)}function $e(e,t){if(!(t!==null&&t.f&16384)){for(;t!==null;){if(t.f&128){if(!(t.f&32768))throw e;try{t.b.error(e);return}catch(t){e=t}}t=t.parent}throw e}}var et=~(v|y|_);function tt(e,t){e.f=e.f&et|t}function nt(e){e.f&512||e.deps===null?tt(e,_):tt(e,y)}function rt(e){if(e!==null)for(let t of e)!(t.f&2)||!(t.f&65536)||(t.f^=O,rt(t.deps))}function it(e,t,n){e.f&2048?t.add(e):e.f&4096&&n.add(e),rt(e.deps),tt(e,_)}var at=!1,ot=!1;function st(e){var t=ot;try{return ot=!1,[e(),ot]}finally{ot=t}}function ct(e){let t=0,n=Xt(0),r;return()=>{En()&&(U(n),Nn(()=>(t===0&&(r=Cr(()=>e(()=>en(n)))),t+=1,()=>{Xe(()=>{--t,t===0&&(r?.(),r=void 0,en(n))})})))}}var lt=w|T;function ut(e,t,n,r){new dt(e,t,n,r)}var dt=class{parent;is_pending=!1;transform_error;#e;#t=P?ke:null;#n;#r;#i;#a=null;#o=null;#s=null;#c=null;#l=0;#u=0;#d=!1;#f=new Set;#p=new Set;#m=null;#h=ct(()=>(this.#m=Xt(this.#l),()=>{this.#m=null}));constructor(e,t,n,r){this.#e=e,this.#n=t,this.#r=e=>{var t=tr;t.b=this,t.f|=128,n(e)},this.parent=tr.b,this.transform_error=r??this.parent?.transform_error??(e=>e),this.#i=Pn(()=>{if(P){let e=this.#t;je();let t=e.data===`[!`;if(e.data.startsWith(`[?`)){let t=JSON.parse(e.data.slice(2));this.#_(t)}else t?this.#v():this.#g()}else this.#y()},lt),P&&(this.#e=ke)}#g(){try{this.#a=In(()=>this.#r(this.#e))}catch(e){this.error(e)}}#_(e){let t=this.#n.failed;t&&(this.#s=In(()=>{t(this.#e,()=>e,()=>()=>{})}))}#v(){let e=this.#n.pending;e&&(this.is_pending=!0,this.#o=In(()=>e(this.#e)),Xe(()=>{var e=this.#c=document.createDocumentFragment(),t=dn();e.append(t),this.#a=this.#x(()=>In(()=>this.#r(t))),this.#u===0&&(this.#e.before(e),this.#c=null,Un(this.#o,()=>{this.#o=null}),this.#b(Dt))}))}#y(){try{if(this.is_pending=this.has_pending_snippet(),this.#u=0,this.#l=0,this.#a=In(()=>{this.#r(this.#e)}),this.#u>0){var e=this.#c=document.createDocumentFragment();qn(this.#a,e);let t=this.#n.pending;this.#o=In(()=>t(this.#e))}else this.#b(Dt)}catch(e){this.error(e)}}#b(e){this.is_pending=!1,e.transfer_effects(this.#f,this.#p)}defer_effect(e){it(e,this.#f,this.#p)}is_rendered(){return!this.is_pending&&(!this.parent||this.parent.is_rendered())}has_pending_snippet(){return!!this.#n.pending}#x(e){var t=tr,n=Qn,r=Be;nr(this.#i),er(this.#i),Ve(this.#i.ctx);try{return Lt.ensure(),e()}catch(e){return Qe(e),null}finally{nr(t),er(n),Ve(r)}}#S(e,t){if(!this.has_pending_snippet()){this.parent&&this.parent.#S(e,t);return}this.#u+=e,this.#u===0&&(this.#b(t),this.#o&&Un(this.#o,()=>{this.#o=null}),this.#c&&=(this.#e.before(this.#c),null))}update_pending_count(e,t){this.#S(e,t),this.#l+=e,!(!this.#m||this.#d)&&(this.#d=!0,Xe(()=>{this.#d=!1,this.#m&&Qt(this.#m,this.#l)}))}get_effect_pending(){return this.#h(),U(this.#m)}error(e){if(!this.#n.onerror&&!this.#n.failed)throw e;Dt?.is_fork?(this.#a&&Dt.skip_effect(this.#a),this.#o&&Dt.skip_effect(this.#o),this.#s&&Dt.skip_effect(this.#s),Dt.oncommit(()=>{this.#C(e)})):this.#C(e)}#C(e){this.#a&&=(Bn(this.#a),null),this.#o&&=(Bn(this.#o),null),this.#s&&=(Bn(this.#s),null),P&&(Ae(this.#t),Me(),Ae(Ne()));var t=this.#n.onerror;let n=this.#n.failed;var r=!1,i=!1;let a=()=>{if(r){De();return}r=!0,i&&ye(),this.#s!==null&&Un(this.#s,()=>{this.#s=null}),this.#x(()=>{this.#y()})},o=e=>{try{i=!0,t?.(e,a),i=!1}catch(e){$e(e,this.#i&&this.#i.parent)}n&&(this.#s=this.#x(()=>{try{return In(()=>{var t=tr;t.b=this,t.f|=128,n(this.#e,()=>e,()=>a)})}catch(e){return $e(e,this.#i.parent),null}}))};Xe(()=>{var t;try{t=this.transform_error(e)}catch(e){$e(e,this.#i&&this.#i.parent);return}typeof t==`object`&&t&&typeof t.then==`function`?t.then(o,e=>$e(e,this.#i&&this.#i.parent)):o(t)})}};function ft(e,t,n,r){let i=Ge()?gt:yt;var a=e.filter(e=>!e.settled),o=t.map(i);if(n.length===0&&a.length===0){r(o);return}var s=tr,c=pt(),l=a.length===1?a[0].promise:a.length>1?Promise.all(a.map(e=>e.promise)):null;function u(e){if(!(s.f&16384)){c();try{r([...o,...e])}catch(e){$e(e,s)}mt()}}var d=ht();if(n.length===0){l.then(()=>u([])).finally(d);return}function f(){Promise.all(n.map(e=>vt(e))).then(u).catch(e=>$e(e,s)).finally(d)}l?l.then(()=>{c(),f(),mt()}):f()}function pt(){var e=tr,t=Qn,n=Be,r=Dt;return function(i=!0){nr(e),er(t),Ve(n),i&&!(e.f&16384)&&(r?.activate(),r?.apply())}}function mt(e=!0){nr(null),er(null),Ve(null),e&&Dt?.deactivate()}function ht(){var e=tr,t=e.b,n=Dt,r=!!t?.is_rendered();return t?.update_pending_count(1,n),n.increment(r,e),()=>{t?.update_pending_count(-1,n),n.decrement(r,e)}}function gt(e){var t=2|v;return tr!==null&&(tr.f|=T),{ctx:Be,deps:null,effects:null,equals:Fe,f:t,fn:e,reactions:null,rv:0,v:xe,wv:0,parent:tr,ac:null}}var _t=Symbol(`obsolete`);function vt(e,t,n){let r=tr;r===null&&le();var i=void 0,a=Xt(xe),o=!Qn,s=new Set;return Mn(()=>{var t=tr,n=m();i=n.promise;try{Promise.resolve(e()).then(n.resolve,e=>{e!==se&&n.reject(e)}).finally(mt)}catch(e){n.reject(e),mt()}var c=Dt;if(o){if(t.f&32768)var l=ht();if(r.b?.is_rendered())c.async_deriveds.get(t)?.reject(_t);else for(let e of s.values())e.reject(_t);s.add(n),c.async_deriveds.set(t,n)}let u=(e,t=void 0)=>{l?.(),s.delete(n),t!==_t&&(c.activate(),t?(a.f|=ee,Qt(a,t)):(a.f&8388608&&(a.f^=ee),Qt(a,e)),c.deactivate())};n.promise.then(u,e=>u(null,e||`unknown`))}),Dn(()=>{for(let e of s)e.reject(_t)}),new Promise(e=>{function t(n){function r(){n===i?e(a):t(i)}n.then(r,r)}t(i)})}function I(e){let t=gt(e);return Re||ir(t),t}function yt(e){let t=gt(e);return t.equals=Le,t}function bt(e){var t=e.effects;if(t!==null){e.effects=null;for(var n=0;nthis.schedule(e)){var n=this.#f.get(e);if(n){this.#f.delete(e);for(var r of n.d)tt(r,v),t(r);for(r of n.m)tt(r,y),t(r)}this.#p.add(e)}#g(){this.#e=!0,Ft++>1e3&&(this.#S(),zt());for(let e of this.#u)this.#d.delete(e),tt(e,v),this.schedule(e);for(let e of this.#d)tt(e,y),this.schedule(e);let t=this.#c;this.#c=[],this.apply();var n=Nt=[],r=[],i=Pt=[];for(let e of t)try{this.#_(e,n,r)}catch(t){throw Kt(e),this.#h()||this.discard(),t}if(Dt=null,i.length>0){var a=e.ensure();for(let e of i)a.schedule(e)}if(Nt=null,Pt=null,this.#h()){this.#b(r),this.#b(n);for(let[e,t]of this.#f)Gt(e,t);i.length>0&&Dt.#g();return}let o=this.#v();if(o){this.#b(r),this.#b(n),o.#y(this);return}this.#u.clear(),this.#d.clear();for(let e of this.#r)e(this);this.#r.clear(),Ot=this,Vt(r),Vt(n),Ot=null,this.#s?.resolve();var s=Dt;if(this.#a===0&&(this.#c.length===0||s!==null)&&(this.#S(),Re&&(this.#x(),Dt=s)),this.#c.length>0)if(s!==null){let e=s;e.#c.push(...this.#c.filter(t=>!e.#c.includes(t)))}else s=this;s!==null&&s.#g()}#_(e,t,n){e.f^=_;for(var r=e.first;r!==null;){var i=r.f,a=(i&96)!=0;if(!(a&&i&1024||i&8192||this.#f.has(r))&&r.fn!==null){a?r.f^=_:i&4?t.push(r):Re&&i&16777224?n.push(r):mr(r)&&(i&16&&this.#d.add(r),yr(r));var o=r.first;if(o!==null){r=o;continue}}for(;r!==null;){var s=r.next;if(s!==null){r=s;break}r=r.parent}}}#v(){for(var e=this.#t;e!==null;){if(!e.is_fork){for(let[t,[,n]]of this.current)if(e.current.has(t)&&!n)return e}e=e.#t}return null}#y(e){for(let[t,n]of e.current)!this.previous.has(t)&&e.previous.has(t)&&this.previous.set(t,e.previous.get(t)),this.current.set(t,n);for(let[t,n]of e.async_deriveds){let e=this.async_deriveds.get(t);e&&n.promise.then(e.resolve).catch(e.reject)}e.async_deriveds.clear(),this.transfer_effects(e.#u,e.#d);let t=e=>{var n=e.reactions;if(n!==null)for(let e of n){var r=e.f;if(r&2)t(e);else{var i=e;r&4194320&&!this.async_deriveds.has(i)&&(this.#d.delete(i),tt(i,v),this.schedule(i))}}};for(let e of this.current.keys())t(e);this.oncommit(()=>e.discard()),e.#S(),Dt=this,this.#g()}#b(e){for(var t=0;t!u.current.get(e)[1]);if(!(!u.#e||r.length===0)){var i=r.filter(e=>!this.current.has(e));if(i.length===0)e&&u.discard();else if(t.length>0){if(e)for(let e of this.#p)u.unskip_effect(e,e=>{e.f&4194320?u.schedule(e):u.#b([e])});u.activate();var a=new Set,o=new Map;for(var s of t)Ht(s,i,a,o);o=new Map;var c=[...u.current].filter(([e,t])=>{let n=this.current.get(e);return n?n[0]!==t[0]||n[1]!==t[1]:!0}).map(([e])=>e);if(c.length>0)for(let e of this.#l)!(e.f&155648)&&Ut(e,c,o)&&(e.f&4194320?(tt(e,v),u.schedule(e)):u.#u.add(e));if(u.#c.length>0&&!u.#m){u.apply();for(var l of u.#c)u.#_(l,[],[]);u.#c=[]}u.deactivate()}}}}increment(e,t){if(this.#a+=1,e){let e=this.#o.get(t)??0;this.#o.set(t,e+1)}}decrement(e,t){if(--this.#a,e){let e=this.#o.get(t)??0;e===1?this.#o.delete(t):this.#o.set(t,e-1)}this.#m||(this.#m=!0,Xe(()=>{this.#m=!1,this.linked&&this.flush()}))}transfer_effects(e,t){for(let t of e)this.#u.add(t);for(let e of t)this.#d.add(e);e.clear(),t.clear()}oncommit(e){this.#r.add(e)}ondiscard(e){this.#i.add(e)}settled(){return(this.#s??=m()).promise}static ensure(){if(Dt===null){let t=Dt=new e;!Mt&&!jt&&Xe(()=>{t.#e||t.flush()})}return Dt}apply(){if(!Re||!this.is_fork&&this.#t===null&&this.#n===null){kt=null;return}kt=new Map;for(let[e,[t]]of this.current)kt.set(e,t);for(let t=Tt;t!==null;t=t.#n)if(!(t===this||t.is_fork)){var e=!1;if(t.id0)){Jt.clear();for(let e of Bt){if(e.f&24576)continue;let t=[e],n=e.parent;for(;n!==null;)Bt.has(n)&&(Bt.delete(n),t.push(n)),n=n.parent;for(let e=t.length-1;e>=0;e--){let n=t[e];n.f&24576||yr(n)}}Bt.clear()}}Bt=null}}function Ht(e,t,n,r){if(!n.has(e)&&(n.add(e),e.reactions!==null))for(let i of e.reactions){let e=i.f;e&2?Ht(i,t,n,r):e&4194320&&!(e&2048)&&Ut(i,t,r)&&(tt(i,v),Wt(i))}}function Ut(e,t,r){let i=r.get(e);if(i!==void 0)return i;if(e.deps!==null)for(let i of e.deps){if(n.call(t,i))return!0;if(i.f&2&&Ut(i,t,r))return r.set(i,!0),!0}return r.set(e,!1),!1}function Wt(e){Dt.schedule(e)}function Gt(e,t){if(!(e.f&32&&e.f&1024)){e.f&2048?t.d.push(e):e.f&4096&&t.m.push(e),tt(e,_);for(var n=e.first;n!==null;)Gt(n,t),n=n.next}}function Kt(e){tt(e,_);for(var t=e.first;t!==null;)Kt(t),t=t.next}var qt=new Set,Jt=new Map,Yt=!1;function Xt(e,t){return{f:0,v:e,reactions:null,equals:Fe,rv:0,wv:0}}function L(e,t){let n=Xt(e,t);return ir(n),n}function Zt(e,t=!1,n=!0){let r=Xt(e);return t||(r.equals=Le),ze&&n&&Be!==null&&Be.l!==null&&(Be.l.s??=[]).push(r),r}function R(e,t,n=!1){return Qn!==null&&(!$n||Qn.f&131072)&&Ge()&&Qn.f&4325394&&(rr===null||!rr.has(e))&&ve(),Qt(e,n?nn(t):t,Pt)}function Qt(e,t,n=null){if(!e.equals(t)){Jt.set(e,Xn?t:e.v);var r=Lt.ensure();if(r.capture(e,t),e.f&2){let t=e;e.f&2048&&xt(t),kt===null&&nt(t)}e.wv=pr(),tn(e,v,n),Ge()&&tr!==null&&tr.f&1024&&!(tr.f&96)&&(sr===null?cr([e]):sr.push(e)),!r.is_fork&&qt.size>0&&!Yt&&$t()}return t}function $t(){Yt=!1;for(let e of qt){e.f&1024&&tt(e,y);let t;try{t=mr(e)}catch{t=!0}t&&yr(e)}qt.clear()}function en(e){R(e,e.v+1)}function tn(e,t,n){var r=e.reactions;if(r!==null)for(var i=Ge(),a=r.length,o=0;o{if(dr===d)return e();var t=Qn,n=dr;er(null),fr(d);var r=e();return er(t),fr(n),r};return i&&r.set(`length`,L(t.length,u)),new Proxy(t,{defineProperty(e,t,n){(!(`value`in n)||n.configurable===!1||n.enumerable===!1||n.writable===!1)&&ge();var i=r.get(t);return i===void 0?f(()=>{var e=L(n.value,u);return r.set(t,e),e}):R(i,n.value,!0),!0},deleteProperty(e,t){var n=r.get(t);if(n===void 0){if(t in e){let e=f(()=>L(xe,u));r.set(t,e),en(o)}}else R(n,xe),en(o);return!0},get(e,n,i){if(n===j)return t;var o=r.get(n),s=n in e;if(o===void 0&&(!s||a(e,n)?.writable)&&(o=f(()=>L(nn(s?e[n]:xe),u)),r.set(n,o)),o!==void 0){var c=U(o);return c===xe?void 0:c}return Reflect.get(e,n,i)},getOwnPropertyDescriptor(e,t){var n=Reflect.getOwnPropertyDescriptor(e,t);if(n&&`value`in n){var i=r.get(t);i&&(n.value=U(i))}else if(n===void 0){var a=r.get(t),o=a?.v;if(a!==void 0&&o!==xe)return{enumerable:!0,configurable:!0,value:o,writable:!0}}return n},has(e,t){if(t===j)return!0;var n=r.get(t),i=n!==void 0&&n.v!==xe||Reflect.has(e,t);return(n!==void 0||tr!==null&&(!i||a(e,t)?.writable))&&(n===void 0&&(n=f(()=>L(i?nn(e[t]):xe,u)),r.set(t,n)),U(n)===xe)?!1:i},set(e,t,n,s){var c=r.get(t),l=t in e;if(i&&t===`length`)for(var d=n;dL(xe,u)),r.set(d+``,p)):R(p,xe)}if(c===void 0)(!l||a(e,t)?.writable)&&(c=f(()=>L(void 0,u)),R(c,nn(n)),r.set(t,c));else{l=c.v!==xe;var m=f(()=>nn(n));R(c,m)}var h=Reflect.getOwnPropertyDescriptor(e,t);if(h?.set&&h.set.call(s,n),!l){if(i&&typeof t==`string`){var g=r.get(`length`),_=Number(t);Number.isInteger(_)&&_>=g.v&&R(g,_+1)}en(o)}return!0},ownKeys(e){U(o);var t=Reflect.ownKeys(e).filter(e=>{var t=r.get(e);return t===void 0||t.v!==xe});for(var[n,i]of r)i.v!==xe&&!(n in e)&&t.push(n);return t},setPrototypeOf(){_e()}})}function rn(e){try{if(typeof e==`object`&&e&&j in e)return e[j]}catch{}return e}function an(e,t){return Object.is(rn(e),rn(t))}var on,sn,cn,ln;function un(){if(on===void 0){on=window,sn=/Firefox/.test(navigator.userAgent);var e=Element.prototype,t=Node.prototype,n=Text.prototype;cn=a(t,`firstChild`).get,ln=a(t,`nextSibling`).get,u(e)&&(e[re]=void 0,e[M]=null,e[ie]=void 0,e.__e=void 0),u(n)&&(n[ae]=void 0)}}function dn(e=``){return document.createTextNode(e)}function fn(e){return cn.call(e)}function pn(e){return ln.call(e)}function z(e,t){if(!P)return fn(e);var n=fn(ke);if(n===null)n=ke.appendChild(dn());else if(t&&n.nodeType!==3){var r=dn();return n?.before(r),Ae(r),r}return t&&_n(n),Ae(n),n}function B(e,t=!1){if(!P){var n=fn(e);return n instanceof Comment&&n.data===``?pn(n):n}if(t){if(ke?.nodeType!==3){var r=dn();return ke?.before(r),Ae(r),r}_n(ke)}return ke}function V(e,t=1,n=!1){let r=P?ke:e;for(var i;t--;)i=r,r=pn(r);if(!P)return r;if(n){if(r?.nodeType!==3){var a=dn();return r===null?i?.after(a):r.before(a),Ae(a),a}_n(r)}return Ae(r),r}function mn(e){e.textContent=``}function hn(){return!Re||Bt!==null?!1:(tr.f&S)!==0}function gn(e,t,n){return t==null||t===`http://www.w3.org/1999/xhtml`?n?document.createElement(e,{is:n}):document.createElement(e):n?document.createElementNS(t,e,{is:n}):document.createElementNS(t,e)}function _n(e){if(e.nodeValue.length<65536)return;let t=e.nextSibling;for(;t!==null&&t.nodeType===3;)t.remove(),e.nodeValue+=t.nodeValue,t=e.nextSibling}function vn(e,t){if(t){let t=document.body;e.autofocus=!0,Xe(()=>{document.activeElement===t&&e.focus()})}}var yn=!1;function bn(){yn||(yn=!0,document.addEventListener(`reset`,e=>{Promise.resolve().then(()=>{if(!e.defaultPrevented)for(let t of e.target.elements)t[oe]?.()})},{capture:!0}))}function xn(e){var t=Qn,n=tr;er(null),nr(null);try{return e()}finally{er(t),nr(n)}}function Sn(e,t,n,r=n){e.addEventListener(t,()=>xn(n));let i=e[oe];i?e[oe]=()=>{i(),r(!0)}:e[oe]=()=>r(!0),bn()}function Cn(e){tr===null&&(Qn===null&&pe(e),fe()),Xn&&de(e)}function wn(e,t){var n=t.last;n===null?t.last=t.first=e:(n.next=e,e.prev=n,t.last=e)}function Tn(e,t){var n=tr;n!==null&&n.f&8192&&(e|=b);var r={ctx:Be,deps:null,nodes:null,f:e|v|512,first:null,fn:t,last:null,next:null,parent:n,b:n&&n.b,prev:null,teardown:null,wv:0,ac:null};Dt?.register_created_effect(r);var i=r;if(e&4)Nt===null?Lt.ensure().schedule(r):Nt.push(r);else if(t!==null){try{yr(r)}catch(e){throw Bn(r),e}i.deps===null&&i.teardown===null&&i.nodes===null&&i.first===i.last&&!(i.f&524288)&&(i=i.first,e&16&&e&65536&&i!==null&&(i.f|=w))}if(i!==null&&(i.parent=n,n!==null&&wn(i,n),Qn!==null&&Qn.f&2&&!(e&64))){var a=Qn;(a.effects??=[]).push(i)}return r}function En(){return Qn!==null&&!$n}function Dn(e){let t=Tn(8,null);return tt(t,_),t.teardown=e,t}function On(e){Cn(`$effect`);var t=tr.f;if(!Qn&&t&32&&Be!==null&&!Be.i){var n=Be;(n.e??=[]).push(e)}else return kn(e)}function kn(e){return Tn(4|E,e)}function An(e){Lt.ensure();let t=Tn(64|T,e);return(e={})=>new Promise(n=>{e.outro?Un(t,()=>{Bn(t),n(void 0)}):(Bn(t),n(void 0))})}function jn(e){return Tn(4,e)}function Mn(e){return Tn(A|T,e)}function Nn(e,t=0){return Tn(8|t,e)}function H(e,t=[],n=[],r=[]){ft(r,t,n,t=>{Tn(8,()=>{e(...t.map(U))})})}function Pn(e,t=0){return Tn(16|t,e)}function Fn(e,t=0){return Tn(g|t,e)}function In(e){return Tn(32|T,e)}function Ln(e){var t=e.teardown;if(t!==null){let e=Xn,n=Qn;Zn(!0),er(null);try{t.call(null)}finally{Zn(e),er(n)}}}function Rn(e,t=!1){var n=e.first;for(e.first=e.last=null;n!==null;){let e=n.ac;e!==null&&xn(()=>{e.abort(se)});var r=n.next;n.f&64?n.parent=null:Bn(n,t),n=r}}function zn(e){for(var t=e.first;t!==null;){var n=t.next;t.f&32||Bn(t),t=n}}function Bn(e,t=!0){var n=!1;(t||e.f&262144)&&e.nodes!==null&&e.nodes.end!==null&&(Vn(e.nodes.start,e.nodes.end),n=!0),e.f|=C,Rn(e,t&&!n),vr(e,0);var r=e.nodes&&e.nodes.t;if(r!==null)for(let e of r)e.stop();Ln(e),e.f^=C,e.f|=x;var i=e.parent;i!==null&&i.first!==null&&Hn(e),e.next=e.prev=e.teardown=e.ctx=e.deps=e.fn=e.nodes=e.ac=e.b=null}function Vn(e,t){for(;e!==null;){var n=e===t?null:pn(e);e.remove(),e=n}}function Hn(e){var t=e.parent,n=e.prev,r=e.next;n!==null&&(n.next=r),r!==null&&(r.prev=n),t!==null&&(t.first===e&&(t.first=r),t.last===e&&(t.last=n))}function Un(e,t,n=!0){var r=[];Wn(e,r,!0);var i=()=>{n&&Bn(e),t&&t()},a=r.length;if(a>0){var o=()=>--a||i();for(var s of r)s.out(o)}else i()}function Wn(e,t,n){if(!(e.f&8192)){e.f^=b;var r=e.nodes&&e.nodes.t;if(r!==null)for(let e of r)(e.is_global||n)&&t.push(e);for(var i=e.first;i!==null;){var a=i.next;if(!(i.f&64)){var o=(i.f&65536)!=0||(i.f&32)!=0&&(e.f&16)!=0;Wn(i,t,o?n:!1)}i=a}}}function Gn(e){Kn(e,!0)}function Kn(e,t){if(e.f&8192){e.f^=b,e.f&1024||(tt(e,v),Lt.ensure().schedule(e));for(var n=e.first;n!==null;){var r=n.next,i=(n.f&65536)!=0||(n.f&32)!=0;Kn(n,i?t:!1),n=r}var a=e.nodes&&e.nodes.t;if(a!==null)for(let e of a)(e.is_global||t)&&e.in()}}function qn(e,t){if(e.nodes)for(var n=e.nodes.start,r=e.nodes.end;n!==null;){var i=n===r?null:pn(n);t.append(n),n=i}}var Jn=null,Yn=!1,Xn=!1;function Zn(e){Xn=e}var Qn=null,$n=!1;function er(e){Qn=e}var tr=null;function nr(e){tr=e}var rr=null;function ir(e){Qn!==null&&(!Re||Qn.f&2)&&(rr??=new Set).add(e)}var ar=null,or=0,sr=null;function cr(e){sr=e}var lr=1,ur=0,dr=ur;function fr(e){dr=e}function pr(){return++lr}function mr(e){var t=e.f;if(t&2048)return!0;if(t&2&&(e.f&=~O),t&4096){for(var n=e.deps,r=n.length,i=0;ie.wv)return!0}t&512&&kt===null&&tt(e,_)}return!1}function hr(e,t,n=!0){var r=e.reactions;if(r!==null&&!(!Re&&rr!==null&&rr.has(e)))for(var i=0;i{e.ac.abort(se)}),e.ac=null);try{e.f|=k;var u=e.fn,d=u();e.f|=S;var f=e.deps,p=Dt?.is_fork;if(ar!==null){var m;if(p||vr(e,or),f!==null&&or>0)for(f.length=or+ar.length,m=0;m{requestAnimationFrame(()=>e()),setTimeout(()=>e())});await Promise.resolve(),Rt()}function U(e){var t=(e.f&2)!=0;if(Jn?.add(e),Qn!==null&&!$n&&!(tr!==null&&tr.f&16384)&&(rr===null||!rr.has(e))){var r=Qn.deps;if(Qn.f&2097152)e.rv{e.isConnected&&e.dispatchEvent(t)}))}function Rr(e,t,n,r={}){function i(e){if(r.capture||Hr.call(t,e),!e.cancelBubble)return xn(()=>n?.call(this,e))}return e.startsWith(`pointer`)||e.startsWith(`touch`)||e===`wheel`?Xe(()=>{t.addEventListener(e,i,r)}):t.addEventListener(e,i,r),i}function zr(e,t,n,r,i){var a={capture:r,passive:i},o=Rr(e,t,n,a);(t===document.body||t===window||t===document||t instanceof HTMLMediaElement)&&Dn(()=>{t.removeEventListener(e,o,a)})}function W(e,t,n){(t[Pr]??={})[e]=n}function Br(e){for(var t=0;t{throw e});throw p}}finally{e[Pr]=t,delete e.currentTarget,er(d),nr(f)}}}var Ur=globalThis?.window?.trustedTypes&&globalThis.window.trustedTypes.createPolicy(`svelte-trusted-html`,{createHTML:e=>e});function Wr(e){return Ur?.createHTML(e)??e}function Gr(e){var t=gn(`template`);return t.innerHTML=Wr(e.replaceAll(``,``)),t.content}function Kr(e,t){var n=tr;n.nodes===null&&(n.nodes={start:e,end:t,a:null,t:null})}function G(e,t){var n=(t&1)!=0,r=(t&2)!=0,i,a=!e.startsWith(``);return()=>{if(P)return Kr(ke,null),ke;i===void 0&&(i=Gr(a?e:``+e),n||(i=fn(i)));var t=r||sn?document.importNode(i,!0):i.cloneNode(!0);if(n){var o=fn(t),s=t.lastChild;Kr(o,s)}else Kr(t,t);return t}}function qr(e,t,n=`svg`){var r=!e.startsWith(``),i=(t&1)!=0,a=`<${n}>${r?e:``+e}`,o;return()=>{if(P)return Kr(ke,null),ke;if(!o){var e=fn(Gr(a));if(i)for(o=document.createDocumentFragment();fn(e);)o.appendChild(fn(e));else o=fn(e)}var t=o.cloneNode(!0);if(i){var n=fn(t),r=t.lastChild;Kr(n,r)}else Kr(t,t);return t}}function Jr(e,t){return qr(e,t,`svg`)}function Yr(e=``){if(!P){var t=dn(e+``);return Kr(t,t),t}var n=ke;return n.nodeType===3?_n(n):(n.before(n=dn()),Ae(n)),Kr(n,n),n}function Xr(){if(P)return Kr(ke,null),ke;var e=document.createDocumentFragment(),t=document.createComment(``),n=dn();return e.append(t,n),Kr(t,n),e}function K(e,t){if(P){var n=tr;(!(n.f&32768)||n.nodes.end===null)&&(n.nodes.end=ke),je();return}e!==null&&e.before(t)}function q(e,t){var n=t==null?``:typeof t==`object`?`${t}`:t;n!==(e[ae]??=e.nodeValue)&&(e[ae]=n,e.nodeValue=`${n}`)}function Zr(e,t){return $r(e,t)}var Qr=new Map;function $r(e,{target:t,anchor:n,props:i={},events:a,context:o,intro:s=!0,transformError:c}){un();var l=void 0,u=An(()=>{var s=n??t.appendChild(dn());ut(s,{pending:()=>{}},t=>{Ue({});var n=Be;if(o&&(n.c=o),a&&(i.$$events=a),P&&Kr(t,null),l=e(t,i)||{},P&&(tr.nodes.end=ke,ke===null||ke.nodeType!==8||ke.data!==`]`))throw Te(),be;We()},c);var u=new Set,d=e=>{for(var n=0;n{for(var e of u)for(let n of[t,document]){var r=Qr.get(n),i=r.get(e);--i==0?(n.removeEventListener(e,Hr),r.delete(e),r.size===0&&Qr.delete(n)):r.set(e,i)}Ir.delete(d),s!==n&&s.parentNode?.removeChild(s)}});return ei.set(l,u),l}var ei=new WeakMap,ti=class{anchor;#e=new Map;#t=new Map;#n=new Map;#r=new Set;#i=!0;constructor(e,t=!0){this.anchor=e,this.#i=t}#a=e=>{if(this.#e.has(e)){var t=this.#e.get(e),n=this.#t.get(t);if(n)Gn(n),this.#r.delete(t);else{var r=this.#n.get(t);r&&(Gn(r.effect),this.#t.set(t,r.effect),this.#n.delete(t),r.fragment.lastChild.remove(),this.anchor.before(r.fragment),n=r.effect)}for(let[t,n]of this.#e){if(this.#e.delete(t),t===e)break;let r=this.#n.get(n);r&&(Bn(r.effect),this.#n.delete(n))}for(let[e,r]of this.#t){if(e===t||this.#r.has(e))continue;let i=()=>{if(Array.from(this.#e.values()).includes(e)){var t=document.createDocumentFragment();qn(r,t),t.append(dn()),this.#n.set(e,{effect:r,fragment:t})}else Bn(r);this.#r.delete(e),this.#t.delete(e)};this.#i||!n?(this.#r.add(e),Un(r,i,!1)):i()}}};#o=e=>{this.#e.delete(e);let t=Array.from(this.#e.values());for(let[e,n]of this.#n)t.includes(e)||(Bn(n.effect),this.#n.delete(e))};ensure(e,t){var n=Dt,r=hn();if(t&&!this.#t.has(e)&&!this.#n.has(e))if(r){var i=document.createDocumentFragment(),a=dn();i.append(a),this.#n.set(e,{effect:In(()=>t(a)),fragment:i})}else this.#t.set(e,In(()=>t(this.anchor)));if(this.#e.set(n,e),r){for(let[t,r]of this.#t)t===e?n.unskip_effect(r):n.skip_effect(r);for(let[t,r]of this.#n)t===e?n.unskip_effect(r.effect):n.skip_effect(r.effect);n.oncommit(this.#a),n.ondiscard(this.#o)}else P&&(this.anchor=ke),this.#a(n)}};function J(e,t,n=!1){var r;P&&(r=ke,je());var i=new ti(e),a=n?w:0;function o(e,t){if(P){var n=Pe(r);if(e!==parseInt(n.substring(1))){var a=Ne();Ae(a),i.anchor=a,Oe(!1),i.ensure(e,t),Oe(!0);return}}i.ensure(e,t)}Pn(()=>{var e=!1;t((t,n=0)=>{e=!0,o(n,t)}),e||o(-1,null)},a)}var ni=Symbol(`NaN`);function ri(e,t,n){P&&je();var r=new ti(e),i=!Ge();Pn(()=>{var e=t();e!==e&&(e=ni),i&&typeof e==`object`&&e&&(e={}),r.ensure(e,n)})}function ii(e,t){return t}function ai(e,t,n){for(var i=[],a=t.length,o,s=t.length,c=0;c{if(o){if(o.pending.delete(n),o.done.add(n),o.pending.size===0){var t=e.outrogroups;oi(e,r(o.done)),t.delete(o),t.size===0&&(e.outrogroups=null)}}else--s},!1)}if(s===0){var l=i.length===0&&n!==null;if(l){var u=n,d=u.parentNode;mn(d),d.append(u),e.items.clear()}oi(e,t,!l)}else o={pending:new Set(t),done:new Set},(e.outrogroups??=new Set).add(o)}function oi(e,t,n=!0){var r;if(e.pending.size>0){r=new Set;for(let t of e.pending.values())for(let n of t)r.add(e.items.get(n).e)}for(var i=0;i{var t=i();return e(t)?t:t==null?[]:r(t)}),p,m=new Map,h=!0;function g(e){v.effect.f&16384||(v.pending.delete(e),v.fallback=d,li(v,p,c,n,a),d!==null&&(p.length===0?d.f&33554432?(d.f^=D,di(d,null,c)):Gn(d):Un(d,()=>{d=null})))}function _(e){v.pending.delete(e)}var v={effect:Pn(()=>{p=U(f);var e=p.length;let t=!1;P&&Pe(c)===`[!`!=(e===0)&&(c=Ne(),Ae(c),Oe(!1),t=!0);for(var r=new Set,u=Dt,v=hn(),y=0;ys(c)):(d=In(()=>s(si??=dn())),d.f|=D)),e>r.size&&ue(``,``,``),P&&e>0&&Ae(Ne()),!h)if(m.set(u,r),v){for(let[e,t]of l)r.has(e)||u.skip_effect(t.e);u.oncommit(g),u.ondiscard(_)}else g(u);t&&Oe(!0),U(f)}),flags:n,items:l,pending:m,outrogroups:null,fallback:d};h=!1,P&&(c=ke)}function ci(e){for(;e!==null&&!(e.f&32);)e=e.next;return e}function li(e,t,n,i,a){var o=(i&8)!=0,s=t.length,c=e.items,l=ci(e.effect.first),u,d=null,f,p=[],m=[],h,g,_,v;if(o)for(v=0;v0){var E=i&4&&s===0?n:null;if(o){for(v=0;v{if(f!==void 0)for(_ of f)_.nodes?.a?.apply()})}function ui(e,t,n,r,i,a,o,s){var c=o&1?o&16?Xt(n):Zt(n,!1,!1):null,l=o&2?Xt(i):null;return{v:c,i:l,e:In(()=>(a(t,c??n,l??i,s),()=>{e.delete(r)}))}}function di(e,t,n){if(e.nodes)for(var r=e.nodes.start,i=e.nodes.end,a=t&&!(t.f&33554432)?t.nodes.start:n;r!==null;){var o=pn(r);if(a.before(r),r===i)return;r=o}}function fi(e,t,n){t===null?e.effect.first=n:t.next=n,n===null?e.effect.last=t:n.prev=t}function pi(e,t,...n){var r=new ti(e);Pn(()=>{let e=t()??null;r.ensure(e,e&&(t=>e(t,...n)))},w)}function mi(e,t,n){var r;P&&(r=ke,je());var i=new ti(e);Pn(()=>{var e=t()??null;if(P&&Pe(r)===`[`!=(e!==null)){var a=Ne();Ae(a),i.anchor=a,Oe(!1),i.ensure(e,e&&(t=>n(t,e))),Oe(!0);return}i.ensure(e,e&&(t=>n(t,e)))},w)}function hi(e,t,n,r,i,a){let o=P;P&&je();var s=null;P&&ke.nodeType===1&&(s=ke,je());var c=P?ke:e,l=new ti(c,!1);Pn(()=>{let e=t()||null;var a=i?i():n||e===`svg`?Ce:void 0;if(e===null){l.ensure(null,null);return}return l.ensure(e,t=>{if(e){if(s=P?s:gn(e,a),Kr(s,s),r){var n=null;P&&Nr(e)&&s.append(n=document.createComment(``));var i=P?fn(s):s.appendChild(dn());P&&(i===null?Oe(!1):Ae(i)),r(s,i),n?.remove()}tr.nodes.end=s,t.before(s)}P&&Ae(t)}),()=>{}},w),Dn(()=>{}),o&&(Oe(!0),Ae(c))}function gi(e,t){var n=void 0,r;Fn(()=>{n!==(n=t())&&(r&&=(Bn(r),null),n&&(r=In(()=>{jn(()=>n(e))})))})}function _i(e){var t,n,r=``;if(typeof e==`string`||typeof e==`number`)r+=e;else if(typeof e==`object`)if(Array.isArray(e)){var i=e.length;for(t=0;t=0;){var s=o+a;(o===0||bi.includes(r[o-1]))&&(s===r.length||bi.includes(r[s]))?r=(o===0?``:r.substring(0,o))+r.substring(s+1):o=s}}return r===``?null:r}function Si(e,t=!1){var n=t?` !important;`:`;`,r=``;for(var i of Object.keys(e)){var a=e[i];a!=null&&a!==``&&(r+=` `+i+`: `+a+n)}return r}function Ci(e){return e[0]!==`-`||e[1]!==`-`?e.toLowerCase():e}function wi(e,t){if(t){var n=``,r,i;if(Array.isArray(t)?(r=t[0],i=t[1]):r=t,e){e=String(e).replaceAll(/\s*\/\*.*?\*\/\s*/g,``).trim();var a=!1,o=0,s=!1,c=[];r&&c.push(...Object.keys(r).map(Ci)),i&&c.push(...Object.keys(i).map(Ci));var l=0,u=-1;let t=e.length;for(var d=0;d{Ei(e,e.__value)});t.observe(e,{childList:!0,subtree:!0,attributes:!0,attributeFilter:[`value`]}),Dn(()=>{t.disconnect()})}function Oi(e,t,n=t){var r=new WeakSet,i=!0;Sn(e,`change`,t=>{var i=t?`[selected]`:`:checked`,a;if(e.multiple)a=[].map.call(e.querySelectorAll(i),ki);else{var o=e.querySelector(i)??e.querySelector(`option:not([disabled])`);a=o&&ki(o)}n(a),e.__value=a,Dt!==null&&r.add(Dt)}),jn(()=>{var a=t();if(e===document.activeElement){var o=Re?Ot:Dt;if(r.has(o))return}if(Ei(e,a,i),i&&a===void 0){var s=e.querySelector(`:checked`);s!==null&&(a=ki(s),n(a))}e.__value=a,i=!1}),Di(e)}function ki(e){return`__value`in e?e.__value:e.value}var Ai=Symbol(`class`),ji=Symbol(`style`),Mi=Symbol(`is custom element`),Ni=Symbol(`is html`),Pi=N?`link`:`LINK`,Fi=N?`input`:`INPUT`,Ii=N?`option`:`OPTION`,Li=N?`select`:`SELECT`,Ri=N?`progress`:`PROGRESS`;function zi(e){if(P){var t=!1,n=()=>{if(!t){if(t=!0,e.hasAttribute(`value`)){var n=e.value;Q(e,`value`,null),e.value=n}if(e.hasAttribute(`checked`)){var r=e.checked;Q(e,`checked`,null),e.checked=r}}};e[oe]=n,Xe(n),bn()}}function Bi(e,t){var n=Wi(e);n.value===(n.value=t??void 0)||e.value===t&&(t!==0||e.nodeName!==Ri)||(e.value=t??``)}function Vi(e,t){t?e.hasAttribute(`selected`)||e.setAttribute(`selected`,``):e.removeAttribute(`selected`)}function Q(e,t,n,r){var i=Wi(e);P&&(i[t]=e.getAttribute(t),t===`src`||t===`srcset`||t===`href`&&e.nodeName===Pi)||i[t]!==(i[t]=n)&&(t===`loading`&&(e[ne]=n),n==null?e.removeAttribute(t):typeof n!=`string`&&Ki(e).includes(t)?e[t]=n:e.setAttribute(t,n))}function Hi(e,t,n,r,i=!1,a=!1){if(P&&i&&e.nodeName===Fi){var o=e;(o.type===`checkbox`?`defaultChecked`:`defaultValue`)in n||zi(o)}var s=Wi(e),c=s[Mi],l=!s[Ni];let u=P&&c;u&&Oe(!1);var d=t||{},f=e.nodeName===Ii;for(var p in t)p in n||(n[p]=null);n.class?n.class=yi(n.class):(r||n[Ai])&&(n.class=null),n[ji]&&(n.style??=null);var m=Ki(e);if(e.nodeName===Fi&&`type`in n&&(`value`in n||`__value`in n)){var h=n.type;(h!==d.type||h===void 0&&e.hasAttribute(`type`))&&(d.type=h,Q(e,`type`,h,a))}for(let i in n){let o=n[i];if(f&&i===`value`&&o==null){e.value=e.__value=``,d[i]=o;continue}if(i===`class`){X(e,e.namespaceURI===`http://www.w3.org/1999/xhtml`,o,r,t?.[Ai],n[Ai]),d[i]=o,d[Ai]=n[Ai];continue}if(i===`style`){Z(e,o,t?.[ji],n[ji]),d[i]=o,d[ji]=n[ji];continue}var g=d[i];if(!(o===g&&!(o===void 0&&e.hasAttribute(i)))){d[i]=o;var _=i[0]+i[1];if(_!==`$$`)if(_===`on`){let t={},n=`$$`+i,r=i.slice(2);var v=Er(r);if(wr(r)&&(r=r.slice(0,-7),t.capture=!0),!v&&g){if(o!=null)continue;e.removeEventListener(r,d[n],t),d[n]=null}if(v)W(r,e,o),Br([r]);else if(o!=null){function a(e){d[i].call(this,e)}d[n]=Rr(r,e,a,t)}}else if(i===`style`)Q(e,i,o);else if(i===`autofocus`)vn(e,!!o);else if(!c&&(i===`__value`||i===`value`&&o!=null))e.value=e.__value=o;else if(i===`selected`&&f)Vi(e,o);else{var y=i;l||(y=kr(y));var b=y===`defaultValue`||y===`defaultChecked`;if(o==null&&!c&&!b)if(s[i]=null,y===`value`||y===`checked`){let n=e,r=t===void 0;if(y===`value`){let e=n.defaultValue;n.removeAttribute(y),n.defaultValue=e,n.value=n.__value=r?e:null}else{let e=n.defaultChecked;n.removeAttribute(y),n.defaultChecked=e,n.checked=r?e:!1}}else e.removeAttribute(i);else b||m.includes(y)&&(c||typeof o!=`string`)?(e[y]=o,y in s&&(s[y]=xe)):typeof o!=`function`&&Q(e,y,o,a)}}}return u&&Oe(!0),d}function Ui(e,t,n=[],r=[],i=[],a,o=!1,s=!1){ft(i,n,r,n=>{var r=void 0,i={},c=e.nodeName===Li,l=!1;if(Fn(()=>{var u=t(...n.map(U)),d=Hi(e,r,u,a,o,s);l&&c&&`value`in u&&Ei(e,u.value);for(let e of Object.getOwnPropertySymbols(i))u[e]||Bn(i[e]);for(let t of Object.getOwnPropertySymbols(u)){var f=u[t];t.description===`@attach`&&(!r||f!==r[t])&&(i[t]&&Bn(i[t]),i[t]=In(()=>gi(e,()=>f))),d[t]=f}r=d}),c){var u=e;jn(()=>{Ei(u,r.value,!0),Di(u)})}l=!0})}function Wi(e){return e[M]??={[Mi]:e.nodeName.includes(`-`),[Ni]:e.namespaceURI===Se}}var Gi=new Map;function Ki(e){var t=e.getAttribute(`is`)||e.nodeName,n=Gi.get(t);if(n)return n;Gi.set(t,n=[]);for(var r,i=e,a=Element.prototype;a!==i;){for(var s in r=o(i),r)r[s].set&&s!==`innerHTML`&&s!==`textContent`&&s!==`innerText`&&n.push(s);i=l(i)}return n}function qi(e,t,n=t){var r=new WeakSet;Sn(e,`input`,async i=>{var a=i?e.defaultValue:e.value;if(a=Yi(e)?Xi(a):a,n(a),Dt!==null&&r.add(Dt),await br(),a!==(a=t())){var o=e.selectionStart,s=e.selectionEnd,c=e.value.length;if(e.value=a??``,s!==null){var l=e.value.length;o===s&&s===c&&l>c?(e.selectionStart=l,e.selectionEnd=l):(e.selectionStart=o,e.selectionEnd=Math.min(s,l))}}}),(P&&e.defaultValue!==e.value||Cr(t)==null&&e.value)&&(n(Yi(e)?Xi(e.value):e.value),Dt!==null&&r.add(Dt)),Nn(()=>{var n=t();if(e===document.activeElement){var i=Re?Ot:Dt;if(r.has(i))return}Yi(e)&&n===Xi(e.value)||e.type===`date`&&!n&&!e.value||n!==e.value&&(e.value=n??``)})}function Ji(e,t,n=t){Sn(e,`change`,t=>{n(t?e.defaultChecked:e.checked)}),(P&&e.defaultChecked!==e.checked||Cr(t)==null)&&n(e.checked),Nn(()=>{e.checked=!!t()})}function Yi(e){var t=e.type;return t===`number`||t===`range`}function Xi(e){return e===``?null:+e}function Zi(e,t){return e===t||e?.[j]===t}function Qi(e={},t,n,r){var i=Be.r,a=tr;return jn(()=>{var o,s;return Nn(()=>{o=s,s=r?.()||[],Cr(()=>{Zi(n(...s),e)||(t(e,...s),o&&Zi(n(...o),e)&&t(null,...o))})}),()=>{let r=a;for(;r!==i&&r.parent!==null&&r.parent.f&33554432;)r=r.parent;let o=()=>{s&&Zi(n(...s),e)&&t(null,...s)},c=r.teardown;r.teardown=()=>{o(),c?.()}}}),e}var $i={get(e,t){if(!e.exclude.has(t))return e.props[t]},set(e,t){return!1},getOwnPropertyDescriptor(e,t){if(!e.exclude.has(t)&&t in e.props)return{enumerable:!0,configurable:!0,value:e.props[t]}},has(e,t){return e.exclude.has(t)?!1:t in e.props},ownKeys(e){return Reflect.ownKeys(e.props).filter(t=>!e.exclude.has(t))}};function ea(e,t,n){return new Proxy({props:e,exclude:t},$i)}var ta={get(e,t){let n=e.props.length;for(;n--;){let r=e.props[n];if(d(r)&&(r=r()),typeof r==`object`&&r&&t in r)return r[t]}},set(e,t,n){let r=e.props.length;for(;r--;){let i=e.props[r];d(i)&&(i=i());let o=a(i,t);if(o&&o.set)return o.set(n),!0}return!1},getOwnPropertyDescriptor(e,t){let n=e.props.length;for(;n--;){let r=e.props[n];if(d(r)&&(r=r()),typeof r==`object`&&r&&t in r){let e=a(r,t);return e&&!e.configurable&&(e.configurable=!0),e}}},has(e,t){if(t===j||t===te)return!1;for(let n of e.props)if(d(n)&&(n=n()),n!=null&&t in n)return!0;return!1},ownKeys(e){let t=[];for(let n of e.props)if(d(n)&&(n=n()),n){for(let e in n)t.includes(e)||t.push(e);for(let e of Object.getOwnPropertySymbols(n))t.includes(e)||t.push(e)}return t}};function na(...e){return new Proxy({props:e},ta)}function ra(e,t,n,r){var i=!ze||(n&2)!=0,o=(n&8)!=0,s=(n&16)!=0,c=r,l=!0,u=void 0,d=()=>s&&i?(u??=gt(r),U(u)):(l&&(l=!1,c=s?Cr(r):r),c);let f;if(o){var p=j in e||te in e;f=a(e,t)?.set??(p&&t in e?n=>e[t]=n:void 0)}var m,h=!1;o?[m,h]=st(()=>e[t]):m=e[t],m===void 0&&r!==void 0&&(m=d(),f&&(i&&he(t),f(m)));var g=i?()=>{var n=e[t];return n===void 0?d():(l=!0,n)}:()=>{var n=e[t];return n!==void 0&&(c=void 0),n===void 0?c:n};if(i&&!(n&4))return g;if(f){var _=e.$$legacy;return(function(e,t){return arguments.length>0?((!i||!t||_||h)&&f(t?g():e),e):g()})}var v=!1,y=(n&1?gt:yt)(()=>(v=!1,g()));o&&U(y);var b=tr;return(function(e,t){if(arguments.length>0){let n=t?U(y):i&&o?nn(e):e;return R(y,n),v=!0,c!==void 0&&(c=n),e}return Xn&&v||b.f&16384?y.v:U(y)})}function ia(e){Be===null&&ce(`onMount`),ze&&Be.l!==null?aa(Be).m.push(e):On(()=>{let t=Cr(e);if(typeof t==`function`)return t})}function aa(e){var t=e.l;return t.u??={a:[],b:[],m:[]}}typeof window<`u`&&((window.__svelte??={}).v??=new Set).add(`5`);var oa={xmlns:`http://www.w3.org/2000/svg`,width:24,height:24,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":2,"stroke-linecap":`round`,"stroke-linejoin":`round`},sa=e=>{for(let t in e)if(t.startsWith(`aria-`)||t===`role`||t===`title`)return!0;return!1},ca=Symbol(`lucide-context`),la=()=>He(ca),ua=new Set([`$$slots`,`$$events`,`$$legacy`,`name`,`color`,`size`,`strokeWidth`,`absoluteStrokeWidth`,`iconNode`,`children`]),da=Jr(``);function fa(e,t){Ue(t,!0);let n=la()??{},r=ra(t,`color`,19,()=>n.color??`currentColor`),i=ra(t,`size`,19,()=>n.size??24),a=ra(t,`strokeWidth`,19,()=>n.strokeWidth??2),o=ra(t,`absoluteStrokeWidth`,19,()=>n.absoluteStrokeWidth??!1),s=ra(t,`iconNode`,19,()=>[]),c=ea(t,ua),l=I(()=>o()?Number(a())*24/Number(i()):a());var u=da();Ui(u,e=>({...oa,...e,...c,width:i(),height:i(),stroke:r(),"stroke-width":U(l),class:[`lucide-icon lucide`,n.class,t.name&&`lucide-${t.name}`,t.class]}),[()=>!t.children&&!sa(c)&&{"aria-hidden":`true`}]);var d=z(u);Y(d,17,s,ii,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=Xr();hi(B(a),r,!0,(e,t)=>{Ui(e,()=>({...i()}))}),K(e,a)}),pi(V(d),()=>t.children??f),F(u),K(e,u),We()}var pa=new Set([`$$slots`,`$$events`,`$$legacy`]);function ma(e,t){let n=ea(t,pa),r=[[`path`,{d:`M10 22V7a1 1 0 0 0-1-1H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-5a1 1 0 0 0-1-1H2`}],[`rect`,{x:`14`,y:`2`,width:`8`,height:`8`,rx:`1`}]];fa(e,na({name:`blocks`},()=>n,{get iconNode(){return r}}))}var ha=new Set([`$$slots`,`$$events`,`$$legacy`]);function ga(e,t){let n=ea(t,ha),r=[[`path`,{d:`M12 7v14`}],[`path`,{d:`M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z`}]];fa(e,na({name:`book-open`},()=>n,{get iconNode(){return r}}))}var _a=new Set([`$$slots`,`$$events`,`$$legacy`]);function va(e,t){let n=ea(t,_a),r=[[`path`,{d:`M20 6 9 17l-5-5`}]];fa(e,na({name:`check`},()=>n,{get iconNode(){return r}}))}var ya=new Set([`$$slots`,`$$events`,`$$legacy`]);function ba(e,t){let n=ea(t,ya),r=[[`path`,{d:`m9 18 6-6-6-6`}]];fa(e,na({name:`chevron-right`},()=>n,{get iconNode(){return r}}))}var xa=new Set([`$$slots`,`$$events`,`$$legacy`]);function Sa(e,t){let n=ea(t,xa),r=[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}],[`path`,{d:`M12 3v18`}]];fa(e,na({name:`columns-2`},()=>n,{get iconNode(){return r}}))}var Ca=new Set([`$$slots`,`$$events`,`$$legacy`]);function wa(e,t){let n=ea(t,Ca),r=[[`path`,{d:`M15.536 11.293a1 1 0 0 0 0 1.414l2.376 2.377a1 1 0 0 0 1.414 0l2.377-2.377a1 1 0 0 0 0-1.414l-2.377-2.377a1 1 0 0 0-1.414 0z`}],[`path`,{d:`M2.297 11.293a1 1 0 0 0 0 1.414l2.377 2.377a1 1 0 0 0 1.414 0l2.377-2.377a1 1 0 0 0 0-1.414L6.088 8.916a1 1 0 0 0-1.414 0z`}],[`path`,{d:`M8.916 17.912a1 1 0 0 0 0 1.415l2.377 2.376a1 1 0 0 0 1.414 0l2.377-2.376a1 1 0 0 0 0-1.415l-2.377-2.376a1 1 0 0 0-1.414 0z`}],[`path`,{d:`M8.916 4.674a1 1 0 0 0 0 1.414l2.377 2.376a1 1 0 0 0 1.414 0l2.377-2.376a1 1 0 0 0 0-1.414l-2.377-2.377a1 1 0 0 0-1.414 0z`}]];fa(e,na({name:`component`},()=>n,{get iconNode(){return r}}))}var Ta=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ea(e,t){let n=ea(t,Ta),r=[[`rect`,{width:`14`,height:`14`,x:`8`,y:`8`,rx:`2`,ry:`2`}],[`path`,{d:`M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2`}]];fa(e,na({name:`copy`},()=>n,{get iconNode(){return r}}))}var Da=new Set([`$$slots`,`$$events`,`$$legacy`]);function Oa(e,t){let n=ea(t,Da),r=[[`path`,{d:`M12 15V3`}],[`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`}],[`path`,{d:`m7 10 5 5 5-5`}]];fa(e,na({name:`download`},()=>n,{get iconNode(){return r}}))}var ka=new Set([`$$slots`,`$$events`,`$$legacy`]);function Aa(e,t){let n=ea(t,ka),r=[[`path`,{d:`M15 3h6v6`}],[`path`,{d:`M10 14 21 3`}],[`path`,{d:`M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6`}]];fa(e,na({name:`external-link`},()=>n,{get iconNode(){return r}}))}var ja=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ma(e,t){let n=ea(t,ja),r=[[`path`,{d:`M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0`}],[`circle`,{cx:`12`,cy:`12`,r:`3`}]];fa(e,na({name:`eye`},()=>n,{get iconNode(){return r}}))}var Na=new Set([`$$slots`,`$$events`,`$$legacy`]);function Pa(e,t){let n=ea(t,Na),r=[[`path`,{d:`m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2`}]];fa(e,na({name:`folder-open`},()=>n,{get iconNode(){return r}}))}var Fa=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ia(e,t){let n=ea(t,Fa),r=[[`path`,{d:`M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z`}],[`path`,{d:`M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12`}],[`path`,{d:`M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17`}]];fa(e,na({name:`layers`},()=>n,{get iconNode(){return r}}))}var La=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ra(e,t){let n=ea(t,La),r=[[`path`,{d:`M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71`}],[`path`,{d:`M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71`}]];fa(e,na({name:`link`},()=>n,{get iconNode(){return r}}))}var za=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ba(e,t){let n=ea(t,za),r=[[`path`,{d:`M3 5h.01`}],[`path`,{d:`M3 12h.01`}],[`path`,{d:`M3 19h.01`}],[`path`,{d:`M8 5h13`}],[`path`,{d:`M8 12h13`}],[`path`,{d:`M8 19h13`}]];fa(e,na({name:`list`},()=>n,{get iconNode(){return r}}))}var Va=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ha(e,t){let n=ea(t,Va),r=[[`rect`,{width:`20`,height:`14`,x:`2`,y:`3`,rx:`2`}],[`line`,{x1:`8`,x2:`16`,y1:`21`,y2:`21`}],[`line`,{x1:`12`,x2:`12`,y1:`17`,y2:`21`}]];fa(e,na({name:`monitor`},()=>n,{get iconNode(){return r}}))}var Ua=new Set([`$$slots`,`$$events`,`$$legacy`]);function Wa(e,t){let n=ea(t,Ua),r=[[`path`,{d:`M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401`}]];fa(e,na({name:`moon`},()=>n,{get iconNode(){return r}}))}var Ga=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ka(e,t){let n=ea(t,Ga),r=[[`path`,{d:`M11 21.73a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73z`}],[`path`,{d:`M12 22V12`}],[`polyline`,{points:`3.29 7 12 12 20.71 7`}],[`path`,{d:`m7.5 4.27 9 5.15`}]];fa(e,na({name:`package`},()=>n,{get iconNode(){return r}}))}var qa=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ja(e,t){let n=ea(t,qa),r=[[`path`,{d:`M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z`}],[`circle`,{cx:`13.5`,cy:`6.5`,r:`.5`,fill:`currentColor`}],[`circle`,{cx:`17.5`,cy:`10.5`,r:`.5`,fill:`currentColor`}],[`circle`,{cx:`6.5`,cy:`12.5`,r:`.5`,fill:`currentColor`}],[`circle`,{cx:`8.5`,cy:`7.5`,r:`.5`,fill:`currentColor`}]];fa(e,na({name:`palette`},()=>n,{get iconNode(){return r}}))}var Ya=new Set([`$$slots`,`$$events`,`$$legacy`]);function Xa(e,t){let n=ea(t,Ya),r=[[`path`,{d:`M15.39 4.39a1 1 0 0 0 1.68-.474 2.5 2.5 0 1 1 3.014 3.015 1 1 0 0 0-.474 1.68l1.683 1.682a2.414 2.414 0 0 1 0 3.414L19.61 15.39a1 1 0 0 1-1.68-.474 2.5 2.5 0 1 0-3.014 3.015 1 1 0 0 1 .474 1.68l-1.683 1.682a2.414 2.414 0 0 1-3.414 0L8.61 19.61a1 1 0 0 0-1.68.474 2.5 2.5 0 1 1-3.014-3.015 1 1 0 0 0 .474-1.68l-1.683-1.682a2.414 2.414 0 0 1 0-3.414L4.39 8.61a1 1 0 0 1 1.68.474 2.5 2.5 0 1 0 3.014-3.015 1 1 0 0 1-.474-1.68l1.683-1.682a2.414 2.414 0 0 1 3.414 0z`}]];fa(e,na({name:`puzzle`},()=>n,{get iconNode(){return r}}))}var Za=new Set([`$$slots`,`$$events`,`$$legacy`]);function Qa(e,t){let n=ea(t,Za),r=[[`path`,{d:`m15 14 5-5-5-5`}],[`path`,{d:`M20 9H9.5A5.5 5.5 0 0 0 4 14.5A5.5 5.5 0 0 0 9.5 20H13`}]];fa(e,na({name:`redo-2`},()=>n,{get iconNode(){return r}}))}var $a=new Set([`$$slots`,`$$events`,`$$legacy`]);function eo(e,t){let n=ea(t,$a),r=[[`path`,{d:`M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8`}],[`path`,{d:`M21 3v5h-5`}],[`path`,{d:`M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16`}],[`path`,{d:`M8 16H3v5`}]];fa(e,na({name:`refresh-cw`},()=>n,{get iconNode(){return r}}))}var to=new Set([`$$slots`,`$$events`,`$$legacy`]);function no(e,t){let n=ea(t,to),r=[[`path`,{d:`M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`}],[`path`,{d:`M3 3v5h5`}]];fa(e,na({name:`rotate-ccw`},()=>n,{get iconNode(){return r}}))}var ro=new Set([`$$slots`,`$$events`,`$$legacy`]);function io(e,t){let n=ea(t,ro),r=[[`path`,{d:`M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z`}],[`path`,{d:`m14.5 12.5 2-2`}],[`path`,{d:`m11.5 9.5 2-2`}],[`path`,{d:`m8.5 6.5 2-2`}],[`path`,{d:`m17.5 15.5 2-2`}]];fa(e,na({name:`ruler`},()=>n,{get iconNode(){return r}}))}var ao=new Set([`$$slots`,`$$events`,`$$legacy`]);function oo(e,t){let n=ea(t,ao),r=[[`path`,{d:`M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z`}],[`path`,{d:`M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7`}],[`path`,{d:`M7 3v4a1 1 0 0 0 1 1h7`}]];fa(e,na({name:`save`},()=>n,{get iconNode(){return r}}))}var so=new Set([`$$slots`,`$$events`,`$$legacy`]);function co(e,t){let n=ea(t,so),r=[[`circle`,{cx:`18`,cy:`5`,r:`3`}],[`circle`,{cx:`6`,cy:`12`,r:`3`}],[`circle`,{cx:`18`,cy:`19`,r:`3`}],[`line`,{x1:`8.59`,x2:`15.42`,y1:`13.51`,y2:`17.49`}],[`line`,{x1:`15.41`,x2:`8.59`,y1:`6.51`,y2:`10.49`}]];fa(e,na({name:`share-2`},()=>n,{get iconNode(){return r}}))}var lo=new Set([`$$slots`,`$$events`,`$$legacy`]);function uo(e,t){let n=ea(t,lo),r=[[`path`,{d:`M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z`}],[`path`,{d:`m9 12 2 2 4-4`}]];fa(e,na({name:`shield-check`},()=>n,{get iconNode(){return r}}))}var fo=new Set([`$$slots`,`$$events`,`$$legacy`]);function po(e,t){let n=ea(t,fo),r=[[`path`,{d:`M10 5H3`}],[`path`,{d:`M12 19H3`}],[`path`,{d:`M14 3v4`}],[`path`,{d:`M16 17v4`}],[`path`,{d:`M21 12h-9`}],[`path`,{d:`M21 19h-5`}],[`path`,{d:`M21 5h-7`}],[`path`,{d:`M8 10v4`}],[`path`,{d:`M8 12H3`}]];fa(e,na({name:`sliders-horizontal`},()=>n,{get iconNode(){return r}}))}var mo=new Set([`$$slots`,`$$events`,`$$legacy`]);function ho(e,t){let n=ea(t,mo),r=[[`rect`,{width:`14`,height:`20`,x:`5`,y:`2`,rx:`2`,ry:`2`}],[`path`,{d:`M12 18h.01`}]];fa(e,na({name:`smartphone`},()=>n,{get iconNode(){return r}}))}var go=new Set([`$$slots`,`$$events`,`$$legacy`]);function _o(e,t){let n=ea(t,go),r=[[`path`,{d:`M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z`}],[`path`,{d:`M20 2v4`}],[`path`,{d:`M22 4h-4`}],[`circle`,{cx:`4`,cy:`20`,r:`2`}]];fa(e,na({name:`sparkles`},()=>n,{get iconNode(){return r}}))}var vo=new Set([`$$slots`,`$$events`,`$$legacy`]);function yo(e,t){let n=ea(t,vo),r=[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}]];fa(e,na({name:`square`},()=>n,{get iconNode(){return r}}))}var bo=new Set([`$$slots`,`$$events`,`$$legacy`]);function xo(e,t){let n=ea(t,bo),r=[[`circle`,{cx:`12`,cy:`12`,r:`4`}],[`path`,{d:`M12 2v2`}],[`path`,{d:`M12 20v2`}],[`path`,{d:`m4.93 4.93 1.41 1.41`}],[`path`,{d:`m17.66 17.66 1.41 1.41`}],[`path`,{d:`M2 12h2`}],[`path`,{d:`M20 12h2`}],[`path`,{d:`m6.34 17.66-1.41 1.41`}],[`path`,{d:`m19.07 4.93-1.41 1.41`}]];fa(e,na({name:`sun`},()=>n,{get iconNode(){return r}}))}var So=new Set([`$$slots`,`$$events`,`$$legacy`]);function Co(e,t){let n=ea(t,So),r=[[`path`,{d:`M11 17a4 4 0 0 1-8 0V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2Z`}],[`path`,{d:`M16.7 13H19a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2H7`}],[`path`,{d:`M 7 17h.01`}],[`path`,{d:`m11 8 2.3-2.3a2.4 2.4 0 0 1 3.404.004L18.6 7.6a2.4 2.4 0 0 1 .026 3.434L9.9 19.8`}]];fa(e,na({name:`swatch-book`},()=>n,{get iconNode(){return r}}))}var wo=new Set([`$$slots`,`$$events`,`$$legacy`]);function To(e,t){let n=ea(t,wo),r=[[`rect`,{width:`16`,height:`20`,x:`4`,y:`2`,rx:`2`,ry:`2`}],[`line`,{x1:`12`,x2:`12.01`,y1:`18`,y2:`18`}]];fa(e,na({name:`tablet`},()=>n,{get iconNode(){return r}}))}var Eo=new Set([`$$slots`,`$$events`,`$$legacy`]);function Do(e,t){let n=ea(t,Eo),r=[[`path`,{d:`M10 11v6`}],[`path`,{d:`M14 11v6`}],[`path`,{d:`M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6`}],[`path`,{d:`M3 6h18`}],[`path`,{d:`M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2`}]];fa(e,na({name:`trash-2`},()=>n,{get iconNode(){return r}}))}var Oo=new Set([`$$slots`,`$$events`,`$$legacy`]);function ko(e,t){let n=ea(t,Oo),r=[[`path`,{d:`M12 4v16`}],[`path`,{d:`M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2`}],[`path`,{d:`M9 20h6`}]];fa(e,na({name:`type`},()=>n,{get iconNode(){return r}}))}var Ao=new Set([`$$slots`,`$$events`,`$$legacy`]);function jo(e,t){let n=ea(t,Ao),r=[[`path`,{d:`M9 14 4 9l5-5`}],[`path`,{d:`M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11`}]];fa(e,na({name:`undo-2`},()=>n,{get iconNode(){return r}}))}var Mo=new Set([`$$slots`,`$$events`,`$$legacy`]);function No(e,t){let n=ea(t,Mo),r=[[`path`,{d:`M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z`}]];fa(e,na({name:`zap`},()=>n,{get iconNode(){return r}}))}var Po=new Set([`$$slots`,`$$events`,`$$legacy`]);function Fo(e,t){let n=ea(t,Po),r=[[`path`,{d:`M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8`}],[`path`,{d:`M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z`}]];fa(e,na({name:`house`},()=>n,{get iconNode(){return r}}))}var Io=new Set([`$$slots`,`$$events`,`$$legacy`]);function Lo(e,t){let n=ea(t,Io),r=[[`path`,{d:`M21 12a9 9 0 1 1-6.219-8.56`}]];fa(e,na({name:`loader-circle`},()=>n,{get iconNode(){return r}}))}var Ro=new Set([`$$slots`,`$$events`,`$$legacy`]);function zo(e,t){let n=ea(t,Ro),r=[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}],[`path`,{d:`M3 9h18`}],[`path`,{d:`M9 21V9`}]];fa(e,na({name:`panels-top-left`},()=>n,{get iconNode(){return r}}))}var Bo=new Set([`$$slots`,`$$events`,`$$legacy`]);function Vo(e,t){let n=ea(t,Bo),r=[[`path`,{d:`m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3`}],[`path`,{d:`M12 9v4`}],[`path`,{d:`M12 17h.01`}]];fa(e,na({name:`triangle-alert`},()=>n,{get iconNode(){return r}}))}var Ho=`slashed-studio-theme`;function Uo(){try{let e=localStorage.getItem(Ho);return e===`light`||e===`dark`?e:null}catch{return null}}function Wo(){return typeof matchMedia<`u`&&matchMedia(`(prefers-color-scheme: dark)`).matches?`dark`:`light`}var Go=Uo(),Ko=Go===null,qo=nn({value:Go??Wo()}),Jo=null;function Yo(){Jo?.classList.toggle(`dark`,qo.value===`dark`)}function Xo(e){Jo=e,Yo()}function Zo(e){Ko=!1;try{localStorage.setItem(Ho,e)}catch{}qo.value=e,Yo()}function Qo(){Zo(qo.value===`dark`?`light`:`dark`)}function $o(e){Ko=!1,qo.value=e,Yo()}if(typeof matchMedia<`u`){let e=matchMedia(`(prefers-color-scheme: dark)`),t=e=>{Ko&&(qo.value=e.matches?`dark`:`light`,Yo())};typeof e.addEventListener==`function`?e.addEventListener(`change`,t):typeof e.addListener==`function`&&e.addListener(t)}var es=G(``),ts=G(` Saving…`,1),ns=G(` Saved`,1),rs=G(` Save failed`,1),is=G(` Save`,1),as=G(`

`),os=G(`
/
`,1);function ss(e,t){Ue(t,!0);let n=window.__SLASHED_FW_VERSION__===void 0?``:window.__SLASHED_FW_VERSION__,r=L(!1),i=L(!1),a=L(null),o=L(null);On(()=>{U(i)&&br().then(()=>U(a)?.focus())});async function s(){try{await navigator.clipboard.writeText(window.location.href),R(r,!0),setTimeout(()=>{R(r,!1)},2e3)}catch{}}function c(){R(i,!0)}function l(){R(i,!1),t.onResetAll()}function u(){R(i,!1)}var d=os(),f=B(d),p=V(z(f),2),m=z(p),h=V(z(m)),g=z(h);F(h),F(m),Me(2),F(p);var _=V(p,2),v=e=>{var n=es(),r=z(n),i=z(r,!0);F(r),Me(3),F(n),H(()=>q(i,t.overridesCount)),W(`click`,n,function(...e){t.onExport?.apply(this,e)}),K(e,n)};J(_,e=>{t.overridesCount>0&&e(v)});var y=V(_,4),b=z(y),x=z(b),S=e=>{var t=ts();Lo(B(t),{class:`w-3.5 h-3.5 animate-spin`}),Me(),K(e,t)},C=e=>{var t=ns();va(B(t),{class:`w-3.5 h-3.5`}),Me(),K(e,t)},w=e=>{var t=rs();Vo(B(t),{class:`w-3.5 h-3.5`}),Me(),K(e,t)},T=e=>{var t=is();oo(B(t),{class:`w-3.5 h-3.5`}),Me(),K(e,t)};J(x,e=>{t.saveState===`saving`?e(S):t.saveState===`saved`?e(C,1):t.saveState===`error`?e(w,2):e(T,-1)}),F(b);var E=V(b,2);jo(z(E),{class:`w-3.5 h-3.5`}),F(E);var D=V(E,2);Qa(z(D),{class:`w-3.5 h-3.5`}),F(D);var O=V(D,4),k=z(O),A=e=>{va(e,{class:`w-3.5 h-3.5 text-emerald-600 dark:text-emerald-400`})},ee=e=>{co(e,{class:`w-3.5 h-3.5`})};J(k,e=>{U(r)?e(A):e(ee,-1)}),F(O);var j=V(O,2);Pa(z(j),{class:`w-3.5 h-3.5`}),F(j);var te=V(j,2);Do(z(te),{class:`w-3.5 h-3.5`}),F(te);var ne=V(te,4),M=z(ne),re=e=>{xo(e,{class:`w-3.5 h-3.5`})},ie=e=>{Wa(e,{class:`w-3.5 h-3.5`})};J(M,e=>{qo.value===`dark`?e(re):e(ie,-1)}),F(ne),F(y),F(f);var ae=V(f,2),oe=e=>{var n=as(),r=z(n),i=V(z(r),2),s=z(i);F(i);var c=V(i,2),d=z(c);Qi(d,e=>R(a,e),()=>U(a));var f=V(d,2);Qi(f,e=>R(o,e),()=>U(o)),F(c),F(r),F(n),H(()=>q(s,`This will clear all ${t.overridesCount??``} customisation${t.overridesCount===1?``:`s`}. - You can still undo this before saving.`)),W(`click`,n,e=>{e.target===e.currentTarget&&u()}),W(`keydown`,n,e=>{e.key===`Escape`&&(e.stopPropagation(),u()),e.key===`Tab`&&(e.preventDefault(),document.activeElement===U(a)?U(o)?.focus():U(a)?.focus())}),W(`click`,d,u),W(`click`,f,l),K(e,n)};J(ae,e=>{U(i)&&e(oe)}),H(e=>{q(g,`v${n??``}`),b.disabled=!t.hasPendingChanges||t.saveState===`saving`,Q(b,`title`,t.saveState===`error`?`Save failed — click to retry`:t.hasPendingChanges?`Save changes (Ctrl+S)`:`No unsaved changes`),X(b,1,e),E.disabled=!t.canUndo,D.disabled=!t.canRedo,te.disabled=t.overridesCount===0,Q(ne,`title`,qo.value===`dark`?`Switch to light mode`:`Switch to dark mode`),Q(ne,`aria-label`,qo.value===`dark`?`Switch to light mode`:`Switch to dark mode`),Q(ne,`aria-pressed`,qo.value===`dark`)},[()=>yi([`flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[11px] font-bold transition-colors cursor-pointer`,t.saveState===`error`?`bg-red-100 dark:bg-red-900/40 border border-red-500/30 text-red-700 dark:text-red-300`:t.saveState===`saved`?`bg-emerald-100 dark:bg-emerald-900/40 border border-emerald-500/30 text-emerald-700 dark:text-emerald-300`:t.hasPendingChanges?`bg-emerald-600 hover:bg-emerald-500 text-white shadow-sm shadow-emerald-600/30`:`bg-black/5 dark:bg-white/5 text-slate-500 disabled:opacity-40 disabled:pointer-events-none`].join(` `))]),W(`click`,b,function(...e){t.onSave?.apply(this,e)}),W(`click`,E,function(...e){t.onUndo?.apply(this,e)}),W(`click`,D,function(...e){t.onRedo?.apply(this,e)}),W(`click`,O,s),W(`click`,j,function(...e){t.onImport?.apply(this,e)}),W(`click`,te,c),W(`click`,ne,function(...e){Qo?.apply(this,e)}),K(e,d),We()}Br([`click`,`keydown`]);var cs=G(` `),ls=G(``),us=G(``);function ds(e,t){Ue(t,!0);let n=ra(t,`overridesByDomain`,19,()=>({})),r=[{id:`home`,icon:Fo,label:`Home`,group:`tokens`},{id:`colors`,icon:Ja,label:`Colors`,group:`tokens`},{id:`typography`,icon:ko,label:`Typography`,group:`tokens`},{id:`spacing`,icon:io,label:`Spacing`,group:`tokens`},{id:`layout`,icon:zo,label:`Layout`,group:`tokens`},{id:`borders`,icon:yo,label:`Borders`,group:`tokens`},{id:`shadows`,icon:Ia,label:`Shadows`,group:`tokens`},{id:`motion`,icon:No,label:`Motion`,group:`tokens`},{id:`effects`,icon:_o,label:`Effects`,group:`tokens`},{id:`macros`,icon:ma,label:`Macros`,group:`tokens`},{id:`misc`,icon:Xa,label:`Misc`,group:`tokens`},{id:`components`,icon:wa,label:`Components`,group:`tokens`},{id:`themes`,icon:Co,label:`Themes`,group:`tools`},{id:`wcag`,icon:uo,label:`WCAG`,group:`tools`},{id:`setup`,icon:Ka,label:`Install`,group:`tools`},{id:`cheatsheet`,icon:ga,label:`Classes`,group:`tools`}],i=I(()=>r.filter(e=>e.group===`tokens`)),a=I(()=>r.filter(e=>e.group===`tools`));var o=us(),s=z(o);Y(s,21,()=>U(i),e=>e.id,(e,r)=>{let i=I(()=>t.activeId===U(r).id),a=I(()=>n()[U(r).id]||0),o=I(()=>U(r).icon);var s=ls(),c=z(s);mi(c,()=>U(o),(e,t)=>{t(e,{class:`w-4 h-4`})});var l=V(c,2),u=e=>{var t=cs(),n=z(t,!0);F(t),H(()=>q(n,U(a)>9?`+`:U(a))),K(e,t)};J(l,e=>{U(a)>0&&!U(i)&&e(u)});var d=V(l,2),f=z(d,!0);F(d),F(s),H(()=>{Q(s,`title`,U(r).label),X(s,1,`relative w-10 h-10 flex items-center justify-center rounded-xl transition-all cursor-pointer group ${U(i)?`bg-indigo-600 text-white shadow-lg shadow-indigo-600/30`:`text-slate-500 hover:text-slate-800 dark:hover:text-slate-200 hover:bg-black/8 dark:hover:bg-white/8`}`),q(f,U(r).label)}),W(`click`,s,()=>t.onSelect(U(r).id)),K(e,s)}),F(s);var c=V(s,4);Y(c,21,()=>U(a),e=>e.id,(e,r)=>{let i=I(()=>t.activeId===U(r).id),a=I(()=>n()[U(r).id]||0),o=I(()=>U(r).icon);var s=ls(),c=z(s);mi(c,()=>U(o),(e,t)=>{t(e,{class:`w-4 h-4`})});var l=V(c,2),u=e=>{var t=cs(),n=z(t,!0);F(t),H(()=>q(n,U(a)>9?`+`:U(a))),K(e,t)};J(l,e=>{U(a)>0&&!U(i)&&e(u)});var d=V(l,2),f=z(d,!0);F(d),F(s),H(()=>{Q(s,`title`,U(r).label),X(s,1,`relative w-10 h-10 flex items-center justify-center rounded-xl transition-all cursor-pointer group ${U(i)?`bg-indigo-600 text-white shadow-lg shadow-indigo-600/30`:`text-slate-500 hover:text-slate-800 dark:hover:text-slate-200 hover:bg-black/8 dark:hover:bg-white/8`}`),q(f,U(r).label)}),W(`click`,s,()=>t.onSelect(U(r).id)),K(e,s)}),F(c),F(o),K(e,o),We()}Br([`click`]);var fs=G(` `),ps=G(`
Live
`);function ms(e,t){var n=ps(),r=V(z(n),2),i=z(r),a=e=>{var n=fs(),r=z(n);F(n),H(()=>q(r,`${t.overridesCount??``} override${t.overridesCount===1?``:`s`} active`)),K(e,n)},o=e=>{K(e,Yr(`No overrides — showing framework defaults`))};J(i,e=>{t.overridesCount>0?e(a):e(o,-1)}),F(r);var s=V(r,4),c=z(s,!0);F(s),F(n),H(()=>q(c,t.domain)),K(e,n)}var hs=Uint8Array,gs=Uint16Array,_s=Int32Array,vs=new hs([0,0,0,0,0,0,0,0,1,1,1,1,2,2,2,2,3,3,3,3,4,4,4,4,5,5,5,5,0,0,0,0]),ys=new hs([0,0,0,0,1,1,2,2,3,3,4,4,5,5,6,6,7,7,8,8,9,9,10,10,11,11,12,12,13,13,0,0]),bs=new hs([16,17,18,0,8,7,9,6,10,5,11,4,12,3,13,2,14,1,15]),xs=function(e,t){for(var n=new gs(31),r=0;r<31;++r)n[r]=t+=1<>1|(ks&21845)<<1;As=(As&52428)>>2|(As&13107)<<2,As=(As&61680)>>4|(As&3855)<<4,Os[ks]=((As&65280)>>8|(As&255)<<8)>>1}for(var js=(function(e,t,n){for(var r=e.length,i=0,a=new gs(t);i>c]=l}else for(s=new gs(r),i=0;i>15-e[i]);return s}),Ms=new hs(288),ks=0;ks<144;++ks)Ms[ks]=8;for(var ks=144;ks<256;++ks)Ms[ks]=9;for(var ks=256;ks<280;++ks)Ms[ks]=7;for(var ks=280;ks<288;++ks)Ms[ks]=8;for(var Ns=new hs(32),ks=0;ks<32;++ks)Ns[ks]=5;var Ps=js(Ms,9,0),Fs=js(Ms,9,1),Is=js(Ns,5,0),Ls=js(Ns,5,1),Rs=function(e){for(var t=e[0],n=1;nt&&(t=e[n]);return t},zs=function(e,t,n){var r=t/8|0;return(e[r]|e[r+1]<<8)>>(t&7)&n},Bs=function(e,t){var n=t/8|0;return(e[n]|e[n+1]<<8|e[n+2]<<16)>>(t&7)},Vs=function(e){return(e+7)/8|0},Hs=function(e,t,n){return(t==null||t<0)&&(t=0),(n==null||n>e.length)&&(n=e.length),new hs(e.subarray(t,n))},Us=[`unexpected EOF`,`invalid block type`,`invalid length/literal`,`invalid distance`,`stream finished`,`no stream handler`,,`no callback`,`invalid UTF-8 data`,`extra field too long`,`date not in range 1980-2099`,`filename too long`,`stream finishing`,`invalid zip data`],Ws=function(e,t,n){var r=Error(t||Us[e]);if(r.code=e,Error.captureStackTrace&&Error.captureStackTrace(r,Ws),!n)throw r;return r},Gs=function(e,t,n,r){var i=e.length,a=r?r.length:0;if(!i||t.f&&!t.l)return n||new hs(0);var o=!n,s=o||t.i!=2,c=t.i;o&&(n=new hs(i*3));var l=function(e){var t=n.length;if(e>t){var r=new hs(Math.max(t*2,e));r.set(n),n=r}},u=t.f||0,d=t.p||0,f=t.b||0,p=t.l,m=t.d,h=t.m,g=t.n,_=i*8;do{if(!p){u=zs(e,d,1);var v=zs(e,d+1,3);if(d+=3,!v){var y=Vs(d)+4,b=e[y-4]|e[y-3]<<8,x=y+b;if(x>i){c&&Ws(0);break}s&&l(f+b),n.set(e.subarray(y,x),f),t.b=f+=b,t.p=d=x*8,t.f=u;continue}else if(v==1)p=Fs,m=Ls,h=9,g=5;else if(v==2){var S=zs(e,d,31)+257,C=zs(e,d+10,15)+4,w=S+zs(e,d+5,31)+1;d+=14;for(var T=new hs(w),E=new hs(19),D=0;D>4;if(y<16)T[D++]=y;else{var j=0,te=0;for(y==16?(te=3+zs(e,d,3),d+=2,j=T[D-1]):y==17?(te=3+zs(e,d,7),d+=3):y==18&&(te=11+zs(e,d,127),d+=7);te--;)T[D++]=j}}var ne=T.subarray(0,S),M=T.subarray(S);h=Rs(ne),g=Rs(M),p=js(ne,h,1),m=js(M,g,1)}else Ws(1);if(d>_){c&&Ws(0);break}}s&&l(f+131072);for(var re=(1<>4;if(d+=j&15,d>_){c&&Ws(0);break}if(j||Ws(2),oe<256)n[f++]=oe;else if(oe==256){ae=d,p=null;break}else{var se=oe-254;if(oe>264){var D=oe-257,N=vs[D];se=zs(e,d,(1<>4;ce||Ws(3),d+=ce&15;var M=Es[le];if(le>3){var N=ys[le];M+=Bs(e,d)&(1<_){c&&Ws(0);break}s&&l(f+131072);var ue=f+se;if(f>8},qs=function(e,t,n){n<<=t&7;var r=t/8|0;e[r]|=n,e[r+1]|=n>>8,e[r+2]|=n>>16},Js=function(e,t){for(var n=[],r=0;rf&&(f=a[r].s);var p=new gs(f+1),m=Ys(n[u-1],p,0);if(m>t){var r=0,h=0,g=m-t,_=1<t)h+=_-(1<>=g;h>0;){var y=a[r].s;p[y]=0&&h;--r){var b=a[r].s;p[b]==t&&(--p[b],++h)}m=t}return{t:new hs(p),l:m}},Ys=function(e,t,n){return e.s==-1?Math.max(Ys(e.l,t,n+1),Ys(e.r,t,n+1)):t[e.s]=n},Xs=function(e){for(var t=e.length;t&&!e[--t];);for(var n=new gs(++t),r=0,i=e[0],a=1,o=function(e){n[r++]=e},s=1;s<=t;++s)if(e[s]==i&&s!=t)++a;else{if(!i&&a>2){for(;a>138;a-=138)o(32754);a>2&&(o(a>10?a-11<<5|28690:a-3<<5|12305),a=0)}else if(a>3){for(o(i),--a;a>6;a-=6)o(8304);a>2&&(o(a-3<<5|8208),a=0)}for(;a--;)o(i);a=1,i=e[s]}return{c:n.subarray(0,r),n:t}},Zs=function(e,t){for(var n=0,r=0;r>8,e[i+2]=e[i]^255,e[i+3]=e[i+1]^255;for(var a=0;a4&&!E[bs[O-1]];--O);var k=l+5<<3,A=Zs(i,Ms)+Zs(a,Ns)+o,ee=Zs(i,f)+Zs(a,h)+o+14+3*O+Zs(C,E)+2*C[16]+3*C[17]+7*C[18];if(c>=0&&k<=A&&k<=ee)return Qs(t,u,e.subarray(c,c+l));var j,te,ne,M;if(Ks(t,u,1+(ee15&&(Ks(t,u,oe[w]>>5&127),u+=oe[w]>>12)}}else j=Ps,te=Ms,ne=Is,M=Ns;for(var w=0;w255){var se=N>>18&31;qs(t,u,j[se+257]),u+=te[se+257],se>7&&(Ks(t,u,N>>23&31),u+=vs[se]);var ce=N&31;qs(t,u,ne[ce]),u+=M[ce],ce>3&&(qs(t,u,N>>5&8191),u+=ys[ce])}else qs(t,u,j[N]),u+=te[N]}return qs(t,u,j[256]),u+te[256]},ec=new _s([65540,131080,131088,131104,262176,1048704,1048832,2114560,2117632]),tc=new hs(0),nc=function(e,t,n,r,i,a){var o=a.z||e.length,s=new hs(r+o+5*(1+Math.ceil(o/7e3))+i),c=s.subarray(r,s.length-i),l=a.l,u=(a.r||0)&7;if(t){u&&(c[0]=a.r>>3);for(var d=ec[t-1],f=d>>13,p=d&8191,m=(1<7e3||E>24576)&&(j>423||!l)){u=$s(e,c,0,b,x,S,w,E,O,T-O,u),E=C=w=0,O=T;for(var te=0;te<286;++te)x[te]=0;for(var te=0;te<30;++te)S[te]=0}var ne=2,M=0,re=p,ie=A-ee&32767;if(j>2&&k==y(T-ie))for(var ae=Math.min(f,j)-1,oe=Math.min(32767,T),se=Math.min(258,j);ie<=oe&&--re&&A!=ee;){if(e[T+ne]==e[T+ne-ie]){for(var N=0;Nne){if(ne=N,M=ie,N>ae)break;for(var ce=Math.min(ie,N-2),le=0,te=0;tele&&(le=de,ee=ue)}}}A=ee,ee=h[A],ie+=A-ee&32767}if(M){b[E++]=268435456|ws[ne]<<18|Ds[M];var fe=ws[ne]&31,pe=Ds[M]&31;w+=vs[fe]+ys[pe],++x[257+fe],++S[pe],D=T+ne,++C}else b[E++]=e[T],++x[e[T]]}}for(T=Math.max(T,D);T=o&&(c[u/8|0]=l,me=o),u=Qs(c,u+1,e.subarray(T,me))}a.i=o}return Hs(s,0,r+Vs(u)+i)},rc=function(e,t,n,r,i){if(!i&&(i={l:1},t.dictionary)){var a=t.dictionary.subarray(-32768),o=new hs(a.length+e.length);o.set(a),o.set(e,a.length),e=o,i.w=a.length}return nc(e,t.level==null?6:t.level,t.mem==null?i.l?Math.ceil(Math.max(8,Math.min(13,Math.log(e.length)))*1.5):20:12+t.mem,n,r,i)};function ic(e,t){return rc(e,t||{},0,0)}function ac(e,t){return Gs(e,{i:2},t&&t.out,t&&t.dictionary)}var oc=typeof TextDecoder<`u`&&new TextDecoder;try{oc.decode(tc,{stream:!0})}catch{}var sc={_meta:{generatedBy:`scripts/gen-token-registry.js`,nextId:759},tokens:[{id:0,name:`--sf-alternate-gap`},{id:1,name:`--sf-alternate-inner-gap`},{id:2,name:`--sf-animation-blink`},{id:3,name:`--sf-animation-color-pulse`},{id:4,name:`--sf-animation-delay-1`},{id:5,name:`--sf-animation-delay-2`},{id:6,name:`--sf-animation-delay-3`},{id:7,name:`--sf-animation-delay-4`},{id:8,name:`--sf-animation-delay-5`},{id:9,name:`--sf-animation-fade-in`},{id:10,name:`--sf-animation-fade-out`},{id:11,name:`--sf-animation-float`},{id:12,name:`--sf-animation-ping`},{id:13,name:`--sf-animation-scale-down`},{id:14,name:`--sf-animation-scale-up`},{id:15,name:`--sf-animation-shimmer`},{id:16,name:`--sf-animation-slide-in-down`},{id:17,name:`--sf-animation-slide-in-left`},{id:18,name:`--sf-animation-slide-in-right`},{id:19,name:`--sf-animation-slide-in-up`},{id:20,name:`--sf-animation-spin`},{id:21,name:`--sf-aspect`},{id:22,name:`--sf-bento-cols-default`},{id:23,name:`--sf-bento-gap`},{id:24,name:`--sf-bento-row-compact`},{id:25,name:`--sf-bento-row-default`},{id:26,name:`--sf-bento-row-tall`},{id:27,name:`--sf-blur`},{id:28,name:`--sf-body-color`},{id:29,name:`--sf-body-em-style`},{id:30,name:`--sf-body-font-family`},{id:31,name:`--sf-body-font-size`},{id:32,name:`--sf-body-font-weight`},{id:33,name:`--sf-body-line-height`},{id:34,name:`--sf-body-strong-weight`},{id:35,name:`--sf-body-text-wrap`},{id:36,name:`--sf-border`},{id:37,name:`--sf-border-scale`},{id:38,name:`--sf-border-strong`},{id:39,name:`--sf-border-style`},{id:40,name:`--sf-border-subtle`},{id:41,name:`--sf-border-width-1`},{id:42,name:`--sf-border-width-2`},{id:43,name:`--sf-border-width-3`},{id:44,name:`--sf-border-width-4`},{id:45,name:`--sf-border-width-hairline`},{id:46,name:`--sf-box-border-color`},{id:47,name:`--sf-box-border-width`},{id:48,name:`--sf-box-padding`},{id:49,name:`--sf-breakout-width`},{id:50,name:`--sf-button-padding-block`,removed:!0},{id:51,name:`--sf-button-padding-inline`,removed:!0},{id:52,name:`--sf-button-radius`,removed:!0},{id:53,name:`--sf-caret-color`},{id:54,name:`--sf-center-gutter`},{id:55,name:`--sf-center-max`},{id:56,name:`--sf-cluster-align`},{id:57,name:`--sf-cluster-gap`},{id:58,name:`--sf-cluster-justify`},{id:59,name:`--sf-code-font-size`},{id:60,name:`--sf-color-action`},{id:61,name:`--sf-color-action--active`},{id:62,name:`--sf-color-action--hover`},{id:63,name:`--sf-color-action-100`},{id:64,name:`--sf-color-action-200`},{id:65,name:`--sf-color-action-300`},{id:66,name:`--sf-color-action-400`},{id:67,name:`--sf-color-action-50`},{id:68,name:`--sf-color-action-500`},{id:69,name:`--sf-color-action-600`},{id:70,name:`--sf-color-action-700`},{id:71,name:`--sf-color-action-800`},{id:72,name:`--sf-color-action-900`},{id:73,name:`--sf-color-action-950`},{id:74,name:`--sf-color-action-a10`},{id:75,name:`--sf-color-action-a30`},{id:76,name:`--sf-color-action-a5`},{id:77,name:`--sf-color-action-a50`},{id:78,name:`--sf-color-action-a80`},{id:79,name:`--sf-color-action-source-dark`},{id:80,name:`--sf-color-action-darker`},{id:81,name:`--sf-color-action-ghost`},{id:82,name:`--sf-color-action-source-light`},{id:83,name:`--sf-color-action-lighter`},{id:84,name:`--sf-color-action-muted`},{id:85,name:`--sf-color-action-subtle`},{id:86,name:`--sf-color-action-superdark`},{id:87,name:`--sf-color-action-superlight`},{id:88,name:`--sf-color-action-xdark`},{id:89,name:`--sf-color-action-xlight`},{id:90,name:`--sf-color-base`},{id:91,name:`--sf-color-base--active`},{id:92,name:`--sf-color-base--hover`},{id:93,name:`--sf-color-base-100`},{id:94,name:`--sf-color-base-200`},{id:95,name:`--sf-color-base-300`},{id:96,name:`--sf-color-base-400`},{id:97,name:`--sf-color-base-50`},{id:98,name:`--sf-color-base-500`},{id:99,name:`--sf-color-base-600`},{id:100,name:`--sf-color-base-700`},{id:101,name:`--sf-color-base-800`},{id:102,name:`--sf-color-base-900`},{id:103,name:`--sf-color-base-950`},{id:104,name:`--sf-color-base-a10`},{id:105,name:`--sf-color-base-a30`},{id:106,name:`--sf-color-base-a5`},{id:107,name:`--sf-color-base-a50`},{id:108,name:`--sf-color-base-a80`},{id:109,name:`--sf-color-base-source-dark`},{id:110,name:`--sf-color-base-darker`,removed:!0},{id:111,name:`--sf-color-base-ghost`},{id:112,name:`--sf-color-base-source-light`},{id:113,name:`--sf-color-base-lighter`,removed:!0},{id:114,name:`--sf-color-base-muted`},{id:115,name:`--sf-color-base-subtle`},{id:116,name:`--sf-color-base-superdark`,removed:!0},{id:117,name:`--sf-color-base-superlight`,removed:!0},{id:118,name:`--sf-color-base-xdark`,removed:!0},{id:119,name:`--sf-color-base-xlight`,removed:!0},{id:120,name:`--sf-color-bg`},{id:121,name:`--sf-color-bg--active`},{id:122,name:`--sf-color-bg--disabled`},{id:123,name:`--sf-color-bg--focus`},{id:124,name:`--sf-color-bg--hover`},{id:125,name:`--sf-color-bg--selected`},{id:126,name:`--sf-color-black`},{id:127,name:`--sf-color-border`},{id:128,name:`--sf-color-border--disabled`},{id:129,name:`--sf-color-border--focus`},{id:130,name:`--sf-color-border--strong`},{id:131,name:`--sf-color-border--subtle`},{id:132,name:`--sf-color-border--translucent`},{id:133,name:`--sf-color-code-bg`},{id:134,name:`--sf-color-code-text`},{id:135,name:`--sf-color-danger`},{id:136,name:`--sf-color-danger-source-dark`},{id:137,name:`--sf-color-danger-source-light`},{id:138,name:`--sf-color-danger-muted`},{id:139,name:`--sf-color-danger-strong`},{id:140,name:`--sf-color-danger-subtle`},{id:141,name:`--sf-color-dim`},{id:142,name:`--sf-color-error`,removed:!0},{id:143,name:`--sf-color-error-dark`,removed:!0},{id:144,name:`--sf-color-error-light`,removed:!0},{id:145,name:`--sf-color-error-muted`,removed:!0},{id:146,name:`--sf-color-error-strong`,removed:!0},{id:147,name:`--sf-color-error-subtle`,removed:!0},{id:148,name:`--sf-color-heading`},{id:149,name:`--sf-color-info`},{id:150,name:`--sf-color-info-source-dark`},{id:151,name:`--sf-color-info-source-light`},{id:152,name:`--sf-color-info-muted`},{id:153,name:`--sf-color-info-strong`},{id:154,name:`--sf-color-info-subtle`},{id:155,name:`--sf-color-inset`},{id:156,name:`--sf-color-inverse`},{id:157,name:`--sf-color-link`},{id:158,name:`--sf-color-link--active`},{id:159,name:`--sf-color-link--disabled`},{id:160,name:`--sf-color-link--hover`},{id:161,name:`--sf-color-link--underline`},{id:162,name:`--sf-color-link--visited`},{id:163,name:`--sf-color-mark-bg`},{id:164,name:`--sf-color-mark-text`},{id:165,name:`--sf-color-neutral`},{id:166,name:`--sf-color-neutral--active`},{id:167,name:`--sf-color-neutral--hover`},{id:168,name:`--sf-color-neutral-100`},{id:169,name:`--sf-color-neutral-200`},{id:170,name:`--sf-color-neutral-300`},{id:171,name:`--sf-color-neutral-400`},{id:172,name:`--sf-color-neutral-50`},{id:173,name:`--sf-color-neutral-500`},{id:174,name:`--sf-color-neutral-600`},{id:175,name:`--sf-color-neutral-700`},{id:176,name:`--sf-color-neutral-800`},{id:177,name:`--sf-color-neutral-900`},{id:178,name:`--sf-color-neutral-950`},{id:179,name:`--sf-color-neutral-a10`},{id:180,name:`--sf-color-neutral-a30`},{id:181,name:`--sf-color-neutral-a5`},{id:182,name:`--sf-color-neutral-a50`},{id:183,name:`--sf-color-neutral-a80`},{id:184,name:`--sf-color-neutral-source-dark`},{id:185,name:`--sf-color-neutral-darker`},{id:186,name:`--sf-color-neutral-ghost`},{id:187,name:`--sf-color-neutral-source-light`},{id:188,name:`--sf-color-neutral-lighter`},{id:189,name:`--sf-color-neutral-muted`},{id:190,name:`--sf-color-neutral-subtle`},{id:191,name:`--sf-color-neutral-superdark`},{id:192,name:`--sf-color-neutral-superlight`},{id:193,name:`--sf-color-neutral-xdark`},{id:194,name:`--sf-color-neutral-xlight`},{id:195,name:`--sf-color-overlay`},{id:196,name:`--sf-color-primary`},{id:197,name:`--sf-color-primary--active`},{id:198,name:`--sf-color-primary--hover`},{id:199,name:`--sf-color-primary-100`},{id:200,name:`--sf-color-primary-200`},{id:201,name:`--sf-color-primary-300`},{id:202,name:`--sf-color-primary-400`},{id:203,name:`--sf-color-primary-50`},{id:204,name:`--sf-color-primary-500`},{id:205,name:`--sf-color-primary-600`},{id:206,name:`--sf-color-primary-700`},{id:207,name:`--sf-color-primary-800`},{id:208,name:`--sf-color-primary-900`},{id:209,name:`--sf-color-primary-950`},{id:210,name:`--sf-color-primary-a10`},{id:211,name:`--sf-color-primary-a30`},{id:212,name:`--sf-color-primary-a5`},{id:213,name:`--sf-color-primary-a50`},{id:214,name:`--sf-color-primary-a80`},{id:215,name:`--sf-color-primary-source-dark`},{id:216,name:`--sf-color-primary-darker`},{id:217,name:`--sf-color-primary-ghost`},{id:218,name:`--sf-color-primary-source-light`},{id:219,name:`--sf-color-primary-lighter`},{id:220,name:`--sf-color-primary-muted`},{id:221,name:`--sf-color-primary-subtle`},{id:222,name:`--sf-color-primary-superdark`},{id:223,name:`--sf-color-primary-superlight`},{id:224,name:`--sf-color-primary-xdark`},{id:225,name:`--sf-color-primary-xlight`},{id:226,name:`--sf-color-raised`},{id:227,name:`--sf-color-scheme`},{id:228,name:`--sf-color-secondary`},{id:229,name:`--sf-color-secondary--active`},{id:230,name:`--sf-color-secondary--hover`},{id:231,name:`--sf-color-secondary-100`},{id:232,name:`--sf-color-secondary-200`},{id:233,name:`--sf-color-secondary-300`},{id:234,name:`--sf-color-secondary-400`},{id:235,name:`--sf-color-secondary-50`},{id:236,name:`--sf-color-secondary-500`},{id:237,name:`--sf-color-secondary-600`},{id:238,name:`--sf-color-secondary-700`},{id:239,name:`--sf-color-secondary-800`},{id:240,name:`--sf-color-secondary-900`},{id:241,name:`--sf-color-secondary-950`},{id:242,name:`--sf-color-secondary-a10`},{id:243,name:`--sf-color-secondary-a30`},{id:244,name:`--sf-color-secondary-a5`},{id:245,name:`--sf-color-secondary-a50`},{id:246,name:`--sf-color-secondary-a80`},{id:247,name:`--sf-color-secondary-source-dark`},{id:248,name:`--sf-color-secondary-darker`},{id:249,name:`--sf-color-secondary-ghost`},{id:250,name:`--sf-color-secondary-source-light`},{id:251,name:`--sf-color-secondary-lighter`},{id:252,name:`--sf-color-secondary-muted`},{id:253,name:`--sf-color-secondary-subtle`},{id:254,name:`--sf-color-secondary-superdark`},{id:255,name:`--sf-color-secondary-superlight`},{id:256,name:`--sf-color-secondary-xdark`},{id:257,name:`--sf-color-secondary-xlight`},{id:258,name:`--sf-color-selection-bg`},{id:259,name:`--sf-color-selection-text`},{id:260,name:`--sf-color-success`},{id:261,name:`--sf-color-success-source-dark`},{id:262,name:`--sf-color-success-source-light`},{id:263,name:`--sf-color-success-muted`},{id:264,name:`--sf-color-success-strong`},{id:265,name:`--sf-color-success-subtle`},{id:266,name:`--sf-color-surface`},{id:267,name:`--sf-color-tertiary`},{id:268,name:`--sf-color-tertiary--active`},{id:269,name:`--sf-color-tertiary--hover`},{id:270,name:`--sf-color-tertiary-100`},{id:271,name:`--sf-color-tertiary-200`},{id:272,name:`--sf-color-tertiary-300`},{id:273,name:`--sf-color-tertiary-400`},{id:274,name:`--sf-color-tertiary-50`},{id:275,name:`--sf-color-tertiary-500`},{id:276,name:`--sf-color-tertiary-600`},{id:277,name:`--sf-color-tertiary-700`},{id:278,name:`--sf-color-tertiary-800`},{id:279,name:`--sf-color-tertiary-900`},{id:280,name:`--sf-color-tertiary-950`},{id:281,name:`--sf-color-tertiary-a10`},{id:282,name:`--sf-color-tertiary-a30`},{id:283,name:`--sf-color-tertiary-a5`},{id:284,name:`--sf-color-tertiary-a50`},{id:285,name:`--sf-color-tertiary-a80`},{id:286,name:`--sf-color-tertiary-source-dark`},{id:287,name:`--sf-color-tertiary-darker`},{id:288,name:`--sf-color-tertiary-ghost`},{id:289,name:`--sf-color-tertiary-source-light`},{id:290,name:`--sf-color-tertiary-lighter`},{id:291,name:`--sf-color-tertiary-muted`},{id:292,name:`--sf-color-tertiary-subtle`},{id:293,name:`--sf-color-tertiary-superdark`},{id:294,name:`--sf-color-tertiary-superlight`},{id:295,name:`--sf-color-tertiary-xdark`},{id:296,name:`--sf-color-tertiary-xlight`},{id:297,name:`--sf-color-text`},{id:298,name:`--sf-color-text--disabled`},{id:299,name:`--sf-color-text--inverse`},{id:300,name:`--sf-color-text--muted`},{id:301,name:`--sf-color-text--on-action`},{id:302,name:`--sf-color-text--on-base`},{id:303,name:`--sf-color-text--on-danger`},{id:304,name:`--sf-color-text--on-error`,removed:!0},{id:305,name:`--sf-color-text--on-info`},{id:306,name:`--sf-color-text--on-inverse`},{id:307,name:`--sf-color-text--on-neutral`},{id:308,name:`--sf-color-text--on-primary`},{id:309,name:`--sf-color-text--on-secondary`},{id:310,name:`--sf-color-text--on-success`},{id:311,name:`--sf-color-text--on-tertiary`},{id:312,name:`--sf-color-text--on-warning`},{id:313,name:`--sf-color-text--placeholder`},{id:314,name:`--sf-color-text--secondary`},{id:315,name:`--sf-color-warning`},{id:316,name:`--sf-color-warning-source-dark`},{id:317,name:`--sf-color-warning-source-light`},{id:318,name:`--sf-color-warning-muted`},{id:319,name:`--sf-color-warning-strong`},{id:320,name:`--sf-color-warning-subtle`},{id:321,name:`--sf-color-white`},{id:322,name:`--sf-component-pad`},{id:323,name:`--sf-container-default`},{id:324,name:`--sf-container-full`},{id:325,name:`--sf-container-narrow`},{id:326,name:`--sf-container-prose`},{id:327,name:`--sf-container-wide`},{id:328,name:`--sf-content-gap`},{id:329,name:`--sf-content-intrinsic-size`},{id:330,name:`--sf-content-width`},{id:331,name:`--sf-contrast-bias`},{id:332,name:`--sf-contrast-threshold`},{id:333,name:`--sf-cover-min-height`},{id:334,name:`--sf-cover-padding`},{id:335,name:`--sf-current-font-weight`},{id:336,name:`--sf-display-l-line-height`},{id:337,name:`--sf-display-m-line-height`},{id:338,name:`--sf-display-s-line-height`},{id:339,name:`--sf-divider-color`},{id:340,name:`--sf-divider-gap`},{id:341,name:`--sf-divider-style`},{id:342,name:`--sf-divider-width`},{id:343,name:`--sf-drop-shadow-l`},{id:344,name:`--sf-drop-shadow-m`},{id:345,name:`--sf-drop-shadow-s`},{id:346,name:`--sf-duration-fast`},{id:347,name:`--sf-duration-instant`},{id:348,name:`--sf-duration-none`},{id:349,name:`--sf-duration-normal`},{id:350,name:`--sf-duration-slow`},{id:351,name:`--sf-duration-slower`},{id:352,name:`--sf-ease-bounce`},{id:353,name:`--sf-ease-elastic`},{id:354,name:`--sf-ease-in`},{id:355,name:`--sf-ease-in-out`},{id:356,name:`--sf-ease-linear`},{id:357,name:`--sf-ease-out`},{id:358,name:`--sf-ease-overshoot`},{id:359,name:`--sf-ease-spring`},{id:360,name:`--sf-equal-gap`},{id:361,name:`--sf-equal-min-col`},{id:362,name:`--sf-equal-min-col-2`,removed:!0},{id:363,name:`--sf-equal-min-col-3`,removed:!0},{id:364,name:`--sf-equal-min-col-4`,removed:!0},{id:365,name:`--sf-equal-min-col-6`,removed:!0},{id:366,name:`--sf-field-block`},{id:367,name:`--sf-field-padding-block`},{id:368,name:`--sf-field-padding-inline`},{id:369,name:`--sf-field-radius`},{id:370,name:`--sf-field-required-marker`},{id:371,name:`--sf-flow-space`},{id:372,name:`--sf-fluid-max-vw`},{id:373,name:`--sf-fluid-min-vw`},{id:374,name:`--sf-focus-ring-color`},{id:375,name:`--sf-focus-ring-offset`},{id:376,name:`--sf-focus-ring-shadow`},{id:377,name:`--sf-focus-ring-style`},{id:378,name:`--sf-focus-ring-width`},{id:379,name:`--sf-font-body`},{id:380,name:`--sf-font-display`},{id:381,name:`--sf-font-features`},{id:382,name:`--sf-font-geometric`},{id:383,name:`--sf-font-heading`},{id:384,name:`--sf-font-humanist`},{id:385,name:`--sf-font-mono`},{id:386,name:`--sf-font-numeric`},{id:387,name:`--sf-font-slab`},{id:388,name:`--sf-font-variation`},{id:389,name:`--sf-font-weight-body`},{id:390,name:`--sf-font-weight-bold`},{id:391,name:`--sf-font-weight-display`},{id:392,name:`--sf-font-weight-heading`},{id:393,name:`--sf-font-weight-interactive`},{id:394,name:`--sf-font-weight-light`},{id:395,name:`--sf-font-weight-medium`},{id:396,name:`--sf-font-weight-normal`},{id:397,name:`--sf-font-weight-semibold`},{id:398,name:`--sf-font-weight-strong`},{id:399,name:`--sf-frame-ratio`},{id:400,name:`--sf-gap`},{id:401,name:`--sf-gradient-brand`},{id:402,name:`--sf-gradient-fade--b`},{id:403,name:`--sf-gradient-fade--l`},{id:404,name:`--sf-gradient-fade--r`},{id:405,name:`--sf-gradient-fade--t`},{id:406,name:`--sf-gradient-primary`},{id:407,name:`--sf-gradient-secondary`},{id:408,name:`--sf-gradient-surface`},{id:409,name:`--sf-gradient-tertiary`},{id:410,name:`--sf-grid-gap`},{id:411,name:`--sf-grid-min`},{id:412,name:`--sf-grid-min-2xl`},{id:413,name:`--sf-grid-min-l`},{id:414,name:`--sf-grid-min-m`},{id:415,name:`--sf-grid-min-s`},{id:416,name:`--sf-grid-min-xl`},{id:417,name:`--sf-grid-min-xs`},{id:418,name:`--sf-gutter`},{id:419,name:`--sf-h1-font-weight`},{id:420,name:`--sf-h1-letter-spacing`},{id:421,name:`--sf-h1-line-height`},{id:422,name:`--sf-h1-max-width`},{id:423,name:`--sf-h1-size`},{id:424,name:`--sf-h2-font-weight`},{id:425,name:`--sf-h2-letter-spacing`},{id:426,name:`--sf-h2-line-height`},{id:427,name:`--sf-h2-max-width`},{id:428,name:`--sf-h2-size`},{id:429,name:`--sf-h3-font-weight`},{id:430,name:`--sf-h3-letter-spacing`},{id:431,name:`--sf-h3-line-height`},{id:432,name:`--sf-h3-max-width`},{id:433,name:`--sf-h3-size`},{id:434,name:`--sf-h4-font-weight`},{id:435,name:`--sf-h4-letter-spacing`},{id:436,name:`--sf-h4-line-height`},{id:437,name:`--sf-h4-max-width`},{id:438,name:`--sf-h4-size`},{id:439,name:`--sf-h5-font-weight`},{id:440,name:`--sf-h5-letter-spacing`},{id:441,name:`--sf-h5-line-height`},{id:442,name:`--sf-h5-max-width`},{id:443,name:`--sf-h5-size`},{id:444,name:`--sf-h6-font-weight`},{id:445,name:`--sf-h6-letter-spacing`},{id:446,name:`--sf-h6-line-height`},{id:447,name:`--sf-h6-max-width`},{id:448,name:`--sf-h6-size`},{id:449,name:`--sf-header-height`},{id:450,name:`--sf-header-height-desktop`},{id:451,name:`--sf-header-height-mobile`},{id:452,name:`--sf-heading-color`},{id:453,name:`--sf-heading-font-family`},{id:454,name:`--sf-heading-text-wrap`},{id:455,name:`--sf-icon-2xl`},{id:456,name:`--sf-icon-box-bg`},{id:457,name:`--sf-icon-box-border`},{id:458,name:`--sf-icon-box-pad`},{id:459,name:`--sf-icon-box-radius`},{id:460,name:`--sf-icon-l`},{id:461,name:`--sf-icon-m`},{id:462,name:`--sf-icon-s`},{id:463,name:`--sf-icon-xl`},{id:464,name:`--sf-icon-xs`},{id:465,name:`--sf-imposter-margin`},{id:466,name:`--sf-is-active`},{id:467,name:`--sf-is-current`},{id:468,name:`--sf-is-dark`},{id:469,name:`--sf-is-open`},{id:470,name:`--sf-is-pressed`},{id:471,name:`--sf-leading-normal`},{id:472,name:`--sf-leading-relaxed`},{id:473,name:`--sf-leading-snug`},{id:474,name:`--sf-leading-taper`},{id:475,name:`--sf-leading-tight`},{id:476,name:`--sf-line-clamp`},{id:477,name:`--sf-link-external-marker`},{id:478,name:`--sf-link-underline-offset`},{id:479,name:`--sf-link-underline-thickness`},{id:480,name:`--sf-lumlocker`},{id:481,name:`--sf-mask-scrim-end`},{id:482,name:`--sf-mask-scrim-start`},{id:483,name:`--sf-motion-scale`},{id:484,name:`--sf-object-fit`},{id:485,name:`--sf-object-position`},{id:486,name:`--sf-opacity-disabled`},{id:487,name:`--sf-opacity-muted`},{id:488,name:`--sf-optical-sizing`},{id:489,name:`--sf-palette-mix-100`},{id:490,name:`--sf-palette-mix-200`},{id:491,name:`--sf-palette-mix-300`},{id:492,name:`--sf-palette-mix-400`},{id:493,name:`--sf-palette-mix-50`},{id:494,name:`--sf-palette-mix-600`},{id:495,name:`--sf-palette-mix-700`},{id:496,name:`--sf-palette-mix-800`},{id:497,name:`--sf-palette-mix-900`},{id:498,name:`--sf-palette-mix-950`},{id:499,name:`--sf-print-base-size`},{id:500,name:`--sf-print-page-margin`},{id:501,name:`--sf-print-page-size`},{id:502,name:`--sf-prose-block-margin`},{id:503,name:`--sf-prose-blockquote-border`},{id:504,name:`--sf-prose-blockquote-padding`},{id:505,name:`--sf-prose-figcaption-size`},{id:506,name:`--sf-prose-figure-margin`},{id:507,name:`--sf-prose-heading-gap`},{id:508,name:`--sf-prose-hr-margin`},{id:509,name:`--sf-prose-list-gap`},{id:510,name:`--sf-prose-marker-color`},{id:511,name:`--sf-prose-media-margin`},{id:512,name:`--sf-prose-media-radius`},{id:513,name:`--sf-prose-nested-list-gap`},{id:514,name:`--sf-prose-paragraph`},{id:515,name:`--sf-prose-table-pad`},{id:516,name:`--sf-radius-2xl`},{id:517,name:`--sf-radius-2xs`},{id:518,name:`--sf-radius-3xl`},{id:519,name:`--sf-radius-4xl`},{id:520,name:`--sf-radius-full`},{id:521,name:`--sf-radius-l`},{id:522,name:`--sf-radius-m`},{id:523,name:`--sf-radius-none`},{id:524,name:`--sf-radius-outer`},{id:525,name:`--sf-radius-pill`},{id:526,name:`--sf-radius-s`},{id:527,name:`--sf-radius-scale`},{id:528,name:`--sf-radius-xl`},{id:529,name:`--sf-radius-xs`},{id:530,name:`--sf-ratio-3-2`},{id:531,name:`--sf-ratio-4-3`},{id:532,name:`--sf-ratio-cinema`},{id:533,name:`--sf-ratio-golden`},{id:534,name:`--sf-ratio-portrait`},{id:535,name:`--sf-ratio-square`},{id:536,name:`--sf-ratio-video`},{id:537,name:`--sf-reel-gap`},{id:538,name:`--sf-reel-height`},{id:539,name:`--sf-reel-item-width`},{id:540,name:`--sf-safe-bottom`},{id:541,name:`--sf-safe-left`},{id:542,name:`--sf-safe-right`},{id:543,name:`--sf-safe-top`},{id:544,name:`--sf-scrim-color`},{id:545,name:`--sf-scrim-direction`},{id:546,name:`--sf-scrim-gradient`},{id:547,name:`--sf-scrim-text-shadow`},{id:548,name:`--sf-scroll-shadow-size`},{id:549,name:`--sf-scroll-timeline-range-end`},{id:550,name:`--sf-scroll-timeline-range-start`},{id:551,name:`--sf-scrollbar-thumb`},{id:552,name:`--sf-scrollbar-track`},{id:553,name:`--sf-section-pad`},{id:554,name:`--sf-section-pad--2xl`},{id:555,name:`--sf-section-pad--l`},{id:556,name:`--sf-section-pad--m`},{id:557,name:`--sf-section-pad--s`},{id:558,name:`--sf-section-pad--xl`},{id:559,name:`--sf-section-pad--xs`},{id:560,name:`--sf-section-scale`},{id:561,name:`--sf-shadow-2xl`},{id:562,name:`--sf-shadow-color`},{id:563,name:`--sf-shadow-glow`},{id:564,name:`--sf-shadow-glow-color`},{id:565,name:`--sf-shadow-inner`},{id:566,name:`--sf-shadow-l`},{id:567,name:`--sf-shadow-lightness`},{id:568,name:`--sf-shadow-m`},{id:569,name:`--sf-shadow-none`},{id:570,name:`--sf-shadow-s`},{id:571,name:`--sf-shadow-strength`},{id:572,name:`--sf-shadow-xl`},{id:573,name:`--sf-shadow-xs`},{id:574,name:`--sf-sidebar-gap`},{id:575,name:`--sf-sidebar-min-width`},{id:576,name:`--sf-sidebar-width`},{id:577,name:`--sf-size-l`},{id:578,name:`--sf-size-m`},{id:579,name:`--sf-size-s`},{id:580,name:`--sf-size-xl`},{id:581,name:`--sf-size-xs`},{id:582,name:`--sf-space-2xl`},{id:583,name:`--sf-space-2xs`},{id:584,name:`--sf-space-3xl`},{id:585,name:`--sf-space-4xl`},{id:586,name:`--sf-space-base-max`},{id:587,name:`--sf-space-base-min`},{id:588,name:`--sf-space-l`},{id:589,name:`--sf-space-m`},{id:590,name:`--sf-space-none`},{id:591,name:`--sf-space-px`},{id:592,name:`--sf-space-ratio-max`},{id:593,name:`--sf-space-ratio-min`},{id:594,name:`--sf-space-s`},{id:595,name:`--sf-space-scale`},{id:596,name:`--sf-space-xl`},{id:597,name:`--sf-space-xs`},{id:598,name:`--sf-stack-gap`},{id:599,name:`--sf-state-pending-opacity`},{id:600,name:`--sf-sticky-offset`},{id:601,name:`--sf-sticky-offset-desktop`},{id:602,name:`--sf-sticky-offset-mobile`},{id:603,name:`--sf-surface-color`},{id:604,name:`--sf-switcher-gap`},{id:605,name:`--sf-switcher-threshold`},{id:606,name:`--sf-text-2xl`},{id:607,name:`--sf-text-2xl-font-weight`},{id:608,name:`--sf-text-2xl-letter-spacing`},{id:609,name:`--sf-text-2xl-line-height`},{id:610,name:`--sf-text-2xl-max-width`},{id:611,name:`--sf-text-2xs`},{id:612,name:`--sf-text-2xs-font-weight`},{id:613,name:`--sf-text-2xs-letter-spacing`},{id:614,name:`--sf-text-2xs-line-height`},{id:615,name:`--sf-text-2xs-max-width`},{id:616,name:`--sf-text-3xl`},{id:617,name:`--sf-text-3xl-font-weight`},{id:618,name:`--sf-text-3xl-letter-spacing`},{id:619,name:`--sf-text-3xl-line-height`},{id:620,name:`--sf-text-3xl-max-width`},{id:621,name:`--sf-text-4xl`},{id:622,name:`--sf-text-4xl-font-weight`},{id:623,name:`--sf-text-4xl-letter-spacing`},{id:624,name:`--sf-text-4xl-line-height`},{id:625,name:`--sf-text-4xl-max-width`},{id:626,name:`--sf-text-base-max`},{id:627,name:`--sf-text-base-min`},{id:628,name:`--sf-text-display-base-max`},{id:629,name:`--sf-text-display-base-min`},{id:630,name:`--sf-text-display-l`},{id:631,name:`--sf-text-display-m`},{id:632,name:`--sf-text-display-s`},{id:633,name:`--sf-text-display-scale`},{id:634,name:`--sf-text-l`},{id:635,name:`--sf-text-l-font-weight`},{id:636,name:`--sf-text-l-letter-spacing`},{id:637,name:`--sf-text-l-line-height`},{id:638,name:`--sf-text-l-max-width`},{id:639,name:`--sf-text-m`},{id:640,name:`--sf-text-m-font-weight`},{id:641,name:`--sf-text-m-letter-spacing`},{id:642,name:`--sf-text-m-line-height`},{id:643,name:`--sf-text-m-max-width`},{id:644,name:`--sf-text-ratio-max`},{id:645,name:`--sf-text-ratio-min`},{id:646,name:`--sf-text-s`},{id:647,name:`--sf-text-s-font-weight`},{id:648,name:`--sf-text-s-letter-spacing`},{id:649,name:`--sf-text-s-line-height`},{id:650,name:`--sf-text-s-max-width`},{id:651,name:`--sf-text-scale`},{id:652,name:`--sf-text-shadow-l`},{id:653,name:`--sf-text-shadow-m`},{id:654,name:`--sf-text-shadow-none`},{id:655,name:`--sf-text-shadow-s`},{id:656,name:`--sf-text-xl`},{id:657,name:`--sf-text-xl-font-weight`},{id:658,name:`--sf-text-xl-letter-spacing`},{id:659,name:`--sf-text-xl-line-height`},{id:660,name:`--sf-text-xl-max-width`},{id:661,name:`--sf-text-xs`},{id:662,name:`--sf-text-xs-font-weight`},{id:663,name:`--sf-text-xs-letter-spacing`},{id:664,name:`--sf-text-xs-line-height`},{id:665,name:`--sf-text-xs-max-width`},{id:666,name:`--sf-theme-transition-duration`},{id:667,name:`--sf-touch-target`},{id:668,name:`--sf-tracking-normal`},{id:669,name:`--sf-tracking-tight`},{id:670,name:`--sf-tracking-wide`},{id:671,name:`--sf-tracking-wider`},{id:672,name:`--sf-tracking-widest`},{id:673,name:`--sf-transition-colors`},{id:674,name:`--sf-transition-enter`},{id:675,name:`--sf-transition-exit`},{id:676,name:`--sf-transition-fast`},{id:677,name:`--sf-transition-form-field`},{id:678,name:`--sf-transition-opacity`},{id:679,name:`--sf-transition-overlay`},{id:680,name:`--sf-transition-shadow`},{id:681,name:`--sf-transition-slow`},{id:682,name:`--sf-transition-transform`},{id:683,name:`--sf-z-base`},{id:684,name:`--sf-z-below`},{id:685,name:`--sf-z-dropdown`},{id:686,name:`--sf-z-fixed`},{id:687,name:`--sf-z-modal`},{id:688,name:`--sf-z-overlay`},{id:689,name:`--sf-z-raised`},{id:690,name:`--sf-z-sticky`},{id:691,name:`--sf-z-toast`},{id:692,name:`--sf-z-tooltip`},{id:693,name:`--sf-bg-layer-fit`},{id:694,name:`--sf-bg-layer-inset`},{id:695,name:`--sf-bg-layer-position`},{id:696,name:`--sf-bg-layer-radius`},{id:697,name:`--sf-bg-layer-z`},{id:698,name:`--sf-btn-padding-block`},{id:699,name:`--sf-btn-padding-inline`},{id:700,name:`--sf-btn-radius`},{id:701,name:`--sf-equal-rule-color`},{id:702,name:`--sf-equal-rule-style`},{id:703,name:`--sf-equal-rule-width`},{id:704,name:`--sf-boxed-bg`,removed:!0},{id:705,name:`--sf-boxed-border-color`,removed:!0},{id:706,name:`--sf-boxed-border-width`,removed:!0},{id:707,name:`--sf-boxed-padding`,removed:!0},{id:708,name:`--sf-boxed-radius`,removed:!0},{id:709,name:`--sf-boxed-shadow`,removed:!0},{id:710,name:`--sf-corner-scoop-at`},{id:711,name:`--sf-corner-scoop-size`},{id:712,name:`--sf-corners-end-end`,removed:!0},{id:713,name:`--sf-corners-end-start`,removed:!0},{id:714,name:`--sf-corners-start-end`,removed:!0},{id:715,name:`--sf-corners-start-start`,removed:!0},{id:716,name:`--sf-overlap-pull`},{id:717,name:`--sf-btn-border-width`},{id:718,name:`--sf-btn-font-size`},{id:719,name:`--sf-btn-font-weight`},{id:720,name:`--sf-btn-gap`},{id:721,name:`--sf-btn-min-height`},{id:722,name:`--sf-card-bg`},{id:723,name:`--sf-card-border-color`},{id:724,name:`--sf-card-border-width`},{id:725,name:`--sf-card-btn-font-size`},{id:726,name:`--sf-card-gap`},{id:727,name:`--sf-card-heading-size`},{id:728,name:`--sf-card-media-radius`},{id:729,name:`--sf-card-media-ratio`},{id:730,name:`--sf-card-padding`},{id:731,name:`--sf-card-radius`},{id:732,name:`--sf-card-radius-outer`},{id:733,name:`--sf-card-shadow`},{id:734,name:`--sf-card-shadow--elevated`},{id:735,name:`--sf-card-shadow--hover`},{id:736,name:`--sf-animation-slide-out-down`},{id:737,name:`--sf-animation-slide-out-left`},{id:738,name:`--sf-animation-slide-out-right`},{id:739,name:`--sf-animation-slide-out-up`},{id:740,name:`--sf-color-selection-bg--alt`},{id:741,name:`--sf-color-selection-text--alt`},{id:742,name:`--sf-media-radius`},{id:743,name:`--sf-scroll-timeline-range-exit-end`},{id:744,name:`--sf-scroll-timeline-range-exit-start`},{id:745,name:`--sf-drop-shadow-xl`},{id:746,name:`--sf-drop-shadow-xs`},{id:747,name:`--sf-link-external-label`},{id:748,name:`--sf-text-shadow-xl`},{id:749,name:`--sf-text-shadow-xs`},{id:750,name:`--sf-fluid-width`},{id:751,name:`--sf-surface-bg-animation`},{id:752,name:`--sf-surface-bg-attachment`},{id:753,name:`--sf-surface-bg-color`},{id:754,name:`--sf-surface-bg-image`},{id:755,name:`--sf-surface-bg-overlay`},{id:756,name:`--sf-surface-bg-position`},{id:757,name:`--sf-surface-bg-repeat`},{id:758,name:`--sf-surface-bg-size`}]},cc=window.__SLASHED_FW_VERSION__===void 0?`0.0.0`:window.__SLASHED_FW_VERSION__,lc=65535,uc=65535,dc=new TextEncoder,fc=new TextDecoder(`utf-8`,{fatal:!1}),pc=32*1024,mc=256*1024;function hc(e){return Number.isInteger(e)&&e>=0&&e<=uc}function gc(e){let t=new Map;for(let n of e?.tokens??[])n&&!n.removed&&typeof n.name==`string`&&hc(n.id)&&t.set(n.name,n.id);return t}function _c(e){let t=new Map;for(let n of e?.tokens??[])n&&typeof n.name==`string`&&Number.isInteger(n.id)&&t.set(n.id,n.name);return t}function vc(e){let t=``;for(let n=0;nlc||r.push({id:e,valueBytes:a})}if(r.length===0)return``;r.sort((e,t)=>e.id-t.id);let i=0;for(let e of r)i+=4+e.valueBytes.length;let a=new Uint8Array(i),o=0;for(let{id:e,valueBytes:t}of r)a[o++]=e>>8&255,a[o++]=e&255,a[o++]=t.length>>8&255,a[o++]=t.length&255,a.set(t,o),o+=t.length;let s=ic(a);if(s.length>pc)return console.warn(`[codec] compressed payload too large (${s.length} B > ${pc} B); refusing to encode.`),``;let c=new Uint8Array(1+s.length);return c[0]=2,c.set(s,1),vc(c)}function xc(e,t=sc,n={}){let r=String(e??``).trim();if(r===``)return{};let i=yc(r);if(!i||i.length===0)return{};if(i[0]!==2)return console.warn(`[codec] unknown config-code version ${i[0]} (expected 2); ignoring.`),{};let a=i.length-1;if(a>pc)return console.warn(`[codec] compressed payload too large (${a} B > ${pc} B); ignoring.`),{};let o;try{o=ac(i.subarray(1))}catch{return console.warn(`[codec] failed to decompress config; ignoring.`),{}}if(!o||o.length===0)return{};if(o.length>mc)return console.warn(`[codec] decompressed payload too large (${o.length} B > ${mc} B); ignoring.`),{};let s=_c(t),c=typeof n.sanitize==`function`?n.sanitize:e=>e,l=typeof n.isKnown==`function`?n.isKnown:()=>!0,u={},d=0;try{for(;do.length)throw Error(`truncated entry header`);let e=o[d]<<8|o[d+1],t=o[d+2]<<8|o[d+3];if(d+=4,d+t>o.length)throw Error(`truncated value`);let n=fc.decode(o.subarray(d,d+t));d+=t;let r=s.get(e);if(r===void 0||!l(r))continue;let i=c(n);i!==``&&(u[r]=i)}}catch(e){return console.warn(`[codec] malformed config code; ignoring (${e.message}).`),{}}return u}function Sc(e){return e==null?``:String(e).replace(/\/\*[\s\S]*?\*\//g,` `).replace(/[;{}]/g,` `).replace(/[/*]{2,}/g,` `).replace(/\s+/g,` `).trim()}function Cc(e,t={}){let{mode:n=`layer`,banner:r=!0}=t,i=Object.keys(e).filter(e=>/^--sf-[\w-]+$/.test(e)).sort((e,t)=>e.localeCompare(t));if(i.length===0)return``;let a=i.map(t=>`${t}: ${Sc(e[t])};`),o=n===`layer`?` `:` `,s=a.map(e=>`${o}${e}`).join(` +var e=Array.isArray,t=Array.prototype.indexOf,n=Array.prototype.includes,r=Array.from,i=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyDescriptors,s=Object.prototype,c=Array.prototype,l=Object.getPrototypeOf,u=Object.isExtensible;function d(e){return typeof e==`function`}var f=()=>{};function p(e){for(var t=0;t{e=n,t=r}),resolve:e,reject:t}}function h(e,t){if(Array.isArray(e))return e;if(t===void 0||!(Symbol.iterator in e))return Array.from(e);let n=[];for(let r of e)if(n.push(r),n.length===t)break;return n}var g=1<<24,_=1024,v=2048,y=4096,b=8192,x=16384,S=32768,C=1<<25,w=65536,T=1<<19,E=1<<20,D=1<<25,O=65536,k=1<<21,A=1<<22,ee=1<<23,te=Symbol(`$state`),j=Symbol(`legacy props`),ne=Symbol(``),M=Symbol(`attributes`),re=Symbol(`class`),ie=Symbol(`style`),ae=Symbol(`text`),oe=Symbol(`form reset`),se=new class extends Error{name=`StaleReactionError`;message="The reaction that called `getAbortSignal()` was re-run or destroyed"},N=!!globalThis.document?.contentType&&globalThis.document.contentType.includes(`xml`);function ce(e){throw Error(`https://svelte.dev/e/lifecycle_outside_component`)}function le(){throw Error(`https://svelte.dev/e/async_derived_orphan`)}function ue(e,t,n){throw Error(`https://svelte.dev/e/each_key_duplicate`)}function de(e){throw Error(`https://svelte.dev/e/effect_in_teardown`)}function fe(){throw Error(`https://svelte.dev/e/effect_in_unowned_derived`)}function pe(e){throw Error(`https://svelte.dev/e/effect_orphan`)}function me(){throw Error(`https://svelte.dev/e/effect_update_depth_exceeded`)}function he(e){throw Error(`https://svelte.dev/e/props_invalid_value`)}function ge(){throw Error(`https://svelte.dev/e/state_descriptors_fixed`)}function _e(){throw Error(`https://svelte.dev/e/state_prototype_fixed`)}function ve(){throw Error(`https://svelte.dev/e/state_unsafe_mutation`)}function ye(){throw Error(`https://svelte.dev/e/svelte_boundary_reset_onerror`)}var be={},xe=Symbol(`uninitialized`),Se=`http://www.w3.org/1999/xhtml`,Ce=`http://www.w3.org/2000/svg`;function we(){console.warn(`https://svelte.dev/e/derived_inert`)}function Te(e){console.warn(`https://svelte.dev/e/hydration_mismatch`)}function Ee(){console.warn(`https://svelte.dev/e/select_multiple_invalid_value`)}function De(){console.warn(`https://svelte.dev/e/svelte_boundary_reset_noop`)}var P=!1;function Oe(e){P=e}var ke;function Ae(e){if(e===null)throw Te(),be;return ke=e}function je(){return Ae(pn(ke))}function F(e){if(P){if(pn(ke)!==null)throw Te(),be;ke=e}}function Me(e=1){if(P){for(var t=e,n=ke;t--;)n=pn(n);ke=n}}function Ne(e=!0){for(var t=0,n=ke;;){if(n.nodeType===8){var r=n.data;if(r===`]`){if(t===0)return n;--t}else(r===`[`||r===`[!`||r[0]===`[`&&!isNaN(Number(r.slice(1))))&&(t+=1)}var i=pn(n);e&&n.remove(),n=i}}function Pe(e){if(!e||e.nodeType!==8)throw Te(),be;return e.data}function Fe(e){return e===this.v}function Ie(e,t){return e==e?e!==t||typeof e==`object`&&!!e||typeof e==`function`:t==t}function Le(e){return!Ie(e,this.v)}var Re=!1,ze=!1,Be=null;function Ve(e){Be=e}function He(e){return Ke(`getContext`).get(e)}function Ue(e,t=!1,n){Be={p:Be,i:!1,c:null,e:null,s:e,x:null,r:tr,l:ze&&!t?{s:null,u:null,$:[]}:null}}function We(e){var t=Be,n=t.e;if(n!==null){t.e=null;for(var r of n)kn(r)}return e!==void 0&&(t.x=e),t.i=!0,Be=t.p,e??{}}function Ge(){return!ze||Be!==null&&Be.l===null}function Ke(e){return Be===null&&ce(e),Be.c??=new Map(qe(Be)||void 0)}function qe(e){let t=e.p;for(;t!==null;){let e=t.c;if(e!==null)return e;t=t.p}return null}var Je=[];function Ye(){var e=Je;Je=[],p(e)}function Xe(e){if(Je.length===0&&!jt){var t=Je;queueMicrotask(()=>{t===Je&&Ye()})}Je.push(e)}function Ze(){for(;Je.length>0;)Ye()}function Qe(e){var t=tr;if(t===null)return Qn.f|=ee,e;if(!(t.f&32768)&&!(t.f&4))throw e;$e(e,t)}function $e(e,t){if(!(t!==null&&t.f&16384)){for(;t!==null;){if(t.f&128){if(!(t.f&32768))throw e;try{t.b.error(e);return}catch(t){e=t}}t=t.parent}throw e}}var et=~(v|y|_);function tt(e,t){e.f=e.f&et|t}function nt(e){e.f&512||e.deps===null?tt(e,_):tt(e,y)}function rt(e){if(e!==null)for(let t of e)!(t.f&2)||!(t.f&65536)||(t.f^=O,rt(t.deps))}function it(e,t,n){e.f&2048?t.add(e):e.f&4096&&n.add(e),rt(e.deps),tt(e,_)}var at=!1,ot=!1;function st(e){var t=ot;try{return ot=!1,[e(),ot]}finally{ot=t}}function ct(e){let t=0,n=Xt(0),r;return()=>{En()&&(U(n),Nn(()=>(t===0&&(r=Cr(()=>e(()=>en(n)))),t+=1,()=>{Xe(()=>{--t,t===0&&(r?.(),r=void 0,en(n))})})))}}var lt=w|T;function ut(e,t,n,r){new dt(e,t,n,r)}var dt=class{parent;is_pending=!1;transform_error;#e;#t=P?ke:null;#n;#r;#i;#a=null;#o=null;#s=null;#c=null;#l=0;#u=0;#d=!1;#f=new Set;#p=new Set;#m=null;#h=ct(()=>(this.#m=Xt(this.#l),()=>{this.#m=null}));constructor(e,t,n,r){this.#e=e,this.#n=t,this.#r=e=>{var t=tr;t.b=this,t.f|=128,n(e)},this.parent=tr.b,this.transform_error=r??this.parent?.transform_error??(e=>e),this.#i=Pn(()=>{if(P){let e=this.#t;je();let t=e.data===`[!`;if(e.data.startsWith(`[?`)){let t=JSON.parse(e.data.slice(2));this.#_(t)}else t?this.#v():this.#g()}else this.#y()},lt),P&&(this.#e=ke)}#g(){try{this.#a=In(()=>this.#r(this.#e))}catch(e){this.error(e)}}#_(e){let t=this.#n.failed;t&&(this.#s=In(()=>{t(this.#e,()=>e,()=>()=>{})}))}#v(){let e=this.#n.pending;e&&(this.is_pending=!0,this.#o=In(()=>e(this.#e)),Xe(()=>{var e=this.#c=document.createDocumentFragment(),t=dn();e.append(t),this.#a=this.#x(()=>In(()=>this.#r(t))),this.#u===0&&(this.#e.before(e),this.#c=null,Un(this.#o,()=>{this.#o=null}),this.#b(Dt))}))}#y(){try{if(this.is_pending=this.has_pending_snippet(),this.#u=0,this.#l=0,this.#a=In(()=>{this.#r(this.#e)}),this.#u>0){var e=this.#c=document.createDocumentFragment();qn(this.#a,e);let t=this.#n.pending;this.#o=In(()=>t(this.#e))}else this.#b(Dt)}catch(e){this.error(e)}}#b(e){this.is_pending=!1,e.transfer_effects(this.#f,this.#p)}defer_effect(e){it(e,this.#f,this.#p)}is_rendered(){return!this.is_pending&&(!this.parent||this.parent.is_rendered())}has_pending_snippet(){return!!this.#n.pending}#x(e){var t=tr,n=Qn,r=Be;nr(this.#i),er(this.#i),Ve(this.#i.ctx);try{return Lt.ensure(),e()}catch(e){return Qe(e),null}finally{nr(t),er(n),Ve(r)}}#S(e,t){if(!this.has_pending_snippet()){this.parent&&this.parent.#S(e,t);return}this.#u+=e,this.#u===0&&(this.#b(t),this.#o&&Un(this.#o,()=>{this.#o=null}),this.#c&&=(this.#e.before(this.#c),null))}update_pending_count(e,t){this.#S(e,t),this.#l+=e,!(!this.#m||this.#d)&&(this.#d=!0,Xe(()=>{this.#d=!1,this.#m&&Qt(this.#m,this.#l)}))}get_effect_pending(){return this.#h(),U(this.#m)}error(e){if(!this.#n.onerror&&!this.#n.failed)throw e;Dt?.is_fork?(this.#a&&Dt.skip_effect(this.#a),this.#o&&Dt.skip_effect(this.#o),this.#s&&Dt.skip_effect(this.#s),Dt.oncommit(()=>{this.#C(e)})):this.#C(e)}#C(e){this.#a&&=(Bn(this.#a),null),this.#o&&=(Bn(this.#o),null),this.#s&&=(Bn(this.#s),null),P&&(Ae(this.#t),Me(),Ae(Ne()));var t=this.#n.onerror;let n=this.#n.failed;var r=!1,i=!1;let a=()=>{if(r){De();return}r=!0,i&&ye(),this.#s!==null&&Un(this.#s,()=>{this.#s=null}),this.#x(()=>{this.#y()})},o=e=>{try{i=!0,t?.(e,a),i=!1}catch(e){$e(e,this.#i&&this.#i.parent)}n&&(this.#s=this.#x(()=>{try{return In(()=>{var t=tr;t.b=this,t.f|=128,n(this.#e,()=>e,()=>a)})}catch(e){return $e(e,this.#i.parent),null}}))};Xe(()=>{var t;try{t=this.transform_error(e)}catch(e){$e(e,this.#i&&this.#i.parent);return}typeof t==`object`&&t&&typeof t.then==`function`?t.then(o,e=>$e(e,this.#i&&this.#i.parent)):o(t)})}};function ft(e,t,n,r){let i=Ge()?gt:yt;var a=e.filter(e=>!e.settled),o=t.map(i);if(n.length===0&&a.length===0){r(o);return}var s=tr,c=pt(),l=a.length===1?a[0].promise:a.length>1?Promise.all(a.map(e=>e.promise)):null;function u(e){if(!(s.f&16384)){c();try{r([...o,...e])}catch(e){$e(e,s)}mt()}}var d=ht();if(n.length===0){l.then(()=>u([])).finally(d);return}function f(){Promise.all(n.map(e=>vt(e))).then(u).catch(e=>$e(e,s)).finally(d)}l?l.then(()=>{c(),f(),mt()}):f()}function pt(){var e=tr,t=Qn,n=Be,r=Dt;return function(i=!0){nr(e),er(t),Ve(n),i&&!(e.f&16384)&&(r?.activate(),r?.apply())}}function mt(e=!0){nr(null),er(null),Ve(null),e&&Dt?.deactivate()}function ht(){var e=tr,t=e.b,n=Dt,r=!!t?.is_rendered();return t?.update_pending_count(1,n),n.increment(r,e),()=>{t?.update_pending_count(-1,n),n.decrement(r,e)}}function gt(e){var t=2|v;return tr!==null&&(tr.f|=T),{ctx:Be,deps:null,effects:null,equals:Fe,f:t,fn:e,reactions:null,rv:0,v:xe,wv:0,parent:tr,ac:null}}var _t=Symbol(`obsolete`);function vt(e,t,n){let r=tr;r===null&&le();var i=void 0,a=Xt(xe),o=!Qn,s=new Set;return Mn(()=>{var t=tr,n=m();i=n.promise;try{Promise.resolve(e()).then(n.resolve,e=>{e!==se&&n.reject(e)}).finally(mt)}catch(e){n.reject(e),mt()}var c=Dt;if(o){if(t.f&32768)var l=ht();if(r.b?.is_rendered())c.async_deriveds.get(t)?.reject(_t);else for(let e of s.values())e.reject(_t);s.add(n),c.async_deriveds.set(t,n)}let u=(e,t=void 0)=>{l?.(),s.delete(n),t!==_t&&(c.activate(),t?(a.f|=ee,Qt(a,t)):(a.f&8388608&&(a.f^=ee),Qt(a,e)),c.deactivate())};n.promise.then(u,e=>u(null,e||`unknown`))}),Dn(()=>{for(let e of s)e.reject(_t)}),new Promise(e=>{function t(n){function r(){n===i?e(a):t(i)}n.then(r,r)}t(i)})}function I(e){let t=gt(e);return Re||ir(t),t}function yt(e){let t=gt(e);return t.equals=Le,t}function bt(e){var t=e.effects;if(t!==null){e.effects=null;for(var n=0;nthis.schedule(e)){var n=this.#f.get(e);if(n){this.#f.delete(e);for(var r of n.d)tt(r,v),t(r);for(r of n.m)tt(r,y),t(r)}this.#p.add(e)}#g(){this.#e=!0,Ft++>1e3&&(this.#S(),zt());for(let e of this.#u)this.#d.delete(e),tt(e,v),this.schedule(e);for(let e of this.#d)tt(e,y),this.schedule(e);let t=this.#c;this.#c=[],this.apply();var n=Nt=[],r=[],i=Pt=[];for(let e of t)try{this.#_(e,n,r)}catch(t){throw Kt(e),this.#h()||this.discard(),t}if(Dt=null,i.length>0){var a=e.ensure();for(let e of i)a.schedule(e)}if(Nt=null,Pt=null,this.#h()){this.#b(r),this.#b(n);for(let[e,t]of this.#f)Gt(e,t);i.length>0&&Dt.#g();return}let o=this.#v();if(o){this.#b(r),this.#b(n),o.#y(this);return}this.#u.clear(),this.#d.clear();for(let e of this.#r)e(this);this.#r.clear(),Ot=this,Vt(r),Vt(n),Ot=null,this.#s?.resolve();var s=Dt;if(this.#a===0&&(this.#c.length===0||s!==null)&&(this.#S(),Re&&(this.#x(),Dt=s)),this.#c.length>0)if(s!==null){let e=s;e.#c.push(...this.#c.filter(t=>!e.#c.includes(t)))}else s=this;s!==null&&s.#g()}#_(e,t,n){e.f^=_;for(var r=e.first;r!==null;){var i=r.f,a=(i&96)!=0;if(!(a&&i&1024||i&8192||this.#f.has(r))&&r.fn!==null){a?r.f^=_:i&4?t.push(r):Re&&i&16777224?n.push(r):mr(r)&&(i&16&&this.#d.add(r),yr(r));var o=r.first;if(o!==null){r=o;continue}}for(;r!==null;){var s=r.next;if(s!==null){r=s;break}r=r.parent}}}#v(){for(var e=this.#t;e!==null;){if(!e.is_fork){for(let[t,[,n]]of this.current)if(e.current.has(t)&&!n)return e}e=e.#t}return null}#y(e){for(let[t,n]of e.current)!this.previous.has(t)&&e.previous.has(t)&&this.previous.set(t,e.previous.get(t)),this.current.set(t,n);for(let[t,n]of e.async_deriveds){let e=this.async_deriveds.get(t);e&&n.promise.then(e.resolve).catch(e.reject)}e.async_deriveds.clear(),this.transfer_effects(e.#u,e.#d);let t=e=>{var n=e.reactions;if(n!==null)for(let e of n){var r=e.f;if(r&2)t(e);else{var i=e;r&4194320&&!this.async_deriveds.has(i)&&(this.#d.delete(i),tt(i,v),this.schedule(i))}}};for(let e of this.current.keys())t(e);this.oncommit(()=>e.discard()),e.#S(),Dt=this,this.#g()}#b(e){for(var t=0;t!u.current.get(e)[1]);if(!(!u.#e||r.length===0)){var i=r.filter(e=>!this.current.has(e));if(i.length===0)e&&u.discard();else if(t.length>0){if(e)for(let e of this.#p)u.unskip_effect(e,e=>{e.f&4194320?u.schedule(e):u.#b([e])});u.activate();var a=new Set,o=new Map;for(var s of t)Ht(s,i,a,o);o=new Map;var c=[...u.current].filter(([e,t])=>{let n=this.current.get(e);return n?n[0]!==t[0]||n[1]!==t[1]:!0}).map(([e])=>e);if(c.length>0)for(let e of this.#l)!(e.f&155648)&&Ut(e,c,o)&&(e.f&4194320?(tt(e,v),u.schedule(e)):u.#u.add(e));if(u.#c.length>0&&!u.#m){u.apply();for(var l of u.#c)u.#_(l,[],[]);u.#c=[]}u.deactivate()}}}}increment(e,t){if(this.#a+=1,e){let e=this.#o.get(t)??0;this.#o.set(t,e+1)}}decrement(e,t){if(--this.#a,e){let e=this.#o.get(t)??0;e===1?this.#o.delete(t):this.#o.set(t,e-1)}this.#m||(this.#m=!0,Xe(()=>{this.#m=!1,this.linked&&this.flush()}))}transfer_effects(e,t){for(let t of e)this.#u.add(t);for(let e of t)this.#d.add(e);e.clear(),t.clear()}oncommit(e){this.#r.add(e)}ondiscard(e){this.#i.add(e)}settled(){return(this.#s??=m()).promise}static ensure(){if(Dt===null){let t=Dt=new e;!Mt&&!jt&&Xe(()=>{t.#e||t.flush()})}return Dt}apply(){if(!Re||!this.is_fork&&this.#t===null&&this.#n===null){kt=null;return}kt=new Map;for(let[e,[t]]of this.current)kt.set(e,t);for(let t=Tt;t!==null;t=t.#n)if(!(t===this||t.is_fork)){var e=!1;if(t.id0)){Jt.clear();for(let e of Bt){if(e.f&24576)continue;let t=[e],n=e.parent;for(;n!==null;)Bt.has(n)&&(Bt.delete(n),t.push(n)),n=n.parent;for(let e=t.length-1;e>=0;e--){let n=t[e];n.f&24576||yr(n)}}Bt.clear()}}Bt=null}}function Ht(e,t,n,r){if(!n.has(e)&&(n.add(e),e.reactions!==null))for(let i of e.reactions){let e=i.f;e&2?Ht(i,t,n,r):e&4194320&&!(e&2048)&&Ut(i,t,r)&&(tt(i,v),Wt(i))}}function Ut(e,t,r){let i=r.get(e);if(i!==void 0)return i;if(e.deps!==null)for(let i of e.deps){if(n.call(t,i))return!0;if(i.f&2&&Ut(i,t,r))return r.set(i,!0),!0}return r.set(e,!1),!1}function Wt(e){Dt.schedule(e)}function Gt(e,t){if(!(e.f&32&&e.f&1024)){e.f&2048?t.d.push(e):e.f&4096&&t.m.push(e),tt(e,_);for(var n=e.first;n!==null;)Gt(n,t),n=n.next}}function Kt(e){tt(e,_);for(var t=e.first;t!==null;)Kt(t),t=t.next}var qt=new Set,Jt=new Map,Yt=!1;function Xt(e,t){return{f:0,v:e,reactions:null,equals:Fe,rv:0,wv:0}}function L(e,t){let n=Xt(e,t);return ir(n),n}function Zt(e,t=!1,n=!0){let r=Xt(e);return t||(r.equals=Le),ze&&n&&Be!==null&&Be.l!==null&&(Be.l.s??=[]).push(r),r}function R(e,t,n=!1){return Qn!==null&&(!$n||Qn.f&131072)&&Ge()&&Qn.f&4325394&&(rr===null||!rr.has(e))&&ve(),Qt(e,n?nn(t):t,Pt)}function Qt(e,t,n=null){if(!e.equals(t)){Jt.set(e,Xn?t:e.v);var r=Lt.ensure();if(r.capture(e,t),e.f&2){let t=e;e.f&2048&&xt(t),kt===null&&nt(t)}e.wv=pr(),tn(e,v,n),Ge()&&tr!==null&&tr.f&1024&&!(tr.f&96)&&(sr===null?cr([e]):sr.push(e)),!r.is_fork&&qt.size>0&&!Yt&&$t()}return t}function $t(){Yt=!1;for(let e of qt){e.f&1024&&tt(e,y);let t;try{t=mr(e)}catch{t=!0}t&&yr(e)}qt.clear()}function en(e){R(e,e.v+1)}function tn(e,t,n){var r=e.reactions;if(r!==null)for(var i=Ge(),a=r.length,o=0;o{if(dr===d)return e();var t=Qn,n=dr;er(null),fr(d);var r=e();return er(t),fr(n),r};return i&&r.set(`length`,L(t.length,u)),new Proxy(t,{defineProperty(e,t,n){(!(`value`in n)||n.configurable===!1||n.enumerable===!1||n.writable===!1)&&ge();var i=r.get(t);return i===void 0?f(()=>{var e=L(n.value,u);return r.set(t,e),e}):R(i,n.value,!0),!0},deleteProperty(e,t){var n=r.get(t);if(n===void 0){if(t in e){let e=f(()=>L(xe,u));r.set(t,e),en(o)}}else R(n,xe),en(o);return!0},get(e,n,i){if(n===te)return t;var o=r.get(n),s=n in e;if(o===void 0&&(!s||a(e,n)?.writable)&&(o=f(()=>L(nn(s?e[n]:xe),u)),r.set(n,o)),o!==void 0){var c=U(o);return c===xe?void 0:c}return Reflect.get(e,n,i)},getOwnPropertyDescriptor(e,t){var n=Reflect.getOwnPropertyDescriptor(e,t);if(n&&`value`in n){var i=r.get(t);i&&(n.value=U(i))}else if(n===void 0){var a=r.get(t),o=a?.v;if(a!==void 0&&o!==xe)return{enumerable:!0,configurable:!0,value:o,writable:!0}}return n},has(e,t){if(t===te)return!0;var n=r.get(t),i=n!==void 0&&n.v!==xe||Reflect.has(e,t);return(n!==void 0||tr!==null&&(!i||a(e,t)?.writable))&&(n===void 0&&(n=f(()=>L(i?nn(e[t]):xe,u)),r.set(t,n)),U(n)===xe)?!1:i},set(e,t,n,s){var c=r.get(t),l=t in e;if(i&&t===`length`)for(var d=n;dL(xe,u)),r.set(d+``,p)):R(p,xe)}if(c===void 0)(!l||a(e,t)?.writable)&&(c=f(()=>L(void 0,u)),R(c,nn(n)),r.set(t,c));else{l=c.v!==xe;var m=f(()=>nn(n));R(c,m)}var h=Reflect.getOwnPropertyDescriptor(e,t);if(h?.set&&h.set.call(s,n),!l){if(i&&typeof t==`string`){var g=r.get(`length`),_=Number(t);Number.isInteger(_)&&_>=g.v&&R(g,_+1)}en(o)}return!0},ownKeys(e){U(o);var t=Reflect.ownKeys(e).filter(e=>{var t=r.get(e);return t===void 0||t.v!==xe});for(var[n,i]of r)i.v!==xe&&!(n in e)&&t.push(n);return t},setPrototypeOf(){_e()}})}function rn(e){try{if(typeof e==`object`&&e&&te in e)return e[te]}catch{}return e}function an(e,t){return Object.is(rn(e),rn(t))}var on,sn,cn,ln;function un(){if(on===void 0){on=window,sn=/Firefox/.test(navigator.userAgent);var e=Element.prototype,t=Node.prototype,n=Text.prototype;cn=a(t,`firstChild`).get,ln=a(t,`nextSibling`).get,u(e)&&(e[re]=void 0,e[M]=null,e[ie]=void 0,e.__e=void 0),u(n)&&(n[ae]=void 0)}}function dn(e=``){return document.createTextNode(e)}function fn(e){return cn.call(e)}function pn(e){return ln.call(e)}function z(e,t){if(!P)return fn(e);var n=fn(ke);if(n===null)n=ke.appendChild(dn());else if(t&&n.nodeType!==3){var r=dn();return n?.before(r),Ae(r),r}return t&&_n(n),Ae(n),n}function B(e,t=!1){if(!P){var n=fn(e);return n instanceof Comment&&n.data===``?pn(n):n}if(t){if(ke?.nodeType!==3){var r=dn();return ke?.before(r),Ae(r),r}_n(ke)}return ke}function V(e,t=1,n=!1){let r=P?ke:e;for(var i;t--;)i=r,r=pn(r);if(!P)return r;if(n){if(r?.nodeType!==3){var a=dn();return r===null?i?.after(a):r.before(a),Ae(a),a}_n(r)}return Ae(r),r}function mn(e){e.textContent=``}function hn(){return!Re||Bt!==null?!1:(tr.f&S)!==0}function gn(e,t,n){return t==null||t===`http://www.w3.org/1999/xhtml`?n?document.createElement(e,{is:n}):document.createElement(e):n?document.createElementNS(t,e,{is:n}):document.createElementNS(t,e)}function _n(e){if(e.nodeValue.length<65536)return;let t=e.nextSibling;for(;t!==null&&t.nodeType===3;)t.remove(),e.nodeValue+=t.nodeValue,t=e.nextSibling}function vn(e,t){if(t){let t=document.body;e.autofocus=!0,Xe(()=>{document.activeElement===t&&e.focus()})}}var yn=!1;function bn(){yn||(yn=!0,document.addEventListener(`reset`,e=>{Promise.resolve().then(()=>{if(!e.defaultPrevented)for(let t of e.target.elements)t[oe]?.()})},{capture:!0}))}function xn(e){var t=Qn,n=tr;er(null),nr(null);try{return e()}finally{er(t),nr(n)}}function Sn(e,t,n,r=n){e.addEventListener(t,()=>xn(n));let i=e[oe];i?e[oe]=()=>{i(),r(!0)}:e[oe]=()=>r(!0),bn()}function Cn(e){tr===null&&(Qn===null&&pe(e),fe()),Xn&&de(e)}function wn(e,t){var n=t.last;n===null?t.last=t.first=e:(n.next=e,e.prev=n,t.last=e)}function Tn(e,t){var n=tr;n!==null&&n.f&8192&&(e|=b);var r={ctx:Be,deps:null,nodes:null,f:e|v|512,first:null,fn:t,last:null,next:null,parent:n,b:n&&n.b,prev:null,teardown:null,wv:0,ac:null};Dt?.register_created_effect(r);var i=r;if(e&4)Nt===null?Lt.ensure().schedule(r):Nt.push(r);else if(t!==null){try{yr(r)}catch(e){throw Bn(r),e}i.deps===null&&i.teardown===null&&i.nodes===null&&i.first===i.last&&!(i.f&524288)&&(i=i.first,e&16&&e&65536&&i!==null&&(i.f|=w))}if(i!==null&&(i.parent=n,n!==null&&wn(i,n),Qn!==null&&Qn.f&2&&!(e&64))){var a=Qn;(a.effects??=[]).push(i)}return r}function En(){return Qn!==null&&!$n}function Dn(e){let t=Tn(8,null);return tt(t,_),t.teardown=e,t}function On(e){Cn(`$effect`);var t=tr.f;if(!Qn&&t&32&&Be!==null&&!Be.i){var n=Be;(n.e??=[]).push(e)}else return kn(e)}function kn(e){return Tn(4|E,e)}function An(e){Lt.ensure();let t=Tn(64|T,e);return(e={})=>new Promise(n=>{e.outro?Un(t,()=>{Bn(t),n(void 0)}):(Bn(t),n(void 0))})}function jn(e){return Tn(4,e)}function Mn(e){return Tn(A|T,e)}function Nn(e,t=0){return Tn(8|t,e)}function H(e,t=[],n=[],r=[]){ft(r,t,n,t=>{Tn(8,()=>{e(...t.map(U))})})}function Pn(e,t=0){return Tn(16|t,e)}function Fn(e,t=0){return Tn(g|t,e)}function In(e){return Tn(32|T,e)}function Ln(e){var t=e.teardown;if(t!==null){let e=Xn,n=Qn;Zn(!0),er(null);try{t.call(null)}finally{Zn(e),er(n)}}}function Rn(e,t=!1){var n=e.first;for(e.first=e.last=null;n!==null;){let e=n.ac;e!==null&&xn(()=>{e.abort(se)});var r=n.next;n.f&64?n.parent=null:Bn(n,t),n=r}}function zn(e){for(var t=e.first;t!==null;){var n=t.next;t.f&32||Bn(t),t=n}}function Bn(e,t=!0){var n=!1;(t||e.f&262144)&&e.nodes!==null&&e.nodes.end!==null&&(Vn(e.nodes.start,e.nodes.end),n=!0),e.f|=C,Rn(e,t&&!n),vr(e,0);var r=e.nodes&&e.nodes.t;if(r!==null)for(let e of r)e.stop();Ln(e),e.f^=C,e.f|=x;var i=e.parent;i!==null&&i.first!==null&&Hn(e),e.next=e.prev=e.teardown=e.ctx=e.deps=e.fn=e.nodes=e.ac=e.b=null}function Vn(e,t){for(;e!==null;){var n=e===t?null:pn(e);e.remove(),e=n}}function Hn(e){var t=e.parent,n=e.prev,r=e.next;n!==null&&(n.next=r),r!==null&&(r.prev=n),t!==null&&(t.first===e&&(t.first=r),t.last===e&&(t.last=n))}function Un(e,t,n=!0){var r=[];Wn(e,r,!0);var i=()=>{n&&Bn(e),t&&t()},a=r.length;if(a>0){var o=()=>--a||i();for(var s of r)s.out(o)}else i()}function Wn(e,t,n){if(!(e.f&8192)){e.f^=b;var r=e.nodes&&e.nodes.t;if(r!==null)for(let e of r)(e.is_global||n)&&t.push(e);for(var i=e.first;i!==null;){var a=i.next;if(!(i.f&64)){var o=(i.f&65536)!=0||(i.f&32)!=0&&(e.f&16)!=0;Wn(i,t,o?n:!1)}i=a}}}function Gn(e){Kn(e,!0)}function Kn(e,t){if(e.f&8192){e.f^=b,e.f&1024||(tt(e,v),Lt.ensure().schedule(e));for(var n=e.first;n!==null;){var r=n.next,i=(n.f&65536)!=0||(n.f&32)!=0;Kn(n,i?t:!1),n=r}var a=e.nodes&&e.nodes.t;if(a!==null)for(let e of a)(e.is_global||t)&&e.in()}}function qn(e,t){if(e.nodes)for(var n=e.nodes.start,r=e.nodes.end;n!==null;){var i=n===r?null:pn(n);t.append(n),n=i}}var Jn=null,Yn=!1,Xn=!1;function Zn(e){Xn=e}var Qn=null,$n=!1;function er(e){Qn=e}var tr=null;function nr(e){tr=e}var rr=null;function ir(e){Qn!==null&&(!Re||Qn.f&2)&&(rr??=new Set).add(e)}var ar=null,or=0,sr=null;function cr(e){sr=e}var lr=1,ur=0,dr=ur;function fr(e){dr=e}function pr(){return++lr}function mr(e){var t=e.f;if(t&2048)return!0;if(t&2&&(e.f&=~O),t&4096){for(var n=e.deps,r=n.length,i=0;ie.wv)return!0}t&512&&kt===null&&tt(e,_)}return!1}function hr(e,t,n=!0){var r=e.reactions;if(r!==null&&!(!Re&&rr!==null&&rr.has(e)))for(var i=0;i{e.ac.abort(se)}),e.ac=null);try{e.f|=k;var u=e.fn,d=u();e.f|=S;var f=e.deps,p=Dt?.is_fork;if(ar!==null){var m;if(p||vr(e,or),f!==null&&or>0)for(f.length=or+ar.length,m=0;m{requestAnimationFrame(()=>e()),setTimeout(()=>e())});await Promise.resolve(),Rt()}function U(e){var t=(e.f&2)!=0;if(Jn?.add(e),Qn!==null&&!$n&&!(tr!==null&&tr.f&16384)&&(rr===null||!rr.has(e))){var r=Qn.deps;if(Qn.f&2097152)e.rv{e.isConnected&&e.dispatchEvent(t)}))}function Rr(e,t,n,r={}){function i(e){if(r.capture||Hr.call(t,e),!e.cancelBubble)return xn(()=>n?.call(this,e))}return e.startsWith(`pointer`)||e.startsWith(`touch`)||e===`wheel`?Xe(()=>{t.addEventListener(e,i,r)}):t.addEventListener(e,i,r),i}function zr(e,t,n,r,i){var a={capture:r,passive:i},o=Rr(e,t,n,a);(t===document.body||t===window||t===document||t instanceof HTMLMediaElement)&&Dn(()=>{t.removeEventListener(e,o,a)})}function W(e,t,n){(t[Pr]??={})[e]=n}function Br(e){for(var t=0;t{throw e});throw p}}finally{e[Pr]=t,delete e.currentTarget,er(d),nr(f)}}}var Ur=globalThis?.window?.trustedTypes&&globalThis.window.trustedTypes.createPolicy(`svelte-trusted-html`,{createHTML:e=>e});function Wr(e){return Ur?.createHTML(e)??e}function Gr(e){var t=gn(`template`);return t.innerHTML=Wr(e.replaceAll(``,``)),t.content}function Kr(e,t){var n=tr;n.nodes===null&&(n.nodes={start:e,end:t,a:null,t:null})}function G(e,t){var n=(t&1)!=0,r=(t&2)!=0,i,a=!e.startsWith(``);return()=>{if(P)return Kr(ke,null),ke;i===void 0&&(i=Gr(a?e:``+e),n||(i=fn(i)));var t=r||sn?document.importNode(i,!0):i.cloneNode(!0);if(n){var o=fn(t),s=t.lastChild;Kr(o,s)}else Kr(t,t);return t}}function qr(e,t,n=`svg`){var r=!e.startsWith(``),i=(t&1)!=0,a=`<${n}>${r?e:``+e}`,o;return()=>{if(P)return Kr(ke,null),ke;if(!o){var e=fn(Gr(a));if(i)for(o=document.createDocumentFragment();fn(e);)o.appendChild(fn(e));else o=fn(e)}var t=o.cloneNode(!0);if(i){var n=fn(t),r=t.lastChild;Kr(n,r)}else Kr(t,t);return t}}function Jr(e,t){return qr(e,t,`svg`)}function Yr(e=``){if(!P){var t=dn(e+``);return Kr(t,t),t}var n=ke;return n.nodeType===3?_n(n):(n.before(n=dn()),Ae(n)),Kr(n,n),n}function Xr(){if(P)return Kr(ke,null),ke;var e=document.createDocumentFragment(),t=document.createComment(``),n=dn();return e.append(t,n),Kr(t,n),e}function K(e,t){if(P){var n=tr;(!(n.f&32768)||n.nodes.end===null)&&(n.nodes.end=ke),je();return}e!==null&&e.before(t)}function q(e,t){var n=t==null?``:typeof t==`object`?`${t}`:t;n!==(e[ae]??=e.nodeValue)&&(e[ae]=n,e.nodeValue=`${n}`)}function Zr(e,t){return $r(e,t)}var Qr=new Map;function $r(e,{target:t,anchor:n,props:i={},events:a,context:o,intro:s=!0,transformError:c}){un();var l=void 0,u=An(()=>{var s=n??t.appendChild(dn());ut(s,{pending:()=>{}},t=>{Ue({});var n=Be;if(o&&(n.c=o),a&&(i.$$events=a),P&&Kr(t,null),l=e(t,i)||{},P&&(tr.nodes.end=ke,ke===null||ke.nodeType!==8||ke.data!==`]`))throw Te(),be;We()},c);var u=new Set,d=e=>{for(var n=0;n{for(var e of u)for(let n of[t,document]){var r=Qr.get(n),i=r.get(e);--i==0?(n.removeEventListener(e,Hr),r.delete(e),r.size===0&&Qr.delete(n)):r.set(e,i)}Ir.delete(d),s!==n&&s.parentNode?.removeChild(s)}});return ei.set(l,u),l}var ei=new WeakMap,ti=class{anchor;#e=new Map;#t=new Map;#n=new Map;#r=new Set;#i=!0;constructor(e,t=!0){this.anchor=e,this.#i=t}#a=e=>{if(this.#e.has(e)){var t=this.#e.get(e),n=this.#t.get(t);if(n)Gn(n),this.#r.delete(t);else{var r=this.#n.get(t);r&&(Gn(r.effect),this.#t.set(t,r.effect),this.#n.delete(t),r.fragment.lastChild.remove(),this.anchor.before(r.fragment),n=r.effect)}for(let[t,n]of this.#e){if(this.#e.delete(t),t===e)break;let r=this.#n.get(n);r&&(Bn(r.effect),this.#n.delete(n))}for(let[e,r]of this.#t){if(e===t||this.#r.has(e))continue;let i=()=>{if(Array.from(this.#e.values()).includes(e)){var t=document.createDocumentFragment();qn(r,t),t.append(dn()),this.#n.set(e,{effect:r,fragment:t})}else Bn(r);this.#r.delete(e),this.#t.delete(e)};this.#i||!n?(this.#r.add(e),Un(r,i,!1)):i()}}};#o=e=>{this.#e.delete(e);let t=Array.from(this.#e.values());for(let[e,n]of this.#n)t.includes(e)||(Bn(n.effect),this.#n.delete(e))};ensure(e,t){var n=Dt,r=hn();if(t&&!this.#t.has(e)&&!this.#n.has(e))if(r){var i=document.createDocumentFragment(),a=dn();i.append(a),this.#n.set(e,{effect:In(()=>t(a)),fragment:i})}else this.#t.set(e,In(()=>t(this.anchor)));if(this.#e.set(n,e),r){for(let[t,r]of this.#t)t===e?n.unskip_effect(r):n.skip_effect(r);for(let[t,r]of this.#n)t===e?n.unskip_effect(r.effect):n.skip_effect(r.effect);n.oncommit(this.#a),n.ondiscard(this.#o)}else P&&(this.anchor=ke),this.#a(n)}};function J(e,t,n=!1){var r;P&&(r=ke,je());var i=new ti(e),a=n?w:0;function o(e,t){if(P){var n=Pe(r);if(e!==parseInt(n.substring(1))){var a=Ne();Ae(a),i.anchor=a,Oe(!1),i.ensure(e,t),Oe(!0);return}}i.ensure(e,t)}Pn(()=>{var e=!1;t((t,n=0)=>{e=!0,o(n,t)}),e||o(-1,null)},a)}var ni=Symbol(`NaN`);function ri(e,t,n){P&&je();var r=new ti(e),i=!Ge();Pn(()=>{var e=t();e!==e&&(e=ni),i&&typeof e==`object`&&e&&(e={}),r.ensure(e,n)})}function ii(e,t){return t}function ai(e,t,n){for(var i=[],a=t.length,o,s=t.length,c=0;c{if(o){if(o.pending.delete(n),o.done.add(n),o.pending.size===0){var t=e.outrogroups;oi(e,r(o.done)),t.delete(o),t.size===0&&(e.outrogroups=null)}}else--s},!1)}if(s===0){var l=i.length===0&&n!==null;if(l){var u=n,d=u.parentNode;mn(d),d.append(u),e.items.clear()}oi(e,t,!l)}else o={pending:new Set(t),done:new Set},(e.outrogroups??=new Set).add(o)}function oi(e,t,n=!0){var r;if(e.pending.size>0){r=new Set;for(let t of e.pending.values())for(let n of t)r.add(e.items.get(n).e)}for(var i=0;i{var t=i();return e(t)?t:t==null?[]:r(t)}),p,m=new Map,h=!0;function g(e){v.effect.f&16384||(v.pending.delete(e),v.fallback=d,li(v,p,c,n,a),d!==null&&(p.length===0?d.f&33554432?(d.f^=D,di(d,null,c)):Gn(d):Un(d,()=>{d=null})))}function _(e){v.pending.delete(e)}var v={effect:Pn(()=>{p=U(f);var e=p.length;let t=!1;P&&Pe(c)===`[!`!=(e===0)&&(c=Ne(),Ae(c),Oe(!1),t=!0);for(var r=new Set,u=Dt,v=hn(),y=0;ys(c)):(d=In(()=>s(si??=dn())),d.f|=D)),e>r.size&&ue(``,``,``),P&&e>0&&Ae(Ne()),!h)if(m.set(u,r),v){for(let[e,t]of l)r.has(e)||u.skip_effect(t.e);u.oncommit(g),u.ondiscard(_)}else g(u);t&&Oe(!0),U(f)}),flags:n,items:l,pending:m,outrogroups:null,fallback:d};h=!1,P&&(c=ke)}function ci(e){for(;e!==null&&!(e.f&32);)e=e.next;return e}function li(e,t,n,i,a){var o=(i&8)!=0,s=t.length,c=e.items,l=ci(e.effect.first),u,d=null,f,p=[],m=[],h,g,_,v;if(o)for(v=0;v0){var E=i&4&&s===0?n:null;if(o){for(v=0;v{if(f!==void 0)for(_ of f)_.nodes?.a?.apply()})}function ui(e,t,n,r,i,a,o,s){var c=o&1?o&16?Xt(n):Zt(n,!1,!1):null,l=o&2?Xt(i):null;return{v:c,i:l,e:In(()=>(a(t,c??n,l??i,s),()=>{e.delete(r)}))}}function di(e,t,n){if(e.nodes)for(var r=e.nodes.start,i=e.nodes.end,a=t&&!(t.f&33554432)?t.nodes.start:n;r!==null;){var o=pn(r);if(a.before(r),r===i)return;r=o}}function fi(e,t,n){t===null?e.effect.first=n:t.next=n,n===null?e.effect.last=t:n.prev=t}function pi(e,t,...n){var r=new ti(e);Pn(()=>{let e=t()??null;r.ensure(e,e&&(t=>e(t,...n)))},w)}function mi(e,t,n){var r;P&&(r=ke,je());var i=new ti(e);Pn(()=>{var e=t()??null;if(P&&Pe(r)===`[`!=(e!==null)){var a=Ne();Ae(a),i.anchor=a,Oe(!1),i.ensure(e,e&&(t=>n(t,e))),Oe(!0);return}i.ensure(e,e&&(t=>n(t,e)))},w)}function hi(e,t,n,r,i,a){let o=P;P&&je();var s=null;P&&ke.nodeType===1&&(s=ke,je());var c=P?ke:e,l=new ti(c,!1);Pn(()=>{let e=t()||null;var a=i?i():n||e===`svg`?Ce:void 0;if(e===null){l.ensure(null,null);return}return l.ensure(e,t=>{if(e){if(s=P?s:gn(e,a),Kr(s,s),r){var n=null;P&&Nr(e)&&s.append(n=document.createComment(``));var i=P?fn(s):s.appendChild(dn());P&&(i===null?Oe(!1):Ae(i)),r(s,i),n?.remove()}tr.nodes.end=s,t.before(s)}P&&Ae(t)}),()=>{}},w),Dn(()=>{}),o&&(Oe(!0),Ae(c))}function gi(e,t){var n=void 0,r;Fn(()=>{n!==(n=t())&&(r&&=(Bn(r),null),n&&(r=In(()=>{jn(()=>n(e))})))})}function _i(e){var t,n,r=``;if(typeof e==`string`||typeof e==`number`)r+=e;else if(typeof e==`object`)if(Array.isArray(e)){var i=e.length;for(t=0;t=0;){var s=o+a;(o===0||bi.includes(r[o-1]))&&(s===r.length||bi.includes(r[s]))?r=(o===0?``:r.substring(0,o))+r.substring(s+1):o=s}}return r===``?null:r}function Si(e,t=!1){var n=t?` !important;`:`;`,r=``;for(var i of Object.keys(e)){var a=e[i];a!=null&&a!==``&&(r+=` `+i+`: `+a+n)}return r}function Ci(e){return e[0]!==`-`||e[1]!==`-`?e.toLowerCase():e}function wi(e,t){if(t){var n=``,r,i;if(Array.isArray(t)?(r=t[0],i=t[1]):r=t,e){e=String(e).replaceAll(/\s*\/\*.*?\*\/\s*/g,``).trim();var a=!1,o=0,s=!1,c=[];r&&c.push(...Object.keys(r).map(Ci)),i&&c.push(...Object.keys(i).map(Ci));var l=0,u=-1;let t=e.length;for(var d=0;d{Ei(e,e.__value)});t.observe(e,{childList:!0,subtree:!0,attributes:!0,attributeFilter:[`value`]}),Dn(()=>{t.disconnect()})}function Oi(e,t,n=t){var r=new WeakSet,i=!0;Sn(e,`change`,t=>{var i=t?`[selected]`:`:checked`,a;if(e.multiple)a=[].map.call(e.querySelectorAll(i),ki);else{var o=e.querySelector(i)??e.querySelector(`option:not([disabled])`);a=o&&ki(o)}n(a),e.__value=a,Dt!==null&&r.add(Dt)}),jn(()=>{var a=t();if(e===document.activeElement){var o=Re?Ot:Dt;if(r.has(o))return}if(Ei(e,a,i),i&&a===void 0){var s=e.querySelector(`:checked`);s!==null&&(a=ki(s),n(a))}e.__value=a,i=!1}),Di(e)}function ki(e){return`__value`in e?e.__value:e.value}var Ai=Symbol(`class`),ji=Symbol(`style`),Mi=Symbol(`is custom element`),Ni=Symbol(`is html`),Pi=N?`link`:`LINK`,Fi=N?`input`:`INPUT`,Ii=N?`option`:`OPTION`,Li=N?`select`:`SELECT`,Ri=N?`progress`:`PROGRESS`;function zi(e){if(P){var t=!1,n=()=>{if(!t){if(t=!0,e.hasAttribute(`value`)){var n=e.value;Q(e,`value`,null),e.value=n}if(e.hasAttribute(`checked`)){var r=e.checked;Q(e,`checked`,null),e.checked=r}}};e[oe]=n,Xe(n),bn()}}function Bi(e,t){var n=Wi(e);n.value===(n.value=t??void 0)||e.value===t&&(t!==0||e.nodeName!==Ri)||(e.value=t??``)}function Vi(e,t){t?e.hasAttribute(`selected`)||e.setAttribute(`selected`,``):e.removeAttribute(`selected`)}function Q(e,t,n,r){var i=Wi(e);P&&(i[t]=e.getAttribute(t),t===`src`||t===`srcset`||t===`href`&&e.nodeName===Pi)||i[t]!==(i[t]=n)&&(t===`loading`&&(e[ne]=n),n==null?e.removeAttribute(t):typeof n!=`string`&&Ki(e).includes(t)?e[t]=n:e.setAttribute(t,n))}function Hi(e,t,n,r,i=!1,a=!1){if(P&&i&&e.nodeName===Fi){var o=e;(o.type===`checkbox`?`defaultChecked`:`defaultValue`)in n||zi(o)}var s=Wi(e),c=s[Mi],l=!s[Ni];let u=P&&c;u&&Oe(!1);var d=t||{},f=e.nodeName===Ii;for(var p in t)p in n||(n[p]=null);n.class?n.class=yi(n.class):(r||n[Ai])&&(n.class=null),n[ji]&&(n.style??=null);var m=Ki(e);if(e.nodeName===Fi&&`type`in n&&(`value`in n||`__value`in n)){var h=n.type;(h!==d.type||h===void 0&&e.hasAttribute(`type`))&&(d.type=h,Q(e,`type`,h,a))}for(let i in n){let o=n[i];if(f&&i===`value`&&o==null){e.value=e.__value=``,d[i]=o;continue}if(i===`class`){X(e,e.namespaceURI===`http://www.w3.org/1999/xhtml`,o,r,t?.[Ai],n[Ai]),d[i]=o,d[Ai]=n[Ai];continue}if(i===`style`){Z(e,o,t?.[ji],n[ji]),d[i]=o,d[ji]=n[ji];continue}var g=d[i];if(!(o===g&&!(o===void 0&&e.hasAttribute(i)))){d[i]=o;var _=i[0]+i[1];if(_!==`$$`)if(_===`on`){let t={},n=`$$`+i,r=i.slice(2);var v=Er(r);if(wr(r)&&(r=r.slice(0,-7),t.capture=!0),!v&&g){if(o!=null)continue;e.removeEventListener(r,d[n],t),d[n]=null}if(v)W(r,e,o),Br([r]);else if(o!=null){function a(e){d[i].call(this,e)}d[n]=Rr(r,e,a,t)}}else if(i===`style`)Q(e,i,o);else if(i===`autofocus`)vn(e,!!o);else if(!c&&(i===`__value`||i===`value`&&o!=null))e.value=e.__value=o;else if(i===`selected`&&f)Vi(e,o);else{var y=i;l||(y=kr(y));var b=y===`defaultValue`||y===`defaultChecked`;if(o==null&&!c&&!b)if(s[i]=null,y===`value`||y===`checked`){let n=e,r=t===void 0;if(y===`value`){let e=n.defaultValue;n.removeAttribute(y),n.defaultValue=e,n.value=n.__value=r?e:null}else{let e=n.defaultChecked;n.removeAttribute(y),n.defaultChecked=e,n.checked=r?e:!1}}else e.removeAttribute(i);else b||m.includes(y)&&(c||typeof o!=`string`)?(e[y]=o,y in s&&(s[y]=xe)):typeof o!=`function`&&Q(e,y,o,a)}}}return u&&Oe(!0),d}function Ui(e,t,n=[],r=[],i=[],a,o=!1,s=!1){ft(i,n,r,n=>{var r=void 0,i={},c=e.nodeName===Li,l=!1;if(Fn(()=>{var u=t(...n.map(U)),d=Hi(e,r,u,a,o,s);l&&c&&`value`in u&&Ei(e,u.value);for(let e of Object.getOwnPropertySymbols(i))u[e]||Bn(i[e]);for(let t of Object.getOwnPropertySymbols(u)){var f=u[t];t.description===`@attach`&&(!r||f!==r[t])&&(i[t]&&Bn(i[t]),i[t]=In(()=>gi(e,()=>f))),d[t]=f}r=d}),c){var u=e;jn(()=>{Ei(u,r.value,!0),Di(u)})}l=!0})}function Wi(e){return e[M]??={[Mi]:e.nodeName.includes(`-`),[Ni]:e.namespaceURI===Se}}var Gi=new Map;function Ki(e){var t=e.getAttribute(`is`)||e.nodeName,n=Gi.get(t);if(n)return n;Gi.set(t,n=[]);for(var r,i=e,a=Element.prototype;a!==i;){for(var s in r=o(i),r)r[s].set&&s!==`innerHTML`&&s!==`textContent`&&s!==`innerText`&&n.push(s);i=l(i)}return n}function qi(e,t,n=t){var r=new WeakSet;Sn(e,`input`,async i=>{var a=i?e.defaultValue:e.value;if(a=Yi(e)?Xi(a):a,n(a),Dt!==null&&r.add(Dt),await br(),a!==(a=t())){var o=e.selectionStart,s=e.selectionEnd,c=e.value.length;if(e.value=a??``,s!==null){var l=e.value.length;o===s&&s===c&&l>c?(e.selectionStart=l,e.selectionEnd=l):(e.selectionStart=o,e.selectionEnd=Math.min(s,l))}}}),(P&&e.defaultValue!==e.value||Cr(t)==null&&e.value)&&(n(Yi(e)?Xi(e.value):e.value),Dt!==null&&r.add(Dt)),Nn(()=>{var n=t();if(e===document.activeElement){var i=Re?Ot:Dt;if(r.has(i))return}Yi(e)&&n===Xi(e.value)||e.type===`date`&&!n&&!e.value||n!==e.value&&(e.value=n??``)})}function Ji(e,t,n=t){Sn(e,`change`,t=>{n(t?e.defaultChecked:e.checked)}),(P&&e.defaultChecked!==e.checked||Cr(t)==null)&&n(e.checked),Nn(()=>{e.checked=!!t()})}function Yi(e){var t=e.type;return t===`number`||t===`range`}function Xi(e){return e===``?null:+e}function Zi(e,t){return e===t||e?.[te]===t}function Qi(e={},t,n,r){var i=Be.r,a=tr;return jn(()=>{var o,s;return Nn(()=>{o=s,s=r?.()||[],Cr(()=>{Zi(n(...s),e)||(t(e,...s),o&&Zi(n(...o),e)&&t(null,...o))})}),()=>{let r=a;for(;r!==i&&r.parent!==null&&r.parent.f&33554432;)r=r.parent;let o=()=>{s&&Zi(n(...s),e)&&t(null,...s)},c=r.teardown;r.teardown=()=>{o(),c?.()}}}),e}var $i={get(e,t){if(!e.exclude.has(t))return e.props[t]},set(e,t){return!1},getOwnPropertyDescriptor(e,t){if(!e.exclude.has(t)&&t in e.props)return{enumerable:!0,configurable:!0,value:e.props[t]}},has(e,t){return e.exclude.has(t)?!1:t in e.props},ownKeys(e){return Reflect.ownKeys(e.props).filter(t=>!e.exclude.has(t))}};function ea(e,t,n){return new Proxy({props:e,exclude:t},$i)}var ta={get(e,t){let n=e.props.length;for(;n--;){let r=e.props[n];if(d(r)&&(r=r()),typeof r==`object`&&r&&t in r)return r[t]}},set(e,t,n){let r=e.props.length;for(;r--;){let i=e.props[r];d(i)&&(i=i());let o=a(i,t);if(o&&o.set)return o.set(n),!0}return!1},getOwnPropertyDescriptor(e,t){let n=e.props.length;for(;n--;){let r=e.props[n];if(d(r)&&(r=r()),typeof r==`object`&&r&&t in r){let e=a(r,t);return e&&!e.configurable&&(e.configurable=!0),e}}},has(e,t){if(t===te||t===j)return!1;for(let n of e.props)if(d(n)&&(n=n()),n!=null&&t in n)return!0;return!1},ownKeys(e){let t=[];for(let n of e.props)if(d(n)&&(n=n()),n){for(let e in n)t.includes(e)||t.push(e);for(let e of Object.getOwnPropertySymbols(n))t.includes(e)||t.push(e)}return t}};function na(...e){return new Proxy({props:e},ta)}function ra(e,t,n,r){var i=!ze||(n&2)!=0,o=(n&8)!=0,s=(n&16)!=0,c=r,l=!0,u=void 0,d=()=>s&&i?(u??=gt(r),U(u)):(l&&(l=!1,c=s?Cr(r):r),c);let f;if(o){var p=te in e||j in e;f=a(e,t)?.set??(p&&t in e?n=>e[t]=n:void 0)}var m,h=!1;o?[m,h]=st(()=>e[t]):m=e[t],m===void 0&&r!==void 0&&(m=d(),f&&(i&&he(t),f(m)));var g=i?()=>{var n=e[t];return n===void 0?d():(l=!0,n)}:()=>{var n=e[t];return n!==void 0&&(c=void 0),n===void 0?c:n};if(i&&!(n&4))return g;if(f){var _=e.$$legacy;return(function(e,t){return arguments.length>0?((!i||!t||_||h)&&f(t?g():e),e):g()})}var v=!1,y=(n&1?gt:yt)(()=>(v=!1,g()));o&&U(y);var b=tr;return(function(e,t){if(arguments.length>0){let n=t?U(y):i&&o?nn(e):e;return R(y,n),v=!0,c!==void 0&&(c=n),e}return Xn&&v||b.f&16384?y.v:U(y)})}function ia(e){Be===null&&ce(`onMount`),ze&&Be.l!==null?aa(Be).m.push(e):On(()=>{let t=Cr(e);if(typeof t==`function`)return t})}function aa(e){var t=e.l;return t.u??={a:[],b:[],m:[]}}typeof window<`u`&&((window.__svelte??={}).v??=new Set).add(`5`);var oa={xmlns:`http://www.w3.org/2000/svg`,width:24,height:24,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":2,"stroke-linecap":`round`,"stroke-linejoin":`round`},sa=e=>{for(let t in e)if(t.startsWith(`aria-`)||t===`role`||t===`title`)return!0;return!1},ca=Symbol(`lucide-context`),la=()=>He(ca),ua=new Set([`$$slots`,`$$events`,`$$legacy`,`name`,`color`,`size`,`strokeWidth`,`absoluteStrokeWidth`,`iconNode`,`children`]),da=Jr(``);function fa(e,t){Ue(t,!0);let n=la()??{},r=ra(t,`color`,19,()=>n.color??`currentColor`),i=ra(t,`size`,19,()=>n.size??24),a=ra(t,`strokeWidth`,19,()=>n.strokeWidth??2),o=ra(t,`absoluteStrokeWidth`,19,()=>n.absoluteStrokeWidth??!1),s=ra(t,`iconNode`,19,()=>[]),c=ea(t,ua),l=I(()=>o()?Number(a())*24/Number(i()):a());var u=da();Ui(u,e=>({...oa,...e,...c,width:i(),height:i(),stroke:r(),"stroke-width":U(l),class:[`lucide-icon lucide`,n.class,t.name&&`lucide-${t.name}`,t.class]}),[()=>!t.children&&!sa(c)&&{"aria-hidden":`true`}]);var d=z(u);Y(d,17,s,ii,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=Xr();hi(B(a),r,!0,(e,t)=>{Ui(e,()=>({...i()}))}),K(e,a)}),pi(V(d),()=>t.children??f),F(u),K(e,u),We()}var pa=new Set([`$$slots`,`$$events`,`$$legacy`]);function ma(e,t){let n=ea(t,pa),r=[[`path`,{d:`M10 22V7a1 1 0 0 0-1-1H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-5a1 1 0 0 0-1-1H2`}],[`rect`,{x:`14`,y:`2`,width:`8`,height:`8`,rx:`1`}]];fa(e,na({name:`blocks`},()=>n,{get iconNode(){return r}}))}var ha=new Set([`$$slots`,`$$events`,`$$legacy`]);function ga(e,t){let n=ea(t,ha),r=[[`path`,{d:`M12 7v14`}],[`path`,{d:`M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z`}]];fa(e,na({name:`book-open`},()=>n,{get iconNode(){return r}}))}var _a=new Set([`$$slots`,`$$events`,`$$legacy`]);function va(e,t){let n=ea(t,_a),r=[[`path`,{d:`M20 6 9 17l-5-5`}]];fa(e,na({name:`check`},()=>n,{get iconNode(){return r}}))}var ya=new Set([`$$slots`,`$$events`,`$$legacy`]);function ba(e,t){let n=ea(t,ya),r=[[`path`,{d:`m9 18 6-6-6-6`}]];fa(e,na({name:`chevron-right`},()=>n,{get iconNode(){return r}}))}var xa=new Set([`$$slots`,`$$events`,`$$legacy`]);function Sa(e,t){let n=ea(t,xa),r=[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}],[`path`,{d:`M12 3v18`}]];fa(e,na({name:`columns-2`},()=>n,{get iconNode(){return r}}))}var Ca=new Set([`$$slots`,`$$events`,`$$legacy`]);function wa(e,t){let n=ea(t,Ca),r=[[`path`,{d:`M15.536 11.293a1 1 0 0 0 0 1.414l2.376 2.377a1 1 0 0 0 1.414 0l2.377-2.377a1 1 0 0 0 0-1.414l-2.377-2.377a1 1 0 0 0-1.414 0z`}],[`path`,{d:`M2.297 11.293a1 1 0 0 0 0 1.414l2.377 2.377a1 1 0 0 0 1.414 0l2.377-2.377a1 1 0 0 0 0-1.414L6.088 8.916a1 1 0 0 0-1.414 0z`}],[`path`,{d:`M8.916 17.912a1 1 0 0 0 0 1.415l2.377 2.376a1 1 0 0 0 1.414 0l2.377-2.376a1 1 0 0 0 0-1.415l-2.377-2.376a1 1 0 0 0-1.414 0z`}],[`path`,{d:`M8.916 4.674a1 1 0 0 0 0 1.414l2.377 2.376a1 1 0 0 0 1.414 0l2.377-2.376a1 1 0 0 0 0-1.414l-2.377-2.377a1 1 0 0 0-1.414 0z`}]];fa(e,na({name:`component`},()=>n,{get iconNode(){return r}}))}var Ta=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ea(e,t){let n=ea(t,Ta),r=[[`rect`,{width:`14`,height:`14`,x:`8`,y:`8`,rx:`2`,ry:`2`}],[`path`,{d:`M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2`}]];fa(e,na({name:`copy`},()=>n,{get iconNode(){return r}}))}var Da=new Set([`$$slots`,`$$events`,`$$legacy`]);function Oa(e,t){let n=ea(t,Da),r=[[`path`,{d:`M12 15V3`}],[`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`}],[`path`,{d:`m7 10 5 5 5-5`}]];fa(e,na({name:`download`},()=>n,{get iconNode(){return r}}))}var ka=new Set([`$$slots`,`$$events`,`$$legacy`]);function Aa(e,t){let n=ea(t,ka),r=[[`path`,{d:`M15 3h6v6`}],[`path`,{d:`M10 14 21 3`}],[`path`,{d:`M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6`}]];fa(e,na({name:`external-link`},()=>n,{get iconNode(){return r}}))}var ja=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ma(e,t){let n=ea(t,ja),r=[[`path`,{d:`M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0`}],[`circle`,{cx:`12`,cy:`12`,r:`3`}]];fa(e,na({name:`eye`},()=>n,{get iconNode(){return r}}))}var Na=new Set([`$$slots`,`$$events`,`$$legacy`]);function Pa(e,t){let n=ea(t,Na),r=[[`path`,{d:`m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2`}]];fa(e,na({name:`folder-open`},()=>n,{get iconNode(){return r}}))}var Fa=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ia(e,t){let n=ea(t,Fa),r=[[`path`,{d:`M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z`}],[`path`,{d:`M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12`}],[`path`,{d:`M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17`}]];fa(e,na({name:`layers`},()=>n,{get iconNode(){return r}}))}var La=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ra(e,t){let n=ea(t,La),r=[[`path`,{d:`M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71`}],[`path`,{d:`M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71`}]];fa(e,na({name:`link`},()=>n,{get iconNode(){return r}}))}var za=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ba(e,t){let n=ea(t,za),r=[[`path`,{d:`M3 5h.01`}],[`path`,{d:`M3 12h.01`}],[`path`,{d:`M3 19h.01`}],[`path`,{d:`M8 5h13`}],[`path`,{d:`M8 12h13`}],[`path`,{d:`M8 19h13`}]];fa(e,na({name:`list`},()=>n,{get iconNode(){return r}}))}var Va=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ha(e,t){let n=ea(t,Va),r=[[`rect`,{width:`20`,height:`14`,x:`2`,y:`3`,rx:`2`}],[`line`,{x1:`8`,x2:`16`,y1:`21`,y2:`21`}],[`line`,{x1:`12`,x2:`12`,y1:`17`,y2:`21`}]];fa(e,na({name:`monitor`},()=>n,{get iconNode(){return r}}))}var Ua=new Set([`$$slots`,`$$events`,`$$legacy`]);function Wa(e,t){let n=ea(t,Ua),r=[[`path`,{d:`M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401`}]];fa(e,na({name:`moon`},()=>n,{get iconNode(){return r}}))}var Ga=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ka(e,t){let n=ea(t,Ga),r=[[`path`,{d:`M11 21.73a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73z`}],[`path`,{d:`M12 22V12`}],[`polyline`,{points:`3.29 7 12 12 20.71 7`}],[`path`,{d:`m7.5 4.27 9 5.15`}]];fa(e,na({name:`package`},()=>n,{get iconNode(){return r}}))}var qa=new Set([`$$slots`,`$$events`,`$$legacy`]);function Ja(e,t){let n=ea(t,qa),r=[[`path`,{d:`M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z`}],[`circle`,{cx:`13.5`,cy:`6.5`,r:`.5`,fill:`currentColor`}],[`circle`,{cx:`17.5`,cy:`10.5`,r:`.5`,fill:`currentColor`}],[`circle`,{cx:`6.5`,cy:`12.5`,r:`.5`,fill:`currentColor`}],[`circle`,{cx:`8.5`,cy:`7.5`,r:`.5`,fill:`currentColor`}]];fa(e,na({name:`palette`},()=>n,{get iconNode(){return r}}))}var Ya=new Set([`$$slots`,`$$events`,`$$legacy`]);function Xa(e,t){let n=ea(t,Ya),r=[[`path`,{d:`M15.39 4.39a1 1 0 0 0 1.68-.474 2.5 2.5 0 1 1 3.014 3.015 1 1 0 0 0-.474 1.68l1.683 1.682a2.414 2.414 0 0 1 0 3.414L19.61 15.39a1 1 0 0 1-1.68-.474 2.5 2.5 0 1 0-3.014 3.015 1 1 0 0 1 .474 1.68l-1.683 1.682a2.414 2.414 0 0 1-3.414 0L8.61 19.61a1 1 0 0 0-1.68.474 2.5 2.5 0 1 1-3.014-3.015 1 1 0 0 0 .474-1.68l-1.683-1.682a2.414 2.414 0 0 1 0-3.414L4.39 8.61a1 1 0 0 1 1.68.474 2.5 2.5 0 1 0 3.014-3.015 1 1 0 0 1-.474-1.68l1.683-1.682a2.414 2.414 0 0 1 3.414 0z`}]];fa(e,na({name:`puzzle`},()=>n,{get iconNode(){return r}}))}var Za=new Set([`$$slots`,`$$events`,`$$legacy`]);function Qa(e,t){let n=ea(t,Za),r=[[`path`,{d:`m15 14 5-5-5-5`}],[`path`,{d:`M20 9H9.5A5.5 5.5 0 0 0 4 14.5A5.5 5.5 0 0 0 9.5 20H13`}]];fa(e,na({name:`redo-2`},()=>n,{get iconNode(){return r}}))}var $a=new Set([`$$slots`,`$$events`,`$$legacy`]);function eo(e,t){let n=ea(t,$a),r=[[`path`,{d:`M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8`}],[`path`,{d:`M21 3v5h-5`}],[`path`,{d:`M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16`}],[`path`,{d:`M8 16H3v5`}]];fa(e,na({name:`refresh-cw`},()=>n,{get iconNode(){return r}}))}var to=new Set([`$$slots`,`$$events`,`$$legacy`]);function no(e,t){let n=ea(t,to),r=[[`path`,{d:`M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`}],[`path`,{d:`M3 3v5h5`}]];fa(e,na({name:`rotate-ccw`},()=>n,{get iconNode(){return r}}))}var ro=new Set([`$$slots`,`$$events`,`$$legacy`]);function io(e,t){let n=ea(t,ro),r=[[`path`,{d:`M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z`}],[`path`,{d:`m14.5 12.5 2-2`}],[`path`,{d:`m11.5 9.5 2-2`}],[`path`,{d:`m8.5 6.5 2-2`}],[`path`,{d:`m17.5 15.5 2-2`}]];fa(e,na({name:`ruler`},()=>n,{get iconNode(){return r}}))}var ao=new Set([`$$slots`,`$$events`,`$$legacy`]);function oo(e,t){let n=ea(t,ao),r=[[`path`,{d:`M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z`}],[`path`,{d:`M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7`}],[`path`,{d:`M7 3v4a1 1 0 0 0 1 1h7`}]];fa(e,na({name:`save`},()=>n,{get iconNode(){return r}}))}var so=new Set([`$$slots`,`$$events`,`$$legacy`]);function co(e,t){let n=ea(t,so),r=[[`circle`,{cx:`18`,cy:`5`,r:`3`}],[`circle`,{cx:`6`,cy:`12`,r:`3`}],[`circle`,{cx:`18`,cy:`19`,r:`3`}],[`line`,{x1:`8.59`,x2:`15.42`,y1:`13.51`,y2:`17.49`}],[`line`,{x1:`15.41`,x2:`8.59`,y1:`6.51`,y2:`10.49`}]];fa(e,na({name:`share-2`},()=>n,{get iconNode(){return r}}))}var lo=new Set([`$$slots`,`$$events`,`$$legacy`]);function uo(e,t){let n=ea(t,lo),r=[[`path`,{d:`M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z`}],[`path`,{d:`m9 12 2 2 4-4`}]];fa(e,na({name:`shield-check`},()=>n,{get iconNode(){return r}}))}var fo=new Set([`$$slots`,`$$events`,`$$legacy`]);function po(e,t){let n=ea(t,fo),r=[[`path`,{d:`M10 5H3`}],[`path`,{d:`M12 19H3`}],[`path`,{d:`M14 3v4`}],[`path`,{d:`M16 17v4`}],[`path`,{d:`M21 12h-9`}],[`path`,{d:`M21 19h-5`}],[`path`,{d:`M21 5h-7`}],[`path`,{d:`M8 10v4`}],[`path`,{d:`M8 12H3`}]];fa(e,na({name:`sliders-horizontal`},()=>n,{get iconNode(){return r}}))}var mo=new Set([`$$slots`,`$$events`,`$$legacy`]);function ho(e,t){let n=ea(t,mo),r=[[`rect`,{width:`14`,height:`20`,x:`5`,y:`2`,rx:`2`,ry:`2`}],[`path`,{d:`M12 18h.01`}]];fa(e,na({name:`smartphone`},()=>n,{get iconNode(){return r}}))}var go=new Set([`$$slots`,`$$events`,`$$legacy`]);function _o(e,t){let n=ea(t,go),r=[[`path`,{d:`M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z`}],[`path`,{d:`M20 2v4`}],[`path`,{d:`M22 4h-4`}],[`circle`,{cx:`4`,cy:`20`,r:`2`}]];fa(e,na({name:`sparkles`},()=>n,{get iconNode(){return r}}))}var vo=new Set([`$$slots`,`$$events`,`$$legacy`]);function yo(e,t){let n=ea(t,vo),r=[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}]];fa(e,na({name:`square`},()=>n,{get iconNode(){return r}}))}var bo=new Set([`$$slots`,`$$events`,`$$legacy`]);function xo(e,t){let n=ea(t,bo),r=[[`circle`,{cx:`12`,cy:`12`,r:`4`}],[`path`,{d:`M12 2v2`}],[`path`,{d:`M12 20v2`}],[`path`,{d:`m4.93 4.93 1.41 1.41`}],[`path`,{d:`m17.66 17.66 1.41 1.41`}],[`path`,{d:`M2 12h2`}],[`path`,{d:`M20 12h2`}],[`path`,{d:`m6.34 17.66-1.41 1.41`}],[`path`,{d:`m19.07 4.93-1.41 1.41`}]];fa(e,na({name:`sun`},()=>n,{get iconNode(){return r}}))}var So=new Set([`$$slots`,`$$events`,`$$legacy`]);function Co(e,t){let n=ea(t,So),r=[[`path`,{d:`M11 17a4 4 0 0 1-8 0V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2Z`}],[`path`,{d:`M16.7 13H19a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2H7`}],[`path`,{d:`M 7 17h.01`}],[`path`,{d:`m11 8 2.3-2.3a2.4 2.4 0 0 1 3.404.004L18.6 7.6a2.4 2.4 0 0 1 .026 3.434L9.9 19.8`}]];fa(e,na({name:`swatch-book`},()=>n,{get iconNode(){return r}}))}var wo=new Set([`$$slots`,`$$events`,`$$legacy`]);function To(e,t){let n=ea(t,wo),r=[[`rect`,{width:`16`,height:`20`,x:`4`,y:`2`,rx:`2`,ry:`2`}],[`line`,{x1:`12`,x2:`12.01`,y1:`18`,y2:`18`}]];fa(e,na({name:`tablet`},()=>n,{get iconNode(){return r}}))}var Eo=new Set([`$$slots`,`$$events`,`$$legacy`]);function Do(e,t){let n=ea(t,Eo),r=[[`path`,{d:`M10 11v6`}],[`path`,{d:`M14 11v6`}],[`path`,{d:`M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6`}],[`path`,{d:`M3 6h18`}],[`path`,{d:`M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2`}]];fa(e,na({name:`trash-2`},()=>n,{get iconNode(){return r}}))}var Oo=new Set([`$$slots`,`$$events`,`$$legacy`]);function ko(e,t){let n=ea(t,Oo),r=[[`path`,{d:`M12 4v16`}],[`path`,{d:`M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2`}],[`path`,{d:`M9 20h6`}]];fa(e,na({name:`type`},()=>n,{get iconNode(){return r}}))}var Ao=new Set([`$$slots`,`$$events`,`$$legacy`]);function jo(e,t){let n=ea(t,Ao),r=[[`path`,{d:`M9 14 4 9l5-5`}],[`path`,{d:`M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11`}]];fa(e,na({name:`undo-2`},()=>n,{get iconNode(){return r}}))}var Mo=new Set([`$$slots`,`$$events`,`$$legacy`]);function No(e,t){let n=ea(t,Mo),r=[[`path`,{d:`M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z`}]];fa(e,na({name:`zap`},()=>n,{get iconNode(){return r}}))}var Po=new Set([`$$slots`,`$$events`,`$$legacy`]);function Fo(e,t){let n=ea(t,Po),r=[[`path`,{d:`M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8`}],[`path`,{d:`M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z`}]];fa(e,na({name:`house`},()=>n,{get iconNode(){return r}}))}var Io=new Set([`$$slots`,`$$events`,`$$legacy`]);function Lo(e,t){let n=ea(t,Io),r=[[`path`,{d:`M21 12a9 9 0 1 1-6.219-8.56`}]];fa(e,na({name:`loader-circle`},()=>n,{get iconNode(){return r}}))}var Ro=new Set([`$$slots`,`$$events`,`$$legacy`]);function zo(e,t){let n=ea(t,Ro),r=[[`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}],[`path`,{d:`M3 9h18`}],[`path`,{d:`M9 21V9`}]];fa(e,na({name:`panels-top-left`},()=>n,{get iconNode(){return r}}))}var Bo=new Set([`$$slots`,`$$events`,`$$legacy`]);function Vo(e,t){let n=ea(t,Bo),r=[[`path`,{d:`m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3`}],[`path`,{d:`M12 9v4`}],[`path`,{d:`M12 17h.01`}]];fa(e,na({name:`triangle-alert`},()=>n,{get iconNode(){return r}}))}var Ho=`slashed-studio-theme`;function Uo(){try{let e=localStorage.getItem(Ho);return e===`light`||e===`dark`?e:null}catch{return null}}function Wo(){return typeof matchMedia<`u`&&matchMedia(`(prefers-color-scheme: dark)`).matches?`dark`:`light`}var Go=Uo(),Ko=Go===null,qo=nn({value:Go??Wo()}),Jo=null;function Yo(){Jo?.classList.toggle(`dark`,qo.value===`dark`)}function Xo(e){Jo=e,Yo()}function Zo(e){Ko=!1;try{localStorage.setItem(Ho,e)}catch{}qo.value=e,Yo()}function Qo(){Zo(qo.value===`dark`?`light`:`dark`)}function $o(e){Ko=!1,qo.value=e,Yo()}if(typeof matchMedia<`u`){let e=matchMedia(`(prefers-color-scheme: dark)`),t=e=>{Ko&&(qo.value=e.matches?`dark`:`light`,Yo())};typeof e.addEventListener==`function`?e.addEventListener(`change`,t):typeof e.addListener==`function`&&e.addListener(t)}var es=G(``),ts=G(` Saving…`,1),ns=G(` Saved`,1),rs=G(` Save failed`,1),is=G(` Save`,1),as=G(``),os=G(`
/
`,1);function ss(e,t){Ue(t,!0);let n=window.__SLASHED_FW_VERSION__===void 0?``:window.__SLASHED_FW_VERSION__,r=L(!1),i=L(!1),a=L(null),o=L(null);On(()=>{U(i)&&br().then(()=>U(a)?.focus())});async function s(){try{await navigator.clipboard.writeText(window.location.href),R(r,!0),setTimeout(()=>{R(r,!1)},2e3)}catch{}}function c(){R(i,!0)}function l(){R(i,!1),t.onResetAll()}function u(){R(i,!1)}var d=os(),f=B(d),p=V(z(f),2),m=z(p),h=V(z(m)),g=z(h);F(h),F(m),Me(2),F(p);var _=V(p,2),v=e=>{var n=es(),r=z(n),i=z(r,!0);F(r),Me(3),F(n),H(()=>q(i,t.overridesCount)),W(`click`,n,function(...e){t.onExport?.apply(this,e)}),K(e,n)};J(_,e=>{t.overridesCount>0&&e(v)});var y=V(_,4),b=z(y),x=z(b),S=e=>{var t=ts();Lo(B(t),{class:`w-3.5 h-3.5 animate-spin`}),Me(),K(e,t)},C=e=>{var t=ns();va(B(t),{class:`w-3.5 h-3.5`}),Me(),K(e,t)},w=e=>{var t=rs();Vo(B(t),{class:`w-3.5 h-3.5`}),Me(),K(e,t)},T=e=>{var t=is();oo(B(t),{class:`w-3.5 h-3.5`}),Me(),K(e,t)};J(x,e=>{t.saveState===`saving`?e(S):t.saveState===`saved`?e(C,1):t.saveState===`error`?e(w,2):e(T,-1)}),F(b);var E=V(b,2);jo(z(E),{class:`w-3.5 h-3.5`}),F(E);var D=V(E,2);Qa(z(D),{class:`w-3.5 h-3.5`}),F(D);var O=V(D,4),k=z(O),A=e=>{va(e,{class:`w-3.5 h-3.5 text-emerald-600 dark:text-emerald-400`})},ee=e=>{co(e,{class:`w-3.5 h-3.5`})};J(k,e=>{U(r)?e(A):e(ee,-1)}),F(O);var te=V(O,2);Pa(z(te),{class:`w-3.5 h-3.5`}),F(te);var j=V(te,2);Do(z(j),{class:`w-3.5 h-3.5`}),F(j);var ne=V(j,4),M=z(ne),re=e=>{xo(e,{class:`w-3.5 h-3.5`})},ie=e=>{Wa(e,{class:`w-3.5 h-3.5`})};J(M,e=>{qo.value===`dark`?e(re):e(ie,-1)}),F(ne),F(y),F(f);var ae=V(f,2),oe=e=>{var n=as(),r=z(n),i=V(z(r),2),s=z(i);F(i);var c=V(i,2),d=z(c);Qi(d,e=>R(a,e),()=>U(a));var f=V(d,2);Qi(f,e=>R(o,e),()=>U(o)),F(c),F(r),F(n),H(()=>q(s,`This will clear all ${t.overridesCount??``} customisation${t.overridesCount===1?``:`s`}. + You can still undo this before saving.`)),W(`click`,n,e=>{e.target===e.currentTarget&&u()}),W(`keydown`,n,e=>{e.key===`Escape`&&(e.stopPropagation(),u()),e.key===`Tab`&&(e.preventDefault(),document.activeElement===U(a)?U(o)?.focus():U(a)?.focus())}),W(`click`,d,u),W(`click`,f,l),K(e,n)};J(ae,e=>{U(i)&&e(oe)}),H(e=>{q(g,`v${n??``}`),b.disabled=!t.hasPendingChanges||t.saveState===`saving`,Q(b,`title`,t.saveState===`error`?`Save failed — click to retry`:t.hasPendingChanges?`Save changes (Ctrl+S)`:`No unsaved changes`),X(b,1,e),E.disabled=!t.canUndo,D.disabled=!t.canRedo,j.disabled=t.overridesCount===0,Q(ne,`title`,qo.value===`dark`?`Switch to light mode`:`Switch to dark mode`),Q(ne,`aria-label`,qo.value===`dark`?`Switch to light mode`:`Switch to dark mode`),Q(ne,`aria-pressed`,qo.value===`dark`)},[()=>yi([`flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[11px] font-bold transition-colors cursor-pointer`,t.saveState===`error`?`bg-red-100 dark:bg-red-900/40 border border-red-500/30 text-red-700 dark:text-red-300`:t.saveState===`saved`?`bg-emerald-100 dark:bg-emerald-900/40 border border-emerald-500/30 text-emerald-700 dark:text-emerald-300`:t.hasPendingChanges?`bg-emerald-600 hover:bg-emerald-500 text-white shadow-sm shadow-emerald-600/30`:`bg-black/5 dark:bg-white/5 text-slate-500 disabled:opacity-40 disabled:pointer-events-none`].join(` `))]),W(`click`,b,function(...e){t.onSave?.apply(this,e)}),W(`click`,E,function(...e){t.onUndo?.apply(this,e)}),W(`click`,D,function(...e){t.onRedo?.apply(this,e)}),W(`click`,O,s),W(`click`,te,function(...e){t.onImport?.apply(this,e)}),W(`click`,j,c),W(`click`,ne,function(...e){Qo?.apply(this,e)}),K(e,d),We()}Br([`click`,`keydown`]);var cs=G(` `),ls=G(``),us=G(``);function ds(e,t){Ue(t,!0);let n=ra(t,`overridesByDomain`,19,()=>({})),r=[{id:`home`,icon:Fo,label:`Home`,group:`tokens`},{id:`colors`,icon:Ja,label:`Colors`,group:`tokens`},{id:`typography`,icon:ko,label:`Typography`,group:`tokens`},{id:`spacing`,icon:io,label:`Spacing`,group:`tokens`},{id:`layout`,icon:zo,label:`Layout`,group:`tokens`},{id:`borders`,icon:yo,label:`Borders`,group:`tokens`},{id:`shadows`,icon:Ia,label:`Shadows`,group:`tokens`},{id:`motion`,icon:No,label:`Motion`,group:`tokens`},{id:`effects`,icon:_o,label:`Effects`,group:`tokens`},{id:`macros`,icon:ma,label:`Macros`,group:`tokens`},{id:`misc`,icon:Xa,label:`Misc`,group:`tokens`},{id:`components`,icon:wa,label:`Components`,group:`tokens`},{id:`themes`,icon:Co,label:`Themes`,group:`tools`},{id:`wcag`,icon:uo,label:`WCAG`,group:`tools`},{id:`setup`,icon:Ka,label:`Install`,group:`tools`},{id:`cheatsheet`,icon:ga,label:`Classes`,group:`tools`}],i=I(()=>r.filter(e=>e.group===`tokens`)),a=I(()=>r.filter(e=>e.group===`tools`));var o=us(),s=z(o);Y(s,21,()=>U(i),e=>e.id,(e,r)=>{let i=I(()=>t.activeId===U(r).id),a=I(()=>n()[U(r).id]||0),o=I(()=>U(r).icon);var s=ls(),c=z(s);mi(c,()=>U(o),(e,t)=>{t(e,{class:`w-4 h-4`})});var l=V(c,2),u=e=>{var t=cs(),n=z(t,!0);F(t),H(()=>q(n,U(a)>9?`+`:U(a))),K(e,t)};J(l,e=>{U(a)>0&&!U(i)&&e(u)});var d=V(l,2),f=z(d,!0);F(d),F(s),H(()=>{Q(s,`title`,U(r).label),X(s,1,`relative w-10 h-10 flex items-center justify-center rounded-xl transition-all cursor-pointer group ${U(i)?`bg-indigo-600 text-white shadow-lg shadow-indigo-600/30`:`text-slate-500 hover:text-slate-800 dark:hover:text-slate-200 hover:bg-black/8 dark:hover:bg-white/8`}`),q(f,U(r).label)}),W(`click`,s,()=>t.onSelect(U(r).id)),K(e,s)}),F(s);var c=V(s,4);Y(c,21,()=>U(a),e=>e.id,(e,r)=>{let i=I(()=>t.activeId===U(r).id),a=I(()=>n()[U(r).id]||0),o=I(()=>U(r).icon);var s=ls(),c=z(s);mi(c,()=>U(o),(e,t)=>{t(e,{class:`w-4 h-4`})});var l=V(c,2),u=e=>{var t=cs(),n=z(t,!0);F(t),H(()=>q(n,U(a)>9?`+`:U(a))),K(e,t)};J(l,e=>{U(a)>0&&!U(i)&&e(u)});var d=V(l,2),f=z(d,!0);F(d),F(s),H(()=>{Q(s,`title`,U(r).label),X(s,1,`relative w-10 h-10 flex items-center justify-center rounded-xl transition-all cursor-pointer group ${U(i)?`bg-indigo-600 text-white shadow-lg shadow-indigo-600/30`:`text-slate-500 hover:text-slate-800 dark:hover:text-slate-200 hover:bg-black/8 dark:hover:bg-white/8`}`),q(f,U(r).label)}),W(`click`,s,()=>t.onSelect(U(r).id)),K(e,s)}),F(c),F(o),K(e,o),We()}Br([`click`]);var fs=G(` `),ps=G(`
Live
`);function ms(e,t){var n=ps(),r=V(z(n),2),i=z(r),a=e=>{var n=fs(),r=z(n);F(n),H(()=>q(r,`${t.overridesCount??``} override${t.overridesCount===1?``:`s`} active`)),K(e,n)},o=e=>{K(e,Yr(`No overrides — showing framework defaults`))};J(i,e=>{t.overridesCount>0?e(a):e(o,-1)}),F(r);var s=V(r,4),c=z(s,!0);F(s),F(n),H(()=>q(c,t.domain)),K(e,n)}var hs=Uint8Array,gs=Uint16Array,_s=Int32Array,vs=new hs([0,0,0,0,0,0,0,0,1,1,1,1,2,2,2,2,3,3,3,3,4,4,4,4,5,5,5,5,0,0,0,0]),ys=new hs([0,0,0,0,1,1,2,2,3,3,4,4,5,5,6,6,7,7,8,8,9,9,10,10,11,11,12,12,13,13,0,0]),bs=new hs([16,17,18,0,8,7,9,6,10,5,11,4,12,3,13,2,14,1,15]),xs=function(e,t){for(var n=new gs(31),r=0;r<31;++r)n[r]=t+=1<>1|(ks&21845)<<1;As=(As&52428)>>2|(As&13107)<<2,As=(As&61680)>>4|(As&3855)<<4,Os[ks]=((As&65280)>>8|(As&255)<<8)>>1}for(var js=(function(e,t,n){for(var r=e.length,i=0,a=new gs(t);i>c]=l}else for(s=new gs(r),i=0;i>15-e[i]);return s}),Ms=new hs(288),ks=0;ks<144;++ks)Ms[ks]=8;for(var ks=144;ks<256;++ks)Ms[ks]=9;for(var ks=256;ks<280;++ks)Ms[ks]=7;for(var ks=280;ks<288;++ks)Ms[ks]=8;for(var Ns=new hs(32),ks=0;ks<32;++ks)Ns[ks]=5;var Ps=js(Ms,9,0),Fs=js(Ms,9,1),Is=js(Ns,5,0),Ls=js(Ns,5,1),Rs=function(e){for(var t=e[0],n=1;nt&&(t=e[n]);return t},zs=function(e,t,n){var r=t/8|0;return(e[r]|e[r+1]<<8)>>(t&7)&n},Bs=function(e,t){var n=t/8|0;return(e[n]|e[n+1]<<8|e[n+2]<<16)>>(t&7)},Vs=function(e){return(e+7)/8|0},Hs=function(e,t,n){return(t==null||t<0)&&(t=0),(n==null||n>e.length)&&(n=e.length),new hs(e.subarray(t,n))},Us=[`unexpected EOF`,`invalid block type`,`invalid length/literal`,`invalid distance`,`stream finished`,`no stream handler`,,`no callback`,`invalid UTF-8 data`,`extra field too long`,`date not in range 1980-2099`,`filename too long`,`stream finishing`,`invalid zip data`],Ws=function(e,t,n){var r=Error(t||Us[e]);if(r.code=e,Error.captureStackTrace&&Error.captureStackTrace(r,Ws),!n)throw r;return r},Gs=function(e,t,n,r){var i=e.length,a=r?r.length:0;if(!i||t.f&&!t.l)return n||new hs(0);var o=!n,s=o||t.i!=2,c=t.i;o&&(n=new hs(i*3));var l=function(e){var t=n.length;if(e>t){var r=new hs(Math.max(t*2,e));r.set(n),n=r}},u=t.f||0,d=t.p||0,f=t.b||0,p=t.l,m=t.d,h=t.m,g=t.n,_=i*8;do{if(!p){u=zs(e,d,1);var v=zs(e,d+1,3);if(d+=3,!v){var y=Vs(d)+4,b=e[y-4]|e[y-3]<<8,x=y+b;if(x>i){c&&Ws(0);break}s&&l(f+b),n.set(e.subarray(y,x),f),t.b=f+=b,t.p=d=x*8,t.f=u;continue}else if(v==1)p=Fs,m=Ls,h=9,g=5;else if(v==2){var S=zs(e,d,31)+257,C=zs(e,d+10,15)+4,w=S+zs(e,d+5,31)+1;d+=14;for(var T=new hs(w),E=new hs(19),D=0;D>4;if(y<16)T[D++]=y;else{var te=0,j=0;for(y==16?(j=3+zs(e,d,3),d+=2,te=T[D-1]):y==17?(j=3+zs(e,d,7),d+=3):y==18&&(j=11+zs(e,d,127),d+=7);j--;)T[D++]=te}}var ne=T.subarray(0,S),M=T.subarray(S);h=Rs(ne),g=Rs(M),p=js(ne,h,1),m=js(M,g,1)}else Ws(1);if(d>_){c&&Ws(0);break}}s&&l(f+131072);for(var re=(1<>4;if(d+=te&15,d>_){c&&Ws(0);break}if(te||Ws(2),oe<256)n[f++]=oe;else if(oe==256){ae=d,p=null;break}else{var se=oe-254;if(oe>264){var D=oe-257,N=vs[D];se=zs(e,d,(1<>4;ce||Ws(3),d+=ce&15;var M=Es[le];if(le>3){var N=ys[le];M+=Bs(e,d)&(1<_){c&&Ws(0);break}s&&l(f+131072);var ue=f+se;if(f>8},qs=function(e,t,n){n<<=t&7;var r=t/8|0;e[r]|=n,e[r+1]|=n>>8,e[r+2]|=n>>16},Js=function(e,t){for(var n=[],r=0;rf&&(f=a[r].s);var p=new gs(f+1),m=Ys(n[u-1],p,0);if(m>t){var r=0,h=0,g=m-t,_=1<t)h+=_-(1<>=g;h>0;){var y=a[r].s;p[y]=0&&h;--r){var b=a[r].s;p[b]==t&&(--p[b],++h)}m=t}return{t:new hs(p),l:m}},Ys=function(e,t,n){return e.s==-1?Math.max(Ys(e.l,t,n+1),Ys(e.r,t,n+1)):t[e.s]=n},Xs=function(e){for(var t=e.length;t&&!e[--t];);for(var n=new gs(++t),r=0,i=e[0],a=1,o=function(e){n[r++]=e},s=1;s<=t;++s)if(e[s]==i&&s!=t)++a;else{if(!i&&a>2){for(;a>138;a-=138)o(32754);a>2&&(o(a>10?a-11<<5|28690:a-3<<5|12305),a=0)}else if(a>3){for(o(i),--a;a>6;a-=6)o(8304);a>2&&(o(a-3<<5|8208),a=0)}for(;a--;)o(i);a=1,i=e[s]}return{c:n.subarray(0,r),n:t}},Zs=function(e,t){for(var n=0,r=0;r>8,e[i+2]=e[i]^255,e[i+3]=e[i+1]^255;for(var a=0;a4&&!E[bs[O-1]];--O);var k=l+5<<3,A=Zs(i,Ms)+Zs(a,Ns)+o,ee=Zs(i,f)+Zs(a,h)+o+14+3*O+Zs(C,E)+2*C[16]+3*C[17]+7*C[18];if(c>=0&&k<=A&&k<=ee)return Qs(t,u,e.subarray(c,c+l));var te,j,ne,M;if(Ks(t,u,1+(ee15&&(Ks(t,u,oe[w]>>5&127),u+=oe[w]>>12)}}else te=Ps,j=Ms,ne=Is,M=Ns;for(var w=0;w255){var se=N>>18&31;qs(t,u,te[se+257]),u+=j[se+257],se>7&&(Ks(t,u,N>>23&31),u+=vs[se]);var ce=N&31;qs(t,u,ne[ce]),u+=M[ce],ce>3&&(qs(t,u,N>>5&8191),u+=ys[ce])}else qs(t,u,te[N]),u+=j[N]}return qs(t,u,te[256]),u+j[256]},ec=new _s([65540,131080,131088,131104,262176,1048704,1048832,2114560,2117632]),tc=new hs(0),nc=function(e,t,n,r,i,a){var o=a.z||e.length,s=new hs(r+o+5*(1+Math.ceil(o/7e3))+i),c=s.subarray(r,s.length-i),l=a.l,u=(a.r||0)&7;if(t){u&&(c[0]=a.r>>3);for(var d=ec[t-1],f=d>>13,p=d&8191,m=(1<7e3||E>24576)&&(te>423||!l)){u=$s(e,c,0,b,x,S,w,E,O,T-O,u),E=C=w=0,O=T;for(var j=0;j<286;++j)x[j]=0;for(var j=0;j<30;++j)S[j]=0}var ne=2,M=0,re=p,ie=A-ee&32767;if(te>2&&k==y(T-ie))for(var ae=Math.min(f,te)-1,oe=Math.min(32767,T),se=Math.min(258,te);ie<=oe&&--re&&A!=ee;){if(e[T+ne]==e[T+ne-ie]){for(var N=0;Nne){if(ne=N,M=ie,N>ae)break;for(var ce=Math.min(ie,N-2),le=0,j=0;jle&&(le=de,ee=ue)}}}A=ee,ee=h[A],ie+=A-ee&32767}if(M){b[E++]=268435456|ws[ne]<<18|Ds[M];var fe=ws[ne]&31,pe=Ds[M]&31;w+=vs[fe]+ys[pe],++x[257+fe],++S[pe],D=T+ne,++C}else b[E++]=e[T],++x[e[T]]}}for(T=Math.max(T,D);T=o&&(c[u/8|0]=l,me=o),u=Qs(c,u+1,e.subarray(T,me))}a.i=o}return Hs(s,0,r+Vs(u)+i)},rc=function(e,t,n,r,i){if(!i&&(i={l:1},t.dictionary)){var a=t.dictionary.subarray(-32768),o=new hs(a.length+e.length);o.set(a),o.set(e,a.length),e=o,i.w=a.length}return nc(e,t.level==null?6:t.level,t.mem==null?i.l?Math.ceil(Math.max(8,Math.min(13,Math.log(e.length)))*1.5):20:12+t.mem,n,r,i)};function ic(e,t){return rc(e,t||{},0,0)}function ac(e,t){return Gs(e,{i:2},t&&t.out,t&&t.dictionary)}var oc=typeof TextDecoder<`u`&&new TextDecoder;try{oc.decode(tc,{stream:!0})}catch{}var sc={_meta:{generatedBy:`scripts/gen-token-registry.js`,nextId:759},tokens:[{id:0,name:`--sf-alternate-gap`},{id:1,name:`--sf-alternate-inner-gap`},{id:2,name:`--sf-animation-blink`},{id:3,name:`--sf-animation-color-pulse`},{id:4,name:`--sf-animation-delay-1`},{id:5,name:`--sf-animation-delay-2`},{id:6,name:`--sf-animation-delay-3`},{id:7,name:`--sf-animation-delay-4`},{id:8,name:`--sf-animation-delay-5`},{id:9,name:`--sf-animation-fade-in`},{id:10,name:`--sf-animation-fade-out`},{id:11,name:`--sf-animation-float`},{id:12,name:`--sf-animation-ping`},{id:13,name:`--sf-animation-scale-down`},{id:14,name:`--sf-animation-scale-up`},{id:15,name:`--sf-animation-shimmer`},{id:16,name:`--sf-animation-slide-in-down`},{id:17,name:`--sf-animation-slide-in-left`},{id:18,name:`--sf-animation-slide-in-right`},{id:19,name:`--sf-animation-slide-in-up`},{id:20,name:`--sf-animation-spin`},{id:21,name:`--sf-aspect`},{id:22,name:`--sf-bento-cols-default`},{id:23,name:`--sf-bento-gap`},{id:24,name:`--sf-bento-row-compact`},{id:25,name:`--sf-bento-row-default`},{id:26,name:`--sf-bento-row-tall`},{id:27,name:`--sf-blur`},{id:28,name:`--sf-body-color`},{id:29,name:`--sf-body-em-style`},{id:30,name:`--sf-body-font-family`},{id:31,name:`--sf-body-font-size`},{id:32,name:`--sf-body-font-weight`},{id:33,name:`--sf-body-line-height`},{id:34,name:`--sf-body-strong-weight`},{id:35,name:`--sf-body-text-wrap`},{id:36,name:`--sf-border`},{id:37,name:`--sf-border-scale`},{id:38,name:`--sf-border-strong`},{id:39,name:`--sf-border-style`},{id:40,name:`--sf-border-subtle`},{id:41,name:`--sf-border-width-1`},{id:42,name:`--sf-border-width-2`},{id:43,name:`--sf-border-width-3`},{id:44,name:`--sf-border-width-4`},{id:45,name:`--sf-border-width-hairline`},{id:46,name:`--sf-box-border-color`},{id:47,name:`--sf-box-border-width`},{id:48,name:`--sf-box-padding`},{id:49,name:`--sf-breakout-width`},{id:50,name:`--sf-button-padding-block`,removed:!0},{id:51,name:`--sf-button-padding-inline`,removed:!0},{id:52,name:`--sf-button-radius`,removed:!0},{id:53,name:`--sf-caret-color`},{id:54,name:`--sf-center-gutter`},{id:55,name:`--sf-center-max`},{id:56,name:`--sf-cluster-align`},{id:57,name:`--sf-cluster-gap`},{id:58,name:`--sf-cluster-justify`},{id:59,name:`--sf-code-font-size`},{id:60,name:`--sf-color-action`},{id:61,name:`--sf-color-action--active`},{id:62,name:`--sf-color-action--hover`},{id:63,name:`--sf-color-action-100`},{id:64,name:`--sf-color-action-200`},{id:65,name:`--sf-color-action-300`},{id:66,name:`--sf-color-action-400`},{id:67,name:`--sf-color-action-50`},{id:68,name:`--sf-color-action-500`},{id:69,name:`--sf-color-action-600`},{id:70,name:`--sf-color-action-700`},{id:71,name:`--sf-color-action-800`},{id:72,name:`--sf-color-action-900`},{id:73,name:`--sf-color-action-950`},{id:74,name:`--sf-color-action-a10`},{id:75,name:`--sf-color-action-a30`},{id:76,name:`--sf-color-action-a5`},{id:77,name:`--sf-color-action-a50`},{id:78,name:`--sf-color-action-a80`},{id:79,name:`--sf-color-action-source-dark`},{id:80,name:`--sf-color-action-darker`},{id:81,name:`--sf-color-action-ghost`},{id:82,name:`--sf-color-action-source-light`},{id:83,name:`--sf-color-action-lighter`},{id:84,name:`--sf-color-action-muted`},{id:85,name:`--sf-color-action-subtle`},{id:86,name:`--sf-color-action-superdark`},{id:87,name:`--sf-color-action-superlight`},{id:88,name:`--sf-color-action-xdark`},{id:89,name:`--sf-color-action-xlight`},{id:90,name:`--sf-color-base`},{id:91,name:`--sf-color-base--active`},{id:92,name:`--sf-color-base--hover`},{id:93,name:`--sf-color-base-100`},{id:94,name:`--sf-color-base-200`},{id:95,name:`--sf-color-base-300`},{id:96,name:`--sf-color-base-400`},{id:97,name:`--sf-color-base-50`},{id:98,name:`--sf-color-base-500`},{id:99,name:`--sf-color-base-600`},{id:100,name:`--sf-color-base-700`},{id:101,name:`--sf-color-base-800`},{id:102,name:`--sf-color-base-900`},{id:103,name:`--sf-color-base-950`},{id:104,name:`--sf-color-base-a10`},{id:105,name:`--sf-color-base-a30`},{id:106,name:`--sf-color-base-a5`},{id:107,name:`--sf-color-base-a50`},{id:108,name:`--sf-color-base-a80`},{id:109,name:`--sf-color-base-source-dark`},{id:110,name:`--sf-color-base-darker`,removed:!0},{id:111,name:`--sf-color-base-ghost`},{id:112,name:`--sf-color-base-source-light`},{id:113,name:`--sf-color-base-lighter`,removed:!0},{id:114,name:`--sf-color-base-muted`},{id:115,name:`--sf-color-base-subtle`},{id:116,name:`--sf-color-base-superdark`,removed:!0},{id:117,name:`--sf-color-base-superlight`,removed:!0},{id:118,name:`--sf-color-base-xdark`,removed:!0},{id:119,name:`--sf-color-base-xlight`,removed:!0},{id:120,name:`--sf-color-bg`},{id:121,name:`--sf-color-bg--active`},{id:122,name:`--sf-color-bg--disabled`},{id:123,name:`--sf-color-bg--focus`},{id:124,name:`--sf-color-bg--hover`},{id:125,name:`--sf-color-bg--selected`},{id:126,name:`--sf-color-black`},{id:127,name:`--sf-color-border`},{id:128,name:`--sf-color-border--disabled`},{id:129,name:`--sf-color-border--focus`},{id:130,name:`--sf-color-border--strong`},{id:131,name:`--sf-color-border--subtle`},{id:132,name:`--sf-color-border--translucent`},{id:133,name:`--sf-color-code-bg`},{id:134,name:`--sf-color-code-text`},{id:135,name:`--sf-color-danger`},{id:136,name:`--sf-color-danger-source-dark`},{id:137,name:`--sf-color-danger-source-light`},{id:138,name:`--sf-color-danger-muted`},{id:139,name:`--sf-color-danger-strong`},{id:140,name:`--sf-color-danger-subtle`},{id:141,name:`--sf-color-dim`},{id:142,name:`--sf-color-error`,removed:!0},{id:143,name:`--sf-color-error-dark`,removed:!0},{id:144,name:`--sf-color-error-light`,removed:!0},{id:145,name:`--sf-color-error-muted`,removed:!0},{id:146,name:`--sf-color-error-strong`,removed:!0},{id:147,name:`--sf-color-error-subtle`,removed:!0},{id:148,name:`--sf-color-heading`},{id:149,name:`--sf-color-info`},{id:150,name:`--sf-color-info-source-dark`},{id:151,name:`--sf-color-info-source-light`},{id:152,name:`--sf-color-info-muted`},{id:153,name:`--sf-color-info-strong`},{id:154,name:`--sf-color-info-subtle`},{id:155,name:`--sf-color-inset`},{id:156,name:`--sf-color-inverse`},{id:157,name:`--sf-color-link`},{id:158,name:`--sf-color-link--active`},{id:159,name:`--sf-color-link--disabled`},{id:160,name:`--sf-color-link--hover`},{id:161,name:`--sf-color-link--underline`},{id:162,name:`--sf-color-link--visited`},{id:163,name:`--sf-color-mark-bg`},{id:164,name:`--sf-color-mark-text`},{id:165,name:`--sf-color-neutral`},{id:166,name:`--sf-color-neutral--active`},{id:167,name:`--sf-color-neutral--hover`},{id:168,name:`--sf-color-neutral-100`},{id:169,name:`--sf-color-neutral-200`},{id:170,name:`--sf-color-neutral-300`},{id:171,name:`--sf-color-neutral-400`},{id:172,name:`--sf-color-neutral-50`},{id:173,name:`--sf-color-neutral-500`},{id:174,name:`--sf-color-neutral-600`},{id:175,name:`--sf-color-neutral-700`},{id:176,name:`--sf-color-neutral-800`},{id:177,name:`--sf-color-neutral-900`},{id:178,name:`--sf-color-neutral-950`},{id:179,name:`--sf-color-neutral-a10`},{id:180,name:`--sf-color-neutral-a30`},{id:181,name:`--sf-color-neutral-a5`},{id:182,name:`--sf-color-neutral-a50`},{id:183,name:`--sf-color-neutral-a80`},{id:184,name:`--sf-color-neutral-source-dark`},{id:185,name:`--sf-color-neutral-darker`},{id:186,name:`--sf-color-neutral-ghost`},{id:187,name:`--sf-color-neutral-source-light`},{id:188,name:`--sf-color-neutral-lighter`},{id:189,name:`--sf-color-neutral-muted`},{id:190,name:`--sf-color-neutral-subtle`},{id:191,name:`--sf-color-neutral-superdark`},{id:192,name:`--sf-color-neutral-superlight`},{id:193,name:`--sf-color-neutral-xdark`},{id:194,name:`--sf-color-neutral-xlight`},{id:195,name:`--sf-color-overlay`},{id:196,name:`--sf-color-primary`},{id:197,name:`--sf-color-primary--active`},{id:198,name:`--sf-color-primary--hover`},{id:199,name:`--sf-color-primary-100`},{id:200,name:`--sf-color-primary-200`},{id:201,name:`--sf-color-primary-300`},{id:202,name:`--sf-color-primary-400`},{id:203,name:`--sf-color-primary-50`},{id:204,name:`--sf-color-primary-500`},{id:205,name:`--sf-color-primary-600`},{id:206,name:`--sf-color-primary-700`},{id:207,name:`--sf-color-primary-800`},{id:208,name:`--sf-color-primary-900`},{id:209,name:`--sf-color-primary-950`},{id:210,name:`--sf-color-primary-a10`},{id:211,name:`--sf-color-primary-a30`},{id:212,name:`--sf-color-primary-a5`},{id:213,name:`--sf-color-primary-a50`},{id:214,name:`--sf-color-primary-a80`},{id:215,name:`--sf-color-primary-source-dark`},{id:216,name:`--sf-color-primary-darker`},{id:217,name:`--sf-color-primary-ghost`},{id:218,name:`--sf-color-primary-source-light`},{id:219,name:`--sf-color-primary-lighter`},{id:220,name:`--sf-color-primary-muted`},{id:221,name:`--sf-color-primary-subtle`},{id:222,name:`--sf-color-primary-superdark`},{id:223,name:`--sf-color-primary-superlight`},{id:224,name:`--sf-color-primary-xdark`},{id:225,name:`--sf-color-primary-xlight`},{id:226,name:`--sf-color-raised`},{id:227,name:`--sf-color-scheme`},{id:228,name:`--sf-color-secondary`},{id:229,name:`--sf-color-secondary--active`},{id:230,name:`--sf-color-secondary--hover`},{id:231,name:`--sf-color-secondary-100`},{id:232,name:`--sf-color-secondary-200`},{id:233,name:`--sf-color-secondary-300`},{id:234,name:`--sf-color-secondary-400`},{id:235,name:`--sf-color-secondary-50`},{id:236,name:`--sf-color-secondary-500`},{id:237,name:`--sf-color-secondary-600`},{id:238,name:`--sf-color-secondary-700`},{id:239,name:`--sf-color-secondary-800`},{id:240,name:`--sf-color-secondary-900`},{id:241,name:`--sf-color-secondary-950`},{id:242,name:`--sf-color-secondary-a10`},{id:243,name:`--sf-color-secondary-a30`},{id:244,name:`--sf-color-secondary-a5`},{id:245,name:`--sf-color-secondary-a50`},{id:246,name:`--sf-color-secondary-a80`},{id:247,name:`--sf-color-secondary-source-dark`},{id:248,name:`--sf-color-secondary-darker`},{id:249,name:`--sf-color-secondary-ghost`},{id:250,name:`--sf-color-secondary-source-light`},{id:251,name:`--sf-color-secondary-lighter`},{id:252,name:`--sf-color-secondary-muted`},{id:253,name:`--sf-color-secondary-subtle`},{id:254,name:`--sf-color-secondary-superdark`},{id:255,name:`--sf-color-secondary-superlight`},{id:256,name:`--sf-color-secondary-xdark`},{id:257,name:`--sf-color-secondary-xlight`},{id:258,name:`--sf-color-selection-bg`},{id:259,name:`--sf-color-selection-text`},{id:260,name:`--sf-color-success`},{id:261,name:`--sf-color-success-source-dark`},{id:262,name:`--sf-color-success-source-light`},{id:263,name:`--sf-color-success-muted`},{id:264,name:`--sf-color-success-strong`},{id:265,name:`--sf-color-success-subtle`},{id:266,name:`--sf-color-surface`},{id:267,name:`--sf-color-tertiary`},{id:268,name:`--sf-color-tertiary--active`},{id:269,name:`--sf-color-tertiary--hover`},{id:270,name:`--sf-color-tertiary-100`},{id:271,name:`--sf-color-tertiary-200`},{id:272,name:`--sf-color-tertiary-300`},{id:273,name:`--sf-color-tertiary-400`},{id:274,name:`--sf-color-tertiary-50`},{id:275,name:`--sf-color-tertiary-500`},{id:276,name:`--sf-color-tertiary-600`},{id:277,name:`--sf-color-tertiary-700`},{id:278,name:`--sf-color-tertiary-800`},{id:279,name:`--sf-color-tertiary-900`},{id:280,name:`--sf-color-tertiary-950`},{id:281,name:`--sf-color-tertiary-a10`},{id:282,name:`--sf-color-tertiary-a30`},{id:283,name:`--sf-color-tertiary-a5`},{id:284,name:`--sf-color-tertiary-a50`},{id:285,name:`--sf-color-tertiary-a80`},{id:286,name:`--sf-color-tertiary-source-dark`},{id:287,name:`--sf-color-tertiary-darker`},{id:288,name:`--sf-color-tertiary-ghost`},{id:289,name:`--sf-color-tertiary-source-light`},{id:290,name:`--sf-color-tertiary-lighter`},{id:291,name:`--sf-color-tertiary-muted`},{id:292,name:`--sf-color-tertiary-subtle`},{id:293,name:`--sf-color-tertiary-superdark`},{id:294,name:`--sf-color-tertiary-superlight`},{id:295,name:`--sf-color-tertiary-xdark`},{id:296,name:`--sf-color-tertiary-xlight`},{id:297,name:`--sf-color-text`},{id:298,name:`--sf-color-text--disabled`},{id:299,name:`--sf-color-text--inverse`},{id:300,name:`--sf-color-text--muted`},{id:301,name:`--sf-color-text--on-action`},{id:302,name:`--sf-color-text--on-base`},{id:303,name:`--sf-color-text--on-danger`},{id:304,name:`--sf-color-text--on-error`,removed:!0},{id:305,name:`--sf-color-text--on-info`},{id:306,name:`--sf-color-text--on-inverse`},{id:307,name:`--sf-color-text--on-neutral`},{id:308,name:`--sf-color-text--on-primary`},{id:309,name:`--sf-color-text--on-secondary`},{id:310,name:`--sf-color-text--on-success`},{id:311,name:`--sf-color-text--on-tertiary`},{id:312,name:`--sf-color-text--on-warning`},{id:313,name:`--sf-color-text--placeholder`},{id:314,name:`--sf-color-text--secondary`},{id:315,name:`--sf-color-warning`},{id:316,name:`--sf-color-warning-source-dark`},{id:317,name:`--sf-color-warning-source-light`},{id:318,name:`--sf-color-warning-muted`},{id:319,name:`--sf-color-warning-strong`},{id:320,name:`--sf-color-warning-subtle`},{id:321,name:`--sf-color-white`},{id:322,name:`--sf-component-pad`},{id:323,name:`--sf-container-default`},{id:324,name:`--sf-container-full`},{id:325,name:`--sf-container-narrow`},{id:326,name:`--sf-container-prose`},{id:327,name:`--sf-container-wide`},{id:328,name:`--sf-content-gap`},{id:329,name:`--sf-content-intrinsic-size`},{id:330,name:`--sf-content-width`},{id:331,name:`--sf-contrast-bias`},{id:332,name:`--sf-contrast-threshold`},{id:333,name:`--sf-cover-min-height`},{id:334,name:`--sf-cover-padding`},{id:335,name:`--sf-current-font-weight`},{id:336,name:`--sf-display-l-line-height`},{id:337,name:`--sf-display-m-line-height`},{id:338,name:`--sf-display-s-line-height`},{id:339,name:`--sf-divider-color`},{id:340,name:`--sf-divider-gap`},{id:341,name:`--sf-divider-style`},{id:342,name:`--sf-divider-width`},{id:343,name:`--sf-drop-shadow-l`},{id:344,name:`--sf-drop-shadow-m`},{id:345,name:`--sf-drop-shadow-s`},{id:346,name:`--sf-duration-fast`},{id:347,name:`--sf-duration-instant`},{id:348,name:`--sf-duration-none`},{id:349,name:`--sf-duration-normal`},{id:350,name:`--sf-duration-slow`},{id:351,name:`--sf-duration-slower`},{id:352,name:`--sf-ease-bounce`},{id:353,name:`--sf-ease-elastic`},{id:354,name:`--sf-ease-in`},{id:355,name:`--sf-ease-in-out`},{id:356,name:`--sf-ease-linear`},{id:357,name:`--sf-ease-out`},{id:358,name:`--sf-ease-overshoot`},{id:359,name:`--sf-ease-spring`},{id:360,name:`--sf-equal-gap`},{id:361,name:`--sf-equal-min-col`},{id:362,name:`--sf-equal-min-col-2`,removed:!0},{id:363,name:`--sf-equal-min-col-3`,removed:!0},{id:364,name:`--sf-equal-min-col-4`,removed:!0},{id:365,name:`--sf-equal-min-col-6`,removed:!0},{id:366,name:`--sf-field-block`},{id:367,name:`--sf-field-padding-block`},{id:368,name:`--sf-field-padding-inline`},{id:369,name:`--sf-field-radius`},{id:370,name:`--sf-field-required-marker`},{id:371,name:`--sf-flow-space`},{id:372,name:`--sf-fluid-max-vw`},{id:373,name:`--sf-fluid-min-vw`},{id:374,name:`--sf-focus-ring-color`},{id:375,name:`--sf-focus-ring-offset`},{id:376,name:`--sf-focus-ring-shadow`},{id:377,name:`--sf-focus-ring-style`},{id:378,name:`--sf-focus-ring-width`},{id:379,name:`--sf-font-body`},{id:380,name:`--sf-font-display`},{id:381,name:`--sf-font-features`},{id:382,name:`--sf-font-geometric`},{id:383,name:`--sf-font-heading`},{id:384,name:`--sf-font-humanist`},{id:385,name:`--sf-font-mono`},{id:386,name:`--sf-font-numeric`},{id:387,name:`--sf-font-slab`},{id:388,name:`--sf-font-variation`},{id:389,name:`--sf-font-weight-body`},{id:390,name:`--sf-font-weight-bold`},{id:391,name:`--sf-font-weight-display`},{id:392,name:`--sf-font-weight-heading`},{id:393,name:`--sf-font-weight-interactive`},{id:394,name:`--sf-font-weight-light`},{id:395,name:`--sf-font-weight-medium`},{id:396,name:`--sf-font-weight-normal`},{id:397,name:`--sf-font-weight-semibold`},{id:398,name:`--sf-font-weight-strong`},{id:399,name:`--sf-frame-ratio`},{id:400,name:`--sf-gap`},{id:401,name:`--sf-gradient-brand`},{id:402,name:`--sf-gradient-fade--b`},{id:403,name:`--sf-gradient-fade--l`},{id:404,name:`--sf-gradient-fade--r`},{id:405,name:`--sf-gradient-fade--t`},{id:406,name:`--sf-gradient-primary`},{id:407,name:`--sf-gradient-secondary`},{id:408,name:`--sf-gradient-surface`},{id:409,name:`--sf-gradient-tertiary`},{id:410,name:`--sf-grid-gap`},{id:411,name:`--sf-grid-min`},{id:412,name:`--sf-grid-min-2xl`},{id:413,name:`--sf-grid-min-l`},{id:414,name:`--sf-grid-min-m`},{id:415,name:`--sf-grid-min-s`},{id:416,name:`--sf-grid-min-xl`},{id:417,name:`--sf-grid-min-xs`},{id:418,name:`--sf-gutter`},{id:419,name:`--sf-h1-font-weight`},{id:420,name:`--sf-h1-letter-spacing`},{id:421,name:`--sf-h1-line-height`},{id:422,name:`--sf-h1-max-width`},{id:423,name:`--sf-h1-size`},{id:424,name:`--sf-h2-font-weight`},{id:425,name:`--sf-h2-letter-spacing`},{id:426,name:`--sf-h2-line-height`},{id:427,name:`--sf-h2-max-width`},{id:428,name:`--sf-h2-size`},{id:429,name:`--sf-h3-font-weight`},{id:430,name:`--sf-h3-letter-spacing`},{id:431,name:`--sf-h3-line-height`},{id:432,name:`--sf-h3-max-width`},{id:433,name:`--sf-h3-size`},{id:434,name:`--sf-h4-font-weight`},{id:435,name:`--sf-h4-letter-spacing`},{id:436,name:`--sf-h4-line-height`},{id:437,name:`--sf-h4-max-width`},{id:438,name:`--sf-h4-size`},{id:439,name:`--sf-h5-font-weight`},{id:440,name:`--sf-h5-letter-spacing`},{id:441,name:`--sf-h5-line-height`},{id:442,name:`--sf-h5-max-width`},{id:443,name:`--sf-h5-size`},{id:444,name:`--sf-h6-font-weight`},{id:445,name:`--sf-h6-letter-spacing`},{id:446,name:`--sf-h6-line-height`},{id:447,name:`--sf-h6-max-width`},{id:448,name:`--sf-h6-size`},{id:449,name:`--sf-header-height`},{id:450,name:`--sf-header-height-desktop`},{id:451,name:`--sf-header-height-mobile`},{id:452,name:`--sf-heading-color`},{id:453,name:`--sf-heading-font-family`},{id:454,name:`--sf-heading-text-wrap`},{id:455,name:`--sf-icon-2xl`},{id:456,name:`--sf-icon-box-bg`},{id:457,name:`--sf-icon-box-border`},{id:458,name:`--sf-icon-box-pad`},{id:459,name:`--sf-icon-box-radius`},{id:460,name:`--sf-icon-l`},{id:461,name:`--sf-icon-m`},{id:462,name:`--sf-icon-s`},{id:463,name:`--sf-icon-xl`},{id:464,name:`--sf-icon-xs`},{id:465,name:`--sf-imposter-margin`},{id:466,name:`--sf-is-active`},{id:467,name:`--sf-is-current`},{id:468,name:`--sf-is-dark`},{id:469,name:`--sf-is-open`},{id:470,name:`--sf-is-pressed`},{id:471,name:`--sf-leading-normal`},{id:472,name:`--sf-leading-relaxed`},{id:473,name:`--sf-leading-snug`},{id:474,name:`--sf-leading-taper`},{id:475,name:`--sf-leading-tight`},{id:476,name:`--sf-line-clamp`},{id:477,name:`--sf-link-external-marker`},{id:478,name:`--sf-link-underline-offset`},{id:479,name:`--sf-link-underline-thickness`},{id:480,name:`--sf-lumlocker`},{id:481,name:`--sf-mask-scrim-end`},{id:482,name:`--sf-mask-scrim-start`},{id:483,name:`--sf-motion-scale`},{id:484,name:`--sf-object-fit`},{id:485,name:`--sf-object-position`},{id:486,name:`--sf-opacity-disabled`},{id:487,name:`--sf-opacity-muted`},{id:488,name:`--sf-optical-sizing`},{id:489,name:`--sf-palette-mix-100`},{id:490,name:`--sf-palette-mix-200`},{id:491,name:`--sf-palette-mix-300`},{id:492,name:`--sf-palette-mix-400`},{id:493,name:`--sf-palette-mix-50`},{id:494,name:`--sf-palette-mix-600`},{id:495,name:`--sf-palette-mix-700`},{id:496,name:`--sf-palette-mix-800`},{id:497,name:`--sf-palette-mix-900`},{id:498,name:`--sf-palette-mix-950`},{id:499,name:`--sf-print-base-size`},{id:500,name:`--sf-print-page-margin`},{id:501,name:`--sf-print-page-size`},{id:502,name:`--sf-prose-block-margin`},{id:503,name:`--sf-prose-blockquote-border`},{id:504,name:`--sf-prose-blockquote-padding`},{id:505,name:`--sf-prose-figcaption-size`},{id:506,name:`--sf-prose-figure-margin`},{id:507,name:`--sf-prose-heading-gap`},{id:508,name:`--sf-prose-hr-margin`},{id:509,name:`--sf-prose-list-gap`},{id:510,name:`--sf-prose-marker-color`},{id:511,name:`--sf-prose-media-margin`},{id:512,name:`--sf-prose-media-radius`},{id:513,name:`--sf-prose-nested-list-gap`},{id:514,name:`--sf-prose-paragraph`},{id:515,name:`--sf-prose-table-pad`},{id:516,name:`--sf-radius-2xl`},{id:517,name:`--sf-radius-2xs`},{id:518,name:`--sf-radius-3xl`},{id:519,name:`--sf-radius-4xl`},{id:520,name:`--sf-radius-full`},{id:521,name:`--sf-radius-l`},{id:522,name:`--sf-radius-m`},{id:523,name:`--sf-radius-none`},{id:524,name:`--sf-radius-outer`},{id:525,name:`--sf-radius-pill`},{id:526,name:`--sf-radius-s`},{id:527,name:`--sf-radius-scale`},{id:528,name:`--sf-radius-xl`},{id:529,name:`--sf-radius-xs`},{id:530,name:`--sf-ratio-3-2`},{id:531,name:`--sf-ratio-4-3`},{id:532,name:`--sf-ratio-cinema`},{id:533,name:`--sf-ratio-golden`},{id:534,name:`--sf-ratio-portrait`},{id:535,name:`--sf-ratio-square`},{id:536,name:`--sf-ratio-video`},{id:537,name:`--sf-reel-gap`},{id:538,name:`--sf-reel-height`},{id:539,name:`--sf-reel-item-width`},{id:540,name:`--sf-safe-bottom`},{id:541,name:`--sf-safe-left`},{id:542,name:`--sf-safe-right`},{id:543,name:`--sf-safe-top`},{id:544,name:`--sf-scrim-color`},{id:545,name:`--sf-scrim-direction`},{id:546,name:`--sf-scrim-gradient`},{id:547,name:`--sf-scrim-text-shadow`},{id:548,name:`--sf-scroll-shadow-size`},{id:549,name:`--sf-scroll-timeline-range-end`},{id:550,name:`--sf-scroll-timeline-range-start`},{id:551,name:`--sf-scrollbar-thumb`},{id:552,name:`--sf-scrollbar-track`},{id:553,name:`--sf-section-pad`},{id:554,name:`--sf-section-pad--2xl`},{id:555,name:`--sf-section-pad--l`},{id:556,name:`--sf-section-pad--m`},{id:557,name:`--sf-section-pad--s`},{id:558,name:`--sf-section-pad--xl`},{id:559,name:`--sf-section-pad--xs`},{id:560,name:`--sf-section-scale`},{id:561,name:`--sf-shadow-2xl`},{id:562,name:`--sf-shadow-color`},{id:563,name:`--sf-shadow-glow`},{id:564,name:`--sf-shadow-glow-color`},{id:565,name:`--sf-shadow-inner`},{id:566,name:`--sf-shadow-l`},{id:567,name:`--sf-shadow-lightness`},{id:568,name:`--sf-shadow-m`},{id:569,name:`--sf-shadow-none`},{id:570,name:`--sf-shadow-s`},{id:571,name:`--sf-shadow-strength`},{id:572,name:`--sf-shadow-xl`},{id:573,name:`--sf-shadow-xs`},{id:574,name:`--sf-sidebar-gap`},{id:575,name:`--sf-sidebar-min-width`},{id:576,name:`--sf-sidebar-width`},{id:577,name:`--sf-size-l`},{id:578,name:`--sf-size-m`},{id:579,name:`--sf-size-s`},{id:580,name:`--sf-size-xl`},{id:581,name:`--sf-size-xs`},{id:582,name:`--sf-space-2xl`},{id:583,name:`--sf-space-2xs`},{id:584,name:`--sf-space-3xl`},{id:585,name:`--sf-space-4xl`},{id:586,name:`--sf-space-base-max`},{id:587,name:`--sf-space-base-min`},{id:588,name:`--sf-space-l`},{id:589,name:`--sf-space-m`},{id:590,name:`--sf-space-none`},{id:591,name:`--sf-space-px`},{id:592,name:`--sf-space-ratio-max`},{id:593,name:`--sf-space-ratio-min`},{id:594,name:`--sf-space-s`},{id:595,name:`--sf-space-scale`},{id:596,name:`--sf-space-xl`},{id:597,name:`--sf-space-xs`},{id:598,name:`--sf-stack-gap`},{id:599,name:`--sf-state-pending-opacity`},{id:600,name:`--sf-sticky-offset`},{id:601,name:`--sf-sticky-offset-desktop`},{id:602,name:`--sf-sticky-offset-mobile`},{id:603,name:`--sf-surface-color`},{id:604,name:`--sf-switcher-gap`},{id:605,name:`--sf-switcher-threshold`},{id:606,name:`--sf-text-2xl`},{id:607,name:`--sf-text-2xl-font-weight`},{id:608,name:`--sf-text-2xl-letter-spacing`},{id:609,name:`--sf-text-2xl-line-height`},{id:610,name:`--sf-text-2xl-max-width`},{id:611,name:`--sf-text-2xs`},{id:612,name:`--sf-text-2xs-font-weight`},{id:613,name:`--sf-text-2xs-letter-spacing`},{id:614,name:`--sf-text-2xs-line-height`},{id:615,name:`--sf-text-2xs-max-width`},{id:616,name:`--sf-text-3xl`},{id:617,name:`--sf-text-3xl-font-weight`},{id:618,name:`--sf-text-3xl-letter-spacing`},{id:619,name:`--sf-text-3xl-line-height`},{id:620,name:`--sf-text-3xl-max-width`},{id:621,name:`--sf-text-4xl`},{id:622,name:`--sf-text-4xl-font-weight`},{id:623,name:`--sf-text-4xl-letter-spacing`},{id:624,name:`--sf-text-4xl-line-height`},{id:625,name:`--sf-text-4xl-max-width`},{id:626,name:`--sf-text-base-max`},{id:627,name:`--sf-text-base-min`},{id:628,name:`--sf-text-display-base-max`},{id:629,name:`--sf-text-display-base-min`},{id:630,name:`--sf-text-display-l`},{id:631,name:`--sf-text-display-m`},{id:632,name:`--sf-text-display-s`},{id:633,name:`--sf-text-display-scale`},{id:634,name:`--sf-text-l`},{id:635,name:`--sf-text-l-font-weight`},{id:636,name:`--sf-text-l-letter-spacing`},{id:637,name:`--sf-text-l-line-height`},{id:638,name:`--sf-text-l-max-width`},{id:639,name:`--sf-text-m`},{id:640,name:`--sf-text-m-font-weight`},{id:641,name:`--sf-text-m-letter-spacing`},{id:642,name:`--sf-text-m-line-height`},{id:643,name:`--sf-text-m-max-width`},{id:644,name:`--sf-text-ratio-max`},{id:645,name:`--sf-text-ratio-min`},{id:646,name:`--sf-text-s`},{id:647,name:`--sf-text-s-font-weight`},{id:648,name:`--sf-text-s-letter-spacing`},{id:649,name:`--sf-text-s-line-height`},{id:650,name:`--sf-text-s-max-width`},{id:651,name:`--sf-text-scale`},{id:652,name:`--sf-text-shadow-l`},{id:653,name:`--sf-text-shadow-m`},{id:654,name:`--sf-text-shadow-none`},{id:655,name:`--sf-text-shadow-s`},{id:656,name:`--sf-text-xl`},{id:657,name:`--sf-text-xl-font-weight`},{id:658,name:`--sf-text-xl-letter-spacing`},{id:659,name:`--sf-text-xl-line-height`},{id:660,name:`--sf-text-xl-max-width`},{id:661,name:`--sf-text-xs`},{id:662,name:`--sf-text-xs-font-weight`},{id:663,name:`--sf-text-xs-letter-spacing`},{id:664,name:`--sf-text-xs-line-height`},{id:665,name:`--sf-text-xs-max-width`},{id:666,name:`--sf-theme-transition-duration`},{id:667,name:`--sf-touch-target`},{id:668,name:`--sf-tracking-normal`},{id:669,name:`--sf-tracking-tight`},{id:670,name:`--sf-tracking-wide`},{id:671,name:`--sf-tracking-wider`},{id:672,name:`--sf-tracking-widest`},{id:673,name:`--sf-transition-colors`},{id:674,name:`--sf-transition-enter`},{id:675,name:`--sf-transition-exit`},{id:676,name:`--sf-transition-fast`},{id:677,name:`--sf-transition-form-field`},{id:678,name:`--sf-transition-opacity`},{id:679,name:`--sf-transition-overlay`},{id:680,name:`--sf-transition-shadow`},{id:681,name:`--sf-transition-slow`},{id:682,name:`--sf-transition-transform`},{id:683,name:`--sf-z-base`},{id:684,name:`--sf-z-below`},{id:685,name:`--sf-z-dropdown`},{id:686,name:`--sf-z-fixed`},{id:687,name:`--sf-z-modal`},{id:688,name:`--sf-z-overlay`},{id:689,name:`--sf-z-raised`},{id:690,name:`--sf-z-sticky`},{id:691,name:`--sf-z-toast`},{id:692,name:`--sf-z-tooltip`},{id:693,name:`--sf-bg-layer-fit`},{id:694,name:`--sf-bg-layer-inset`},{id:695,name:`--sf-bg-layer-position`},{id:696,name:`--sf-bg-layer-radius`},{id:697,name:`--sf-bg-layer-z`},{id:698,name:`--sf-btn-padding-block`},{id:699,name:`--sf-btn-padding-inline`},{id:700,name:`--sf-btn-radius`},{id:701,name:`--sf-equal-rule-color`},{id:702,name:`--sf-equal-rule-style`},{id:703,name:`--sf-equal-rule-width`},{id:704,name:`--sf-boxed-bg`,removed:!0},{id:705,name:`--sf-boxed-border-color`,removed:!0},{id:706,name:`--sf-boxed-border-width`,removed:!0},{id:707,name:`--sf-boxed-padding`,removed:!0},{id:708,name:`--sf-boxed-radius`,removed:!0},{id:709,name:`--sf-boxed-shadow`,removed:!0},{id:710,name:`--sf-corner-scoop-at`},{id:711,name:`--sf-corner-scoop-size`},{id:712,name:`--sf-corners-end-end`,removed:!0},{id:713,name:`--sf-corners-end-start`,removed:!0},{id:714,name:`--sf-corners-start-end`,removed:!0},{id:715,name:`--sf-corners-start-start`,removed:!0},{id:716,name:`--sf-overlap-pull`},{id:717,name:`--sf-btn-border-width`},{id:718,name:`--sf-btn-font-size`},{id:719,name:`--sf-btn-font-weight`},{id:720,name:`--sf-btn-gap`},{id:721,name:`--sf-btn-min-height`},{id:722,name:`--sf-card-bg`},{id:723,name:`--sf-card-border-color`},{id:724,name:`--sf-card-border-width`},{id:725,name:`--sf-card-btn-font-size`},{id:726,name:`--sf-card-gap`},{id:727,name:`--sf-card-heading-size`},{id:728,name:`--sf-card-media-radius`},{id:729,name:`--sf-card-media-ratio`},{id:730,name:`--sf-card-padding`},{id:731,name:`--sf-card-radius`},{id:732,name:`--sf-card-radius-outer`},{id:733,name:`--sf-card-shadow`},{id:734,name:`--sf-card-shadow--elevated`},{id:735,name:`--sf-card-shadow--hover`},{id:736,name:`--sf-animation-slide-out-down`},{id:737,name:`--sf-animation-slide-out-left`},{id:738,name:`--sf-animation-slide-out-right`},{id:739,name:`--sf-animation-slide-out-up`},{id:740,name:`--sf-color-selection-bg--alt`},{id:741,name:`--sf-color-selection-text--alt`},{id:742,name:`--sf-media-radius`},{id:743,name:`--sf-scroll-timeline-range-exit-end`},{id:744,name:`--sf-scroll-timeline-range-exit-start`},{id:745,name:`--sf-drop-shadow-xl`},{id:746,name:`--sf-drop-shadow-xs`},{id:747,name:`--sf-link-external-label`},{id:748,name:`--sf-text-shadow-xl`},{id:749,name:`--sf-text-shadow-xs`},{id:750,name:`--sf-fluid-width`},{id:751,name:`--sf-surface-bg-animation`},{id:752,name:`--sf-surface-bg-attachment`},{id:753,name:`--sf-surface-bg-color`},{id:754,name:`--sf-surface-bg-image`},{id:755,name:`--sf-surface-bg-overlay`},{id:756,name:`--sf-surface-bg-position`},{id:757,name:`--sf-surface-bg-repeat`},{id:758,name:`--sf-surface-bg-size`}]},cc=window.__SLASHED_FW_VERSION__===void 0?`0.0.0`:window.__SLASHED_FW_VERSION__,lc=65535,uc=65535,dc=new TextEncoder,fc=new TextDecoder(`utf-8`,{fatal:!1}),pc=32*1024,mc=256*1024;function hc(e){return Number.isInteger(e)&&e>=0&&e<=uc}function gc(e){let t=new Map;for(let n of e?.tokens??[])n&&!n.removed&&typeof n.name==`string`&&hc(n.id)&&t.set(n.name,n.id);return t}function _c(e){let t=new Map;for(let n of e?.tokens??[])n&&typeof n.name==`string`&&Number.isInteger(n.id)&&t.set(n.id,n.name);return t}function vc(e){let t=``;for(let n=0;nlc||r.push({id:e,valueBytes:a})}if(r.length===0)return``;r.sort((e,t)=>e.id-t.id);let i=0;for(let e of r)i+=4+e.valueBytes.length;let a=new Uint8Array(i),o=0;for(let{id:e,valueBytes:t}of r)a[o++]=e>>8&255,a[o++]=e&255,a[o++]=t.length>>8&255,a[o++]=t.length&255,a.set(t,o),o+=t.length;let s=ic(a);if(s.length>pc)return console.warn(`[codec] compressed payload too large (${s.length} B > ${pc} B); refusing to encode.`),``;let c=new Uint8Array(1+s.length);return c[0]=2,c.set(s,1),vc(c)}function xc(e,t=sc,n={}){let r=String(e??``).trim();if(r===``)return{};let i=yc(r);if(!i||i.length===0)return{};if(i[0]!==2)return console.warn(`[codec] unknown config-code version ${i[0]} (expected 2); ignoring.`),{};let a=i.length-1;if(a>pc)return console.warn(`[codec] compressed payload too large (${a} B > ${pc} B); ignoring.`),{};let o;try{o=ac(i.subarray(1))}catch{return console.warn(`[codec] failed to decompress config; ignoring.`),{}}if(!o||o.length===0)return{};if(o.length>mc)return console.warn(`[codec] decompressed payload too large (${o.length} B > ${mc} B); ignoring.`),{};let s=_c(t),c=typeof n.sanitize==`function`?n.sanitize:e=>e,l=typeof n.isKnown==`function`?n.isKnown:()=>!0,u={},d=0;try{for(;do.length)throw Error(`truncated entry header`);let e=o[d]<<8|o[d+1],t=o[d+2]<<8|o[d+3];if(d+=4,d+t>o.length)throw Error(`truncated value`);let n=fc.decode(o.subarray(d,d+t));d+=t;let r=s.get(e);if(r===void 0||!l(r))continue;let i=c(n);i!==``&&(u[r]=i)}}catch(e){return console.warn(`[codec] malformed config code; ignoring (${e.message}).`),{}}return u}function Sc(e){return e==null?``:String(e).replace(/\/\*[\s\S]*?\*\//g,` `).replace(/[;{}]/g,` `).replace(/[/*]{2,}/g,` `).replace(/\s+/g,` `).trim()}function Cc(e,t={}){let{mode:n=`layer`,banner:r=!0}=t,i=Object.keys(e).filter(e=>/^--sf-[\w-]+$/.test(e)).sort((e,t)=>e.localeCompare(t));if(i.length===0)return``;let a=i.map(t=>`${t}: ${Sc(e[t])};`),o=n===`layer`?` `:` `,s=a.map(e=>`${o}${e}`).join(` `),c=``;return r&&(c+=`/* SLASHED override tokens v${cc} — generated by the SLASHED configurator.\n Load this AFTER the SLASHED stylesheet. ${i.length} token${i.length===1?``:`s`} customised. */\n`),n===`layer`?`${c}@layer slashed.overrides {\n\t:root {\n${s}\n\t}\n}\n`:`${c}:root {\n${s}\n}\n`}function wc(e){return bc(e,sc)}var Tc=RegExp(`[#&]?c=([^&]+)`);function Ec(e,t={}){let n=new Set(sc.tokens.map(e=>e.name)),r=t.isKnown??(e=>n.has(e)),i=String(e??``).trim(),a=i.match(Tc);return a&&(i=a[1]),xc(i,sc,{sanitize:Sc,isKnown:r})}function Dc(e,t){let n=typeof window<`u`?window.location.href:`https://example.com/`,r=new URL(t??n),i=wc(e);return r.hash=i?`c=${i}`:``,r.toString()}function Oc(e,t={}){let n=String(e??``);return n.includes(`c=`)?Ec(n,t):{}}var kc=`slashed-studio/themes/v1`;function Ac(e){return!!e&&typeof e==`object`&&!Array.isArray(e)&&Object.values(e).every(e=>typeof e==`string`)}function jc(e){if(!e||typeof e!=`object`||Array.isArray(e))return!1;let t=e;return typeof t.id==`string`&&typeof t.name==`string`&&typeof t.icon==`string`&&typeof t.blurb==`string`&&Ac(t.overrides)}function Mc(){if(typeof window>`u`)return[];try{let e=localStorage.getItem(kc);if(!e)return[];let t=JSON.parse(e);return Array.isArray(t)?t.filter(jc):[]}catch{return[]}}function Nc(e){if(typeof window>`u`)return!1;try{return localStorage.setItem(kc,JSON.stringify(e)),!0}catch{return!1}}function Pc(){return Mc()}function Fc(e,t){let n=Mc(),r=e.trim()||`Untitled theme`,i={id:`theme-${Date.now()}-${Math.random().toString(36).slice(2,7)}`,name:r,icon:`🎨`,blurb:`${Object.keys(t).length} override${Object.keys(t).length===1?``:`s`}`,overrides:{...t}},a=[...n,i];return Nc(a)?a:n}function Ic(e){let t=Mc().filter(t=>t.id!==e);return Nc(t)?t:Mc()}var Lc=`slashed-studio/overrides/v2`,Rc=new Set([`--sf-text-base-min`,`--sf-text-base-max`,`--sf-text-ratio-min`,`--sf-text-ratio-max`,`--sf-text-scale`,`--sf-text-display-base-min`,`--sf-text-display-base-max`,`--sf-text-display-scale`,`--sf-fluid-min-vw`,`--sf-fluid-max-vw`]),zc=new Set([`--sf-space-base-min`,`--sf-space-base-max`,`--sf-space-ratio-min`,`--sf-space-ratio-max`,`--sf-space-scale`,`--sf-fluid-min-vw`,`--sf-fluid-max-vw`]),Bc=[[`2xs`,-3],[`xs`,-2],[`s`,-1],[`m`,0],[`l`,1],[`xl`,2],[`2xl`,3],[`3xl`,4],[`4xl`,5]],Vc=[[`display-s`,0],[`display-m`,1],[`display-l`,2]],Hc=[[`2xs`,-3],[`xs`,-2],[`s`,-1],[`m`,0],[`l`,1],[`xl`,2],[`2xl`,3],[`3xl`,4],[`4xl`,5]],Uc=[[`2xs`,1],[`xs`,2],[`s`,4],[`m`,8],[`l`,12],[`xl`,16],[`2xl`,24],[`3xl`,32],[`4xl`,48]],Wc=[[`1`,1],[`2`,2],[`3`,3],[`4`,4]],Gc=[[`instant`,100],[`fast`,150],[`normal`,250],[`slow`,400],[`slower`,600]];function Kc(e,t,n){let r=e[t];if(r===void 0)return n;let i=parseFloat(r);return Number.isFinite(i)?i:n}function qc(e){if(!Number.isFinite(e))return`0`;let t=e.toFixed(6).replace(/\.?0+$/,``);return t===``||t===`-`?`0`:t}function Jc(e,t,n,r,i,a,o,s){let c=e*n**+o*s,l=t*r**+o*s;if(a<=i||Math.abs(c-l)<1e-9)return`${qc(c)}rem`;let u=(l-c)/(a-i);return`clamp(${qc(c)}rem, calc(${qc(u)} * (100vw - ${qc(i)}rem) + ${qc(c)}rem), ${qc(l)}rem)`}function Yc(e,{reduceMotion:t=!1}={}){let n={},r=Object.keys(e),i=r.some(e=>Rc.has(e)),a=r.some(e=>zc.has(e)),o=`--sf-radius-scale`in e,s=`--sf-border-scale`in e,c=`--sf-motion-scale`in e;if(!i&&!a&&!o&&!s&&!c)return n;let l=Kc(e,`--sf-fluid-min-vw`,22.5),u=Kc(e,`--sf-fluid-max-vw`,90);if(i){let t=Kc(e,`--sf-text-base-min`,1),r=Kc(e,`--sf-text-base-max`,1.25),i=Kc(e,`--sf-text-ratio-min`,1.25),a=Kc(e,`--sf-text-ratio-max`,1.333),o=Kc(e,`--sf-text-scale`,1);for(let[e,s]of Bc)n[`--sf-text-${e}`]=Jc(t,r,i,a,l,u,s,o);let s=Kc(e,`--sf-text-display-base-min`,2.4),c=Kc(e,`--sf-text-display-base-max`,3),d=Kc(e,`--sf-text-display-scale`,1);for(let[e,t]of Vc)n[`--sf-text-${e}`]=Jc(s,c,i,a,l,u,t,d)}if(a){let t=Kc(e,`--sf-space-base-min`,1),r=Kc(e,`--sf-space-base-max`,2),i=Kc(e,`--sf-space-ratio-min`,1.25),a=Kc(e,`--sf-space-ratio-max`,1.333),o=Kc(e,`--sf-space-scale`,1);for(let[e,s]of Hc)n[`--sf-space-${e}`]=Jc(t,r,i,a,l,u,s,o)}if(o){let t=Kc(e,`--sf-radius-scale`,1);for(let[e,r]of Uc)n[`--sf-radius-${e}`]=`${qc(r*t)}px`;n[`--sf-radius-none`]=`0`,n[`--sf-radius-full`]=`9999px`,n[`--sf-radius-pill`]=`var(--sf-radius-full)`,n[`--sf-radius-outer`]=`calc(var(--sf-radius-m) + var(--sf-component-pad))`}if(s){let t=Kc(e,`--sf-border-scale`,1);for(let[e,r]of Wc)n[`--sf-border-width-${e}`]=`${qc(r*t)}px`}if(c&&!t){let t=Kc(e,`--sf-motion-scale`,1);for(let[e,r]of Gc)n[`--sf-duration-${e}`]=`${qc(r*t)}ms`;n[`--sf-duration-none`]=`0ms`,n[`--sf-theme-transition-duration`]=`${qc(300*t)}ms`;for(let e=1;e<=5;e+=1)n[`--sf-animation-delay-${e}`]=`${qc(75*e*t)}ms`}return n}function Xc(){return typeof window>`u`?null:window.slashedApp??null}function Zc(){return!!Xc()}function Qc(){if(typeof window>`u`)return{};let e=Xc();if(e)return e.overrides&&typeof e.overrides==`object`&&!Array.isArray(e.overrides)?{...e.overrides}:{};let t=window.location.hash;if(t?.includes(`c=`))try{return Oc(t)}catch{}let n=localStorage.getItem(Lc);if(n)try{let e=JSON.parse(n);if(Ac(e))return e}catch{}return{}}function $c(e){if(typeof document>`u`)return;let t=document.getElementById(`sf-parent-overrides`);t||(t=document.createElement(`style`),t.id=`sf-parent-overrides`,document.head.appendChild(t));let n=Yc(e,{reduceMotion:typeof window<`u`&&window.matchMedia?.(`(prefers-reduced-motion: reduce)`).matches}),r=Object.keys(n).length>0?{...n,...e}:e;t.textContent=Cc(r,{mode:`root`,banner:!1})}async function el(e,t){let n=(e.url??``).replace(/\/$/,``),r=new URL(n+`/tokens/overrides`,window.location.href);if(r.origin!==window.location.origin)throw Error(`slashed: REST URL must be same-origin`);let i=r.href,a=await fetch(i,{method:`POST`,credentials:`same-origin`,headers:{"Content-Type":`application/json`,"X-WP-Nonce":e.nonce??``},body:JSON.stringify({overrides:t})});if(!a.ok)throw Error(`slashed: save failed ${a.status} ${a.statusText}`)}function tl(e){try{localStorage.setItem(Lc,JSON.stringify(e))}catch{}let t=wc(e),n=t?`c=${t}`:``;window.location.hash.replace(`#`,``)!==n&&(window.location.hash=n)}async function nl(e){if(typeof window>`u`)return;let t=Xc();if(t?.rest?.url){await el(t.rest,{...e});return}tl(e)}var rl=null,il=null,al=null,ol=null,sl=null,cl=null,ll=null,ul=new Map,dl=nn({value:0}),fl=0;function pl(e){if(rl===e){hl();return}il&&il.remove(),ol&&ol.remove(),sl&&sl.remove(),rl=e,il=null,al=null,ol=null,sl=null,cl=null,ll=null,hl()}function ml(){return rl?.documentElement.getAttribute(`data-theme`)===`dark`?`dark`:`light`}function hl(){fl+=1,dl.value=fl,ul.clear()}function gl(){if(!rl||!rl.body)return null;if(il&&il.ownerDocument===rl&&il.isConnected)return il;let e=rl.createElement(`div`);return e.setAttribute(`data-sf-probe`,``),e.style.cssText=`position:absolute;width:0;height:0;pointer-events:none;visibility:hidden;`,rl.body.appendChild(e),il=e,e}function _l(e){let t=ul.get(e);if(t!==void 0)return t;let n=gl();if(!n||!rl)return``;n.style.color=``,n.style.color=e;let r=rl.defaultView?.getComputedStyle(n).color??``;return ul.set(e,r),r}function vl(e){return!rl||!rl.body?null:e===`light`?cl&&cl.isConnected?cl:(ol&&ol.remove(),ol=rl.createElement(`div`),ol.setAttribute(`data-theme`,`light`),ol.style.cssText=`position:absolute;width:0;height:0;pointer-events:none;visibility:hidden;`,cl=rl.createElement(`div`),ol.appendChild(cl),rl.body.appendChild(ol),cl):ll&&ll.isConnected?ll:(sl&&sl.remove(),sl=rl.createElement(`div`),sl.setAttribute(`data-theme`,`dark`),sl.style.cssText=`position:absolute;width:0;height:0;pointer-events:none;visibility:hidden;`,ll=rl.createElement(`div`),sl.appendChild(ll),rl.body.appendChild(sl),ll)}function yl(e,t){let n=`${t}\0${e}`,r=ul.get(n);if(r!==void 0)return r;let i=vl(t);if(!i||!rl)return``;i.style.color=``,i.style.color=e;let a=rl.defaultView?.getComputedStyle(i).color??``;return ul.set(n,a),a}function bl(){if(!rl)return null;if(al&&al.canvas.ownerDocument===rl)return al;let e=rl.createElement(`canvas`);return e.width=1,e.height=1,al=e.getContext(`2d`,{willReadFrequently:!0}),al}function xl(e){let t=_l(e);if(!t)return null;let n=bl();if(!n)return null;n.clearRect(0,0,1,1),n.fillStyle=t,n.fillRect(0,0,1,1);try{let e=n.getImageData(0,0,1,1).data;return[e[0],e[1],e[2]]}catch{return null}}function Sl(e){let t=gl();return!t||!rl?``:(t.style.background=``,t.style.background=e,rl.defaultView?.getComputedStyle(t).backgroundImage??``)}var Cl=nn({value:!1}),wl=`/*! SLASHED v0.7.1 — slashed.full.css | MIT License | github.com/codeslash-dev/SLASHED */ /* ─── core/layers.css ─── */ @@ -5583,7 +5583,7 @@ ${l?l+` ${h[i]} -`}let _=L(!1),v=L(null),y=L(null),b=L(null),x=L(0),S=L(0),C=L(0),w=L(0),T=I(()=>g({},t.previewTheme,t.previewMotion,t.previewTemplate,wl)),E=I(()=>g({},`light`,t.previewMotion,t.previewTemplate,wl)),D=I(()=>g({},`dark`,t.previewMotion,t.previewTemplate,wl));On(()=>{let e=t.overrides,r=t.previewTheme,i=U(x),a=Cl.value,o=requestAnimationFrame(()=>{let t=U(v);if(i===0||!t)return;let o=t.contentDocument;if(!o)return;let c=o.getElementById(`slashed-overrides`);c&&(c.textContent=Cc(n(e),{mode:`root`,banner:!1})),s(o,e),o.documentElement.setAttribute(`data-theme`,r),a?o.documentElement.setAttribute(`data-lumlocker`,``):o.documentElement.removeAttribute(`data-lumlocker`),pl(o)});return()=>cancelAnimationFrame(o)}),On(()=>{let e=U(_),r=t.overrides,i=U(S),a=U(C),o=Cl.value;if(!e)return;let c=requestAnimationFrame(()=>{let e=Cc(n(r),{mode:`root`,banner:!1}),t=e=>{o?e.documentElement.setAttribute(`data-lumlocker`,``):e.documentElement.removeAttribute(`data-lumlocker`)},c=!1,l=!1;if(U(y)&&i>0){let n=U(y).contentDocument;if(n){let i=n.getElementById(`slashed-overrides`);i&&(i.textContent=e),s(n,r),t(n),pl(n),c=!0}}if(U(b)&&a>0){let n=U(b).contentDocument;if(n){let i=n.getElementById(`slashed-overrides`);i&&(i.textContent=e),s(n,r),t(n),l=!0}}l&&!c&&hl()});return()=>cancelAnimationFrame(c)});let O=I(()=>t.previewWidth!==`fluid`);function k(){return t.previewWidth===`fluid`?`width:100%;height:100%`:t.previewWidth===`mobile`?`width:390px;height:750px;border:1px solid rgba(255,255,255,0.12);border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 32px 80px rgba(0,0,0,0.5)`:t.previewWidth===`tablet`?`width:768px;height:900px;border:1px solid rgba(255,255,255,0.12);border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 32px 80px rgba(0,0,0,0.5)`:`width:1024px;height:720px;border:1px solid rgba(255,255,255,0.12);border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 32px 80px rgba(0,0,0,0.5)`}var A=Ml(),ee=z(A),j=z(ee);Y(j,21,()=>r,e=>e.id,(e,n)=>{var r=Tl(),i=z(r,!0);F(r),H(()=>{X(r,1,`shrink-0 px-2.5 py-0.5 rounded-md text-[10px] font-bold transition-all cursor-pointer ${t.previewTemplate===U(n).id?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(i,U(n).label)}),W(`click`,r,()=>t.onTemplateChange(U(n).id)),K(e,r)}),F(j);var te=V(j,4);Y(te,20,()=>[`fluid`,`desktop`,`tablet`,`mobile`],e=>e,(e,n)=>{var r=El(),i=z(r),a=e=>{ho(e,{class:`w-3 h-3`})},o=e=>{To(e,{class:`w-3 h-3`})},s=e=>{Ha(e,{class:`w-3 h-3`})};J(i,e=>{n===`mobile`?e(a):n===`tablet`?e(o,1):e(s,-1)}),F(r),H(()=>{Q(r,`title`,n===`fluid`?`Full width`:n===`desktop`?`Desktop (1024px)`:n===`tablet`?`Tablet (768px)`:`Mobile (390px)`),X(r,1,`p-1 rounded-md transition-all cursor-pointer ${t.previewWidth===n?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`)}),W(`click`,r,()=>t.onWidthChange(n)),K(e,r)}),F(te);var ne=V(te,2),M=z(ne);xo(z(M),{class:`w-3 h-3`}),F(M);var re=V(M,2);Wa(z(re),{class:`w-3 h-3`}),F(re);var ie=V(re,2);Sa(z(ie),{class:`w-3 h-3`}),F(ie),F(ne);var ae=V(ne,4),oe=z(ae);oe.value=oe.__value=`normal`;var se=V(oe);se.value=se.__value=`slow`;var N=V(se);N.value=N.__value=`none`,F(ae);var ce;Di(ae);var le=V(ae,2);eo(z(le),{class:`w-3 h-3`}),F(le);var ue=V(le,2);Aa(z(ue),{class:`w-3 h-3`}),F(ue),F(ee);var de=V(ee,2),fe=z(de),pe=e=>{var t=kl(),n=z(t),r=z(n),i=z(r);xo(z(i),{class:`w-2.5 h-2.5`}),Me(),F(i),F(r),ri(V(r,2),()=>U(w),e=>{var t=Dl();Qi(t,e=>R(y,e),()=>U(y)),H(()=>Q(t,`srcdoc`,U(E))),zr(`load`,t,()=>{R(S,U(S)+1)}),Lr(t),K(e,t)}),F(n);var a=V(n,2),o=z(a),s=z(o);Wa(z(s),{class:`w-2.5 h-2.5`}),Me(),F(s),F(o),ri(V(o,2),()=>U(w),e=>{var t=Ol();Qi(t,e=>R(b,e),()=>U(b)),H(()=>Q(t,`srcdoc`,U(D))),zr(`load`,t,()=>{R(C,U(C)+1)}),Lr(t),K(e,t)}),F(a),F(t),K(e,t)},me=e=>{var t=jl();ri(z(t),()=>U(w),e=>{var t=Al();Qi(t,e=>R(v,e),()=>U(v)),H(()=>Q(t,`srcdoc`,U(T))),zr(`load`,t,()=>{R(x,U(x)+1)}),Lr(t),K(e,t)}),F(t),H(e=>{Z(t,e),X(t,1,yi(U(O)?``:`w-full h-full`))},[()=>k()]),K(e,t)};J(fe,e=>{U(_)?e(pe):e(me,-1)}),F(de),F(A),H(()=>{X(M,1,`p-1 rounded-md transition-all cursor-pointer ${!U(_)&&t.previewTheme===`light`?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),X(re,1,`p-1 rounded-md transition-all cursor-pointer ${!U(_)&&t.previewTheme===`dark`?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),X(ie,1,`p-1 rounded-md transition-all cursor-pointer ${U(_)?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),ce!==(ce=t.previewMotion)&&(ae.value=(ae.__value=t.previewMotion)??``,Ei(ae,t.previewMotion)),X(de,1,`flex-1 min-h-0 flex overflow-auto ${U(O)&&!U(_)?`items-center justify-center bg-slate-100 dark:bg-[#06060a]`:``}`)}),W(`click`,M,()=>{R(_,!1),t.onThemeChange(`light`)}),W(`click`,re,()=>{R(_,!1),t.onThemeChange(`dark`)}),W(`click`,ie,()=>{R(_,!U(_))}),W(`change`,ae,e=>t.onMotionChange(e.target.value)),W(`click`,le,()=>{R(x,0),R(S,0),R(C,0),R(w,U(w)+1)}),W(`click`,ue,()=>{let e=new Blob([g(t.overrides,t.previewTheme,t.previewMotion,t.previewTemplate,wl)],{type:`text/html`}),n=URL.createObjectURL(e);window.open(n,`_blank`)}),K(e,A),We()}Br([`click`,`change`]);var Pl={macros:[`prose`,`flow-space`,`line-clamp`,`aspect`,`scroll-shadow`,`scrim`,`surface-color`,`surface-bg`,`content-intrinsic`,`corner-scoop`,`overlap-`],colors:[`color`,`contrast`,`palette-mix`,`lumlocker`,`gradient`],typography:[`font`,`--sf-text`,`leading`,`tracking`,`weight`,`body-font`,`heading-font`,`body-em`,`body-text`,`heading-text`,`display-l-`,`display-m-`,`-h1-`,`-h2-`,`-h3-`,`-h4-`,`-h5-`,`-h6-`,`link-`,`optical-sizing`,`fluid-width`,`fluid-min-vw`,`fluid-max-vw`],spacing:[`space`,`section`,`gutter`,`content-gap`,`component-pad`],layout:[`container`,`layout`,`grid`,`breakpoint`,`measure`,`column`,`header-height`,`touch-target`,`bento`,`cluster`,`cover-min`,`equal-min`,`equal-rule`,`frame`,`ratio-`,`reel`,`safe-`,`sidebar`,`switcher`,`-bg-`],components:[`btn-`,`card-`],borders:[`radius`,`border-width`,`border-scale`,`border-style`,`divider`],shadows:[`shadow`],motion:[`motion`,`duration`,`easing`,`ease`,`scroll-timeline`],effects:[`filter`,`blur`,`backdrop`,`opacity`,`effect`],misc:[`z-`,`cursor`,`ring`,`focus`,`outline`,`selection`,`icon`,`sf-is-active`,`sf-is-current`,`sf-is-open`,`sf-is-pressed`,`field-required`,`object-fit`,`object-position`,`print-`,`scrollbar`,`size-`]};function Fl(e){for(let[t,n]of Object.entries(Pl))if(t!==`misc`&&n.some(t=>e.includes(t)))return t;return`misc`}var Il=G(`You have .`,1),Ll=G(``),Rl=G(` `),zl=G(``),Bl=G(``),Vl=G(`

No saved themes yet. Configure tokens, then save.

`),Hl=G(``),Ul=G(`
`),Wl=G(`
SLASHED Studio

Configure every SLASHED design token visually. Changes appear live in the preview.

Token domains
Tools
Saved themes
`);function Gl(e,t){Ue(t,!0);let n=[{id:`colors`,icon:Ja,label:`Colors`,desc:`Brand, semantic & neutral palettes`},{id:`typography`,icon:ko,label:`Typography`,desc:`Font families & fluid type scale`},{id:`spacing`,icon:io,label:`Spacing`,desc:`Space scale & section rhythm`},{id:`layout`,icon:zo,label:`Layout`,desc:`Containers, grids & primitives`},{id:`borders`,icon:yo,label:`Borders`,desc:`Corner radius & border widths`},{id:`shadows`,icon:Ia,label:`Shadows`,desc:`Elevation & depth control`},{id:`motion`,icon:No,label:`Motion`,desc:`Duration & easing curves`},{id:`effects`,icon:_o,label:`Effects`,desc:`Blur, opacity & scrollbars`},{id:`macros`,icon:ma,label:`Macros`,desc:`Flow, prose, aspect & scrim`},{id:`misc`,icon:Xa,label:`Misc`,desc:`Z-index & remaining tokens`},{id:`components`,icon:wa,label:`Components`,desc:`Button & card component tokens`}],r=[{id:`themes`,icon:Co,label:`Themes`,desc:`Save & re-apply configurations`},{id:`wcag`,icon:uo,label:`WCAG`,desc:`Contrast checker & fixes`},{id:`setup`,icon:Ka,label:`Install`,desc:`Export overrides & setup`},{id:`cheatsheet`,icon:ga,label:`Classes`,desc:`Utility class reference`}];function i(e){return Object.keys(t.overrides).filter(t=>Fl(t)===e).length}let a=I(()=>Object.keys(t.overrides).length),o=L(nn(Pc())),s=L(``);function c(){U(a)!==0&&(R(o,Fc(U(s),t.overrides),!0),R(s,``))}var l=Wl(),u=z(l),d=z(u);_o(z(d),{class:`w-4 h-4 text-indigo-600 dark:text-indigo-400`}),Me(2),F(d);var f=V(d,2),p=V(z(f)),m=e=>{var t=Il(),n=V(B(t)),r=z(n);F(n),Me(),H(()=>q(r,`${U(a)??``} active override${U(a)===1?``:`s`}`)),K(e,t)},h=e=>{K(e,Yr(`Pick any domain below to get started.`))};J(p,e=>{U(a)>0?e(m):e(h,-1)}),F(f);var g=V(f,2),_=e=>{var n=Ll();W(`click`,n,function(...e){t.onResetAll?.apply(this,e)}),K(e,n)};J(g,e=>{U(a)>0&&e(_)}),F(u);var v=V(u,2),y=V(z(v),2);Y(y,21,()=>n,e=>e.id,(e,n)=>{let r=I(()=>i(U(n).id)),a=I(()=>U(n).icon);var o=zl(),s=z(o);mi(z(s),()=>U(a),(e,t)=>{t(e,{class:`w-4 h-4`})}),F(s);var c=V(s,2),l=z(c),u=z(l,!0);F(l);var d=V(l,2),f=z(d,!0);F(d),F(c);var p=V(c,2),m=e=>{var t=Rl(),n=z(t,!0);F(t),H(()=>q(n,U(r))),K(e,t)};J(p,e=>{U(r)>0&&e(m)}),Me(2),F(o),H(()=>{q(u,U(n).label),q(f,U(n).desc)}),W(`click`,o,()=>t.onSelect(U(n).id)),K(e,o)}),F(y),F(v);var b=V(v,2),x=V(z(b),2);Y(x,21,()=>r,e=>e.id,(e,n)=>{let r=I(()=>U(n).icon);var i=Bl(),a=z(i);mi(z(a),()=>U(r),(e,t)=>{t(e,{class:`w-4 h-4`})}),F(a);var o=V(a,2),s=z(o),c=z(s,!0);F(s);var l=V(s,2),u=z(l,!0);F(l),F(o),Me(2),F(i),H(()=>{q(c,U(n).label),q(u,U(n).desc)}),W(`click`,i,()=>t.onSelect(U(n).id)),K(e,i)}),F(x),F(b);var S=V(b,2),C=z(S),w=V(z(C),2);F(C);var T=V(C,2),E=z(T);zi(E);var D=V(E,2);oo(z(D),{class:`w-3 h-3`}),F(D),F(T);var O=V(T,2),k=e=>{K(e,Vl())},A=e=>{var n=Ul();Y(n,21,()=>U(o).slice(0,6),e=>e.id,(e,n)=>{var r=Hl(),i=z(r),a=z(i,!0);F(i);var o=V(i,2),s=z(o),c=z(s,!0);F(s);var l=V(s,2),u=z(l,!0);F(l),F(o),F(r),H(()=>{q(a,U(n).icon),q(c,U(n).name),q(u,U(n).blurb)}),W(`click`,r,()=>t.onApplyTheme(U(n).overrides)),K(e,r)}),F(n),K(e,n)};J(O,e=>{U(o).length===0?e(k):e(A,-1)}),F(S),F(l),H(()=>D.disabled=U(a)===0),W(`click`,w,()=>t.onSelect(`themes`)),W(`keydown`,E,e=>{e.key===`Enter`&&c()}),qi(E,()=>U(s),e=>R(s,e)),W(`click`,D,c),K(e,l),We()}Br([`click`,`keydown`]);var Kl={colors:[{name:`--sf-contrast-bias`,label:`Contrast bias`,help:`Shifts the lightness threshold used by text-on-color pairing toward darker (negative) or lighter (positive) text.`,default:0,min:-1,max:1,step:.05,driving:3},{name:`--sf-contrast-threshold`,label:`Contrast threshold`,help:`OKLCH lightness above which a swatch is considered 'light' (gets dark text). Below = light text.`,default:.6,min:0,max:1,step:.01,driving:11},{name:`--sf-focus-ring-width`,label:`Focus ring width`,help:`Thickness of the focus ring on every interactive element.`,default:2,min:0,max:6,step:.5,unit:`px`,driving:1}],typography:[{name:`--sf-text-scale`,label:`Text scale`,help:`Multiplier applied to the entire fluid text ramp (2xs … 2xl).`,default:1,min:.5,max:2,step:.05,driving:9},{name:`--sf-text-display-scale`,label:`Display scale`,help:`Multiplier applied to the display ramp (display-s, display-m, display-l).`,default:1,min:.5,max:2,step:.05,driving:3}],spacing:[{name:`--sf-space-scale`,label:`Space scale`,help:`Multiplier applied to every fluid spacing step. One drag moves 45 tokens.`,default:1,min:.5,max:2,step:.05,driving:45},{name:`--sf-section-scale`,label:`Section scale`,help:`Multiplier applied to section paddings only.`,default:1,min:.5,max:2,step:.05,driving:6}],borders:[{name:`--sf-radius-scale`,label:`Radius scale`,help:`Multiplier applied to every radius step (set to 0 for sharp brutalist corners).`,default:1,min:0,max:2,step:.05,driving:8}],shadows:[{name:`--sf-shadow-strength`,label:`Shadow strength`,help:`Base shadow opacity. Auto-boosted +0.17 in dark mode. Slider sets the light-mode base.`,default:.08,min:0,max:.5,step:.01,driving:14,encode:e=>`calc(${e} + var(--sf-is-dark) * 0.17)`,decode:e=>{let t=/^calc\(\s*([\d.e+-]+)/.exec(String(e));return t?parseFloat(t[1]):NaN}}],motion:[{name:`--sf-motion-scale`,label:`Motion scale`,help:`Speed multiplier on every duration. Set to 0 to effectively disable motion.`,default:1,min:0,max:2,step:.05,driving:13}]};function ql(e,t,n){let r=n*Math.PI/180,i=e,a=t*Math.cos(r),o=t*Math.sin(r),s=i+.3963377774*a+.2158037573*o,c=i-.1055613458*a-.0638541728*o,l=i-.0894841775*a-1.291485548*o,u=s*s*s,d=c*c*c,f=l*l*l,p=4.0767416621*u-3.3077115913*d+.2309699292*f,m=-1.2684380046*u+2.6097574011*d-.3413193965*f,h=-.0041960863*u-.7034186147*d+1.707614701*f,g=e=>e<=.0031308?12.92*e:1.055*e**(1/2.4)-.055;return[Math.max(0,Math.min(255,Math.round(g(p)*255))),Math.max(0,Math.min(255,Math.round(g(m)*255))),Math.max(0,Math.min(255,Math.round(g(h)*255)))]}function Jl(e,t,n){let r=e=>{let t=e/255;return t<=.04045?t/12.92:((t+.055)/1.055)**2.4};return .2126*r(e)+.7152*r(t)+.0722*r(n)}function Yl(e,t){let n=Math.max(e,t),r=Math.min(e,t);return(n+.05)/(r+.05)}function Xl(e){let t=e.match(/oklch\(\s*([\d.%]+)\s+([\d.]+)\s+([\d.]+)/i);if(t){let e=t[1];return{l:e.endsWith(`%`)?parseFloat(e)/100:parseFloat(e),c:parseFloat(t[2]),h:parseFloat(t[3]),valid:!0}}return{l:.5,c:.15,h:200,valid:!1}}function Zl(e,t,n){return`oklch(${e.toFixed(3)} ${t.toFixed(3)} ${Math.round(n)})`}var Ql=G(` `),$l=G(`
`);function eu(e,t){Ue(t,!0);let n=ra(t,`disabled`,3,!1);function r(e){return Math.min(t.max,Math.max(t.min,e))}let i=I(()=>(t.value-t.min)/(t.max-t.min)*100);var a=$l(),o=z(a),s=V(z(o),2),c=V(s,2);zi(c);var l=V(c,2);F(o);var u=V(o,2),d=z(u);zi(d);var f=V(d,2),p=e=>{var n=Ql(),r=z(n,!0);F(n),H(()=>q(r,t.unit)),K(e,n)};J(f,e=>{t.unit&&e(p)}),F(u),F(a),H(()=>{Z(s,`width: ${U(i)}%`),Q(c,`min`,t.min),Q(c,`max`,t.max),Q(c,`step`,t.step),Bi(c,t.value),c.disabled=n(),Z(l,`left: calc(${U(i)}% - 6px)`),Q(d,`min`,t.min),Q(d,`max`,t.max),Q(d,`step`,t.step),Bi(d,t.value),d.disabled=n()}),W(`input`,c,e=>t.onChange(r(parseFloat(e.target.value)))),W(`change`,d,e=>t.onChange(r(parseFloat(e.target.value)||0))),K(e,a),We()}Br([`input`,`change`]);var tu=G(`
`),nu=G(``),ru=G(`
Lightness (L)
Chroma (C)
Hue (H)
Raw value
`),iu=G(`
`);function au(e,t){Ue(t,!0);function n(e){let t=/oklch\(\s*([\d.]+)\s+([\d.]+)\s+([\d.]+)\s*\)/.exec(e);return t?{l:parseFloat(t[1]),c:parseFloat(t[2]),h:parseFloat(t[3])}:null}function r(e,t,n){return`oklch(${e.toFixed(3)} ${t.toFixed(3)} ${n.toFixed(1)})`}function i(e,t,n){let r=n*Math.PI/180,i=t*Math.cos(r),a=t*Math.sin(r),o=e+.3963377774*i+.2158037573*a,s=e-.1055613458*i-.0638541728*a,c=e-.0894841775*i-1.291485548*a,l=o*o*o,u=s*s*s,d=c*c*c,f=4.0767416621*l-3.3077115913*u+.2309699292*d,p=-1.2684380046*l+2.6097574011*u-.3413193965*d,m=-.0041960863*l-.7034186147*u+1.707614701*d,h=e=>e<=0?0:e>=1?255:Math.round(e**(1/2.2)*255);return`rgb(${h(f)},${h(p)},${h(m)})`}let a=I(()=>n(t.value)??{l:.6,c:.15,h:264}),o=L(!1),s=L(``),c=I(()=>i(U(a).l,U(a).c,U(a).h)),l=I(()=>t.tokenName.replace(`--sf-`,``));function u(e,n,i){t.onChange(r(e,n,i))}var d=iu(),f=z(d),p=z(f);let m;var h=V(p,2),g=z(h),_=z(g,!0);F(g);var v=V(g,2),y=z(v,!0);F(v);var b=V(v,2),x=z(b,!0);F(b),F(h);var S=V(h,2),C=e=>{K(e,tu())};J(S,e=>{t.overridden&&e(C)});var w=V(S,2);F(f);var T=V(f,2),E=e=>{var n=ru(),r=z(n),i=z(r),o=V(z(i),2),c=z(o,!0);F(o),F(i);var l=V(i,2);eu(V(l,2),{get value(){return U(a).l},min:0,max:1,step:.005,onChange:e=>u(e,U(a).c,U(a).h)}),F(r);var d=V(r,2),f=z(d),p=V(z(f),2),m=z(p,!0);F(p),F(f),eu(V(f,2),{get value(){return U(a).c},min:0,max:.4,step:.005,onChange:e=>u(U(a).l,e,U(a).h)}),F(d);var h=V(d,2),g=z(h),_=V(z(g),2),v=z(_);F(_),F(g);var y=V(g,2);eu(V(y,2),{get value(){return U(a).h},min:0,max:360,step:1,unit:`°`,onChange:e=>u(U(a).l,U(a).c,e)}),F(h);var b=V(h,2),x=V(z(b),2),S=z(x);zi(S);var C=V(S,2),w=e=>{var n=nu();W(`click`,n,function(...e){t.onReset?.apply(this,e)}),K(e,n)};J(C,e=>{t.overridden&&e(w)}),F(x),F(b),F(n),H((e,n,r,i,a)=>{q(c,e),Z(l,n),q(m,r),q(v,`${i??``}°`),Z(y,a),Bi(S,U(s)||t.value)},[()=>U(a).l.toFixed(3),()=>`background: linear-gradient(to right, oklch(0 ${U(a).c.toFixed(3)} ${U(a).h.toFixed(1)}), oklch(1 ${U(a).c.toFixed(3)} ${U(a).h.toFixed(1)}))`,()=>U(a).c.toFixed(3),()=>U(a).h.toFixed(1),()=>`background: linear-gradient(to right, oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 0), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 60), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 120), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 180), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 240), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 300), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 360))`]),W(`input`,S,e=>{R(s,e.target.value,!0)}),zr(`blur`,S,()=>{U(s).trim()&&(t.onChange(U(s).trim()),R(s,``))}),W(`keydown`,S,e=>{e.key===`Enter`&&(U(s).trim()&&(t.onChange(U(s).trim()),R(s,``)),e.currentTarget.blur())}),K(e,n)};J(T,e=>{U(o)&&e(E)}),F(d),H(()=>{X(d,1,`rounded-xl border transition-all ${t.overridden?`bg-indigo-500/8 border-indigo-500/20`:`bg-black/4 dark:bg-white/4 border-black/8 dark:border-white/8 hover:border-black/12 dark:hover:border-white/12`}`),m=Z(p,``,m,{background:U(c)}),q(_,t.label),q(y,U(l)),q(x,t.value),X(w,1,`text-slate-500 text-[10px] transition-transform ${U(o)?`rotate-180`:``}`)}),W(`click`,f,()=>{R(o,!U(o))}),K(e,d),We()}Br([`click`,`input`,`keydown`]);var ou=G(` `),su=G(``),cu=G(`

`),lu=G(`
`);function uu(e,t){Ue(t,!0);let n=I(()=>t.overrides[t.knob.name]),r=I(()=>U(n)===void 0?t.knob.default:t.knob.decode?t.knob.decode(U(n)):parseFloat(U(n))),i=I(()=>isNaN(U(r))?t.knob.default:U(r)),a=I(()=>t.knob.name in t.overrides);function o(e){let n=t.knob.encode?t.knob.encode(e):String(e);t.onChange(t.knob.name,n)}function s(){t.onChange(t.knob.name,null)}var c=lu(),l=z(c),u=z(l),d=z(u),f=z(d,!0);F(d);var p=V(d,2),m=e=>{var n=ou(),r=z(n);F(n),H(()=>q(r,`→ ${t.knob.driving??``} tokens`)),K(e,n)};J(p,e=>{t.knob.driving!==void 0&&e(m)}),F(u);var h=V(u,2),g=e=>{var t=su();W(`click`,t,s),K(e,t)};J(h,e=>{U(a)&&e(g)}),F(l);var _=V(l,2);eu(_,{get value(){return U(i)},get min(){return t.knob.min},get max(){return t.knob.max},get step(){return t.knob.step},get unit(){return t.knob.unit},onChange:o});var v=V(_,2),y=e=>{var n=cu(),r=z(n,!0);F(n),H(()=>q(r,t.knob.help)),K(e,n)};J(v,e=>{t.knob.help&&e(y)}),F(c),H(()=>q(f,t.knob.label)),K(e,c),We()}Br([`click`]);var du=G(` `),fu=G(``),pu=G(``),mu=G(``),hu=G(``),gu=G(``),_u=G(``),vu=G(` `,1),yu=G(`

`),bu=G(` `,1),xu=G(`

`),Su=G(`
`);function $(e,t){Ue(t,!0);let n=`__sf_custom__`;function r(e){let t=e.match(/^var\(\s*(--sf-[\w-]+)/);return t?t[1].replace(/^--sf-/,``):e}let i=I(()=>{let e=[];t.rawDefault&&e.push({label:`${r(t.rawDefault)} (default)`,value:t.rawDefault});for(let n of t.variableOptions??[])n.value!==t.rawDefault&&e.push(n);return e}),a=I(()=>U(i).find(e=>e.value===(t.currentRaw??t.rawDefault))),o=I(()=>!!t.rawDefault&&!!t.onRawSet),s=I(()=>U(o)&&(t.variableOptions?.length??0)>0),c=I(()=>!!t.currentRaw&&/^(var|calc|clamp|min|max|env)\(/.test(t.currentRaw.trim())),l=L(`none`),u=I(()=>U(s)&&U(l)===`none`&&(t.currentRaw===void 0||!!U(a))),d=I(()=>U(o)&&!U(u)&&(U(l)===`raw`||U(l)===`none`&&U(c))),f=I(()=>U(a)?.value??t.rawDefault??n),p=L(``),m=L(!1);On(()=>{U(m)||R(p,t.currentRaw??``,!0)});function h(e){if(e===n){R(l,`slider`);return}R(l,`none`),e===t.rawDefault?t.onReset():t.onRawSet?.(e)}function g(){R(l,`none`),t.onReset()}var _=Su(),v=z(_),y=z(v),b=e=>{var n=du(),r=z(n,!0);F(n),H(()=>q(r,t.label)),K(e,n)},x=e=>{K(e,fu())};J(y,e=>{t.label?e(b):e(x,-1)});var S=V(y,2),C=z(S),w=e=>{var t=pu();H(()=>{Q(t,`title`,U(d)?`Switch to slider`:`Enter raw CSS value`),X(t,1,`text-[9px] font-mono cursor-pointer transition-all px-0.5 ${U(d)?`text-indigo-600 dark:text-indigo-400`:`opacity-100 sm:opacity-0 sm:group-hover:opacity-100 sm:group-focus-within:opacity-100 focus:opacity-100 text-slate-500 hover:text-indigo-600 dark:hover:text-indigo-400`}`)}),W(`click`,t,()=>{R(l,U(d)?`slider`:`raw`,!0)}),K(e,t)};J(C,e=>{U(o)&&!U(u)&&e(w)});var T=V(C,2),E=e=>{var n=mu();W(`click`,n,()=>{R(l,`none`),t.onReset()}),K(e,n)};J(T,e=>{t.overridden&&e(E)}),F(S),F(v);var D=V(v,2),O=e=>{var r=gu(),a=z(r);Y(a,17,()=>U(i),e=>e.value,(e,t)=>{var n=hu(),r=z(n,!0);F(n);var i={};H(()=>{q(r,U(t).label),i!==(i=U(t).value)&&(n.value=(n.__value=U(t).value)??``)}),K(e,n)});var o=V(a);o.value=o.__value=n,F(r);var s;Di(r),H(()=>{Q(r,`aria-label`,t.label||`Value`),s!==(s=U(f))&&(r.value=(r.__value=U(f))??``,Ei(r,U(f)))}),W(`change`,r,e=>h(e.target.value)),K(e,r)},k=e=>{var n=vu(),r=B(n);zi(r);var i=V(r,2),a=e=>{var t=_u();W(`click`,t,g),K(e,t)};J(i,e=>{U(s)&&e(a)}),H(()=>{Bi(r,U(p)),Q(r,`placeholder`,t.rawDefault)}),zr(`focus`,r,()=>{R(m,!0)}),zr(`blur`,r,()=>{R(m,!1);let e=U(p).trim();e?t.onRawSet?.(e):g()}),W(`keydown`,r,e=>{e.key===`Enter`&&e.currentTarget.blur()}),W(`input`,r,e=>{R(p,e.target.value,!0)}),K(e,n)},A=e=>{var n=bu(),r=B(n);eu(r,{get value(){return t.value},get min(){return t.min},get max(){return t.max},get step(){return t.step},get unit(){return t.unit},get onChange(){return t.onChange}});var i=V(r,2),a=e=>{var n=Xr(),r=B(n),i=e=>{var t=_u();W(`click`,t,g),K(e,t)},a=e=>{var n=yu(),r=z(n);F(n),H(()=>q(r,`default: ${t.rawDefault??``}`)),K(e,n)};J(r,e=>{U(s)||t.currentRaw!==void 0?e(i):e(a,-1)}),K(e,n)};J(i,e=>{U(o)&&e(a)}),K(e,n)};J(D,e=>{U(u)?e(O):U(d)?e(k,1):e(A,-1)});var ee=V(D,2),j=e=>{var n=xu(),r=z(n,!0);F(n),H(()=>q(r,t.help)),K(e,n)};J(ee,e=>{t.help&&e(j)}),F(_),K(e,_),We()}Br([`click`,`change`,`keydown`,`input`]);var Cu=G(``),wu=G(``),Tu=G(` `),Eu=G(``),Du=G(``),Ou=G(`
`);function ku(e,t){Ue(t,!0);let n=L(!1),r=L(!1),i=L(null);On(()=>{U(n)&&br().then(()=>U(i)?.focus())});function a(e){let t=e.trim();return t.startsWith(`--`)&&!t.startsWith(`var(`)?`var(${t})`:t}function o(e){dl.value;let t=a(e);return _l(t)||t||`transparent`}let s=I(()=>o(t.value||`var(${t.token})`)),c=I(()=>t.value.trim().startsWith(`var(`)||t.value.trim().startsWith(`--`));function l(e){if(e.match(/^#([0-9a-fA-F]{6})$/))return e.toLowerCase();let t=e.match(/^#([0-9a-fA-F]{3})$/);if(t)return`#`+t[1].split(``).map(e=>e+e).join(``);let n=e.match(/rgb\w*\((\d+)[,\s]+(\d+)[,\s]+(\d+)/);return n?`#`+[n[1],n[2],n[3]].map(e=>parseInt(e).toString(16).padStart(2,`0`)).join(``):`#6366f1`}var u=Ou(),d=z(u),f=z(d);let p;var m=V(f,2),h=e=>{var n=Cu();zi(n),H(e=>Bi(n,e),[()=>l(U(s))]),W(`input`,n,e=>t.onSet(e.target.value)),K(e,n)};J(m,e=>{U(c)||e(h)}),F(d);var g=V(d,2),_=e=>{var o=wu();zi(o),Qi(o,e=>R(i,e),()=>U(i)),H(()=>{Bi(o,t.value),Q(o,`placeholder`,t.placeholder??`default`)}),zr(`blur`,o,e=>{if(U(r)){R(r,!1),R(n,!1);return}let i=a(e.target.value);i?t.onSet(i):t.onReset(),R(n,!1)}),W(`keydown`,o,e=>{e.key===`Enter`&&e.currentTarget.blur(),e.key===`Escape`&&(R(r,!0),R(n,!1))}),K(e,o)},v=e=>{var r=Eu(),i=z(r),a=e=>{var n=Tu(),r=z(n,!0);F(n),H(()=>q(r,t.value)),K(e,n)},o=e=>{var n=Yr();H(()=>q(n,t.placeholder??`default`)),K(e,n)};J(i,e=>{t.isOverridden?e(a):e(o,-1)}),F(r),W(`click`,r,()=>{R(n,!0)}),K(e,r)};J(g,e=>{U(n)?e(_):e(v,-1)});var y=V(g,2),b=e=>{var n=Du();W(`click`,n,function(...e){t.onReset?.apply(this,e)}),K(e,n)};J(y,e=>{t.isOverridden&&e(b)}),F(u),H(()=>p=Z(f,``,p,{background:U(s)})),K(e,u),We()}Br([`input`,`keydown`,`click`]);var Au=(e,t=f)=>{var n=ju(),r=z(n,!0);F(n),H(()=>q(r,t())),K(e,n)},ju=G(``),Mu=G(`
Aa
`),Nu=G(`
`),Pu=G(`
`),Fu=G(``),Iu=G(`
`),Lu=G(`
`),Ru=G(`

Absolute lightness ramp — each step pins L and inherits chroma + hue from the source. Not the brand mix curve. +`}let _=L(!1),v=L(null),y=L(null),b=L(null),x=L(0),S=L(0),C=L(0),w=L(0),T=I(()=>g({},t.previewTheme,t.previewMotion,t.previewTemplate,wl)),E=I(()=>g({},`light`,t.previewMotion,t.previewTemplate,wl)),D=I(()=>g({},`dark`,t.previewMotion,t.previewTemplate,wl));On(()=>{let e=t.overrides,r=t.previewTheme,i=U(x),a=Cl.value,o=requestAnimationFrame(()=>{let t=U(v);if(i===0||!t)return;let o=t.contentDocument;if(!o)return;let c=o.getElementById(`slashed-overrides`);c&&(c.textContent=Cc(n(e),{mode:`root`,banner:!1})),s(o,e),o.documentElement.setAttribute(`data-theme`,r),a?o.documentElement.setAttribute(`data-lumlocker`,``):o.documentElement.removeAttribute(`data-lumlocker`),pl(o)});return()=>cancelAnimationFrame(o)}),On(()=>{let e=U(_),r=t.overrides,i=U(S),a=U(C),o=Cl.value;if(!e)return;let c=requestAnimationFrame(()=>{let e=Cc(n(r),{mode:`root`,banner:!1}),t=e=>{o?e.documentElement.setAttribute(`data-lumlocker`,``):e.documentElement.removeAttribute(`data-lumlocker`)},c=!1,l=!1;if(U(y)&&i>0){let n=U(y).contentDocument;if(n){let i=n.getElementById(`slashed-overrides`);i&&(i.textContent=e),s(n,r),t(n),pl(n),c=!0}}if(U(b)&&a>0){let n=U(b).contentDocument;if(n){let i=n.getElementById(`slashed-overrides`);i&&(i.textContent=e),s(n,r),t(n),l=!0}}l&&!c&&hl()});return()=>cancelAnimationFrame(c)});let O=I(()=>t.previewWidth!==`fluid`);function k(){return t.previewWidth===`fluid`?`width:100%;height:100%`:t.previewWidth===`mobile`?`width:390px;height:750px;border:1px solid rgba(255,255,255,0.12);border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 32px 80px rgba(0,0,0,0.5)`:t.previewWidth===`tablet`?`width:768px;height:900px;border:1px solid rgba(255,255,255,0.12);border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 32px 80px rgba(0,0,0,0.5)`:`width:1024px;height:720px;border:1px solid rgba(255,255,255,0.12);border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 32px 80px rgba(0,0,0,0.5)`}var A=Ml(),ee=z(A),te=z(ee);Y(te,21,()=>r,e=>e.id,(e,n)=>{var r=Tl(),i=z(r,!0);F(r),H(()=>{X(r,1,`shrink-0 px-2.5 py-0.5 rounded-md text-[10px] font-bold transition-all cursor-pointer ${t.previewTemplate===U(n).id?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(i,U(n).label)}),W(`click`,r,()=>t.onTemplateChange(U(n).id)),K(e,r)}),F(te);var j=V(te,4);Y(j,20,()=>[`fluid`,`desktop`,`tablet`,`mobile`],e=>e,(e,n)=>{var r=El(),i=z(r),a=e=>{ho(e,{class:`w-3 h-3`})},o=e=>{To(e,{class:`w-3 h-3`})},s=e=>{Ha(e,{class:`w-3 h-3`})};J(i,e=>{n===`mobile`?e(a):n===`tablet`?e(o,1):e(s,-1)}),F(r),H(()=>{Q(r,`title`,n===`fluid`?`Full width`:n===`desktop`?`Desktop (1024px)`:n===`tablet`?`Tablet (768px)`:`Mobile (390px)`),X(r,1,`p-1 rounded-md transition-all cursor-pointer ${t.previewWidth===n?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`)}),W(`click`,r,()=>t.onWidthChange(n)),K(e,r)}),F(j);var ne=V(j,2),M=z(ne);xo(z(M),{class:`w-3 h-3`}),F(M);var re=V(M,2);Wa(z(re),{class:`w-3 h-3`}),F(re);var ie=V(re,2);Sa(z(ie),{class:`w-3 h-3`}),F(ie),F(ne);var ae=V(ne,4),oe=z(ae);oe.value=oe.__value=`normal`;var se=V(oe);se.value=se.__value=`slow`;var N=V(se);N.value=N.__value=`none`,F(ae);var ce;Di(ae);var le=V(ae,2);eo(z(le),{class:`w-3 h-3`}),F(le);var ue=V(le,2);Aa(z(ue),{class:`w-3 h-3`}),F(ue),F(ee);var de=V(ee,2),fe=z(de),pe=e=>{var t=kl(),n=z(t),r=z(n),i=z(r);xo(z(i),{class:`w-2.5 h-2.5`}),Me(),F(i),F(r),ri(V(r,2),()=>U(w),e=>{var t=Dl();Qi(t,e=>R(y,e),()=>U(y)),H(()=>Q(t,`srcdoc`,U(E))),zr(`load`,t,()=>{R(S,U(S)+1)}),Lr(t),K(e,t)}),F(n);var a=V(n,2),o=z(a),s=z(o);Wa(z(s),{class:`w-2.5 h-2.5`}),Me(),F(s),F(o),ri(V(o,2),()=>U(w),e=>{var t=Ol();Qi(t,e=>R(b,e),()=>U(b)),H(()=>Q(t,`srcdoc`,U(D))),zr(`load`,t,()=>{R(C,U(C)+1)}),Lr(t),K(e,t)}),F(a),F(t),K(e,t)},me=e=>{var t=jl();ri(z(t),()=>U(w),e=>{var t=Al();Qi(t,e=>R(v,e),()=>U(v)),H(()=>Q(t,`srcdoc`,U(T))),zr(`load`,t,()=>{R(x,U(x)+1)}),Lr(t),K(e,t)}),F(t),H(e=>{Z(t,e),X(t,1,yi(U(O)?``:`w-full h-full`))},[()=>k()]),K(e,t)};J(fe,e=>{U(_)?e(pe):e(me,-1)}),F(de),F(A),H(()=>{X(M,1,`p-1 rounded-md transition-all cursor-pointer ${!U(_)&&t.previewTheme===`light`?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),X(re,1,`p-1 rounded-md transition-all cursor-pointer ${!U(_)&&t.previewTheme===`dark`?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),X(ie,1,`p-1 rounded-md transition-all cursor-pointer ${U(_)?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),ce!==(ce=t.previewMotion)&&(ae.value=(ae.__value=t.previewMotion)??``,Ei(ae,t.previewMotion)),X(de,1,`flex-1 min-h-0 flex overflow-auto ${U(O)&&!U(_)?`items-center justify-center bg-slate-100 dark:bg-[#06060a]`:``}`)}),W(`click`,M,()=>{R(_,!1),t.onThemeChange(`light`)}),W(`click`,re,()=>{R(_,!1),t.onThemeChange(`dark`)}),W(`click`,ie,()=>{R(_,!U(_))}),W(`change`,ae,e=>t.onMotionChange(e.target.value)),W(`click`,le,()=>{R(x,0),R(S,0),R(C,0),R(w,U(w)+1)}),W(`click`,ue,()=>{let e=new Blob([g(t.overrides,t.previewTheme,t.previewMotion,t.previewTemplate,wl)],{type:`text/html`}),n=URL.createObjectURL(e);window.open(n,`_blank`)}),K(e,A),We()}Br([`click`,`change`]);var Pl={macros:[`prose`,`flow-space`,`line-clamp`,`aspect`,`scroll-shadow`,`scrim`,`surface-color`,`surface-bg`,`content-intrinsic`,`corner-scoop`,`overlap-`],colors:[`color`,`contrast`,`palette-mix`,`lumlocker`,`gradient`],typography:[`font`,`--sf-text`,`leading`,`tracking`,`weight`,`body-font`,`heading-font`,`body-em`,`body-text`,`heading-text`,`display-l-`,`display-m-`,`-h1-`,`-h2-`,`-h3-`,`-h4-`,`-h5-`,`-h6-`,`link-`,`optical-sizing`,`fluid-width`,`fluid-min-vw`,`fluid-max-vw`],spacing:[`space`,`section`,`gutter`,`content-gap`,`component-pad`],layout:[`container`,`layout`,`grid`,`breakpoint`,`measure`,`column`,`header-height`,`touch-target`,`bento`,`cluster`,`cover-min`,`equal-min`,`equal-rule`,`frame`,`ratio-`,`reel`,`safe-`,`sidebar`,`switcher`,`-bg-`],components:[`btn-`,`card-`],borders:[`radius`,`border-width`,`border-scale`,`border-style`,`divider`],shadows:[`shadow`],motion:[`motion`,`duration`,`easing`,`ease`,`scroll-timeline`],effects:[`filter`,`blur`,`backdrop`,`opacity`,`effect`],misc:[`z-`,`cursor`,`ring`,`focus`,`outline`,`selection`,`icon`,`sf-is-active`,`sf-is-current`,`sf-is-open`,`sf-is-pressed`,`field-required`,`object-fit`,`object-position`,`print-`,`scrollbar`,`size-`]};function Fl(e){for(let[t,n]of Object.entries(Pl))if(t!==`misc`&&n.some(t=>e.includes(t)))return t;return`misc`}var Il=G(`You have .`,1),Ll=G(``),Rl=G(` `),zl=G(``),Bl=G(``),Vl=G(`

No saved themes yet. Configure tokens, then save.

`),Hl=G(``),Ul=G(`
`),Wl=G(`
SLASHED Studio

Configure every SLASHED design token visually. Changes appear live in the preview.

Token domains
Tools
Saved themes
`);function Gl(e,t){Ue(t,!0);let n=[{id:`colors`,icon:Ja,label:`Colors`,desc:`Brand, semantic & neutral palettes`},{id:`typography`,icon:ko,label:`Typography`,desc:`Font families & fluid type scale`},{id:`spacing`,icon:io,label:`Spacing`,desc:`Space scale & section rhythm`},{id:`layout`,icon:zo,label:`Layout`,desc:`Containers, grids & primitives`},{id:`borders`,icon:yo,label:`Borders`,desc:`Corner radius & border widths`},{id:`shadows`,icon:Ia,label:`Shadows`,desc:`Elevation & depth control`},{id:`motion`,icon:No,label:`Motion`,desc:`Duration & easing curves`},{id:`effects`,icon:_o,label:`Effects`,desc:`Blur, opacity & scrollbars`},{id:`macros`,icon:ma,label:`Macros`,desc:`Flow, prose, aspect & scrim`},{id:`misc`,icon:Xa,label:`Misc`,desc:`Z-index & remaining tokens`},{id:`components`,icon:wa,label:`Components`,desc:`Button & card component tokens`}],r=[{id:`themes`,icon:Co,label:`Themes`,desc:`Save & re-apply configurations`},{id:`wcag`,icon:uo,label:`WCAG`,desc:`Contrast checker & fixes`},{id:`setup`,icon:Ka,label:`Install`,desc:`Export overrides & setup`},{id:`cheatsheet`,icon:ga,label:`Classes`,desc:`Utility class reference`}];function i(e){return Object.keys(t.overrides).filter(t=>Fl(t)===e).length}let a=I(()=>Object.keys(t.overrides).length),o=L(nn(Pc())),s=L(``);function c(){U(a)!==0&&(R(o,Fc(U(s),t.overrides),!0),R(s,``))}var l=Wl(),u=z(l),d=z(u);_o(z(d),{class:`w-4 h-4 text-indigo-600 dark:text-indigo-400`}),Me(2),F(d);var f=V(d,2),p=V(z(f)),m=e=>{var t=Il(),n=V(B(t)),r=z(n);F(n),Me(),H(()=>q(r,`${U(a)??``} active override${U(a)===1?``:`s`}`)),K(e,t)},h=e=>{K(e,Yr(`Pick any domain below to get started.`))};J(p,e=>{U(a)>0?e(m):e(h,-1)}),F(f);var g=V(f,2),_=e=>{var n=Ll();W(`click`,n,function(...e){t.onResetAll?.apply(this,e)}),K(e,n)};J(g,e=>{U(a)>0&&e(_)}),F(u);var v=V(u,2),y=V(z(v),2);Y(y,21,()=>n,e=>e.id,(e,n)=>{let r=I(()=>i(U(n).id)),a=I(()=>U(n).icon);var o=zl(),s=z(o);mi(z(s),()=>U(a),(e,t)=>{t(e,{class:`w-4 h-4`})}),F(s);var c=V(s,2),l=z(c),u=z(l,!0);F(l);var d=V(l,2),f=z(d,!0);F(d),F(c);var p=V(c,2),m=e=>{var t=Rl(),n=z(t,!0);F(t),H(()=>q(n,U(r))),K(e,t)};J(p,e=>{U(r)>0&&e(m)}),Me(2),F(o),H(()=>{q(u,U(n).label),q(f,U(n).desc)}),W(`click`,o,()=>t.onSelect(U(n).id)),K(e,o)}),F(y),F(v);var b=V(v,2),x=V(z(b),2);Y(x,21,()=>r,e=>e.id,(e,n)=>{let r=I(()=>U(n).icon);var i=Bl(),a=z(i);mi(z(a),()=>U(r),(e,t)=>{t(e,{class:`w-4 h-4`})}),F(a);var o=V(a,2),s=z(o),c=z(s,!0);F(s);var l=V(s,2),u=z(l,!0);F(l),F(o),Me(2),F(i),H(()=>{q(c,U(n).label),q(u,U(n).desc)}),W(`click`,i,()=>t.onSelect(U(n).id)),K(e,i)}),F(x),F(b);var S=V(b,2),C=z(S),w=V(z(C),2);F(C);var T=V(C,2),E=z(T);zi(E);var D=V(E,2);oo(z(D),{class:`w-3 h-3`}),F(D),F(T);var O=V(T,2),k=e=>{K(e,Vl())},A=e=>{var n=Ul();Y(n,21,()=>U(o).slice(0,6),e=>e.id,(e,n)=>{var r=Hl(),i=z(r),a=z(i,!0);F(i);var o=V(i,2),s=z(o),c=z(s,!0);F(s);var l=V(s,2),u=z(l,!0);F(l),F(o),F(r),H(()=>{q(a,U(n).icon),q(c,U(n).name),q(u,U(n).blurb)}),W(`click`,r,()=>t.onApplyTheme(U(n).overrides)),K(e,r)}),F(n),K(e,n)};J(O,e=>{U(o).length===0?e(k):e(A,-1)}),F(S),F(l),H(()=>D.disabled=U(a)===0),W(`click`,w,()=>t.onSelect(`themes`)),W(`keydown`,E,e=>{e.key===`Enter`&&c()}),qi(E,()=>U(s),e=>R(s,e)),W(`click`,D,c),K(e,l),We()}Br([`click`,`keydown`]);var Kl={colors:[{name:`--sf-contrast-bias`,label:`Contrast bias`,help:`Shifts the lightness threshold used by text-on-color pairing toward darker (negative) or lighter (positive) text.`,default:0,min:-1,max:1,step:.05,driving:3},{name:`--sf-contrast-threshold`,label:`Contrast threshold`,help:`OKLCH lightness above which a swatch is considered 'light' (gets dark text). Below = light text.`,default:.6,min:0,max:1,step:.01,driving:11},{name:`--sf-focus-ring-width`,label:`Focus ring width`,help:`Thickness of the focus ring on every interactive element.`,default:2,min:0,max:6,step:.5,unit:`px`,driving:1}],typography:[{name:`--sf-text-scale`,label:`Text scale`,help:`Multiplier applied to the entire fluid text ramp (2xs … 2xl).`,default:1,min:.5,max:2,step:.05,driving:9},{name:`--sf-text-display-scale`,label:`Display scale`,help:`Multiplier applied to the display ramp (display-s, display-m, display-l).`,default:1,min:.5,max:2,step:.05,driving:3}],spacing:[{name:`--sf-space-scale`,label:`Space scale`,help:`Multiplier applied to every fluid spacing step. One drag moves 45 tokens.`,default:1,min:.5,max:2,step:.05,driving:45},{name:`--sf-section-scale`,label:`Section scale`,help:`Multiplier applied to section paddings only.`,default:1,min:.5,max:2,step:.05,driving:6}],borders:[{name:`--sf-radius-scale`,label:`Radius scale`,help:`Multiplier applied to every radius step (set to 0 for sharp brutalist corners).`,default:1,min:0,max:2,step:.05,driving:8}],shadows:[{name:`--sf-shadow-strength`,label:`Shadow strength`,help:`Base shadow opacity. Auto-boosted +0.17 in dark mode. Slider sets the light-mode base.`,default:.08,min:0,max:.5,step:.01,driving:14,encode:e=>`calc(${e} + var(--sf-is-dark) * 0.17)`,decode:e=>{let t=/^calc\(\s*([\d.e+-]+)/.exec(String(e));return t?parseFloat(t[1]):NaN}}],motion:[{name:`--sf-motion-scale`,label:`Motion scale`,help:`Speed multiplier on every duration. Set to 0 to effectively disable motion.`,default:1,min:0,max:2,step:.05,driving:13}]};function ql(e,t,n){let r=n*Math.PI/180,i=e,a=t*Math.cos(r),o=t*Math.sin(r),s=i+.3963377774*a+.2158037573*o,c=i-.1055613458*a-.0638541728*o,l=i-.0894841775*a-1.291485548*o,u=s*s*s,d=c*c*c,f=l*l*l,p=4.0767416621*u-3.3077115913*d+.2309699292*f,m=-1.2684380046*u+2.6097574011*d-.3413193965*f,h=-.0041960863*u-.7034186147*d+1.707614701*f,g=e=>e<=.0031308?12.92*e:1.055*e**(1/2.4)-.055;return[Math.max(0,Math.min(255,Math.round(g(p)*255))),Math.max(0,Math.min(255,Math.round(g(m)*255))),Math.max(0,Math.min(255,Math.round(g(h)*255)))]}function Jl(e,t,n){let r=e=>{let t=e/255;return t<=.04045?t/12.92:((t+.055)/1.055)**2.4};return .2126*r(e)+.7152*r(t)+.0722*r(n)}function Yl(e,t){let n=Math.max(e,t),r=Math.min(e,t);return(n+.05)/(r+.05)}function Xl(e){let t=e.match(/oklch\(\s*([\d.%]+)\s+([\d.]+)\s+([\d.]+)/i);if(t){let e=t[1];return{l:e.endsWith(`%`)?parseFloat(e)/100:parseFloat(e),c:parseFloat(t[2]),h:parseFloat(t[3]),valid:!0}}return{l:.5,c:.15,h:200,valid:!1}}function Zl(e,t,n){return`oklch(${e.toFixed(3)} ${t.toFixed(3)} ${Math.round(n)})`}var Ql=G(` `),$l=G(`
`);function eu(e,t){Ue(t,!0);let n=ra(t,`disabled`,3,!1);function r(e){return Math.min(t.max,Math.max(t.min,e))}let i=I(()=>(t.value-t.min)/(t.max-t.min)*100);var a=$l(),o=z(a),s=V(z(o),2),c=V(s,2);zi(c);var l=V(c,2);F(o);var u=V(o,2),d=z(u);zi(d);var f=V(d,2),p=e=>{var n=Ql(),r=z(n,!0);F(n),H(()=>q(r,t.unit)),K(e,n)};J(f,e=>{t.unit&&e(p)}),F(u),F(a),H(()=>{Z(s,`width: ${U(i)}%`),Q(c,`min`,t.min),Q(c,`max`,t.max),Q(c,`step`,t.step),Bi(c,t.value),c.disabled=n(),Z(l,`left: calc(${U(i)}% - 6px)`),Q(d,`min`,t.min),Q(d,`max`,t.max),Q(d,`step`,t.step),Bi(d,t.value),d.disabled=n()}),W(`input`,c,e=>t.onChange(r(parseFloat(e.target.value)))),W(`change`,d,e=>t.onChange(r(parseFloat(e.target.value)||0))),K(e,a),We()}Br([`input`,`change`]);var tu=G(`
`),nu=G(``),ru=G(`
Lightness (L)
Chroma (C)
Hue (H)
Raw value
`),iu=G(`
`);function au(e,t){Ue(t,!0);function n(e){let t=/oklch\(\s*([\d.]+)\s+([\d.]+)\s+([\d.]+)\s*\)/.exec(e);return t?{l:parseFloat(t[1]),c:parseFloat(t[2]),h:parseFloat(t[3])}:null}function r(e,t,n){return`oklch(${e.toFixed(3)} ${t.toFixed(3)} ${n.toFixed(1)})`}function i(e,t,n){let r=n*Math.PI/180,i=t*Math.cos(r),a=t*Math.sin(r),o=e+.3963377774*i+.2158037573*a,s=e-.1055613458*i-.0638541728*a,c=e-.0894841775*i-1.291485548*a,l=o*o*o,u=s*s*s,d=c*c*c,f=4.0767416621*l-3.3077115913*u+.2309699292*d,p=-1.2684380046*l+2.6097574011*u-.3413193965*d,m=-.0041960863*l-.7034186147*u+1.707614701*d,h=e=>e<=0?0:e>=1?255:Math.round(e**(1/2.2)*255);return`rgb(${h(f)},${h(p)},${h(m)})`}let a=I(()=>n(t.value)??{l:.6,c:.15,h:264}),o=L(!1),s=L(``),c=I(()=>i(U(a).l,U(a).c,U(a).h)),l=I(()=>t.tokenName.replace(`--sf-`,``));function u(e,n,i){t.onChange(r(e,n,i))}var d=iu(),f=z(d),p=z(f);let m;var h=V(p,2),g=z(h),_=z(g,!0);F(g);var v=V(g,2),y=z(v,!0);F(v);var b=V(v,2),x=z(b,!0);F(b),F(h);var S=V(h,2),C=e=>{K(e,tu())};J(S,e=>{t.overridden&&e(C)});var w=V(S,2);F(f);var T=V(f,2),E=e=>{var n=ru(),r=z(n),i=z(r),o=V(z(i),2),c=z(o,!0);F(o),F(i);var l=V(i,2);eu(V(l,2),{get value(){return U(a).l},min:0,max:1,step:.005,onChange:e=>u(e,U(a).c,U(a).h)}),F(r);var d=V(r,2),f=z(d),p=V(z(f),2),m=z(p,!0);F(p),F(f),eu(V(f,2),{get value(){return U(a).c},min:0,max:.4,step:.005,onChange:e=>u(U(a).l,e,U(a).h)}),F(d);var h=V(d,2),g=z(h),_=V(z(g),2),v=z(_);F(_),F(g);var y=V(g,2);eu(V(y,2),{get value(){return U(a).h},min:0,max:360,step:1,unit:`°`,onChange:e=>u(U(a).l,U(a).c,e)}),F(h);var b=V(h,2),x=V(z(b),2),S=z(x);zi(S);var C=V(S,2),w=e=>{var n=nu();W(`click`,n,function(...e){t.onReset?.apply(this,e)}),K(e,n)};J(C,e=>{t.overridden&&e(w)}),F(x),F(b),F(n),H((e,n,r,i,a)=>{q(c,e),Z(l,n),q(m,r),q(v,`${i??``}°`),Z(y,a),Bi(S,U(s)||t.value)},[()=>U(a).l.toFixed(3),()=>`background: linear-gradient(to right, oklch(0 ${U(a).c.toFixed(3)} ${U(a).h.toFixed(1)}), oklch(1 ${U(a).c.toFixed(3)} ${U(a).h.toFixed(1)}))`,()=>U(a).c.toFixed(3),()=>U(a).h.toFixed(1),()=>`background: linear-gradient(to right, oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 0), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 60), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 120), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 180), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 240), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 300), oklch(${U(a).l.toFixed(3)} ${U(a).c.toFixed(3)} 360))`]),W(`input`,S,e=>{R(s,e.target.value,!0)}),zr(`blur`,S,()=>{U(s).trim()&&(t.onChange(U(s).trim()),R(s,``))}),W(`keydown`,S,e=>{e.key===`Enter`&&(U(s).trim()&&(t.onChange(U(s).trim()),R(s,``)),e.currentTarget.blur())}),K(e,n)};J(T,e=>{U(o)&&e(E)}),F(d),H(()=>{X(d,1,`rounded-xl border transition-all ${t.overridden?`bg-indigo-500/8 border-indigo-500/20`:`bg-black/4 dark:bg-white/4 border-black/8 dark:border-white/8 hover:border-black/12 dark:hover:border-white/12`}`),m=Z(p,``,m,{background:U(c)}),q(_,t.label),q(y,U(l)),q(x,t.value),X(w,1,`text-slate-500 text-[10px] transition-transform ${U(o)?`rotate-180`:``}`)}),W(`click`,f,()=>{R(o,!U(o))}),K(e,d),We()}Br([`click`,`input`,`keydown`]);var ou=G(` `),su=G(``),cu=G(`

`),lu=G(`
`);function uu(e,t){Ue(t,!0);let n=I(()=>t.overrides[t.knob.name]),r=I(()=>U(n)===void 0?t.knob.default:t.knob.decode?t.knob.decode(U(n)):parseFloat(U(n))),i=I(()=>isNaN(U(r))?t.knob.default:U(r)),a=I(()=>t.knob.name in t.overrides);function o(e){let n=t.knob.encode?t.knob.encode(e):String(e);t.onChange(t.knob.name,n)}function s(){t.onChange(t.knob.name,null)}var c=lu(),l=z(c),u=z(l),d=z(u),f=z(d,!0);F(d);var p=V(d,2),m=e=>{var n=ou(),r=z(n);F(n),H(()=>q(r,`→ ${t.knob.driving??``} tokens`)),K(e,n)};J(p,e=>{t.knob.driving!==void 0&&e(m)}),F(u);var h=V(u,2),g=e=>{var t=su();W(`click`,t,s),K(e,t)};J(h,e=>{U(a)&&e(g)}),F(l);var _=V(l,2);eu(_,{get value(){return U(i)},get min(){return t.knob.min},get max(){return t.knob.max},get step(){return t.knob.step},get unit(){return t.knob.unit},onChange:o});var v=V(_,2),y=e=>{var n=cu(),r=z(n,!0);F(n),H(()=>q(r,t.knob.help)),K(e,n)};J(v,e=>{t.knob.help&&e(y)}),F(c),H(()=>q(f,t.knob.label)),K(e,c),We()}Br([`click`]);var du=G(` `),fu=G(``),pu=G(``),mu=G(``),hu=G(``),gu=G(``),_u=G(``),vu=G(` `,1),yu=G(`

`),bu=G(` `,1),xu=G(`

`),Su=G(`
`);function $(e,t){Ue(t,!0);let n=`__sf_custom__`;function r(e){let t=e.match(/^var\(\s*(--sf-[\w-]+)/);return t?t[1].replace(/^--sf-/,``):e}let i=I(()=>{let e=[];t.rawDefault&&e.push({label:`${r(t.rawDefault)} (default)`,value:t.rawDefault});for(let n of t.variableOptions??[])n.value!==t.rawDefault&&e.push(n);return e}),a=I(()=>U(i).find(e=>e.value===(t.currentRaw??t.rawDefault))),o=I(()=>!!t.rawDefault&&!!t.onRawSet),s=I(()=>U(o)&&(t.variableOptions?.length??0)>0),c=I(()=>!!t.currentRaw&&/^(var|calc|clamp|min|max|env)\(/.test(t.currentRaw.trim())),l=L(`none`),u=I(()=>U(s)&&U(l)===`none`&&(t.currentRaw===void 0||!!U(a))),d=I(()=>U(o)&&!U(u)&&(U(l)===`raw`||U(l)===`none`&&U(c))),f=I(()=>U(a)?.value??t.rawDefault??n),p=L(``),m=L(!1);On(()=>{U(m)||R(p,t.currentRaw??``,!0)});function h(e){if(e===n){R(l,`slider`);return}R(l,`none`),e===t.rawDefault?t.onReset():t.onRawSet?.(e)}function g(){R(l,`none`),t.onReset()}var _=Su(),v=z(_),y=z(v),b=e=>{var n=du(),r=z(n,!0);F(n),H(()=>q(r,t.label)),K(e,n)},x=e=>{K(e,fu())};J(y,e=>{t.label?e(b):e(x,-1)});var S=V(y,2),C=z(S),w=e=>{var t=pu();H(()=>{Q(t,`title`,U(d)?`Switch to slider`:`Enter raw CSS value`),X(t,1,`text-[9px] font-mono cursor-pointer transition-all px-0.5 ${U(d)?`text-indigo-600 dark:text-indigo-400`:`opacity-100 sm:opacity-0 sm:group-hover:opacity-100 sm:group-focus-within:opacity-100 focus:opacity-100 text-slate-500 hover:text-indigo-600 dark:hover:text-indigo-400`}`)}),W(`click`,t,()=>{R(l,U(d)?`slider`:`raw`,!0)}),K(e,t)};J(C,e=>{U(o)&&!U(u)&&e(w)});var T=V(C,2),E=e=>{var n=mu();W(`click`,n,()=>{R(l,`none`),t.onReset()}),K(e,n)};J(T,e=>{t.overridden&&e(E)}),F(S),F(v);var D=V(v,2),O=e=>{var r=gu(),a=z(r);Y(a,17,()=>U(i),e=>e.value,(e,t)=>{var n=hu(),r=z(n,!0);F(n);var i={};H(()=>{q(r,U(t).label),i!==(i=U(t).value)&&(n.value=(n.__value=U(t).value)??``)}),K(e,n)});var o=V(a);o.value=o.__value=n,F(r);var s;Di(r),H(()=>{Q(r,`aria-label`,t.label||`Value`),s!==(s=U(f))&&(r.value=(r.__value=U(f))??``,Ei(r,U(f)))}),W(`change`,r,e=>h(e.target.value)),K(e,r)},k=e=>{var n=vu(),r=B(n);zi(r);var i=V(r,2),a=e=>{var t=_u();W(`click`,t,g),K(e,t)};J(i,e=>{U(s)&&e(a)}),H(()=>{Bi(r,U(p)),Q(r,`placeholder`,t.rawDefault)}),zr(`focus`,r,()=>{R(m,!0)}),zr(`blur`,r,()=>{R(m,!1);let e=U(p).trim();e?t.onRawSet?.(e):g()}),W(`keydown`,r,e=>{e.key===`Enter`&&e.currentTarget.blur()}),W(`input`,r,e=>{R(p,e.target.value,!0)}),K(e,n)},A=e=>{var n=bu(),r=B(n);eu(r,{get value(){return t.value},get min(){return t.min},get max(){return t.max},get step(){return t.step},get unit(){return t.unit},get onChange(){return t.onChange}});var i=V(r,2),a=e=>{var n=Xr(),r=B(n),i=e=>{var t=_u();W(`click`,t,g),K(e,t)},a=e=>{var n=yu(),r=z(n);F(n),H(()=>q(r,`default: ${t.rawDefault??``}`)),K(e,n)};J(r,e=>{U(s)||t.currentRaw!==void 0?e(i):e(a,-1)}),K(e,n)};J(i,e=>{U(o)&&e(a)}),K(e,n)};J(D,e=>{U(u)?e(O):U(d)?e(k,1):e(A,-1)});var ee=V(D,2),te=e=>{var n=xu(),r=z(n,!0);F(n),H(()=>q(r,t.help)),K(e,n)};J(ee,e=>{t.help&&e(te)}),F(_),K(e,_),We()}Br([`click`,`change`,`keydown`,`input`]);var Cu=G(``),wu=G(``),Tu=G(` `),Eu=G(``),Du=G(``),Ou=G(`
`);function ku(e,t){Ue(t,!0);let n=L(!1),r=L(!1),i=L(null);On(()=>{U(n)&&br().then(()=>U(i)?.focus())});function a(e){let t=e.trim();return t.startsWith(`--`)&&!t.startsWith(`var(`)?`var(${t})`:t}function o(e){dl.value;let t=a(e);return _l(t)||t||`transparent`}let s=I(()=>o(t.value||`var(${t.token})`)),c=I(()=>t.value.trim().startsWith(`var(`)||t.value.trim().startsWith(`--`));function l(e){if(e.match(/^#([0-9a-fA-F]{6})$/))return e.toLowerCase();let t=e.match(/^#([0-9a-fA-F]{3})$/);if(t)return`#`+t[1].split(``).map(e=>e+e).join(``);let n=e.match(/rgb\w*\((\d+)[,\s]+(\d+)[,\s]+(\d+)/);return n?`#`+[n[1],n[2],n[3]].map(e=>parseInt(e).toString(16).padStart(2,`0`)).join(``):`#6366f1`}var u=Ou(),d=z(u),f=z(d);let p;var m=V(f,2),h=e=>{var n=Cu();zi(n),H(e=>Bi(n,e),[()=>l(U(s))]),W(`input`,n,e=>t.onSet(e.target.value)),K(e,n)};J(m,e=>{U(c)||e(h)}),F(d);var g=V(d,2),_=e=>{var o=wu();zi(o),Qi(o,e=>R(i,e),()=>U(i)),H(()=>{Bi(o,t.value),Q(o,`placeholder`,t.placeholder??`default`)}),zr(`blur`,o,e=>{if(U(r)){R(r,!1),R(n,!1);return}let i=a(e.target.value);i?t.onSet(i):t.onReset(),R(n,!1)}),W(`keydown`,o,e=>{e.key===`Enter`&&e.currentTarget.blur(),e.key===`Escape`&&(R(r,!0),R(n,!1))}),K(e,o)},v=e=>{var r=Eu(),i=z(r),a=e=>{var n=Tu(),r=z(n,!0);F(n),H(()=>q(r,t.value)),K(e,n)},o=e=>{var n=Yr();H(()=>q(n,t.placeholder??`default`)),K(e,n)};J(i,e=>{t.isOverridden?e(a):e(o,-1)}),F(r),W(`click`,r,()=>{R(n,!0)}),K(e,r)};J(g,e=>{U(n)?e(_):e(v,-1)});var y=V(g,2),b=e=>{var n=Du();W(`click`,n,function(...e){t.onReset?.apply(this,e)}),K(e,n)};J(y,e=>{t.isOverridden&&e(b)}),F(u),H(()=>p=Z(f,``,p,{background:U(s)})),K(e,u),We()}Br([`input`,`keydown`,`click`]);var Au=(e,t=f)=>{var n=ju(),r=z(n,!0);F(n),H(()=>q(r,t())),K(e,n)},ju=G(``),Mu=G(`
Aa
`),Nu=G(`
`),Pu=G(`
`),Fu=G(``),Iu=G(`
`),Lu=G(`
`),Ru=G(`

Absolute lightness ramp — each step pins L and inherits chroma + hue from the source. Not the brand mix curve. Light and dark use the same L per step, so at the default near-zero chroma the two rows look almost identical — add chroma above to see them diverge by hue.

`),zu=G(`
L
D
`,1),Bu=G(`
`),Vu=G(`
`),Hu=G(`

OKLCH source values — all 200+ derived color steps are computed automatically. Tints (50–400) mix toward Base (the "Surface" color) and shades (600–950) mix toward Text (driven by Neutral) — so editing Base or Neutral below @@ -5591,22 +5591,22 @@ ${h[i]} lightness — useful for always-stable sections. Enable on canvas to preview.

Color Current Locked
`,1),Gu=G(` `),Ku=G(`
`),qu=G(`
`),Ju=G(`

Status colors don't ride the brand mix curve — only the resolved color plus subtle/muted alpha washes and a strong shade are derived. There's no -50…-950 ramp for success/warning/info/danger.

`),Yu=G(`

Dark mode is auto-derived from each light source by default. Switch to Manual dark to set a bespoke dark value.

`,1),Xu=G(`
Aa
`),Zu=G(``),Qu=G(`

Controls whether text on brand-coloured surfaces is light or dark.

`,1),$u=G(``),ed=G(`
`),td=G(`
`),nd=G(`
`),rd=G(`

Controls how much color is mixed into each palette step. Step 500 is always the source color.

Tints (50–400) — mixed toward surface
Shades (600–950) — mixed toward text
Palette & curve preview

Bar height = mix amount · fill = the resolved primary palette swatch at each step

Mini palettes — all brand colors
`,1),id=G(``),ad=G(`
Dir
`),od=G(`
Angle
`),sd=G(`
Stops
default:
`),cd=G(`
`,1),ld=G(`

Auto-derived from your brand colors. Use the angle/direction and stop - controls, or edit the raw value for full control.

`,1),ud=G(`

--sf-color-scheme — sets the CSS color-scheme property on the root, controlling browser UI (scrollbars, inputs) and default background.

`,1),dd=G(`
`),fd=G(`

Direct color overrides for tokens the framework auto-derives. Use for edge cases.

`,1),pd=G(`
Semantic colors

Live preview — every semantic role on its on-color text, shown in light and dark. Resolved from the canvas, updates as you edit.

All tokens tab — override individual color steps (50–950), semantic aliases, or surface tokens directly.

`);function md(e,t){Ue(t,!0);function n(e,t){return dl.value,_l(e)||t}function r(e,t){dl.value;let n=Sl(e);return n&&n!==`none`?n:t}function i(e,t,n){return dl.value,yl(e,t)||n}let a=[{name:`--sf-gradient-primary`,label:`Primary`,group:`brand`,kind:`angle`,space:`oklch`,angle:135,dir:`right`,stop1:`var(--sf-color-primary)`,stop2:`oklch(from var(--sf-color-primary) calc(l - 0.08) c h)`,formula:`linear-gradient(in oklch 135deg, var(--sf-color-primary), oklch(from var(--sf-color-primary) calc(l - 0.08) c h))`},{name:`--sf-gradient-secondary`,label:`Secondary`,group:`brand`,kind:`angle`,space:`oklch`,angle:135,dir:`right`,stop1:`var(--sf-color-secondary)`,stop2:`oklch(from var(--sf-color-secondary) calc(l - 0.08) c h)`,formula:`linear-gradient(in oklch 135deg, var(--sf-color-secondary), oklch(from var(--sf-color-secondary) calc(l - 0.08) c h))`},{name:`--sf-gradient-tertiary`,label:`Tertiary`,group:`brand`,kind:`angle`,space:`oklch`,angle:135,dir:`right`,stop1:`var(--sf-color-tertiary)`,stop2:`oklch(from var(--sf-color-tertiary) calc(l - 0.08) c h)`,formula:`linear-gradient(in oklch 135deg, var(--sf-color-tertiary), oklch(from var(--sf-color-tertiary) calc(l - 0.08) c h))`},{name:`--sf-gradient-brand`,label:`Brand`,group:`brand`,kind:`angle`,space:`oklch`,angle:135,dir:`right`,stop1:`var(--sf-color-primary)`,stop2:`oklch(from var(--sf-color-primary) l c calc(h + 30))`,formula:`linear-gradient(in oklch 135deg, var(--sf-color-primary), oklch(from var(--sf-color-primary) l c calc(h + 30)))`},{name:`--sf-gradient-surface`,label:`Surface`,group:`brand`,kind:`angle`,space:`oklab`,angle:180,dir:`bottom`,stop1:`var(--sf-color-surface)`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklab 180deg, var(--sf-color-surface), var(--sf-color-bg))`},{name:`--sf-gradient-fade--r`,label:`Fade →`,group:`fade`,kind:`dir`,space:`oklch`,angle:90,dir:`right`,stop1:`transparent`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklch to right, transparent, var(--sf-color-bg))`},{name:`--sf-gradient-fade--l`,label:`Fade ←`,group:`fade`,kind:`dir`,space:`oklch`,angle:270,dir:`left`,stop1:`transparent`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklch to left, transparent, var(--sf-color-bg))`},{name:`--sf-gradient-fade--t`,label:`Fade ↑`,group:`fade`,kind:`dir`,space:`oklch`,angle:0,dir:`top`,stop1:`transparent`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklch to top, transparent, var(--sf-color-bg))`},{name:`--sf-gradient-fade--b`,label:`Fade ↓`,group:`fade`,kind:`dir`,space:`oklch`,angle:180,dir:`bottom`,stop1:`transparent`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklch to bottom, transparent, var(--sf-color-bg))`}],o=[{key:`primary`,label:`Primary`},{key:`secondary`,label:`Secondary`},{key:`tertiary`,label:`Tertiary`},{key:`action`,label:`Action`}],s=[{name:`--sf-color-primary-source-light`,label:`Primary`,side:`light`,default:`oklch(0.47 0.27 264)`,colorKey:`primary`},{name:`--sf-color-primary-source-dark`,label:`Primary`,side:`dark`,default:`oklch(0.715 0.243 264)`,colorKey:`primary`},{name:`--sf-color-secondary-source-light`,label:`Secondary`,side:`light`,default:`oklch(0.22 0.04 264)`,colorKey:`secondary`},{name:`--sf-color-secondary-source-dark`,label:`Secondary`,side:`dark`,default:`oklch(0.84 0.036 264)`,colorKey:`secondary`},{name:`--sf-color-tertiary-source-light`,label:`Tertiary`,side:`light`,default:`oklch(0.42 0.22 295)`,colorKey:`tertiary`},{name:`--sf-color-tertiary-source-dark`,label:`Tertiary`,side:`dark`,default:`oklch(0.74 0.198 295)`,colorKey:`tertiary`},{name:`--sf-color-action-source-light`,label:`Action`,side:`light`,default:`oklch(0.50 0.22 235)`,colorKey:`action`},{name:`--sf-color-action-source-dark`,label:`Action`,side:`dark`,default:`oklch(0.70 0.198 235)`,colorKey:`action`},{name:`--sf-color-neutral-source-light`,label:`Neutral`,side:`light`,default:`oklch(0.52 0.025 260)`,colorKey:`neutral`},{name:`--sf-color-neutral-source-dark`,label:`Neutral`,side:`dark`,default:`oklch(0.69 0.0225 260)`,colorKey:`neutral`},{name:`--sf-color-base-source-light`,label:`Base`,side:`light`,default:`oklch(0.96 0.006 250)`,colorKey:`base`},{name:`--sf-color-base-source-dark`,label:`Base`,side:`dark`,default:`oklch(0.22 0.003 250)`,colorKey:`base`}],c=[{name:`--sf-color-success-source-light`,label:`Success`,side:`light`,default:`oklch(0.50 0.16 145)`,colorKey:`success`},{name:`--sf-color-success-source-dark`,label:`Success`,side:`dark`,default:`oklch(0.70 0.144 145)`,colorKey:`success`},{name:`--sf-color-warning-source-light`,label:`Warning`,side:`light`,default:`oklch(0.75 0.17 80)`,colorKey:`warning`},{name:`--sf-color-warning-source-dark`,label:`Warning`,side:`dark`,default:`oklch(0.65 0.153 80)`,colorKey:`warning`},{name:`--sf-color-info-source-light`,label:`Info`,side:`light`,default:`oklch(0.48 0.18 235)`,colorKey:`info`},{name:`--sf-color-info-source-dark`,label:`Info`,side:`dark`,default:`oklch(0.71 0.162 235)`,colorKey:`info`},{name:`--sf-color-danger-source-light`,label:`Danger`,side:`light`,default:`oklch(0.48 0.22 12)`,colorKey:`danger`},{name:`--sf-color-danger-source-dark`,label:`Danger`,side:`dark`,default:`oklch(0.73 0.198 12)`,colorKey:`danger`}],l=[{name:`--sf-palette-mix-50`,label:`50`,step:`tint`,default:4},{name:`--sf-palette-mix-100`,label:`100`,step:`tint`,default:8},{name:`--sf-palette-mix-200`,label:`200`,step:`tint`,default:20},{name:`--sf-palette-mix-300`,label:`300`,step:`tint`,default:40},{name:`--sf-palette-mix-400`,label:`400`,step:`tint`,default:65},{name:`--sf-palette-mix-600`,label:`600`,step:`shade`,default:82},{name:`--sf-palette-mix-700`,label:`700`,step:`shade`,default:62},{name:`--sf-palette-mix-800`,label:`800`,step:`shade`,default:38},{name:`--sf-palette-mix-900`,label:`900`,step:`shade`,default:18},{name:`--sf-palette-mix-950`,label:`950`,step:`shade`,default:8}],u=[{label:`Softer`,desc:`Low contrast palette`,patch:{"--sf-palette-mix-50":`3%`,"--sf-palette-mix-100":`6%`,"--sf-palette-mix-200":`14%`,"--sf-palette-mix-300":`30%`,"--sf-palette-mix-400":`55%`,"--sf-palette-mix-600":`72%`,"--sf-palette-mix-700":`52%`,"--sf-palette-mix-800":`28%`,"--sf-palette-mix-900":`12%`,"--sf-palette-mix-950":`5%`}},{label:`Default`,desc:`Balanced contrast`,patch:Object.fromEntries(l.map(e=>[e.name,null]))},{label:`Punchy`,desc:`High contrast palette`,patch:{"--sf-palette-mix-50":`6%`,"--sf-palette-mix-100":`12%`,"--sf-palette-mix-200":`28%`,"--sf-palette-mix-300":`52%`,"--sf-palette-mix-400":`78%`,"--sf-palette-mix-600":`90%`,"--sf-palette-mix-700":`72%`,"--sf-palette-mix-800":`50%`,"--sf-palette-mix-900":`26%`,"--sf-palette-mix-950":`12%`}}],d=[{name:`--sf-color-link`,label:`Link`},{name:`--sf-color-link--visited`,label:`Link visited`},{name:`--sf-color-mark-bg`,label:`Mark background`},{name:`--sf-color-mark-text`,label:`Mark text`},{name:`--sf-color-code-bg`,label:`Code background`},{name:`--sf-color-code-text`,label:`Code text`},{name:`--sf-color-overlay`,label:`Overlay`},{name:`--sf-color-black`,label:`Black`},{name:`--sf-color-white`,label:`White`},{name:`--sf-color-dim`,label:`Dim (translucent black)`}],f=[`50`,`100`,`200`,`300`,`400`,`500`,`600`,`700`,`800`,`900`,`950`],p=[`primary`,`secondary`,`tertiary`,`action`,`neutral`],m={50:.97,100:.94,200:.88,300:.78,400:.65,500:.5,600:.37,700:.27,800:.17,900:.11,950:.06},g=[...p,`base`],_=[{label:`Base`,expr:e=>`var(--sf-color-${e})`},{label:`Subtle`,expr:e=>`var(--sf-color-${e}-subtle)`},{label:`Muted`,expr:e=>`var(--sf-color-${e}-muted)`},{label:`Strong`,expr:e=>`var(--sf-color-${e}-strong)`}],v=[...s,...c],y=[{heading:`Brand`,items:[{name:`--sf-color-primary`,label:`Primary`,fg:`--sf-color-text--on-primary`},{name:`--sf-color-secondary`,label:`Secondary`,fg:`--sf-color-text--on-secondary`},{name:`--sf-color-tertiary`,label:`Tertiary`,fg:`--sf-color-text--on-tertiary`},{name:`--sf-color-action`,label:`Action`,fg:`--sf-color-text--on-action`},{name:`--sf-color-neutral`,label:`Neutral`,fg:`--sf-color-text--on-neutral`}]},{heading:`Status`,items:[{name:`--sf-color-success`,label:`Success`,fg:`--sf-color-text--on-success`},{name:`--sf-color-warning`,label:`Warning`,fg:`--sf-color-text--on-warning`},{name:`--sf-color-info`,label:`Info`,fg:`--sf-color-text--on-info`},{name:`--sf-color-danger`,label:`Danger`,fg:`--sf-color-text--on-danger`}]},{heading:`Surfaces & text`,items:[{name:`--sf-color-bg`,label:`Bg`,fg:`--sf-color-text`},{name:`--sf-color-surface`,label:`Surface`,fg:`--sf-color-text`},{name:`--sf-color-raised`,label:`Raised`,fg:`--sf-color-text`},{name:`--sf-color-inset`,label:`Inset`,fg:`--sf-color-text`},{name:`--sf-color-inverse`,label:`Inverse`,fg:`--sf-color-text--on-inverse`}]}],b=(Kl.colors??[]).filter(e=>e.name===`--sf-contrast-bias`||e.name===`--sf-contrast-threshold`),x=(Kl.colors??[]).filter(e=>e.name===`--sf-focus-ring-width`),S=L(!1),C=L(!1),w=L(!1),T=L(!1),E=L(!1),D=L(!1),O=L(!1),k=L(!1),A=L(`light`),ee=nn({}),j=I(()=>parseFloat(t.overrides[`--sf-lumlocker`]??`0.65`));function te(e){let t=e.match(/^linear-gradient\(\s*in\s+(\S+)\s+(to\s+\w+|\d+deg)\s*,(.+)\)$/i);if(!t)return null;let n=t[1],r=t[2].trim(),i=r.startsWith(`to `),a=i?r.slice(3).trim():`right`,o=i?0:parseInt(r),s=0,c=0,l=[],u=t[3];for(let e=0;ee.name===r)?.default??``;return i?`oklch(from ${i} ${U(j)} c h)`:``}let oe=L(nn(new Set(v.filter(e=>e.side===`light`&&!((v.find(t=>t.colorKey===e.colorKey&&t.side===`dark`)?.name??``)in t.overrides)).map(e=>e.colorKey)))),se=I(()=>{let e={};for(let n of t.tokens)v.some(e=>e.name===n.name)&&(e[n.name]=n);return e});function N(e){return e?t.overrides[e.name]??U(se)[e.name]?.value??e.default:``}function ce(e){return v.find(t=>t.name===e)}let le=I(()=>u.find(e=>Object.entries(e.patch).every(([e,n])=>n===null?!(e in t.overrides):t.overrides[e]===n)));function ue(e){let n=t.overrides[e.name];return n?parseFloat(n):e.default}let de=[];for(let e=0;ee.label===t);if(!a)return e;let o=`color-mix(in oklab, ${e} ${ue(a)}%, ${i?n:r})`;return _l(o)||o}function ye(e,t){dl.value;let n=m[t];if(n===void 0)return e;let r=`oklch(from ${e} ${n} c h)`;return _l(r)||r}function be(e,t,n,r,i){return e===`base`?ye(t,n):ve(t,n,r,i)}function xe(e,n,r){t.onSet(e.name,r)}function Se(e,n,r){let i=!!(n&&n.name in t.overrides);if(U(oe).has(e)&&!i){let i=N(v.find(e=>e.name===r));n&&t.onSet(n.name,pe(i,e)),R(oe,new Set([...U(oe)].filter(t=>t!==e)),!0)}else n&&t.onBulkChange({[n.name]:null}),R(oe,new Set([...U(oe),e]),!0)}let Ce=[{label:`Body text on surface`,fg:`var(--sf-color-text)`,bg:`var(--sf-color-surface)`},{label:`White on primary`,fg:`#ffffff`,bg:`var(--sf-color-primary)`},{label:`Primary on surface`,fg:`var(--sf-color-primary)`,bg:`var(--sf-color-surface)`}];function we(e,t){dl.value;let n=xl(e),r=xl(t);return!n||!r?null:Yl(Jl(...n),Jl(...r))}var Te=pd(),Ee=z(Te),De=V(z(Ee),4);Y(De,21,()=>y,e=>e.heading,(e,t)=>{var n=Pu(),r=z(n),a=z(r,!0);F(r),Y(V(r,2),16,()=>[`light`,`dark`],e=>e,(e,n)=>{var r=Nu(),a=z(r),o=z(a,!0);F(a);var s=V(a,2);Y(s,21,()=>U(t).items,e=>e.name,(e,t)=>{let r=I(()=>i(`var(${U(t).name})`,n,`transparent`)),a=I(()=>i(`var(${U(t).fg})`,n,`currentColor`));var o=Mu(),s=V(z(o),2),c=z(s,!0);F(s),F(o),H(()=>{Z(o,`background:${U(r)}; color:${U(a)}`),Q(o,`title`,`${U(t).name} (${n}) — ${U(r)}`),q(c,U(t).label)}),K(e,o)}),F(s),F(r),H(()=>q(o,n===`light`?`L`:`D`)),K(e,r)}),F(n),H(()=>q(a,U(t).heading)),K(e,n)}),F(De),F(Ee);var P=V(Ee,4),Oe=z(P),ke=V(z(Oe),2),Ae=z(ke,!0);F(ke),F(Oe);var je=V(Oe,2),Ne=e=>{var r=Hu(),i=V(B(r),2);Y(i,21,()=>de,([e,t])=>e.name,(e,r)=>{var i=I(()=>h(U(r),2));let a=()=>U(i)[0],o=()=>U(i)[1],s=I(()=>!!(o()&&o().name in t.overrides)),c=I(()=>U(oe).has(a().colorKey)&&!U(s));var l=Vu(),u=z(l),d=z(u),p=z(d,!0);F(d);var m=V(d,2),_=e=>{var t=Fu(),n=z(t,!0);F(t),H(()=>{X(t,1,`text-[8px] px-1.5 py-0.5 rounded border transition-all cursor-pointer ${U(c)?`border-indigo-500/40 bg-indigo-500/15 text-indigo-700 dark:text-indigo-300`:`border-black/10 dark:border-white/10 text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(n,U(c)?`Auto dark`:`Manual dark`)}),W(`click`,t,()=>Se(a().colorKey,o(),a().name)),K(e,t)};J(m,e=>{o()&&e(_)}),F(u);var v=V(u,2);{let e=I(()=>`${a().label} (light)`),n=I(()=>N(a())),r=I(()=>a().name in t.overrides);au(v,{get label(){return U(e)},get tokenName(){return a().name},get value(){return U(n)},get overridden(){return U(r)},onChange:e=>xe(a(),o(),e),onReset:()=>t.onReset(a().name)})}var y=V(v,2),b=e=>{let t=I(()=>N(a())),n=I(()=>U(c)?pe(U(t),a().colorKey):o()?N(o()):U(t)),r=I(me),i=I(he),s=I(ge),l=I(_e);var u=zu(),d=B(u),p=z(d),m=V(z(p),2);Y(m,20,()=>f,e=>e,(e,n)=>{let i=I(()=>be(a().colorKey,U(t),n,U(r),U(s)));var o=Iu();let c;Au(z(o),()=>`${a().colorKey}-${n}`),F(o),H(()=>{Q(o,`title`,`${a().colorKey}-${n} (light) — ${U(i)}`),c=Z(o,``,c,{background:U(i)})}),K(e,o)}),F(m),F(p);var h=V(p,2),g=V(z(h),2);Y(g,20,()=>f,e=>e,(e,t)=>{let r=I(()=>be(a().colorKey,U(n),t,U(i),U(l)));var o=Lu();let s;Au(z(o),()=>`${a().colorKey}-${t}`),F(o),H(()=>{Q(o,`title`,`${a().colorKey}-${t} (dark) — ${U(r)}`),s=Z(o,``,s,{background:U(r)})}),K(e,o)}),F(g),F(h),F(d);var _=V(d,2),v=e=>{K(e,Ru())};J(_,e=>{a().colorKey===`base`&&e(v)}),K(e,u)},x=I(()=>g.includes(a().colorKey));J(y,e=>{U(x)&&e(b)});var S=V(y,2),C=e=>{{let n=I(()=>`${o().label} (dark mode)`),r=I(()=>N(o())),i=I(()=>o().name in t.overrides);au(e,{get label(){return U(n)},get tokenName(){return o().name},get value(){return U(r)},get overridden(){return U(i)},onChange:e=>t.onSet(o().name,e),onReset:()=>t.onReset(o().name)})}},w=e=>{let t=I(()=>pe(N(a()),a().colorKey));var r=Bu(),i=z(r);let o;var s=V(i);F(r),H(e=>{Q(i,`title`,U(t)),o=Z(i,``,o,e),q(s,` Dark: auto-derived (${U(t)??``})`)},[()=>({background:n(U(t),U(t))})]),K(e,r)};J(S,e=>{o()&&!U(c)?e(C):o()&&U(c)&&e(w,1)}),F(l),H(()=>q(p,a().label)),K(e,l)}),F(i),K(e,r)};J(je,e=>{U(S)&&e(Ne)}),F(P);var Pe=V(P,4),Fe=z(Pe),Ie=V(z(Fe),2),Le=z(Ie,!0);F(Ie),F(Fe);var Re=V(Fe,2),ze=e=>{var r=Wu(),a=V(B(r),2);{let e=I(()=>`--sf-lumlocker`in t.overrides);$(a,{label:`LumLocker lightness (L)`,get value(){return U(j)},min:0,max:1,step:.01,help:`--sf-lumlocker — fixed OKLCH L applied to lockable brand colors under [data-lumlocker]`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-lumlocker`,String(e)),onReset:()=>t.onReset(`--sf-lumlocker`)})}var s=V(a,2);Y(V(z(s),2),17,()=>o,e=>e.key,(e,t)=>{var r=Xr();Y(B(r),16,()=>[`light`,`dark`],e=>e,(e,r)=>{let a=I(()=>i(`var(--sf-color-${U(t).key}-source-${r})`,r,``)),o=I(()=>ae(U(t).key,r));var s=Uu(),c=z(s),l=z(c),u=V(l),d=z(u,!0);F(u),F(c);var f=V(c,2),p=V(f,4);F(s),H(e=>{q(l,`${U(t).label??``} `),q(d,r===`light`?`L`:`D`),Z(f,`background:${U(a)||`var(--sf-color-${U(t).key})`}`),Z(p,e),Q(p,`title`,U(o))},[()=>`background:${n(U(o),U(o))}`]),K(e,s)}),K(e,r)}),F(s);var c=V(s,2),l=z(c,!0);F(c),H(()=>{X(c,1,`w-full py-2 rounded-lg text-[10px] font-bold border transition-all cursor-pointer ${Cl.value?`bg-indigo-600/25 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/10 dark:border-white/10 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(l,Cl.value?`✓ LumLocker active on canvas — click to disable`:`Preview LumLocker on live canvas`)}),W(`click`,c,()=>{Cl.value=!Cl.value}),K(e,r)};J(Re,e=>{U(k)&&e(ze)}),F(Pe);var Be=V(Pe,4),Ve=z(Be),He=V(z(Ve),2),Ge=z(He,!0);F(He),F(Ve);var Ke=V(Ve,2),qe=e=>{var r=Yu(),a=V(B(r),2);Y(a,21,()=>fe,([e,t])=>e.name,(e,r)=>{var a=I(()=>h(U(r),2));let o=()=>U(a)[0],s=()=>U(a)[1],c=I(()=>!!(s()&&s().name in t.overrides)),l=I(()=>U(oe).has(o().colorKey)&&!U(c));var u=Ju(),d=z(u),f=z(d),p=z(f,!0);F(f);var m=V(f,2),g=e=>{var t=Fu(),n=z(t,!0);F(t),H(()=>{X(t,1,`text-[8px] px-1.5 py-0.5 rounded border transition-all cursor-pointer ${U(l)?`border-indigo-500/40 bg-indigo-500/15 text-indigo-700 dark:text-indigo-300`:`border-black/10 dark:border-white/10 text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(n,U(l)?`Auto dark`:`Manual dark`)}),W(`click`,t,()=>Se(o().colorKey,s(),o().name)),K(e,t)};J(m,e=>{s()&&e(g)}),F(d);var v=V(d,2);{let e=I(()=>`${o().label} light`),n=I(()=>N(o())),r=I(()=>o().name in t.overrides);au(v,{get label(){return U(e)},get tokenName(){return o().name},get value(){return U(n)},get overridden(){return U(r)},onChange:e=>t.onSet(o().name,e),onReset:()=>t.onReset(o().name)})}var y=V(v,2),b=e=>{{let n=I(()=>`${s().label} dark`),r=I(()=>N(s())),i=I(()=>s().name in t.overrides);au(e,{get label(){return U(n)},get tokenName(){return s().name},get value(){return U(r)},get overridden(){return U(i)},onChange:e=>t.onSet(s().name,e),onReset:()=>t.onReset(s().name)})}},x=e=>{let t=I(()=>pe(N(o()),o().colorKey));var r=Bu(),i=z(r);let a;var s=V(i);F(r),H(e=>{Q(i,`title`,U(t)),a=Z(i,``,a,e),q(s,` Dark: auto-derived (${U(t)??``})`)},[()=>({background:n(U(t),U(t))})]),K(e,r)};J(y,e=>{s()&&!U(l)?e(b):s()&&U(l)&&e(x,1)});var S=V(y,2),C=z(S),w=V(z(C),2);Y(w,21,()=>_,e=>e.label,(e,t)=>{var n=Gu(),r=z(n,!0);F(n),H(()=>q(r,U(t).label)),K(e,n)}),F(w),F(C),Y(V(C,2),16,()=>[[`L`,`light`],[`D`,`dark`]],([e,t])=>e,(e,t)=>{var n=I(()=>h(t,2));let r=()=>U(n)[0],a=()=>U(n)[1];var s=qu(),c=z(s),l=z(c,!0);F(c);var u=V(c,2);Y(u,21,()=>_,e=>e.label,(e,t)=>{let n=I(()=>i(U(t).expr(o().colorKey),a(),``));var r=Ku();let s;var c=z(r);{let e=I(()=>`${o().colorKey}-${U(t).label.toLowerCase()}`);Au(c,()=>U(e))}F(r),H(e=>{Q(r,`title`,e),s=Z(r,``,s,{background:U(n)})},[()=>`${o().colorKey}-${U(t).label.toLowerCase()} (${a()}) — ${U(n)}`]),K(e,r)}),F(u),F(s),H(()=>q(l,r())),K(e,s)}),F(S),Me(2),F(u),H(()=>q(p,o().label)),K(e,u)}),F(a),K(e,r)};J(Ke,e=>{U(T)&&e(qe)}),F(Be);var Je=V(Be,4),Ye=z(Je),Xe=V(z(Ye),2),Ze=z(Xe,!0);F(Xe),F(Ye);var Qe=V(Ye,2),$e=e=>{var r=Qu(),i=V(B(r),2);Y(i,17,()=>b,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})});var a=V(i,2),o=z(a);Y(o,17,()=>Ce,e=>e.label,(e,t)=>{let r=I(()=>we(U(t).fg,U(t).bg));var i=Xr(),a=B(i),o=e=>{var i=Xu(),a=z(i),o=V(a,2),s=z(o,!0);F(o);var c=V(o,2),l=z(c);F(c);var u=V(c,2),d=z(u,!0);F(u),F(i),H((e,n)=>{Z(a,e),q(s,U(t).label),q(l,`${n??``}:1`),X(u,1,`text-[9px] font-bold px-1.5 py-0.5 rounded ${U(r)>=4.5?`bg-emerald-500/20 text-emerald-700 dark:text-emerald-300`:`bg-amber-500/20 text-amber-700 dark:text-amber-300`}`),q(d,U(r)>=4.5?`AA`:U(r)>=3?`AA-L`:`✗`)},[()=>`background:${n(U(t).bg,U(t).bg)}; color:${n(U(t).fg,U(t).fg)}`,()=>U(r).toFixed(2)]),K(e,i)};J(a,e=>{U(r)!==null&&e(o)}),K(e,i)});var s=V(o,2),c=e=>{var n=Zu();W(`click`,n,()=>t.onSelectDomain?.(`wcag`)),K(e,n)};J(s,e=>{t.onSelectDomain&&e(c)}),F(a),Y(V(a,2),17,()=>x,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),K(e,r)};J(Qe,e=>{U(C)&&e($e)}),F(Je);var et=V(Je,4),tt=z(et),nt=V(z(tt),2),rt=z(nt,!0);F(nt),F(tt);var it=V(tt,2),at=e=>{let n=I(()=>t.overrides[`--sf-color-primary-source-light`]??s.find(e=>e.name===`--sf-color-primary-source-light`)?.default??`oklch(0.47 0.27 264)`),r=I(()=>t.overrides[`--sf-color-primary-source-dark`]),i=I(()=>U(r)??(!U(oe).has(`primary`)||U(r)?s.find(e=>e.name===`--sf-color-primary-source-dark`)?.default??pe(U(n),`primary`):pe(U(n),`primary`))),a=I(()=>U(A)===`light`?U(n):U(i)),o=I(()=>U(A)===`light`?me():he()),c=I(()=>U(A)===`light`?ge():_e()),d=I(()=>U(A)===`light`?me():he()),m=I(()=>U(A)===`light`?ge():_e());var h=rd(),g=V(B(h),2);Y(g,21,()=>u,e=>e.label,(e,n)=>{var r=$u(),i=z(r),a=z(i,!0);F(i);var o=V(i,2),s=z(o,!0);F(o),F(r),H(()=>{X(r,1,`flex flex-col items-center gap-0.5 p-2.5 rounded-xl border transition-all cursor-pointer ${U(le)?.label===U(n).label?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(a,U(n).label),q(s,U(n).desc)}),W(`click`,r,()=>t.onBulkChange(U(n).patch)),K(e,r)}),F(g);var _=V(g,2),v=V(z(_),2);Y(v,21,()=>l.filter(e=>e.step===`tint`),e=>e.name,(e,n)=>{{let r=I(()=>ue(U(n))),i=I(()=>U(n).name in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:0,max:100,step:1,unit:`%`,get overridden(){return U(i)},onChange:e=>t.onSet(U(n).name,`${e}%`),onReset:()=>t.onReset(U(n).name)})}}),F(v),F(_);var y=V(_,2),b=V(z(y),2);Y(b,21,()=>l.filter(e=>e.step===`shade`),e=>e.name,(e,n)=>{{let r=I(()=>ue(U(n))),i=I(()=>U(n).name in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:0,max:100,step:1,unit:`%`,get overridden(){return U(i)},onChange:e=>t.onSet(U(n).name,`${e}%`),onReset:()=>t.onReset(U(n).name)})}}),F(b),F(y);var x=V(y,2),S=z(x),C=V(z(S),2);Y(C,20,()=>[`light`,`dark`],e=>e,(e,t)=>{var n=Fu(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-1.5 py-0.5 rounded text-[8px] font-bold cursor-pointer transition-all ${U(A)===t?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(r,t===`light`?`Light`:`Dark`)}),W(`click`,n,()=>{R(A,t,!0)}),K(e,n)}),F(C),F(S);var w=V(S,2);Y(w,21,()=>l,e=>e.name,(e,t)=>{let n=I(()=>ue(U(t))),r=I(()=>U(t).label),i=I(()=>ve(U(a),U(r),U(o),U(c)));var s=ed(),l=z(s),u=z(l,!0);F(l);var d=V(l,2);Au(z(d),()=>`primary-${U(r)}`),F(d);var f=V(d,2),p=z(f,!0);F(f),F(s),H((e,t,n)=>{q(u,e),Z(d,t),Q(d,`title`,n),q(p,U(r))},[()=>Math.round(U(n)),()=>`background:${U(i)}; height: ${Math.max(U(n)/100*56,6)}px`,()=>`primary-${U(r)} (${U(A)}) · mix ${Math.round(U(n))}%`]),K(e,s)}),F(w),Me(2),F(x);var T=V(x,2),E=z(T),D=V(z(E),2);Y(D,20,()=>[`light`,`dark`],e=>e,(e,t)=>{var n=Fu(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-1.5 py-0.5 rounded text-[8px] font-bold cursor-pointer transition-all ${U(A)===t?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(r,t===`light`?`Light`:`Dark`)}),W(`click`,n,()=>{R(A,t,!0)}),K(e,n)}),F(D),F(E),Y(V(E,2),16,()=>p,e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-color-${n}-source-light`]??s.find(e=>e.name===`--sf-color-${n}-source-light`)?.default??`oklch(0.5 0.15 264)`),i=I(()=>`--sf-color-${n}-source-dark`),a=I(()=>t.overrides[U(i)]??(U(oe).has(n)&&!t.overrides[U(i)]?pe(U(r),n):s.find(e=>e.name===U(i))?.default??pe(U(r),n))),o=I(()=>U(A)===`light`?U(r):U(a));var c=nd(),l=z(c),u=z(l,!0);F(l);var p=V(l,2);Y(p,20,()=>f,e=>e,(e,t)=>{let r=I(()=>ve(U(o),t,U(d),U(m)));var i=td();Au(z(i),()=>`${n}-${t}`),F(i),H(()=>{Z(i,`background:${U(r)}`),Q(i,`title`,`${n}-${t} (${U(A)})`)}),K(e,i)}),F(p),F(c),H(()=>q(u,n)),K(e,c)}),F(T),K(e,h)};J(it,e=>{U(w)&&e(at)}),F(et);var ot=V(et,4),st=z(ot),ct=V(z(st),2),lt=z(ct,!0);F(ct),F(st);var ut=V(st,2),dt=e=>{var n=ld();Y(V(B(n),2),16,()=>[`brand`,`fade`],e=>e,(e,n)=>{var i=cd(),o=B(i),s=z(o,!0);F(o);var c=V(o,2);Y(c,21,()=>a.filter(e=>e.group===n),e=>e.name,(e,n)=>{let i=I(()=>`var(${U(n).name})`),a=I(()=>M(U(n)));var o=sd(),s=z(o),c=V(s,2),l=z(c),u=z(l),d=z(u,!0);F(u);var f=V(u,2),p=e=>{var r=id();W(`click`,r,()=>{delete ee[U(n).name],t.onReset(U(n).name)}),K(e,r)};J(f,e=>{U(n).name in t.overrides&&e(p)}),F(l);var m=V(l,2),h=e=>{var t=ad();Y(V(z(t),2),16,()=>[`top`,`right`,`bottom`,`left`],e=>e,(e,t)=>{var r=Fu(),i=z(r,!0);F(r),H(()=>{X(r,1,`flex-1 py-0.5 rounded text-[9px] border transition-all cursor-pointer capitalize ${U(a).dir===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(i,t)}),W(`click`,r,()=>ie(U(n),`dir`,t)),K(e,r)}),F(t),K(e,t)},g=e=>{var t=od(),r=V(z(t),2);zi(r);var i=V(r,2),o=z(i);F(i),F(t),H(()=>{Bi(r,U(a).angle),q(o,`${U(a).angle??``}°`)}),W(`input`,r,e=>ie(U(n),`angle`,parseInt(e.target.value))),K(e,t)};J(m,e=>{U(n).kind===`dir`&&U(n).group!==`fade`?e(h):U(n).kind!==`dir`&&e(g,1)});var _=V(m,2),v=V(z(_),2);zi(v);var y=V(v,2);zi(y),F(_);var b=V(_,2),x=V(z(b));F(b);var S=V(b,2);zi(S),F(c),F(o),H(e=>{Z(s,e),q(d,U(n).label),Bi(v,U(a).stop1),Bi(y,U(a).stop2),q(x,` ${U(n).formula??``}`),Bi(S,t.overrides[U(n).name]??``)},[()=>`background:${r(U(i),U(i))}`]),W(`change`,v,e=>ie(U(n),`stop1`,e.target.value.trim())),W(`change`,y,e=>ie(U(n),`stop2`,e.target.value.trim())),W(`change`,S,e=>{let r=e.target.value.trim();delete ee[U(n).name],r?t.onSet(U(n).name,r):t.onReset(U(n).name)}),K(e,o)}),F(c),H(()=>q(s,n===`brand`?`Brand & surface`:`Edge fades`)),K(e,i)}),K(e,n)};J(ut,e=>{U(O)&&e(dt)}),F(ot);var ft=V(ot,4),pt=z(ft),mt=V(z(pt),2),ht=z(mt,!0);F(mt),F(pt);var gt=V(pt,2),_t=e=>{var n=ud(),r=V(B(n),2);Y(r,20,()=>[[`light dark`,`light dark (default)`],[`light`,`Light only`],[`dark`,`Dark only`]],([e,t])=>e,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1],o=I(()=>t.overrides[`--sf-color-scheme`]??`light dark`);var s=Fu(),c=z(s,!0);F(s),H(()=>{X(s,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer ${U(o)===i()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,a())}),W(`click`,s,()=>i()===`light dark`?t.onReset(`--sf-color-scheme`):t.onSet(`--sf-color-scheme`,i())),K(e,s)}),F(r),K(e,n)};J(gt,e=>{U(D)&&e(_t)}),F(ft);var vt=V(ft,4),yt=z(vt),bt=V(z(yt),2),xt=z(bt,!0);F(bt),F(yt);var St=V(yt,2),Ct=e=>{var r=fd(),i=V(B(r),2);Y(i,21,()=>d,e=>e.name,(e,r)=>{let i=I(()=>n(`var(${U(r).name})`,``));var a=dd(),o=z(a),s=z(o,!0);F(o);var c=V(o,2);{let e=I(()=>t.overrides[U(r).name]??``),n=I(()=>U(i)?`auto-derived · ${U(i)}`:`auto-derived`),a=I(()=>U(r).name in t.overrides);ku(c,{get token(){return U(r).name},get value(){return U(e)},get placeholder(){return U(n)},get isOverridden(){return U(a)},onSet:e=>t.onSet(U(r).name,e),onReset:()=>t.onReset(U(r).name)})}F(a),H(()=>q(s,U(r).label)),K(e,a)}),F(i),K(e,r)};J(St,e=>{U(E)&&e(Ct)}),F(vt),Me(2),F(Te),H(()=>{Q(Oe,`aria-expanded`,U(S)),q(Ae,U(S)?`▲`:`▼`),Q(Fe,`aria-expanded`,U(k)),q(Le,U(k)?`▲`:`▼`),Q(Ve,`aria-expanded`,U(T)),q(Ge,U(T)?`▲`:`▼`),Q(Ye,`aria-expanded`,U(C)),q(Ze,U(C)?`▲`:`▼`),Q(tt,`aria-expanded`,U(w)),q(rt,U(w)?`▲`:`▼`),Q(st,`aria-expanded`,U(O)),q(lt,U(O)?`▲`:`▼`),Q(pt,`aria-expanded`,U(D)),q(ht,U(D)?`▲`:`▼`),Q(yt,`aria-expanded`,U(E)),q(xt,U(E)?`▲`:`▼`)}),W(`click`,Oe,()=>{R(S,!U(S))}),W(`click`,Fe,()=>{R(k,!U(k))}),W(`click`,Ve,()=>{R(T,!U(T))}),W(`click`,Ye,()=>{R(C,!U(C))}),W(`click`,tt,()=>{R(w,!U(w))}),W(`click`,st,()=>{R(O,!U(O))}),W(`click`,pt,()=>{R(D,!U(D))}),W(`click`,yt,()=>{R(E,!U(E))}),K(e,Te),We()}Br([`click`,`input`,`change`]);var hd=G(`
Aa Aa
`),gd=G(`
min
max
`),_d=G(``),vd=G(``),yd=G(`
`),bd=G(`
Modular scale ratio
`),xd=G(`
`),Sd=G(`
clamp( … )
`);function Cd(e,t){Ue(t,!0);let n=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`),r=ra(t,`unit`,3,`rem`),i=ra(t,`minLabel`,3,`Min`),a=ra(t,`maxLabel`,3,`Max`),o=ra(t,`overridden`,3,!1),s=ra(t,`ratioMin_bound`,3,1.05),c=ra(t,`ratioMax_bound`,3,1.8),l=ra(t,`previewKind`,3,`none`);function u(e){return Math.min(t.max,Math.max(t.min,e))}let d=I(()=>(t.minValue-t.min)/(t.max-t.min)*100),f=I(()=>(t.maxValue-t.min)/(t.max-t.min)*100);function p(e){return Math.min(c(),Math.max(s(),e))}let m=I(()=>t.ratioPresets?.find(e=>t.ratioMin!==void 0&&Math.abs(e.value-t.ratioMin)<.0015)?.value),h=I(()=>t.ratioPresets?.find(e=>t.ratioMax!==void 0&&Math.abs(e.value-t.ratioMax)<.0015)?.value);var g=Sd(),_=z(g),v=z(_),y=z(v,!0);F(v);var b=V(v,2),x=V(z(b)),S=z(x);F(x);var C=V(x,2),w=z(C);F(C),Me(),F(b),F(_);var T=V(_,2),E=V(z(T),2),D=V(E,2);zi(D);var O=V(D,2);zi(O);var k=V(O,2),A=V(k,2);F(T);var ee=V(T,2),j=z(ee),te=z(j),ne=z(te,!0);F(te);var M=V(te,2);zi(M),F(j);var re=V(j,2),ie=z(re),ae=z(ie,!0);F(ie);var oe=V(ie,2);zi(oe),F(re),F(ee);var se=V(ee,2),N=e=>{var n=hd(),r=z(n),o=V(z(r)),s=z(o,!0);F(o),F(r);var c=V(r,2),l=V(z(c)),u=z(l,!0);F(l),F(c),F(n),H((e,t,n,i)=>{Z(r,e),q(s,t),Z(c,n),q(u,i)},[()=>`font-size:${Math.min(t.minValue,2)}rem`,()=>i().toLowerCase(),()=>`font-size:${Math.min(t.maxValue,2.6)}rem`,()=>a().toLowerCase()]),K(e,n)},ce=e=>{var n=gd(),r=z(n),i=V(r,4);Me(2),F(n),H((e,t)=>{Z(r,e),Z(i,t)},[()=>`width:${Math.min(t.minValue*28,120)}px`,()=>`width:${Math.min(t.maxValue*28,200)}px`]),K(e,n)};J(se,e=>{l()===`type`?e(N):l()===`space`&&e(ce,1)});var le=V(se,2),ue=e=>{var r=bd(),o=V(z(r),2);Y(o,21,()=>[{side:i(),value:t.ratioMin,active:U(m),onChange:t.onRatioMinChange},{side:a(),value:t.ratioMax,active:U(h),onChange:t.onRatioMaxChange}],e=>e.side,(e,r)=>{var i=yd(),a=z(i),o=z(a,!0);F(a);var l=V(a,2),u=z(l),d=e=>{var t=_d();t.value=t.__value=``,H(()=>Z(t,`background:${U(n)};`)),K(e,t)};J(u,e=>{U(r).active===void 0&&e(d)}),Y(V(u),17,()=>t.ratioPresets,e=>e.value,(e,t)=>{var r=vd(),i=z(r,!0);F(r);var a={};H(e=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=e)&&(r.value=(r.__value=e)??``)},[()=>String(U(t).value)]),K(e,r)}),F(l);var f;Di(l);var m=V(l,2);zi(m),Q(m,`step`,.001),F(i),H(e=>{q(o,U(r).side),Q(l,`aria-label`,`${U(r).side} modular scale ratio preset`),f!==(f=e)&&(l.value=(l.__value=e)??``,Ei(l,e)),Q(m,`aria-label`,`${U(r).side} modular scale custom ratio`),Q(m,`min`,s()),Q(m,`max`,c()),Bi(m,U(r).value)},[()=>U(r).active===void 0?``:String(U(r).active)]),W(`change`,l,e=>{let t=parseFloat(e.target.value);Number.isFinite(t)&&U(r).onChange?.(p(t))}),W(`change`,m,e=>{let t=parseFloat(e.target.value);Number.isFinite(t)&&U(r).onChange?.(p(t))}),K(e,i)}),F(o),F(r),K(e,r)};J(le,e=>{t.ratioPresets&&e(ue)});var de=V(le,2),fe=e=>{var n=xd(),r=z(n);F(n),W(`click`,r,function(...e){t.onReset?.apply(this,e)}),K(e,n)};J(de,e=>{o()&&t.onReset&&e(fe)}),F(g),H(e=>{X(g,1,`rounded-xl border p-3 ${o()?`bg-indigo-500/8 border-indigo-500/25`:`bg-black/4 dark:bg-white/4 border-black/8 dark:border-white/8`}`,`svelte-iy59wr`),q(y,t.title),q(S,`${t.minValue??``}${r()??``}`),q(w,`${t.maxValue??``}${r()??``}`),Z(E,e),Q(D,`min`,t.min),Q(D,`max`,t.max),Q(D,`step`,t.step),Bi(D,t.minValue),Q(D,`aria-label`,`${t.title} min`),Q(O,`min`,t.min),Q(O,`max`,t.max),Q(O,`step`,t.step),Bi(O,t.maxValue),Q(O,`aria-label`,`${t.title} max`),Z(k,`left: calc(${U(d)}% - 6px)`),Z(A,`left: calc(${U(f)}% - 6px)`),q(ne,i()),Q(M,`min`,t.min),Q(M,`max`,t.max),Q(M,`step`,t.step),Bi(M,t.minValue),q(ae,a()),Q(oe,`min`,t.min),Q(oe,`max`,t.max),Q(oe,`step`,t.step),Bi(oe,t.maxValue)},[()=>`left:${Math.min(U(d),U(f))}%; right:${100-Math.max(U(d),U(f))}%`]),W(`input`,D,e=>t.onMinChange(Math.min(u(parseFloat(e.target.value)),t.maxValue))),W(`input`,O,e=>t.onMaxChange(Math.max(u(parseFloat(e.target.value)),t.minValue))),W(`change`,M,e=>t.onMinChange(u(parseFloat(e.target.value)||t.min))),W(`change`,oe,e=>t.onMaxChange(u(parseFloat(e.target.value)||t.max))),K(e,g),We()}Br([`input`,`change`,`click`]);var wd=G(``),Td=G(``),Ed=G(`
`),Dd=G(`
Google Font
`,1),Od=G(``),kd=G(``),Ad=G(``),jd=G(``),Md=G(`
Tracking
`),Nd=G(`
Max width
`),Pd=G(``),Fd=G(`
The quick brown fox
Size
Line height
Weight
`,1),Id=G(``),Ld=G(`
`),Rd=G(``),zd=G(`
`),Bd=G(`
Emphasis style
External marker
External label
`,1),Vd=G(``),Hd=G(`
`),Ud=G(`

Named weight tokens. Override if your font uses non-standard axis values.

`,1),Wd=G(`
`),Gd=G(`
`,1),Kd=G(`
`),qd=G(`
`),Jd=G(`

Utopia-style fluid scale. Each endpoint has three values — viewport width, - base size, and modular ratio. Sizes interpolate fluidly between mobile and desktop.

Line height scale
Letter-spacing scale

Overriding these propagates to heading sizes that reference them.

`,1),Yd=G(`
Aa
`),Xd=G(`
`),Zd=G(``),Qd=G(`
`),$d=G(`

Per-text-size max-width caps on .sf-text-* elements. Set to none to remove the constraint; use ch units for character-based measures.

`,1),ef=G(`

Advanced OpenType and variable-font axes. Leave as normal unless your font supports these features.

Numeric figures
Optical sizing
Font features
Variation
`,1),tf=G(`
`);function nf(e,t){Ue(t,!0);let n=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`),r=[{label:`Minor Second — 1.067`,value:1.067},{label:`Major Second — 1.125`,value:1.125},{label:`Minor Third — 1.200`,value:1.2},{label:`Major Third — 1.250`,value:1.25},{label:`Perfect Fourth — 1.333`,value:1.333},{label:`Aug. Fourth — 1.414`,value:1.414},{label:`Golden — 1.618`,value:1.618}],i=[{label:`System sans-serif`,value:``},{label:`Geometric (Avenir, Montserrat…)`,value:`var(--sf-font-geometric)`},{label:`Humanist (Seravek, Gill Sans…)`,value:`var(--sf-font-humanist)`},{label:`Slab serif (Rockwell, Roboto Slab…)`,value:`var(--sf-font-slab)`},{label:`Inter`,value:`Inter, system-ui, sans-serif`},{label:`Georgia (serif)`,value:`Georgia, 'Times New Roman', serif`},{label:`Merriweather (serif)`,value:`'Merriweather', Georgia, serif`},{label:`JetBrains Mono`,value:`'JetBrains Mono', 'Fira Code', monospace`}],a=[{label:`Same as body`,value:``},{label:`Geometric (Avenir, Montserrat…)`,value:`var(--sf-font-geometric)`},{label:`Humanist (Seravek, Gill Sans…)`,value:`var(--sf-font-humanist)`},{label:`Slab serif (Rockwell, Roboto Slab…)`,value:`var(--sf-font-slab)`},{label:`Inter`,value:`Inter, system-ui, sans-serif`},{label:`Georgia (serif)`,value:`Georgia, 'Times New Roman', serif`},{label:`Impact / condensed`,value:`Impact, 'Arial Narrow', sans-serif`}],o=[{label:`System mono`,value:`ui-monospace, monospace`},{label:`JetBrains Mono`,value:`'JetBrains Mono', 'Fira Code', monospace`},{label:`Source Code Pro`,value:`'Source Code Pro', 'Courier New', monospace`}],s=`Inter.Roboto.Open Sans.Lato.Montserrat.Poppins.Source Sans 3.Raleway.Nunito.Work Sans.Manrope.DM Sans.Outfit.Plus Jakarta Sans.Geist.Space Grotesk.Figtree.Merriweather.Playfair Display.Lora.Source Serif 4.Roboto Slab.IBM Plex Sans.IBM Plex Mono.JetBrains Mono.Fira Code.Space Mono`.split(`.`),c=[{label:`balance`,value:`balance`},{label:`pretty`,value:`pretty`},{label:`normal`,value:`normal`}],l=[`100`,`200`,`300`,`400`,`500`,`600`,`700`,`800`,`900`],u={"--sf-font-weight-body":`400`,"--sf-font-weight-heading":`600`,"--sf-font-weight-display":`700`,"--sf-font-weight-interactive":`600`},d=[{label:`2xs`,factor:.64},{label:`xs`,factor:.75},{label:`s`,factor:.875},{label:`m`,factor:1},{label:`l`,factor:1.125},{label:`xl`,factor:1.25},{label:`2xl`,factor:1.5},{label:`3xl`,factor:1.875},{label:`4xl`,factor:2.25}],f=[{label:`Tight`,token:`--sf-tracking-tight`,default:-.025},{label:`Normal`,token:`--sf-tracking-normal`,default:0},{label:`Wide`,token:`--sf-tracking-wide`,default:.025},{label:`Wider`,token:`--sf-tracking-wider`,default:.05},{label:`Widest`,token:`--sf-tracking-widest`,default:.1}],p=[{label:`Tight`,token:`--sf-leading-tight`,default:1.1},{label:`Snug`,token:`--sf-leading-snug`,default:1.3},{label:`Normal`,token:`--sf-leading-normal`,default:1.5},{label:`Relaxed`,token:`--sf-leading-relaxed`,default:1.625}],m=[{label:`2xs`,value:`var(--sf-text-2xs)`,approx:.64},{label:`xs`,value:`var(--sf-text-xs)`,approx:.75},{label:`s`,value:`var(--sf-text-s)`,approx:.875},{label:`m`,value:`var(--sf-text-m)`,approx:1},{label:`l`,value:`var(--sf-text-l)`,approx:1.125},{label:`xl`,value:`var(--sf-text-xl)`,approx:1.25},{label:`2xl`,value:`var(--sf-text-2xl)`,approx:1.5},{label:`3xl`,value:`var(--sf-text-3xl)`,approx:1.875},{label:`4xl`,value:`var(--sf-text-4xl)`,approx:2.25},{label:`display-s`,value:`var(--sf-text-display-s)`,approx:2.6},{label:`display-m`,value:`var(--sf-text-display-m)`,approx:3.2},{label:`display-l`,value:`var(--sf-text-display-l)`,approx:3.8}],g=p.map(e=>({label:e.label,value:`var(${e.token})`,num:e.default})),_=f.map(e=>({label:e.label,value:`var(${e.token})`,em:e.default})),v=[{id:`body`,label:`Body`,size:`--sf-body-font-size`,lh:`--sf-body-line-height`,wt:`--sf-body-font-weight`,ls:null,dSize:`var(--sf-text-m)`,dLh:`var(--sf-leading-normal)`,dWt:`400`,dLs:``},{id:`h1`,label:`H1`,size:`--sf-h1-size`,lh:`--sf-h1-line-height`,wt:`--sf-h1-font-weight`,ls:`--sf-h1-letter-spacing`,dSize:`var(--sf-text-4xl)`,dLh:`var(--sf-leading-tight)`,dWt:`600`,dLs:`var(--sf-tracking-tight)`},{id:`h2`,label:`H2`,size:`--sf-h2-size`,lh:`--sf-h2-line-height`,wt:`--sf-h2-font-weight`,ls:`--sf-h2-letter-spacing`,dSize:`var(--sf-text-3xl)`,dLh:`var(--sf-leading-tight)`,dWt:`600`,dLs:`var(--sf-tracking-tight)`},{id:`h3`,label:`H3`,size:`--sf-h3-size`,lh:`--sf-h3-line-height`,wt:`--sf-h3-font-weight`,ls:`--sf-h3-letter-spacing`,dSize:`var(--sf-text-2xl)`,dLh:`var(--sf-leading-snug)`,dWt:`600`,dLs:`var(--sf-tracking-normal)`},{id:`h4`,label:`H4`,size:`--sf-h4-size`,lh:`--sf-h4-line-height`,wt:`--sf-h4-font-weight`,ls:`--sf-h4-letter-spacing`,dSize:`var(--sf-text-xl)`,dLh:`var(--sf-leading-snug)`,dWt:`600`,dLs:`var(--sf-tracking-normal)`},{id:`h5`,label:`H5`,size:`--sf-h5-size`,lh:`--sf-h5-line-height`,wt:`--sf-h5-font-weight`,ls:`--sf-h5-letter-spacing`,dSize:`var(--sf-text-l)`,dLh:`var(--sf-leading-normal)`,dWt:`600`,dLs:`var(--sf-tracking-normal)`},{id:`h6`,label:`H6`,size:`--sf-h6-size`,lh:`--sf-h6-line-height`,wt:`--sf-h6-font-weight`,ls:`--sf-h6-letter-spacing`,dSize:`var(--sf-text-m)`,dLh:`var(--sf-leading-normal)`,dWt:`600`,dLs:`var(--sf-tracking-wide)`}],y=L(`h1`),b=I(()=>v.find(e=>e.id===U(y))),x=Kl.typography??[];function S(e,n){let r=parseFloat(t.overrides[e]??``);return isNaN(r)?n:r}let C=I(()=>S(`--sf-text-ratio-min`,1.25)),w=I(()=>S(`--sf-text-ratio-max`,1.333)),T=I(()=>S(`--sf-text-base-min`,1)),E=I(()=>S(`--sf-text-base-max`,1.25)),D=I(()=>S(`--sf-text-display-base-min`,2.4)),O=I(()=>S(`--sf-text-display-base-max`,3)),k=I(()=>S(`--sf-leading-taper`,0)),A=I(()=>S(`--sf-text-scale`,1)),ee=I(()=>S(`--sf-fluid-min-vw`,22.5)),j=I(()=>S(`--sf-fluid-max-vw`,90)),te=L(!1),ne=L(!1),M=L(!1),re=L(!1),ie=L(!1),ae=L(!1),oe=L(!1),se=L(!1),N=L(!1),ce=L(!1),le=I(()=>t.overrides[`--sf-font-body`]??``),ue=I(()=>t.overrides[`--sf-font-heading`]??``),de=I(()=>t.overrides[`--sf-font-mono`]??`ui-monospace, monospace`),fe=L(``),pe=L(`body`);function me(e){let n=t.overrides[e.token];return n?parseFloat(n.replace(`em`,``)):e.default}function he(e){return S(e.token,e.default)}function ge(e){if(!e.trim())return;let t=`gf-${e.replace(/\s+/g,`-`)}`;if(!document.getElementById(t)){let n=document.createElement(`link`);n.id=t,n.rel=`stylesheet`,n.href=`https://fonts.googleapis.com/css2?family=${encodeURIComponent(e)}:wght@100;200;300;400;500;600;700;800;900&display=swap`,document.head.appendChild(n)}}function _e(e,n){if(!e.trim())return;ge(e);let r=n===`body`?`--sf-font-body`:`--sf-font-heading`;t.onSet(r,`'${e}', sans-serif`)}function ve(e,n){return e?t.overrides[e]??n:n}function ye(e,n,r){e&&(n===r?t.onReset(e):t.onSet(e,n))}let be=I(()=>{let e=ve(U(b).size,U(b).dSize),t=m.find(t=>t.value===e),n=(U(T)+U(E))/2;return Math.min((t?.approx??1)*n*U(A),2.4)}),xe=I(()=>{let e=ve(U(b).wt,U(b).dWt),t=parseInt(e);return isNaN(t)?600:t}),Se=I(()=>{if(!U(b).ls)return 0;let e=ve(U(b).ls,U(b).dLs),t=_.find(t=>t.value===e);if(t)return t.em;let n=parseFloat(e.replace(`em`,``));return isNaN(n)?0:n}),Ce=I(()=>{let e=ve(U(b).lh,U(b).dLh),t=g.find(t=>t.value===e);if(t)return t.num;let n=parseFloat(e);return isNaN(n)?1.3:n});var we=tf(),Te=z(we),Ee=z(Te),De=V(z(Ee),2),P=z(De,!0);F(De),F(Ee);var Oe=V(Ee,2),ke=e=>{var r=Dd(),c=B(r);Y(c,17,()=>[{label:`Body`,token:`--sf-font-body`,current:U(le),opts:i},{label:`Heading`,token:`--sf-font-heading`,current:U(ue),opts:a},{label:`Mono`,token:`--sf-font-mono`,current:U(de),opts:o}],e=>e.token,(e,r)=>{var i=Ed(),a=z(i),o=z(a,!0);F(a);var s=V(a,2),c=z(s);Y(c,17,()=>U(r).opts,e=>e.label,(e,t)=>{var r=wd(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`font-family:inherit;background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).value)&&(r.value=(r.__value=U(t).value)??``)}),K(e,r)});var l=V(c),u=e=>{var t=wd(),i=z(t);F(t);var a={};H(e=>{Z(t,`background:${U(n)};`),q(i,`Custom: ${e??``}`),a!==(a=U(r).current)&&(t.value=(t.__value=U(r).current)??``)},[()=>U(r).current.split(`,`)[0].replace(/['"]/g,``)]),K(e,t)},d=I(()=>U(r).current&&!U(r).opts.some(e=>e.value===U(r).current));J(l,e=>{U(d)&&e(u)}),F(s);var f;Di(s);var p=V(s,2),m=e=>{var n=Td();W(`click`,n,()=>t.onReset(U(r).token)),K(e,n)};J(p,e=>{U(r).token in t.overrides&&e(m)}),F(i),H(()=>{q(o,U(r).label),Z(s,`font-family: ${U(r).current||`inherit`}`),f!==(f=U(r).current)&&(s.value=(s.__value=U(r).current)??``,Ei(s,U(r).current))}),W(`change`,s,e=>{let n=e.target.value;n?t.onSet(U(r).token,n):t.onReset(U(r).token)}),K(e,i)});var l=V(c,2),u=V(z(l),2),d=z(u),f=z(d);f.value=f.__value=``,Y(V(f),16,()=>s,e=>e,(e,t)=>{var r=wd(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,t),a!==(a=t)&&(r.value=(r.__value=t)??``)}),K(e,r)}),F(d);var p;Di(d);var m=V(d,2),h=z(m),g=V(h,2);F(m),F(u);var _=V(u,2);zi(_);var v=V(_,2),y=z(v);F(v),F(l),H(()=>{Z(f,`background:${U(n)};`),p!==(p=U(fe))&&(d.value=(d.__value=U(fe))??``,Ei(d,U(fe))),X(h,1,`px-2 rounded text-[10px] border transition-all cursor-pointer ${U(pe)===`body`?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400`}`),X(g,1,`px-2 rounded text-[10px] border transition-all cursor-pointer ${U(pe)===`heading`?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400`}`),Bi(_,U(fe)),q(y,`Load & apply to ${U(pe)??``}`)}),W(`change`,d,e=>{R(fe,e.target.value,!0)}),W(`click`,h,()=>{R(pe,`body`)}),W(`click`,g,()=>{R(pe,`heading`)}),W(`input`,_,e=>{R(fe,e.target.value,!0)}),W(`click`,v,()=>_e(U(fe),U(pe))),K(e,r)};J(Oe,e=>{U(te)&&e(ke)}),F(Te);var Ae=V(Te,4),je=z(Ae),Me=V(z(je),2),Ne=z(Me,!0);F(Me),F(je);var Pe=V(je,2),Fe=e=>{var r=Fd(),i=B(r);Y(i,21,()=>v,e=>e.id,(e,n)=>{let r=I(()=>U(n).size in t.overrides||U(n).lh in t.overrides||U(n).wt in t.overrides||!!U(n).ls&&U(n).ls in t.overrides);var i=kd(),a=z(i),o=V(a),s=e=>{K(e,Od())};J(o,e=>{U(r)&&e(s)}),F(i),H(()=>{X(i,1,`relative flex-1 py-1 rounded-md text-[10px] font-bold transition-all cursor-pointer ${U(y)===U(n).id?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(a,`${U(n).label??``} `)}),W(`click`,i,()=>{R(y,U(n).id,!0)}),K(e,i)}),F(i);var a=V(i,2),o=z(a);F(a);var s=V(a,2),c=V(z(s),2),u=z(c);Y(u,17,()=>m,e=>e.value,(e,t)=>{var r=wd(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).value)&&(r.value=(r.__value=U(t).value)??``)}),K(e,r)});var d=V(u),f=e=>{var t=Ad(),r={};H(e=>{Z(t,`background:${U(n)};`),r!==(r=e)&&(t.value=(t.__value=e)??``)},[()=>ve(U(b).size,U(b).dSize)]),K(e,t)},p=I(()=>!m.some(e=>e.value===ve(U(b).size,U(b).dSize)));J(d,e=>{U(p)&&e(f)}),F(c);var h;Di(c),F(s);var x=V(s,2),S=V(z(x),2),C=z(S);Y(C,17,()=>g,e=>e.value,(e,t)=>{var r=wd(),i=z(r);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,`${U(t).label??``} · ${U(t).num??``}`),a!==(a=U(t).value)&&(r.value=(r.__value=U(t).value)??``)}),K(e,r)});var w=V(C),T=e=>{var t=Ad(),r={};H(e=>{Z(t,`background:${U(n)};`),r!==(r=e)&&(t.value=(t.__value=e)??``)},[()=>ve(U(b).lh,U(b).dLh)]),K(e,t)},E=I(()=>!g.some(e=>e.value===ve(U(b).lh,U(b).dLh)));J(w,e=>{U(E)&&e(T)}),F(S);var D;Di(S),F(x);var O=V(x,2),k=V(z(O),2);Y(k,20,()=>l,e=>e,(e,t)=>{let n=I(()=>ve(U(b).wt,U(b).dWt));var r=jd(),i=z(r,!0);F(r),H(e=>{Z(r,e),X(r,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,t)},[()=>`font-weight:${parseInt(t)}`]),W(`click`,r,()=>ye(U(b).wt,t,U(b).dWt)),K(e,r)}),F(k),F(O);var A=V(O,2),ee=e=>{var t=Md(),r=V(z(t),2),i=z(r);Y(i,17,()=>_,e=>e.value,(e,t)=>{var r=wd(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).value)&&(r.value=(r.__value=U(t).value)??``)}),K(e,r)});var a=V(i),o=e=>{var t=Ad(),r={};H(e=>{Z(t,`background:${U(n)};`),r!==(r=e)&&(t.value=(t.__value=e)??``)},[()=>ve(U(b).ls,U(b).dLs)]),K(e,t)},s=I(()=>!_.some(e=>e.value===ve(U(b).ls,U(b).dLs)));J(a,e=>{U(s)&&e(o)}),F(r);var c;Di(r),F(t),H(e=>{c!==(c=e)&&(r.value=(r.__value=e)??``,Ei(r,e))},[()=>ve(U(b).ls,U(b).dLs)]),W(`change`,r,e=>ye(U(b).ls,e.target.value,U(b).dLs)),K(e,t)};J(A,e=>{U(b).ls&&e(ee)});var j=V(A,2),te=e=>{let n=I(()=>`--sf-${U(b).id}-max-width`);var r=Nd(),i=V(z(r),2);zi(i);var a=V(i,2),o=e=>{var r=Td();W(`click`,r,()=>t.onReset(U(n))),K(e,r)};J(a,e=>{U(n)in t.overrides&&e(o)}),F(r),H(()=>Bi(i,t.overrides[U(n)]??``)),W(`input`,i,e=>{let r=e.target.value.trim();r?t.onSet(U(n),r):t.onReset(U(n))}),K(e,r)};J(j,e=>{U(b).id!==`body`&&e(te)});var ne=V(j,2),M=z(ne),re=e=>{var n=Pd(),r=z(n);F(n),H(()=>q(r,`reset ${U(b).label??``}`)),W(`click`,n,()=>{let e={[U(b).size]:null,[U(b).lh]:null,[U(b).wt]:null};U(b).ls&&(e[U(b).ls]=null),t.onBulkChange(e)}),K(e,n)};J(M,e=>{(U(b).size in t.overrides||U(b).lh in t.overrides||U(b).wt in t.overrides||U(b).ls&&U(b).ls in t.overrides)&&e(re)}),F(ne),H((e,t)=>{Z(o,`font-size:${U(be)}rem; font-weight:${U(xe)}; letter-spacing:${U(Se)}em; line-height:${U(Ce)}; font-family:${U(b).id===`body`?U(le)||`inherit`:U(ue)||U(le)||`inherit`}`),h!==(h=e)&&(c.value=(c.__value=e)??``,Ei(c,e)),D!==(D=t)&&(S.value=(S.__value=t)??``,Ei(S,t))},[()=>ve(U(b).size,U(b).dSize),()=>ve(U(b).lh,U(b).dLh)]),W(`change`,c,e=>ye(U(b).size,e.target.value,U(b).dSize)),W(`change`,S,e=>ye(U(b).lh,e.target.value,U(b).dLh)),K(e,r)};J(Pe,e=>{U(ne)&&e(Fe)}),F(Ae);var Ie=V(Ae,4),Le=z(Ie),Re=V(z(Le),2),ze=z(Re,!0);F(Re),F(Le);var Be=V(Le,2),Ve=e=>{var n=Bd(),r=B(n);Y(r,16,()=>[{label:`Body strong`,tokenName:`--sf-font-weight-strong`},{label:`Interactive`,tokenName:`--sf-font-weight-interactive`}],e=>e.tokenName,(e,n)=>{let r=I(()=>u[n.tokenName]??`600`),i=I(()=>t.overrides[n.tokenName]??U(r)),a=I(()=>n.tokenName in t.overrides);var o=Ld(),s=z(o),c=z(s),d=z(c);F(c);var f=V(c,2),p=e=>{var r=Id();W(`click`,r,()=>t.onReset(n.tokenName)),K(e,r)};J(f,e=>{U(a)&&e(p)}),F(s);var m=V(s,2);Y(m,20,()=>l,e=>e,(e,o)=>{var s=jd(),c=z(s,!0);F(s),H(e=>{Z(s,e),X(s,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(i)===o?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,o)},[()=>`font-weight: ${parseInt(o)}`]),W(`click`,s,()=>o===U(r)&&!U(a)?void 0:o===U(r)?t.onReset(n.tokenName):t.onSet(n.tokenName,o)),K(e,s)}),F(m),F(o),H(()=>q(d,`${n.label??``} weight`)),K(e,o)});var i=V(r,2),a=V(z(i),2);Y(a,20,()=>[[`Italic`,`italic`],[`Normal`,`normal`]],([e,t])=>t,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1],o=I(()=>t.overrides[`--sf-body-em-style`]??`italic`);var s=Rd(),c=z(s),l=z(c,!0);F(c),F(s),H(()=>{X(s,1,`flex-1 py-2 rounded-lg text-[10px] border transition-all cursor-pointer ${U(o)===a()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),Z(c,`font-style: ${a()}`),q(l,i())}),W(`click`,s,()=>a()===`italic`?t.onReset(`--sf-body-em-style`):t.onSet(`--sf-body-em-style`,a())),K(e,s)}),F(a),F(i);var o=V(i,2);{let e=I(()=>S(`--sf-code-font-size`,.875)),n=I(()=>`--sf-code-font-size`in t.overrides);$(o,{label:`Code font size`,get value(){return U(e)},min:.7,max:1.1,step:.005,unit:`em`,help:`--sf-code-font-size — size of inline code relative to surrounding text`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-code-font-size`,`${e}em`),onReset:()=>t.onReset(`--sf-code-font-size`)})}var s=V(o,2);Y(s,16,()=>[{label:`Heading wrap`,token:`--sf-heading-text-wrap`,defaultVal:`balance`},{label:`Body wrap`,token:`--sf-body-text-wrap`,defaultVal:`pretty`}],e=>e.token,(e,n)=>{let r=I(()=>t.overrides[n.token]??n.defaultVal);var i=zd(),a=z(i),o=z(a,!0);F(a);var s=V(a,2);Y(s,21,()=>c,e=>e.value,(e,i)=>{var a=jd(),o=z(a,!0);F(a),H(()=>{X(a,1,`flex-1 px-2 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===U(i).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(o,U(i).label)}),W(`click`,a,()=>U(i).value===n.defaultVal&&!(n.token in t.overrides)?void 0:U(i).value===n.defaultVal?t.onReset(n.token):t.onSet(n.token,U(i).value)),K(e,a)}),F(s),F(i),H(()=>q(o,n.label)),K(e,i)});var d=V(s,2),f=V(z(d),2);zi(f),Q(f,`placeholder`,`" ↗"`);var p=V(f,2),m=e=>{var n=Td();W(`click`,n,()=>t.onReset(`--sf-link-external-marker`)),K(e,n)};J(p,e=>{`--sf-link-external-marker`in t.overrides&&e(m)}),F(d);var g=V(d,2),_=V(z(g),2);zi(_),Q(_,`placeholder`,`"opens in a new window or external site"`);var v=V(_,2),y=e=>{var n=Td();W(`click`,n,()=>t.onReset(`--sf-link-external-label`)),K(e,n)};J(v,e=>{`--sf-link-external-label`in t.overrides&&e(y)}),F(g),H(()=>{Bi(f,t.overrides[`--sf-link-external-marker`]??``),Bi(_,t.overrides[`--sf-link-external-label`]??``)}),W(`input`,f,e=>{let n=e.target.value;n?t.onSet(`--sf-link-external-marker`,n):t.onReset(`--sf-link-external-marker`)}),W(`input`,_,e=>{let n=e.target.value;n?t.onSet(`--sf-link-external-label`,n):t.onReset(`--sf-link-external-label`)}),K(e,n)};J(Be,e=>{U(M)&&e(Ve)}),F(Ie);var He=V(Ie,4),Ge=z(He),Ke=V(z(Ge),2),qe=z(Ke,!0);F(Ke),F(Ge);var Je=V(Ge,2),Ye=e=>{var n=Ud();Y(V(B(n),2),16,()=>[{label:`Light`,token:`--sf-font-weight-light`,def:300},{label:`Normal`,token:`--sf-font-weight-normal`,def:400},{label:`Medium`,token:`--sf-font-weight-medium`,def:500},{label:`Semibold`,token:`--sf-font-weight-semibold`,def:600},{label:`Bold`,token:`--sf-font-weight-bold`,def:700}],e=>e.token,(e,n)=>{var r=Hd(),i=z(r),a=z(i),o=z(a,!0);F(a);var s=V(a,2),c=e=>{var r=Vd();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(i);var u=V(i,2);Y(u,20,()=>l,e=>e,(e,r)=>{let i=I(()=>t.overrides[n.token]??String(n.def));var a=jd(),o=z(a,!0);F(a),H(e=>{Z(a,e),X(a,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(i)===r?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(o,r)},[()=>`font-weight:${parseInt(r)}`]),W(`click`,a,()=>r===String(n.def)&&!(n.token in t.overrides)?void 0:r===String(n.def)?t.onReset(n.token):t.onSet(n.token,r)),K(e,a)}),F(u),F(r),H(()=>q(o,n.label)),K(e,r)}),K(e,n)};J(Je,e=>{U(ce)&&e(Ye)}),F(He);var Xe=V(He,4),Ze=z(Xe),Qe=V(z(Ze),2),$e=z(Qe,!0);F(Qe),F(Ze);var et=V(Ze,2),tt=e=>{var n=Gd(),r=B(n);{let e=I(()=>`--sf-text-display-base-min`in t.overrides||`--sf-text-display-base-max`in t.overrides);Cd(r,{title:`Display base size`,get minValue(){return U(D)},get maxValue(){return U(O)},min:1.5,max:6,step:.05,unit:`rem`,previewKind:`type`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-text-display-base-min`),t.onReset(`--sf-text-display-base-max`)},onMinChange:e=>t.onSet(`--sf-text-display-base-min`,String(e)),onMaxChange:e=>t.onSet(`--sf-text-display-base-max`,String(e))})}var i=V(r,2);Y(i,20,()=>[{label:`Display L line-height`,token:`--sf-display-l-line-height`,def:1},{label:`Display M line-height`,token:`--sf-display-m-line-height`,def:1.05}],e=>e.token,(e,n)=>{var r=Wd(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);{let e=I(()=>S(n.token,n.def)),r=I(()=>n.token in t.overrides);$(o,{label:``,get value(){return U(e)},min:.8,max:1.5,step:.025,get overridden(){return U(r)},onChange:e=>t.onSet(n.token,String(e)),onReset:()=>t.onReset(n.token)})}F(r),H(()=>q(a,n.label)),K(e,r)}),F(i),Y(V(i,2),16,()=>[{label:`Display`,tokenName:`--sf-font-weight-display`},{label:`Heading`,tokenName:`--sf-font-weight-heading`}],e=>e.tokenName,(e,n)=>{let r=I(()=>u[n.tokenName]??`700`),i=I(()=>t.overrides[n.tokenName]??U(r)),a=I(()=>n.tokenName in t.overrides);var o=Ld(),s=z(o),c=z(s),d=z(c);F(c);var f=V(c,2),p=e=>{var r=Id();W(`click`,r,()=>t.onReset(n.tokenName)),K(e,r)};J(f,e=>{U(a)&&e(p)}),F(s);var m=V(s,2);Y(m,20,()=>l,e=>e,(e,o)=>{var s=jd(),c=z(s,!0);F(s),H(e=>{Z(s,e),X(s,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(i)===o?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,o)},[()=>`font-weight: ${parseInt(o)}`]),W(`click`,s,()=>o===U(r)&&!U(a)?void 0:o===U(r)?t.onReset(n.tokenName):t.onSet(n.tokenName,o)),K(e,s)}),F(m),F(o),H(()=>q(d,`${n.label??``} weight`)),K(e,o)}),K(e,n)};J(et,e=>{U(re)&&e(tt)}),F(Xe);var nt=V(Xe,4),rt=z(nt),it=V(z(rt),2),at=z(it,!0);F(it),F(rt);var ot=V(rt,2),st=e=>{var n=Jd(),i=V(B(n),2);{let e=I(()=>`--sf-fluid-min-vw`in t.overrides||`--sf-fluid-max-vw`in t.overrides);Cd(i,{title:`Viewport range`,get minValue(){return U(ee)},get maxValue(){return U(j)},min:15,max:120,step:.5,unit:`rem`,minLabel:`Mobile`,maxLabel:`Desktop`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-fluid-min-vw`),t.onReset(`--sf-fluid-max-vw`)},onMinChange:e=>t.onSet(`--sf-fluid-min-vw`,String(e)),onMaxChange:e=>t.onSet(`--sf-fluid-max-vw`,String(e))})}var a=V(i,2);{let e=I(()=>`--sf-text-base-min`in t.overrides||`--sf-text-base-max`in t.overrides);Cd(a,{title:`Base size & ratio`,get minValue(){return U(T)},get maxValue(){return U(E)},min:.7,max:2,step:.01,unit:`rem`,minLabel:`Mobile`,maxLabel:`Desktop`,previewKind:`type`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-text-base-min`),t.onReset(`--sf-text-base-max`)},onMinChange:e=>t.onSet(`--sf-text-base-min`,String(e)),onMaxChange:e=>t.onSet(`--sf-text-base-max`,String(e)),get ratioPresets(){return r},get ratioMin(){return U(C)},get ratioMax(){return U(w)},ratioMin_bound:1.05,ratioMax_bound:1.8,onRatioMinChange:e=>t.onSet(`--sf-text-ratio-min`,String(e)),onRatioMaxChange:e=>t.onSet(`--sf-text-ratio-max`,String(e))})}var o=V(a,2),s=V(z(o),2);Y(s,21,()=>p,e=>e.token,(e,n)=>{{let r=I(()=>he(U(n))),i=I(()=>`${U(n).token} — ${U(n).label.toLowerCase()} line height`),a=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:1,max:2.2,step:.05,get help(){return U(i)},get overridden(){return U(a)},onChange:e=>t.onSet(U(n).token,String(e)),onReset:()=>t.onReset(U(n).token)})}}),F(s),F(o);var c=V(o,2);{let e=I(()=>`--sf-leading-taper`in t.overrides);$(c,{label:`Leading taper`,get value(){return U(k)},min:0,max:.5,step:.01,help:`How aggressively large display sizes shrink their line-height.`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-leading-taper`,String(e)),onReset:()=>t.onReset(`--sf-leading-taper`)})}var l=V(c,2),u=V(z(l),4);Y(u,21,()=>f,e=>e.token,(e,n)=>{var r=Kd(),i=z(r),a=z(i),o=z(a,!0);F(a);var s=V(a,2),c=e=>{var r=Vd();W(`click`,r,()=>t.onReset(U(n).token)),K(e,r)};J(s,e=>{U(n).token in t.overrides&&e(c)}),F(i);var l=V(i,2);{let e=I(()=>me(U(n)));eu(l,{get value(){return U(e)},min:-.1,max:.2,step:.005,unit:`em`,onChange:e=>t.onSet(U(n).token,`${e}em`)})}F(r),H(()=>q(o,U(n).label)),K(e,r)}),F(u),F(l);var d=V(l,2),m=z(d),h=V(z(m),2),g=z(h,!0);F(h),F(m);var _=V(m,2),v=e=>{var n=qd();Y(n,21,()=>x,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(n),K(e,n)};J(_,e=>{U(ae)&&e(v)}),F(d),H(()=>{Q(m,`aria-expanded`,U(ae)),q(g,U(ae)?`▲`:`▼`)}),W(`click`,m,()=>{R(ae,!U(ae))}),K(e,n)};J(ot,e=>{U(ie)&&e(st)}),F(nt);var ct=V(nt,4),lt=z(ct),ut=V(z(lt),2),dt=z(ut,!0);F(ut),F(lt);var ft=V(lt,2),pt=e=>{var t=Xd();Y(t,21,()=>[...d].reverse(),({label:e,factor:t})=>e,(e,t)=>{let n=()=>U(t).label,r=()=>U(t).factor,i=I(()=>(U(T)+U(E))/2),a=I(()=>U(i)*r()*U(A));var o=Yd(),s=z(o),c=z(s,!0);F(s);var l=V(s,2),u=V(l,2),d=z(u);F(u),F(o),H((e,t)=>{q(c,n()),Z(l,e),q(d,`${t??``}rem`)},[()=>`font-size: ${Math.min(U(a),2.5)}rem; font-family: ${U(le)||`inherit`}`,()=>U(a).toFixed(2)]),K(e,o)}),F(t),K(e,t)};J(ft,e=>{U(oe)&&e(pt)}),F(ct);var mt=V(ct,4),ht=z(mt),gt=V(z(ht),2),_t=z(gt,!0);F(gt),F(ht);var vt=V(ht,2),yt=e=>{var n=$d(),r=V(B(n),2);Y(r,20,()=>[{label:`2xs`,token:`--sf-text-2xs-max-width`,def:`55ch`},{label:`xs`,token:`--sf-text-xs-max-width`,def:`60ch`},{label:`s`,token:`--sf-text-s-max-width`,def:`65ch`},{label:`m`,token:`--sf-text-m-max-width`,def:`65ch`},{label:`l`,token:`--sf-text-l-max-width`,def:`none`},{label:`xl`,token:`--sf-text-xl-max-width`,def:`none`},{label:`2xl`,token:`--sf-text-2xl-max-width`,def:`none`},{label:`3xl`,token:`--sf-text-3xl-max-width`,def:`none`},{label:`4xl`,token:`--sf-text-4xl-max-width`,def:`none`}],e=>e.token,(e,n)=>{var r=Qd(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Zd();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.def)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(r),K(e,n)};J(vt,e=>{U(N)&&e(yt)}),F(mt);var bt=V(mt,4),xt=z(bt),St=V(z(xt),2),Ct=z(St,!0);F(St),F(xt);var wt=V(xt,2),Tt=e=>{var n=ef(),r=V(B(n),2),i=V(z(r),2);Y(i,20,()=>[[`tabular-nums`,`tabular-nums (default)`],[`proportional-nums`,`proportional-nums`],[`normal`,`normal`]],([e,t])=>e,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1],o=I(()=>t.overrides[`--sf-font-numeric`]??`tabular-nums`);var s=jd(),c=z(s,!0);F(s),H(()=>{X(s,1,`flex-1 py-1.5 rounded-lg text-[9px] border transition-all cursor-pointer ${U(o)===i()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,a())}),W(`click`,s,()=>i()===`tabular-nums`?t.onReset(`--sf-font-numeric`):t.onSet(`--sf-font-numeric`,i())),K(e,s)}),F(i),F(r);var a=V(r,2),o=V(z(a),2);Y(o,20,()=>[[`auto`,`auto (default)`],[`none`,`none`]],([e,t])=>e,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1],o=I(()=>t.overrides[`--sf-optical-sizing`]??`auto`);var s=jd(),c=z(s,!0);F(s),H(()=>{X(s,1,`flex-1 py-2 rounded-lg text-[10px] border transition-all cursor-pointer ${U(o)===i()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,a())}),W(`click`,s,()=>i()===`auto`?t.onReset(`--sf-optical-sizing`):t.onSet(`--sf-optical-sizing`,i())),K(e,s)}),F(o),F(a);var s=V(a,2),c=V(z(s),2);zi(c);var l=V(c,2),u=e=>{var n=Zd();W(`click`,n,()=>t.onReset(`--sf-font-features`)),K(e,n)};J(l,e=>{`--sf-font-features`in t.overrides&&e(u)}),F(s);var d=V(s,2),f=V(z(d),2);zi(f);var p=V(f,2),m=e=>{var n=Zd();W(`click`,n,()=>t.onReset(`--sf-font-variation`)),K(e,n)};J(p,e=>{`--sf-font-variation`in t.overrides&&e(m)}),F(d),H(()=>{Bi(c,t.overrides[`--sf-font-features`]??``),Bi(f,t.overrides[`--sf-font-variation`]??``)}),W(`input`,c,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-font-features`,n):t.onReset(`--sf-font-features`)}),W(`input`,f,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-font-variation`,n):t.onReset(`--sf-font-variation`)}),K(e,n)};J(wt,e=>{U(se)&&e(Tt)}),F(bt),F(we),H(()=>{Q(Ee,`aria-expanded`,U(te)),q(P,U(te)?`▲`:`▼`),Q(je,`aria-expanded`,U(ne)),q(Ne,U(ne)?`▲`:`▼`),Q(Le,`aria-expanded`,U(M)),q(ze,U(M)?`▲`:`▼`),Q(Ge,`aria-expanded`,U(ce)),q(qe,U(ce)?`▲`:`▼`),Q(Ze,`aria-expanded`,U(re)),q($e,U(re)?`▲`:`▼`),Q(rt,`aria-expanded`,U(ie)),q(at,U(ie)?`▲`:`▼`),Q(lt,`aria-expanded`,U(oe)),q(dt,U(oe)?`▲`:`▼`),Q(ht,`aria-expanded`,U(N)),q(_t,U(N)?`▲`:`▼`),Q(xt,`aria-expanded`,U(se)),q(Ct,U(se)?`▲`:`▼`)}),W(`click`,Ee,()=>{R(te,!U(te))}),W(`click`,je,()=>{R(ne,!U(ne))}),W(`click`,Le,()=>{R(M,!U(M))}),W(`click`,Ge,()=>{R(ce,!U(ce))}),W(`click`,Ze,()=>{R(re,!U(re))}),W(`click`,rt,()=>{R(ie,!U(ie))}),W(`click`,lt,()=>{R(oe,!U(oe))}),W(`click`,ht,()=>{R(N,!U(N))}),W(`click`,xt,()=>{R(se,!U(se))}),K(e,we),We()}Br([`click`,`change`,`input`]);function rf(e,t){return t.map(t=>({label:`${e}-${t}`,value:`var(--sf-${e}-${t})`}))}var af=rf(`space`,[`2xs`,`xs`,`s`,`m`,`l`,`xl`,`2xl`,`3xl`,`4xl`]),of=rf(`radius`,[`2xs`,`xs`,`s`,`m`,`l`,`xl`,`2xl`,`3xl`,`4xl`,`full`]),sf=rf(`border-width`,[`1`,`2`,`3`,`4`]),cf=rf(`container`,[`narrow`,`prose`,`default`,`wide`,`full`]),lf=rf(`size`,[`xs`,`s`,`m`,`l`,`xl`]);rf(`shadow`,[`xs`,`s`,`m`,`l`,`xl`]);var uf=G(`
`),df=G(`

The two most-referenced spacing tokens. Referenced by every layout primitive (cluster, grid, stack, bento…).

`,1),ff=G(`

Utopia-style fluid scale — viewport width, base unit and ratio per endpoint. - The viewport range is shared with the type scale.

`,1),pf=G(`
`),mf=G(`
Space scale preview
`);function hf(e,t){Ue(t,!0);let n=[{label:`Minor Third — 1.200`,value:1.2},{label:`Major Third — 1.250`,value:1.25},{label:`Perfect Fourth — 1.333`,value:1.333},{label:`Aug. Fourth — 1.414`,value:1.414},{label:`Golden — 1.618`,value:1.618}],r=[`2xs`,`xs`,`s`,`m`,`l`,`xl`,`2xl`,`3xl`,`4xl`],i=Kl.spacing??[];function a(e,n){let r=parseFloat(t.overrides[e]??``);return isNaN(r)?n:r}let o=I(()=>a(`--sf-space-ratio-min`,1.25)),s=I(()=>a(`--sf-space-ratio-max`,1.333)),c=I(()=>a(`--sf-space-base-min`,1)),l=I(()=>a(`--sf-space-base-max`,2)),u=I(()=>a(`--sf-space-scale`,1)),d=I(()=>a(`--sf-gap`,1)),f=I(()=>a(`--sf-gutter`,1.5)),p=I(()=>a(`--sf-content-gap`,.5)),m=I(()=>a(`--sf-fluid-min-vw`,22.5)),h=I(()=>a(`--sf-fluid-max-vw`,90)),g=L(!1),_=L(!1),v=L(!1);var y=mf(),b=z(y),x=V(z(b),2);Y(x,22,()=>r,e=>e,(e,t,n)=>{let r=I(()=>(U(c)+U(l))/2),i=I(()=>(U(o)+U(s))/2),a=I(()=>U(n)-3),d=I(()=>U(a)>=0?U(r)*U(i)**+U(a):U(r)/U(i)**+-U(a)),f=I(()=>U(d)*U(u)),p=I(()=>Math.min(U(f)*28,240));var m=uf(),h=z(m),g=z(h,!0);F(h);var _=V(h,2),v=V(_,2),y=z(v);F(v),F(m),H(e=>{q(g,t),Z(_,`width: ${U(p)}px; min-width: 3px`),q(y,`${e??``}rem`)},[()=>U(f).toFixed(2)]),K(e,m)}),F(x),F(b);var S=V(b,4),C=z(S),w=V(z(C),2),T=z(w,!0);F(w),F(C);var E=V(C,2),D=e=>{var n=df(),r=V(B(n),2);{let e=I(()=>`--sf-gap`in t.overrides);$(r,{label:`Gap`,get value(){return U(d)},min:0,max:4,step:.0625,unit:`rem`,help:`--sf-gap — spacing between layout items (cluster, grid, reel, stack, sidebar, bento)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-gap`,`${e}rem`),onReset:()=>t.onReset(`--sf-gap`),rawDefault:`var(--sf-space-m)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-gap`]},onRawSet:e=>t.onSet(`--sf-gap`,e)})}var i=V(r,2);{let e=I(()=>`--sf-content-gap`in t.overrides);$(i,{label:`Content gap`,get value(){return U(p)},min:0,max:2,step:.0625,unit:`rem`,help:`--sf-content-gap — tighter gap within components (defaults to space-s)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-content-gap`,`${e}rem`),onReset:()=>t.onReset(`--sf-content-gap`),rawDefault:`var(--sf-space-s)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-content-gap`]},onRawSet:e=>t.onSet(`--sf-content-gap`,e)})}var a=V(i,2);{let e=I(()=>`--sf-gutter`in t.overrides);$(a,{label:`Gutter`,get value(){return U(f)},min:0,max:6,step:.0625,unit:`rem`,help:`--sf-gutter — wide page/section side gutter (containers, .sf-section--guttered)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-gutter`,`${e}rem`),onReset:()=>t.onReset(`--sf-gutter`),rawDefault:`var(--sf-space-l)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-gutter`]},onRawSet:e=>t.onSet(`--sf-gutter`,e)})}K(e,n)};J(E,e=>{U(g)&&e(D)}),F(S);var O=V(S,4),k=z(O),A=V(z(k),2),ee=z(A,!0);F(A),F(k);var j=V(k,2),te=e=>{var r=ff(),i=V(B(r),2);{let e=I(()=>`--sf-fluid-min-vw`in t.overrides||`--sf-fluid-max-vw`in t.overrides);Cd(i,{title:`Viewport range`,get minValue(){return U(m)},get maxValue(){return U(h)},min:15,max:120,step:.5,unit:`rem`,minLabel:`Mobile`,maxLabel:`Desktop`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-fluid-min-vw`),t.onReset(`--sf-fluid-max-vw`)},onMinChange:e=>t.onSet(`--sf-fluid-min-vw`,String(e)),onMaxChange:e=>t.onSet(`--sf-fluid-max-vw`,String(e))})}var a=V(i,2);{let e=I(()=>`--sf-space-base-min`in t.overrides||`--sf-space-base-max`in t.overrides);Cd(a,{title:`Base unit & ratio`,get minValue(){return U(c)},get maxValue(){return U(l)},min:.5,max:4,step:.05,unit:`rem`,minLabel:`Mobile`,maxLabel:`Desktop`,previewKind:`space`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-space-base-min`),t.onReset(`--sf-space-base-max`)},onMinChange:e=>t.onSet(`--sf-space-base-min`,String(e)),onMaxChange:e=>t.onSet(`--sf-space-base-max`,String(e)),get ratioPresets(){return n},get ratioMin(){return U(o)},get ratioMax(){return U(s)},ratioMin_bound:1.1,ratioMax_bound:1.8,onRatioMinChange:e=>t.onSet(`--sf-space-ratio-min`,String(e)),onRatioMaxChange:e=>t.onSet(`--sf-space-ratio-max`,String(e))})}K(e,r)};J(j,e=>{U(_)&&e(te)}),F(O);var ne=V(O,4),M=z(ne),re=V(z(M),2),ie=z(re,!0);F(re),F(M);var ae=V(M,2),oe=e=>{var n=pf();Y(n,21,()=>i,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(n),K(e,n)};J(ae,e=>{U(v)&&e(oe)}),F(ne),F(y),H(()=>{Q(C,`aria-expanded`,U(g)),q(T,U(g)?`▲`:`▼`),Q(k,`aria-expanded`,U(_)),q(ee,U(_)?`▲`:`▼`),Q(M,`aria-expanded`,U(v)),q(ie,U(v)?`▲`:`▼`)}),W(`click`,C,()=>{R(g,!U(g))}),W(`click`,k,()=>{R(_,!U(_))}),W(`click`,M,()=>{R(v,!U(v))}),K(e,y),We()}Br([`click`]);var gf=G(`
`),_f=G(`
Narrow
Prose
Default
Wide
`,1),vf=G(` `,1),yf=G(`
col
`),bf=G(`
Named sizes (grid-min-xs → 2xl)
Preview at 360px panel width
`,1),xf=G(`
`),Sf=G(`
Mobile
Desktop
`,1),Cf=G(`

Offsets position:sticky elements below a fixed header. Defaults to header heights.

Mobile
Desktop
`,1),wf=G(`
`,1),Tf=G(`
`),Ef=G(``),Df=G(``),Of=G(`
`),kf=G(``),Af=G(`
Switcher
Sidebar content
Cluster
Equal columns (flowing)
Content flows between columns like a newspaper — use .sf-grid for discrete grid cells instead.
Rule style
Rule color
Cover
Frame ratio

--sf-frame-ratio — aspect ratio for .sf-frame

Reel

--sf-reel-item-width — width of each item in a horizontal .sf-reel

Height
Imposter
Content grid (breakout)
Alternate (zigzag)
`),jf=G(`
`),Mf=G(`

Override the built-in named aspect ratios used by .sf-ratio-* utilities.

`),Nf=G(`

Default values for the .sf-bg-layer full-bleed background utility.

`),Pf=G(`
`);function Ff(e,t){Ue(t,!0);let n=[`solid`,`dashed`,`dotted`],r=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`);function i(e,t){if(!e)return t;let n=parseFloat(e);return isNaN(n)?t:n}let a=I(()=>i(t.overrides[`--sf-container-narrow`],38)),o=I(()=>i(t.overrides[`--sf-container-prose`],65)),s=I(()=>i(t.overrides[`--sf-container-default`],75)),c=I(()=>i(t.overrides[`--sf-container-wide`],90)),l=I(()=>i(t.overrides[`--sf-center-max`],75)),u=I(()=>i(t.overrides[`--sf-center-gutter`],1)),d=I(()=>i(t.overrides[`--sf-grid-min`],16)),f=I(()=>i(t.overrides[`--sf-header-height-mobile`],3.5)),p=I(()=>i(t.overrides[`--sf-header-height-desktop`],5)),m=I(()=>i(t.overrides[`--sf-sidebar-width`],18)),h=I(()=>i(t.overrides[`--sf-sticky-offset-mobile`],3.5)),g=I(()=>i(t.overrides[`--sf-sticky-offset-desktop`],5)),_=[{label:`Columns`,token:`--sf-bento-cols-default`,min:1,max:12,step:1,unit:``,default:4},{label:`Row default`,token:`--sf-bento-row-default`,min:4,max:24,step:.5,unit:`rem`,default:10},{label:`Row compact`,token:`--sf-bento-row-compact`,min:2,max:16,step:.5,unit:`rem`,default:6},{label:`Row tall`,token:`--sf-bento-row-tall`,min:8,max:32,step:.5,unit:`rem`,default:16}],v=L(!1),y=L(!1),b=L(!1),x=L(!1),S=L(!1),C=L(!1),w=L(!1),T=L(!1),E=L(!1),D=L(!1);function O(e){let n=t.overrides[e.token];return n?parseFloat(n):e.default}let k=I(()=>i(t.overrides[`--sf-switcher-threshold`],30)),A=I(()=>i(t.overrides[`--sf-sidebar-min-width`],50)),ee=I(()=>i(t.overrides[`--sf-equal-min-col`],16)),j=I(()=>i(t.overrides[`--sf-equal-rule-width`],0)),te=I(()=>t.overrides[`--sf-equal-rule-color`]??``),ne=I(()=>i(t.overrides[`--sf-cover-min-height`],100)),M=I(()=>i(t.overrides[`--sf-imposter-margin`],1)),re=I(()=>i(t.overrides[`--sf-breakout-width`],90)),ie=I(()=>i(t.overrides[`--sf-content-width`],75)),ae=I(()=>i(t.overrides[`--sf-alternate-inner-gap`],1)),oe=I(()=>t.overrides[`--sf-frame-ratio`]??`16 / 9`),se=I(()=>t.overrides[`--sf-reel-item-width`]??`max-content`),N=[`16 / 9`,`4 / 3`,`3 / 2`,`1 / 1`,`21 / 9`],ce=[{label:`auto`,value:`max-content`},{label:`12rem`,value:`12rem`},{label:`16rem`,value:`16rem`},{label:`20rem`,value:`20rem`}];var le=Pf(),ue=z(le),de=z(ue),fe=V(z(de),2),pe=z(fe,!0);F(fe),F(de);var me=V(de,2),he=e=>{var n=_f(),r=B(n),i=z(r),l=V(z(i),2);{let e=I(()=>`--sf-container-narrow`in t.overrides);$(l,{label:``,get value(){return U(a)},min:20,max:60,step:1,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-container-narrow`,`${e}rem`),onReset:()=>t.onReset(`--sf-container-narrow`)})}F(i);var u=V(i,2),d=V(z(u),2);{let e=I(()=>`--sf-container-prose`in t.overrides);$(d,{label:``,get value(){return U(o)},min:40,max:90,step:1,unit:`ch`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-container-prose`,`${e}ch`),onReset:()=>t.onReset(`--sf-container-prose`)})}F(u);var f=V(u,2),p=V(z(f),2);{let e=I(()=>`--sf-container-default`in t.overrides);$(p,{label:``,get value(){return U(s)},min:50,max:120,step:1,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-container-default`,`${e}rem`),onReset:()=>t.onReset(`--sf-container-default`)})}F(f);var m=V(f,2),h=V(z(m),2);{let e=I(()=>`--sf-container-wide`in t.overrides);$(h,{label:``,get value(){return U(c)},min:60,max:160,step:1,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-container-wide`,`${e}rem`),onReset:()=>t.onReset(`--sf-container-wide`)})}F(m),F(r);var g=V(r,2);Y(g,21,()=>[{label:`narrow`,value:U(a),max:U(c),unit:`rem`},{label:`prose`,value:U(o),max:U(c)*1.5,unit:`ch`},{label:`default`,value:U(s),max:U(c),unit:`rem`},{label:`wide`,value:U(c),max:U(c),unit:`rem`}],e=>e.label,(e,t)=>{var n=gf(),r=z(n),i=z(r,!0);F(r);var a=V(r,2),o=z(a);F(a);var s=V(a,2),c=z(s);F(s),F(n),H(e=>{q(i,U(t).label),Z(o,e),q(c,`${U(t).value??``}${U(t).unit??``}`)},[()=>`width: ${Math.min(U(t).value/U(t).max*100,100)}%`]),K(e,n)}),F(g),K(e,n)};J(me,e=>{U(v)&&e(he)}),F(ue);var ge=V(ue,4),_e=z(ge),ve=V(z(_e),2),ye=z(ve,!0);F(ve),F(_e);var be=V(_e,2),xe=e=>{var n=vf(),r=B(n);{let e=I(()=>`--sf-center-max`in t.overrides);$(r,{label:`Max width`,get value(){return U(l)},min:30,max:160,step:1,unit:`rem`,help:`--sf-center-max — max-width of the .sf-center centering wrapper`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-center-max`,`${e}rem`),onReset:()=>t.onReset(`--sf-center-max`),rawDefault:`var(--sf-container-default)`,get variableOptions(){return cf},get currentRaw(){return t.overrides[`--sf-center-max`]},onRawSet:e=>t.onSet(`--sf-center-max`,e)})}var i=V(r,2);{let e=I(()=>`--sf-center-gutter`in t.overrides);$(i,{label:`Gutter`,get value(){return U(u)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-center-gutter — minimum side padding inside the center wrapper`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-center-gutter`,`${e}rem`),onReset:()=>t.onReset(`--sf-center-gutter`),rawDefault:`var(--sf-gutter)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-center-gutter`]},onRawSet:e=>t.onSet(`--sf-center-gutter`,e)})}K(e,n)};J(be,e=>{U(y)&&e(xe)}),F(ge);var Se=V(ge,4),Ce=z(Se),we=V(z(Ce),2),Te=z(we,!0);F(we),F(Ce);var Ee=V(Ce,2),De=e=>{var n=bf(),r=B(n);{let e=I(()=>`--sf-grid-min`in t.overrides);$(r,{label:`Grid min cell width`,get value(){return U(d)},min:8,max:40,step:.5,unit:`rem`,help:`sf-grid minimum column width — browser auto-fills columns`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-grid-min`,`${e}rem`),onReset:()=>t.onReset(`--sf-grid-min`)})}var a=V(r,2),o=V(z(a),2);Y(o,20,()=>[{label:`xs`,token:`--sf-grid-min-xs`,def:10},{label:`s`,token:`--sf-grid-min-s`,def:13},{label:`m`,token:`--sf-grid-min-m`,def:16},{label:`l`,token:`--sf-grid-min-l`,def:20},{label:`xl`,token:`--sf-grid-min-xl`,def:24},{label:`2xl`,token:`--sf-grid-min-2xl`,def:28}],e=>e.token,(e,n)=>{{let r=I(()=>i(t.overrides[n.token],n.def)),a=I(()=>n.token in t.overrides);$(e,{get label(){return n.label},get value(){return U(r)},min:6,max:40,step:.5,unit:`rem`,get overridden(){return U(a)},onChange:e=>t.onSet(n.token,`${e}rem`),onReset:()=>t.onReset(n.token)})}}),F(o),F(a);var s=V(a,2),c=V(z(s),2);Y(c,20,()=>Array.from({length:8}),ii,(e,t)=>{K(e,yf())}),F(c),F(s),H(e=>Z(c,e),[()=>`grid-template-columns: repeat(auto-fill, minmax(${Math.min(U(d)*16*(360/1200),120)}px, 1fr))`]),K(e,n)};J(Ee,e=>{U(b)&&e(De)}),F(Se);var P=V(Se,4),Oe=z(P),ke=V(z(Oe),2),Ae=z(ke,!0);F(ke),F(Oe);var je=V(Oe,2),Ne=e=>{var n=Sf(),r=B(n),i=z(r),a=V(z(i),2);{let e=I(()=>`--sf-header-height-mobile`in t.overrides);$(a,{label:``,get value(){return U(f)},min:2,max:8,step:.25,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-header-height-mobile`,`${e}rem`),onReset:()=>t.onReset(`--sf-header-height-mobile`)})}F(i);var o=V(i,2),s=V(z(o),2);{let e=I(()=>`--sf-header-height-desktop`in t.overrides);$(s,{label:``,get value(){return U(p)},min:3,max:10,step:.25,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-header-height-desktop`,`${e}rem`),onReset:()=>t.onReset(`--sf-header-height-desktop`)})}F(o),F(r);var c=V(r,2),l=z(c),u=V(z(l),2);Y(u,20,()=>[1,2,3],e=>e,(e,t)=>{K(e,xf())}),F(u),F(l);var d=V(l,2),m=z(d);F(d),F(c),H(e=>{Z(l,e),q(m,`${U(f)??``}rem mobile · ${U(p)??``}rem desktop`)},[()=>`height: ${Math.min(U(f)*12,64)}px`]),K(e,n)};J(je,e=>{U(x)&&e(Ne)}),F(P);var Pe=V(P,4),Fe=z(Pe),Ie=V(z(Fe),2),Le=z(Ie,!0);F(Ie),F(Fe);var Re=V(Fe,2),ze=e=>{var n=Cf(),r=V(B(n),2),i=z(r),a=V(z(i),2);{let e=I(()=>`--sf-sticky-offset-mobile`in t.overrides);$(a,{label:``,get value(){return U(h)},min:0,max:12,step:.25,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-sticky-offset-mobile`,`${e}rem`),onReset:()=>t.onReset(`--sf-sticky-offset-mobile`),rawDefault:`var(--sf-header-height-mobile)`,get currentRaw(){return t.overrides[`--sf-sticky-offset-mobile`]},onRawSet:e=>t.onSet(`--sf-sticky-offset-mobile`,e)})}F(i);var o=V(i,2),s=V(z(o),2);{let e=I(()=>`--sf-sticky-offset-desktop`in t.overrides);$(s,{label:``,get value(){return U(g)},min:0,max:12,step:.25,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-sticky-offset-desktop`,`${e}rem`),onReset:()=>t.onReset(`--sf-sticky-offset-desktop`),rawDefault:`var(--sf-header-height-desktop)`,get currentRaw(){return t.overrides[`--sf-sticky-offset-desktop`]},onRawSet:e=>t.onSet(`--sf-sticky-offset-desktop`,e)})}F(o),F(r),K(e,n)};J(Re,e=>{U(S)&&e(ze)}),F(Pe);var Be=V(Pe,4),Ve=z(Be),He=V(z(Ve),2),Ge=z(He,!0);F(He),F(Ve);var Ke=V(Ve,2),qe=e=>{var n=wf(),r=B(n);{let e=I(()=>`--sf-sidebar-width`in t.overrides);$(r,{label:`Sidebar width`,get value(){return U(m)},min:10,max:32,step:.5,unit:`rem`,help:`--sf-sidebar-width — default sidebar / drawer width`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-sidebar-width`,`${e}rem`),onReset:()=>t.onReset(`--sf-sidebar-width`)})}var i=V(r,2),a=z(i),o=z(a),s=z(o);F(o),F(a),Me(2),F(i),H(e=>{Z(a,e),q(s,`${U(m)??``}rem`)},[()=>`width: ${Math.min(U(m)*3.5,100)}px`]),K(e,n)};J(Ke,e=>{U(C)&&e(qe)}),F(Be);var Je=V(Be,4),Ye=z(Je),Xe=V(z(Ye),2),Ze=z(Xe,!0);F(Xe),F(Ye);var Qe=V(Ye,2),$e=e=>{var n=Tf();Y(n,21,()=>_,e=>e.token,(e,n)=>{{let r=I(()=>O(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},get min(){return U(n).min},get max(){return U(n).max},get step(){return U(n).step},get unit(){return U(n).unit},get help(){return U(n).token},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,U(n).unit?`${e}${U(n).unit}`:String(e)),onReset:()=>t.onReset(U(n).token)})}}),F(n),K(e,n)};J(Qe,e=>{U(w)&&e($e)}),F(Je);var et=V(Je,4),tt=z(et),nt=V(z(tt),2),rt=z(nt,!0);F(nt),F(tt);var it=V(tt,2),at=e=>{var i=Af(),a=z(i),o=V(z(a),2);{let e=I(()=>`--sf-switcher-threshold`in t.overrides);$(o,{label:`Threshold`,get value(){return U(k)},min:10,max:60,step:1,unit:`rem`,help:`--sf-switcher-threshold — width below which .sf-switcher stacks vertically`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-switcher-threshold`,`${e}rem`),onReset:()=>t.onReset(`--sf-switcher-threshold`)})}F(a);var s=V(a,2),c=V(z(s),2);{let e=I(()=>`--sf-sidebar-min-width`in t.overrides);$(c,{label:`Content min width`,get value(){return U(A)},min:20,max:80,step:1,unit:`%`,help:`--sf-sidebar-min-width — minimum width of the .sf-sidebar content column before it wraps`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-sidebar-min-width`,`${e}%`),onReset:()=>t.onReset(`--sf-sidebar-min-width`)})}F(s);var l=V(s,2);Y(V(z(l),2),16,()=>[{label:`Align`,token:`--sf-cluster-align`,def:`center`,opts:[`flex-start`,`center`,`flex-end`,`stretch`,`baseline`]},{label:`Justify`,token:`--sf-cluster-justify`,def:`flex-start`,opts:[`flex-start`,`center`,`flex-end`,`space-between`,`space-around`]}],e=>e.token,(e,n)=>{var i=Of(),a=z(i),o=z(a,!0);F(a);var s=V(a,2);Y(s,20,()=>n.opts,e=>e,(e,t)=>{var n=Ef(),i=z(n,!0);F(n);var a={};H(()=>{Z(n,`background:${U(r)};`),q(i,t),a!==(a=t)&&(n.value=(n.__value=t)??``)}),K(e,n)}),F(s);var c;Di(s);var l=V(s,2),u=e=>{var r=Df();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(l,e=>{n.token in t.overrides&&e(u)}),F(i),H(()=>{q(o,n.label),c!==(c=t.overrides[n.token]??n.def)&&(s.value=(s.__value=t.overrides[n.token]??n.def)??``,Ei(s,t.overrides[n.token]??n.def))}),W(`change`,s,e=>{let r=e.target.value;r===n.def?t.onReset(n.token):t.onSet(n.token,r)}),K(e,i)}),F(l);var u=V(l,2),d=V(z(u),4);{let e=I(()=>`--sf-equal-min-col`in t.overrides);$(d,{label:`Min column width`,get value(){return U(ee)},min:6,max:36,step:.5,unit:`rem`,help:`--sf-equal-min-col — column-width floor for .sf-equal`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-equal-min-col`,`${e}rem`),onReset:()=>t.onReset(`--sf-equal-min-col`)})}var f=V(d,2);{let e=I(()=>`--sf-equal-rule-width`in t.overrides);$(f,{label:`Rule width`,get value(){return U(j)},min:0,max:4,step:.5,unit:`px`,help:`--sf-equal-rule-width — column-rule width between flowing columns, 0 = off`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-equal-rule-width`,`${e}px`),onReset:()=>t.onReset(`--sf-equal-rule-width`)})}var p=V(f,2),m=V(z(p),2);Y(m,20,()=>n,e=>e,(e,t)=>{var n=Ef(),i=z(n,!0);F(n);var a={};H(()=>{Z(n,`background:${U(r)};`),q(i,t),a!==(a=t)&&(n.value=(n.__value=t)??``)}),K(e,n)}),F(m);var h;Di(m);var g=V(m,2),_=e=>{var n=Df();W(`click`,n,()=>t.onReset(`--sf-equal-rule-style`)),K(e,n)};J(g,e=>{`--sf-equal-rule-style`in t.overrides&&e(_)}),F(p);var v=V(p,2),y=V(z(v),2);{let e=I(()=>`--sf-equal-rule-color`in t.overrides);ku(y,{token:`--sf-equal-rule-color`,get value(){return U(te)},placeholder:`inherits border`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-equal-rule-color`,e),onReset:()=>t.onReset(`--sf-equal-rule-color`)})}F(v),F(u);var b=V(u,2),x=V(z(b),2);{let e=I(()=>`--sf-cover-min-height`in t.overrides);$(x,{label:`Min height`,get value(){return U(ne)},min:20,max:100,step:1,unit:`dvh`,help:`--sf-cover-min-height — minimum height of the .sf-cover layout`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-cover-min-height`,`${e}dvh`),onReset:()=>t.onReset(`--sf-cover-min-height`)})}F(b);var S=V(b,2),C=V(z(S),4);Y(C,20,()=>N,e=>e,(e,n)=>{var r=kf(),i=z(r,!0);F(r),H(e=>{X(r,1,e),q(i,n)},[()=>`py-1 rounded-lg text-[9px] border transition-all cursor-pointer font-mono ${U(oe).replace(/\s/g,``)===n.replace(/\s/g,``)?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`]),W(`click`,r,()=>n===`16 / 9`?t.onReset(`--sf-frame-ratio`):t.onSet(`--sf-frame-ratio`,n)),K(e,r)}),F(C),F(S);var w=V(S,2),T=V(z(w),4);Y(T,21,()=>ce,e=>e.value,(e,n)=>{var r=kf(),i=z(r,!0);F(r),H(()=>{X(r,1,`py-1 rounded-lg text-[9px] border transition-all cursor-pointer ${U(se)===U(n).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,U(n).label)}),W(`click`,r,()=>U(n).value===`max-content`?t.onReset(`--sf-reel-item-width`):t.onSet(`--sf-reel-item-width`,U(n).value)),K(e,r)}),F(T);var E=V(T,2),D=V(z(E),2);zi(D);var O=V(D,2),le=e=>{var n=Df();W(`click`,n,()=>t.onReset(`--sf-reel-height`)),K(e,n)};J(O,e=>{`--sf-reel-height`in t.overrides&&e(le)}),F(E),F(w);var ue=V(w,2),de=V(z(ue),2);{let e=I(()=>`--sf-imposter-margin`in t.overrides);$(de,{label:`Margin`,get value(){return U(M)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-imposter-margin — viewport inset for the centered .sf-imposter overlay`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-imposter-margin`,`${e}rem`),onReset:()=>t.onReset(`--sf-imposter-margin`),rawDefault:`var(--sf-space-m)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-imposter-margin`]},onRawSet:e=>t.onSet(`--sf-imposter-margin`,e)})}F(ue);var fe=V(ue,2),pe=V(z(fe),2);{let e=I(()=>`--sf-content-width`in t.overrides);$(pe,{label:`Content width`,get value(){return U(ie)},min:40,max:120,step:1,unit:`rem`,help:`--sf-content-width — default reading column width in .sf-content-grid`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-content-width`,`${e}rem`),onReset:()=>t.onReset(`--sf-content-width`),rawDefault:`var(--sf-container-default)`,get variableOptions(){return cf},get currentRaw(){return t.overrides[`--sf-content-width`]},onRawSet:e=>t.onSet(`--sf-content-width`,e)})}var me=V(pe,2);{let e=I(()=>`--sf-breakout-width`in t.overrides);$(me,{label:`Breakout width`,get value(){return U(re)},min:50,max:160,step:1,unit:`rem`,help:`--sf-breakout-width — wide breakout column width in .sf-content-grid`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-breakout-width`,`${e}rem`),onReset:()=>t.onReset(`--sf-breakout-width`),rawDefault:`var(--sf-container-wide)`,get variableOptions(){return cf},get currentRaw(){return t.overrides[`--sf-breakout-width`]},onRawSet:e=>t.onSet(`--sf-breakout-width`,e)})}F(fe);var he=V(fe,2),ge=V(z(he),2);{let e=I(()=>`--sf-alternate-inner-gap`in t.overrides);$(ge,{label:`Inner gap`,get value(){return U(ae)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-alternate-inner-gap — gap between media and text within an .sf-alternate row`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-alternate-inner-gap`,`${e}rem`),onReset:()=>t.onReset(`--sf-alternate-inner-gap`),rawDefault:`var(--sf-gap)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-alternate-inner-gap`]},onRawSet:e=>t.onSet(`--sf-alternate-inner-gap`,e)})}F(he),F(i),H(()=>{h!==(h=t.overrides[`--sf-equal-rule-style`]??`solid`)&&(m.value=(m.__value=t.overrides[`--sf-equal-rule-style`]??`solid`)??``,Ei(m,t.overrides[`--sf-equal-rule-style`]??`solid`)),Bi(D,t.overrides[`--sf-reel-height`]??``)}),W(`change`,m,e=>{let n=e.target.value;n===`solid`?t.onReset(`--sf-equal-rule-style`):t.onSet(`--sf-equal-rule-style`,n)}),W(`input`,D,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-reel-height`,n):t.onReset(`--sf-reel-height`)}),K(e,i)};J(it,e=>{U(T)&&e(at)}),F(et);var ot=V(et,4),st=z(ot),ct=V(z(st),2),lt=z(ct,!0);F(ct),F(st);var ut=V(st,2),dt=e=>{var n=Mf();Y(V(z(n),2),16,()=>[{label:`Square`,token:`--sf-ratio-square`,def:`1`},{label:`Portrait`,token:`--sf-ratio-portrait`,def:`3 / 4`},{label:`3:2`,token:`--sf-ratio-3-2`,def:`3 / 2`},{label:`4:3`,token:`--sf-ratio-4-3`,def:`4 / 3`},{label:`Video`,token:`--sf-ratio-video`,def:`16 / 9`},{label:`Cinema`,token:`--sf-ratio-cinema`,def:`21 / 9`},{label:`Golden`,token:`--sf-ratio-golden`,def:`1.618 / 1`}],e=>e.token,(e,n)=>{var r=jf(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Df();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.def)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(n),K(e,n)};J(ut,e=>{U(D)&&e(dt)}),F(ot);var ft=V(ot,4),pt=z(ft),mt=V(z(pt),2),ht=z(mt,!0);F(mt),F(pt);var gt=V(pt,2),_t=e=>{var n=Nf(),a=V(z(n),2);Y(a,16,()=>[{label:`Fit`,token:`--sf-bg-layer-fit`,placeholder:`cover`,opts:[`cover`,`contain`,`fill`,`none`,`scale-down`]},{label:`Position`,token:`--sf-bg-layer-position`,placeholder:`50% 50%`,opts:[`50% 50%`,`top`,`bottom`,`left`,`right`,`center`]}],e=>e.token,(e,n)=>{var i=Of(),a=z(i),o=z(a,!0);F(a);var s=V(a,2);Y(s,20,()=>n.opts,e=>e,(e,t)=>{var n=Ef(),i=z(n,!0);F(n);var a={};H(()=>{Z(n,`background:${U(r)};`),q(i,t),a!==(a=t)&&(n.value=(n.__value=t)??``)}),K(e,n)}),F(s);var c;Di(s);var l=V(s,2),u=e=>{var r=Df();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(l,e=>{n.token in t.overrides&&e(u)}),F(i),H(()=>{q(o,n.label),c!==(c=t.overrides[n.token]??n.placeholder)&&(s.value=(s.__value=t.overrides[n.token]??n.placeholder)??``,Ei(s,t.overrides[n.token]??n.placeholder))}),W(`change`,s,e=>{let r=e.target.value;r===n.placeholder?t.onReset(n.token):t.onSet(n.token,r)}),K(e,i)});var o=V(a,2);{let e=I(()=>i(t.overrides[`--sf-bg-layer-inset`],0)),n=I(()=>`--sf-bg-layer-inset`in t.overrides);$(o,{label:`Inset`,get value(){return U(e)},min:0,max:4,step:.25,unit:`rem`,help:`--sf-bg-layer-inset — inset the background from the container edges`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-bg-layer-inset`,`${e}rem`),onReset:()=>t.onReset(`--sf-bg-layer-inset`)})}var s=V(o,2);{let e=I(()=>i(t.overrides[`--sf-bg-layer-radius`],0)),n=I(()=>`--sf-bg-layer-radius`in t.overrides);$(s,{label:`Radius`,get value(){return U(e)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-bg-layer-radius — corner radius of the background element`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-bg-layer-radius`,`${e}rem`),onReset:()=>t.onReset(`--sf-bg-layer-radius`)})}var c=V(s,2);{let e=I(()=>i(t.overrides[`--sf-bg-layer-z`],-2)),n=I(()=>`--sf-bg-layer-z`in t.overrides);$(c,{label:`Z-index`,get value(){return U(e)},min:-10,max:0,step:1,help:`--sf-bg-layer-z — stack order of the background pseudo-element (typically negative)`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-bg-layer-z`,String(e)),onReset:()=>t.onReset(`--sf-bg-layer-z`)})}F(n),K(e,n)};J(gt,e=>{U(E)&&e(_t)}),F(ft),F(le),H(()=>{Q(de,`aria-expanded`,U(v)),q(pe,U(v)?`▲`:`▼`),Q(_e,`aria-expanded`,U(y)),q(ye,U(y)?`▲`:`▼`),Q(Ce,`aria-expanded`,U(b)),q(Te,U(b)?`▲`:`▼`),Q(Oe,`aria-expanded`,U(x)),q(Ae,U(x)?`▲`:`▼`),Q(Fe,`aria-expanded`,U(S)),q(Le,U(S)?`▲`:`▼`),Q(Ve,`aria-expanded`,U(C)),q(Ge,U(C)?`▲`:`▼`),Q(Ye,`aria-expanded`,U(w)),q(Ze,U(w)?`▲`:`▼`),Q(tt,`aria-expanded`,U(T)),q(rt,U(T)?`▲`:`▼`),Q(st,`aria-expanded`,U(D)),q(lt,U(D)?`▲`:`▼`),Q(pt,`aria-expanded`,U(E)),q(ht,U(E)?`▲`:`▼`)}),W(`click`,de,()=>{R(v,!U(v))}),W(`click`,_e,()=>{R(y,!U(y))}),W(`click`,Ce,()=>{R(b,!U(b))}),W(`click`,Oe,()=>{R(x,!U(x))}),W(`click`,Fe,()=>{R(S,!U(S))}),W(`click`,Ve,()=>{R(C,!U(C))}),W(`click`,Ye,()=>{R(w,!U(w))}),W(`click`,tt,()=>{R(T,!U(T))}),W(`click`,st,()=>{R(D,!U(D))}),W(`click`,pt,()=>{R(E,!U(E))}),K(e,le),We()}Br([`click`,`change`,`input`]);var If=G(`

Drives --sf-color-border--strong, --subtle, --translucent automatically.

`,1),Lf=G(`
`),Rf=G(`
`,1),zf=G(``),Bf=G(`
`),Vf=G(`
Border sample
`,1),Hf=G(`
Color
`,1),Uf=G(`
Ring color
Focus preview
`,1),Wf=G(`
`),Gf=G(`
`),Kf=G(`
`),qf=G(`

--sf-media-radius — 0 by default (off). Rounds every <img>/<figure> globally via a - zero-specificity :where() rule; .sf-bg-layer and component-level radii still win.

`,1),Jf=G(`
`),Yf=G(`
`),Xf=G(`
Radius
`);function Zf(e,t){Ue(t,!0);let n=[`solid`,`dashed`,`dotted`],r=[`xs`,`s`,`m`,`l`,`xl`,`2xl`,`full`],i={xs:2,s:4,m:8,l:12,xl:16,"2xl":24,full:9999},a=[{step:`xs`,name:`--sf-radius-xs`,default:2,max:16,step_size:.5,rawDefault:`calc(2px * var(--sf-radius-scale))`},{step:`s`,name:`--sf-radius-s`,default:4,max:24,step_size:.5,rawDefault:`calc(4px * var(--sf-radius-scale))`},{step:`m`,name:`--sf-radius-m`,default:8,max:32,step_size:1,rawDefault:`calc(8px * var(--sf-radius-scale))`},{step:`l`,name:`--sf-radius-l`,default:12,max:48,step_size:1,rawDefault:`calc(12px * var(--sf-radius-scale))`},{step:`xl`,name:`--sf-radius-xl`,default:16,max:64,step_size:1,rawDefault:`calc(16px * var(--sf-radius-scale))`},{step:`2xl`,name:`--sf-radius-2xl`,default:24,max:80,step_size:2,rawDefault:`calc(24px * var(--sf-radius-scale))`}],o=[{label:`Field radius`,token:`--sf-field-radius`,unit:`rem`,min:0,max:2,step:.05,default:.5,rawDefault:`var(--sf-radius-m)`,help:`--sf-field-radius`,variableOptions:of},{label:`Field padding block`,token:`--sf-field-padding-block`,unit:`rem`,min:0,max:1,step:.025,default:.375,rawDefault:`var(--sf-space-xs)`,help:`--sf-field-padding-block`,variableOptions:af},{label:`Field padding inline`,token:`--sf-field-padding-inline`,unit:`rem`,min:0,max:2,step:.025,default:.75,rawDefault:`var(--sf-space-s)`,help:`--sf-field-padding-inline`,variableOptions:af}],s=Kl.borders??[],c=L(!1),l=L(!1),u=L(!1),d=L(!1),f=L(!1),p=L(!1),m=L(!1),h=L(!1),g=L(!1),_=L(!1);function v(e,t,n){if(!e)return t;let r=parseFloat(n?e.replace(n,``):e);return isNaN(r)?t:r}let y=I(()=>v(t.overrides[`--sf-radius-scale`],1)),b=I(()=>v(t.overrides[`--sf-border-scale`],1)),x=I(()=>v(t.overrides[`--sf-focus-ring-width`],2,`px`)),S=I(()=>v(t.overrides[`--sf-focus-ring-offset`],2,`px`)),C=I(()=>v(t.overrides[`--sf-divider-width`]?.replace(`px`,``),1)),w=I(()=>v(t.overrides[`--sf-divider-gap`]?.replace(`rem`,``),1)),T=I(()=>t.overrides[`--sf-color-border`]??``),E=I(()=>t.overrides[`--sf-border-style`]??`solid`),D=I(()=>t.overrides[`--sf-focus-ring-color`]??``),O=I(()=>t.overrides[`--sf-divider-color`]??``),k=I(()=>v(t.overrides[`--sf-media-radius`]?.replace(`rem`,``),0));function A(e,n){return t.overrides[e]??n}function ee(e){let n=t.overrides[e.name];if(!n||/^(var|calc|clamp)\(/.test(n.trim()))return e.default;let r=parseFloat(n);return isNaN(r)?e.default:r}function j(e){let n=t.overrides[e.token];if(!n||/^(var|calc|clamp)\(/.test(n.trim()))return e.default;let r=parseFloat(n);return isNaN(r)?e.default:r}var te=Xf(),ne=z(te),M=z(ne),re=V(z(M),2),ie=z(re,!0);F(re),F(M);var ae=V(M,2),oe=e=>{var n=If(),r=B(n);{let e=I(()=>`--sf-color-border`in t.overrides);ku(r,{token:`--sf-color-border`,get value(){return U(T)},placeholder:`auto-derived`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-color-border`,e),onReset:()=>t.onReset(`--sf-color-border`)})}Me(2),K(e,n)};J(ae,e=>{U(c)&&e(oe)}),F(ne);var se=V(ne,4),N=z(se),ce=V(z(N),2),le=z(ce,!0);F(ce),F(N);var ue=V(N,2),de=e=>{var n=Rf(),r=B(n);{let e=I(()=>`--sf-border-scale`in t.overrides);$(r,{label:`Border scale`,get value(){return U(b)},min:0,max:4,step:.25,help:`Multiplier applied to all border widths. 0 hides all borders.`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-border-scale`,String(e)),onReset:()=>t.onReset(`--sf-border-scale`)})}var i=V(r,2);{let e=I(()=>v(t.overrides[`--sf-border-width-hairline`]?.replace(`px`,``),.5)),n=I(()=>`--sf-border-width-hairline`in t.overrides);$(i,{label:`Hairline`,get value(){return U(e)},min:0,max:1,step:.25,unit:`px`,help:`--sf-border-width-hairline — ultra-thin border for retina displays`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-border-width-hairline`,`${e}px`),onReset:()=>t.onReset(`--sf-border-width-hairline`)})}var a=V(i,2);{let e=I(()=>v(t.overrides[`--sf-box-border-width`]?.replace(`px`,``),0)),n=I(()=>`--sf-box-border-width`in t.overrides);$(a,{label:`Box border`,get value(){return U(e)},min:0,max:4,step:.5,unit:`px`,help:`--sf-box-border-width — box-shadow border drawn without affecting layout`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-box-border-width`,`${e}px`),onReset:()=>t.onReset(`--sf-box-border-width`)})}var o=V(a,2);Y(o,20,()=>[1,2,3,4],e=>e,(e,t)=>{var n=Lf(),r=z(n),i=z(r);F(r);var a=V(r,2),o=V(a,2),s=z(o);F(o),F(n),H((e,n)=>{q(i,`${t??``}px →`),Z(a,e),q(s,`${n??``}px`)},[()=>`height: ${Math.max(t*U(b),.5)}px`,()=>(t*U(b)).toFixed(1)]),K(e,n)}),F(o),K(e,n)};J(ue,e=>{U(l)&&e(de)}),F(se);var fe=V(se,4),pe=z(fe),me=V(z(pe),2),he=z(me,!0);F(me),F(pe);var ge=V(pe,2),_e=e=>{var r=Vf(),i=B(r);Y(i,20,()=>[{label:`Border`,token:`--sf-border-style`,default:`solid`},{label:`Divider`,token:`--sf-divider-style`,default:`solid`}],e=>e.token,(e,r)=>{var i=Bf(),a=z(i),o=z(a,!0);F(a);var s=V(a,2);Y(s,20,()=>n,e=>e,(e,n)=>{let i=I(()=>A(r.token,r.default));var a=zf(),o=z(a),s=V(o);F(a),H(()=>{X(a,1,`px-2 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer text-center ${U(i)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),Z(o,`width: 20px; height: 0; border-bottom: 2px ${n} currentColor; opacity: 0.7`),q(s,` ${n??``}`)}),W(`click`,a,()=>n===r.default?t.onReset(r.token):t.onSet(r.token,n)),K(e,a)}),F(s),F(i),H(()=>q(o,r.label)),K(e,i)}),F(i);var a=V(i,2),o=z(a),s=V(o,2),c=z(s);F(s),F(a),H((e,t)=>{Z(o,e),q(c,`${t??``}px · ${U(E)??``}`)},[()=>`border: ${Math.max(U(b),.5)}px ${U(E)} ${U(T)||`var(--sf-color-border, #64748b)`}`,()=>(1*U(b)).toFixed(1)]),K(e,r)};J(ge,e=>{U(u)&&e(_e)}),F(fe);var ve=V(fe,4),ye=z(ve),be=V(z(ye),2),xe=z(be,!0);F(be),F(ye);var Se=V(ye,2),Ce=e=>{var n=Hf(),r=B(n),i=V(z(r),2);{let e=I(()=>`--sf-divider-color`in t.overrides);ku(i,{token:`--sf-divider-color`,get value(){return U(O)},placeholder:`inherits border`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-divider-color`,e),onReset:()=>t.onReset(`--sf-divider-color`)})}F(r);var a=V(r,2);{let e=I(()=>`--sf-divider-width`in t.overrides);$(a,{label:`Width`,get value(){return U(C)},min:.5,max:4,step:.5,unit:`px`,help:`--sf-divider-width`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-divider-width`,`${e}px`),onReset:()=>t.onReset(`--sf-divider-width`),rawDefault:`var(--sf-border-width-1)`,get variableOptions(){return sf},get currentRaw(){return t.overrides[`--sf-divider-width`]},onRawSet:e=>t.onSet(`--sf-divider-width`,e)})}var o=V(a,2);{let e=I(()=>`--sf-divider-gap`in t.overrides);$(o,{label:`Gap`,get value(){return U(w)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-divider-gap — spacing around divider lines`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-divider-gap`,`${e}rem`),onReset:()=>t.onReset(`--sf-divider-gap`),rawDefault:`var(--sf-space-m)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-divider-gap`]},onRawSet:e=>t.onSet(`--sf-divider-gap`,e)})}K(e,n)};J(Se,e=>{U(d)&&e(Ce)}),F(ve);var we=V(ve,4),Te=z(we),Ee=V(z(Te),2),De=z(Ee,!0);F(Ee),F(Te);var P=V(Te,2),Oe=e=>{var n=Uf(),r=B(n);{let e=I(()=>`--sf-focus-ring-width`in t.overrides);$(r,{label:`Ring width`,get value(){return U(x)},min:0,max:6,step:.5,unit:`px`,help:`Thickness of the keyboard focus indicator`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-focus-ring-width`,`${e}px`),onReset:()=>t.onReset(`--sf-focus-ring-width`)})}var i=V(r,2);{let e=I(()=>`--sf-focus-ring-offset`in t.overrides);$(i,{label:`Ring offset`,get value(){return U(S)},min:0,max:8,step:.5,unit:`px`,help:`Gap between element edge and focus ring`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-focus-ring-offset`,`${e}px`),onReset:()=>t.onReset(`--sf-focus-ring-offset`)})}var a=V(i,2),o=V(z(a),2);{let e=I(()=>`--sf-focus-ring-color`in t.overrides);ku(o,{token:`--sf-focus-ring-color`,get value(){return U(D)},placeholder:`default (action)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-focus-ring-color`,e),onReset:()=>t.onReset(`--sf-focus-ring-color`)})}F(a);var s=V(a,2),c=z(s);F(s),H(()=>Z(c,`outline: ${U(x)}px solid ${U(D)||`oklch(0.7 0.2 235)`}; outline-offset: ${U(S)}px`)),K(e,n)};J(P,e=>{U(f)&&e(Oe)}),F(we);var ke=V(we,6),Ae=z(ke),je=V(z(Ae),2),Ne=z(je,!0);F(je),F(Ae);var Pe=V(Ae,2),Fe=e=>{var n=Wf();Y(n,21,()=>a,e=>e.name,(e,n)=>{{let r=I(()=>ee(U(n))),i=I(()=>U(n).name in t.overrides);$(e,{get label(){return U(n).step},get value(){return U(r)},min:0,get max(){return U(n).max},get step(){return U(n).step_size},unit:`px`,get overridden(){return U(i)},onChange:e=>t.onSet(U(n).name,`${e}px`),onReset:()=>t.onReset(U(n).name),get rawDefault(){return U(n).rawDefault},get currentRaw(){return t.overrides[U(n).name]},onRawSet:e=>t.onSet(U(n).name,e)})}}),F(n),K(e,n)};J(Pe,e=>{U(g)&&e(Fe)}),F(ke);var Ie=V(ke,2),Le=z(Ie),Re=V(z(Le),2),ze=z(Re,!0);F(Re),F(Le);var Be=V(Le,2),Ve=e=>{var t=Kf(),n=z(t);Y(n,20,()=>r,e=>e,(e,t)=>{let n=I(()=>i[t]??6),r=I(()=>t===`full`?9999:U(n)*U(y));var a=Gf(),o=z(a),s=V(o,2),c=z(s,!0);F(s),F(a),H(e=>{Z(o,e),q(c,t)},[()=>`border-radius: ${Math.min(U(r),9999)}px`]),K(e,a)}),F(n),F(t),K(e,t)};J(Be,e=>{U(m)&&e(Ve)}),F(Ie);var He=V(Ie,4),Ge=z(He),Ke=V(z(Ge),2),qe=z(Ke,!0);F(Ke),F(Ge);var Je=V(Ge,2),Ye=e=>{var n=qf(),r=V(B(n),2);{let e=I(()=>`--sf-media-radius`in t.overrides);$(r,{label:`Radius`,get value(){return U(k)},min:0,max:2,step:.05,unit:`rem`,help:`--sf-media-radius`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-media-radius`,`${e}rem`),onReset:()=>t.onReset(`--sf-media-radius`),rawDefault:`var(--sf-radius-m)`,get variableOptions(){return of},get currentRaw(){return t.overrides[`--sf-media-radius`]},onRawSet:e=>t.onSet(`--sf-media-radius`,e)})}var i=V(r,2),a=z(i);F(i),H(()=>Z(a,`border-radius: ${U(k)}rem`)),K(e,n)};J(Je,e=>{U(h)&&e(Ye)}),F(He);var Xe=V(He,4),Ze=z(Xe),Qe=V(z(Ze),2),$e=z(Qe,!0);F(Qe),F(Ze);var et=V(Ze,2),tt=e=>{var n=Jf();Y(n,21,()=>o,e=>e.token,(e,n)=>{{let r=I(()=>j(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},get min(){return U(n).min},get max(){return U(n).max},get step(){return U(n).step},get unit(){return U(n).unit},get help(){return U(n).help},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}${U(n).unit}`),onReset:()=>t.onReset(U(n).token),get rawDefault(){return U(n).rawDefault},get variableOptions(){return U(n).variableOptions},get currentRaw(){return t.overrides[U(n).token]},onRawSet:e=>t.onSet(U(n).token,e)})}}),F(n),K(e,n)};J(et,e=>{U(_)&&e(tt)}),F(Xe);var nt=V(Xe,4),rt=z(nt),it=V(z(rt),2),at=z(it,!0);F(it),F(rt);var ot=V(rt,2),st=e=>{var n=Yf();Y(n,21,()=>s,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(n),K(e,n)};J(ot,e=>{U(p)&&e(st)}),F(nt),F(te),H(()=>{Q(M,`aria-expanded`,U(c)),q(ie,U(c)?`▲`:`▼`),Q(N,`aria-expanded`,U(l)),q(le,U(l)?`▲`:`▼`),Q(pe,`aria-expanded`,U(u)),q(he,U(u)?`▲`:`▼`),Q(ye,`aria-expanded`,U(d)),q(xe,U(d)?`▲`:`▼`),Q(Te,`aria-expanded`,U(f)),q(De,U(f)?`▲`:`▼`),Q(Ae,`aria-expanded`,U(g)),q(Ne,U(g)?`▲`:`▼`),Q(Le,`aria-expanded`,U(m)),q(ze,U(m)?`▲`:`▼`),Q(Ge,`aria-expanded`,U(h)),q(qe,U(h)?`▲`:`▼`),Q(Ze,`aria-expanded`,U(_)),q($e,U(_)?`▲`:`▼`),Q(rt,`aria-expanded`,U(p)),q(at,U(p)?`▲`:`▼`)}),W(`click`,M,()=>{R(c,!U(c))}),W(`click`,N,()=>{R(l,!U(l))}),W(`click`,pe,()=>{R(u,!U(u))}),W(`click`,ye,()=>{R(d,!U(d))}),W(`click`,Te,()=>{R(f,!U(f))}),W(`click`,Ae,()=>{R(g,!U(g))}),W(`click`,Le,()=>{R(m,!U(m))}),W(`click`,Ge,()=>{R(h,!U(h))}),W(`click`,Ze,()=>{R(_,!U(_))}),W(`click`,rt,()=>{R(p,!U(p))}),K(e,te),We()}Br([`click`]);var Qf=G(`
`),$f=G(`
Shadow color

Warm, cool or brand-tinted shadows. Default uses neutral hue.

`),ep=G(`
Glow color

Which brand color radiates the glow. Defaults to primary.

`),tp=G(`

Glow disabled.

`),np=G(`
Shadow glow
Ambient glow on elevated surfaces
`,1),rp=G(`
`),ip=G(`
`);function ap(e,t){Ue(t,!0);let n=[`xs`,`s`,`m`,`l`,`xl`,`2xl`],r=Kl.shadows??[],i=I(()=>(()=>{let e=parseFloat(t.overrides[`--sf-shadow-lightness`]??`0.15`);return isFinite(e)?e:.15})()),a=I(()=>t.overrides[`--sf-shadow-color`]??``),o=I(()=>t.overrides[`--sf-shadow-glow-color`]??``),s=I(()=>t.overrides[`--sf-shadow-glow`]===`none`),c=L(!1),l=L(!1),u=L(!1);var d=ip(),f=z(d);Y(f,22,()=>n,e=>e,(e,t,n)=>{var r=Qf(),i=z(r),a=V(i,2),o=z(a,!0);F(a),F(r),H(()=>{Z(i,`width: ${40+U(n)*4}px; height: ${40+U(n)*4}px; box-shadow: var(--sf-shadow-${t})`),q(o,t)}),K(e,r)}),F(f);var p=V(f,4);{let e=I(()=>`--sf-shadow-lightness`in t.overrides);$(p,{label:`Shadow lightness`,get value(){return U(i)},min:0,max:.5,step:.01,help:`--sf-shadow-lightness — OKLCH lightness of the shadow color. Lower = darker, more visible shadows.`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-shadow-lightness`,String(e)),onReset:()=>t.onReset(`--sf-shadow-lightness`)})}var m=V(p,4),h=z(m),g=V(z(h),2),_=z(g,!0);F(g),F(h);var v=V(h,2),y=e=>{var n=$f(),r=V(z(n),2);{let e=I(()=>`--sf-shadow-color`in t.overrides);ku(r,{token:`--sf-shadow-color`,get value(){return U(a)},placeholder:`auto (neutral hue)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-shadow-color`,e),onReset:()=>t.onReset(`--sf-shadow-color`)})}Me(2),F(n),K(e,n)};J(v,e=>{U(c)&&e(y)}),F(m);var b=V(m,4),x=z(b),S=V(z(x),2),C=z(S,!0);F(S),F(x);var w=V(x,2),T=e=>{var n=np(),r=B(n),i=V(z(r),2),a=z(i);F(i),F(r);var c=V(r,2),l=e=>{var n=ep(),r=V(z(n),2);{let e=I(()=>`--sf-shadow-glow-color`in t.overrides);ku(r,{token:`--sf-shadow-glow-color`,get value(){return U(o)},placeholder:`default (primary color)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-shadow-glow-color`,e),onReset:()=>t.onReset(`--sf-shadow-glow-color`)})}Me(2),F(n),K(e,n)};J(c,e=>{U(s)||e(l)});var u=V(c,2),d=z(u);F(u);var f=V(u,2),p=e=>{K(e,tp())};J(f,e=>{U(s)&&e(p)}),H(()=>{Q(i,`aria-label`,U(s)?`Enable shadow glow`:`Disable shadow glow`),X(i,1,`w-9 h-5 rounded-full transition-colors relative cursor-pointer ${U(s)?`bg-black/10 dark:bg-white/10`:`bg-indigo-600`}`),X(a,1,`absolute top-0.5 w-4 h-4 bg-white rounded-full shadow transition-transform ${U(s)?`translate-x-0.5`:`translate-x-4`}`),Z(d,`box-shadow: ${U(s)?`none`:`var(--sf-shadow-glow)`}`)}),W(`click`,i,()=>{U(s)?t.onReset(`--sf-shadow-glow`):t.onSet(`--sf-shadow-glow`,`none`)}),K(e,n)};J(w,e=>{U(l)&&e(T)}),F(b);var E=V(b,4),D=z(E),O=V(z(D),2),k=z(O,!0);F(O),F(D);var A=V(D,2),ee=e=>{var n=rp();Y(n,21,()=>r,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(n),K(e,n)};J(A,e=>{U(u)&&e(ee)}),F(E),F(d),H(()=>{Q(h,`aria-expanded`,U(c)),q(_,U(c)?`▲`:`▼`),Q(x,`aria-expanded`,U(l)),q(C,U(l)?`▲`:`▼`),Q(D,`aria-expanded`,U(u)),q(k,U(u)?`▲`:`▼`)}),W(`click`,h,()=>{R(c,!U(c))}),W(`click`,x,()=>{R(l,!U(l))}),W(`click`,D,()=>{R(u,!U(u))}),K(e,d),We()}Br([`click`]);var op=G(`

Motion is disabled — duration & easing have no effect while scale is 0.

`),sp=G(``),cp=G(`(No effect while motion is disabled.)`),lp=G(`
`),up=G(`

Named duration tokens. Drag to set an absolute ms value, overriding the global scale.

`,1),dp=G(``),fp=G(`
`),pp=G(`

Edit the named easing tokens. Accepts any CSS timing function — cubic-bezier(…) or linear(…). Use “Live preview” above to feel a curve.

`,1),mp=G(``),hp=G(`
`),gp=G(`

One slider sets all five stagger delays (delay-1 through delay-5 are multiples of this base).

Stagger base
`,1),_p=G(``),vp=G(`
`),yp=G(`

Default animation-range for scroll-driven animations using the .sf-entrance--* / .sf-exit--* macros.

`,1),bp=G(`
Disable motion
Respects prefers-reduced-motion
Live preview
`);function xp(e,t){Ue(t,!0);let n=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`),r=[{label:`Instant`,token:`--sf-duration-instant`,base:100,max:300},{label:`Fast`,token:`--sf-duration-fast`,base:150,max:500},{label:`Normal`,token:`--sf-duration-normal`,base:250,max:800},{label:`Slow`,token:`--sf-duration-slow`,base:400,max:1200},{label:`Slower`,token:`--sf-duration-slower`,base:600,max:2e3}],i=[{label:`Linear`,token:`--sf-ease-linear`,value:`linear`,preview:`M0,40 L40,0`},{label:`Ease out`,token:`--sf-ease-out`,value:`cubic-bezier(0.25, 0, 0.15, 1)`,preview:`M0,40 C8,40 28,0 40,0`},{label:`Ease in`,token:`--sf-ease-in`,value:`cubic-bezier(0.5, 0, 0.75, 0.25)`,preview:`M0,40 C12,40 32,32 40,0`},{label:`Ease in-out`,token:`--sf-ease-in-out`,value:`cubic-bezier(0.4, 0, 0.2, 1)`,preview:`M0,40 C8,40 32,0 40,0`},{label:`Spring`,token:`--sf-ease-spring`,value:`linear(0, 0.5, 1.1, 0.95, 1.02, 1)`,preview:`M0,40 C10,20 20,-4 28,-2 S38,2 40,0`},{label:`Bounce`,token:`--sf-ease-bounce`,value:`linear(0, 0.35 18%, 1 32%, 0.86 42%, 1.02 56%, 0.98 72%, 1)`,preview:`M0,40 L12,16 L20,0 L26,6 L32,-1 L36,1 L40,0`},{label:`Elastic`,token:`--sf-ease-elastic`,value:`linear(0, 0.3, 1.2, 0.9, 1.05, 1)`,preview:`M0,40 C8,40 16,-10 24,-2 S36,2 40,0`},{label:`Overshoot`,token:`--sf-ease-overshoot`,value:`linear(0, 0.6 30%, 1.08 55%, 0.98 75%, 1)`,preview:`M0,40 C8,40 20,-10 40,0`}],a=[`--sf-animation-delay-1`,`--sf-animation-delay-2`,`--sf-animation-delay-3`,`--sf-animation-delay-4`,`--sf-animation-delay-5`],o=Kl.motion??[],s=I(()=>(()=>{let e=parseFloat(t.overrides[`--sf-motion-scale`]??`1`);return isFinite(e)?e:1})()),c=I(()=>t.overrides[`--sf-motion-scale`]===`0`),l=I(()=>(()=>{let e=parseFloat(t.overrides[`--sf-theme-transition-duration`]?.replace(`ms`,``)??String(300*U(s)));return isFinite(e)?e:Math.round(300*U(s))})()),u=I(()=>{let e=t.overrides[a[0]];return e?parseFloat(e.replace(`ms`,``)):75*U(s)}),d=L(!1),f=L(0),p=L(`--sf-ease-out`),m=L(`--sf-duration-normal`),h=L(!1),g=L(!1),_=L(!1),v=L(!1);function y(e,n){let r=t.overrides[e];if(r){let e=parseFloat(r);if(isFinite(e))return e}return Math.round(n*U(s))}function b(e){return t.overrides[e]??i.find(t=>t.token===e)?.value??`ease`}function x(){if(U(d))return;let e=r.find(e=>e.token===U(m))?.base??250,t=y(U(m),e);R(d,!0),R(f,180),setTimeout(()=>{R(f,0),setTimeout(()=>{R(d,!1)},t)},t)}function S(e){let n={};for(let t=1;t<=5;t++)n[`--sf-animation-delay-${t}`]=`${Math.round(e*t)}ms`;t.onBulkChange(n)}function C(){let e={};for(let t=1;t<=5;t++)e[`--sf-animation-delay-${t}`]=null;t.onBulkChange(e)}var w=bp(),T=z(w),E=V(z(T),2),D=z(E);F(E),F(T);var O=V(T,2),k=e=>{K(e,op())};J(O,e=>{U(c)&&e(k)});var A=V(O,2),ee=V(z(A),2),j=z(ee),te=z(j);F(j);var ne=V(j,2),M=z(ne);Y(M,21,()=>i,e=>e.token,(e,t)=>{var r=sp(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).token)&&(r.value=(r.__value=U(t).token)??``)}),K(e,r)}),F(M);var re;Di(M);var ie=V(M,2);Y(ie,21,()=>r,e=>e.token,(e,t)=>{var r=sp(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).token)&&(r.value=(r.__value=U(t).token)??``)}),K(e,r)}),F(ie);var ae;Di(ie);var oe=V(ie,2),se=z(oe,!0);F(oe),F(ne),F(ee),F(A);var N=V(A,4),ce=z(N),le=V(z(ce),2),ue=z(le,!0);F(le),F(ce);var de=V(ce,2),fe=e=>{var n=up(),i=B(n),a=V(z(i)),o=e=>{K(e,cp())};J(a,e=>{U(c)&&e(o)}),F(i);var s=V(i,2);Y(s,17,()=>r,e=>e.token,(e,n)=>{let r=I(()=>y(U(n).token,U(n).base));{let i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:0,get max(){return U(n).max},step:10,unit:`ms`,get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}ms`),onReset:()=>t.onReset(U(n).token)})}});var l=V(s,2);Y(l,21,()=>r,e=>e.label,(e,t)=>{let n=I(()=>y(U(t).token,U(t).base));var r=lp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2),s=z(o);F(o);var c=V(o,2),l=z(c);F(c),F(r),H(e=>{q(a,U(t).label),Z(s,e),q(l,`${U(n)??``}ms`)},[()=>`width: ${Math.min(U(n)/1200*100,100)}%`]),K(e,r)}),F(l),K(e,n)};J(de,e=>{U(h)&&e(fe)}),F(N);var pe=V(N,4),me=z(pe),he=V(z(me),2),ge=z(he,!0);F(he),F(me);var _e=V(me,2),ve=e=>{var n=pp(),r=V(B(n),2);Y(r,21,()=>i,e=>e.token,(e,n)=>{let r=I(()=>U(n).token in t.overrides);var i=fp(),a=z(i),o=z(a),s=z(o);F(o);var c=V(o,2),l=z(c),u=z(l),d=z(u,!0);F(u);var f=V(u,2),m=z(f),h=V(m,2),g=e=>{var r=dp();W(`click`,r,()=>t.onReset(U(n).token)),K(e,r)};J(h,e=>{U(r)&&e(g)}),F(f),F(l);var _=V(l,2);zi(_),F(c),F(a),F(i),H(()=>{X(i,1,`p-2.5 rounded-xl border transition-all ${U(r)?`bg-indigo-500/10 border-indigo-500/30`:`border-black/8 dark:border-white/8 bg-black/3 dark:bg-white/3`}`),Q(s,`d`,U(n).preview),q(d,U(n).label),Bi(_,t.overrides[U(n).token]??``),Q(_,`placeholder`,U(n).value)}),W(`click`,m,()=>{R(p,U(n).token,!0),x()}),W(`input`,_,e=>{let r=e.target.value.trim();r?t.onSet(U(n).token,r):t.onReset(U(n).token)}),K(e,i)}),F(r),K(e,n)};J(_e,e=>{U(g)&&e(ve)}),F(pe);var ye=V(pe,4),be=z(ye),xe=V(z(be),2),Se=z(xe,!0);F(xe),F(be);var Ce=V(be,2),we=e=>{var n=gp(),r=V(B(n),2),i=z(r),o=V(z(i),2),s=e=>{var t=mp();W(`click`,t,C),K(e,t)},c=I(()=>a.some(e=>e in t.overrides));J(o,e=>{U(c)&&e(s)}),F(i);var l=V(i,2);{let e=I(()=>Math.round(U(u))),n=I(()=>a.some(e=>e in t.overrides));$(l,{label:``,get value(){return U(e)},min:0,max:200,step:5,unit:`ms`,help:`Base unit for --sf-animation-delay-1 through -5`,get overridden(){return U(n)},onChange:e=>S(e),onReset:C})}F(r);var d=V(r,2);Y(d,20,()=>[1,2,3,4,5],e=>e,(e,t)=>{let n=I(()=>Math.round(U(u)*t));var r=hp(),i=z(r),a=z(i);F(i);var o=V(i,2),s=z(o);F(o);var c=V(o,2),l=z(c);F(c),F(r),H(e=>{q(a,`–${t??``}`),Z(s,e),q(l,`${U(n)??``}ms`)},[()=>`width: ${Math.min(U(n)/600*100,100)}%`]),K(e,r)}),F(d),K(e,n)};J(Ce,e=>{U(_)&&e(we)}),F(ye);var Te=V(ye,4),Ee=z(Te),De=V(z(Ee),2),P=z(De,!0);F(De),F(Ee);var Oe=V(Ee,2),ke=e=>{var n=yp(),r=B(n);Y(r,21,()=>o,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(r);var i=V(r,2);{let e=I(()=>`--sf-theme-transition-duration`in t.overrides);$(i,{label:`Theme switch speed`,get value(){return U(l)},min:0,max:600,step:10,unit:`ms`,help:`--sf-theme-transition-duration — dark/light color-scheme switch animation speed`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-theme-transition-duration`,`${e}ms`),onReset:()=>t.onReset(`--sf-theme-transition-duration`)})}var a=V(i,2);Y(V(z(a),2),16,()=>[{label:`Entry start`,token:`--sf-scroll-timeline-range-start`,placeholder:`entry 0%`},{label:`Entry end`,token:`--sf-scroll-timeline-range-end`,placeholder:`cover 30%`},{label:`Exit start`,token:`--sf-scroll-timeline-range-exit-start`,placeholder:`cover 70%`},{label:`Exit end`,token:`--sf-scroll-timeline-range-exit-end`,placeholder:`exit 100%`}],e=>e.token,(e,n)=>{var r=vp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=_p();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.placeholder)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(a),K(e,n)};J(Oe,e=>{U(v)&&e(ke)}),F(Te),F(w),H(e=>{Q(E,`title`,U(c)?`Enable motion`:`Disable motion`),X(E,1,`w-9 h-5 rounded-full transition-colors relative cursor-pointer ${U(c)?`bg-indigo-600`:`bg-black/10 dark:bg-white/10`}`),X(D,1,`absolute top-0.5 w-4 h-4 bg-white rounded-full shadow transition-transform ${U(c)?`translate-x-4`:`translate-x-0.5`}`),Z(te,e),re!==(re=U(p))&&(M.value=(M.__value=U(p))??``,Ei(M,U(p))),ae!==(ae=U(m))&&(ie.value=(ie.__value=U(m))??``,Ei(ie,U(m))),oe.disabled=U(d),q(se,U(d)?`…`:`▶ Play`),Q(ce,`aria-expanded`,U(h)),q(ue,U(h)?`▲`:`▼`),Q(me,`aria-expanded`,U(g)),q(ge,U(g)?`▲`:`▼`),Q(be,`aria-expanded`,U(_)),q(Se,U(_)?`▲`:`▼`),Q(Ee,`aria-expanded`,U(v)),q(P,U(v)?`▲`:`▼`)},[()=>`transform: translateX(${U(f)}px); transition: transform ${y(U(m),r.find(e=>e.token===U(m))?.base??250)}ms ${b(U(p))}`]),W(`click`,E,()=>{U(c)?t.onReset(`--sf-motion-scale`):t.onSet(`--sf-motion-scale`,`0`)}),W(`change`,M,e=>{R(p,e.target.value,!0)}),W(`change`,ie,e=>{R(m,e.target.value,!0)}),W(`click`,oe,x),W(`click`,ce,()=>{R(h,!U(h))}),W(`click`,me,()=>{R(g,!U(g))}),W(`click`,be,()=>{R(_,!U(_))}),W(`click`,Ee,()=>{R(v,!U(v))}),K(e,w),We()}Br([`click`,`change`,`input`]);var Sp=G(`
`),Cp=G(`
`,1),wp=G(`
`),Tp=G(`
`,1),Ep=G(``),Dp=G(`

Gradient overlay for hero images and media content. Used by the .sf-scrim macro.

Color
Direction
Scrim preview
`,1),Op=G(`
`),kp=G(`
Scrollbar preview
`,1),Ap=G(``),jp=G(`
`),Mp=G(`

Controls text legibility over images. Applied via text-shadow: var(--sf-text-shadow-m). + controls, or edit the raw value for full control.

`,1),ud=G(`

--sf-color-scheme — sets the CSS color-scheme property on the root, controlling browser UI (scrollbars, inputs) and default background.

`,1),dd=G(`
`),fd=G(`

Direct color overrides for tokens the framework auto-derives. Use for edge cases.

`,1),pd=G(`
Semantic colors

Live preview — every semantic role on its on-color text, shown in light and dark. Resolved from the canvas, updates as you edit.

All tokens tab — override individual color steps (50–950), semantic aliases, or surface tokens directly.

`);function md(e,t){Ue(t,!0);function n(e,t){return dl.value,_l(e)||t}function r(e,t){dl.value;let n=Sl(e);return n&&n!==`none`?n:t}function i(e,t,n){return dl.value,yl(e,t)||n}let a=[{name:`--sf-gradient-primary`,label:`Primary`,group:`brand`,kind:`angle`,space:`oklch`,angle:135,dir:`right`,stop1:`var(--sf-color-primary)`,stop2:`oklch(from var(--sf-color-primary) calc(l - 0.08) c h)`,formula:`linear-gradient(in oklch 135deg, var(--sf-color-primary), oklch(from var(--sf-color-primary) calc(l - 0.08) c h))`},{name:`--sf-gradient-secondary`,label:`Secondary`,group:`brand`,kind:`angle`,space:`oklch`,angle:135,dir:`right`,stop1:`var(--sf-color-secondary)`,stop2:`oklch(from var(--sf-color-secondary) calc(l - 0.08) c h)`,formula:`linear-gradient(in oklch 135deg, var(--sf-color-secondary), oklch(from var(--sf-color-secondary) calc(l - 0.08) c h))`},{name:`--sf-gradient-tertiary`,label:`Tertiary`,group:`brand`,kind:`angle`,space:`oklch`,angle:135,dir:`right`,stop1:`var(--sf-color-tertiary)`,stop2:`oklch(from var(--sf-color-tertiary) calc(l - 0.08) c h)`,formula:`linear-gradient(in oklch 135deg, var(--sf-color-tertiary), oklch(from var(--sf-color-tertiary) calc(l - 0.08) c h))`},{name:`--sf-gradient-brand`,label:`Brand`,group:`brand`,kind:`angle`,space:`oklch`,angle:135,dir:`right`,stop1:`var(--sf-color-primary)`,stop2:`oklch(from var(--sf-color-primary) l c calc(h + 30))`,formula:`linear-gradient(in oklch 135deg, var(--sf-color-primary), oklch(from var(--sf-color-primary) l c calc(h + 30)))`},{name:`--sf-gradient-surface`,label:`Surface`,group:`brand`,kind:`angle`,space:`oklab`,angle:180,dir:`bottom`,stop1:`var(--sf-color-surface)`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklab 180deg, var(--sf-color-surface), var(--sf-color-bg))`},{name:`--sf-gradient-fade--r`,label:`Fade →`,group:`fade`,kind:`dir`,space:`oklch`,angle:90,dir:`right`,stop1:`transparent`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklch to right, transparent, var(--sf-color-bg))`},{name:`--sf-gradient-fade--l`,label:`Fade ←`,group:`fade`,kind:`dir`,space:`oklch`,angle:270,dir:`left`,stop1:`transparent`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklch to left, transparent, var(--sf-color-bg))`},{name:`--sf-gradient-fade--t`,label:`Fade ↑`,group:`fade`,kind:`dir`,space:`oklch`,angle:0,dir:`top`,stop1:`transparent`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklch to top, transparent, var(--sf-color-bg))`},{name:`--sf-gradient-fade--b`,label:`Fade ↓`,group:`fade`,kind:`dir`,space:`oklch`,angle:180,dir:`bottom`,stop1:`transparent`,stop2:`var(--sf-color-bg)`,formula:`linear-gradient(in oklch to bottom, transparent, var(--sf-color-bg))`}],o=[{key:`primary`,label:`Primary`},{key:`secondary`,label:`Secondary`},{key:`tertiary`,label:`Tertiary`},{key:`action`,label:`Action`}],s=[{name:`--sf-color-primary-source-light`,label:`Primary`,side:`light`,default:`oklch(0.47 0.27 264)`,colorKey:`primary`},{name:`--sf-color-primary-source-dark`,label:`Primary`,side:`dark`,default:`oklch(0.715 0.243 264)`,colorKey:`primary`},{name:`--sf-color-secondary-source-light`,label:`Secondary`,side:`light`,default:`oklch(0.22 0.04 264)`,colorKey:`secondary`},{name:`--sf-color-secondary-source-dark`,label:`Secondary`,side:`dark`,default:`oklch(0.84 0.036 264)`,colorKey:`secondary`},{name:`--sf-color-tertiary-source-light`,label:`Tertiary`,side:`light`,default:`oklch(0.42 0.22 295)`,colorKey:`tertiary`},{name:`--sf-color-tertiary-source-dark`,label:`Tertiary`,side:`dark`,default:`oklch(0.74 0.198 295)`,colorKey:`tertiary`},{name:`--sf-color-action-source-light`,label:`Action`,side:`light`,default:`oklch(0.50 0.22 235)`,colorKey:`action`},{name:`--sf-color-action-source-dark`,label:`Action`,side:`dark`,default:`oklch(0.70 0.198 235)`,colorKey:`action`},{name:`--sf-color-neutral-source-light`,label:`Neutral`,side:`light`,default:`oklch(0.52 0.025 260)`,colorKey:`neutral`},{name:`--sf-color-neutral-source-dark`,label:`Neutral`,side:`dark`,default:`oklch(0.69 0.0225 260)`,colorKey:`neutral`},{name:`--sf-color-base-source-light`,label:`Base`,side:`light`,default:`oklch(0.96 0.006 250)`,colorKey:`base`},{name:`--sf-color-base-source-dark`,label:`Base`,side:`dark`,default:`oklch(0.22 0.003 250)`,colorKey:`base`}],c=[{name:`--sf-color-success-source-light`,label:`Success`,side:`light`,default:`oklch(0.50 0.16 145)`,colorKey:`success`},{name:`--sf-color-success-source-dark`,label:`Success`,side:`dark`,default:`oklch(0.70 0.144 145)`,colorKey:`success`},{name:`--sf-color-warning-source-light`,label:`Warning`,side:`light`,default:`oklch(0.75 0.17 80)`,colorKey:`warning`},{name:`--sf-color-warning-source-dark`,label:`Warning`,side:`dark`,default:`oklch(0.65 0.153 80)`,colorKey:`warning`},{name:`--sf-color-info-source-light`,label:`Info`,side:`light`,default:`oklch(0.48 0.18 235)`,colorKey:`info`},{name:`--sf-color-info-source-dark`,label:`Info`,side:`dark`,default:`oklch(0.71 0.162 235)`,colorKey:`info`},{name:`--sf-color-danger-source-light`,label:`Danger`,side:`light`,default:`oklch(0.48 0.22 12)`,colorKey:`danger`},{name:`--sf-color-danger-source-dark`,label:`Danger`,side:`dark`,default:`oklch(0.73 0.198 12)`,colorKey:`danger`}],l=[{name:`--sf-palette-mix-50`,label:`50`,step:`tint`,default:4},{name:`--sf-palette-mix-100`,label:`100`,step:`tint`,default:8},{name:`--sf-palette-mix-200`,label:`200`,step:`tint`,default:20},{name:`--sf-palette-mix-300`,label:`300`,step:`tint`,default:40},{name:`--sf-palette-mix-400`,label:`400`,step:`tint`,default:65},{name:`--sf-palette-mix-600`,label:`600`,step:`shade`,default:82},{name:`--sf-palette-mix-700`,label:`700`,step:`shade`,default:62},{name:`--sf-palette-mix-800`,label:`800`,step:`shade`,default:38},{name:`--sf-palette-mix-900`,label:`900`,step:`shade`,default:18},{name:`--sf-palette-mix-950`,label:`950`,step:`shade`,default:8}],u=[{label:`Softer`,desc:`Low contrast palette`,patch:{"--sf-palette-mix-50":`3%`,"--sf-palette-mix-100":`6%`,"--sf-palette-mix-200":`14%`,"--sf-palette-mix-300":`30%`,"--sf-palette-mix-400":`55%`,"--sf-palette-mix-600":`72%`,"--sf-palette-mix-700":`52%`,"--sf-palette-mix-800":`28%`,"--sf-palette-mix-900":`12%`,"--sf-palette-mix-950":`5%`}},{label:`Default`,desc:`Balanced contrast`,patch:Object.fromEntries(l.map(e=>[e.name,null]))},{label:`Punchy`,desc:`High contrast palette`,patch:{"--sf-palette-mix-50":`6%`,"--sf-palette-mix-100":`12%`,"--sf-palette-mix-200":`28%`,"--sf-palette-mix-300":`52%`,"--sf-palette-mix-400":`78%`,"--sf-palette-mix-600":`90%`,"--sf-palette-mix-700":`72%`,"--sf-palette-mix-800":`50%`,"--sf-palette-mix-900":`26%`,"--sf-palette-mix-950":`12%`}}],d=[{name:`--sf-color-link`,label:`Link`},{name:`--sf-color-link--visited`,label:`Link visited`},{name:`--sf-color-mark-bg`,label:`Mark background`},{name:`--sf-color-mark-text`,label:`Mark text`},{name:`--sf-color-code-bg`,label:`Code background`},{name:`--sf-color-code-text`,label:`Code text`},{name:`--sf-color-overlay`,label:`Overlay`},{name:`--sf-color-black`,label:`Black`},{name:`--sf-color-white`,label:`White`},{name:`--sf-color-dim`,label:`Dim (translucent black)`}],f=[`50`,`100`,`200`,`300`,`400`,`500`,`600`,`700`,`800`,`900`,`950`],p=[`primary`,`secondary`,`tertiary`,`action`,`neutral`],m={50:.97,100:.94,200:.88,300:.78,400:.65,500:.5,600:.37,700:.27,800:.17,900:.11,950:.06},g=[...p,`base`],_=[{label:`Base`,expr:e=>`var(--sf-color-${e})`},{label:`Subtle`,expr:e=>`var(--sf-color-${e}-subtle)`},{label:`Muted`,expr:e=>`var(--sf-color-${e}-muted)`},{label:`Strong`,expr:e=>`var(--sf-color-${e}-strong)`}],v=[...s,...c],y=[{heading:`Brand`,items:[{name:`--sf-color-primary`,label:`Primary`,fg:`--sf-color-text--on-primary`},{name:`--sf-color-secondary`,label:`Secondary`,fg:`--sf-color-text--on-secondary`},{name:`--sf-color-tertiary`,label:`Tertiary`,fg:`--sf-color-text--on-tertiary`},{name:`--sf-color-action`,label:`Action`,fg:`--sf-color-text--on-action`},{name:`--sf-color-neutral`,label:`Neutral`,fg:`--sf-color-text--on-neutral`}]},{heading:`Status`,items:[{name:`--sf-color-success`,label:`Success`,fg:`--sf-color-text--on-success`},{name:`--sf-color-warning`,label:`Warning`,fg:`--sf-color-text--on-warning`},{name:`--sf-color-info`,label:`Info`,fg:`--sf-color-text--on-info`},{name:`--sf-color-danger`,label:`Danger`,fg:`--sf-color-text--on-danger`}]},{heading:`Surfaces & text`,items:[{name:`--sf-color-bg`,label:`Bg`,fg:`--sf-color-text`},{name:`--sf-color-surface`,label:`Surface`,fg:`--sf-color-text`},{name:`--sf-color-raised`,label:`Raised`,fg:`--sf-color-text`},{name:`--sf-color-inset`,label:`Inset`,fg:`--sf-color-text`},{name:`--sf-color-inverse`,label:`Inverse`,fg:`--sf-color-text--on-inverse`}]}],b=(Kl.colors??[]).filter(e=>e.name===`--sf-contrast-bias`||e.name===`--sf-contrast-threshold`),x=(Kl.colors??[]).filter(e=>e.name===`--sf-focus-ring-width`),S=L(!1),C=L(!1),w=L(!1),T=L(!1),E=L(!1),D=L(!1),O=L(!1),k=L(!1),A=L(`light`),ee=nn({}),te=I(()=>parseFloat(t.overrides[`--sf-lumlocker`]??`0.65`));function j(e){let t=e.match(/^linear-gradient\(\s*in\s+(\S+)\s+(to\s+\w+|\d+deg)\s*,(.+)\)$/i);if(!t)return null;let n=t[1],r=t[2].trim(),i=r.startsWith(`to `),a=i?r.slice(3).trim():`right`,o=i?0:parseInt(r),s=0,c=0,l=[],u=t[3];for(let e=0;ee.name===r)?.default??``;return i?`oklch(from ${i} ${U(te)} c h)`:``}let oe=L(nn(new Set(v.filter(e=>e.side===`light`&&!((v.find(t=>t.colorKey===e.colorKey&&t.side===`dark`)?.name??``)in t.overrides)).map(e=>e.colorKey)))),se=I(()=>{let e={};for(let n of t.tokens)v.some(e=>e.name===n.name)&&(e[n.name]=n);return e});function N(e){return e?t.overrides[e.name]??U(se)[e.name]?.value??e.default:``}function ce(e){return v.find(t=>t.name===e)}let le=I(()=>u.find(e=>Object.entries(e.patch).every(([e,n])=>n===null?!(e in t.overrides):t.overrides[e]===n)));function ue(e){let n=t.overrides[e.name];return n?parseFloat(n):e.default}let de=[];for(let e=0;ee.label===t);if(!a)return e;let o=`color-mix(in oklab, ${e} ${ue(a)}%, ${i?n:r})`;return _l(o)||o}function ye(e,t){dl.value;let n=m[t];if(n===void 0)return e;let r=`oklch(from ${e} ${n} c h)`;return _l(r)||r}function be(e,t,n,r,i){return e===`base`?ye(t,n):ve(t,n,r,i)}function xe(e,n,r){t.onSet(e.name,r)}function Se(e,n,r){let i=!!(n&&n.name in t.overrides);if(U(oe).has(e)&&!i){let i=N(v.find(e=>e.name===r));n&&t.onSet(n.name,pe(i,e)),R(oe,new Set([...U(oe)].filter(t=>t!==e)),!0)}else n&&t.onBulkChange({[n.name]:null}),R(oe,new Set([...U(oe),e]),!0)}let Ce=[{label:`Body text on surface`,fg:`var(--sf-color-text)`,bg:`var(--sf-color-surface)`},{label:`White on primary`,fg:`#ffffff`,bg:`var(--sf-color-primary)`},{label:`Primary on surface`,fg:`var(--sf-color-primary)`,bg:`var(--sf-color-surface)`}];function we(e,t){dl.value;let n=xl(e),r=xl(t);return!n||!r?null:Yl(Jl(...n),Jl(...r))}var Te=pd(),Ee=z(Te),De=V(z(Ee),4);Y(De,21,()=>y,e=>e.heading,(e,t)=>{var n=Pu(),r=z(n),a=z(r,!0);F(r),Y(V(r,2),16,()=>[`light`,`dark`],e=>e,(e,n)=>{var r=Nu(),a=z(r),o=z(a,!0);F(a);var s=V(a,2);Y(s,21,()=>U(t).items,e=>e.name,(e,t)=>{let r=I(()=>i(`var(${U(t).name})`,n,`transparent`)),a=I(()=>i(`var(${U(t).fg})`,n,`currentColor`));var o=Mu(),s=V(z(o),2),c=z(s,!0);F(s),F(o),H(()=>{Z(o,`background:${U(r)}; color:${U(a)}`),Q(o,`title`,`${U(t).name} (${n}) — ${U(r)}`),q(c,U(t).label)}),K(e,o)}),F(s),F(r),H(()=>q(o,n===`light`?`L`:`D`)),K(e,r)}),F(n),H(()=>q(a,U(t).heading)),K(e,n)}),F(De),F(Ee);var P=V(Ee,4),Oe=z(P),ke=V(z(Oe),2),Ae=z(ke,!0);F(ke),F(Oe);var je=V(Oe,2),Ne=e=>{var r=Hu(),i=V(B(r),2);Y(i,21,()=>de,([e,t])=>e.name,(e,r)=>{var i=I(()=>h(U(r),2));let a=()=>U(i)[0],o=()=>U(i)[1],s=I(()=>!!(o()&&o().name in t.overrides)),c=I(()=>U(oe).has(a().colorKey)&&!U(s));var l=Vu(),u=z(l),d=z(u),p=z(d,!0);F(d);var m=V(d,2),_=e=>{var t=Fu(),n=z(t,!0);F(t),H(()=>{X(t,1,`text-[8px] px-1.5 py-0.5 rounded border transition-all cursor-pointer ${U(c)?`border-indigo-500/40 bg-indigo-500/15 text-indigo-700 dark:text-indigo-300`:`border-black/10 dark:border-white/10 text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(n,U(c)?`Auto dark`:`Manual dark`)}),W(`click`,t,()=>Se(a().colorKey,o(),a().name)),K(e,t)};J(m,e=>{o()&&e(_)}),F(u);var v=V(u,2);{let e=I(()=>`${a().label} (light)`),n=I(()=>N(a())),r=I(()=>a().name in t.overrides);au(v,{get label(){return U(e)},get tokenName(){return a().name},get value(){return U(n)},get overridden(){return U(r)},onChange:e=>xe(a(),o(),e),onReset:()=>t.onReset(a().name)})}var y=V(v,2),b=e=>{let t=I(()=>N(a())),n=I(()=>U(c)?pe(U(t),a().colorKey):o()?N(o()):U(t)),r=I(me),i=I(he),s=I(ge),l=I(_e);var u=zu(),d=B(u),p=z(d),m=V(z(p),2);Y(m,20,()=>f,e=>e,(e,n)=>{let i=I(()=>be(a().colorKey,U(t),n,U(r),U(s)));var o=Iu();let c;Au(z(o),()=>`${a().colorKey}-${n}`),F(o),H(()=>{Q(o,`title`,`${a().colorKey}-${n} (light) — ${U(i)}`),c=Z(o,``,c,{background:U(i)})}),K(e,o)}),F(m),F(p);var h=V(p,2),g=V(z(h),2);Y(g,20,()=>f,e=>e,(e,t)=>{let r=I(()=>be(a().colorKey,U(n),t,U(i),U(l)));var o=Lu();let s;Au(z(o),()=>`${a().colorKey}-${t}`),F(o),H(()=>{Q(o,`title`,`${a().colorKey}-${t} (dark) — ${U(r)}`),s=Z(o,``,s,{background:U(r)})}),K(e,o)}),F(g),F(h),F(d);var _=V(d,2),v=e=>{K(e,Ru())};J(_,e=>{a().colorKey===`base`&&e(v)}),K(e,u)},x=I(()=>g.includes(a().colorKey));J(y,e=>{U(x)&&e(b)});var S=V(y,2),C=e=>{{let n=I(()=>`${o().label} (dark mode)`),r=I(()=>N(o())),i=I(()=>o().name in t.overrides);au(e,{get label(){return U(n)},get tokenName(){return o().name},get value(){return U(r)},get overridden(){return U(i)},onChange:e=>t.onSet(o().name,e),onReset:()=>t.onReset(o().name)})}},w=e=>{let t=I(()=>pe(N(a()),a().colorKey));var r=Bu(),i=z(r);let o;var s=V(i);F(r),H(e=>{Q(i,`title`,U(t)),o=Z(i,``,o,e),q(s,` Dark: auto-derived (${U(t)??``})`)},[()=>({background:n(U(t),U(t))})]),K(e,r)};J(S,e=>{o()&&!U(c)?e(C):o()&&U(c)&&e(w,1)}),F(l),H(()=>q(p,a().label)),K(e,l)}),F(i),K(e,r)};J(je,e=>{U(S)&&e(Ne)}),F(P);var Pe=V(P,4),Fe=z(Pe),Ie=V(z(Fe),2),Le=z(Ie,!0);F(Ie),F(Fe);var Re=V(Fe,2),ze=e=>{var r=Wu(),a=V(B(r),2);{let e=I(()=>`--sf-lumlocker`in t.overrides);$(a,{label:`LumLocker lightness (L)`,get value(){return U(te)},min:0,max:1,step:.01,help:`--sf-lumlocker — fixed OKLCH L applied to lockable brand colors under [data-lumlocker]`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-lumlocker`,String(e)),onReset:()=>t.onReset(`--sf-lumlocker`)})}var s=V(a,2);Y(V(z(s),2),17,()=>o,e=>e.key,(e,t)=>{var r=Xr();Y(B(r),16,()=>[`light`,`dark`],e=>e,(e,r)=>{let a=I(()=>i(`var(--sf-color-${U(t).key}-source-${r})`,r,``)),o=I(()=>ae(U(t).key,r));var s=Uu(),c=z(s),l=z(c),u=V(l),d=z(u,!0);F(u),F(c);var f=V(c,2),p=V(f,4);F(s),H(e=>{q(l,`${U(t).label??``} `),q(d,r===`light`?`L`:`D`),Z(f,`background:${U(a)||`var(--sf-color-${U(t).key})`}`),Z(p,e),Q(p,`title`,U(o))},[()=>`background:${n(U(o),U(o))}`]),K(e,s)}),K(e,r)}),F(s);var c=V(s,2),l=z(c,!0);F(c),H(()=>{X(c,1,`w-full py-2 rounded-lg text-[10px] font-bold border transition-all cursor-pointer ${Cl.value?`bg-indigo-600/25 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/10 dark:border-white/10 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(l,Cl.value?`✓ LumLocker active on canvas — click to disable`:`Preview LumLocker on live canvas`)}),W(`click`,c,()=>{Cl.value=!Cl.value}),K(e,r)};J(Re,e=>{U(k)&&e(ze)}),F(Pe);var Be=V(Pe,4),Ve=z(Be),He=V(z(Ve),2),Ge=z(He,!0);F(He),F(Ve);var Ke=V(Ve,2),qe=e=>{var r=Yu(),a=V(B(r),2);Y(a,21,()=>fe,([e,t])=>e.name,(e,r)=>{var a=I(()=>h(U(r),2));let o=()=>U(a)[0],s=()=>U(a)[1],c=I(()=>!!(s()&&s().name in t.overrides)),l=I(()=>U(oe).has(o().colorKey)&&!U(c));var u=Ju(),d=z(u),f=z(d),p=z(f,!0);F(f);var m=V(f,2),g=e=>{var t=Fu(),n=z(t,!0);F(t),H(()=>{X(t,1,`text-[8px] px-1.5 py-0.5 rounded border transition-all cursor-pointer ${U(l)?`border-indigo-500/40 bg-indigo-500/15 text-indigo-700 dark:text-indigo-300`:`border-black/10 dark:border-white/10 text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(n,U(l)?`Auto dark`:`Manual dark`)}),W(`click`,t,()=>Se(o().colorKey,s(),o().name)),K(e,t)};J(m,e=>{s()&&e(g)}),F(d);var v=V(d,2);{let e=I(()=>`${o().label} light`),n=I(()=>N(o())),r=I(()=>o().name in t.overrides);au(v,{get label(){return U(e)},get tokenName(){return o().name},get value(){return U(n)},get overridden(){return U(r)},onChange:e=>t.onSet(o().name,e),onReset:()=>t.onReset(o().name)})}var y=V(v,2),b=e=>{{let n=I(()=>`${s().label} dark`),r=I(()=>N(s())),i=I(()=>s().name in t.overrides);au(e,{get label(){return U(n)},get tokenName(){return s().name},get value(){return U(r)},get overridden(){return U(i)},onChange:e=>t.onSet(s().name,e),onReset:()=>t.onReset(s().name)})}},x=e=>{let t=I(()=>pe(N(o()),o().colorKey));var r=Bu(),i=z(r);let a;var s=V(i);F(r),H(e=>{Q(i,`title`,U(t)),a=Z(i,``,a,e),q(s,` Dark: auto-derived (${U(t)??``})`)},[()=>({background:n(U(t),U(t))})]),K(e,r)};J(y,e=>{s()&&!U(l)?e(b):s()&&U(l)&&e(x,1)});var S=V(y,2),C=z(S),w=V(z(C),2);Y(w,21,()=>_,e=>e.label,(e,t)=>{var n=Gu(),r=z(n,!0);F(n),H(()=>q(r,U(t).label)),K(e,n)}),F(w),F(C),Y(V(C,2),16,()=>[[`L`,`light`],[`D`,`dark`]],([e,t])=>e,(e,t)=>{var n=I(()=>h(t,2));let r=()=>U(n)[0],a=()=>U(n)[1];var s=qu(),c=z(s),l=z(c,!0);F(c);var u=V(c,2);Y(u,21,()=>_,e=>e.label,(e,t)=>{let n=I(()=>i(U(t).expr(o().colorKey),a(),``));var r=Ku();let s;var c=z(r);{let e=I(()=>`${o().colorKey}-${U(t).label.toLowerCase()}`);Au(c,()=>U(e))}F(r),H(e=>{Q(r,`title`,e),s=Z(r,``,s,{background:U(n)})},[()=>`${o().colorKey}-${U(t).label.toLowerCase()} (${a()}) — ${U(n)}`]),K(e,r)}),F(u),F(s),H(()=>q(l,r())),K(e,s)}),F(S),Me(2),F(u),H(()=>q(p,o().label)),K(e,u)}),F(a),K(e,r)};J(Ke,e=>{U(T)&&e(qe)}),F(Be);var Je=V(Be,4),Ye=z(Je),Xe=V(z(Ye),2),Ze=z(Xe,!0);F(Xe),F(Ye);var Qe=V(Ye,2),$e=e=>{var r=Qu(),i=V(B(r),2);Y(i,17,()=>b,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})});var a=V(i,2),o=z(a);Y(o,17,()=>Ce,e=>e.label,(e,t)=>{let r=I(()=>we(U(t).fg,U(t).bg));var i=Xr(),a=B(i),o=e=>{var i=Xu(),a=z(i),o=V(a,2),s=z(o,!0);F(o);var c=V(o,2),l=z(c);F(c);var u=V(c,2),d=z(u,!0);F(u),F(i),H((e,n)=>{Z(a,e),q(s,U(t).label),q(l,`${n??``}:1`),X(u,1,`text-[9px] font-bold px-1.5 py-0.5 rounded ${U(r)>=4.5?`bg-emerald-500/20 text-emerald-700 dark:text-emerald-300`:`bg-amber-500/20 text-amber-700 dark:text-amber-300`}`),q(d,U(r)>=4.5?`AA`:U(r)>=3?`AA-L`:`✗`)},[()=>`background:${n(U(t).bg,U(t).bg)}; color:${n(U(t).fg,U(t).fg)}`,()=>U(r).toFixed(2)]),K(e,i)};J(a,e=>{U(r)!==null&&e(o)}),K(e,i)});var s=V(o,2),c=e=>{var n=Zu();W(`click`,n,()=>t.onSelectDomain?.(`wcag`)),K(e,n)};J(s,e=>{t.onSelectDomain&&e(c)}),F(a),Y(V(a,2),17,()=>x,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),K(e,r)};J(Qe,e=>{U(C)&&e($e)}),F(Je);var et=V(Je,4),tt=z(et),nt=V(z(tt),2),rt=z(nt,!0);F(nt),F(tt);var it=V(tt,2),at=e=>{let n=I(()=>t.overrides[`--sf-color-primary-source-light`]??s.find(e=>e.name===`--sf-color-primary-source-light`)?.default??`oklch(0.47 0.27 264)`),r=I(()=>t.overrides[`--sf-color-primary-source-dark`]),i=I(()=>U(r)??(!U(oe).has(`primary`)||U(r)?s.find(e=>e.name===`--sf-color-primary-source-dark`)?.default??pe(U(n),`primary`):pe(U(n),`primary`))),a=I(()=>U(A)===`light`?U(n):U(i)),o=I(()=>U(A)===`light`?me():he()),c=I(()=>U(A)===`light`?ge():_e()),d=I(()=>U(A)===`light`?me():he()),m=I(()=>U(A)===`light`?ge():_e());var h=rd(),g=V(B(h),2);Y(g,21,()=>u,e=>e.label,(e,n)=>{var r=$u(),i=z(r),a=z(i,!0);F(i);var o=V(i,2),s=z(o,!0);F(o),F(r),H(()=>{X(r,1,`flex flex-col items-center gap-0.5 p-2.5 rounded-xl border transition-all cursor-pointer ${U(le)?.label===U(n).label?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(a,U(n).label),q(s,U(n).desc)}),W(`click`,r,()=>t.onBulkChange(U(n).patch)),K(e,r)}),F(g);var _=V(g,2),v=V(z(_),2);Y(v,21,()=>l.filter(e=>e.step===`tint`),e=>e.name,(e,n)=>{{let r=I(()=>ue(U(n))),i=I(()=>U(n).name in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:0,max:100,step:1,unit:`%`,get overridden(){return U(i)},onChange:e=>t.onSet(U(n).name,`${e}%`),onReset:()=>t.onReset(U(n).name)})}}),F(v),F(_);var y=V(_,2),b=V(z(y),2);Y(b,21,()=>l.filter(e=>e.step===`shade`),e=>e.name,(e,n)=>{{let r=I(()=>ue(U(n))),i=I(()=>U(n).name in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:0,max:100,step:1,unit:`%`,get overridden(){return U(i)},onChange:e=>t.onSet(U(n).name,`${e}%`),onReset:()=>t.onReset(U(n).name)})}}),F(b),F(y);var x=V(y,2),S=z(x),C=V(z(S),2);Y(C,20,()=>[`light`,`dark`],e=>e,(e,t)=>{var n=Fu(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-1.5 py-0.5 rounded text-[8px] font-bold cursor-pointer transition-all ${U(A)===t?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(r,t===`light`?`Light`:`Dark`)}),W(`click`,n,()=>{R(A,t,!0)}),K(e,n)}),F(C),F(S);var w=V(S,2);Y(w,21,()=>l,e=>e.name,(e,t)=>{let n=I(()=>ue(U(t))),r=I(()=>U(t).label),i=I(()=>ve(U(a),U(r),U(o),U(c)));var s=ed(),l=z(s),u=z(l,!0);F(l);var d=V(l,2);Au(z(d),()=>`primary-${U(r)}`),F(d);var f=V(d,2),p=z(f,!0);F(f),F(s),H((e,t,n)=>{q(u,e),Z(d,t),Q(d,`title`,n),q(p,U(r))},[()=>Math.round(U(n)),()=>`background:${U(i)}; height: ${Math.max(U(n)/100*56,6)}px`,()=>`primary-${U(r)} (${U(A)}) · mix ${Math.round(U(n))}%`]),K(e,s)}),F(w),Me(2),F(x);var T=V(x,2),E=z(T),D=V(z(E),2);Y(D,20,()=>[`light`,`dark`],e=>e,(e,t)=>{var n=Fu(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-1.5 py-0.5 rounded text-[8px] font-bold cursor-pointer transition-all ${U(A)===t?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(r,t===`light`?`Light`:`Dark`)}),W(`click`,n,()=>{R(A,t,!0)}),K(e,n)}),F(D),F(E),Y(V(E,2),16,()=>p,e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-color-${n}-source-light`]??s.find(e=>e.name===`--sf-color-${n}-source-light`)?.default??`oklch(0.5 0.15 264)`),i=I(()=>`--sf-color-${n}-source-dark`),a=I(()=>t.overrides[U(i)]??(U(oe).has(n)&&!t.overrides[U(i)]?pe(U(r),n):s.find(e=>e.name===U(i))?.default??pe(U(r),n))),o=I(()=>U(A)===`light`?U(r):U(a));var c=nd(),l=z(c),u=z(l,!0);F(l);var p=V(l,2);Y(p,20,()=>f,e=>e,(e,t)=>{let r=I(()=>ve(U(o),t,U(d),U(m)));var i=td();Au(z(i),()=>`${n}-${t}`),F(i),H(()=>{Z(i,`background:${U(r)}`),Q(i,`title`,`${n}-${t} (${U(A)})`)}),K(e,i)}),F(p),F(c),H(()=>q(u,n)),K(e,c)}),F(T),K(e,h)};J(it,e=>{U(w)&&e(at)}),F(et);var ot=V(et,4),st=z(ot),ct=V(z(st),2),lt=z(ct,!0);F(ct),F(st);var ut=V(st,2),dt=e=>{var n=ld();Y(V(B(n),2),16,()=>[`brand`,`fade`],e=>e,(e,n)=>{var i=cd(),o=B(i),s=z(o,!0);F(o);var c=V(o,2);Y(c,21,()=>a.filter(e=>e.group===n),e=>e.name,(e,n)=>{let i=I(()=>`var(${U(n).name})`),a=I(()=>M(U(n)));var o=sd(),s=z(o),c=V(s,2),l=z(c),u=z(l),d=z(u,!0);F(u);var f=V(u,2),p=e=>{var r=id();W(`click`,r,()=>{delete ee[U(n).name],t.onReset(U(n).name)}),K(e,r)};J(f,e=>{U(n).name in t.overrides&&e(p)}),F(l);var m=V(l,2),h=e=>{var t=ad();Y(V(z(t),2),16,()=>[`top`,`right`,`bottom`,`left`],e=>e,(e,t)=>{var r=Fu(),i=z(r,!0);F(r),H(()=>{X(r,1,`flex-1 py-0.5 rounded text-[9px] border transition-all cursor-pointer capitalize ${U(a).dir===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(i,t)}),W(`click`,r,()=>ie(U(n),`dir`,t)),K(e,r)}),F(t),K(e,t)},g=e=>{var t=od(),r=V(z(t),2);zi(r);var i=V(r,2),o=z(i);F(i),F(t),H(()=>{Bi(r,U(a).angle),q(o,`${U(a).angle??``}°`)}),W(`input`,r,e=>ie(U(n),`angle`,parseInt(e.target.value))),K(e,t)};J(m,e=>{U(n).kind===`dir`&&U(n).group!==`fade`?e(h):U(n).kind!==`dir`&&e(g,1)});var _=V(m,2),v=V(z(_),2);zi(v);var y=V(v,2);zi(y),F(_);var b=V(_,2),x=V(z(b));F(b);var S=V(b,2);zi(S),F(c),F(o),H(e=>{Z(s,e),q(d,U(n).label),Bi(v,U(a).stop1),Bi(y,U(a).stop2),q(x,` ${U(n).formula??``}`),Bi(S,t.overrides[U(n).name]??``)},[()=>`background:${r(U(i),U(i))}`]),W(`change`,v,e=>ie(U(n),`stop1`,e.target.value.trim())),W(`change`,y,e=>ie(U(n),`stop2`,e.target.value.trim())),W(`change`,S,e=>{let r=e.target.value.trim();delete ee[U(n).name],r?t.onSet(U(n).name,r):t.onReset(U(n).name)}),K(e,o)}),F(c),H(()=>q(s,n===`brand`?`Brand & surface`:`Edge fades`)),K(e,i)}),K(e,n)};J(ut,e=>{U(O)&&e(dt)}),F(ot);var ft=V(ot,4),pt=z(ft),mt=V(z(pt),2),ht=z(mt,!0);F(mt),F(pt);var gt=V(pt,2),_t=e=>{var n=ud(),r=V(B(n),2);Y(r,20,()=>[[`light dark`,`light dark (default)`],[`light`,`Light only`],[`dark`,`Dark only`]],([e,t])=>e,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1],o=I(()=>t.overrides[`--sf-color-scheme`]??`light dark`);var s=Fu(),c=z(s,!0);F(s),H(()=>{X(s,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer ${U(o)===i()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,a())}),W(`click`,s,()=>i()===`light dark`?t.onReset(`--sf-color-scheme`):t.onSet(`--sf-color-scheme`,i())),K(e,s)}),F(r),K(e,n)};J(gt,e=>{U(D)&&e(_t)}),F(ft);var vt=V(ft,4),yt=z(vt),bt=V(z(yt),2),xt=z(bt,!0);F(bt),F(yt);var St=V(yt,2),Ct=e=>{var r=fd(),i=V(B(r),2);Y(i,21,()=>d,e=>e.name,(e,r)=>{let i=I(()=>n(`var(${U(r).name})`,``));var a=dd(),o=z(a),s=z(o,!0);F(o);var c=V(o,2);{let e=I(()=>t.overrides[U(r).name]??``),n=I(()=>U(i)?`auto-derived · ${U(i)}`:`auto-derived`),a=I(()=>U(r).name in t.overrides);ku(c,{get token(){return U(r).name},get value(){return U(e)},get placeholder(){return U(n)},get isOverridden(){return U(a)},onSet:e=>t.onSet(U(r).name,e),onReset:()=>t.onReset(U(r).name)})}F(a),H(()=>q(s,U(r).label)),K(e,a)}),F(i),K(e,r)};J(St,e=>{U(E)&&e(Ct)}),F(vt),Me(2),F(Te),H(()=>{Q(Oe,`aria-expanded`,U(S)),q(Ae,U(S)?`▲`:`▼`),Q(Fe,`aria-expanded`,U(k)),q(Le,U(k)?`▲`:`▼`),Q(Ve,`aria-expanded`,U(T)),q(Ge,U(T)?`▲`:`▼`),Q(Ye,`aria-expanded`,U(C)),q(Ze,U(C)?`▲`:`▼`),Q(tt,`aria-expanded`,U(w)),q(rt,U(w)?`▲`:`▼`),Q(st,`aria-expanded`,U(O)),q(lt,U(O)?`▲`:`▼`),Q(pt,`aria-expanded`,U(D)),q(ht,U(D)?`▲`:`▼`),Q(yt,`aria-expanded`,U(E)),q(xt,U(E)?`▲`:`▼`)}),W(`click`,Oe,()=>{R(S,!U(S))}),W(`click`,Fe,()=>{R(k,!U(k))}),W(`click`,Ve,()=>{R(T,!U(T))}),W(`click`,Ye,()=>{R(C,!U(C))}),W(`click`,tt,()=>{R(w,!U(w))}),W(`click`,st,()=>{R(O,!U(O))}),W(`click`,pt,()=>{R(D,!U(D))}),W(`click`,yt,()=>{R(E,!U(E))}),K(e,Te),We()}Br([`click`,`input`,`change`]);var hd=G(`
Aa Aa
`),gd=G(`
min
max
`),_d=G(``),vd=G(``),yd=G(`
`),bd=G(`
Modular scale ratio
`),xd=G(`
`),Sd=G(`
clamp( … )
`);function Cd(e,t){Ue(t,!0);let n=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`),r=ra(t,`unit`,3,`rem`),i=ra(t,`minLabel`,3,`Min`),a=ra(t,`maxLabel`,3,`Max`),o=ra(t,`overridden`,3,!1),s=ra(t,`ratioMin_bound`,3,1.05),c=ra(t,`ratioMax_bound`,3,1.8),l=ra(t,`previewKind`,3,`none`);function u(e){return Math.min(t.max,Math.max(t.min,e))}let d=I(()=>(t.minValue-t.min)/(t.max-t.min)*100),f=I(()=>(t.maxValue-t.min)/(t.max-t.min)*100);function p(e){return Math.min(c(),Math.max(s(),e))}let m=I(()=>t.ratioPresets?.find(e=>t.ratioMin!==void 0&&Math.abs(e.value-t.ratioMin)<.0015)?.value),h=I(()=>t.ratioPresets?.find(e=>t.ratioMax!==void 0&&Math.abs(e.value-t.ratioMax)<.0015)?.value);var g=Sd(),_=z(g),v=z(_),y=z(v,!0);F(v);var b=V(v,2),x=V(z(b)),S=z(x);F(x);var C=V(x,2),w=z(C);F(C),Me(),F(b),F(_);var T=V(_,2),E=V(z(T),2),D=V(E,2);zi(D);var O=V(D,2);zi(O);var k=V(O,2),A=V(k,2);F(T);var ee=V(T,2),te=z(ee),j=z(te),ne=z(j,!0);F(j);var M=V(j,2);zi(M),F(te);var re=V(te,2),ie=z(re),ae=z(ie,!0);F(ie);var oe=V(ie,2);zi(oe),F(re),F(ee);var se=V(ee,2),N=e=>{var n=hd(),r=z(n),o=V(z(r)),s=z(o,!0);F(o),F(r);var c=V(r,2),l=V(z(c)),u=z(l,!0);F(l),F(c),F(n),H((e,t,n,i)=>{Z(r,e),q(s,t),Z(c,n),q(u,i)},[()=>`font-size:${Math.min(t.minValue,2)}rem`,()=>i().toLowerCase(),()=>`font-size:${Math.min(t.maxValue,2.6)}rem`,()=>a().toLowerCase()]),K(e,n)},ce=e=>{var n=gd(),r=z(n),i=V(r,4);Me(2),F(n),H((e,t)=>{Z(r,e),Z(i,t)},[()=>`width:${Math.min(t.minValue*28,120)}px`,()=>`width:${Math.min(t.maxValue*28,200)}px`]),K(e,n)};J(se,e=>{l()===`type`?e(N):l()===`space`&&e(ce,1)});var le=V(se,2),ue=e=>{var r=bd(),o=V(z(r),2);Y(o,21,()=>[{side:i(),value:t.ratioMin,active:U(m),onChange:t.onRatioMinChange},{side:a(),value:t.ratioMax,active:U(h),onChange:t.onRatioMaxChange}],e=>e.side,(e,r)=>{var i=yd(),a=z(i),o=z(a,!0);F(a);var l=V(a,2),u=z(l),d=e=>{var t=_d();t.value=t.__value=``,H(()=>Z(t,`background:${U(n)};`)),K(e,t)};J(u,e=>{U(r).active===void 0&&e(d)}),Y(V(u),17,()=>t.ratioPresets,e=>e.value,(e,t)=>{var r=vd(),i=z(r,!0);F(r);var a={};H(e=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=e)&&(r.value=(r.__value=e)??``)},[()=>String(U(t).value)]),K(e,r)}),F(l);var f;Di(l);var m=V(l,2);zi(m),Q(m,`step`,.001),F(i),H(e=>{q(o,U(r).side),Q(l,`aria-label`,`${U(r).side} modular scale ratio preset`),f!==(f=e)&&(l.value=(l.__value=e)??``,Ei(l,e)),Q(m,`aria-label`,`${U(r).side} modular scale custom ratio`),Q(m,`min`,s()),Q(m,`max`,c()),Bi(m,U(r).value)},[()=>U(r).active===void 0?``:String(U(r).active)]),W(`change`,l,e=>{let t=parseFloat(e.target.value);Number.isFinite(t)&&U(r).onChange?.(p(t))}),W(`change`,m,e=>{let t=parseFloat(e.target.value);Number.isFinite(t)&&U(r).onChange?.(p(t))}),K(e,i)}),F(o),F(r),K(e,r)};J(le,e=>{t.ratioPresets&&e(ue)});var de=V(le,2),fe=e=>{var n=xd(),r=z(n);F(n),W(`click`,r,function(...e){t.onReset?.apply(this,e)}),K(e,n)};J(de,e=>{o()&&t.onReset&&e(fe)}),F(g),H(e=>{X(g,1,`rounded-xl border p-3 ${o()?`bg-indigo-500/8 border-indigo-500/25`:`bg-black/4 dark:bg-white/4 border-black/8 dark:border-white/8`}`,`svelte-iy59wr`),q(y,t.title),q(S,`${t.minValue??``}${r()??``}`),q(w,`${t.maxValue??``}${r()??``}`),Z(E,e),Q(D,`min`,t.min),Q(D,`max`,t.max),Q(D,`step`,t.step),Bi(D,t.minValue),Q(D,`aria-label`,`${t.title} min`),Q(O,`min`,t.min),Q(O,`max`,t.max),Q(O,`step`,t.step),Bi(O,t.maxValue),Q(O,`aria-label`,`${t.title} max`),Z(k,`left: calc(${U(d)}% - 6px)`),Z(A,`left: calc(${U(f)}% - 6px)`),q(ne,i()),Q(M,`min`,t.min),Q(M,`max`,t.max),Q(M,`step`,t.step),Bi(M,t.minValue),q(ae,a()),Q(oe,`min`,t.min),Q(oe,`max`,t.max),Q(oe,`step`,t.step),Bi(oe,t.maxValue)},[()=>`left:${Math.min(U(d),U(f))}%; right:${100-Math.max(U(d),U(f))}%`]),W(`input`,D,e=>t.onMinChange(Math.min(u(parseFloat(e.target.value)),t.maxValue))),W(`input`,O,e=>t.onMaxChange(Math.max(u(parseFloat(e.target.value)),t.minValue))),W(`change`,M,e=>t.onMinChange(u(parseFloat(e.target.value)||t.min))),W(`change`,oe,e=>t.onMaxChange(u(parseFloat(e.target.value)||t.max))),K(e,g),We()}Br([`input`,`change`,`click`]);var wd=G(``),Td=G(``),Ed=G(`
`),Dd=G(`
Google Font
`,1),Od=G(``),kd=G(``),Ad=G(``),jd=G(``),Md=G(`
Tracking
`),Nd=G(`
Max width
`),Pd=G(``),Fd=G(`
The quick brown fox
Size
Line height
Weight
`,1),Id=G(``),Ld=G(`
`),Rd=G(``),zd=G(`
`),Bd=G(`
Emphasis style
External marker
External label
`,1),Vd=G(``),Hd=G(`
`),Ud=G(`

Named weight tokens. Override if your font uses non-standard axis values.

`,1),Wd=G(`
`),Gd=G(`
`,1),Kd=G(`
`),qd=G(`
`),Jd=G(`

Utopia-style fluid scale. Each endpoint has three values — viewport width, + base size, and modular ratio. Sizes interpolate fluidly between mobile and desktop.

Line height scale
Letter-spacing scale

Overriding these propagates to heading sizes that reference them.

`,1),Yd=G(`
Aa
`),Xd=G(`
`),Zd=G(``),Qd=G(`
`),$d=G(`

Per-text-size max-width caps on .sf-text-* elements. Set to none to remove the constraint; use ch units for character-based measures.

`,1),ef=G(`

Advanced OpenType and variable-font axes. Leave as normal unless your font supports these features.

Numeric figures
Optical sizing
Font features
Variation
`,1),tf=G(`
`);function nf(e,t){Ue(t,!0);let n=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`),r=[{label:`Minor Second — 1.067`,value:1.067},{label:`Major Second — 1.125`,value:1.125},{label:`Minor Third — 1.200`,value:1.2},{label:`Major Third — 1.250`,value:1.25},{label:`Perfect Fourth — 1.333`,value:1.333},{label:`Aug. Fourth — 1.414`,value:1.414},{label:`Golden — 1.618`,value:1.618}],i=[{label:`System sans-serif`,value:``},{label:`Geometric (Avenir, Montserrat…)`,value:`var(--sf-font-geometric)`},{label:`Humanist (Seravek, Gill Sans…)`,value:`var(--sf-font-humanist)`},{label:`Slab serif (Rockwell, Roboto Slab…)`,value:`var(--sf-font-slab)`},{label:`Inter`,value:`Inter, system-ui, sans-serif`},{label:`Georgia (serif)`,value:`Georgia, 'Times New Roman', serif`},{label:`Merriweather (serif)`,value:`'Merriweather', Georgia, serif`},{label:`JetBrains Mono`,value:`'JetBrains Mono', 'Fira Code', monospace`}],a=[{label:`Same as body`,value:``},{label:`Geometric (Avenir, Montserrat…)`,value:`var(--sf-font-geometric)`},{label:`Humanist (Seravek, Gill Sans…)`,value:`var(--sf-font-humanist)`},{label:`Slab serif (Rockwell, Roboto Slab…)`,value:`var(--sf-font-slab)`},{label:`Inter`,value:`Inter, system-ui, sans-serif`},{label:`Georgia (serif)`,value:`Georgia, 'Times New Roman', serif`},{label:`Impact / condensed`,value:`Impact, 'Arial Narrow', sans-serif`}],o=[{label:`System mono`,value:`ui-monospace, monospace`},{label:`JetBrains Mono`,value:`'JetBrains Mono', 'Fira Code', monospace`},{label:`Source Code Pro`,value:`'Source Code Pro', 'Courier New', monospace`}],s=`Inter.Roboto.Open Sans.Lato.Montserrat.Poppins.Source Sans 3.Raleway.Nunito.Work Sans.Manrope.DM Sans.Outfit.Plus Jakarta Sans.Geist.Space Grotesk.Figtree.Merriweather.Playfair Display.Lora.Source Serif 4.Roboto Slab.IBM Plex Sans.IBM Plex Mono.JetBrains Mono.Fira Code.Space Mono`.split(`.`),c=[{label:`balance`,value:`balance`},{label:`pretty`,value:`pretty`},{label:`normal`,value:`normal`}],l=[`100`,`200`,`300`,`400`,`500`,`600`,`700`,`800`,`900`],u={"--sf-font-weight-body":`400`,"--sf-font-weight-heading":`600`,"--sf-font-weight-display":`700`,"--sf-font-weight-interactive":`600`},d=[{label:`2xs`,factor:.64},{label:`xs`,factor:.75},{label:`s`,factor:.875},{label:`m`,factor:1},{label:`l`,factor:1.125},{label:`xl`,factor:1.25},{label:`2xl`,factor:1.5},{label:`3xl`,factor:1.875},{label:`4xl`,factor:2.25}],f=[{label:`Tight`,token:`--sf-tracking-tight`,default:-.025},{label:`Normal`,token:`--sf-tracking-normal`,default:0},{label:`Wide`,token:`--sf-tracking-wide`,default:.025},{label:`Wider`,token:`--sf-tracking-wider`,default:.05},{label:`Widest`,token:`--sf-tracking-widest`,default:.1}],p=[{label:`Tight`,token:`--sf-leading-tight`,default:1.1},{label:`Snug`,token:`--sf-leading-snug`,default:1.3},{label:`Normal`,token:`--sf-leading-normal`,default:1.5},{label:`Relaxed`,token:`--sf-leading-relaxed`,default:1.625}],m=[{label:`2xs`,value:`var(--sf-text-2xs)`,approx:.64},{label:`xs`,value:`var(--sf-text-xs)`,approx:.75},{label:`s`,value:`var(--sf-text-s)`,approx:.875},{label:`m`,value:`var(--sf-text-m)`,approx:1},{label:`l`,value:`var(--sf-text-l)`,approx:1.125},{label:`xl`,value:`var(--sf-text-xl)`,approx:1.25},{label:`2xl`,value:`var(--sf-text-2xl)`,approx:1.5},{label:`3xl`,value:`var(--sf-text-3xl)`,approx:1.875},{label:`4xl`,value:`var(--sf-text-4xl)`,approx:2.25},{label:`display-s`,value:`var(--sf-text-display-s)`,approx:2.6},{label:`display-m`,value:`var(--sf-text-display-m)`,approx:3.2},{label:`display-l`,value:`var(--sf-text-display-l)`,approx:3.8}],g=p.map(e=>({label:e.label,value:`var(${e.token})`,num:e.default})),_=f.map(e=>({label:e.label,value:`var(${e.token})`,em:e.default})),v=[{id:`body`,label:`Body`,size:`--sf-body-font-size`,lh:`--sf-body-line-height`,wt:`--sf-body-font-weight`,ls:null,dSize:`var(--sf-text-m)`,dLh:`var(--sf-leading-normal)`,dWt:`400`,dLs:``},{id:`h1`,label:`H1`,size:`--sf-h1-size`,lh:`--sf-h1-line-height`,wt:`--sf-h1-font-weight`,ls:`--sf-h1-letter-spacing`,dSize:`var(--sf-text-4xl)`,dLh:`var(--sf-leading-tight)`,dWt:`600`,dLs:`var(--sf-tracking-tight)`},{id:`h2`,label:`H2`,size:`--sf-h2-size`,lh:`--sf-h2-line-height`,wt:`--sf-h2-font-weight`,ls:`--sf-h2-letter-spacing`,dSize:`var(--sf-text-3xl)`,dLh:`var(--sf-leading-tight)`,dWt:`600`,dLs:`var(--sf-tracking-tight)`},{id:`h3`,label:`H3`,size:`--sf-h3-size`,lh:`--sf-h3-line-height`,wt:`--sf-h3-font-weight`,ls:`--sf-h3-letter-spacing`,dSize:`var(--sf-text-2xl)`,dLh:`var(--sf-leading-snug)`,dWt:`600`,dLs:`var(--sf-tracking-normal)`},{id:`h4`,label:`H4`,size:`--sf-h4-size`,lh:`--sf-h4-line-height`,wt:`--sf-h4-font-weight`,ls:`--sf-h4-letter-spacing`,dSize:`var(--sf-text-xl)`,dLh:`var(--sf-leading-snug)`,dWt:`600`,dLs:`var(--sf-tracking-normal)`},{id:`h5`,label:`H5`,size:`--sf-h5-size`,lh:`--sf-h5-line-height`,wt:`--sf-h5-font-weight`,ls:`--sf-h5-letter-spacing`,dSize:`var(--sf-text-l)`,dLh:`var(--sf-leading-normal)`,dWt:`600`,dLs:`var(--sf-tracking-normal)`},{id:`h6`,label:`H6`,size:`--sf-h6-size`,lh:`--sf-h6-line-height`,wt:`--sf-h6-font-weight`,ls:`--sf-h6-letter-spacing`,dSize:`var(--sf-text-m)`,dLh:`var(--sf-leading-normal)`,dWt:`600`,dLs:`var(--sf-tracking-wide)`}],y=L(`h1`),b=I(()=>v.find(e=>e.id===U(y))),x=Kl.typography??[];function S(e,n){let r=parseFloat(t.overrides[e]??``);return isNaN(r)?n:r}let C=I(()=>S(`--sf-text-ratio-min`,1.25)),w=I(()=>S(`--sf-text-ratio-max`,1.333)),T=I(()=>S(`--sf-text-base-min`,1)),E=I(()=>S(`--sf-text-base-max`,1.25)),D=I(()=>S(`--sf-text-display-base-min`,2.4)),O=I(()=>S(`--sf-text-display-base-max`,3)),k=I(()=>S(`--sf-leading-taper`,0)),A=I(()=>S(`--sf-text-scale`,1)),ee=I(()=>S(`--sf-fluid-min-vw`,22.5)),te=I(()=>S(`--sf-fluid-max-vw`,90)),j=L(!1),ne=L(!1),M=L(!1),re=L(!1),ie=L(!1),ae=L(!1),oe=L(!1),se=L(!1),N=L(!1),ce=L(!1),le=I(()=>t.overrides[`--sf-font-body`]??``),ue=I(()=>t.overrides[`--sf-font-heading`]??``),de=I(()=>t.overrides[`--sf-font-mono`]??`ui-monospace, monospace`),fe=L(``),pe=L(`body`);function me(e){let n=t.overrides[e.token];return n?parseFloat(n.replace(`em`,``)):e.default}function he(e){return S(e.token,e.default)}function ge(e){if(!e.trim())return;let t=`gf-${e.replace(/\s+/g,`-`)}`;if(!document.getElementById(t)){let n=document.createElement(`link`);n.id=t,n.rel=`stylesheet`,n.href=`https://fonts.googleapis.com/css2?family=${encodeURIComponent(e)}:wght@100;200;300;400;500;600;700;800;900&display=swap`,document.head.appendChild(n)}}function _e(e,n){if(!e.trim())return;ge(e);let r=n===`body`?`--sf-font-body`:`--sf-font-heading`;t.onSet(r,`'${e}', sans-serif`)}function ve(e,n){return e?t.overrides[e]??n:n}function ye(e,n,r){e&&(n===r?t.onReset(e):t.onSet(e,n))}let be=I(()=>{let e=ve(U(b).size,U(b).dSize),t=m.find(t=>t.value===e),n=(U(T)+U(E))/2;return Math.min((t?.approx??1)*n*U(A),2.4)}),xe=I(()=>{let e=ve(U(b).wt,U(b).dWt),t=parseInt(e);return isNaN(t)?600:t}),Se=I(()=>{if(!U(b).ls)return 0;let e=ve(U(b).ls,U(b).dLs),t=_.find(t=>t.value===e);if(t)return t.em;let n=parseFloat(e.replace(`em`,``));return isNaN(n)?0:n}),Ce=I(()=>{let e=ve(U(b).lh,U(b).dLh),t=g.find(t=>t.value===e);if(t)return t.num;let n=parseFloat(e);return isNaN(n)?1.3:n});var we=tf(),Te=z(we),Ee=z(Te),De=V(z(Ee),2),P=z(De,!0);F(De),F(Ee);var Oe=V(Ee,2),ke=e=>{var r=Dd(),c=B(r);Y(c,17,()=>[{label:`Body`,token:`--sf-font-body`,current:U(le),opts:i},{label:`Heading`,token:`--sf-font-heading`,current:U(ue),opts:a},{label:`Mono`,token:`--sf-font-mono`,current:U(de),opts:o}],e=>e.token,(e,r)=>{var i=Ed(),a=z(i),o=z(a,!0);F(a);var s=V(a,2),c=z(s);Y(c,17,()=>U(r).opts,e=>e.label,(e,t)=>{var r=wd(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`font-family:inherit;background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).value)&&(r.value=(r.__value=U(t).value)??``)}),K(e,r)});var l=V(c),u=e=>{var t=wd(),i=z(t);F(t);var a={};H(e=>{Z(t,`background:${U(n)};`),q(i,`Custom: ${e??``}`),a!==(a=U(r).current)&&(t.value=(t.__value=U(r).current)??``)},[()=>U(r).current.split(`,`)[0].replace(/['"]/g,``)]),K(e,t)},d=I(()=>U(r).current&&!U(r).opts.some(e=>e.value===U(r).current));J(l,e=>{U(d)&&e(u)}),F(s);var f;Di(s);var p=V(s,2),m=e=>{var n=Td();W(`click`,n,()=>t.onReset(U(r).token)),K(e,n)};J(p,e=>{U(r).token in t.overrides&&e(m)}),F(i),H(()=>{q(o,U(r).label),Z(s,`font-family: ${U(r).current||`inherit`}`),f!==(f=U(r).current)&&(s.value=(s.__value=U(r).current)??``,Ei(s,U(r).current))}),W(`change`,s,e=>{let n=e.target.value;n?t.onSet(U(r).token,n):t.onReset(U(r).token)}),K(e,i)});var l=V(c,2),u=V(z(l),2),d=z(u),f=z(d);f.value=f.__value=``,Y(V(f),16,()=>s,e=>e,(e,t)=>{var r=wd(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,t),a!==(a=t)&&(r.value=(r.__value=t)??``)}),K(e,r)}),F(d);var p;Di(d);var m=V(d,2),h=z(m),g=V(h,2);F(m),F(u);var _=V(u,2);zi(_);var v=V(_,2),y=z(v);F(v),F(l),H(()=>{Z(f,`background:${U(n)};`),p!==(p=U(fe))&&(d.value=(d.__value=U(fe))??``,Ei(d,U(fe))),X(h,1,`px-2 rounded text-[10px] border transition-all cursor-pointer ${U(pe)===`body`?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400`}`),X(g,1,`px-2 rounded text-[10px] border transition-all cursor-pointer ${U(pe)===`heading`?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400`}`),Bi(_,U(fe)),q(y,`Load & apply to ${U(pe)??``}`)}),W(`change`,d,e=>{R(fe,e.target.value,!0)}),W(`click`,h,()=>{R(pe,`body`)}),W(`click`,g,()=>{R(pe,`heading`)}),W(`input`,_,e=>{R(fe,e.target.value,!0)}),W(`click`,v,()=>_e(U(fe),U(pe))),K(e,r)};J(Oe,e=>{U(j)&&e(ke)}),F(Te);var Ae=V(Te,4),je=z(Ae),Me=V(z(je),2),Ne=z(Me,!0);F(Me),F(je);var Pe=V(je,2),Fe=e=>{var r=Fd(),i=B(r);Y(i,21,()=>v,e=>e.id,(e,n)=>{let r=I(()=>U(n).size in t.overrides||U(n).lh in t.overrides||U(n).wt in t.overrides||!!U(n).ls&&U(n).ls in t.overrides);var i=kd(),a=z(i),o=V(a),s=e=>{K(e,Od())};J(o,e=>{U(r)&&e(s)}),F(i),H(()=>{X(i,1,`relative flex-1 py-1 rounded-md text-[10px] font-bold transition-all cursor-pointer ${U(y)===U(n).id?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(a,`${U(n).label??``} `)}),W(`click`,i,()=>{R(y,U(n).id,!0)}),K(e,i)}),F(i);var a=V(i,2),o=z(a);F(a);var s=V(a,2),c=V(z(s),2),u=z(c);Y(u,17,()=>m,e=>e.value,(e,t)=>{var r=wd(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).value)&&(r.value=(r.__value=U(t).value)??``)}),K(e,r)});var d=V(u),f=e=>{var t=Ad(),r={};H(e=>{Z(t,`background:${U(n)};`),r!==(r=e)&&(t.value=(t.__value=e)??``)},[()=>ve(U(b).size,U(b).dSize)]),K(e,t)},p=I(()=>!m.some(e=>e.value===ve(U(b).size,U(b).dSize)));J(d,e=>{U(p)&&e(f)}),F(c);var h;Di(c),F(s);var x=V(s,2),S=V(z(x),2),C=z(S);Y(C,17,()=>g,e=>e.value,(e,t)=>{var r=wd(),i=z(r);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,`${U(t).label??``} · ${U(t).num??``}`),a!==(a=U(t).value)&&(r.value=(r.__value=U(t).value)??``)}),K(e,r)});var w=V(C),T=e=>{var t=Ad(),r={};H(e=>{Z(t,`background:${U(n)};`),r!==(r=e)&&(t.value=(t.__value=e)??``)},[()=>ve(U(b).lh,U(b).dLh)]),K(e,t)},E=I(()=>!g.some(e=>e.value===ve(U(b).lh,U(b).dLh)));J(w,e=>{U(E)&&e(T)}),F(S);var D;Di(S),F(x);var O=V(x,2),k=V(z(O),2);Y(k,20,()=>l,e=>e,(e,t)=>{let n=I(()=>ve(U(b).wt,U(b).dWt));var r=jd(),i=z(r,!0);F(r),H(e=>{Z(r,e),X(r,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,t)},[()=>`font-weight:${parseInt(t)}`]),W(`click`,r,()=>ye(U(b).wt,t,U(b).dWt)),K(e,r)}),F(k),F(O);var A=V(O,2),ee=e=>{var t=Md(),r=V(z(t),2),i=z(r);Y(i,17,()=>_,e=>e.value,(e,t)=>{var r=wd(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).value)&&(r.value=(r.__value=U(t).value)??``)}),K(e,r)});var a=V(i),o=e=>{var t=Ad(),r={};H(e=>{Z(t,`background:${U(n)};`),r!==(r=e)&&(t.value=(t.__value=e)??``)},[()=>ve(U(b).ls,U(b).dLs)]),K(e,t)},s=I(()=>!_.some(e=>e.value===ve(U(b).ls,U(b).dLs)));J(a,e=>{U(s)&&e(o)}),F(r);var c;Di(r),F(t),H(e=>{c!==(c=e)&&(r.value=(r.__value=e)??``,Ei(r,e))},[()=>ve(U(b).ls,U(b).dLs)]),W(`change`,r,e=>ye(U(b).ls,e.target.value,U(b).dLs)),K(e,t)};J(A,e=>{U(b).ls&&e(ee)});var te=V(A,2),j=e=>{let n=I(()=>`--sf-${U(b).id}-max-width`);var r=Nd(),i=V(z(r),2);zi(i);var a=V(i,2),o=e=>{var r=Td();W(`click`,r,()=>t.onReset(U(n))),K(e,r)};J(a,e=>{U(n)in t.overrides&&e(o)}),F(r),H(()=>Bi(i,t.overrides[U(n)]??``)),W(`input`,i,e=>{let r=e.target.value.trim();r?t.onSet(U(n),r):t.onReset(U(n))}),K(e,r)};J(te,e=>{U(b).id!==`body`&&e(j)});var ne=V(te,2),M=z(ne),re=e=>{var n=Pd(),r=z(n);F(n),H(()=>q(r,`reset ${U(b).label??``}`)),W(`click`,n,()=>{let e={[U(b).size]:null,[U(b).lh]:null,[U(b).wt]:null};U(b).ls&&(e[U(b).ls]=null),t.onBulkChange(e)}),K(e,n)};J(M,e=>{(U(b).size in t.overrides||U(b).lh in t.overrides||U(b).wt in t.overrides||U(b).ls&&U(b).ls in t.overrides)&&e(re)}),F(ne),H((e,t)=>{Z(o,`font-size:${U(be)}rem; font-weight:${U(xe)}; letter-spacing:${U(Se)}em; line-height:${U(Ce)}; font-family:${U(b).id===`body`?U(le)||`inherit`:U(ue)||U(le)||`inherit`}`),h!==(h=e)&&(c.value=(c.__value=e)??``,Ei(c,e)),D!==(D=t)&&(S.value=(S.__value=t)??``,Ei(S,t))},[()=>ve(U(b).size,U(b).dSize),()=>ve(U(b).lh,U(b).dLh)]),W(`change`,c,e=>ye(U(b).size,e.target.value,U(b).dSize)),W(`change`,S,e=>ye(U(b).lh,e.target.value,U(b).dLh)),K(e,r)};J(Pe,e=>{U(ne)&&e(Fe)}),F(Ae);var Ie=V(Ae,4),Le=z(Ie),Re=V(z(Le),2),ze=z(Re,!0);F(Re),F(Le);var Be=V(Le,2),Ve=e=>{var n=Bd(),r=B(n);Y(r,16,()=>[{label:`Body strong`,tokenName:`--sf-font-weight-strong`},{label:`Interactive`,tokenName:`--sf-font-weight-interactive`}],e=>e.tokenName,(e,n)=>{let r=I(()=>u[n.tokenName]??`600`),i=I(()=>t.overrides[n.tokenName]??U(r)),a=I(()=>n.tokenName in t.overrides);var o=Ld(),s=z(o),c=z(s),d=z(c);F(c);var f=V(c,2),p=e=>{var r=Id();W(`click`,r,()=>t.onReset(n.tokenName)),K(e,r)};J(f,e=>{U(a)&&e(p)}),F(s);var m=V(s,2);Y(m,20,()=>l,e=>e,(e,o)=>{var s=jd(),c=z(s,!0);F(s),H(e=>{Z(s,e),X(s,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(i)===o?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,o)},[()=>`font-weight: ${parseInt(o)}`]),W(`click`,s,()=>o===U(r)&&!U(a)?void 0:o===U(r)?t.onReset(n.tokenName):t.onSet(n.tokenName,o)),K(e,s)}),F(m),F(o),H(()=>q(d,`${n.label??``} weight`)),K(e,o)});var i=V(r,2),a=V(z(i),2);Y(a,20,()=>[[`Italic`,`italic`],[`Normal`,`normal`]],([e,t])=>t,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1],o=I(()=>t.overrides[`--sf-body-em-style`]??`italic`);var s=Rd(),c=z(s),l=z(c,!0);F(c),F(s),H(()=>{X(s,1,`flex-1 py-2 rounded-lg text-[10px] border transition-all cursor-pointer ${U(o)===a()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),Z(c,`font-style: ${a()}`),q(l,i())}),W(`click`,s,()=>a()===`italic`?t.onReset(`--sf-body-em-style`):t.onSet(`--sf-body-em-style`,a())),K(e,s)}),F(a),F(i);var o=V(i,2);{let e=I(()=>S(`--sf-code-font-size`,.875)),n=I(()=>`--sf-code-font-size`in t.overrides);$(o,{label:`Code font size`,get value(){return U(e)},min:.7,max:1.1,step:.005,unit:`em`,help:`--sf-code-font-size — size of inline code relative to surrounding text`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-code-font-size`,`${e}em`),onReset:()=>t.onReset(`--sf-code-font-size`)})}var s=V(o,2);Y(s,16,()=>[{label:`Heading wrap`,token:`--sf-heading-text-wrap`,defaultVal:`balance`},{label:`Body wrap`,token:`--sf-body-text-wrap`,defaultVal:`pretty`}],e=>e.token,(e,n)=>{let r=I(()=>t.overrides[n.token]??n.defaultVal);var i=zd(),a=z(i),o=z(a,!0);F(a);var s=V(a,2);Y(s,21,()=>c,e=>e.value,(e,i)=>{var a=jd(),o=z(a,!0);F(a),H(()=>{X(a,1,`flex-1 px-2 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===U(i).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(o,U(i).label)}),W(`click`,a,()=>U(i).value===n.defaultVal&&!(n.token in t.overrides)?void 0:U(i).value===n.defaultVal?t.onReset(n.token):t.onSet(n.token,U(i).value)),K(e,a)}),F(s),F(i),H(()=>q(o,n.label)),K(e,i)});var d=V(s,2),f=V(z(d),2);zi(f),Q(f,`placeholder`,`" ↗"`);var p=V(f,2),m=e=>{var n=Td();W(`click`,n,()=>t.onReset(`--sf-link-external-marker`)),K(e,n)};J(p,e=>{`--sf-link-external-marker`in t.overrides&&e(m)}),F(d);var g=V(d,2),_=V(z(g),2);zi(_),Q(_,`placeholder`,`"opens in a new window or external site"`);var v=V(_,2),y=e=>{var n=Td();W(`click`,n,()=>t.onReset(`--sf-link-external-label`)),K(e,n)};J(v,e=>{`--sf-link-external-label`in t.overrides&&e(y)}),F(g),H(()=>{Bi(f,t.overrides[`--sf-link-external-marker`]??``),Bi(_,t.overrides[`--sf-link-external-label`]??``)}),W(`input`,f,e=>{let n=e.target.value;n?t.onSet(`--sf-link-external-marker`,n):t.onReset(`--sf-link-external-marker`)}),W(`input`,_,e=>{let n=e.target.value;n?t.onSet(`--sf-link-external-label`,n):t.onReset(`--sf-link-external-label`)}),K(e,n)};J(Be,e=>{U(M)&&e(Ve)}),F(Ie);var He=V(Ie,4),Ge=z(He),Ke=V(z(Ge),2),qe=z(Ke,!0);F(Ke),F(Ge);var Je=V(Ge,2),Ye=e=>{var n=Ud();Y(V(B(n),2),16,()=>[{label:`Light`,token:`--sf-font-weight-light`,def:300},{label:`Normal`,token:`--sf-font-weight-normal`,def:400},{label:`Medium`,token:`--sf-font-weight-medium`,def:500},{label:`Semibold`,token:`--sf-font-weight-semibold`,def:600},{label:`Bold`,token:`--sf-font-weight-bold`,def:700}],e=>e.token,(e,n)=>{var r=Hd(),i=z(r),a=z(i),o=z(a,!0);F(a);var s=V(a,2),c=e=>{var r=Vd();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(i);var u=V(i,2);Y(u,20,()=>l,e=>e,(e,r)=>{let i=I(()=>t.overrides[n.token]??String(n.def));var a=jd(),o=z(a,!0);F(a),H(e=>{Z(a,e),X(a,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(i)===r?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(o,r)},[()=>`font-weight:${parseInt(r)}`]),W(`click`,a,()=>r===String(n.def)&&!(n.token in t.overrides)?void 0:r===String(n.def)?t.onReset(n.token):t.onSet(n.token,r)),K(e,a)}),F(u),F(r),H(()=>q(o,n.label)),K(e,r)}),K(e,n)};J(Je,e=>{U(ce)&&e(Ye)}),F(He);var Xe=V(He,4),Ze=z(Xe),Qe=V(z(Ze),2),$e=z(Qe,!0);F(Qe),F(Ze);var et=V(Ze,2),tt=e=>{var n=Gd(),r=B(n);{let e=I(()=>`--sf-text-display-base-min`in t.overrides||`--sf-text-display-base-max`in t.overrides);Cd(r,{title:`Display base size`,get minValue(){return U(D)},get maxValue(){return U(O)},min:1.5,max:6,step:.05,unit:`rem`,previewKind:`type`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-text-display-base-min`),t.onReset(`--sf-text-display-base-max`)},onMinChange:e=>t.onSet(`--sf-text-display-base-min`,String(e)),onMaxChange:e=>t.onSet(`--sf-text-display-base-max`,String(e))})}var i=V(r,2);Y(i,20,()=>[{label:`Display L line-height`,token:`--sf-display-l-line-height`,def:1},{label:`Display M line-height`,token:`--sf-display-m-line-height`,def:1.05}],e=>e.token,(e,n)=>{var r=Wd(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);{let e=I(()=>S(n.token,n.def)),r=I(()=>n.token in t.overrides);$(o,{label:``,get value(){return U(e)},min:.8,max:1.5,step:.025,get overridden(){return U(r)},onChange:e=>t.onSet(n.token,String(e)),onReset:()=>t.onReset(n.token)})}F(r),H(()=>q(a,n.label)),K(e,r)}),F(i),Y(V(i,2),16,()=>[{label:`Display`,tokenName:`--sf-font-weight-display`},{label:`Heading`,tokenName:`--sf-font-weight-heading`}],e=>e.tokenName,(e,n)=>{let r=I(()=>u[n.tokenName]??`700`),i=I(()=>t.overrides[n.tokenName]??U(r)),a=I(()=>n.tokenName in t.overrides);var o=Ld(),s=z(o),c=z(s),d=z(c);F(c);var f=V(c,2),p=e=>{var r=Id();W(`click`,r,()=>t.onReset(n.tokenName)),K(e,r)};J(f,e=>{U(a)&&e(p)}),F(s);var m=V(s,2);Y(m,20,()=>l,e=>e,(e,o)=>{var s=jd(),c=z(s,!0);F(s),H(e=>{Z(s,e),X(s,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(i)===o?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,o)},[()=>`font-weight: ${parseInt(o)}`]),W(`click`,s,()=>o===U(r)&&!U(a)?void 0:o===U(r)?t.onReset(n.tokenName):t.onSet(n.tokenName,o)),K(e,s)}),F(m),F(o),H(()=>q(d,`${n.label??``} weight`)),K(e,o)}),K(e,n)};J(et,e=>{U(re)&&e(tt)}),F(Xe);var nt=V(Xe,4),rt=z(nt),it=V(z(rt),2),at=z(it,!0);F(it),F(rt);var ot=V(rt,2),st=e=>{var n=Jd(),i=V(B(n),2);{let e=I(()=>`--sf-fluid-min-vw`in t.overrides||`--sf-fluid-max-vw`in t.overrides);Cd(i,{title:`Viewport range`,get minValue(){return U(ee)},get maxValue(){return U(te)},min:15,max:120,step:.5,unit:`rem`,minLabel:`Mobile`,maxLabel:`Desktop`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-fluid-min-vw`),t.onReset(`--sf-fluid-max-vw`)},onMinChange:e=>t.onSet(`--sf-fluid-min-vw`,String(e)),onMaxChange:e=>t.onSet(`--sf-fluid-max-vw`,String(e))})}var a=V(i,2);{let e=I(()=>`--sf-text-base-min`in t.overrides||`--sf-text-base-max`in t.overrides);Cd(a,{title:`Base size & ratio`,get minValue(){return U(T)},get maxValue(){return U(E)},min:.7,max:2,step:.01,unit:`rem`,minLabel:`Mobile`,maxLabel:`Desktop`,previewKind:`type`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-text-base-min`),t.onReset(`--sf-text-base-max`)},onMinChange:e=>t.onSet(`--sf-text-base-min`,String(e)),onMaxChange:e=>t.onSet(`--sf-text-base-max`,String(e)),get ratioPresets(){return r},get ratioMin(){return U(C)},get ratioMax(){return U(w)},ratioMin_bound:1.05,ratioMax_bound:1.8,onRatioMinChange:e=>t.onSet(`--sf-text-ratio-min`,String(e)),onRatioMaxChange:e=>t.onSet(`--sf-text-ratio-max`,String(e))})}var o=V(a,2),s=V(z(o),2);Y(s,21,()=>p,e=>e.token,(e,n)=>{{let r=I(()=>he(U(n))),i=I(()=>`${U(n).token} — ${U(n).label.toLowerCase()} line height`),a=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:1,max:2.2,step:.05,get help(){return U(i)},get overridden(){return U(a)},onChange:e=>t.onSet(U(n).token,String(e)),onReset:()=>t.onReset(U(n).token)})}}),F(s),F(o);var c=V(o,2);{let e=I(()=>`--sf-leading-taper`in t.overrides);$(c,{label:`Leading taper`,get value(){return U(k)},min:0,max:.5,step:.01,help:`How aggressively large display sizes shrink their line-height.`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-leading-taper`,String(e)),onReset:()=>t.onReset(`--sf-leading-taper`)})}var l=V(c,2),u=V(z(l),4);Y(u,21,()=>f,e=>e.token,(e,n)=>{var r=Kd(),i=z(r),a=z(i),o=z(a,!0);F(a);var s=V(a,2),c=e=>{var r=Vd();W(`click`,r,()=>t.onReset(U(n).token)),K(e,r)};J(s,e=>{U(n).token in t.overrides&&e(c)}),F(i);var l=V(i,2);{let e=I(()=>me(U(n)));eu(l,{get value(){return U(e)},min:-.1,max:.2,step:.005,unit:`em`,onChange:e=>t.onSet(U(n).token,`${e}em`)})}F(r),H(()=>q(o,U(n).label)),K(e,r)}),F(u),F(l);var d=V(l,2),m=z(d),h=V(z(m),2),g=z(h,!0);F(h),F(m);var _=V(m,2),v=e=>{var n=qd();Y(n,21,()=>x,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(n),K(e,n)};J(_,e=>{U(ae)&&e(v)}),F(d),H(()=>{Q(m,`aria-expanded`,U(ae)),q(g,U(ae)?`▲`:`▼`)}),W(`click`,m,()=>{R(ae,!U(ae))}),K(e,n)};J(ot,e=>{U(ie)&&e(st)}),F(nt);var ct=V(nt,4),lt=z(ct),ut=V(z(lt),2),dt=z(ut,!0);F(ut),F(lt);var ft=V(lt,2),pt=e=>{var t=Xd();Y(t,21,()=>[...d].reverse(),({label:e,factor:t})=>e,(e,t)=>{let n=()=>U(t).label,r=()=>U(t).factor,i=I(()=>(U(T)+U(E))/2),a=I(()=>U(i)*r()*U(A));var o=Yd(),s=z(o),c=z(s,!0);F(s);var l=V(s,2),u=V(l,2),d=z(u);F(u),F(o),H((e,t)=>{q(c,n()),Z(l,e),q(d,`${t??``}rem`)},[()=>`font-size: ${Math.min(U(a),2.5)}rem; font-family: ${U(le)||`inherit`}`,()=>U(a).toFixed(2)]),K(e,o)}),F(t),K(e,t)};J(ft,e=>{U(oe)&&e(pt)}),F(ct);var mt=V(ct,4),ht=z(mt),gt=V(z(ht),2),_t=z(gt,!0);F(gt),F(ht);var vt=V(ht,2),yt=e=>{var n=$d(),r=V(B(n),2);Y(r,20,()=>[{label:`2xs`,token:`--sf-text-2xs-max-width`,def:`55ch`},{label:`xs`,token:`--sf-text-xs-max-width`,def:`60ch`},{label:`s`,token:`--sf-text-s-max-width`,def:`65ch`},{label:`m`,token:`--sf-text-m-max-width`,def:`65ch`},{label:`l`,token:`--sf-text-l-max-width`,def:`none`},{label:`xl`,token:`--sf-text-xl-max-width`,def:`none`},{label:`2xl`,token:`--sf-text-2xl-max-width`,def:`none`},{label:`3xl`,token:`--sf-text-3xl-max-width`,def:`none`},{label:`4xl`,token:`--sf-text-4xl-max-width`,def:`none`}],e=>e.token,(e,n)=>{var r=Qd(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Zd();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.def)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(r),K(e,n)};J(vt,e=>{U(N)&&e(yt)}),F(mt);var bt=V(mt,4),xt=z(bt),St=V(z(xt),2),Ct=z(St,!0);F(St),F(xt);var wt=V(xt,2),Tt=e=>{var n=ef(),r=V(B(n),2),i=V(z(r),2);Y(i,20,()=>[[`tabular-nums`,`tabular-nums (default)`],[`proportional-nums`,`proportional-nums`],[`normal`,`normal`]],([e,t])=>e,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1],o=I(()=>t.overrides[`--sf-font-numeric`]??`tabular-nums`);var s=jd(),c=z(s,!0);F(s),H(()=>{X(s,1,`flex-1 py-1.5 rounded-lg text-[9px] border transition-all cursor-pointer ${U(o)===i()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,a())}),W(`click`,s,()=>i()===`tabular-nums`?t.onReset(`--sf-font-numeric`):t.onSet(`--sf-font-numeric`,i())),K(e,s)}),F(i),F(r);var a=V(r,2),o=V(z(a),2);Y(o,20,()=>[[`auto`,`auto (default)`],[`none`,`none`]],([e,t])=>e,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1],o=I(()=>t.overrides[`--sf-optical-sizing`]??`auto`);var s=jd(),c=z(s,!0);F(s),H(()=>{X(s,1,`flex-1 py-2 rounded-lg text-[10px] border transition-all cursor-pointer ${U(o)===i()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(c,a())}),W(`click`,s,()=>i()===`auto`?t.onReset(`--sf-optical-sizing`):t.onSet(`--sf-optical-sizing`,i())),K(e,s)}),F(o),F(a);var s=V(a,2),c=V(z(s),2);zi(c);var l=V(c,2),u=e=>{var n=Zd();W(`click`,n,()=>t.onReset(`--sf-font-features`)),K(e,n)};J(l,e=>{`--sf-font-features`in t.overrides&&e(u)}),F(s);var d=V(s,2),f=V(z(d),2);zi(f);var p=V(f,2),m=e=>{var n=Zd();W(`click`,n,()=>t.onReset(`--sf-font-variation`)),K(e,n)};J(p,e=>{`--sf-font-variation`in t.overrides&&e(m)}),F(d),H(()=>{Bi(c,t.overrides[`--sf-font-features`]??``),Bi(f,t.overrides[`--sf-font-variation`]??``)}),W(`input`,c,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-font-features`,n):t.onReset(`--sf-font-features`)}),W(`input`,f,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-font-variation`,n):t.onReset(`--sf-font-variation`)}),K(e,n)};J(wt,e=>{U(se)&&e(Tt)}),F(bt),F(we),H(()=>{Q(Ee,`aria-expanded`,U(j)),q(P,U(j)?`▲`:`▼`),Q(je,`aria-expanded`,U(ne)),q(Ne,U(ne)?`▲`:`▼`),Q(Le,`aria-expanded`,U(M)),q(ze,U(M)?`▲`:`▼`),Q(Ge,`aria-expanded`,U(ce)),q(qe,U(ce)?`▲`:`▼`),Q(Ze,`aria-expanded`,U(re)),q($e,U(re)?`▲`:`▼`),Q(rt,`aria-expanded`,U(ie)),q(at,U(ie)?`▲`:`▼`),Q(lt,`aria-expanded`,U(oe)),q(dt,U(oe)?`▲`:`▼`),Q(ht,`aria-expanded`,U(N)),q(_t,U(N)?`▲`:`▼`),Q(xt,`aria-expanded`,U(se)),q(Ct,U(se)?`▲`:`▼`)}),W(`click`,Ee,()=>{R(j,!U(j))}),W(`click`,je,()=>{R(ne,!U(ne))}),W(`click`,Le,()=>{R(M,!U(M))}),W(`click`,Ge,()=>{R(ce,!U(ce))}),W(`click`,Ze,()=>{R(re,!U(re))}),W(`click`,rt,()=>{R(ie,!U(ie))}),W(`click`,lt,()=>{R(oe,!U(oe))}),W(`click`,ht,()=>{R(N,!U(N))}),W(`click`,xt,()=>{R(se,!U(se))}),K(e,we),We()}Br([`click`,`change`,`input`]);function rf(e,t){return t.map(t=>({label:`${e}-${t}`,value:`var(--sf-${e}-${t})`}))}var af=rf(`space`,[`2xs`,`xs`,`s`,`m`,`l`,`xl`,`2xl`,`3xl`,`4xl`]),of=rf(`radius`,[`2xs`,`xs`,`s`,`m`,`l`,`xl`,`2xl`,`3xl`,`4xl`,`full`]),sf=rf(`border-width`,[`1`,`2`,`3`,`4`]),cf=rf(`container`,[`narrow`,`prose`,`default`,`wide`,`full`]),lf=rf(`size`,[`xs`,`s`,`m`,`l`,`xl`]);rf(`shadow`,[`xs`,`s`,`m`,`l`,`xl`]);var uf=G(`
`),df=G(`

The two most-referenced spacing tokens. Referenced by every layout primitive (cluster, grid, stack, bento…).

`,1),ff=G(`

Utopia-style fluid scale — viewport width, base unit and ratio per endpoint. + The viewport range is shared with the type scale.

`,1),pf=G(`
`),mf=G(`
Space scale preview
`);function hf(e,t){Ue(t,!0);let n=[{label:`Minor Third — 1.200`,value:1.2},{label:`Major Third — 1.250`,value:1.25},{label:`Perfect Fourth — 1.333`,value:1.333},{label:`Aug. Fourth — 1.414`,value:1.414},{label:`Golden — 1.618`,value:1.618}],r=[`2xs`,`xs`,`s`,`m`,`l`,`xl`,`2xl`,`3xl`,`4xl`],i=Kl.spacing??[];function a(e,n){let r=parseFloat(t.overrides[e]??``);return isNaN(r)?n:r}let o=I(()=>a(`--sf-space-ratio-min`,1.25)),s=I(()=>a(`--sf-space-ratio-max`,1.333)),c=I(()=>a(`--sf-space-base-min`,1)),l=I(()=>a(`--sf-space-base-max`,2)),u=I(()=>a(`--sf-space-scale`,1)),d=I(()=>a(`--sf-gap`,1)),f=I(()=>a(`--sf-gutter`,1.5)),p=I(()=>a(`--sf-content-gap`,.5)),m=I(()=>a(`--sf-fluid-min-vw`,22.5)),h=I(()=>a(`--sf-fluid-max-vw`,90)),g=L(!1),_=L(!1),v=L(!1);var y=mf(),b=z(y),x=V(z(b),2);Y(x,22,()=>r,e=>e,(e,t,n)=>{let r=I(()=>(U(c)+U(l))/2),i=I(()=>(U(o)+U(s))/2),a=I(()=>U(n)-3),d=I(()=>U(a)>=0?U(r)*U(i)**+U(a):U(r)/U(i)**+-U(a)),f=I(()=>U(d)*U(u)),p=I(()=>Math.min(U(f)*28,240));var m=uf(),h=z(m),g=z(h,!0);F(h);var _=V(h,2),v=V(_,2),y=z(v);F(v),F(m),H(e=>{q(g,t),Z(_,`width: ${U(p)}px; min-width: 3px`),q(y,`${e??``}rem`)},[()=>U(f).toFixed(2)]),K(e,m)}),F(x),F(b);var S=V(b,4),C=z(S),w=V(z(C),2),T=z(w,!0);F(w),F(C);var E=V(C,2),D=e=>{var n=df(),r=V(B(n),2);{let e=I(()=>`--sf-gap`in t.overrides);$(r,{label:`Gap`,get value(){return U(d)},min:0,max:4,step:.0625,unit:`rem`,help:`--sf-gap — spacing between layout items (cluster, grid, reel, stack, sidebar, bento)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-gap`,`${e}rem`),onReset:()=>t.onReset(`--sf-gap`),rawDefault:`var(--sf-space-m)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-gap`]},onRawSet:e=>t.onSet(`--sf-gap`,e)})}var i=V(r,2);{let e=I(()=>`--sf-content-gap`in t.overrides);$(i,{label:`Content gap`,get value(){return U(p)},min:0,max:2,step:.0625,unit:`rem`,help:`--sf-content-gap — tighter gap within components (defaults to space-s)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-content-gap`,`${e}rem`),onReset:()=>t.onReset(`--sf-content-gap`),rawDefault:`var(--sf-space-s)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-content-gap`]},onRawSet:e=>t.onSet(`--sf-content-gap`,e)})}var a=V(i,2);{let e=I(()=>`--sf-gutter`in t.overrides);$(a,{label:`Gutter`,get value(){return U(f)},min:0,max:6,step:.0625,unit:`rem`,help:`--sf-gutter — wide page/section side gutter (containers, .sf-section--guttered)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-gutter`,`${e}rem`),onReset:()=>t.onReset(`--sf-gutter`),rawDefault:`var(--sf-space-l)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-gutter`]},onRawSet:e=>t.onSet(`--sf-gutter`,e)})}K(e,n)};J(E,e=>{U(g)&&e(D)}),F(S);var O=V(S,4),k=z(O),A=V(z(k),2),ee=z(A,!0);F(A),F(k);var te=V(k,2),j=e=>{var r=ff(),i=V(B(r),2);{let e=I(()=>`--sf-fluid-min-vw`in t.overrides||`--sf-fluid-max-vw`in t.overrides);Cd(i,{title:`Viewport range`,get minValue(){return U(m)},get maxValue(){return U(h)},min:15,max:120,step:.5,unit:`rem`,minLabel:`Mobile`,maxLabel:`Desktop`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-fluid-min-vw`),t.onReset(`--sf-fluid-max-vw`)},onMinChange:e=>t.onSet(`--sf-fluid-min-vw`,String(e)),onMaxChange:e=>t.onSet(`--sf-fluid-max-vw`,String(e))})}var a=V(i,2);{let e=I(()=>`--sf-space-base-min`in t.overrides||`--sf-space-base-max`in t.overrides);Cd(a,{title:`Base unit & ratio`,get minValue(){return U(c)},get maxValue(){return U(l)},min:.5,max:4,step:.05,unit:`rem`,minLabel:`Mobile`,maxLabel:`Desktop`,previewKind:`space`,get overridden(){return U(e)},onReset:()=>{t.onReset(`--sf-space-base-min`),t.onReset(`--sf-space-base-max`)},onMinChange:e=>t.onSet(`--sf-space-base-min`,String(e)),onMaxChange:e=>t.onSet(`--sf-space-base-max`,String(e)),get ratioPresets(){return n},get ratioMin(){return U(o)},get ratioMax(){return U(s)},ratioMin_bound:1.1,ratioMax_bound:1.8,onRatioMinChange:e=>t.onSet(`--sf-space-ratio-min`,String(e)),onRatioMaxChange:e=>t.onSet(`--sf-space-ratio-max`,String(e))})}K(e,r)};J(te,e=>{U(_)&&e(j)}),F(O);var ne=V(O,4),M=z(ne),re=V(z(M),2),ie=z(re,!0);F(re),F(M);var ae=V(M,2),oe=e=>{var n=pf();Y(n,21,()=>i,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(n),K(e,n)};J(ae,e=>{U(v)&&e(oe)}),F(ne),F(y),H(()=>{Q(C,`aria-expanded`,U(g)),q(T,U(g)?`▲`:`▼`),Q(k,`aria-expanded`,U(_)),q(ee,U(_)?`▲`:`▼`),Q(M,`aria-expanded`,U(v)),q(ie,U(v)?`▲`:`▼`)}),W(`click`,C,()=>{R(g,!U(g))}),W(`click`,k,()=>{R(_,!U(_))}),W(`click`,M,()=>{R(v,!U(v))}),K(e,y),We()}Br([`click`]);var gf=G(`
`),_f=G(`
Narrow
Prose
Default
Wide
`,1),vf=G(` `,1),yf=G(`
col
`),bf=G(`
Named sizes (grid-min-xs → 2xl)
Preview at 360px panel width
`,1),xf=G(`
`),Sf=G(`
Mobile
Desktop
`,1),Cf=G(`

Offsets position:sticky elements below a fixed header. Defaults to header heights.

Mobile
Desktop
`,1),wf=G(`
`,1),Tf=G(`
`),Ef=G(``),Df=G(``),Of=G(`
`),kf=G(``),Af=G(`
Switcher
Sidebar content
Cluster
Equal columns (flowing)
Content flows between columns like a newspaper — use .sf-grid for discrete grid cells instead.
Rule style
Rule color
Cover
Frame ratio

--sf-frame-ratio — aspect ratio for .sf-frame

Reel

--sf-reel-item-width — width of each item in a horizontal .sf-reel

Height
Imposter
Content grid (breakout)
Alternate (zigzag)
`),jf=G(`
`),Mf=G(`

Override the built-in named aspect ratios used by .sf-ratio-* utilities.

`),Nf=G(`

Default values for the .sf-bg-layer full-bleed background utility.

`),Pf=G(`
`);function Ff(e,t){Ue(t,!0);let n=[`solid`,`dashed`,`dotted`],r=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`);function i(e,t){if(!e)return t;let n=parseFloat(e);return isNaN(n)?t:n}let a=I(()=>i(t.overrides[`--sf-container-narrow`],38)),o=I(()=>i(t.overrides[`--sf-container-prose`],65)),s=I(()=>i(t.overrides[`--sf-container-default`],75)),c=I(()=>i(t.overrides[`--sf-container-wide`],90)),l=I(()=>i(t.overrides[`--sf-center-max`],75)),u=I(()=>i(t.overrides[`--sf-center-gutter`],1)),d=I(()=>i(t.overrides[`--sf-grid-min`],16)),f=I(()=>i(t.overrides[`--sf-header-height-mobile`],3.5)),p=I(()=>i(t.overrides[`--sf-header-height-desktop`],5)),m=I(()=>i(t.overrides[`--sf-sidebar-width`],18)),h=I(()=>i(t.overrides[`--sf-sticky-offset-mobile`],3.5)),g=I(()=>i(t.overrides[`--sf-sticky-offset-desktop`],5)),_=[{label:`Columns`,token:`--sf-bento-cols-default`,min:1,max:12,step:1,unit:``,default:4},{label:`Row default`,token:`--sf-bento-row-default`,min:4,max:24,step:.5,unit:`rem`,default:10},{label:`Row compact`,token:`--sf-bento-row-compact`,min:2,max:16,step:.5,unit:`rem`,default:6},{label:`Row tall`,token:`--sf-bento-row-tall`,min:8,max:32,step:.5,unit:`rem`,default:16}],v=L(!1),y=L(!1),b=L(!1),x=L(!1),S=L(!1),C=L(!1),w=L(!1),T=L(!1),E=L(!1),D=L(!1);function O(e){let n=t.overrides[e.token];return n?parseFloat(n):e.default}let k=I(()=>i(t.overrides[`--sf-switcher-threshold`],30)),A=I(()=>i(t.overrides[`--sf-sidebar-min-width`],50)),ee=I(()=>i(t.overrides[`--sf-equal-min-col`],16)),te=I(()=>i(t.overrides[`--sf-equal-rule-width`],0)),j=I(()=>t.overrides[`--sf-equal-rule-color`]??``),ne=I(()=>i(t.overrides[`--sf-cover-min-height`],100)),M=I(()=>i(t.overrides[`--sf-imposter-margin`],1)),re=I(()=>i(t.overrides[`--sf-breakout-width`],90)),ie=I(()=>i(t.overrides[`--sf-content-width`],75)),ae=I(()=>i(t.overrides[`--sf-alternate-inner-gap`],1)),oe=I(()=>t.overrides[`--sf-frame-ratio`]??`16 / 9`),se=I(()=>t.overrides[`--sf-reel-item-width`]??`max-content`),N=[`16 / 9`,`4 / 3`,`3 / 2`,`1 / 1`,`21 / 9`],ce=[{label:`auto`,value:`max-content`},{label:`12rem`,value:`12rem`},{label:`16rem`,value:`16rem`},{label:`20rem`,value:`20rem`}];var le=Pf(),ue=z(le),de=z(ue),fe=V(z(de),2),pe=z(fe,!0);F(fe),F(de);var me=V(de,2),he=e=>{var n=_f(),r=B(n),i=z(r),l=V(z(i),2);{let e=I(()=>`--sf-container-narrow`in t.overrides);$(l,{label:``,get value(){return U(a)},min:20,max:60,step:1,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-container-narrow`,`${e}rem`),onReset:()=>t.onReset(`--sf-container-narrow`)})}F(i);var u=V(i,2),d=V(z(u),2);{let e=I(()=>`--sf-container-prose`in t.overrides);$(d,{label:``,get value(){return U(o)},min:40,max:90,step:1,unit:`ch`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-container-prose`,`${e}ch`),onReset:()=>t.onReset(`--sf-container-prose`)})}F(u);var f=V(u,2),p=V(z(f),2);{let e=I(()=>`--sf-container-default`in t.overrides);$(p,{label:``,get value(){return U(s)},min:50,max:120,step:1,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-container-default`,`${e}rem`),onReset:()=>t.onReset(`--sf-container-default`)})}F(f);var m=V(f,2),h=V(z(m),2);{let e=I(()=>`--sf-container-wide`in t.overrides);$(h,{label:``,get value(){return U(c)},min:60,max:160,step:1,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-container-wide`,`${e}rem`),onReset:()=>t.onReset(`--sf-container-wide`)})}F(m),F(r);var g=V(r,2);Y(g,21,()=>[{label:`narrow`,value:U(a),max:U(c),unit:`rem`},{label:`prose`,value:U(o),max:U(c)*1.5,unit:`ch`},{label:`default`,value:U(s),max:U(c),unit:`rem`},{label:`wide`,value:U(c),max:U(c),unit:`rem`}],e=>e.label,(e,t)=>{var n=gf(),r=z(n),i=z(r,!0);F(r);var a=V(r,2),o=z(a);F(a);var s=V(a,2),c=z(s);F(s),F(n),H(e=>{q(i,U(t).label),Z(o,e),q(c,`${U(t).value??``}${U(t).unit??``}`)},[()=>`width: ${Math.min(U(t).value/U(t).max*100,100)}%`]),K(e,n)}),F(g),K(e,n)};J(me,e=>{U(v)&&e(he)}),F(ue);var ge=V(ue,4),_e=z(ge),ve=V(z(_e),2),ye=z(ve,!0);F(ve),F(_e);var be=V(_e,2),xe=e=>{var n=vf(),r=B(n);{let e=I(()=>`--sf-center-max`in t.overrides);$(r,{label:`Max width`,get value(){return U(l)},min:30,max:160,step:1,unit:`rem`,help:`--sf-center-max — max-width of the .sf-center centering wrapper`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-center-max`,`${e}rem`),onReset:()=>t.onReset(`--sf-center-max`),rawDefault:`var(--sf-container-default)`,get variableOptions(){return cf},get currentRaw(){return t.overrides[`--sf-center-max`]},onRawSet:e=>t.onSet(`--sf-center-max`,e)})}var i=V(r,2);{let e=I(()=>`--sf-center-gutter`in t.overrides);$(i,{label:`Gutter`,get value(){return U(u)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-center-gutter — minimum side padding inside the center wrapper`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-center-gutter`,`${e}rem`),onReset:()=>t.onReset(`--sf-center-gutter`),rawDefault:`var(--sf-gutter)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-center-gutter`]},onRawSet:e=>t.onSet(`--sf-center-gutter`,e)})}K(e,n)};J(be,e=>{U(y)&&e(xe)}),F(ge);var Se=V(ge,4),Ce=z(Se),we=V(z(Ce),2),Te=z(we,!0);F(we),F(Ce);var Ee=V(Ce,2),De=e=>{var n=bf(),r=B(n);{let e=I(()=>`--sf-grid-min`in t.overrides);$(r,{label:`Grid min cell width`,get value(){return U(d)},min:8,max:40,step:.5,unit:`rem`,help:`sf-grid minimum column width — browser auto-fills columns`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-grid-min`,`${e}rem`),onReset:()=>t.onReset(`--sf-grid-min`)})}var a=V(r,2),o=V(z(a),2);Y(o,20,()=>[{label:`xs`,token:`--sf-grid-min-xs`,def:10},{label:`s`,token:`--sf-grid-min-s`,def:13},{label:`m`,token:`--sf-grid-min-m`,def:16},{label:`l`,token:`--sf-grid-min-l`,def:20},{label:`xl`,token:`--sf-grid-min-xl`,def:24},{label:`2xl`,token:`--sf-grid-min-2xl`,def:28}],e=>e.token,(e,n)=>{{let r=I(()=>i(t.overrides[n.token],n.def)),a=I(()=>n.token in t.overrides);$(e,{get label(){return n.label},get value(){return U(r)},min:6,max:40,step:.5,unit:`rem`,get overridden(){return U(a)},onChange:e=>t.onSet(n.token,`${e}rem`),onReset:()=>t.onReset(n.token)})}}),F(o),F(a);var s=V(a,2),c=V(z(s),2);Y(c,20,()=>Array.from({length:8}),ii,(e,t)=>{K(e,yf())}),F(c),F(s),H(e=>Z(c,e),[()=>`grid-template-columns: repeat(auto-fill, minmax(${Math.min(U(d)*16*(360/1200),120)}px, 1fr))`]),K(e,n)};J(Ee,e=>{U(b)&&e(De)}),F(Se);var P=V(Se,4),Oe=z(P),ke=V(z(Oe),2),Ae=z(ke,!0);F(ke),F(Oe);var je=V(Oe,2),Ne=e=>{var n=Sf(),r=B(n),i=z(r),a=V(z(i),2);{let e=I(()=>`--sf-header-height-mobile`in t.overrides);$(a,{label:``,get value(){return U(f)},min:2,max:8,step:.25,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-header-height-mobile`,`${e}rem`),onReset:()=>t.onReset(`--sf-header-height-mobile`)})}F(i);var o=V(i,2),s=V(z(o),2);{let e=I(()=>`--sf-header-height-desktop`in t.overrides);$(s,{label:``,get value(){return U(p)},min:3,max:10,step:.25,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-header-height-desktop`,`${e}rem`),onReset:()=>t.onReset(`--sf-header-height-desktop`)})}F(o),F(r);var c=V(r,2),l=z(c),u=V(z(l),2);Y(u,20,()=>[1,2,3],e=>e,(e,t)=>{K(e,xf())}),F(u),F(l);var d=V(l,2),m=z(d);F(d),F(c),H(e=>{Z(l,e),q(m,`${U(f)??``}rem mobile · ${U(p)??``}rem desktop`)},[()=>`height: ${Math.min(U(f)*12,64)}px`]),K(e,n)};J(je,e=>{U(x)&&e(Ne)}),F(P);var Pe=V(P,4),Fe=z(Pe),Ie=V(z(Fe),2),Le=z(Ie,!0);F(Ie),F(Fe);var Re=V(Fe,2),ze=e=>{var n=Cf(),r=V(B(n),2),i=z(r),a=V(z(i),2);{let e=I(()=>`--sf-sticky-offset-mobile`in t.overrides);$(a,{label:``,get value(){return U(h)},min:0,max:12,step:.25,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-sticky-offset-mobile`,`${e}rem`),onReset:()=>t.onReset(`--sf-sticky-offset-mobile`),rawDefault:`var(--sf-header-height-mobile)`,get currentRaw(){return t.overrides[`--sf-sticky-offset-mobile`]},onRawSet:e=>t.onSet(`--sf-sticky-offset-mobile`,e)})}F(i);var o=V(i,2),s=V(z(o),2);{let e=I(()=>`--sf-sticky-offset-desktop`in t.overrides);$(s,{label:``,get value(){return U(g)},min:0,max:12,step:.25,unit:`rem`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-sticky-offset-desktop`,`${e}rem`),onReset:()=>t.onReset(`--sf-sticky-offset-desktop`),rawDefault:`var(--sf-header-height-desktop)`,get currentRaw(){return t.overrides[`--sf-sticky-offset-desktop`]},onRawSet:e=>t.onSet(`--sf-sticky-offset-desktop`,e)})}F(o),F(r),K(e,n)};J(Re,e=>{U(S)&&e(ze)}),F(Pe);var Be=V(Pe,4),Ve=z(Be),He=V(z(Ve),2),Ge=z(He,!0);F(He),F(Ve);var Ke=V(Ve,2),qe=e=>{var n=wf(),r=B(n);{let e=I(()=>`--sf-sidebar-width`in t.overrides);$(r,{label:`Sidebar width`,get value(){return U(m)},min:10,max:32,step:.5,unit:`rem`,help:`--sf-sidebar-width — default sidebar / drawer width`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-sidebar-width`,`${e}rem`),onReset:()=>t.onReset(`--sf-sidebar-width`)})}var i=V(r,2),a=z(i),o=z(a),s=z(o);F(o),F(a),Me(2),F(i),H(e=>{Z(a,e),q(s,`${U(m)??``}rem`)},[()=>`width: ${Math.min(U(m)*3.5,100)}px`]),K(e,n)};J(Ke,e=>{U(C)&&e(qe)}),F(Be);var Je=V(Be,4),Ye=z(Je),Xe=V(z(Ye),2),Ze=z(Xe,!0);F(Xe),F(Ye);var Qe=V(Ye,2),$e=e=>{var n=Tf();Y(n,21,()=>_,e=>e.token,(e,n)=>{{let r=I(()=>O(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},get min(){return U(n).min},get max(){return U(n).max},get step(){return U(n).step},get unit(){return U(n).unit},get help(){return U(n).token},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,U(n).unit?`${e}${U(n).unit}`:String(e)),onReset:()=>t.onReset(U(n).token)})}}),F(n),K(e,n)};J(Qe,e=>{U(w)&&e($e)}),F(Je);var et=V(Je,4),tt=z(et),nt=V(z(tt),2),rt=z(nt,!0);F(nt),F(tt);var it=V(tt,2),at=e=>{var i=Af(),a=z(i),o=V(z(a),2);{let e=I(()=>`--sf-switcher-threshold`in t.overrides);$(o,{label:`Threshold`,get value(){return U(k)},min:10,max:60,step:1,unit:`rem`,help:`--sf-switcher-threshold — width below which .sf-switcher stacks vertically`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-switcher-threshold`,`${e}rem`),onReset:()=>t.onReset(`--sf-switcher-threshold`)})}F(a);var s=V(a,2),c=V(z(s),2);{let e=I(()=>`--sf-sidebar-min-width`in t.overrides);$(c,{label:`Content min width`,get value(){return U(A)},min:20,max:80,step:1,unit:`%`,help:`--sf-sidebar-min-width — minimum width of the .sf-sidebar content column before it wraps`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-sidebar-min-width`,`${e}%`),onReset:()=>t.onReset(`--sf-sidebar-min-width`)})}F(s);var l=V(s,2);Y(V(z(l),2),16,()=>[{label:`Align`,token:`--sf-cluster-align`,def:`center`,opts:[`flex-start`,`center`,`flex-end`,`stretch`,`baseline`]},{label:`Justify`,token:`--sf-cluster-justify`,def:`flex-start`,opts:[`flex-start`,`center`,`flex-end`,`space-between`,`space-around`]}],e=>e.token,(e,n)=>{var i=Of(),a=z(i),o=z(a,!0);F(a);var s=V(a,2);Y(s,20,()=>n.opts,e=>e,(e,t)=>{var n=Ef(),i=z(n,!0);F(n);var a={};H(()=>{Z(n,`background:${U(r)};`),q(i,t),a!==(a=t)&&(n.value=(n.__value=t)??``)}),K(e,n)}),F(s);var c;Di(s);var l=V(s,2),u=e=>{var r=Df();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(l,e=>{n.token in t.overrides&&e(u)}),F(i),H(()=>{q(o,n.label),c!==(c=t.overrides[n.token]??n.def)&&(s.value=(s.__value=t.overrides[n.token]??n.def)??``,Ei(s,t.overrides[n.token]??n.def))}),W(`change`,s,e=>{let r=e.target.value;r===n.def?t.onReset(n.token):t.onSet(n.token,r)}),K(e,i)}),F(l);var u=V(l,2),d=V(z(u),4);{let e=I(()=>`--sf-equal-min-col`in t.overrides);$(d,{label:`Min column width`,get value(){return U(ee)},min:6,max:36,step:.5,unit:`rem`,help:`--sf-equal-min-col — column-width floor for .sf-equal`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-equal-min-col`,`${e}rem`),onReset:()=>t.onReset(`--sf-equal-min-col`)})}var f=V(d,2);{let e=I(()=>`--sf-equal-rule-width`in t.overrides);$(f,{label:`Rule width`,get value(){return U(te)},min:0,max:4,step:.5,unit:`px`,help:`--sf-equal-rule-width — column-rule width between flowing columns, 0 = off`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-equal-rule-width`,`${e}px`),onReset:()=>t.onReset(`--sf-equal-rule-width`)})}var p=V(f,2),m=V(z(p),2);Y(m,20,()=>n,e=>e,(e,t)=>{var n=Ef(),i=z(n,!0);F(n);var a={};H(()=>{Z(n,`background:${U(r)};`),q(i,t),a!==(a=t)&&(n.value=(n.__value=t)??``)}),K(e,n)}),F(m);var h;Di(m);var g=V(m,2),_=e=>{var n=Df();W(`click`,n,()=>t.onReset(`--sf-equal-rule-style`)),K(e,n)};J(g,e=>{`--sf-equal-rule-style`in t.overrides&&e(_)}),F(p);var v=V(p,2),y=V(z(v),2);{let e=I(()=>`--sf-equal-rule-color`in t.overrides);ku(y,{token:`--sf-equal-rule-color`,get value(){return U(j)},placeholder:`inherits border`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-equal-rule-color`,e),onReset:()=>t.onReset(`--sf-equal-rule-color`)})}F(v),F(u);var b=V(u,2),x=V(z(b),2);{let e=I(()=>`--sf-cover-min-height`in t.overrides);$(x,{label:`Min height`,get value(){return U(ne)},min:20,max:100,step:1,unit:`dvh`,help:`--sf-cover-min-height — minimum height of the .sf-cover layout`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-cover-min-height`,`${e}dvh`),onReset:()=>t.onReset(`--sf-cover-min-height`)})}F(b);var S=V(b,2),C=V(z(S),4);Y(C,20,()=>N,e=>e,(e,n)=>{var r=kf(),i=z(r,!0);F(r),H(e=>{X(r,1,e),q(i,n)},[()=>`py-1 rounded-lg text-[9px] border transition-all cursor-pointer font-mono ${U(oe).replace(/\s/g,``)===n.replace(/\s/g,``)?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`]),W(`click`,r,()=>n===`16 / 9`?t.onReset(`--sf-frame-ratio`):t.onSet(`--sf-frame-ratio`,n)),K(e,r)}),F(C),F(S);var w=V(S,2),T=V(z(w),4);Y(T,21,()=>ce,e=>e.value,(e,n)=>{var r=kf(),i=z(r,!0);F(r),H(()=>{X(r,1,`py-1 rounded-lg text-[9px] border transition-all cursor-pointer ${U(se)===U(n).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,U(n).label)}),W(`click`,r,()=>U(n).value===`max-content`?t.onReset(`--sf-reel-item-width`):t.onSet(`--sf-reel-item-width`,U(n).value)),K(e,r)}),F(T);var E=V(T,2),D=V(z(E),2);zi(D);var O=V(D,2),le=e=>{var n=Df();W(`click`,n,()=>t.onReset(`--sf-reel-height`)),K(e,n)};J(O,e=>{`--sf-reel-height`in t.overrides&&e(le)}),F(E),F(w);var ue=V(w,2),de=V(z(ue),2);{let e=I(()=>`--sf-imposter-margin`in t.overrides);$(de,{label:`Margin`,get value(){return U(M)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-imposter-margin — viewport inset for the centered .sf-imposter overlay`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-imposter-margin`,`${e}rem`),onReset:()=>t.onReset(`--sf-imposter-margin`),rawDefault:`var(--sf-space-m)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-imposter-margin`]},onRawSet:e=>t.onSet(`--sf-imposter-margin`,e)})}F(ue);var fe=V(ue,2),pe=V(z(fe),2);{let e=I(()=>`--sf-content-width`in t.overrides);$(pe,{label:`Content width`,get value(){return U(ie)},min:40,max:120,step:1,unit:`rem`,help:`--sf-content-width — default reading column width in .sf-content-grid`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-content-width`,`${e}rem`),onReset:()=>t.onReset(`--sf-content-width`),rawDefault:`var(--sf-container-default)`,get variableOptions(){return cf},get currentRaw(){return t.overrides[`--sf-content-width`]},onRawSet:e=>t.onSet(`--sf-content-width`,e)})}var me=V(pe,2);{let e=I(()=>`--sf-breakout-width`in t.overrides);$(me,{label:`Breakout width`,get value(){return U(re)},min:50,max:160,step:1,unit:`rem`,help:`--sf-breakout-width — wide breakout column width in .sf-content-grid`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-breakout-width`,`${e}rem`),onReset:()=>t.onReset(`--sf-breakout-width`),rawDefault:`var(--sf-container-wide)`,get variableOptions(){return cf},get currentRaw(){return t.overrides[`--sf-breakout-width`]},onRawSet:e=>t.onSet(`--sf-breakout-width`,e)})}F(fe);var he=V(fe,2),ge=V(z(he),2);{let e=I(()=>`--sf-alternate-inner-gap`in t.overrides);$(ge,{label:`Inner gap`,get value(){return U(ae)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-alternate-inner-gap — gap between media and text within an .sf-alternate row`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-alternate-inner-gap`,`${e}rem`),onReset:()=>t.onReset(`--sf-alternate-inner-gap`),rawDefault:`var(--sf-gap)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-alternate-inner-gap`]},onRawSet:e=>t.onSet(`--sf-alternate-inner-gap`,e)})}F(he),F(i),H(()=>{h!==(h=t.overrides[`--sf-equal-rule-style`]??`solid`)&&(m.value=(m.__value=t.overrides[`--sf-equal-rule-style`]??`solid`)??``,Ei(m,t.overrides[`--sf-equal-rule-style`]??`solid`)),Bi(D,t.overrides[`--sf-reel-height`]??``)}),W(`change`,m,e=>{let n=e.target.value;n===`solid`?t.onReset(`--sf-equal-rule-style`):t.onSet(`--sf-equal-rule-style`,n)}),W(`input`,D,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-reel-height`,n):t.onReset(`--sf-reel-height`)}),K(e,i)};J(it,e=>{U(T)&&e(at)}),F(et);var ot=V(et,4),st=z(ot),ct=V(z(st),2),lt=z(ct,!0);F(ct),F(st);var ut=V(st,2),dt=e=>{var n=Mf();Y(V(z(n),2),16,()=>[{label:`Square`,token:`--sf-ratio-square`,def:`1`},{label:`Portrait`,token:`--sf-ratio-portrait`,def:`3 / 4`},{label:`3:2`,token:`--sf-ratio-3-2`,def:`3 / 2`},{label:`4:3`,token:`--sf-ratio-4-3`,def:`4 / 3`},{label:`Video`,token:`--sf-ratio-video`,def:`16 / 9`},{label:`Cinema`,token:`--sf-ratio-cinema`,def:`21 / 9`},{label:`Golden`,token:`--sf-ratio-golden`,def:`1.618 / 1`}],e=>e.token,(e,n)=>{var r=jf(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Df();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.def)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(n),K(e,n)};J(ut,e=>{U(D)&&e(dt)}),F(ot);var ft=V(ot,4),pt=z(ft),mt=V(z(pt),2),ht=z(mt,!0);F(mt),F(pt);var gt=V(pt,2),_t=e=>{var n=Nf(),a=V(z(n),2);Y(a,16,()=>[{label:`Fit`,token:`--sf-bg-layer-fit`,placeholder:`cover`,opts:[`cover`,`contain`,`fill`,`none`,`scale-down`]},{label:`Position`,token:`--sf-bg-layer-position`,placeholder:`50% 50%`,opts:[`50% 50%`,`top`,`bottom`,`left`,`right`,`center`]}],e=>e.token,(e,n)=>{var i=Of(),a=z(i),o=z(a,!0);F(a);var s=V(a,2);Y(s,20,()=>n.opts,e=>e,(e,t)=>{var n=Ef(),i=z(n,!0);F(n);var a={};H(()=>{Z(n,`background:${U(r)};`),q(i,t),a!==(a=t)&&(n.value=(n.__value=t)??``)}),K(e,n)}),F(s);var c;Di(s);var l=V(s,2),u=e=>{var r=Df();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(l,e=>{n.token in t.overrides&&e(u)}),F(i),H(()=>{q(o,n.label),c!==(c=t.overrides[n.token]??n.placeholder)&&(s.value=(s.__value=t.overrides[n.token]??n.placeholder)??``,Ei(s,t.overrides[n.token]??n.placeholder))}),W(`change`,s,e=>{let r=e.target.value;r===n.placeholder?t.onReset(n.token):t.onSet(n.token,r)}),K(e,i)});var o=V(a,2);{let e=I(()=>i(t.overrides[`--sf-bg-layer-inset`],0)),n=I(()=>`--sf-bg-layer-inset`in t.overrides);$(o,{label:`Inset`,get value(){return U(e)},min:0,max:4,step:.25,unit:`rem`,help:`--sf-bg-layer-inset — inset the background from the container edges`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-bg-layer-inset`,`${e}rem`),onReset:()=>t.onReset(`--sf-bg-layer-inset`)})}var s=V(o,2);{let e=I(()=>i(t.overrides[`--sf-bg-layer-radius`],0)),n=I(()=>`--sf-bg-layer-radius`in t.overrides);$(s,{label:`Radius`,get value(){return U(e)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-bg-layer-radius — corner radius of the background element`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-bg-layer-radius`,`${e}rem`),onReset:()=>t.onReset(`--sf-bg-layer-radius`)})}var c=V(s,2);{let e=I(()=>i(t.overrides[`--sf-bg-layer-z`],-2)),n=I(()=>`--sf-bg-layer-z`in t.overrides);$(c,{label:`Z-index`,get value(){return U(e)},min:-10,max:0,step:1,help:`--sf-bg-layer-z — stack order of the background pseudo-element (typically negative)`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-bg-layer-z`,String(e)),onReset:()=>t.onReset(`--sf-bg-layer-z`)})}F(n),K(e,n)};J(gt,e=>{U(E)&&e(_t)}),F(ft),F(le),H(()=>{Q(de,`aria-expanded`,U(v)),q(pe,U(v)?`▲`:`▼`),Q(_e,`aria-expanded`,U(y)),q(ye,U(y)?`▲`:`▼`),Q(Ce,`aria-expanded`,U(b)),q(Te,U(b)?`▲`:`▼`),Q(Oe,`aria-expanded`,U(x)),q(Ae,U(x)?`▲`:`▼`),Q(Fe,`aria-expanded`,U(S)),q(Le,U(S)?`▲`:`▼`),Q(Ve,`aria-expanded`,U(C)),q(Ge,U(C)?`▲`:`▼`),Q(Ye,`aria-expanded`,U(w)),q(Ze,U(w)?`▲`:`▼`),Q(tt,`aria-expanded`,U(T)),q(rt,U(T)?`▲`:`▼`),Q(st,`aria-expanded`,U(D)),q(lt,U(D)?`▲`:`▼`),Q(pt,`aria-expanded`,U(E)),q(ht,U(E)?`▲`:`▼`)}),W(`click`,de,()=>{R(v,!U(v))}),W(`click`,_e,()=>{R(y,!U(y))}),W(`click`,Ce,()=>{R(b,!U(b))}),W(`click`,Oe,()=>{R(x,!U(x))}),W(`click`,Fe,()=>{R(S,!U(S))}),W(`click`,Ve,()=>{R(C,!U(C))}),W(`click`,Ye,()=>{R(w,!U(w))}),W(`click`,tt,()=>{R(T,!U(T))}),W(`click`,st,()=>{R(D,!U(D))}),W(`click`,pt,()=>{R(E,!U(E))}),K(e,le),We()}Br([`click`,`change`,`input`]);var If=G(`

Drives --sf-color-border--strong, --subtle, --translucent automatically.

`,1),Lf=G(`
`),Rf=G(`
`,1),zf=G(``),Bf=G(`
`),Vf=G(`
Border sample
`,1),Hf=G(`
Color
`,1),Uf=G(`
Ring color
Focus preview
`,1),Wf=G(`
`),Gf=G(`
`),Kf=G(`
`),qf=G(`

--sf-media-radius — 0 by default (off). Rounds every <img>/<figure> globally via a + zero-specificity :where() rule; .sf-bg-layer and component-level radii still win.

`,1),Jf=G(`
`),Yf=G(`
`),Xf=G(`
Radius
`);function Zf(e,t){Ue(t,!0);let n=[`solid`,`dashed`,`dotted`],r=[`xs`,`s`,`m`,`l`,`xl`,`2xl`,`full`],i={xs:2,s:4,m:8,l:12,xl:16,"2xl":24,full:9999},a=[{step:`xs`,name:`--sf-radius-xs`,default:2,max:16,step_size:.5,rawDefault:`calc(2px * var(--sf-radius-scale))`},{step:`s`,name:`--sf-radius-s`,default:4,max:24,step_size:.5,rawDefault:`calc(4px * var(--sf-radius-scale))`},{step:`m`,name:`--sf-radius-m`,default:8,max:32,step_size:1,rawDefault:`calc(8px * var(--sf-radius-scale))`},{step:`l`,name:`--sf-radius-l`,default:12,max:48,step_size:1,rawDefault:`calc(12px * var(--sf-radius-scale))`},{step:`xl`,name:`--sf-radius-xl`,default:16,max:64,step_size:1,rawDefault:`calc(16px * var(--sf-radius-scale))`},{step:`2xl`,name:`--sf-radius-2xl`,default:24,max:80,step_size:2,rawDefault:`calc(24px * var(--sf-radius-scale))`}],o=[{label:`Field radius`,token:`--sf-field-radius`,unit:`rem`,min:0,max:2,step:.05,default:.5,rawDefault:`var(--sf-radius-m)`,help:`--sf-field-radius`,variableOptions:of},{label:`Field padding block`,token:`--sf-field-padding-block`,unit:`rem`,min:0,max:1,step:.025,default:.375,rawDefault:`var(--sf-space-xs)`,help:`--sf-field-padding-block`,variableOptions:af},{label:`Field padding inline`,token:`--sf-field-padding-inline`,unit:`rem`,min:0,max:2,step:.025,default:.75,rawDefault:`var(--sf-space-s)`,help:`--sf-field-padding-inline`,variableOptions:af}],s=Kl.borders??[],c=L(!1),l=L(!1),u=L(!1),d=L(!1),f=L(!1),p=L(!1),m=L(!1),h=L(!1),g=L(!1),_=L(!1);function v(e,t,n){if(!e)return t;let r=parseFloat(n?e.replace(n,``):e);return isNaN(r)?t:r}let y=I(()=>v(t.overrides[`--sf-radius-scale`],1)),b=I(()=>v(t.overrides[`--sf-border-scale`],1)),x=I(()=>v(t.overrides[`--sf-focus-ring-width`],2,`px`)),S=I(()=>v(t.overrides[`--sf-focus-ring-offset`],2,`px`)),C=I(()=>v(t.overrides[`--sf-divider-width`]?.replace(`px`,``),1)),w=I(()=>v(t.overrides[`--sf-divider-gap`]?.replace(`rem`,``),1)),T=I(()=>t.overrides[`--sf-color-border`]??``),E=I(()=>t.overrides[`--sf-border-style`]??`solid`),D=I(()=>t.overrides[`--sf-focus-ring-color`]??``),O=I(()=>t.overrides[`--sf-divider-color`]??``),k=I(()=>v(t.overrides[`--sf-media-radius`]?.replace(`rem`,``),0));function A(e,n){return t.overrides[e]??n}function ee(e){let n=t.overrides[e.name];if(!n||/^(var|calc|clamp)\(/.test(n.trim()))return e.default;let r=parseFloat(n);return isNaN(r)?e.default:r}function te(e){let n=t.overrides[e.token];if(!n||/^(var|calc|clamp)\(/.test(n.trim()))return e.default;let r=parseFloat(n);return isNaN(r)?e.default:r}var j=Xf(),ne=z(j),M=z(ne),re=V(z(M),2),ie=z(re,!0);F(re),F(M);var ae=V(M,2),oe=e=>{var n=If(),r=B(n);{let e=I(()=>`--sf-color-border`in t.overrides);ku(r,{token:`--sf-color-border`,get value(){return U(T)},placeholder:`auto-derived`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-color-border`,e),onReset:()=>t.onReset(`--sf-color-border`)})}Me(2),K(e,n)};J(ae,e=>{U(c)&&e(oe)}),F(ne);var se=V(ne,4),N=z(se),ce=V(z(N),2),le=z(ce,!0);F(ce),F(N);var ue=V(N,2),de=e=>{var n=Rf(),r=B(n);{let e=I(()=>`--sf-border-scale`in t.overrides);$(r,{label:`Border scale`,get value(){return U(b)},min:0,max:4,step:.25,help:`Multiplier applied to all border widths. 0 hides all borders.`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-border-scale`,String(e)),onReset:()=>t.onReset(`--sf-border-scale`)})}var i=V(r,2);{let e=I(()=>v(t.overrides[`--sf-border-width-hairline`]?.replace(`px`,``),.5)),n=I(()=>`--sf-border-width-hairline`in t.overrides);$(i,{label:`Hairline`,get value(){return U(e)},min:0,max:1,step:.25,unit:`px`,help:`--sf-border-width-hairline — ultra-thin border for retina displays`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-border-width-hairline`,`${e}px`),onReset:()=>t.onReset(`--sf-border-width-hairline`)})}var a=V(i,2);{let e=I(()=>v(t.overrides[`--sf-box-border-width`]?.replace(`px`,``),0)),n=I(()=>`--sf-box-border-width`in t.overrides);$(a,{label:`Box border`,get value(){return U(e)},min:0,max:4,step:.5,unit:`px`,help:`--sf-box-border-width — box-shadow border drawn without affecting layout`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-box-border-width`,`${e}px`),onReset:()=>t.onReset(`--sf-box-border-width`)})}var o=V(a,2);Y(o,20,()=>[1,2,3,4],e=>e,(e,t)=>{var n=Lf(),r=z(n),i=z(r);F(r);var a=V(r,2),o=V(a,2),s=z(o);F(o),F(n),H((e,n)=>{q(i,`${t??``}px →`),Z(a,e),q(s,`${n??``}px`)},[()=>`height: ${Math.max(t*U(b),.5)}px`,()=>(t*U(b)).toFixed(1)]),K(e,n)}),F(o),K(e,n)};J(ue,e=>{U(l)&&e(de)}),F(se);var fe=V(se,4),pe=z(fe),me=V(z(pe),2),he=z(me,!0);F(me),F(pe);var ge=V(pe,2),_e=e=>{var r=Vf(),i=B(r);Y(i,20,()=>[{label:`Border`,token:`--sf-border-style`,default:`solid`},{label:`Divider`,token:`--sf-divider-style`,default:`solid`}],e=>e.token,(e,r)=>{var i=Bf(),a=z(i),o=z(a,!0);F(a);var s=V(a,2);Y(s,20,()=>n,e=>e,(e,n)=>{let i=I(()=>A(r.token,r.default));var a=zf(),o=z(a),s=V(o);F(a),H(()=>{X(a,1,`px-2 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer text-center ${U(i)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),Z(o,`width: 20px; height: 0; border-bottom: 2px ${n} currentColor; opacity: 0.7`),q(s,` ${n??``}`)}),W(`click`,a,()=>n===r.default?t.onReset(r.token):t.onSet(r.token,n)),K(e,a)}),F(s),F(i),H(()=>q(o,r.label)),K(e,i)}),F(i);var a=V(i,2),o=z(a),s=V(o,2),c=z(s);F(s),F(a),H((e,t)=>{Z(o,e),q(c,`${t??``}px · ${U(E)??``}`)},[()=>`border: ${Math.max(U(b),.5)}px ${U(E)} ${U(T)||`var(--sf-color-border, #64748b)`}`,()=>(1*U(b)).toFixed(1)]),K(e,r)};J(ge,e=>{U(u)&&e(_e)}),F(fe);var ve=V(fe,4),ye=z(ve),be=V(z(ye),2),xe=z(be,!0);F(be),F(ye);var Se=V(ye,2),Ce=e=>{var n=Hf(),r=B(n),i=V(z(r),2);{let e=I(()=>`--sf-divider-color`in t.overrides);ku(i,{token:`--sf-divider-color`,get value(){return U(O)},placeholder:`inherits border`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-divider-color`,e),onReset:()=>t.onReset(`--sf-divider-color`)})}F(r);var a=V(r,2);{let e=I(()=>`--sf-divider-width`in t.overrides);$(a,{label:`Width`,get value(){return U(C)},min:.5,max:4,step:.5,unit:`px`,help:`--sf-divider-width`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-divider-width`,`${e}px`),onReset:()=>t.onReset(`--sf-divider-width`),rawDefault:`var(--sf-border-width-1)`,get variableOptions(){return sf},get currentRaw(){return t.overrides[`--sf-divider-width`]},onRawSet:e=>t.onSet(`--sf-divider-width`,e)})}var o=V(a,2);{let e=I(()=>`--sf-divider-gap`in t.overrides);$(o,{label:`Gap`,get value(){return U(w)},min:0,max:4,step:.125,unit:`rem`,help:`--sf-divider-gap — spacing around divider lines`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-divider-gap`,`${e}rem`),onReset:()=>t.onReset(`--sf-divider-gap`),rawDefault:`var(--sf-space-m)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-divider-gap`]},onRawSet:e=>t.onSet(`--sf-divider-gap`,e)})}K(e,n)};J(Se,e=>{U(d)&&e(Ce)}),F(ve);var we=V(ve,4),Te=z(we),Ee=V(z(Te),2),De=z(Ee,!0);F(Ee),F(Te);var P=V(Te,2),Oe=e=>{var n=Uf(),r=B(n);{let e=I(()=>`--sf-focus-ring-width`in t.overrides);$(r,{label:`Ring width`,get value(){return U(x)},min:0,max:6,step:.5,unit:`px`,help:`Thickness of the keyboard focus indicator`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-focus-ring-width`,`${e}px`),onReset:()=>t.onReset(`--sf-focus-ring-width`)})}var i=V(r,2);{let e=I(()=>`--sf-focus-ring-offset`in t.overrides);$(i,{label:`Ring offset`,get value(){return U(S)},min:0,max:8,step:.5,unit:`px`,help:`Gap between element edge and focus ring`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-focus-ring-offset`,`${e}px`),onReset:()=>t.onReset(`--sf-focus-ring-offset`)})}var a=V(i,2),o=V(z(a),2);{let e=I(()=>`--sf-focus-ring-color`in t.overrides);ku(o,{token:`--sf-focus-ring-color`,get value(){return U(D)},placeholder:`default (action)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-focus-ring-color`,e),onReset:()=>t.onReset(`--sf-focus-ring-color`)})}F(a);var s=V(a,2),c=z(s);F(s),H(()=>Z(c,`outline: ${U(x)}px solid ${U(D)||`oklch(0.7 0.2 235)`}; outline-offset: ${U(S)}px`)),K(e,n)};J(P,e=>{U(f)&&e(Oe)}),F(we);var ke=V(we,6),Ae=z(ke),je=V(z(Ae),2),Ne=z(je,!0);F(je),F(Ae);var Pe=V(Ae,2),Fe=e=>{var n=Wf();Y(n,21,()=>a,e=>e.name,(e,n)=>{{let r=I(()=>ee(U(n))),i=I(()=>U(n).name in t.overrides);$(e,{get label(){return U(n).step},get value(){return U(r)},min:0,get max(){return U(n).max},get step(){return U(n).step_size},unit:`px`,get overridden(){return U(i)},onChange:e=>t.onSet(U(n).name,`${e}px`),onReset:()=>t.onReset(U(n).name),get rawDefault(){return U(n).rawDefault},get currentRaw(){return t.overrides[U(n).name]},onRawSet:e=>t.onSet(U(n).name,e)})}}),F(n),K(e,n)};J(Pe,e=>{U(g)&&e(Fe)}),F(ke);var Ie=V(ke,2),Le=z(Ie),Re=V(z(Le),2),ze=z(Re,!0);F(Re),F(Le);var Be=V(Le,2),Ve=e=>{var t=Kf(),n=z(t);Y(n,20,()=>r,e=>e,(e,t)=>{let n=I(()=>i[t]??6),r=I(()=>t===`full`?9999:U(n)*U(y));var a=Gf(),o=z(a),s=V(o,2),c=z(s,!0);F(s),F(a),H(e=>{Z(o,e),q(c,t)},[()=>`border-radius: ${Math.min(U(r),9999)}px`]),K(e,a)}),F(n),F(t),K(e,t)};J(Be,e=>{U(m)&&e(Ve)}),F(Ie);var He=V(Ie,4),Ge=z(He),Ke=V(z(Ge),2),qe=z(Ke,!0);F(Ke),F(Ge);var Je=V(Ge,2),Ye=e=>{var n=qf(),r=V(B(n),2);{let e=I(()=>`--sf-media-radius`in t.overrides);$(r,{label:`Radius`,get value(){return U(k)},min:0,max:2,step:.05,unit:`rem`,help:`--sf-media-radius`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-media-radius`,`${e}rem`),onReset:()=>t.onReset(`--sf-media-radius`),rawDefault:`var(--sf-radius-m)`,get variableOptions(){return of},get currentRaw(){return t.overrides[`--sf-media-radius`]},onRawSet:e=>t.onSet(`--sf-media-radius`,e)})}var i=V(r,2),a=z(i);F(i),H(()=>Z(a,`border-radius: ${U(k)}rem`)),K(e,n)};J(Je,e=>{U(h)&&e(Ye)}),F(He);var Xe=V(He,4),Ze=z(Xe),Qe=V(z(Ze),2),$e=z(Qe,!0);F(Qe),F(Ze);var et=V(Ze,2),tt=e=>{var n=Jf();Y(n,21,()=>o,e=>e.token,(e,n)=>{{let r=I(()=>te(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},get min(){return U(n).min},get max(){return U(n).max},get step(){return U(n).step},get unit(){return U(n).unit},get help(){return U(n).help},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}${U(n).unit}`),onReset:()=>t.onReset(U(n).token),get rawDefault(){return U(n).rawDefault},get variableOptions(){return U(n).variableOptions},get currentRaw(){return t.overrides[U(n).token]},onRawSet:e=>t.onSet(U(n).token,e)})}}),F(n),K(e,n)};J(et,e=>{U(_)&&e(tt)}),F(Xe);var nt=V(Xe,4),rt=z(nt),it=V(z(rt),2),at=z(it,!0);F(it),F(rt);var ot=V(rt,2),st=e=>{var n=Yf();Y(n,21,()=>s,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(n),K(e,n)};J(ot,e=>{U(p)&&e(st)}),F(nt),F(j),H(()=>{Q(M,`aria-expanded`,U(c)),q(ie,U(c)?`▲`:`▼`),Q(N,`aria-expanded`,U(l)),q(le,U(l)?`▲`:`▼`),Q(pe,`aria-expanded`,U(u)),q(he,U(u)?`▲`:`▼`),Q(ye,`aria-expanded`,U(d)),q(xe,U(d)?`▲`:`▼`),Q(Te,`aria-expanded`,U(f)),q(De,U(f)?`▲`:`▼`),Q(Ae,`aria-expanded`,U(g)),q(Ne,U(g)?`▲`:`▼`),Q(Le,`aria-expanded`,U(m)),q(ze,U(m)?`▲`:`▼`),Q(Ge,`aria-expanded`,U(h)),q(qe,U(h)?`▲`:`▼`),Q(Ze,`aria-expanded`,U(_)),q($e,U(_)?`▲`:`▼`),Q(rt,`aria-expanded`,U(p)),q(at,U(p)?`▲`:`▼`)}),W(`click`,M,()=>{R(c,!U(c))}),W(`click`,N,()=>{R(l,!U(l))}),W(`click`,pe,()=>{R(u,!U(u))}),W(`click`,ye,()=>{R(d,!U(d))}),W(`click`,Te,()=>{R(f,!U(f))}),W(`click`,Ae,()=>{R(g,!U(g))}),W(`click`,Le,()=>{R(m,!U(m))}),W(`click`,Ge,()=>{R(h,!U(h))}),W(`click`,Ze,()=>{R(_,!U(_))}),W(`click`,rt,()=>{R(p,!U(p))}),K(e,j),We()}Br([`click`]);var Qf=G(`
`),$f=G(`
Shadow color

Warm, cool or brand-tinted shadows. Default uses neutral hue.

`),ep=G(`
Glow color

Which brand color radiates the glow. Defaults to primary.

`),tp=G(`

Glow disabled.

`),np=G(`
Shadow glow
Ambient glow on elevated surfaces
`,1),rp=G(`
`),ip=G(`
`);function ap(e,t){Ue(t,!0);let n=[`xs`,`s`,`m`,`l`,`xl`,`2xl`],r=Kl.shadows??[],i=I(()=>(()=>{let e=parseFloat(t.overrides[`--sf-shadow-lightness`]??`0.15`);return isFinite(e)?e:.15})()),a=I(()=>t.overrides[`--sf-shadow-color`]??``),o=I(()=>t.overrides[`--sf-shadow-glow-color`]??``),s=I(()=>t.overrides[`--sf-shadow-glow`]===`none`),c=L(!1),l=L(!1),u=L(!1);var d=ip(),f=z(d);Y(f,22,()=>n,e=>e,(e,t,n)=>{var r=Qf(),i=z(r),a=V(i,2),o=z(a,!0);F(a),F(r),H(()=>{Z(i,`width: ${40+U(n)*4}px; height: ${40+U(n)*4}px; box-shadow: var(--sf-shadow-${t})`),q(o,t)}),K(e,r)}),F(f);var p=V(f,4);{let e=I(()=>`--sf-shadow-lightness`in t.overrides);$(p,{label:`Shadow lightness`,get value(){return U(i)},min:0,max:.5,step:.01,help:`--sf-shadow-lightness — OKLCH lightness of the shadow color. Lower = darker, more visible shadows.`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-shadow-lightness`,String(e)),onReset:()=>t.onReset(`--sf-shadow-lightness`)})}var m=V(p,4),h=z(m),g=V(z(h),2),_=z(g,!0);F(g),F(h);var v=V(h,2),y=e=>{var n=$f(),r=V(z(n),2);{let e=I(()=>`--sf-shadow-color`in t.overrides);ku(r,{token:`--sf-shadow-color`,get value(){return U(a)},placeholder:`auto (neutral hue)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-shadow-color`,e),onReset:()=>t.onReset(`--sf-shadow-color`)})}Me(2),F(n),K(e,n)};J(v,e=>{U(c)&&e(y)}),F(m);var b=V(m,4),x=z(b),S=V(z(x),2),C=z(S,!0);F(S),F(x);var w=V(x,2),T=e=>{var n=np(),r=B(n),i=V(z(r),2),a=z(i);F(i),F(r);var c=V(r,2),l=e=>{var n=ep(),r=V(z(n),2);{let e=I(()=>`--sf-shadow-glow-color`in t.overrides);ku(r,{token:`--sf-shadow-glow-color`,get value(){return U(o)},placeholder:`default (primary color)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-shadow-glow-color`,e),onReset:()=>t.onReset(`--sf-shadow-glow-color`)})}Me(2),F(n),K(e,n)};J(c,e=>{U(s)||e(l)});var u=V(c,2),d=z(u);F(u);var f=V(u,2),p=e=>{K(e,tp())};J(f,e=>{U(s)&&e(p)}),H(()=>{Q(i,`aria-label`,U(s)?`Enable shadow glow`:`Disable shadow glow`),X(i,1,`w-9 h-5 rounded-full transition-colors relative cursor-pointer ${U(s)?`bg-black/10 dark:bg-white/10`:`bg-indigo-600`}`),X(a,1,`absolute top-0.5 w-4 h-4 bg-white rounded-full shadow transition-transform ${U(s)?`translate-x-0.5`:`translate-x-4`}`),Z(d,`box-shadow: ${U(s)?`none`:`var(--sf-shadow-glow)`}`)}),W(`click`,i,()=>{U(s)?t.onReset(`--sf-shadow-glow`):t.onSet(`--sf-shadow-glow`,`none`)}),K(e,n)};J(w,e=>{U(l)&&e(T)}),F(b);var E=V(b,4),D=z(E),O=V(z(D),2),k=z(O,!0);F(O),F(D);var A=V(D,2),ee=e=>{var n=rp();Y(n,21,()=>r,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(n),K(e,n)};J(A,e=>{U(u)&&e(ee)}),F(E),F(d),H(()=>{Q(h,`aria-expanded`,U(c)),q(_,U(c)?`▲`:`▼`),Q(x,`aria-expanded`,U(l)),q(C,U(l)?`▲`:`▼`),Q(D,`aria-expanded`,U(u)),q(k,U(u)?`▲`:`▼`)}),W(`click`,h,()=>{R(c,!U(c))}),W(`click`,x,()=>{R(l,!U(l))}),W(`click`,D,()=>{R(u,!U(u))}),K(e,d),We()}Br([`click`]);var op=G(`

Motion is disabled — duration & easing have no effect while scale is 0.

`),sp=G(``),cp=G(`(No effect while motion is disabled.)`),lp=G(`
`),up=G(`

Named duration tokens. Drag to set an absolute ms value, overriding the global scale.

`,1),dp=G(``),fp=G(`
`),pp=G(`

Edit the named easing tokens. Accepts any CSS timing function — cubic-bezier(…) or linear(…). Use “Live preview” above to feel a curve.

`,1),mp=G(``),hp=G(`
`),gp=G(`

One slider sets all five stagger delays (delay-1 through delay-5 are multiples of this base).

Stagger base
`,1),_p=G(``),vp=G(`
`),yp=G(`

Default animation-range for scroll-driven animations using the .sf-entrance--* / .sf-exit--* macros.

`,1),bp=G(`
Disable motion
Respects prefers-reduced-motion
Live preview
`);function xp(e,t){Ue(t,!0);let n=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`),r=[{label:`Instant`,token:`--sf-duration-instant`,base:100,max:300},{label:`Fast`,token:`--sf-duration-fast`,base:150,max:500},{label:`Normal`,token:`--sf-duration-normal`,base:250,max:800},{label:`Slow`,token:`--sf-duration-slow`,base:400,max:1200},{label:`Slower`,token:`--sf-duration-slower`,base:600,max:2e3}],i=[{label:`Linear`,token:`--sf-ease-linear`,value:`linear`,preview:`M0,40 L40,0`},{label:`Ease out`,token:`--sf-ease-out`,value:`cubic-bezier(0.25, 0, 0.15, 1)`,preview:`M0,40 C8,40 28,0 40,0`},{label:`Ease in`,token:`--sf-ease-in`,value:`cubic-bezier(0.5, 0, 0.75, 0.25)`,preview:`M0,40 C12,40 32,32 40,0`},{label:`Ease in-out`,token:`--sf-ease-in-out`,value:`cubic-bezier(0.4, 0, 0.2, 1)`,preview:`M0,40 C8,40 32,0 40,0`},{label:`Spring`,token:`--sf-ease-spring`,value:`linear(0, 0.5, 1.1, 0.95, 1.02, 1)`,preview:`M0,40 C10,20 20,-4 28,-2 S38,2 40,0`},{label:`Bounce`,token:`--sf-ease-bounce`,value:`linear(0, 0.35 18%, 1 32%, 0.86 42%, 1.02 56%, 0.98 72%, 1)`,preview:`M0,40 L12,16 L20,0 L26,6 L32,-1 L36,1 L40,0`},{label:`Elastic`,token:`--sf-ease-elastic`,value:`linear(0, 0.3, 1.2, 0.9, 1.05, 1)`,preview:`M0,40 C8,40 16,-10 24,-2 S36,2 40,0`},{label:`Overshoot`,token:`--sf-ease-overshoot`,value:`linear(0, 0.6 30%, 1.08 55%, 0.98 75%, 1)`,preview:`M0,40 C8,40 20,-10 40,0`}],a=[`--sf-animation-delay-1`,`--sf-animation-delay-2`,`--sf-animation-delay-3`,`--sf-animation-delay-4`,`--sf-animation-delay-5`],o=Kl.motion??[],s=I(()=>(()=>{let e=parseFloat(t.overrides[`--sf-motion-scale`]??`1`);return isFinite(e)?e:1})()),c=I(()=>t.overrides[`--sf-motion-scale`]===`0`),l=I(()=>(()=>{let e=parseFloat(t.overrides[`--sf-theme-transition-duration`]?.replace(`ms`,``)??String(300*U(s)));return isFinite(e)?e:Math.round(300*U(s))})()),u=I(()=>{let e=t.overrides[a[0]];return e?parseFloat(e.replace(`ms`,``)):75*U(s)}),d=L(!1),f=L(0),p=L(`--sf-ease-out`),m=L(`--sf-duration-normal`),h=L(!1),g=L(!1),_=L(!1),v=L(!1);function y(e,n){let r=t.overrides[e];if(r){let e=parseFloat(r);if(isFinite(e))return e}return Math.round(n*U(s))}function b(e){return t.overrides[e]??i.find(t=>t.token===e)?.value??`ease`}function x(){if(U(d))return;let e=r.find(e=>e.token===U(m))?.base??250,t=y(U(m),e);R(d,!0),R(f,180),setTimeout(()=>{R(f,0),setTimeout(()=>{R(d,!1)},t)},t)}function S(e){let n={};for(let t=1;t<=5;t++)n[`--sf-animation-delay-${t}`]=`${Math.round(e*t)}ms`;t.onBulkChange(n)}function C(){let e={};for(let t=1;t<=5;t++)e[`--sf-animation-delay-${t}`]=null;t.onBulkChange(e)}var w=bp(),T=z(w),E=V(z(T),2),D=z(E);F(E),F(T);var O=V(T,2),k=e=>{K(e,op())};J(O,e=>{U(c)&&e(k)});var A=V(O,2),ee=V(z(A),2),te=z(ee),j=z(te);F(te);var ne=V(te,2),M=z(ne);Y(M,21,()=>i,e=>e.token,(e,t)=>{var r=sp(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).token)&&(r.value=(r.__value=U(t).token)??``)}),K(e,r)}),F(M);var re;Di(M);var ie=V(M,2);Y(ie,21,()=>r,e=>e.token,(e,t)=>{var r=sp(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).token)&&(r.value=(r.__value=U(t).token)??``)}),K(e,r)}),F(ie);var ae;Di(ie);var oe=V(ie,2),se=z(oe,!0);F(oe),F(ne),F(ee),F(A);var N=V(A,4),ce=z(N),le=V(z(ce),2),ue=z(le,!0);F(le),F(ce);var de=V(ce,2),fe=e=>{var n=up(),i=B(n),a=V(z(i)),o=e=>{K(e,cp())};J(a,e=>{U(c)&&e(o)}),F(i);var s=V(i,2);Y(s,17,()=>r,e=>e.token,(e,n)=>{let r=I(()=>y(U(n).token,U(n).base));{let i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:0,get max(){return U(n).max},step:10,unit:`ms`,get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}ms`),onReset:()=>t.onReset(U(n).token)})}});var l=V(s,2);Y(l,21,()=>r,e=>e.label,(e,t)=>{let n=I(()=>y(U(t).token,U(t).base));var r=lp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2),s=z(o);F(o);var c=V(o,2),l=z(c);F(c),F(r),H(e=>{q(a,U(t).label),Z(s,e),q(l,`${U(n)??``}ms`)},[()=>`width: ${Math.min(U(n)/1200*100,100)}%`]),K(e,r)}),F(l),K(e,n)};J(de,e=>{U(h)&&e(fe)}),F(N);var pe=V(N,4),me=z(pe),he=V(z(me),2),ge=z(he,!0);F(he),F(me);var _e=V(me,2),ve=e=>{var n=pp(),r=V(B(n),2);Y(r,21,()=>i,e=>e.token,(e,n)=>{let r=I(()=>U(n).token in t.overrides);var i=fp(),a=z(i),o=z(a),s=z(o);F(o);var c=V(o,2),l=z(c),u=z(l),d=z(u,!0);F(u);var f=V(u,2),m=z(f),h=V(m,2),g=e=>{var r=dp();W(`click`,r,()=>t.onReset(U(n).token)),K(e,r)};J(h,e=>{U(r)&&e(g)}),F(f),F(l);var _=V(l,2);zi(_),F(c),F(a),F(i),H(()=>{X(i,1,`p-2.5 rounded-xl border transition-all ${U(r)?`bg-indigo-500/10 border-indigo-500/30`:`border-black/8 dark:border-white/8 bg-black/3 dark:bg-white/3`}`),Q(s,`d`,U(n).preview),q(d,U(n).label),Bi(_,t.overrides[U(n).token]??``),Q(_,`placeholder`,U(n).value)}),W(`click`,m,()=>{R(p,U(n).token,!0),x()}),W(`input`,_,e=>{let r=e.target.value.trim();r?t.onSet(U(n).token,r):t.onReset(U(n).token)}),K(e,i)}),F(r),K(e,n)};J(_e,e=>{U(g)&&e(ve)}),F(pe);var ye=V(pe,4),be=z(ye),xe=V(z(be),2),Se=z(xe,!0);F(xe),F(be);var Ce=V(be,2),we=e=>{var n=gp(),r=V(B(n),2),i=z(r),o=V(z(i),2),s=e=>{var t=mp();W(`click`,t,C),K(e,t)},c=I(()=>a.some(e=>e in t.overrides));J(o,e=>{U(c)&&e(s)}),F(i);var l=V(i,2);{let e=I(()=>Math.round(U(u))),n=I(()=>a.some(e=>e in t.overrides));$(l,{label:``,get value(){return U(e)},min:0,max:200,step:5,unit:`ms`,help:`Base unit for --sf-animation-delay-1 through -5`,get overridden(){return U(n)},onChange:e=>S(e),onReset:C})}F(r);var d=V(r,2);Y(d,20,()=>[1,2,3,4,5],e=>e,(e,t)=>{let n=I(()=>Math.round(U(u)*t));var r=hp(),i=z(r),a=z(i);F(i);var o=V(i,2),s=z(o);F(o);var c=V(o,2),l=z(c);F(c),F(r),H(e=>{q(a,`–${t??``}`),Z(s,e),q(l,`${U(n)??``}ms`)},[()=>`width: ${Math.min(U(n)/600*100,100)}%`]),K(e,r)}),F(d),K(e,n)};J(Ce,e=>{U(_)&&e(we)}),F(ye);var Te=V(ye,4),Ee=z(Te),De=V(z(Ee),2),P=z(De,!0);F(De),F(Ee);var Oe=V(Ee,2),ke=e=>{var n=yp(),r=B(n);Y(r,21,()=>o,e=>e.name,(e,n)=>{uu(e,{get knob(){return U(n)},get overrides(){return t.overrides},onChange:(e,n)=>n===null?t.onReset(e):t.onSet(e,n)})}),F(r);var i=V(r,2);{let e=I(()=>`--sf-theme-transition-duration`in t.overrides);$(i,{label:`Theme switch speed`,get value(){return U(l)},min:0,max:600,step:10,unit:`ms`,help:`--sf-theme-transition-duration — dark/light color-scheme switch animation speed`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-theme-transition-duration`,`${e}ms`),onReset:()=>t.onReset(`--sf-theme-transition-duration`)})}var a=V(i,2);Y(V(z(a),2),16,()=>[{label:`Entry start`,token:`--sf-scroll-timeline-range-start`,placeholder:`entry 0%`},{label:`Entry end`,token:`--sf-scroll-timeline-range-end`,placeholder:`cover 30%`},{label:`Exit start`,token:`--sf-scroll-timeline-range-exit-start`,placeholder:`cover 70%`},{label:`Exit end`,token:`--sf-scroll-timeline-range-exit-end`,placeholder:`exit 100%`}],e=>e.token,(e,n)=>{var r=vp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=_p();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.placeholder)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(a),K(e,n)};J(Oe,e=>{U(v)&&e(ke)}),F(Te),F(w),H(e=>{Q(E,`title`,U(c)?`Enable motion`:`Disable motion`),X(E,1,`w-9 h-5 rounded-full transition-colors relative cursor-pointer ${U(c)?`bg-indigo-600`:`bg-black/10 dark:bg-white/10`}`),X(D,1,`absolute top-0.5 w-4 h-4 bg-white rounded-full shadow transition-transform ${U(c)?`translate-x-4`:`translate-x-0.5`}`),Z(j,e),re!==(re=U(p))&&(M.value=(M.__value=U(p))??``,Ei(M,U(p))),ae!==(ae=U(m))&&(ie.value=(ie.__value=U(m))??``,Ei(ie,U(m))),oe.disabled=U(d),q(se,U(d)?`…`:`▶ Play`),Q(ce,`aria-expanded`,U(h)),q(ue,U(h)?`▲`:`▼`),Q(me,`aria-expanded`,U(g)),q(ge,U(g)?`▲`:`▼`),Q(be,`aria-expanded`,U(_)),q(Se,U(_)?`▲`:`▼`),Q(Ee,`aria-expanded`,U(v)),q(P,U(v)?`▲`:`▼`)},[()=>`transform: translateX(${U(f)}px); transition: transform ${y(U(m),r.find(e=>e.token===U(m))?.base??250)}ms ${b(U(p))}`]),W(`click`,E,()=>{U(c)?t.onReset(`--sf-motion-scale`):t.onSet(`--sf-motion-scale`,`0`)}),W(`change`,M,e=>{R(p,e.target.value,!0)}),W(`change`,ie,e=>{R(m,e.target.value,!0)}),W(`click`,oe,x),W(`click`,ce,()=>{R(h,!U(h))}),W(`click`,me,()=>{R(g,!U(g))}),W(`click`,be,()=>{R(_,!U(_))}),W(`click`,Ee,()=>{R(v,!U(v))}),K(e,w),We()}Br([`click`,`change`,`input`]);var Sp=G(`
`),Cp=G(`
`,1),wp=G(`
`),Tp=G(`
`,1),Ep=G(``),Dp=G(`

Gradient overlay for hero images and media content. Used by the .sf-scrim macro.

Color
Direction
Scrim preview
`,1),Op=G(`
`),kp=G(`
Scrollbar preview
`,1),Ap=G(``),jp=G(`
`),Mp=G(`

Controls text legibility over images. Applied via text-shadow: var(--sf-text-shadow-m). Edit each token directly — use none to disable.

`,1),Np=G(`
`),Pp=G(`

filter: drop-shadow(…) — unlike box-shadow, follows the element's actual alpha shape (SVG icons, PNG cutouts, transparent logos). Edit each token directly — - use none to disable.

`,1),Fp=G(`
`);function Ip(e,t){Ue(t,!0);let n=[{label:`To top`,value:`to top`},{label:`To bottom`,value:`to bottom`},{label:`To left`,value:`to left`},{label:`To right`,value:`to right`}],r=[{label:`Extra small`,token:`--sf-text-shadow-xs`,default:`0 0.5px 1px oklch(…)`},{label:`Small`,token:`--sf-text-shadow-s`,default:`0 1px 2px oklch(…)`},{label:`Medium`,token:`--sf-text-shadow-m`,default:`0 2px 4px oklch(…)`},{label:`Large`,token:`--sf-text-shadow-l`,default:`0 4px 8px oklch(…)`},{label:`Extra large`,token:`--sf-text-shadow-xl`,default:`0 8px 16px oklch(…)`}],i=[`xs`,`s`,`m`,`l`,`xl`];function a(e,t,n){if(!e)return t;let r=parseFloat(n?e.replace(n,``):e);return isNaN(r)?t:r}let o=I(()=>a(t.overrides[`--sf-blur`],12,`px`)),s=I(()=>a(t.overrides[`--sf-opacity-muted`],.5)),c=I(()=>a(t.overrides[`--sf-opacity-disabled`],.45)),l=I(()=>t.overrides[`--sf-scrim-direction`]??`to top`),u=I(()=>t.overrides[`--sf-scrim-color`]??``),d=I(()=>a(t.overrides[`--sf-scroll-shadow-size`]?.replace(`rem`,``),2)),f=I(()=>a(t.overrides[`--sf-state-pending-opacity`],.7)),p=I(()=>t.overrides[`--sf-scrollbar-thumb`]??``),m=I(()=>t.overrides[`--sf-scrollbar-track`]??``),h=L(!1),g=L(!1),_=L(!1),v=L(!1),y=L(!1),b=L(!1),x=L(!1);var S=Fp(),C=z(S),w=z(C),T=V(z(w),2),E=z(T,!0);F(T),F(w);var D=V(w,2),O=e=>{var n=Cp(),r=B(n);{let e=I(()=>`--sf-blur`in t.overrides);$(r,{label:`Blur radius`,get value(){return U(o)},min:0,max:48,step:1,unit:`px`,help:`--sf-blur — used for frosted glass, modals, tooltips`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-blur`,`${e}px`),onReset:()=>t.onReset(`--sf-blur`)})}var i=V(r,2),a=z(i);Y(a,20,()=>Array.from({length:12}),ii,(e,t,n)=>{var r=Sp();X(r,1,yi(n%3==0?`bg-indigo-500/50`:n%3==1?`bg-purple-500/40`:`bg-blue-500/30`)),K(e,r)}),F(a);var s=V(a,2),c=z(s),l=z(c);F(c),F(s),F(i),H(()=>{Z(s,`backdrop-filter: blur(${U(o)}px)`),q(l,`${U(o)??``}px`)}),K(e,n)};J(D,e=>{U(h)&&e(O)}),F(C);var k=V(C,4),A=z(k),ee=V(z(A),2),j=z(ee,!0);F(ee),F(A);var te=V(A,2),ne=e=>{var n=Tp(),r=B(n);{let e=I(()=>`--sf-opacity-muted`in t.overrides);$(r,{label:`Muted opacity`,get value(){return U(s)},min:0,max:1,step:.05,help:`--sf-opacity-muted — secondary text, icons, and placeholder content`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-opacity-muted`,String(e)),onReset:()=>t.onReset(`--sf-opacity-muted`)})}var i=V(r,2);{let e=I(()=>`--sf-opacity-disabled`in t.overrides);$(i,{label:`Disabled opacity`,get value(){return U(c)},min:0,max:1,step:.05,help:`--sf-opacity-disabled — disabled form controls and interactive elements`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-opacity-disabled`,String(e)),onReset:()=>t.onReset(`--sf-opacity-disabled`)})}var a=V(i,2);{let e=I(()=>`--sf-state-pending-opacity`in t.overrides);$(a,{label:`Pending opacity`,get value(){return U(f)},min:.1,max:1,step:.05,help:`--sf-state-pending-opacity — opacity of elements in loading/pending state`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-state-pending-opacity`,String(e)),onReset:()=>t.onReset(`--sf-state-pending-opacity`)})}var o=V(a,2);Y(o,21,()=>[{label:`muted`,val:U(s)},{label:`disabled`,val:U(c)},{label:`pending`,val:U(f)}],e=>e.label,(e,t)=>{var n=wp(),r=z(n),i=z(r,!0);F(r);var a=V(r,2),o=V(a,2),s=z(o,!0);F(o),F(n),H(()=>{q(i,U(t).label),Z(a,`opacity: ${U(t).val}`),q(s,U(t).val)}),K(e,n)}),F(o),K(e,n)};J(te,e=>{U(g)&&e(ne)}),F(k);var M=V(k,4),re=z(M),ie=V(z(re),2),ae=z(ie,!0);F(ie),F(re);var oe=V(re,2),se=e=>{var r=Dp(),i=V(B(r),2),a=V(z(i),2);{let e=I(()=>`--sf-scrim-color`in t.overrides);ku(a,{token:`--sf-scrim-color`,get value(){return U(u)},placeholder:`default (base color)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-scrim-color`,e),onReset:()=>t.onReset(`--sf-scrim-color`)})}F(i);var o=V(i,2),s=V(z(o),2);Y(s,21,()=>n,e=>e.value,(e,n)=>{var r=Ep(),i=z(r,!0);F(r),H(()=>{X(r,1,`py-2 px-3 rounded-lg text-[10px] border transition-all cursor-pointer text-left ${U(l)===U(n).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,U(n).label)}),W(`click`,r,()=>U(n).value===`to top`?t.onReset(`--sf-scrim-direction`):t.onSet(`--sf-scrim-direction`,U(n).value)),K(e,r)}),F(s),F(o);var c=V(o,2),d=z(c),f=z(d);Me(2),F(d),F(c),H(()=>Z(f,`background: linear-gradient(${U(l)}, ${U(u)||`oklch(0 0 0 / 0.6)`}, transparent)`)),K(e,r)};J(oe,e=>{U(_)&&e(se)}),F(M);var N=V(M,4),ce=z(N),le=V(z(ce),2),ue=z(le,!0);F(le),F(ce);var de=V(ce,2),fe=e=>{var n=kp(),r=B(n);Y(r,17,()=>[{label:`Thumb color`,token:`--sf-scrollbar-thumb`,val:U(p)},{label:`Track color`,token:`--sf-scrollbar-track`,val:U(m)}],e=>e.token,(e,n)=>{var r=Op(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);{let e=I(()=>U(n).token in t.overrides);ku(o,{get token(){return U(n).token},get value(){return U(n).val},placeholder:`default`,get isOverridden(){return U(e)},onSet:e=>t.onSet(U(n).token,e),onReset:()=>t.onReset(U(n).token)})}F(r),H(()=>q(a,U(n).label)),K(e,r)});var i=V(r,2),a=z(i);let o;var s=z(a);let c;F(a),Me(2),F(i),H(()=>{o=Z(a,``,o,{background:U(m)||`rgba(255,255,255,0.08)`}),c=Z(s,``,c,{background:U(p)||`oklch(0.52 0.025 260)`})}),K(e,n)};J(de,e=>{U(v)&&e(fe)}),F(N);var pe=V(N,4),me=z(pe),he=V(z(me),2),ge=z(he,!0);F(he),F(me);var _e=V(me,2),ve=e=>{{let n=I(()=>`--sf-scroll-shadow-size`in t.overrides);$(e,{label:`Shadow size`,get value(){return U(d)},min:0,max:6,step:.25,unit:`rem`,help:`--sf-scroll-shadow-size — gradient edge mask on .sf-scroll-shadow elements`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-scroll-shadow-size`,`${e}rem`),onReset:()=>t.onReset(`--sf-scroll-shadow-size`)})}};J(_e,e=>{U(y)&&e(ve)}),F(pe);var ye=V(pe,4),be=z(ye),xe=V(z(be),2),Se=z(xe,!0);F(xe),F(be);var Ce=V(be,2),we=e=>{var n=Mp(),i=V(B(n),2);Y(i,21,()=>r,e=>e.token,(e,n)=>{var r=jp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Ap();W(`click`,r,()=>t.onReset(U(n).token)),K(e,r)};J(s,e=>{U(n).token in t.overrides&&e(c)}),F(r),H(()=>{q(a,U(n).label),Bi(o,t.overrides[U(n).token]??``),Q(o,`placeholder`,U(n).default)}),W(`input`,o,e=>{let r=e.target.value;r.trim()?t.onSet(U(n).token,r):t.onReset(U(n).token)}),K(e,r)}),F(i),K(e,n)};J(Ce,e=>{U(b)&&e(we)}),F(ye);var Te=V(ye,4),Ee=z(Te),De=V(z(Ee),2),P=z(De,!0);F(De),F(Ee);var Oe=V(Ee,2),ke=e=>{var n=Pp(),r=V(B(n),2);Y(r,20,()=>[{label:`Extra small`,token:`--sf-drop-shadow-xs`,default:`drop-shadow(0 0.5px 1px oklch(…))`},{label:`Small`,token:`--sf-drop-shadow-s`,default:`drop-shadow(0 1px 2px oklch(…))`},{label:`Medium`,token:`--sf-drop-shadow-m`,default:`drop-shadow(0 4px 6px oklch(…))`},{label:`Large`,token:`--sf-drop-shadow-l`,default:`drop-shadow(0 8px 16px oklch(…))`},{label:`Extra large`,token:`--sf-drop-shadow-xl`,default:`drop-shadow(0 16px 32px oklch(…))`}],e=>e.token,(e,n)=>{var r=jp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Ap();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.default)}),W(`input`,o,e=>{let r=e.target.value;r.trim()?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(r);var a=V(r,2);Y(a,20,()=>i,e=>e,(e,t)=>{var n=Np(),r=z(n),i=V(r,2),a=z(i,!0);F(i),F(n),H(()=>{X(r,0,`sf-drop-shadow-${t}`),q(a,t)}),K(e,n)}),F(a),K(e,n)};J(Oe,e=>{U(x)&&e(ke)}),F(Te),F(S),H(()=>{Q(w,`aria-expanded`,U(h)),q(E,U(h)?`▲`:`▼`),Q(A,`aria-expanded`,U(g)),q(j,U(g)?`▲`:`▼`),Q(re,`aria-expanded`,U(_)),q(ae,U(_)?`▲`:`▼`),Q(ce,`aria-expanded`,U(v)),q(ue,U(v)?`▲`:`▼`),Q(me,`aria-expanded`,U(y)),q(ge,U(y)?`▲`:`▼`),Q(be,`aria-expanded`,U(b)),q(Se,U(b)?`▲`:`▼`),Q(Ee,`aria-expanded`,U(x)),q(P,U(x)?`▲`:`▼`)}),W(`click`,w,()=>{R(h,!U(h))}),W(`click`,A,()=>{R(g,!U(g))}),W(`click`,re,()=>{R(_,!U(_))}),W(`click`,ce,()=>{R(v,!U(v))}),W(`click`,me,()=>{R(y,!U(y))}),W(`click`,be,()=>{R(b,!U(b))}),W(`click`,Ee,()=>{R(x,!U(x))}),K(e,S),We()}Br([`click`,`input`]);var Lp=G(`
`),Rp=G(`
`,1),zp=G(`

SLASHED is a token-first CSS framework. This sample paragraph repeats so you + use none to disable.

`,1),Fp=G(`
`);function Ip(e,t){Ue(t,!0);let n=[{label:`To top`,value:`to top`},{label:`To bottom`,value:`to bottom`},{label:`To left`,value:`to left`},{label:`To right`,value:`to right`}],r=[{label:`Extra small`,token:`--sf-text-shadow-xs`,default:`0 0.5px 1px oklch(…)`},{label:`Small`,token:`--sf-text-shadow-s`,default:`0 1px 2px oklch(…)`},{label:`Medium`,token:`--sf-text-shadow-m`,default:`0 2px 4px oklch(…)`},{label:`Large`,token:`--sf-text-shadow-l`,default:`0 4px 8px oklch(…)`},{label:`Extra large`,token:`--sf-text-shadow-xl`,default:`0 8px 16px oklch(…)`}],i=[`xs`,`s`,`m`,`l`,`xl`];function a(e,t,n){if(!e)return t;let r=parseFloat(n?e.replace(n,``):e);return isNaN(r)?t:r}let o=I(()=>a(t.overrides[`--sf-blur`],12,`px`)),s=I(()=>a(t.overrides[`--sf-opacity-muted`],.5)),c=I(()=>a(t.overrides[`--sf-opacity-disabled`],.45)),l=I(()=>t.overrides[`--sf-scrim-direction`]??`to top`),u=I(()=>t.overrides[`--sf-scrim-color`]??``),d=I(()=>a(t.overrides[`--sf-scroll-shadow-size`]?.replace(`rem`,``),2)),f=I(()=>a(t.overrides[`--sf-state-pending-opacity`],.7)),p=I(()=>t.overrides[`--sf-scrollbar-thumb`]??``),m=I(()=>t.overrides[`--sf-scrollbar-track`]??``),h=L(!1),g=L(!1),_=L(!1),v=L(!1),y=L(!1),b=L(!1),x=L(!1);var S=Fp(),C=z(S),w=z(C),T=V(z(w),2),E=z(T,!0);F(T),F(w);var D=V(w,2),O=e=>{var n=Cp(),r=B(n);{let e=I(()=>`--sf-blur`in t.overrides);$(r,{label:`Blur radius`,get value(){return U(o)},min:0,max:48,step:1,unit:`px`,help:`--sf-blur — used for frosted glass, modals, tooltips`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-blur`,`${e}px`),onReset:()=>t.onReset(`--sf-blur`)})}var i=V(r,2),a=z(i);Y(a,20,()=>Array.from({length:12}),ii,(e,t,n)=>{var r=Sp();X(r,1,yi(n%3==0?`bg-indigo-500/50`:n%3==1?`bg-purple-500/40`:`bg-blue-500/30`)),K(e,r)}),F(a);var s=V(a,2),c=z(s),l=z(c);F(c),F(s),F(i),H(()=>{Z(s,`backdrop-filter: blur(${U(o)}px)`),q(l,`${U(o)??``}px`)}),K(e,n)};J(D,e=>{U(h)&&e(O)}),F(C);var k=V(C,4),A=z(k),ee=V(z(A),2),te=z(ee,!0);F(ee),F(A);var j=V(A,2),ne=e=>{var n=Tp(),r=B(n);{let e=I(()=>`--sf-opacity-muted`in t.overrides);$(r,{label:`Muted opacity`,get value(){return U(s)},min:0,max:1,step:.05,help:`--sf-opacity-muted — secondary text, icons, and placeholder content`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-opacity-muted`,String(e)),onReset:()=>t.onReset(`--sf-opacity-muted`)})}var i=V(r,2);{let e=I(()=>`--sf-opacity-disabled`in t.overrides);$(i,{label:`Disabled opacity`,get value(){return U(c)},min:0,max:1,step:.05,help:`--sf-opacity-disabled — disabled form controls and interactive elements`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-opacity-disabled`,String(e)),onReset:()=>t.onReset(`--sf-opacity-disabled`)})}var a=V(i,2);{let e=I(()=>`--sf-state-pending-opacity`in t.overrides);$(a,{label:`Pending opacity`,get value(){return U(f)},min:.1,max:1,step:.05,help:`--sf-state-pending-opacity — opacity of elements in loading/pending state`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-state-pending-opacity`,String(e)),onReset:()=>t.onReset(`--sf-state-pending-opacity`)})}var o=V(a,2);Y(o,21,()=>[{label:`muted`,val:U(s)},{label:`disabled`,val:U(c)},{label:`pending`,val:U(f)}],e=>e.label,(e,t)=>{var n=wp(),r=z(n),i=z(r,!0);F(r);var a=V(r,2),o=V(a,2),s=z(o,!0);F(o),F(n),H(()=>{q(i,U(t).label),Z(a,`opacity: ${U(t).val}`),q(s,U(t).val)}),K(e,n)}),F(o),K(e,n)};J(j,e=>{U(g)&&e(ne)}),F(k);var M=V(k,4),re=z(M),ie=V(z(re),2),ae=z(ie,!0);F(ie),F(re);var oe=V(re,2),se=e=>{var r=Dp(),i=V(B(r),2),a=V(z(i),2);{let e=I(()=>`--sf-scrim-color`in t.overrides);ku(a,{token:`--sf-scrim-color`,get value(){return U(u)},placeholder:`default (base color)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-scrim-color`,e),onReset:()=>t.onReset(`--sf-scrim-color`)})}F(i);var o=V(i,2),s=V(z(o),2);Y(s,21,()=>n,e=>e.value,(e,n)=>{var r=Ep(),i=z(r,!0);F(r),H(()=>{X(r,1,`py-2 px-3 rounded-lg text-[10px] border transition-all cursor-pointer text-left ${U(l)===U(n).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,U(n).label)}),W(`click`,r,()=>U(n).value===`to top`?t.onReset(`--sf-scrim-direction`):t.onSet(`--sf-scrim-direction`,U(n).value)),K(e,r)}),F(s),F(o);var c=V(o,2),d=z(c),f=z(d);Me(2),F(d),F(c),H(()=>Z(f,`background: linear-gradient(${U(l)}, ${U(u)||`oklch(0 0 0 / 0.6)`}, transparent)`)),K(e,r)};J(oe,e=>{U(_)&&e(se)}),F(M);var N=V(M,4),ce=z(N),le=V(z(ce),2),ue=z(le,!0);F(le),F(ce);var de=V(ce,2),fe=e=>{var n=kp(),r=B(n);Y(r,17,()=>[{label:`Thumb color`,token:`--sf-scrollbar-thumb`,val:U(p)},{label:`Track color`,token:`--sf-scrollbar-track`,val:U(m)}],e=>e.token,(e,n)=>{var r=Op(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);{let e=I(()=>U(n).token in t.overrides);ku(o,{get token(){return U(n).token},get value(){return U(n).val},placeholder:`default`,get isOverridden(){return U(e)},onSet:e=>t.onSet(U(n).token,e),onReset:()=>t.onReset(U(n).token)})}F(r),H(()=>q(a,U(n).label)),K(e,r)});var i=V(r,2),a=z(i);let o;var s=z(a);let c;F(a),Me(2),F(i),H(()=>{o=Z(a,``,o,{background:U(m)||`rgba(255,255,255,0.08)`}),c=Z(s,``,c,{background:U(p)||`oklch(0.52 0.025 260)`})}),K(e,n)};J(de,e=>{U(v)&&e(fe)}),F(N);var pe=V(N,4),me=z(pe),he=V(z(me),2),ge=z(he,!0);F(he),F(me);var _e=V(me,2),ve=e=>{{let n=I(()=>`--sf-scroll-shadow-size`in t.overrides);$(e,{label:`Shadow size`,get value(){return U(d)},min:0,max:6,step:.25,unit:`rem`,help:`--sf-scroll-shadow-size — gradient edge mask on .sf-scroll-shadow elements`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-scroll-shadow-size`,`${e}rem`),onReset:()=>t.onReset(`--sf-scroll-shadow-size`)})}};J(_e,e=>{U(y)&&e(ve)}),F(pe);var ye=V(pe,4),be=z(ye),xe=V(z(be),2),Se=z(xe,!0);F(xe),F(be);var Ce=V(be,2),we=e=>{var n=Mp(),i=V(B(n),2);Y(i,21,()=>r,e=>e.token,(e,n)=>{var r=jp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Ap();W(`click`,r,()=>t.onReset(U(n).token)),K(e,r)};J(s,e=>{U(n).token in t.overrides&&e(c)}),F(r),H(()=>{q(a,U(n).label),Bi(o,t.overrides[U(n).token]??``),Q(o,`placeholder`,U(n).default)}),W(`input`,o,e=>{let r=e.target.value;r.trim()?t.onSet(U(n).token,r):t.onReset(U(n).token)}),K(e,r)}),F(i),K(e,n)};J(Ce,e=>{U(b)&&e(we)}),F(ye);var Te=V(ye,4),Ee=z(Te),De=V(z(Ee),2),P=z(De,!0);F(De),F(Ee);var Oe=V(Ee,2),ke=e=>{var n=Pp(),r=V(B(n),2);Y(r,20,()=>[{label:`Extra small`,token:`--sf-drop-shadow-xs`,default:`drop-shadow(0 0.5px 1px oklch(…))`},{label:`Small`,token:`--sf-drop-shadow-s`,default:`drop-shadow(0 1px 2px oklch(…))`},{label:`Medium`,token:`--sf-drop-shadow-m`,default:`drop-shadow(0 4px 6px oklch(…))`},{label:`Large`,token:`--sf-drop-shadow-l`,default:`drop-shadow(0 8px 16px oklch(…))`},{label:`Extra large`,token:`--sf-drop-shadow-xl`,default:`drop-shadow(0 16px 32px oklch(…))`}],e=>e.token,(e,n)=>{var r=jp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Ap();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.default)}),W(`input`,o,e=>{let r=e.target.value;r.trim()?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(r);var a=V(r,2);Y(a,20,()=>i,e=>e,(e,t)=>{var n=Np(),r=z(n),i=V(r,2),a=z(i,!0);F(i),F(n),H(()=>{X(r,0,`sf-drop-shadow-${t}`),q(a,t)}),K(e,n)}),F(a),K(e,n)};J(Oe,e=>{U(x)&&e(ke)}),F(Te),F(S),H(()=>{Q(w,`aria-expanded`,U(h)),q(E,U(h)?`▲`:`▼`),Q(A,`aria-expanded`,U(g)),q(te,U(g)?`▲`:`▼`),Q(re,`aria-expanded`,U(_)),q(ae,U(_)?`▲`:`▼`),Q(ce,`aria-expanded`,U(v)),q(ue,U(v)?`▲`:`▼`),Q(me,`aria-expanded`,U(y)),q(ge,U(y)?`▲`:`▼`),Q(be,`aria-expanded`,U(b)),q(Se,U(b)?`▲`:`▼`),Q(Ee,`aria-expanded`,U(x)),q(P,U(x)?`▲`:`▼`)}),W(`click`,w,()=>{R(h,!U(h))}),W(`click`,A,()=>{R(g,!U(g))}),W(`click`,re,()=>{R(_,!U(_))}),W(`click`,ce,()=>{R(v,!U(v))}),W(`click`,me,()=>{R(y,!U(y))}),W(`click`,be,()=>{R(b,!U(b))}),W(`click`,Ee,()=>{R(x,!U(x))}),K(e,S),We()}Br([`click`,`input`]);var Lp=G(`
`),Rp=G(`
`,1),zp=G(`

SLASHED is a token-first CSS framework. This sample paragraph repeats so you can see exactly how many lines survive the clamp before the ellipsis kicks in. Drag the slider above and watch the visible line count change in real time. - Extra filler text keeps the block taller than the clamp at every setting.

`,1),Bp=G(``),Vp=G(`

--sf-aspect — default ratio for .sf-aspect / .sf-frame

`,1),Hp=G(`
`,1),Up=G(``),Wp=G(`

--sf-scrim-color / --sf-scrim-direction — darkening gradient for .sf-scrim

Color
Direction
Caption over scrim
Text shadow
`,1),Gp=G(`

Spacing tokens for .sf-prose. Defaults track the space scale; sliders write rem overrides.

Marker color
`,1),Kp=G(`

--sf-content-intrinsic-size — placeholder size used with content-visibility: auto to improve scroll performance on tall pages.

Intrinsic size
`,1),qp=G(`
`),Jp=G(`
`),Yp=G(`

--sf-surface-bg-* — input set composed by the .sf-surface-bg macro into a single reusable background (color, image, overlay, sizing and animation).

.sf-surface-bg preview
`,1),Xp=G(`

Tokens for the framework's utility macros — .sf-prose, .sf-flow, .sf-line-clamp, .sf-aspect, .sf-scroll-shadow and .sf-scrim.

All tokens tab — edit every prose, scrim and surface token directly.

`);function Zp(e,t){Ue(t,!0);function n(e,n,r){let i=t.overrides[e];if(!i)return n;let a=parseFloat(r?i.replace(r,``):i);return isNaN(a)?n:a}let r=[{label:`16 / 9`,value:`16 / 9`},{label:`4 / 3`,value:`4 / 3`},{label:`3 / 2`,value:`3 / 2`},{label:`1 / 1`,value:`1 / 1`},{label:`21 / 9`,value:`21 / 9`},{label:`9 / 16`,value:`9 / 16`}],i=[{label:`↑ top`,value:`to top`},{label:`↓ bottom`,value:`to bottom`},{label:`← left`,value:`to left`},{label:`→ right`,value:`to right`},{label:`↗ top-right`,value:`to top right`},{label:`↖ top-left`,value:`to top left`}],a=[`cover`,`contain`,`auto`,`100% 100%`],o=[`center`,`top`,`bottom`,`left`,`right`,`top left`],s=[`no-repeat`,`repeat`,`repeat-x`,`repeat-y`,`space`,`round`],c=[`scroll`,`fixed`,`local`],l=[{label:`Color`,token:`--sf-surface-bg-color`,placeholder:`transparent`},{label:`Image`,token:`--sf-surface-bg-image`,placeholder:`url("/hero.avif")`},{label:`Overlay`,token:`--sf-surface-bg-overlay`,placeholder:`var(--sf-scrim-gradient)`},{label:`Animation`,token:`--sf-surface-bg-animation`,placeholder:`sf-pan 40s linear infinite`}],u=[{label:`Size`,token:`--sf-surface-bg-size`,opts:a},{label:`Position`,token:`--sf-surface-bg-position`,opts:o},{label:`Repeat`,token:`--sf-surface-bg-repeat`,opts:s},{label:`Attachment`,token:`--sf-surface-bg-attachment`,opts:c}],d=[{label:`Heading gap`,token:`--sf-prose-heading-gap`,def:.75,max:3,raw:`var(--sf-space-s)`},{label:`List gap`,token:`--sf-prose-list-gap`,def:.5,max:2,raw:`var(--sf-space-xs)`},{label:`Block margin`,token:`--sf-prose-block-margin`,def:1,max:4,raw:`var(--sf-space-m)`},{label:`Media margin`,token:`--sf-prose-media-margin`,def:1,max:4,raw:`var(--sf-space-m)`},{label:`Figure margin`,token:`--sf-prose-figure-margin`,def:1.5,max:4,raw:`var(--sf-space-l)`},{label:`Blockquote padding`,token:`--sf-prose-blockquote-padding`,def:1,max:3,raw:`var(--sf-space-m)`},{label:`HR margin`,token:`--sf-prose-hr-margin`,def:1.5,max:4,raw:`var(--sf-space-l)`}],f=L(!1),p=L(!1),m=L(!1),h=L(!1),g=L(!1),_=L(!1),v=L(!1),y=L(!1),b=I(()=>n(`--sf-line-clamp`,3)),x=I(()=>n(`--sf-flow-space`,.5,`rem`)),S=I(()=>n(`--sf-scroll-shadow-size`,2,`rem`)),C=I(()=>t.overrides[`--sf-aspect`]??`16 / 9`),w=I(()=>t.overrides[`--sf-scrim-color`]??`oklch(0 0 0 / 0.55)`),T=I(()=>t.overrides[`--sf-scrim-direction`]??`to top`),E=I(()=>n(`--sf-prose-media-radius`,6,`px`)),D=I(()=>t.overrides[`--sf-surface-bg-image`]??`none`),O=I(()=>t.overrides[`--sf-surface-bg-overlay`]??`none`),k=I(()=>t.overrides[`--sf-surface-bg-color`]??`transparent`),A=I(()=>t.overrides[`--sf-surface-bg-size`]??`cover`),ee=I(()=>t.overrides[`--sf-surface-bg-position`]??`center`),j=I(()=>t.overrides[`--sf-surface-bg-repeat`]??`no-repeat`),te=I(()=>t.overrides[`--sf-surface-bg-attachment`]??`scroll`),ne=I(()=>t.overrides[`--sf-surface-bg-animation`]??`none`);function M(e){let n=t.overrides[e.token];if(!n)return e.def;let r=parseFloat(n);return isNaN(r)?e.def:r}var re=Xp(),ie=V(z(re),2),ae=z(ie),oe=V(z(ae),2),se=z(oe,!0);F(oe),F(ae);var N=V(ae,2),ce=e=>{var n=Rp(),r=B(n);{let e=I(()=>`--sf-flow-space`in t.overrides);$(r,{label:`Flow space`,get value(){return U(x)},min:0,max:4,step:.0625,unit:`rem`,help:`--sf-flow-space — vertical gap between adjacent children of .sf-flow`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-flow-space`,`${e}rem`),onReset:()=>t.onReset(`--sf-flow-space`),rawDefault:`var(--sf-content-gap)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-flow-space`]},onRawSet:e=>t.onSet(`--sf-flow-space`,e)})}var i=V(r,2);Y(i,20,()=>[0,1,2],e=>e,(e,t)=>{var n=Lp();H(()=>Z(n,`width:${90-t*12}%`)),K(e,n)}),F(i),H(()=>Z(i,`display:flex;flex-direction:column;gap:${U(x)}rem`)),K(e,n)};J(N,e=>{U(f)&&e(ce)}),F(ie);var le=V(ie,4),ue=z(le),de=V(z(ue),2),fe=z(de,!0);F(de),F(ue);var pe=V(ue,2),me=e=>{var n=zp(),r=B(n);{let e=I(()=>`--sf-line-clamp`in t.overrides);$(r,{label:`Default lines`,get value(){return U(b)},min:1,max:8,step:1,help:`--sf-line-clamp — default line count for .sf-line-clamp (override per element)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-line-clamp`,String(e)),onReset:()=>t.onReset(`--sf-line-clamp`)})}var i=V(r,2),a=z(i);F(i),H(()=>Z(a,`display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:${U(b)};overflow:hidden`)),K(e,n)};J(pe,e=>{U(p)&&e(me)}),F(le);var he=V(le,4),ge=z(he),_e=V(z(ge),2),ve=z(_e,!0);F(_e),F(ge);var ye=V(ge,2),be=e=>{var n=Vp(),i=V(B(n),2);Y(i,21,()=>r,e=>e.value,(e,n)=>{var r=Bp(),i=z(r,!0);F(r),H(e=>{X(r,1,e),q(i,U(n).label)},[()=>`py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(C).replace(/\s/g,``)===U(n).value.replace(/\s/g,``)?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`]),W(`click`,r,()=>U(n).value===`16 / 9`?t.onReset(`--sf-aspect`):t.onSet(`--sf-aspect`,U(n).value)),K(e,r)}),F(i);var a=V(i,2),o=z(a),s=z(o,!0);F(o),F(a),H(()=>{Z(o,`aspect-ratio:${U(C)};max-height:120px;max-width:100%;width:auto;height:120px`),q(s,U(C))}),K(e,n)};J(ye,e=>{U(m)&&e(be)}),F(he);var xe=V(he,4),Se=z(xe),Ce=V(z(Se),2),we=z(Ce,!0);F(Ce),F(Se);var Te=V(Se,2),Ee=e=>{var n=Hp(),r=B(n);{let e=I(()=>`--sf-scroll-shadow-size`in t.overrides);$(r,{label:`Fade size`,get value(){return U(S)},min:0,max:6,step:.25,unit:`rem`,help:`--sf-scroll-shadow-size — size of the edge fade mask on .sf-scroll-shadow / .sf-overflow-fade`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-scroll-shadow-size`,`${e}rem`),onReset:()=>t.onReset(`--sf-scroll-shadow-size`)})}var i=V(r,2),a=z(i);F(i),H(()=>Z(a,`mask:linear-gradient(to right, transparent, #000 ${U(S)}rem, #000 calc(100% - ${U(S)}rem), transparent)`)),K(e,n)};J(Te,e=>{U(h)&&e(Ee)}),F(xe);var De=V(xe,4),P=z(De),Oe=V(z(P),2),ke=z(Oe,!0);F(Oe),F(P);var Ae=V(P,2),je=e=>{var n=Wp(),r=V(B(n),2),a=V(z(r),2);zi(a);var o=V(a,2),s=e=>{var n=Up();W(`click`,n,()=>t.onReset(`--sf-scrim-color`)),K(e,n)};J(o,e=>{`--sf-scrim-color`in t.overrides&&e(s)}),F(r);var c=V(r,2),l=V(z(c),2);Y(l,21,()=>i,e=>e.value,(e,n)=>{var r=Bp(),i=z(r,!0);F(r),H(()=>{X(r,1,`py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(T)===U(n).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,U(n).label)}),W(`click`,r,()=>U(n).value===`to top`?t.onReset(`--sf-scrim-direction`):t.onSet(`--sf-scrim-direction`,U(n).value)),K(e,r)}),F(l),F(c);var u=V(c,2),d=z(u);Me(2),F(u);var f=V(u,2),p=V(z(f),2);zi(p);var m=V(p,2),h=e=>{var n=Up();W(`click`,n,()=>t.onReset(`--sf-scrim-text-shadow`)),K(e,n)};J(m,e=>{`--sf-scrim-text-shadow`in t.overrides&&e(h)}),F(f),H(()=>{Bi(a,t.overrides[`--sf-scrim-color`]??``),Z(d,`background:linear-gradient(${U(T)}, ${U(w)}, transparent)`),Bi(p,t.overrides[`--sf-scrim-text-shadow`]??``)}),W(`input`,a,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-scrim-color`,n):t.onReset(`--sf-scrim-color`)}),W(`input`,p,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-scrim-text-shadow`,n):t.onReset(`--sf-scrim-text-shadow`)}),K(e,n)};J(Ae,e=>{U(g)&&e(je)}),F(De);var Ne=V(De,4),Pe=z(Ne),Fe=V(z(Pe),2),Ie=z(Fe,!0);F(Fe),F(Pe);var Le=V(Pe,2),Re=e=>{var n=Gp(),r=V(B(n),2),i=z(r);Y(i,17,()=>d,e=>e.token,(e,n)=>{{let r=I(()=>M(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:0,get max(){return U(n).max},step:.0625,unit:`rem`,get help(){return U(n).token},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}rem`),onReset:()=>t.onReset(U(n).token),get rawDefault(){return U(n).raw},get variableOptions(){return af},get currentRaw(){return t.overrides[U(n).token]},onRawSet:e=>t.onSet(U(n).token,e)})}});var a=V(i,2);{let e=I(()=>`--sf-prose-media-radius`in t.overrides);$(a,{label:`Media radius`,get value(){return U(E)},min:0,max:32,step:1,unit:`px`,help:`--sf-prose-media-radius — corner radius on prose images/video`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-prose-media-radius`,`${e}px`),onReset:()=>t.onReset(`--sf-prose-media-radius`),rawDefault:`var(--sf-radius-m)`,get variableOptions(){return of},get currentRaw(){return t.overrides[`--sf-prose-media-radius`]},onRawSet:e=>t.onSet(`--sf-prose-media-radius`,e)})}var o=V(a,2),s=V(z(o),2);zi(s);var c=V(s,2),l=e=>{var n=Up();W(`click`,n,()=>t.onReset(`--sf-prose-marker-color`)),K(e,n)};J(c,e=>{`--sf-prose-marker-color`in t.overrides&&e(l)}),F(o),F(r),H(()=>Bi(s,t.overrides[`--sf-prose-marker-color`]??``)),W(`input`,s,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-prose-marker-color`,n):t.onReset(`--sf-prose-marker-color`)}),K(e,n)};J(Le,e=>{U(_)&&e(Re)}),F(Ne);var ze=V(Ne,2),Be=z(ze),Ve=V(z(Be),2),He=z(Ve,!0);F(Ve),F(Be);var Ge=V(Be,2),Ke=e=>{var n=Kp(),r=V(B(n),2),i=V(z(r),2);zi(i);var a=V(i,2),o=e=>{var n=Up();W(`click`,n,()=>t.onReset(`--sf-content-intrinsic-size`)),K(e,n)};J(a,e=>{`--sf-content-intrinsic-size`in t.overrides&&e(o)}),F(r),H(()=>Bi(i,t.overrides[`--sf-content-intrinsic-size`]??``)),W(`input`,i,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-content-intrinsic-size`,n):t.onReset(`--sf-content-intrinsic-size`)}),K(e,n)};J(Ge,e=>{U(v)&&e(Ke)}),F(ze);var qe=V(ze,4),Je=z(qe),Ye=V(z(Je),2),Xe=z(Ye,!0);F(Ye),F(Je);var Ze=V(Je,2),Qe=e=>{var n=Yp(),r=V(B(n),2);Y(r,17,()=>l,e=>e.token,(e,n)=>{var r=qp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Up();W(`click`,r,()=>t.onReset(U(n).token)),K(e,r)};J(s,e=>{U(n).token in t.overrides&&e(c)}),F(r),H(()=>{q(a,U(n).label),Bi(o,t.overrides[U(n).token]??``),Q(o,`placeholder`,U(n).placeholder)}),W(`input`,o,e=>{let r=e.target.value;r.trim()?t.onSet(U(n).token,r):t.onReset(U(n).token)}),K(e,r)});var i=V(r,2);Y(i,17,()=>u,e=>e.token,(e,n)=>{var r=Jp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);Y(o,20,()=>U(n).opts,e=>e,(e,r)=>{var i=Bp(),a=z(i,!0);F(i),H(()=>{X(i,1,`py-1 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${(t.overrides[U(n).token]??U(n).opts[0])===r?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(a,r)}),W(`click`,i,()=>r===U(n).opts[0]?t.onReset(U(n).token):t.onSet(U(n).token,r)),K(e,i)}),F(o),F(r),H(()=>q(a,U(n).label)),K(e,r)});var a=V(i,2);H(()=>Z(a,`background-color:${U(k)};background-image:${U(O)}, ${U(D)};background-size:${U(A)};background-position:${U(ee)};background-repeat:${U(j)};background-attachment:${U(te)};animation:${U(ne)}`)),K(e,n)};J(Ze,e=>{U(y)&&e(Qe)}),F(qe),Me(2),F(re),H(()=>{Q(ae,`aria-expanded`,U(f)),q(se,U(f)?`▲`:`▼`),Q(ue,`aria-expanded`,U(p)),q(fe,U(p)?`▲`:`▼`),Q(ge,`aria-expanded`,U(m)),q(ve,U(m)?`▲`:`▼`),Q(Se,`aria-expanded`,U(h)),q(we,U(h)?`▲`:`▼`),Q(P,`aria-expanded`,U(g)),q(ke,U(g)?`▲`:`▼`),Q(Pe,`aria-expanded`,U(_)),q(Ie,U(_)?`▲`:`▼`),Q(Be,`aria-expanded`,U(v)),q(He,U(v)?`▲`:`▼`),Q(Je,`aria-expanded`,U(y)),q(Xe,U(y)?`▲`:`▼`)}),W(`click`,ae,()=>{R(f,!U(f))}),W(`click`,ue,()=>{R(p,!U(p))}),W(`click`,ge,()=>{R(m,!U(m))}),W(`click`,Se,()=>{R(h,!U(h))}),W(`click`,P,()=>{R(g,!U(g))}),W(`click`,Pe,()=>{R(_,!U(_))}),W(`click`,Be,()=>{R(v,!U(v))}),W(`click`,Je,()=>{R(y,!U(y))}),K(e,re),We()}Br([`click`,`input`]);var Qp=G(`

Minimum interactive area — ensures accessibility on touch devices.

`,1),$p=G(``),em=G(`
`),tm=G(`
`),nm=G(`

Override individual z-index tokens in the "All tokens" tab.

`,1),rm=G(`
Selection background
Selection text color

Select this text to preview the selection color.

.sf-selection--alt — alternate + Extra filler text keeps the block taller than the clamp at every setting.

`,1),Bp=G(``),Vp=G(`

--sf-aspect — default ratio for .sf-aspect / .sf-frame

`,1),Hp=G(`
`,1),Up=G(``),Wp=G(`

--sf-scrim-color / --sf-scrim-direction — darkening gradient for .sf-scrim

Color
Direction
Caption over scrim
Text shadow
`,1),Gp=G(`

Spacing tokens for .sf-prose. Defaults track the space scale; sliders write rem overrides.

Marker color
`,1),Kp=G(`

--sf-content-intrinsic-size — placeholder size used with content-visibility: auto to improve scroll performance on tall pages.

Intrinsic size
`,1),qp=G(`
`),Jp=G(`
`),Yp=G(`

--sf-surface-bg-* — input set composed by the .sf-surface-bg macro into a single reusable background (color, image, overlay, sizing and animation).

.sf-surface-bg preview
`,1),Xp=G(`

Tokens for the framework's utility macros — .sf-prose, .sf-flow, .sf-line-clamp, .sf-aspect, .sf-scroll-shadow and .sf-scrim.

All tokens tab — edit every prose, scrim and surface token directly.

`);function Zp(e,t){Ue(t,!0);function n(e,n,r){let i=t.overrides[e];if(!i)return n;let a=parseFloat(r?i.replace(r,``):i);return isNaN(a)?n:a}let r=[{label:`16 / 9`,value:`16 / 9`},{label:`4 / 3`,value:`4 / 3`},{label:`3 / 2`,value:`3 / 2`},{label:`1 / 1`,value:`1 / 1`},{label:`21 / 9`,value:`21 / 9`},{label:`9 / 16`,value:`9 / 16`}],i=[{label:`↑ top`,value:`to top`},{label:`↓ bottom`,value:`to bottom`},{label:`← left`,value:`to left`},{label:`→ right`,value:`to right`},{label:`↗ top-right`,value:`to top right`},{label:`↖ top-left`,value:`to top left`}],a=[`cover`,`contain`,`auto`,`100% 100%`],o=[`center`,`top`,`bottom`,`left`,`right`,`top left`],s=[`no-repeat`,`repeat`,`repeat-x`,`repeat-y`,`space`,`round`],c=[`scroll`,`fixed`,`local`],l=[{label:`Color`,token:`--sf-surface-bg-color`,placeholder:`transparent`},{label:`Image`,token:`--sf-surface-bg-image`,placeholder:`url("/hero.avif")`},{label:`Overlay`,token:`--sf-surface-bg-overlay`,placeholder:`var(--sf-scrim-gradient)`},{label:`Animation`,token:`--sf-surface-bg-animation`,placeholder:`sf-pan 40s linear infinite`}],u=[{label:`Size`,token:`--sf-surface-bg-size`,opts:a},{label:`Position`,token:`--sf-surface-bg-position`,opts:o},{label:`Repeat`,token:`--sf-surface-bg-repeat`,opts:s},{label:`Attachment`,token:`--sf-surface-bg-attachment`,opts:c}],d=[{label:`Heading gap`,token:`--sf-prose-heading-gap`,def:.75,max:3,raw:`var(--sf-space-s)`},{label:`List gap`,token:`--sf-prose-list-gap`,def:.5,max:2,raw:`var(--sf-space-xs)`},{label:`Block margin`,token:`--sf-prose-block-margin`,def:1,max:4,raw:`var(--sf-space-m)`},{label:`Media margin`,token:`--sf-prose-media-margin`,def:1,max:4,raw:`var(--sf-space-m)`},{label:`Figure margin`,token:`--sf-prose-figure-margin`,def:1.5,max:4,raw:`var(--sf-space-l)`},{label:`Blockquote padding`,token:`--sf-prose-blockquote-padding`,def:1,max:3,raw:`var(--sf-space-m)`},{label:`HR margin`,token:`--sf-prose-hr-margin`,def:1.5,max:4,raw:`var(--sf-space-l)`}],f=L(!1),p=L(!1),m=L(!1),h=L(!1),g=L(!1),_=L(!1),v=L(!1),y=L(!1),b=I(()=>n(`--sf-line-clamp`,3)),x=I(()=>n(`--sf-flow-space`,.5,`rem`)),S=I(()=>n(`--sf-scroll-shadow-size`,2,`rem`)),C=I(()=>t.overrides[`--sf-aspect`]??`16 / 9`),w=I(()=>t.overrides[`--sf-scrim-color`]??`oklch(0 0 0 / 0.55)`),T=I(()=>t.overrides[`--sf-scrim-direction`]??`to top`),E=I(()=>n(`--sf-prose-media-radius`,6,`px`)),D=I(()=>t.overrides[`--sf-surface-bg-image`]??`none`),O=I(()=>t.overrides[`--sf-surface-bg-overlay`]??`none`),k=I(()=>t.overrides[`--sf-surface-bg-color`]??`transparent`),A=I(()=>t.overrides[`--sf-surface-bg-size`]??`cover`),ee=I(()=>t.overrides[`--sf-surface-bg-position`]??`center`),te=I(()=>t.overrides[`--sf-surface-bg-repeat`]??`no-repeat`),j=I(()=>t.overrides[`--sf-surface-bg-attachment`]??`scroll`),ne=I(()=>t.overrides[`--sf-surface-bg-animation`]??`none`);function M(e){let n=t.overrides[e.token];if(!n)return e.def;let r=parseFloat(n);return isNaN(r)?e.def:r}var re=Xp(),ie=V(z(re),2),ae=z(ie),oe=V(z(ae),2),se=z(oe,!0);F(oe),F(ae);var N=V(ae,2),ce=e=>{var n=Rp(),r=B(n);{let e=I(()=>`--sf-flow-space`in t.overrides);$(r,{label:`Flow space`,get value(){return U(x)},min:0,max:4,step:.0625,unit:`rem`,help:`--sf-flow-space — vertical gap between adjacent children of .sf-flow`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-flow-space`,`${e}rem`),onReset:()=>t.onReset(`--sf-flow-space`),rawDefault:`var(--sf-content-gap)`,get variableOptions(){return af},get currentRaw(){return t.overrides[`--sf-flow-space`]},onRawSet:e=>t.onSet(`--sf-flow-space`,e)})}var i=V(r,2);Y(i,20,()=>[0,1,2],e=>e,(e,t)=>{var n=Lp();H(()=>Z(n,`width:${90-t*12}%`)),K(e,n)}),F(i),H(()=>Z(i,`display:flex;flex-direction:column;gap:${U(x)}rem`)),K(e,n)};J(N,e=>{U(f)&&e(ce)}),F(ie);var le=V(ie,4),ue=z(le),de=V(z(ue),2),fe=z(de,!0);F(de),F(ue);var pe=V(ue,2),me=e=>{var n=zp(),r=B(n);{let e=I(()=>`--sf-line-clamp`in t.overrides);$(r,{label:`Default lines`,get value(){return U(b)},min:1,max:8,step:1,help:`--sf-line-clamp — default line count for .sf-line-clamp (override per element)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-line-clamp`,String(e)),onReset:()=>t.onReset(`--sf-line-clamp`)})}var i=V(r,2),a=z(i);F(i),H(()=>Z(a,`display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:${U(b)};overflow:hidden`)),K(e,n)};J(pe,e=>{U(p)&&e(me)}),F(le);var he=V(le,4),ge=z(he),_e=V(z(ge),2),ve=z(_e,!0);F(_e),F(ge);var ye=V(ge,2),be=e=>{var n=Vp(),i=V(B(n),2);Y(i,21,()=>r,e=>e.value,(e,n)=>{var r=Bp(),i=z(r,!0);F(r),H(e=>{X(r,1,e),q(i,U(n).label)},[()=>`py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(C).replace(/\s/g,``)===U(n).value.replace(/\s/g,``)?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`]),W(`click`,r,()=>U(n).value===`16 / 9`?t.onReset(`--sf-aspect`):t.onSet(`--sf-aspect`,U(n).value)),K(e,r)}),F(i);var a=V(i,2),o=z(a),s=z(o,!0);F(o),F(a),H(()=>{Z(o,`aspect-ratio:${U(C)};max-height:120px;max-width:100%;width:auto;height:120px`),q(s,U(C))}),K(e,n)};J(ye,e=>{U(m)&&e(be)}),F(he);var xe=V(he,4),Se=z(xe),Ce=V(z(Se),2),we=z(Ce,!0);F(Ce),F(Se);var Te=V(Se,2),Ee=e=>{var n=Hp(),r=B(n);{let e=I(()=>`--sf-scroll-shadow-size`in t.overrides);$(r,{label:`Fade size`,get value(){return U(S)},min:0,max:6,step:.25,unit:`rem`,help:`--sf-scroll-shadow-size — size of the edge fade mask on .sf-scroll-shadow / .sf-overflow-fade`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-scroll-shadow-size`,`${e}rem`),onReset:()=>t.onReset(`--sf-scroll-shadow-size`)})}var i=V(r,2),a=z(i);F(i),H(()=>Z(a,`mask:linear-gradient(to right, transparent, #000 ${U(S)}rem, #000 calc(100% - ${U(S)}rem), transparent)`)),K(e,n)};J(Te,e=>{U(h)&&e(Ee)}),F(xe);var De=V(xe,4),P=z(De),Oe=V(z(P),2),ke=z(Oe,!0);F(Oe),F(P);var Ae=V(P,2),je=e=>{var n=Wp(),r=V(B(n),2),a=V(z(r),2);zi(a);var o=V(a,2),s=e=>{var n=Up();W(`click`,n,()=>t.onReset(`--sf-scrim-color`)),K(e,n)};J(o,e=>{`--sf-scrim-color`in t.overrides&&e(s)}),F(r);var c=V(r,2),l=V(z(c),2);Y(l,21,()=>i,e=>e.value,(e,n)=>{var r=Bp(),i=z(r,!0);F(r),H(()=>{X(r,1,`py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(T)===U(n).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,U(n).label)}),W(`click`,r,()=>U(n).value===`to top`?t.onReset(`--sf-scrim-direction`):t.onSet(`--sf-scrim-direction`,U(n).value)),K(e,r)}),F(l),F(c);var u=V(c,2),d=z(u);Me(2),F(u);var f=V(u,2),p=V(z(f),2);zi(p);var m=V(p,2),h=e=>{var n=Up();W(`click`,n,()=>t.onReset(`--sf-scrim-text-shadow`)),K(e,n)};J(m,e=>{`--sf-scrim-text-shadow`in t.overrides&&e(h)}),F(f),H(()=>{Bi(a,t.overrides[`--sf-scrim-color`]??``),Z(d,`background:linear-gradient(${U(T)}, ${U(w)}, transparent)`),Bi(p,t.overrides[`--sf-scrim-text-shadow`]??``)}),W(`input`,a,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-scrim-color`,n):t.onReset(`--sf-scrim-color`)}),W(`input`,p,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-scrim-text-shadow`,n):t.onReset(`--sf-scrim-text-shadow`)}),K(e,n)};J(Ae,e=>{U(g)&&e(je)}),F(De);var Ne=V(De,4),Pe=z(Ne),Fe=V(z(Pe),2),Ie=z(Fe,!0);F(Fe),F(Pe);var Le=V(Pe,2),Re=e=>{var n=Gp(),r=V(B(n),2),i=z(r);Y(i,17,()=>d,e=>e.token,(e,n)=>{{let r=I(()=>M(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:0,get max(){return U(n).max},step:.0625,unit:`rem`,get help(){return U(n).token},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}rem`),onReset:()=>t.onReset(U(n).token),get rawDefault(){return U(n).raw},get variableOptions(){return af},get currentRaw(){return t.overrides[U(n).token]},onRawSet:e=>t.onSet(U(n).token,e)})}});var a=V(i,2);{let e=I(()=>`--sf-prose-media-radius`in t.overrides);$(a,{label:`Media radius`,get value(){return U(E)},min:0,max:32,step:1,unit:`px`,help:`--sf-prose-media-radius — corner radius on prose images/video`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-prose-media-radius`,`${e}px`),onReset:()=>t.onReset(`--sf-prose-media-radius`),rawDefault:`var(--sf-radius-m)`,get variableOptions(){return of},get currentRaw(){return t.overrides[`--sf-prose-media-radius`]},onRawSet:e=>t.onSet(`--sf-prose-media-radius`,e)})}var o=V(a,2),s=V(z(o),2);zi(s);var c=V(s,2),l=e=>{var n=Up();W(`click`,n,()=>t.onReset(`--sf-prose-marker-color`)),K(e,n)};J(c,e=>{`--sf-prose-marker-color`in t.overrides&&e(l)}),F(o),F(r),H(()=>Bi(s,t.overrides[`--sf-prose-marker-color`]??``)),W(`input`,s,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-prose-marker-color`,n):t.onReset(`--sf-prose-marker-color`)}),K(e,n)};J(Le,e=>{U(_)&&e(Re)}),F(Ne);var ze=V(Ne,2),Be=z(ze),Ve=V(z(Be),2),He=z(Ve,!0);F(Ve),F(Be);var Ge=V(Be,2),Ke=e=>{var n=Kp(),r=V(B(n),2),i=V(z(r),2);zi(i);var a=V(i,2),o=e=>{var n=Up();W(`click`,n,()=>t.onReset(`--sf-content-intrinsic-size`)),K(e,n)};J(a,e=>{`--sf-content-intrinsic-size`in t.overrides&&e(o)}),F(r),H(()=>Bi(i,t.overrides[`--sf-content-intrinsic-size`]??``)),W(`input`,i,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-content-intrinsic-size`,n):t.onReset(`--sf-content-intrinsic-size`)}),K(e,n)};J(Ge,e=>{U(v)&&e(Ke)}),F(ze);var qe=V(ze,4),Je=z(qe),Ye=V(z(Je),2),Xe=z(Ye,!0);F(Ye),F(Je);var Ze=V(Je,2),Qe=e=>{var n=Yp(),r=V(B(n),2);Y(r,17,()=>l,e=>e.token,(e,n)=>{var r=qp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=Up();W(`click`,r,()=>t.onReset(U(n).token)),K(e,r)};J(s,e=>{U(n).token in t.overrides&&e(c)}),F(r),H(()=>{q(a,U(n).label),Bi(o,t.overrides[U(n).token]??``),Q(o,`placeholder`,U(n).placeholder)}),W(`input`,o,e=>{let r=e.target.value;r.trim()?t.onSet(U(n).token,r):t.onReset(U(n).token)}),K(e,r)});var i=V(r,2);Y(i,17,()=>u,e=>e.token,(e,n)=>{var r=Jp(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);Y(o,20,()=>U(n).opts,e=>e,(e,r)=>{var i=Bp(),a=z(i,!0);F(i),H(()=>{X(i,1,`py-1 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${(t.overrides[U(n).token]??U(n).opts[0])===r?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(a,r)}),W(`click`,i,()=>r===U(n).opts[0]?t.onReset(U(n).token):t.onSet(U(n).token,r)),K(e,i)}),F(o),F(r),H(()=>q(a,U(n).label)),K(e,r)});var a=V(i,2);H(()=>Z(a,`background-color:${U(k)};background-image:${U(O)}, ${U(D)};background-size:${U(A)};background-position:${U(ee)};background-repeat:${U(te)};background-attachment:${U(j)};animation:${U(ne)}`)),K(e,n)};J(Ze,e=>{U(y)&&e(Qe)}),F(qe),Me(2),F(re),H(()=>{Q(ae,`aria-expanded`,U(f)),q(se,U(f)?`▲`:`▼`),Q(ue,`aria-expanded`,U(p)),q(fe,U(p)?`▲`:`▼`),Q(ge,`aria-expanded`,U(m)),q(ve,U(m)?`▲`:`▼`),Q(Se,`aria-expanded`,U(h)),q(we,U(h)?`▲`:`▼`),Q(P,`aria-expanded`,U(g)),q(ke,U(g)?`▲`:`▼`),Q(Pe,`aria-expanded`,U(_)),q(Ie,U(_)?`▲`:`▼`),Q(Be,`aria-expanded`,U(v)),q(He,U(v)?`▲`:`▼`),Q(Je,`aria-expanded`,U(y)),q(Xe,U(y)?`▲`:`▼`)}),W(`click`,ae,()=>{R(f,!U(f))}),W(`click`,ue,()=>{R(p,!U(p))}),W(`click`,ge,()=>{R(m,!U(m))}),W(`click`,Se,()=>{R(h,!U(h))}),W(`click`,P,()=>{R(g,!U(g))}),W(`click`,Pe,()=>{R(_,!U(_))}),W(`click`,Be,()=>{R(v,!U(v))}),W(`click`,Je,()=>{R(y,!U(y))}),K(e,re),We()}Br([`click`,`input`]);var Qp=G(`

Minimum interactive area — ensures accessibility on touch devices.

`,1),$p=G(``),em=G(`
`),tm=G(`
`),nm=G(`

Override individual z-index tokens in the "All tokens" tab.

`,1),rm=G(`
Selection background
Selection text color

Select this text to preview the selection color.

.sf-selection--alt — alternate treatment for surfaces that invert colors relative to the page (e.g. a dark card on a light page).

Alt selection background
Alt selection text color

Select this text to preview the alt selection color.

`),im=G(`
`,1),am=G(`
`),om=G(`

Controls the height / tap-target of all sized components (buttons, inputs, badges).

`,1),sm=G(``),cm=G(`
Caret color
Underline thickness

A sample link with the current underline settings.

`,1),lm=G(`

Icon scale tokens used by .sf-icon-* utilities. Values are in em units relative to surrounding text.

`,1),um=G(``),dm=G(``),fm=G(`

Default values for .sf-media images and replaced elements.

Fit
Position
`,1),pm=G(`
`),mm=G(`

Default to the device's env(safe-area-inset-*). Override only if you need fixed padding regardless of notch/home-indicator.

`,1),hm=G(`
`),gm=G(`

Applied inside @media print via optional/print.css.

Page size
`,1),_m=G(`
`),vm=G(`

Boolean CSS custom property flags (0 = off, 1 = on). Components toggle these to activate state-specific styles. Overriding globally forces all matching elements into that state — useful for testing and demos.

Required marker
`,1),ym=G(`

Selection colors, caret, links, focus ring, borders and sizes all render in the live preview (try the Components template). Scroll behavior applies to the page - itself and can't be shown in the static canvas.

`);function bm(e,t){Ue(t,!0);let n=[{label:`Below`,token:`--sf-z-below`,note:`Behind content (e.g. decorative BG)`},{label:`Raised`,token:`--sf-z-raised`,note:`Slightly above flow`},{label:`Dropdown`,token:`--sf-z-dropdown`,note:`Dropdowns, popovers`},{label:`Sticky`,token:`--sf-z-sticky`,note:`Sticky headers, toolbars`},{label:`Fixed`,token:`--sf-z-fixed`,note:`Fixed UI chrome`},{label:`Overlay`,token:`--sf-z-overlay`,note:`Modals, drawers backdrop`},{label:`Modal`,token:`--sf-z-modal`,note:`Modal dialogs`},{label:`Popover`,token:`--sf-z-popover`,note:`Tooltips, menus`},{label:`Tooltip`,token:`--sf-z-tooltip`,note:`Inline tooltips`},{label:`Toast`,token:`--sf-z-toast`,note:`Notifications`}],r=[{label:`Smooth`,value:`smooth`},{label:`Auto`,value:`auto`}],i=[{label:`XS`,token:`--sf-size-xs`,default:1.5},{label:`S`,token:`--sf-size-s`,default:2},{label:`M`,token:`--sf-size-m`,default:2.5},{label:`L`,token:`--sf-size-l`,default:2.75},{label:`XL`,token:`--sf-size-xl`,default:3.5}];function a(e,t,n){if(!e)return t;let r=parseFloat(n?e.replace(n,``):e);return isNaN(r)?t:r}let o=I(()=>a(t.overrides[`--sf-touch-target`],44,`px`)),s=I(()=>t.overrides[`--sf-scroll-behavior`]??`smooth`),c=I(()=>a(t.overrides[`--sf-z-base`],0)),l=I(()=>t.overrides[`--sf-caret-color`]??``),u=I(()=>a(t.overrides[`--sf-link-underline-offset`]?.replace(`em`,``),.15)),d=I(()=>t.overrides[`--sf-link-underline-thickness`]??`auto`),f=I(()=>t.overrides[`--sf-focus-ring-style`]??`solid`),p=L(!1),m=L(!1),g=L(!1),_=L(!1),v=L(!1),y=L(!1),b=L(!1),x=L(!1),S=L(!1),C=L(!1),w=L(!1),T=L(!1);function E(e){return a(t.overrides[e.token]?.replace(`rem`,``),e.default)}var D=ym(),O=z(D),k=z(O),A=V(z(k),2),ee=z(A,!0);F(A),F(k);var j=V(k,2),te=e=>{var n=Qp(),r=B(n);{let e=I(()=>`--sf-touch-target`in t.overrides);$(r,{label:`Min touch size`,get value(){return U(o)},min:32,max:64,step:1,unit:`px`,help:`--sf-touch-target — minimum tappable area for interactive elements (WCAG 2.5.5)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-touch-target`,`${e}px`),onReset:()=>t.onReset(`--sf-touch-target`),rawDefault:`var(--sf-size-l)`,get variableOptions(){return lf},get currentRaw(){return t.overrides[`--sf-touch-target`]},onRawSet:e=>t.onSet(`--sf-touch-target`,e)})}var i=V(r,2),a=z(i),s=z(a);F(a),Me(2),F(i),H(()=>{Z(a,`width: ${U(o)}px; height: ${U(o)}px`),q(s,`${U(o)??``}px`)}),K(e,n)};J(j,e=>{U(p)&&e(te)}),F(O);var ne=V(O,4),M=z(ne),re=V(z(M),2),ie=z(re,!0);F(re),F(M);var ae=V(M,2),oe=e=>{var n=em();Y(n,21,()=>r,e=>e.value,(e,n)=>{var r=$p(),i=z(r,!0);F(r),H(()=>{X(r,1,`flex-1 py-2 rounded-lg text-[10px] border transition-all cursor-pointer ${U(s)===U(n).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,U(n).label)}),W(`click`,r,()=>U(n).value===`smooth`?t.onReset(`--sf-scroll-behavior`):t.onSet(`--sf-scroll-behavior`,U(n).value)),K(e,r)}),F(n),K(e,n)};J(ae,e=>{U(m)&&e(oe)}),F(ne);var se=V(ne,4),N=z(se),ce=V(z(N),2),le=z(ce,!0);F(ce),F(N);var ue=V(N,2),de=e=>{var r=nm(),i=B(r);{let e=I(()=>`--sf-z-base`in t.overrides);$(i,{label:`Base offset`,get value(){return U(c)},min:0,max:1e3,step:10,help:`--sf-z-base — added to all z-index tokens to avoid conflicts with existing stacking contexts`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-z-base`,String(e)),onReset:()=>t.onReset(`--sf-z-base`)})}var a=V(i,2);Y(a,21,()=>n,e=>e.token,(e,n)=>{let r=I(()=>U(n).token in t.overrides);var i=tm(),a=z(i),o=V(a,2),s=z(o,!0);F(o);var c=V(o,2),l=z(c,!0);F(c);var u=V(c,2),d=z(u,!0);F(u),F(i),H(e=>{X(a,1,`w-1.5 h-1.5 rounded-full shrink-0 ${U(r)?`bg-amber-400`:`bg-black/20 dark:bg-white/20`}`),q(s,U(n).label),q(l,U(n).note),q(d,e)},[()=>U(n).token.replace(`--sf-z-`,``)]),K(e,i)}),F(a),Me(2),K(e,r)};J(ue,e=>{U(g)&&e(de)}),F(se);var fe=V(se,4),pe=z(fe),me=V(z(pe),2),he=z(me,!0);F(me),F(pe);var ge=V(pe,2),_e=e=>{var n=rm(),r=z(n),i=V(z(r),2);{let e=I(()=>t.overrides[`--sf-color-selection-bg`]??``),n=I(()=>`--sf-color-selection-bg`in t.overrides);ku(i,{token:`--sf-color-selection-bg`,get value(){return U(e)},placeholder:`default`,get isOverridden(){return U(n)},onSet:e=>t.onSet(`--sf-color-selection-bg`,e),onReset:()=>t.onReset(`--sf-color-selection-bg`)})}F(r);var a=V(r,2),o=V(z(a),2);{let e=I(()=>t.overrides[`--sf-color-selection-text`]??``),n=I(()=>`--sf-color-selection-text`in t.overrides);ku(o,{token:`--sf-color-selection-text`,get value(){return U(e)},placeholder:`default`,get isOverridden(){return U(n)},onSet:e=>t.onSet(`--sf-color-selection-text`,e),onReset:()=>t.onReset(`--sf-color-selection-text`)})}F(a);var s=V(a,2),c=z(s);F(s);var l=V(s,6),u=V(z(l),2);{let e=I(()=>t.overrides[`--sf-color-selection-bg--alt`]??``),n=I(()=>`--sf-color-selection-bg--alt`in t.overrides);ku(u,{token:`--sf-color-selection-bg--alt`,get value(){return U(e)},placeholder:`default`,get isOverridden(){return U(n)},onSet:e=>t.onSet(`--sf-color-selection-bg--alt`,e),onReset:()=>t.onReset(`--sf-color-selection-bg--alt`)})}F(l);var d=V(l,2),f=V(z(d),2);{let e=I(()=>t.overrides[`--sf-color-selection-text--alt`]??``),n=I(()=>`--sf-color-selection-text--alt`in t.overrides);ku(f,{token:`--sf-color-selection-text--alt`,get value(){return U(e)},placeholder:`default`,get isOverridden(){return U(n)},onSet:e=>t.onSet(`--sf-color-selection-text--alt`,e),onReset:()=>t.onReset(`--sf-color-selection-text--alt`)})}F(d);var p=V(d,2),m=z(p);F(p),F(n),H(()=>{Z(c,`--sf-color-selection-bg: ${t.overrides[`--sf-color-selection-bg`]??`#6366f1`}; --sf-color-selection-text: ${t.overrides[`--sf-color-selection-text`]??`#ffffff`}`),Z(m,`--sf-color-selection-bg: ${t.overrides[`--sf-color-selection-bg--alt`]??`#4338ca`}; --sf-color-selection-text: ${t.overrides[`--sf-color-selection-text--alt`]??`#e0e7ff`}`)}),K(e,n)};J(ge,e=>{U(_)&&e(_e)}),F(fe);var ve=V(fe,4),ye=z(ve),be=V(z(ye),2),xe=z(be,!0);F(be),F(ye);var Se=V(ye,2),Ce=e=>{var n=im(),r=B(n);Y(r,20,()=>[`solid`,`dashed`,`dotted`],e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-focus-ring-style`]??`solid`);var i=$p(),a=z(i,!0);F(i),H(()=>{X(i,1,`flex-1 py-2 rounded-lg text-[10px] border transition-all cursor-pointer capitalize ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(a,n)}),W(`click`,i,()=>n===`solid`?t.onReset(`--sf-focus-ring-style`):t.onSet(`--sf-focus-ring-style`,n)),K(e,i)}),F(r);var i=V(r,2),a=z(i),o=z(a);F(a),F(i),H(()=>{Z(a,`outline: 2px ${U(f)} ${t.overrides[`--sf-focus-ring-color`]||`oklch(0.7 0.2 235)`}; outline-offset: 2px`),q(o,`Focus ring · ${U(f)??``}`)}),K(e,n)};J(Se,e=>{U(v)&&e(Ce)}),F(ve);var we=V(ve,4),Te=z(we),Ee=V(z(Te),2),De=z(Ee,!0);F(Ee),F(Te);var P=V(Te,2),Oe=e=>{var n=om(),r=V(B(n),2);Y(r,21,()=>i,e=>e.token,(e,n)=>{let r=I(()=>E(U(n)));{let i=I(()=>`${U(n).token} — component size step ${U(n).label}`),a=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:1,max:5,step:.05,unit:`rem`,get help(){return U(i)},get overridden(){return U(a)},onChange:e=>t.onSet(U(n).token,`${e}rem`),onReset:()=>t.onReset(U(n).token)})}}),F(r);var a=V(r,2);Y(a,21,()=>i,e=>e.token,(e,t)=>{let n=I(()=>E(U(t)));var r=am(),i=z(r),a=V(i,2),o=z(a,!0);F(a),F(r),H(e=>{Z(i,e),q(o,U(t).label)},[()=>`height: ${Math.min(U(n)*14,64)}px`]),K(e,r)}),F(a),K(e,n)};J(P,e=>{U(y)&&e(Oe)}),F(we);var ke=V(we,4),Ae=z(ke),je=V(z(Ae),2),Ne=z(je,!0);F(je),F(Ae);var Pe=V(Ae,2),Fe=e=>{var n=cm(),r=B(n),i=V(z(r),2);{let e=I(()=>`--sf-caret-color`in t.overrides);ku(i,{token:`--sf-caret-color`,get value(){return U(l)},placeholder:`default (action color)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-caret-color`,e),onReset:()=>t.onReset(`--sf-caret-color`)})}F(r);var a=V(r,2);{let e=I(()=>`--sf-link-underline-offset`in t.overrides);$(a,{label:`Underline offset`,get value(){return U(u)},min:0,max:.5,step:.01,unit:`em`,help:`--sf-link-underline-offset — gap between text baseline and underline`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-link-underline-offset`,`${e}em`),onReset:()=>t.onReset(`--sf-link-underline-offset`)})}var o=V(a,2),s=z(o),c=V(z(s),2),f=e=>{var n=sm();W(`click`,n,()=>t.onReset(`--sf-link-underline-thickness`)),K(e,n)};J(c,e=>{`--sf-link-underline-thickness`in t.overrides&&e(f)}),F(s);var p=V(s,2);Y(p,20,()=>[[`auto`,`auto`],[`1px`,`1px`],[`2px`,`2px`],[`3px`,`3px`]],([e,t])=>t,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1];var o=$p(),s=z(o,!0);F(o),H(()=>{X(o,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer ${U(d)===a()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(s,i())}),W(`click`,o,()=>a()===`auto`?t.onReset(`--sf-link-underline-thickness`):t.onSet(`--sf-link-underline-thickness`,a())),K(e,o)}),F(p),F(o);var m=V(o,2),g=z(m),_=V(g,2),v=V(z(_));Me(),F(_),F(m),H(()=>{Z(g,`caret-color:${U(l)||`#6366f1`}`),Z(v,`text-decoration:underline;text-underline-offset:${U(u)}em;text-decoration-thickness:${U(d)}`)}),W(`click`,v,e=>e.preventDefault()),K(e,n)};J(Pe,e=>{U(b)&&e(Fe)}),F(ke);var Ie=V(ke,4),Le=z(Ie),Re=V(z(Le),2),ze=z(Re,!0);F(Re),F(Le);var Be=V(Le,2),Ve=e=>{var n=lm(),r=V(B(n),2);Y(r,20,()=>[{label:`xs`,token:`--sf-icon-xs`,def:.875},{label:`s`,token:`--sf-icon-s`,def:1},{label:`m`,token:`--sf-icon-m`,def:1.5},{label:`l`,token:`--sf-icon-l`,def:2},{label:`xl`,token:`--sf-icon-xl`,def:3},{label:`2xl`,token:`--sf-icon-2xl`,def:4}],e=>e.token,(e,n)=>{{let r=I(()=>a(t.overrides[n.token]?.replace(`em`,``),n.def)),i=I(()=>n.token in t.overrides);$(e,{get label(){return n.label},get value(){return U(r)},min:.5,max:6,step:.125,unit:`em`,get overridden(){return U(i)},onChange:e=>t.onSet(n.token,`${e}em`),onReset:()=>t.onReset(n.token)})}}),F(r);var i=V(r,2);{let e=I(()=>a(t.overrides[`--sf-icon-box-pad`]?.replace(`em`,``),.5)),n=I(()=>`--sf-icon-box-pad`in t.overrides);$(i,{label:`Box padding`,get value(){return U(e)},min:0,max:2,step:.125,unit:`em`,help:`--sf-icon-box-pad — padding around icon when using .sf-icon-box`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-icon-box-pad`,`${e}em`),onReset:()=>t.onReset(`--sf-icon-box-pad`)})}K(e,n)};J(Be,e=>{U(x)&&e(Ve)}),F(Ie);var He=V(Ie,4),Ge=z(He),Ke=V(z(Ge),2),qe=z(Ke,!0);F(Ke),F(Ge);var Je=V(Ge,2),Ye=e=>{var n=fm(),r=V(B(n),2),i=V(z(r),2);Y(i,20,()=>[`cover`,`contain`,`fill`,`none`],e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-object-fit`]??`cover`);var i=$p(),a=z(i,!0);F(i),H(()=>{X(i,1,`flex-1 py-1.5 rounded-lg text-[9px] border transition-all cursor-pointer ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,n)}),W(`click`,i,()=>n===`cover`?t.onReset(`--sf-object-fit`):t.onSet(`--sf-object-fit`,n)),K(e,i)}),F(i);var a=V(i,2),o=e=>{var n=um();W(`click`,n,()=>t.onReset(`--sf-object-fit`)),K(e,n)};J(a,e=>{`--sf-object-fit`in t.overrides&&e(o)}),F(r);var s=V(r,2),c=V(z(s),2);zi(c);var l=V(c,2),u=e=>{var n=dm();W(`click`,n,()=>t.onReset(`--sf-object-position`)),K(e,n)};J(l,e=>{`--sf-object-position`in t.overrides&&e(u)}),F(s),H(()=>Bi(c,t.overrides[`--sf-object-position`]??``)),W(`input`,c,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-object-position`,n):t.onReset(`--sf-object-position`)}),K(e,n)};J(Je,e=>{U(S)&&e(Ye)}),F(He);var Xe=V(He,4),Ze=z(Xe),Qe=V(z(Ze),2),$e=z(Qe,!0);F(Qe),F(Ze);var et=V(Ze,2),tt=e=>{var n=mm(),r=V(B(n),2);Y(r,20,()=>[{label:`Top`,token:`--sf-safe-top`,placeholder:`env(safe-area-inset-top, 0px)`},{label:`Right`,token:`--sf-safe-right`,placeholder:`env(safe-area-inset-right, 0px)`},{label:`Bottom`,token:`--sf-safe-bottom`,placeholder:`env(safe-area-inset-bottom, 0px)`},{label:`Left`,token:`--sf-safe-left`,placeholder:`env(safe-area-inset-left, 0px)`}],e=>e.token,(e,n)=>{var r=pm(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=dm();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.placeholder)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(r),K(e,n)};J(et,e=>{U(w)&&e(tt)}),F(Xe);var nt=V(Xe,4),rt=z(nt),it=V(z(rt),2),at=z(it,!0);F(it),F(rt);var ot=V(rt,2),st=e=>{var n=gm(),r=V(B(n),2),i=V(z(r),2);Y(i,20,()=>[`a4`,`letter`,`legal`,`a3`],e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-print-page-size`]??`a4`);var i=$p(),a=z(i,!0);F(i),H(()=>{X(i,1,`flex-1 py-1.5 rounded-lg text-[9px] border transition-all cursor-pointer ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,n)}),W(`click`,i,()=>n===`a4`?t.onReset(`--sf-print-page-size`):t.onSet(`--sf-print-page-size`,n)),K(e,i)}),F(i),F(r),Y(V(r,2),16,()=>[{label:`Base size`,token:`--sf-print-base-size`,placeholder:`11pt`},{label:`Page margin`,token:`--sf-print-page-margin`,placeholder:`2cm`}],e=>e.token,(e,n)=>{var r=hm(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=dm();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.placeholder)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),K(e,n)};J(ot,e=>{U(C)&&e(st)}),F(nt);var ct=V(nt,4),lt=z(ct),ut=V(z(lt),2),dt=z(ut,!0);F(ut),F(lt);var ft=V(lt,2),pt=e=>{var n=vm(),r=V(B(n),2);Y(r,20,()=>[{label:`sf-is-active`,token:`--sf-is-active`,note:`Active/selected state`},{label:`sf-is-current`,token:`--sf-is-current`,note:`Current page/item`},{label:`sf-is-open`,token:`--sf-is-open`,note:`Open/expanded state`},{label:`sf-is-pressed`,token:`--sf-is-pressed`,note:`Pressed/depressed state`}],e=>e.token,(e,n)=>{let r=I(()=>t.overrides[n.token]??`0`);var i=_m(),a=z(i),o=z(a);F(a);var s=V(a,2),c=z(s,!0);F(s);var l=V(s,2),u=z(l,!0);F(l);var d=V(l,2),f=e=>{var r=dm();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(d,e=>{n.token in t.overrides&&e(f)}),F(i),H(()=>{Q(a,`aria-label`,n.label),Q(a,`aria-pressed`,U(r)===`1`),X(a,1,`w-8 h-4 rounded-full transition-colors relative cursor-pointer shrink-0 ${U(r)===`1`?`bg-indigo-600`:`bg-black/10 dark:bg-white/10`}`),X(o,1,`absolute top-0.5 w-3 h-3 bg-white rounded-full shadow transition-transform ${U(r)===`1`?`translate-x-4`:`translate-x-0.5`}`),q(c,n.label),q(u,n.note)}),W(`click`,a,()=>U(r)===`1`?t.onReset(n.token):t.onSet(n.token,`1`)),K(e,i)}),F(r);var i=V(r,2),a=V(z(i),2);zi(a);var o=V(a,2),s=e=>{var n=dm();W(`click`,n,()=>t.onReset(`--sf-field-required-marker`)),K(e,n)};J(o,e=>{`--sf-field-required-marker`in t.overrides&&e(s)}),F(i),H(()=>Bi(a,t.overrides[`--sf-field-required-marker`]??``)),W(`input`,a,e=>{let n=e.target.value;n?t.onSet(`--sf-field-required-marker`,n):t.onReset(`--sf-field-required-marker`)}),K(e,n)};J(ft,e=>{U(T)&&e(pt)}),F(ct),Me(4),F(D),H(()=>{Q(k,`aria-expanded`,U(p)),q(ee,U(p)?`▲`:`▼`),Q(M,`aria-expanded`,U(m)),q(ie,U(m)?`▲`:`▼`),Q(N,`aria-expanded`,U(g)),q(le,U(g)?`▲`:`▼`),Q(pe,`aria-expanded`,U(_)),q(he,U(_)?`▲`:`▼`),Q(ye,`aria-expanded`,U(v)),q(xe,U(v)?`▲`:`▼`),Q(Te,`aria-expanded`,U(y)),q(De,U(y)?`▲`:`▼`),Q(Ae,`aria-expanded`,U(b)),q(Ne,U(b)?`▲`:`▼`),Q(Le,`aria-expanded`,U(x)),q(ze,U(x)?`▲`:`▼`),Q(Ge,`aria-expanded`,U(S)),q(qe,U(S)?`▲`:`▼`),Q(Ze,`aria-expanded`,U(w)),q($e,U(w)?`▲`:`▼`),Q(rt,`aria-expanded`,U(C)),q(at,U(C)?`▲`:`▼`),Q(lt,`aria-expanded`,U(T)),q(dt,U(T)?`▲`:`▼`)}),W(`click`,k,()=>{R(p,!U(p))}),W(`click`,M,()=>{R(m,!U(m))}),W(`click`,N,()=>{R(g,!U(g))}),W(`click`,pe,()=>{R(_,!U(_))}),W(`click`,ye,()=>{R(v,!U(v))}),W(`click`,Te,()=>{R(y,!U(y))}),W(`click`,Ae,()=>{R(b,!U(b))}),W(`click`,Le,()=>{R(x,!U(x))}),W(`click`,Ge,()=>{R(S,!U(S))}),W(`click`,Ze,()=>{R(w,!U(w))}),W(`click`,rt,()=>{R(C,!U(C))}),W(`click`,lt,()=>{R(T,!U(T))}),K(e,D),We()}Br([`click`,`input`]);var xm=G(``),Sm=G(`
Variant (preview only)
Style
Size
Label size — --sf-btn-font-size
Label weight — --sf-btn-font-weight
`,1),Cm=G(`

Card title

Body copy showing padding, gap, and background live.

Radius (outer, computed)

--sf-card-radius-outer = radius + padding (concentric math) — not independently overridable, always computed from the two sliders above.

Background — --sf-card-bg
Border color — --sf-card-border-color
Shadow — --sf-card-shadow
Elevated shadow — --sf-card-shadow--elevated
Hover shadow (interactive) — --sf-card-shadow--hover
Media aspect ratio — --sf-card-media-ratio
Title size — --sf-card-heading-size
Nested button size — --sf-card-btn-font-size
Media object-fit — --sf-object-fit (global, affects all img/video)
`,1),wm=G(`
`);function Tm(e,t){Ue(t,!0);let n=[`2xs`,`xs`,`s`,`m`,`l`,`xl`,`2xl`],r=[`xs`,`s`,`m`,`l`,`xl`,`2xl`],i=[`square`,`video`,`cinema`,`4-3`,`3-2`,`portrait`,`golden`],a=[`100`,`200`,`300`,`400`,`500`,`600`,`700`,`800`,`900`],o=[`default`,`primary`,`neutral`,`success`,`warning`,`info`,`danger`],s=[{id:`fill`,label:`Fill`},{id:`secondary`,label:`Secondary`},{id:`ghost`,label:`Ghost`},{id:`outline`,label:`Outline`}],c=[`xs`,`s`,`m`,`l`,`xl`],l=[{step:`surface`,label:`Surface`},{step:`base`,label:`Base`},{step:`inset`,label:`Inset`},{step:`raised`,label:`Raised`}],u=[{step:`border`,label:`Default`},{step:`border--subtle`,label:`Subtle`},{step:`border--strong`,label:`Strong`}],d=[{label:`Radius`,token:`--sf-btn-radius`,unit:`rem`,min:0,max:2,step:.05,default:.5,rawDefault:`var(--sf-radius-m)`,variableOptions:of},{label:`Padding block`,token:`--sf-btn-padding-block`,unit:`rem`,min:0,max:1,step:.025,default:.375,rawDefault:`var(--sf-space-xs)`,variableOptions:af},{label:`Padding inline`,token:`--sf-btn-padding-inline`,unit:`rem`,min:0,max:2,step:.025,default:1,rawDefault:`var(--sf-space-m)`,variableOptions:af},{label:`Gap (icon+label)`,token:`--sf-btn-gap`,unit:`rem`,min:0,max:1,step:.0125,default:.25,rawDefault:`var(--sf-space-2xs)`,variableOptions:af},{label:`Border width`,token:`--sf-btn-border-width`,unit:`px`,min:0,max:4,step:.5,default:1,rawDefault:`var(--sf-border-width-1)`,variableOptions:sf},{label:`Min height`,token:`--sf-btn-min-height`,unit:`rem`,min:1,max:4,step:.125,default:2.75,rawDefault:`var(--sf-touch-target)`,variableOptions:lf}],f=[{label:`Padding`,token:`--sf-card-padding`,unit:`rem`,min:0,max:3,step:.05,default:1.5,rawDefault:`var(--sf-space-l)`,variableOptions:af},{label:`Gap (header/footer)`,token:`--sf-card-gap`,unit:`rem`,min:0,max:2,step:.05,default:1,rawDefault:`var(--sf-space-m)`,variableOptions:af},{label:`Radius (inner)`,token:`--sf-card-radius`,unit:`rem`,min:0,max:2,step:.05,default:.5,rawDefault:`var(--sf-radius-m)`,variableOptions:of},{label:`Border width`,token:`--sf-card-border-width`,unit:`px`,min:0,max:4,step:.5,default:1,rawDefault:`var(--sf-border-width-1)`,variableOptions:sf},{label:`Media radius`,token:`--sf-card-media-radius`,unit:`rem`,min:0,max:2,step:.05,default:.5,rawDefault:`var(--sf-card-radius, var(--sf-radius-m))`,variableOptions:of}],p=L(!1),m=L(!1),h=L(`primary`),g=L(`fill`),_=L(`m`),v=L(!1),y=L(!1),b=L(!1),x=L(!1),S=L(!1);function C(){let e=[`sf-btn`];return U(h)!=="default"&&e.push(`sf-btn--${U(h)}`),U(g)!==`fill`&&e.push(`sf-btn--${U(g)}`),U(_)!==`m`&&e.push(`sf-btn--${U(_)}`),e.join(` `)}function w(){let e=[`sf-card`];return U(b)&&e.push(`sf-card--bordered`),U(x)&&e.push(`sf-card--elevated`),U(S)&&e.push(`sf-card--interactive`),e.join(` `)}function T(e){let n=t.overrides[e.token];if(!n||/^(var|calc|clamp)\(/.test(n.trim()))return e.default;let r=parseFloat(n);return isNaN(r)?e.default:r}function E(e,n,r,i){let a=t.overrides[e];if(!a)return i;let o=a.match(RegExp(`^var\\(--sf-${n}-([\\w-]+)\\)$`));return o&&r.includes(o[1])?o[1]:i}function D(e,n,r,i){r===i?t.onReset(e):t.onSet(e,`var(--sf-${n}-${r})`)}let O=I(()=>T(f[2])),k=I(()=>T(f[0]));var A=wm(),ee=z(A),j=z(ee),te=V(z(j),2),ne=z(te,!0);F(te),F(j);var M=V(j,2),re=e=>{var r=Sm(),i=B(r),l=V(z(i),2);Y(l,20,()=>o,e=>e,(e,t)=>{var n=xm(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer capitalize ${U(h)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(r,t)}),W(`click`,n,()=>{R(h,t,!0)}),K(e,n)}),F(l);var u=V(l,4);Y(u,21,()=>s,e=>e.id,(e,t)=>{var n=xm(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(g)===U(t).id?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(r,U(t).label)}),W(`click`,n,()=>{R(g,U(t).id,!0)}),K(e,n)}),F(u);var f=V(u,4);Y(f,20,()=>c,e=>e,(e,t)=>{var n=xm(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-2.5 py-1 rounded-lg text-[10px] border transition-all cursor-pointer uppercase ${U(_)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(r,t)}),W(`click`,n,()=>{R(_,t,!0)}),K(e,n)}),F(f);var p=V(f,2),m=z(p),b=z(m);zi(b),Me(),F(m);var x=V(m,2),S=z(x);zi(S),Me(),F(x),F(p),F(i);var w=V(i,2),O=z(w);let k;var A=z(O,!0);F(O),F(w);var ee=V(w,2),j=z(ee);Y(j,17,()=>d,e=>e.token,(e,n)=>{{let r=I(()=>T(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},get min(){return U(n).min},get max(){return U(n).max},get step(){return U(n).step},get unit(){return U(n).unit},get help(){return U(n).token},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}${U(n).unit}`),onReset:()=>t.onReset(U(n).token),get rawDefault(){return U(n).rawDefault},get variableOptions(){return U(n).variableOptions},get currentRaw(){return t.overrides[U(n).token]},onRawSet:e=>t.onSet(U(n).token,e)})}});var te=V(j,2),ne=V(z(te),2);Y(ne,20,()=>n,e=>e,(e,t)=>{let r=I(()=>E(`--sf-btn-font-size`,`text`,n,`m`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-btn-font-size`,`text`,t,`m`)),K(e,i)}),F(ne),F(te);var M=V(te,2),re=V(z(M),2);Y(re,20,()=>a,e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-btn-font-weight`]??`600`);var i=xm(),a=z(i,!0);F(i),H(e=>{Z(i,e),X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,n)},[()=>`font-weight:${parseInt(n)}`]),W(`click`,i,()=>n===`600`?t.onReset(`--sf-btn-font-weight`):t.onSet(`--sf-btn-font-weight`,n)),K(e,i)}),F(re),F(M),F(ee),H(e=>{k=X(O,1,e,null,k,{"sf-is-loading":U(y)}),O.disabled=U(v),q(A,U(y)?`Loading`:`Button label`)},[()=>yi(C())]),Ji(b,()=>U(v),e=>R(v,e)),Ji(S,()=>U(y),e=>R(y,e)),K(e,r)};J(M,e=>{U(p)&&e(re)}),F(ee);var ie=V(ee,4),ae=z(ie),oe=V(z(ae),2),se=z(oe,!0);F(oe),F(ae);var N=V(ae,2),ce=e=>{var a=Cm(),o=B(a),s=z(o),c=z(s);zi(c),Me(),F(s);var d=V(s,2),p=z(d);zi(p),Me(),F(d);var m=V(d,2),h=z(m);zi(h),Me(),F(m),F(o);var g=V(o,2),_=z(g);F(g);var v=V(g,2),y=z(v);Y(y,17,()=>f,e=>e.token,(e,n)=>{{let r=I(()=>T(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},get min(){return U(n).min},get max(){return U(n).max},get step(){return U(n).step},get unit(){return U(n).unit},get help(){return U(n).token},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}${U(n).unit}`),onReset:()=>t.onReset(U(n).token),get rawDefault(){return U(n).rawDefault},get variableOptions(){return U(n).variableOptions},get currentRaw(){return t.overrides[U(n).token]},onRawSet:e=>t.onSet(U(n).token,e)})}});var C=V(y,2),A=V(z(C),2),ee=z(A);F(A),F(C);var j=V(C,4),te=V(z(j),2);Y(te,21,()=>l,e=>e.step,(e,t)=>{let n=I(()=>E(`--sf-card-bg`,`color`,l.map(e=>e.step),`surface`));var r=xm(),i=z(r,!0);F(r),H(()=>{X(r,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===U(t).step?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(i,U(t).label)}),W(`click`,r,()=>D(`--sf-card-bg`,`color`,U(t).step,`surface`)),K(e,r)}),F(te),F(j);var ne=V(j,2),M=V(z(ne),2);Y(M,21,()=>u,e=>e.step,(e,t)=>{let n=I(()=>E(`--sf-card-border-color`,`color`,u.map(e=>e.step),`border`));var r=xm(),i=z(r,!0);F(r),H(()=>{X(r,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===U(t).step?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(i,U(t).label)}),W(`click`,r,()=>D(`--sf-card-border-color`,`color`,U(t).step,`border`)),K(e,r)}),F(M),F(ne);var re=V(ne,2),ie=V(z(re),2);Y(ie,20,()=>r,e=>e,(e,t)=>{let n=I(()=>E(`--sf-card-shadow`,`shadow`,r,`s`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-shadow`,`shadow`,t,`s`)),K(e,i)}),F(ie),F(re);var ae=V(re,2),oe=V(z(ae),2);Y(oe,20,()=>r,e=>e,(e,t)=>{let n=I(()=>E(`--sf-card-shadow--elevated`,`shadow`,r,`l`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-shadow--elevated`,`shadow`,t,`l`)),K(e,i)}),F(oe),F(ae);var se=V(ae,2),N=V(z(se),2);Y(N,20,()=>r,e=>e,(e,t)=>{let n=I(()=>E(`--sf-card-shadow--hover`,`shadow`,r,`l`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-shadow--hover`,`shadow`,t,`l`)),K(e,i)}),F(N),F(se);var ce=V(se,2),le=V(z(ce),2);Y(le,20,()=>i,e=>e,(e,t)=>{let n=I(()=>E(`--sf-card-media-ratio`,`ratio`,i,`video`));var r=xm(),a=z(r,!0);F(r),H(()=>{X(r,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,r,()=>D(`--sf-card-media-ratio`,`ratio`,t,`video`)),K(e,r)}),F(le),F(ce);var ue=V(ce,2),de=V(z(ue),2);Y(de,20,()=>n,e=>e,(e,t)=>{let r=I(()=>E(`--sf-card-heading-size`,`text`,n,`xl`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-heading-size`,`text`,t,`xl`)),K(e,i)}),F(de),F(ue);var fe=V(ue,2),pe=V(z(fe),2);Y(pe,20,()=>n,e=>e,(e,t)=>{let r=I(()=>E(`--sf-card-btn-font-size`,`text`,n,`s`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-btn-font-size`,`text`,t,`s`)),K(e,i)}),F(pe),F(fe);var me=V(fe,2),he=V(z(me),2);Y(he,20,()=>[`cover`,`contain`],e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-object-fit`]??`cover`);var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,n)}),W(`click`,i,()=>n===`cover`?t.onReset(`--sf-object-fit`):t.onSet(`--sf-object-fit`,n)),K(e,i)}),F(he),F(me),F(v),H((e,t)=>{X(_,1,e),q(ee,`${t??``}rem`)},[()=>yi(w()),()=>(U(O)+U(k)).toFixed(2)]),Ji(c,()=>U(b),e=>R(b,e)),Ji(p,()=>U(x),e=>R(x,e)),Ji(h,()=>U(S),e=>R(S,e)),K(e,a)};J(N,e=>{U(m)&&e(ce)}),F(ie),F(A),H(()=>{Q(j,`aria-expanded`,U(p)),q(ne,U(p)?`▲`:`▼`),Q(ae,`aria-expanded`,U(m)),q(se,U(m)?`▲`:`▼`)}),W(`click`,j,()=>{R(p,!U(p))}),W(`click`,ae,()=>{R(m,!U(m))}),K(e,A),We()}Br([`click`]);var Em=G(`

No saved themes yet.

Configure your tokens, then save them above.

`),Dm=G(`
`),Om=G(`
`),km=G(` `),Am=G(`
`),jm=G(`
`),Mm=G(``),Nm=G(`
Themes

Save your current configuration as a named theme, then re-apply it any time. - Themes are stored in this browser.

Save current

`);function Pm(e,t){Ue(t,!0);let n=L(nn(Pc())),r=L(``),i=I(()=>Object.keys(t.overrides).length);function a(e,t){let n=Object.keys(e);return n.length===Object.keys(t).length?n.every(n=>e[n]===t[n]):!1}let o=I(()=>U(n).find(e=>a(e.overrides,t.overrides))?.id??``);function s(){U(i)!==0&&(R(n,Fc(U(r),t.overrides),!0),R(r,``))}function c(e){R(n,Ic(e),!0)}var l=Nm(),u=V(z(l),4),d=V(z(u),2),f=z(d);zi(f);var p=V(f,2);oo(z(p),{class:`w-3 h-3`}),Me(),F(p),F(d);var m=V(d,2),g=z(m),_=e=>{K(e,Yr(`No active overrides yet — adjust some tokens first.`))},v=e=>{var t=Yr();H(()=>q(t,`Captures all ${U(i)??``} active override${U(i)===1?``:`s`}.`)),K(e,t)};J(g,e=>{U(i)===0?e(_):e(v,-1)}),F(m),F(u);var y=V(u,2),b=z(y),x=e=>{K(e,Em())},S=e=>{var r=Xr();Y(B(r),17,()=>U(n),e=>e.id,(e,n)=>{let r=I(()=>Object.keys(U(n).overrides).length);var i=jm(),a=z(i),s=z(a),l=z(s,!0);F(s);var u=V(s,2),d=z(u),f=z(d),p=V(f),m=e=>{va(e,{class:`w-3 h-3 text-indigo-600 dark:text-indigo-400`})};J(p,e=>{U(o)===U(n).id&&e(m)}),F(d);var g=V(d,2),_=z(g);F(g),F(u);var v=V(u,2),y=z(v),b=V(y,2);Do(z(b),{class:`w-3.5 h-3.5`}),F(b),F(v),F(a);var x=V(a,2),S=e=>{var t=Am(),i=z(t);Y(i,17,()=>Object.entries(U(n).overrides).slice(0,5),([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=Om(),o=z(a),s=e=>{var t=Dm();let n;H(()=>n=Z(t,``,n,{background:i()})),K(e,t)},c=I(()=>r().includes(`color`)||r().includes(`source`));J(o,e=>{U(c)&&e(s)});var l=V(o,2),u=z(l,!0);F(l),F(a),H(e=>q(u,e),[()=>r().replace(`--sf-`,``)]),K(e,a)});var a=V(i,2),o=e=>{var t=km(),n=z(t);F(t),H(()=>q(n,`+${U(r)-5} more`)),K(e,t)};J(a,e=>{U(r)>5&&e(o)}),F(t),K(e,t)};J(x,e=>{U(r)>0&&e(S)}),F(i),H(()=>{X(i,1,`group rounded-xl border transition-all overflow-hidden ${U(o)===U(n).id?`border-indigo-500/40 bg-indigo-500/10`:`border-black/8 dark:border-white/8 bg-black/4 dark:bg-white/4 hover:bg-black/6 dark:hover:bg-white/6 hover:border-black/14 dark:hover:border-white/14`}`),q(l,U(n).icon),q(f,`${U(n).name??``} `),q(_,`${U(r)??``} override${U(r)===1?``:`s`}`)}),W(`click`,y,()=>t.onApplyTheme(U(n).overrides)),W(`click`,b,()=>c(U(n).id)),K(e,i)}),K(e,r)};J(b,e=>{U(n).length===0?e(x):e(S,-1)}),F(y);var C=V(y,2),w=e=>{var n=Mm();W(`click`,n,function(...e){t.onResetAll?.apply(this,e)}),K(e,n)};J(C,e=>{U(i)>0&&e(w)}),F(l),H(()=>p.disabled=U(i)===0),W(`keydown`,f,e=>{e.key===`Enter`&&s()}),qi(f,()=>U(r),e=>R(r,e)),W(`click`,p,s),K(e,l),We()}Br([`keydown`,`click`]);var Fm=G(` Link copied!`,1),Im=G(` Copy shareable link`,1),Lm=G(`
Export

CSS output
Usage
Paste this CSS into your project after the SLASHED import.
`);function Rm(e,t){Ue(t,!0);let n=L(`layer`),r=L(!1),i=L(!1),a=I(()=>Cc(t.overrides,{mode:U(n),banner:!0})),o=I(()=>Object.keys(t.overrides).length);async function s(){try{await navigator.clipboard.writeText(U(a)),R(r,!0),setTimeout(()=>{R(r,!1)},2e3)}catch{}}async function c(){try{let e=Dc(t.overrides);await navigator.clipboard.writeText(e),R(i,!0),setTimeout(()=>{R(i,!1)},2e3)}catch{}}function l(){let e=new Blob([U(a)],{type:`text/css`}),t=URL.createObjectURL(e),n=document.createElement(`a`);n.href=t,n.download=`slashed-overrides.css`,n.click(),URL.revokeObjectURL(t)}function u(e){return e.includes(`color`)||e.includes(`scrim-color`)||e.includes(`shadow-color`)?`color`:e.includes(`duration`)||e.includes(`delay`)||e.includes(`transition-duration`)?`duration`:e.includes(`radius`)||e.includes(`space`)||e.includes(`size`)||e.includes(`width`)||e.includes(`height`)||e.includes(`gap`)||e.includes(`blur`)||e.includes(`text-`)||e.includes(`leading`)||e.includes(`tracking`)?`dimension`:e.includes(`font-family`)||e.includes(`font-mono`)||e.includes(`font-body`)||e.includes(`font-heading`)||e.includes(`font-code`)?`fontFamily`:e.includes(`font-weight`)||e.includes(`weight`)?`fontWeight`:`string`}function d(){let e={};for(let[n,r]of Object.entries(t.overrides)){let t=n.replace(/^--sf-/,``).replace(/-/g,`.`);e[t]={$value:r,$type:u(n)}}let n=JSON.stringify({$schema:`https://design-tokens.github.io/community-group/format/`,...e},null,2),r=new Blob([n],{type:`application/json`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=`slashed-tokens.w3c.json`,a.click(),URL.revokeObjectURL(i)}var f=Lm(),p=z(f),m=V(z(p),2),h=z(m,!0);F(m),F(p);var g=V(p,2),_=z(g),v=e=>{var t=Fm();va(B(t),{class:`w-3 h-3 text-emerald-600 dark:text-emerald-400`}),Me(2),K(e,t)},y=e=>{var t=Im();Ra(B(t),{class:`w-3 h-3`}),Me(),K(e,t)};J(_,e=>{U(i)?e(v):e(y,-1)}),F(g);var b=V(g,2),x=V(z(b),2),S=z(x),C=V(S,2);F(x),F(b);var w=V(b,2),T=z(w),E=z(T,!0);F(T);var D=V(T,2),O=z(D),k=z(O),A=e=>{va(e,{class:`w-3 h-3 text-emerald-600 dark:text-emerald-400`})},ee=e=>{Ea(e,{class:`w-3 h-3`})};J(k,e=>{U(r)?e(A):e(ee,-1)}),F(O);var j=V(O,2);Oa(z(j),{class:`w-3 h-3`}),F(j),F(D),F(w);var te=V(w,2);Oa(z(te),{class:`w-3 h-3`}),Me(),F(te);var ne=V(te,2),M=V(z(ne),4);M.textContent=`@import 'slashed/slashed.full.css';
-@import './slashed-overrides.css';`,F(ne),F(f),H(()=>{q(h,U(o)>0?`${U(o)} override${U(o)===1?``:`s`} ready to export.`:`No overrides yet. Customise tokens, then export.`),g.disabled=U(o)===0,X(S,1,`flex-1 py-1.5 rounded-md text-[11px] font-bold transition-all cursor-pointer ${U(n)===`layer`?`bg-indigo-600 text-white`:`text-slate-600 dark:text-slate-400 hover:text-slate-800 dark:hover:text-slate-200`}`),X(C,1,`flex-1 py-1.5 rounded-md text-[11px] font-bold transition-all cursor-pointer ${U(n)===`root`?`bg-indigo-600 text-white`:`text-slate-600 dark:text-slate-400 hover:text-slate-800 dark:hover:text-slate-200`}`),q(E,U(a)||`/* No overrides */`),te.disabled=U(o)===0}),W(`click`,g,c),W(`click`,S,()=>{R(n,`layer`)}),W(`click`,C,()=>{R(n,`root`)}),W(`click`,O,s),W(`click`,j,l),W(`click`,te,d),K(e,f),We()}Br([`click`]);var zm={_sync:{generatedBy:`configurator/scripts/sync-api.mjs`,source:`docs/api-index.json`},classes:[{name:`no-motion`,selector:`.no-motion`,kind:`accessibility`,category:`Accessibility`,group:`Reduced motion. Token override helps components that read`,description:`Suppresses all animations and transitions within the subtree. Apply to a container to create a reduced-motion zone without relying on the system preference.`,optional:!1,layer:`slashed.accessibility`},{name:`no-print`,selector:`.no-print`,kind:`print`,category:`Print`,group:`Print visibility utilities`,description:`Hides the element in @media print. Use on sidebars, navigation bars, and decorative elements that should not appear on paper.`,optional:!1,layer:`slashed.print`},{name:`print-color-exact`,selector:`.print-color-exact`,kind:`print`,category:`Print`,group:`Opt-in colour treatment`,description:`Forces exact color rendering in print (print-color-adjust: exact). Use on charts and colored badges that must preserve their fill colors in print.`,optional:!1,layer:`slashed.print`},{name:`print-no-color`,selector:`.print-no-color`,kind:`print`,category:`Print`,group:`Opt-in colour treatment`,description:`Strips color information in print (print-color-adjust: economy). Defers to the printer's ink-saving mode for backgrounds and non-critical color fills.`,optional:!1,layer:`slashed.print`},{name:`print-only`,selector:`.print-only`,kind:`print`,category:`Print`,group:`Print visibility utilities`,description:`Hides the element on screen (display: none) but shows it in @media print. Use for print-only headers, footers, and supplementary content not needed on screen.`,optional:!1,layer:`slashed.print`},{name:`sf-alternate`,selector:`.sf-alternate`,kind:`layout`,category:`Layout primitives`,group:`Alternate (zigzag / media-object)`,description:`Zigzag / alternating two-column layout. Even children align image-left/text-right; odd children flip. Collapses to a single column below the breakpoint.`,optional:!1,layer:`slashed.layout`},{name:`sf-aspect`,selector:`.sf-aspect`,kind:`macro`,category:`Macro classes`,group:`Aspect`,description:`Sets aspect-ratio from a --sf-aspect-ratio scoped token. Override the token inline to get any ratio without a new class.`,optional:!1,layer:`slashed.macros`},{name:`sf-bento`,selector:`.sf-bento`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Auto-fill bento grid for card dashboards. Children span 1 column by default; use span modifiers (sf-bento-wide, sf-bento-tall, sf-bento-full, sf-bento-featured) to break the grid.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--2`,selector:`.sf-bento--2`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with a 2-column base layout.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--3`,selector:`.sf-bento--3`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with a 3-column base layout.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--6`,selector:`.sf-bento--6`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with a 6-column base layout.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--compact`,selector:`.sf-bento--compact`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with shorter default row height.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--tall`,selector:`.sf-bento--tall`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with taller default row height.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento-featured`,selector:`.sf-bento-featured`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Span modifier for a bento item: takes up 2×2 cells (featured hero placement).`,optional:!1,layer:`slashed.layout`},{name:`sf-bento-full`,selector:`.sf-bento-full`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Span modifier for a bento item: stretches across all columns (full-width banner).`,optional:!1,layer:`slashed.layout`},{name:`sf-bento-tall`,selector:`.sf-bento-tall`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Span modifier for a bento item: doubles the row height (tall card).`,optional:!1,layer:`slashed.layout`},{name:`sf-bento-wide`,selector:`.sf-bento-wide`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Span modifier for a bento item: spans 2 columns (wide card).`,optional:!1,layer:`slashed.layout`},{name:`sf-bg-layer`,selector:`.sf-bg-layer`,kind:`layout`,category:`Layout primitives`,group:``,description:`Background layer — absolutely-positioned cover media that sits behind a parent's content. The parent is auto-promoted to a positioned, isolated stacking context via :has(), so .sf-bg-layer composes natively under .sf-scrim (background → scrim gradient → content). Works as a bare  or as a wrapper with a nested > img / > video / > picture.`,optional:!1,layer:`slashed.layout`},{name:`sf-box`,selector:`.sf-box`,kind:`layout`,category:`Layout primitives`,group:`Box`,description:`Minimal padding container that applies --sf-component-pad on all sides. The simplest layout primitive for adding breathing room.`,optional:!1,layer:`slashed.layout`},{name:`sf-breakout`,selector:`.sf-breakout`,kind:`layout`,category:`Layout primitives`,group:`Content grid (breakout pattern)`,description:`Breaks a child element out of a parent sf-content-grid, spanning full bleed (or a named grid area) regardless of the parent column. Useful for full-width sections inside constrained prose.`,optional:!1,layer:`slashed.layout`},{name:`sf-btn`,selector:`.sf-btn`,kind:`component`,category:`Components`,group:`.sf-btn`,description:`Interactive call-to-action button. Apply to 
`),qm=G(` 
`,1),Jm=G(`
 
 `,1),Ym=G(`knob`),Xm=G(`advanced`),Zm=G(`
 
`),Qm=G(`
   
  
 
`),$m=G(`
Classes & Variables
  
 
 
`);function eh(e,t){Ue(t,!0);let n=zm.classes,r=Bm.tokens.filter(e=>e.tier===`PUBLIC`||e.tier===`PUBLIC-ADVANCED`),i=L(``),a=L(`classes`),o=L(``),s=I(()=>()=>{let e=U(i).trim().toLowerCase();return e?n.filter(t=>t.name.toLowerCase().includes(e)||t.selector?.toLowerCase().includes(e)||t.description?.toLowerCase().includes(e)||t.group?.toLowerCase().includes(e)):n}),c=I(()=>()=>{let e=U(i).trim().toLowerCase();return e?r.filter(t=>t.name.toLowerCase().includes(e)||t.description?.toLowerCase().includes(e)||t.group?.toLowerCase().includes(e)||t.value?.toLowerCase().includes(e)):r});function l(e){let t=new Map;for(let n of e){let e=n.category||`Other`,r=n.group||``;t.has(e)||t.set(e,new Map);let i=t.get(e);i.has(r)||i.set(r,[]),i.get(r).push(n)}return t}let u=I(()=>l(U(s)())),d=I(()=>l(U(c)())),f=null;async function p(e){try{await navigator.clipboard.writeText(e),R(o,e,!0),f&&clearTimeout(f),f=setTimeout(()=>{U(o)===e&&R(o,``),f=null},1500)}catch{}}let m={layout:`text-violet-600 dark:text-violet-400`,macro:`text-sky-600 dark:text-sky-400`,state:`text-amber-600 dark:text-amber-400`,accessibility:`text-emerald-600 dark:text-emerald-400`,motion:`text-pink-600 dark:text-pink-400`,print:`text-slate-600 dark:text-slate-400`,form:`text-orange-600 dark:text-orange-400`,component:`text-indigo-600 dark:text-indigo-400`,theme:`text-teal-600 dark:text-teal-400`};var g=$m(),_=z(g),v=V(z(_),2);zi(v);var y=V(v,2),b=z(y),x=z(b);F(b);var S=V(b,2),C=z(S);F(S),F(y),F(_);var w=V(_,2),T=z(w),E=e=>{var t=Xr(),n=B(t),r=e=>{var t=Vm(),n=z(t);F(t),H(()=>q(n,`No classes match "${U(i)??``}"`)),K(e,t)},a=I(()=>U(s)().length===0),c=e=>{var t=Xr();Y(B(t),17,()=>[...U(u).entries()],([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=Jm(),s=B(a),c=z(s),l=z(c,!0);F(c),F(s),Y(V(s,2),17,()=>[...i().entries()],([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=qm(),s=B(a),c=e=>{var t=Hm(),n=z(t,!0);F(t),H(()=>q(n,r())),K(e,t)};J(s,e=>{r()&&e(c)});var l=V(s,2);Y(l,21,i,e=>e.name,(e,t)=>{var n=Km(),r=z(n),i=z(r),a=z(i),s=z(a,!0);F(a);var c=V(a,2),l=e=>{var n=Um(),r=z(n,!0);F(n),H(()=>{X(n,1,`text-[8px] font-bold uppercase ${m[U(t).kind]??`text-slate-500`}`),q(r,U(t).kind)}),K(e,n)};J(c,e=>{U(t).kind&&e(l)});var u=V(c,2),d=e=>{K(e,Wm())};J(u,e=>{U(t).optional&&e(d)}),F(i);var f=V(i,2),h=e=>{var n=Gm(),r=z(n,!0);F(n),H(()=>q(r,U(t).description)),K(e,n)};J(f,e=>{U(t).description&&e(h)}),F(r);var g=V(r,2),_=z(g),v=e=>{va(e,{class:`w-3 h-3 text-emerald-600 dark:text-emerald-400`})},y=e=>{Ea(e,{class:`w-3 h-3 text-slate-500`})};J(_,e=>{U(o)===U(t).selector?e(v):e(y,-1)}),F(g),F(n),H(()=>q(s,U(t).selector)),W(`click`,g,()=>p(U(t).selector)),K(e,n)}),F(l),K(e,a)}),H(()=>q(l,r())),K(e,a)}),K(e,t)};J(n,e=>{U(a)?e(r):e(c,-1)}),K(e,t)},D=e=>{var t=Xr(),n=B(t),r=e=>{var t=Vm(),n=z(t);F(t),H(()=>q(n,`No tokens match "${U(i)??``}"`)),K(e,t)},a=I(()=>U(c)().length===0),s=e=>{var t=Xr();Y(B(t),17,()=>[...U(d).entries()],([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=Jm(),s=B(a),c=z(s),l=z(c,!0);F(c),F(s),Y(V(s,2),17,()=>[...i().entries()],([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=qm(),s=B(a),c=e=>{var t=Hm(),n=z(t,!0);F(t),H(()=>q(n,r())),K(e,t)};J(s,e=>{r()&&e(c)});var l=V(s,2);Y(l,21,i,e=>e.name,(e,t)=>{var n=Qm(),r=z(n),i=z(r),a=z(i),s=z(a,!0);F(a);var c=V(a,2),l=e=>{K(e,Ym())};J(c,e=>{U(t).role===`knob`&&e(l)});var u=V(c,2),d=e=>{K(e,Xm())};J(u,e=>{U(t).tier===`PUBLIC-ADVANCED`&&e(d)}),F(i);var f=V(i,2),m=e=>{var n=Zm(),r=z(n,!0);F(n),H(()=>q(r,U(t).value)),K(e,n)};J(f,e=>{U(t).value&&e(m)});var h=V(f,2),g=e=>{var n=Gm(),r=z(n,!0);F(n),H(()=>q(r,U(t).description)),K(e,n)};J(h,e=>{U(t).description&&e(g)}),F(r);var _=V(r,2),v=z(_),y=e=>{va(e,{class:`w-3 h-3 text-emerald-600 dark:text-emerald-400`})},b=e=>{Ea(e,{class:`w-3 h-3 text-slate-500`})};J(v,e=>{U(o)===`var(${U(t).name})`?e(y):e(b,-1)}),F(_),F(n),H(()=>q(s,U(t).name)),W(`click`,_,()=>p(`var(${U(t).name})`)),K(e,n)}),F(l),K(e,a)}),H(()=>q(l,r())),K(e,a)}),K(e,t)};J(n,e=>{U(a)?e(r):e(s,-1)}),K(e,t)};J(T,e=>{U(a)===`classes`?e(E):e(D,-1)}),F(w),F(g),H((e,t)=>{X(b,1,`flex-1 py-1.5 rounded text-[10px] font-bold transition-all cursor-pointer ${U(a)===`classes`?`bg-indigo-600/30 text-indigo-800 dark:text-indigo-200 border border-indigo-500/30`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(x,`CSS classes (${e??``})`),X(S,1,`flex-1 py-1.5 rounded text-[10px] font-bold transition-all cursor-pointer ${U(a)===`tokens`?`bg-indigo-600/30 text-indigo-800 dark:text-indigo-200 border border-indigo-500/30`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(C,`CSS vars (${t??``})`)},[()=>U(s)().length,()=>U(c)().length]),qi(v,()=>U(i),e=>R(i,e)),W(`click`,b,()=>{R(a,`classes`)}),W(`click`,S,()=>{R(a,`tokens`)}),K(e,g),We()}Br([`click`]);var th=G(`
`),nh=G(`
`),rh=G(`
 
`),ih=G(``),ah=G(` `),oh=G(``),sh=G(``),ch=G(`
  
 
 
  
`);function lh(e,t){Ue(t,!0);let n=L(!1);function r(e){let t=e.name;if(t.includes(`color`)||t.includes(`source`)||t.includes(`-bg`)||t.includes(`-border`))return`color`;if(t.includes(`font`)||t.includes(`family`))return`font`;let n=e.syntax?.toLowerCase()??``;return n.includes(`number`)||n.includes(`length`)||n.includes(`integer`)?`number`:`text`}let i=I(()=>t.overrideValue??t.token.value),a=I(()=>t.overrideValue!==void 0),o=I(()=>r(t.token)),s=I(()=>t.token.name.replace(`--sf-`,``));function c(e){return dl.value,_l(e)||_l(`var(${t.token.name})`)||e}let l=I(()=>U(o)===`color`?c(U(i)):``);var u=ch(),d=z(u),f=V(d,2),p=e=>{var t=th();let n;H(()=>n=Z(t,``,n,{background:U(l)})),K(e,t)},m=e=>{K(e,nh())};J(f,e=>{U(o)===`color`?e(p):e(m,-1)});var h=V(f,2),g=z(h),_=z(g,!0);F(g);var v=V(g,2),y=e=>{var n=rh(),r=z(n,!0);F(n),H(()=>q(r,t.token.description)),K(e,n)};J(v,e=>{t.token.description&&e(y)}),F(h);var b=V(h,2),x=e=>{var r=ih();zi(r),H(()=>Bi(r,U(i))),zr(`blur`,r,e=>{let r=e.target.value.trim();r&&r!==t.token.value?t.onSet(r):(!r||r===t.token.value)&&t.onReset(),R(n,!1)}),W(`keydown`,r,e=>{e.key===`Enter`&&e.currentTarget.blur(),e.key===`Escape`&&R(n,!1)}),K(e,r)},S=e=>{var t=oh(),r=z(t),o=e=>{var t=ah(),n=z(t,!0);F(t),H(()=>q(n,U(i))),K(e,t)},s=e=>{var t=Yr();H(()=>q(t,U(i))),K(e,t)};J(r,e=>{U(a)?e(o):e(s,-1)}),F(t),H(()=>Q(t,`title`,U(i))),W(`click`,t,()=>{R(n,!0)}),K(e,t)};J(b,e=>{U(n)?e(x):e(S,-1)});var C=V(b,2),w=e=>{var n=sh();W(`click`,n,function(...e){t.onReset?.apply(this,e)}),K(e,n)};J(C,e=>{U(a)&&e(w)}),F(u),H(()=>{X(u,1,`flex items-center gap-2 px-3 py-1.5 rounded-lg transition-colors group ${U(a)?`bg-indigo-500/8 border border-indigo-500/15`:`hover:bg-black/4 dark:hover:bg-white/4`}`),X(d,1,`w-1.5 h-1.5 rounded-full shrink-0 ${U(a)?`bg-indigo-500`:`bg-transparent`}`),Q(g,`title`,t.token.name),q(_,U(s))}),K(e,u),We()}Br([`keydown`,`click`]);var uh=G(` `),dh=G(`
No tokens found
`),fh=G(`
 
`),ph=G(`
 
`),mh=G(`
 
 
  
`);function hh(e,t){Ue(t,!0);let n=L(``),r=I(()=>()=>{let e=t.patterns??[t.domain];return t.tokens.filter(t=>e.some(e=>t.name.includes(e))&&t.tier!==`INTERNAL`)}),i=I(()=>()=>{if(!U(n))return U(r)();let e=U(n).toLowerCase();return U(r)().filter(t=>t.name.toLowerCase().includes(e)||t.description?.toLowerCase().includes(e))}),a=I(()=>U(i)().filter(e=>e.name in t.overrides).length);var o=mh(),s=z(o),c=z(s),l=z(c);F(c);var u=V(c,2),d=e=>{var t=uh(),n=z(t);F(t),H(()=>q(n,`${U(a)??``} modified`)),K(e,t)};J(u,e=>{U(a)>0&&e(d)}),F(s);var f=V(s,2);zi(f);var p=V(f,2),m=e=>{K(e,dh())},h=I(()=>U(i)().length===0),g=e=>{var n=ph(),r=z(n);Y(r,17,()=>U(i)().slice(0,60),e=>e.name,(e,n)=>{lh(e,{get token(){return U(n)},get overrideValue(){return t.overrides[U(n).name]},onSet:e=>t.onSet(U(n).name,e),onReset:()=>t.onReset(U(n).name)})});var a=V(r,2),o=e=>{var t=fh(),n=z(t);F(t),H(e=>q(n,`${e??``} more — refine your search`),[()=>U(i)().length-60]),K(e,t)},s=I(()=>U(i)().length>60);J(a,e=>{U(s)&&e(o)}),F(n),K(e,n)};J(p,e=>{U(h)?e(m):e(g,-1)}),F(o),H(()=>{q(l,`${t.domain??``} tokens`),Q(f,`placeholder`,`Search ${t.domain} tokens…`),Bi(f,U(n))}),W(`input`,f,e=>{R(n,e.target.value,!0)}),K(e,o),We()}Br([`input`]);var gh=G(`
`),_h=G(`
  
`),vh=G(`
 
`),yh=G(`
`),bh=G(`
`),xh=G(`
  
`),Sh=G(`
`),Ch=G(`
 
   
 
  
 
  
 
 
 
`);function wh(e,t){Ue(t,!0);let n={PUBLIC:0,"PUBLIC-ADVANCED":1,INTERNAL:2},r=L(``),i=L(!1),a=L(!1),o=I(()=>t.tokens.filter(e=>t.patterns.some(t=>e.name.includes(t))).sort((e,t)=>{let r=n[e.tier??`INTERNAL`]??2,i=n[t.tier??`INTERNAL`]??2;return r===i?e.name.localeCompare(t.name):r-i})),s=I(()=>()=>{let e=U(o);if(U(i)||(e=e.filter(e=>e.tier!==`INTERNAL`)),U(a)&&(e=e.filter(e=>e.name in t.overrides)),U(r)){let t=U(r).toLowerCase();e=e.filter(e=>e.name.toLowerCase().includes(t)||e.description?.toLowerCase().includes(t))}return e}),c=I(()=>U(o).filter(e=>e.name in t.overrides).length),l=I(()=>U(o).filter(e=>e.tier===`PUBLIC`).length),u=I(()=>U(o).filter(e=>e.tier===`PUBLIC-ADVANCED`).length),d=I(()=>U(o).filter(e=>e.tier===`INTERNAL`).length);var f=Ch(),p=z(f),m=z(p);zi(m);var h=V(m,2),g=z(h),_=z(g),v=z(_),y=e=>{K(e,gh())};J(v,e=>{U(a)&&e(y)}),F(_);var b=V(_);F(g);var x=V(g,2),S=z(x),C=z(S),w=e=>{K(e,gh())};J(C,e=>{U(i)&&e(w)}),F(S);var T=V(S);F(x);var E=V(x,2),D=z(E);F(E),F(h);var O=V(h,2),k=z(O),A=V(z(k),2),ee=z(A);F(A),F(k);var j=V(k,2),te=V(z(j),2),ne=z(te);F(te),F(j);var M=V(j,2),re=e=>{var t=_h(),n=V(z(t),2),r=z(n);F(n),F(t),H(()=>q(r,`Internal (${U(d)??``})`)),K(e,t)};J(M,e=>{U(i)&&e(re)}),F(O),F(p);var ie=V(p,4),ae=z(ie),oe=e=>{var t=vh(),n=z(t,!0);F(t),H(()=>q(n,U(a)?`No modified tokens in this domain`:`No tokens found`)),K(e,t)},se=I(()=>U(s)().length===0),N=e=>{var n=Sh();Y(n,21,()=>U(s)(),e=>e.name,(e,n)=>{var r=xh(),i=z(r),a=e=>{K(e,yh())};J(i,e=>{U(n).tier===`PUBLIC-ADVANCED`&&e(a)});var o=V(i,2),s=e=>{K(e,bh())};J(o,e=>{U(n).tier===`INTERNAL`&&e(s)}),lh(V(o,2),{get token(){return U(n)},get overrideValue(){return t.overrides[U(n).name]},onSet:e=>t.onSet(U(n).name,e),onReset:()=>t.onReset(U(n).name)}),F(r),K(e,r)}),F(n),K(e,n)};J(ae,e=>{U(se)?e(oe):e(N,-1)}),F(ie),F(f),H(e=>{Bi(m,U(r)),X(g,1,`flex items-center gap-1 text-[9px] font-bold transition-colors cursor-pointer ${U(a)?`text-indigo-600 dark:text-indigo-400`:`text-slate-400 dark:text-slate-600 hover:text-slate-600 dark:hover:text-slate-400`}`),X(_,1,`w-2.5 h-2.5 rounded border flex items-center justify-center transition-colors ${U(a)?`bg-indigo-600 border-indigo-500`:`border-black/20 dark:border-white/20`}`),q(b,` Modified only ${U(c)>0?`(${U(c)})`:``}`),Q(x,`aria-expanded`,U(i)),X(x,1,`flex items-center gap-1 text-[9px] font-bold transition-colors cursor-pointer ${U(i)?`text-amber-600 dark:text-amber-400`:`text-slate-400 dark:text-slate-600 hover:text-slate-600 dark:hover:text-slate-400`}`),X(S,1,`w-2.5 h-2.5 rounded border flex items-center justify-center transition-colors ${U(i)?`bg-amber-600 border-amber-500`:`border-black/20 dark:border-white/20`}`),q(T,` Internal (${U(d)??``})`),q(D,`${e??``}/${U(o).length??``}`),q(ee,`Public (${U(l)??``})`),q(ne,`Advanced (${U(u)??``})`)},[()=>U(s)().length]),W(`input`,m,e=>{R(r,e.target.value,!0)}),W(`click`,g,()=>{R(a,!U(a))}),W(`click`,x,()=>{R(i,!U(i))}),K(e,f),We()}Br([`input`,`click`]);var Th=G(``),Eh=G(`
    
 
       
`),Dh=G(`
Waiting for live preview…
`),Oh=G(``),kh=G(`
Pick an editable brand/status (base) color as the foreground to enable auto-fix.
`),Ah=G(`
 
`),jh=G(`
 
 
 
 
 
`),Mh=G(`
 
`),Nh=G(`
Foreground
 
  
Background
 
 
Aa Bb Cc
 
 
Auto-fix to pass   
 
`,1),Ph=G(` `),Fh=G(``),Ih=G(`·`),Lh=G(` `),Rh=G(`
Foreground (rows) × background (cols). Click a cell to load it above.
 
`,1),zh=G(`
Contrast checker
 
Live WCAG ratios computed from the actual rendered preview colors — including derived steps and your overrides.
 
 
 
 
 
`);function Bh(e,t){Ue(t,!0);let n=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`),r=[{label:`Text`,expr:`var(--sf-color-text)`},{label:`Text secondary`,expr:`var(--sf-color-text--secondary)`},{label:`Text muted`,expr:`var(--sf-color-text--muted)`},{label:`White`,expr:`#ffffff`},{label:`Black`,expr:`#000000`}],i=[{label:`Surface`,expr:`var(--sf-color-surface)`},{label:`Bg`,expr:`var(--sf-color-bg)`},{label:`Border`,expr:`var(--sf-color-border)`}],a=[{key:`primary`,srcLight:`--sf-color-primary-source-light`,defLight:`oklch(0.47 0.27 264)`,srcDark:`--sf-color-primary-source-dark`,defDark:`oklch(0.715 0.243 264)`},{key:`secondary`,srcLight:`--sf-color-secondary-source-light`,defLight:`oklch(0.22 0.04 264)`,srcDark:`--sf-color-secondary-source-dark`,defDark:`oklch(0.84 0.036 264)`},{key:`tertiary`,srcLight:`--sf-color-tertiary-source-light`,defLight:`oklch(0.42 0.22 295)`,srcDark:`--sf-color-tertiary-source-dark`,defDark:`oklch(0.74 0.198 295)`},{key:`action`,srcLight:`--sf-color-action-source-light`,defLight:`oklch(0.50 0.22 235)`,srcDark:`--sf-color-action-source-dark`,defDark:`oklch(0.70 0.198 235)`},{key:`neutral`,srcLight:`--sf-color-neutral-source-light`,defLight:`oklch(0.52 0.025 260)`,srcDark:`--sf-color-neutral-source-dark`,defDark:`oklch(0.69 0.0225 260)`},{key:`success`,srcLight:`--sf-color-success-source-light`,defLight:`oklch(0.50 0.16 145)`,srcDark:`--sf-color-success-source-dark`,defDark:`oklch(0.70 0.144 145)`},{key:`warning`,srcLight:`--sf-color-warning-source-light`,defLight:`oklch(0.75 0.17 80)`,srcDark:`--sf-color-warning-source-dark`,defDark:`oklch(0.65 0.153 80)`},{key:`danger`,srcLight:`--sf-color-danger-source-light`,defLight:`oklch(0.48 0.22 12)`,srcDark:`--sf-color-danger-source-dark`,defDark:`oklch(0.71 0.198 12)`},{key:`info`,srcLight:`--sf-color-info-source-light`,defLight:`oklch(0.48 0.18 235)`,srcDark:`--sf-color-info-source-dark`,defDark:`oklch(0.71 0.162 235)`}],o=a.flatMap(e=>[{label:`${e.key} (base)`,expr:`var(--sf-color-${e.key})`,editKey:e.key},{label:`${e.key}-100`,expr:`var(--sf-color-${e.key}-100)`},{label:`${e.key}-600`,expr:`var(--sf-color-${e.key}-600)`},{label:`${e.key}-900`,expr:`var(--sf-color-${e.key}-900)`}]),s=[...r,...i,...o],c=Object.fromEntries(a.map(e=>[e.key,e])),l=[{label:`text`,expr:`var(--sf-color-text)`},{label:`white`,expr:`#ffffff`},{label:`black`,expr:`#000000`},{label:`primary`,expr:`var(--sf-color-primary)`,editKey:`primary`}],u=[{label:`surface`,expr:`var(--sf-color-surface)`},{label:`primary`,expr:`var(--sf-color-primary)`},{label:`neutral-100`,expr:`var(--sf-color-neutral-100)`},{label:`success`,expr:`var(--sf-color-success)`},{label:`warning`,expr:`var(--sf-color-warning)`},{label:`danger`,expr:`var(--sf-color-danger)`}],d=L(`White`),f=L(`primary (base)`),p=L(`AA`),m=I(()=>s.find(e=>e.label===U(d))??s[0]),h=I(()=>s.find(e=>e.label===U(f))??s[0]);function g(e,t){dl.value;let n=xl(e),r=xl(t);return!n||!r?null:Yl(Jl(...n),Jl(...r))}function _(e){return e>=7?{tag:`AAA`,cls:`bg-emerald-500/25 text-emerald-800 dark:text-emerald-200`}:e>=4.5?{tag:`AA`,cls:`bg-emerald-500/15 text-emerald-700 dark:text-emerald-300`}:e>=3?{tag:`AA-L`,cls:`bg-amber-500/20 text-amber-700 dark:text-amber-300`}:{tag:`Fail`,cls:`bg-rose-500/20 text-rose-700 dark:text-rose-300`}}let v=I(()=>g(U(m).expr,U(h).expr));function y(){let e=U(d);R(d,U(f),!0),R(f,e,!0)}function b(e,t){let n=s.find(t=>t.expr===e),r=s.find(e=>e.expr===t);n&&R(d,n.label,!0),r&&R(f,r.label,!0)}function x(e){return dl.value,_l(e)||e}let S=L(!1),C=L(!1),w=L(null);function T(){R(w,null);let e=U(m).editKey?c[U(m).editKey]:null;if(!e)return;let n=ml()===`dark`,r=n?e.srcDark:e.srcLight,i=n?e.defDark:e.defLight,{c:a,h:o,l:s,valid:l}=Xl(t.overrides[r]??i);if(!l)return;let u=xl(U(h).expr);if(!u)return;let d=Jl(...u),f=U(p)===`AAA`?7:4.5,g=null;for(let e=0;e<=1.0001;e+=.005){let[t,n,r]=ql(e,a,o);Yl(Jl(t,n,r),d)>=f&&(g===null||Math.abs(e-s){if(!U(S)){R(w,null);return}dl.value,U(d),U(f),U(p),U(m).editKey&&U(v)!==null&&U(v)<(U(p)===`AAA`?7:4.5)?T():R(w,null)});var D=zh(),O=V(z(D),2),k=z(O),A=V(z(k),2),ee=z(A,!0);F(A),F(k);var j=V(k,2),te=e=>{var t=Nh(),r=B(t),i=z(r),a=V(z(i),2);Y(a,21,()=>s,e=>e.label,(e,t)=>{var r=Th(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).label)&&(r.value=(r.__value=U(t).label)??``)}),K(e,r)}),F(a),F(i);var o=V(i,2),c=V(o,2),l=V(z(c),2);Y(l,21,()=>s,e=>e.label,(e,t)=>{var r=Th(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).label)&&(r.value=(r.__value=U(t).label)??``)}),K(e,r)}),F(l),F(c),F(r);var u=V(r,2),g=z(u),b=z(g);F(g);var S=V(g,2),C=e=>{let t=I(()=>_(U(v)));var n=Eh(),r=z(n),i=z(r);F(r);var a=V(r,2),o=z(a,!0);F(a);var s=V(a,4),c=z(s),l=z(c);F(c);var u=V(c,2),d=z(u);F(u);var f=V(u,2),p=z(f);F(f);var m=V(f,2),h=z(m);F(m),F(s),F(n),H(e=>{q(i,`${e??``}:1`),X(a,1,`text-[10px] font-bold px-2 py-0.5 rounded ${U(t).cls}`),q(o,U(t).tag),X(c,1,yi(U(v)>=4.5?`text-emerald-700 dark:text-emerald-300`:`text-rose-700 dark:text-rose-300`)),q(l,`${U(v)>=4.5?`✓`:`✗`} AA normal`),X(u,1,yi(U(v)>=3?`text-emerald-700 dark:text-emerald-300`:`text-rose-700 dark:text-rose-300`)),q(d,`${U(v)>=3?`✓`:`✗`} AA large`),X(f,1,yi(U(v)>=7?`text-emerald-700 dark:text-emerald-300`:`text-rose-700 dark:text-rose-300`)),q(p,`${U(v)>=7?`✓`:`✗`} AAA normal`),X(m,1,yi(U(v)>=4.5?`text-emerald-700 dark:text-emerald-300`:`text-rose-700 dark:text-rose-300`)),q(h,`${U(v)>=4.5?`✓`:`✗`} AAA large`)},[()=>U(v).toFixed(2)]),K(e,n)},T=e=>{K(e,Dh())};J(S,e=>{U(v)===null?e(T,-1):e(C)}),F(u);var D=V(u,2),O=z(D),k=z(O),A=V(z(k)),ee=z(A);F(A),F(k);var j=V(k,2);Y(j,20,()=>[`AA`,`AAA`],e=>e,(e,t)=>{var n=Oh(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-2 py-0.5 rounded-md text-[10px] font-bold cursor-pointer ${U(p)===t?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(r,t)}),W(`click`,n,()=>{R(p,t,!0)}),K(e,n)}),F(j),F(O);var te=V(O,2),ne=e=>{K(e,kh())},M=e=>{var t=Ah(),n=z(t);F(t),H(()=>q(n,`Already passes ${U(p)??``}. 🎉`)),K(e,t)},re=e=>{var t=jh(),n=z(t),r=V(n,2),i=z(r),a=z(i,!0);F(i);var o=V(i,2),s=z(o);F(o),F(r);var c=V(r,2);F(t),H((e,t)=>{Z(n,e),q(a,U(w).value),q(s,`→ ${t??``}:1 (${U(p)??``} ✓)`)},[()=>`background:${x(U(w).value)}`,()=>U(w).ratio.toFixed(2)]),W(`click`,c,E),K(e,t)},ie=e=>{var t=Mh(),n=z(t);F(t),H(()=>q(n,`No lightness of this hue reaches ${U(p)??``} on this background — try a different background or hue.`)),K(e,t)};J(te,e=>{U(m).editKey?U(v)!==null&&U(v)>=(U(p)===`AAA`?7:4.5)?e(M,1):U(w)?e(re,2):e(ie,-1):e(ne)}),F(D),H((e,t,n)=>{Z(g,e),Z(b,t),q(ee,`(for ${n??``} mode)`)},[()=>`background:${x(U(h).expr)}`,()=>`color:${x(U(m).expr)}`,()=>ml()]),Oi(a,()=>U(d),e=>R(d,e)),W(`click`,o,y),Oi(l,()=>U(f),e=>R(f,e)),K(e,t)};J(j,e=>{U(S)&&e(te)}),F(O);var ne=V(O,4),M=z(ne),re=V(z(M),2),ie=z(re,!0);F(re),F(M);var ae=V(M,2),oe=e=>{var t=Rh(),n=V(B(t),2),r=z(n),i=z(r),a=z(i);Y(V(z(a)),17,()=>u,e=>e.label,(e,t)=>{var n=Ph(),r=z(n,!0);F(n),H(()=>q(r,U(t).label)),K(e,n)}),F(a),F(i);var o=V(i);Y(o,21,()=>l,e=>e.label,(e,t)=>{var n=Lh(),r=z(n),i=z(r,!0);F(r),Y(V(r),17,()=>u,e=>e.label,(e,n)=>{let r=I(()=>g(U(t).expr,U(n).expr));var i=Xr(),a=B(i),o=e=>{let i=I(()=>_(U(r)));var a=Fh(),o=z(a),s=z(o,!0);F(o),F(a),H((e,t)=>{Q(o,`title`,e),X(o,1,`w-full px-1.5 py-1 rounded font-mono font-bold cursor-pointer ${U(i).cls}`),q(s,t)},[()=>`${U(t).label} on ${U(n).label} — ${U(r).toFixed(2)}:1`,()=>U(r).toFixed(1)]),W(`click`,o,()=>b(U(t).expr,U(n).expr)),K(e,a)},s=e=>{K(e,Ih())};J(a,e=>{U(r)===null?e(s,-1):e(o)}),K(e,i)}),F(n),H(()=>q(i,U(t).label)),K(e,n)}),F(o),F(r),F(n),K(e,t)};J(ae,e=>{U(C)&&e(oe)}),F(ne),F(D),H(()=>{Q(k,`aria-expanded`,U(S)),q(ee,U(S)?`▲`:`▼`),Q(M,`aria-expanded`,U(C)),q(ie,U(C)?`▲`:`▼`)}),W(`click`,k,()=>{R(S,!U(S))}),W(`click`,M,()=>{R(C,!U(C))}),K(e,D),We()}Br([`click`]);var Vh=G(`
`),Hh=G(` `),Uh=G(`
 
 
 
`);function Wh(e,t){Ue(t,!0);let n=new Set([`home`,`themes`,`wcag`,`setup`,`cheatsheet`]),r=L(`controls`);On(()=>{t.domain,R(r,`controls`)});let i=I(()=>Pl[t.domain]??[t.domain]),a=I(()=>t.tokens.filter(e=>Fl(e.name)===t.domain&&e.name in t.overrides).length);var o=Xr(),s=B(o),c=e=>{var n=Xr(),r=B(n),i=e=>{Gl(e,{get overrides(){return t.overrides},get onSelect(){return t.onSelectDomain},get onApplyTheme(){return t.onApplyTheme},get onResetAll(){return t.onResetAll}})},a=e=>{Pm(e,{get overrides(){return t.overrides},get onApplyTheme(){return t.onApplyTheme},get onResetAll(){return t.onResetAll}})},o=e=>{Bh(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onBulkChange(){return t.onBulkChange}})},s=e=>{Rm(e,{get overrides(){return t.overrides}})},c=e=>{eh(e,{})};J(r,e=>{t.domain===`home`?e(i):t.domain===`themes`?e(a,1):t.domain===`wcag`?e(o,2):t.domain===`setup`?e(s,3):t.domain===`cheatsheet`&&e(c,4)}),K(e,n)},l=I(()=>n.has(t.domain)),u=e=>{var n=Uh(),o=z(n),s=z(o),c=e=>{var n=Vh(),r=z(n),i=e=>{md(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange},get onSelectDomain(){return t.onSelectDomain}})},a=e=>{nf(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange}})},o=e=>{hf(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},s=e=>{Ff(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange}})},c=e=>{Zf(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},l=e=>{ap(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},u=e=>{xp(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange}})},d=e=>{Ip(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},f=e=>{Zp(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},p=e=>{bm(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange}})},m=e=>{Tm(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},h=e=>{hh(e,{get domain(){return t.domain},get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})};J(r,e=>{t.domain===`colors`?e(i):t.domain===`typography`?e(a,1):t.domain===`spacing`?e(o,2):t.domain===`layout`?e(s,3):t.domain===`borders`?e(c,4):t.domain===`shadows`?e(l,5):t.domain===`motion`?e(u,6):t.domain===`effects`?e(d,7):t.domain===`macros`?e(f,8):t.domain===`misc`?e(p,9):t.domain===`components`?e(m,10):e(h,-1)}),F(n),K(e,n)},l=e=>{wh(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get patterns(){return U(i)},get onSet(){return t.onSet},get onReset(){return t.onReset}})};J(s,e=>{U(r)===`controls`?e(c):e(l,-1)}),F(o);var u=V(o,2),d=z(u);po(z(d),{class:`w-3 h-3`}),Me(),F(d);var f=V(d,4),p=z(f);Ba(p,{class:`w-3 h-3`});var m=V(p,2),h=e=>{var t=Hh(),n=z(t,!0);F(t),H(()=>q(n,U(a))),K(e,t)};J(m,e=>{U(a)>0&&e(h)}),F(f),F(u),F(n),H(()=>{X(d,1,`flex-1 flex items-center justify-center gap-1.5 py-2 text-[10px] font-bold transition-all cursor-pointer ${U(r)===`controls`?`text-indigo-700 dark:text-indigo-300 bg-indigo-600/10 border-t-2 border-t-indigo-500 -mt-px`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),X(f,1,`flex-1 flex items-center justify-center gap-1.5 py-2 text-[10px] font-bold transition-all cursor-pointer ${U(r)===`tokens`?`text-indigo-700 dark:text-indigo-300 bg-indigo-600/10 border-t-2 border-t-indigo-500 -mt-px`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`)}),W(`click`,d,()=>{R(r,`controls`)}),W(`click`,f,()=>{R(r,`tokens`)}),K(e,n)};J(s,e=>{U(l)?e(c):e(u,-1)}),K(e,o),We()}Br([`click`]);var Gh=G(`
 
`),Kh=G(`
Type to search tokens by name or description
`),qh=G(`overridden`),Jh=G(`
 
`),Yh=G(``),Xh=G(`
↑↓ navigate ↵ open panel Esc close
`),Zh=G(``);function Qh(e,t){Ue(t,!0);let n=L(``),r=L(0),i=L(null),a={colors:`Colors`,typography:`Typography`,spacing:`Spacing`,layout:`Layout`,borders:`Borders`,shadows:`Shadows`,motion:`Motion`,effects:`Effects`,macros:`Macros`,misc:`Misc`,components:`Components`},o=I(()=>(()=>{let e=U(n).trim().toLowerCase();if(!e)return[];let r=[];for(let n of t.tokens){if(n.tier===`INTERNAL`)continue;let i=n.name.toLowerCase().includes(e),a=n.description?.toLowerCase().includes(e)??!1;if((i||a)&&(r.push({token:n,domain:Fl(n.name),overridden:n.name in t.overrides}),r.length>=40))break}return r})());On(()=>{U(n),R(r,0)}),On(()=>{U(i)&&U(i).focus()});function s(e){t.onNavigate(e),t.onClose()}function c(e){if(e.key===`Escape`){e.preventDefault(),t.onClose();return}if(U(o).length===0&&(e.key===`ArrowDown`||e.key===`ArrowUp`)){e.preventDefault(),R(r,0);return}if(e.key===`ArrowDown`){e.preventDefault(),R(r,Math.min(U(r)+1,U(o).length-1),!0);return}if(e.key===`ArrowUp`){e.preventDefault(),R(r,Math.max(U(r)-1,0),!0);return}e.key===`Enter`&&U(o)[U(r)]&&(e.preventDefault(),s(U(o)[U(r)].domain))}var l=Zh(),u=z(l),d=z(u),f=V(z(d),2);zi(f),Qi(f,e=>R(i,e),()=>U(i)),Me(2),F(d);var p=V(d,2),m=z(p),h=e=>{var t=Gh(),r=z(t);F(t),H(()=>q(r,`No tokens matching "${U(n)??``}"`)),K(e,t)},g=I(()=>U(n).trim()&&U(o).length===0),_=e=>{K(e,Kh())},v=I(()=>!U(n).trim()),y=e=>{var n=Xr();Y(B(n),19,()=>U(o),e=>e.token.name,(e,n,i)=>{var o=Yh(),c=z(o),l=z(c),u=z(l),d=z(u,!0);F(u);var f=V(u,2),p=e=>{K(e,qh())};J(f,e=>{U(n).overridden&&e(p)}),F(l);var m=V(l,2),h=e=>{var t=Jh(),r=z(t,!0);F(t),H(()=>q(r,U(n).token.description)),K(e,t)};J(m,e=>{U(n).token.description&&e(h)}),F(c);var g=V(c,2),_=z(g),v=z(_,!0);F(_);var y=V(_,2),b=z(y,!0);F(y),F(g),F(o),H(()=>{X(o,1,`w-full flex items-center gap-3 px-4 py-2.5 text-left transition-colors cursor-pointer ${U(r)===U(i)?`bg-indigo-500/15`:`hover:bg-black/4 dark:hover:bg-white/4`}`),q(d,U(n).token.name),q(v,U(n).overridden?t.overrides[U(n).token.name]:U(n).token.value),q(b,a[U(n).domain]??U(n).domain)}),zr(`mouseenter`,o,()=>{R(r,U(i),!0)}),W(`click`,o,()=>s(U(n).domain)),K(e,o)}),K(e,n)};J(m,e=>{U(g)?e(h):U(v)?e(_,1):e(y,-1)}),F(p);var b=V(p,2),x=e=>{K(e,Xh())};J(b,e=>{U(o).length>0&&e(x)}),F(u),F(l),W(`mousedown`,l,e=>{e.target===e.currentTarget&&t.onClose()}),W(`keydown`,f,c),qi(f,()=>U(n),e=>R(n,e)),K(e,l),We()}Br([`mousedown`,`keydown`,`click`]);var $h=G(` `),eg=G(``),tg=G(``),ng=G(`
 
 
 
 
  
 
 
  
`);function rg(e,t){Ue(t,!0);let n=(e,t=f,n=f,r=f)=>{var i=eg(),a=z(i);mi(a,n,(e,t)=>{t(e,{class:`w-3.5 h-3.5`})});var o=V(a),s=V(o),c=e=>{var t=$h(),n=z(t,!0);F(t),H(()=>q(n,U(v)>9?`9+`:U(v))),K(e,t)};J(s,e=>{t()===`preview`&&U(v)>0&&e(c)}),F(i),H(()=>{Q(i,`aria-pressed`,U(p)===t()),X(i,1,`flex-1 flex items-center justify-center gap-1.5 py-2.5 text-[11px] font-bold transition-colors cursor-pointer ${U(p)===t()?`text-indigo-700 dark:text-indigo-300 bg-indigo-500/10`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(o,` ${r()??``} `)}),W(`click`,i,()=>{R(p,t(),!0)}),K(e,i)},r=Bm.tokens??Bm,i={home:`Home`,colors:`Colors`,typography:`Typography`,spacing:`Spacing`,layout:`Layout`,borders:`Borders`,shadows:`Shadows`,motion:`Motion`,effects:`Effects`,macros:`Macros`,misc:`Misc`,components:`Components`,themes:`Themes`,wcag:`WCAG`,setup:`Install`,cheatsheet:`Classes`};function a(e){let t={};for(let n of Object.keys(e)){let e=Fl(n);t[e]=(t[e]??0)+1}return t}let o=Zc(),s=L(nn(Qc())),c=L(nn([])),l=L(nn([])),u=L(`home`),d=L(!1),p=L(`controls`),m=L(`light`),h=L(`fluid`),g=L(`normal`),_=L(`marketing`),v=I(()=>Object.keys(U(s)).length),y=I(()=>a(U(s))),b=I(()=>Object.keys(U(s)).filter(e=>Fl(e)===U(u))),x=I(()=>U(b).length),S=I(()=>U(c).length>0),C=I(()=>U(l).length>0);function w(e,t){let n=Object.keys(e);return n.length===Object.keys(t).length?n.every(n=>e[n]===t[n]):!1}let T=L(nn(Cr(()=>({...U(s)})))),E=L(`idle`),D=I(()=>!w(U(s),U(T))),O=null;On(()=>{$c(U(s))});function k(e){let t=U(s),n=typeof e==`function`?e(t):e;w(t,n)||(R(c,[...U(c).slice(-49),t],!0),R(l,[],!0),(U(E)===`saved`||U(E)===`error`)&&R(E,`idle`)),R(s,n,!0)}async function A(){if(!U(D)||U(E)===`saving`)return;let e={...U(s)};R(E,`saving`);try{await nl(U(s)),w(U(s),e)?(R(T,e,!0),R(E,`saved`),O&&clearTimeout(O),O=setTimeout(()=>{U(E)===`saved`&&R(E,`idle`),O=null},2e3)):R(E,`idle`)}catch(e){console.warn(`slashed: save failed`,e),R(E,`error`)}}function ee(e,t){k(n=>({...n,[e]:t}))}function j(e){k(t=>{let n={...t};return delete n[e],n})}function te(e){k(t=>{let n={...t};for(let[t,r]of Object.entries(e))r===null?delete n[t]:n[t]=r;return n})}function ne(e){k({...e})}function M(){k({})}function re(){let e={};for(let t of U(b))e[t]=null;te(e)}function ie(){if(U(c).length===0)return;let e=U(c)[U(c).length-1],t=U(s);R(c,U(c).slice(0,-1),!0),R(l,[t,...U(l)],!0),R(s,e,!0)}function ae(){if(U(l).length===0)return;let e=U(l)[0],t=U(s);R(l,U(l).slice(1),!0),R(c,[...U(c),t],!0),R(s,e,!0)}function oe(){let e=document.createElement(`input`);e.type=`file`,e.accept=`.css,.json`,e.onchange=e=>{let t=e.target.files?.[0];if(!t)return;let n=new FileReader;n.onload=e=>{let n=e.target?.result;if(n)if(t.name.endsWith(`.json`))try{let e=JSON.parse(n);if(typeof e==`object`&&e&&!Array.isArray(e)){let t=Object.fromEntries(Object.entries(e).filter(([e,t])=>typeof t==`string`&&/^--sf-[\w-]+$/.test(e)));Object.keys(t).length>0&&k(t)}}catch{}else{let e={},t=/(--sf-[\w-]+)\s*:\s*([^;]+);/g,r;for(;(r=t.exec(n))!==null;)e[r[1].trim()]=r[2].trim();Object.keys(e).length>0&&k(t=>({...t,...e}))}},n.readAsText(t)},e.click()}function se(){let e=Cc(U(s),{mode:`layer`,banner:!0}),t=new Blob([e],{type:`text/css`}),n=URL.createObjectURL(t),r=document.createElement(`a`);r.href=n,r.download=`slashed-overrides.css`,r.click(),URL.revokeObjectURL(n)}ia(()=>{let e=e=>{(e.ctrlKey||e.metaKey)&&!e.shiftKey&&e.key===`z`&&(e.preventDefault(),ie()),(e.ctrlKey||e.metaKey)&&(e.shiftKey&&e.key===`z`||e.key===`y`)&&(e.preventDefault(),ae()),(e.ctrlKey||e.metaKey)&&!e.shiftKey&&e.key.toLowerCase()===`s`&&(e.preventDefault(),A()),(e.ctrlKey||e.metaKey)&&!e.repeat&&e.key.toLowerCase()===`k`&&(e.preventDefault(),R(d,!U(d)))};return window.addEventListener(`keydown`,e),()=>{window.removeEventListener(`keydown`,e),O&&clearTimeout(O)}});var N=ng(),ce=z(N);ss(ce,{get overridesCount(){return U(v)},get canUndo(){return U(S)},get canRedo(){return U(C)},get hasPendingChanges(){return U(D)},get saveState(){return U(E)},onUndo:ie,onRedo:ae,onResetAll:M,onImport:oe,onExport:se,onSave:A});var le=V(ce,2),ue=z(le);n(ue,()=>`controls`,()=>po,()=>`Controls`),n(V(ue,2),()=>`preview`,()=>Ma,()=>`Preview`),F(le);var de=V(le,2),fe=z(de);ds(z(fe),{get activeId(){return U(u)},onSelect:e=>{R(u,e,!0)},get overridesByDomain(){return U(y)}}),F(fe);var pe=V(fe,2),me=z(pe),he=z(me),ge=z(he,!0);F(he);var _e=V(he,2),ve=e=>{var t=tg(),n=z(t);no(n,{class:`w-3 h-3`});var r=V(n);F(t),H(()=>{Q(t,`title`,`Reset ${U(x)} override${U(x)===1?``:`s`} in ${i[U(u)]??U(u)}`),q(r,` Reset ${U(x)??``}`)}),W(`click`,t,re),K(e,t)};J(_e,e=>{U(x)>0&&e(ve)}),F(me);var ye=V(me,2);Wh(z(ye),{get domain(){return U(u)},get tokens(){return r},get overrides(){return U(s)},onSet:ee,onReset:j,onBulkChange:te,onApplyTheme:ne,onSelectDomain:e=>{R(u,e,!0)},onResetAll:M}),F(ye),F(pe);var be=V(pe,2);Nl(z(be),{get overrides(){return U(s)},get previewTheme(){return U(m)},get previewWidth(){return U(h)},get previewMotion(){return U(g)},get previewTemplate(){return U(_)},onThemeChange:e=>{R(m,e,!0)},onWidthChange:e=>{R(h,e,!0)},onMotionChange:e=>{R(g,e,!0)},onTemplateChange:e=>{R(_,e,!0)}}),F(be),F(de);var xe=V(de,2);{let e=I(()=>i[U(u)]??U(u));ms(xe,{get overridesCount(){return U(v)},get domain(){return U(e)}})}var Se=V(xe,2),Ce=e=>{Qh(e,{get tokens(){return r},get overrides(){return U(s)},onNavigate:e=>{R(u,e,!0)},onClose:()=>{R(d,!1)}})};J(Se,e=>{U(d)&&e(Ce)}),F(N),H(()=>{X(N,1,`${o?`w-full h-full`:`w-screen h-screen`} flex flex-col overflow-hidden bg-slate-50 dark:bg-[#0a0a0f] text-slate-800 dark:text-slate-200 font-sans`),X(fe,1,`shrink-0 ${U(p)===`preview`?`hidden md:flex`:`flex`}`),X(pe,1,`flex-1 min-w-0 md:flex-none md:w-[360px] bg-slate-50 dark:bg-[#0c0c15] border-r border-black/8 dark:border-white/8 flex-col min-h-0 ${U(p)===`preview`?`hidden md:flex`:`flex`}`),q(ge,i[U(u)]??U(u)),X(be,1,`flex-1 flex-col min-h-0 min-w-0 ${U(p)===`controls`?`hidden md:flex`:`flex`}`)}),K(e,N),We()}Br([`click`]);var ig=document.getElementById(`app`)??document.getElementById(`slashed-admin-app`);ig&&(ig.innerHTML=``,Xo(ig),Zr(rg,{target:ig}));var ag=G(``),og=G(` `),sg=G(``),cg=G(` 
/
 SLASHED    
    
    
 
 
 
 
 
  
`,1);function lg(e,t){Ue(t,!0);let n=Bm.tokens??Bm,r=`slashed-overlay/open`,i=`slashed-overlay/domain`,a={home:`Home`,colors:`Colors`,typography:`Typography`,spacing:`Spacing`,layout:`Layout`,borders:`Borders`,shadows:`Shadows`,motion:`Motion`,effects:`Effects`,macros:`Macros`,misc:`Misc`,themes:`Themes`,wcag:`WCAG`,setup:`Install`,cheatsheet:`Classes`};function o(e){let t={};for(let n of Object.keys(e)){let e=Fl(n);t[e]=(t[e]??0)+1}return t}function s(e,t){try{let n=localStorage.getItem(e);return n===null?t:n!==`false`}catch{return t}}function c(e,t){try{return localStorage.getItem(e)??t}catch{return t}}let l=L(nn(s(r,!0))),u=L(nn(typeof window<`u`?window.matchMedia(`(max-width: 768px)`).matches:!1)),d=L(nn(Qc())),f=L(nn([])),p=L(nn([])),m=L(nn(c(i,`home`))),h=L(!1),g=L(!1),_=L(null),v=L(null);On(()=>{U(g)&&br().then(()=>U(_)?.focus())});let y=I(()=>Object.keys(U(d)).length),b=I(()=>o(U(d))),x=I(()=>U(f).length>0),S=I(()=>U(p).length>0);function C(e,t){let n=Object.keys(e);return n.length===Object.keys(t).length?n.every(n=>e[n]===t[n]):!1}let w=L(nn(Cr(()=>({...U(d)})))),T=L(`idle`),E=I(()=>!C(U(d),U(w))),D=null;function O(){let e=document.getElementById(`slashed-frontend-overlay`);if(!e)return;let t=`var(--wp-admin--admin-bar--height, 32px)`;e.style.position=`fixed`,e.style.right=`0`,e.style.zIndex=`99998`,e.style.pointerEvents=`auto`,U(l)?(e.style.top=t,e.style.width=U(u)?`100vw`:`420px`,e.style.height=`calc(100vh - ${t})`):(e.style.top=`calc(${t} + 16px)`,e.style.width=`40px`,e.style.height=`64px`)}On(()=>{let e=U(d),t=requestAnimationFrame(()=>{$c(e),pl(document)});return()=>cancelAnimationFrame(t)}),On(()=>{!U(u)&&U(l)?document.documentElement.classList.add(`sf-panel-active`):document.documentElement.classList.remove(`sf-panel-active`)}),On(()=>{O()}),On(()=>{try{localStorage.setItem(r,String(U(l)))}catch{}}),On(()=>{try{localStorage.setItem(i,U(m))}catch{}});function k(){R(l,!U(l))}function A(e){let t=U(d),n=typeof e==`function`?e(t):e;C(t,n)||(R(f,[...U(f).slice(-49),t],!0),R(p,[],!0),(U(T)===`saved`||U(T)===`error`)&&R(T,`idle`)),R(d,n,!0)}async function ee(){if(!U(E)||U(T)===`saving`)return;let e={...U(d)};R(T,`saving`);try{await nl(U(d)),C(U(d),e)?(R(w,e,!0),R(T,`saved`),D&&clearTimeout(D),D=setTimeout(()=>{U(T)===`saved`&&R(T,`idle`),D=null},2e3)):R(T,`idle`)}catch(e){console.warn(`slashed: save failed`,e),R(T,`error`)}}function j(e,t){A(n=>({...n,[e]:t}))}function te(e){A(t=>{let n={...t};return delete n[e],n})}function ne(e){A(t=>{let n={...t};for(let[t,r]of Object.entries(e))r===null?delete n[t]:n[t]=r;return n})}function M(e){A({...e})}function re(){R(g,!0)}function ie(){R(g,!1),A({})}function ae(){R(g,!1)}function oe(){if(!U(f).length)return;let e=U(f)[U(f).length-1];R(p,[U(d),...U(p)],!0),R(f,U(f).slice(0,-1),!0),R(d,e,!0)}function se(){if(!U(p).length)return;let e=U(p)[0];R(f,[...U(f),U(d)],!0),R(p,U(p).slice(1),!0),R(d,e,!0)}function N(){let e=Cc(U(d),{mode:`layer`,banner:!0}),t=new Blob([e],{type:`text/css`}),n=URL.createObjectURL(t),r=document.createElement(`a`);r.href=n,r.download=`slashed-overrides.css`,r.click(),URL.revokeObjectURL(n)}function ce(){let e=document.createElement(`input`);e.type=`file`,e.accept=`.css,.json`,e.onchange=e=>{let t=e.target.files?.[0];if(!t)return;let n=new FileReader;n.onload=e=>{let n=e.target?.result;if(n)if(t.name.endsWith(`.json`))try{let e=JSON.parse(n);typeof e==`object`&&e&&!Array.isArray(e)&&A(Object.fromEntries(Object.entries(e).filter(([e,t])=>typeof t==`string`&&/^--sf-[\w-]+$/.test(e))))}catch{}else{let e={},t=/(--sf-[\w-]+)\s*:\s*([^;]+);/g,r;for(;(r=t.exec(n))!==null;)e[r[1].trim()]=r[2].trim();Object.keys(e).length&&A(t=>({...t,...e}))}},n.readAsText(t)},e.click()}ia(()=>{let e=document.createElement(`style`);e.id=`sf-panel-push`,e.textContent=[`html { transition: padding-right 200ms ease-in-out; }`,`html.sf-panel-active { padding-right: 420px !important; overflow-x: clip; }`].join(`
-`),document.head.appendChild(e);let t=window.matchMedia(`(max-width: 768px)`),n=e=>{R(u,e.matches,!0)};t.addEventListener(`change`,n);let r=e=>{let t=e.key.toLowerCase();U(l)&&((e.ctrlKey||e.metaKey)&&!e.shiftKey&&t===`z`&&(e.preventDefault(),oe()),(e.ctrlKey||e.metaKey)&&(e.shiftKey&&t===`z`||t===`y`)&&(e.preventDefault(),se()),(e.ctrlKey||e.metaKey)&&!e.repeat&&t===`k`&&(e.preventDefault(),R(h,!U(h))),(e.ctrlKey||e.metaKey)&&!e.shiftKey&&t===`s`&&(e.preventDefault(),ee()))},i=()=>k();return window.addEventListener(`keydown`,r),document.addEventListener(`slashed:toggle-overlay`,i),()=>{e.remove(),document.documentElement.classList.remove(`sf-panel-active`),t.removeEventListener(`change`,n),window.removeEventListener(`keydown`,r),document.removeEventListener(`slashed:toggle-overlay`,i),D&&clearTimeout(D)}});var le=cg(),ue=B(le),de=e=>{var t=ag();ba(V(z(t),2),{class:`w-3 h-3 opacity-70 rotate-180`}),F(t),W(`click`,t,k),K(e,t)};J(ue,e=>{U(l)||e(de)});var fe=V(ue,2);let pe,me;var he=z(fe),ge=V(z(he),4),_e=z(ge,!0);F(ge);var ve=V(ge,2),ye=e=>{var t=og(),n=z(t,!0);F(t),H(()=>q(n,U(y))),K(e,t)};J(ve,e=>{U(y)>0&&e(ye)});var be=V(ve,4),xe=z(be),Se=e=>{Lo(e,{class:`w-3 h-3 animate-spin`})},Ce=e=>{va(e,{class:`w-3 h-3`})},we=e=>{Vo(e,{class:`w-3 h-3`})},Te=e=>{oo(e,{class:`w-3 h-3`})};J(xe,e=>{U(T)===`saving`?e(Se):U(T)===`saved`?e(Ce,1):U(T)===`error`?e(we,2):e(Te,-1)}),F(be);var Ee=V(be,2);jo(z(Ee),{class:`w-3 h-3`}),F(Ee);var De=V(Ee,2);Qa(z(De),{class:`w-3 h-3`}),F(De);var P=V(De,4);Pa(z(P),{class:`w-3 h-3`}),F(P);var Oe=V(P,2);Oa(z(Oe),{class:`w-3 h-3`}),F(Oe);var ke=V(Oe,2);Do(z(ke),{class:`w-3 h-3`}),F(ke);var Ae=V(ke,4);ba(z(Ae),{class:`w-3 h-3`}),F(Ae),F(he);var je=V(he,2),Me=z(je);ds(Me,{get activeId(){return U(m)},onSelect:e=>{R(m,e,!0)},get overridesByDomain(){return U(b)}});var Ne=V(Me,2),Pe=z(Ne),Fe=z(Pe),Ie=z(Fe,!0);F(Fe),F(Pe);var Le=V(Pe,2);Wh(z(Le),{get domain(){return U(m)},get tokens(){return n},get overrides(){return U(d)},onSet:j,onReset:te,onBulkChange:ne,onApplyTheme:M,onSelectDomain:e=>{R(m,e,!0)},onResetAll:re}),F(Le),F(Ne),F(je);var Re=V(je,2),ze=e=>{Qh(e,{get tokens(){return n},get overrides(){return U(d)},onNavigate:e=>{R(m,e,!0)},onClose:()=>{R(h,!1)}})};J(Re,e=>{U(h)&&e(ze)});var Be=V(Re,2),Ve=e=>{var t=sg(),n=z(t),r=V(z(n),2),i=z(r);F(r);var a=V(r,2),o=z(a);Qi(o,e=>R(_,e),()=>U(_));var s=V(o,2);Qi(s,e=>R(v,e),()=>U(v)),F(a),F(n),F(t),H(()=>q(i,`This will clear all ${U(y)??``} customisation${U(y)===1?``:`s`}.
+      itself and can't be shown in the static canvas.
`);function bm(e,t){Ue(t,!0);let n=[{label:`Below`,token:`--sf-z-below`,note:`Behind content (e.g. decorative BG)`},{label:`Raised`,token:`--sf-z-raised`,note:`Slightly above flow`},{label:`Dropdown`,token:`--sf-z-dropdown`,note:`Dropdowns, popovers`},{label:`Sticky`,token:`--sf-z-sticky`,note:`Sticky headers, toolbars`},{label:`Fixed`,token:`--sf-z-fixed`,note:`Fixed UI chrome`},{label:`Overlay`,token:`--sf-z-overlay`,note:`Modals, drawers backdrop`},{label:`Modal`,token:`--sf-z-modal`,note:`Modal dialogs`},{label:`Popover`,token:`--sf-z-popover`,note:`Tooltips, menus`},{label:`Tooltip`,token:`--sf-z-tooltip`,note:`Inline tooltips`},{label:`Toast`,token:`--sf-z-toast`,note:`Notifications`}],r=[{label:`Smooth`,value:`smooth`},{label:`Auto`,value:`auto`}],i=[{label:`XS`,token:`--sf-size-xs`,default:1.5},{label:`S`,token:`--sf-size-s`,default:2},{label:`M`,token:`--sf-size-m`,default:2.5},{label:`L`,token:`--sf-size-l`,default:2.75},{label:`XL`,token:`--sf-size-xl`,default:3.5}];function a(e,t,n){if(!e)return t;let r=parseFloat(n?e.replace(n,``):e);return isNaN(r)?t:r}let o=I(()=>a(t.overrides[`--sf-touch-target`],44,`px`)),s=I(()=>t.overrides[`--sf-scroll-behavior`]??`smooth`),c=I(()=>a(t.overrides[`--sf-z-base`],0)),l=I(()=>t.overrides[`--sf-caret-color`]??``),u=I(()=>a(t.overrides[`--sf-link-underline-offset`]?.replace(`em`,``),.15)),d=I(()=>t.overrides[`--sf-link-underline-thickness`]??`auto`),f=I(()=>t.overrides[`--sf-focus-ring-style`]??`solid`),p=L(!1),m=L(!1),g=L(!1),_=L(!1),v=L(!1),y=L(!1),b=L(!1),x=L(!1),S=L(!1),C=L(!1),w=L(!1),T=L(!1);function E(e){return a(t.overrides[e.token]?.replace(`rem`,``),e.default)}var D=ym(),O=z(D),k=z(O),A=V(z(k),2),ee=z(A,!0);F(A),F(k);var te=V(k,2),j=e=>{var n=Qp(),r=B(n);{let e=I(()=>`--sf-touch-target`in t.overrides);$(r,{label:`Min touch size`,get value(){return U(o)},min:32,max:64,step:1,unit:`px`,help:`--sf-touch-target — minimum tappable area for interactive elements (WCAG 2.5.5)`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-touch-target`,`${e}px`),onReset:()=>t.onReset(`--sf-touch-target`),rawDefault:`var(--sf-size-l)`,get variableOptions(){return lf},get currentRaw(){return t.overrides[`--sf-touch-target`]},onRawSet:e=>t.onSet(`--sf-touch-target`,e)})}var i=V(r,2),a=z(i),s=z(a);F(a),Me(2),F(i),H(()=>{Z(a,`width: ${U(o)}px; height: ${U(o)}px`),q(s,`${U(o)??``}px`)}),K(e,n)};J(te,e=>{U(p)&&e(j)}),F(O);var ne=V(O,4),M=z(ne),re=V(z(M),2),ie=z(re,!0);F(re),F(M);var ae=V(M,2),oe=e=>{var n=em();Y(n,21,()=>r,e=>e.value,(e,n)=>{var r=$p(),i=z(r,!0);F(r),H(()=>{X(r,1,`flex-1 py-2 rounded-lg text-[10px] border transition-all cursor-pointer ${U(s)===U(n).value?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(i,U(n).label)}),W(`click`,r,()=>U(n).value===`smooth`?t.onReset(`--sf-scroll-behavior`):t.onSet(`--sf-scroll-behavior`,U(n).value)),K(e,r)}),F(n),K(e,n)};J(ae,e=>{U(m)&&e(oe)}),F(ne);var se=V(ne,4),N=z(se),ce=V(z(N),2),le=z(ce,!0);F(ce),F(N);var ue=V(N,2),de=e=>{var r=nm(),i=B(r);{let e=I(()=>`--sf-z-base`in t.overrides);$(i,{label:`Base offset`,get value(){return U(c)},min:0,max:1e3,step:10,help:`--sf-z-base — added to all z-index tokens to avoid conflicts with existing stacking contexts`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-z-base`,String(e)),onReset:()=>t.onReset(`--sf-z-base`)})}var a=V(i,2);Y(a,21,()=>n,e=>e.token,(e,n)=>{let r=I(()=>U(n).token in t.overrides);var i=tm(),a=z(i),o=V(a,2),s=z(o,!0);F(o);var c=V(o,2),l=z(c,!0);F(c);var u=V(c,2),d=z(u,!0);F(u),F(i),H(e=>{X(a,1,`w-1.5 h-1.5 rounded-full shrink-0 ${U(r)?`bg-amber-400`:`bg-black/20 dark:bg-white/20`}`),q(s,U(n).label),q(l,U(n).note),q(d,e)},[()=>U(n).token.replace(`--sf-z-`,``)]),K(e,i)}),F(a),Me(2),K(e,r)};J(ue,e=>{U(g)&&e(de)}),F(se);var fe=V(se,4),pe=z(fe),me=V(z(pe),2),he=z(me,!0);F(me),F(pe);var ge=V(pe,2),_e=e=>{var n=rm(),r=z(n),i=V(z(r),2);{let e=I(()=>t.overrides[`--sf-color-selection-bg`]??``),n=I(()=>`--sf-color-selection-bg`in t.overrides);ku(i,{token:`--sf-color-selection-bg`,get value(){return U(e)},placeholder:`default`,get isOverridden(){return U(n)},onSet:e=>t.onSet(`--sf-color-selection-bg`,e),onReset:()=>t.onReset(`--sf-color-selection-bg`)})}F(r);var a=V(r,2),o=V(z(a),2);{let e=I(()=>t.overrides[`--sf-color-selection-text`]??``),n=I(()=>`--sf-color-selection-text`in t.overrides);ku(o,{token:`--sf-color-selection-text`,get value(){return U(e)},placeholder:`default`,get isOverridden(){return U(n)},onSet:e=>t.onSet(`--sf-color-selection-text`,e),onReset:()=>t.onReset(`--sf-color-selection-text`)})}F(a);var s=V(a,2),c=z(s);F(s);var l=V(s,6),u=V(z(l),2);{let e=I(()=>t.overrides[`--sf-color-selection-bg--alt`]??``),n=I(()=>`--sf-color-selection-bg--alt`in t.overrides);ku(u,{token:`--sf-color-selection-bg--alt`,get value(){return U(e)},placeholder:`default`,get isOverridden(){return U(n)},onSet:e=>t.onSet(`--sf-color-selection-bg--alt`,e),onReset:()=>t.onReset(`--sf-color-selection-bg--alt`)})}F(l);var d=V(l,2),f=V(z(d),2);{let e=I(()=>t.overrides[`--sf-color-selection-text--alt`]??``),n=I(()=>`--sf-color-selection-text--alt`in t.overrides);ku(f,{token:`--sf-color-selection-text--alt`,get value(){return U(e)},placeholder:`default`,get isOverridden(){return U(n)},onSet:e=>t.onSet(`--sf-color-selection-text--alt`,e),onReset:()=>t.onReset(`--sf-color-selection-text--alt`)})}F(d);var p=V(d,2),m=z(p);F(p),F(n),H(()=>{Z(c,`--sf-color-selection-bg: ${t.overrides[`--sf-color-selection-bg`]??`#6366f1`}; --sf-color-selection-text: ${t.overrides[`--sf-color-selection-text`]??`#ffffff`}`),Z(m,`--sf-color-selection-bg: ${t.overrides[`--sf-color-selection-bg--alt`]??`#4338ca`}; --sf-color-selection-text: ${t.overrides[`--sf-color-selection-text--alt`]??`#e0e7ff`}`)}),K(e,n)};J(ge,e=>{U(_)&&e(_e)}),F(fe);var ve=V(fe,4),ye=z(ve),be=V(z(ye),2),xe=z(be,!0);F(be),F(ye);var Se=V(ye,2),Ce=e=>{var n=im(),r=B(n);Y(r,20,()=>[`solid`,`dashed`,`dotted`],e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-focus-ring-style`]??`solid`);var i=$p(),a=z(i,!0);F(i),H(()=>{X(i,1,`flex-1 py-2 rounded-lg text-[10px] border transition-all cursor-pointer capitalize ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(a,n)}),W(`click`,i,()=>n===`solid`?t.onReset(`--sf-focus-ring-style`):t.onSet(`--sf-focus-ring-style`,n)),K(e,i)}),F(r);var i=V(r,2),a=z(i),o=z(a);F(a),F(i),H(()=>{Z(a,`outline: 2px ${U(f)} ${t.overrides[`--sf-focus-ring-color`]||`oklch(0.7 0.2 235)`}; outline-offset: 2px`),q(o,`Focus ring · ${U(f)??``}`)}),K(e,n)};J(Se,e=>{U(v)&&e(Ce)}),F(ve);var we=V(ve,4),Te=z(we),Ee=V(z(Te),2),De=z(Ee,!0);F(Ee),F(Te);var P=V(Te,2),Oe=e=>{var n=om(),r=V(B(n),2);Y(r,21,()=>i,e=>e.token,(e,n)=>{let r=I(()=>E(U(n)));{let i=I(()=>`${U(n).token} — component size step ${U(n).label}`),a=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},min:1,max:5,step:.05,unit:`rem`,get help(){return U(i)},get overridden(){return U(a)},onChange:e=>t.onSet(U(n).token,`${e}rem`),onReset:()=>t.onReset(U(n).token)})}}),F(r);var a=V(r,2);Y(a,21,()=>i,e=>e.token,(e,t)=>{let n=I(()=>E(U(t)));var r=am(),i=z(r),a=V(i,2),o=z(a,!0);F(a),F(r),H(e=>{Z(i,e),q(o,U(t).label)},[()=>`height: ${Math.min(U(n)*14,64)}px`]),K(e,r)}),F(a),K(e,n)};J(P,e=>{U(y)&&e(Oe)}),F(we);var ke=V(we,4),Ae=z(ke),je=V(z(Ae),2),Ne=z(je,!0);F(je),F(Ae);var Pe=V(Ae,2),Fe=e=>{var n=cm(),r=B(n),i=V(z(r),2);{let e=I(()=>`--sf-caret-color`in t.overrides);ku(i,{token:`--sf-caret-color`,get value(){return U(l)},placeholder:`default (action color)`,get isOverridden(){return U(e)},onSet:e=>t.onSet(`--sf-caret-color`,e),onReset:()=>t.onReset(`--sf-caret-color`)})}F(r);var a=V(r,2);{let e=I(()=>`--sf-link-underline-offset`in t.overrides);$(a,{label:`Underline offset`,get value(){return U(u)},min:0,max:.5,step:.01,unit:`em`,help:`--sf-link-underline-offset — gap between text baseline and underline`,get overridden(){return U(e)},onChange:e=>t.onSet(`--sf-link-underline-offset`,`${e}em`),onReset:()=>t.onReset(`--sf-link-underline-offset`)})}var o=V(a,2),s=z(o),c=V(z(s),2),f=e=>{var n=sm();W(`click`,n,()=>t.onReset(`--sf-link-underline-thickness`)),K(e,n)};J(c,e=>{`--sf-link-underline-thickness`in t.overrides&&e(f)}),F(s);var p=V(s,2);Y(p,20,()=>[[`auto`,`auto`],[`1px`,`1px`],[`2px`,`2px`],[`3px`,`3px`]],([e,t])=>t,(e,n)=>{var r=I(()=>h(n,2));let i=()=>U(r)[0],a=()=>U(r)[1];var o=$p(),s=z(o,!0);F(o),H(()=>{X(o,1,`flex-1 py-1.5 rounded-lg text-[10px] border transition-all cursor-pointer ${U(d)===a()?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5 hover:text-slate-800 dark:hover:text-slate-200`}`),q(s,i())}),W(`click`,o,()=>a()===`auto`?t.onReset(`--sf-link-underline-thickness`):t.onSet(`--sf-link-underline-thickness`,a())),K(e,o)}),F(p),F(o);var m=V(o,2),g=z(m),_=V(g,2),v=V(z(_));Me(),F(_),F(m),H(()=>{Z(g,`caret-color:${U(l)||`#6366f1`}`),Z(v,`text-decoration:underline;text-underline-offset:${U(u)}em;text-decoration-thickness:${U(d)}`)}),W(`click`,v,e=>e.preventDefault()),K(e,n)};J(Pe,e=>{U(b)&&e(Fe)}),F(ke);var Ie=V(ke,4),Le=z(Ie),Re=V(z(Le),2),ze=z(Re,!0);F(Re),F(Le);var Be=V(Le,2),Ve=e=>{var n=lm(),r=V(B(n),2);Y(r,20,()=>[{label:`xs`,token:`--sf-icon-xs`,def:.875},{label:`s`,token:`--sf-icon-s`,def:1},{label:`m`,token:`--sf-icon-m`,def:1.5},{label:`l`,token:`--sf-icon-l`,def:2},{label:`xl`,token:`--sf-icon-xl`,def:3},{label:`2xl`,token:`--sf-icon-2xl`,def:4}],e=>e.token,(e,n)=>{{let r=I(()=>a(t.overrides[n.token]?.replace(`em`,``),n.def)),i=I(()=>n.token in t.overrides);$(e,{get label(){return n.label},get value(){return U(r)},min:.5,max:6,step:.125,unit:`em`,get overridden(){return U(i)},onChange:e=>t.onSet(n.token,`${e}em`),onReset:()=>t.onReset(n.token)})}}),F(r);var i=V(r,2);{let e=I(()=>a(t.overrides[`--sf-icon-box-pad`]?.replace(`em`,``),.5)),n=I(()=>`--sf-icon-box-pad`in t.overrides);$(i,{label:`Box padding`,get value(){return U(e)},min:0,max:2,step:.125,unit:`em`,help:`--sf-icon-box-pad — padding around icon when using .sf-icon-box`,get overridden(){return U(n)},onChange:e=>t.onSet(`--sf-icon-box-pad`,`${e}em`),onReset:()=>t.onReset(`--sf-icon-box-pad`)})}K(e,n)};J(Be,e=>{U(x)&&e(Ve)}),F(Ie);var He=V(Ie,4),Ge=z(He),Ke=V(z(Ge),2),qe=z(Ke,!0);F(Ke),F(Ge);var Je=V(Ge,2),Ye=e=>{var n=fm(),r=V(B(n),2),i=V(z(r),2);Y(i,20,()=>[`cover`,`contain`,`fill`,`none`],e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-object-fit`]??`cover`);var i=$p(),a=z(i,!0);F(i),H(()=>{X(i,1,`flex-1 py-1.5 rounded-lg text-[9px] border transition-all cursor-pointer ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,n)}),W(`click`,i,()=>n===`cover`?t.onReset(`--sf-object-fit`):t.onSet(`--sf-object-fit`,n)),K(e,i)}),F(i);var a=V(i,2),o=e=>{var n=um();W(`click`,n,()=>t.onReset(`--sf-object-fit`)),K(e,n)};J(a,e=>{`--sf-object-fit`in t.overrides&&e(o)}),F(r);var s=V(r,2),c=V(z(s),2);zi(c);var l=V(c,2),u=e=>{var n=dm();W(`click`,n,()=>t.onReset(`--sf-object-position`)),K(e,n)};J(l,e=>{`--sf-object-position`in t.overrides&&e(u)}),F(s),H(()=>Bi(c,t.overrides[`--sf-object-position`]??``)),W(`input`,c,e=>{let n=e.target.value.trim();n?t.onSet(`--sf-object-position`,n):t.onReset(`--sf-object-position`)}),K(e,n)};J(Je,e=>{U(S)&&e(Ye)}),F(He);var Xe=V(He,4),Ze=z(Xe),Qe=V(z(Ze),2),$e=z(Qe,!0);F(Qe),F(Ze);var et=V(Ze,2),tt=e=>{var n=mm(),r=V(B(n),2);Y(r,20,()=>[{label:`Top`,token:`--sf-safe-top`,placeholder:`env(safe-area-inset-top, 0px)`},{label:`Right`,token:`--sf-safe-right`,placeholder:`env(safe-area-inset-right, 0px)`},{label:`Bottom`,token:`--sf-safe-bottom`,placeholder:`env(safe-area-inset-bottom, 0px)`},{label:`Left`,token:`--sf-safe-left`,placeholder:`env(safe-area-inset-left, 0px)`}],e=>e.token,(e,n)=>{var r=pm(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=dm();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.placeholder)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),F(r),K(e,n)};J(et,e=>{U(w)&&e(tt)}),F(Xe);var nt=V(Xe,4),rt=z(nt),it=V(z(rt),2),at=z(it,!0);F(it),F(rt);var ot=V(rt,2),st=e=>{var n=gm(),r=V(B(n),2),i=V(z(r),2);Y(i,20,()=>[`a4`,`letter`,`legal`,`a3`],e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-print-page-size`]??`a4`);var i=$p(),a=z(i,!0);F(i),H(()=>{X(i,1,`flex-1 py-1.5 rounded-lg text-[9px] border transition-all cursor-pointer ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,n)}),W(`click`,i,()=>n===`a4`?t.onReset(`--sf-print-page-size`):t.onSet(`--sf-print-page-size`,n)),K(e,i)}),F(i),F(r),Y(V(r,2),16,()=>[{label:`Base size`,token:`--sf-print-base-size`,placeholder:`11pt`},{label:`Page margin`,token:`--sf-print-page-margin`,placeholder:`2cm`}],e=>e.token,(e,n)=>{var r=hm(),i=z(r),a=z(i,!0);F(i);var o=V(i,2);zi(o);var s=V(o,2),c=e=>{var r=dm();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(s,e=>{n.token in t.overrides&&e(c)}),F(r),H(()=>{q(a,n.label),Bi(o,t.overrides[n.token]??``),Q(o,`placeholder`,n.placeholder)}),W(`input`,o,e=>{let r=e.target.value.trim();r?t.onSet(n.token,r):t.onReset(n.token)}),K(e,r)}),K(e,n)};J(ot,e=>{U(C)&&e(st)}),F(nt);var ct=V(nt,4),lt=z(ct),ut=V(z(lt),2),dt=z(ut,!0);F(ut),F(lt);var ft=V(lt,2),pt=e=>{var n=vm(),r=V(B(n),2);Y(r,20,()=>[{label:`sf-is-active`,token:`--sf-is-active`,note:`Active/selected state`},{label:`sf-is-current`,token:`--sf-is-current`,note:`Current page/item`},{label:`sf-is-open`,token:`--sf-is-open`,note:`Open/expanded state`},{label:`sf-is-pressed`,token:`--sf-is-pressed`,note:`Pressed/depressed state`}],e=>e.token,(e,n)=>{let r=I(()=>t.overrides[n.token]??`0`);var i=_m(),a=z(i),o=z(a);F(a);var s=V(a,2),c=z(s,!0);F(s);var l=V(s,2),u=z(l,!0);F(l);var d=V(l,2),f=e=>{var r=dm();W(`click`,r,()=>t.onReset(n.token)),K(e,r)};J(d,e=>{n.token in t.overrides&&e(f)}),F(i),H(()=>{Q(a,`aria-label`,n.label),Q(a,`aria-pressed`,U(r)===`1`),X(a,1,`w-8 h-4 rounded-full transition-colors relative cursor-pointer shrink-0 ${U(r)===`1`?`bg-indigo-600`:`bg-black/10 dark:bg-white/10`}`),X(o,1,`absolute top-0.5 w-3 h-3 bg-white rounded-full shadow transition-transform ${U(r)===`1`?`translate-x-4`:`translate-x-0.5`}`),q(c,n.label),q(u,n.note)}),W(`click`,a,()=>U(r)===`1`?t.onReset(n.token):t.onSet(n.token,`1`)),K(e,i)}),F(r);var i=V(r,2),a=V(z(i),2);zi(a);var o=V(a,2),s=e=>{var n=dm();W(`click`,n,()=>t.onReset(`--sf-field-required-marker`)),K(e,n)};J(o,e=>{`--sf-field-required-marker`in t.overrides&&e(s)}),F(i),H(()=>Bi(a,t.overrides[`--sf-field-required-marker`]??``)),W(`input`,a,e=>{let n=e.target.value;n?t.onSet(`--sf-field-required-marker`,n):t.onReset(`--sf-field-required-marker`)}),K(e,n)};J(ft,e=>{U(T)&&e(pt)}),F(ct),Me(4),F(D),H(()=>{Q(k,`aria-expanded`,U(p)),q(ee,U(p)?`▲`:`▼`),Q(M,`aria-expanded`,U(m)),q(ie,U(m)?`▲`:`▼`),Q(N,`aria-expanded`,U(g)),q(le,U(g)?`▲`:`▼`),Q(pe,`aria-expanded`,U(_)),q(he,U(_)?`▲`:`▼`),Q(ye,`aria-expanded`,U(v)),q(xe,U(v)?`▲`:`▼`),Q(Te,`aria-expanded`,U(y)),q(De,U(y)?`▲`:`▼`),Q(Ae,`aria-expanded`,U(b)),q(Ne,U(b)?`▲`:`▼`),Q(Le,`aria-expanded`,U(x)),q(ze,U(x)?`▲`:`▼`),Q(Ge,`aria-expanded`,U(S)),q(qe,U(S)?`▲`:`▼`),Q(Ze,`aria-expanded`,U(w)),q($e,U(w)?`▲`:`▼`),Q(rt,`aria-expanded`,U(C)),q(at,U(C)?`▲`:`▼`),Q(lt,`aria-expanded`,U(T)),q(dt,U(T)?`▲`:`▼`)}),W(`click`,k,()=>{R(p,!U(p))}),W(`click`,M,()=>{R(m,!U(m))}),W(`click`,N,()=>{R(g,!U(g))}),W(`click`,pe,()=>{R(_,!U(_))}),W(`click`,ye,()=>{R(v,!U(v))}),W(`click`,Te,()=>{R(y,!U(y))}),W(`click`,Ae,()=>{R(b,!U(b))}),W(`click`,Le,()=>{R(x,!U(x))}),W(`click`,Ge,()=>{R(S,!U(S))}),W(`click`,Ze,()=>{R(w,!U(w))}),W(`click`,rt,()=>{R(C,!U(C))}),W(`click`,lt,()=>{R(T,!U(T))}),K(e,D),We()}Br([`click`,`input`]);var xm=G(``),Sm=G(`
Variant (preview only)
 
 
Style
 
 
Size
 
 
 
 
 
 
Label size — --sf-btn-font-size
 
 
Label weight — --sf-btn-font-weight
 
`,1),Cm=G(`
  
 
 
Card title
 
Body copy showing padding, gap, and background live.
 
 
 
Radius (outer, computed)  
 
--sf-card-radius-outer = radius + padding (concentric math) — not independently overridable, always computed from the two sliders above.
 
Background — --sf-card-bg
 
 
Border color — --sf-card-border-color
 
 
Shadow — --sf-card-shadow
 
 
Elevated shadow — --sf-card-shadow--elevated
 
 
Hover shadow (interactive) — --sf-card-shadow--hover
 
 
Media aspect ratio — --sf-card-media-ratio
 
 
Title size — --sf-card-heading-size
 
 
Nested button size — --sf-card-btn-font-size
 
 
Media object-fit — --sf-object-fit (global, affects all img/video)
 
`,1),wm=G(`
 
 
 
 
`);function Tm(e,t){Ue(t,!0);let n=[`2xs`,`xs`,`s`,`m`,`l`,`xl`,`2xl`],r=[`xs`,`s`,`m`,`l`,`xl`,`2xl`],i=[`square`,`video`,`cinema`,`4-3`,`3-2`,`portrait`,`golden`],a=[`100`,`200`,`300`,`400`,`500`,`600`,`700`,`800`,`900`],o=[`default`,`primary`,`neutral`,`success`,`warning`,`info`,`danger`],s=[{id:`fill`,label:`Fill`},{id:`secondary`,label:`Secondary`},{id:`ghost`,label:`Ghost`},{id:`outline`,label:`Outline`}],c=[`xs`,`s`,`m`,`l`,`xl`],l=[{step:`surface`,label:`Surface`},{step:`base`,label:`Base`},{step:`inset`,label:`Inset`},{step:`raised`,label:`Raised`}],u=[{step:`border`,label:`Default`},{step:`border--subtle`,label:`Subtle`},{step:`border--strong`,label:`Strong`}],d=[{label:`Radius`,token:`--sf-btn-radius`,unit:`rem`,min:0,max:2,step:.05,default:.5,rawDefault:`var(--sf-radius-m)`,variableOptions:of},{label:`Padding block`,token:`--sf-btn-padding-block`,unit:`rem`,min:0,max:1,step:.025,default:.375,rawDefault:`var(--sf-space-xs)`,variableOptions:af},{label:`Padding inline`,token:`--sf-btn-padding-inline`,unit:`rem`,min:0,max:2,step:.025,default:1,rawDefault:`var(--sf-space-m)`,variableOptions:af},{label:`Gap (icon+label)`,token:`--sf-btn-gap`,unit:`rem`,min:0,max:1,step:.0125,default:.25,rawDefault:`var(--sf-space-2xs)`,variableOptions:af},{label:`Border width`,token:`--sf-btn-border-width`,unit:`px`,min:0,max:4,step:.5,default:1,rawDefault:`var(--sf-border-width-1)`,variableOptions:sf},{label:`Min height`,token:`--sf-btn-min-height`,unit:`rem`,min:1,max:4,step:.125,default:2.75,rawDefault:`var(--sf-touch-target)`,variableOptions:lf}],f=[{label:`Padding`,token:`--sf-card-padding`,unit:`rem`,min:0,max:3,step:.05,default:1.5,rawDefault:`var(--sf-space-l)`,variableOptions:af},{label:`Gap (header/footer)`,token:`--sf-card-gap`,unit:`rem`,min:0,max:2,step:.05,default:1,rawDefault:`var(--sf-space-m)`,variableOptions:af},{label:`Radius (inner)`,token:`--sf-card-radius`,unit:`rem`,min:0,max:2,step:.05,default:.5,rawDefault:`var(--sf-radius-m)`,variableOptions:of},{label:`Border width`,token:`--sf-card-border-width`,unit:`px`,min:0,max:4,step:.5,default:1,rawDefault:`var(--sf-border-width-1)`,variableOptions:sf},{label:`Media radius`,token:`--sf-card-media-radius`,unit:`rem`,min:0,max:2,step:.05,default:.5,rawDefault:`var(--sf-card-radius, var(--sf-radius-m))`,variableOptions:of}],p=L(!1),m=L(!1),h=L(`primary`),g=L(`fill`),_=L(`m`),v=L(!1),y=L(!1),b=L(!1),x=L(!1),S=L(!1);function C(){let e=[`sf-btn`];return U(h)!=="default"&&e.push(`sf-btn--${U(h)}`),U(g)!==`fill`&&e.push(`sf-btn--${U(g)}`),U(_)!==`m`&&e.push(`sf-btn--${U(_)}`),e.join(` `)}function w(){let e=[`sf-card`];return U(b)&&e.push(`sf-card--bordered`),U(x)&&e.push(`sf-card--elevated`),U(S)&&e.push(`sf-card--interactive`),e.join(` `)}function T(e){let n=t.overrides[e.token];if(!n||/^(var|calc|clamp)\(/.test(n.trim()))return e.default;let r=parseFloat(n);return isNaN(r)?e.default:r}function E(e,n,r,i){let a=t.overrides[e];if(!a)return i;let o=a.match(RegExp(`^var\\(--sf-${n}-([\\w-]+)\\)$`));return o&&r.includes(o[1])?o[1]:i}function D(e,n,r,i){r===i?t.onReset(e):t.onSet(e,`var(--sf-${n}-${r})`)}function O(e){return!!e&&/^(var|calc|clamp)\(/.test(e.trim())}let k=f.find(e=>e.token===`--sf-card-radius`),A=f.find(e=>e.token===`--sf-card-padding`),ee=I(()=>T(k)),te=I(()=>T(A)),j=I(()=>O(t.overrides[k.token])||O(t.overrides[A.token]));var ne=wm(),M=z(ne),re=z(M),ie=V(z(re),2),ae=z(ie,!0);F(ie),F(re);var oe=V(re,2),se=e=>{var r=Sm(),i=B(r),l=V(z(i),2);Y(l,20,()=>o,e=>e,(e,t)=>{var n=xm(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer capitalize ${U(h)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(r,t)}),W(`click`,n,()=>{R(h,t,!0)}),K(e,n)}),F(l);var u=V(l,4);Y(u,21,()=>s,e=>e.id,(e,t)=>{var n=xm(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(g)===U(t).id?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(r,U(t).label)}),W(`click`,n,()=>{R(g,U(t).id,!0)}),K(e,n)}),F(u);var f=V(u,4);Y(f,20,()=>c,e=>e,(e,t)=>{var n=xm(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-2.5 py-1 rounded-lg text-[10px] border transition-all cursor-pointer uppercase ${U(_)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(r,t)}),W(`click`,n,()=>{R(_,t,!0)}),K(e,n)}),F(f);var p=V(f,2),m=z(p),b=z(m);zi(b),Me(),F(m);var x=V(m,2),S=z(x);zi(S),Me(),F(x),F(p),F(i);var w=V(i,2),O=z(w);let k;var A=z(O,!0);F(O),F(w);var ee=V(w,2),te=z(ee);Y(te,17,()=>d,e=>e.token,(e,n)=>{{let r=I(()=>T(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},get min(){return U(n).min},get max(){return U(n).max},get step(){return U(n).step},get unit(){return U(n).unit},get help(){return U(n).token},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}${U(n).unit}`),onReset:()=>t.onReset(U(n).token),get rawDefault(){return U(n).rawDefault},get variableOptions(){return U(n).variableOptions},get currentRaw(){return t.overrides[U(n).token]},onRawSet:e=>t.onSet(U(n).token,e)})}});var j=V(te,2),ne=V(z(j),2);Y(ne,20,()=>n,e=>e,(e,t)=>{let r=I(()=>E(`--sf-btn-font-size`,`text`,n,`m`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-btn-font-size`,`text`,t,`m`)),K(e,i)}),F(ne),F(j);var M=V(j,2),re=V(z(M),2);Y(re,20,()=>a,e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-btn-font-weight`]??`600`);var i=xm(),a=z(i,!0);F(i),H(e=>{Z(i,e),X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer font-mono ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,n)},[()=>`font-weight:${parseInt(n)}`]),W(`click`,i,()=>n===`600`?t.onReset(`--sf-btn-font-weight`):t.onSet(`--sf-btn-font-weight`,n)),K(e,i)}),F(re),F(M),F(ee),H(e=>{k=X(O,1,e,null,k,{"sf-is-loading":U(y)}),O.disabled=U(v),q(A,U(y)?`Loading`:`Button label`)},[()=>yi(C())]),Ji(b,()=>U(v),e=>R(v,e)),Ji(S,()=>U(y),e=>R(y,e)),K(e,r)};J(oe,e=>{U(p)&&e(se)}),F(M);var N=V(M,4),ce=z(N),le=V(z(ce),2),ue=z(le,!0);F(le),F(ce);var de=V(ce,2),fe=e=>{var a=Cm(),o=B(a),s=z(o),c=z(s);zi(c),Me(),F(s);var d=V(s,2),p=z(d);zi(p),Me(),F(d);var m=V(d,2),h=z(m);zi(h),Me(),F(m),F(o);var g=V(o,2),_=z(g);F(g);var v=V(g,2),y=z(v);Y(y,17,()=>f,e=>e.token,(e,n)=>{{let r=I(()=>T(U(n))),i=I(()=>U(n).token in t.overrides);$(e,{get label(){return U(n).label},get value(){return U(r)},get min(){return U(n).min},get max(){return U(n).max},get step(){return U(n).step},get unit(){return U(n).unit},get help(){return U(n).token},get overridden(){return U(i)},onChange:e=>t.onSet(U(n).token,`${e}${U(n).unit}`),onReset:()=>t.onReset(U(n).token),get rawDefault(){return U(n).rawDefault},get variableOptions(){return U(n).variableOptions},get currentRaw(){return t.overrides[U(n).token]},onRawSet:e=>t.onSet(U(n).token,e)})}});var C=V(y,2),O=V(z(C),2),k=z(O,!0);F(O),F(C);var A=V(C,4),ne=V(z(A),2);Y(ne,21,()=>l,e=>e.step,(e,t)=>{let n=I(()=>E(`--sf-card-bg`,`color`,l.map(e=>e.step),`surface`));var r=xm(),i=z(r,!0);F(r),H(()=>{X(r,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===U(t).step?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(i,U(t).label)}),W(`click`,r,()=>D(`--sf-card-bg`,`color`,U(t).step,`surface`)),K(e,r)}),F(ne),F(A);var M=V(A,2),re=V(z(M),2);Y(re,21,()=>u,e=>e.step,(e,t)=>{let n=I(()=>E(`--sf-card-border-color`,`color`,u.map(e=>e.step),`border`));var r=xm(),i=z(r,!0);F(r),H(()=>{X(r,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===U(t).step?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(i,U(t).label)}),W(`click`,r,()=>D(`--sf-card-border-color`,`color`,U(t).step,`border`)),K(e,r)}),F(re),F(M);var ie=V(M,2),ae=V(z(ie),2);Y(ae,20,()=>r,e=>e,(e,t)=>{let n=I(()=>E(`--sf-card-shadow`,`shadow`,r,`s`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-shadow`,`shadow`,t,`s`)),K(e,i)}),F(ae),F(ie);var oe=V(ie,2),se=V(z(oe),2);Y(se,20,()=>r,e=>e,(e,t)=>{let n=I(()=>E(`--sf-card-shadow--elevated`,`shadow`,r,`l`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-shadow--elevated`,`shadow`,t,`l`)),K(e,i)}),F(se),F(oe);var N=V(oe,2),ce=V(z(N),2);Y(ce,20,()=>r,e=>e,(e,t)=>{let n=I(()=>E(`--sf-card-shadow--hover`,`shadow`,r,`l`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-shadow--hover`,`shadow`,t,`l`)),K(e,i)}),F(ce),F(N);var le=V(N,2),ue=V(z(le),2);Y(ue,20,()=>i,e=>e,(e,t)=>{let n=I(()=>E(`--sf-card-media-ratio`,`ratio`,i,`video`));var r=xm(),a=z(r,!0);F(r),H(()=>{X(r,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(n)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,r,()=>D(`--sf-card-media-ratio`,`ratio`,t,`video`)),K(e,r)}),F(ue),F(le);var de=V(le,2),fe=V(z(de),2);Y(fe,20,()=>n,e=>e,(e,t)=>{let r=I(()=>E(`--sf-card-heading-size`,`text`,n,`xl`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-heading-size`,`text`,t,`xl`)),K(e,i)}),F(fe),F(de);var pe=V(de,2),me=V(z(pe),2);Y(me,20,()=>n,e=>e,(e,t)=>{let r=I(()=>E(`--sf-card-btn-font-size`,`text`,n,`s`));var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===t?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,t)}),W(`click`,i,()=>D(`--sf-card-btn-font-size`,`text`,t,`s`)),K(e,i)}),F(me),F(pe);var he=V(pe,2),ge=V(z(he),2);Y(ge,20,()=>[`cover`,`contain`],e=>e,(e,n)=>{let r=I(()=>t.overrides[`--sf-object-fit`]??`cover`);var i=xm(),a=z(i,!0);F(i),H(()=>{X(i,1,`px-2 py-1 rounded-lg text-[10px] border transition-all cursor-pointer ${U(r)===n?`bg-indigo-500/15 border-indigo-500/40 text-indigo-800 dark:text-indigo-200`:`border-black/8 dark:border-white/8 text-slate-600 dark:text-slate-400 hover:bg-black/5 dark:hover:bg-white/5`}`),q(a,n)}),W(`click`,i,()=>n===`cover`?t.onReset(`--sf-object-fit`):t.onSet(`--sf-object-fit`,n)),K(e,i)}),F(ge),F(he),F(v),H((e,t)=>{X(_,1,e),q(k,t)},[()=>yi(w()),()=>U(j)?`depends on variable`:`${(U(ee)+U(te)).toFixed(2)}rem`]),Ji(c,()=>U(b),e=>R(b,e)),Ji(p,()=>U(x),e=>R(x,e)),Ji(h,()=>U(S),e=>R(S,e)),K(e,a)};J(de,e=>{U(m)&&e(fe)}),F(N),F(ne),H(()=>{Q(re,`aria-expanded`,U(p)),q(ae,U(p)?`▲`:`▼`),Q(ce,`aria-expanded`,U(m)),q(ue,U(m)?`▲`:`▼`)}),W(`click`,re,()=>{R(p,!U(p))}),W(`click`,ce,()=>{R(m,!U(m))}),K(e,ne),We()}Br([`click`]);var Em=G(`
No saved themes yet.
 
Configure your tokens, then save them above.
`),Dm=G(`
`),Om=G(`
  
`),km=G(` `),Am=G(`
 
`),jm=G(`
  
 
 
 
 
 
 
`),Mm=G(``),Nm=G(`
Themes
 
Save your current configuration as a named theme, then re-apply it any time.
+    Themes are stored in this browser.
 
Save current
 
 
 
 
 
`);function Pm(e,t){Ue(t,!0);let n=L(nn(Pc())),r=L(``),i=I(()=>Object.keys(t.overrides).length);function a(e,t){let n=Object.keys(e);return n.length===Object.keys(t).length?n.every(n=>e[n]===t[n]):!1}let o=I(()=>U(n).find(e=>a(e.overrides,t.overrides))?.id??``);function s(){U(i)!==0&&(R(n,Fc(U(r),t.overrides),!0),R(r,``))}function c(e){R(n,Ic(e),!0)}var l=Nm(),u=V(z(l),4),d=V(z(u),2),f=z(d);zi(f);var p=V(f,2);oo(z(p),{class:`w-3 h-3`}),Me(),F(p),F(d);var m=V(d,2),g=z(m),_=e=>{K(e,Yr(`No active overrides yet — adjust some tokens first.`))},v=e=>{var t=Yr();H(()=>q(t,`Captures all ${U(i)??``} active override${U(i)===1?``:`s`}.`)),K(e,t)};J(g,e=>{U(i)===0?e(_):e(v,-1)}),F(m),F(u);var y=V(u,2),b=z(y),x=e=>{K(e,Em())},S=e=>{var r=Xr();Y(B(r),17,()=>U(n),e=>e.id,(e,n)=>{let r=I(()=>Object.keys(U(n).overrides).length);var i=jm(),a=z(i),s=z(a),l=z(s,!0);F(s);var u=V(s,2),d=z(u),f=z(d),p=V(f),m=e=>{va(e,{class:`w-3 h-3 text-indigo-600 dark:text-indigo-400`})};J(p,e=>{U(o)===U(n).id&&e(m)}),F(d);var g=V(d,2),_=z(g);F(g),F(u);var v=V(u,2),y=z(v),b=V(y,2);Do(z(b),{class:`w-3.5 h-3.5`}),F(b),F(v),F(a);var x=V(a,2),S=e=>{var t=Am(),i=z(t);Y(i,17,()=>Object.entries(U(n).overrides).slice(0,5),([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=Om(),o=z(a),s=e=>{var t=Dm();let n;H(()=>n=Z(t,``,n,{background:i()})),K(e,t)},c=I(()=>r().includes(`color`)||r().includes(`source`));J(o,e=>{U(c)&&e(s)});var l=V(o,2),u=z(l,!0);F(l),F(a),H(e=>q(u,e),[()=>r().replace(`--sf-`,``)]),K(e,a)});var a=V(i,2),o=e=>{var t=km(),n=z(t);F(t),H(()=>q(n,`+${U(r)-5} more`)),K(e,t)};J(a,e=>{U(r)>5&&e(o)}),F(t),K(e,t)};J(x,e=>{U(r)>0&&e(S)}),F(i),H(()=>{X(i,1,`group rounded-xl border transition-all overflow-hidden ${U(o)===U(n).id?`border-indigo-500/40 bg-indigo-500/10`:`border-black/8 dark:border-white/8 bg-black/4 dark:bg-white/4 hover:bg-black/6 dark:hover:bg-white/6 hover:border-black/14 dark:hover:border-white/14`}`),q(l,U(n).icon),q(f,`${U(n).name??``} `),q(_,`${U(r)??``} override${U(r)===1?``:`s`}`)}),W(`click`,y,()=>t.onApplyTheme(U(n).overrides)),W(`click`,b,()=>c(U(n).id)),K(e,i)}),K(e,r)};J(b,e=>{U(n).length===0?e(x):e(S,-1)}),F(y);var C=V(y,2),w=e=>{var n=Mm();W(`click`,n,function(...e){t.onResetAll?.apply(this,e)}),K(e,n)};J(C,e=>{U(i)>0&&e(w)}),F(l),H(()=>p.disabled=U(i)===0),W(`keydown`,f,e=>{e.key===`Enter`&&s()}),qi(f,()=>U(r),e=>R(r,e)),W(`click`,p,s),K(e,l),We()}Br([`keydown`,`click`]);var Fm=G(` Link copied!`,1),Im=G(` Copy shareable link`,1),Lm=G(`
Export
 
 
  
CSS output
 
 
 
 
 
 
  
Usage
 
Paste this CSS into your project after the SLASHED import.
 
`);function Rm(e,t){Ue(t,!0);let n=L(`layer`),r=L(!1),i=L(!1),a=I(()=>Cc(t.overrides,{mode:U(n),banner:!0})),o=I(()=>Object.keys(t.overrides).length);async function s(){try{await navigator.clipboard.writeText(U(a)),R(r,!0),setTimeout(()=>{R(r,!1)},2e3)}catch{}}async function c(){try{let e=Dc(t.overrides);await navigator.clipboard.writeText(e),R(i,!0),setTimeout(()=>{R(i,!1)},2e3)}catch{}}function l(){let e=new Blob([U(a)],{type:`text/css`}),t=URL.createObjectURL(e),n=document.createElement(`a`);n.href=t,n.download=`slashed-overrides.css`,n.click(),URL.revokeObjectURL(t)}function u(e){return e.includes(`color`)||e.includes(`scrim-color`)||e.includes(`shadow-color`)?`color`:e.includes(`duration`)||e.includes(`delay`)||e.includes(`transition-duration`)?`duration`:e.includes(`radius`)||e.includes(`space`)||e.includes(`size`)||e.includes(`width`)||e.includes(`height`)||e.includes(`gap`)||e.includes(`blur`)||e.includes(`text-`)||e.includes(`leading`)||e.includes(`tracking`)?`dimension`:e.includes(`font-family`)||e.includes(`font-mono`)||e.includes(`font-body`)||e.includes(`font-heading`)||e.includes(`font-code`)?`fontFamily`:e.includes(`font-weight`)||e.includes(`weight`)?`fontWeight`:`string`}function d(){let e={};for(let[n,r]of Object.entries(t.overrides)){let t=n.replace(/^--sf-/,``).replace(/-/g,`.`);e[t]={$value:r,$type:u(n)}}let n=JSON.stringify({$schema:`https://design-tokens.github.io/community-group/format/`,...e},null,2),r=new Blob([n],{type:`application/json`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=`slashed-tokens.w3c.json`,a.click(),URL.revokeObjectURL(i)}var f=Lm(),p=z(f),m=V(z(p),2),h=z(m,!0);F(m),F(p);var g=V(p,2),_=z(g),v=e=>{var t=Fm();va(B(t),{class:`w-3 h-3 text-emerald-600 dark:text-emerald-400`}),Me(2),K(e,t)},y=e=>{var t=Im();Ra(B(t),{class:`w-3 h-3`}),Me(),K(e,t)};J(_,e=>{U(i)?e(v):e(y,-1)}),F(g);var b=V(g,2),x=V(z(b),2),S=z(x),C=V(S,2);F(x),F(b);var w=V(b,2),T=z(w),E=z(T,!0);F(T);var D=V(T,2),O=z(D),k=z(O),A=e=>{va(e,{class:`w-3 h-3 text-emerald-600 dark:text-emerald-400`})},ee=e=>{Ea(e,{class:`w-3 h-3`})};J(k,e=>{U(r)?e(A):e(ee,-1)}),F(O);var te=V(O,2);Oa(z(te),{class:`w-3 h-3`}),F(te),F(D),F(w);var j=V(w,2);Oa(z(j),{class:`w-3 h-3`}),Me(),F(j);var ne=V(j,2),M=V(z(ne),4);M.textContent=`@import 'slashed/slashed.full.css';
+@import './slashed-overrides.css';`,F(ne),F(f),H(()=>{q(h,U(o)>0?`${U(o)} override${U(o)===1?``:`s`} ready to export.`:`No overrides yet. Customise tokens, then export.`),g.disabled=U(o)===0,X(S,1,`flex-1 py-1.5 rounded-md text-[11px] font-bold transition-all cursor-pointer ${U(n)===`layer`?`bg-indigo-600 text-white`:`text-slate-600 dark:text-slate-400 hover:text-slate-800 dark:hover:text-slate-200`}`),X(C,1,`flex-1 py-1.5 rounded-md text-[11px] font-bold transition-all cursor-pointer ${U(n)===`root`?`bg-indigo-600 text-white`:`text-slate-600 dark:text-slate-400 hover:text-slate-800 dark:hover:text-slate-200`}`),q(E,U(a)||`/* No overrides */`),j.disabled=U(o)===0}),W(`click`,g,c),W(`click`,S,()=>{R(n,`layer`)}),W(`click`,C,()=>{R(n,`root`)}),W(`click`,O,s),W(`click`,te,l),W(`click`,j,d),K(e,f),We()}Br([`click`]);var zm={_sync:{generatedBy:`configurator/scripts/sync-api.mjs`,source:`docs/api-index.json`},classes:[{name:`no-motion`,selector:`.no-motion`,kind:`accessibility`,category:`Accessibility`,group:`Reduced motion. Token override helps components that read`,description:`Suppresses all animations and transitions within the subtree. Apply to a container to create a reduced-motion zone without relying on the system preference.`,optional:!1,layer:`slashed.accessibility`},{name:`no-print`,selector:`.no-print`,kind:`print`,category:`Print`,group:`Print visibility utilities`,description:`Hides the element in @media print. Use on sidebars, navigation bars, and decorative elements that should not appear on paper.`,optional:!1,layer:`slashed.print`},{name:`print-color-exact`,selector:`.print-color-exact`,kind:`print`,category:`Print`,group:`Opt-in colour treatment`,description:`Forces exact color rendering in print (print-color-adjust: exact). Use on charts and colored badges that must preserve their fill colors in print.`,optional:!1,layer:`slashed.print`},{name:`print-no-color`,selector:`.print-no-color`,kind:`print`,category:`Print`,group:`Opt-in colour treatment`,description:`Strips color information in print (print-color-adjust: economy). Defers to the printer's ink-saving mode for backgrounds and non-critical color fills.`,optional:!1,layer:`slashed.print`},{name:`print-only`,selector:`.print-only`,kind:`print`,category:`Print`,group:`Print visibility utilities`,description:`Hides the element on screen (display: none) but shows it in @media print. Use for print-only headers, footers, and supplementary content not needed on screen.`,optional:!1,layer:`slashed.print`},{name:`sf-alternate`,selector:`.sf-alternate`,kind:`layout`,category:`Layout primitives`,group:`Alternate (zigzag / media-object)`,description:`Zigzag / alternating two-column layout. Even children align image-left/text-right; odd children flip. Collapses to a single column below the breakpoint.`,optional:!1,layer:`slashed.layout`},{name:`sf-aspect`,selector:`.sf-aspect`,kind:`macro`,category:`Macro classes`,group:`Aspect`,description:`Sets aspect-ratio from a --sf-aspect-ratio scoped token. Override the token inline to get any ratio without a new class.`,optional:!1,layer:`slashed.macros`},{name:`sf-bento`,selector:`.sf-bento`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Auto-fill bento grid for card dashboards. Children span 1 column by default; use span modifiers (sf-bento-wide, sf-bento-tall, sf-bento-full, sf-bento-featured) to break the grid.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--2`,selector:`.sf-bento--2`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with a 2-column base layout.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--3`,selector:`.sf-bento--3`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with a 3-column base layout.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--6`,selector:`.sf-bento--6`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with a 6-column base layout.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--compact`,selector:`.sf-bento--compact`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with shorter default row height.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento--tall`,selector:`.sf-bento--tall`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Bento grid variant with taller default row height.`,optional:!1,layer:`slashed.layout`},{name:`sf-bento-featured`,selector:`.sf-bento-featured`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Span modifier for a bento item: takes up 2×2 cells (featured hero placement).`,optional:!1,layer:`slashed.layout`},{name:`sf-bento-full`,selector:`.sf-bento-full`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Span modifier for a bento item: stretches across all columns (full-width banner).`,optional:!1,layer:`slashed.layout`},{name:`sf-bento-tall`,selector:`.sf-bento-tall`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Span modifier for a bento item: doubles the row height (tall card).`,optional:!1,layer:`slashed.layout`},{name:`sf-bento-wide`,selector:`.sf-bento-wide`,kind:`layout`,category:`Layout primitives`,group:`Bento grid`,description:`Span modifier for a bento item: spans 2 columns (wide card).`,optional:!1,layer:`slashed.layout`},{name:`sf-bg-layer`,selector:`.sf-bg-layer`,kind:`layout`,category:`Layout primitives`,group:``,description:`Background layer — absolutely-positioned cover media that sits behind a parent's content. The parent is auto-promoted to a positioned, isolated stacking context via :has(), so .sf-bg-layer composes natively under .sf-scrim (background → scrim gradient → content). Works as a bare  or as a wrapper with a nested > img / > video / > picture.`,optional:!1,layer:`slashed.layout`},{name:`sf-box`,selector:`.sf-box`,kind:`layout`,category:`Layout primitives`,group:`Box`,description:`Minimal padding container that applies --sf-component-pad on all sides. The simplest layout primitive for adding breathing room.`,optional:!1,layer:`slashed.layout`},{name:`sf-breakout`,selector:`.sf-breakout`,kind:`layout`,category:`Layout primitives`,group:`Content grid (breakout pattern)`,description:`Breaks a child element out of a parent sf-content-grid, spanning full bleed (or a named grid area) regardless of the parent column. Useful for full-width sections inside constrained prose.`,optional:!1,layer:`slashed.layout`},{name:`sf-btn`,selector:`.sf-btn`,kind:`component`,category:`Components`,group:`.sf-btn`,description:`Interactive call-to-action button. Apply to `),qm=G(` 
`,1),Jm=G(`
 
 `,1),Ym=G(`knob`),Xm=G(`advanced`),Zm=G(`
 
`),Qm=G(`
   
  
 
`),$m=G(`
Classes & Variables
  
 
 
`);function eh(e,t){Ue(t,!0);let n=zm.classes,r=Bm.tokens.filter(e=>e.tier===`PUBLIC`||e.tier===`PUBLIC-ADVANCED`),i=L(``),a=L(`classes`),o=L(``),s=I(()=>()=>{let e=U(i).trim().toLowerCase();return e?n.filter(t=>t.name.toLowerCase().includes(e)||t.selector?.toLowerCase().includes(e)||t.description?.toLowerCase().includes(e)||t.group?.toLowerCase().includes(e)):n}),c=I(()=>()=>{let e=U(i).trim().toLowerCase();return e?r.filter(t=>t.name.toLowerCase().includes(e)||t.description?.toLowerCase().includes(e)||t.group?.toLowerCase().includes(e)||t.value?.toLowerCase().includes(e)):r});function l(e){let t=new Map;for(let n of e){let e=n.category||`Other`,r=n.group||``;t.has(e)||t.set(e,new Map);let i=t.get(e);i.has(r)||i.set(r,[]),i.get(r).push(n)}return t}let u=I(()=>l(U(s)())),d=I(()=>l(U(c)())),f=null;async function p(e){try{await navigator.clipboard.writeText(e),R(o,e,!0),f&&clearTimeout(f),f=setTimeout(()=>{U(o)===e&&R(o,``),f=null},1500)}catch{}}let m={layout:`text-violet-600 dark:text-violet-400`,macro:`text-sky-600 dark:text-sky-400`,state:`text-amber-600 dark:text-amber-400`,accessibility:`text-emerald-600 dark:text-emerald-400`,motion:`text-pink-600 dark:text-pink-400`,print:`text-slate-600 dark:text-slate-400`,form:`text-orange-600 dark:text-orange-400`,component:`text-indigo-600 dark:text-indigo-400`,theme:`text-teal-600 dark:text-teal-400`};var g=$m(),_=z(g),v=V(z(_),2);zi(v);var y=V(v,2),b=z(y),x=z(b);F(b);var S=V(b,2),C=z(S);F(S),F(y),F(_);var w=V(_,2),T=z(w),E=e=>{var t=Xr(),n=B(t),r=e=>{var t=Vm(),n=z(t);F(t),H(()=>q(n,`No classes match "${U(i)??``}"`)),K(e,t)},a=I(()=>U(s)().length===0),c=e=>{var t=Xr();Y(B(t),17,()=>[...U(u).entries()],([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=Jm(),s=B(a),c=z(s),l=z(c,!0);F(c),F(s),Y(V(s,2),17,()=>[...i().entries()],([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=qm(),s=B(a),c=e=>{var t=Hm(),n=z(t,!0);F(t),H(()=>q(n,r())),K(e,t)};J(s,e=>{r()&&e(c)});var l=V(s,2);Y(l,21,i,e=>e.name,(e,t)=>{var n=Km(),r=z(n),i=z(r),a=z(i),s=z(a,!0);F(a);var c=V(a,2),l=e=>{var n=Um(),r=z(n,!0);F(n),H(()=>{X(n,1,`text-[8px] font-bold uppercase ${m[U(t).kind]??`text-slate-500`}`),q(r,U(t).kind)}),K(e,n)};J(c,e=>{U(t).kind&&e(l)});var u=V(c,2),d=e=>{K(e,Wm())};J(u,e=>{U(t).optional&&e(d)}),F(i);var f=V(i,2),h=e=>{var n=Gm(),r=z(n,!0);F(n),H(()=>q(r,U(t).description)),K(e,n)};J(f,e=>{U(t).description&&e(h)}),F(r);var g=V(r,2),_=z(g),v=e=>{va(e,{class:`w-3 h-3 text-emerald-600 dark:text-emerald-400`})},y=e=>{Ea(e,{class:`w-3 h-3 text-slate-500`})};J(_,e=>{U(o)===U(t).selector?e(v):e(y,-1)}),F(g),F(n),H(()=>q(s,U(t).selector)),W(`click`,g,()=>p(U(t).selector)),K(e,n)}),F(l),K(e,a)}),H(()=>q(l,r())),K(e,a)}),K(e,t)};J(n,e=>{U(a)?e(r):e(c,-1)}),K(e,t)},D=e=>{var t=Xr(),n=B(t),r=e=>{var t=Vm(),n=z(t);F(t),H(()=>q(n,`No tokens match "${U(i)??``}"`)),K(e,t)},a=I(()=>U(c)().length===0),s=e=>{var t=Xr();Y(B(t),17,()=>[...U(d).entries()],([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=Jm(),s=B(a),c=z(s),l=z(c,!0);F(c),F(s),Y(V(s,2),17,()=>[...i().entries()],([e,t])=>e,(e,t)=>{var n=I(()=>h(U(t),2));let r=()=>U(n)[0],i=()=>U(n)[1];var a=qm(),s=B(a),c=e=>{var t=Hm(),n=z(t,!0);F(t),H(()=>q(n,r())),K(e,t)};J(s,e=>{r()&&e(c)});var l=V(s,2);Y(l,21,i,e=>e.name,(e,t)=>{var n=Qm(),r=z(n),i=z(r),a=z(i),s=z(a,!0);F(a);var c=V(a,2),l=e=>{K(e,Ym())};J(c,e=>{U(t).role===`knob`&&e(l)});var u=V(c,2),d=e=>{K(e,Xm())};J(u,e=>{U(t).tier===`PUBLIC-ADVANCED`&&e(d)}),F(i);var f=V(i,2),m=e=>{var n=Zm(),r=z(n,!0);F(n),H(()=>q(r,U(t).value)),K(e,n)};J(f,e=>{U(t).value&&e(m)});var h=V(f,2),g=e=>{var n=Gm(),r=z(n,!0);F(n),H(()=>q(r,U(t).description)),K(e,n)};J(h,e=>{U(t).description&&e(g)}),F(r);var _=V(r,2),v=z(_),y=e=>{va(e,{class:`w-3 h-3 text-emerald-600 dark:text-emerald-400`})},b=e=>{Ea(e,{class:`w-3 h-3 text-slate-500`})};J(v,e=>{U(o)===`var(${U(t).name})`?e(y):e(b,-1)}),F(_),F(n),H(()=>q(s,U(t).name)),W(`click`,_,()=>p(`var(${U(t).name})`)),K(e,n)}),F(l),K(e,a)}),H(()=>q(l,r())),K(e,a)}),K(e,t)};J(n,e=>{U(a)?e(r):e(s,-1)}),K(e,t)};J(T,e=>{U(a)===`classes`?e(E):e(D,-1)}),F(w),F(g),H((e,t)=>{X(b,1,`flex-1 py-1.5 rounded text-[10px] font-bold transition-all cursor-pointer ${U(a)===`classes`?`bg-indigo-600/30 text-indigo-800 dark:text-indigo-200 border border-indigo-500/30`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(x,`CSS classes (${e??``})`),X(S,1,`flex-1 py-1.5 rounded text-[10px] font-bold transition-all cursor-pointer ${U(a)===`tokens`?`bg-indigo-600/30 text-indigo-800 dark:text-indigo-200 border border-indigo-500/30`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(C,`CSS vars (${t??``})`)},[()=>U(s)().length,()=>U(c)().length]),qi(v,()=>U(i),e=>R(i,e)),W(`click`,b,()=>{R(a,`classes`)}),W(`click`,S,()=>{R(a,`tokens`)}),K(e,g),We()}Br([`click`]);var th=G(`
`),nh=G(`
`),rh=G(`
 
`),ih=G(``),ah=G(` `),oh=G(``),sh=G(``),ch=G(`
  
 
 
  
`);function lh(e,t){Ue(t,!0);let n=L(!1);function r(e){let t=e.name;if(t.includes(`color`)||t.includes(`source`)||t.includes(`-bg`)||t.includes(`-border`))return`color`;if(t.includes(`font`)||t.includes(`family`))return`font`;let n=e.syntax?.toLowerCase()??``;return n.includes(`number`)||n.includes(`length`)||n.includes(`integer`)?`number`:`text`}let i=I(()=>t.overrideValue??t.token.value),a=I(()=>t.overrideValue!==void 0),o=I(()=>r(t.token)),s=I(()=>t.token.name.replace(`--sf-`,``));function c(e){return dl.value,_l(e)||_l(`var(${t.token.name})`)||e}let l=I(()=>U(o)===`color`?c(U(i)):``);var u=ch(),d=z(u),f=V(d,2),p=e=>{var t=th();let n;H(()=>n=Z(t,``,n,{background:U(l)})),K(e,t)},m=e=>{K(e,nh())};J(f,e=>{U(o)===`color`?e(p):e(m,-1)});var h=V(f,2),g=z(h),_=z(g,!0);F(g);var v=V(g,2),y=e=>{var n=rh(),r=z(n,!0);F(n),H(()=>q(r,t.token.description)),K(e,n)};J(v,e=>{t.token.description&&e(y)}),F(h);var b=V(h,2),x=e=>{var r=ih();zi(r),H(()=>Bi(r,U(i))),zr(`blur`,r,e=>{let r=e.target.value.trim();r&&r!==t.token.value?t.onSet(r):(!r||r===t.token.value)&&t.onReset(),R(n,!1)}),W(`keydown`,r,e=>{e.key===`Enter`&&e.currentTarget.blur(),e.key===`Escape`&&R(n,!1)}),K(e,r)},S=e=>{var t=oh(),r=z(t),o=e=>{var t=ah(),n=z(t,!0);F(t),H(()=>q(n,U(i))),K(e,t)},s=e=>{var t=Yr();H(()=>q(t,U(i))),K(e,t)};J(r,e=>{U(a)?e(o):e(s,-1)}),F(t),H(()=>Q(t,`title`,U(i))),W(`click`,t,()=>{R(n,!0)}),K(e,t)};J(b,e=>{U(n)?e(x):e(S,-1)});var C=V(b,2),w=e=>{var n=sh();W(`click`,n,function(...e){t.onReset?.apply(this,e)}),K(e,n)};J(C,e=>{U(a)&&e(w)}),F(u),H(()=>{X(u,1,`flex items-center gap-2 px-3 py-1.5 rounded-lg transition-colors group ${U(a)?`bg-indigo-500/8 border border-indigo-500/15`:`hover:bg-black/4 dark:hover:bg-white/4`}`),X(d,1,`w-1.5 h-1.5 rounded-full shrink-0 ${U(a)?`bg-indigo-500`:`bg-transparent`}`),Q(g,`title`,t.token.name),q(_,U(s))}),K(e,u),We()}Br([`keydown`,`click`]);var uh=G(` `),dh=G(`
No tokens found
`),fh=G(`
 
`),ph=G(`
 
`),mh=G(`
 
 
  
`);function hh(e,t){Ue(t,!0);let n=L(``),r=I(()=>()=>{let e=t.patterns??[t.domain];return t.tokens.filter(t=>e.some(e=>t.name.includes(e))&&t.tier!==`INTERNAL`)}),i=I(()=>()=>{if(!U(n))return U(r)();let e=U(n).toLowerCase();return U(r)().filter(t=>t.name.toLowerCase().includes(e)||t.description?.toLowerCase().includes(e))}),a=I(()=>U(i)().filter(e=>e.name in t.overrides).length);var o=mh(),s=z(o),c=z(s),l=z(c);F(c);var u=V(c,2),d=e=>{var t=uh(),n=z(t);F(t),H(()=>q(n,`${U(a)??``} modified`)),K(e,t)};J(u,e=>{U(a)>0&&e(d)}),F(s);var f=V(s,2);zi(f);var p=V(f,2),m=e=>{K(e,dh())},h=I(()=>U(i)().length===0),g=e=>{var n=ph(),r=z(n);Y(r,17,()=>U(i)().slice(0,60),e=>e.name,(e,n)=>{lh(e,{get token(){return U(n)},get overrideValue(){return t.overrides[U(n).name]},onSet:e=>t.onSet(U(n).name,e),onReset:()=>t.onReset(U(n).name)})});var a=V(r,2),o=e=>{var t=fh(),n=z(t);F(t),H(e=>q(n,`${e??``} more — refine your search`),[()=>U(i)().length-60]),K(e,t)},s=I(()=>U(i)().length>60);J(a,e=>{U(s)&&e(o)}),F(n),K(e,n)};J(p,e=>{U(h)?e(m):e(g,-1)}),F(o),H(()=>{q(l,`${t.domain??``} tokens`),Q(f,`placeholder`,`Search ${t.domain} tokens…`),Bi(f,U(n))}),W(`input`,f,e=>{R(n,e.target.value,!0)}),K(e,o),We()}Br([`input`]);var gh=G(`
`),_h=G(`
  
`),vh=G(`
 
`),yh=G(`
`),bh=G(`
`),xh=G(`
  
`),Sh=G(`
`),Ch=G(`
 
   
 
  
 
  
 
 
 
`);function wh(e,t){Ue(t,!0);let n={PUBLIC:0,"PUBLIC-ADVANCED":1,INTERNAL:2},r=L(``),i=L(!1),a=L(!1),o=I(()=>t.tokens.filter(e=>t.patterns.some(t=>e.name.includes(t))).sort((e,t)=>{let r=n[e.tier??`INTERNAL`]??2,i=n[t.tier??`INTERNAL`]??2;return r===i?e.name.localeCompare(t.name):r-i})),s=I(()=>()=>{let e=U(o);if(U(i)||(e=e.filter(e=>e.tier!==`INTERNAL`)),U(a)&&(e=e.filter(e=>e.name in t.overrides)),U(r)){let t=U(r).toLowerCase();e=e.filter(e=>e.name.toLowerCase().includes(t)||e.description?.toLowerCase().includes(t))}return e}),c=I(()=>U(o).filter(e=>e.name in t.overrides).length),l=I(()=>U(o).filter(e=>e.tier===`PUBLIC`).length),u=I(()=>U(o).filter(e=>e.tier===`PUBLIC-ADVANCED`).length),d=I(()=>U(o).filter(e=>e.tier===`INTERNAL`).length);var f=Ch(),p=z(f),m=z(p);zi(m);var h=V(m,2),g=z(h),_=z(g),v=z(_),y=e=>{K(e,gh())};J(v,e=>{U(a)&&e(y)}),F(_);var b=V(_);F(g);var x=V(g,2),S=z(x),C=z(S),w=e=>{K(e,gh())};J(C,e=>{U(i)&&e(w)}),F(S);var T=V(S);F(x);var E=V(x,2),D=z(E);F(E),F(h);var O=V(h,2),k=z(O),A=V(z(k),2),ee=z(A);F(A),F(k);var te=V(k,2),j=V(z(te),2),ne=z(j);F(j),F(te);var M=V(te,2),re=e=>{var t=_h(),n=V(z(t),2),r=z(n);F(n),F(t),H(()=>q(r,`Internal (${U(d)??``})`)),K(e,t)};J(M,e=>{U(i)&&e(re)}),F(O),F(p);var ie=V(p,4),ae=z(ie),oe=e=>{var t=vh(),n=z(t,!0);F(t),H(()=>q(n,U(a)?`No modified tokens in this domain`:`No tokens found`)),K(e,t)},se=I(()=>U(s)().length===0),N=e=>{var n=Sh();Y(n,21,()=>U(s)(),e=>e.name,(e,n)=>{var r=xh(),i=z(r),a=e=>{K(e,yh())};J(i,e=>{U(n).tier===`PUBLIC-ADVANCED`&&e(a)});var o=V(i,2),s=e=>{K(e,bh())};J(o,e=>{U(n).tier===`INTERNAL`&&e(s)}),lh(V(o,2),{get token(){return U(n)},get overrideValue(){return t.overrides[U(n).name]},onSet:e=>t.onSet(U(n).name,e),onReset:()=>t.onReset(U(n).name)}),F(r),K(e,r)}),F(n),K(e,n)};J(ae,e=>{U(se)?e(oe):e(N,-1)}),F(ie),F(f),H(e=>{Bi(m,U(r)),X(g,1,`flex items-center gap-1 text-[9px] font-bold transition-colors cursor-pointer ${U(a)?`text-indigo-600 dark:text-indigo-400`:`text-slate-400 dark:text-slate-600 hover:text-slate-600 dark:hover:text-slate-400`}`),X(_,1,`w-2.5 h-2.5 rounded border flex items-center justify-center transition-colors ${U(a)?`bg-indigo-600 border-indigo-500`:`border-black/20 dark:border-white/20`}`),q(b,` Modified only ${U(c)>0?`(${U(c)})`:``}`),Q(x,`aria-expanded`,U(i)),X(x,1,`flex items-center gap-1 text-[9px] font-bold transition-colors cursor-pointer ${U(i)?`text-amber-600 dark:text-amber-400`:`text-slate-400 dark:text-slate-600 hover:text-slate-600 dark:hover:text-slate-400`}`),X(S,1,`w-2.5 h-2.5 rounded border flex items-center justify-center transition-colors ${U(i)?`bg-amber-600 border-amber-500`:`border-black/20 dark:border-white/20`}`),q(T,` Internal (${U(d)??``})`),q(D,`${e??``}/${U(o).length??``}`),q(ee,`Public (${U(l)??``})`),q(ne,`Advanced (${U(u)??``})`)},[()=>U(s)().length]),W(`input`,m,e=>{R(r,e.target.value,!0)}),W(`click`,g,()=>{R(a,!U(a))}),W(`click`,x,()=>{R(i,!U(i))}),K(e,f),We()}Br([`input`,`click`]);var Th=G(``),Eh=G(`
    
 
       
`),Dh=G(`
Waiting for live preview…
`),Oh=G(``),kh=G(`
Pick an editable brand/status (base) color as the foreground to enable auto-fix.
`),Ah=G(`
 
`),jh=G(`
 
 
 
 
 
`),Mh=G(`
 
`),Nh=G(`
Foreground
 
  
Background
 
 
Aa Bb Cc
 
 
Auto-fix to pass   
 
`,1),Ph=G(` `),Fh=G(``),Ih=G(`·`),Lh=G(` `),Rh=G(`
Foreground (rows) × background (cols). Click a cell to load it above.
 
`,1),zh=G(`
Contrast checker
 
Live WCAG ratios computed from the actual rendered preview colors — including derived steps and your overrides.
 
 
 
 
 
`);function Bh(e,t){Ue(t,!0);let n=I(()=>qo.value===`dark`?`#16161e`:`#ffffff`),r=[{label:`Text`,expr:`var(--sf-color-text)`},{label:`Text secondary`,expr:`var(--sf-color-text--secondary)`},{label:`Text muted`,expr:`var(--sf-color-text--muted)`},{label:`White`,expr:`#ffffff`},{label:`Black`,expr:`#000000`}],i=[{label:`Surface`,expr:`var(--sf-color-surface)`},{label:`Bg`,expr:`var(--sf-color-bg)`},{label:`Border`,expr:`var(--sf-color-border)`}],a=[{key:`primary`,srcLight:`--sf-color-primary-source-light`,defLight:`oklch(0.47 0.27 264)`,srcDark:`--sf-color-primary-source-dark`,defDark:`oklch(0.715 0.243 264)`},{key:`secondary`,srcLight:`--sf-color-secondary-source-light`,defLight:`oklch(0.22 0.04 264)`,srcDark:`--sf-color-secondary-source-dark`,defDark:`oklch(0.84 0.036 264)`},{key:`tertiary`,srcLight:`--sf-color-tertiary-source-light`,defLight:`oklch(0.42 0.22 295)`,srcDark:`--sf-color-tertiary-source-dark`,defDark:`oklch(0.74 0.198 295)`},{key:`action`,srcLight:`--sf-color-action-source-light`,defLight:`oklch(0.50 0.22 235)`,srcDark:`--sf-color-action-source-dark`,defDark:`oklch(0.70 0.198 235)`},{key:`neutral`,srcLight:`--sf-color-neutral-source-light`,defLight:`oklch(0.52 0.025 260)`,srcDark:`--sf-color-neutral-source-dark`,defDark:`oklch(0.69 0.0225 260)`},{key:`success`,srcLight:`--sf-color-success-source-light`,defLight:`oklch(0.50 0.16 145)`,srcDark:`--sf-color-success-source-dark`,defDark:`oklch(0.70 0.144 145)`},{key:`warning`,srcLight:`--sf-color-warning-source-light`,defLight:`oklch(0.75 0.17 80)`,srcDark:`--sf-color-warning-source-dark`,defDark:`oklch(0.65 0.153 80)`},{key:`danger`,srcLight:`--sf-color-danger-source-light`,defLight:`oklch(0.48 0.22 12)`,srcDark:`--sf-color-danger-source-dark`,defDark:`oklch(0.71 0.198 12)`},{key:`info`,srcLight:`--sf-color-info-source-light`,defLight:`oklch(0.48 0.18 235)`,srcDark:`--sf-color-info-source-dark`,defDark:`oklch(0.71 0.162 235)`}],o=a.flatMap(e=>[{label:`${e.key} (base)`,expr:`var(--sf-color-${e.key})`,editKey:e.key},{label:`${e.key}-100`,expr:`var(--sf-color-${e.key}-100)`},{label:`${e.key}-600`,expr:`var(--sf-color-${e.key}-600)`},{label:`${e.key}-900`,expr:`var(--sf-color-${e.key}-900)`}]),s=[...r,...i,...o],c=Object.fromEntries(a.map(e=>[e.key,e])),l=[{label:`text`,expr:`var(--sf-color-text)`},{label:`white`,expr:`#ffffff`},{label:`black`,expr:`#000000`},{label:`primary`,expr:`var(--sf-color-primary)`,editKey:`primary`}],u=[{label:`surface`,expr:`var(--sf-color-surface)`},{label:`primary`,expr:`var(--sf-color-primary)`},{label:`neutral-100`,expr:`var(--sf-color-neutral-100)`},{label:`success`,expr:`var(--sf-color-success)`},{label:`warning`,expr:`var(--sf-color-warning)`},{label:`danger`,expr:`var(--sf-color-danger)`}],d=L(`White`),f=L(`primary (base)`),p=L(`AA`),m=I(()=>s.find(e=>e.label===U(d))??s[0]),h=I(()=>s.find(e=>e.label===U(f))??s[0]);function g(e,t){dl.value;let n=xl(e),r=xl(t);return!n||!r?null:Yl(Jl(...n),Jl(...r))}function _(e){return e>=7?{tag:`AAA`,cls:`bg-emerald-500/25 text-emerald-800 dark:text-emerald-200`}:e>=4.5?{tag:`AA`,cls:`bg-emerald-500/15 text-emerald-700 dark:text-emerald-300`}:e>=3?{tag:`AA-L`,cls:`bg-amber-500/20 text-amber-700 dark:text-amber-300`}:{tag:`Fail`,cls:`bg-rose-500/20 text-rose-700 dark:text-rose-300`}}let v=I(()=>g(U(m).expr,U(h).expr));function y(){let e=U(d);R(d,U(f),!0),R(f,e,!0)}function b(e,t){let n=s.find(t=>t.expr===e),r=s.find(e=>e.expr===t);n&&R(d,n.label,!0),r&&R(f,r.label,!0)}function x(e){return dl.value,_l(e)||e}let S=L(!1),C=L(!1),w=L(null);function T(){R(w,null);let e=U(m).editKey?c[U(m).editKey]:null;if(!e)return;let n=ml()===`dark`,r=n?e.srcDark:e.srcLight,i=n?e.defDark:e.defLight,{c:a,h:o,l:s,valid:l}=Xl(t.overrides[r]??i);if(!l)return;let u=xl(U(h).expr);if(!u)return;let d=Jl(...u),f=U(p)===`AAA`?7:4.5,g=null;for(let e=0;e<=1.0001;e+=.005){let[t,n,r]=ql(e,a,o);Yl(Jl(t,n,r),d)>=f&&(g===null||Math.abs(e-s){if(!U(S)){R(w,null);return}dl.value,U(d),U(f),U(p),U(m).editKey&&U(v)!==null&&U(v)<(U(p)===`AAA`?7:4.5)?T():R(w,null)});var D=zh(),O=V(z(D),2),k=z(O),A=V(z(k),2),ee=z(A,!0);F(A),F(k);var te=V(k,2),j=e=>{var t=Nh(),r=B(t),i=z(r),a=V(z(i),2);Y(a,21,()=>s,e=>e.label,(e,t)=>{var r=Th(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).label)&&(r.value=(r.__value=U(t).label)??``)}),K(e,r)}),F(a),F(i);var o=V(i,2),c=V(o,2),l=V(z(c),2);Y(l,21,()=>s,e=>e.label,(e,t)=>{var r=Th(),i=z(r,!0);F(r);var a={};H(()=>{Z(r,`background:${U(n)};`),q(i,U(t).label),a!==(a=U(t).label)&&(r.value=(r.__value=U(t).label)??``)}),K(e,r)}),F(l),F(c),F(r);var u=V(r,2),g=z(u),b=z(g);F(g);var S=V(g,2),C=e=>{let t=I(()=>_(U(v)));var n=Eh(),r=z(n),i=z(r);F(r);var a=V(r,2),o=z(a,!0);F(a);var s=V(a,4),c=z(s),l=z(c);F(c);var u=V(c,2),d=z(u);F(u);var f=V(u,2),p=z(f);F(f);var m=V(f,2),h=z(m);F(m),F(s),F(n),H(e=>{q(i,`${e??``}:1`),X(a,1,`text-[10px] font-bold px-2 py-0.5 rounded ${U(t).cls}`),q(o,U(t).tag),X(c,1,yi(U(v)>=4.5?`text-emerald-700 dark:text-emerald-300`:`text-rose-700 dark:text-rose-300`)),q(l,`${U(v)>=4.5?`✓`:`✗`} AA normal`),X(u,1,yi(U(v)>=3?`text-emerald-700 dark:text-emerald-300`:`text-rose-700 dark:text-rose-300`)),q(d,`${U(v)>=3?`✓`:`✗`} AA large`),X(f,1,yi(U(v)>=7?`text-emerald-700 dark:text-emerald-300`:`text-rose-700 dark:text-rose-300`)),q(p,`${U(v)>=7?`✓`:`✗`} AAA normal`),X(m,1,yi(U(v)>=4.5?`text-emerald-700 dark:text-emerald-300`:`text-rose-700 dark:text-rose-300`)),q(h,`${U(v)>=4.5?`✓`:`✗`} AAA large`)},[()=>U(v).toFixed(2)]),K(e,n)},T=e=>{K(e,Dh())};J(S,e=>{U(v)===null?e(T,-1):e(C)}),F(u);var D=V(u,2),O=z(D),k=z(O),A=V(z(k)),ee=z(A);F(A),F(k);var te=V(k,2);Y(te,20,()=>[`AA`,`AAA`],e=>e,(e,t)=>{var n=Oh(),r=z(n,!0);F(n),H(()=>{X(n,1,`px-2 py-0.5 rounded-md text-[10px] font-bold cursor-pointer ${U(p)===t?`bg-black/12 dark:bg-white/12 text-slate-900 dark:text-white`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(r,t)}),W(`click`,n,()=>{R(p,t,!0)}),K(e,n)}),F(te),F(O);var j=V(O,2),ne=e=>{K(e,kh())},M=e=>{var t=Ah(),n=z(t);F(t),H(()=>q(n,`Already passes ${U(p)??``}. 🎉`)),K(e,t)},re=e=>{var t=jh(),n=z(t),r=V(n,2),i=z(r),a=z(i,!0);F(i);var o=V(i,2),s=z(o);F(o),F(r);var c=V(r,2);F(t),H((e,t)=>{Z(n,e),q(a,U(w).value),q(s,`→ ${t??``}:1 (${U(p)??``} ✓)`)},[()=>`background:${x(U(w).value)}`,()=>U(w).ratio.toFixed(2)]),W(`click`,c,E),K(e,t)},ie=e=>{var t=Mh(),n=z(t);F(t),H(()=>q(n,`No lightness of this hue reaches ${U(p)??``} on this background — try a different background or hue.`)),K(e,t)};J(j,e=>{U(m).editKey?U(v)!==null&&U(v)>=(U(p)===`AAA`?7:4.5)?e(M,1):U(w)?e(re,2):e(ie,-1):e(ne)}),F(D),H((e,t,n)=>{Z(g,e),Z(b,t),q(ee,`(for ${n??``} mode)`)},[()=>`background:${x(U(h).expr)}`,()=>`color:${x(U(m).expr)}`,()=>ml()]),Oi(a,()=>U(d),e=>R(d,e)),W(`click`,o,y),Oi(l,()=>U(f),e=>R(f,e)),K(e,t)};J(te,e=>{U(S)&&e(j)}),F(O);var ne=V(O,4),M=z(ne),re=V(z(M),2),ie=z(re,!0);F(re),F(M);var ae=V(M,2),oe=e=>{var t=Rh(),n=V(B(t),2),r=z(n),i=z(r),a=z(i);Y(V(z(a)),17,()=>u,e=>e.label,(e,t)=>{var n=Ph(),r=z(n,!0);F(n),H(()=>q(r,U(t).label)),K(e,n)}),F(a),F(i);var o=V(i);Y(o,21,()=>l,e=>e.label,(e,t)=>{var n=Lh(),r=z(n),i=z(r,!0);F(r),Y(V(r),17,()=>u,e=>e.label,(e,n)=>{let r=I(()=>g(U(t).expr,U(n).expr));var i=Xr(),a=B(i),o=e=>{let i=I(()=>_(U(r)));var a=Fh(),o=z(a),s=z(o,!0);F(o),F(a),H((e,t)=>{Q(o,`title`,e),X(o,1,`w-full px-1.5 py-1 rounded font-mono font-bold cursor-pointer ${U(i).cls}`),q(s,t)},[()=>`${U(t).label} on ${U(n).label} — ${U(r).toFixed(2)}:1`,()=>U(r).toFixed(1)]),W(`click`,o,()=>b(U(t).expr,U(n).expr)),K(e,a)},s=e=>{K(e,Ih())};J(a,e=>{U(r)===null?e(s,-1):e(o)}),K(e,i)}),F(n),H(()=>q(i,U(t).label)),K(e,n)}),F(o),F(r),F(n),K(e,t)};J(ae,e=>{U(C)&&e(oe)}),F(ne),F(D),H(()=>{Q(k,`aria-expanded`,U(S)),q(ee,U(S)?`▲`:`▼`),Q(M,`aria-expanded`,U(C)),q(ie,U(C)?`▲`:`▼`)}),W(`click`,k,()=>{R(S,!U(S))}),W(`click`,M,()=>{R(C,!U(C))}),K(e,D),We()}Br([`click`]);var Vh=G(`
`),Hh=G(` `),Uh=G(`
 
 
 
`);function Wh(e,t){Ue(t,!0);let n=new Set([`home`,`themes`,`wcag`,`setup`,`cheatsheet`]),r=L(`controls`);On(()=>{t.domain,R(r,`controls`)});let i=I(()=>Pl[t.domain]??[t.domain]),a=I(()=>t.tokens.filter(e=>Fl(e.name)===t.domain&&e.name in t.overrides).length);var o=Xr(),s=B(o),c=e=>{var n=Xr(),r=B(n),i=e=>{Gl(e,{get overrides(){return t.overrides},get onSelect(){return t.onSelectDomain},get onApplyTheme(){return t.onApplyTheme},get onResetAll(){return t.onResetAll}})},a=e=>{Pm(e,{get overrides(){return t.overrides},get onApplyTheme(){return t.onApplyTheme},get onResetAll(){return t.onResetAll}})},o=e=>{Bh(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onBulkChange(){return t.onBulkChange}})},s=e=>{Rm(e,{get overrides(){return t.overrides}})},c=e=>{eh(e,{})};J(r,e=>{t.domain===`home`?e(i):t.domain===`themes`?e(a,1):t.domain===`wcag`?e(o,2):t.domain===`setup`?e(s,3):t.domain===`cheatsheet`&&e(c,4)}),K(e,n)},l=I(()=>n.has(t.domain)),u=e=>{var n=Uh(),o=z(n),s=z(o),c=e=>{var n=Vh(),r=z(n),i=e=>{md(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange},get onSelectDomain(){return t.onSelectDomain}})},a=e=>{nf(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange}})},o=e=>{hf(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},s=e=>{Ff(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange}})},c=e=>{Zf(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},l=e=>{ap(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},u=e=>{xp(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange}})},d=e=>{Ip(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},f=e=>{Zp(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},p=e=>{bm(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset},get onBulkChange(){return t.onBulkChange}})},m=e=>{Tm(e,{get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})},h=e=>{hh(e,{get domain(){return t.domain},get tokens(){return t.tokens},get overrides(){return t.overrides},get onSet(){return t.onSet},get onReset(){return t.onReset}})};J(r,e=>{t.domain===`colors`?e(i):t.domain===`typography`?e(a,1):t.domain===`spacing`?e(o,2):t.domain===`layout`?e(s,3):t.domain===`borders`?e(c,4):t.domain===`shadows`?e(l,5):t.domain===`motion`?e(u,6):t.domain===`effects`?e(d,7):t.domain===`macros`?e(f,8):t.domain===`misc`?e(p,9):t.domain===`components`?e(m,10):e(h,-1)}),F(n),K(e,n)},l=e=>{wh(e,{get tokens(){return t.tokens},get overrides(){return t.overrides},get patterns(){return U(i)},get onSet(){return t.onSet},get onReset(){return t.onReset}})};J(s,e=>{U(r)===`controls`?e(c):e(l,-1)}),F(o);var u=V(o,2),d=z(u);po(z(d),{class:`w-3 h-3`}),Me(),F(d);var f=V(d,4),p=z(f);Ba(p,{class:`w-3 h-3`});var m=V(p,2),h=e=>{var t=Hh(),n=z(t,!0);F(t),H(()=>q(n,U(a))),K(e,t)};J(m,e=>{U(a)>0&&e(h)}),F(f),F(u),F(n),H(()=>{X(d,1,`flex-1 flex items-center justify-center gap-1.5 py-2 text-[10px] font-bold transition-all cursor-pointer ${U(r)===`controls`?`text-indigo-700 dark:text-indigo-300 bg-indigo-600/10 border-t-2 border-t-indigo-500 -mt-px`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),X(f,1,`flex-1 flex items-center justify-center gap-1.5 py-2 text-[10px] font-bold transition-all cursor-pointer ${U(r)===`tokens`?`text-indigo-700 dark:text-indigo-300 bg-indigo-600/10 border-t-2 border-t-indigo-500 -mt-px`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`)}),W(`click`,d,()=>{R(r,`controls`)}),W(`click`,f,()=>{R(r,`tokens`)}),K(e,n)};J(s,e=>{U(l)?e(c):e(u,-1)}),K(e,o),We()}Br([`click`]);var Gh=G(`
 
`),Kh=G(`
Type to search tokens by name or description
`),qh=G(`overridden`),Jh=G(`
 
`),Yh=G(``),Xh=G(`
↑↓ navigate ↵ open panel Esc close
`),Zh=G(``);function Qh(e,t){Ue(t,!0);let n=L(``),r=L(0),i=L(null),a={colors:`Colors`,typography:`Typography`,spacing:`Spacing`,layout:`Layout`,borders:`Borders`,shadows:`Shadows`,motion:`Motion`,effects:`Effects`,macros:`Macros`,misc:`Misc`,components:`Components`},o=I(()=>(()=>{let e=U(n).trim().toLowerCase();if(!e)return[];let r=[];for(let n of t.tokens){if(n.tier===`INTERNAL`)continue;let i=n.name.toLowerCase().includes(e),a=n.description?.toLowerCase().includes(e)??!1;if((i||a)&&(r.push({token:n,domain:Fl(n.name),overridden:n.name in t.overrides}),r.length>=40))break}return r})());On(()=>{U(n),R(r,0)}),On(()=>{U(i)&&U(i).focus()});function s(e){t.onNavigate(e),t.onClose()}function c(e){if(e.key===`Escape`){e.preventDefault(),t.onClose();return}if(U(o).length===0&&(e.key===`ArrowDown`||e.key===`ArrowUp`)){e.preventDefault(),R(r,0);return}if(e.key===`ArrowDown`){e.preventDefault(),R(r,Math.min(U(r)+1,U(o).length-1),!0);return}if(e.key===`ArrowUp`){e.preventDefault(),R(r,Math.max(U(r)-1,0),!0);return}e.key===`Enter`&&U(o)[U(r)]&&(e.preventDefault(),s(U(o)[U(r)].domain))}var l=Zh(),u=z(l),d=z(u),f=V(z(d),2);zi(f),Qi(f,e=>R(i,e),()=>U(i)),Me(2),F(d);var p=V(d,2),m=z(p),h=e=>{var t=Gh(),r=z(t);F(t),H(()=>q(r,`No tokens matching "${U(n)??``}"`)),K(e,t)},g=I(()=>U(n).trim()&&U(o).length===0),_=e=>{K(e,Kh())},v=I(()=>!U(n).trim()),y=e=>{var n=Xr();Y(B(n),19,()=>U(o),e=>e.token.name,(e,n,i)=>{var o=Yh(),c=z(o),l=z(c),u=z(l),d=z(u,!0);F(u);var f=V(u,2),p=e=>{K(e,qh())};J(f,e=>{U(n).overridden&&e(p)}),F(l);var m=V(l,2),h=e=>{var t=Jh(),r=z(t,!0);F(t),H(()=>q(r,U(n).token.description)),K(e,t)};J(m,e=>{U(n).token.description&&e(h)}),F(c);var g=V(c,2),_=z(g),v=z(_,!0);F(_);var y=V(_,2),b=z(y,!0);F(y),F(g),F(o),H(()=>{X(o,1,`w-full flex items-center gap-3 px-4 py-2.5 text-left transition-colors cursor-pointer ${U(r)===U(i)?`bg-indigo-500/15`:`hover:bg-black/4 dark:hover:bg-white/4`}`),q(d,U(n).token.name),q(v,U(n).overridden?t.overrides[U(n).token.name]:U(n).token.value),q(b,a[U(n).domain]??U(n).domain)}),zr(`mouseenter`,o,()=>{R(r,U(i),!0)}),W(`click`,o,()=>s(U(n).domain)),K(e,o)}),K(e,n)};J(m,e=>{U(g)?e(h):U(v)?e(_,1):e(y,-1)}),F(p);var b=V(p,2),x=e=>{K(e,Xh())};J(b,e=>{U(o).length>0&&e(x)}),F(u),F(l),W(`mousedown`,l,e=>{e.target===e.currentTarget&&t.onClose()}),W(`keydown`,f,c),qi(f,()=>U(n),e=>R(n,e)),K(e,l),We()}Br([`mousedown`,`keydown`,`click`]);var $h=G(` `),eg=G(``),tg=G(``),ng=G(`
 
 
 
 
  
 
 
  
`);function rg(e,t){Ue(t,!0);let n=(e,t=f,n=f,r=f)=>{var i=eg(),a=z(i);mi(a,n,(e,t)=>{t(e,{class:`w-3.5 h-3.5`})});var o=V(a),s=V(o),c=e=>{var t=$h(),n=z(t,!0);F(t),H(()=>q(n,U(v)>9?`9+`:U(v))),K(e,t)};J(s,e=>{t()===`preview`&&U(v)>0&&e(c)}),F(i),H(()=>{Q(i,`aria-pressed`,U(p)===t()),X(i,1,`flex-1 flex items-center justify-center gap-1.5 py-2.5 text-[11px] font-bold transition-colors cursor-pointer ${U(p)===t()?`text-indigo-700 dark:text-indigo-300 bg-indigo-500/10`:`text-slate-500 hover:text-slate-700 dark:hover:text-slate-300`}`),q(o,` ${r()??``} `)}),W(`click`,i,()=>{R(p,t(),!0)}),K(e,i)},r=Bm.tokens??Bm,i={home:`Home`,colors:`Colors`,typography:`Typography`,spacing:`Spacing`,layout:`Layout`,borders:`Borders`,shadows:`Shadows`,motion:`Motion`,effects:`Effects`,macros:`Macros`,misc:`Misc`,components:`Components`,themes:`Themes`,wcag:`WCAG`,setup:`Install`,cheatsheet:`Classes`};function a(e){let t={};for(let n of Object.keys(e)){let e=Fl(n);t[e]=(t[e]??0)+1}return t}let o=Zc(),s=L(nn(Qc())),c=L(nn([])),l=L(nn([])),u=L(`home`),d=L(!1),p=L(`controls`),m=L(`light`),h=L(`fluid`),g=L(`normal`),_=L(`marketing`),v=I(()=>Object.keys(U(s)).length),y=I(()=>a(U(s))),b=I(()=>Object.keys(U(s)).filter(e=>Fl(e)===U(u))),x=I(()=>U(b).length),S=I(()=>U(c).length>0),C=I(()=>U(l).length>0);function w(e,t){let n=Object.keys(e);return n.length===Object.keys(t).length?n.every(n=>e[n]===t[n]):!1}let T=L(nn(Cr(()=>({...U(s)})))),E=L(`idle`),D=I(()=>!w(U(s),U(T))),O=null;On(()=>{$c(U(s))});function k(e){let t=U(s),n=typeof e==`function`?e(t):e;w(t,n)||(R(c,[...U(c).slice(-49),t],!0),R(l,[],!0),(U(E)===`saved`||U(E)===`error`)&&R(E,`idle`)),R(s,n,!0)}async function A(){if(!U(D)||U(E)===`saving`)return;let e={...U(s)};R(E,`saving`);try{await nl(U(s)),w(U(s),e)?(R(T,e,!0),R(E,`saved`),O&&clearTimeout(O),O=setTimeout(()=>{U(E)===`saved`&&R(E,`idle`),O=null},2e3)):R(E,`idle`)}catch(e){console.warn(`slashed: save failed`,e),R(E,`error`)}}function ee(e,t){k(n=>({...n,[e]:t}))}function te(e){k(t=>{let n={...t};return delete n[e],n})}function j(e){k(t=>{let n={...t};for(let[t,r]of Object.entries(e))r===null?delete n[t]:n[t]=r;return n})}function ne(e){k({...e})}function M(){k({})}function re(){let e={};for(let t of U(b))e[t]=null;j(e)}function ie(){if(U(c).length===0)return;let e=U(c)[U(c).length-1],t=U(s);R(c,U(c).slice(0,-1),!0),R(l,[t,...U(l)],!0),R(s,e,!0)}function ae(){if(U(l).length===0)return;let e=U(l)[0],t=U(s);R(l,U(l).slice(1),!0),R(c,[...U(c),t],!0),R(s,e,!0)}function oe(){let e=document.createElement(`input`);e.type=`file`,e.accept=`.css,.json`,e.onchange=e=>{let t=e.target.files?.[0];if(!t)return;let n=new FileReader;n.onload=e=>{let n=e.target?.result;if(n)if(t.name.endsWith(`.json`))try{let e=JSON.parse(n);if(typeof e==`object`&&e&&!Array.isArray(e)){let t=Object.fromEntries(Object.entries(e).filter(([e,t])=>typeof t==`string`&&/^--sf-[\w-]+$/.test(e)));Object.keys(t).length>0&&k(t)}}catch{}else{let e={},t=/(--sf-[\w-]+)\s*:\s*([^;]+);/g,r;for(;(r=t.exec(n))!==null;)e[r[1].trim()]=r[2].trim();Object.keys(e).length>0&&k(t=>({...t,...e}))}},n.readAsText(t)},e.click()}function se(){let e=Cc(U(s),{mode:`layer`,banner:!0}),t=new Blob([e],{type:`text/css`}),n=URL.createObjectURL(t),r=document.createElement(`a`);r.href=n,r.download=`slashed-overrides.css`,r.click(),URL.revokeObjectURL(n)}ia(()=>{let e=e=>{(e.ctrlKey||e.metaKey)&&!e.shiftKey&&e.key===`z`&&(e.preventDefault(),ie()),(e.ctrlKey||e.metaKey)&&(e.shiftKey&&e.key===`z`||e.key===`y`)&&(e.preventDefault(),ae()),(e.ctrlKey||e.metaKey)&&!e.shiftKey&&e.key.toLowerCase()===`s`&&(e.preventDefault(),A()),(e.ctrlKey||e.metaKey)&&!e.repeat&&e.key.toLowerCase()===`k`&&(e.preventDefault(),R(d,!U(d)))};return window.addEventListener(`keydown`,e),()=>{window.removeEventListener(`keydown`,e),O&&clearTimeout(O)}});var N=ng(),ce=z(N);ss(ce,{get overridesCount(){return U(v)},get canUndo(){return U(S)},get canRedo(){return U(C)},get hasPendingChanges(){return U(D)},get saveState(){return U(E)},onUndo:ie,onRedo:ae,onResetAll:M,onImport:oe,onExport:se,onSave:A});var le=V(ce,2),ue=z(le);n(ue,()=>`controls`,()=>po,()=>`Controls`),n(V(ue,2),()=>`preview`,()=>Ma,()=>`Preview`),F(le);var de=V(le,2),fe=z(de);ds(z(fe),{get activeId(){return U(u)},onSelect:e=>{R(u,e,!0)},get overridesByDomain(){return U(y)}}),F(fe);var pe=V(fe,2),me=z(pe),he=z(me),ge=z(he,!0);F(he);var _e=V(he,2),ve=e=>{var t=tg(),n=z(t);no(n,{class:`w-3 h-3`});var r=V(n);F(t),H(()=>{Q(t,`title`,`Reset ${U(x)} override${U(x)===1?``:`s`} in ${i[U(u)]??U(u)}`),q(r,` Reset ${U(x)??``}`)}),W(`click`,t,re),K(e,t)};J(_e,e=>{U(x)>0&&e(ve)}),F(me);var ye=V(me,2);Wh(z(ye),{get domain(){return U(u)},get tokens(){return r},get overrides(){return U(s)},onSet:ee,onReset:te,onBulkChange:j,onApplyTheme:ne,onSelectDomain:e=>{R(u,e,!0)},onResetAll:M}),F(ye),F(pe);var be=V(pe,2);Nl(z(be),{get overrides(){return U(s)},get previewTheme(){return U(m)},get previewWidth(){return U(h)},get previewMotion(){return U(g)},get previewTemplate(){return U(_)},onThemeChange:e=>{R(m,e,!0)},onWidthChange:e=>{R(h,e,!0)},onMotionChange:e=>{R(g,e,!0)},onTemplateChange:e=>{R(_,e,!0)}}),F(be),F(de);var xe=V(de,2);{let e=I(()=>i[U(u)]??U(u));ms(xe,{get overridesCount(){return U(v)},get domain(){return U(e)}})}var Se=V(xe,2),Ce=e=>{Qh(e,{get tokens(){return r},get overrides(){return U(s)},onNavigate:e=>{R(u,e,!0)},onClose:()=>{R(d,!1)}})};J(Se,e=>{U(d)&&e(Ce)}),F(N),H(()=>{X(N,1,`${o?`w-full h-full`:`w-screen h-screen`} flex flex-col overflow-hidden bg-slate-50 dark:bg-[#0a0a0f] text-slate-800 dark:text-slate-200 font-sans`),X(fe,1,`shrink-0 ${U(p)===`preview`?`hidden md:flex`:`flex`}`),X(pe,1,`flex-1 min-w-0 md:flex-none md:w-[360px] bg-slate-50 dark:bg-[#0c0c15] border-r border-black/8 dark:border-white/8 flex-col min-h-0 ${U(p)===`preview`?`hidden md:flex`:`flex`}`),q(ge,i[U(u)]??U(u)),X(be,1,`flex-1 flex-col min-h-0 min-w-0 ${U(p)===`controls`?`hidden md:flex`:`flex`}`)}),K(e,N),We()}Br([`click`]);var ig=document.getElementById(`app`)??document.getElementById(`slashed-admin-app`);ig&&(ig.innerHTML=``,Xo(ig),Zr(rg,{target:ig}));var ag=G(``),og=G(` `),sg=G(``),cg=G(` 
/
 SLASHED    
    
    
 
 
 
 
 
  
`,1);function lg(e,t){Ue(t,!0);let n=Bm.tokens??Bm,r=`slashed-overlay/open`,i=`slashed-overlay/domain`,a={home:`Home`,colors:`Colors`,typography:`Typography`,spacing:`Spacing`,layout:`Layout`,borders:`Borders`,shadows:`Shadows`,motion:`Motion`,effects:`Effects`,macros:`Macros`,misc:`Misc`,themes:`Themes`,wcag:`WCAG`,setup:`Install`,cheatsheet:`Classes`};function o(e){let t={};for(let n of Object.keys(e)){let e=Fl(n);t[e]=(t[e]??0)+1}return t}function s(e,t){try{let n=localStorage.getItem(e);return n===null?t:n!==`false`}catch{return t}}function c(e,t){try{return localStorage.getItem(e)??t}catch{return t}}let l=L(nn(s(r,!0))),u=L(nn(typeof window<`u`?window.matchMedia(`(max-width: 768px)`).matches:!1)),d=L(nn(Qc())),f=L(nn([])),p=L(nn([])),m=L(nn(c(i,`home`))),h=L(!1),g=L(!1),_=L(null),v=L(null);On(()=>{U(g)&&br().then(()=>U(_)?.focus())});let y=I(()=>Object.keys(U(d)).length),b=I(()=>o(U(d))),x=I(()=>U(f).length>0),S=I(()=>U(p).length>0);function C(e,t){let n=Object.keys(e);return n.length===Object.keys(t).length?n.every(n=>e[n]===t[n]):!1}let w=L(nn(Cr(()=>({...U(d)})))),T=L(`idle`),E=I(()=>!C(U(d),U(w))),D=null;function O(){let e=document.getElementById(`slashed-frontend-overlay`);if(!e)return;let t=`var(--wp-admin--admin-bar--height, 32px)`;e.style.position=`fixed`,e.style.right=`0`,e.style.zIndex=`99998`,e.style.pointerEvents=`auto`,U(l)?(e.style.top=t,e.style.width=U(u)?`100vw`:`420px`,e.style.height=`calc(100vh - ${t})`):(e.style.top=`calc(${t} + 16px)`,e.style.width=`40px`,e.style.height=`64px`)}On(()=>{let e=U(d),t=requestAnimationFrame(()=>{$c(e),pl(document)});return()=>cancelAnimationFrame(t)}),On(()=>{!U(u)&&U(l)?document.documentElement.classList.add(`sf-panel-active`):document.documentElement.classList.remove(`sf-panel-active`)}),On(()=>{O()}),On(()=>{try{localStorage.setItem(r,String(U(l)))}catch{}}),On(()=>{try{localStorage.setItem(i,U(m))}catch{}});function k(){R(l,!U(l))}function A(e){let t=U(d),n=typeof e==`function`?e(t):e;C(t,n)||(R(f,[...U(f).slice(-49),t],!0),R(p,[],!0),(U(T)===`saved`||U(T)===`error`)&&R(T,`idle`)),R(d,n,!0)}async function ee(){if(!U(E)||U(T)===`saving`)return;let e={...U(d)};R(T,`saving`);try{await nl(U(d)),C(U(d),e)?(R(w,e,!0),R(T,`saved`),D&&clearTimeout(D),D=setTimeout(()=>{U(T)===`saved`&&R(T,`idle`),D=null},2e3)):R(T,`idle`)}catch(e){console.warn(`slashed: save failed`,e),R(T,`error`)}}function te(e,t){A(n=>({...n,[e]:t}))}function j(e){A(t=>{let n={...t};return delete n[e],n})}function ne(e){A(t=>{let n={...t};for(let[t,r]of Object.entries(e))r===null?delete n[t]:n[t]=r;return n})}function M(e){A({...e})}function re(){R(g,!0)}function ie(){R(g,!1),A({})}function ae(){R(g,!1)}function oe(){if(!U(f).length)return;let e=U(f)[U(f).length-1];R(p,[U(d),...U(p)],!0),R(f,U(f).slice(0,-1),!0),R(d,e,!0)}function se(){if(!U(p).length)return;let e=U(p)[0];R(f,[...U(f),U(d)],!0),R(p,U(p).slice(1),!0),R(d,e,!0)}function N(){let e=Cc(U(d),{mode:`layer`,banner:!0}),t=new Blob([e],{type:`text/css`}),n=URL.createObjectURL(t),r=document.createElement(`a`);r.href=n,r.download=`slashed-overrides.css`,r.click(),URL.revokeObjectURL(n)}function ce(){let e=document.createElement(`input`);e.type=`file`,e.accept=`.css,.json`,e.onchange=e=>{let t=e.target.files?.[0];if(!t)return;let n=new FileReader;n.onload=e=>{let n=e.target?.result;if(n)if(t.name.endsWith(`.json`))try{let e=JSON.parse(n);typeof e==`object`&&e&&!Array.isArray(e)&&A(Object.fromEntries(Object.entries(e).filter(([e,t])=>typeof t==`string`&&/^--sf-[\w-]+$/.test(e))))}catch{}else{let e={},t=/(--sf-[\w-]+)\s*:\s*([^;]+);/g,r;for(;(r=t.exec(n))!==null;)e[r[1].trim()]=r[2].trim();Object.keys(e).length&&A(t=>({...t,...e}))}},n.readAsText(t)},e.click()}ia(()=>{let e=document.createElement(`style`);e.id=`sf-panel-push`,e.textContent=[`html { transition: padding-right 200ms ease-in-out; }`,`html.sf-panel-active { padding-right: 420px !important; overflow-x: clip; }`].join(`
+`),document.head.appendChild(e);let t=window.matchMedia(`(max-width: 768px)`),n=e=>{R(u,e.matches,!0)};t.addEventListener(`change`,n);let r=e=>{let t=e.key.toLowerCase();U(l)&&((e.ctrlKey||e.metaKey)&&!e.shiftKey&&t===`z`&&(e.preventDefault(),oe()),(e.ctrlKey||e.metaKey)&&(e.shiftKey&&t===`z`||t===`y`)&&(e.preventDefault(),se()),(e.ctrlKey||e.metaKey)&&!e.repeat&&t===`k`&&(e.preventDefault(),R(h,!U(h))),(e.ctrlKey||e.metaKey)&&!e.shiftKey&&t===`s`&&(e.preventDefault(),ee()))},i=()=>k();return window.addEventListener(`keydown`,r),document.addEventListener(`slashed:toggle-overlay`,i),()=>{e.remove(),document.documentElement.classList.remove(`sf-panel-active`),t.removeEventListener(`change`,n),window.removeEventListener(`keydown`,r),document.removeEventListener(`slashed:toggle-overlay`,i),D&&clearTimeout(D)}});var le=cg(),ue=B(le),de=e=>{var t=ag();ba(V(z(t),2),{class:`w-3 h-3 opacity-70 rotate-180`}),F(t),W(`click`,t,k),K(e,t)};J(ue,e=>{U(l)||e(de)});var fe=V(ue,2);let pe,me;var he=z(fe),ge=V(z(he),4),_e=z(ge,!0);F(ge);var ve=V(ge,2),ye=e=>{var t=og(),n=z(t,!0);F(t),H(()=>q(n,U(y))),K(e,t)};J(ve,e=>{U(y)>0&&e(ye)});var be=V(ve,4),xe=z(be),Se=e=>{Lo(e,{class:`w-3 h-3 animate-spin`})},Ce=e=>{va(e,{class:`w-3 h-3`})},we=e=>{Vo(e,{class:`w-3 h-3`})},Te=e=>{oo(e,{class:`w-3 h-3`})};J(xe,e=>{U(T)===`saving`?e(Se):U(T)===`saved`?e(Ce,1):U(T)===`error`?e(we,2):e(Te,-1)}),F(be);var Ee=V(be,2);jo(z(Ee),{class:`w-3 h-3`}),F(Ee);var De=V(Ee,2);Qa(z(De),{class:`w-3 h-3`}),F(De);var P=V(De,4);Pa(z(P),{class:`w-3 h-3`}),F(P);var Oe=V(P,2);Oa(z(Oe),{class:`w-3 h-3`}),F(Oe);var ke=V(Oe,2);Do(z(ke),{class:`w-3 h-3`}),F(ke);var Ae=V(ke,4);ba(z(Ae),{class:`w-3 h-3`}),F(Ae),F(he);var je=V(he,2),Me=z(je);ds(Me,{get activeId(){return U(m)},onSelect:e=>{R(m,e,!0)},get overridesByDomain(){return U(b)}});var Ne=V(Me,2),Pe=z(Ne),Fe=z(Pe),Ie=z(Fe,!0);F(Fe),F(Pe);var Le=V(Pe,2);Wh(z(Le),{get domain(){return U(m)},get tokens(){return n},get overrides(){return U(d)},onSet:te,onReset:j,onBulkChange:ne,onApplyTheme:M,onSelectDomain:e=>{R(m,e,!0)},onResetAll:re}),F(Le),F(Ne),F(je);var Re=V(je,2),ze=e=>{Qh(e,{get tokens(){return n},get overrides(){return U(d)},onNavigate:e=>{R(m,e,!0)},onClose:()=>{R(h,!1)}})};J(Re,e=>{U(h)&&e(ze)});var Be=V(Re,2),Ve=e=>{var t=sg(),n=z(t),r=V(z(n),2),i=z(r);F(r);var a=V(r,2),o=z(a);Qi(o,e=>R(_,e),()=>U(_));var s=V(o,2);Qi(s,e=>R(v,e),()=>U(v)),F(a),F(n),F(t),H(()=>q(i,`This will clear all ${U(y)??``} customisation${U(y)===1?``:`s`}.
           You can still undo this before saving.`)),W(`keydown`,t,e=>{e.key===`Escape`&&(e.stopPropagation(),ae()),e.key===`Tab`&&(e.preventDefault(),document.activeElement===U(_)?U(v)?.focus():U(_)?.focus())}),W(`click`,o,ae),W(`click`,s,ie),K(e,t)};J(Be,e=>{U(g)&&e(Ve)}),F(fe),H(e=>{pe=X(fe,1,`dark fixed right-0 z-[99998] pointer-events-auto flex flex-col bg-[#0a0a0f] text-slate-200 font-sans shadow-2xl shadow-black/60 border-l border-white/8 transition-transform duration-200 ease-in-out`,null,pe,{"translate-x-full":!U(l),"translate-x-0":U(l),"pointer-events-none":!U(l)}),me=Z(fe,`top: var(--wp-admin--admin-bar--height, 32px); width: ${U(u)?`100vw`:`420px`}; height: calc(100vh - var(--wp-admin--admin-bar--height, 32px));`,me,{visibility:U(l)?void 0:`hidden`}),Q(fe,`aria-hidden`,!U(l)),fe.inert=!U(l)||void 0,q(_e,a[U(m)]??U(m)),be.disabled=!U(E)||U(T)===`saving`,Q(be,`title`,U(T)===`error`?`Save failed — click to retry`:U(E)?`Save changes (Ctrl+S)`:`No unsaved changes`),Q(be,`aria-label`,U(T)===`saving`?`Saving changes`:U(T)===`error`?`Save failed`:U(E)?`Save changes`:`No unsaved changes`),X(be,1,e),Ee.disabled=!U(x),De.disabled=!U(S),Oe.disabled=U(y)===0,ke.disabled=U(y)===0,q(Ie,a[U(m)]??U(m))},[()=>yi([`p-1 rounded transition-colors cursor-pointer shrink-0 disabled:pointer-events-none`,U(T)===`error`?`text-red-400`:U(T)===`saved`?`text-emerald-300`:U(E)?`text-emerald-400 hover:text-emerald-300 hover:bg-emerald-500/10`:`text-slate-500 opacity-40`].join(` `))]),W(`click`,be,ee),W(`click`,Ee,oe),W(`click`,De,se),W(`click`,P,ce),W(`click`,Oe,N),W(`click`,ke,re),W(`click`,Ae,k),K(e,le),We()}Br([`click`,`keydown`]);function ug(){return window.slashedApp?.cssUrl}function dg(e){try{return new URL(e,location.href).origin===location.origin}catch{return!1}}function fg(){let e=document.getElementById(`slashed-frontend-overlay`);if(!e||e.shadowRoot)return;$o(`dark`);let t=e.attachShadow({mode:`open`}),n=document.createElement(`div`);t.appendChild(n);let r=!1,i=()=>{r||(Zr(lg,{target:n}),r=!0,e.setAttribute(`data-slashed-ready`,``))},a=ug();if(a&&dg(a)){let e=document.createElement(`link`);e.rel=`stylesheet`,e.href=a;let n=setTimeout(i,5e3),r=()=>{clearTimeout(n),i()};e.addEventListener(`load`,r),e.addEventListener(`error`,r),t.appendChild(e)}else i()}document.readyState===`loading`?document.addEventListener(`DOMContentLoaded`,fg):fg();
 //# sourceMappingURL=app.js.map
\ No newline at end of file