/* ══════════════════════════════════════════════════
   CINEMATIC — NMS LOGBOOK
══════════════════════════════════════════════════ */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box }
:root {
  --bg:      #080808;
  --panel:   #0d0d0d;
  --mid:     #111111;
  --border:  #1a1a1a;
  --border2: #262626;
  --text:    #f0f0ee;
  --dim:     #888888;
  --dim2:    #606060;
  --accent:  #888888;
  --fb: 'Rajdhani', sans-serif;
  --fh: 'Orbitron', monospace;
  --fm: 'Share Tech Mono', monospace;
  --footer-bg: rgba(28, 28, 28, 0.75);
}
html { 
    min-height:100vh;
    overflow-x:hidden; 
}
body {
  background:var(--bg); 
  color:var(--text);
  font-family:var(--fb); 
  font-weight:400; 
  letter-spacing:.02em;

}
::-webkit-scrollbar { width:10px; height:8px }
::-webkit-scrollbar-track { background:var(--bg) }
::-webkit-scrollbar-thumb { background:var(--border2) }

/* unvisited link */
a:link {
  color: grey;
  text-decoration: none;
}

/* visited link */
a:visited {
  color: grey;
  text-decoration: none;
}

/* mouse over link */
a:hover {
  color: grey;
  text-decoration: none;
}

/* selected link */
a:active {
  color: gray;
  text-decoration: none;
}

/* ── LOGIN MODAL ── */
.login-modal-overlay {
  position:fixed; inset:0; z-index:9000;
  background:rgba(0,0,0,.9);
  display:flex; align-items:center; justify-content:center;
}
.login-box {
  background:var(--panel); border:1px solid var(--border2);
  border-top:2px solid var(--text);
  padding:40px 36px 32px; width:100%; max-width:380px; position:relative;
}
.login-modal-close {
  position:absolute; top:12px; right:14px;
  background:none; border:none; color:var(--dim);
  font-size:.9rem; cursor:pointer; line-height:1;
}
.login-modal-close:hover { color:var(--text) }
.login-title {
  font-family:var(--fb); font-size:1.4rem; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:var(--text); margin-bottom:4px;
}
.login-sub {
  font-family:var(--fm); font-size:.52rem;
  color:var(--dim); letter-spacing:.14em; margin-bottom:28px;
}
.login-err {
  background:rgba(255,255,255,.04); border:1px solid var(--border2);
  color:#aaa; font-family:var(--fm); font-size:.62rem;
  padding:8px 11px; margin-bottom:16px;
}
.l-label {
  font-family:var(--fb); font-size:.68rem; font-weight:600;
  color:var(--dim); letter-spacing:.16em; text-transform:uppercase;
  display:block; margin-bottom:6px;
}
.l-input {
  width:100%; background:transparent; border:none;
  border-bottom:1px solid var(--border2); color:var(--text);
  font-family:var(--fm); font-size:.76rem;
  padding:10px 0; outline:none; margin-bottom:18px;
}
.l-input:focus { border-bottom-color:var(--text) }
.l-btn {
  width:100%; background:transparent; border:1px solid var(--text);
  color:var(--text); font-family:var(--fb); font-size:.75rem;
  font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  padding:12px; cursor:pointer; transition:all .2s; margin-top:6px;
}
.l-btn:hover { background:var(--text); color:var(--bg) }

/* ── HEADER ── */
.site-header {
  background:var(--panel); border-bottom:1px solid var(--border); padding:0 5%;
}
.header-top {
  display:flex; align-items:center; height:72px; gap:24px;
  border-bottom:1px solid var(--border);
}
.site-wordmark {
  font-family:var(--fb); font-size:1.65rem; font-weight:700;
  letter-spacing:.2em; color:var(--text); text-transform:uppercase;
  white-space:nowrap; flex-shrink:0;
}
.site-wordmark span { color:var(--dim2); font-weight:300 }
.hdr-div { width:1px; height:36px; background:var(--border); flex-shrink:0 }
.hdr-stat { text-align:center; flex-shrink:0 }
.hdr-stat-n { font-family:var(--fb); font-size:1.3rem; font-weight:600; line-height:1; color:var(--text) }
.hdr-stat-l { font-family:var(--fm); font-size:.65rem; letter-spacing:.18em; color:var(--dim); text-transform:uppercase; margin-top:2px }
.header-right { margin-left:auto; display:flex; align-items:center; gap:18px; flex-shrink:0 }
.ubadge { display:flex; align-items:center; gap:10px }
.uname { font-family:var(--fm); font-size:.54rem; letter-spacing:.1em; color:var(--dim); text-transform:uppercase }
.login-btn,.logout-btn {
  background:transparent; border:1px solid var(--border2); color:var(--dim);
  font-family:var(--fb); font-size:.65rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; padding:6px 14px; cursor:pointer; transition:all .2s;
}
.login-btn:hover,.logout-btn:hover { border-color:var(--text); color:var(--text) }
.connect-btn { border-color:rgba(240,240,238,.2); color:rgba(240,240,238,.4) }
.connect-btn:hover { border-color:var(--text); color:var(--text) }

