:root { --navy:#101a2b; --navy-2:#172338; --ink:#182337; --paper:#f4f0e8; --paper-2:#ebe5da; --white:#fffdf8; --brass:#c99b52; --brass-light:#e0be7d; --muted:#758092; --line:rgba(24,35,55,.16); --green:#3a755b; --red:#a04e45; --shadow:0 22px 60px rgba(12,21,37,.16); --sans:"Manrope", system-ui, sans-serif; --mono:"DM Mono", monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.55; }
a { color:inherit; }
button, input, select { font:inherit; }
button, a, input, select { outline-color:var(--brass); outline-offset:3px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-header { min-height:76px; padding:0 clamp(22px,5vw,76px); display:flex; align-items:center; justify-content:space-between; background:var(--navy); color:var(--paper); border-bottom:1px solid rgba(201,155,82,.35); }
.brand { display:inline-flex; gap:11px; align-items:center; color:var(--paper); text-decoration:none; font-weight:800; letter-spacing:-.02em; }
.brand-mark { display:inline-grid; place-items:center; width:24px; height:24px; color:var(--brass); border:1px solid var(--brass); font-family:var(--mono); font-weight:400; line-height:1; }
.site-header nav { display:flex; gap:clamp(16px,3vw,38px); align-items:center; font-size:13px; color:#dce0e6; }
.site-header nav a { text-decoration:none; }.site-header nav a:hover { color:var(--brass-light); }.site-header .header-link { color:var(--brass-light); }
main { overflow:hidden; }
.hero-shell { min-height:480px; padding:clamp(62px,9vw,126px) clamp(22px,8vw,124px) clamp(66px,8vw,108px); display:grid; grid-template-columns:minmax(0,1.35fr) minmax(250px,.65fr); gap:clamp(40px,10vw,170px); color:var(--paper); background:var(--navy); position:relative; }
.hero-shell:after { content:""; position:absolute; inset:auto 0 0; height:1px; background:linear-gradient(90deg,transparent,var(--brass),transparent); opacity:.65; }
.overline { margin:0 0 15px; color:var(--brass); font-family:var(--mono); text-transform:uppercase; letter-spacing:.13em; font-size:11px; line-height:1.4; }.overline span { margin-left:14px; color:#acb7c7; }
h1,h2,h3,h4,p { margin-top:0; }.hero-copy h1 { max-width:850px; margin:0 0 27px; font-size:clamp(39px,5.4vw,79px); line-height:1.04; letter-spacing:-.065em; font-weight:700; }.hero-copy h1 em,h2 em { color:var(--brass-light); font-style:normal; }
.hero-intro { max-width:570px; margin-bottom:29px; color:#d2d9e1; font-size:clamp(16px,1.5vw,20px); line-height:1.55; }.update-strip { display:inline-flex; align-items:center; gap:10px; padding:10px 13px; border:1px solid rgba(201,155,82,.36); color:#bcc7d4; font-family:var(--mono); font-size:11px; }.update-strip strong { color:var(--paper); font-weight:500; }.status-dot { width:7px; height:7px; background:var(--brass); border-radius:50%; box-shadow:0 0 0 4px rgba(201,155,82,.12); }
.hero-note { align-self:end; max-width:310px; padding-bottom:6px; color:#c5ceda; font-size:14px; }.note-rule { width:46px; height:2px; margin-bottom:20px; background:var(--brass); }.note-label { margin-bottom:12px; color:var(--brass-light); font-family:var(--mono); letter-spacing:.13em; font-size:11px; }.hero-note p:last-child { margin:0; }
.search-panel { padding:clamp(38px,6vw,82px) clamp(22px,8vw,124px) clamp(44px,6vw,76px); background:var(--paper-2); border-bottom:1px solid var(--line); }.section-heading h2,.results-bar h2 { margin-bottom:9px; font-size:clamp(28px,3.3vw,44px); letter-spacing:-.05em; line-height:1.05; }.section-heading > p:last-child { color:var(--muted); margin-bottom:28px; }.search-form { max-width:1060px; }.search-field { min-height:74px; display:flex; align-items:center; gap:13px; padding:0 17px; background:var(--white); border:1px solid rgba(24,35,55,.32); box-shadow:0 8px 22px rgba(24,35,55,.05); }.search-field:focus-within { border-color:var(--brass); box-shadow:0 0 0 4px rgba(201,155,82,.18); }.search-icon { color:var(--brass); font-size:31px; transform:translateY(-2px); }.search-field input { min-width:0; flex:1; border:0; outline:0; background:transparent; color:var(--ink); font-size:18px; }.search-field input::placeholder { color:#9299a4; }.clear-button { border:0; background:transparent; color:var(--muted); cursor:pointer; font-size:12px; }.filters { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:16px; }.filters label { display:grid; gap:7px; color:var(--muted); font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; }.filters select { min-height:47px; padding:0 12px; border:1px solid var(--line); background:transparent; color:var(--ink); font-family:var(--sans); text-transform:none; letter-spacing:0; font-size:13px; cursor:pointer; }
.results-section { padding:clamp(45px,6vw,86px) clamp(22px,8vw,124px) 20px; }.results-bar { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:25px; }.results-bar h2 { margin-bottom:0; }.result-count { color:var(--muted); font-family:var(--mono); font-size:12px; }.results-list { display:grid; gap:12px; max-width:1190px; }.result-card { padding:21px 22px 18px; background:var(--white); border:1px solid var(--line); transition:border-color .2s, transform .2s, box-shadow .2s; }.result-card:hover,.result-card.is-selected { border-color:rgba(201,155,82,.85); box-shadow:var(--shadow); transform:translateY(-2px); }.result-topline,.result-bottom { display:flex; align-items:center; gap:12px; color:var(--muted); font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }.result-topline span+span:before { content:"/"; margin-right:12px; color:var(--brass); }.result-main { display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px; padding:20px 0 19px; }.result-main h3 { margin-bottom:5px; font-size:clamp(19px,2.3vw,27px); letter-spacing:-.04em; }.result-alias { margin:0; min-height:20px; color:var(--muted); font-size:13px; }.result-base { min-width:190px; padding-left:20px; border-left:1px solid var(--line); }.base-label { display:block; margin-bottom:4px; color:var(--muted); font-family:var(--mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }.result-base strong { display:block; color:var(--navy); font-size:clamp(20px,2.6vw,31px); letter-spacing:-.06em; line-height:1.05; }.result-bottom { justify-content:flex-start; padding-top:16px; border-top:1px solid var(--line); }.status-chip { display:inline-flex; align-items:center; min-height:27px; padding:4px 9px; border:1px solid var(--line); color:var(--ink); font-family:var(--mono); font-size:10px; line-height:1.2; letter-spacing:.04em; }.status-chip.official { border-color:rgba(58,117,91,.42); color:var(--green); background:rgba(58,117,91,.07); }.status-chip.event { border-color:rgba(201,155,82,.7); color:#8f681f; background:rgba(201,155,82,.1); }.status-chip.legacy { border-color:rgba(126,93,59,.4); color:#7e5d3b; background:rgba(126,93,59,.07); }.status-chip.unresolved { border-color:rgba(160,78,69,.5); color:var(--red); background:rgba(160,78,69,.06); }.verified-date { white-space:nowrap; }.view-button { margin-left:auto; border:0; background:transparent; color:var(--ink); cursor:pointer; font-size:13px; font-weight:700; }.view-button span,.text-link span { color:var(--brass); margin-left:6px; }.view-button:hover { color:var(--brass); }
.empty-state,.load-error { max-width:640px; padding:42px 30px; border:1px dashed var(--line); background:rgba(255,253,248,.55); }.empty-mark { display:grid; place-items:center; width:35px; height:35px; margin-bottom:19px; border:1px solid var(--brass); color:var(--brass); font-family:var(--mono); }.empty-state h3 { margin-bottom:7px; font-size:22px; }.empty-state p { color:var(--muted); }.button { min-height:45px; padding:0 17px; border:1px solid var(--ink); background:var(--ink); color:var(--paper); cursor:pointer; font-weight:700; }.button-secondary { background:transparent; color:var(--ink); }.button:hover { border-color:var(--brass); }
.detail-section { margin:38px clamp(22px,8vw,124px) 0; padding:clamp(27px,5vw,68px); background:var(--navy-2); color:var(--paper); border-top:2px solid var(--brass); scroll-margin-top:20px; }.detail-placeholder { max-width:530px; padding:20px 0 36px; }.detail-placeholder h2 { margin-bottom:12px; color:var(--paper); font-size:clamp(28px,4vw,47px); line-height:1.05; letter-spacing:-.06em; }.detail-placeholder p:last-child { color:#bec8d5; }.detail-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.62fr); gap:clamp(30px,7vw,100px); }.detail-kicker { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:22px; color:#adbacb; font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.07em; }.detail-copy h2 { margin:0 0 15px; color:var(--paper); font-size:clamp(34px,5vw,64px); letter-spacing:-.065em; line-height:.98; }.detail-lead { max-width:630px; color:#d0d7df; font-size:17px; }.detail-facts { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:29px 0; padding:17px 0; border-top:1px solid rgba(244,240,232,.17); border-bottom:1px solid rgba(244,240,232,.17); }.detail-facts span,.detail-notes span { display:block; margin-bottom:6px; color:var(--brass-light); font-family:var(--mono); text-transform:uppercase; letter-spacing:.07em; font-size:10px; }.detail-facts strong { display:block; color:var(--paper); font-size:13px; line-height:1.35; }.detail-note { display:flex; gap:13px; padding:17px; background:rgba(255,255,255,.06); border-left:2px solid var(--brass); color:#d7dde5; font-size:13px; }.note-icon { flex:0 0 22px; display:grid; place-items:center; width:22px; height:22px; border:1px solid var(--brass); color:var(--brass); font-family:var(--mono); }.detail-note p { margin:0; }.detail-note strong { color:var(--paper); }.detail-note a { display:inline-block; margin-top:8px; color:var(--brass-light); font-weight:700; }.detail-note small { display:block; margin-top:8px; color:#aeb9c6; font-family:var(--mono); font-size:10px; }.detail-notes { display:grid; grid-template-columns:1fr 1fr; gap:19px; margin-top:29px; }.detail-notes > div { padding-top:15px; border-top:1px solid rgba(244,240,232,.17); }.detail-notes p { margin:0; color:#c3ccd7; font-size:13px; }.detail-visual { align-self:start; }.diagram-frame { padding:20px; background:var(--paper); color:var(--ink); }.diagram-caption { display:block; color:var(--muted); font-family:var(--mono); font-size:10px; letter-spacing:.1em; }.diagram { min-height:260px; display:grid; place-items:center; position:relative; margin:17px 0; overflow:hidden; background:radial-gradient(circle at 50% 50%,#fffdf8 0,#ebe5da 100%); border:1px solid rgba(24,35,55,.12); }.diagram:before,.diagram:after { content:""; position:absolute; background:var(--brass); opacity:.65; }.diagram-round:before { top:26px; bottom:26px; width:1px; }.diagram-round:after { left:26px; right:26px; height:1px; }.round-shape { width:150px; height:150px; border:2px solid var(--navy); border-radius:50%; background:rgba(201,155,82,.13); }.diagram-round.oval .round-shape { width:185px; height:125px; }.diagram-round.oval:before { top:68px; bottom:68px; }.diagram-round.oval:after { left:38px; right:38px; }.diagram-rect:before { top:38px; bottom:38px; width:1px; }.diagram-rect:after { left:44px; right:44px; height:1px; }.rect-shape { width:184px; height:78px; border:2px solid var(--navy); background:rgba(201,155,82,.13); }.diagram-rect:not(.compact) .rect-shape { width:184px; }.dimension-label { position:absolute; right:13px; bottom:13px; color:var(--navy); font-family:var(--mono); font-size:10px; }.diagram-round .dimension-label { right:14px; bottom:12px; }.diagram-footer { display:flex; justify-content:space-between; gap:10px; color:var(--muted); font-family:var(--mono); font-size:10px; }.diagram-footer span:first-child { color:var(--ink); }.diagram-none { min-height:260px; }.diagram-hull { display:grid; place-items:center; width:160px; height:80px; border:2px solid var(--navy); border-radius:22px 22px 8px 8px; color:var(--navy); font-family:var(--mono); font-size:12px; }.diagram-none small,.diagram-flying small { position:absolute; bottom:17px; color:var(--muted); font-family:var(--mono); font-size:10px; }.diagram-flying .flying-stem { width:1px; height:113px; background:var(--navy); }.diagram-flying .flying-disc { position:absolute; top:139px; width:92px; height:30px; border:2px solid var(--navy); border-radius:50%; background:rgba(201,155,82,.13); }
.acquisition-section { display:grid; grid-template-columns:minmax(220px,.65fr) minmax(0,1fr); gap:clamp(28px,8vw,110px); padding-top:56px; margin-top:52px; border-top:1px solid rgba(244,240,232,.17); }.acquisition-section h3 { margin-bottom:11px; color:var(--paper); font-size:clamp(23px,3vw,35px); line-height:1.05; letter-spacing:-.05em; }.acquisition-intro { color:#aeb9c6; font-size:13px; }.acquisition-group + .acquisition-group { margin-top:18px; }.acquisition-heading { display:flex; align-items:baseline; justify-content:space-between; gap:10px; border-bottom:1px solid rgba(244,240,232,.16); }.acquisition-heading h4 { margin:0 0 9px; color:var(--brass-light); font-size:13px; }.acquisition-heading span { color:#9ba8b7; font-family:var(--mono); font-size:10px; }.acquisition-link { display:flex; justify-content:space-between; gap:15px; align-items:center; padding:13px 0; border-bottom:1px solid rgba(244,240,232,.11); text-decoration:none; }.acquisition-link strong { display:block; color:var(--paper); font-size:13px; }.acquisition-link small { display:block; margin-top:3px; color:#aeb9c6; font-size:11px; }.acquisition-link:hover strong { color:var(--brass-light); }.link-arrow { color:var(--brass); }.muted-note { color:#aeb9c6; font-size:13px; }.verification-row { display:flex; flex-wrap:wrap; gap:16px 28px; margin-top:39px; padding-top:17px; border-top:1px solid rgba(244,240,232,.17); color:#9ba8b7; font-family:var(--mono); font-size:10px; }.verification-row strong { color:var(--paper); font-weight:400; }.verification-row a { margin-left:auto; color:var(--brass-light); text-decoration:none; }
.about-section { display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,10vw,160px); padding:clamp(72px,10vw,145px) clamp(22px,8vw,124px); }.about-section h2 { margin:0; font-size:clamp(32px,4.8vw,66px); line-height:1; letter-spacing:-.065em; }.about-copy { align-self:end; max-width:510px; color:var(--muted); font-size:17px; }.text-link { display:inline-block; margin-top:17px; color:var(--ink); font-size:13px; font-weight:800; text-decoration:none; border-bottom:1px solid var(--brass); }.site-footer { display:grid; grid-template-columns:1fr minmax(250px,1.8fr) auto; gap:20px; align-items:center; padding:28px clamp(22px,8vw,124px); background:var(--navy); color:#aeb9c6; font-size:11px; }.site-footer > div { color:var(--paper); font-weight:800; }.site-footer .brand-mark { margin-right:8px; vertical-align:middle; }.site-footer p { margin:0; max-width:570px; line-height:1.5; }.site-footer > span { font-family:var(--mono); font-size:10px; white-space:nowrap; }
@media (max-width:800px) { .site-header { min-height:66px; }.site-header nav a:not(.header-link) { display:none; }.site-header nav { gap:0; font-size:12px; }.hero-shell { min-height:auto; grid-template-columns:1fr; gap:43px; padding-top:68px; }.hero-note { justify-self:start; }.filters { grid-template-columns:repeat(2,1fr); }.detail-grid,.acquisition-section,.about-section { grid-template-columns:1fr; }.detail-visual { max-width:470px; }.site-footer { grid-template-columns:1fr; }.site-footer > span { white-space:normal; } }
@media (max-width:480px) { body { font-size:15px; }.site-header { padding:0 19px; }.site-header .header-link { max-width:135px; text-align:right; }.hero-shell,.search-panel,.results-section,.about-section { padding-left:19px; padding-right:19px; }.hero-copy h1 { font-size:42px; }.hero-intro { font-size:16px; }.update-strip { align-items:flex-start; font-size:10px; }.filters { grid-template-columns:1fr; }.search-field { min-height:68px; padding:0 12px; }.search-field input { font-size:16px; }.results-bar { align-items:flex-start; flex-direction:column; gap:8px; }.result-card { padding:18px 16px 15px; }.result-main { grid-template-columns:1fr; gap:16px; }.result-base { min-width:0; padding:13px 0 0; border-left:0; border-top:1px solid var(--line); }.result-bottom { align-items:flex-start; flex-wrap:wrap; }.view-button { width:100%; margin:4px 0 0; padding:11px 0 0; text-align:left; border-top:1px solid var(--line); }.detail-section { margin-left:19px; margin-right:19px; padding:25px 17px 30px; }.detail-facts { grid-template-columns:1fr 1fr; }.detail-facts > div:last-child { grid-column:1 / -1; }.diagram { min-height:225px; }.diagram-round .round-shape { width:125px; height:125px; }.diagram-round.oval .round-shape { width:165px; height:110px; }.acquisition-section { padding-top:38px; margin-top:38px; }.verification-row a { margin-left:0; }.site-footer { padding-left:19px; padding-right:19px; } }

/* Instruction 0002: category-first browsing and coverage transparency */
.browse-section { padding:clamp(48px,7vw,94px) clamp(22px,8vw,124px) 26px; background:var(--white); border-bottom:1px solid var(--line); scroll-margin-top:20px; }
.browse-heading { display:flex; justify-content:space-between; align-items:end; gap:34px; max-width:1190px; margin-bottom:29px; }.browse-heading > div { max-width:650px; }.browse-heading h2 { margin-bottom:10px; font-size:clamp(30px,3.7vw,49px); line-height:1.03; letter-spacing:-.055em; }.browse-heading p:last-child,.base-browser-heading p:last-child { margin:0; color:var(--muted); font-size:16px; }.browse-system-control { display:grid; gap:7px; min-width:250px; color:var(--muted); font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; }.browse-system-control select { min-height:49px; padding:0 12px; border:1px solid var(--line); background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:13px; text-transform:none; letter-spacing:0; }
.coverage-notice { display:flex; align-items:flex-start; gap:15px; max-width:1190px; margin-bottom:30px; padding:17px 20px; border-left:2px solid var(--brass); background:var(--paper-2); color:var(--muted); }.coverage-notice p { margin:0; font-size:14px; }.coverage-notice strong { color:var(--ink); }.coverage-mark { display:grid; place-items:center; flex:0 0 25px; width:25px; height:25px; border:1px solid var(--brass); color:var(--brass); font-family:var(--mono); }
.category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; max-width:1190px; }.category-card { min-height:164px; display:grid; grid-template-columns:54px 1fr auto; align-items:start; gap:14px; padding:19px; text-align:left; border:1px solid var(--line); background:var(--paper); color:var(--ink); cursor:pointer; transition:transform .2s,border-color .2s,box-shadow .2s; }.category-card:hover,.category-card:focus-visible,.category-card.is-active { border-color:rgba(201,155,82,.9); box-shadow:var(--shadow); transform:translateY(-2px); }.category-card-copy { display:grid; gap:6px; }.category-card-copy strong { font-size:17px; line-height:1.15; letter-spacing:-.025em; }.category-card-copy small { min-height:39px; color:var(--muted); font-size:12px; line-height:1.42; }.category-card-copy b { color:var(--green); font-family:var(--mono); font-size:10px; font-weight:500; line-height:1.35; text-transform:uppercase; letter-spacing:.045em; }.card-arrow { color:var(--brass); font-size:17px; }
.category-icon { position:relative; display:block; width:48px; height:48px; border:1px solid rgba(201,155,82,.65); background:rgba(201,155,82,.08); color:var(--navy); overflow:hidden; }.category-icon span { position:absolute; display:block; }.icon-person .icon-person,.category-icon.icon-character .icon-person,.category-icon.icon-mounted .icon-person { left:20px; top:8px; width:9px; height:9px; border:2px solid var(--navy); border-radius:50%; }.category-icon.icon-infantry .icon-person:after,.category-icon.icon-character .icon-person:after,.category-icon.icon-mounted .icon-person:after { content:""; position:absolute; left:-6px; top:12px; width:17px; height:18px; border:2px solid var(--navy); border-radius:9px 9px 3px 3px; }.icon-star { right:5px; top:4px; width:14px; height:14px; display:grid!important; place-items:center; color:var(--brass); font-family:var(--mono); font-size:14px; }.icon-arc { left:9px; top:14px; width:30px; height:20px; border-bottom:2px solid var(--navy); border-radius:50%; transform:rotate(-12deg); }.icon-beast { left:10px; top:14px; width:29px; height:21px; border:2px solid var(--navy); border-radius:14px 14px 6px 6px; }.icon-beast:before { content:""; position:absolute; left:4px; top:-9px; width:8px; height:10px; border-left:2px solid var(--navy); transform:rotate(-22deg); }.icon-beast:after { content:""; position:absolute; right:4px; top:-9px; width:8px; height:10px; border-right:2px solid var(--navy); transform:rotate(22deg); }.icon-dots { left:9px; top:10px; width:8px; height:8px; background:var(--navy); border-radius:50%; box-shadow:14px 5px 0 var(--navy), 26px 1px 0 var(--navy), 7px 21px 0 var(--navy), 21px 25px 0 var(--navy); }.icon-vehicle { left:8px; top:18px; width:32px; height:16px; border:2px solid var(--navy); border-radius:3px; }.icon-vehicle:before,.icon-vehicle:after { content:""; position:absolute; bottom:-8px; width:7px; height:7px; border:2px solid var(--navy); border-radius:50%; background:var(--paper); }.icon-vehicle:before { left:3px; }.icon-vehicle:after { right:3px; }.icon-barrel { left:33px; top:10px; width:13px; height:2px; background:var(--navy); transform:rotate(-25deg); transform-origin:left; }.icon-wing { left:9px; top:21px; width:30px; height:2px; background:var(--navy); transform:rotate(-13deg); }.icon-wing:before,.icon-wing:after { content:""; position:absolute; width:20px; height:12px; border-top:2px solid var(--navy); }.icon-wing:before { left:-2px; top:-10px; transform:rotate(-22deg); }.icon-wing:after { right:-2px; top:3px; transform:rotate(22deg); }.formation-dots { transform:scale(.72); transform-origin:center; }.icon-hull { left:8px; top:14px; width:32px; height:22px; border:2px dashed var(--navy); border-radius:5px; }.icon-other { left:14px; top:9px; width:22px; height:29px; border:2px solid var(--navy); transform:rotate(19deg); }.icon-other:after { content:"?"; display:grid; place-items:center; height:100%; color:var(--brass); font-family:var(--mono); font-size:18px; transform:rotate(-19deg); }
.category-summary { max-width:1190px; margin-top:18px; padding:27px; background:var(--navy-2); color:var(--paper); border-top:2px solid var(--brass); }.category-summary-head { display:flex; justify-content:space-between; align-items:start; gap:20px; }.category-summary h3,.base-browser-heading h3 { margin:0 0 9px; color:var(--paper); font-size:clamp(26px,3vw,39px); letter-spacing:-.055em; line-height:1.05; }.category-summary h3 em { color:var(--brass-light); font-style:normal; }.category-summary-lead { margin:0; color:#c5ceda; font-size:15px; }.category-facts { display:grid; grid-template-columns:1.4fr 1.3fr .8fr; gap:18px; margin-top:28px; padding:18px 0; border-top:1px solid rgba(244,240,232,.18); border-bottom:1px solid rgba(244,240,232,.18); }.category-facts > div > span { display:block; margin-bottom:9px; color:var(--brass-light); font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.07em; }.category-facts strong { display:flex; flex-wrap:wrap; gap:7px; color:var(--paper); font-size:13px; line-height:1.4; }.base-pill { padding:6px 8px; border:1px solid rgba(201,155,82,.6); background:transparent; color:var(--paper); cursor:pointer; font-family:var(--mono); font-size:10px; }.base-pill:hover,.base-pill:focus-visible { background:rgba(201,155,82,.14); }.status-summary-list { gap:6px!important; }.status-summary { color:#c5ceda; font-size:11px; font-weight:400; }.status-summary .status-chip { margin-right:3px; }.partial-notice { margin:17px 0 0; padding:12px 14px; border-left:2px solid var(--brass); background:rgba(255,255,255,.06); color:#c5ceda; font-size:13px; }.partial-notice strong { color:var(--paper); }.category-records { margin-top:25px; }.category-records-heading,.base-records h4 { display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:11px; color:var(--paper); }.category-records-heading h4,.base-records h4 { margin:0; font-size:16px; }.category-records-heading span,.base-records h4 + span { color:#9ba8b7; font-family:var(--mono); font-size:10px; }.category-summary .result-card,.base-summary .result-card { margin-top:10px; background:rgba(255,253,248,.98); color:var(--ink); }.result-card-compact .result-main { padding-top:14px; padding-bottom:14px; }.result-card-compact .result-bottom { padding-top:12px; }
.representative-grid { display:grid; gap:10px; }.representative-base-card { display:grid; gap:12px; padding:18px 20px; background:rgba(255,253,248,.98); color:var(--ink); }.representative-base-top { display:flex; align-items:start; justify-content:space-between; gap:16px; }.representative-base-top h4 { margin:0; font-size:clamp(21px,2.5vw,29px); letter-spacing:-.04em; }.representative-base-top > span { color:var(--green); font-family:var(--mono); font-size:10px; line-height:1.35; text-align:right; text-transform:uppercase; }.representative-example { display:flex; align-items:baseline; gap:8px; margin:0; }.representative-example > span,.representative-source,.representative-actions > span { color:var(--muted); font-family:var(--mono); font-size:10px; }.representative-example button { padding:0; border:0; background:transparent; color:var(--ink); cursor:pointer; font:600 16px/1.25 var(--sans); text-align:left; text-decoration:underline; text-decoration-color:rgba(201,155,82,.75); text-underline-offset:3px; }.representative-example button:hover,.representative-example button:focus-visible { color:var(--brass-dark); }.representative-source { margin:0; }.representative-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:4px; border-top:1px solid var(--line); }.representative-actions .button { min-height:38px; padding:0 13px; }.representative-actions > span { text-align:right; }
.base-browser { max-width:1190px; margin-top:24px; padding-top:24px; border-top:1px solid var(--line); }.base-browser-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:22px; }.base-browser-heading h3 { color:var(--ink); }.base-browser-actions { display:flex; align-items:center; gap:14px; }.base-browser-count { color:var(--muted); font-family:var(--mono); font-size:11px; white-space:nowrap; }.base-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.base-card { display:grid; gap:0; border:1px solid var(--line); background:var(--paper); transition:border-color .2s, transform .2s, box-shadow .2s; }.base-card:hover,.base-card.is-active { border-color:var(--brass); box-shadow:var(--shadow); transform:translateY(-2px); }.base-card-visual { border-bottom:1px solid var(--line); }.base-card .diagram { min-height:130px; margin:0; border:0; }.base-card .diagram-round .round-shape { width:76px; height:76px; }.base-card .diagram-round.oval .round-shape { width:105px; height:65px; }.base-card .diagram-rect .rect-shape { width:105px; height:47px; }.base-card .diagram-none { min-height:130px; }.base-card .diagram-hull { width:90px; height:45px; border-radius:12px 12px 5px 5px; font-size:9px; }.base-card .diagram-flying { min-height:130px; }.base-card .diagram-flying .flying-stem { height:53px; }.base-card .diagram-flying .flying-disc { top:74px; width:60px; height:20px; }.base-card .diagram small { bottom:8px; font-size:8px; }.base-card-copy { display:grid; align-content:start; gap:6px; padding:15px; }.base-card-copy .overline { margin:0; color:var(--brass-dark); }.base-card-copy h4 { margin:0; color:var(--ink); font-size:17px; letter-spacing:-.04em; line-height:1.1; }.base-card-dimensions,.base-card-context,.base-card-example { margin:0; color:var(--muted); font-size:12px; line-height:1.35; }.base-card-context { font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.04em; }.base-card-example { display:grid; gap:2px; margin-top:4px; padding-top:9px; border-top:1px solid var(--line); }.base-card-example span,.base-card-links { color:var(--muted); font-family:var(--mono); font-size:10px; }.base-card-example strong { color:var(--ink); font-size:13px; }.base-card-copy .button { margin-top:7px; min-height:39px; padding:0 9px; font-size:11px; }.base-card-links { margin-top:1px; }.base-summary { display:grid; grid-template-columns:1fr .65fr; gap:30px; margin-top:18px; padding:27px; background:var(--navy-2); color:var(--paper); border-top:2px solid var(--brass); }.base-summary h3 { margin:0 0 10px; color:var(--paper); font-size:clamp(29px,4vw,48px); letter-spacing:-.06em; }.base-summary-copy > p:not(.overline) { color:#c5ceda; font-size:14px; }.base-acquisition { margin-top:22px; padding-top:18px; border-top:1px solid rgba(244,240,232,.18); }.base-acquisition h4 { margin-bottom:11px; color:var(--brass-light); }.base-summary-visual { align-self:start; }.base-summary .base-records { grid-column:1 / -1; border-top:1px solid rgba(244,240,232,.18); padding-top:23px; }.base-summary .base-records > h4 { justify-content:flex-start; margin-bottom:9px; }.base-sources { margin-top:22px; padding-top:18px; border-top:1px solid rgba(244,240,232,.18); }.base-sources h4 { margin:0 0 10px; color:var(--brass-light); }.base-sources a { display:grid; gap:3px; padding:10px 0; border-top:1px solid rgba(244,240,232,.12); color:var(--paper); text-decoration:none; }.base-sources a:hover { color:var(--brass-light); }.base-sources span { color:#aeb9c6; font-family:var(--mono); font-size:10px; }.search-base-card { max-width:1190px; }.empty-actions { display:flex; flex-wrap:wrap; gap:10px; }.empty-actions .button { display:inline-flex; align-items:center; text-decoration:none; }
@media (max-width:900px) { .category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.base-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.category-facts { grid-template-columns:1fr 1fr; }.category-facts > div:last-child { grid-column:1 / -1; }.base-summary { grid-template-columns:1fr; }.base-summary-visual { max-width:430px; } }
@media (max-width:620px) { .browse-section { padding-left:19px; padding-right:19px; }.browse-heading,.base-browser-heading,.category-summary-head { align-items:flex-start; flex-direction:column; }.browse-system-control { width:100%; }.base-browser-actions { width:100%; align-items:flex-start; justify-content:space-between; }.category-grid { grid-template-columns:1fr; }.category-card { min-height:130px; }.category-card-copy small { min-height:0; }.coverage-notice { padding:14px; }.category-summary { padding:20px 16px; }.category-facts { grid-template-columns:1fr; gap:14px; }.category-facts > div:last-child { grid-column:auto; }.base-browser { margin-top:24px; padding-top:25px; }.base-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.base-card .diagram { min-height:110px; }.base-card .diagram-round .round-shape { width:58px; height:58px; }.base-card .diagram-round.oval .round-shape { width:82px; height:51px; }.base-card-copy { padding:12px; }.base-card-copy h4 { font-size:15px; }.base-card-dimensions,.base-card-example { font-size:11px; }.base-summary { padding:20px 16px; }.empty-actions { align-items:stretch; flex-direction:column; }.empty-actions .button { justify-content:center; } }
@media (max-width:620px) { .representative-base-top { flex-direction:column; gap:7px; }.representative-base-top > span { text-align:left; }.representative-example { align-items:flex-start; flex-direction:column; gap:5px; }.representative-actions { align-items:flex-start; flex-direction:column; }.representative-actions > span { text-align:left; } }

/* Instruction 0007: flexible research geometry */
.diagram-flexible:before { top:38px; bottom:38px; width:1px; }.diagram-flexible:after { left:38px; right:38px; height:1px; }.flex-range-shape { display:block; width:184px; height:78px; border:2px dashed var(--navy); background:rgba(201,155,82,.13); }.diagram-flexible small { position:absolute; bottom:17px; color:var(--muted); font-family:var(--mono); font-size:10px; }

/* Instruction 0003: utility-scale header and control cleanup */
.site-header { min-height:64px; }
.hero-shell { min-height:0; padding:24px clamp(22px,5vw,76px) 23px; display:flex; align-items:baseline; justify-content:space-between; gap:28px; }
.hero-copy h1 { max-width:none; margin:0 0 4px; font-size:clamp(28px,3vw,36px); line-height:1; letter-spacing:-.055em; }
.hero-tagline { margin:0; color:#d2d9e1; font-size:clamp(16px,1.5vw,18px); line-height:1.35; }
.hero-tagline em { color:var(--brass-light); font-style:normal; }
.utility-meta { margin:0; color:#aeb9c6; text-align:right; font-family:var(--mono); font-size:11px; line-height:1.5; }
.hero-note { display:none; }
.search-panel { padding:30px clamp(22px,8vw,124px) 36px; }
.section-heading h2 { font-size:clamp(24px,2.7vw,34px); }
.section-heading > p:last-child { margin-bottom:18px; }
.search-field { min-height:64px; }
.filter-disclosure summary { display:none; }
.browse-section { padding-top:34px; padding-bottom:26px; }
.browse-heading h2 { font-size:clamp(25px,3vw,38px); }
.browse-heading p:last-child { font-size:16px; }
.browse-system-control { min-width:260px; }
.browse-system-control label, .browse-system-static { display:grid; gap:7px; color:var(--muted); font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; }
.browse-system-control select { min-height:45px; padding:0 12px; border:1px solid var(--line); background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:13px; text-transform:none; letter-spacing:0; }
.browse-system-static { min-width:260px; padding:10px 0; border-bottom:1px solid var(--line); }
.browse-system-static strong { color:var(--ink); font-family:var(--sans); font-size:16px; text-transform:none; letter-spacing:0; }
.text-button { justify-self:start; border:0; border-bottom:1px solid var(--brass); padding:0 0 3px; background:none; color:var(--ink); cursor:pointer; font-family:var(--sans); font-size:13px; text-transform:none; letter-spacing:0; }
.coverage-notice { margin-bottom:20px; padding:12px 16px; background:transparent; border-left:0; border-bottom:1px solid var(--line); }
.coverage-notice p { font-size:14px; }
.category-grid { gap:10px; }
.category-card { min-height:118px; grid-template-columns:44px 1fr auto; padding:15px; }
.category-card-copy { gap:4px; }
.category-card-copy strong { font-size:17px; }
.category-count { color:var(--green); font-family:var(--mono); font-size:12px; }
.category-bases { color:var(--muted); font-size:12px; line-height:1.35; }
.card-arrow { align-self:end; color:var(--ink); font-size:12px; font-weight:700; white-space:nowrap; }
.category-icon { width:42px; height:42px; }
.category-card-copy small { display:none; }
.category-summary { margin-top:14px; padding:21px; }
.category-summary-lead { font-size:15px; }
.partial-notice { margin-top:12px; padding:9px 12px; font-size:13px; }
.base-browser { margin-top:42px; padding-top:34px; }
.base-browser-heading h3 { font-size:clamp(25px,3vw,36px); }
.base-browser-heading p:last-child { font-size:15px; }
.about-section { padding-top:70px; padding-bottom:90px; }
.about-section h2 { font-size:clamp(30px,4vw,54px); }
@media (max-width:620px) {
  .filter-disclosure summary { display:flex; align-items:center; justify-content:space-between; min-height:40px; margin-top:10px; padding:0 2px; color:var(--muted); font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.07em; cursor:pointer; }
  .filter-disclosure summary::after { content:"+"; color:var(--brass); font-size:17px; }
  .filter-disclosure[open] summary::after { content:"−"; }
  .filter-disclosure .filters { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:0; }
  .hero-shell { padding-top:22px; padding-bottom:20px; display:block; }
  .hero-copy h1 { font-size:30px; }
  .hero-tagline { font-size:16px; }
  .utility-meta { margin-top:10px; text-align:left; font-size:10px; }
  .search-panel { padding-top:24px; padding-bottom:12px; }
  .section-heading h2 { font-size:25px; }
  .browse-heading { margin-bottom:14px; }
  .browse-heading h2 { font-size:28px; }
  .browse-system-control { min-width:0; width:100%; }
  .category-card { min-height:104px; grid-template-columns:40px 1fr; }
  .card-arrow { grid-column:2; justify-self:start; align-self:auto; }
  .category-icon { width:38px; height:38px; }
  .category-bases { font-size:11px; }
}

/* 0007 browse-first correction: keep the public sequence compact and explicit. */
:where([hidden]) { display:none !important; }
.flow-strip { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px 16px; padding:13px clamp(22px,8vw,124px); background:var(--paper-2); border-bottom:1px solid var(--line); color:var(--muted); font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; }
.flow-step { color:var(--muted); }
.flow-step.is-current { color:var(--ink); font-weight:500; }
.flow-arrow { color:var(--brass); font-size:15px; }
.optional-filter { display:flex; align-items:baseline; flex-wrap:wrap; gap:10px 14px; max-width:1190px; margin:34px auto 14px; padding-top:18px; border-top:1px solid var(--line); }
.optional-filter .overline { margin:0; }
.optional-filter strong { font-size:15px; }
.optional-filter span { color:var(--muted); font-size:13px; }
.base-card-action { color:var(--brass-dark); font-family:var(--mono); font-size:10px; letter-spacing:.05em; text-transform:uppercase; }
.base-card-copy { gap:8px; }
.base-card-context,.base-card-example,.base-card-links { display:none; }
.base-card-button { width:100%; height:100%; padding:0; border:0; background:transparent; color:inherit; text-align:left; cursor:pointer; }
.base-card-button:focus-visible { outline:2px solid var(--brass); outline-offset:-3px; }
#base-detail:focus-visible { outline:2px solid var(--brass-light); outline-offset:4px; }
@media (max-width:620px) {
  .flow-strip { justify-content:flex-start; gap:7px 10px; padding:11px 19px; font-size:9px; }
  .flow-arrow { font-size:13px; }
  .optional-filter { margin-top:26px; padding-top:15px; }
  .browse-heading { order:1; }
  .system-choice-group { order:2; }
  .system-overview { order:3; }
  .coverage-notice { order:4; }
  .base-browser { order:5; }
  .optional-filter { order:6; }
  .category-grid { order:7; }
}

/* Instruction 0003 expansion: selection-to-content interaction */
.browse-system-control { min-width:0; max-width:760px; }
.system-choice-label { margin-bottom:7px; color:var(--muted); font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; }
.system-choice-group { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }
.system-choice { display:grid; gap:2px; min-width:110px; padding:9px 11px; border:1px solid var(--line); background:var(--paper); color:var(--ink); cursor:pointer; text-align:left; }
.system-choice strong { font-size:12px; line-height:1.2; }
.system-choice span { color:var(--muted); font-family:var(--mono); font-size:10px; line-height:1.2; }
.system-choice:hover,.system-choice:focus-visible,.system-choice.is-active { border-color:var(--brass); background:rgba(201,155,82,.12); box-shadow:0 3px 0 rgba(201,155,82,.16); }
.category-summary { scroll-margin-top:18px; }
.category-summary .category-records { margin-top:20px; }
.category-summary .result-card { background:rgba(255,253,248,.98); }
.base-more { align-self:center; color:#c5ceda; font-family:var(--mono); font-size:11px; }
.base-context { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; margin-top:18px; padding:15px 0; border-top:1px solid rgba(244,240,232,.18); border-bottom:1px solid rgba(244,240,232,.18); }
.base-context span { display:block; margin-bottom:5px; color:var(--brass-light); font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.07em; }
.base-context strong { display:block; color:var(--paper); font-size:12px; line-height:1.4; }
.results-section { padding-top:28px; padding-bottom:28px; background:var(--paper-2); border-bottom:1px solid var(--line); }
.results-section .results-list { max-width:1190px; }
.search-match-group { max-width:1190px; margin-bottom:18px; }
.search-match-group > h3,.search-match-group .category-records-heading h3 { margin:0 0 9px; color:var(--ink); font-size:16px; letter-spacing:-.025em; }
.search-match { width:100%; display:grid; grid-template-columns:1fr auto 20px; align-items:center; gap:14px; padding:13px 15px; border:1px solid var(--line); border-bottom:0; background:var(--white); color:var(--ink); cursor:pointer; text-align:left; }
.search-match:last-child { border-bottom:1px solid var(--line); }
.search-match:hover,.search-match:focus-visible { border-color:var(--brass); background:#fffaf0; }
.search-match strong { font-size:14px; }
.search-match span { color:var(--muted); font-family:var(--mono); font-size:10px; }
.search-match span:last-child { color:var(--brass); font-size:16px; }
.detail-no-acquisition { color:#c5ceda; font-size:13px; }
@media (max-width:900px) {
  .system-choice-group { justify-content:flex-start; }
  .system-choice { min-width:0; }
  .base-context { grid-template-columns:1fr 1fr; }
  .base-context > div:last-child { grid-column:1 / -1; }
}
@media (max-width:620px) {
  .browse-section { display:flex; flex-direction:column; }
  .browse-heading { order:1; }
  .coverage-notice { order:2; }
  .base-browser { order:3; }
  .category-grid { order:4; }
  .category-summary { order:5; }
  .system-choice-group { display:flex; flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; padding-bottom:4px; }
  .system-choice { min-width:0; }
  .system-choice strong { font-size:11px; }
  .category-summary { margin-top:12px; }
  .base-context { grid-template-columns:1fr; }
  .base-context > div:last-child { grid-column:auto; }
  .search-match { grid-template-columns:1fr 20px; }
  .search-match span:not(:last-child) { grid-column:1; }
  .search-match span:last-child { grid-column:2; grid-row:1 / span 2; }
}

/* Base-first entry surface */
.featured-bases { max-width:1190px; margin-top:26px; padding-top:21px; border-top:1px solid var(--line); }
.featured-bases-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:12px; }
.featured-bases-heading h3 { margin:0 0 5px; color:var(--ink); font-size:clamp(20px,2.2vw,27px); letter-spacing:-.045em; }
.featured-bases-heading p:last-child { margin:0; color:var(--muted); font-size:13px; }
.featured-base-count { color:var(--muted); font-family:var(--mono); font-size:10px; white-space:nowrap; }
.featured-base-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }
.base-quick-card { display:grid; grid-template-columns:76px 1fr; min-height:100px; border:1px solid var(--line); background:var(--paper); }
.base-quick-visual .diagram { min-height:100px; margin:0; border:0; border-right:1px solid var(--line); }
.base-quick-visual .diagram-round .round-shape { width:48px; height:48px; }
.base-quick-visual .diagram-round.oval .round-shape { width:62px; height:40px; }
.base-quick-visual .diagram-rect .rect-shape { width:58px; height:28px; }
.base-quick-visual .diagram-none { min-height:100px; }
.base-quick-visual .diagram-hull { width:57px; height:29px; border-radius:8px 8px 3px 3px; font-size:7px; }
.base-quick-visual .diagram-flying { min-height:100px; }
.base-quick-visual .diagram-flying .flying-stem { height:39px; }
.base-quick-visual .diagram-flying .flying-disc { top:59px; width:42px; height:14px; }
.base-quick-visual .diagram small,.base-quick-visual .dimension-label { display:none; }
.base-quick-copy { display:grid; align-content:center; gap:3px; padding:9px; }
.base-quick-copy .overline { margin:0; color:var(--brass-dark); font-size:8px; }
.base-quick-copy h4 { margin:0; color:var(--ink); font-size:13px; line-height:1.1; letter-spacing:-.025em; }
.base-quick-copy p:not(.overline) { margin:0; color:var(--muted); font-family:var(--mono); font-size:9px; line-height:1.3; }
.base-quick-copy .text-button { margin-top:3px; font-size:11px; }
.base-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }

@media (max-width:900px) {
  .featured-base-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .base-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width:620px) {
  .featured-bases-heading { align-items:flex-start; flex-direction:column; }
  .featured-base-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .base-quick-card { grid-template-columns:58px 1fr; }
  .base-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .base-quick-visual .diagram { min-height:96px; }
  .base-quick-visual .diagram-round .round-shape { width:42px; height:42px; }
  .base-quick-visual .diagram-round.oval .round-shape { width:53px; height:35px; }
}

/* Instruction 0005: release-candidate interaction and evidence clarity */
:where(button, a, input, select, summary):focus-visible { outline:3px solid var(--brass); outline-offset:3px; }
.browse-shape-control { display:grid; gap:6px; min-width:150px; color:var(--muted); font-family:var(--mono); font-size:10px; letter-spacing:.07em; text-transform:uppercase; }
.browse-shape-control select { min-height:39px; padding:0 9px; border:1px solid var(--line); background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:12px; letter-spacing:0; text-transform:none; }
.diagram .round-shape,.diagram .rect-shape { width:var(--diagram-width,150px); height:var(--diagram-height,150px); }
.diagram-round:not(.oval) .round-shape { width:var(--diagram-width,150px); height:var(--diagram-height,150px); }
.diagram-round.oval .round-shape { width:var(--diagram-width,185px); height:var(--diagram-height,125px); }
.diagram-rect .rect-shape { width:var(--diagram-width,184px); height:var(--diagram-height,78px); }
.base-summary-topline,.detail-title-row { display:flex; align-items:start; justify-content:space-between; gap:18px; }
.copy-link-button { flex:0 0 auto; min-height:35px; padding:0 11px; border:1px solid rgba(244,240,232,.35); background:transparent; color:var(--paper); cursor:pointer; font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.05em; }
.base-summary-copy .copy-link-button,.detail-copy .copy-link-button { border-color:rgba(201,155,82,.7); color:var(--brass-light); }
.copy-link-button:hover { background:rgba(201,155,82,.12); }
.related-data { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:22px; padding-top:17px; border-top:1px solid rgba(244,240,232,.18); }
.related-data > div { display:grid; gap:8px; }
.related-data span { color:var(--brass-light); font-family:var(--mono); font-size:10px; letter-spacing:.07em; text-transform:uppercase; }
.related-data strong { display:flex; flex-wrap:wrap; gap:6px; }
.inline-link-button { border:0; padding:0; background:none; color:inherit; cursor:pointer; font:inherit; text-align:left; text-decoration:underline; text-decoration-color:var(--brass); text-underline-offset:3px; }
.source-details { margin-top:22px; border-top:1px solid rgba(244,240,232,.18); border-bottom:1px solid rgba(244,240,232,.18); }
.source-details summary { padding:14px 0; color:var(--brass-light); cursor:pointer; font-weight:700; }
.source-details-body { display:grid; gap:13px; padding:0 0 15px; }
.source-detail { display:grid; gap:4px; padding-top:12px; border-top:1px solid rgba(244,240,232,.12); color:#c5ceda; font-size:12px; }
.source-detail strong { color:var(--paper); font-size:13px; }
.source-detail span { color:#aeb9c6; font-family:var(--mono); font-size:10px; }
.source-detail p { margin:4px 0; }
.source-detail a { color:var(--brass-light); font-weight:700; }
.system-facts { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin:0 0 18px; padding:16px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.system-facts span { display:block; margin-bottom:6px; color:var(--brass-dark); font-family:var(--mono); font-size:9px; letter-spacing:.07em; text-transform:uppercase; }
.system-facts strong { display:block; color:var(--ink); font-size:12px; line-height:1.3; }
.acquisition-status { color:#c8d3de!important; }
@media (max-width:900px) { .system-facts { grid-template-columns:repeat(3,1fr); } }
@media (max-width:620px) { .base-browser-actions { align-items:stretch; flex-direction:column; } .browse-shape-control { width:100%; } .related-data { grid-template-columns:1fr; } .system-facts { grid-template-columns:1fr 1fr; } .detail-title-row { align-items:flex-start; flex-direction:column; } }

/* Instruction 0006: browse-first official catalogue and deterministic footprints */
.browse-heading { align-items:start; }
.browse-heading > .button { flex:0 0 auto; }
.system-choice-group { justify-content:flex-start; max-width:1190px; margin-bottom:18px; }
.system-choice { min-width:180px; padding:13px 15px; }
.system-choice strong { font-size:14px; }
.system-choice span { font-size:10px; }
.system-choice.is-active { background:var(--navy-2); color:var(--paper); }
.system-choice.is-active span { color:#c5ceda; }
.system-overview { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); gap:25px; max-width:1190px; margin:4px 0 20px; padding:23px; background:var(--navy-2); color:var(--paper); border-top:2px solid var(--brass); }
.system-overview h3 { margin:0 0 8px; color:var(--paper); font-size:clamp(25px,3vw,38px); letter-spacing:-.055em; }
.system-overview p:not(.overline) { margin:0; color:#c5ceda; font-size:14px; line-height:1.55; }
.system-reference { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; align-items:start; }
.system-reference div { display:grid; gap:4px; padding-bottom:11px; border-bottom:1px solid rgba(244,240,232,.17); }
.system-reference span,.base-detail-metrics span,.detail-block .acquisition-date { color:var(--brass-light); font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; }
.system-reference strong { color:var(--paper); font-size:12px; line-height:1.35; }
.system-reference .button { grid-column:1 / -1; justify-self:start; border-color:var(--brass); color:var(--brass-light); }
.coverage-notice { max-width:1190px; }
.category-grid { max-width:1190px; }
.base-browser { max-width:1190px; }
.base-browser-heading { align-items:start; }
.base-browser-heading h3 { color:var(--ink); }
.base-browser-actions { align-items:start; }
.shape-choice-list { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; max-width:450px; }
.shape-choice { min-height:34px; padding:0 10px; border:1px solid var(--line); background:var(--paper); color:var(--ink); cursor:pointer; font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.04em; }
.shape-choice:hover,.shape-choice:focus-visible,.shape-choice.is-active { border-color:var(--brass); background:rgba(201,155,82,.13); }
.base-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.base-card { overflow:hidden; }
.base-card-button { width:100%; display:grid; padding:0; border:0; background:var(--paper); color:var(--ink); cursor:pointer; text-align:left; }
.base-card-button:focus-visible { outline:3px solid var(--brass); outline-offset:-3px; }
.base-card-button:hover .base-card-action { color:var(--brass-dark); }
.base-card-visual { display:block; }
.base-card-copy { display:grid; align-content:start; gap:6px; padding:15px; }
.base-card-copy strong { color:var(--ink); font-size:18px; line-height:1.1; letter-spacing:-.04em; }
.base-card-copy .overline { color:var(--brass-dark); }
.base-card-action { margin-top:5px; color:var(--ink); font-size:12px; font-weight:800; }
.base-card-links { color:var(--green); font-family:var(--mono); font-size:10px; }
.base-card-example { min-height:29px; padding-top:8px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; line-height:1.35; }
.base-card .diagram { min-height:132px; padding:16px; overflow:visible; }
.base-card .diagram .round-shape,.base-card .diagram .rect-shape { max-width:calc(100% - 12px); max-height:calc(100% - 12px); }
.base-card .diagram-round .round-shape { width:76px; height:76px; }
.base-card .diagram-round.oval .round-shape { width:96px; height:53px; }
.base-card .diagram-rect .rect-shape { width:96px; height:48px; }
.base-summary { grid-template-columns:minmax(0,1fr) minmax(250px,.62fr); }
.base-summary-copy { min-width:0; }
.base-detail-lead { color:#c5ceda; font-size:15px; line-height:1.5; }
.base-detail-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:19px; padding:15px 0; border-top:1px solid rgba(244,240,232,.18); border-bottom:1px solid rgba(244,240,232,.18); }
.base-detail-metrics > div { display:grid; gap:5px; }
.base-detail-metrics strong { color:var(--paper); font-size:12px; line-height:1.35; }
.detail-block { margin-top:22px; padding-top:17px; border-top:1px solid rgba(244,240,232,.18); }
.detail-block h4 { margin:0 0 10px; color:var(--brass-light); font-size:16px; }
.detail-block .source-detail { border-top:1px solid rgba(244,240,232,.12); }
.example-list { display:grid; gap:8px; }
.example-list > div { display:grid; gap:3px; padding:10px 0; border-top:1px solid rgba(244,240,232,.12); }
.example-list strong { color:var(--paper); font-size:14px; }
.example-list span,.compact-note,.acquisition-date { color:#c5ceda; font-size:12px; line-height:1.4; }
.acquisition-block .acquisition-date { margin:0 0 12px; }
.related-block > div { display:flex; flex-wrap:wrap; gap:7px; }
.unit-detail { max-width:760px; }
.unit-detail h2 { margin:0 0 12px; color:var(--paper); font-size:clamp(30px,4vw,52px); letter-spacing:-.06em; }
.unit-detail > p:not(.overline) { color:#c5ceda; }
.unit-detail .button { margin-top:18px; border-color:var(--brass); color:var(--brass-light); }
@media (max-width:900px) { .system-overview { grid-template-columns:1fr; }.base-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.shape-choice-list { justify-content:flex-start; } }
@media (max-width:620px) { .browse-heading { gap:15px; }.browse-heading > .button { width:100%; }.system-choice-group { flex-wrap:nowrap; overflow-x:auto; padding-bottom:5px; }.system-choice { min-width:160px; }.system-overview { grid-template-columns:1fr; margin-top:3px; padding:18px 16px; }.system-reference { grid-template-columns:1fr; }.system-reference .button { grid-column:auto; }.base-browser-heading { gap:16px; }.base-browser-actions { width:100%; flex-direction:column; }.shape-choice-list { max-width:none; justify-content:flex-start; }.base-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }.base-card-copy { padding:12px; }.base-card-copy strong { font-size:15px; }.base-card .diagram { min-height:112px; padding:10px; }.base-card .diagram-round .round-shape { width:60px; height:60px; }.base-card .diagram-round.oval .round-shape { width:76px; height:42px; }.base-card .diagram-rect .rect-shape { width:76px; height:38px; }.base-summary { padding:19px 16px; }.base-detail-metrics { grid-template-columns:1fr 1fr; }.base-detail-metrics > div:last-child { grid-column:1 / -1; }.base-summary-visual { max-width:none; } }

/* Keep the drawn footprint ratio supplied by geometry.mjs at every viewport. */
.diagram .round-shape,.diagram .rect-shape { width:var(--diagram-width) !important; height:var(--diagram-height) !important; max-width:calc(100% - 12px); max-height:calc(100% - 12px); }
.system-choice-sections { display:grid; gap:16px; max-width:1190px; margin-bottom:18px; }
.system-choice-section { padding:14px; border:1px solid var(--line); background:rgba(255,253,248,.5); }
.system-choice-section h3 { margin:0 0 9px; color:var(--muted); font-family:var(--mono); font-size:10px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; }
.system-choice-section-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.family-choice-list { display:flex; flex-wrap:wrap; gap:7px; margin-top:17px; }
.family-choice { min-height:34px; padding:0 10px; border:1px solid rgba(201,155,82,.65); background:transparent; color:var(--paper); cursor:pointer; font-family:var(--mono); font-size:10px; }
.family-choice:hover,.family-choice:focus-visible,.family-choice.is-active { background:rgba(201,155,82,.18); }
.diagram-unknown { align-content:center; gap:8px; padding:20px; text-align:center; }
.diagram-unknown strong { color:var(--navy); font-size:18px; }
.diagram-unknown small { max-width:210px; color:var(--muted); font-family:var(--mono); font-size:10px; line-height:1.4; }
.movement-tray-block .acquisition-group { border-top:1px solid rgba(244,240,232,.12); }
.frontage-marker { display:inline-flex; align-items:center; gap:7px; width:max-content; padding:5px 8px; border:1px solid rgba(201,155,82,.55); color:var(--brass-light); font-family:var(--mono); font-size:10px; letter-spacing:.03em; text-transform:uppercase; }
.frontage-marker > span { display:inline-grid; place-items:center; min-width:20px; height:20px; border:1px solid currentColor; font-size:14px; line-height:1; }
.frontage-marker.frontage-long > span { color:#9ed0b0; }
.frontage-marker.frontage-short > span { color:#f2b37d; }
.frontage-marker.frontage-either > span { color:var(--brass-light); font-size:11px; }
.diagram-rect .frontage-marker { position:absolute; bottom:15px; left:50%; transform:translateX(-50%); color:var(--navy); border-color:rgba(24,35,55,.35); background:rgba(255,253,248,.86); white-space:nowrap; text-transform:none; }
.diagram-rect .frontage-marker > span { height:17px; min-width:17px; font-size:12px; }
.frontage-marker.compact { padding:3px 5px; font-size:8px; }
.frontage-marker.compact > span { min-width:15px; height:15px; font-size:10px; }
.example-card.orientation-long { border-left:2px solid #9ed0b0; padding-left:10px; }
.example-card.orientation-short { border-left:2px solid #f2b37d; padding-left:10px; }
.calculated-footprint-block { border-left:2px solid var(--brass); padding-left:14px; }
.calculated-footprint { display:grid; gap:3px; padding:9px 0; border-top:1px solid rgba(244,240,232,.12); }
.calculated-footprint strong { color:var(--paper); font-size:13px; }
.calculated-footprint span { color:#c5ceda; font-family:var(--mono); font-size:10px; }
@media (max-width:900px) { .system-choice-section-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:620px) { .system-choice-section { padding:11px; }.system-choice-section-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.system-choice { min-width:0; padding:10px; }.system-choice strong { font-size:11px; }.family-choice-list { margin-top:13px; } }

/* Final 0007 narrow-screen order: system, bases, then the optional category filter. */
@media (max-width:620px) {
  .browse-heading { order:1; }
  .system-choice-group { order:2; }
  .system-overview { order:3; }
  .coverage-notice { order:4; }
  .base-browser { order:5; }
  .optional-filter { order:6; }
  .category-grid { order:7; }
}
/* DEV-only audit diagnostics are rendered only when ?audit=1 is explicitly supplied. */
.dev-health { display: flex; gap: .75rem; flex-wrap: wrap; margin: 0 auto 1rem; max-width: 1200px; padding: .75rem 1rem; border: 1px dashed #d6a52a; background: #fff9e8; color: #3b321d; font-size: .78rem; }
.dev-health-item { padding: .2rem .45rem; border-radius: 999px; }
.dev-health-item.is-pass { background: #e1f4e8; color: #155b32; }
.dev-health-item.is-warning { background: #fff0c2; color: #7b5200; }
.dev-health-item.is-error { background: #fde2e1; color: #8d231c; }