:root{
  color-scheme:light;
  --bg:#F4F3F0;
  --surface:#FCFCFA;
  --surface-subtle:#EBEDEB;
  --surface-raised:#FFFFFF;
  --text:#242A31;
  --text-muted:#59626E;
  --line:#D4D8DC;
  --line-strong:#828D99;
  --control-border:#78838F;
  --accent:#2F5F8F;
  --accent-hover:#244F78;
  --accent-contrast:#FFFFFF;
  --selection:#E4EDF5;
  --success:#28644C;
  --success-bg:#E8F2ED;
  --warning:#795818;
  --warning-bg:#F5EEDC;
  --danger:#A4383A;
  --danger-bg:#F7E7E8;
  --document-bg:#DDE1E3;
  --backdrop:rgba(28,33,39,.34);
  --shadow:0 10px 30px rgba(33,39,45,.08);
  --shadow-dialog:0 24px 70px rgba(28,33,39,.18);
  --focus:0 0 0 3px rgba(47,95,143,.22);
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:16px;
  --control-h:42px;
  --font-ui:"Vazirmatn","IRANSansX",Tahoma,"Segoe UI",system-ui,sans-serif;
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#1B1F23;
  --surface:#242A30;
  --surface-subtle:#2D343C;
  --surface-raised:#293038;
  --text:#E7EBEF;
  --text-muted:#ABB4BF;
  --line:#414B57;
  --line-strong:#7B8896;
  --control-border:#8996A4;
  --accent:#92B8D9;
  --accent-hover:#A9CAE6;
  --accent-contrast:#17212A;
  --selection:#293E50;
  --success:#93C9AD;
  --success-bg:#20372D;
  --warning:#E2C17D;
  --warning-bg:#40351F;
  --danger:#E8A0A5;
  --danger-bg:#492B2E;
  --document-bg:#151A1E;
  --backdrop:rgba(5,8,11,.68);
  --shadow:0 12px 34px rgba(0,0,0,.2);
  --shadow-dialog:0 26px 80px rgba(0,0,0,.42);
  --focus:0 0 0 3px rgba(146,184,217,.24);
}
*{box-sizing:border-box}
html{
  min-height:100%;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-ui);
  font-size:16px;
  -webkit-text-size-adjust:100%;
}
body{
  min-height:100vh;
  margin:0;
  background:var(--bg);
  color:var(--text);
  line-height:1.72;
  transition:background-color 150ms ease,color 150ms ease;
}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{outline:none}
button,.button-link{
  min-height:var(--control-h);
  border:1px solid var(--control-border);
  border-radius:var(--radius-sm);
  background:var(--surface);
  color:var(--text);
  padding:8px 12px;
  font-size:.875rem;
  font-weight:650;
  line-height:1.4;
  text-decoration:none;
  cursor:pointer;
  transition:border-color 140ms ease,background-color 140ms ease,color 140ms ease,box-shadow 140ms ease;
}
button:hover,.button-link:hover{border-color:var(--line-strong);background:var(--surface-subtle)}
button:active,.button-link:active{background:var(--selection)}
button:disabled{opacity:.48;cursor:not-allowed}
button:focus-visible,.button-link:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{box-shadow:var(--focus);border-color:var(--accent)}
button.primary,.primary{
  border-color:var(--accent);
  background:var(--accent);
  color:var(--accent-contrast);
}
button.primary:hover,.primary:hover{border-color:var(--accent-hover);background:var(--accent-hover)}
button.secondary,.secondary{background:var(--surface-subtle)}
button.danger,.danger{border-color:var(--danger);color:var(--danger);background:var(--danger-bg)}
a{color:var(--accent);text-underline-offset:3px}
input,select,textarea{
  width:100%;
  min-height:var(--control-h);
  border:1px solid var(--control-border);
  border-radius:var(--radius-sm);
  background:var(--surface-raised);
  color:var(--text);
  padding:8px 10px;
  font-size:.9375rem;
  line-height:1.5;
  transition:border-color 140ms ease,box-shadow 140ms ease,background-color 140ms ease;
}
input::placeholder,textarea::placeholder{color:var(--text-muted);opacity:.72}
select{cursor:pointer}
textarea{min-height:92px;resize:vertical}
label,.session-field{
  display:grid;
  gap:6px;
  color:var(--text-muted);
  font-size:.8125rem;
  font-weight:650;
}
fieldset{
  min-width:0;
  margin:0;
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:10px;
}
legend{padding:0 6px;color:var(--text);font-size:.8125rem;font-weight:750}
.hidden,[hidden]{display:none!important}
body.auth-pending{overflow:hidden}
body.auth-pending>*:not(.operator-login){visibility:hidden!important}
.panel{
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:var(--surface);
  box-shadow:var(--shadow);
}
.eyebrow{
  display:block;
  color:var(--text-muted);
  font-size:.75rem;
  font-weight:750;
  letter-spacing:.01em;
}
.section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
.section-head.compact{align-items:center}
.section-head h1,.section-head h2,.section-head p{margin:0}
.section-head h2{font-size:1.125rem;line-height:1.5}
.section-head p{margin-top:3px;color:var(--text-muted);font-size:.8125rem}
.topbar,.review-header{
  position:sticky;
  top:0;
  z-index:40;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  min-height:68px;
  padding:10px max(16px,calc((100vw - 1600px)/2));
  border-bottom:1px solid var(--line);
  background:color-mix(in srgb,var(--bg) 92%,transparent);
  backdrop-filter:blur(12px);
}
.topbar>div,.review-header>div{min-width:0}
.topbar h1,.review-header h1{margin:0;font-size:1.05rem;line-height:1.35}
.topbar p,.review-header p{margin:2px 0 0;color:var(--text-muted);font-size:.78rem}
.topbar nav,.header-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.topbar nav a{
  display:inline-flex;
  min-height:38px;
  align-items:center;
  gap:5px;
  padding:7px 9px;
  border-radius:var(--radius-sm);
  color:var(--text-muted);
  font-size:.8125rem;
  font-weight:700;
  text-decoration:none;
}
.topbar nav a:hover{background:var(--surface-subtle);color:var(--text)}
.topbar nav a.active{background:var(--selection);color:var(--accent)}
.topbar nav a b{font-variant-numeric:tabular-nums}
.theme-toggle{white-space:nowrap}
.status-pill,.gate-badge,.status-badge,.quality-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:28px;
  padding:4px 8px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--surface-subtle);
  color:var(--text-muted);
  font-size:.75rem;
  font-weight:750;
  white-space:nowrap;
}
.gate-badge.ready,.quality-badge.ok{border-color:var(--success);background:var(--success-bg);color:var(--success)}
.gate-badge.blocked,.quality-badge.warn{border-color:var(--warning);background:var(--warning-bg);color:var(--warning)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.two.single{grid-template-columns:1fr}
.segmented{display:grid;gap:5px}
.segmented.five{grid-template-columns:repeat(5,minmax(0,1fr))}
.segmented.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.segmented button{min-width:0;background:var(--surface-raised);padding-inline:6px}
.segmented button.active{border-color:var(--accent);background:var(--selection);color:var(--accent)}
.empty-box{
  min-height:112px;
  display:grid;
  place-items:center;
  border:1px dashed var(--line-strong);
  border-radius:var(--radius-md);
  color:var(--text-muted);
  padding:18px;
  text-align:center;
  font-size:.875rem;
}
kbd{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:22px;
  padding:2px 6px;
  border:1px solid var(--line);
  border-bottom-color:var(--line-strong);
  border-radius:6px;
  background:var(--surface-subtle);
  color:var(--text);
  font:700 .75rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;
}
dialog{
  color:var(--text);
  background:var(--surface);
}
dialog::backdrop{background:var(--backdrop);backdrop-filter:blur(4px)}
.login-view,.operator-login{
  position:fixed;
  inset:0;
  z-index:100;
  display:grid;
  place-items:center;
  padding:18px;
  background:var(--bg);
}
.login-card,.operator-login-card{
  width:min(420px,100%);
  display:grid;
  gap:14px;
  padding:22px;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:var(--surface);
  box-shadow:var(--shadow-dialog);
}
.login-card h1,.operator-login-card h1{margin:0;font-size:1.35rem}
.login-error{min-height:22px;margin:0;color:var(--danger);font-size:.8125rem}
.login-card.auth-success,.operator-login-card.auth-success{border-color:var(--success);background:var(--success-bg)}
.login-view.auth-success,.operator-login.auth-success{background:var(--bg)}
.provider-warning{color:var(--danger);font-size:.75rem;font-weight:750}
.global-toast{
  position:fixed;
  right:16px;
  bottom:16px;
  z-index:200;
  max-width:min(420px,calc(100vw - 32px));
  padding:10px 12px;
  border:1px solid var(--line-strong);
  border-radius:var(--radius-sm);
  background:var(--surface-raised);
  color:var(--text);
  box-shadow:var(--shadow-dialog);
  opacity:0;
  transform:translateY(8px);
  pointer-events:none;
  font-size:.875rem;
  transition:opacity 150ms ease,transform 150ms ease;
}
.global-toast.show{opacity:1;transform:none}
.global-toast[data-type="ok"]{border-color:var(--success)}
.global-toast[data-type="error"]{border-color:var(--danger);background:var(--danger-bg)}
.command-palette{
  width:min(560px,calc(100vw - 24px));
  max-width:none;
  padding:0;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-dialog);
}
.command-shell{display:grid}
.command-search{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-bottom:1px solid var(--line);
}
.command-search input{border:0;background:transparent;box-shadow:none}
.command-list{display:grid;gap:3px;max-height:55vh;overflow:auto;padding:7px}
.command-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  text-align:right;
  border-color:transparent;
  background:transparent;
}
.command-item>span{display:grid;gap:2px}
.command-item strong{font-size:.875rem}
.command-item small{color:var(--text-muted);font-size:.75rem}
.command-item.active,.command-item:hover{border-color:var(--line);background:var(--selection)}
.command-empty{padding:22px;text-align:center;color:var(--text-muted);font-size:.8125rem}
@media(max-width:760px){
  :root{--control-h:44px}
  .topbar,.review-header{
    position:static;
    display:grid;
    padding:10px 12px;
  }
  .topbar nav,.header-actions{
    width:100%;
    min-width:0;
    max-width:100%;
    overflow:visible;
    flex-wrap:wrap;
    padding-bottom:2px;
  }
  .topbar nav{
    display:grid;
    grid-template-columns:repeat(3,max-content);
    justify-content:start;
    align-items:center;
    gap:6px;
  }
  .topbar nav>*,
  .header-actions>*{flex:0 0 auto}
  .two{grid-template-columns:1fr}
  .segmented.five{overflow:auto;grid-template-columns:repeat(5,minmax(52px,1fr))}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    transition-duration:.001ms!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
  }
}


