:root { --infra-font-scale: 1; --infra-content-width: 90%; --infra-bg: #08111f; --infra-surface: #111e30; --infra-ink: #e7eef8; --infra-muted: #9aabc1; }
html { font-size: 100%; }
html[data-infra-font="90"] { --infra-font-scale: .9; font-size: 90%; }
html[data-infra-font="100"] { --infra-font-scale: 1; font-size: 100%; }
html[data-infra-font="110"] { --infra-font-scale: 1.1; font-size: 110%; }
html[data-infra-font="120"] { --infra-font-scale: 1.2; font-size: 120%; }
html[data-infra-width="70"] { --infra-content-width: 70%; }
html[data-infra-width="80"] { --infra-content-width: 80%; }
html[data-infra-width="90"] { --infra-content-width: 90%; }
html[data-infra-width="100"] { --infra-content-width: 100%; }
html[data-infra-theme="light"] { color-scheme: light; --infra-bg: #f2f5f9; --infra-surface: #fff; --infra-ink: #182536; --infra-muted: #586b80; }
body { color: var(--infra-ink); font-size: 1rem !important; }
body > #dashboard, body > .dashboard, body > .shell, body > .hub-app, body > .hub-page, body > .app-shell, body > main.notebook-login, body > .personal-notes { max-width: var(--infra-content-width); margin-left: auto; margin-right: auto; }
.personal-notes.is-standalone { max-width: var(--infra-content-width) !important; width: var(--infra-content-width) !important; }
.page-width-control, .tawil-page-width-control, .personal-notes-theme-selector, .personal-notes-font-selector { display: none !important; }
.infra-shell-header, .infra-global-header { z-index: 10000; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 58px; padding: 8px clamp(12px, 2vw, 28px); border-bottom: 1px solid rgba(145,166,193,.17); background: color-mix(in srgb, var(--infra-bg) 91%, transparent); backdrop-filter: blur(18px); }
.infra-global-header { position: sticky; top: 0; }
.infra-shell-brand { color: var(--infra-ink); font-weight: 800; letter-spacing: .08em; text-decoration: none; white-space: nowrap; }
.infra-shell-brand b { color: #63d9a0; }
.infra-global-nav { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 5px; }
.infra-global-nav a, .infra-display-settings summary { display: inline-flex; align-items: center; min-height: 32px; padding: 0 10px; border: 1px solid rgba(145,166,193,.22); border-radius: 8px; color: var(--infra-muted); background: color-mix(in srgb, var(--infra-surface) 84%, transparent); font: inherit; font-size: .78rem; font-weight: 650; text-decoration: none; white-space: nowrap; cursor: pointer; }
.infra-global-nav a:hover, .infra-global-nav a[aria-current="page"], .infra-display-settings summary:hover { color: var(--infra-ink); border-color: #63d9a0aa; }
.infra-account-status { display: flex; align-items: center; gap: 7px; flex: none; }
.infra-account-name { max-width: 155px; overflow: hidden; color: var(--infra-muted); font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.infra-account-status a, .infra-account-status button { min-height: 32px; padding: 0 10px; border: 1px solid rgba(145,166,193,.22); border-radius: 8px; color: var(--infra-ink); background: transparent; font: inherit; font-size: .76rem; text-decoration: none; cursor: pointer; }
.infra-account-status [hidden] { display: none; }
.infra-account-status[hidden] { display: none; }
.infra-account-status button:hover, .infra-account-status a:hover { border-color: #63d9a0aa; }
.infra-display-settings { position: relative; flex: none; }
.infra-display-settings summary { list-style: none; }
.infra-display-settings summary::-webkit-details-marker { display: none; }
.infra-display-panel { position: absolute; right: 0; top: calc(100% + 8px); display: grid; gap: 10px; min-width: 170px; padding: 12px; border: 1px solid rgba(145,166,193,.25); border-radius: 12px; background: var(--infra-surface); box-shadow: 0 14px 40px #0006; }
.infra-display-panel label { display: grid; gap: 4px; color: var(--infra-muted); font-size: .76rem; }
.infra-display-panel select { min-height: 32px; border: 1px solid rgba(145,166,193,.3); border-radius: 7px; padding: 4px 8px; color: var(--infra-ink); background: var(--infra-bg); font: inherit; }
main h1, .personal-notes-heading h1 { font-size: clamp(1.8rem, 3vw, 2.35rem) !important; line-height: 1.15 !important; }
header.topbar > .brand, header.hub-header > .hub-brand, header.app-header > .brand, .auth-brand, .brand-mark, .auth-mark, .personal-notes-brand-mark { display: none !important; }
.signed-in-user, .logout-button, .personal-notes-account-control { display: none !important; }
html[data-infra-theme="light"] body { color: var(--infra-ink); background-color: var(--infra-bg); }
html[data-infra-theme="light"] body { background-image: none !important; }
html[data-infra-theme="light"] .ambient { display: none !important; }
html[data-infra-theme="light"] .topbar, html[data-infra-theme="light"] .hub-header, html[data-infra-theme="light"] .app-header, html[data-infra-theme="light"] .notebook-login-card, html[data-infra-theme="light"] .auth-card, html[data-infra-theme="light"] .login-card, html[data-infra-theme="light"] .widget, html[data-infra-theme="light"] .server, html[data-infra-theme="light"] .panel, html[data-infra-theme="light"] .hub-page, html[data-infra-theme="light"] .dashboard, html[data-infra-theme="light"] .login-view, html[data-infra-theme="light"] .auth-page { color: var(--infra-ink); background-color: var(--infra-surface); background-image: none; }
html[data-infra-theme="light"] .link-group, html[data-infra-theme="light"] .link-card, html[data-infra-theme="light"] .empty-state, html[data-infra-theme="light"] .search-box, html[data-infra-theme="light"] .balance-panel, html[data-infra-theme="light"] .billing-card, html[data-infra-theme="light"] .provider-card, html[data-infra-theme="light"] .chatgpt-reset-panel, html[data-infra-theme="light"] .session-panel, html[data-infra-theme="light"] .session-dialog, html[data-infra-theme="light"] .api-section, html[data-infra-theme="light"] .status-panel, html[data-infra-theme="light"] .freshness-note, html[data-infra-theme="light"] .stat-pair, html[data-infra-theme="light"] .metric-grid, html[data-infra-theme="light"] .intro { color: var(--infra-ink); background-color: var(--infra-surface); background-image: none; border-color: #ccd5df; }
html[data-infra-theme="light"] :is(.link-group,.link-card,.empty-state,.search-box,.balance-panel,.billing-card,.provider-card,.chatgpt-reset-panel,.session-panel,.session-dialog,.api-section,.status-panel,.freshness-note,.stat-pair,.metric-grid) :is(h1,h2,h3,h4,p,label,small) { color: var(--infra-ink) !important; }
html[data-infra-theme="light"] .link-card .card-url, html[data-infra-theme="light"] .link-group .group-count { color: var(--infra-muted) !important; }
html[data-infra-theme="light"] .personal-notes { --notes-ink: #182536 !important; --notes-muted: #586b80 !important; --notes-border: #ccd5df !important; --notes-surface: #fff !important; --notes-page-bg: #f2f5f9 !important; --notes-font-scale: var(--infra-font-scale) !important; color: var(--infra-ink); }
html[data-infra-theme="light"] .personal-notes.is-standalone::before { background: #f2f5f9 !important; }
html[data-infra-theme="dark"] .personal-notes { --notes-ink: #e7eef8 !important; --notes-muted: #9aabc1 !important; --notes-border: #34445a !important; --notes-surface: #111e30 !important; --notes-page-bg: #08111f !important; --notes-font-scale: var(--infra-font-scale) !important; color: var(--infra-ink); }
html[data-infra-theme="dark"] .personal-notes.is-standalone::before { background: linear-gradient(145deg,#08111f,#111e30 55%,#0b1423) !important; }
html[data-infra-theme="dark"] .personal-notes .personal-note-card { color: var(--infra-ink); border-color: var(--notes-border); }
@media (max-width: 900px) { .infra-shell-header, .infra-global-header { flex-wrap: wrap; justify-content: center; } .infra-shell-brand { order: 1; } .infra-account-status, .infra-display-settings { order: 2; } .infra-global-nav { order: 3; width: 100%; } }
@media (max-width: 560px) { .infra-global-nav { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; } .infra-global-nav a { min-height: 30px; padding-inline: 8px; font-size: .72rem; } }
