:root,
:root[data-theme="dark"]{
  --bg:#0b1118;
  --bg-end:#05080d;
  --bg2:#101824;
  --panel:#111a26;
  --panel2:#0c121b;
  --border:#2c3848;
  --text:#f4f7fb;
  --muted:#a9b4c3;
  --gold:#d7a900;
  --gold2:#ffd84d;
  --input:#0d1520;
  --chip:#172232;
  --danger:#ff5a5f;
  --success:#39d98a;
  --warning:#ffd84d;
  --info:#78a7ff;
  --accent:#ffd84d;
  --accent-rgb:255,216,77;
  --surface-hi:rgba(255,255,255,.055);
  --surface-lo:rgba(255,255,255,.012);
  --topbar-bg:linear-gradient(135deg,#111a26,#0b1118);
  --topbar-border:#334155;
  --primary-text:#151000;
  --secondary:#1d2a3b;
  --login-orb-a:rgba(255,216,77,.10);
  --login-orb-b:rgba(120,167,255,.05);
  --shadow:0 18px 40px rgba(0,0,0,.42);
  --glow-gold:0 0 0 1px rgba(255,216,77,.24), 0 12px 26px rgba(255,216,77,.12);
  --glow-green:0 0 0 1px rgba(57,217,138,.28), 0 0 20px rgba(57,217,138,.20);
  --glow-red:0 0 0 1px rgba(255,77,94,.28), 0 0 20px rgba(255,77,94,.20);
  --glow-blue:0 0 0 1px rgba(120,167,255,.24), 0 0 20px rgba(120,167,255,.16);
}

:root[data-theme="light"]{
  --bg:#f6f8fb;
  --bg-end:#e1e6ee;
  --bg2:#ffffff;
  --panel:#ffffff;
  --panel2:#f3f5f8;
  --border:#c6ceda;
  --text:#101827;
  --muted:#4b5563;
  --gold:#d7a900;
  --gold2:#ffd84d;
  --input:#ffffff;
  --chip:#e9edf3;
  --danger:#d8344a;
  --success:#0f8f5b;
  --warning:#b98500;
  --info:#2563eb;
  --accent:#d7a900;
  --accent-rgb:255,216,77;
  --surface-hi:rgba(255,255,255,.92);
  --surface-lo:rgba(255,255,255,.50);
  --topbar-bg:linear-gradient(135deg,#ffffff,#eef2f7);
  --topbar-border:#c6ceda;
  --primary-text:#151000;
  --secondary:#d9dde4;
  --login-orb-a:rgba(255,216,77,.13);
  --login-orb-b:rgba(16,24,39,.045);
  --shadow:0 18px 40px rgba(17,24,39,.16);
  --glow-gold:0 0 0 1px rgba(215,169,0,.28), 0 10px 24px rgba(215,169,0,.14);
  --glow-green:0 0 0 1px rgba(15,143,91,.18), 0 10px 24px rgba(15,143,91,.12);
  --glow-red:0 0 0 1px rgba(216,52,74,.18), 0 10px 24px rgba(216,52,74,.12);
  --glow-blue:0 0 0 1px rgba(29,78,216,.18), 0 10px 24px rgba(29,78,216,.12);
}

:root[data-theme="classic"]{
  --bg:#008080;
  --bg-end:#006b6b;
  --bg2:#c0c0c0;
  --panel:#c0c0c0;
  --panel2:#d4d0c8;
  --border:#808080;
  --text:#000000;
  --muted:#303030;
  --gold:#000080;
  --gold2:#000080;
  --input:#ffffff;
  --chip:#d4d0c8;
  --danger:#b91c1c;
  --success:#16743f;
  --warning:#8a5a00;
  --info:#000080;
  --accent:#000080;
  --accent-rgb:0,0,128;
  --surface-hi:rgba(255,255,255,.88);
  --surface-lo:rgba(0,0,0,.06);
  --topbar-bg:linear-gradient(90deg,#000080,#1084d0);
  --topbar-border:#000000;
  --primary-text:#ffffff;
  --secondary:#d4d0c8;
  --login-orb-a:rgba(0,0,128,.10);
  --login-orb-b:rgba(255,255,255,.10);
  --shadow:4px 4px 0 rgba(0,0,0,.28);
  --glow-gold:none;
  --glow-green:0 0 0 1px rgba(22,116,63,.20);
  --glow-red:0 0 0 1px rgba(185,28,28,.20);
  --glow-blue:0 0 0 1px rgba(0,0,128,.20);
}

:root[data-theme="galactic"]{
  --bg:#130018;
  --bg-end:#05000b;
  --bg2:#251040;
  --panel:#26112f;
  --panel2:#17091f;
  --border:#8739b7;
  --text:#fff6ff;
  --muted:#dfb8ee;
  --gold:#ff63c7;
  --gold2:#ff9de2;
  --input:#17091f;
  --chip:#321846;
  --danger:#ff4d7e;
  --success:#5ff0c4;
  --warning:#ffd36e;
  --info:#8ee9ff;
  --accent:#ff63c7;
  --accent-rgb:255,99,199;
  --surface-hi:rgba(255,255,255,.06);
  --surface-lo:rgba(255,99,199,.018);
  --topbar-bg:linear-gradient(135deg,#130018 0 35%,#48206f 36% 68%,#ff63c7 69% 100%);
  --topbar-border:#b75cff;
  --primary-text:#160018;
  --secondary:#3a1c50;
  --login-orb-a:rgba(255,99,199,.20);
  --login-orb-b:rgba(142,233,255,.12);
  --shadow:0 18px 44px rgba(7,0,12,.50);
  --glow-gold:0 0 0 1px rgba(255,99,199,.26), 0 0 24px rgba(255,99,199,.20);
  --glow-green:0 0 0 1px rgba(79,224,170,.26), 0 0 22px rgba(79,224,170,.18);
  --glow-red:0 0 0 1px rgba(255,77,126,.26), 0 0 22px rgba(255,77,126,.18);
  --glow-blue:0 0 0 1px rgba(142,233,255,.26), 0 0 22px rgba(142,233,255,.18);
}

:root[data-theme="minecraft"]{
  --bg:#1d3a1c;
  --bg-end:#102710;
  --bg2:#2f4f22;
  --panel:#2e3f2b;
  --panel2:#3b2a1a;
  --border:#6f6f6f;
  --text:#f5f5dc;
  --muted:#d1c7a8;
  --gold:#54c754;
  --gold2:#8df06f;
  --input:#f4ead2;
  --chip:#4c6b34;
  --danger:#c33b32;
  --success:#4cc45a;
  --warning:#f0c84b;
  --info:#74b9ff;
  --accent:#54c754;
  --accent-rgb:84,199,84;
  --surface-hi:rgba(255,255,255,.08);
  --surface-lo:rgba(0,0,0,.10);
  --topbar-bg:linear-gradient(135deg,#2f6b2f 0 38%,#6a4a2c 39% 68%,#6f6f6f 69% 100%);
  --topbar-border:#8df06f;
  --primary-text:#102710;
  --secondary:#465f38;
  --login-orb-a:rgba(84,199,84,.18);
  --login-orb-b:rgba(111,111,111,.12);
  --shadow:0 18px 42px rgba(0,0,0,.42);
  --glow-gold:0 0 0 1px rgba(141,240,111,.28), 0 0 22px rgba(84,199,84,.20);
  --glow-green:0 0 0 1px rgba(76,196,90,.28), 0 0 20px rgba(76,196,90,.20);
  --glow-red:0 0 0 1px rgba(195,59,50,.28), 0 0 20px rgba(195,59,50,.18);
  --glow-blue:0 0 0 1px rgba(116,185,255,.26), 0 0 20px rgba(116,185,255,.18);
}

*{
  box-sizing:border-box;
}

html,body{
  width:100%;
  min-height:100%;
}

body{
  margin:0;
  font-family:Segoe UI, Arial, sans-serif;
  background:
    radial-gradient(circle at top, var(--login-orb-a), transparent 28%),
    radial-gradient(circle at 20% 20%, var(--login-orb-b), transparent 24%),
    linear-gradient(180deg,var(--bg),var(--bg-end) 70%);
  color:var(--text);
}

:root[data-theme="dark"] body{
  background:
    radial-gradient(circle at 78% 10%, rgba(255,216,77,.10), transparent 20%),
    radial-gradient(circle at 18% 18%, rgba(120,167,255,.06), transparent 22%),
    linear-gradient(180deg,#0b1118,#05080d 72%);
}

:root[data-theme="light"] body{
  background:
    radial-gradient(circle at 18% 10%, rgba(255,216,77,.12), transparent 20%),
    radial-gradient(circle at 80% 18%, rgba(16,24,39,.055), transparent 22%),
    linear-gradient(180deg,#f6f8fb,#e1e6ee 72%);
}

:root[data-theme="dark"] .topbar,
:root[data-theme="dark"] .login-card{
  box-shadow:
    var(--shadow),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(255,216,77,.10);
}

:root[data-theme="light"] .topbar,
:root[data-theme="light"] .login-card{
  box-shadow:
    var(--shadow),
    0 0 0 1px rgba(17,24,39,.10),
    inset 0 1px 0 rgba(255,255,255,.90);
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3{
  text-shadow:none;
}

:root[data-theme="light"] h1,
:root[data-theme="light"] h2,
:root[data-theme="light"] h3{
  letter-spacing:.01em;
}

:root[data-theme="classic"] body{
  background:
    linear-gradient(45deg, rgba(255,255,255,.04) 25%, transparent 25%) 0 0 / 18px 18px,
    linear-gradient(180deg,#008080,#006b6b 72%);
}

:root[data-theme="classic"] .topbar,
:root[data-theme="classic"] .card,
:root[data-theme="classic"] .panel,
:root[data-theme="classic"] .section,
:root[data-theme="classic"] .login-card,
:root[data-theme="classic"] .part-group,
:root[data-theme="classic"] .part-item,
:root[data-theme="classic"] .home-area-tab,
:root[data-theme="classic"] .part-group-header,
:root[data-theme="classic"] .btn,
:root[data-theme="classic"] input,
:root[data-theme="classic"] select,
:root[data-theme="classic"] textarea,
:root[data-theme="classic"] .input{
  border-radius:0;
  border-width:2px;
  box-shadow:
    inset 1px 1px 0 #ffffff,
    inset -1px -1px 0 #404040;
}

:root[data-theme="classic"] .topbar{
  color:#ffffff;
  text-shadow:none;
  font-weight:700;
}

:root[data-theme="classic"] .btn{
  box-shadow:
    inset 1px 1px 0 #ffffff,
    inset -1px -1px 0 #404040,
    1px 1px 0 #000000;
}

:root[data-theme="classic"] .btn:active{
  transform:translate(1px,1px);
  box-shadow:
    inset -1px -1px 0 #ffffff,
    inset 1px 1px 0 #404040;
}

:root[data-theme="galactic"] body{
  background:
    radial-gradient(circle at 18% 16%, rgba(255,99,199,.16), transparent 18%),
    radial-gradient(circle at 86% 12%, rgba(142,233,255,.12), transparent 20%),
    radial-gradient(circle at 62% 78%, rgba(183,92,255,.12), transparent 24%),
    linear-gradient(135deg, rgba(255,255,255,.035) 1px, transparent 1px) 0 0 / 38px 38px,
    linear-gradient(180deg,#130018,#05000b 72%);
}

:root[data-theme="galactic"] .topbar,
:root[data-theme="galactic"] .login-card,
:root[data-theme="galactic"] .card{
  box-shadow:
    var(--shadow),
    0 0 0 1px rgba(255,99,199,.18),
    0 0 28px rgba(255,99,199,.12),
    inset 0 1px 0 rgba(255,255,255,.07);
}

:root[data-theme="galactic"] h1,
:root[data-theme="galactic"] h2,
:root[data-theme="galactic"] h3{
  text-shadow:
    0 0 14px rgba(255,99,199,.24),
    0 0 24px rgba(142,233,255,.10);
}

:root[data-theme="galactic"] .measurement-grid-wrap,
:root[data-theme="galactic"] .measurement-grid-table .input{
  text-shadow:none;
}

:root[data-theme="minecraft"] body{
  image-rendering:pixelated;
  background:
    linear-gradient(45deg, rgba(255,255,255,.035) 25%, transparent 25%) 0 0 / 32px 32px,
    linear-gradient(45deg, transparent 75%, rgba(0,0,0,.12) 75%) 0 0 / 32px 32px,
    linear-gradient(180deg,#2f6b2f 0 22%,#1d3a1c 22% 64%,#3b2a1a 64% 100%);
}

:root[data-theme="minecraft"] .topbar,
:root[data-theme="minecraft"] .card,
:root[data-theme="minecraft"] .panel,
:root[data-theme="minecraft"] .section,
:root[data-theme="minecraft"] .login-card,
:root[data-theme="minecraft"] .part-group,
:root[data-theme="minecraft"] .part-item,
:root[data-theme="minecraft"] .home-area-tab,
:root[data-theme="minecraft"] .part-group-header{
  border-radius:2px;
  border-width:3px;
  box-shadow:
    4px 4px 0 rgba(0,0,0,.42),
    inset 2px 2px 0 rgba(255,255,255,.12),
    inset -2px -2px 0 rgba(0,0,0,.28);
}

:root[data-theme="minecraft"] .topbar{
  letter-spacing:.03em;
  text-shadow:2px 2px 0 rgba(0,0,0,.45);
}

:root[data-theme="minecraft"] .btn,
:root[data-theme="minecraft"] input,
:root[data-theme="minecraft"] select,
:root[data-theme="minecraft"] textarea,
:root[data-theme="minecraft"] .input,
:root[data-theme="minecraft"] .pill,
:root[data-theme="minecraft"] .badge{
  border-radius:2px;
  border-width:2px;
  box-shadow:
    3px 3px 0 rgba(0,0,0,.36),
    inset 1px 1px 0 rgba(255,255,255,.12),
    inset -1px -1px 0 rgba(0,0,0,.25);
}

:root[data-theme="minecraft"] input,
:root[data-theme="minecraft"] select,
:root[data-theme="minecraft"] textarea,
:root[data-theme="minecraft"] .input{
  background:#f4ead2;
  color:#1f2a14;
  border-color:#6a4a2c;
}

:root[data-theme="minecraft"] input::placeholder,
:root[data-theme="minecraft"] textarea::placeholder{
  color:#5d513f;
  opacity:1;
}

:root[data-theme="minecraft"] select option{
  background:#f4ead2;
  color:#1f2a14;
}

:root[data-theme="minecraft"] .btn:hover{
  transform:translate(-1px,-1px);
  filter:brightness(1.08);
  box-shadow:
    4px 4px 0 rgba(0,0,0,.42),
    inset 1px 1px 0 rgba(255,255,255,.14),
    inset -1px -1px 0 rgba(0,0,0,.28);
}

:root[data-theme="minecraft"] .btn:active{
  transform:translate(2px,2px);
  box-shadow:
    1px 1px 0 rgba(0,0,0,.42),
    inset -1px -1px 0 rgba(255,255,255,.08),
    inset 1px 1px 0 rgba(0,0,0,.22);
}

:root[data-theme="minecraft"] h1,
:root[data-theme="minecraft"] h2,
:root[data-theme="minecraft"] h3,
:root[data-theme="minecraft"] .part-group-title,
:root[data-theme="minecraft"] .home-area-tab-label{
  letter-spacing:.025em;
  text-shadow:2px 2px 0 rgba(0,0,0,.30);
}

:root[data-theme="minecraft"] .measurement-grid-wrap,
:root[data-theme="minecraft"] .measurement-grid-table .input{
  image-rendering:auto;
  text-shadow:none;
}

#app{
  width:100%;
  max-width:min(1680px, 98vw);
  margin:0 auto;
  padding:18px 24px 28px;
}

.app-shell{
  width:100%;
  min-height:100vh;
}

.topbar{
  background:var(--topbar-bg);
  color:var(--gold2);
  padding:14px 20px;
  font-size:22px;
  font-weight:700;
  border:1px solid var(--topbar-border);
  border-radius:14px;
  margin-bottom:18px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  box-shadow:var(--shadow), var(--glow-gold);
}

.topbar-actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.app-header{
  position:relative;
  z-index:500;
  width:100%;
  min-height:68px;
  margin-bottom:18px;
  padding:12px 18px;
  border:1px solid var(--topbar-border);
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.72)),
    var(--panel);
  color:#111827;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  box-shadow:var(--shadow);
}

:root[data-theme="dark"] .app-header,
:root[data-theme="galactic"] .app-header{
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.025)),
    var(--panel);
  color:var(--text);
}

.app-header-brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}

.app-header-logo-img{
  height:34px;
  width:auto;
  max-width:min(240px, 52vw);
  display:block;
  object-fit:contain;
  flex-shrink:0;
}

.app-header-jgage-icon{
  width:34px;
  border-radius:8px;
  box-shadow:0 0 0 1px rgba(255,255,255,.16);
}

.app-header-brand-text{
  font-size:20px;
  font-weight:800;
  letter-spacing:.01em;
  color:var(--text);
}

:root[data-theme="dark"] .app-header-logo-img,
:root[data-theme="galactic"] .app-header-logo-img{
  filter:invert(1);
}

:root[data-theme="dark"] .app-header-jgage-icon,
:root[data-theme="galactic"] .app-header-jgage-icon{
  filter:none;
}

.app-header-product{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  white-space:nowrap;
}

.app-header-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

.header-user-greeting{
  font-size:13px;
  font-weight:700;
  color:var(--muted);
  padding:7px 10px;
  border:1px solid var(--border);
  border-radius:999px;
  background:rgba(255,255,255,.04);
}

.app-header-kicker{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.page{
  width:100%;
}

.card,
.panel,
.section{
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    linear-gradient(180deg,var(--panel),var(--panel2));
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:var(--shadow);
  padding:18px;
  margin-bottom:16px;
  width:100%;
  backdrop-filter:blur(3px);
}

h1,h2,h3{
  margin-top:0;
  margin-bottom:12px;
}

h1{
  font-size:24px;
}

h2{
  font-size:20px;
}

h3{
  font-size:17px;
}

button,
input,
select,
textarea{
  font:inherit;
}

input,
select,
textarea,
.input{
  width:100%;
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    var(--input);
  color:var(--text);
  border:1px solid var(--border);
  border-radius:10px;
  padding:12px 14px;
  outline:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

input:focus,
select:focus,
textarea:focus,
.input:focus{
  border-color:var(--gold);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 0 0 3px rgba(var(--accent-rgb),.14),
    0 0 18px rgba(var(--accent-rgb),.12);
}

.btn{
  border-radius:10px;
  padding:11px 15px;
  cursor:pointer;
  font-size:14px;
  font-weight:700;
  border:1px solid var(--border);
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    var(--chip);
  color:var(--text);
  transition:
    transform .15s ease,
    filter .15s ease,
    border-color .15s ease,
    box-shadow .15s ease,
    background .15s ease;
  box-shadow:0 8px 18px rgba(0,0,0,.20);
}

.btn:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
  border-color:rgba(var(--accent-rgb),.40);
  box-shadow:var(--glow-gold), 0 10px 22px rgba(0,0,0,.24);
}

.btn:focus-visible{
  border-color:var(--gold2);
  box-shadow:
    0 0 0 3px rgba(var(--accent-rgb),.16),
    var(--glow-gold),
    0 10px 22px rgba(0,0,0,.24);
}

.btn:disabled{
  opacity:.55;
  cursor:not-allowed;
  transform:none;
  animation:none !important;
}

@keyframes jgage-glow-pulse-green{
  0%, 100%{
    box-shadow:var(--glow-green), 0 0 10px rgba(57,217,138,.12);
  }
  50%{
    box-shadow:var(--glow-green), 0 0 24px rgba(57,217,138,.38), 0 0 6px rgba(57,217,138,.22);
  }
}

@keyframes jgage-glow-pulse-red{
  0%, 100%{
    box-shadow:var(--glow-red), 0 0 10px rgba(255,77,94,.12);
  }
  50%{
    box-shadow:var(--glow-red), 0 0 24px rgba(255,77,94,.36), 0 0 6px rgba(255,77,94,.20);
  }
}

@keyframes jgage-glow-pulse-amber{
  0%, 100%{
    box-shadow:var(--glow-gold), 0 0 10px rgba(var(--accent-rgb),.10);
  }
  50%{
    box-shadow:var(--glow-gold), 0 0 24px rgba(var(--accent-rgb),.28), 0 0 6px rgba(var(--accent-rgb),.16);
  }
}

.btn-primary{
  background:
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.03)),
    linear-gradient(180deg, rgba(var(--accent-rgb),.34), rgba(var(--accent-rgb),.12));
  color:var(--primary-text);
  border-color:rgba(var(--accent-rgb),.72);
  box-shadow:var(--glow-gold), 0 10px 24px rgba(var(--accent-rgb),.14);
  animation:jgage-glow-pulse-amber 2.6s ease-in-out infinite;
}

.btn-primary:hover{
  transform:translateY(-1px);
  filter:brightness(1.05);
  border-color:var(--gold2);
  box-shadow:var(--glow-gold), 0 12px 26px rgba(var(--accent-rgb),.22), 0 0 22px rgba(var(--accent-rgb),.18);
}

.btn-primary:focus-visible{
  border-color:var(--gold2);
  box-shadow:
    0 0 0 3px rgba(var(--accent-rgb),.16),
    0 12px 26px rgba(var(--accent-rgb),.24),
    var(--glow-gold);
}

.btn-secondary{
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    var(--secondary);
  color:var(--text);
}

.btn-danger{
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.02)),
    linear-gradient(180deg, rgba(255,90,95,.28), rgba(255,90,95,.10));
  color:#101827;
  border-color:rgba(198,58,74,.82);
  box-shadow:var(--glow-red), 0 10px 22px rgba(255,77,94,.12);
  animation:jgage-glow-pulse-red 2.6s ease-in-out infinite;
}

.btn-danger:hover,
.btn-danger:focus-visible{
  transform:translateY(-1px);
  filter:brightness(1.05);
  box-shadow:var(--glow-red), 0 14px 28px rgba(255,77,94,.20), 0 0 22px rgba(255,77,94,.18);
}

.scroll-panel{
  max-height:520px;
  overflow-y:auto;
  padding-right:4px;
}

.btn-clear-table{
  border-color:rgba(216,52,74,.75);
}

.btn-clear-table:hover,
.btn-clear-table:focus-visible{
  transform:translateY(-1px);
  filter:brightness(1.04);
}

.btn-success{
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.02)),
    linear-gradient(180deg, rgba(57,217,138,.28), rgba(57,217,138,.10));
  color:#dffff0;
  border-color:rgba(34,184,110,.78);
  box-shadow:var(--glow-green), 0 10px 22px rgba(57,217,138,.12);
  animation:jgage-glow-pulse-green 2.6s ease-in-out infinite;
}

