/* Company X - dark violet theme from Capture4.JPG (deep indigo, lilac borders, gold accent, white Roboto). Layout tokens from DESIGN (2).md.
   Previously: DESIGN (2).md tokens. Palette, type scale, 4px spacing scale, three radii, two shadows, three durations.
   Status colours (rating badges, station boxes) are the only values outside that palette; they carry meaning. */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700;800&display=swap');
:root{
  /* colour */
  --bg-light:#2a2252;--text:#FFFFFF;--color-7:#0b0820;--color-6:#2b2060;--color-2:#5A2A82;--color-3:#6c3fd1;--color-4:#8f86c0;--color-8:#FFFFFF;
  --surface:#150f33;--surface-2:#1e1646;--gold:#f2b632;--link:#c3b2ff;--topbar:#141816;
  --text-muted:#c9c2e6;
  --mute:var(--text-muted);--line:var(--color-6);
  /* status (meaning, not decoration) */
  --ok:#2e7d32;--warn:#a15c00;--bad:#d32f2f;--na:#5b6672;
  /* type */
  --font:Roboto,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --text-xs:10px;--text-sm:12px;--text-base:14px;--text-lg:16px;--text-xl:18px;--text-2xl:20px;--text-3xl:22px;--text-4xl:32px;--text-9:38px;--text-10:48px;
  /* spacing, 4px base */
  --space-1:1px;--space-2:4px;--space-3:6px;--space-4:8px;--space-5:10px;--space-6:14px;--space-7:15px;--space-8:16px;--space-9:20px;--space-10:22px;--space-11:24px;--space-12:30px;--space-13:32px;--space-14:33px;--space-15:40px;--space-16:48px;--space-17:60px;--space-18:80px;
  /* shape */
  --radius-sm:0 10px 10px 0;--radius-md:5px;--radius-full:9999px;
  /* elevation */
  --shadow-sm:rgba(0,0,0,.35) 0 1px 4px 0;--shadow-md:rgba(0,0,0,.5) 0 2px 4px 2px;
  /* motion */
  --duration-fast:.1s ease-out;--duration-base:.2s ease-out;--duration-slow:.5s ease-out;
  --hdr-h:60px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:#0b0820 radial-gradient(ellipse 70% 50% at 85% 0,#3a1a8a 0,transparent 70%) no-repeat;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr-h) + var(--space-11))}
body{margin:0;font:400 var(--text-base)/1.6 var(--font);color:var(--text);background:transparent;-webkit-font-smoothing:antialiased}
a{color:var(--link);text-underline-offset:3px;text-decoration-thickness:1px;overflow-wrap:anywhere;transition:color var(--duration-fast)}
a:hover{color:var(--gold);text-decoration-thickness:2px}
a:active{color:var(--color-8)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:var(--radius-md)}

/* header and navigation */
header{position:sticky;top:0;z-index:20;min-height:var(--hdr-h);background:linear-gradient(90deg,var(--topbar) 0,#1a0f45 35%,#3b1a80 100%);border-bottom:1px solid var(--color-4);color:var(--color-8);padding:var(--space-4) var(--space-12);display:flex;gap:var(--space-4) var(--space-12);align-items:center;flex-wrap:wrap;box-shadow:var(--shadow-sm)}
header b{font-size:var(--text-xl);font-weight:800;display:flex;align-items:center;gap:var(--space-5)}
header b::before{content:"";width:var(--space-9);height:var(--space-9);background:var(--gold);clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%)}
nav{display:flex;flex-wrap:wrap;gap:var(--space-2)}
nav a{color:var(--color-8);text-decoration:none;padding:var(--space-4) var(--space-8);border-radius:var(--radius-full);font-size:var(--text-base);font-weight:400;transition:background var(--duration-base)}
nav a:hover{background:rgba(255,255,255,.16);color:var(--color-8)}
nav a:active{background:rgba(255,255,255,.28)}
nav a[style]{background:var(--color-8);color:var(--color-2)!important;font-weight:700!important}

/* layout and type */
main{max-width:1200px;margin:0 auto;padding:var(--space-15) var(--space-12) var(--space-17)}
h1,h2,h3{font-family:var(--font);color:var(--text);line-height:1.2}
h1{font-size:clamp(var(--text-4xl),1.4rem + 2.6vw,var(--text-10));font-weight:800;margin:var(--space-2) 0 var(--space-9)}
h2{font-size:clamp(var(--text-2xl),1.1rem + 1.2vw,var(--text-4xl));font-weight:700;margin:var(--space-16) 0 var(--space-6);color:var(--color-8)}
h3{font-size:var(--text-3xl);font-weight:700;margin:var(--space-13) 0 var(--space-4)}
p,li{max-width:78ch}td p,td li{max-width:none}
small{color:var(--text-muted);font-size:var(--text-sm)}
.note{background:var(--color-6);border-left:4px solid var(--gold);padding:var(--space-8) var(--space-9);border-radius:var(--radius-sm);max-width:none}
.spot{border:1px solid var(--color-6);border-left:4px solid var(--gold);border-radius:var(--radius-md);padding:var(--space-2) var(--space-11) var(--space-9);margin:var(--space-11) 0;background:var(--surface);box-shadow:var(--shadow-sm)}
.spot h2{margin-top:var(--space-8)}

/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--space-8)}
.card{border:1px solid var(--color-6);border-radius:var(--radius-md);padding:var(--space-9) var(--space-11);background:var(--surface);box-shadow:var(--shadow-sm);border-top:4px solid var(--color-3);transition:box-shadow var(--duration-base),border-color var(--duration-base)}
.card:hover{box-shadow:var(--shadow-md);border-top-color:var(--gold)}
.card h3{margin:0 0 var(--space-3);font-size:var(--text-xl)}.card p{margin:0;color:var(--text-muted);font-size:var(--text-base)}

