/* ===========================================================================
   SUMMIA — Design System
   Fonte da verdade: summia_brandkit (manual de marca, Alumbra 2026).
   Tudo abaixo é derivado do manual. Cores institucionais, tipografia e
   proporções não devem ser alteradas sem passar pelo manual.
   =========================================================================== */

/* ---------------------------------------------------------------- fontes -- */

@font-face{font-family:"Stack Sans";src:url("assets/fonts/StackSansHeadline-Light.ttf") format("truetype");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Stack Sans";src:url("assets/fonts/StackSansHeadline-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Stack Sans";src:url("assets/fonts/StackSansHeadline-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Stack Sans";src:url("assets/fonts/StackSansHeadline-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Stack Sans";src:url("assets/fonts/StackSansHeadline-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}

@font-face{font-family:"Instrument Sans";src:url("assets/fonts/InstrumentSans-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url("assets/fonts/InstrumentSans-Italic.ttf") format("truetype");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url("assets/fonts/InstrumentSans-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url("assets/fonts/InstrumentSans-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url("assets/fonts/InstrumentSans-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}

/* ================================================================ tokens == */
:root,.sm-light{
  color-scheme:light;

  /* --- primitivas de marca (manual, pág. "cores institucionais") --------- */
  --sm-roxo:#2c024c;       /* Pantone 2627 C — primária */
  --sm-lilas:#6c68d2;      /* Pantone 2366 C — primária */
  --sm-marfim:#fffff1;     /* Pantone White  — primária */
  --sm-neon:#e5ff4c;       /* Pantone 809 C  — secundária */
  --sm-laranja:#ff5a32;    /* Pantone 171 C  — secundária */
  --sm-bege:#e4e1d5;       /* Pantone 9080 C — secundária */
  --sm-branco:#ffffff;
  --sm-preto:#000000;

  /* --- rampas -------------------------------------------------------- */
  --sm-roxo-950:#16012a; --sm-roxo-900:#2c024c; --sm-roxo-800:#3a1160;
  --sm-roxo-700:#4a1d78; --sm-roxo-600:#5c2f93;

  --sm-lilas-50:#f0effc;  --sm-lilas-100:#e2e1f8; --sm-lilas-200:#c0bdee;
  --sm-lilas-300:#a9a6e7; --sm-lilas-400:#8481da; --sm-lilas-500:#6c68d2;
  --sm-lilas-600:#5b57c2; --sm-lilas-700:#4d49a8; --sm-lilas-800:#343173;
  --sm-lilas-900:#201e4a;

  --sm-neon-100:#f6ffcb; --sm-neon-300:#eeff8e; --sm-neon-500:#e5ff4c;
  --sm-neon-700:#b9d100; --sm-neon-900:#6d7c00;

  --sm-laranja-100:#ffe4db; --sm-laranja-300:#ffab90; --sm-laranja-500:#ff5a32;
  --sm-laranja-700:#d13b17; --sm-laranja-900:#8a2409;

  /* neutros quentes, derivados do marfim/bege — nunca cinza frio */
  --sm-n-0:#fffff1;  --sm-n-50:#fbfaef; --sm-n-100:#f3f1e5; --sm-n-200:#e4e1d5;
  --sm-n-300:#cfcbbd; --sm-n-400:#a8a498; --sm-n-500:#7a7288; --sm-n-600:#5a5170;
  --sm-n-700:#3e3352; --sm-n-800:#2c024c; --sm-n-900:#16012a;

  /* --- status (reservado; não usar como cor de série) ------------------ */
  --sm-ok:#16a06e;      --sm-ok-ink:#0b6647;   --sm-ok-bg:#e3f6ee;
  --sm-atencao:#b07800; --sm-atencao-ink:#7c5400; --sm-atencao-bg:#fdf3dd;
  --sm-erro:#c81e3c;    --sm-erro-ink:#8f0f26;  --sm-erro-bg:#fde7ea;  --sm-on-erro:#ffffff;
  --sm-info:#4d49a8;    --sm-info-ink:#343173;  --sm-info-bg:#e9e8fa;

  /* --- semânticos: claro ---------------------------------------------- */
  --sm-bg:#fffff1;
  --sm-surface:#ffffff;
  --sm-surface-2:#fbfaef;
  --sm-surface-3:#f3f1e5;
  --sm-border:#e4e1d5;
  --sm-border-strong:#cfcbbd;
  --sm-ink:#2c024c;
  --sm-ink-muted:#5a5170;
  --sm-ink-faint:#7a7288;
  --sm-ink-inverse:#fffff1;
  --sm-accent:#6c68d2;
  --sm-accent-hover:#5b57c2;
  --sm-accent-active:#4d49a8;
  --sm-accent-soft:#e2e1f8;
  --sm-on-accent:#fffff1;
  --sm-brand:#2c024c;
  --sm-brand-hover:#3a1160;
  --sm-on-brand:#fffff1;
  --sm-destaque:#e5ff4c;          /* neon: realce, nunca texto corrido */
  --sm-on-destaque:#2c024c;
  --sm-alerta-marca:#ff5a32;      /* laranja de marca: chamada, não erro */
  --sm-focus:#6c68d2;
  --sm-overlay:rgb(22 1 42 / .48);

  /* --- dataviz: claro (validado — ver foundations/dataviz) -------------- */
  --sm-viz-1:#6c68d2; --sm-viz-2:#ff5a32; --sm-viz-3:#1baf7a; --sm-viz-4:#eda100;
  --sm-viz-5:#e87ba4; --sm-viz-6:#008300; --sm-viz-7:#2a78d6; --sm-viz-8:#e34948;
  --sm-viz-seq-1:#a9a6e7; --sm-viz-seq-2:#8481da; --sm-viz-seq-3:#6c68d2;
  --sm-viz-seq-4:#4d49a8; --sm-viz-seq-5:#343173;
  --sm-viz-div-neg:#ff5a32; --sm-viz-div-mid:#eae7dd; --sm-viz-div-pos:#6c68d2;
  --sm-viz-grid:#eceadd;
  --sm-viz-axis:#7a7288;

  /* --- escala tipográfica --------------------------------------------- */
  --sm-font-display:"Stack Sans",system-ui,sans-serif;
  --sm-font-heading:"Stack Sans","Instrument Sans",system-ui,sans-serif;
  --sm-font-body:"Instrument Sans",system-ui,-apple-system,Segoe UI,sans-serif;

  --sm-text-display-1:clamp(40px,6vw,64px);
  --sm-text-display-2:clamp(30px,4vw,44px);
  --sm-text-h1:32px; --sm-text-h2:24px; --sm-text-h3:20px; --sm-text-h4:17px;
  --sm-text-lg:17px; --sm-text-md:15px; --sm-text-sm:13px; --sm-text-xs:12px;
  --sm-text-overline:11px;

  /* --- espaçamento (base 4) -------------------------------------------- */
  --sm-space-1:4px;  --sm-space-2:8px;  --sm-space-3:12px; --sm-space-4:16px;
  --sm-space-5:20px; --sm-space-6:24px; --sm-space-8:32px; --sm-space-10:40px;
  --sm-space-12:48px;--sm-space-16:64px;--sm-space-20:80px;

  /* --- raio -------------------------------------------------------------
     A marca é geométrica de terminações redondas: raio generoso é on-brand. */
  --sm-radius-xs:6px; --sm-radius-sm:8px; --sm-radius-md:12px;
  --sm-radius-lg:18px; --sm-radius-xl:26px; --sm-radius-pill:999px;

  /* --- elevação (sombra tingida de roxo, nunca preta) ------------------- */
  --sm-shadow-1:0 1px 2px rgb(44 2 76 / .06), 0 1px 3px rgb(44 2 76 / .05);
  --sm-shadow-2:0 2px 4px rgb(44 2 76 / .06), 0 6px 16px rgb(44 2 76 / .08);
  --sm-shadow-3:0 8px 20px rgb(44 2 76 / .10), 0 24px 48px rgb(44 2 76 / .12);
  --sm-shadow-focus:0 0 0 2px var(--sm-bg), 0 0 0 4px var(--sm-focus);

  /* --- movimento -------------------------------------------------------- */
  --sm-ease:cubic-bezier(.2,.8,.2,1);
  --sm-dur-1:120ms; --sm-dur-2:180ms; --sm-dur-3:260ms;

  /* --- grid / medidas --------------------------------------------------- */
  --sm-control-sm:32px; --sm-control-md:40px; --sm-control-lg:48px;
  --sm-measure:68ch;
}

/* --- semânticos: escuro ------------------------------------------------- */
:root[data-theme="dark"],.sm-dark{
  color-scheme:dark;
  --sm-bg:#16012a;
  --sm-surface:#240741;
  --sm-surface-2:#2c024c;
  --sm-surface-3:#3a1160;
  --sm-border:#43206b;
  --sm-border-strong:#5c3a89;
  --sm-ink:#fffff1;
  --sm-ink-muted:#c8bedb;
  --sm-ink-faint:#9a8db3;
  --sm-ink-inverse:#2c024c;
  --sm-accent:#8481da;
  --sm-accent-hover:#a9a6e7;
  --sm-accent-active:#c0bdee;
  --sm-accent-soft:#332a5e;
  --sm-on-accent:#16012a;
  --sm-brand:#e5ff4c;
  --sm-brand-hover:#eeff8e;
  --sm-on-brand:#2c024c;
  --sm-destaque:#e5ff4c;
  --sm-on-destaque:#2c024c;
  --sm-alerta-marca:#ff7a55;
  --sm-focus:#a9a6e7;
  --sm-overlay:rgb(10 0 20 / .66);

  --sm-ok:#3ec48f;      --sm-ok-ink:#a7ecd0;   --sm-ok-bg:#123b2e;
  --sm-atencao:#e0a020; --sm-atencao-ink:#f6d79a; --sm-atencao-bg:#40320f;
  --sm-erro:#f2647c;    --sm-erro-ink:#ffc2cd;  --sm-erro-bg:#45162a;  --sm-on-erro:#2c024c;
  --sm-info:#8481da;    --sm-info-ink:#c0bdee;  --sm-info-bg:#2a2456;

  --sm-viz-1:#8481da; --sm-viz-2:#d95926; --sm-viz-3:#199e70; --sm-viz-4:#c98500;
  --sm-viz-5:#d55181; --sm-viz-6:#008300; --sm-viz-7:#3987e5; --sm-viz-8:#e66767;
  --sm-viz-seq-1:#d2d0f3; --sm-viz-seq-2:#a9a6e7; --sm-viz-seq-3:#8481da;
  --sm-viz-seq-4:#6c68d2; --sm-viz-seq-5:#4d49a8;
  --sm-viz-div-neg:#d95926; --sm-viz-div-mid:#3a2b52; --sm-viz-div-pos:#8481da;
  --sm-viz-grid:#361a56;
  --sm-viz-axis:#9a8db3;

  --sm-shadow-1:0 1px 2px rgb(0 0 0 / .35);
  --sm-shadow-2:0 2px 4px rgb(0 0 0 / .35), 0 6px 16px rgb(0 0 0 / .38);
  --sm-shadow-3:0 8px 20px rgb(0 0 0 / .42), 0 24px 48px rgb(0 0 0 / .48);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --sm-bg:#16012a; --sm-surface:#240741; --sm-surface-2:#2c024c; --sm-surface-3:#3a1160;
    --sm-border:#43206b; --sm-border-strong:#5c3a89;
    --sm-ink:#fffff1; --sm-ink-muted:#c8bedb; --sm-ink-faint:#9a8db3; --sm-ink-inverse:#2c024c;
    --sm-accent:#8481da; --sm-accent-hover:#a9a6e7; --sm-accent-active:#c0bdee;
    --sm-accent-soft:#332a5e; --sm-on-accent:#16012a;
    --sm-brand:#e5ff4c; --sm-brand-hover:#eeff8e; --sm-on-brand:#2c024c;
    --sm-alerta-marca:#ff7a55; --sm-focus:#a9a6e7; --sm-overlay:rgb(10 0 20 / .66);
    --sm-ok:#3ec48f; --sm-ok-ink:#a7ecd0; --sm-ok-bg:#123b2e;
    --sm-atencao:#e0a020; --sm-atencao-ink:#f6d79a; --sm-atencao-bg:#40320f;
    --sm-erro:#f2647c; --sm-erro-ink:#ffc2cd; --sm-erro-bg:#45162a; --sm-on-erro:#2c024c;
    --sm-info:#8481da; --sm-info-ink:#c0bdee; --sm-info-bg:#2a2456;
    --sm-viz-1:#8481da; --sm-viz-2:#d95926; --sm-viz-3:#199e70; --sm-viz-4:#c98500;
    --sm-viz-5:#d55181; --sm-viz-6:#008300; --sm-viz-7:#3987e5; --sm-viz-8:#e66767;
    --sm-viz-seq-1:#d2d0f3; --sm-viz-seq-2:#a9a6e7; --sm-viz-seq-3:#8481da;
    --sm-viz-seq-4:#6c68d2; --sm-viz-seq-5:#4d49a8;
    --sm-viz-div-neg:#d95926; --sm-viz-div-mid:#3a2b52; --sm-viz-div-pos:#8481da;
    --sm-viz-grid:#361a56; --sm-viz-axis:#9a8db3;
    --sm-shadow-1:0 1px 2px rgb(0 0 0 / .35);
    --sm-shadow-2:0 2px 4px rgb(0 0 0 / .35), 0 6px 16px rgb(0 0 0 / .38);
    --sm-shadow-3:0 8px 20px rgb(0 0 0 / .42), 0 24px 48px rgb(0 0 0 / .48);
  }
}

/* ================================================================== base == */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--sm-bg);color:var(--sm-ink);
  font-family:var(--sm-font-body);font-size:var(--sm-text-md);line-height:1.6;
  -webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;
}
.sm-light,.sm-dark{background:var(--sm-bg);color:var(--sm-ink)}
::selection{background:var(--sm-destaque);color:var(--sm-on-destaque)}
:focus-visible{outline:2px solid var(--sm-focus);outline-offset:2px;border-radius:var(--sm-radius-xs)}
hr.sm-rule{border:0;border-top:1px solid var(--sm-border);margin:var(--sm-space-6) 0}