.btn-success:hover,
.btn-success:focus-visible{
  transform:translateY(-1px);
  filter:brightness(1.05);
  box-shadow:var(--glow-green), 0 14px 28px rgba(57,217,138,.18), 0 0 22px rgba(57,217,138,.22);
}

:root[data-theme="light"] .btn-success{
  color:#064e3b;
}

:root[data-theme="light"] .btn-danger{
  color:#101827;
}

@media (prefers-reduced-motion: reduce){
  .btn-primary,
  .btn-danger,
  .btn-success{
    animation:none;
  }
}

.btn-row,
.row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.col{
  flex:1 1 240px;
  min-width:0;
}

.grid{
  display:grid;
  gap:12px;
}

.grid-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.grid-3{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.grid-4{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.field label{
  font-size:13px;
  color:var(--muted);
}

.note,
.muted{
  color:var(--muted);
  font-size:13px;
}

.error{
  color:#ff8f9b;
  font-weight:700;
  text-shadow:0 0 10px rgba(255,77,94,.28);
}

.success{
  color:#7af0b7;
  font-weight:700;
  text-shadow:0 0 10px rgba(57,217,138,.28);
}

.center{
  text-align:center;
}

.small{
  font-size:12px;
}

#app:has(> .app-header){
  display:flex;
  flex-direction:column;
  min-height:100dvh;
}

.page.login-page{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 0 24px;
}

.login-wrap{
  width:100%;
  max-width:480px;
  padding:0 20px;
}

.login-card{
  width:100%;
  max-width:480px;
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    linear-gradient(180deg,var(--panel),var(--panel2));
  border:1px solid var(--border);
  border-radius:14px;
  padding:24px;
  box-shadow:var(--shadow), 0 0 40px rgba(255,255,255,.03);
}

.login-product-title{
  font-size:32px;
  line-height:1.05;
  letter-spacing:.02em;
  margin-bottom:8px;
}

.login-title-with-icon{
  display:flex;
  align-items:center;
  gap:12px;
}

.login-title-icon{
  width:44px;
  height:44px;
  border-radius:11px;
  flex:0 0 auto;
  box-shadow:0 0 0 1px rgba(255,255,255,.18), 0 10px 20px rgba(var(--accent-rgb),.20);
}

.login-product-subtitle{
  color:var(--muted);
  font-size:17px;
  font-weight:700;
  letter-spacing:.03em;
  margin:0 0 22px 0;
}

.password-field{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
}

.password-field .input{
  min-width:0;
}

.password-toggle{
  border:1px solid var(--border);
  border-radius:8px;
  width:46px;
  height:46px;
  padding:0;
  color:var(--gold2);
  background:var(--chip);
  cursor:pointer;
  font-weight:700;
  font-size:20px;
  line-height:1;
  user-select:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 46px;
}

.password-toggle:hover{
  border-color:rgba(var(--accent-rgb),.42);
  background:rgba(var(--accent-rgb),.10);
}

.password-toggle.password-toggle-active{
  border-color:var(--gold2);
  color:var(--primary-text);
  background:var(--gold2);
  box-shadow:var(--glow-gold);
}

.password-toggle:active{
  transform:translateY(1px);
  background:rgba(var(--accent-rgb),.16);
}

.login-style-menu{
  position:absolute;
  top:18px;
  right:18px;
  z-index:40;
}

.home-header-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
}

