/* District 39 — styles for the public pages (home, meetings, events,
   documents, contacts, PDF viewer). Archive pages use /styles.css.
   Visual system: Anovyne — AA blue does the work, indigo only for focus.
   Mobile first: base rules are the phone layout; min-width queries add room.
   Follows the reader's light/dark setting. */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Newsreader:opsz,wght@6..72,400;6..72,500;6..72,600&family=Public+Sans:wght@400;500;600;700&display=swap");
:root{--bg:#EAEFF5;--card:#FFFFFF;--alt:#F6F9FC;--ink:#16263C;--body:#33455C;--muted:#5A6B82;--faint:#8595A8;--line:#D4DEE9;--line-strong:#BCC9D9;--accent:#1B3A6B;--accent-strong:#15315A;--accent-soft:#DDE7F3;--link:#224A86;--link-hover:#15315A;--hi:#4F46E5;--hi-soft:#ECEAFB;--ok:#1C7148;--ok-soft:#E1EFE7;--warn:#B7791F;--warn-soft:#F6ECD3;--bad:#B3322A;--bad-soft:#F7E3E0;--ring:rgba(79,70,229,.4);--serif:"Newsreader",Georgia,"Times New Roman",serif;--sans:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;--shadow:0 1px 2px rgba(22,38,60,.06),0 2px 8px rgba(22,38,60,.05);--shadow-md:0 8px 24px rgba(22,38,60,.12);--gutter:1rem}
@media (prefers-color-scheme:dark){:root{--bg:#0C1524;--card:#122036;--alt:#19283F;--ink:#EAF1F9;--body:#D4DEEC;--muted:#93A4BC;--faint:#687C96;--line:#243650;--line-strong:#2F445F;--accent:#3E6CB0;--accent-strong:#2F5A99;--accent-soft:#1B2E4A;--link:#8FB0D6;--link-hover:#B3CCE7;--hi:#8A84F2;--hi-soft:#221F45;--ok:#5FB386;--ok-soft:#14301F;--warn:#E8C56A;--warn-soft:#352B12;--bad:#E08A7C;--bad-soft:#3A1D19;--ring:rgba(138,132,242,.5);--shadow:none;--shadow-md:0 8px 24px rgba(0,0,0,.4)}}

/* ---------- Base (phones) ---------- */
*{box-sizing:border-box}
html{font-family:var(--sans);font-size:100%;line-height:1.6;color:var(--body);background:var(--bg);color-scheme:light dark;-webkit-text-size-adjust:100%}
body{margin:0;overflow-wrap:break-word}
a{color:var(--link);text-underline-offset:3px;text-decoration-thickness:1px;transition:color .15s ease}
a:hover{color:var(--link-hover);text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--hi);outline-offset:2px;border-radius:4px}
strong{color:var(--ink);font-weight:600}
p,li{text-wrap:pretty}
li{margin:.35rem 0}
[id]{scroll-margin-top:1rem}
.skip{position:absolute;left:-999px;top:0;background:var(--accent);color:#fff;padding:.6rem 1rem;z-index:10;border-radius:6px}
.skip:focus{left:.5rem;top:.5rem}
.wrap{max-width:62rem;margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}

header.site{background:var(--card);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;flex-direction:column;gap:.5rem;padding-top:.75rem;padding-bottom:0}
.brand{display:grid;grid-template-columns:auto 1fr;column-gap:.7rem;align-items:center;min-height:44px;color:var(--ink);text-decoration:none;font-family:var(--serif);font-weight:500;font-size:1.2rem;letter-spacing:-.01em;line-height:1.15}
.brand:hover{color:var(--ink)}
.brand::before{content:"d";content:"d" / "";grid-row:1/3;width:2.25rem;height:2.25rem;border-radius:9px;display:grid;place-items:center;padding-bottom:.2rem;font-family:var(--serif);font-size:1.5rem;font-weight:500;line-height:1;color:#fff;background:linear-gradient(var(--hi),var(--hi)) right 5px top 5px/5px 5px no-repeat,var(--accent)}
.brand small{display:block;margin-top:.15rem;font-family:var(--mono);font-size:.62rem;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
/* Nav: one swipeable row on phones, bleeds to the screen edges */
nav.main{margin:0 calc(var(--gutter) * -1);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
nav.main::-webkit-scrollbar{display:none}
nav.main ul{list-style:none;margin:0;padding:0 var(--gutter);display:flex;gap:.15rem;width:max-content;min-width:100%}
nav.main li{margin:0}
nav.main{background:linear-gradient(to right,var(--card) 30%,transparent) left/2.5rem 100% no-repeat local,linear-gradient(to left,var(--card) 30%,transparent) right/2.5rem 100% no-repeat local,linear-gradient(to right,color-mix(in srgb,var(--ink) 16%,transparent),transparent) left/1rem 100% no-repeat scroll,linear-gradient(to left,color-mix(in srgb,var(--ink) 16%,transparent),transparent) right/1rem 100% no-repeat scroll}
nav.main a{position:relative;display:flex;align-items:center;min-height:48px;padding:0 .7rem;color:var(--body);text-decoration:none;font-weight:500;font-size:.95rem;white-space:nowrap;transition:color .15s ease}
nav.main a:hover{color:var(--ink)}
nav.main a[aria-current=page]{color:var(--link);font-weight:600}
nav.main a[aria-current=page]::after{content:"";position:absolute;left:.7rem;right:.7rem;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--accent)}

main{padding-top:1.25rem;padding-bottom:2.5rem}
main:focus{outline:none}
h1{font-family:var(--serif);font-weight:500;font-size:1.85rem;line-height:1.12;letter-spacing:-.02em;color:var(--ink);margin:.25rem 0 .65rem;text-wrap:balance}
h2{font-family:var(--serif);font-weight:500;font-size:1.35rem;line-height:1.2;letter-spacing:-.015em;color:var(--ink);margin:2rem 0 .5rem;text-wrap:balance}
h3{font-weight:600;font-size:1.05rem;line-height:1.35;color:var(--ink);margin:1.1rem 0 .3rem}
main>p,main>ul{max-width:46rem}
main>ul{padding-left:1.15rem}
.lead{font-size:1.06rem;max-width:44rem}
.grid{display:grid;gap:.75rem;grid-template-columns:minmax(0,1fr);margin-top:1.25rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:1rem 1.1rem;box-shadow:var(--shadow)}
.card h2,.card h3{margin-top:0}
.card h2{font-size:1.25rem}
.card p{margin:.45rem 0}
.card>:last-child{margin-bottom:0}
.help{background:var(--accent);border-color:var(--accent);color:#fff}
.help h2,.help p,.help a,.help a:hover{color:#fff}
.help a:focus-visible{outline-color:#fff}
a[href^="tel:"]{white-space:nowrap}
.tel{display:inline-flex;align-items:center;min-height:44px;font-family:var(--serif);font-size:1.4rem;font-weight:500;letter-spacing:-.01em;white-space:nowrap}
.when{font-family:var(--mono);font-size:.76rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--link)}
.card .when{font-family:var(--serif);font-size:1.25rem;letter-spacing:-.01em;text-transform:none;color:var(--ink)}
.muted{color:var(--muted)}
.src{font-size:.875rem;color:var(--muted)}
.note{background:var(--warn-soft);border:1px solid var(--line);border-radius:10px;padding:.8rem 1rem;color:var(--ink)}
ul.events{list-style:none;padding:0;margin:0;display:grid;gap:.5rem;max-width:none}
ul.events>li{margin:0;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:.85rem 1rem;box-shadow:var(--shadow)}
ul.events>li>span.when{display:block;margin-bottom:.1rem}
ul.events p{margin:.3rem 0}
ul.events h3{font-family:var(--serif);font-weight:500;font-size:1.2rem;letter-spacing:-.01em;margin:.15rem 0 .3rem}
.ftype{display:inline-block;margin-left:.35rem;padding:0 .45rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;line-height:1.6;color:var(--muted);background:var(--alt);border:1px solid var(--line);border-radius:999px;vertical-align:.1em}
.docset{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:1rem 1.1rem;margin:.75rem 0;box-shadow:var(--shadow)}
.docset h2{margin-top:0;font-size:1.25rem}
.docset ul{padding-left:1.1rem;margin:.5rem 0 0}
.docset li{margin:.45rem 0}
.docset-links{margin:.2rem 0 .4rem}
dl.contacts{display:grid;grid-template-columns:minmax(0,1fr);margin:1rem 0;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:var(--shadow)}
dl.contacts dt,dl.contacts dd{margin:0;padding:.85rem 1rem}
dl.contacts dt{font-weight:600;color:var(--ink);border-top:1px solid var(--line);padding-bottom:0}
dl.contacts dd{padding-top:.15rem}
dl.contacts dt:first-of-type{border-top:0}
footer.site{border-top:1px solid var(--line);background:var(--card);font-size:.875rem;color:var(--muted);padding:1.25rem 0 2rem}
footer.site p{max-width:46rem}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:0 1.1rem;border-radius:6px;border:1px solid var(--line-strong);background:var(--card);color:var(--ink);font:inherit;font-size:1rem;font-weight:600;text-decoration:none;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}
.btn:hover{background:var(--alt);color:var(--ink)}
.btn:active{transform:translateY(.5px)}
.btn svg{width:1.15rem;height:1.15rem;flex:none}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-strong);border-color:var(--accent-strong);color:#fff}
.btn[aria-disabled=true]{opacity:.55;pointer-events:none}

/* PDF viewer */
.crumbs{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;font-size:.85rem;color:var(--muted);margin-bottom:.75rem}
.crumbs a{display:inline-flex;align-items:center;min-height:32px}
.crumbs [aria-current]{color:var(--ink);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:14rem}
.eyebrow{margin:0 0 .3rem;font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.pdfv-head{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.25rem}
.pdfv-head h1{margin:0}
.pdfv-sub{margin:.4rem 0 0;color:var(--muted)}
/* Phones: Download is a full-width primary, Print sits beside it */
.pdfv-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem}
.pdfv-actions[hidden]{display:none}
.pdfv-pages{display:grid;gap:1rem;justify-items:center;margin:0 calc(var(--gutter) * -.5)}
.pdfv-sheet{width:100%;max-width:52rem;margin:0}
.pdfv-page{position:relative;width:100%;margin:0;background:#fff;border:1px solid var(--line);border-radius:4px;box-shadow:var(--shadow-md);overflow:hidden}
.pdfv-page canvas{display:block;width:100%;height:auto}
.pdfv-page.is-loading{background:linear-gradient(100deg,var(--alt) 30%,var(--card) 50%,var(--alt) 70%);background-size:300% 100%;animation:pdfv-shimmer 1.4s ease infinite}
.pdfv-page.is-loading:not([style]){aspect-ratio:8.5/11}
.pdfv-pagenum{margin:.45rem 0 0;text-align:center;font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.pdfv-error{justify-self:stretch;margin:0 calc(var(--gutter) * .5)}
@keyframes pdfv-shimmer{from{background-position:100% 0}to{background-position:-100% 0}}

/* ---------- Larger phones / small tablets ---------- */
@media (min-width:36rem){
:root{--gutter:1.25rem}
.grid{grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1rem}
ul.events>li>span.when{display:inline-block;min-width:7.5rem;margin:0}
dl.contacts{grid-template-columns:minmax(11rem,15rem) minmax(0,1fr)}
dl.contacts dt,dl.contacts dd{padding:.85rem 1.15rem;border-top:1px solid var(--line)}
dl.contacts dt:first-of-type,dl.contacts dt:first-of-type+dd{border-top:0}
.pdfv-pages{margin:0;gap:1.5rem}
.pdfv-page{border-radius:6px}
.pdfv-error{margin:0}
.crumbs [aria-current]{max-width:none}
}

/* ---------- Tablets and up ---------- */
@media (min-width:48rem){
.brand{font-size:1.3rem}
.brand::before{width:2.5rem;height:2.5rem;border-radius:10px;font-size:1.65rem;background:linear-gradient(var(--hi),var(--hi)) right 6px top 6px/6px 6px no-repeat,var(--accent)}
.brand small{font-size:.66rem;letter-spacing:.1em}
nav.main{margin:0;overflow:visible;background:none}
nav.main ul{padding:0 0 .6rem;width:auto;min-width:0;flex-wrap:wrap;gap:.25rem}
nav.main a{min-height:44px;padding:0 .85rem;border-radius:6px;transition:background-color .15s ease,color .15s ease}
nav.main a:hover{background:var(--alt)}
nav.main a[aria-current=page]{background:var(--accent-soft)}
nav.main a[aria-current=page]::after{display:none}
main{padding-top:2rem;padding-bottom:3rem}
h1{font-size:2.25rem;margin-bottom:.75rem}
h2{font-size:1.5rem;margin-top:2.25rem;margin-bottom:.6rem}
.lead{font-size:1.125rem}
.card,.docset{padding:1.25rem 1.35rem}
.card h2{font-size:1.3rem}
.card .when{font-size:1.35rem}
.tel{font-size:1.5rem}
ul.events{gap:.6rem}
ul.events>li{padding:1rem 1.25rem}
ul.events h3{font-size:1.3rem}
.docset h2{font-size:1.35rem}
footer.site{padding:1.5rem 0 2.5rem}
.btn{min-height:44px;font-size:.95rem}
.pdfv-head{flex-direction:row;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem 2rem;margin-bottom:1.5rem}
.pdfv-actions{display:flex;flex-wrap:wrap}
}

/* ---------- Desktop: brand and nav share one row ---------- */
@media (min-width:60rem){
header.site .wrap{flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:1.5rem;padding-top:.85rem;padding-bottom:.85rem}
.brand small{white-space:nowrap}
nav.main ul{padding-bottom:0}
}

/* Hover lift only where there is a real pointer */
@media (hover:hover) and (min-width:48rem){
ul.events>li{transition:transform .18s ease,box-shadow .18s ease}
ul.events>li:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
}
@media (prefers-reduced-motion:reduce){.pdfv-page.is-loading{animation:none}ul.events>li,ul.events>li:hover{transition:none;transform:none}}

@media print{header.site nav,.skip,.crumbs,.pdfv-actions,.pdfv-pagenum,.pdfv-status{display:none}html{background:#fff;color:#000}header.site{background:none;border:0}.brand{color:#000}.brand::before{display:none}a{color:#000}a[href^="http"]::after{content:" (" attr(href) ")";font-size:.8em}.card,.docset,ul.events>li,dl.contacts{box-shadow:none;break-inside:avoid}.help{background:none;color:#000;border:1px solid #000}.help *{color:#000}body:has(.pdfv) header.site,body:has(.pdfv) footer.site{display:none}.pdfv{padding:0}.pdfv-head{display:none}.pdfv-pages{display:block;margin:0}.pdfv-sheet{max-width:none;break-after:page}.pdfv-page{border:0;box-shadow:none;border-radius:0}}