/* ── NAV TABS ── */
.nav-tabs { display:flex; gap:0; overflow-x:auto }
.nav-tab {
  padding:14px 22px; font-family:var(--fb); font-size:.62rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; cursor:pointer;
  color:var(--dim); white-space:nowrap; border-bottom:2px solid transparent; transition:all .2s;
}
.nav-tab:hover { color:var(--accent) }
.nav-tab.active { color:var(--text); border-bottom-color:var(--text) }

/* ── PANELS ── */
.wrap { padding:0 5% }
.panel { display:none }
.panel.active { display:block }

/* ── SECTION ROWS ── */
.section-row {
  display:flex; align-items:baseline; gap:20px;
  padding:28px 0 20px; border-bottom:1px solid var(--border);
}
.section-track {
  font-family:var(--fb); font-size:3rem; font-weight:700; color:var(--dim2); line-height:1;
}
.section-label {
  font-family:var(--fm); font-size:.65rem; letter-spacing:.2em; color:var(--dim); text-transform:uppercase;
}
.sec-label {
  font-family:var(--fm); font-size:.65rem; letter-spacing:.2em; color:var(--dim);
  text-transform:uppercase; border-bottom:1px solid var(--border);
  padding-bottom:7px; margin:24px 0 14px;
}

/* ── SEARCH ROW ── */
.search-wrap {
  display:flex; gap:0; border-bottom:1px solid var(--border);
}
.search-input {
  flex:1; background:transparent; border:none; border-right:1px solid var(--border);
  color:var(--text); font-family:var(--fb); font-size:.75rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; padding:14px 0; outline:none;
}
.search-input::placeholder { color:var(--dim2) }
.filter-btn {
  background:transparent; border:none; border-right:1px solid var(--border);
  color:var(--dim); font-size:.8rem; padding:14px 14px; cursor:pointer; transition:color .2s;
}
.filter-btn:hover,.filter-btn.on { color:var(--text) }

/* ── Pagination ── */
.pager {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 0; border-top: 1px solid var(--border);
  margin-top: 0;
}
.pager-pages { display: flex; gap: 0; }
.pager-btn {
  background: transparent; border: 1px solid var(--border2);
  color: var(--dim); font-family: var(--fb); font-size: .65rem;
  font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  padding: 7px 16px; cursor: pointer; transition: all .18s;
  margin-left: -1px;
}
.pager-btn:first-child { margin-left: 0; }
.pager-btn:hover { border-color: var(--text); color: var(--text); z-index: 1; position: relative; }
.pager-btn.active { border-color: var(--text); color: var(--text); background: rgba(255,255,255,.04); z-index: 1; position: relative; }
.pager-btn:disabled { opacity: .25; cursor: default; pointer-events: none; }
.pager-info {
  font-family: var(--fm); font-size: .5rem;
  letter-spacing: .14em; color: var(--dim); text-transform: uppercase;
}
.pager-nav { display: flex; gap: 6px; }
.pager-nav-btn {
  background: transparent; border: 1px solid var(--border2);
  color: var(--dim); font-family: var(--fb); font-size: .65rem;
  font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  padding: 7px 14px; cursor: pointer; transition: all .18s;
}
.pager-nav-btn:hover:not(:disabled) { border-color: var(--text); color: var(--text); }
.pager-nav-btn:disabled { opacity: .2; cursor: default; pointer-events: none; }

/* ══════════════════════════════════════════════════
   LOG ENTRIES — CINEMATIC STRIPS
══════════════════════════════════════════════════ */
.log-list { border-top:1px solid var(--border) }
.log-entry { border-bottom:1px solid var(--border); overflow:hidden }
.log-entry.hidden { display:none }

.entry-head {
  display:flex; align-items:stretch; cursor:pointer;
  min-height:66px; transition:background .15s;
}
.log-entry:hover .entry-head,
.log-entry.open  .entry-head { background:rgba(255,255,255,.018) }

