/* Shared product foundations: portal, account, operations and workbench.
   One palette with the React workbench (frontend/workbench/src/styles/globals.css):
   neutral surfaces and text, brand blue for links, focus and highlights. */
:root,[data-product-theme="light"]{
  color-scheme:light;
  --product-bg:#ffffff;--product-surface:#ffffff;--product-surface-muted:#f8f8f9;
  --product-sidebar:#f8f8f9;--product-panel:#fbfbfc;--product-popover:#ffffff;--product-fill:#f3f3f5;
  --product-composer:#ffffff;--product-hover:#ececef;--product-selected:#ececef;
  --product-text:#17171a;--product-muted:#62626b;--product-subtle:#75757e;
  --product-border:#e7e7eb;--product-border-strong:#d4d4da;--product-input:#dedee3;
  --product-brand:#2a72e5;--product-brand-hover:#1f6ae0;--product-brand-soft:rgb(43 124 246 / .1);--product-brand-text:#1d66d6;
  --product-accent:#2b7cf6;--product-link:#1d66d6;--product-focus:#2b7cf6;
  --product-primary:#18181b;--product-on-primary:#fafafa;--product-primary-hover:#2c2c31;
  --product-code:#fbfbfc;--product-success:#1a7f37;--product-success-bg:rgb(22 163 74 / .08);
  /* Warning is an icon and border color; text uses the darker variant to keep 4.5:1. */
  --product-warning:#d97706;--product-warning-text:#b45309;--product-warning-bg:rgb(217 119 6 / .08);
  --product-danger:#dc2626;--product-danger-bg:rgb(220 38 38 / .04);
  --product-diff-add:rgb(46 160 67 / .1);--product-diff-add-fg:#1a7f37;--product-diff-del:rgb(248 81 73 / .1);--product-diff-del-fg:#cf222e;
  --product-shadow-xs:0 1px 2px rgb(37 38 40 / .05);
  --product-shadow:0 2px 4px -2px rgb(37 38 40 / .06),0 6px 20px -6px rgb(37 38 40 / .1);
  --product-shadow-lg:0 4px 8px -4px rgb(37 38 40 / .08),0 16px 40px -12px rgb(37 38 40 / .2);
  --product-code-keyword:#cf222e;--product-code-string:#0a3069;--product-code-number:#0550ae;--product-code-function:#8250df;--product-code-type:#953800;--product-code-comment:#6e7781;--product-code-punctuation:#57606a;
  --product-title-size:28px;--product-section-size:24px;
  --product-radius-control:8px;--product-radius-surface:12px;--product-radius:12px;
  --product-control-height:40px;--product-control:40px;--product-touch-target:44px;
  --product-control-sm:32px;--product-control-md:36px;
  --product-duration-fast:120ms;--product-duration-normal:180ms;--product-duration-slow:280ms;--product-ease:cubic-bezier(.2,.7,.2,1);
  /* Interaction feel shared by every surface: a press gives, a card lifts, things arrive from just below. */
  --product-ease-out:cubic-bezier(.16,1,.3,1);--product-ease-spring:cubic-bezier(.34,1.56,.64,1);
  --product-press-scale:.97;--product-lift:-2px;--product-enter-distance:6px;--product-stagger:40ms;
  /* Floating controls share dimensions across the portal and workbench. */
  --popup-menu-width:320px;--popup-dialog-width:480px;--popup-dialog-wide:640px;--popup-dialog-large:960px;
  --popup-radius:14px;--popup-dialog-radius:16px;--popup-padding:8px;
  --popup-item-height:40px;--popup-item-gap:8px;--popup-viewport-gap:16px;--popup-dialog-padding:24px;
  --product-font-sans:"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  --product-font-mono:"Geist Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
:root[data-product-theme="dark"],[data-product-theme="dark"]{
  color-scheme:dark;
  --product-bg:#111113;--product-surface:#161619;--product-surface-muted:#0c0c0e;
  --product-sidebar:#0c0c0e;--product-panel:#0e0e10;--product-popover:#19191c;--product-fill:#1c1c20;
  --product-composer:#161619;--product-hover:#232328;--product-selected:#232328;
  --product-text:#ececef;--product-muted:#a3a3ac;--product-subtle:#8b8b95;
  --product-border:#252529;--product-border-strong:#34343a;--product-input:#2d2d33;
  --product-brand:#2a72e5;--product-brand-hover:#1f6ae0;--product-brand-soft:rgb(75 151 255 / .14);--product-brand-text:#74adff;
  --product-accent:#4b97ff;--product-link:#74adff;--product-focus:#4b97ff;
  --product-primary:#ececef;--product-on-primary:#111113;--product-primary-hover:#d4d4d9;
  --product-code:#0e0e10;--product-success:#3fb950;--product-success-bg:rgb(63 185 80 / .14);
  --product-warning:#e3b341;--product-warning-text:#e3b341;--product-warning-bg:rgb(227 179 65 / .14);
  --product-danger:#f85149;--product-danger-bg:rgb(248 81 73 / .14);
  --product-diff-add:rgb(46 160 67 / .14);--product-diff-add-fg:#3fb950;--product-diff-del:rgb(248 81 73 / .13);--product-diff-del-fg:#f85149;
  --product-shadow-xs:0 1px 2px rgb(0 0 0 / .3);
  --product-shadow:0 2px 4px -2px rgb(0 0 0 / .4),0 8px 24px -6px rgb(0 0 0 / .5);
  --product-shadow-lg:0 4px 8px -4px rgb(0 0 0 / .5),0 20px 48px -12px rgb(0 0 0 / .7);
  --product-code-keyword:#ff7b72;--product-code-string:#a5d6ff;--product-code-number:#79c0ff;--product-code-function:#d2a8ff;--product-code-type:#ffa657;--product-code-comment:#8b949e;--product-code-punctuation:#8b949e;
}
/* App confirmations and short inputs use the same focused dialog on every route. */
.z-product-dialog{box-sizing:border-box;position:fixed;left:calc(var(--product-dialog-viewport-left,0px) + var(--product-dialog-viewport-width,100vw) / 2);right:auto;top:calc(var(--product-dialog-viewport-top,0px) + var(--product-dialog-viewport-height,100dvh) / 2);bottom:auto;margin:0;transform:translate(-50%,-50%);width:min(var(--popup-dialog-width),calc(var(--product-dialog-viewport-width,100vw) - 2 * var(--popup-viewport-gap)));max-width:none;max-height:calc(var(--product-dialog-viewport-height,100dvh) - 2 * var(--popup-viewport-gap));padding:0;overflow:hidden;border:1px solid var(--product-border);border-radius:var(--popup-dialog-radius);background:var(--product-surface);color:var(--product-text);box-shadow:var(--product-shadow);font:14px/1.55 var(--product-font-sans)}
.z-product-dialog[open],.z-product-dialog>form{display:flex;flex-direction:column;min-height:0}.z-product-dialog>form{flex:1;min-width:0;margin:0;overflow:hidden}
.z-product-dialog::backdrop{background:rgb(0 0 0 / .45)}
.z-product-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:var(--popup-item-gap);flex:none;padding:12px var(--popup-dialog-padding);border-bottom:1px solid var(--product-border)}
.z-product-dialog-header :is(h1,h2,h3){min-width:0;margin:0;font-size:16px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}
.z-product-dialog .z-product-dialog-close{display:grid;place-items:center;flex:none;width:var(--popup-item-height);height:var(--popup-item-height);padding:0;border:0;border-radius:var(--product-radius-control);background:transparent;color:var(--product-muted);cursor:pointer}.z-product-dialog-close svg{width:18px;height:18px}.z-product-dialog .z-product-dialog-close:hover{background:var(--product-hover);color:var(--product-text)}
.z-product-dialog-body{flex:1;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:var(--popup-dialog-padding)}
.z-product-dialog-message{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--product-muted)}
.z-product-dialog-input{display:block;box-sizing:border-box;width:100%;min-height:44px;margin-top:16px;padding:10px 12px;border:1px solid var(--product-border);border-radius:var(--product-radius-control);background:var(--product-bg);color:var(--product-text);font:16px/1.5 var(--product-font-sans)}
.z-product-dialog-actions{display:flex;flex:none;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:var(--popup-item-gap);padding:12px var(--popup-dialog-padding) var(--popup-dialog-padding)}
.z-product-dialog-actions button{min-height:var(--popup-item-height);padding:8px 16px;border:1px solid var(--product-border);border-radius:var(--product-radius-control);background:var(--product-surface);color:var(--product-text);font:inherit;cursor:pointer}.z-product-dialog-actions button:hover{background:var(--product-hover)}
.z-product-dialog-actions .z-product-dialog-confirm{border-color:transparent;background:var(--product-primary);color:var(--product-on-primary)}.z-product-dialog-actions .z-product-dialog-confirm:hover{background:var(--product-primary-hover)}.z-product-dialog-actions .z-product-dialog-confirm.is-danger{background:var(--product-danger)}
.z-product-dialog :focus-visible{outline:2px solid var(--product-accent);outline-offset:2px}
.z-product-dialog-actions button{transition:background-color var(--product-duration-fast) var(--product-ease),border-color var(--product-duration-fast) var(--product-ease)}
/* The same quiet navigation joins account, support and administration screens. */
.product-context-nav{display:flex;align-items:center;flex-wrap:wrap;gap:4px;min-width:0;font:500 13px/1.5 var(--product-font-sans)}
.product-context-nav a{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:var(--product-control-sm);padding:6px 10px;border:1px solid transparent;border-radius:var(--product-radius-control);color:var(--product-muted);text-decoration:none;transition:background-color var(--product-duration-fast) var(--product-ease),color var(--product-duration-fast) var(--product-ease)}
.product-context-nav a:hover{background:var(--product-hover);color:var(--product-text)}
.product-context-nav a[aria-current=page]{background:var(--product-selected);color:var(--product-text)}
.product-context-nav a:focus-visible{outline:2px solid var(--product-focus);outline-offset:2px}
@media(max-width:767px){:root{--product-control-height:44px;--product-control:44px;--product-title-size:24px;--popup-item-height:44px;--popup-dialog-padding:16px}}
@media(max-width:767px){.product-context-nav{gap:4px;font-size:14px}.product-context-nav a{min-height:var(--product-touch-target);padding:9px 12px}}
@media(prefers-reduced-motion:reduce){.product-context-nav a,.z-product-dialog-actions button{transition:none}}