/* tables */
table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--text-base);background:var(--surface);border:1px solid var(--color-6);border-radius:var(--radius-md);overflow:clip;box-shadow:var(--shadow-sm);font-variant-numeric:tabular-nums}
th,td{padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--color-6);text-align:left;vertical-align:top}
tbody tr:last-child td{border-bottom:0}
th{background:var(--color-6);color:var(--text);font-size:var(--text-sm);font-weight:700;position:sticky;top:var(--hdr-h);z-index:1}
tbody tr{transition:background var(--duration-fast)}
tbody tr:hover{background:var(--surface-2)}
td.use{max-width:420px;font-size:var(--text-base)}td.use div{margin-top:var(--space-3)}
input[type=search]{padding:var(--space-5) var(--space-9);width:min(460px,100%);border:1px solid var(--color-4);border-radius:var(--radius-full);margin-bottom:var(--space-8);background:var(--surface);color:var(--text);font:inherit;transition:border-color var(--duration-base),box-shadow var(--duration-base)}
input[type=search]:hover{border-color:var(--link)}
input[type=search]:focus-visible{border-color:var(--gold);box-shadow:var(--shadow-sm)}
input[type=search]:disabled{background:var(--bg-light);color:var(--text-muted);cursor:not-allowed}
input[type=search]::placeholder{color:var(--text-muted)}

