/* nnp.sk — a student's marked-up notes: copy paper, ballpoint ink, one highlighter. */

/* ---- Self-hosted display face (Bricolage Grotesque), latin + latin-ext ---- */
@font-face{
  font-family:'Bricolage Grotesque';font-style:normal;font-weight:700;font-display:swap;
  src:url(/assets/fonts/bricolage-700-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Bricolage Grotesque';font-style:normal;font-weight:700;font-display:swap;
  src:url(/assets/fonts/bricolage-700-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;
  src:url(/assets/fonts/bricolage-800-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;
  src:url(/assets/fonts/bricolage-800-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ---- Palette (light: copy paper) ---- */
:root{
  --bg:#FDFDFB; --surface:#FFFFFF; --ink:#1A1D29; --muted:#6B6E7B;
  --link:#2447C7; --hairline:#E4E4DE; --hl:#FFE94D; --hl-ink:#1A1D29;
  --font-display:'Bricolage Grotesque',system-ui,sans-serif;
  --font-body:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-mono:ui-monospace,"SF Mono","Cascadia Mono",Consolas,monospace;
  --shadow:0 8px 24px rgba(20,22,31,.12);
}
/* Dark: the night before the exam */
@media (prefers-color-scheme:dark){
  :root{
    --bg:#14161F; --surface:#1D2029; --ink:#E8E8E3; --muted:#9A9DA9;
    --link:#8FA8FF; --hairline:#2A2D38; --shadow:0 8px 24px rgba(0,0,0,.45);
  }
}
html[data-theme="dark"]{
  --bg:#14161F; --surface:#1D2029; --ink:#E8E8E3; --muted:#9A9DA9;
  --link:#8FA8FF; --hairline:#2A2D38; --shadow:0 8px 24px rgba(0,0,0,.45);
}
html[data-theme="light"]{
  --bg:#FDFDFB; --surface:#FFFFFF; --ink:#1A1D29; --muted:#6B6E7B;
  --link:#2447C7; --hairline:#E4E4DE; --shadow:0 8px 24px rgba(20,22,31,.12);
}

/* ---- Base ---- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);
  font-size:1rem;line-height:1.6;-webkit-font-smoothing:antialiased;}
img{max-width:100%;}
a{color:var(--link);text-decoration:none;}
a:hover{text-decoration:underline;}
:focus-visible{outline:2px solid var(--link);outline-offset:2px;border-radius:2px;}
.wrap{width:100%;max-width:68rem;margin:0 auto;padding:0 1.25rem;}
.mono{font-family:var(--font-mono);font-size:.8rem;letter-spacing:.01em;}
/* School / faculty abbreviation badge (e.g. "FEI TUKE"). */
.abbr{display:inline-block;font-family:var(--font-mono);font-size:.72em;font-weight:600;
  color:var(--muted);background:var(--surface);border:1px solid var(--hairline);
  border-radius:5px;padding:.05em .4em;vertical-align:middle;letter-spacing:.02em;white-space:nowrap;}
.abbr-h1{font-size:.9rem;margin-left:.3rem;}

h1,h2,.brand{font-family:var(--font-display);font-weight:800;line-height:1.05;letter-spacing:-.01em;}
h1{font-size:clamp(1.6rem,4vw,2.4rem);margin:1.5rem 0 1rem;}
h2{font-size:1.4rem;margin:2rem 0 .75rem;font-weight:700;}
.lede{color:var(--muted);font-size:1.05rem;max-width:44rem;}

.skip-link{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--bg);
  padding:.5rem .8rem;border-radius:0 0 6px 0;z-index:100;}
.skip-link:focus{left:0;}

/* ---- Signature highlighter mark ---- */
.hl{
  background:linear-gradient(104deg,transparent .5%,var(--hl) 3%,var(--hl) 97%,transparent 99%);
  background-repeat:no-repeat;color:var(--hl-ink);padding:0 .15em;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
  display:inline-block;transform:rotate(-.75deg);
}
@media (prefers-reduced-motion:no-preference){
  .hero-hl{background-size:0% 100%;animation:hl-in .6s ease-out forwards;}
}
@keyframes hl-in{to{background-size:100% 100%;}}

/* ---- Header ---- */
.site-header{position:sticky;top:0;z-index:20;background:var(--bg);
  border-bottom:1px solid var(--hairline);}
.header-inner{display:flex;align-items:center;gap:1rem;padding:.7rem 1.25rem;flex-wrap:wrap;}
.brand{font-size:1.15rem;color:var(--ink);white-space:nowrap;flex:0 0 auto;
  display:inline-flex;align-items:center;gap:.45rem;}
.brand:hover{text-decoration:none;}
/* The 2006 monkey mascot, back on duty. Paddles gently on hover. */
.brand-mascot{width:2.1rem;height:auto;flex:none;transition:transform .2s ease;}
.brand:hover .brand-mascot{transform:rotate(-8deg);}
@media (prefers-reduced-motion:reduce){.brand:hover .brand-mascot{transform:none;}}
.site-nav{display:flex;gap:1rem;flex:0 0 auto;}
.site-nav a{color:var(--ink);font-weight:500;}
.search{position:relative;flex:1 1 13rem;min-width:0;}
.search-input,.hero-input{width:100%;font:inherit;background:var(--surface);color:var(--ink);
  border:1px solid var(--hairline);border-radius:8px;min-width:0;}
.search-input{font-size:.9rem;padding:.45rem .7rem;}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  flex:0 0 auto;border:1px solid var(--hairline);border-radius:8px;background:var(--surface);
  color:var(--ink);cursor:pointer;}
.theme-toggle:hover{border-color:var(--ink);}
.ic{display:none;}
.ic-moon{display:block;}
@media (prefers-color-scheme:dark){.ic-moon{display:none;}.ic-sun{display:block;}}
html[data-theme="dark"] .ic-moon{display:none;}
html[data-theme="dark"] .ic-sun{display:block;}
html[data-theme="light"] .ic-moon{display:block;}
html[data-theme="light"] .ic-sun{display:none;}

/* ---- Typeahead ---- */
.typeahead{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:30;
  background:var(--surface);border:1px solid var(--hairline);border-radius:8px;
  box-shadow:var(--shadow);overflow:hidden;max-height:70vh;overflow-y:auto;}
.ta-option{display:flex;flex-direction:column;gap:2px;padding:.5rem .7rem;cursor:pointer;
  border-bottom:1px solid var(--hairline);}
.ta-option:last-child{border-bottom:0;}
.ta-option[aria-selected="true"],.ta-option:hover{background:var(--hl);color:var(--hl-ink);}
.ta-name{font-weight:600;font-size:.9rem;}
.ta-context{font-family:var(--font-mono);font-size:.72rem;color:var(--muted);}
.ta-option[aria-selected="true"] .ta-context,.ta-option:hover .ta-context{color:var(--hl-ink);}

/* ---- Hero ---- */
.hero{padding:3rem 0 2.5rem;text-align:center;}
.hero-title{font-size:clamp(2.4rem,6vw,4.2rem);margin:0 0 .6rem;}
.hero-sub{font-size:1.05rem;color:var(--muted);max-width:34rem;margin:0 auto 1.5rem;}
.hero-search,.page-search{display:flex;gap:.5rem;max-width:34rem;}
.hero-search{margin:0 auto 1rem;}
.page-search{margin:1rem 0 1.75rem;}
.hero-input{padding:.7rem .9rem;flex:1;}
.hero-stats{color:var(--muted);}

/* ---- Buttons ---- */
.btn{display:inline-block;font:inherit;font-weight:600;cursor:pointer;text-align:center;
  border:1px solid transparent;border-radius:8px;padding:.55rem .9rem;}
.btn:hover{text-decoration:none;}
.btn-primary{position:relative;background:var(--ink);color:var(--bg);border-color:var(--ink);}
.btn-primary:hover::after{content:"";position:absolute;left:.9rem;right:.9rem;bottom:-3px;
  height:3px;background:var(--hl);border-radius:2px;}
.btn-lg{font-size:1.05rem;padding:.8rem 1.4rem;margin-top:.75rem;}
.btn-download,.btn-view{background:var(--surface);color:var(--ink);border-color:var(--hairline);
  font-size:.85rem;padding:.4rem .8rem;white-space:nowrap;}
.btn-download:hover,.btn-view:hover{border-color:var(--ink);}

/* ---- Cards ---- */
.card-grid{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.85rem;}
.card{display:flex;flex-direction:column;gap:.35rem;height:100%;padding:1rem 1.1rem;
  background:var(--surface);border:1px solid var(--hairline);border-radius:10px;color:var(--ink);
  transition:border-color .15s ease,transform .15s ease;}
.card:hover{border-color:var(--ink);transform:translateY(-1px);text-decoration:none;}
.card-title{font-weight:600;line-height:1.3;color:var(--ink);padding:0 .1em;margin:0 -.1em;
  background:linear-gradient(104deg,transparent .5%,var(--hl) 3%,var(--hl) 97%,transparent 99%);
  background-repeat:no-repeat;background-size:0% 100%;transition:background-size .2s ease;}
.card:hover .card-title{background-size:100% 100%;color:var(--hl-ink);}
.card-meta{color:var(--muted);}

/* School icons keep their original white background, so they sit in a
   paper chip that looks intentional in dark mode too. */
.school-icon{display:inline-flex;align-items:center;justify-content:center;width:3rem;height:3rem;
  padding:.3rem;background:#FFFFFF;border:1px solid var(--hairline);border-radius:8px;
  margin-bottom:.25rem;flex:none;}
.school-icon img{max-width:100%;max-height:100%;object-fit:contain;}
.school-icon-lg{width:4rem;height:4rem;padding:.4rem;margin-bottom:0;}
.page-head{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:1rem;}
.page-head h1{margin:0;}

/* ---- "Still growing" band (home, links to /najnovsie) ---- */
.growth{display:flex;align-items:center;gap:.75rem 1.1rem;flex-wrap:wrap;
  margin:.25rem 0 0;padding:.9rem 1.2rem;background:var(--surface);color:var(--ink);
  border:1px solid var(--hairline);border-left:3px solid var(--hl);border-radius:10px;
  transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease;}
.growth:hover{border-color:var(--ink);transform:translateY(-1px);box-shadow:var(--shadow);
  text-decoration:none;}
.growth-badge{display:inline-flex;align-items:center;gap:.45rem;flex:0 0 auto;
  font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:.68rem;color:var(--muted);}
.growth-dot{width:.55rem;height:.55rem;border-radius:50%;background:#28c76f;flex:none;
  box-shadow:0 0 0 0 rgba(40,199,111,.5);animation:growth-pulse 2.4s ease-out infinite;}
@keyframes growth-pulse{
  0%{box-shadow:0 0 0 0 rgba(40,199,111,.5);}
  70%{box-shadow:0 0 0 .5rem rgba(40,199,111,0);}
  100%{box-shadow:0 0 0 0 rgba(40,199,111,0);}
}
.growth-text{flex:1 1 18rem;min-width:0;line-height:1.5;color:var(--ink);}
.growth-num{padding:0 .14em;font-weight:700;color:var(--hl-ink);
  background:linear-gradient(104deg,transparent .5%,var(--hl) 3%,var(--hl) 97%,transparent 99%);
  background-repeat:no-repeat;}
.growth-link{flex:0 0 auto;margin-left:auto;color:var(--link);font-weight:600;white-space:nowrap;}
.growth:hover .growth-link{text-decoration:underline;}

/* ---- Section lede (short intro under an h2) ---- */
.section-lede{color:var(--muted);max-width:44rem;margin:.35rem 0 0;}

/* ---- Contribute call-to-action (home, permanent) ---- */
.contribute{margin-top:3rem;}
.contribute-inner{padding:2.25rem 1.75rem;text-align:center;background:var(--surface);
  border:1px solid var(--hairline);border-top:3px solid var(--hl);border-radius:12px;}
.contribute h2{font-size:1.5rem;margin:0 0 .6rem;}
.contribute p{color:var(--muted);max-width:40rem;margin:0 auto;line-height:1.6;}
.contribute .btn-lg{margin-top:1.4rem;}

/* ---- Preservation call-to-action (top banner, dismissable) ---- */
.preserve-cta{border-bottom:1px solid var(--hairline);background:var(--surface);}
html.cta-hidden .preserve-cta{display:none;}
.preserve-inner{display:flex;align-items:center;gap:.5rem;}
.preserve-cta p{flex:1;margin:0;padding:.55rem 0;font-size:.85rem;color:var(--muted);text-align:center;}
.preserve-cta .hl{font-weight:600;}
.cta-close{flex:none;border:0;background:none;color:var(--muted);cursor:pointer;
  font-size:1.3rem;line-height:1;padding:.3rem .5rem;border-radius:6px;}
.cta-close:hover{color:var(--ink);background:var(--hairline);}

/* ---- Breadcrumbs ---- */
.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;margin:1.5rem 0 .5rem;
  color:var(--muted);}
.breadcrumbs a{color:var(--muted);}
.breadcrumbs a:hover{color:var(--link);}
.breadcrumbs .sep{color:var(--hairline);}
.breadcrumbs [aria-current="page"]{color:var(--ink);}

/* ---- Rows (subjects + notes) ---- */
.row-list,.note-list{list-style:none;margin:1.25rem 0 0;padding:0;}
.subject-row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  padding:.7rem 0;border-bottom:1px solid var(--hairline);}
.subject-name{font-weight:500;}
.subject-meta{color:var(--muted);white-space:nowrap;}
.note-row{display:flex;align-items:center;gap:.85rem;padding:.75rem 0;
  border-bottom:1px solid var(--hairline);}
.note-body{flex:1;min-width:0;}
.note-name{font-weight:600;display:inline-block;}
.note-context,.note-meta{color:var(--muted);margin:.2rem 0 0;}
.note-action{flex:0 0 auto;}
.restoring{color:var(--muted);}
.ext-badge{display:inline-block;flex:0 0 auto;font-family:var(--font-mono);font-size:.7rem;
  text-transform:uppercase;letter-spacing:.03em;color:var(--muted);line-height:1;
  border:1px solid var(--hairline);border-radius:2px;padding:.22rem .36rem;}
/* Video rows share the note-row layout; the YouTube thumbnail is the "icon". */
.video-thumb-icon{position:relative;flex:0 0 auto;display:block;width:80px;height:45px;
  border-radius:6px;overflow:hidden;background:var(--hairline);}
.video-thumb-icon img{width:100%;height:100%;object-fit:cover;display:block;}
.video-thumb-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:26px;height:26px;border-radius:50%;background:rgba(20,22,31,.62);
  display:flex;align-items:center;justify-content:center;transition:background .15s ease;}
