:root { --panel: #171c28; --panel-soft: #202838; --border: #303a4e; --accent: #7c6cff; }
body { background: #0e1118; color: #edf0f6; min-height: 100vh; }
.panel-nav { background: rgba(14,17,24,.93); backdrop-filter: blur(14px); }
.navbar-brand { letter-spacing: .02em; color: #fff; }.navbar-brand span, .brand-mark span { color: var(--accent); }
.nav-link { color: #9da8b9; }.nav-link:hover, .nav-link.active { color: #fff !important; }
.panel-card, .metric-card { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 1.25rem; }
.metric-card { min-height: 125px; display:flex; flex-direction:column; justify-content:space-between; background: linear-gradient(140deg, #1d2433, #151a25); }
.metric-label { color: #9da8b9; font-size: .88rem; }.metric-value { font-size: 2.25rem; line-height: 1; font-weight: 700; }
.table { --bs-table-bg: transparent; --bs-table-color: #edf0f6; --bs-table-border-color: var(--border); }
.form-control, .form-select { background: #10151f; border-color: #364055; color: #f2f4f8; }.form-control:focus { background:#10151f; color:#fff; border-color: var(--accent); box-shadow: 0 0 0 .2rem rgba(124,108,255,.15); }
.btn-primary { --bs-btn-bg: var(--accent); --bs-btn-border-color: var(--accent); --bs-btn-hover-bg: #6758e8; --bs-btn-hover-border-color: #6758e8; }
.title-cell { max-width: 520px; }.editor { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; line-height:1.5; }.source-text { white-space:pre-wrap; line-height:1.6; color:#d6dce7; }
.media-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:.75rem; }.media-grid img, .media-grid video { width:100%; height:130px; object-fit:cover; border-radius:9px; border:1px solid var(--border); }
.context-cell { max-width:300px; display:block; white-space:normal; overflow-wrap:anywhere; }.login-shell { min-height:100vh; display:grid; place-items:center; }.login-card { width:min(100%,430px); padding:2.25rem; background:var(--panel); border:1px solid var(--border); border-radius:18px; }.brand-mark { font-size:2.5rem; font-weight:800; letter-spacing:-.1em; }
@media (max-width: 767px) { .title-cell { max-width: 200px; } .panel-card, .metric-card { border-radius: 11px; } }