/* =========================================================== tipografia == */
.sm-display-1{font:700 var(--sm-text-display-1)/1.02 var(--sm-font-display);letter-spacing:.01em;text-transform:lowercase;margin:0}
.sm-display-2{font:700 var(--sm-text-display-2)/1.06 var(--sm-font-display);letter-spacing:.01em;text-transform:lowercase;margin:0}
.sm-title{font:700 var(--sm-text-h1)/1.12 var(--sm-font-display);letter-spacing:.04em;text-transform:uppercase;margin:0}
.sm-h1{font:600 var(--sm-text-h1)/1.2 var(--sm-font-heading);letter-spacing:-.01em;margin:0}
.sm-h2{font:600 var(--sm-text-h2)/1.25 var(--sm-font-heading);letter-spacing:-.01em;margin:0}
.sm-h3{font:600 var(--sm-text-h3)/1.3 var(--sm-font-heading);margin:0}
.sm-h4{font:600 var(--sm-text-h4)/1.4 var(--sm-font-heading);margin:0}
.sm-lead{font:400 var(--sm-text-lg)/1.6 var(--sm-font-body);color:var(--sm-ink-muted);margin:0;max-width:var(--sm-measure)}
.sm-body{font:400 var(--sm-text-md)/1.6 var(--sm-font-body);margin:0;max-width:var(--sm-measure)}
.sm-small{font:400 var(--sm-text-sm)/1.55 var(--sm-font-body);color:var(--sm-ink-muted);margin:0}
.sm-caption{font:400 var(--sm-text-xs)/1.45 var(--sm-font-body);color:var(--sm-ink-faint);margin:0}
.sm-overline{font:600 var(--sm-text-overline)/1 var(--sm-font-heading);letter-spacing:.14em;text-transform:uppercase;color:var(--sm-ink-faint);margin:0}
.sm-num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.sm-muted{color:var(--sm-ink-muted)}
.sm-faint{color:var(--sm-ink-faint)}

