:root{
--bg:#000000;--rail:#000000;--line:#222226;--line-2:#2e2e33;
--ink:#ffffff;--muted:#b4b4bd;--dim:#85858f;--surface:#18181c;--surface-2:#0F0F0F;
--accent:#0E96F1;--accent-rgb:14,150,241;--send:#ffffff;
--r-pill:9999px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:'Inter',system-ui,sans-serif;background:#000;color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.55;display:flex;height:100dvh;overflow:hidden}
button,input,select,textarea,option{font-family:'Inter',system-ui,sans-serif}
/* left rail */
.rail{width:60px;border-right:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;align-items:center;padding:16px 0;gap:4px;background:#000;position:fixed;left:0;top:0;bottom:0;z-index:2;overflow:hidden;transition:width .46s cubic-bezier(.22,1,.36,1)}
body.rail-open .rail{width:220px;align-items:stretch;padding:16px 12px}
/* expand/collapse toggle on the dark home rail */
.rail-toggle{width:38px;height:38px;flex:none;border:none;background:none;border-radius:10px;color:#cfcfd6;
display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .12s;margin-bottom:6px}
body.rail-open .rail-toggle{align-self:flex-start;margin-left:1px}
.rail-toggle:hover{background:var(--surface)}
.rail-toggle svg{width:20px;height:20px}
.rail-toggle svg rect,.rail-toggle svg line{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.rail-toggle svg .pfill{fill:currentColor;stroke:none;opacity:.42}
.rlbl{max-width:0;opacity:0;overflow:hidden;white-space:nowrap;font:600 13.5px Inter;color:#fff;
transition:max-width .46s cubic-bezier(.22,1,.36,1),opacity .3s ease}
body.rail-open .rlbl{max-width:160px;opacity:1}
body.rail-open .rail button[data-view]{width:100%;justify-content:flex-start;gap:10px;padding:0 9px;height:32px}
.rail .brand{margin-bottom:14px}
.rail .brand .tri{width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:16px solid var(--accent)}
.rail button{width:38px;height:38px;border:none;background:none;border-radius:10px;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .12s}
.rail button:hover{background:var(--surface)}
.rail button.on{background:var(--surface)}
/* Promotions now belongs to Growth and Markets is retired from navigation.
Keep the legacy rail glyphs in the source so saved routes can still reuse
their icons, but do not surface either as a standalone destination. */
.rail button[data-view="discounts"],.rail button[data-view="markets"]{display:none}
.rail svg{width:18px;height:18px;fill:currentColor;stroke:none}
.rail .spacer{flex:1}
.rail .av{width:30px;height:30px;border-radius:50%;background:var(--surface);border:1px solid var(--line-2)}
/* main */
.bg{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none}
/* Email workspace — a theme-aware surround with the same breakpoint interaction
vocabulary used by the site editor. */
.email-canvas-bg{position:fixed;inset:0;z-index:0;overflow:hidden;overscroll-behavior:none;touch-action:none;pointer-events:none;visibility:hidden;opacity:0;background:var(--email-canvas-bg-color,#eee);
transition:opacity .28s cubic-bezier(.4,0,.2,1),visibility 0s .28s,background-color .2s ease}
.email-canvas-world{position:absolute;left:-100%;top:-100%;width:300%;height:300%;background:var(--email-canvas-bg-color,#eee);transform:translate3d(0,0,0) scale(1);transform-origin:50% 50%;will-change:transform;transition:background-color .2s ease}
.email-breakpoint{--email-bp-scale:1;--email-bp-x:0px;--email-bp-y:0px;--email-ui-inv:1;position:absolute;left:50%;top:50%;width:600px;height:800px;margin-left:var(--email-bp-x);margin-top:var(--email-bp-y);transform:translate(-50%,-50%) scale(var(--email-bp-scale));transform-origin:center;opacity:0;pointer-events:auto;outline:none;
transition:opacity .3s .08s cubic-bezier(.4,0,.2,1);font-family:'Inter',system-ui,sans-serif}
.email-breakpoint-label{position:absolute;left:0;right:0;bottom:calc(100% + 12px * var(--email-ui-inv));height:calc(40px * var(--email-ui-inv));padding:calc(6px * var(--email-ui-inv)) calc(8px * var(--email-ui-inv));border-radius:999px;background:#2a2a2a;color:#8c8c8c;
display:flex;align-items:center;justify-content:space-between;font-size:calc(13px * var(--email-ui-inv));line-height:1;white-space:nowrap;overflow:hidden;user-select:none;-webkit-user-select:none;cursor:grab;transition:background-color .15s ease}
.email-breakpoint.is-moving .email-breakpoint-label{cursor:grabbing}
.email-breakpoint-group{display:flex;align-items:center;gap:calc(8px * var(--email-ui-inv));min-width:0}
.email-breakpoint-add-group{opacity:0;transform:translateX(calc(5px * var(--email-ui-inv)));pointer-events:none;transition:opacity .15s ease,transform .18s ease}
.email-breakpoint-label:hover .email-breakpoint-add-group,.email-breakpoint-label:focus-within .email-breakpoint-add-group{opacity:1;transform:none;pointer-events:auto}
.email-breakpoint-title{min-width:0;overflow:hidden;text-overflow:ellipsis;font-weight:600;color:#8c8c8c;cursor:pointer;transition:color .15s ease}
.email-breakpoint-play,.email-breakpoint-add{padding:0;border:0;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;font-family:inherit}
.email-breakpoint-play{width:calc(24px * var(--email-ui-inv));height:calc(24px * var(--email-ui-inv));background:#686868}
.email-breakpoint-play svg{width:calc(11px * var(--email-ui-inv));height:calc(11px * var(--email-ui-inv));display:block;fill:currentColor;stroke:none;transform:translateX(calc(1px * var(--email-ui-inv)))}
.email-breakpoint-dim,.email-breakpoint-add-text{font-weight:400;color:#8c8c8c;font-variant-numeric:tabular-nums;cursor:pointer;transition:color .15s ease}
.email-breakpoint-add-text{font-weight:500}
.email-breakpoint-add{width:calc(20px * var(--email-ui-inv));height:calc(20px * var(--email-ui-inv));background:#444;color:#999;transition:background-color .15s ease,color .15s ease}
.email-breakpoint-add svg{width:calc(20px * var(--email-ui-inv));height:calc(20px * var(--email-ui-inv));display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.email-breakpoint-frame{position:absolute;inset:0;background:#fff;border:0;border-radius:0;box-shadow:0 calc(2px * var(--email-ui-inv)) calc(14px * var(--email-ui-inv)) rgba(0,0,0,.28);overflow:hidden;outline:none;cursor:default;transition:box-shadow .15s ease}
.email-breakpoint-frame::after{content:"";position:absolute;inset:0;background:rgba(0,153,255,.1);opacity:0;pointer-events:none;transition:opacity .15s ease}
.email-breakpoint:hover .email-breakpoint-label,.email-breakpoint.is-selected .email-breakpoint-label{background:rgba(0,170,255,.12)}
.email-breakpoint:hover .email-breakpoint-title,.email-breakpoint:hover .email-breakpoint-dim,.email-breakpoint:hover .email-breakpoint-add-text,
.email-breakpoint.is-selected .email-breakpoint-title,.email-breakpoint.is-selected .email-breakpoint-dim,.email-breakpoint.is-selected .email-breakpoint-add-text{color:#09f}
.email-breakpoint:hover .email-breakpoint-play,.email-breakpoint.is-selected .email-breakpoint-play{background:#09f}
.email-breakpoint:hover .email-breakpoint-add,.email-breakpoint.is-selected .email-breakpoint-add{background:rgba(0,153,255,.15);color:#09f}
.email-breakpoint .email-breakpoint-add:hover{background:#09f;color:#fff}
.email-breakpoint.is-selected .email-breakpoint-frame,.email-breakpoint:focus-within .email-breakpoint-frame{box-shadow:0 0 0 calc(1px * var(--email-ui-inv)) #09f,0 calc(2px * var(--email-ui-inv)) calc(14px * var(--email-ui-inv)) rgba(0,0,0,.28)}
.email-breakpoint.is-selected .email-breakpoint-frame::after,.email-breakpoint.is-resizing .email-breakpoint-frame::after{opacity:1}
.email-breakpoint-selection{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0}
.email-breakpoint.is-selected .email-breakpoint-selection{opacity:1}
.email-breakpoint-resize-hit{position:absolute;top:calc(12px * var(--email-ui-inv));bottom:calc(12px * var(--email-ui-inv));width:calc(12px * var(--email-ui-inv));pointer-events:auto;cursor:ew-resize;touch-action:none}
.email-breakpoint-resize-hit.w{left:calc(-6px * var(--email-ui-inv))}
.email-breakpoint-resize-hit.e{right:calc(-6px * var(--email-ui-inv))}
.email-breakpoint-resize-dot{position:absolute;top:50%;width:calc(8px * var(--email-ui-inv));height:calc(8px * var(--email-ui-inv));margin-top:calc(-4px * var(--email-ui-inv));border:calc(1px * var(--email-ui-inv)) solid #0c8eeb;border-radius:50%;background:#fff;pointer-events:none}
.email-breakpoint-resize-hit.w .email-breakpoint-resize-dot{left:calc(2px * var(--email-ui-inv))}
.email-breakpoint-resize-hit.e .email-breakpoint-resize-dot{right:calc(2px * var(--email-ui-inv))}
.email-breakpoint-edge-pill{position:absolute;left:50%;width:calc(16px * var(--email-ui-inv));height:calc(4px * var(--email-ui-inv));margin-left:calc(-8px * var(--email-ui-inv));border-radius:calc(2px * var(--email-ui-inv));background:#09f;pointer-events:none}
.email-breakpoint-edge-pill.n{top:calc(-2px * var(--email-ui-inv))}
.email-breakpoint-edge-pill.s{bottom:calc(-2px * var(--email-ui-inv))}
.email-breakpoint-size-chip{position:fixed;z-index:20;min-width:54px;height:26px;padding:0 9px;border-radius:7px;background:#09f;color:#fff;display:flex;align-items:center;justify-content:center;font:600 12px/1 Inter;font-variant-numeric:tabular-nums;box-shadow:0 8px 24px rgba(0,153,255,.28);opacity:0;transform:translate(12px,12px) scale(.94);pointer-events:none;transition:opacity .12s ease,transform .12s ease}
.email-breakpoint-size-chip.on{opacity:1;transform:translate(12px,12px) scale(1)}
.email-breakpoint-menu{position:fixed;z-index:12;min-width:220px;padding:6px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(40,40,40,.96);box-shadow:0 16px 48px rgba(0,0,0,.5);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);pointer-events:auto;font-family:'Inter',system-ui,sans-serif}
.email-breakpoint-menu[hidden],.email-breakpoint-modal[hidden]{display:none}
.email-breakpoint-menu-row{width:100%;height:32px;padding:0 12px;border:0;border-radius:7px;background:transparent;color:#fff;display:flex;align-items:center;justify-content:space-between;font:500 14px Inter;cursor:pointer}
.email-breakpoint-menu-row:hover{background:rgba(255,255,255,.06)}
.email-breakpoint-menu-row:disabled{color:rgba(255,255,255,.32);cursor:default;background:transparent}
.email-breakpoint-menu-row small{color:rgba(255,255,255,.5);font:400 13px Inter}
.email-breakpoint-menu-row:disabled small{color:rgba(255,255,255,.22)}
.email-breakpoint-menu-divider{height:1px;margin:6px 8px;background:rgba(255,255,255,.08)}
.email-breakpoint-modal{position:fixed;inset:0;z-index:13;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;pointer-events:auto;font-family:'Inter',system-ui,sans-serif}
.email-breakpoint-dialog{width:360px;padding:18px 20px 16px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:#1c1c1c;box-shadow:0 24px 80px rgba(0,0,0,.6);color:#fff}
.email-breakpoint-dialog h2{margin:0 0 12px;font:600 15px Inter}
.email-breakpoint-fields{display:flex;gap:10px;margin:0 -20px;padding:14px 20px;border-top:1px solid rgba(255,255,255,.08)}
.email-breakpoint-input{width:100%;min-width:0;height:36px;padding:0 12px;box-sizing:border-box;border:1.5px solid transparent;border-radius:8px;outline:none;background:#2a2a2a;color:#fff;font:400 14px Inter}
.email-breakpoint-input:focus{border-color:#09f}
.email-breakpoint-input::placeholder{color:rgba(255,255,255,.4)}
.email-breakpoint-help{margin:0 0 18px;color:rgba(255,255,255,.55);font:400 13px/1.45 Inter}
.email-breakpoint-actions{display:flex;gap:10px}
.email-breakpoint-action{flex:1;height:36px;border:0;border-radius:8px;color:#fff;background:#2a2a2a;font:600 14px Inter;cursor:pointer}
.email-breakpoint-action.primary{background:#09f}
.email-breakpoint-action:disabled{opacity:.45;cursor:not-allowed}
/* Raw email layers. Email documents deliberately use no animation or
component runtime, but Frames and Stacks use the same functional layout
vocabulary as the site editor: flow/absolute positioning, sizing modes,
per-side geometry, overflow, borders, shadows, and nested containers. */
.email-editor-surface,.email-editor-surface *{animation:none!important;transition:none!important}
.email-editor-surface{position:relative;z-index:1;width:100%;min-height:100%;overflow-y:auto;overflow-x:hidden;background:#f4f1ec;color:#151515;cursor:default}
.email-editor-page{position:relative;width:100%;min-height:100%;background:var(--email-page-bg,#f4f1ec)}
.email-layer{position:relative;min-width:0;outline:0;box-sizing:border-box;cursor:default}
.email-layer-stack{display:flex;width:100%}
.email-layer-stack[data-direction="vertical"]{flex-direction:column}
.email-layer-stack[data-direction="horizontal"]{flex-direction:row}
.email-layer-text{white-space:pre-wrap;overflow-wrap:anywhere}
.email-layer-button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap}
.email-layer-divider{width:100%;height:1px;min-height:1px;background:rgba(15,15,15,.16)}
.email-layer-spacer{width:100%;min-height:18px}
.email-layer:hover{outline:1px solid rgba(0,153,255,.62);outline-offset:-1px}
.email-layer.is-email-dragging{opacity:.38}
.email-layer.is-email-direct-moving{opacity:.72;pointer-events:none;cursor:grabbing!important;will-change:translate}
.email-layer.is-email-drop-target,.email-editor-page.is-email-drop-target{outline:2px dashed #09f!important;outline-offset:-3px;background-image:linear-gradient(rgba(0,153,255,.07),rgba(0,153,255,.07))!important}
.email-layer.is-email-layer-selected{z-index:3;outline:2px solid #09f!important;outline-offset:2px}
.email-layer.is-email-layer-selected::after{content:attr(data-email-layer-label);position:absolute;left:-2px;bottom:calc(100% + 4px);height:18px;padding:0 6px;border-radius:4px;background:#09f;color:#fff;display:flex;align-items:center;font:600 10px/1 Inter;letter-spacing:.01em;white-space:nowrap;pointer-events:none}
.email-layer[contenteditable="true"]{cursor:text;outline:2px solid #09f!important;outline-offset:2px}
.email-breakpoint.has-email-document.is-selected .email-breakpoint-frame::after{opacity:0}
.email-layer-bounds{position:fixed;z-index:43;box-sizing:border-box;border:1px solid #09f;pointer-events:none;transform-origin:center center}
.email-layer-bounds[hidden]{display:none}
.email-layer-resize-handle{position:absolute;width:9px;height:9px;padding:0;border:1px solid #078fe0;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.18);pointer-events:auto;touch-action:none}
.email-layer-resize-handle[data-email-resize-layer="nw"]{left:0;top:0;transform:translate(-50%,-50%);cursor:nwse-resize}
.email-layer-resize-handle[data-email-resize-layer="n"]{left:50%;top:0;transform:translate(-50%,-50%);cursor:ns-resize}
.email-layer-resize-handle[data-email-resize-layer="ne"]{right:0;top:0;transform:translate(50%,-50%);cursor:nesw-resize}
.email-layer-resize-handle[data-email-resize-layer="e"]{right:0;top:50%;transform:translate(50%,-50%);cursor:ew-resize}
.email-layer-resize-handle[data-email-resize-layer="se"]{right:0;bottom:0;transform:translate(50%,50%);cursor:nwse-resize}
.email-layer-resize-handle[data-email-resize-layer="s"]{left:50%;bottom:0;transform:translate(-50%,50%);cursor:ns-resize}
.email-layer-resize-handle[data-email-resize-layer="sw"]{left:0;bottom:0;transform:translate(-50%,50%);cursor:nesw-resize}
.email-layer-resize-handle[data-email-resize-layer="w"]{left:0;top:50%;transform:translate(-50%,-50%);cursor:ew-resize}
.email-inspector{--brand:#09f;--email-inspector-bg:#111;--email-inspector-control:#2b2b2b;--email-inspector-control-hover:#242424;--email-inspector-selected:#404040;--email-inspector-line:#252525;position:fixed;z-index:46;right:0;top:81px;bottom:0;width:260px;display:none;flex-direction:column;border-left:1px solid var(--email-inspector-line);background:var(--email-inspector-bg);color:#fff;font-family:'Inter',system-ui,sans-serif;pointer-events:auto;box-sizing:border-box;padding:15px;overflow:hidden}
body.email-canvas-mode .email-inspector{display:flex}
.email-inspector-createbar{height:38px;flex:none;margin:-3px 0 12px;padding-bottom:12px;border-bottom:1px solid var(--email-inspector-line);display:grid;grid-template-columns:1fr 1fr;gap:10px}
.email-inspector-create{height:32px;padding:0 10px;border:0;border-radius:8px;background:#2b2b2b;color:#ddd;display:flex;align-items:center;justify-content:center;gap:7px;font:600 12px/1 Inter;cursor:pointer;transition:background-color .12s ease,color .12s ease}
.email-inspector-create:hover{background:#353535;color:#fff}
.email-inspector-create:active{background:#404040;transform:translateY(1px)}
.email-inspector-create svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.email-inspector-scroll{position:relative;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;background:var(--email-inspector-bg);scrollbar-width:none}
.email-inspector-scroll::-webkit-scrollbar{display:none}
.email-inspector-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:32px 18px;text-align:center;color:#5a6478;font:500 12px/1.6 Inter}
.email-inspector-align{height:52px;padding:7.5px 4px 22.5px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between}
.email-inspector-align button{width:22px;height:22px;min-width:22px;padding:0;border:0;background:transparent;color:#777;display:flex;align-items:center;justify-content:center;cursor:pointer}
.email-inspector-align button:hover{color:#777}
.email-inspector-align button:disabled{color:#777;cursor:default}
.email-inspector-align svg{display:block;width:16px;height:16px;fill:currentColor}
.email-inspector-section{padding:0 0 24px}
.email-inspector-section:last-child{padding-bottom:32px}
.email-inspector-section.is-collapsed{padding-bottom:0}
.email-inspector-section-title{min-height:37px;margin:0 0 24px;padding:9px 3px 5px;border-top:1px solid var(--email-inspector-line);display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;color:#fff;font:700 12px/1 Inter;cursor:pointer;user-select:none}
.email-inspector-section-title.is-static{cursor:default}
.email-inspector-section.is-collapsed .email-inspector-section-title{min-height:48px;margin-bottom:0}
.email-inspector-section-toggle{width:10px;height:10px;padding:0;border:0;background:transparent;color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none}
.email-inspector-section-toggle svg{display:block;width:10px;height:10px;fill:currentColor}
.email-inspector-section-body[hidden]{display:none}
.email-inspector-row{display:grid;grid-template-columns:80px minmax(0,1fr);gap:8px;align-items:center;min-height:29px;margin-bottom:10px}
.email-inspector-row:last-child{margin-bottom:0}
.email-inspector-row-label{padding-left:15px;box-sizing:border-box;color:#ccc;font:500 12px/1.2 Inter}
.email-inspector-controls{width:133px;justify-self:end;display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}
.email-inspector-controls>*{flex:none}
.email-inspector-controls>:only-child{width:100%}
.email-inspector-controls>:not(:only-child){flex:1 1 0;width:auto;min-width:0}
.email-inspector-text{height:29px;padding:0 10px;border:0;border-radius:8px;outline:1.5px solid transparent;outline-offset:-1.5px;background:#2b2b2b;color:#e0e0e0;font:500 12px/1 Inter;box-sizing:border-box;transition:background-color .12s ease,outline-color .12s ease;-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 12px),transparent 100%);mask-image:linear-gradient(to right,#000 calc(100% - 12px),transparent 100%)}
.email-inspector-text:hover{background:#242424}
.email-inspector-text:focus{background:#2b2b2b;outline-color:var(--brand);-webkit-mask-image:none;mask-image:none}
.email-inspector-select{position:relative;width:62px;height:29px;padding:0 8px 0 10px;border-radius:8px;outline:1.5px solid transparent;outline-offset:-1.5px;background:#2b2b2b;display:flex;align-items:center;box-sizing:border-box;transition:background-color .12s ease,outline-color .12s ease}
.email-inspector-select:hover{background:#242424}
.email-inspector-select:focus-within{background:#2b2b2b;outline-color:var(--brand)}
.email-inspector-select select{appearance:none;-webkit-appearance:none;width:100%;height:100%;min-width:0;padding:0 14px 0 0;border:0;outline:0;background:transparent;color:#e0e0e0;font:500 12px/1 Inter;cursor:pointer;-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 14px),transparent calc(100% - 2px));mask-image:linear-gradient(to right,#000 calc(100% - 14px),transparent calc(100% - 2px))}
.email-inspector-select::after{content:'';position:absolute;right:8px;top:50%;width:8px;height:8px;transform:translateY(-50%);background:url("data:image/svg+xml;utf8,") center/8px 8px no-repeat;pointer-events:none}
.email-inspector-number{position:relative;width:62px;height:29px;padding:0 25px 0 10px;border-radius:8px;outline:1.5px solid transparent;outline-offset:-1.5px;background:#2b2b2b;display:flex;align-items:center;box-sizing:border-box;transition:background-color .12s ease,outline-color .12s ease}
.email-inspector-number:hover{background:#242424}
.email-inspector-number:focus-within{background:#2b2b2b;outline-color:var(--brand)}
.email-inspector-number input{width:100%;height:100%;min-width:0;padding:0;border:0;outline:0;background:transparent;color:#e0e0e0;font:500 12px/1 Inter;font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.email-inspector-number input::-webkit-inner-spin-button,.email-inspector-number input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.email-inspector-number-stepper{position:absolute;right:5px;top:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;opacity:0;transition:opacity .12s ease}
.email-inspector-number:hover .email-inspector-number-stepper,.email-inspector-number:focus-within .email-inspector-number-stepper{opacity:1}
.email-inspector-number-suffix{position:absolute;right:8px;top:0;height:100%;display:flex;align-items:center;color:#555;font:400 11px/1 Inter;pointer-events:none;transition:opacity .12s ease}
.email-inspector-number:hover .email-inspector-number-suffix,.email-inspector-number:focus-within .email-inspector-number-suffix{opacity:0}
.email-inspector-number-stepper button{width:12px;height:9px;padding:0;border:0;background:transparent;color:#888;display:flex;align-items:center;justify-content:center;cursor:pointer}
.email-inspector-number-stepper button:hover{color:#fff}
.email-inspector-number-stepper svg{width:8px;height:5px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.email-inspector-segment{position:relative;display:flex;width:133px;height:29px;padding:3px;border-radius:8px;background:#292929;box-sizing:border-box}
.email-inspector-segment-pill{position:absolute;z-index:0;top:3px;left:3px;height:23px;width:calc((100% - 6px)/var(--email-seg-count));border:1px solid #484848;border-top-color:#4f4f4f;border-bottom-color:#464646;border-radius:6px;background:#404040;box-sizing:border-box;pointer-events:none;transform:translateX(calc(var(--email-seg-index)*100%));transition:transform .22s cubic-bezier(.4,0,.2,1)}
.email-inspector-segment button{position:relative;z-index:1;flex:1;min-width:0;height:100%;padding:0 4px;border:0;border-radius:6px;background:transparent;color:#888;font:500 12px/1 Inter;cursor:pointer;transition:color .22s cubic-bezier(.4,0,.2,1)}
.email-inspector-segment button:hover,.email-inspector-segment button.is-on{color:#fff}
.email-inspector-segment button svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.email-inspector-segment button .is-fill{fill:currentColor;stroke:none}.email-inspector-segment button .is-stroke{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.email-inspector input[type="range"]{flex:1;min-width:0;-webkit-appearance:none;appearance:none;height:2px;padding:0;border:0;border-radius:999px;outline:0;background:linear-gradient(to right,var(--brand) 0,var(--brand) var(--fill-pct),#444 var(--fill-pct),#444 100%)}
.email-inspector input[type="range"]::-webkit-slider-runnable-track{height:2px;background:transparent;border-radius:999px}
.email-inspector input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:10px;height:10px;margin-top:-4px;border:0;border-radius:50%;background:#fff;cursor:pointer}
.email-inspector input[type="range"]::-moz-range-track{height:2px;background:transparent;border-radius:999px}
.email-inspector input[type="range"]::-moz-range-thumb{width:10px;height:10px;border:0;border-radius:50%;background:#fff;cursor:pointer}
.email-inspector-color{width:133px;height:29px;padding:2px 6px 2px 4px;border-radius:8px;outline:1.5px solid transparent;outline-offset:-1.5px;background:#2b2b2b;display:flex;align-items:center;gap:8px;box-sizing:border-box;transition:background-color .12s ease,outline-color .12s ease}
.email-inspector-color:hover{background:#242424}
.email-inspector-color:focus-within{background:#2b2b2b;outline-color:var(--brand)}
.email-inspector-color-swatch{width:22px;height:22px;flex:none;padding:0;border:0;border-radius:4px;background:var(--email-color-swatch,#000);cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.email-inspector-color input[type="text"]{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;color:#e0e0e0;font:500 12px/1 Inter}
.email-inspector-color-remove{width:10px;height:18px;flex:none;padding:0;border:0;background:transparent;color:#666;display:flex;align-items:center;justify-content:center;font:500 13px/1 Inter;cursor:pointer}
.email-inspector-color-remove:hover{color:#aaa}
.email-color-popover{--brand:#09f;position:fixed;z-index:11000;width:260px;max-height:calc(100vh - 32px);overflow-y:auto;padding:15px 10px 10px;border-radius:20px;background:#111;color:#fff;box-shadow:0 12px 36px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.04);box-sizing:border-box;font-family:'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;-webkit-font-smoothing:antialiased;scrollbar-width:none;display:flex;flex-direction:column;gap:0}
.email-color-popover::-webkit-scrollbar{display:none}
.email-color-popover>*+*{margin-top:10px}
.email-color-popover>.email-color-modebar{margin-top:15px}
.email-color-popover>.email-color-sv,.email-color-popover>.email-color-gradient-bar,.email-color-popover>.email-color-image-drop{margin-top:10px}
.email-color-popover>.email-color-alpha{margin-top:8px}
.email-color-popover>.email-color-new-style{margin-top:11px}
.email-color-popover>.email-color-new-style-form{margin-top:20px}
.email-color-header{height:22px;margin:0 5px;display:flex;align-items:center;justify-content:space-between;cursor:grab;user-select:none;touch-action:none}
.email-color-header:active{cursor:grabbing}
.email-color-title{flex:1;color:#fff;font:700 12px/1 Inter;text-align:left}
.email-color-close{width:22px;height:22px;padding:0;border:0;border-radius:6px;background:transparent;color:#999;display:flex;align-items:center;justify-content:center;cursor:pointer}
.email-color-close svg{width:10px;height:10px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.email-color-modebar{position:relative;height:29px;padding:1px;border-radius:8px;background:#2b2b2b;display:flex;align-items:center;box-sizing:border-box}
.email-color-mode-pill{position:absolute;z-index:0;top:1.5px;bottom:1.5px;left:0;border:1px solid #4f4f4f;border-radius:6px;background:#404040;box-sizing:border-box;transition:transform .22s cubic-bezier(.4,0,.2,1),width .22s cubic-bezier(.4,0,.2,1);pointer-events:none}
.email-color-mode-cell{display:inline-flex;align-items:center;flex:1;min-width:0}
.email-color-mode{position:relative;z-index:1;flex:1;height:25px;padding:0;border:1px solid transparent;border-radius:6px;background:transparent;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.email-color-mode-icon{display:block;width:14px;height:14px;border:1.5px solid #999;border-radius:50%;box-sizing:border-box}
.email-color-mode.is-on .email-color-mode-icon{border-color:#fff}
.email-color-mode-icon.solid{background:#575757}
.email-color-mode.is-on .email-color-mode-icon.solid{background:#8d8c8c}
.email-color-mode-icon.linear{background:linear-gradient(180deg,#7d7d7d 0%,#333 100%)}
.email-color-mode-icon.radial{background:radial-gradient(circle at center,#2e2e2e 0 22%,#717171 100%)}
.email-color-mode-icon.conic{background:conic-gradient(from 0deg,#858585 0 25%,#393939 0 50%,#727272 0 75%,#2f2f2f 0)}
.email-color-mode-icon.image{position:relative;border-radius:3px;background:linear-gradient(135deg,#303030 0 49%,#8d8c8c 51% 100%)}
.email-color-mode-icon.image::after{content:"";position:absolute;left:2.5px;top:2.5px;width:2px;height:2px;border-radius:50%;background:#eee}
.email-color-mode-divider{width:1px;height:12px;flex:none;background:#444;transition:opacity .16s ease}
.email-color-mode-divider.is-hidden{opacity:0}
.email-color-sv{position:relative;width:100%;height:125px;margin-top:10px;border-radius:8px;background-color:var(--email-hue-base,#f00);background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent);cursor:default;user-select:none;touch-action:none}
.email-color-sv-cursor{position:absolute;width:12px;height:12px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.4),0 1px 2px rgba(0,0,0,.35);transform:translate(-50%,-50%);pointer-events:none}
.email-color-hue,.email-color-alpha{-webkit-appearance:none;appearance:none;width:100%;height:14px;margin:0;padding:0;border:0;background:transparent;outline:0}
.email-color-hue::-webkit-slider-runnable-track{height:8px;border-radius:4px;background:linear-gradient(to right,#f00 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,#f00 100%)}
.email-color-alpha::-webkit-slider-runnable-track{height:8px;border-radius:4px;background:linear-gradient(to right,transparent,var(--email-alpha-base,#fff)),linear-gradient(45deg,#252525 25%,transparent 25%,transparent 75%,#252525 75%),linear-gradient(45deg,#252525 25%,#0c0c0c 25%,#0c0c0c 75%,#252525 75%);background-size:100% 100%,8px 8px,8px 8px;background-position:0 0,0 0,4px 4px}
.email-color-hue::-webkit-slider-thumb,.email-color-alpha::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;box-sizing:border-box;width:14px;height:14px;margin-top:-3px;border:3px solid #fff;border-radius:50%;background:transparent;box-shadow:0 0 4px 1px rgba(0,0,0,.25);cursor:pointer}
.email-color-hue::-moz-range-track{height:8px;border-radius:4px;background:linear-gradient(to right,#f00 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,#f00 100%)}
.email-color-alpha::-moz-range-track{height:8px;border-radius:4px;background:linear-gradient(to right,transparent,var(--email-alpha-base,#fff)),linear-gradient(45deg,#252525 25%,transparent 25%,transparent 75%,#252525 75%),linear-gradient(45deg,#252525 25%,#0c0c0c 25%,#0c0c0c 75%,#252525 75%);background-size:100% 100%,8px 8px,8px 8px;background-position:0 0,0 0,4px 4px}
.email-color-hue::-moz-range-thumb,.email-color-alpha::-moz-range-thumb{box-sizing:border-box;width:14px;height:14px;border:3px solid #fff;border-radius:50%;background:transparent;box-shadow:0 0 4px 1px rgba(0,0,0,.25);cursor:pointer}
.email-color-fields{display:flex;gap:10px}
.email-color-field{flex:1;min-width:0;height:29px;padding:0 10px;border:0;border-radius:8px;outline:1px solid transparent;outline-offset:-1px;background:#2b2b2b;color:#fff;font:400 12px/1 Inter;font-variant-numeric:tabular-nums;box-sizing:border-box}
.email-color-field:hover{background:#323232}
.email-color-field:focus{outline-color:var(--brand)}
.email-color-format,.email-color-eyedropper{height:30px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}
.email-color-eyedropper{justify-content:center}
.email-color-new-style{width:100%;height:30px;padding:0;border:0;border-radius:8px;background:#2b2b2b;color:#fff;font:500 12px/1 Inter;cursor:pointer}
.email-color-new-style:hover{background:#323232}
.email-color-new-style-form{display:flex;flex-direction:column;gap:0;animation:emailColorStyleIn .18s ease}
.email-color-new-style-form>*+*{margin-top:10px}
.email-color-new-style-form>.email-color-sv{margin-top:16px}
.email-color-new-style-form>.email-color-alpha{margin-top:8px}
.email-color-new-style-form>.email-color-divider,.email-color-new-style-form>.email-color-create{margin-top:15px}
.email-color-scheme{position:relative;display:flex;align-items:center;height:29px;padding:1px;border-radius:8px;background:#2b2b2b;box-sizing:border-box}
.email-color-scheme-pill{position:absolute;inset:1px auto 1px 1px;width:calc(50% - 1px);border:1px solid #4f4f4f;border-radius:6px;background:#404040;box-sizing:border-box;transform:translateX(calc(var(--email-color-scheme-index,0)*100%));transition:transform .22s cubic-bezier(.4,0,.2,1);pointer-events:none}
.email-color-scheme button{position:relative;z-index:1;flex:1;height:27px;padding:0;border:0;background:transparent;color:#999;display:flex;align-items:center;justify-content:center;cursor:pointer}
.email-color-scheme button.is-on{color:#fff}
.email-color-scheme svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.email-color-divider{width:100%;height:1px;margin-top:5px;background:#252525}
.email-color-create{width:100%;height:30px;padding:0;border:0;border-radius:8px;background:var(--brand);color:#fff;font:700 12px/1 Inter;cursor:pointer}
.email-color-create:disabled{opacity:.5;cursor:default}
.email-color-gradient-bar{display:flex;align-items:center;gap:8px}
.email-color-gradient-track{position:relative;flex:1;height:8px;border-radius:4px;box-shadow:0 0 0 1px rgba(255,255,255,.06);cursor:default;touch-action:none}
.email-color-gradient-stop{position:absolute;top:50%;width:14px;height:14px;padding:0;border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%);cursor:grab;box-shadow:0 0 0 1px rgba(0,0,0,.5),0 1px 2px rgba(0,0,0,.35)}
.email-color-gradient-stop.is-active{box-shadow:0 0 0 1px var(--brand),0 1px 2px rgba(0,0,0,.35)}
.email-color-image-drop{width:100%;height:156px;border-radius:8px;background:#1f1f1f;display:flex;align-items:center;justify-content:center;overflow:hidden}
.email-color-choose-image{height:30px;padding:0 16px;border:0;border-radius:8px;background:#2b2b2b;color:#fff;font:500 12px/1 Inter;cursor:pointer}
@keyframes emailColorStyleIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
.email-inspector-menu{--brand:#09f;position:fixed;z-index:11001;min-width:200px;padding:5px;border:1px solid rgba(255,255,255,.06);border-radius:13px;background:#2b2b2b;box-shadow:0 12px 36px rgba(0,0,0,.55);display:flex;flex-direction:column;box-sizing:border-box;color:#fff;font-family:'Inter',system-ui,sans-serif;transform-origin:top left;animation:emailInspectorPopupIn .18s cubic-bezier(.2,.9,.32,1.18) both}
.email-inspector-menu.is-styles{width:191px;min-width:191px}
.email-inspector-menu.is-a11y{width:103px;min-width:103px}
.email-inspector-menu-search{height:32px;padding:6px 8px;display:flex;align-items:center;gap:6px;box-sizing:border-box;color:#999}
.email-inspector-menu-search svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;flex:none}
.email-inspector-menu-search input{flex:1;min-width:0;padding:0;border:0;outline:0;background:transparent;color:#fff;font:500 12px/1 Inter}
.email-inspector-menu-search input::placeholder{color:#999}
.email-inspector-menu-divider{height:1px;margin:5px 0;background:#363636;flex:none}
.email-inspector-menu-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.email-inspector-menu-option{width:100%;height:32px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:#fff;display:flex;align-items:center;justify-content:space-between;text-align:left;font:500 12px/1.2 Inter;cursor:pointer;transition:background-color .12s ease}
.email-inspector-menu.is-styles .email-inspector-menu-option{height:30px}
.email-inspector-menu-option:hover:not(:disabled){background:var(--brand)}
.email-inspector-menu-option:disabled{color:#6e6e72;cursor:not-allowed}
.email-inspector-menu-option svg{width:5px;height:8px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.email-inspector-menu-option-check{width:22px;flex:none;color:rgba(255,255,255,.4)}
.email-inspector-menu-option-label{flex:1;min-width:0}
.email-inspector-menu-option-sub{display:block;margin-top:2px;color:#999;font-size:10px}
.email-inspector-chip{width:133px;height:29px;padding:2px 6px 2px 4px;border:0;border-radius:8px;background:#2b2b2b;display:flex;align-items:center;gap:8px;box-sizing:border-box;color:#fff;font:500 12px/1 Inter;cursor:pointer}
.email-inspector-chip-icon{width:22px;height:22px;border-radius:4px;background:var(--brand);display:flex;align-items:center;justify-content:center;color:#fff;font:700 11px/1 Inter}
.email-inspector-chip-icon.is-swatch{border:1px solid #404040;box-sizing:border-box;background-color:#424242;background-image:linear-gradient(45deg,#303030 25%,transparent 25%,transparent 75%,#303030 75%),linear-gradient(45deg,#303030 25%,transparent 25%,transparent 75%,#303030 75%);background-size:22px 22px;background-position:0 0,11px 11px}
.email-inspector-chip-icon.is-minmax{background-color:#3a3a3a;background-image:linear-gradient(rgba(255,255,255,.1),rgba(255,255,255,.1))}.email-inspector-chip-icon.is-minmax svg{width:13px;height:9px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.email-inspector-chip-icon.is-cursor{background-color:#666;background-repeat:no-repeat}
.email-inspector-chip-icon svg{display:block;width:12px;height:12px;fill:currentColor}
.email-inspector-chip-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.email-inspector-chip-remove{width:14px;height:18px;padding:0;border:0;background:transparent;color:#999;display:flex;align-items:center;justify-content:center;cursor:pointer}.email-inspector-chip-remove svg{width:10px;height:10px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.email-cursor-picker{--brand:#09f;position:fixed;z-index:11001;width:260px;height:437px;border:1px solid rgba(255,255,255,.08);border-radius:18.82px;background:#111;box-shadow:0 24px 60px rgba(0,0,0,.6);display:flex;flex-direction:column;overflow:hidden;color:#fff;font-family:'Inter',system-ui,sans-serif}
.email-cursor-picker-header{padding:16px;border-bottom:2px solid #252525;display:flex;align-items:center;justify-content:space-between;color:#fff;font-size:13px;font-weight:600;cursor:grab;user-select:none;touch-action:none}
.email-cursor-picker-close{width:18px;height:18px;padding:0;border:0;background:transparent;color:#999;display:flex;align-items:center;justify-content:center;cursor:pointer}
.email-cursor-picker-scroll{flex:1;min-height:0;padding:16px;overflow-y:auto;overflow-x:hidden;scrollbar-width:none}
.email-cursor-picker-scroll::-webkit-scrollbar{display:none}
.email-cursor-picker-image{position:relative;width:100%;aspect-ratio:272/1024;background:url('/cursors/cursor-picker.svg') top left/100% auto no-repeat}
.email-cursor-tile{position:absolute;padding:0;border:0;border-radius:11.59%;background:transparent;cursor:pointer}
.email-cursor-tile.is-selected{box-shadow:inset 0 0 0 1.18px var(--brand)}
.email-config-popup{--brand:#09f;position:fixed;z-index:11000;width:260px;border-radius:16px;background:#111;box-shadow:rgba(0,0,0,.1) 0 10px 30px,rgba(0,0,0,.02) 0 1px 4px;overflow:hidden;color:#fff;font-family:'Inter',system-ui,sans-serif}
.email-config-popup-header{position:absolute;inset:0 0 auto;height:50px;cursor:grab;user-select:none;touch-action:none}
.email-config-popup-titlebar{position:absolute;top:15px;left:15px;right:15px;height:20px;display:flex;align-items:center;justify-content:space-between;font:700 12px/1 Inter}
.email-config-popup-close{width:18px;height:18px;padding:0;border:0;background:transparent;color:#999;display:flex;align-items:center;justify-content:center;cursor:pointer}
.email-config-popup-divider{position:absolute;left:16px;top:48px;width:228px;height:1px;background:#252525}
.email-config-row{position:absolute;left:0;width:100%;height:29px;display:grid;grid-template-columns:111.5px 133px;align-items:center}
.email-config-row-label{padding-left:30px;color:#ccc;font:500 12px/1 Inter}
.email-config-row-control{width:133px;height:29px;display:flex;align-items:center;gap:10px}
.email-config-row-control>.email-inspector-number,.email-config-row-control>.email-inspector-select{flex:1;min-width:0;width:auto}
.email-config-row-control>.email-inspector-color{width:133px}
.email-config-popup .email-inspector-segment{width:133px}
.email-config-pair{width:133px;height:29px;display:flex;align-items:center;gap:11.5px}.email-config-pair>.email-inspector-number,.email-config-pair>.email-inspector-segment{flex:none!important;width:61px!important}.email-config-pair>.email-inspector-segment svg{width:12px;height:12px}
.email-config-stepper{position:relative;width:61px;height:29px;flex:none;border-radius:8px;background:#2b2b2b}
.email-config-stepper:after{content:'';position:absolute;left:30px;top:7.5px;width:1px;height:14px;border-radius:.5px;background:#444}
.email-config-stepper button{position:absolute;z-index:1;top:1px;width:28.5px;height:27px;padding:0;border:0;border-radius:6px;background:transparent;cursor:pointer}.email-config-stepper button:first-of-type{left:1px}.email-config-stepper button:last-of-type{left:31.5px}
.email-config-stepper svg{position:absolute;pointer-events:none;fill:#999}.email-config-stepper .minus{left:10.25px;top:9.5px;width:9.5px;height:9.5px}.email-config-stepper .plus{left:40.25px;top:9px;width:11.5px;height:11.5px}
.email-font-popup{--brand:#09f;position:fixed;z-index:11000;width:260px;height:440px;border:1px solid rgba(255,255,255,.06);border-radius:16px;background:#111;box-shadow:0 12px 36px rgba(0,0,0,.55);box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;color:#fff;font-family:Inter,system-ui,sans-serif}
.email-font-popup-header{display:flex;align-items:center;justify-content:space-between;padding:15px 15px 0;flex:none;color:#fff;font:700 12px/1 Inter;cursor:grab;user-select:none;touch-action:none}
.email-font-popup-close{padding:2px;border:0;background:none;color:#999;display:inline-flex;cursor:pointer}
.email-font-popup-search{padding:11px 15px 0;flex:none}
.email-font-popup-search input{width:100%;height:29px;padding:0 10px;border:1px solid transparent;border-radius:8px;outline:0;background:#2b2b2b;color:#fff;font:500 12px/1 Inter;box-sizing:border-box}
.email-font-popup-search input:focus{border-color:var(--brand)}
.email-font-popup-filters{display:flex;gap:10px;padding:10px 15px 20px;flex:none}
.email-font-popup-filters .email-inspector-select{width:110px}
.email-font-popup-list{flex:1;min-height:0;padding:0 15px 12px;overflow-y:auto;scrollbar-width:none}
.email-font-popup-list::-webkit-scrollbar{display:none}
.email-font-popup-row{width:100%;height:30px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:#fff;display:flex;align-items:center;text-align:left;font-size:12px;font-weight:400;cursor:pointer;box-sizing:border-box}
.email-font-popup-row:hover{background:#1e1e1e}.email-font-popup-row.is-selected{background:var(--brand)}
.email-font-popup-row-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.email-font-popup-row-dots{display:none;flex:none;align-items:center}.email-font-popup-row:hover .email-font-popup-row-dots,.email-font-popup-row.is-selected .email-font-popup-row-dots{display:inline-flex}.email-font-popup-row-dots svg{width:16px;height:16px;fill:#fff}
.email-font-field{width:133px;height:29px;padding:0 28px 0 10px;border:0;border-radius:8px;background:#2b2b2b;color:#e0e0e0;text-align:left;font:500 12px/1 Inter;cursor:pointer;position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.email-font-field:after{content:'';position:absolute;right:8px;top:50%;width:8px;height:8px;transform:translateY(-50%);background:url("data:image/svg+xml;utf8,") center/8px 8px no-repeat}
@keyframes emailInspectorPopupIn{from{opacity:0;transform:scale(.92) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}
.email-inspector-add-field{width:133px;height:29px;padding:0 10px;border:0;border-radius:8px;background:#2b2b2b;color:#999;display:flex;align-items:center;gap:7px;font:500 12px/1 Inter;cursor:pointer;box-sizing:border-box}
.email-inspector-add-field:hover{background:#242424;color:#ccc}
.email-inspector-add-field svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.email-inspector-padding{width:133px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
.email-inspector-padding label{min-width:0}
.email-inspector-padding label span{display:block;margin-bottom:4px;text-align:center;color:#777;font:500 9px/1 Inter}
.email-inspector-padding input{width:100%;height:29px;padding:0 2px;border:0;border-radius:8px;outline:1.5px solid transparent;outline-offset:-1.5px;background:#2b2b2b;color:#e0e0e0;text-align:center;font:500 11px/1 Inter;box-sizing:border-box}
.email-inspector-padding input:focus{outline-color:var(--brand)}
.email-inspector-padding small{display:block;margin-top:3px;text-align:center;color:#707070;font:600 8px/1 Inter}
.email-layer-frame{display:block;width:100%;min-height:24px}
.email-layer-frame:empty,.email-layer-stack:empty{min-height:32px}
.email-layer-frame:empty::before,.email-layer-stack:empty::before{content:"Drop layers here";display:flex;align-items:center;justify-content:center;min-height:30px;border:1px dashed rgba(0,153,255,.28);border-radius:inherit;color:rgba(0,112,190,.58);font:600 10px/1 Inter;letter-spacing:.02em;pointer-events:none}
/* Top-mounted email copilot. It is mounted inside .sf-top so the navbar and
notch are one continuous layer; only the centered pocket extends below
the 56px bar (there is no full-width shoulder/spacer). */
.email-ai-notch{--email-nav-height:56px;--email-notch-depth:58px;position:fixed;z-index:48;left:260px;right:260px;top:0;height:114px;display:none;justify-content:center;pointer-events:none;font-family:'Inter',system-ui,sans-serif}
body.email-canvas-mode .email-ai-notch{display:flex}
.email-ai-notch-shell{position:relative;isolation:isolate;width:100%;height:114px;box-sizing:border-box;padding:0;pointer-events:none;overflow:visible}
.email-ai-notch-surface{position:absolute;z-index:0;inset:0;display:block;width:100%;height:100%;overflow:visible;fill:var(--email-nav-bg);filter:none;opacity:0;pointer-events:visiblePainted;transform:scale(.28,.55);transform-origin:50% 56px;transition:opacity .16s ease,transform .34s cubic-bezier(.22,1,.36,1),fill .2s ease}
body.email-canvas-mode .email-ai-notch-surface{opacity:1}
body.email-ai-chat-active .email-ai-notch-surface,.email-ai-notch:hover .email-ai-notch-surface{transform:scale(1)}
.email-ai-notch-history{position:absolute;z-index:1;left:50%;top:6px;bottom:6px;width:min(600px,calc(var(--email-notch-pocket,560px) - 64px));min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:0 12px;border:0;background:transparent;box-shadow:none;box-sizing:border-box;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;opacity:0;pointer-events:none;transform:translateX(-50%) translateY(-2px);transition:opacity .2s ease,transform .2s cubic-bezier(.22,1,.36,1);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 28%,#000 72%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 28%,#000 72%,transparent 100%)}
.email-ai-notch-history::-webkit-scrollbar{display:none}
body.email-ai-chat-active .email-ai-notch-history{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.email-ai-notch-message{flex:0 0 auto;width:max-content;min-width:0;max-width:92%;color:var(--email-nav-text);font:500 clamp(9.5px,.72vw,11px)/1.35 Inter;white-space:normal;overflow-wrap:anywhere;text-wrap:pretty;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.email-ai-notch-message.bot{align-self:flex-start;color:var(--email-nav-text-soft)}
.email-ai-notch-message.user{align-self:flex-end;max-width:82%;color:var(--email-nav-text-strong);text-align:right}
body.email-canvas-mode .email-breakpoint{opacity:1}
body.navved.email-canvas-mode .email-breakpoint{top:calc(50% + 32px)}
body.email-canvas-mode .email-canvas-bg{z-index:2;visibility:visible;opacity:1;transition:opacity .28s cubic-bezier(.4,0,.2,1),visibility 0s}
body.email-canvas-mode{--email-canvas-bg-color:#eee;--email-nav-bg:#fff;--email-nav-ink:#1a1a1a;--email-nav-text:rgba(28,28,32,.62);--email-nav-text-soft:rgba(28,28,32,.52);--email-nav-text-strong:rgba(28,28,32,.82);--email-nav-muted:rgba(0,0,0,.62);--email-nav-border:rgba(0,0,0,.16);--email-nav-hover:rgba(0,0,0,.06);background:var(--email-canvas-bg-color);transition:background-color .2s ease}
html[data-theme="dark"] body.email-canvas-mode{--email-canvas-bg-color:#171717;--email-nav-bg:#000;--email-nav-ink:#fff;--email-nav-text:rgba(255,255,255,.68);--email-nav-text-soft:rgba(255,255,255,.56);--email-nav-text-strong:rgba(255,255,255,.9);--email-nav-muted:rgba(255,255,255,.68);--email-nav-border:rgba(255,255,255,.2);--email-nav-hover:rgba(255,255,255,.1)}
body.email-canvas-mode .rail,
body.email-canvas-mode .sf-rail,
body.email-canvas-mode .sf-store,
body.email-canvas-mode .sf-side-backdrop,
body.email-canvas-mode #ndock{display:none!important}
body.email-canvas-mode .sf-side{border-right:1px solid rgba(255,255,255,.07)}
body.email-canvas-mode .email-inspector{top:56px;border-left-color:rgba(255,255,255,.07)}
body.email-canvas-mode .sf-topmid{display:none}
/* The email workspace keeps the shared application chrome. The left rail
identifies where the user is; the right rail keeps their working context.
Only the center canvas pans or zooms. */
body.email-canvas-mode .main{margin-left:260px!important;margin-right:0!important;padding-right:0!important;border-radius:0!important;cursor:grab;background:transparent!important}
body.email-canvas-mode.has-rail .main{margin-right:260px!important}
body.email-canvas-mode .email-canvas-bg{left:260px;right:0}
body.email-canvas-mode.has-rail .email-canvas-bg{right:260px}
body.email-canvas-mode .composer{position:fixed!important;left:260px!important;right:0!important;bottom:0!important;width:auto!important;
padding-left:22px!important;padding-right:22px!important;transform:none!important}
body.email-canvas-mode.has-rail .composer{right:260px!important}
body.sf-collapsed.email-canvas-mode .main{margin-left:64px!important}
body.sf-collapsed.email-canvas-mode .email-canvas-bg{left:64px}
body.sf-collapsed.email-canvas-mode .email-ai-notch{left:64px}
body.sf-collapsed.email-canvas-mode .composer{left:64px!important}
body.email-canvas-mode .composer .pill{margin-left:auto;margin-right:auto}
body.email-canvas-mode .main{margin-right:260px!important}
body.email-canvas-mode .email-canvas-bg{right:260px!important}
body.email-canvas-mode .composer{right:260px!important}
body.email-canvas-mode .sf-top,
html[data-theme="light"] body.email-canvas-mode .sf-top,
html[data-theme="dark"] body.email-canvas-mode .sf-top{background:var(--email-nav-bg)!important;background-color:var(--email-nav-bg)!important;opacity:1;border-bottom-color:transparent;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
body.email-canvas-mode .sf-brand,
body.email-canvas-mode .sf-store,
body.email-canvas-mode .sf-toggle,
body.email-canvas-mode .sf-brand .sf-logo{color:var(--email-nav-ink)!important}
body.email-canvas-mode .sf-brand .badge{color:var(--email-nav-muted)!important;border-color:var(--email-nav-border)!important}
body.email-canvas-mode .sf-toggle:hover,
body.email-canvas-mode .sf-store:hover{background:var(--email-nav-hover)!important}
body.email-canvas-mode .sf-top::before,
body.email-canvas-mode .sf-top::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:rgba(255,255,255,.07);pointer-events:none}
body.email-canvas-mode .sf-top::before{left:260px}
body.email-canvas-mode .sf-top::after{right:260px}
body.sf-collapsed.email-canvas-mode .sf-top::before{left:64px}
body.email-canvas-panning .main{cursor:grabbing}
body.email-canvas-mode .composer,body.email-canvas-mode .turn{cursor:default}
@media(max-height:900px){.email-breakpoint{--email-bp-scale:.72}}
@media(max-width:1100px){
.email-inspector{width:248px}
body.email-canvas-mode .main,body.email-canvas-mode.has-rail .main{margin-right:248px!important}
body.email-canvas-mode .email-canvas-bg,body.email-canvas-mode.has-rail .email-canvas-bg{right:248px!important}
.email-ai-notch{right:248px}
body.email-canvas-mode .sf-top::after{right:248px}
body.email-canvas-mode .composer,body.email-canvas-mode.has-rail .composer{right:248px!important}}
@media(max-width:720px){
.email-inspector{width:220px;top:56px}
.email-breakpoint{--email-bp-scale:.58}
body.email-canvas-mode .main{margin-left:0!important;margin-right:220px!important}
body.email-canvas-mode .email-canvas-bg{left:0;right:220px!important}
.email-ai-notch{left:0;right:220px;top:0}
body.email-canvas-mode .sf-top::before{display:none}
body.email-canvas-mode .sf-top::after{right:220px}
.email-ai-notch-shell{width:calc(100% - 28px);border-radius:0 0 30px 30px;padding-left:15px;padding-right:15px}
.email-ai-notch-history{width:min(calc(100% - 36px),calc(var(--email-notch-pocket,280px) - 40px))}
body.email-canvas-mode .composer{left:0!important;right:220px!important}}
@media(prefers-reduced-motion:reduce){.email-canvas-bg,.email-breakpoint{transition:none}}
.main{flex:1;display:flex;flex-direction:column;min-width:0;position:relative;justify-content:center}
.voice-wave-stage{position:fixed;z-index:2;left:50%;top:calc(100% - 84px);display:block;width:min(360px,52vw);height:min(110px,15vh);
--voice-stage-scale-x:.84;--voice-stage-scale-y:.38;--voice-stage-opacity:.4;--voice-stage-saturation:.92;--voice-stage-brightness:.98;
opacity:0;transform:translate(-50%,-50%) scaleX(var(--voice-stage-scale-x)) scaleY(var(--voice-stage-scale-y));pointer-events:none;background:transparent;
filter:saturate(var(--voice-stage-saturation)) brightness(var(--voice-stage-brightness));transition:opacity .12s linear,transform .08s linear,filter .08s linear}
body.voice-stage-active .voice-wave-stage{opacity:var(--voice-stage-opacity);transform:translate(-50%,-50%) scaleX(var(--voice-stage-scale-x)) scaleY(var(--voice-stage-scale-y))}
body.voice-stage-user-speaking .voice-wave-stage,body.voice-stage-speaking .voice-wave-stage{opacity:var(--voice-stage-opacity);animation:none}
body.shopify .voice-wave-stage{z-index:6}
body.voice-companion-active.shopify[data-view="website"] .main>.composer,
body.voice-companion-active.shopify[data-view="site-hub"] .main>.composer,
body.voice-companion-active[data-view="board"] .main>.composer,
body.voice-companion-active[data-view="tasks"] .main>.composer{display:flex!important}
@media(max-width:720px){.voice-wave-stage{top:calc(100% - 76px);width:64vw;height:13vh}}
@media(prefers-reduced-motion:reduce){body.voice-stage-active .voice-wave-stage{transition:none;transform:translate(-50%,-50%) scaleX(.84) scaleY(.38)}}
.thread{flex:0 1 auto;overflow-y:auto;display:flex;flex-direction:column;position:relative;z-index:1}
.inner{width:100%;max-width:720px;margin:0 auto;padding:0 22px;display:flex;flex-direction:column;flex:1}
/* hero (empty state) */
.hero{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding-bottom:0;animation:rise .9s cubic-bezier(.2,.8,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.hero .lk{display:flex;align-items:center;justify-content:center;gap:12px;width:100%}
.hero .lk .tri{width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-bottom:27px solid var(--accent)}
.hero .lk .wm{font-size:38px;font-weight:800;letter-spacing:-.02em}
.hero .lk .logo{height:54px;width:auto;max-width:88%;display:block;color:#ffffff}
.email-campaign-title{display:none;margin:0;max-width:100%;color:#fff;font:720 clamp(32px,4.3vw,52px)/1.06 Inter;letter-spacing:-.042em;text-align:center;text-wrap:balance}
body.email-campaign-mode .hero .lk{display:none}
body.email-campaign-mode .email-campaign-title{display:block}
.hero .sub{color:var(--dim);font-size:15px;margin-top:0;text-align:center}
body.started .hero{display:none}
body.started .thread{flex:1}
/* Empty/home state: pull the composer pill up close to the logo+title.
Collapse the empty chat block's dead padding and trim the composer's top
gap. Only applies before a conversation starts — message spacing in the
started state is untouched. */
body:not(.started) .chat{padding:0}
body:not(.started) .composer{padding-top:22px}
/* chat */
.chat{display:flex;flex-direction:column;gap:18px;padding:26px 0 16px;min-width:0}
.assistant-transcript-home{display:none!important}
.assistant-tray{position:fixed;left:260px;right:0;top:64px;bottom:98px;z-index:6;display:none;align-items:flex-end;justify-content:center;padding:0 24px;pointer-events:none;transition:left .46s cubic-bezier(.22,1,.36,1),right .46s cubic-bezier(.22,1,.36,1)}
.assistant-tray.open{display:flex}
.assistant-tray-panel{width:min(760px,100%);max-height:min(58vh,620px);overflow:hidden;pointer-events:none}
.assistant-tray-panel>.chat{max-height:min(58vh,620px);overflow-y:auto;overscroll-behavior:contain;padding:28px 18px 22px;scrollbar-width:none;pointer-events:none;mask-image:linear-gradient(to bottom,transparent 0,#000 28px,#000 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 28px,#000 100%)}
.assistant-tray-panel>.chat::-webkit-scrollbar{display:none}
.assistant-tray-panel .turn,.assistant-tray-panel .bub{pointer-events:none}
.assistant-tray-panel button,.assistant-tray-panel a,.assistant-tray-panel input,.assistant-tray-panel textarea,.assistant-tray-panel select,.assistant-tray-panel [role="button"]{pointer-events:auto}
body.sf-collapsed .assistant-tray{left:64px}
@media(min-width:1101px){body.has-rail .assistant-tray{right:260px}}
@media(max-width:720px){.assistant-tray{left:0;right:0;top:56px;bottom:88px;padding:0 14px}.assistant-tray-panel>.chat{padding-left:8px;padding-right:8px}}
.turn{display:flex;flex-direction:column;gap:10px;min-width:0;max-width:100%}
.turn.me{align-items:flex-end}
.bub{min-width:0;max-width:90%;font-size:15.5px;overflow-wrap:anywhere;word-break:break-word}
.turn.me .bub{background:var(--surface);border-radius:20px;padding:11px 16px;max-width:80%;white-space:pre-wrap}
.turn.bot .bub{padding:1px 0}
.turn.bot.voice-live .bub{position:relative;padding-right:13px}
.turn.bot.voice-live .bub::after{content:"";display:inline-block;width:6px;height:6px;margin-left:7px;border-radius:50%;background:currentColor;vertical-align:middle;opacity:.7;animation:voiceTranscriptPulse .8s ease-in-out infinite alternate}
@keyframes voiceTranscriptPulse{from{transform:scale(.72);opacity:.35}to{transform:scale(1);opacity:.9}}
/* The command-center conversation always sits on a black canvas. Pin both
sides of the exchange to clean white copy so dashboard theme tokens can
never make a submitted prompt or AI reply disappear into that canvas. */
html[data-theme="dark"] body[data-view="home"] .chat .turn .bub,
html[data-theme="dark"] body:not([data-view]) .chat .turn .bub{color:#fff}
.bub .chat-link{color:#006eff;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere;cursor:pointer}
.bub .chat-link:hover{color:#0057cc;text-decoration-thickness:2px}
.bub .chat-link:focus-visible{outline:2px solid #006eff;outline-offset:3px;border-radius:3px}
.step{color:var(--dim);font-size:13px;font-style:italic}
.typing{display:inline-flex;gap:4px;padding:6px 0}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--dim);animation:bl 1.2s infinite}
.typing i:nth-child(2){animation-delay:.18s}.typing i:nth-child(3){animation-delay:.36s}
@keyframes bl{0%,60%,100%{opacity:.25}30%{opacity:1}}
/* Status "chime": a solid-color band sweeps left→right across the status
text (Thinking / Searching …) while the assistant works — replaces dots. */
/* Two layers: a SOLID --dim base that always fills the whole word (so it can
never become invisible), plus a brighter band that sweeps across on top. */
.status-chime{display:inline-block;padding:6px 0;font:600 16px 'Inter';
background-image:linear-gradient(90deg,transparent 0%,var(--ink) 50%,transparent 100%),linear-gradient(var(--dim),var(--dim));
background-size:55% 100%,100% 100%;background-repeat:no-repeat,no-repeat;
background-position:-60% center,0 0;
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
animation:chime 1.9s linear infinite}
@keyframes chime{0%{background-position:-60% center,0 0}100%{background-position:160% center,0 0}}
@media (prefers-reduced-motion:reduce){.status-chime{animation:none;-webkit-text-fill-color:var(--dim);color:var(--dim)}}
.bub.loading{display:flex;align-items:baseline;flex-wrap:wrap;max-width:100%;background:none!important;box-shadow:none!important;padding:0!important}
/* Thinking stages — the live "what it's working through" list that cascades in
under the "Thinking" chime while the assistant works. Mirrors the .bdna-stp
dot/pulse language (pending dot -> active accent pulse -> done check). */
/* Thinking — ONE live line: the shimmering "Thinking" chime, the current step
(crossfades in place, never stacks), and a real-time meta tail (elapsed ·
tokens). Replaces the old stacked checklist. */
.think-now{font:500 15px 'Inter';color:var(--muted);opacity:0;transition:opacity .26s ease}
.think-now.show{opacity:1}
.think-meta{font:500 14px 'Inter';color:var(--dim);white-space:nowrap}
.think-cancel{margin-left:7px;padding:2px 5px;border:0;border-radius:6px;background:transparent;color:var(--dim);font:600 11px 'Inter';cursor:pointer;opacity:.55;transition:opacity .18s ease,background .18s ease,color .18s ease}
.think-cancel:hover,.think-cancel:focus-visible{opacity:1;background:var(--surface);color:var(--ink);outline:0}
@media (prefers-reduced-motion:reduce){.think-now{transition:none}}
/* Queue processing dots reuse this restrained pulse; the assistant's own
activity remains the original single shimmering status line above. */
@keyframes lpPulse{50%{opacity:.45;transform:scale(.76);box-shadow:0 0 0 6px rgba(59,130,246,0)}}
/* Queued user turns stay editable and physically remain in the transcript.
Their state morphs in place instead of being removed/reinserted. */
.turn.queue-turn{animation:queueRise .28s cubic-bezier(.22,1,.36,1)}
.turn.queue-turn .bub{position:relative;min-width:min(360px,80vw);overflow:hidden;border:1px solid color-mix(in srgb,var(--line-2) 74%,transparent);transition:background .24s ease,border-color .24s ease,box-shadow .24s ease,transform .24s cubic-bezier(.22,1,.36,1)}
.turn.queue-turn[data-state="processing"] .bub{border-color:rgba(59,130,246,.42);box-shadow:0 12px 34px -26px rgba(59,130,246,.72);transform:translateY(-1px)}
.turn.queue-turn[data-state="failed"] .bub{border-color:rgba(255,69,58,.34)}
.turn.queue-turn[data-state="cancelled"] .bub{opacity:.58}
.q-text{white-space:pre-wrap;overflow-wrap:anywhere}
.q-files{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}.q-file{padding:4px 7px;border-radius:7px;background:color-mix(in srgb,var(--surface) 78%,transparent);color:var(--dim);font:600 9.5px 'Inter'}
.q-foot{display:flex;align-items:center;gap:7px;margin-top:8px;padding-top:8px;border-top:1px solid color-mix(in srgb,var(--line-2) 65%,transparent)}
.q-status{display:inline-flex;align-items:center;gap:6px;margin-right:auto;color:var(--dim);font:650 10.5px 'Inter';letter-spacing:.02em}
.q-status::before{content:"";width:7px;height:7px;border-radius:50%;background:#a3a3aa}
.turn.queue-turn[data-state="processing"] .q-status{color:#2f75df}.turn.queue-turn[data-state="processing"] .q-status::before{background:#3b82f6;animation:lpPulse 1.2s ease infinite}
.turn.queue-turn[data-state="completed"] .q-status{color:#24864a}.turn.queue-turn[data-state="completed"] .q-status::before{background:#34c759}
.turn.queue-turn[data-state="failed"] .q-status{color:#d4463d}.turn.queue-turn[data-state="failed"] .q-status::before{background:#ff453a}
.turn.queue-turn[data-state="cancelled"] .q-status::before{background:#8e8e93}
.q-action{border:0;background:transparent;color:var(--dim);font:600 10.5px 'Inter';cursor:pointer;padding:4px 5px;border-radius:6px;transition:background .18s,color .18s}
.q-action:hover{background:color-mix(in srgb,var(--surface) 82%,transparent);color:var(--ink)}
.q-action:disabled{opacity:.28;pointer-events:none}
.q-editor{width:100%;min-height:72px;resize:vertical;border:1px solid #3b82f6;border-radius:11px;background:var(--bg);color:var(--ink);padding:9px 10px;outline:0;font:500 14px/1.45 'Inter';box-shadow:0 0 0 3px rgba(59,130,246,.1)}
/* ChatGPT-style steer queue: follow-up turns share one connected tray directly
above the composer. The hidden transcript rows become normal user messages
only when their turn starts processing. */
.steer-tray{display:none;width:100%;max-width:720px;margin:0 auto -13px;padding:7px 14px 15px;border:1px solid rgba(0,0,0,.12);border-bottom:0;border-radius:24px 24px 0 0;background:rgba(255,255,255,.96);color:#242424;box-shadow:0 -12px 34px -30px rgba(0,0,0,.42);pointer-events:auto;position:relative;z-index:0}
.steer-tray.on{display:block;animation:steerTrayIn .22s cubic-bezier(.22,1,.36,1)}
.steer-row{min-height:42px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;position:relative;padding:0 2px}
.steer-row+.steer-row{border-top:1px solid rgba(0,0,0,.075)}
.steer-copy{min-width:0;display:flex;align-items:center;gap:9px;font:500 14px/1.35 Inter}
.steer-hook{flex:none;color:#a5a5a5;font:500 17px/1 Georgia,serif}
.steer-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.steer-files{flex:none;color:#8b8b8b;font:500 10px Inter}
.steer-side{display:flex;align-items:center;gap:3px;color:#929292}
.steer-label{display:inline-flex;align-items:center;gap:5px;margin-right:4px;white-space:nowrap;font:500 13px Inter;color:#8f8f8f}
.steer-label::before{content:"↳";font:500 15px/1 Georgia,serif;color:#aaa}
.steer-icon{width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:#979797;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,color .15s ease}
.steer-icon:hover{background:#ededed;color:#333}
.steer-icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}
.steer-more{position:relative}
.steer-menu{position:absolute;right:0;top:34px;width:132px;padding:5px;border:1px solid #e2e2e2;border-radius:12px;background:#fff;box-shadow:0 16px 42px -22px rgba(0,0,0,.44);z-index:6}
.steer-menu button{width:100%;height:30px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:#555;text-align:left;font:500 11px Inter;cursor:pointer}
.steer-menu button:hover{background:#f2f2f2;color:#222}
.steer-editor{width:100%;height:32px;resize:none;border:1px solid #cfcfcf;border-radius:9px;background:#fff;color:#222;padding:6px 8px;outline:none;font:500 13px/1.35 Inter}
.steer-editor:focus{border-color:#999;box-shadow:0 0 0 2px rgba(0,0,0,.05)}
.steer-edit-actions{display:flex;align-items:center;gap:4px}
.steer-edit-actions button{height:28px;padding:0 9px;border:0;border-radius:8px;background:#eee;color:#555;font:600 10px Inter;cursor:pointer}
.steer-edit-actions button:first-child{background:#222;color:#fff}
.turn.queue-turn[data-state="queued"]{display:none}
@keyframes steerTrayIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
html[data-theme="dark"] .steer-tray{border-color:rgba(255,255,255,.13);background:rgba(31,31,31,.97);color:#f1f1f1;box-shadow:0 -12px 34px -28px rgba(0,0,0,.8)}
html[data-theme="dark"] .steer-row+.steer-row{border-top-color:rgba(255,255,255,.09)}
html[data-theme="dark"] .steer-icon:hover{background:#333;color:#fff}
html[data-theme="dark"] .steer-menu{border-color:#3b3b3b;background:#242424}
html[data-theme="dark"] .steer-menu button{color:#c8c8c8}
html[data-theme="dark"] .steer-menu button:hover{background:#333;color:#fff}
@media(max-width:560px){.steer-tray{padding-left:10px;padding-right:10px}.steer-row{gap:6px}.steer-label{font-size:11.5px}.steer-icon{width:27px}.steer-copy{font-size:12.5px}}
@keyframes queueRise{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
/* Token reveal after generation: words resolve left-to-right, with a live
cursor that disappears when structured cards are attached. */
.stream-copy{white-space:pre-wrap}
.stream-token{opacity:0;filter:blur(2px);animation:tokenIn .22s ease forwards}
.stream-cursor{display:inline-block;width:2px;height:1.1em;margin-left:2px;vertical-align:-.15em;border-radius:2px;background:#3b82f6;animation:caretBlink 1s step-end infinite}
@keyframes tokenIn{to{opacity:1;filter:blur(0)}}
/* Attachment chips live above the pinned pill. FileReader progress drives the
fill; images and text files are captured with the queued turn. */
.attach-tray{display:none;width:100%;max-width:720px;gap:7px;flex-wrap:wrap;padding:0 8px 8px}
.attach-tray.on{display:flex;animation:queueRise .24s cubic-bezier(.22,1,.36,1)}
.attach-chip{position:relative;max-width:220px;display:flex;align-items:center;gap:8px;overflow:hidden;padding:7px 9px;border:1px solid var(--line-2);border-radius:11px;background:color-mix(in srgb,var(--surface-2) 94%,transparent);color:var(--ink)}
.attach-chip::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:var(--upload,0%);background:#3b82f6;transition:width .18s ease}
.attach-ic{width:24px;height:24px;flex:none;border-radius:7px;background:rgba(59,130,246,.12);color:#3b82f6;display:flex;align-items:center;justify-content:center;font:750 9px 'Inter'}
.attach-copy{min-width:0}.attach-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 11.5px 'Inter'}.attach-size{display:block;color:var(--dim);font:500 9.5px 'Inter'}
.attach-x{border:0;background:none;color:var(--dim);font-size:15px;line-height:1;cursor:pointer}
.composer.file-over .pill{box-shadow:inset 0 0 0 1.5px #3b82f6,0 12px 36px -18px rgba(59,130,246,.6)}
/* Per-reply usage line: real token count + elapsed, shown under the answer. */
.turn-meta{margin-top:7px;font:500 12.5px 'Inter';color:var(--dim);letter-spacing:.01em;opacity:0;animation:metaIn .45s ease forwards}
.execution-receipts{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px;max-width:min(680px,100%);opacity:0;animation:metaIn .35s ease forwards}
.execution-receipt{display:inline-flex;align-items:center;gap:6px;min-height:27px;padding:4px 9px;border:1px solid var(--line-2);border-radius:999px;background:color-mix(in srgb,var(--surface-2) 90%,transparent);color:var(--dim);font:600 10.5px/1.2 'Inter'}
.execution-receipt::before{content:"";width:6px;height:6px;border-radius:50%;background:#34c759;box-shadow:0 0 0 3px rgba(52,199,89,.1)}
.execution-receipt.pending::before{background:#ff9f0a;box-shadow:0 0 0 3px rgba(255,159,10,.12)}
.execution-receipt.failed::before{background:#ff453a;box-shadow:0 0 0 3px rgba(255,69,58,.12)}
@keyframes metaIn{to{opacity:1}}
/* Source-backed research trail. It appears below the live thinking line as
real tool results arrive, then settles into a compact citations rail. */
.research-trail{display:none;max-width:min(680px,100%);margin-top:2px;animation:metaIn .3s ease}
.research-trail.on{display:block}
.research-trail-head{display:flex;align-items:center;gap:7px;margin-bottom:8px;color:var(--dim);font:650 11px/1.2 'Inter';letter-spacing:.035em;text-transform:uppercase}
.research-trail-head::before{content:"";width:6px;height:6px;border-radius:50%;background:#3b82f6;box-shadow:0 0 0 4px rgba(59,130,246,.1);animation:lpPulse 1.2s ease infinite}
.research-trail.done .research-trail-head::before{background:#34c759;box-shadow:none;animation:none}
.research-source-list{display:flex;gap:7px;flex-wrap:wrap}
.research-source{display:flex;align-items:center;gap:7px;min-width:0;max-width:230px;height:34px;padding:0 10px 0 6px;border:1px solid var(--line-2);border-radius:10px;background:color-mix(in srgb,var(--surface-2) 92%,transparent);color:var(--ink);text-decoration:none;transition:background .16s ease,border-color .16s ease,transform .16s ease}
.research-source:hover{background:var(--surface);border-color:color-mix(in srgb,var(--dim) 38%,var(--line-2));transform:translateY(-1px)}
.research-source:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}
.research-favicon,.research-fallback{width:20px;height:20px;flex:none;border-radius:6px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.08);object-fit:contain}
.research-fallback{display:grid;place-items:center;background:var(--surface);color:var(--dim);font:750 9px/1 'Inter';text-transform:uppercase}
.research-source-copy{min-width:0;display:flex;flex-direction:column;line-height:1.12}
.research-action{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--dim);font:550 9px 'Inter'}
.research-domain{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);font:650 10.5px 'Inter'}
@media(max-width:560px){.research-source{max-width:calc(50% - 4px);flex:1 1 145px}.research-source-list{gap:6px}}
/* Visual plan card — the agent's :::plan block rendered as a step-by-step
wireframe: numbered nodes on a timeline, title, and approve/adjust actions. */
.plan-card{margin-top:12px;border:1px solid var(--line-2);border-radius:16px;background:var(--surface-2);padding:16px 16px 14px;max-width:560px;animation:metaIn .4s ease}
.plan-head{display:flex;align-items:center;gap:9px;margin-bottom:14px}
.plan-badge{font:600 10.5px 'Inter';letter-spacing:.07em;text-transform:uppercase;color:var(--accent);background:rgba(var(--accent-rgb),.14);padding:3px 8px;border-radius:999px}
.plan-title{font:650 15px 'Inter';color:var(--ink)}
.plan-steps{list-style:none;margin:0;padding:0}
.plan-step{display:flex;gap:12px;padding:0 0 15px;position:relative}
.plan-step:last-child{padding-bottom:0}
.plan-step:before{content:'';position:absolute;left:12px;top:27px;bottom:-3px;width:1.5px;background:var(--line-2)}
.plan-step:last-child:before{display:none}
.plan-num{flex:none;width:25px;height:25px;border-radius:50%;border:1.5px solid var(--accent);color:var(--accent);background:var(--bg);font:600 12px 'Inter';display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.plan-body{padding-top:2px;min-width:0}
.plan-step-t{font:600 14px 'Inter';color:var(--ink);line-height:1.3}
.plan-step-d{font:400 13px 'Inter';color:var(--dim);line-height:1.45;margin-top:2px}
.plan-actions{display:flex;gap:8px;margin-top:15px;padding-top:14px;border-top:1px solid var(--line)}
.plan-approve{border:0;background:var(--ink);color:var(--bg);font:600 13px 'Inter';padding:9px 16px;border-radius:999px;cursor:pointer}
.plan-approve:hover{opacity:.9}
.plan-adjust{border:1px solid var(--line-2);background:transparent;color:var(--ink);font:600 13px 'Inter';padding:9px 14px;border-radius:999px;cursor:pointer}
.plan-adjust:hover{background:var(--surface)}
.plan-done{font:600 13px 'Inter';color:var(--dim)}
/* Orders execution copilot. A plan becomes a durable working object instead
of disappearing into chat: order identity, editable steps, approvals,
progress, evidence and the next executable move stay together. */
.oe-card{margin-top:12px;border:1px solid #dfdfe3;border-radius:20px;background:#fff;color:#202024;overflow:hidden;box-shadow:0 22px 60px -48px rgba(0,0,0,.72);animation:ordAiWidgetIn .36s cubic-bezier(.22,1,.36,1)}
.oe-card-head{display:flex;align-items:flex-start;gap:12px;padding:17px 18px 14px;border-bottom:1px solid #ececef}
.oe-orb{position:relative;flex:none;width:33px;height:33px;border-radius:11px;background:#171719;color:#fff;display:flex;align-items:center;justify-content:center;font:750 11px Inter;letter-spacing:-.02em}
.oe-orb::after{content:"";position:absolute;inset:-4px;border:1px solid rgba(62,124,250,.25);border-radius:14px}
.oe-headcopy{min-width:0;flex:1}.oe-eyebrow{font:650 10px Inter;letter-spacing:.065em;text-transform:uppercase;color:#7b7b82}.oe-title{margin-top:3px;font:680 15px/1.3 Inter;color:#202024}.oe-sub{margin-top:3px;font:500 11.5px/1.4 Inter;color:#888890;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.oe-state{flex:none;display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:#f1f2f4;color:#686871;font:650 10.5px Inter}
.oe-state::before{content:"";width:6px;height:6px;border-radius:50%;background:#9a9aa1}
.oe-state.live{background:rgba(62,124,250,.11);color:#2868dc}.oe-state.live::before{background:#3e7cfa;box-shadow:0 0 0 3px rgba(62,124,250,.12)}
.oe-state.ready{background:rgba(255,149,0,.13);color:#9a5700}.oe-state.ready::before{background:#ff9500}
.oe-state.done{background:rgba(52,199,89,.13);color:#228044}.oe-state.done::before{background:#34c759}
.oe-context{display:flex;gap:7px;flex-wrap:wrap;padding:12px 18px 0}.oe-chip{padding:5px 8px;border:1px solid #e8e8eb;border-radius:8px;background:#fafafa;font:600 10.5px Inter;color:#696970}
.oe-progress{height:4px;margin:13px 18px 0;border-radius:999px;background:#ececef;overflow:hidden}.oe-progress>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2f6ff4,#53a0ff);transition:width .38s cubic-bezier(.22,1,.36,1)}
.oe-steps{padding:9px 18px 2px}.oe-step{position:relative;display:grid;grid-template-columns:25px minmax(0,1fr) auto;align-items:start;gap:11px;padding:11px 0;border-top:1px solid #eeeeef}.oe-step:first-child{border-top:0}
.oe-stepmark{width:23px;height:23px;border:1px solid #d9d9de;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#8b8b92;font:700 10.5px Inter;background:#fff}
.oe-step.active .oe-stepmark{border-color:#3e7cfa;color:#3e7cfa;box-shadow:0 0 0 4px rgba(62,124,250,.09)}.oe-step.done .oe-stepmark{border-color:#34c759;background:#34c759;color:#fff}.oe-step.done .oe-stepmark::before{content:"✓"}
.oe-step.done .oe-stepmark{font-size:0}.oe-stepcopy{min-width:0;padding-top:2px}.oe-stept{font:640 12.5px/1.35 Inter;color:#27272b}.oe-stepd{margin-top:2px;font:450 11.5px/1.45 Inter;color:#85858d}
.oe-editing .oe-stept,.oe-editing .oe-stepd{border-radius:6px;outline:1px solid #cedcff;background:#f8fbff;padding:3px 5px;margin-left:-5px}.oe-editing .oe-stepd{margin-top:3px}
.oe-stepflag{display:inline-flex;align-items:center;margin-top:5px;color:#9a5a05;font:650 9.5px Inter;letter-spacing:.03em;text-transform:uppercase}
.oe-stepact{align-self:center;min-width:70px;height:29px;padding:0 10px;border:1px solid #dfdfe3;border-radius:999px;background:#fff;color:#252529;font:650 10.5px Inter;cursor:pointer}.oe-stepact:hover{background:#f5f5f6}.oe-stepact.primary{border-color:#171719;background:#171719;color:#fff}
.oe-events{margin:8px 18px 0;padding:10px 0 2px;border-top:1px solid #ececef}.oe-event{display:flex;gap:8px;padding:4px 0;color:#818188;font:500 10.5px/1.4 Inter}.oe-event::before{content:"";flex:none;width:5px;height:5px;margin-top:5px;border-radius:50%;background:#b7b7bd}
.oe-actions{display:flex;align-items:center;gap:8px;padding:14px 18px 17px}.oe-btn{height:34px;padding:0 13px;border:1px solid #dedee2;border-radius:999px;background:#fff;color:#232327;font:650 11.5px Inter;cursor:pointer}.oe-btn:hover{background:#f4f4f5}.oe-btn.primary{margin-left:auto;border-color:#171719;background:#171719;color:#fff}.oe-btn.primary:hover{background:#303034}.oe-btn:disabled{opacity:.4;cursor:not-allowed}
.oe-approve-ov{position:fixed;inset:0;z-index:100200;display:grid;place-items:center;padding:clamp(16px,4vw,32px);background:rgba(18,18,20,.34);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);animation:metaIn .2s ease}
.oe-approve{width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;border:1px solid var(--sf-border,rgba(20,20,22,.12));border-radius:16px;background:color-mix(in srgb,var(--sf-surface,#fff) 96%,transparent);color:var(--sf-ink,#1d1d20);box-shadow:0 28px 80px rgba(0,0,0,.28);padding:clamp(20px,3vw,28px)}.oe-approve-k{font:700 10px Inter;letter-spacing:.07em;text-transform:uppercase;color:#3e7cfa}.oe-approve h3{margin:7px 0 8px;font:700 clamp(18px,2.2vw,22px)/1.25 Inter;color:inherit}.oe-approve p{margin:0;max-width:52ch;color:var(--sf-sub,#73737b);font:450 clamp(13px,1.5vw,15px)/1.55 Inter;overflow-wrap:anywhere}.oe-approve .oe-actions{justify-content:flex-end;padding:22px 0 0}.oe-approve .oe-btn{min-width:96px;height:40px;padding:0 16px;border-radius:10px;font-size:12.5px}.oe-approve .oe-btn.primary{margin-left:0}
.oe-refund{width:min(500px,calc(100vw - 32px))}.oe-refund-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.oe-refund-choice{min-height:78px;padding:14px;border:1px solid var(--sf-border,rgba(20,20,22,.12));border-radius:12px;background:transparent;color:inherit;text-align:left;cursor:pointer}.oe-refund-choice:hover{background:color-mix(in srgb,currentColor 5%,transparent)}.oe-refund-choice.on{border-color:#3e7cfa;box-shadow:inset 0 0 0 1px #3e7cfa;background:rgba(62,124,250,.07)}.oe-refund-choice b,.oe-refund-choice span{display:block}.oe-refund-choice b{font:650 13.5px/1.2 Inter}.oe-refund-choice span{margin-top:5px;color:var(--sf-sub,#73737b);font:500 11.5px/1.35 Inter}.oe-refund-custom{margin-top:12px}.oe-refund-custom[hidden]{display:none}.oe-refund-custom label{display:block;margin-bottom:7px;font:600 11.5px/1 Inter;color:var(--sf-sub,#73737b)}.oe-refund-input{height:46px;display:flex;align-items:center;gap:7px;padding:0 13px;border:1px solid var(--sf-border,rgba(20,20,22,.12));border-radius:11px;background:color-mix(in srgb,currentColor 4%,transparent);font:650 16px/1 Inter}.oe-refund-input input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:inherit;font:650 16px/1 Inter}.oe-refund-help{min-height:17px;margin-top:7px;color:var(--sf-sub,#73737b);font:500 10.5px/1.35 Inter}.oe-refund-help.error{color:#e0483d}.oe-refund-summary{display:flex;justify-content:space-between;gap:18px;margin-top:16px;padding-top:14px;border-top:1px solid var(--sf-border,rgba(20,20,22,.12));color:var(--sf-sub,#73737b);font:550 11.5px/1.3 Inter}.oe-refund-summary b{color:var(--sf-ink,#1d1d20);font-size:12.5px}.oe-refund .oe-actions{padding-top:18px}
html[data-theme="dark"] .oe-approve{--sf-surface:#111113;--sf-ink:#f4f4f5;--sf-sub:#a7a7af;--sf-border:rgba(255,255,255,.13);background:rgba(17,17,19,.97);box-shadow:0 30px 90px rgba(0,0,0,.7)}html[data-theme="dark"] .oe-approve .oe-btn{border-color:rgba(255,255,255,.14);background:#18181b;color:#f4f4f5}html[data-theme="dark"] .oe-approve .oe-btn:hover{background:#222225}html[data-theme="dark"] .oe-approve .oe-btn.primary{border-color:#f4f4f5;background:#f4f4f5;color:#111113}html[data-theme="dark"] .oe-approve .oe-btn.primary:hover{background:#dedee1}
@media(max-width:620px){.oe-card-head{padding:15px}.oe-context,.oe-steps{padding-left:15px;padding-right:15px}.oe-progress,.oe-events{margin-left:15px;margin-right:15px}.oe-step{grid-template-columns:23px minmax(0,1fr)}.oe-stepact{grid-column:2;justify-self:start}.oe-actions{padding-left:15px;padding-right:15px;flex-wrap:wrap}.oe-btn.primary{margin-left:0}.oe-approve{width:100%;padding:20px}.oe-approve .oe-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.oe-approve .oe-btn{width:100%;min-width:0}.oe-approve .oe-btn.primary{margin-left:0}.oe-refund-options{grid-template-columns:1fr}}
/* Tidy list rows — accent marker instead of a raw bullet dot. */
.md-li{display:flex;gap:10px;align-items:baseline;margin:6px 0;line-height:1.5}
.md-li .md-mk{flex:none;width:6px;height:6px;border-radius:2px;background:var(--accent);align-self:flex-start;margin-top:8px}
.md-li>span:last-child{min-width:0}
.md-h1,.md-h2,.md-h3,.md-h4{margin:0;color:inherit;letter-spacing:-.018em;text-wrap:balance}
.md-h1{font:720 20px/1.25 Inter}.md-h2{font:700 17px/1.3 Inter}.md-h3{font:680 15px/1.35 Inter}.md-h4{font:660 14px/1.4 Inter}
.md-h1+.md-h2,.md-h1+.md-h3,.md-h2+.md-h3,.md-h2+.md-h4,.md-h3+.md-h4{margin-top:12px}
.md-h1+.md-p,.md-h2+.md-p,.md-h3+.md-p,.md-h4+.md-p{margin-top:8px}
.md-p{margin:0;line-height:1.7}.md-p+.md-p{margin-top:12px}
.md-p+.md-li,.md-p+.md-step,.md-li+.md-p,.md-step+.md-p{margin-top:10px}
.md-step{display:grid;grid-template-columns:22px minmax(0,1fr);gap:8px;align-items:start;margin:7px 0;line-height:1.5}
.md-step-num{width:20px;height:20px;display:grid;place-items:center;margin-top:1px;border-radius:7px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);font:700 10px/1 Inter}
.md-quote{margin:10px 0;padding:9px 12px;border-left:2px solid var(--accent);border-radius:0 10px 10px 0;background:color-mix(in srgb,var(--accent) 5%,transparent);color:var(--sf-sub,var(--muted));line-height:1.6}
.md-code{display:inline;padding:1px 5px;border:1px solid var(--sf-border-2,var(--line));border-radius:6px;background:color-mix(in srgb,currentColor 5%,transparent);color:#d73545;font:550 .92em/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:break-spaces}
html[data-theme="dark"] .md-code{color:#ff7b88}
/* Insight / findings card — the agent's :::findings block as label+text rows. */
.find-card{margin-top:12px;border:1px solid var(--line-2);border-radius:16px;background:var(--surface-2);padding:6px 16px;max-width:560px;animation:metaIn .4s ease}
.find-head{display:flex;align-items:center;gap:9px;padding:12px 0 4px}
.find-badge{font:600 10.5px 'Inter';letter-spacing:.07em;text-transform:uppercase;color:var(--accent);background:rgba(var(--accent-rgb),.14);padding:3px 8px;border-radius:999px}
.find-title{font:650 15px 'Inter';color:var(--ink)}
.find-row{display:flex;gap:11px;padding:13px 0;border-top:1px solid var(--line)}
.find-row:first-of-type{border-top:0}
.find-mk{flex:none;color:var(--accent);font-size:13px;line-height:1.5;transform:translateY(1px)}
.find-body{min-width:0}
.find-label{font:600 14px 'Inter';color:var(--ink);line-height:1.35}
.find-text{font:400 13.5px 'Inter';color:var(--dim);line-height:1.5;margin-top:2px}
/* Fade veil when jumping to the site editor — covers the dashboard in the
dashboard's own bg so the cross-app navigation reads as a smooth fade. */
.editor-veil{position:fixed;inset:0;z-index:99999;background:var(--bg);opacity:0;pointer-events:none;
display:flex;align-items:center;justify-content:center;
transition:opacity .34s cubic-bezier(.22,1,.36,1)}
.editor-veil.on{opacity:1;pointer-events:auto}
.editor-veil .status-chime{opacity:0;transform:translateY(5px);transition:opacity .3s ease .06s,transform .3s ease .06s}
.editor-veil.on .status-chime{opacity:1;transform:none}
/* Embedded BASIC site editor — the real editor in an in-platform overlay (no
navigating away). Top bar + full-bleed iframe; "Done" closes back to here. */
.site-embed{position:fixed;inset:0;z-index:99998;background:var(--bg);display:flex;flex-direction:column;opacity:0;transition:opacity .28s ease}
.site-embed.on{opacity:1}
.site-embed-bar{flex:none;height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--line-2);background:var(--surface-2)}
.site-embed-t{display:flex;align-items:center;gap:10px;min-width:0}
.se-badge{font:600 10.5px 'Inter';letter-spacing:.07em;text-transform:uppercase;color:var(--accent);background:rgba(var(--accent-rgb),.14);padding:3px 8px;border-radius:999px}
.se-site{font:650 14px 'Inter';color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site-embed-actions{display:flex;gap:8px;flex:none}
.se-open{border:1px solid var(--line-2);background:transparent;color:var(--ink);font:600 13px 'Inter';padding:8px 13px;border-radius:999px;cursor:pointer}
.se-open:hover{background:var(--surface)}
.se-done{border:0;background:var(--ink);color:var(--bg);font:600 13px 'Inter';padding:8px 16px;border-radius:999px;cursor:pointer}
.se-done:hover{opacity:.9}
.site-embed-body{flex:1;position:relative;min-height:0}
.site-embed-frame{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:var(--bg)}
.site-embed-load{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:var(--bg);z-index:1}
/* Client search-mode ghost: the matching customer previews half-faded above the
bar while typing; Enter commits it to full opacity in the thread */
.acghost{position:absolute;left:50%;bottom:calc(100% + 12px);transform:translateX(-50%) translateY(6px);width:100%;max-width:560px;padding:0 22px;z-index:6;opacity:0;pointer-events:none;transition:opacity .28s ease,transform .28s ease}
.acghost.on{opacity:.45;transform:translateX(-50%) translateY(0)}
.acghost.commit{opacity:1}
/* 3D snap carousel for client search: circular avatars fan out above the bar —
centre sharp and labelled, sides recede with blur (transparent stage, no card).
Click a side circle to snap it centre (tick), click the centre to choose. */
.cscar{position:absolute;left:50%;bottom:calc(100% + 40px);transform:translateX(-50%);width:min(1040px,96vw);z-index:6;display:none;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none}
.cscar:active{cursor:grabbing}
.cscar{display:block;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .35s ease,visibility .35s}
.cscar.on{visibility:visible;opacity:1;pointer-events:auto}
/* typing a client name on the hero cross-fades the logo out and the wheel in;
clearing the text fades the logo back */
.hero{transition:opacity .35s ease}
body.cshero .hero{opacity:0 !important;pointer-events:none;animation:none !important}
body:not(.started):not(.cshero) .cscar{display:none}
body:not(.started) .csfocus{display:none}
.cscar .row{position:relative;height:300px}
.cscar .row.empty{display:flex;align-items:center;justify-content:center}
.cscar .it{position:absolute;left:50%;top:50%;width:0;height:0;overflow:visible;background:transparent;border:0;padding:0;cursor:pointer;transition:transform .45s cubic-bezier(.22,1,.36,1),opacity .45s ease,filter .45s ease}
.cscar .it.notr{transition:none}
.cscar .cwrap{position:absolute;left:0;top:0;transform:translate(-50%,-50%);width:120px;height:120px}
.cscar .cir{position:absolute;inset:0;border-radius:50%;font:700 30px Inter;display:flex;align-items:center;justify-content:center}
/* corner crop-marks around the focused circle, like the reference viewfinder */
.cscar .bk{position:absolute;width:14px;height:14px;border:0 solid #1a1a1c;opacity:0;transition:opacity .3s ease .1s;pointer-events:none}
html[data-theme="dark"] .cscar .bk{border-color:#f2f2f5}
.cscar .bk.tl{left:-14px;top:-14px;border-left-width:1.5px;border-top-width:1.5px}
.cscar .bk.tr{right:-14px;top:-14px;border-right-width:1.5px;border-top-width:1.5px}
.cscar .bk.bl{left:-14px;bottom:-14px;border-left-width:1.5px;border-bottom-width:1.5px}
.cscar .bk.br{right:-14px;bottom:-14px;border-right-width:1.5px;border-bottom-width:1.5px}
/* mono uppercase captions above + below the focused circle */
.cscar .capTop,.cscar .capBot{position:absolute;left:0;transform:translateX(-50%);text-align:center;white-space:nowrap;opacity:0;transition:opacity .3s ease .12s;display:flex;flex-direction:column;gap:6px;pointer-events:none}
.cscar .capTop{bottom:98px}
.cscar .capBot{top:98px}
.cscar .cap1{font:600 10.5px ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.16em;text-transform:uppercase;color:#9a9aa2}
.cscar .cap2{font:700 12px ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:#1a1a1c}
html[data-theme="dark"] .cscar .cap2{color:#f2f2f5}
.cscar .it.center .bk,.cscar .it.center .capTop,.cscar .it.center .capBot{opacity:1}
/* the chosen client lives in the AI interface as a transparent context chip */
.csfocus{position:absolute;left:22px;bottom:calc(100% + 10px);display:flex;align-items:center;gap:9px;background:transparent;z-index:6}
.csfocus .cir{width:30px;height:30px;border-radius:50%;background:rgba(62,124,250,.16);box-shadow:inset 0 0 0 1px #3E7CFA;color:#2b6cff;font:700 11px Inter;display:inline-flex;align-items:center;justify-content:center;flex:none}
html[data-theme="dark"] .csfocus .cir{color:#7FB5FF}
.csfocus .cfx{font:500 12.5px Inter;color:#6f6f76}
.csfocus .cfx b{color:#111;font-weight:650}
html[data-theme="dark"] .csfocus .cfx b{color:#fff}
.csfocus .cxx{border:0;background:none;color:#9a9aa2;cursor:pointer;font-size:15px;line-height:1;padding:0 2px}
.csfocus .cxx:hover{color:#111}
html[data-theme="dark"] .csfocus .cxx:hover{color:#fff}
.gcard{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #e4e4e8;border-radius:14px;padding:12px 14px;box-shadow:0 14px 40px rgba(0,0,0,.18);color:#111}
html[data-theme="dark"] .gcard{background:#0F0F0F;border-color:rgba(255,255,255,.12);color:#fff;box-shadow:0 14px 40px rgba(0,0,0,.45)}
.gcard .gav{width:38px;height:38px;flex:none;border-radius:50%;background:rgba(62,124,250,.16);box-shadow:inset 0 0 0 1px #3E7CFA;color:#7FB5FF;font:700 13px Inter;display:inline-flex;align-items:center;justify-content:center}
.gcard .gmain{display:flex;flex-direction:column;gap:1px;min-width:0}
.gcard .gnm{font:650 14px Inter}
.gcard .gsub{font:500 12px Inter;color:#8a8a90;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bub .gcard{margin:2px 0 8px;animation:gfade .35s ease}
@keyframes gfade{from{opacity:.35}to{opacity:1}}
/* Composer AI autocomplete dropdown */
.acsug{position:absolute;left:50%;transform:translateX(-50%);top:calc(100% - 6px);width:100%;max-width:720px;padding:0 22px;z-index:5;display:none}
.acsug.on{display:block}
/* no panel chrome — suggestions float directly under the composer */
.acsug-inner{background:none;border:none;border-radius:0;overflow:visible;box-shadow:none}
.acsug-row{display:block;width:100%;text-align:left;padding:8px 18px;border-radius:10px;font:500 15px 'Inter';color:var(--ink);cursor:pointer;border:none;background:none;
animation:acsug-in .46s cubic-bezier(.22,.61,.36,1) both;animation-delay:var(--d,0ms);will-change:transform,filter,opacity}
.acsug-row:hover,.acsug-row.active{background:rgba(127,127,140,.12)}
.acsug-row .pfx{color:var(--dim)}
/* premium field motion: each suggestion slides in right→left, blur resolving to sharp, staggered */
@keyframes acsug-in{0%{opacity:0;transform:translateX(26px);filter:blur(7px)}60%{opacity:1}100%{opacity:1;transform:translateX(0);filter:blur(0)}}
@media (prefers-reduced-motion:reduce){.acsug-row{animation:none}}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.chip{display:inline-flex;align-items:center;padding:9px 14px;border-radius:var(--r-pill);border:1px solid var(--line-2);background:var(--surface);color:var(--ink);font:600 14px/1 'Inter';cursor:pointer;transition:all .13s}
.chip:hover{background:var(--surface);border-color:#3a3a3e}
.chip.on{border-color:var(--accent);background:rgba(var(--accent-rgb),.16);color:#54b6ff}
/* letter badge on choice chips (A/B/C) */
.chip-k{display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;margin-right:8px;padding:0 3px;border-radius:5px;background:rgba(127,127,140,.22);color:var(--dim);font:700 11px/1 'Inter'}
.chip.on .chip-k{background:rgba(var(--accent-rgb),.28);color:#54b6ff}
.chip-other{opacity:.9}
.email-intake-progress{display:block;margin-bottom:8px;color:var(--dim);font:700 10px/1 'Inter';letter-spacing:.09em;text-transform:uppercase}
.email-intake-question{display:block;max-width:620px;color:var(--ink);font:600 16px/1.5 'Inter';text-wrap:balance}
.email-intake-context{display:block;margin-top:7px;max-width:620px;color:var(--muted);font:500 13px/1.5 'Inter'}
.email-intake-summary{display:grid;grid-template-columns:96px minmax(0,1fr);gap:7px 14px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.email-intake-summary span{color:var(--dim);font:650 11px/1.4 'Inter';letter-spacing:.03em;text-transform:uppercase}
.email-intake-summary b{min-width:0;color:var(--ink);font:550 13px/1.4 'Inter';overflow-wrap:anywhere}
.email-strategy-card{width:min(680px,100%);margin-top:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.email-strategy-head{padding:18px 0 15px}
.email-strategy-kicker{display:block;color:var(--dim);font:700 10px/1 'Inter';letter-spacing:.09em;text-transform:uppercase}
.email-strategy-title{display:block;margin-top:7px;color:var(--ink);font:650 18px/1.35 'Inter'}
.email-strategy-thesis{display:block;margin-top:6px;max-width:620px;color:var(--muted);font:500 13px/1.55 'Inter'}
.email-strategy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}
.email-strategy-field{min-width:0;padding:13px 18px 13px 0;border-bottom:1px solid var(--line)}
.email-strategy-field:nth-child(odd){padding-right:24px;border-right:1px solid var(--line)}
.email-strategy-field:nth-child(even){padding-left:24px}
.email-strategy-label{display:block;color:var(--dim);font:700 10px/1.2 'Inter';letter-spacing:.06em;text-transform:uppercase}
.email-strategy-value{display:block;margin-top:5px;color:var(--ink);font:600 13px/1.4 'Inter';overflow-wrap:anywhere}
.email-strategy-advice{padding:16px 0 15px}
.email-strategy-advice strong{display:block;color:var(--ink);font:650 13px/1.3 'Inter'}
.email-strategy-advice ul{display:grid;gap:7px;margin:9px 0 0;padding:0;list-style:none}
.email-strategy-advice li{position:relative;padding-left:15px;color:var(--muted);font:500 13px/1.5 'Inter'}
.email-strategy-advice li:before{content:'';position:absolute;left:0;top:.62em;width:5px;height:5px;border-radius:50%;background:var(--accent)}
.email-strategy-source{padding:11px 0;border-top:1px solid var(--line);color:var(--dim);font:550 11px/1.45 'Inter'}
.email-strategy-actions{display:flex;align-items:center;gap:10px;padding:14px 0 16px;border-top:1px solid var(--line)}
.email-strategy-actions .go{margin:0}
.email-strategy-adjust{border:0;background:transparent;color:var(--muted);padding:10px 8px;font:600 13px/1 'Inter';cursor:pointer}
.email-strategy-adjust:hover{color:var(--ink)}
@media(max-width:680px){
.email-strategy-grid{grid-template-columns:1fr}
.email-strategy-field:nth-child(odd){padding-right:0;border-right:0}
.email-strategy-field:nth-child(even){padding-left:0}
}
.go{margin-top:4px;border:none;border-radius:var(--r-pill);background:var(--send);color:var(--bg);font:600 14px/1 'Inter';padding:11px 20px;cursor:pointer}
.cf{display:flex;flex-direction:column;gap:8px;margin-top:4px;max-width:360px}
.cf input{border:1px solid var(--line-2);border-radius:12px;padding:11px 14px;font:500 15px 'Inter';outline:none}
.cf input:focus{border-color:var(--accent)}
.done{padding:8px 0;color:var(--muted);font-size:14px}
/* activity globe (bottom, cropped, drag-to-spin) */
/* composer (the Grok pill) */
.composer{flex:none;padding:20px 22px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;z-index:3;animation:rise 1s .12s cubic-bezier(.2,.8,.2,1) both}
/* Live session-lifecycle dot in the composer pill — same states as the
Recents dots: blue=working, yellow=needs input, hollow=idle. Driven by the
real chat busy state via syncSend then updateCdot. */
.pill .cdot{width:8px;height:8px;border-radius:50%;flex:none;box-sizing:border-box;border:1.5px solid var(--dim);margin:0 4px 0 2px;align-self:center;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease}
.pill .cdot.y{background:#e8b33e;border-color:#e8b33e;box-shadow:0 0 6px 0 rgba(232,179,62,.6)}
.pill .cdot.b{background:#3b82f6;border-color:#3b82f6;box-shadow:0 0 6px 0 rgba(59,130,246,.6);animation:cdotpulse 1.1s ease-in-out infinite}
@keyframes cdotpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.78)}}
@media (prefers-reduced-motion:reduce){.pill .cdot.b{animation:none}}
.pill{position:relative;width:100%;max-width:720px;display:flex;align-items:center;gap:8px;background:#000000;border-radius:30px;padding:8px;box-shadow:inset 0 0 0 .75px rgba(255,255,255,.08),0 10px 30px -8px rgba(0,0,0,.6)}
/* Custom text caret: native carets can't be set to a px width, so we hide the
native one and draw our own 2px blue bar, positioned by measured text width. */
.pill .caret{position:absolute;left:0;top:0;width:2px;background:#3590F5;border-radius:1px;pointer-events:none;
opacity:0;will-change:transform,opacity;z-index:2}
.pill .caret.on{opacity:1;animation:caretBlink 1.1s step-end infinite}
@keyframes caretBlink{0%,49%{opacity:1}50%,100%{opacity:0}}
.pill .ic{width:38px;height:38px;flex:none;border:none;background:none;border-radius:50%;color:#f2f2f4;display:flex;align-items:center;justify-content:center;cursor:pointer}
.pill .ic:hover{background:rgba(255,255,255,.12)}
.pill .ic.voice-active:not(.muted),.pill .ic.listening{background:none;color:#fff;animation:none}
.pill .ic.muted{background:none;color:#ff453a;animation:none}
.pill .ic .mic-muted-slash{opacity:0;transition:opacity .15s ease}
.pill .ic.muted .mic-muted-slash{opacity:1}
.pill .ic:disabled{opacity:.42;cursor:default}
.pill svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.9;fill:none}
body.task-chat-mode .composer .pill{box-shadow:inset 0 0 0 .75px rgba(76,143,255,.28),0 10px 30px -8px rgba(0,0,0,.6)}
.pill textarea{display:block;flex:1 1 0%;width:auto;min-width:0;height:24px;max-height:116px;resize:none;overflow-y:auto;border:none;outline:none;background:transparent;font:500 16px/1.5 'Inter';color:#ffffff;padding:0 4px;caret-color:transparent;pointer-events:auto;cursor:text;scrollbar-width:none}
.pill textarea::-webkit-scrollbar{display:none}
.pill textarea.multiline{caret-color:#3590F5}
.pill textarea::placeholder{color:rgba(255,255,255,.55)}
/* "Ask anything" placeholder chime: a slow, subtle color band waves across the
text (same background-clip recipe as .status-chime, gentler). Native
::placeholder can't take a gradient, so #inp's placeholder is hidden and this
overlay span — positioned over the input by JS, like the custom caret — renders
it instead. Shows only while the input is empty. */
#inp::placeholder{color:transparent!important;-webkit-text-fill-color:transparent!important;opacity:0!important}
/* Composer copy must remain readable while focused/typing. Keep it above
decorative placeholder and caret layers without changing the pill layout. */
.pill #inp{position:relative;z-index:3;color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;cursor:text}
html[data-theme="light"] .pill #inp{color:#000!important;-webkit-text-fill-color:#000!important}
.pill .ph-chime{position:absolute;left:58px;top:50%;height:24px;display:flex;align-items:center;transform:translateY(-50%);
pointer-events:none;z-index:1;font:500 16px 'Inter';white-space:nowrap;
--ph-base:rgba(255,255,255,.32);--ph-band:rgba(255,255,255,.95);
background-image:linear-gradient(90deg,transparent 0%,var(--ph-band) 50%,transparent 100%),linear-gradient(var(--ph-base),var(--ph-base));
background-size:42% 100%,100% 100%;background-repeat:no-repeat,no-repeat;background-position:-55% center,0 0;
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
opacity:0;transition:opacity .18s ease}
.pill .ph-chime.show{opacity:1;animation:phchime 3.4s linear infinite}
/* CSS fallback: the prompt remains visible even if a route transition runs
before the JS measurement pass. JS may still refine the exact position. */
.pill #inp:placeholder-shown + .ph-chime{opacity:1;animation:phchime 3.4s linear infinite}
@keyframes phchime{0%{background-position:-55% center,0 0}100%{background-position:155% center,0 0}}
@media (prefers-reduced-motion:reduce){.pill .ph-chime.show{animation:none;-webkit-text-fill-color:var(--ph-base);color:var(--ph-base)}}
.fast{display:flex;align-items:center;gap:4px;color:#f2f2f4;font:600 14px 'Inter';padding:0 6px;white-space:nowrap}
.fast svg{width:14px;height:14px}
.send{position:relative;width:40px;height:40px;flex:none;border:none;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,color .15s ease,opacity .12s,transform .18s cubic-bezier(.22,1,.36,1)}
.send:disabled{opacity:.45;cursor:not-allowed}
/* Grok-style voice affordance: the waveform owns the empty composer state;
entering text cross-fades it into the normal send arrow. */
.send.voice{background:transparent;color:#fff}
.send.voice-session,.send.voice-session.listening,.send.voice-session.user-speaking,.send.voice-session.speaking,.send.voice-session.voice-thinking{background:transparent!important}
/* Has text (enabled) — night: white circle + black icon. */
.send.on{background:#fff;color:#000}
.send svg{position:absolute;width:19px;height:19px;stroke:#fff;stroke-width:2.1;fill:none;transition:opacity .14s ease,transform .2s cubic-bezier(.22,1,.36,1)}
.send .send-arrow{opacity:0;transform:scale(.72) translateY(2px)}
.send .send-voice{width:22px;height:20px;opacity:1;transform:scale(1);fill:#fff;stroke:none}
.send .send-voice rect{transform-box:fill-box;transform-origin:center;transition:transform .34s cubic-bezier(.22,1,.36,1),opacity .2s ease}
.send .send-voice-coin{position:absolute;left:50%;top:50%;width:36px;height:36px;
opacity:0;transform:translate(-50%,-50%) scale(.68);pointer-events:none;
transition:opacity .18s ease,transform .28s cubic-bezier(.22,1,.36,1)}
.send .send-voice-coin-orbit{position:absolute;inset:0}
.send .send-voice-coin::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:12px;border-radius:50%;
opacity:0;transform:translate(-50%,-50%) scale(.35);
background:radial-gradient(circle,transparent 0 30%,rgba(255,255,255,.62) 44%,rgba(255,255,255,0) 74%);
-webkit-mask-image:radial-gradient(circle,transparent 0 30%,#000 43%);mask-image:radial-gradient(circle,transparent 0 30%,#000 43%);
filter:blur(2px);pointer-events:none}
.send .send-voice-coin i{--angle:0deg;--coin-delay:0ms;position:absolute;left:50%;top:50%;width:6px;height:6px;
margin:-3px 0 0 -3px;border-radius:50%;opacity:0;transform:rotate(var(--angle)) translateY(-13px);
background:radial-gradient(circle at 32% 28%,#fff 0 28%,#e7e7e7 58%,#a9a9a9 100%);
box-shadow:0 0 5px rgba(255,255,255,.9),0 0 11px rgba(255,255,255,.42)}
.send .send-voice-coin i:nth-child(1){--angle:0deg;--coin-delay:0ms}
.send .send-voice-coin i:nth-child(2){--angle:60deg;--coin-delay:120ms}
.send .send-voice-coin i:nth-child(3){--angle:120deg;--coin-delay:240ms}
.send .send-voice-coin i:nth-child(4){--angle:180deg;--coin-delay:360ms}
.send .send-voice-coin i:nth-child(5){--angle:240deg;--coin-delay:480ms}
.send .send-voice-coin i:nth-child(6){--angle:300deg;--coin-delay:600ms}
.send .send-voice-wave{position:absolute;left:50%;top:50%;display:block;width:56px;height:56px;
opacity:0;transform:translate(-50%,-50%) scale(.24);pointer-events:none;background:transparent;
transition:opacity .2s ease,transform .52s cubic-bezier(.22,1,.36,1),filter .18s ease}
.send.on .send-arrow{opacity:1;transform:scale(1) translateY(0)}
.send.on .send-voice{opacity:0;transform:scale(.72)}
.send.voice svg{stroke:#fff}
.send.voice .send-voice{fill:#fff;stroke:none}
.send.voice-session{box-shadow:none}
.send.voice-connecting .send-voice-coin{opacity:1;transform:translate(-50%,-50%) scale(1)}
.send.voice-connecting .send-voice-coin-orbit{animation:sendCoinOrbit 2.8s linear infinite}
.send.voice-connecting .send-voice-coin i{opacity:1;animation:sendCoinFlip 2.4s var(--coin-delay) ease-in-out infinite}
.send.voice-connecting .send-voice-coin::after{animation:sendCoinCoreBloom 1.35s ease-in-out infinite alternate}
.send.voice-connecting .send-voice{opacity:0;transform:scale(.72)}
.send.voice-ready-collapse .send-voice-coin{opacity:1;transform:translate(-50%,-50%) scale(1)}
.send.voice-ready-collapse .send-voice-coin i{animation:sendCoinGather .64s cubic-bezier(.22,.82,.24,1) both}
.send.voice-ready-collapse .send-voice-coin::after{animation:sendCoinBloomGather .64s cubic-bezier(.22,.82,.24,1) both}
.send.voice-ready-collapse .send-voice{opacity:0}
.send.voice-wave-ready .send-voice-wave{opacity:1;transform:translate(-50%,-50%) scaleX(1) scaleY(.54);filter:saturate(1.16) brightness(1.1)}
.send.voice-wave-ready .send-voice{animation:none!important;opacity:0!important}
.send.voice-session.voice-wave-ready .send-voice-wave{opacity:0!important}
.send.voice-session.voice-wave-ready .send-voice{opacity:1!important;animation:none!important}
.send.voice-session.voice-text-ready .send-arrow{opacity:1!important;transform:scale(1) translateY(0)!important}
.send.voice-session.voice-text-ready .send-voice,.send.voice-session.voice-text-ready .send-voice-wave,.send.voice-session.voice-text-ready .send-voice-coin{opacity:0!important}
/* The active waveform becomes its own stop control. The two outside rounded
bars travel into the center and rotate into an X; the remaining bars fold
away, so there is no second icon layer or change in stroke thickness. */
.send.voice-session .send-voice rect{animation:none!important}
.send.voice-session .send-voice rect:nth-child(1){transform:translateX(10px) rotate(45deg) scaleY(2.4)}
.send.voice-session .send-voice rect:nth-child(6){transform:translateX(-10px) rotate(-45deg) scaleY(2.4)}
.send.voice-session .send-voice rect:nth-child(2),
.send.voice-session .send-voice rect:nth-child(3),
.send.voice-session .send-voice rect:nth-child(4),
.send.voice-session .send-voice rect:nth-child(5){opacity:0;transform:scaleY(.08)}
.send.voice-thinking .send-voice-wave{opacity:0;transform:translate(-50%,-50%) scale(.48)}
.send.voice-thinking .send-voice-coin{opacity:1;transform:translate(-50%,-50%) scale(1)}
.send.voice-thinking .send-voice-coin-orbit{animation:sendCoinOrbit 2.1s linear infinite}
.send.voice-thinking .send-voice-coin i{opacity:1;animation:sendCoinFlip 1.8s var(--coin-delay) ease-in-out infinite}
.send.voice-thinking .send-voice-coin::after{animation:sendCoinCoreBloom 1s ease-in-out infinite alternate}
.send.voice-wave-ready.user-speaking .send-voice-wave{animation:voiceWaveUser .42s ease-in-out infinite alternate;filter:saturate(1.38) brightness(1.2)}
.send.voice-wave-ready.speaking .send-voice-wave{animation:voiceWaveAI .3s ease-in-out infinite alternate}
.send.voice-session.listening .send-voice,.send.voice-session.speaking .send-voice{animation:none}
.send.voice-ready-collapse .send-voice{animation:none!important;opacity:0!important}
@keyframes voicebars{from{transform:scale(.82);opacity:.72}to{transform:scale(1.06);opacity:1}}
@keyframes sendCoinOrbit{to{transform:rotate(360deg)}}
@keyframes sendCoinFlip{0%,100%{transform:rotate(var(--angle)) translateY(-13px) scaleX(1);filter:brightness(1)}25%{transform:rotate(var(--angle)) translateY(-13px) scaleX(.08);filter:brightness(1.7)}50%{transform:rotate(var(--angle)) translateY(-13px) scaleX(1);filter:brightness(1.15)}75%{transform:rotate(var(--angle)) translateY(-13px) scaleX(.08);filter:brightness(1.7)}}
@keyframes sendCoinCoreBloom{from{opacity:.18;transform:translate(-50%,-50%) scale(.48)}to{opacity:.8;transform:translate(-50%,-50%) scale(1.28)}}
@keyframes sendCoinBloomGather{0%{opacity:.18;transform:translate(-50%,-50%) scale(.5)}62%{opacity:1;transform:translate(-50%,-50%) scale(1.55)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.35)}}
@keyframes sendCoinGather{0%{opacity:1;transform:rotate(var(--angle)) translateY(-13px) scale(1)}58%{opacity:1;transform:rotate(var(--angle)) translateY(-4px) scale(.9)}100%{opacity:0;transform:rotate(var(--angle)) translateY(0) scale(.14);box-shadow:0 0 12px rgba(255,255,255,1),0 0 22px rgba(255,255,255,.65)}}
@keyframes voiceWaveUser{from{transform:translate(-50%,-50%) scaleX(.9) scaleY(.82)}to{transform:translate(-50%,-50%) scaleX(1.04) scaleY(1.2)}}
@keyframes voiceWaveAI{0%{transform:translate(-50%,-50%) scaleX(.88) scaleY(.72);filter:saturate(1.2) brightness(1.08) hue-rotate(-18deg)}50%{filter:saturate(1.68) brightness(1.36) hue-rotate(10deg)}100%{transform:translate(-50%,-50%) scaleX(1.06) scaleY(1.3);filter:saturate(2) brightness(1.5) hue-rotate(28deg)}}
@media (prefers-reduced-motion:reduce){.send.voice-session .send-voice,.send.voice-wave-ready .send-voice-wave{animation:none!important}.send.voice-wave-ready.speaking .send-voice-wave{filter:saturate(1.45) brightness(1.25)}.send.voice-connecting .send-voice-coin-orbit,.send.voice-connecting .send-voice-coin i,.send.voice-connecting .send-voice-coin::after,.send.voice-ready-collapse .send-voice-coin i,.send.voice-ready-collapse .send-voice-coin::after,.send.voice-thinking .send-voice-coin-orbit,.send.voice-thinking .send-voice-coin i,.send.voice-thinking .send-voice-coin::after{animation:none}}
/* Has text — night: black icon on the white circle. */
.send.on svg{stroke:#000}
.topr{position:absolute;top:16px;right:22px;display:flex;gap:16px;color:var(--muted);font:600 13.5px 'Inter';z-index:5}
.topr span{display:flex;align-items:center;gap:6px;cursor:default}
.topr svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.8;fill:none}
/* + attach menu (Grok-style popover) */
.addwrap{position:relative;display:flex;flex:none}
.amenu{position:absolute;top:auto;bottom:calc(100% + 10px);left:0;width:188px;background:#212121;
border:1px solid rgba(252,252,252,.08);border-radius:16px;
box-shadow:0 18px 44px -12px rgba(0,0,0,.6);z-index:20;transform-origin:bottom left;
max-height:calc(100vh - 30px)}
/* inner scroll keeps the 16px rounding while items overflow; JS clamps the px height
so the menu's bottom edge always rests >=15px above the viewport "ground" */
.amenu-scroll{padding:6px;max-height:inherit;overflow-y:auto;overscroll-behavior:contain;
border-radius:16px;scrollbar-width:none;-ms-overflow-style:none}
.amenu-scroll::-webkit-scrollbar{width:0;height:0}
/* fade-in scroll affordance — gradient veil + bouncing chevron, shown only while
there's more below; pinned to the rounded bottom, never intercepts clicks */
.amenu-fade{position:absolute;left:1px;right:1px;bottom:1px;height:42px;pointer-events:none;
display:flex;align-items:flex-end;justify-content:center;padding-bottom:7px;
border-radius:0 0 15px 15px;z-index:1;opacity:0;transition:opacity .18s ease;
background:linear-gradient(to bottom,rgba(33,33,33,0),#212121 72%)}
.amenu.scrollable>.amenu-fade{opacity:1}
.amenu-fade svg{width:15px;height:15px;stroke:#fcfcfc;stroke-width:2;stroke-linecap:round;
stroke-linejoin:round;fill:none;opacity:.8;animation:scrollNudge 1.4s ease-in-out infinite}
@keyframes scrollNudge{0%,100%{transform:translateY(0)}50%{transform:translateY(2.5px)}}
.amenu[data-state="closed"]{display:none}
/* The primary menu rises from the composer; detached flyouts keep the lateral menu motion. */
.amenu[data-state="open"]{animation:menuEnterUp .15s ease}
.amenu[data-state="closing"]{animation:menuExitUp .15s ease forwards}
@keyframes menuEnterUp{from{opacity:0;transform:scale(.95) translateY(.5rem)}to{opacity:1;transform:none}}
@keyframes menuExitUp{from{opacity:1;transform:none}to{opacity:0;transform:scale(.95) translateY(.5rem)}}
@keyframes menuEnter{from{opacity:0;transform:scale(.95) translateY(-.5rem)}to{opacity:1;transform:none}}
@keyframes menuExit{from{opacity:1;transform:none}to{opacity:0;transform:scale(.95) translateY(-.5rem)}}
.ami{display:flex;align-items:center;gap:11px;width:100%;height:38px;border:none;background:none;
color:#fcfcfc;font:400 14px/1 'Inter';letter-spacing:-.1px;padding:0 11px;border-radius:12px;cursor:pointer;text-align:left}
.ami:hover{background:rgba(252,252,252,.08)}
.ami .icn{width:16px!important;height:16px!important;flex:none;opacity:.7;color:#fcfcfc}
.ami .icn path,.ami .icn rect,.ami .icn circle,.ami .icn polygon{fill:currentColor;stroke:none}
.ami .icn-stroke path,.ami .icn-stroke rect,.ami .icn-stroke circle,.ami .icn-stroke line,.ami .icn-stroke polyline{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ami .chev{width:16px!important;height:16px!important;flex:none;margin-left:auto}
.ami .chev path{fill:#9e9e9e;stroke:none}
.amdiv{height:1px;background:rgba(252,252,252,.08);margin:6px -4px}
/* Skills flyout submenu — same popover, opens to the right of the row */
.ami-fly{position:relative}
.ami-fly>.ami{width:100%}
/* fixed so the parent menu's scroll-overflow can't clip it; JS sets left/top */
.ami-fly .flyout{position:fixed;top:0;bottom:auto;width:196px;display:none;transform-origin:top left}
/* JS (hover-intent + click) owns .open so the flyout HOLDS across the gap between
the row and the detached fixed flyout — a pure :hover rule drops it mid-traverse */
.ami-fly.open .flyout{display:block;animation:menuEnter .15s ease}
@media(max-width:600px){.rail{width:52px}.hero .lk .wm{font-size:30px}.hero .lk .logo{height:42px}}
/* --- Sign-up gate (first composer interaction) --- */
.gate{position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.5);backdrop-filter:blur(5px) saturate(1.15);-webkit-backdrop-filter:blur(5px) saturate(1.15);animation:gatefade .2s ease}
.gate[hidden]{display:none}
.gate-card{width:min(92vw,360px);background:#141417;border:1px solid rgba(255,255,255,.09);border-radius:20px;padding:30px 28px;box-shadow:0 24px 70px rgba(0,0,0,.6);text-align:center;animation:gatepop .24s cubic-bezier(.2,.8,.2,1)}
.gate-brand{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:18px;letter-spacing:-.01em;margin-bottom:16px;color:var(--ink)}
.gate-brand .gtri{width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:12px solid var(--ink)}
.gate-card h2{font-size:21px;font-weight:700;letter-spacing:-.02em;margin:0 0 6px;color:var(--ink)}
.gate-card p{font-size:14px;color:var(--muted);margin:0 0 20px}
.gate-err{color:#e24b4a;font-size:12.5px;min-height:15px;margin:-4px 0 9px;text-align:center}
.gate-card input{width:100%;box-sizing:border-box;height:44px;padding:0 14px;border:1px solid rgba(255,255,255,.16);border-radius:10px;font:500 15px Inter;outline:none;margin-bottom:12px;transition:border-color .15s;background:#0d0d0f;color:var(--ink)}
.gate-card input:focus{border-color:var(--ink)}
.gate-cta{width:100%;height:44px;border:none;border-radius:10px;background:#fff;color:#111;font:600 15px Inter;cursor:pointer;transition:opacity .15s}
.gate-cta:hover{opacity:.9}
.gate-alt{font-size:13px;color:var(--muted);margin-top:16px}
.gate-alt a{color:var(--ink);font-weight:600;text-decoration:none}
@keyframes gatefade{from{opacity:0}to{opacity:1}}
@keyframes gatepop{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
/* =====================================================================
Business DNA / Brand profile — full-screen dark overlay (Attract
aurora language). Opened from + → Skills → Brand profile.
===================================================================== */
.bdna{position:fixed;inset:0;z-index:150;background:#000;color:var(--ink);
display:none;flex-direction:column;overflow:hidden}
.bdna.open{display:flex;animation:gatefade .2s ease}
.bdna-top{flex:none;height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 20px}
.bdna-back{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 15px 0 11px;
border:1px solid var(--line-2);background:var(--surface);color:var(--ink);
border-radius:var(--r-pill);font:600 13.5px Inter;cursor:pointer;transition:background .12s}
.bdna-back:hover{background:#202024}
.bdna-back svg{width:16px;height:16px;stroke:currentColor;stroke-width:2;fill:none}
.bdna-scroll{flex:1;overflow-y:auto;padding:8px 24px 64px}
.bdna-wrap{max-width:1000px;margin:0 auto}
.bdna-h1{font:700 30px Inter;letter-spacing:-.025em;text-align:center;margin-top:6px}
.bdna-sub{color:var(--dim);font-size:14.5px;text-align:center;margin:6px 0 26px}
/* entry state */
.bdna-entry{max-width:520px;margin:48px auto 0;text-align:center}
.bdna-spark{width:50px;height:50px;border-radius:16px;display:flex;align-items:center;justify-content:center;
margin:0 auto 18px;background:rgba(var(--accent-rgb),.14);color:var(--accent)}
.bdna-spark svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.7;fill:none}
.bdna-inrow{display:flex;gap:8px;margin-top:22px}
.bdna-field{flex:1;display:flex;align-items:center;gap:9px;height:48px;padding:0 15px;
border:1px solid var(--line-2);background:var(--surface);border-radius:var(--r-pill);transition:border-color .14s}
.bdna-field:focus-within{border-color:var(--accent)}
.bdna-field svg{width:17px;height:17px;stroke:var(--dim);stroke-width:1.8;fill:none;flex:none}
.bdna-field input{flex:1;border:none;outline:none;background:none;font:500 15px Inter;color:var(--ink)}
.bdna-field input::placeholder{color:var(--dim)}
.bdna-analyze{height:48px;padding:0 22px;border:none;border-radius:var(--r-pill);background:#fff;color:#111;
font:600 14px Inter;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:opacity .12s;flex:none}
.bdna-analyze:disabled{opacity:.4;cursor:not-allowed}
.bdna-analyze svg{width:16px;height:16px;stroke:#111;stroke-width:2.1;fill:none}
.bdna-scratch{margin-top:18px;background:none;border:none;color:var(--muted);font:600 13px Inter;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.bdna-err{color:#e24b4a;font-size:13px;margin-top:14px;min-height:16px}
/* loading state */
.bdna-load{max-width:440px;margin:60px auto 0}
.bdna-load .bdna-spark svg{animation:micpulse 1.6s ease-in-out infinite}
.bdna-steps{margin-top:26px;display:flex;flex-direction:column;gap:11px}
.bdna-stp{display:flex;align-items:center;gap:11px;font-size:14px;color:var(--dim)}
.bdna-stp.act{color:var(--ink);font-weight:600}.bdna-stp.done{color:var(--muted)}
.bdna-dot{width:18px;height:18px;border-radius:50%;background:var(--surface);flex:none;
display:flex;align-items:center;justify-content:center}
.bdna-stp.act .bdna-dot{background:rgba(var(--accent-rgb),.2)}
.bdna-dot i{width:6px;height:6px;border-radius:50%;background:var(--dim)}
.bdna-stp.act .bdna-dot i{background:var(--accent);animation:bl 1.2s infinite}
.bdna-dot svg{width:11px;height:11px;stroke:var(--accent);stroke-width:2.2;fill:none}
/* result state */
.bdna-tabs{display:flex;gap:4px;background:var(--surface-2);border:1px solid var(--line);
border-radius:var(--r-pill);padding:4px;width:max-content;margin:0 auto 22px}
.bdna-tab{border:none;background:none;color:var(--dim);font:600 13.5px Inter;padding:8px 22px;
border-radius:var(--r-pill);cursor:pointer;transition:all .14s}
.bdna-tab.on{background:var(--surface);color:var(--ink)}
.bdna-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.bdna-card{background:var(--surface);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:18px 20px;min-height:96px}
.bdna-card.wide{grid-column:1 / -1}
.bdna-card-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.bdna-card-l{font:600 12px Inter;letter-spacing:.04em;text-transform:uppercase;color:var(--dim)}
.bdna-edit{width:28px;height:28px;flex:none;border:none;border-radius:8px;background:var(--surface-2);
color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .12s}
.bdna-edit:hover{background:#26262b;color:var(--ink)}
.bdna-edit svg{width:13px;height:13px;stroke:currentColor;stroke-width:1.9;fill:none}
.bdna-val{font-size:15px;color:var(--ink);line-height:1.5;word-break:break-word}
.bdna-val.big{font:600 22px Inter;letter-spacing:-.01em}
.bdna-val.muted,.bdna-none{color:var(--dim);font-size:14px}
.bdna-url{color:var(--accent);font-size:13px;margin-top:4px;word-break:break-all}
.bdna-chips{display:flex;flex-wrap:wrap;gap:7px}
.bdna-tag{display:inline-flex;align-items:center;padding:6px 12px;border:1px solid var(--line-2);
border-radius:var(--r-pill);font:500 13px Inter;color:var(--muted)}
.bdna-sws{display:flex;gap:14px;flex-wrap:wrap}
.bdna-sw{text-align:center}
.bdna-sw .dot{width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.12);margin:0 auto 7px}
.bdna-sw .hx{font:500 11px 'Inter';color:var(--dim);letter-spacing:.02em}
.bdna-logo{height:48px;max-width:80%;width:auto;object-fit:contain}
.bdna-socials{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.bdna-socials a{color:var(--muted);display:flex}
.bdna-socials svg{width:21px;height:21px;fill:currentColor}
.bdna-ed-area{width:100%;background:var(--surface-2);border:1px solid var(--line-2);border-radius:10px;
color:var(--ink);font:500 14px Inter;padding:10px 12px;outline:none;resize:vertical;min-height:42px}
.bdna-ed-area:focus{border-color:var(--accent)}
.bdna-ed-row{display:flex;gap:8px;margin-top:10px}
.bdna-ed-save{height:32px;padding:0 16px;border:none;border-radius:8px;background:#fff;color:#111;font:600 12.5px Inter;cursor:pointer}
.bdna-ed-cancel{height:32px;padding:0 14px;border:1px solid var(--line-2);border-radius:8px;background:none;color:var(--muted);font:600 12.5px Inter;cursor:pointer}
.bdna-ed-hint{color:var(--dim);font-size:11.5px;margin-top:7px}
.bdna-foot{display:flex;justify-content:center;margin:30px 0 8px}
.bdna-go{height:46px;padding:0 40px;border:none;border-radius:var(--r-pill);background:var(--accent);color:#fff;font:600 15px Inter;cursor:pointer;transition:opacity .12s}
.bdna-go:hover{opacity:.92}
@media(max-width:680px){.bdna-grid{grid-template-columns:1fr}.bdna-inrow{flex-direction:column}.bdna-analyze{width:100%}}
/* =====================================================================
Shopify-admin skin (Polaris) — shown for every non-Home view.
Home stays the dark aurora page; body.shopify swaps the whole chrome.
===================================================================== */
:root{
--sf-bg:#f1f1f1; --sf-surface:#ffffff; --sf-ink:#303030; --sf-sub:#616161;
--sf-dim:#8a8a8a; --sf-border:#e3e3e3; --sf-border-2:#ebebeb;
--sf-fill:#303030; --sf-hover:#f7f7f7; --sf-sel:#ffffff;
--sf-radius:12px; --acc:#3590F5;
--ai-typing-clear:rgba(255,255,255,0); --ai-typing-solid:#ffffff;
/* status tag palette (Approved/Pending/Cancelled/info) */
--tag-success-bg:#E3F1E8; --tag-success-fg:#1f6b43;
--tag-attention-bg:#F8EEDA; --tag-attention-fg:#8a6116;
--tag-critical-bg:#F9E5E3; --tag-critical-fg:#b3261e;
--tag-info-bg:#E6EEF8; --tag-info-fg:#1a4d8f;
--tag-neutral-bg:#eceef0; --tag-neutral-fg:#4a4a4a;
}
body.shopify{background:var(--sf-bg);color:var(--sf-ink)}
/* #sf is a fully-opaque full-screen overlay (z-index 6, above all home chrome),
so it covers the aurora home without hiding it — the WebGL canvas keeps
rendering untouched and Home is pixel-identical when you return. */
#sf{display:none;position:fixed;inset:0;z-index:6;background:var(--sf-bg);
font-family:'Inter',system-ui,sans-serif;color:var(--sf-ink)}
/* panel reveals with a soft scale+fade when you cross from the home into the dashboard */
body.shopify #sf{display:block;animation:sfReveal .44s cubic-bezier(.22,1,.36,1)}
@keyframes sfReveal{from{opacity:0;transform:scale(.986)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){body.shopify #sf{animation:none}}
/* top bar */
.sf-top{position:fixed;top:0;left:0;right:0;height:56px;display:flex;align-items:center;
gap:12px;padding:0 16px;background:#000;border-bottom:1px solid rgba(255,255,255,.08);z-index:8}
.sf-brand{display:flex;align-items:center;align-self:stretch;gap:11px;width:260px;flex:none;color:#fff;transition:width .46s cubic-bezier(.22,1,.36,1);overflow:hidden}
.sf-toggle{width:30px;height:30px;flex:none;border:none;background:none;border-radius:8px;color:#fff;
display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .12s}
.sf-toggle:hover{background:rgba(255,255,255,.12)}
.sf-toggle svg{width:19px;height:19px}
.sf-toggle svg rect,.sf-toggle svg line{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.sf-toggle svg .pfill{fill:currentColor;stroke:none;opacity:.32}
.sf-brand .sf-logo{height:17px;width:auto;display:block;color:#fff}
.sf-brand .badge{appearance:none;background:transparent;font-family:inherit;font-size:12px;line-height:18px;color:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.18);
border-radius:8px;padding:2px 8px;font-weight:600;cursor:default;white-space:nowrap}
.sf-brand .badge[data-demo-toggle="true"]{cursor:pointer;transition:background .14s ease,color .14s ease,border-color .14s ease}
.sf-brand .badge[data-demo-toggle="true"]:hover{background:rgba(255,255,255,.10);color:#fff;border-color:rgba(255,255,255,.28)}
.sf-brand .badge[data-demo-toggle="true"]:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.sf-search{flex:1;max-width:480px;margin:0 auto;display:flex;align-items:center;gap:8px;height:32px;
background:#fcfcfc;border:1px solid var(--sf-border);border-radius:999px;padding:0 14px;color:var(--sf-dim);
font-size:13.5px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.sf-search svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.8;fill:none}
.sf-search .kbd{margin-left:auto;font-size:11px;color:var(--sf-dim)}
.sf-topmid{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:10px}
.sf-topmid .sf-search{flex:0 1 480px;margin:0}
/* The brand and account controls have different widths, so flex centering
makes the search look offset. Anchor the middle cluster to the viewport. */
@media(min-width:721px){
.sf-topmid{position:absolute;left:50%;width:min(568px,calc(100vw - 600px));transform:translateX(-50%);pointer-events:none}
.sf-topmid>*{pointer-events:auto}
}
/* + button mirrors the search pill: same height and background per theme */
.sf-top-add{flex:none;width:32px;height:32px;padding:0;border:1px solid var(--sf-border);border-radius:999px;background:#fcfcfc;color:var(--sf-ink);font-size:20px;font-weight:400;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.sf-top-add:hover{background:var(--sf-hover)}
.sf-top-add[hidden]{display:none}
/* filter button mirrors the + button; dot marks an active (non-All) filter */
.sf-top-filter{flex:none;width:32px;height:32px;padding:0;border:1px solid var(--sf-border);border-radius:999px;background:#fcfcfc;color:var(--sf-ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.04);position:relative}
.sf-top-filter:hover{background:var(--sf-hover)}
.sf-top-filter[hidden]{display:none}
.sf-top-filter svg{width:15px;height:15px}
.sf-top-filter.on::after{content:"";position:absolute;top:1px;right:1px;width:8px;height:8px;border-radius:50%;background:var(--acc);border:2px solid var(--sf-surface)}
#sfCtxNav{flex:none;display:flex;align-items:center;gap:8px}#sfCtxNav[hidden]{display:none}
#sfCtxNav .cal-arrow{width:28px;height:28px;flex:none;padding:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--sf-border);border-radius:999px;background:var(--sf-surface);color:var(--sf-ink);cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.04)}#sfCtxNav .cal-arrow:hover{background:var(--sf-hover)}#sfCtxNav .cal-arrow svg{width:15px;height:15px}
#sfCtxNav .cal-viewseg{display:flex;align-items:center;gap:2px;height:28px;padding:3px;border:0;border-radius:999px;background:#eff0f1}
#sfCtxNav .cal-viewseg button{height:22px;min-width:44px;padding:0 11px;border:0;border-radius:999px;background:transparent;color:var(--sf-sub);font:600 12px Inter;cursor:pointer}#sfCtxNav .cal-viewseg button:hover{color:var(--sf-ink)}#sfCtxNav .cal-viewseg button.on{background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 1px 3px rgba(15,23,42,.12)}
html[data-theme="dark"] #sfCtxNav .cal-viewseg{background:rgba(255,255,255,.08)}html[data-theme="dark"] #sfCtxNav .cal-arrow{background:#1c1c1e;border-color:rgba(255,255,255,.14)}
/* top-right account chip = the account switcher trigger (how you view clients) */
.sf-store{flex:none;margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:9px;
font-size:13.5px;font-weight:600;color:#fff;border:none;background:none;cursor:pointer;
height:36px;padding:0 8px;border-radius:10px;font-family:Inter;transition:background .12s}
.sf-store:hover{background:rgba(255,255,255,.1)}
html[data-theme="light"] .sf-store:hover{background:rgba(0,0,0,.06)}
.sf-store .ava{width:26px;height:26px;border-radius:8px;background:rgba(62,124,250,.16);color:#7FB5FF;border:1px solid #3E7CFA;display:flex;
align-items:center;justify-content:center;font-size:12px;font-weight:700}
html[data-theme="light"] .sf-store .ava{background:rgba(43,108,255,.10);color:#2b6cff;border-color:rgba(43,108,255,.5)}
/* sidebar */
.sf-side{position:fixed;top:56px;left:0;bottom:0;width:260px;padding:8px 12px 12px;overflow:hidden;z-index:20;
display:flex;flex-direction:column;transition:width .46s cubic-bezier(.22,1,.36,1)}
.sf-side-backdrop{display:none;position:fixed;inset:56px 0 0;background:rgba(0,0,0,.56);z-index:6;
opacity:0;transition:opacity .24s ease;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
/* primary nav scrolls within its own region; the channels/settings footer stays pinned */
.sf-scroll{position:relative;flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:none;display:flex;flex-direction:column;gap:3px;
scrollbar-width:none;-ms-overflow-style:none}
.sf-scroll::-webkit-scrollbar{width:0;height:0;display:none}
/* rows keep their fixed height and the region scrolls — never compress to fit */
.sf-scroll>*,.sf-sub>*,.sf-chgroup>*{flex:none}
/* account chip pinned at the bottom of the sidebar */
.sf-acct{flex:none;position:relative;margin-top:3px;padding-top:6px;border-top:1px solid var(--sf-border)}
.sf-acct-btn{display:flex;align-items:center;gap:9px;width:100%;border:1px solid transparent;background:none;cursor:pointer;
min-height:41px;padding:3px 6px;border-radius:10px;text-align:left;transition:background .18s ease}
.sf-acct-btn:hover{background:var(--sf-hover)}
.sf-acct-av{--credit-pct:0;position:relative;width:31px;height:31px;box-sizing:border-box;color:#7FB5FF;flex:none;font:650 11px/1 Inter}
.sf-acct-initial{position:absolute;z-index:2;left:50%;top:50%;width:25px;height:25px;box-sizing:border-box;display:grid;place-items:center;overflow:hidden;border:1px solid #3E7CFA;border-radius:50%;background:rgba(62,124,250,.16);
transform:translate(-50%,-50%);transform-origin:center;transition:transform .3s cubic-bezier(.22,1,.36,1),background .22s ease,border-color .22s ease}
html[data-theme="light"] .sf-acct-initial{background:rgba(43,108,255,.10);color:#2b6cff;border-color:rgba(43,108,255,.5)}
.sf-acct-avatar-image{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.sf-acct-initial.has-photo{border:0;background:transparent}
.sf-acct-initial.has-placeholder{border:0;background:#28282b;color:#a7a7ac}
html[data-theme="light"] .sf-acct-initial.has-placeholder{background:#e9e9eb;color:#717176}
.sf-acct-initial.has-placeholder svg{display:block;width:14px;height:14px}
.sf-acct-usage{position:absolute;z-index:1;left:50%;top:50%;width:33px;height:33px;overflow:visible;opacity:0;pointer-events:none;transform-origin:center;transform:translate(-50%,-50%) rotate(-90deg) scale(.84);transition:opacity .2s ease,transform .34s cubic-bezier(.22,1,.36,1)}
.sf-acct-usage circle{fill:none;stroke-width:1.5}
.sf-acct-usage-track{stroke:rgba(255,255,255,.2)}
.sf-acct-usage-meter{stroke:#fff;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--credit-pct));transition:stroke-dashoffset .45s cubic-bezier(.22,1,.36,1),stroke .24s ease}
html[data-theme="light"] .sf-acct-usage-track{stroke:rgba(0,0,0,.14)}
html[data-theme="light"] .sf-acct-usage-meter{stroke:#000}
.sf-acct-av.is-credit-full .sf-acct-usage-meter{stroke:#ff453a}
.sf-acct-btn:hover .sf-acct-usage-meter,.sf-acct-btn:focus-visible .sf-acct-usage-meter{stroke:#fff;stroke-width:2}
html[data-theme="light"] .sf-acct-btn:hover .sf-acct-usage-meter,html[data-theme="light"] .sf-acct-btn:focus-visible .sf-acct-usage-meter{stroke:#000}
.sf-acct-btn:hover .sf-acct-initial,.sf-acct-btn:focus-visible .sf-acct-initial{transform:translate(-50%,-50%) scale(.84)}
.sf-acct-btn:hover .sf-acct-usage{opacity:1;transform:translate(-50%,-50%) rotate(-90deg) scale(1)}
.sf-acct-meta{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.sf-acct-name{font:650 12px Inter;color:var(--sf-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-acct-sub{position:relative;height:13px;font:500 10.5px Inter;color:var(--sf-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-acct-plan,.sf-acct-usage-label{position:absolute;inset:0;overflow:hidden;text-overflow:ellipsis;transition:opacity .18s ease,transform .28s cubic-bezier(.22,1,.36,1)}
.sf-acct-usage-label{opacity:0;transform:translateY(5px);color:var(--sf-sub);font-variant-numeric:tabular-nums}
.sf-acct-btn:hover .sf-acct-plan,.sf-acct-btn:focus-visible .sf-acct-plan{opacity:0;transform:translateY(-5px)}
.sf-acct-btn:hover .sf-acct-usage-label,.sf-acct-btn:focus-visible .sf-acct-usage-label{opacity:1;transform:none}
.sf-acct-chev{flex:none;color:var(--sf-sub);display:flex}
.sf-acct-chev svg{width:12px;height:12px}
body.sf-collapsed .sf-acct-btn{justify-content:center;padding:3px 0}
body.sf-collapsed .sf-acct-meta,body.sf-collapsed .sf-acct-chev{display:none}
/* account popup — opens upward, mirrors the system account menu */
/* fixed-positioned (JS anchors it to the account chip) so it escapes the
sidebar's overflow:hidden and is never clipped — overlaps content like Shopify */
.sf-acct-menu{position:fixed;width:252px;min-width:252px;background:var(--sf-surface);
border:1px solid var(--sf-border);border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.22);padding:7px;z-index:1000;
animation:cmdkIn .14s cubic-bezier(.22,1,.36,1)}
.sf-acct-menu[hidden]{display:none}
.sf-acct-menu-head{display:flex;align-items:center;justify-content:space-between;padding:8px 9px 7px 11px;font:650 13.5px Inter;color:var(--sf-ink)}
.sf-acct-tools{display:flex;align-items:center;gap:2px;color:var(--sf-sub)}
.sf-acct-tools span{width:25px;height:25px;border-radius:8px;display:flex;align-items:center;justify-content:center}
.sf-acct-tools svg{width:16px;height:16px}
.sf-acct-section{padding:9px 11px 4px;font:600 11.5px Inter;color:var(--sf-sub)}
.sf-acct-row-main{min-width:0;display:flex;flex-direction:column;gap:1px}
.sf-acct-row-name{font:600 13.5px Inter;color:var(--sf-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-acct-row-sub{font:500 11.5px Inter;color:var(--sf-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-acct-tile{width:30px;height:30px;border-radius:8px;background:rgba(62,124,250,.16);color:#7FB5FF;border:1px solid #3E7CFA;display:flex;align-items:center;justify-content:center;flex:none;font:700 11px Inter;letter-spacing:.02em}
html[data-theme="light"] .sf-acct-tile{background:rgba(43,108,255,.10);color:#2b6cff;border-color:rgba(43,108,255,.5)}
.sf-acct-tile.has-photo{overflow:hidden;border:0;border-radius:50%;background:transparent;color:transparent}
.sf-acct-tile.has-photo img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.sf-acct-tile.has-placeholder{border:0;border-radius:50%;background:#28282b;color:#a7a7ac}
html[data-theme="light"] .sf-acct-tile.has-placeholder{background:#e9e9eb;color:#717176}
.sf-acct-tile.has-placeholder svg{display:block;width:17px;height:17px}
.sf-acct-user{display:flex;align-items:center;gap:10px;min-height:48px;padding:7px 10px 10px;margin-bottom:5px;border-bottom:1px solid var(--sf-border)}
.sf-acct-user .sf-acct-tile{width:32px;height:32px;border-radius:50%}
.sf-acct-user .sf-acct-row-main{flex:1}
.sf-acct-menu[data-surface="projects"]{width:360px;min-width:252px;max-width:calc(100vw - 16px)}
.sf-acct-menu[data-surface="projects"]>.sf-acct-user{display:none}
.sf-acct-project-partner:empty{display:none}
.sf-acct-menu .sf-acct-partner-dashboard{width:auto;height:26px;min-height:26px;margin-left:auto;padding:0 8px;flex:none;
border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-hover);font:600 10px Inter;white-space:nowrap}
.sf-acct-menu .sf-acct-partner-dashboard:hover{border-color:var(--sf-dim);background:var(--sf-sel)}
.sf-acct-menu:not([data-surface="projects"]) .sf-acct-partner-dashboard{display:none}
.sf-acct-email{padding:9px 11px 7px;font:550 13px Inter;color:var(--sf-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-acct-menu button{display:flex;align-items:center;gap:12px;width:100%;border:none;background:none;text-align:left;
min-height:38px;padding:0 10px;border-radius:10px;font:550 13.5px Inter;cursor:pointer;color:var(--sf-ink)}
.sf-acct-menu button:hover{background:var(--sf-hover)}
.sf-acct-menu button svg{width:18px;height:18px;flex:none;opacity:.9}
.sf-acct-menu button .km{margin-left:auto;color:var(--sf-dim);font-size:12.5px;opacity:.85}
.sf-acct-menu .sep{height:1px;background:var(--sf-border);margin:6px 8px}
.sf-acct-projects{padding:0 0 3px}
.sf-acct-projects .sf-acct-section{display:flex;align-items:center;justify-content:space-between;padding:5px 11px 6px}
.sf-acct-project-list{display:flex;flex-direction:column;gap:2px;max-height:224px;overflow:auto;overscroll-behavior:contain}
.sf-acct-menu .sf-acct-project{min-height:45px;padding:5px 8px;gap:9px}
.sf-acct-menu .sf-acct-project[aria-current="page"]{background:var(--sf-hover);cursor:default}
.sf-acct-project .sf-acct-tile{width:30px;height:30px;border-radius:9px}
.sf-acct-project .sf-acct-tile[data-tone="0"]{background:rgba(62,124,250,.16);color:#7fb5ff;border-color:#3e7cfa}
.sf-acct-project .sf-acct-tile[data-tone="1"]{background:rgba(139,92,246,.16);color:#c4a8ff;border-color:#8b5cf6}
.sf-acct-project .sf-acct-tile[data-tone="2"]{background:rgba(236,72,153,.15);color:#f49ac5;border-color:#ec4899}
.sf-acct-project .sf-acct-tile[data-tone="3"]{background:rgba(249,115,22,.15);color:#ffb174;border-color:#f97316}
.sf-acct-project .sf-acct-tile[data-tone="4"]{background:rgba(16,185,129,.15);color:#75e1ba;border-color:#10b981}
.sf-acct-project .sf-acct-tile[data-tone="5"]{background:rgba(6,182,212,.15);color:#70dcee;border-color:#06b6d4}
.sf-acct-project .sf-acct-tile[data-tone="6"]{background:rgba(245,158,11,.15);color:#f5c86c;border-color:#f59e0b}
html[data-theme="light"] .sf-acct-project .sf-acct-tile[data-tone="0"]{background:rgba(43,108,255,.10);color:#2b6cff;border-color:rgba(43,108,255,.5)}
html[data-theme="light"] .sf-acct-project .sf-acct-tile[data-tone="1"]{background:rgba(112,71,235,.10);color:#7047eb;border-color:rgba(112,71,235,.5)}
html[data-theme="light"] .sf-acct-project .sf-acct-tile[data-tone="2"]{background:rgba(217,54,130,.10);color:#d93682;border-color:rgba(217,54,130,.5)}
html[data-theme="light"] .sf-acct-project .sf-acct-tile[data-tone="3"]{background:rgba(217,95,11,.10);color:#d95f0b;border-color:rgba(217,95,11,.5)}
html[data-theme="light"] .sf-acct-project .sf-acct-tile[data-tone="4"]{background:rgba(7,139,96,.10);color:#078b60;border-color:rgba(7,139,96,.5)}
html[data-theme="light"] .sf-acct-project .sf-acct-tile[data-tone="5"]{background:rgba(0,127,152,.10);color:#007f98;border-color:rgba(0,127,152,.5)}
html[data-theme="light"] .sf-acct-project .sf-acct-tile[data-tone="6"]{background:rgba(185,113,0,.10);color:#b97100;border-color:rgba(185,113,0,.5)}
.sf-acct-project-state{min-height:44px;margin:0 3px;padding:0 8px;border-radius:10px;display:flex;align-items:center;color:var(--sf-sub);font:500 12.5px/1.35 Inter}
.sf-acct-menu .sf-acct-preview-continue{margin:2px 3px 5px;width:calc(100% - 6px);justify-content:center;background:var(--sf-ink);color:var(--sf-surface);font-weight:650}
.sf-acct-menu .sf-acct-preview-continue:hover{background:var(--sf-ink);opacity:.9}
.sf-acct-project-mark{margin-left:auto;color:var(--sf-dim);display:flex;align-items:center;justify-content:center}
.sf-acct-project-mark svg{width:16px!important;height:16px!important;opacity:.8!important}
.sf-acct-project-current{margin-left:auto;border:1px solid var(--sf-border);border-radius:999px;padding:2px 7px;color:var(--sf-sub);font:600 9.5px Inter;letter-spacing:.02em}
.sf-acct-menu[data-surface="projects"]>.sf-acct-usage-row,
.sf-acct-menu[data-surface="projects"]>.sf-acct-footer,
.sf-acct-menu[data-surface="projects"]>[data-act="settings"]{display:none}
.sf-acct-menu[data-auth-state="preview"]>.sf-acct-usage-row{display:none}
.sf-acct-menu[data-surface="projects"] .sf-acct-projects{padding-bottom:0}
.sf-acct-usage-row{margin-top:2px}
.sf-acct-usage-data{margin-left:auto;display:flex;align-items:center;gap:8px;color:var(--sf-sub);font:500 12px Inter;font-variant-numeric:tabular-nums}
.sf-acct-usage-data b{color:var(--sf-ink);font:600 12px Inter}
.sf-acct-usage-data time{color:var(--sf-dim)}
.sf-acct-footer{display:flex;align-items:center;gap:6px;margin-top:5px;padding-top:5px;border-top:1px solid var(--sf-border)}
.sf-acct-footer>[data-act="logout"]{flex:1;min-width:0}
.sf-acct-menu .sf-theme-toggle{width:44px;height:34px;min-height:34px;flex:none;justify-content:center;padding:3px;border-radius:999px}
.sf-acct-menu .sf-theme-toggle:hover{background:none}
.sf-theme-track{position:relative;display:block;width:40px;height:28px;overflow:hidden;border-radius:999px;background:#e9e9ea;
transition:background-color .36s cubic-bezier(.22,1,.36,1)}
.sf-theme-thumb{position:absolute;left:3px;top:3px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;
color:#242426;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.16);
transform:translateX(0);transition:transform .42s cubic-bezier(.34,1.56,.64,1),background-color .3s ease,color .3s ease}
.sf-acct-menu .sf-theme-toggle .sf-theme-icon{position:absolute;width:14px;height:14px;opacity:1;
transition:opacity .18s ease,transform .32s cubic-bezier(.34,1.56,.64,1)}
.sf-theme-sun{opacity:1;transform:scale(1) rotate(0)}
.sf-theme-moon{opacity:0;transform:scale(.62) rotate(-18deg)}
.sf-theme-toggle[aria-checked="true"] .sf-theme-track{background:#191a1c}
.sf-theme-toggle[aria-checked="true"] .sf-theme-thumb{color:#fff;background:#3a3c42;box-shadow:none;transform:translateX(12px)}
.sf-theme-toggle[aria-checked="true"] .sf-theme-sun{opacity:0;transform:scale(.62) rotate(18deg)}
.sf-theme-toggle[aria-checked="true"] .sf-theme-moon{opacity:1;transform:scale(1) rotate(0)}
.sf-theme-toggle:focus-visible{outline:2px solid #6ea8ff;outline-offset:2px}
@media (prefers-reduced-motion:reduce){
.sf-theme-track,.sf-theme-thumb,.sf-theme-icon{transition:none!important}
}
.sf-nav-item{display:flex;align-items:center;gap:10px;height:38px;padding:0 9px;border-radius:8px;
font-size:13.5px;font-weight:550;color:var(--sf-ink);cursor:pointer;border:none;background:none;
width:100%;text-align:left;transition:background .1s}
.sf-nav-item svg{width:18px;height:18px;fill:currentColor;stroke:none;flex:none;opacity:.9}
.sf-nav-item:hover{background:rgba(127,127,127,.16)}
.sf-nav-item.on{background:var(--sf-sel);font-weight:650}
.sf-group{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:650;color:var(--sf-ink);padding:16px 9px 6px;cursor:default}
.sf-group .gchev,.sf-link .gchev{color:var(--sf-dim);font-size:13px;font-weight:700}
.sf-nav-item.sub{position:relative;padding-left:38px;height:30px;font-weight:500;color:var(--sf-sub)}
.sf-nav-item.sub.branch-on{color:var(--sf-ink)}
.sf-nav-item.sub.has-icon{gap:8px}
.sf-nav-item.sub.has-icon .sf-agentic-ic{width:18px;height:18px;border-radius:6px}
.sf-nav-item.sub.has-icon .sf-agentic-ic svg{width:12px;height:12px}
/* dropdown sub-items: no pill — a continuous left rail (gray track + white active thumb) marks state, like Recents */
.sf-nav-item.sub:hover{background:none;color:var(--sf-ink)}
/* Workspace mode: a section (e.g. Ads) takes over the sidebar. New chat +
Recents + the account footer stay; the main menu swaps for the section's
own nav with a back row. body.sf-ws + #sfWsNav are driven by updateWorkspace(). */
body.sf-ws .sf-scroll>.sf-nav-item[data-view],
body.sf-ws .sf-scroll>.sf-sub,
body.sf-ws .sf-scroll>.sf-group,
body.sf-ws .sf-scroll>.sf-link,
body.sf-ws .sf-scroll>.sf-gtog:not([data-grp="recents"]),
body.sf-ws .sf-scroll>.sf-chgroup:not(.sf-recents){display:none}
#sfWsNav{display:none;padding:2px 0 10px}
body.sf-ws #sfWsNav{display:block}
#sfWsNav .ws-back{display:flex;align-items:center;gap:9px;height:36px;padding:0 9px;margin:0 0 10px;border:none;background:none;border-radius:10px;cursor:pointer;color:var(--sf-sub);font:600 13px Inter;width:100%;text-align:left}
#sfWsNav .ws-back:hover{background:rgba(127,127,127,.16);color:var(--sf-ink)}
#sfWsNav .ws-back svg{width:16px;height:16px;flex:none}
#sfWsNav .ws-title{font:700 10.5px Inter;letter-spacing:.9px;text-transform:uppercase;color:var(--sf-dim);padding:0 9px;margin:0 0 6px}
#sfWsNav .sf-nav-item{width:100%}
body.sf-collapsed #sfWsNav .ws-title{display:none}
/* Ads workspace: sticky tab bar — 64px, black @80% + blur, inset #121212
hairline (matches the header SVG spec / New-agent header treatment). */
.ads-sticky{position:sticky;top:0;z-index:40;height:64px;display:flex;align-items:center;margin:-28px -40px 18px;padding:0 40px;background:rgba(0,0,0,.8);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.ads-sticky::after{content:'';position:absolute;left:40px;bottom:0;height:1px;width:900px;max-width:calc(100% - 80px);background:#121212}
.ads-subtabs{display:flex;gap:22px;height:100%}
.ads-subtabs .ast{height:100%;display:flex;align-items:center;background:none;border:none;border-bottom:2px solid transparent;color:var(--sf-dim);font:600 13.5px Inter;cursor:pointer;padding:0 2px}
.ads-subtabs .ast:hover{color:var(--sf-sub)}
.ads-subtabs .ast.on{color:var(--sf-ink);border-bottom-color:var(--sf-ink)}
.ads-bartitle{font:700 15px Inter;color:var(--sf-ink)}
@keyframes adsGaugeSweep{from{transform:rotate(-90deg)}to{transform:rotate(var(--gtgt))}}
.ads-needle{transform-origin:60px 60px;animation:adsGaugeSweep 1.1s cubic-bezier(.22,1,.36,1) both}
/* Ads hero — Symphony-style front door: one big composer, generate first. */
.ads-hero{display:flex;flex-direction:column;align-items:center;padding:48px 0 24px}
.ah-title{font:750 34px/1.15 Inter;color:var(--sf-ink);margin:0 0 30px;text-align:center;letter-spacing:-.5px}
.ah-card{width:min(880px,100%);background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:18px;padding:18px 20px 14px;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.ah-tabs{display:flex;gap:18px;border-bottom:1px solid var(--sf-border);margin:0 0 16px}
.ah-tabs .aht{background:none;border:none;border-bottom:2px solid transparent;padding:0 2px 10px;font:600 14px Inter;color:var(--sf-dim);cursor:pointer;margin-bottom:-1px}
.ah-tabs .aht.on{color:var(--sf-ink);border-bottom-color:#7A7BFF}
.ah-body{display:flex;gap:14px;align-items:flex-start}
.ah-ref{width:76px;height:76px;flex:none;border-radius:12px;background:var(--sf-hover);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;color:var(--sf-sub);font:600 11.5px Inter;border:1px solid transparent}
.ah-ref:hover{border-color:var(--sf-border);color:var(--sf-ink)}
.ah-ref .plus{font-size:20px;line-height:1;color:var(--sf-ink)}
.ah-ta{flex:1;min-height:86px;resize:none;border:none;background:none;outline:none;color:var(--sf-ink);font:400 14.5px/1.55 Inter}
.ah-ta::placeholder{color:var(--sf-dim)}
.ah-foot{display:flex;align-items:center;gap:8px;margin-top:12px}
.ah-pill{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 13px;border-radius:999px;border:1px solid var(--sf-border);background:none;color:var(--sf-sub);font:600 12.5px Inter;cursor:pointer}
.ah-pill:hover{color:var(--sf-ink);background:var(--sf-hover)}
.ah-credits{margin-left:auto;display:inline-flex;align-items:center;gap:5px;color:var(--sf-sub);font:600 12.5px Inter}
.ah-send{width:36px;height:36px;border-radius:999px;border:none;background:var(--sf-ink);color:var(--sf-bg);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.ah-send:disabled{opacity:.4;cursor:default}
.ah-sugg{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:26px}
.ah-sugg button{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--sf-border);background:var(--sf-surface);color:var(--sf-ink);font:600 13px Inter;cursor:pointer}
.ah-sugg button:hover{background:var(--sf-hover)}
.sf-nav-item.sub.on{background:none;box-shadow:none;color:var(--sf-ink)}
/* ONE continuous guide track spanning the whole open dropdown — no per-row gaps */
.sf-sub.open{position:relative}
.sf-sub.open::before{content:'';position:absolute;left:18px;top:0;bottom:0;width:1px;background:rgba(0,0,0,.13);pointer-events:none}
html[data-theme="dark"] .sf-sub.open::before{background:#272728}
/* a single white thumb per dropdown SLIDES between rows (hover) and rests on the active item */
.sf-subthumb{position:absolute;left:18px;top:0;width:1px;height:30px;background:var(--sf-ink);pointer-events:none;will-change:transform;z-index:1}
.sf-subthumb[hidden]{display:none}
/* Search chats isn't a dropdown tab — drop the rail line, sit it a touch lower, keep a normal hover pill */
.sf-chatsub{margin-top:8px}
.sf-chatsub .sf-nav-item.sub{padding-left:9px}
.sf-chatsub .sf-nav-item.sub svg{opacity:.9}
.sf-sub.sf-chatsub.open::before{content:none}
.sf-chatsub .sf-nav-item.sub:hover{background:rgba(127,127,127,.16)}
html[data-theme="dark"] .sf-chatsub .sf-nav-item.sub:hover{background:#18181c}
.sf-sub{display:none;flex-direction:column;gap:1px}
.sf-sub.open{display:flex}
.sf-sub .sf-sub{width:calc(100% - 16px);margin-left:16px}
.sf-gtog{display:flex;align-items:center;gap:5px;width:100%;font-size:12px;font-weight:650;color:var(--sf-ink);padding:16px 9px 6px;cursor:pointer;background:none;border:0;text-align:left;font-family:inherit}
.sf-gtog .gchev{color:var(--sf-dim);font-size:13px;font-weight:700;transition:transform .18s ease;display:inline-block}
.sf-gtog.open .gchev{transform:rotate(90deg)}
/* Kill the browser's default blue/white focus ring on the sidebar chrome
buttons/links (it flashed on "Recents" after a click). Inputs keep their own
focus styles for accessibility. */
.sf-side button:focus,.sf-side button:focus-visible,.sf-side a:focus,.sf-side a:focus-visible,
.sf-gtog:focus,.sf-gtog:focus-visible,
.sf-nav-item:focus,.sf-nav-item:focus-visible,.sf-link:focus,.sf-link:focus-visible{outline:none;box-shadow:none}
.sf-chgroup{display:none;flex-direction:column;gap:1px}
.sf-chgroup.open{display:flex}
/* Only Recents and Pinned belong inside Chats. Task, message and agent
workspaces sit beside the disclosure as independent navigation rows. */
.sf-chat-nav-stack{position:relative;z-index:1}
.sf-pin-tasks{position:relative;display:flex;flex-direction:column;padding:2px 0 7px}
.sf-chat-tools{display:flex;flex-direction:column;gap:1px;margin:0 2px}
.sf-chat-tool{height:38px;padding:0 9px;color:var(--sf-ink);font-size:13.5px;font-weight:550}
.sf-chat-tool svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.sf-folder-row{position:relative;z-index:2;display:flex;align-items:center;gap:9px;width:100%;height:34px;margin-left:0;padding:0 9px;border:0;border-radius:8px;background:transparent;color:var(--sf-sub);font:550 13px Inter;text-align:left;cursor:pointer;
transition:height .36s cubic-bezier(.22,1,.36,1),width .36s cubic-bezier(.22,1,.36,1),margin-left .36s cubic-bezier(.22,1,.36,1),
padding .36s cubic-bezier(.22,1,.36,1),border-radius .36s cubic-bezier(.22,1,.36,1),
border-color .28s ease,background-color .28s ease,color .28s ease,box-shadow .28s ease}
.sf-folder-row:hover{background:rgba(127,127,127,.16);color:var(--sf-ink)}
.sf-folder-row.on{background:var(--sf-sel);color:var(--sf-ink);font-weight:650}
.sf-work-test{color:var(--sf-ink)!important}
.sf-work-test:hover{background:rgba(127,127,127,.16)!important;color:var(--sf-ink)!important}.sf-work-test.on{background:var(--sf-sel)!important;color:var(--sf-ink)!important}
.sf-work-test-badge{flex:none;padding:2px 6px;border:1px solid var(--sf-border);border-radius:999px;background:var(--sf-surface);color:var(--sf-sub);font:700 8.5px/1 Inter;letter-spacing:.08em;text-transform:uppercase}
html:not([data-theme="dark"]) body.shopify .sf-chat-tool[data-folder-view="work"].on{background:#fff!important;box-shadow:0 1px 2px rgba(0,0,0,.035)}
.sf-folder-row svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;opacity:.92}
.sf-folder-row .lbl{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-folder-count{min-width:18px;padding:0 4px;color:var(--sf-dim);font:600 10.5px Inter;text-align:right}
.sf-folder-count:empty{display:none}
.sf-nav-item.sf-folder-row.sf-chat-tool{height:38px;padding:0 9px;color:var(--sf-ink);font:550 13.5px Inter}
/* Work is a deliberately small test surface over the existing task and agent
records. It adds no new dashboard layer and does not replace either tool. */
body.shopify[data-view="work"] .sf-content{right:0;overflow:hidden;isolation:isolate}
body.shopify.has-rail[data-view="work"] .sf-content{right:0}
body.shopify[data-view="work"] .sf-page{box-sizing:border-box;width:100%;max-width:none;height:100%;min-height:0;overflow:hidden;padding:0 24px 24px}
body.shopify[data-view="work"] .composer,body.shopify[data-view="work"] .assistant-tray,body.shopify[data-view="work"] .voice-wave-stage,body.shopify[data-view="work"] .sf-rail{display:none!important}
body.shopify[data-view="work"].work-modal-open .sf-content{overflow:hidden}
.wk{box-sizing:border-box;width:100%;max-width:none;height:100%;min-height:0;margin:0;padding:18px 0 0;display:flex;flex-direction:column;overflow:hidden;color:var(--sf-ink);isolation:isolate}
.wk-summary{height:84px;min-height:84px;display:grid;grid-template-columns:190px repeat(3,minmax(0,1fr));border:1px solid var(--sf-border);border-radius:14px;overflow:hidden;background:var(--sf-surface);box-shadow:0 1px 0 rgba(0,0,0,.02)}
.wk-summary-cell{min-width:0;display:flex;flex-direction:column;justify-content:center;padding:0 22px;border-right:1px solid var(--sf-border-2);transition:background .12s}.wk-summary-cell:last-child{border-right:0}.wk-summary-cell:not(:first-child):hover{background:var(--sf-hover)}
.wk-live{display:flex;align-items:center;justify-content:center;gap:12px}.wk-live-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:transparent;color:#fff}.wk-live-mark .agob-mark,.wk-live-mark .attract-bot-svg{display:block;width:38px;height:38px}.wk-live-mark .attract-bot-svg{overflow:visible}
.wk-live-title{display:flex;align-items:center;gap:6px;margin-top:0;font:680 15px/1 Inter}.wk-live-dot{position:relative;width:7px;height:7px;border-radius:50%;background:#35c76f;box-shadow:0 0 0 3px rgba(53,199,111,.12)}.wk-live-dot::after{content:'';position:absolute;inset:0;border-radius:inherit;background:rgba(53,199,111,.42);animation:wk-live-pulse 1.8s ease-out infinite}@keyframes wk-live-pulse{0%{opacity:.7;transform:scale(.8)}70%,100%{opacity:0;transform:scale(2.45)}}@media(prefers-reduced-motion:reduce){.wk-live-dot::after{animation:none;display:none}}
.wk-summary-label{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-sub);font:560 11px/1 Inter}.wk-summary-value{display:block;margin-top:8px;font:720 18px/1 Inter;letter-spacing:-.025em}.wk-summary-note{display:block;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-dim);font:510 9.5px/1 Inter}
.wk-tools{position:relative;z-index:12;display:flex;align-items:center;gap:9px;flex:none;margin:14px 0 0}
.wk-filter,.wk-action{height:38px;padding:0 14px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:650 11.5px Inter;cursor:pointer}.wk-filter.on{border-color:var(--sf-border);background:var(--sf-surface);color:var(--sf-ink)}
.wk-search{display:flex;align-items:center;gap:8px;min-width:260px;max-width:none;flex:1;height:38px;padding:0 12px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface)}
.wk-search svg{width:16px;height:16px;fill:none;stroke:var(--sf-dim);stroke-width:1.8}.wk-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--sf-ink);font:13px Inter}
.wk-action{margin-left:auto;border-color:var(--sf-ink);background:var(--sf-ink);color:var(--sf-surface)}
.wk-table{position:relative;z-index:1;min-width:0;min-height:168px;flex:1;margin-top:14px;border:1px solid var(--sf-border);border-radius:13px;overflow:auto;background:var(--sf-surface);isolation:isolate;scrollbar-width:none;-ms-overflow-style:none}.wk-table::-webkit-scrollbar{width:0;height:0;display:none}
.wk-table-head,.wk-row{display:grid;grid-template-columns:minmax(230px,1.45fr) minmax(120px,.75fr) 115px minmax(140px,.8fr) 150px 85px 90px;align-items:center;gap:16px;padding:0 18px}
.wk-table-head{position:sticky;top:0;z-index:5;height:46px;border-bottom:1px solid var(--sf-border);background:var(--sf-surface);color:var(--sf-sub);font:650 10.5px Inter}
.wk-row{box-sizing:border-box;width:100%;min-height:62px;border:0;border-bottom:1px solid var(--sf-border-2);background:var(--sf-surface);color:var(--sf-ink);text-align:left;cursor:pointer;overflow:hidden}.wk-row:last-child{border-bottom:0}.wk-row:hover{background:var(--sf-hover)}
.wk-task{display:flex;align-items:center;gap:11px;min-width:0}.wk-task-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:10px;background:var(--sf-hover);color:var(--sf-ink);flex:none}.wk-task-icon svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.wk-task-copy{min-width:0}.wk-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:650 12.5px/1.2 Inter}.wk-sub{display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-dim);font:510 9.5px/1 Inter}
.wk-project,.wk-last{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-sub);font:550 11px Inter}.wk-state{display:inline-flex;align-items:center;gap:7px;width:max-content;padding:5px 9px;border:1px solid var(--sf-line);border-radius:999px;color:var(--sf-sub);font:620 10px Inter}.wk-dot{width:6px;height:6px;border-radius:50%;background:#9a9a9f}.wk-dot.doing,.wk-dot.review{background:#2dc774}
.wk-people{display:flex;align-items:center}.wk-avatar{display:grid;place-items:center;width:27px;height:27px;margin-left:-6px;border:2px solid var(--sf-surface);border-radius:50%;background:#e9e9ec;color:#444;font:700 8px Inter;overflow:hidden}.wk-avatar:first-child{margin-left:0}.wk-avatar .agob-mark,.wk-avatar .agob-upload-mark{transform:scale(.84)}.wk-people-more{margin-left:6px;color:var(--sf-sub);font:600 9px Inter}
.wk-progress{display:flex;align-items:center;gap:9px}.wk-progress-track{display:flex;gap:3px}.wk-progress-track i{display:block;width:7px;height:22px;border-radius:3px;background:rgba(127,127,127,.14)}.wk-progress-track i.on{background:#2dc774}.wk-progress span{color:var(--sf-sub);font:600 9px Inter}
.wk-due{color:var(--sf-sub);font:600 10px Inter}.wk-due.late{color:#e5484d}.wk-empty{padding:52px 20px;color:var(--sf-sub);font:500 13px Inter;text-align:center}
.wk>.agov-toolbar{flex:none;margin:14px 0 0}.wk>.agov-agent-index{flex:1;min-height:0;margin-top:14px;overflow:hidden}.wk>.agov-agent-index .agov-agent-table-wrap{height:100%;max-height:none}.wk .agov-agent-table{min-width:900px}.wk .agov-agent-row td{height:70px}.wk .agov-agent-cell-copy .agov-agent-message{color:var(--sf-dim)}.wk .agov-agent-date:empty::after{content:'—'}.wk .agov-table-work{max-width:300px}.wk .agov-work-status.todo i,.wk .agov-work-status.backlog i{background:#9a9a9f}.wk .agov-work-status.review{border-color:rgba(224,165,58,.38);color:#b88116}.wk .agov-work-status.review i{background:#e0a53a}.wk .agov-work-status.done{border-color:rgba(53,199,111,.36);color:#2fb968}.wk .agov-work-status.done i{background:#35c76f}.wk .agov-work-status.canceled{color:var(--sf-dim)}
.wk-view-tabs{height:38px;display:flex;align-items:stretch;gap:9px;flex:none}.wk-view-tab{min-width:86px;padding:0 14px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-sub);font:650 10.5px Inter;white-space:nowrap;cursor:pointer}.wk-view-tab:hover{background:var(--sf-hover);color:var(--sf-ink)}.wk-view-tab.on,.wk-view-tab.on:hover{border-color:#111;background:#111;color:#fff}.wk>.agov-toolbar .agov-search{min-width:180px}.wk>.agov-toolbar .agov-new-task{width:38px;min-width:38px;padding:0;justify-content:center;border-color:var(--sf-border);background:var(--sf-surface);color:var(--sf-ink)}.wk>.agov-toolbar .agov-new-task:hover{background:var(--sf-hover);color:var(--sf-ink)}.wk>.agov-toolbar .agov-new-task svg{margin:0}
.wk-combined-filter .agov-filter-btn{position:relative;width:38px;min-width:38px;padding:0;justify-content:center}.wk-combined-filter .agov-filter-btn [data-iconstack-id="hugeicon-filter"]{width:16px;height:16px;transform:none!important;transition:none!important}.wk-combined-filter.open .agov-filter-btn [data-iconstack-id="hugeicon-filter"]{transform:none!important}.wk-combined-filter .agov-filter-menu{right:0;left:auto;width:220px;padding:10px}.wk-filter-section+.wk-filter-section{margin-top:9px;padding-top:9px;border-top:1px solid var(--sf-border-2)}.wk-filter-section-label{display:block;padding:2px 8px 6px;color:var(--sf-dim);font:650 9px/1 Inter;letter-spacing:.06em;text-transform:uppercase}.wk-filter-choice.on::after{content:'✓';color:var(--sf-ink);font-weight:750}.wk-filter-active-count{position:absolute;top:4px;right:4px;display:grid;place-items:center;min-width:12px;height:12px;padding:0 2px;border-radius:999px;background:var(--sf-ink);color:var(--sf-surface);font:700 7px/1 Inter}
.wk-modal-backdrop{position:fixed;z-index:32;top:56px;right:0;bottom:0;left:260px;display:grid;place-items:center;box-sizing:border-box;padding:28px;background:rgba(0,0,0,.38);overflow:hidden;overscroll-behavior:contain}
.wk-modal{display:flex;flex-direction:column;width:min(720px,100%);max-height:min(760px,calc(100vh - 112px));overflow:hidden;border:1px solid var(--sf-line);border-radius:18px;background:var(--sf-surface);box-shadow:0 24px 80px rgba(0,0,0,.22)}
.wk-create-menu-wrap{position:relative;flex:none}.wk-create-menu{position:absolute;z-index:24;top:calc(100% + 9px);right:0;width:228px;padding:7px;border:1px solid var(--sf-border);border-radius:15px;background:var(--sf-surface);box-shadow:0 16px 42px rgba(0,0,0,.16)}.wk-new-create-option{display:flex;align-items:center;gap:10px;width:100%;height:48px;padding:0 9px;border:0;border-radius:10px;background:transparent;color:var(--sf-ink);font:620 12.5px/1 Inter;text-align:left;cursor:pointer}.wk-new-create-option:hover{background:var(--sf-hover)}.wk-create-icon{display:grid;place-items:center;width:30px;height:30px;flex:none;border:1px solid var(--sf-border-2);border-radius:9px;background:var(--sf-hover);color:var(--sf-ink)}.wk-new-create-option:hover .wk-create-icon{background:var(--sf-surface)}.wk-create-icon svg{display:block;width:17px;height:17px;fill:none}
.wk-modal-head{display:flex;align-items:flex-start;gap:12px;padding:22px 24px;border-bottom:1px solid var(--sf-line)}.wk-modal-heading{min-width:0;flex:1}.wk-modal-kicker{color:var(--sf-sub);font:700 9px/1.2 Inter;letter-spacing:.1em;text-transform:uppercase}.wk-modal-title{margin:5px 0 0;font:700 20px/1.25 Inter}.wk-modal-close{width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:var(--sf-sub);font:400 22px/1 Inter;cursor:pointer}.wk-modal-close:hover{background:rgba(127,127,127,.1)}
.wk-modal-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:22px 24px}.wk-ai-note{display:flex;gap:10px;margin-bottom:20px;padding:13px 14px;border-radius:11px;background:rgba(35,190,102,.075);color:var(--sf-sub);font:520 11.5px/1.5 Inter}.wk-ai-note svg{width:17px;height:17px;flex:none;fill:none;stroke:#168a4b;stroke-width:1.8}
.wk-section{margin-top:20px}.wk-section:first-child{margin-top:0}.wk-section-title{margin-bottom:9px;font:700 11px/1.2 Inter}.wk-section-copy{color:var(--sf-sub);font:520 12px/1.55 Inter}.wk-plan{display:flex;flex-direction:column}.wk-plan-step{display:grid;grid-template-columns:25px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid var(--sf-line)}.wk-plan-step:last-child{border-bottom:0}.wk-plan-num{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:rgba(35,190,102,.1);color:#168a4b;font:700 9px Inter}.wk-plan-step b{display:block;font:650 11.5px/1.35 Inter}.wk-plan-step span{display:block;margin-top:2px;color:var(--sf-sub);font:500 10.5px/1.45 Inter}
.wk-modal-foot{flex:none;display:flex;align-items:center;justify-content:flex-end;gap:9px;padding:16px 24px;border-top:1px solid var(--sf-line);background:var(--sf-surface)}.wk-secondary,.wk-primary{height:38px;padding:0 15px;border:1px solid var(--sf-line);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);font:650 11px Inter;cursor:pointer}.wk-primary{border-color:var(--sf-ink);background:var(--sf-ink);color:var(--sf-surface)}
.wk-picker-group{margin-top:18px}.wk-picker-label{display:flex;justify-content:space-between;margin-bottom:8px;font:700 11px Inter}.wk-picker-label span{color:var(--sf-sub);font-weight:500}.wk-picker-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.wk-picker{display:flex;align-items:center;gap:10px;min-height:54px;padding:8px 10px;border:1px solid var(--sf-line);border-radius:10px;background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}.wk-picker.on{border-color:rgba(35,190,102,.5);background:rgba(35,190,102,.075)}.wk-picker-copy{min-width:0;flex:1}.wk-picker-check{display:grid;place-items:center;width:17px;height:17px;border:1px solid var(--sf-line);border-radius:50%;color:transparent;font-size:10px}.wk-picker.on .wk-picker-check{border-color:#168a4b;background:#168a4b;color:#fff}.wk-collab-summary{display:flex;align-items:center;gap:10px;margin-top:20px;padding:12px 14px;border:1px solid var(--sf-line);border-radius:11px}.wk-collab-summary-copy b{display:block;font:650 11px Inter}.wk-collab-summary-copy span{display:block;margin-top:3px;color:var(--sf-sub);font:500 10px Inter}
.wk-mode-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}.wk-mode{display:flex;align-items:center;gap:11px;min-height:54px;padding:9px 12px;border:1px solid var(--sf-line);border-radius:11px;background:var(--sf-surface);color:var(--sf-ink);text-align:left;cursor:pointer}.wk-mode:hover{border-color:rgba(35,190,102,.48);background:rgba(35,190,102,.055)}.wk-mode svg{width:19px;height:19px;flex:none;fill:none;stroke:#168a4b;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.wk-mode b{display:block;font:680 11.5px/1.3 Inter}.wk-mode span span{display:block;margin-top:2px;color:var(--sf-sub);font:500 9.5px/1.35 Inter}
.wk-room-modal{width:min(920px,100%);height:min(720px,calc(100vh - 112px));max-height:none}.wk-room-head-people{display:flex;align-items:center;margin-right:8px}.wk-room-body{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:0;flex:1;padding:0;overflow:hidden}.wk-room-side{min-height:0;overflow-y:auto;padding:18px;border-right:1px solid var(--sf-line);background:rgba(127,127,127,.035)}.wk-room-side .wk-section{margin-top:18px}.wk-room-progress{margin-top:8px}.wk-room-progress .wk-progress{justify-content:space-between}.wk-room-progress .wk-progress-track i{width:9px;height:18px}.wk-room-steps{display:flex;flex-direction:column;gap:10px;margin-top:10px}.wk-room-step{display:grid;grid-template-columns:18px 1fr;gap:8px;color:var(--sf-sub);font:520 10px/1.35 Inter}.wk-room-step i{display:grid;place-items:center;width:17px;height:17px;border:1px solid var(--sf-line);border-radius:50%;font:700 8px Inter;font-style:normal}.wk-room-step.done{color:var(--sf-ink)}.wk-room-step.done i{border-color:#168a4b;background:#168a4b;color:#fff}.wk-room-step.current{color:var(--sf-ink);font-weight:650}.wk-room-step.current i{border-color:#168a4b;color:#168a4b}
.wk-room-main{display:flex;flex-direction:column;min-width:0;min-height:0}.wk-thread{display:flex;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;flex-direction:column;gap:13px;padding:20px}.wk-thread-event{align-self:center;color:var(--sf-dim);font:550 9px/1.4 Inter;text-align:center}.wk-thread-msg{display:flex;align-items:flex-start;gap:9px;max-width:86%}.wk-thread-msg.user{align-self:flex-end;flex-direction:row-reverse}.wk-thread-bubble{padding:10px 12px;border-radius:5px 13px 13px 13px;background:rgba(127,127,127,.1);color:var(--sf-ink);font:520 11.5px/1.5 Inter}.wk-thread-msg.user .wk-thread-bubble{border-radius:13px 5px 13px 13px;background:var(--sf-ink);color:var(--sf-surface)}.wk-thread-name{display:block;margin-bottom:3px;color:var(--sf-sub);font:680 9px Inter}.wk-room-compose{display:flex;align-items:flex-end;gap:8px;padding:13px 16px;border-top:1px solid var(--sf-line);background:var(--sf-surface)}.wk-room-compose textarea{min-height:38px;max-height:96px;flex:1;resize:none;box-sizing:border-box;padding:10px 12px;border:1px solid var(--sf-line);border-radius:10px;outline:0;background:transparent;color:var(--sf-ink);font:500 11.5px/1.4 Inter}.wk-room-compose textarea:focus{border-color:rgba(35,190,102,.58)}.wk-room-send{width:38px;height:38px;border:0;border-radius:10px;background:#168a4b;color:#fff;font-size:16px;cursor:pointer}.wk-room-footer-copy{margin-right:auto;color:var(--sf-sub);font:550 10px Inter}.wk-primary[disabled]{opacity:.38;cursor:not-allowed}
.wk-thread.real-agent-thread{display:block;padding:24px max(24px,calc((100% - 720px)/2));scroll-behavior:smooth}.wk-thread.real-agent-thread .agx-turn{margin-bottom:18px}.wk-thread.real-agent-thread .agx-assistant,.wk-thread.real-agent-thread .agx-progress-bubble{max-width:min(100%,680px)}.wk-thread-empty{min-height:100%;display:grid;place-content:center;justify-items:center;padding:28px;color:var(--sf-dim);text-align:center}.wk-thread-empty b{color:var(--sf-ink);font:650 13px/1.3 Inter}.wk-thread-empty span{max-width:360px;margin-top:6px;font:500 11.5px/1.5 Inter}.wk-room-compose.busy{opacity:.68}.wk-room-compose textarea:disabled,.wk-room-send:disabled{cursor:wait}.wk-room-session-status{display:inline-flex;align-items:center;gap:6px}.wk-room-session-status i{width:6px;height:6px;border-radius:50%;background:#8c8c92}.wk-room-session-status.live i{background:#2dc774}
@media(max-width:980px){body.shopify[data-view="work"] .sf-page{padding:0 20px 20px}.wk{padding-top:18px}.wk-summary{height:auto;min-height:140px;grid-template-columns:1fr 1fr}.wk-summary-cell{padding:14px 18px}.wk-summary-cell:nth-child(2){border-right:0}.wk-summary-cell:nth-child(-n+2){border-bottom:1px solid var(--sf-border-2)}.wk-table-head,.wk-row{min-width:1000px}}
/* Work workspace A+ visual consistency. This is intentionally scoped to the
dashboard surface; the conversation composer and its glass treatment are
not part of this system. */
body.shopify[data-view="work"]{
--wk-canvas:#f5f5f3;--wk-panel:#ffffff;--wk-raised:#fafaf9;--wk-ink:#171719;
--wk-muted:#646469;--wk-faint:#919197;--wk-line:rgba(23,23,25,.10);
--wk-line-soft:rgba(23,23,25,.065);--wk-hover:rgba(23,23,25,.045);
--wk-focus:rgba(46,141,245,.26);--wk-shadow:0 18px 50px -38px rgba(18,18,20,.34);
--wk-pop-shadow:0 24px 70px -28px rgba(18,18,20,.34);--wk-radius:16px;
}
html[data-theme="dark"] body.shopify[data-view="work"]{
--wk-canvas:#0b0c0e;--wk-panel:#121316;--wk-raised:#17181c;--wk-ink:#f3f3f5;
--wk-muted:#b2b2b9;--wk-faint:#7f7f89;--wk-line:rgba(255,255,255,.105);
--wk-line-soft:rgba(255,255,255,.065);--wk-hover:rgba(255,255,255,.055);
--wk-focus:rgba(118,173,255,.30);--wk-shadow:0 22px 60px -40px rgba(0,0,0,.95);
--wk-pop-shadow:0 28px 80px -30px rgba(0,0,0,.9);
}
body.shopify[data-view="work"] .sf-content{background:var(--wk-canvas)}
body.shopify[data-view="work"] .sf-work-test-badge{display:none}
body.shopify[data-view="work"] .wk{color:var(--wk-ink)}
body.shopify[data-view="work"] .wk-summary{
height:96px;min-height:96px;grid-template-columns:210px repeat(3,minmax(0,1fr));
border-color:var(--wk-line);border-radius:var(--wk-radius);background:var(--wk-panel);
box-shadow:var(--wk-shadow)
}
body.shopify[data-view="work"] .wk-summary-cell{padding:0 26px;border-color:var(--wk-line-soft);transition:background .18s cubic-bezier(.22,1,.36,1)}
body.shopify[data-view="work"] .wk-summary-cell:not(:first-child):hover{background:var(--wk-hover)}
body.shopify[data-view="work"] .wk-live{justify-content:flex-start;gap:14px}
body.shopify[data-view="work"] .wk-live-mark,body.shopify[data-view="work"] .wk-live-mark .agob-mark,body.shopify[data-view="work"] .wk-live-mark .attract-bot-svg{width:42px;height:42px}
body.shopify[data-view="work"] .wk-live-title{gap:8px;font-size:17px;letter-spacing:-.02em}
body.shopify[data-view="work"] .wk-live-dot{width:8px;height:8px;box-shadow:0 0 0 4px rgba(53,199,111,.12)}
body.shopify[data-view="work"] .wk-summary-label{color:var(--wk-muted);font-size:11.5px;font-weight:620}
body.shopify[data-view="work"] .wk-summary-value{margin-top:7px;color:var(--wk-ink);font-size:22px;letter-spacing:-.04em}
body.shopify[data-view="work"] .wk-summary-note{margin-top:6px;color:var(--wk-faint);font-size:10.5px}
body.shopify[data-view="work"] .wk>.agov-toolbar{gap:10px;margin-top:16px}
body.shopify[data-view="work"] .wk-view-tabs{height:42px;gap:8px}
body.shopify[data-view="work"] .wk-view-tab{
min-width:92px;padding:0 16px;border-color:var(--wk-line);border-radius:12px;
background:var(--wk-panel);color:var(--wk-muted);font-size:11.5px;
transition:transform .18s cubic-bezier(.22,1,.36,1),background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease
}
body.shopify[data-view="work"] .wk-view-tab:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--wk-ink) 18%,transparent);background:var(--wk-raised);color:var(--wk-ink)}
body.shopify[data-view="work"] .wk-view-tab.on,body.shopify[data-view="work"] .wk-view-tab.on:hover{border-color:var(--wk-ink);background:var(--wk-ink);color:var(--wk-panel);box-shadow:0 8px 22px -15px color-mix(in srgb,var(--wk-ink) 55%,transparent)}
body.shopify[data-view="work"] .wk .sf-ord-btn,body.shopify[data-view="work"] .wk .sf-search-sm{height:42px;border-color:var(--wk-line);border-radius:12px;background:var(--wk-panel);color:var(--wk-ink);box-shadow:0 1px 1px rgba(0,0,0,.015)}
body.shopify[data-view="work"] .wk .sf-ord-btn{font-size:11.5px}
body.shopify[data-view="work"] .wk .sf-ord-btn:hover{border-color:color-mix(in srgb,var(--wk-ink) 18%,transparent);background:var(--wk-raised)}
body.shopify[data-view="work"] .wk .agov-search{min-width:220px;padding-inline:14px}
body.shopify[data-view="work"] .wk .agov-search .sf-search-inp{color:var(--wk-ink);font-size:13px}
body.shopify[data-view="work"] .wk .agov-search .sf-search-inp::placeholder{color:var(--wk-faint)}
body.shopify[data-view="work"] .wk>.agov-toolbar .agov-new-task,body.shopify[data-view="work"] .wk-combined-filter .agov-filter-btn{width:42px;min-width:42px}
body.shopify[data-view="work"] .wk-view-tab:focus-visible,body.shopify[data-view="work"] .wk button:focus-visible,body.shopify[data-view="work"] .wk input:focus-visible{outline:3px solid var(--wk-focus);outline-offset:2px}
body.shopify[data-view="work"] .wk .agov-filter-menu,body.shopify[data-view="work"] .wk-create-menu{
top:calc(100% + 9px);padding:8px;border-color:var(--wk-line);border-radius:14px;
background:var(--wk-raised);box-shadow:var(--wk-pop-shadow)
}
body.shopify[data-view="work"] .wk .agov-filter-menu button,body.shopify[data-view="work"] .wk-filter-choice{min-height:40px;border-radius:9px;color:var(--wk-ink);font-size:11.5px}
body.shopify[data-view="work"] .wk .agov-filter-menu button:hover,body.shopify[data-view="work"] .wk .agov-filter-menu button.on,body.shopify[data-view="work"] .wk-filter-choice:hover{background:var(--wk-hover)}
body.shopify[data-view="work"] .wk-filter-section-label{padding:4px 10px 7px;color:var(--wk-faint);font-size:9.5px}
body.shopify[data-view="work"] .wk-filter-section+.wk-filter-section{border-color:var(--wk-line-soft)}
body.shopify[data-view="work"] .wk-create-menu{width:238px}
body.shopify[data-view="work"] .wk-new-create-option{height:52px;border-radius:10px;color:var(--wk-ink);font-size:12.5px;transition:background .16s ease}
body.shopify[data-view="work"] .wk-new-create-option:hover{background:var(--wk-hover)}
body.shopify[data-view="work"] .wk-create-icon{border-color:var(--wk-line-soft);background:var(--wk-panel)}
body.shopify[data-view="work"] .wk>.agov-agent-index{margin-top:16px}
body.shopify[data-view="work"] .wk>.agov-agent-index .agov-agent-table-wrap{
border-color:var(--wk-line);border-radius:var(--wk-radius);background:var(--wk-panel);box-shadow:var(--wk-shadow)
}
body.shopify[data-view="work"] .wk .agov-agent-table thead th{height:50px;background:var(--wk-raised);color:var(--wk-muted);font-size:10.5px;letter-spacing:.01em}
body.shopify[data-view="work"] .wk .agov-agent-table thead th::before{background:var(--wk-line-soft)}
body.shopify[data-view="work"] .wk .agov-agent-table th:first-child,body.shopify[data-view="work"] .wk .agov-agent-table td:first-child{background:var(--wk-panel)}
body.shopify[data-view="work"] .wk .agov-agent-table th:first-child{background:var(--wk-raised)}
body.shopify[data-view="work"] .wk .agov-agent-table th:first-child::after,body.shopify[data-view="work"] .wk .agov-agent-table td:first-child::after{background:var(--wk-line-soft)}
body.shopify[data-view="work"] .wk .agov-agent-row td{height:76px;border-color:var(--wk-line-soft);transition:background .16s ease}
body.shopify[data-view="work"] .wk .agov-agent-row:hover td{background:var(--wk-hover)}
body.shopify[data-view="work"] .wk .agov-agent-cell-copy b{color:var(--wk-ink);font-size:13px}
body.shopify[data-view="work"] .wk .agov-agent-cell-copy .agov-agent-message{margin-top:5px;color:var(--wk-faint);font-size:10.5px}
body.shopify[data-view="work"] .wk .agov-table-role{color:var(--wk-muted);font-size:11.5px}
body.shopify[data-view="work"] .wk .agov-table-work{color:var(--wk-ink);font-size:11.5px;font-weight:600}
body.shopify[data-view="work"] .wk .agov-status{padding:7px 11px;border-color:var(--wk-line);font-size:10.5px}
body.shopify[data-view="work"] .wk .agov-table-empty{height:clamp(260px,44vh,480px);padding:48px!important;color:var(--wk-faint);font-size:12px;line-height:1.6;background:var(--wk-panel)}
body.shopify[data-view="work"] .wk .agov-table-empty::before{content:'No matching work';display:block;margin-bottom:6px;color:var(--wk-ink);font-size:15px;font-weight:680;letter-spacing:-.02em}
body.shopify[data-view="work"] .wk-modal,body.shopify[data-view="work"] .agx-channel-dialog{border-color:var(--wk-line);border-radius:20px;background:var(--wk-panel);box-shadow:var(--wk-pop-shadow)}
@media(max-width:1100px){
body.shopify[data-view="work"] .wk-view-tab{min-width:76px;padding-inline:12px}
body.shopify[data-view="work"] .wk>.agov-toolbar{flex-wrap:wrap}
body.shopify[data-view="work"] .wk .agov-search{min-width:280px}
}
@media(max-width:980px){
body.shopify[data-view="work"] .sf-page{padding:0 18px 18px}
body.shopify[data-view="work"] .wk{padding-top:16px}
body.shopify[data-view="work"] .wk-summary{min-height:176px;grid-template-columns:1fr 1fr}
body.shopify[data-view="work"] .wk-summary-cell{padding:18px 22px}
body.shopify[data-view="work"] .wk-summary-cell:nth-child(2){border-right:0}
body.shopify[data-view="work"] .wk-summary-cell:nth-child(-n+2){border-bottom:1px solid var(--wk-line-soft)}
}
@media(max-width:720px){
body.shopify[data-view="work"] .sf-page{padding:0 12px 12px}
body.shopify[data-view="work"] .wk{padding-top:12px}
body.shopify[data-view="work"] .wk-summary{min-height:0;height:auto;grid-template-columns:1fr 1fr;border-radius:14px}
body.shopify[data-view="work"] .wk-summary-cell{min-height:94px;padding:15px 16px}
body.shopify[data-view="work"] .wk-summary-cell:first-child{grid-column:1/-1;min-height:82px;border-right:0;border-bottom:1px solid var(--wk-line-soft)}
body.shopify[data-view="work"] .wk-summary-cell:nth-child(2){border-right:1px solid var(--wk-line-soft)}
body.shopify[data-view="work"] .wk-summary-cell:nth-child(3){border-right:0}
body.shopify[data-view="work"] .wk-summary-cell:nth-child(4){grid-column:1/-1;border-top:1px solid var(--wk-line-soft)}
body.shopify[data-view="work"] .wk-live{justify-content:center}
body.shopify[data-view="work"] .wk>.agov-toolbar{display:grid;grid-template-columns:minmax(0,1fr) 42px 42px;gap:8px;margin-top:12px}
body.shopify[data-view="work"] .wk-view-tabs{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;height:42px}
body.shopify[data-view="work"] .wk-view-tab{min-width:0;padding:0 10px}
body.shopify[data-view="work"] .wk>.agov-toolbar>.agov-filter:first-of-type{grid-column:1/-1}
body.shopify[data-view="work"] .wk>.agov-toolbar>.agov-filter:first-of-type .agov-filter-btn{width:100%}
body.shopify[data-view="work"] .wk .agov-search{grid-column:1;grid-row:auto;min-width:0;width:100%}
body.shopify[data-view="work"] .wk-combined-filter,body.shopify[data-view="work"] .wk-create-menu-wrap{justify-self:end}
body.shopify[data-view="work"] .wk>.agov-agent-index{margin-top:12px}
body.shopify[data-view="work"] .wk>.agov-agent-index .agov-agent-table-wrap{border-radius:14px}
body.shopify[data-view="work"] .wk .agov-agent-table{min-width:0;width:100%;display:block}
body.shopify[data-view="work"] .wk .agov-agent-table thead{display:none}
body.shopify[data-view="work"] .wk .agov-agent-table tbody{display:block}
body.shopify[data-view="work"] .wk .agov-agent-row{display:grid;grid-template-columns:1fr auto;gap:10px 14px;padding:16px}
body.shopify[data-view="work"] .wk .agov-agent-row td{display:flex;align-items:center;width:auto!important;min-width:0!important;height:auto;padding:0!important;border:0;background:transparent!important;white-space:normal}
body.shopify[data-view="work"] .wk .agov-agent-row td:first-child{position:static;grid-column:1/-1}
body.shopify[data-view="work"] .wk .agov-agent-row td:first-child::after{display:none}
body.shopify[data-view="work"] .wk .agov-agent-row td:nth-child(2),body.shopify[data-view="work"] .wk .agov-agent-row td:nth-child(6){display:none}
body.shopify[data-view="work"] .wk .agov-agent-row td:nth-child(3){grid-column:1}
body.shopify[data-view="work"] .wk .agov-agent-row td:nth-child(4){grid-column:1/-1;grid-row:3}
body.shopify[data-view="work"] .wk .agov-agent-row td:nth-child(5){grid-column:2;grid-row:2;justify-self:end}
body.shopify[data-view="work"] .wk .agov-table-work{max-width:none;white-space:normal;line-height:1.4}
body.shopify[data-view="work"] .wk .agov-progress{width:132px}
body.shopify[data-view="work"] .wk .agov-table-empty{display:table-cell;width:100%;height:300px;box-sizing:border-box}
}
@media(max-width:440px){
body.shopify[data-view="work"] .wk-summary-cell{padding-inline:14px}
body.shopify[data-view="work"] .wk-summary-value{font-size:20px}
body.shopify[data-view="work"] .wk-summary-note{font-size:9.5px}
body.shopify[data-view="work"] .wk .agov-agent-row{padding:14px}
body.shopify[data-view="work"] .wk .agov-agent-row td:nth-child(5){grid-column:1/-1;grid-row:4;justify-self:start}
}
@media(prefers-reduced-motion:reduce){
body.shopify[data-view="work"] .wk *,body.shopify[data-view="work"] .wk *::before,body.shopify[data-view="work"] .wk *::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}
@media(max-width:760px){.wk-modal-backdrop{left:0;padding:16px}.wk-modal{max-height:calc(100vh - 88px)}.wk-room-modal{height:calc(100vh - 88px)}.wk-room-body{grid-template-columns:1fr}.wk-room-side{display:none}}
@media(max-width:620px){.wk-tools{flex-wrap:wrap}.wk-search{order:-1;min-width:100%;max-width:none}.wk-action{margin-left:0}.wk-picker-grid,.wk-mode-actions{grid-template-columns:1fr}.wk-modal-backdrop{padding:12px}.wk-modal-head,.wk-modal-body,.wk-modal-foot{padding-left:18px;padding-right:18px}.wk-room-footer-copy{display:none}}
/* Live AI destination coin. The sidebar keeps its native row styling; only
the coin moves to the section inferred from the owner's prompt. */
.sf-folder-row[data-ai-host="true"]{z-index:11;isolation:isolate;box-sizing:border-box}
.sf-folder-row[data-ai-host="true"]>*{position:relative;z-index:3}
.sf-ai-nav-underlay{display:flex;align-items:center;gap:9px;min-width:0;flex:1;height:100%;filter:none}
/* Folder glyphs remain untouched vector art. Refraction belongs to the
material beneath them, never to the icon or text content itself. */
.sf-ai-nav-refract-source{flex:none;filter:none!important;transform:none!important}
body.ai-session-active .sf-folder-row[data-ai-host="true"] .lbl{
position:relative;z-index:4;filter:none!important;text-shadow:none}
/* The transparent anchor spans the row only for positioning. There is no
rail, glass, tint or selection override behind the destination. */
.sf-ai-nav-glider{position:absolute;z-index:10;left:0;right:0;top:0;height:44px;overflow:visible;pointer-events:none;visibility:hidden;opacity:0;
border:0;border-radius:0;background:transparent;box-shadow:none;
transform:translate3d(0,0,0);will-change:transform,opacity;
transition:transform 1380ms cubic-bezier(.22,.61,.36,1),opacity .34s ease,visibility 0s .34s}
body.ai-working .sf-ai-nav-glider,
body.ai-settling .sf-ai-nav-glider{visibility:visible;opacity:1;transition:transform 1380ms cubic-bezier(.22,.61,.36,1),opacity .34s ease,visibility 0s}
body.ai-session-active .sf-folder-row[data-ai-host="true"] .sf-folder-count{display:none}
.sf-ai-nav-bloom{display:block;width:28px;height:28px;position:absolute;z-index:3!important;right:9px;top:50%;margin-top:-14px;will-change:transform}
.sf-ai-nav-core{position:absolute;left:50%;top:50%;width:60px;height:60px;margin:-30px 0 0 -30px;
transform:scale(.46)}
.sf-ai-nav-core::before,.sf-ai-nav-core::after{content:"";position:absolute;inset:8px;border-radius:50%;
background:rgba(255,255,255,.05);opacity:.34;transform:scale(1.08)}
.sf-ai-nav-core::after{inset:14px;background:rgba(255,255,255,.1);opacity:.3;transform:scale(1.2)}
.sf-ai-nav-orbit{position:absolute;inset:0}
.sf-ai-nav-orbit i{
--angle:0deg;--orbit-radius:-18px;--dot-delay:0ms;
position:absolute;top:50%;left:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;
background:radial-gradient(circle at 32% 28%,#fff 0 28%,#e7e7e7 58%,#a9a9a9 100%);
box-shadow:0 0 4px rgba(255,255,255,.65);
opacity:0;transform:rotate(var(--angle)) translateY(var(--orbit-radius));transform-origin:center}
html[data-theme="light"] .sf-ai-nav-orbit i{
background:radial-gradient(circle at 32% 28%,#4a4a4a 0 18%,#171717 52%,#000 100%);
box-shadow:0 0 4px rgba(0,0,0,.28)}
/* Thinking restores the original coin-flip language: six evenly spaced
pearls orbit as each turns edge-on, then the group breathes away. */
body.ai-working .sf-ai-nav-orbit{animation:sf-ai-orbit 2.8s linear infinite}
body.ai-working .sf-ai-nav-orbit i{
opacity:1;animation:sf-ai-coin-flip 3.6s var(--dot-delay) ease-in-out infinite}
body.ai-settling .sf-ai-nav-orbit{
animation:none;transform:var(--ai-orbit-freeze,none)}
body.ai-settling .sf-ai-nav-orbit i{
animation:sf-ai-breathe-in 760ms cubic-bezier(.22,.82,.24,1) both}
body.ai-settling .sf-ai-nav-orbit i:first-child{
animation-name:sf-ai-breathe-core}
.sf-ai-nav-orbit i:nth-child(1){--angle:0deg;--dot-delay:0ms}
.sf-ai-nav-orbit i:nth-child(2){--angle:60deg;--dot-delay:170ms}
.sf-ai-nav-orbit i:nth-child(3){--angle:120deg;--dot-delay:340ms}
.sf-ai-nav-orbit i:nth-child(4){--angle:180deg;--dot-delay:510ms}
.sf-ai-nav-orbit i:nth-child(5){--angle:240deg;--dot-delay:680ms}
.sf-ai-nav-orbit i:nth-child(6){--angle:300deg;--dot-delay:850ms}
@keyframes sf-ai-orbit{to{transform:rotate(360deg)}}
@keyframes sf-ai-coin-flip{
0%,100%{transform:rotate(var(--angle)) translateY(var(--orbit-radius)) scaleX(1)}
25%{transform:rotate(var(--angle)) translateY(var(--orbit-radius)) scaleX(.15)}
50%{transform:rotate(var(--angle)) translateY(var(--orbit-radius)) scaleX(1)}
75%{transform:rotate(var(--angle)) translateY(var(--orbit-radius)) scaleX(.15)}}
@keyframes sf-ai-breathe-in{
0%{opacity:1;transform:var(--ai-dot-freeze,rotate(var(--angle)) translateY(var(--orbit-radius)) scale(1))}
56%{opacity:.92;transform:rotate(var(--angle)) translateY(-6px) scale(.82);box-shadow:0 0 7px rgba(255,255,255,.82)}
86%{opacity:.48;transform:rotate(var(--angle)) translateY(-1px) scale(.62)}
100%{opacity:0;transform:rotate(var(--angle)) translateY(0) scale(.46);box-shadow:0 0 3px rgba(255,255,255,.55)}}
@keyframes sf-ai-breathe-core{
0%{opacity:1;transform:var(--ai-dot-freeze,translateY(var(--orbit-radius)) scale(1))}
56%{opacity:1;transform:translateY(-6px) scale(.82);box-shadow:0 0 7px rgba(255,255,255,.86)}
86%{opacity:1;transform:translateY(-1px) scale(1.22);box-shadow:0 0 10px rgba(255,255,255,.82)}
100%{opacity:1;transform:none;box-shadow:0 0 4px rgba(255,255,255,.65)}}
@media(prefers-reduced-motion:reduce){
.sf-ai-nav-glider,.sf-ai-nav-bloom{transition:none!important}
body.ai-working .sf-ai-nav-orbit,body.ai-settling .sf-ai-nav-orbit{animation:none;transform:none}
body.ai-working .sf-ai-nav-orbit i,body.ai-settling .sf-ai-nav-orbit i{animation:none;opacity:0}
body.ai-working .sf-ai-nav-orbit i:first-child,body.ai-settling .sf-ai-nav-orbit i:first-child{opacity:1;transform:none}}
.sf-message-previews{display:none;margin:2px 0 8px;padding-left:18px}
.sf-message-previews.open{display:block;opacity:1}
.sf-message-inbox-head,.sf-message-search{display:none}
.sf-message-previews-clip{position:relative;min-height:0;overflow:hidden;border-left:1px solid rgba(0,0,0,.13);padding-left:7px}
.sf-message-previews-clip::before{display:none}
html[data-theme="dark"] .sf-message-previews-clip::before{background:#272728}
html[data-theme="dark"] .sf-message-previews-clip{border-left-color:#272728}
.sf-message-swipe{position:relative;height:58px;overflow:hidden}
.sf-message-thumb{position:absolute;left:0;top:8px;width:1px;height:30px;background:var(--sf-ink);pointer-events:none;will-change:transform;z-index:5}
.sf-message-thumb[hidden]{display:none}
.sf-message-swipe-actions{position:absolute;top:7px;right:3px;height:32px;display:none;visibility:hidden;align-items:center;gap:4px;z-index:1;pointer-events:none}
.sf-message-swipe.actions-open .sf-message-swipe-actions,.sf-message-swipe.swiping-left .sf-message-swipe-actions{display:flex;visibility:visible;pointer-events:auto}
.sf-message-swipe-unread{position:absolute;left:8px;top:50%;width:42px;height:42px;margin-top:-21px;border:0;border-radius:50%;display:none;visibility:hidden;align-items:center;justify-content:center;background:#0a84ff;color:#fff;z-index:1;pointer-events:none;cursor:pointer}
.sf-message-swipe.unread-open .sf-message-swipe-unread,.sf-message-swipe.swiping-right .sf-message-swipe-unread{display:flex;visibility:visible;pointer-events:auto}
.sf-message-swipe-unread svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.sf-message-swipe-action{width:32px;height:32px;border:0;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer}
.sf-message-swipe-action.mute{background:#696cf5}
.sf-message-swipe-action.delete{background:#ff453a}
.sf-message-swipe-action:hover{filter:brightness(1.08)}
.sf-message-swipe-action svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.sf-message-preview{position:relative;z-index:2;display:flex;align-items:center;gap:9px;width:100%;height:58px;padding:7px 8px 7px 9px;border:0;border-bottom:1px solid var(--sf-border);border-radius:0;background:transparent;box-shadow:none;color:var(--sf-sub);font:500 13px Inter;text-align:left;cursor:pointer;touch-action:pan-y;user-select:none;transition:transform .25s cubic-bezier(.22,1,.36,1),background .16s ease}
.sf-message-swipe.actions-open .sf-message-preview{transform:translateX(-74px)}
.sf-message-swipe.unread-open .sf-message-preview{transform:translateX(58px)}
.sf-message-preview:hover{background:var(--sf-hover);box-shadow:none;color:var(--sf-ink)}
.sf-message-preview.on{background:transparent;box-shadow:none;color:var(--sf-ink);font-weight:500}
.sf-message-preview-avatar{width:30px;height:30px;flex:none;border:1px solid var(--sf-avatar-accent,#3e7cfa);border-radius:50%;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--sf-avatar-accent,#3e7cfa) 15%,transparent);color:var(--sf-avatar-ink,#7fb5ff);font:720 9.5px Inter;letter-spacing:.025em;box-shadow:none}
.sf-message-preview-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}
.sf-message-preview-name{display:block;height:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-ink);font:650 11.5px/1.15 Inter}
.sf-message-preview-snippet{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-dim);font:500 10.5px/1.2 Inter}
.sf-message-preview-time{display:block;align-self:flex-start;flex:none;padding-top:2px;color:var(--sf-dim);font:550 9.5px/1 Inter}
.sf-message-unread-dot{display:block;position:absolute;left:1px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:#0a84ff}
/* Messages becomes a focused inbox: the regular navigation gives way to a
searchable profile list while the account switcher remains available. */
body.shopify[data-view="messages"] .sf-side .sf-scroll>:not(.sf-chat-nav-stack){display:none!important}
body.shopify[data-view="messages"] .sf-side .sf-chat-nav-stack>:not(.sf-chat-tools){display:none!important}
body.shopify[data-view="messages"] .sf-side .sf-chat-tools>.sf-chat-tool{display:none!important}
body.shopify[data-view="messages"] .sf-side .sf-chat-nav-stack,body.shopify[data-view="messages"] .sf-side .sf-chat-tools{display:flex;flex:1;min-height:0;flex-direction:column}
body.shopify[data-view="messages"] .sf-side{padding-left:6px;padding-right:6px}
body.shopify[data-view="messages"] .sf-message-previews{display:flex;flex:1;min-height:0;flex-direction:column;opacity:1;margin:0;padding:8px 5px 16px}
body.shopify[data-view="messages"] .sf-message-inbox-head{display:flex;align-items:center;justify-content:space-between;padding:5px 6px 12px;color:var(--sf-ink);font:720 18px/1 Inter}
.sf-message-inbox-head-main{display:flex;align-items:center;gap:4px;min-width:0}
.sf-message-inbox-title{color:var(--sf-ink);font:720 18px/1 Inter}
.sf-message-back{width:30px;height:30px;flex:none;border:0;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--sf-sub);cursor:pointer;transition:background .15s ease,color .15s ease,transform .15s ease}
.sf-message-back:hover{background:var(--sf-hover);color:var(--sf-ink);transform:translateX(-1px)}
.sf-message-back:focus-visible{outline:2px solid #0a84ff;outline-offset:2px}
.sf-message-back svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.sf-message-new{width:32px;height:32px;border:0;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--sf-sub);cursor:pointer;transition:background .15s ease,color .15s ease}
.sf-message-new:hover,.sf-message-new[aria-expanded="true"]{background:var(--sf-hover);color:var(--sf-ink)}
.sf-message-new:focus-visible{outline:2px solid #0a84ff;outline-offset:2px}
.sf-message-new svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.shopify[data-view="messages"] .sf-message-search{height:40px;margin:0 0 10px;border-radius:14px;display:flex;align-items:center;gap:8px;padding:0 12px;background:var(--sf-hover);color:var(--sf-dim)}
body.shopify[data-view="messages"] .sf-message-search svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
body.shopify[data-view="messages"] .sf-message-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--sf-ink);font:550 13px Inter}
body.shopify[data-view="messages"] .sf-message-previews-clip{flex:1;overflow-y:auto;overflow-x:hidden;padding:0 1px;border-left:0;scrollbar-width:none}
body.shopify[data-view="messages"] .sf-message-previews-clip::-webkit-scrollbar{display:none}
body.shopify[data-view="messages"] .sf-message-previews-clip::before,body.shopify[data-view="messages"] .sf-message-thumb{display:none!important}
body.shopify[data-view="messages"] .sf-message-swipe{height:72px;margin-bottom:3px;border-radius:14px}
body.shopify[data-view="messages"] .sf-message-swipe-actions{top:50%;right:7px;height:42px;margin-top:-21px;gap:6px}
body.shopify[data-view="messages"] .sf-message-swipe-action{width:42px;height:42px}
body.shopify[data-view="messages"] .sf-message-preview{height:72px;padding:9px 10px;gap:10px;border-radius:14px;background:var(--sf-bg);color:var(--sf-ink)}
body.shopify[data-view="messages"] .sf-message-preview:hover{background:var(--sf-hover)}
body.shopify[data-view="messages"] .sf-message-preview.on{background:#fff;color:#111;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08),0 8px 20px -14px rgba(0,0,0,.28)}
html[data-theme="dark"] body.shopify[data-view="messages"] .sf-message-preview.on{background:#1f1f23;color:var(--sf-ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 8px 20px -14px rgba(0,0,0,.62)}
body.shopify[data-view="messages"] .sf-message-swipe.actions-open .sf-message-preview{transform:translateX(-96px)}
body.shopify[data-view="messages"] .sf-message-preview-avatar{width:43px;height:43px;border:0;background:linear-gradient(145deg,var(--sf-avatar-accent,#3e7cfa),color-mix(in srgb,var(--sf-avatar-accent,#3e7cfa) 45%,#111));color:#fff;font-size:12px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
body.shopify[data-view="messages"] .sf-message-preview-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px}
body.shopify[data-view="messages"] .sf-message-preview-name{display:block;height:auto;color:inherit;font:700 13px/1.15 Inter}
body.shopify[data-view="messages"] .sf-message-preview-snippet{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-sub);font:520 11.5px/1.2 Inter}
body.shopify[data-view="messages"] .sf-message-preview.on .sf-message-preview-snippet{color:#666}
html[data-theme="dark"] body.shopify[data-view="messages"] .sf-message-preview.on .sf-message-preview-snippet{color:var(--sf-sub)}
body.shopify[data-view="messages"] .sf-message-preview-time{display:block;align-self:flex-start;flex:none;padding-top:2px;color:var(--sf-dim);font:570 10.5px/1 Inter}
body.shopify[data-view="messages"] .sf-message-preview.on .sf-message-preview-time{color:#777}
html[data-theme="dark"] body.shopify[data-view="messages"] .sf-message-preview.on .sf-message-preview-time{color:var(--sf-dim)}
body.shopify[data-view="messages"] .sf-message-unread-dot{display:block;position:absolute;left:2px;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:#0a84ff}
body.shopify[data-view="messages"] .sf-message-preview.on .sf-message-unread-dot{background:#111}
html[data-theme="dark"] body.shopify[data-view="messages"] .sf-message-preview.on .sf-message-unread-dot{background:#fff}
body.shopify[data-view="messages"] .sf-message-swipe.muted .sf-message-preview{opacity:.62}
body.sf-collapsed.shopify[data-view="messages"] .sf-message-previews{display:none!important}
.sf-message-compose-backdrop{position:fixed;inset:0;z-index:619;display:grid;place-items:center;padding:24px;background:rgba(0,0,0,.42);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:sfMessageBackdropIn .18s ease both}
html[data-theme="light"] .sf-message-compose-backdrop{background:rgba(21,23,28,.28)}
html[data-theme="dark"] .sf-message-compose-backdrop{background:rgba(0,0,0,.62)}
.sf-message-compose-popover{position:relative;z-index:620;width:min(590px,calc(100vw - 32px));max-height:min(620px,calc(100vh - 48px));display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--sf-border);border-radius:20px;background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 30px 100px rgba(0,0,0,.48);animation:sfMessageModalIn .22s cubic-bezier(.22,1,.36,1) both}
html[data-theme="light"] .sf-message-compose-popover{--sf-surface:#fff;--sf-ink:#303030;--sf-sub:#616161;--sf-dim:#8a8a8a;--sf-border:#dedee3;--sf-hover:#f7f7f7;color-scheme:light;background:#fff;border-color:#dedee3;box-shadow:0 30px 100px rgba(25,28,36,.22)}
html[data-theme="dark"] .sf-message-compose-popover{--sf-surface:#151518;--sf-ink:#f5f5f7;--sf-sub:#b4b4bd;--sf-dim:#8e8e98;--sf-border:rgba(255,255,255,.12);--sf-hover:#212126;color-scheme:dark;background:#151518;border-color:#303036;box-shadow:0 30px 110px rgba(0,0,0,.72)}
.sf-message-compose-head{height:64px;padding:0 16px 0 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--sf-border);font:720 19px Inter}
.sf-message-compose-close{width:34px;height:34px;border:0;border-radius:10px;background:transparent;color:var(--sf-sub);font:400 25px/1 Inter;cursor:pointer}
.sf-message-compose-close:hover{background:var(--sf-hover);color:var(--sf-ink)}
.sf-message-compose-search{height:52px;margin:20px 24px 12px;display:flex;align-items:center;gap:10px;padding:0 15px;border:1px solid transparent;border-radius:15px;background:var(--sf-hover);color:var(--sf-dim)}
.sf-message-compose-search:focus-within{border-color:#0a84ff;box-shadow:0 0 0 3px rgba(10,132,255,.12)}
.sf-message-compose-search svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}
.sf-message-compose-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--sf-ink);font:550 14px Inter}
.sf-message-compose-search input::placeholder{color:var(--sf-dim)}
.sf-message-compose-results{min-height:76px;overflow-y:auto;padding:0 16px 14px}
.sf-message-compose-result{width:100%;min-height:68px;padding:9px 10px;border:0;border-radius:14px;display:flex;align-items:center;gap:12px;background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}
.sf-message-compose-result:hover{background:var(--sf-hover)}
.sf-message-compose-avatar{width:42px;height:42px;flex:none;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:var(--sf-hover);color:var(--sf-sub);font:700 12px Inter}
.sf-message-compose-avatar img{width:100%;height:100%;object-fit:cover}
.sf-message-compose-copy{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}.sf-message-compose-copy b,.sf-message-compose-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sf-message-compose-copy b{font:680 13.5px Inter}.sf-message-compose-copy span{color:var(--sf-dim);font:500 11.5px Inter}
.sf-message-compose-add{height:30px;flex:none;padding:0 12px;border:1px solid var(--sf-border);border-radius:9px;display:inline-flex;align-items:center;background:var(--sf-surface);color:var(--sf-ink);font:650 11px Inter}
.sf-message-compose-result:hover .sf-message-compose-add{border-color:var(--sf-sub)}
.sf-message-compose-empty{padding:22px 10px 28px;text-align:center;color:var(--sf-dim);font:520 12.5px/1.5 Inter}
.sf-message-compose-request{height:58px;padding:0 24px;border:0;border-top:1px solid var(--sf-border);display:flex;align-items:center;justify-content:space-between;background:transparent;color:var(--sf-sub);font:630 13px Inter;cursor:pointer}.sf-message-compose-request:hover{background:var(--sf-hover);color:var(--sf-ink)}
.sf-message-compose-head-main{min-width:0;display:flex;align-items:center;gap:9px}.sf-message-compose-back{width:34px;height:34px;border:0;border-radius:10px;display:grid;place-items:center;background:transparent;color:var(--sf-sub);cursor:pointer}.sf-message-compose-back:hover{background:var(--sf-hover);color:var(--sf-ink)}.sf-message-compose-back svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9}
.sf-message-compose-label{padding:2px 26px 8px;color:var(--sf-sub);font:680 11px/1 Inter;text-transform:uppercase;letter-spacing:.08em}
.sf-message-compose-specials{padding:8px 16px 12px}.sf-message-compose-special{width:100%;height:58px;padding:0 10px;border:0;border-radius:14px;display:flex;align-items:center;gap:12px;background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}.sf-message-compose-special:hover{background:var(--sf-hover)}.sf-message-compose-special-icon{width:42px;height:42px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--sf-hover);color:var(--sf-sub)}.sf-message-compose-special-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}.sf-message-compose-special-copy{min-width:0;flex:1;display:flex;flex-direction:column;gap:3px}.sf-message-compose-special-copy b{font:680 13.5px Inter}.sf-message-compose-special-copy span{color:var(--sf-dim);font:500 11.5px Inter}.sf-message-compose-chevron{color:var(--sf-dim);font:500 22px/1 Inter}
.sf-message-compose-name{height:48px;margin:16px 24px 0;padding:0 14px;border:1px solid var(--sf-border);border-radius:13px;background:transparent;color:var(--sf-ink);outline:0;font:560 13.5px Inter}.sf-message-compose-name:focus{border-color:#0a84ff;box-shadow:0 0 0 3px rgba(10,132,255,.12)}
.sf-message-compose-selected{display:flex;gap:12px;overflow-x:auto;padding:4px 24px 13px;scrollbar-width:none}.sf-message-compose-selected:empty{display:none}.sf-message-compose-selected::-webkit-scrollbar{display:none}.sf-message-compose-chip{position:relative;width:58px;flex:none;border:0;background:transparent;color:var(--sf-ink);text-align:center;cursor:pointer}.sf-message-compose-chip .sf-message-compose-avatar{width:48px;height:48px;margin:auto}.sf-message-compose-chip b{display:block;overflow:hidden;margin-top:5px;text-overflow:ellipsis;white-space:nowrap;font:600 10px Inter}.sf-message-compose-chip-x{position:absolute;top:-2px;right:1px;width:18px;height:18px;border:2px solid var(--sf-surface);border-radius:50%;display:grid;place-items:center;background:var(--sf-ink);color:var(--sf-surface);font:700 12px/1 Inter}
.sf-message-compose-check{width:24px;height:24px;flex:none;border:1.5px solid var(--sf-dim);border-radius:50%;display:grid;place-items:center;color:transparent}.sf-message-compose-result.selected .sf-message-compose-check{border-color:#0a84ff;background:#0a84ff;color:#fff}.sf-message-compose-check svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4}
.sf-message-compose-footer{padding:14px 20px;border-top:1px solid var(--sf-border);display:flex;justify-content:flex-end}.sf-message-compose-primary{height:38px;padding:0 18px;border:0;border-radius:11px;background:var(--sf-ink);color:var(--sf-surface);font:680 12px Inter;cursor:pointer}.sf-message-compose-primary:disabled{opacity:.32;cursor:not-allowed}
.sf-message-group-details{min-height:480px;padding:30px 26px 24px;text-align:center}.sf-message-group-avatar-stack{height:78px;display:flex;justify-content:center;align-items:center}.sf-message-group-avatar-stack .sf-message-compose-avatar{width:66px;height:66px;margin-left:-18px;border:3px solid var(--sf-surface);font-size:16px}.sf-message-group-avatar-stack .sf-message-compose-avatar:first-child{margin-left:0}.sf-message-group-details h2{margin:15px 0 5px;font:740 22px/1.2 Inter}.sf-message-group-details>p{margin:0;color:var(--sf-dim);font:520 12.5px Inter}.sf-message-group-rename{width:min(360px,100%);height:42px;margin:14px auto 0;padding:0 13px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-hover);color:var(--sf-ink);outline:0;text-align:center;font:650 13px Inter}.sf-message-group-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:30px auto 0;max-width:480px}.sf-message-group-action{min-width:0;border:0;background:transparent;color:var(--sf-ink);cursor:pointer}.sf-message-group-action i{width:48px;height:48px;margin:0 auto 8px;border-radius:50%;display:grid;place-items:center;background:var(--sf-hover);font-style:normal}.sf-message-group-action svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8}.sf-message-group-action span{display:block;font:610 10.5px/1.25 Inter}.sf-message-group-member-list{margin:28px auto 0;padding-top:16px;border-top:1px solid var(--sf-border);max-width:480px;text-align:left}.sf-message-group-member-list>span{display:block;margin:0 0 9px;color:var(--sf-dim);font:660 10.5px Inter;text-transform:uppercase;letter-spacing:.08em}.sf-message-group-member{display:flex;align-items:center;gap:10px;padding:7px 4px}.sf-message-group-member .sf-message-compose-avatar{width:34px;height:34px}.sf-message-group-member b{font:630 12.5px Inter}
@keyframes sfMessageBackdropIn{from{opacity:0}to{opacity:1}}
@keyframes sfMessageModalIn{from{opacity:0;transform:translateY(12px) scale(.975)}to{opacity:1;transform:none}}
@media(max-width:640px){.sf-message-compose-backdrop{align-items:end;padding:0}.sf-message-compose-popover{width:100%;max-height:92vh;border-radius:20px 20px 0 0}.sf-message-compose-head{height:58px;padding-left:12px}.sf-message-compose-search{margin:14px 16px 10px}.sf-message-compose-name{margin:14px 16px 0}.sf-message-compose-selected{padding-left:16px;padding-right:16px}.sf-message-compose-results{padding-left:10px;padding-right:10px}.sf-message-compose-request{padding:0 18px}.sf-message-group-actions{gap:5px}.sf-message-group-details{padding-left:16px;padding-right:16px}}
@media(prefers-reduced-motion:reduce){.sf-message-compose-backdrop,.sf-message-compose-popover{animation:none}}
.sf-link{display:flex;align-items:center;gap:5px;font-size:13px;color:var(--sf-sub);padding:7px 9px;cursor:pointer;border-radius:8px}
.sf-link:hover{color:var(--sf-ink);background:rgba(127,127,127,.16)}
.sf-agentic-ic{width:20px;height:20px;border-radius:8px;background:#303030;display:flex;align-items:center;justify-content:center;flex:none}
.sf-nav-item .sf-agentic-ic svg{width:13px;height:13px;fill:#fff;color:#fff}
.sf-pos-ic{width:20px;height:20px;border-radius:7px;background:#303030;display:flex;align-items:center;justify-content:center;flex:none}
.sf-nav-item .sf-pos-ic svg{width:14px;height:14px;fill:none;color:#fff}
.sf-side .grow{flex:1;min-height:8px}
/* collapsed (skinny) sidebar — icons only; toggled via #sfToggle */
body.sf-collapsed .sf-side{width:64px;padding:8px 10px 16px}
body.sf-collapsed .sf-brand{width:64px}
body.sf-collapsed .sf-brand .sf-logo,body.sf-collapsed .sf-brand .badge{display:none}
body.sf-collapsed .sf-nav-item{justify-content:center;padding:0;gap:0}
/* labels glide + fade with the panel; collapse to zero width so icons stay centered */
.sf-nav-item .lbl{white-space:nowrap;max-width:170px;opacity:1;overflow:hidden;transition:max-width .46s cubic-bezier(.22,1,.36,1),opacity .24s ease .14s}
body.sf-collapsed .sf-nav-item .lbl{max-width:0;opacity:0;pointer-events:none;transition:max-width .46s cubic-bezier(.22,1,.36,1),opacity .14s ease}
body.sf-collapsed .sf-group,body.sf-collapsed .sf-link,body.sf-collapsed .sf-sub,body.sf-collapsed .sf-gtog{display:none}
body.sf-collapsed .sf-chgroup{display:flex}
body.sf-collapsed .sf-pin-tasks,body.sf-collapsed .sf-chat-tools{display:none}
/* content surface */
.sf-content{position:fixed;top:56px;left:260px;right:0;bottom:0;background:var(--sf-surface);
border-top-left-radius:20px;border-top-right-radius:20px;
overflow-y:auto;overscroll-behavior:none;scrollbar-width:none;-ms-overflow-style:none;transition:left .46s cubic-bezier(.22,1,.36,1),right .46s cubic-bezier(.22,1,.36,1)}
.sf-content::-webkit-scrollbar{width:0;height:0;display:none}
body.sf-collapsed .sf-content{left:64px}
.sf-page{max-width:2000px;margin:0 auto;padding:24px 22px 64px}
/* Client messages — deliberately reads like a calm native messenger while
retaining the dashboard's restrained borders and live theme variables. */
.sf-message-shell{min-height:calc(100vh - 216px);max-width:720px;margin:0 auto;padding-top:94px;display:flex;flex-direction:column}
.sf-message-identity{position:fixed;top:56px;left:260px;right:0;z-index:20;height:104px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:5px;background:transparent;transition:left .46s cubic-bezier(.22,1,.36,1)}
body.sf-collapsed .sf-message-identity{left:64px}
.sf-message-identity-avatar{position:relative;z-index:1;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#50525d,#25262c);color:#fff;font:720 16px Inter;letter-spacing:.025em;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.sf-message-identity-avatar.is-group{width:54px;height:54px;overflow:hidden;background:linear-gradient(145deg,#377dff,#173b78);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 7px 20px rgba(0,0,0,.28)}
.sf-message-group-avatar-image{width:100%;height:100%;display:block;object-fit:cover}
.sf-message-identity-name{min-width:0;max-width:min(90%,320px);height:36px;margin-top:-5px;padding:3px 14px 0 17px;border:0;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:7px;overflow:hidden;background:rgba(0,0,0,.68);-webkit-backdrop-filter:blur(16px) saturate(1.8);backdrop-filter:blur(16px) saturate(1.8);box-shadow:inset 0 0 5px 0 rgba(255,255,255,.35),inset 0 1px 1px 0 rgba(255,255,255,.22),0 0 0 1px rgba(255,255,255,.08),0 30px 76px -18px rgba(0,0,0,.88);color:var(--sf-ink);font:680 13.5px Inter;cursor:pointer}
.sf-message-identity-name span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-message-identity-name svg{width:11px;height:11px;flex:none;fill:none;stroke:var(--sf-dim);stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}
html[data-theme="light"] .sf-message-identity-name{background:rgba(255,255,255,.32);box-shadow:inset 0 1px 1px 0 rgba(255,255,255,.95),inset 0 0 8px 0 rgba(255,255,255,.6),0 0 0 1px rgba(0,0,0,.10),0 8px 24px -8px rgba(0,0,0,.18),0 28px 64px -18px rgba(0,0,0,.30)}
.sf-message-group-title-input{width:min(90vw,280px);height:36px;margin-top:-5px;padding:3px 14px 0;border:1px solid color-mix(in srgb,var(--sf-ink) 22%,transparent);border-radius:999px;outline:0;background:color-mix(in srgb,var(--sf-surface) 82%,transparent);color:var(--sf-ink);font:680 13.5px Inter;text-align:center;box-shadow:0 0 0 3px color-mix(in srgb,#377dff 22%,transparent)}
.sf-message-thread{flex:1;min-height:360px;overflow:visible;padding:26px 7px 120px;display:flex;flex-direction:column;gap:8px;background:transparent}
.sf-message-thread::-webkit-scrollbar{display:none}
.sf-message-day{align-self:center;margin:5px 0 13px;padding:4px 9px;border-radius:999px;background:var(--sf-hover);color:var(--sf-dim);font:620 9.5px/1 Inter;letter-spacing:.015em}
.sf-message-demo-note{align-self:center;max-width:460px;margin:-4px 0 14px;text-align:center;color:var(--sf-dim);font:520 10.5px/1.45 Inter}
.sf-message-avatar[data-tone="blue"],.sf-message-identity-avatar[data-tone="blue"],.sf-message-row-avatar[data-tone="blue"]{background:linear-gradient(145deg,#377dff,#173b78)}
.sf-message-avatar[data-tone="violet"],.sf-message-identity-avatar[data-tone="violet"],.sf-message-row-avatar[data-tone="violet"]{background:linear-gradient(145deg,#8075d6,#423d78)}
.sf-message-avatar[data-tone="rose"],.sf-message-identity-avatar[data-tone="rose"],.sf-message-row-avatar[data-tone="rose"]{background:linear-gradient(145deg,#c66f86,#673948)}
.sf-message-avatar[data-tone="amber"],.sf-message-identity-avatar[data-tone="amber"],.sf-message-row-avatar[data-tone="amber"]{background:linear-gradient(145deg,#bd8b44,#5d4526)}
.sf-message-avatar[data-tone="mint"],.sf-message-identity-avatar[data-tone="mint"],.sf-message-row-avatar[data-tone="mint"]{background:linear-gradient(145deg,#3aa889,#1b5849)}
.sf-message-avatar[data-tone="cyan"],.sf-message-identity-avatar[data-tone="cyan"],.sf-message-row-avatar[data-tone="cyan"]{background:linear-gradient(145deg,#399bb4,#1d5261)}
.sf-message-preview-avatar[data-tone="blue"]{--sf-avatar-accent:#3e7cfa;--sf-avatar-ink:#7fb5ff}
.sf-message-preview-avatar[data-tone="violet"]{--sf-avatar-accent:#786ee8;--sf-avatar-ink:#b8b1ff}
.sf-message-preview-avatar[data-tone="rose"]{--sf-avatar-accent:#bf5d79;--sf-avatar-ink:#f1a0b7}
.sf-message-preview-avatar[data-tone="amber"]{--sf-avatar-accent:#b67a2b;--sf-avatar-ink:#f0bc68}
.sf-message-preview-avatar[data-tone="mint"]{--sf-avatar-accent:#2e9c7c;--sf-avatar-ink:#72dab9}
.sf-message-preview-avatar[data-tone="cyan"]{--sf-avatar-accent:#3093b8;--sf-avatar-ink:#76d1ed}
.sf-message-row{display:flex;align-items:flex-end;gap:7px}
.sf-message-row.mine{justify-content:flex-end}
.sf-message-row-avatar{width:25px;height:25px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#41434c;color:#fff;font:700 8px Inter}
.sf-message-stack{max-width:min(72%,620px);display:flex;flex-direction:column}
.sf-message-row.mine .sf-message-stack{align-items:flex-end}
.sf-message-who{margin:0 9px 3px;color:var(--sf-dim);font:520 9.5px/1.2 Inter}
.sf-message-bubble{padding:9px 13px;border-radius:17px 17px 17px 5px;background:var(--sf-hover);color:var(--sf-ink);font:520 13.5px/1.42 Inter;white-space:pre-wrap;word-break:break-word;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sf-border) 72%,transparent)}
.sf-message-row.mine .sf-message-bubble{border-radius:17px 17px 5px 17px;background:#0a84ff;color:#fff;box-shadow:none}
.sf-message-status{margin:4px 7px 0;color:var(--sf-dim);font:500 9px/1 Inter}
.sf-message-compose-wrap{display:none}
.sf-message-compose{display:flex;align-items:flex-end;gap:8px;max-width:760px;margin:0 auto}
.sf-message-input-wrap{min-height:42px;flex:1;display:flex;align-items:flex-end;padding:0 7px 0 14px;border:1px solid var(--sf-border);border-radius:22px;background:var(--sf-hover);transition:border-color .18s ease,box-shadow .18s ease}
.sf-message-input-wrap:focus-within{border-color:color-mix(in srgb,#0a84ff 58%,var(--sf-border));box-shadow:0 0 0 3px rgba(10,132,255,.09)}
.sf-message-input{min-height:40px;max-height:128px;flex:1;resize:none;padding:10px 3px;border:0;outline:0;background:transparent;color:var(--sf-ink);font:520 13.5px/1.45 Inter}
.sf-message-input::placeholder{color:var(--sf-dim)}
.sf-message-attach{width:32px;height:32px;flex:none;margin-bottom:4px;border:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:transparent;color:var(--sf-sub);cursor:pointer}
.sf-message-attach:hover{background:color-mix(in srgb,var(--sf-border) 65%,transparent);color:var(--sf-ink)}
.sf-message-attach svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.sf-message-send{width:38px;height:38px;flex:none;margin-bottom:2px;border:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#0a84ff;color:#fff;cursor:pointer;box-shadow:0 7px 18px -10px rgba(10,132,255,.9);transition:transform .18s cubic-bezier(.22,1,.36,1),opacity .18s ease}
.sf-message-send:hover{transform:translateY(-1px) scale(1.03)}
.sf-message-send:disabled{opacity:.42;transform:none;cursor:default}
.sf-message-send svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transform:translateX(1px)}
/* Group details lives in the shared dashboard rail, not a modal. */
.sf-message-identity-avatar.is-group{border:0;padding:0;cursor:pointer;transition:transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s ease}
.sf-message-identity-avatar.is-group:hover{transform:translateY(-1px) scale(1.025);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 10px 25px rgba(0,0,0,.34)}
.sf-message-identity-avatar.is-group:focus-visible,.sf-message-identity-name:focus-visible{outline:2px solid #0a84ff;outline-offset:3px}
.sf-rail.rail-message-group{width:320px;z-index:24;overflow:hidden;background:var(--sf-bg)}
.sf-rail.rail-message-group .sf-cal-sidetabs,.sf-rail.rail-message-group #cal-agenda,.sf-rail.rail-message-group #cal-tasks,.sf-rail.rail-message-group #rail-notifs,.sf-rail.rail-message-group #rail-messages,.sf-rail.rail-message-group #cal-catpanel{display:none!important}
.sf-rail.rail-message-group .sf-rail-extra{height:100%;margin:0;display:block;overflow:hidden}
body.message-group-panel-open.shopify .sf-content{right:320px}
body.message-group-panel-open .sf-message-identity{right:320px}
body.message-group-panel-open .main>.composer{right:320px}
.sf-message-detail{height:100%;display:flex;flex-direction:column;color:var(--sf-ink);background:var(--sf-bg)}
.sf-message-detail-head{position:relative;flex:none;padding:16px 16px 13px;text-align:center;border-bottom:1px solid var(--sf-border-2)}
.sf-message-detail-close,.sf-message-detail-edit{position:absolute;top:12px;height:36px;border:1px solid var(--sf-border);border-radius:999px;background:var(--sf-surface);color:var(--sf-ink);cursor:pointer;font:650 12px Inter}
.sf-message-detail-close{left:12px;width:36px;display:grid;place-items:center;font-size:21px;font-weight:400}
.sf-message-detail-edit{right:12px;padding:0 13px}
.sf-message-detail-close:hover,.sf-message-detail-edit:hover{background:var(--sf-hover)}
.sf-message-detail-avatar{width:74px;height:74px;margin:5px auto 10px;border:0;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#377dff,#173b78);color:#fff;font:750 22px Inter;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2),0 12px 28px rgba(0,0,0,.22)}
.sf-message-detail-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.sf-message-detail-avatar:hover{filter:brightness(1.08)}
.sf-message-detail-name{margin:0 auto;max-width:245px;font:740 18px/1.25 Inter;letter-spacing:-.02em;overflow-wrap:anywhere}
.sf-message-detail-meta{margin:4px 0 0;color:var(--sf-dim);font:520 12px/1.4 Inter}
.sf-message-detail-name-input{width:100%;height:38px;margin:0;border:1px solid #0a84ff;border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);text-align:center;font:700 15px Inter;outline:0}
.sf-message-detail-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:15px}
.sf-message-detail-action{min-width:0;padding:0;border:0;background:transparent;color:var(--sf-sub);cursor:pointer;font:590 10.5px/1.25 Inter}
.sf-message-detail-action i{width:38px;height:38px;margin:0 auto 5px;border-radius:50%;display:grid;place-items:center;background:var(--sf-surface);border:1px solid var(--sf-border);color:var(--sf-ink);font-style:normal}
.sf-message-detail-action:hover i{background:var(--sf-hover)}
.sf-message-detail-action svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sf-message-detail-tabs{flex:none;display:flex;gap:2px;padding:8px 10px;border-bottom:1px solid var(--sf-border-2);overflow-x:auto;scrollbar-width:none}
.sf-message-detail-tabs::-webkit-scrollbar{display:none}
.sf-message-detail-tab{height:30px;padding:0 10px;border:0;border-radius:999px;background:transparent;color:var(--sf-dim);font:650 11px Inter;white-space:nowrap;cursor:pointer}
.sf-message-detail-tab:hover{color:var(--sf-ink);background:var(--sf-hover)}
.sf-message-detail-tab.on{color:var(--sf-ink);background:var(--sf-sel)}
.sf-message-detail-body{flex:1;min-height:0;overflow:auto;padding:12px;overscroll-behavior:contain}
.sf-message-detail-card{border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-surface);overflow:hidden;margin-bottom:10px}
.sf-message-detail-row{min-height:46px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--sf-border-2);font:610 12.5px Inter}
.sf-message-detail-row:last-child{border-bottom:0}
.sf-message-detail-row-copy{min-width:0;display:flex;flex-direction:column;gap:2px;text-align:left}
.sf-message-detail-row-copy span{color:var(--sf-dim);font:500 10.5px/1.35 Inter}
.sf-message-detail-switch{width:42px;height:24px;flex:none;padding:2px;border:0;border-radius:999px;background:var(--sf-border);cursor:pointer;transition:background .18s ease}
.sf-message-detail-switch:before{content:"";display:block;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.24);transition:transform .18s cubic-bezier(.22,1,.36,1)}
.sf-message-detail-switch.on{background:#30b060}.sf-message-detail-switch.on:before{transform:translateX(18px)}
.sf-message-detail-section-head{display:flex;align-items:center;justify-content:space-between;margin:3px 2px 8px;color:var(--sf-dim);font:690 10.5px Inter;text-transform:uppercase;letter-spacing:.06em}
.sf-message-detail-textbtn{border:0;background:transparent;color:#0a84ff;font:650 11px Inter;cursor:pointer}
.sf-message-member{display:flex;align-items:center;gap:9px;width:100%;min-height:52px;padding:8px 10px;border:0;border-bottom:1px solid var(--sf-border-2);background:transparent;color:var(--sf-ink);text-align:left}
.sf-message-member:last-child{border-bottom:0}.sf-message-member-avatar{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:var(--sf-sel);color:var(--sf-ink);font:700 11px Inter}.sf-message-member-avatar img{width:100%;height:100%;object-fit:cover}
.sf-message-member-copy{min-width:0;display:flex;flex-direction:column;gap:2px}.sf-message-member-copy b,.sf-message-member-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sf-message-member-copy b{font:650 12.5px Inter}.sf-message-member-copy span{color:var(--sf-dim);font:500 10.5px Inter}
.sf-message-detail-empty{min-height:210px;padding:35px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--sf-dim)}
.sf-message-detail-empty i{width:45px;height:45px;margin-bottom:12px;border:1px solid var(--sf-border);border-radius:14px;display:grid;place-items:center;background:var(--sf-surface);font-style:normal;font-size:19px}.sf-message-detail-empty b{color:var(--sf-ink);font:680 13px Inter}.sf-message-detail-empty span{max-width:220px;margin-top:5px;font:500 11px/1.45 Inter}
.sf-message-detail-link{display:block;padding:11px 12px;border-bottom:1px solid var(--sf-border-2);color:#0a84ff;font:550 11.5px/1.4 Inter;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sf-message-detail-link:last-child{border-bottom:0}
.sf-message-detail-danger{width:100%;height:42px;margin-top:8px;border:1px solid color-mix(in srgb,#ff453a 45%,var(--sf-border));border-radius:12px;background:transparent;color:#ff453a;font:650 12px Inter;cursor:pointer}.sf-message-detail-danger:hover{background:color-mix(in srgb,#ff453a 10%,transparent)}
.sf-message-detail-backdrop{display:none;position:fixed;inset:56px 0 0;z-index:23;border:0;background:rgba(0,0,0,.44);backdrop-filter:blur(2px)}
@media(max-width:1100px){
.sf-rail.rail-message-group{display:block;width:min(360px,92vw);z-index:24;box-shadow:-18px 0 48px rgba(0,0,0,.32)}
body.message-group-panel-open.shopify .sf-content{right:0}
body.message-group-panel-open .sf-message-identity,body.message-group-panel-open .main>.composer{right:0}
body.message-group-panel-open .sf-message-detail-backdrop{display:block}
}
@media(max-width:720px){
.sf-rail.rail-message-group{left:0;width:100%;border-left:0;box-shadow:none}
.sf-message-detail-head{padding-top:14px}.sf-message-detail-body{padding-bottom:max(18px,env(safe-area-inset-bottom))}
body.message-group-panel-open .sf-message-detail-backdrop{display:none}
}
@media(max-width:720px){
.sf-message-shell{min-height:calc(100vh - 198px);padding-top:84px}
.sf-message-identity{left:0;height:94px}.sf-message-identity-avatar{width:48px;height:48px}
.sf-message-thread{min-height:330px;padding:19px 2px 110px}.sf-message-stack{max-width:83%}
}
/* Point of Sale — a deliberately small, counter-friendly surface. The
catalog stays dominant; the cart remains visible without opening a modal. */
.pos-shell{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.7fr);gap:18px;align-items:start;max-width:1180px}
.pos-catalog,.pos-cart{border:1px solid var(--sf-border);border-radius:16px;background:var(--sf-surface);overflow:hidden}
.pos-cart{position:sticky;top:0}
.pos-toolbar{display:flex;align-items:center;gap:10px;padding:14px;border-bottom:1px solid var(--sf-border)}
.pos-search{display:flex;align-items:center;gap:9px;flex:1;min-width:0;height:42px;padding:0 13px;border:1px solid var(--sf-border);border-radius:11px;background:var(--sf-hover);color:var(--sf-sub)}
.pos-search:focus-within{border-color:var(--sf-ink)}
.pos-search svg{width:17px;height:17px;flex:none}
.pos-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--sf-ink);font:500 14px Inter}
.pos-search input::placeholder{color:var(--sf-dim)}
.pos-chips{display:flex;gap:7px;padding:12px 14px 0;overflow-x:auto;scrollbar-width:none}
.pos-chips::-webkit-scrollbar{display:none}
.pos-chip{height:32px;padding:0 13px;border:1px solid var(--sf-border);border-radius:999px;background:transparent;color:var(--sf-sub);font:600 12px Inter;white-space:nowrap;cursor:pointer}
.pos-chip:hover{background:var(--sf-hover);color:var(--sf-ink)}
.pos-chip.on{background:var(--sf-ink);border-color:var(--sf-ink);color:var(--sf-surface)}
.pos-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:14px}
.pos-product{position:relative;min-height:132px;padding:15px;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-surface);color:var(--sf-ink);text-align:left;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;transition:background .12s,border-color .12s,transform .12s}
.pos-product:hover{background:var(--sf-hover);border-color:var(--sf-border-2);transform:translateY(-1px)}
.pos-product:active{transform:translateY(0)}
.pos-product .pos-pic{width:36px;height:36px;border-radius:10px;background:var(--sf-hover);display:flex;align-items:center;justify-content:center;margin-bottom:18px;font:700 12px Inter;color:var(--sf-sub)}
.pos-product .pos-name{font:650 13px/1.35 Inter}
.pos-product .pos-price{margin-top:auto;padding-top:7px;font:600 12.5px Inter;color:var(--sf-sub)}
.pos-no-products{grid-column:1/-1;padding:54px 24px;text-align:center;color:var(--sf-sub);font-size:13px}
.pos-cart-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 16px 13px;border-bottom:1px solid var(--sf-border)}
.pos-cart-head h2{margin:0;font:700 15px Inter}
.pos-cart-head span{color:var(--sf-sub);font:600 12px Inter}
.pos-customer{display:flex;align-items:center;gap:10px;width:calc(100% - 28px);height:42px;margin:14px;padding:0 12px;border:1px dashed var(--sf-border);border-radius:11px;background:transparent;color:var(--sf-sub);font:600 12.5px Inter;cursor:pointer;text-align:left}
.pos-customer:hover{background:var(--sf-hover);color:var(--sf-ink)}
.pos-customer svg{width:17px;height:17px}
.pos-lines{padding:0 14px;min-height:164px;max-height:38vh;overflow:auto}
.pos-empty{min-height:164px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:var(--sf-dim);text-align:center}
.pos-empty svg{width:26px;height:26px;margin-bottom:3px}
.pos-empty b{color:var(--sf-sub);font:650 13.5px Inter}
.pos-empty span{font-size:12px}
.pos-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:12px 0;border-bottom:1px solid var(--sf-border-2)}
.pos-line:last-child{border-bottom:0}
.pos-line-name{font:600 13px/1.35 Inter;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pos-line-price{margin-top:3px;color:var(--sf-sub);font:500 12px Inter}
.pos-line-side{text-align:right}
.pos-line-total{font:650 13px Inter;font-variant-numeric:tabular-nums}
.pos-qty{display:flex;align-items:center;justify-content:flex-end;gap:4px;margin-top:8px}
.pos-qty button{width:25px;height:25px;border:1px solid var(--sf-border);border-radius:7px;background:transparent;color:var(--sf-ink);cursor:pointer;font:600 14px Inter}
.pos-qty button:hover{background:var(--sf-hover)}
.pos-qty span{min-width:20px;text-align:center;color:var(--sf-sub);font:600 12px Inter}
.pos-summary{padding:14px 16px 16px;border-top:1px solid var(--sf-border)}
.pos-sumrow{display:flex;align-items:center;justify-content:space-between;color:var(--sf-sub);font:500 12.5px Inter;margin-bottom:7px}
.pos-sumrow strong{color:var(--sf-ink);font-weight:650;font-variant-numeric:tabular-nums}
.pos-sumrow.total{margin:12px 0 14px;padding-top:12px;border-top:1px solid var(--sf-border);font-size:14px;color:var(--sf-ink)}
.pos-sumrow.total strong{font-size:18px}
.pos-charge{width:100%;height:46px;border:0;border-radius:12px;background:var(--sf-ink);color:var(--sf-surface);font:700 14px Inter;cursor:pointer}
.pos-charge:hover{opacity:.9}
.pos-charge:disabled{opacity:.35;cursor:not-allowed}
.pos-hint{margin-top:9px;color:var(--sf-dim);font-size:11px;text-align:center}
@media(max-width:980px){.pos-shell{grid-template-columns:1fr}.pos-cart{position:relative}.pos-products{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.pos-products{grid-template-columns:repeat(2,minmax(0,1fr))}.pos-toolbar{padding:12px}.pos-product{min-height:118px}.pos-shell{gap:12px}}
.sf-page.cal-flush{max-width:none;padding:0!important}
.sf-page.cal-page .sf-cal-head{padding:0 28px;min-height:76px}
.sf-page.cal-page:not(.cal-flush){padding:0;max-width:none}
/* Shared sidebar: same .sf-side renders in the Chat (home) view as on dashboard pages.
The old .rail is kept in the DOM only as the icon source for iconFor(), but hidden. */
.rail{display:none!important}
.sf-side{background:var(--sf-bg);z-index:7}
body:not(.shopify) .main{margin-left:260px;padding-top:56px;transition:margin-left .46s cubic-bezier(.22,1,.36,1),padding-right .46s cubic-bezier(.22,1,.36,1)}
body:not(.shopify) .topr{display:none} /* the shared top bar replaces the old Private chip */
body.sf-collapsed:not(.shopify) .main{margin-left:64px}
@media(max-width:720px){body:not(.shopify) .main{margin-left:0}}
/* Dashboard (shopify) views: float the SAME composer pill above the #sf
overlay (z6) so the chat box lives on every page, not just home. Pinned to
the bottom of the content column (right of the 200px sidebar); identical
720px pill. Container is click-through so the page stays usable — only the
pill takes pointer events. */
body.shopify .composer{position:fixed;left:260px;right:0;bottom:0;z-index:7;
padding:14px 22px 20px;pointer-events:none;animation:none;
transition:left .46s cubic-bezier(.22,1,.36,1),right .46s cubic-bezier(.22,1,.36,1),transform .28s cubic-bezier(.22,1,.36,1)}
/* The Orders assistant never moves vertically. At the list end, the actual
glass pill and its supporting scrim cross-fade in place as separate layers;
this prevents the wrapper/scrim composite from reading as a gray slide. */
body.shopify[data-view="orders"] .composer{transform:none!important}
body.shopify[data-view="orders"] .composer .pill{opacity:1;will-change:opacity;transition:opacity .38s cubic-bezier(.4,0,.2,1)}
body.shopify[data-view="orders"] .composer::before{display:none!important;content:none!important;background:none!important}
body.shopify[data-view="orders"].orders-at-bottom .composer .pill{opacity:1;pointer-events:auto}
body.orders-ai-conversation .composer .pill{opacity:1}
body.orders-ai-conversation .composer .pill{pointer-events:auto}
body.orders-ai-typing .composer,body.orders-ai-conversation .composer{z-index:120}
/* The persistent context rail owns the right 200px on dashboard views, so
the docked pill centers over the content column instead of the full pane. */
@media(min-width:1101px){body.shopify.has-rail .composer{right:260px}}
/* The customer-detail view has its OWN 200px rail (.sf-cust-side) but not the
global .has-rail class, so offset the composer to center over the content column. */
@media(min-width:1081px){body.shopify[data-view="customer-detail"] .composer{right:260px}}
@media(min-width:821px) and (max-width:1080px){body.shopify[data-view="customer-detail"] .composer{right:300px}}
body.shopify.sf-collapsed .composer{left:64px}
body.shopify .composer .pill{pointer-events:auto}
body.shopify .composer .pill{max-width:640px;padding:6px;gap:6px}
body.shopify .composer .pill .ic{width:34px;height:34px}
body.shopify .composer .pill .send{width:36px;height:36px}
body.shopify .composer .pill textarea{height:22px;font-size:15px}
body.shopify .composer .pill .ph-chime{left:50px;font-size:15px}
body.shopify .composer .pill .fast{font-size:13px}
/* Footer actions must clear the persistent composer at standard laptop
heights. Without this reserve, the visible buttons sit underneath the
pill and cannot receive pointer input. */
body.shopify .sf-actions-bar,body.shopify .usr-flow-actions{margin-bottom:96px}
/* Keep the persistent dashboard composer at its full size in every
interaction state. Hovering, focusing, and pressing must not resize it. */
body.shopify .composer,
body.shopify .composer:has(.pill:hover),
body.shopify .composer:focus-within,
body.shopify .composer:active{transform:scale(1);transform-origin:50% 100%}
@media(max-width:720px){body.shopify .composer{left:0!important}}
@media(max-width:480px){
body.shopify .composer .ph-chime{display:none!important}
body.shopify .composer #inp::placeholder{color:rgba(255,255,255,.55)!important;-webkit-text-fill-color:rgba(255,255,255,.55)!important;opacity:1!important}
html[data-theme="light"] body.shopify .composer #inp::placeholder{color:rgba(0,0,0,.42)!important;-webkit-text-fill-color:rgba(0,0,0,.42)!important;opacity:1!important}
body.shopify .composer .fast{font-size:0;gap:0;padding:0 2px}
}
@media(max-width:480px){
body.shopify.orders-ai-conversation .composer,
body.shopify.orders-ai-typing .composer{left:64px!important;right:0!important;padding:10px 10px 12px}
body.shopify.orders-ai-conversation .composer .pill,
body.shopify.orders-ai-typing .composer .pill{max-width:none;gap:4px;padding:7px}
body.shopify.orders-ai-conversation .composer .fast,
body.shopify.orders-ai-typing .composer .fast{font-size:0;gap:0;padding:0 2px}
body.shopify.orders-ai-conversation .composer .ph-chime,
body.shopify.orders-ai-typing .composer .ph-chime,
body.shopify.orders-ai-conversation .composer .caret,
body.shopify.orders-ai-typing .composer .caret{display:none!important}
body.shopify.orders-ai-conversation .composer #inp::placeholder,
body.shopify.orders-ai-typing .composer #inp::placeholder{color:rgba(255,255,255,.55)!important;-webkit-text-fill-color:rgba(255,255,255,.55)!important;opacity:1!important}
html[data-theme="light"] body.shopify.orders-ai-conversation .composer #inp::placeholder,
html[data-theme="light"] body.shopify.orders-ai-typing .composer #inp::placeholder{color:rgba(0,0,0,.42)!important;-webkit-text-fill-color:rgba(0,0,0,.42)!important;opacity:1!important}
body.shopify.orders-ai-conversation .composer #inp,
body.shopify.orders-ai-typing .composer #inp{caret-color:#3590F5}
}
/* once the user has navigated, never replay the load-time "rise" intro —
the pill is one persistent element gliding between views, not a new widget */
body.navved .composer{animation:none}
/* hide the empty-state autocomplete suggestions while docked on dashboard pages */
body.shopify .composer .acsug{display:none}
body.shopify .sf-page{padding-bottom:96px}
/* Orders owns its vertical scroll inside the table card. Remove the generic
composer clearance from this view so the surrounding content surface never
exposes a second scroll range or a blank white tail below the table. */
body.shopify[data-view="orders"] .sf-content{overflow-y:hidden;isolation:isolate}
body.shopify[data-view="orders"] .sf-page{padding-bottom:10px}
/* One shared, theme-aware typing shield for every dashboard page. It sits
above page widgets, below the composer, and stays clipped inside content. */
body.shopify.orders-ai-typing .sf-content{isolation:isolate}
.ord-ai-typing-shield{position:absolute;inset:0;border-radius:20px 20px 0 0;z-index:90;pointer-events:none;visibility:hidden;opacity:0;
background:linear-gradient(to bottom,var(--ai-typing-clear) 0%,var(--ai-typing-clear) 4.06746835%,var(--ai-typing-solid) 52.1379206%,var(--ai-typing-solid) 100%);
clip-path:inset(0 0 100% 0 round 20px 20px 0 0);transform:translateY(-10px) scaleY(.985);transform-origin:50% 0;
transition:clip-path .34s cubic-bezier(.22,1,.36,1),opacity .28s cubic-bezier(.22,1,.36,1),transform .34s cubic-bezier(.22,1,.36,1),visibility 0s .34s;
will-change:clip-path,opacity,transform}
body.orders-ai-typing .ord-ai-typing-shield{visibility:visible;opacity:1;clip-path:inset(0 0 0 0 round 20px 20px 0 0);transform:translateY(0) scaleY(1);
transition:clip-path .82s cubic-bezier(.62,0,1,.55),opacity .48s cubic-bezier(.62,0,1,.55),transform .82s cubic-bezier(.62,0,1,.55),visibility 0s}
body.shopify[data-view="messages"] .ord-ai-typing-shield{display:none!important;visibility:hidden!important;opacity:0!important;background:none!important}
body.shopify[data-view="images"] .ord-ai-typing-shield{display:none!important;visibility:hidden!important;opacity:0!important;background:none!important}
@media(prefers-reduced-motion:reduce){.ord-ai-typing-shield,body.orders-ai-typing .ord-ai-typing-shield{transition:none;transform:none}}
/* Sending replaces the shield with one fully opaque conversation canvas. */
.ord-ai-surface{position:absolute;inset:0;border-radius:20px 20px 0 0;z-index:91;display:flex;flex-direction:column;overflow:hidden;visibility:hidden;pointer-events:none;opacity:0;
background:#fff;
color:#18181a;transition:opacity .32s cubic-bezier(.4,0,.2,1),visibility 0s .32s}
body.orders-ai-conversation .ord-ai-surface{visibility:visible;pointer-events:auto;opacity:1;transition:opacity .32s cubic-bezier(.4,0,.2,1)}
.ord-ai-top{height:54px;flex:none;display:flex;align-items:center;gap:9px;padding:0 24px;border-bottom:1px solid rgba(0,0,0,.055);background:rgba(255,255,255,.78)}
.ord-ai-mark{width:8px;height:8px;border-radius:50%;background:#3E7CFA;box-shadow:0 0 0 4px rgba(62,124,250,.11)}
.ord-ai-title{font:650 13px Inter;color:#222}
.ord-ai-sub{font:500 12px Inter;color:#8a8a90}
.ord-ai-close{margin-left:auto;width:30px;height:30px;border:0;border-radius:999px;background:transparent;color:#777;display:flex;align-items:center;justify-content:center;cursor:pointer}
.ord-ai-close:hover{background:#f1f1f3;color:#111}
.ord-ai-close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.ord-ai-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;padding:34px max(28px,calc((100% - 760px)/2)) 142px}
.ord-ai-scroll::-webkit-scrollbar{display:none}
.ord-ai-chat{display:flex;flex-direction:column;gap:18px;min-height:0}
/* Conversation instruction rail — compact directives live between the
conversation header and messages, sharing the same 760px reading column.
Cards expand in place; no modal or detached settings surface. */
.ci-region{--ci-line:#e5e5e5;--ci-ink:#2f2f2f;--ci-muted:#6f6f6f;--ci-soft:#f7f7f7;flex:none;padding:9px max(24px,calc((100% - 720px)/2)) 10px;border-bottom:1px solid #ececec;background:#fff;position:relative;z-index:2}
.ci-toolbar{height:24px;display:flex;align-items:center;gap:7px;margin:0 1px 6px}
.ci-title{font:600 11px/1 Inter;letter-spacing:0;color:#676767}
.ci-count{font:500 10px/1 Inter;color:#aaa}
.ci-add{margin-left:auto;height:25px;padding:0 9px;border:0;border-radius:8px;background:transparent;color:#707070;font:550 10.5px/1 Inter;display:flex;align-items:center;gap:5px;cursor:pointer;transition:background .15s ease,color .15s ease}
.ci-add:hover{background:#f3f3f3;color:#2f2f2f}
.ci-add svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round}
.ci-stack{display:flex;flex-direction:column;gap:5px}
.ci-card{position:relative;border:1px solid var(--ci-line);border-radius:14px;background:var(--ci-soft);color:var(--ci-ink);box-shadow:none;overflow:hidden;transform:translateZ(0);transition:border-color .15s ease,opacity .15s ease,background .15s ease}
.ci-card:hover{border-color:#dcdcdc;background:#f3f3f3}
.ci-card[data-enabled="false"]{opacity:.52;background:#fafafa}
.ci-card[data-dragging="true"]{opacity:.32}
.ci-card[data-drop="true"]{border-color:#a6a6a6;box-shadow:inset 0 0 0 1px #a6a6a6}
.ci-summary{min-height:44px;padding:0 7px 0 5px;display:flex;align-items:center;gap:6px}
.ci-grip{width:22px;height:28px;flex:none;border:0;border-radius:7px;background:transparent;color:#aaa;opacity:.3;display:flex;align-items:center;justify-content:center;cursor:grab;transition:color .15s ease,background .15s ease,opacity .15s ease}
.ci-grip:active{cursor:grabbing}
.ci-card:hover .ci-grip,.ci-grip:focus-visible{opacity:1}
.ci-grip:hover{color:#555;background:#e9e9e9}
.ci-grip svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.65;stroke-linecap:round}
.ci-preview-wrap{min-width:0;flex:1;align-self:stretch;border:0;background:transparent;padding:0;display:flex;align-items:center;gap:7px;text-align:left;cursor:pointer;color:inherit}
.ci-arrow{font:500 13px/1 Georgia,serif;color:#aaa;transform:translateY(-1px)}
.ci-preview{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 12px/1.35 Inter;color:#353535;letter-spacing:0}
.ci-card[data-enabled="false"] .ci-preview{text-decoration:line-through;text-decoration-color:#c9c9cc}
.ci-badge{height:20px;padding:0 7px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;flex:none;border:1px solid rgba(0,0,0,.05);font:600 9px/1 Inter;letter-spacing:0;color:#666;background:#ececec}
.ci-badge[data-category="behavior"]{color:#716454;background:#f5f1eb}
.ci-badge[data-category="context"]{color:#566b63;background:#edf3f0}
.ci-badge[data-category="memory"]{color:#6f6355;background:#f3eee7}
.ci-badge[data-category="workflow"]{color:#665f75;background:#f1eff5}
.ci-badge[data-category="developer"]{color:#535f6c;background:#edf1f4}
.ci-badge[data-category="system"]{color:#f7f7f8;background:#55565a;border-color:#55565a}
.ci-quick{display:flex;align-items:center;gap:1px;max-width:0;opacity:0;overflow:hidden;transition:max-width .18s cubic-bezier(.22,1,.36,1),opacity .14s ease}
.ci-card:hover .ci-quick,.ci-card:focus-within .ci-quick{max-width:112px;opacity:1}
.ci-icon{width:25px;height:25px;flex:none;border:0;border-radius:7px;background:transparent;color:#8f8f8f;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .15s ease,background .15s ease}
.ci-icon:hover{color:#222;background:#e7e7e7}
.ci-icon.danger:hover{color:#b74b45;background:#f8eeee}
.ci-icon.on{color:#455f80;background:#edf2f8}
.ci-icon svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.ci-more{position:relative}
.ci-menu{position:absolute;top:37px;right:8px;width:172px;padding:6px;border:1px solid #e0e0e3;border-radius:14px;background:rgba(255,255,255,.97);box-shadow:0 18px 44px -24px rgba(0,0,0,.48);z-index:12;opacity:0;visibility:hidden;transform:translateY(-5px) scale(.98);transform-origin:100% 0;transition:opacity .16s ease,visibility 0s .16s,transform .2s cubic-bezier(.22,1,.36,1)}
.ci-card.menu-open{overflow:visible;z-index:13}
.ci-card.menu-open .ci-menu{opacity:1;visibility:visible;transform:none;transition:opacity .16s ease,transform .2s cubic-bezier(.22,1,.36,1)}
.ci-menu button{width:100%;height:31px;border:0;border-radius:9px;background:transparent;color:#444449;padding:0 9px;display:flex;align-items:center;gap:8px;text-align:left;font:570 10.5px Inter;cursor:pointer}
.ci-menu button:hover{background:#f3f3f4;color:#18181a}
.ci-menu button.danger{color:#a94843}
.ci-menu button svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ci-editor-grid{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .25s cubic-bezier(.22,1,.36,1),opacity .2s ease}
.ci-card.expanded{border-color:#d8d8d8;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.035)}
.ci-card.expanded .ci-editor-grid{grid-template-rows:1fr;opacity:1}
.ci-editor-clip{min-height:0;overflow:hidden}
.ci-editor{padding:2px 16px 16px;border-top:1px solid rgba(0,0,0,.055)}
.ci-editor textarea{display:block;width:100%;min-height:112px;max-height:220px;resize:vertical;margin:13px 0 10px;padding:12px 13px;border:1px solid #dedee1;border-radius:14px;background:#fbfbfc;color:#222225;outline:none;font:520 12.5px/1.55 Inter;box-shadow:inset 0 1px 1px rgba(0,0,0,.02);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.ci-editor textarea:focus{border-color:#b7bec8;background:#fff;box-shadow:0 0 0 3px rgba(83,102,128,.08)}
.ci-fields{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ci-select{height:32px;padding:0 28px 0 10px;border:1px solid #e1e1e3;border-radius:10px;background:#fff;color:#55555a;font:600 10.5px Inter;outline:none}
.ci-check{height:32px;padding:0 10px;border:1px solid #e1e1e3;border-radius:10px;background:#fff;color:#5d5d62;display:flex;align-items:center;gap:7px;font:600 10.5px Inter;cursor:pointer}
.ci-check span{width:20px;height:12px;border-radius:99px;background:#c9c9cd;position:relative;transition:background .18s ease}
.ci-check span::after{content:"";position:absolute;width:8px;height:8px;top:2px;left:2px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .2s cubic-bezier(.22,1,.36,1)}
.ci-check.on span{background:#697b91}
.ci-check.on span::after{transform:translateX(8px)}
.ci-editor-actions{margin-left:auto;display:flex;gap:7px}
.ci-btn{height:32px;padding:0 12px;border:1px solid #dedee1;border-radius:10px;background:#fff;color:#57575d;font:630 10.5px Inter;cursor:pointer;transition:background .16s ease,border-color .16s ease,transform .16s ease}
.ci-btn:hover{background:#f5f5f6;border-color:#d2d2d5;transform:translateY(-1px)}
.ci-btn.primary{background:#26272a;border-color:#26272a;color:#fff}
.ci-history{display:none;margin-top:10px;padding:10px 11px;border-radius:12px;background:#f6f6f7}
.ci-card.show-history .ci-history{display:block;animation:ciHistoryIn .2s ease}
@keyframes ciHistoryIn{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
.ci-history-title{margin-bottom:6px;font:680 9.5px Inter;color:#77777c;text-transform:uppercase;letter-spacing:.05em}
.ci-history-row{display:flex;gap:8px;padding:5px 0;border-top:1px solid #e7e7e9;font:520 10px/1.35 Inter;color:#747479}
.ci-history-row:first-of-type{border-top:0}
.ci-history-row time{flex:none;color:#a0a0a5}
.ci-empty{padding:13px 14px;border:1px dashed #dedee1;border-radius:18px;color:#8b8b91;text-align:center;font:550 10.5px Inter}
.turn.me.has-ci-attached{flex-direction:column;align-items:flex-end;gap:6px}
.ci-attached{max-width:min(560px,88%);padding:8px 10px;border:1px solid #e4e4e6;border-radius:14px;background:#fafafa;color:#66666c;display:flex;align-items:center;gap:8px;box-shadow:0 7px 18px -17px rgba(0,0,0,.5);animation:queueRise .24s cubic-bezier(.22,1,.36,1)}
.ci-attached::before{content:"↳";font:500 13px Georgia,serif;color:#a0a0a6}
.ci-attached-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:560 10.5px/1.3 Inter}
.ci-attached .ci-badge{height:20px;font-size:8.5px}
@media(prefers-reduced-motion:reduce){.ci-card,.ci-add,.ci-quick,.ci-menu,.ci-editor-grid{transition:none!important}}
@media(max-width:760px){
.ci-region{padding:8px 10px 9px}.ci-toolbar{margin-bottom:5px}.ci-summary{min-height:44px;padding-left:5px;padding-right:7px;gap:5px}.ci-card{border-radius:13px}
.ci-arrow{display:none}.ci-preview{font-size:11.5px}.ci-quick{display:none}.ci-badge{height:20px;padding:0 7px;font-size:9px}
.ci-icon{width:25px}.ci-editor{padding-left:12px;padding-right:12px}.ci-editor textarea{min-height:96px}
.ci-fields{align-items:stretch}.ci-editor-actions{width:100%;justify-content:flex-end}.ci-select,.ci-check{flex:1}
}
.ord-ai-chat .turn.me .bub{background:#f1f1f3;color:#18181a}
.ord-ai-chat .turn.bot .bub,.ord-ai-chat .turn-meta,.ord-ai-chat .think-now,.ord-ai-chat .think-meta{color:#242426}
.ord-ai-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ord-ai-metric{min-width:0;padding:11px 12px;border-radius:12px;background:#f6f6f7}
.ord-ai-metric small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:550 10.5px Inter;color:#8a8a90}
.ord-ai-metric strong{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 15px Inter;color:#202024}
.ord-ai-widget{margin:0 0 2px;padding:12px 13px;border:1px solid #e5e5e8;border-radius:15px;background:#fff;box-shadow:0 14px 34px -30px rgba(0,0,0,.5);animation:ordAiWidgetIn .32s cubic-bezier(.22,1,.36,1)}
@keyframes ordAiWidgetIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.ord-ai-widget-kicker{display:flex;align-items:center;gap:7px;margin-bottom:8px;font:650 10.5px Inter;letter-spacing:.055em;text-transform:uppercase;color:#73737a}
.ord-ai-widget-kicker::before{content:"";width:6px;height:6px;border-radius:50%;background:#3E7CFA}
.ord-ai-orderrow{display:grid;grid-template-columns:74px minmax(0,1.2fr) minmax(0,1fr) auto;align-items:center;gap:11px;padding:9px 0;border-top:1px solid #eeeeef;color:#242426}
.ord-ai-orderrow:first-of-type{border-top:0}
.ord-ai-orderrow b{font:700 12.5px Inter}
.ord-ai-orderrow span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:550 12px Inter}
.ord-ai-orderrow em{font:600 11.5px Inter;color:#777;font-style:normal}
.ord-ai-orderrow button{height:28px;padding:0 10px;border:1px solid #dedee2;border-radius:999px;background:#fff;color:#202024;font:600 11px Inter;cursor:pointer}
.ord-ai-orderrow button:hover{background:#f3f3f4}
@media(max-width:760px){.ord-ai-scroll{padding-left:18px;padding-right:18px}.ord-ai-orderrow{grid-template-columns:62px minmax(0,1fr) auto}.ord-ai-orderrow em{display:none}}
/* Orders AI follows the live theme. Night mode uses soft near-black layers
rather than a pure-white canvas, reducing glare without losing hierarchy. */
html[data-theme="dark"] .ord-ai-surface{background:#0b0b0c;color:#d9d9df}
html[data-theme="dark"] .ord-ai-top{border-bottom-color:rgba(255,255,255,.08);background:rgba(15,15,17,.88);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
html[data-theme="dark"] .ord-ai-title{color:#f0f0f3}
html[data-theme="dark"] .ord-ai-sub{color:#85858e}
html[data-theme="dark"] .ord-ai-close{color:#8f8f98}
html[data-theme="dark"] .ord-ai-close:hover{background:#202024;color:#f4f4f6}
html[data-theme="dark"] .ord-ai-chat .turn.me .bub{background:#1b1b1f;color:#f0f0f3}
html[data-theme="dark"] .ord-ai-chat .turn.bot .bub,
html[data-theme="dark"] .ord-ai-chat .turn-meta,
html[data-theme="dark"] .ord-ai-chat .think-now,
html[data-theme="dark"] .ord-ai-chat .think-meta{color:#d0d0d6}
html[data-theme="dark"] .ord-ai-metric{background:#151518}
html[data-theme="dark"] .ord-ai-metric small{color:#85858e}
html[data-theme="dark"] .ord-ai-metric strong{color:#ececf0}
html[data-theme="dark"] .ord-ai-widget{border-color:rgba(255,255,255,.09);background:#121214;box-shadow:0 18px 42px -32px rgba(0,0,0,.9)}
html[data-theme="dark"] .ord-ai-widget-kicker{color:#8e8e97}
html[data-theme="dark"] .ord-ai-orderrow{border-top-color:rgba(255,255,255,.08);color:#d8d8de}
html[data-theme="dark"] .ord-ai-orderrow em{color:#8d8d96}
html[data-theme="dark"] .ord-ai-orderrow button{border-color:rgba(255,255,255,.12);background:#1a1a1e;color:#e7e7eb}
html[data-theme="dark"] .ord-ai-orderrow button:hover{background:#242429}
html[data-theme="dark"] .ci-region{--ci-line:rgba(255,255,255,.10);--ci-ink:#e7e7eb;--ci-muted:#96969f;--ci-soft:#151518;border-bottom-color:rgba(255,255,255,.08);background:#0b0b0c}
html[data-theme="dark"] .ci-title{color:#a0a0a8}
html[data-theme="dark"] .ci-count{color:#74747d}
html[data-theme="dark"] .ci-add{color:#9999a2}
html[data-theme="dark"] .ci-add:hover{background:#1c1c20;color:#eeeeF1}
html[data-theme="dark"] .ci-card:hover{border-color:rgba(255,255,255,.16);background:#1a1a1e}
html[data-theme="dark"] .ci-preview{color:#dedee3}
/* Docked pill = liquid glass, the same surface as the site editor's AI bar:
dark tint + inset rim here, the displacement-refraction backdrop-filter is
injected by applyPillGlass() (the SVG feImage map is size-locked, so it
can't live in static CSS). */
body.shopify .composer .pill{background:rgba(0,0,0,.68);
box-shadow:inset 0 0 5px 0 rgba(255,255,255,.35),inset 0 1px 1px 0 rgba(255,255,255,.22),
0 0 0 1px rgba(255,255,255,.08),0 30px 76px -18px rgba(0,0,0,.88)}
body.shopify .composer .pill:has(.send.voice-session){background:rgba(0,0,0,.68)!important}
/* Daytime: the glass pill is a WHITE translucent surface (not the night-time
dark tint), so it reads as frosted glass over the light dashboard. */
html[data-theme="light"] body.shopify .composer .pill{background:rgba(255,255,255,.32);
box-shadow:inset 0 0 0 1px rgba(0,0,0,.10)}
html[data-theme="light"] body.shopify .composer .pill:has(.send.voice-session){background:rgba(255,255,255,.32)!important}
/* New-chat (home) composer: same liquid glass as the docked bar, but with
almost no fill so it floats on the page — no solid background behind it. */
body:not(.shopify) .composer .pill{background:rgba(0,0,0,.28);
box-shadow:inset 0 0 5px 0 rgba(255,255,255,.32),inset 0 1px 1px 0 rgba(255,255,255,.2),
0 0 0 1px rgba(255,255,255,.08),0 30px 76px -18px rgba(0,0,0,.7)}
body:not(.shopify) .composer .pill:has(.send.voice-session){background:rgba(0,0,0,.28)!important}
html[data-theme="light"] body:not(.shopify) .composer .pill{background:rgba(255,255,255,.32);
box-shadow:inset 0 0 0 1px rgba(0,0,0,.09)}
html[data-theme="light"] body:not(.shopify) .composer .pill:has(.send.voice-session){background:rgba(255,255,255,.32)!important}
/* Docked (shopify) composer is FIXED over scrolling content — a gradient scrim
behind it fades that content into the page bg instead of showing behind. */
body.shopify .composer::before{content:"";position:absolute;left:0;right:0;bottom:0;
height:150px;pointer-events:none;z-index:0;
background:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.35) 100%)}
html[data-theme="light"] body.shopify .composer::before{
background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.35) 100%)}
body.shopify[data-view="messages"] .composer::before{display:none!important;content:none!important;background:none!important}
body.shopify .composer .pill{z-index:1}
/* Home chat: let the composer OVERLAP the thread (like ChatGPT) so the last
message stays fully visible right above the bar, and content fades only as
it scrolls BEHIND the bar. The thread fills the pane; its bottom padding
clears the bar; the mask fades the behind-bar zone (and the top edge). */
body.started:not(.shopify) .composer{position:absolute;left:0;right:0;bottom:0;z-index:5}
/* The campaign composer is viewport-centered, not main-column-centered.
Equal safe gutters account for both side sections without letting a lone
collapsed sidebar push the pill to the right. */
body.email-campaign-mode.started:not(.shopify):not(.email-canvas-mode) .composer{
--email-composer-gutters:520px;position:fixed;left:50%;right:auto;width:calc(100vw - var(--email-composer-gutters));
max-width:none;transform:translateX(-50%)!important;transition:width .46s cubic-bezier(.22,1,.36,1)}
@media(max-width:960px){
body.sf-collapsed.email-campaign-mode.started:not(.shopify):not(.email-canvas-mode) .composer{--email-composer-gutters:128px}}
@media(max-width:720px){
body.email-campaign-mode.started:not(.shopify):not(.email-canvas-mode) .composer{--email-composer-gutters:0px}}
body.started:not(.shopify) #thread{padding-bottom:120px;
-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 34px,#000 calc(100% - 120px),transparent 100%);
mask-image:linear-gradient(to bottom,transparent 0,#000 34px,#000 calc(100% - 120px),transparent 100%)}
/* The assistant stays visible and interactive at every scroll position. */
body.shopify.chat-away .composer{opacity:1;
transition:left .46s cubic-bezier(.22,1,.36,1),opacity .1s ease}
body.shopify.chat-away .composer .pill{pointer-events:auto}
body.shopify[data-view="messages"].chat-away .composer{opacity:1!important;bottom:0!important}
body.shopify[data-view="messages"].chat-away .composer .pill{pointer-events:auto!important}
/* The site editor ships its own AI bar — the dashboard assistant does not
follow into the site-editor sections. */
body.shopify[data-view="website"] .composer,
body.shopify[data-view="site-hub"] .composer{display:none}
body.shopify[data-view="messages"] .main>.composer{display:flex!important}
body.shopify[data-view="messages"] .sf-page{padding-top:10px;padding-bottom:128px}
body.shopify[data-view="messages"].messages-inbox-only .main>.composer{display:none!important}
.sf-message-inbox-empty{min-height:calc(100vh - 118px);display:grid;place-items:center;padding:32px;text-align:center}
.sf-message-inbox-empty-card{display:flex;max-width:390px;flex-direction:column;align-items:center;color:var(--sf-ink)}
.sf-message-inbox-empty-icon{width:48px;height:48px;margin-bottom:18px;border:1px solid var(--sf-border);border-radius:15px;display:grid;place-items:center;background:var(--sf-hover);color:var(--sf-sub)}
.sf-message-inbox-empty-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.sf-message-inbox-empty-card h1{margin:0 0 7px;font:720 20px/1.2 Inter;letter-spacing:-.02em}
.sf-message-inbox-empty-card p{margin:0;color:var(--sf-dim);font:520 13px/1.55 Inter}
/* full-bleed analytics canvas — seamless, fills the content area (no floating frame) */
.sf-analytics-full{position:fixed;top:56px;left:260px;right:0;bottom:0;
background:#0b0b0f;overflow:hidden;border-top-left-radius:0;transition:left .46s cubic-bezier(.22,1,.36,1)}
body.sf-collapsed .sf-analytics-full{left:64px}
/* full-bleed SEO map (Apple-Maps style) — map fills the content area, panels float on top */
.seo-map-full{position:fixed !important;top:56px;left:260px;right:0;bottom:0;background:var(--sf-bg);overflow:hidden;transition:left .46s cubic-bezier(.22,1,.36,1),right .46s cubic-bezier(.22,1,.36,1)}
body.sf-collapsed .seo-map-full{left:64px}
/* ── Persistent context rail (#sf-rail) ─────────────────────────────────
The Agenda/Tasks rail is global chrome (sibling of .sf-content, same tier
as the left nav + composer): it follows every dashboard view and slides in
from the right; content, full-bleed canvases and the composer yield 200px.
Per-section contents are driven by RAIL_CTX/railUpdate() in the script. */
.sf-rail{position:fixed;top:56px;right:0;bottom:0;width:260px;z-index:6;
background:var(--sf-bg);border-left:1px solid var(--sf-border-2);
transform:translateX(102%);visibility:hidden;
transition:transform .46s cubic-bezier(.22,1,.36,1),visibility 0s .46s}
body.has-rail .sf-rail{transform:translateX(0);visibility:visible;
transition:transform .46s cubic-bezier(.22,1,.36,1)}
body.shopify.has-rail .sf-content{right:260px}
body.shopify.has-rail .sf-analytics-full,body.shopify.has-rail .seo-map-full{right:260px}
/* Home (chat) view isn't .shopify — its content is the .main column, a
flex:1 item whose grown width ignores margin-right, so it yields via
padding-right (border-box keeps the rail from overlapping). */
body.has-rail:not(.shopify) .main{padding-right:260px}
.sf-rail-extra{margin-bottom:16px}
.sf-rail-extra:empty{display:none}
/* Order-detail rail mode: the client info replaces the agenda/tasks panels. */
.sf-rail.rail-order .sf-cal-sidetabs,.sf-rail.rail-order #cal-agenda,.sf-rail.rail-order #cal-tasks,.sf-rail.rail-order #rail-notifs,.sf-rail.rail-order #rail-messages,.sf-rail.rail-order #cal-catpanel{display:none!important}
.sf-rail.rail-order .sf-rail-extra{margin-top:2px;display:flex;flex-direction:column;gap:16px}
/* Notifications + Messages rows (home rail) */
.sf-rail-notif-list,.sf-rail-msg-list{display:flex;flex-direction:column;gap:2px}
.sf-rail-notif,.sf-rail-msg{display:flex;gap:10px;width:100%;text-align:left;padding:9px 8px;border:0;border-radius:10px;background:transparent;cursor:pointer;align-items:flex-start}
.sf-rail-notif:hover,.sf-rail-msg:hover{background:var(--sf-hover)}
.sf-rail-notif-dot{flex:none;width:8px;height:8px;margin-top:5px;border-radius:50%;background:var(--sf-dim)}
.sf-rail-notif-dot.order{background:#34AADC}.sf-rail-notif-dot.lead{background:#30B060}.sf-rail-notif-dot.billing{background:#E0533D}.sf-rail-notif-dot.system{background:#F0A020}
.sf-rail-notif-main,.sf-rail-msg-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sf-rail-notif-t{font:600 13px Inter;color:var(--sf-ink);line-height:1.35}
.sf-rail-notif-meta{font-size:11px;color:var(--sf-dim)}
.sf-rail-notif-ago,.sf-rail-msg-ago{flex:none;font-size:11px;color:var(--sf-dim)}
.sf-rail-notif.unread .sf-rail-notif-t,.sf-rail-msg.unread .sf-rail-msg-from{font-weight:700}
.sf-rail-notif.unread::after{content:"";position:absolute}
.sf-rail-msg-ava{flex:none;width:30px;height:30px;font-size:11px}
.sf-rail-msg-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.sf-rail-msg-from{font:600 13px Inter;color:var(--sf-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-rail-msg-text{font-size:12px;color:var(--sf-sub);line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Notification cards — timeline style: time · category pill / bold headline / muted detail */
.sf-notif-card{display:block;width:100%;text-align:left;border:1px solid var(--sf-border);border-radius:15px;background:var(--sf-surface);padding:12px 14px;cursor:grab;user-select:none;-webkit-user-select:none;box-shadow:0 1px 2px rgba(0,0,0,.025);transition:transform .18s cubic-bezier(.22,1,.36,1),background .18s ease,border-color .18s ease,box-shadow .18s ease,opacity .18s ease}
.sf-notif-card:hover{background:var(--sf-hover);border-color:color-mix(in srgb,var(--sf-border) 55%,var(--sf-dim));box-shadow:0 10px 24px rgba(0,0,0,.07);transform:translateY(-2px)}
.sf-notif-card:active{cursor:grabbing}
.sf-notif-list{display:flex;flex-direction:column;gap:8px}
.sf-notif-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}
.sf-notif-time{font:500 11.5px Inter;color:var(--sf-dim);letter-spacing:.2px}
.sf-notif-pill{font:700 11px Inter;padding:4px 10px;border-radius:999px;white-space:nowrap}
.sf-notif-pill.order{background:rgba(52,199,89,.18);color:#7be0a1}
.sf-notif-pill.payment{background:rgba(255,204,0,.16);color:#f0d066}
.sf-notif-pill.lead{background:rgba(122,123,255,.2);color:#a8a9ff}
.sf-notif-pill.task{background:rgba(52,170,220,.18);color:#7fc9ea}
.sf-notif-pill.message{background:rgba(94,210,222,.16);color:#8adde8}
.sf-notif-pill.review{background:rgba(240,160,32,.18);color:#f2bc6d}
.sf-notif-pill.milestone,.sf-notif-pill.insight{background:rgba(255,105,180,.16);color:#f5a0c8}
.sf-notif-pill.system{background:rgba(140,140,150,.18);color:var(--sf-sub)}
.sf-notif-t{display:block;font:700 13.5px Inter;color:var(--sf-ink);line-height:1.35}
.sf-notif-t .at{color:#a8a9ff}
.sf-notif-b{display:block;font:400 12.5px Inter;color:var(--sf-sub);line-height:1.45;margin-top:3px}
.sf-notif-card.unread{border-color:rgba(122,123,255,.45)}
.sf-notif-hint{padding:12px 3px 2px;color:var(--sf-dim);font:500 11px/1.5 Inter}
html[data-theme="light"] .sf-notif-pill.order{background:#d8f5cf;color:#2f7a33}
html[data-theme="light"] .sf-notif-pill.lead{background:#e4e4ff;color:#4b4cd6}
html[data-theme="light"] .sf-notif-pill.payment{background:#faf0c8;color:#8a6d1a}
html[data-theme="light"] .sf-notif-pill.task{background:#d8edfa;color:#1f6e9c}
html[data-theme="light"] .sf-notif-pill.message{background:#d5f2f5;color:#177782}
html[data-theme="light"] .sf-notif-pill.review{background:#fae5cc;color:#95610f}
html[data-theme="light"] .sf-notif-pill.milestone,html[data-theme="light"] .sf-notif-pill.insight{background:#fbdcec;color:#b03d78}
html[data-theme="light"] .sf-notif-pill.system{background:#e8e8ec;color:#5c5c66}
html[data-theme="light"] .sf-notif-t .at{color:#4b4cd6}
.sf-rail-card{border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);padding:12px}
.sf-rail-card-t{font:700 13px Inter;color:var(--sf-ink);margin-bottom:8px}
.sf-rail-card-sub{font-size:12px;line-height:1.45;color:var(--sf-sub)}
.sf-rail-kv{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:3px 0;font-size:12.5px;color:var(--sf-sub)}
.sf-rail-kv b{color:var(--sf-ink);font-weight:650}
.sf-rail-cta{width:100%;margin-top:10px;height:30px;font-size:12px}
@media(max-width:1100px){.sf-rail{display:none}
body.shopify.has-rail .sf-content,body.shopify.has-rail .sf-analytics-full,body.shopify.has-rail .seo-map-full{right:0}
body.has-rail:not(.shopify) .main{padding-right:0}}
.seo-map-panel{position:fixed;top:74px;left:256px;width:334px;max-height:calc(100vh - 102px);overflow:auto;z-index:6;
background:rgba(255,255,255,.55);backdrop-filter:saturate(180%) blur(30px);-webkit-backdrop-filter:saturate(180%) blur(30px);
border:0.5px solid rgba(255,255,255,.55);border-radius:20px;
box-shadow:0 16px 48px rgba(0,0,0,.18),0 2px 8px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.6);
transition:left .46s cubic-bezier(.22,1,.36,1);animation:seoPanelIn .5s cubic-bezier(.22,1,.36,1) both}
@keyframes seoPanelIn{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
body.sf-collapsed .seo-map-panel{left:84px}
html[data-theme="dark"] .seo-map-panel{background:rgba(22,22,26,.55);border-color:rgba(255,255,255,.12);
box-shadow:0 16px 48px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.08)}
.seo-stat{transition:transform .16s cubic-bezier(.22,1,.36,1),background .2s ease,box-shadow .2s ease}
.seo-stat:hover{transform:translateY(-2px);background:var(--sf-surface)!important;box-shadow:0 4px 14px rgba(0,0,0,.1)}
.seo-rankrow{transition:background .15s ease;border-radius:10px;padding-left:8px;padding-right:8px;margin-left:-8px;margin-right:-8px;cursor:default}
.seo-rankrow:hover{background:rgba(127,127,127,.1)}
.seo-mapctl button{transition:transform .12s ease,background .18s ease}
.seo-mapctl button:hover{transform:scale(1.05)}
.seo-mapctl button:active{transform:scale(.94)}
/* New leads detail */
.sf-leadbtns{display:flex;flex-direction:column;gap:9px}
.sf-leadbtns .sf-btn{width:100%;justify-content:center}
.sf-btn.danger{color:#c8372d;border-color:#e7c4bf}
.sf-btn.danger:hover{background:#fcefed;border-color:#dd9a92}
.sf-msg{margin:0;line-height:1.6;font-size:13.5px}
.sf-accessok{display:flex;align-items:center;gap:8px;font-weight:600;color:#1aa05a;font-size:13px;margin-bottom:10px}
.sf-accessok .dot{width:8px;height:8px;border-radius:50%;background:#1aa05a;display:inline-block}
.sf-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:22px}
.sf-head .ht{flex:1;min-width:0}
.sf-head h1{font-size:20px;font-weight:700;letter-spacing:-.01em;margin:0 0 3px}
.sf-head p{font-size:13.5px;color:var(--sf-sub);margin:0}
.sf-actions{display:flex;gap:8px;flex:none}
/* buttons */
.sf-btn{border:1px solid var(--sf-border);background:var(--sf-surface);color:var(--sf-ink);
font:600 13px 'Inter';padding:7px 13px;border-radius:8px;cursor:pointer;box-shadow:0 1px 1px rgba(0,0,0,.04);
transition:background .1s;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.sf-btn:hover{background:var(--sf-hover)}
.sf-btn.primary{background:var(--sf-fill);color:#fff;border-color:var(--sf-fill);box-shadow:0 1px 2px rgba(0,0,0,.2)}
.sf-btn.primary:hover{background:#1a1a1a}
/* metric row */
.sf-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--sf-border);
border-radius:var(--sf-radius);overflow:hidden;margin-bottom:20px;background:var(--sf-surface)}
.sf-metric{padding:14px 16px;border-right:1px solid var(--sf-border-2)}
.sf-metric:last-child{border-right:none}
/* The white content sheet is .sf-content itself; .sf-sheet just flattens the
metrics + tabs + table into clean sections that sit directly on the sheet. */
.sf-sheet{background:transparent;border:none;border-radius:0}
.sf-sheet .sf-metrics{margin:0 0 18px}
/* Shopify-style metric card: bold label, dotted rule, big number + delta, sparkline */
.sf-sheet .sf-metric{padding:9px 34px}
/* Email performance pages reuse the Orders analytics ribbon exactly; only
the Mailchimp-style lifecycle metrics change between sections. */
.sf-email-index .sf-metrics-scroll .sf-metric{flex:1 0 190px;min-width:190px}
.sf-email-index .sf-card{margin-top:0}
.sf-orders-index .cust-cell{display:inline-flex;align-items:center;gap:11px}
.sf-orders-index .cust-av{width:21px;height:21px;border-radius:50%;flex:none;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:9px;font-weight:700;letter-spacing:.02em}
.sf-orders-index .cust-nm{font-weight:550}
.sf-orders-index .od-service{font-weight:550;color:var(--sf-ink)}
.sf-orders-index .od-paywrap{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.sf-orders-index .od-sub{font-size:10.5px;font-weight:600;color:#007AFF;background:rgba(0,122,255,.12);border-radius:999px;padding:1px 8px;letter-spacing:.01em}
html[data-theme="dark"] .sf-orders-index .od-sub{color:#4DA3FF}
.sf-orders-index .od-prog{display:inline-block;width:94px;height:5px;border-radius:3px;background:#ededed;overflow:hidden;vertical-align:middle}
.sf-orders-index .od-prog-fill{display:block;height:100%;border-radius:3px;background:#4BD968}
html[data-theme="dark"] .sf-orders-index .od-prog-fill{background:#ffffff}
/* Fulfillment is a client-first queue that deliberately shares Orders' dense
index shell. The row content changes from commerce fields to delivery stages,
while the selected client still opens the full task board. */
.sf-fulfillment-index .ff-client{display:inline-flex;align-items:center;gap:11px;min-width:176px}
.sf-fulfillment-index .ff-client-copy{display:flex;flex-direction:column;min-width:0}
.sf-fulfillment-index .ff-client-name{font-weight:620;color:var(--sf-ink);line-height:1.25}
.sf-fulfillment-index .ff-client-order{font-size:10.5px;font-weight:550;color:var(--sf-dim);line-height:1.35;margin-top:1px}
.sf-fulfillment-index .ff-stage{display:inline-flex;align-items:center;gap:7px;min-height:24px;padding:0 9px;border-radius:999px;
color:var(--sf-sub);background:rgba(120,120,128,.10);box-shadow:inset 0 0 0 1px rgba(142,142,147,.28);font-size:11.5px;font-weight:650}
.sf-fulfillment-index .ff-stage::before{content:"";width:6px;height:6px;border-radius:50%;background:#8E8E93}
.sf-fulfillment-index .ff-stage.attention{color:#A85A00;background:rgba(255,149,0,.12);box-shadow:inset 0 0 0 1px rgba(255,149,0,.38)}
.sf-fulfillment-index .ff-stage.attention::before{background:#FF9500}
.sf-fulfillment-index .ff-stage.active{color:#0062CC;background:rgba(0,122,255,.10);box-shadow:inset 0 0 0 1px rgba(0,122,255,.35)}
.sf-fulfillment-index .ff-stage.active::before{background:#007AFF}
.sf-fulfillment-index .ff-stage.review{color:#6E4BAE;background:rgba(142,82,218,.10);box-shadow:inset 0 0 0 1px rgba(142,82,218,.36)}
.sf-fulfillment-index .ff-stage.review::before{background:#AF52DE}
.sf-fulfillment-index .ff-stage.complete{color:#1E8A45;background:rgba(52,199,89,.11);box-shadow:inset 0 0 0 1px rgba(52,199,89,.38)}
.sf-fulfillment-index .ff-stage.complete::before{background:#34C759}
.sf-fulfillment-index .ff-stage.archived{color:var(--sf-sub);background:rgba(142,142,147,.10);box-shadow:inset 0 0 0 1px rgba(142,142,147,.32)}
.sf-fulfillment-index .ff-stage.archived::before{background:#8E8E93}
html[data-theme="dark"] .sf-fulfillment-index .ff-stage.attention{color:#FFB340}
html[data-theme="dark"] .sf-fulfillment-index .ff-stage.active{color:#4DA3FF}
html[data-theme="dark"] .sf-fulfillment-index .ff-stage.review{color:#C89BFF}
html[data-theme="dark"] .sf-fulfillment-index .ff-stage.complete{color:#5DD97E}
.sf-fulfillment-index>.sf-metrics>.sf-metric{flex:1 1 0;min-width:150px}
.sf-fulfillment-index .ff-count{font-variant-numeric:tabular-nums;color:var(--sf-sub)}
.sf-fulfillment-index .ff-count b{color:var(--sf-ink);font-weight:700}
.sf-fulfillment-index .ff-trackid{display:inline-block;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-sub);font-size:11px;font-weight:650;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.sf-fulfillment-index .ff-next{display:flex;align-items:center;gap:7px;max-width:220px;color:var(--sf-ink);font-weight:550}
.sf-fulfillment-index .ff-next::before{content:"";width:6px;height:6px;border-radius:50%;background:#FF9500;flex:none}
.sf-fulfillment-index .ff-next.done{color:var(--sf-dim);font-weight:500}
.sf-fulfillment-index .ff-next.done::before{background:#34C759}
.sf-fulfillment-index .ff-due{font-size:12px;font-weight:620;color:var(--sf-sub)}
.sf-fulfillment-index .ff-due.soon{color:#A85A00}
html[data-theme="dark"] .sf-fulfillment-index .ff-due.soon{color:#FFB340}
.sf-fulfillment-index .ff-progress{display:inline-flex;align-items:center;gap:9px}
.sf-fulfillment-index .ff-progress .od-prog{width:82px}
.sf-fulfillment-index .ff-pct{min-width:30px;color:var(--sf-sub);font-size:11.5px;font-weight:650;font-variant-numeric:tabular-nums}
.sf-fulfillment-index .ff-openhint{margin-left:auto;color:var(--sf-dim);font-size:11.5px;font-weight:550;white-space:nowrap}
.sf-fulfillment-index .sf-table tbody tr{cursor:pointer}
.sf-fulfillment-index .sf-table tbody tr:focus-visible td{background:var(--sf-hover);outline:0}
.sf-fulfillment-index .sf-table tbody tr:focus-visible td:first-child{box-shadow:inset 3px 0 0 #007AFF}
@media(max-width:860px){.sf-fulfillment-index .ff-openhint{display:none}}
/* toolbar buttons: Export (outline) + Create order (filled) */
.sf-ord-btn{display:inline-flex;align-items:center;gap:7px;flex:none;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:10px;padding:8px 14px;font-size:13.5px;font-weight:600;color:var(--sf-ink);cursor:pointer;font-family:inherit;white-space:nowrap}
.sf-ord-btn:hover{background:var(--sf-hover)}
/* pagination: grouped prev/next chevrons + page range */
.sf-pager{display:inline-flex;align-items:center;gap:10px;flex:none}
.sf-pg-btns{display:inline-flex;border:1px solid var(--sf-border);border-radius:10px;overflow:hidden}
.sf-pg-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:34px;background:var(--sf-surface);border:0;color:var(--sf-ink);cursor:pointer;padding:0}
.sf-pg-btn+.sf-pg-btn{border-left:1px solid var(--sf-border)}
.sf-pg-btn svg{width:16px;height:16px}
.sf-pg-btn:hover:not(:disabled){background:var(--sf-hover)}
.sf-pg-btn:disabled{color:var(--sf-dim);opacity:.4;cursor:default}
.sf-pg-range{font-size:13px;font-weight:600;color:var(--sf-sub);white-space:nowrap}
/* uniform height for every toolbar control */
.sf-orders-index .sf-toolbar{align-items:center}
.sf-orders-index .sf-toolbar .sf-typebtn,.sf-orders-index .sf-toolbar .sf-search-sm,.sf-orders-index .sf-toolbar .sf-pg-btns,.sf-orders-index .sf-toolbar .sf-ord-btn{height:34px;box-sizing:border-box}
.sf-orders-index .sf-toolbar .sf-typebtn,.sf-orders-index .sf-toolbar .sf-ord-btn{padding-top:0;padding-bottom:0;display:inline-flex;align-items:center}
.sf-orders-index .sf-toolbar .sf-pg-btn{height:100%}
.sf-ord-btn svg{width:15px;height:15px;flex:none}
.sf-ord-btn.primary{background:var(--sf-ink);border-color:var(--sf-ink);color:var(--sf-surface)}
.sf-ord-btn.primary:hover{opacity:.9;background:var(--sf-ink)}
/* export popup — blurred, transparent backdrop + glass dialog */
.sf-ord-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:24px}
.sf-ord-modal[hidden]{display:none}
.sf-ord-modal-bd{position:absolute;inset:0;background:rgba(0,0,0,.16);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);will-change:backdrop-filter}
.sf-ord-dialog{position:relative;width:min(560px,100%);max-height:88vh;overflow:auto;border-radius:20px;background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(40px) saturate(1.7);backdrop-filter:blur(40px) saturate(1.7);border:1px solid rgba(255,255,255,.5);box-shadow:0 30px 80px rgba(0,0,0,.35);animation:sfDialogIn .18s ease;will-change:transform}
html[data-theme="dark"] .sf-ord-dialog{background:rgba(22,22,24,.58);border-color:rgba(255,255,255,.1)}
@keyframes sfDialogIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.sf-ord-dialog-h{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--sf-border-2)}
.sf-ord-dialog-h h3{margin:0;font-size:16px;font-weight:700;color:var(--sf-ink)}
.sf-ord-x{background:none;border:0;color:var(--sf-sub);cursor:pointer;padding:4px;border-radius:8px;display:flex}
.sf-ord-x svg{width:18px;height:18px}.sf-ord-x:hover{background:var(--sf-hover);color:var(--sf-ink)}
.sf-ord-dialog-b{padding:16px 22px}
.sf-exp-label{font-size:13px;font-weight:700;color:var(--sf-ink);margin-bottom:10px}
.sf-exp-opt{display:flex;align-items:flex-start;gap:11px;padding:7px 0;cursor:pointer}
.sf-exp-opt.dis{cursor:default;opacity:.45}
.sf-exp-opt input{position:absolute;opacity:0;pointer-events:none}
.sf-exp-rad{width:20px;height:20px;border-radius:999px;border:2px solid var(--sf-border);flex:none;margin-top:1px;position:relative}
.sf-exp-opt input:checked+.sf-exp-rad{border-color:var(--sf-ink)}
.sf-exp-opt input:checked+.sf-exp-rad:after{content:"";position:absolute;inset:3px;border-radius:999px;background:var(--sf-ink)}
.sf-exp-t{font-size:14px;color:var(--sf-ink);font-weight:500}
.sf-ord-dialog-f{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid var(--sf-border-2)}
.sf-orders-index .od-tleft{font-size:12.5px;white-space:nowrap;color:var(--sf-sub)}
.sf-orders-index .od-tleft b{color:var(--sf-ink);font-weight:700}
/* Teams overview — the same compact operating-surface language as Orders,
but the rows describe relationships: our company, client workspaces, and
project teams we create across those accounts. */
body.shopify[data-view="teams"] .sf-content{overflow-y:hidden}
body.shopify[data-view="teams"] .sf-page{padding-bottom:10px}
.sf-teams-index{display:flex;flex-direction:column;min-height:0}
.sf-teams-index .sf-metrics{margin-bottom:20px}
.tm-overview-cell{width:168px;min-width:168px;display:flex;align-items:center;gap:11px;padding:0 20px;border-right:1px solid var(--sf-border-2);background:var(--sf-surface)}
.tm-overview-cell svg{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--sf-sub)}
.tm-overview-copy{min-width:0;display:flex;flex-direction:column}
.tm-overview-copy b{font:650 13px Inter;color:var(--sf-ink);white-space:nowrap}
.tm-overview-copy span{margin-top:2px;font:500 10.5px Inter;color:var(--sf-dim);white-space:nowrap}
.sf-teams-index .sf-toolbar{align-items:center}
.tm-filterset{display:flex;align-items:center;height:34px;padding:3px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-hover);flex:none}
.tm-filter{height:26px;padding:0 11px;border:0;border-radius:7px;background:transparent;color:var(--sf-sub);font:600 12.5px Inter;cursor:pointer;white-space:nowrap}
.tm-filter:hover{color:var(--sf-ink)}
.tm-filter.on{background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
html[data-theme="dark"] .tm-filter.on{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.tm-search{height:34px;min-width:220px;max-width:520px;flex:1 1 360px;display:flex;align-items:center;gap:8px;padding:0 12px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-dim)}
.tm-search:focus-within{border-color:var(--sf-sub);box-shadow:0 0 0 2px rgba(127,127,127,.1)}
.tm-search svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.tm-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--sf-ink);font:500 13px Inter}
.tm-search input::placeholder{color:var(--sf-dim)}
.tm-toolbar-actions{display:flex;align-items:center;gap:9px;margin-left:auto;flex:none}
.sf-teams-index .sf-card{overflow-x:auto;overflow-y:auto;height:calc(100vh - 230px);max-height:calc(100vh - 230px);min-height:260px;overscroll-behavior:none;scrollbar-width:none}
.sf-teams-index .sf-card::-webkit-scrollbar{display:none}
.sf-teams-index .sf-table{min-width:1540px}
.sf-teams-index .sf-table thead th{position:sticky;top:0;z-index:5;background:var(--sf-surface);border-bottom:0}
.sf-teams-index .sf-table thead th::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--sf-border);pointer-events:none}
html[data-theme="dark"] .sf-teams-index .sf-table thead th::before{background:#2f2f31}
.sf-teams-index .sf-table th,.sf-teams-index .sf-table td{white-space:nowrap}
.sf-teams-index .sf-table th:first-child,.sf-teams-index .sf-table td:first-child{position:sticky;left:0;z-index:2;min-width:280px;background:var(--sf-surface)}
.sf-teams-index .sf-table th:first-child{z-index:7}
.sf-teams-index .sf-table th:first-child::after,.sf-teams-index .sf-table td:first-child::after{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:transparent;pointer-events:none}
.sf-teams-index .sf-card.sc .sf-table th:first-child::after,.sf-teams-index .sf-card.sc .sf-table td:first-child::after{background:var(--sf-border-2)}
.sf-teams-index .sf-table tbody tr:hover td{background:#F7F7F7}
html[data-theme="dark"] .sf-teams-index .sf-table tbody tr:hover td{background:#161618}
/* The generic clickable-row style eases the background for 120ms.
Sticky first cells paint on a separate compositor layer, which made that
easing read as two hover waves. Teams should snap every cell together,
matching the Orders table. */
.sf-teams-index .sf-table tbody tr.crow,.sf-teams-index .sf-table tbody tr.crow td{transition:none}
.tm-teamcell{display:flex;align-items:center;gap:11px;min-width:220px}
.tm-teammark{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;background:#111;color:#fff;font:700 10px Inter;letter-spacing:.02em}
html[data-theme="dark"] .tm-teammark{background:#f4f4f5;color:#111}
.tm-teammark.client{border-radius:50%;background:#636366;color:#fff}
.tm-teammark.project{background:rgba(0,122,255,.12);color:#0062CC;box-shadow:inset 0 0 0 1px rgba(0,122,255,.2)}
html[data-theme="dark"] .tm-teammark.project{background:rgba(62,124,250,.12);color:#6aa7ff;box-shadow:inset 0 0 0 1px rgba(62,124,250,.35)}
.tm-teamcopy{min-width:0;display:flex;flex-direction:column}
.tm-teamname{font:600 13.5px Inter;color:var(--sf-ink)}
.tm-teamsub{margin-top:2px;font:500 11.5px Inter;color:var(--sf-dim)}
.tm-people{display:flex;align-items:center;min-width:112px}
.tm-person{width:25px;height:25px;margin-left:-6px;border:2px solid var(--sf-surface);border-radius:50%;display:flex;align-items:center;justify-content:center;background:#747477;color:#fff;font:700 8.5px Inter;letter-spacing:.01em}
.tm-person:first-child{margin-left:0}
.tm-person.more{background:var(--sf-hover);color:var(--sf-sub)}
.sf-teams-index tr:hover .tm-person{border-color:#F7F7F7}
html[data-theme="dark"] .sf-teams-index tr:hover .tm-person{border-color:#161618}
.tm-agents{display:flex;align-items:center;gap:8px;min-width:154px}
.tm-agenticons{display:flex;align-items:center;flex:none}
.tm-agent{width:25px;height:25px;margin-left:-6px;border:2px solid var(--sf-surface);border-radius:8px;display:flex;align-items:center;justify-content:center;background:#303030;color:#fff}
.tm-agent:first-child{margin-left:0}
.tm-agent svg{width:12px!important;height:12px!important;fill:#fff!important}
.tm-agentlabel{max-width:118px;overflow:hidden;text-overflow:ellipsis;color:var(--sf-ink);font:550 12px Inter}
.tm-agentmore{color:var(--sf-dim);font-weight:600}
.sf-teams-index tr:hover .tm-agent{border-color:#F7F7F7}
html[data-theme="dark"] .sf-teams-index tr:hover .tm-agent{border-color:#161618}
.tm-fulfill{display:inline-block;width:94px;height:5px;border-radius:3px;background:#ededed;overflow:hidden;vertical-align:middle}
.tm-fulfill-fill{display:block;height:100%;border-radius:3px;background:#4BD968}
.tm-taskcount{color:var(--sf-ink);font:650 13px Inter}
.tm-taskcount span{color:var(--sf-sub);font-weight:500}
html[data-theme="dark"] .tm-fulfill{background:#2f2f34}
html[data-theme="dark"] .tm-fulfill-fill{background:#fff}
.tm-kind{display:inline-flex;align-items:center;height:26px;padding:0 9px;border-radius:8px;background:var(--sf-hover);color:var(--sf-sub);font:600 11.5px Inter}
.tm-kind.client{background:rgba(52,199,89,.14);color:#218447}
.tm-kind.project{background:rgba(0,122,255,.12);color:#0062CC}
html[data-theme="dark"] .tm-kind.client{color:#5DD97E}
html[data-theme="dark"] .tm-kind.project{color:#62A5FF}
.tm-lead{display:flex;align-items:center;gap:8px;color:var(--sf-ink);font-size:12.5px}
.tm-lead .av{width:21px;height:21px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#8E8E93;color:#fff;font:700 8px Inter}
.tm-row-empty{display:none;padding:44px 20px;text-align:center;color:var(--sf-dim);font:500 13px Inter}
.tm-row-empty.on{display:block}
.tm-modal-ov{position:fixed;inset:0;z-index:320;display:flex;align-items:center;justify-content:center;padding:22px;background:rgba(0,0,0,.34);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px)}
.tm-modal-ov[hidden]{display:none}
.tm-modal{width:min(94vw,480px);overflow:hidden;border:1px solid var(--sf-border);border-radius:16px;background:var(--sf-surface);box-shadow:0 30px 90px rgba(0,0,0,.32)}
.tm-modal-head{height:54px;display:flex;align-items:center;padding:0 17px;border-bottom:1px solid var(--sf-border-2)}
.tm-modal-head h2{font:650 14px Inter;color:var(--sf-ink)}
.tm-modal-x{margin-left:auto;width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:var(--sf-sub);font-size:20px;cursor:pointer}
.tm-modal-x:hover{background:var(--sf-hover);color:var(--sf-ink)}
.tm-modal-body{padding:17px}
.tm-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tm-modal-foot{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:13px 17px;border-top:1px solid var(--sf-border-2)}
.tm-modal-foot .danger{margin-right:auto;color:#C4362B}
.tm-modal-foot [hidden]{display:none!important}
@media(max-width:800px){
.tm-overview-cell{width:146px;min-width:146px;padding:0 15px}
.tm-filterset{max-width:100%;overflow-x:auto}
.sf-teams-index .sf-toolbar{flex-wrap:wrap}
.tm-search{order:3;max-width:none;flex-basis:100%}
.tm-toolbar-actions{margin-left:auto}
}
/* Users & access — Orders table mechanics applied to the people control
plane: compact metrics, one toolbar, frozen identity column, and rows that
move as a single surface on hover. */
body.shopify[data-view="tm-team"] .sf-content{overflow-y:hidden}
body.shopify[data-view="tm-team"] .sf-page{padding-bottom:10px}
.sf-users-index{display:flex;flex-direction:column;min-height:0;height:calc(100vh - 90px);height:calc(100dvh - 90px)}
.sf-users-index .sf-metrics{flex:none;margin-bottom:20px}
.sf-users-index .sf-metrics:has(.usr-metric-filter.open){overflow:visible;position:relative;z-index:80}
.sf-users-index .sf-toolbar{align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.sf-users-index .sf-toolbar::-webkit-scrollbar{display:none}
.sf-users-index .tm-search{max-width:none}
.usr-metric-filter{position:relative;padding:0}
.usr-metric-filter .usr-metric-filterbtn{width:100%;height:100%;padding:0 20px;border:0;border-radius:var(--sf-radius) 0 0 var(--sf-radius);background:transparent;box-shadow:none;display:flex;align-items:center;gap:11px;text-align:left}
.usr-metric-filter .usr-metric-filterbtn:hover{background:var(--sf-hover)}
.usr-metric-filter .tm-overview-copy{flex:1}
.usr-metric-filter .tb-cv{width:12px;height:7px;margin-left:auto;transition:transform .15s}
.usr-metric-filter.open .tb-cv{transform:rotate(180deg)}
.usr-metric-filter .sf-typemenu{top:calc(100% + 6px);left:0;min-width:220px}
.usr-table-frame{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;border:1px solid var(--sf-border);border-radius:var(--sf-radius);background:var(--sf-surface)}
.sf-users-index .sf-card{flex:1 1 auto;overflow-x:auto;overflow-y:auto;width:100%;height:100%;max-height:none;min-height:0;border:0;border-radius:0;overscroll-behavior:none;scrollbar-width:none}
.sf-users-index .sf-card::-webkit-scrollbar{display:none}
.sf-users-index .sf-table{min-width:1240px}
.sf-users-index .sf-table thead th{position:sticky;top:0;z-index:5;background:var(--sf-surface);border-bottom:0}
.sf-users-index .sf-table thead th::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--sf-border);pointer-events:none}
.sf-users-index .sf-table th,.sf-users-index .sf-table td{white-space:nowrap}
.sf-users-index .sf-table th:first-child,.sf-users-index .sf-table td:first-child{position:sticky;left:0;z-index:2;box-sizing:border-box;width:292px;min-width:292px;max-width:292px;background:var(--sf-surface)}
.sf-users-index .sf-table th:first-child{z-index:7}
.sf-users-index .sf-table th:first-child::after,.sf-users-index .sf-table td:first-child::after{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:transparent;pointer-events:none}
.sf-users-index .sf-card.sc .sf-table th:first-child::after,.sf-users-index .sf-card.sc .sf-table td:first-child::after{background:var(--sf-border-2)}
.usr-scroll-edge{position:absolute;top:0;bottom:0;z-index:10;width:18px;opacity:0;pointer-events:none;transition:opacity .12s ease}
.usr-scroll-edge.right{right:0;background:linear-gradient(270deg,rgba(20,20,22,.1),rgba(20,20,22,0))}
.usr-table-frame.can-scroll-right .usr-scroll-edge.right{opacity:1}
html[data-theme="dark"] .usr-scroll-edge.right{background:linear-gradient(270deg,rgba(0,0,0,.38),rgba(0,0,0,0))}
.sf-users-index .sf-table tbody tr:hover td{background:#F7F7F7}
.sf-users-index .sf-table tbody tr.crow,.sf-users-index .sf-table tbody tr.crow td{transition:none}
html[data-theme="dark"] .sf-users-index .sf-table tbody tr:hover td{background:#161618}
html[data-theme="dark"] .sf-users-index .sf-table thead th::before{background:#2f2f31}
/* Keep the complete Users overview visible inside the current content sheet.
The old 1240px table and 186px metric minimums clipped the last metric,
Security, and Last active on common laptop widths. */
@media(min-width:900px){
.sf-users-index .sf-metrics-scroll{overflow-x:hidden;-webkit-mask-image:none;mask-image:none}
.sf-users-index .sf-metrics-scroll>div{width:100%;min-width:0}
.sf-users-index .sf-metrics-scroll .sf-metric{flex:1 1 0;min-width:0;padding-left:14px;padding-right:14px;overflow:hidden}
.sf-users-index .sf-metrics-scroll .sf-metric .ml{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-users-index .sf-table{width:100%;min-width:0;table-layout:fixed}
.sf-users-index .sf-table th,.sf-users-index .sf-table td{box-sizing:border-box;overflow:hidden;text-overflow:ellipsis}
.sf-users-index .sf-table th:nth-child(1),.sf-users-index .sf-table td:nth-child(1){width:28%;min-width:0;max-width:none}
.sf-users-index .sf-table th:nth-child(2),.sf-users-index .sf-table td:nth-child(2){width:12%}
.sf-users-index .sf-table th:nth-child(3),.sf-users-index .sf-table td:nth-child(3){width:18%}
.sf-users-index .sf-table th:nth-child(4),.sf-users-index .sf-table td:nth-child(4){width:18%}
.sf-users-index .sf-table th:nth-child(5),.sf-users-index .sf-table td:nth-child(5){width:14%}
.sf-users-index .sf-table th:nth-child(6),.sf-users-index .sf-table td:nth-child(6){width:10%}
.sf-users-index .usr-usercell{min-width:0}
.sf-users-index .usr-copy{max-width:calc(100% - 43px)}
.sf-users-index .usr-email{max-width:100%}
.sf-users-index .usr-scope{max-width:100%}
.sf-users-index .usr-secure{max-width:100%;overflow:hidden;text-overflow:ellipsis}
}
body.shopify[data-view="tm-team"].users-list-scrolling .composer{opacity:0;pointer-events:none;transition:left .46s cubic-bezier(.22,1,.36,1),right .46s cubic-bezier(.22,1,.36,1),opacity .12s ease}
body.shopify[data-view="tm-team"].users-list-scrolling .composer .pill{pointer-events:none}
.usr-usercell{display:flex;align-items:center;gap:11px;min-width:252px}
.usr-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;background:#6d6d70;color:#fff;font:700 10px Inter;letter-spacing:.01em}
.usr-avatar.owner{border-radius:10px;background:#111}
html[data-theme="dark"] .usr-avatar.owner{background:#f4f4f5;color:#111}
.usr-avatar.has-photo,.usr-avatar.owner.has-photo{overflow:hidden;border:0;border-radius:50%;background:transparent;color:transparent}
.usr-avatar.has-photo img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.usr-avatar.has-placeholder,.usr-avatar.owner.has-placeholder{border:0;border-radius:50%;background:#28282b;color:#a7a7ac}
html[data-theme="light"] .usr-avatar.has-placeholder,html[data-theme="light"] .usr-avatar.owner.has-placeholder{background:#e9e9eb;color:#717176}
.usr-avatar.has-placeholder svg{display:block;width:17px;height:17px}
.usr-copy{min-width:0;display:flex;flex-direction:column}
.usr-name{font:600 13.5px Inter;color:var(--sf-ink)}
.usr-email{max-width:220px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;color:var(--sf-dim);font:500 11.5px Inter}
.usr-scope{display:flex;align-items:center;gap:5px;max-width:210px;overflow:hidden}
.usr-scope-chip{display:inline-flex;align-items:center;height:25px;padding:0 8px;border-radius:8px;background:var(--sf-hover);color:var(--sf-sub);font:600 11px Inter}
.usr-scope-more{color:var(--sf-dim);font:600 11px Inter}
.usr-secure{display:inline-flex;align-items:center;gap:6px;color:var(--sf-sub);font:600 11.5px Inter}
.usr-secure svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.usr-secure.required{color:#218447}
.usr-empty{display:none;padding:44px 20px;text-align:center;color:var(--sf-dim);font:500 13px Inter}
.usr-empty.on{display:block}
/* Invite sequence and role manager share the same bordered, low-elevation
panels as order detail rather than introducing a separate settings style. */
.usr-flow{max-width:1120px;margin:0 auto;padding-bottom:80px}
.usr-flow-metrics{position:sticky;top:8px;z-index:28;margin-bottom:18px;background:rgba(255,255,255,.84);-webkit-backdrop-filter:blur(22px) saturate(1.4);backdrop-filter:blur(22px) saturate(1.4)}
html[data-theme="dark"] .usr-flow-metrics{background:rgba(12,12,13,.84)}
.usr-step-pin{width:76px;min-width:76px;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--sf-border-2)}
.usr-step-pin button{width:32px;height:32px;border:0;border-radius:8px;background:transparent;color:var(--sf-sub);cursor:pointer}
.usr-step-pin button:hover{background:var(--sf-hover);color:var(--sf-ink)}
.usr-step{flex:1;min-width:142px;padding:12px 18px;border-right:1px solid var(--sf-border-2)}
.usr-step small{display:block;margin-bottom:4px;color:var(--sf-dim);font:600 10.5px Inter}
.usr-step b{color:var(--sf-sub);font:650 12.5px Inter}
.usr-step.on b{color:var(--sf-ink)}
.usr-step.done small,.usr-step.done b{color:#218447}
.usr-flow-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.usr-flow-head h1{margin:0;color:var(--sf-ink);font:700 22px/1.2 Inter;letter-spacing:-.02em}
.usr-flow-head p{margin:5px 0 0;color:var(--sf-dim);font:500 12.5px/1.5 Inter}
.usr-flow-card{overflow:hidden;border:1px solid var(--sf-border);border-radius:14px;background:var(--sf-surface)}
.usr-flow-section{padding:20px;border-bottom:1px solid var(--sf-border-2)}
.usr-flow-section:last-child{border-bottom:0}
.usr-flow-section h2{margin:0 0 5px;color:var(--sf-ink);font:650 14px Inter}
.usr-flow-section>p{margin:0 0 16px;color:var(--sf-dim);font:500 12px/1.5 Inter}
.usr-emailbox{width:100%;min-height:128px;resize:vertical}
.usr-hint{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;color:var(--sf-dim);font:500 11.5px Inter}
.usr-role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.usr-role-card{position:relative;min-height:86px;padding:14px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);text-align:left;cursor:pointer}
.usr-role-card:hover{background:var(--sf-hover)}
.usr-role-card.on{border-color:var(--sf-ink);box-shadow:inset 0 0 0 1px var(--sf-ink)}
.usr-role-card b{display:block;color:var(--sf-ink);font:650 13px Inter}
.usr-role-card span{display:block;margin-top:5px;color:var(--sf-dim);font:500 11.5px/1.4 Inter}
.usr-role-card em{position:absolute;right:12px;top:12px;color:var(--sf-dim);font:600 10px Inter;font-style:normal}
.usr-switch-row{display:flex;align-items:center;justify-content:space-between;gap:18px}
.usr-switch-row b{display:block;color:var(--sf-ink);font:650 13px Inter}
.usr-switch-row span{display:block;margin-top:3px;color:var(--sf-dim);font:500 11.5px Inter}
.usr-scope-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.usr-scope-option{display:flex;align-items:flex-start;gap:10px;padding:13px;border:1px solid var(--sf-border-2);border-radius:11px;cursor:pointer}
.usr-scope-option:hover{background:var(--sf-hover)}
.usr-scope-option input{margin-top:2px;accent-color:#111}
.usr-scope-option b{display:block;color:var(--sf-ink);font:600 12.5px Inter}
.usr-scope-option span{display:block;margin-top:3px;color:var(--sf-dim);font:500 11px Inter}
.usr-review{display:grid;grid-template-columns:160px minmax(0,1fr);gap:0}
.usr-review dt,.usr-review dd{margin:0;padding:12px 0;border-bottom:1px solid var(--sf-border-2)}
.usr-review dt{color:var(--sf-dim);font:600 11.5px Inter}
.usr-review dd{color:var(--sf-ink);font:550 12.5px/1.5 Inter}
.usr-review dt:last-of-type,.usr-review dd:last-of-type{border-bottom:0}
.usr-flow-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;margin-top:14px}
.usr-flow-actions .back{margin-right:auto}
.usr-role-index{display:flex;flex-direction:column;min-height:0}
.usr-role-index .sf-card{overflow:auto;max-height:calc(100vh - 145px);max-height:calc(100dvh - 145px);scrollbar-width:none}
.usr-role-index .sf-card::-webkit-scrollbar{display:none}
.usr-role-index .sf-table{min-width:1050px}
.usr-role-index .sf-table thead th{position:sticky;top:0;z-index:3;background:var(--sf-surface)}
.usr-role-desc{display:block;max-width:280px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;color:var(--sf-dim);font:500 11px Inter}
.usr-perm-summary{max-width:310px;overflow:hidden;text-overflow:ellipsis;color:var(--sf-sub);font:500 11.5px Inter}
.usr-role-modal{align-items:flex-start;padding:18px 22px 118px}
.usr-role-modal .tm-modal{width:min(94vw,760px);max-height:min(88vh,calc(100dvh - 136px));display:flex;flex-direction:column}
.usr-role-modal .tm-modal-body{overflow:auto}
.usr-role-fields{display:grid;grid-template-columns:1fr 1.4fr;gap:12px}
.usr-perm-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.usr-perm-group{overflow:hidden;border:1px solid var(--sf-border-2);border-radius:11px}
.usr-perm-group h3{margin:0;padding:10px 12px;border-bottom:1px solid var(--sf-border-2);color:var(--sf-sub);font:650 11px Inter;text-transform:uppercase;letter-spacing:.035em}
.usr-perm-check{display:flex;align-items:flex-start;gap:9px;padding:10px 12px;border-bottom:1px solid var(--sf-border-2);cursor:pointer}
.usr-perm-check:last-child{border-bottom:0}
.usr-perm-check input{margin-top:2px;accent-color:#111}
.usr-perm-check b{display:block;color:var(--sf-ink);font:600 11.5px Inter}
.usr-perm-check span{display:block;margin-top:2px;color:var(--sf-dim);font:500 10.5px/1.35 Inter}
@media(max-width:800px){
.sf-users-index .sf-toolbar{flex-wrap:nowrap;overflow-x:auto}
.sf-users-index .tm-search{order:0;max-width:none;min-width:300px;flex-basis:300px}
.usr-role-grid,.usr-scope-list,.usr-perm-groups,.usr-role-fields{grid-template-columns:1fr}
.usr-flow{padding-bottom:110px}
.usr-step{min-width:128px}
}
/* Team workspace — an Orders-detail sibling. The first view is a complete
operational profile (people, agents, fulfillment and activity); tasks are
intentionally a secondary tab instead of the landing screen. */
body[data-view="team-workspace"] .sf-content{border-top-left-radius:0;border-top-right-radius:0}
.twd-shell{display:flex;flex-direction:column;min-width:0;padding-bottom:70px}
.twd-metrics{position:sticky;top:8px;z-index:28;margin:0 0 14px;background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(22px) saturate(1.45);backdrop-filter:blur(22px) saturate(1.45)}
html[data-theme="dark"] .twd-metrics{background:rgba(12,12,13,.82)}
.twd-metrics .sf-metrics-scroll .sf-metric{flex:1 0 160px;min-width:160px;padding:9px 20px}
.twd-metrics .od-pin{width:78px;min-width:78px}
.twd-metrics .od-pin-r{min-width:128px}
.twd-head{display:flex;align-items:flex-start;gap:14px;padding:4px 2px 15px}
.twd-mark{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;background:#111;color:#fff;font:750 13px Inter;letter-spacing:.02em}
.twd-mark.client{border-radius:50%;background:#636366}
.twd-mark.project{background:rgba(0,122,255,.12);color:#0062CC;box-shadow:inset 0 0 0 1px rgba(0,122,255,.22)}
html[data-theme="dark"] .twd-mark:not(.client):not(.project){background:#f4f4f5;color:#111}
html[data-theme="dark"] .twd-mark.project{color:#6aa7ff;background:rgba(62,124,250,.14);box-shadow:inset 0 0 0 1px rgba(62,124,250,.35)}
.twd-title{min-width:0;flex:1}
.twd-title h1{margin:1px 0 4px;color:var(--sf-ink);font:700 22px/1.2 Inter;letter-spacing:-.02em}
.twd-title-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;color:var(--sf-dim);font:500 12px Inter}
.twd-head-actions{display:flex;align-items:center;gap:8px;flex:none}
.twd-tabs{height:38px;display:flex;align-items:center;gap:3px;padding:3px;margin-bottom:15px;border:1px solid var(--sf-border);border-radius:11px;background:var(--sf-hover);overflow-x:auto;scrollbar-width:none}
.twd-tabs::-webkit-scrollbar{display:none}
.twd-tab{height:30px;padding:0 14px;border:0;border-radius:8px;background:transparent;color:var(--sf-sub);font:650 12.5px Inter;cursor:pointer;white-space:nowrap}
.twd-tab:hover{color:var(--sf-ink)}
.twd-tab.on{background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
html[data-theme="dark"] .twd-tab.on{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.twd-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.75fr);gap:14px;align-items:start}
.twd-people-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px;align-items:start}
.twd-people-split.single{grid-template-columns:1fr}
.twd-overview-lower,.twd-ai-full{margin-top:14px}
.twd-side-title{display:flex;align-items:center;gap:8px}
.twd-side-title:before{content:"";width:7px;height:7px;border-radius:50%;background:#1D1D1F;box-shadow:0 0 0 3px rgba(29,29,31,.08)}
.twd-section.their-team .twd-side-title:before{background:#007AFF;box-shadow:0 0 0 3px rgba(0,122,255,.11)}
html[data-theme="dark"] .twd-side-title:before{background:#f5f5f7;box-shadow:0 0 0 3px rgba(255,255,255,.1)}
html[data-theme="dark"] .twd-section.their-team .twd-side-title:before{background:#5AA2FF;box-shadow:0 0 0 3px rgba(90,162,255,.13)}
.twd-stack{display:flex;flex-direction:column;gap:14px;min-width:0}
.twd-section{min-width:0;border:1px solid var(--sf-border);border-radius:14px;background:var(--sf-surface);overflow:hidden}
.twd-section-head{min-height:48px;display:flex;align-items:center;gap:10px;padding:0 16px;border-bottom:1px solid var(--sf-border-2)}
.twd-section-head h2{margin:0;color:var(--sf-ink);font:680 13.5px Inter}
.twd-section-head .sub{margin-left:auto;color:var(--sf-dim);font:550 11.5px Inter}
.twd-section-body{padding:15px 16px}
.twd-brief{font:500 13.5px/1.55 Inter;color:var(--sf-sub);max-width:760px}
.twd-focus{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:13px;border-top:1px solid var(--sf-border-2)}
.twd-focus-label{color:var(--sf-dim);font:650 10.5px Inter;text-transform:uppercase;letter-spacing:.055em}
.twd-focus strong{color:var(--sf-ink);font:650 12.5px Inter}
.twd-health{margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:rgba(52,199,89,.13);color:#237D40;font:650 11.5px Inter}
.twd-health:before{content:"";width:6px;height:6px;border-radius:50%;background:#34C759}
.twd-health.risk{background:rgba(255,149,0,.14);color:#98620B}
.twd-health.risk:before{background:#FF9500}
.twd-roster{display:flex;flex-direction:column}
.twd-person-row,.twd-agent-row{min-height:58px;display:flex;align-items:center;gap:11px;padding:8px 16px;border-top:1px solid var(--sf-border-2)}
.twd-person-row:first-child,.twd-agent-row:first-child{border-top:0}
.twd-avatar{width:31px;height:31px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;background:#77777B;color:#fff;font:750 9.5px Inter}
.twd-person-copy,.twd-agent-copy{min-width:0;flex:1;display:flex;flex-direction:column}
.twd-person-copy b,.twd-agent-copy b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-ink);font:650 12.5px Inter}
.twd-person-copy span,.twd-agent-copy span{margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-dim);font:500 11px Inter}
.twd-row-state{display:inline-flex;align-items:center;gap:6px;flex:none;color:var(--sf-sub);font:600 11px Inter}
.twd-row-state:before{content:"";width:6px;height:6px;border-radius:50%;background:#34C759}
.twd-row-state.invited:before{background:#FF9500}
.twd-agent-icon{width:31px;height:31px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex:none;background:#2d2d2f;color:#fff}
.twd-agent-icon svg{width:14px!important;height:14px!important;fill:#fff!important}
.twd-agent-mode{flex:none;padding:5px 8px;border-radius:8px;background:var(--sf-hover);color:var(--sf-sub);font:650 10.5px Inter}
.twd-details{display:flex;flex-direction:column}
.twd-kv{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:10px 0;border-top:1px solid var(--sf-border-2)}
.twd-kv:first-child{padding-top:0;border-top:0}
.twd-kv:last-child{padding-bottom:0}
.twd-kv span{color:var(--sf-dim);font:550 11.5px Inter}
.twd-kv b{max-width:58%;text-align:right;color:var(--sf-ink);font:650 11.8px Inter}
.twd-progress-big{height:7px;border-radius:999px;background:var(--sf-hover);overflow:hidden}
.twd-progress-big span{display:block;height:100%;border-radius:inherit;background:#4BD968}
.twd-progress-meta{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.twd-progress-meta strong{color:var(--sf-ink);font:720 24px Inter;letter-spacing:-.03em}
.twd-progress-meta span{color:var(--sf-dim);font:550 11.5px Inter}
.twd-milestones{display:flex;flex-direction:column;margin-top:12px}
.twd-milestone{position:relative;display:flex;align-items:flex-start;gap:9px;padding:8px 0 8px 19px;color:var(--sf-sub);font:550 11.5px/1.4 Inter}
.twd-milestone:before{content:"";position:absolute;left:1px;top:12px;width:7px;height:7px;border-radius:50%;background:var(--sf-border);box-shadow:0 0 0 3px var(--sf-surface)}
.twd-milestone:after{content:"";position:absolute;left:4px;top:19px;bottom:-9px;width:1px;background:var(--sf-border)}
.twd-milestone:last-child:after{display:none}
.twd-milestone.done:before{background:#34C759}
.twd-milestone.active:before{background:#007AFF}
.twd-milestone b{display:block;color:var(--sf-ink);font-weight:650}
.twd-activity{display:flex;flex-direction:column}
.twd-activity-row{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-top:1px solid var(--sf-border-2)}
.twd-activity-row:first-child{padding-top:0;border-top:0}
.twd-activity-row:last-child{padding-bottom:0}
.twd-activity-dot{width:7px;height:7px;margin-top:5px;border-radius:50%;background:#8E8E93;flex:none}
.twd-activity-copy{min-width:0;color:var(--sf-sub);font:500 11.5px/1.45 Inter}
.twd-activity-copy b{color:var(--sf-ink);font-weight:650}
.twd-activity-copy span{display:block;margin-top:2px;color:var(--sf-dim);font-size:10.5px}
.twd-empty{padding:48px 20px;text-align:center;color:var(--sf-dim);font:550 13px Inter}
.twd-taskgrid{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:12px;overflow-x:auto;padding-bottom:4px}
.twd-taskcol{min-width:220px;min-height:330px;padding:11px;border:1px solid var(--sf-border-2);border-radius:14px;background:rgba(127,127,127,.045)}
.twd-taskcol-h{display:flex;align-items:center;gap:8px;padding:3px 3px 12px;color:var(--sf-ink);font:680 12.5px Inter}
.twd-taskcol-h i{width:7px;height:7px;border-radius:50%;background:#8E8E93}
.twd-taskcol-h span{margin-left:auto;min-width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:var(--sf-hover);color:var(--sf-sub);font-size:10.5px}
.twd-taskcard{margin-bottom:9px;padding:13px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface)}
.twd-taskcard b{display:block;color:var(--sf-ink);font:620 12px/1.4 Inter}
.twd-taskcard-meta{display:flex;align-items:center;gap:7px;margin-top:10px;color:var(--sf-dim);font:550 10.5px Inter}
.twd-taskcard-meta .av{width:21px;height:21px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#77777B;color:#fff;font:700 7.5px Inter}
@media(max-width:980px){
.twd-grid{grid-template-columns:1fr}
.twd-taskgrid{grid-template-columns:repeat(4,260px)}
}
@media(max-width:820px){
.twd-people-split{grid-template-columns:1fr}
}
@media(max-width:680px){
.twd-shell{padding-bottom:88px}
.twd-metrics .od-pin{width:58px;min-width:58px}
.twd-metrics .od-pin-r{min-width:106px;padding:0 8px!important}
.twd-head{flex-wrap:wrap}
.twd-head-actions{width:100%}
.twd-head-actions .sf-btn{flex:1}
.twd-focus{align-items:flex-start;flex-wrap:wrap}
.twd-health{margin-left:0}
}
/* order detail — timeline (comment composer + auto-logged events) */
.od-tlc{display:flex;gap:10px;align-items:center}
.od-tlc .sf-field{flex:1;min-width:0}
.od-tl-row{display:flex;align-items:flex-start;gap:12px;padding:9px 2px}
.od-tl-dot{width:8px;height:8px;border-radius:999px;background:var(--sf-dim);flex:none;margin-top:5px}
.od-tl-dot.c{background:#4BD968}
/* Shopify-style timeline: card composer (avatar + toolbar) over a spined event list */
/* Composer pins under the sticky order header on scroll; a gradient skirt below
it fades passing timeline rows out instead of hard-clipping them */
.od-tlstick{position:sticky;top:62px;z-index:20;background:var(--sf-surface);padding-top:14px}
.od-tlstick:after{content:"";position:absolute;left:-2px;right:-2px;top:100%;height:30px;background:linear-gradient(to bottom,var(--sf-surface),transparent);pointer-events:none}
html[data-theme="dark"] .od-tlstick{background:#000}
html[data-theme="dark"] .od-tlstick:after{background:linear-gradient(to bottom,#000,transparent)}
.od-tlc2{border:1px solid var(--sf-border);border-radius:14px;background:var(--sf-surface)}
html[data-theme="dark"] .od-tlc2{background:#0F0F0F;border-color:rgba(255,255,255,.1)}
.od-tlc2-top{display:flex;align-items:center;gap:12px;padding:11px 13px}
.od-tlc2 .av{width:34px;height:34px;border-radius:9px;background:rgba(62,124,250,.16);color:#7FB5FF;box-shadow:inset 0 0 0 1px #3E7CFA;display:inline-flex;align-items:center;justify-content:center;font:800 13px Inter;flex:none}
html[data-theme="light"] .od-tlc2 .av{background:rgba(43,108,255,.10);color:#2b6cff;box-shadow:inset 0 0 0 1px rgba(43,108,255,.5)}
.od-tlc2 input{flex:1;min-width:0;border:none;background:none;outline:none;font:500 14px Inter;color:var(--sf-ink)}
.od-tlc2 input::placeholder{color:var(--sf-dim)}
.od-tlc2-bar{display:flex;align-items:center;gap:2px;padding:7px 9px;border-top:1px solid var(--sf-border-2)}
.od-tlc2-bar .tic{width:30px;height:30px;border-radius:8px;border:none;background:none;display:inline-flex;align-items:center;justify-content:center;color:var(--sf-sub);cursor:pointer}
.od-tlc2-bar .tic:hover{background:var(--sf-hover);color:var(--sf-ink)}
.od-tlc2-bar .tic svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}
.od-tlc2-bar .sf-btn{margin-left:auto}
.od-tlc2-bar .sf-btn[disabled]{opacity:.45;cursor:default}
.od-tl2{position:relative;margin-top:4px;padding-left:26px}
.od-tl2:before{content:"";position:absolute;left:7px;top:10px;bottom:10px;width:2px;background:var(--sf-border)}
.od-tl2-group{font:600 13px Inter;color:var(--sf-sub);margin:20px 0 6px}
.od-tl2-row{position:relative;display:flex;align-items:flex-start;gap:10px;padding:14px 2px}
.od-tl2-dot{position:absolute;left:-22px;top:19px;width:8px;height:8px;border-radius:3px;background:var(--sf-dim);box-shadow:0 0 0 4px var(--sf-surface)}
.od-tl2-dot.c{background:#4BD968}
/* stage card: no divider between the header and the segmented bar */
.od-stagecard .sf-cardh2{border-bottom:none;padding-bottom:4px}
/* ---- Document folders: gray folder-tab cards (Contracts / Invoices / Receipts).
A paper sheet sits tucked behind the flap and slides up on hover while the
flap tips open (rotateX). Solid grays only, both themes via --sf vars. ---- */
.od-docs{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.od-folder{position:relative;height:178px;border-radius:16px;overflow:hidden;cursor:pointer;isolation:isolate;background:var(--sf-hover);border:1px solid var(--sf-border);transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s cubic-bezier(.22,1,.36,1)}
.od-folder:hover{transform:translateY(-4px);box-shadow:0 14px 30px -14px rgba(0,0,0,.45)}
.od-folder .fpeek{position:absolute;left:50%;top:12px;width:74%;height:96px;z-index:1;border-radius:9px;background:#fff;border:1px solid rgba(0,0,0,.12);box-shadow:0 6px 18px -8px rgba(0,0,0,.4);transform:translateX(-50%) translateY(34%);transition:transform .5s cubic-bezier(.34,1.35,.35,1)}
html[data-theme="dark"] .od-folder .fpeek{background:#C9C9CE;border-color:rgba(0,0,0,.25)}
/* the peeking sheet is labelled with the folder's title, like a real document
heading — visible in the tucked sliver and fully revealed on hover */
.od-folder .fpeek .fpeek-t{position:absolute;left:12px;right:12px;top:5px;font-size:11px;font-weight:750;letter-spacing:-.01em;color:rgba(0,0,0,.72);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.od-folder .fpeek:after{content:"";position:absolute;left:12px;right:26px;top:26px;height:38px;border-radius:3px;background:repeating-linear-gradient(to bottom,rgba(0,0,0,.09) 0 4px,transparent 4px 12px)}
.od-folder:hover .fpeek{transform:translateX(-50%) translateY(-4%) rotate(-2deg)}
.od-folder .fwrap{position:absolute;left:0;right:0;bottom:0;height:118px;z-index:2;perspective:700px}
.od-folder .fflap{position:absolute;inset:0;transform-origin:50% 100%;transition:transform .5s cubic-bezier(.34,1.3,.4,1);filter:drop-shadow(0 -6px 14px rgba(0,0,0,.28))}
.od-folder:hover .fflap{transform:rotateX(8deg) translateY(1px)}
.od-folder .fshape{position:absolute;inset:0;width:100%;height:100%;display:block}
.od-folder .fshape path{fill:#E7E7EA}
html[data-theme="dark"] .od-folder .fshape path{fill:#0F0F0F}
html[data-theme="dark"] .od-folder{background:#0F0F0F;border-color:rgba(255,255,255,.1)}
.od-folder .fbody{position:absolute;inset:0;padding:8px 14px 13px;display:flex;flex-direction:column;justify-content:space-between;color:var(--sf-ink)}
.od-folder .ftop{display:flex;align-items:flex-start;justify-content:space-between}
.od-folder .fnum{font-size:21px;font-weight:700;letter-spacing:-.02em;line-height:1;margin-top:2px}
.od-folder .farr{width:19px;height:19px;margin-top:34px;color:var(--sf-sub);transition:transform .4s cubic-bezier(.22,1,.36,1)}
.od-folder:hover .farr{transform:translate(3px,-3px);color:var(--sf-ink)}
.od-folder .ft{font-size:13.5px;font-weight:650;letter-spacing:-.01em}
.od-folder .fs{font-size:11.5px;color:var(--sf-sub);margin-top:3px}
/* rail customer card: the customer-page profile anatomy (avatar, business,
action row, Info boxes, Documents) compacted for the order rail. Theme-aware
via --sf vars — no hardcoded panel colors. */
.rail-cust .rc-av{width:64px;height:64px;border-radius:50%;background:#AEAEB5;color:#2C2C30;font-weight:800;font-size:20px;display:inline-flex;align-items:center;justify-content:center;margin:4px auto 10px}
/* only the Info rows live in a white card — avatar + action circles stay flat above */
.rail-cust .rc-infocard{border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);padding:12px 14px;margin-top:16px}
.rail-cust .rc-infocard .rc-sec{margin-top:0}
.rail-cust .rc-infocard .rc-box:last-child{margin-bottom:0}
.rail-cust .rc-nm{text-align:center;font-size:16px;font-weight:750;color:var(--sf-ink);letter-spacing:-.01em}
.rail-cust .rc-biz{text-align:center;font-size:12.5px;font-weight:650;color:var(--sf-sub);margin-top:2px}
.rail-cust .rc-ords{text-align:center;font-size:11.5px;color:var(--sf-dim);margin-top:3px}
.rail-cust .rc-actions{display:flex;justify-content:space-between;margin:12px 0 2px}
.rail-cust .rc-act{flex:none;width:46px;height:46px;border:1px solid var(--sf-border);border-radius:50%;background:var(--sf-surface);color:var(--sf-ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s}
.rail-cust .rc-act:hover{background:var(--sf-hover)}
.rail-cust .rc-act svg{width:16px;height:16px}
.rail-cust .rc-sec{font-size:12.5px;font-weight:700;color:var(--sf-ink);margin:14px 0 7px}
.rail-cust .rc-box{background:none;border-radius:0;padding:0;margin-bottom:10px}
.rail-cust .rc-row{padding:8px 0;border-top:1px solid var(--sf-border-2)}
.rail-cust .rc-row:first-child{border-top:0}
.rail-cust .rc-row .l{font-size:11px;color:var(--sf-dim)}
.rail-cust .rc-row .v{font-size:12.5px;color:var(--sf-ink);font-weight:550;margin-top:2px;word-break:break-word}
.rail-cust .rc-row .v a{color:var(--sf-ink);text-decoration:none}
/* rail team cards: client team (transferable Primary) + Attract team (Lead) */
.rt-cap{font-size:11.5px;color:var(--sf-dim);line-height:1.45;margin-bottom:2px}
.rt-cap b{color:var(--sf-sub);font-weight:700}
.rt-row{display:flex;align-items:center;gap:9px;padding:8px 0;border-top:1px solid var(--sf-border-2)}
.rt-list .rt-row:first-child{border-top:0}
.rt-av{width:26px;height:26px;border-radius:50%;background:var(--sf-hover);color:var(--sf-ink);font-size:10px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;flex:none}
.rt-txt{flex:1;min-width:0;display:flex;flex-direction:column}
.rt-nm{font-size:12.5px;font-weight:650;color:var(--sf-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-sub{font-size:11px;color:var(--sf-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-badge{font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;border-radius:999px;background:rgba(75,217,104,.14);color:#4BD968;flex:none}
.rt-mk{border:0;background:none;color:#2b6cff;font:600 11.5px Inter;cursor:pointer;padding:0;flex:none}
.rt-rm{border:0;background:none;color:var(--sf-dim);cursor:pointer;font-size:13px;line-height:1;padding:0 2px;flex:none}
/* client hero bar: the Orders metrics-bar anatomy on the customer detail —
identity cell (avatar + name) where the Today pill sits, sticky glass on scroll */
.cd-hero{position:sticky;top:8px;z-index:25;margin:0 0 14px}
.cd-hero .sf-metrics{margin:0;background:rgba(255,255,255,.6);-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5)}
html[data-theme="dark"] .cd-hero .sf-metrics{background:rgba(0,0,0,.55)}
.cd-hero .sf-rangecell{background:transparent;padding:0 16px;gap:11px;min-width:170px}
/* fit all four metric cells without clipping — the Orders bar has more width to spend */
.cd-hero .sf-metrics-scroll .sf-metric{flex:1 1 140px;min-width:140px;padding:9px 20px}
.cd-hero .cd-hero-av{width:34px;height:34px;border-radius:999px;background:#636366;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:12.5px;flex:none}
.cd-hero .cd-hero-nm{font-weight:700;font-size:13.5px;color:var(--sf-ink);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cd-hero .cd-hero-sub{font-size:11.5px;color:var(--sf-dim);margin-top:1px;white-space:nowrap}
/* task board popup: kanban columns inside the glass dialog */
.odb-dialog{width:min(1160px,96vw)}
.odb-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;padding:16px 22px 22px;overflow:auto}
.odb-col{background:rgba(127,127,127,.06);border:1px solid var(--sf-border-2);border-radius:16px;padding:12px;display:flex;flex-direction:column;min-height:190px}
.odb-colh{display:flex;align-items:center;gap:9px;padding:2px 4px 12px}
.odb-dot{width:9px;height:9px;border-radius:999px;flex:none}
.odb-colh .nm{font-weight:700;font-size:13.5px;color:var(--sf-ink)}
.odb-cnt{margin-left:auto;background:var(--sf-hover);color:var(--sf-sub);font-size:11.5px;font-weight:700;min-width:22px;height:22px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;padding:0 7px}
/* board task card (SVG spec): #0F0F0F rx20; default = chevron + title + mini bar +
n/m. Hover reveals the assignee row (avatar(s) + due). Click expands the #171717
panel with the sub-task checklist (green check / spinner) + Add Task pill. */
/* day mode: light-gray cards per the Group.svg spec — #F7F7F7 surface, black
title, #929292 chevron/fraction, white progress track, #4BD968 fill */
.odb-card{background:#F7F7F7;border:1px solid rgba(0,0,0,.05);border-radius:20px;padding:0;margin-bottom:10px;text-align:left;cursor:grab;overflow:hidden}
.odb-card.dragging{opacity:.45;cursor:grabbing}
.odb-hd{display:grid;grid-template-columns:12px minmax(0,1fr) auto;column-gap:8px;row-gap:8px;align-items:center;padding:16px 12px;cursor:pointer}
.odb-chev{grid-column:1;grid-row:1/3;align-self:center;flex:none;color:#929292;display:inline-flex;transition:transform .18s}
.odb-card.open .odb-chev{transform:rotate(180deg)}
.odb-t{grid-column:2/4;grid-row:1;min-width:0;font:500 12px Inter;color:#000000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.odb-mini{grid-column:2;grid-row:2;width:100%;min-width:0;height:8px;border-radius:4px;background:#FFFFFF;overflow:hidden}
.odb-mini-fill{display:block;height:100%;border-radius:4px;background:#4BD968}
.odb-frac{grid-column:3;grid-row:2;font:500 13px Inter;color:#929292;flex:none}
.odb-mid{max-height:0;overflow:hidden;transition:max-height .22s ease,padding .22s ease;padding:0 16px}
.odb-card:hover .odb-mid,.odb-card.open .odb-mid{max-height:150px;padding-bottom:10px}
.odb-asg-row{display:flex;align-items:center;gap:9px;padding:8px 0;font:500 12px Inter;color:#929292}
.odb-avs{display:flex;flex:none}
.odb-av{width:24px;height:24px;border-radius:999px;background:#E9E9EC;border:1px solid #D6D6DB;display:inline-flex;align-items:center;justify-content:center;font:600 9px Inter;color:#77777E;flex:none}
.odb-av+.odb-av{margin-left:-11px}
.odb-asg-row .when{margin-left:auto;display:inline-flex;gap:14px;align-items:center;white-space:nowrap}
.odb-asg-row .when .tm{font-weight:400}
.odb-panel{display:none;background:#FFFFFF;border:1px solid rgba(0,0,0,.10);border-radius:16px;margin:0 6px 6px;padding:8px 6px 8px}
.odb-card.open .odb-panel{display:block}
.odb-sub{display:flex;align-items:center;gap:12px;padding:14px 12px;font:400 13px Inter;color:#111111}
.odb-sub.todo{color:rgba(0,0,0,.35)}
.odb-sub .view{margin-left:auto;color:rgba(0,0,0,.3);font-size:12.5px;cursor:pointer}
.odb-sub-div{border-top:1px solid rgba(0,0,0,.1);margin:4px 12px}
.odb-addtask{display:block;width:calc(100% - 20px);margin:8px auto 2px;background:#0F0F0F;border:none;border-radius:16px;padding:15px;color:#929292;font:500 12px Inter;cursor:pointer;text-align:center}
.odb-addtask:hover{color:var(--sf-ink)}
.odb-col.over{border-color:#ffffff}
.odb-cnt{background:rgba(0,0,0,.07);color:#55555C}
/* night mode: cards go dark and dynamic — #0F0F0F surface, white text */
html[data-theme="dark"] .odb-card{background:#0F0F0F;border-color:rgba(255,255,255,.1);box-shadow:0 1px 3px rgba(0,0,0,.5)}
html[data-theme="dark"] .odb-t{color:#ffffff}
html[data-theme="dark"] .odb-mini{background:rgba(75,217,104,.05)}
html[data-theme="dark"] .odb-panel{background:#171717;border-color:#515151}
html[data-theme="dark"] .odb-sub{color:#ffffff}
html[data-theme="dark"] .odb-sub.todo{color:rgba(198,198,198,.35)}
html[data-theme="dark"] .odb-sub .view{color:rgba(255,255,255,.25)}
html[data-theme="dark"] .odb-sub-div{border-top-color:rgba(229,229,229,.25)}
html[data-theme="dark"] .odb-av{background:#313131;border-color:#5B5B5B;color:#929292}
html[data-theme="dark"] .odb-own{background:rgba(142,142,147,.09);color:#b0b0b8;box-shadow:inset 0 0 0 1px rgba(142,142,147,.4)}
html[data-theme="dark"] .odb-own.client{background:rgba(62,124,250,.16);color:#7FB5FF;box-shadow:inset 0 0 0 1px rgba(62,124,250,.45)}
html[data-theme="dark"] .odb-due{color:#a0a0a8}
html[data-theme="dark"] .odb-due.late{color:#FF6961}
html[data-theme="dark"] .odb-cat{color:#8f8f98}
html[data-theme="dark"] .odb-cnt{background:rgba(255,255,255,.1);color:#d0d0d5}
/* board as a full page: four columns in one row, sized to the viewport — the
PAGE never grows; each column's card list scrolls internally instead */
.odb-pagegrid{padding:0;overflow:visible;grid-template-columns:repeat(4,minmax(0,1fr));height:calc(100vh - 183px);min-height:340px}
@media(max-width:980px){.odb-pagegrid{grid-template-columns:repeat(2,minmax(0,1fr));height:auto}}
.odb-pagegrid .odb-col{min-height:0;overflow:hidden}
.odb-list{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none;margin:0 -4px;padding:0 4px}
.odb-list::-webkit-scrollbar{width:0;display:none}
.odb-pagegrid .odb-add{flex:none;margin-top:8px}
/* sticky column header inside the scroll area: solid fill fading to transparent
at the bottom (per the Rectangle 8 gradient) so cards fade out as they slide
underneath it — #F7F7F7 in day mode, #070707 at night */
.odb-pagegrid .odb-colh{position:sticky;top:0;z-index:3;margin:0 -4px;padding:6px 8px 20px;background:linear-gradient(180deg,#F7F7F7 0%,#F7F7F7 50%,rgba(247,247,247,0) 100%)}
html[data-theme="dark"] .odb-pagegrid .odb-colh{background:linear-gradient(180deg,#070707 0%,#070707 50%,rgba(7,7,7,0) 100%)}
/* the AI chat pill is in the way on the board — hide it here for now */
body[data-view="board"] .composer,body[data-view="tasks"] .composer{display:none!important}
/* board page: uniform 14px breathing room on all four sides, matching the
14px bar-to-columns gap and the 14px column gutters. Top padding is 7px
because the content wrapper already contributes 7px above the page. */
body[data-view="board"] .sf-page,body[data-view="tasks"] .sf-page{padding:7px 14px 14px}
/* board bar: pinned back-arrow cell + assignee filter cells in the scroll strip */
.odb-backcell{width:100%;height:100%;min-width:86px;border:0;background:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--sf-ink);transition:background .15s}
.odb-backcell:hover{background:var(--sf-hover)}
/* add-task popup: blurred transparent overlay + white panel hosting the REAL
AMBER chat (#chat + the global composer move in here while it's open) */
.odb-addov{position:fixed;inset:0;z-index:130;background:rgba(15,15,15,.22);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);display:flex;align-items:center;justify-content:center}
.odb-addpop{width:min(620px,92vw);height:min(560px,84vh);background:#ffffff;border-radius:20px;box-shadow:0 32px 80px rgba(0,0,0,.35);display:flex;flex-direction:column;overflow:hidden}
.odb-addpop .odb-chatwrap{flex:1 1 auto;min-height:0;overflow-y:auto;padding:20px 20px 6px;scrollbar-width:none}
.odb-addpop .odb-chatwrap::-webkit-scrollbar{width:0;display:none}
/* the board view hides the composer and dashboard views pin it fixed — inside
the popup it's a normal block at the bottom of the panel */
body[data-view="board"] .odb-addpop .composer,body[data-view="tasks"] .odb-addpop .composer{display:flex!important}
.odb-addpop .composer{position:static!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;opacity:1!important;padding:8px 14px 14px!important;z-index:1}
.odb-addpop .composer .pill{width:100%;max-width:none}
.odb-addpop .composer .acsug{display:none!important}
.odb-task-ok{margin-top:10px;display:inline-flex;align-items:center;gap:8px;background:rgba(52,199,89,.12);color:#1F7A33;font:650 12.5px Inter;padding:8px 12px;border-radius:10px}
/* right-pinned Done cell: mirrors the back-arrow pin on the other end of the bar */
.sf-metrics.od-metricsbar .od-pin.od-pin-r{border-right:0;border-left:1px solid var(--sf-border-2);display:flex;align-items:center;justify-content:center;padding:0 14px}
.od-pin-r .sf-btn{height:36px;padding:0 18px;white-space:nowrap;border-radius:10px}
.od-metricsbar .sf-metrics-scroll .odb-fcell{flex:1 0 250px;min-width:250px;max-width:320px;display:flex;align-items:center;gap:11px;padding:9px 18px;border:0;border-right:1px solid var(--sf-border-2);background:none;cursor:pointer;text-align:left;font-family:inherit;transition:background .15s;overflow:hidden}
.odb-fcell:hover{background:var(--sf-hover)}
.odb-fcell .av{width:34px;height:34px;border-radius:50%;background:var(--sf-hover);color:var(--sf-ink);display:inline-flex;align-items:center;justify-content:center;font:700 12px Inter;flex:none}
.odb-fcell .av.ai{background:rgba(236,72,153,.16);color:#b3246b;box-shadow:inset 0 0 0 1px rgba(236,72,153,.45)}
.odb-fcell .tx{flex:1;min-width:0;display:flex;flex-direction:column}
.odb-fcell .nm{font:650 13px Inter;color:var(--sf-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.odb-fcell .sub{font:500 11px Inter;color:var(--sf-dim);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.odb-fcell.on{background:var(--sf-hover)}
.odb-fcell.on .av{background:#111;color:#fff;box-shadow:none}
html[data-theme="dark"] .odb-fcell.on .av{background:#fff;color:#111}
.odb-add{border:1px dashed var(--sf-border);background:none;border-radius:12px;padding:11px;color:var(--sf-sub);font:600 12.5px Inter;cursor:pointer;width:100%;margin-top:auto}
.odb-add:hover{color:var(--sf-ink);border-color:var(--sf-dim)}
.odb-addinp{width:100%;box-sizing:border-box;margin-top:auto}
/* nav count widget: grey pill on the Orders nav item */
.sf-nav-item .sf-nav-count{margin-left:auto;background:var(--sf-hover);color:var(--sf-sub);font-size:11px;font-weight:700;border-radius:999px;padding:2px 8px;min-width:18px;text-align:center;line-height:1.4;flex:none}
body.sf-collapsed .sf-nav-item .sf-nav-count{display:none}
/* order detail header: breadcrumb + actions, sticky glass bar that follows scroll */
/* the content sheet's 20px top corners would clip the full-bleed sticky header
into a curve — square the sheet while an order is open */
body[data-view="order-detail"] .sf-content,body[data-view="board"] .sf-content,body[data-view="tasks"] .sf-content{border-top-left-radius:0;border-top-right-radius:0}
.od-head{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 22px;margin:-24px -22px 16px;border-radius:0;background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(22px) saturate(1.5);backdrop-filter:blur(22px) saturate(1.5);border:none;border-bottom:1px solid var(--sf-border-2)}
html[data-theme="dark"] .od-head{background:rgba(0,0,0,.96);border-color:rgba(255,255,255,.08)}
.od-head .sf-bc{margin:0}
.od-head-actions{display:flex;align-items:center;gap:9px;flex:none}
.od-more{position:relative}
.od-more .tb-cv{margin-left:2px}
.od-more-menu{position:absolute;top:calc(100% + 6px);right:0;z-index:50;min-width:200px;background:color-mix(in srgb,var(--sf-surface) 96%,transparent);border:1px solid var(--sf-border);border-radius:12px;padding:6px;color:var(--sf-ink);-webkit-backdrop-filter:blur(20px) saturate(1.35);backdrop-filter:blur(20px) saturate(1.35);box-shadow:0 14px 38px rgba(0,0,0,.16)}
.od-more-menu[hidden]{display:none}
.od-more-menu button{display:block;width:100%;text-align:left;background:transparent;border:0;color:inherit;font:550 13.5px Inter;padding:9px 11px;border-radius:8px;cursor:pointer}
.od-more-menu button:hover{background:var(--sf-hover)}
.od-more-menu button.danger{color:#d92d50}
html[data-theme="dark"] .od-more-menu{box-shadow:0 18px 48px rgba(0,0,0,.48)}
html[data-theme="dark"] .od-more-menu button.danger{color:#ff6a86}
/* Cancel-order confirm dialog + super-admin hold-to-ban zone */
.od-confirm-ov{position:fixed;inset:0;z-index:120;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center}
.od-confirm{width:min(320px,92vw);background:#0F0F0F;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:16px;color:#fff;box-shadow:0 24px 64px rgba(0,0,0,.5)}
.od-confirm h4{margin:0 0 5px;font:700 14.5px Inter}
.od-confirm p{margin:0;font-size:12.5px;color:#a0a0a8;line-height:1.45}
.od-confirm .acts{display:flex;gap:8px;margin-top:13px}
.od-confirm .acts .sf-btn{flex:1 1 0;padding:9px 13px;font-size:12.5px}
.od-confirm .admin{border-top:1px solid rgba(255,255,255,.1);margin:14px -16px 0;padding:12px 16px 0}
.od-confirm .zl{font:700 10.5px Inter;letter-spacing:.06em;color:#8f8f98}
.od-hold{position:relative;overflow:hidden;width:100%;margin-top:10px;border:1px solid rgba(255,59,48,.5);background:rgba(255,59,48,.09);color:#FF6961;font:650 12.5px Inter;border-radius:10px;padding:9px;cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:none}
.od-hold .fill{position:absolute;left:0;top:0;bottom:0;width:0%;background:rgba(255,59,48,.3)}
.od-hold span{position:relative}
/* Assignee avatars are neutral grey here — no colour needed (initials distinguish them) */
.sf-orders-index .sf-asg:not(.un) .av{background:#8E8E93 !important}
html[data-theme="dark"] .sf-orders-index .od-prog{background:#2f2f34}
/* Restrained Orders status palette: green = complete, red = exception, and
neutral gray = every in-between state. The list and detail view stay aligned. */
.sf-orders-index .sf-tag,body[data-view="order-detail"] .sf-tag{background:rgba(120,120,128,.14);color:#6b7177}
.sf-orders-index .sf-tag .dot,body[data-view="order-detail"] .sf-tag .dot{background:#8E8E93;opacity:1}
.sf-orders-index .sf-tag.success,body[data-view="order-detail"] .sf-tag.success{background:rgba(52,199,89,.17);color:#1E8A45}
.sf-orders-index .sf-tag.success .dot,body[data-view="order-detail"] .sf-tag.success .dot{background:#34C759}
.sf-orders-index .sf-tag.attention,body[data-view="order-detail"] .sf-tag.attention{background:rgba(120,120,128,.14);color:#6b7177}
.sf-orders-index .sf-tag.attention .dot,body[data-view="order-detail"] .sf-tag.attention .dot{background:#8E8E93}
.sf-orders-index .sf-tag.critical,body[data-view="order-detail"] .sf-tag.critical{background:rgba(255,59,48,.15);color:#C4362B}
.sf-orders-index .sf-tag.critical .dot,body[data-view="order-detail"] .sf-tag.critical .dot{background:#FF3B30}
.sf-orders-index .sf-tag.info,body[data-view="order-detail"] .sf-tag.info{background:rgba(120,120,128,.14);color:#6b7177}
.sf-orders-index .sf-tag.info .dot,body[data-view="order-detail"] .sf-tag.info .dot{background:#8E8E93}
html[data-theme="dark"] .sf-orders-index .sf-tag,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag{color:#a0a0a8}
html[data-theme="dark"] .sf-orders-index .sf-tag.success,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.success{color:#5DD97E}
html[data-theme="dark"] .sf-orders-index .sf-tag.attention,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.attention{color:#a0a0a8}
html[data-theme="dark"] .sf-orders-index .sf-tag.critical,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.critical{color:#FF6961}
/* Subscription = green tint; Refunded / Charge back = red tint (same layer style) */
.sf-orders-index .sf-tag.od-subpill,body[data-view="order-detail"] .sf-tag.od-subpill{background:rgba(52,199,89,.17);color:#1E8A45}
.sf-orders-index .sf-tag.od-subpill .dot,body[data-view="order-detail"] .sf-tag.od-subpill .dot{background:#34C759}
html[data-theme="dark"] .sf-orders-index .sf-tag.od-subpill,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.od-subpill{color:#5DD97E}
.sf-orders-index .sf-tag.od-redpill,body[data-view="order-detail"] .sf-tag.od-redpill{background:rgba(255,46,85,.16);color:#d61f43}
.sf-orders-index .sf-tag.od-redpill .dot,body[data-view="order-detail"] .sf-tag.od-redpill .dot{background:#FF2E55}
html[data-theme="dark"] .sf-orders-index .sf-tag.od-redpill,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.od-redpill{color:#ff6a86}
html[data-theme="dark"] .sf-orders-index .sf-tag.info,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.info{color:#a0a0a8}
/* Night mode only: bordered pill structure (tint + accent ring), matching the
Connect-account pill / account avatar treatment */
html[data-theme="dark"] .sf-orders-index .sf-tag,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag{background:rgba(120,120,128,.09);box-shadow:inset 0 0 0 1px rgba(142,142,147,.38)}
html[data-theme="dark"] .sf-orders-index .sf-tag.success,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.success,
html[data-theme="dark"] .sf-orders-index .sf-tag.od-subpill,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.od-subpill{background:rgba(52,199,89,.09);box-shadow:inset 0 0 0 1px rgba(52,199,89,.55)}
html[data-theme="dark"] .sf-orders-index .sf-tag.attention,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.attention{background:rgba(120,120,128,.09);box-shadow:inset 0 0 0 1px rgba(142,142,147,.38)}
html[data-theme="dark"] .sf-orders-index .sf-tag.critical,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.critical{background:rgba(255,59,48,.09);box-shadow:inset 0 0 0 1px rgba(255,59,48,.55)}
html[data-theme="dark"] .sf-orders-index .sf-tag.od-redpill,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.od-redpill{background:rgba(255,46,85,.09);box-shadow:inset 0 0 0 1px rgba(255,46,85,.55)}
html[data-theme="dark"] .sf-orders-index .sf-tag.info,html[data-theme="dark"] body[data-view="order-detail"] .sf-tag.info{background:rgba(120,120,128,.09);box-shadow:inset 0 0 0 1px rgba(142,142,147,.38)}
.sf-sheet .sf-metric .ml{font-size:13px;font-weight:500;color:var(--sf-ink);margin-bottom:0;line-height:1.2}
.sf-metric .mrule{width:44px;height:2px;border-radius:1px;background:#f6f6f6;margin:6px 0 8px}
html[data-theme="dark"] .sf-metric .mrule{background:#2c2c30}
.sf-metric .mnum{display:flex;align-items:center;gap:8px;white-space:nowrap;flex:none}
.sf-metric .mfoot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:0}
.sf-metric .mspark{flex:0 1 78px;min-width:0;height:18px;display:flex;align-items:center;overflow:hidden}
.sf-sheet .sf-metric{overflow:hidden}
.sf-sheet .sf-metric .mv{font-size:13px;font-weight:700;color:var(--sf-ink);line-height:1;letter-spacing:0}
.sf-metric .md2{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:500}
.sf-metric .md-arw{flex:none;overflow:visible}
.sf-metric .md-arw.dn{transform:scaleY(-1)}
.sf-sheet .sf-metric:not(.sf-rangecell){transition:background .12s}
.sf-sheet .sf-metric:hover{background:#F7F7F7}
html[data-theme="dark"] .sf-sheet .sf-metric:hover{background:#161618}
.sf-spark-cmp{stroke:#dadada}
html[data-theme="dark"] .sf-spark-cmp{stroke:#48484f}
html[data-theme="dark"] .sf-spark-cur{stroke:#e8e8ea !important}
/* Orders table: scroll sideways to reveal more columns, Order column frozen left */
/* Table scrolls within a bounded box so the column headers can stick to the top
when scrolling the order list down. The bottom chat bar hides at the list end. */
.sf-orders-index .sf-card{overflow-x:auto;overflow-y:auto;max-height:calc(100vh - 230px);overscroll-behavior:none;scrollbar-width:none;-ms-overflow-style:none}
.sf-orders-index .sf-table thead th{position:sticky;top:0;z-index:5;background:var(--sf-surface);border-bottom:0}
/* sticky header bottom line — a pseudo-element painted inside each header cell so it
never gets clipped by the scroll container and moves with the pinned header */
.sf-orders-index .sf-table thead th::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--sf-border);pointer-events:none}
html[data-theme="dark"] .sf-orders-index .sf-table thead th::before{background:#2f2f31}
.sf-orders-index .sf-card::-webkit-scrollbar{height:0;width:0;display:none}
.sf-orders-index .sf-table{min-width:1240px}
.sf-orders-index .sf-table th,.sf-orders-index .sf-table td{white-space:nowrap}
.sf-orders-index .sf-table th:first-child,.sf-orders-index .sf-table td:first-child{position:sticky;left:0;z-index:2;background:var(--sf-surface);min-width:112px}
.sf-orders-index .sf-table th:first-child{z-index:7}
/* vertical divider on the frozen column: a pseudo-element line painted inside the
pinned cell (renders above scrolling content, never clipped). Hidden when scrolled
fully left; appears only once scrolling starts, in the same colour as the table's
own dividers so it matches the design. */
.sf-orders-index .sf-table th:first-child::after,.sf-orders-index .sf-table td:first-child::after{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:transparent;pointer-events:none}
.sf-orders-index .sf-card.sc .sf-table th:first-child::after,.sf-orders-index .sf-card.sc .sf-table td:first-child::after{background:var(--sf-border-2)}
/* uniform hover across the whole row incl. the frozen cell (no two-tone) */
.sf-orders-index .sf-table tbody tr:hover td{background:#F7F7F7}
html[data-theme="dark"] .sf-orders-index .sf-table tbody tr:hover td{background:#161618}
/* hover moves as one — no per-cell transition, so the frozen Order column and the
rest of the row light up together instead of lagging behind the cursor */
.sf-orders-index .sf-table tbody tr.crow,.sf-orders-index .sf-table tbody tr.crow td{transition:none}
@keyframes sfSparkDrift{to{stroke-dashoffset:-12.2}}
.sf-spark-tail{animation:sfSparkDrift 1.5s linear infinite}
/* the current line ends in a drip — a dot that forms and falls, then repeats */
@keyframes sfSparkDrip{0%{opacity:0;transform:translateY(0)}18%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(7px)}}
.sf-spark-drip{transform-box:fill-box;transform-origin:center;animation:sfSparkDrip 1.7s ease-in infinite}
.sf-spark-drip.d2{animation-delay:.85s}
@media (prefers-reduced-motion:reduce){.sf-spark-tail,.sf-spark-drip{animation:none}}
html[data-theme="dark"] .sf-metric .mdots{background-image:radial-gradient(circle at center,#3c3c42 1.1px,transparent 1.7px)}
/* Range picker as the first metrics cell (Today / Last 7 days / Last 30 days) */
/* metrics scroll sideways when they don't all fit; picker fixed, metrics auto-flow */
/* Today pill (fixed) + horizontally-scrolling metric cards with fading edges */
.sf-sheet .sf-metrics,.sf-metrics.od-metricsbar{display:flex;align-items:stretch;grid-template-columns:none;overflow:hidden}
.sf-metrics.od-metricsbar{margin-bottom:0}
.sf-metrics.od-metricsbar .sf-metric{padding:9px 34px}
/* pinned Total cell: sits outside the scroll strip so it never moves */
.od-metricsbar .od-pin{flex:none;display:flex;align-items:stretch;position:relative;z-index:2;background:var(--sf-surface);border-right:1px solid var(--sf-border-2)}
.od-metricsbar .od-pin .sf-metric{border-right:none}
/* one order has no time series — no fake sparklines on the per-order bar */
.sf-metrics.od-metricsbar .mspark{display:none}
.sf-metrics-scroll{flex:1 1 auto;min-width:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior:none;scrollbar-width:none;-ms-overflow-style:none}
.sf-metrics-scroll::-webkit-scrollbar{width:0;height:0;display:none}
.sf-metrics-scroll>div{display:flex;align-items:stretch;min-width:100%}
.sf-metrics-scroll .sf-metric{flex:1 0 186px;min-width:186px}
/* edge fades: right shows when more is off to the right, left when scrolled */
.sf-metrics-scroll.fade-l.fade-r{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 42px,#000 calc(100% - 42px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 42px,#000 calc(100% - 42px),transparent 100%)}
.sf-metrics-scroll.fade-l:not(.fade-r){-webkit-mask-image:linear-gradient(to right,transparent 0,#000 42px);mask-image:linear-gradient(to right,transparent 0,#000 42px)}
.sf-metrics-scroll.fade-r:not(.fade-l){-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 42px),transparent 100%);mask-image:linear-gradient(to right,#000 calc(100% - 42px),transparent 100%)}
.sf-sheet .sf-metrics::-webkit-scrollbar{height:0;width:0;display:none}
/* while the comparison popup is open the bar must not clip it, and the whole
bar lifts above the toolbar/table so the popup paints on top */
.sf-metrics.menu-open,.sf-sheet .sf-metrics.menu-open{overflow:visible;position:relative;z-index:80}
/* overflow:visible un-clips the first cell — keep its left corners rounded */
.sf-metrics.menu-open .sf-rangecell{border-radius:var(--sf-radius) 0 0 var(--sf-radius)}
/* the picker cell inherits the metric cells' overflow:hidden — it must never
clip its own dropdown */
.sf-rangecell,.sf-sheet .sf-metric.sf-rangecell{overflow:visible}
/* Orders Columns organizer: grip to reorder, eye to show/hide */
.oc-cols{position:relative;display:flex;align-items:center;flex:none}
.oc-colsbtn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-sub);cursor:pointer}
.oc-colsbtn:hover{background:var(--sf-hover)}
.oc-colsbtn svg{width:17px;height:17px}
.oc-menu{position:absolute;right:0;top:44px;min-width:238px;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.16);padding:8px;z-index:70;display:none;isolation:isolate}
html[data-theme="dark"] .oc-menu{background:#0F0F0F;border-color:rgba(255,255,255,.12);box-shadow:0 14px 40px rgba(0,0,0,.45)}
.oc-cols.open .oc-menu{display:block}
.oc-menu.oc-drag-portal{display:block;position:fixed;right:auto;z-index:1000}
.oc-h{font:600 11.5px Inter;color:var(--sf-dim);padding:4px 8px 8px}
.oc-list{position:relative;max-height:min(62vh,560px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;padding:2px;margin:-2px;scroll-behavior:auto}
.oc-list::-webkit-scrollbar{display:none}
.oc-opt{display:flex;align-items:center;gap:10px;width:100%;min-height:38px;padding:7px 8px;border:1px solid transparent;border-radius:9px;font:550 13px Inter;color:var(--sf-ink);user-select:none;-webkit-user-select:none;transform-origin:center;will-change:transform;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,opacity .16s ease}
.oc-opt:hover{background:var(--sf-hover)}
.oc-opt.dragging{opacity:.14;background:var(--sf-hover);border-color:var(--sf-border)}
.oc-opt.oc-near{background:color-mix(in srgb,var(--sf-hover) 72%,transparent)}
.oc-opt:not(.on) .oc-lbl{color:var(--sf-dim)}
.oc-grip{color:var(--sf-dim);cursor:grab;display:inline-flex;touch-action:none}
.oc-lbl{flex:1;min-width:0}
.oc-eye{margin-left:auto;border:0;background:none;color:var(--sf-sub);cursor:pointer;display:inline-flex;padding:2px}
.oc-eye:hover{color:var(--sf-ink)}
.oc-eye svg{width:16px;height:16px}
.oc-drag-shade{position:fixed;inset:0;z-index:998;background:rgba(10,10,14,.16);opacity:0;pointer-events:none;animation:ocShadeIn .18s ease forwards}
.oc-drag-ghost{position:fixed;z-index:1001;display:flex;align-items:center;gap:10px;margin:0;padding:7px 8px;overflow:hidden;border:1px solid rgba(255,255,255,.56);border-radius:11px;background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.035));color:var(--sf-ink);font:600 13px Inter;pointer-events:none;transform:translate3d(0,0,0) scale(1.035);transform-origin:center;box-shadow:0 28px 68px rgba(13,18,32,.3),0 10px 24px rgba(13,18,32,.18),0 0 0 1px rgba(255,255,255,.18),inset 0 1px 0 rgba(255,255,255,.66),inset 0 -1px 0 rgba(255,255,255,.1);-webkit-backdrop-filter:blur(1.25px) saturate(1.08) contrast(1.02);backdrop-filter:blur(1.25px) saturate(1.08) contrast(1.02);will-change:top,left,transform,opacity;animation:ocLiftIn .2s cubic-bezier(.2,.9,.25,1) both}
.oc-drag-ghost:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(118deg,rgba(255,255,255,.2),rgba(255,255,255,.015) 42%,rgba(122,180,255,.035) 72%,rgba(255,255,255,.08));pointer-events:none}
.oc-drag-ghost:after{content:"";position:absolute;z-index:1;inset:1px;border-radius:9px;pointer-events:none;box-shadow:inset 1.5px 0 rgba(255,92,92,.16),inset -1.5px 0 rgba(70,145,255,.2),inset 0 1px rgba(255,255,255,.38),inset 0 -1px rgba(255,255,255,.08);mix-blend-mode:screen}
.oc-drag-ghost>*{position:relative;z-index:1}
html[data-theme="dark"] .oc-drag-ghost{border-color:rgba(255,255,255,.18);background:linear-gradient(135deg,rgba(46,46,52,.16),rgba(20,20,24,.04));box-shadow:0 30px 74px rgba(0,0,0,.58),0 12px 28px rgba(0,0,0,.4),0 0 0 1px rgba(255,255,255,.06),inset 0 1px 0 rgba(255,255,255,.18)}
.oc-drag-ghost.oc-returning{animation:none;-webkit-backdrop-filter:blur(0) saturate(1);backdrop-filter:blur(0) saturate(1);background:var(--sf-surface);border-color:transparent;box-shadow:0 2px 7px rgba(0,0,0,.05)}
.oc-drag-ghost.oc-returning:before,.oc-drag-ghost.oc-returning:after{opacity:0;transition:opacity .2s ease}
.oc-opt.oc-solidifying{animation:ocSolidify .26s cubic-bezier(.2,.9,.25,1) both}
.oc-drag-ghost .oc-grip{cursor:grabbing}
.oc-drag-ghost .oc-eye{pointer-events:none}
body.oc-drag-active{cursor:grabbing!important}
body.oc-drag-active *{cursor:grabbing!important}
body.oc-drag-active .oc-cols.open{z-index:1000}
body.oc-drag-active .oc-menu{z-index:1000;box-shadow:0 26px 70px rgba(0,0,0,.28)}
@keyframes ocShadeIn{to{opacity:1}}
@keyframes ocLiftIn{from{opacity:.16;transform:translate3d(0,2px,0) scale(.985)}to{opacity:1;transform:translate3d(0,0,0) scale(1.035)}}
@keyframes ocSolidify{from{opacity:.18;transform:scale(.985);background:color-mix(in srgb,var(--sf-surface) 45%,transparent);box-shadow:0 12px 30px rgba(0,0,0,.12)}to{opacity:1;transform:scale(1);background:transparent;box-shadow:none}}
@media(prefers-reduced-motion:reduce){.oc-opt,.oc-drag-shade,.oc-drag-ghost{animation:none!important;transition:none!important}}
.sf-rangecell{position:relative;flex:none;display:flex;align-items:center;background:var(--sf-surface)}
.sf-rangebtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;background:transparent;box-shadow:none;border:1px solid transparent;border-radius:11px;padding:9px 12px;font-size:13.5px;font-weight:600;color:var(--sf-ink);cursor:pointer;font-family:inherit}
.sf-rangebtn:hover{background:transparent}
.sf-rangebtn>svg{width:16px;height:16px;flex:none;color:var(--sf-sub)}
.sf-rangebtn .rb-cv{display:none}
.sf-rangecell.open .sf-rangebtn .rb-cv{transform:rotate(180deg)}
.sf-rangecell.open .sf-rangebtn{border-color:transparent}
/* comparison popup: black glass, white text (both themes) */
/* compact + theme-dynamic: white on light, solid #0F0F0F on dark */
.sf-rangemenu{position:absolute;top:calc(100% + 6px);left:6px;z-index:60;min-width:236px;background:#ffffff;border:1px solid rgba(0,0,0,.09);border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.18);padding:5px;display:none}
.sf-rangecell.open .sf-rangemenu{display:block}
html[data-theme="dark"] .sf-rangemenu{background:#0F0F0F;border-color:rgba(255,255,255,.12);box-shadow:0 18px 48px rgba(0,0,0,.5)}
html[data-theme="dark"] .sf-rangemenu .sf-rangeopt:hover{background:rgba(255,255,255,.08)}
html[data-theme="dark"] .sf-rangemenu .ro-rad{border-color:rgba(255,255,255,.3)}
html[data-theme="dark"] .sf-rangemenu .sf-rangeopt.on .ro-rad{border-color:#ffffff}
html[data-theme="dark"] .sf-rangemenu .sf-rangeopt.on .ro-rad:after{background:#ffffff}
.sf-rangeopt{display:flex;align-items:flex-start;gap:9px;width:100%;text-align:left;background:none;border:0;border-radius:9px;padding:7px 9px;cursor:pointer;font-family:inherit}
.sf-rangeopt:hover{background:var(--sf-hover)}
.sf-rangeopt .ro-rad{width:16px;height:16px;border-radius:999px;border:2px solid var(--sf-border-2);flex:none;margin-top:1px;position:relative}
.sf-rangeopt.on .ro-rad{border-color:var(--sf-ink)}
.sf-rangeopt.on .ro-rad:after{content:"";position:absolute;inset:3px;border-radius:999px;background:var(--sf-ink)}
.sf-rangeopt .ro-tx{display:flex;flex-direction:column;gap:1px}
.sf-rangeopt .ro-t{font-size:13px;font-weight:600;color:var(--sf-ink)}
.sf-rangeopt .ro-s{font-size:11.5px;color:var(--sf-sub);line-height:1.3}
html[data-theme="dark"] .sf-rangebtn:hover{background:transparent}
.sf-sheet .sf-toolbar{margin:0 0 14px}
.sf-orders-index .sf-toolbar .sf-search-sm{max-width:none}
.sf-orders-index .sf-search-sm .sf-search-inp{flex:1;min-width:0;border:0;background:transparent;outline:none;font:inherit;font-size:13px;color:var(--sf-ink);padding:0}
.sf-orders-index .sf-search-sm .sf-search-inp::placeholder{color:var(--sf-dim)}
/* Type filter dropdown (replaces the tabs row) */
.sf-typedrop{position:relative;display:inline-flex;flex:none}
.sf-typebtn{display:inline-flex;align-items:center;gap:8px;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:10px;padding:8px 13px;font-size:13.5px;font-weight:600;color:var(--sf-ink);cursor:pointer;font-family:inherit;white-space:nowrap}
.sf-typebtn .tb-ct{color:var(--sf-sub);font-weight:600}
.sf-typebtn .tb-cv{margin-left:1px;transition:transform .15s}
.sf-typedrop.open .sf-typebtn{border-color:var(--sf-dim)}
.sf-typedrop.open .sf-typebtn .tb-cv{transform:rotate(180deg)}
.sf-typemenu{position:absolute;top:calc(100% + 6px);left:0;z-index:60;min-width:210px;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:12px;box-shadow:0 14px 34px rgba(0,0,0,.14);padding:6px;display:none}
.sf-typedrop.open .sf-typemenu{display:block}
.sf-typeopt{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;text-align:left;background:none;border:0;border-radius:8px;padding:9px 11px;font-size:13.5px;font-weight:550;color:var(--sf-ink);cursor:pointer;font-family:inherit}
.sf-typeopt:hover{background:var(--sf-bg)}
.sf-typeopt.on{font-weight:700}
.sf-typeopt .ct{color:var(--sf-sub);font-weight:600;font-size:12.5px}
.sf-sheet .sf-card{border:1px solid var(--sf-border);border-radius:12px;box-shadow:none;background:var(--sf-surface)}
/* Animated diagonal dashes for the in-progress stage segment (green tint). */
.od-stripe{background:repeating-linear-gradient(45deg,rgba(130,238,161,.25) 0 7px,rgba(75,217,104,.05) 7px 14px);animation:od-barber .7s linear infinite}
@keyframes od-barber{from{background-position:0 0}to{background-position:19.8px 0}}
@media(prefers-reduced-motion:reduce){.od-stripe{animation:none}}
/* Collapsible per-stage groups in the What's-left checklist. */
/* Stage card — materials taken from the provided SVG: #F7F7F7 header, 20px
radius, white-track green bar, #929292 text/chevron, white inner task card. */
.od-stage-card.sf-card{padding:0;border:none;background:#f7f7f7;box-shadow:none;overflow:hidden;border-radius:20px}
:root[data-theme="dark"] .od-stage-card.sf-card{background:#1e1e22}
.od-stage-hd{display:flex;align-items:center;gap:12px;width:100%;background:none;border:none;padding:16px 20px;cursor:pointer;font:600 14px/1 Inter;color:var(--sf-ink);text-align:left}
.od-stage-name{flex:none}
.od-chev{display:inline-flex;color:#929292;transition:transform .2s ease;flex:none}
.od-stage-card:not(.collapsed) .od-chev{transform:rotate(180deg)}
.od-mini{width:96px;height:8px;border-radius:4px;background:#fff;overflow:hidden;flex:none;margin-left:auto}
:root[data-theme="dark"] .od-mini{background:#2c2c30}
.od-mini-fill{display:block;height:100%;border-radius:4px;background:#4bd968}
.od-stage-frac{font-size:14px;color:#929292;font-weight:500;font-variant-numeric:tabular-nums;flex:none;min-width:28px;text-align:right}
.od-stage-card.collapsed .od-stage-body{display:none}
.od-stage-body{background:var(--sf-surface);border:1px solid #eee;border-radius:16px;margin:0 6px 6px;padding:2px 18px 4px}
:root[data-theme="dark"] .od-stage-body{border-color:var(--sf-border)}
.od-task{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--sf-border)}
.od-task:last-child{border-bottom:none}
.od-subs{padding:2px 0 2px 32px}
.od-subtask{display:flex;align-items:center;gap:11px;padding:8px 0}
.od-subtask span{color:var(--sf-ink)}
.od-spin{transform-origin:center}
/* No focus ring / blue border on any element, anywhere. */
:focus{outline:none !important}
:focus-visible{outline:none !important}
.sf-metric .ml{font-size:12.5px;color:var(--sf-sub);margin-bottom:6px}
.sf-metric .mv{font-size:19px;font-weight:700;letter-spacing:-.01em}
/* card */
.sf-card{border:1px solid var(--sf-border);border-radius:var(--sf-radius);background:var(--sf-surface);
box-shadow:0 1px 0 rgba(0,0,0,.04);overflow:hidden}
.sf-card-h{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--sf-border-2)}
.sf-card-h h3{font-size:14px;font-weight:650;margin:0;flex:1}
/* website channel — shopify Online-Store style */
/* Keep the Site health ribbon on the same compact vertical rhythm as the
Orders metrics row: 9px cell padding, 13px labels/values and 18px charts. */
.ws-vitals{display:flex;align-items:stretch;padding:0;margin-bottom:18px;overflow:hidden}
.ws-vitals .wv-period{display:flex;align-items:center;gap:8px;padding:0 18px;font-weight:600;font-size:13px;color:var(--sf-ink);border-right:1px solid var(--sf-border-2);white-space:nowrap}
.ws-vitals .wv-period svg{width:16px;height:16px;opacity:.7}
.ws-vitals .wv-m{flex:1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 18px;border-right:1px solid var(--sf-border-2);min-width:0}
.ws-vitals .wv-main{min-width:0}
.ws-vitals .wv-m:last-child{border-right:none}
.ws-vitals .wv-l{font-size:13px;font-weight:500;color:var(--sf-ink);margin-bottom:6px;line-height:1.2}
.ws-vitals .wv-row{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
.ws-vitals .wv-v{font-size:13px;font-weight:700;line-height:1;white-space:nowrap}
.ws-vitals .wv-d{font-size:10px;color:var(--sf-sub);font-weight:500;white-space:nowrap}
.ws-vitals .wv-d.up{color:#1aa05a}
/* compact gradient sparkline to the SIDE of the value — transparent bg */
.ws-vitals .wv-spark{display:block;width:58px;height:18px;flex:none;overflow:visible}
/* live-now cell: pulsing green dot = people viewing right now */
.ws-vitals .wv-live .wv-pulse{width:8px;height:8px;border-radius:50%;background:#1aa05a;flex:none;box-shadow:0 0 0 0 rgba(26,160,90,.5);animation:wvPulse 1.8s infinite}
@keyframes wvPulse{0%{box-shadow:0 0 0 0 rgba(26,160,90,.5)}70%{box-shadow:0 0 0 7px rgba(26,160,90,0)}100%{box-shadow:0 0 0 0 rgba(26,160,90,0)}}
/* Site is a viewport dashboard, not a document. Lock the outer surface and
let the preview card consume the remaining height so wheel/trackpad input
never creates an up/down page scroll or clips the controls below it. */
body.shopify[data-view="website"] .sf-content{overflow-y:hidden}
body.shopify[data-view="website"] .sf-page{width:100%;max-width:none;height:100%;padding-bottom:24px;display:flex;flex-direction:column}
body.shopify[data-view="website"] .sf-page>.sf-head,
body.shopify[data-view="website"] .sf-page>.ws-vitals{flex:none}
body.shopify[data-view="website"] .sf-page>.sf-card:last-child{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
body.shopify[data-view="website"] .sf-page>.sf-card:last-child .ws-stage{height:auto;min-height:0;flex:1 1 auto}
body.shopify[data-view="website"] .sf-page>.sf-card:last-child .ws-themebar{flex:none}
.ws-wrap{width:100%;max-width:none;margin:0}
.ws-stage{position:relative;background:#f1f1f3;height:412px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;gap:34px;padding:36px 40px 0}
.ws-shot{position:relative;overflow:hidden;background:#fff}
.ws-shot iframe{position:absolute;top:0;left:0;border:0;pointer-events:none;transform-origin:top left;background:#fff}
/* desktop: framed browser window crop */
.ws-desktop{flex:none;width:62%;max-width:720px;height:100%;min-width:0;display:flex;flex-direction:column;border-radius:12px 12px 0 0;box-shadow:0 16px 44px rgba(0,0,0,.20);border:1px solid rgba(0,0,0,.10);border-bottom:none}
.ws-desktop .ws-chrome{flex:none;height:32px;background:#ececf0;display:flex;align-items:center;gap:7px;padding:0 14px;border-bottom:1px solid rgba(0,0,0,.06)}
.ws-desktop .ws-chrome i{width:11px;height:11px;border-radius:50%;background:#d2d2da;display:block}
.ws-desktop .ws-vp{position:relative;flex:1;overflow:hidden;background:#fff}
/* mobile: framed phone crop */
.ws-mobile{width:230px;height:86%;flex:none;border-radius:24px 24px 0 0;box-shadow:0 14px 40px rgba(0,0,0,.16);border:1px solid rgba(0,0,0,.08);border-bottom:none}
/* snapshot guard: an invisible blocker so the preview can never be clicked/scrolled */
.ws-stage::after{content:"";position:absolute;inset:0;z-index:2;cursor:default}
.ws-themebar{display:flex;align-items:flex-start;gap:16px;padding:16px 18px}
.ws-themebar .wt-left{flex:1;min-width:0}
.ws-themebar .wt-name{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700}
.ws-themebar .wt-added{font-size:12.5px;color:var(--sf-sub);margin-top:6px}
.ws-themebar .wt-ver{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--sf-ink);margin-top:8px}
.ws-themebar .wt-ver .vd{width:8px;height:8px;border-radius:50%;background:#2c6ecb;flex:none}
.ws-themebar .wt-right{display:flex;align-items:center;gap:8px;flex:none}
.ws-dots{padding:6px 12px;font-size:17px;line-height:1;font-weight:700}
.ws-morewrap{position:relative}
.ws-morewrap .sf-menu{min-width:232px;padding:6px}
.ws-morewrap .sf-menu button{padding:10px 12px;font-size:14px;gap:13px}
.ws-morewrap .sf-menu button svg{width:18px;height:18px;flex:none;opacity:.85}
.ws-morewrap .sf-menu .sep{height:1px;background:var(--sf-border-2);margin:6px 6px}
.ws-domain-modal .pk{width:min(94vw,680px);max-height:82vh}
.ws-domain-body{padding:18px;overflow:auto}
.ws-domain-copy{font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--sf-ink);background:none;border:0;padding:0;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.ws-domain-grid{display:grid;grid-template-columns:84px 64px minmax(0,1fr) 84px;gap:10px;align-items:center}
.ws-domain-head{padding:9px 10px;color:var(--sf-sub);font-size:10px;font-weight:650;text-transform:uppercase;letter-spacing:.05em}
.ws-domain-row{padding:11px 10px;border-top:1px solid var(--sf-border-2);font-size:12px}
.ws-domain-records{border:1px solid var(--sf-border);border-radius:10px;overflow:hidden;margin-top:16px}
.ws-domain-state{display:inline-flex;align-items:center;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:650;background:var(--tag-neutral-bg);color:var(--tag-neutral-fg)}
.ws-domain-state.live{background:var(--tag-success-bg);color:var(--tag-success-fg)}
.ws-domain-state.pending{background:#fff4d6;color:#855c00}
:root[data-theme="dark"] .ws-domain-state.pending{background:#3a2f17;color:#f0c96b}
.ws-domain-actions{display:flex;align-items:center;gap:8px;margin-top:14px}
.ws-domain-help{font-size:12px;line-height:1.55;color:var(--sf-sub);margin-top:12px}
/* table */
.sf-table{width:100%;border-collapse:collapse;font-size:13.5px}
.sf-table th{text-align:left;font-weight:600;color:var(--sf-sub);font-size:12.5px;padding:10px 16px;
border-bottom:1px solid var(--sf-border-2);white-space:nowrap}
.sf-table td{padding:12px 16px;border-bottom:1px solid var(--sf-border-2);color:var(--sf-ink);vertical-align:middle}
.sf-table tr:last-child td{border-bottom:none}
.sf-table tbody tr:hover{background:var(--sf-hover)}
.sf-table .num{text-align:right;font-variant-numeric:tabular-nums}
.sf-mut{color:var(--sf-sub)}
/* Pending-approval queue (Customers view) */
.sf-appr-card{border:1px solid var(--sf-border);border-radius:14px;background:var(--sf-card);padding:6px 4px;margin:0 0 18px}
.sf-appr-head{display:flex;align-items:center;gap:8px;padding:10px 14px 8px;font-size:13px;font-weight:600;color:var(--sf-text)}
.sf-appr-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--sf-accent,#3b82f6);color:#fff;font-size:11px;font-weight:600}
.sf-appr-row{display:flex;align-items:center;gap:12px;padding:11px 14px;border-top:1px solid var(--sf-border)}
.sf-appr-main{min-width:0;flex:1}
.sf-appr-name{font-size:14px;font-weight:500;color:var(--sf-text)}
.sf-appr-sub{font-size:12.5px;color:var(--sf-sub);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px}
.sf-appr-btn{flex:none;height:32px;padding:0 16px;border-radius:999px;border:0;background:var(--sf-text);color:var(--sf-card);font-size:13px;font-weight:600;cursor:pointer;transition:opacity .15s}
.sf-appr-btn:hover{opacity:.88}
.sf-appr-btn:disabled{opacity:.5;cursor:default}
/* badge */
.sf-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 11px;border-radius:999px;font-size:12px;
font-weight:600;white-space:nowrap;background:var(--tag-neutral-bg);color:var(--tag-neutral-fg)}
.sf-tag.success{background:var(--tag-success-bg);color:var(--tag-success-fg)}
.sf-tag.attention{background:var(--tag-attention-bg);color:var(--tag-attention-fg)}
.sf-tag.critical{background:var(--tag-critical-bg);color:var(--tag-critical-fg)}
.sf-tag.info{background:var(--tag-info-bg);color:var(--tag-info-fg)}
.sf-tag .dot{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.85}
/* agency order columns: tier / assignee / next action / age */
.sf-tier{display:inline-flex;align-items:center;height:21px;padding:0 9px;border:1px solid var(--sf-border);
border-radius:8px;font-size:12px;font-weight:600;color:var(--sf-sub);background:var(--sf-hover);white-space:nowrap}
.sf-asg{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--sf-ink);white-space:nowrap}
.sf-asg .av{width:21px;height:21px;border-radius:50%;display:flex;align-items:center;justify-content:center;
font-size:10px;font-weight:700;color:#fff;flex:none}
.sf-asg.un{color:var(--sf-dim)}
.sf-asg.un .av{background:none;border:1px dashed var(--sf-dim)}
.sf-next{color:var(--sf-ink)}
.sf-age-amber{color:var(--tag-attention-fg);font-weight:650}
.sf-age-red{color:var(--tag-critical-fg);font-weight:650}
/* empty state */
.sf-empty{text-align:center;padding:54px 24px;max-width:440px;margin:0 auto}
.sf-empty .ei{width:54px;height:54px;border-radius:14px;background:var(--sf-hover);display:flex;align-items:center;
justify-content:center;margin:0 auto 16px;color:var(--sf-sub)}
.sf-empty .ei svg{width:26px;height:26px;fill:currentColor;stroke:none}
.sf-empty h2{font-size:16px;font-weight:650;margin:0 0 6px}
.sf-empty p{font-size:13.5px;color:var(--sf-sub);margin:0 0 18px;line-height:1.5}
.sf-load{color:var(--sf-dim);font-size:13.5px;padding:30px 4px;text-align:center}
.sf-note{font-size:12px;color:var(--sf-dim);margin-top:14px;text-align:center}
/* ---- populated flows: insight strip, filter toolbar, metric deltas, chips ---- */
.sf-insight{display:flex;align-items:center;gap:13px;padding:13px 16px;margin-bottom:18px;border:1px solid var(--sf-border);
border-radius:var(--sf-radius);background:linear-gradient(180deg,#fbfbfd,#f5f6f9);box-shadow:0 1px 0 rgba(0,0,0,.03)}
.sf-insight .si-ic{width:30px;height:30px;flex:none;border-radius:10px;background:#303030;color:#fff;display:flex;align-items:center;justify-content:center}
.sf-insight .si-ic svg{width:16px;height:16px;fill:currentColor;stroke:none}
.sf-insight .si-tx{flex:1;font-size:13.5px;color:var(--sf-ink);line-height:1.45}
.sf-insight .si-tx b{font-weight:650}
.sf-metric .md{font-size:12px;font-weight:600;margin-top:4px;display:flex;align-items:center;gap:3px}
.sf-metric .md.up{color:#0c5132}.sf-metric .md.down{color:#8e1f0b}.sf-metric .md.flat{color:var(--sf-dim)}
.sf-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:13px;flex-wrap:wrap}
.sf-tabs{display:flex;align-items:center;gap:3px;background:rgba(127,127,127,.14);border:1px solid var(--sf-border);border-radius:10px;padding:3px}
.sf-tab{border:none;background:none;font:600 13px Inter;color:var(--sf-sub);padding:5px 11px;border-radius:8px;cursor:pointer;white-space:nowrap}
.sf-tab:hover{color:var(--sf-ink)}
.sf-tab.on{background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 1px 2px rgba(0,0,0,.1)}
.sf-tab .ct{margin-left:5px;color:var(--sf-dim);font-weight:600}
.svc-collection-grid{display:flex;flex-direction:column;gap:0;margin-top:12px;padding:5px;border:1px solid var(--sf-border);border-radius:16px;background:var(--sf-surface);overflow:hidden}
.svc-collection-card{width:100%;min-height:78px;padding:13px 18px;border:0;border-radius:12px;background:transparent;color:var(--sf-ink);display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,auto) 20px;align-items:center;gap:18px;text-align:left;cursor:pointer;transition:background-color .16s ease}
.svc-collection-card:hover{background:var(--sf-hover)}
.svc-collection-card:focus-visible{outline:2px solid var(--sf-ink);outline-offset:-3px}
.svc-collection-copy,.svc-collection-meta{display:flex;flex-direction:column;min-width:0}
.svc-collection-copy{transition:transform .16s ease}
.svc-collection-card:hover .svc-collection-copy{transform:translateX(4px)}
.svc-collection-copy strong{font-size:16px;line-height:1.3;letter-spacing:-.015em}
.svc-collection-copy small,.svc-collection-meta small{margin-top:3px;color:var(--sf-dim);font-size:12px;line-height:1.35}
.svc-collection-meta{text-align:right;align-items:flex-end}
.svc-collection-meta strong{margin-top:4px;font-size:15px;line-height:1.2}
.svc-collection-arrow{width:20px;height:20px;color:var(--sf-dim);transition:transform .16s ease,color .16s ease}
.svc-collection-card:hover .svc-collection-arrow{transform:translateX(2px);color:var(--sf-ink)}
.svc-collection-card.review{background:color-mix(in srgb,var(--sf-hover) 72%,#f4b740 28%)}
.sf-head:has(.svc-head-search){align-items:center}
#sf-page:has(.svc-head-search){container-type:inline-size}
.sf-content:has(#sf-page > .svc-collection-grid){overflow-y:hidden}
#sf-page:has(> .svc-collection-grid){height:100%;min-height:0;padding-bottom:24px;display:flex;flex-direction:column}
#sf-page:has(> .svc-collection-grid) > .sf-head{position:sticky;top:0;z-index:5;flex:none;margin-bottom:16px;background:transparent}
#sf-page:has(> .svc-collection-grid) > .svc-collection-grid{flex:1 1 auto;min-height:0;margin-top:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
#sf-page:has(> .svc-collection-grid) > .svc-collection-grid::-webkit-scrollbar{width:0;height:0}
.sf-head:has(.svc-head-search) h1{font-size:28px;line-height:1.15;letter-spacing:-.025em}
.sf-head:has(.svc-head-search) .sf-actions{align-items:center;justify-content:flex-end;flex-wrap:wrap}
.sf-head:has(.svc-head-search) .sf-actions .sf-btn{box-shadow:none}
.svc-head-search{width:clamp(420px,30vw,620px);height:32px;padding:0 10px;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);display:flex;align-items:center;gap:7px;color:var(--sf-dim);transition:border-color .15s ease,box-shadow .15s ease}
.svc-head-search:focus-within{border-color:var(--sf-border);box-shadow:none}
.svc-head-search svg{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8}
.svc-head-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--sf-ink);font:500 13px Inter}
.svc-head-search input::placeholder{color:var(--sf-dim)}
@container (max-width:1200px){.sf-head:has(.svc-head-search){align-items:flex-start;flex-wrap:wrap;row-gap:12px}.sf-head:has(.svc-head-search) .sf-actions{width:100%;justify-content:flex-start}.svc-head-search{flex:1;min-width:220px}}
@media(max-width:1050px){.sf-head:has(.svc-head-search){align-items:flex-start;flex-wrap:wrap}.sf-head:has(.svc-head-search) .sf-actions{width:100%;justify-content:flex-start}.svc-head-search{flex:1;min-width:220px}}
@media(max-width:700px){.sf-head:has(.svc-head-search) h1{font-size:24px}.svc-collection-grid{padding:4px;border-radius:14px}.svc-collection-card{min-height:72px;padding:12px 14px;grid-template-columns:minmax(0,1fr) 20px;gap:10px}.svc-collection-meta{display:none}.svc-collection-copy strong{font-size:15px}}
.svc-collection-summary{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin:2px 0 20px;padding:18px;border:1px solid var(--sf-border);border-radius:14px;background:var(--sf-surface)}
.svc-collection-summary h2{margin:0 0 5px;font-size:19px;letter-spacing:-.02em}.svc-collection-summary p{margin:0;color:var(--sf-sub);font-size:13px;line-height:1.5}
.svc-seo-preview{margin-bottom:18px;padding:16px;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-bg)}
.svc-seo-preview strong,.svc-seo-preview span,.svc-seo-preview p{display:block;overflow-wrap:anywhere}
.svc-seo-preview strong{color:#3569b7;font-size:16px;font-weight:550;line-height:1.3}.svc-seo-preview span{margin-top:4px;color:var(--sf-sub);font-size:11.5px}.svc-seo-preview p{margin:6px 0 0;color:var(--sf-sub);font-size:12px;line-height:1.45}
.svc-seo-field{margin-top:14px}.svc-seo-field:first-of-type{margin-top:0}.svc-seo-line{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}.svc-seo-line .sf-flabel{margin:0}.svc-seo-count{color:var(--sf-dim);font-size:11px;font-variant-numeric:tabular-nums}
.svc-seo-handle{display:flex;align-items:center;min-height:38px;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);overflow:hidden}.svc-seo-handle span{flex:none;padding-left:10px;color:var(--sf-dim);font-size:12px}.svc-seo-handle input{min-width:0;flex:1;height:36px;padding:0 10px 0 2px;border:0;outline:0;background:transparent;color:var(--sf-ink);font-size:13px}
.svc-seo-index{display:flex;align-items:flex-start;gap:9px;margin-top:16px;color:var(--sf-ink);font-size:12.5px;line-height:1.4;cursor:pointer}.svc-seo-index input{width:16px;height:16px;margin-top:1px;accent-color:var(--sf-fill);flex:none}
#sf-page:has(#cl-save) .sf-field{color:var(--sf-ink)}
html[data-theme="dark"] #sf-page:has(#cl-save) select.sf-field{color:#fff;color-scheme:dark}
#sf-page:has(#cl-save) .sf-field:focus,#sf-page:has(#cl-save) .svc-seo-handle:focus-within{border-color:#fff}
.svc-kind{display:inline-flex;align-items:center;padding:3px 8px;border:1px solid var(--sf-border);border-radius:999px;color:var(--sf-sub);font-size:11px;font-weight:700;text-transform:capitalize}
.sf-search-sm{flex:1;min-width:150px;max-width:320px;display:flex;align-items:center;gap:7px;height:32px;
background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:8px;padding:0 10px;color:var(--sf-dim);font-size:13px}
.sf-search-sm svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.8;fill:none}
.sf-sample{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--sf-sub);
background:var(--sf-hover);border:1px solid var(--sf-border);border-radius:8px;padding:3px 9px}
/* filter-dropdown bar (Orders) */
.sf-fbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-2px 0 13px}
.sf-flabel{font-size:12.5px;color:var(--sf-dim);font-weight:600;margin-right:1px}
.sf-fdrop{position:relative}
.sf-fchip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border:1px solid var(--sf-border);
background:var(--sf-surface);border-radius:8px;font:600 12.5px Inter;color:var(--sf-sub);cursor:pointer;white-space:nowrap}
.sf-fchip:hover{background:var(--sf-hover);color:var(--sf-ink)}
.sf-fchip .cv{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;opacity:.55;transition:transform .15s}
.sf-fdrop.open .sf-fchip{border-color:var(--sf-dim);color:var(--sf-ink)}
.sf-fdrop.open .sf-fchip .cv{transform:rotate(180deg)}
.sf-fdrop.act .sf-fchip{border-color:var(--sf-fill);color:var(--sf-ink);background:var(--sf-hover)}
.sf-fchip .cnt{display:none}
.sf-fdrop.act .sf-fchip .cnt{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;
padding:0 4px;border-radius:999px;background:var(--sf-fill);color:#fff;font-size:11px;font-weight:700}
.sf-fmenu{display:none;position:absolute;top:36px;left:0;z-index:30;min-width:188px;padding:6px;
background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.14)}
.sf-fdrop.open .sf-fmenu{display:block}
.sf-fmenu label{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:8px;font-size:13px;color:var(--sf-ink);cursor:pointer}
.sf-fmenu label:hover{background:var(--sf-hover)}
.sf-fmenu input{width:15px;height:15px;accent-color:var(--sf-fill);cursor:pointer;margin:0;flex:none}
.sf-fclear{height:30px;padding:0 9px;border:none;background:none;color:var(--acc);font:600 12.5px Inter;cursor:pointer;border-radius:8px}
.sf-fclear:hover{background:var(--sf-hover)}
.sf-table td .ordno{font-weight:650}
.sf-table tbody tr.crow{cursor:pointer}
.sf-cell-sub{font-size:12px;color:var(--sf-dim)}
/* ---- order editor (Create order / draft detail) ---- */
#sf-page:has(.sf-order-workspace){max-width:1420px}
.sf-order-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 24px}
.sf-order-head .sf-bc{margin:0}.sf-order-state{display:flex;align-items:center;gap:8px;color:var(--sf-dim);font-size:12px;font-weight:650}.sf-order-state:before{content:"";width:7px;height:7px;border-radius:50%;background:#34c759}
.sf-order-mode{display:grid;grid-template-columns:1fr 1fr;gap:4px;width:min(520px,100%);padding:4px;margin:0 0 22px;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-hover)}
.sf-order-mode button{height:38px;border:0;border-radius:9px;background:transparent;color:var(--sf-sub);font:700 13px Inter;cursor:pointer}.sf-order-mode button.on{background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.sf-ai-order{margin:0 0 22px;padding:20px;border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface)}
.sf-ai-order-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px}.sf-ai-order-head h2{margin:0 0 5px;font-size:17px;letter-spacing:-.02em}.sf-ai-order-head p{margin:0;color:var(--sf-dim);font-size:12.5px;line-height:1.45}
.sf-ai-order-box{display:flex;align-items:flex-end;gap:10px;padding:8px 8px 8px 15px;border:1px solid var(--sf-border);border-radius:15px;background:var(--sf-bg)}.sf-ai-order-box textarea{flex:1;min-height:54px;max-height:130px;padding:9px 0;border:0;outline:0;resize:none;background:transparent;color:var(--sf-ink);font:500 14px/1.45 Inter}.sf-ai-order-box button{height:38px;padding:0 15px;border:0;border-radius:10px;background:var(--sf-ink);color:var(--sf-surface);font:750 12.5px Inter;cursor:pointer}
.sf-ai-examples{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}.sf-ai-examples button{padding:6px 10px;border:1px solid var(--sf-border);border-radius:999px;background:transparent;color:var(--sf-sub);font:600 11.5px Inter;cursor:pointer}.sf-ai-examples button:hover{color:var(--sf-ink);background:var(--sf-hover)}
.sf-editor{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start}
@media(max-width:900px){.sf-editor{grid-template-columns:1fr}}
.sf-ecol{display:flex;flex-direction:column;gap:0;min-width:0}.sf-order-sheet{border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);overflow:hidden}.sf-order-section{padding:22px 24px;border-top:1px solid var(--sf-border)}.sf-order-section:first-child{border-top:0}.sf-order-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}.sf-order-section-head h3{margin:0;color:var(--sf-ink);font-size:15px;letter-spacing:-.01em}.sf-order-section-head p{margin:4px 0 0;color:var(--sf-dim);font-size:12px}.sf-order-step{display:inline-grid;place-items:center;width:23px;height:23px;margin-right:9px;border-radius:50%;background:var(--sf-ink);color:var(--sf-surface);font-size:11px}.sf-order-titleline{display:flex;align-items:center}
.sf-growth-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.sf-growth-card{display:flex;min-height:176px;padding:22px;border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);flex-direction:column}.sf-growth-card .sf-growth-icon{display:grid;width:38px;height:38px;margin-bottom:22px;border:1px solid var(--sf-border);border-radius:11px;color:var(--sf-ink);place-items:center}.sf-growth-card .sf-growth-icon svg{width:19px;height:19px}.sf-growth-card h2{margin:0 0 6px;color:var(--sf-ink);font-size:17px;letter-spacing:-.02em}.sf-growth-card p{max-width:440px;margin:0 0 20px;color:var(--sf-dim);font-size:13px;line-height:1.5}.sf-growth-card .sf-btn{align-self:flex-start;margin-top:auto}
.sf-order-actions{display:flex;gap:8px}.sf-order-actions .sf-btn{height:34px}.sf-order-empty{padding:24px;border:1px dashed var(--sf-border);border-radius:13px;text-align:center;color:var(--sf-dim);font-size:13px;background:var(--sf-bg)}
.sf-order-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.sf-order-grid .wide{grid-column:1/-1}.sf-order-field label{display:block;margin:0 0 7px;color:var(--sf-sub);font-size:11.5px;font-weight:700}.sf-order-field .sf-field{margin:0}
.sf-order-summary{border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);overflow:hidden}.sf-order-summary-head{padding:20px 20px 14px}.sf-order-summary-head h3{margin:0;font-size:16px}.sf-order-summary-head p{margin:5px 0 0;color:var(--sf-dim);font-size:12px}.sf-order-summary .sf-pay{margin:0}.sf-order-summary .sf-pay td{padding-left:20px;padding-right:20px}.sf-order-payment{padding:17px 20px;border-top:1px solid var(--sf-border)}.sf-order-payment h4{margin:0 0 10px;font-size:12px}.sf-pay-choice{display:grid;gap:7px}.sf-pay-choice label{display:flex;align-items:center;gap:9px;padding:10px 11px;border:1px solid var(--sf-border);border-radius:10px;color:var(--sf-sub);font-size:12.5px;font-weight:650;cursor:pointer}.sf-pay-choice label:has(input:checked){border-color:var(--sf-ink);color:var(--sf-ink);background:var(--sf-hover)}.sf-pay-choice input{accent-color:var(--sf-ink)}
.sf-order-summary-actions{display:grid;gap:8px;padding:16px 20px 20px}.sf-order-summary-actions .sf-btn{height:42px}.sf-order-review{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:24px;background:rgba(0,0,0,.45);backdrop-filter:blur(8px)}.sf-order-review[hidden]{display:none}.sf-order-review-card{width:min(520px,100%);border:1px solid var(--sf-border);border-radius:20px;background:var(--sf-surface);box-shadow:0 24px 80px rgba(0,0,0,.28);overflow:hidden}.sf-order-review-head{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:1px solid var(--sf-border)}.sf-order-review-head h2{margin:0;font-size:18px}.sf-order-review-body{padding:20px 22px}.sf-order-review-row{display:flex;justify-content:space-between;gap:20px;padding:10px 0;border-top:1px solid var(--sf-border);font-size:13px}.sf-order-review-row:first-child{border-top:0}.sf-order-review-row span{color:var(--sf-dim)}.sf-order-review-row strong{text-align:right}.sf-order-impact{margin-top:15px;padding:13px;border-radius:12px;background:var(--sf-hover);color:var(--sf-sub);font-size:12px;line-height:1.5}.sf-order-review-foot{display:flex;justify-content:flex-end;gap:8px;padding:16px 22px;border-top:1px solid var(--sf-border)}
@media(max-width:820px){.sf-growth-grid{grid-template-columns:1fr}}
@media(max-width:650px){.sf-order-head{align-items:flex-start;flex-direction:column}.sf-order-grid{grid-template-columns:1fr}.sf-order-grid .wide{grid-column:auto}.sf-order-section{padding:18px}.sf-order-actions{flex-wrap:wrap}.sf-order-mode{width:100%}}
/* Desktop only: the right rail follows you down the long left form. */
@media(min-width:901px){.sf-editor>.sf-ecol:nth-child(2){position:sticky;top:20px;align-self:start}}
#sf-page:has(.sf-cust-profile){max-width:none;margin:0;padding:0;overflow-x:clip;background:#f1f1f1}
/* Kill the white .sf-content surface in the customer view so .sf-cust-main is the
ONLY panel (a #f8f8f8 rounded-top panel against the #f1f1f1 bg/rails, per the
skeleton). Otherwise the white surface peeks around the panel's rounded corners
and reads as a second, higher-z layer. */
.sf-content:has(.sf-cust-profile){background:#f1f1f1}
body:has(.sf-cust-profile),body:has(.sf-cust-profile) button,body:has(.sf-cust-profile) input,body:has(.sf-cust-profile) textarea,body:has(.sf-cust-profile) select{font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
body:has(.sf-cust-profile) .sf-cust-profile,
body:has(.sf-cust-profile) .sf-cust-profile *{font-family:inherit}
/* Profile is a 200px RIGHT-hand rail (same width as the left nav): the main
work area on the left, this panel on the right — its avatar/name/actions
header stays put while the info scrolls beneath a linear-gradient dive. */
.sf-cust-profile{--sf-cust-gap:8px;--sf-cust-y-gutter:var(--sf-cust-gap);--sf-cust-x-gutter:var(--sf-cust-gap);position:relative;display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:0;align-items:start;max-width:100%;overflow-x:clip}
.sf-cust-profile:before{display:none}
.sf-cust-side{position:sticky;top:0;grid-column:2;grid-row:1;align-self:start;width:100%;box-sizing:border-box;height:calc(100vh - 56px);overflow-y:auto;overflow-x:hidden;background:#f1f1f1;border-radius:0;border-left:1px solid var(--sf-border-2);display:flex;flex-direction:column;padding:0 0 24px}
.sf-cust-card{position:relative;border:0;border-radius:0;background:transparent;width:100%;box-sizing:border-box;padding:44px 14px 0;text-align:center;box-shadow:none}
.sf-cust-side::-webkit-scrollbar{width:0;height:0}
.sf-cust-side{scrollbar-width:none}
.sf-cust-back{position:absolute;left:24px;top:30px;width:38px;height:38px;border:1px solid var(--sf-border);border-radius:999px;background:var(--sf-surface);color:var(--sf-sub);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.sf-cust-back svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sf-cust-back:hover{color:var(--sf-ink);border-color:var(--sf-dim);background:var(--sf-hover)}
.sf-cust-avatar{width:100px;height:100px;border-radius:50%;margin:0 auto 14px;background:#8F93A3;display:flex;align-items:center;justify-content:center;color:#fff;font-size:30px;font-weight:760;letter-spacing:-.05em;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
/* SVG section headers (Info / Documents) — replace the old tabs. */
.sf-cust-sec{font-size:14px;font-weight:600;color:var(--sf-ink);margin:20px 2px 10px;text-align:left}
.sf-cust-sec-docs{margin-top:26px}
.sf-cust-avatar-wrap{position:relative;width:max-content;margin:0 auto 18px}
.sf-cust-avatar-wrap .sf-cust-avatar{margin:0}
.sf-cust-online-dot{position:absolute;right:5px;bottom:5px;width:17px;height:17px;display:none;border:3px solid #000;border-radius:999px;background:#30d158;box-shadow:0 0 0 1px rgba(48,209,88,.18),0 0 14px rgba(48,209,88,.4)}
.sf-cust-online-dot.on{display:block}
.sf-cust-card h2{margin:0;color:var(--sf-ink);font-size:28px;font-weight:650;letter-spacing:-.035em;line-height:1.1}
.sf-cust-business{margin:6px 0 0;color:var(--sf-ink);font-size:13.5px;font-weight:760;line-height:1.2}
.sf-cust-role{margin:5px 0 14px;color:var(--sf-dim);font-size:13.5px;line-height:1.45}
.sf-cust-contact{display:grid;gap:7px;text-align:left;margin:18px 0 0;padding-top:18px;border-top:1px solid var(--sf-border-2)}
.sf-cust-contact a,.sf-cust-contact span{display:flex;align-items:center;gap:8px;min-width:0;color:var(--sf-sub);font-size:13px;text-decoration:none}
.sf-cust-contact a:hover{color:var(--sf-ink);text-decoration:underline;text-underline-offset:3px}
.sf-cust-chips{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-top:14px}
.sf-cust-chip{display:inline-flex;align-items:center;height:26px;padding:0 10px;border:1px solid var(--sf-border);border-radius:999px;color:var(--sf-sub);font-size:12px;font-weight:600;background:var(--sf-surface)}
.sf-cust-side-section{border-top:1px solid var(--sf-border-2);padding-top:15px;text-align:left}
.sf-cust-side-section h4{margin:0 0 10px;font-size:13px;font-weight:700;color:var(--sf-ink)}
.sf-cust-side-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.sf-cust-side-list li{display:flex;align-items:flex-start;gap:9px;color:var(--sf-sub);font-size:13px;line-height:1.45}
.sf-cust-side-list .ic{width:18px;flex:none;text-align:center;color:var(--sf-dim)}
.sf-cust-main{grid-column:1;grid-row:1;min-width:0;width:100%;box-sizing:border-box;overflow-x:hidden;background:#f8f8f8;border-radius:20px 20px 0 0;min-height:calc(100vh - 56px);padding:28px 32px 48px}
.sf-cust-tabs{position:sticky;top:0;z-index:8;display:flex;align-items:center;justify-content:space-between;gap:0;width:100%;padding:0 18px;margin:0 -18px 32px;border-bottom:0;background:rgba(255,255,255,.58);backdrop-filter:blur(6px) saturate(1.02);-webkit-backdrop-filter:blur(6px) saturate(1.02);overflow-x:auto}
.sf-cust-tabs button{position:relative;display:inline-flex;align-items:center;height:42px;color:#5f5f5f;border:0;background:transparent;text-decoration:none;font:700 14px Inter;cursor:pointer;white-space:nowrap;padding:0}
.sf-cust-tabs button:hover,.sf-cust-tabs button.on{color:#111;background:transparent}
.sf-cust-tabs button.on:after,.sf-cust-tabs button:hover:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--sf-ink)}
.sf-cust-section{margin:0 0 22px;scroll-margin-top:22px}
.sf-cust-panel{display:none}
.sf-cust-panel.on{display:block}
.sf-cust-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.sf-cust-section-title h2{margin:0;font-size:20px;font-weight:730;letter-spacing:-.025em;color:var(--sf-ink)}
.sf-cust-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.sf-cust-overview-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:0 0 14px}
.sf-cust-overview-head h2{margin:0;color:var(--sf-ink);font-size:22px;font-weight:760;letter-spacing:-.035em;line-height:1.05}
.sf-cust-overview-head p{margin:5px 0 0;color:var(--sf-sub);font-size:12.5px;line-height:1.45}
.sf-cust-overview-status{display:flex;align-items:center;gap:8px;min-height:30px;padding:0 11px;border:1px solid var(--sf-border);border-radius:999px;color:var(--sf-sub);font-size:12px;font-weight:700;white-space:nowrap;background:var(--sf-surface)}
.sf-cust-overview-status .dot{width:7px;height:7px;border-radius:999px;background:#2cc36b;box-shadow:0 0 0 3px rgba(44,195,107,.14)}
.sf-cust-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 var(--sf-cust-gap);border:1px solid rgba(0,0,0,.12);border-radius:18px;background:#ffffff;color:#2e2f33;box-shadow:none;overflow:hidden}
.sf-cust-metric{min-height:72px;padding:14px 20px;display:flex;flex-direction:column;justify-content:center;gap:7px;border-left:1px solid rgba(0,0,0,.10)}
.sf-cust-metric:first-child{border-left:0}
.sf-cust-metric .ml{width:max-content;max-width:100%;padding-bottom:0;border-bottom:0;color:#2e2f33;font-size:14px;font-weight:760;line-height:1.05}
.sf-cust-metric .mv{color:rgba(46,47,51,.5);font-size:15px;font-weight:400;line-height:1.1}
.sf-cust-bento{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-flow:dense;gap:var(--sf-cust-gap)}
.sf-cust-bento .sf-cust-widget{min-height:150px;padding:20px;border-radius:20px;display:flex;flex-direction:column;justify-content:space-between}
.sf-cust-bento .sf-cust-widget h3{font-size:15px}
.sf-cust-bento .sf-cust-widget p{max-width:36ch}
.sf-cust-bento .sf-cust-widget .wv{margin-top:12px;font-size:24px}
.sf-cust-bento .sf-cust-widget.bento-hero{grid-column:span 4;grid-row:span 2;min-height:318px;padding:20px}
.sf-cust-bento .sf-cust-widget.bento-hero h3{font-size:16px}
.sf-cust-bento .sf-cust-widget.bento-hero p{max-width:44ch;font-size:13px}
.sf-cust-bento .sf-cust-widget.bento-hero .wv{margin-top:22px;font-size:36px;line-height:1.02;letter-spacing:-.055em}
.sf-cust-bento .sf-cust-widget.bento-side{grid-column:span 2;min-height:152px}
.sf-cust-bento .sf-cust-widget.bento-team{grid-column:span 2;grid-row:span 2;min-height:318px}
.sf-cust-bento .sf-cust-widget.bento-wide{grid-column:span 3;min-height:168px}
.sf-cust-bento .sf-cust-widget.bento-chart{grid-column:span 6;min-height:248px}
.sf-cust-bento .sf-cust-widget.bento-chart.empty{min-height:176px}
.sf-cust-bento .sf-cust-widget.bento-compact{grid-column:span 2;min-height:146px}
.sf-cust-bento .sf-cust-widget.bento-compact .wv{font-size:22px}
.sf-cust-bento .sf-cust-widget.bento-risk{border-color:rgba(255,255,255,.22)}
.sf-cust-bento .sf-cust-widget.sf-cust-revenue-embed{padding:0!important;background:var(--sf-surface)!important;border:1px solid var(--sf-border)!important;border-radius:20px;box-shadow:0 1px 2px rgba(0,0,0,.04)!important;overflow:hidden}
.sf-cust-revenue-embed iframe{display:block;width:100%;height:100%;min-height:318px;border:0;border-radius:19px;background:transparent}
.sf-cust-widget .wmeta{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.sf-cust-widget .wmeta span{display:inline-flex;align-items:center;min-height:24px;padding:0 9px;border:1px solid var(--sf-border-2);border-radius:999px;color:var(--sf-sub);font-size:11.5px;font-weight:700;background:rgba(255,255,255,.025)}
.sf-cust-bento .sf-cust-widget.bento-lg,
.sf-cust-bento .sf-cust-widget.bento-md,
.sf-cust-bento .sf-cust-widget.bento-sm,
.sf-cust-bento .sf-cust-widget.bento-wide,
.sf-cust-bento .sf-cust-widget.bento-tall{grid-column:span 3;grid-row:span 1;min-height:158px}
.sf-cust-bento .sf-cust-widget.bento-tall .wv{font-size:24px}
.sf-cust-bento .sf-cust-widget .hint{margin-top:auto;padding-top:12px}
.sf-cust-task-pulse{justify-content:center}
.sf-cust-task-pulse .task-body{display:grid;grid-template-columns:minmax(110px,.34fr) minmax(0,1fr);gap:16px;align-items:center;margin:0}
.sf-cust-task-pulse .task-main{display:flex;align-items:flex-end;gap:12px;min-width:0}
.sf-cust-task-pulse .task-num{color:var(--sf-ink);font-size:54px;font-weight:780;line-height:.88;letter-spacing:-.055em}
.sf-cust-task-pulse .task-label{padding-bottom:4px;color:var(--sf-sub);font-size:12.5px;font-weight:700;line-height:1.2}
.sf-cust-task-pulse .task-suggest{padding:12px 13px;border:1px solid var(--sf-border-2);border-radius:14px;background:rgba(255,255,255,.025)}
.sf-cust-task-pulse .task-suggest span{display:block;margin-bottom:5px;color:var(--sf-dim);font-size:11px;font-weight:760;line-height:1;text-transform:uppercase;letter-spacing:.05em}
.sf-cust-task-pulse .task-suggest strong{display:block;color:var(--sf-ink);font-size:14px;font-weight:760;line-height:1.25}
.sf-cust-task-pulse .hint{margin-top:18px;padding-top:0}
.sf-cust-now{cursor:default;overflow:hidden}
.sf-cust-now:hover,.sf-cust-ops-card:hover{transform:none;border-color:var(--sf-border);background:var(--sf-surface)}
.sf-cust-now .now-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sf-cust-now .now-state{display:inline-flex;align-items:center;gap:7px;min-height:27px;padding:0 10px;border:1px solid var(--sf-border-2);border-radius:999px;color:var(--sf-sub);font-size:11.5px;font-weight:760;background:rgba(255,255,255,.025)}
.sf-cust-now .now-state:before{content:"";width:7px;height:7px;border-radius:999px;background:#f0a83a;box-shadow:0 0 0 3px rgba(240,168,58,.12)}
.sf-cust-now.ready .now-state:before{background:#2cc36b;box-shadow:0 0 0 3px rgba(44,195,107,.14)}
.sf-cust-now .now-title{margin-top:24px;color:var(--sf-ink);font-size:34px;font-weight:780;line-height:1.02;letter-spacing:-.045em}
.sf-cust-now .now-reason{max-width:55ch;margin-top:11px;color:var(--sf-sub);font-size:13px;line-height:1.5}
.sf-cust-now .now-meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:22px}
.sf-cust-now .now-meta span{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border:1px solid var(--sf-border-2);border-radius:999px;color:var(--sf-sub);font-size:11.5px;font-weight:700;background:rgba(255,255,255,.025)}
.sf-cust-now .now-actions{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:24px}
.sf-cust-now .now-primary,.sf-cust-now .now-secondary,.sf-cust-inline-action{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 15px;border:1px solid var(--sf-border);border-radius:999px;font:760 12px Inter;cursor:pointer}
.sf-cust-now .now-primary{background:var(--sf-ink);border-color:var(--sf-ink);color:var(--sf-surface)}
.sf-cust-now .now-primary:hover{opacity:.88}
.sf-cust-now .now-secondary,.sf-cust-inline-action{background:#19191d;color:var(--sf-ink)}
.sf-cust-now .now-secondary:hover,.sf-cust-inline-action:hover{background:#d8d8dd;color:#050505}
.sf-cust-ops-card{cursor:default;justify-content:flex-start!important;overflow:hidden}
.sf-cust-ops-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.sf-cust-ops-count{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:26px;padding:0 9px;border:1px solid var(--sf-border-2);border-radius:999px;color:var(--sf-sub);font-size:12px;font-weight:760;background:rgba(255,255,255,.025)}
.sf-cust-task-list,.sf-cust-blocker-list,.sf-cust-activity-list{display:grid;margin-top:16px}
.sf-cust-task-row,.sf-cust-blocker-row,.sf-cust-activity-row{display:grid;align-items:center;gap:11px;padding:11px 0;border-top:1px solid var(--sf-border-2)}
.sf-cust-task-row:first-child,.sf-cust-blocker-row:first-child,.sf-cust-activity-row:first-child{border-top:0;padding-top:0}
.sf-cust-task-row{grid-template-columns:8px minmax(0,1fr) auto}
.sf-cust-task-dot{width:8px;height:8px;border-radius:999px;background:#8f8f98}
.sf-cust-task-dot.high{background:#ff5f57}.sf-cust-task-dot.medium{background:#f0a83a}.sf-cust-task-dot.low{background:#2cc36b}
.sf-cust-row-title{min-width:0;color:var(--sf-ink);font-size:13px;font-weight:720;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-cust-row-sub{margin-top:4px;color:var(--sf-dim);font-size:11.5px;font-weight:620;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-cust-row-badge{color:var(--sf-sub);font-size:11.5px;font-weight:700;white-space:nowrap}
.sf-cust-blocker-row{grid-template-columns:24px minmax(0,1fr) auto}
.sf-cust-blocker-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#19191d;color:var(--sf-sub);font-size:12px;font-weight:800}
.sf-cust-blocker-row.requested .sf-cust-blocker-icon{background:rgba(240,168,58,.12);color:#f0a83a}
.sf-cust-blocker-actions{display:flex;align-items:center;justify-content:flex-end;margin-top:auto;padding-top:14px}
.sf-cust-activity-row{grid-template-columns:26px minmax(0,1fr) auto}
.sf-cust-activity-icon{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#19191d;color:var(--sf-sub);font-size:11px;font-weight:800}
.sf-cust-milestone-main{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-top:18px}
.sf-cust-milestone-value{color:var(--sf-ink);font-size:25px;font-weight:760;line-height:1}
.sf-cust-milestone-track{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin-top:18px}
.sf-cust-milestone-track span{height:5px;border-radius:999px;background:#242429}
.sf-cust-milestone-track span.done{background:#d8d8dd}.sf-cust-milestone-track span.on{background:#f0a83a}
.sf-cust-milestone-labels{display:flex;justify-content:space-between;gap:8px;margin-top:9px;color:var(--sf-dim);font-size:10px;font-weight:650}
.sf-cust-analytics{cursor:default;overflow:hidden}
.sf-cust-analytics:hover{transform:none;border-color:var(--sf-border);background:var(--sf-surface)}
.sf-cust-analytics .chart-title{margin:0;color:var(--sf-ink);font-size:17px;font-weight:760;line-height:1.1}
.sf-cust-analytics .chart-rule{height:1px;margin:12px 0 16px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.20) 0 2px,transparent 2px 6px)}
.sf-cust-analytics .chart-value{color:var(--sf-ink);font-size:30px;font-weight:760;line-height:1;letter-spacing:-.03em}
.sf-cust-analytics .chart-sub{margin-top:10px;color:var(--sf-sub);font-size:14px;line-height:1.35}
.sf-cust-analytics .chart-wrap{position:relative;margin-top:auto;padding-top:22px}
.sf-cust-analytics svg{display:block;width:100%;height:auto;overflow:visible}
.sf-cust-analytics .axis-label{fill:#8f8f98;font:650 12px Inter}
.sf-cust-analytics .x-label{fill:#8a8a8f;font:650 12px Inter}
.sf-cust-analytics .grid-line{stroke:rgba(255,255,255,.10);stroke-width:1}
.sf-cust-analytics .chart-line{stroke:#12b8ff;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;filter:url(#custChartGlow)}
.sf-cust-analytics .chart-area{fill:url(#custChartFill)}
.sf-cust-analytics .chart-dot{fill:#65ddff;filter:url(#custDotGlow)}
.sf-cust-analytics .chart-legend{display:flex;justify-content:center;gap:20px;margin-top:8px;color:var(--sf-sub);font-size:12.5px;font-weight:650}
.sf-cust-analytics .chart-legend span{display:inline-flex;align-items:center;gap:7px}
.sf-cust-analytics .chart-legend i{width:9px;height:9px;border-radius:50%;background:linear-gradient(180deg,#00dcff,#009aff);box-shadow:0 0 16px rgba(0,220,255,.5)}
.sf-cust-analytics .chart-legend .prev i{width:14px;height:0;border-radius:0;border-top:2px dashed #ff00dc;background:none;box-shadow:none}
.sf-cust-analytics-empty{display:flex;align-items:center;justify-content:center;min-height:70px;margin-top:auto;border-top:1px solid var(--sf-border-2);color:var(--sf-dim);font-size:12.5px;font-weight:650;text-align:center}
html[data-theme="light"] .sf-cust-analytics .chart-line,
html[data-theme="light"] .sf-cust-analytics .chart-dot{filter:none}
html[data-theme="light"] .sf-cust-analytics .chart-legend i{box-shadow:none}
.sf-cust-team{cursor:default;overflow:hidden;justify-content:flex-start}
.sf-cust-team:hover{transform:none;border-color:var(--sf-border);background:var(--sf-surface)}
.sf-cust-team .team-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.sf-cust-team .team-head p{max-width:28ch}
.sf-cust-team .team-count{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:26px;padding:0 9px;border:1px solid var(--sf-border-2);border-radius:999px;color:var(--sf-sub);font-size:12px;font-weight:760;background:rgba(255,255,255,.025)}
.sf-cust-team .team-list{margin-top:18px;min-height:0;max-height:220px;overflow:auto;padding-right:2px;scrollbar-width:none;-ms-overflow-style:none}
.sf-cust-team .team-list::-webkit-scrollbar{width:0;height:0;display:none}
.sf-cust-team .team-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:0}
.sf-cust-team .team-row+.team-row{margin-top:14px;padding-top:14px;border-top:1px solid var(--sf-border-2)}
.sf-cust-team .team-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#565174,#8f93a3);display:flex;align-items:center;justify-content:center;overflow:hidden;color:#fff;font-size:18px;font-weight:780;letter-spacing:-.04em;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.sf-cust-team .team-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.sf-cust-team .team-name{color:var(--sf-ink);font-size:15px;font-weight:760;line-height:1.12;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-cust-team .team-sub{margin-top:4px;color:var(--sf-sub);font-size:12.5px;font-weight:650;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-cust-team .team-badge{color:var(--sf-sub);font-size:12px;font-weight:760;white-space:nowrap}
.sf-cust-team .team-empty{margin-top:18px;padding:18px;border:1px dashed var(--sf-border-2);border-radius:16px;color:var(--sf-sub);font-size:13px;line-height:1.45}
.sf-cust-pagecard{border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);padding:18px;min-height:112px;display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.sf-cust-pagecard .emoji{font-size:22px;line-height:1}
.sf-cust-pagecard h3{margin:0;color:var(--sf-ink);font-size:16px;font-weight:700;letter-spacing:-.015em}
.sf-cust-pagecard p{margin:5px 0 0;color:var(--sf-sub);font-size:12.5px;line-height:1.45}
.sf-cust-pagecard .meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--sf-dim);font-size:12px}
.sf-cust-pagecard .meta b{color:var(--sf-sub);font-weight:650}
.sf-cust-orderhistory .sf-cardh2{padding:20px 20px 16px}
.sf-cust-orderhistory table th:first-child,.sf-cust-orderhistory table td:first-child{padding-left:20px}
.sf-cust-orderhistory table th:last-child,.sf-cust-orderhistory table td:last-child{padding-right:20px}
.sf-cust-orderhistory table tr:last-child td{padding-bottom:18px}
.sf-cust-orderhistory .sf-cardb{padding:8px 20px 20px}
.sf-cust-widget{border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);padding:18px;text-align:left;cursor:pointer;transition:border-color .14s ease,transform .14s ease,background .14s ease}
.sf-cust-widget:hover{border-color:var(--sf-border);transform:none}
.sf-cust-widget h3{margin:0;color:var(--sf-ink);font-size:16px;font-weight:720;letter-spacing:-.015em}
.sf-cust-widget p{margin:6px 0 0;color:var(--sf-sub);font-size:12.5px;line-height:1.45}
.sf-cust-widget .wv{margin-top:18px;color:var(--sf-ink);font-size:24px;font-weight:760;letter-spacing:-.035em}
.sf-cust-widget .wd{display:none;margin-top:14px;padding-top:14px;border-top:1px solid var(--sf-border-2);color:var(--sf-sub);font-size:12.5px;line-height:1.55}
.sf-cust-widget.open .wd{display:block}
.sf-cust-widget .hint{margin-top:12px;color:var(--sf-dim);font-size:11.5px;font-weight:650}
.sf-cust-profile .sf-card{border-radius:18px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.sf-cust-profile .sf-field{height:42px;border-radius:14px}
.sf-cust-profile textarea.sf-field{min-height:96px;border-radius:18px}
.sf-contract-workspace{--contract-bg:#070708;--contract-panel:#0d0d0f;--contract-panel-2:#111114;
--contract-line:rgba(255,255,255,.09);min-height:calc(100vh - 96px);overflow:hidden;border-radius:20px;
background:var(--contract-bg);color:#f5f5f6;container-type:inline-size}
.sf-contract-toolbar{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px;
padding:14px 18px;background:var(--contract-panel);border-bottom:1px solid var(--contract-line)}
.sf-contract-toolbar-copy{min-width:0}
.sf-contract-kicker{margin-bottom:5px;color:#85858e;font-size:10.5px;font-weight:760;letter-spacing:.09em;text-transform:uppercase}
.sf-contract-toolbar h2{margin:0;color:#fff;font-size:18px;font-weight:760;line-height:1.15;letter-spacing:-.025em;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-contract-toolbar p{margin:5px 0 0;color:#8f8f98;font-size:11.5px;line-height:1.35}
.sf-contract-toolbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:none}
.sf-contract-status{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 11px;border-radius:999px;
background:#18181c;color:#d7d7dc;font-size:11.5px;font-weight:740;white-space:nowrap}
.sf-contract-status:before{content:"";width:7px;height:7px;border-radius:50%;background:#8f8f98}
.sf-contract-status.complete:before{background:#39c77b;box-shadow:0 0 0 3px rgba(57,199,123,.12)}
.sf-contract-status.waiting:before{background:#f0a83a;box-shadow:0 0 0 3px rgba(240,168,58,.12)}
.sf-contract-status.void:before{background:#ff625a}
.sf-contract-action{display:inline-flex;align-items:center;justify-content:center;height:34px;padding:0 13px;
border:1px solid rgba(255,255,255,.11);border-radius:999px;background:#18181c;color:#fff;text-decoration:none;
font:720 11.5px Inter;cursor:pointer;white-space:nowrap;transition:background .14s ease,color .14s ease,border-color .14s ease}
.sf-contract-action:hover{background:#ececef;border-color:#ececef;color:#070708}
.sf-contract-action.primary{background:#f1f1f3;border-color:#f1f1f3;color:#070708}
.sf-contract-action.primary:hover{background:#d7d7dc;border-color:#d7d7dc}
.sf-contract-picker{height:34px;max-width:210px;padding:0 30px 0 11px;border:1px solid rgba(255,255,255,.11);
border-radius:999px;background:#18181c;color:#fff;font:650 11.5px Inter;outline:none}
.sf-contract-picker:focus-visible,.sf-contract-action:focus-visible{outline:2px solid #fff;outline-offset:2px}
.sf-contract-layout{display:grid;grid-template-columns:minmax(0,1fr) 276px;min-height:calc(100vh - 168px)}
.sf-contract-stage{min-width:0;padding:30px;background:#030304;overflow:auto}
.sf-contract-paper{--sf-border:#dedee2;width:min(100%,760px);min-height:930px;box-sizing:border-box;margin:0 auto;
padding:58px 64px 48px;background:#f7f6f2;color:#19191b;border-radius:3px;box-shadow:0 22px 56px rgba(0,0,0,.45);
font-family:Inter,Arial,sans-serif}
.sf-contract-paper-mark{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:76px;
color:#74747b;font-size:9.5px;font-weight:760;letter-spacing:.13em;text-transform:uppercase}
.sf-contract-paper-brand{color:#171719;font-size:11px;font-weight:820;letter-spacing:.08em}
.sf-contract-paper h1{max-width:580px;margin:0;color:#151517;font-size:38px;font-weight:780;line-height:1.04;
letter-spacing:-.045em}
.sf-contract-paper-sub{max-width:560px;margin:12px 0 0;color:#66666d;font-size:13px;line-height:1.55}
.sf-contract-paper-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:30px 0 34px;
border-top:1px solid #d9d9dd;border-left:1px solid #d9d9dd}
.sf-contract-paper-meta>div{min-height:54px;padding:10px 12px;border-right:1px solid #d9d9dd;border-bottom:1px solid #d9d9dd}
.sf-contract-paper-meta span{display:block;margin-bottom:5px;color:#85858c;font-size:8.5px;font-weight:760;
letter-spacing:.09em;text-transform:uppercase}
.sf-contract-paper-meta strong{display:block;color:#222225;font-size:11.5px;font-weight:680;line-height:1.35}
.sf-contract-body{color:#303035;font-size:12px;line-height:1.65}
.sf-contract-body h2,.sf-contract-body h3{color:#171719;letter-spacing:-.015em}
.sf-contract-body h2{font-size:18px!important}.sf-contract-body h3{font-size:14px!important}
.sf-contract-body p{max-width:68ch}
.sf-contract-body ul{padding-left:19px}
.sf-contract-body-empty{padding:20px;border-radius:10px;background:#ecebed;color:#68686f;font-size:12px;line-height:1.55}
.sf-contract-signatures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin-top:42px;
padding-top:26px;border-top:1px solid #d9d9dd}
.sf-contract-signature h4{margin:0 0 16px;color:#68686f;font-size:9px;font-weight:780;letter-spacing:.09em;text-transform:uppercase}
.sf-contract-signature-line{min-height:62px;display:flex;align-items:flex-end;padding-bottom:8px;border-bottom:1px solid #bdbdc3}
.sf-contract-signature-line img{display:block;max-width:100%;max-height:54px;object-fit:contain}
.sf-contract-signature-name{color:#232326;font:italic 23px Georgia,serif;line-height:1}
.sf-contract-signature.pending .sf-contract-signature-name{color:#9a9aa1;font:500 11px Inter}
.sf-contract-signature-meta{margin-top:8px;color:#77777f;font-size:9.5px;line-height:1.45}
.sf-contract-paper-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:58px;
padding-top:12px;border-top:1px solid #dedee2;color:#85858c;font-size:8.5px;font-weight:650}
.sf-contract-inspector{min-width:0;padding:20px 18px;background:var(--contract-panel);border-left:1px solid var(--contract-line)}
.sf-contract-inspector-section{padding:18px 0;border-top:1px solid var(--contract-line)}
.sf-contract-inspector-section:first-child{padding-top:0;border-top:0}
.sf-contract-inspector h3{margin:0 0 13px;color:#fff;font-size:12.5px;font-weight:760;letter-spacing:-.01em}
.sf-contract-details{display:grid;gap:12px;margin:0}
.sf-contract-details div{display:grid;gap:4px}
.sf-contract-details dt{color:#74747d;font-size:9.5px;font-weight:760;letter-spacing:.07em;text-transform:uppercase}
.sf-contract-details dd{margin:0;color:#d8d8dd;font-size:11.5px;font-weight:630;line-height:1.4;overflow-wrap:anywhere}
.sf-contract-timeline{display:grid;gap:0}
.sf-contract-event{position:relative;display:grid;grid-template-columns:13px minmax(0,1fr);gap:9px;padding-bottom:15px}
.sf-contract-event:last-child{padding-bottom:0}
.sf-contract-event:before{content:"";position:absolute;left:5px;top:10px;bottom:0;width:1px;background:var(--contract-line)}
.sf-contract-event:last-child:before{display:none}
.sf-contract-event-dot{position:relative;z-index:1;width:11px;height:11px;margin-top:1px;border:3px solid var(--contract-panel);
border-radius:50%;background:#55555d;box-sizing:border-box}
.sf-contract-event.complete .sf-contract-event-dot{background:#39c77b}
.sf-contract-event b{display:block;color:#d8d8dd;font-size:10.5px;font-weight:690;line-height:1.25}
.sf-contract-event span{display:block;margin-top:3px;color:#74747d;font-size:9.5px;line-height:1.35}
.sf-contract-linked{display:grid;gap:7px}
.sf-contract-linked a,.sf-contract-linked button{width:100%;box-sizing:border-box;display:flex;align-items:center;
justify-content:space-between;gap:10px;min-height:38px;padding:0 11px;border:0;border-radius:10px;background:#17171a;
color:#d8d8dd;text-decoration:none;font:650 10.5px Inter;cursor:pointer;text-align:left}
.sf-contract-linked a:hover,.sf-contract-linked button:hover{background:#222227;color:#fff}
.sf-contract-empty{min-height:calc(100vh - 168px);display:grid;place-items:center;padding:36px;background:#030304;text-align:center}
.sf-contract-empty-inner{max-width:390px}
.sf-contract-empty-icon{width:58px;height:72px;margin:0 auto 20px;border-radius:8px;background:#151518;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);position:relative}
.sf-contract-empty-icon:before,.sf-contract-empty-icon:after{content:"";position:absolute;left:14px;right:14px;height:1px;background:#55555d}
.sf-contract-empty-icon:before{top:27px}.sf-contract-empty-icon:after{top:40px}
.sf-contract-empty h3{margin:0;color:#fff;font-size:20px;font-weight:750;letter-spacing:-.025em}
.sf-contract-empty p{max-width:42ch;margin:9px auto 0;color:#85858e;font-size:12px;line-height:1.55}
.sf-contract-loading{min-height:calc(100vh - 168px);display:grid;place-items:center;background:#030304;color:#74747d;
font-size:11.5px;font-weight:650}
.sf-client-documents{min-width:0}
.sf-client-doc-tabs{width:max-content;display:flex;align-items:center;gap:3px;margin:0 0 10px;padding:4px;
border-radius:999px;background:#111114}
.sf-client-doc-tabs button{height:32px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:#85858e;
font:720 11.5px Inter;cursor:pointer}
.sf-client-doc-tabs button:hover{color:#fff}
.sf-client-doc-tabs button.on{background:#2a2a30;color:#fff}
.sf-client-doc-panel{display:none}
.sf-client-doc-panel.on{display:block}
.sf-client-notes{min-height:calc(100vh - 96px);display:flex;flex-direction:column;padding:24px;border-radius:20px;
background:#0d0d0f;color:#fff}
.sf-client-notes-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}
.sf-client-notes-head h2{margin:0;color:#fff;font-size:21px;font-weight:760;letter-spacing:-.025em}
.sf-client-notes-head p{max-width:58ch;margin:6px 0 0;color:#85858e;font-size:12px;line-height:1.5}
.sf-client-notes-status{color:#74747d;font-size:10.5px;font-weight:650;white-space:nowrap}
.sf-client-notes textarea{flex:1;width:100%;min-height:420px;box-sizing:border-box;resize:vertical;padding:20px 22px;
border:0;border-radius:18px;background:#131316;color:#f2f2f4;font:500 13px/1.65 Inter;outline:none}
.sf-client-notes textarea::placeholder{color:#66666e}
.sf-client-notes textarea:focus{box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.sf-client-notes-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px}
.sf-client-notes-foot span{color:#74747d;font-size:10.5px;line-height:1.4}
.sf-client-notes-save{height:36px;padding:0 16px;border:0;border-radius:999px;background:#f1f1f3;color:#08080a;
font:760 11.5px Inter;cursor:pointer}
.sf-client-notes-save:hover{background:#d7d7dc}
@container(max-width:780px){
.sf-contract-layout{grid-template-columns:1fr}
.sf-contract-inspector{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;border-left:0;border-top:1px solid var(--contract-line)}
.sf-contract-inspector-section:nth-child(2){padding-top:0;border-top:0}
.sf-contract-stage{padding:22px}
}
@media(max-width:680px){
.sf-contract-workspace{border-radius:16px}
.sf-contract-toolbar{align-items:flex-start;flex-direction:column}
.sf-contract-toolbar-actions{width:100%;justify-content:flex-start;flex-wrap:wrap}
.sf-contract-stage{padding:12px}
.sf-contract-paper{min-height:760px;padding:36px 26px}
.sf-contract-paper-mark{margin-bottom:48px}
.sf-contract-paper h1{font-size:29px}
.sf-contract-paper-meta,.sf-contract-signatures{grid-template-columns:1fr}
.sf-contract-inspector{grid-template-columns:1fr}
.sf-contract-inspector-section:nth-child(2){padding-top:18px;border-top:1px solid var(--contract-line)}
.sf-client-notes{min-height:72vh;padding:18px;border-radius:18px}
.sf-client-notes-head{flex-direction:column}
.sf-client-notes textarea{min-height:360px;padding:16px}
}
@media(prefers-reduced-motion:reduce){.sf-contract-action{transition:none}}
.sf-cust-actions{display:flex;align-items:center;justify-content:center;gap:10px;margin:14px 0 4px}
.sf-cust-action{width:40px;height:40px;flex:none;border:0;border-radius:50%;background:#17171a;color:#ffffff;display:flex;align-items:center;justify-content:center;font-size:18px;text-decoration:none;box-shadow:none;cursor:pointer;transition:background .14s ease,color .14s ease}
.sf-cust-action svg{width:16px;height:16px;display:block}
/* Day mode: client-profile action buttons are light gray with dark icons/text (not black) */
html[data-theme="light"] .sf-cust-action{background:#fff;color:#111}
html[data-theme="light"] .sf-cust-action:hover{background:#f3f3f5;color:#111}
html[data-theme="light"] .sf-cust-action.mute{background:#f1f1f3;color:var(--sf-dim)}
html[data-theme="light"] .sf-cust-inline-action{background:#ececef;color:var(--sf-ink)}
html[data-theme="light"] .sf-cust-inline-action:hover{background:#e2e2e6;color:var(--sf-ink)}
html[data-theme="light"] #cd-primary{background:#ececef!important;color:var(--sf-ink)!important;border:1px solid var(--sf-border)!important}
html[data-theme="light"] #cd-primary:hover{background:#e2e2e6!important}
/* Pre-call chooser popup (Meet-style: blurred backdrop + white rounded card) */
.sf-callchoose-backdrop{position:fixed;inset:0;z-index:986;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.5);backdrop-filter:blur(8px) saturate(1.04);-webkit-backdrop-filter:blur(8px) saturate(1.04);animation:sfccfade .18s ease}
@keyframes sfccfade{from{opacity:0}to{opacity:1}}
.sf-callchoose{width:min(94vw,430px);background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:20px;box-shadow:0 26px 74px rgba(0,0,0,.28);padding:22px;color:var(--sf-ink)}
.sf-callchoose-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.sf-callchoose-head h3{margin:0;font-size:18px;font-weight:770;letter-spacing:-.02em;line-height:1.15}
.sf-callchoose-head p{margin:5px 0 0;color:var(--sf-sub);font-size:12.5px;line-height:1.4}
.sf-callchoose-x{flex:none;width:30px;height:30px;border:none;background:none;color:var(--sf-dim);font-size:22px;line-height:1;cursor:pointer;border-radius:8px}
.sf-callchoose-x:hover{background:var(--sf-hover);color:var(--sf-ink)}
.sf-callchoose-list{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.sf-callchoose-row{display:flex;align-items:center;gap:14px;width:100%;padding:13px 14px;border:1px solid var(--sf-border);border-radius:15px;background:var(--sf-surface);color:var(--sf-ink);text-align:left;cursor:pointer;transition:background .12s ease,border-color .12s ease}
.sf-callchoose-row:hover{background:var(--sf-hover);border-color:var(--sf-dim)}
.sf-callchoose-row:disabled{opacity:.55;cursor:default}
.sf-callchoose-row .cc-ic{flex:none;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#111;color:#fff}
html[data-theme="dark"] .sf-callchoose-row .cc-ic{background:#e8e8ea;color:#111}
.sf-callchoose-row .cc-ic svg{width:20px;height:20px}
.sf-callchoose-row .cc-tx{min-width:0}
.sf-callchoose-row .cc-tx b{display:block;font-size:14.5px;font-weight:700;letter-spacing:-.01em}
.sf-callchoose-row .cc-tx span{display:block;margin-top:2px;color:var(--sf-sub);font-size:12px;line-height:1.35}
.sf-cust-action.mute{color:#ffffff}
.sf-cust-action:hover{background:#d8d8dd;color:#050505}
.sf-video-call-backdrop{position:fixed;inset:0;z-index:980;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(0,0,0,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.sf-video-call{--sf-call-side:286px;position:relative;width:min(95vw,1420px);height:min(86dvh,790px);display:grid;grid-template-columns:minmax(0,1fr) 18px minmax(240px,var(--sf-call-side));overflow:visible;border:0;background:transparent;color:#fff}
.sf-video-call-main{position:relative;min-width:0;min-height:0;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:34px;background:rgba(0,0,0,.58);box-shadow:0 30px 90px rgba(0,0,0,.5)}
.sf-video-call-copy{position:absolute;z-index:4;left:24px;top:22px;pointer-events:none}
.sf-video-call-copy b{display:block;color:#fff;font-size:15px;font-weight:760;line-height:1.2}
.sf-video-call-copy span{display:block;margin-top:4px;color:#aaaab2;font-size:11.5px;font-weight:620}
.sf-vc-ready{position:absolute;z-index:6;left:20px;bottom:96px;width:min(360px,calc(100% - 40px));padding:18px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:#161619;box-shadow:0 20px 60px rgba(0,0,0,.5);color:#fff;transition:opacity .2s ease,transform .2s ease}
.sf-vc-ready[hidden]{display:none}
.sf-vc-ready-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sf-vc-ready-head b{font-size:16px;font-weight:750;line-height:1.25}
.sf-vc-ready-head button{width:22px;height:22px;flex:none;padding:0;border:0;background:transparent;color:#9a9aa2;font-size:22px;line-height:1;cursor:pointer}
.sf-vc-ready-head button:hover{color:#fff}
.sf-vc-ready-sub{margin:6px 0 14px;color:#a7a7af;font-size:12.5px;line-height:1.4}
.sf-vc-ready-link{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#0f0f11}
.sf-vc-ready-link span{min-width:0;flex:1;overflow:hidden;color:#dcdce2;font:600 12.5px/1.2 ui-monospace,Menlo,monospace;text-overflow:ellipsis;white-space:nowrap}
.sf-vc-ready-copy{width:32px;height:32px;flex:none;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#1e1e22;color:#fff;cursor:pointer}
.sf-vc-ready-copy:hover{background:#d8d8dd;color:#050505}
.sf-vc-ready-copy.copied{border-color:#1f7a4d;background:#1f7a4d;color:#fff}
.sf-vc-ready-copy svg{width:15px;height:15px}
.sf-vc-ready-foot{margin-top:12px;color:#82828a;font:600 11px Inter}
.sf-video-call-head{position:absolute;z-index:4;right:0;top:0;padding:22px 24px;border:0;background:transparent;pointer-events:none}
.sf-video-call-head>button{pointer-events:auto}
.sf-video-call-close{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:#17171a;color:#fff;cursor:pointer;font-size:18px;line-height:1}
.sf-video-call-close:hover{background:#d8d8dd;color:#050505}
.sf-video-call-stage{position:absolute;inset:0;width:100%;height:100%;background:transparent;display:flex;align-items:center;justify-content:center;overflow:hidden}
.sf-video-call-stage:before{content:"";position:absolute;z-index:0;inset:-18%;background:radial-gradient(circle at 16% 20%,rgba(255,255,255,.22),transparent 32%),radial-gradient(circle at 82% 16%,rgba(150,150,160,.34),transparent 34%),radial-gradient(circle at 58% 84%,rgba(255,255,255,.16),transparent 32%),linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.02) 42%,rgba(0,0,0,.48));opacity:0;filter:blur(20px);transform:scale(1.06);transition:opacity .46s ease,transform .46s ease}
.sf-video-call-stage:after{content:"";position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.22));opacity:0;pointer-events:none;transition:opacity .46s ease}
.sf-video-call-stage>video{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;display:block;background:transparent;opacity:1;transition:opacity .46s ease,filter .46s ease;transform:scaleX(-1)}
.sf-video-call.controls-idle .sf-video-call-stage:before{opacity:1;transform:scale(1)}
.sf-video-call.controls-idle .sf-video-call-stage:after{opacity:1}
.sf-video-call.controls-idle .sf-video-call-stage>video{opacity:.62;filter:saturate(.86) contrast(.94)}
.sf-video-call-stage>#sf-vc-active-remote{display:none;transform:none}
.sf-video-call-stage.remote-active>#sf-vc-video{display:none}
.sf-video-call-stage.remote-active>#sf-vc-active-remote{display:block}
.sf-video-call-stage.sharing>#sf-vc-video{display:block;object-fit:contain;transform:none}
.sf-video-call-stage.sharing>#sf-vc-active-remote{display:none}
.sf-video-call-active-placeholder{position:absolute;z-index:2;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column;gap:12px;background:#09090b;color:#fff}
.sf-video-call-stage.remote-placeholder .sf-video-call-active-placeholder{display:flex}
.sf-video-call-active-avatar{width:88px;height:88px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#9295a6;color:#1d2030;font-size:28px;font-weight:780}
.sf-video-call-active-placeholder b{font-size:15px;font-weight:730}
.sf-video-call-thumbnails{position:absolute;z-index:4;left:18px;top:78px;display:flex;max-height:calc(100% - 164px);flex-direction:column;gap:8px;overflow:auto;scrollbar-width:none}
.sf-video-call-thumbnails::-webkit-scrollbar{display:none}
.sf-video-call-participant{position:relative;width:116px;height:72px;flex:none;overflow:hidden;border:1px solid rgba(255,255,255,.2);border-radius:14px;background:#161619;color:#fff;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.28);transition:border-color .14s ease,transform .14s ease}
.sf-video-call-participant:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.48)}
.sf-video-call-participant.speaking{border-color:#52cf87;box-shadow:0 0 0 2px rgba(82,207,135,.2),0 8px 24px rgba(0,0,0,.28)}
.sf-video-call-participant.waiting{cursor:default;opacity:.72}
.sf-video-call-participant video{width:100%;height:100%;display:block;object-fit:cover;background:#111114}
.sf-video-call-participant.local video{transform:scaleX(-1)}
.sf-video-call-participant-avatar{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#242429;color:#d8d8dd;font-size:18px;font-weight:780}
.sf-video-call-participant.has-video .sf-video-call-participant-avatar{display:none}
.sf-video-call-participant-label{position:absolute;left:6px;right:6px;bottom:5px;display:flex;align-items:center;gap:5px;min-width:0;color:#fff;font-size:8.5px;font-weight:720;text-shadow:0 1px 4px #000}
.sf-video-call-participant-label span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-video-call-participant-dot{width:5px;height:5px;flex:none;border-radius:50%;background:#72727a;box-shadow:0 0 0 2px rgba(0,0,0,.38)}
.sf-video-call-participant.speaking .sf-video-call-participant-dot{background:#52cf87}
.sf-video-call-active-name{position:absolute;z-index:4;left:18px;bottom:18px;max-width:180px;overflow:hidden;padding:6px 9px;border:1px solid rgba(255,255,255,.15);border-radius:999px;background:rgba(18,18,20,.56);color:#fff;font-size:9.5px;font-weight:720;text-overflow:ellipsis;white-space:nowrap;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.sf-video-call-empty{position:absolute;z-index:2;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:#a8a8b0;font-size:13px;font-weight:650;background:#050505}
.sf-video-call-stage.ready .sf-video-call-empty{display:none}
.sf-video-call-controls{position:absolute;z-index:4;left:50%;bottom:18px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:8px;padding:8px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(18,18,20,.58);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 16px 42px rgba(0,0,0,.28);opacity:1;transition:opacity .28s ease,transform .28s ease}
.sf-video-call.controls-idle .sf-video-call-controls{opacity:0;transform:translateX(-50%) translateY(8px);pointer-events:none}
.sf-video-call-btn{width:46px;height:46px;min-width:46px;flex:none;padding:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.13);border-radius:50%;background:#19191d;color:#fff;cursor:pointer}
.sf-video-call-btn svg{display:block;width:24px;height:24px;pointer-events:none}
.sf-video-call-btn:hover{background:#2a2a30;border-color:rgba(255,255,255,.22)}
.sf-video-call-btn.on{background:#2a2a30;color:#fff}
.sf-video-call-btn.sf-vc-cc-btn{font:800 12px Inter;letter-spacing:.02em}
.sf-video-call-btn.end{background:#ff3b30;border-color:#ff3b30;color:#fff}
.sf-video-call-btn.end:hover{background:#e7332a;border-color:#e7332a;color:#fff}
.sf-vc-popover{position:absolute;z-index:7;right:max(18px,calc(50% - 176px));bottom:86px;display:none;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:#161619;color:#fff;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.sf-vc-popover.on{display:block}
.sf-vc-devices-panel{width:300px;padding:14px}
.sf-vc-device-fields{display:grid;gap:10px}
.sf-vc-device-field{display:grid;gap:5px;color:#a7a7af;font-size:10.5px;font-weight:650;line-height:1.2}
.sf-vc-device-field select{width:100%;height:36px;padding:0 30px 0 10px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#0f0f11;color:#fff;font:600 11.5px Inter;outline:none}
.sf-vc-device-field select:focus{border-color:rgba(255,255,255,.32)}
.sf-vc-device-field select:disabled{color:#777780;cursor:not-allowed}
.sf-vc-more-menu{min-width:230px;padding:6px}
.sf-vc-more-row{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;border:0;border-radius:10px;background:transparent;color:#ededf0;font:650 11.5px Inter;text-align:left;cursor:pointer}
.sf-vc-more-row:hover{background:rgba(255,255,255,.06);color:#fff}
.sf-vc-more-row svg{width:17px;height:17px;flex:none}
.sf-vc-more-divider{height:1px;margin:5px 8px;background:rgba(255,255,255,.1)}
.sf-vc-react-bar{right:auto;left:50%;bottom:86px;transform:translateX(-50%);padding:8px;border-radius:14px;white-space:nowrap}
.sf-vc-react-bar button{padding:6px;border:0;border-radius:8px;background:transparent;font-size:22px;line-height:1;cursor:pointer}
.sf-vc-react-bar button:hover{background:rgba(255,255,255,.08)}
@keyframes sf-vc-float-up{from{transform:translateY(0);opacity:0}10%{opacity:1}to{transform:translateY(-160px);opacity:0}}
.sf-vc-float{position:absolute;bottom:90px;left:50%;font-size:34px;pointer-events:none;z-index:8;animation:sf-vc-float-up 2.4s ease-out forwards}
.sf-vc-hand-badge{position:absolute;z-index:3;top:6px;right:6px;font-size:14px;line-height:1;filter:drop-shadow(0 1px 3px #000)}
.sf-vc-captions{position:absolute;left:50%;transform:translateX(-50%);bottom:82px;max-width:74%;z-index:7;display:flex;flex-direction:column;gap:6px;pointer-events:none}
.sf-vc-captions[hidden]{display:none}
.sf-vc-caption-line{background:rgba(0,0,0,.72);color:#fff;padding:6px 12px;border-radius:10px;font:600 14px Inter;text-align:center}
.sf-video-call-divider{position:relative;z-index:5;width:18px;height:100%;display:flex;align-items:center;justify-content:center;border:0;background:transparent;cursor:col-resize;touch-action:none;outline:none}
.sf-video-call-divider::before{content:"";width:3px;height:58px;border-radius:999px;background:rgba(255,255,255,.16);transition:height .14s ease,background .14s ease}
.sf-video-call-divider:hover::before,.sf-video-call-divider:focus-visible::before,.sf-video-call-divider.dragging::before{height:78px;background:rgba(255,255,255,.48)}
.sf-video-call-divider:focus-visible{border-radius:999px;box-shadow:0 0 0 2px rgba(255,255,255,.22)}
.sf-video-call-side{min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:28px;background:#111114;box-shadow:0 24px 72px rgba(0,0,0,.36)}
.sf-video-call-side-head{display:flex;align-items:center;gap:8px;min-height:58px;padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.08)}
.sf-video-call-tabs{min-width:0;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);flex:1;padding:3px;border-radius:999px;background:#1a1a1e}
.sf-video-call-tab{height:30px;min-width:0;padding:0 10px;border:0;border-radius:999px;background:transparent;color:#8f8f98;font:720 10.5px Inter;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-video-call-tab.on{background:#d8d8dd;color:#050505}
.sf-video-call-invite{width:34px;height:34px;flex:none;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.11);border-radius:999px;background:#1a1a1e;color:#fff;cursor:pointer}
.sf-video-call-invite:hover{background:#d8d8dd;color:#050505}
.sf-video-call-invite svg{width:15px;height:15px}
.sf-video-call-side-body{min-height:0;flex:1;overflow:hidden}
.sf-video-call-panel{height:100%;min-height:0;display:none}
.sf-video-call-panel.on{display:flex;flex-direction:column}
.sf-video-call-panel-scroll{min-height:0;flex:1;overflow:auto;padding:14px 15px;scrollbar-width:none}
.sf-video-call-panel-scroll::-webkit-scrollbar,.sf-video-call-chat-log::-webkit-scrollbar{display:none}
.sf-video-call-notetaker{margin:0 0 15px;padding:11px;border-radius:12px;background:#17171a}
.sf-video-call-notetaker-main{display:grid;grid-template-columns:28px minmax(0,1fr) 34px;align-items:center;gap:9px}
.sf-video-call-notetaker-icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#242429;color:#fff}
.sf-video-call-notetaker-icon svg{width:14px;height:14px}
.sf-video-call-notetaker-copy{min-width:0}
.sf-video-call-notetaker-copy b{display:block;color:#f2f2f4;font-size:11px;font-weight:730;line-height:1.25}
.sf-video-call-notetaker-copy span{display:block;margin-top:2px;color:#777780;font-size:9px;line-height:1.3}
.sf-video-call-notetaker-toggle{position:relative;width:34px;height:20px;padding:0;border:0;border-radius:999px;background:#303036;cursor:pointer}
.sf-video-call-notetaker-toggle:before{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#85858e;transition:transform .16s ease,background .16s ease}
.sf-video-call-notetaker-toggle.on{background:rgba(57,199,123,.22)}
.sf-video-call-notetaker-toggle.on:before{transform:translateX(14px);background:#39c77b}
.sf-video-call-notetaker-toggle:disabled{opacity:.42;cursor:not-allowed}
.sf-video-call-consent{display:flex;align-items:center;gap:7px;margin-top:9px;color:#898992;font-size:9px;font-weight:620;line-height:1.3;cursor:pointer}
.sf-video-call-consent input{width:13px;height:13px;flex:none;margin:0;accent-color:#39c77b}
.sf-video-call-note-state{display:none;align-items:center;gap:7px;margin-top:9px;padding-top:9px;border-top:1px solid rgba(255,255,255,.07);color:#9a9aa3;font-size:9px;line-height:1.35}
.sf-video-call-note-state.on{display:flex}
.sf-video-call-note-state:before{content:"";width:6px;height:6px;flex:none;border-radius:50%;background:#ff5d55;box-shadow:0 0 0 3px rgba(255,93,85,.12);animation:sf-note-pulse 1.3s ease-in-out infinite}
@keyframes sf-note-pulse{50%{opacity:.45}}
.sf-video-call-ai-log{display:grid;gap:8px;margin-top:14px;padding-top:13px;border-top:1px solid rgba(255,255,255,.07)}
.sf-video-call-ai-empty{padding:9px 2px;color:#6f6f77;font-size:9.5px;line-height:1.45}
.sf-video-call-ai-message{padding:9px 10px;border-radius:12px;background:#19191d;color:#d9d9de;font-size:9.5px;line-height:1.45;overflow-wrap:anywhere}
.sf-video-call-ai-message.user{margin-left:22px;background:#26262b;color:#fff}
.sf-video-call-ai-message.assistant{margin-right:8px}
.sf-video-call-ai-message .meta{margin-bottom:4px;color:#717179;font-size:8px;font-weight:760;letter-spacing:.06em;text-transform:uppercase}
.sf-video-call-ai-draft{margin-top:8px;padding:8px;border-radius:10px;background:#222227;color:#cfcfd5;font-size:9px;line-height:1.45}
.sf-video-call-ai-draft b{display:block;margin-bottom:3px;color:#8c8c95;font-size:7.5px;letter-spacing:.06em;text-transform:uppercase}
.sf-video-call-ai-actions{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.sf-video-call-ai-actions button{min-height:26px;padding:0 8px;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:#29292e;color:#fff;font:700 8.5px Inter;cursor:pointer}
.sf-video-call-ai-actions button:hover{background:#d8d8dd;color:#050505}
.sf-video-call-ai-actions button.done{color:#6fda99;cursor:default}
.sf-video-call-ai-compose{position:relative;padding:9px 10px 11px;border-top:1px solid rgba(255,255,255,.08);background:#111114}
.sf-video-call-ai-shell{display:grid;grid-template-columns:27px minmax(0,1fr) 30px;align-items:end;gap:5px;min-height:42px;padding:5px;border:1px solid rgba(255,255,255,.09);border-radius:18px;background:#1a1a1e}
.sf-video-call-ai-plus,.sf-video-call-ai-send{width:27px;height:27px;display:flex;align-items:center;justify-content:center;border:0;border-radius:50%;background:transparent;color:#d9d9de;cursor:pointer}
.sf-video-call-ai-plus{font-size:20px;font-weight:350;line-height:1}
.sf-video-call-ai-plus:hover{background:#29292e;color:#fff}
.sf-video-call-ai-send{width:30px;height:30px;background:#d8d8dd;color:#050505}
.sf-video-call-ai-send:disabled{background:#29292e;color:#696971;cursor:default}
.sf-video-call-ai-send svg{width:14px;height:14px}
.sf-video-call-ai-input{width:100%;height:30px;max-height:66px;resize:none;overflow-y:auto;padding:7px 3px;border:0;background:transparent;color:#fff;font:500 10px/1.4 Inter;outline:none}
.sf-video-call-ai-input::placeholder{color:#686870}
.sf-video-call-ai-quick{position:absolute;z-index:8;left:10px;right:10px;bottom:62px;display:none;padding:6px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:#1a1a1e;box-shadow:0 14px 38px rgba(0,0,0,.48)}
.sf-video-call-ai-quick.on{display:grid}
.sf-video-call-ai-quick button{min-height:31px;padding:0 9px;border:0;border-radius:8px;background:transparent;color:#d3d3d8;font:650 9.5px Inter;text-align:left;cursor:pointer}
.sf-video-call-ai-quick button:hover{background:#29292e;color:#fff}
.sf-video-call-ai-thinking{display:flex;align-items:center;gap:6px;color:#85858e;font-size:9px}
.sf-video-call-ai-thinking:before{content:"";width:6px;height:6px;border-radius:50%;background:#39c77b;animation:sf-note-pulse 1s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.sf-video-call-note-state:before,.sf-video-call-ai-thinking:before{animation:none}.sf-video-call-notetaker-toggle:before{transition:none}}
.sf-video-call-section-label{margin:2px 0 8px;color:#777780;font-size:9.5px;font-weight:780;letter-spacing:.08em;text-transform:uppercase}
.sf-video-call-ai-row,.sf-video-call-person-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:9px;min-height:48px;border-bottom:1px solid rgba(255,255,255,.07)}
.sf-video-call-ai-row:last-child,.sf-video-call-person-row:last-child{border-bottom:0}
.sf-video-call-agent-avatar,.sf-video-call-person-avatar{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#2a2a30;color:#fff;font-size:10.5px;font-weight:780}
.sf-video-call-person-avatar{background:#9295a6;color:#1d2030}
.sf-video-call-row-copy{min-width:0}
.sf-video-call-row-copy b{display:block;overflow:hidden;color:#f5f5f6;font-size:11.5px;font-weight:720;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
.sf-video-call-row-copy span{display:block;margin-top:2px;overflow:hidden;color:#85858e;font-size:10px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
.sf-video-call-row-state{color:#777780;font-size:9.5px;font-weight:700}
.sf-video-call-row-state.live{color:#52cf87}
.sf-video-call-chat{min-height:0;display:flex;flex-direction:column}
.sf-video-call-chat-log{min-height:0;flex:1;overflow:auto;padding:14px 12px;scrollbar-width:none}
.sf-video-call-chat-empty{padding:18px 10px;color:#777780;font-size:11px;line-height:1.45;text-align:center}
.sf-video-call-chat-row{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:9px}
.sf-video-call-chat-row.out{align-items:flex-end}
.sf-video-call-chat-bubble{max-width:88%;padding:8px 10px;border-radius:12px;background:#2b2b30;color:#ededf0;font-size:10.5px;line-height:1.4;overflow-wrap:anywhere}
.sf-video-call-chat-row.out .sf-video-call-chat-bubble{background:#1888f2;color:#fff}
.sf-video-call-chat-meta{margin-top:3px;color:#6f6f77;font-size:8.5px;font-weight:650}
.sf-video-call-chat-compose{display:grid;grid-template-columns:minmax(0,1fr) 34px;gap:7px;padding:10px 11px 12px;border-top:1px solid rgba(255,255,255,.08)}
.sf-video-call-chat-compose textarea{width:100%;height:34px;max-height:76px;resize:none;padding:8px 10px;border:1px solid rgba(255,255,255,.11);border-radius:10px;background:#1a1a1e;color:#fff;font:500 10.5px/1.4 Inter;outline:none}
.sf-video-call-chat-send{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:0;border-radius:50%;background:#d8d8dd;color:#050505;cursor:pointer}
.sf-video-call-chat-send:disabled{background:#242429;color:#686870;cursor:default}
.sf-video-call-chat-send svg{width:14px;height:14px}
@media(max-width:1020px){.sf-video-call{--sf-call-side:258px}}
@media(max-width:760px){.sf-video-call-backdrop{padding:12px}.sf-video-call{width:96vw;height:92dvh;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 12px 230px}.sf-video-call-main{grid-row:1;border-radius:28px}.sf-vc-ready{left:12px;right:12px;top:12px;bottom:auto;width:auto}.sf-vc-popover{left:12px;right:12px;bottom:82px;width:auto}.sf-video-call-divider{display:none;grid-row:2}.sf-video-call-side{grid-row:3;border-radius:20px}.sf-video-call-side-head{min-height:50px;padding:8px 10px}.sf-video-call-panel-scroll{padding:10px 13px}}
@media(max-width:560px){.sf-video-call-copy{left:16px;top:16px}.sf-video-call-copy b{font-size:13px}.sf-video-call-copy span{font-size:10.5px}.sf-video-call-head{padding:16px}.sf-video-call-thumbnails{left:12px;top:66px;max-height:calc(100% - 132px);gap:6px}.sf-video-call-participant{width:88px;height:56px;border-radius:10px}.sf-video-call-active-name{left:12px;bottom:12px}.sf-video-call-controls{width:auto;max-width:calc(100% - 20px);bottom:10px;gap:6px;padding:6px}.sf-video-call-btn{width:42px;height:42px;min-width:42px}.sf-video-call-btn svg{width:22px;height:22px}}
.sf-client-flow-backdrop{position:fixed;inset:0;z-index:990;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.68);backdrop-filter:blur(10px) saturate(1.08);-webkit-backdrop-filter:blur(10px) saturate(1.08)}
.sf-client-flow{width:min(92vw,620px);max-height:min(82vh,760px);display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:24px;background:#111114;color:#fff;box-shadow:0 28px 90px rgba(0,0,0,.54)}
.sf-client-flow-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 18px;border-bottom:1px solid rgba(255,255,255,.10)}
.sf-client-flow-head h3{margin:0;color:#fff;font-size:15px;font-weight:760}
.sf-client-flow-head p{margin:4px 0 0;color:#9b9ba4;font-size:12px;line-height:1.35}
.sf-client-flow-body{padding:18px;overflow:auto}
.sf-client-flow-label{display:block;margin:0 0 8px;color:#9b9ba4;font-size:11px;font-weight:760;text-transform:uppercase;letter-spacing:.06em}
.sf-client-flow-checks{display:grid;gap:8px;margin-bottom:18px}
.sf-client-flow-check{display:flex;align-items:center;gap:10px;min-height:42px;padding:0 12px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:#17171a;color:#fff;font-size:13px;font-weight:650;cursor:pointer}
.sf-client-flow-check input{width:16px;height:16px;margin:0;accent-color:#fff}
.sf-client-flow-channels{display:flex;gap:7px;margin-bottom:16px}
.sf-client-flow-channels button{height:32px;padding:0 13px;border:1px solid rgba(255,255,255,.11);border-radius:999px;background:#17171a;color:#aaaab2;font:700 12px Inter;cursor:pointer}
.sf-client-flow-channels button.on{background:#d8d8dd;color:#050505;border-color:#d8d8dd}
.sf-client-flow textarea{width:100%;min-height:124px;box-sizing:border-box;resize:vertical;padding:12px 13px;border:1px solid rgba(255,255,255,.12);border-radius:15px;background:#17171a;color:#fff;font:500 13px/1.5 Inter;outline:none}
.sf-client-flow textarea:focus{border-color:rgba(255,255,255,.30)}
.sf-client-flow-thread{display:grid;gap:10px;margin-bottom:18px}
.sf-client-flow-message{max-width:84%;padding:10px 12px;border-radius:14px;background:#1b1b20;color:#fff;font-size:12.5px;line-height:1.45}
.sf-client-flow-message.out{margin-left:auto;background:#d8d8dd;color:#050505}
.sf-client-flow-message .meta{margin-top:6px;opacity:.58;font-size:10.5px;font-weight:650}
.sf-client-flow-empty{padding:18px;border:1px dashed rgba(255,255,255,.12);border-radius:14px;color:#92929a;font-size:12.5px;text-align:center}
.sf-client-flow-foot{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:14px 18px;border-top:1px solid rgba(255,255,255,.10)}
.sf-client-flow-foot button{height:36px;padding:0 15px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:#19191d;color:#fff;font:760 12px Inter;cursor:pointer}
.sf-client-flow-foot button.primary{background:#fff;border-color:#fff;color:#050505}
.sf-client-flow-foot button:hover{background:#d8d8dd;color:#050505}
.sf-order-detail-summary{border:1px solid rgba(255,255,255,.10);border-radius:14px;overflow:hidden}
.sf-order-detail-summary .row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;font-size:13.5px;color:#dcdce2;border-bottom:1px solid rgba(255,255,255,.08)}
.sf-order-detail-summary .row:last-child{border-bottom:none}
.sf-order-detail-summary .row.total{font-weight:700;color:#fff}
.sf-order-detail-summary .row .num{font-variant-numeric:tabular-nums}
.sf-client-task-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.sf-client-task-field{display:grid;gap:8px;min-width:0}
.sf-client-task-field.full{grid-column:1/-1}
.sf-client-task-field label{color:#9b9ba4;font-size:11px;font-weight:760;text-transform:uppercase;letter-spacing:.06em}
.sf-client-task-field input,.sf-client-task-field select,.sf-client-task-field textarea{width:100%;box-sizing:border-box;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#17171a;color:#fff;font:500 13px/1.45 Inter;outline:none}
.sf-client-task-field input,.sf-client-task-field select{height:42px;padding:0 12px}
.sf-client-task-field textarea{min-height:112px;padding:11px 12px;resize:vertical}
.sf-client-task-field input:focus,.sf-client-task-field select:focus,.sf-client-task-field textarea:focus{border-color:rgba(255,255,255,.32)}
.sf-client-task-notify{grid-column:1/-1;display:flex;align-items:flex-start;gap:10px;color:#d2d2d7;font-size:12.5px;font-weight:620;line-height:1.45;cursor:pointer}
.sf-client-task-notify input{width:16px;height:16px;flex:none;margin:1px 0 0;accent-color:#fff}
.sf-client-task-notify small{display:block;margin-top:2px;color:#81818a;font-size:11px;font-weight:540}
@media(max-width:560px){.sf-client-task-fields{grid-template-columns:1fr}.sf-client-task-field.full,.sf-client-task-notify{grid-column:auto}}
.sf-client-thread-backdrop{position:fixed;inset:0;z-index:995;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(0,0,0,.76);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.sf-client-thread{position:relative;width:min(82vw,820px);height:min(72dvh,560px);min-height:0;display:block;overflow:hidden;border:0;border-radius:36px;background:#111113;color:#fff;box-shadow:0 30px 90px rgba(0,0,0,.52)}
.sf-client-thread-head{position:absolute;z-index:3;isolation:isolate;left:0;right:0;top:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:172px;padding:18px 72px 28px;border:0;background:transparent;pointer-events:none}
.sf-client-thread-head:before{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(18,18,20,.42) 0%,rgba(18,18,20,.18) 48%,rgba(18,18,20,0) 100%);backdrop-filter:blur(12px) saturate(1.06);-webkit-backdrop-filter:blur(12px) saturate(1.06);mask-image:linear-gradient(180deg,#000 0%,#000 48%,rgba(0,0,0,.36) 72%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 48%,rgba(0,0,0,.36) 72%,transparent 100%)}
.sf-client-thread-tool{position:absolute;z-index:2;top:18px;width:36px;height:36px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(25,25,29,.62);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;pointer-events:auto;transition:background .14s ease,color .14s ease}
.sf-client-thread-tool.close{left:18px;font-size:20px;line-height:1}
.sf-client-thread-tool.video{right:18px}
.sf-client-thread-tool svg{width:17px;height:17px;display:block}
.sf-client-thread-tool:hover{background:#d8d8dd;color:#050505}
.sf-client-thread-avatar{position:relative;z-index:1;width:58px;height:58px;flex:none;overflow:hidden;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:#2a2a31;color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:760;pointer-events:auto}
.sf-client-thread-avatar img{width:100%;height:100%;display:block;object-fit:cover}
.sf-client-thread-name{position:relative;z-index:1;margin-top:8px;padding:0;border:0;background:transparent;color:#fff;font:760 14px/1.2 Inter;text-align:center}.sf-client-thread-name[type="button"]{cursor:pointer}.sf-client-thread-name[type="button"]:hover{text-decoration:underline;text-underline-offset:3px}
.sf-client-thread-company{position:relative;z-index:1;margin-top:3px;color:#8e8e97;font-size:11.5px;font-weight:600;line-height:1.2}
.sf-client-thread-log{position:absolute;z-index:1;inset:0;overflow-y:auto;margin:0;padding:212px 22px 112px;background:#111113;scrollbar-width:none;-ms-overflow-style:none}
.sf-client-thread-log::-webkit-scrollbar{display:none;width:0;height:0}
.sf-client-thread-day{margin:0 auto 18px;color:#777780;font-size:10.5px;font-weight:700;text-align:center}
.sf-client-thread-list{display:flex;flex-direction:column;gap:7px;min-height:100%}
.sf-client-thread-row{display:flex;flex-direction:column;align-items:flex-start}
.sf-client-thread-row.out{align-items:flex-end}
.sf-client-thread-bubble{position:relative;max-width:min(76%,540px);padding:9px 13px;border-radius:18px;background:#35353a;color:#fff;font-size:13px;font-weight:500;line-height:1.42;white-space:pre-wrap;overflow-wrap:anywhere}
.sf-client-thread-row.in .sf-client-thread-bubble{border-bottom-left-radius:5px}
.sf-client-thread-row.out .sf-client-thread-bubble{border-bottom-right-radius:5px;background:#0a84ff;color:#fff}
.sf-client-thread-receipt{min-height:15px;margin:4px 4px 0;color:#74747d;font-size:10px;font-weight:650}
.sf-client-thread-row.out .sf-client-thread-receipt{text-align:right}
.sf-client-thread-row.failed .sf-client-thread-receipt{color:#ff6b63}
.sf-client-thread-empty{flex:1;display:flex;align-items:center;justify-content:center;padding:32px;color:#74747d;font-size:12.5px;text-align:center}
.sf-client-thread-compose{position:absolute;z-index:4;left:14px;right:14px;bottom:14px;display:grid;grid-template-columns:38px minmax(0,1fr) 38px;align-items:end;gap:9px;min-height:64px;margin:0;padding:12px 14px;border:0;border-radius:26px;overflow:hidden;background:rgba(24,24,28,.68);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:none}
.sf-client-thread-add,.sf-client-thread-send{width:38px;height:38px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(27,27,31,.78);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.sf-client-thread-add{font-size:23px;font-weight:400;line-height:1}
.sf-client-thread-add:hover{background:#d8d8dd;color:#050505}
.sf-client-thread-send{border-color:#0a84ff;background:#0a84ff}
.sf-client-thread-send svg{width:17px;height:17px;display:block}
.sf-client-thread-send:disabled{border-color:#27272c;background:#27272c;color:#66666e;cursor:default}
.sf-client-thread-input{min-height:38px;max-height:116px;resize:none;overflow-y:auto;width:100%;padding:9px 8px;border:0;border-radius:20px;background:transparent;color:#fff;font:500 13px/1.4 Inter;outline:none}
.sf-client-thread-input::placeholder{color:#66666f}
.sf-client-thread-input:focus{outline:none}
@media(max-width:700px){.sf-client-thread-backdrop{padding:16px}.sf-client-thread{width:calc(100vw - 32px);height:min(78dvh,620px);border-radius:28px}.sf-client-thread-head{min-height:154px;padding:14px 64px 24px}.sf-client-thread-head:before{inset:0}.sf-client-thread-tool{top:14px}.sf-client-thread-tool.close{left:14px}.sf-client-thread-tool.video{right:14px}.sf-client-thread-log{padding:190px 14px 108px}.sf-client-thread-bubble{max-width:84%}.sf-client-thread-compose{left:10px;right:10px;bottom:10px;padding:11px 12px}}
.sf-cust-card-tabs{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 -6px 18px;overflow-x:auto}
.sf-cust-card-tabs button{display:inline-flex;align-items:center;height:34px;padding:0 12px;border:0;border-radius:999px;background:transparent;color:#777;font:700 13px Inter;white-space:nowrap;cursor:pointer}
.sf-cust-card-tabs button:hover,.sf-cust-card-tabs button.on{background:rgba(127,127,127,.2);color:var(--sf-ink)}
.sf-cust-info-groups{display:grid;gap:12px;text-align:left;margin-top:0;width:100%;max-width:100%;min-width:0}
.sf-cust-info-box{background:#fff;border-radius:12px;padding:4px 16px;color:#111;box-sizing:border-box;width:100%;max-width:100%;min-width:0;overflow:hidden}
.sf-cust-info-row{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:9px 0;border-top:1px solid rgba(0,0,0,.10);font-size:12.5px;line-height:1.25;min-width:0;width:100%}
.sf-cust-info-box .sf-cust-info-row:first-child{border-top:0}
.sf-cust-info-row>div{min-width:0;max-width:100%}
.sf-cust-info-row:first-child{border-top:0;padding-top:0}
.sf-cust-info-row:last-child{padding-bottom:0}
.sf-cust-info-row .label{color:#8a8a8f;font-size:11px;text-transform:none}
.sf-cust-info-row a,.sf-cust-info-row span.value{color:#111;text-decoration:none;font-weight:600;overflow-wrap:anywhere;word-break:break-word;max-width:100%;display:block}
.sf-cust-edit{position:absolute;right:18px;top:18px;height:38px;padding:0 16px;border:1px solid rgba(0,0,0,.08);border-radius:999px;background:rgba(255,255,255,.72);color:#333;font:700 13px Inter;cursor:pointer}
html[data-theme="dark"] #sf:has(.sf-cust-profile),
html[data-theme="dark"] .sf-content:has(.sf-cust-profile),
html[data-theme="dark"] #sf-page:has(.sf-cust-profile){background:#000000}
html[data-theme="dark"] .sf-content:has(.sf-cust-profile){border-left-color:transparent;border-top-color:transparent;border-top-left-radius:0;overflow-y:auto;overflow-x:hidden}
html[data-theme="dark"] .sf-cust-profile{--sf-surface:#111111;--sf-ink:#ffffff;--sf-sub:#c9c9cf;--sf-dim:#92929a;--sf-border:rgba(255,255,255,.14);--sf-border-2:rgba(255,255,255,.09);--sf-hover:#19191c}
html[data-theme="dark"] .sf-cust-profile:before{background:rgba(255,255,255,.10)}
html[data-theme="dark"] .sf-cust-card,
html[data-theme="dark"] .sf-cust-pagecard,
html[data-theme="dark"] .sf-cust-widget,
html[data-theme="dark"] .sf-cust-profile .sf-card{background:#0D0D0E;border-color:transparent;color:#ffffff;box-shadow:none}
html[data-theme="dark"] .sf-cust-pagecard,
html[data-theme="dark"] .sf-cust-widget,
html[data-theme="dark"] .sf-cust-profile .sf-card{border:1px solid var(--sf-border)}
html[data-theme="dark"] .sf-cust-card h2,
html[data-theme="dark"] .sf-cust-business,
html[data-theme="dark"] .sf-cust-side-section h4,
html[data-theme="dark"] .sf-cust-section-title h2,
html[data-theme="dark"] .sf-cust-pagecard h3,
html[data-theme="dark"] .sf-cust-widget h3,
html[data-theme="dark"] .sf-cust-widget .wv{color:#ffffff}
html[data-theme="dark"] .sf-cust-role,
html[data-theme="dark"] .sf-cust-contact a,
html[data-theme="dark"] .sf-cust-contact span,
html[data-theme="dark"] .sf-cust-side-list li,
html[data-theme="dark"] .sf-cust-pagecard p,
html[data-theme="dark"] .sf-cust-pagecard .meta,
html[data-theme="dark"] .sf-cust-widget p,
html[data-theme="dark"] .sf-cust-widget .wd,
html[data-theme="dark"] .sf-cust-widget .hint{color:#b4b4bd}
html[data-theme="dark"] .sf-cust-chip{background:#151518;border-color:rgba(255,255,255,.14);color:#d7d7dc}
html[data-theme="dark"] .sf-cust-back{background:#111111;border-color:rgba(255,255,255,.14);color:#ffffff;box-shadow:none}
html[data-theme="dark"] .sf-cust-back:hover{background:#19191c;border-color:rgba(255,255,255,.24)}
html[data-theme="dark"] .sf-cust-tabs{background:rgba(17,17,17,.78);backdrop-filter:blur(6px) saturate(1.02);-webkit-backdrop-filter:blur(6px) saturate(1.02)}
html[data-theme="dark"] .sf-cust-tabs button{color:#b4b4bd}
html[data-theme="dark"] .sf-cust-tabs button:hover,
html[data-theme="dark"] .sf-cust-tabs button.on{color:#ffffff}
html[data-theme="dark"] .sf-cust-tabs button.on:after,
html[data-theme="dark"] .sf-cust-tabs button:hover:after{background:#ffffff}
html[data-theme="dark"] .sf-cust-profile .sf-field{background:#151518;border-color:rgba(255,255,255,.14);color:#ffffff}
html[data-theme="dark"] .sf-cust-profile .sf-field::placeholder{color:#8d8d95}
/* Night mode mirrors the DAY layout exactly: inherit the base 200px-rail grid,
paddings, sticky rail, and rounded-top main panel from the un-themed rules —
override COLORS only. (The old dark rules forced a 380px rail column while the
rail is 200px, leaving a ~144px empty gap on the right.) */
html[data-theme="dark"] .sf-cust-side{background:#000000}
html[data-theme="dark"] .sf-cust-side .sf-cust-card{background:transparent;color:#ffffff;border:0;border-radius:0;box-shadow:none}
html[data-theme="dark"] .sf-cust-main{background:#0D0D0E}
html[data-theme="dark"] .sf-cust-main,
html[data-theme="dark"] .sf-cust-side .sf-cust-card{scrollbar-width:none;-ms-overflow-style:none}
html[data-theme="dark"] .sf-cust-main::-webkit-scrollbar,
html[data-theme="dark"] .sf-cust-side .sf-cust-card::-webkit-scrollbar{width:0;height:0;display:none}
html[data-theme="dark"] .sf-cust-profile:before{left:auto;right:380px;top:0;bottom:0}
html[data-theme="dark"] .sf-cust-side .sf-cust-back{left:18px;top:18px;width:38px;height:38px;background:#151518;border-color:rgba(255,255,255,.14);color:#ffffff}
html[data-theme="dark"] .sf-cust-side .sf-cust-back:hover{background:#202025;color:#ffffff;border-color:rgba(255,255,255,.22)}
html[data-theme="dark"] .sf-cust-side .sf-cust-avatar{width:86px;height:86px;margin:0 auto 10px;background:#8F93A3;font-size:30px;color:#2f3340}
html[data-theme="dark"] .sf-cust-side .sf-cust-avatar-wrap{margin-bottom:10px}
html[data-theme="dark"] .sf-cust-side .sf-cust-avatar-wrap .sf-cust-avatar{margin:0}
html[data-theme="dark"] .sf-cust-side .sf-cust-card h2{color:#ffffff;font-size:24px;font-weight:760}
html[data-theme="dark"] .sf-cust-side .sf-cust-business{color:#ffffff;margin-top:6px;font-size:13.5px;font-weight:760}
html[data-theme="dark"] .sf-cust-side .sf-cust-role{color:#a8a8b0;margin:4px 0 0;font-size:13px}
html[data-theme="dark"] .sf-cust-side .sf-cust-chip{background:#151518;border-color:rgba(255,255,255,.14);color:#d7d7dc}
html[data-theme="dark"] .sf-cust-side .sf-cust-chips{margin-top:14px}
html[data-theme="dark"] .sf-cust-side .sf-btn.primary{background:#ffffff;color:#050505;border-color:#ffffff}
html[data-theme="dark"] .sf-cust-side .sf-btn.primary:hover{background:#ededf0;border-color:#ededf0}
html[data-theme="dark"] .sf-cust-side .sf-cust-contact{display:none}
html[data-theme="dark"] .sf-cust-side .sf-cust-edit{background:#151518;border-color:rgba(255,255,255,.14);color:#ffffff}
html[data-theme="dark"] .sf-cust-side .sf-cust-edit:hover{background:#202025;border-color:rgba(255,255,255,.22)}
html[data-theme="dark"] .sf-cust-side .sf-cust-action{background:#17171a;color:#ffffff}
html[data-theme="dark"] .sf-cust-side .sf-cust-action.mute{color:#ffffff}
html[data-theme="dark"] .sf-cust-side .sf-cust-action:hover{background:#d8d8dd;color:#050505}
html[data-theme="dark"] .sf-cust-side .sf-cust-card-tabs button{color:#a8a8b0}
html[data-theme="dark"] .sf-cust-side .sf-cust-card-tabs button:hover,
html[data-theme="dark"] .sf-cust-side .sf-cust-card-tabs button.on{background:#1f1f24;color:#ffffff}
html[data-theme="dark"] .sf-cust-side .sf-cust-info-box{background:#17171a;color:#ffffff;border:0}
html[data-theme="dark"] .sf-cust-side .sf-cust-info-row{border-top-color:rgba(255,255,255,.10)}
html[data-theme="dark"] .sf-cust-side .sf-cust-info-row .label{color:#8f8f98}
html[data-theme="dark"] .sf-cust-side .sf-cust-info-row a,
html[data-theme="dark"] .sf-cust-side .sf-cust-info-row span.value{color:#ffffff}
html[data-theme="dark"] .sf-cust-metrics{background:#0D0D0E;border:1px solid var(--sf-border);color:#ffffff;box-shadow:none}
html[data-theme="dark"] .sf-cust-metric{border-left-color:rgba(255,255,255,.055)}
html[data-theme="dark"] .sf-cust-metric .ml{color:#ffffff}
html[data-theme="dark"] .sf-cust-metric .mv{color:rgba(255,255,255,.5)}
.sf-customers-index .sf-search-sm input{width:100%;min-width:0;border:0;outline:0;background:transparent;
color:inherit;font:500 13px Inter}
.sf-customers-index .sf-search-sm input::placeholder{color:inherit;opacity:1}
html:has(.sf-customers-index),body:has(.sf-customers-index),
#sf:has(.sf-customers-index),.sf-content:has(.sf-customers-index),
#sf-page:has(.sf-customers-index){overscroll-behavior-x:none}
.sf-customers-index .sf-card{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:none;
-webkit-overflow-scrolling:auto;scroll-behavior:auto;scrollbar-width:thin;scrollbar-color:#4a4a50 transparent}
.sf-customers-index .sf-card::-webkit-scrollbar{height:10px}
.sf-customers-index .sf-card::-webkit-scrollbar-track{background:transparent}
.sf-customers-index .sf-card::-webkit-scrollbar-thumb{background:#3b3b40;border:3px solid transparent;
border-radius:999px;background-clip:padding-box}
.sf-customers-index .sf-card::-webkit-scrollbar-thumb:hover{background:#55555c;background-clip:padding-box}
.sf-customers-index .sf-table{min-width:1390px}
.sf-customers-index .sf-table th{padding:15px 24px 12px;white-space:nowrap;border-bottom:1px solid var(--sf-border-2)}
.sf-customers-index .sf-table td{padding:22px 24px}
.sf-customers-index .sf-table th:nth-child(1),.sf-customers-index .sf-table td:nth-child(1){width:310px;min-width:310px}
.sf-customers-index .sf-table th:nth-child(2),.sf-customers-index .sf-table td:nth-child(2){width:275px;min-width:275px}
.sf-customers-index .sf-table th:nth-child(3),.sf-customers-index .sf-table td:nth-child(3){width:225px;min-width:225px}
.sf-customers-index .sf-table th:nth-child(4),.sf-customers-index .sf-table td:nth-child(4){width:130px;min-width:130px}
.sf-customers-index .sf-table th:nth-child(5),.sf-customers-index .sf-table td:nth-child(5){width:140px;min-width:140px}
.sf-customers-index .sf-table th:first-child,.sf-customers-index .sf-table td:first-child{position:sticky;left:0;
z-index:2;background:var(--sf-surface);box-shadow:10px 0 16px -16px rgba(0,0,0,.7)}
.sf-customers-index .sf-table th:first-child{z-index:3}
.sf-customers-index .sf-table tbody tr.crow:hover{background:transparent;box-shadow:none}
.sf-customers-index .sf-table tbody tr.crow:hover td:first-child{background:var(--sf-surface)}
.tayga-rewards-dashboard .sf-card{overflow:auto}
.tayga-rewards-dashboard .sf-table{min-width:980px}
.tayga-rewards-dashboard .sf-table th,.tayga-rewards-dashboard .sf-table td{padding:15px 18px;white-space:nowrap}
.tayga-rewards-dashboard .sf-table th:first-child,.tayga-rewards-dashboard .sf-table td:first-child{position:static;width:auto;min-width:220px}
.tayga-rewards-dashboard .tayga-consent{display:flex;gap:6px;flex-wrap:wrap}
.tayga-rewards-dashboard .tayga-source{max-width:180px;overflow:hidden;text-overflow:ellipsis}
.sf-customer-identity{display:flex;align-items:center;gap:12px;min-width:0}
.sf-customer-avatar{width:44px;height:44px;flex:0 0 44px;border-radius:50%;overflow:hidden;display:grid;
place-items:center;background:#8f93a3;color:#2f3340;font-size:14px;font-weight:760;letter-spacing:.02em}
.sf-customer-avatar img{width:100%;height:100%;display:block;object-fit:cover}
.sf-customer-copy{min-width:0}
.sf-customer-name{font-size:14px;font-weight:650;line-height:1.25;color:var(--sf-ink)}
.sf-customer-business{margin-top:3px;font-size:12.5px;color:var(--sf-sub);line-height:1.25}
.sf-customer-role{margin-top:3px;font-size:11.5px;color:var(--sf-sub);line-height:1.25}
.sf-customer-contact{display:grid;gap:4px;white-space:nowrap}
.sf-customer-contact .primary{font-weight:600;color:var(--sf-ink)}
.sf-customer-contact .secondary{font-size:12px;color:var(--sf-sub)}
.sf-customer-team{display:flex;align-items:center;gap:10px;white-space:nowrap}
.sf-customer-team-avatar{width:34px;height:34px;flex:0 0 34px;border-radius:50%;display:grid;place-items:center;
background:#555764;color:#f4f4f6;font-size:11px;font-weight:750}
.sf-customer-team-name{font-weight:620;line-height:1.25;color:var(--sf-ink)}
.sf-customer-team-role{margin-top:3px;font-size:12px;line-height:1.2;color:var(--sf-sub)}
html[data-theme="dark"] #sf:has(.sf-customers-index),
html[data-theme="dark"] .sf-content:has(.sf-customers-index),
html[data-theme="dark"] #sf-page:has(.sf-customers-index){background:#000000;color:#ffffff}
html[data-theme="dark"] .sf-content:has(.sf-customers-index){border-left-color:rgba(255,255,255,.08);
border-top-color:rgba(255,255,255,.08);border-top-left-radius:0}
html[data-theme="dark"] .sf-customers-index .sf-head h1{color:#ffffff}
html[data-theme="dark"] .sf-customers-index .sf-head p{color:#9898a1}
html[data-theme="dark"] .sf-customers-index .sf-btn.primary{background:#f2f2f4;border-color:#f2f2f4;color:#08080a;box-shadow:none}
html[data-theme="dark"] .sf-customers-index .sf-btn.primary:hover{background:#d8d8dd;border-color:#d8d8dd}
html[data-theme="dark"] .sf-customers-index .sf-metrics{background:#111113;border-color:rgba(255,255,255,.12);box-shadow:none}
html[data-theme="dark"] .sf-customers-index .sf-metric{border-right-color:rgba(255,255,255,.09)}
html[data-theme="dark"] .sf-customers-index .sf-metric .ml{color:#9898a1}
html[data-theme="dark"] .sf-customers-index .sf-metric .mv{color:#ffffff}
html[data-theme="dark"] .sf-customers-index .sf-metric .md.up{color:#6fd69a}
html[data-theme="dark"] .sf-customers-index .sf-metric .md.flat{color:#777780}
html[data-theme="dark"] .sf-customers-index .sf-tabs{background:#17171a;border-color:rgba(255,255,255,.10)}
html[data-theme="dark"] .sf-customers-index .sf-tab{color:#8f8f98}
html[data-theme="dark"] .sf-customers-index .sf-tab:hover{color:#ffffff}
html[data-theme="dark"] .sf-customers-index .sf-tab.on{background:#303034;color:#ffffff;box-shadow:none}
html[data-theme="dark"] .sf-customers-index .sf-tab .ct{color:inherit;opacity:.62}
html[data-theme="dark"] .sf-customers-index .sf-search-sm{background:#17171a;border-color:rgba(255,255,255,.11);color:#777780;box-shadow:none}
html[data-theme="dark"] .sf-customers-index .sf-search-sm:focus-within{border-color:rgba(255,255,255,.26);color:#ffffff}
html[data-theme="dark"] .sf-customers-index .sf-card{background:#111113;border-color:rgba(255,255,255,.12);box-shadow:none}
html[data-theme="dark"] .sf-customers-index .sf-table th:first-child,
html[data-theme="dark"] .sf-customers-index .sf-table td:first-child{background:#111113}
html[data-theme="dark"] .sf-customers-index .sf-table th{color:#92929a;border-bottom-color:rgba(255,255,255,.09)}
html[data-theme="dark"] .sf-customers-index .sf-table td{color:#ffffff;border-bottom-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .sf-customers-index .sf-customer-name,
html[data-theme="dark"] .sf-customers-index .sf-customer-contact .primary,
html[data-theme="dark"] .sf-customers-index .sf-customer-team-name{color:#ffffff}
html[data-theme="dark"] .sf-customers-index .sf-customer-business,
html[data-theme="dark"] .sf-customers-index .sf-customer-role,
html[data-theme="dark"] .sf-customers-index .sf-customer-contact .secondary,
html[data-theme="dark"] .sf-customers-index .sf-customer-team-role{color:#8f8f98}
html[data-theme="dark"] .sf-customers-index .sf-table .sf-cell-sub,
html[data-theme="dark"] .sf-customers-index .sf-table .sf-mut{color:#85858e}
html[data-theme="dark"] .sf-customers-index .sf-table tbody tr.crow:hover{background:transparent;box-shadow:none}
html[data-theme="dark"] .sf-customers-index .sf-table tbody tr.crow:hover td:first-child{background:#111113}
html[data-theme="dark"] .sf-customers-index .sf-tag{background:#202024;color:#d0d0d5}
html[data-theme="dark"] .sf-customers-index .sf-tag.info{background:#24242a;color:#ededf0}
html[data-theme="dark"] .sf-customers-index .sf-load{color:#777780}
@media(max-width:820px){.sf-cust-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.sf-cust-metric:nth-child(3){border-left:0;border-top:1px solid rgba(0,0,0,.10)}.sf-cust-metric:nth-child(4){border-top:1px solid rgba(0,0,0,.10)}}
@media(max-width:560px){.sf-cust-metrics{grid-template-columns:1fr}.sf-cust-metric{min-height:68px;border-left:0;border-top:1px solid rgba(0,0,0,.10)}.sf-cust-metric:first-child{border-top:0}}
@media(max-width:820px){html[data-theme="dark"] .sf-cust-metric:nth-child(3),html[data-theme="dark"] .sf-cust-metric:nth-child(4){border-top-color:rgba(255,255,255,.09)}}
@media(max-width:560px){html[data-theme="dark"] .sf-cust-metric{border-top-color:rgba(255,255,255,.09)}}
@media(max-width:1080px){.sf-cust-profile{grid-template-columns:minmax(0,1fr) 260px;gap:0}.sf-cust-profile:before{left:auto;right:312px}.sf-cust-avatar{width:112px;height:112px}.sf-cust-grid{grid-template-columns:1fr}.sf-cust-bento{grid-template-columns:repeat(4,minmax(0,1fr))}.sf-cust-bento .sf-cust-widget.bento-hero,.sf-cust-bento .sf-cust-widget.bento-chart{grid-column:span 4;grid-row:span 1;min-height:230px}.sf-cust-bento .sf-cust-widget.bento-team,.sf-cust-bento .sf-cust-widget.bento-side,.sf-cust-bento .sf-cust-widget.bento-compact,.sf-cust-bento .sf-cust-widget.bento-lg,.sf-cust-bento .sf-cust-widget.bento-wide,.sf-cust-bento .sf-cust-widget.bento-md,.sf-cust-bento .sf-cust-widget.bento-sm,.sf-cust-bento .sf-cust-widget.bento-tall{grid-column:span 2;grid-row:span 1;min-height:150px}.sf-cust-team .team-list{max-height:180px}}
@media(max-width:820px){.sf-cust-profile{display:block}.sf-cust-profile:before{display:none}.sf-cust-side{position:relative;top:auto;grid-row:auto;margin-bottom:20px}.sf-cust-main{grid-column:auto;grid-row:auto}.sf-cust-card{text-align:left}.sf-cust-back{left:24px;top:30px}.sf-cust-avatar{margin-left:0}.sf-cust-chips{justify-content:flex-start}.sf-cust-tabs{overflow-x:auto;gap:20px}.sf-cust-tabs button{white-space:nowrap}.sf-cust-overview-head{align-items:flex-start;flex-direction:column}.sf-cust-bento{grid-template-columns:1fr}.sf-cust-bento .sf-cust-widget.bento-hero,.sf-cust-bento .sf-cust-widget.bento-chart,.sf-cust-bento .sf-cust-widget.bento-team,.sf-cust-bento .sf-cust-widget.bento-side,.sf-cust-bento .sf-cust-widget.bento-compact,.sf-cust-bento .sf-cust-widget.bento-lg,.sf-cust-bento .sf-cust-widget.bento-wide,.sf-cust-bento .sf-cust-widget.bento-md,.sf-cust-bento .sf-cust-widget.bento-sm,.sf-cust-bento .sf-cust-widget.bento-tall{grid-column:1;grid-row:span 1;min-height:150px}.sf-cust-bento .sf-cust-widget.bento-hero .wv{font-size:30px}.sf-cust-now .now-title{font-size:28px}.sf-cust-now .now-actions{flex-wrap:wrap}}
.sf-bc{display:flex;align-items:center;gap:9px;margin-bottom:18px}
.sf-bc .bk,.sf-phead .bk{border:none;background:none;color:var(--sf-sub);cursor:pointer;font:600 13px Inter;display:flex;align-items:center;gap:4px;padding:0}
.sf-bc .bk:hover,.sf-phead .bk:hover{color:var(--sf-ink)}
.sf-bc h1{font-size:20px;font-weight:700;margin:0}
.sf-cardh2{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;border-bottom:0}
.sf-cardh2 h3{margin:0;font-size:14px;font-weight:650}
.sf-cardh2 .ha{display:flex;gap:8px}
.sf-pgroup{margin-top:22px}
.sf-pgroup:first-of-type{margin-top:14px}
.sf-pgrouph{margin:0 2px 9px}
.sf-pgrouph h2{display:flex;align-items:center;gap:8px;margin:0;font-size:14.5px;font-weight:680;letter-spacing:-.01em}
.sf-pgrouph .sf-gc{font-size:11px;font-weight:600;color:var(--sf-sub);background:var(--sf-border-2);border-radius:20px;padding:1px 8px;line-height:16px}
.sf-pgrouph p{margin:2px 0 0;font-size:12.5px;color:var(--sf-sub)}
/* Fixed column widths so Status / Type / Price line up across every group table */
.sf-pgroup .sf-table{table-layout:fixed}
.sf-pgroup .sf-table th:nth-child(2),.sf-pgroup .sf-table td:nth-child(2){width:150px}
.sf-pgroup .sf-table th:nth-child(3),.sf-pgroup .sf-table td:nth-child(3){width:150px}
.sf-pgroup .sf-table th:nth-child(4),.sf-pgroup .sf-table td:nth-child(4){width:130px}
.sf-cardb{padding:6px 16px 14px}
.sf-line{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--sf-border-2)}
.sf-line:last-child{border-bottom:none}
.sf-line .thumb{width:38px;height:38px;border-radius:8px;background:var(--sf-hover);flex:none;display:flex;align-items:center;justify-content:center;color:var(--sf-dim)}
.sf-line .thumb svg{width:18px;height:18px;fill:currentColor;stroke:none}
.sf-line .li-t{flex:1;min-width:0}.sf-line .li-t .nm{font-size:13.5px;font-weight:550}.sf-line .li-t .sub{font-size:12px;color:var(--sf-dim)}
.sf-qty{display:flex;align-items:center;border:1px solid var(--sf-border);border-radius:8px;overflow:hidden;flex:none}
.sf-qty button{width:28px;height:30px;border:none;background:var(--sf-surface);cursor:pointer;font-size:15px;color:var(--sf-ink);line-height:1}
.sf-qty button:hover{background:var(--sf-hover)}
.sf-qty .qv{min-width:34px;text-align:center;font:600 13px Inter;border-left:1px solid var(--sf-border);border-right:1px solid var(--sf-border);height:30px;line-height:30px}
.sf-line .li-amt{width:92px;text-align:right;font-weight:600;font-variant-numeric:tabular-nums;flex:none}
.sf-x{border:none;background:none;color:var(--sf-dim);cursor:pointer;font-size:17px;padding:2px 4px;flex:none;line-height:1}
.sf-x:hover{color:#8e1f0b}
.sf-pay{width:100%;font-size:13.5px;border-collapse:collapse}
.sf-pay td{padding:8px 0;vertical-align:top}
.sf-pay tr td:last-child{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.sf-pay .lk{color:#1c4cd1;cursor:pointer;font-weight:550}.sf-pay .lk:hover{text-decoration:underline}
.sf-pay .mut{color:var(--sf-dim)}
.sf-pay .tot td{border-top:1px solid var(--sf-border-2);padding-top:12px;font-weight:700;font-size:15px}
.sf-iform{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:4px 0 10px}
.sf-iform input,.sf-iform select{height:32px;border:1px solid var(--sf-border);border-radius:8px;padding:0 9px;font:500 13px Inter;outline:none;background:var(--sf-surface)}
.sf-iform input:focus,.sf-iform select:focus{border-color:#1c4cd1}
.sf-iform .gw{flex:1;min-width:90px}
.sf-emptyrow{font-size:13px;color:var(--sf-dim);padding:14px 0;text-align:center}
.sf-field{width:100%;height:36px;border:1px solid var(--sf-border);border-radius:8px;padding:0 11px;font:500 13.5px Inter;outline:none;box-sizing:border-box;background:var(--sf-surface)}
.sf-field:focus{border-color:#1c4cd1}
textarea.sf-field{height:auto;min-height:60px;padding:9px 11px;resize:vertical;line-height:1.45}
.sf-cust .nm{font-weight:600;font-size:13.5px}.sf-cust{font-size:13px;line-height:1.5;color:var(--sf-sub)}
.sf-cust a{color:#1c4cd1;cursor:pointer}
.sf-actions-bar{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:18px;position:relative}
.sf-menu{position:absolute;bottom:calc(100% + 6px);right:0;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:10px;box-shadow:0 14px 38px rgba(0,0,0,.2);padding:5px;min-width:180px;z-index:20}
.sf-menu[hidden]{display:none}
.sf-menu button{display:flex;align-items:center;gap:9px;width:100%;border:none;background:none;text-align:left;padding:9px 10px;border-radius:8px;font:550 13.5px Inter;cursor:pointer;color:var(--sf-ink)}
.sf-menu button:hover{background:var(--sf-hover)}
.sf-pick{position:fixed;inset:0;z-index:300;display:flex;align-items:flex-start;justify-content:center;padding:78px 16px;background:rgba(0,0,0,.32)}
.sf-pick[hidden]{display:none}
.sf-pick .pk{width:min(94vw,520px);max-height:70vh;display:flex;flex-direction:column;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:14px;box-shadow:0 28px 80px rgba(0,0,0,.34);overflow:hidden}
.sf-pk-h{padding:14px 16px;border-bottom:1px solid var(--sf-border-2);font-weight:650;display:flex;justify-content:space-between;align-items:center}
.sf-pk-h .sf-x{font-size:20px}
.sf-pk-list{overflow-y:auto}
.sf-pk-row{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--sf-border-2);cursor:pointer}
.sf-pk-row:last-child{border-bottom:none}.sf-pk-row:hover{background:var(--sf-hover)}
.sf-pk-row .nm{flex:1;font-size:13.5px}.sf-pk-row .nm .sub{font-size:12px;color:var(--sf-dim)}
.sf-pk-row .pr{font-weight:600;font-variant-numeric:tabular-nums}
.sf-pk-search{padding:12px 16px;border-bottom:1px solid var(--sf-border-2)}
.sf-pk-empty{padding:22px 16px;text-align:center;font-size:13px;color:var(--sf-dim)}
/* Invoice quick-send widget (chat-triggered) */
.sf-inv-ov{position:fixed;inset:0;z-index:320;display:flex;align-items:flex-start;justify-content:center;padding:78px 16px;background:rgba(0,0,0,.32)}
.sf-inv-ov[hidden]{display:none}
html[data-theme="dark"] .sf-inv-ov{--sf-bg:#000;--sf-surface:#0F0F0F;--sf-ink:#fff;--sf-sub:#b4b4bd;--sf-dim:#85858f;--sf-border:rgba(255,255,255,.10);--sf-border-2:rgba(255,255,255,.06);--sf-hover:#1b1b1f;--sf-sel:#1f1f23;background:rgba(0,0,0,.72);color:var(--sf-ink)}
.svc-data-overlay{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:24px;background:rgba(24,24,27,.24);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:svcDataFade .18s ease both}
.svc-data-modal{--svc-panel:#fff;--svc-card:#fff;--svc-soft:#f7f7f8;--svc-hover:#f1f1f3;--svc-line:#d9d9dd;--svc-divider:rgba(24,24,27,.1);--svc-muted:#8b8b92;--svc-ink:#56565d;--svc-strong:#2d2d31;--svc-selected:#343438;width:min(900px,calc(100vw - 48px));max-height:min(840px,calc(100vh - 48px));display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--svc-line);border-radius:28px;background:var(--svc-panel);color:var(--svc-ink);box-shadow:0 28px 80px rgba(20,20,24,.22);animation:svcDataIn .28s cubic-bezier(.2,.8,.2,1) both}
html[data-theme="dark"] .svc-data-modal{--svc-panel:#181818;--svc-card:#1b1b1b;--svc-soft:#151515;--svc-hover:#202020;--svc-line:#3e3e3e;--svc-divider:rgba(255,255,255,.08);--svc-muted:#969696;--svc-ink:#b9b9bf;--svc-strong:#fff;--svc-selected:#fff;border-color:rgba(255,255,255,.09);box-shadow:0 34px 100px rgba(0,0,0,.52)}
.svc-data-head{display:flex;align-items:flex-start;gap:18px;padding:28px 30px 22px;border-bottom:1px solid var(--svc-divider)}
.svc-data-title{min-width:0;flex:1}.svc-data-title h2{margin:0;color:var(--svc-strong);font:650 26px/1.12 Inter,sans-serif;letter-spacing:-.035em}.svc-data-title p{margin:8px 0 0;color:var(--svc-muted);font:400 14px/1.45 Inter,sans-serif}
.svc-data-close{width:38px;height:38px;flex:none;border:0;border-radius:12px;background:transparent;color:var(--svc-muted);font-size:26px;line-height:1;cursor:pointer}.svc-data-close:hover{background:var(--svc-hover);color:var(--svc-strong)}
.svc-data-tabs{display:flex;gap:6px;padding:0 30px;border-bottom:1px solid var(--svc-divider)}
.svc-data-tab{position:relative;height:54px;padding:0 17px;border:0;background:transparent;color:var(--svc-muted);font:600 14px Inter,sans-serif;cursor:pointer}.svc-data-tab.on{color:var(--svc-strong)}.svc-data-tab.on:after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;border-radius:2px;background:var(--svc-selected)}
.svc-data-body{min-height:0;overflow:auto;padding:26px 30px 30px;scrollbar-width:none}.svc-data-body::-webkit-scrollbar{display:none}
.svc-data-step{display:flex;align-items:center;gap:8px;margin-bottom:18px;color:var(--svc-muted);font:600 11px Inter,sans-serif;letter-spacing:.04em;text-transform:uppercase}.svc-data-step span{display:inline-grid;place-items:center;width:22px;height:22px;border:1px solid var(--svc-line);border-radius:8px;transition:background .18s ease,border-color .18s ease,color .18s ease}.svc-data-step span.current{border-color:var(--svc-selected);color:var(--svc-strong)}.svc-data-step span.done{border-color:var(--svc-selected);background:var(--svc-selected);color:var(--svc-panel)}.svc-data-step b{color:var(--svc-strong)}.svc-data-step i{width:28px;height:1px;background:var(--svc-line)}.svc-data-step i.done{background:var(--svc-selected)}
.svc-data-label{display:block;margin:0 0 9px;color:var(--svc-ink);font:600 12px Inter,sans-serif}.svc-data-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.svc-data-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-data-choice{min-height:104px;padding:17px;border:1px solid var(--svc-line);border-radius:19px;background:var(--svc-card);color:var(--svc-strong);text-align:left;cursor:pointer;transition:border-color .16s ease,background .16s ease,transform .16s ease}.svc-data-choice:hover{background:var(--svc-hover);transform:translateY(-1px)}.svc-data-choice.on{border-color:var(--svc-selected);box-shadow:inset 0 0 0 1px var(--svc-selected)}.svc-data-choice strong,.svc-data-choice small{display:block}.svc-data-choice strong{font:600 14px/1.25 Inter,sans-serif}.svc-data-choice small{margin-top:7px;color:var(--svc-muted);font:400 11.5px/1.4 Inter,sans-serif}
.svc-data-upload{position:relative;min-height:132px;margin-top:20px;padding:22px;border:1px dashed var(--svc-line);border-radius:20px;display:flex;align-items:center;gap:18px;background:var(--svc-soft);transition:border-color .16s ease,background .16s ease}.svc-data-upload.drag{border-color:var(--svc-selected);background:var(--svc-hover)}.svc-data-upload input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.svc-data-upload-icon{width:48px;height:48px;flex:none;display:grid;place-items:center;border:1px solid var(--svc-line);border-radius:16px;color:var(--svc-ink)}.svc-data-upload-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7}.svc-data-upload-copy{min-width:0;flex:1}.svc-data-upload-copy strong{display:block;color:var(--svc-strong);font:600 14px Inter,sans-serif}.svc-data-upload-copy span{display:block;margin-top:6px;color:var(--svc-muted);font:400 12px/1.4 Inter,sans-serif}.svc-data-file{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.svc-data-browse{height:42px;padding:0 16px;border:1px solid var(--svc-line);border-radius:13px;background:var(--svc-card);color:var(--svc-strong);font:600 12px Inter,sans-serif;cursor:pointer}
.svc-data-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.svc-data-select{width:100%;height:46px;padding:0 14px;border:1px solid var(--svc-line);border-radius:13px;background:var(--svc-card);color:var(--svc-strong);font:500 13px Inter,sans-serif;outline:0}.svc-data-select:focus{border-color:var(--svc-selected)}
.svc-data-note{margin-top:15px;color:var(--svc-muted);font:400 12px/1.5 Inter,sans-serif}.svc-data-note.warn{padding:12px 14px;border:1px solid rgba(255,183,77,.28);border-radius:13px;background:rgba(255,183,77,.07);color:#d8b375}
.svc-data-map{margin-top:18px;padding:18px;border:1px solid var(--svc-line);border-radius:18px;background:var(--svc-soft)}.svc-data-map .sf-field{height:42px;background:var(--svc-card)!important;border-color:var(--svc-line)!important;color:var(--svc-strong)!important}.svc-data-map .sf-secsub{color:var(--svc-muted)}
.svc-data-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:18px}.svc-data-stat{padding:15px;border:1px solid var(--svc-line);border-radius:16px;background:var(--svc-soft)}.svc-data-stat b,.svc-data-stat span{display:block}.svc-data-stat b{color:var(--svc-strong);font:650 22px/1 Inter,sans-serif}.svc-data-stat span{margin-top:7px;color:var(--svc-muted);font:500 10.5px Inter,sans-serif;text-transform:uppercase;letter-spacing:.045em}
.svc-data-errors{margin-top:13px;padding:13px;border:1px solid rgba(255,90,82,.25);border-radius:14px;background:rgba(255,90,82,.07);color:#ff8b84;font:400 11.5px/1.55 Inter,sans-serif}
.svc-data-history{margin-top:24px;padding-top:20px;border-top:1px solid var(--svc-divider)}.svc-data-history h3{margin:0 0 10px;color:var(--svc-strong);font:600 13px Inter,sans-serif}.svc-data-history-row{display:flex;align-items:center;gap:10px;min-height:54px;padding:8px 0;border-bottom:1px solid var(--svc-divider)}.svc-data-history-copy{min-width:0;flex:1}.svc-data-history-copy strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--svc-strong);font:550 12.5px Inter,sans-serif}.svc-data-history-copy span{display:block;margin-top:5px;color:var(--svc-muted);font:400 11px Inter,sans-serif}.svc-data-mini{height:34px;padding:0 11px;border:1px solid var(--svc-line);border-radius:10px;background:var(--svc-card);color:var(--svc-strong);font:600 10.5px Inter,sans-serif;cursor:pointer}
.svc-data-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 30px;border-top:1px solid var(--svc-divider);background:var(--svc-panel)}.svc-data-foot-copy{color:var(--svc-muted);font:400 11.5px/1.4 Inter,sans-serif}.svc-data-actions{display:flex;gap:10px;margin-left:auto}.svc-data-btn{min-height:46px;padding:0 18px;border:1px solid var(--svc-line);border-radius:14px;background:var(--svc-card);color:var(--svc-strong);font:600 13px Inter,sans-serif;cursor:pointer}.svc-data-btn:hover{background:var(--svc-hover)}.svc-data-btn.primary{min-width:190px;border-color:var(--svc-selected);background:var(--svc-selected);color:var(--svc-panel)}.svc-data-btn.primary:hover{filter:brightness(.9)}.svc-data-btn:disabled{opacity:.38;cursor:not-allowed;transform:none}
.svc-data-success{padding:34px 10px 28px;text-align:center}.svc-data-success-mark{width:62px;height:62px;margin:0 auto 18px;display:grid;place-items:center;border-radius:22px;background:var(--svc-selected);color:var(--svc-panel);font-size:28px}.svc-data-success h3{margin:0;color:var(--svc-strong);font:650 23px Inter,sans-serif}.svc-data-success p{max-width:480px;margin:10px auto 0;color:var(--svc-muted);font:400 13px/1.55 Inter,sans-serif}
@keyframes svcDataFade{from{opacity:0}to{opacity:1}}@keyframes svcDataIn{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:760px){.svc-data-overlay{padding:10px;place-items:end center}.svc-data-modal{width:100%;max-height:calc(100vh - 20px);border-radius:24px}.svc-data-head{padding:22px 20px 18px}.svc-data-title h2{font-size:22px}.svc-data-tabs{padding:0 20px}.svc-data-body{padding:22px 20px}.svc-data-grid{grid-template-columns:1fr 1fr}.svc-data-row{grid-template-columns:1fr}.svc-data-stats{grid-template-columns:1fr 1fr}.svc-data-upload{align-items:flex-start;flex-wrap:wrap}.svc-data-upload-copy{min-width:180px}.svc-data-browse{width:100%}.svc-data-foot{padding:15px 20px;align-items:stretch;flex-direction:column}.svc-data-actions{width:100%;margin:0}.svc-data-btn{flex:1}.svc-data-foot-copy{display:none}}
.sf-inv{width:min(94vw,460px);background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:14px;box-shadow:0 28px 80px rgba(0,0,0,.34);overflow:hidden}
.sf-inv-h{padding:14px 16px;border-bottom:1px solid var(--sf-border-2);font-weight:650;display:flex;justify-content:space-between;align-items:center}
.sf-inv-h .sf-x{font-size:20px}
.sf-inv-b{padding:16px;max-height:60vh;overflow-y:auto}
.sf-inv-f{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--sf-border-2)}
.sf-inv-to{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px;font-size:13.5px}
.sf-inv-to .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--sf-dim);padding-top:3px;width:26px;flex:none}
.sf-inv-to .sub{font-size:12px;color:var(--sf-dim);margin-top:2px}
.sf-inv-card{border:1px solid var(--sf-border-2);border-radius:10px;overflow:hidden}
.sf-inv-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 13px;border-bottom:1px solid var(--sf-border-2);font-size:13.5px}
.sf-inv-row:last-child{border-bottom:none}
.sf-inv-row.tot{background:var(--sf-hover);font-weight:600}
.sf-inv-row .mut{color:var(--sf-dim)}
.sf-inv-amt{display:flex;align-items:center;gap:3px}
.sf-field.sm{height:30px;font-size:13px}
#inv-desc{flex:1}
.sf-inv-amt .sf-field.sm{width:96px;text-align:right}
.sf-inv-due{padding:9px 13px;font-size:11.5px;color:var(--sf-dim)}
.sf-inv-q{font-size:13.5px;margin-bottom:10px}
.sf-inv-miss{font-size:14px}.sf-inv-miss .sub{font-size:12.5px;color:var(--sf-dim);margin-top:5px}
.sf-inv-f .sf-btn[disabled]{opacity:.45;cursor:not-allowed}
/* Checkout links + payments reuse the dense Orders language: flat metric
ribbon, compact controls, hairline table and one centered creation drawer. */
.commerce-index .sf-metrics{margin-bottom:18px}
.commerce-index .sf-toolbar{display:flex;align-items:center;gap:10px;margin:0 0 16px;padding:0;background:transparent;border:0}
.commerce-index .commerce-search{flex:1;min-width:190px;position:relative}
.commerce-index .commerce-search svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:17px;height:17px;fill:none;stroke:var(--sf-dim);stroke-width:1.9}
.commerce-index .commerce-search input,.commerce-select{height:38px;box-sizing:border-box;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:550 13px Inter;outline:none}
.commerce-index .commerce-search input{width:100%;padding:0 13px 0 40px}
.commerce-index .commerce-search input:focus,.commerce-select:focus{border-color:var(--sf-dim)}
.commerce-select{padding:0 34px 0 13px;min-width:128px;cursor:pointer}
.commerce-name{display:flex;flex-direction:column;gap:3px;min-width:160px}
.commerce-name b{font-weight:650;color:var(--sf-ink)}
.commerce-name span{font-size:11.5px;color:var(--sf-dim)}
.commerce-actions{display:flex;align-items:center;justify-content:flex-end;gap:5px}
.commerce-iconbtn{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);color:var(--sf-ink);cursor:pointer}
.commerce-iconbtn:hover{background:var(--sf-hover)}
.commerce-iconbtn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.commerce-loading,.commerce-note{padding:42px 18px;text-align:center;color:var(--sf-dim);font-size:13px}
.commerce-note{padding:12px 0;text-align:left}
.checkout-builder{width:min(94vw,680px)}
.checkout-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.checkout-grid .wide{grid-column:1/-1}
.checkout-field{display:flex;flex-direction:column;gap:6px}
.checkout-field>span{font-size:12px;font-weight:650;color:var(--sf-sub)}
.checkout-field .sf-field{width:100%;box-sizing:border-box}
.checkout-choice{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.checkout-choice button{min-height:68px;padding:12px;text-align:left;border:1px solid var(--sf-border);border-radius:11px;background:var(--sf-surface);color:var(--sf-ink);cursor:pointer;font:inherit}
.checkout-choice button.on{border-color:var(--sf-ink);box-shadow:inset 0 0 0 1px var(--sf-ink)}
.checkout-choice button b{display:block;font-size:13.5px}.checkout-choice button span{display:block;margin-top:4px;color:var(--sf-dim);font-size:11.5px;line-height:1.35}
.checkout-summary{display:flex;justify-content:space-between;gap:18px;padding:12px 13px;border-radius:10px;background:var(--sf-hover);font-size:12px;color:var(--sf-sub)}
.checkout-summary b{display:block;color:var(--sf-ink);font-size:15px;margin-top:3px}
.checkout-live{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--sf-dim);margin-top:10px}
.checkout-live::before{content:"";width:7px;height:7px;border-radius:50%;background:#34C759}
.checkout-live.draft::before{background:#FF9500}
.service-checkout-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.service-checkout-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border:1px solid var(--sf-border-2);border-radius:9px}
.service-checkout-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--sf-sub)}
@media(max-width:760px){.commerce-index .sf-toolbar{align-items:stretch;flex-wrap:wrap}.commerce-index .commerce-search{order:-1;flex-basis:100%}.checkout-grid{grid-template-columns:1fr}.checkout-grid .wide{grid-column:auto}.checkout-choice{grid-template-columns:1fr}.commerce-index .sf-card{overflow-x:auto}}
/* Pill / tag field (Source, Tags) */
.sf-pillf{position:relative}
.sf-pillf-menu{position:absolute;left:0;right:0;top:40px;z-index:60;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,.14);overflow:hidden;display:none}
.sf-pillf-menu.on{display:block}
.sf-pillf-opt{padding:8px 12px;font-size:13px;cursor:pointer}
.sf-pillf-opt:hover{background:var(--sf-hover)}
.sf-pillf-opt .new{color:var(--sf-dim)}
.sf-pillf-tags{display:none;flex-wrap:wrap;gap:6px;margin-top:9px;padding-top:10px;border-top:1px solid var(--sf-border-2)}
.sf-pill{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 5px 0 10px;border-radius:8px;background:var(--sf-hover);color:var(--sf-ink);font-size:12.5px}
.sf-pill .x{display:flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:5px;cursor:pointer;color:var(--sf-dim);font-size:13px;line-height:1}
.sf-pill .x:hover{background:rgba(0,0,0,.08);color:var(--sf-ink)}
/* Token usage tiers — profit line + custom top-up field */
.sf-tok-profit{font-size:11.5px;color:var(--sf-dim);margin-top:4px}
.sf-tok-profit .pf{color:#0a7a3c;font-weight:600}
.sf-tok-custom{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:13px 16px;border:1px dashed var(--sf-border);border-radius:10px;margin-top:11px}
.sf-tok-custom .sf-tok-t{font-size:13.5px;font-weight:600}
.sf-tok-r{display:flex;align-items:center;gap:8px}
.sf-tok-cur{color:var(--sf-dim)}
.sf-tok-r .sf-field{max-width:150px}
.sf-tok-custom .sf-tok-profit{flex-basis:100%;margin-top:2px}
/* ---- product editor ---- */
.sf-flabel{display:block;font-size:13px;font-weight:550;color:var(--sf-sub);margin:12px 0 5px}
.sf-flabel:first-child{margin-top:0}
.sf-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sf-grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.sf-margin{display:flex;gap:24px;margin-top:12px;font-size:13px}
.sf-margin .mk{color:var(--sf-sub)}.sf-margin .mv{font-weight:650;color:var(--sf-ink)}
.sf-check{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--sf-ink);margin:10px 0;cursor:pointer}
.sf-check input{width:15px;height:15px}
/* Orders bulk-select column + Shopify-style dark bulk-action bar */
.sf-table th.selc,.sf-table td.selc{width:36px;padding-right:0;text-align:center;vertical-align:middle}
.sf-table .sf-selrow,.sf-table .sf-selall{width:15px;height:15px;cursor:pointer;accent-color:var(--sf-accent,#1a1a1a)}
.sf-bulkbar{display:none;align-items:center;gap:8px;margin:0 0 12px;padding:8px 10px 8px 14px;background:var(--sf-ink,#1a1a1a);color:var(--sf-surface);border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.sf-bulkbar.on{display:flex}
.sf-bulkbar .bb-n{font-size:13px;margin-right:6px;white-space:nowrap}
.sf-bulkbar .bb-n b{font-weight:600}
.sf-bulkbar .sf-btn{height:28px;padding:0 11px;font-size:12.5px;background:#fff;color:#1a1a1a;border:0}
.sf-bulkbar .sf-btn:hover{background:#f1f1f1}
.sf-bulkbar .bb-x{margin-left:auto;display:flex;align-items:center;justify-content:center;width:26px;height:26px;background:transparent;border:0;color:var(--sf-surface);opacity:.7;cursor:pointer;font-size:13px;border-radius:8px}
.sf-bulkbar .bb-x:hover{opacity:1;background:rgba(255,255,255,.12)}
.sf-media{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.sf-media .mthumb{width:74px;height:74px;border-radius:10px;border:1px solid var(--sf-border);background:var(--sf-hover) center/cover no-repeat;position:relative}
.sf-media .mthumb .sf-x{position:absolute;top:-7px;right:-7px;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:50%;width:20px;height:20px;font-size:13px;display:flex;align-items:center;justify-content:center}
.sf-media .madd{width:74px;height:74px;border-radius:10px;border:1.5px dashed var(--sf-border);display:flex;align-items:center;justify-content:center;color:var(--sf-dim);font-size:24px;cursor:pointer;background:none}
.sf-media .madd:hover{border-color:var(--sf-sub);color:var(--sf-sub)}
select.sf-field{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a8a8a' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:15px;padding-right:30px}
/* ---- sticky New chat header + Search chats (sub) ---- */
/* gray divider below mirrors the bottom account section (.sf-acct border-top) */
/* "Search chats" is a .sf-nav-item.sub child — no icon, indented, opens when home is active */
.sf-chat-top{position:sticky;top:0;z-index:30;background:var(--sf-bg);display:flex;flex-direction:column;gap:1px;padding-bottom:8px;margin-bottom:6px;border-bottom:1px solid var(--sf-border)}
.sf-chatsub{display:flex} /* Search chats stays nested under New chat (sidebar is hidden on the chat view itself) */
/* ---- Recents (past AI conversations) with status dots ---- */
.sf-recents{position:relative;max-height:252px;overflow-y:auto;overscroll-behavior:none;border-radius:16px;padding:4px;margin:2px 2px 0;scrollbar-width:none;-ms-overflow-style:none;
-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 22px,#000 calc(100% - 22px),transparent 100%);
mask-image:linear-gradient(to bottom,transparent 0,#000 22px,#000 calc(100% - 22px),transparent 100%)}
.sf-recents::-webkit-scrollbar{width:0;height:0;display:none}
/* fade only where there is more to scroll — top fade hides at the top, bottom fade hides at the bottom */
.sf-recents.at-top{-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 22px),transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 22px),transparent 100%)}
.sf-recents.at-bottom{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 22px,#000 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 22px,#000 100%)}
.sf-recents.at-top.at-bottom{-webkit-mask-image:none;mask-image:none}
/* One divider closes the complete Chats group after every folder and conversation. */
.sf-recents-end{height:1px;background:var(--sf-border);margin:7px 2px 8px}
.sf-recent{position:relative;display:flex;align-items:center;gap:10px;height:30px;padding:0 9px;border-radius:8px;border:0;background:none;cursor:pointer;width:100%;text-align:left;font:500 13px Inter;color:var(--sf-sub)}
/* 1px left rail: ONE continuous guide track (.sf-railtrack) spans the whole list with no
per-row gaps, and a single white thumb (.sf-railthumb) marks the active item and SLIDES
to whichever row you click. Thumb height tracks the label text. Hover paints a #3E3E40
segment + label on that row (no shade/scrim). */
.sf-recents-inner{position:relative}
.sf-railtrack{display:none}
html[data-theme="dark"] .sf-railtrack{background:#272728}
.sf-railthumb{position:absolute;left:6px;top:0;width:1px;height:16px;background:var(--sf-ink);pointer-events:none;will-change:transform}
.sf-railthumb[hidden]{display:none}
.sf-recent.on{background:none;color:var(--sf-ink);font-weight:650}
.sf-recent:hover:not(.on){color:#3E3E40}
.sf-recent:hover:not(.on)::after{content:none}
.sf-recent .rdot{width:8px;height:8px;border-radius:50%;flex:none;box-sizing:border-box;border:1.5px solid var(--sf-dim);margin:0 5px 0 14px}
.sf-recent .rdot.y{background:#e8b33e;border-color:#e8b33e}
.sf-recent .rdot.b{background:#3b82f6;border-color:#3b82f6}
/* ---- Recents loading state: dotmatrix "Prism Bloom" (square-14) ----
Ported 1:1 from @dotmatrix/dotm-square-14 (dotmatrix.zzzzshawn.cloud, MIT). React/
Tailwind registry item; this dashboard is vanilla, so the 5x5 grid + frame masks are
reproduced inline (see the JS mask ticker). When a Recents item is loading, .rdot is
swapped for .sf-rload so the dot vanishes and this 5x5 dot grid blooms. */
.sf-recent .sf-rload{margin:0 1px 0 10px}
.dmx-root{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;flex:none;color:var(--sf-ink);
--dmx-speed:1;--dmx-dot-size:2px;--dmx-opacity-base:.16;--dmx-opacity-mid:.32;--dmx-opacity-peak:1}
.dmx-grid{display:grid;grid-template-columns:repeat(5,2px);grid-template-rows:repeat(5,2px);gap:1.5px}
.dmx-dot{width:2px;height:2px;border-radius:999px;background:currentColor;
opacity:calc(.5*(var(--dmx-opacity-base)+var(--dmx-opacity-mid)));--dmx-bloom-level:0;will-change:opacity,filter;
filter:drop-shadow(0 0 calc(var(--dmx-dot-size)*.75*var(--dmx-bloom-level)) currentColor)}
.dmx14{will-change:opacity;transition:opacity 180ms cubic-bezier(.4,0,.2,1)} /* opacity set per-frame by the JS mask ticker */
/* Loader theme (per DotmSquare16 spec): white at night, brand blue by day. */
html[data-theme="dark"] .sf-recent .dmx-root{color:#ffffff}
html[data-theme="light"] .sf-recent .dmx-root{color:#66b5ff}
/* label fades out at the right edge instead of clipping with an ellipsis */
.sf-recent .lbl{flex:1;min-width:0;white-space:nowrap;overflow:hidden;
-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 20px),transparent 100%);
mask-image:linear-gradient(to right,#000 calc(100% - 20px),transparent 100%)}
/* when its menu is open, keep the label fully sharp (no fade) */
.sf-recent.menuopen .lbl{
-webkit-mask-image:none;
mask-image:none}
/* vertical 3-dot menu trigger — appears on hover, dark pill like the chat indicators */
.sf-recent .rmenu{position:absolute;right:5px;top:50%;transform:translateY(-50%);
width:24px;height:24px;display:none;align-items:center;justify-content:center;flex:none;
border:0;border-radius:8px;background:transparent;color:#000;cursor:pointer;padding:0}
.sf-recent:hover .rmenu,.sf-recent.menuopen .rmenu{display:flex}
/* kebab button stays transparent even when hovered directly */
.sf-recent .rmenu:hover{background:transparent}
.sf-recent .rmenu svg{width:15px;height:15px;fill:currentColor;stroke:none}
.sf-recent.menuopen{background:#e7e7e7;color:var(--sf-ink)}
.sf-rgroup{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--sf-dim);padding:8px 9px 3px}
.sf-rempty{padding:14px 10px;color:var(--sf-dim);font-size:12.5px}
.sf-rempty .sf-rclear{display:block;margin-top:9px;background:none;border:0;padding:0;color:var(--sf-ink);font:600 12.5px Inter;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.sf-rempty .sf-rclear:hover{opacity:.7}
.sf-rfmenu .rfreset{display:block;width:100%;text-align:left;background:none;border:0;padding:8px 10px;margin:0;color:var(--sf-ink);font:600 13px Inter;cursor:pointer;border-radius:8px}
.sf-rfmenu .rfreset:hover{background:rgba(120,120,128,.16)}
/* Chats owns conversation history only: Recents and Pinned. */
.sf-recents-head{display:flex;align-items:center;gap:2px}
.sf-recents-head .sf-gtog{flex:1}
.sf-recents-head .sf-folder-head-ic{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;opacity:.92}
/* AI recommendation snapshot card */
/* AI recommendation — swipeable metallic-ocean card deck (WebGL bg + stacked pages) */
.sf-airecdeck{position:relative;margin:6px 4px 16px;min-height:120px;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.airec-card{position:absolute;left:0;right:0;top:0;border-radius:15px;overflow:hidden;padding:12px 13px 11px;
border:1px solid rgba(150,220,222,.22);
background:linear-gradient(160deg,#0f3e49,#0b2c3a 55%,#08222e);
color:#eafdff;box-shadow:-7px 10px 26px rgba(5,26,36,.34),0 1px 0 rgba(255,255,255,.06) inset;
transform-origin:50% 64%;will-change:transform,opacity,filter;cursor:grab;
transition:transform .46s cubic-bezier(.22,1,.36,1),opacity .4s ease,box-shadow .4s ease,filter .44s ease}
.airec-card.dragging{transition:none;cursor:grabbing}
/* cards stacked behind the front read as gray, transparent ghosts; reveal to color on promotion */
.airec-card.behind{filter:grayscale(1) brightness(.62)}
.airec-card .airec-gl{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.airec-card .airec-veil{position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(168deg,rgba(8,32,42,.18) 0%,rgba(6,24,32,.30) 42%,rgba(4,18,26,.66) 100%)}
.airec-card .airec-body{position:relative;z-index:2}
.airec-card .airec-h{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#7fe6df;text-shadow:0 1px 6px rgba(0,0,0,.3)}
.airec-card .airec-h svg{width:13px;height:13px;fill:#8ff0e8;filter:drop-shadow(0 0 4px rgba(120,235,225,.5))}
.airec-card .airec-t{margin:7px 0 10px;font-size:12.5px;line-height:1.46;color:rgba(255,255,255,.94);text-shadow:0 1px 8px rgba(0,0,0,.35)}
.airec-card .airec-t b{color:#bff6f0;font-weight:700}
.airec-card .airec-btns{display:flex;flex-wrap:wrap;gap:6px}
.airec-card .airec-b{flex:none;font:600 12px Inter;padding:5px 11px;border-radius:8px;cursor:pointer;
border:1px solid rgba(180,235,235,.32);background:rgba(255,255,255,.08);color:#eafdff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background .15s,border-color .15s,filter .15s}
.airec-card .airec-b:hover{background:rgba(255,255,255,.16);border-color:rgba(200,245,245,.5)}
.airec-card .airec-b.primary{background:linear-gradient(180deg,#9ff3ea,#52cfc4);color:#04313a;border-color:rgba(190,250,245,.7);font-weight:700;box-shadow:0 2px 10px rgba(60,200,190,.3)}
.airec-card .airec-b.primary:hover{filter:brightness(1.06)}
.airec-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--sf-dim);font-size:12.5px}
/* Filter popover — light menu with hover-flyout submenus + checkmarks */
.sf-rfmenu{position:fixed;z-index:12000;min-width:248px;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:12px;box-shadow:0 18px 50px rgba(0,0,0,.22);padding:6px}
.sf-rfmenu[hidden]{display:none}
.rfrow{position:relative;display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;cursor:default;font-size:13.5px;color:var(--sf-ink)}
.rfrow:hover{background:var(--sf-hover)}
.rfrow .rfl{flex:1}
.rfrow .rfv{color:var(--sf-dim);font-size:12.5px}
.rfrow.act .rfv{color:var(--acc);font-weight:600}
.rfrow .rfc{color:var(--sf-dim);font-size:14px;line-height:1}
.rfsep{height:1px;background:var(--sf-border);margin:6px 8px}
.rfsub{display:none;position:absolute;left:100%;top:-7px;margin-left:5px;min-width:172px;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:12px;box-shadow:0 18px 50px rgba(0,0,0,.22);padding:6px}
.rfrow:hover .rfsub{display:block}
.rfopt{display:flex;align-items:center;gap:8px;width:100%;border:0;background:none;text-align:left;padding:8px 10px;border-radius:8px;font:500 13.5px Inter;color:var(--sf-ink);cursor:pointer}
.rfopt:hover{background:var(--sf-hover)}
.rfopt .rfck{width:15px;height:15px;margin-left:auto;flex:none;fill:none;stroke:var(--acc);stroke-width:2.6;visibility:hidden}
.rfopt.on .rfck{visibility:visible}
/* Recent-item context menu — dark popup off the 3-dot trigger (matches chat indicators) */
/* theme-dynamic: white menu on light surfaces, solid #0F0F0F on dark */
.sf-rcmenu{position:fixed;z-index:12050;min-width:164px;background:#ffffff;border:1px solid rgba(0,0,0,.09);border-radius:12px;box-shadow:0 24px 64px rgba(0,0,0,.22),0 2px 8px rgba(0,0,0,.12);padding:5px;color:#1a1a1c}
.sf-rcmenu[hidden]{display:none}
.rcrow{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;text-align:left;padding:6px 10px;border-radius:8px;font:500 13px Inter;color:#1f1f22;cursor:pointer}
.rcrow:hover{background:rgba(0,0,0,.06)}
.rcrow .rcend{margin-left:auto;color:rgba(0,0,0,.38);font-size:11.5px;font-weight:500}
.rcrow .rcchev{margin-left:auto;color:rgba(0,0,0,.38);font-size:13px;line-height:1}
.rcrow.danger{color:#e0483d}
.rcrow.danger:hover{background:rgba(224,72,61,.12)}
.rcsep{height:1px;background:rgba(0,0,0,.08);margin:4px 8px}
html[data-theme="dark"] .sf-rcmenu{background:#0F0F0F;border-color:rgba(255,255,255,.12);box-shadow:0 24px 64px rgba(0,0,0,.5),0 2px 8px rgba(0,0,0,.3);color:#fff}
html[data-theme="dark"] .rcrow{color:#f3f3f3}
html[data-theme="dark"] .rcrow:hover{background:rgba(255,255,255,.1)}
html[data-theme="dark"] .rcrow .rcend,html[data-theme="dark"] .rcrow .rcchev{color:rgba(255,255,255,.42)}
html[data-theme="dark"] .rcrow.danger{color:#ff5d52}
html[data-theme="dark"] .rcrow.danger:hover{background:rgba(255,93,82,.15)}
html[data-theme="dark"] .rcsep{background:rgba(255,255,255,.1)}
body.sf-collapsed .sf-recents,body.sf-collapsed .sf-recents-head,body.sf-collapsed .sf-airec,body.sf-collapsed .sf-recents-end{display:none}
/* Search chats + Recents belong to the chat view only — they vanish once you
click away from New chat into any dashboard page (body.shopify). */
body.shopify .sf-chatsub,
body.shopify .sf-recents-head,
body.shopify .sf-airec,
body.shopify .sf-recents-end,
body.shopify .sf-recents,
body.shopify .sf-pin-tasks{display:none}
body.shopify .sf-chat-top{padding-bottom:0;margin-bottom:6px}
/* ---- Search chats modal (blurred backdrop · white card · black text) ---- */
.sf-chatfind{position:fixed;inset:0;z-index:420;display:flex;align-items:flex-start;justify-content:center;padding:14vh 16px 16px;background:rgba(18,18,24,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.sf-chatfind[hidden]{display:none}
.scf-box{width:min(94vw,560px);max-height:64vh;display:flex;flex-direction:column;background:#fff;color:#111;border:1px solid var(--sf-border);border-radius:16px;box-shadow:0 34px 100px rgba(0,0,0,.42);overflow:hidden;animation:cmdkIn .16s cubic-bezier(.22,1,.36,1)}
.scf-top{display:flex;align-items:center;gap:11px;padding:14px 17px;border-bottom:1px solid #ececec}
.scf-top svg{width:18px;height:18px;stroke:#6b6b6b;stroke-width:1.9;fill:none;flex:none}
.scf-top input{flex:1;border:none;outline:none;font:500 15.5px Inter;color:#111;background:none}
.scf-top input::placeholder{color:#9a9a9a}
.scf-top .esc{font-size:11px;color:#6b6b6b;border:1px solid #d8d8d8;border-radius:8px;padding:2px 7px}
.scf-list{overflow-y:auto;padding:7px;scrollbar-width:thin}
.scf-group{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#8a8a8a;padding:11px 10px 4px}
.scf-item{display:block;padding:9px 11px;border-radius:10px;cursor:pointer;font-size:13.5px;color:#1a1a1a;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scf-item:hover{background:#f1f1f3}
/* ---- command palette (⌘K) ---- */
.sf-search{cursor:pointer}
.sf-cmdk{position:fixed;inset:0;z-index:400;display:flex;align-items:flex-start;justify-content:center;padding:92px 16px;background:rgba(18,18,24,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.sf-cmdk[hidden]{display:none}
.cmdk-box{width:min(94vw,600px);max-height:64vh;display:flex;flex-direction:column;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:16px;box-shadow:0 34px 100px rgba(0,0,0,.42);overflow:hidden;animation:cmdkIn .16s cubic-bezier(.22,1,.36,1)}
@keyframes cmdkIn{from{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:none}}
.cmdk-top{display:flex;align-items:center;gap:11px;padding:14px 17px;border-bottom:1px solid var(--sf-border-2)}
.cmdk-top svg{width:18px;height:18px;stroke:var(--sf-dim);stroke-width:1.9;fill:none;flex:none}
.cmdk-top input{flex:1;border:none;outline:none;font:500 15.5px Inter;color:var(--sf-ink);background:none}
.cmdk-top .esc{font-size:11px;color:var(--sf-dim);border:1px solid var(--sf-border);border-radius:8px;padding:2px 7px}
.cmdk-list{overflow-y:auto;padding:7px;scrollbar-width:thin}
.cmdk-group{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--sf-dim);padding:11px 10px 4px}
.cmdk-item{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:10px;cursor:pointer}
.cmdk-item .ci-ic{width:27px;height:27px;flex:none;border-radius:8px;background:var(--sf-hover);display:flex;align-items:center;justify-content:center;color:var(--sf-sub)}
.cmdk-item .ci-ic svg{width:15px;height:15px;fill:currentColor;stroke:none}
.cmdk-item .ci-t{flex:1;min-width:0;font-size:13.5px;color:var(--sf-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmdk-item .ci-t .ci-sub{color:var(--sf-dim)}
.cmdk-item .ci-meta{font-size:11.5px;color:var(--sf-dim);flex:none}
.cmdk-item.active{background:var(--sf-fill)}
.cmdk-item.active .ci-ic{background:rgba(255,255,255,.18);color:#fff}
.cmdk-item.active .ci-t,.cmdk-item.active .ci-t .ci-sub,.cmdk-item.active .ci-meta{color:#fff}
.cmdk-empty{padding:30px;text-align:center;color:var(--sf-dim);font-size:13.5px}
/* ---- toasts ---- */
.sf-toasts{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:600;display:flex;flex-direction:column;gap:9px;align-items:center;pointer-events:none}
.sf-toast{display:flex;align-items:center;gap:9px;background:#1c1c1f;color:#fff;font:550 13.5px Inter;padding:11px 17px;border-radius:10px;box-shadow:0 16px 44px rgba(0,0,0,.36);animation:toastIn .26s cubic-bezier(.22,1,.36,1)}
.sf-toast.out{animation:toastOut .24s ease forwards}
.sf-toast .tk{width:16px;height:16px;flex:none;color:#54d27a}
@keyframes toastIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateY(8px)}}
/* ---- view-enter transition + clickable-row affordance ---- */
.sf-enter{animation:sfEnter .3s cubic-bezier(.22,1,.36,1)}
@keyframes sfEnter{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.sf-table tbody tr.crow{transition:background .12s,box-shadow .12s}
.sf-table tbody tr.crow:hover{background:rgba(127,127,127,.16);box-shadow:inset 3px 0 0 var(--sf-fill)}
.lk{color:#1c4cd1;cursor:pointer}.lk:hover{text-decoration:underline}
/* ---- teams ---- */
.sf-ava{width:30px;height:30px;border-radius:50%;background:#5c6ac4;color:#fff;display:flex;align-items:center;justify-content:center;font:700 11.5px Inter;flex:none;text-transform:uppercase}
.sf-memcell{display:flex;align-items:center;gap:11px}
.sf-perms{display:grid;grid-template-columns:1fr 1fr;gap:2px 16px}
/* ---- full product/service editor ---- */
.sf-phead{display:flex;align-items:center;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.sf-phead .ph-l{display:flex;align-items:center;gap:9px;flex:1;min-width:0}
.sf-phead h1{font-size:20px;font-weight:700;margin:0}
.sf-phead .ph-a{display:flex;gap:8px;align-items:center}
.sf-rte-wrap{border:1px solid var(--sf-border);border-radius:10px;overflow:hidden;margin-top:5px}
.sf-rte-tb{display:flex;align-items:center;gap:1px;flex-wrap:wrap;padding:6px 8px;border-bottom:1px solid var(--sf-border-2);background:var(--sf-hover)}
.sf-rte-b{min-width:28px;height:28px;border:none;background:none;border-radius:8px;cursor:pointer;color:var(--sf-sub);display:flex;align-items:center;justify-content:center;font:700 14px Inter;padding:0 5px}
.sf-rte-b:hover{background:rgba(127,127,127,.18);color:var(--sf-ink)}
.sf-rte-b svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9}
/* AI "write description" button: blue fill, bright-blue border, white centered icon that spins on hover */
.sf-rte-ai{box-sizing:border-box;width:28px;height:28px;padding:0;background:var(--acc);color:#fff;border:2px solid #6cb6ff}
.sf-rte-ai:hover{background:var(--acc);color:#fff;filter:brightness(1.06)}
.sf-rte-ai svg{width:16px;height:16px;fill:#fff;stroke:none;transition:transform .25s ease}
.sf-rte-ai:hover svg{transform:rotate(90deg)}
.sf-rte-sep{width:1px;height:18px;background:var(--sf-border);margin:0 4px}
.sf-rte{min-height:120px;padding:11px 13px;font:400 14px/1.5 Inter;color:var(--sf-ink);outline:none}
.sf-rte:empty:before{content:attr(data-ph);color:var(--sf-dim)}
.sf-sw{display:flex;align-items:center;gap:8px}
.sf-toggle2{width:36px;height:20px;border-radius:999px;background:#c9c9cf;position:relative;cursor:pointer;flex:none;transition:background .15s;border:none;padding:0}
.sf-toggle2:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .15s;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.sf-toggle2.on{background:var(--sf-fill)}.sf-toggle2.on:after{left:18px}
/* Tag chips: gray pill, white text, removable. Divider is inset so it never touches the card. */
.sf-tagdiv{height:1px;background:var(--sf-border);margin:12px 6px 0}
.sf-taglist{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}
.sf-pilltag{display:inline-flex;align-items:center;gap:7px;max-width:100%;height:25px;padding:0 5px 0 11px;border-radius:999px;background:#616161;color:#fff;font:600 12px/1 Inter}
.sf-pilltag>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-pilltag>button{flex:none;width:17px;height:17px;padding:0;border:none;border-radius:50%;background:rgba(255,255,255,.22);color:#fff;font-size:12px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s}
.sf-pilltag>button:hover{background:rgba(255,255,255,.42)}
/* AI button is inactive (gray) until the service has a title */
.sf-rte-ai.is-off{background:#c9c9cf;border-color:#c9c9cf;cursor:not-allowed}
.sf-rte-ai.is-off:hover{filter:none;background:#c9c9cf}
.sf-rte-ai.is-off svg{opacity:.85}
/* AI describe popup */
.sf-ai-sec{font:600 12px Inter;color:var(--sf-dim);letter-spacing:.03em;text-transform:uppercase;margin:14px 0 7px}
.sf-ai-sec:first-child{margin-top:0}
.sf-ai-tones{display:flex;flex-wrap:wrap;gap:7px}
.sf-ai-tones .sf-chip.on{background:var(--acc);border-color:var(--acc);color:#fff}
.sf-ai-draft{width:100%;min-height:118px;resize:vertical;line-height:1.5;font:inherit}
.sf-ai-titlerow{display:flex;gap:8px;align-items:center}
.sf-ai-titlein{flex:1}
.sf-ai-titleok{flex:none;width:42px;padding:0;display:inline-flex;align-items:center;justify-content:center}
.sf-ai-titleok svg{width:18px;height:18px}
.sf-seo-card{display:flex;gap:16px;align-items:center;border:1px solid var(--sf-border-2);border-radius:12px;padding:14px;background:var(--sf-bg)}
.sf-seo-gauge{flex:none;position:relative;width:96px;height:96px;display:flex;align-items:center;justify-content:center}
.sf-seo-gauge .gv{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.sf-seo-gauge .gv b{font-size:24px;font-weight:700}
.sf-seo-gauge .gv span{font-size:10px;color:var(--sf-dim);letter-spacing:.05em;text-transform:uppercase;margin-top:3px}
.sf-seo-recs{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}
.sf-seo-rec{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:var(--sf-ink);line-height:1.4}
.sf-seo-rec svg{width:15px;height:15px;flex:none;margin-top:1px}
.sf-seo-rec.ok svg{color:#1aa05a}.sf-seo-rec.warn svg{color:#e0a400}.sf-seo-rec.bad svg{color:#d6483a}
.sf-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px;align-items:center}
.sf-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--sf-border);background:var(--sf-surface);border-radius:8px;padding:6px 11px;font:600 12.5px Inter;color:var(--sf-ink);cursor:pointer}
.sf-chip:hover{background:var(--sf-hover)}.sf-chip .cv{color:var(--sf-dim);font-weight:600}
.sf-loc{width:100%;border:1px solid var(--sf-border);border-radius:10px;overflow:hidden;margin-top:4px}
.sf-loc table{width:100%;border-collapse:collapse;font-size:13px}
.sf-loc th{text-align:right;font-weight:600;color:var(--sf-sub);font-size:12px;padding:9px 14px;border-bottom:1px solid var(--sf-border-2)}
.sf-loc th:first-child{text-align:left}
.sf-loc td{padding:10px 14px;text-align:right;border-bottom:1px solid var(--sf-border-2);font-variant-numeric:tabular-nums}
.sf-loc td:first-child{text-align:left;font-weight:550}
.sf-loc tr:last-child td{border-bottom:none}
.sf-loc input{width:56px;text-align:right;border:1px solid var(--sf-border);border-radius:8px;padding:5px 8px;font:600 13px Inter;outline:none}
.sf-seo .seo-host{font-size:13px;color:#1a7f37}.sf-seo .seo-t{font-size:17px;color:#1a0dab;margin:3px 0;font-weight:500}.sf-seo .seo-p{font-size:13px;color:var(--sf-sub);line-height:1.5}
/* SEO body — roomier spacing: gaps between cards, taller table rows, padded action lists */
#seo-body>.sf-card{margin-bottom:20px}
#seo-body>.sf-card:last-child{margin-bottom:0}
#seo-body .sf-cardh2{padding:15px 18px}
#seo-body .sf-cardb{padding:8px 18px 16px}
#seo-body .sf-table th{padding:13px 18px}
#seo-body .sf-table td{padding:16px 18px}
#seo-body .seo-listrow{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--sf-border-2)}
#seo-body .seo-listrow:last-child{border-bottom:none}
.sf-pubrow{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--sf-ink)}
.sf-pubrow>svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.8;fill:none;color:var(--sf-sub)}
.sf-pubrow .warn{margin-left:auto;display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:#7a5b00}
.sf-secsub{font-size:12.5px;color:var(--sf-dim);margin:0}
.sf-cardh2 .lk{font-size:12.5px;font-weight:600}
/* ---- analytics charts ---- */
.sf-chart{border:1px solid var(--sf-border);border-radius:var(--sf-radius);background:var(--sf-surface);padding:17px 19px;box-shadow:0 1px 0 rgba(0,0,0,.04);margin-bottom:18px}
.sf-chart h3{margin:0 0 2px;font-size:14px;font-weight:650}
.sf-chart .csub{font-size:12.5px;color:var(--sf-dim);margin:0 0 6px}
.sf-chart .cbig{font-size:25px;font-weight:700;letter-spacing:-.01em;display:flex;align-items:baseline;gap:9px;margin-bottom:8px}
.sf-chart .cbig .cdelta{font-size:12.5px;font-weight:600;color:#0a7a3c}
.sf-svg{display:block;width:100%;height:auto}
.sf-svg text{font-family:Inter}
/* ---- Finance ---- */
.fin-banner{display:flex;align-items:center;gap:14px;border:1px solid #f0d9a8;background:linear-gradient(180deg,#fffdf6,#fff9ec);border-radius:var(--sf-radius);padding:13px 16px;margin-bottom:18px}
.fin-banner-ic{flex:none;width:34px;height:34px;border-radius:10px;background:#fef3d3;display:flex;align-items:center;justify-content:center;color:#b45309}
.fin-banner-ic svg{width:18px;height:18px;fill:currentColor}
.fin-banner-tx{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.fin-banner-tx b{font-size:13.5px;color:var(--sf-ink)}
.fin-banner-tx span{font-size:12.5px;color:var(--sf-sub);line-height:1.45}
.fin-banner-tx code{font:600 11.5px ui-monospace,Menlo,monospace;background:#fff;border:1px solid var(--sf-border);border-radius:5px;padding:1px 5px;color:#b45309}
.fin-payout-account{margin:0 0 20px;padding:17px 18px;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-surface);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px}
.fin-payout-account.action{border-color:rgba(180,122,0,.38);background:rgba(180,122,0,.055)}
.fin-payout-icon{width:42px;height:42px;border-radius:11px;background:var(--sf-hover);color:var(--sf-sub);display:grid;place-items:center}
.fin-payout-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fin-payout-copy{min-width:0}.fin-payout-titleline{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.fin-payout-titleline b{font-size:14px;letter-spacing:-.01em}.fin-payout-copy>span{display:block;margin-top:3px;color:var(--sf-sub);font-size:12.5px;line-height:1.45}
.fin-payout-status{min-height:23px;padding:0 9px;border:1px solid var(--sf-border);border-radius:999px;color:var(--sf-sub);background:var(--sf-hover);display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:700}
.fin-payout-status::before{content:"";width:6px;height:6px;border-radius:50%;background:#8e8e93}.fin-payout-status.verified{border-color:rgba(52,199,89,.42);background:rgba(52,199,89,.1);color:#1e8a45}.fin-payout-status.verified::before{background:#34c759}.fin-payout-status.pending{border-color:rgba(205,143,0,.42);background:rgba(205,143,0,.1);color:#8a6100}.fin-payout-status.pending::before{background:#d59a00}
.fin-payout-actions{display:flex;align-items:center;gap:9px}.fin-payout-actions .po-btn{white-space:nowrap}
.fin-bank-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:4px;border:1px solid var(--sf-border);border-radius:12px;overflow:hidden}.fin-bank-cell{min-height:68px;padding:13px 14px;border-right:1px solid var(--sf-border-2);border-bottom:1px solid var(--sf-border-2)}.fin-bank-cell:nth-child(2n){border-right:0}.fin-bank-cell:nth-last-child(-n+2){border-bottom:0}.fin-bank-cell span{display:block;color:var(--sf-dim);font-size:10.5px}.fin-bank-cell b{display:block;margin-top:4px;font-size:12.5px}
.fin-bank-secure{margin-top:15px;padding:12px 13px;border-radius:10px;background:var(--sf-hover);display:flex;align-items:flex-start;gap:10px;color:var(--sf-sub);font-size:11.5px;line-height:1.45}.fin-bank-secure svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8}
.fin-powered-by{margin-top:13px;display:flex;align-items:center;justify-content:flex-end;gap:6px;color:var(--sf-dim);font-size:10.5px;letter-spacing:.01em}.fin-powered-by b{color:var(--sf-sub);font-weight:700;letter-spacing:-.01em}
.po-modal-head.fin-connect-head{position:relative;justify-content:center}.fin-connect-head .po-close{position:absolute;right:16px;top:50%;transform:translateY(-50%)}
.fin-connect-brand{height:26px;display:flex;align-items:center;justify-content:center;color:var(--sf-ink)}.fin-connect-brand img{display:block;width:116px;height:auto;filter:invert(1)}html[data-theme="dark"] .fin-connect-brand img{filter:none}
.fin-connect-modal .fin-connect-cta,.fin-connect-modal .po-btn.primary{position:relative;overflow:hidden;border-color:#000!important;background:#000!important;color:#fff!important;box-shadow:none!important;transition:transform .18s cubic-bezier(.2,.75,.25,1),background-color .18s ease}
.fin-connect-modal .fin-connect-cta:hover,.fin-connect-modal .po-btn.primary:hover{background:#111!important;transform:translateY(-2px);box-shadow:none!important}
.fin-connect-modal .fin-connect-cta:active,.fin-connect-modal .po-btn.primary:active{background:#000!important;transform:translateY(0) scale(.985);box-shadow:none!important}
.fin-connect-modal .fin-connect-cta:focus-visible,.fin-connect-modal .po-btn.primary:focus-visible{outline:3px solid var(--sf-ink);outline-offset:4px}
.fin-connect-modal .fin-connect-cta:disabled,.fin-connect-modal .po-btn.primary:disabled{transform:none;box-shadow:none}
.fin-connect-modal{overflow:hidden;background:#fff}.fin-connect-modal .po-modal-head{border-bottom:0;background:#fff}.fin-connect-modal .po-modal-body{max-height:min(76vh,760px);overflow-y:auto;background:#fff}.fin-connect-modal .po-modal-foot{border-top:0;background:#fff}.fin-connect-modal .fin-powered-by{width:100%;margin-top:17px;justify-content:center;text-align:center}.fin-connect-modal .fin-bank-secure{max-width:680px;margin:0 auto;background:#fff;align-items:center;justify-content:center;text-align:center}.fin-connect-stage{min-height:470px;padding:46px 24px 30px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.fin-connect-stage[hidden]{display:none}.fin-connect-stage h3{margin:0 0 9px;font-size:20px;letter-spacing:-.025em}.fin-connect-stage p{max-width:480px;margin:0;color:var(--sf-sub);font-size:13px;line-height:1.55}.fin-connect-stage .fin-bank-secure{width:100%;margin:0 auto 28px}.fin-connect-stage .fin-connect-cta{margin-top:22px;align-self:center}.fin-connect-stage .fin-powered-by{margin-top:18px}.fin-connect-stage-success{min-height:440px}.fin-connect-stage-success .fin-preview-check{margin-bottom:15px}.fin-connect-stage-success .po-destination-card{width:min(100%,520px);margin:22px auto 0;text-align:left}.fin-connect-stage-success .po-btn{margin-top:20px}.fin-connect-actions{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;width:100%;margin:0 auto}.fin-connect-start-icon{width:54px;height:54px;margin:0 auto 18px;border-radius:15px;background:#fff;color:var(--sf-sub);display:grid;place-items:center}.fin-connect-start-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8}.fin-connect-modal .po-error{max-width:680px;margin:12px auto 0;text-align:center}
.fin-connect-modal{position:relative}.po-modal-head.fin-connect-head{position:absolute;inset:0 0 auto;height:0;min-height:0;padding:0;z-index:4;background:transparent!important}.fin-connect-head .po-close{position:absolute;right:16px;top:16px;transform:none}.fin-connect-stage-start{position:relative;min-height:clamp(470px,68vh,680px);padding:46px 24px 92px;background:#fff}.fin-connect-start-main{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.fin-connect-stage-start .fin-connect-start-main{position:absolute;left:50%;top:50%;width:min(calc(100% - 48px),560px);transform:translate(-50%,-50%)}.fin-connect-stage-start .fin-connect-security-note{position:absolute;left:50%;bottom:22px;width:min(calc(100% - 48px),680px);margin:0;transform:translateX(-50%)}
.fin-connect-notifications{margin:0 0 20px;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-surface);overflow:hidden}
.fin-connect-notifications[hidden]{display:none}
.fin-connect-notifications.is-action-required{border-color:rgba(205,143,0,.42);background:rgba(205,143,0,.055)}
.fin-connect-notification-loading{padding:13px 16px;color:var(--sf-sub);font-size:12px}
.fin-stripe-host{position:relative;min-height:420px;padding:2px}.fin-stripe-loading{width:65%;min-height:500px;margin:0 auto;display:flex;align-items:center;justify-content:center;color:var(--sf-sub);font-size:13px;line-height:1.45;text-align:center}.fin-stripe-loading>div{width:100%;text-align:center}.fin-stripe-spinner{width:44px;height:44px;margin:0 auto 17px;border:3px solid rgba(0,0,0,.16);border-top-color:#111;border-radius:50%;animation:finStripeSpin .78s linear infinite}html[data-theme="dark"] .fin-stripe-spinner{border-color:rgba(255,255,255,.25);border-top-color:#fff}.fin-stripe-component-loading{position:absolute;inset:0;z-index:3;background:#fff}html[data-theme="dark"] .fin-stripe-component-loading{background:#000}
.fin-onboarding-host{margin-top:14px;min-height:500px}.fin-onboarding-host[hidden]{display:none}.fin-onboarding-host stripe-connect-account-onboarding{position:relative;z-index:1;display:block;width:65%;margin:0 auto}
.fin-single-question{width:65%;min-height:500px;margin:0 auto;display:flex;align-items:center;justify-content:center;text-align:center}.fin-single-question form{width:100%;display:flex;flex-direction:column;align-items:center;text-align:center}.fin-single-question h3{margin:0 0 9px;font-size:26px;line-height:1.16;letter-spacing:-.035em;text-align:center}.fin-single-question p{max-width:620px;margin:0 auto 26px;color:var(--sf-sub);font-size:13px;line-height:1.55;text-align:center}.fin-single-question input{align-self:stretch;width:100%;min-height:54px;padding:0 14px;border:1px solid rgba(0,0,0,.25);border-radius:8px;background:#fff;color:#111;font:500 15px/1.2 Inter,Arial,sans-serif;text-align:center;outline:none}.fin-single-question select{align-self:stretch;width:100%;min-height:54px;padding:0 14px;border:1px solid rgba(0,0,0,.25);border-radius:8px;background:#fff;color:#111;font:500 15px/1.2 Inter,Arial,sans-serif;text-align:center;text-align-last:center;outline:none;cursor:pointer}.fin-single-question input:focus,.fin-single-question select:focus{border-color:#111;box-shadow:0 0 0 1px #111}.fin-single-question .fin-connect-cta{margin:22px auto 0}.fin-single-question .fin-powered-by{justify-content:center;text-align:center}
html[data-theme="dark"] .fin-single-question input{border-color:rgba(255,255,255,.25);background:#000;color:#fff}html[data-theme="dark"] .fin-single-question select{border-color:rgba(255,255,255,.25);background:#000;color:#fff}html[data-theme="dark"] .fin-single-question input:focus,html[data-theme="dark"] .fin-single-question select:focus{border-color:#fff;box-shadow:0 0 0 1px #fff}html[data-theme="dark"] .fin-single-question option{background:#000;color:#fff}
.fin-address-autocomplete{position:relative;align-self:stretch;width:100%}.fin-address-suggestions{position:absolute;z-index:8;top:calc(100% + 7px);left:0;right:0;max-height:282px;overflow:auto;padding:6px;border:1px solid rgba(0,0,0,.16);border-radius:12px;background:#fff;text-align:left;box-shadow:0 18px 45px rgba(0,0,0,.14)}.fin-address-suggestions[hidden]{display:none}.fin-address-option{width:100%;min-height:54px;padding:9px 11px;border:0;border-radius:8px;background:#fff;color:#111;display:flex;flex-direction:column;justify-content:center;gap:3px;font:inherit;text-align:left;cursor:pointer}.fin-address-option:hover,.fin-address-option[aria-selected="true"]{background:#f1f1f2}.fin-address-option b{font-size:13px;font-weight:650;line-height:1.25}.fin-address-option small{color:#6d6d72;font-size:11px;line-height:1.3}.fin-address-provider{padding:7px 11px 4px;color:#8a8a90;font-size:9.5px;letter-spacing:.015em;text-align:right}.fin-address-empty{padding:14px 11px;color:var(--sf-sub);font-size:11.5px;text-align:center}
html[data-theme="dark"] .fin-address-suggestions{border-color:rgba(255,255,255,.2);background:#0b0b0c;box-shadow:0 18px 45px rgba(0,0,0,.5)}html[data-theme="dark"] .fin-address-option{background:#0b0b0c;color:#fff}html[data-theme="dark"] .fin-address-option:hover,html[data-theme="dark"] .fin-address-option[aria-selected="true"]{background:#202023}html[data-theme="dark"] .fin-address-option small{color:#aaaab2}
.fin-preview-frame{margin-top:14px;padding:18px;border:0;border-radius:14px;background:#fff}.fin-preview-eyebrow{font-size:10.5px;font-weight:700;letter-spacing:.075em;text-transform:uppercase;color:var(--sf-dim)}.fin-preview-frame h3{margin:8px 0 5px;font-size:18px;letter-spacing:-.025em}.fin-preview-frame>p{margin:0;color:var(--sf-sub);font-size:12.5px;line-height:1.5}.fin-preview-options{display:grid;gap:9px;margin-top:17px}.fin-preview-option{width:100%;min-height:62px;padding:12px 14px;border:1px solid var(--sf-border);border-radius:11px;background:#fff;color:var(--sf-ink);display:flex;align-items:center;gap:12px;text-align:left;cursor:pointer}.fin-preview-option:hover{background:var(--sf-hover)}.fin-preview-option>span:first-child{width:34px;height:34px;border-radius:9px;background:#fff;display:grid;place-items:center;flex:none}.fin-preview-option svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}.fin-preview-option div{flex:1;min-width:0}.fin-preview-option b,.fin-preview-option small{display:block}.fin-preview-option b{font-size:12.5px}.fin-preview-option small{margin-top:3px;color:var(--sf-sub);font-size:11px}.fin-preview-arrow{font-size:17px;color:var(--sf-dim)}.fin-preview-recommended{font-size:8.5px;font-weight:700;letter-spacing:.035em;color:var(--sf-dim);background:linear-gradient(100deg,var(--sf-dim) 0 38%,var(--sf-ink) 48%,var(--sf-dim) 58% 100%);background-size:250% 100%;background-position:100% 0;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:finRecommendedShine 2.4s ease-in-out infinite}.fin-preview-success{padding:24px 4px 8px;text-align:center}.fin-preview-check{width:46px;height:46px;margin:0 auto 13px;border-radius:50%;background:rgba(52,199,89,.12);color:#2aa84f;display:grid;place-items:center;font-size:22px;font-weight:750}.fin-preview-success h3{margin:0 0 6px}.fin-preview-success p{max-width:430px;margin:0 auto 17px;color:var(--sf-sub);font-size:12.5px;line-height:1.5}
.fin-preview-center{width:min(100%,560px);margin:0 auto;text-align:center}.fin-preview-center .fin-preview-frame{margin-top:22px;text-align:left}.fin-preview-secure{width:min(100%,520px);margin:22px auto 0;padding:16px;border:1px solid var(--sf-border);border-radius:13px;background:#fff;text-align:left}.fin-preview-secure-label{margin-bottom:12px;color:var(--sf-dim);font-size:10.5px;font-weight:700;letter-spacing:.075em;text-transform:uppercase}.fin-preview-field{padding:13px 14px;border:1px solid var(--sf-border);border-radius:10px;background:#fff;color:var(--sf-sub);font-size:12px}.fin-preview-field+.fin-preview-field{margin-top:9px}.fin-preview-actions{width:min(100%,360px);margin:20px auto 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:10px}.fin-preview-actions .po-btn{width:100%;margin-top:0;padding-inline:12px}
html[data-theme="dark"] .fin-connect-modal,html[data-theme="dark"] .fin-connect-modal .po-modal-head,html[data-theme="dark"] .fin-connect-modal .po-modal-body,html[data-theme="dark"] .fin-connect-modal .po-modal-foot,html[data-theme="dark"] .fin-connect-modal .fin-bank-secure,html[data-theme="dark"] .fin-connect-modal .fin-connect-start-icon,html[data-theme="dark"] .fin-connect-modal .fin-preview-frame,html[data-theme="dark"] .fin-connect-modal .fin-preview-option,html[data-theme="dark"] .fin-connect-modal .fin-preview-option>span:first-child,html[data-theme="dark"] .fin-connect-modal .fin-preview-secure,html[data-theme="dark"] .fin-connect-modal .fin-preview-field{background:#050506}html[data-theme="dark"] .fin-connect-stage-start{background:#050506}
@keyframes finRecommendedShine{0%,28%{background-position:100% 0}72%,100%{background-position:-60% 0}}
html[data-theme="dark"] .fin-connect-modal,html[data-theme="dark"] .fin-connect-modal .po-modal-head,html[data-theme="dark"] .fin-connect-modal .po-modal-body,html[data-theme="dark"] .fin-connect-modal .po-modal-foot,html[data-theme="dark"] .fin-connect-modal .fin-bank-secure,html[data-theme="dark"] .fin-connect-modal .fin-connect-start-icon,html[data-theme="dark"] .fin-connect-modal .fin-preview-frame,html[data-theme="dark"] .fin-connect-modal .fin-preview-option,html[data-theme="dark"] .fin-connect-modal .fin-preview-option>span:first-child,html[data-theme="dark"] .fin-connect-modal .fin-preview-secure,html[data-theme="dark"] .fin-connect-modal .fin-preview-field,html[data-theme="dark"] .fin-connect-stage-start{background:#000}
@media(prefers-reduced-motion:reduce){.fin-preview-recommended{animation:none;background:none;-webkit-text-fill-color:currentColor}}
@keyframes finStripeSpin{to{transform:rotate(360deg)}}
html[data-theme="dark"] .fin-payout-status.verified{color:#5dd97e}html[data-theme="dark"] .fin-payout-status.pending{color:#e4b746}
@media(max-width:680px){.fin-payout-account{grid-template-columns:auto minmax(0,1fr)}.fin-payout-actions{grid-column:1/-1}.fin-bank-grid{grid-template-columns:1fr}.fin-bank-cell,.fin-bank-cell:nth-child(2n){border-right:0;border-bottom:1px solid var(--sf-border-2)}.fin-bank-cell:last-child{border-bottom:0}.fin-onboarding-host stripe-connect-account-onboarding,.fin-single-question,.fin-stripe-loading{width:100%}}
.fin-bal{padding:16px 18px;margin-bottom:18px}
.fin-bal-l{font-size:12.5px;color:var(--sf-sub)}
.fin-bal-v{font-size:27px;font-weight:700;letter-spacing:-.01em;margin:4px 0 2px}
.fin-bal-sub{font-size:12.5px;color:var(--sf-dim)}
/* Stripe-backed Balance. The page borrows Stripe's information hierarchy,
but stays inside Attract's compact, neutral admin language. */
body[data-view="balance"] .sf-page{max-width:none;padding:28px 34px 150px}
.bal-shell{--bal-accent:#111;--bal-accent-ink:#fff;--bal-accent-soft:#f1f1f1;--bal-overview-bg:var(--sf-hover);--bal-page-blend:#fff;display:flex;flex-direction:column;isolation:isolate}
html[data-theme="dark"] .bal-shell{--bal-accent:#fff;--bal-accent-ink:#111;--bal-accent-soft:#252525;--bal-overview-bg:#191919;--bal-page-blend:#000;}
.bal-overview{position:relative;z-index:1;isolation:isolate;margin:0;padding:0}
body[data-view="balance"] .composer{z-index:120}
.bal-actions{position:relative;z-index:2;display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:0}
.bal-action{height:42px;padding:0 15px;border:1px solid transparent;border-radius:999px;background:var(--sf-hover);color:var(--sf-ink);display:inline-flex;align-items:center;gap:8px;font:650 14px Inter;cursor:pointer}
.bal-action:hover{background:var(--sf-border-2)}
.bal-action svg{width:18px;height:18px}
.bal-action.primary{border-radius:9px;background:var(--bal-accent);color:var(--bal-accent-ink)}
.bal-action.primary:hover{background:var(--bal-accent);filter:brightness(.88)}
.bal-action.outline{background:var(--sf-surface);border-color:var(--sf-border)}
.bal-action[aria-disabled="true"]{opacity:.43;cursor:not-allowed}
.bal-accounts{position:relative;isolation:isolate;display:block;max-width:none;margin-top:32px}
.bal-accounts::before{content:"";position:absolute;z-index:-1;left:-34px;right:-34px;top:-102px;bottom:auto;height:100%;min-height:100vh;border-radius:0;background:var(--bal-overview-bg);pointer-events:none}
.bal-payments-group{position:relative;min-width:0;padding:12px 12px 0;border-radius:0;background:transparent;display:grid;grid-template-columns:minmax(360px,1fr) minmax(420px,1.1fr);gap:12px;overflow:visible}
.bal-payments-main{min-width:0;display:flex;flex-direction:column;position:relative}
.bal-account-card{min-height:380px;padding:22px;border:1px solid var(--sf-border);border-radius:14px;background:var(--sf-surface);display:flex;flex-direction:column;box-shadow:0 2px 4px rgba(24,28,36,.08)}
.bal-account-top{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:700}
.bal-flag{font-size:18px;line-height:1}
.bal-account-value{margin-top:8px;font-size:26px;letter-spacing:-.035em;color:var(--sf-ink)}
.bal-auto{margin-top:auto;display:flex;align-items:center;gap:9px;color:var(--sf-sub);font-size:13px}
.bal-auto-icons{display:flex;align-items:center}
.bal-auto-icons span{width:29px;height:29px;border-radius:50%;border:1px solid transparent;background:var(--sf-hover);display:grid;place-items:center;color:var(--sf-sub)}
.bal-auto-icons span+span{margin-left:-7px;background:color-mix(in srgb,var(--sf-surface) 86%,var(--sf-hover));border-color:var(--sf-border)}
html[data-theme="dark"] .bal-auto-icons span{background:#242428;color:#c8c9cf}
html[data-theme="dark"] .bal-auto-icons span+span{background:#303036;border-color:#48484f;color:#f4f4f6}
.bal-auto-icons svg{width:19px;height:19px;stroke-width:1.9}
.bal-auto-icons [data-iconstack-id="hugeicon-reload"]{transform-origin:center;animation:none}
.bal-auto:hover .bal-auto-icons [data-iconstack-id="hugeicon-reload"]{animation:balAutoCycle 1.4s ease-in-out infinite;will-change:transform}
@keyframes balAutoCycle{0%,18%{transform:rotate(0deg)}82%,100%{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.bal-auto-icons [data-iconstack-id="hugeicon-reload"]{animation:none}}
.bal-account-label{min-height:60px;padding:0 7px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px}
.bal-account-label b{font-weight:700}
.bal-account-label span{color:var(--sf-sub);font-size:12px}
.bal-account-menu{width:40px;height:40px;border:0;border-radius:10px;background:var(--sf-surface);color:var(--sf-sub);font-size:20px;line-height:1;letter-spacing:2px;cursor:pointer}
.bal-account-menu:hover,.bal-account-menu[aria-expanded="true"]{background:var(--sf-border-2);color:var(--sf-ink)}
.bal-account-popover{position:absolute;z-index:20;right:12px;top:calc(100% - 8px);width:210px;padding:7px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);box-shadow:0 18px 45px rgba(35,44,68,.16);animation:balPop .14s ease-out}
.bal-account-popover[hidden]{display:none}
.bal-account-popover button{width:100%;height:44px;padding:0 14px;border:0;border-radius:8px;background:none;color:var(--sf-ink);font:600 14px Inter;text-align:left;cursor:pointer}
.bal-account-popover button:hover{background:var(--sf-hover)}
@keyframes balPop{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
.bal-currency-overlay{--bal-accent:#111;--bal-accent-ink:#fff;--bal-accent-soft:#f1f1f1;position:fixed;inset:0;z-index:9000;padding:34px;background:rgba(0,0,0,.28);backdrop-filter:blur(2px);display:grid;place-items:center;animation:fmIn .15s ease}
html[data-theme="dark"] .bal-currency-overlay{--bal-accent:#fff;--bal-accent-ink:#111;--bal-accent-soft:#252525}
.bal-currency-modal{width:min(1040px,calc(100vw - 68px));max-height:calc(100vh - 68px);overflow:auto;border:1px solid var(--sf-border);border-radius:16px;background:var(--sf-surface);box-shadow:0 28px 80px rgba(30,40,66,.28)}
.bal-currency-bar{height:64px;padding:0 22px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--sf-border-2);font-size:14px;font-weight:700}
.bal-currency-bar svg{width:20px;height:20px}
.bal-currency-close{margin-left:auto;width:36px;height:36px;border:0;border-radius:9px;background:none;color:var(--sf-sub);font-size:27px;cursor:pointer}
.bal-currency-close:hover{background:var(--sf-hover);color:var(--sf-ink)}
.bal-currency-body{display:grid;grid-template-columns:minmax(410px,1fr) minmax(390px,.95fr);gap:26px;padding:26px}
.bal-currency-copy{min-height:470px;display:flex;flex-direction:column}
.bal-currency-copy h2{margin:8px 0 8px;font-size:29px;letter-spacing:-.035em}
.bal-currency-copy>p{margin:0;color:var(--sf-sub);font-size:15px}
.bal-currency-docs{display:inline-block;margin-top:14px;color:var(--bal-accent);font-size:14px;font-weight:650;text-decoration:none}
.bal-currency-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:30px}
.bal-currency-option{height:58px;padding:0 14px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);display:flex;align-items:center;gap:12px;font:700 14px Inter;cursor:pointer}
.bal-currency-option:hover{border-color:var(--bal-accent);background:var(--bal-accent-soft)}
.bal-currency-option[aria-pressed="true"]{border-color:var(--bal-accent);box-shadow:inset 0 0 0 1px var(--bal-accent);background:var(--bal-accent-soft)}
.bal-currency-check{width:18px;height:18px;border:1.5px solid var(--sf-border);border-radius:5px;display:grid;place-items:center;color:var(--bal-accent-ink);font-size:12px}
.bal-currency-option[aria-pressed="true"] .bal-currency-check{border-color:var(--bal-accent);background:var(--bal-accent)}
.bal-currency-flag{font-size:18px}
.bal-currency-save{align-self:flex-end;margin-top:auto;height:45px;padding:0 22px;border:0;border-radius:9px;background:var(--bal-accent);color:var(--bal-accent-ink);font:700 14px Inter;cursor:pointer}
.bal-currency-save:disabled{opacity:.42;cursor:not-allowed}
.bal-currency-visual{min-height:470px;padding:30px;border-radius:14px;background:radial-gradient(circle at 18% 12%,rgba(255,255,255,.48),transparent 30%),linear-gradient(140deg,#ececec,#d8d8d8 36%,#bdbdbd 65%,#919191);display:flex;flex-direction:column;justify-content:center;gap:24px}
html[data-theme="dark"] .bal-currency-visual{background:radial-gradient(circle at 18% 12%,rgba(255,255,255,.16),transparent 30%),linear-gradient(140deg,#3b3b3b,#2d2d2d 40%,#151515)}
.bal-currency-preview{width:min(320px,100%);margin:auto;padding:16px;border-radius:12px;background:rgba(255,255,255,.94);box-shadow:0 16px 40px rgba(54,63,110,.22);color:#30384a}
.bal-currency-preview b{display:block;margin-bottom:12px;font-size:14px}
.bal-currency-preview-row{display:flex;gap:8px}
.bal-currency-pill{flex:1;padding:10px;border-radius:8px;background:#eef0f6;font-size:12px;font-weight:700}
.bal-currency-pill.add{color:var(--bal-accent);background:var(--bal-accent-soft)}
.bal-currency-benefits{width:min(320px,100%);margin:auto;padding:16px;border-radius:12px;background:rgba(255,255,255,.88);box-shadow:0 16px 40px rgba(54,63,110,.2);color:#465066}
.bal-currency-benefits b{display:block;margin-bottom:9px;color:#30384a;font-size:14px}
.bal-currency-benefits span{display:block;margin:7px 0;font-size:12px}
.bal-currency-benefits span::before{content:"✓";display:inline-grid;place-items:center;width:17px;height:17px;margin-right:8px;border-radius:50%;background:var(--bal-accent);color:var(--bal-accent-ink);font-size:11px}
.bal-funds-overlay{position:fixed;inset:0;z-index:9200;padding:18px;background:rgba(0,0,0,.28);backdrop-filter:blur(6px) saturate(.9);-webkit-backdrop-filter:blur(6px) saturate(.9);display:grid;place-items:center;animation:fmIn .17s ease}
.bal-funds-modal{--bf-bg:#fff;--bf-ink:#111;--bf-sub:#6a6b6d;--bf-dim:#9a9a9f;--bf-line:#ededed;--bf-raised:#fff;--bf-hover:#f6f6f7;--bf-disabled:#e9e9eb;--bf-disabled-ink:#9b9ba0;width:min(500px,calc(100vw - 36px));padding:20px;border:1px solid var(--bf-line);border-radius:18px;background:var(--bf-bg);color:var(--bf-ink);box-shadow:0 24px 76px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.7);font-family:Inter,system-ui,sans-serif}
html[data-theme="dark"] .bal-funds-modal{--bf-bg:#080808;--bf-ink:#f7f7f7;--bf-sub:#929297;--bf-dim:#68686d;--bf-line:#333337;--bf-raised:#101010;--bf-hover:#151515;--bf-disabled:#2a2a2d;--bf-disabled-ink:#727277;box-shadow:0 24px 76px rgba(0,0,0,.66),inset 0 1px 0 rgba(255,255,255,.055)}
.bal-funds-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.bal-funds-head h2{margin:0;font-size:22px;line-height:1.1;letter-spacing:-.035em}
.bal-funds-close{width:30px;height:30px;margin:-4px -4px 0 0;border:0;border-radius:50%;background:transparent;color:var(--bf-sub);font-size:22px;line-height:1;cursor:pointer}
.bal-funds-close:hover{background:var(--bf-hover);color:var(--bf-ink)}
.bal-funds-intro{margin:8px 0 16px;color:var(--bf-sub);font-size:12.5px;line-height:1.4}
.bal-funds-intro b{color:var(--bf-ink);font-weight:600}
.bal-funds-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.bal-funds-option{min-height:72px;padding:10px 7px;border:1px solid var(--bf-line);border-radius:12px;background:var(--bf-raised);color:var(--bf-ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font:500 15px Inter;cursor:pointer;transition:border-color .16s ease,background .16s ease,transform .16s ease}
.bal-funds-option:hover{border-color:var(--bf-sub);background:var(--bf-hover);transform:translateY(-1px)}
.bal-funds-option span{color:var(--bf-sub);font-size:10.5px;white-space:nowrap}
.bal-funds-option[aria-pressed="true"]{border-color:var(--bf-ink);background:var(--bf-hover);box-shadow:inset 0 0 0 1px var(--bf-ink)}
.bal-funds-field{display:block;margin-top:14px}
.bal-funds-field[hidden]{display:none}
.bal-funds-field>span{display:block;margin-bottom:9px;font-size:14px;font-weight:650}
.bal-funds-input-wrap{height:48px;border:1px solid var(--bf-line);border-radius:13px;background:var(--bf-raised);display:flex;align-items:center;transition:border-color .16s ease,box-shadow .16s ease}
.bal-funds-input-wrap:focus-within{border-color:var(--bf-ink);box-shadow:inset 0 0 0 1px var(--bf-ink)}
.bal-funds-prefix{padding-left:18px;color:var(--bf-sub);font-size:18px;font-style:normal}
.bal-funds-input{flex:1;align-self:stretch;display:block;min-width:0;height:auto;padding:0 18px 0 7px;border:0;outline:0;background:transparent;color:var(--bf-ink);font:500 18px Inter}
.bal-funds-input::placeholder{color:var(--bf-dim)}
.bal-funds-auto{margin-top:17px;display:flex;align-items:flex-start;gap:10px;cursor:pointer}
.bal-funds-auto input{position:absolute;opacity:0;pointer-events:none}
.bal-funds-check{position:relative;width:21px;height:21px;flex:none;border:1px solid var(--bf-sub);border-radius:6px;background:var(--bf-raised);color:var(--bf-bg)}
.bal-funds-auto input:checked+.bal-funds-check{border-color:var(--bf-ink);background:var(--bf-ink)}
.bal-funds-auto input:checked+.bal-funds-check::after{content:"";position:absolute;left:50%;top:50%;width:5px;height:9px;border:solid currentColor;border-width:0 2px 2px 0;transform:translate(-50%,-58%) rotate(45deg);transform-origin:center}
.bal-funds-auto-copy b{display:block;font-size:13px}
.bal-funds-auto-copy span{display:block;margin-top:3px;color:var(--bf-sub);font-size:11.5px;line-height:1.35}
.bal-funds-foot{margin-top:18px;padding-top:16px;border-top:1px solid var(--bf-line);display:flex;align-items:center;justify-content:space-between;gap:16px}
.bal-funds-balance{color:var(--bf-sub);font-size:11.5px}
.bal-funds-submit{height:40px;padding:0 17px;border:0;border-radius:11px;background:var(--bf-ink);color:var(--bf-bg);font:700 12.5px Inter;cursor:pointer}
.bal-funds-submit:disabled{background:var(--bf-disabled);color:var(--bf-disabled-ink);cursor:not-allowed}
.bal-checkout-loading{position:fixed;inset:0;z-index:9300;display:grid;place-items:center;padding:24px;background:var(--sf-surface,#fff);color:var(--sf-ink,#1f1f1f);animation:balCheckoutFade .18s ease both}
.bal-checkout-loading-copy{width:min(500px,calc(100vw - 48px));margin:auto;text-align:center}
.bal-checkout-loading-title{display:inline-block;margin:0;font:600 20px/1.2 Inter,system-ui,sans-serif;letter-spacing:-.025em;background-image:linear-gradient(90deg,transparent 0%,var(--sf-ink,#202020) 48%,transparent 100%),linear-gradient(var(--sf-dim,#aaa),var(--sf-dim,#aaa));background-size:48% 100%,100% 100%;background-repeat:no-repeat,no-repeat;background-position:-58% center,0 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:balCheckoutShimmer 1.8s linear infinite}
.bal-checkout-loading-sub{margin:8px 0 0;color:var(--sf-sub,#888);font:500 15px/1.4 Inter,system-ui,sans-serif}
@keyframes balCheckoutFade{from{opacity:0}to{opacity:1}}
@keyframes balCheckoutShimmer{0%{background-position:-58% center,0 0}100%{background-position:158% center,0 0}}
@media(prefers-reduced-motion:reduce){.bal-checkout-loading{animation:none}.bal-checkout-loading-title{animation:none;-webkit-text-fill-color:var(--sf-sub,#888);color:var(--sf-sub,#888)}}
.bal-promo{min-height:440px;margin-bottom:-1px;padding:22px 22px 0;border-radius:14px 14px 0 0;background:linear-gradient(180deg,#f3f4f8,#eef0f5);display:flex;flex-direction:column;overflow:visible;position:relative}
html[data-theme="dark"] .bal-promo{background:linear-gradient(180deg,#202126,#18191e)}
.bal-promo-x{position:absolute;top:14px;right:14px;width:30px;height:30px;border:0;background:none;color:var(--sf-sub);font-size:24px;cursor:pointer}
.bal-promo h3{max-width:230px;margin:0;padding-right:24px;font-size:18px;line-height:1.28;letter-spacing:-.02em}
.bal-promo p{max-width:250px;margin:8px 0 18px;color:var(--sf-sub);font-size:14px;line-height:1.45}
.bal-promo .bal-action{align-self:flex-start;position:relative;z-index:2}
.bal-payout-art{--bal-card-x:50%;--bal-card-y:50%;--bal-card-rx:0deg;--bal-card-ry:0deg;--bal-metal-x:0px;--bal-metal-y:0px;--bal-spectrum-x:0px;--bal-spectrum-y:0px;position:relative;z-index:1;width:min(100%,460px);min-height:0;aspect-ratio:85.6/53.98;align-self:center;flex:none;margin-top:26px;margin-bottom:14px;padding:22px;border:1px solid rgba(84,125,255,.3);border-radius:13px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 46%,rgba(31,67,164,.11),transparent 44%),linear-gradient(180deg,#000 0%,#010207 48%,#071333 75%,#174cdf 100%);color:#f5f7ff;cursor:pointer;transform:perspective(900px) rotateX(var(--bal-card-rx)) rotateY(var(--bal-card-ry));transform-style:preserve-3d;transform-origin:50% 52%;transition:transform .62s cubic-bezier(.16,1,.3,1),box-shadow .45s ease,border-color .45s ease;box-shadow:0 20px 42px rgba(0,0,0,.5),inset 0 1px 0 rgba(143,170,255,.16),inset 0 -1px 0 rgba(0,0,0,.72);will-change:transform}
.bal-payout-art::before{content:"";position:absolute;z-index:4;inset:5% 10% 8%;background-image:radial-gradient(circle,rgba(113,151,255,.82) 0 1px,transparent 1.45px),radial-gradient(circle,rgba(38,91,255,.64) 0 1.2px,transparent 1.65px),radial-gradient(circle,rgba(160,184,255,.56) 0 .8px,transparent 1.2px);background-size:17px 19px,29px 31px,41px 37px;background-position:2px 5px,11px 17px,23px 7px;mask-image:radial-gradient(ellipse at 51% 47%,#000 0 40%,rgba(0,0,0,.76) 52%,transparent 73%);opacity:.46;transform:translate3d(calc(var(--bal-spectrum-x) * .18),calc(var(--bal-spectrum-y) * .18),3px);transition:transform .62s cubic-bezier(.16,1,.3,1),opacity .3s ease;pointer-events:none}
html[data-theme="dark"] .bal-payout-art{background:radial-gradient(ellipse at 50% 46%,rgba(26,61,153,.1),transparent 44%),linear-gradient(180deg,#000 0%,#010207 48%,#06112f 75%,#1648d2 100%)}
.bal-payout-art.is-hover{transition:transform .11s ease-out,box-shadow .22s ease,border-color .22s ease;box-shadow:0 30px 58px rgba(0,0,0,.56),0 0 34px rgba(35,86,255,.2),inset 0 1px 0 rgba(160,184,255,.24),inset 0 -1px 0 rgba(0,0,0,.76)}
.bal-payout-art.is-hover::before{opacity:.62;transition:transform .11s ease-out,opacity .2s ease}
.bal-card-metal,.bal-card-spectrum,.bal-card-glint,.bal-card-grain{position:absolute;pointer-events:none}
.bal-card-metal{z-index:0;inset:-24%;background:radial-gradient(ellipse at 50% 112%,rgba(56,105,255,.92) 0%,rgba(29,78,238,.62) 25%,rgba(9,31,91,.36) 51%,transparent 73%),radial-gradient(circle at 8% 92%,rgba(31,82,255,.46),transparent 31%),radial-gradient(circle at 94% 92%,rgba(31,82,255,.42),transparent 30%);mix-blend-mode:screen;opacity:.9;transform:translate3d(var(--bal-metal-x),var(--bal-metal-y),0) scale(1.08);transition:transform .62s cubic-bezier(.16,1,.3,1),opacity .35s ease}
.bal-card-spectrum{z-index:1;inset:-8%;background:radial-gradient(circle at 5% 12%,rgba(73,118,255,.9) 0 1px,transparent 1.6px),radial-gradient(circle at 17% 28%,rgba(67,112,255,.72) 0 1.2px,transparent 1.8px),radial-gradient(circle at 28% 8%,rgba(112,150,255,.88) 0 1px,transparent 1.6px),radial-gradient(circle at 39% 35%,rgba(73,118,255,.76) 0 1.1px,transparent 1.7px),radial-gradient(circle at 48% 13%,rgba(132,162,255,.86) 0 1px,transparent 1.55px),radial-gradient(circle at 58% 30%,rgba(64,109,255,.72) 0 1.2px,transparent 1.75px),radial-gradient(circle at 69% 10%,rgba(113,150,255,.86) 0 1px,transparent 1.6px),radial-gradient(circle at 78% 39%,rgba(63,109,255,.68) 0 1.1px,transparent 1.7px),radial-gradient(circle at 91% 18%,rgba(87,130,255,.82) 0 1px,transparent 1.6px),radial-gradient(circle at 12% 58%,rgba(45,94,255,.7) 0 1px,transparent 1.6px),radial-gradient(circle at 25% 72%,rgba(83,126,255,.8) 0 1px,transparent 1.6px),radial-gradient(circle at 42% 59%,rgba(56,103,255,.74) 0 1.2px,transparent 1.75px),radial-gradient(circle at 61% 68%,rgba(98,139,255,.76) 0 1px,transparent 1.6px),radial-gradient(circle at 73% 57%,rgba(45,94,255,.7) 0 1px,transparent 1.55px),radial-gradient(circle at 88% 74%,rgba(80,124,255,.74) 0 1.1px,transparent 1.7px);mix-blend-mode:screen;opacity:.72;transform:translate3d(var(--bal-spectrum-x),var(--bal-spectrum-y),1px);transition:transform .62s cubic-bezier(.16,1,.3,1),opacity .32s ease}
.bal-card-glint{z-index:2;left:var(--bal-card-x);top:var(--bal-card-y);width:58%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(88,135,255,.28) 0%,rgba(28,78,228,.1) 26%,rgba(0,0,0,0) 68%);filter:blur(24px);mix-blend-mode:screen;opacity:0;transform:translate(-50%,-50%) translateZ(2px);transition:opacity .32s ease}
.bal-card-grain{z-index:3;inset:0;background:linear-gradient(180deg,transparent 0 66%,rgba(26,72,214,.12) 82%,rgba(62,111,255,.18) 100%),repeating-linear-gradient(112deg,transparent 0 18px,rgba(73,117,255,.012) 19px,transparent 20px 36px);mix-blend-mode:screen;opacity:.8}
.bal-payout-art.is-hover .bal-card-metal{opacity:.9;transition:transform .11s ease-out,opacity .2s ease}
.bal-payout-art.is-hover .bal-card-spectrum{opacity:.92;transition:transform .11s ease-out,opacity .2s ease}
.bal-payout-art.is-hover .bal-card-glint{opacity:.42;transition:opacity .18s ease}
.bal-payout-art.is-bouncing{animation:balCardBounce .68s cubic-bezier(.2,.78,.24,1)}
.bal-payout-art.is-bouncing .bal-card-glint{opacity:.48}
@keyframes balCardBounce{0%,100%{transform:perspective(900px) rotateX(var(--bal-card-rx)) rotateY(var(--bal-card-ry)) translateY(0) scale(1)}18%{transform:perspective(900px) rotateX(var(--bal-card-rx)) rotateY(var(--bal-card-ry)) translateY(4px) scale(.975)}45%{transform:perspective(900px) rotateX(var(--bal-card-rx)) rotateY(var(--bal-card-ry)) translateY(-9px) scale(1.018)}68%{transform:perspective(900px) rotateX(var(--bal-card-rx)) rotateY(var(--bal-card-ry)) translateY(2px) scale(.994)}84%{transform:perspective(900px) rotateX(var(--bal-card-rx)) rotateY(var(--bal-card-ry)) translateY(-2px) scale(1.004)}}
.bal-payout-copy{position:absolute;z-index:5;inset:22px;display:flex;flex-direction:column;justify-content:flex-start;transform:translateZ(18px);pointer-events:none}
.bal-payout-copy>span{font-size:12px;color:rgba(235,235,238,.68);text-shadow:0 1px 1px rgba(0,0,0,.72)}
.bal-payout-copy>strong{margin-top:2px;font-size:26px;letter-spacing:-.035em;color:#f7f7f8;text-shadow:0 1px 2px rgba(0,0,0,.82)}
.bal-payout-route{margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.16);box-shadow:none;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;font-weight:650;text-shadow:0 1px 1px rgba(0,0,0,.72)}
.bal-payout-route i{font-style:normal;color:rgba(235,235,238,.58)}
@media(prefers-reduced-motion:reduce){.bal-payout-art{transform:none!important;transition:none}.bal-payout-art.is-bouncing{animation:none}.bal-card-metal,.bal-card-spectrum{transition:none}.bal-card-glint{display:none}}
.bal-accounts.list{max-width:none}
.bal-accounts.list .bal-payments-group{display:grid;grid-template-columns:1fr;background:transparent;padding:0}
.bal-accounts.list .bal-account-card{min-height:118px;display:grid;grid-template-columns:minmax(180px,1fr) minmax(150px,.5fr) minmax(220px,.8fr);align-items:center}
.bal-accounts.list .bal-account-value{margin:0}
.bal-accounts.list .bal-account-label{display:none}
.bal-accounts.list .bal-promo{display:none}
.bal-activity-grid{position:relative;z-index:119;isolation:isolate;margin-top:52px;display:block;background:var(--bal-page-blend)}
.bal-activity-grid::before{content:"";position:absolute;z-index:-1;left:-34px;right:-34px;top:-80px;height:80px;background:linear-gradient(to bottom,transparent 0%,transparent 30%,var(--bal-page-blend) 100%);pointer-events:none}
.bal-activity-grid::after{content:"";position:absolute;z-index:-1;left:-34px;right:-34px;top:0;bottom:-150px;background:var(--bal-page-blend);pointer-events:none}
.bal-section-title{margin:0 0 18px;font-size:21px;letter-spacing:-.025em}
.bal-tabs{display:flex;gap:30px;margin-bottom:18px;border-bottom:1px solid var(--sf-border)}
.bal-tab{height:48px;padding:0;border:0;border-bottom:2px solid transparent;background:none;color:var(--sf-sub);font:650 15px Inter;cursor:pointer}
.bal-tab.on{border-bottom-color:var(--bal-accent);color:var(--bal-accent)}
.bal-ledger-orders .sf-toolbar{margin:0 0 14px;flex-wrap:nowrap}
.bal-ledger-orders .sf-typebtn,.bal-ledger-orders .sf-search-sm,.bal-ledger-orders .sf-pg-btns,.bal-ledger-orders .sf-ord-btn{height:34px;box-sizing:border-box}
.bal-ledger-orders .sf-typebtn,.bal-ledger-orders .sf-ord-btn{padding-top:0;padding-bottom:0}
.bal-ledger-orders .sf-typebtn{min-width:97px;justify-content:flex-start}
.bal-ledger-orders .sf-typebtn .tb-cv{margin-left:auto}
.bal-ledger-orders .sf-pg-btn{height:100%;width:32px}
.bal-ledger-orders .sf-search-sm{max-width:none;height:34px;border-radius:8px}
.bal-ledger-orders .sf-search-sm input{width:100%;min-width:0;border:0;background:transparent;outline:0;color:var(--sf-ink);font:inherit;font-size:14px}
.bal-ledger-orders .sf-search-sm input::placeholder{color:var(--sf-dim)}
.bal-ledger-orders .sf-ord-btn{font-size:13.5px}
.bal-ledger-orders .sf-card{border-radius:12px;max-height:none;overflow:visible;overscroll-behavior:auto}
.bal-payout-filter,.bal-payout-cols{position:relative;display:flex;flex:none}
.bal-payout-filter-menu,.bal-payout-cols-menu{position:absolute;z-index:70;top:calc(100% + 7px);left:0;min-width:190px;padding:7px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);box-shadow:0 14px 38px rgba(0,0,0,.15)}
.bal-payout-cols-menu{right:0;left:auto;min-width:210px}
.bal-payout-filter-menu[hidden],.bal-payout-cols-menu[hidden]{display:none}
.bal-payout-filter-menu button,.bal-payout-col{width:100%;min-height:38px;padding:7px 9px;border:0;border-radius:8px;background:none;color:var(--sf-ink);display:flex;align-items:center;justify-content:space-between;gap:14px;font:600 13px Inter;cursor:pointer;text-align:left}
.bal-payout-filter-menu button:hover,.bal-payout-col:hover{background:var(--sf-hover)}
.bal-payout-filter-menu button.on{font-weight:750}
.bal-payout-filter-menu small{color:var(--sf-dim);font-size:12px}
.bal-payout-col{justify-content:flex-start}
.bal-payout-col input{accent-color:var(--bal-accent)}
.bal-ledger-orders.sf-orders-index .bal-payout-table{width:100%;min-width:0;max-width:100%;table-layout:fixed;border-collapse:collapse;font-family:Inter,system-ui,sans-serif;font-size:13.5px}
.bal-payout-table th:nth-child(1){width:21%}.bal-payout-table th:nth-child(2){width:39%}.bal-payout-table th:nth-child(3){width:26%}.bal-payout-table th:nth-child(4){width:14%}
.bal-payout-table th{height:auto;padding:10px 16px;border-bottom:1px solid var(--sf-border-2);color:var(--sf-sub);font-size:12.5px;font-weight:600;text-align:left;white-space:nowrap}
.bal-payout-table td{height:auto;padding:12px 16px;border-bottom:1px solid var(--sf-border-2);color:var(--sf-ink);vertical-align:middle}
.bal-payout-table tbody tr:last-child td{border-bottom:0}
.bal-payout-table tbody tr:hover{background:var(--sf-hover)}
.bal-amount-cell{display:grid;grid-template-columns:92px auto;align-items:center;column-gap:10px;white-space:nowrap}
.bal-ledger-amount{display:block;text-align:right;font-family:Inter,system-ui,sans-serif;font-weight:720;font-variant-numeric:tabular-nums}
.bal-ledger-status{justify-self:start}
.bal-ledger-status,.bal-instant-tag{display:inline-flex;align-items:center;min-height:24px;padding:2px 7px;border:1px solid;border-radius:6px;background:var(--sf-surface);font-size:12.5px;line-height:1;font-weight:500;white-space:nowrap}
.bal-ledger-status.paid{border-color:#88e65b;background:#f2ffe9;color:#238313}
.bal-ledger-status.failed{border-color:#ffc1ca;background:#fff5f6;color:#dc1735}
.bal-ledger-status.scheduled{border-color:#cbd5e1;background:#f8fafc;color:#59677b}
html[data-theme="dark"] .bal-ledger-status.paid{border-color:rgba(52,199,89,.55);background:rgba(52,199,89,.09);color:#5DD97E}
html[data-theme="dark"] .bal-ledger-status.failed{border-color:rgba(255,59,48,.55);background:rgba(255,59,48,.09);color:#FF6961}
html[data-theme="dark"] .bal-ledger-status.scheduled{border-color:rgba(142,142,147,.38);background:rgba(120,120,128,.09);color:#a0a0a8}
.bal-destination-cell{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px}
.bal-payout-destination{min-width:0;color:var(--sf-sub);font-weight:500;line-height:1.45;white-space:normal}
.bal-destination-last4{white-space:nowrap}
.bal-instant-tag{border-color:#cad7e7;background:#f7faff;color:#52647d}
html[data-theme="dark"] .bal-instant-tag{border-color:#3E7CFA;background:rgba(62,124,250,.09);color:#4DA3FF}
.bal-ledger-no-results{display:none;height:150px;text-align:center;color:var(--sf-sub)}
.bal-ledger-no-results.show{display:table-row}
.bal-payout-table.hide-destination .bal-col-destination,.bal-payout-table.hide-type .bal-col-type,.bal-payout-table.hide-date .bal-col-date{display:none}
.bal-ledger-empty{min-height:155px;display:grid;place-items:center;border-bottom:1px solid var(--sf-border);color:var(--sf-sub);font-size:14px;text-align:center}
.bal-view-more{height:48px;padding:0;border:0;background:none;color:var(--bal-accent);font:650 14px Inter;cursor:pointer}
@media(max-width:980px){.bal-accounts{max-width:none}.bal-payments-group{grid-template-columns:minmax(300px,1fr) minmax(340px,1.05fr)}.bal-ledger-head,.bal-ledger-row{grid-template-columns:140px minmax(190px,1fr) minmax(180px,.9fr) 100px;gap:12px}}
@media(max-width:900px){.bal-ledger-orders .sf-toolbar{flex-wrap:wrap}.bal-ledger-orders .sf-search-sm{order:5;flex-basis:100%}.bal-ledger-orders.sf-orders-index .bal-payout-table{min-width:760px}.bal-ledger-orders .sf-card{overflow-x:auto;overflow-y:clip;overscroll-behavior-x:contain;overscroll-behavior-y:auto}}
@media(max-width:700px){body[data-view="balance"] .sf-page{padding:24px 22px 140px}.bal-actions{flex-wrap:nowrap;overflow-x:auto;margin:0 -22px;padding:0 22px 5px}.bal-action{flex:none}.bal-switcher{display:none}.bal-accounts{margin-top:26px}.bal-accounts::before{left:-22px;right:-22px;top:-92px}.bal-payments-group{grid-template-columns:1fr}.bal-promo{min-height:330px;border-radius:14px;margin-bottom:12px}.bal-account-card{min-height:280px}.bal-account-popover{right:12px;width:calc(100% - 24px)}.bal-currency-overlay{padding:12px}.bal-currency-modal{width:100%;max-height:calc(100vh - 24px)}.bal-currency-body{grid-template-columns:1fr;padding:20px}.bal-currency-copy{min-height:430px}.bal-currency-copy h2{font-size:24px}.bal-currency-options{grid-template-columns:1fr}.bal-currency-visual{display:none}.bal-funds-overlay{padding:12px}.bal-funds-modal{width:100%;max-height:calc(100vh - 24px);padding:20px;overflow:auto;border-radius:18px}.bal-funds-head h2{font-size:24px}.bal-funds-options{grid-template-columns:1fr 1fr}.bal-funds-option{min-height:76px}.bal-funds-foot{align-items:stretch;flex-direction:column}.bal-funds-submit{width:100%}.bal-activity-grid{margin-top:38px}.bal-activity-grid::before,.bal-activity-grid::after{left:-22px;right:-22px}.bal-ledger-orders .sf-toolbar{gap:8px}.bal-ledger-orders .sf-ord-create{display:none}.bal-payout-filter .sf-typebtn{padding:0 11px}.bal-accounts.list .bal-account-card{display:flex;min-height:210px}.bal-accounts.list .bal-account-value{margin-top:7px}}
/* Payouts — Stripe's operational flow expressed in Attract's existing
compact finance language: quiet surfaces, clear state, centered actions. */
body[data-view="payouts"] .sf-page{max-width:2000px;padding:24px 22px 96px}
.po-shell{--po-positive:#16794a;--po-warning:#8a6100;--po-danger:#ba1a2f;display:flex;flex-direction:column;gap:20px}
.po-btn{height:40px;padding:0 15px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);display:inline-flex;align-items:center;justify-content:center;gap:7px;font:650 13px Inter;cursor:pointer}
.po-btn:hover{background:var(--sf-hover)}
.po-btn.primary{border-color:#111;background:#111;color:#fff}
html[data-theme="dark"] .po-btn.primary{border-color:#f3f3f3;background:#f3f3f3;color:#111}
.po-btn:disabled,.po-btn[aria-disabled="true"]{opacity:.42;cursor:not-allowed}
.po-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.po-connect{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:13px;padding:15px 16px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-hover)}
.po-connect-ic{width:36px;height:36px;border-radius:10px;background:var(--sf-surface);display:grid;place-items:center}
.po-connect-ic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.po-connect b{display:block;font-size:13.5px}.po-connect span{display:block;margin-top:2px;color:var(--sf-sub);font-size:12.5px}
.po-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-surface);overflow:hidden}
.po-stat{min-height:112px;padding:17px 18px;border-right:1px solid var(--sf-border-2);display:flex;flex-direction:column;justify-content:space-between}
.po-stat:last-child{border-right:0}
.po-stat-l{color:var(--sf-sub);font-size:12.5px}
.po-stat-v{font-size:23px;font-weight:720;letter-spacing:-.03em;color:var(--sf-ink);font-variant-numeric:tabular-nums}
.po-stat-s{color:var(--sf-dim);font-size:11.5px}
.po-panel{min-width:0}
.po-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:13px}
.po-status-dropdown{position:relative;display:inline-flex;flex:none}
.po-status-trigger{height:34px;min-width:118px;padding:0 13px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);display:inline-flex;align-items:center;gap:8px;font:600 13.5px Inter;cursor:pointer}
.po-status-trigger .po-filter-count{color:var(--sf-sub)}
.po-status-trigger .tb-cv{width:12px;height:7px;margin-left:auto;transition:transform .15s}
.po-status-dropdown.open .po-status-trigger{border-color:var(--sf-dim)}
.po-status-dropdown.open .po-status-trigger .tb-cv{transform:rotate(180deg)}
.po-status-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:60;display:none;min-width:210px;padding:6px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);box-shadow:0 14px 34px rgba(0,0,0,.2)}
.po-status-dropdown.open .po-status-menu{display:block}
.po-status-option{width:100%;padding:9px 11px;border:0;border-radius:8px;background:none;color:var(--sf-ink);display:flex;align-items:center;justify-content:space-between;gap:18px;font:550 13.5px Inter;text-align:left;cursor:pointer}
.po-status-option:hover{background:var(--sf-bg)}.po-status-option.on{font-weight:700}.po-status-option span{color:var(--sf-sub);font-size:12.5px;font-weight:600}
.po-search{min-width:180px;height:34px;flex:1;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);color:var(--sf-dim);display:flex;align-items:center;gap:7px;padding:0 10px;font-size:13px}
.po-search svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8}
.po-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--sf-ink);font:500 13px Inter}.po-search input::placeholder{color:var(--sf-dim)}
.po-toolbar-actions{display:flex;align-items:center;gap:10px;flex:none}
.po-toolbar .po-btn{height:34px;padding:0 14px;border-radius:10px;font:600 13.5px Inter}
.po-toolbar .po-btn svg{width:15px;height:15px}
.po-list-card{max-height:calc(100vh - 300px);border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);overflow:auto;overscroll-behavior:none;scrollbar-width:none;-ms-overflow-style:none}
.po-list-card::-webkit-scrollbar{width:0;height:0;display:none}
.po-table-wrap{overflow:visible}
.po-table{width:100%;min-width:760px;border-collapse:collapse;font-size:13.5px}
.po-table th{position:sticky;top:0;z-index:5;padding:10px 16px;border-bottom:0;background:var(--sf-surface);color:var(--sf-sub);font-size:12.5px;font-weight:600;text-align:left;white-space:nowrap}
.po-table th::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--sf-border);pointer-events:none}
html[data-theme="dark"] .po-table th::before{background:#2f2f31}
.po-table th.num,.po-table td.num{text-align:right}
.po-table td{padding:12px 16px;border-bottom:1px solid var(--sf-border-2);vertical-align:middle;color:var(--sf-ink);white-space:nowrap}
.po-table th:first-child,.po-table td:first-child{position:sticky;left:0;z-index:2;min-width:112px;background:var(--sf-surface)}.po-table th:first-child{z-index:7}
.po-table th:first-child::after,.po-table td:first-child::after{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:transparent;pointer-events:none}.po-list-card.sc .po-table th:first-child::after,.po-list-card.sc .po-table td:first-child::after{background:var(--sf-border-2)}
.po-table tbody tr{cursor:pointer}.po-table tbody tr:hover td{background:#F7F7F7}.po-table tbody tr:last-child td{border-bottom:0}html[data-theme="dark"] .po-table tbody tr:hover td{background:#161618}
.po-amount{font-weight:700;font-variant-numeric:tabular-nums}.po-destination{display:flex;align-items:center;gap:9px}.po-bank-ic{width:30px;height:30px;border-radius:8px;background:var(--sf-hover);display:grid;place-items:center;color:var(--sf-sub)}.po-destination>.po-bank-ic{display:grid;place-items:center;margin-top:0}.po-bank-ic svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}.po-destination b{display:block;font-size:12.5px}.po-destination span{display:block;margin-top:2px;color:var(--sf-dim);font-size:11.5px}
.po-status{display:inline-flex;align-items:center;gap:7px;min-height:28px;padding:0 11px;border:1px solid rgba(120,120,128,.28);border-radius:999px;background:rgba(120,120,128,.14);color:#6b7177;font-size:11.5px;font-weight:650}.po-status::before{content:"";width:7px;height:7px;border-radius:50%;background:#8E8E93}.po-status.paid{border-color:rgba(52,199,89,.42);background:rgba(52,199,89,.17);color:#1E8A45}.po-status.paid::before{background:#34C759}.po-status.transit{border-color:rgba(0,122,255,.38);background:rgba(0,122,255,.14);color:#0062CC}.po-status.transit::before{background:#007AFF}.po-status.failed{border-color:rgba(255,46,85,.42);background:rgba(255,46,85,.16);color:#d61f43}.po-status.failed::before{background:#FF2E55}
html[data-theme="dark"] .po-status{border-color:rgba(142,142,147,.38);background:rgba(120,120,128,.09);color:#a0a0a8}
html[data-theme="dark"] .po-status.paid{border-color:rgba(52,199,89,.55);background:rgba(52,199,89,.09);color:#5DD97E}
html[data-theme="dark"] .po-status.transit{border-color:#3E7CFA;background:rgba(62,124,250,.09);color:#4DA3FF}
html[data-theme="dark"] .po-status.failed{border-color:rgba(255,46,85,.55);background:rgba(255,46,85,.09);color:#ff6a86}
.po-empty{min-height:280px;padding:42px 20px;display:grid;place-items:center;text-align:center}.po-empty-ic{width:44px;height:44px;margin:auto;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-hover);display:grid;place-items:center}.po-empty h3{margin:15px 0 6px;font-size:16px}.po-empty p{max-width:390px;margin:0;color:var(--sf-sub);font-size:12.5px;line-height:1.5}
.po-foot{min-height:52px;padding:0 16px;border-top:1px solid var(--sf-border-2);display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--sf-dim);font-size:11.5px}
.po-overlay{position:fixed;inset:0;z-index:9500;padding:20px;background:rgba(0,0,0,.34);backdrop-filter:blur(4px);display:grid;place-items:center;animation:fmIn .15s ease}
.po-modal{width:min(520px,calc(100vw - 40px));max-height:calc(100vh - 40px);overflow:auto;border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);box-shadow:0 28px 82px rgba(0,0,0,.32)}
.po-modal-head{min-height:65px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--sf-border-2)}
.po-modal-head h2{margin:0;font-size:18px;letter-spacing:-.025em}.po-close{width:34px;height:34px;border:0;border-radius:9px;background:none;color:var(--sf-sub);display:grid;place-items:center;cursor:pointer}.po-close svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.po-close:hover{background:var(--sf-hover);color:var(--sf-ink)}
.po-modal-body{padding:20px}.po-intro{margin:0 0 17px;color:var(--sf-sub);font-size:12.5px;line-height:1.5}
.po-field{display:block;margin-bottom:16px}.po-label{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px;color:var(--sf-ink);font-size:12.5px;font-weight:650}.po-label small{color:var(--sf-dim);font-weight:500}
.po-fixed-amount{min-height:72px;padding:14px 16px;border:0;border-radius:12px;background:var(--sf-hover);display:flex;align-items:center;justify-content:space-between;gap:18px}.po-fixed-amount strong{color:var(--sf-ink);font-size:27px;font-weight:720;letter-spacing:-.035em;font-variant-numeric:tabular-nums}.po-fixed-amount span{max-width:190px;color:var(--sf-sub);font-size:11.5px;line-height:1.4;text-align:right}
.po-methods{display:grid;grid-template-columns:1fr 1fr;gap:9px}.po-method{padding:13px;border:1px solid var(--sf-border);border-radius:11px;background:var(--sf-surface);color:var(--sf-ink);text-align:left;cursor:pointer}.po-method:hover{background:var(--sf-hover)}.po-method[aria-pressed="true"]{border-color:var(--sf-ink);box-shadow:inset 0 0 0 1px var(--sf-ink)}.po-method b{display:block;font-size:12.5px}.po-method span{display:block;margin-top:4px;color:var(--sf-sub);font-size:11px;line-height:1.35}
.po-destination-card,.po-review{padding:14px;border:1px solid var(--sf-border);border-radius:11px;background:var(--sf-hover)}.po-destination-card{display:flex;align-items:center;gap:11px}.po-destination-card>.po-bank-ic{position:relative;display:block;flex:none;margin-top:0;background:var(--sf-surface);color:var(--sf-sub)}.po-destination-card>.po-bank-ic svg{position:absolute;left:50%;top:50%;margin:0;transform:translate(-50%,-50%)}.po-destination-card b{display:block;font-size:12.5px}.po-destination-card span{display:block;margin-top:2px;color:var(--sf-sub);font-size:11.5px}
.po-review{display:flex;flex-direction:column;gap:11px}.po-review-row{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;font-size:12.5px}.po-review-row span{color:var(--sf-sub)}.po-review-row b{text-align:right}.po-review-total{padding-top:11px;border-top:1px solid var(--sf-border);font-size:14px}
.po-error{margin-top:12px;padding:10px 12px;border:1px solid rgba(186,26,47,.25);border-radius:9px;background:rgba(186,26,47,.06);color:var(--po-danger);font-size:11.5px;line-height:1.45}.po-error[hidden]{display:none}
.po-modal-foot{min-height:67px;padding:13px 20px;border-top:1px solid var(--sf-border-2);display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--sf-hover)}
.po-success{padding:36px 24px 30px;text-align:center}.po-success-ic{width:52px;height:52px;margin:auto;border-radius:50%;background:rgba(22,121,74,.12);color:var(--po-positive);display:grid;place-items:center;font-size:24px}.po-success h2{margin:17px 0 7px;font-size:21px}.po-success p{margin:0 auto 22px;max-width:360px;color:var(--sf-sub);font-size:12.5px;line-height:1.5}
html[data-theme="dark"] .po-modal{--sf-surface:#050506;--sf-ink:#fff;--sf-sub:rgba(255,255,255,.72);--sf-dim:rgba(255,255,255,.5);--sf-border:rgba(255,255,255,.14);--sf-border-2:rgba(255,255,255,.1);--sf-hover:rgba(255,255,255,.075);border-color:rgba(255,255,255,.16);background:#050506;color:#fff;box-shadow:0 30px 90px rgba(0,0,0,.72)}
html[data-theme="dark"] .po-modal-head,html[data-theme="dark"] .po-modal-foot{border-color:rgba(255,255,255,.1);background:#050506}
html[data-theme="dark"] .po-modal .po-close{color:#fff}
html[data-theme="dark"] .po-modal .po-schedule-option{border-color:rgba(255,255,255,.16);background:#050506;color:#fff}
html[data-theme="dark"] .po-modal .po-schedule-option[aria-pressed="true"]{border-color:rgba(255,255,255,.46);background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
html[data-theme="dark"] .po-modal .po-btn{border-color:rgba(255,255,255,.16);background:#050506;color:#fff}
html[data-theme="dark"] .po-modal .po-btn.primary{border-color:#fff;background:#fff;color:#050506}
html[data-theme="dark"] .po-modal .po-select,html[data-theme="dark"] .po-modal .po-method{border-color:rgba(255,255,255,.16);background:#050506;color:#fff}
html[data-theme="dark"] .po-modal .po-fixed-amount{background:#050506;color:#fff}
.po-drawer-bg{position:fixed;inset:0;z-index:9450;background:rgba(5,5,7,.52);backdrop-filter:none;-webkit-backdrop-filter:none;animation:fmIn .16s ease}.po-drawer{--sf-surface:rgba(249,249,250,.96);--sf-hover:rgba(0,0,0,.045);position:absolute;right:14px;top:14px;bottom:14px;width:min(480px,calc(100vw - 28px));overflow:auto;border:1px solid rgba(255,255,255,.72);border-radius:22px;background:rgba(249,249,250,.96);color:var(--sf-ink);box-shadow:-24px 22px 78px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.72);backdrop-filter:none;-webkit-backdrop-filter:none;animation:poDrawerIn .24s cubic-bezier(.2,.75,.25,1)}@keyframes poDrawerIn{from{transform:translateX(34px) scale(.985);opacity:.35}to{transform:none;opacity:1}}
.po-drawer-head{position:sticky;top:0;z-index:2;min-height:64px;padding:0 18px;border-bottom:1px solid var(--sf-border-2);background:rgba(249,249,250,.98);backdrop-filter:none;-webkit-backdrop-filter:none;display:flex;align-items:center;justify-content:space-between}.po-drawer-head h2{margin:0;font-size:15px}.po-drawer-body{padding:20px}.po-drawer-amount{font-size:30px;font-weight:750;letter-spacing:-.04em}.po-drawer-meta{margin-top:8px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.po-drawer-section{padding:18px 0;border-bottom:1px solid var(--sf-border-2)}.po-drawer-section h3{margin:0 0 12px;font-size:12px;color:var(--sf-sub);text-transform:uppercase;letter-spacing:.06em}.po-detail-row{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin:10px 0;font-size:12.5px}.po-detail-row span{color:var(--sf-sub)}.po-detail-row b{text-align:right;word-break:break-word}.po-timeline{display:flex;flex-direction:column}.po-event{position:relative;padding:0 0 18px 24px;font-size:12.5px}.po-event::before{content:"";position:absolute;left:5px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--sf-ink)}.po-event::after{content:"";position:absolute;left:8px;top:16px;bottom:0;width:1px;background:var(--sf-border)}.po-event:last-child::after{display:none}.po-event b{display:block}.po-event span{display:block;margin-top:3px;color:var(--sf-sub);font-size:11.5px}
html[data-theme="dark"] .po-drawer-bg{background:rgba(0,0,0,.78)}
html[data-theme="dark"] .po-drawer{--sf-surface:#0b0b0c;--sf-ink:#fff;--sf-sub:rgba(255,255,255,.68);--sf-dim:rgba(255,255,255,.46);--sf-border:rgba(255,255,255,.14);--sf-border-2:rgba(255,255,255,.1);--sf-hover:rgba(255,255,255,.075);border-color:rgba(255,255,255,.12);background:#050506;color:#fff;box-shadow:-28px 24px 92px rgba(0,0,0,.78),inset 0 1px 0 rgba(255,255,255,.09)}
html[data-theme="dark"] .po-drawer-head{background:#050506;border-bottom-color:rgba(255,255,255,.1)}
html[data-theme="dark"] .po-drawer .po-close,html[data-theme="dark"] .po-drawer .po-bank-ic{color:#fff}
html[data-theme="dark"] .po-drawer .po-destination-card{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.13)}
.po-schedule-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.po-schedule-option{min-height:68px;padding:11px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:650 12.5px Inter;text-align:left;cursor:pointer}.po-schedule-option span{display:block;margin-top:3px;color:var(--sf-sub);font:500 10.5px Inter}.po-schedule-option[aria-pressed="true"]{border-color:var(--sf-ink);box-shadow:inset 0 0 0 1px var(--sf-ink);background:var(--sf-hover)}.po-select{width:100%;height:42px;padding:0 11px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);font:500 12.5px Inter;outline:0}
@media(max-width:900px){.po-summary{grid-template-columns:1fr 1fr}.po-stat:nth-child(2){border-right:0}.po-stat:nth-child(-n+2){border-bottom:1px solid var(--sf-border-2)}.po-toolbar{flex-wrap:wrap}.po-search{order:3;flex-basis:100%}.po-toolbar-actions{margin-left:auto}}
@media(max-width:650px){body[data-view="payouts"] .sf-page{padding:22px 18px 120px}.po-summary{grid-template-columns:1fr}.po-stat{min-height:94px;border-right:0;border-bottom:1px solid var(--sf-border-2)!important}.po-stat:last-child{border-bottom:0!important}.po-toolbar{align-items:stretch}.po-status-dropdown{flex:1}.po-status-trigger{width:100%}.po-toolbar-actions{width:100%;margin-left:0;overflow-x:auto}.po-toolbar-actions .po-btn{flex:none}.po-search{order:3;flex-basis:100%}.po-list-card{max-height:none}.po-methods,.po-schedule-options{grid-template-columns:1fr}.po-modal-foot{align-items:stretch;flex-direction:column-reverse}.po-modal-foot .po-btn{width:100%}.po-connect{grid-template-columns:auto minmax(0,1fr)}.po-connect .po-btn{grid-column:1/-1;width:100%}.po-drawer{left:10px;right:10px;top:auto;bottom:10px;width:auto;max-height:calc(100vh - 20px);border-radius:20px;animation:poDrawerUp .24s cubic-bezier(.2,.75,.25,1)}.po-drawer-body{padding:18px}.po-drawer-head{min-height:60px}@keyframes poDrawerUp{from{transform:translateY(34px) scale(.985);opacity:.35}to{transform:none;opacity:1}}}
.sub-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:middle}
.sub-est{font-size:10.5px;font-weight:700;color:#b45309;background:#fef3d3;border-radius:5px;padding:1px 5px;letter-spacing:.02em;text-transform:uppercase}
tr.sub-total td{background:var(--sf-hover);font-weight:600;border-top:1px solid var(--sf-border)}
.sf-cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
@media(max-width:780px){.sf-cards-3{grid-template-columns:1fr}}
.sf-cards-3 .sf-report-card{cursor:default}
.sf-cards-3 h4{margin:0 0 4px;font-size:13.5px;font-weight:650}
.sf-cards-3 p{margin:0;font-size:12.5px}
.fin-modal-bg{position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.34);display:flex;align-items:center;justify-content:center;animation:fmIn .12s ease}
@keyframes fmIn{from{opacity:0}to{opacity:1}}
.fin-modal{width:440px;max-width:calc(100vw - 32px);background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:16px;box-shadow:0 24px 70px rgba(0,0,0,.3);overflow:hidden}
.fin-modal .fm-h{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--sf-border-2)}
.fin-modal .fm-h h3{margin:0;font-size:15px;font-weight:650}
.fin-modal .fm-x{border:none;background:none;font-size:22px;line-height:1;color:var(--sf-dim);cursor:pointer;padding:0 2px}
.fin-modal .fm-b{padding:16px 18px;display:flex;flex-direction:column;gap:13px}
.fin-modal .fm-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.fin-modal .fm-f{display:flex;flex-direction:column;gap:5px}
.fin-modal .fm-f span{font-size:12px;font-weight:600;color:var(--sf-sub)}
.fin-modal .fm-foot{display:flex;align-items:center;justify-content:space-between;padding:13px 18px;border-top:1px solid var(--sf-border-2);background:var(--sf-hover)}
.fin-modal .fm-foot-r{display:flex;gap:9px}
.fin-modal .fm-del{color:#a3341d;border-color:#f0cfc8}
/* Finance home — Stripe-inspired cash overview with an Orders-density data
language. The overview controls pin to the top of .sf-content (the top app
bar is already outside that scroll container). */
body[data-view="finance"] .sf-page{max-width:1680px;padding-top:22px}
.fin-home{--fin-purple:#7657e8}
.fin-notice{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:11px;padding:14px 16px;margin-bottom:20px;border:1px solid var(--sf-border);border-radius:11px;background:var(--sf-surface)}
.fin-notice>svg{width:17px;height:17px;margin-top:1px;color:var(--sf-sub)}
.fin-notice b{display:block;font-size:13.5px;color:var(--sf-ink)}
.fin-notice span{display:block;margin-top:3px;font-size:12.5px;line-height:1.45;color:var(--sf-sub)}
.fin-notice-x{border:0;background:none;color:var(--sf-sub);padding:2px;cursor:pointer;border-radius:7px;display:flex}
.fin-notice-x:hover{background:var(--sf-hover);color:var(--sf-ink)}
.fin-notice-x svg{width:16px;height:16px}
.fin-today-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:3px 0 12px;border-bottom:1px solid var(--sf-border)}
.fin-today-head h2,.fin-overview-title{margin:0;font-size:25px;line-height:1.15;letter-spacing:-.035em;color:var(--sf-ink)}
.fin-today-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,.62fr);gap:24px;padding:20px 0 26px}
.fin-today-main,.fin-today-chartcol{min-width:0}
.fin-today-stats{display:flex;gap:48px;align-items:flex-start;flex-wrap:wrap;margin-bottom:12px}
.fin-today-stat{display:flex;flex-direction:column;gap:3px;min-width:150px}
.fin-today-stat.primary,.fin-today-stat.date{position:relative}
.fin-today-stat.metric-open,.fin-today-stat.date-open{z-index:70}
.fin-today-stat .l{font-size:12.5px;color:var(--sf-sub);display:flex;align-items:center;gap:5px}
.fin-today-stat .l svg{width:13px;height:13px}
.fin-today-metric-btn,.fin-today-date-btn{width:max-content;border:0;background:none;padding:0;font:inherit;cursor:pointer}
.fin-today-metric-btn:hover,.fin-today-date-btn:hover{color:var(--sf-ink)}
.fin-today-metric-btn:focus-visible,.fin-today-date-btn:focus-visible{outline:2px solid var(--sf-ink);outline-offset:4px;border-radius:4px}
.fin-hero-menu{position:absolute;z-index:72;top:25px;left:-9px;width:216px;padding:7px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);box-shadow:0 14px 34px rgba(24,28,36,.16);animation:finHeroMenuIn .16s cubic-bezier(.2,.75,.25,1)}
.fin-hero-option{width:100%;height:42px;border:0;border-radius:8px;background:transparent;color:var(--sf-ink);display:grid;grid-template-columns:20px minmax(0,1fr);align-items:center;gap:8px;padding:0 11px;font:500 13.5px Inter;text-align:left;cursor:pointer}
.fin-hero-option:hover,.fin-hero-option:focus-visible,.fin-hero-option.on{background:var(--sf-hover);outline:none}
.fin-hero-option.on{font-weight:600}
.fin-hero-check{width:16px;height:16px;display:flex;align-items:center;justify-content:center;color:transparent}
.fin-hero-option.on .fin-hero-check{color:var(--sf-ink)}
.fin-hero-check svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.fin-hero-date-pop{--fhd-accent:#303030;--fhd-range:#eeeeef;--fhd-on:#fff;position:absolute;z-index:72;top:25px;left:-11px;width:342px;padding:14px;border:1px solid var(--sf-border);border-radius:15px;background:var(--sf-surface);box-shadow:0 18px 42px rgba(24,28,36,.17);animation:finHeroMenuIn .16s cubic-bezier(.2,.75,.25,1)}
html[data-theme="dark"] .fin-hero-date-pop{--fhd-accent:#f2f2f3;--fhd-range:#343438;--fhd-on:#1b1b1d}
.fin-hero-date-input{box-sizing:border-box;width:100%;height:42px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);padding:0 12px;color:var(--sf-ink);font:500 14px Inter,system-ui,sans-serif;outline:none;font-variant-numeric:tabular-nums}
.fin-hero-date-input:focus{border-color:var(--fhd-accent);box-shadow:0 0 0 3px rgba(48,48,48,.12)}
.fin-hero-date-input.date-enter{animation:finDateValueIn .28s cubic-bezier(.2,.75,.25,1)}
.fin-hero-date-head{height:42px;margin-top:8px;display:grid;grid-template-columns:34px 1fr 34px;align-items:center}
.fin-hero-date-title{text-align:center;font-size:14.5px;font-weight:600;color:var(--sf-ink)}
.fin-hero-date-nav{width:32px;height:32px;border:0;border-radius:8px;background:none;color:var(--sf-sub);display:flex;align-items:center;justify-content:center;cursor:pointer}
.fin-hero-date-nav:hover:not(:disabled){background:var(--sf-hover);color:var(--sf-ink)}
.fin-hero-date-nav:disabled{opacity:.3;cursor:not-allowed}
.fin-hero-date-nav svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.fin-hero-date-week,.fin-hero-date-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.fin-hero-date-week span{height:29px;display:flex;align-items:center;justify-content:center;color:var(--sf-sub);font-size:11.5px}
.fin-hero-date-grid{row-gap:4px;animation:finHeroCalendarIn .18s ease-out}
.fin-hero-date-day,.fin-hero-date-blank{height:36px}
.fin-hero-date-day{border:0;background:none;padding:0;color:var(--sf-ink);font:500 13px Inter;cursor:pointer}
.fin-hero-date-day span{width:34px;height:34px;margin:auto;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .14s ease,transform .14s ease}
.fin-hero-date-day:hover:not(:disabled) span{background:var(--sf-hover);transform:scale(1.06)}
.fin-hero-date-day.is-selected span{background:var(--fhd-accent);color:var(--fhd-on);font-weight:650;animation:finDatePop .3s cubic-bezier(.18,.8,.28,1.25)}
.fin-hero-date-day.is-today:not(.is-selected) span{background:var(--fhd-range)}
.fin-hero-date-day:disabled{color:var(--sf-dim);cursor:not-allowed}
@keyframes finHeroMenuIn{from{opacity:0;transform:translateY(-5px) scale(.985)}to{opacity:1;transform:none}}
@keyframes finHeroCalendarIn{from{opacity:.25;transform:translateX(5px)}to{opacity:1;transform:none}}
.fin-today-stat .v{font-size:21px;font-weight:700;letter-spacing:-.02em;color:var(--sf-ink)}
.fin-today-stat .s{font-size:11.5px;color:var(--sf-dim)}
.fin-live-chart{position:relative;z-index:1;isolation:isolate;height:190px;display:flex;align-items:flex-end;border-bottom:1px solid var(--sf-border);overflow:visible;cursor:crosshair}
.fin-live-chart .sf-svg{height:180px;min-width:560px;overflow:hidden}
.fin-trend-current{fill:none;stroke:var(--sf-ink);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.fin-trend-current.fin-trend-reveal{stroke-dasharray:1;stroke-dashoffset:1;animation:finTrendReveal .85s cubic-bezier(.22,.72,.24,1) forwards}
.fin-trend-compare{fill:none;stroke:#d3d3d3;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:3 5;vector-effect:non-scaling-stroke;animation:finCompareDrift 1.8s linear infinite}
.fin-trend-compare.is-off{display:none}
.fin-trend-area{opacity:0;animation:finTrendArea .7s .18s ease-out forwards}
.fin-trend-end{fill:var(--sf-ink);stroke:none;opacity:0;animation:finTrendPoint .25s .72s ease-out forwards}
.fin-chart-end-label{fill:var(--sf-dim);font:500 11px Inter;font-variant-numeric:tabular-nums;paint-order:stroke;stroke:var(--sf-surface);stroke-width:4px;stroke-linejoin:round;opacity:0;animation:finTrendPoint .25s .72s ease-out forwards}
@keyframes finTrendReveal{to{stroke-dashoffset:0}}
@keyframes finCompareDrift{to{stroke-dashoffset:-16}}
@keyframes finTrendArea{to{opacity:1}}
@keyframes finTrendPoint{to{opacity:1}}
html[data-theme="dark"] .fin-trend-compare{stroke:#48484f}
@media(prefers-reduced-motion:reduce){
.fin-trend-current.fin-trend-reveal{stroke-dashoffset:0;animation:none}
.fin-trend-compare,.fin-trend-area,.fin-trend-end,.fin-chart-end-label{animation:none}
.fin-trend-area,.fin-trend-end,.fin-chart-end-label{opacity:1}
.fin-hero-menu,.fin-hero-date-pop,.fin-hero-date-grid,.fin-hero-date-day.is-selected span{animation:none}
}
.fin-balstrip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding-top:15px}
.fin-balitem{display:flex;flex-direction:column;gap:4px}
.fin-balitem .h{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12.5px;color:var(--sf-sub)}
.fin-balitem .h button{border:0;background:none;color:var(--acc);font:600 12.5px Inter;cursor:pointer;padding:0}
.fin-balitem .v{font-size:20px;font-weight:700;color:var(--sf-ink)}
.fin-balitem .s{font-size:11.5px;color:var(--sf-dim)}
.fin-reco{align-self:start;min-height:285px;padding:18px;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-hover);display:flex;flex-direction:column;transform-origin:top right;transition:opacity .18s ease,transform .18s ease}
.fin-reco.is-closing{opacity:0;transform:translateY(-6px) scale(.985);pointer-events:none}
.fin-reco-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.fin-reco-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border:1px solid var(--sf-border);border-radius:7px;background:var(--sf-surface);font-size:11.5px;color:var(--sf-sub)}
.fin-reco-badge svg{width:13px;height:13px}
.fin-reco h3{margin:22px 0 9px;font-size:20px;line-height:1.12;letter-spacing:-.025em;color:var(--sf-ink)}
.fin-reco p{margin:0;font-size:13px;line-height:1.5;color:var(--sf-sub)}
.fin-reco-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:20px}
.fin-reco-foot .tm{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--sf-dim);white-space:nowrap}
.fin-reco-foot .tm svg{width:13px;height:13px}
.fin-today-grid.is-reco-dismissed{grid-template-columns:1fr}
.fin-today-grid.is-reco-dismissed .fin-today-main{display:grid;grid-template-columns:minmax(0,2.05fr) minmax(280px,.95fr);gap:28px;align-items:stretch}
.fin-today-grid.is-reco-dismissed .fin-live-chart{height:310px}
.fin-today-grid.is-reco-dismissed .fin-live-chart .sf-svg{height:300px}
.fin-today-grid.is-reco-dismissed .fin-balstrip{display:flex;flex-direction:column;gap:0;padding:0}
.fin-today-grid.is-reco-dismissed .fin-balitem{flex:1;padding:8px 0 24px}
.fin-today-grid.is-reco-dismissed .fin-balitem+.fin-balitem{border-top:1px solid var(--sf-border);padding-top:24px}
.fin-today-grid.is-reco-dismissed .fin-balitem .v{font-size:22px;margin-top:8px}
.fin-today-grid.is-reco-dismissed .fin-balitem .s{font-size:12px;margin-top:2px}
.fin-overview-title{padding:20px 0 13px;border-top:1px solid var(--sf-border)}
.fin-sticky-stack{position:sticky;top:88px;z-index:35;margin:0 -22px;padding:0 22px;background:transparent;box-shadow:none;overflow-anchor:none}
.fin-sticky-stack::before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;height:142px;background:rgba(0,0,0,.58);-webkit-backdrop-filter:blur(48px) saturate(1.35);backdrop-filter:blur(48px) saturate(1.35);box-shadow:none;opacity:0;pointer-events:none;transition:opacity .18s ease,height .2s cubic-bezier(.2,.8,.25,1)}
.fin-sticky-stack.is-stuck::before{position:fixed;left:var(--fin-sticky-shell-left,0);right:auto;top:var(--fin-sticky-shell-top,0);width:var(--fin-sticky-shell-width,100vw);height:98px;background:rgba(0,0,0,.58);opacity:1}
html[data-theme="light"] .fin-sticky-stack::before,html[data-theme="light"] .fin-sticky-stack.is-stuck::before{background:rgba(255,255,255,.54)}
.fin-sticky-stack.is-stuck.is-joining::before,.fin-sticky-stack.is-stuck.is-docked::before{height:142px}
.fin-sticky-stack:has(.range-open),.fin-sticky-stack:has(.interval-open),.fin-sticky-stack:has(.compare-open),.fin-sticky-stack:has(.compare-range-open){z-index:1600}
.fin-sticky-metrics{position:absolute;left:22px;right:22px;top:10px;height:78px;display:flex;align-items:stretch;overflow:hidden;margin:0;border:1px solid var(--sf-border);border-radius:12px;background:rgba(0,0,0,.42);-webkit-backdrop-filter:blur(40px) saturate(1.35);backdrop-filter:blur(40px) saturate(1.35);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px) scale(.992);transform-origin:top center;transition:opacity .16s ease,transform .22s cubic-bezier(.2,.8,.25,1),visibility 0s linear .22s}
html[data-theme="light"] .fin-sticky-metrics{background:rgba(255,255,255,.48)}
.fin-sticky-stack.is-stuck .fin-sticky-metrics{position:fixed;left:var(--fin-sticky-left,22px);right:auto;top:var(--fin-sticky-top,10px);width:var(--fin-sticky-width,calc(100vw - 44px));opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s;box-shadow:none}
.fin-sticky-period{width:150px;min-width:150px;display:flex;align-items:center;justify-content:center;gap:8px;border:0;border-right:1px solid var(--sf-border-2);border-radius:11px 0 0 11px;background:transparent;color:var(--sf-ink);font:650 14px Inter;cursor:pointer;transition:background .16s ease,color .16s ease}
.fin-sticky-period:hover,.fin-sticky-period[aria-expanded="true"]{background:var(--sf-hover)}
.fin-sticky-period-label{max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fin-sticky-period>svg{width:18px;height:18px;color:var(--sf-sub)}
.fin-sticky-chevron{width:14px;height:14px;display:grid;place-items:center;color:var(--sf-sub);transition:transform .16s ease}
.fin-sticky-chevron svg{width:14px;height:14px}
.fin-sticky-period[aria-expanded="true"] .fin-sticky-chevron{transform:rotate(180deg)}
.fin-sticky-metrics.range-open{overflow:visible}
.fin-sticky-metrics>.fin-range-pop{top:calc(100% + 12px);left:0;right:0;min-height:480px}
body[data-view="finance"] .sf-content{overflow-x:hidden;overscroll-behavior-x:none}
.fin-sticky-metrics .sf-metrics-scroll{flex:1 1 auto;overflow-x:hidden;overscroll-behavior-x:none;touch-action:pan-y;-webkit-mask-image:none!important;mask-image:none!important}
.fin-sticky-metrics .sf-metrics-scroll>div{width:100%;min-width:0;height:100%}
.fin-sticky-metrics .sf-metric{flex:1 1 0;min-width:0;padding:10px 20px;border-right:1px solid var(--sf-border-2);overflow:hidden}
.fin-sticky-metrics .sf-metric .ml{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fin-sticky-metric-btn{border:0;background:none;padding:0;color:inherit;font:inherit;display:flex;align-items:center;gap:5px;cursor:pointer;text-align:left}
.fin-sticky-metric-btn:hover{color:var(--sf-ink)}
.fin-sticky-metric-btn:focus-visible{outline:2px solid var(--sf-ink);outline-offset:3px;border-radius:4px}
.fin-sticky-metric-btn svg{width:12px;height:12px}
.fin-sticky-metrics.metric-open{overflow:visible}
.fin-hero-menu.fin-sticky-hero-menu{position:fixed}
.fin-sticky-metrics .sf-metric .mrule{margin-top:4px}
.fin-sticky-metrics .sf-metric .mfoot{margin-top:5px}
.fin-sticky-metrics .sf-metric .mv{font-size:17px}
.fin-sticky-metrics .sf-metric .mspark{width:68px}
.fin-overview-tools{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0;padding:9px 0 10px;border-bottom:1px solid var(--sf-border);background:transparent;box-shadow:none;transform:translateY(0);transition:transform .22s cubic-bezier(.2,.8,.25,1)}
.fin-tool-left,.fin-tool-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.fin-filter-anchor,.fin-compare-anchor{position:relative}
.fin-compare-anchor{display:flex;align-items:center;gap:8px}
.fin-tool{height:34px;display:inline-flex;align-items:center;gap:7px;padding:0 11px;border:1px solid var(--sf-border);border-radius:999px;background:rgba(16,16,18,.54);-webkit-backdrop-filter:blur(28px) saturate(1.25);backdrop-filter:blur(28px) saturate(1.25);color:var(--sf-ink);font:600 12.5px Inter;white-space:nowrap;cursor:pointer;box-shadow:0 1px 1px rgba(0,0,0,.025)}
html[data-theme="light"] .fin-tool{background:rgba(255,255,255,.52)}
.fin-tool:hover{background:var(--sf-hover)}
.fin-tool svg{width:14px;height:14px}
.fin-tool .mut{color:var(--sf-dim);font-weight:500}
.fin-tool .sel{color:var(--sf-ink)}
.fin-tool-right .fin-tool{border-radius:999px}
.fin-compare-add,.fin-custom-range{border-style:dashed;border-width:1.5px;box-shadow:none}
.fin-compare-add>svg:first-child{width:18px;height:18px;flex:none;color:var(--sf-sub);stroke-width:1.8}
.fin-compare-active{height:34px;display:flex;align-items:center;border:1px solid var(--sf-border);border-radius:999px;background:rgba(16,16,18,.54);-webkit-backdrop-filter:blur(28px) saturate(1.25);backdrop-filter:blur(28px) saturate(1.25);box-shadow:0 1px 1px rgba(0,0,0,.025)}
html[data-theme="light"] .fin-compare-active{background:rgba(255,255,255,.52)}
.fin-compare-clear{width:31px;height:32px;border:0;border-radius:999px 0 0 999px;background:none;color:var(--sf-sub);display:flex;align-items:center;justify-content:center;cursor:pointer}
.fin-compare-clear:hover{background:var(--sf-hover);color:var(--sf-ink)}
.fin-compare-clear .fin-comp-x{width:17px;height:17px}
.fin-compare-main{height:32px;border:0;border-radius:0 999px 999px 0;background:none;color:var(--sf-ink);display:flex;align-items:center;gap:7px;padding:0 11px 0 1px;font:600 12.5px Inter;cursor:pointer}
.fin-compare-main:hover{background:var(--sf-hover)}
.fin-compare-main svg{width:14px;height:14px}
.fin-compare-divider{width:1px;height:18px;background:var(--sf-border)}
.fin-compare-main .sel{font-weight:600;color:var(--sf-ink)}
.fin-comp-x{width:17px;height:17px;border:1.5px solid currentColor;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--sf-sub)}
.fin-comp-x svg{width:11px;height:11px;stroke-width:2.2}
.fin-overview-tools.range-open,.fin-overview-tools.interval-open,.fin-overview-tools.compare-open,.fin-overview-tools.compare-range-open{z-index:1600}
.fin-compare-menu{position:absolute;z-index:1603;top:calc(100% + 8px);left:0;width:196px;padding:6px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);box-shadow:0 16px 36px rgba(24,34,54,.16);animation:finIntervalIn .16s cubic-bezier(.2,.75,.25,1)}
.fin-compare-option{width:100%;height:40px;border:0;border-radius:8px;background:transparent;color:var(--sf-ink);display:flex;align-items:center;padding:0 12px;font:500 13.5px Inter;text-align:left;cursor:pointer}
.fin-compare-option:hover,.fin-compare-option:focus-visible,.fin-compare-option.on{background:var(--sf-hover);outline:none}
.fin-compare-range-pop{--fr-accent:#303030;--fr-range:#eeeeef;--fr-on-accent:#fff;position:absolute;z-index:1602;top:calc(100% + 8px);left:22px;right:22px;min-height:455px;padding:24px 26px 20px;border:1px solid var(--sf-border);border-radius:17px;background:var(--sf-surface);box-shadow:0 22px 55px rgba(24,34,54,.16);animation:finRangeIn .16s cubic-bezier(.2,.7,.25,1)}
html[data-theme="dark"] .fin-compare-range-pop{--fr-accent:#f2f2f3;--fr-range:#343438;--fr-on-accent:#1b1b1d}
.fin-compare-range-pop .fin-range-main{height:100%}
.fin-interval-menu{position:absolute;z-index:1602;top:calc(100% + 8px);left:0;width:154px;padding:6px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);box-shadow:0 16px 36px rgba(24,34,54,.16);animation:finIntervalIn .16s cubic-bezier(.2,.75,.25,1)}
.fin-interval-option{width:100%;height:40px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--sf-ink);font:500 13.5px Inter;text-align:left;cursor:pointer}
.fin-interval-option:hover,.fin-interval-option.on{background:var(--sf-hover)}
.fin-interval-check{width:17px;height:17px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--sf-ink);color:var(--sf-surface);transform:scale(0);opacity:0;transition:transform .18s cubic-bezier(.2,.8,.25,1.25),opacity .14s ease}
.fin-interval-option.on .fin-interval-check{transform:scale(1);opacity:1}
.fin-interval-check svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@keyframes finIntervalIn{from{opacity:0;transform:translateY(-5px) scale(.98)}to{opacity:1;transform:none}}
.fin-range-pop{--fr-accent:#303030;--fr-range:#eeeeef;--fr-on-accent:#fff;position:absolute;z-index:1601;top:calc(100% + 8px);left:22px;right:22px;min-height:500px;padding:26px 28px 22px;display:grid;grid-template-columns:210px minmax(0,1fr);gap:28px;border:1px solid var(--sf-border);border-radius:17px;background:#fff;box-shadow:0 22px 55px rgba(24,34,54,.16);animation:finRangeIn .16s cubic-bezier(.2,.7,.25,1)}
html[data-theme="dark"] .fin-range-pop{--fr-accent:#f2f2f3;--fr-range:#343438;--fr-on-accent:#1b1b1d;background:#1b1b1d}
@keyframes finRangeIn{from{opacity:0;transform:translateY(-5px) scale(.995)}to{opacity:1;transform:none}}
.fin-range-presets{display:flex;flex-direction:column;gap:7px;padding-top:3px}
.fin-range-preset{height:38px;border:0;border-radius:7px;background:transparent;padding:0 12px;text-align:left;color:var(--sf-ink);font:500 13.5px Inter;cursor:pointer}
.fin-range-preset:hover{background:var(--sf-hover)}
.fin-range-preset.on{background:var(--fr-range);color:var(--fr-accent)}
.fin-range-main{min-width:0;display:flex;flex-direction:column}
.fin-range-fields{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.fin-range-fields label{display:flex;align-items:center;gap:9px;color:var(--sf-sub);font-size:13.5px}
.fin-range-input{width:150px;height:40px;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);padding:0 12px;color:var(--sf-ink);font:500 14px Inter,system-ui,sans-serif;letter-spacing:0;outline:none}
.fin-range-input::placeholder{color:var(--sf-sub);opacity:1}
.fin-range-input:focus,.fin-range-input.is-active{border-color:var(--fr-accent);box-shadow:0 0 0 3px rgba(48,48,48,.12)}
.fin-range-input.date-enter{animation:finDateValueIn .28s cubic-bezier(.2,.75,.25,1)}
.fin-calendars{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:54px}
.fin-cal{min-width:0}
.fin-cal-head{height:38px;display:grid;grid-template-columns:36px 1fr 36px;align-items:center;margin-bottom:7px}
.fin-cal-title{display:flex;align-items:center;justify-content:center;gap:5px;text-align:center;color:var(--sf-ink);font-size:15px;font-weight:550}
.fin-cal-title svg{width:14px;height:14px}
.fin-cal-nav{width:34px;height:34px;border:0;border-radius:8px;background:none;color:var(--sf-sub);display:flex;align-items:center;justify-content:center;cursor:pointer}
.fin-cal-nav:hover{background:var(--sf-hover);color:var(--sf-ink)}
.fin-cal-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fin-cal-week,.fin-cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.fin-cal-week span{height:30px;display:flex;align-items:center;justify-content:center;color:var(--sf-sub);font-size:12px}
.fin-cal-grid{row-gap:7px}
.fin-cal-day,.fin-cal-blank{height:36px}
.fin-cal-day{position:relative;border:0;background:none;padding:0;color:var(--sf-ink);font:500 13.5px Inter;cursor:pointer;isolation:isolate}
.fin-cal-day::before{content:"";position:absolute;z-index:-2;inset:0;background:transparent}
.fin-cal-day>span{position:relative;z-index:2;width:36px;height:36px;margin:auto;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .14s ease,transform .14s ease}
.fin-cal-day:hover>span{background:var(--sf-hover);transform:scale(1.06)}
.fin-cal-day.in-range{color:var(--fr-accent)}
.fin-cal-day.in-range::before{left:-1px;right:-1px;background:var(--fr-range)}
.fin-cal-day.week-start::before,.fin-cal-day.range-start::before{border-radius:18px 0 0 18px}
.fin-cal-day.week-end::before,.fin-cal-day.range-end::before{border-radius:0 18px 18px 0}
.fin-cal-day.week-start::before{left:0}
.fin-cal-day.week-end::before{right:0}
.fin-cal-day.range-start::before{left:calc((100% - 36px)/2)}
.fin-cal-day.range-end::before{right:calc((100% - 36px)/2)}
.fin-cal-day.range-start.range-end::before{display:none}
.fin-cal-day.range-start>span,.fin-cal-day.range-end>span{background:var(--fr-accent);color:var(--fr-on-accent);font-weight:650}
.fin-cal-day.range-start:hover>span,.fin-cal-day.range-end:hover>span{background:var(--fr-accent)}
.fin-cal-day.just-selected>span{animation:finDatePop .32s cubic-bezier(.18,.8,.28,1.25)}
.fin-cal-day.range-anim::before{transform-origin:left center;animation:finRangeSweep .2s cubic-bezier(.22,.72,.25,1) both;animation-delay:calc(var(--fin-range-step,0)*13ms)}
.fin-cal-day.is-today:not(.range-start):not(.range-end)>span{background:var(--sf-hover)}
.fin-cal-day.is-future{color:var(--sf-dim)}
@keyframes finDatePop{0%{transform:scale(.56);opacity:.2}65%{transform:scale(1.1);opacity:1}100%{transform:scale(1)}}
@keyframes finRangeSweep{0%{transform:scaleX(0);opacity:.2}60%{opacity:1}100%{transform:scaleX(1);opacity:1}}
@keyframes finDateValueIn{0%{color:transparent;transform:translateY(4px);background:var(--fr-range)}100%{color:var(--sf-ink);transform:none;background:var(--sf-surface)}}
.fin-range-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:auto;padding-top:18px}
.fin-range-action{height:38px;padding:0 14px;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);color:var(--sf-ink);font:650 13.5px Inter;cursor:pointer}
.fin-range-action:hover{background:var(--sf-hover)}
.fin-range-action.apply{border-color:var(--fr-accent);background:var(--fr-accent);color:var(--fr-on-accent)}
.fin-range-action.apply:disabled{opacity:.42;cursor:not-allowed}
@media(prefers-reduced-motion:reduce){
.fin-range-input.date-enter,.fin-cal-day.just-selected>span,.fin-cal-day.range-anim::before{animation:none}
.fin-chart-dot.current{animation:none}
.fin-cal-day>span,.fin-chart-hover,.fin-chart-dot,.fin-interval-check{transition:none}
.fin-interval-menu,.fin-compare-menu,.fin-compare-range-pop{animation:none}
}
.fin-overview-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;padding:10px;background:var(--sf-surface);border-radius:0 0 14px 14px}
.fin-ov-card{grid-column:span 2;min-width:0;min-height:350px;padding:16px;border:1px solid var(--sf-border);border-radius:11px;background:var(--sf-surface);display:flex;flex-direction:column}
.fin-ov-card.wide{grid-column:span 3;min-height:300px}
.fin-edit-remove{display:none}
.fin-tool.is-done{border-color:#303030;background:#303030;color:#fff;box-shadow:0 0 0 3px rgba(48,48,48,.12)}
html[data-theme="dark"] .fin-tool.is-done{border-color:#f2f2f3;background:#f2f2f3;color:#202023}
.fin-overview-grid.is-editing{position:relative;background:var(--sf-bg);outline:1px dashed var(--sf-border);outline-offset:-10px}
.fin-overview-grid.is-editing .fin-ov-card{position:relative;box-shadow:0 1px 2px rgba(28,32,40,.03);cursor:grab;user-select:none;animation:finEditCardIn .22s cubic-bezier(.2,.75,.25,1)}
.fin-overview-grid.is-editing .fin-ov-card:active{cursor:grabbing}
.fin-overview-grid.is-editing .fin-ov-head{padding-right:28px}
.fin-overview-grid.is-editing .fin-ov-exp{visibility:hidden}
.fin-overview-grid.is-editing .fin-edit-remove{position:absolute;z-index:12;top:9px;display:flex;align-items:center;justify-content:center;border:0;background:none;color:var(--sf-sub)}
.fin-overview-grid.is-editing .fin-edit-remove{right:9px;width:30px;height:30px;border-radius:8px;cursor:pointer}
.fin-overview-grid.is-editing .fin-edit-remove:hover{background:var(--sf-hover);color:var(--sf-ink)}
.fin-overview-grid.is-editing .fin-edit-remove svg{width:17px;height:17px}
.fin-overview-grid.is-editing .fin-ov-chart,.fin-overview-grid.is-editing .fin-paylist,.fin-overview-grid.is-editing .fin-custlist{cursor:grab}
.fin-overview-grid.is-editing .fin-chart-hover{display:none}
.fin-overview-grid.is-editing .fin-ov-card.is-dragging{border:2px dashed #9aa4b1;background:transparent;box-shadow:none;cursor:grabbing}
.fin-overview-grid.is-editing .fin-ov-card.is-dragging>*{visibility:hidden!important}
.fin-overview-grid.is-editing .fin-ov-card.is-drop-settling{animation:finDropSettle .28s cubic-bezier(.18,.8,.25,1.2)}
.fin-overview-grid.is-editing .fin-ov-card.is-removing{pointer-events:none;animation:finCardRemove .18s ease-in forwards}
.fin-widget-drag-ghost{position:fixed;z-index:9999;left:-10000px;top:0;max-height:560px;overflow:hidden;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-surface);box-shadow:0 24px 58px rgba(20,24,32,.26);pointer-events:none;transform:rotate(.35deg) scale(.985)}
.fin-widget-drag-ghost .fin-edit-remove{display:none!important}
.fin-edit-empty{grid-column:1/-1;min-height:230px;border:2px dashed var(--sf-border);border-radius:12px;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:var(--sf-sub);font-size:13px}
@keyframes finEditCardIn{from{transform:scale(.99);box-shadow:none}to{transform:none}}
@keyframes finDropSettle{0%{transform:scale(.985)}65%{transform:scale(1.006)}100%{transform:none}}
@keyframes finCardRemove{to{opacity:0;transform:scale(.97)}}
.fin-ov-head,.fin-ov-foot{display:flex;align-items:center;justify-content:space-between;gap:10px}
.fin-ov-head b{display:flex;align-items:center;gap:5px;font-size:13.5px;color:var(--sf-ink)}
.fin-ov-head b svg{width:14px;height:14px;color:var(--sf-sub)}
.fin-ov-exp{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid var(--sf-border);border-radius:8px;background:none;color:var(--sf-sub);cursor:pointer}
.fin-ov-exp:hover{background:var(--sf-hover);color:var(--sf-ink)}
.fin-ov-exp svg{width:14px;height:14px}
.fin-ov-val{font-size:22px;font-weight:700;letter-spacing:-.02em;margin-top:7px;color:var(--sf-ink)}
.fin-ov-prev{font-size:12.5px;color:var(--sf-sub);margin-top:3px}
.fin-ov-chart{position:relative;isolation:isolate;flex:1;min-height:185px;display:flex;align-items:flex-end;cursor:crosshair}
.fin-ov-chart .sf-svg{width:100%;height:190px}
.fin-chart-hit{pointer-events:none}
.fin-chart-hover{position:absolute;inset:0;z-index:30;display:block;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .1s ease,visibility 0s linear .1s}
.fin-chart-hover.on{opacity:1;visibility:visible;transition-delay:0s}
.fin-ov-card:has(.fin-chart-hover.on),.fin-today-main:has(.fin-chart-hover.on){position:relative;z-index:8}
.fin-chart-cross{position:absolute;top:12px;bottom:28px;width:0;border-left:1px dashed #8796aa;transform:translateX(-.5px)}
.fin-chart-dot{position:absolute;width:10px;height:10px;border:2px solid var(--sf-surface);border-radius:50%;box-shadow:0 0 0 1px rgba(35,35,35,.08);transform:translate(-50%,-50%);transition:top .1s ease,left .1s ease}
.fin-chart-dot.current{z-index:2;border:0;background:#fff;will-change:transform,box-shadow;animation:finCurrentDotPulse 1.4s ease-in-out infinite}
.fin-chart-dot.previous{z-index:1;background:#9aa8bb}
@keyframes finCurrentDotPulse{
0%,100%{transform:translate(-50%,-50%) scale(1);box-shadow:0 0 0 1px rgba(255,255,255,.36),0 0 0 0 rgba(255,255,255,.48)}
50%{transform:translate(-50%,-50%) scale(1.12);box-shadow:0 0 0 1px rgba(255,255,255,.44),0 0 0 6px rgba(255,255,255,0)}
}
.fin-chart-tip{position:absolute;z-index:31;width:max-content;min-width:min(202px,calc(100% - 16px));max-width:min(238px,calc(100% - 16px));box-sizing:border-box;padding:11px 13px;overflow:hidden;
border:.75px solid rgba(255,255,255,.14);border-radius:16px;background:rgba(0,0,0,.62);
-webkit-backdrop-filter:blur(18px) saturate(1.8);backdrop-filter:blur(18px) saturate(1.8);
box-shadow:inset 0 0 5px rgba(255,255,255,.28),inset 0 1px 1px rgba(255,255,255,.20),
0 0 0 1px rgba(255,255,255,.06),0 22px 52px -14px rgba(0,0,0,.72);
color:#fff;font-size:12px;line-height:1.2;isolation:isolate;will-change:top,left,backdrop-filter}
html[data-theme="light"] .fin-chart-tip{border-color:rgba(255,255,255,.72);background:rgba(255,255,255,.38);
box-shadow:inset 0 1px 1px rgba(255,255,255,.96),inset 0 0 7px rgba(255,255,255,.62),
0 0 0 1px rgba(0,0,0,.08),0 18px 42px -14px rgba(0,0,0,.32);color:#242426}
.fin-chart-tip-title{display:block;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.16);font-size:14.5px;font-weight:650}
html[data-theme="light"] .fin-chart-tip-title{border-bottom-color:rgba(35,35,35,.12)}
.fin-chart-tip-row{display:grid;grid-template-columns:11px minmax(0,1fr) auto;align-items:center;gap:9px;margin-top:7px;white-space:nowrap}
.fin-chart-tip-swatch{width:11px;height:11px;border-radius:3px;background:#303030}
.fin-chart-tip-row.previous .fin-chart-tip-swatch{background:#9aa8bb}
.fin-chart-tip.no-compare .fin-chart-tip-row.previous{display:none}
.fin-chart-tip-label{overflow:hidden;color:rgba(255,255,255,.68);text-overflow:ellipsis}
.fin-chart-tip-value{font-weight:500;color:#fff;font-variant-numeric:tabular-nums}
html[data-theme="light"] .fin-chart-tip-label{color:rgba(36,36,38,.64)}
html[data-theme="light"] .fin-chart-tip-value{color:#242426}
.fin-ov-foot{padding-top:10px;border-top:1px solid var(--sf-border-2);font-size:11.5px;color:var(--sf-dim)}
.fin-paybar{height:14px;border-radius:4px;background:var(--fin-purple);margin:17px 0 10px}
.fin-paylist,.fin-custlist{border-top:1px solid var(--sf-border-2)}
.fin-payrow,.fin-custrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--sf-border-2);font-size:13px}
.fin-paylab{display:flex;align-items:center;gap:9px;color:var(--sf-sub)}
.fin-swatch{width:10px;height:10px;border-radius:3px;background:var(--fin-purple);flex:none}
.fin-swatch.s2{background:#2469d8}.fin-swatch.s3{background:#0ea5c6}.fin-swatch.s4{background:#e66a14}.fin-swatch.s5{background:#c80b46}
.fin-nodata{flex:1;min-height:220px;margin:16px 0 0;border:1px dashed var(--sf-border);border-radius:11px;display:flex;align-items:center;justify-content:center;color:var(--sf-dim);font-size:13px}
.fin-custrow>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.fin-custrow b{font-size:13px;color:var(--sf-ink)}
.fin-custrow span{font-size:11.5px;color:var(--sf-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fin-widget-empty{grid-column:1/-1;min-height:280px;border:1px dashed var(--sf-border);border-radius:12px;background:var(--sf-surface);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;color:var(--sf-sub)}
.fin-widget-empty b{font-size:16px;color:var(--sf-ink)}
.fin-widget-empty p{max-width:410px;margin:0 0 5px;font-size:13px;line-height:1.5}
.fin-widget-modal-bg{position:fixed;z-index:2800;inset:0;padding:40px;background:rgba(31,41,55,.32);backdrop-filter:blur(3px);display:grid;place-items:center;animation:finWidgetFade .18s ease-out}
.fin-widget-modal{width:min(980px,calc(100vw - 80px));height:min(680px,calc(100vh - 80px));min-height:440px;border:1px solid rgba(35,35,35,.12);border-radius:16px;background:var(--sf-surface);box-shadow:0 24px 70px rgba(20,24,32,.22);display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden;animation:finWidgetLift .24s cubic-bezier(.2,.8,.25,1)}
.fin-widget-modal-head{min-height:58px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--sf-border-2);background:var(--sf-surface)}
.fin-widget-modal-head h2{margin:0;font-size:17px;letter-spacing:-.015em;color:var(--sf-ink)}
.fin-widget-modal-head p{margin:4px 0 0;color:var(--sf-sub);font-size:12px}
.fin-widget-close{width:34px;height:34px;border:0;border-radius:9px;background:none;color:var(--sf-sub);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,color .15s ease,transform .15s ease}
.fin-widget-close:hover{background:var(--sf-hover);color:var(--sf-ink);transform:rotate(4deg)}
.fin-widget-close svg{width:18px;height:18px}
.fin-widget-scroll{min-height:0;overflow:auto;padding:16px 18px;background:var(--sf-bg);scrollbar-gutter:stable}
.fin-widget-section+.fin-widget-section{margin-top:22px}
.fin-widget-section h3{margin:0 0 8px;font-size:14px;font-weight:650;color:var(--sf-ink)}
.fin-widget-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.fin-widget-card{position:relative;min-width:0;min-height:210px;padding:14px;border:1px solid transparent;border-radius:12px;background:var(--sf-surface);box-shadow:0 1px 0 rgba(30,35,42,.02);cursor:pointer;overflow:hidden;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.fin-widget-card:hover{border-color:var(--sf-border);box-shadow:0 8px 24px rgba(28,32,40,.07);transform:translateY(-1px)}
.fin-widget-card.is-selected{border-color:#303030;box-shadow:0 0 0 1px #303030}
html[data-theme="dark"] .fin-widget-card.is-selected{border-color:#f2f2f3;box-shadow:0 0 0 1px #f2f2f3}
.fin-widget-card h4{max-width:calc(100% - 40px);margin:0;display:flex;align-items:center;gap:5px;color:var(--sf-ink);font-size:13px;font-weight:650}
.fin-widget-card h4 svg{width:13px;height:13px;color:var(--sf-sub)}
.fin-widget-card .fin-widget-value{margin-top:5px;color:var(--sf-ink);font-size:20px;font-weight:700;letter-spacing:-.025em}
.fin-widget-toggle{position:absolute;z-index:3;top:10px;right:10px;width:27px;height:27px;padding:0;border:1.5px solid #aeb9c6;border-radius:50%;background:var(--sf-surface);color:#7d8a99;display:grid;place-items:center;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s cubic-bezier(.2,.8,.25,1.25)}
.fin-widget-toggle:hover{border-color:#303030;color:#303030;transform:scale(1.06)}
.fin-widget-toggle.is-on{border-color:#303030;background:#303030;color:#fff;transform:scale(1)}
html[data-theme="dark"] .fin-widget-toggle.is-on{border-color:#f2f2f3;background:#f2f2f3;color:#202023}
.fin-widget-toggle svg{position:absolute;width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:opacity .15s ease,transform .18s cubic-bezier(.2,.8,.25,1.25)}
.fin-widget-toggle .check{opacity:0;transform:scale(.45) rotate(-12deg)}
.fin-widget-toggle.is-on .plus{opacity:0;transform:scale(.45) rotate(20deg)}
.fin-widget-toggle.is-on .check{opacity:1;transform:scale(1) rotate(0)}
.fin-widget-preview{height:142px;margin-top:9px;display:flex;flex-direction:column;justify-content:flex-end;color:var(--sf-sub);font-size:10.5px}
.fin-widget-preview svg{width:100%;height:96px;overflow:visible}
.fin-widget-preview .grid{stroke:var(--sf-border-2);stroke-width:1}
.fin-widget-preview .line{fill:none;stroke:#303030;stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}
.fin-widget-preview .baseline{fill:none;stroke:#a9b3c0;stroke-width:1.5;stroke-dasharray:4 4}
html[data-theme="dark"] .fin-widget-preview .line{stroke:#f2f2f3}
.fin-widget-preview-foot{display:flex;align-items:center;justify-content:space-between;padding-top:9px;border-top:1px solid var(--sf-border-2);color:var(--sf-dim);font-size:10.5px}
.fin-widget-preview-list{margin-top:10px;border-top:1px solid var(--sf-border-2)}
.fin-widget-preview-row{height:31px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--sf-border-2);font-size:11px}
.fin-widget-preview-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-sub)}
.fin-widget-preview-row b{font-size:11.5px;color:var(--sf-ink)}
.fin-widget-preview-row i{display:inline-block;width:9px;height:9px;margin-right:7px;border-radius:3px;background:#303030;vertical-align:-1px}
.fin-widget-preview-row:nth-child(2) i{background:#8f9cad}.fin-widget-preview-row:nth-child(3) i{background:#cbd1d8}
.fin-widget-preview-bar{height:11px;margin:11px 0 2px;border-radius:4px;background:linear-gradient(90deg,#303030 0 62%,#8f9cad 62% 86%,#d8dce1 86%)}
.fin-widget-preview-empty{height:118px;margin-top:10px;border:1px dashed var(--sf-border);border-radius:9px;display:flex;align-items:center;justify-content:center}
.fin-widget-preview-empty span{padding:10px 12px;border-radius:8px;background:var(--sf-bg);color:var(--sf-sub);font-size:11px}
.fin-widget-modal-foot{min-height:60px;padding:0 18px;border-top:1px solid var(--sf-border-2);background:var(--sf-surface);display:flex;align-items:center;justify-content:space-between;gap:20px}
.fin-widget-count{font-size:12px;color:var(--sf-sub)}
.fin-widget-actions{display:flex;gap:8px}
.fin-widget-action{height:39px;padding:0 16px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);font:650 13px Inter;cursor:pointer}
.fin-widget-action:hover{background:var(--sf-hover)}
.fin-widget-action.apply{border-color:#303030;background:#303030;color:#fff}
html[data-theme="dark"] .fin-widget-action.apply{border-color:#f2f2f3;background:#f2f2f3;color:#202023}
@keyframes finWidgetFade{from{opacity:0}to{opacity:1}}
@keyframes finWidgetLift{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:1040px){
.fin-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.fin-ov-card,.fin-ov-card.wide{grid-column:span 1}
.fin-widget-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:800px){
.fin-today-grid{grid-template-columns:1fr}
.fin-today-grid.is-reco-dismissed .fin-today-main{display:block}
.fin-today-grid.is-reco-dismissed .fin-live-chart{height:190px}
.fin-today-grid.is-reco-dismissed .fin-live-chart .sf-svg{height:180px}
.fin-today-grid.is-reco-dismissed .fin-balstrip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding-top:15px}
.fin-today-grid.is-reco-dismissed .fin-balitem,.fin-today-grid.is-reco-dismissed .fin-balitem+.fin-balitem{padding:0;border-top:0}
.fin-reco{min-height:220px}
.fin-sticky-stack,.fin-sticky-stack.is-stuck{position:static;margin:0 -22px;padding:0 22px;box-shadow:none}
.fin-sticky-stack::before{display:none}
.fin-sticky-metrics{display:none}
.fin-overview-tools,.fin-sticky-stack.is-stuck .fin-overview-tools{position:relative;transform:none}
.fin-range-pop{position:fixed;top:76px;left:14px;right:14px;max-height:calc(100vh - 92px);overflow:auto;grid-template-columns:1fr;padding:18px;gap:16px}
.fin-compare-range-pop{position:fixed;top:76px;left:14px;right:14px;width:auto;max-height:calc(100vh - 92px);min-height:0;overflow:auto;padding:18px}
.fin-range-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
.fin-range-fields{flex-wrap:wrap;margin-bottom:10px}
.fin-calendars{grid-template-columns:1fr;gap:0}
.fin-cal:nth-child(2){display:none}
.fin-widget-modal-bg{padding:12px}
.fin-widget-modal{width:calc(100vw - 24px);height:calc(100vh - 24px)}
}
@media(max-width:620px){
.fin-notice{grid-template-columns:auto minmax(0,1fr)}
.fin-notice-x{grid-column:2;justify-self:start}
.fin-today-stats{gap:20px}
.fin-hero-date-pop{left:auto;right:-8px;width:min(342px,calc(100vw - 36px))}
.fin-balstrip,.fin-overview-grid{grid-template-columns:1fr}
.fin-ov-card,.fin-ov-card.wide{min-height:auto}
.fin-tool-left,.fin-tool-right{width:100%}
.fin-sticky-period{width:120px;min-width:120px}
.fin-widget-cards{grid-template-columns:1fr}
.fin-widget-scroll{padding:14px}
.fin-widget-modal-head,.fin-widget-modal-foot{padding-left:14px;padding-right:14px}
}
@media(prefers-reduced-motion:reduce){
.fin-widget-modal-bg,.fin-widget-modal{animation:none}
.fin-widget-card,.fin-widget-toggle,.fin-widget-toggle svg{transition:none}
.fin-overview-grid.is-editing .fin-ov-card,.fin-overview-grid.is-editing .fin-ov-card.is-drop-settling,.fin-overview-grid.is-editing .fin-ov-card.is-removing{animation:none}
.fin-sticky-stack::before,.fin-sticky-metrics,.fin-overview-tools{transition:none}
}
/* ---- Affiliates ---- */
.aff-h3{font-size:14px;font-weight:650;margin:22px 0 10px}
/* customer cell (avatar + name), Sale type pill, activity timeline */
.aff-cust{display:flex;align-items:center;gap:9px}
.aff-cust .sf-ava{width:26px;height:26px;font-size:10.5px}
.aff-type{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--sf-sub);font-weight:550}
.aff-type i{width:7px;height:7px;border-radius:2px;background:#14b8a6;flex:none}
.aff-link{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--sf-sub)}
.afc-tl{display:flex;flex-direction:column;gap:0;margin:2px 0 4px}
.afc-ev{display:flex;gap:12px;padding:0 0 16px;position:relative}
.afc-ev:not(:last-child)::before{content:'';position:absolute;left:13px;top:24px;bottom:0;width:1.5px;background:var(--sf-border)}
.afc-ic{width:27px;height:27px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:var(--sf-bg);border:1px solid var(--sf-border);color:var(--sf-sub);z-index:1}
.afc-ic svg{width:14px;height:14px}
.afc-evb{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:5px}
.afc-evt{font-size:13px;color:var(--sf-ink)}
.afc-evt code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;background:var(--sf-bg);border:1px solid var(--sf-border-2);border-radius:5px;padding:1px 5px}
.afc-evm{font-size:12px;color:var(--sf-dim);white-space:nowrap;flex:none}
.afc-prof{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:6px 0 12px}
.afc-prof .sf-ava{width:62px;height:62px;font-size:22px;margin-bottom:6px}
.afc-prof .nm{font-size:16px;font-weight:650}
.afc-meta{display:flex;flex-direction:column;gap:9px;font-size:13px;color:var(--sf-sub)}
.afc-meta .row{display:flex;align-items:center;gap:9px}
.afc-meta .row svg{width:15px;height:15px;color:var(--sf-dim);flex:none}
.aff-ct{display:inline-block;min-width:18px;height:18px;line-height:18px;text-align:center;font-size:11.5px;font-weight:700;color:#fff;background:#b45309;border-radius:10px;padding:0 5px;margin-left:6px;vertical-align:middle}
.aff-code{font:600 12px ui-monospace,Menlo,monospace;background:var(--sf-bg);border:1px solid var(--sf-border);border-radius:8px;padding:2px 7px;color:var(--sf-ink)}
.aff-apps{display:flex;flex-direction:column;gap:0;padding:0}
.aff-app{display:flex;align-items:center;gap:14px;padding:13px 16px;border-top:1px solid var(--sf-border-2)}
.aff-app:first-child{border-top:none}
.aff-app-i{flex:1;min-width:0}
.aff-app-h{font-size:14px}
.aff-app-m{font-size:12.5px;color:var(--sf-sub);margin-top:2px}
.aff-app-n{font-size:12.5px;color:var(--sf-dim);font-style:italic;margin-top:4px}
.aff-app-a{flex:none;display:flex;gap:8px}
.sf-btn-sm{padding:4px 11px;font-size:12.5px;height:auto;min-height:0}
.sf-2col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:860px){.sf-2col{grid-template-columns:1fr}}
.sf-report-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(max-width:720px){.sf-report-grid{grid-template-columns:1fr}}
.sf-report-card{text-align:left;border:1px solid var(--sf-border);border-radius:var(--sf-radius);background:var(--sf-surface);padding:16px 18px;cursor:pointer;box-shadow:0 1px 0 rgba(0,0,0,.04);transition:border-color .12s,box-shadow .12s}
.sf-report-card:hover{border-color:var(--acc);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.sf-report-card .rc-t{font-size:14px;font-weight:600;color:var(--sf-text)}
.sf-report-card .rc-s{font-size:12.5px;color:var(--sf-text-2);margin-top:3px}
.sf-hbars{display:flex;flex-direction:column;gap:14px;margin-top:4px}
.hb{display:flex;align-items:center;gap:12px;font-size:13px}
.hb-l{width:140px;flex:none;color:var(--sf-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb-track{flex:1;height:9px;background:var(--sf-hover);border-radius:999px;overflow:hidden}
.hb-fill{height:100%;border-radius:999px;background:var(--acc)}
.hb-v{width:82px;text-align:right;flex:none;font-weight:600;font-variant-numeric:tabular-nums}
/* Vertical bar chart — same AttractCharts engine as the Analytics view, themed for the amber surface */
.vbars{margin-top:10px;position:relative}
.vb-metric{font-size:12.5px;color:var(--sf-dim);font-weight:500}
.vb-total{font-size:22px;font-weight:700;letter-spacing:-.02em;margin:2px 0 18px;color:var(--sf-ink)}
.vb-plot{position:relative;height:200px;margin-left:42px}
.vb-grid{position:absolute;inset:0}
.vb-gline{position:absolute;left:0;right:0;height:0;border-top:1px dashed var(--sf-border)}
.vb-glabel{position:absolute;left:-42px;width:34px;text-align:right;transform:translateY(50%);font-size:11px;color:var(--sf-dim);font-variant-numeric:tabular-nums}
.vb-cols{position:absolute;inset:0;display:flex;align-items:flex-end;gap:10px;padding:0 2px}
.vb-col{flex:1;height:100%;display:flex;align-items:flex-end;justify-content:center;border-radius:6px 6px 0 0;transition:background .12s}
.vb-col:hover{background:rgba(0,0,0,.04)}
.vb-bar{width:62%;max-width:54px;height:0;border-radius:4px 4px 0 0;background:var(--acc);transition:height .9s cubic-bezier(.2,.7,.2,1)}
.vb-xaxis{position:relative;height:16px;margin:9px 0 0 42px}
.vb-xlabel{position:absolute;font-size:11px;color:var(--sf-dim);white-space:nowrap;max-width:120px;overflow:hidden;text-overflow:ellipsis}
.vb-xlabel.first{left:2px}.vb-xlabel.last{right:2px}
.vb-xaxis-all{display:flex;gap:10px;padding:0 2px}
.vb-xaxis-all .vb-xlabel.each{position:static;flex:1;text-align:center;max-width:none}
.vb-tip{position:absolute;display:none;pointer-events:none;z-index:6;border-radius:10px;padding:8px 11px;background:var(--sf-surface);border:1px solid var(--sf-border);box-shadow:0 16px 44px -12px rgba(0,0,0,.28)}
.vb-tip .d{font-weight:600;font-size:12.5px;margin-bottom:3px;color:var(--sf-ink)}
.vb-tip .row{color:var(--sf-dim);font-size:12px}
html[data-theme="dark"] .vb-col:hover{background:rgba(255,255,255,.06)}
@media(max-width:720px){
.sf-top{gap:10px;padding:0 12px}
.sf-brand,body.sf-collapsed .sf-brand{width:auto;min-width:0}
.sf-brand .sf-logo,body.sf-collapsed .sf-brand .sf-logo,
.sf-brand .badge,body.sf-collapsed .sf-brand .badge{display:block}
.sf-topmid,.sf-store{display:none}
.sf-side,body.sf-collapsed .sf-side{display:flex;width:min(86vw,300px);padding:8px 12px 12px;
transform:translateX(-105%);visibility:hidden;box-shadow:18px 0 46px rgba(0,0,0,.3);
transition:transform .28s cubic-bezier(.22,1,.36,1),visibility 0s linear .28s}
body.sf-mobile-nav-open .sf-side{transform:translateX(0);visibility:visible;
transition:transform .28s cubic-bezier(.22,1,.36,1),visibility 0s}
body.sf-mobile-nav-open .sf-side-backdrop{display:block;opacity:1}
body.sf-collapsed .sf-nav-item{justify-content:flex-start;padding:0 9px;gap:10px}
body.sf-collapsed .sf-nav-item .lbl{max-width:170px;opacity:1;pointer-events:auto}
body.sf-collapsed .sf-group,body.sf-collapsed .sf-link,body.sf-collapsed .sf-gtog{display:flex}
body.sf-collapsed .sf-sub,body.sf-collapsed .sf-chgroup{display:none}
body.sf-collapsed .sf-sub.open,body.sf-collapsed .sf-chgroup.open{display:flex}
.sf-content,body.sf-collapsed .sf-content{left:0}
.sf-metrics{grid-template-columns:repeat(2,1fr)}
}
/* ===== Tasks workspace (client journey + board + calendar) ===== */
.tk-bar{display:flex;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.tk-cli{display:flex;align-items:center;gap:10px;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:10px;padding:7px 12px 7px 9px;cursor:pointer;min-width:200px}
.tk-cli:hover{background:var(--sf-hover)}
.tk-cli .sf-ava{width:32px;height:32px}
.tk-cli .nm{font-weight:600;font-size:13.5px;line-height:1.2}
.tk-cli .sub{font-size:12px;color:var(--sf-dim)}
.tk-cli .cv{margin-left:auto;color:var(--sf-dim);font-size:13px}
.tk-seg{display:inline-flex;background:rgba(127,127,127,.14);border:1px solid var(--sf-border);border-radius:10px;padding:3px;gap:3px}
.tk-seg button{border:none;background:none;font:600 13px Inter;color:var(--sf-sub);padding:6px 14px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:6px}
.tk-seg button svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.9}
.tk-seg button:hover{color:var(--sf-ink)}
.tk-seg button.on{background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 1px 2px rgba(0,0,0,.1)}
.tk-grow{flex:1}
/* overview: single source of vertical rhythm so section gaps are even */
.tk-overview{display:flex;flex-direction:column;gap:18px}
.tk-overview>*{margin:0}
/* Brand Library (Content) scaffolds */
.bl-note{font-size:12px;color:var(--sf-dim);margin-top:14px;padding-left:2px}
.bl-ds{display:flex;flex-direction:column}
.bl-dsrow{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--sf-border-2)}
.bl-dsrow:last-child{border-bottom:none}
.bl-ph{width:60px;height:44px;border-radius:8px;flex:none;border:1.5px dashed var(--sf-border);background:repeating-linear-gradient(45deg,transparent,transparent 6px,rgba(0,0,0,.025) 6px,rgba(0,0,0,.025) 12px)}
.bl-dsmeta{flex:1}
.bl-dsmeta .nm{font-size:13.5px;font-weight:650}
.bl-dsmeta .sub{font-size:12.5px;color:var(--sf-dim);margin-top:2px}
.bl-empty{font-size:11.5px;font-weight:600;color:var(--sf-dim);background:var(--sf-bg);border:1px solid var(--sf-border);border-radius:99px;padding:3px 10px}
.bl-chips{display:flex;gap:8px;margin-bottom:14px}
.bl-chip{border:1px solid var(--sf-border);background:var(--sf-surface);border-radius:99px;padding:5px 13px;font:600 12.5px Inter;color:var(--sf-sub);cursor:pointer}
.bl-chip.on{background:var(--sf-ink);color:var(--sf-surface);border-color:var(--sf-ink)}
.bl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.bl-tile{aspect-ratio:1/1;border-radius:10px;border:1.5px dashed var(--sf-border);background:var(--sf-bg)}
.bl-tile.vid{aspect-ratio:16/9}
/* Create Image uses the actual Attract chat composer and its exact empty-state
placement. The title block ends where the home hero ends; the persistent
composer begins at the same point and retains Add / Deep / Voice / Send. */
body.shopify[data-view="images"] .sf-page{max-width:none;padding:0}
body.shopify[data-view="images"] .sf-content{overflow-y:auto}
body.shopify[data-view="images"] .main>.thread{display:none!important}
body.shopify[data-view="images"] .composer{display:flex!important;pointer-events:none;transform:none!important}
body.shopify[data-view="images"] .img-content-composer-slot>.composer{position:relative!important;inset:auto!important;width:100%;padding:0;z-index:1}
body.shopify[data-view="images"] .composer::before{display:none!important;content:none!important}
body.shopify[data-view="images"] .composer .pill{pointer-events:auto}
.img-create{position:relative;width:100%;min-height:calc(100vh - 56px);margin:0 auto}
.img-create.has-results{width:min(940px,100%);min-height:0;padding:34px 22px 120px;box-sizing:border-box}
.img-create.has-conversation{width:min(760px,100%);min-height:0;padding:34px 22px 142px;box-sizing:border-box}
.img-content-intro{width:min(760px,100%);box-sizing:border-box;margin:0 auto;padding:clamp(180px,26vh,260px) 22px 0;display:flex;flex-direction:column;align-items:stretch;gap:28px}
.img-content-composer-slot{width:100%;min-height:58px}
body.shopify[data-view="images"] .img-content-composer-slot .amenu{top:calc(100% + 10px);bottom:auto;transform-origin:top left}
body.shopify[data-view="images"] .img-content-composer-slot .amenu[data-state="open"]{animation:menuEnter .15s ease}
body.shopify[data-view="images"] .img-content-composer-slot .amenu[data-state="closing"]{animation:menuExit .15s ease forwards}
body.shopify[data-view="images"].images-composer-docked .img-content-composer-slot>.composer{position:fixed!important;left:260px!important;right:0!important;top:auto!important;bottom:14px!important;width:auto!important;padding:0 22px!important;z-index:90!important}
body.shopify[data-view="images"].images-composer-docked .img-content-composer-slot>.composer .pill{max-width:640px;animation:imgComposerDockIn .42s cubic-bezier(.22,1,.36,1) both}
body.shopify.sf-collapsed[data-view="images"].images-composer-docked .img-content-composer-slot>.composer{left:64px!important}
@keyframes imgComposerDockIn{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:translateY(0)}}
.img-create-copy{position:static;text-align:center;max-width:760px;margin:0 auto;width:100%}
.img-create.has-results .img-create-copy,.img-create.has-conversation .img-create-copy{position:static;margin:0 auto 25px}
.img-create.has-conversation .img-create-copy{margin-bottom:38px}
.img-content-hero{gap:12px;padding:0;animation:rise .9s cubic-bezier(.2,.8,.2,1) both}
.img-content-title{display:flex;align-items:center;justify-content:center;width:100%;color:var(--sf-ink)}
.img-content-wordmark{color:currentColor;font:650 clamp(22px,3vw,28px)/1.1 Inter;letter-spacing:-.025em}
.img-create.has-results .img-content-wordmark,.img-create.has-conversation .img-content-wordmark{font-size:24px}
.img-library-demo{--img-library-gutter:28px;width:min(1460px,100%);box-sizing:border-box;margin:0 auto;padding:clamp(304px,34vh,394px) var(--img-library-gutter) 84px}
.img-library-empty{width:min(1460px,100%);box-sizing:border-box;margin:0 auto;padding:clamp(230px,28vh,320px) 28px 84px}
.img-results-library{--img-library-gutter:22px;width:100%;box-sizing:border-box;margin:clamp(284px,32vh,374px) auto 0}
.img-library-sticky{position:sticky;top:0;z-index:32;width:calc(100% + var(--img-library-gutter,0px) * 2);box-sizing:border-box;margin:0 calc(var(--img-library-gutter,0px) * -1) 24px;padding:14px 18px;background:rgba(255,255,255,.72);border-bottom:1px solid rgba(0,0,0,.1);color:var(--sf-ink);box-shadow:0 12px 34px rgba(0,0,0,.06);backdrop-filter:blur(24px) saturate(1.25);-webkit-backdrop-filter:blur(24px) saturate(1.25)}
html[data-theme="dark"] .img-library-sticky{background:rgba(0,0,0,.7);border-bottom-color:rgba(255,255,255,.1);box-shadow:0 14px 36px rgba(0,0,0,.32)}
.img-library-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;min-height:44px}
.img-library-heading-group{display:flex;align-items:baseline;gap:10px;min-width:0;flex:none}
.img-library-heading{margin:0;color:var(--sf-ink);font:680 22px/1.15 Inter;letter-spacing:-.025em;white-space:nowrap}
.img-library-tools{min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:1}
.img-library-search{width:auto;min-width:220px;max-width:none;height:40px;flex:1 1 640px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink)}
.img-library-search svg{color:var(--sf-dim);stroke:currentColor}
.img-library-search .sf-search-inp{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--sf-ink);font:500 13.5px/1 Inter;padding:0}
.img-library-search .sf-search-inp::placeholder{color:var(--sf-dim)}
.img-library-view-wrap,.img-library-filter-wrap{position:relative;flex:none}
.img-library-view-trigger{height:40px;min-width:76px;padding:0 17px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);color:var(--sf-ink);font:620 13px/1 Inter;cursor:pointer;box-shadow:none}
.img-library-filter-trigger{min-width:94px;display:inline-flex;align-items:center;justify-content:center;gap:7px}
.img-library-filter-trigger svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.img-library-view-trigger:hover,.img-library-view-trigger[aria-expanded="true"]{background:var(--sf-hover);border-color:var(--sf-border)}
.img-library-view-switch{height:40px;padding:3px;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-surface);display:inline-flex;align-items:center;gap:2px;flex:none}
html[data-theme="dark"] .img-library-search,html[data-theme="dark"] .img-library-view-trigger,html[data-theme="dark"] .img-library-view-switch{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.15);backdrop-filter:blur(16px) saturate(1.08);-webkit-backdrop-filter:blur(16px) saturate(1.08)}
html[data-theme="dark"] .img-library-view-trigger:hover,html[data-theme="dark"] .img-library-view-trigger[aria-expanded="true"]{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.18)}
.img-library-view-button{width:34px;height:32px;padding:0;border:0;border-radius:9px;background:transparent;color:var(--sf-dim);display:grid;place-items:center;cursor:pointer;box-shadow:none;transition:background .16s ease,color .16s ease}
.img-library-view-button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.img-library-view-button:hover{background:var(--sf-hover);color:var(--sf-ink)}
.img-library-view-button.on{background:var(--sf-ink);color:var(--sf-bg)}
html[data-theme="dark"] .img-library-view-button.on{background:rgba(128,128,136,.58);color:#fff}
.img-library-view-button:focus-visible{outline:2px solid #3584ff;outline-offset:2px}
.img-library-add{height:40px;padding:0 17px;border:1px solid var(--sf-ink);border-radius:12px;background:var(--sf-ink);color:var(--sf-bg);font:650 13px/1 Inter;white-space:nowrap;cursor:pointer;box-shadow:none;flex:none}
.img-library-add:hover{opacity:.84}.img-library-add:focus-visible{outline:2px solid #3584ff;outline-offset:2px}
.img-library-view-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:40;width:196px;padding:7px;border:1px solid var(--sf-border);border-radius:15px;background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 16px 42px rgba(0,0,0,.12)}
.img-library-view-option{width:100%;height:42px;padding:0 13px;border:0;border-radius:10px;background:transparent;color:var(--sf-ink);display:flex;align-items:center;justify-content:space-between;font:580 13px/1 Inter;text-align:left;cursor:pointer}
.img-library-view-option:hover{background:var(--sf-hover)}.img-library-view-option.on{background:var(--sf-sel);font-weight:680}
.img-library-view-option.on::after{content:"";width:7px;height:7px;border-radius:999px;background:var(--sf-ink)}
.img-library-count{color:var(--sf-dim);font:600 11.5px/1 Inter;white-space:nowrap}
.img-library-empty-card{min-height:420px;border:1px solid var(--sf-border);border-radius:22px;background:var(--sf-surface);display:grid;place-items:center;padding:48px 24px;box-sizing:border-box}
.img-library-empty-inner{width:min(520px,100%);display:flex;flex-direction:column;align-items:center;text-align:center}
.img-library-empty-icon{width:72px;height:72px;border-radius:18px;background:var(--sf-hover);color:var(--sf-sub);display:grid;place-items:center;margin-bottom:24px}
.img-library-empty-icon svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.img-library-empty-title{margin:0 0 9px;color:var(--sf-ink);font:650 22px/1.2 Inter;letter-spacing:-.018em}
.img-library-empty-copy{max-width:470px;margin:0;color:var(--sf-sub);font:450 15px/1.55 Inter}
.img-library-empty-add{height:46px;margin-top:24px;padding:0 22px;border:0;border-radius:12px;background:var(--sf-ink);color:var(--sf-surface);font:620 14px/1 Inter;cursor:pointer;box-shadow:none}
.img-library-empty-add:hover{background:var(--sf-ink);color:var(--sf-surface)}
.img-library-empty-add:focus-visible{outline:2px solid #3590F5;outline-offset:3px}
.img-library-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.img-library-card{position:relative;aspect-ratio:1/1;overflow:hidden;border-radius:22px;background:#c7c7ca;cursor:pointer}
.img-library-placeholder{position:absolute;inset:0;border:1px solid #b9b9bd;border-radius:inherit;background:#c7c7ca}
html[data-theme="dark"] .img-library-card{background:#303034}
html[data-theme="dark"] .img-library-placeholder{border-color:#3d3d42;background:#303034}
.img-card-actions{position:absolute;left:14px;right:14px;bottom:14px;z-index:2;display:flex;align-items:center;justify-content:space-between;opacity:0;transform:translateY(7px);transition:opacity .18s ease,transform .18s ease;pointer-events:none}
.img-library-card:hover .img-card-actions,.img-library-card:focus-within .img-card-actions,.img-result:hover .img-card-actions,.img-result:focus-within .img-card-actions{opacity:1;transform:none;pointer-events:auto}
.img-card-action{height:42px;border:1px solid rgba(255,255,255,.58);border-radius:999px;background:rgba(255,255,255,.42);color:#18181a;backdrop-filter:blur(20px) saturate(1.18);-webkit-backdrop-filter:blur(20px) saturate(1.18);font:650 14px/1 Inter;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 17px;cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.07)}
.img-card-action:hover{background:rgba(255,255,255,.42);color:#18181a}
html[data-theme="dark"] .img-card-action{border-color:rgba(255,255,255,.18);background:rgba(20,20,22,.48);color:rgba(255,255,255,.94);box-shadow:0 4px 18px rgba(0,0,0,.2)}
html[data-theme="dark"] .img-card-action:hover{background:rgba(20,20,22,.48);color:rgba(255,255,255,.94)}
.img-card-action.share{width:42px;padding:0}
.img-card-action svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.img-library-more{display:flex;justify-content:center;padding-top:44px}
.img-library-more-btn{height:46px;padding:0 24px;border:1px solid var(--sf-border);border-radius:999px;background:var(--sf-surface);color:var(--sf-ink);font:620 13px/1 Inter;cursor:pointer;box-shadow:none}
.img-library-more-btn:hover{background:var(--sf-surface);border-color:var(--sf-border)}
.img-collections-panel{display:flex;flex-direction:column;gap:38px;padding:4px 0 10px}
.img-collection-section{min-width:0}
.img-collection-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 14px}
.img-collection-title{margin:0;color:var(--sf-ink);font:680 19px/1.2 Inter;letter-spacing:-.018em}
.img-collection-meta{color:var(--sf-dim);font:550 11.5px/1 Inter}
.img-collection-rail{display:flex;gap:16px;width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scrollbar-width:none;padding:0 0 8px}
.img-collection-rail::-webkit-scrollbar{display:none}
.img-collection-card{position:relative;flex:0 0 clamp(184px,20vw,246px);aspect-ratio:1/1;overflow:hidden;border:0;border-radius:22px;background:#e8e8e8;scroll-snap-align:start;color:#fff;cursor:pointer;padding:0;text-align:left}
.img-collection-card img{width:100%;height:100%;display:block;object-fit:cover}
.img-collection-card::after{content:"";position:absolute;inset:42% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.58));pointer-events:none}
.img-collection-card.placeholder::before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,#c9c9cc,#8f8f94)}
html[data-theme="dark"] .img-collection-card.placeholder::before{background:linear-gradient(145deg,#3a3a3f,#242427)}
.img-collection-card-copy{position:absolute;z-index:2;left:17px;right:17px;bottom:15px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.img-collection-card-name{font:680 14px/1.2 Inter}.img-collection-card-count{font:570 11px/1 Inter;opacity:.82;white-space:nowrap}
.img-library-list-card{width:100%;overflow:auto;border:1px solid var(--sf-border);border-radius:16px;background:var(--sf-surface);scrollbar-width:thin}
.img-library-table{width:100%;min-width:1040px;border-collapse:collapse;table-layout:fixed;color:var(--sf-ink);font:500 13px/1.35 Inter}
.img-library-table th{position:sticky;top:0;z-index:2;height:48px;padding:0 15px;border-bottom:1px solid var(--sf-border);background:var(--sf-surface);color:var(--sf-sub);font-size:12px;font-weight:650;text-align:left;white-space:nowrap}
.img-library-table td{height:66px;padding:8px 15px;border-bottom:1px solid var(--sf-border-2);vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.img-library-table tr:last-child td{border-bottom:0}
.img-library-table tbody tr:hover td{background:var(--sf-hover)}
.img-library-table .media{width:72px}.img-library-table .name{width:190px}.img-library-table .type{width:72px}.img-library-table .dimensions{width:112px}.img-library-table .description{width:310px}.img-library-table .created{width:130px}.img-library-table .size{width:92px;text-align:right}
.img-library-row-thumb{width:44px;height:44px;padding:0;border-radius:9px;border:1px solid var(--sf-border);background:#e8e8e8;display:block;overflow:hidden;cursor:pointer}
.img-library-row-thumb img{width:100%;height:100%;display:block;object-fit:cover}
.img-library-row-name{display:block;overflow:hidden;text-overflow:ellipsis;font-weight:650;color:var(--sf-ink)}
.img-library-row-sub{display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;color:var(--sf-dim);font-size:10.5px}
.img-library-row-muted{color:var(--sf-sub)}
.img-library-no-match{display:none;min-height:180px;place-items:center;color:var(--sf-sub);font:550 13px/1.4 Inter;text-align:center}
.img-library-shell.is-empty-search .img-library-no-match{display:grid}
.img-library-shell [data-image-library-grid-panel][hidden],.img-library-shell [data-image-library-list-panel][hidden],.img-library-shell [data-image-library-collections-panel][hidden],.img-library-shell [data-content-search][hidden]{display:none!important}
@media(max-width:1120px){.img-library-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:820px){.img-library-demo{--img-library-gutter:14px}.img-results-library{--img-library-gutter:14px}.img-library-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.img-library-placeholder{border-radius:18px}.img-library-empty{padding:clamp(150px,24vh,220px) 14px 64px}.img-library-empty-card{min-height:360px;padding:40px 20px}.img-library-toolbar{align-items:flex-start;flex-direction:column}.img-library-tools{width:100%;justify-content:flex-start}.img-library-search{width:auto;max-width:none;flex:1}}
.img-editor{position:fixed;inset:0;z-index:360;background:var(--sf-surface);color:var(--sf-ink);display:grid;grid-template-rows:64px minmax(0,1fr)}
.img-editor-top{display:flex;align-items:center;gap:10px;padding:0 20px;border-bottom:1px solid var(--sf-border);background:var(--sf-surface)}
.img-editor-title{min-width:0;flex:1;padding:7px 8px;margin-left:-8px;border:1px solid transparent;border-radius:8px;background:transparent;font:620 15px/1 Inter;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;outline:0;cursor:text}
.img-editor-title[contenteditable="true"]{overflow:visible;text-overflow:clip;border-color:color-mix(in srgb,#4a5cff 68%,transparent);background:transparent;box-shadow:0 0 0 2px color-mix(in srgb,#4a5cff 15%,transparent)}
.img-editor-btn{height:38px;border:1px solid var(--sf-border);border-radius:999px;background:var(--sf-surface);color:var(--sf-ink);padding:0 16px;display:inline-flex;align-items:center;gap:7px;font:600 13px/1 Inter;cursor:pointer;box-shadow:none}
.img-editor-btn:hover{background:var(--sf-hover)}
.img-editor-btn[aria-pressed="true"]{background:var(--sf-hover);border-color:color-mix(in srgb,#4a5cff 48%,var(--sf-border));color:#4a5cff}
.img-editor-btn.primary{background:var(--sf-ink);border-color:var(--sf-ink);color:var(--sf-surface)}
.img-editor-btn.icon{width:38px;min-width:38px;padding:0;justify-content:center;border-radius:50%}
.img-editor-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.img-editor-btn[data-editor-aspect]{padding-right:10px}.img-editor-btn[data-editor-aspect] .aspect-chevron{width:15px;height:15px;margin-left:1px;transition:transform .18s ease}.img-editor-btn[data-editor-aspect][aria-expanded="true"] .aspect-chevron{transform:rotate(180deg)}
.img-editor-body{min-height:0;display:grid;grid-template-columns:86px minmax(0,1fr);background:var(--sf-bg)}
.img-editor-rail{position:relative;border-right:1px solid var(--sf-border);padding:18px 10px 78px;overflow:hidden}
.img-editor-versions{height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;display:flex;flex-direction:column;align-items:center;gap:10px}
.img-editor-versions::-webkit-scrollbar{display:none}
.img-editor-version{position:relative;width:62px;height:72px;padding:3px;border:1.5px solid transparent;border-radius:13px;background:transparent;color:var(--sf-sub);cursor:pointer;box-shadow:none;flex:0 0 auto;transition:border-color .16s ease,background .16s ease}
.img-editor-version:hover{background:var(--sf-hover)}
.img-editor-version.on{border-color:#4a5cff;background:color-mix(in srgb,#4a5cff 8%,var(--sf-surface))}
.img-editor-version img,.img-editor-version-placeholder{width:100%;height:100%;border-radius:9px;background:#e8e8e8;object-fit:cover;display:block}
.img-editor-version-index{position:absolute;right:-3px;bottom:-3px;min-width:18px;height:18px;padding:0 4px;border:2px solid var(--sf-bg);border-radius:999px;background:var(--sf-ink);color:var(--sf-surface);display:grid;place-items:center;font:700 9px/1 Inter}
.img-editor-version.on .img-editor-version-index{background:#4a5cff;color:#fff}
.img-editor-profile{position:absolute;left:18px;bottom:18px;width:50px;height:50px;padding:0;border:0;border-radius:50%;background:color-mix(in srgb,var(--sf-surface) 88%,transparent);color:var(--sf-sub);display:grid;place-items:center;cursor:pointer;box-shadow:none;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.img-editor-profile:hover,.img-editor-profile[aria-expanded="true"]{background:var(--sf-hover)}
.img-editor-profile .sf-acct-av{width:38px;height:38px}.img-editor-profile .sf-acct-initial{background:var(--sf-sel)}
.sf-acct-menu[data-surface="editor"] .sf-acct-projects{display:none}
.img-editor-stage{position:relative;min-width:0;min-height:0;overflow:hidden;background:var(--sf-bg)}
.img-editor-canvas{position:absolute;inset:0;overflow:hidden;cursor:default;contain:paint;overscroll-behavior:contain;touch-action:none;-webkit-user-drag:none;user-select:none;-webkit-user-select:none;outline:0}
.img-editor-canvas *:not(input):not(textarea):not([contenteditable]){-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
.img-editor-canvas.space-held,.img-editor-canvas.hand-tool{cursor:grab}
.img-editor-canvas.is-panning{cursor:grabbing}
.img-editor-canvas.is-file-over{box-shadow:inset 0 0 0 3px #4a5cff;background:color-mix(in srgb,#4a5cff 7%,var(--sf-bg))}.img-editor-canvas.is-file-over::after{content:"Drop image to place on canvas";position:absolute;left:50%;top:50%;z-index:80;transform:translate(-50%,-50%);padding:13px 18px;border:2px solid #fff;border-radius:12px;background:#4a5cff;color:#fff;font:650 13px/1 Inter;box-shadow:0 16px 44px rgba(39,56,214,.25);pointer-events:none}
.img-editor-world{--img-editor-ui-inv:1;position:absolute;left:0;top:0;transform-origin:0 0;will-change:auto}
.img-editor-media{position:absolute;left:0;top:0;width:620px;height:620px;border:1.5px solid transparent;border-radius:2px;background:transparent;box-sizing:border-box;outline:0}
.img-editor-media.is-selected{border-color:#4a5cff}
.img-editor-media.is-selected .img-editor-frame-content{cursor:move}.img-editor-media.is-dragging .img-editor-frame-content{cursor:grabbing}
.img-editor-frame-content{position:absolute;inset:0;overflow:hidden;border-radius:1px;background-color:#e8e8e8;background-image:linear-gradient(45deg,rgba(255,255,255,.38) 25%,transparent 25%),linear-gradient(-45deg,rgba(255,255,255,.38) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(255,255,255,.38) 75%),linear-gradient(-45deg,transparent 75%,rgba(255,255,255,.38) 75%);background-size:22px 22px;background-position:0 0,0 11px,11px -11px,-11px 0}
.img-editor-source{position:absolute;left:50%;top:50%;width:620px;height:620px;transform:translate(-50%,-50%);display:grid;place-items:center;background:#e8e8e8;pointer-events:none}
.img-editor-source img{width:100%;height:100%;display:block;object-fit:contain}
.img-editor-media.is-extended .img-editor-source{width:100%;height:100%}
.img-editor-frame-name{position:absolute;left:calc(-1px * var(--img-editor-ui-inv));bottom:calc(100% + 8px * var(--img-editor-ui-inv));z-index:4;max-width:calc(240px * var(--img-editor-ui-inv));padding:calc(2px * var(--img-editor-ui-inv)) calc(5px * var(--img-editor-ui-inv));border:calc(1px * var(--img-editor-ui-inv)) solid transparent;border-radius:calc(5px * var(--img-editor-ui-inv));color:#8f9096;background:transparent;font:560 calc(13px * var(--img-editor-ui-inv))/1.25 Inter;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:text;outline:0}
.img-editor-media.is-selected .img-editor-frame-name{color:#777982}.img-editor-frame-name[contenteditable="true"]{border-color:#4a5cff;background:transparent;color:#777982;overflow:visible}
.img-editor-frame-handle{position:absolute;z-index:5;width:calc(9px * var(--img-editor-ui-inv));height:calc(9px * var(--img-editor-ui-inv));padding:0;border:calc(1px * var(--img-editor-ui-inv)) solid #fff;border-radius:calc(3px * var(--img-editor-ui-inv));background:#4a5cff;box-shadow:0 0 0 calc(.5px * var(--img-editor-ui-inv)) #4a5cff;display:none;touch-action:none}
.img-editor-media.is-selected .img-editor-frame-handle{display:block}
.img-editor-frame-handle[data-frame-resize="nw"]{left:0;top:0;transform:translate(-50%,-50%);cursor:nwse-resize}.img-editor-frame-handle[data-frame-resize="n"]{left:50%;top:0;transform:translate(-50%,-50%);cursor:ns-resize}.img-editor-frame-handle[data-frame-resize="ne"]{right:0;top:0;transform:translate(50%,-50%);cursor:nesw-resize}.img-editor-frame-handle[data-frame-resize="e"]{right:0;top:50%;transform:translate(50%,-50%);cursor:ew-resize}.img-editor-frame-handle[data-frame-resize="se"]{right:0;bottom:0;transform:translate(50%,50%);cursor:nwse-resize}.img-editor-frame-handle[data-frame-resize="s"]{left:50%;bottom:0;transform:translate(-50%,50%);cursor:ns-resize}.img-editor-frame-handle[data-frame-resize="sw"]{left:0;bottom:0;transform:translate(-50%,50%);cursor:nesw-resize}.img-editor-frame-handle[data-frame-resize="w"]{left:0;top:50%;transform:translate(-50%,-50%);cursor:ew-resize}
.img-editor-frame-size{position:absolute;left:calc(100% + 12px);top:50%;z-index:5;padding:7px 9px;border-radius:7px;background:#303137;color:#fff;font:620 11px/1 Inter;font-variant-numeric:tabular-nums;white-space:nowrap;transform:translateY(-50%);display:none;box-shadow:0 5px 18px rgba(0,0,0,.2)}
.img-editor-media.is-resizing .img-editor-frame-size{display:block}
.img-editor-info-panel{position:absolute;right:14px;top:14px;z-index:28;width:250px;border:.5px solid var(--sf-border);border-radius:14px;background:color-mix(in srgb,var(--sf-surface) 88%,transparent);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);box-shadow:0 16px 48px rgba(0,0,0,.16);padding:16px;box-sizing:border-box}
.img-editor-info-panel[hidden]{display:none}.img-editor-info-panel h3{margin:0 0 14px;font:650 14px/1.2 Inter}.img-editor-info-grid{margin:0;display:grid;gap:0}.img-editor-info-grid div{display:grid;grid-template-columns:78px minmax(0,1fr);gap:10px;padding:9px 0;border-bottom:1px solid var(--sf-border-2)}.img-editor-info-grid div:last-child{border:0}.img-editor-info-grid dt{color:var(--sf-dim);font:550 11px/1.35 Inter}.img-editor-info-grid dd{min-width:0;margin:0;color:var(--sf-ink);font:580 11.5px/1.35 Inter;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.img-editor-btn.extend[disabled]{opacity:.42;cursor:not-allowed}.img-editor-btn.extend.ready{border-color:#4a5cff;color:#4a5cff}
.img-editor-top-normal,.img-editor-comment-head,.img-editor-erase-head{width:100%;display:flex;align-items:center;gap:10px}.img-editor-comment-head[hidden],.img-editor-erase-head[hidden],.img-editor.is-commenting .img-editor-top-normal,.img-editor.is-erasing .img-editor-top-normal{display:none}.img-editor.is-commenting .img-editor-comment-head,.img-editor.is-erasing .img-editor-erase-head{display:flex}.img-editor-comment-head strong,.img-editor-erase-head strong{font:620 14px/1 Inter}.img-editor-comment-head .cancel,.img-editor-erase-head .cancel{margin-left:0;border:0;background:transparent;color:var(--sf-ink);font:560 13px/1 Inter;cursor:pointer}.img-editor-erase-actions{margin-left:auto;display:flex;align-items:center;gap:8px}.img-editor-history-btn{width:34px;height:34px;padding:0;border:0;border-radius:999px;background:transparent;color:var(--sf-dim);display:grid;place-items:center;cursor:pointer}.img-editor-history-btn:not(:disabled){color:var(--sf-ink)}.img-editor-history-btn:disabled{opacity:.4;cursor:not-allowed}.img-editor-history-btn:hover:not(:disabled){background:transparent}.img-editor-history-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.img-editor-erase-send{height:38px;padding:0 18px;border:0;border-radius:999px;background:var(--sf-ink);color:var(--sf-surface);font:620 13px/1 Inter;cursor:pointer}.img-editor-erase-send:disabled{background:#c6c6c9;color:#fff;cursor:not-allowed}
.img-editor-aspect-menu{position:absolute;right:356px;top:56px;z-index:44;width:224px;padding:12px;border:1px solid var(--sf-border);border-radius:18px;background:color-mix(in srgb,var(--sf-surface) 94%,transparent);backdrop-filter:blur(28px) saturate(150%);-webkit-backdrop-filter:blur(28px) saturate(150%);box-shadow:0 16px 38px rgba(0,0,0,.12);box-sizing:border-box;transform-origin:85% 0;animation:imgAspectMenuIn .16s cubic-bezier(.2,.8,.2,1)}.img-editor-aspect-menu[hidden]{display:none}@keyframes imgAspectMenuIn{from{opacity:0;transform:translateY(-5px) scale(.98)}to{opacity:1;transform:none}}.img-editor-aspect-menu p{margin:1px 7px 8px;color:var(--sf-sub);font:540 11.5px/1.35 Inter}.img-editor-aspect-option{width:100%;height:44px;padding:0 9px;border:0;border-radius:11px;background:transparent;color:var(--sf-ink);display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:7px;text-align:left;font:580 12.5px/1 Inter;cursor:pointer}.img-editor-aspect-option:hover,.img-editor-aspect-option.on{background:var(--sf-hover)}.img-editor-aspect-icon{width:20px;height:20px;border:1.7px solid currentColor;border-radius:6px;box-sizing:border-box;justify-self:center}.img-editor-aspect-option[data-aspect-value="3:4"] .img-editor-aspect-icon,.img-editor-aspect-option[data-aspect-value="9:16"] .img-editor-aspect-icon{width:14px}.img-editor-aspect-option[data-aspect-value="4:3"] .img-editor-aspect-icon{width:23px;height:17px}.img-editor-aspect-option[data-aspect-value="16:9"] .img-editor-aspect-icon{width:25px;height:14px}.img-editor-aspect-option small{color:var(--sf-dim);font:520 12px/1 Inter}
.img-editor-canvas.comment-mode{cursor:crosshair}.img-editor-canvas.comment-mode .img-editor-frame-handle{pointer-events:none}
.img-editor.is-erasing .img-editor-media{border-color:transparent}.img-editor.is-erasing .img-editor-frame-name,.img-editor.is-erasing .img-editor-frame-handle,.img-editor.is-erasing .img-editor-frame-size,.img-editor.is-erasing .img-editor-zoom-controls,.img-editor.is-erasing .img-editor-composer-slot{display:none!important}.img-editor.is-erasing .img-editor-source{width:100%;height:100%}.img-erase-mask{position:absolute;inset:0;z-index:9;width:100%;height:100%;display:block;touch-action:none;cursor:none}.img-erase-mask[hidden]{display:none}.img-erase-cursor{position:absolute;z-index:10;border:2px solid rgba(66,92,130,.22);border-radius:999px;background:rgba(255,255,255,.04);box-shadow:0 1px 7px rgba(0,0,0,.08);pointer-events:none;transform:translate(-50%,-50%)}
.img-erase-size-control{position:absolute;left:42px;top:50%;z-index:34;width:66px;height:264px;border:1px solid rgba(255,255,255,.76);border-radius:999px;background:rgba(255,255,255,.9);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 10px 28px rgba(0,0,0,.13);transform:translateY(-50%);display:grid;place-items:center}.img-erase-size-control[hidden]{display:none}.img-erase-size-control input{width:210px;height:28px;margin:0;appearance:none;background:transparent;transform:rotate(-90deg)}.img-erase-size-control input::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:#929398}.img-erase-size-control input::-webkit-slider-thumb{width:28px;height:28px;margin-top:-11px;border:0;border-radius:999px;background:#626368;appearance:none;box-shadow:0 2px 8px rgba(0,0,0,.15)}.img-erase-size-control input::-moz-range-track{height:6px;border-radius:999px;background:#929398}.img-erase-size-control input::-moz-range-thumb{width:28px;height:28px;border:0;border-radius:999px;background:#626368}
.img-comment-pin{position:absolute;z-index:12;width:30px;height:38px;padding:0;border:0;border-radius:0;background:transparent;color:#fff;display:grid;place-items:center;font:720 12px/1 Inter;box-shadow:none;transform:translate(-50%,-50%);cursor:pointer;transition:transform .14s cubic-bezier(.2,.9,.3,1.25),box-shadow .14s ease}.img-comment-pin.has-text{width:26px;height:26px;border:2px solid #fff;border-radius:999px;background:#317aff;box-shadow:0 3px 10px rgba(0,0,0,.11)}.img-comment-pin:hover,.img-comment-pin.open{transform:translate(-50%,-50%) scale(1.1)}.img-comment-pin.has-text:hover,.img-comment-pin.has-text.open{box-shadow:0 4px 13px rgba(0,0,0,.13)}.img-comment-marker-shape{width:24px;height:38px;display:block;overflow:visible}.img-comment-marker-shape path{fill:#317aff;stroke:#fff;stroke-width:2}.img-comment-pin.has-text .img-comment-marker-shape{display:none}
.img-comment-popover{position:absolute;z-index:14;min-width:150px;max-width:250px;padding:9px 14px;border:1px solid rgba(255,255,255,.9);border-radius:999px;background:rgba(248,248,250,.94);color:#26272a;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 5px 16px rgba(0,0,0,.09);font:540 12px/1.35 Inter;transform:translate(18px,-50%);pointer-events:none}
.img-comment-draft{position:absolute;z-index:15;width:min(310px,calc(100vw - 180px));height:38px;padding:0 4px 0 14px;border:.5px solid #a6a6a6;border-radius:999px;background:rgba(255,255,255,.96);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 5px 16px rgba(0,0,0,.09);display:flex;align-items:center;gap:6px;box-sizing:border-box;transform:translate(18px,-50%)}.img-comment-draft input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#252629;font:540 13px/1 Inter}.img-comment-draft input::placeholder{color:#9a9ba0}.img-comment-draft-divider{width:1px;height:12px;background:#ededed}.img-comment-draft-action{width:30px;height:30px;padding:0;border:0;border-radius:999px;background:transparent;color:#292a2d;display:grid;place-items:center;cursor:pointer}.img-comment-draft-action:hover{background:#f0f0f1}.img-comment-draft-action.confirm{background:#317aff;color:#fff}.img-comment-draft-action:disabled{background:#d8d8d8;color:#fff;cursor:not-allowed}.img-comment-draft-action svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.img-editor-comment-summary{position:absolute;left:50%;bottom:14px;z-index:30;width:min(760px,calc(100% - 180px));border:1px solid var(--sf-border);border-radius:28px;background:color-mix(in srgb,var(--sf-surface) 92%,transparent);backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);box-shadow:0 14px 38px rgba(0,0,0,.1);transform:translateX(-50%);overflow:hidden}.img-editor-comment-summary[hidden]{display:none}.img-comment-summary-head{height:42px;padding:0 15px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--sf-border-2);color:var(--sf-sub);font:560 12px/1 Inter}.img-comment-summary-head svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}.img-comment-summary-head button{margin-left:auto;width:30px;height:30px;padding:0;border:0;border-radius:999px;background:transparent;color:var(--sf-sub);display:grid;place-items:center;cursor:pointer}.img-comment-summary-head button:hover{background:var(--sf-hover)}.img-comment-summary-row{height:56px;padding:0 10px 0 18px;display:flex;align-items:center;gap:12px}.img-comment-summary-row>span{font-size:22px}.img-comment-summary-row input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--sf-ink);font:540 13px/1 Inter}.img-comment-summary-row input::placeholder{color:var(--sf-dim)}.img-comment-summary-send{height:38px;padding:0 17px;border:0;border-radius:999px;background:var(--sf-ink);color:var(--sf-surface);font:620 13px/1 Inter;cursor:pointer}.img-editor.is-commenting .img-editor-composer-slot{display:none}
.img-editor-zoom-controls{position:absolute;left:14px;bottom:14px;z-index:25;display:flex;align-items:center;gap:2px;padding:4px;border:.5px solid var(--sf-border);border-radius:999px;background:rgba(255,255,255,.84);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);box-shadow:none}
.img-editor-zoom-btn{width:28px;height:28px;padding:0;border:0;border-radius:999px;background:transparent;color:var(--sf-sub);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .12s ease,color .12s ease}
.img-editor-zoom-btn:hover,.img-editor-zoom-readout:hover{background:var(--sf-hover);color:var(--sf-ink)}
.img-editor-zoom-btn svg{width:15px;height:15px}
.img-editor-zoom-readout{height:28px;min-width:64px;padding:0 10px;border:0;border-radius:999px;background:transparent;color:var(--sf-ink);font:500 12px/1 Inter;font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;justify-content:center;gap:4px;cursor:pointer}
.img-editor-zoom-readout svg{width:9px;height:9px;color:var(--sf-sub);transition:transform .2s cubic-bezier(.22,1,.36,1)}
.img-editor-zoom-controls.menu-open .img-editor-zoom-readout svg{transform:rotate(180deg)}
.img-editor-zoom-menu{position:absolute;left:14px;bottom:56px;z-index:26;min-width:200px;padding:6px;border:.5px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(28,28,30,.96);color:#f5f5f7;backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);box-shadow:0 12px 40px rgba(0,0,0,.28);display:flex;flex-direction:column;gap:1px}
.img-editor-zoom-menu[hidden]{display:none}
.img-editor-zoom-option{height:30px;padding:0 10px;border:0;border-radius:6px;background:transparent;color:#f5f5f7;font:500 12.5px/1 Inter;display:flex;align-items:center;justify-content:space-between;text-align:left;cursor:pointer}
.img-editor-zoom-option:hover{background:rgba(255,255,255,.08)}
.img-editor-zoom-option kbd{padding:1px 6px;border-radius:4px;background:rgba(255,255,255,.08);color:#a8a8ad;font:500 10px/1 Inter}
.img-editor-zoom-sep{height:1px;margin:4px 6px;background:rgba(255,255,255,.08)}
.img-editor-composer-slot{position:absolute;left:50%;bottom:14px;z-index:24;width:min(640px,calc(100% - 390px));transform:translateX(-50%);pointer-events:auto}
body.shopify[data-view="images"] .img-editor-composer-slot>.composer{position:relative!important;inset:auto!important;width:100%;padding:0;z-index:1}
.img-share-modal{position:fixed;inset:0;z-index:420;display:grid;place-items:center;padding:24px;background:rgba(0,0,0,.24);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.img-share-card{width:min(700px,calc(100vw - 40px));border:1px solid var(--sf-border);border-radius:22px;background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 30px 90px rgba(0,0,0,.2);padding:24px;box-sizing:border-box}
.img-share-head{display:flex;align-items:center;gap:16px;padding-bottom:18px;border-bottom:1px solid var(--sf-border)}
.img-share-head h2{font:650 22px/1.2 Inter;margin:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.img-share-preview{width:138px;aspect-ratio:1/1;border-radius:14px;margin:24px auto;background:#e8e8e8;border:1px solid var(--sf-border);overflow:hidden}
.img-share-preview img{width:100%;height:100%;object-fit:cover}
.img-share-actions{display:grid;grid-template-columns:minmax(0,1fr) 112px 112px;gap:10px;align-items:stretch}
.img-share-option{border:0;background:transparent;color:var(--sf-ink);display:flex;flex-direction:column;align-items:center;gap:9px;font:550 12px/1.2 Inter;cursor:pointer}
.img-share-option i{width:48px;height:48px;border-radius:14px;background:var(--sf-ink);color:var(--sf-surface);display:grid;place-items:center;font-style:normal;font-weight:700}
.img-share-option svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.img-share-ai-button{min-height:74px;padding:0 20px;border:0;border-radius:14px;background:var(--sf-ink);color:var(--sf-surface);display:flex;align-items:center;justify-content:center;gap:11px;font:650 15px/1 Inter;cursor:pointer;box-shadow:none}
.img-share-ai-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.img-share-utility{min-height:74px;padding:0 12px;border:1px solid var(--sf-border);border-radius:14px;background:var(--sf-surface);color:var(--sf-ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;font:600 11.5px/1 Inter;cursor:pointer;box-shadow:none}
.img-share-utility svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.img-share-ai-view{display:grid;grid-template-columns:122px minmax(0,1fr);gap:18px;padding-top:20px}
.img-share-ai-context{min-width:0}.img-share-ai-context .img-share-preview{width:100%;margin:0 0 10px;border-radius:14px}.img-share-ready{display:flex;align-items:center;gap:7px;color:#168246;font:650 11px/1.3 Inter}.img-share-ready::before{content:"";width:7px;height:7px;border-radius:50%;background:#22b85c}
.img-share-ai-main{min-width:0}.img-share-ai-thread{height:238px;overflow:auto;padding:1px 4px 12px 0;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin}.img-share-ai-message{max-width:88%;padding:11px 13px;border-radius:14px;background:var(--sf-fill);color:var(--sf-ink);font:500 13px/1.45 Inter}.img-share-ai-message.user{align-self:flex-end;background:var(--sf-ink);color:var(--sf-surface)}
.img-share-ai-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.img-share-ai-choice{min-height:44px;padding:8px 10px;border:1px solid var(--sf-border);border-radius:11px;background:var(--sf-surface);color:var(--sf-ink);display:flex;align-items:center;gap:9px;text-align:left;font:600 12px/1.25 Inter;cursor:pointer;box-shadow:none}.img-share-ai-choice b{width:22px;height:22px;flex:0 0 auto;border-radius:7px;background:var(--sf-fill);display:grid;place-items:center;font:700 10px/1 Inter}.img-share-ai-choice:hover{border-color:var(--sf-dim)}
.img-share-ai-attachment{margin:0 0 8px;padding:8px 10px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-fill);display:flex;align-items:center;gap:9px;font:550 11px/1.2 Inter}.img-share-ai-attachment img{width:32px;height:32px;border-radius:7px;object-fit:cover}.img-share-ai-attachment button{margin-left:auto;border:0;background:transparent;color:var(--sf-dim);cursor:pointer}
.img-share-ai-composer{min-height:48px;padding:5px 6px 5px 8px;border:1px solid var(--sf-border);border-radius:14px;background:var(--sf-surface);display:flex;align-items:center;gap:6px}.img-share-ai-composer input[type="text"]{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--sf-ink);font:500 12.5px/1.3 Inter}.img-share-ai-icon{width:34px;height:34px;border:0;border-radius:10px;background:transparent;color:var(--sf-ink);display:grid;place-items:center;cursor:pointer}.img-share-ai-icon:hover{background:var(--sf-fill)}.img-share-ai-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.img-share-ai-send{height:34px;padding:0 14px;border:0;border-radius:10px;background:var(--sf-ink);color:var(--sf-surface);font:650 11.5px/1 Inter;cursor:pointer}.img-share-ai-send:disabled{opacity:.42;cursor:default}
.img-preview-modal{position:fixed;inset:0;z-index:410;background:rgba(12,12,12,.58);color:#fff;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-backdrop-filter:blur(24px) saturate(.82);backdrop-filter:blur(24px) saturate(.82)}
.img-preview-card{position:absolute;inset:0;overflow:hidden;background:transparent;color:#fff}
.img-preview-head{position:absolute;left:40px;right:381px;top:0;height:94px;display:flex;align-items:center;z-index:2}
.img-preview-title{width:min(620px,100%);padding:0;border:0;outline:0;background:transparent;color:#fff;font:500 20px/1.2 Inter;letter-spacing:0;cursor:default;caret-color:transparent}
.img-preview-title.is-editing{cursor:text;caret-color:#fff}
.img-preview-title::selection,.img-preview-field::selection{background:#4f62ff;color:#fff}
.img-preview-body{position:absolute;inset:0 341px 0 0;display:grid;place-items:center}
.img-preview-media{width:min(469px,calc(100vw - 440px),calc(100vh - 190px));aspect-ratio:1/1;border:1px solid #979797;border-radius:0;background:#d8d8d8;overflow:hidden}
.img-preview-media img{width:100%;height:100%;display:block;object-fit:contain}
.img-preview-info{position:absolute;right:40px;top:40px;bottom:40px;width:300px;box-sizing:border-box;padding:31px 20px 20px;border-radius:30px;background:#2c2c2c;display:flex;flex-direction:column}
.img-preview-close{position:absolute;right:20px;top:20px;width:40px;height:40px;padding:0;border:1px solid rgba(151,151,151,.2);border-radius:999px;background:transparent;color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:none}
.img-preview-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.img-preview-kicker{flex:0 0 auto;margin:0 0 27px;color:#fff;font:500 20px/1.2 Inter;letter-spacing:0;text-transform:none}
.img-preview-meta{margin:0;display:flex;flex-direction:column;min-height:0}
.img-preview-meta-row{flex:0 0 auto;margin:0 0 12px}
.img-preview-meta-row.preview-meta-title,.img-preview-meta-row.preview-description{margin-top:2px;padding-top:14px;border-top:1px solid rgba(151,151,151,.2)}
.img-preview-meta-row label{display:block;margin:0 0 9px;color:#fff;font:500 14px/1 Inter}
.img-preview-field{display:block;width:100%;height:40px;box-sizing:border-box;padding:0 12px;border:0;border-radius:12px;outline:0;background:#393939;color:#fff;font:300 12px/1.35 Inter;box-shadow:none}
textarea.img-preview-field{height:61px;padding:10px 32px 10px 12px;resize:none;overflow:auto;scrollbar-width:none}
textarea.img-preview-field::-webkit-scrollbar{display:none}
.img-preview-field:focus{box-shadow:0 0 0 1px rgba(255,255,255,.38)}
.img-preview-field-row{position:relative}.img-preview-field-row::after{content:none!important;display:none!important}
.img-preview-resize-grip{position:absolute;right:8px;bottom:7px;width:19px;height:19px;padding:0;border:0;background:transparent;color:rgba(255,255,255,.66);cursor:nwse-resize;touch-action:none}
.img-preview-resize-grip::before,.img-preview-resize-grip::after{content:"";position:absolute;right:1px;height:1px;border-radius:2px;background:currentColor;transform:rotate(-45deg);transform-origin:center}
.img-preview-resize-grip::before{bottom:6px;width:13px}.img-preview-resize-grip::after{bottom:3px;width:8px}
.img-preview-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:auto;padding-top:14px}
.img-preview-action{height:40px;padding:0 8px;border:1px solid rgba(255,255,255,.5);border-radius:10px;background:transparent;color:#fff;font:500 14px/1 Inter;cursor:pointer;box-shadow:none}
.img-preview-action.icon{display:grid;place-items:center}.img-preview-action svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.img-preview-action:hover,.img-preview-close:hover{border-color:#fff;background:transparent}
@media(max-width:900px){.img-editor-composer-slot{bottom:64px;width:min(640px,calc(100% - 28px))}}
@media(max-width:760px){.img-editor-top .optional{display:none}.img-editor-body{grid-template-columns:1fr}.img-editor-rail{display:none}.img-editor-media{width:520px}.img-editor-composer-slot{width:calc(100% - 28px)}.img-share-actions{grid-template-columns:1fr 82px 82px}.img-share-ai-view{grid-template-columns:1fr}.img-share-ai-context{display:none}.img-share-ai-thread{height:220px}.img-preview-card{overflow:auto}.img-preview-head{position:relative;left:auto;right:auto;height:76px;padding:0 24px}.img-preview-body{position:relative;inset:auto;min-height:420px;padding:10px 24px 350px}.img-preview-media{width:min(100%,469px)}.img-preview-info{position:absolute;left:16px;right:16px;top:auto;bottom:16px;width:auto;height:320px;padding:24px 20px 20px;border-radius:24px}.img-preview-kicker{margin-bottom:18px}.img-preview-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px}.img-preview-meta-row{margin:0}.img-preview-meta-row.preview-description{display:none}.img-preview-actions{position:absolute;left:20px;right:20px;bottom:20px}}
body.shopify[data-view="images"].images-generating .sf-content{overflow:hidden}
body.shopify[data-view="images"].images-generating .composer{opacity:0;visibility:hidden;pointer-events:none}
.img-gen-stage{--card-w:clamp(92px,9vw,138px);--card-h:clamp(118px,12vw,178px);position:relative;width:100%;height:calc(100vh - 56px);min-height:560px;overflow:hidden;isolation:isolate;background:#111214;color:#f5f5f7}
.img-gen-stage::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 50% 47%,rgba(255,255,255,.055),transparent 34%),linear-gradient(180deg,#131416 0%,#101113 100%)}
.img-gen-stage::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:radial-gradient(circle at 50% 50%,transparent 28%,rgba(10,11,13,.16) 64%,rgba(10,11,13,.5) 100%)}
.img-gen-orbit{--orbit:clamp(205px,31vh,330px);position:absolute;left:50%;top:50%;width:0;height:0;z-index:1;perspective:1100px;transform-style:preserve-3d;animation:imgOrbitLoop 24s 4.1s linear infinite}
@keyframes imgOrbitLoop{to{transform:rotate(360deg)}}
.img-gen-arm{position:absolute;left:0;top:0;width:1px;height:1px;transform:rotate(var(--angle));transform-style:preserve-3d}
.img-gen-card{position:absolute;left:calc(var(--card-w) / -2);top:calc(var(--card-h) / -2);width:var(--card-w);height:var(--card-h);overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:clamp(15px,2vw,25px);background:linear-gradient(145deg,var(--shade-a),var(--shade-b));box-shadow:0 26px 72px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.08);opacity:0;transform:translateY(0) rotate(var(--counter)) rotate(var(--tilt)) scale(.22);transform-origin:center;animation:imgCardAssemble 4.6s var(--delay) cubic-bezier(.16,1,.3,1) forwards}
.img-gen-card::before{content:"";position:absolute;inset:-45%;background:linear-gradient(115deg,transparent 37%,rgba(255,255,255,.11) 49%,transparent 61%);transform:translateX(-46%) rotate(8deg);animation:imgCardSheen 2.8s calc(var(--delay) + 1.7s) ease-in-out infinite}
.img-gen-card::after{content:"";position:absolute;inset:12%;border:1px solid rgba(255,255,255,.055);border-radius:inherit}
@keyframes imgCardAssemble{
0%{opacity:0;transform:translateY(0) rotate(var(--counter)) rotate(0deg) scale(.18)}
18%{opacity:1;transform:translateY(0) rotate(var(--counter)) rotate(0deg) scale(.72)}
48%{opacity:1;transform:translateY(calc(var(--orbit) * -.55)) rotate(var(--counter)) rotate(var(--tilt)) scale(.9)}
100%{opacity:1;transform:translateY(calc(var(--orbit) * -1)) rotate(var(--counter)) rotate(var(--tilt)) scale(1)}
}
@keyframes imgCardSheen{0%,24%{transform:translateX(-48%) rotate(8deg)}72%,100%{transform:translateX(48%) rotate(8deg)}}
.img-gen-center{position:absolute;left:50%;top:50%;z-index:3;width:min(610px,72vw);transform:translate(-50%,-50%);text-align:center;pointer-events:none}
.img-gen-kicker{margin:0 0 15px;color:rgba(255,255,255,.48);font:700 10px/1 Inter;letter-spacing:.2em;text-transform:uppercase}
.img-gen-message{min-height:2.1em;margin:0;color:#f7f7f8;font:760 clamp(38px,5.8vw,76px)/.98 Inter;letter-spacing:-.06em;text-wrap:balance;text-shadow:0 12px 45px rgba(0,0,0,.54)}
.img-gen-prompt{max-width:470px;margin:18px auto 0;color:rgba(255,255,255,.45);font:500 12px/1.5 Inter;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.img-gen-progress{position:absolute;left:50%;bottom:30px;z-index:5;width:min(280px,52vw);height:2px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.1);transform:translateX(-50%)}
.img-gen-progress i{display:block;width:42%;height:100%;border-radius:inherit;background:rgba(255,255,255,.7);animation:imgProgress 2.4s ease-in-out infinite}
@keyframes imgProgress{0%{transform:translateX(-110%)}50%{transform:translateX(115%)}100%{transform:translateX(355%)}}
.img-results-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:clamp(210px,25vh,290px) 2px 12px}
.img-results-head h2{margin:0;color:var(--sf-ink);font:680 14px Inter}
.img-results-head span{color:var(--sf-dim);font:550 11.5px Inter}
.img-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.img-result{position:relative;aspect-ratio:1/1;overflow:hidden;border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);box-shadow:none}
.img-result-media{position:relative;width:100%;height:100%;aspect-ratio:1/1;overflow:hidden;background:var(--sf-hover)}
.img-result-media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s cubic-bezier(.22,1,.36,1)}
.img-result:hover .img-result-media img{transform:scale(1.018)}
.img-result-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px}
.img-result-meta span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-sub);font:600 11px Inter}
.img-result-meta a{color:var(--sf-ink);font:650 11px Inter;text-decoration:none}
.img-pref-conversation{display:flex;flex-direction:column;gap:18px}
.img-pref-conversation .turn{animation:imgPrefTurnIn .28s cubic-bezier(.22,1,.36,1)}
@keyframes imgPrefTurnIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.img-pref-conversation .turn.me .bub{background:var(--sf-hover);color:var(--sf-ink)}
.img-pref-conversation .turn.me.img-pref-answer .bub{border:1px solid rgba(53,144,245,.34);background:rgba(53,144,245,.13);color:#7db8ff}
html[data-theme="light"] .img-pref-conversation .turn.me.img-pref-answer .bub{color:#256fc9;background:rgba(53,144,245,.09)}
.img-pref-question{max-width:100%}
.img-pref-question h2{margin:0;color:var(--sf-ink);font:690 18px/1.3 Inter;letter-spacing:-.02em}
.img-pref-question p{margin:7px 0 0;color:var(--sf-sub);font:450 13px/1.55 Inter}
.img-pref-question .chips{margin-top:14px}
.img-pref-question .chip{border-color:var(--sf-border);background:var(--sf-surface);color:var(--sf-ink)}
.img-pref-question .chip:hover,.img-pref-question .chip:focus-visible{border-color:#3590F5;background:rgba(53,144,245,.1);color:#7db8ff;outline:none}
.img-pref-question .chip.on{border-color:#3590F5;background:rgba(53,144,245,.16);color:#7db8ff}
.img-pref-question .chip.on .chip-k{background:rgba(53,144,245,.28);color:#7db8ff}
.img-pref-progress{margin-top:8px;color:var(--sf-dim);font:600 10.5px/1 Inter;letter-spacing:.04em}
@media(max-width:760px){
body.shopify[data-view="images"].images-composer-docked .img-content-composer-slot>.composer{left:0!important;right:0!important;bottom:10px!important;padding:0 12px!important}
.img-content-intro{padding:76px 14px 0;gap:22px}
.img-create{min-height:calc(100vh - 56px)}.img-create.has-results{padding:20px 14px 110px}
.img-create.has-conversation{padding:24px 14px 126px}
.img-create-copy{left:18px;right:18px;bottom:calc(50% - 22px)}
.img-content-wordmark{font-size:24px}
.img-create.has-conversation .img-content-wordmark{font-size:28px}
.img-results{grid-template-columns:1fr}
.img-gen-stage{min-height:500px}
.img-gen-orbit{--orbit:clamp(155px,25vh,220px)}
.img-gen-message{font-size:clamp(34px,11vw,48px)}
.img-gen-prompt{max-width:72vw}
}
@media(max-width:480px){
body.shopify[data-view="images"] .composer .fast{font-size:0;gap:0;padding:0 2px}
body.shopify[data-view="images"] .composer .ph-chime,
body.shopify[data-view="images"] .composer .caret{display:none!important}
body.shopify[data-view="images"] .composer #inp::placeholder{color:rgba(255,255,255,.55)}
html[data-theme="light"] body.shopify[data-view="images"] .composer #inp::placeholder{color:rgba(0,0,0,.42)}
body.shopify[data-view="images"] .composer #inp{caret-color:#3590F5}
.img-library-demo{padding:clamp(150px,24vh,220px) 14px 64px}
.img-library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.img-library-card{border-radius:14px}
}
@media(prefers-reduced-motion:reduce){
.img-gen-orbit,.img-gen-card,.img-gen-card::before,.img-gen-progress i{animation:none}
.img-gen-card{opacity:1;transform:translateY(calc(var(--orbit) * -1)) rotate(var(--counter)) rotate(var(--tilt))}
}
/* Tasks workspace — compact, list-first, and shared with Agent + Calendar. */
body.shopify[data-view="tasks"] .sf-page{max-width:none;padding:0 0 64px}
.tw{min-height:calc(100vh - 64px);background:var(--sf-surface);color:var(--sf-ink)}
.tw-top{height:58px;display:flex;align-items:center;gap:12px;padding:0 18px;border-bottom:1px solid var(--sf-border-2)}
.tw-title{display:flex;align-items:center;gap:9px;min-width:0;font:650 14px Inter}.tw-title svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}
.tw-top-actions{margin-left:auto;display:flex;align-items:center;gap:7px}
.tw-iconbtn,.tw-new{height:32px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);font:600 12px Inter;cursor:pointer}
.tw-iconbtn{width:32px;display:grid;place-items:center;padding:0}.tw-iconbtn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8}.tw-iconbtn:hover,.tw-new:hover{background:var(--sf-hover)}.tw-iconbtn.on{background:var(--sf-sel)}
.tw-new{padding:0 12px;background:var(--sf-ink);color:var(--sf-surface);border-color:var(--sf-ink)}.tw-new:hover{opacity:.88;background:var(--sf-ink)}
.tw-toolbar{min-height:54px;display:flex;align-items:center;gap:7px;padding:9px 18px;border-bottom:1px solid var(--sf-border-2)}
.tw-tab{height:32px;padding:0 12px;border:1px solid transparent;border-radius:9px;background:none;color:var(--sf-sub);font:580 12.5px Inter;cursor:pointer}.tw-tab:hover{background:var(--sf-hover);color:var(--sf-ink)}.tw-tab.on{background:var(--sf-sel);color:var(--sf-ink);font-weight:650}
.tw-search{margin-left:auto;width:min(260px,32vw);height:32px;display:flex;align-items:center;gap:7px;padding:0 10px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface)}.tw-search svg{width:14px;height:14px;flex:none;fill:none;stroke:var(--sf-dim);stroke-width:2}.tw-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--sf-ink);font:500 12.5px Inter}
.tw-list{padding:0 14px 32px}.tw-group{margin-top:10px}.tw-group[hidden]{display:none}.tw-grouphead{width:100%;height:38px;display:flex;align-items:center;gap:9px;padding:0 11px;border:0;border-radius:8px;background:var(--sf-hover);color:var(--sf-ink);font:620 12.5px Inter;text-align:left;cursor:pointer}
.tw-caret{width:10px;color:var(--sf-dim);font-size:10px}.tw-status{width:14px;height:14px;border:1.7px solid currentColor;border-radius:50%;display:inline-grid;place-items:center;flex:none;color:#a8adb3}.tw-status.doing{color:#e5a900;border-left-color:transparent}.tw-status.review{color:#28b463}.tw-status.review:after{content:'';width:5px;height:5px;border-radius:50%;background:currentColor}.tw-status.done{color:#6375db;background:currentColor}.tw-status.done:after{content:'✓';color:#fff;font:700 9px Inter}.tw-status.canceled{color:#9aa3ad}.tw-status.canceled:after{content:'×';font:700 11px Inter}
.tw-count{color:var(--sf-dim);font-weight:560}.tw-groupadd{margin-left:auto;color:var(--sf-dim);font-size:18px;font-weight:400}.tw-rows{overflow:hidden}.tw-group.closed .tw-rows{display:none}.tw-group.closed .tw-caret{transform:rotate(-90deg)}
.tw-row{min-height:46px;display:grid;grid-template-columns:18px 68px minmax(220px,1fr) minmax(90px,auto) minmax(90px,auto) 30px 78px;align-items:center;gap:8px;padding:0 11px;border:0;border-bottom:1px solid var(--sf-border-2);background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}.tw-row:hover,.tw-row.selected{background:var(--sf-hover)}
.tw-code{color:var(--sf-dim);font:540 12px Inter;white-space:nowrap}.tw-rowtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:560 13px Inter}.tw-chip{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:4px 8px;border:1px solid var(--sf-border);border-radius:999px;color:var(--sf-sub);font:530 11.5px Inter}.tw-chip:empty{visibility:hidden}.tw-avatar{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--sf-sel);color:var(--sf-sub);font:650 8.5px Inter}.tw-due{color:var(--sf-dim);font:520 11.5px Inter;text-align:right}.tw-empty{padding:72px 20px;text-align:center;color:var(--sf-sub);font-size:13px}.tw-empty b{display:block;margin-bottom:5px;color:var(--sf-ink);font-size:14px}
.tw-drawer{position:fixed;z-index:305;top:0;right:0;width:min(430px,92vw);height:100vh;display:flex;flex-direction:column;background:var(--sf-surface);border-left:1px solid var(--sf-border);box-shadow:-18px 0 48px rgba(0,0,0,.09);animation:twSlide .18s cubic-bezier(.22,1,.36,1)}@keyframes twSlide{from{transform:translateX(20px);opacity:0}to{transform:none;opacity:1}}
.tw-drawerhead{height:54px;display:flex;align-items:center;gap:8px;padding:0 16px;border-bottom:1px solid var(--sf-border-2)}.tw-drawerhead .tw-code{flex:1}.tw-close{width:30px;height:30px;border:0;border-radius:8px;background:none;color:var(--sf-sub);font-size:20px;cursor:pointer}.tw-close:hover{background:var(--sf-hover)}
.tw-form{flex:1;overflow:auto;padding:20px}.tw-form input,.tw-form textarea,.tw-form select{box-sizing:border-box;width:100%;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);outline:0;font:500 13px Inter}.tw-form input:focus,.tw-form textarea:focus,.tw-form select:focus{border-color:var(--sf-sub)}.tw-form .tw-titleinput{border:0;padding:0 0 10px;border-radius:0;font:670 20px/1.3 Inter;letter-spacing:-.02em}.tw-form textarea{min-height:118px;padding:10px 11px;resize:vertical;line-height:1.5}
.tw-formgrid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:20px 0}.tw-field label{display:block;margin:0 0 6px;color:var(--sf-dim);font:600 10.5px Inter}.tw-field input,.tw-field select{height:36px;padding:0 9px}.tw-wide{grid-column:1/-1}.tw-formfoot{display:flex;align-items:center;gap:8px;padding:13px 16px;border-top:1px solid var(--sf-border-2)}.tw-delete{border:0;background:none;color:#d7423a;font:600 12px Inter;cursor:pointer}.tw-save{height:34px;margin-left:auto;padding:0 14px;border:0;border-radius:9px;background:var(--sf-ink);color:var(--sf-surface);font:650 12px Inter;cursor:pointer}.tw-save:disabled{opacity:.5}
@media(max-width:920px){.tw-row{grid-template-columns:18px 62px minmax(150px,1fr) 30px 68px}.tw-row .tw-chip{display:none}}@media(max-width:620px){.tw-toolbar{flex-wrap:wrap}.tw-search{order:2;width:100%;margin:0}.tw-row{grid-template-columns:18px 54px minmax(100px,1fr) 24px}.tw-due{display:none}.tw-formgrid{grid-template-columns:1fr}}
/* journey stepper */
.tk-journey{display:flex;align-items:flex-start;gap:0;overflow-x:auto;padding:24px 10px 10px;margin:0}
.tk-step{flex:1;min-width:96px;text-align:center;position:relative;padding-top:40px}
.tk-step:before{content:'';position:absolute;top:9px;left:calc(-50% + 9px);right:calc(50% + 9px);height:2px;border-radius:2px;background:var(--sf-border)}
.tk-step:first-child:before{display:none}
/* completed connector = the WebGL chart's blue, bent onto the track (gradient #009AFF→#00DCFF + additive bloom, flowing) */
.tk-step.done:before,.tk-step.active:before{
background:linear-gradient(90deg,#0090F5 0%,#00C2FF 50%,#0090F5 100%);background-size:200% 100%;
box-shadow:0 0 4px rgba(0,160,255,.85),0 0 10px rgba(0,150,255,.45),0 0 18px rgba(0,140,255,.25);
animation:tkFlow 2.6s linear infinite}
@keyframes tkFlow{0%{background-position:200% 0}100%{background-position:0 0}}
.tk-dot{position:absolute;top:0;left:50%;transform:translateX(-50%);width:18px;height:18px;border-radius:50%;background:var(--sf-surface);border:2px solid var(--sf-border);display:flex;align-items:center;justify-content:center}
.tk-step.done .tk-dot{background:#00A6F5;border-color:#00A6F5;box-shadow:0 0 0 3px rgba(0,150,245,.16),0 0 9px 2px rgba(0,150,245,.45)}
.tk-step.done .tk-dot:after{content:'';width:6px;height:6px;border-radius:50%;background:#fff}
.tk-step.active .tk-dot{border-color:#00A6F5;background:var(--sf-surface);animation:tkPulse 1.8s ease-in-out infinite}
.tk-step.active .tk-dot:after{content:'';width:7px;height:7px;border-radius:50%;background:#00A6F5;box-shadow:0 0 6px rgba(0,150,245,.85)}
@keyframes tkPulse{0%,100%{box-shadow:0 0 0 4px rgba(0,150,245,.15),0 0 11px 3px rgba(0,140,245,.4)}50%{box-shadow:0 0 0 6px rgba(0,150,245,.10),0 0 18px 7px rgba(0,135,235,.6)}}
.tk-step .tl{font-size:12.5px;font-weight:600;color:var(--sf-ink)}
.tk-step .ts{font-size:11px;color:var(--sf-dim);margin-top:2px}
.tk-step:not(.done):not(.active) .tl{color:var(--sf-dim);font-weight:550}
/* services horizontal scroller */
.tk-scroller{display:flex;gap:13px;overflow-x:auto;padding:2px 2px 12px;scroll-snap-type:x proximity}
.tk-scroller::-webkit-scrollbar{height:8px}.tk-scroller::-webkit-scrollbar-thumb{background:#dadada;border-radius:99px}
.tk-svc{flex:none;width:238px;scroll-snap-align:start;border:1px solid var(--sf-border);border-radius:var(--sf-radius);background:var(--sf-surface);padding:14px;box-shadow:0 1px 0 rgba(0,0,0,.03)}
.tk-svc .sh{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:11px}
.tk-svc .sh .nm{font-weight:650;font-size:13.5px}
.tk-svc dl{display:grid;grid-template-columns:auto 1fr;gap:7px 10px;margin:0}
.tk-svc dt{font-size:12px;color:var(--sf-sub)}
.tk-svc dd{font-size:12px;font-weight:600;color:var(--sf-ink);margin:0;text-align:right;font-variant-numeric:tabular-nums}
/* team avatars */
.tk-team{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tk-mem{display:flex;align-items:center;gap:9px;border:1px solid var(--sf-border);border-radius:99px;padding:5px 13px 5px 5px;background:var(--sf-surface)}
.tk-mem .sf-ava{width:28px;height:28px}
.tk-mem .nm{font-size:13px;font-weight:600;line-height:1.15}.tk-mem .rl{font-size:11.5px;color:var(--sf-dim)}
/* kanban board */
.tk-board{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:start}
@media(max-width:960px){.tk-board{grid-template-columns:repeat(2,1fr)}}
.tk-col{background:var(--sf-bg);border:1px solid var(--sf-border);border-radius:var(--sf-radius);padding:11px;min-height:120px;transition:background .12s,box-shadow .12s}
.tk-col.drop{background:#eef4ff;box-shadow:inset 0 0 0 1.5px #1c4cd1}
.tk-colh{display:flex;align-items:center;gap:8px;margin:2px 4px 11px}
.tk-colh .ci{width:9px;height:9px;border-radius:50%}
.tk-colh .ct{font-size:13px;font-weight:650}
.tk-colh .cc{margin-left:auto;font-size:12px;font-weight:600;color:var(--sf-dim);background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:99px;min-width:22px;text-align:center;padding:1px 6px}
.tk-card{background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:10px;padding:11px 12px;margin-bottom:9px;cursor:grab;box-shadow:0 1px 1px rgba(0,0,0,.04)}
.tk-card:last-child{margin-bottom:0}
.tk-card:hover{border-color:#cfcfcf}
.tk-card.drag{opacity:.45}
.tk-card .tt{font-size:13px;font-weight:600;line-height:1.35;margin-bottom:8px}
.tk-card .meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.tk-card .mc{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--sf-sub)}
.tk-card .mc svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8}
.tk-card .src{font-size:10.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:2px 6px;border-radius:5px}
.tk-card .src.client{background:#e7efff;color:#1c4cd1}.tk-card .src.agency{background:rgba(127,127,127,.16);color:#616161}
.tk-card .due.over{color:#8e1f0b;font-weight:600}
.tk-prio{width:7px;height:7px;border-radius:50%;flex:none}
.tk-prio.High{background:#d23b1f}.tk-prio.Medium{background:#e8902e}.tk-prio.Low{background:#9aa}
.tk-add{width:100%;border:1px dashed var(--sf-border);background:none;border-radius:10px;padding:8px;font:600 12.5px Inter;color:var(--sf-sub);cursor:pointer;margin-top:2px}
.tk-add:hover{border-color:var(--sf-sub);color:var(--sf-ink);background:var(--sf-surface)}
/* requests list */
.tk-req{display:flex;align-items:center;gap:12px;padding:11px 16px;border-bottom:1px solid var(--sf-border-2);cursor:pointer}
.tk-req:last-child{border-bottom:none}.tk-req:hover{background:var(--sf-hover)}
.tk-req .ri{width:30px;height:30px;border-radius:8px;background:#e7efff;color:#1c4cd1;display:flex;align-items:center;justify-content:center;flex:none}
.tk-req .ri svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9}
.tk-req .rt{flex:1;min-width:0}.tk-req .rt .nm{font-size:13.5px;font-weight:550}.tk-req .rt .sub{font-size:12px;color:var(--sf-dim)}
/* calendar */
.tk-cal-h{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.tk-cal-h h3{margin:0;font-size:16px;font-weight:700;min-width:170px}
.tk-nav{display:inline-flex;border:1px solid var(--sf-border);border-radius:10px;overflow:hidden}
.tk-nav button{width:32px;height:32px;border:none;background:var(--sf-surface);cursor:pointer;color:var(--sf-ink);font-size:15px}
.tk-nav button:hover{background:var(--sf-hover)}
.tk-nav button:first-child{border-right:1px solid var(--sf-border)}
.tk-cal{border:1px solid var(--sf-border);border-radius:var(--sf-radius);overflow:hidden;background:var(--sf-surface)}
.tk-cal .dow{display:grid;grid-template-columns:repeat(7,1fr);background:var(--sf-hover);border-bottom:1px solid var(--sf-border-2)}
.tk-cal .dow span{padding:8px 10px;font-size:11.5px;font-weight:650;color:var(--sf-sub);text-align:left}
.tk-grid{display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:1fr}
.tk-day{min-height:96px;border-right:1px solid var(--sf-border-2);border-bottom:1px solid var(--sf-border-2);padding:6px 7px;display:flex;flex-direction:column;gap:4px}
.tk-day:nth-child(7n){border-right:none}
.tk-day.out{background:var(--sf-bg)}
.tk-day .dn{font-size:12px;font-weight:600;color:var(--sf-sub);align-self:flex-start;width:22px;height:22px;display:flex;align-items:center;justify-content:center;border-radius:50%}
.tk-day.out .dn{color:var(--sf-dim)}
.tk-day.wk{background:#fffaf2}
.tk-day.today .dn{background:var(--acc);color:#fff}
.tk-ev{font-size:11px;font-weight:600;padding:3px 7px;border-radius:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;border-left:3px solid}
.tk-ev.todo{background:var(--sf-hover);color:#444;border-color:#9aa}
.tk-ev.doing{background:#fff2db;color:#7a4a00;border-color:#e8902e}
.tk-ev.review{background:#e7efff;color:#1c4cd1;border-color:#1c4cd1}
.tk-ev.done{background:#e3f7ea;color:#0a5132;border-color:#0a7a3c;text-decoration:line-through;opacity:.78}
.tk-more{font-size:10.5px;color:var(--sf-dim);font-weight:600;padding-left:3px}
/* agenda list */
.tk-agenda .ag-day{display:flex;gap:14px;padding:13px 16px;border-bottom:1px solid var(--sf-border-2)}
.tk-agenda .ag-day:last-child{border-bottom:none}
.tk-agenda .ag-d{width:54px;flex:none;text-align:center}
.tk-agenda .ag-d .wd{font-size:11px;font-weight:650;color:var(--sf-sub);text-transform:uppercase}
.tk-agenda .ag-d .dd{font-size:21px;font-weight:700;line-height:1.1}
.tk-agenda .ag-d.today .dd{color:var(--acc)}
.tk-agenda .ag-list{flex:1;display:flex;flex-direction:column;gap:7px}
.tk-agenda .ag-row{display:flex;align-items:center;gap:9px}
.tk-agenda .ag-row .at{font-size:13px;font-weight:550;flex:1}
.tk-agenda .ag-empty{color:var(--sf-dim);font-size:13px;padding:30px 16px;text-align:center}
/* task modal */
.tk-modal{position:fixed;inset:0;z-index:360;display:flex;align-items:flex-start;justify-content:center;padding:64px 16px;background:rgba(0,0,0,.34)}
.tk-modal[hidden]{display:none}
.tk-modal .mbox{width:min(94vw,520px);background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:16px;box-shadow:0 28px 80px rgba(0,0,0,.34);overflow:hidden;animation:cmdkIn .16s cubic-bezier(.22,1,.36,1)}
.tk-modal .mh{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--sf-border-2)}
.tk-modal .mh h3{margin:0;font-size:15px;font-weight:650}
.tk-modal .mb{padding:16px 18px;max-height:64vh;overflow-y:auto}
.tk-modal .mf{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 18px;border-top:1px solid var(--sf-border-2)}
/* ===== Settings modal — centered solid surface over a simple dimmed backdrop ===== */
.sf-set{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:24px;
background:rgba(0,0,0,.72);backdrop-filter:none;-webkit-backdrop-filter:none;
animation:gatefade .18s ease}
.sf-set[hidden]{display:none}
.sf-set-card{width:min(96vw,1180px);height:min(90vh,760px);display:flex;background:#fff;
border:1px solid var(--sf-border);border-radius:18px;box-shadow:0 40px 120px rgba(0,0,0,.5);overflow:hidden;
animation:cmdkIn .2s cubic-bezier(.22,1,.36,1)}
.sf-set-nav{width:260px;flex:none;border-right:1px solid var(--sf-border-2);padding:18px 12px;display:flex;flex-direction:column;gap:2px;background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;overflow-y:auto}
.sf-set-nav .sn-h{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--sf-dim);padding:4px 10px 9px}
.sf-set-nav button{display:flex;align-items:center;gap:11px;width:100%;border:none;background:none;text-align:left;
padding:9px 11px;border-radius:10px;font:550 13.5px Inter;color:var(--sf-ink);cursor:pointer}
.sf-set-nav button svg{width:17px;height:17px;flex:none;opacity:.8;stroke-width:1.8;fill:none;stroke:currentColor}
.sf-set-nav button:hover{background:var(--sf-hover)}
.sf-set-nav button.on{background:var(--sf-sel);box-shadow:0 1px 2px rgba(0,0,0,.08);font-weight:650}
.sf-set-subnav{display:none;position:relative;flex-direction:column;gap:1px;margin:2px 0 8px 26px;padding:3px 0 3px 12px;border-left:1px solid var(--sf-border-2)}
.sf-set.documents-open .sf-set-subnav{display:flex}
.sf-set-nav .sf-set-subnav button{padding:7px 9px;border-radius:8px;font:560 12.5px Inter;color:var(--sf-sub);gap:0;box-shadow:none}
.sf-set-nav .sf-set-subnav button:hover{background:transparent;color:var(--sf-ink)}
.sf-set-nav .sf-set-subnav button.on{background:transparent;color:var(--sf-ink);font-weight:680;box-shadow:none}
.sf-set-subthumb{position:absolute;left:-1px;top:0;width:1px;height:30px;background:var(--sf-ink);pointer-events:none;will-change:transform;z-index:1}
.sf-set-subthumb[hidden]{display:none}
.sf-set-nav .sn-sp{flex:1;min-height:8px}
.sf-set-nav .sn-logout{color:var(--sf-ink);margin-top:12px;padding-top:15px;border-top:1px solid var(--sf-border-2);border-radius:0}
.sf-set-nav .sn-logout:hover{background:transparent;color:var(--sf-ink)}
.sf-set-nav .sn-logout svg{width:18px;height:18px;opacity:1;fill:currentColor;stroke:none}
.sf-set-main{position:relative;isolation:isolate;overflow:hidden;flex:1;min-width:0;display:flex;flex-direction:column;background:var(--sf-surface)}
.sf-set.voice-open{--voice-tint:31,94,255;--voice-tint2:55,190,255;--voice-tint3:190,230,255}
.sf-set.voice-open .sf-set-main{background:#050711}
/* CleanMyMac-inspired color environment: one opaque, saturated field with a
broad halo behind the active object and a deep edge falloff. The selected
voice supplies the palette, so each voice gets its own blue, teal, amber,
green, coral, or violet atmosphere without exposing the black modal base. */
.sf-set.voice-open .sf-set-main:before{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background:radial-gradient(ellipse 64% 82% at 50% 48%,rgba(var(--voice-tint2),.72) 0,rgba(var(--voice-tint2),.23) 39%,transparent 70%),radial-gradient(ellipse 105% 125% at 0% 100%,rgba(var(--voice-tint),.62) 0,transparent 64%),linear-gradient(118deg,color-mix(in srgb,rgb(var(--voice-tint)) 56%,#070610) 0%,color-mix(in srgb,rgb(var(--voice-tint2)) 42%,#080712) 52%,color-mix(in srgb,rgb(var(--voice-tint)) 22%,#03040a) 100%);filter:saturate(1.12)}
.sf-set.voice-open .sf-set-top,.sf-set.voice-open .sf-set-body{position:relative;z-index:1;background:transparent}
.sf-set-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:20px 24px 15px;border-bottom:1px solid var(--sf-border-2)}
.sf-set-top h2{margin:0;font-size:17px;font-weight:700;letter-spacing:-.01em}
.sf-set-top p{margin:3px 0 0;font-size:13px;color:var(--sf-sub)}
.sf-set-x{width:30px;height:30px;flex:none;border:none;background:none;border-radius:8px;color:var(--sf-sub);cursor:pointer;display:flex;align-items:center;justify-content:center}
.sf-set-x:hover{background:transparent}
.sf-set-x svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;fill:none}
.sf-set-body{flex:1;overflow-y:auto;padding:20px 24px 28px}
.sf-set-body.voice-mode{padding:0;overflow:hidden}
.sf-voice-picker{--voice-tint:44,125,255;--voice-tint2:65,222,255;position:relative;height:100%;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;padding:22px 0 20px;box-sizing:border-box;overflow:hidden;background:transparent}
.sf-voice-stage{position:relative;min-height:390px;overflow:hidden;isolation:isolate}
.sf-voice-card{--voice-x:0px;--voice-scale:.62;--voice-opacity:.36;position:absolute;left:50%;top:47%;width:250px;transform:translate(calc(-50% + var(--voice-x)),-50%) scale(var(--voice-scale));opacity:var(--voice-opacity);transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .42s ease,filter .42s ease;display:grid;justify-items:center;gap:19px;cursor:pointer;filter:saturate(.72);z-index:1}
.sf-voice-card[data-pos="-2"]{--voice-x:-470px;--voice-scale:.48;--voice-opacity:.16}.sf-voice-card[data-pos="-1"]{--voice-x:-270px;--voice-scale:.72;--voice-opacity:.62}.sf-voice-card[data-pos="0"]{--voice-x:0px;--voice-scale:1.08;--voice-opacity:1;z-index:3;filter:saturate(1)}.sf-voice-card[data-pos="1"]{--voice-x:270px;--voice-scale:.72;--voice-opacity:.62}.sf-voice-card[data-pos="2"]{--voice-x:470px;--voice-scale:.48;--voice-opacity:.16}.sf-voice-card[data-pos="hidden"]{--voice-x:0px;--voice-scale:.35;--voice-opacity:0;pointer-events:none}
.sf-voice-orb{--voice-hue:0deg;--voice-tint:31,94,255;--voice-tint2:55,190,255;--voice-tint3:190,230,255;position:relative;width:214px;aspect-ratio:1;border:0;border-radius:50%;overflow:hidden;isolation:isolate;contain:paint;background:transparent;box-shadow:none}
.sf-voice-wave{position:absolute;z-index:0;inset:-12%;width:124%;height:124%;display:block;background:transparent;filter:blur(3px);transform:scale(1.18);opacity:.98;mix-blend-mode:normal;pointer-events:none}
/* Same SVG backdrop-refraction system as the chat composer, using the
circular displacement map. The refracting surface is deliberately 80%
larger than the clipped orb, keeping every rectangular filter boundary
outside the visible circle even at maximum distortion. */
.sf-voice-refraction{position:absolute;z-index:1;inset:-40%;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.001);backdrop-filter:var(--voice-orb-glass,blur(3px));-webkit-backdrop-filter:var(--voice-orb-glass,blur(3px));will-change:backdrop-filter}
.sf-voice-glass{position:absolute;z-index:2;inset:0;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse 42% 25% at 31% 17%,rgba(255,255,255,.22),rgba(255,255,255,.055) 42%,transparent 74%),radial-gradient(circle at 50% 50%,transparent 68%,rgba(255,255,255,.035) 88%,rgba(255,255,255,.07) 100%),rgba(255,255,255,.015);box-shadow:inset 0 0 4px rgba(255,255,255,.24),inset 0 1px 1px rgba(255,255,255,.3),0 0 0 1px rgba(255,255,255,.12),0 30px 76px -18px rgba(0,0,0,.46);backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-theme="light"] .sf-voice-glass{background:radial-gradient(ellipse 42% 25% at 31% 17%,rgba(255,255,255,.3),rgba(255,255,255,.07) 42%,transparent 74%),radial-gradient(circle at 50% 50%,transparent 70%,rgba(255,255,255,.07) 90%,rgba(255,255,255,.13) 100%),rgba(255,255,255,.025);box-shadow:inset 0 0 0 1px rgba(0,0,0,.065)}
.sf-voice-picker[data-tone="marin"],.sf-voice-card[data-tone="marin"],.sf-agent-voice[data-tone="marin"]{--voice-hue:0deg;--voice-tint:31,94,255;--voice-tint2:55,190,255;--voice-tint3:190,230,255}.sf-voice-picker[data-tone="cedar"],.sf-voice-card[data-tone="cedar"],.sf-agent-voice[data-tone="cedar"]{--voice-hue:106deg;--voice-tint:16,122,92;--voice-tint2:34,190,138;--voice-tint3:165,235,202}.sf-voice-picker[data-tone="coral"],.sf-voice-card[data-tone="coral"],.sf-agent-voice[data-tone="coral"]{--voice-hue:292deg;--voice-tint:255,64,105;--voice-tint2:255,112,126;--voice-tint3:255,183,150}.sf-voice-picker[data-tone="sage"],.sf-voice-card[data-tone="sage"],.sf-agent-voice[data-tone="sage"]{--voice-hue:151deg;--voice-tint:19,124,148;--voice-tint2:53,190,194;--voice-tint3:162,231,218}.sf-voice-picker[data-tone="verse"],.sf-voice-card[data-tone="verse"],.sf-agent-voice[data-tone="verse"]{--voice-hue:214deg;--voice-tint:255,104,28;--voice-tint2:255,167,35;--voice-tint3:255,221,112}.sf-voice-picker[data-tone="shimmer"],.sf-voice-card[data-tone="shimmer"],.sf-agent-voice[data-tone="shimmer"]{--voice-hue:42deg;--voice-tint:218,66,255;--voice-tint2:255,104,190;--voice-tint3:190,132,255}
.sf-voice-card .sf-voice-orb{border-radius:50%;transform:none;animation:none}
.sf-voice-select{position:absolute;left:50%;top:50%;z-index:3;width:52px;height:52px;display:grid;place-items:center;transform:translate(-50%,-50%);padding:0;border:1px solid rgba(255,255,255,.72);border-radius:50%;background:rgba(255,255,255,.88);color:#050505;box-shadow:inset 0 1px 0 #fff,0 5px 20px rgba(0,0,0,.18);backdrop-filter:blur(10px) saturate(1.35);-webkit-backdrop-filter:blur(10px) saturate(1.35);cursor:pointer;opacity:0;transition:opacity .22s ease,transform .22s ease}
.sf-voice-card[data-pos="0"] .sf-voice-select{opacity:1}.sf-voice-select:hover{transform:translate(-50%,-50%) scale(1.06)}.sf-voice-select svg{width:18px;height:18px;fill:currentColor}.sf-voice-select .pause{display:none}.sf-voice-card.is-previewing .sf-voice-select{background:transparent;color:#fff;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}.sf-voice-card.is-previewing .sf-voice-select .play{display:none}.sf-voice-card.is-previewing .sf-voice-select .pause{display:block;width:26px;height:26px}
.sf-voice-copy{text-align:center;min-height:82px}.sf-voice-copy b{display:block;color:var(--sf-ink);font-size:16px;font-weight:600;letter-spacing:-.01em}.sf-voice-copy span{display:block;width:238px;margin:7px auto 0;color:var(--sf-sub);font-size:12.5px;line-height:1.45}.sf-voice-copy em{display:block;width:252px;margin:6px auto 0;color:rgb(var(--voice-tint));font-size:10.5px;font-style:normal;line-height:1.35}.sf-voice-card:not([data-pos="0"]) .sf-voice-copy{opacity:.62}.sf-voice-card:not([data-pos="0"]) .sf-voice-copy em{display:none}
.sf-voice-foot{display:flex;align-items:center;justify-content:center;gap:16px;padding:0 24px}.sf-voice-arrow{width:38px;height:38px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent;color:#fff;cursor:pointer;transition:transform .18s ease,opacity .18s ease}.sf-voice-arrow:hover{background:transparent;color:#fff;transform:scale(1.12)}.sf-voice-arrow svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}.sf-voice-status{min-width:210px;text-align:center;color:var(--sf-sub);font-size:12px}.sf-voice-status b{color:var(--sf-ink);font-weight:650}
.sf-agent-voice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.sf-agent-voice{--voice-hue:0deg;--voice-tint:44,125,255;--voice-tint2:65,222,255;display:flex;align-items:center;gap:9px;min-width:0;padding:8px;border:1px solid var(--sf-border);border-radius:12px;background:transparent;color:var(--sf-ink);cursor:pointer;text-align:left;transition:border-color .18s ease,background .18s ease,transform .18s ease}.sf-agent-voice:hover{background:var(--sf-hover);transform:translateY(-1px)}.sf-agent-voice.on{border-color:rgba(var(--voice-tint),.68);background:rgba(var(--voice-tint),.08);box-shadow:inset 0 0 0 1px rgba(var(--voice-tint),.12)}.sf-agent-voice-orb{position:relative;width:38px;height:38px;flex:none;overflow:hidden;border:0;border-radius:50%;background:transparent;box-shadow:none}.sf-agent-voice-orb .sf-voice-wave{inset:-25%;width:150%;height:150%;transform:scale(1.3)}.sf-agent-voice-copy{min-width:0}.sf-agent-voice-copy b{display:block;overflow:hidden;text-overflow:ellipsis;font-size:12.5px;white-space:nowrap}.sf-agent-voice-copy span{display:block;margin-top:2px;color:var(--sf-sub);font-size:10.5px}.sf-agent-voice.on .sf-agent-voice-copy span{color:rgb(var(--voice-tint))}
@media(max-width:760px){.sf-voice-stage{min-height:360px}.sf-voice-card{top:45%}.sf-voice-card[data-pos="-1"]{--voice-x:-205px}.sf-voice-card[data-pos="1"]{--voice-x:205px}.sf-voice-orb{width:184px}.sf-voice-copy span{width:210px}.sf-agent-voice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.sf-voice-card,.sf-voice-orb{transition:none;animation:none!important}}
.sf-set-h3{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--sf-dim);margin:22px 0 8px}
.sf-set-h3:first-child{margin-top:0}
.sf-set-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 0;border-top:1px solid var(--sf-border-2)}
.sf-set-row.top{border-top:none;padding-top:2px}
.sf-set-row .rl{min-width:0}
.sf-set-row .rl .t{font-size:13.5px;font-weight:600}
.sf-set-row .rl .s{font-size:12.5px;color:var(--sf-sub);margin-top:2px;line-height:1.45}
/* Settings-owned user access: people, pending invitations, and reusable roles.
The full-page access editors remain available, but the primary entry lives here. */
.sf-set.team-open:not(.access-focus) .sf-set-top{padding:23px 28px 18px}
.sf-set.team-open:not(.access-focus) .sf-set-top h2{font-size:19px}
.sf-set.team-open:not(.access-focus) .sf-set-top p{margin-top:5px;font-size:13.5px}
.sf-set.team-open:not(.access-focus) .sf-set-body{padding:22px 28px 32px}
.sf-access-tabs{display:flex;gap:26px;padding:0 2px 14px;border-bottom:1px solid var(--sf-border-2)}
.sf-access-tab{position:relative;height:36px;padding:0;border:0;border-radius:0;background:transparent;color:var(--sf-sub);font:650 13px Inter;cursor:pointer;white-space:nowrap}
.sf-access-tab:hover{background:transparent;color:var(--sf-ink)}
.sf-access-tab.on{background:transparent;color:var(--sf-ink)}
.sf-access-tab.on:after{content:"";position:absolute;left:0;right:0;bottom:-15px;height:2px;border-radius:999px;background:var(--sf-ink)}
.sf-access-toolbar{display:flex;align-items:center;gap:12px;margin:18px 0 14px}
.sf-access-search{position:relative;display:flex;align-items:center;flex:1;min-width:160px}
.sf-access-search svg{position:absolute;left:14px;width:17px;height:17px;fill:none;stroke:var(--sf-dim);stroke-width:1.8;pointer-events:none}
.sf-access-search input{box-sizing:border-box;width:100%;height:44px;padding:0 14px 0 43px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);color:var(--sf-ink);outline:none;font:500 13.5px Inter}
.sf-access-search input:focus{border-color:var(--sf-dim)}
.sf-access-list{border-top:1px solid var(--sf-border-2)}
.sf-access-row{display:grid;grid-template-columns:minmax(0,1fr) 142px 94px auto;align-items:center;gap:18px;min-height:76px;border-bottom:1px solid var(--sf-border-2)}
.sf-access-row[hidden]{display:none}
.sf-access-person{display:flex;align-items:center;gap:13px;min-width:0}
.sf-access-avatar{width:40px;height:40px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--sf-sel);color:var(--sf-ink);font-size:12px;font-weight:750}
.sf-access-avatar img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.sf-access-copy{min-width:0}.sf-access-copy b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.sf-access-copy span{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-sub);font-size:12.5px}
.sf-access-role{color:var(--sf-sub);font-size:13px}.sf-access-state{font-size:12.5px;font-weight:650}.sf-access-state.active{color:#16824a}.sf-access-state.invited{color:#9a6a09}.sf-access-state.expired{color:#bd2f3c}.sf-access-state.disabled{color:var(--sf-dim)}
.sf-access-row .sf-btn{width:88px;height:38px;justify-self:end;justify-content:center;border-radius:10px}
.sf-access-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:max-content}
.sf-access-row-actions .sf-btn{width:auto;min-width:74px;padding:0 12px}
.sf-access-row-actions .danger{color:#bd2f3c}
.sf-access-empty{padding:54px 22px;text-align:center;color:var(--sf-sub)}.sf-access-empty b{display:block;margin-bottom:6px;color:var(--sf-ink);font-size:14px}.sf-access-empty span{font-size:12.5px}
.sf-access-role-row{display:grid;grid-template-columns:minmax(0,1fr) 90px auto;align-items:center;gap:14px;min-height:70px;border-bottom:1px solid var(--sf-border-2)}
.sf-access-role-row:first-child{border-top:1px solid var(--sf-border-2)}
.sf-access-role-row b{display:block;font-size:13.5px}.sf-access-role-row p{margin:3px 0 0;color:var(--sf-sub);font-size:12px;line-height:1.4}.sf-access-count{color:var(--sf-sub);font-size:12px;text-align:right}
.sf-set-back{display:none;width:34px;height:34px;flex:none;margin:-3px 2px 0 0;border:0;border-radius:9px;background:transparent;color:var(--sf-ink);cursor:pointer;align-items:center;justify-content:center}
.sf-set-back:hover{background:var(--sf-hover)}.sf-set-back svg{width:20px;height:20px;fill:currentColor}
.sf-set.access-focus .sf-set-card{display:block;position:relative}
.sf-set.access-focus .sf-set-nav{display:none}
.sf-set.access-focus .sf-set-main{height:100%;background:var(--sf-surface)}
.sf-set.access-focus .sf-set-top{align-items:center;padding:18px 26px 16px}
.sf-set.access-focus .sf-set-back{display:flex}
.sf-set.access-focus .sf-set-top>div{flex:1;min-width:0}
.sf-set.access-focus .sf-set-top h2{font-size:18px}
.sf-set.access-focus .sf-set-top p{font-size:13px}
.sf-set.access-focus .sf-set-body{min-height:0;padding:0;overflow:hidden}
.sf-access-detail{height:100%;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto}
.sf-access-detail-main{width:min(100%,1040px);box-sizing:border-box;margin:0 auto;padding:24px 32px 40px;overflow-y:auto}
.sf-access-identity{display:flex;align-items:center;gap:15px;padding:2px 2px 22px;border-bottom:1px solid var(--sf-border-2)}
.sf-access-identity .sf-access-avatar{width:52px;height:52px;font-size:14px;background:var(--sf-sel)}
.sf-access-identity b{display:block;font-size:17px;letter-spacing:-.01em}.sf-access-identity span{display:block;margin-top:5px;color:var(--sf-sub);font-size:13px}
.sf-access-lock{margin-left:auto;padding:6px 9px;border:1px solid var(--sf-border);border-radius:999px;color:var(--sf-sub);font-size:11px;font-weight:650}
.sf-access-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
.sf-access-section{border:1px solid var(--sf-border);border-radius:14px;padding:20px;background:var(--sf-surface)}
.sf-access-section.full{grid-column:1/-1}.sf-access-section h3{margin:0 0 5px;font-size:14.5px}.sf-access-section>p{margin:0 0 16px;color:var(--sf-sub);font-size:12.5px;line-height:1.5}
.sf-access-field{display:block;margin-top:13px}.sf-access-field:first-of-type{margin-top:0}.sf-access-field>span{display:block;margin-bottom:6px;color:var(--sf-sub);font-size:11.5px;font-weight:650}
.sf-access-control{box-sizing:border-box;width:100%;height:42px;padding:0 12px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:550 13px Inter;outline:none}
textarea.sf-access-control{height:88px;padding:10px 11px;resize:vertical;line-height:1.45}.sf-access-control:focus{border-color:var(--sf-dim)}.sf-access-control:disabled{opacity:.58;cursor:not-allowed;background:var(--sf-hover)}
.sf-access-inline{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px}.sf-access-inline b{display:block;font-size:12.5px}.sf-access-inline small{display:block;margin-top:3px;color:var(--sf-sub);font-size:11.5px;line-height:1.35}
.sf-access-scopes{display:grid;grid-template-columns:1fr 1fr;gap:14px}.sf-access-scope{border:1px solid var(--sf-border-2);border-radius:11px;padding:14px}.sf-access-scope h4{margin:0 0 10px;font-size:12.5px}.sf-access-check{display:flex;align-items:center;gap:8px;min-height:30px;color:var(--sf-sub);font-size:12.5px;cursor:pointer}.sf-access-check input{accent-color:var(--sf-ink)}
.sf-access-detail-actions{position:static;z-index:2;display:flex;align-items:center;gap:10px;padding:14px max(32px,calc((100% - 976px)/2));border-top:1px solid var(--sf-border-2);background:var(--sf-surface)}
.sf-access-detail-actions .sf-btn{min-width:94px;height:40px;justify-content:center;border-radius:10px}
.sf-access-detail-actions .spacer{flex:1}.sf-access-detail-actions .danger{color:#bd2f3c}
.sf-access-danger-note{margin-top:10px;color:#bd2f3c;font-size:11.5px;line-height:1.4}
.sf-access-flow{height:100%;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto}
.sf-access-flow-main{width:min(100%,900px);box-sizing:border-box;margin:0 auto;padding:28px 32px 42px;overflow-y:auto}
.sf-access-flow-head{margin-bottom:22px}.sf-access-flow-head h3{margin:0;font-size:18px;letter-spacing:-.01em}.sf-access-flow-head p{margin:7px 0 0;color:var(--sf-sub);font-size:13px;line-height:1.5}
.sf-access-step{display:flex;gap:7px;margin-bottom:22px}.sf-access-step span{height:3px;flex:1;border-radius:999px;background:var(--sf-border)}.sf-access-step span.on{background:var(--sf-ink)}
.sf-access-choice{display:flex;align-items:center;gap:13px;width:100%;box-sizing:border-box;margin-top:10px;padding:15px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);color:var(--sf-ink);text-align:left;cursor:pointer}
.sf-access-choice:hover,.sf-access-choice.on{border-color:var(--sf-dim);background:var(--sf-hover)}.sf-access-choice b{display:block;font-size:13.5px}.sf-access-choice small{display:block;margin-top:4px;color:var(--sf-sub);font-size:12px;line-height:1.4}
.sf-access-choice-mark{width:18px;height:18px;flex:none;border:1px solid var(--sf-border);border-radius:50%;display:flex;align-items:center;justify-content:center}.sf-access-choice.on .sf-access-choice-mark:after{content:"";width:10px;height:10px;border-radius:50%;background:var(--sf-ink)}
.sf-access-review{border:1px solid var(--sf-border);border-radius:14px;overflow:hidden}.sf-access-review-row{display:flex;justify-content:space-between;gap:24px;padding:14px 16px;border-bottom:1px solid var(--sf-border-2);font-size:12.5px}.sf-access-review-row:last-child{border-bottom:0}.sf-access-review-row span{color:var(--sf-sub)}.sf-access-review-row b{text-align:right}
.sf-access-role-list{border-top:1px solid var(--sf-border-2)}.sf-access-role-manage{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:16px;min-height:72px;padding:0 8px 0 0;border:0;border-bottom:1px solid var(--sf-border-2);background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}.sf-access-role-manage:hover{background:var(--sf-hover)}.sf-access-role-manage:focus-visible{position:relative;z-index:1;outline:2px solid var(--sf-ink);outline-offset:-2px}
.sf-access-role-manage b{display:block;font-size:13.5px}.sf-access-role-manage small{display:block;margin-top:4px;color:var(--sf-sub);font-size:12px}.sf-access-role-manage em{font-style:normal;color:var(--sf-sub);font-size:12px}.sf-access-role-open-icon{width:32px;height:32px;display:grid;place-items:center;border:1px solid transparent;border-radius:10px;color:var(--sf-sub);transition:background .16s ease,border-color .16s ease,color .16s ease}.sf-access-role-open-icon svg{width:17px;height:17px;fill:none;transition:transform .16s ease}.sf-access-role-manage:hover .sf-access-role-open-icon{border-color:var(--sf-border);background:var(--sf-surface);color:var(--sf-ink)}.sf-access-role-manage:hover .sf-access-role-open-icon svg{transform:translateX(1px)}
.sf-access-permission-groups{display:grid;grid-template-columns:1fr 1fr;gap:14px}.sf-access-permission-group{border:1px solid var(--sf-border);border-radius:13px;overflow:hidden}.sf-access-permission-group h4{margin:0;padding:13px 15px;border-bottom:1px solid var(--sf-border-2);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--sf-sub)}.sf-access-permission-group .sf-access-check{padding:8px 14px;border-bottom:1px solid var(--sf-border-2)}.sf-access-permission-group .sf-access-check:last-child{border-bottom:0}.sf-access-check-copy b{display:block;color:var(--sf-ink);font-size:12.5px}.sf-access-check-copy small{display:block;margin-top:3px;color:var(--sf-sub);font-size:11.5px;line-height:1.35}
.sf-access-permission-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:15px}.sf-access-permission-head>div>p{margin:5px 0 0;color:var(--sf-sub);font-size:12.5px;line-height:1.5}.sf-access-permission-summary{display:flex;align-items:center;gap:10px;flex:none}.sf-access-permission-count{color:var(--sf-sub);font-size:11.5px;white-space:nowrap}.sf-access-reset{height:32px;padding:0 11px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);font:650 11.5px Inter;cursor:pointer}.sf-access-reset:hover{background:var(--sf-hover)}.sf-access-reset:disabled{opacity:.5;cursor:not-allowed}
html[data-theme="dark"] .sf-access-detail-actions{background:#0F0F0F}
@media(max-width:900px){.sf-access-detail-main{padding:22px 24px 34px}.sf-access-detail-grid{grid-template-columns:1fr}.sf-access-section.full{grid-column:auto}.sf-access-detail-actions{padding:12px 24px}}
@media(max-width:760px){.sf-set.access-focus .sf-set-top{padding:15px 14px}.sf-access-detail-main,.sf-access-flow-main{padding:20px 16px 30px}.sf-access-scopes,.sf-access-permission-groups{grid-template-columns:1fr}.sf-access-detail-actions{padding:12px 16px}}
@media(max-width:760px){.sf-access-tabs{overflow-x:auto}.sf-access-toolbar{align-items:stretch;flex-direction:column}.sf-access-row{grid-template-columns:minmax(0,1fr);gap:10px;padding:14px 0}.sf-access-role,.sf-access-state{display:none}.sf-access-row-actions{justify-content:flex-start;margin-left:53px}.sf-access-role-row{grid-template-columns:minmax(0,1fr) auto}.sf-access-count{display:none}}
/* Credit shop — compact account-style checkout using the same field language
as Usage & billing. */
.sf-credit-shop{position:fixed;inset:0;z-index:1900;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(0,0,0,.28);backdrop-filter:blur(6px) saturate(.9);-webkit-backdrop-filter:blur(6px) saturate(.9);animation:gatefade .18s ease}
.sf-credit-shop[hidden]{display:none}
.sf-credit-exhausted{position:fixed;z-index:1180;left:282px;right:22px;bottom:86px;display:grid;grid-template-columns:22px minmax(0,1fr) auto 26px;align-items:center;gap:13px;box-sizing:border-box;min-height:92px;padding:15px 15px 15px 18px;border:1px solid #e58f95;border-radius:18px;background:#f8e9ea;color:#171719;box-shadow:0 12px 32px rgba(61,16,20,.06);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.sf-credit-exhausted[hidden]{display:none}.sf-credit-exhausted-icon{align-self:start;margin-top:2px;color:#df2d3a}.sf-credit-exhausted-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sf-credit-exhausted-copy{min-width:0}.sf-credit-exhausted-copy b,.sf-credit-exhausted-copy span{display:block}.sf-credit-exhausted-copy b{font-size:13px;line-height:17px;font-weight:650}.sf-credit-exhausted-copy span{margin-top:3px;color:#747074;font-size:12.5px;line-height:17px;font-weight:450}.sf-credit-exhausted-actions{display:flex;align-items:center;gap:8px}.sf-credit-exhausted-actions button{height:34px;padding:0 14px;border:1px solid #d2c8ca;border-radius:999px;background:rgba(255,255,255,.42);color:#1f1d1f;font:540 12px/1 Inter,sans-serif;white-space:nowrap;cursor:pointer}.sf-credit-exhausted-actions button:hover{background:#fff}.sf-credit-exhausted-actions .primary{border-color:#1687f8;background:#1687f8;color:#fff}.sf-credit-exhausted-actions .primary:hover{background:#0678e8}.sf-credit-exhausted-close{width:26px;height:26px;display:grid;place-items:center;align-self:start;padding:0;border:0;border-radius:50%;background:rgba(0,0,0,.055);color:#767276;cursor:pointer}.sf-credit-exhausted-close:hover{background:rgba(0,0,0,.1);color:#222}.sf-credit-exhausted-close svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
body.sf-collapsed .sf-credit-exhausted{left:86px}body.shopify.has-rail .sf-credit-exhausted{right:282px}body:not(.shopify) .sf-credit-exhausted{right:282px;bottom:18px}body.shopify.agent-conversation-open[data-view="tm-agents"] .sf-credit-exhausted{left:270px;right:22px}body.shopify.agent-conversation-open.agent-drawer-open[data-view="tm-agents"] .sf-credit-exhausted{right:342px}body.shopify.agent-conversation-open.agent-screen-open[data-view="tm-agents"] .sf-credit-exhausted{right:362px}body.shopify.agent-overview-open[data-view="tm-agents"] .sf-credit-exhausted,body.shopify.agent-onboarding-open[data-view="tm-agents"] .sf-credit-exhausted,body.shopify[data-view="tm-agent-detail"] .sf-credit-exhausted,body.shopify[data-view="tasks"] .sf-credit-exhausted,body.shopify[data-view="board"] .sf-credit-exhausted,body.shopify[data-view="site-hub"] .sf-credit-exhausted{bottom:18px}body.shopify[data-view="tm-agent-detail"] .sf-credit-exhausted{left:22px}
html[data-theme="dark"] .sf-credit-exhausted{border-color:rgba(255,91,99,.55);background:#2b1d20;color:#fff;box-shadow:0 18px 42px rgba(0,0,0,.24)}html[data-theme="dark"] .sf-credit-exhausted-copy span{color:#b9adb0}html[data-theme="dark"] .sf-credit-exhausted-actions button{border-color:#5a4448;background:#38272a;color:#fff}html[data-theme="dark"] .sf-credit-exhausted-actions button:hover{background:#463034}html[data-theme="dark"] .sf-credit-exhausted-actions .primary{border-color:#1687f8;background:#1687f8}html[data-theme="dark"] .sf-credit-exhausted-close{background:rgba(255,255,255,.08);color:#c9bfc1}
@media(max-width:820px){.sf-credit-exhausted,body.sf-collapsed .sf-credit-exhausted,body.shopify.has-rail .sf-credit-exhausted,body:not(.shopify) .sf-credit-exhausted,body.shopify.agent-conversation-open[data-view="tm-agents"] .sf-credit-exhausted,body.shopify.agent-conversation-open.agent-drawer-open[data-view="tm-agents"] .sf-credit-exhausted,body.shopify.agent-conversation-open.agent-screen-open[data-view="tm-agents"] .sf-credit-exhausted,body.shopify[data-view="tm-agent-detail"] .sf-credit-exhausted{left:10px;right:10px;bottom:78px;grid-template-columns:20px minmax(0,1fr) 24px;padding:13px}.sf-credit-exhausted-actions{grid-column:2/4;justify-content:flex-end}.sf-credit-exhausted-close{grid-column:3;grid-row:1}.sf-credit-exhausted-copy{grid-column:2;grid-row:1}.sf-credit-exhausted-icon{grid-column:1;grid-row:1}.sf-credit-exhausted-actions button{height:32px;padding:0 12px}}
/* The Site Editor reuses this exact credit shop in a same-origin overlay
iframe. Hide the dashboard shell in that narrow mode so only the existing
billing surface is visible; no second checkout implementation is needed. */
html.sf-credit-embed,html.sf-credit-embed body{background:transparent!important}
html.sf-credit-embed body>*:not(.sf-credit-shop):not(.sf-checkout):not(script):not(style){visibility:hidden!important}
.sf-credit-dialog{--cr-surface:#fff;--cr-raised:#fff;--cr-hover:#f6f6f7;--cr-ink:#181818;--cr-sub:#737373;--cr-dim:#969696;--cr-line:#dedede;--cr-selected-line:#181818;--cr-disabled:#e9e9eb;--cr-disabled-ink:#9b9ba0;position:relative;box-sizing:border-box;width:min(580px,calc(100vw - 36px));min-height:300px;max-height:calc(100vh - 36px);padding:24px 18px 26px;overflow:auto;color:var(--cr-ink);background:var(--cr-surface);border:0;border-radius:26px;box-shadow:none;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;animation:cmdkIn .2s cubic-bezier(.22,1,.36,1)}
html[data-theme="dark"] .sf-credit-dialog{--cr-surface:#181818;--cr-raised:#181818;--cr-hover:#1d1d1d;--cr-ink:#fff;--cr-sub:#969696;--cr-dim:#969696;--cr-line:#3e3e3e;--cr-selected-line:#fff;box-shadow:none}
.sf-credit-dialog button,.sf-credit-dialog input{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.sf-credit-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:0}
.sf-credit-eyebrow{display:none}
.sf-credit-spark{width:21px;height:21px;border:1px solid var(--cr-line);border-radius:7px;display:inline-flex;align-items:center;justify-content:center;color:var(--cr-ink)}
.sf-credit-spark svg{width:12px;height:12px;fill:currentColor}
.sf-credit-head h2{margin:0;font-size:20px;line-height:24px;font-weight:500;letter-spacing:-.035em}
.sf-credit-head p{margin:1px 0 0;max-width:none;color:var(--cr-sub);font-size:13px;line-height:16px;font-weight:500}
.sf-credit-rate-link{padding:0;border:0;background:transparent;color:#68b7ff;font:inherit;cursor:pointer}.sf-credit-rate-link:hover{text-decoration:underline}
.sf-credit-close{display:none}
.sf-credit-close:hover{background:var(--cr-hover);color:var(--cr-ink)}
.sf-credit-close svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8}
.sf-credit-body{padding:0}
.sf-credit-balance{display:none}
.sf-credit-count{font-size:12.5px;font-weight:600;letter-spacing:0;white-space:nowrap}.sf-credit-count small{margin-left:4px;color:var(--cr-sub);font-size:11.5px;font-weight:500;letter-spacing:0}
.sf-credit-meter{height:5px;border-radius:999px;background:var(--cr-hover);overflow:hidden}.sf-credit-meter i{display:block;width:0;height:100%;border-radius:inherit;background:var(--cr-ink);transition:width .35s ease}
.sf-credit-state{display:none}
.sf-credit-state.empty{color:#ff8b82;border-color:rgba(255,92,82,.24);background:rgba(255,69,58,.07)}
.sf-credit-label{display:none}
.sf-credit-packs{display:grid;grid-template-columns:repeat(4,minmax(0,128px));gap:10.5px;margin-top:42px}
.sf-credit-pack{position:relative;min-height:71px;padding:9px 6px;text-align:center;color:var(--cr-ink);background:var(--cr-raised);border:1px solid var(--cr-line);border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:border-color .15s ease,background .15s ease}
.sf-credit-pack:hover{border-color:var(--cr-selected-line);background:var(--cr-hover)}
.sf-credit-pack.on{border-color:var(--cr-selected-line);background:var(--cr-hover);box-shadow:none}
.sf-credit-pack .radio{display:none}
.sf-credit-pack .n{font-size:13px;font-weight:300;letter-spacing:0}.sf-credit-pack .u{margin-left:3px;color:var(--cr-sub);font-size:13px;font-weight:300}
.sf-credit-pack .price{margin:0;font-size:14px;line-height:17px;font-weight:500}.sf-credit-pack .rate,.sf-credit-pack .save,.sf-credit-pop{display:none}
.sf-credit-custom-field{display:none;margin-top:14px}.sf-credit-custom-field.on{display:block}
.sf-credit-slider-card{padding:15px 16px 14px;border:1px solid var(--cr-line);border-radius:16px;background:var(--cr-hover)}
.sf-credit-slider-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}.sf-credit-slider-top b{display:block;font-size:13px;font-weight:600}.sf-credit-slider-top span{display:block;margin-top:3px;color:var(--cr-sub);font-size:11px;line-height:1.35}
.sf-credit-slider-value{text-align:right;white-space:nowrap}.sf-credit-slider-value strong{display:block;font-size:18px;line-height:20px;font-weight:600;letter-spacing:-.03em}.sf-credit-slider-value small{color:var(--cr-sub);font-size:11px}
.sf-credit-slider{display:block;width:100%;height:22px;margin:0;accent-color:var(--cr-ink);cursor:pointer}.sf-credit-slider:focus-visible{outline:2px solid #2495ff;outline-offset:4px;border-radius:999px}
.sf-credit-slider-range{display:flex;justify-content:space-between;margin-top:2px;color:var(--cr-dim);font-size:10px}
.sf-credit-custom-or{display:flex;align-items:center;gap:9px;margin:11px 0 9px;color:var(--cr-dim);font-size:10px}.sf-credit-custom-or:before,.sf-credit-custom-or:after{content:"";height:1px;flex:1;background:var(--cr-line)}
.sf-credit-custom-field label{display:block;margin-bottom:8px;color:var(--cr-ink);font-size:12.5px;font-weight:600}
.sf-credit-custom-control{display:flex;align-items:center;width:100%;height:44px;box-sizing:border-box;padding:0 14px;border:1px solid var(--cr-line);border-radius:12px;background:var(--cr-raised);color:var(--cr-sub)}
.sf-credit-custom-control:focus-within{border-color:var(--cr-ink);box-shadow:inset 0 0 0 1px var(--cr-ink)}
.sf-credit-custom-input{box-sizing:border-box;width:100%;height:42px;padding:0 0 0 5px;border:0;background:transparent;color:var(--cr-ink);outline:0;text-align:left;font:550 14px/1 Inter;letter-spacing:-.01em;caret-color:#2495ff}
.sf-credit-custom-input::placeholder{color:var(--cr-sub);opacity:1}
.sf-credit-custom-min{display:block;margin-top:6px;color:var(--cr-sub);font-size:11px;line-height:1.35}
.sf-credit-auto{width:100%;margin-top:22px;padding:0;border:0;background:transparent;color:var(--cr-ink);text-align:left;gap:10px;align-items:center}
.sf-credit-auto .bal-funds-check{width:14px;height:14px;border:1px solid var(--cr-ink);border-radius:6px;background:var(--cr-raised)}
.sf-credit-auto.on .bal-funds-check{position:relative;border-color:var(--cr-ink);background:var(--cr-ink)}
.sf-credit-auto.on .bal-funds-check:after{content:"";position:absolute;left:3px;top:1px;width:5px;height:8px;border:solid var(--cr-surface);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.sf-credit-auto[aria-busy="true"]{opacity:.55;cursor:wait}
.sf-credit-auto .bal-funds-auto-copy{color:var(--cr-ink)}.sf-credit-auto .bal-funds-auto-copy b{font-size:13.5px;line-height:16px;font-weight:500}.sf-credit-auto .bal-funds-auto-copy span{margin-top:1px;color:var(--cr-ink);font-size:13px;line-height:16px;font-weight:300}
.sf-credit-foot{margin-top:7px;padding:0;border-top:0;display:flex;align-items:center;justify-content:space-between;gap:12px}
.sf-credit-footer-balance{color:var(--cr-sub);font-size:13.5px;font-weight:300}.sf-credit-footer-balance .sf-credit-count{color:inherit;font:inherit}
.sf-credit-total-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.sf-credit-upgrade{height:36px;padding:0 11px;border:1px solid var(--cr-line);border-radius:10px;background:var(--cr-raised);color:var(--cr-ink);font:650 11px Inter;cursor:pointer;white-space:nowrap}.sf-credit-upgrade:hover{border-color:var(--cr-ink);background:var(--cr-hover)}
.sf-credit-buy{width:175px;height:33px;padding:0 12px;border:0;border-radius:10px;background:var(--cr-ink);color:var(--cr-surface);font:300 14px Inter;cursor:pointer;white-space:nowrap}.sf-credit-buy:hover{opacity:.86}.sf-credit-buy:disabled{background:var(--cr-disabled);color:var(--cr-disabled-ink);cursor:wait}
.sf-credit-success{display:none;margin-bottom:12px;padding:10px 12px;border:1px solid rgba(35,176,98,.22);border-radius:10px;background:rgba(35,176,98,.08);color:#16824a;font-size:11.5px;line-height:1.4}.sf-credit-success.on{display:block}
.sf-credit-error{display:none;margin-bottom:12px;padding:10px 12px;border:1px solid rgba(205,57,57,.24);border-radius:10px;background:rgba(205,57,57,.08);color:#c8372d;font-size:11.5px;line-height:1.4}.sf-credit-error.on{display:block}
@media(max-width:520px){.sf-credit-shop{padding:0;align-items:flex-end}.sf-credit-dialog{width:100%;height:auto;max-width:none;max-height:94vh;padding:20px 16px;overflow:auto;border-radius:24px 24px 0 0}.sf-credit-packs{grid-template-columns:1fr 1fr;margin-top:28px}.sf-credit-pack{min-height:96px;border-radius:24px}.sf-credit-auto{margin-top:24px}.sf-credit-foot{align-items:stretch;flex-direction:column}.sf-credit-total-actions{justify-content:stretch}.sf-credit-upgrade,.sf-credit-buy{width:100%;flex:1}}
/* Dedicated in-product credit checkout. Stripe owns every sensitive field;
this shell supplies only Attract's layout, summary, and theme. */
.sf-checkout{--co-bg:#fff;--co-card:#f7f7f7;--co-ink:#111;--co-sub:#6c6c70;--co-line:#e7e7e7;--co-soft:#f3f3f3;position:fixed;inset:0;z-index:1950;overflow:auto;background:var(--co-bg);color:var(--co-ink);animation:gatefade .18s ease}
html[data-theme="dark"] .sf-checkout{--co-bg:#0b0b0c;--co-card:#151516;--co-ink:#f5f5f6;--co-sub:#98989f;--co-line:#2b2b2e;--co-soft:#18181a}
.sf-checkout-back{position:fixed;top:22px;left:24px;width:38px;height:38px;border:1px solid var(--co-line);border-radius:12px;background:var(--co-bg);color:var(--co-ink);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2}.sf-checkout-back:hover{background:var(--co-soft)}
.sf-checkout-back svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sf-checkout-main{box-sizing:border-box;width:min(720px,calc(100% - 40px));margin:0 auto;padding:76px 0 80px}
.sf-checkout h1{margin:0 0 42px;font-size:34px;line-height:1;font-weight:700;letter-spacing:-.045em}
.sf-checkout-section{margin-top:34px}.sf-checkout-section.first{margin-top:0}
.sf-checkout-label{display:block;margin:0 0 12px;font-size:15px;font-weight:700;letter-spacing:-.01em}
.sf-checkout-select{position:relative;height:58px;border-radius:14px;background:var(--co-soft);display:flex;align-items:center}
.sf-checkout-select select{appearance:none;-webkit-appearance:none;width:100%;height:100%;padding:0 52px 0 18px;border:0;border-radius:inherit;background:transparent;color:var(--co-ink);outline:none;font:500 15px Inter;cursor:pointer}
.sf-checkout-select svg{position:absolute;right:18px;width:15px;height:15px;fill:none;stroke:var(--co-sub);stroke-width:1.8;pointer-events:none}
.sf-checkout-rate{display:flex;align-items:center;gap:9px;margin-top:14px;color:var(--co-sub);font-size:12.5px}.sf-checkout-rate svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}.sf-checkout-rate button{padding:0;border:0;border-bottom:1px dotted currentColor;background:none;color:inherit;font:inherit;cursor:pointer}
.sf-checkout-note{margin-top:14px;padding:13px 15px;border:1px solid var(--co-line);border-radius:12px;color:var(--co-sub);font-size:12.5px;line-height:1.45}.sf-checkout-note b{color:var(--co-ink);font-weight:650}
.sf-checkout-payment-note{display:flex;align-items:flex-start;gap:10px;margin:0 0 14px;padding:12px 13px;border:1px solid var(--co-line);border-radius:12px;background:var(--co-soft);color:var(--co-sub)}
.sf-checkout-payment-note>svg{width:17px;height:17px;flex:none;margin-top:1px;fill:none;stroke:currentColor;stroke-width:1.8}.sf-checkout-payment-note b{display:block;color:var(--co-ink);font-size:12.5px}.sf-checkout-payment-note span span{display:block;margin-top:3px;font-size:11.5px;line-height:1.45}.sf-checkout-payment-note.saved{border-color:rgba(41,157,91,.28);background:rgba(41,157,91,.08);color:#21814a}
.sf-checkout-payment{min-height:132px}.sf-checkout-payment.is-loading{display:flex;align-items:center;justify-content:center;border:1px solid var(--co-line);border-radius:14px;background:var(--co-soft)}
.sf-checkout-shimmer{font-size:14px;font-weight:650;background:linear-gradient(90deg,var(--co-sub) 20%,var(--co-ink) 48%,var(--co-sub) 76%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sfCheckoutShimmer 1.35s linear infinite}
@keyframes sfCheckoutShimmer{to{background-position:-220% 0}}
.sf-checkout-address{min-height:110px}
.sf-checkout-summary{margin-top:34px;padding-top:22px;border-top:1px solid var(--co-line)}
.sf-checkout-summary-row{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:10px;color:var(--co-sub);font-size:13px}.sf-checkout-summary-row.total{margin-top:14px;color:var(--co-ink);font-size:15px;font-weight:700}
.sf-checkout-status{display:none;align-items:center;gap:10px;margin:18px 0 0;padding:12px 14px;border:1px solid var(--co-line);border-radius:11px;background:var(--co-soft);color:var(--co-sub);font-size:12.5px;line-height:1.45}.sf-checkout-status.on{display:flex}.sf-checkout-status.processing{color:var(--co-ink)}
.sf-checkout-pay{width:100%;height:54px;margin-top:24px;border:0;border-radius:999px;background:var(--co-ink);color:var(--co-bg);font:700 15px Inter;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;transition:opacity .15s ease,transform .15s ease}.sf-checkout-pay:hover{opacity:.88}.sf-checkout-pay:active{transform:scale(.995)}.sf-checkout-pay:disabled{opacity:.45;cursor:wait}
.sf-checkout-pay svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
.sf-checkout-spinner{display:none;width:15px;height:15px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:sfCheckoutSpin .7s linear infinite}.sf-checkout-pay[aria-busy="true"]>svg{display:none}.sf-checkout-pay[aria-busy="true"] .sf-checkout-spinner{display:block}@keyframes sfCheckoutSpin{to{transform:rotate(360deg)}}
.sf-checkout-legal{max-width:620px;margin:14px auto 0;color:var(--co-sub);font-size:11px;line-height:1.45;text-align:center}
.sf-checkout-error{display:none;margin:18px 0 0;padding:12px 14px;border:1px solid rgba(205,57,57,.25);border-radius:11px;background:rgba(205,57,57,.08);color:#c8372d;font-size:12.5px;line-height:1.45;outline:none}.sf-checkout-error.on{display:block}.sf-checkout-error strong,.sf-checkout-error span{display:block}.sf-checkout-error strong{margin-bottom:3px;color:inherit;font-size:13px}.sf-checkout-error span{color:inherit}
.sf-checkout-success{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.sf-checkout-success-mark{width:48px;height:48px;border-radius:50%;background:var(--co-ink);color:var(--co-bg);display:flex;align-items:center;justify-content:center;font-size:22px}.sf-checkout-success.pending .sf-checkout-success-mark{background:var(--co-soft);color:var(--co-ink)}.sf-checkout-success h2{margin:18px 0 6px;font-size:25px;letter-spacing:-.03em}.sf-checkout-success p{max-width:430px;margin:0;color:var(--co-sub);font-size:14px;line-height:1.5}.sf-checkout-success-detail{margin-top:10px!important;font-size:12px!important}
@media(max-width:760px){.sf-checkout-back{position:absolute;top:14px;left:14px}.sf-checkout-main{width:min(100% - 32px,620px);padding:70px 0 48px}.sf-checkout h1{margin-bottom:34px;font-size:29px}.sf-checkout-section{margin-top:28px}}
.sf-set-fld{width:280px;max-width:48%;height:36px;padding:0 12px;border:1px solid var(--sf-border);border-radius:10px;font:500 13.5px Inter;color:var(--sf-ink);background:#fff;outline:none}
.sf-set-fld:focus{border-color:var(--sf-fill)}
/* Account tab — social-style profile hero (avatar + @handle) */
.sf-prof{display:flex;align-items:center;gap:16px;padding:16px;border:1px solid var(--sf-border);border-radius:16px;background:var(--sf-hover);margin-bottom:18px}
.sf-prof-ava{position:relative;width:72px;height:72px;flex:none;border-radius:50%;background:var(--sf-sel);display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;border:1px solid var(--sf-border)}
.sf-prof-ava .init{font-size:26px;font-weight:700;color:var(--sf-ink)}
.sf-prof-ava.is-placeholder{background:#e9e9eb;border-color:#dedee1}
html[data-theme="dark"] .sf-prof-ava.is-placeholder{background:#28282b;border-color:#343438}
.sf-prof-ava.is-placeholder .init{display:grid;place-items:center;color:#717176}
html[data-theme="dark"] .sf-prof-ava.is-placeholder .init{color:#a7a7ac}
.sf-prof-ava .init svg{display:block;width:34px;height:34px}
.sf-prof-ava img{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;object-fit:cover}
.sf-prof-ava .ov{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(17,17,20,.45);opacity:0;transition:opacity .15s}
.sf-prof-ava:hover .ov,.sf-prof-ava.drag .ov{opacity:1}
.sf-prof-ava .ov svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sf-prof-ava.drag{outline:2px dashed var(--sf-fill);outline-offset:2px}
.sf-prof-meta{min-width:0;flex:1}
.sf-prof-meta .nm{font-size:15.5px;font-weight:700;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-prof-meta .hd{font-size:13px;color:var(--sf-sub);margin-top:2px;display:flex;align-items:center;gap:6px}
.sf-prof-meta .hd .vf{display:inline-flex;width:15px;height:15px;flex:none;border-radius:50%;background:#33c27f;align-items:center;justify-content:center}
.sf-prof-meta .hd .vf svg{width:9px;height:9px;stroke:#fff;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
.sf-prof-meta .hint{font-size:11.5px;color:var(--sf-dim);margin-top:4px}
.sf-prof-act{display:flex;gap:8px;flex:none}
.sf-prof-status{min-height:16px;margin-top:5px;color:var(--sf-dim);font-size:11.5px;font-weight:600}
.sf-prof-status.ok{color:#1fa365}.sf-prof-status.bad{color:#c8372d}
.sf-prof-crop{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;padding:22px;background:rgba(0,0,0,.68);backdrop-filter:blur(12px)}
.sf-prof-crop[hidden]{display:none}
.sf-prof-crop-card{width:min(520px,calc(100vw - 32px));overflow:hidden;border:1px solid #303034;border-radius:17px;background:#111114;color:#f8f8fa;box-shadow:0 28px 80px rgba(0,0,0,.62)}
.sf-prof-crop-head{min-height:62px;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #29292d}
.sf-prof-crop-head h3{margin:0;font-size:15px;font-weight:720}.sf-prof-crop-head p{margin:3px 0 0;color:#95959d;font-size:11.5px}
.sf-prof-crop-x{width:32px;height:32px;border:0;border-radius:9px;background:transparent;color:#aaaab1;font-size:22px;cursor:pointer}.sf-prof-crop-x:hover{background:#222226;color:#fff}
.sf-prof-crop-body{padding:22px}
.sf-prof-crop-preview{position:relative;width:min(340px,100%);aspect-ratio:1;margin:0 auto;overflow:hidden;border-radius:50%;background:#29292e;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.sf-prof-crop-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:center;will-change:transform}
.sf-prof-crop-controls{display:grid;gap:14px;margin-top:20px}.sf-prof-crop-controls .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sf-prof-crop-controls label{display:grid;gap:7px;color:#aaaab1;font-size:11.5px;font-weight:650}.sf-prof-crop-controls input{width:100%;accent-color:#fff}
.sf-prof-crop-error{min-height:17px;margin-top:13px;color:#ff858d;font-size:12px;font-weight:650}
.sf-prof-crop-foot{display:flex;justify-content:flex-end;gap:9px;padding:14px 18px;border-top:1px solid #29292d}
.sf-prof-crop-foot button{height:40px;padding:0 16px;border:1px solid #343439;border-radius:10px;background:transparent;color:#d8d8dd;font:650 13px Inter;cursor:pointer}.sf-prof-crop-foot button.primary{border-color:#fff;background:#fff;color:#111}.sf-prof-crop-foot button:disabled{opacity:.5;cursor:wait}
@media(max-width:620px){.sf-prof{align-items:flex-start;flex-wrap:wrap}.sf-prof-act{width:100%}.sf-prof-crop-controls .two{grid-template-columns:1fr}}
.sf-uname-col{display:flex;flex-direction:column;align-items:flex-end;gap:6px;max-width:60%}
.sf-uname-line{display:flex;gap:8px;align-items:center}
.sf-uname{display:flex;align-items:center;width:auto;max-width:none;padding:0 12px}
.sf-uname .at{color:var(--sf-dim);font-weight:600;font-size:13.5px}
.sf-uname input{border:none;outline:none;background:transparent;font:500 13.5px Inter;color:var(--sf-ink);width:140px;padding:0}
.sf-uname-status{font-size:12px;min-height:15px;color:var(--sf-dim);display:flex;align-items:center;gap:5px;text-align:right}
.sf-uname-status.ok{color:#1fa365}
.sf-uname-status.bad{color:#c8372d}
.sf-uname-lock{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 12px;border:1px solid rgba(51,194,127,.4);background:rgba(51,194,127,.08);border-radius:10px;font:600 13.5px Inter;color:var(--sf-ink)}
.sf-uname-lock svg{width:14px;height:14px;stroke:#1fa365;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
@keyframes sfSpin{to{transform:rotate(360deg)}}
.sf-uname-spin{width:11px;height:11px;flex:none;border-radius:50%;border:1.5px solid var(--sf-dim);border-top-color:transparent;animation:sfSpin .7s linear infinite}
.sf-set-body.docs-mode{padding:0;overflow:hidden;background:var(--sf-hover)}
.sf-doc-library{height:100%;min-height:0;display:flex;flex-direction:column;background:var(--sf-hover)}
.sf-doc-toolbar{flex:none;padding:18px 34px 16px;border-bottom:1px solid var(--sf-border-2);background:var(--sf-surface)}
.sf-doc-controls{display:flex;align-items:stretch;gap:12px}
.sf-doc-search{min-width:220px;flex:1;height:48px;box-sizing:border-box;display:flex;align-items:center;gap:10px;border:1px solid var(--sf-border);border-radius:12px;padding:0 14px;background:var(--sf-hover);color:var(--sf-sub)}
.sf-doc-search svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.sf-doc-search input{width:100%;border:0;outline:0;background:transparent;color:var(--sf-ink);font:500 13px Inter}
.sf-doc-search input::placeholder{color:var(--sf-dim)}
.sf-doc-upload{position:relative;width:260px;min-height:48px;display:flex;align-items:center;gap:10px;border:1px solid var(--sf-border);border-radius:12px;padding:8px 12px;background:var(--sf-hover);color:var(--sf-ink);cursor:pointer}
.sf-doc-upload input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.sf-doc-upload .up-ic{width:28px;height:28px;border-radius:8px;background:var(--sf-sel);display:flex;align-items:center;justify-content:center;flex:none;color:var(--sf-ink)}
.sf-doc-upload .up-ic svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.sf-doc-upload .up-copy{min-width:0;display:flex;flex-direction:column;gap:1px}
.sf-doc-upload .up-copy b{font-size:12.5px;line-height:1.2;color:var(--sf-ink)}
.sf-doc-upload .up-copy small{font-size:11px;line-height:1.25;color:var(--sf-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-doc-main{min-width:0;flex:1;overflow:auto;padding:30px 34px 36px}
.sf-doc-head{margin:0 0 26px}
.sf-doc-head h3{margin:0;color:var(--sf-ink);font-size:30px;font-weight:760;letter-spacing:-.035em;line-height:1.08}
.sf-doc-head p{margin:9px 0 0;max-width:720px;color:var(--sf-sub);font-size:14px;line-height:1.55}
.sf-doc-count{margin-top:10px;color:var(--sf-dim);font-size:12px;font-weight:650}
.sf-doc-library.esign-mode .sf-doc-gridview{width:100%;max-width:780px;margin:0 auto}
.sf-doc-cards{display:grid;grid-template-columns:repeat(2,minmax(240px,1fr));gap:22px}
.sf-doc-tile{min-width:0;min-height:210px;border:1px solid var(--sf-border-2);border-radius:16px;background:var(--sf-surface);padding:28px;display:flex;flex-direction:column;justify-content:space-between;gap:26px;cursor:pointer;text-align:left;color:var(--sf-ink);transition:transform .14s ease,border-color .14s ease}
.sf-doc-tile:hover{transform:translateY(-1px);border-color:var(--sf-border);background:var(--sf-surface)}
.sf-doc-tile h4{margin:0;font-size:22px;line-height:1.15;font-weight:760;letter-spacing:-.025em;color:var(--sf-ink)}
.sf-doc-tile p{margin:13px 0 0;font-size:13.5px;line-height:1.55;color:var(--sf-sub)}
.sf-doc-learn{position:relative;display:inline-flex;align-items:center;align-self:flex-start;color:var(--sf-ink);font-size:13px;font-weight:760}
.sf-doc-learn:after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left center;transition:transform .16s ease}
.sf-doc-tile:hover .sf-doc-learn:after,.sf-doc-tile:focus-visible .sf-doc-learn:after{transform:scaleX(1)}
.sf-doc-empty{grid-column:1/-1;border:1px dashed var(--sf-border);border-radius:16px;padding:28px;color:var(--sf-sub);background:var(--sf-surface);font-size:13px}
.sf-doc-detail{display:none}
.sf-doc-library.detail .sf-doc-gridview{display:none}
.sf-doc-library.detail .sf-doc-detail{display:block}
.sf-doc-back{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;color:var(--sf-sub);font:650 13px Inter;cursor:pointer;padding:0;margin:0 0 18px}
.sf-doc-back:hover{color:var(--sf-ink)}
.sf-doc-pdf-wrap{max-width:820px;margin:0 auto 22px}
.sf-doc-pdf-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 16px;color:var(--sf-sub);font-size:12px;font-weight:700}
.sf-doc-pdf-top span{display:inline-flex;align-items:center;height:27px;padding:0 10px;border-radius:999px;background:var(--sf-surface);border:1px solid var(--sf-border-2)}
.sf-doc-pdf-stack{display:grid;gap:18px}
.sf-doc-pdf-page{position:relative;min-height:900px;background:#fff;color:#111;border-radius:2px;border:1px solid #e7e7ea;padding:56px 62px 48px;box-shadow:0 18px 44px rgba(0,0,0,.22);font-family:Inter,system-ui,sans-serif;overflow:hidden}
.sf-doc-pdf-mark{position:absolute;top:28px;right:40px;color:#9b9ba4;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.sf-doc-pdf-page h4{margin:72px 0 10px;font-size:34px;line-height:1.05;letter-spacing:-.035em;color:#111}
.sf-doc-pdf-page .pdf-sub{margin:0 0 30px;color:#555b65;font-size:14px;line-height:1.6;max-width:560px}
.sf-doc-pdf-page h5{margin:0 0 14px;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:#111}
.sf-doc-pdf-page h6{margin:0 0 7px;font-size:14px;color:#111}
.sf-doc-pdf-page p{margin:0 0 12px;font-size:13px;line-height:1.72;color:#3f4550}
.sf-doc-pdf-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #dfe2e8;border-left:1px solid #dfe2e8;margin:24px 0}
.sf-doc-pdf-cell{min-height:58px;padding:11px 13px;border-right:1px solid #dfe2e8;border-bottom:1px solid #dfe2e8}
.sf-doc-pdf-cell b{display:block;color:#111;font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.sf-doc-pdf-cell span{display:block;color:#39404a;font-size:13px;line-height:1.45}
.sf-doc-clause{break-inside:avoid;margin:0 0 18px}
.sf-doc-signatures{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:34px}
.sf-doc-sigbox{border:1px solid #dfe2e8;border-radius:0;padding:16px;min-height:136px}
.sf-doc-sigbox .sig-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#6a717c;font-weight:700;margin-bottom:28px}
.sf-doc-sigline{height:34px;border-bottom:1px solid #111;margin-bottom:12px;font-family:"Brush Script MT",cursive;font-size:23px;color:#111}
.sf-doc-date-line{height:24px;border-bottom:1px solid #bfc4cc;color:#39404a;font-size:12px}
.sf-doc-pdf-foot{position:absolute;left:62px;right:62px;bottom:26px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #e6e8ed;padding-top:10px;color:#747b86;font-size:10px}
.sf-doc-pdf-list{margin:0 0 22px;padding-left:18px;color:#3f4550}
.sf-doc-pdf-list li{font-size:13px;line-height:1.68;margin:0 0 5px}
.sf-doc-meta{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 24px}
.sf-doc-pill{display:inline-flex;align-items:center;height:25px;padding:0 9px;border-radius:999px;font-size:11.5px;font-weight:760;white-space:nowrap;background:var(--sf-hover);color:var(--sf-sub)}
.sf-doc-pill.ok{background:#e9f8f0;color:#0f7a43}
.sf-doc-ready{border-top:1px solid var(--sf-border-2);padding-top:22px}
.sf-doc-ready h5{margin:0 0 10px;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--sf-dim)}
.sf-doc-ready ul{margin:0;padding:0;list-style:none;display:grid;gap:9px}
.sf-doc-ready li{font-size:13.5px;line-height:1.5;color:var(--sf-sub);padding-left:18px;position:relative}
.sf-doc-ready li:before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--sf-ink)}
.sf-doc-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.sf-esign-host{display:block}
.sf-esign{max-width:780px}
.sf-doc-library.esign-mode .sf-esign{width:100%;max-width:none}
.sf-esign-panel{border:1px solid var(--sf-border-2);border-radius:18px;background:var(--sf-surface);color:var(--sf-ink);padding:26px;display:grid;gap:22px}
.sf-esign-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.sf-esign-kicker{font-size:11px;font-weight:760;letter-spacing:.13em;text-transform:uppercase;color:var(--sf-dim);margin-bottom:7px}
.sf-esign h4{margin:0;color:var(--sf-ink);font-size:27px;font-weight:780;letter-spacing:-.035em;line-height:1.08}
.sf-esign p{margin:8px 0 0;color:var(--sf-sub);font-size:13.5px;line-height:1.55;max-width:560px}
.sf-esign-status{flex:none;display:inline-flex;align-items:center;min-height:32px;border:1px solid var(--sf-border);border-radius:999px;padding:0 12px;color:var(--sf-sub);font-size:12px;font-weight:700;white-space:nowrap}
.sf-esign-status.ready{border-color:rgba(15,122,67,.28);background:rgba(15,122,67,.12);color:#36d082}
.sf-esign-seg{height:54px;border:1px solid var(--sf-border);border-radius:17px;padding:5px;display:grid;grid-template-columns:1fr 1fr;background:var(--sf-hover);gap:5px}
.sf-esign-seg button{border:0;border-radius:12px;background:transparent;color:var(--sf-sub);font:760 14px Inter;cursor:pointer}
.sf-esign-seg button.on{background:var(--sf-ink);color:var(--sf-surface)}
.sf-esign-type{display:none;grid-template-columns:1fr auto;gap:10px}
.sf-esign.type-mode .sf-esign-type{display:grid}
.sf-esign-copy{font-size:14px;color:var(--sf-sub);line-height:1.55}
.sf-esign-field{height:44px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-hover);color:var(--sf-ink);font:600 14px Inter;padding:0 13px;outline:none}
.sf-esign.type-mode .sf-esign-field{height:58px;font:400 34px/1 Allura,"Brush Script MT","Segoe Script",cursive;padding:4px 16px 0;letter-spacing:.01em}
.sf-esign-pad{position:relative;height:270px;border:1px solid var(--sf-border);border-radius:18px;background:#fff;overflow:hidden;touch-action:none}
.sf-esign-pad canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:crosshair}
.sf-esign-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#aab0b8;font-size:19px;font-weight:520;pointer-events:none;transition:opacity .16s ease}
.sf-esign.has-ink .sf-esign-placeholder{opacity:0}
.sf-esign-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.sf-esign-links{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.sf-esign-link{border:0;background:none;color:var(--sf-sub);font:650 13px Inter;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:0}
.sf-esign-link:hover{color:var(--sf-ink)}
.sf-esign-save{min-width:146px;height:44px;border:0;border-radius:999px;background:var(--sf-ink);color:var(--sf-surface);font:760 13px Inter;cursor:pointer;padding:0 18px}
.sf-esign-save:disabled{background:#D8D8D8;color:#fff;cursor:default}
.sf-esign-qr{display:none;grid-template-columns:210px 1fr;align-items:center;gap:26px;border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);padding:24px}
.sf-esign.phone-open .sf-esign-qr{display:grid}
.sf-esign-qr img{width:210px;height:210px;display:block;border-radius:8px;background:#fff}
.sf-esign-qr h5{margin:0;color:var(--sf-ink);font-size:22px;font-weight:680;line-height:1.35;letter-spacing:-.02em}
.sf-esign-qr p{margin:9px 0 0;color:var(--sf-dim);font-size:14px}
.sf-esign-preview{border:1px solid var(--sf-border-2);border-radius:16px;background:var(--sf-hover);padding:17px;display:flex;align-items:center;gap:16px}
.sf-esign-preview[hidden]{display:none!important}
.sf-esign-preview .sigbox{width:190px;height:82px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:#303033;display:flex;align-items:center;justify-content:center;overflow:hidden;flex:none}
.sf-esign-preview .sigbox img{max-width:100%;max-height:100%;display:block;filter:invert(1) grayscale(1);opacity:.78}
.sf-esign-preview .sigbox img[hidden],.sf-esign-preview .sigbox img:not([src]){display:none!important}
.sf-esign-preview b{display:block;color:var(--sf-ink);font-size:13.5px}
.sf-esign-preview span{display:block;color:var(--sf-dim);font-size:12px;margin-top:3px;line-height:1.45}
html[data-theme="light"] .sf-esign-panel{background:#fff;color:#0F0F0F}
html[data-theme="light"] .sf-esign-seg button.on,
html[data-theme="light"] .sf-esign-save{background:#0F0F0F;color:#fff}
html[data-theme="light"] .sf-esign-save:disabled{background:#D8D8D8;color:#fff}
html[data-theme="light"] .sf-esign-status.ready{color:#0f7a43;background:#e9f8f0;border-color:#b8e7ce}
html[data-theme="dark"] .sf-esign-pad{background:#303033;border-color:rgba(255,255,255,.16)}
html[data-theme="dark"] .sf-esign-placeholder{color:#d1d5db}
html[data-theme="dark"] .sf-esign-preview .sigbox{background:#303033;border-color:rgba(255,255,255,.16)}
@media(max-width:920px){.sf-doc-toolbar{padding:16px 20px}.sf-doc-controls{flex-direction:column}.sf-doc-search{width:100%;flex:none;min-height:48px}.sf-doc-upload{width:auto}.sf-doc-cards{grid-template-columns:minmax(0,1fr)}.sf-doc-main{padding:24px 20px}.sf-doc-pdf-page{padding:46px 42px 46px}.sf-doc-pdf-foot{left:42px;right:42px}.sf-esign{max-width:none}.sf-esign-qr{grid-template-columns:170px 1fr}.sf-esign-qr img{width:170px;height:170px}}
@media(max-width:760px){.sf-set{padding:0}.sf-set-card{width:100vw;height:100vh;border-radius:0}.sf-set-nav{width:148px;padding:14px 8px}.sf-set-nav button{gap:8px;padding:8px;font-size:12px}.sf-set-nav button svg{width:15px;height:15px}.sf-set-subnav{margin-left:19px;padding-left:9px}.sf-set-nav .sf-set-subnav button{font-size:11.5px;padding:6px 7px}.sf-set-top{padding:16px}.sf-set-top h2{font-size:16px}.sf-set-top p{font-size:12px}.sf-set-body{padding:16px}.sf-doc-toolbar{padding:12px}.sf-doc-search{height:44px;min-height:44px;min-width:0}.sf-doc-main{padding:16px 12px 20px}.sf-doc-head h3{font-size:23px}.sf-doc-head p{font-size:12.5px}.sf-doc-cards{gap:12px}.sf-doc-tile{min-height:150px;padding:17px;border-radius:12px;gap:18px}.sf-doc-tile h4{font-size:18px}.sf-doc-tile p{font-size:12.5px}.sf-doc-pdf-wrap{max-width:none}.sf-doc-pdf-top{align-items:flex-start;flex-direction:column}.sf-doc-pdf-page{min-height:780px;padding:34px 24px 44px}.sf-doc-pdf-page h4{font-size:25px;margin-top:54px}.sf-doc-pdf-grid,.sf-doc-signatures{grid-template-columns:1fr}.sf-doc-pdf-mark{right:24px;top:22px}.sf-doc-pdf-foot{left:24px;right:24px}.sf-esign-panel{padding:18px;border-radius:15px}.sf-esign-top{flex-direction:column}.sf-esign-status{align-self:flex-start}.sf-esign h4{font-size:22px}.sf-esign-pad{height:220px}.sf-esign-type{grid-template-columns:1fr}.sf-esign-actions{align-items:flex-start;flex-direction:column}.sf-esign-save{width:100%}.sf-esign-qr{grid-template-columns:1fr;text-align:left}.sf-esign-qr img{width:180px;height:180px}.sf-esign-preview{align-items:flex-start;flex-direction:column}.sf-esign-preview .sigbox{width:100%}}
.sf-tog{width:40px;height:23px;border-radius:12px;background:var(--sf-border);position:relative;cursor:pointer;flex:none;transition:background .15s;border:none}
.sf-tog::after{content:"";position:absolute;top:2px;left:2px;width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .15s}
.sf-tog.on{background:#1aa05a}
.sf-tog.on::after{transform:translateX(17px)}
.sf-set-plan{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--sf-border);border-radius:12px;padding:17px 19px;background:linear-gradient(180deg,#fff,#fafafa);margin-bottom:18px}
.sf-set-plan .pn{font-size:15px;font-weight:700}
.sf-set-plan .pp{font-size:12.5px;color:var(--sf-sub);margin-top:3px}
.sf-set.billing-open .sf-set-top{padding:28px max(24px,calc((100% - 766px)/2)) 20px}
.sf-set-body.billing-mode{padding:34px 24px 52px}
.sf-usage-overview{max-width:766px;margin:0 auto;padding-bottom:12px}
.sf-usage-section-title{margin:30px 0 10px;color:var(--sf-ink);font-size:13px;font-weight:680}
.sf-usage-section-title:first-child{margin-top:0}
.sf-usage-section-copy{margin:-4px 0 12px;color:var(--sf-sub);font-size:12.5px;line-height:1.45}
.sf-usage-card{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;height:63px;padding:0 18px;border:1px solid #ededed;border-radius:14px;background:#fff}
.sf-usage-card+.sf-usage-card{margin-top:8px}
.sf-usage-card-copy{min-width:0}
.sf-usage-card-title{color:var(--sf-ink);font-size:13px;font-weight:500;line-height:16px}
.sf-usage-card-sub{margin-top:2px;color:var(--sf-sub);font-size:13px;line-height:16px}
.sf-usage-link{display:inline;padding:0;border:0;background:none;color:#2997ff;font:inherit;cursor:pointer}
.sf-usage-link:hover{text-decoration:underline}
.sf-usage-actions{display:flex;align-items:center;gap:9px;flex:none}
.sf-usage-card .sf-btn{min-width:87px;height:28px;justify-content:center;padding:0 10px;border-color:#ededed;border-radius:10px;box-shadow:none;font-size:13px;font-weight:400;transition:background .14s ease,color .14s ease,border-color .14s ease}
.sf-usage-card .sf-btn:hover{border-color:#000;background:#000;color:#fff}
.sf-usage-value{color:var(--sf-ink);font-size:13px;font-weight:500;letter-spacing:0;white-space:nowrap}
.sf-usage-progress{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:165px}
.sf-usage-track{width:78px;height:6px;overflow:hidden;border-radius:999px;background:var(--sf-hover)}
.sf-usage-track i{display:block;width:0;height:100%;border-radius:inherit;background:var(--sf-ink);transition:width .4s cubic-bezier(.22,1,.36,1)}
.sf-usage-percent{min-width:62px;color:var(--sf-sub);font-size:12px;font-weight:550;text-align:right;white-space:nowrap}
.sf-usage-explainers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.sf-usage-explainer{box-sizing:border-box;display:flex;align-items:center;gap:10px;min-height:63px;padding:0 18px;border:1px solid #ededed;border-radius:14px;background:#fff;color:var(--sf-ink);font-size:12px;font-weight:600}
.sf-usage-explainer span{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;flex:none;background:var(--sf-hover);color:var(--sf-sub);font-size:9.5px;font-weight:750}
.sf-usage-auto{height:auto;min-height:63px;padding-top:12px;padding-bottom:12px;align-items:flex-start}
.sf-usage-auto #sfAutoCfg{width:100%;margin-top:12px}
html[data-theme="dark"] .sf-usage-card,html[data-theme="dark"] .sf-usage-explainer{border-color:rgba(255,255,255,.10);background:var(--sf-surface)}
html[data-theme="dark"] .sf-usage-card .sf-btn{border-color:rgba(255,255,255,.10);background:var(--sf-surface)}
@media(max-width:720px){.sf-set.billing-open .sf-set-top{padding:18px 16px 14px}.sf-set-body.billing-mode{padding:24px 16px 40px}.sf-usage-card{align-items:flex-start;flex-direction:column}.sf-usage-actions,.sf-usage-progress{width:100%}.sf-usage-actions .sf-btn{flex:1}.sf-usage-progress{justify-content:space-between}.sf-usage-track{flex:1;width:auto}.sf-usage-explainers{grid-template-columns:1fr}}
.sf-set-int{display:flex;align-items:center;gap:13px;padding:14px 0;border-top:1px solid var(--sf-border-2)}
.sf-set-int.top{border-top:none}
.sf-set-int .ic{width:36px;height:36px;border-radius:10px;background:var(--sf-hover);display:flex;align-items:center;justify-content:center;flex:none;font-weight:800;color:var(--sf-sub);font-size:14px}
.sf-set-int .nm{flex:1;min-width:0}
.sf-set-int .nm .t{font-size:13.5px;font-weight:600}
.sf-set-int .nm .s{font-size:12.5px;color:var(--sf-sub);margin-top:1px}
.sf-set-int .st{font-size:12px;font-weight:650;flex:none}
.sf-set-int .st.on{color:#1aa05a}
.sf-set-int .st.off{color:var(--sf-dim)}
button.sf-set-int{width:100%;margin:0;border-right:0;border-bottom:0;border-left:0;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}
button.sf-set-int:hover{background:var(--sf-hover)}
/* ---- Daytime light theme (auto by clock): white bg, black ink/icons.
Reverts to dark at night. Scoped to the AMBER hero/chat view. ---- */
html[data-theme="light"]{
--bg:#ffffff;--rail:#ffffff;--line:#e6e6ea;--line-2:#d9d9df;
--ink:#000000;--muted:#3f3f46;--dim:#6a6a72;--surface:#f1f1f3;--surface-2:#f7f7f9;
--send:#000000;
}
html[data-theme="light"] body{background:#fff;color:var(--ink)}
html[data-theme="light"] .bg{opacity:0}
html[data-theme="light"] .rail{background:#fff;border-right:1px solid rgba(0,0,0,.08)}
html[data-theme="light"] .rlbl{color:#000}
html[data-theme="light"] .rail button{color:#000}
html[data-theme="light"] .rail-toggle{color:#444}
html[data-theme="light"] .hero .lk .logo{color:#000}
html[data-theme="light"] .pill{background:#fff;box-shadow:inset 0 0 0 .75px rgba(0,0,0,.12)}
html[data-theme="light"] .pill .ic{color:#1a1a1a}
html[data-theme="light"] .pill .ic:hover{background:rgba(0,0,0,.08)}
html[data-theme="light"] .pill textarea{color:#000}
html[data-theme="light"] .pill textarea::placeholder{color:rgba(0,0,0,.33)}
html[data-theme="light"] .pill .ph-chime{--ph-base:rgba(72,76,84,.55);--ph-band:rgba(255,255,255,.85)}
html[data-theme="light"] .fast{color:#1a1a1a}
html[data-theme="light"] .send{background:rgba(0,0,0,.12);color:#000}
html[data-theme="light"] .send.voice{background:transparent;color:#000}
/* Has text (enabled) — day: black circle + white icon. */
html[data-theme="light"] .send.on{background:#000;color:#fff}
html[data-theme="light"] .send svg{stroke:#000}
html[data-theme="light"] .send.voice svg{stroke:#000}
html[data-theme="light"] .send.voice .send-voice{fill:#000;stroke:none}
/* Has text — day: white icon on the black circle. */
html[data-theme="light"] .send.on svg{stroke:#fff}
html[data-theme="light"] .topr{color:var(--muted)}
/* ── Day (light): the "+" add-menu popup is hardcoded dark (#212121). Flip it to a
white surface with black ink and gray secondary text/icons so it tracks day mode. ── */
html[data-theme="light"] .amenu{background:#fff;border-color:rgba(0,0,0,.08);
box-shadow:0 18px 44px -12px rgba(0,0,0,.18)}
html[data-theme="light"] .amenu-fade{background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 72%)}
html[data-theme="light"] .amenu-fade svg{stroke:#3f3f46}
html[data-theme="light"] .ami{color:#1a1a1a}
html[data-theme="light"] .ami:hover{background:rgba(0,0,0,.06)}
html[data-theme="light"] .ami .icn{color:#1a1a1a}
html[data-theme="light"] .ami .chev path{fill:#9e9e9e}
html[data-theme="light"] .amdiv{background:rgba(0,0,0,.10)}
/* ── Day (light): the top bar is hardcoded black, so flip it + its text to light. ── */
html[data-theme="light"] .sf-top{background:rgba(255,255,255,.72);border-bottom:1px solid rgba(0,0,0,.08)}
html[data-theme="light"] .sf-brand,
html[data-theme="light"] .sf-store{color:#1a1a1a}
html[data-theme="light"] .sf-toggle{color:#1a1a1a}
html[data-theme="light"] .sf-toggle:hover{background:rgba(0,0,0,.06)}
html[data-theme="light"] .sf-brand .sf-logo{color:#1a1a1a}
html[data-theme="light"] .sf-brand .badge{color:rgba(0,0,0,.62);border-color:rgba(0,0,0,.16)}
html[data-theme="light"] .sf-brand .badge[data-demo-toggle="true"]:hover{background:rgba(0,0,0,.06);color:#111;border-color:rgba(0,0,0,.28)}
/* ── Night (dark): the sidebar uses the always-light --sf-* palette. Re-point those
vars to dark values *scoped to the sidebar only* so the chat chrome goes black
while the Polaris admin panels (Orders/Products/…) keep their light palette. ── */
html[data-theme="dark"] .sf-side{
--sf-bg:#000000; --sf-surface:#0F0F0F; --sf-ink:#ffffff; --sf-sub:#b4b4bd;
--sf-dim:#85858f; --sf-border:rgba(255,255,255,.09); --sf-border-2:rgba(255,255,255,.06);
--sf-hover:#18181c; --sf-sel:#1f1f23;
background:#000000; border-right:1px solid rgba(255,255,255,.07);
}
/* The persistent context rail mirrors the left sidebar: same dark tokens, and
the SAME hairline (its left border == the sidebar's right border), instead
of the bright light --sf-border it would inherit sitting outside #sf. */
html[data-theme="dark"] #sf-rail{
--sf-bg:#000000; --sf-surface:#0F0F0F; --sf-ink:#ffffff; --sf-sub:#b4b4bd;
--sf-dim:#85858f; --sf-border:rgba(255,255,255,.09); --sf-border-2:rgba(255,255,255,.06);
--sf-hover:#18181c; --sf-sel:#1f1f23;
border-left-color:rgba(255,255,255,.07);
}
html[data-theme="dark"] .sf-chat-top{background:#000000;border-bottom-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .sf-nav-item:hover,
html[data-theme="dark"] .sf-link:hover{background:#18181c}
/* sub-items use the left rail line, not a pill — override the dark hover/selected fill */
html[data-theme="dark"] .sf-nav-item.sub:hover,
html[data-theme="dark"] .sf-nav-item.sub.on{background:none}
/* top-bar search field: darken so the black night bar reads as fully black */
html[data-theme="dark"] .sf-search{background:#151517;border-color:rgba(255,255,255,.12);color:#9a9aa2}
html[data-theme="dark"] .sf-search .kbd{color:#85858f}
html[data-theme="dark"] .sf-top-add,html[data-theme="dark"] .sf-top-filter{background:#151517;border-color:rgba(255,255,255,.12);color:#fff}
html[data-theme="dark"] .sf-top-add:hover,html[data-theme="dark"] .sf-top-filter:hover{background:#1e1e21}
/* ── Night (dynamic): flip the ENTIRE admin surface dark, not just the chrome. All
pages that use the --sf-* tokens (Orders/Services/Growth/…) go dark at once. ── */
html[data-theme="dark"] body.shopify{background:#000}
html[data-theme="dark"] #sf{background:#000;--sf-bg:#0a0a0b;--sf-surface:#0F0F0F;--sf-ink:#f2f2f5;--sf-sub:#a7a7af;--sf-dim:#83838c;--sf-border:rgba(255,255,255,.10);--sf-border-2:rgba(255,255,255,.06);--sf-hover:#1b1b1f;--sf-sel:#1f1f23;--ai-typing-clear:rgba(0,0,0,0);--ai-typing-solid:#000000}
html[data-theme="dark"] #sf .sf-content{background:transparent}
html[data-theme="dark"] #sf .sf-card,html[data-theme="dark"] #sf .sf-metrics{background:var(--sf-surface);border-color:var(--sf-border);box-shadow:none}
html[data-theme="dark"] #sf .sf-head h1,html[data-theme="dark"] #sf .sf-head .ht h1{color:var(--sf-ink)}
html[data-theme="dark"] #sf .sf-actions .sf-btn{background:var(--sf-surface);border-color:var(--sf-border);color:var(--sf-ink)}
html[data-theme="dark"] #sf .sf-actions .sf-btn.primary,html[data-theme="dark"] #sf .sf-btn.primary{background:#f2f2f5;border-color:#f2f2f5;color:#111}
html[data-theme="dark"] #sf table th,html[data-theme="dark"] #sf table td{border-color:var(--sf-border)}
html[data-theme="dark"] #sf .sub-total,html[data-theme="dark"] #sf .sub-total td,html[data-theme="dark"] #sf tr.total td,html[data-theme="dark"] #sf .sf-row-alt{background:var(--sf-hover)}
/* Recents 3-dot menu: light theme uses black dots on a grey pill; in night/dynamic
mode flip the dots white and darken the open-pill so they stay visible. */
html[data-theme="dark"] .sf-side .sf-recent .rmenu{color:#fff}
html[data-theme="dark"] .sf-side .sf-recent .rmenu:hover{background:transparent}
html[data-theme="dark"] .sf-side .sf-recent.menuopen{background:#1f1f23;color:#fff}
/* ── Night (dark): popups & modals rendered OUTSIDE the sidebar (account menu,
Search-chats, ⌘K palette, Settings) keep the always-light --sf-* palette by
default. Re-point those vars + restate the few hardcoded light surfaces so
every popup tracks the night theme. ── */
html[data-theme="dark"] .sf-acct-menu,
html[data-theme="dark"] .scf-box,
html[data-theme="dark"] .cmdk-box,
html[data-theme="dark"] .sf-set-card{
--sf-surface:#0F0F0F; --sf-ink:#ffffff; --sf-sub:#b4b4bd; --sf-dim:#85858f;
--sf-border:rgba(255,255,255,.10); --sf-border-2:rgba(255,255,255,.06);
--sf-hover:#111111; --sf-sel:#26262b; --sf-fill:#33333b;
color:var(--sf-ink);
}
/* Search-chats palette is fully hardcoded light → restate for dark */
html[data-theme="dark"] .scf-box{background:#0F0F0F;color:#fff;border-color:rgba(255,255,255,.10)}
html[data-theme="dark"] .scf-top{border-bottom-color:rgba(255,255,255,.08)}
html[data-theme="dark"] .scf-top svg{stroke:#85858f}
html[data-theme="dark"] .scf-top input{color:#fff}
html[data-theme="dark"] .scf-top input::placeholder{color:#6f6f78}
html[data-theme="dark"] .scf-top .esc{color:#9a9aa2;border-color:rgba(255,255,255,.16)}
html[data-theme="dark"] .scf-group{color:#85858f}
html[data-theme="dark"] .scf-item{color:#e8e8ee}
html[data-theme="dark"] .scf-item:hover{background:#111111}
/* ⌘K palette icon chip */
html[data-theme="dark"] .cmdk-item .ci-ic{background:#26262b}
/* Settings modal hardcoded light surfaces */
html[data-theme="dark"] .sf-set-card,html[data-theme="dark"] .sf-set-nav{background:#0F0F0F}
html[data-theme="dark"] .sf-set-nav button.on{background:#141416}
html[data-theme="dark"] .sf-set-fld{background:#1a1a1f;border-color:rgba(255,255,255,.12)}
html[data-theme="dark"] .sf-set-plan{background:linear-gradient(180deg,#17171b,#0F0F0F)}
html[data-theme="dark"] .sf-set-int .ic{background:#26262b}
html[data-theme="dark"] .sf-doc-card{background:#0F0F0F;border-color:rgba(255,255,255,.12)}
html[data-theme="dark"] .sf-doc-field input{background:#1a1a1f;border-color:rgba(255,255,255,.12)}
html[data-theme="dark"] .sf-doc-pill.ok{background:rgba(21,128,72,.18);color:#5ee79b}
html[data-theme="dark"] .sf-doc-sign{background:linear-gradient(180deg,#15151a,#111116);border-color:rgba(255,255,255,.12)}
/* EMBED MODE (?embed=1) — render only the section's page for the iOS WebView.
Hide all chrome (rail/chat/topbar/sidebar/gate), force the #sf page surface
full-viewport, and zero the topbar+sidebar offsets on .sf-content. */
html.embed .rail,
html.embed .main,
html.embed .sf-top,
html.embed .sf-side,
html.embed .gate,
html.embed .composer{display:none!important}
html.embed #sf{display:block!important}
html.embed .sf-content{top:0!important;left:0!important;right:0!important;bottom:0!important;
border:0!important;border-radius:0!important} /* drop the card top line+curve for a seamless page */
/* The page's primary action (Save) is surfaced by the NATIVE nav action button
instead — keep the in-page bar in the DOM (still clickable + detectable) but
hidden so it doesn't overlap the floating nav. */
html.embed .sf-actions-bar{visibility:hidden!important}
/* SOLO settings (native SettingsSheet detail): full-bleed section body, no
desktop nav/chrome; the native list is the nav. Save bar IS shown here. */
html.embed.setsolo .sf-set{padding:0!important;z-index:2000!important}
html.embed.setsolo .sf-set-card{width:100vw!important;height:100vh!important;max-width:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}
html.embed.setsolo .sf-set-nav{display:none!important}
html.embed.setsolo .sf-set-top .sf-set-x{display:none!important}
html.embed.setsolo .sf-set-body{padding:18px 18px 28px!important}
html.embed.setsolo .sf-actions-bar{visibility:visible!important}
/* Calendar — dense, calm scheduling UI scoped to its page and modal. */
/* Clamp the calendar to its pane: wide content (day agenda, time grid) can
never widen the page and push the sticky head's controls off-screen —
inner scrollers (.sf-cal-timeview etc.) own their horizontal overflow. */
.sf-page.cal-page{max-width:100%;overflow-x:clip}
.sf-cal{--cal-hour:60px;--cal-red:#ff3b30;min-width:0;max-width:100%;color:var(--sf-ink)}
/* Dark mode: the calendar follows the dark chrome (content is normally light-only) */
html[data-theme="dark"] .sf-cal{--sf-surface:#0F0F0F;--sf-bg:#000;--sf-ink:#f2f2f5;--sf-sub:#9a9aa2;--sf-dim:#6f6f78;--sf-border:rgba(255,255,255,.10);--sf-border-2:rgba(255,255,255,.06);--sf-hover:#1a1a1f;--sf-sel:#26262b;color:var(--sf-ink)}
html[data-theme="dark"] #sf-page.cal-page{background:#0F0F0F}
html[data-theme="dark"] .sf-content:has(#sf-page.cal-page){background:#0F0F0F}
html[data-theme="dark"] #sf:has(#sf-page.cal-page){background:#000}
html[data-theme="dark"] .sf-cal-monthscroll,html[data-theme="dark"] .sf-cal-yearscroll,html[data-theme="dark"] .sf-cal-timeview{background:#0F0F0F}
html[data-theme="dark"] .sf-cal-side{background:#000}
html[data-theme="dark"] .sf-cal-weekrow .sf-cal-daycell:first-child{background:rgba(255,255,255,.02)}
html[data-theme="dark"] .sf-cal-daymain .sf-cal-timecol{background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--cal-hour) - 1px),rgba(255,255,255,.07) calc(var(--cal-hour) - 1px),rgba(255,255,255,.07) var(--cal-hour))}
html[data-theme="dark"] .sf-cal-daymain .sf-cal-allday{border-bottom-color:rgba(255,255,255,.07)}
/* night mode: unselected event blocks were sinking into the black grid —
richer tint + a hairline of the event color keeps them clearly visible,
plus a soft outer halo in the block's own color for a modern lift */
html[data-theme="dark"] .sf-cal-eventblock:not(.selected):not(.dragging){
background:color-mix(in srgb,var(--event-color,#34AADC) 52%,transparent);
box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--event-color,#34AADC) 40%,transparent),0 0 18px -6px color-mix(in srgb,var(--event-color,#34AADC) 55%,transparent)}
/* keep title/time readable on the richer fill */
html[data-theme="dark"] .sf-cal-eventblock:not(.selected):not(.dragging) .sf-cal-eb-title{color:#fff}
.sf-cal *{box-sizing:border-box}
/* Calendar overview — use Finance's strip and control-row components directly.
Only these positioning overrides are calendar-specific. */
.sf-page.cal-page .sf-cal-head{position:sticky;top:0;z-index:35;min-height:0;padding:10px 28px 0;background:color-mix(in srgb,var(--sf-bg) 58%,transparent);backdrop-filter:blur(18px) saturate(1.35);-webkit-backdrop-filter:blur(18px) saturate(1.35)}
.sf-cal-summary.cal-finance-strip.fin-sticky-metrics{position:relative;left:auto;right:auto;top:auto;width:100%;height:78px;margin:0;opacity:1;visibility:visible;pointer-events:auto;transform:none;transition:none}
.cal-fin-period-segment{width:304px;min-width:304px;height:76px;display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;border-right:1px solid var(--sf-border-2)}
.cal-fin-period-handle{width:44px;height:100%;padding:0;border:0;border-radius:0;background:transparent;color:var(--sf-sub);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .14s ease}
.cal-fin-period-handle.prev{border-radius:0}
.cal-fin-period-handle.next{border-radius:0}
.cal-fin-period-handle:hover{background:transparent;color:var(--sf-ink)}
.cal-fin-period-handle:focus-visible,.cal-fin-period-core:focus-visible{outline:2px solid var(--sf-ink);outline-offset:-3px}
.cal-fin-period-handle svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cal-fin-period-core{height:calc(100% - 14px);min-width:0;margin:7px 0;padding:0 13px;border:0;border-radius:12px;background:transparent;color:var(--sf-ink);display:flex;align-items:center;justify-content:center;gap:10px;font:650 14px Inter;cursor:pointer;transition:background .14s ease}
.cal-fin-period-core:hover{background:var(--sf-hover)}
.cal-fin-period-core>svg{width:20px;height:20px;flex:none;color:var(--sf-sub)}
.cal-fin-period-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-finance-strip .sf-metrics-scroll{overflow-x:hidden}
.cal-finance-strip .sf-metric:last-child{border-right:0}
.cal-fin-detail{flex:0 1 92px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right;color:var(--sf-dim);font:500 9.5px/1.2 Inter}
.cal-finance-tools.fin-overview-tools{margin:0;padding:9px 0 10px}
.cal-fin-view-menu.fin-interval-menu{position:fixed;z-index:10050;top:auto;left:auto;width:184px;padding:8px;border:1px solid rgba(255,255,255,.14);border-radius:16px;background:#050505;color:#fff;box-shadow:0 24px 70px rgba(0,0,0,.48),0 8px 24px rgba(0,0,0,.28);animation:calViewMenuIn .18s cubic-bezier(.22,1,.36,1);transform-origin:top center}
.cal-fin-view-menu.fin-interval-menu[hidden]{display:none}
.cal-fin-view-menu .fin-interval-option{height:46px;padding:0 14px;border-radius:11px;color:#fff;font-size:14.5px;transition:background .14s ease,color .14s ease}
.cal-fin-view-menu .fin-interval-option:hover,.cal-fin-view-menu .fin-interval-option:focus-visible,.cal-fin-view-menu .fin-interval-option.on{background:#202024;color:#fff;outline:0}
.cal-fin-view-menu .fin-interval-check{width:19px;height:19px;background:#fff;color:#050505}
.cal-fin-view-menu .fin-interval-check svg{width:12px;height:12px}
html[data-theme="light"] .cal-fin-view-menu.fin-interval-menu{border-color:rgba(0,0,0,.14);background:#fff;color:#050505;box-shadow:0 24px 64px rgba(15,23,42,.18),0 8px 20px rgba(15,23,42,.10)}
html[data-theme="light"] .cal-fin-view-menu .fin-interval-option{color:#050505}
html[data-theme="light"] .cal-fin-view-menu .fin-interval-option:hover,html[data-theme="light"] .cal-fin-view-menu .fin-interval-option:focus-visible,html[data-theme="light"] .cal-fin-view-menu .fin-interval-option.on{background:#f1f1f3;color:#050505}
html[data-theme="light"] .cal-fin-view-menu .fin-interval-check{border:1px solid rgba(0,0,0,.14);background:#fff;color:#050505}
@keyframes calViewMenuIn{from{opacity:0;transform:translateY(-7px) scale(.96)}to{opacity:1;transform:none}}
.cal-finance-tools .fin-tool-right{margin-left:auto}
@media(max-width:760px){.sf-page.cal-page .sf-cal-head{padding-left:14px;padding-right:14px}.sf-cal-summary.cal-finance-strip.fin-sticky-metrics{height:78px}.cal-fin-period-segment{width:270px;min-width:270px;grid-template-columns:38px minmax(0,1fr) 38px}.cal-fin-period-handle{width:38px;height:100%}.cal-fin-period-core{padding:0 9px}.cal-finance-strip .sf-metrics-scroll{overflow-x:auto}.cal-finance-strip .sf-metrics-scroll>div{min-width:760px}.cal-finance-tools.fin-overview-tools{flex-wrap:nowrap;overflow-x:auto}.cal-finance-tools .fin-tool-left,.cal-finance-tools .fin-tool-right{flex-wrap:nowrap}}
.cal-addmenu{position:fixed;z-index:10050;width:290px;padding:14px;border-radius:18px;background:var(--sf-surface);border:1px solid var(--sf-border);box-shadow:0 18px 48px rgba(15,23,42,.22);animation:calpop .12s ease}
@keyframes calpop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.cal-addmenu-tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cal-addtile{display:flex;flex-direction:column;align-items:center;gap:9px;padding:12px 6px 10px;border:0;background:none;border-radius:12px;color:var(--sf-ink);font:600 13px Inter;cursor:pointer}
.cal-addtile:hover{background:var(--sf-hover)}
.cal-addtile-ic{width:42px;height:42px;border-radius:999px;background:var(--sf-hover);display:flex;align-items:center;justify-content:center}
.cal-addtile-ic svg{width:20px;height:20px}
.cal-addmenu-div{height:1px;background:var(--sf-border);margin:12px 2px}
.cal-addmenu-quick label{display:block;font:700 13px Inter;color:var(--sf-ink);margin:0 2px 8px}
.cal-addmenu-quick input{width:100%;height:38px;padding:0 12px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:500 14px Inter;box-sizing:border-box}
.cal-addmenu-quick input:focus{outline:2px solid var(--acc);outline-offset:-1px;border-color:var(--acc)}
.cal-addmenu-quick input:disabled{opacity:.6}
html[data-theme="dark"] .cal-addmenu{background:#17171a}
.cal-filtermenu{position:fixed;z-index:10050;width:210px;padding:6px;border-radius:14px;background:var(--sf-surface);border:1px solid var(--sf-border);box-shadow:0 18px 48px rgba(15,23,42,.22);animation:calpop .12s ease}
.cal-filtermenu-head{padding:7px 10px 5px;font:700 11px Inter;letter-spacing:.04em;text-transform:uppercase;color:var(--sf-dim)}
.cal-filterrow{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:8px 10px;border:0;border-radius:9px;background:transparent;color:var(--sf-ink);font:500 13.5px Inter;cursor:pointer;text-align:left}
.cal-filterrow:hover{background:var(--sf-hover)}
.cal-filterrow.on{font-weight:600}
.cal-filterrow svg{width:15px;height:15px;flex:none;color:var(--acc)}
html[data-theme="dark"] .cal-filtermenu{background:#17171a}
.sf-cal-shell{overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none}
.sf-cal-loading,.sf-cal-error{display:flex;min-height:420px;align-items:center;justify-content:center;padding:32px;color:var(--sf-sub);font-size:14px}.sf-cal-error{flex-direction:column;gap:10px;text-align:center}.sf-cal-error b{color:var(--sf-ink);font-size:16px}
.sf-cal-weekdays{position:sticky;top:var(--cal-headh,96px);z-index:15;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));background:color-mix(in srgb,var(--sf-surface) 24%,transparent);backdrop-filter:blur(5px) saturate(1.3);-webkit-backdrop-filter:blur(5px) saturate(1.3);border-bottom:1px solid var(--sf-border)}
.sf-cal-weekdays span{padding:6px 10px 10px;color:var(--sf-sub);font-size:11px;font-weight:700;letter-spacing:.055em;text-align:center;text-transform:uppercase}
.sf-cal-monthgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(6,minmax(105px,1fr));min-height:650px}
.sf-cal-daycell{position:relative;min-width:0;padding:6px 8px;border-right:1px solid var(--sf-border);border-bottom:1px solid var(--sf-border);background:transparent;cursor:pointer;transition:background .12s ease}.sf-cal-daycell:hover{background:var(--sf-hover)}.sf-cal-daycell.out .sf-cal-date{color:var(--sf-dim)}
.sf-cal-monthscroll{overflow-y:auto;max-height:calc(100vh - 165px);overscroll-behavior:contain}
.sf-cal-weekrow{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
html[data-theme="light"] .sf-cal-weekrow .sf-cal-daycell:first-child{background:#F9F9F9}
html[data-theme="dark"] .sf-cal-weekrow .sf-cal-daycell:first-child{background:rgba(255,255,255,.03)}
.sf-cal-monthscroll .sf-cal-daycell{min-height:120px}
.sf-cal-date{display:flex;width:28px;height:28px;align-items:center;justify-content:center;margin:0 0 5px auto;border-radius:999px;color:var(--sf-ink);font-size:16px;font-weight:400}.sf-cal-daycell.out .sf-cal-date{color:var(--sf-dim)}.sf-cal-date.today{background:var(--acc);color:#fff}.sf-cal-daycell.out .sf-cal-date.today{color:#fff}
.sf-cal-pill{position:relative;display:flex;min-width:0;align-items:center;gap:6px;width:100%;height:18px;margin:2px 0 0;padding:0 6px 0 11px;border:0;border-radius:4px;background:transparent;color:var(--sf-ink);font:400 12px Inter;cursor:pointer;text-align:left;overflow:hidden}.sf-cal-pill::before{content:"";position:absolute;left:3px;top:2px;bottom:2px;width:5px;border-radius:2.5px;background:var(--event-color,#34AADC)}.sf-cal-pill:hover{background:color-mix(in srgb,var(--event-color,#34AADC) 10%,transparent)}.sf-cal-pill.allday{background:var(--event-color,#34AADC);color:#fff}.sf-cal-pill.allday::before{background:#A7E5FF}.sf-cal-pill.allday .sf-cal-pill-time{color:rgba(255,255,255,.85)}.sf-cal-pill.draft{opacity:.6}.sf-cal-pill:hover{filter:brightness(.97)}.sf-cal-pill.video{--event-color:#0891b2}.sf-cal-pill-time{flex:none;margin-left:auto;color:var(--sf-sub);font-size:10px;font-weight:400}.sf-cal-pill-title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sf-cal-more{padding:4px 5px;color:var(--sf-sub);font-size:11px;font-weight:650}
.sf-cal-dc-list{display:flex;flex-direction:column;min-height:0}.sf-cal-dc-list>*{flex:none}
.sf-cal-daycell.selected{z-index:3;border-radius:10px;box-shadow:inset 0 0 0 2px #00B5FF;background:var(--sf-surface)}
.sf-cal-daycell.selected .sf-cal-dc-list{max-height:calc(100% - 36px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:6px;scroll-padding-bottom:8px}
.sf-cal-daycell.selected .sf-cal-dc-list:not(.has-scroll){justify-content:center}
.sf-cal-daycell.selected .sf-cal-dc-list::-webkit-scrollbar{width:0;height:0;display:none}
.sf-cal-daycell.selected .sf-cal-dc-list.has-scroll{padding-bottom:24px;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 18px,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(to bottom,transparent 0,#000 18px,#000 calc(100% - 22px),transparent)}
.sf-cal-daycell.selected .sf-cal-date{opacity:.5;pointer-events:none;transition:opacity .16s ease}
.sf-cal-pill.selected{background:var(--event-color,#34AADC);color:#fff}
.sf-cal-pill.selected::before{background:rgba(255,255,255,.5)}
.sf-cal-pill.selected .sf-cal-pill-time{color:#fff}
.sf-cal-pill.selected:hover{filter:brightness(1.03)}
.sf-cal-addbtn{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:20px;margin-top:5px;border:0;border-radius:4px;background:transparent;color:#8c8c8c;font:400 12px Inter;cursor:pointer;transition:background .15s ease}
.sf-cal-addbtn::before,.sf-cal-addbtn::after{content:"";position:absolute;inset:0;border-radius:4px;pointer-events:none;transition:opacity .2s ease}
.sf-cal-addbtn::before{border:1px dashed #9b9b9b;opacity:1}
.sf-cal-addbtn::after{border:1px solid #9b9b9b;opacity:0}
.sf-cal-addbtn:hover{background:var(--sf-hover);color:#6f6f6f}
.cal-recur-ic{width:11px;height:11px;flex:none;margin-left:auto;opacity:.75}
.sf-cal-pill .cal-recur-ic{margin-left:4px}.sf-cal-pill .cal-recur-ic+.sf-cal-pill-time{margin-left:4px}
.sf-cal-pill.unavailable{color:#6b7280}.sf-cal-pill.unavailable::before{background:#9aa0a6}
.sf-cal-eventblock.unavailable{background:repeating-linear-gradient(45deg,rgba(140,140,150,.16),rgba(140,140,150,.16) 6px,rgba(140,140,150,.07) 6px,rgba(140,140,150,.07) 12px);color:#5f6570}
.sf-cal-eventblock.unavailable::before{background:#9aa0a6}
.cal-event-flags{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:-2px}
.cal-avstack{display:inline-flex;flex:none;align-items:center;vertical-align:middle}
.cal-av{position:relative;width:15px;height:15px;flex:none;border-radius:50%;border:1.5px solid var(--sf-surface);background-size:cover;background-position:center;background-repeat:no-repeat;margin-left:-5px;box-shadow:0 0 0 .5px rgba(0,0,0,.08)}.cal-av:first-child{margin-left:0}
.cal-av-i,.cal-av-more{display:inline-flex;align-items:center;justify-content:center;color:#fff;font:600 8px Inter;text-transform:uppercase}.cal-av-more{background:#c2c4cc}
html[data-theme="dark"] .cal-av{border-color:#fff}
.sf-cal-pill .cal-avstack{margin-left:6px}
.sf-cal-eventblock .cal-avstack{position:absolute;right:6px;bottom:5px}
.sf-cal-eventblock .cal-av{width:18px;height:18px;margin-left:-6px;border-width:1.5px}
.sf-cal-eventblock .cal-av-i,.sf-cal-eventblock .cal-av-more{font-size:10px}
.sf-cal-eventpop{position:fixed;z-index:70;width:300px;max-width:92vw;max-height:80vh;background:var(--sf-surface);border:1px solid var(--sf-border);border-radius:14px;box-shadow:0 18px 50px rgba(15,23,42,.22);display:flex;flex-direction:column;overflow:hidden;animation:cmdkIn .14s cubic-bezier(.22,1,.36,1)}
.sf-cal-ep-head{display:flex;align-items:flex-start;gap:10px;padding:15px 14px 0}
.sf-cal-ep-accent{width:4px;align-self:stretch;min-height:26px;border-radius:2px;background:var(--event-color,#34AADC)}
.sf-cal-ep-title{flex:1;min-width:0;margin:0;font:700 16px Inter;line-height:1.22;color:var(--sf-ink)}
.sf-cal-ep-x{flex:none;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;background:transparent;color:var(--sf-sub);font-size:19px;line-height:1;cursor:pointer}.sf-cal-ep-x:hover{background:var(--sf-hover)}
.sf-cal-ep-body{flex:1;overflow-y:auto;padding:13px 15px 16px;display:flex;flex-direction:column;gap:13px}
.sf-cal-ep-row{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--sf-ink)}.sf-cal-ep-row svg{width:16px;height:16px;flex:none;margin-top:1px;color:var(--sf-sub)}
.sf-cal-ep-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--sf-dim);margin-bottom:6px}
.sf-cal-ep-badges{display:flex;flex-wrap:wrap;gap:6px}
.sf-cal-ep-badge{font:600 10px Inter;text-transform:uppercase;letter-spacing:.04em;padding:3px 9px;border-radius:999px;background:color-mix(in srgb,var(--event-color,#34AADC) 15%,transparent);color:color-mix(in srgb,var(--event-color,#34AADC) 62%,var(--sf-ink))}
.sf-cal-ep-team{display:flex;flex-direction:column;gap:9px}
.sf-cal-ep-member{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--sf-ink)}.sf-cal-ep-member .cal-av{margin-left:0;width:24px;height:24px;border-width:1.5px}
.sf-cal-ep-notes{font-size:13px;line-height:1.5;color:var(--sf-sub);white-space:pre-wrap}
.sf-cal-ep-actions{display:flex;gap:8px;padding:12px 15px;border-top:1px solid var(--sf-border)}.sf-cal-ep-actions .sf-btn{flex:1;justify-content:center}
html[data-theme="dark"] .sf-cal-eventpop{--sf-surface:#1c1c1e;--sf-ink:#f2f2f5;--sf-sub:#9a9aa2;--sf-dim:#7d7d86;--sf-border:rgba(255,255,255,.12);--sf-hover:#2a2a2e;background:#1c1c1e;border-color:rgba(255,255,255,.14)}
/* Day view only: avatars sit inline right after the title/time, vertically centered (matches SVG). */
.sf-cal-daymain .sf-cal-eventblock{display:flex;align-items:center;gap:14px}
.sf-cal-daymain .sf-cal-eb-main{flex:none;min-width:0;max-width:calc(100% - 130px)}
.sf-cal-daymain .sf-cal-eventblock .cal-avstack{position:static;right:auto;bottom:auto}
.sf-cal-daymain .sf-cal-eventblock .cal-av{width:26px;height:26px;margin-left:-9px;border-width:2px}
.sf-cal-addbtn:hover::before{opacity:0}
.sf-cal-addbtn:hover::after{opacity:1}
.sf-cal-timeview{overflow:auto;max-height:calc(100vh - 150px)}.sf-cal-timehead{position:sticky;z-index:5;top:0;display:grid;grid-template-columns:64px repeat(var(--cal-cols),minmax(112px,1fr));min-width:calc(64px + var(--cal-cols) * 112px);border-bottom:1px solid var(--sf-border);background:color-mix(in srgb,var(--sf-bg) 50%,transparent);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4)}
.sf-cal-timecorner{border-right:1px solid var(--sf-border)}.sf-cal-dayhead{padding:10px 6px;border-right:1px solid var(--sf-border);color:var(--sf-sub);font-size:12px;font-weight:650;text-align:center}.sf-cal-dayhead:last-child{border-right:0}.sf-cal-dayhead.today{background:color-mix(in srgb,var(--acc) 6%,var(--sf-surface));color:var(--acc)}
.sf-cal-allday{position:sticky;z-index:4;top:39px;display:grid;grid-template-columns:64px repeat(var(--cal-cols),minmax(112px,1fr));min-width:calc(64px + var(--cal-cols) * 112px);border-bottom:1px solid var(--sf-border);background:color-mix(in srgb,var(--sf-bg) 50%,transparent);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4)}
.sf-cal-daymain .sf-cal-timehead{display:none}
.sf-cal-daymain .sf-cal-allday{top:0}
.sf-cal-daymain .sf-cal-hours{border-right:0}
.sf-cal-daymain .sf-cal-alllabel{border-right:0}
.sf-cal-daymain .sf-cal-timecol.today{background-color:transparent}
.sf-cal-daymain .sf-cal-timecol{background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--cal-hour) - 1px),#F7F7F7 calc(var(--cal-hour) - 1px),#F7F7F7 var(--cal-hour))}
.sf-cal-daymain .sf-cal-allday{border-bottom-color:#F7F7F7}.sf-cal-alllabel{padding:10px 8px;border-right:1px solid var(--sf-border);color:var(--sf-dim);font-size:10px;text-align:right}.sf-cal-allcol{min-height:37px;padding:4px;border-right:1px solid var(--sf-border)}.sf-cal-allcol:last-child{border-right:0}
.sf-cal-timebody{display:grid;grid-template-columns:64px minmax(0,1fr);min-width:calc(64px + var(--cal-cols) * 112px);padding-top:10px}.sf-cal-hours{position:relative;height:calc(24 * var(--cal-hour));border-right:1px solid var(--sf-border)}.sf-cal-hourlabel{position:absolute;right:8px;transform:translateY(-7px);color:var(--sf-dim);font-size:10px}.sf-cal-timecols{display:grid;grid-template-columns:repeat(var(--cal-cols),minmax(112px,1fr))}.sf-cal-timecol{position:relative;height:calc(24 * var(--cal-hour));border-right:1px solid var(--sf-border);background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--cal-hour) - 1px),var(--sf-border) calc(var(--cal-hour) - 1px),var(--sf-border) var(--cal-hour));cursor:pointer}.sf-cal-timecol:last-child{border-right:0}.sf-cal-timecol.today{background-color:color-mix(in srgb,var(--acc) 4%,var(--sf-surface))}.sf-cal-timecol:hover{background-color:color-mix(in srgb,var(--sf-hover) 65%,transparent)}
.sf-cal-eventblock{position:absolute;z-index:2;min-height:24px;overflow:hidden;padding:5px 8px 6px 15px;border:0;border-radius:6px;background:color-mix(in srgb,var(--event-color,#34AADC) 22%,transparent);color:var(--event-color,#34AADC);text-align:left;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.sf-cal-eventblock::before{content:"";position:absolute;left:4px;top:4px;bottom:4px;width:3px;border-radius:1.5px;background:var(--event-color,#34AADC)}
.sf-cal-eb-title{display:block;font:600 12px/1.15 Inter;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-cal-eb-time{display:flex;align-items:center;gap:4px;margin-top:2px;font:400 9px/1 Inter;opacity:.95}
.sf-cal-eb-clock{width:9px;height:9px;flex:none}
.sf-cal-eventblock.video{--event-color:#0891b2}
.sf-cal-eventblock:hover{filter:brightness(1.07)}
.sf-cal-eventblock.dragging{background:var(--event-color,#34AADC);color:#fff;cursor:grabbing;z-index:30;transition:box-shadow .18s ease;
box-shadow:0 10px 26px rgba(0,0,0,.2),0 0 22px 1px rgba(160,163,168,.42),0 0 46px -6px rgba(160,163,168,.52)}
.sf-cal-eventblock.dragging::before{background:#fff}
/* click-selected block: same solid fill as dragging (popup replacement TBD) */
.sf-cal-eventblock.selected{background:var(--event-color,#34AADC);color:#fff}
.sf-cal-eventblock.selected::before{background:#fff}
.sf-cal-eventblock.draft{background:color-mix(in srgb,var(--event-color,#34AADC) 9%,transparent);border:1.5px dashed var(--event-color,#34AADC)}
.sf-cal-eventblock.draft::before{opacity:.45}
.sf-cal-eb-badge{display:inline-block;margin-left:6px;padding:0 6px;border-radius:999px;border:1px solid var(--event-color,#34AADC);color:var(--event-color,#34AADC);font:600 8px/1.55 Inter;vertical-align:1px;text-transform:uppercase;letter-spacing:.04em}
.sf-cal-eb-confirm{position:absolute;top:5px;right:5px;width:20px;height:20px;display:none;align-items:center;justify-content:center;border-radius:6px;background:var(--event-color,#34AADC);color:#fff;cursor:pointer}
.sf-cal-eb-confirm svg{width:12px;height:12px}
.sf-cal-eventblock.draft:hover .sf-cal-eb-confirm{display:inline-flex}
.sf-cal-daylayout{display:grid;grid-template-columns:minmax(0,1fr) 260px}.sf-cal-daymain{min-width:0;border-right:1px solid var(--sf-border)}
/* Day view: the Agenda/Tasks rail is now the GLOBAL #sf-rail (fixed at
right:0, see .sf-rail) — the calendar no longer reserves a grid column
for it; .sf-content itself narrows via body.has-rail. */
.sf-cal.cal-day-full{display:grid;grid-template-columns:minmax(0,1fr)}
/* head + grid live inside .sf-cal-main (one tall flow column) so the head's
position:sticky works against the pane scroll — as a bare grid item its
auto row gave sticky zero travel and it scrolled away. Nav right-aligns
(base rule), lining up with the rail's Agenda/Tasks tabs. */
.sf-cal.cal-day-full .sf-cal-main{min-width:0}
.sf-cal.cal-day-full .sf-cal-daylayout{grid-template-columns:minmax(0,1fr)}
.sf-cal.cal-day-full .sf-cal-daymain{border-right:0}
/* panel scrollers scroll clean — no visible scrollbar indicator */
.sf-cal-timeview,.sf-cal-side{scrollbar-width:none}
.sf-cal-timeview::-webkit-scrollbar,.sf-cal-side::-webkit-scrollbar{display:none}.sf-cal-side{padding:18px;min-height:0;overflow-y:auto;overscroll-behavior:none}.sf-cal-side h3{margin:0 0 12px;font-size:14px}.sf-cal-minihead{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;color:var(--sf-ink);font-size:12px;font-weight:700}.sf-cal-miniwk,.sf-cal-minigrid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}.sf-cal-miniwk span{color:var(--sf-dim);font-size:9px;text-align:center}.sf-cal-miniday{position:relative;display:flex;aspect-ratio:1;align-items:center;justify-content:center;border:0;border-radius:999px;background:transparent;color:var(--sf-ink);font:550 10px Inter;cursor:pointer}.sf-cal-miniday:hover{background:var(--sf-hover)}.sf-cal-miniday.has-ev::after{content:"";position:absolute;left:50%;bottom:1px;transform:translateX(-50%);width:3px;height:3px;border-radius:50%;background:var(--acc)}.sf-cal-miniday.today.has-ev::after{background:currentColor;opacity:.85}.sf-cal-miniday.out{color:var(--sf-dim)}.sf-cal-miniday.today{background:var(--acc);color:#fff}.sf-cal-side-new{width:100%;margin-top:18px}
.sf-cal-agenda{margin-top:2px}
.sf-cal-sidetabs{display:flex;gap:2px;padding:3px;border-radius:999px;background:#eff0f1;margin-bottom:16px}
html[data-theme="dark"] .sf-cal-sidetabs{background:rgba(255,255,255,.08)}
.sf-cal-sidetabs button{flex:1;height:28px;border:0;border-radius:999px;background:transparent;color:var(--sf-sub);font:600 12.5px Inter;cursor:pointer}
.sf-cal-sidetabs button.on{background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 1px 3px rgba(15,23,42,.12)}
html[data-theme="dark"] .sf-cal-sidetabs button.on{background:rgba(255,255,255,.16);color:#fff}
.sf-cal-taskadd{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.sf-cal-taskadd input{flex:1;min-width:0;height:36px;padding:0 12px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:500 13px Inter;outline:none}.sf-cal-taskadd input:focus{border-color:var(--acc)}
.sf-cal-taskadd button{flex:none;width:36px;height:36px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font-size:20px;line-height:1;cursor:pointer}.sf-cal-taskadd button:hover{background:var(--sf-hover)}
.sf-cal-todolist{display:flex;flex-direction:column;gap:1px}
.sf-cal-todo{display:flex;align-items:flex-start;gap:10px;padding:8px 6px;border-radius:9px}.sf-cal-todo:hover{background:var(--sf-hover)}.sf-cal-todo:hover .sf-cal-todo-del{opacity:1}
.sf-cal-todo-check{flex:none;width:18px;height:18px;margin-top:1px;border:1.6px solid var(--sf-border);border-radius:6px;background:transparent;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;color:#fff}.sf-cal-todo-check.on{background:var(--acc);border-color:var(--acc)}.sf-cal-todo-check svg{width:12px;height:12px}
.sf-cal-todo-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sf-cal-todo-title{font-size:13.5px;color:var(--sf-ink);line-height:1.35;word-break:break-word}
.sf-cal-todo.done .sf-cal-todo-title{color:var(--sf-dim);text-decoration:line-through}
.sf-cal-todo-by{display:flex;align-items:center;gap:5px;min-width:0;font-size:11px;color:var(--sf-dim)}
.sf-cal-todo-by>span:first-child{flex:none;white-space:nowrap}
.sf-cal-todo-by .todo-meta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-cal-todo-by .todo-sep{opacity:.55}
.sf-cal-todo.priority-high .sf-cal-todo-check{border-color:#e39a36}
.sf-cal-todo-del{flex:none;width:22px;height:22px;border:0;border-radius:6px;background:transparent;color:var(--sf-dim);font-size:17px;line-height:1;cursor:pointer;opacity:0;transition:opacity .1s}.sf-cal-todo-del:hover{background:var(--sf-hover);color:var(--sf-ink)}
.sf-cal-todo-donehead{margin:12px 0 4px;padding-left:6px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--sf-dim)}
.sf-cal-agenda-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px;font-size:13px;font-weight:700;color:var(--sf-ink)}.sf-cal-agenda-head span{font-size:11px;font-weight:600;color:var(--sf-dim)}
.sf-cal-agenda-empty{color:var(--sf-dim);font-size:12.5px;padding:2px 0 4px}
.sf-cal-agenda-list{display:flex;flex-direction:column;gap:8px}
.sf-cal-task{position:relative;width:100%;text-align:left;padding:10px 12px 10px 15px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);cursor:pointer;transition:background .12s ease,border-color .12s ease}
.sf-cal-task:hover{background:var(--sf-hover);border-color:color-mix(in srgb,var(--event-color,#34AADC) 40%,var(--sf-border))}
.sf-cal-task::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 2px 2px 0;background:var(--event-color,#34AADC)}
.sf-cal-task-top{display:flex;align-items:center;gap:8px}
.sf-cal-task-title{flex:1;min-width:0;font:600 13.5px Inter;color:var(--sf-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-cal-task-meta{margin-top:3px;font-size:11.5px;color:var(--sf-sub)}
.sf-cal-task-desc{margin-top:5px;font-size:12px;line-height:1.4;color:var(--sf-sub);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sf-cal-task-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
/* expanding detail panel inside an agenda card (grid-rows 0fr->1fr slide) */
.sf-cal-task-details{display:grid;grid-template-rows:0fr;transition:grid-template-rows .34s cubic-bezier(.22,1,.36,1)}
.sf-cal-task.open .sf-cal-task-details{grid-template-rows:1fr}
.sf-cal-task-details-in{overflow:hidden;min-height:0}
.sf-cal-task.open{background:var(--sf-hover);border-color:color-mix(in srgb,var(--event-color,#34AADC) 45%,var(--sf-border))}
.sf-cal-task-drow{display:flex;gap:10px;margin-top:9px;font-size:12px;color:var(--sf-sub);line-height:1.45}
.sf-cal-task-drow b{flex:none;width:58px;color:var(--sf-ink);font-weight:650}
.sf-cal-task-drow span{min-width:0;overflow-wrap:anywhere}
.sf-cal-task-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
.sf-cal-task-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px;padding-bottom:2px}
.sf-cal-task-actions .sf-btn{height:29px;padding:0 12px;border-radius:8px;font-size:12px}
.sf-cal-task-actions .sf-btn[disabled]{opacity:.45;cursor:not-allowed}
.sf-cal-task-badge{font:600 9.5px Inter;text-transform:uppercase;letter-spacing:.04em;padding:2px 7px;border-radius:999px;background:color-mix(in srgb,var(--event-color,#34AADC) 14%,transparent);color:color-mix(in srgb,var(--event-color,#34AADC) 60%,var(--sf-ink))}.sf-cal-task-badge.draft{background:rgba(120,120,128,.14);color:var(--sf-sub)}
.sf-cal-catpanel{margin-top:20px;border-top:1px solid var(--sf-border);padding-top:16px}
.sf-cal-catpanel-head{font-size:13px;font-weight:700;color:var(--sf-ink);margin-bottom:10px}
.sf-cal-catseghead{display:flex;gap:2px;padding:3px;border-radius:999px;background:rgba(120,120,128,.14);margin-bottom:12px}
.sf-cal-catseg{flex:1;padding:5px 2px;border:0;border-radius:999px;background:transparent;color:var(--sf-sub);font:600 11px Inter;cursor:pointer}
.sf-cal-catseg.on{background:var(--sf-surface);color:var(--sf-ink);box-shadow:0 1px 3px rgba(15,23,42,.12)}
html[data-theme="dark"] .sf-cal-catseg.on{box-shadow:none;background:rgba(255,255,255,.14)}
.sf-cal-catlist{display:flex;flex-direction:column;gap:1px}
.sf-cal-catrow{display:flex;align-items:center;gap:9px;padding:6px 6px;border-radius:8px}
.sf-cal-catrow:hover{background:var(--sf-hover)}
.sf-cal-catdot{width:11px;height:11px;border-radius:50%;flex:none}
.sf-cal-catname{flex:1;font-size:13px;color:var(--sf-ink);cursor:pointer}
.sf-cal-catlock{width:13px;height:13px;color:var(--sf-dim);flex:none}
.sf-cal-catchk{width:15px;height:15px;flex:none;cursor:pointer}
.sf-cal-catempty{padding:10px 6px;color:var(--sf-dim);font-size:12px}
.sf-cal-catnew{width:100%;margin-top:10px;padding:8px;border:1px dashed var(--sf-border);border-radius:10px;background:transparent;color:var(--sf-sub);font:600 12px Inter;cursor:pointer}
.sf-cal-catnew:hover{background:var(--sf-hover);color:var(--sf-ink)}
.cal-cc-colors{display:flex;flex-wrap:wrap;gap:7px}
.cal-cc-color{width:26px;height:26px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}
.cpk{display:flex;flex-direction:column;gap:10px}
.cpk-sv{position:relative;width:100%;height:132px;border-radius:10px;cursor:crosshair;overflow:hidden;touch-action:none}
.cpk-sv-white{position:absolute;inset:0;background:linear-gradient(to right,#fff,rgba(255,255,255,0))}
.cpk-sv-black{position:absolute;inset:0;background:linear-gradient(to top,#000,rgba(0,0,0,0))}
.cpk-sv-dot{position:absolute;width:14px;height:14px;transform:translate(-50%,-50%);border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.3),0 1px 3px rgba(0,0,0,.45);pointer-events:none}
.cpk-hue{position:relative;height:14px;border-radius:7px;cursor:pointer;touch-action:none;background:linear-gradient(to right,#f00 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,#f00 100%)}
.cpk-hue-dot{position:absolute;top:50%;width:16px;height:16px;transform:translate(-50%,-50%);border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.3),0 1px 3px rgba(0,0,0,.45);pointer-events:none}
.cpk-row{display:flex;align-items:center;gap:8px}
.cpk-swatch{width:34px;height:34px;flex:none;border-radius:8px;border:1px solid var(--sf-border)}
.cpk-hex{flex:1;min-width:0;height:34px;padding:0 11px;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);color:var(--sf-ink);font:600 13px Inter;letter-spacing:.02em;text-transform:uppercase;outline:none}.cpk-hex:focus{border-color:var(--acc)}
.cpk-eye{width:34px;height:34px;flex:none;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);color:var(--sf-ink);cursor:pointer}.cpk-eye:hover{background:var(--sf-hover)}.cpk-eye svg{width:16px;height:16px}
.cal-cc-fn{display:grid;gap:8px}
.cal-cc-fn-head{display:flex;align-items:center;gap:6px;color:var(--sf-sub);font-size:11px;font-weight:650}.cal-cc-fn-head svg{width:14px;height:14px;color:var(--acc)}.cal-cc-fn-head span{margin-left:auto;color:var(--sf-dim);font-weight:600}
.cal-cc-fn-chips{display:flex;flex-wrap:wrap;gap:7px}
.cal-cc-fnchip{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px 0 9px;border:1px solid var(--sf-border);border-radius:999px;background:var(--sf-surface);color:var(--sf-ink);font:600 12.5px Inter;cursor:pointer}.cal-cc-fnchip:hover{background:var(--sf-hover)}
.cal-cc-fnchip.on{border-color:var(--acc);background:color-mix(in srgb,var(--acc) 12%,transparent);color:var(--acc)}
.cal-cc-fnic{display:inline-flex;width:16px;height:16px;flex:none}.cal-cc-fnic svg{width:16px;height:16px}
.cal-cc-color.on{border-color:var(--sf-ink)}
.sf-cal-yearscroll{overflow-y:auto;max-height:calc(100vh - 190px);margin-top:calc(-1 * var(--cal-headh,96px));padding-top:var(--cal-headh,96px);overscroll-behavior:contain;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 30px);mask-image:linear-gradient(to bottom,transparent 0,#000 30px)}
.sf-cal-yeargrid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));grid-template-rows:repeat(3,1fr);gap:12px 40px;padding:0 28px 8px;box-sizing:border-box}
.sf-cal-yearmonth{padding:0;border:0;background:transparent;color:var(--sf-ink);cursor:pointer;text-align:left;display:flex;flex-direction:column;min-height:0}
.sf-cal-yearmonth h3{margin:0 0 4px;font-size:14px;font-weight:700;color:var(--sf-ink)}
.sf-cal-yearmonth .sf-cal-minigrid{flex:1;min-height:0;grid-auto-rows:1fr}
.sf-cal-yearmonth .sf-cal-miniday{pointer-events:none;font-size:10px;aspect-ratio:auto;min-height:0}
.sf-cal-yearmonth .sf-cal-miniwk span{font-size:9px}
.sf-cal-yeargrid .sf-cal-miniday.today{background:radial-gradient(circle 10px at 50% 50%,var(--sf-ink) 97%,transparent 100%);color:var(--sf-surface)}
.cal-searchpop{position:fixed;z-index:10050;top:74px;right:24px;width:360px;max-height:72vh;display:flex;flex-direction:column;border-radius:16px;background:var(--sf-surface);border:1px solid var(--sf-border);box-shadow:0 18px 48px rgba(15,23,42,.22);overflow:hidden;animation:calpop .12s ease}
.cal-searchbar{display:flex;align-items:center;gap:9px;padding:11px 13px;border-bottom:1px solid var(--sf-border)}
.cal-searchbar svg{width:16px;height:16px;flex:none;color:var(--sf-dim)}
.cal-searchbar input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--sf-ink);font:500 14px Inter}
.cal-searchbar button{flex:none;border:0;background:transparent;color:var(--sf-dim);font-size:20px;line-height:1;cursor:pointer}
.cal-searchresults{overflow-y:auto;padding:6px}
.cal-searchhint,.cal-searchempty{padding:26px 20px;text-align:center;color:var(--sf-sub);font-size:13px}
.cal-searchitem{display:flex;align-items:center;gap:10px;width:100%;padding:9px 11px;border:0;border-radius:10px;background:transparent;text-align:left;cursor:pointer}
.cal-searchitem:hover{background:var(--sf-hover)}
.cal-searchitem .dot{width:9px;height:9px;flex:none;border-radius:999px;background:var(--event-color,var(--acc))}
.cal-searchitem .txt{min-width:0}.cal-searchitem b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-ink);font:600 13px Inter}.cal-searchitem span{color:var(--sf-sub);font-size:11px}
html[data-theme="dark"] .cal-searchpop{background:#17171a}
.cal-eventmodal{position:fixed;inset:0;z-index:987;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.46);backdrop-filter:blur(8px) saturate(1.04);-webkit-backdrop-filter:blur(8px) saturate(1.04);animation:sfccfade .18s ease}.cal-eventcard{width:min(94vw,520px);max-height:92vh;overflow:auto;padding:22px;border:1px solid var(--sf-border);border-radius:20px;background:var(--sf-surface);box-shadow:0 28px 80px rgba(15,23,42,.28);color:var(--sf-ink)}
html[data-theme="dark"] .cal-eventcard{--sf-surface:#1c1c1e;--sf-ink:#f2f2f5;--sf-sub:#9a9aa2;--sf-dim:#7d7d86;--sf-border:rgba(255,255,255,.14);--sf-hover:#2a2a2e;background:#1c1c1e;color:#f2f2f5;border-color:rgba(255,255,255,.10)}
html[data-theme="dark"] .cal-eventcard input,html[data-theme="dark"] .cal-eventcard textarea{background:#2c2c2e}
html[data-theme="dark"] .cal-eventcard .sf-btn{background:#2c2c2e;color:#f2f2f5}
html[data-theme="dark"] .cal-eventcard .sf-btn.primary{background:var(--acc);color:#fff}.cal-eventhead{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:17px}.cal-eventhead h2{margin:0;font-size:19px}.cal-eventx{width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:var(--sf-dim);font-size:22px;cursor:pointer}.cal-eventx:hover{background:var(--sf-hover);color:var(--sf-ink)}
.cal-eventform{display:grid;gap:14px}.cal-eventform label{display:grid;gap:6px;color:var(--sf-sub);font-size:11px;font-weight:650}.cal-eventform input,.cal-eventform textarea{width:100%;padding:10px 11px;border:1px solid var(--sf-border);border-radius:10px;outline:none;background:var(--sf-surface);color:var(--sf-ink);font:500 13px Inter}.cal-eventform input:focus,.cal-eventform textarea:focus{border-color:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 14%,transparent)}.cal-eventform .cal-titleinput{padding:12px 14px;font-size:18px;font-weight:700}.cal-eventform textarea{min-height:80px;resize:vertical}.cal-event-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.cal-event-check{display:flex!important;grid-column:1/-1;align-items:center;gap:8px!important}.cal-event-check input{width:15px;height:15px;accent-color:var(--acc)}.cal-video-row{padding:12px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-hover)}.cal-video-toggle{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;color:var(--sf-ink);font:650 13px Inter;cursor:pointer;text-align:left}.cal-video-toggle svg{width:18px;height:18px;color:var(--acc)}.cal-video-toggle .state{margin-left:auto;color:var(--sf-sub);font-size:11px}.cal-video-link{display:flex;align-items:center;gap:7px;margin-top:10px}.cal-video-link input{min-width:0;background:var(--sf-surface);font-size:11px}.cal-video-link button{flex:none}.cal-event-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:4px}
.cal-calfield{width:100%;display:flex;align-items:center;gap:9px;height:40px;padding:0 11px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:500 13px Inter;cursor:pointer;text-align:left}.cal-calfield:hover{background:var(--sf-hover)}
.cal-calfield-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-calfield-dot{width:11px;height:11px;flex:none;border-radius:50%;background:#34AADC}.cal-calfield-dot.none{background:transparent;box-shadow:inset 0 0 0 1.5px var(--sf-dim)}
.cal-calfield-chev{width:15px;height:15px;flex:none;color:var(--sf-dim)}
.cal-calpop{position:fixed;z-index:100000;max-height:320px;overflow-y:auto;padding:6px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);box-shadow:0 16px 44px rgba(15,23,42,.22)}
.cal-calpop-group{padding:9px 10px 4px;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--sf-dim)}
.cal-calpop-row{width:100%;display:flex;align-items:center;gap:10px;padding:9px 10px;border:0;border-radius:8px;background:none;color:var(--sf-ink);font:500 13.5px Inter;cursor:pointer;text-align:left}.cal-calpop-row:hover{background:var(--sf-hover)}
.cal-calpop-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-calpop-chk{width:16px;height:16px;flex:none;color:var(--acc)}
.cal-calpop-div{height:1px;margin:5px 8px;background:var(--sf-border)}
.cal-calpop-plus{width:11px;height:11px;flex:none;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1;color:var(--sf-sub)}
.cal-calpop-new .cal-calpop-name{color:var(--sf-sub);font-weight:600}
.cal-dp{position:fixed;z-index:100000;width:300px;padding:14px;border:1px solid var(--sf-border);border-radius:16px;background:var(--sf-surface);box-shadow:0 20px 50px rgba(15,23,42,.24)}
.cal-dp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.cal-dp-title{font:700 15px Inter;color:var(--sf-ink)}
.cal-dp-navs{display:flex;gap:2px}
.cal-dp-nav{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;background:transparent;color:var(--sf-ink);cursor:pointer}.cal-dp-nav:hover{background:var(--sf-hover)}.cal-dp-nav svg{width:17px;height:17px}
.cal-dp-wk{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:4px}.cal-dp-wk span{text-align:center;font:600 11px Inter;color:var(--sf-dim)}
.cal-dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-dp-day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border:0;border-radius:999px;background:transparent;color:var(--sf-ink);font:600 13px Inter;cursor:pointer}.cal-dp-day:hover{background:var(--sf-hover)}.cal-dp-day.out{color:var(--sf-dim)}
.cal-dp-day.today{position:relative}.cal-dp-day.today::after{content:"";position:absolute;bottom:5px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--acc)}
.cal-dp-day.selected{background:var(--acc);color:#fff}.cal-dp-day.selected::after{display:none}
html[data-theme="dark"] .cal-dp{background:#1c1c1e;border-color:rgba(255,255,255,.12)}
html[data-theme="dark"] .cal-calfield{background:#2c2c2e;border-color:rgba(255,255,255,.14);color:#f2f2f5}html[data-theme="dark"] .cal-calfield:hover{background:#3a3a3c}
html[data-theme="dark"] .cal-calpop{background:#1c1c1e;border-color:rgba(255,255,255,.12)}html[data-theme="dark"] .cal-calpop-row,html[data-theme="dark"] .cal-calfield-name{color:#f2f2f5}html[data-theme="dark"] .cal-calpop-row:hover{background:rgba(255,255,255,.08)}
.cal-addplan{width:100%;justify-content:flex-start;gap:9px!important;margin-bottom:8px;background:color-mix(in srgb,var(--acc) 10%,transparent)!important;color:var(--acc)!important;border:1px solid color-mix(in srgb,var(--acc) 30%,transparent)!important}
.cal-pl-out{display:grid;gap:9px}.cal-pl-out:empty{display:none}
.cal-pl-label{font-size:11px;font-weight:650;color:var(--sf-sub);margin-top:4px}
.cal-pl-items{display:grid;gap:6px}
.cal-pl-item{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--sf-border);border-radius:10px}
.cal-pl-dot{width:10px;height:10px;border-radius:50%;flex:none}
.cal-pl-t{flex:1;font-size:13px;font-weight:600}
.cal-pl-cat{font-size:11px;color:var(--sf-sub)}
.cal-pl-x{border:0;background:transparent;color:var(--sf-dim);font-size:16px;line-height:1;cursor:pointer;padding:0 2px}
.cal-pl-chips{display:flex;flex-wrap:wrap;gap:6px}
.cal-pl-chip{padding:6px 11px;border:1px solid var(--sf-border);border-radius:999px;background:transparent;color:var(--sf-ink);font:600 12px Inter;cursor:pointer}
.cal-pl-chip:hover{background:var(--sf-hover)}
.cal-pl-add{width:100%;margin-top:6px}.cal-event-actions .danger{margin-right:auto;color:#c2413b}.cal-event-actions .primary{background:var(--acc);border-color:var(--acc);color:#fff}.cal-event-saving{opacity:.64;pointer-events:none}
html[data-theme="dark"] .sf-cal .cal-viewseg{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}html[data-theme="dark"] .sf-cal .cal-viewseg button.on{background:rgba(255,255,255,.16);color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.35)}
@media(max-width:1100px){.sf-cal-yeargrid{grid-template-columns:repeat(3,minmax(150px,1fr))}.sf-cal-daylayout{grid-template-columns:1fr}.sf-cal-daymain{border-right:0}}
@media(max-width:720px){.sf-page.cal-page .sf-cal-head{padding:8px 10px}.sf-cal-summary{height:72px}.sf-cal-stat{flex-basis:150px;height:70px;padding:7px 14px}.sf-cal-stat.range{flex-basis:240px;padding:6px 9px}.sf-cal-period-row{grid-template-columns:28px minmax(0,1fr) 28px;gap:4px}.sf-cal-period-nav{width:28px;height:28px}.sf-cal-stat-value b{font-size:17px}.sf-cal-monthgrid{grid-template-rows:repeat(6,minmax(88px,1fr));min-height:530px}.sf-cal-daycell{padding:4px}.sf-cal-pill{padding:0 4px}.sf-cal-pill-time{display:none}.sf-cal-yeargrid{grid-template-columns:repeat(2,minmax(140px,1fr))}.cal-event-row{grid-template-columns:1fr 1fr}.cal-event-row label:first-child{grid-column:1/-1}}
/* AI Agents is a focused app-within-the-app. Keep its conversation history,
but remove the global Attract navigation until the user leaves this view. */
body.shopify.agent-conversation-open[data-view="tm-agents"] .sf-top,
body.shopify[data-view="tm-agent-detail"] .sf-top,
body.shopify.agent-conversation-open[data-view="tm-agents"] .sf-side,
body.shopify[data-view="tm-agent-detail"] .sf-side,
body.shopify.agent-conversation-open[data-view="tm-agents"] .sf-side-backdrop,
body.shopify[data-view="tm-agent-detail"] .sf-side-backdrop,
body.shopify.agent-conversation-open[data-view="tm-agents"] #sf-rail,
body.shopify[data-view="tm-agent-detail"] #sf-rail{display:none!important}
body.shopify.agent-conversation-open[data-view="tm-agents"] .sf-content,
body.shopify[data-view="tm-agent-detail"] .sf-content{top:0;left:0!important;right:0!important;bottom:0;border-radius:0}
body.shopify.agent-conversation-open[data-view="tm-agents"] .sf-content{overflow:hidden;background:var(--sf-bg)}
body.shopify.agent-conversation-open[data-view="tm-agents"] .sf-page{width:100%;max-width:none;height:100%;padding:0}
body.shopify.agent-conversation-open[data-view="tm-agents"] .composer{left:248px;right:0}
body.shopify.sf-collapsed.agent-conversation-open[data-view="tm-agents"] .composer{left:248px}
body.shopify[data-view="tm-agent-detail"] .composer,
body.shopify.sf-collapsed[data-view="tm-agent-detail"] .composer{left:0;right:0}
body.shopify.agent-conversation-open.agent-drawer-open[data-view="tm-agents"] .composer{right:320px}
body.shopify.agent-conversation-open.agent-screen-open[data-view="tm-agents"] .composer{right:340px}
body.shopify.agent-conversation-open .composer::before{display:none!important;content:none!important;background:none!important}
body.shopify.agent-overview-open[data-view="tm-agents"] .composer{display:none!important}
body.shopify.agent-overview-open[data-view="tm-agents"] .sf-content{overflow:hidden}
body.shopify.agent-overview-open[data-view="tm-agents"] .sf-page{box-sizing:border-box;height:100%;min-height:0;overflow:hidden;padding-bottom:24px}
body.shopify.agent-overview-open[data-view="tm-agents"] .agov{box-sizing:border-box;height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding-bottom:24px}
body.shopify.agent-overview-open[data-view="tm-agents"] .agov-agent-index{flex:1;min-height:0;overflow:hidden}
body.shopify.agent-overview-open[data-view="tm-agents"] .agov-agent-table-wrap{height:100%;min-height:0;max-height:none}
body.shopify.agent-overview-open[data-view="tm-agents"] .agov::-webkit-scrollbar{width:0;height:0;display:none}
/* Mission control is the AI Agents landing surface. It keeps the normal
Attract navigation visible; conversations only take over after selection. */
.agov{width:min(1180px,100%);margin:0 auto;padding:18px 0 92px;color:var(--sf-ink)}
.agov-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:22px}
.agov-kicker{margin-bottom:7px;color:var(--sf-dim);font:700 10px/1 Inter;text-transform:uppercase;letter-spacing:.12em}
.agov-head h1{margin:0;font:740 25px/1.1 Inter;letter-spacing:-.04em}.agov-head p{margin:7px 0 0;color:var(--sf-sub);font:520 12.5px/1.5 Inter}
.agov-actions{display:flex;align-items:center;gap:8px}.agov-btn{height:36px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 14px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:620 12px/1 Inter;cursor:pointer}.agov-btn:hover{background:var(--sf-hover)}.agov-btn.primary{border-color:#151517;background:#151517;color:#fff}.agov-btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.agov-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:28px}.agov-stat{min-height:104px;padding:16px;border:1px solid var(--sf-border-2);border-radius:16px;background:var(--sf-surface);box-shadow:0 8px 26px rgba(0,0,0,.035)}.agov-stat-top{display:flex;align-items:flex-start;justify-content:space-between}.agov-stat-label{color:var(--sf-sub);font:570 11px Inter}.agov-stat-icon{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:var(--sf-hover);color:var(--sf-sub)}.agov-stat-icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.agov-stat b{display:block;margin-top:3px;font:730 25px/1 Inter;letter-spacing:-.04em}.agov-stat small{display:block;margin-top:13px;color:var(--sf-dim);font:520 10px Inter}
.agov-rail{height:84px;display:flex;align-items:stretch;overflow:hidden;border:1px solid var(--sf-border);border-radius:14px;background:var(--sf-surface);box-shadow:0 1px 0 rgba(0,0,0,.02)}
.agov-rail-lead{width:190px;flex:none;display:flex;align-items:center;gap:12px;padding:0 20px;border-right:1px solid var(--sf-border-2)}.agov-live-mark{width:38px;height:38px;display:flex;align-items:center;justify-content:center;flex:none;background:transparent}.agov-live-mark .agob-mark{display:block}.agov-rail-lead small,.agov-rail-lead b{display:block}.agov-rail-lead small{margin-bottom:5px;color:var(--sf-dim);font:620 9px/1 Inter;text-transform:uppercase;letter-spacing:.1em}.agov-rail-lead b{font:680 15px/1 Inter}.agov-live-dot{width:7px;height:7px;display:inline-block;margin-left:5px;border-radius:50%;background:#35c76f;box-shadow:0 0 0 3px rgba(53,199,111,.12)}
.agov-rail-metrics{min-width:0;flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.agov-rail-metric{min-width:0;display:flex;flex-direction:column;justify-content:center;padding:0 22px;border-right:1px solid var(--sf-border-2);transition:background .12s}.agov-rail-metric:last-child{border-right:0}.agov-rail-metric:hover{background:var(--sf-hover)}.agov-rail-metric span,.agov-rail-metric strong,.agov-rail-metric small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agov-rail-metric span{color:var(--sf-sub);font:560 11px/1 Inter}.agov-rail-metric strong{margin-top:8px;font:720 18px/1 Inter;letter-spacing:-.025em}.agov-rail-metric small{margin-top:6px;color:var(--sf-dim);font:510 9.5px/1 Inter}
.agov-toolbar{display:flex;align-items:center;gap:9px;margin-top:14px;margin-bottom:26px}.agov-filter{position:relative;flex:none}.agov-filter-btn{min-width:96px;justify-content:space-between}.agov-filter-btn em{margin-left:3px;color:var(--sf-dim);font-style:normal}.agov-filter-btn svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .16s}.agov-filter.open .agov-filter-btn svg{transform:rotate(180deg)}.agov-filter-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:30;width:184px;padding:6px;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);box-shadow:0 14px 35px rgba(0,0,0,.16)}.agov-filter-menu[hidden]{display:none}.agov-filter-menu button{width:100%;display:flex;align-items:center;justify-content:space-between;padding:9px 10px;border:0;border-radius:8px;background:transparent;color:var(--sf-ink);font:560 11px Inter;cursor:pointer}.agov-filter-menu button:hover,.agov-filter-menu button.on{background:var(--sf-hover)}.agov-filter-menu button span{color:var(--sf-dim)}
.agov-search{min-width:280px;flex:1 1 430px}.agov-search .sf-search-inp{flex:1;min-width:0;width:100%;padding:0;border:0;outline:0;background:transparent;box-shadow:none;color:var(--sf-ink);font:inherit;font-size:13px;appearance:none;-webkit-appearance:none}.agov-search .sf-search-inp::placeholder{color:var(--sf-dim);opacity:1}.agov-toolbar-spacer{display:none}.agov-toolbar .sf-ord-btn{height:38px;white-space:nowrap}.agov-toolbar .sf-ord-btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.agov-toolbar .agov-voice-launch{border-color:#151517;background:#151517;color:#fff;box-shadow:0 8px 20px rgba(0,0,0,.12);transition:transform .2s cubic-bezier(.25,1,.5,1),box-shadow .2s cubic-bezier(.25,1,.5,1)}.agov-toolbar .agov-voice-launch:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(0,0,0,.18)}.agov-toolbar .agov-voice-launch svg{stroke-width:1.9}.agov-toolbar .agov-new-task{background:#151517;color:#fff;border-color:#151517}.agov-view-select .agov-filter-btn{min-width:112px}.agov-view-select.priority .agov-filter-btn{min-width:104px}.agov-view-select .agov-filter-menu{right:0;left:auto;width:166px}
.agov-section{margin-top:26px}.agov-section-head{height:28px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px}.agov-section-head h2{margin:0;font:680 12.5px Inter}.agov-section-head span{color:var(--sf-dim);font:520 10.5px Inter}
.agov-agents{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.agov-agent{min-height:154px;display:flex;flex-direction:column;padding:16px;border:1px solid var(--sf-border-2);border-radius:16px;background:var(--sf-surface);color:var(--sf-ink);text-align:left;cursor:pointer;box-shadow:0 8px 26px rgba(0,0,0,.035);transition:transform .16s,border-color .16s,box-shadow .16s}.agov-agent:hover{transform:translateY(-2px);border-color:var(--sf-border);box-shadow:0 13px 32px rgba(0,0,0,.075)}.agov-agent-top{display:flex;align-items:flex-start;justify-content:space-between}.agov-agent .agx-agent-mark{width:39px;height:39px;border-radius:12px}.agov-agent-state{width:7px;height:7px;margin:5px;border-radius:50%;background:#8a8a90}.agov-agent-state.on{background:#35c76f;box-shadow:0 0 0 3px rgba(53,199,111,.12)}.agov-agent b{display:block;margin-top:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:680 13px Inter}.agov-agent>span{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-sub);font:520 10.5px Inter}.agov-agent-foot{display:flex!important;align-items:center;justify-content:space-between;margin-top:auto!important;padding-top:15px;color:var(--sf-dim)!important;font-size:10px!important}.agov-agent-foot i{font-style:normal;transition:color .16s}.agov-agent:hover .agov-agent-foot i{color:var(--sf-ink)}
.agov-agent-index{margin-top:18px}.agov-agent-table-wrap{position:relative;max-height:min(620px,calc(100vh - 300px));min-height:168px;overflow:auto;overscroll-behavior:contain;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-surface);scrollbar-width:none;-ms-overflow-style:none}.agov-agent-table-wrap::-webkit-scrollbar{width:0;height:0;display:none}.agov-agent-table{min-width:960px}.agov-agent-table th,.agov-agent-table td{box-sizing:border-box;white-space:nowrap}.agov-agent-table thead th{position:sticky;top:0;z-index:5;height:46px;border-bottom:0;background:var(--sf-surface)}.agov-agent-table thead th::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--sf-border);pointer-events:none}.agov-agent-table th:first-child,.agov-agent-table td:first-child{position:sticky;left:0;z-index:2;width:220px;min-width:220px;background:var(--sf-surface)}.agov-agent-table th:first-child{z-index:7}.agov-agent-table th:first-child::after,.agov-agent-table td:first-child::after{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:var(--sf-border-2);pointer-events:none}.agov-agent-row{cursor:pointer}.agov-agent-row:hover td{background:var(--sf-hover)}.agov-agent-row:focus-visible{outline:2px solid #2e8df5;outline-offset:-2px}.agov-agent-cell{display:flex;align-items:center;gap:11px;min-width:0}.agov-agent-cell .agx-agent-mark{width:31px;height:31px;border-radius:10px}.agov-agent-cell-copy{min-width:0}.agov-agent-cell-copy b,.agov-agent-cell-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agov-agent-cell-copy b{font:650 12.5px/1.2 Inter}.agov-agent-cell-copy span{margin-top:3px;color:var(--sf-dim);font:510 9.5px/1 Inter}.agov-table-role,.agov-table-work{display:block;max-width:230px;overflow:hidden;text-overflow:ellipsis;color:var(--sf-sub);font:530 11.5px Inter}.agov-table-work{max-width:260px;color:var(--sf-ink);font-weight:560}.agov-status{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid var(--sf-border);border-radius:999px;color:var(--sf-sub);font:620 10.5px/1 Inter}.agov-status i{width:6px;height:6px;border-radius:50%;background:#8a8a90}.agov-status.active{border-color:rgba(53,199,111,.36);color:#2fb968}.agov-status.active i{background:#35c76f}.agov-progress{width:148px;display:flex;align-items:center;gap:10px;--agov-glow:#2e8df5}.agov-progress-track{position:relative;width:105px;height:22px;display:grid;grid-template-columns:repeat(10,1fr);align-items:center;gap:3px}.agov-progress-segment{display:block;width:100%;height:14px;border-radius:999px;background:color-mix(in srgb,var(--agov-glow) 12%,var(--sf-hover));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--agov-glow) 8%,transparent);opacity:.52;transition:height .28s cubic-bezier(.22,1,.36,1),opacity .28s ease,background .28s ease,box-shadow .28s ease,transform .28s cubic-bezier(.22,1,.36,1)}.agov-progress-segment.on{height:18px;opacity:1;background:var(--agov-glow);box-shadow:0 0 5px color-mix(in srgb,var(--agov-glow) 92%,transparent),0 0 13px color-mix(in srgb,var(--agov-glow) 68%,transparent),0 0 24px color-mix(in srgb,var(--agov-glow) 35%,transparent);transform:translateY(-1px)}.agov-progress.live .agov-progress-segment.on:last-of-type{animation:agovProgressBreathe 1.45s ease-in-out infinite}@keyframes agovProgressBreathe{0%,100%{filter:brightness(.92);transform:translateY(-1px) scaleY(.92)}50%{filter:brightness(1.2);transform:translateY(-1px) scaleY(1.08)}}.agov-progress small{min-width:27px;color:var(--sf-dim);font:560 9.5px Inter}.agov-report-count{font:650 11.5px Inter}.agov-last-active{color:var(--sf-sub);font:530 11px Inter}.agov-table-empty{padding:32px!important;color:var(--sf-dim);text-align:center;font:520 11.5px Inter}.agov-agent-row td:last-child{padding-right:10px}.agov-row-arrow{float:right;color:var(--sf-dim);font-size:16px}
.agov-agent-table th:first-child,.agov-agent-table td:first-child{width:300px;min-width:300px}.agov-agent-row td{height:62px}.agov-agent-cell .agx-agent-mark{width:34px;height:34px}.agov-agent-cell-copy{flex:1}.agov-agent-cell-copy .agov-agent-primary{display:flex;align-items:center;gap:8px;min-width:0;margin-top:0;overflow:visible;color:var(--sf-ink);font:inherit}.agov-agent-primary b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agov-agent-date{margin-left:auto;flex:none;color:var(--sf-dim);font:520 9.5px/1 Inter}.agov-agent-cell-copy .agov-agent-message{display:block;min-height:11px;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-dim);font:500 10px/1.1 Inter}.agov-agent-message:empty::after{content:' '}
.agov-progress-webgl{display:block!important;position:fixed;inset:0;z-index:4;width:100vw;height:100vh;pointer-events:none}.agov-progress{position:relative;z-index:auto;width:139px}.agov-progress-track{width:96px;grid-template-columns:repeat(10,5px);gap:4px}.agov-progress-segment{position:relative;isolation:isolate;overflow:hidden;width:5px;height:16px;border-radius:2px;opacity:.72;background:color-mix(in srgb,var(--agov-glow) 5%,#080a0f);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--agov-glow) 5%,transparent);transform:none;filter:none;transition:background-color .2s ease,opacity .2s ease}.agov-progress-segment::before,.agov-progress-segment::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0}.agov-progress-segment.on,.agov-progress.live .agov-progress-segment.on:last-of-type{height:16px;opacity:1;transform:none;filter:none;background:color-mix(in srgb,var(--agov-glow) 13%,#030406);box-shadow:none;animation:none!important}.agov-webgl-active .agov-progress-segment.on::before,.agov-webgl-active .agov-progress-segment.on::after{display:none}.agov-webgl-fallback .agov-progress-segment.on{background:color-mix(in srgb,var(--agov-glow) 64%,#020305);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--agov-glow) 52%,transparent),inset 0 0 3px color-mix(in srgb,var(--agov-glow) 20%,transparent),0 0 3px color-mix(in srgb,var(--agov-glow) 13%,transparent),0 0 6px color-mix(in srgb,var(--agov-glow) 5%,transparent);animation:agovLedFlicker 2.9s linear infinite!important}.agov-webgl-fallback .agov-progress-segment.on::before{opacity:.38;background:repeating-linear-gradient(180deg,transparent 0 1px,rgba(0,0,0,.18) 1px 2px),radial-gradient(ellipse at 50% 50%,var(--agov-glow) 0,color-mix(in srgb,var(--agov-glow) 56%,transparent) 54%,transparent 100%);background-size:100% 2px,100% 100%;animation:agovLedScan 4.8s linear infinite}.agov-webgl-fallback .agov-progress-segment.on::after{opacity:.17;background:repeating-radial-gradient(circle at 27% 33%,var(--agov-glow) 0 .3px,transparent .45px 1.35px),linear-gradient(180deg,transparent 0 38%,color-mix(in srgb,var(--agov-glow) 52%,transparent) 49%,transparent 60%);background-size:3px 4px,100% 28px;background-position:0 0,0 -20px;animation:agovLedTexture 5.7s linear infinite}.agov-progress-segment.on:nth-child(2n),.agov-progress-segment.on:nth-child(2n)::before,.agov-progress-segment.on:nth-child(2n)::after{animation-delay:-.76s!important}.agov-progress-segment.on:nth-child(3n),.agov-progress-segment.on:nth-child(3n)::before,.agov-progress-segment.on:nth-child(3n)::after{animation-delay:-1.63s!important}@keyframes agovLedFlicker{0%,100%{filter:brightness(.975)}25%{filter:brightness(1.006)}54%{filter:brightness(.988)}78%{filter:brightness(1.012)}}@keyframes agovLedScan{from{background-position:0 0,0 0}to{background-position:0 8px,0 0}}@keyframes agovLedTexture{from{background-position:0 0,0 -20px}to{background-position:7px 11px,0 20px}}
.agov-toolbar{margin-top:14px;margin-bottom:0}
.agov-toolbar .agov-search{width:auto;max-width:none;height:38px;flex:1 1 auto}
.agov-toolbar+.agov-agent-index{margin-top:14px}
.agov-agent-table-wrap{overscroll-behavior:none;-webkit-overflow-scrolling:auto}
.agov-table-work.empty{color:var(--sf-dim);font-weight:520}
.agov-progress-webgl{z-index:7}
.agov-webgl-fallback .agov-progress-segment.on{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--agov-glow) 68%,transparent),inset 0 0 4px color-mix(in srgb,var(--agov-glow) 34%,transparent),0 0 4px color-mix(in srgb,var(--agov-glow) 38%,transparent),0 0 9px color-mix(in srgb,var(--agov-glow) 20%,transparent),0 0 16px color-mix(in srgb,var(--agov-glow) 9%,transparent)}
.agov-progress-webgl{display:none!important}.agov-progress-segment,.agov-progress-segment.on,.agov-progress.live .agov-progress-segment.on:last-of-type,.agov-webgl-fallback .agov-progress-segment.on{height:16px;transform:none;filter:none;animation:none!important;box-shadow:none}.agov-progress-segment::before,.agov-progress-segment::after{display:none!important}.agov-progress-segment{opacity:1;background:rgba(0,0,0,.08);box-shadow:inset 0 0 0 1px rgba(0,0,0,.035)}.agov-progress-segment.on,.agov-progress.live .agov-progress-segment.on:last-of-type,.agov-webgl-fallback .agov-progress-segment.on{background:#000;box-shadow:none}html[data-theme="dark"] .agov-progress-segment{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)}html[data-theme="dark"] .agov-progress-segment.on,html[data-theme="dark"] .agov-progress.live .agov-progress-segment.on:last-of-type,html[data-theme="dark"] .agov-webgl-fallback .agov-progress-segment.on{background:#fff;box-shadow:none}
html[data-theme="light"] .agov-progress-segment.on,html[data-theme="light"] .agov-progress.live .agov-progress-segment.on:last-of-type,html[data-theme="dark"] .agov-progress-segment.on,html[data-theme="dark"] .agov-progress.live .agov-progress-segment.on:last-of-type{background:#35c76f!important}
.agov-progress-segment,html[data-theme="dark"] .agov-progress-segment{border:0!important;outline:0!important;box-shadow:none!important}
@media(prefers-reduced-motion:reduce){.agov-progress.live .agov-progress-segment.on:last-of-type,.agov-progress-segment.on,.agov-progress-segment.on::before,.agov-progress-segment.on::after{animation:none!important}.agov-progress-segment{transition:none}}
.agov-runs{overflow:hidden;border:1px solid var(--sf-border-2);border-radius:16px;background:var(--sf-surface);box-shadow:0 8px 26px rgba(0,0,0,.035)}.agov-run{width:100%;min-height:61px;display:grid;grid-template-columns:32px minmax(0,1fr) 120px 18px;align-items:center;gap:11px;padding:10px 14px;border:0;border-bottom:1px solid var(--sf-border-2);background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}.agov-run:last-child{border-bottom:0}.agov-run:hover{background:var(--sf-hover)}.agov-run-icon{width:29px;height:29px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:var(--sf-hover);color:var(--sf-sub)}.agov-run-icon svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.agov-run-copy{min-width:0}.agov-run-copy b,.agov-run-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agov-run-copy b{font:620 11.5px Inter}.agov-run-copy span{margin-top:3px;color:var(--sf-dim);font:510 10px Inter}.agov-run-status{text-align:right;color:var(--sf-sub);font:550 10px Inter}.agov-run-arrow{color:var(--sf-dim);font-size:15px}.agov-empty{padding:28px;color:var(--sf-dim);text-align:center;font:520 11.5px Inter}
@media(max-width:950px){.agov-agents{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:980px){.agov-toolbar{flex-wrap:wrap}.agov-search{min-width:340px}.agov-toolbar .agov-new-task{margin-left:auto}}
@media(max-width:700px){.agov{padding-top:6px}.agov-head{align-items:flex-start;flex-direction:column}.agov-stats{grid-template-columns:1fr}.agov-rail{height:auto;overflow-x:auto}.agov-rail-lead{width:150px;min-height:76px}.agov-rail-metrics{min-width:540px}.agov-toolbar{align-items:stretch;flex-wrap:wrap}.agov-search{order:3;min-width:100%;flex-basis:100%}.agov-toolbar-spacer{display:none}.agov-toolbar .sf-ord-btn{flex:1}.agov-view-select{flex:1}.agov-view-select .agov-filter-btn{width:100%}.agov-toolbar .agov-new-task{margin-left:0}.agov-agents{grid-template-columns:1fr}.agov-run{grid-template-columns:32px minmax(0,1fr) 18px}.agov-run-status{display:none}}
.agx-shell{height:100%;min-height:0;display:grid;grid-template-columns:248px minmax(0,1fr) 0;background:var(--sf-bg);color:var(--sf-ink);overflow:hidden;transition:grid-template-columns .28s cubic-bezier(.22,1,.36,1)}
.agx-shell.drawer-open{grid-template-columns:248px minmax(0,1fr) 320px}
.agx-shell.screen-open{grid-template-columns:248px minmax(0,1fr) 340px}
.agx-history{min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;border-right:1px solid var(--sf-border-2);background:var(--sf-bg)}
.agx-history-head{height:64px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px;border-bottom:1px solid var(--sf-border-2)}
.agx-history-title{min-width:0;display:flex;align-items:center;gap:5px}
.agx-history-head h2{margin:0;font:720 14px/1 Inter;letter-spacing:-.01em}
.agx-iconbtn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;flex:none;border:0;border-radius:10px;background:transparent;color:var(--sf-sub);cursor:pointer}
.agx-iconbtn:hover,.agx-iconbtn.on{background:var(--sf-hover);color:var(--sf-ink)}
.agx-iconbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.agx-add-wrap{position:relative;display:flex}
.agx-create-menu{position:absolute;z-index:70;right:-6px;top:42px;width:188px;padding:7px;border:1px solid var(--sf-border);border-radius:15px;background:var(--sf-surface);box-shadow:0 18px 50px rgba(0,0,0,.22)}
.agx-create-menu[hidden]{display:none}.agx-create-menu button{width:100%;height:41px;display:flex;align-items:center;gap:11px;padding:0 11px;border:0;border-radius:10px;background:transparent;color:var(--sf-ink);font:590 13px/1 Inter;text-align:left;cursor:pointer}.agx-create-menu button:hover,.agx-create-menu button:focus-visible{background:var(--sf-hover);outline:0}.agx-create-menu svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.agx-create-menu .hash{width:19px;color:var(--sf-ink);font:430 25px/1 Inter;text-align:center}
.agx-bot-picker{position:fixed;z-index:180;inset:0;display:flex;align-items:flex-start;justify-content:center;padding:8px 24px;background:rgba(12,12,14,.12);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.agx-bot-picker[hidden]{display:none}
.agx-bot-picker-panel{width:min(760px,calc(100vw - 48px));overflow:hidden;border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);box-shadow:0 24px 70px rgba(0,0,0,.22);animation:cmdkIn .16s cubic-bezier(.22,1,.36,1)}
.agx-bot-picker-search{height:59px;display:flex;align-items:center;padding:0 17px;border-bottom:1px solid var(--sf-border-2);color:var(--sf-dim);font:520 18px/1 Inter}.agx-bot-picker-search span{flex:none}.agx-bot-picker-search input{min-width:0;flex:1;height:100%;padding:0 0 0 5px;border:0;outline:0;background:transparent;color:var(--sf-ink);font:520 18px/1 Inter}.agx-bot-picker-search input::placeholder{color:var(--sf-dim)}
.agx-bot-picker-results{max-height:min(430px,calc(100vh - 148px));overflow-y:auto;padding:8px 12px 9px}.agx-bot-picker-row{width:100%;min-height:52px;display:flex;align-items:center;gap:12px;padding:7px 10px;border:0;border-radius:12px;background:transparent;color:var(--sf-ink);font:540 15px/1.2 Inter;text-align:left;cursor:pointer}.agx-bot-picker-row:hover,.agx-bot-picker-row.selected{background:var(--sf-sel)}.agx-bot-picker-row[hidden]{display:none}.agx-bot-picker-create-icon{width:30px;height:30px;display:grid;place-items:center;flex:none;border-radius:50%;background:var(--sf-hover);color:var(--sf-sub);font:350 24px/1 Inter}.agx-bot-picker-row .agob-mark{flex:none}.agx-bot-picker-name{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agx-bot-picker-key{display:flex;align-items:center;gap:4px;margin-left:auto;color:var(--sf-dim)}.agx-bot-picker-key kbd,.agx-bot-picker-foot kbd{min-width:23px;height:23px;display:inline-grid;place-items:center;padding:0 5px;border:1px solid var(--sf-border-2);border-radius:6px;background:var(--sf-hover);color:var(--sf-sub);font:520 11px/1 Inter;box-shadow:none}
.agx-bot-picker-empty{padding:26px;color:var(--sf-dim);font:520 12px/1.4 Inter;text-align:center}.agx-bot-picker-foot{height:43px;display:flex;align-items:center;justify-content:flex-end;gap:7px;padding:0 14px;border-top:1px solid var(--sf-border-2);color:var(--sf-dim);font:520 11px/1 Inter}
.agx-history-list{flex:1;min-height:0;overflow-y:auto;padding:10px 8px 22px}
.agx-account-dock{flex:none;margin:0 8px 12px;padding:8px 0 0;border-top:1px solid var(--sf-border)}.agx-account-dock.sf-acct{margin-top:0}.agx-account-dock .sf-acct-btn{min-height:48px;padding:5px 8px;border-radius:13px}.agx-account-dock .sf-acct-name{font-size:12.5px}.agx-account-dock .sf-acct-sub{font-size:10.5px}
.agx-history-label{padding:9px 8px 7px;color:var(--sf-dim);font:650 10px/1 Inter;text-transform:uppercase;letter-spacing:.07em}
.agx-session{position:relative;width:100%;display:block;padding:10px 11px 10px 24px;border:0;border-radius:12px;background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}
.agx-session:hover{background:var(--sf-hover)}
.agx-session.on{background:var(--sf-sel)}
.agx-session-dot{position:absolute;left:10px;top:16px;width:6px;height:6px;border-radius:50%;background:#777}
.agx-session[data-status="working"] .agx-session-dot{background:#35c76f;box-shadow:0 0 0 3px rgba(53,199,111,.12)}
.agx-session[data-status^="needs_"] .agx-session-dot,.agx-session[data-status="failed"] .agx-session-dot{background:#ff9f0a}
.agx-session-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:620 12.5px/1.3 Inter}
.agx-session-meta{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-dim);font:530 10.5px/1.25 Inter}
.agx-history-empty{padding:28px 13px;color:var(--sf-dim);text-align:center;font:520 12px/1.55 Inter}
.agx-main{position:relative;min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;overflow:hidden;background:var(--sf-surface)}
.agx-top{position:relative;z-index:8;height:64px;flex:none;display:grid;grid-template-columns:minmax(150px,1fr) minmax(150px,1fr);align-items:center;gap:12px;padding:0 18px;border-bottom:1px solid var(--sf-border-2);background:color-mix(in srgb,var(--sf-surface) 94%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.agx-agent-wrap{position:relative;justify-self:start}
.agx-agent-trigger{max-width:240px;height:38px;display:flex;align-items:center;gap:9px;padding:0 10px 0 7px;border:0;border-radius:12px;background:transparent;color:var(--sf-ink);cursor:pointer}
.agx-agent-trigger:hover{background:var(--sf-hover)}
.agx-agent-identity{cursor:default}.agx-agent-identity:hover{background:transparent}
.agx-agent-mark{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;flex:none;border-radius:9px;background:#18181a;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.agx-agent-mark svg{width:14px;height:14px}
.agx-agent-copy{min-width:0;text-align:left}.agx-agent-copy b,.agx-agent-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agx-agent-copy b{font:680 12.5px/1.2 Inter}.agx-agent-copy b[contenteditable="true"]{min-width:90px;padding:4px 8px;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);overflow:visible;text-overflow:clip;cursor:text;outline:0;box-shadow:0 1px 2px rgba(0,0,0,.06);caret-color:var(--sf-ink)}.agx-agent-copy span{margin-top:2px;color:var(--sf-dim);font:520 10px/1 Inter}
.agx-agent-trigger>.chev{width:12px;height:12px;fill:none;stroke:var(--sf-dim);stroke-width:2;flex:none}
.agx-agent-menu{position:absolute;z-index:40;left:0;top:46px;width:278px;max-height:min(520px,calc(100vh - 142px));overflow-y:auto;padding:7px;border:1px solid var(--sf-border);border-radius:15px;background:var(--sf-surface);box-shadow:0 22px 60px rgba(0,0,0,.28)}
.agx-agent-menu[hidden]{display:none}.agx-agent-menu-label{padding:8px 9px 6px;color:var(--sf-dim);font:650 10px Inter;text-transform:uppercase;letter-spacing:.06em}
.agx-agent-option{width:100%;display:flex;align-items:center;gap:10px;padding:9px;border:0;border-radius:10px;background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}.agx-agent-option:hover,.agx-agent-option.on{background:var(--sf-hover)}
.agx-agent-option .agx-agent-mark{width:25px;height:25px;border-radius:8px}.agx-agent-option-copy{min-width:0;flex:1}.agx-agent-option-copy b,.agx-agent-option-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agx-agent-option-copy b{font:630 12px Inter}.agx-agent-option-copy span{margin-top:2px;color:var(--sf-dim);font-size:10px}.agx-agent-state{width:6px;height:6px;border-radius:50%;background:#666}.agx-agent-state.on{background:#35c76f}
.agx-context-menu{position:fixed;z-index:160;width:202px;padding:5px;border:1px solid var(--sf-border);border-radius:13px;background:var(--sf-surface);box-shadow:0 16px 42px rgba(0,0,0,.24)}
.agx-context-menu[hidden]{display:none}.agx-context-menu button{width:100%;height:34px;display:flex;align-items:center;gap:9px;padding:0 9px;border:0;border-radius:8px;background:transparent;color:var(--sf-ink);font:560 11.5px/1 Inter;text-align:left;cursor:pointer}.agx-context-menu button:hover,.agx-context-menu button:focus-visible{background:var(--sf-hover);outline:0}.agx-context-menu button.danger{color:#df3038}.agx-context-menu svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.agx-context-sep{height:1px;margin:4px 6px;background:var(--sf-border-2)}
.agx-delete-overlay{position:fixed;z-index:190;inset:0;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.43)}.agx-delete-overlay[hidden]{display:none}
.agx-delete-dialog{width:min(430px,calc(100vw - 32px));overflow:hidden;border:1px solid var(--sf-border);border-radius:17px;background:var(--sf-surface);box-shadow:0 28px 90px rgba(0,0,0,.34)}
.agx-delete-copy{padding:22px 22px 17px}.agx-delete-copy h2{margin:0;color:var(--sf-ink);font:690 16px/1.25 Inter;letter-spacing:-.015em}.agx-delete-copy p{margin:11px 0 0;color:var(--sf-sub);font:520 13px/1.55 Inter}.agx-delete-error{margin-top:10px;color:#df3038;font:560 11px/1.4 Inter}.agx-delete-error[hidden]{display:none}
.agx-delete-actions{display:flex;justify-content:flex-end;gap:8px;padding:0 22px 20px}.agx-delete-actions button{height:36px;padding:0 15px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-hover);color:var(--sf-ink);font:620 12px/1 Inter;cursor:pointer}.agx-delete-actions button:hover{filter:brightness(.97)}.agx-delete-actions .danger{border-color:#ff3348;background:#ff3348;color:#fff}.agx-delete-actions button:disabled{opacity:.58;cursor:wait}
.agx-channel-overlay{position:fixed;z-index:170;inset:0;display:grid;place-items:center;padding:24px;background:rgba(0,0,0,.46);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.agx-channel-overlay[hidden]{display:none}
.agx-channel-dialog{width:min(540px,calc(100vw - 32px));max-height:min(680px,calc(100vh - 40px));display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--sf-border);border-radius:18px;background:var(--sf-surface);box-shadow:0 28px 90px rgba(0,0,0,.36)}
.agx-channel-head{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid var(--sf-border-2)}.agx-channel-head h2{margin:0;font:680 15px Inter}.agx-channel-close{width:32px;height:32px;border:0;border-radius:9px;background:transparent;color:var(--sf-sub);font-size:24px;line-height:1;cursor:pointer}.agx-channel-close:hover{background:var(--sf-hover);color:var(--sf-ink)}
.agx-channel-body{min-height:0;overflow-y:auto;padding:20px 18px}.agx-channel-field{display:block;color:var(--sf-dim);font:560 11px Inter}.agx-channel-field input,.agx-channel-search{width:100%;height:42px;margin-top:8px;padding:0 12px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:520 13px Inter;outline:0}.agx-channel-field input:focus,.agx-channel-search:focus{border-color:#2e8df5;box-shadow:0 0 0 3px rgba(46,141,245,.12)}.agx-channel-label{display:block;margin:18px 0 8px;color:var(--sf-dim);font:560 11px Inter}.agx-channel-list{max-height:300px;overflow-y:auto;border:1px solid var(--sf-border);border-radius:11px}.agx-channel-agent{min-height:48px;display:flex;align-items:center;gap:10px;padding:8px 11px;border-bottom:1px solid var(--sf-border-2);cursor:pointer}.agx-channel-agent:last-child{border-bottom:0}.agx-channel-agent:hover{background:var(--sf-hover)}.agx-channel-agent input{width:16px;height:16px;margin:0;accent-color:#2e8df5}.agx-channel-agent-copy{min-width:0;flex:1}.agx-channel-agent-copy b,.agx-channel-agent-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agx-channel-agent-copy b{font:620 12px Inter}.agx-channel-agent-copy span{margin-top:2px;color:var(--sf-dim);font:510 10px Inter}.agx-channel-empty{padding:25px;color:var(--sf-dim);font:520 12px Inter;text-align:center}
.agx-channel-foot{height:64px;display:flex;align-items:center;justify-content:flex-end;padding:0 18px;border-top:1px solid var(--sf-border-2)}.agx-channel-submit{height:36px;padding:0 18px;border:0;border-radius:10px;background:#050505;color:#fff;font:620 12px Inter;cursor:pointer}.agx-channel-submit:disabled{opacity:.24;cursor:not-allowed}
.agx-top-actions{justify-self:end;display:flex;align-items:center;gap:4px}
.agx-mobile-exit{display:none}
.agx-transcript{flex:1 1 auto;min-height:0;height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;padding:32px max(24px,calc((100% - 760px)/2)) 154px;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--sf-border) transparent}
.agx-transcript::-webkit-scrollbar{width:8px}.agx-transcript::-webkit-scrollbar-track{background:transparent}.agx-transcript::-webkit-scrollbar-thumb{border:2px solid transparent;border-radius:999px;background:var(--sf-border);background-clip:padding-box}
.agx-empty{min-height:calc(100vh - 260px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-bottom:42px}
.agx-empty-mark{width:46px;height:46px;display:flex;align-items:center;justify-content:center;margin-bottom:19px;border-radius:15px;background:#151517;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.agx-empty-mark svg{width:23px;height:23px}.agx-empty h1{max-width:620px;margin:0;color:var(--sf-ink);font:720 clamp(27px,3vw,40px)/1.08 Inter;letter-spacing:-.045em;text-wrap:balance}.agx-empty p{max-width:490px;margin:12px 0 0;color:var(--sf-dim);font:520 14px/1.55 Inter;text-wrap:balance}
.agx-starters{width:min(560px,100%);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:26px}.agx-starter{min-height:56px;padding:11px 13px;border:1px solid var(--sf-border-2);border-radius:13px;background:transparent;color:var(--sf-sub);font:560 12px/1.35 Inter;text-align:left;cursor:pointer}.agx-starter:hover{border-color:var(--sf-border);background:var(--sf-hover);color:var(--sf-ink)}
.agx-turn{width:100%;margin:0 0 24px}.agx-turn.user{display:flex;justify-content:flex-end}.agx-user-bubble{max-width:min(82%,620px);padding:10px 15px;border-radius:17px;background:#050505;color:#fff;font:520 14px/1.55 Inter;white-space:pre-wrap;overflow-wrap:anywhere}.agx-turn.assistant{display:grid;justify-items:start;gap:8px}.agx-assistant,.agx-progress-bubble{max-width:720px;padding:12px 15px;border-radius:18px;background:var(--sf-hover);color:var(--sf-ink);font:520 14.5px/1.7 Inter;overflow-wrap:anywhere}.agx-progress-bubble{font-size:14px}.agx-typing{display:flex;align-items:center;gap:4px;padding:13px 15px;border-radius:18px;background:var(--sf-hover)}.agx-typing i{width:6px;height:6px;border-radius:50%;background:var(--sf-dim);animation:agxTyping 1.05s ease-in-out infinite}.agx-typing i:nth-child(2){animation-delay:.14s}.agx-typing i:nth-child(3){animation-delay:.28s}@keyframes agxTyping{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}.agx-assistant>:first-child{margin-top:0}.agx-assistant>:last-child{margin-bottom:0}.agx-time-note,.agx-system-note{width:100%;padding:2px 12px;color:var(--sf-dim);font:520 12px/1.4 Inter;text-align:center}.agx-time-note{margin:22px 0 12px;font-size:13px}.agx-system-note{margin:0 0 14px}
.agx-trace{max-width:720px;margin:0 0 12px;border:1px solid var(--sf-border-2);border-radius:13px;background:color-mix(in srgb,var(--sf-hover) 45%,transparent);overflow:hidden}.agx-trace summary{min-height:40px;display:flex;align-items:center;gap:9px;padding:0 12px;list-style:none;color:var(--sf-sub);font:610 11.5px Inter;cursor:pointer}.agx-trace summary::-webkit-details-marker{display:none}.agx-trace summary::after{content:'›';margin-left:auto;color:var(--sf-dim);font-size:17px;transform:rotate(90deg);transition:transform .16s}.agx-trace:not([open]) summary::after{transform:rotate(0)}
.agx-trace-orb{width:8px;height:8px;border-radius:50%;background:#777;flex:none}.agx-trace.pending .agx-trace-orb{background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.08);animation:agxPulse 1.15s ease-in-out infinite alternate}@keyframes agxPulse{to{opacity:.35;transform:scale(.74)}}
.agx-trace-list{display:grid;gap:0;padding:0 12px 9px}.agx-trace-row{position:relative;padding:7px 7px 7px 18px;border-top:1px solid var(--sf-border-2);color:var(--sf-dim);font:520 11px/1.4 Inter}.agx-trace-row::before{content:'';position:absolute;left:4px;top:12px;width:5px;height:5px;border-radius:50%;background:#5c5c63}.agx-trace-row.active{color:var(--sf-sub)}.agx-trace-row.active::before{background:#fff}
.agx-sources,.agx-files{max-width:720px;display:grid;gap:7px;margin:12px 0}.agx-source,.agx-file{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 11px;border:1px solid var(--sf-border-2);border-radius:12px;background:transparent;color:var(--sf-ink);text-decoration:none}.agx-source:hover,.agx-file:hover{background:var(--sf-hover)}.agx-source-ic,.agx-file-ic{width:30px;height:30px;display:flex;align-items:center;justify-content:center;flex:none;border-radius:9px;background:var(--sf-hover);color:var(--sf-sub);font:700 9px Inter;text-transform:uppercase}.agx-source-copy,.agx-file-copy{min-width:0;flex:1}.agx-source-copy b,.agx-source-copy span,.agx-file-copy b,.agx-file-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agx-source-copy b,.agx-file-copy b{font:620 11.5px Inter}.agx-source-copy span,.agx-file-copy span{margin-top:3px;color:var(--sf-dim);font:520 10px Inter}
.agx-approval{max-width:720px;margin:14px 0;padding:14px;border:1px solid rgba(255,159,10,.35);border-radius:14px;background:rgba(255,159,10,.07)}.agx-approval-kicker{color:#ff9f0a;font:700 10px Inter;text-transform:uppercase;letter-spacing:.06em}.agx-approval h3{margin:6px 0 4px;font:680 13px/1.3 Inter}.agx-approval p{margin:0;color:var(--sf-sub);font:520 11.5px/1.5 Inter}.agx-approval-actions{display:flex;gap:8px;margin-top:12px}.agx-approval-actions button{height:32px;padding:0 13px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);font:630 11.5px Inter;cursor:pointer}.agx-approval-actions button.primary{border-color:#fff;background:#fff;color:#000}
.agx-activation{max-width:720px;margin:14px 0;padding:15px;border:1px solid var(--sf-border);border-radius:15px;background:color-mix(in srgb,var(--sf-hover) 64%,transparent)}.agx-activation-kicker{color:var(--sf-dim);font:700 10px Inter;text-transform:uppercase;letter-spacing:.06em}.agx-activation h3{margin:6px 0 4px;font:680 13px/1.3 Inter}.agx-activation p{margin:0;color:var(--sf-sub);font:520 11.5px/1.5 Inter}.agx-activation-skills{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.agx-activation-skills span{padding:4px 7px;border-radius:999px;background:var(--sf-surface);color:var(--sf-dim);font:600 9.5px Inter}.agx-activation-actions{display:flex;gap:8px;margin-top:13px}.agx-activation-actions button{height:32px;padding:0 13px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);font:630 11.5px Inter;cursor:pointer}.agx-activation-actions button.primary{border-color:#fff;background:#fff;color:#000}.agx-activation-actions button:disabled{opacity:.55;cursor:wait}
.agx-bot-card{padding:12px;border:1px solid var(--sf-border-2);border-radius:12px;background:color-mix(in srgb,var(--sf-hover) 48%,transparent)}.agx-bot-head{display:flex;align-items:center;gap:8px}.agx-bot-head b{font:660 11.5px Inter}.agx-bot-state{margin-left:auto;color:var(--sf-sub);font:620 10.5px Inter}.agx-bot-dot{width:7px;height:7px;flex:none;border-radius:50%;background:#666}.agx-bot-dot.connected{background:#32d583;box-shadow:0 0 0 3px rgba(50,213,131,.1)}.agx-bot-dot.degraded{background:#f7b84b}.agx-bot-dot.unavailable{background:#ff6b63}.agx-bot-copy{margin-top:8px;color:var(--sf-dim);font:520 10.5px/1.48 Inter}.agx-bot-note{margin-top:8px;padding-top:8px;border-top:1px solid var(--sf-border-2);color:var(--sf-sub);font:520 10px/1.45 Inter}.agx-bot-capabilities{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.agx-bot-capabilities span{padding:4px 7px;border-radius:999px;background:var(--sf-surface);color:var(--sf-dim);font:600 9px Inter}.agx-bot-refresh{height:30px;margin-top:9px;padding:0 10px;border:1px solid var(--sf-border);border-radius:9px;background:transparent;color:var(--sf-ink);font:620 10.5px Inter;cursor:pointer}.agx-bot-refresh:hover{background:var(--sf-hover)}.agx-bot-refresh:disabled{opacity:.55;cursor:wait}
.agx-drawer{min-width:0;overflow:hidden;border-left:1px solid var(--sf-border-2);background:var(--sf-bg)}.agx-drawer-in{width:320px;height:100%;display:flex;flex-direction:column}.agx-drawer-head{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--sf-border-2)}.agx-drawer-head h2{margin:0;font:700 13px Inter}.agx-drawer-settings-head{display:grid;grid-template-columns:34px minmax(0,1fr) 34px;padding:0 10px}.agx-drawer-settings-head h2{text-align:center;font:620 15px/1 Inter}.agx-drawer-nav{width:34px;height:34px;display:grid;place-items:center;padding:0;border:0;border-radius:9px;background:transparent;color:var(--sf-dim);cursor:pointer}.agx-drawer-nav:hover{background:var(--sf-hover);color:var(--sf-ink)}.agx-drawer-nav svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}.agx-drawer-scroll{flex:1;overflow-y:auto;padding:0 17px 28px}.agx-drawer-section{padding:14px 2px;border-bottom:1px solid var(--sf-border-2)}.agx-drawer-section:last-child{border-bottom:0}.agx-drawer-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;color:var(--sf-ink);font:680 11.5px Inter}.agx-drawer-sub{color:var(--sf-dim);font:520 10.5px/1.5 Inter}.agx-drawer-list{display:grid;gap:8px}.agx-activity{display:grid;grid-template-columns:7px minmax(0,1fr);gap:8px;align-items:start}.agx-activity i{width:6px;height:6px;margin-top:4px;border-radius:50%;background:#67676e}.agx-activity span{color:var(--sf-sub);font:530 10.5px/1.4 Inter}.agx-chips{display:flex;flex-wrap:wrap;gap:6px}.agx-chip{padding:5px 8px;border-radius:999px;background:var(--sf-hover);color:var(--sf-sub);font:600 9.5px Inter}
.agx-screen-in{width:340px;height:100%;display:flex;flex-direction:column;background:var(--sf-bg)}
.agx-screen-head{height:64px;display:flex;align-items:center;justify-content:flex-end;gap:4px;padding:0 13px}
.agx-screen-head .collapse svg{width:20px;height:20px}
.agx-screen-stage{padding:0 16px;text-align:center}
.agx-screen-preview{position:relative;width:100%;aspect-ratio:16/10;display:grid;place-items:center;overflow:hidden;padding:0;border:1px solid var(--sf-border);border-radius:12px;background:color-mix(in srgb,var(--sf-hover) 76%,var(--sf-surface));color:var(--sf-dim);cursor:pointer}
.agx-screen-preview:hover{border-color:color-mix(in srgb,var(--sf-ink) 22%,var(--sf-border));background:var(--sf-hover)}
.agx-screen-preview:focus-visible{outline:2px solid #2e8df5;outline-offset:2px}
.agx-screen-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#d8d8da}
.agx-screen-preview img[hidden]{display:none}
.agx-screen-monitor{display:grid;justify-items:center;gap:9px;color:var(--sf-dim);font:560 11px/1.3 Inter}
.agx-screen-monitor svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.agx-screen-monitor[hidden]{display:none}
.agx-screen-label{margin:11px 0 0;color:var(--sf-sub);font:520 13px/1.35 Inter}
.agx-screen-state{min-height:15px;margin-top:5px;color:var(--sf-dim);font:520 10px/1.35 Inter}
.agx-routines-empty{flex:1;min-height:250px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 28px 92px;text-align:center}
.agx-routines-empty p{max-width:250px;margin:0;color:var(--sf-dim);font:520 13px/1.42 Inter}
.agx-routine-create{height:39px;margin-top:14px;padding:0 16px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:560 13px Inter;cursor:pointer}
.agx-routine-create:hover{background:var(--sf-hover)}
.agx-desktop-starting{position:fixed;z-index:480;inset:0;display:grid;place-items:center;background:rgba(8,8,9,.91);color:#fff;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.agx-desktop-starting-card{width:min(330px,calc(100vw - 48px));display:grid;justify-items:center;gap:17px;text-align:center}
.agx-desktop-starting-card b{font:540 14px Inter}.agx-desktop-starting-card p{margin:-8px 0 0;color:#a5a5aa;font:500 11px/1.4 Inter}
.agx-desktop-progress{width:260px;height:6px;overflow:hidden;border-radius:999px;background:#3d3d40}.agx-desktop-progress i{display:block;width:38%;height:100%;border-radius:inherit;background:#fff;animation:agxDesktopProgress 1.25s cubic-bezier(.45,0,.55,1) infinite}
@keyframes agxDesktopProgress{0%{transform:translateX(-105%)}55%{transform:translateX(108%)}100%{transform:translateX(280%)}}
.agx-desktop-viewer{position:fixed;z-index:490;inset:7px;display:flex;flex-direction:column;overflow:hidden;border:1px solid #303034;border-radius:20px;background:#101011;color:#f5f5f7;box-shadow:0 34px 100px rgba(0,0,0,.48)}
.agx-desktop-bar{height:64px;display:flex;align-items:center;gap:11px;padding:0 14px 0 18px;background:#0d0d0e;border-bottom:1px solid #252527}
.agx-desktop-dots{display:flex;gap:8px}.agx-desktop-dots i{width:12px;height:12px;border-radius:50%;background:#ff5f57}.agx-desktop-dots i:nth-child(2){background:#febc2e}.agx-desktop-dots i:nth-child(3){background:#28c840}
.agx-desktop-title{margin-left:8px;color:#b7b7bd;font:560 11px Inter}.agx-desktop-actions{margin-left:auto;display:flex;align-items:center;gap:7px}
.agx-teach-task,.agx-desktop-control{height:36px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid #29292d;border-radius:10px;background:#18181a;color:#f5f5f7;font:560 12px Inter;cursor:pointer}.agx-teach-task{padding:0 14px}.agx-desktop-control{width:36px;padding:0}.agx-teach-task:hover,.agx-desktop-control:hover{background:#242427}
.agx-teach-task svg,.agx-desktop-control svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.agx-desktop-canvas{position:relative;flex:1;min-height:0;display:grid;place-items:center;margin:0 14px 14px;overflow:hidden;border-radius:10px;background:radial-gradient(circle at 48% 58%,#f2f2f2 0,#d7d7d9 46%,#bfc0c3 100%)}
.agx-desktop-canvas img{width:100%;height:100%;display:block;object-fit:contain}.agx-desktop-canvas img[hidden]{display:none}
.agx-desktop-wait{display:grid;justify-items:center;gap:12px;color:#6f7075;font:560 12px Inter}.agx-desktop-wait svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.6}
.agx-desktop-wait[hidden]{display:none}
.agx-teach-pop{position:absolute;z-index:3;top:14px;right:14px;width:min(380px,calc(100% - 28px));padding:14px;border:1px solid #343438;border-radius:14px;background:rgba(18,18,20,.96);box-shadow:0 20px 54px rgba(0,0,0,.4);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.agx-teach-pop[hidden]{display:none}
.agx-teach-pop label{display:block;margin-bottom:8px;color:#d7d7db;font:650 12px Inter}.agx-teach-row{display:flex;gap:8px}.agx-teach-row input{min-width:0;flex:1;height:38px;padding:0 11px;border:1px solid #3a3a3e;border-radius:9px;outline:0;background:#0e0e0f;color:#fff;font:520 12px Inter}.agx-teach-row input:focus{border-color:#2e8df5}.agx-teach-row button{height:38px;padding:0 13px;border:0;border-radius:9px;background:#fff;color:#080809;font:650 11.5px Inter;cursor:pointer}.agx-teach-row button:disabled{opacity:.55;cursor:wait}
.agx-teach-status{min-height:15px;margin-top:8px;color:#929298;font:520 10.5px/1.4 Inter}
@media(max-width:1100px){.agx-shell{grid-template-columns:220px minmax(0,1fr) 0}.agx-shell.drawer-open{grid-template-columns:220px minmax(0,1fr) 300px}.agx-shell.screen-open{grid-template-columns:220px minmax(0,1fr) 320px}.agx-drawer-in{width:300px}.agx-screen-in{width:320px}body.shopify.agent-conversation-open[data-view="tm-agents"] .composer,body.shopify.sf-collapsed.agent-conversation-open[data-view="tm-agents"] .composer{left:220px}body.shopify.agent-conversation-open.agent-drawer-open[data-view="tm-agents"] .composer{right:300px}body.shopify.agent-conversation-open.agent-screen-open[data-view="tm-agents"] .composer{right:320px}}
@media(max-width:820px){.agx-shell,.agx-shell.drawer-open,.agx-shell.screen-open{grid-template-columns:minmax(0,1fr)}.agx-history{display:none}.agx-drawer{position:absolute;z-index:30;right:0;top:0;bottom:0;width:min(340px,88vw);transform:translateX(102%);transition:transform .28s cubic-bezier(.22,1,.36,1);box-shadow:-18px 0 44px rgba(0,0,0,.3)}.agx-shell.drawer-open .agx-drawer,.agx-shell.screen-open .agx-drawer{transform:translateX(0)}body.shopify.agent-conversation-open[data-view="tm-agents"] .composer,body.shopify.sf-collapsed.agent-conversation-open[data-view="tm-agents"] .composer{left:0;right:0}body.shopify.agent-conversation-open.agent-drawer-open[data-view="tm-agents"] .composer,body.shopify.agent-conversation-open.agent-screen-open[data-view="tm-agents"] .composer{right:0}.agx-top{grid-template-columns:minmax(120px,1fr) auto}.agx-mobile-exit{display:inline-flex}.agx-starters{grid-template-columns:1fr}.agx-transcript{padding-left:18px;padding-right:18px}.agx-screen-in{width:min(340px,88vw)}}
@media(max-width:600px){body.shopify.agent-conversation-open[data-view="tm-agents"] .composer{left:0}.agx-top{padding:0 10px}.agx-agent-trigger{max-width:190px}.agx-transcript{padding-bottom:142px}.agx-empty h1{font-size:28px}.agx-empty p{font-size:13px}.agx-bot-picker{padding:6px}.agx-bot-picker-panel{width:100%;border-radius:15px}.agx-bot-picker-search,.agx-bot-picker-search input{font-size:15px}.agx-bot-picker-key{display:none}}
@media(prefers-reduced-motion:reduce){.agx-desktop-progress i{animation:none;width:72%}.agx-screen-preview,.agx-routine-create{transition:none}}
/* Grok-inspired agent setup, rebuilt inside the real Attract AI Agents
surface. The permanent Attract shell stays visible while setup owns the
section canvas. */
body.shopify.agent-onboarding-open[data-view="tm-agents"] .composer{display:none!important}
.agob-shell{position:relative;height:100%;min-height:0;overflow:hidden;background:var(--sf-surface);color:var(--sf-ink);font-family:Inter,sans-serif}
.agob-dismiss{position:absolute;z-index:8;top:14px;right:18px;height:30px;padding:0 12px;border:0;border-radius:999px;background:var(--sf-hover);color:var(--sf-dim);font:620 10.5px Inter,sans-serif;cursor:pointer}.agob-dismiss:hover{color:var(--sf-ink)}
.agob-stage{height:100%;min-height:0;display:flex;flex-direction:column;align-items:center;padding:58px 24px 36px;text-align:center;overflow-y:auto}
.agob-stage h1{margin:0;color:var(--sf-ink);font:520 clamp(28px,3.3vw,44px)/1.08 Inter,sans-serif;letter-spacing:-.045em;text-wrap:balance}
.agob-intro-stage{justify-content:center;overflow:hidden;transition:opacity .42s ease,transform .42s cubic-bezier(.4,0,1,1)}
.agob-intro-stage.agob-leaving{opacity:0;transform:scale(1.045)}
.agob-intro-stage .agob-intro-title{position:relative;white-space:nowrap}
.agob-intro-stage .agob-intro-title span{display:block;clip-path:inset(0 100% 0 0);animation:agob-type-title 1.35s steps(18,end) .18s both}
.agob-intro-stage .agob-intro-title:after{content:"";position:absolute;top:.07em;right:-.09em;width:2px;height:.86em;border-radius:2px;background:currentColor;opacity:0;animation:agob-type-caret 1.75s step-end .18s both}
.agob-chat-stage .agob-center{opacity:0;filter:blur(8px);transform:translateY(18px) scale(.88);animation:agob-zoom-place .72s cubic-bezier(.16,1,.3,1) .06s both}
.agob-chat-stage>.agob-flow{opacity:0;filter:blur(6px);transform:translateY(14px) scale(.94);animation:agob-zoom-place .62s cubic-bezier(.16,1,.3,1) .24s both}
@keyframes agob-type-title{to{clip-path:inset(0 0 0 0)}}
@keyframes agob-type-caret{0%,100%{opacity:0}12%,88%{opacity:1}}
@keyframes agob-zoom-place{to{opacity:1;filter:blur(0);transform:translateY(0) scale(1)}}
.agob-stage-copy{max-width:520px;margin:12px 0 0;color:var(--sf-dim);font:520 13px/1.5 Inter,sans-serif}
.agob-center{width:100%;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.agob-mark{--agob-color:#2e8df5;position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:var(--agob-size,58px);height:var(--agob-size,58px);overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none;clip-path:none;isolation:isolate}
.agob-mark .attract-bot-svg{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.agob-mark>i{display:none!important}
.agob-intro-stack{display:grid;justify-items:center;gap:22px}
.agob-taskbox{width:min(390px,calc(100vw - 350px));min-width:280px;min-height:78px;display:grid;grid-template-columns:1fr auto;grid-template-rows:1fr auto;align-items:center;padding:13px 13px 10px;border:1px solid var(--sf-border);border-radius:24px;background:var(--sf-surface);box-shadow:0 5px 18px rgba(0,0,0,.08);text-align:left}
.agob-taskbox strong{align-self:start;padding:1px 3px;color:var(--sf-ink);font:520 14px/1.35 Inter,sans-serif}.agob-task-add,.agob-task-send{width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:50%;font-size:21px}.agob-task-add{grid-row:2;background:var(--sf-hover);color:var(--sf-dim)}.agob-task-send{grid-column:2;grid-row:2;background:#050505;color:#fff;font-size:17px}
.agob-flow{width:min(360px,100%);display:grid;gap:9px;margin-top:auto}.agob-flow button{height:43px;border:0;border-radius:999px;background:#050505;color:#fff;font:520 13px Inter,sans-serif;cursor:pointer}.agob-flow button.secondary{background:var(--sf-hover);color:var(--sf-ink)}.agob-flow button:disabled{opacity:.34;cursor:not-allowed}
.agob-computer{position:relative;width:min(470px,76vw);aspect-ratio:1.55;margin:18px auto 8px;overflow:hidden;border-radius:20px;background:radial-gradient(circle at 25% 15%,#eef7ff 0 8%,transparent 38%),linear-gradient(137deg,#bcdfff 0%,#4da7f8 48%,#8cc9ff 100%);box-shadow:0 25px 52px -28px rgba(30,118,210,.55)}
.agob-window{position:absolute;overflow:hidden;border-radius:12px;background:#fff;box-shadow:0 12px 28px rgba(0,67,125,.15)}.agob-window.back{left:7%;top:12%;width:67%;height:62%}.agob-window.front{right:8%;bottom:14%;width:60%;height:58%}
.agob-windowbar{height:25px;display:flex;align-items:center;gap:6px;padding:0 11px;background:#dcdcdc}.agob-windowbar i{width:7px;height:7px;border-radius:50%;background:#ff595e}.agob-windowbar i:nth-child(2){background:#ffbd2e}.agob-windowbar i:nth-child(3){background:#28c840}
.agob-windowbody{height:calc(100% - 25px);display:grid;grid-template-columns:30% 1fr;gap:9px;padding:10px}.agob-windowbody span{border-radius:8px;background:#f1f1f1}.agob-windowbody span:last-child{background:linear-gradient(#f1f1f1 0 18%,transparent 18% 26%,#e5e5e5 26% 34%,transparent 34% 43%,#ececec 43% 100%)}
.agob-computer>.agob-mark{position:absolute;z-index:3;left:16%;top:24%}
.agob-jobs{position:relative;width:min(520px,80vw);height:310px;margin-top:10px}.agob-job{position:absolute;display:grid;justify-items:center;gap:11px;padding:0;border:0;background:transparent;color:var(--sf-ink);font:520 14px Inter,sans-serif;cursor:pointer}.agob-job>span:last-child{padding:7px 15px;border-radius:999px;background:var(--sf-hover);white-space:nowrap}.agob-job.on>span:last-child{background:#e8e8e8;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04)}.agob-job:nth-child(1){left:50%;top:2px;transform:translateX(-50%)}.agob-job:nth-child(2){left:4%;bottom:15px}.agob-job:nth-child(3){right:3%;bottom:36px}
.agob-apps{width:min(720px,100%);flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;margin-top:32px}.agob-app-search{width:min(340px,100%);height:42px;display:flex;align-items:center;gap:9px;padding:0 15px;border:1px solid var(--sf-border);border-radius:999px;background:var(--sf-hover);color:var(--sf-dim);font-size:14px}.agob-app-search input{width:100%;border:0;outline:0;background:transparent;color:var(--sf-ink);font:inherit}
.agob-app-grid{width:100%;max-height:330px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:13px;padding:0 4px 18px;overflow-y:auto}.agob-app{min-height:59px;display:flex;align-items:center;gap:12px;padding:0 15px;border:1px solid var(--sf-border-2);border-radius:13px;background:var(--sf-surface);color:var(--sf-ink);font:520 13px Inter,sans-serif;text-align:left;cursor:pointer}.agob-app:hover{background:var(--sf-hover)}.agob-app.on{border-color:#111;box-shadow:inset 0 0 0 1px #111}.agob-app-icon{width:27px;height:27px;display:grid;place-items:center;flex:none;border-radius:8px;background:var(--app-color,#111);color:#fff;font:760 10px Inter,sans-serif;letter-spacing:-.03em}
.agob-builder{height:100%;min-height:0;display:grid;grid-template-columns:248px minmax(0,1fr);background:var(--sf-surface);text-align:left}
.agob-builder-side{position:relative;display:flex;flex-direction:column;padding:41px 10px 18px;border-right:1px solid var(--sf-border-2);background:var(--sf-bg)}.agob-builder-row{min-height:54px;display:flex;align-items:center;gap:10px;padding:8px;border-radius:11px;background:var(--sf-sel);font:630 12px Inter,sans-serif}.agob-builder-empty{position:absolute;left:0;right:0;top:50%;color:var(--sf-dim);font:520 12px Inter,sans-serif;text-align:center}.agob-builder-brand{display:flex;align-items:center;gap:8px;margin-top:auto;padding:0 8px;font:660 12px Inter,sans-serif}.agob-brand-dot{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#050505;color:#fff;font:800 7px Inter,sans-serif}
.agob-builder-main{min-width:0;display:flex;flex-direction:column;overflow:hidden}.agob-builder-top{height:52px;display:flex;align-items:center;gap:8px;padding:0 16px;border-bottom:1px solid var(--sf-border-2);font:650 13px Inter,sans-serif}.agob-builder-scroll{flex:1;min-height:0;overflow-y:auto;padding:42px 34px 22px}.agob-builder-card{width:min(520px,100%);display:grid;justify-items:center;margin:0 auto}.agob-palette{display:flex;gap:9px;margin-top:17px}.agob-swatch{width:20px;height:20px;border:0;border-radius:50%;background:var(--sw);cursor:pointer}.agob-swatch.on{box-shadow:0 0 0 2px var(--sf-surface),0 0 0 4px var(--sw)}.agob-shapes{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:17px}.agob-shape{width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:9px;background:transparent;cursor:pointer}.agob-shape.on{box-shadow:inset 0 0 0 1px #2e8df5}
.agob-name-block{width:100%;margin-top:25px}.agob-name-block label{display:block;margin:0 0 7px;color:var(--sf-dim);font:520 12px Inter,sans-serif}.agob-name-block input{width:100%;height:42px;padding:0 12px;border:1px solid var(--sf-border);border-radius:9px;background:var(--sf-surface);color:var(--sf-ink);font:520 14px Inter,sans-serif;outline:0}.agob-name-block input:focus{border-color:#2e8df5;box-shadow:0 0 0 3px rgba(46,141,245,.12)}.agob-inference{width:100%;min-height:45px;margin-top:10px;padding:10px 12px;border-radius:10px;background:var(--sf-hover);color:var(--sf-sub);font:520 11.5px/1.45 Inter,sans-serif}.agob-inference b{display:block;color:var(--sf-ink);font-weight:650}
.agob-create{min-width:132px;height:39px;margin-top:15px;border:0;border-radius:10px;background:#050505;color:#fff;font:620 12.5px Inter,sans-serif;cursor:pointer}.agob-create:disabled{opacity:.25;cursor:not-allowed}.agob-error{margin-top:10px;color:#c43d37;font:520 11px/1.4 Inter,sans-serif;text-align:center}
.agob-suggestions{width:100%;display:grid;grid-template-columns:repeat(3,minmax(210px,1fr));gap:12px;margin-top:42px}.agob-suggestion{min-height:102px;display:flex;align-items:center;gap:13px;padding:14px;border:1px solid var(--sf-border-2);border-radius:14px;background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}.agob-suggestion:hover{background:var(--sf-hover)}.agob-suggestion b,.agob-suggestion span{display:block}.agob-suggestion b{font:650 13px Inter,sans-serif}.agob-suggestion span{margin-top:5px;color:var(--sf-dim);font:520 11px/1.42 Inter,sans-serif}
/* New Bot opens as a workspace, not a picker. The left side is the guided
conversation; the right side keeps the editable Bot settings visible. */
.agob-newbot{grid-template-columns:minmax(420px,1.18fr) minmax(360px,.82fr);background:var(--sf-surface)}
.agob-newbot-chat,.agob-newbot-settings{min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--sf-surface)}
.agob-newbot-chat{border-right:1px solid var(--sf-border-2)}
.agob-newbot-chat-head,.agob-newbot-settings-head{height:64px;flex:none;display:flex;align-items:center;border-bottom:1px solid var(--sf-border-2)}
.agob-newbot-chat-head{padding:0 18px}.agob-newbot-badge{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:11px;background:var(--sf-hover);font:660 14px/1 Inter,sans-serif}
.agob-newbot-settings-head{justify-content:space-between;padding:0 18px}.agob-newbot-settings-head h2{margin:0;font:680 15px/1 Inter,sans-serif}.agob-newbot-nav{width:34px;height:34px;border:0;border-radius:10px;background:transparent;color:var(--sf-dim);font:400 28px/1 Inter,sans-serif;cursor:pointer}.agob-newbot-nav:hover{background:var(--sf-hover);color:var(--sf-ink)}
.agob-newbot-thread{flex:1;min-height:0;overflow-y:auto;padding:30px clamp(22px,4vw,46px) 20px}.agob-newbot-date{margin:0 0 22px;color:var(--sf-dim);font:520 11.5px/1 Inter,sans-serif;text-align:center}.agob-newbot-bubble{width:min(470px,88%);padding:14px 16px;border-radius:18px;background:var(--sf-hover);color:var(--sf-ink);font:520 14px/1.48 Inter,sans-serif}.agob-newbot-bubble p{margin:0}.agob-newbot-bubble p+p{margin-top:10px}
.agob-newbot-divider{display:flex;align-items:center;gap:12px;margin:25px 0 20px;color:#1677e8;font:650 10px/1 Inter,sans-serif;letter-spacing:.05em}.agob-newbot-divider:before,.agob-newbot-divider:after{content:"";height:1px;flex:1;background:color-mix(in srgb,#1677e8 28%,var(--sf-border-2))}
.agob-focus-card{width:min(470px,92%);padding:14px;border-radius:18px;background:var(--sf-hover)}.agob-focus-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px;font:650 14px/1.2 Inter,sans-serif}.agob-focus-head button{border:0;background:transparent;color:var(--sf-dim);font-size:20px;cursor:pointer}.agob-focus-list{overflow:hidden;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface)}.agob-focus-option{width:100%;height:49px;display:flex;align-items:center;gap:11px;padding:0 12px;border:0;border-bottom:1px solid var(--sf-border-2);background:transparent;color:var(--sf-ink);font:540 13px/1 Inter,sans-serif;text-align:left;cursor:pointer}.agob-focus-option:last-child{border-bottom:0}.agob-focus-option:hover,.agob-focus-option.on{background:var(--sf-hover)}.agob-focus-key{width:23px;height:23px;display:grid;place-items:center;flex:none;border:1px solid var(--sf-border);border-radius:6px;background:var(--sf-hover);color:var(--sf-dim);font-size:10px}
.agob-focus-custom{display:flex;gap:7px;margin-top:10px}.agob-focus-custom input{min-width:0;flex:1;height:39px;padding:0 11px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:520 12.5px Inter,sans-serif;outline:0}.agob-focus-custom input:focus{border-color:#2e8df5}.agob-focus-custom button{width:39px;height:39px;border:0;border-radius:10px;background:#050505;color:#fff;font-size:18px;cursor:pointer}
.agob-newbot-composer{margin:0 clamp(22px,4vw,46px) 18px;padding:6px;display:flex;align-items:center;gap:8px;border:1px solid var(--sf-border);border-radius:999px;background:var(--sf-surface);box-shadow:0 7px 22px rgba(0,0,0,.06)}.agob-newbot-composer button{width:35px;height:35px;display:grid;place-items:center;flex:none;border:0;border-radius:50%;background:var(--sf-hover);color:var(--sf-ink);font-size:22px;cursor:pointer}.agob-newbot-composer .mic{background:#050505;color:#fff;font-size:14px}.agob-newbot-composer input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--sf-ink);font:520 13px Inter,sans-serif}.agob-newbot-composer input::placeholder{color:var(--sf-dim)}
.agob-newbot-settings-scroll{flex:1;min-height:0;overflow-y:auto;padding:32px clamp(24px,4vw,46px)}.agob-newbot-avatar{display:grid;place-items:center;margin:0 auto 28px}.agob-newbot-field{display:block;margin-top:15px;color:var(--sf-dim);font:520 12px/1 Inter,sans-serif}.agob-newbot-field input,.agob-newbot-field textarea{width:100%;margin-top:7px;padding:0 12px;border:1px solid var(--sf-border);border-radius:11px;background:var(--sf-surface);color:var(--sf-ink);font:520 14px Inter,sans-serif;outline:0}.agob-newbot-field input{height:44px}.agob-newbot-field textarea{height:94px;padding-top:12px;resize:vertical;line-height:1.45}.agob-newbot-field input:focus,.agob-newbot-field textarea:focus{border-color:#2e8df5;box-shadow:0 0 0 3px rgba(46,141,245,.1)}
.agob-notify{display:flex;align-items:center;gap:14px;margin-top:18px;padding:14px;border-radius:14px;background:var(--sf-hover)}.agob-notify-copy{min-width:0;flex:1}.agob-notify-copy b,.agob-notify-copy span{display:block}.agob-notify-copy b{font:620 13px/1.2 Inter,sans-serif}.agob-notify-copy span{margin-top:4px;color:var(--sf-dim);font:520 11.5px/1.4 Inter,sans-serif}.agob-switch{position:relative;width:38px;height:22px;flex:none;border:0;border-radius:999px;background:#777;cursor:pointer}.agob-switch:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .16s}.agob-switch.on{background:#0a7cff}.agob-switch.on:after{left:19px}
.agob-newbot-create{width:100%;height:43px;margin-top:18px;border:0;border-radius:11px;background:#050505;color:#fff;font:640 12.5px Inter,sans-serif;cursor:pointer}.agob-newbot-create:disabled{opacity:.28;cursor:not-allowed}.agob-newbot .agob-error{text-align:left}
.agob-newbot{grid-template-columns:260px minmax(380px,1fr) minmax(340px,.82fr)}
.agob-newbot-history{min-width:0;min-height:0;display:flex;flex-direction:column;padding:24px 10px 16px;border-right:1px solid var(--sf-border-2);background:var(--sf-bg);overflow:hidden}
.agob-newbot-history-profile{display:grid;justify-items:center;gap:9px;padding:0 10px 24px}.agob-newbot-history-avatar{position:relative;width:72px;height:72px;display:grid;place-items:center}.agob-newbot-history-status{position:absolute;right:1px;bottom:2px;width:11px;height:11px;border:3px solid var(--sf-bg);border-radius:50%;background:#1684f8;box-sizing:content-box}.agob-newbot-history-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-ink);font:650 14px/1.2 Inter,sans-serif}
.agob-newbot-create-row{width:100%;min-height:62px;display:flex;align-items:center;gap:12px;padding:9px 11px;border:0;border-radius:13px;background:var(--sf-sel);color:var(--sf-ink);font:650 14px/1 Inter,sans-serif;text-align:left;cursor:pointer}.agob-newbot-create-row:hover{background:var(--sf-hover)}.agob-newbot-create-icon{width:39px;height:39px;display:grid;place-items:center;flex:none;border:1px solid var(--sf-border);border-radius:50%;font:400 25px/1 Inter,sans-serif}
.agob-newbot-recents{min-height:0;display:grid;align-content:start;gap:2px;margin-top:10px;overflow-y:auto;overscroll-behavior:none}.agob-newbot-recent{width:100%;min-height:58px;display:flex;align-items:center;gap:10px;padding:8px;border:0;border-radius:12px;background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}.agob-newbot-recent:hover{background:var(--sf-hover)}.agob-newbot-recent-avatar{width:39px;height:39px;display:grid;place-items:center;flex:none}.agob-newbot-recent-copy{min-width:0;flex:1}.agob-newbot-recent-line{display:flex;align-items:center;gap:8px}.agob-newbot-recent-line b{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:630 12.5px/1.2 Inter,sans-serif}.agob-newbot-recent-line time{flex:none;color:var(--sf-dim);font:510 10px/1 Inter,sans-serif}.agob-newbot-recent-copy>span{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sf-dim);font:510 10.5px/1.25 Inter,sans-serif}.agob-newbot-history-empty{padding:24px 12px;color:var(--sf-dim);font:520 11px/1.45 Inter,sans-serif;text-align:center}
.agx-welcome{max-width:720px;margin:0 auto}.agx-hello{display:inline-block;margin:0 0 9px;padding:9px 13px;border-radius:16px;background:var(--sf-hover);font:540 13px Inter,sans-serif}.agx-focus{padding:14px;border-radius:17px;background:var(--sf-hover)}.agx-focus h2{margin:0;font:680 14px/1.3 Inter,sans-serif}.agx-focus p{margin:5px 0 11px;color:var(--sf-dim);font:520 12px/1.45 Inter,sans-serif}.agx-focus-options{overflow:hidden;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface)}.agx-focus-option{width:100%;height:42px;display:flex;align-items:center;gap:10px;padding:0 10px;border:0;border-bottom:1px solid var(--sf-border-2);background:transparent;color:var(--sf-ink);font:530 12.5px Inter,sans-serif;text-align:left;cursor:pointer}.agx-focus-option:last-child{border-bottom:0}.agx-focus-option:hover{background:var(--sf-hover)}.agx-focus-key{width:19px;height:19px;display:grid;place-items:center;border-radius:5px;background:var(--sf-hover);color:var(--sf-dim);font:650 10px Inter,sans-serif}
.agx-pinned-strip{display:flex;align-items:flex-start;gap:10px;overflow-x:auto;padding:8px 8px 16px}.agx-pinned-strip.single{justify-content:center}.agx-pinned-card{position:relative;width:94px;min-width:94px;height:108px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:8px 7px 7px;border:0;border-radius:15px;background:var(--sf-sel);color:var(--sf-ink);cursor:pointer;transition:transform .16s ease,background .16s ease,box-shadow .16s ease}.agx-pinned-card:hover{transform:translateY(-1px);background:var(--sf-hover)}.agx-pinned-card.on{box-shadow:inset 0 0 0 1px var(--sf-border)}.agx-pinned-avatar{position:relative;width:58px;height:58px;display:grid;place-items:center;flex:none}.agx-pinned-avatar .agob-mark{flex:none}.agx-pinned-unread{position:absolute;right:-2px;bottom:1px;width:9px;height:9px;border:2px solid var(--sf-sel);border-radius:50%;background:#2e8df5;box-sizing:content-box;opacity:0;transition:opacity .14s ease}.agx-pinned-card.unread .agx-pinned-unread{opacity:1}.agx-pinned-name{display:block;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:640 12.5px/1.2 Inter,sans-serif;text-align:center}
.agx-history-agent{position:relative;width:100%;display:flex;align-items:center;gap:10px;padding:9px;border:0;border-radius:12px;background:transparent;color:var(--sf-ink);text-align:left;cursor:pointer}.agx-history-agent:hover{background:var(--sf-hover)}.agx-history-agent.on{background:#fff;color:#303030}.agx-history-agent.on .agx-history-agent-copy span{color:#8a8a8a}.agx-history-agent.on .agx-history-agent-status{border-color:#fff}.agx-history-agent-avatar{position:relative;width:40px;height:40px;display:grid;place-items:center;flex:none}.agx-history-agent-status{position:absolute;right:0;bottom:0;width:9px;height:9px;border:2px solid var(--sf-bg);border-radius:50%;background:#777}.agx-history-agent-status.on{background:#20c780}.agx-history-agent-copy{min-width:0;flex:1}.agx-history-agent-copy b,.agx-history-agent-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agx-history-agent-copy b{font:660 12.5px/1.25 Inter,sans-serif}.agx-history-agent-copy b[contenteditable="true"]{min-width:90px;padding:4px 8px;border:1px solid var(--sf-border);border-radius:8px;background:var(--sf-surface);overflow:visible;text-overflow:clip;cursor:text;outline:0;box-shadow:0 1px 2px rgba(0,0,0,.06);caret-color:var(--sf-ink)}.agx-history-agent-copy span{margin-top:3px;color:var(--sf-dim);font:520 10.5px/1.2 Inter,sans-serif}.agx-history-unread{width:7px;height:7px;flex:none;border-radius:50%;background:#2e8df5;opacity:0}.agx-history-agent.unread .agx-history-unread{opacity:1}.agx-channel-empty-row{padding:7px 9px 11px;color:var(--sf-dim);font:510 10.5px/1.35 Inter}
.agx-settings-profile{display:block;padding:0 0 20px}.agx-settings-avatar{height:184px;display:grid;place-items:center}.agx-settings-avatar .agob-mark,.agx-settings-avatar .agob-upload-mark{display:flex!important;flex:none;margin:0}.agx-settings-field{display:block;width:100%;margin:0 0 12px}.agx-settings-field label{display:block;margin:0 0 6px 8px;color:var(--sf-dim);font:520 12px Inter,sans-serif}.agx-settings-field input,.agx-settings-field textarea{width:100%;border:1px solid var(--sf-border);border-radius:11px;outline:0;background:var(--sf-surface);color:var(--sf-ink);font:520 13.5px/1.4 Inter,sans-serif;transition:border-color .15s,box-shadow .15s}.agx-settings-field input{height:42px;padding:0 11px}.agx-settings-field textarea{min-height:82px;padding:10px 11px;resize:vertical}.agx-settings-field input:focus,.agx-settings-field textarea:focus{border-color:#2e8df5;box-shadow:0 0 0 3px rgba(46,141,245,.11)}.agx-settings-notify{display:flex;align-items:center;gap:12px;margin-top:13px;padding:14px;border-radius:14px;background:var(--sf-hover)}.agx-settings-notify-copy{min-width:0;flex:1}.agx-settings-notify-copy b,.agx-settings-notify-copy span{display:block}.agx-settings-notify-copy b{font:620 13px/1.2 Inter,sans-serif}.agx-settings-notify-copy span{margin-top:4px;color:var(--sf-dim);font:520 11.5px/1.4 Inter,sans-serif}
.agob-upload-mark{position:relative;display:inline-grid;place-items:center;flex:none;width:var(--agob-size,58px);height:var(--agob-size,58px);overflow:hidden;border-radius:50%;background:var(--sf-hover)}.agob-upload-mark img{width:100%;height:100%;display:block;object-fit:cover}
.agedit{width:min(620px,100%);margin:0 auto 92px}.agedit-card{position:relative;padding:28px 32px 32px;border:1px solid var(--sf-border);border-radius:22px;background:var(--sf-surface);box-shadow:0 18px 55px rgba(0,0,0,.07)}
.agedit-avatar-wrap{display:grid;justify-items:center;margin-bottom:26px}.agedit-avatar{width:104px;height:104px;display:grid;place-items:center}.agedit-avatar .agob-mark,.agedit-avatar .agob-upload-mark{display:block}.agedit-avatar-button{height:34px;margin-top:11px;padding:0 14px;border:1px solid var(--sf-border);border-radius:10px;background:var(--sf-surface);color:var(--sf-ink);font:620 12px/1 Inter,sans-serif;cursor:pointer;box-shadow:0 5px 16px rgba(0,0,0,.08)}.agedit-avatar-button:hover{background:var(--sf-hover)}
.agedit-fields{display:grid;gap:16px}.agedit-field{display:grid;gap:7px}.agedit-field>span{color:var(--sf-sub);font:540 12px/1 Inter,sans-serif}.agedit-field input,.agedit-field textarea{width:100%;border:1px solid var(--sf-border);border-radius:12px;background:var(--sf-surface);color:var(--sf-ink);font:520 14px/1.4 Inter,sans-serif;outline:0}.agedit-field input{height:46px;padding:0 14px}.agedit-field textarea{min-height:112px;padding:13px 14px;resize:vertical}.agedit-field input:focus,.agedit-field textarea:focus{border-color:#2e8df5;box-shadow:0 0 0 3px rgba(46,141,245,.1)}
.agedit-notify{display:flex;align-items:center;gap:16px;margin-top:18px;padding:16px;border-radius:15px;background:var(--sf-hover)}.agedit-notify-copy{min-width:0;flex:1}.agedit-notify-copy b,.agedit-notify-copy span{display:block}.agedit-notify-copy b{font:650 13px/1.2 Inter,sans-serif}.agedit-notify-copy span{margin-top:5px;color:var(--sf-dim);font:520 11.5px/1.4 Inter,sans-serif}
.agedit-actions{display:flex;justify-content:space-between;gap:10px;margin-top:22px}.agedit-actions .sf-btn{height:40px;border-radius:11px}.agedit-actions .danger{color:#e5313b}
.agedit-avatar-panel{position:absolute;z-index:12;left:50%;top:136px;width:min(520px,calc(100% - 28px));transform:translateX(-50%);overflow:hidden;border:1px solid var(--sf-border);border-radius:20px;background:var(--sf-surface);box-shadow:0 24px 70px rgba(0,0,0,.19)}.agedit-avatar-panel[hidden]{display:none}.agedit-avatar-tabs{height:58px;display:flex;align-items:center;gap:4px;padding:0 16px;border-bottom:1px solid var(--sf-border-2)}.agedit-avatar-tabs button{height:36px;padding:0 13px;border:0;border-radius:10px;background:transparent;color:var(--sf-dim);font:560 13px/1 Inter,sans-serif;cursor:pointer}.agedit-avatar-tabs button.on{background:var(--sf-hover);color:var(--sf-ink)}.agedit-avatar-body{min-height:310px;padding:24px}.agedit-avatar-view[hidden]{display:none}
.agedit-shapes{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.agedit-shape{height:64px;display:grid;place-items:center;border:0;border-radius:13px;background:transparent;cursor:pointer}.agedit-shape.on{box-shadow:inset 0 0 0 2px var(--sf-border);background:var(--sf-hover)}.agedit-colors{display:grid;grid-template-columns:repeat(6,1fr);gap:15px;margin-top:22px}.agedit-color{width:38px;height:38px;justify-self:center;border:0;border-radius:50%;background:var(--sw);cursor:pointer}.agedit-color.on{box-shadow:0 0 0 3px var(--sf-surface),0 0 0 5px var(--sf-border)}
.agedit-generate{display:grid;gap:16px}.agedit-generate textarea{width:100%;min-height:190px;padding:15px;border:1px solid var(--sf-border);border-radius:15px;background:var(--sf-surface);color:var(--sf-ink);font:520 14px/1.5 Inter,sans-serif;resize:none;outline:0}.agedit-generate button{height:44px;border:0;border-radius:12px;background:#050505;color:#fff;font:630 13px Inter,sans-serif;cursor:pointer}.agedit-generate button:disabled{opacity:.38}
.agedit-upload{min-height:250px;display:grid;place-items:center;padding:28px;border:1px dashed var(--sf-border);border-radius:16px;text-align:center}.agedit-upload p{margin:0;color:var(--sf-dim);font:540 14px/1.8 Inter,sans-serif}.agedit-upload button{height:42px;margin-top:15px;padding:0 18px;border:0;border-radius:12px;background:var(--sf-hover);color:var(--sf-ink);font:620 13px Inter,sans-serif;cursor:pointer}
@media(max-width:700px){.agedit-card{padding:22px 18px}.agedit-avatar-panel{top:128px}.agedit-avatar-body{padding:18px}.agedit-colors{grid-template-columns:repeat(4,1fr)}}
@media(max-width:980px){.agob-app-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.agob-builder{grid-template-columns:210px minmax(0,1fr)}.agob-suggestions{grid-template-columns:1fr}.agob-taskbox{width:min(390px,82vw)}}
@media(max-width:720px){.agob-stage{padding:36px 18px 24px}.agob-app-grid{grid-template-columns:1fr}.agob-builder{grid-template-columns:1fr}.agob-builder-side{display:none}.agob-builder-scroll{padding:28px 18px}.agob-jobs{transform:scale(.86)}.agob-flow{width:min(330px,100%)}.agob-newbot{display:block;overflow-y:auto}.agob-newbot-chat,.agob-newbot-settings{min-height:100vh}.agob-newbot-chat{border-right:0;border-bottom:1px solid var(--sf-border-2)}}
@media(prefers-reduced-motion:reduce){.agob-intro-stage{transition:none}.agob-intro-stage .agob-intro-title span,.agob-intro-stage .agob-intro-title:after,.agob-chat-stage .agob-center,.agob-chat-stage>.agob-flow,.agob-mark,.agob-mark i{animation:none;clip-path:none;opacity:1;filter:none}.agob-intro-stage .agob-intro-title:after{display:none}}
/* Preserve scrolling throughout the operator dashboard without showing
scrollbar tracks or thumbs inside panels, rails, tables, or modals. */
body.shopify,body.shopify *{scrollbar-width:none;-ms-overflow-style:none}
body.shopify::-webkit-scrollbar,body.shopify *::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}