/* Shared interaction effects. Zero-specificity defaults: any component rule wins,
   and nothing moves for people who ask for reduced motion. */
@media(prefers-reduced-motion:no-preference){
  :where(button,.button,[role=button],input[type=submit],input[type=button]):not(:disabled){transition-property:background-color,border-color,color,box-shadow,opacity,transform;transition-duration:var(--product-duration-fast);transition-timing-function:var(--product-ease)}
  :where(button,.button,[role=button],input[type=submit],input[type=button]):not(:disabled):active{transform:scale(var(--product-press-scale))}
  .product-lift{transition:transform var(--product-duration-normal) var(--product-ease-out),box-shadow var(--product-duration-normal) var(--product-ease-out),border-color var(--product-duration-normal) var(--product-ease-out)}
  .product-enter{animation:product-enter var(--product-duration-slow) var(--product-ease-out) calc(var(--i,0) * var(--product-stagger)) both}
  .product-pop{animation:product-pop 420ms var(--product-ease-spring) both}
  .product-celebrate{position:relative;isolation:isolate}
  .product-celebrate::after{content:"";position:absolute;inset:-6px;z-index:-1;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 0 var(--product-brand);opacity:.5;animation:product-ring 700ms var(--product-ease-out) 1 both}
  .product-skeleton{background:linear-gradient(90deg,var(--product-fill) 0%,var(--product-hover) 50%,var(--product-fill) 100%);background-size:200% 100%;animation:product-shimmer 1.4s linear infinite}
  @keyframes product-enter{from{opacity:0;transform:translateY(var(--product-enter-distance))}to{opacity:1;transform:none}}
  @keyframes product-pop{0%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:none}}
  @keyframes product-ring{from{box-shadow:0 0 0 0 var(--product-brand);opacity:.55}to{box-shadow:0 0 0 14px var(--product-brand);opacity:0}}
  @keyframes product-shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
}
@media(prefers-reduced-motion:no-preference) and (hover:hover) and (pointer:fine){
  .product-lift:hover{transform:translateY(var(--product-lift));border-color:var(--product-border-strong);box-shadow:var(--product-shadow)}
}
@media(prefers-reduced-motion:reduce){.product-skeleton{background:var(--product-fill)}}