/* ============================================================== botões === */
.sm-btn{
  --_h:var(--sm-control-md);--_px:18px;--_fs:var(--sm-text-md);
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sm-space-2);
  height:var(--_h);padding:0 var(--_px);border-radius:var(--sm-radius-pill);
  font:600 var(--_fs)/1 var(--sm-font-body);letter-spacing:.01em;
  border:1px solid transparent;cursor:pointer;white-space:nowrap;text-decoration:none;
  transition:background var(--sm-dur-1) var(--sm-ease),border-color var(--sm-dur-1) var(--sm-ease),
             color var(--sm-dur-1) var(--sm-ease),transform var(--sm-dur-1) var(--sm-ease);
}
.sm-btn:active{transform:translateY(1px)}
.sm-btn:disabled,.sm-btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;transform:none}
.sm-btn--sm{--_h:var(--sm-control-sm);--_px:14px;--_fs:var(--sm-text-sm)}
.sm-btn--lg{--_h:var(--sm-control-lg);--_px:24px;--_fs:var(--sm-text-lg)}
.sm-btn--block{display:flex;width:100%}

.sm-btn--primary{background:var(--sm-accent);color:var(--sm-on-accent)}
.sm-btn--primary:hover:not(:disabled){background:var(--sm-accent-hover)}
.sm-btn--primary:active:not(:disabled){background:var(--sm-accent-active)}