.video-thumb-play svg{width:14px;height:14px;fill:#FFFFFF;margin-left:1px;transition:fill .15s ease;}
.video-row:hover .video-thumb-play{background:var(--hl);}
.video-row:hover .video-thumb-play svg{fill:var(--hl-ink);}
@media (max-width:560px){.video-thumb-icon{width:64px;height:36px;}}

/* ---- Note detail ---- */
.note-detail h1{margin:.5rem 0 .75rem;}
.note-comment{max-width:44rem;}
.meta-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));gap:.6rem 1.2rem;
  margin:1.25rem 0;padding:1rem;background:var(--surface);border:1px solid var(--hairline);
  border-radius:10px;}
.meta-item dt{color:var(--muted);font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;}
.meta-item dd{margin:.15rem 0 0;color:var(--ink);font-size:.95rem;}
.notice{margin:1.25rem 0;padding:.85rem 1rem;background:var(--surface);color:var(--ink);
  border:1px solid var(--hairline);border-left:3px solid var(--hl);border-radius:6px;}
.back-link{margin-top:1.5rem;}

/* ---- Note text preview (nnp_presentations_html, sanitised) ---- */
.note-preview{margin-top:2.5rem;}
.note-preview>h2{font-size:1.25rem;margin-bottom:.75rem;}
.preview-body{width:100%;padding:1.25rem 1.4rem;
  background:var(--surface);border:1px solid var(--hairline);border-left:3px solid var(--hl);
  border-radius:8px;color:var(--ink);font-size:.95rem;line-height:1.6;
  overflow-wrap:break-word;}