.audit-formula-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
  gap:14px;
  margin-top:16px;
}

.audit-formula-card{
  display:grid;
  gap:12px;
  padding:18px;
  border:1px solid var(--border);
  border-radius:16px;
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    var(--panel);
  box-shadow:var(--shadow);
}

.audit-formula-card h3{
  margin:0 0 8px 0;
  color:var(--text);
}

.audit-formula-card code{
  display:block;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(0,0,0,.08);
  color:var(--text);
  white-space:normal;
  overflow-wrap:anywhere;
}

.audit-formula-card ul{
  margin:0;
  padding-left:18px;
  color:var(--muted);
}

.audit-tab-bar{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:12px;
}

.audit-tab-btn{
  border:1px solid var(--border);
  border-radius:999px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  padding:8px 14px;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}

.audit-tab-btn.is-active{
  background:linear-gradient(180deg, rgba(255,220,120,.42), rgba(255,200,80,.18));
  border-color:rgba(215,169,0,.55);
  color:var(--text);
  box-shadow:var(--glow-gold);
}

.audit-tab-panel{
  display:none;
}

.audit-tab-panel.is-active{
  display:block;
}

.audit-screen-tabs,
.analysis-audit-panel[data-audit-tabs-root]{
  border:none;
  background:transparent;
  padding:0;
}

.analysis-audit-block + .analysis-audit-block{
  margin-top:14px;
  padding-top:14px;
  border-top:1px dashed #bfdbfe;
}

.serial-input.serial-input-duplicate{
  border-color:#dc2626 !important;
  box-shadow:0 0 0 2px rgba(220,38,38,.18);
}

.style-menu{
  position:relative;
  display:inline-flex;
}

.style-menu-toggle{
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid var(--border);
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    var(--chip);
  color:var(--text);
  cursor:pointer;
  font-size:22px;
  line-height:1;
  box-shadow:0 8px 18px rgba(0,0,0,.20);
  transition:transform .15s ease, filter .15s ease, box-shadow .15s ease;
}

.style-menu-toggle:hover,
.style-menu-open .style-menu-toggle{
  transform:translateY(-1px);
  filter:brightness(1.06);
  border-color:var(--gold);
  box-shadow:var(--glow-gold), 0 10px 22px rgba(0,0,0,.22);
}

.style-menu-panel{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  width:220px;
  display:none;
  padding:10px;
  border:1px solid var(--border);
  border-radius:14px;
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    linear-gradient(180deg,var(--panel),var(--panel2));
  box-shadow:var(--shadow), var(--glow-gold);
  z-index:510;
}

.style-menu-open .style-menu-panel{
  display:grid;
  gap:6px;
}

.style-menu-title{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:2px 4px 6px;
}

.style-menu-option{
  width:100%;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
  border:1px solid transparent;
  border-radius:10px;
  background:transparent;
  color:var(--text);
  cursor:pointer;
  padding:9px 10px;
  text-align:left;
  font-weight:700;
}

.style-menu-option:hover,
.style-menu-option-active{
  border-color:rgba(var(--accent-rgb),.34);
  background:rgba(var(--accent-rgb),.12);
}

.style-menu-divider{
  height:1px;
  margin:4px 2px;
  background:var(--border);
}

.style-menu-action{
  margin-top:2px;
}

.style-menu-action-icon{
  width:18px;
  text-align:center;
  font-size:14px;
  line-height:1;
}

.change-pass-overlay{
  position:fixed;
  inset:0;
  z-index:120;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(0,0,0,.55);
}

.change-pass-modal{
  width:min(460px, 100%);
  max-height:min(90vh, 720px);
  overflow:auto;
}

.theme-swatch{
  width:38px;
  height:24px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.30);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30);
}