.sm-btn--brand{background:var(--sm-brand);color:var(--sm-on-brand)}
.sm-btn--brand:hover:not(:disabled){background:var(--sm-brand-hover)}

.sm-btn--destaque{background:var(--sm-destaque);color:var(--sm-on-destaque)}
.sm-btn--destaque:hover:not(:disabled){background:var(--sm-neon-300)}

.sm-btn--secondary{background:transparent;color:var(--sm-ink);border-color:var(--sm-border-strong)}
.sm-btn--secondary:hover:not(:disabled){background:var(--sm-surface-3);border-color:var(--sm-ink-faint)}

.sm-btn--ghost{background:transparent;color:var(--sm-accent)}
.sm-btn--ghost:hover:not(:disabled){background:var(--sm-accent-soft)}

.sm-btn--danger{background:var(--sm-erro);color:var(--sm-on-erro)}
.sm-btn--danger:hover:not(:disabled){filter:brightness(.92)}

.sm-btn-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:var(--sm-control-md);height:var(--sm-control-md);padding:0;
  border-radius:var(--sm-radius-pill);border:1px solid var(--sm-border);
  background:var(--sm-surface);color:var(--sm-ink-muted);cursor:pointer;
  transition:background var(--sm-dur-1) var(--sm-ease),color var(--sm-dur-1) var(--sm-ease)
}
.sm-btn-icon:hover{background:var(--sm-surface-3);color:var(--sm-ink)}
.sm-btn-icon--sm{width:var(--sm-control-sm);height:var(--sm-control-sm)}