/* buttons, chips, tags */
button.ptr{background:var(--color-3);color:var(--color-8);border:0;border-radius:var(--radius-full);padding:var(--space-4) var(--space-8);cursor:pointer;font:700 var(--text-base)/1.4 var(--font);white-space:nowrap;transition:background var(--duration-base),box-shadow var(--duration-base)}
button.ptr:hover{background:var(--gold);color:#1a1236;box-shadow:var(--shadow-sm)}
button.ptr:active{background:var(--color-8);color:#1a1236}
button.ptr:disabled{background:var(--bg-light);color:var(--text-muted);cursor:not-allowed}
.chip{display:inline-block;font-size:var(--text-sm);background:var(--color-6);border:1px solid var(--color-6);border-radius:var(--radius-full);padding:var(--space-2) var(--space-6);margin:var(--space-2) var(--space-2) 0 0;color:var(--link);text-decoration:none;font-weight:700;transition:border-color var(--duration-fast),background var(--duration-fast)}
.chip:hover{border-color:var(--gold);background:var(--surface-2);color:var(--gold)}
.tag{display:inline-block;padding:var(--space-1) var(--space-5);border-radius:var(--radius-full);font-weight:700;font-size:var(--text-sm);vertical-align:middle;color:var(--color-8)}
.tag.ok{background:var(--ok)}.tag.miss{background:var(--bad)}.tag.lead{background:var(--warn)}
.tr{display:inline-block;min-width:var(--space-11);text-align:center;border-radius:var(--radius-md);font-weight:700;font-size:var(--text-sm);padding:var(--space-1) var(--space-3);color:var(--color-8);cursor:help}
.tr-A{background:var(--ok)}.tr-B{background:#5f8f24}.tr-C{background:var(--warn)}.tr-D{background:var(--bad)}.tr-N{background:var(--na)}
.trn{display:block;font-size:var(--text-sm);color:var(--text-muted);margin-top:var(--space-2);line-height:1.35}.trfix{display:block;font-size:var(--text-sm);color:var(--gold);margin-top:var(--space-2)}
.legend span{margin-right:var(--space-8);font-size:var(--text-base)}

/* floor plan flows */
.flow{list-style:none;padding:0;margin:var(--space-6) 0 var(--space-13);display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--space-8)}
.fp{border-radius:var(--radius-md);padding:var(--space-6) var(--space-8);display:flex;flex-direction:column;gap:var(--space-2);position:relative;font-size:var(--text-base);color:var(--text);box-shadow:var(--shadow-sm);transition:box-shadow var(--duration-base)}
.fp:hover{box-shadow:var(--shadow-md)}
.fp b{font-size:var(--text-lg);line-height:1.3}.fp small{margin-top:auto;font-size:var(--text-sm);color:var(--text)}
.fp.ok{background:color-mix(in srgb,var(--ok) 28%,var(--surface));border:2px solid var(--ok)}
.fp.miss{background:color-mix(in srgb,var(--bad) 26%,var(--surface));border:2px solid var(--bad)}
.fp.lead{background:color-mix(in srgb,var(--warn) 26%,var(--surface));border:2px dashed var(--gold)}
.fp.ok.sourced{border-style:dashed}
.tour{position:relative;aspect-ratio:16/9;max-width:960px;border:2px solid var(--color-4);border-radius:var(--radius-md);overflow:hidden;background:var(--color-7);box-shadow:var(--shadow-sm);margin:var(--space-8) 0}
.tour iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.fp.sample{background:var(--surface-2);border:2px solid var(--color-4)}
.fp:not(:last-child)::after{content:"\2192";position:absolute;right:calc(-1 * var(--space-7));top:50%;transform:translateY(-50%);color:var(--color-4);font-weight:700}

/* details, glossary, footer */
details{margin:var(--space-5) 0;border:1px solid var(--color-6);border-radius:var(--radius-md);padding:var(--space-2) var(--space-8);background:var(--surface);box-shadow:var(--shadow-sm)}
summary{cursor:pointer;padding:var(--space-5) 0;list-style:none;display:flex;gap:var(--space-5);align-items:center}
summary:hover{color:var(--gold)}
summary::before{content:"\25B8";color:var(--gold);transition:transform var(--duration-base)}
details[open]>summary::before{transform:rotate(90deg)}
summary::-webkit-details-marker{display:none}
details table{font-size:var(--text-sm);margin:var(--space-3) 0 var(--space-6);box-shadow:none}details td small{color:var(--text-muted)}
details th{top:0;position:static}
.glossary{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:var(--space-8)}
.term{border:1px solid var(--color-6);border-radius:var(--radius-md);padding:var(--space-8) var(--space-9);background:var(--surface);box-shadow:var(--shadow-sm)}
.term h3{margin:0 0 var(--space-3);font-size:var(--text-xl)}.term p{margin:0 0 var(--space-4);font-size:var(--text-base);overflow-wrap:anywhere}.term ul{margin:0;padding-left:var(--space-9);font-size:var(--text-base)}
.term:target{outline:3px solid var(--gold);background:var(--color-6)}
.foot{border-top:1px solid var(--color-4);margin-top:var(--space-16);padding-top:var(--space-9);color:var(--text-muted);font-size:var(--text-base)}
#company-links li{overflow-wrap:anywhere}

/* photo modal */
#modal{position:fixed;inset:0;background:rgba(5,3,20,.85);display:none;align-items:center;justify-content:center;padding:var(--space-9);z-index:40}
#modal.open{display:flex}
.box{position:relative;background:var(--surface);color:var(--text);border-radius:var(--radius-md);padding:var(--space-9);max-width:min(940px,100%);max-height:100%;overflow:auto;box-shadow:var(--shadow-md)}
.box img{max-width:100%;max-height:70vh;display:block;margin:auto}
.box p{margin:var(--space-5) 0 0;color:var(--text-muted);font-size:var(--text-base)}#mcap2{margin:var(--space-4) 0 0}
#x{position:absolute;top:var(--space-4);right:var(--space-5);width:var(--space-15);height:var(--space-15);border:0;border-radius:var(--radius-full);background:var(--color-3);color:var(--color-8);font-size:var(--text-3xl);line-height:1;cursor:pointer;transition:background var(--duration-base)}
#x:hover{background:var(--gold);color:#1a1236}

/* back to top */
#totop{position:fixed;right:var(--space-11);bottom:var(--space-11);width:var(--space-16);height:var(--space-16);border:0;border-radius:var(--radius-full);background:var(--color-3);color:var(--color-8);font-size:var(--text-2xl);line-height:1;cursor:pointer;box-shadow:var(--shadow-md);z-index:30;transition:background var(--duration-base)}
#totop:hover{background:var(--gold);color:#1a1236}#totop:active{background:var(--color-8)}#totop[hidden]{display:none}

#splat{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
img{max-width:100%;height:auto}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* tablet */
@media (max-width:1024px){
 main{padding:var(--space-11) var(--space-9) var(--space-16)}
 header{padding:var(--space-4) var(--space-9)}
 table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
 th{position:static}
 td.use{max-width:320px}
 table:not(.stack) th,table:not(.stack) td{min-width:104px}
}
/* phone */
@media (max-width:700px){
 main{padding:var(--space-9) var(--space-6) var(--space-16)}
 header{padding:var(--space-4) var(--space-6);position:static}
 nav{width:100%}
 nav a{padding:var(--space-5) var(--space-6);min-height:44px;display:inline-flex;align-items:center}
 input[type=search]{width:100%;font-size:var(--text-lg)}
 button.ptr{padding:var(--space-5) var(--space-9);min-height:44px}
 .chip{padding:var(--space-3) var(--space-6)}
 table.stack{overflow:visible;background:transparent;border:0;box-shadow:none}
 table.stack tbody{display:block}table.stack thead{display:none}
 table.stack tr{display:block;border:1px solid var(--color-6);border-radius:var(--radius-md);margin:0 0 var(--space-6);padding:var(--space-4) var(--space-6);background:var(--surface);box-shadow:var(--shadow-sm)}
 table.stack tr[hidden]{display:none}
 table.stack td{display:block;border:0;padding:var(--space-3) 0;min-width:0}
 table.stack td::before{content:attr(data-label);display:block;font-size:var(--text-sm);font-weight:700;color:var(--text-muted)}
 table.stack td.use{max-width:none}
 .flow{grid-template-columns:1fr;gap:var(--space-13)}
 .fp:not(:last-child)::after{content:"\2193";right:auto;left:50%;top:auto;bottom:calc(-1 * var(--space-12));transform:translateX(-50%)}
 .legend span{display:block;margin:0 0 var(--space-3)}
 #modal{padding:var(--space-4)}.box{padding:var(--space-6)}.box img{max-height:60vh}#x{width:44px;height:44px}
 #totop{right:var(--space-6);bottom:var(--space-6);width:48px;height:48px}
}

/* glossary page (append-only) */
#gl-form label{display:inline-block;margin-bottom:var(--space-3);font-weight:700}
.gl-chip[aria-pressed=true]{background:var(--gold);color:#1a1236}
#gl-chips{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-bottom:var(--space-6)}
.gl-az{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0 0 var(--space-8)}
.gl-az .chip[hidden],.gl-item[hidden]{display:none}
.gl-anchor{display:block;height:0}
dl.glossary{margin:0}
.gl-item dt{margin:0}.gl-item dd{margin:var(--space-4) 0 0}
.gl-exp{display:block;color:var(--text-muted);font-size:var(--text-sm);margin-bottom:var(--space-3)}
.gl-tag{background:var(--color-3);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.04em}
.gl-semiconductor{background:#2e6f9e}.gl-electronics{background:#5f8f24}.gl-physics{background:#8a4fb8}.gl-instrumentation{background:#a15c00}
.gl-used{color:var(--text-muted)}
.gl-letter{font:inherit;font-size:var(--text-sm);font-weight:700;color:var(--link);background:var(--color-6);border:1px solid var(--color-6);border-radius:var(--radius-full);padding:var(--space-3) var(--space-6);cursor:pointer;transition:border-color var(--duration-fast),background var(--duration-fast)}
.gl-letter:hover{border-color:var(--gold);color:var(--gold)}
.gl-letter:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.gl-letter[aria-pressed=true]{background:var(--gold);color:#1a1236;border-color:var(--gold)}
.gl-letter[hidden]{display:none}
button.gl-chip{background:var(--color-3);color:var(--color-8);border:0;border-radius:var(--radius-full);padding:var(--space-4) var(--space-8);cursor:pointer;font:700 var(--text-base)/1.4 var(--font);white-space:nowrap;transition:background var(--duration-base),box-shadow var(--duration-base)}
button.gl-chip:hover{background:var(--gold);color:#1a1236;box-shadow:var(--shadow-sm)}
button.gl-chip:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
button.gl-chip[aria-pressed=true]{background:var(--gold);color:#1a1236}