.theme-swatch-dark{
  background:linear-gradient(135deg,#0b1118 0 48%,#ffd84d 50% 100%);
}

.theme-swatch-light{
  background:linear-gradient(135deg,#ffffff 0 44%,#e1e6ee 46% 64%,#ffd84d 66% 100%);
}

.theme-swatch-classic{
  background:linear-gradient(135deg,#008080 0 36%,#c0c0c0 38% 66%,#000080 68% 100%);
}

.theme-swatch-galactic{
  background:linear-gradient(135deg,#05000b 0 34%,#8739b7 36% 64%,#ff63c7 66% 100%);
}

.theme-swatch-minecraft{
  background:linear-gradient(135deg,#2f6b2f 0 34%,#6a4a2c 36% 66%,#6f6f6f 68% 100%);
}

.table-wrap{
  overflow:auto;
  border:1px solid var(--border);
  border-radius:14px;
  background:rgba(255,255,255,.02);
}

table{
  width:100%;
  border-collapse:collapse;
  min-width:1000px;
  background:transparent;
}

th,
td{
  border-bottom:1px solid var(--border);
  padding:10px 8px;
  text-align:left;
  vertical-align:middle;
}

th{
  background:rgba(255,255,255,.02);
  color:var(--text);
  font-weight:700;
}

.status-pass{
  color:var(--success);
  font-weight:800;
  text-shadow:0 0 10px rgba(57,217,138,.32);
}

.status-fail{
  color:var(--danger);
  font-weight:800;
  text-shadow:0 0 10px rgba(255,77,94,.32);
}

.status-incomplete{
  color:var(--info);
  font-weight:800;
  text-shadow:0 0 10px rgba(87,166,255,.32);
}

.pill,
.badge{
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  background:rgba(212,170,0,.12);
  color:var(--gold2);
  border:1px solid rgba(255,216,77,.28);
  box-shadow:var(--glow-gold);
}

.section-title{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}

.locked-banner{
  background:rgba(255,216,77,.08);
  border:1px solid rgba(255,216,77,.24);
  color:#ffe680;
  padding:10px 12px;
  border-radius:10px;
  margin-bottom:12px;
  box-shadow:var(--glow-gold);
}

.row-active{
  outline:2px solid rgba(255,216,77,.45);
  outline-offset:-2px;
  box-shadow:var(--glow-gold);
}

.home-tabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.home-tab{
  border-radius:999px;
  padding:7px 14px;
  cursor:pointer;
  font-weight:700;
  font-size:13px;
  border:1px solid var(--border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)),
    var(--chip);
  color:var(--muted);
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:border-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.home-tab:hover{
  border-color:rgba(255,216,77,.40);
  color:var(--text);
}

.home-tab-active{
  color:#111;
  background:
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.04)),
    var(--gold2);
  border-color:#c9a400;
  box-shadow:var(--glow-gold);
}

.home-tab-count{
  display:inline-block;
  min-width:20px;
  text-align:center;
  padding:1px 7px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  background:rgba(0,0,0,.22);
  color:inherit;
}

.home-tab-active .home-tab-count{
  background:rgba(0,0,0,.18);
}

.home-parts-panel{
  margin-top:12px;
  overflow:visible;
  padding-right:2px;
}

.home-card .part-group-title{
  min-width:0;
  word-break:break-word;
}

.home-area-tabs{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:12px;
  margin-bottom:14px;
}

.home-area-tab{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:3px 12px;
  align-items:center;
  min-height:66px;
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)),
    var(--panel2);
  color:var(--text);
  text-align:left;
  cursor:pointer;
  box-shadow:0 10px 20px rgba(0,0,0,.16);
}

.home-area-tab:hover,
.home-area-tab-active{
  border-color:var(--gold);
  background:
    linear-gradient(180deg, rgba(var(--accent-rgb),.10), rgba(var(--accent-rgb),.025)),
    var(--panel2);
  box-shadow:var(--glow-gold), 0 12px 24px rgba(0,0,0,.22);
}

.home-area-tab-label{
  font-size:17px;
  font-weight:800;
}

.home-area-tab .note{
  grid-column:1 / 2;
}

.home-empty-state{
  cursor:default;
}

.home-empty-state:hover{
  border-color:var(--border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
    rgba(255,255,255,.015);
  box-shadow:0 10px 20px rgba(0,0,0,.18);
}

.home-loading-state,
.home-run-stats-pending{
  color:var(--muted);
  font-style:italic;
}

.chart-export-actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  justify-content:flex-end;
}

.chart-bulk-export-actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  justify-content:flex-end;
}

.chart-export-btn{
  font-size:12px;
  padding:6px 10px;
  min-height:30px;
}

.chart-export-btn:disabled{
  opacity:.55;
  cursor:not-allowed;
}

.chart-export-card{
  background:#ffffff;
}

.part-item-layout{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto 150px minmax(190px, 220px);
  gap:16px 18px;
  align-items:center;
  width:100%;
}

.part-item-main{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
  cursor:pointer;
}

.part-item-title{
  font-size:15px;
}

.part-item-meta{
  display:flex;
  gap:12px 20px;
  flex-wrap:wrap;
}

.part-item-owner{
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid var(--border);
  width:100%;
  color:var(--text);
  font-weight:600;
}

.part-item-owner strong{
  color:var(--muted);
  font-weight:700;
  margin-right:6px;
}

.part-item-status-slot{
  align-self:stretch;
  min-width:190px;
  padding-left:16px;
  border-left:1px solid rgba(255,255,255,.12);
  cursor:default;
}

.qcq-review-panel{
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
}

.qcq-status-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.qcq-temp-pill{
  display:inline-flex;
  align-items:center;
  color:#d6a400;
  padding:0;
  text-transform:none;
  letter-spacing:0;
}

.qcq-status-checks{
  display:flex;
  flex-direction:column;
  gap:5px;
}

.qcq-status-check{
  width:100%;
  min-height:22px;
  display:flex;
  align-items:center;
  gap:6px;
  border:none;
  border-radius:0;
  padding:0;
  background:transparent;
  color:var(--text);
  font-size:12px;
  font-weight:800;
  line-height:1.2;
  text-align:left;
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease, color .15s ease, opacity .15s ease;
}

.qcq-status-check:disabled{
  cursor:default;
  opacity:1;
}

.qcq-status-check:not(:disabled):hover{
  text-decoration:underline;
  text-underline-offset:2px;
}

.qcq-status-box{
  width:26px;
  min-width:26px;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  border:none;
  border-radius:0;
  font-size:12px;
  font-weight:900;
  background:transparent;
  font-family:var(--mono, Consolas, monospace);
}

.qcq-status-check.is-danger{
  color:#d63333;
}

.qcq-status-check.is-danger.is-checked{
  color:#d63333;
}

.qcq-status-check.is-success{
  color:#18894b;
}

.qcq-status-check.is-success.is-checked{
  color:#18894b;
}

.qcq-status-check.is-info{
  color:#2b62b8;
}

.qcq-status-check.is-info.is-checked{
  color:#2b62b8;
}

.qcq-status-check.is-neutral{
  color:#4f5562;
}

.qcq-status-check.is-neutral.is-checked{
  color:#4f5562;
}

.qcq-comment-row{
  display:flex;
  gap:6px;
}

.qcq-review-comment{
  min-width:0;
  height:32px;
  font-size:12px;
}

.qcq-comment-save{
  min-height:32px;
  padding:5px 9px;
  font-size:12px;
}

.part-item-stats{
  text-align:right;
  min-width:150px;
  cursor:pointer;
}

.part-item-thumb-column{
  display:flex;
  flex-direction:column;
  gap:8px;
  align-items:stretch;
  justify-content:flex-start;
  width:128px;
  min-width:128px;
  flex-shrink:0;
}

.home-open-tab-btn{
  width:100%;
  min-height:40px;
  padding:8px 12px;
  font-size:14px;
  font-weight:800;
  text-align:center;
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1.2;
  white-space:nowrap;
  box-sizing:border-box;
  overflow:hidden;
  letter-spacing:.02em;
}

.part-item-thumb-placeholder{
  width:128px;
  height:84px;
  border:1px dashed var(--border);
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  color:var(--muted);
  background:rgba(255,255,255,.03);
  text-align:center;
  padding:8px;
  box-sizing:border-box;
}

.part-item-thumb-wrap{
  position:relative;
  width:128px;
  height:84px;
  border:1px solid var(--border);
  border-radius:10px;
  background:#fff;
  overflow:visible;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(0,0,0,.20);
  z-index:2;
}

.part-item-thumb{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border-radius:9px;
  background:#fff;
}

.part-item-thumb-preview{
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  z-index:80;
  width:min(560px, 76vw);
  max-height:430px;
  padding:8px;
  border:1px solid var(--gold);
  border-radius:14px;
  background:#fff;
  box-shadow:var(--glow-gold), 0 18px 40px rgba(0,0,0,.45);
  opacity:0;
  transform:translateY(-4px) scale(.98);
  pointer-events:none;
  transition:opacity .14s ease, transform .14s ease;
}

.part-item-thumb-preview img{
  width:100%;
  max-height:410px;
  display:block;
  object-fit:contain;
  border-radius:10px;
  background:#fff;
}

.part-item-thumb-wrap:hover,
.part-item-thumb-wrap:focus-within{
  border-color:var(--gold);
  box-shadow:var(--glow-gold), 0 10px 22px rgba(0,0,0,.24);
}

.part-item-thumb-wrap:hover .part-item-thumb-preview,
.part-item-thumb-wrap:focus-within .part-item-thumb-preview{
  opacity:1;
  transform:translateY(0) scale(1);
}

.part-groups{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:2px;
}

.part-group{
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(255,255,255,.015);
  overflow:visible;
}

.part-group-header{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  cursor:pointer;
  border:none;
  border-bottom:1px solid var(--border);
  border-radius:11px 11px 0 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)),
    var(--panel2);
  color:var(--text);
  font-weight:700;
  text-align:left;
}

.part-group:not(:has(.part-group-body)) .part-group-header{
  border-bottom:none;
  border-radius:11px;
}

.part-group-header:hover{
  background:
    linear-gradient(180deg, rgba(255,216,77,.06), rgba(255,216,77,.02)),
    var(--panel2);
}

.part-group-caret{
  color:var(--gold2);
  font-size:11px;
  width:14px;
}

.part-group-title{
  flex:1 1 auto;
  font-size:15px;
}

.part-group-body{
  padding:12px;
  overflow:visible;
}

.part-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:2px;
}

.part-item{
  position:relative;
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
    rgba(255,255,255,.015);
  cursor:default;
  box-shadow:0 10px 20px rgba(0,0,0,.18);
}

.part-item:hover{
  z-index:30;
  border-color:var(--gold);
  background:
    linear-gradient(180deg, rgba(255,216,77,.08), rgba(255,216,77,.02)),
    rgba(255,255,255,.02);
  box-shadow:var(--glow-gold), 0 12px 24px rgba(0,0,0,.22);
}

.reference-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
    rgba(255,255,255,.015);
  margin-bottom:12px;
}

.reference-item:last-child{
  margin-bottom:0;
}

.reference-meta{
  min-width:0;
}

.reference-meta a,
.reference-meta .link{
  color:#9cc7ff;
  text-decoration:none;
  word-break:break-all;
  text-shadow:0 0 10px rgba(87,166,255,.18);
}

.reference-meta a:hover{
  text-decoration:underline;
}

select.status-pass,
input.status-pass{
  background:rgba(57,217,138,.12);
  border-color:#22b86e;
  color:#dffff0;
  box-shadow:var(--glow-green);
}