/* The converted document brings arbitrary structure; tame it to fit the page. */
.preview-body :is(h1,h2,h3,h4,h5,h6){font-size:1.05rem;margin:1.1rem 0 .4rem;line-height:1.3;}
.preview-body p{margin:0 0 .7rem;}
.preview-body :is(ul,ol){margin:0 0 .7rem 1.4rem;}
.preview-body li{margin:.15rem 0;}
.preview-body a{color:var(--link);}
.preview-body img{max-width:100%;height:auto;}
.preview-body table{border-collapse:collapse;max-width:100%;margin:.5rem 0;font-size:.9em;}
.preview-body :is(td,th){border:1px solid var(--hairline);padding:.3rem .5rem;text-align:left;
  vertical-align:top;}
.preview-note{margin-top:.6rem;color:var(--muted);}

/* ---- Prose / search states / 404 ---- */
.prose{max-width:44rem;}
.prose h2{font-size:1.3rem;}
.prose section{margin-bottom:1.1rem;}
.empty{color:var(--muted);margin:2rem 0;}
.results-count{color:var(--muted);margin-top:1rem;}
.search-videos{margin-top:2rem;}
.search-videos h2{font-size:1.25rem;margin-bottom:.5rem;}
.notfound{padding:3rem 0;text-align:center;}
.notfound-mascot{display:block;margin:0 auto .75rem;}
/* Original 2006 logo shown as a framed artifact on the about page. It was
   drawn for a white page, so it keeps a paper backing in dark mode too. */