/* Day block */
.e-day {
  width:88px; flex-shrink:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  border-right:1px solid var(--border); background:var(--panel);
  font-family:var(--fb); font-size:1.15rem; font-weight:700;
  color:var(--text); letter-spacing:.04em; line-height:1;
}
.e-day-label {
  font-family:var(--fm); font-size:.54rem; letter-spacing:.18em;
  color:var(--dim); text-transform:uppercase; margin-top:3px;
}

/* Log ID column */
.e-id {
  width:96px; flex-shrink:0;
  display:flex; align-items:center;
  padding:0 16px;
  font-family:var(--fm); font-size:.56rem;
  color:var(--dim); letter-spacing:.04em;
  border-right:1px solid var(--border);
}

/* Title + subtitle */
.e-mid { flex:1; padding:14px 20px; display:flex; flex-direction:column; justify-content:center }
.e-title {
  font-family:var(--fb); font-size:1rem; font-weight:600;
  letter-spacing:.06em; color:var(--text); text-transform:uppercase;
}
.e-subtitle {
  font-family:var(--fm); font-size:.65rem; letter-spacing:.08em;
  color:var(--dim); margin-top:5px; text-transform:uppercase;
}

/* ── Star spectral class colours ── */
.system-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
  background: #38bdf8; /* default fallback */
  margin-right: 5px;
  vertical-align: middle;
  position: relative;
  top: -1px;
}
.e-title { display: flex; align-items: center; }
.system-dot.star-o { 
background: #52BBB7;
border-radius: 5px;
box-shadow:
0 0 2px #52BBB7, /* x-offset, y-offset, blur, spread, color */
0 0 5px #52BBB7,
0 0 10px #52BBB7;
}
.system-dot.star-b { 
background: #1873B5;
border-radius: 5px;
box-shadow:
0 0 2px #1873B5, /* x-offset, y-offset, blur, spread, color */
0 0 5px #1873B5,
0 0 10px #1873B5;
}
.system-dot.star-a { 
background: #e8e8ff;
border-radius: 5px;
box-shadow:
0 0 2px #e8e8ff, /* x-offset, y-offset, blur, spread, color */
0 0 5px #e8e8ff,
0 0 10px #e8e8ff;
}
.system-dot.star-f {
background: #FFD250; 
border-radius: 5px;
box-shadow:
0 0 2px #FFD250, /* x-offset, y-offset, blur, spread, color */
0 0 5px #FFD250,
0 0 10px #FFD250;
}
.system-dot.star-g { 
background: #FFDB00; 
border-radius: 5px;
box-shadow:
0 0 2px #FFDB00, /* x-offset, y-offset, blur, spread, color */
0 0 5px #FFDB00,
0 0 10px #FFDB00;
}
.system-dot.star-k { 
background: #ffb347; 
border-radius: 5px;
box-shadow:
0 0 2px #ffb347, /* x-offset, y-offset, blur, spread, color */
0 0 5px #ffb347,
0 0 10px #ffb347;
}
.system-dot.star-m { 
background: #F16764;
border-radius: 5px;
box-shadow:
0 0 2px #F16764, /* x-offset, y-offset, blur, spread, color */
0 0 5px #F16764,
0 0 10px #F16764; 
}
.system-dot.star-e { 
background: #5DD64D; 
border-radius: 5px;
box-shadow:
0 0 2px #5DD64D, /* x-offset, y-offset, blur, spread, color */
0 0 5px #5DD64D,
0 0 10px #5DD64D;
}
.system-dot.star-x { 
background: #5F3881; 
border-radius: 5px;
box-shadow:
0 0 2px #5F3881, /* x-offset, y-offset, blur, spread, color */
0 0 5px #5F3881,
0 0 10px #5F3881;
}

/* Right block */
.e-right {
  display:flex; align-items:center; gap:10px;
  padding:0 18px; flex-shrink:0; border-left:1px solid var(--border);
}
.e-date { font-family:var(--fm); font-size:.55rem; letter-spacing:.1em; color:var(--dim); white-space:nowrap }
.e-chev { font-size:.5rem; color:var(--dim2); margin-left:4px; transition:transform .2s }
.log-entry.open .e-chev { transform:rotate(90deg) }

