/* ============================================================
   Caderno de disciplinas — CSS único do site
   Fonte da verdade: alc/a1-introducao.html (estilo do resumo)
   + telas de semestre/disciplinas e blocos de código.
   Uma regra existe em um lugar só. Nada de cor ou fonte nova
   além dos fundos por disciplina.
   ============================================================ */

:root{
  --paper:#FAF3E3;
  --grid:#EEE5D0;
  --ink:#17293F;
  --ink-soft:#5D6C83;
  --rule:#E5DBC4;
  --acento:#2A5F9E;
  --acento-2:#186A7D;
  --card:#FFFDF5;
  --shadow:0 1px 2px rgba(27,46,74,.04), 0 8px 24px -16px rgba(27,46,74,.18);
  --display:"Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --body:"Source Serif 4", Georgia, serif;
  --mono:"JetBrains Mono", ui-monospace, "SF Mono", monospace;
  --note-bg:#F7F1DF;
  --note-br:#E8DCC0;
  --code-bg:#F3EBD9;
}

html[data-theme="dark"]{
  --paper:#0F1720;
  --grid:#1A2430;
  --ink:#F1EADA;
  --ink-soft:#98A3B4;
  --rule:#26313F;
  --acento:#86B4E6;
  --acento-2:#6FC7D8;
  --card:#141E29;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 12px 28px -18px rgba(0,0,0,.8);
  --note-bg:#152231;
  --note-br:#2C3E52;
  --code-bg:#1A2530;
}

/* ---------- fundo por disciplina ----------
   O valor de data-materia é o nome da pasta da disciplina.
   Só o papel e o que deriva dele (grade, cartão, linhas) mudam.
   Os dois acentos são iguais em todas as matérias.                 */