.sm-btn-group{display:inline-flex;background:var(--sm-surface-3);border-radius:var(--sm-radius-pill);padding:3px;gap:2px}
.sm-btn-group button{
  height:30px;padding:0 14px;border:0;background:transparent;cursor:pointer;
  border-radius:var(--sm-radius-pill);color:var(--sm-ink-muted);
  font:600 var(--sm-text-sm)/1 var(--sm-font-body);
}
.sm-btn-group button[aria-pressed="true"]{background:var(--sm-surface);color:var(--sm-ink);box-shadow:var(--sm-shadow-1)}

.sm-link{color:var(--sm-accent);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--sm-accent) 35%,transparent);font-weight:500}
.sm-link:hover{border-bottom-color:var(--sm-accent)}

/* =========================================================== formulários = */
.sm-field{display:flex;flex-direction:column;gap:6px}
.sm-label{font:600 var(--sm-text-sm)/1.3 var(--sm-font-body);color:var(--sm-ink)}
.sm-label .sm-req{color:var(--sm-alerta-marca);margin-left:2px}
.sm-help{font:400 var(--sm-text-xs)/1.45 var(--sm-font-body);color:var(--sm-ink-faint)}
.sm-error{font:500 var(--sm-text-xs)/1.45 var(--sm-font-body);color:var(--sm-erro-ink);display:flex;gap:6px;align-items:center}

.sm-input,.sm-select,.sm-textarea{
  width:100%;min-height:var(--sm-control-md);padding:9px 14px;
  background:var(--sm-surface);color:var(--sm-ink);
  border:1px solid var(--sm-border-strong);border-radius:var(--sm-radius-sm);
  font:400 var(--sm-text-md)/1.4 var(--sm-font-body);
  transition:border-color var(--sm-dur-1) var(--sm-ease),box-shadow var(--sm-dur-1) var(--sm-ease);
}
.sm-textarea{min-height:96px;resize:vertical;line-height:1.55}
.sm-input::placeholder,.sm-textarea::placeholder{color:var(--sm-ink-faint)}
.sm-input:hover,.sm-select:hover,.sm-textarea:hover{border-color:var(--sm-ink-faint)}
.sm-input:focus,.sm-select:focus,.sm-textarea:focus{
  outline:none;border-color:var(--sm-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--sm-accent) 22%,transparent)
}
.sm-input:disabled,.sm-select:disabled,.sm-textarea:disabled{background:var(--sm-surface-3);color:var(--sm-ink-faint);cursor:not-allowed}
.sm-field--invalid .sm-input,.sm-field--invalid .sm-select,.sm-field--invalid .sm-textarea{border-color:var(--sm-erro)}
.sm-field--invalid .sm-input:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--sm-erro) 22%,transparent)}
.sm-select{appearance:none;padding-right:38px;
  background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position:calc(100% - 20px) 52%,calc(100% - 14px) 52%;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat}

.sm-input-group{display:flex;align-items:center;gap:0;position:relative}
.sm-input-group .sm-input{padding-left:40px}
.sm-input-group svg{position:absolute;left:14px;width:16px;height:16px;color:var(--sm-ink-faint);pointer-events:none}

.sm-check{display:inline-flex;align-items:flex-start;gap:10px;cursor:pointer;font:400 var(--sm-text-md)/1.4 var(--sm-font-body)}
.sm-check input{
  appearance:none;flex:0 0 auto;width:20px;height:20px;margin:0;
  border:1.5px solid var(--sm-border-strong);background:var(--sm-surface);
  border-radius:var(--sm-radius-xs);cursor:pointer;position:relative;
  transition:background var(--sm-dur-1) var(--sm-ease),border-color var(--sm-dur-1) var(--sm-ease)
}
.sm-check input[type="radio"]{border-radius:50%}
.sm-check input:checked{background:var(--sm-accent);border-color:var(--sm-accent)}
.sm-check input[type="checkbox"]:checked::after{
  content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;
  border:solid var(--sm-on-accent);border-width:0 2px 2px 0;transform:rotate(42deg)
}
.sm-check input[type="radio"]:checked::after{
  content:"";position:absolute;inset:5px;border-radius:50%;background:var(--sm-on-accent)
}
.sm-check input:disabled{opacity:.45;cursor:not-allowed}

.sm-switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font:400 var(--sm-text-md)/1.4 var(--sm-font-body)}
.sm-switch input{appearance:none;margin:0;width:44px;height:26px;border-radius:var(--sm-radius-pill);
  background:var(--sm-border-strong);position:relative;cursor:pointer;transition:background var(--sm-dur-2) var(--sm-ease)}
.sm-switch input::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
  background:var(--sm-surface);box-shadow:var(--sm-shadow-1);transition:transform var(--sm-dur-2) var(--sm-ease)}
.sm-switch input:checked{background:var(--sm-accent)}
.sm-switch input:checked::after{transform:translateX(18px)}
.sm-switch input:disabled{opacity:.45;cursor:not-allowed}