/* Alert badges */
.ab {
  font-family:var(--fm); font-size:.52rem; padding:2px 6px;
  border:1px solid var(--border2); color:var(--dim); white-space:nowrap;
}
.ab-pirate    { border-color:rgba(255,80,80,.25);  color:rgba(255,110,80,.75) }
.ab-brood     { border-color:rgba(255,140,0,.25);  color:rgba(255,140,0,.75) }
.ab-dis       { border-color:rgba(200,180,255,.2); color:rgba(200,180,255,.65) }
.ab-nostation { border-color:rgba(209,209,209,.2); color:rgba(209,209,209,.65) }
.ab-war       { border-color:rgba(255,230,0,.25);  color:rgba(255,230,0,.75) }
.ab-atlas     { border-color:rgba(246,0,0,.3); color:rgba(246,0,0,.6) }
.ab-portal    { border-color:var(--border2); }

/* ══ EXPANDED BODY ══ */
.entry-body { display:none; border-top:1px solid var(--border); background:rgba(0,0,0,.45) }
.log-entry.open .entry-body { display:block }

.entry-inner { display:grid; grid-template-columns:1fr 1fr }
.entry-left,.entry-right { padding:22px 28px }
.entry-left { border-right:1px solid var(--border) }
.entry-col-hdr {
  font-family:var(--fm); font-size:.75rem; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:var(--dim2); margin-bottom:14px;
}

.log-note {
  font-family:var(--fb); font-size:.82rem; color:var(--accent);
  letter-spacing:.05em; padding:14px 28px; border-bottom:1px solid var(--border);
}

/* System card head */
.sys-card-head {
  font-family:var(--fm); font-size:.58rem; color:var(--dim);
  letter-spacing:.05em; line-height:1.7; margin-bottom:14px;
}
.sys-card-head .sn { color:var(--text); font-size:.72rem; font-weight:600; letter-spacing:.06em }

/* Sys meta grid */
.sys-meta {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
  gap:10px; margin-bottom:12px;
}
.sm-lbl {
  font-family:var(--fm); font-size:.44rem; color:var(--dim);
  letter-spacing:.12em; text-transform:uppercase;
}
.sm-val {
  font-family:var(--fb); font-size:.75rem; font-weight:500;
  color:var(--text); margin-top:2px; letter-spacing:.04em;
}

