/* Cross-page UI/UX normalization. Loaded last by base.html. */
:root {
  --brand-navy: #0b2c4d;
  --brand-red: #c9212b;
  --ui-bg: #f4f7fb;
  --ui-surface: #fff;
  --ui-text: #172033;
  --ui-muted: #5f6f85;
  --ui-border: #d9e1eb;
  --ui-focus: #2563eb;
  --ui-shadow: 0 10px 30px rgba(15, 23, 42, .09);
  color-scheme: light;
}

html {
  box-sizing: border-box;
  scroll-behavior: smooth;
  scroll-padding-top: 5rem;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
*, *::before, *::after { box-sizing: inherit; }
body {
  margin: 0;
  min-width: 20rem;
  min-height: 100vh;
  min-height: 100dvh;
  color: var(--ui-text);
  background-color: var(--ui-bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
:where(img, svg, video, canvas) { display: block; max-width: 100%; }
img:not([class]) { height: auto; }
button, input, select, textarea { font: inherit; }
button, [role="button"], a { -webkit-tap-highlight-color: transparent; }
button, select, input[type="checkbox"], input[type="radio"] { cursor: pointer; }
button:disabled, input:disabled, select:disabled, [aria-disabled="true"] { cursor: not-allowed; opacity: .58; }
a { text-underline-offset: .18em; }
a:not([class]) { color: inherit; }
p, h1, h2, h3, h4 { overflow-wrap: anywhere; }
h1, h2, h3, h4 { text-wrap: balance; }
:where(h1, h2, h3, h4):not([class]) { line-height: 1.18; }
p { text-wrap: pretty; }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--ui-focus) 70%, white);
  outline-offset: 3px;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--ui-focus) 18%, transparent);
}
.skip-link {
  position: fixed; z-index: 2147483647; top: .75rem; left: .75rem;
  translate: 0 -180%; padding: .75rem 1rem; border-radius: .75rem;
  color: #fff; background: #061d34; font-weight: 800; box-shadow: var(--ui-shadow);
}
.skip-link:focus { translate: 0; }

