:root {
  --bg: #041018;
  --bg-deep: #01050a;
  --panel: rgba(7, 18, 26, 0.92);
  --panel-solid: #08131d;
  --text: #cbfff2;
  --muted: #8fd7c6;
  --line: #39ffd2;
  --glow: rgba(57, 255, 210, 0.35);
  --accent: #77ffe9;
  --accent-2: #13ffd7;
  --warning: #ffdb5a;
  --danger: #ff6b8c;
  --shadow: 0 0 0 1px rgba(57,255,210,0.18), 0 0 28px rgba(57,255,210,0.12), inset 0 0 24px rgba(57,255,210,0.03);
  --radius: 18px;
  --frame-max: 1180px;
  --modal-max-h: 70vh;
  --font-main: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  --font-mono: Consolas, "Cascadia Code", "SFMono-Regular", Menlo, monospace;
}
html[data-theme="blue"] { --line:#55c8ff; --glow:rgba(85,200,255,.32); --accent:#a8e8ff; --accent-2:#2fd5ff; --text:#e6f6ff; --muted:#9ecfe9; }
html[data-theme="lime"] { --line:#9bff6d; --glow:rgba(155,255,109,.28); --accent:#d8ffb4; --accent-2:#b2ff4f; --text:#f1ffe4; --muted:#bad7a5; }
html[data-theme="yellow"] { --line:#ffd957; --glow:rgba(255,217,87,.28); --accent:#fff3b2; --accent-2:#ffea74; --text:#fffbe7; --muted:#d8ce94; }
html[data-theme="orange"] { --line:#ff9e57; --glow:rgba(255,158,87,.30); --accent:#ffd0b0; --accent-2:#ffb170; --text:#fff0e6; --muted:#d9b59b; }
* { box-sizing: border-box; }
html, body { margin:0; min-height:100%; background: radial-gradient(circle at top, #0b1d2a, var(--bg-deep) 50%, #000 100%); color:var(--text); font-family:var(--font-main); }
body::before {
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    linear-gradient(rgba(255,255,255,0.02), rgba(255,255,255,0.00) 35%),
    linear-gradient(transparent 96%, rgba(255,255,255,0.03) 100%);
  background-size:100% 100%, 100% 4px;
  opacity:0.45;
}
#scanline { position:fixed; inset:0; pointer-events:none; background:linear-gradient(transparent 0%, rgba(255,255,255,.03) 50%, transparent 100%); animation:scan 8s linear infinite; opacity:.22; z-index:1; }
@keyframes scan { from { transform:translateY(-100%);} to { transform:translateY(100%);} }
a { color: var(--accent); text-decoration:none; }
a:hover { color: white; }
.site-shell { position:relative; z-index:2; width:min(calc(100vw - 24px), var(--frame-max)); margin:16px auto 28px; }
.chrome-panel { background:linear-gradient(180deg, rgba(13,26,36,.96), rgba(6,14,21,.96)); border:1px solid rgba(133,255,227,.18); box-shadow:var(--shadow); border-radius:var(--radius); backdrop-filter: blur(6px); }
.header-panel, .footer-panel, .page-panel, .terminal-modal { padding:14px 16px; }
.header-top { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.brand-link { display:flex; gap:10px; align-items:baseline; font-family:var(--font-mono); font-size:1.7rem; font-weight:800; letter-spacing:2px; color:var(--text); text-shadow:0 0 12px var(--glow); }
.brand-word { color: var(--text); }
.brand-accent { color: var(--line); }
.status-mini, .mini-readout, .crumbs, .pill, .tag, .tiny { font-family:var(--font-mono); }
.status-mini, .mini-readout, .footer-copy, .muted { color: var(--muted); font-size:.9rem; }
.header-tools { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.theme-picker { display:flex; gap:8px; align-items:center; padding:6px 10px; border:1px solid rgba(255,255,255,.08); border-radius:999px; font-family:var(--font-mono); font-size:.85rem; }
select, input, button, textarea { font:inherit; }
select, input {
  color:var(--text); background:#07141d; border:1px solid rgba(255,255,255,.10); border-radius:12px; padding:10px 12px;
}
button, .btn {
  color:var(--text); background:linear-gradient(180deg, rgba(22,48,64,.9), rgba(10,22,31,.95)); border:1px solid rgba(255,255,255,.12); border-radius:12px; padding:10px 14px; cursor:pointer; box-shadow:0 0 0 1px rgba(255,255,255,.02), 0 0 18px rgba(0,0,0,.22);
}
button:hover, .btn:hover { border-color:rgba(255,255,255,.25); transform:translateY(-1px); }
button.secondary { background:transparent; }
.main-nav, .sub-nav, .footer-links { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.main-nav { justify-content:center; margin-top:14px; }
.sub-nav { justify-content:center; padding-top:10px; border-top:1px solid rgba(255,255,255,.08); margin-top:12px; }
.nav-link, .footer-link {
  display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:0 14px; border-radius:999px; font-family:var(--font-mono); font-size:.95rem; letter-spacing:.04em;
  border:1px solid rgba(255,255,255,.10); background:rgba(8,21,29,.58); color:var(--text);
}
.nav-link:hover, .footer-link:hover, .nav-link.active { border-color: var(--line); box-shadow:0 0 0 1px rgba(0,0,0,.2),0 0 16px var(--glow); }
.page-frame { margin-top:16px; position:relative; }
.page-panel { min-height:420px; }
.hero-grid { display:grid; grid-template-columns:1.4fr .9fr; gap:16px; }
.hero-title { font-size:clamp(2rem, 5vw, 3.5rem); line-height:1; margin:0 0 14px; letter-spacing:1px; text-shadow:0 0 18px var(--glow); }
.hero-sub { font-size:1.05rem; color:var(--muted); max-width:65ch; }
.terminal-window {
  background: radial-gradient(circle at top, rgba(33,72,89,.28), rgba(6,16,23,.95)); border:1px solid rgba(255,255,255,.10); border-radius:18px; padding:16px; min-height:280px; box-shadow: inset 0 0 18px rgba(255,255,255,.02);
}
.terminal-header { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:12px; color:var(--muted); font-family:var(--font-mono); }
.terminal-dots { display:flex; gap:8px; }
.terminal-dots span { width:10px; height:10px; border-radius:50%; background:var(--line); box-shadow:0 0 12px var(--glow); }
.terminal-screen { font-family:var(--font-mono); white-space:pre-wrap; line-height:1.55; min-height:220px; }
.cursor { display:inline-block; width:10px; height:1.2em; background:var(--line); margin-left:4px; vertical-align:-2px; box-shadow:0 0 12px var(--glow); animation:blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity:0; } }
.kpi-grid, .card-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; }
.kpi, .card { background:rgba(6,14,21,.72); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:14px; }
.kpi-title, .card-title { font-family:var(--font-mono); color:var(--muted); font-size:.88rem; text-transform:uppercase; letter-spacing:.05em; }
.kpi-value { font-size:1.25rem; color:var(--text); margin-top:6px; }
.card-list { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; }
.card .meta, .item-meta { color:var(--muted); font-size:.88rem; font-family:var(--font-mono); }
.item-list { display:grid; gap:14px; }
.list-toolbar { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
.list-toolbar input { flex:1 1 260px; }
.list-toolbar .tag-row { display:flex; gap:8px; flex-wrap:wrap; }
.tag { display:inline-block; padding:6px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.08); background:rgba(8,21,29,.55); color:var(--muted); font-size:.85rem; }
.tag.active, .tag:hover { color:var(--text); border-color:var(--line); }
.list-item { border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:14px; background:rgba(6,14,21,.6); display:grid; gap:10px; }
.list-item-header { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; flex-wrap:wrap; }
.list-item p { margin:0; color:var(--muted); }
.empty-state { color:var(--muted); padding:24px 0; text-align:center; }
.modal-overlay {
  position:absolute; inset:0; background:rgba(1,6,9,.76); backdrop-filter: blur(4px); border-radius:var(--radius); display:none; align-items:center; justify-content:center; padding:12px; z-index:20;
}
.modal-overlay.open { display:flex; }
.terminal-modal {
  width:min(100%, 920px); max-height:var(--modal-max-h); overflow:auto; position:relative;
}
.modal-titlebar { display:flex; justify-content:space-between; align-items:center; gap:10px; font-family:var(--font-mono); border-bottom:1px solid rgba(255,255,255,.08); padding-bottom:10px; margin-bottom:12px; }
.modal-content { line-height:1.7; }
.modal-content h1, .modal-content h2, .modal-content h3 { font-family:var(--font-mono); }
.modal-content pre { overflow:auto; padding:12px; border-radius:12px; background:#031018; border:1px solid rgba(255,255,255,.06); }
.modal-content code { font-family:var(--font-mono); }
.markdown-panel { line-height:1.7; }
.markdown-panel pre { overflow:auto; padding:12px; border-radius:12px; background:#031018; border:1px solid rgba(255,255,255,.06); }
.grid-two { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.tfl-lines { display:grid; gap:12px; }
.expandable { border:1px solid rgba(255,255,255,.08); border-radius:16px; overflow:hidden; background:rgba(6,14,21,.68); }
.expandable summary { list-style:none; display:flex; justify-content:space-between; align-items:center; padding:14px; cursor:pointer; font-family:var(--font-mono); }
.expandable summary::-webkit-details-marker { display:none; }
.expand-content { padding:0 14px 14px; color:var(--muted); }
.board-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.departure-card { border:1px solid rgba(255,255,255,.08); border-radius:16px; background:rgba(6,14,21,.7); padding:14px; display:grid; gap:8px; }
.departure-list { display:grid; gap:8px; max-height:190px; overflow:auto; }
.departure-row { display:flex; justify-content:space-between; gap:10px; align-items:center; padding:8px 10px; border-radius:10px; background:rgba(255,255,255,.03); }
.notice { padding:14px; border:1px dashed rgba(255,255,255,.15); border-radius:14px; color:var(--muted); }
.center-stack { display:grid; gap:14px; justify-items:center; text-align:center; }
.gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.gallery-card img { width:100%; height:220px; object-fit:cover; border-radius:12px; filter:hue-rotate(78deg) saturate(1.15) contrast(1.06); background:#05121b; }
.download-list { display:grid; gap:12px; }
.download-item { display:grid; gap:8px; border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:14px; background:rgba(6,14,21,.65); }
.footer-grid { display:grid; grid-template-columns:1.1fr 1fr 1fr; gap:16px; align-items:start; }
.footer-title { font-family:var(--font-mono); margin-bottom:10px; color:var(--text); }
.footer-links { gap:8px; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.form-actions { display:flex; gap:12px; flex-wrap:wrap; }
.mono { font-family:var(--font-mono); }
.small { font-size:.92rem; color:var(--muted); }
hr { border:none; border-top:1px solid rgba(255,255,255,.08); margin:18px 0; }
@media (max-width: 980px) {
  .hero-grid, .grid-two, .footer-grid, .kpi-grid, .card-grid, .gallery-grid, .board-grid, .card-list, .grid-3 { grid-template-columns:1fr 1fr; }
}
@media (max-width: 720px) {
  .site-shell { width:min(calc(100vw - 12px), var(--frame-max)); margin:8px auto 16px; }
  .hero-grid, .grid-two, .footer-grid, .kpi-grid, .card-grid, .gallery-grid, .board-grid, .card-list, .form-grid, .grid-3 { grid-template-columns:1fr; }
  .header-top { align-items:stretch; }
  .header-tools { justify-content:flex-start; }
  .theme-picker { width:100%; justify-content:space-between; }
  .nav-link, .footer-link { width:100%; }
  .main-nav, .sub-nav, .footer-links { align-items:stretch; }
  .modal-overlay { padding:8px; }
  .terminal-modal { max-height:78vh; }
}