/* Visão SF — Design System v0.2.0
   Refinamento visual, UX e responsividade. Regras funcionais permanecem no app.js. */
:root {
  color-scheme: dark;
  --bg-main: #030B13;
  --bg-secondary: #05111C;
  --surface: #071625;
  --surface-raised: #0A1C2C;
  --surface-soft: #081A2A;
  --surface-input: #06131F;

  --cyan: #39D9FF;
  --blue: #00BFFF;
  --amber: #FFB020;
  --orange: #FF8A34;
  --green: #35D07F;
  --red: #FF4D5A;
  --purple: #A986FF;

  --text-main: #F1F7FB;
  --text-secondary: #93A8B7;
  --text-muted: #647988;
  --text-soft: #B8CBD7;

  --border: #173148;
  --border-strong: #234B67;
  --border-active: rgba(57, 217, 255, .62);

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-sheet: 20px;

  --control-h: 44px;
  --control-h-mobile: 48px;
  --topbar-h: 64px;
  --sidebar-collapsed: 88px;
  --sidebar-expanded: 216px;
  --sidebar-current-width: var(--sidebar-collapsed);
  --content-max: 1600px;

  --shadow-card: 0 6px 18px rgba(0,0,0,.20);
  --shadow-panel: 0 12px 30px rgba(0,0,0,.28);
  --shadow-modal: 0 24px 60px rgba(0,0,0,.45);
  --glow-cyan: 0 0 18px rgba(0,191,255,.14);
  --glow-red: 0 0 20px rgba(255,77,90,.18);

  /* aliases preservados para compatibilidade com a base */
  --bg: var(--bg-main);
  --panel: var(--surface);
  --panel-2: var(--surface-soft);
  --panel-3: var(--surface-raised);
  --line: var(--border);
  --line-2: var(--border-strong);
  --blue-soft: rgba(0,191,255,.12);
  --text: var(--text-main);
  --muted: var(--text-secondary);
  --muted-2: var(--text-muted);
  --shadow: var(--shadow-panel);
  --radius: var(--radius-lg);
}

* { box-sizing: border-box; }
html { background: var(--bg-main); scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 74% 8%, color-mix(in srgb, var(--accent) 5.5%, transparent), transparent 30%),
    radial-gradient(circle at 12% 42%, color-mix(in srgb, var(--accent) 2.5%, transparent), transparent 27%),
    var(--bg-main);
  color: var(--text-main);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .45; transform: none !important; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 2px;
}
[hidden] { display: none !important; }
#app { min-height: 100vh; }
svg.icon { width: 1em; height: 1em; display: block; stroke: currentColor; fill: none; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }

/* LOGIN */
.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: var(--space-6);
  position: relative;
  overflow: hidden;
}
.login-shell::before,
.login-shell::after {
  content: "";
  position: absolute;
  width: 460px;
  height: 460px;
  border: 1px solid color-mix(in srgb, var(--accent) 11.0%, transparent);
  transform: rotate(35deg);
  pointer-events: none;
}
.login-shell::before { left: -255px; top: -165px; }
.login-shell::after { right: -260px; bottom: -190px; }
.login-card {
  width: min(420px, 100%);
  background: linear-gradient(145deg, color-mix(in srgb, var(--bg-main) 97.0%, transparent), color-mix(in srgb, var(--bg-main) 97.0%, transparent));
  border: 1px solid var(--border-strong);
  box-shadow: var(--shadow-modal), 0 0 34px color-mix(in srgb, var(--accent) 6.0%, transparent);
  padding: 30px;
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
  position: relative;
  z-index: 2;
}
.brand-lockup { display:flex; align-items:center; gap:var(--space-3); }
.brand-mark { width:44px; height:44px; object-fit:contain; filter: drop-shadow(0 0 9px color-mix(in srgb, var(--accent) 14.0%, transparent)); }
.brand-name { font-size: 22px; line-height: 1.15; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }
.brand-sub { color: var(--text-secondary); font-size: 11px; font-weight: 550; letter-spacing: .10em; text-transform: uppercase; margin-top: 4px; }
.login-title { font-size: 24px; line-height: 1.25; font-weight: 700; margin: 32px 0 8px; }
.login-copy { color: var(--text-secondary); margin: 0 0 24px; line-height: 1.55; font-size: 13px; }
.login-footnote { color: var(--text-muted); margin-top: 16px; font-size: 11px; text-align:center; }
.password-wrap { position: relative; }
.password-wrap .input { padding-right: 48px; }
.password-toggle {
  position:absolute; right:4px; top:4px; width:40px; height:40px; border:0; border-radius:9px;
  background:transparent; color:var(--text-secondary); display:grid; place-items:center;
}
.password-toggle:hover { color:var(--cyan); background:color-mix(in srgb, var(--accent) 6.0%, transparent); }
.demo-hint { font-size: 11px; color: var(--text-muted); margin-top: 16px; line-height: 1.55; }

/* APP SHELL */
.app-shell {
  --sidebar-current-width:var(--sidebar-collapsed);
  min-height:100vh;
  display:grid;
  grid-template-columns:var(--sidebar-current-width) minmax(0,1fr);
  transition:grid-template-columns 200ms cubic-bezier(.2,.8,.2,1);
}
.app-shell.sidebar-expanded { --sidebar-current-width:var(--sidebar-expanded); }
.sidebar {
  position:sticky;
  top:0;
  height:100vh;
  z-index:20;
  min-width:0;
  overflow-y:auto;
  overflow-x:visible;
  border-right:1px solid var(--border);
  background:linear-gradient(180deg,color-mix(in srgb, var(--bg-main) 98.0%, transparent),color-mix(in srgb, var(--bg-main) 97.0%, transparent));
  backdrop-filter:blur(14px);
  padding:10px 9px 16px;
  scrollbar-width:none;
}
.sidebar::-webkit-scrollbar { display:none; }
.side-logo {
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  padding:8px;
  margin-bottom:14px;
  border-bottom:1px solid color-mix(in srgb, var(--bg-main) 58.0%, transparent);
  overflow:hidden;
}
.side-logo img {
  width:42px;
  height:42px;
  object-fit:contain;
  flex:0 0 auto;
  transition:width 200ms ease,height 200ms ease;
}
.side-brand-copy {
  display:none;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  opacity:0;
  transform:translateX(-4px);
  transition:opacity 150ms ease,transform 180ms ease;
}
.side-brand-copy strong {
  display:block;
  color:var(--text-main);
  font-size:14px;
  line-height:1.15;
  letter-spacing:.08em;
  font-weight:750;
}
.side-brand-copy span {
  display:block;
  margin-top:4px;
  color:var(--text-secondary);
  font-size:9px;
  line-height:1.2;
  letter-spacing:.08em;
  white-space:nowrap;
}
.sidebar-expanded .side-logo {
  justify-content:flex-start;
  padding-left:10px;
}
.sidebar-expanded .side-logo img { width:38px; height:38px; }
.sidebar-expanded .side-brand-copy {
  display:block;
  opacity:1;
  transform:none;
}
.side-nav {
  display:flex;
  flex-direction:column;
  gap:11px;
}
.nav-section {
  display:grid;
  gap:4px;
  min-width:0;
}
.nav-section + .nav-section { margin-top:3px; }
.nav-section-title {
  display:none;
  padding:0 9px 4px;
  color:var(--text-secondary);
  font-size:9px;
  line-height:1.2;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
}
.sidebar-expanded .nav-section-title { display:block; }
.nav-section-items { display:grid; gap:4px; min-width:0; }
.nav-item {
  position:relative;
  display:grid;
  grid-template-columns:1fr;
  place-items:center;
  min-height:48px;
  padding:0;
  border:1px solid transparent;
  background:transparent;
  color:var(--text-secondary);
  border-radius:11px;
  transition:background 180ms ease,color 180ms ease,border-color 180ms ease;
  min-width:0;
}
.nav-item:hover,.nav-item:focus-visible {
  color:var(--text-main);
  background:color-mix(in srgb, var(--accent) 4.5%, transparent);
}
.nav-item.active {
  color:var(--cyan);
  background:color-mix(in srgb, var(--accent) 8.0%, transparent);
  border-color:color-mix(in srgb, var(--accent) 14.0%, transparent);
}
.nav-item.active::before {
  content:"";
  position:absolute;
  left:-9px;
  top:9px;
  bottom:9px;
  width:3px;
  background:var(--cyan);
  box-shadow:0 0 10px color-mix(in srgb, var(--accent) 38.0%, transparent);
  border-radius:0 3px 3px 0;
}
.nav-icon {
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  font-size:20px;
  line-height:1;
  flex:0 0 auto;
}
.nav-label { display:none; }
.nav-item[data-tooltip]::after {
  content:attr(data-tooltip);
  position:absolute;
  left:calc(100% + 12px);
  top:50%;
  transform:translateY(-50%) translateX(-4px);
  background:var(--surface-raised);
  color:var(--text-main);
  border:1px solid var(--border-strong);
  box-shadow:var(--shadow-card);
  padding:7px 9px;
  border-radius:8px;
  font-size:11px;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity 160ms ease,transform 160ms ease;
  z-index:90;
}
.nav-item[data-tooltip]:hover::after,
.nav-item[data-tooltip]:focus-visible::after {
  opacity:1;
  transform:translateY(-50%) translateX(0);
}
.sidebar-expanded .side-nav { gap:13px; }
.sidebar-expanded .nav-item {
  grid-template-columns:24px minmax(0,1fr);
  place-items:center stretch;
  min-height:50px;
  padding:7px 11px;
  column-gap:13px;
}
.sidebar-expanded .nav-icon { justify-self:center; }
.sidebar-expanded .nav-label {
  display:block;
  min-width:0;
  color:inherit;
  font-size:12px;
  line-height:1.2;
  font-weight:600;
  text-align:left;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sidebar-expanded .nav-item[data-tooltip]::after { display:none; }
.main {
  min-width:0;
  container-type:inline-size;
  container-name:appmain;
}
.topbar {
  min-height:var(--topbar-h); display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:0 24px; border-bottom:1px solid var(--border); background:color-mix(in srgb, var(--bg-main) 91.0%, transparent); backdrop-filter:blur(16px);
  position:sticky; top:0; z-index:15;
}
.top-left { display:flex; align-items:center; gap:12px; min-width:0; }
.topbar-menu {
  position:relative; width:42px; height:42px; min-width:42px; min-height:42px; padding:0; display:grid; place-items:center;
  border:1px solid var(--border); border-radius:11px; background:color-mix(in srgb, var(--bg-main) 72.0%, transparent); color:var(--text-secondary);
  transition:background 180ms ease,color 180ms ease,border-color 180ms ease,box-shadow 180ms ease;
}
.topbar-menu:hover,.topbar-menu:focus-visible { color:var(--cyan); border-color:var(--border-active); background:color-mix(in srgb, var(--accent) 5.5%, transparent); box-shadow:0 0 14px color-mix(in srgb, var(--accent) 8.0%, transparent); }
.topbar-menu::after {
  content:attr(data-tooltip); position:absolute; left:0; top:calc(100% + 9px); transform:translateY(-3px);
  padding:7px 9px; border:1px solid var(--border-strong); border-radius:8px; background:var(--surface-raised); color:var(--text-main);
  box-shadow:var(--shadow-card); font-size:11px; line-height:1; white-space:nowrap; opacity:0; pointer-events:none; transition:opacity 150ms ease,transform 150ms ease; z-index:90;
}
.topbar-menu:hover::after,.topbar-menu:focus-visible::after { opacity:1; transform:none; }
.page-title { font-size:19px; line-height:1.25; font-weight:700; letter-spacing:.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.top-actions { display:flex; align-items:center; gap:8px; }
.clock-box { display:flex; gap:8px; align-items:center; color:var(--text-muted); font-size:11px; }
.clock-box strong { color:var(--text-secondary); font-weight:650; }
.icon-btn {
  width:40px; height:40px; display:grid; place-items:center; border-radius:var(--radius-sm); border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg-main) 72.0%, transparent); color:var(--text-secondary); transition:.18s ease;
}
.icon-btn:hover { color:var(--cyan); border-color:var(--border-active); background:color-mix(in srgb, var(--accent) 5.0%, transparent); }
.user-chip { display:flex; align-items:center; gap:9px; padding:5px 9px 5px 5px; border:1px solid var(--border); border-radius:999px; background:color-mix(in srgb, var(--bg-main) 78.0%, transparent); }
.avatar { width:31px; height:31px; border-radius:50%; display:grid; place-items:center; font-size:12px; font-weight:700; background:linear-gradient(135deg,var(--accent),var(--accent)); color:#fff; }
.user-meta strong { display:block; font-size:11px; line-height:1.3; }
.user-meta span { display:block; color:var(--text-secondary); font-size:10px; line-height:1.25; }
.content { padding:24px 24px 104px; max-width:var(--content-max); margin:0 auto; width:100%; min-width:0; container-type:inline-size; container-name:dashboard; }

/* BASE COMPONENTS */
.btn {
  min-height:var(--control-h); padding:9px 14px; border-radius:11px; border:1px solid var(--border-strong);
  background:var(--surface-raised); color:var(--text-main); font-weight:650; font-size:12px; line-height:1.2;
  display:inline-flex; align-items:center; justify-content:center; gap:8px; transition:transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.btn:hover { border-color:var(--border-active); transform:translateY(-1px); }
.btn:active { transform:translateY(0); }
.btn-primary { background:var(--border-strong); color:var(--text-main); border-color:var(--accent); box-shadow:0 0 14px color-mix(in srgb, var(--accent) 7.0%, transparent); }
.btn-primary:hover { background:var(--border-strong); box-shadow:var(--glow-cyan); }
.btn-success { background:rgba(53,208,127,.13); border-color:rgba(53,208,127,.42); color:var(--text-soft); }
.btn-danger { background:rgba(255,77,90,.10); border-color:rgba(255,77,90,.38); color:#FFD6DA; }
.btn-amber { background:rgba(255,176,32,.10); border-color:rgba(255,176,32,.36); color:#FFE0A0; }
.btn-ghost { background:transparent; border-color:transparent; color:var(--text-secondary); }
.btn-ghost:hover { background:color-mix(in srgb, var(--accent) 5.0%, transparent); border-color:color-mix(in srgb, var(--accent) 16.0%, transparent); color:var(--text-main); }
.btn-sm { min-height:38px; padding:7px 11px; font-size:11px; border-radius:9px; }
.btn-wide { width:100%; }

.panel {
  background:linear-gradient(180deg,color-mix(in srgb, var(--bg-main) 96.0%, transparent),color-mix(in srgb, var(--bg-main) 96.0%, transparent)); border:1px solid var(--border);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-panel); position:relative; overflow:hidden;
}
.panel::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(135deg,color-mix(in srgb, var(--accent) 2.5%, transparent),transparent 26%,transparent 74%,color-mix(in srgb, var(--accent) 1.8%, transparent)); }
.panel-head { padding:18px 20px 10px; display:flex; justify-content:space-between; gap:14px; align-items:flex-start; position:relative; z-index:1; }
.panel-title { margin:0; font-size:14px; line-height:1.3; font-weight:650; letter-spacing:.055em; text-transform:uppercase; color:var(--text-main); }
.panel-sub { margin-top:4px; color:var(--text-secondary); font-size:11px; line-height:1.45; }
.panel-body { padding:12px 20px 20px; position:relative; z-index:1; }
.chamfer { clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px)); }