select.status-fail,
input.status-fail{
  background:rgba(255,77,94,.12);
  border-color:#c63a4a;
  color:#ffe5e8;
  box-shadow:var(--glow-red);
}

select.status-incomplete,
input.status-incomplete{
  background:rgba(87,166,255,.10);
  border-color:#4f96eb;
  color:#deecff;
  box-shadow:var(--glow-blue);
}

@media (max-width: 1100px){
  #app{
    max-width:100%;
    padding:16px;
  }

  .part-item-layout{
    grid-template-columns:1fr;
  }

  .part-item-status-slot{
    padding-left:0;
    padding-top:12px;
    border-left:none;
    border-top:1px solid rgba(255,255,255,.12);
  }

  .part-item-thumb-wrap{
    width:140px;
    height:92px;
  }

  .part-item-thumb-preview{
    left:0;
    right:auto;
  }

  .part-item-stats{
    text-align:left;
  }

  .grid-4{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 800px){
  .grid-3,
  .grid-2,
  .grid-4{
    grid-template-columns:1fr;
  }

  .topbar{
    flex-direction:column;
    align-items:flex-start;
  }

  .reference-item{
    flex-direction:column;
    align-items:flex-start;
  }

}

@media (max-width: 520px){
  .password-field{
    grid-template-columns:minmax(0,1fr) auto;
  }

  .password-toggle{
    width:46px;
  }

}

.autocomplete-field{
  position:relative;
  z-index:100;
}

.autocomplete-field:focus-within{
  z-index:200;
}

.filter-field-required label{
  font-weight:700;
}

.filter-required-mark{
  color:#dc2626;
  font-weight:900;
  margin-left:2px;
  text-shadow:0 0 8px rgba(220,38,38,.45);
}

.filter-field-required.is-empty .autocomplete-input,
.filter-field-required.is-empty .input{
  border-color:rgba(234,179,8,.95);
  box-shadow:var(--glow-gold);
}

.filter-field-required.is-filled .autocomplete-input,
.filter-field-required.is-filled .input{
  border-color:rgba(22,163,74,.85);
  box-shadow:var(--glow-green);
}

.filter-limit-presets{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.filter-limit-preset{
  min-width:44px;
  padding:6px 8px;
  font-size:12px;
}

.analysis-export-note{
  margin-top:14px;
  padding:10px 12px;
  border:1px solid rgba(148,163,184,.38);
  border-radius:10px;
  background:rgba(248,250,252,.82);
  color:#475569;
  font-size:12px;
  line-height:1.35;
}

.analysis-export-note-title{
  color:#0f172a;
  font-weight:800;
  margin-bottom:3px;
}

.analysis-summary-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.analysis-scope-badge{
  display:inline-flex;
  align-items:center;
  padding:4px 9px;
  border:1px solid #cbd5e1;
  border-radius:999px;
  background:#f8fafc;
  color:#475569;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
}

.analysis-scope-badge.is-full{
  border-color:#93c5fd;
  background:#eff6ff;
  color:#1d4ed8;
}

#analysisAuditModeBtn.is-active{
  border-color:#2563eb;
  background:#eff6ff;
  color:#1d4ed8;
  box-shadow:0 0 0 2px rgba(37,99,235,.12);
}

.analysis-section-note{
  display:flex;
  align-items:flex-start;
  gap:10px;
  flex-wrap:wrap;
  margin:16px 0 8px;
  padding:10px 12px;
  border-left:4px solid #2563eb;
  border-radius:10px;
  background:#eff6ff;
  color:#334155;
}

.analysis-section-note strong{
  color:#1e3a8a;
  font-weight:900;
}

.analysis-section-note span{
  color:#475569;
}

.analysis-chart-section-card{
  display:grid;
  gap:14px;
}

.analysis-chart-section-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  flex-wrap:wrap;
}

.analysis-chart-section-body{
  display:grid;
  gap:14px;
}

.analysis-chart-section-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.analysis-spc-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0;
  padding:6px 10px;
  border:1px solid #99f6e4;
  border-radius:8px;
  background:#f0fdfa;
  color:#115e59;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  user-select:none;
  white-space:nowrap;
}

.analysis-spc-toggle input{
  margin:0;
  accent-color:#0f766e;
}

.plan-save-status.is-loading{
  color:#2563eb;
  font-weight:700;
}

.plan-save-status.is-success{
  color:#15803d;
  font-weight:700;
}

.plan-save-status.is-error{
  color:#dc2626;
  font-weight:700;
}

.analysis-audit-panel{
  margin-top:14px;
  padding:13px 14px;
  border:1px solid #bfdbfe;
  border-left:4px solid #2563eb;
  border-radius:10px;
  background:#f8fbff;
  color:#1e293b;
}

.analysis-audit-title{
  margin-bottom:8px;
  color:#1e3a8a;
  font-weight:900;
}

.analysis-audit-panel code{
  display:block;
  overflow-wrap:anywhere;
  padding:8px 10px;
  border:1px solid #dbeafe;
  border-radius:8px;
  background:#ffffff;
  color:#0f172a;
  font-size:12px;
}

.analysis-audit-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));
  gap:7px 14px;
  margin-top:10px;
  font-size:12px;
}

.analysis-audit-future{
  display:grid;
  gap:7px;
  margin-top:12px;
  padding-top:10px;
  border-top:1px dashed #bfdbfe;
}

.analysis-evidence-card{
  margin-top:14px;
}

.analysis-evidence-header,
.analysis-evidence-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

.analysis-evidence-list{
  display:grid;
  gap:8px;
  margin-top:14px;
}

.analysis-evidence-run{
  border:1px solid #dbe3ee;
  border-radius:10px;
  background:#ffffff;
}

.analysis-evidence-run summary{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  padding:10px 12px;
  cursor:pointer;
  color:#334155;
  font-size:12px;
}

.analysis-evidence-run summary strong{
  color:#0f172a;
}

.analysis-evidence-run-body{
  display:grid;
  gap:10px;
  padding:0 12px 12px;
}

.analysis-evidence-scope{
  display:grid;
  gap:5px;
  padding:10px;
  border:1px solid #e2e8f0;
  border-radius:8px;
  background:#f8fafc;
}

.analysis-evidence-scope p{
  margin:0;
  color:#475569;
  white-space:pre-wrap;
}

.analysis-evidence-scope a{
  width:max-content;
  max-width:100%;
  color:#1d4ed8;
  overflow-wrap:anywhere;
}

.analysis-attachment-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:8px 10px;
  margin-top:4px;
  border:1px solid #d6dde8;
  border-radius:10px;
  background:#fff;
}

.analysis-evidence-toolbar{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  margin:12px 0;
}

.analysis-attachment-select,
.analysis-attachment-select-all{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.analysis-attachment-select span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.analysis-attachment-preview-modal{
  width:min(960px, 100%);
}

.analysis-attachment-preview-body{
  min-height:280px;
}

.analysis-attachment-preview-body img,
.analysis-attachment-preview-body iframe{
  width:100%;
  max-height:min(70vh, 720px);
  border:1px solid #dbe3ec;
  border-radius:12px;
  background:#f8fafc;
}

.analysis-attachment-preview-body iframe{
  min-height:520px;
}

.analysis-attachment-actions{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  flex-shrink:0;
}

.analysis-attachment-actions .btn{
  white-space:nowrap;
}

.analysis-search-status{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:38px;
  margin-top:12px;
  padding:9px 12px;
  border:1px solid rgba(148,163,184,.36);
  border-radius:10px;
  background:rgba(248,250,252,.88);
  color:#334155;
  font-weight:700;
  transition:background-color .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease;
}

.analysis-search-status.is-neutral{
  color:#334155;
  background:rgba(248,250,252,.88);
  border-color:rgba(148,163,184,.36);
}

.analysis-search-status.is-loading{
  color:#7c2d12;
  background:#fffbeb;
  border-color:rgba(245,158,11,.58);
  box-shadow:0 0 0 1px rgba(245,158,11,.12), 0 0 18px rgba(245,158,11,.14);
  animation:analysis-status-thinking 1.2s ease-in-out infinite;
}

.analysis-search-status.is-success{
  color:#14532d;
  background:#f0fdf4;
  border-color:rgba(34,197,94,.48);
  box-shadow:0 0 0 1px rgba(34,197,94,.12), 0 0 18px rgba(34,197,94,.14);
}

.analysis-search-status.is-error{
  color:#7f1d1d;
  background:#fff1f2;
  border-color:rgba(239,68,68,.52);
  box-shadow:0 0 0 1px rgba(239,68,68,.12), 0 0 18px rgba(239,68,68,.14);
}

.analysis-search-status-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  flex:0 0 18px;
  font-weight:900;
}

.analysis-search-status.is-neutral .analysis-search-status-icon{
  color:#64748b;
}

.analysis-search-status.is-success .analysis-search-status-icon{
  color:#16a34a;
}

.analysis-search-status.is-error .analysis-search-status-icon{
  color:#dc2626;
}

.analysis-search-spinner{
  width:16px;
  height:16px;
  flex:0 0 16px;
  border:2px solid rgba(245,158,11,.22);
  border-top-color:#f59e0b;
  border-radius:50%;
  animation:analysis-spinner .75s linear infinite;
}

@keyframes analysis-spinner{
  to{ transform:rotate(360deg); }
}

@keyframes analysis-status-thinking{
  0%,100%{ box-shadow:0 0 0 1px rgba(245,158,11,.10), 0 0 10px rgba(245,158,11,.08); }
  50%{ box-shadow:0 0 0 2px rgba(245,158,11,.18), 0 0 20px rgba(245,158,11,.18); }
}

@media (prefers-reduced-motion: reduce){
  .analysis-search-status.is-loading,
  .analysis-search-spinner{
    animation:none;
  }
}
.autocomplete-list{
  position:absolute;
  top:100%;
  left:0;
  right:0;
  z-index:9999;
  margin-top:6px;
  max-height:260px;
  overflow:auto;
  border:1px solid var(--border);
  border-radius:12px;
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    linear-gradient(180deg,var(--panel),var(--panel2));
  box-shadow:var(--shadow);
}

.history-analysis-filters-card{
  position:relative;
  z-index:30;
}

.history-analysis-results-card{
  position:relative;
  z-index:1;
}

.autocomplete-item{
  width:100%;
  text-align:left;
  border:none;
  border-bottom:1px solid var(--border);
  background:transparent;
  color:var(--text);
  padding:10px 12px;
  cursor:pointer;
}

