/* Gate 2 tokens. Breakpoints: 40rem (640px), 60rem (960px), at a 16px default. */
/* Frontend design tokens. Legacy names below remain compatible with shared components. */
:root{color-scheme:light;
--etl-text:#16324F;--etl-muted:#5B6B7A;--etl-primary:#1E63D6;--etl-primary-hover:#174FAE;
--etl-brand-cyan:#24A9D8;--etl-page:#F8FAFC;--etl-surface:#FFFFFF;--etl-surface-blue:#EEF6FF;
--etl-border:#DCE6F0;--etl-control-border:#78899C;--etl-footer:#163B5C;--etl-footer-text:#FFFFFF;
--etl-footer-border:#FFFFFF40;--etl-focus:#174FAE;--etl-on-primary:#FFFFFF;
--etl-accent:#F59A45;--etl-accent-text:#86420E;--etl-accent-surface:#FFF0DF;
--etl-disabled:#345C77;--etl-error:#922B21;--etl-hover-border:#A8C3E3;
--etl-card-shadow:0 2px 8px #16324F05;--etl-card-hover-shadow:0 8px 22px #16324F14;
--etl-logo-edge:#16324F;--etl-play-shadow:0 4px 16px #16324F22;
--page:var(--etl-page);--surface:var(--etl-surface);--ink:var(--etl-text);--secondary:var(--etl-muted);
--blue:var(--etl-primary);--blue-wash:var(--etl-surface-blue);--orange:var(--etl-accent);
--orange-text:var(--etl-accent-text);--orange-wash:var(--etl-accent-surface);--divider:var(--etl-border);
--control-border:var(--etl-control-border);--focus:var(--etl-focus);--a2:#11635C;--a2-wash:#E5F4EF;--b2:#654295;--b2-wash:#F1EAF9;--font:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--body:1.125rem;--h1:2rem;--h2:1.5625rem;--h3:1.375rem;--meta:.9375rem;--small:.875rem;--number:.8125rem;--s1:.25rem;--s2:.375rem;--s3:.5rem;--s4:.75rem;--s5:1rem;--s6:1.25rem;--s7:1.5rem;--s8:1.75rem;--s9:2rem;--s10:2.5rem;--s11:3rem;--radius:.5rem;--card-radius:.75rem;--site:73rem;--player:60rem;--reading:45rem;--actions:48rem;--gutter:1rem;--target:3rem;--primary-target:3.25rem;--play:4rem;--play-shadow:var(--etl-play-shadow)}
*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;background:var(--page);color:var(--ink);font-family:var(--font);font-size:var(--body);line-height:1.65;overflow-wrap:anywhere}img,svg,video{max-width:100%;height:auto}iframe{max-width:100%}a{color:var(--blue);text-underline-offset:.18em}a:hover{text-decoration-thickness:.13em}button,input,select,textarea{font:inherit}button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}h1,h2,h3{font-weight:500;line-height:1.25;margin:0 0 var(--s5)}h1{font-size:var(--h1);line-height:1.15}h2{font-size:var(--h2)}h3{font-size:var(--h3);line-height:1.3}p{margin:0 0 var(--s5)}[hidden]{display:none!important}:focus-visible{outline:3px solid var(--focus);outline-offset:3px;box-shadow:0 0 0 3px var(--surface)}main:focus{outline:0}.container{width:calc(100% - 2 * var(--gutter));max-width:var(--site);margin-inline:auto}.reading{width:calc(100% - 2 * var(--gutter));max-width:var(--reading);margin-inline:auto}.action-width{width:calc(100% - 2 * var(--gutter));max-width:var(--actions);margin-inline:auto}.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.skip-link{position:absolute;top:var(--s3);left:var(--s5);z-index:100;background:var(--surface);padding:var(--s4);transform:translateY(-200%)}.skip-link:focus{transform:none}.small{font-size:var(--small);line-height:1.5;color:var(--secondary)}
.site-header{background:var(--surface);border-bottom:1px solid var(--divider)}.header-inner{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:var(--s3);padding-block:var(--s3)}.brand{display:flex;gap:var(--s3);align-items:center;text-decoration:none;min-height:var(--target);max-width:100%;min-width:0}.brand-image{width:2.5rem;height:2.5rem;object-fit:contain;flex-shrink:0}.brand--horizontal .brand-image{width:auto;height:auto;max-width:min(12.5rem,100%);max-height:2.5rem}.brand-name{font-size:1rem;font-weight:700;letter-spacing:-.025em;color:var(--blue)}.menu-toggle{background:var(--surface);border:1px solid var(--control-border);border-radius:var(--radius);min-height:var(--target);padding:var(--s3) var(--s4);font-size:1rem;color:var(--ink)}.primary-navigation{flex-basis:100%;min-width:0}.menu{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s5);list-style:none;padding:0;margin:0}.primary-navigation .menu{flex-direction:column;gap:0}.menu a{display:inline-flex;align-items:center;min-height:var(--target);font-size:1rem;font-weight:500;text-decoration:none}.primary-navigation .menu a{color:var(--ink)}.menu a:hover{text-decoration:underline}.menu .sub-menu{list-style:none;padding-inline-start:var(--s6)}
.lesson-heading{padding-block:var(--s7) var(--s5)}.eyebrow{font-size:var(--number);font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--secondary);margin-bottom:var(--s3)}.metadata{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3) var(--s4);font-size:var(--meta);line-height:1.5;color:var(--secondary)}.metadata>span{max-width:100%}.level{display:inline-block;border-radius:var(--s2);padding:var(--s1) var(--s3);background:var(--blue-wash);color:var(--blue);font-size:var(--small);font-weight:500}.level--a2{background:var(--a2-wash);color:var(--a2)}.level--b1{background:var(--orange-wash);color:var(--orange-text)}.level--b2{background:var(--b2-wash);color:var(--b2)}
.video-component{margin-inline:auto;max-width:var(--player)}.video-stage{position:relative;aspect-ratio:16/9;background:var(--ink);color:var(--surface);display:grid;place-items:center}.video-stage iframe{display:block;border:0;width:100%;height:100%;position:absolute;inset:0}.video-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.play-control{position:relative;display:flex;align-items:center;gap:var(--s4);border:0;border-radius:var(--radius);background:var(--blue);color:var(--surface);font-size:1rem;line-height:1.45;text-decoration:none;padding:var(--s3) var(--s5);max-width:calc(100% - 2rem);min-height:var(--play);box-shadow:var(--play-shadow)}.play-icon{font-size:1.5rem}.video-empty{padding:var(--s5);text-align:center;font-size:1rem;max-width:100%;margin:0}.video-support{padding-top:var(--s3)}.video-status:empty{display:none}.video-status{margin-block:var(--s3);font-size:var(--small)}.watch-fallback{font-size:var(--small);display:inline-flex;align-items:center;min-height:var(--target)}.lesson-actions{display:grid;gap:var(--s4);padding-block:var(--s3) var(--s8)}.button{display:flex;justify-content:center;align-items:center;gap:var(--s3);min-height:var(--primary-target);width:100%;padding:var(--s4) var(--s5);border:1px solid var(--blue);border-radius:var(--radius);color:var(--surface);background:var(--blue);font-size:1rem;font-weight:500;line-height:1.45;text-decoration:none;text-align:center}.button:hover{text-decoration:underline}.button--secondary{background:var(--surface);color:var(--blue)}.homework .small{margin:var(--s3) 0 0;text-align:center}.notice{background:var(--orange-wash);color:var(--orange-text);padding:var(--s5);border-radius:var(--radius);font-size:1rem;margin:0}.lesson-content{padding-block:var(--s3) var(--s7)}.prose h2{margin-top:var(--s9)}.lesson-content>:first-child{margin-top:0}.prose h3{margin-top:var(--s7)}.prose li{margin-bottom:var(--s3)}.prose ul,.prose ol{padding-inline-start:var(--s7)}.prose blockquote{margin-inline:0;padding-inline-start:var(--s5);border-inline-start:4px solid var(--orange)}.prose pre{white-space:pre-wrap;overflow-wrap:anywhere}.prose table{width:100%;table-layout:fixed;border-collapse:collapse}.prose td,.prose th{padding:var(--s3);border:1px solid var(--control-border)}.prose figure{max-width:100%;margin-inline:0}.prose .wp-block-image img{height:auto}.prose>*{max-width:100%}.lesson-continuation{display:grid;gap:var(--s4);padding:var(--s7);background:var(--blue-wash);border-radius:var(--card-radius)}.related{padding-block:var(--s11)}
.lesson-grid{display:grid;grid-template-columns:1fr;gap:var(--s7)}.lesson-card{background:var(--surface);border:1px solid var(--etl-border);box-shadow:var(--etl-card-shadow);border-radius:var(--card-radius);overflow:hidden;min-width:0;display:flex;flex-direction:column}.card-image{aspect-ratio:16/9;background:var(--blue-wash)}.card-image img{width:100%;height:100%;object-fit:contain;display:block}.card-body{padding:var(--s6);display:flex;flex-direction:column;align-items:flex-start;flex:1}.card-body h3{margin-bottom:var(--s4)}.card-body .metadata{margin-bottom:var(--s5)}.card-action{min-height:var(--primary-target);display:inline-flex;gap:var(--s3);align-items:center;justify-content:center;width:100%;margin-top:auto;padding:var(--s4) var(--s5);border:1px solid var(--blue);border-radius:var(--radius);background:var(--blue);color:var(--surface);font-size:1rem;font-weight:600;line-height:1.45;text-align:center;text-decoration:none}.card-action:visited{color:var(--surface)}.card-action:hover{background:var(--etl-primary-hover);border-color:var(--etl-primary-hover);text-decoration:underline}.site-footer{border-top:1px solid var(--divider);background:var(--surface);padding-block:var(--s7);margin-top:var(--s11)}.footer-tagline{font-weight:500;font-size:1rem;margin-bottom:var(--s3)}.footer-inner .small{margin:var(--s3) 0 0}.footer-logo{width:auto;max-width:11.25rem;max-height:2.5rem;object-fit:contain;margin-bottom:var(--s4)}.standard-page{padding-block:var(--s9);min-height:40vh}
@media(min-width:40rem){:root{--gutter:2rem;--h1:2.5rem}.lesson-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr))}.video-component{width:calc(100% - 2 * var(--gutter))}.lesson-continuation{display:flex;flex-direction:row-reverse;flex-wrap:wrap}.lesson-continuation .button{flex:1 1 16rem}.brand--horizontal .brand-image{max-width:15rem;max-height:3rem}}
@media(min-width:60rem){.primary-navigation{flex-basis:auto}.primary-navigation .menu{flex-direction:row;gap:var(--s7)}.lesson-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,21rem),1fr))}.footer-inner{max-width:var(--site)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.home-hero{background:var(--blue-wash);border-bottom:var(--s1) solid var(--orange);padding-block:var(--s9)}.hero-copy{max-width:var(--reading)}.hero-copy>p:not(.eyebrow){font-size:1rem}.hero-actions{display:flex;flex-direction:column;gap:var(--s4)}.hero-art{display:none}.home-page-content:not(:empty){padding-block:var(--s9)}.library{padding-block:var(--s9)}.archive-heading{max-width:var(--reading);margin-bottom:var(--s7)}.archive-heading>p:not(.eyebrow),.archive-description{font-size:1rem;color:var(--secondary)}.lesson-filters{background:var(--surface);border:1px solid var(--control-border);border-radius:var(--radius)}.lesson-filters summary{cursor:pointer;padding:var(--s4) var(--s5);min-height:var(--target);font-size:1rem;font-weight:500}.filter-form{padding:var(--s5);display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s5)}.field{display:flex;flex-direction:column;gap:var(--s2);min-width:0}.field label,.site-search label{font-size:1rem;font-weight:500}.field input,.field select,.site-search input{width:100%;min-width:0;min-height:var(--target);border:1px solid var(--control-border);border-radius:var(--radius);background:var(--surface);color:var(--ink);padding:var(--s3) var(--s4);font-size:1rem}.field select{padding-inline-end:var(--s7)}.filter-actions{display:flex;flex-direction:column;gap:var(--s4);align-self:end}.results-summary{font-size:var(--meta);margin-block:var(--s7)}.empty-state{max-width:var(--reading);padding-block:var(--s7)}.pagination{margin-top:var(--s9)}.nav-links{display:flex;flex-wrap:wrap;gap:var(--s3)}.page-numbers{min-width:var(--target);min-height:var(--target);display:inline-flex;align-items:center;justify-content:center;padding:var(--s3) var(--s4);border-radius:var(--radius);border:1px solid var(--control-border);font-size:1rem}.page-numbers.current{background:var(--blue);color:var(--surface);border-color:var(--blue)}.page-numbers.dots{border:0;min-width:0}.site-search{display:grid;gap:var(--s3);margin-block:var(--s7)}.search-result{margin-block:var(--s9)}
@media(min-width:40rem){.hero-actions{flex-direction:row}.hero-actions .button{width:auto}.hero-inner--art{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--s9);align-items:center}.hero-art{display:block;width:100%;max-height:16rem;object-fit:contain}.filter-form{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}.filter-actions{grid-column:1/-1;flex-direction:row}.filter-actions>*{width:auto}.home-hero{padding-block:var(--s9)}}