/* ============================================================ superfícies = */
.sm-card{
  background:var(--sm-surface);border:1px solid var(--sm-border);
  border-radius:var(--sm-radius-md);padding:var(--sm-space-5);box-shadow:var(--sm-shadow-1)
}
.sm-card--flat{box-shadow:none}
.sm-card--raised{box-shadow:var(--sm-shadow-2)}
.sm-card--brand{background:var(--sm-roxo-900);border-color:var(--sm-roxo-800);color:var(--sm-marfim)}
.sm-card__head{display:flex;align-items:center;justify-content:space-between;gap:var(--sm-space-3);margin-bottom:var(--sm-space-3)}
.sm-panel{background:var(--sm-surface-2);border:1px solid var(--sm-border);border-radius:var(--sm-radius-md);padding:var(--sm-space-4)}

/* ============================================================== badges === */
.sm-badge{
  display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;
  border-radius:var(--sm-radius-pill);background:var(--sm-surface-3);color:var(--sm-ink-muted);
  font:600 var(--sm-text-xs)/1 var(--sm-font-body);letter-spacing:.01em;white-space:nowrap
}
.sm-badge--accent{background:var(--sm-accent-soft);color:var(--sm-info-ink)}
.sm-badge--ok{background:var(--sm-ok-bg);color:var(--sm-ok-ink)}
.sm-badge--atencao{background:var(--sm-atencao-bg);color:var(--sm-atencao-ink)}
.sm-badge--erro{background:var(--sm-erro-bg);color:var(--sm-erro-ink)}
.sm-badge--destaque{background:var(--sm-destaque);color:var(--sm-on-destaque)}
.sm-badge--outline{background:transparent;border:1px solid var(--sm-border-strong)}
.sm-badge__dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 auto}

.sm-tag{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 6px 0 12px;
  border-radius:var(--sm-radius-pill);border:1px solid var(--sm-border-strong);
  background:var(--sm-surface);color:var(--sm-ink);font:500 var(--sm-text-sm)/1 var(--sm-font-body)}
.sm-tag button{border:0;background:transparent;color:var(--sm-ink-faint);cursor:pointer;
  width:20px;height:20px;border-radius:50%;line-height:1;font-size:14px}
.sm-tag button:hover{background:var(--sm-surface-3);color:var(--sm-ink)}

.sm-avatar{display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;background:var(--sm-roxo-900);color:var(--sm-marfim);
  font:600 var(--sm-text-sm)/1 var(--sm-font-heading);letter-spacing:.02em;overflow:hidden;flex:0 0 auto}
.sm-avatar--lg{width:48px;height:48px;font-size:var(--sm-text-md)}
.sm-avatar--sm{width:28px;height:28px;font-size:var(--sm-text-xs)}
.sm-avatar--lilas{background:var(--sm-lilas-500)}
.sm-avatar--neon{background:var(--sm-neon-500);color:var(--sm-roxo-900)}
.sm-avatar--laranja{background:var(--sm-laranja-500);color:#fff}
.sm-avatar-stack{display:inline-flex}
.sm-avatar-stack .sm-avatar{margin-left:-10px;box-shadow:0 0 0 2px var(--sm-surface)}
.sm-avatar-stack .sm-avatar:first-child{margin-left:0}

/* ============================================================= feedback == */
.sm-alert{display:flex;gap:12px;padding:14px 16px;border-radius:var(--sm-radius-md);
  border:1px solid var(--sm-border);background:var(--sm-surface-2);align-items:flex-start}
.sm-alert__icon{flex:0 0 auto;width:20px;height:20px;display:grid;place-items:center;font-size:13px;font-weight:700;
  border-radius:50%;background:var(--sm-ink-faint);color:var(--sm-bg);margin-top:1px}
.sm-alert__body{min-width:0}
.sm-alert__title{font:600 var(--sm-text-md)/1.35 var(--sm-font-body);margin:0 0 2px}
.sm-alert--info{background:var(--sm-info-bg);border-color:color-mix(in srgb,var(--sm-info) 40%,transparent)}
.sm-alert--info .sm-alert__icon{background:var(--sm-info)}
.sm-alert--ok{background:var(--sm-ok-bg);border-color:color-mix(in srgb,var(--sm-ok) 40%,transparent)}
.sm-alert--ok .sm-alert__icon{background:var(--sm-ok)}
.sm-alert--atencao{background:var(--sm-atencao-bg);border-color:color-mix(in srgb,var(--sm-atencao) 40%,transparent)}
.sm-alert--atencao .sm-alert__icon{background:var(--sm-atencao)}
.sm-alert--erro{background:var(--sm-erro-bg);border-color:color-mix(in srgb,var(--sm-erro) 40%,transparent)}
.sm-alert--erro .sm-alert__icon{background:var(--sm-erro)}

.sm-toast{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--sm-radius-md);
  background:var(--sm-roxo-900);color:var(--sm-marfim);box-shadow:var(--sm-shadow-3);max-width:420px;
  border:1px solid var(--sm-roxo-700)}
