:root {
    color-scheme: light;
    --paper: #eef3f7;
    --ink: #182838;
    --navy: #132437;
    --muted: #4d6174;
    --red: #aa233b;
    --red-dark: #84182d;
    --border: #d9e3eb;
    --white: #fff;
    --green: #146147;
    --green-bg: #e4f5eb;
    font: 500 16px/1.6 Inter, "Segoe UI", system-ui, sans-serif;
    color: var(--ink);
    background: var(--paper);
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 0; }
a { color: #244f76; }
a:hover { color: var(--red-dark); }
button, input, textarea, select { font: inherit; }
:focus-visible { outline: solid 3px #b44556; outline-offset: 3px; }
h1,h2,h3 { font-family: "Barlow", Bahnschrift, "Segoe UI", sans-serif; line-height: 1.14; letter-spacing: -.025em; margin: 0; overflow-wrap: anywhere; }
h1 { font-size: clamp(2.05rem, 4.5vw, 3.8rem); }
h2 { font-size: clamp(1.25rem, 2vw, 1.7rem); }
h3 { font-size: 1.23rem; }
p { margin: .65em 0 0; overflow-wrap: anywhere; }
small, .muted { color: var(--muted); }
.shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.topbar { background: var(--navy); color: var(--white); }
.nav { min-height: 72px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .65rem 1.25rem; padding-block: .7rem; }
.nav nav { display: flex; flex-wrap: wrap; gap: .15rem .45rem; }
.nav nav a { color: #deeaf3; text-decoration: none; padding: .45rem .65rem; border-radius: 6px; }
.nav nav a[aria-current] { background: #ffffff19; color: var(--white); font-weight: 740; }
.nav .quiet { background: transparent; color: #f4f8fb; border-color: #ffffff55; }
.brand { font-family: "Barlow", Bahnschrift, "Segoe UI", sans-serif; font-size: 1.55rem; font-weight: 800; display: inline-flex; gap: .6rem; align-items: center; text-decoration: none; color: inherit; white-space: nowrap; }
.brand:hover { color: white; }
.mark { display: grid; place-items: center; background: var(--red); border-radius: 8px; width: 1.9rem; height: 1.9rem; color: var(--white); font-size: 1.15rem; }
.main { padding-block: clamp(1.5rem, 4vw, 3.2rem); min-height: 64vh; }
.footer { border-top: 1px solid var(--border); padding-block: 1rem 1.6rem; font-size: .9rem; color: var(--muted); display: flex; flex-wrap: wrap; justify-content: space-between; gap: .2rem 1rem; }
.skip { position: absolute; z-index: 3; left: 1rem; top: -10rem; padding: .6rem 1rem; border-radius: 5px; background: white; }
.skip:focus { top: 1rem; }
.hero { min-height: 440px; background: linear-gradient(90deg, #102337 19%, #102337ec 38%, #1023373d 78%), #132437 url("campus-hero.webp") center right / cover; border-radius: 18px; padding: clamp(1.4rem, 6vw, 4.1rem); display: grid; align-content: center; gap: .85rem; color: var(--white); }
.hero h1 { font-size: clamp(2.25rem, 6.4vw, 5rem); }
.hero p { margin: 0; max-width: 32rem; }
.hero .eyebrow { color: #ffacb8; }
.hero-text { font-size: clamp(1rem, 2vw, 1.25rem); color: #e6eef6; }
.hero .actions { margin-top: .6rem; }
.hero-secondary { color: white; background: #12243795; border-color: #ffffff85; }
.hero-secondary:hover { color: white; }
.eyebrow { display: block; font-size: .78rem; color: #94243a; text-transform: uppercase; letter-spacing: .105em; font-weight: 790; margin: 0 0 .45rem; }
.page-head { margin: 0 0 1.55rem; }
.page-head > p:not(.eyebrow) { color: var(--muted); }
.page-head .actions { margin-top: .85rem; }
.back { display: inline-block; margin: 0 0 .8rem; }
.card { min-width: 0; background: var(--white); border: 1px solid var(--border); border-radius: 14px; padding: clamp(1rem, 2.25vw, 1.6rem); }
.cards { display: grid; gap: 1rem; }
.cards.two, .fields.two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.cards.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.welcome-features, .section-space { margin-top: 1rem; }
.flow { display: grid; gap: 1rem; }
.form-stack { display: grid; gap: .85rem; margin-top: 1rem; max-width: 42rem; }
.fields { display: grid; gap: .85rem; }
.form-stack > .button { justify-self: start; }
label { display: grid; color: var(--ink); font-weight: 680; gap: .3rem; min-width: 0; }
input,select,textarea { display: block; background: white; border: 1px solid #9cafc0; border-radius: 7px; padding: .56rem .62rem; min-height: 44px; width: 100%; color: var(--ink); }
textarea { resize: vertical; }
.actions { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; }
.actions form, .nav form { margin: 0; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; border: 1px solid transparent; text-decoration: none; border-radius: 8px; padding: .52rem .92rem; font-weight: 745; cursor: pointer; text-align: center; }
.button.primary { background: var(--red); color: white; }
.button.primary:hover { background: var(--red-dark); color: white; }
.button.quiet { background: #f5f8fb; color: #214364; border-color: #d1dfea; }
.card > .button, .card > form:not(.form-stack) { margin-top: .85rem; }
.nav .button.quiet { background: transparent; color: #f3f7fb; border-color: #ffffff55; }
.notice { padding: .72rem .95rem; margin: 0 0 1rem; border-radius: 8px; background: #ecf1f7; color: #1b456b; }
.notice ul { margin: 0; }
.notice.error { color: #76253b; background: #fae8ed; }
.notice.good, .pill.good { background: var(--green-bg); color: var(--green); }
.auth-card { max-width: 570px; margin: 1rem auto; padding: clamp(1.1rem, 5vw, 2.75rem); }
.auth-card h1 { font-size: clamp(1.95rem, 4vw, 2.75rem); }
.auth-links { margin-top: 1.2rem; }
.empty { grid-column: 1/-1; }
.next { display: flex; justify-content: space-between; gap: .8rem; align-items: center; border-left: 4px solid #416891; margin-bottom: 1rem; }
.number { font-weight: 800; font-family: "Barlow", Bahnschrift, "Segoe UI", sans-serif; font-size: clamp(1.32rem, 4.5vw, 2.5rem); line-height: 1; }
.figures .card p { font-size: .92rem; margin-top: .38rem; }
.lines { margin: .85rem 0 0; }
.line { display: flex; align-items: flex-start; justify-content: space-between; gap: .6rem; padding-block: .63rem; border-top: 1px solid var(--border); min-width: 0; }
.line > div { min-width: 0; }
.line p { font-size: .9rem; margin: .18rem 0 0; color: var(--muted); }
.pill { display: inline-flex; align-items: center; width: fit-content; font-size: .8rem; line-height: 1.25; padding: .3rem .47rem; border-radius: 6px; background: #eaf0f6; color: #284863; font-weight: 750; }
.page-head .pill { margin-top: .6rem; }
.table-scroll { overflow-x: auto; margin-top: .85rem; }
table { border-collapse: collapse; width: 100%; text-align: left; }
th,td { border-bottom: 1px solid var(--border); padding: .65rem .8rem; vertical-align: top; }
thead { background: #e9f0f6; }
summary { color: #244f76; font-weight: 730; cursor: pointer; padding-block: .55rem; }
details { margin-top: .45rem; border-top: 1px solid var(--border); }
.plain-text { white-space: pre-wrap; }
.lesson { max-width: 820px; }
.lesson .plain-text { margin-top: 0; }
.facts { display: grid; gap: .25rem .75rem; grid-template-columns: max-content minmax(0,1fr); }
.facts dt { font-weight: 720; }
.facts dd { margin: 0; overflow-wrap: anywhere; }
progress { width: 100%; height: .7rem; accent-color: var(--green); }
.release { margin-bottom: .8rem; }
.release-section { border-top: 1px solid var(--border); margin-top: 1rem; padding-top: .8rem; }
.release-section ul { padding-inline-start: 1.2rem; }
.release-section li + li { margin-top: .25rem; }
.qr { margin: .7rem 0; max-width: 12rem; }
.qr svg { display: block; max-width: 100%; }
.recovery { font-family: ui-monospace, monospace; }
@media(max-width: 770px) {
    .shell { width: min(1180px, calc(100% - 28px)); }
    .nav nav { order: 3; width: 100%; }
    .cards.three:not(.figures) { grid-template-columns: minmax(0,1fr); }
    .hero { background-position: 67% center; min-height: 360px; }
}
@media(max-width: 560px) {
    .cards.two, .fields.two { grid-template-columns: minmax(0,1fr); }
    .next, .line { flex-wrap: wrap; }
    .figures { gap: .4rem; }
    .figures .card { padding: .55rem; }
    .figures .card p { font-size: .81rem; }
    .hero { background-image: linear-gradient(90deg, #102337fc 8%, #102337a1 88%), url("campus-hero.webp"); }
    .auth-card { margin-top: 0; }
}