/* Planet/resource pills */
.sub-lbl {
  font-family:var(--fm); font-size:.65rem; letter-spacing:.18em;
  color:var(--dim2); text-transform:uppercase; margin-bottom:6px; margin-top:14px;
}
.planet-list,.res-list { display:flex; flex-wrap:wrap; gap:3px }
.planet-pill,.res-pill {
  border:1px solid var(--border2); padding:3px 10px;
  font-family:var(--fm); font-size:.70rem;
  letter-spacing:.04em; text-transform:uppercase;
}
.planet-pill { color:#aaa }
.planet-pill.moon { color:var(--dim) }
.res-pill { color:var(--dim) }

/* Resource Colors */
.Activated-Copper {
	color: #FFFFCE;
}

.Activated-Cadmium {
	color: #FFFFCE;
}

.Activated-Emeril {
	color: #FFFFCE;
}

.Activated-Indium {
	color:#FFFFCE; 
}
	
.Activated-Quartzite {
	color:#FFFFCE;
}

.Ammonia {
	color: #c5dfff;
}

.Ancient-Bones {
	color: #ffffff;
}

.Basalt {
	color: #c5dfff;
}

.Cactus-Flesh {
	color: #a3ff7b;
}

.Cadmium {
	color:#FFFFCE;
}

.Cobalt {
	color:#C5DFFF;
}

.Copper {
	color:#FFFFCE;
}

.Crystallized-Helium {
	color:#C5DFFF;
}

.Dioxite {
	color:#C5DFFF;
}

.Emeril {
	color:#ffffce;
}

.Faecium {
	color:#A3FF7B;
}

.Frost-Crystal {
	color:#A3FF7B;
}

.Fungal-Mold {
	color:#A3FF7B;
}
.Gamma-Root {
	color:#A3FF7B;
}
.Gold {
	color:#DEB6FF;
}
.Indium {
	color:#FFFFCE;
}
.Magnetised-Ferrite {
	color:#FBF4EC;
}
.Mordite {
	color:#C5DFFF;
}
.Paraffinium {
	color:#C5DFFF;
}
.Phosphorus {
	color:#C5DFFF;
}
.Pyrite {
	color:#C5DFFF;
}
.Quartzite {
	color:#FFFFCE;
}
.Rusted-Metal {
	color:#DEB6FF;
}
.Salt {
	color:#C5DFFF;
}
.Salvageable-Scrap {
	color:#ffffff;
}
.Silver {
	color:#DEB6FF;
}
.Sodium {
	color:#FFD667;
}
.Solanium {
	color:#A3FF7B;
}
.Star-Bulb {
	color:#A3FF7B;
}
.Sulphurine {
	color:#C5DFFF;
}
.Uranium {
	color:#C5DFFF;
}

.alert-row {
  font-family:var(--fm); font-size:.75rem; color:var(--dim);
  border-left:2px solid var(--border2); padding:4px 8px;
  margin-top:6px; letter-spacing:.04em;
}
.alert-row.brood { border-left-color:rgba(255,140,0,.4); color:rgba(255,140,0,.6) }
.alert-row.warn { border-left-color:rgba(255,220,0,.4); color:rgba(255,220,0,.6) }
.alert-row.info { border-left-color:rgba(150,150,255,.3); color:rgba(150,150,255,.5) }
.alert-row.nostation { border-left-color:rgba(209,209,209,.3); color:rgba(209,209,209,.5) }
.alert-row.atlas { border-left-color:rgba(246,0,0,.3); color:rgba(246,0,0,.6) }

.Xbox {
  background-color: white;
  width: 16px;
  height: 16px;
  -webkit-mask: url(../img/xbox.svg) no-repeat center;
  mask: url(../img/xbox.svg) no-repeat center;
  -webkit-mask-size: 12px;
  mask-size: 12px;
  display: block; 
}

.PC {
  background-color: white;
  width: 16px;
  height: 16px;
  -webkit-mask: url(../img/pc.svg) no-repeat center;
  mask: url(../img/pc.svg) no-repeat center;
  -webkit-mask-size: 12px;
  mask-size: 12px;
  display: block; 
}

.Switch {
  background-color: white;
  width: 16px;
  height: 16px;
  -webkit-mask: url(../img/switch.svg) no-repeat center;
  mask: url(../img/switch.svg) no-repeat center;
  -webkit-mask-size: 12px;
  mask-size: 12px;
  display: block; 
}

.Playstation {
  background-color: white;
  width: 16px;
  height: 16px;
  -webkit-mask: url(../img/playstation.svg) no-repeat center;
  mask: url(../img/playstation.svg) no-repeat center;
  -webkit-mask-size: 12px;
  mask-size: 12px;
  display: block; 
}

/* == PORTAL GLYPHS == */
.ab-off { border-color: var(--border) !important; color: var(--dim2) !important; opacity: .4; }
.e-right .ab { margin-left: 2px; }

/* ── Portal glyph picker ── */
.pglyph-wrap {
  display: flex; flex-direction: column; gap: 8px;
}
.pglyph-display {
  display: flex; flex-wrap: wrap; gap: 2px;
  min-height: 22px; padding: 4px 0;
  border-bottom: 1px solid var(--border);
}
.pglyph-display img {
  width: 18px; height: 18px; object-fit: contain; opacity: .9;
}
.pglyph-display .pglyph-empty {
  font-family: var(--fm); font-size: .48rem;
  color: var(--dim2); letter-spacing: .1em; align-self: center;
}
.pglyph-input {
  font-family: var(--fm) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase;
}
.pglyph-keyboard {
  display: flex; flex-wrap: wrap; gap: 4px; padding: 8px 0;
}
.pglyph-btn {
  background: var(--mid); border: 1px solid var(--border2);
  cursor: pointer; padding: 5px 6px;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  transition: border-color .15s, background .15s;
  min-width: 24px;
}
.pglyph-btn:hover { border-color: var(--text); background: rgba(255,255,255,.04); }
.pglyph-btn.full { border-color: var(--dim); opacity: .45; cursor: not-allowed; }
.pglyph-btn img { width: 18px; height: 18px; object-fit: contain; }
.pglyph-btn span {
  font-family: var(--fm); font-size: .44rem;
  color: var(--dim); letter-spacing: .08em;
}
.pglyph-actions { display: flex; gap: 6px; }
.pglyph-act {
  background: transparent; border: 1px solid var(--border2);
  color: var(--dim); font-family: var(--fb); font-size: .62rem;
  font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  padding: 5px 12px; cursor: pointer; transition: all .15s;
}
.pglyph-act:hover { border-color: var(--text); color: var(--text); }

/* ══ STATS PANEL ══ */
.stats-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:0; border:1px solid var(--border); margin-bottom:24px;
}
.stats-card { padding:22px 18px; border-right:1px solid var(--border); border-bottom:1px solid var(--border); text-align:center }
.big-num { font-family:var(--fb); font-size:2.2rem; font-weight:700; color:var(--text); line-height:1 }
.s-label { font-family:var(--fm); font-size:.65rem; letter-spacing:.16em; color:var(--dim); text-transform:uppercase; margin-top:6px }