.heritage-logo{margin:1.25rem 0 0;}
.heritage-logo img{display:block;max-width:100%;height:auto;background:#FFFFFF;
  border:1px solid var(--hairline);border-radius:10px;padding:.9rem 1.1rem;box-sizing:content-box;}
.heritage-logo figcaption{margin-top:.5rem;color:var(--muted);font-size:.8rem;}
.notfound .page-search,.notfound .back-link{max-width:34rem;margin-left:auto;margin-right:auto;}

/* ---- Footer ---- */
.site-footer{border-top:1px solid var(--hairline);margin-top:3rem;padding:2rem 0;}
.footer-inner p{margin:.2rem 0;}
.footer-line{font-weight:500;}
.footer-meta{font-family:var(--font-mono);font-size:.8rem;color:var(--muted);}

/* ---- Responsive ---- */
@media (max-width:560px){
  .header-inner{gap:.55rem;}
  .search{order:3;flex-basis:100%;}
  .site-nav{gap:.8rem;font-size:.92rem;}
  .hero{padding:2rem 0 1.75rem;}
  .hero-search,.page-search{flex-direction:column;}
  .subject-row{flex-direction:column;align-items:flex-start;gap:.2rem;}
  .video-grid{grid-template-columns:1fr;}
}

/* ---- Top-downloads lists & related notes ---- */
ol.note-list{margin:1.25rem 0 0;padding:0;}
.note-rank{flex:0 0 2.1rem;text-align:right;color:var(--muted);}
.more-link{margin-top:1rem;}
.top-section{margin-top:2.5rem;}
.related{margin-top:2.5rem;}
.related h2{font-size:1.25rem;}