html[data-materia="alc"]{ --paper:#FCF3E2; --grid:#F0E2CB; --rule:#E8D9BE; --code-bg:#F5E9D3 }
html[data-materia="ibd"]{ --paper:#F6F4E4; --grid:#E6E7D2; --rule:#DEDFC9; --code-bg:#EDEEDC }
html[data-materia="calculo2"]{ --paper:#FBF4DE; --grid:#EBE3C6; --rule:#E3DABA; --code-bg:#F2EACF }
html[data-materia="ed"]{ --paper:#F8F3E6; --grid:#E9E2D0; --rule:#E1DAC7; --code-bg:#F0E9D9 }
html[data-materia="probabilidade"]{ --paper:#F5F5E2; --grid:#E4E8D0; --rule:#DCE0C7; --code-bg:#EBEEDA }

html[data-theme="dark"][data-materia="alc"]{ --paper:#101A26; --grid:#1B2634; --rule:#273341; --card:#152030; --code-bg:#1A2734 }
html[data-theme="dark"][data-materia="ibd"]{ --paper:#0D1620; --grid:#18222E; --rule:#232F3C; --card:#121C29; --code-bg:#17222F }
html[data-theme="dark"][data-materia="calculo2"]{ --paper:#121C29; --grid:#1D2836; --rule:#293544; --card:#172232; --code-bg:#1C2936 }
html[data-theme="dark"][data-materia="ed"]{ --paper:#0E1822; --grid:#192431; --rule:#25313E; --card:#131E2B; --code-bg:#182431 }
html[data-theme="dark"][data-materia="probabilidade"]{ --paper:#111B27; --grid:#1C2734; --rule:#283442; --card:#162131; --code-bg:#1B2835 }

/* amostra da cor da disciplina, usada em traços mínimos na capa */
[data-c="alc"]{ --chip:#FCF3E2 }
[data-c="ibd"]{ --chip:#F6F4E4 }
[data-c="calculo2"]{ --chip:#FBF4DE }
[data-c="ed"]{ --chip:#F8F3E6 }
[data-c="probabilidade"]{ --chip:#F5F5E2 }
html[data-theme="dark"] [data-c="alc"]{ --chip:#101A26 }
html[data-theme="dark"] [data-c="ibd"]{ --chip:#0D1620 }
html[data-theme="dark"] [data-c="calculo2"]{ --chip:#121C29 }
html[data-theme="dark"] [data-c="ed"]{ --chip:#0E1822 }
html[data-theme="dark"] [data-c="probabilidade"]{ --chip:#111B27 }

*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:80px; -webkit-text-size-adjust:100%}
body{
  margin:0;
  background-color:var(--paper);
  background-image:
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size:28px 28px;
  color:var(--ink);
  font-family:var(--body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overscroll-behavior-y:none;
}

/* ---------- progresso ---------- */
#progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--acento);z-index:60}

/* ---------- layout ---------- */
.shell{max-width:1220px;margin:0 auto;padding:0 24px 96px;display:grid;grid-template-columns:230px minmax(0,1fr);gap:56px}
@media (max-width:900px){.shell{grid-template-columns:1fr;gap:0}}
.shell.solo{grid-template-columns:minmax(0,1fr)}

/* ---------- capa ---------- */
.hero{grid-column:1/-1;padding:88px 0 56px;border-bottom:1px solid var(--rule);margin-bottom:56px;position:relative}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--acento)}
.hero h1{font-family:var(--display);font-weight:700;font-size:clamp(38px,7vw,76px);line-height:.98;letter-spacing:-.03em;margin:14px 0 0}
.hero h1 span{display:block;color:var(--ink-soft);font-weight:400}
.hero p{max-width:52ch;color:var(--ink-soft);margin:22px 0 0}
.meta{margin-top:28px;display:flex;flex-wrap:wrap;gap:10px;font-family:var(--mono);font-size:12px}
.meta i{font-style:normal;border:1px solid var(--rule);background:var(--card);padding:5px 10px;border-radius:2px}

/* vetor decorativo da capa */
.hero .plot{position:absolute;right:0;top:74px;opacity:.9;display:none}
@media (min-width:1000px){.hero .plot{display:block}}

/* ---------- índice lateral ---------- */
nav{position:sticky;top:24px;align-self:start;padding-top:6px}
@media (max-width:900px){nav{position:static;margin-bottom:48px;border-bottom:1px solid var(--rule);padding-bottom:24px}}
nav ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--rule);counter-reset:t}
nav a{
  display:block;padding:6px 0 6px 16px;margin-left:-1px;border-left:2px solid transparent;
  font-family:var(--display);font-size:14px;line-height:1.35;color:var(--ink-soft);text-decoration:none;
  transition:color .15s, border-color .15s;
}
nav a:hover{color:var(--ink)}
nav a.on{color:var(--acento);border-left-color:var(--acento)}
nav .aula{margin-top:18px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--ink);text-transform:uppercase}
nav .aula:first-child{margin-top:0}

/* ---------- seções ---------- */
section{margin-bottom:72px;scroll-margin-top:80px}
.tag{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
h2.title{font-family:var(--display);font-weight:700;font-size:clamp(26px,3.6vw,36px);letter-spacing:-.02em;margin:6px 0 20px;line-height:1.1}
h3{font-family:var(--display);font-weight:500;font-size:19px;letter-spacing:-.01em;margin:34px 0 10px}
p{margin:0 0 14px}
ul{margin:0 0 14px;padding-left:20px}
li{margin-bottom:7px}
strong{font-weight:600}
code{font-family:var(--mono);font-size:.88em;background:var(--code-bg);padding:1px 5px;border-radius:3px}
a{color:var(--acento)}
a:hover{color:var(--ink)}

/* ---------- alternar tema ---------- */
#theme{
  position:fixed;top:18px;right:18px;z-index:70;
  display:flex;align-items:center;gap:8px;
  font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-soft);background:var(--card);border:1px solid var(--rule);
  padding:8px 12px;border-radius:999px;cursor:pointer;box-shadow:var(--shadow);
  transition:color .15s, border-color .15s;
}
#theme:hover{color:var(--ink);border-color:var(--ink-soft)}
#theme svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round}
#theme .lua{display:none}
html[data-theme="dark"] #theme .sol{display:none}
html[data-theme="dark"] #theme .lua{display:block}
@media (max-width:900px){#theme span{display:none}#theme{padding:9px;top:12px;right:12px}}

/* bloco-definição: assinatura visual = colchete de matriz */
.def{
  position:relative;background:var(--card);border:1px solid var(--rule);border-radius:3px;
  padding:20px 24px 20px 28px;margin:18px 0;box-shadow:var(--shadow);
}
.def::before{
  content:"";position:absolute;left:9px;top:16px;bottom:16px;width:8px;
  border-left:2px solid var(--acento);border-top:2px solid var(--acento);border-bottom:2px solid var(--acento);
}
.def .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--acento);display:block;margin-bottom:8px}
.def p:last-child,.def ul:last-child{margin-bottom:0}

.ex{border-left:2px solid var(--acento-2);padding:2px 0 2px 20px;margin:18px 0;color:var(--ink)}
.ex .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--acento-2);display:block;margin-bottom:6px}
.ex p:last-child{margin-bottom:0}

.note{font-family:var(--display);font-size:15px;background:var(--note-bg);border:1px solid var(--note-br);border-radius:3px;padding:14px 18px;margin:18px 0}
.note b{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--acento);display:block;margin-bottom:4px;font-weight:500}

.katex-display{margin:18px 0;overflow-x:auto;overflow-y:hidden;padding:2px 0}

table{width:100%;border-collapse:collapse;margin:18px 0;font-family:var(--display);font-size:15px;background:var(--card)}
th,td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);font-weight:500}

.two{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media (max-width:720px){.two{grid-template-columns:1fr}}

footer{grid-column:1/-1;border-top:1px solid var(--rule);padding-top:24px;font-family:var(--mono);font-size:12px;color:var(--ink-soft);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}

a:focus-visible, nav a:focus-visible{outline:2px solid var(--acento);outline-offset:3px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media print{nav,#progress{display:none}.shell{grid-template-columns:1fr}body{background-image:none}}

/* ============================================================
   CAPA — composição centrada, usada por duas telas:
   a de semestres (index.html) e a de disciplinas do semestre.
   Só as linhas da lista mudam entre elas.
   ============================================================ */

.capa{min-height:100svh;max-width:880px;margin:0 auto;padding:clamp(40px,7vh,72px) 24px 24px;
  display:grid;grid-template-rows:1fr auto;gap:clamp(24px,4vh,40px)}
.capa-nucleo{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:clamp(26px,4.5vh,46px);width:100%;text-align:center}
@media (max-width:620px){.capa{padding:80px 20px 24px;gap:40px}.capa-nucleo{gap:40px}}

.capa-id h1{font-family:var(--display);font-weight:700;font-size:clamp(38px,5.6vw,66px);
  line-height:.94;letter-spacing:-.04em;margin:14px 0 0}
.capa-id h1 em{display:block;font-style:normal;font-weight:400;color:var(--ink-soft)}
.capa-id p{max-width:56ch;margin:18px auto 0;color:var(--ink-soft);font-size:17px;text-wrap:pretty}

/* colchete de matriz em escala de página — o motivo do sistema.
   Compartilhado pela lista de semestres e pela de disciplinas.  */
.mat{list-style:none;position:relative;width:100%;margin:0 auto;padding:8px 0 8px 26px;text-align:left}
.mat::before,.mat::after{content:"";position:absolute;top:0;bottom:0;width:14px;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.mat::before{left:0;border-left:1px solid var(--ink)}
.mat::after{right:0;border-right:1px solid var(--ink)}
.mat > li{margin:0;border-top:1px solid var(--rule)}
.mat > li:first-child{border-top:0}
.mat > li > *{display:grid;align-items:baseline;text-decoration:none;color:inherit;
  transition:background-color .18s, color .18s}
@media (max-width:620px){.mat{padding-left:20px}}

/* --- linhas da lista de semestres --- */
.sems{max-width:620px}
.sems li > *{grid-template-columns:minmax(0,1fr) auto;column-gap:20px;row-gap:6px;
  padding:24px 24px 24px 10px}
.sems .per{font-family:var(--display);font-weight:700;font-size:clamp(30px,4.4vw,44px);
  letter-spacing:-.035em;line-height:1}
.sems .per i{font-style:normal;font-family:var(--mono);font-weight:400;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);
  margin-left:14px;vertical-align:middle;white-space:nowrap}
.sems .det{grid-column:1;font-family:var(--mono);font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-soft)}
.sems .ir{grid-column:2;grid-row:1/3;align-self:center;font-family:var(--mono);font-size:11px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--acento-2)}
.sems a:hover{background-color:var(--card)}
.sems .per b{font-weight:inherit;
  background-image:linear-gradient(var(--acento),var(--acento));background-repeat:no-repeat;
  background-position:0 100%;background-size:0 2px;
  transition:background-size .32s cubic-bezier(.4,0,.2,1), color .2s}
.sems a:hover .per,.sems a:focus-visible .per{color:var(--acento)}
.sems a:hover .per b,.sems a:focus-visible .per b{background-size:100% 2px}

/* --- linhas da lista de disciplinas --- */
.vetor{max-width:680px}
.vetor li > *{grid-template-columns:16px 78px minmax(0,1fr) auto;column-gap:16px;
  padding:13px 24px 13px 8px}
.vetor a:hover{background-color:var(--card)}
.vetor .chip{width:10px;height:10px;border-radius:2px;background:var(--chip);
  border:1px solid var(--rule);align-self:center}
.vetor .cod{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--ink-soft)}
.vetor .nome{font-family:var(--display);font-weight:500;font-size:clamp(17px,1.75vw,21px);
  letter-spacing:-.02em;line-height:1.15;text-wrap:balance;
  justify-self:start;max-width:100%;
  background-image:linear-gradient(var(--acento),var(--acento));background-repeat:no-repeat;
  background-position:0 100%;background-size:0 1.5px;
  transition:background-size .32s cubic-bezier(.4,0,.2,1), color .2s}
.vetor a:hover .nome,.vetor a:focus-visible .nome{color:var(--acento);background-size:100% 1.5px}
.vetor a:hover .chip{border-color:var(--acento)}
.vetor .qtd{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--acento-2);white-space:nowrap}
.vetor li.vazia > *{color:var(--ink-soft)}
.vetor li.vazia > div{cursor:default}
.vetor li.vazia .nome{font-weight:400}
@media (max-width:620px){
  .vetor li > *{grid-template-columns:12px minmax(0,1fr);row-gap:4px;padding-right:18px}
  .vetor .cod,.vetor .nome,.vetor .qtd{grid-column:2}
}

.capa-pe{width:100%;padding-top:20px;border-top:1px solid var(--rule);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-soft)}

/* ---------- barra de retorno nas páginas internas ---------- */
.volta{max-width:1220px;margin:0 auto;padding:22px 24px 0;font-family:var(--mono);font-size:11px;
  letter-spacing:.14em;text-transform:uppercase}
.volta a{color:var(--ink-soft);text-decoration:none;display:inline-block;padding:6px 2px}
.volta a:hover{color:var(--acento)}

/* ---------- índice de aulas (página de disciplina) ---------- */
.aulas{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.aulas li{margin:0;border-bottom:1px solid var(--rule)}
.aulas li > *{display:grid;grid-template-columns:64px minmax(0,1fr) 118px;align-items:baseline;
  column-gap:20px;padding:15px 10px;text-decoration:none;color:inherit;transition:background-color .15s}
.aulas a:hover{background:var(--card)}
.aulas .num{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--acento)}
.aulas .t{font-family:var(--display);font-size:17px;letter-spacing:-.01em;line-height:1.3}
.aulas .d{font-family:var(--mono);font-size:12px;color:var(--ink-soft);text-align:right}
.aulas li.vazia > *{color:var(--ink-soft)}
.aulas li.vazia .num{color:var(--ink-soft)}
@media (max-width:620px){
  .aulas li > *{grid-template-columns:52px minmax(0,1fr);row-gap:3px}
  .aulas .d{grid-column:2;text-align:left}
}

/* ============================================================
   COMPONENTES NOVOS — SQL, esquema, pseudocódigo, árvore
   Mesma caixa-base do sistema (card + rule + shadow),
   rótulo em mono como em .def / .ex.
   ============================================================ */

.blk{background:var(--card);border:1px solid var(--rule);border-radius:3px;margin:18px 0;
  box-shadow:var(--shadow);overflow:hidden}
.blk > .hd{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-soft);background:var(--code-bg);border-bottom:1px solid var(--rule);padding:9px 16px}
.blk > .hd b{font-weight:500;color:var(--acento)}
.blk pre{margin:0;padding:16px;overflow-x:auto;font-family:var(--mono);font-size:13.5px;line-height:1.75;
  color:var(--ink);tab-size:2}
.blk pre code{background:none;padding:0;font-size:inherit}

/* léxico compartilhado pelos blocos de código: só carmim, teal e tinta */
.k{color:var(--acento)}
.st{color:var(--acento-2)}
.cm{color:var(--ink-soft)}
.nm{color:var(--ink-soft)}

/* --- esquema de tabela --- */
.esq{max-width:420px}
.esq .hd{font-size:12px;letter-spacing:.1em}
.esq .hd em{font-style:normal;color:var(--ink-soft);letter-spacing:.14em;font-size:11px}
.esq .col{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;column-gap:12px;
  padding:9px 16px;border-top:1px solid var(--rule);font-family:var(--mono);font-size:13px}
.esq .col:first-of-type{border-top:0}
.esq .col .cn{color:var(--ink)}
.esq .col .ct{color:var(--ink-soft);font-size:12px}
.esq .col .kk{font-size:10px;letter-spacing:.12em;text-transform:uppercase;border:1px solid currentColor;
  border-radius:2px;padding:1px 5px;line-height:1.5}
.esq .col .kk.pk{color:var(--acento)}
.esq .col .kk.fk{color:var(--acento-2)}
.esq .fk-nota{font-family:var(--mono);font-size:11px;color:var(--ink-soft);padding:9px 16px;
  border-top:1px solid var(--rule);background:var(--code-bg)}
.esq-par{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;align-items:start;margin:18px 0}
.esq-par .esq{max-width:none;margin:0}

/* --- pseudocódigo com numeração de linha --- */
.pseudo ol{list-style:none;counter-reset:ln;margin:0;padding:14px 0;
  font-family:var(--mono);font-size:13.5px;line-height:1.8}
.pseudo li{counter-increment:ln;margin:0;position:relative;padding:0 16px 0 60px}
.pseudo li::before{content:counter(ln,decimal-leading-zero);position:absolute;left:0;top:0;
  width:36px;text-align:right;color:var(--ink-soft);font-size:11.5px;line-height:inherit;
  border-right:1px solid var(--rule);padding-right:8px;height:100%}
.pseudo li > code{display:block;white-space:pre;background:none;padding:0;font-size:inherit}
.pseudo li.cur{background:var(--code-bg)}

/* --- árvore / estrutura de dados --- */
.arv ul{list-style:none;margin:0;padding:0 0 0 26px;position:relative}
.arv > ul{padding:16px 18px}
.arv li{margin:0;padding:2px 0;position:relative;font-family:var(--mono);font-size:13px;line-height:1.9}
.arv ul ul > li::before{content:"";position:absolute;left:-17px;top:.95em;width:16px;
  border-top:1px solid var(--rule)}
.arv ul ul > li::after{content:"";position:absolute;left:-17px;top:0;height:.95em;
  border-left:1px solid var(--rule)}
.arv ul ul > li:not(:last-child)::after{height:100%}
.arv .no{display:inline-block;border:1px solid var(--rule);border-radius:2px;background:var(--code-bg);
  padding:1px 8px;color:var(--ink)}
.arv .no.raiz{border-color:var(--acento);color:var(--acento)}
.arv .no.folha{color:var(--ink-soft)}
.arv .ar{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-soft);margin-left:10px}

/* ============================================================
   APP — toque, transição entre telas e área segura.
   O site é multipágina; a transição é a nativa do navegador
   (View Transitions), sem framework e sem JS de roteamento.
   ============================================================ */

@view-transition{ navigation:auto }
::view-transition-old(root),::view-transition-new(root){ animation-duration:.26s }
/* o número do semestre é o mesmo objeto nas duas telas: ele se transforma */
.sems .per b,.capa-id h1 b{ view-transition-name:semestre }


/* toque: sem flash azul do sistema, sem atraso de 300ms */
a,button,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}

/* resposta ao clique — o alvo cede um pouco e volta */
.mat > li > a,.aulas a{transition:background-color .18s, color .18s, transform .12s ease}
.mat > li > a:active,.aulas a:active{transform:scale(.988)}
#theme:active{transform:scale(.94)}

/* tabela larga rola sozinha em vez de espremer a página */
.rolagem{overflow-x:auto;overscroll-behavior-x:contain;margin:18px 0}
.rolagem table{margin:0;min-width:440px}

/* ---------- área segura de aparelho com entalhe ---------- */
@supports (padding:env(safe-area-inset-left)){
  .capa,.shell,.volta{
    padding-left:max(24px,env(safe-area-inset-left));
    padding-right:max(24px,env(safe-area-inset-right));
  }
  .capa{padding-bottom:max(24px,env(safe-area-inset-bottom))}
  .shell{padding-bottom:max(96px,env(safe-area-inset-bottom))}
}

/* ---------- índice recolhível (só no celular) ---------- */
nav summary{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-soft);margin:0 0 14px;font-weight:500;cursor:pointer;list-style:none;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:44px;border-bottom:1px solid var(--rule)}
nav summary::-webkit-details-marker{display:none}
nav summary::after{content:"+";font-size:15px;line-height:1;transition:transform .2s}
nav details[open] > summary::after{transform:rotate(45deg)}
@media (min-width:901px){
  nav summary{display:none}
}

/* ---------- celular ---------- */
@media (max-width:620px){
  body{font-size:16px}
  .shell{padding-left:18px;padding-right:18px}
  .volta{padding-left:18px;padding-right:18px}
  .capa{padding-left:20px;padding-right:20px}
  .hero{padding:64px 0 36px;margin-bottom:36px}
  .meta{gap:8px}
  section{margin-bottom:52px}
  .def{padding:16px 18px 16px 24px}
  .ex{padding-left:16px}
  .blk pre,.pseudo ol{font-size:12.5px}
  .pseudo li{padding-left:52px}
  .aulas li > *{padding:16px 6px}
  .sems li > *{padding:22px 18px 22px 8px}
  .sems .per i{display:block;margin:8px 0 0}
}