.autocomplete-item:last-child{
  border-bottom:none;
}

.autocomplete-item:hover,
.autocomplete-item.active,
.autocomplete-item.is-highlighted{
  background:rgba(var(--accent-rgb),.10);
}

/* Production Time list scrolls with the wheel only; the scrollbar is hidden so the
   short hour list keeps the same width as the input. */
.production-time-list{
  max-height:240px;
  overscroll-behavior:contain;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.production-time-list::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}

.measure-run-header-card{
  position:relative;
  z-index:40;
  overflow:visible;
}

.measure-run-header-card .production-time-list{
  z-index:10000;
}

.admin-characteristics-toolbar{
  position:sticky;
  top:0;
  z-index:40;
  background:
    linear-gradient(180deg, var(--surface-hi), var(--surface-lo)),
    linear-gradient(180deg,var(--panel),var(--panel2));
}

.admin-characteristics-table thead th{
  position:sticky;
  top:0;
  z-index:20;
  background:var(--panel);
}

.admin-characteristics-table th:nth-child(1),
.admin-characteristics-table td:nth-child(1){
  position:sticky;
  left:0;
  z-index:24;
  min-width:200px;
  background:var(--panel);
}

.admin-characteristics-table th:nth-child(2),
.admin-characteristics-table td:nth-child(2){
  position:sticky;
  left:200px;
  z-index:23;
  min-width:220px;
  background:var(--panel);
}

.admin-characteristics-table thead th:nth-child(1),
.admin-characteristics-table thead th:nth-child(2){
  z-index:30;
}