/* Shared micro-polish: restrained, friendly, and motion-safe */
.topbar nav a{position:relative}
.topbar nav a::after{
  content:"";
  position:absolute;
  inset-inline:12px;
  bottom:4px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--accent),var(--accent-alt));
  transform:scaleX(0);
  transition:transform 160ms ease;
  transform-origin:center;
}
.topbar nav a:hover::after,.topbar nav a.active::after{transform:scaleX(1)}
button.primary,.primary{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.status-pill,.gate-badge,.status-badge,.quality-badge{box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.status-pill::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--success);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 13%,transparent);
}
.panel{transition:border-color 160ms ease,box-shadow 160ms ease,transform 160ms ease}
.login-card,.operator-login-card{border-top-color:color-mix(in srgb,var(--accent) 44%,var(--line))}
@media(hover:hover){
  .recent-item,.operator-item,.review-question{transition:transform 150ms ease,border-color 150ms ease,box-shadow 150ms ease}
  .recent-item:hover,.operator-item:hover,.review-question:hover{transform:translateY(-1px)}
}
@media(prefers-reduced-motion:reduce){
  .topbar nav a::after{transition:none!important}
}

/* 2026 premium dark operator refresh
   Inspiration: Linear visual hierarchy, Raycast control chrome, shadcn component restraint. */
