:root{
  color-scheme:dark;
  /* escada de elevação: cada camada é ~+4% de luz sobre a anterior (base→…→overlay).
     overlay = diálogos/popover, o nível mais alto. Ver DESIGN-SYSTEM.md. */
  --bg:#0c0f16; --surface:#141926; --raised:#1b2233; --raised2:#222b40; --overlay:#2c3448;
  --border:#2a3550; --border-soft:#212a40;
  /* corpo a ~90% de branco (não puro): mata o "halation" que borra texto claro no escuro */
  --ink:#e2e6f0; --muted:#93a1bd; --faint:#63708c;
  --azul:#4ea8de;        /* Guaíba — progresso/acento */
  --azul-deep:#2f6690;
  --sunset:#f2a154;      /* pôr do sol — assinatura */
  --sunset-deep:#d97f43;
  --verde:#3fb984;       /* dominado */
  --amarelo:#e6b93f;     /* em progresso */
  --cinza:#5b6884;       /* não iniciado */
  --vermelho:#e2635a;
  --r:14px; --r-sm:9px;
  /* FAMÍLIAS — uma por Look, e todas de SISTEMA (zero download).
     Webfont está proibida aqui: o painel tem de abrir offline e por file://, e um @font-face
     de CDN quebraria os dois. Cada pilha lista Windows → Apple → Linux → genérica, então o
     Look sobrevive a qualquer máquina (degradando, nunca quebrando).
     Antes disto, 3 dos 4 Looks usavam a MESMA família (--sans) e só mudavam peso/tracking —
     era a queixa do Lukas ("os Looks parecem duplicados"). */
  --mono:ui-monospace,"Cascadia Mono",Consolas,"JetBrains Mono","Fira Code",monospace;
  --serif:"Sitka Text",Charter,"Iowan Old Style","Noto Serif",Constantia,Cambria,Georgia,serif;
  --sans:"Inter",system-ui,"Segoe UI","Cantarell",Roboto,"Helvetica Neue",sans-serif;
  --rounded:ui-rounded,"SF Pro Rounded",Candara,Corbel,"Cantarell",Ubuntu,system-ui,sans-serif;
  --display:Bahnschrift,"Archivo Black","Franklin Gothic Medium","Liberation Sans Narrow",system-ui,sans-serif;
  --grad:linear-gradient(120deg,#2f6690,#d97f43);   /* assinatura p/ CTAs (sobretudo no tema gradiente) */
  /* --- TOKENS DE ESTILO (eixo data-style; valor = literário/padrão) ---
     Cor fica acima (data-theme); aqui é só FORMA. Ver DESIGN-SYSTEM.md. */
  --font-title:var(--serif); --font-body:var(--sans); --lh-body:1.58;
  --fw-title:600; --ls-title:.2px; --title-transform:none;
  --radius:16px; --radius-sm:10px; --nav-radius:99px;
  --card-bd:1px solid var(--border-soft);
  --card-shadow:0 2px 10px rgba(0,0,0,.22);
  --motion:.28s; --eyebrow-ls:3px;
  /* escala de tipo (razão ~1.25) — macro-tipografia do Hero (Fase 2, RELATORIO §Tokens).
     --text-hero é fluido (clamp) e cada Look pode reescrevê-lo (mantém a distinção de forma). */
  --text-xs:11px; --text-sm:12.5px; --text-base:15px; --text-lg:18px;
  --text-xl:21px; --text-2xl:26px; --text-3xl:32px; --text-hero:clamp(1.9rem,3.4vw,2.7rem);
  /* escala de espaço (4/8/12/16/24/32/48) — um passo por vez, sem números soltos */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px;
  --side-w:236px;   /* it.10: largura da barra lateral do dashboard (só desktop ≥901px) */
}

.rf-card{margin:0 0 18px;padding:20px;max-width:100%;overflow-wrap:anywhere}
.rf-head{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.rf-head h2{margin:6px 0;font-family:var(--font-title);font-size:var(--text-2xl)}
.rf-head p,.rf-note{color:var(--muted);margin:4px 0 12px}
.rf-count{display:flex;gap:10px;align-content:start}
.rf-prova{display:grid;justify-items:center;min-width:104px;padding:8px 12px;background:var(--raised);border:1px solid var(--border-soft);border-radius:var(--radius-sm);text-align:center}
.rf-prova small{font-size:var(--text-sm);color:var(--muted);white-space:nowrap}
.rf-prova b{font-size:var(--text-2xl);line-height:1.1;color:var(--sunset)}
.rf-prova span{font-size:var(--text-sm);color:var(--muted)}
.rf-tasks{list-style:none;margin:8px 0;padding:0;display:grid;gap:8px}
.rf-task{padding:10px 12px;background:var(--raised);border:1px solid var(--border-soft);border-radius:var(--radius-sm)}
.rf-task label{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer}
.rf-task input{width:20px;height:20px;flex:none;accent-color:var(--azul)}
.rf-task.done label span{text-decoration:line-through;color:var(--muted)}
.rf-task button,.rf-past button{min-height:44px;margin:4px 8px 0 0;padding:8px 12px;background:var(--surface);color:var(--ink);border:1px solid var(--border);border-radius:var(--radius-sm);font:inherit;cursor:pointer}
.rf-task button:hover,.rf-past button:hover{border-color:var(--azul)}
.rf-link{display:inline-flex;align-items:center;min-height:44px;margin:4px 8px 0 0;padding:8px 12px;background:var(--surface);color:var(--azul);border:1px solid var(--border);border-radius:var(--radius-sm);text-decoration:none}
.rf-link:hover{border-color:var(--azul)}
.rf-task small{display:block;color:var(--muted);margin-left:30px}
.rf-past{border-left:3px solid var(--sunset);padding:10px 0 10px 14px;margin:12px 0;background:var(--raised)}
.rf-card details{margin-top:12px;border-top:1px solid var(--border);padding-top:8px}
.rf-card summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:600}
.rf-future>div{border-top:1px solid var(--border-soft);padding:12px 0}
.rf-future .rf-tasks{gap:4px}.rf-future .rf-task{padding:4px 8px}
.rf-future .rf-task button{font-size:var(--text-sm)}
@media(max-width:600px){.rf-card{padding:14px}.rf-head h2{font-size:var(--text-xl)}}
/* Sem alterar o repouso: foco de teclado e atalho para o conteúdo. */
:where(button,a,[role=button],input,select,summary){touch-action:manipulation}
:where(button,a,select,input,textarea,summary):focus-visible{outline:2px solid var(--sunset);outline-offset:3px}
h1,h2,h3{text-wrap:balance}
.skip-link{position:fixed;top:8px;left:8px;z-index:400;padding:10px 16px;background:var(--surface);color:var(--ink);clip-path:inset(50%)}
.skip-link:focus{clip-path:none}
#toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:300;background:var(--raised);border:1px solid var(--border);color:var(--ink);padding:11px 18px;border-radius:99px;font-size:13px;box-shadow:0 8px 24px rgba(0,0,0,.4);transition:opacity .3s;opacity:0;pointer-events:none}
/* ============================================================
   TEMAS — escuro (padrão, acima) · claro · gradiente
   Cada tema só reescreve as VARIÁVEIS + os poucos fundos que eram
   hardcoded (body, header, hero, backdrop). Todo componente herda
   das vars, então a troca vale para o painel inteiro de graça.
   O <script> no <head> aplica o tema salvo ANTES do paint (sem flash).
   ============================================================ */
/* GUAÍBA — "pôr do sol no Guaíba": base azul-marinho (a água) com o âmbar
   como acento RARO (o sol). Variante escura FRIA, nativa do Look Linear.
   Paleta do RELATORIO-DESIGN.md (§5): hue ~215°, ink 90/64/44, hairline inset. */
:root[data-theme="guaiba"]{
  --bg:#070f1e; --surface:#0e1a33; --raised:#16284b; --raised2:#1d3159; --overlay:#213a6e;
  --border:rgba(255,255,255,.10); --border-soft:rgba(255,255,255,.06);
  --ink:rgba(255,255,255,.90); --muted:rgba(255,255,255,.64); --faint:rgba(255,255,255,.44);
  --azul:#5aa2e0; --azul-deep:#2f6690;
  --sunset:#f06529; --sunset-deep:#e85b20;   /* âmbar flamejante (§5 do relatório) */
  --card-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 8px 24px -6px rgba(3,8,20,.6);
}
:root[data-theme="guaiba"] header.top{background:rgba(7,15,30,.82)}
:root[data-theme="guaiba"] .hero{background:linear-gradient(180deg,#0e1a33,#070f1e)}
:root[data-theme="guaiba"] dialog::backdrop{background:rgba(4,9,20,.72)}
:root[data-theme="claro"]{
  color-scheme:light;
  --bg:#eef1f8; --surface:#ffffff; --raised:#f1f4fa; --raised2:#e6ebf5; --overlay:#ffffff;
  --border:#cfd8e8; --border-soft:#e2e8f2;
  --ink:#1a2231; --muted:#53607a; --faint:#8791a6;
  --azul:#2f7fc0; --azul-deep:#255f92;
  --sunset:#d9772f; --sunset-deep:#bd6222;
  --verde:#2e9f6e; --amarelo:#bf8e16; --cinza:#8592ab; --vermelho:#d5504a;
  --grad:linear-gradient(120deg,#3f8fd0,#e58a3c);
}
:root[data-theme="claro"] body{
  background-image:radial-gradient(1100px 560px at 80% -10%, rgba(217,119,47,.10), transparent 60%),
                   radial-gradient(820px 460px at 10% 0%, rgba(47,127,192,.10), transparent 55%);
}
:root[data-theme="claro"] header.top{background:rgba(255,255,255,.82)}
:root[data-theme="claro"] .hero{background:linear-gradient(180deg,#ffffff,#eef2fa)}
:root[data-theme="claro"] .nav button.on{color:#2a1c07}
:root[data-theme="claro"] dialog::backdrop{background:rgba(30,40,60,.35)}
:root[data-theme="claro"] ::selection{background:rgba(217,119,47,.22)}

:root[data-theme="gradiente"]{
  --bg:#0a0e24; --surface:#141a35; --raised:#1e2650; --raised2:#28315f; --overlay:#333d70;
  --border:#34407e; --border-soft:#28315f;
  --ink:#e3e6f3; --muted:#a6b0d6; --faint:#717ca8;
  --azul:#5b8def; --azul-deep:#3a5fc0;
  --sunset:#f6a24e; --sunset-deep:#e07f3c;
  --verde:#40c58c; --amarelo:#ecc04a; --cinza:#5f6b96; --vermelho:#ef6a63;
  --grad:linear-gradient(120deg,#6d5efc,#b455e8 48%,#f2884e);
}
:root[data-theme="gradiente"] body{
  background-image:radial-gradient(1200px 620px at 82% -8%, rgba(180,85,232,.18), transparent 60%),
                   radial-gradient(1000px 560px at 8% -4%, rgba(109,94,252,.16), transparent 58%),
                   radial-gradient(900px 520px at 60% 108%, rgba(242,136,78,.10), transparent 60%);
}
:root[data-theme="gradiente"] header.top{background:rgba(10,12,32,.82)}
:root[data-theme="gradiente"] .hero{background:linear-gradient(135deg,#1a1b4b,#2a1c52 55%,#3a2140)}
:root[data-theme="gradiente"] .btn.primary{background:var(--grad);color:#fff;border:none}
:root[data-theme="gradiente"] .btn.primary:hover{filter:brightness(1.08)}
:root[data-theme="gradiente"] .nav button.on{background:var(--grad);color:#fff}
:root[data-theme="gradiente"] #botNav button.on{color:#c39bff}

/* CAMPO — "observatório de campo": kraft/papel, terroso, LUZ (diferente dos outros, que são
   escuros por padrão). Nativo do Look Campo. Proposto 27/07/2026 (DESIGN-SYSTEM §③, opção 1). */
:root[data-theme="campo"]{
  color-scheme:light;
  --bg:#f4ecdc; --surface:#f8f2e6; --raised:#efe6d0; --raised2:#e8dcc0; --overlay:#ffffff;
  --border:#d9c9a0; --border-soft:#e6d9b8;
  --ink:#2b2418; --muted:#6b5a34; --faint:#a08e64;
  --azul:#5c6b3f; --azul-deep:#46512e;         /* verde-musgo faz o papel do "cavalo de batalha" */
  --sunset:#c9803a; --sunset-deep:#a8672c;     /* âmbar/terracota — acento raro */
  --verde:#4a7c3f; --amarelo:#b8860b; --cinza:#9a8c6f; --vermelho:#b6453c;
  --card-shadow:0 2px 8px rgba(80,60,20,.14);
  --grad:linear-gradient(120deg,#5c6b3f,#c9803a);
}
:root[data-theme="campo"] header.top{background:rgba(244,236,220,.85)}
:root[data-theme="campo"] .hero{background:linear-gradient(180deg,#f8f2e6,#efe6d0)}
:root[data-theme="campo"] .nav button.on{color:#2b2418}
:root[data-theme="campo"] dialog::backdrop{background:rgba(40,30,15,.35)}
:root[data-theme="campo"] ::selection{background:rgba(201,128,58,.22)}

/* MISSÃO — "sala de controle de missão": quase-preto + verde-fósforo, terminal/CRT retrô.
   Nativo do Look Missão. Proposto 27/07/2026 (DESIGN-SYSTEM §③, opção 2). */
:root[data-theme="missao"]{
  --bg:#050705; --surface:#0a0f0a; --raised:#0e1a0e; --raised2:#142614; --overlay:#1a331a;
  --border:rgba(79,255,160,.18); --border-soft:rgba(79,255,160,.08);
  --ink:#cdf5da; --muted:#7fd9a0; --faint:#4a7a5c;
  --azul:#4fffa0; --azul-deep:#2fdc7c;
  --sunset:#e0a339; --sunset-deep:#c98a2a;     /* âmbar continua o acento raro, agora alerta sobre verde */
  --verde:#4fffa0; --amarelo:#e0d34f; --cinza:#3a5c46; --vermelho:#ff5f5f;
  --card-shadow:inset 0 0 0 1px rgba(79,255,160,.12),0 1px 2px rgba(0,0,0,.6);
  --grad:linear-gradient(120deg,#0e2a16,#2fdc7c);
}
:root[data-theme="missao"] header.top{background:rgba(5,7,5,.88)}
:root[data-theme="missao"] .hero{background:linear-gradient(180deg,#0a0f0a,#050705)}
:root[data-theme="missao"] dialog::backdrop{background:rgba(2,4,2,.78)}
:root[data-theme="missao"] ::selection{background:rgba(79,255,160,.22)}

/* BORDO — "diário de bordo náutico": variação do Guaíba, azul-marinho + dourado envelhecido
   em vez de âmbar vivo. Nativo do Look Bordo. Proposto 27/07/2026 (DESIGN-SYSTEM §③, opção 3). */
:root[data-theme="bordo"]{
  --bg:#0c1c33; --surface:#122844; --raised:#1a355a; --raised2:#22436e; --overlay:#2a5384;
  --border:rgba(201,162,74,.16); --border-soft:rgba(201,162,74,.08);
  --ink:#e8d9b0; --muted:rgba(232,217,176,.64); --faint:rgba(232,217,176,.42);
  --azul:#4a7ab0; --azul-deep:#2f567f;
  --sunset:#c9a24a; --sunset-deep:#a8842e;     /* dourado envelhecido — acento raro */
  --verde:#4a9c6e; --amarelo:#b89030; --cinza:#5c6f8a; --vermelho:#c65c50;
  --card-shadow:inset 0 0 0 1px rgba(201,162,74,.10),0 8px 22px -6px rgba(3,10,20,.55);
  --grad:linear-gradient(120deg,#2f567f,#c9a24a);
}
:root[data-theme="bordo"] header.top{background:rgba(12,28,51,.85)}
:root[data-theme="bordo"] .hero{background:linear-gradient(180deg,#122844,#0c1c33)}
:root[data-theme="bordo"] dialog::backdrop{background:rgba(4,10,20,.72)}
:root[data-theme="bordo"] ::selection{background:rgba(201,162,74,.22)}

/* ============================================================
   LOOKS (eixo data-style) — 4 referências nomeadas. Só FORMA, nunca cor
   (a cor entra pelo tema NATIVO de cada Look, aplicado junto no JS).
   O :root já traz a LITERÁRIA (padrão/revista literária). Ver DESIGN-SYSTEM.md.
   v1 — a fidelidade fina (o que faz "Linear ser Linear") virá do Deep Research.
   ============================================================ */

/* LINEAR — técnico/DENSO: sans apertada, hairline, cantos retos, abas quadradas, movimento seco.
   Assinatura de forma: densidade (entrelinha curta) + versalete mono minúsculo (rótulo de engenharia). */
:root[data-style="linear"]{
  --font-title:var(--sans);          /* grotesca neutra: a precisão do Linear é NÃO ter voz */
  --fw-title:600; --ls-title:-.4px; --eyebrow-ls:.8px;
  --lh-body:1.45; --radius:6px; --radius-sm:5px; --nav-radius:6px; --text-hero:clamp(1.7rem,3vw,2.2rem);
  /* hairline inset = a "placa de vidro" do Linear (relatório §2), lida sobre a navy Guaíba */
  --card-bd:1px solid var(--border-soft); --card-shadow:inset 0 0 0 1px rgba(255,255,255,.05),0 1px 2px rgba(0,0,0,.4);
  --motion:.13s;
}
:root[data-style="linear"] .hero h1{letter-spacing:-.6px}
:root[data-style="linear"] h2.section{font-size:21px}
:root[data-style="linear"] .eyebrow{font-family:var(--mono);text-transform:uppercase;font-size:9.5px;letter-spacing:.8px;color:var(--faint)}

/* ATELIÊ — Things 3 / Apple: sereno, AREJADO, LEVE. Título fino (500), sem borda (separa por
   espaço), entrelinha generosa, eyebrow em caixa-baixa gentil. */
:root[data-style="atelie"]{
  /* humanista de traço macio (Candara no Windows, SF Rounded na Apple, Cantarell no Linux):
     é a fonte que carrega o "sereno" — e aqui ela vale também no CORPO, não só no título. */
  --font-title:var(--rounded); --font-body:var(--rounded);
  --fw-title:500; --ls-title:-.2px; --eyebrow-ls:.4px;
  --lh-body:1.68; --radius:16px; --radius-sm:11px; --nav-radius:99px;
  --card-bd:1px solid transparent;               /* separa por espaço, não por borda */
  --card-shadow:0 1px 3px rgba(15,23,42,.06); --motion:.3s;
}
:root[data-style="atelie"] .hero h1{letter-spacing:-.3px}
:root[data-style="atelie"] h2.section{font-size:24px}
:root[data-style="atelie"] .eyebrow{font-family:var(--rounded);text-transform:none;font-weight:500;font-size:11.5px;letter-spacing:.3px;color:var(--faint)}
:root[data-style="atelie"] .card{padding:22px}
:root[data-style="atelie"] .home-discs{gap:16px}

/* AURORA — Arc / Vercel: moderno, OUSADO. Display pesadíssimo (800), escala grande, sombra
   profunda, eyebrow versalete forte, movimento elástico. */
:root[data-style="aurora"]{
  /* display de verdade (Bahnschrift/DIN no Windows, Archivo Black, Franklin Gothic):
     estreita e pesada — o Hero macro vira cartaz, que é o ponto do Aurora. */
  --font-title:var(--display); --fw-title:800; --ls-title:-.8px; --eyebrow-ls:1.8px;
  --lh-body:1.52; --radius:18px; --radius-sm:13px; --nav-radius:99px; --text-hero:clamp(2.15rem,3.9vw,3rem);
  --card-bd:1px solid var(--border-soft); --card-shadow:0 10px 34px rgba(0,0,0,.34);
  --motion:.42s;
}
:root[data-style="aurora"] .hero h1{letter-spacing:-1px;line-height:1.05}
:root[data-style="aurora"] h2.section{font-size:28px}
:root[data-style="aurora"] .eyebrow{font-family:var(--sans);text-transform:uppercase;font-weight:700;font-size:10.5px;letter-spacing:1.8px}

/* CAMPO — caderno de campo: título em TYPEWRITER (Courier New — diário datilografado),
   corpo em sans pra legibilidade. Precisa ser distinto da Literária (Sitka Text) e da
   Missão (Cascadia Mono no corpo TAMBÉM) — aqui só o título é mono, o corpo continua sans.
   Proposto 27/07/2026 (DESIGN-SYSTEM §③, opção 1). */
:root[data-style="campo"]{
  --font-title:"Courier New",Courier,"Cascadia Mono",monospace; --font-body:var(--sans);
  --fw-title:600; --ls-title:.2px; --eyebrow-ls:2px;
  --lh-body:1.62; --radius:14px; --radius-sm:10px; --nav-radius:99px; --text-hero:clamp(1.85rem,3.3vw,2.6rem);
  --card-bd:1px solid var(--border-soft); --card-shadow:0 2px 8px rgba(80,60,20,.14);
  --motion:.3s;
}
:root[data-style="campo"] .hero h1{letter-spacing:.1px}
:root[data-style="campo"] h2.section{font-size:24px}
:root[data-style="campo"] .eyebrow{font-family:var(--serif);font-style:italic;text-transform:none;font-size:12px;letter-spacing:.5px;color:var(--faint)}

/* MISSÃO — terminal/CRT: mono em tudo, cantos retos, sem sombra (só hairline), movimento seco.
   Proposto 27/07/2026 (DESIGN-SYSTEM §③, opção 2). */
:root[data-style="missao"]{
  --font-title:var(--mono); --font-body:var(--mono);
  --fw-title:700; --ls-title:0px; --eyebrow-ls:1px;
  --lh-body:1.5; --radius:2px; --radius-sm:2px; --nav-radius:2px; --text-hero:clamp(1.6rem,3vw,2.15rem);
  --card-bd:1px solid var(--border); --card-shadow:inset 0 0 0 1px rgba(79,255,160,.12);
  --motion:.08s;
}
:root[data-style="missao"] .hero h1{letter-spacing:0}
:root[data-style="missao"] h2.section{font-size:21px}
:root[data-style="missao"] .eyebrow{font-family:var(--mono);text-transform:uppercase;font-size:10px;letter-spacing:1px;color:var(--faint)}

/* BORDO — diário náutico: serif de mapa antigo (Cambria — precisa ser DIFERENTE da Sitka Text
   da Literária, senão vira duplicado, ver probe-looks.js), dourado nas bordas.
   Proposto 27/07/2026 (DESIGN-SYSTEM §③, opção 3). */
:root[data-style="bordo"]{
  --font-title:Cambria,"Constantia","PT Serif",Georgia,serif; --font-body:var(--sans);
  --fw-title:600; --ls-title:.4px; --eyebrow-ls:2.5px;
  --lh-body:1.6; --radius:10px; --radius-sm:8px; --nav-radius:99px; --text-hero:clamp(1.85rem,3.3vw,2.6rem);
  --card-bd:1px solid var(--border); --card-shadow:inset 0 0 0 1px rgba(201,162,74,.12),0 6px 20px -6px rgba(3,10,20,.5);
  --motion:.32s;
}
:root[data-style="bordo"] .hero h1{letter-spacing:.2px}
:root[data-style="bordo"] h2.section{font-size:25px}
:root[data-style="bordo"] .eyebrow{font-family:var(--serif);text-transform:uppercase;font-size:11px;letter-spacing:2.5px;color:var(--faint)}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden;max-width:100%}
img{max-width:100%;height:auto}
body{background:var(--bg);color:var(--ink);font-family:var(--font-body);line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased;font-size:15px;
  background-image:radial-gradient(1200px 600px at 78% -8%, rgba(242,161,84,.10), transparent 60%),
                   radial-gradient(900px 500px at 12% 0%, rgba(78,168,222,.09), transparent 55%);
  background-attachment:fixed;}
/* font-variant-numeric:inherit — form controls NÃO herdam variante numérica do body por
   padrão (UA stylesheet), então o lining-nums do Ateliê não chegava nos cards que são
   <button> (ex.: os de disciplina, ".hd"), e o "0/13" saía com zero de estilo antigo. */
button{font-family:inherit;font-variant-numeric:inherit;color:inherit;cursor:pointer;border:none;background:none}
input,select,textarea{font-family:inherit;font-size:inherit;font-variant-numeric:inherit;color:var(--ink)}
/* fundo escuro padrão p/ qualquer select (evita select "lavado" fora de .toolbar, ex. Análise) */
select{background:var(--raised);border:1px solid var(--border);border-radius:8px;padding:6px 9px}
select option{background:var(--surface);color:var(--ink)}
::selection{background:rgba(242,161,84,.28)}
.mono{font-family:var(--mono)}

/* ---------- Layout ---------- */
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
header.top{position:sticky;top:0;z-index:50;backdrop-filter:blur(12px);
  background:rgba(12,15,22,.82);border-bottom:1px solid var(--border-soft)}
.top-in{display:flex;align-items:center;gap:18px;padding:12px 20px;max-width:1180px;margin:0 auto;flex-wrap:wrap}
.brand{display:flex;align-items:baseline;gap:10px;font-family:var(--font-title)}
.brand .h{font-size:20px;font-weight:var(--fw-title);letter-spacing:var(--ls-title)}
.brand .sub{font-family:var(--mono);font-size:10.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--faint)}
/* Anotações — linha de leitura, não card; o card é a caixa toda. */
.nota-tipo{display:flex;gap:6px;margin-bottom:10px}
.nota-tipo button{padding:8px 14px;min-height:40px;border-radius:var(--radius-sm);border:1px solid var(--border);
  background:var(--raised);color:var(--muted);font:inherit;font-size:13.5px;cursor:pointer}
.nota-tipo button.on{background:var(--surface);color:var(--ink);border-color:var(--sunset);font-weight:600}
#tab-notas textarea{width:100%;padding:10px;border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--surface);color:var(--ink);font:inherit;font-size:16px;resize:vertical;line-height:1.45}
.nota-add{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.nota-add input{flex:1;min-width:160px;padding:10px;border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--surface);color:var(--ink);font:inherit;font-size:16px}
.nota{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--border-soft)}
.nota:last-child{border-bottom:0}
.nota-ic{font-size:15px;line-height:1.5}
.nota-corpo{flex:1;min-width:0;display:flex;flex-direction:column}
.nota-txt{white-space:pre-wrap;overflow-wrap:anywhere}
.nota-meta{font-size:11.5px;color:var(--faint);margin-top:2px}
.nota.feita .nota-txt{color:var(--faint);text-decoration:line-through}
.nota-export{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px;
  padding-top:12px;border-top:1px solid var(--border-soft)}
.nota-aviso{font-size:12px;color:var(--muted)}
.muted-p{color:var(--muted);font-size:13.5px}

.nav{display:flex;gap:2px;margin-left:auto;flex-wrap:wrap}
.nav button{padding:7px 13px;border-radius:var(--nav-radius);font-size:13.5px;font-weight:500;color:var(--muted);
  transition:.15s;white-space:nowrap}
.nav button:hover{color:var(--ink);background:var(--raised)}
.nav button.on{color:var(--bg);background:var(--sunset);font-weight:600}
.course-pick{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--muted)}
.course-pick select{background:var(--raised);border:1px solid var(--border);border-radius:8px;padding:5px 8px;font-size:12.5px}
.profile-pick{display:flex;align-items:center;gap:4px}
.profile-pick select{background:var(--raised);border:1px solid var(--border);border-radius:8px;padding:5px 9px;font-size:12.5px;font-weight:600;color:var(--ink)}
.profile-pick .pbtn{width:28px;height:28px;border-radius:8px;background:var(--raised);border:1px solid var(--border);color:var(--muted);font-size:13px;line-height:1;display:flex;align-items:center;justify-content:center}
.profile-pick .pbtn:hover{color:var(--ink);border-color:var(--azul)}
/* Seletor de tema (segmentado) — preferência POR APARELHO (não sincroniza) */
.pick-lb{display:none}   /* rótulo "estilo"/"tema": só aparece na barra lateral do desktop */
.theme-pick{display:flex;gap:2px;background:var(--raised);border:1px solid var(--border);border-radius:99px;padding:2px}
.theme-pick button{width:30px;height:26px;border-radius:99px;font-size:13px;line-height:1;color:var(--faint);display:flex;align-items:center;justify-content:center;transition:.15s}
.theme-pick button:hover{color:var(--ink)}
.theme-pick button.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.28)}
/* Seletor de ESTILO (design) — mesmo padrão do de tema, eixo separado */
.style-pick{display:flex;gap:2px;background:var(--raised);border:1px solid var(--border);border-radius:99px;padding:2px}
.style-pick button{width:30px;height:26px;border-radius:99px;font-size:13px;line-height:1;color:var(--faint);display:flex;align-items:center;justify-content:center;transition:.15s}
.style-pick button:hover{color:var(--ink)}
.style-pick button.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.28)}
.theme-pick .sw{width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(128,128,128,.55);background:linear-gradient(135deg,var(--b) 50%,var(--a) 50%)}
#configAparencia .theme-pick .sw{width:22px;height:22px}
.theme-pick button.on .sw{box-shadow:inset 0 0 0 1px rgba(128,128,128,.55),0 0 0 2px var(--surface),0 0 0 3.5px var(--sunset)}
.style-pick button svg{width:15px;height:15px}
#configAparencia .style-pick button svg{width:20px;height:20px}
button[data-theme="escuro"]>.sw{--b:#0c0f16;--a:#f2a154}
button[data-theme="guaiba"]>.sw{--b:#070f1e;--a:#f06529}
button[data-theme="claro"]>.sw{--b:#eef1f8;--a:#d9772f}
button[data-theme="gradiente"]>.sw{background:linear-gradient(120deg,#6d5efc,#b455e8 48%,#f2884e)}
button[data-theme="campo"]>.sw{--b:#f4ecdc;--a:#c9803a}
button[data-theme="missao"]>.sw{--b:#050705;--a:#e0a339}
button[data-theme="bordo"]>.sw{--b:#0c1c33;--a:#c9a24a}
/* Seletor de POSIÇÃO DA NAV (eixo data-nav) — 3º eixo, mesmo padrão dos de cima.
   display:none por padrão: SÓ aparece no desktop (a it.10 o liga). No celular a nav é
   sempre a barra inferior, então moldar a posição não faz sentido lá. Ver DESIGN-SYSTEM.md. */
.nav-pick{display:none;gap:2px;background:var(--raised);border:1px solid var(--border);border-radius:99px;padding:2px}
.nav-pick button{width:30px;height:26px;border-radius:99px;font-size:14px;line-height:1;color:var(--faint);display:flex;align-items:center;justify-content:center;transition:.15s}
.nav-pick button:hover{color:var(--ink)}
.nav-pick button.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.28)}
.appearance-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:34px}
.ap-grid{display:grid;gap:16px}
.ap-sec{display:grid;gap:8px}
.ap-sec .ap-lb{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint)}
#configAparencia .style-pick,#configAparencia .theme-pick,#configAparencia .nav-pick{width:max-content;max-width:100%;flex-wrap:wrap;border-radius:14px;padding:4px}
#configAparencia .style-pick button,#configAparencia .theme-pick button,#configAparencia .nav-pick button{width:44px;height:44px;font-size:16px;border-radius:10px}
/* Transição de aparência (troca de Look/tema): um "pôr-do-sol" cobre a tela por ~450ms
   e o swap acontece no pico, escondendo o reflow. Respeita prefers-reduced-motion (JS pula). */
#fxWipe{position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:0;
  transition:opacity .2s ease;
  background:radial-gradient(60% 55% at 50% 62%, rgba(242,161,84,.18), transparent 70%), var(--bg)}
#fxWipe.on{opacity:1}
#fxWipe::after{content:"";position:absolute;left:50%;top:52%;width:76px;height:76px;
  transform:translate(-50%,-50%) scale(.85);border-radius:50%;opacity:0;
  background:radial-gradient(circle,#ffe0a8,#f2a154 55%,transparent 72%);
  transition:opacity .22s ease, transform .45s cubic-bezier(.2,.7,.2,1)}
#fxWipe.on::after{opacity:.95;transform:translate(-50%,-50%) scale(1.08)}
@media(prefers-reduced-motion:reduce){#fxWipe{display:none}}

main{padding:26px 0 90px}
.tab{display:none;animation:fade .3s ease}
.tab.on{display:block}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

h2.section{font-family:var(--font-title);font-size:var(--text-2xl);font-weight:var(--fw-title);letter-spacing:var(--ls-title);text-transform:var(--title-transform);margin-bottom:4px}
.section-sub{color:var(--muted);font-size:14px;margin-bottom:22px;max-width:70ch}
/* eyebrow = rótulo QUIETO (mono cinza). Antes era laranja em toda seção — o âmbar
   virou raro (só CTA, o número-herói do hero e a aba ativa). Ver DESIGN-SYSTEM.md. */
.eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:var(--eyebrow-ls);text-transform:uppercase;color:var(--muted);margin-bottom:8px}

/* ---------- Cards ---------- */
.card{background:var(--surface);border:var(--card-bd);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:18px}
.grid{display:grid;gap:16px}
.two-col{grid-template-columns:1fr 1fr}
/* Painel: Foco (denso) manda; Estratégia vira barra lateral secundária que NÃO
   estica pra igualar a altura (fim do card vazio) e acompanha a leitura (sticky). */
#painelBottom{align-items:start;gap:20px}
#painelBottom > .card:last-child{background:var(--raised)}
@media(min-width:821px){
  #painelBottom{grid-template-columns:1.4fr 1fr}
  #painelBottom > .card:last-child{position:sticky;top:78px}
}

/* ---------- HERO / horizonte ---------- */
.hero{position:relative;border:var(--card-bd);border-radius:var(--radius);overflow:hidden;box-shadow:var(--card-shadow);
  background:linear-gradient(180deg,#0e1420,#0c1018);margin-bottom:26px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:0}
.hero-left{padding:30px 30px 26px}
.hero-right{position:relative;min-height:230px;border-left:1px solid var(--border-soft)}
.hero h1{font-family:var(--font-title);font-size:var(--text-hero);font-weight:var(--fw-title);letter-spacing:var(--ls-title);text-transform:var(--title-transform);line-height:1.12;margin-bottom:8px}
.hero .lede{color:var(--muted);font-size:14.5px;max-width:44ch;margin-bottom:20px}
.hero-stats{display:flex;gap:26px;flex-wrap:wrap}
.hstat .n{font-family:var(--mono);font-size:30px;font-weight:600;letter-spacing:-1px;line-height:1}
.hstat .l{font-size:11.5px;color:var(--faint);text-transform:uppercase;letter-spacing:1px;margin-top:5px}
.hstat .n.sun{color:var(--sunset)} .hstat .n.blu{color:var(--azul)} .hstat .n.grn{color:var(--verde)}
#horizonte{position:absolute;inset:0;width:100%;height:100%}
/* O % vive como OVERLAY em HTML, não como <text> no SVG: o preserveAspectRatio
   "slice" recorta o topo/base do SVG em telas baixas (celular), e o texto ficava
   cortado ao meio. Fora do sistema de coordenadas do SVG, nunca é recortado. */
.hero-pct{position:absolute;top:10px;right:12px;z-index:2;font-family:var(--mono);font-size:12px;
  color:#ffe6c2;background:rgba(10,14,26,.42);border:1px solid rgba(255,255,255,.14);
  border-radius:99px;padding:3px 10px;letter-spacing:.3px;pointer-events:none}
.hero-cta{margin-top:22px;display:flex;gap:10px;flex-wrap:wrap}
/* barra de sol: linha-horizonte sob o CTA (RELATORIO §Hero) — o pôr-do-sol como sistema, não enfeite */
.sun-bar{height:2px;margin-top:22px;border-radius:2px;background:linear-gradient(to right,transparent,var(--sunset),transparent);opacity:.6}
/* it.10 — chip da fase macro no Hero (liga o Painel ao Cronograma de 16 meses; neutro, a cor vem do ícone) */
.fase-chip{display:inline-flex;align-items:center;gap:7px;background:var(--raised);border:1px solid var(--border-soft);border-radius:99px;padding:5px 12px 5px 10px;font-size:12px;color:var(--muted);margin-bottom:14px;transition:var(--motion);white-space:nowrap}
.fase-chip:hover{border-color:var(--azul);color:var(--ink)}
.fase-chip b{color:var(--ink);font-weight:600}
.fase-chip .fc-ic{font-size:14px;line-height:1}
.fase-chip:active{transform:scale(.97)}
.btn{padding:9px 15px;border-radius:var(--radius-sm);font-size:13.5px;font-weight:600;transition:var(--motion);border:1px solid transparent}
.btn.primary{background:var(--sunset);color:#1a1206}
.btn.primary:hover{background:var(--sunset-deep)}
.btn.on{background:var(--surface);border-color:var(--azul);color:var(--azul)}
.btn.ghost{border-color:var(--border);color:var(--muted)}
.btn.ghost:hover{border-color:var(--azul);color:var(--ink)}
/* press físico (Things 3): o toque afunda levemente o alvo */
.btn:active{transform:scale(.97)}

/* ---------- Discipline / edital ---------- */
.disc-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.disc{background:var(--surface);border:var(--card-bd);border-radius:var(--radius);box-shadow:var(--card-shadow);overflow:hidden;
  transition:var(--motion);display:flex;flex-direction:column}
.disc:hover{border-color:var(--border)}
/* fechado = card compacto; sem isso o grid estica os cards fechados até a altura
   do aberto e eles viram caixas vazias gigantes (bug do print 2026-07-12) */
.disc{align-self:start}
.disc-h{display:flex;align-items:center;gap:12px;padding:14px 16px 12px;cursor:pointer;min-height:64px}
.disc-h .chev{color:var(--faint);font-size:22px;line-height:1;transition:transform .18s;flex-shrink:0;width:14px;text-align:center}
.disc.open .chev{transform:rotate(90deg)}
.disc-h .ic{font-size:20px;width:34px;height:34px;display:grid;place-items:center;background:var(--raised);border-radius:9px;flex-shrink:0}
.disc-h .nm{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.25}
.disc-h .nm b{font-weight:600;font-size:15.5px;overflow-wrap:anywhere}
.disc-h .nm small{font-size:11.5px;color:var(--faint);font-weight:400}
.disc-h .pct{flex:none;font-family:var(--mono);font-size:13px;color:var(--muted)}
.disc-bar{height:5px;background:var(--raised);position:relative;overflow:hidden}
.disc-bar > i{position:absolute;inset:0 auto 0 0;display:block;transition:width .5s}
.disc-body{display:none;padding:4px 12px 12px;border-top:1px solid var(--border-soft)}
.disc.open .disc-body{display:block}
.disc.open .disc-h{background:var(--raised)}
.eixo{margin-top:10px}
.eixo-nm{font-family:var(--mono);font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);margin:6px 4px 4px}
.topic{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:0 10px;padding:4px 4px 4px 8px;border-radius:10px;transition:.12s}
.topic:hover{background:var(--raised)}
.dot{width:15px;height:15px;border-radius:50%;flex-shrink:0;margin-top:14px;cursor:pointer;border:2px solid var(--cinza);transition:.15s;background:transparent;position:relative}
.dot::after{content:"";position:absolute;inset:-14px -8px}      /* alvo de toque de 44px sem aumentar a bolinha */
.dot.s1{border-color:var(--amarelo);background:var(--amarelo)}
.dot.s2{border-color:var(--verde);background:var(--verde)}
.topic .tx{min-width:0;padding:10px 0}
.topic .tn{font-size:14px;font-weight:500;cursor:pointer;line-height:1.35;overflow-wrap:anywhere}
.topic.s2 .tn{color:var(--muted)}
.topic .tsub{font-size:11.5px;color:var(--faint);display:none;margin-top:3px;line-height:1.45}
.topic.exp .tsub{display:block}
.topic .t-acts{display:flex;align-items:center;gap:4px}
.topic .t-open{width:44px;height:44px;border:0;background:none;color:var(--faint);font-size:24px;line-height:1;cursor:pointer;border-radius:10px}
.topic .t-open:hover,.topic .t-open:focus-visible{color:var(--ink);background:var(--raised2)}
.topic .t-open.has{color:var(--sunset)}              /* tem anotação sua */
/* quantas questões oficiais já caíram deste tópico → clique abre o banco filtrado */
.topic .qbadge{font-family:var(--mono);font-size:10px;color:var(--muted);background:var(--raised);border:1px solid var(--border);border-radius:99px;padding:2px 7px;flex-shrink:0;white-space:nowrap}
/* quando você já respondeu questões do tópico, o contador vira o SEU acerto */
.topic .qbadge.a-bom{color:var(--verde);border-color:#2f5a48}
.topic .qbadge.a-med{color:var(--amarelo);border-color:#5a4a2f}
.topic .qbadge.a-ruim{color:var(--vermelho);border-color:#5a3030}
/* chegando de uma questão: pisca a linha do tópico p/ o olho achá-la */
.topic.flash{animation:tflash 2.2s ease}
@keyframes tflash{0%,65%{background:var(--raised);box-shadow:inset 0 0 0 2px var(--sunset)}100%{background:transparent;box-shadow:none}}

.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin:14px 2px 20px}
.legend span{display:flex;align-items:center;gap:6px}
.legend i{width:12px;height:12px;border-radius:50%;border:2px solid var(--cinza)}
.legend i.a{border-color:var(--amarelo);background:var(--amarelo)} .legend i.v{border-color:var(--verde);background:var(--verde)}

/* ---------- Cronograma / SRS ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.due-item{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--border-soft);border-radius:10px;background:var(--raised);margin-bottom:9px}
.due-item .ic{font-size:16px}
.due-item .info{flex:1;min-width:0}
.due-item .info .t{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.due-item .info .m{font-size:11px;color:var(--faint)}
.due-item .qlink{background:none;border:none;padding:0;font-size:11px;color:var(--azul);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.due-item .qlink:hover{color:var(--azul)}
.srs-btns{display:flex;gap:5px}
.srs-btns button{padding:5px 9px;border-radius:7px;font-size:11.5px;font-weight:600;border:1px solid var(--border)}
.srs-btns .b0{color:var(--vermelho);border-color:#5a3030}.srs-btns .b0:hover{background:#3a2020}
.srs-btns .b1{color:var(--amarelo);border-color:#5a5030}.srs-btns .b1:hover{background:#3a3520}
.srs-btns .b2{color:var(--azul);border-color:#2f4a66}.srs-btns .b2:hover{background:#1f3550}
.srs-btns .b3{color:var(--verde);border-color:#2f5a48}.srs-btns .b3:hover{background:#1f3a30}
.empty{text-align:center;padding:30px 16px;color:var(--faint);font-size:13.5px}

.log-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.log-form select,.log-form input{background:var(--raised);border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-size:13px}
.log-form input[type=number]{width:78px}
.log-form input[type=date]{min-width:0}
.week{display:flex;gap:5px;margin-top:12px}
.week .d{flex:1;text-align:center}
.week .bar{height:60px;background:var(--raised);border-radius:6px;position:relative;overflow:hidden;display:flex;align-items:flex-end}
.week .bar > i{width:100%;background:linear-gradient(180deg,var(--azul),var(--azul-deep));display:block;transition:height .4s}
.week .lb{font-size:10px;color:var(--faint);margin-top:4px}
.week .vv{font-size:10px;color:var(--muted);font-family:var(--mono)}

/* ---------- Fase macro (cronograma de 16 meses) ---------- */
.fase-macro .fase-trilha{display:flex;align-items:stretch;gap:6px;margin-top:12px}
.fase-seg{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;padding:9px 8px;border:1px solid var(--border-soft);border-radius:10px;background:var(--raised);opacity:.62;transition:opacity .3s}
.fase-seg.on{opacity:1;border-color:var(--sunset);background:color-mix(in srgb,var(--sunset) 12%,var(--raised))}
.fase-ic{font-size:16px;line-height:1}
.fase-nm{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fase-seg.on .fase-nm{color:var(--sunset)}
.fase-jn{font-size:10.5px;color:var(--faint);font-family:var(--mono)}
.fase-arw{align-self:center;color:var(--faint);font-size:15px;flex:0 0 auto}
.fase-barra{height:6px;border-radius:4px;background:var(--raised);overflow:hidden;margin:12px 0 8px}
.fase-barra > i{display:block;height:100%;background:linear-gradient(90deg,var(--sunset-deep),var(--sunset));transition:width .5s}
.fase-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;color:var(--muted)}
.fase-meta b{color:var(--ink);font-family:var(--mono)}
.fase-nota{font-size:11px;color:var(--faint);margin-top:6px;line-height:1.45}
.fase-agora{margin-top:12px;padding-top:12px;border-top:1px solid var(--border-soft)}
.fase-agora-h{font-family:var(--serif);font-size:15.5px;font-weight:600}
.fase-agora-r{font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.5}
.fase-prio{margin:8px 0 0;padding-left:18px;font-size:12.5px;line-height:1.65}
.fase-prio li{margin-bottom:2px}

/* ---------- Métricas ---------- */
.kpis{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.kpi{background:var(--surface);border:var(--card-bd);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:16px}
.kpi .n{font-family:var(--mono);font-size:27px;font-weight:600;letter-spacing:-.5px}
.kpi .l{font-size:11.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.6px;margin-top:3px}
.kpi .sub{font-size:11.5px;color:var(--muted);margin-top:6px}
/* O SVG tem min-width (520–560px) e o .chart-wrap rola. Mas item de GRID nasce com
   min-width:auto e se recusa a encolher abaixo do conteúdo — o card esticava e vazava
   a tela no celular em vez de deixar o gráfico rolar dentro dele. */
.chart-wrap{overflow-x:auto;min-width:0}
.split-red>*,.two-col>*,.grid>*{min-width:0}

/* ---------- Simulador ---------- */
.sim-grid{display:grid;grid-template-columns:1fr 320px;gap:18px}
.sim-row{display:grid;grid-template-columns:150px 1fr 52px 44px;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid var(--border-soft)}
.sim-row .pn{font-size:13px;font-weight:500}
.sim-row input[type=range]{width:100%;accent-color:var(--azul)}
.sim-row .ep{font-family:var(--mono);font-size:13px;text-align:right;color:var(--muted)}
.sim-row .pw{font-family:var(--mono);font-size:11px;text-align:center;color:var(--azul);border:1px solid var(--border);border-radius:5px;padding:1px 0}
.sim-out{background:linear-gradient(180deg,var(--raised),var(--surface));border:1px solid var(--border);border-radius:14px;padding:20px;height:fit-content;position:sticky;top:76px}
.sim-out .big{font-family:var(--mono);font-size:44px;font-weight:700;letter-spacing:-2px;color:var(--sunset);line-height:1}
.sim-out .warn{font-size:12px;color:var(--vermelho);margin-top:10px;display:none}
.sim-out .warn.on{display:block}

/* ---------- Banco de questões ---------- */
.q-item{border:var(--card-bd);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:13px 14px;margin-bottom:10px;background:var(--surface)}
.q-meta{display:flex;gap:8px;align-items:center;font-size:11px;color:var(--faint);margin-bottom:7px;flex-wrap:wrap}
.tag{font-family:var(--mono);font-size:10px;background:var(--raised);border:1px solid var(--border);border-radius:5px;padding:1px 6px;color:var(--muted)}
/* tópico do edital na questão: é um link p/ o Mapa (o assunto, em laranja, é texto da extração) */
.tag.tlink{cursor:pointer;color:var(--azul);transition:.12s}
.tag.tlink:hover{border-color:var(--azul);color:var(--ink)}
.q-en{font-size:13.5px;margin-bottom:8px;white-space:pre-wrap}
.q-ans{font-size:12.5px;color:var(--verde);display:none;padding:8px 10px;background:var(--raised);border-radius:8px;margin-bottom:8px;white-space:pre-wrap}
.q-item.rev .q-ans{display:block}
.q-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.acc{font-family:var(--mono);font-size:11px;color:var(--muted);margin-left:auto}

/* ---------- Banco navegável (questões oficiais) ---------- */
.bq{border:var(--card-bd);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:14px 15px;margin-bottom:12px;background:var(--surface)}
.bq .q-meta{margin-bottom:9px}
.bq .fig{color:var(--muted);border-color:var(--border)}
.bq .ctx{font-size:12.5px;color:var(--faint);font-style:italic;line-height:1.5;margin-bottom:8px;padding-left:10px;border-left:2px solid var(--border)}
/* Figura descrita: a imagem original vive no PDF; o extrator capturou os DADOS dela
   (valores de gráfico/tabela, cena da foto). Moldura tracejada = convenção de placeholder. */
.bq .bq-fig{margin-bottom:11px;padding:11px 13px;background:var(--raised);border:1px dashed var(--azul-deep);border-left-width:3px;border-radius:var(--radius-sm)}
.bq .bq-fig figcaption{font-family:var(--mono);font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:var(--azul);margin-bottom:5px;display:flex;flex-wrap:wrap;gap:4px;align-items:baseline}
.bq .bq-fig figcaption span{color:var(--faint);text-transform:none;letter-spacing:.2px;font-size:9.5px}
.bq .bq-fig-tx{font-size:13px;line-height:1.55;color:var(--ink)}
/* Figura recortada da prova. Fundo branco fixo: o recorte vem do PDF (tinta preta
   sobre papel branco) e nos temas escuros ficaria ilegível sobre o --raised. */
.bq .bq-fig.temimg{background:#fff;border-style:solid;border-color:var(--azul-deep)}
.bq .bq-fig.temimg figcaption{color:var(--azul-deep)}
.bq .bq-fig.temimg figcaption span{color:#6b6b6b}
/* teto de altura: uma foto de prova ocupa ~700px e transforma a lista de questões
   numa rolagem infinita. Quem quiser detalhe clica e abre em tamanho real. */
.bq .bq-fig-img{display:block;max-width:100%;max-height:min(58vh,440px);width:auto;height:auto;margin:0 auto;border-radius:2px;cursor:zoom-in}
.bq .bq-fig-img+.bq-fig-img{margin-top:9px}
.bq .bq-fig-desc{margin-top:9px}
.bq .bq-fig-desc summary{font-family:var(--mono);font-size:10px;letter-spacing:.4px;text-transform:uppercase;color:#6b6b6b;cursor:pointer}
.bq .bq-fig-desc .bq-fig-tx{color:#333;margin-top:5px}
/* Anotação da questão */
.bq .bq-nota{margin-top:10px}
.bq .bq-nota summary{font-family:var(--mono);font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:var(--faint);cursor:pointer}
.bq .bq-nota[open] summary{color:var(--azul);margin-bottom:6px}
.bq .bq-nota-tx{width:100%;box-sizing:border-box;font:inherit;font-size:13px;line-height:1.5;color:var(--ink);background:var(--raised);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 10px;resize:vertical}
.bq .bq-nota-tx:focus{outline:none;border-color:var(--azul)}
.bq .q-meta .tag.nota{color:var(--azul);border-color:var(--azul-deep)}
.bq .en{font-size:14px;line-height:1.55;margin-bottom:11px;white-space:pre-wrap}
.bq .alts{display:flex;flex-direction:column;gap:6px;margin-bottom:11px}
.bq .alt{display:flex;gap:9px;align-items:flex-start;text-align:left;padding:9px 11px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--raised);font-size:13px;line-height:1.45;transition:var(--motion);width:100%}
.bq .alt:hover:not(:disabled){border-color:var(--azul);color:var(--ink)}
.bq .alt .L{font-family:var(--mono);font-weight:700;color:var(--muted);flex-shrink:0}
.bq .alt.ok{background:rgba(63,185,132,.14);border-color:var(--verde)}
.bq .alt.ok .L{color:var(--verde)}
.bq .alt.bad{background:rgba(226,99,90,.13);border-color:var(--vermelho)}
.bq .alt.bad .L{color:var(--vermelho)}
.bq .alt.gab{border-color:var(--verde)}.bq .alt.gab .L{color:var(--verde)}
.bq .alt:disabled{cursor:default}
.bq .veredito{font-size:12.5px;font-weight:600;margin-bottom:10px}
.bq .veredito.acertou{color:var(--verde)} .bq .veredito.errou{color:var(--vermelho)}
.bq-links{display:flex;gap:7px;flex-wrap:wrap;border-top:1px solid var(--border-soft);padding-top:10px}
.bq-links a,.bq-links button{font-size:12px;padding:6px 11px;border-radius:99px;border:1px solid var(--border);color:var(--muted);background:none;display:inline-flex;align-items:center;gap:5px;transition:.12s;white-space:nowrap}
.bq-links a:hover,.bq-links button:hover{color:var(--ink);border-color:var(--azul);text-decoration:none}
.bq-links .gem:hover{border-color:var(--azul);color:var(--azul)}
/* filtro que veio de outra aba (tópico do edital / questão de uma prova) */
#bqEspBox{display:inline-flex;align-items:center;gap:7px;color:var(--azul);border-color:var(--azul-deep)}
#bqEspBox button{border:none;background:none;color:var(--muted);font-size:13px;line-height:1;padding:0 2px;cursor:pointer}
#bqEspBox button:hover{color:var(--ink)}
/* Análise: a linha do tópico é um atalho p/ as questões dele */
.an-row{display:grid;grid-template-columns:minmax(180px,2fr) 5fr auto;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--border-soft)}
.an-row[data-tid]{cursor:pointer}
.an-row[data-tid]:hover{background:var(--raised)}
.an-row.an-alvo{background:linear-gradient(90deg,rgba(224,122,63,.10),transparent 60%);box-shadow:inset 3px 0 0 var(--sunset)}
.an-num{font-family:var(--mono);font-size:13px;color:var(--muted);text-align:right;min-width:132px;display:flex;gap:7px;align-items:center;justify-content:flex-end}
.an-acc{font-family:var(--mono);font-size:11px;color:var(--faint);background:var(--raised);border:1px solid var(--border);border-radius:99px;padding:2px 7px;white-space:nowrap}
.an-acc.a-bom{color:var(--verde);border-color:#2f5a48}
.an-acc.a-med{color:var(--amarelo);border-color:#5a4a2f}
.an-acc.a-ruim{color:var(--vermelho);border-color:#5a3030}
.an-go{color:var(--azul);margin-left:6px;opacity:.55}
.an-row[data-tid]:hover .an-go{opacity:1}

/* ---------- misc ---------- */
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.toolbar input,.toolbar select{background:var(--raised);border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-size:13px}
/* o checkbox não é campo de texto: não herda o padding/estica da toolbar (era 13px de lado
   no dedo). Tamanho vem daqui — e sobe p/ 24px em @media(hover:none), SC 2.5.8. */
.toolbar input[type=checkbox]{padding:0;flex:0 0 auto;width:18px;height:18px;accent-color:var(--azul)}
.chip{font-size:11px;padding:3px 9px;border-radius:99px;border:1px solid var(--border);color:var(--muted)}
.note-hint{font-size:11.5px;color:var(--faint);margin-top:6px}
/* leitor de conteúdo-base da nota (quem não tem Obsidian lê aqui) */
.nota-base{margin-bottom:16px}
.nota-base .nb-sec{margin-bottom:14px}
.nota-base .nb-h{font-family:var(--mono);font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.nota-base .nb-tx{font-size:13.5px;line-height:1.6;color:var(--ink)}
.nota-base .nb-tx p{margin:0 0 7px}
.nota-base .nb-tx p:last-child{margin:0}
.nota-base .nb-tx b,.nota-base .nb-tx strong{color:var(--ink);font-weight:600}
.nota-base .nb-tx ul{margin:4px 0 0;padding-left:18px}
.nota-base .nb-tx li{margin-bottom:3px}
.nota-base .nb-subs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:2px}
.nota-base .nb-sub{font-size:11.5px;background:var(--raised);border:1px solid var(--border-soft);border-radius:99px;padding:3px 9px;color:var(--muted)}
.nota-base .nb-empty{font-size:12.5px;color:var(--faint);font-style:italic}
.nota-base .nb-div{height:1px;background:var(--border-soft);margin:14px 0}
.obs-link{font-size:12px;color:var(--muted);text-decoration:none;align-self:center}
.obs-link:hover{color:var(--azul)}
.lbl-sub{text-transform:none;letter-spacing:0;color:var(--faint);font-weight:400}
.help-btn{background:var(--raised);border:1px solid var(--border);border-radius:99px;padding:5px 12px;font-size:12.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.help-btn:hover{color:var(--azul);border-color:var(--azul)}
/* tutorial (Como usar) */
.ajuda-b{padding:20px 22px}
.ajuda-b h3{font-family:var(--serif);font-size:19px;margin-bottom:4px}
.ajuda-b .aj-lede{color:var(--muted);font-size:13.5px;line-height:1.55;margin-bottom:18px}
.ajuda-step{display:flex;gap:12px;margin-bottom:16px}
.ajuda-step .aj-ico{flex:none;width:34px;height:34px;border-radius:10px;background:var(--raised);border:1px solid var(--border-soft);display:flex;align-items:center;justify-content:center;font-size:17px}
.ajuda-step .aj-tt{font-weight:600;font-size:14px;margin-bottom:2px}
.ajuda-step .aj-tx{font-size:13px;line-height:1.55;color:var(--muted)}
.ajuda-step .aj-tx b{color:var(--ink);font-weight:600}
.ajuda-note{background:var(--raised);border:1px solid var(--border-soft);border-radius:var(--radius-sm);padding:12px 14px;font-size:12.5px;line-height:1.55;color:var(--muted);margin-top:4px}
.ajuda-note b{color:var(--ink)}
a{color:var(--azul);text-decoration:none}a:hover{text-decoration:underline}
.foot{text-align:center;color:var(--faint);font-size:11.5px;margin-top:40px;padding-top:20px;border-top:1px solid var(--border-soft)}
/* diálogos no nível de elevação mais alto: superfície --overlay (mais clara) + sombra
   longa. Antes usavam --surface (igual aos cards) e não "descolavam" do fundo. */
dialog{border:var(--card-bd);background:var(--overlay);color:var(--ink);border-radius:var(--radius);padding:0;max-width:520px;width:92vw;max-height:92vh;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.5)}
/* Diálogo = coluna: cabeçalho e rodapé fixos, o MEIO rola. Antes o corpo tinha max-height em vh
   (a barra do Safari ocupa parte do vh) e o diálogo cortava o excedente — rodapé/"Fechar"/"Salvar"
   saíam da tela sem como rolar. dvh acompanha a barra e o teclado. */
dialog[open]{display:flex;flex-direction:column;max-height:92vh;max-height:calc(100dvh - 16px)}
dialog>*{flex:0 0 auto}
dialog>:not(.dlg-h):not(.dlg-f){flex:0 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain}
dialog::backdrop{background:rgba(6,8,12,.7);backdrop-filter:blur(3px)}
.dlg-h{padding:16px 18px;border-bottom:1px solid var(--border-soft);font-weight:600;font-family:var(--serif);font-size:17px}
.dlg-b{padding:18px}
.dlg-b textarea,.dlg-b input,.dlg-b select{width:100%;background:var(--raised);border:1px solid var(--border);border-radius:9px;padding:10px;margin-bottom:11px;font-size:13.5px}
.dlg-b label{font-size:11.5px;color:var(--muted);display:block;margin-bottom:5px;text-transform:uppercase;letter-spacing:.5px}
#dlgGuia{max-width:min(1100px,98vw);width:98vw}
#dlgGuia.tem-guia{height:calc(100vh - 16px);height:calc(100dvh - 16px)}
#dlgGuia .guia-b{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:10px;overflow:hidden;padding:12px 18px}
#guiaStatus{margin:0;font-size:12px;color:var(--muted)}
#guiaFrame{display:block;flex:1 1 auto;min-height:220px;width:100%;border:1px solid var(--border);border-radius:9px}
.guia-upload{flex:0 0 auto;font-size:12px;color:var(--muted)}
.guia-upload summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--azul)}
.guia-upload[open]{border-top:1px solid var(--border-soft);padding-top:6px}
.guia-upload input{max-width:420px}
#guiaFrame[hidden],#guiaAbrir[hidden],#guiaRemover[hidden]{display:none}
#dlgHistoria{max-width:min(1100px,98vw);width:98vw;height:calc(100dvh - 16px)}
#dlgHistoria .dlg-h{display:flex;align-items:center;justify-content:space-between;gap:12px}
#dlgHistoria .hist-leitor{flex:1 1 auto;min-height:0;overflow:hidden;padding:8px 12px}
#dlgHistoria .dlg-f{flex-wrap:wrap;padding-top:8px}
#histFrame{width:100%;height:100%;border:1px solid var(--border);border-radius:9px;background:#fff}
.hist-colecao{background:var(--surface);border:var(--card-bd);border-radius:var(--radius);padding:18px;margin:16px 0;box-shadow:var(--card-shadow)}
.hist-colecao h3{margin:5px 0 7px;font-size:20px}
.hist-colecao p{color:var(--muted);font-size:13px;line-height:1.5;margin:0 0 14px}
.hist-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));gap:8px}
.hist-card{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--border);border-radius:9px;color:var(--ink);text-decoration:none;background:var(--raised)}
.hist-card:hover,.hist-card:focus-visible{border-color:var(--sunset);outline:none}
.hist-card span{font-size:11.5px;color:var(--muted);line-height:1.4}
.dlg-f{display:flex;gap:9px;justify-content:flex-end;padding:0 18px 18px}
#dlgGuia .dlg-f{flex-wrap:wrap;padding-top:8px}
.dlg-f .btn{min-height:44px}
.ap-sec[hidden]{display:none}

/* ===== Leitor de redações (#dlgLeitura) — 2 colunas no desktop, 1 no celular ===== */
#dlgLeitura{max-width:none;overflow:hidden;margin:auto;inset:0}
#dlgLeitura .dlg-f{flex-wrap:wrap}
#dlgLeitura .lei-b{padding:0;display:block;overflow-y:auto;min-height:0;flex:1 1 auto}
#dlgLeitura .lei-txt{padding:18px 18px 8px}
#dlgLeitura .lei-txt:focus-visible,.lei-painel:focus-visible{outline:2px solid var(--azul);outline-offset:-2px}
.lei-col{max-width:68ch;margin:0 auto;font-family:var(--serif);font-size:16px}
.lei-corpo{line-height:1.8;hyphens:auto;overflow-wrap:anywhere}
.lei-corpo p{margin:0 0 1.05em;text-indent:1.6em}
.lei-corpo p:first-child{text-indent:0}
.lei-corpo p:first-child::first-letter{font-size:2.5em;float:left;line-height:.9;padding:4px 8px 0 0;color:var(--sunset)}
.lei-corpo mark{--cc:var(--sunset);background:color-mix(in srgb,var(--cc) 24%,transparent);color:inherit;border-bottom:2px solid var(--cc);padding:0 1px;cursor:pointer;border-radius:2px}
.lei-corpo mark.ativo{background:color-mix(in srgb,var(--cc) 52%,transparent)}
.lei-corpo mark:focus-visible{outline:2px solid var(--azul);outline-offset:1px}
.lei-corpo mark[data-k=c1]{--cc:var(--lei-c1)}.lei-corpo mark[data-k=c2]{--cc:var(--lei-c2)}.lei-corpo mark[data-k=c3]{--cc:var(--lei-c3)}.lei-corpo mark[data-k=c4]{--cc:var(--lei-c4)}.lei-corpo mark[data-k=c5]{--cc:var(--lei-c5)}
#dlLeiMeta{margin:0 0 12px;font-size:11px}
.lei-av{padding:14px 18px 18px;border-top:1px solid var(--border-soft);background:var(--surface)}
.lei-av-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.lei-av-h h3{font-family:var(--font-title);font-size:15px;margin:0}
.lei-total{font-size:12px;font-weight:700;padding:3px 10px;border-radius:99px;border:1px solid var(--sunset);color:var(--sunset)}
.lei-tabs{display:flex;border-bottom:1px solid var(--border-soft)}
.lei-tabs button{flex:1 1 0;min-width:44px;min-height:44px;background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);font:inherit;font-size:13.5px;cursor:pointer;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.15;padding:0 4px}
.lei-tabs button small{font-size:10.5px;color:var(--faint)}
.lei-tabs button small.pt{color:var(--azul)}
.lei-tabs button.on{color:var(--ink);font-weight:600;border-bottom-color:var(--sunset)}
.lei-tabs button:focus-visible{outline:2px solid var(--azul);outline-offset:-2px}
.lei-painel{padding:14px 2px 4px}
.lei-painel h4{font-family:var(--font-title);font-size:14px;margin:0 0 8px}
.lei-tx{white-space:pre-wrap;font-size:14.5px;line-height:1.65;color:var(--ink)}
.lei-nota{font-size:22px;font-weight:700;color:var(--sunset);margin-bottom:6px}
.lei-nota small{font-size:12px;color:var(--faint);font-weight:400}
.lei-orig{margin-top:12px;font-size:11.5px;color:var(--faint)}
.lei-vazio{color:var(--muted);font-size:14px;line-height:1.6;margin:0}
.lei-av[hidden],#dlgLeitura .lei-b.so-texto .lei-av{display:none!important}
@media(min-width:901px){
  #dlLeiVerAnalise{display:none}
  #dlgLeitura{width:min(1200px,94vw);height:90vh;height:calc(100dvh - 5vh)}
  #dlgLeitura:has(.so-texto){width:min(860px,94vw)}
  #dlgLeitura .lei-b{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);overflow:hidden}
  #dlgLeitura .lei-b.so-texto{grid-template-columns:minmax(0,1fr)}
  #dlgLeitura .lei-txt{overflow-y:auto;padding:28px 40px 36px}
  .lei-col{font-size:18px}
  .lei-corpo{line-height:1.8}
  .lei-av{display:flex;flex-direction:column;min-height:0;border-top:0;border-left:1px solid var(--border-soft);padding:22px 22px 0}
  .lei-painel{flex:1 1 auto;min-height:0;overflow-y:auto;padding:16px 4px 22px}
}

/* ===== it.10 — SHELL DE DASHBOARD: barra lateral fixa (desktop ≥901px) =====
   Referências nomeadas pelo Lukas (2026-07-15): dashboards de stats + sidebar-nav
   (Dribbble: NBA Player Stats, Core 2.0 Dashboard Builder) + acabamento de agência
   (Wix Studio). É SÓ desktop — no mobile (≤900px) a top-bar + #botNav seguem intactos.
   Nenhuma cor hardcoded: fundo/telha por token de tema. Eixos ortogonais preservados.
   Ver DESIGN-SYSTEM.md (it.10). */
@media(min-width:901px){
  header.top{position:fixed;top:0;left:0;bottom:0;width:var(--side-w);
    background:var(--surface);border-right:1px solid var(--border-soft);border-bottom:none;
    backdrop-filter:none;overflow:hidden}
  .top-in{flex-direction:column;align-items:stretch;flex-wrap:nowrap;height:100%;
    max-width:none;margin:0;gap:13px;padding:20px 12px;overflow-y:auto}
  .brand{flex-direction:column;align-items:flex-start;gap:2px;padding:2px 8px 4px}
  .brand .h{font-size:19px}
  /* nav vertical: ícone + rótulo, alvo largo; ativo = trilho âmbar fino (raro=forte) */
  .nav{flex-direction:column;align-items:stretch;gap:2px;margin-left:0;flex-wrap:nowrap}
  .nav button{display:flex;align-items:center;gap:11px;justify-content:flex-start;width:100%;
    padding:9px 11px;border-radius:var(--radius-sm);font-size:13.5px;font-weight:500;text-align:left}
  .nav button .ni{font-size:15px;width:22px;text-align:center;flex:0 0 auto;filter:saturate(.8)}
  .nav button:hover{background:var(--raised);color:var(--ink)}
  /* ativo com trilho âmbar = look da SIDEBAR (lateral). Gated com :where() (especificidade 0)
     p/ não subir a força do seletor: assim o tema (gradiente/claro) continua vencendo a cor do
     ativo, e nos layouts topo/inferior este trilho some e o ativo cai no `.on` base (pílula). */
  :root:where([data-nav="lateral"],:not([data-nav])) .nav button.on{background:var(--raised);color:var(--ink);font-weight:600;box-shadow:inset 2.5px 0 0 var(--sunset)}
  #configAparencia .style-pick,#configAparencia .theme-pick{justify-content:center}
  #configAparencia .nav-pick{display:flex;justify-content:center}   /* o 3º seletor só existe no desktop */
  /* o conteúdo desloca pra direita da barra. É `main.wrap` (esp. 0,1,1) e não `main`
     (0,0,1): senão o `.wrap{margin:0 auto}` (0,1,0) vence no margin-left e o conteúdo
     centra na viewport inteira, indo parar ATRÁS da barra fixa. margin-right segue `auto`. */
  /* …e CENTRA no espaço que sobra à direita dela. Com `margin-left` fixo e `margin-right:auto`
     o conteúdo ficava ancorado à esquerda: numa tela de 1920 sobravam 564px de vazio de um lado
     só e a página parecia torta (print do Lukas, 2026-07-19). O max() protege as telas estreitas:
     quando não há folga, o cálculo fica menor que --side-w e o layout volta a encostar na barra. */
  main.wrap{margin-left:max(var(--side-w), calc(var(--side-w) + (100% - var(--side-w) - 1320px)/2))}
  .wrap{max-width:1320px}
  /* sem top-bar no desktop: o sticky da Estratégia encosta mais no topo */
  #painelBottom > .card:last-child{top:24px}
}

/* ===== ② data-nav — LAYOUT MOLDÁVEL (só desktop ≥901px) =====
   3º eixo, ortogonal à cor/forma: escolhe ONDE fica a navegação. 'lateral' (padrão) é a
   barra da it.10 acima; aqui ficam as DUAS alternativas — 'topo' e 'inferior'. Preferência
   POR APARELHO (localStorage 'painelNav'), não sincroniza. Só desktop: no mobile (≤900px) a
   nav é sempre a #botNav, qualquer que seja o data-nav (por isso .nav-pick some lá).
   Estes blocos SÓ desfazem o que a it.10 faz p/ virar sidebar; a COR nunca é tocada aqui
   (o ativo cai no `.on` base, que é ciente de tema). Ver DESIGN-SYSTEM.md (②). */
@media(min-width:901px){
  /* — comum às duas: a coluna à esquerda volta a ser uma barra no topo, controles em linha — */
  :root[data-nav="topo"] header.top,:root[data-nav="inferior"] header.top{
    position:sticky;top:0;left:auto;right:auto;bottom:auto;width:auto;height:auto;
    border-right:none;border-bottom:1px solid var(--border-soft);overflow:visible}
  :root[data-nav="topo"] .top-in,:root[data-nav="inferior"] .top-in{
    flex-direction:row;align-items:center;flex-wrap:wrap;height:auto;
    max-width:1320px;margin:0 auto;gap:16px;padding:12px 20px;overflow:visible}
  :root[data-nav="topo"] .brand,:root[data-nav="inferior"] .brand{flex-direction:row;align-items:baseline;gap:10px;padding:0}
  :root[data-nav="topo"] .pick-lb,:root[data-nav="inferior"] .pick-lb{display:none}
  :root[data-nav="topo"] main.wrap,:root[data-nav="inferior"] main.wrap{margin-left:auto;margin-right:auto}
  :root[data-nav="topo"] #painelBottom > .card:last-child,
  :root[data-nav="inferior"] #painelBottom > .card:last-child{top:60px}

  /* — TOPO: nav horizontal à direita; pílulas de texto (ícones escondidos, top bar clássica) — */
  :root[data-nav="topo"] .nav{flex-direction:row;align-items:center;margin-left:auto;flex-wrap:wrap;gap:2px}
  :root[data-nav="topo"] .nav button{width:auto;justify-content:center;text-align:center;
    padding:7px 13px;border-radius:var(--nav-radius)}
  :root[data-nav="topo"] .nav .ni{display:none}

  /* — INFERIOR: nav fixa embaixo (ícone sobre rótulo, como a barra do celular, mas com as 10) — */
  :root[data-nav="inferior"] .nav{
    position:fixed;left:0;right:0;bottom:0;z-index:60;margin-left:0;
    flex-direction:row;justify-content:center;align-items:stretch;flex-wrap:wrap;gap:4px;
    background:var(--surface);border-top:1px solid var(--border);
    padding:8px 16px calc(8px + env(safe-area-inset-bottom))}
  :root[data-nav="inferior"] .nav button{width:auto;flex-direction:column;gap:3px;
    justify-content:center;align-items:center;padding:6px 13px;border-radius:var(--radius-sm);text-align:center}
  :root[data-nav="inferior"] .nav button .ni{display:inline-block;font-size:17px;width:auto;filter:saturate(.8)}
  :root[data-nav="inferior"] main.wrap{padding-bottom:96px}
}

@media(max-width:820px){
  .hero-grid{grid-template-columns:1fr}.hero-right{min-height:150px;border-left:none;border-top:1px solid var(--border-soft)}
  .split,.sim-grid{grid-template-columns:1fr}.sim-out{position:static}
  .sim-row{grid-template-columns:110px 1fr 46px 40px}
}
/* ---------- Responsivo: reflow do cabeçalho + nav rolável (mobile-first do shell) ---------- */
@media(max-width:900px){
  .top-in{flex-wrap:wrap;gap:9px 10px;padding:11px 16px}
  .brand{order:1}
  .style-pick{order:1}
  .theme-pick{order:1}
  .nav{order:3;width:100%;margin-left:0;flex-wrap:nowrap;overflow-x:auto;gap:4px;
    padding-bottom:3px;scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
    mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);}
  .nav::-webkit-scrollbar{display:none}
  .nav button{flex:0 0 auto;scroll-snap-align:start;padding:9px 14px;font-size:14px}
}
@media(max-width:560px){
  .wrap{padding:0 14px}
  main{padding:20px 0 84px}
  h2.section{font-size:22px}
  .hero-left{padding:22px 18px}
  .hero h1{font-size:24px}
  .hero .lede{display:none}
  .hero-right{min-height:86px}
  .hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
  .hstat .n{font-size:20px;letter-spacing:0}
  .hstat .l{font-size:9px;letter-spacing:.3px}
  .hero-cta{margin-top:14px}
  .hero-cta .btn{flex:1 1 130px;min-height:44px;padding:8px 10px}
  .sun-bar{margin-top:14px}
  .disc-grid{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .kpis{grid-template-columns:1fr 1fr}
  /* Análise: no celular a barra de incidência desce para uma linha própria — em 2 colunas
     ela espremia o nome do tópico e o placar. */
  .an-row{grid-template-columns:1fr auto;gap:5px 8px}
  .an-row .an-bar{grid-column:1/-1;order:3}
  .an-num{min-width:0}
  .toolbar,.log-form,.rec-controls,.lt-filters{gap:7px}
  .toolbar .btn,.toolbar select,.toolbar input{flex:1 1 auto;min-width:0}
  /* fila do SRS: os 4 botões (198px) não cabiam ao lado do texto — o item ficava 554px
     numa tela de 500px e o "Fácil" era cortado pelo guard de overflow-x. Agora eles
     descem para uma linha própria, ocupando a largura toda (alvo de toque maior). */
  .due-item{flex-wrap:wrap}
  .due-item .info{flex:1 1 auto;min-width:0}
  .due-item .srs-btns{flex:1 1 100%}
  .due-item .srs-btns button{flex:1;padding:8px 6px}
  /* fase macro: 4 segmentos + setas não cabem em 390px numa linha só — viram grade 2×2, setas somem */
  .fase-macro .fase-trilha{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .fase-arw{display:none}
  dialog{width:96vw;max-width:96vw}
  .dlg-f{padding:12px 16px 16px}
}
/* ================= Navegação inferior (celular) =================
   As 10 abas tinham o mesmo peso e, no celular, viravam uma tira que rolava de lado:
   "Argumento" e "Leituras" ficavam fora da tela e ninguém as achava. Elas são, na
   verdade, 3 modos — estudar / testar / medir. Aqui viram uma barra fixa de 5: as 3
   telas do dia a dia direto (Painel, Questões, Redação) e 2 grupos que abrem uma folha.
   Tudo a 1 ou 2 toques. No desktop a nav de cima continua exatamente como era.
   O `#dlgGrupo` usa seletor de ID de propósito: ele precisa vencer o `dialog{width:96vw}`
   do bloco de 560px acima (id > elemento), senão a folha vira um diálogo centralizado. */
#botNav{display:none}
@media(max-width:900px){
  .nav{display:none}                            /* morre a tira que rolava de lado */
  #botNav{
    display:grid;grid-template-columns:repeat(7,minmax(0,1fr));
    position:fixed;left:0;right:0;bottom:0;z-index:60;
    background:var(--surface);border-top:1px solid var(--border);
    padding-bottom:env(safe-area-inset-bottom);  /* a barra do iPhone não come o alvo */
  }
  #botNav button{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    min-height:58px;padding:8px 2px 9px;border:none;background:none;
    color:var(--faint);font-size:10.5px;font-weight:600;line-height:1.2}
  #botNav button .bi{font-size:19px;line-height:1;display:inline-flex}
  #botNav button.on{color:var(--sunset)}
  /* `main.wrap` e não `main`: o `.wrap{padding:0 20px}` é seletor de CLASSE e vence
     `main{...}` — por isso o padding-bottom do main sempre foi 0 (regra morta desde
     antes disto). Sem esta linha o rodapé fica escondido atrás da barra fixa. */
  main.wrap{padding-bottom:104px}
}
#dlgGrupo{border:none;padding:0;background:transparent;width:100%;max-width:100%;
  max-height:92vh;max-height:calc(100dvh - 16px);margin:auto auto 0}
#dlgGrupo::backdrop{background:rgba(0,0,0,.55)}
#dlgGrupo .sheet{background:var(--surface);border-top:1px solid var(--border);
  border-radius:18px 18px 0 0;padding:14px 16px calc(18px + env(safe-area-inset-bottom))}
#dlgGrupo .sheet-h{display:flex;align-items:center;justify-content:space-between;
  font-family:var(--serif);font-size:18px;font-weight:600;margin-bottom:10px}
.sheet-it{display:flex;align-items:center;gap:12px;width:100%;text-align:left;
  padding:12px 10px;border-radius:12px;border:1px solid transparent;min-height:56px;background:none}
.sheet-it:active{background:var(--raised)}
.sheet-it.on{border-color:var(--sunset);background:var(--raised)}
.sheet-it .ic{font-size:20px;width:26px;text-align:center;flex:0 0 auto}
.sheet-it .tx{display:flex;flex-direction:column;min-width:0}
.sheet-it .tt{font-size:14.5px;font-weight:600;color:var(--ink)}
.sheet-it .dd{font-size:11.5px;color:var(--faint);margin-top:2px}

/* Alvos de toque. Medido num viewport REAL de 390px com pointer:coarse: chips de 22px,
   chips de tópico de 18px, "abrir todas" de 25px — abaixo do mínimo confortável no dedo.
   ("abrir todas" tem classe .obs mas não fica dentro de .topic: o seletor .topic .obs não o
   pegava; a sonda audit-mobile achou no CI do horizonte-estudos em 08/10/2026. Por isso o #id.)
   Só vale onde não há mouse; no desktop a densidade continua a mesma. */
@media(hover:none){
  .btn,.chip,.pv-opt,.tag.tlink,.rt-go,.topic .obs,.lt-filters button,.an-tabs button,
  .red-filtros button,.wiz-nav button,.bq-links a,.bq-links button,.fase-chip,
  #editalToggleAll{min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:5px}
  .chip,.tag.tlink{padding:6px 12px}
  /* precisa repetir o seletor .toolbar: media query não soma especificidade,
     e .toolbar input[type=checkbox] (lá em cima) venceria o input[type=checkbox] daqui. */
  input[type=checkbox],.toolbar input[type=checkbox]{width:24px;height:24px}
  /* Sobras que a passada anterior não pegou (medido a 390px com toque emulado):
     o 📄 da proposta tinha 21px e as pistas do Simulador, 16px — abaixo dos 24x24px
     que a WCAG 2.2 (SC 2.5.8) exige. O <a> é inline: sem display:inline-flex o
     min-height não faz efeito nenhum. */
  a.badge-b{min-height:32px;display:inline-flex;align-items:center}
  .sim-row input[type=range]{height:34px}
  #anBusca{min-height:44px}
  /* Campo com fonte < 16px faz o Safari do iPhone dar ZOOM ao focar (e não volta sozinho).
     Os selects/inputs da barra, do diálogo e o #crTexto (style inline 14px) estavam em 12,5–14px.
     !important porque precisa vencer o style inline do #crTexto e os seletores .x input lá em cima.
     Conferido por pipeline/verificar/audit-mobile.js (achado "campo-zoom-ios"). */
  input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:16px!important}
}
.bq-fig-pdf{display:inline-flex;align-items:center;gap:6px;margin-top:10px;padding:7px 12px;border-radius:999px;border:1px solid var(--sunset);color:var(--sunset);font-size:12.5px;font-weight:600;text-decoration:none;transition:background .2s,transform .2s}
.bq-fig-pdf span{font-weight:400;color:var(--muted)}
.bq-fig-pdf:hover{background:color-mix(in srgb,var(--sunset) 12%,transparent);transform:translateY(-1px)}
/* ---- Sua semana (HZ-0002) ---- */
.semana{margin-bottom:16px}
.sem-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.sem-meta{font-size:12px;color:var(--muted)}
.sem-body{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin:12px 0 10px}
.sem-dots{display:flex;gap:8px}
.sd{display:flex;flex-direction:column;align-items:center;gap:5px}
.sd i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:14px;font-weight:700;
  border:1.5px solid color-mix(in srgb,var(--faint) 70%,transparent);background:var(--raised);color:#fff;transition:background .3s,border-color .3s,transform .3s}
.sd span{font-size:10.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.5px}
.sd.f i{background:var(--verde);border-color:var(--verde);animation:sdPop .45s cubic-bezier(.3,1.6,.5,1) both;animation-delay:calc(var(--i)*55ms)}
.sd.hj i{border-color:var(--sunset);box-shadow:0 0 0 3px color-mix(in srgb,var(--sunset) 22%,transparent)}
.sd.hj span{color:var(--sunset);font-weight:700}
.sd.fut i{opacity:.55;border-style:dashed}
.sd em{font-style:normal;font-size:10px;color:var(--muted);font-family:var(--mono)}
.sd.folga i{border-style:dotted;opacity:.35;background:transparent}
.sd.folga em{opacity:.6}
.sd.folga.f i{opacity:1}
@keyframes sdPop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
.sem-tx{flex:1;min-width:210px}
.sem-n{font-size:15px}
.sem-n b{font-family:var(--mono);font-size:22px;color:var(--verde)}
.sem-const{font-size:12px;color:var(--muted);margin-left:8px;white-space:nowrap}
.sem-bar{height:6px;border-radius:99px;background:var(--raised);overflow:hidden;margin:7px 0}
.sem-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--verde),var(--sunset));border-radius:99px;transition:width .6s ease}
.sem-msg{font-size:13px;color:var(--muted);margin:0;line-height:1.5}
.semana.ok{border-color:color-mix(in srgb,var(--verde) 45%,transparent)}
.sem-hoje{display:flex;gap:10px 14px;flex-wrap:wrap;align-items:center;justify-content:space-between;border-top:1px solid var(--border-soft);padding-top:10px}
.sem-dia{color:var(--ink)}
.sem-bts{display:flex;gap:8px;flex-wrap:wrap}
.sem-hoje .btn{font-size:12.5px;padding:6px 12px}
.ag-ed{margin-top:10px;font-size:12.5px;color:var(--muted)}
.ag-ed summary{cursor:pointer;width:max-content;opacity:.8}
.ag-ed summary:hover{opacity:1;color:var(--ink)}
.ag-l{display:flex;gap:6px 14px;align-items:center;flex-wrap:wrap;padding:5px 0;border-bottom:1px dashed var(--border-soft)}
.ag-d{min-width:62px;font-weight:600;color:var(--ink);text-transform:capitalize}
.ag-l input[type=number]{width:64px;padding:4px 7px;font-size:12.5px;background:var(--raised);color:var(--ink);border:1px solid var(--border-soft);border-radius:8px;font-family:var(--mono)}
.ag-l input[type=checkbox]{accent-color:var(--sunset);width:15px;height:15px;margin:0 6px 0 0;vertical-align:-2px}
.ag-d{display:inline-flex;align-items:center}
.ag-folga{font-style:italic;opacity:.7}
.ag-acts{margin-top:8px}
@media (pointer:coarse){   /* toque: agenda editável com alvos de 44px (checkbox maior + rótulo inteiro clicável) */
  .ag-l{min-height:44px}
  .ag-d{min-height:44px}
  .ag-l input[type=checkbox]{width:24px;height:24px;margin-right:10px}
  .ag-l input[type=number]{min-height:44px;font-size:16px}
  .ag-acts .obs,.foco-sem .obs{min-height:44px;padding:0 14px}
}
.foco-sem{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin-bottom:8px;flex-wrap:wrap}
.foco-card.feito{border-left-color:var(--verde);opacity:.8}
.foco-card.feito .fc-t{color:var(--verde)}
.due-resto{margin-top:10px;text-align:center}
@media(max-width:560px){.sd i{width:26px;height:26px;font-size:12px}.sem-dots{gap:5px;width:100%;justify-content:space-between}}
.pedidos{margin-bottom:16px;border:1px solid color-mix(in srgb,var(--sunset) 40%,var(--border-soft));background:linear-gradient(135deg,color-mix(in srgb,var(--sunset) 9%,var(--surface,transparent)),transparent 60%)}
.ped-t{font-family:var(--serif);font-size:21px;margin:6px 0 2px}
.ped-sub{color:var(--muted);font-size:13px;margin:0 0 12px;line-height:1.5}
.ped-tipos{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}
.ped-tipos button{min-height:44px;border:1px solid var(--border-soft);background:var(--raised);color:var(--ink);border-radius:999px;padding:6px 12px;font:inherit;font-size:12.5px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.ped-tipos button.on{border-color:var(--sunset);color:var(--sunset);font-weight:700;background:color-mix(in srgb,var(--sunset) 12%,var(--raised))}
.pedidos textarea{width:100%;box-sizing:border-box;min-height:84px;padding:10px 12px;border-radius:12px;border:1px solid var(--border-soft);background:var(--raised);color:var(--ink);font:inherit;font-size:16px;resize:vertical}
.pedidos textarea:focus{outline:none;border-color:var(--sunset);box-shadow:0 0 0 3px color-mix(in srgb,var(--sunset) 20%,transparent)}
.ped-acts .btn{min-height:44px}
.pedidos textarea::placeholder{color:var(--muted);opacity:1}
.ped-acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.ped-ok{color:var(--verde);font-size:13px;font-weight:600;animation:pedOk .5s ease both}
@keyframes pedOk{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.ped-nota{font-size:12px;color:var(--muted);margin:10px 0 0}
.ped-lista{margin-top:14px;display:flex;flex-direction:column;gap:7px}
.ped-i{display:flex;gap:10px;align-items:flex-start;padding:9px 11px;border-radius:10px;background:var(--raised);font-size:13px;line-height:1.45;animation:pedOk .4s ease both}
.ped-i.feito{opacity:.6}
.ped-c{flex:1}
.ped-c small{color:var(--faint)}
[role=button]:focus-visible{outline:2px solid var(--sunset);outline-offset:2px;border-radius:6px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}
/* ---------- provas oficiais (simulado c/ gabarito) ---------- */
#pvGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(238px,1fr));gap:6px}
.pv-row{display:flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid var(--border-soft);border-radius:9px;background:var(--surface)}
.pv-row .pn{font-family:var(--mono);font-size:11px;color:var(--faint);width:22px;text-align:right}
.pv-opt{width:30px;height:30px;border-radius:8px;border:1px solid var(--border);color:var(--muted);font-size:12px;font-weight:600;transition:.12s}
.pv-opt:hover{border-color:var(--azul);color:var(--ink)}
.pv-opt.sel{background:var(--azul);border-color:var(--azul);color:#0b1016}
.pv-opt.ok{background:var(--verde);border-color:var(--verde);color:#0b1016}
.pv-opt.bad{background:var(--vermelho);border-color:var(--vermelho);color:#fff}
.pv-opt.gab{border-color:var(--verde);color:var(--verde)}
.pv-opt:disabled{cursor:default;opacity:1}
.pv-row .anulada{font-size:10px;color:var(--faint);font-family:var(--mono);letter-spacing:1px}
.pv-hist-item{display:flex;gap:10px;align-items:center;padding:7px 10px;border-bottom:1px solid var(--border-soft);font-size:12.5px;flex-wrap:wrap}
.pv-hist-item .sc{font-family:var(--mono);font-weight:700}
.pv-reso-item{border:1px solid var(--border-soft);border-radius:10px;padding:11px 13px;margin-bottom:9px;background:var(--surface)}
.pv-reso-item .pv-reso-top{display:flex;align-items:center;gap:9px;margin-bottom:9px;flex-wrap:wrap}
.pv-reso-item .rr{font-size:12.5px;color:var(--muted)}
/* ---------- redação ---------- */
.split-red{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:980px){.split-red{grid-template-columns:1fr}}
.red-bib{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px;margin:10px 0}
.red-bib a.bib{display:block;border:1px solid var(--border-soft);border-radius:10px;padding:10px 12px;background:var(--surface);color:var(--ink);font-size:12.5px;line-height:1.45}
.red-bib a.bib:hover{border-color:var(--azul);text-decoration:none}
.red-bib a.bib .bt{color:var(--faint);font-size:10.5px;text-transform:uppercase;letter-spacing:1px;display:block;margin-bottom:3px}
.red-comps{display:flex;gap:6px;flex-wrap:wrap;font-family:var(--mono);font-size:10.5px}
.red-comps span{border:1px solid var(--border);border-radius:5px;padding:1px 6px;color:var(--muted)}
#drCompBox .comp-row{display:flex;align-items:center;gap:8px;margin-top:8px}
#drCompBox .comp-row label{margin:0;flex:1;font-size:12px}
#drCompBox select{width:90px}
/* ---- Recursos ---- */
.rec-controls{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.rec-controls select{background:var(--raised);border:1px solid var(--border);border-radius:8px;padding:7px 10px;font-size:13px}
.rec-disc{margin-bottom:22px}
.rec-disc-h{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.rec-disc-h .ic{font-size:18px;width:30px;height:30px;display:grid;place-items:center;background:var(--raised);border-radius:8px}
.rec-disc-h .nm{font-weight:600;font-size:15px}
.rec-chans{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;margin-bottom:14px}
a.rec-chan{display:block;border:1px solid var(--border-soft);border-left-width:3px;border-radius:10px;padding:11px 13px;background:var(--surface);color:var(--ink);transition:.12s}
a.rec-chan:hover{border-color:var(--azul);border-left-color:var(--azul);text-decoration:none;transform:translateY(-1px)}
a.rec-chan.essencial{border-left-color:var(--verde)} a.rec-chan.bom{border-left-color:var(--amarelo)} a.rec-chan.complementar{border-left-color:var(--faint)}
.rec-chan .ch-top{display:flex;align-items:center;gap:7px;margin-bottom:4px}
.rec-chan .ch-nm{font-weight:600;font-size:13.5px}
.rec-chan .ch-tier{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:1px;padding:1px 6px;border-radius:5px;margin-left:auto;white-space:nowrap}
.rec-chan.essencial .ch-tier{color:var(--verde);border:1px solid #2f5a48} .rec-chan.bom .ch-tier{color:var(--amarelo);border:1px solid #5a5030} .rec-chan.complementar .ch-tier{color:var(--faint);border:1px solid var(--border)}
.rec-chan .ch-tipo{font-family:var(--mono);font-size:9px;color:var(--faint);text-transform:uppercase;letter-spacing:1px}
.rec-chan .ch-foco{font-size:12px;color:var(--muted);line-height:1.45;margin-top:5px}
.rec-topics{border-top:1px solid var(--border-soft);padding-top:10px}
.rec-eixo-nm{font-family:var(--mono);font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);margin:8px 2px 5px}
.rec-topic{display:flex;align-items:center;gap:9px;padding:5px 6px;border-radius:8px;transition:.12s}
.rec-topic:hover{background:var(--raised)}
.rec-topic .rt-nm{flex:1;min-width:0;font-size:13px}
.rec-topic .rt-nm b{font-weight:500}
.rec-topic a.rt-go{font-size:11px;color:var(--azul);border:1px solid var(--border);border-radius:6px;padding:2px 8px;white-space:nowrap}
.rec-topic a.rt-go:hover{border-color:var(--azul);text-decoration:none}
.inc{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.8px;padding:1px 6px;border-radius:5px;white-space:nowrap;flex-shrink:0}
.inc.alta{color:var(--sunset);background:rgba(217,127,67,.14);border:1px solid var(--sunset-deep)}
.inc.media{color:var(--muted);background:var(--raised);border:1px solid var(--border)}
.inc.baixa{color:var(--faint);border:1px solid var(--border-soft)}
.inc.obs{font-weight:700;box-shadow:0 0 0 1px currentColor inset}
.rec-sites{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:9px;margin-top:6px}
a.rec-site{display:block;border:1px solid var(--border-soft);border-radius:9px;padding:9px 11px;background:var(--raised);color:var(--ink);font-size:12.5px}
a.rec-site:hover{border-color:var(--azul);text-decoration:none}
a.rec-site .st-nm{font-weight:600;display:block;margin-bottom:2px}
a.rec-site .st-foco{color:var(--muted);font-size:11.5px;line-height:1.4}
/* ---- Leituras ---- */
.lt-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.lt-filters button{padding:6px 13px;border-radius:99px;font-size:12.5px;color:var(--muted);border:1px solid var(--border);background:transparent;transition:.12s}
.lt-filters button:hover{color:var(--ink);border-color:var(--azul)}
.lt-filters button.on{color:var(--bg);background:var(--sunset);border-color:var(--sunset);font-weight:600}
.lt{background:var(--surface);border:1px solid var(--border-soft);border-left:3px solid var(--border);border-radius:var(--r);margin-bottom:11px;overflow:hidden;transition:.15s}
.lt.ingressante{border-left-color:var(--sunset)} .lt.remanescente{border-left-color:var(--azul)} .lt.coringa{border-left-color:var(--verde)}
.lt:hover{border-color:var(--border)}
.lt-h{display:flex;align-items:baseline;gap:10px;padding:14px 16px;cursor:pointer;flex-wrap:wrap}
.lt-h .tt{font-weight:600;font-size:15.5px}
.lt-h .au{font-size:13px;color:var(--muted)}
.lt-h .meta{font-family:var(--mono);font-size:10px;color:var(--faint);margin-left:6px}
.lt-h .badge{margin-left:auto;font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:1px;padding:2px 8px;border-radius:6px;white-space:nowrap}
.lt.ingressante .badge{color:var(--sunset);border:1px solid var(--sunset-deep)} .lt.remanescente .badge{color:var(--azul);border:1px solid var(--azul-deep)} .lt.coringa .badge{color:var(--verde);border:1px solid #2f5a48}
.lt-h .caret{font-size:11px;color:var(--faint);transition:.2s;margin-left:4px}
.lt.open .lt-h .caret{transform:rotate(90deg)}
.lt-body{display:none;padding:0 16px 16px;border-top:1px solid var(--border-soft)}
.lt.open .lt-body{display:block}
.lt-frase{font-size:14px;line-height:1.55;color:var(--ink);background:var(--raised);border-radius:10px;padding:12px 14px;margin:14px 0}
.lt-frase b{color:var(--ink)}
.lt-seclabel{font-family:var(--mono);font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);margin:16px 0 9px;display:flex;align-items:center;gap:7px}
.lt-eixo{border:1px solid var(--border-soft);border-radius:10px;padding:11px 13px;margin-bottom:9px;background:var(--surface)}
.lt-eixo .et{font-weight:600;font-size:13.5px;margin-bottom:6px}
.lt-eixo .lb{font-family:var(--mono);font-size:9.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);margin-right:5px}
.lt-eixo .ln{font-size:12.5px;line-height:1.5;color:var(--muted);margin-top:4px}
.lt-eixo .ln.use{color:var(--ink)}
.lt-obj{display:flex;gap:9px;font-size:12.5px;line-height:1.5;color:var(--muted);padding:6px 0;border-bottom:1px solid var(--border-soft)}
.lt-obj:last-child{border-bottom:0}
.lt-obj .ob-r{flex-shrink:0;font-family:var(--mono);font-size:10px;color:var(--azul);text-transform:uppercase;letter-spacing:.5px;min-width:96px}
.lt-conx{font-size:12.5px;color:var(--muted);line-height:1.5;background:var(--raised);border-radius:9px;padding:10px 12px;margin-top:14px}
.lt-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.lt-links a{font-size:11.5px;color:var(--azul);border:1px solid var(--border);border-radius:7px;padding:4px 10px}
.lt-links a:hover{border-color:var(--azul);text-decoration:none}
/* ---------- Dedicatória (kit presenteável — perfil-seed.js) ----------
   Renovada 28/09 (HZ-0004): uma carta sobre o céu do Guaíba. Ao abrir, o sol sobe
   devagar, as polaroids "revelam" (saem lavadas e ganham cor) e os parágrafos entram
   um a um. Estado final = estilo base (nada começa com opacity:0 fora do keyframe),
   então com movimento reduzido tudo aparece pronto. */
#dedic{position:fixed;inset:0;z-index:200;overflow-y:auto;color:#f6eef2;
  background:linear-gradient(180deg,#0b0e17 0%,#131a2e 30%,#33294a 56%,#7d4644 78%,#d27a45 94%,#f2a154 100%);}
#dedic::before{content:"";position:fixed;left:50%;bottom:-120px;transform:translateX(-50%);
  width:420px;height:420px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,206,140,.7) 0%,rgba(242,161,84,.28) 38%,transparent 70%);}
#dedic::after{content:"";position:fixed;left:0;right:0;bottom:0;height:22vh;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(242,161,84,.18) 40%,rgba(26,20,40,.55));
  -webkit-mask:repeating-linear-gradient(180deg,#000 0 2px,transparent 2px 7px);mask:repeating-linear-gradient(180deg,#000 0 2px,transparent 2px 7px)}
.dedic-in{position:relative;z-index:1;max-width:620px;margin:0 auto;padding:9vh 24px 16vh;text-align:center}
.dedic-kicker{font-family:var(--mono);font-size:10.5px;letter-spacing:3.5px;text-transform:uppercase;color:#f7b77a;margin-bottom:16px}
#dedicTitulo{font-family:var(--serif);font-size:clamp(30px,6vw,46px);font-weight:600;line-height:1.12;letter-spacing:-.5px;margin-bottom:30px;
  text-shadow:0 2px 30px rgba(242,161,84,.25)}
#dedicFotos{display:flex;justify-content:center;flex-wrap:wrap;margin:6px 0 38px;padding:0 10px}
#dedicFotos .pola{width:clamp(118px,30vw,158px);aspect-ratio:1/1.16;margin:0 -8px 10px;padding:0;border:0;background:none;cursor:pointer;
  perspective:900px;transform:rotate(var(--rot,0deg));transition:transform .35s cubic-bezier(.3,1.4,.5,1)}
#dedicFotos .pola:hover,#dedicFotos .pola:focus-visible{transform:rotate(0deg) scale(1.06);z-index:2;position:relative}
.pola-in{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.3,1.2,.4,1)}
.pola.virada .pola-in{transform:rotateY(180deg)}
.pola-f,.pola-v{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:3px;
  background:#fbf8f3;box-shadow:0 14px 30px rgba(0,0,0,.45)}
.pola-f{padding:6px 6px 26px}
.pola-f img{width:100%;height:100%;object-fit:cover;display:block}
.pola-v{transform:rotateY(180deg);display:grid;place-items:center;padding:14px;color:#3a2a2a;font-family:var(--serif);font-style:italic;
  font-size:14px;line-height:1.4;background:repeating-linear-gradient(180deg,#fbf8f3 0 21px,#e9dfd6 21px 22px)}
#dedicMsg{font-family:var(--serif);font-size:17px;line-height:1.8;color:#f3e9ee;text-align:left;
  padding:26px 26px 8px;border-radius:18px;background:rgba(11,14,23,.38);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  border:1px solid rgba(255,220,190,.12)}
#dedicMsg p{margin-bottom:16px}
#dedicMsg p:first-child{display:flow-root}
#dedicMsg p:first-child::first-letter{font-size:2.7em;float:left;line-height:.9;margin:6px 8px 0 0;color:#f7b77a}
#dedicAss{font-family:var(--serif);font-style:italic;font-size:19px;color:#f7b77a;margin:18px 6px 40px;text-align:right}
.dedic-go{display:inline-block;font-size:15px;font-weight:700;padding:14px 30px;border-radius:99px;border:0;cursor:pointer;
  background:linear-gradient(135deg,#ffd08f,#f2a154);color:#221407;box-shadow:0 8px 28px rgba(242,161,84,.45)}
.dedic-go:hover{filter:brightness(1.06);transform:translateY(-1px)}
.dedic-go:focus-visible{outline:3px solid #fff;outline-offset:3px}
.dedic-hint{font-size:12px;color:rgba(246,238,242,.7);margin-top:14px}
/* envelope lacrado: segurar o lacre (~0,9 s) rompe e abre a carta */
.dc-lacre{position:relative;z-index:2;min-height:100%;display:grid;place-items:center;padding:24px}
#dedic:not(.lacrado) .dc-lacre{display:none}
#dedic.lacrado .dedic-in{display:none}
.dc-env{position:relative;width:min(420px,88vw);aspect-ratio:1.45;border-radius:10px;background:linear-gradient(160deg,#f6ede4,#e7d6c6);
  box-shadow:0 30px 60px rgba(0,0,0,.5);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:16px;
  animation:dcUp .8s cubic-bezier(.2,.7,.2,1) backwards}
.dc-aba{position:absolute;inset:0 0 auto;height:58%;background:linear-gradient(180deg,#eadbcb,#dcc6b1);
  clip-path:polygon(0 0,100% 0,50% 100%);border-radius:10px 10px 0 0;transform-origin:top;transition:transform .7s ease}
.dc-para{position:absolute;top:auto;bottom:9%;left:0;right:0;text-align:center;font-family:var(--serif);font-style:italic;font-size:clamp(17px,4.4vw,22px);color:#5a3b33}
.dc-selo{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);width:78px;height:78px;border-radius:50%;border:0;cursor:pointer;
  background:radial-gradient(circle at 35% 30%,#d4555c,#9e2231 60%,#7a1826);color:#ffd9d2;font-size:26px;display:grid;place-items:center;
  box-shadow:0 6px 16px rgba(80,10,20,.45),inset 0 -4px 8px rgba(0,0,0,.25);touch-action:none;-webkit-user-select:none;user-select:none;
  transition:transform .2s}
.dc-selo:active,.dc-selo.segurando{transform:translate(-50%,-50%) scale(.94)}
.dc-selo:focus-visible{outline:3px solid #fff;outline-offset:4px}
.dc-selo svg{position:absolute;inset:-7px;width:92px;height:92px;transform:rotate(-90deg);pointer-events:none}
.dc-selo circle{fill:none;stroke:#ffd08f;stroke-width:4;stroke-linecap:round;stroke-dasharray:289;stroke-dashoffset:calc(289 - 289*var(--p,0))}
.dc-selo span{position:relative;font-family:var(--serif)}
.dc-dica{position:absolute;bottom:-38px;font-size:12.5px;color:rgba(246,238,242,.8);letter-spacing:.5px;animation:dcPisca 2.4s ease-in-out infinite}
@keyframes dcPisca{50%{opacity:.45}}
#dedic.abrindo .dc-selo{animation:dcRompe .55s ease-in forwards}
#dedic.abrindo .dc-aba{transform:rotateX(180deg)}
#dedic.abrindo .dc-env{animation:dcDesce .9s .35s ease-in forwards}
@keyframes dcRompe{40%{transform:translate(-50%,-50%) scale(1.15) rotate(-8deg)}100%{transform:translate(-50%,-50%) scale(.2) rotate(30deg);opacity:0}}
@keyframes dcDesce{to{transform:translateY(60vh) rotate(4deg);opacity:0}}
/* sequência de abertura (só com .on; reduced-motion zera tudo pelo guarda global) */
#dedic.on{animation:dcFade .7s ease backwards}
#dedic.on::before{animation:dcSol 3.2s cubic-bezier(.2,.7,.2,1) backwards}
#dedic.on .dedic-kicker,#dedic.on #dedicTitulo{animation:dcUp .9s cubic-bezier(.2,.7,.2,1) backwards}
#dedic.on #dedicTitulo{animation-delay:.25s}
#dedic.on #dedicFotos .pola{animation:dcCai .8s cubic-bezier(.3,1.3,.5,1) backwards,dcRevela 2.6s ease-out backwards;
  animation-delay:calc(.55s + var(--i,0)*.16s),calc(.75s + var(--i,0)*.16s)}
#dedic.on #dedicMsg{animation:dcUp .8s ease backwards;animation-delay:1.1s}
#dedic.on #dedicMsg p{animation:dcUp .8s ease backwards;animation-delay:calc(1.35s + var(--i,0)*.22s)}
#dedic.on #dedicAss{animation:dcUp .9s ease backwards;animation-delay:calc(1.6s + var(--n,0)*.22s)}
#dedic.on .dedic-go{animation:dcUp .7s ease backwards,dcBrilho 2.8s ease-in-out infinite;animation-delay:calc(1.9s + var(--n,0)*.22s),calc(2.8s + var(--n,0)*.22s)}
#dedic.saindo{animation:dcSai .5s ease forwards}
@keyframes dcFade{from{opacity:0}to{opacity:1}}
@keyframes dcSol{from{bottom:-330px;opacity:.4}to{bottom:-120px;opacity:1}}
@keyframes dcUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes dcCai{from{opacity:0;transform:translateY(-26px) rotate(calc(var(--rot,0deg)*4)) scale(.92)}to{opacity:1;transform:rotate(var(--rot,0deg))}}
@keyframes dcRevela{from{filter:sepia(.6) brightness(1.9) contrast(.55) blur(1.5px)}to{filter:none}}
@keyframes dcBrilho{0%,100%{box-shadow:0 8px 28px rgba(242,161,84,.45)}50%{box-shadow:0 8px 40px rgba(255,208,143,.75)}}
@keyframes dcSai{to{opacity:0;transform:translateY(-18px)}}
@media(max-width:560px){#dedicMsg{font-size:16px;padding:20px 18px 4px}.dedic-in{padding-top:6vh}}
#dlBilheteBody p{margin-bottom:12px}
/* ---------- R2: wizard de redação (Critério → Tema → Escrever) ---------- */
.wizard{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:4px 0 18px}
@media(max-width:820px){.wizard{grid-template-columns:1fr}}
.passo{background:var(--surface);border:1px solid var(--border-soft);border-radius:12px;padding:13px 16px;cursor:pointer;text-align:left;transition:.15s}
.passo .num{font-family:var(--mono);font-size:10px;letter-spacing:1.6px;color:var(--faint)}
.passo b{display:block;font-size:15px;margin:3px 0 2px}
.passo .d{font-size:11.5px;color:var(--muted);display:block;line-height:1.4}
.passo.feito{border-color:#2f5a48}
.passo.feito .num{color:var(--verde)}
.passo.feito .num::after{content:" ✓"}
.passo.atual{border-color:var(--sunset);box-shadow:0 0 0 1px var(--sunset) inset}
.passo.atual .num{color:var(--sunset)}
.passo.trava{opacity:.45;cursor:not-allowed}
.rub-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.rub-card{background:var(--surface);border:1px solid var(--border-soft);border-radius:12px;padding:14px;cursor:pointer;transition:.15s;text-align:left;font-size:inherit}
.rub-card:hover{border-color:var(--sunset-deep);transform:translateY(-1px)}
.rub-card.sel{border-color:var(--sunset);box-shadow:0 0 0 1px var(--sunset) inset}
.rub-card .rb-nm{font-weight:700;font-size:15px}
.rub-card .rb-esc{font-family:var(--mono);font-size:10.5px;color:var(--sunset);margin-left:6px}
.rub-card ul{margin:8px 0 0;padding-left:16px;font-size:12px;color:var(--muted);line-height:1.55}
.grid-tema{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:12px}
.tema-card{background:var(--surface);border:1px solid var(--border-soft);border-radius:12px;overflow:hidden;cursor:pointer;transition:.15s;display:flex;flex-direction:column}
.tema-card:hover{transform:translateY(-2px);border-color:var(--sunset-deep)}
.tema-card .capa{height:60px;display:flex;align-items:flex-end;justify-content:space-between;gap:6px;padding:8px 12px;flex-shrink:0}
.capa.b-ufrgs{background:linear-gradient(140deg,#1a2a44,#4a3040 70%,#c77b35)}
.capa.b-enem{background:linear-gradient(140deg,#14304a,#1a4a5e 70%,#2e8ca8)}
.capa.b-fuvest{background:linear-gradient(140deg,#2a1f3d,#40305c 70%,#7a5aa8)}
.capa.b-livre{background:linear-gradient(140deg,#1c3a32,#2f5a48 70%,#3fb984)}
.badge-b{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:1px;background:rgba(0,0,0,.42);color:#fff;border-radius:99px;padding:3px 10px;text-decoration:none}
a.badge-b:hover{background:rgba(0,0,0,.7);text-decoration:none}
.tema-card .corpo{padding:10px 12px 12px;display:flex;flex-direction:column;gap:7px;flex:1}
.tema-card .corpo b{font-size:13px;line-height:1.4;font-weight:600}
.st-faixa{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;border-radius:99px;padding:3px 10px;width:fit-content;margin-top:auto}
.st-faixa.ok{color:var(--verde);background:rgba(63,185,132,.1);border:1px solid #2f5a48}
.st-faixa.pend{color:var(--amarelo);background:rgba(230,185,63,.08);border:1px solid #5a5030}
.st-faixa.novo{color:var(--muted);background:var(--raised);border:1px solid var(--border-soft)}
.tema-filtros{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 12px}
.tema-filtros button{font-size:12px;padding:5px 12px;border-radius:99px;border:1px solid var(--border);color:var(--muted);transition:.12s}
.tema-filtros button:hover{color:var(--ink);border-color:var(--sunset-deep)}
.tema-filtros button.on{background:var(--sunset);border-color:var(--sunset);color:var(--bg);font-weight:600}
/* histórico de redações em cards */
.red-hist{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.red-serie{grid-column:1/-1;padding:12px;border:1px solid var(--border);border-radius:14px;background:var(--raised)}
.red-serie-t{display:flex;align-items:baseline;gap:8px 14px;flex-wrap:wrap;margin:0 2px 12px;font-size:12px}
.red-serie-t strong{color:var(--ink)}.red-serie-t span{color:var(--muted)}
.red-serie-t .chip{margin-left:auto;min-height:44px}
.red-serie-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.red-etapa{font-size:11px;font-weight:700;color:var(--sunset);text-transform:uppercase;letter-spacing:.04em}
.red-hist .rh{background:var(--surface);border:1px solid var(--border-soft);border-radius:12px;padding:13px 14px;display:flex;flex-direction:column;gap:8px}
.rh .top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rh .top .tm{font-size:13px;font-weight:600;line-height:1.35;flex:1;min-width:0}
.rh .nota{font-family:var(--mono);font-weight:700;font-size:17px}
.rh p{font-size:12.5px;color:var(--muted);line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0}
.rh .acts{display:flex;gap:7px;flex-wrap:wrap;margin-top:auto;align-items:center}
/* ---------- R3: análise · sub-abas + desempenho de redação ---------- */
.an-tabs{display:flex;gap:6px;margin-bottom:16px}
.an-tabs button{padding:7px 18px;border-radius:99px;font-size:13px;color:var(--muted);border:1px solid var(--border);transition:.12s}
.an-tabs button:hover{color:var(--ink)}
.an-tabs button.on{background:var(--sunset);border-color:var(--sunset);color:var(--bg);font-weight:600}
.bq-sub{animation:bqIn .2s cubic-bezier(.2,.7,.2,1)}
@keyframes bqIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* Fase 3 — mapa de risco (scatter incidência × acerto, canvas) */
.an-map-wrap{position:relative}
#anMap{display:block;width:100%;height:260px;cursor:crosshair}
.an-map-tip{position:absolute;pointer-events:none;z-index:6;display:none;background:var(--overlay);
  border:1px solid var(--border);border-radius:8px;padding:6px 9px;font-size:11.5px;line-height:1.45;
  color:var(--muted);box-shadow:0 8px 20px rgba(0,0,0,.32);max-width:210px;transform:translate(-50%,calc(-100% - 10px))}
.an-map-tip b{color:var(--ink)}
.an-map-empty{color:var(--muted);font-size:13px;line-height:1.55;padding:26px 8px;text-align:center}
/* números tabulares: dígitos de largura fixa — não "pulam" quando o valor muda (RELATORIO §KPIs).
   `lining-nums` junto de propósito: a Candara (Ateliê) usa algarismos de ESTILO ANTIGO por padrão —
   o zero desce e "0/13 dominados" era lido como "o/13". Num app de números isso parece defeito. */
.hstat .n,.kpi .n,.sim-out .big,.sim-row .ep,.sim-row .pw,.an-num,.disc-h .pct,.hd .ring text{font-variant-numeric:lining-nums tabular-nums}
:root[data-style="atelie"] body{font-variant-numeric:lining-nums}
.anr-hero{display:grid;grid-template-columns:250px 1fr;gap:16px;margin-bottom:16px}
@media(max-width:820px){.anr-hero{grid-template-columns:1fr}}
.anr-anel{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  background:linear-gradient(170deg,var(--raised),var(--surface));border:1px solid var(--sunset-deep);border-radius:var(--r);padding:18px}
.anr-crit{padding:9px 0;border-bottom:1px solid var(--border-soft)}
.anr-crit:last-child{border-bottom:0}
.anr-crit .cr-top{display:flex;justify-content:space-between;gap:10px;font-size:13px;margin-bottom:5px}
.anr-crit .cr-top .v{font-family:var(--mono);color:var(--muted)}
.anr-crit .trilho{height:9px;border-radius:5px;background:var(--raised);overflow:hidden}
.anr-crit .trilho i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--sunset-deep),var(--sunset))}
.anr-crit.fraco .trilho i{background:linear-gradient(90deg,#8a3d36,var(--vermelho))}
/* ---------- R1: home — disciplinas compactas + foco com porquês ---------- */
/* grid-auto-rows:1fr — todas as linhas com a MESMA altura. Sem isso, "Língua Portuguesa"
   e "Língua Estrangeira" quebram o título em 2 linhas e a fileira delas fica mais alta que
   as outras: dez cards iguais viravam três alturas diferentes. */
/* 220px e não 235: são 10 disciplinas, e a 1440px (notebook comum) 235 dava 4 colunas —
   4+4+2, com dois buracos na última fileira. Com 220 cabem 5 (contando os 40px de padding
   do .wrap, que quase me enganaram), e 10 fecha em 2 fileiras cheias de 1440 pra cima. */
.home-discs{display:grid;grid-template-columns:repeat(auto-fill,minmax(208px,1fr));grid-auto-rows:1fr;gap:14px;margin-bottom:28px}
.hd{background:var(--surface);border:var(--card-bd);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:13px 15px;cursor:pointer;display:flex;align-items:center;gap:13px;transition:var(--motion);text-align:left;font-size:inherit}
.hd:hover{border-color:var(--azul);transform:translateY(-1px)}
.hd:active{transform:scale(.985)}
/* anel de progresso: azul Guaíba = progresso (o âmbar deixou de pintar tudo) */
.hd .ring{flex:0 0 auto}
.hd .ring .rt{stroke:var(--raised2)}
.hd .ring .rp{stroke:var(--azul)}
.hd .ring text{fill:var(--ink);font-family:var(--mono);font-weight:600}
.hd-tx{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
.hd header{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14px}
.hd .peso{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--faint);background:var(--raised2);border:1px solid var(--border-soft);border-radius:99px;padding:1px 7px}
.hd .meta{font-size:11px;color:var(--faint)}
@media(max-width:560px){
  .home-discs{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-bottom:18px}
  .hd{min-height:54px;padding:8px 9px;gap:7px}
  .hd .ring{display:none}
  .hd header{font-size:12px;gap:4px;line-height:1.25}
  .hd .peso{padding:0 5px;font-size:9px}
  .hd .meta{display:none}
}
.foco-card{border:1px solid var(--border-soft);border-left:3px solid var(--azul);border-radius:var(--radius-sm);background:var(--raised);padding:11px 13px;margin-bottom:9px}
.foco-card .fc-t{font-weight:600;font-size:13.5px}
.foco-card .why{font-size:11.5px;color:var(--muted);margin:3px 0 8px;line-height:1.5}
.foco-card .why b{color:var(--amarelo)}
.foco-card .fc-acts{display:flex;gap:7px;flex-wrap:wrap}
.foco-card .fc-acts .btn{font-size:12px;padding:5px 12px}
/* alerta: você marcou como dominado, mas erra as questões oficiais do tópico */
.foco-card.alerta{border-left-color:var(--vermelho)}
/* ===== ⑤ Recursos = plataforma-guia (mapa/trilha por disciplina) ===== */
.rec-vista{display:flex;align-items:center;gap:8px;margin:0 0 14px;flex-wrap:wrap}
.rec-vista .rv-lb{font-size:11px;color:var(--faint);text-transform:uppercase;letter-spacing:1px}
.rv-btn{padding:6px 13px;border-radius:99px;border:1px solid var(--border);background:var(--raised);color:var(--muted);font:inherit;font-size:13px;cursor:pointer;transition:.14s}
.rv-btn:hover{color:var(--ink)}
.rv-btn.on{background:var(--surface);color:var(--ink);border-color:var(--sunset-deep);box-shadow:inset 0 0 0 1px var(--sunset-deep)}
.rec-guia{background:var(--surface);border:var(--card-bd);border-radius:var(--radius);padding:16px;margin-bottom:16px;box-shadow:var(--card-shadow)}
.rec-guia-h{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.rec-guia-h .ic{font-size:19px}
.rec-guia-h .nm{font-weight:600;font-size:15px}
.rec-guia-h .wt{font-size:11.5px;color:var(--faint);font-family:var(--mono)}
.rec-guia-h .rg-prog{flex:1;height:6px;border-radius:99px;background:var(--raised);overflow:hidden;min-width:50px}
.rec-guia-h .rg-prog i{display:block;height:100%;background:var(--sunset)}
.rec-guia-h .rg-pct{font-size:12px;color:var(--muted);font-family:var(--mono)}
.rec-esquema .rec-eixo{margin-bottom:11px}
.rec-esquema .rec-eixo-nm{font-size:11.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.6px;margin:0 0 6px}
.rec-tiles{display:flex;flex-wrap:wrap;gap:7px}
.rec-tile{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:9px;border:1px solid var(--border-soft);background:var(--raised);color:var(--ink);font:inherit;font-size:12.5px;cursor:pointer;text-align:left;transition:.14s}
.rec-tile:hover{border-color:var(--sunset-deep);transform:translateY(-1px)}
.rec-tile .rt-dot{width:8px;height:8px;border-radius:99px;background:var(--cinza);flex:none}
.rec-tile.t1 .rt-dot{background:var(--amarelo)}
.rec-tile.t2 .rt-dot{background:var(--verde)}
.rec-tile.alta{box-shadow:inset 0 -2px 0 var(--sunset)}
.rec-tile .rt-inc{color:var(--sunset);font-size:11px}
.rec-tile .rt-q{color:var(--azul);font-size:10.5px;font-family:var(--mono);opacity:.85}
.rec-legenda{display:flex;flex-wrap:wrap;gap:12px;margin-top:9px;font-size:11px;color:var(--faint);align-items:center}
.rec-legenda .lg{display:inline-block;width:9px;height:9px;border-radius:99px;margin-right:4px;vertical-align:middle}
.rec-legenda .lg.t0{background:var(--cinza)}.rec-legenda .lg.t1{background:var(--amarelo)}.rec-legenda .lg.t2{background:var(--verde)}
.rec-trilha{display:flex;flex-direction:column;gap:2px}
.rec-etapa{padding:7px 0}
.re-lb{font-size:11.5px;color:var(--sunset);font-weight:600;margin-bottom:6px;display:flex;align-items:center;gap:6px}
.re-arw{color:var(--faint)}
.rec-trilha-vazia{font-size:12.5px;color:var(--muted);margin-bottom:10px}
.rec-guia-canais{margin-top:13px;border-top:1px solid var(--border-soft);padding-top:11px}
.rg-sub{font-size:11px;color:var(--faint);text-transform:uppercase;letter-spacing:.7px;margin-bottom:7px}
.rd-trio{display:flex;flex-wrap:wrap;gap:6px;margin:3px 0 4px}
.rd-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:99px;border:1px solid var(--border);background:var(--raised);color:var(--ink);font-size:12.5px;text-decoration:none;transition:.14s}
.rd-chip:hover{border-color:var(--sunset-deep);color:var(--ink)}

/* Configurações: os controles vivem no conteúdo em todos os layouts. */
.config-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
#tab-config .card{min-width:0;margin:0}
#tab-config .ap-grid{grid-template-columns:minmax(0,1fr)}
#tab-config .ap-sec{min-width:0}
#tab-config .theme-pick{width:100%}
#tab-config h2{font:600 20px var(--font-title);margin:0 0 14px}
#tab-config .profile-pick{display:flex;flex-wrap:wrap;gap:8px;margin:0}
#tab-config .profile-pick select{flex:1 1 180px;min-width:0;min-height:44px;font-size:16px}
#tab-config .profile-pick .pbtn{width:44px;height:44px;flex:none}
#tab-config .course-pick{display:block;margin:0}
#tab-config .course-pick span{display:none}
#tab-config .course-pick select{width:100%;min-height:44px;font-size:16px}
#tab-config .aj-row{display:flex;flex-wrap:wrap;gap:8px}
#tab-config .aj-row .btn{min-height:44px}
#tab-config .aj-copia{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;font-size:13.5px}
#tab-config .aj-copia .q{color:var(--faint);font-size:12px}
#tab-config .aj-copia .chip{min-height:44px}
#tab-config .aj-t{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);margin:14px 0 8px}
#tab-config details summary{cursor:pointer;min-height:44px;padding:10px 0}
#tab-config .ajuda-b{padding:12px 0 0}
@media(max-width:900px){
  .config-grid{grid-template-columns:minmax(0,1fr)}
  #tab-config .nav-pick{display:none}
  #configLayout{display:none}
  #tab-config select{font-size:16px}
  /* nada mais estoura a lateral: selects/inputs cabem no pai, o hero não cresce pelo conteúdo */
  select,input,textarea{max-width:100%}
  .hero-grid{grid-template-columns:minmax(0,1fr)}
  .hero-left,.hero-right{min-width:0}
  .fase-chip{white-space:normal;max-width:100%}
}
@media(max-width:820px){
  /* trilha 1fr = minmax(auto,1fr): o conteúdo mais largo esticava a coluna além da tela */
  .split,.sim-grid{grid-template-columns:minmax(0,1fr)}
  .split>*,.sim-grid>*{min-width:0}
}
@media(max-width:560px){ .disc-grid,.two-col{grid-template-columns:minmax(0,1fr)} }
@media(max-width:400px){
  .hero-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 8px}
  .sim-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 40px 34px;gap:6px}
}

/* Recursos: chips de disciplina (o <select> fica escondido, mas segue sendo a fonte do valor) */
.rec-chips{display:flex;flex-wrap:wrap;gap:6px}
.rec-chips button{padding:7px 14px;border-radius:99px;font-size:13px;color:var(--muted);border:1px solid var(--border);transition:.12s}
.rec-chips button.on{background:var(--sunset);border-color:var(--sunset);color:var(--bg);font-weight:600}
#recDisc{display:none}
.rec-controls{flex-wrap:wrap}
/* Painel: seções recolhíveis (fechadas no celular — ver boot em app.js) */
.pn-sec{margin:0 0 8px;border:1px solid var(--border);border-radius:14px;background:var(--surface);transition:border-color .15s}
.pn-sec[open]{border-color:color-mix(in srgb,var(--sunset) 35%,var(--border))}
.pn-sec>*:not(summary){padding:0 14px 14px}
.pn-sec>summary{cursor:pointer;list-style:none;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:0 14px;min-height:48px;display:flex;align-items:center;gap:8px}
.pn-sec>summary::-webkit-details-marker{display:none}
.pn-sec>summary::before{content:"▸";transition:transform .2s cubic-bezier(.2,.7,.2,1)}
.pn-sec[open]>summary::before{transform:rotate(90deg)}
.pn-sec:has(>div:empty:only-of-type){display:none}

/* ============================================================
   HOJE — cena viva: o céu vai da noite ao amanhecer conforme você estuda (app-hoje.js)
   Movimento só onde tem função: o sol sobe (progresso), o botão pulsa (contando), a meta
   solta raios (1 vez). Estrelas/nuvens são ambiente, bem lentos. Tudo em transform/opacity.
   ============================================================ */
@property --hjc1{syntax:"<color>";inherits:true;initial-value:#0a1128}
@property --hjc2{syntax:"<color>";inherits:true;initial-value:#1b2750}
#tab-painel>.hero{display:none}
.hoje{display:grid;grid-template-columns:1fr;gap:16px;margin:2px 0 22px}
.hj-cenawrap{position:relative}
.hj-cena{position:relative;height:206px;border-radius:20px;overflow:hidden;border:1px solid var(--border);
  box-shadow:0 10px 30px -12px rgba(0,0,0,.55);transition:--hjc1 1.3s cubic-bezier(.2,.7,.2,1),--hjc2 1.3s cubic-bezier(.2,.7,.2,1)}
.hj-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.hj-sunG{transition:transform 1.3s cubic-bezier(.2,.7,.2,1)}
.hj-halo,.hj-raios,.hj-estrelas{transition:opacity 1.3s ease}
.hj-raios{fill:#ffd9a0;transform-origin:200px 190px;animation:hjGira 120s linear infinite}
@keyframes hjGira{to{transform:rotate(360deg)}}
.hj-estr{fill:#fff;opacity:.85;animation:hjPisca 4.2s ease-in-out infinite}
@keyframes hjPisca{50%{opacity:.25}}
.hj-nv ellipse{fill:rgba(255,255,255,.07)}
.hj-nv.n1{animation:hjDeriva 46s ease-in-out infinite alternate}
.hj-nv.n2{animation:hjDeriva 62s ease-in-out infinite alternate-reverse}
@keyframes hjDeriva{from{transform:translateX(-26px)}to{transform:translateX(26px)}}
.hj-h1{fill:#18244d}.hj-h2{fill:#101a3b}.hj-h3{fill:#0a1230}
.hj-meta-raios line{stroke:#ffe3a8;stroke-width:2.2;stroke-linecap:round;opacity:0;transform-origin:200px 190px;transform:rotate(var(--a))}
.hj-cena.meta .hj-meta-raios line{animation:hjBurst 1.3s cubic-bezier(.2,.7,.2,1) both}
@keyframes hjBurst{0%{opacity:0;transform:rotate(var(--a)) translateY(0) scaleY(.4)}25%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateY(-70px) scaleY(1)}}
.hj-cab{position:absolute;left:16px;right:16px;top:14px;display:flex;flex-direction:column;gap:2px;text-shadow:0 1px 10px rgba(5,10,30,.6)}
.hj-data{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.hj-ola{font-family:var(--font-title);font-weight:500;font-size:22px;line-height:1.15;color:#fff;margin:0}
/* botão principal: grande o bastante para o polegar, encavalado na borda da cena */
.hj-go-btn,#hjFlut{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border:0;border-radius:99px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--sunset) 88%,#fff),var(--sunset-deep));color:#1b1207;font:600 15px/1 var(--font-body);
  cursor:pointer;box-shadow:0 10px 26px -8px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .15s cubic-bezier(.2,.7,.2,1),box-shadow .2s;-webkit-tap-highlight-color:transparent}
.hj-go-btn{position:relative;display:flex;margin:-26px auto 0;z-index:2}
.hj-go-btn:active,#hjFlut:active{transform:scale(.97)}
.hj-go-btn:focus-visible,#hjFlut:focus-visible{outline:2px solid #fff;outline-offset:3px}
.hj-tm{font-variant-numeric:tabular-nums;font-size:18px;letter-spacing:.02em}
.hj-sep{width:1px;height:20px;background:rgba(27,18,7,.28)}
.hj-ponto{width:9px;height:9px;border-radius:50%;background:#1b1207;animation:hjPulsa 1.6s ease-in-out infinite}
@keyframes hjPulsa{50%{transform:scale(.55);opacity:.5}}
.hj-go-btn.rodando{animation:hjAnel 2.2s ease-out infinite}
@keyframes hjAnel{0%{box-shadow:0 10px 26px -8px rgba(0,0,0,.45),0 0 0 0 rgba(0,0,0,.25)}100%{box-shadow:0 10px 26px -8px rgba(0,0,0,.45),0 0 0 16px transparent}}
/* botão flutuante (contagem rodando em qualquer outra aba) */
#hjFlut{position:fixed;z-index:70;left:50%;transform:translateX(-50%);bottom:calc(76px + env(safe-area-inset-bottom));min-height:46px;padding:0 20px;font-size:14px}
#hjFlut:active{transform:translateX(-50%) scale(.97)}
#hjFlut[hidden]{display:none}
@media(min-width:901px){#hjFlut{left:auto;right:28px;bottom:24px;transform:none}#hjFlut:active{transform:scale(.97)}}
.hj-lado{display:flex;flex-direction:column;gap:12px}
.hj-prog-t{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.hj-prog-t b{color:var(--ink);font-weight:600;font-size:15px}
.hj-link{background:none;border:0;padding:6px 0;min-height:44px;font-size:12px;color:var(--faint);text-decoration:underline;text-underline-offset:3px;cursor:pointer;white-space:nowrap}
.hj-link:hover{color:var(--ink)}
.hj-trilho{height:6px;border-radius:99px;background:var(--raised2);overflow:hidden;margin-top:6px}
.hj-trilho i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--sunset-deep),var(--sunset));transition:width 1.3s cubic-bezier(.2,.7,.2,1)}
.hj-lista{display:flex;flex-direction:column;gap:8px}
.hj-row{display:flex;align-items:center;gap:12px;width:100%;min-height:54px;padding:10px 14px;text-align:left;border-radius:14px;
  background:var(--surface);border:1px solid var(--border);color:var(--ink);cursor:pointer;
  transition:transform .16s cubic-bezier(.2,.7,.2,1),border-color .16s,background .16s}
.hj-row:hover{border-color:color-mix(in srgb,var(--sunset) 60%,var(--border));background:var(--raised)}
.hj-row:active{transform:scale(.985)}
.hj-ic{font-size:18px;width:24px;text-align:center}
.hj-tx{flex:1;display:flex;flex-direction:column;gap:1px;min-width:0}
.hj-tx b{font-weight:600;font-size:14px}
.hj-tx small{color:var(--muted);font-size:12px}
.hj-go{color:var(--faint);font-size:20px;line-height:1;transition:transform .16s,color .16s}
.hj-row:hover .hj-go{transform:translateX(3px);color:var(--sunset)}
.hj-stats{margin:2px 0 0;font-size:11.5px;color:var(--faint);text-align:center}
.hoje.in .hj-cenawrap,.hoje.in .hj-prog,.hoje.in .hj-row,.hoje.in .hj-stats{animation:hjSobe .6s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0)*70ms)}
@keyframes hjSobe{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(min-width:901px){
  .hoje{grid-template-columns:minmax(0,1.25fr) minmax(300px,1fr);gap:28px;align-items:start;margin-bottom:26px}
  .hj-cena{height:300px}
  .hj-ola{font-size:30px}
  .hj-cab{left:24px;top:20px}
  .hj-lado{padding-top:6px}
  .hj-stats{text-align:left}
}
/* folha de registro (usa o mesmo molde do dlgGrupo) */
#dlgSessao{border:none;padding:0;background:transparent;width:100%;max-width:520px;margin:auto auto 0;color:var(--ink)}
#dlgSessao::backdrop{background:rgba(0,0,0,.55)}
#dlgSessao[open]{animation:hjFolha .26s cubic-bezier(.2,.7,.2,1)}
@keyframes hjFolha{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
#dlgSessao .sheet{background:var(--surface);border-top:1px solid var(--border);border-radius:18px 18px 0 0;
  padding:14px 16px calc(18px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px}
#dlgSessao .sheet-h{display:flex;align-items:center;justify-content:space-between;font-family:var(--font-title);font-size:19px;font-weight:600}
@media(min-width:900px){#dlgSessao{margin:auto}#dlgSessao .sheet{border-radius:18px;border:1px solid var(--border)}}
.hj-step{display:flex;align-items:center;justify-content:center;gap:14px}
.hj-step button{width:56px;height:56px;border-radius:50%;border:1px solid var(--border);background:var(--raised);color:var(--ink);font-size:16px;cursor:pointer;transition:transform .12s,border-color .12s}
.hj-step button:hover{border-color:var(--sunset)}
.hj-step button:active{transform:scale(.92)}
.hj-step label{display:flex;align-items:baseline;gap:6px}
.hj-step input{width:104px;text-align:center;font-family:var(--font-title);font-size:44px;font-weight:500;background:none;border:0;border-bottom:2px solid var(--border);color:var(--ink);padding:0 0 2px;-moz-appearance:textfield}
.hj-step input::-webkit-outer-spin-button,.hj-step input::-webkit-inner-spin-button{-webkit-appearance:none}
.hj-step input:focus{outline:0;border-color:var(--sunset)}
.hj-step span{color:var(--muted);font-size:14px}
.hj-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.hj-chip{min-height:44px;padding:8px 14px;border-radius:99px;border:1px solid var(--border);background:var(--raised);color:var(--muted);font-size:13.5px;cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .15s}
.hj-chip.on{background:var(--sunset);border-color:var(--sunset);color:#1b1207;font-weight:600}
.hj-chip:active{transform:scale(.95)}
#hjObs,#hjData{width:100%;min-height:46px;padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:var(--bg);color:var(--ink);font-size:16px}
.hj-outro summary{font-size:13px;color:var(--faint);cursor:pointer;min-height:44px;display:flex;align-items:center}
.hj-outro input{margin-top:6px}
.hj-salvar{min-height:52px;font-size:16px;width:100%;position:sticky;bottom:0;box-shadow:0 -10px 14px -6px var(--surface)}   /* o Salvar acompanha a rolagem: nunca some atrás da barra/teclado */
/* toque com resposta: botões encolhem de leve ao apertar */
.btn:active,.chip:active,.an-tabs button:active,.rec-chips button:active{transform:scale(.97)}

/* ================= Folha do tópico (dlgTopico) e "Perguntar à IA" (dlgIA) ================= */
#dlgTopico{width:min(600px,96vw);max-width:96vw;height:min(88vh,760px);height:min(88dvh,760px)}
.tp-h{position:relative;padding:14px 60px 0 16px;border-bottom:1px solid var(--border-soft)}
.tp-disc{font-size:12px;color:var(--muted)}
.tp-h h3{margin:2px 0 8px;font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.25;overflow-wrap:anywhere}
.tp-x{position:absolute;top:8px;right:8px;width:44px;height:44px;border-radius:50%;border:1px solid var(--border);background:var(--raised);color:var(--ink);font-size:16px;cursor:pointer}
.tp-st{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 12px;border-radius:99px;border:1px solid var(--border);background:var(--raised);color:var(--muted);font-size:12px;cursor:pointer}
.tp-st::before{content:"";width:9px;height:9px;border-radius:50%;border:2px solid var(--cinza)}
.tp-st.s1::before{border-color:var(--amarelo);background:var(--amarelo)}
.tp-st.s2::before{border-color:var(--verde);background:var(--verde)}
.tp-tabs{display:flex;margin:8px -16px 0 -16px;padding:0 8px}
.tp-tabs button{flex:1;min-height:44px;background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);font:inherit;font-size:13.5px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.tp-tabs button.on{color:var(--ink);font-weight:600;border-bottom-color:var(--sunset)}
.tp-tabs i{font-style:normal;font-size:10.5px;min-width:17px;padding:1px 5px;border-radius:99px;background:var(--raised2);color:var(--muted)}
.tp-b{flex:1 1 auto !important;padding:16px}
.tp-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}
.tp-act{display:flex;flex-direction:column;gap:3px;text-align:left;min-height:64px;padding:11px 13px;border-radius:12px;border:1px solid var(--border);background:var(--raised);color:var(--ink);font:inherit;cursor:pointer}
.tp-act b{font-size:14px;font-weight:600}
.tp-act small{font-size:11.5px;color:var(--muted);line-height:1.35}
.tp-act:hover{border-color:var(--sunset-deep)}
.tp-sec{font-family:var(--mono);font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);margin:18px 0 8px}
.tp-sec:first-child{margin-top:0}
.tp-chips{display:grid;gap:8px}
.tp-chip{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;min-height:48px;padding:10px 13px;border-radius:12px;border:1px solid var(--border-soft);background:var(--surface);color:var(--ink);font:inherit;font-size:14px;text-decoration:none;cursor:pointer}
.tp-chip small{font-size:11.5px;color:var(--muted);line-height:1.35;white-space:normal}
.tp-chip:hover{border-color:var(--sunset-deep);text-decoration:none}
.tp-busca{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tp-busca a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:68px;border-radius:12px;border:1px solid var(--border);background:var(--raised);color:var(--ink);font-size:13px;text-decoration:none}
.tp-busca a span{font-size:20px}
.tp-busca a:hover{border-color:var(--sunset-deep);text-decoration:none}
.tp-vazio{color:var(--faint);font-size:13px;text-align:center;margin:28px 0}
#tpNota{width:100%;background:var(--raised);border:1px solid var(--border);border-radius:12px;padding:12px;font-size:16px;line-height:1.5;min-height:200px;margin:0 0 10px}
#dlgIA{width:min(520px,96vw)}
.ia-ops{display:grid;gap:8px;margin-top:4px}
.ia-op{display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 10px;min-height:56px;padding:9px 14px;border-radius:12px;border:1px solid var(--border);background:var(--raised);color:var(--ink);text-decoration:none}
.ia-op b{font-size:15px}
.ia-op small{grid-column:1;font-size:11.5px;color:var(--muted)}
.ia-op span{grid-row:1/3;grid-column:2;font-size:22px;color:var(--faint)}
.ia-op.on{border-color:var(--sunset)}
.ia-op:hover{border-color:var(--sunset-deep);text-decoration:none}
#iaTxt{font-size:16px}
.dlg-f[hidden]{display:none}
@media(max-width:480px){.tp-acts{grid-template-columns:1fr}.tp-busca a{min-height:60px}}

/* ================= Vidro (liquid glass na web) =================
   expo-glass-effect é React Native/iOS 26 e não roda num site; o equivalente web é backdrop-filter +
   brilho de borda. Barras: translúcidas com blur/saturação (o conteúdo passa por baixo). Botões: reflexo
   no topo + borda de luz; o blur só aparece onde há algo atrás (barras, "Parar" flutuante).
   Fica no FIM do arquivo para vencer os temas. Sem suporte → cai nos fundos sólidos de antes. */
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  :root{
    --vidro-bg:color-mix(in srgb,var(--surface) 56%,transparent);
    --vidro-luz:color-mix(in srgb,#fff 24%,transparent);
    --vidro-borda:color-mix(in srgb,#fff 15%,transparent);
    --vidro-brilho:linear-gradient(180deg,color-mix(in srgb,#fff 16%,transparent),color-mix(in srgb,#fff 3%,transparent));
    --vidro-fx:blur(22px) saturate(180%);
  }
  :root:not(#v)[data-nav="topo"] header.top,:root:not(#v) #botNav,:root:not(#v)[data-nav="inferior"] .nav{background:var(--vidro-bg);-webkit-backdrop-filter:var(--vidro-fx);backdrop-filter:var(--vidro-fx);
    box-shadow:inset 0 1px 0 var(--vidro-luz)}
  #botNav{border-top-color:var(--vidro-borda)}
  .btn:not(.primary):not(.on),.chip,.tp-x,.tp-st,.tp-act,.ia-op{background-image:var(--vidro-brilho);
    border-color:var(--vidro-borda);box-shadow:inset 0 1px 0 var(--vidro-luz)}
  .btn.primary{box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 45%,transparent),inset 0 -1px 0 color-mix(in srgb,#000 12%,transparent)}
  .hj-go-btn,#hjFlut{box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 50%,transparent),0 8px 24px rgba(0,0,0,.28)}
  #hjFlut{background:linear-gradient(180deg,color-mix(in srgb,var(--sunset) 82%,transparent),color-mix(in srgb,var(--sunset-deep) 82%,transparent));
    -webkit-backdrop-filter:blur(14px) saturate(170%);backdrop-filter:blur(14px) saturate(170%)}
}
@media (prefers-reduced-transparency:reduce){
  :root:not(#v) header.top,:root:not(#v) #botNav,:root:not(#v)[data-nav="inferior"] .nav{background:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none}
  #hjFlut{background:linear-gradient(180deg,var(--sunset),var(--sunset-deep));-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* ================= Barra lateral (desktop, layout "lateral") — redesenhada em 31/10/2026 =================
   Antes: 10 caixas iguais + pilha de controles soltos no rodapé. Agora: menu em 3 grupos (rótulo discreto),
   itens leves (sem caixa; o ativo ganha trilho e fundo suave) e rodapé compacto: 3 ícones + perfil + curso.
   Só vale no layout lateral; topo/inferior e o celular não mudam (os rótulos de grupo ficam escondidos). */
.nav-g{display:none}
@media(min-width:901px){
  :root:not([data-nav="topo"]):not([data-nav="inferior"]) header.top .top-in{display:grid;grid-template-columns:repeat(3,1fr);
    grid-template-rows:auto minmax(0,1fr) auto auto auto;gap:8px 4px;padding:24px 14px 16px;align-content:stretch}
  :root:not([data-nav="topo"]):not([data-nav="inferior"]) .brand{grid-column:1/-1;grid-row:1;padding:0 10px 16px;gap:3px}
  :root:not([data-nav="topo"]):not([data-nav="inferior"]) .brand .h{font-size:19px;white-space:nowrap}
  :root:not([data-nav="topo"]):not([data-nav="inferior"]) .nav{grid-column:1/-1;grid-row:2;align-self:start;max-height:100%;overflow-y:auto;gap:1px;scrollbar-width:thin}
  :root:not([data-nav="topo"]):not([data-nav="inferior"]) .nav-g{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);padding:16px 12px 6px}
  :where(:root:not([data-nav="topo"]):not([data-nav="inferior"])) .nav button{position:relative;min-height:38px;padding:7px 12px;gap:12px;background:none;border:0;
    border-radius:10px;font-size:13.5px;font-weight:500;color:var(--muted)}
  :where(:root:not([data-nav="topo"]):not([data-nav="inferior"])) .nav button .ni{font-size:16px;width:22px;filter:none;opacity:.9}
  :where(:root:not([data-nav="topo"]):not([data-nav="inferior"])) .nav button:hover{background:color-mix(in srgb,var(--raised) 80%,transparent);color:var(--ink)}
  :where(:root:not([data-nav="topo"]):not([data-nav="inferior"])) .nav button.on{background:var(--raised);color:var(--ink);font-weight:600;box-shadow:none}
  :where(:root:not([data-nav="topo"]):not([data-nav="inferior"])) .nav button.on::before{content:"";position:absolute;left:-14px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--sunset)}
  /* marca: sol nascente (CSS puro, sem emoji); itens um pouco mais altos para a coluna não ficar oca */
  :root:not([data-nav="topo"]):not([data-nav="inferior"]) .brand::before{content:"";display:block;width:26px;height:13px;margin-bottom:8px;
    border-radius:26px 26px 0 0;background:linear-gradient(var(--sunset),var(--sunset-deep,var(--sunset)));box-shadow:0 1px 0 var(--border)}
  :where(:root:not([data-nav="topo"]):not([data-nav="inferior"])) .nav button{min-height:40px}
  @media(pointer:coarse){
    :where(:root:not([data-nav="topo"]):not([data-nav="inferior"])) .nav button{min-height:44px}
  }
}


/* ---- Redação: editor livre + filtros do histórico ---- */
.red-livre{margin-bottom:22px}
.rlv-ctl{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}
.rlv-ctl label,.rf-l,.rlv-alvo{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted)}
.rlv-ctl select,.rlv-ctl input,.rf-l select,.rlv-alvo input{min-height:44px;background:var(--raised);border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:13.5px}
.rlv-ctl label{flex:1 1 170px;min-width:0}.rlv-ctl .rlv-tema{flex:2 1 240px}
.rlv-ctl select{max-width:100%}
#rlvTexto,#rlvBloco{width:100%;box-sizing:border-box;background:var(--raised);border:1px solid var(--border);border-radius:10px;padding:12px;font-family:var(--serif);font-size:16px;line-height:1.7;resize:vertical}
#rlvBloco{font-family:var(--mono);font-size:12.5px;line-height:1.5;margin:4px 0 8px}
.rlv-bar{display:flex;gap:6px 16px;flex-wrap:wrap;align-items:center;margin:8px 0;font-size:12.5px;color:var(--muted)}
.rlv-lim[data-st=abaixo]{color:var(--amarelo)}.rlv-lim[data-st=acima]{color:var(--vermelho)}
.rlv-folha{margin:0 0 10px}
.rlv-cal{margin:0 0 12px;font-size:12px;color:var(--muted)}
.rlv-cal summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--azul)}
.rlv-cal label{display:block;margin:8px 0 5px}
.rlv-cal input{width:86px;min-height:44px;background:var(--raised);border:1px solid var(--border);border-radius:8px;padding:6px 10px;color:var(--ink)}
.rlv-cal .note-hint{display:block;margin-top:6px}
.rlv-cron{display:inline-flex;gap:6px;align-items:center;margin-left:auto}
.rlv-cron output{font-family:var(--mono);font-size:15px;color:var(--ink);min-width:3.6em}
.rlv-acts{margin:10px 0 6px}.rlv-alvo input{width:120px}
.rlv-acts .btn,.rf-bar .btn{min-height:44px}
.rlv-cron .chip,.rlv-acts .chip{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;padding:6px 14px}
.rf-bar{align-items:flex-end}
.rh .tm-btn{background:none;border:0;padding:0;color:var(--ink);font:inherit;font-weight:600;font-size:13px;text-align:left;cursor:pointer;min-height:44px}
.rh .tm-btn:hover{color:var(--sunset)}
.rh .acts .chip{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:900px){
  .rlv-cron{margin-left:0}
  .rf-l{flex:1 1 140px}.rf-l select{width:100%}
}


/* ---- Redação: layout de desktop (contêiner centralizado, 2 colunas >=1100px) ---- */
.red-wrap{max-width:1280px;margin:0 auto}
.red-top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.red-top .section-sub{margin:0;max-width:58ch}
.red-cta{min-height:44px;padding:10px 24px}
.red-resumo{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}
.rr-t{background:var(--surface);border:1px solid var(--border-soft);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;min-width:0}
.rr-l{font-family:var(--mono);font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--faint)}
.rr-v{font-size:22px;line-height:1.2;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.rr-d{font-size:12px;color:var(--muted);line-height:1.4;overflow-wrap:anywhere}
.seg{display:inline-flex;gap:2px;padding:4px;background:var(--raised);border:1px solid var(--border-soft);border-radius:14px;margin-bottom:18px}
.seg button{min-height:44px;padding:8px 22px;border-radius:10px;background:none;border:0;color:var(--muted);font:inherit;font-size:13.5px;cursor:pointer;transition:background .15s,color .15s}
.seg button:hover{color:var(--ink)}
.seg button.on{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:0 0 0 1px var(--sunset) inset}
.red-esc,.red-notas{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:start}
.red-esc-ed .red-livre{margin-bottom:0}
.red-col-l,.red-col-r,.red-esc-ed,.red-esc-prop{min-width:0}
.red-col-r{display:flex;flex-direction:column;gap:14px}
.red-col-r .card{margin:0}
.red-esc-prop .wizard{grid-template-columns:1fr;margin-bottom:12px}
.red-esc-prop .grid-tema{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.red-vazio{margin-top:8px;border:1px dashed var(--border);border-radius:10px;padding:16px;color:var(--muted);font-size:13px;line-height:1.55}
.red-vazio[hidden],#redEvoBox[hidden],#redCompBox[hidden],#compHint[hidden]{display:none}
.rf-busca{flex:1 1 200px}
.rf-busca input{width:100%;box-sizing:border-box;min-height:44px;background:var(--raised);border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:13.5px}
.red-bib{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin:0;align-items:start}
.bib-card{display:flex;flex-direction:column;gap:7px;background:var(--surface);border:1px solid var(--border-soft);border-radius:12px;padding:13px 14px;min-width:0}
.bc-h{display:flex;gap:8px;align-items:center}
.bc-t{font-size:13.5px;line-height:1.4}
.bc-s{font-size:12px;color:var(--muted)}
.bc-links{display:flex;gap:6px;flex-wrap:wrap}
.selo-1000{margin-left:auto;font-family:var(--mono);font-weight:700;font-size:10.5px;letter-spacing:.8px;color:var(--amarelo);border:1px solid var(--amarelo);border-radius:99px;padding:2px 9px}
@media(min-width:1100px){
  .red-esc{grid-template-columns:minmax(0,1.45fr) minmax(300px,1fr)}
  .red-notas{grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr)}
  .red-col-r{position:sticky;top:14px}
}
@media(max-width:1099px){ .red-col-r{order:-1} }
@media(max-width:900px){
  .red-resumo{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rr-v{font-size:22px}
  .red-top .red-cta{width:100%}
  .seg{display:flex}
  .seg button{flex:1 1 0;padding:8px 6px}
}

/* Leitor: cores por competência + aba Resumo em faixas com aba deslocada (referência coffee-questions) */
:root{--lei-c1:#2f9b80;--lei-c2:#4a82d6;--lei-c3:#b36ad0;--lei-c4:#e07b3c;--lei-c5:#c9b53a}
.lei-tabs button.on{border-bottom-color:var(--cc,var(--sunset))}
.lei-faixas{display:grid;gap:0}
.lei-fx{position:relative;display:block;text-align:left;width:100%;border:0;font:inherit;color:#fff;cursor:pointer;padding:30px 14px 12px;background:color-mix(in srgb,var(--cc) 62%,#0b1020)}
.lei-fx .aba{position:absolute;top:0;left:var(--off);background:rgba(0,0,0,.34);padding:2px 10px;font:600 11px var(--mono,monospace);letter-spacing:.05em;font-style:normal}
.lei-fx b{display:block;font-size:14px}.lei-fx span{display:block;font-size:12.5px;opacity:.92;margin-top:2px}
.lei-fx:focus-visible{outline:2px solid var(--azul);outline-offset:-2px}

/* Leituras: eixos em colunas escalonadas (referência coffee-roast) */
.lt-trilha{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;align-items:end}
.lt-trilha .lt-eixo{min-width:0}
.lt-trilha .lt-eixo .et{padding-top:calc(var(--n,0)*14px)}
.lt-cap{display:block;font:600 10.5px var(--mono,monospace);letter-spacing:.07em;color:var(--sunset);font-style:normal;margin-bottom:4px;border-top:3px solid var(--sunset);padding-top:5px}
.lt-trilha .lt-eixo:nth-child(2) .lt-cap{border-color:var(--azul)}.lt-trilha .lt-eixo:nth-child(3) .lt-cap{border-color:var(--verde)}
@media(max-width:640px){.lt-trilha .lt-eixo .et{padding-top:0}}

/* Semana: blocos de cor chapada (referência night-dates) */
.sem-dots{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;width:100%}
.sd{align-items:stretch;gap:0;background:var(--surface);border:1px solid var(--border-soft);padding:8px 6px 7px;min-height:74px;justify-content:space-between;text-align:left;border-radius:3px}
.sd i{width:auto;height:auto;border:0;border-radius:0;background:none;place-items:start;font-size:17px;box-shadow:none;animation:none}
.sd span{order:-1;font-size:10.5px}
.sd.f{background:color-mix(in srgb,var(--verde) 38%,#0b1020);border-color:var(--verde)}
.sd.f i{background:none;border:0;animation:none;color:#fff}
.sd.hj{background:var(--sunset);border-color:var(--sunset)}
.sd.hj span,.sd.hj em,.sd.hj i{color:#1a0f02;box-shadow:none}
.sd.hj.f{background:var(--verde)}.sd.hj.f span,.sd.hj.f em,.sd.hj.f i{color:#fff}
.sd.folga{opacity:.5}.sd.folga i{opacity:1}
.sd.fut:not(.hj){opacity:.8}
@media(max-width:560px){.sem-dots{gap:4px}.sd{min-height:66px;padding:6px 4px}}

/* Respiro no topo do conteúdo (01/11): `.wrap{padding:0 20px}` (classe) vencia `main{padding:26px 0 90px}`, então o padding-top do main era 0
   e a página colava no topo da tela. `main.wrap` tem especificidade maior. */
main.wrap{padding-top:clamp(28px,3.4vw,44px)}
@media(max-width:560px){main.wrap{padding-top:20px}}

/* Métricas e Questões no mesmo vocabulário do leitor/semana (01/11): KPIs com aba de cor no topo, linha respondida em bloco chapado */
.kpis .kpi{position:relative;border-radius:3px;border-top:3px solid var(--sunset);padding-top:14px}
.kpis .kpi:nth-child(4n+2){border-top-color:var(--verde)}
.kpis .kpi:nth-child(4n+3){border-top-color:var(--azul)}
.kpis .kpi:nth-child(4n+4){border-top-color:var(--lei-c3)}
#tab-metricas .card,#tab-banco .card{border-radius:6px}
.pv-row{border-radius:3px}
.pv-row:has(.pv-opt.sel){background:color-mix(in srgb,var(--azul) 22%,var(--surface));border-color:var(--azul)}
.pv-row:has(.pv-opt.ok){background:color-mix(in srgb,var(--verde) 28%,var(--surface));border-color:var(--verde)}
.pv-row:has(.pv-opt.bad){background:color-mix(in srgb,var(--vermelho) 26%,var(--surface));border-color:var(--vermelho)}
.pv-row:has(.pv-opt.sel) .pn,.pv-row:has(.pv-opt.ok) .pn,.pv-row:has(.pv-opt.bad) .pn{color:var(--ink)}

/* Prova online: cada questão vira cartão com enunciado + alternativas (mesmos botões .pv-opt da grade) */
#pvGrid.tela{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.pv-row.pv-q{display:block;padding:14px 16px;border-radius:6px}
.pv-q .pv-qh{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.pv-q .pn{width:auto;text-align:left;font-size:13px;color:color-mix(in srgb,var(--sunset) 65%,var(--ink));font-weight:600}
.pv-q .ctx{color:var(--muted);font-size:13.5px;margin-bottom:8px}
.pv-q .en{line-height:1.65;margin:6px 0 12px}
.pv-q .pv-opts{display:grid;gap:6px}
.pv-q .pv-opt{width:auto;height:auto;min-height:44px;display:flex;gap:10px;align-items:flex-start;text-align:left;padding:10px 12px;font-weight:400;font-size:14.5px;line-height:1.5}
.pv-q .pv-opt .L{font-weight:700;min-width:1.2em}
.pv-q .pv-opt.sel .L,.pv-q .pv-opt.ok .L,.pv-q .pv-opt.bad .L{color:inherit}
.pv-q .pv-opt{justify-content:flex-start}
.pv-q .pv-opt.sel{background:color-mix(in srgb,var(--azul) 30%,var(--surface));color:var(--ink)}

/* Cartilhas: leitor com destaques do aluno */
#crtRoot{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
#crtRoot>.toolbar,#crtRoot>.crt-wrap,#crtRoot>.note-hint{grid-column:1/-1}
.crt-card{text-align:left;cursor:pointer;font:inherit;color:inherit;border-top:3px solid var(--sunset);border-radius:3px}
.crt-card:hover{border-color:var(--azul)}
.crt-wrap{display:grid;grid-template-columns:240px minmax(0,1fr);gap:16px;align-items:start}
.crt-idx{display:grid;gap:3px;position:sticky;top:12px;max-height:80vh;overflow:auto}
.crt-idx button{text-align:left;padding:8px 10px;border-radius:4px;border:1px solid transparent;background:none;color:var(--muted);font-size:13px;min-height:36px}
.crt-idx button.on{background:var(--raised);color:var(--ink);border-color:var(--sunset)}
.crt-hit,.crt-nd{font-style:normal;font-size:11px;padding:0 5px;border-radius:99px;background:var(--surface);color:var(--sunset)}
.crt-txt{line-height:1.8;font-size:15.5px}
.crt-txt p{margin:0 0 1em}
.crt-txt mark{background:color-mix(in srgb,var(--cc) 28%,transparent);color:inherit;border-bottom:2px solid var(--cc);border-radius:2px;cursor:pointer}
.crt-q{background:var(--sunset);color:#1a0f02;border-radius:2px}
.crt-bar{position:fixed;left:50%;bottom:76px;transform:translateX(-50%);display:flex;gap:10px;align-items:center;padding:8px 14px;background:var(--raised);border:1px solid var(--border);border-radius:99px;box-shadow:0 6px 24px rgba(0,0,0,.45);z-index:50}
.crt-bar[hidden]{display:none}
.crt-bar button{width:28px;height:28px;border-radius:50%;border:2px solid #0b1020;cursor:pointer}
.crt-d{border-left:4px solid var(--cc);background:var(--surface);padding:10px 12px;margin-bottom:8px;border-radius:3px;display:grid;gap:6px}
.crt-d blockquote{margin:4px 0 0;color:var(--muted);font-size:13.5px}
.crt-d textarea{width:100%}
.crt-da{display:flex;gap:6px}
@media(max-width:760px){.crt-wrap{grid-template-columns:1fr}.crt-idx{position:static;max-height:none;grid-auto-flow:column;grid-auto-columns:max-content;overflow-x:auto}}

.hj-sess{display:grid;gap:6px;max-height:55vh;overflow:auto}
.hj-sr{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 10px;background:var(--surface);border:1px solid var(--border-soft);border-radius:4px;font-size:14px}
.hj-sa{display:flex;gap:6px;flex-shrink:0}
.hj-sa .btn{padding:6px 10px;min-height:44px}

/* ===== Correção de layout (01/11 noite) =====
   1) Diálogos modais colavam no canto esquerdo no desktop (o reset zera o margin:auto do UA) — centraliza TODOS.
   2) Mapa do Edital: disciplina aberta ocupa a linha inteira e distribui os eixos em colunas (sem buraco enorme ao lado).
   3) Painel: seções recolhíveis não têm mais cartão dentro de cartão nem título duplicado. */
dialog:modal{margin:auto;inset:0}
@media(min-width:900px){
  #dlgTopico{width:min(980px,92vw);height:min(90vh,860px);height:min(90dvh,860px)}
  #dlgTopico .tp-b{padding:22px 28px;max-width:78ch;margin:0 auto;width:100%}
  #dlgTopico .tp-h{padding-left:28px}
}
.disc.open{grid-column:1/-1}
.disc.open .disc-body{column-width:360px;column-gap:28px;padding:10px 18px 16px}
.disc.open .disc-body .eixo{break-inside:avoid;margin-bottom:14px}
.disc.open .disc-body>.note-hint{column-span:all;margin-bottom:8px}
.pn-sec .card,.pn-sec #trilhaArranque{background:none;border:0!important;box-shadow:none;margin:0!important;padding-left:16px!important;padding-right:16px!important}
.pn-sec>*:not(summary){padding-top:2px}
#semana .sem-h .eyebrow{display:none}
#semana .sem-h{justify-content:flex-end}
.pn-sec #trilhaArranque{padding-top:4px}
.pn-sec .home-discs{margin-top:0}

.t-col{min-width:44px;min-height:44px;background:none;border:0;color:var(--faint);font-size:18px;cursor:pointer;border-radius:50%}
.t-col.on{color:var(--amarelo)}
.t-col:hover{color:var(--amarelo)}
.an-col{min-width:32px;min-height:32px;font-size:15px;vertical-align:middle}
#edColBtn[aria-pressed="true"]{border-color:var(--amarelo);color:var(--amarelo)}

/* ===== Tema "Estudo" (02/11) — referência IMG_6578 (Espace d'étude): marrom-dourado, ladrilhos de disciplina, abas em pílula (IMG_6586) ===== */
:root[data-theme="estudo"]{
  color-scheme:dark;
  --bg:#16100c; --surface:#1f1712; --raised:#2a1f18; --raised2:#352820; --overlay:#3b2d23;
  --border:#4a382b; --border-soft:#35281f;
  --ink:#eddfcb; --muted:#b9a58b; --faint:#8a7762;
  --azul:#a9b89a; --azul-deep:#7d8c70;          /* sálvia: progresso discreto */
  --sunset:#d4a063; --sunset-deep:#b9824a;      /* dourado */
  --verde:#8dbb86; --amarelo:#dcae55; --cinza:#7a6a58; --vermelho:#d3685a;
  --card-shadow:0 1px 0 rgba(255,235,200,.04) inset,0 8px 22px rgba(0,0,0,.35);
  --grad:linear-gradient(120deg,#7d8c70,#d4a063);
}
:root[data-theme="estudo"] body{background:radial-gradient(1200px 420px at 70% -80px,rgba(212,160,99,.16),transparent 70%),var(--bg)}
:root[data-theme="estudo"] header.top{background:rgba(22,16,12,.86)}
:root[data-theme="estudo"] .hero{background:linear-gradient(180deg,#2a1f18,#1a130e)}
:root[data-theme="estudo"] dialog::backdrop{background:rgba(12,8,5,.74)}
:root[data-theme="estudo"] .nav button.on{background:var(--raised2);color:var(--sunset)}
/* disciplinas como ladrilhos quentes */
:root[data-theme="estudo"] .disc{background:linear-gradient(160deg,var(--raised),var(--surface));border:1px solid var(--border);border-radius:6px}
:root[data-theme="estudo"] .disc.open{border-color:var(--sunset-deep)}
:root[data-theme="estudo"] .disc-h .ic{background:rgba(212,160,99,.14);border-radius:6px}
/* abas em pílula: ativo elevado com ponto indicador */
:root[data-theme="estudo"] .an-tabs{background:var(--surface);border:1px solid var(--border);border-radius:99px;padding:4px;display:inline-flex;gap:2px;flex-wrap:wrap}
:root[data-theme="estudo"] .an-tabs button{border:0;border-radius:99px;background:none;color:var(--muted)}
:root[data-theme="estudo"] .an-tabs button.on{background:var(--raised2);color:var(--ink);box-shadow:0 2px 8px rgba(0,0,0,.4)}
:root[data-theme="estudo"] .kpis .kpi{border-radius:6px;background:linear-gradient(160deg,var(--raised),var(--surface))}
:root[data-theme="estudo"] .btn.primary{background:var(--sunset);color:#24160a}
:root[data-theme="estudo"] .card,:root[data-theme="estudo"] .pn-sec{border-color:var(--border)}
:root[data-theme="estudo"] .hj-cena{filter:sepia(.85) saturate(1.5) hue-rotate(-12deg) brightness(.92);border-radius:8px}

/* ===== 02/11 rodada 2 — Consistência (mapa de calor, ref. IMG_6581), marca luminosa (IMG_6584/6585), nav em pílula (IMG_6586) ===== */
.calor{overflow-x:auto}
.cl-grid{display:flex;gap:4px;align-items:flex-start;min-width:max-content}
.cl-l{display:grid;grid-template-rows:repeat(7,16px);gap:4px;font-size:10px;color:var(--faint);padding-right:4px}
.cl-l span{line-height:16px}
.cl-c{display:grid;grid-template-rows:repeat(7,16px);gap:4px}
.cl-c i,.cl-leg i{display:block;width:16px;height:16px;border-radius:4px;background:var(--raised)}
.cl-c i.n1,.cl-leg i.n1{background:color-mix(in srgb,var(--sunset) 28%,var(--raised))}
.cl-c i.n2,.cl-leg i.n2{background:color-mix(in srgb,var(--sunset) 52%,var(--raised))}
.cl-c i.n3,.cl-leg i.n3{background:color-mix(in srgb,var(--sunset) 78%,var(--raised))}
.cl-c i.n4,.cl-leg i.n4{background:var(--sunset)}
.cl-c i.fut{background:none;border:1px dashed var(--border-soft)}
.cl-leg{display:flex;align-items:center;gap:4px;margin-top:10px;font-size:11px;color:var(--faint);justify-content:flex-end}
.cl-leg i{width:12px;height:12px;border-radius:3px}
@media (max-width:600px){.cl-c i,.cl-l{--t:14px}.cl-c i{width:14px;height:14px}.cl-c,.cl-l{grid-template-rows:repeat(7,14px)}.cl-l span{line-height:14px}}
/* marca lateral luminosa no item ativo da lateral (todos os temas) */
@media (min-width:901px){
  :where(:root:not([data-nav="topo"]):not([data-nav="inferior"])) .nav button.on::before{box-shadow:0 0 10px 1px color-mix(in srgb,var(--sunset) 70%,transparent)}
}
/* navegação no topo: trilho em pílula, ativo elevado (v1 da IMG_6586) */
:root[data-nav="topo"] .nav{background:var(--surface);border:1px solid var(--border);border-radius:99px;padding:3px}
:root[data-nav="topo"] .nav button{border-radius:99px}
:root[data-theme="estudo"][data-nav="topo"] .nav button.on{background:var(--raised2);color:var(--ink);box-shadow:0 2px 8px rgba(0,0,0,.35)}
@media (prefers-reduced-motion:no-preference){.cl-c i{transition:transform .12s}.cl-c i:hover{transform:scale(1.25)}}

/* texto-base original da prova (pipeline/extrair_texto_base.py) */
.txb{white-space:pre-wrap;font-size:14px;line-height:1.6;margin:0 0 10px;padding:10px 12px;border-left:3px solid var(--border);border-radius:6px}

/* resolução pós-simulado: cores explícitas (tema-seguras), nada de texto claro sobre fundo claro */
.pv-reso-det{margin:8px 0}.pv-reso-det>summary{cursor:pointer;font-weight:600;color:var(--ink);padding:6px 0}
.pv-reso-body{margin-top:8px}.pv-alts{display:grid;gap:6px;margin:10px 0}
.pv-alt{display:flex;gap:10px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--ink)}
.pv-alt.gab{border-color:var(--verde);background:color-mix(in srgb,var(--verde) 16%,var(--surface))}
.pv-alt.marc{border-color:var(--vermelho);background:color-mix(in srgb,var(--vermelho) 14%,var(--surface))}
.pv-alt i{font-style:normal;font-size:12px;opacity:.8}.pv-exp{margin-top:6px;color:var(--ink)}

.brand .ver{margin-left:8px;padding:1px 7px;border:1px solid var(--border);border-radius:999px;font-size:11px;font-weight:600;color:var(--ink);background:var(--surface);opacity:.8;vertical-align:middle}
/* Simulados: controles de prova, carimbos e leitura da correção. */
.sim-tabs{display:flex;flex-wrap:wrap;gap:4px}
#tab-simulados .card{max-width:100%;min-width:0}
#tab-simulados .toolbar{flex-wrap:wrap}
.sim-riscar,.sim-duvidar{border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--muted);background:var(--surface);cursor:pointer}
.sim-riscar{font-size:11px;padding:4px;min-width:24px;min-height:28px}
.sim-duvidar{font-size:11px;padding:5px;margin-left:auto}
.sim-duvida-nota{display:block;width:100%;max-width:360px;margin:8px 0 4px;padding:8px;color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm)}
.pv-opt.sim-riscada{text-decoration:line-through;opacity:.5}
.pv-opt.sim-duvida{outline:2px dotted var(--azul);outline-offset:2px}
.pv-row{position:relative}
.pv-carimbo{position:absolute;right:10px;top:8px;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:64px;height:64px;border:3px double var(--vermelho);border-radius:50%;color:var(--vermelho);background:var(--surface);font:700 11px var(--mono);letter-spacing:.3px;transform:rotate(-8deg);opacity:.85;pointer-events:none;mix-blend-mode:multiply}
.pv-carimbo small{font-size:9px}
:root[data-theme="escuro"] .pv-carimbo,:root[data-theme="guaiba"] .pv-carimbo{mix-blend-mode:normal}
.pv-carimbo.cai{animation:sim-carimbar .7s ease-out both}
@keyframes sim-carimbar{0%{transform:translateY(-140px) scale(1.7) rotate(-8deg);opacity:0}70%{transform:translateY(2px) scale(.96) rotate(-8deg);opacity:1}85%{transform:translateY(-2px) scale(1.02) rotate(-8deg)}100%{transform:rotate(-8deg);opacity:.85}}
.sim-scroll{max-width:100%;overflow-x:auto}
#tab-simulados table{width:100%;border-collapse:collapse;font-size:12px}
#tab-simulados th,#tab-simulados td{text-align:left;padding:7px;border-bottom:1px solid var(--border-soft)}
.sim-bar{display:inline-block;width:50px;height:6px;background:var(--border-soft);vertical-align:middle;border-radius:var(--radius-sm)}
.sim-bar i{display:block;height:100%;background:var(--azul);border-radius:var(--radius-sm)}
.sim-item{border:1px solid var(--border-soft);border-radius:var(--radius-sm);padding:12px;margin:10px 0;background:var(--surface);overflow-wrap:anywhere}
.sim-item p{font-size:12px;color:var(--muted)}
.sim-causas{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}
.sim-causas .on{border-color:var(--azul);color:var(--ink);background:color-mix(in srgb,var(--azul) 18%,var(--surface))}
@media(max-width:390px){#pvGrid{grid-template-columns:minmax(0,1fr)}#tab-simulados select{max-width:100%}.sim-item{min-width:0}.pv-carimbo{width:48px;height:48px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.pv-carimbo.cai{animation:sim-carimbar-reduce .7s ease-out both}@keyframes sim-carimbar-reduce{from{opacity:0}to{opacity:.85}}}
.sim-treino-opts{display:grid;gap:5px;margin-top:10px}.sim-treino-opts .pv-opt{width:100%;height:auto;min-height:36px;padding:7px;text-align:left;white-space:normal}
.sim-carimbos{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.sim-carimbos .pv-carimbo{position:relative;right:auto;top:auto;flex:none}
/* Correção dos simulados: leitura do resultado, distribuição e revisão */
#simCorrecao{display:grid;gap:16px;min-width:0}
#simCorrecao>.card{margin:0}
.sim-tone-verde{--sim-color:var(--verde)}.sim-tone-amarelo{--sim-color:var(--amarelo)}.sim-tone-vermelho{--sim-color:var(--vermelho)}
.sim-tone-azul{--sim-color:var(--azul)}.sim-tone-muted{--sim-color:var(--muted)}
.sim-summary{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,300px);align-items:center;gap:24px}
.sim-summary-main{display:flex;align-items:center;gap:20px;min-width:0}.sim-summary-main>div{min-width:0}.sim-summary-main h3{font-size:var(--text-2xl);margin:2px 0}.sim-summary-main p{margin:4px 0;overflow-wrap:anywhere}
.sim-ring{width:120px;height:120px;flex:none;overflow:visible}.sim-ring circle{fill:none;stroke-width:10}.sim-ring-bg{stroke:var(--border)}.sim-ring-fill{stroke:var(--sim-color);stroke-linecap:round;stroke-dasharray:301.6;stroke-dashoffset:calc(301.6 - 3.016 * var(--sim-progress));transform:rotate(-90deg);transform-origin:60px 60px;animation:sim-ring-enter .8s ease-out both}.sim-ring text{fill:var(--ink);font:700 24px var(--font-body);font-variant-numeric:tabular-nums}
.sim-summary-meta{display:flex;gap:8px 18px;flex-wrap:wrap;color:var(--muted);font-size:var(--text-sm)}.sim-summary-meta strong{color:var(--ink)}
.sim-summary-actions{display:grid;gap:8px;min-width:0}.sim-summary-actions select,.sim-filters select{width:100%;max-width:100%;min-width:0}.sim-summary-actions .btn{justify-self:start}
.sim-guide summary,.sim-extra summary{cursor:pointer;color:var(--ink);font-weight:700}.sim-guide ul{margin:12px 0 0;padding-left:22px}.sim-guide li+li{margin-top:5px}
.sim-dashboard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;min-width:0}.sim-dashboard>section{min-width:0}.sim-dashboard>.card{margin:0}
.sim-metric{margin:15px 0;min-width:0}.sim-metric-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;font-variant-numeric:tabular-nums}.sim-metric-head span,.sim-metric-head strong{color:var(--ink)}.sim-metric small{display:block;margin-top:5px;color:var(--muted)}
.sim-track{height:9px;background:var(--border);border-radius:var(--radius-sm);overflow:hidden;margin-top:7px}.sim-track i{display:block;width:var(--sim-fill);height:100%;background:var(--sim-color);border-radius:inherit;transform-origin:left;animation:sim-bar-enter .65s ease-out both}
.sim-plot{display:block;width:100%;height:auto;min-height:130px;overflow:visible}.sim-plot-base{stroke:var(--border)}.sim-plot-col rect{fill:var(--sim-color);transform-origin:center 130px;animation:sim-col-enter .6s ease-out both;animation-delay:var(--sim-delay)}.sim-plot text{fill:var(--ink);font-family:var(--font-body);font-size:12px;font-weight:700}.sim-plot .sim-plot-label{fill:var(--muted);font-size:10px}.sim-plot-times{display:flex;gap:6px 12px;flex-wrap:wrap;color:var(--muted);font-size:var(--text-xs)}.sim-plot-mobile{display:none}
.sim-cause-group{padding:8px 0;border-top:1px solid var(--border-soft)}.sim-cause-group h4{display:flex;justify-content:space-between;gap:10px;margin:4px 0}.sim-cause-group h4 small{color:var(--muted);font-weight:400}.sim-cause-group .sim-metric{margin:10px 0}
.sim-priorities{list-style:none;padding:0;margin:12px 0}.sim-priorities li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border-soft)}.sim-priorities li>div{flex:1;min-width:0;overflow-wrap:anywhere}.sim-priorities small{display:block;color:var(--muted);margin-top:3px}.sim-priority-num{color:var(--azul);font-weight:700;font-variant-numeric:tabular-nums}.sim-priorities .chip{flex:none}
.sim-extra{margin-top:12px;border-top:1px solid var(--border-soft);padding-top:12px}.sim-extra p,.sim-extra li{overflow-wrap:anywhere}
.sim-filters{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin:14px 0}.sim-filters label{display:grid;gap:4px;flex:1 1 170px;min-width:0}.sim-filters span{color:var(--muted);font-size:var(--text-sm)}
#simItens{display:grid;gap:12px}.sim-item{margin:0;min-width:0}.sim-item[hidden]{display:none}.sim-item-top{display:flex;justify-content:space-between;align-items:start;gap:10px;flex-wrap:wrap}.sim-item-kicker{color:var(--muted);font-size:var(--text-xs)}.sim-item h4{margin:3px 0 0}.sim-answer{color:var(--ink);font-variant-numeric:tabular-nums}.sim-item-facts{display:flex;flex-wrap:wrap;gap:5px 14px;margin:12px 0;color:var(--muted);font-size:var(--text-sm)}.sim-item-note{padding:8px 10px;border-left:3px solid var(--azul);background:var(--raised);color:var(--ink)!important}.sim-item .sim-det{margin:10px 0}.sim-cause-title{font-size:var(--text-sm);color:var(--muted);margin-top:10px}.sim-cause-title strong{color:var(--ink)}.sim-causas .chip{min-height:34px}
@keyframes sim-ring-enter{from{stroke-dashoffset:301.6}to{stroke-dashoffset:calc(301.6 - 3.016 * var(--sim-progress))}}
@keyframes sim-bar-enter{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes sim-col-enter{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@media(max-width:900px){.sim-dashboard{grid-template-columns:minmax(0,1fr)}}
@media(max-width:620px){.sim-summary{grid-template-columns:minmax(0,1fr)}.sim-summary-main{gap:12px}.sim-ring{width:94px;height:94px}.sim-plot,.sim-plot-times{display:none}.sim-plot-mobile{display:block}.sim-priorities li{flex-wrap:wrap}.sim-priorities .chip{margin-left:24px}}
@media(prefers-reduced-motion:reduce){.sim-ring-fill,.sim-track i,.sim-plot-col rect{animation:none!important}}
/* iPhone: alvos medidos com toque emulado em 360, 390, 430 px e paisagem. */
@media(max-width:1000px) and (pointer:coarse){
  :root:not(#v){--faint:color-mix(in srgb,var(--muted) 85%,var(--ink))}
  header.top .top-in{padding-top:calc(11px + env(safe-area-inset-top))}
  #botNav button{color:var(--muted);font-size:11px}
  .pv-row:not(.pv-q) .pv-opt{width:44px;height:44px;min-height:44px}
  .an-col{min-width:44px;min-height:44px}
  .tp-st{min-height:44px}
  main.wrap{padding-bottom:calc(104px + env(safe-area-inset-bottom))}
  #toast{bottom:calc(76px + env(safe-area-inset-bottom))}
  .crt-bar{bottom:calc(76px + env(safe-area-inset-bottom))}
  /* O campo em foco fica acima do teclado; a barra fixa deixa de cobri-lo. */
  body.mobile-editing #botNav{display:none}
  dialog.mobile-editing{
    top:calc(var(--mobile-vv-top,0px) + 8px);
    bottom:auto;
    max-height:calc(var(--mobile-vv-height,100dvh) - 16px);
  }
  #dlgSessao.mobile-editing{margin:0 auto}
  #dlgSessao:modal,#dlgGrupo:modal{inset:auto 0 0;margin:0 auto;max-height:100dvh}
  #dlgSessao:modal.mobile-editing{
    inset:calc(var(--mobile-vv-top,0px) + 8px) 0 auto;
    max-height:calc(var(--mobile-vv-height,100dvh) - 16px);
  }
  #dlgSessao .sheet-h,#dlgGrupo .sheet-h{position:sticky;top:0;z-index:2;background:var(--surface);padding:8px 0}
}
/* iPhone Plus/Max em paisagem passa de 900 CSS px: mantenha a navegação móvel. */
@media(min-width:901px) and (max-width:1000px) and (max-height:500px) and (pointer:coarse) and (orientation:landscape){
  :root:not(#v) header.top{position:sticky;top:0;left:auto;right:auto;bottom:auto;width:auto;height:auto;overflow:visible;border-right:0;border-bottom:1px solid var(--border-soft)}
  :root:not(#v) .top-in{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;height:auto;max-width:100%;padding:8px 16px;overflow:visible}
  :root:not(#v) .brand{flex-direction:row;align-items:baseline;padding:0}
  :root:not(#v) .nav{display:none}
  :root:not(#v) main.wrap{margin:0 auto;max-width:100%;padding-bottom:calc(104px + env(safe-area-inset-bottom))}
  #botNav{display:grid;grid-template-columns:repeat(6,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom)}
  #botNav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:58px;padding:8px 2px 9px;font-size:11px;line-height:1.2}
  #botNav button .bi{font-size:19px;line-height:1;display:inline-flex}
  :root:not(#v) #tab-config .nav-pick{display:none}
}

/* ---- Folha de prova de redação (#dlgFolha) ---- */
.fh-t{margin:0 0 18px}
.fh-t h4{font-family:var(--serif);font-size:16px;margin:0 0 6px}
.fh-t p{font-family:var(--serif);font-size:15.5px;line-height:1.65;margin:0 0 8px;max-width:68ch}
.fh-t .fh-fonte{font-size:12px;color:var(--faint)}
.fh-t .fh-instrucao{font-size:15px;margin-bottom:6px}
.fh-facsimile{display:block;width:100%;max-width:680px;height:auto;margin:10px 0;border:1px solid var(--border-soft);border-radius:6px}
.fh-cmd{background:var(--raised);border-left:4px solid var(--sunset);border-radius:6px;padding:12px 14px;margin:0 0 16px;font-family:var(--serif);font-size:15.5px;line-height:1.6}
.fh-cmd .tema{font-weight:600;font-size:17px;margin:6px 0}
.fh-pad{display:grid;grid-template-columns:34px 1fr;border:1px solid var(--border);border-radius:6px;overflow:hidden;background:var(--raised)}
.fh-nums{font-variant-numeric:tabular-nums;text-align:right;color:var(--faint);font-size:12px;border-right:1px solid var(--border-soft);user-select:none}
.fh-nums div{height:32px;line-height:32px;padding-right:6px}
.fh-nums div.over{color:var(--sunset);font-weight:700}
.dlg-b #fhTexto{display:block;width:100%;min-width:0;resize:none;border:0;border-radius:0;margin:0;outline:0;background:transparent;color:var(--ink);
  font-family:var(--serif);font-size:16.5px;line-height:32px;padding:0 10px;overflow:hidden;
  background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 31px,var(--border-soft) 31px,var(--border-soft) 32px)}
#fhTexto:focus-visible{box-shadow:inset 0 0 0 2px var(--sunset)}
.fh-stats{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.fh-stats b{color:var(--ink)}
.fh-clock{font-variant-numeric:tabular-nums;font-size:20px;font-weight:700;min-width:5ch}
.fh-clock.low{color:var(--sunset)}
#dlgFolha .dlg-f{flex-wrap:wrap;align-items:center}
@media (prefers-reduced-motion:reduce){#dlgFolha *{scroll-behavior:auto!important}}

.foco-card.feito .fc-t s{text-decoration:line-through;text-decoration-thickness:1px}
.foco-concluidos{margin:10px 0}
.foco-concluidos>summary{cursor:pointer;padding:10px 4px;min-height:44px;color:var(--verde);font-weight:600}