.sm-toast .sm-toast__dot{width:8px;height:8px;border-radius:50%;background:var(--sm-neon-500);flex:0 0 auto}
.sm-toast button{margin-left:auto;background:transparent;border:0;color:var(--sm-lilas-200);cursor:pointer;
  font:600 var(--sm-text-sm)/1 var(--sm-font-body)}

.sm-empty{display:grid;place-items:center;gap:10px;text-align:center;padding:var(--sm-space-12) var(--sm-space-6);
  border:1px dashed var(--sm-border-strong);border-radius:var(--sm-radius-lg);background:var(--sm-surface-2)}
.sm-empty__mark{width:56px;height:56px;opacity:.5}

.sm-skeleton{border-radius:var(--sm-radius-sm);
  background:linear-gradient(90deg,var(--sm-surface-3) 25%,var(--sm-surface-2) 37%,var(--sm-surface-3) 63%);
  background-size:400% 100%;animation:sm-shimmer 1.4s var(--sm-ease) infinite}
@keyframes sm-shimmer{0%{background-position:100% 0}100%{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.sm-skeleton{animation:none}}

.sm-tooltip{position:relative;display:inline-flex}
.sm-tooltip__bubble{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);
  background:var(--sm-roxo-900);color:var(--sm-marfim);padding:6px 10px;border-radius:var(--sm-radius-xs);
  font:500 var(--sm-text-xs)/1.4 var(--sm-font-body);white-space:nowrap;box-shadow:var(--sm-shadow-2)}
.sm-tooltip__bubble::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);
  border:5px solid transparent;border-top-color:var(--sm-roxo-900)}

.sm-modal-scrim{position:relative;background:var(--sm-overlay);border-radius:var(--sm-radius-md);
  padding:var(--sm-space-8);display:grid;place-items:center}
.sm-modal{background:var(--sm-surface);border-radius:var(--sm-radius-lg);box-shadow:var(--sm-shadow-3);
  width:min(440px,100%);padding:var(--sm-space-6);border:1px solid var(--sm-border)}
.sm-modal__actions{display:flex;justify-content:flex-end;gap:var(--sm-space-2);margin-top:var(--sm-space-6)}

/* =========================================================== navegação === */
.sm-topbar{display:flex;align-items:center;gap:var(--sm-space-4);height:64px;padding:0 var(--sm-space-5);
  background:var(--sm-surface);border-bottom:1px solid var(--sm-border)}
.sm-topbar__logo{height:22px;width:auto;display:block}
.sm-topbar__spacer{margin-left:auto}

.sm-sidebar{width:248px;background:var(--sm-roxo-900);color:var(--sm-lilas-200);
  padding:var(--sm-space-5) var(--sm-space-3);display:flex;flex-direction:column;gap:2px;
  border-radius:var(--sm-radius-md);transition:width var(--sm-dur-3) var(--sm-ease)}
.sm-sidebar--collapsed{width:72px}
.sm-sidebar__brand{display:flex;align-items:center;gap:10px;padding:0 10px var(--sm-space-5)}
.sm-sidebar__group{font:600 var(--sm-text-overline)/1 var(--sm-font-heading);letter-spacing:.14em;
  text-transform:uppercase;color:color-mix(in srgb,var(--sm-lilas-200) 60%,transparent);padding:var(--sm-space-4) 12px var(--sm-space-2)}
.sm-nav-item{display:flex;align-items:center;gap:12px;height:40px;padding:0 12px;border-radius:var(--sm-radius-sm);
  color:var(--sm-lilas-200);text-decoration:none;font:500 var(--sm-text-sm)/1 var(--sm-font-body);
  transition:background var(--sm-dur-1) var(--sm-ease),color var(--sm-dur-1) var(--sm-ease);white-space:nowrap;overflow:hidden}
.sm-nav-item:hover{background:rgb(255 255 241 / .08);color:var(--sm-marfim)}
.sm-nav-item[aria-current="page"]{background:var(--sm-lilas-500);color:var(--sm-marfim)}
.sm-nav-item__icon{flex:0 0 auto;width:18px;height:18px}
.sm-nav-item__badge{margin-left:auto;background:var(--sm-neon-500);color:var(--sm-roxo-900);
  border-radius:var(--sm-radius-pill);padding:1px 7px;font:700 10px/1.6 var(--sm-font-body)}

.sm-tabs{display:flex;gap:var(--sm-space-5);border-bottom:1px solid var(--sm-border)}
.sm-tab{appearance:none;background:transparent;border:0;padding:0 0 12px;cursor:pointer;position:relative;
  color:var(--sm-ink-muted);font:600 var(--sm-text-md)/1 var(--sm-font-body)}
.sm-tab:hover{color:var(--sm-ink)}
.sm-tab[aria-selected="true"]{color:var(--sm-ink)}
.sm-tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;
  border-radius:3px 3px 0 0;background:var(--sm-accent)}