:where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea) {
  width: 100%; min-height: 2.75rem; max-width: 100%;
  border: 1px solid var(--ui-border); border-radius: .75rem; padding: .65rem .8rem;
  color: var(--ui-text); background: #fff;
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}
textarea { min-height: 7rem; resize: vertical; }
:where(input, select, textarea)::placeholder { color: #8290a4; opacity: 1; }
:where(input, select, textarea):hover:not(:disabled) { border-color: #aebaca; }
:where(input, select, textarea):focus { border-color: var(--ui-focus); }
:where(input, select, textarea)[aria-invalid="true"] { border-color: #dc2626; background: #fffafa; }
input[type="checkbox"], input[type="radio"] { width: 1.125rem; height: 1.125rem; accent-color: var(--brand-navy); }
label:not([class]) { color: #334155; }

:where(button, .ui-btn, a[class*="btn"], a[class*="action"]) {
  min-height: 2.5rem; touch-action: manipulation;
}
:where(button, .ui-btn, a[class*="btn"]):not(:disabled) {
  transition: transform 150ms ease, box-shadow 150ms ease, background-color 150ms ease, border-color 150ms ease, opacity 150ms ease;
}
@media (hover: hover) {
  :where(button, .ui-btn, a[class*="btn"]):not(:disabled):hover { transform: translateY(-1px); }
}
:where(button, .ui-btn, a[class*="btn"]):not(:disabled):active { transform: translateY(0); }

:where(.ui-card, .soft-card, .flash-card) { border-color: var(--ui-border); }
.ui-card, .soft-card { overflow: clip; }
.ui-page-header { gap: 1rem; }
.ui-page-title { letter-spacing: -.025em; }
.ui-page-description { max-width: 70ch; color: var(--ui-muted); }

:where(.table-wrap, .overflow-x-auto, [class*="overflow-x-auto"]) {
  max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain;
  scrollbar-gutter: stable; -webkit-overflow-scrolling: touch;
}
table { border-collapse: collapse; width: 100%; }
th:not([class]) { color: #334155; font-weight: 750; text-align: left; }
th, td { vertical-align: middle; }
tbody tr { border-color: var(--ui-border); }
tbody tr:hover { background-color: rgba(241, 245, 249, .72); }

html:has(.modal:not(.hidden)) { overflow: hidden; }
.modal:not(.hidden) { isolation: isolate; }
.modal > :not([data-close-modal]) { overscroll-behavior: contain; scrollbar-gutter: stable; }
.modal [data-close-modal]:where(button) { min-width: 2.75rem; min-height: 2.75rem; border-radius: .75rem; }

.sidebar, .mobile-drawer, main, #main-content { min-width: 0; }
.navlink { min-height: 2.75rem; }
.sb-icon { flex: 0 0 auto; }

/* Texto deve permanecer nítido. A animação legada promovia todo o conteúdo
   para uma camada transformada da GPU e causava desfoque intermitente. */
main#main-content,
body.is-navigating main#main-content {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
  translate: none !important;
  filter: none !important;
  will-change: auto !important;
}

#bt-toast-region { max-width: min(26rem, calc(100vw - 2rem)); }
.site-footer a {
  display: inline-flex;
  align-items: center;
  min-height: 2.5rem;
  padding-block: .35rem;
}
figure { margin-inline: 0; }
img[loading="lazy"] { background-color: #e9eef5; }
.prose img, article img { border-radius: .75rem; }
.prose iframe, article iframe { width: 100%; max-width: 100%; aspect-ratio: 16 / 9; height: auto; }

/* Student navigation: keep exactly one navigation system visible per viewport.
   These semantic rules deliberately do not depend on the generated utility bundle. */
.student-mobile-nav,
.student-mobile-nav-spacer { display: none; }

/* Grid children containing truncated names must be allowed to shrink. */
.student-ranking-layout,
.student-ranking-card,
.student-ranking-row,
.student-ranking-row__identity,
.student-score-row,
.student-score-row__label { min-width: 0; }
.student-ranking-card { max-width: 100%; overflow: hidden; }
.student-ranking-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100%;
  max-width: 100%;
}
.student-ranking-row__points,
.student-score-row__value { flex: 0 0 auto; white-space: nowrap; }
.student-score-row__label { overflow-wrap: anywhere; }

@media (max-width: 767px) {
  .student-portal-tabs { display: none !important; }
  .student-mobile-nav {
    display: block !important;
    position: fixed !important;
    inset-inline: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
  }
  .student-mobile-nav__grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: stretch;
  }
  .student-mobile-nav__grid > a {
    min-width: 0;
    overflow: hidden;
  }
  .student-mobile-nav__grid > a > span:last-child {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .student-mobile-nav-spacer {
    display: block !important;
    height: calc(5rem + env(safe-area-inset-bottom));
  }
}

@media (max-width: 767px) {
  html { scroll-padding-top: 4.25rem; }
  body { min-width: 0; }
  main, #main-content { width: 100%; }
  .ui-page-header { align-items: stretch; }
  .ui-page-header__actions, .ui-toolbar__actions { width: 100%; }
  .ui-page-header__actions > *, .ui-toolbar__actions > * { flex: 1 1 auto; }
  :where(button, .ui-btn, a[class*="btn"], a[class*="action"]) { min-height: 2.75rem; }
  .modal > :not([data-close-modal]) { border-radius: 1rem !important; }
  table { font-size: .875rem; }
  th, td { padding-inline: .75rem; }
}
@media (max-width: 479px) {
  .ui-page-title { font-size: clamp(1.6rem, 8vw, 2.1rem); }
  .ui-card__header, .ui-card__body, .ui-card__footer { padding-inline: 1rem; }
  .flash-card { align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    scroll-behavior: auto !important; transition-duration: .01ms !important;
  }
}
@media (prefers-contrast: more) {
  :root { --ui-border: #8793a4; --ui-muted: #3f4b5c; }
  :where(input, select, textarea, button, .ui-card, .soft-card) { border-width: 2px; }
}
@media print {
  .sidebar, .mobile-drawer, .topbar, .skip-link, #bt-toast-region, #betoni-loading-modal { display: none !important; }
  body { color: #000; background: #fff; }
  main, #main-content { width: 100% !important; margin: 0 !important; padding: 0 !important; }
  a { color: #000; text-decoration: none; }
  .ui-card, .soft-card { break-inside: avoid; box-shadow: none !important; }
}