/* ---- Subject videos (click-to-load YouTube facade) ---- */
.video-section{margin-top:2.5rem;}
.video-grid{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;
  grid-template-columns:repeat(2,1fr);gap:1rem;}
.video-item{min-width:0;}
.video-card{display:flex;flex-direction:column;height:100%;background:var(--surface);
  border:1px solid var(--hairline);border-radius:10px;overflow:hidden;color:var(--ink);
  transition:border-color .15s ease,transform .15s ease;}
.video-card:hover{border-color:var(--ink);transform:translateY(-1px);text-decoration:none;}
/* 16:9 thumbnail box; the 480x360 image is cropped to fill it. */
.video-thumb{position:relative;display:block;width:100%;padding-bottom:56.25%;
  background:var(--hairline);}
.video-thumb img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block;}
/* Play-button overlay: dark disc + white triangle, turns highlighter on hover. */
.video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:60px;height:60px;border-radius:50%;background:rgba(20,22,31,.68);
  display:flex;align-items:center;justify-content:center;
  transition:background .15s ease,transform .15s ease;}
.video-play svg{width:26px;height:26px;margin-left:3px;fill:#FFFFFF;
  transition:fill .15s ease;}
.video-card:hover .video-play,.video-card:focus-visible .video-play{
  background:var(--hl);transform:translate(-50%,-50%) scale(1.06);}