.measurement-grid-wrap{
  overflow:auto;
  max-height:560px;
  border:1px solid #b7c3d0;
  border-radius:12px;
  background:#f3f6f9;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}

/* Compact density (same look for LP T01232-4 and IQC plans like MPJ1335). */
.measurement-grid-wrap--compact,
.measurement-grid-wrap--lp{
  max-height:560px;
  overflow:auto;
}

.measurement-grid-table{
  width:max-content;
  min-width:max(100%, 980px);
  border-collapse:collapse;
  table-layout:fixed;
  color:#17202a;
  background:#ffffff;
  font-size:12px;
}

.measurement-grid-table--compact,
.measurement-grid-table--lp{
  width:100%;
  min-width:100%;
  font-size:11px;
}

.measurement-grid-wrap--compact .measure-header-cell,
.measurement-grid-wrap--lp .measure-header-cell{
  padding:6px 4px;
  line-height:1.2;
}

.measurement-grid-wrap--compact .measure-char-name,
.measurement-grid-wrap--lp .measure-char-name{
  font-size:11px;
  white-space:normal;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}

.measurement-grid-wrap--compact .measure-char-meta,
.measurement-grid-wrap--compact .measure-char-instrument,
.measurement-grid-wrap--lp .measure-char-meta,
.measurement-grid-wrap--lp .measure-char-instrument{
  font-size:9px;
  line-height:1.2;
  margin-top:2px;
}

.measure-char-instructions-row{
  margin-top:4px;
  display:flex;
  justify-content:flex-start;
  align-items:center;
  min-height:22px;
}

.measure-char-instructions-empty{
  display:inline-block;
  min-height:20px;
}

.measurement-grid-wrap--compact .measure-char-instructions-row,
.measurement-grid-wrap--lp .measure-char-instructions-row{
  margin-top:3px;
  min-height:20px;
}

.measurement-grid-wrap--compact .measure-char-help-btn,
.measurement-grid-wrap--lp .measure-char-help-btn{
  width:100%;
  padding:2px 4px;
  font-size:9px;
  border-radius:6px;
}

/* PASS/FAIL selects: same size on LP and non-LP compact grids. */
.measurement-grid-wrap--compact .measurement-grid-table input.input,
.measurement-grid-wrap--lp .measurement-grid-table input.input{
  padding:4px 6px;
  font-size:12px;
}

.measurement-grid-wrap--compact .measurement-grid-table select.input,
.measurement-grid-wrap--lp .measurement-grid-table select.input{
  padding:4px 6px;
  min-height:34px;
  font-size:12px;
  border-radius:8px;
}

.measurement-grid-wrap--compact .measure-row-evidence-btn,
.measurement-grid-wrap--lp .measure-row-evidence-btn{
  padding:2px 6px;
  font-size:10px;
  white-space:nowrap;
}

.measurement-grid-table thead th{
  position:sticky;
  top:0;
  z-index:15;
  background:
    linear-gradient(180deg, #2f7d5a, #256949);
  color:#ffffff;
  border-color:#1f5a3e;
  box-shadow:0 2px 0 rgba(31,90,62,.28);
}

.measure-calculated-field{
  min-height:42px;
  display:flex;
  align-items:center;
  padding:4px 0 2px;
  font-weight:800;
  line-height:1.1;
}

.measure-calculated-field.is-empty{
  color:var(--muted);
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.measure-calculated-field:not(.is-empty){
  font-size:30px;
  color:var(--primary-text);
}

.measure-col-part-row{
  width:118px;
}

.measure-col-part-row-lp{
  width:88px;
}

.measure-col-status{
  width:150px;
}

.measure-col-status-lp{
  width:96px;
}

.measure-col-dimension{
  width:210px;
}

.measure-col-serial{
  width:118px;
}

.measure-col-revision{
  width:58px;
}

.measure-col-passfail{
  width:96px;
}

.measure-col-numeric{
  width:72px;
}

.measure-col-catalog{
  width:110px;
}

.measure-col-text{
  width:100px;
}

.measure-header-cell{
  padding:8px;
  vertical-align:top;
}

.measure-cell{
  padding:8px;
  border-top:1px solid #d5dde5;
  border-right:1px solid #e1e7ee;
  color:#17202a;
  background:#ffffff;
}

.measurement-grid-table tbody tr:nth-child(even) .measure-cell{
  background:#f7fafc;
}

.measure-evidence-actions{
  display:flex;
  gap:4px;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
}

.measure-evidence-actions .btn{
  min-height:24px;
  padding:3px 7px;
  font-size:11px;
  line-height:1.2;
}

.measure-evidence-actions .btn.active{
  border-color:#3b82f6;
  background:rgba(59,130,246,.16);
}

.measure-status-cell{
  min-width:140px;
  text-align:center;
}

.measure-grid-title-wrap{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.lp-review-summary{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

.lp-review-summary span{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:3px 9px;
  border:1px solid rgba(37,99,235,.22);
  border-radius:999px;
  background:rgba(37,99,235,.08);
  color:#1d4ed8;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}

.measure-row-status{
  font-weight:700;
  margin-bottom:6px;
}

.measure-row-evidence-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:20px;
  padding:2px 8px;
  border:1px solid rgba(20,83,45,.20);
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#14532d;
  font-size:10px;
  font-weight:800;
  line-height:1.2;
  cursor:pointer;
  box-shadow:0 1px 4px rgba(0,0,0,.14);
  white-space:nowrap;
}

.measure-row-evidence-btn:hover,
.measure-row-evidence-btn:focus{
  background:#ffffff;
  color:#0f3f22;
  outline:none;
  box-shadow:0 0 0 2px rgba(47,125,90,.20), 0 4px 10px rgba(0,0,0,.18);
}

.measurement-grid-footer{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
}

.measure-grid-card{
  position:relative;
}

.measure-grid-card.is-lp-complete-locked{
  overflow:hidden;
}

.lp-complete-card-lock{
  position:absolute;
  inset:0;
  z-index:30;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:14px;
  background:rgba(255,255,255,.18);
  cursor:not-allowed;
  pointer-events:auto;
}

.lp-complete-card-lock-message{
  max-width:520px;
  padding:8px 12px;
  border:1px solid rgba(15,23,42,.18);
  border-radius:999px;
  background:rgba(255,255,255,.94);
  color:#475569;
  font-size:12px;
  font-weight:700;
  box-shadow:0 8px 22px rgba(15,23,42,.16);
}

.measurement-grid-footer-left{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:stretch;
  flex:1 1 420px;
}

.measurement-grid-footer-right{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:stretch;
  justify-content:flex-end;
  margin-left:auto;
}

.measure-general-evidence{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  background:transparent;
}

.measure-general-evidence .btn{
  min-width:190px;
}

.measure-evidence-help{
  flex:1 1 360px;
  align-self:center;
  color:var(--muted);
  font-size:13px;
  line-height:1.35;
  font-style:italic;
}

.evidence-modal-backdrop{
  position:fixed;
  inset:0;
  z-index:1000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(15,23,42,.62);
}

.evidence-modal{
  width:min(720px, 100%);
  max-height:min(760px, calc(100vh - 48px));
  overflow:auto;
  border:1px solid #cbd5e1;
  border-radius:16px;
  background:#ffffff;
  color:#17202a;
  box-shadow:0 24px 70px rgba(15,23,42,.35);
  padding:18px;
}

.evidence-modal .note{
  color:#64748b;
}

.evidence-modal .input{
  background:#ffffff;
  color:#111827;
  border-color:#b8c5d1;
  color-scheme:light;
}

.evidence-modal-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding-bottom:14px;
  border-bottom:1px solid #dbe3ec;
}

.evidence-modal-section{
  margin-top:16px;
}

.run-correction-panel{
  border:1px solid #c5d4e0;
  background:#f8fbfd;
}

.run-correction-grid-wrap{
  max-height:420px;
}

.run-correction-grid-table{
  min-width:max(100%, 1100px);
}

.run-correction-grid-table tr.is-correction-dirty .measure-cell{
  background:#fff7ed;
}

.run-correction-grid-table .correction-cell-input{
  width:100%;
  min-width:0;
  font-size:12px;
  padding:6px 8px;
}

.run-correction-modal{
  width:min(720px, 96vw);
  max-height:90vh;
  overflow:auto;
}

.evidence-attachment-list{
  display:grid;
  gap:8px;
}

.evidence-attachment-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border:1px solid #dbe3ec;
  border-radius:10px;
  background:#f8fafc;
}

.evidence-attachment-name{
  font-weight:700;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.measure-char-name{
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
  line-height:1.25;
  font-size:12px;
}

.measure-char-help-wrap{
  position:relative;
  display:inline-block;
  flex:0 0 auto;
}

.measure-char-help-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:20px;
  padding:2px 8px;
  border:1px solid rgba(255,255,255,.70);
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#14532d;
  font-size:10px;
  font-weight:800;
  line-height:1.2;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 1px 4px rgba(0,0,0,.18);
}

.measure-char-help-btn:hover,
.measure-char-help-btn:focus{
  background:#ffffff;
  color:#0f3f22;
  outline:none;
  box-shadow:0 0 0 2px rgba(255,216,77,.45), 0 4px 12px rgba(0,0,0,.24);
}

.measure-char-help-popover{
  position:absolute;
  left:0;
  bottom:calc(100% + 8px);
  top:auto;
  z-index:120;
  display:none;
  width:min(340px, 70vw);
  max-width:70vw;
  padding:12px;
  border:1px solid #94a3b8;
  border-radius:12px;
  background:#ffffff;
  color:#17202a;
  box-shadow:0 18px 40px rgba(15,23,42,.28);
  text-align:left;
}

.measure-char-help-wrap:hover .measure-char-help-popover,
.measure-char-help-wrap:focus-within .measure-char-help-popover{
  display:block;
}

.measure-char-help-title{
  font-weight:800;
  margin-bottom:8px;
  color:#0f172a;
}

.measure-char-help-note{
  white-space:pre-wrap;
  line-height:1.35;
  margin-bottom:10px;
  font-size:12px;
}

.measure-char-help-image{
  display:block;
  width:100%;
  max-height:180px;
  object-fit:contain;
  border:1px solid #d1d5db;
  border-radius:10px;
  background:#ffffff;
}

.measure-char-help-file{
  color:#475569;
  font-size:12px;
}

.measure-char-meta{
  color:#e8f5ee;
  font-size:10px;
  flex:1 1 auto;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.measure-char-subrow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  margin-top:4px;
}

.measure-char-instrument{
  color:#ffffff;
  font-size:10px;
  font-weight:700;
  margin-top:3px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.measure-sticky-left{
  position:sticky;
  left:0;
  z-index:18;
  background:#256949;
  text-align:center;
}

.measurement-grid-table tbody .measure-sticky-left,
.measurement-grid-table tbody .measure-sticky-right{
  z-index:12;
  background:#eef7f1;
  color:#17202a;
  font-weight:700;
  border-left:1px solid #c6d7cc;
  border-right:1px solid #c6d7cc;
}

.measure-sticky-right{
  position:sticky;
  right:0;
  z-index:18;
  background:#256949;
  text-align:center;
  box-shadow:-2px 0 0 rgba(31,90,62,.22);
}

.measurement-grid-table tbody tr:nth-child(even) .measure-sticky-left,
.measurement-grid-table tbody tr:nth-child(even) .measure-sticky-right{
  background:#e4f0e8;
}

.measurement-grid-table .input{
  background:#ffffff;
  color:#111827;
  border-color:#b8c5d1;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.08);
  color-scheme:light;
  font-size:12px;
}

.measurement-grid-table select.input{
  background-color:#ffffff;
  color:#111827;
}

.measurement-grid-table select.input option{
  background:#ffffff;
  color:#111827;
}

.measurement-grid-table .input:focus{
  border-color:#2f7d5a;
  box-shadow:
    inset 0 1px 2px rgba(15,23,42,.08),
    0 0 0 3px rgba(47,125,90,.18);
}

.help-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:12px;
}

.help-step{
  border:1px solid var(--border);
  border-radius:10px;
  padding:12px;
  background:rgba(255,255,255,.02);
}

.help-step h3{
  margin:0 0 8px 0;
  font-size:15px;
}

.help-step p{
  margin:0;
}

.help-howto{
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px 16px;
  background:rgba(255,255,255,.02);
  margin-top:12px;
}

.help-howto:first-child{
  margin-top:0;
}

.help-howto h3{
  margin:0 0 10px 0;
  font-size:16px;
}

.help-howto-steps{
  margin:0;
  padding-left:20px;
  display:grid;
  gap:10px;
}

.help-howto-steps li{
  line-height:1.45;
}

.help-howto-steps strong{
  display:inline;
}

.help-toc{
  display:grid;
  gap:6px;
  margin:0;
  padding-left:20px;
}

.help-toc a{
  color:var(--accent, #4da3ff);
  text-decoration:none;
}

.help-toc a:hover{
  text-decoration:underline;
}

.help-image-grid{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:12px;
}

.help-image-placeholder{
  min-height:140px;
  border:1px dashed var(--border);
  border-radius:10px;
  padding:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:rgba(255,255,255,.01);
}

.help-shot-card{
  margin:0;
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden;
  background:rgba(255,255,255,.02);
}

.help-shot-frame{
  position:relative;
  min-height:160px;
  background:rgba(255,255,255,.01);
  display:flex;
  align-items:center;
  justify-content:center;
}

.help-shot-img{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
}

.help-shot-markers{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.help-shot-marker{
  position:absolute;
  width:24px;
  height:24px;
  margin:-12px 0 0 -12px;
  border-radius:50%;
  background:var(--gold2);
  color:#111;
  border:1px solid #c9a400;
  box-shadow:0 0 0 2px rgba(11,13,18,.55), 0 2px 8px rgba(0,0,0,.35);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:800;
}

.help-shot-fallback{
  position:absolute;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:12px;
  border-top:1px dashed var(--border);
  border-bottom:1px dashed var(--border);
}

.help-shot-frame.help-shot-missing .help-shot-img{
  display:none;
}

.help-shot-frame.help-shot-missing .help-shot-markers{
  display:none;
}

.help-shot-frame.help-shot-missing .help-shot-fallback{
  display:flex;
}

.help-shot-caption{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:10px 12px 12px;
}

.help-shot-steps{
  margin:6px 0 0 18px;
  padding:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

.help-shot-steps li{
  margin-bottom:4px;
}

.measure-live-trends-card{
  margin-top:16px;
}

.measure-live-trends-card.is-lp-complete-locked{
  opacity:.72;
}

.measure-live-trends-card.is-lp-complete-locked,
.measure-live-trends-card.is-lp-complete-locked *{
  cursor:not-allowed;
}

.measure-live-trends-card:not(.is-expanded){
  padding-bottom:14px;
}

.measure-live-trends-show-toggle{
  flex-shrink:0;
}

.measure-live-trends-panel[hidden]{
  display:none !important;
}

.measure-live-chart-clickable{
  cursor:pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.measure-live-chart-clickable:hover{
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
  transform: translateY(-1px);
}

.lp-summary-grid{
  display:grid;
  gap:8px;
  max-width:420px;
}

.lp-summary-row{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(255,255,255,.04);
}

.lp-register-list div + div{
  margin-top:4px;
}

.lp-batch-card .lp-workflow-tab:not(.btn-primary){
  opacity:.92;
}

.lp-status-bar{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(120px, 1fr));
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(255,255,255,.04);
  font-size:13px;
}

.lp-phase-panel{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  justify-content:space-between;
  align-items:stretch;
  padding:14px 16px;
  border-radius:12px;
  border:2px solid var(--border);
}

.lp-phase-panel-fh{
  background:linear-gradient(135deg, rgba(15,118,110,.18), rgba(15,118,110,.06));
  border-color:rgba(15,118,110,.45);
}

.lp-phase-panel-sh{
  background:linear-gradient(135deg, rgba(180,83,9,.18), rgba(180,83,9,.06));
  border-color:rgba(180,83,9,.45);
}

.lp-phase-panel-kicker{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.04em;
  opacity:.8;
}

.lp-phase-panel-title{
  font-size:24px;
  font-weight:700;
  line-height:1.15;
  margin-top:4px;
}

.lp-phase-panel-sub{
  margin-top:6px;
  font-size:13px;
  opacity:.92;
}

.lp-phase-panel-side{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:stretch;
}

.lp-phase-chip{
  min-width:120px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.12);
  display:flex;
  flex-direction:column;
  gap:4px;
}

.lp-phase-chip.is-active{
  box-shadow:0 0 0 2px rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
}

.lp-phase-chip-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.03em;
  opacity:.78;
}

.lp-scan-queue{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.lp-scan-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px dashed var(--border);
  font-size:13px;
}

.lp-scan-chip.is-filled{
  border-style:solid;
  background:rgba(37,179,90,.12);
  border-color:rgba(37,179,90,.45);
}

.lp-scan-chip.is-empty{
  opacity:.72;
}

.lp-scan-chip-index{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  font-size:11px;
  font-weight:700;
}

.lp-scan-chip-phase{
  font-size:11px;
  opacity:.85;
}

.lp-last-scan-note{
  margin:0 0 8px 0;
}

.lp-grid-row-scanned td{
  box-shadow: inset 0 0 0 2px rgba(250, 204, 21, .55);
}

.lp-grid-row-measured td{
  opacity:.72;
  background:rgba(148,163,184,.08);
}

.lp-grid-row-other td{
  opacity:.78;
  background:rgba(148,163,184,.12);
}

.lp-grid-row-first-half td:first-child{
  box-shadow: inset 4px 0 0 #38bdf8;
}

.lp-grid-row-second-half td:first-child{
  box-shadow: inset 4px 0 0 #f59e0b;
}

.lp-owner-chip{
  display:inline-block;
  margin-top:4px;
  padding:1px 6px;
  border-radius:999px;
  font-size:10px;
  font-weight:600;
  color:#475569;
  background:#e2e8f0;
  max-width:110px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.input-locked,
.input:disabled{
  background:#eef2f6 !important;
  color:#64748b !important;
  border-color:#cbd5e1 !important;
  cursor:not-allowed;
}

.lp-grid-row-active td{
  box-shadow:inset 0 0 0 2px #2563eb;
}

.lp-action-bar{
  border-top:1px solid #dbe3ea;
  padding-top:14px;
}

.lp-connection-indicator{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:2px 9px;
  border-radius:999px;
  font-size:12px;
  font-weight:600;
  background:#f1f5f9;
  color:#64748b;
  vertical-align:middle;
}

.lp-connection-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#94a3b8;
  flex:0 0 auto;
}

.lp-connection-indicator[data-status="connecting"] .lp-connection-dot{
  background:#f59e0b;
  animation:lp-connection-pulse 1.1s ease-in-out infinite;
}

.lp-connection-indicator[data-status="connected"]{
  background:rgba(37,179,90,.14);
  color:#1a7a40;
}
.lp-connection-indicator[data-status="connected"] .lp-connection-dot{
  background:#25b35a;
}

.lp-connection-indicator[data-status="reconnecting"]{
  background:rgba(245,158,11,.16);
  color:#92620a;
}
.lp-connection-indicator[data-status="reconnecting"] .lp-connection-dot{
  background:#f59e0b;
  animation:lp-connection-pulse 1.1s ease-in-out infinite;
}

.lp-connection-indicator[data-status="offline"]{
  background:rgba(217,75,75,.14);
  color:#a4342f;
}
.lp-connection-indicator[data-status="offline"] .lp-connection-dot{
  background:#d94b4b;
}

@keyframes lp-connection-pulse{
  0%, 100%{ opacity:1; }
  50%{ opacity:.35; }
}

.lp-remote-badge{
  display:inline-block;
  margin-left:6px;
  padding:1px 7px;
  border-radius:999px;
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
  background:rgba(37,99,235,.14);
  color:#1d4ed8;
  vertical-align:middle;
  animation:lp-remote-badge-fade-in .18s ease-out;
}

.lp-part-cell{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-width:92px;
}

.lp-part-row-number{
  font-weight:800;
  line-height:1.1;
}

.lp-review-wrap{
  margin-top:0;
}

.lp-review-toggle{
  min-height:22px;
  font-size:10px;
  padding:3px 7px;
  border-radius:999px;
  white-space:nowrap;
}

.lp-reviewed-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:96px;
  padding:3px 7px;
  border-radius:999px;
  border:1px solid rgba(37,179,90,.45);
  background:rgba(37,179,90,.12);
  color:#15803d;
  font-size:11px;
  font-weight:700;
  line-height:1.1;
  white-space:normal;
}

#lpCompleteModal.measure-instruction-modal-blocker{
  z-index:20000;
  pointer-events:auto;
}

#lpCompleteModal .lp-complete-modal-card{
  pointer-events:auto;
}

@keyframes lp-remote-badge-fade-in{
  from{ opacity:0; transform:translateY(-2px); }
  to{ opacity:1; transform:translateY(0); }
}

.lp-grid-phase-separator td{
  padding:8px 12px;
  background:linear-gradient(90deg, rgba(180,83,9,.22), rgba(180,83,9,.08));
  border-top:2px solid rgba(180,83,9,.55);
  border-bottom:2px solid rgba(180,83,9,.35);
}

.lp-grid-phase-separator-label{
  font-weight:700;
  letter-spacing:.02em;
}

.lp-complete-modal-card #lpCompleteCloseBtn.btn-primary{
  box-shadow:0 0 0 2px rgba(217,75,75,.35);
}

