* { box-sizing: border-box; }
:root { color-scheme: light; color: #062d53; background: #fcf8ec; font: 1rem/1.55 system-ui, sans-serif; }
body { margin: 0; }
a { color: #064f87; text-underline-offset: .2em; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid #1963a7; outline-offset: 3px; }
header { background: #062d53; color: white; }
header a { color: white; }
.wrap { width: min(66rem, 100% - 2rem); margin: auto; }
.top { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; padding-block: .9rem; }
.stripe { height: .4rem; background: linear-gradient(to right,#1963a7 16.67%,#c82331 16.67% 33.33%,#477d43 33.33% 50%,#bfc8d0 50% 66.67%,#7d2948 66.67% 83.33%,#f6c52f 83.33%); }
main { padding-block: 2rem 4rem; }
.hero { display: grid; grid-template-columns: 3fr 2fr; align-items: center; gap: 2rem; margin-bottom: 2rem; }
.marks { display: flex; align-items: center; gap: .8rem; }
.marks img, .scarf { border-radius: .75rem; }
.scarf { width: 100%; height: auto; }
.eyebrow { font-weight: 700; }
h1 { font-size: clamp(2.8rem,8vw,5rem); line-height: 1; margin: .25rem 0; letter-spacing: -.06em; }
.panel { background: white; border: 1px solid #d8dfe3; border-radius: .7rem; padding: 1rem 1.25rem; margin-block: 1rem; }
.entry { border-top: 1px solid #d8dfe3; margin-top: 1rem; padding-top: .45rem; overflow-wrap: anywhere; }
summary { cursor: pointer; font-weight: 750; }
form { display: grid; gap: .65rem; max-width: 38rem; margin-block: .8rem; }
label { display: grid; gap: .2rem; font-weight: 650; }
input, select, textarea, button { max-width: 100%; font: inherit; padding: .55rem; border-radius: .35rem; border: 1px solid #697c8e; }
button { justify-self: start; background: #062d53; color: white; cursor: pointer; }
progress { width: 100%; height: 1.2rem; accent-color: #1963a7; }
.roster li { padding-block: .4rem; }
.roster span { margin-inline-start: .5rem; }
.alert { padding: .75rem; color: #851e30; background: #fff1f0; border-radius: .4rem; }
code { overflow-wrap: anywhere; }
@media (max-width: 42rem) { .hero { grid-template-columns: 1fr; } .scarf { max-width: 24rem; } }
@media print { header,.stripe,.hero,#biblioteca,form,.screen-only,main>section:not(#expediente),main>div { display:none; } #expediente { border:0; } }
.mode-switch { display: flex; flex-wrap: wrap; gap: .7rem; margin-block: 1rem; }
.mode-switch a { padding: .6rem .9rem; border: 1px solid #062d53; border-radius: .35rem; font-weight: 700; }
.mode-switch .mode-club { background: #062d53; color: white; }
.mode-switch .mode-personal, .evidence-link { background: #ffe183; color: #392700; border-color: #986b07; }
.mode-switch a[aria-current="page"] { outline: 2px solid currentColor; outline-offset: -5px; }
.evidence-link { display: inline-block; padding: .35rem .65rem; border: 1px solid #986b07; border-radius: .35rem; font-weight: 700; }
.attest { display: flex; align-items: baseline; gap: .5rem; }