.video-card:hover .video-play svg,.video-card:focus-visible .video-play svg{fill:var(--hl-ink);}
.video-title{font-weight:600;line-height:1.3;color:var(--ink);padding:.7rem .85rem 0;}
.video-context{color:var(--muted);margin:.3rem 0 0;padding:0 .85rem .8rem;}
/* Swapped-in embed keeps the same 16:9 box and card frame. */
.video-embed-wrap{position:relative;width:100%;padding-bottom:56.25%;overflow:hidden;
  background:#000;border:1px solid var(--hairline);border-radius:10px;}
.video-embed{position:absolute;top:0;left:0;width:100%;height:100%;border:0;}
/* AI-summary attribution note (shown on the video detail page). */
.video-summary-note{color:var(--muted);margin:.6rem 0 .2rem;}

/* ---- Single video detail page ---- */
.video-detail h1{margin:.5rem 0 .75rem;}
/* The click-to-load facade / embed, kept at a comfortable reading width. */
.video-player{margin:1.25rem 0;}
.video-player .video-card{height:auto;}
.video-transcript{margin-top:2rem;}
.video-transcript h2{font-size:1.25rem;}
.video-transcript p{margin:.6rem 0;}
.video-transcript ul{margin:.6rem 0;padding-left:1.2rem;}
.video-transcript li{margin:.25rem 0;}

/* ---- "Study with your AI" callout ---- */
.ai-study{margin:2rem 0;padding:1.5rem 1.5rem 1.25rem;background:var(--surface);
  border:1px solid var(--hairline);border-top:3px solid var(--hl);border-radius:12px;}
.ai-study h2{font-size:1.2rem;margin:0 0 .4rem;}
.ai-study>p{color:var(--muted);line-height:1.6;margin:0 0 1rem;}
.ai-study-actions{display:flex;flex-wrap:wrap;gap:.6rem;}
.ai-study-status{margin:.85rem 0 0;color:var(--ink);font-weight:600;}
.ai-study-open{margin:.85rem 0 0;color:var(--muted);}

/* ---- Admin stats (pure CSS, no JS) ---- */
.chart{display:flex;align-items:flex-end;gap:3px;height:180px;margin:1rem 0 2rem;}
.chart-col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%;min-width:0;}
.chart-bar{background:var(--hl);border:1px solid var(--hairline);border-bottom:none;
  border-radius:2px 2px 0 0;min-height:1px;}
.chart-label{font-size:.58rem;color:var(--muted);text-align:center;margin-top:2px;
  overflow:hidden;}
.stats-table{width:100%;max-width:44rem;border-collapse:collapse;margin:0 0 2rem;}
.stats-table td{padding:.4rem 0;border-bottom:1px solid var(--hairline);word-break:break-all;}
.stats-table td.num{text-align:right;font-family:var(--font-mono);font-size:.8rem;
  color:var(--muted);white-space:nowrap;padding-left:1rem;word-break:normal;}

/* ---- Hub enrichment: profile, metrics, alumni, AI note ---- */
.profile{max-width:44rem;margin:.75rem 0 0;}
.profile-desc{margin:0 0 .35rem;}
.profile-facts{color:var(--muted);margin:0;}
.metrics-section{margin-top:2rem;}
.metrics-section h2,.alumni-section h2,.compare-section h2{font-size:1.25rem;}
.metric-list{list-style:none;margin:1rem 0 0;padding:0;max-width:44rem;}
.metric-row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  padding:.5rem 0;border-bottom:1px solid var(--hairline);}
.metric-label{font-weight:500;}
.metric-value{color:var(--ink);white-space:nowrap;}
.metric-year{color:var(--muted);}
.sources-line{color:var(--muted);margin-top:.85rem;}
.alumni-section{margin-top:2rem;}
.alumni-list{list-style:none;margin:1rem 0 0;padding:0;max-width:44rem;}
.alumni-row{padding:.45rem 0;border-bottom:1px solid var(--hairline);}
.alumni-name{font-weight:500;}
.alumni-known{color:var(--muted);margin-left:.4rem;}
.detail-columns{display:grid;grid-template-columns:1fr 1fr;gap:2rem 2.5rem;align-items:start;margin-top:2rem;}
.detail-columns > .metrics-section,.detail-columns > .alumni-section{margin-top:0;min-width:0;}
@media (max-width:720px){.detail-columns{grid-template-columns:1fr;gap:2rem;}}
.ai-note{color:var(--muted);margin-top:2.5rem;}
.chart-note{color:var(--muted);margin-top:.85rem;}

/* ---- Comparison bar charts (pure CSS; values are real text, bars decor) ---- */
.compare-section{margin-top:2.75rem;}
.bar-list{list-style:none;margin:1rem 0 0;padding:0;}
.bar-row{display:grid;grid-template-columns:minmax(9rem,16rem) 1fr auto;align-items:center;
  gap:.75rem;padding:.4rem 0;border-bottom:1px solid var(--hairline);}
.bar-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);
  font-size:.92rem;}
.bar-track{display:block;height:14px;min-width:0;}
.bar-fill{display:block;height:100%;background:var(--hl);
  border:1px solid var(--hairline);border-radius:3px;}
.bar-value{color:var(--muted);white-space:nowrap;text-align:right;}
@media (max-width:560px){
  .bar-row{grid-template-columns:1fr auto;}
  .bar-track{grid-column:1 / -1;order:3;}
}

/* ---- Motion off ---- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important;}
}