:root[data-theme="dark"]{
  --bg:#0A0E15;
  --surface:#111823;
  --surface-subtle:#172130;
  --surface-raised:#151F2C;
  --surface-float:#192535;
  --text:#F4F7FB;
  --text-muted:#A7B2C2;
  --line:#29384A;
  --line-strong:#4A5C72;
  --control-border:#657A92;
  --accent:#8FC8FF;
  --accent-hover:#A7D4FF;
  --accent-alt:#B8ACFF;
  --accent-cyan:#79DFE4;
  --accent-contrast:#07111C;
  --selection:#1A3049;
  --success:#7BDBA8;
  --success-bg:#112D22;
  --warning:#F2C870;
  --warning-bg:#342914;
  --danger:#FF949A;
  --danger-bg:#3B1F25;
  --document-bg:#070B10;
  --backdrop:rgba(4,7,11,.8);
  --shadow:0 14px 34px rgba(0,0,0,.22),0 1px 0 rgba(255,255,255,.025) inset;
  --shadow-dialog:0 34px 100px rgba(0,0,0,.58),0 1px 0 rgba(255,255,255,.045) inset;
  --focus:0 0 0 3px rgba(143,200,255,.18),0 0 0 1px rgba(143,200,255,.5);
  --radius-sm:12px;
  --radius-md:16px;
  --radius-lg:20px;
  --radius-xl:24px;
  --radius-pill:999px;
}:root[data-theme="dark"] body{
  background:
    radial-gradient(920px 560px at 84% -8%,rgba(143,200,255,.105),transparent 60%),
    radial-gradient(760px 480px at 8% 2%,rgba(184,172,255,.07),transparent 66%),
    radial-gradient(520px 420px at 50% 100%,rgba(121,223,228,.035),transparent 72%),
    var(--bg);
  background-attachment:fixed;
}
:root[data-theme="dark"] .panel{
  border-color:color-mix(in srgb,var(--line) 90%,#fff 10%);
  background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 95%,#fff 5%),var(--surface));
  box-shadow:var(--shadow);
}
:root[data-theme="dark"] button,
:root[data-theme="dark"] .button-link{
  border-color:var(--control-border);
  background:linear-gradient(180deg,#182434,#141D29);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 2px 5px rgba(0,0,0,.13);
}
:root[data-theme="dark"] button:hover,
:root[data-theme="dark"] .button-link:hover{
  border-color:#7589A0;
  background:linear-gradient(180deg,#1D2B3D,#172332);
}
:root[data-theme="dark"] button:active,
:root[data-theme="dark"] .button-link:active{transform:translateY(1px)}
:root[data-theme="dark"] button.primary,
:root[data-theme="dark"] .primary{
  border-color:#7ABAF7;
  background:linear-gradient(135deg,#A8D7FF 0%,#8FC8FF 58%,#B8ACFF 140%);
  color:#07111A;
  box-shadow:0 10px 26px rgba(83,157,230,.2),inset 0 1px 0 rgba(255,255,255,.4);
}
:root[data-theme="dark"] button.primary:hover,
:root[data-theme="dark"] .primary:hover{
  border-color:#B0DBFF;
  background:linear-gradient(135deg,#B7DFFF,#9DD0FF 58%,#C5B9FF 140%);
}
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea{
  border-color:#3A4C61;
  background:#0E151F;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.2),0 1px 0 rgba(255,255,255,.018);
}
:root[data-theme="dark"] input:hover,
:root[data-theme="dark"] select:hover,
:root[data-theme="dark"] textarea:hover{border-color:#586D86}
:root[data-theme="dark"] input:focus-visible,
:root[data-theme="dark"] select:focus-visible,
:root[data-theme="dark"] textarea:focus-visible{
  background:#111B28;
  border-color:#7DBDF8;
}
:root[data-theme="dark"] fieldset{
  border-color:#2F4053;
  background:rgba(10,15,23,.28);
}
:root[data-theme="dark"] .topbar,
:root[data-theme="dark"] .review-header{
  border-bottom-color:#233143;
  background:rgba(9,14,22,.84);
  box-shadow:0 8px 30px rgba(0,0,0,.16);
  backdrop-filter:blur(18px) saturate(130%);
}
:root[data-theme="dark"] .topbar::after,
:root[data-theme="dark"] .review-header::after{
  content:"";
  position:absolute;
  inset-inline:0;
  bottom:-1px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(143,200,255,.34),transparent);
  pointer-events:none;
}
:root[data-theme="dark"] .topbar h1,
:root[data-theme="dark"] .review-header h1{
  color:#F8FAFC;
  letter-spacing:-.015em;
}
:root[data-theme="dark"] .eyebrow{
  color:#8091A8;
  letter-spacing:.035em;
}
:root[data-theme="dark"] .status-pill,
:root[data-theme="dark"] .gate-badge,
:root[data-theme="dark"] .status-badge,
:root[data-theme="dark"] .quality-badge{
  border-color:#35475B;
  background:#141F2C;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
:root[data-theme="dark"] .login-view,
:root[data-theme="dark"] .operator-login{
  background:
    radial-gradient(640px 440px at 48% 8%,rgba(143,200,255,.12),transparent 64%),
    radial-gradient(480px 340px at 72% 88%,rgba(184,172,255,.055),transparent 72%),
    #090D14;
}
:root[data-theme="dark"] .login-card,
:root[data-theme="dark"] .operator-login-card{
  border-color:#33475C;
  background:linear-gradient(180deg,#141E2B,#0F1722);
  box-shadow:0 32px 90px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.035);
}
:root[data-theme="dark"] .global-toast{
  border-color:#40536A;
  background:#111B28;
  box-shadow:0 16px 50px rgba(0,0,0,.45);
}
@media(max-width:760px){
  :root[data-theme="dark"] .topbar,
  :root[data-theme="dark"] .review-header{
    background:#0D131B;
    box-shadow:0 7px 24px rgba(0,0,0,.12);
  }
}

/* Scroll-performance hotfix
   Avoid continuous repaint/compositing work while preserving the visual language. */
:root[data-theme="dark"]{
  --shadow:0 7px 18px rgba(0,0,0,.18),0 1px 0 rgba(255,255,255,.025) inset;
}
:root[data-theme="dark"] body{
  background-attachment:scroll;
}
:root[data-theme="dark"] .topbar,
:root[data-theme="dark"] .review-header{
  background:#0C131D;
  box-shadow:0 4px 14px rgba(0,0,0,.13);
  backdrop-filter:none;
}
@media(max-width:760px){
  :root[data-theme="dark"] body{
    background:
      radial-gradient(720px 420px at 84% -8%,rgba(143,200,255,.07),transparent 62%),
      var(--bg);
  }
  :root[data-theme="dark"] .topbar,
  :root[data-theme="dark"] .review-header{
    box-shadow:0 2px 8px rgba(0,0,0,.1);
  }
}