.sm-breadcrumb{display:flex;align-items:center;gap:8px;font:400 var(--sm-text-sm)/1 var(--sm-font-body);color:var(--sm-ink-faint);flex-wrap:wrap}
.sm-breadcrumb a{color:var(--sm-ink-muted);text-decoration:none}
.sm-breadcrumb a:hover{color:var(--sm-accent)}
.sm-breadcrumb [aria-current]{color:var(--sm-ink);font-weight:600}

.sm-pagination{display:flex;align-items:center;gap:4px}
.sm-pagination button{min-width:34px;height:34px;padding:0 8px;border-radius:var(--sm-radius-sm);
  border:1px solid transparent;background:transparent;color:var(--sm-ink-muted);cursor:pointer;
  font:500 var(--sm-text-sm)/1 var(--sm-font-body)}
.sm-pagination button:hover:not(:disabled){background:var(--sm-surface-3);color:var(--sm-ink)}
.sm-pagination button[aria-current="page"]{background:var(--sm-accent);color:var(--sm-on-accent)}
.sm-pagination button:disabled{opacity:.4;cursor:not-allowed}

/* ================================================================ dados == */
.sm-kpi{background:var(--sm-surface);border:1px solid var(--sm-border);border-radius:var(--sm-radius-md);
  padding:var(--sm-space-4) var(--sm-space-5);display:flex;flex-direction:column;gap:6px;min-width:0}
.sm-kpi__label{font:600 var(--sm-text-overline)/1 var(--sm-font-heading);letter-spacing:.14em;
  text-transform:uppercase;color:var(--sm-ink-faint)}
.sm-kpi__value{font:700 30px/1.05 var(--sm-font-display);letter-spacing:.01em;color:var(--sm-ink);font-variant-numeric:tabular-nums}
.sm-kpi__foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sm-kpi--destaque{border-color:var(--sm-neon-700);box-shadow:inset 3px 0 0 var(--sm-neon-500)}

.sm-delta{display:inline-flex;align-items:center;gap:4px;font:600 var(--sm-text-sm)/1 var(--sm-font-body);
  font-variant-numeric:tabular-nums}
.sm-delta--up{color:var(--sm-ok-ink)}
.sm-delta--down{color:var(--sm-erro-ink)}
.sm-delta--flat{color:var(--sm-ink-faint)}

.sm-meter{height:8px;border-radius:var(--sm-radius-pill);background:var(--sm-surface-3);overflow:hidden}
.sm-meter__fill{height:100%;border-radius:var(--sm-radius-pill);background:var(--sm-accent)}
.sm-meter__fill--destaque{background:var(--sm-neon-700)}
.sm-meter__fill--erro{background:var(--sm-erro)}

.sm-table-wrap{overflow-x:auto;border:1px solid var(--sm-border);border-radius:var(--sm-radius-md);background:var(--sm-surface)}
.sm-table{width:100%;border-collapse:collapse;font:400 var(--sm-text-sm)/1.5 var(--sm-font-body)}
.sm-table th{
  text-align:left;padding:12px 16px;background:var(--sm-surface-2);color:var(--sm-ink-faint);
  font:600 var(--sm-text-overline)/1 var(--sm-font-heading);letter-spacing:.12em;text-transform:uppercase;
  border-bottom:1px solid var(--sm-border);white-space:nowrap}
.sm-table td{padding:12px 16px;border-bottom:1px solid var(--sm-border);color:var(--sm-ink);vertical-align:middle}
.sm-table tbody tr:last-child td{border-bottom:0}
.sm-table tbody tr:hover td{background:var(--sm-surface-2)}
.sm-table .sm-td-num{text-align:right;font-variant-numeric:tabular-nums}
.sm-table caption{caption-side:top;text-align:left;padding:14px 16px 4px;font:600 var(--sm-text-md)/1.4 var(--sm-font-heading)}

/* ============================================================== estampa == */
.sm-estampa{background-repeat:repeat;background-size:220px auto}
.sm-estampa--roxo-neon{background-image:url("assets/pattern/modulo-estampa-roxo-e-neon.svg")}
.sm-estampa--bege-neon{background-image:url("assets/pattern/modulo-estampa-bege-e-neon.svg")}
.sm-estampa--bege-lilas{background-image:url("assets/pattern/modulo-estampa-bege-e-lilas.svg")}
.sm-estampa--laranja{background-image:url("assets/pattern/modulo-estampa-laranja.svg")}
.sm-estampa--lilas{background-image:url("assets/pattern/modulo-estampa-lilas.svg")}
.sm-estampa--bege{background-image:url("assets/pattern/modulo-estampa-bege.svg")}

/* ============================================================== utilidades */
.sm-stack{display:flex;flex-direction:column;gap:var(--sm-space-4)}
.sm-row{display:flex;align-items:center;gap:var(--sm-space-3);flex-wrap:wrap}
.sm-grid-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--sm-space-4)}
.sm-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}