/* =========================================================
   Sachi — the bar both public chart pages wear (2026-08-21)

   A plain stylesheet under public/ rather than a Vite entry, on purpose: both
   terminals are standalone pages, and this way a branding tweak needs no bundle
   rebuilt and no manifest lookup. It is served from our own origin, so the CSP's
   `default-src 'self'` covers it with nothing added.
   ========================================================= */

.sachi-nav {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 0 16px;
    height: 52px;
    flex-shrink: 0;
    background: #080b14;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.sachi-brand {
    display: flex;
    align-items: center;
    gap: 9px;
    text-decoration: none;
    color: #e6edf7;
    font-size: 15px;
    letter-spacing: 0.2px;
    white-space: nowrap;
}
.sachi-brand svg { width: 24px; height: 24px; flex-shrink: 0; }
.sachi-brand b { font-weight: 700; color: #8b5cf6; margin-left: 2px; }

.sachi-links { display: flex; gap: 4px; margin-left: 6px; }
.sachi-links a {
    padding: 6px 12px;
    border-radius: 6px;
    text-decoration: none;
    color: #8b97ad;
    font-size: 13px;
    white-space: nowrap;
    transition: 0.15s;
}
.sachi-links a:hover { color: #e6edf7; background: rgba(255, 255, 255, 0.05); }
.sachi-links a.on { color: #e6edf7; background: rgba(99, 102, 241, 0.18); }

.sachi-actions { margin-left: auto; display: flex; gap: 8px; }
.sachi-actions a {
    padding: 7px 14px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    transition: 0.15s;
}
.sachi-actions .ghost {
    color: #aab6cc;
    border: 1px solid rgba(255, 255, 255, 0.16);
}
.sachi-actions .ghost:hover { color: #fff; border-color: rgba(255, 255, 255, 0.35); }
.sachi-actions .solid {
    color: #fff;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
}
.sachi-actions .solid:hover { filter: brightness(1.12); }

/* Narrow screens: the links stay, the calls to action fold away rather than
   pushing the brand off the edge. */
@media (max-width: 720px) {
    .sachi-nav { gap: 10px; padding: 0 10px; }
    .sachi-brand span { display: none; }
    .sachi-actions .ghost { display: none; }
}