.race-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  border:1px solid var(--border); margin-bottom:24px;
}
.race-card { padding:18px; border-right:1px solid var(--border); text-align:center }
.race-card:last-child { border-right:none }
.race-name { font-family:var(--fm); font-size:.65rem; letter-spacing:.14em; color:var(--dim) }
.race-count { font-family:var(--fb); font-size:1.8rem; font-weight:700; color:var(--text); margin-top:4px }

.region-list { margin-bottom:22px }
.region-row {
  display:flex; align-items:center; gap:10px;
  padding:7px 0; border-bottom:1px solid var(--border); font-size:.75rem;
}
.rn { font-family:var(--fb); color:var(--text); min-width:180px; letter-spacing:.04em }
.rb { height:2px; background:var(--accent) }
.rc-n { font-family:var(--fm); font-size:.75rem; color:var(--dim); margin-left:auto }

/* ══ PLANET CATALOGUE ══ */
.cat-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:0; border:1px solid var(--border); border-bottom:none;
}
.cat-card { padding:14px 16px; border-right:1px solid var(--border); border-bottom:1px solid var(--border) }
.cat-sys {
  font-family:var(--fb); font-size:.80rem; font-weight:600;
  color:var(--text); letter-spacing:.06em; text-transform:uppercase; margin-bottom:8px;
}
.cat-planets { display:flex; flex-wrap:wrap; gap:3px }
.cat-p { font-family:var(--fm); font-size:.75rem; border:1px solid var(--border2); padding:2px 7px }
.cat-p.planet { color:#8aadcc }
.cat-p.moon { color:var(--dim) }

/* Alphabetical catalogue grid */
.cat-alpha-grid {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.5rem 0.75rem;
}



.cat-letter-heading {
  font-size: 1rem;
  font-weight: 700;
  color: var(--accent, #8af);
  min-width: 1.2rem;
  flex-shrink: 0;
}

.cat-letter-entries {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.cat-type-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  font-size: 0.7rem;
  background: var(--card-bg, #1a1a2e);
  border: 1px solid var(--dim, #333);
  color: var(--text, #ccc);
  white-space: nowrap;
}

.cat-type-badge.moon {
  border-color: var(--moon-col, #373737);
  color: var(--moon-col, #888);
}

.cat-type-badge.planet {
  border-color: var(--planet-col, #262626);
  color: var(--planet-col, #8AAAC7);
}

.cat-type-count {
  font-weight: 700;
  color: var(--accent, #8af);
  font-size: 0.65rem;
}

/* ══ TIMELINE ══ */
.timeline { border-top:1px solid var(--border) }
.tl-item { display:flex; gap:0; border-bottom:1px solid var(--border) }
.tl-day-col {
  width:88px; flex-shrink:0; padding:14px 0;
  display:flex; align-items:flex-start; justify-content:center;
  border-right:1px solid var(--border);
  font-family:var(--fm); font-size:.65rem; color:var(--dim);
  letter-spacing:.05em; text-align:center; line-height:1.6;
}
.tl-item.has-alert .tl-day-col { color:rgba(255,200,0,.45) }
.tl-content { flex:1; padding:14px 22px }
.tl-sys {
  font-family:var(--fb); font-size:.88rem; font-weight:600;
  color:var(--text); letter-spacing:.06em; text-transform:uppercase;
}
.tl-det { font-family:var(--fm); font-size:.65rem; color:var(--dim); margin-top:5px; letter-spacing:.04em }

/* ══ FLEET ══ */
.ships-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:0; border:1px solid var(--border); border-bottom:none;
}
.ship-card { padding:20px; border-right:1px solid var(--border); border-bottom:1px solid var(--border); position:relative }
.ship-card.cur { border-top:2px solid var(--text) }
.cur-badge {
  position: relative;font-family:var(--fm); font-size:.45rem; letter-spacing:.14em;
  color:var(--bg); background:var(--text); padding:2px 4px;
  display:inline-block; margin-bottom:0px;top:-2px;
}
.ship-img-placeholder {
  width:100%; height:140px; background:var(--mid); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:12px; font-size:2.5rem; opacity:.15;
}
.ship-img { width:100%; height:140px; object-fit:cover; margin-bottom:12px; display:block; background:var(--mid) }
.ship-name { font-family:var(--fb); font-size:.9rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-bottom:3px }
.ship-class { font-family:var(--fm); font-size:.65rem; margin-bottom:8px; letter-spacing:.06em }
.ship-auth { font-family:var(--fm); font-size:.55rem; color:var(--dim); margin-bottom:12px; letter-spacing:.07em }
.ship-stats { display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--border) }
.ship-stat { padding:8px 10px; border-right:1px solid var(--border); border-bottom:1px solid var(--border) }
.ship-stat:nth-child(even) { border-right:none }
.ship-stat:nth-child(n+3) { border-bottom:none }
.ss-label { font-family:var(--fm); font-size:.55rem; color:var(--dim); letter-spacing:.1em; text-transform:uppercase }
.ss-val { font-family:var(--fb); font-size:.75rem; font-weight:600; color:var(--text); margin-top:3px; word-break:break-word }
.ship-value { font-family:var(--fm); font-size:.54rem; color:var(--dim); margin-top:10px; border-top:1px solid var(--border); padding-top:8px }

/* ══ FORMS ══ */
.form-section { border:1px solid var(--border); padding:24px }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px; margin-bottom:14px }
.form-group { display:flex; flex-direction:column; gap:6px }
.form-group.full { grid-column:1/-1 }
.form-label { font-family:var(--fb); font-size:.62rem; font-weight:600; color:var(--dim); letter-spacing:.16em; text-transform:uppercase }
.form-input,.form-textarea,.form-select {
  background:#0E0E0E; border:none; border-bottom:1px solid var(--border2);
  color:var(--text); font-family:var(--fm); font-size:.72rem;
  padding:9px 0; outline:none; width:100%; letter-spacing:.04em;
}
.form-input:focus,.form-textarea:focus,.form-select:focus { border-bottom-color:var(--text) }
.form-select { padding:9px 4px }
.form-select option { background:var(--mid) }
.form-textarea { height:90px; resize:vertical }
.form-textarea.tall { height:150px }
.form-submit {
  background:transparent; border:1px solid var(--text); color:var(--text);
  font-family:var(--fb); font-size:.7rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  padding:12px 28px; cursor:pointer; transition:all .2s;
}
.form-submit:hover { background:var(--text); color:var(--bg) }
.form-divider {
  font-family:var(--fb); font-size:.6rem; font-weight:600;
  color:var(--dim2); letter-spacing:.2em; text-transform:uppercase;
  border-bottom:1px solid var(--border); padding-bottom:6px;
  margin:10px 0 2px; grid-column:1/-1;
}
.check-group { display:flex; flex-wrap:wrap; gap:10px; padding:5px 0 }
.check-item { display:flex; align-items:center; gap:6px; font-family:var(--fb); font-size:.7rem; letter-spacing:.06em; cursor:pointer }
.check-item input { accent-color:var(--text); cursor:pointer }

.db-error {
  background:rgba(255,80,80,.05); border:1px solid rgba(255,80,80,.2);
  color:rgba(255,150,150,.8); padding:20px; font-family:var(--fm); font-size:.64rem; margin:16px 0;
}

/* ── Cinematic system-data rows ── */
.sys-frow {
  display: flex; gap: 8px; margin-bottom: 9px; align-items: baseline;
}
.sys-flbl {
  font-family: var(--fm); font-size: .65rem; letter-spacing: .13em;
  color: var(--dim); text-transform: uppercase;
  min-width: 100px; flex-shrink: 0; padding-top: 1px;
}
.sys-fval {
  display: flex; /* Aligns children (text and span) horizontally */
  align-items: center; /* Centers the icon vertically with the text */
  gap: 1px; /* Adds space between text and icon */
  font-family: var(--fb); 
  font-size: .80rem; 
  font-weight: 500;
  color: #c8c8c6; 
  letter-spacing: .03em; 
  line-height: 1.3;
}
/* ── System separator inside an accordion (same-day entries) ── */
.sys-separator {
  display: flex; align-items: center; gap: 12px;
  padding: 0px 28px; border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background: rgba(255,255,255,.02);
  font-family: var(--fb); font-size: .82rem; font-weight: 400;
  letter-spacing: .07em; text-transform: uppercase; color: var(--text);
}
.sys-separator::before {
  content: '';  display: block;
  width: 3px; height: 3px; border-radius: 50%; background: var(--dim);
  flex-shrink: 0;
}
/* ── Day-summary strip (inside entry-body, full-width at bottom) ── */
.day-summary {
  display: flex; flex-wrap: wrap; border-top: 1px solid var(--border);
}
.day-chip {
  flex: 1; min-width: 120px;
  padding: 10px 16px; border-right: 1px solid var(--border);
  font-family: var(--fm); font-size: .75rem;
  color: var(--dim); letter-spacing: .12em; text-transform: uppercase; text-align: center;
}
.day-chip:last-child { border-right: none; }
.day-chip span {
  font-family: var(--fb); font-size: 1.0rem; font-weight: 600;
  color: var(--accent); display: block; margin-top: 4px;
}

/* ══ SITE FOOTER ══ */
.site-footer {
  margin-top: 60px;
  border-top: 1px solid var(--border);
  background: var(--panel);
}
.footer-inner {
  display: flex;
  align-items: center;
  gap: 0;
  padding: 32px 5%;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
  gap: 32px;
}

/* Brand */
.footer-brand { flex-shrink: 0 }
.footer-wordmark {
  font-family: var(--fb); font-size: 1.5rem; font-weight: 700;
  letter-spacing: .22em; color: var(--text); text-transform: uppercase;
}
.footer-wordmark span { color: var(--dim2); font-weight: 300 }
.footer-sub {
  font-family: var(--fm); font-size: .75rem;
  letter-spacing: .16em; color: var(--dim); text-transform: uppercase;
  margin-top: 5px;
}

/* Stats row */
.footer-stats {
  display: flex; align-items: center; gap: 0; margin-left: auto;
}
.footer-stat { text-align: center; padding: 0 24px }
.footer-stat-n {
  font-family: var(--fb); font-size: 1.3rem; font-weight: 600;
  color: var(--text); line-height: 1;
}
.footer-stat-l {
  font-family: var(--fm); font-size: .44rem;
  letter-spacing: .14em; color: var(--dim);
  text-transform: uppercase; margin-top: 4px;
}
.footer-divider { width: 1px; height: 32px; background: var(--border); flex-shrink: 0 }

/* Meta */
.footer-meta {
  flex-shrink: 0; text-align: right;
}
.footer-traveller {
  font-family: var(--fm); font-size: .75rem;
  letter-spacing: .14em; color: var(--dim); text-transform: uppercase;
  margin-bottom: 6px;
}
.footer-traveller span { color: var(--text) }
.footer-copy {
  font-family: var(--fm); font-size: .65rem;
  color: var(--dim2); letter-spacing: .1em; margin-bottom: 4px;
}
.footer-build {
  font-family: var(--fm); font-size: .60rem;
  color: var(--dim2); letter-spacing: .12em; text-transform: uppercase;
}

/* Last-entry bar */
.footer-bar {
  padding: 10px 5%;
  font-family: var(--fm); font-size: .5rem;
  letter-spacing: .1em; color: var(--dim2); text-transform: uppercase;
}
.footer-bar span { color: var(--dim) }

/* ── Simple footer ── */
.site-footer { text-align: center; padding: 20px 5%; border-top: 1px solid var(--border); margin-top: 40px; }
.site-footer .text-center { display: inline-block; }
.site-footer p, .site-footer small { font-family: var(--fm); color: #888; letter-spacing: .06em; font-size: .72rem; line-height: 1.8; }
.site-footer a.text-white { color: #ccc !important; text-decoration: none; font-weight: 600; transition: color .15s; }
.site-footer a.text-white:hover { color: #fff !important; }
.site-footer small { font-size: .58rem; color: #444; display: block; margin-top: 4px; }
.site-footer .fa-xs { font-size: .65em; opacity: .6; }

@media (max-width: 768px) {
  .footer-inner { flex-direction: column; align-items: flex-start; gap: 24px }
  .footer-stats  { margin-left: 0 }
  .footer-meta   { text-align: left }
}

@media (max-width:768px) {
  .header-top { height:auto; flex-wrap:wrap; padding:14px 0; gap:12px }
  .hdr-stat,.hdr-div { display:none }
  .e-id { display:none }
  .e-day { width:64px; font-size:.85rem }
  .entry-inner { grid-template-columns:1fr }
  .entry-left { border-right:none; border-bottom:1px solid var(--border) }
  .form-grid { grid-template-columns:1fr }
  .race-grid { grid-template-columns:1fr 1fr }
}