.lp-status-phase-fh{
  color:#0f766e;
}

.lp-status-phase-sh{
  color:#b45309;
}

.measure-live-trends-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-top:14px;
}

.measure-live-plot-modal-blocker{
  position:fixed;
  inset:0;
  z-index:10050;
  background:rgba(15,23,42,.58);
  backdrop-filter:blur(2px);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:24px;
  pointer-events:all;
}

.measure-instruction-modal-blocker[hidden],
.measure-live-plot-modal-blocker[hidden],
.measure-chart-modal-blocker[hidden]{
  display:none !important;
}

.measure-instruction-modal-blocker{
  position:fixed;
  inset:0;
  z-index:10060;
  background:rgba(15,23,42,.58);
  backdrop-filter:blur(2px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:14px;
  padding:24px;
  pointer-events:all;
}

.measure-instruction-modal-blocker .measure-live-plot-modal-message,
.measure-chart-modal-blocker .measure-live-plot-modal-message{
  margin-top:10vh;
}

.measure-chart-modal{
  width:min(1180px, 96vw);
  max-height:min(86vh, 920px);
  overflow:auto;
  border:1px solid #cbd5e1;
  border-radius:16px;
  background:#ffffff;
  color:#17202a;
  box-shadow:0 24px 70px rgba(15,23,42,.35);
  padding:18px 20px;
}

.measure-chart-modal-body .analysis-plot-card,
.measure-chart-modal-body .measure-live-chart-card{
  border:none;
  box-shadow:none;
  padding:0;
  background:transparent;
}

.measure-chart-modal-body .measure-live-chart-head{
  display:none;
}

.measure-char-help-floating-preview{
  position:fixed;
  z-index:10040;
  width:min(320px, 72vw);
  padding:10px 12px;
  border:1px solid #94a3b8;
  border-radius:12px;
  background:#ffffff;
  color:#17202a;
  box-shadow:0 18px 40px rgba(15,23,42,.28);
  pointer-events:none;
  text-align:left;
}

.measure-char-help-floating-preview .measure-char-help-title{
  font-size:12px;
  margin-bottom:6px;
}

.measure-char-help-floating-preview .measure-char-help-note{
  font-size:11px;
  max-height:72px;
  overflow:hidden;
  margin-bottom:8px;
}

.measure-char-help-floating-preview .measure-char-help-image{
  max-height:140px;
}

.measure-char-help-floating-preview .measure-char-help-file{
  font-size:11px;
}

.measure-instruction-modal{
  width:min(920px, 96vw);
  max-height:min(86vh, 900px);
  overflow:auto;
  border:1px solid #cbd5e1;
  border-radius:16px;
  background:#ffffff;
  color:#17202a;
  box-shadow:0 24px 70px rgba(15,23,42,.35);
  padding:18px 20px;
}

.measure-instruction-modal-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}

.measure-instruction-modal-title{
  font-size:18px;
  font-weight:800;
  color:#0f172a;
}

.measure-instruction-modal-note{
  white-space:pre-wrap;
  line-height:1.45;
  margin-bottom:14px;
  font-size:14px;
  color:#334155;
}

.measure-instruction-modal-image{
  display:block;
  width:100%;
  max-height:65vh;
  object-fit:contain;
  border:1px solid #d1d5db;
  border-radius:12px;
  background:#ffffff;
}

.measure-instruction-modal-file{
  font-size:13px;
  color:#475569;
}

.measure-instruction-modal-file a{
  color:#1d4ed8;
  font-weight:700;
}

.measure-live-plot-modal-message{
  margin-top:12vh;
  max-width:520px;
  padding:14px 18px;
  border-radius:12px;
  border:1px solid rgba(215,169,0,.45);
  background:rgba(255,248,220,.96);
  color:#422006;
  font-size:14px;
  font-weight:700;
  text-align:center;
  box-shadow:var(--glow-gold), 0 16px 36px rgba(15,23,42,.24);
}

.measure-live-chart-card{
  position:relative;
  border:1px solid #d6dde8;
  border-radius:16px;
  background:#ffffff;
  padding:14px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.measure-live-chart-card.live-chart-good{
  border-color:#d6dde8;
  background:#ffffff;
}

.measure-live-chart-card.live-chart-warning{
  border-color:#d6dde8;
  background:#ffffff;
}

.measure-live-chart-card.live-chart-danger{
  border-color:#d6dde8;
  background:#ffffff;
}

.analysis-plot-card.live-chart-good{
  border-color:#d6dde8;
  background:#ffffff;
}

.analysis-plot-card.live-chart-warning{
  border-color:#d6dde8;
  background:#ffffff;
}

.analysis-plot-card.live-chart-danger{
  border-color:#d6dde8;
  background:#ffffff;
}

.analysis-plot-card.live-chart-nelson,
.measure-live-chart-card.live-chart-nelson{
  border-color:#c4b5fd;
  background:#ffffff;
}

.live-chart-nelson .measure-live-chart-status{
  background:#ede9fe;
  color:#6b21a8;
}

.measure-grid-save-message.error{
  color:#b91c1c;
  font-weight:600;
}

.measure-live-chart-head{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:8px;
}

.measure-live-chart-actions{
  display:flex;
  align-items:flex-end;
  flex-direction:column;
  gap:4px;
}

.measure-live-chart-status{
  border-radius:999px;
  color:#0f172a;
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
  padding:4px 9px;
  text-transform:uppercase;
}

.live-chart-good .measure-live-chart-status{
  background:#bbf7d0;
  color:#14532d;
}

.live-chart-warning .measure-live-chart-status{
  background:#fde68a;
  color:#78350f;
}

.live-chart-danger .measure-live-chart-status{
  background:#fecdd3;
  color:#881337;
}

.measure-live-chart-plot{
  overflow:hidden;
}

.measure-live-chart-plot svg{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
}

.analysis-plot-card,
.analysis-chart-section-card{
  position:relative;
}

.chart-point-hit{
  cursor:pointer;
}

.chart-point-hit.is-selected{
  stroke:#111827;
  stroke-width:2.8px;
  filter:drop-shadow(0 0 5px rgba(15,23,42,.65));
}

.chart-point-hit:focus{
  outline:none;
  filter:drop-shadow(0 0 4px rgba(37,99,235,.55));
}

.chart-point-navigator{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
  padding:8px 10px;
  border:1px solid #d6dde8;
  border-radius:10px;
  background:#f8fafc;
}

.chart-point-navigator .btn{
  min-height:32px;
  padding:5px 10px;
  font-size:12px;
}

.chart-point-navigator [data-chart-point-nav-status]{
  min-width:230px;
  color:#334155;
  font-size:12px;
  font-weight:700;
  text-align:center;
}

.chart-point-flag{
  position:absolute;
  z-index:25;
  min-width:210px;
  max-width:320px;
  padding:10px 34px 10px 12px;
  border:1px solid #94a3b8;
  border-radius:8px;
  background:rgba(255,255,255,.88);
  color:#0f172a;
  box-shadow:0 10px 24px rgba(15,23,42,.22);
  backdrop-filter:blur(3px);
  font-size:12px;
  line-height:1.35;
}

.chart-point-flag-row{
  display:grid;
  grid-template-columns:minmax(78px, auto) 1fr;
  gap:8px;
  margin:2px 0;
}

.chart-point-flag-row span{
  color:#64748b;
  font-weight:700;
}

.chart-point-flag-row strong{
  color:#0f172a;
  font-weight:700;
  overflow-wrap:anywhere;
}

.chart-point-flag-close{
  position:absolute;
  top:4px;
  right:6px;
  border:none;
  background:transparent;
  color:#64748b;
  cursor:pointer;
  font-size:18px;
  line-height:1;
}

@media print{
  .chart-point-flag{
    box-shadow:none;
    break-inside:avoid;
  }

  .chart-point-flag-close{
    display:none;
  }
}

.measure-live-chart-foot{
  margin:8px 0 0 0;
}

@media (max-width: 1180px){
  .measure-live-trends-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px){
  .measure-live-trends-grid{
    grid-template-columns:1fr;
  }
}