input::placeholder{color:var(--secondary);opacity:1}

/* Gate 7: shared card fallback; existing card layout and metadata are preserved. */
.card-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:min(var(--s3),8px);aspect-ratio:16/9;width:100%;padding:min(var(--s5),16px);text-align:center;font-size:1rem;color:var(--blue)}
.card-placeholder-icon{display:grid;place-items:center;width:min(var(--target),48px);height:min(var(--target),48px);border:1px solid currentColor;border-radius:50%;font-size:1rem}

/* Intrinsic square/tall uploads must not expand the reserved card thumbnail. */
.card-image{position:relative;min-height:0;flex-shrink:0}
.card-image img,.card-image .card-placeholder{position:absolute;inset:0;width:100%;height:100%}

/* Gate 8: retain readable text while keeping decorative phone spacing compact. */
.brand-image{max-width:100%;min-width:0}
.menu-toggle{max-width:100%;overflow-wrap:anywhere}
.primary-navigation .menu>li{min-width:0;max-width:100%}
.primary-navigation .menu a{max-width:100%}
.button>span[aria-hidden],.card-action>span[aria-hidden]{flex-shrink:0}
@media(max-width:39.999rem){
  .container,.reading,.action-width{width:calc(100% - 32px)}
  .header-inner{gap:8px;padding-block:8px}
  .brand{gap:8px;flex-wrap:wrap}
  .brand-image{width:40px;height:40px}
  .brand--horizontal{width:min(200px,calc(100vw - 128px))}
  .brand--horizontal .brand-image{max-width:100%;max-height:40px}
  .card-body{padding:min(var(--s6),20px)}
  .home-hero{padding-block:24px}
  .site-footer{padding-block:24px;margin-top:32px}
}
/* A visible boundary/current marker survives system color substitution. */
@media(forced-colors:active){
  .button,.play-control,.level,.card-placeholder-icon{border:1px solid ButtonText}
  .page-numbers.current{outline:2px solid Highlight;outline-offset:2px;font-weight:700}
  :focus-visible{outline-color:Highlight}
}
/* Basic legibility only; homework remains the printable learning asset. */
@media print{
  .menu-toggle,.primary-navigation,.skip-link,.hero-art{display:none!important}
  .button,.play-control,.page-numbers.current{color:#172536;background:transparent;border:1px solid currentColor}
  .video-stage{break-inside:avoid}
}

/* Respect WordPress password visibility with readable, touch-friendly native forms. */
.post-password-form label{display:block;font-size:1rem}
.post-password-form input{max-width:100%;min-width:0;min-height:var(--target);padding:var(--s3) var(--s4);border:1px solid var(--control-border);border-radius:var(--radius);background:var(--surface);color:var(--ink);font-size:1rem}
.post-password-form input[type=password]{display:block;width:100%;margin-block:var(--s3) var(--s4)}
.post-password-form input[type=submit]{cursor:pointer;background:var(--blue);border-color:var(--blue);color:var(--surface)}

/* Shared light header and navy footer; layout and brand assets are preserved. */
body{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
body>main{flex:1}
body.admin-bar{min-height:calc(100svh - 32px)}
.site-header{background:var(--etl-surface);color:var(--etl-text);border-color:var(--etl-border)}
.site-footer{background:var(--etl-footer);color:var(--etl-footer-text);border-color:var(--etl-footer)}
.site-header .primary-navigation .menu a,.site-header .brand-name{color:var(--etl-text)}
.site-footer a{color:var(--etl-footer-text)}
.site-header .menu-toggle{background:var(--etl-surface);color:var(--etl-text);border-color:var(--etl-control-border);font-size:1.125rem;font-weight:600}
.site-header :focus-visible{outline:3px solid var(--etl-focus);outline-offset:3px;box-shadow:0 0 0 2px var(--etl-surface)}
.site-footer :focus-visible{outline:3px solid var(--etl-footer-text);outline-offset:3px;box-shadow:none}
.site-header .header-inner{min-height:4.5rem}
.site-header .primary-navigation .menu a{font-size:1.25rem;font-weight:600}
.site-footer .footer-inner{text-align:center;display:flex;flex-direction:column;gap:1.25rem}
.footer-credit{font-size:1.25rem;font-weight:600;line-height:1.5;margin:0;text-wrap:balance}
.site-footer .menu{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 2rem}
.site-footer .menu a{font-size:1.125rem;min-height:3rem;color:var(--etl-footer-text)}
.footer-copyright{font-size:1rem;border-top:1px solid var(--etl-footer-border);padding-top:1.25rem;margin:0;color:var(--etl-footer-text)}
.site-footer .footer-logo{align-self:center}
.lesson-card:focus-within,a.level-choice-inner:focus-visible{border-color:var(--etl-hover-border);box-shadow:var(--etl-card-hover-shadow)}
@media(hover:hover) and (pointer:fine){.lesson-card:hover,a.level-choice-inner:hover{border-color:var(--etl-hover-border);box-shadow:var(--etl-card-hover-shadow)}}
@media(prefers-reduced-motion:no-preference){.lesson-card,a.level-choice-inner{transition:border-color 160ms ease,box-shadow 160ms ease}}
@media(min-width:60rem){.site-header .header-inner{min-height:6rem;padding-block:.75rem}.site-header .brand--horizontal .brand-image{max-width:25rem;max-height:5rem}.site-header .primary-navigation .menu a{font-size:1.5rem}.footer-credit{font-size:1.5rem}.site-footer .menu a{font-size:1.375rem}}
@media(max-width:782px){body.admin-bar{min-height:calc(100svh - 46px)}}

/* Card actions remain visible in system colors and print. */
@media(forced-colors:active){.card-action{border-color:ButtonText}.lesson-card{border-color:CanvasText}}
@media print{.card-action{color:#172536;background:transparent;border-color:currentColor}.lesson-card{box-shadow:none}}

/* Five-item native Primary menu. Keep mobile text readable rather than squeezing. */
.site-header .primary-navigation .menu a{font-size:1.25rem}
.site-header .primary-navigation .etl-start-learning>a{background:var(--etl-primary);color:var(--etl-on-primary);border:2px solid var(--etl-primary);border-radius:var(--radius);padding:.6rem 1rem;text-align:center;justify-content:center;text-decoration:none}
.site-header .primary-navigation .etl-start-learning>a:hover{background:var(--etl-primary-hover);border-color:var(--etl-primary-hover);color:var(--etl-on-primary)}
.site-header .primary-navigation .etl-start-learning>a:focus-visible{outline-color:var(--etl-focus);outline-offset:4px;box-shadow:0 0 0 2px var(--etl-surface)}
@media(max-width:79.999rem){.site-header .header-inner{min-height:4.5rem;padding-block:.5rem;flex-wrap:wrap}.site-header .brand--horizontal .brand-image{max-width:min(100%,15rem);max-height:3rem}.primary-navigation{width:100%;flex-basis:100%}.primary-navigation .menu{display:flex;flex-direction:column;align-items:stretch;gap:.25rem}.primary-navigation .menu>li>a{width:100%;min-height:3rem}.primary-navigation .etl-start-learning{margin-block:.5rem}.site-header .primary-navigation .menu a{font-size:1.25rem}}
@media(min-width:80rem){.primary-navigation{width:auto;flex-basis:auto}.primary-navigation .menu{flex-direction:row;align-items:center;gap:.75rem}.site-header .brand--horizontal .brand-image{max-width:min(100%,20rem)}.site-header .primary-navigation .menu a{font-size:1.25rem;white-space:nowrap}.primary-navigation .menu>li{flex-shrink:0}}

/* Preserve the uploaded wordmark pixels; a fine navy edge keeps its white lettering legible. */
.site-header .brand-image{filter:drop-shadow(0 0 1px var(--etl-logo-edge)) drop-shadow(0 1px 1px var(--etl-logo-edge))}
.site-header .primary-navigation a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.35em}
.site-header .primary-navigation .etl-start-learning>a[aria-current="page"]{text-decoration:none}
.site-header .primary-navigation .menu a:hover{ text-decoration:underline;text-underline-offset:.35em }
.site-footer a:hover{color:var(--etl-footer-text);text-decoration:underline;text-decoration-thickness:2px}
/* Primary / secondary / tertiary hierarchy; ordinary text links keep their underline. */
.button,.card-action,.play-control{font-weight:600}
.button:hover,.play-control:hover{background:var(--etl-primary-hover);border-color:var(--etl-primary-hover);color:var(--etl-on-primary)}
.button--secondary:hover{background:var(--etl-surface-blue);border-color:var(--etl-primary);color:var(--etl-primary)}
.button:disabled{background:var(--etl-disabled);border-color:var(--etl-disabled);color:var(--etl-on-primary);cursor:default}
@media(forced-colors:active){.site-header .brand-image{filter:none}.site-header :focus-visible,.site-footer :focus-visible{outline-color:Highlight}.site-header .primary-navigation .etl-start-learning>a{border-color:ButtonText}}

:root{--wp--preset--color--page:var(--etl-page);--wp--preset--color--surface:var(--etl-surface);--wp--preset--color--ink:var(--etl-text);--wp--preset--color--secondary-text:var(--etl-muted);--wp--preset--color--brand-blue:var(--etl-primary);--wp--preset--color--blue-wash:var(--etl-surface-blue);--wp--preset--color--divider:var(--etl-border)}
:root :where(a:where(:not(.wp-element-button,.button,.card-action,.play-control))){color:var(--etl-primary)}