.badge {
  display:inline-flex; align-items:center; gap:6px; min-height:27px; padding:5px 9px; border-radius:999px;
  border:1px solid var(--border); background:var(--surface-raised); color:var(--text-soft); font-size:10px; line-height:1;
  font-weight:650; letter-spacing:.045em; text-transform:uppercase; white-space:nowrap;
}
.badge .icon { font-size:13px; }
.badge.ok { color:var(--text-soft); border-color:rgba(53,208,127,.32); background:rgba(53,208,127,.075); }
.badge.attention { color:#FFE0A2; border-color:rgba(255,176,32,.36); background:rgba(255,176,32,.075); }
.badge.critical { color:#FFD2D6; border-color:rgba(255,77,90,.40); background:rgba(255,77,90,.085); }
.badge.info { color:var(--text-main); border-color:color-mix(in srgb, var(--accent) 32.0%, transparent); background:color-mix(in srgb, var(--accent) 7.5%, transparent); }
.badge.recurrence { color:#E2D7FF; border-color:rgba(169,134,255,.34); background:rgba(169,134,255,.075); }
.badge.verify { color:#E3D9FF; border-color:rgba(169,134,255,.34); background:rgba(169,134,255,.075); }
.badge.muted { color:var(--text-secondary); background:color-mix(in srgb, var(--accent) 8.0%, transparent); }
.badge.unrated { color:var(--text-secondary); border-color:color-mix(in srgb, var(--accent) 30.0%, transparent); background:color-mix(in srgb, var(--accent) 7.0%, transparent); }
.process-card.unrated::before { background:var(--text-secondary); opacity:.55; }
.process-card.unrated .health-bar>span { background:var(--text-secondary); box-shadow:none; }

.field { display:grid; gap:7px; margin:0; }
.field label { color:var(--text-soft); font-size:12px; line-height:1.3; font-weight:600; letter-spacing:.01em; }
.input, .select, .textarea, .filter-input {
  width:100%; min-height:var(--control-h); border:1px solid var(--border); border-radius:var(--radius-sm);
  background:var(--surface-input); color:var(--text-main); outline:none; padding:10px 12px; font-size:13px;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.input::placeholder, .textarea::placeholder, .filter-input::placeholder { color:var(--text-secondary); }
.input:hover, .select:hover, .textarea:hover, .filter-input:hover { border-color:var(--border-strong); }
.input:focus, .select:focus, .textarea:focus, .filter-input:focus { border-color:var(--cyan); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 8.0%, transparent); background:var(--surface); }
.textarea { min-height:104px; resize:vertical; line-height:1.5; }

.page-toolbar { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-bottom:20px; }
.page-intro h2 { margin:0 0 5px; font-size:22px; line-height:1.25; font-weight:700; }
.page-intro p { margin:0; color:var(--text-secondary); font-size:12px; line-height:1.5; max-width:720px; }

.filters-shell { margin-bottom:16px; }
.filters { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 14px; }
.filter-input { min-width:168px; min-height:40px; padding:8px 11px; font-size:12px; }
.filters .filter-search { flex:1 1 230px; }
.mobile-filter-controls { display:none; gap:8px; margin-bottom:10px; }
.filter-count { min-width:20px; height:20px; border-radius:999px; background:color-mix(in srgb, var(--accent) 12.0%, transparent); color:var(--cyan); display:inline-grid; place-items:center; font-size:10px; }
.active-filter-chips { display:flex; flex-wrap:wrap; gap:6px; margin:-4px 0 14px; }
.filter-chip { border:1px solid color-mix(in srgb, var(--accent) 22.0%, transparent); background:color-mix(in srgb, var(--accent) 6.0%, transparent); color:var(--text-main); border-radius:999px; min-height:28px; padding:5px 9px; font-size:10px; display:inline-flex; gap:6px; align-items:center; }
.segmented { display:inline-flex; border:1px solid var(--border); border-radius:11px; overflow:hidden; background:var(--surface-input); }
.segmented button { border:0; background:transparent; color:var(--text-secondary); min-height:38px; padding:0 13px; font-size:11px; font-weight:650; }
.segmented button:hover { background:color-mix(in srgb, var(--accent) 4.0%, transparent); color:var(--text-main); }
.segmented button.active { background:color-mix(in srgb, var(--accent) 9.0%, transparent); color:var(--cyan); box-shadow:inset 0 -2px var(--cyan); }

/* DASHBOARD */
.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr); gap:16px; }
.dashboard-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; margin-bottom:16px; }
.dashboard-actions { display:flex; flex-wrap:wrap; gap:8px; }
.rhythm-panel { grid-column:1/-1; padding:12px 18px; box-shadow:var(--shadow-card); }
.rhythm-row { display:grid; grid-template-columns:170px minmax(0,1fr) 78px; gap:16px; align-items:center; }
.rhythm-label strong { display:block; font-size:12px; font-weight:650; letter-spacing:.06em; text-transform:uppercase; }
.rhythm-label span { color:var(--text-secondary); font-size:11px; }
.rhythm-track { height:22px; display:flex; gap:4px; transform:skewX(-18deg); align-items:stretch; position:relative; }
.rhythm-seg { flex:1; background:var(--surface-raised); border:1px solid var(--border-strong); }
.rhythm-seg.on { background:linear-gradient(180deg,var(--accent),var(--accent)); box-shadow:0 0 8px color-mix(in srgb, var(--accent) 22.0%, transparent); }
.rhythm-seg.goal { border-color:var(--amber); box-shadow:0 0 8px rgba(255,176,32,.18); }
.rhythm-value { text-align:right; font-size:22px; line-height:1; font-weight:700; color:var(--text-main); }

.instrument-zone { min-height:440px; padding:8px 10px 14px; overflow:hidden; }
.instrument-cluster-body { padding-top:0; }
.gauge-cluster { position:relative; min-height:378px; display:grid; grid-template-columns:minmax(142px,176px) minmax(330px,460px) minmax(142px,176px); grid-template-rows:1fr 28px; align-items:end; justify-content:center; gap:0 8px; padding:0 4px 2px; isolation:isolate; }
.gauge-cluster::before { content:""; position:absolute; left:7%; right:7%; bottom:40px; height:74px; z-index:-1; border:1px solid color-mix(in srgb, var(--accent) 12.0%, transparent); border-top-color:color-mix(in srgb, var(--accent) 22.0%, transparent); background:linear-gradient(180deg,color-mix(in srgb, var(--bg-main) 4.0%, transparent),color-mix(in srgb, var(--bg-main) 42.0%, transparent)); clip-path:polygon(0 36%,8% 0,31% 0,35% 20%,65% 20%,69% 0,92% 0,100% 36%,100% 100%,0 100%); }
.gauge-cluster::after { content:""; position:absolute; left:15%; right:15%; bottom:51px; height:1px; z-index:-1; background:linear-gradient(90deg,transparent,color-mix(in srgb, var(--accent) 32.0%, transparent) 18%,color-mix(in srgb, var(--accent) 12.0%, transparent) 50%,color-mix(in srgb, var(--accent) 32.0%, transparent) 82%,transparent); box-shadow:0 0 8px color-mix(in srgb, var(--accent) 12.0%, transparent); }
.main-gauge-shell { grid-column:2; grid-row:1; align-self:center; justify-self:center; width:100%; max-width:460px; z-index:3; }
.gauge-wrap { display:grid; place-items:center; min-height:350px; position:relative; }
.gauge-wrap svg { width:min(100%,460px); height:auto; overflow:visible; }
.gauge-number { position:absolute; top:46%; left:50%; transform:translate(-50%,-50%); text-align:center; pointer-events:none; }
.gauge-number strong { font-size:52px; line-height:1; font-weight:700; letter-spacing:-.035em; text-shadow:0 0 14px color-mix(in srgb, var(--accent) 16.0%, transparent); }
.gauge-number span { display:block; color:var(--text-secondary); font-size:11px; text-transform:uppercase; letter-spacing:.11em; margin-top:5px; }
.gauge-status { margin-top:7px; color:var(--text-soft); font-size:11px; font-weight:700; letter-spacing:.06em; }
.gauge-status.ok { color:var(--green); }
.gauge-status.attention { color:var(--amber); }
.gauge-status.critical { color:var(--red); }
.mini-gauge-shell { grid-row:1; align-self:end; justify-self:center; width:100%; max-width:176px; aspect-ratio:1; position:relative; z-index:4; filter:drop-shadow(0 12px 18px rgba(0,0,0,.18)); }
.mini-gauge-left { grid-column:1; margin-bottom:28px; }
.mini-gauge-right { grid-column:3; margin-bottom:28px; }
.mini-gauge-shell svg { width:100%; height:auto; display:block; overflow:visible; }
.mini-gauge-readout { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding-top:6%; pointer-events:none; text-align:center; }
.mini-gauge-readout strong { font-size:29px; line-height:1; font-weight:700; letter-spacing:-.025em; color:var(--text-main); text-shadow:0 0 10px color-mix(in srgb, var(--accent) 15.0%, transparent); }
.mini-gauge-readout span { margin-top:6px; color:var(--text-secondary); font-size:9px; line-height:1.2; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.mini-gauge-readout em { margin-top:4px; color:var(--text-soft); font-size:10px; line-height:1.25; font-style:normal; font-weight:600; }
.mini-gauge-readout small { margin-top:4px; color:var(--text-muted); font-size:8px; line-height:1.2; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.mini-gauge-shell.ok small { color:var(--green); }
.mini-gauge-shell.attention small { color:var(--amber); }
.mini-gauge-shell.critical small { color:var(--red); }
.cluster-caption { grid-row:2; align-self:start; text-align:center; color:var(--text-secondary); font-size:9px; line-height:1.2; font-weight:650; letter-spacing:.07em; text-transform:uppercase; }
.cluster-caption-left { grid-column:1; }
.cluster-caption-right { grid-column:3; }

.distribution-panel { min-height:440px; }
.big-metric { font-size:42px; line-height:1; font-weight:700; }
.big-metric-sub { color:var(--text-secondary); font-size:11px; text-transform:uppercase; letter-spacing:.07em; margin-top:7px; }
.delta { color:var(--green); font-size:12px; font-weight:650; margin-top:9px; }
.dist-row { margin:15px 0; }
.dist-top { display:flex; justify-content:space-between; gap:12px; font-size:12px; }
.dist-top span:first-child { color:var(--text-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dist-top strong { color:var(--text-main); font-weight:650; }
.dist-track { margin-top:7px; height:14px; display:flex; gap:3px; transform:skewX(-18deg); }
.dist-seg { flex:1; background:var(--surface-raised); border:1px solid var(--border-strong); }
.dist-seg.on { background:linear-gradient(180deg,var(--accent),var(--accent)); box-shadow:0 0 6px color-mix(in srgb, var(--accent) 14.0%, transparent); }
.context-alert { margin-top:18px; border:1px solid rgba(255,176,32,.30); background:rgba(255,176,32,.065); border-radius:12px; padding:13px; display:flex; gap:10px; align-items:flex-start; }
.context-alert .alert-icon { color:var(--amber); font-size:20px; margin-top:1px; }
.context-alert strong { display:block; color:#FFD78C; font-size:11px; line-height:1.35; }
.context-alert span { display:block; color:#C7AF80; font-size:11px; margin-top:4px; line-height:1.5; }

.kpi-strip { grid-column:1/-1; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
.kpi-card { padding:16px; min-height:106px; box-shadow:var(--shadow-card); }
.kpi-label { color:var(--text-secondary); font-size:10px; line-height:1.3; font-weight:600; text-transform:uppercase; letter-spacing:.07em; }
.kpi-value { font-size:32px; line-height:1.05; font-weight:700; margin-top:9px; }
.kpi-foot { color:var(--text-muted); font-size:10px; margin-top:6px; }

.attention-grid { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.attention-panel { min-height:168px; }
.attention-list { display:grid; gap:8px; }
.attention-item { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid color-mix(in srgb, var(--bg-main) 55.0%, transparent); }
.attention-item:last-child { border-bottom:0; }
.attention-item strong { display:block; font-size:12px; line-height:1.35; }
.attention-item span { display:block; color:var(--text-secondary); font-size:10px; margin-top:3px; line-height:1.4; }
.attention-value { flex:0 0 auto; color:var(--amber); font-size:11px; font-weight:650; }

.chart-grid { grid-column:1/-1; display:grid; grid-template-columns:1.25fr .75fr; gap:16px; }
.chart-box { min-height:292px; }
.chart-box svg { width:100%; height:216px; overflow:visible; }
.chart-legend { display:flex; flex-wrap:wrap; gap:14px; color:var(--text-secondary); font-size:10px; align-items:center; }
.legend-dot { width:8px; height:8px; border-radius:50%; display:inline-block; margin-right:5px; }

/* PROCESS CARDS */
.process-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; align-items:start; }
.process-card {
  min-height:0; padding:18px; background:linear-gradient(180deg,var(--surface),var(--surface));
  border:1px solid var(--border); border-radius:var(--radius-lg); position:relative; overflow:hidden; box-shadow:var(--shadow-card);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.process-card:hover { transform:translateY(-2px); border-color:var(--border-strong); }
.process-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--cyan); opacity:.72; }
.process-card.attention::before { background:var(--amber); }
.process-card.critical { border-color:rgba(255,77,90,.52); box-shadow:var(--glow-red),var(--shadow-card); }
.process-card.critical::before { width:4px; background:var(--red); box-shadow:0 0 11px rgba(255,77,90,.38); }
.process-card-head { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.process-name { font-size:15px; line-height:1.3; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.process-score { font-size:32px; line-height:1; font-weight:700; margin:14px 0 5px; }
.score-label { color:var(--text-secondary); font-size:10px; text-transform:uppercase; letter-spacing:.07em; }
.health-bar { height:6px; border-radius:999px; background:var(--surface-raised); overflow:hidden; margin:11px 0 14px; }
.health-bar>span { display:block; height:100%; background:linear-gradient(90deg,var(--blue),var(--cyan)); box-shadow:0 0 8px color-mix(in srgb, var(--accent) 18.0%, transparent); }
.process-card.attention .health-bar>span { background:linear-gradient(90deg,#D48F10,var(--amber)); box-shadow:none; }
.process-card.critical .health-bar>span { background:linear-gradient(90deg,#B92D3B,var(--red)); box-shadow:0 0 8px rgba(255,77,90,.16); }
.issue-list { display:grid; gap:7px; font-size:12px; }
.issue-line { display:flex; align-items:center; gap:8px; color:var(--text-soft); min-height:20px; }
.issue-line .icon { font-size:15px; color:var(--text-secondary); }
.issue-line.danger { color:#FFC6CB; font-weight:600; }
.issue-line.warn { color:#FFDE9E; }
.issue-line.good { color:#BDF5D7; }
.process-owners { margin-top:14px; padding-top:11px; border-top:1px solid color-mix(in srgb, var(--bg-main) 64.0%, transparent); color:var(--text-secondary); font-size:11px; line-height:1.6; }
.process-owners strong { color:var(--text-soft); font-weight:600; }
.process-footer { margin-top:11px; display:flex; justify-content:space-between; align-items:center; gap:10px; }
.last-check { color:var(--text-muted); font-size:10px; }
.link-btn { min-height:36px; border:0; background:transparent; color:var(--cyan); font-weight:650; font-size:11px; padding:5px 2px; display:inline-flex; align-items:center; gap:5px; }
.link-btn:hover { color:var(--text-soft); }

/* PROCESS DETAIL */
.detail-hero { padding:20px; display:grid; grid-template-columns:1fr auto; gap:18px; }
.detail-title-row { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.detail-title-row h2 { margin:0; font-size:22px; line-height:1.25; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.detail-score { font-size:44px; line-height:1; font-weight:700; margin-top:14px; }
.detail-meta { display:flex; flex-wrap:wrap; gap:10px 18px; color:var(--text-secondary); font-size:11px; margin-top:10px; }
.detail-meta strong { color:var(--text-soft); font-weight:600; }
.detail-actions { display:flex; flex-wrap:wrap; gap:8px; align-content:flex-start; justify-content:flex-end; }
.tabs { display:flex; overflow:auto; gap:3px; border-bottom:1px solid var(--border); margin:16px 0; scrollbar-width:none; }
.tabs::-webkit-scrollbar { display:none; }
.tab { flex:0 0 auto; border:0; background:transparent; color:var(--text-secondary); min-height:44px; padding:0 14px; font-size:11px; font-weight:650; white-space:nowrap; border-bottom:2px solid transparent; }
.tab:hover { color:var(--text-main); background:color-mix(in srgb, var(--accent) 3.5%, transparent); }
.tab.active { color:var(--cyan); border-bottom-color:var(--cyan); }
.problem-summary { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin-bottom:16px; }
.summary-card { padding:14px; box-shadow:var(--shadow-card); }
.summary-card strong { font-size:25px; line-height:1; font-weight:700; display:block; }
.summary-card span { color:var(--text-secondary); font-size:10px; line-height:1.35; text-transform:uppercase; letter-spacing:.05em; display:block; margin-top:7px; }
.indicator-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.indicator-card { padding:16px; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); box-shadow:var(--shadow-card); }
.indicator-top { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.indicator-name { font-weight:650; font-size:14px; line-height:1.4; }
.indicator-meta { color:var(--text-secondary); font-size:11px; margin-top:9px; line-height:1.6; }

/* CONFERENCES */
.process-picker { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.pick-card { min-height:100px; padding:16px; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); text-align:left; color:var(--text-main); box-shadow:var(--shadow-card); transition:.18s ease; }
.pick-card:hover { border-color:var(--border-active); transform:translateY(-1px); }
.pick-card strong { display:block; font-size:14px; line-height:1.35; font-weight:650; }
.pick-card span { color:var(--text-secondary); font-size:11px; display:block; margin-top:7px; line-height:1.45; }
.conference-shell { max-width:760px; margin:0 auto; }
.progress-head { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:10px; }
.progress-head h2 { font-size:20px; line-height:1.25; font-weight:700; }
.progress-head>strong { font-size:12px; color:var(--text-soft); }
.progress-bar { height:6px; border-radius:999px; background:var(--surface-raised); overflow:hidden; }
.progress-fill { height:100%; background:linear-gradient(90deg,var(--blue),var(--cyan)); transition:width .2s ease; box-shadow:0 0 8px color-mix(in srgb, var(--accent) 18.0%, transparent); }
.conference-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0; }
.check-list { display:grid; gap:10px; }
.check-item { border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); padding:16px; box-shadow:var(--shadow-card); }
.check-item-top { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.check-item-title { font-size:14px; line-height:1.4; font-weight:650; }
.check-actions { display:flex; gap:8px; margin-top:13px; }
.check-actions .btn { flex:1; min-height:44px; }
.check-status { color:var(--text-secondary); font-size:11px; margin-top:5px; }
.sticky-finalize { position:sticky; bottom:12px; margin-top:18px; z-index:5; padding:8px; border:1px solid color-mix(in srgb, var(--bg-main) 68.0%, transparent); background:color-mix(in srgb, var(--bg-main) 88.0%, transparent); backdrop-filter:blur(12px); border-radius:14px; }

/* DIVERGENCES */
.list-stack { display:grid; gap:10px; }
.div-card { padding:16px; display:grid; grid-template-columns:1fr auto; gap:14px; box-shadow:var(--shadow-card); }
.div-title { font-weight:700; font-size:14px; line-height:1.35; }
.div-sub { color:var(--text-secondary); font-size:11px; margin-top:5px; line-height:1.45; }
.div-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.div-actions { display:flex; flex-wrap:wrap; gap:7px; justify-content:flex-end; align-content:flex-start; }
.div-actions .btn:first-child { border-color:var(--accent); color:var(--text-main); background:var(--surface-raised); }

/* HISTORY */
.timeline { position:relative; margin-left:10px; padding-left:28px; display:grid; gap:16px; }
.timeline::before { content:""; position:absolute; left:5px; top:8px; bottom:8px; width:1px; background:var(--border-strong); }
.timeline-item { position:relative; padding:2px 0 2px 4px; }
.timeline-marker { width:22px; height:22px; position:absolute; left:-33px; top:1px; display:grid; place-items:center; border-radius:50%; background:var(--surface-raised); border:1px solid var(--border-strong); color:var(--cyan); box-shadow:0 0 8px color-mix(in srgb, var(--accent) 10.0%, transparent); }
.timeline-marker .icon { font-size:12px; }
.timeline-date { color:var(--text-muted); font-size:10px; line-height:1.3; font-weight:550; }
.timeline-title { font-size:13px; line-height:1.4; font-weight:650; margin-top:3px; }
.timeline-text { color:var(--text-secondary); font-size:11px; line-height:1.5; margin-top:4px; }

/* REPORTS */
.report-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.report-card { padding:18px; min-height:180px; display:flex; flex-direction:column; box-shadow:var(--shadow-card); }
.report-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background:color-mix(in srgb, var(--accent) 6.5%, transparent); border:1px solid color-mix(in srgb, var(--accent) 16.0%, transparent); color:var(--cyan); margin-bottom:14px; font-size:21px; }
.report-card h3 { margin:0 0 7px; font-size:15px; line-height:1.35; font-weight:650; }
.report-card p { color:var(--text-secondary); font-size:11px; line-height:1.55; margin:0 0 16px; flex:1; }
.report-card .btn { align-self:flex-start; }

/* SETTINGS */
.settings-layout { max-width:1100px; }
.settings-section { margin-bottom:24px; }
.settings-section-title { display:flex; align-items:center; gap:8px; margin:0 0 10px; font-size:13px; color:var(--text-soft); text-transform:uppercase; letter-spacing:.07em; }
.settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.settings-list { display:grid; gap:8px; }
.settings-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:11px 0; border-bottom:1px solid color-mix(in srgb, var(--bg-main) 58.0%, transparent); }
.settings-row:last-child { border-bottom:0; }
.settings-row strong { font-size:12px; font-weight:650; }
.settings-row span { color:var(--text-secondary); font-size:11px; }

/* FORMS / MODALS */
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.field.full { grid-column:1/-1; }
.form-section { grid-column:1/-1; border-top:1px solid color-mix(in srgb, var(--bg-main) 62.0%, transparent); padding-top:16px; margin-top:2px; }
.form-section:first-child { border-top:0; padding-top:0; }
.form-section-title { margin:0 0 10px; font-size:13px; font-weight:650; color:var(--text-main); }
.dynamic-fields { border:1px solid var(--border); border-radius:var(--radius-md); padding:14px; background:color-mix(in srgb, var(--bg-main) 35.0%, transparent); animation:fieldReveal .2s ease; }
.dynamic-fields .page-kicker { margin-bottom:10px; }
.severity-segments { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.severity-option { min-height:44px; border:1px solid var(--border); background:var(--surface-input); color:var(--text-secondary); border-radius:10px; font-size:11px; font-weight:650; }
.severity-option:hover { border-color:var(--border-active); color:var(--text-main); }
.severity-option.active[data-value="leve"] { border-color:rgba(53,208,127,.44); background:rgba(53,208,127,.09); color:var(--text-soft); }
.severity-option.active[data-value="media"] { border-color:rgba(255,176,32,.45); background:rgba(255,176,32,.09); color:#FFE0A0; }
.severity-option.active[data-value="grave"] { border-color:rgba(255,77,90,.45); background:rgba(255,77,90,.09); color:#FFD2D6; }
.evidence-input { position:relative; border:1px dashed var(--border-strong); border-radius:12px; background:color-mix(in srgb, var(--accent) 2.5%, transparent); padding:14px; }
.evidence-input input[type="file"] { position:absolute; inset:0; opacity:0; cursor:pointer; }
.evidence-content { display:flex; align-items:center; gap:11px; pointer-events:none; }
.evidence-icon { width:38px; height:38px; border-radius:10px; display:grid; place-items:center; background:color-mix(in srgb, var(--accent) 7.0%, transparent); color:var(--cyan); font-size:19px; }
.evidence-content strong { display:block; font-size:12px; }
.evidence-content span { display:block; color:var(--text-secondary); font-size:10px; margin-top:2px; }
.evidence-preview { margin-top:10px; display:none; align-items:center; gap:10px; color:var(--text-secondary); font-size:11px; }
.evidence-preview.visible { display:flex; }
.evidence-preview img { width:54px; height:54px; object-fit:cover; border-radius:9px; border:1px solid var(--border); }
@keyframes fieldReveal { from{opacity:0; transform:translateY(4px)} to{opacity:1;transform:none} }

.modal-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.70); backdrop-filter:blur(8px); display:grid; place-items:center; padding:18px; z-index:100; animation:backdropIn .18s ease; }
.modal { width:min(620px,100%); max-height:90vh; overflow:auto; background:var(--surface); border:1px solid var(--border-strong); border-radius:var(--radius-lg); box-shadow:var(--shadow-modal); animation:modalIn .2s ease; }
.modal.modal-wide { width:min(720px,100%); }
.modal.modal-small { width:min(460px,100%); }
.modal-head { position:sticky; top:0; z-index:2; background:color-mix(in srgb, var(--bg-main) 97.0%, transparent); backdrop-filter:blur(12px); display:flex; justify-content:space-between; gap:12px; align-items:flex-start; padding:18px 20px; border-bottom:1px solid var(--border); }
.modal-head h3 { margin:0; font-size:17px; line-height:1.3; font-weight:700; }
.modal-head p { margin:5px 0 0; color:var(--text-secondary); font-size:11px; line-height:1.45; }
.modal-body { padding:20px; }
.modal-footer { padding:12px 20px 20px; display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.close-btn { width:40px; height:40px; display:grid; place-items:center; border:0; border-radius:10px; background:transparent; color:var(--text-secondary); font-size:19px; }
.close-btn:hover { color:var(--text-main); background:color-mix(in srgb, var(--accent) 5.0%, transparent); }
.sheet-menu { display:grid; gap:6px; }
.sheet-menu button { width:100%; min-height:48px; justify-content:flex-start; }
@keyframes backdropIn { from{opacity:0} to{opacity:1} }
@keyframes modalIn { from{opacity:0;transform:translateY(8px) scale(.99)} to{opacity:1;transform:none} }

/* MOBILE NAV / FAB */
.mobile-nav { display:none; }
.fab { display:none; }
.empty-state { display:grid; padding:36px 18px; text-align:center; border:1px dashed var(--border); border-radius:var(--radius-md); color:var(--text-secondary); min-height:150px; place-items:center; }
.empty-state .empty-icon { width:42px; height:42px; display:grid; place-items:center; margin:0 auto 10px; border-radius:50%; background:color-mix(in srgb, var(--accent) 5.0%, transparent); color:var(--text-muted); font-size:21px; }
.empty-state strong { color:var(--text-main); display:block; margin-bottom:5px; font-size:15px; }
.empty-state span { display:block; font-size:12px; }

/* TOASTS */
.toast-wrap { position:fixed; right:18px; bottom:18px; z-index:200; display:grid; gap:8px; }
.toast { min-width:280px; max-width:380px; border:1px solid var(--border-strong); background:var(--surface-raised); color:var(--text-main); border-radius:12px; padding:12px 14px; box-shadow:var(--shadow-panel); font-size:12px; line-height:1.4; animation:toastIn .2s ease; display:flex; align-items:flex-start; gap:9px; }
.toast-icon { margin-top:1px; font-size:17px; }
.toast.success { border-color:rgba(53,208,127,.38); }
.toast.success .toast-icon { color:var(--green); }
.toast.warn { border-color:rgba(255,176,32,.42); }
.toast.warn .toast-icon { color:var(--amber); }
.toast.danger { border-color:rgba(255,77,90,.48); }
.toast.danger .toast-icon { color:var(--red); }
@keyframes toastIn { from{transform:translateY(8px);opacity:0} to{transform:none;opacity:1} }

/* SKELETON */
.skeleton { background:linear-gradient(90deg,var(--surface-raised) 25%,var(--surface-raised) 50%,var(--surface-raised) 75%); background-size:200% 100%; animation:skeleton 1.4s infinite; border-radius:8px; }
@keyframes skeleton { to{background-position:-200% 0} }

/* DESKTOP GRANDE >= 1440 */
@media (min-width:1440px) {
  .content { padding-left:32px; padding-right:32px; }
  .dashboard-grid { gap:18px; }
  .process-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}

/* DESKTOP 1200–1439 */
@media (min-width:1200px) and (max-width:1439px) {
  .content { padding-left:24px; padding-right:24px; }
  .process-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* NOTEBOOK / TABLET HORIZONTAL 900–1199 */
@media (min-width:900px) and (max-width:1199px) {
  :root { --sidebar-collapsed:84px; }
  .content { padding:20px 20px 96px; }
  .dashboard-grid { grid-template-columns:1fr; gap:14px; }
  .instrument-zone, .distribution-panel { min-height:auto; }
  .gauge-cluster { min-height:352px; grid-template-columns:minmax(140px,160px) minmax(330px,400px) minmax(140px,160px); gap:0 6px; }
  .gauge-wrap { min-height:330px; }
  .gauge-wrap svg { width:min(100%,400px); }
  .mini-gauge-shell { max-width:158px; }
  .chart-grid { grid-template-columns:1fr 1fr; gap:12px; }
  .kpi-strip { grid-template-columns:repeat(3,1fr); }
  .attention-grid { grid-template-columns:repeat(3,1fr); }
  .process-grid, .process-picker { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .problem-summary { grid-template-columns:repeat(3,1fr); }
  .topbar { padding:0 20px; }
}

/* TABLET + MOBILE <= 899 */
@media (max-width:899px) {
  :root { --topbar-h:56px; --control-h:44px; }
  .app-shell { display:block; }
  .sidebar { display:none; }
  .topbar { min-height:56px; padding:0 16px; }
  .topbar-menu { display:none; }
  .clock-box, .user-meta, #logout { display:none; }
  .user-chip { padding:4px; border:0; background:transparent; }
  .content { padding:18px 16px calc(92px + env(safe-area-inset-bottom)); }
  .mobile-nav {
    position:fixed; left:0; right:0; bottom:0; min-height:64px; display:grid; grid-template-columns:repeat(5,1fr);
    background:color-mix(in srgb, var(--bg-main) 97.0%, transparent); border-top:1px solid var(--border); backdrop-filter:blur(18px); z-index:50;
    padding:5px max(6px,env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));
  }
  .mobile-nav button { position:relative; border:0; background:transparent; color:var(--text-secondary); min-height:56px; display:grid; place-items:center; align-content:center; gap:3px; font-size:10px; line-height:1.1; border-radius:10px; }
  .mobile-nav button.active { color:var(--cyan); background:color-mix(in srgb, var(--accent) 5.5%, transparent); }
  .mobile-nav button.active::before { content:""; position:absolute; top:0; left:30%; right:30%; height:2px; background:var(--cyan); box-shadow:0 0 7px color-mix(in srgb, var(--accent) 38.0%, transparent); border-radius:0 0 3px 3px; }
  .mobile-nav .nav-icon { font-size:21px; }
  .fab { place-items:center; position:fixed; right:16px; bottom:calc(78px + env(safe-area-inset-bottom)); width:50px; height:50px; border-radius:50%; border:1px solid var(--accent); background:linear-gradient(180deg,var(--border-strong),var(--surface-raised)); color:white; box-shadow:0 0 18px color-mix(in srgb, var(--accent) 18.0%, transparent); z-index:40; font-size:23px; }
  .fab:not([hidden]) { display:grid; }

  .page-title { font-size:17px; }
  .page-toolbar { flex-direction:column; margin-bottom:16px; }
  .page-intro h2 { font-size:20px; }
  .page-toolbar>.btn { width:100%; min-height:var(--control-h-mobile); }

  .mobile-filter-controls { display:flex; }
  .filters-panel { display:none; }
  .filters-panel.is-open { display:flex; animation:fieldReveal .18s ease; }
  .filters { width:100%; gap:8px; }
  .filter-input { min-height:var(--control-h-mobile); min-width:0; flex:1 1 100%; font-size:13px; }
  .segmented { width:100%; }
  .segmented button { flex:1; min-height:44px; }

  .dashboard-grid { grid-template-columns:1fr; gap:12px; }
  .dashboard-toolbar { align-items:stretch; }
  .dashboard-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .dashboard-actions .btn { min-height:var(--control-h-mobile); }
  .rhythm-row { grid-template-columns:1fr; gap:8px; }
  .rhythm-track { height:18px; }
  .rhythm-value { text-align:left; font-size:20px; }
  .instrument-zone { min-height:auto; }
  .instrument-cluster-body { padding-top:4px; }
  .gauge-cluster { min-height:0; grid-template-columns:1fr 1fr; grid-template-rows:auto auto auto; grid-template-areas:"main main" "left right" "caption-left caption-right"; gap:6px 10px; padding:0; }
  .gauge-cluster::before { left:6%; right:6%; bottom:27px; height:64px; opacity:.72; }
  .gauge-cluster::after { bottom:38px; }
  .main-gauge-shell { grid-area:main; width:min(100%,320px); }
  .gauge-wrap { min-height:315px; }
  .gauge-wrap svg { width:min(100%,320px); }
  .gauge-number strong { font-size:39px; }
  .mini-gauge-left { grid-area:left; margin:0; }
  .mini-gauge-right { grid-area:right; margin:0; }
  .mini-gauge-shell { width:min(100%,150px); max-width:150px; }
  .mini-gauge-readout strong { font-size:25px; }
  .mini-gauge-readout span { font-size:8px; }
  .mini-gauge-readout em { font-size:9px; }
  .cluster-caption-left { grid-area:caption-left; }
  .cluster-caption-right { grid-area:caption-right; }
  .distribution-panel { min-height:auto; }
  .chart-grid { grid-template-columns:1fr; }
  .chart-box { min-height:270px; }
  .chart-box svg { height:200px; }
  .kpi-strip { grid-template-columns:repeat(2,1fr); gap:8px; }
  .kpi-card { min-height:94px; padding:14px; }
  .kpi-value { font-size:28px; }
  .attention-grid { grid-template-columns:1fr; }

  .process-grid, .process-picker { grid-template-columns:1fr; }
  .process-card { min-height:auto; padding:16px; }
  .process-score { font-size:28px; }
  .process-footer { align-items:flex-end; }

  .detail-hero { grid-template-columns:1fr; padding:16px; }
  .detail-actions { justify-content:flex-start; display:grid; grid-template-columns:1fr 1fr; }
  .detail-actions .btn:first-child { grid-column:1/-1; }
  .detail-score { font-size:38px; }
  .tabs { position:sticky; top:56px; z-index:8; background:color-mix(in srgb, var(--bg-main) 94.0%, transparent); backdrop-filter:blur(12px); margin-left:-16px; margin-right:-16px; padding:0 16px; }
  .problem-summary { grid-template-columns:repeat(2,1fr); }
  .indicator-grid { grid-template-columns:1fr; }

  .conference-actions { grid-template-columns:1fr; }
  .check-item { padding:15px; }
  .check-actions { flex-direction:row; }
  .check-actions .btn { min-height:var(--control-h-mobile); }
  .sticky-finalize { bottom:calc(72px + env(safe-area-inset-bottom)); }

  .div-card { grid-template-columns:1fr; }
  .div-actions { justify-content:flex-start; }
  .div-actions .btn { min-height:42px; }
  .report-grid, .settings-grid { grid-template-columns:1fr; }
  .form-grid { grid-template-columns:1fr; }
  .field.full, .form-section { grid-column:auto; }
  .input, .select, .textarea { min-height:var(--control-h-mobile); font-size:14px; }

  .modal-backdrop { place-items:end center; padding:0; }
  .modal { width:100%; max-height:90vh; border-radius:var(--radius-sheet) var(--radius-sheet) 0 0; border-bottom:0; animation:sheetIn .22s ease; }
  .modal.modal-small, .modal.modal-wide { width:100%; }
  .modal-head { padding:16px; }
  .modal-body { padding:16px; }
  .modal-footer { padding:10px 16px calc(16px + env(safe-area-inset-bottom)); }
  .modal-footer .btn { min-height:var(--control-h-mobile); }
  @keyframes sheetIn { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:none} }

  .toast-wrap { left:16px; right:16px; bottom:calc(78px + env(safe-area-inset-bottom)); }
  .toast { min-width:0; max-width:none; width:100%; }
}

/* MOBILE GRANDE 480–599 */
@media (min-width:480px) and (max-width:599px) {
  .content { padding-left:16px; padding-right:16px; }
  .gauge-wrap { min-height:310px; }
}

/* MOBILE COMPACTO < 480 */
@media (max-width:479px) {
  .content { padding-left:14px; padding-right:14px; }
  .topbar { padding:0 14px; }
  .page-title { font-size:16px; }
  .page-intro h2 { font-size:19px; }
  .panel-head { padding:16px 14px 9px; }
  .panel-body { padding:11px 14px 16px; }
  .dashboard-actions { grid-template-columns:1fr; }
  .main-gauge-shell { width:min(100%,292px); }
  .gauge-wrap { min-height:280px; }
  .gauge-wrap svg { width:min(100%,292px); }
  .gauge-number { top:45.5%; }
  .gauge-number strong { font-size:37px; }
  .mini-gauge-shell { width:min(100%,136px); max-width:136px; }
  .mini-gauge-readout strong { font-size:23px; }
  .cluster-caption { font-size:8px; letter-spacing:.045em; }
  .kpi-strip { gap:8px; }
  .kpi-card { min-height:92px; }
  .kpi-value { font-size:26px; }
  .problem-summary { grid-template-columns:1fr 1fr; }
  .summary-card strong { font-size:22px; }
  .detail-actions { grid-template-columns:1fr; }
  .detail-actions .btn:first-child { grid-column:auto; }
  .process-footer { align-items:flex-start; flex-direction:column; }
  .link-btn { min-height:40px; }
  .check-actions { flex-direction:column; }
  .severity-segments { grid-template-columns:1fr; }
  .modal-footer { display:grid; grid-template-columns:1fr; }
  .modal-footer .btn { width:100%; }
  .user-chip { display:none; }
}

@media (max-width:340px) {
  .gauge-cluster { grid-template-columns:1fr; grid-template-rows:auto auto auto auto auto; grid-template-areas:"main" "left" "caption-left" "right" "caption-right"; gap:4px; }
  .gauge-cluster::before, .gauge-cluster::after { display:none; }
  .mini-gauge-shell { width:148px; max-width:148px; }
  .cluster-caption { margin-bottom:3px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}

/* Utilitários de acessibilidade e controles visuais v0.2 */
.visually-hidden { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.evidence-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.evidence-actions .btn { position:relative; z-index:2; }
.detail-data-grid { display:grid; gap:10px; font-size:12px; }
.detail-data-row { display:grid; grid-template-columns:140px minmax(0,1fr); gap:12px; padding:9px 0; border-bottom:1px solid color-mix(in srgb, var(--bg-main) 52.0%, transparent); }
.detail-data-row:last-child { border-bottom:0; }
.detail-data-row span:first-child { color:var(--text-secondary); }
.detail-json { white-space:pre-wrap; background:var(--surface); padding:12px; border-radius:10px; color:var(--text-soft); border:1px solid color-mix(in srgb, var(--bg-main) 65.0%, transparent); overflow:auto; font-size:11px; }
@media (max-width:479px){ .detail-data-row { grid-template-columns:1fr; gap:3px; } }

/* =========================================================
   VISÃO SF v0.2.2 — CLUSTER INTEGRADO DE 3 VELOCÍMETROS
   Alteração visual localizada no bloco Saúde dos Processos.
   ========================================================= */
.instrument-zone {
  padding:0;
  min-height:0;
  overflow:hidden;
  background:var(--surface);
  border-color:color-mix(in srgb, var(--accent) 72.0%, transparent);
  box-shadow:0 16px 34px rgba(0,0,0,.24), inset 0 0 34px color-mix(in srgb, var(--accent) 1.8%, transparent);
}
.instrument-cluster-desktop { display:block; width:100%; }
.instrument-cluster-mobile { display:none; }
.instrument-cluster-svg {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  shape-rendering:geometricPrecision;
  text-rendering:geometricPrecision;
}
.instrument-cluster-svg text { font-family:inherit; }
.instrument-cluster-svg .cluster-main-gauge,
.instrument-cluster-svg .cluster-mini-gauge { transform-box:fill-box; transform-origin:center; }
@media (min-width:900px) and (max-width:1199px) {
  .instrument-cluster-svg { aspect-ratio:3/2; }
}

@media (max-width:899px) {
  .instrument-cluster-desktop { display:none; }
  .instrument-cluster-mobile { display:block; }
  .instrument-zone { padding:0; }
  .instrument-mobile-head {
    position:relative;
    border-bottom:1px solid color-mix(in srgb, var(--bg-main) 42.0%, transparent);
    background:linear-gradient(180deg,color-mix(in srgb, var(--bg-main) 86.0%, transparent),color-mix(in srgb, var(--bg-main) 34.0%, transparent));
  }
  .instrument-mobile-head::before {
    content:"";
    width:3px;
    align-self:stretch;
    min-height:42px;
    border-radius:999px;
    background:var(--cyan);
    box-shadow:0 0 12px color-mix(in srgb, var(--accent) 35.0%, transparent);
    margin-right:10px;
  }
  .instrument-mobile-head>div:first-child { margin-right:auto; }
  .instrument-cluster-mobile .panel-title { text-transform:uppercase; letter-spacing:.04em; }
  .instrument-cluster-mobile .gauge-cluster {
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto auto;
    grid-template-areas:"main main" "left right";
    gap:8px 12px;
    padding:0 0 2px;
  }
  .instrument-cluster-mobile .main-gauge-shell { grid-area:main; }
  .instrument-cluster-mobile .mini-gauge-left { grid-area:left; }
  .instrument-cluster-mobile .mini-gauge-right { grid-area:right; }
  .instrument-cluster-mobile .gauge-cluster::before {
    left:7%; right:7%; bottom:36px; height:70px;
    clip-path:polygon(0 42%,8% 0,31% 0,36% 20%,64% 20%,69% 0,92% 0,100% 42%,100% 100%,0 100%);
    opacity:.78;
  }
  .instrument-cluster-mobile .gauge-cluster::after { bottom:48px; }
  .instrument-cluster-mobile .gauge-number span { font-size:11px; letter-spacing:.14em; }
  .instrument-cluster-mobile .gauge-status { font-size:11px; }
  .instrument-cluster-mobile .mini-gauge-readout span { font-size:9px; }
  .instrument-cluster-mobile .mini-gauge-readout small { font-size:9px; }
}

@media (max-width:479px) {
  .instrument-cluster-mobile .panel-head { padding:15px 14px 10px; }
  .instrument-cluster-mobile .panel-sub { font-size:11px; }
  .instrument-cluster-mobile .gauge-cluster { gap:7px 8px; }
}

@media (max-width:359px) {
  .instrument-cluster-mobile .gauge-cluster {
    grid-template-columns:1fr;
    grid-template-rows:auto auto auto;
    grid-template-areas:"main" "left" "right";
    gap:4px;
  }
  .instrument-cluster-mobile .gauge-cluster::before,
  .instrument-cluster-mobile .gauge-cluster::after { display:none; }
  .instrument-cluster-mobile .mini-gauge-shell { width:148px; max-width:148px; }
}

/* Ajuste óptico mobile: mantém números livres dos pivôs/ponteiros. */
@media (max-width:899px) {
  .instrument-cluster-mobile .gauge-number { top:35%; }
  .instrument-cluster-mobile .gauge-number strong { display:block; }
  .instrument-cluster-mobile .gauge-number span { margin-top:34px; }
  .instrument-cluster-mobile .gauge-status { margin-top:7px; }
  .instrument-cluster-mobile .mini-gauge-readout {
    justify-content:flex-start;
    padding-top:29%;
  }
  .instrument-cluster-mobile .mini-gauge-readout span { margin-top:24px; }
  .instrument-cluster-mobile .mini-gauge-readout em { margin-top:3px; }
  .instrument-cluster-mobile .mini-gauge-readout small { margin-top:3px; }
}
@media (max-width:479px) {
  .instrument-cluster-mobile .gauge-number { top:34%; }
  .instrument-cluster-mobile .gauge-number span { margin-top:31px; }
  .instrument-cluster-mobile .mini-gauge-readout { padding-top:28%; }
  .instrument-cluster-mobile .mini-gauge-readout span { margin-top:21px; }
}

/* Posicionamento explícito dos textos dos gauges no mobile. */
@media (max-width:899px) {
  .instrument-cluster-mobile .gauge-number {
    inset:0;
    top:0;
    left:0;
    width:100%;
    height:100%;
    transform:none;
  }
  .instrument-cluster-mobile .gauge-number strong,
  .instrument-cluster-mobile .gauge-number span,
  .instrument-cluster-mobile .gauge-status {
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    width:max-content;
    margin:0;
  }
  .instrument-cluster-mobile .gauge-number strong { top:27%; }
  .instrument-cluster-mobile .gauge-number span { top:57%; }
  .instrument-cluster-mobile .gauge-status { top:66%; }

  .instrument-cluster-mobile .mini-gauge-readout {
    display:block;
    inset:0;
    padding:0;
  }
  .instrument-cluster-mobile .mini-gauge-readout strong,
  .instrument-cluster-mobile .mini-gauge-readout span,
  .instrument-cluster-mobile .mini-gauge-readout em,
  .instrument-cluster-mobile .mini-gauge-readout small {
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    width:max-content;
    margin:0;
    text-align:center;
  }
  .instrument-cluster-mobile .mini-gauge-readout strong { top:27%; }
  .instrument-cluster-mobile .mini-gauge-readout span { top:57%; }
  .instrument-cluster-mobile .mini-gauge-readout em { top:70%; }
  .instrument-cluster-mobile .mini-gauge-readout small { top:81%; }
}

/* =========================================================
   VISÃO SF v0.2.3 — REFINAMENTO DO DASHBOARD
   Hierarquia, legibilidade, densidade e acabamento visual.
   Escopo deliberadamente restrito ao Dashboard.
   ========================================================= */

/* Hierarquia geral: cluster dominante, situação por processo secundária. */
.dashboard-grid {
  grid-template-columns:minmax(0,1.82fr) minmax(300px,.88fr);
  gap:14px;
  align-items:stretch;
}
.dashboard-toolbar { margin-bottom:10px; }
.dashboard-grid .panel-title {
  font-size:15px;
  line-height:1.3;
  font-weight:680;
  letter-spacing:.045em;
}
.dashboard-grid .panel-sub {
  color:var(--text-secondary);
  font-size:11.5px;
  line-height:1.45;
}
.dashboard-grid > .panel:not(.instrument-zone) {
  border-color:color-mix(in srgb, var(--bg-main) 72.0%, transparent);
  box-shadow:0 8px 22px rgba(0,0,0,.19);
}

/* Cluster: ocupa melhor o painel sem perder a composição aprovada. */
.instrument-zone {
  background:
    radial-gradient(circle at 50% 43%,color-mix(in srgb, var(--accent) 4.2%, transparent),transparent 37%),
    linear-gradient(180deg,var(--surface) 0%,var(--surface) 100%);
  box-shadow:0 14px 30px rgba(0,0,0,.23), inset 0 0 42px color-mix(in srgb, var(--accent) 1.8%, transparent);
}
.instrument-cluster-svg {
  aspect-ratio:1536/842;
}

/* Situação por processo: informação importante, porém deliberadamente secundária ao cluster. */
.distribution-panel {
  min-height:0;
  background:linear-gradient(180deg,color-mix(in srgb, var(--bg-main) 91.0%, transparent),color-mix(in srgb, var(--bg-main) 93.0%, transparent));
}
.distribution-panel .panel-head { padding:16px 18px 7px; }
.distribution-panel .panel-body { padding:8px 18px 16px; }
.distribution-panel .big-metric { font-size:38px; letter-spacing:-.035em; }
.distribution-panel .big-metric-sub { color:var(--text-secondary); font-size:10.5px; margin-top:5px; }
.distribution-panel .delta { font-size:11.5px; margin-top:8px; }
.distribution-panel .dist-row { margin:11px 0; }
.distribution-panel .dist-top {
  display:grid;
  grid-template-columns:minmax(0,1fr) 48px;
  align-items:center;
  gap:10px;
  font-size:11.5px;
}
.distribution-panel .dist-top span:first-child { color:var(--text-soft); }
.distribution-panel .dist-top strong { text-align:right; font-variant-numeric:tabular-nums; }
.distribution-panel .dist-track { margin-top:6px; height:12px; gap:3px; }
.distribution-panel .context-alert { margin-top:13px; padding:11px 12px; border-color:rgba(255,176,32,.27); }
.distribution-panel .context-alert strong { font-size:11px; }
.distribution-panel .context-alert span { font-size:10.5px; line-height:1.45; }

/* Ritmo Atual: deixa de parecer uma régua decorativa, sem disputar o topo. */
.rhythm-panel {
  padding:8px 16px;
  min-height:50px;
  border-color:color-mix(in srgb, var(--bg-main) 66.0%, transparent) !important;
}
.rhythm-row { grid-template-columns:178px minmax(0,1fr) 74px; gap:14px; }
.rhythm-label strong { font-size:11.5px; }
.rhythm-label span { color:var(--text-secondary); font-size:10.5px; }
.rhythm-track { height:18px; gap:4px; }
.rhythm-seg { border-color:color-mix(in srgb, var(--bg-main) 82.0%, transparent); background:var(--surface-raised); position:relative; }
.rhythm-seg.on { background:linear-gradient(180deg,var(--accent),var(--accent)); box-shadow:0 0 7px color-mix(in srgb, var(--accent) 16.0%, transparent); }
.rhythm-seg.goal { border-color:#FFB020; box-shadow:0 0 9px rgba(255,176,32,.20); }
.rhythm-seg.goal::before {
  content:"";
  position:absolute;
  width:2px;
  top:-4px;
  bottom:-4px;
  left:50%;
  background:#FFB020;
  box-shadow:0 0 7px rgba(255,176,32,.35);
}
.rhythm-value { font-size:24px; font-variant-numeric:tabular-nums; }

/* KPIs: consistentes, compactos e diferenciados apenas pelo dado/ícone. */
.kpi-strip { gap:9px; }
.kpi-card {
  min-height:92px;
  padding:11px 14px 10px;
  background:linear-gradient(180deg,color-mix(in srgb, var(--bg-main) 88.0%, transparent),color-mix(in srgb, var(--bg-main) 92.0%, transparent));
  border-color:color-mix(in srgb, var(--bg-main) 56.0%, transparent) !important;
  box-shadow:0 5px 14px rgba(0,0,0,.15) !important;
}
.kpi-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.kpi-label { color:var(--text-secondary); font-size:10.5px; font-weight:650; }
.kpi-icon {
  width:28px;
  height:28px;
  border-radius:9px;
  display:grid;
  place-items:center;
  color:var(--text-secondary);
  background:color-mix(in srgb, var(--accent) 5.5%, transparent);
  border:1px solid color-mix(in srgb, var(--accent) 10.0%, transparent);
}
.kpi-value { margin-top:6px; font-size:31px; letter-spacing:-.025em; font-variant-numeric:tabular-nums; }
.kpi-foot { color:var(--text-secondary); font-size:10px; margin-top:4px; line-height:1.35; }
.kpi-ok .kpi-value,.kpi-ok .kpi-icon { color:var(--green); }
.kpi-attention .kpi-value,.kpi-attention .kpi-icon { color:var(--amber); }
.kpi-critical .kpi-value,.kpi-critical .kpi-icon { color:var(--red); }
.kpi-info .kpi-value,.kpi-info .kpi-icon { color:var(--cyan); }
.kpi-ok .kpi-icon { background:rgba(53,208,127,.055); border-color:rgba(53,208,127,.14); }
.kpi-attention .kpi-icon { background:rgba(255,176,32,.055); border-color:rgba(255,176,32,.14); }
.kpi-critical .kpi-icon { background:rgba(255,77,90,.055); border-color:rgba(255,77,90,.14); }
.kpi-info .kpi-icon { background:color-mix(in srgb, var(--accent) 5.5%, transparent); border-color:color-mix(in srgb, var(--accent) 14.0%, transparent); }

/* Três blocos de decisão: mesma altura, mesma densidade, leitura em duas linhas. */
.attention-grid { gap:12px; align-items:stretch; }
.attention-panel {
  min-height:178px;
  height:100%;
  background:linear-gradient(180deg,color-mix(in srgb, var(--bg-main) 84.0%, transparent),color-mix(in srgb, var(--bg-main) 91.0%, transparent));
  border-color:color-mix(in srgb, var(--bg-main) 56.0%, transparent) !important;
  box-shadow:0 5px 16px rgba(0,0,0,.15) !important;
}
.attention-panel .panel-head { padding:15px 16px 7px; }
.attention-panel .panel-body { padding:7px 16px 13px; }
.attention-list { gap:0; }
.attention-item {
  min-height:46px;
  padding:8px 0;
  align-items:center;
  border-bottom-color:color-mix(in srgb, var(--bg-main) 42.0%, transparent);
}
.attention-copy { min-width:0; }
.attention-item strong {
  max-width:100%;
  color:var(--text-main);
  font-size:11.5px;
  line-height:1.32;
  font-weight:650;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.attention-item span {
  color:var(--text-secondary);
  font-size:10.5px;
  margin-top:2px;
  line-height:1.32;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.attention-value {
  min-height:24px;
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  padding:4px 7px;
  border-radius:999px;
  font-size:10px;
  white-space:nowrap;
  background:rgba(255,176,32,.055);
  border:1px solid rgba(255,176,32,.12);
}
.attention-value.attention { color:#FFC65B; }
.attention-value.critical { color:#FF7B85; background:rgba(255,77,90,.055); border-color:rgba(255,77,90,.14); }
.dashboard-empty { min-height:104px !important; padding:16px 12px !important; }
.dashboard-empty .empty-icon { width:34px; height:34px; margin-bottom:5px; }
.dashboard-empty strong { font-size:12.5px; margin-bottom:2px; }
.dashboard-empty span { font-size:10.5px; }

/* Gráficos: mais área útil e menos moldura visual. */
.chart-grid { grid-template-columns:1.18fr .82fr; gap:14px; }
.chart-box {
  min-height:332px;
  border-color:color-mix(in srgb, var(--bg-main) 60.0%, transparent) !important;
  box-shadow:0 6px 18px rgba(0,0,0,.16) !important;
}
.chart-box .panel-head { padding:15px 17px 6px; }
.chart-box .panel-body { padding:5px 17px 14px; }
.chart-box svg { height:255px; }
.chart-legend { color:var(--text-secondary); font-size:10.5px; gap:12px; }

/* Sidebar expansível + gráficos responsivos ao espaço real do conteúdo.
   Não altera dados, séries ou estrutura dos gráficos: apenas o reflow visual. */
@container appmain (max-width:1120px) and (min-width:900px) {
  .chart-grid { grid-template-columns:1fr; }
  .chart-box { min-height:320px; }
  .chart-box svg { width:100%; height:clamp(228px,22cqi,255px); }
}
@container appmain (min-width:1121px) {
  .chart-box svg { width:100%; height:clamp(238px,18cqi,265px); }
}

/* Histórico recente: usa a timeline real do sistema em formato mais compacto. */
.dashboard-history {
  grid-column:1/-1;
  border-color:color-mix(in srgb, var(--bg-main) 60.0%, transparent) !important;
  box-shadow:0 6px 18px rgba(0,0,0,.16) !important;
}
.dashboard-history .panel-head { padding:15px 17px 7px; align-items:center; }
.dashboard-history-body { padding:8px 18px 16px; }
.dashboard-history .timeline { margin-left:7px; padding-left:26px; gap:10px; }
.dashboard-history .timeline::before { background:color-mix(in srgb, var(--accent) 72.0%, transparent); }
.dashboard-history .timeline-item { min-height:39px; padding:0 0 3px 4px; }
.dashboard-history .timeline-marker { width:21px; height:21px; left:-31px; background:var(--surface-raised); box-shadow:none; }
.dashboard-history .timeline-date { font-size:10px; }
.dashboard-history .timeline-title { font-size:12px; margin-top:1px; }
.dashboard-history .timeline-text { font-size:10.5px; margin-top:2px; line-height:1.4; }

/* Desktop grande: proporção próxima a 68/32 e um pouco mais de ar entre grandes seções. */
@media (min-width:1440px) {
  .dashboard-grid { grid-template-columns:minmax(0,1.9fr) minmax(320px,.88fr); gap:16px; }
  .chart-box { min-height:344px; }
  .chart-box svg { height:265px; }
}

/* Notebook prioritário: mantém hierarquia sem encolher tipografia útil. */
@media (min-width:1200px) and (max-width:1439px) {
  .dashboard-grid { grid-template-columns:minmax(0,1.72fr) minmax(290px,.86fr); gap:12px; }
  .distribution-panel .panel-head { padding-left:15px; padding-right:15px; }
  .distribution-panel .panel-body { padding-left:15px; padding-right:15px; }
  .distribution-panel .dist-row { margin:9px 0; }
  .distribution-panel .context-alert { margin-top:10px; }
  .kpi-card { padding-left:12px; padding-right:12px; }
  .kpi-label { font-size:10px; }
  .kpi-value { font-size:29px; }
  .chart-box { min-height:318px; }
  .chart-box svg { height:242px; }
}

/* Tablet: o cluster vem primeiro e as áreas analíticas preservam legibilidade. */
@media (min-width:900px) and (max-width:1199px) {
  .dashboard-grid { grid-template-columns:1fr; gap:12px; }
  .distribution-panel .panel-body { padding-bottom:14px; }
  .rhythm-panel { min-height:56px; }
  .kpi-strip { grid-template-columns:repeat(3,1fr); }
  .chart-grid { grid-template-columns:1fr; }
  .chart-box { min-height:326px; }
  .chart-box svg { height:248px; }
}

/* Mobile: reorganiza sem simplesmente reduzir o desktop. */
@media (max-width:899px) {
  .dashboard-grid { grid-template-columns:minmax(0,1fr); gap:12px; }
  .dashboard-grid .panel-title { font-size:14px; }
  .dashboard-grid .panel-sub { font-size:11px; }
  .distribution-panel .panel-head { padding:15px 14px 7px; }
  .distribution-panel .panel-body { padding:8px 14px 14px; }
  .distribution-panel .dist-top { font-size:12px; grid-template-columns:minmax(0,1fr) 46px; }
  .distribution-panel .dist-track { height:13px; }

  .rhythm-row {
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"label value" "track track";
    gap:7px 12px;
  }
  .rhythm-label { grid-area:label; }
  .rhythm-track { grid-area:track; height:19px; }
  .rhythm-value { grid-area:value; align-self:center; text-align:right; font-size:22px; }

  .kpi-strip { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .kpi-card { min-height:92px; padding:12px; }
  .kpi-icon { width:26px; height:26px; }
  .kpi-value { font-size:28px; }
  .kpi-label { font-size:10.5px; }

  .attention-grid { grid-template-columns:1fr; gap:10px; }
  .attention-panel { min-height:0; }
  .attention-item { min-height:48px; }
  .attention-item strong { font-size:12px; }
  .attention-item span { font-size:11px; }

  .chart-grid { grid-template-columns:1fr; gap:12px; }
  .chart-box { min-height:300px; }
  .chart-box svg { height:222px; }
  .dashboard-history .panel-head { align-items:flex-start; }
  .dashboard-history .btn { min-height:40px; }
}

@media (max-width:479px) {
  .rhythm-panel { padding:10px 12px; }
  .rhythm-label strong { font-size:11px; }
  .rhythm-label span { font-size:10px; }
  .kpi-card { min-height:90px; }
  .kpi-value { font-size:27px; }
  .attention-panel .panel-head { padding:14px 13px 6px; }
  .attention-panel .panel-body { padding:6px 13px 12px; }
  .chart-box { min-height:286px; }
  .chart-box .panel-head { padding:14px 13px 6px; }
  .chart-box .panel-body { padding:4px 13px 12px; }
  .chart-box svg { height:214px; }
  .dashboard-history .panel-head { padding:14px 13px 7px; }
  .dashboard-history-body { padding:8px 14px 14px; }
}

@media (max-width:350px) {
  .kpi-strip { grid-template-columns:1fr; }
  .kpi-card { min-height:82px; }
}

/* Gráficos com composição própria no mobile para evitar miniaturização de eixos e labels. */
.chart-svg-mobile { display:none; }
@media (max-width:599px) {
  .chart-svg-desktop { display:none; }
  .chart-svg-mobile { display:block; }
  .chart-box svg { width:100%; height:auto; min-height:0; max-height:none; }
}

/* =========================================================
   VISÃO SF v0.2.4 — HIERARQUIA FIXA DOS RESULTADOS NOS GAUGES
   Percentual > nome > resultado quantitativo > status em cápsula.
   ========================================================= */
.gauge-detail {
  color:var(--text-soft);
  font-style:normal;
  font-weight:500;
}
.instrument-cluster-mobile .gauge-status,
.instrument-cluster-mobile .mini-gauge-readout small {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:4px 10px;
  border:1px solid currentColor;
  border-radius:999px;
  background:rgba(255,255,255,.025);
  box-shadow:0 0 10px rgba(0,0,0,.18);
  white-space:nowrap;
}
.instrument-cluster-mobile .gauge-status.ok,
.instrument-cluster-mobile .mini-gauge-shell.ok small { background:rgba(53,208,127,.055); }
.instrument-cluster-mobile .gauge-status.attention,
.instrument-cluster-mobile .mini-gauge-shell.attention small { background:rgba(255,176,32,.055); }
.instrument-cluster-mobile .gauge-status.critical,
.instrument-cluster-mobile .mini-gauge-shell.critical small { background:rgba(255,77,90,.055); }

@media (max-width:899px) {
  .instrument-cluster-mobile .gauge-number strong { top:23%; }
  .instrument-cluster-mobile .gauge-number span { top:49%; }
  .instrument-cluster-mobile .gauge-number .gauge-detail {
    position:absolute;
    left:50%;
    top:60%;
    transform:translateX(-50%);
    width:max-content;
    margin:0;
    font-size:10px;
    color:var(--text-soft);
    line-height:1.2;
  }
  .instrument-cluster-mobile .gauge-status { top:71%; font-size:10px; }

  .instrument-cluster-mobile .mini-gauge-readout strong { top:22%; }
  .instrument-cluster-mobile .mini-gauge-readout span { top:48%; }
  .instrument-cluster-mobile .mini-gauge-readout em { top:60%; }
  .instrument-cluster-mobile .mini-gauge-readout small { top:73%; font-size:8px; }
}

@media (max-width:479px) {
  .instrument-cluster-mobile .gauge-number strong { top:22%; }
  .instrument-cluster-mobile .gauge-number span { top:48%; }
  .instrument-cluster-mobile .gauge-number .gauge-detail { top:59%; font-size:9px; }
  .instrument-cluster-mobile .gauge-status { top:70%; }
  .instrument-cluster-mobile .mini-gauge-readout strong { top:21%; }
  .instrument-cluster-mobile .mini-gauge-readout span { top:47%; }
  .instrument-cluster-mobile .mini-gauge-readout em { top:59%; font-size:8px; }
  .instrument-cluster-mobile .mini-gauge-readout small { top:72%; font-size:7.5px; padding:3px 7px; min-height:21px; }
}


/* =========================================================
   VISÃO SF v0.2.5 — NOMES DOS INDICADORES NA BASE DOS GAUGES
   Os rótulos COBERTURA / SAÚDE GERAL / NO PRAZO deixam o miolo
   dos instrumentos e passam a funcionar como legendas estruturais.
   ========================================================= */
.instrument-cluster-svg .gauge-base-label {
  pointer-events:none;
  text-transform:uppercase;
  text-shadow:0 0 10px color-mix(in srgb, var(--accent) 11.0%, transparent);
}

.instrument-cluster-mobile .main-gauge-shell,
.instrument-cluster-mobile .mini-gauge-shell {
  position:relative;
}
.instrument-cluster-mobile .gauge-mobile-base-label {
  position:absolute;
  left:50%;
  bottom:-8px;
  transform:translateX(-50%);
  width:max-content;
  max-width:92%;
  color:var(--text-soft);
  font-size:10px;
  line-height:1;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  text-align:center;
  text-shadow:0 0 9px color-mix(in srgb, var(--accent) 10.0%, transparent);
  pointer-events:none;
  white-space:nowrap;
}
.instrument-cluster-mobile .main-mobile-base-label {
  bottom:-6px;
  color:var(--text-soft);
  font-size:11px;
  letter-spacing:.18em;
}

@media (max-width:899px) {
  .instrument-cluster-mobile .gauge-number strong { top:24%; }
  .instrument-cluster-mobile .gauge-number .gauge-detail { top:53%; }
  .instrument-cluster-mobile .gauge-status { top:65%; }
  .instrument-cluster-mobile .mini-gauge-readout strong { top:21%; }
  .instrument-cluster-mobile .mini-gauge-readout em { top:53%; }
  .instrument-cluster-mobile .mini-gauge-readout small { top:67%; }
  .instrument-cluster-mobile .gauge-cluster {
    row-gap:28px;
  }
}

@media (max-width:479px) {
  .instrument-cluster-mobile .gauge-number strong { top:23%; }
  .instrument-cluster-mobile .gauge-number .gauge-detail { top:52%; font-size:9px; }
  .instrument-cluster-mobile .gauge-status { top:64%; }
  .instrument-cluster-mobile .mini-gauge-readout strong { top:20%; }
  .instrument-cluster-mobile .mini-gauge-readout em { top:52%; font-size:8px; }
  .instrument-cluster-mobile .mini-gauge-readout small { top:66%; }
  .instrument-cluster-mobile .gauge-mobile-base-label { bottom:-7px; font-size:9px; letter-spacing:.13em; }
  .instrument-cluster-mobile .main-mobile-base-label { bottom:-5px; font-size:10px; }
}


/* Final container overrides: these intentionally come last so sidebar width can drive layout. */
@container appmain (max-width:1220px) and (min-width:900px) {
  .dashboard-grid { grid-template-columns:minmax(0,1fr) !important; gap:12px !important; }
  .instrument-zone,.distribution-panel,.rhythm-panel,.kpi-strip,.attention-grid,.chart-grid,.dashboard-history { grid-column:1/-1 !important; }
  .chart-grid { grid-template-columns:1fr !important; }
}
@container appmain (min-width:1221px) {
  .kpi-strip { grid-template-columns:repeat(6,minmax(0,1fr)); }
}
@container appmain (max-width:1180px) and (min-width:900px) {
  .kpi-strip { grid-template-columns:repeat(3,minmax(150px,1fr)) !important; }
  .attention-grid { grid-template-columns:repeat(2,minmax(280px,1fr)) !important; }
  .attention-grid > :last-child { grid-column:1/-1; }
}
@container appmain (max-width:980px) and (min-width:900px) {
  .attention-grid { grid-template-columns:1fr !important; }
  .attention-grid > :last-child { grid-column:auto; }
}
@media (prefers-reduced-motion: reduce) {
  .app-shell,.side-brand-copy,.nav-item,.nav-item::after,.topbar-menu,.topbar-menu::after { transition:none !important; }
}




/* =========================================================
   VISÃO SF v0.3.2 — NAVEGAÇÃO EMPRESARIAL
   appmain é o container real da área útil e reage à sidebar.
   ========================================================= */
@container appmain (max-width:980px) and (min-width:900px) {
  .rhythm-row { grid-template-columns:150px minmax(0,1fr) 64px; gap:10px; }
}

/* v0.3.3 — Conferências e planos de ação */
.hub-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:20px}
.hub-stat{padding:18px;display:flex;flex-direction:column;gap:6px}.hub-stat strong{font-size:28px;color:var(--text-primary)}.hub-stat span,.hub-hint{font-size:12px;color:var(--text-secondary);line-height:1.6}.hub-tabs{margin-bottom:16px;max-width:100%;flex-wrap:wrap}.action-filters{flex-wrap:wrap}.action-filters>*{min-width:0}.action-filters input{flex:2}.action-filters select{flex:1}.field small{color:var(--text-secondary);line-height:1.5}.field textarea{resize:vertical;min-height:80px}
.sidebar-expanded .nav-label{white-space:normal;line-height:1.3}.nav-item{min-height:42px}.side-nav{overflow-y:auto}
@media(max-width:600px){.hub-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.action-filters>*{flex-basis:100%!important;width:100%}.hub-stat{padding:14px}.hub-tabs button{font-size:12px}.mobile-nav button{min-width:0}.mobile-nav button span{font-size:10px}}

/* v0.3.4 — espaçamento do menu lateral */
.sidebar-expanded .side-nav{gap:10px}
.sidebar-expanded .nav-item{min-height:46px;padding:6px 11px}
.sidebar-expanded .nav-section-items{gap:2px}

/* v0.3.5 — menu distribuído pela altura útil, sem rolagem interna */
:root{--sidebar-expanded:248px}
.sidebar{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:visible;padding:12px 10px;box-sizing:border-box}
.side-logo{flex:0 0 auto;min-height:66px;margin-bottom:12px}
.sidebar-expanded .side-logo img{width:44px;height:44px}
.sidebar-expanded .side-brand-copy strong{font-size:18px;letter-spacing:.035em}
.sidebar-expanded .side-brand-copy span{font-size:10px;letter-spacing:.035em}
.side-nav,.sidebar-expanded .side-nav{flex:1;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) minmax(0,4fr) minmax(0,2fr) minmax(0,1fr);gap:14px;overflow:visible}
.nav-section{min-height:0;display:flex;flex-direction:column;gap:6px}
.nav-section + .nav-section{margin-top:0}
.nav-section-title{flex:0 0 auto;font-size:10px;padding:0 10px;line-height:1.3;letter-spacing:.1em}
.nav-section-items,.sidebar-expanded .nav-section-items{flex:1;min-height:0;display:grid;grid-auto-rows:minmax(0,1fr);gap:4px}
.nav-item,.sidebar-expanded .nav-item{min-height:0;padding:5px 10px}
.sidebar-expanded .nav-item{grid-template-columns:28px minmax(0,1fr);column-gap:12px}
.sidebar .nav-icon svg{width:26px;height:26px}
.sidebar-expanded .nav-label{font-size:15px;line-height:1.2;white-space:normal;overflow:visible;text-overflow:clip}
.sidebar-footer{display:none;flex:0 0 auto;border-top:1px solid var(--border);margin-top:16px;padding:14px 8px 0;color:var(--text-secondary)}
.sidebar-expanded .sidebar-footer{display:block}
.sidebar-copyright{font-size:11px;line-height:1.45}
.sidebar-development{margin-top:12px}
.sidebar-development span{display:block;font-size:9px;line-height:1.4;font-weight:750;letter-spacing:.045em;text-transform:uppercase}
.sidebar-development strong{display:block;margin-top:4px;color:var(--text-main);font-size:12px;line-height:1.35}
.sidebar-version{font-size:10px;margin-top:8px;color:var(--text-secondary)}
@media(min-width:754px) and (max-height:750px){
.sidebar{padding-top:8px;padding-bottom:8px}.side-logo{min-height:56px;margin-bottom:8px}
.side-nav,.sidebar-expanded .side-nav{gap:10px}.nav-section{gap:4px}.sidebar-expanded .nav-label{font-size:14px}
.sidebar .nav-icon svg{width:24px;height:24px}.sidebar-footer{margin-top:10px;padding-top:10px}
.sidebar-development{margin-top:8px}.sidebar-version{margin-top:4px}
}
@media(min-width:754px) and (max-height:600px){
.sidebar{padding-top:6px;padding-bottom:6px}.side-logo{min-height:44px;margin-bottom:6px;padding:4px 8px}
.sidebar-expanded .side-logo img{width:34px;height:34px}.sidebar-expanded .side-brand-copy strong{font-size:16px}
.side-nav,.sidebar-expanded .side-nav{gap:6px}.nav-section{gap:3px}.nav-section-title{font-size:9px}
.sidebar .nav-icon svg{width:22px;height:22px}.sidebar-expanded .nav-label{font-size:13px}
.sidebar-footer{margin-top:6px;padding-top:6px}.sidebar-copyright{font-size:10px}.sidebar-development{margin-top:5px}
.sidebar-development span{font-size:8px}.sidebar-development strong{font-size:11px;margin-top:2px}.sidebar-version{font-size:9px;margin-top:3px}
}
@media(min-width:754px) and (max-height:460px){
.sidebar-expanded .nav-section-title{display:none}.side-nav,.sidebar-expanded .side-nav{gap:3px}
.nav-item,.sidebar-expanded .nav-item{padding:2px 10px}.sidebar-footer{padding-top:4px;margin-top:4px}
.sidebar-development{margin-top:3px}.sidebar-development span{display:inline}.sidebar-development strong{display:inline;margin-left:4px}
.sidebar-version{display:none}.sidebar .nav-icon svg{width:20px;height:20px}
}
@media(max-width:899px){.sidebar{display:none}}

/* v0.3.8 — lateral compacta, baseada na v0.3.5 */
:root{--sidebar-expanded:216px}
.sidebar-expanded .nav-item{grid-template-columns:24px minmax(0,1fr);column-gap:10px;padding-left:8px;padding-right:8px}
.sidebar-expanded .nav-label{font-size:13px;line-height:1.25}
.sidebar-expanded .nav-section-title{font-size:9px;letter-spacing:.07em}
@media(min-width:900px) and (max-height:600px){.sidebar-expanded .nav-label{font-size:12px}}

/* Acesso direto temporário para testes */
.test-direct-access #logout,.test-direct-access [data-logout-modal]{display:none}

/* v0.3.10 — cards uniformes e sequência operacional */
.process-grid{align-items:stretch;grid-auto-rows:1fr}
.process-grid .process-card{display:flex;flex-direction:column;height:100%;box-sizing:border-box;min-width:0}
.process-grid .process-card-head{min-height:64px;display:grid;grid-template-columns:minmax(0,1fr);gap:8px;align-content:start}
.process-grid .process-card-head>div:last-child{justify-content:flex-start!important}
.process-grid .process-name{overflow-wrap:anywhere;line-height:1.35}
.process-order{display:inline-block;color:var(--text-secondary);font-size:11px;letter-spacing:.04em;margin-right:8px;font-weight:500}
.process-grid .issue-list{flex:1;align-content:start;min-height:104px}
.process-grid .process-owners{min-height:48px;box-sizing:border-box}
.process-grid .process-footer{margin-top:auto;min-height:42px;gap:8px;flex-wrap:wrap}
.process-grid .score-unrated{font-size:20px;line-height:32px;color:var(--text-secondary)}
.badge.unrated{color:var(--text-secondary);background:color-mix(in srgb, var(--accent) 8.0%, transparent);border-color:color-mix(in srgb, var(--accent) 20.0%, transparent)}

/* v0.3.11 — cadastro e organização dos processos */
.process-toolbar-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.process-indicator-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(130px,.7fr) auto;gap:8px;margin-bottom:10px}
.process-order-list{display:grid;gap:8px}.process-order-row{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px;border:1px solid var(--border);border-radius:8px}
.process-order-number{color:var(--text-secondary);font-size:12px}.process-order-row strong{font-size:14px;overflow-wrap:anywhere}.process-move-controls{display:flex;gap:6px}
@media(max-width:600px){.process-toolbar-actions{justify-content:flex-start}.process-indicator-row{grid-template-columns:minmax(0,1fr) auto}.process-indicator-row input{grid-column:1/-1}.process-order-row{gap:6px;padding:8px}.process-order-row strong{font-size:13px}}

/* v0.3.12 — padrões, indicadores configuráveis e planos por processo */
.tabs{display:flex;flex-wrap:wrap;gap:6px;overflow:visible}.tabs .tab{white-space:normal}
.standard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.standard-item{white-space:pre-wrap;overflow-wrap:anywhere;border-bottom:1px solid var(--border);padding-bottom:12px}
.standard-item>span{display:block;font-size:12px;color:var(--text-secondary);margin-bottom:6px}.standard-item>div{font-size:14px;line-height:1.6}
.standard-empty{color:var(--text-secondary)}.indicator-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.indicator-inactive{opacity:.65}
.extension-check{display:flex;align-items:center;gap:10px;margin:8px 0;font-size:14px}.extension-check input{width:18px;height:18px}
@media(max-width:600px){.standard-grid{grid-template-columns:1fr}.detail-actions{flex-wrap:wrap}}

.treatment-form{margin-top:22px;padding-top:18px;border-top:1px solid var(--border)}

/* Stable process identity: subtle accents, independent quality badges. */
.process-card.identity-commercial{--process-accent:var(--text-secondary);--process-tint:color-mix(in srgb, var(--accent) 10.0%, transparent)}
.process-card.identity-supply{--process-accent:#c5aa79;--process-tint:rgba(197,170,121,.10)}
.process-card.identity-production{--process-accent:var(--text-secondary);--process-tint:color-mix(in srgb, var(--accent) 10.0%, transparent)}
.process-card.identity-dispatch{--process-accent:#aaa0cc;--process-tint:rgba(170,160,204,.10)}
.process-card.identity-logistics{--process-accent:var(--text-secondary);--process-tint:color-mix(in srgb, var(--accent) 10.0%, transparent)}
.process-card.identity-returns,.process-card.identity-neutral{--process-accent:var(--text-secondary);--process-tint:color-mix(in srgb, var(--accent) 10.0%, transparent)}
.process-grid .process-card::before{left:18px;right:18px;top:0;bottom:auto;width:auto;height:2px;background:var(--process-accent);opacity:.85;box-shadow:none}
.process-grid .process-card.critical{border-color:rgba(255,77,90,.32);box-shadow:var(--shadow-card)}
.process-grid .process-card-head{min-height:96px;gap:12px}
.process-identity{display:flex;align-items:center;gap:12px;min-width:0}
.process-symbol{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border:1px solid var(--process-tint);border-radius:10px;background:var(--process-tint);color:var(--process-accent)}
.process-identity-text{min-width:0;flex:1}
.process-category{display:flex;align-items:center;justify-content:space-between;gap:6px;color:var(--text-secondary);font-size:12px;line-height:1.4;margin-bottom:5px}
.process-step{font-variant-numeric:tabular-nums;letter-spacing:.03em;color:var(--process-accent);font-weight:600;font-size:12px;flex-shrink:0}
.process-grid .process-name{font-size:14px;font-weight:600;text-transform:none;letter-spacing:0;line-height:1.4}
@media(max-width:480px){.process-category{font-size:12px}.process-grid .process-card-head{min-height:96px}}

.history-filter-grid{display:grid;grid-template-columns:minmax(180px,1.4fr) repeat(2,minmax(130px,.8fr)) repeat(2,minmax(150px,1fr)) auto;gap:12px;align-items:end;margin-bottom:12px}
.history-filter-grid .field{min-width:0;margin:0}.history-filter-grid .filter-input{width:100%;min-width:0;box-sizing:border-box}.history-filter-grid label{font-size:14px}
.history-clear{white-space:nowrap;min-height:42px}.history-result-count{color:var(--text-secondary);font-size:13px;margin:12px 0}.history-period-error{color:var(--amber);font-size:14px;margin:12px 0}
@media(max-width:1200px){.history-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.history-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.history-search{grid-column:1/-1}.history-clear{width:100%}}
@media(max-width:360px){.history-filter-grid{grid-template-columns:1fr}}

.conference-date-bar{display:flex;align-items:end;gap:18px;flex-wrap:wrap;margin:16px 0 22px;padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}
.conference-date-bar .field,.conference-watch .field{margin:0;max-width:240px}.conference-started{font-size:13px;line-height:1.7;color:var(--text-secondary);flex:1}.conference-date-bar .input{width:100%;box-sizing:border-box}
.conference-watch{margin:0 0 16px}.conference-summary{grid-template-columns:repeat(4,minmax(0,1fr))}.conference-record-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;align-items:end;gap:12px;margin:16px 0}.conference-record-filters .field{min-width:0;margin:0}.conference-record-filters input,.conference-record-filters select{width:100%;box-sizing:border-box;min-width:0}.conference-record-filters label,.conference-date-bar label,.conference-watch label,.conference-pending-filters label{font-size:14px}
.conference-pending-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:650px;margin-top:16px}.conference-pending-filters .field{margin:0}.conference-progress-card{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px}.conference-progress-card h3{margin:0 0 12px}.conference-progress-card p{color:var(--text-secondary);font-size:14px;line-height:1.5}
@media(max-width:1000px){.conference-record-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.conference-summary,.conference-record-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.conference-date-bar{align-items:stretch}.conference-date-bar .field{max-width:none;width:100%}.conference-started{flex-basis:100%}.conference-progress-card{align-items:stretch;flex-direction:column}}
/* Unified period picker: one field, inclusive range, custom calendar. */
.calendar-field{min-width:0}.calendar-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:42px;padding:10px 13px;border:1px solid var(--border);border-radius:var(--radius-md,10px);background:var(--surface-input);color:var(--text-primary,var(--text-main));font:inherit;font-size:14px;text-align:left;cursor:pointer;box-sizing:border-box}.calendar-trigger [data-calendar-label]{min-width:0;overflow-wrap:anywhere}.calendar-trigger .icon{flex-shrink:0;color:var(--cyan)}.calendar-trigger:hover{border-color:var(--border-active)}.calendar-trigger:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.calendar-popover{position:fixed;z-index:10000;padding:10px;border:1px solid var(--border-strong);border-radius:14px;background:var(--surface-raised);color:var(--text-main);box-shadow:0 18px 50px rgba(0,0,0,.42);box-sizing:border-box;overflow:auto;font-size:14px}.calendar-popover button{font:inherit;cursor:pointer;color:inherit;border:0}.calendar-popover button:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.calendar-range-head{display:grid;grid-template-columns:minmax(0,1fr) 16px minmax(0,1fr);gap:6px;align-items:center}.calendar-range-head>span{color:var(--text-secondary);text-align:center}.calendar-range-head button{text-align:left;background:var(--surface-soft);border:1px solid var(--border-strong);border-radius:12px;padding:8px;min-width:0}.calendar-range-head button.active{border-color:var(--border-active);background:var(--surface)}.calendar-range-head small{display:block;color:var(--text-secondary);font-size:11px;font-weight:600;letter-spacing:.03em;margin-bottom:4px}.calendar-range-head strong{font-size:13px;font-variant-numeric:tabular-nums}.calendar-hint{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin:12px 0;color:var(--text-secondary);font-size:12px}.calendar-hint button{background:color-mix(in srgb, var(--accent) 12.0%, transparent);border-radius:8px;padding:7px 9px;color:var(--cyan);font-size:12px}
.calendar-month{display:grid;grid-template-columns:32px minmax(0,1fr) 32px;align-items:center;gap:8px;margin:8px 0 11px}.calendar-month strong{text-align:center;font-size:15px;line-height:1.4}.calendar-month button{height:32px;font-size:26px;line-height:1;background:var(--surface-soft);border-radius:9px}.calendar-week,.calendar-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.calendar-week{color:var(--text-secondary);font-size:12px;text-align:center;margin-bottom:8px}.calendar-day{height:28px;min-width:0;background:transparent;border-radius:9px;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}.calendar-popover .calendar-day.outside{color:var(--text-muted)}.calendar-popover .calendar-day.in-range{background:color-mix(in srgb, var(--accent) 10.0%, transparent);color:var(--text-main);border-radius:5px}.calendar-popover .calendar-day.selected{background:var(--cyan);color:var(--bg-main)}.calendar-day.today:not(.selected){box-shadow:inset 0 0 0 1px var(--cyan)}.calendar-day:hover:not(:disabled){background:color-mix(in srgb, var(--accent) 16.0%, transparent)}.calendar-popover .calendar-day:disabled{opacity:.28;cursor:default}.calendar-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding-top:7px;border-top:1px solid var(--border)}.calendar-bottom button{background:transparent;padding:6px 4px;color:var(--text-secondary);font-size:12px}
.history-filter-grid{grid-template-columns:minmax(180px,1.3fr) minmax(240px,1.6fr) repeat(2,minmax(150px,1fr)) auto}.conference-record-filters{grid-template-columns:minmax(240px,1.6fr) repeat(2,minmax(150px,1fr)) auto}
@media(max-width:1200px){.history-filter-grid,.conference-record-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.history-filter-grid,.conference-record-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.history-search,.history-filter-grid .calendar-field,.conference-record-filters .calendar-field{grid-column:1/-1}.calendar-trigger{min-height:44px}}
@media(max-width:360px){.history-filter-grid,.conference-record-filters{grid-template-columns:1fr}.calendar-popover{padding:12px}.calendar-day{height:32px}}

.downward-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;color:var(--text-main);cursor:pointer;box-sizing:border-box}.downward-trigger>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.downward-trigger>span:last-child{font-size:18px;color:var(--text-secondary)}.downward-trigger:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.downward-options{position:fixed;z-index:10000;overflow-y:auto;overscroll-behavior:contain;padding:5px;border:1px solid var(--border-strong);border-radius:12px;box-sizing:border-box;background:var(--surface-raised);box-shadow:0 12px 36px rgba(0,0,0,.4)}.downward-options button{display:block;width:100%;padding:10px 12px;border:0;border-radius:7px;text-align:left;font:inherit;font-size:14px;line-height:1.4;color:var(--text-main);background:transparent;cursor:pointer}.downward-options button[aria-selected="true"]{background:color-mix(in srgb, var(--accent) 10.0%, transparent);color:var(--cyan)}.downward-options button:hover,.downward-options button:focus{outline:0;background:color-mix(in srgb, var(--accent) 15.0%, transparent)}

/* Matching conference filters and quiet scrollbars. */
.downward-trigger{appearance:none;background-image:none}.downward-trigger>.icon{flex-shrink:0;color:var(--text-secondary);transition:transform .16s ease}.downward-trigger[aria-expanded="true"]>.icon{transform:rotate(180deg);color:var(--cyan)}
.downward-options{scrollbar-width:thin;scrollbar-color:var(--text-secondary) var(--surface);scrollbar-gutter:stable}.downward-options::-webkit-scrollbar{width:6px}.downward-options::-webkit-scrollbar-track{background:var(--surface);border-radius:8px}.downward-options::-webkit-scrollbar-thumb{background:var(--text-secondary);border-radius:8px}.downward-options::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.downward-options::-webkit-scrollbar-button{display:none;height:0;width:0}

.conference-back{margin-bottom:16px;min-height:40px}

/* Conferências: cartões com ações e informações consistentes. */
.conference-task{display:flex;flex-direction:column;gap:10px;min-height:230px;text-align:left;cursor:default;}
.conference-card-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;}
.conference-task .div-meta{margin:0;}
.conference-progress-card .progress-bar{margin:8px 0;max-width:380px;}
.conference-progress-card .conference-card-actions{margin-top:0;align-self:center;}
@media(max-width:600px){.conference-progress-card{flex-direction:column;align-items:stretch;}.conference-progress-card .conference-card-actions{align-self:stretch;}}

/* Preferências de aparência e gestão de usuários. */
:root{--text-primary:var(--text-main)}
.appearance-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(230px,1fr);gap:24px;align-items:start}
.appearance-preview{border:1px solid var(--border);background:var(--surface-raised);border-radius:var(--radius-md);padding:20px;min-width:0}
.appearance-preview h3{margin:10px 0;font-size:18px}.appearance-preview p{color:var(--text-secondary);font-size:14px;line-height:1.5}.appearance-preview .btn{margin-top:12px}
.appearance-footer{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px;padding:16px 20px;border-top:1px solid var(--border)}
.settings-row>div{min-width:0}.settings-row strong,.settings-row span{overflow-wrap:anywhere}.settings-row>.btn{flex-shrink:0}
html[data-theme="light"]{color-scheme:light;--shadow-card:0 4px 16px rgba(20,25,30,.06);--shadow-panel:0 8px 26px rgba(20,25,30,.09);--shadow-modal:0 18px 50px rgba(20,25,30,.18)}
html[data-theme="light"] body{background:var(--bg-main)}
html[data-theme="light"] :is(.sidebar,.topbar,.mobile-nav,.modal,.toast,.login-card,.process-card,.instrument-panel,.instrument-cluster,.dashboard-history,.detail-json){background:var(--surface);color:var(--text-main)}
html[data-theme="light"] :is(.topbar-menu,.icon-btn,.period-pill,.badge,.filter-chip,.timeline-marker,.user-chip){background:var(--surface-soft);color:var(--text-secondary);border-color:var(--border)}
html[data-theme="light"] :is(.input,.select,.textarea,.filter-input):focus{background:var(--surface);border-color:var(--cyan)}
html[data-theme="light"] :is(.badge.ok,.btn-success,.severity-option.active[data-value="leve"]){color:var(--border-strong);background:#E6F5EC;border-color:var(--text-secondary)}
html[data-theme="light"] :is(.badge.attention,.btn-amber,.severity-option.active[data-value="media"]){color:#865300;background:#FFF3D9;border-color:#E0C587}
html[data-theme="light"] :is(.badge.critical,.btn-danger,.severity-option.active[data-value="grave"]){color:#A82637;background:#FDECEF;border-color:#E0AAB3}
html[data-theme="light"] :is(.badge.verify,.badge.recurrence){color:#644099;background:#EFE9FA;border-color:#C3AEDF}
html[data-theme="light"] :is(.issue-line.danger,.attention-value.critical){color:var(--red)}
html[data-theme="light"] :is(.issue-line.warn,.context-alert strong,.attention-value.attention){color:var(--amber)}
html[data-theme="light"] .rhythm-value{color:var(--text-main)}
html[data-theme="light"] :is(.health-bar,.progress-bar,.dist-seg,.rhythm-seg){background:var(--text-main);border-color:var(--border)}
html[data-theme="light"] .instrument-cluster-svg{background:var(--surface);border-radius:12px}
html[data-theme="light"] .fab{background:var(--cyan);border-color:var(--cyan)}
html[data-accent]:not([data-accent="cyan"]) .btn-primary,html[data-theme="light"] :is(.btn-primary,.div-actions .btn:first-child){background:var(--blue);border-color:var(--blue);color:#FFFFFF;box-shadow:none}
html[data-accent]:not([data-accent="cyan"]) .btn-primary:hover,html[data-theme="light"] .btn-primary:hover{filter:brightness(.9)}
html[data-accent]:not([data-accent="cyan"]) :is(.progress-fill,.process-card.ok .health-bar>span,.dist-seg.on,.rhythm-seg.on){background:var(--cyan);box-shadow:none}
html[data-font="small"] .content :is(.input,.select,.filter-input,.btn,.field label,.div-sub,.indicator-meta,.pick-card span,.hub-hint,.appearance-preview p){font-size:12px}
html[data-font="large"] :is(.content,.modal) :is(.input,.select,.filter-input,.btn,.field label,.div-sub,.indicator-meta,.pick-card span,.hub-hint,.appearance-preview p,.timeline-text,.settings-row span){font-size:16px;line-height:1.5}
html[data-font="large"] :is(.content,.modal) :is(.badge,.panel-sub,.page-intro p){font-size:14px;line-height:1.4}
html[data-font="large"] .nav-label{font-size:14px}html[data-font="large"] .mobile-nav button span{font-size:12px}
html[data-font="large"] :is(.pick-card strong,.indicator-name,.check-item-title,.settings-row strong){font-size:18px;line-height:1.4}
@media(max-width:700px){.appearance-grid{grid-template-columns:minmax(0,1fr)}.appearance-footer{justify-content:stretch}.appearance-footer .btn{flex:1}.settings-row{gap:12px;flex-wrap:wrap}}

html[data-theme="dark"][data-accent]:not([data-accent="cyan"]) .btn-primary{color:var(--surface);background:var(--cyan)}

/* Configurações: navegação por categoria e hierarquia administrativa. */
.settings-workspace{width:100%;max-width:1240px;margin:0 auto}
.settings-frame{display:grid;grid-template-columns:190px minmax(0,1fr);gap:28px;align-items:start}
.settings-menu{display:flex;flex-direction:column;gap:5px;padding:6px 0;position:sticky;top:calc(var(--topbar-h) + 20px)}
.settings-menu-item{display:flex;align-items:center;gap:11px;width:100%;min-height:46px;padding:11px 14px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--text-secondary);font:inherit;font-size:14px;font-weight:550;text-align:left;cursor:pointer}
.settings-menu-item .icon{flex-shrink:0}.settings-menu-item:hover{background:var(--surface-soft);color:var(--text-main)}
.settings-menu-item.active{background:var(--surface-raised);border-color:var(--border);color:var(--cyan);box-shadow:inset 3px 0 var(--cyan)}
.settings-menu-item:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.settings-content{min-width:0}.settings-category-head{margin:0 0 20px}.settings-category-head h2{margin:0 0 6px;font-size:20px;font-weight:650;letter-spacing:-.02em}.settings-category-head p{margin:0;color:var(--text-secondary);font-size:14px;line-height:1.6}
.settings-content .panel{overflow:hidden;box-shadow:var(--shadow-card)}
.settings-content>.panel+.panel{margin-top:24px}
.settings-content-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 24px;border-bottom:1px solid var(--border)}
.settings-content-head h3{margin:0;font-size:16px;font-weight:600;line-height:1.4}.settings-content-head p{margin:5px 0 0;font-size:13px;line-height:1.6;color:var(--text-secondary)}
.settings-content-head>.btn{flex-shrink:0}
.settings-table-head,.settings-user-row{display:grid;grid-template-columns:minmax(0,1fr) 150px 92px 72px;align-items:center;gap:18px;padding:18px 24px}
.settings-table-head{padding-top:12px;padding-bottom:12px;background:var(--surface-soft);color:var(--text-secondary);font-size:12px;font-weight:600}
.settings-user-row+.settings-user-row{border-top:1px solid var(--border)}
.settings-person{display:flex;gap:12px;align-items:center;min-width:0}.settings-avatar{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid var(--border);border-radius:10px;background:var(--surface-raised);color:var(--text-secondary);font-size:12px;font-weight:650}
.settings-person>div{min-width:0}.settings-person strong,.settings-contact-row strong{display:block;font-size:14px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}
.settings-person>div>span,.settings-contact-row>div>span{display:block;margin-top:3px;font-size:12px;line-height:1.5;color:var(--text-secondary);overflow-wrap:anywhere}
.settings-user-role{color:var(--text-secondary);font-size:13px;overflow-wrap:anywhere}.settings-user-row .badge{justify-self:start;font-size:12px;line-height:1.3;white-space:normal}
.settings-contact-row{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 24px}.settings-contact-row+.settings-contact-row{border-top:1px solid var(--border)}.settings-contact-status{font-size:12px;color:var(--text-secondary)}
.settings-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:24px;gap:20px;border-bottom:1px solid var(--border)}
.settings-overview strong{display:block;font-size:26px;font-weight:650}.settings-overview span{display:block;margin-top:5px;font-size:13px;color:var(--text-secondary);line-height:1.5}
.settings-option-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 24px}.settings-option-row+.settings-option-row{border-top:1px solid var(--border)}
.settings-option-row strong{font-size:14px;font-weight:600}.settings-option-row p{margin:6px 0 0;font-size:13px;line-height:1.6;color:var(--text-secondary)}.settings-option-row>.btn{flex-shrink:0}
.settings-maintenance{margin-top:24px}.settings-maintenance .settings-content-head{border-bottom:0}.settings-maintenance h3{color:var(--text-main)}
.settings-appearance .panel-body{padding:24px}.settings-appearance .appearance-grid{grid-template-columns:minmax(0,1fr) minmax(240px,1fr);gap:28px}
.settings-appearance .appearance-controls{grid-template-columns:minmax(0,1fr);gap:22px}.settings-appearance .field label{font-size:14px}.settings-appearance .select{font-size:14px;min-height:44px}
.settings-appearance .appearance-preview{padding:22px;background:var(--surface-soft)}.settings-appearance .appearance-preview h3{font-size:17px;line-height:1.5;margin-top:16px}.settings-appearance .appearance-preview p{font-size:14px}.settings-appearance .appearance-footer{padding:18px 24px}
.settings-user-modal .modal-head{padding:24px}.settings-user-modal .modal-body{padding:24px}.settings-user-modal .modal-footer{padding:18px 24px}
.settings-form-label{font-size:12px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--text-secondary);padding-bottom:14px}.form-grid .settings-form-label{grid-column:1/-1;border-top:1px solid var(--border);padding:20px 0 0;margin-top:8px}
.settings-user-modal .field label{font-size:14px}.settings-user-modal .field small{font-size:12px;line-height:1.6}.settings-account-state{margin-top:8px;padding:16px;border:1px solid var(--border);border-radius:10px;background:var(--surface-soft)}.settings-account-state input{accent-color:var(--cyan)}
html[data-font="large"] .settings-workspace :is(.settings-person strong,.settings-user-role,.settings-option-row strong,.settings-menu-item,.field label){font-size:16px}
@media(max-width:1100px){.settings-frame{grid-template-columns:160px minmax(0,1fr);gap:20px}.settings-table-head,.settings-user-row{grid-template-columns:minmax(0,1fr) 110px 76px 66px;gap:12px;padding-left:18px;padding-right:18px}.settings-appearance .appearance-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:760px){.settings-frame{grid-template-columns:minmax(0,1fr);gap:22px}.settings-menu{position:static;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:0}.settings-menu-item{padding:10px;font-size:13px;gap:7px}.settings-content-head{flex-wrap:wrap;padding:18px}.settings-table-head{display:none}.settings-user-row{grid-template-columns:minmax(0,1fr) auto;row-gap:10px}.settings-person{grid-column:1;grid-row:1}.settings-user-row>.badge{grid-column:2;grid-row:1;justify-self:end}.settings-user-role{grid-column:1;grid-row:2;padding-left:50px}.settings-user-row>.btn{grid-column:2;grid-row:2}.settings-option-row,.settings-contact-row{flex-wrap:wrap;padding:18px}.settings-overview{padding:18px;gap:12px}.settings-overview strong{font-size:22px}.settings-overview span{font-size:12px}.settings-appearance .panel-body{padding:18px}.settings-user-modal .modal-head,.settings-user-modal .modal-body{padding:20px}.settings-maintenance .btn{width:100%}}
@media(max-width:420px){.settings-menu{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-menu-item{font-size:13px}.settings-overview{grid-template-columns:minmax(0,1fr);gap:18px}.settings-content-head>.btn{width:100%}.settings-appearance .appearance-footer{padding:16px}.settings-appearance .appearance-footer .btn{flex-basis:100%}}
.settings-menu-item span{min-width:0;overflow-wrap:anywhere;line-height:1.4}

/* Categorias no topo e edição de responsáveis. */
.settings-frame{display:block}.settings-menu{position:static;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px;padding:0 0 12px;margin-bottom:24px;border-bottom:1px solid var(--border)}
.settings-menu-item{width:auto;flex:0 1 auto;min-height:44px;padding:11px 16px;font-size:14px;gap:9px}
.settings-menu-item.active{box-shadow:inset 0 -2px var(--cyan)}
.settings-contact-actions{display:flex;align-items:center;gap:20px;flex-shrink:0}.settings-contact-actions .btn{min-width:70px}
@media(max-width:760px){.settings-menu{display:flex;flex-direction:row;gap:6px;margin-bottom:20px}.settings-menu-item{padding:10px 12px;font-size:13px}.settings-contact-actions{gap:12px}.settings-contact-row{align-items:center}}
@media(max-width:420px){.settings-menu{display:flex}.settings-menu-item{flex:1 1 calc(50% - 6px)}.settings-contact-actions{width:100%;justify-content:space-between}}

/* Paletas do Infinito: identidade completa, com cores de status preservadas. */
html[data-palette] body{background:var(--bg-main);color:var(--text-main)}
html[data-palette] :is(.sidebar,.topbar,.mobile-nav,.modal,.toast,.login-card,.process-card,.instrument-zone,.instrument-panel,.instrument-cluster,.instrument-cluster-svg,.dashboard-history,.detail-json){background:var(--surface);color:var(--text-main)}
html[data-palette] :is(.panel,.indicator-card,.pick-card,.check-item){background:var(--surface);border-color:var(--border)}
html[data-palette] :is(.input,.select,.textarea,.filter-input,.calendar-trigger){background:var(--surface-input);color:var(--text-main);border-color:var(--border)}
html[data-palette] :is(.input,.select,.textarea,.filter-input):focus{background:var(--surface-input);border-color:var(--accent)}
html[data-palette] :is(.btn-primary,.div-actions .btn:first-child,.fab){background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:none}
html[data-palette] .btn-primary:hover{filter:brightness(.94)}
html[data-palette] :is(.badge.ok,.btn-success,.severity-option.active[data-value="leve"]){color:var(--green);background:color-mix(in srgb,var(--green) 14%,var(--surface));border-color:color-mix(in srgb,var(--green) 40%,var(--border))}
html[data-palette] :is(.badge.attention,.btn-amber,.severity-option.active[data-value="media"]){color:var(--amber);background:color-mix(in srgb,var(--amber) 14%,var(--surface));border-color:color-mix(in srgb,var(--amber) 40%,var(--border))}
html[data-palette] :is(.badge.critical,.btn-danger,.severity-option.active[data-value="grave"]){color:var(--red);background:color-mix(in srgb,var(--red) 14%,var(--surface));border-color:color-mix(in srgb,var(--red) 40%,var(--border))}
html[data-palette] :is(.issue-line.danger,.attention-value.critical){color:var(--red)}
html[data-palette] :is(.issue-line.warn,.attention-value.attention,.context-alert strong){color:var(--amber)}
html[data-palette] :is(.progress-fill,.dist-seg.on,.rhythm-seg.on){background:var(--accent);box-shadow:none}
html[data-palette] .process-card.ok .health-bar>span{background:var(--green)}
html[data-palette] .process-card.attention .health-bar>span{background:var(--amber)}
html[data-palette] .process-card.critical .health-bar>span{background:var(--red)}
html[data-palette] .process-grid .process-card{--process-accent:var(--accent);--process-tint:var(--accent-subtle)}
html[data-palette] svg [filter*="glow"]{filter:none}
html[data-palette] :is(.glow-panel,.instrument-zone){box-shadow:var(--shadow-card)}
.infinity-appearance-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr);gap:28px;align-items:start}
.palette-fieldset{border:0;padding:0;margin:0;min-width:0}.palette-fieldset legend{font-size:14px;font-weight:600;padding:0;margin-bottom:14px}
.infinity-palette-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.infinity-palette-card{display:flex;align-items:center;flex-direction:column;justify-content:center;position:relative;gap:4px;min-height:125px;padding:10px;border:1px solid var(--border);border-radius:12px;background:var(--surface-raised);color:var(--text-secondary);font-size:14px;cursor:pointer}
.infinity-palette-card input{position:absolute;opacity:0;width:1px;height:1px}
.infinity-palette-card:has(input:checked){border-color:var(--accent);background:var(--accent-subtle);color:var(--text-main);box-shadow:inset 0 0 0 1px var(--accent)}
.infinity-palette-card:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:3px}
.palette-choice{position:absolute;top:10px;right:10px;width:12px;height:12px;border-radius:50%;border:1px solid var(--border-strong)}
.infinity-palette-card:has(input:checked) .palette-choice{background:var(--accent);border-color:var(--accent)}
.infinity-gem{display:block;flex-shrink:0;width:44px;height:66px;background-image:url('assets/infinity-stones.png');background-size:300% 200%;background-repeat:no-repeat}
.infinity-gem.gem-large{width:76px;height:114px}
.selected-gem{display:flex;gap:18px;align-items:center}.selected-gem h3{font-size:22px!important;margin:8px 0!important}.selected-gem p{margin:0}
.appearance-format-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:22px}
.infinity-preview{padding:22px!important}.preview-chart{margin:16px 0 22px;padding:16px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}.preview-chart>span{font-size:12px;color:var(--text-secondary)}.preview-chart svg{display:block;width:100%;margin-top:12px}
@media(max-width:1000px){.infinity-appearance-layout{grid-template-columns:minmax(0,1fr)}.infinity-palette-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:480px){.infinity-palette-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.appearance-format-controls{grid-template-columns:minmax(0,1fr)}.infinity-palette-card{min-height:115px}.selected-gem{gap:12px}}

/* Cores mais definidas nos dois temas. */
html[data-palette] .nav-item.active{background:var(--accent-subtle);color:var(--accent)}
html[data-palette] .settings-menu-item.active{background:var(--accent-subtle);border-color:var(--accent);color:var(--accent)}
html[data-palette] .process-grid .process-card::before{opacity:1;height:3px}
html[data-palette] .calendar-popover .calendar-day.selected{background:var(--accent);color:var(--on-accent)}
html[data-palette] .infinity-preview .btn-primary:disabled{opacity:1}

/* Base neutra com acentos pontuais. */
html[data-palette] :is(h1,h2,h3,h4){color:var(--text-main)}
html[data-palette] :is(.mini-gauge-readout strong,.gauge-value,.metric-value){text-shadow:none}
html[data-palette] .health-bar>span{box-shadow:none}
html[data-palette] .process-grid .process-card{background:var(--surface)}
html[data-palette] .process-grid .process-card::before{height:2px}
html[data-palette] .settings-menu-item.active{border-color:var(--border);background:var(--surface-raised)}
html[data-palette] .infinity-palette-card:has(input:checked){background:var(--surface);box-shadow:inset 0 0 0 1px var(--accent)}
html[data-palette] .preview-chart{background:var(--surface)}

/* Instrumentos aprovados: aros técnicos em camadas e leitura dinâmica. */
html[data-palette] .instrument-zone{border:1px solid var(--border);border-radius:18px;clip-path:none;background:var(--surface);box-shadow:var(--shadow-card)}
.instrument-cluster-desktop{display:block!important}.instrument-cluster-mobile{display:none!important}
.tech-instruments{--tech-metal-hi:#89959C;--tech-metal-mid:#40494F;--tech-metal-low:#101619;--tech-track:#344149;padding:24px 18px 28px}
html[data-theme="light"] .tech-instruments{--tech-metal-hi:#D6DDE3;--tech-metal-mid:#8B969F;--tech-metal-low:#4A565F;--tech-track:#C8D0D8}
.tech-instruments-head{padding:0 10px}.tech-instruments-head h2{margin:0;font-size:24px;font-weight:650;letter-spacing:-.025em;line-height:1.3}.tech-instruments-head p{margin:7px 0 0;color:var(--text-secondary);font-size:14px}
.tech-instruments-grid{display:grid;grid-template-columns:1fr 1.34fr 1fr;gap:2px;align-items:center;margin-top:8px}
.tech-gauge{min-width:0;text-align:center}.tech-dial{display:block;width:100%;height:auto;overflow:visible;font-family:inherit;filter:drop-shadow(0 5px 5px rgb(0 0 0 / .16))}
.tech-gauge h3{margin:8px 0 0;font-size:16px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;line-height:1.4}.tech-gauge p{margin:7px 0 0;color:var(--text-secondary);font-size:14px;line-height:1.5}.tech-gauge .badge{margin-top:14px;padding:7px 14px;font-size:13px;font-weight:600;letter-spacing:0;text-transform:none}.tech-gauge-main .badge{margin-top:16px}
.tech-segment[data-lit="true"],.tech-rim-light{filter:drop-shadow(0 0 1.3px var(--accent))}
@media(max-width:760px){.tech-instruments{padding:20px 12px}.tech-instruments-head h2{font-size:21px}.tech-instruments-grid{grid-template-columns:1fr 1fr;gap:20px 8px;margin-top:18px}.tech-gauge-main{grid-column:1/-1;grid-row:1;max-width:360px;width:100%;justify-self:center}.tech-gauge h3{font-size:14px;letter-spacing:.04em}.tech-gauge p{font-size:13px}.tech-gauge .badge{font-size:12px;padding:6px 10px}}
@media(max-width:420px){.tech-instruments-grid{grid-template-columns:1fr}.tech-gauge{width:100%;max-width:330px;justify-self:center}.tech-gauge-main{grid-column:auto}.tech-instruments-head{padding:0 4px}}

/* Paletas metálicas inspiradas nas referências do usuário. */
.palette-finish{font-size:12px;line-height:1.4;color:var(--text-secondary)}
.palette-metal-swatch{display:block;width:70%;height:8px;margin-top:7px;border-radius:4px;background:linear-gradient(105deg,color-mix(in srgb,var(--swatch-dark) 65%,black),var(--swatch-dark) 38%,color-mix(in srgb,var(--swatch-dark) 55%,white) 50%,var(--swatch-dark) 64%,color-mix(in srgb,var(--swatch-dark) 65%,black))}
html[data-theme="light"] .palette-metal-swatch{background:linear-gradient(105deg,var(--swatch-light),var(--swatch-dark) 42%,color-mix(in srgb,var(--swatch-dark) 55%,white) 50%,var(--swatch-dark) 62%,var(--swatch-light))}
.infinity-palette-card{padding-bottom:14px}
html[data-palette] .btn-primary{background:linear-gradient(115deg,var(--accent-button-edge),var(--accent) 46%,var(--accent-button-edge));color:var(--on-accent)}
.tech-instruments{--tech-metal-hi:color-mix(in srgb,var(--accent) 12%,#89959C);--tech-metal-mid:color-mix(in srgb,var(--accent) 8%,#40494F)}
html[data-theme="light"] .tech-instruments{--tech-metal-hi:color-mix(in srgb,var(--accent) 8%,#D6DDE3);--tech-metal-mid:color-mix(in srgb,var(--accent) 7%,#8B969F)}

/* Acabamento exclusivo do tema claro: prata, aço e visor integrado. */
html[data-theme="light"] .tech-dial{
  --bg-main:#E7EDF2;
  --surface-raised:#C9D4DE;
  --text-main:#203646;
  --text-muted:#5F7484;
  --border-strong:#91A3B1;
  --tech-metal-hi:#F5F8FA;
  --tech-metal-mid:#9AADB9;
  --tech-metal-low:#526B7C;
  --tech-track:#9DAFBC;
  filter:drop-shadow(0 3px 3px rgb(35 58 75 / .12));
}
html[data-theme="light"] .tech-dial .tech-readout{fill:#243744;stroke:#79909F}
html[data-theme="light"] .tech-dial .tech-readout-number{fill:#F6F8FB}
html[data-theme="light"] .tech-dial .tech-readout-number tspan{fill:var(--instrument-accent)}
html[data-theme="light"] .tech-dial :is(.tech-rim-light,.tech-segment){filter:none}

/* Appearance choices apply and persist immediately; no preview column. */
.settings-appearance .infinity-palette-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.settings-appearance .infinity-palette-card{gap:8px;min-height:140px}
.settings-appearance .appearance-format-controls{grid-template-columns:minmax(180px,300px) minmax(0,1fr);align-items:end}
.appearance-save-status{font-size:13px;color:var(--text-secondary);margin:0;padding-bottom:12px}
@media(max-width:900px){.settings-appearance .infinity-palette-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.settings-appearance .appearance-format-controls{grid-template-columns:minmax(0,1fr)}.appearance-save-status{padding-bottom:0}.settings-appearance .infinity-palette-card{min-height:125px}}

/* Small cached profile artwork overlays initials; failed images reveal the fallback. */
:is(.avatar,.settings-avatar){position:relative;overflow:hidden}
:is(.avatar,.settings-avatar)>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}

.profile-photo-editor{display:flex;align-items:center;gap:18px;padding:18px;border:1px solid var(--border);background:var(--surface-soft);border-radius:12px;margin-bottom:22px}
.profile-photo-preview{flex:0 0 80px;width:80px;height:80px;border-radius:16px;font-size:24px}
.profile-photo-controls{display:grid;gap:9px;min-width:0}.profile-photo-buttons{display:flex;flex-wrap:wrap;gap:8px}.profile-photo-controls small{color:var(--text-secondary);font-size:13px;line-height:1.5}
@media(max-width:480px){.profile-photo-editor{padding:14px;gap:12px}.profile-photo-preview{flex-basis:64px;width:64px;height:64px}.profile-photo-buttons{gap:6px}}

/* Larger profile photo fits inside the existing 64/56px header. */
.topbar .profile-photo-trigger{width:48px;height:48px;flex:0 0 48px;padding:0;border:1px solid var(--border-strong);font:inherit;cursor:pointer}
.topbar .profile-photo-trigger:focus-visible{outline:2px solid var(--border-active);outline-offset:2px}
.topbar .profile-photo-trigger:disabled{cursor:default}
.topbar .user-meta strong{font-size:14px;line-height:1.3}.topbar .user-meta span{font-size:12px;line-height:1.3}
.profile-photo-modal{max-width:360px}.profile-photo-modal .modal-body{display:flex;align-items:center;flex-direction:column;gap:10px}
.profile-photo-modal .modal-body>span{color:var(--text-secondary);font-size:14px}
.profile-photo-large{position:relative;overflow:hidden;display:grid;place-items:center;width:192px;height:192px;border-radius:18px;border:1px solid var(--border-strong);background:var(--surface-raised);color:var(--text-main);font-size:48px;margin-bottom:8px}
.profile-photo-large>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* A wider profile capsule leaves breathing room without growing the header. */
@media(min-width:769px){
 .topbar .user-chip{min-width:200px;height:56px;box-sizing:border-box;flex-shrink:0;gap:14px;padding:3px 16px 3px 8px;border-radius:16px}
 .topbar .user-meta{min-width:110px}
 .topbar .user-meta strong{line-height:1.35;margin-bottom:2px}
}

/* v0.6.78 — both overview buttons receive a full navigation row. */
@media(min-width:900px){
  .side-nav,.sidebar-expanded .side-nav{
    grid-template-rows:minmax(112px,2fr) minmax(196px,4fr) minmax(112px,2fr) minmax(64px,1fr);
    overflow-y:auto;overflow-x:hidden;
  }
  .nav-section-items,.sidebar-expanded .nav-section-items{grid-auto-rows:minmax(40px,1fr)}
  .nav-item,.sidebar-expanded .nav-item{min-height:40px;align-items:center}
}

.history-entry-actions{margin-top:10px;display:flex;justify-content:flex-end}.history-delete-effects{padding-left:18px;line-height:1.6}.history-delete-effects li{margin:7px 0}

/* Settings categories, notification switches and quick help. */
.settings-tab-copy{display:flex;flex-direction:column;gap:3px;text-align:left;max-width:190px}.settings-tab-copy strong{font-size:13px;font-weight:600}.settings-tab-copy small{font-size:11px;font-weight:400;line-height:1.4;color:var(--text-secondary)}
.settings-notification-option{cursor:pointer;gap:24px}.settings-toggle{appearance:none;position:relative;flex-shrink:0;width:44px;height:26px;border:1px solid var(--border-strong);border-radius:20px;background:var(--surface-input);cursor:pointer;transition:background .15s}.settings-toggle::after{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;border-radius:50%;background:var(--text-secondary);transition:transform .15s}.settings-toggle:checked{background:var(--cyan);border-color:var(--cyan)}.settings-toggle:checked::after{transform:translateX(18px);background:var(--on-accent)}.settings-toggle:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
.settings-preference-footer{padding:18px 24px;font-size:12px;color:var(--text-secondary);line-height:1.6}.settings-preference-footer p{margin:0 0 4px;color:var(--text-main)}
.settings-help-guide details{padding:20px 24px;border-bottom:1px solid var(--border)}.settings-help-guide details:last-child{border-bottom:0}.settings-help-guide summary{cursor:pointer;font-size:14px;font-weight:600}.settings-help-guide p{font-size:13px;line-height:1.7;color:var(--text-secondary);margin:12px 0}.settings-help-guide .btn{margin-top:2px}
.settings-install-grid,.settings-about-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:24px}.settings-install-grid>div,.settings-about-grid>div{padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--surface-soft)}.settings-install-grid strong,.settings-about-grid strong{font-size:14px;line-height:1.5}.settings-install-grid p{font-size:13px;line-height:1.7;color:var(--text-secondary);margin:8px 0 0}.settings-about-grid span{display:block;color:var(--text-secondary);font-size:12px;margin-bottom:6px}.settings-about-heading{display:flex;align-items:center;gap:16px}.settings-about-icon{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;background:var(--accent-subtle);color:var(--cyan)}.settings-about-note{padding:0 24px 24px;margin:0;color:var(--text-secondary);font-size:13px;line-height:1.6}
@media(max-width:760px){.settings-install-grid,.settings-about-grid{grid-template-columns:1fr;padding:18px}.settings-help-guide details{padding:18px}.settings-preference-footer{padding:18px}.settings-tab-copy small{font-size:10px}.settings-notification-option{flex-wrap:nowrap}.settings-notification-option>div{min-width:0}}

/* Balanced settings layout and development credits. */
.settings-workspace{max-width:1120px}.settings-workspace>.page-toolbar{margin-bottom:24px}.settings-workspace .settings-menu{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:0 0 20px;margin-bottom:24px;align-items:stretch}.settings-workspace .settings-menu-item{width:100%;min-width:0;min-height:70px;padding:14px;gap:12px;flex:none;border:1px solid var(--border);background:var(--surface-soft);border-radius:12px}.settings-workspace .settings-menu-item.active{background:var(--surface-raised);border-color:var(--cyan)}.settings-workspace .settings-tab-copy{max-width:none;gap:4px}.settings-workspace .settings-tab-copy strong{font-size:14px;line-height:1.3}.settings-workspace .settings-tab-copy small{font-size:12px;line-height:1.4}.settings-workspace .settings-category-head{margin-bottom:20px}.settings-workspace .settings-category-head h2{font-size:22px;line-height:1.3}.settings-workspace .settings-content-head{padding:22px 24px;gap:18px}.settings-workspace .settings-content-head h3{font-size:17px}.settings-workspace .settings-content-head p{max-width:720px;line-height:1.65}.settings-workspace .settings-option-row{min-height:88px;padding:20px 24px}.settings-workspace .settings-option-row>div{min-width:0;max-width:760px}.settings-workspace .settings-option-row strong{line-height:1.5}.settings-workspace .settings-option-row p{margin-top:5px;max-width:720px}.settings-workspace .settings-option-row>.btn{min-width:136px;text-align:center}.settings-workspace .settings-install-grid{gap:14px;padding:22px 24px;align-items:stretch}.settings-workspace .settings-install-grid>div{padding:18px}.settings-workspace .settings-preference-footer{padding-top:16px;padding-bottom:16px;border-top:1px solid var(--border)}
.settings-developer-cover{position:relative;background:var(--surface);border-color:var(--border-strong)}.settings-developer-main{display:grid;grid-template-columns:184px minmax(0,1fr);gap:30px;align-items:center;padding:28px}.settings-developer-photo{margin:0;width:184px;height:184px;border:1px solid var(--border-strong);border-radius:18px;overflow:hidden;background:#07121d;box-shadow:0 8px 24px #0002}.settings-developer-photo img{display:block;width:100%;height:100%;object-fit:cover}.settings-eyebrow{display:block;font-size:11px;line-height:1.5;letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary);font-weight:600}.settings-developer-copy h3{font-size:30px;letter-spacing:-.025em;line-height:1.2;margin:8px 0;color:var(--text-main)}.settings-developer-role{font-size:15px;line-height:1.5;margin:0 0 14px;font-weight:550;color:var(--text-main)}.settings-developer-description{max-width:580px;margin:0;font-size:14px;line-height:1.75;color:var(--text-secondary)}.settings-developer-signature{display:flex;align-items:center;gap:8px;margin-top:18px;color:var(--cyan);font-size:12px;font-weight:600}.settings-developer-meta{display:grid;grid-template-columns:140px minmax(0,1fr) minmax(0,1fr);gap:24px;padding:20px 28px;border-top:1px solid var(--border);background:var(--surface-soft)}.settings-developer-meta span{display:block;font-size:11px;color:var(--text-secondary);line-height:1.4;margin-bottom:6px}.settings-developer-meta strong{display:block;font-size:13px;line-height:1.5;color:var(--text-main)}
@media(max-width:760px){.settings-workspace .settings-menu{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding-bottom:16px;margin-bottom:20px}.settings-workspace .settings-menu-item{min-height:66px;padding:12px;gap:9px}.settings-workspace .settings-tab-copy strong{font-size:13px}.settings-workspace .settings-tab-copy small{font-size:11px}.settings-workspace .settings-content-head,.settings-workspace .settings-option-row{padding:18px;min-height:0}.settings-workspace .settings-category-head h2{font-size:20px}.settings-workspace .settings-content-head h3{font-size:16px}.settings-workspace .settings-install-grid{padding:18px;gap:12px}.settings-developer-main{grid-template-columns:128px minmax(0,1fr);gap:20px;padding:22px}.settings-developer-photo{width:128px;height:128px;border-radius:14px}.settings-developer-copy h3{font-size:24px}.settings-developer-description{font-size:13px}.settings-developer-role{font-size:13px;margin-bottom:10px}.settings-developer-meta{grid-template-columns:repeat(3,minmax(0,1fr));padding:18px 22px;gap:16px}.settings-developer-meta strong{font-size:12px}}
@media(max-width:480px){.settings-developer-main{grid-template-columns:1fr;gap:18px;padding:22px}.settings-developer-photo{width:144px;height:144px}.settings-developer-copy h3{font-size:26px}.settings-developer-meta{grid-template-columns:1fr;gap:14px;padding:18px 22px}.settings-developer-meta>div{display:flex;justify-content:space-between;gap:16px;align-items:baseline}.settings-developer-meta span{margin:0;flex-shrink:0}.settings-developer-meta strong{text-align:right}.settings-workspace .settings-tab-copy small{font-size:10px}.settings-workspace .settings-option-row>.btn{min-width:0;width:100%}.settings-workspace .settings-menu-item{min-height:64px}.settings-workspace .settings-menu-item>.icon{width:16px;height:16px}}
html[data-font="large"] .settings-workspace .settings-tab-copy strong{font-size:16px}html[data-font="large"] .settings-workspace .settings-tab-copy small{font-size:13px}

/* Settings tabs stay beside the content. */
.settings-workspace{max-width:1240px}.settings-workspace .settings-frame{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:start}.settings-workspace .settings-menu{position:sticky;top:calc(var(--topbar-h) + 20px);display:flex;flex-direction:column;gap:8px;align-items:stretch;padding:0;margin:0;border-bottom:0}.settings-workspace .settings-menu-item{min-height:64px;flex:none}.settings-workspace .settings-menu-item.active{box-shadow:inset 3px 0 var(--cyan)}
@media(max-width:1000px){.settings-workspace .settings-frame{grid-template-columns:190px minmax(0,1fr);gap:20px}.settings-developer-main{grid-template-columns:128px minmax(0,1fr);gap:20px;padding:22px}.settings-developer-photo{width:128px;height:128px}.settings-developer-copy h3{font-size:26px}.settings-developer-meta{grid-template-columns:1fr;gap:14px}.settings-install-grid{grid-template-columns:1fr}}
@media(max-width:760px){.settings-workspace .settings-frame{grid-template-columns:52px minmax(0,1fr);gap:12px}.settings-workspace .settings-menu{position:static;display:flex;flex-direction:column;gap:8px;padding:0;margin:0}.settings-workspace .settings-menu-item{width:52px;height:52px;min-height:52px;padding:12px;justify-content:center}.settings-workspace .settings-menu-item .settings-tab-copy{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.settings-workspace .settings-menu-item>.icon{width:20px;height:20px}.settings-workspace .settings-content-head{padding:16px}.settings-workspace .settings-option-row{padding:16px}.settings-workspace .settings-content-head>.btn,.settings-workspace .settings-option-row>.btn{width:100%;min-width:0}.settings-workspace .settings-developer-main{grid-template-columns:1fr;padding:18px}.settings-workspace .settings-developer-copy h3{font-size:24px}.settings-workspace .settings-developer-meta{padding:18px}.settings-workspace .settings-developer-meta>div{display:block}.settings-workspace .settings-developer-meta strong{text-align:left}.settings-workspace .settings-developer-meta span{margin-bottom:5px}.settings-workspace .settings-install-grid,.settings-workspace .settings-help-guide details{padding:16px}.settings-workspace .settings-notification-option{gap:12px}}

/* Current tab identity stays beside the page title. */
.page-heading{display:flex;align-items:center;gap:9px;min-width:0;max-width:100%}.page-heading .page-title{min-width:0;flex:0 1 auto}.top-page-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 22px;width:22px;height:22px;color:var(--text-main)}.top-page-icon>.icon{display:block;width:20px;height:20px;flex:none}
@media(max-width:899px){.page-heading{gap:8px}.top-page-icon{flex-basis:20px;width:20px;height:20px}.top-page-icon>.icon{width:19px;height:19px}}