:root{--green:#0f7b50;--green2:#0a5f3c;--light:#f4f8f6;--card:#fff;--text:#12231b;--muted:#6c7a72;--border:#dce7e1;--danger:#b42318;--warning:#b54708;--ok:#067647;--shadow:0 12px 32px rgba(15,123,80,.13)}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--light);color:var(--text)}button,input,select,textarea{font:inherit}button{border:0;border-radius:12px;padding:11px 15px;background:var(--green);color:#fff;font-weight:700;cursor:pointer;min-height:40px}button.secondary{background:#eef6f1;color:var(--green);border:1px solid #cfe5d8}button.danger{background:var(--danger)}button:disabled{opacity:.55;cursor:not-allowed}.hidden{display:none!important}.muted{color:var(--muted)}.small{font-size:12px}.error-text{color:var(--danger);font-weight:700}.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at top left,#e6f6ee,#f7fbf8 55%,#fff)}.login-card{width:min(760px,100%);background:#fff;border:1px solid var(--border);border-radius:24px;padding:28px;box-shadow:var(--shadow)}.wide-login{width:min(900px,100%)}.brand-row{display:flex;gap:16px;align-items:center}.brand-logo{max-width:230px;max-height:64px;object-fit:contain}.brand-logo.centered{display:block;margin:0 auto 18px}.brand-row h1{margin:0;font-size:28px}.brand-row p{margin:4px 0 0;color:var(--muted)}.login-copy{margin:22px 0}.login-copy h2{font-size:34px;margin:0 0 8px}.auth-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.auth-grid label,.asset-form label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:#30483b;text-transform:uppercase;letter-spacing:.3px}input,select,textarea{border:1px solid var(--border);border-radius:12px;background:#fff;padding:10px 12px;min-height:42px;color:var(--text)}textarea{min-height:80px;resize:vertical}.button-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.app-shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.sidebar{background:#073b29;color:#fff;padding:20px;display:flex;flex-direction:column;gap:20px;position:sticky;top:0;height:100vh}.side-brand{display:flex;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.15)}.side-logo{width:108px;max-height:52px;object-fit:contain;background:#fff;border-radius:10px;padding:6px}.side-brand h2{margin:0;font-size:22px}.side-brand span{opacity:.82}.sidebar nav{display:flex;flex-direction:column;gap:8px}.nav-link{color:#cde6d9;text-decoration:none;padding:12px 14px;border-radius:12px;font-weight:700}.nav-link:hover,.nav-link.active{background:#0f7b50;color:#fff}.logout-btn{margin-top:auto;background:#fff;color:#073b29}.user-card{margin-top:auto;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:12px}.user-card strong{display:block;font-size:13px;word-break:break-all}.user-card span{display:inline-block;margin-top:8px;padding:4px 8px;background:rgba(255,255,255,.16);border-radius:99px;text-transform:uppercase;font-size:11px}.main{padding:26px;overflow:auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.topbar h1{margin:0;font-size:30px}.eyebrow{margin:0 0 6px;color:var(--green);font-weight:800;text-transform:uppercase;letter-spacing:.9px;font-size:12px}.top-actions{display:flex;gap:8px;flex-wrap:wrap}.view{animation:fade .2s ease}.hero-card,.panel,.stat-card{background:#fff;border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow)}.hero-card{padding:26px;display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:18px;background:linear-gradient(135deg,#fff,#eef8f3)}.hero-card h2{font-size:34px;margin:0 0 10px}.hero-card p{max-width:720px;color:var(--muted);line-height:1.55}.hero-chip{min-width:160px;background:#0f7b50;color:#fff;padding:18px;border-radius:18px;text-align:center}.hero-chip span{display:block;opacity:.8}.hero-chip strong{font-size:22px}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.stat-card{padding:18px}.stat-card span{color:var(--muted);font-weight:700}.stat-card strong{display:block;font-size:32px;margin-top:8px}.panel{padding:18px;margin-bottom:18px}.panel-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.panel-head h3{margin:0;font-size:22px}.panel-head span{color:var(--muted);font-size:13px}.filters{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:10px;margin-bottom:12px}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:16px}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:12px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle;font-size:14px}th{background:#f7fbf8;color:#30483b;text-transform:uppercase;font-size:12px;letter-spacing:.4px}tr:hover td{background:#fbfdfc}.pagination{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:14px}.details-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.detail-item{border:1px solid var(--border);border-radius:14px;padding:12px;background:#fbfdfc}.detail-item span{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;font-weight:700}.detail-item strong{display:block;margin-top:6px;word-break:break-word}.bar-chart{display:flex;flex-direction:column;gap:10px}.bar-row{display:grid;grid-template-columns:220px 1fr 60px;gap:12px;align-items:center}.bar-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar-track{background:#e8f2ed;border-radius:999px;height:16px;overflow:hidden}.bar-fill{height:100%;background:linear-gradient(90deg,var(--green),#74c58e);border-radius:999px}.bar-count{text-align:right;color:var(--muted);font-weight:700}.admin-layout{display:grid;grid-template-columns:1.35fr .9fr;gap:18px}.asset-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.asset-form label.full{grid-column:1/-1}.admin-list{max-height:650px;overflow:auto;margin-top:12px;border:1px solid var(--border);border-radius:14px}.admin-item{padding:12px;border-bottom:1px solid var(--border);cursor:pointer}.admin-item:hover,.admin-item.active{background:#eef8f3}.notice{background:#fff8e6;border:1px solid #ffe2a8;color:#604100;padding:12px 14px;border-radius:12px;margin-bottom:12px}.badge{display:inline-block;padding:5px 9px;border-radius:99px;font-size:12px;font-weight:800;text-transform:uppercase}.badge.approved{background:#ecfdf3;color:var(--ok)}.badge.pending{background:#fff4e5;color:var(--warning)}.badge.rejected{background:#fef3f2;color:var(--danger)}
@keyframes fade{from{opacity:.45;transform:translateY(3px)}to{opacity:1;transform:none}}
@media(max-width:1100px){.app-shell{grid-template-columns:1fr}.sidebar{height:auto;position:relative}.sidebar nav{display:grid;grid-template-columns:repeat(3,1fr)}.main{padding:18px}.stat-grid{grid-template-columns:1fr 1fr}.filters{grid-template-columns:1fr 1fr}.auth-grid{grid-template-columns:1fr}.admin-layout,.details-grid{grid-template-columns:1fr}.asset-form{grid-template-columns:1fr}.bar-row{grid-template-columns:1fr}}
@media(max-width:640px){.sidebar nav{grid-template-columns:1fr}.topbar,.hero-card{flex-direction:column;align-items:flex-start}.stat-grid,.filters{grid-template-columns:1fr}.brand-row{flex-direction:column;align-items:flex-start}.brand-logo{max-width:100%}th,td{white-space:nowrap}}


/* V2 Professional Enhancements */
.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.stat-grid{grid-template-columns:repeat(4,1fr)}
.search-tools{display:flex;gap:10px;justify-content:flex-end;margin:-4px 0 14px;flex-wrap:wrap}
.asset-badge{display:inline-block;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800;background:#eef6f1;color:var(--green2);border:1px solid #cfe5d8}
.asset-badge.critical{background:#fef3f2;color:#b42318;border-color:#fecdca}
.asset-badge.active,.asset-badge.qualified,.asset-badge.valid,.asset-badge.done{background:#ecfdf3;color:#067647;border-color:#abefc6}
.asset-badge.out-of-service,.asset-badge.not-qualified,.asset-badge.rejected{background:#fef3f2;color:#b42318;border-color:#fecdca}
.bar-row.compact{grid-template-columns:180px 1fr 54px}
.asset-profile-shell{display:flex;flex-direction:column;gap:18px}
.asset-profile-head{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(135deg,#ffffff,#eef8f3)}
.asset-profile-head h3{font-size:28px;margin:0 0 8px}
.asset-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.asset-profile-grid{display:grid;grid-template-columns:1.55fr 360px;gap:18px}
.qr-panel{text-align:center}
.qr-panel canvas{width:220px!important;height:220px!important;background:#fff;border:1px solid var(--border);border-radius:18px;padding:12px;margin:10px auto;display:block}
.critical-field{border-color:#fecdca;background:#fff7f7}
.creator-footer{margin:18px 0 6px;padding:16px 20px;border:1px solid var(--border);border-radius:20px;background:linear-gradient(135deg,#fff,#eef8f3);display:flex;justify-content:space-between;gap:14px;align-items:center;color:var(--text)}
.creator-footer strong{display:block}
.creator-footer span{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.creator-footer em{color:var(--green2);font-style:normal;font-weight:800;font-size:12px}
.mobile-menu{display:none}
@media print{
  .sidebar,.topbar,.asset-actions,.qr-panel button,.creator-footer,.search-tools{display:none!important}
  .app-shell{display:block!important}
  .main{padding:0!important}
  body{background:#fff!important}
  .panel,.hero-card,.stat-card{box-shadow:none!important}
  .print-asset-only .view:not(#details){display:none!important}
  .print-asset-only #details{display:block!important}
  .print-asset-only .asset-profile-grid{grid-template-columns:1fr 260px!important}
}
@media(max-width:1100px){
  .dashboard-grid,.asset-profile-grid{grid-template-columns:1fr}
  .mobile-menu{display:inline-flex}
}
@media(max-width:640px){
  .stat-grid{grid-template-columns:1fr}
  .creator-footer{flex-direction:column;align-items:flex-start}
  .asset-profile-head{flex-direction:column;align-items:flex-start}
  .asset-actions{justify-content:flex-start}
}


/* V3 Permissions Matrix */
.permission-help{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:12px 0 16px;
  color:var(--muted);
}
.permission-help span{
  border:1px solid var(--border);
  background:#f7fbf8;
  padding:7px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
}
.perm-table input[type="checkbox"]{
  width:18px;
  height:18px;
  accent-color:var(--green);
}
.perm-table td:nth-child(n+3),
.perm-table th:nth-child(n+3){
  text-align:center;
}
.nav-link.hidden{display:none!important}
button:disabled{
  opacity:.45;
  cursor:not-allowed;
}


/* V4 Theme Switcher + Layout Density */
.theme-control{
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
  padding:9px 10px;
  border-radius:12px;
  font-weight:900;
  box-shadow:0 8px 18px rgba(15,23,42,.05);
}
.theme-control select{
  border:0;
  background:transparent;
  color:var(--text);
  font-weight:800;
  outline:0;
  cursor:pointer;
  max-width:155px;
}
.theme-control option{color:#111827;background:#fff}

html[data-theme="classic"]{
  --bg:#f2f7f4;
  --panel:#ffffff;
  --text:#14231b;
  --muted:#66746c;
  --border:#d9e8dd;
  --green:#0f766e;
  --green2:#05603a;
  --danger:#b42318;
}
html[data-theme="blue"]{
  --bg:#eef5ff;
  --panel:#ffffff;
  --text:#102033;
  --muted:#5c6b7d;
  --border:#d6e4f5;
  --green:#1d4ed8;
  --green2:#0b2f5b;
  --danger:#b42318;
}
html[data-theme="slate"]{
  --bg:#f1f5f9;
  --panel:#ffffff;
  --text:#111827;
  --muted:#667085;
  --border:#d6dce5;
  --green:#475569;
  --green2:#1f2937;
  --danger:#b42318;
}
html[data-theme="purple"]{
  --bg:#f5f0ff;
  --panel:#ffffff;
  --text:#211433;
  --muted:#6b5d7c;
  --border:#e4d7f7;
  --green:#7c3aed;
  --green2:#3b0764;
  --danger:#b42318;
}
html[data-theme="dark"]{
  --bg:#0b1220;
  --panel:#111827;
  --text:#e5e7eb;
  --muted:#94a3b8;
  --border:#263244;
  --green:#14b8a6;
  --green2:#5eead4;
  --danger:#f87171;
}
html[data-theme="blue"] body{background:radial-gradient(circle at 82% 0,#bfdbfe 0,transparent 34rem),var(--bg)}
html[data-theme="slate"] body{background:radial-gradient(circle at 82% 0,#cbd5e1 0,transparent 34rem),var(--bg)}
html[data-theme="purple"] body{background:radial-gradient(circle at 82% 0,#ddd6fe 0,transparent 34rem),var(--bg)}
html[data-theme="dark"] body{background:radial-gradient(circle at 82% 0,#0f766e55 0,transparent 34rem),var(--bg)}
html[data-theme="blue"] .sidebar{background:linear-gradient(180deg,#0b2f5b,#0f172a)}
html[data-theme="slate"] .sidebar{background:linear-gradient(180deg,#111827,#334155)}
html[data-theme="purple"] .sidebar{background:linear-gradient(180deg,#3b0764,#1e1b4b)}
html[data-theme="dark"] .sidebar{background:linear-gradient(180deg,#020617,#111827)}
html[data-theme="blue"] .hero-card{background:linear-gradient(135deg,#1d4ed8,#0f172a)}
html[data-theme="slate"] .hero-card{background:linear-gradient(135deg,#475569,#111827)}
html[data-theme="purple"] .hero-card{background:linear-gradient(135deg,#7c3aed,#3b0764)}
html[data-theme="dark"] .hero-card{background:linear-gradient(135deg,#0f766e,#020617)}
html[data-theme="dark"] .panel,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .hero-chip,
html[data-theme="dark"] .login-card,
html[data-theme="dark"] .creator-footer,
html[data-theme="dark"] .theme-control,
html[data-theme="dark"] .user-card{
  background:#111827;
  color:#e5e7eb;
  border-color:#263244;
}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea{
  background:#0b1220;
  color:#e5e7eb;
  border-color:#334155;
}
html[data-theme="dark"] table th{background:#0b1220;color:#cbd5e1}
html[data-theme="dark"] table td{border-color:#263244}
html[data-theme="dark"] .bar-track{background:#1f2937}
html[data-theme="dark"] .asset-badge{background:#1f2937;color:#dbeafe;border-color:#334155}
html[data-theme="dark"] .asset-badge.critical{background:#3b1717;color:#fecaca;border-color:#7f1d1d}
html[data-theme="dark"] .permission-help span{background:#0b1220;border-color:#334155}
html[data-density="compact"] .main{padding:16px}
html[data-density="compact"] .panel,
html[data-density="compact"] .stat-card,
html[data-density="compact"] .hero-card{
  padding:14px;
  border-radius:16px;
}
html[data-density="compact"] table th,
html[data-density="compact"] table td{padding:8px 9px;font-size:12px}
html[data-density="compact"] input,
html[data-density="compact"] select,
html[data-density="compact"] button{padding:8px 10px}
html[data-density="compact"] .stat-grid{gap:10px}
html[data-density="compact"] .dashboard-grid{gap:10px}
html[data-density="wide"] .main{max-width:1680px;margin:0 auto;width:100%}
html[data-density="wide"] .stat-grid{grid-template-columns:repeat(4,minmax(180px,1fr))}
html[data-density="wide"] .dashboard-grid{grid-template-columns:1fr 1fr}
@media(max-width:760px){
  .theme-control{width:100%;justify-content:space-between}
  .theme-control select{max-width:none}
}


/* V5 Automatic QR display */
.qr-box{
  width:260px;
  min-height:260px;
  margin:10px auto;
  display:grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:22px;
  background:#fff;
  overflow:hidden;
}
.qr-box canvas,
.qr-box img{
  width:240px!important;
  height:240px!important;
  display:block;
  background:#fff;
  padding:10px;
  border-radius:18px;
}
.qr-placeholder{
  color:var(--muted);
  font-size:13px;
  text-align:center;
  padding:18px;
}
html[data-theme="dark"] .qr-box{
  background:#0b1220;
  border-color:#334155;
}
.hidden{display:none!important}


/* V8 Splash Screen */
.asset-splash-screen{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 18% 15%, rgba(16,185,129,.22), transparent 34rem),
    radial-gradient(circle at 85% 18%, rgba(15,118,110,.30), transparent 34rem),
    linear-gradient(135deg,#052e22,#074d36 52%,#082f49);
  color:#fff;
  transition:opacity .45s ease, visibility .45s ease;
}
.asset-splash-screen.hide{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.asset-splash-card{
  width:min(92vw,500px);
  text-align:center;
  padding:36px 30px 32px;
  border-radius:32px;
  background:rgba(255,255,255,.105);
  border:1px solid rgba(255,255,255,.20);
  box-shadow:0 30px 90px rgba(0,0,0,.36);
  backdrop-filter:blur(18px);
}
.asset-splash-logo-box{
  width:230px;
  height:110px;
  margin:0 auto 18px;
  display:grid;
  place-items:center;
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 38px rgba(0,0,0,.22);
  overflow:hidden;
}
.asset-splash-logo{
  max-width:198px;
  max-height:82px;
  object-fit:contain;
}
.asset-splash-eyebrow{
  color:#9af3dc;
  font-size:12px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:8px;
}
.asset-splash-card h1{
  margin:0 0 8px;
  font-size:28px;
  line-height:1.15;
  font-weight:950;
  letter-spacing:.01em;
}
.asset-splash-card p{
  margin:0 0 22px;
  color:#d9fff5;
  font-size:15px;
}
.asset-splash-loader{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-bottom:18px;
}
.asset-splash-loader span{
  width:10px;
  height:10px;
  border-radius:999px;
  background:#86efac;
  animation:assetSplashBounce 1s infinite ease-in-out;
}
.asset-splash-loader span:nth-child(2){animation-delay:.15s;background:#5eead4}
.asset-splash-loader span:nth-child(3){animation-delay:.30s;background:#fff}
.asset-splash-progress{
  height:8px;
  border-radius:999px;
  background:rgba(255,255,255,.18);
  overflow:hidden;
}
.asset-splash-progress div{
  width:44%;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#86efac,#5eead4,#fff);
  animation:assetSplashProgress 1.45s infinite ease-in-out;
}
@keyframes assetSplashBounce{
  0%,80%,100%{transform:scale(.70);opacity:.55}
  40%{transform:scale(1.15);opacity:1}
}
@keyframes assetSplashProgress{
  0%{transform:translateX(-120%)}
  100%{transform:translateX(260%)}
}
@media(max-width:640px){
  .asset-splash-card{padding:30px 22px;border-radius:26px}
  .asset-splash-logo-box{width:205px;height:100px}
  .asset-splash-logo{max-width:178px;max-height:76px}
  .asset-splash-card h1{font-size:23px}
}


/* V9 Soft Navigation Sound */
.sound-toggle{
  min-width:104px;
  white-space:nowrap;
}
.sound-toggle.muted{
  opacity:.72;
}
.top-actions .sound-toggle{
  border-color:rgba(15,118,110,.22);
}



/* V10 Professional Pharmaceutical Color Themes */
html[data-theme="classic"]{
  --light:#f2f7f4;--bg:#f2f7f4;--card:#ffffff;--panel:#ffffff;--text:#14231b;--muted:#66746c;--border:#d9e8dd;--green:#0f766e;--green2:#05603a;--danger:#b42318;--warning:#b54708;--ok:#067647;--shadow:0 12px 32px rgba(15,118,110,.13);
}
html[data-theme="medicine"]{
  --light:#f3f7fb;--bg:#f3f7fb;--card:#ffffff;--panel:#ffffff;--text:#0f1b2d;--muted:#607089;--border:#dce6f0;--green:#0e7490;--green2:#082f49;--danger:#b91c1c;--warning:#b45309;--ok:#047857;--shadow:0 12px 32px rgba(14,116,144,.13);
}
html[data-theme="regulatory"]{
  --light:#f0faf5;--bg:#f0faf5;--card:#ffffff;--panel:#ffffff;--text:#10251c;--muted:#60756b;--border:#d8eadf;--green:#059669;--green2:#064e3b;--danger:#b91c1c;--warning:#a16207;--ok:#047857;--shadow:0 12px 32px rgba(5,150,105,.13);
}
html[data-theme="sterile"]{
  --light:#f4f9ff;--bg:#f4f9ff;--card:#ffffff;--panel:#ffffff;--text:#102033;--muted:#5e7188;--border:#dbeafe;--green:#0284c7;--green2:#075985;--danger:#dc2626;--warning:#d97706;--ok:#059669;--shadow:0 12px 32px rgba(2,132,199,.13);
}
html[data-theme="cleanroom"]{
  --light:#effbfd;--bg:#effbfd;--card:#ffffff;--panel:#ffffff;--text:#102a34;--muted:#57717b;--border:#cffafe;--green:#0891b2;--green2:#155e75;--danger:#be123c;--warning:#b45309;--ok:#0f766e;--shadow:0 12px 32px rgba(8,145,178,.13);
}
html[data-theme="indigo"]{
  --light:#f4f5ff;--bg:#f4f5ff;--card:#ffffff;--panel:#ffffff;--text:#181d35;--muted:#626985;--border:#dfe3ff;--green:#4f46e5;--green2:#312e81;--danger:#b91c1c;--warning:#b45309;--ok:#059669;--shadow:0 12px 32px rgba(79,70,229,.13);
}
html[data-theme="graphite"]{
  --light:#f4f5f5;--bg:#f4f5f5;--card:#ffffff;--panel:#ffffff;--text:#171717;--muted:#666b70;--border:#dedede;--green:#b7791f;--green2:#1f2937;--danger:#b91c1c;--warning:#a16207;--ok:#047857;--shadow:0 12px 32px rgba(31,41,55,.13);
}
html[data-theme="amber"]{
  --light:#fff9ed;--bg:#fff9ed;--card:#ffffff;--panel:#ffffff;--text:#2b2111;--muted:#766953;--border:#f1dfbd;--green:#d97706;--green2:#78350f;--danger:#b91c1c;--warning:#b45309;--ok:#047857;--shadow:0 12px 32px rgba(217,119,6,.13);
}
html[data-theme="burgundy"]{
  --light:#fbf5f7;--bg:#fbf5f7;--card:#ffffff;--panel:#ffffff;--text:#2c1620;--muted:#7a6170;--border:#ead8df;--green:#be123c;--green2:#7f1d1d;--danger:#991b1b;--warning:#b45309;--ok:#047857;--shadow:0 12px 32px rgba(190,18,60,.13);
}

/* Professional body glows */
html[data-theme="medicine"] body{background:radial-gradient(circle at 82% 0,#bae6fd 0,transparent 34rem),var(--light)}
html[data-theme="regulatory"] body{background:radial-gradient(circle at 82% 0,#bbf7d0 0,transparent 34rem),var(--light)}
html[data-theme="sterile"] body{background:radial-gradient(circle at 82% 0,#dbeafe 0,transparent 34rem),var(--light)}
html[data-theme="cleanroom"] body{background:radial-gradient(circle at 82% 0,#a5f3fc 0,transparent 34rem),var(--light)}
html[data-theme="indigo"] body{background:radial-gradient(circle at 82% 0,#c7d2fe 0,transparent 34rem),var(--light)}
html[data-theme="graphite"] body{background:radial-gradient(circle at 82% 0,#e5e7eb 0,transparent 34rem),var(--light)}
html[data-theme="amber"] body{background:radial-gradient(circle at 82% 0,#fde68a 0,transparent 34rem),var(--light)}
html[data-theme="burgundy"] body{background:radial-gradient(circle at 82% 0,#fecdd3 0,transparent 34rem),var(--light)}

/* Sidebar per theme */
html[data-theme="medicine"] .sidebar{background:linear-gradient(180deg,#082f49,#0f172a)}
html[data-theme="regulatory"] .sidebar{background:linear-gradient(180deg,#064e3b,#022c22)}
html[data-theme="sterile"] .sidebar{background:linear-gradient(180deg,#075985,#0f172a)}
html[data-theme="cleanroom"] .sidebar{background:linear-gradient(180deg,#155e75,#083344)}
html[data-theme="indigo"] .sidebar{background:linear-gradient(180deg,#312e81,#111827)}
html[data-theme="graphite"] .sidebar{background:linear-gradient(180deg,#1f2937,#0f172a)}
html[data-theme="amber"] .sidebar{background:linear-gradient(180deg,#78350f,#1c1917)}
html[data-theme="burgundy"] .sidebar{background:linear-gradient(180deg,#7f1d1d,#1f1015)}

/* More consistent themed components */
html[data-theme] .nav-link:hover,
html[data-theme] .nav-link.active{background:var(--green);color:#fff}
html[data-theme] .logout-btn{color:var(--green2)}
html[data-theme] .hero-card{background:linear-gradient(135deg,#ffffff,var(--light))}
html[data-theme] .hero-chip{background:linear-gradient(135deg,var(--green),var(--green2))}
html[data-theme] button:not(.secondary):not(.danger){background:linear-gradient(135deg,var(--green),var(--green2))}
html[data-theme] button.secondary{background:color-mix(in srgb, var(--green) 8%, #fff);color:var(--green2);border-color:var(--border)}
html[data-theme] .bar span,
html[data-theme] .smallbar span{background:linear-gradient(90deg,var(--green2),var(--green))}
html[data-theme] .theme-control select{
  min-width:190px;
}
html[data-theme="dark"] .hero-card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] table{background:#111827;color:#e5e7eb}
html[data-theme="dark"] th{background:#0b1220;color:#cbd5e1}



/* V11 Theme Cache Bust + Strong Overrides */
.version-mini{
  display:inline-grid;
  place-items:center;
  margin-left:8px;
  padding:4px 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  color:#fff;
  background:linear-gradient(135deg,var(--green),var(--green2));
  vertical-align:middle;
}
.theme-control select{min-width:205px!important}

/* Avoid relying on color-mix for older browsers */
html[data-theme="classic"]{--light:#f2f7f4;--card:#fff;--panel:#fff;--text:#14231b;--muted:#66746c;--border:#d9e8dd;--green:#0f766e;--green2:#05603a;--shadow:0 12px 32px rgba(15,118,110,.13)}
html[data-theme="medicine"]{--light:#f3f7fb;--card:#fff;--panel:#fff;--text:#0f1b2d;--muted:#607089;--border:#dce6f0;--green:#0e7490;--green2:#082f49;--shadow:0 12px 32px rgba(14,116,144,.13)}
html[data-theme="regulatory"]{--light:#f0faf5;--card:#fff;--panel:#fff;--text:#10251c;--muted:#60756b;--border:#d8eadf;--green:#059669;--green2:#064e3b;--shadow:0 12px 32px rgba(5,150,105,.13)}
html[data-theme="sterile"]{--light:#f4f9ff;--card:#fff;--panel:#fff;--text:#102033;--muted:#5e7188;--border:#dbeafe;--green:#0284c7;--green2:#075985;--shadow:0 12px 32px rgba(2,132,199,.13)}
html[data-theme="cleanroom"]{--light:#effbfd;--card:#fff;--panel:#fff;--text:#102a34;--muted:#57717b;--border:#cffafe;--green:#0891b2;--green2:#155e75;--shadow:0 12px 32px rgba(8,145,178,.13)}
html[data-theme="indigo"]{--light:#f4f5ff;--card:#fff;--panel:#fff;--text:#181d35;--muted:#626985;--border:#dfe3ff;--green:#4f46e5;--green2:#312e81;--shadow:0 12px 32px rgba(79,70,229,.13)}
html[data-theme="graphite"]{--light:#f4f5f5;--card:#fff;--panel:#fff;--text:#171717;--muted:#666b70;--border:#dedede;--green:#b7791f;--green2:#1f2937;--shadow:0 12px 32px rgba(31,41,55,.13)}
html[data-theme="amber"]{--light:#fff9ed;--card:#fff;--panel:#fff;--text:#2b2111;--muted:#766953;--border:#f1dfbd;--green:#d97706;--green2:#78350f;--shadow:0 12px 32px rgba(217,119,6,.13)}
html[data-theme="burgundy"]{--light:#fbf5f7;--card:#fff;--panel:#fff;--text:#2c1620;--muted:#7a6170;--border:#ead8df;--green:#be123c;--green2:#7f1d1d;--shadow:0 12px 32px rgba(190,18,60,.13)}

html[data-theme="medicine"] body{background:radial-gradient(circle at 82% 0,#bae6fd 0,transparent 34rem),var(--light)!important}
html[data-theme="regulatory"] body{background:radial-gradient(circle at 82% 0,#bbf7d0 0,transparent 34rem),var(--light)!important}
html[data-theme="sterile"] body{background:radial-gradient(circle at 82% 0,#dbeafe 0,transparent 34rem),var(--light)!important}
html[data-theme="cleanroom"] body{background:radial-gradient(circle at 82% 0,#a5f3fc 0,transparent 34rem),var(--light)!important}
html[data-theme="indigo"] body{background:radial-gradient(circle at 82% 0,#c7d2fe 0,transparent 34rem),var(--light)!important}
html[data-theme="graphite"] body{background:radial-gradient(circle at 82% 0,#e5e7eb 0,transparent 34rem),var(--light)!important}
html[data-theme="amber"] body{background:radial-gradient(circle at 82% 0,#fde68a 0,transparent 34rem),var(--light)!important}
html[data-theme="burgundy"] body{background:radial-gradient(circle at 82% 0,#fecdd3 0,transparent 34rem),var(--light)!important}

html[data-theme="medicine"] .sidebar{background:linear-gradient(180deg,#082f49,#0f172a)!important}
html[data-theme="regulatory"] .sidebar{background:linear-gradient(180deg,#064e3b,#022c22)!important}
html[data-theme="sterile"] .sidebar{background:linear-gradient(180deg,#075985,#0f172a)!important}
html[data-theme="cleanroom"] .sidebar{background:linear-gradient(180deg,#155e75,#083344)!important}
html[data-theme="indigo"] .sidebar{background:linear-gradient(180deg,#312e81,#111827)!important}
html[data-theme="graphite"] .sidebar{background:linear-gradient(180deg,#1f2937,#0f172a)!important}
html[data-theme="amber"] .sidebar{background:linear-gradient(180deg,#78350f,#1c1917)!important}
html[data-theme="burgundy"] .sidebar{background:linear-gradient(180deg,#7f1d1d,#1f1015)!important}

html[data-theme] .hero-card{background:linear-gradient(135deg,#fff,var(--light))!important}
html[data-theme] .hero-chip{background:linear-gradient(135deg,var(--green),var(--green2))!important}
html[data-theme] .nav-link:hover,
html[data-theme] .nav-link.active{background:var(--green)!important;color:#fff!important}
html[data-theme] button:not(.secondary):not(.danger){background:linear-gradient(135deg,var(--green),var(--green2))!important}
html[data-theme] button.secondary{background:#fff!important;color:var(--green2)!important;border-color:var(--border)!important}
html[data-theme] .bar span,
html[data-theme] .smallbar span{background:linear-gradient(90deg,var(--green2),var(--green))!important}



/* V13 Mobile + Desktop Responsive Fix */
html,body{overflow-x:hidden!important}

/* Desktop keeps enterprise layout */
@media(min-width:1101px){
  .app-shell{grid-template-columns:var(--sidebar,255px) minmax(0,1fr)!important}
  .sidebar{height:100vh!important;position:sticky!important;top:0!important;overflow:auto!important}
  .topbar{position:relative!important;top:auto!important}
}

/* Tablet and mobile: sidebar becomes an off-canvas menu instead of taking vertical space */
@media(max-width:1100px){
  .app-shell{
    display:block!important;
    min-height:100vh!important;
  }
  .main{
    padding:16px!important;
    width:100%!important;
    min-width:0!important;
  }
  .sidebar{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:-295px!important;
    width:280px!important;
    height:100vh!important;
    max-height:100vh!important;
    overflow-y:auto!important;
    z-index:999!important;
    transition:left .22s ease!important;
    box-shadow:18px 0 45px rgba(15,23,42,.25)!important;
    border-radius:0 22px 22px 0!important;
  }
  body.sidebar-open .sidebar{left:0!important}
  body.sidebar-open::after{
    content:"";
    position:fixed;
    inset:0;
    background:rgba(15,23,42,.38);
    z-index:998;
  }
  body.sidebar-open .sidebar{z-index:1000!important}
  .sidebar nav{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  .mobile-menu{display:inline-flex!important}

  .topbar{
    position:relative!important;
    top:auto!important;
    z-index:20!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:12px!important;
    margin-bottom:14px!important;
  }
  .topbar>div{width:100%!important}
  .topbar h1{
    font-size:28px!important;
    line-height:1.12!important;
    word-break:break-word!important;
  }
  .version-mini{
    display:inline-flex!important;
    margin-top:6px!important;
  }
  .top-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    width:100%!important;
  }
  .top-actions button,
  .theme-control,
  .density-control{
    width:100%!important;
    min-height:48px!important;
  }
  .theme-control,
  .density-control{
    justify-content:space-between!important;
  }
  .theme-control select,
  .density-control select{
    max-width:none!important;
    width:100%!important;
    min-width:0!important;
  }

  .hero-card{
    flex-direction:column!important;
    align-items:flex-start!important;
    padding:20px!important;
  }
  .hero-card h2{
    font-size:28px!important;
    line-height:1.15!important;
  }
  .hero-chip{
    min-width:0!important;
    width:100%!important;
  }

  .stat-grid,
  .dashboard-grid,
  .asset-profile-grid,
  .admin-layout,
  .details-grid,
  .asset-form,
  .filters{
    grid-template-columns:1fr!important;
  }
  .panel-head,
  .brand-row,
  .asset-profile-head,
  .asset-actions,
  .search-tools{
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
  }
  .asset-actions button,
  .search-tools button{
    width:100%!important;
  }
  .qr-panel canvas,
  .qr-box canvas,
  .qr-box img{
    max-width:100%!important;
  }

  .table-wrap,
  .tablewrap,
  .admin-table,
  .asset-table-wrap{
    max-width:100%!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  table{min-width:780px!important}
  th,td{white-space:nowrap!important}
}

/* Phones */
@media(max-width:640px){
  .main{padding:10px!important}
  .topbar{
    padding:12px 0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .topbar h1{font-size:25px!important}
  .eyebrow{font-size:11px!important}
  .top-actions{grid-template-columns:1fr!important}
  .hero-card{border-radius:20px!important}
  .hero-card h2{font-size:24px!important}
  .stat-card,
  .panel,
  .hero-card{
    border-radius:20px!important;
    padding:16px!important;
  }
  .stat-card strong{font-size:30px!important}
  input,select,textarea,button{min-height:46px!important}
  .creator-footer{
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:10px!important;
    margin-bottom:12px!important;
  }
  .modal,
  .dialog{
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    margin:10px!important;
    border-radius:20px!important;
  }
}



/* V14 Mobile Menu Close Fix */
.side-close-mobile{
  display:none;
}
.sidebar-overlay{
  display:none;
}
@media(max-width:1100px){
  /* use a real overlay; remove the old pseudo overlay so it does not trap the page */
  body.sidebar-open::after{
    display:none!important;
    content:none!important;
  }
  .sidebar-overlay{
    position:fixed;
    inset:0;
    background:rgba(15,23,42,.42);
    z-index:998;
    opacity:0;
    pointer-events:none;
    transition:opacity .2s ease;
  }
  body.sidebar-open .sidebar-overlay{
    display:block;
    opacity:1;
    pointer-events:auto;
  }
  .sidebar{
    z-index:1000!important;
  }
  .side-brand{
    position:relative!important;
    padding-right:48px!important;
  }
  .side-close-mobile{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:absolute!important;
    top:8px!important;
    right:8px!important;
    width:38px!important;
    height:38px!important;
    min-height:38px!important;
    border-radius:14px!important;
    border:1px solid rgba(255,255,255,.24)!important;
    background:rgba(255,255,255,.16)!important;
    color:#fff!important;
    font-size:25px!important;
    font-weight:900!important;
    line-height:1!important;
    padding:0!important;
  }
  .side-close-mobile:active{
    transform:scale(.96);
  }
}



/* V16 Asset Mobile Controls Layout */
/* Mobile UX: controls no longer stack as huge vertical blocks. */
@media(max-width:700px){
  .topbar{
    padding:14px!important;
    gap:12px!important;
    border-radius:22px!important;
  }

  .top-actions,
  .header-actions,
  .toolbar-actions,
  .actions-row{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
    width:100%!important;
    align-items:stretch!important;
  }

  /* Theme and density/select controls full width */
  .theme-control,
  .density-control,
  .top-actions label,
  .header-actions label{
    grid-column:1 / -1!important;
    width:100%!important;
    min-height:48px!important;
    height:48px!important;
    padding:0 12px!important;
    border-radius:18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
  }

  .theme-control select,
  .density-control select,
  .top-actions label select,
  .header-actions label select{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:44px!important;
    font-size:15px!important;
    font-weight:800!important;
    padding:0 8px!important;
  }

  .top-actions button,
  .header-actions button,
  .toolbar-actions button,
  .actions-row button{
    width:100%!important;
    min-height:44px!important;
    height:44px!important;
    padding:8px 10px!important;
    border-radius:17px!important;
    font-size:14px!important;
    font-weight:900!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  /* Keep Export CSV important but still compact */
  #exportBtn,
  #exportCsvBtn,
  button[onclick*="export"],
  button[onclick*="Export"]{
    grid-column:1 / -1!important;
  }

  .topbar h1{
    font-size:31px!important;
    line-height:1.08!important;
    margin-top:2px!important;
  }

  .topbar p,
  .topbar .subtitle{
    font-size:15px!important;
    line-height:1.4!important;
  }

  .eyebrow{
    font-size:12px!important;
    letter-spacing:.12em!important;
  }
}

@media(max-width:430px){
  .top-actions,
  .header-actions,
  .toolbar-actions,
  .actions-row{
    grid-template-columns:1fr 1fr!important;
  }

  .theme-control,
  .density-control,
  .top-actions label,
  .header-actions label{
    grid-column:1 / -1!important;
  }

  .top-actions button,
  .header-actions button,
  .toolbar-actions button,
  .actions-row button{
    min-height:42px!important;
    height:42px!important;
    font-size:13px!important;
    padding:7px 8px!important;
  }
}


/* V17 Asset Attachments */
.asset-attachments-panel{margin-top:16px;padding:16px;border:1px solid var(--line,#dbe7ef);border-radius:18px;background:var(--panel,#fff)}
.asset-attachments-panel h3{margin:0 0 6px}
.asset-attachments-panel input[type=file]{width:100%;padding:10px;border:1px solid var(--line,#dbe7ef);border-radius:14px;background:var(--panel,#fff);margin:10px 0}
.attachment-list-box{display:grid;gap:8px;margin-top:12px}
.asset-attachment-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:10px;border:1px solid var(--line,#dbe7ef);border-radius:14px;background:rgba(255,255,255,.55)}
.asset-attachment-row a,.attachment-link{font-weight:900;color:var(--brand,#0f766e);text-decoration:none;word-break:break-word}
.selected-attachments{margin-top:16px}
@media(max-width:700px){.asset-attachment-row{grid-template-columns:1fr}.asset-attachment-row button{width:100%}}


/* Validation Center / Certificates */
.validation-hero{
  border-radius:26px;
  padding:24px;
  background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(224,242,254,.62));
  border:1px solid rgba(14,116,144,.22);
  box-shadow:0 18px 46px rgba(15,23,42,.08);
  margin-bottom:16px;
}
.validation-hero h2{margin:8px 0 6px;font-size:30px}
.validation-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:#fff7ed;
  border:1px solid #fed7aa;
  color:#9a3412;
  font-weight:950;
  font-size:12px;
}
.validation-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:16px;
}
.validation-card{
  background:var(--panel,#fff);
  border:1px solid var(--line,#dbeafe);
  border-radius:22px;
  padding:18px;
  box-shadow:0 16px 38px rgba(15,23,42,.07);
}
.validation-card h3{margin:0 0 12px}
.validation-list{
  display:grid;
  gap:10px;
}
.validation-row{
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  gap:12px;
  padding:10px 0;
  border-bottom:1px dashed var(--line,#dbeafe);
}
.validation-row:last-child{border-bottom:0}
.validation-row span{color:var(--muted,#64748b);font-weight:800}
.validation-row b{color:var(--ink,#0f172a)}
.validation-docs{
  display:grid;
  gap:10px;
}
.validation-doc{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px;
  border-radius:16px;
  border:1px solid var(--line,#dbeafe);
  background:rgba(255,255,255,.62);
}
.validation-doc strong{display:block}
.validation-doc small{color:var(--muted,#64748b)}
.validation-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:950;
  background:#fef3c7;
  color:#92400e;
  white-space:nowrap;
}
.validation-status.done{background:#dcfce7;color:#166534}
.validation-status.pending{background:#fee2e2;color:#991b1b}
.validation-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}
.validation-actions button,
.validation-actions a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:42px;
  padding:10px 14px;
  border-radius:14px;
  border:1px solid var(--line,#dbeafe);
  background:var(--brand,#0f766e);
  color:#fff;
  font-weight:950;
  text-decoration:none;
}
.validation-actions .secondary{
  background:var(--panel,#fff);
  color:var(--ink,#0f172a);
}
.validation-certificate{
  background:#fff;
  color:#0f172a;
  border:2px solid #0f766e;
  border-radius:22px;
  padding:26px;
  position:relative;
  overflow:hidden;
}
.validation-certificate:before{
  content:"";
  position:absolute;
  inset:12px;
  border:1px solid rgba(15,118,110,.28);
  border-radius:16px;
  pointer-events:none;
}
.validation-certificate h2{
  text-align:center;
  margin:0;
  color:#0f172a;
  font-size:28px;
}
.validation-certificate .cert-sub{
  text-align:center;
  color:#64748b;
  margin:8px 0 18px;
}
.cert-warning{
  margin:14px 0;
  padding:12px;
  border-radius:14px;
  background:#fff7ed;
  border:1px solid #fed7aa;
  color:#9a3412;
  font-weight:850;
}
.cert-signatures{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-top:24px;
}
.cert-signatures div{
  min-height:74px;
  border-top:1px solid #94a3b8;
  padding-top:8px;
  color:#334155;
}
@media(max-width:900px){
  .validation-grid{grid-template-columns:1fr}
  .validation-row{grid-template-columns:1fr}
  .cert-signatures{grid-template-columns:1fr}
}
@media print{
  .side,.top,.topbar,.sidebar,.validation-actions{display:none!important}
  .validation-certificate{break-inside:avoid;border-color:#111}
}