/* Real archival imagery remains in full color; solid panels carry the record. */
html{background:#162b34}
body{background:transparent;isolation:isolate}
[hidden]{display:none!important}
.site-backdrop{position:fixed;inset:0;z-index:-1;display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:36vh;overflow:hidden;background:#19313c;pointer-events:none}
.site-backdrop img{width:100%;height:100%;object-fit:cover;opacity:1}
.site-backdrop img:nth-child(even){object-position:70% 50%}
.site-backdrop:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0f263126,transparent 28%,transparent 72%,#0f263126)}
.topline{background:#172e39;color:#f5e8cf;border-bottom:3px solid #c7a268}
.page-width{width:min(1440px,calc(100% - 72px))}
.masthead{background:#fbf8ef;padding:22px 28px;border:1px solid #d2bea0;border-top:0;box-shadow:0 8px 25px #08131b24}
.masthead nav{gap:25px}
.brand{font-size:23px}.nav-link{font-size:13px}
.nav-count{display:inline-block!important;border-radius:3px;background:#e9ddc7;padding:2px 6px;margin-left:5px!important;font-size:10px;color:#613d30}
.era-mural{display:grid;grid-template-columns:repeat(var(--scene-count,6),minmax(0,1fr));gap:5px;height:174px;margin:16px auto 0;padding:5px;background:#c1a478;box-shadow:0 8px 25px #08131b38}
.era-mural figure{margin:0;min-width:0;position:relative;overflow:hidden;background:#172e39}
.era-mural img{width:100%;height:100%;object-fit:cover;display:block}
.era-mural figcaption{position:absolute;bottom:8px;left:8px;right:8px;width:fit-content;background:#14242de8;color:#fff4df;padding:4px 7px;font-size:9px;font-weight:600;letter-spacing:.4px;line-height:1.5}
.archive-strip{padding:20px 28px;margin-top:16px;background:#fbf8ef;border:1px solid #d2bea0;gap:32px;box-shadow:0 8px 25px #08131b24}
.archive-strip>div{gap:12px}.archive-strip>p{font-size:10px;max-width:240px;line-height:1.7}
.archive-strip strong{font-size:38px}.archive-strip>div span{font-size:10px}
.milestone-stat{display:flex;align-items:center;gap:12px;text-align:left;border:0;border-left:1px solid #c8b99d;padding:3px 18px;background:#eee4d1;border-radius:3px;margin-left:2px}
.milestone-stat>span{font-size:10px;line-height:1.45;letter-spacing:.6px;text-transform:uppercase;max-width:112px}
.milestone-stat small{display:block;font-size:10px;letter-spacing:0;text-transform:none;color:#813d32;margin-top:5px;font-weight:650}
.milestone-stat:hover,.milestone-stat:focus-visible{background:#813d32;color:#fff8e8}.milestone-stat:hover small,.milestone-stat:focus-visible small{color:#fff8e8}
.directory{margin-top:16px;padding:29px 28px 12px;background:#fbf8ef;border:1px solid #d2bea0;box-shadow:0 15px 45px #08131b45;scroll-margin-top:16px}
.directory-intro{margin-bottom:22px}.directory-intro h1{font:400 39px/1.15 var(--serif);letter-spacing:-.4px;margin:0}
.collection-tabs{display:flex;gap:0;border:1px solid #c5b18c;background:#eee7d8;margin-bottom:28px;max-width:700px}
.collection-tab{flex:1;min-width:0;text-align:left;border:0;padding:14px 20px;color:#5a5c50;background:transparent}
.collection-tab+button{border-left:1px solid #c5b18c}.collection-tab>span{display:block;font-size:15px;font-weight:650;line-height:1.4}
.collection-tab small{display:block;font-size:11px;margin-top:4px;line-height:1.5;opacity:.85}
.collection-tab b{font-size:11px;background:#f8f1e5;padding:2px 7px;border-radius:3px;margin-left:5px;color:#813d32}
.collection-tab.active{background:#813d32;color:#fff8e9}.collection-tab:hover:not(.active){background:#e4d6bf}
.collection-tab.active b{background:#fff4df;color:#813d32}
.milestone-intro{font-size:13px;line-height:1.8;color:#5f685a;max-width:790px;margin:-8px 0 27px}
.archive-layout{gap:28px;grid-template-columns:192px minmax(0,1fr) 206px}
.year-sidebar{padding-right:23px}.year-select{background:#fffdf6}.search-row{background:#fffdf7}
.year-heading{position:relative;isolation:isolate;overflow:hidden;min-height:225px;padding:24px 20px;align-items:flex-end;gap:16px;background:#21373c}
.year-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.year-heading:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#081c2bb8,transparent 80%)}
.year-heading-copy{padding:12px 15px 8px;background:#102a37c9;border-left:3px solid #d6b77a;max-width:calc(100% - 70px)}
.year-heading .eyebrow{color:#f2ddb6;font-size:9px;line-height:1.7}
.year-heading h2{color:#fff8eb;font-size:62px;line-height:1.12;margin:3px 0 6px}
.year-heading .year-label{color:#f3e8d3;border-color:#d6c3a07a;font-size:10px;line-height:1.6;max-width:130px}
.year-arrows{position:relative;align-self:flex-end;gap:5px}.year-arrows .square-button{background:#fbf5e8;color:#1c343e;border-color:#fbf5e8;min-width:32px;width:32px;height:34px;min-height:34px}
.scene-caption{display:flex;gap:12px;align-items:center;justify-content:space-between;background:#eadfc9;padding:8px 10px;color:#565d51;font-size:10px;line-height:1.5}
.scene-caption>span{min-width:0}.scene-caption .text-link{font-size:9px;white-space:nowrap;color:#813d32;gap:3px}
.context-card{border-color:#cbb797;background:#ede4d3;border-top:4px solid #813d32}.context-card>p{color:#5f6858}
.record{background:#fffdf729;padding-inline:6px}.record:hover{background:#f0e7d6}.record-title{font-size:28px}
.record-conflict{color:#6c7466}.record-tag{color:#6c735f}.record-location{color:#5b6656}
.research-note{background:#eae2d0;border-color:#b19a71}.outline-button{background:#fffdf5}.outline-button:hover{background:#e9dfc9}
.milestones-mode .year-heading h2{font-size:clamp(34px,3.6vw,54px)!important}.milestones-mode .year-heading-line{display:block}.milestones-mode .year-label{border:0;padding:0;max-width:none}
.milestones-mode .record-type.development{color:#4b6949}.milestones-mode .record{border-left:3px solid #c2ab7b;padding-left:12px;margin-top:6px;border-bottom-color:#d6c8af}
.site-footer{background:#fbf8ef;padding:23px 28px;margin-top:16px;border:1px solid #d2bea0}.site-footer p{color:#626c5b}.footer-links{display:flex;gap:18px;flex-wrap:wrap}.footer-links .text-link{white-space:nowrap}
.imagery-notice{background:#172e39;color:#e6ddcb;padding:12px 20px;margin-block:0 22px;font-size:10px;line-height:1.7}
.image-credits-dialog{max-width:850px}.image-credits-dialog h2{font:400 43px/1.1 var(--serif);margin:12px 0 20px}.image-credits-dialog>p{font-size:13px;line-height:1.8;color:#606b59}
.image-credit{display:grid;grid-template-columns:155px minmax(0,1fr);gap:18px;border-top:1px solid #d4c8b3;padding:18px 0}.image-credit img{width:155px;height:105px;object-fit:cover}.image-credit h3{font:400 24px/1.2 var(--serif);margin:0 0 6px}.image-credit p{font-size:12px;line-height:1.7;margin:4px 0;color:#5e6957}.image-credit a{font-size:11px;color:#813d32;text-underline-offset:3px}.image-credit-links{display:flex;gap:14px;flex-wrap:wrap}.image-credit .rights-label{font-size:10px;text-transform:uppercase;letter-spacing:.7px;font-weight:650;color:#4b6949}
@media(min-width:1500px){.archive-layout{grid-template-columns:210px minmax(0,1fr) 228px;gap:34px}.year-heading{min-height:260px}.year-heading h2{font-size:72px}.era-mural{height:190px}}
@media(max-width:1150px){.archive-layout{grid-template-columns:172px minmax(0,1fr);gap:24px}.masthead{padding:20px}.masthead nav{gap:19px}.archive-strip{gap:20px;padding:20px}.archive-strip>p{display:none}.directory{padding:25px 22px 10px}.year-sidebar{padding-right:18px}.era-mural{height:150px}.era-mural figcaption{font-size:8px;left:5px;bottom:5px;right:5px;padding:3px 5px}.year-heading{min-height:230px}}
@media(max-width:760px){
 .page-width{width:calc(100% - 24px)}.topline{padding:8px 12px;font-size:7px}.masthead{padding:18px 16px}.brand{font-size:21px}.masthead nav{gap:8px;padding-top:12px}.nav-link{font-size:11px}.nav-count{font-size:9px;padding:1px 4px}.header-search{padding:5px}
 .era-mural{height:auto;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:100px;gap:4px;padding:4px;margin-top:12px}.era-mural figure:last-child:nth-child(3n+1){grid-column:1/-1}.era-mural figcaption{font-size:8px}
 .archive-strip{margin-top:12px;display:grid;grid-template-columns:1fr 1.3fr;gap:14px 12px;padding:17px 15px}.archive-strip>div{gap:8px}.archive-strip strong{font-size:32px}.archive-strip>div span{font-size:8px;max-width:76px}.milestone-stat{grid-column:1/-1;padding:12px 15px;margin:0;border-left:3px solid #813d32;gap:15px}.milestone-stat>span{max-width:none;font-size:11px}.milestone-stat small{display:inline;margin-left:12px;font-size:11px}
 .directory{margin-top:12px;padding:22px 15px 7px}.directory-intro{align-items:center;gap:12px;margin-bottom:18px}.directory-intro h1{font-size:32px}.directory-intro .eyebrow{font-size:8px}.collection-tabs{margin-bottom:22px}.collection-tab{padding:12px 11px}.collection-tab>span{font-size:13px}.collection-tab small{font-size:10px}.collection-tab b{font-size:10px;margin-left:2px;padding:1px 4px}.milestone-intro{font-size:12px;margin-bottom:20px}
 .archive-layout{grid-template-columns:1fr;gap:21px}.year-sidebar{padding:0 0 18px}.year-grid{grid-template-columns:repeat(6,1fr)}.year-cell{font-size:12px}.year-heading{min-height:205px;padding:17px 12px;gap:7px}.year-heading-copy{padding:11px;max-width:calc(100% - 65px)}.year-heading h2{font-size:57px}.year-heading-line{gap:12px}.year-heading .year-label{font-size:9px;max-width:105px}.year-heading .eyebrow{font-size:8px}.year-arrows{gap:4px}.year-arrows .square-button{min-width:28px;width:28px;min-height:32px;height:32px}.scene-caption{font-size:9px;gap:8px}.scene-caption .text-link{font-size:9px}.milestones-mode .year-heading h2{font-size:41px!important}
 .record{padding-inline:0}.record-title{font-size:25px}.record-type,.record-conflict{font-size:9px}.site-footer{padding:20px 16px;margin-top:12px}.footer-links{gap:18px;margin-top:8px}.imagery-notice{font-size:9px;padding:12px 15px}.image-credits-dialog{padding:32px 20px 20px}.image-credits-dialog h2{font-size:35px}.image-credit{grid-template-columns:1fr;gap:10px}.image-credit img{width:100%;height:155px}.image-credit h3{font-size:25px}
}
@media(prefers-reduced-motion:reduce){.site-backdrop{position:absolute;min-height:100vh}html{scroll-behavior:auto}}

/* Service colors above the navigation, with the original flags kept proportional. */
.masthead{position:relative;isolation:isolate;align-items:flex-end;padding:clamp(144px,14vw,196px) 24px 18px;background:#132e43;border-color:#c3a67c}
.service-flags{position:absolute;inset:0;z-index:-1;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-content:start;gap:4px;padding:8px;pointer-events:none}
.service-flag{min-width:0;aspect-ratio:1.2692;display:grid;place-items:center;background:var(--flag-color);box-shadow:0 2px 8px #0002}
.service-flag img{display:block;width:100%;height:100%;object-fit:contain}
.masthead .brand,.masthead nav,.masthead .header-search{background:#fffaf1fa;border:1px solid #c5b18c;box-shadow:0 4px 12px #08131b33}
.masthead .brand{padding:8px 14px;font-size:24px;flex-shrink:0}
.masthead nav{padding:10px 16px;min-height:48px;gap:24px}
.masthead .header-search{width:46px;height:48px;padding:0;justify-content:center;align-items:center;margin-left:0;flex-shrink:0}
.masthead a:focus-visible,.masthead button:focus-visible,.archive-strip button:focus-visible{outline:2px solid #813d32;outline-offset:3px;box-shadow:0 0 0 7px #fff9ec}

/* A stars-and-stripes theme carries the overview statistics. */
.archive-strip{position:relative;isolation:isolate;padding:22px 24px;gap:24px;background:repeating-linear-gradient(180deg,#ab2839 0 12px,#fff8e9 12px 24px);border-color:#d4c2a4}
.archive-strip:before{content:'';position:absolute;inset:0 auto 0 0;width:24%;z-index:-1;background:#183354 url('assets/flags/united-states.svg') left top/250% auto no-repeat;pointer-events:none}
.archive-strip>div,.archive-strip>p{background:#fffaf1fa;border:1px solid #c9b796;padding:10px 14px;box-shadow:0 3px 10px #14242d26}
.archive-strip>p{color:#5e685c;font-size:10px;max-width:255px}
.archive-strip .milestone-stat{background:#fffaf1fa;border:1px solid #c9b796;border-left:3px solid #813d32;padding:10px 16px;box-shadow:0 3px 10px #14242d26}
.archive-strip .milestone-stat:hover,.archive-strip .milestone-stat:focus-visible{background:#813d32;color:#fff8e8}

/* Gettysburg artwork fills the directory; cream panels carry its historical text. */
.directory{background:#635640 url('assets/military/gettysburg-1887.webp') center top/100% auto repeat-y;border-color:#c5ae88;padding-top:26px}
.directory-intro{min-height:95px;align-items:flex-start;margin-bottom:18px}
.directory-intro>div{background:#fffaf1fa;padding:13px 19px;border:1px solid #c8b592;box-shadow:0 4px 14px #1a180e26}
.directory-intro>.outline-button{margin-top:12px;background:#fffaf1fa;border-color:#c8b592}
.collection-tabs{box-shadow:0 4px 14px #1a180e26}
.milestone-intro{background:#fffaf1fa;border:1px solid #c8b592;padding:13px 18px;margin:0 0 24px}
.archive-layout{gap:22px;grid-template-columns:192px minmax(0,1fr) 206px;align-items:start}
.year-sidebar{background:#fffaf1fa;border:1px solid #c8b592;padding:20px 15px}
.year-sidebar .year-select{font-size:12px;padding:10px 8px}
.records-column{min-width:0;background:#fffaf1fa;border:1px solid #c8b592;padding:20px 17px 0}
.context-sidebar{background:#fffaf1fa;border:1px solid #c8b592;padding:15px}
.context-card{padding:17px 12px}.context-card h3{font-size:27px}.context-card>p{font-size:12px}
.record{background:transparent}.record:hover{background:#f0e7d6}
.year-research{background:#f0f0e6}.research-desk{margin-top:24px}.archive-number{padding-top:23px;padding-bottom:10px}
.flag-credit img{object-fit:contain;background:#e9e4da;padding:5px}
@media(min-width:1500px){.archive-layout{grid-template-columns:210px minmax(0,1fr) 228px;gap:26px}}
@media(max-width:1150px){.archive-layout{grid-template-columns:172px minmax(0,1fr);gap:20px}.year-sidebar{padding:17px 13px}.records-column{padding:18px 16px 0}.archive-strip{gap:18px;padding:20px}.archive-strip>div{padding:10px}.masthead nav{gap:18px;padding:10px 13px}.context-sidebar{display:none}}
@media(max-width:1000px){.masthead{flex-wrap:wrap;gap:12px}.masthead nav{order:3;flex-basis:100%;margin-left:0;justify-content:space-between}.masthead .header-search{margin-left:auto}.archive-strip{gap:16px}.archive-strip>div{gap:8px}.archive-strip strong{font-size:34px}.archive-strip .milestone-stat{padding:10px 12px}}
@media(max-width:760px){
 .masthead{padding:216px 14px 16px;gap:12px}.service-flags{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,95px);gap:4px;padding:8px}.service-flag{aspect-ratio:auto;min-height:0}.masthead .brand{font-size:22px;padding:8px 11px}.masthead nav{min-height:43px;padding:8px 11px;gap:8px}.masthead .header-search{width:40px;height:43px}.masthead .nav-link{font-size:11px}
 .archive-strip{padding:18px 13px;gap:12px 9px;grid-template-columns:1fr 1.15fr}.archive-strip>div{padding:11px 9px;gap:7px}.archive-strip strong{font-size:32px}.archive-strip>div span{letter-spacing:.6px;font-size:8px}.archive-strip .milestone-stat{padding:11px 13px;gap:12px}.archive-strip .milestone-stat>span{font-size:10px}.archive-strip .milestone-stat small{font-size:10px;margin-left:9px}.archive-strip:before{width:35%}
 .directory{padding:20px 13px 8px;background-size:auto 720px}.directory-intro{min-height:85px;gap:9px;margin-bottom:17px}.directory-intro>div{padding:11px 12px}.directory-intro h1{font-size:29px}.directory-intro>.outline-button{margin-top:10px;flex-shrink:0}.collection-tabs{margin-bottom:20px}.collection-tab{padding:12px 10px}.milestone-intro{padding:12px 14px;margin-bottom:20px}
 .archive-layout{grid-template-columns:1fr;gap:17px}.year-sidebar{padding:17px 12px;grid-template-columns:1fr}.year-sidebar .field-label,.year-sidebar .year-select{grid-column:1/-1}.year-sidebar .year-select{font-size:14px}.year-sidebar .block-controls{grid-column:1/-1;grid-row:auto;margin-top:12px}.records-column{padding:16px 12px 0}.search-row{margin-bottom:18px}.record{grid-template-columns:38px minmax(0,1fr) 13px;gap:8px}.record-title{font-size:25px}.results-meta{gap:7px}.record-pagination{gap:5px}.record-pagination .outline-button{font-size:9px;padding:7px 5px}.record-page-label{font-size:8px}
}
@media(max-width:360px){.masthead .brand{font-size:20px}.masthead nav{padding-inline:9px}.masthead .nav-link{font-size:10px}.nav-count{margin-left:2px!important}.archive-strip>div{padding:10px 7px;gap:5px}.archive-strip strong{font-size:29px}.archive-strip>div span{font-size:7px}.archive-strip .milestone-stat small{display:block;margin:4px 0 0}.directory-intro h1{font-size:26px}.collection-tab>span{font-size:12px}.collection-tab small{font-size:9px}.year-heading{padding-inline:10px}.year-heading h2{font-size:49px}.year-heading-copy{padding:9px;max-width:calc(100% - 60px)}.year-heading .year-label{font-size:8px}.scene-caption{align-items:flex-start;flex-direction:column;gap:4px}}
