:root { color-scheme: dark; --bg:#0b0908; --surface:#15110e; --surface-2:#1d1712; --surface-3:#272017; --line:#403424; --line-soft:#2a231c; --gold:#e2b956; --gold-bright:#f5d985; --cream:#f1eadb; --muted:#a79d8e; --danger:#df735f; --success:#68b88b; --sidebar:220px; font-family:Roboto,Arial,sans-serif; }
* { box-sizing:border-box; }
html { background:var(--bg); }
body { margin:0; min-height:100dvh; background:radial-gradient(circle at 78% -20%,#332514 0,transparent 32%),var(--bg); color:var(--cream); font-size:14px; }
button,input,select,textarea { font:inherit; }
button,a,select { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:2px solid var(--gold-bright); outline-offset:2px; }
[hidden] { display:none !important; }
.login-shell { min-height:100dvh; display:grid; place-items:center; padding:24px; background:linear-gradient(90deg,rgba(0,0,0,.42),rgba(0,0,0,.06)),radial-gradient(circle at center,#2b2118,#080706 65%); }
.login-panel { width:min(410px,100%); padding:36px; border:1px solid var(--line); border-top:3px solid var(--gold); background:rgba(17,13,10,.96); box-shadow:0 28px 80px #000b; }
.brand-lockup { display:flex; align-items:center; gap:10px; color:inherit; text-decoration:none; }
.brand-mark { display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--gold); color:var(--gold); font-weight:900; font-size:19px; transform:rotate(45deg); }
.brand-mark::first-letter { transform:rotate(-45deg); }
.brand-lockup div { display:grid; line-height:1.05; letter-spacing:.08em; }
.brand-lockup strong { font-size:14px; letter-spacing:.18em; }
.brand-lockup div span { margin-top:5px; color:var(--gold); font-size:9px; font-weight:900; letter-spacing:.25em; }
.brand-lockup.compact .brand-mark { width:31px; height:31px; font-size:15px; }
.eyebrow { margin:0 0 7px; color:var(--gold); font-size:10px; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
h1,h2,p { margin-top:0; }
h1 { margin-bottom:8px; font-size:25px; line-height:1.15; }
h2 { margin:0; font-size:16px; letter-spacing:.01em; }
.login-panel .eyebrow { margin-top:32px; }
.muted,.field-help { color:var(--muted); line-height:1.55; }
.text-link { display:inline-block; margin-top:22px; color:var(--gold-bright); }
.form-stack,.form-grid { display:grid; gap:15px; }
.form-stack { margin-top:25px; }
label { display:grid; gap:7px; color:#d9cdb8; font-size:12px; font-weight:700; }
input,select,textarea { width:100%; min-height:40px; padding:9px 11px; border:1px solid var(--line); border-radius:2px; background:#0d0b09; color:var(--cream); user-select:text; }
textarea { resize:vertical; line-height:1.5; }
select:disabled,input:disabled,textarea:disabled { opacity:.5; cursor:not-allowed; }
label small { color:var(--muted); font-weight:400; line-height:1.4; }
.check-label { display:flex; align-items:center; gap:9px; min-height:40px; }
.check-label input { width:16px; min-height:16px; }
.button { min-height:38px; padding:9px 14px; border:1px solid var(--line); border-radius:2px; background:var(--surface-3); color:var(--cream); font-weight:800; cursor:pointer; }
.button.primary { border-color:#b38d3e; background:linear-gradient(#e5bd5d,#bd8e34); color:#1c1408; }
.button.danger { border-color:#914c40; background:#6f342c; color:#ffe7df; }
.button.quiet { background:#16120e; color:#d6cbb8; }
.button:disabled { opacity:.38; cursor:not-allowed; filter:grayscale(1); }
.form-message { min-height:18px; margin:0; color:#d6ab66; font-size:12px; }
.portal { min-height:100dvh; display:grid; grid-template:58px 1fr / var(--sidebar) 1fr; }
.topbar { position:sticky; z-index:20; top:0; grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; padding:0 22px; border-bottom:1px solid var(--line); background:#100d0beF; backdrop-filter:blur(12px); }
.topbar-actions { display:flex; align-items:center; gap:17px; }
.identity { display:grid; padding-left:17px; border-left:1px solid var(--line); line-height:1.2; text-align:right; }
.identity span,.connection-state { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.1em; }
.connection-state::before { content:""; display:inline-block; width:6px; height:6px; margin-right:7px; border-radius:50%; background:var(--success); }
.menu-toggle { display:none; }
.sidebar { position:sticky; top:58px; height:calc(100dvh - 58px); display:flex; flex-direction:column; justify-content:space-between; padding:22px 13px; border-right:1px solid var(--line); background:linear-gradient(180deg,#17120e,#0d0b09); }
.sidebar nav { display:grid; gap:5px; }
.nav-item { display:flex; align-items:center; gap:12px; min-height:43px; padding:0 12px; border:0; border-left:2px solid transparent; background:transparent; color:#9f9587; text-align:left; cursor:pointer; }
.nav-item span { color:#695b49; font:700 9px monospace; }
.nav-item:hover,.nav-item.active { border-left-color:var(--gold); background:#241c13; color:var(--cream); }
.sidebar-foot { display:grid; gap:10px; padding:14px 12px 2px; border-top:1px solid var(--line-soft); }
.sidebar-foot span { color:#6f6455; font-size:9px; font-weight:900; letter-spacing:.18em; }
.sidebar-foot a { color:#cdbf9f; font-size:12px; }
.workspace { min-width:0; padding:26px clamp(18px,3vw,44px) 48px; }
.page-head { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:21px; padding-bottom:17px; border-bottom:1px solid var(--line-soft); }
.page-head h1 { margin:0; font-size:24px; }
.page-tools { display:flex; align-items:end; gap:12px; }
.row-subtext { display:block; margin-top:3px; color:var(--muted); font-size:10px; }
.notice { margin:0 0 18px; padding:11px 13px; border-left:3px solid var(--gold); background:#211a12; color:#dbcba9; }
.notice.error { border-color:var(--danger); background:#2c1714; color:#ffc3b7; }
.notice.success { border-color:var(--success); background:#12251b; color:#bce6cc; }
.view { display:none; }
.view.active { display:block; }
.metric-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-bottom:18px; border:1px solid var(--line); background:var(--surface); }
.metric { min-width:0; padding:17px 19px; border-right:1px solid var(--line-soft); }
.metric:last-child { border-right:0; }
.metric span,.metric small { display:block; color:var(--muted); font-size:10px; letter-spacing:.07em; text-transform:uppercase; }
.metric strong { display:block; overflow:hidden; margin:8px 0 5px; color:var(--cream); font-size:22px; line-height:1; text-overflow:ellipsis; }
.metric small { color:#756b5e; letter-spacing:0; text-transform:none; }
.section-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.panel { min-width:0; margin-bottom:16px; border:1px solid var(--line-soft); background:linear-gradient(145deg,rgba(29,23,18,.96),rgba(17,14,11,.96)); }
.panel.span-2 { grid-column:span 2; }
.panel-head { min-height:67px; display:flex; align-items:center; justify-content:space-between; gap:15px; padding:14px 17px; border-bottom:1px solid var(--line-soft); }
.panel-head .eyebrow { margin-bottom:5px; }
.text-button { border:0; background:none; color:var(--gold); font-weight:700; cursor:pointer; }
.detail-list { display:grid; grid-template-columns:1fr auto; margin:0; padding:10px 17px; }
.detail-list dt,.detail-list dd { margin:0; padding:10px 0; border-bottom:1px solid var(--line-soft); }
.detail-list dt { color:var(--muted); }
.detail-list dd { max-width:170px; overflow-wrap:anywhere; text-align:right; font-weight:700; }
.table-wrap { width:100%; overflow:auto; }
table { width:100%; border-collapse:collapse; white-space:nowrap; }
th,td { height:44px; padding:0 15px; border-bottom:1px solid var(--line-soft); text-align:left; font-size:12px; }
th { position:sticky; top:0; z-index:1; background:#17120e; color:#8f8373; font-size:9px; letter-spacing:.1em; text-transform:uppercase; }
td { color:#d8cdbd; }
td.numeric { font-variant-numeric:tabular-nums; text-align:right; }
tbody tr:hover { background:#211a13; }
.data-state { display:grid; place-items:center; min-height:145px; padding:24px; color:var(--muted); text-align:center; }
.data-state.loading::before { content:""; width:20px; height:20px; margin-bottom:12px; border:2px solid var(--line); border-top-color:var(--gold); border-radius:50%; animation:spin .7s linear infinite; }
.data-state.error { color:#eaa092; }
@keyframes spin { to { transform:rotate(360deg); } }
.badge { display:inline-flex; align-items:center; min-height:21px; padding:2px 7px; border:1px solid var(--line); color:#bdb2a1; font-size:10px; text-transform:uppercase; }
.badge.success { border-color:#315d44; color:#84cda1; }
.badge.warning { border-color:#765a2b; color:#ecc770; }
.badge.danger { border-color:#713d34; color:#ed9888; }
.search-field { width:min(260px,100%); }
.search-field input { min-height:34px; }
.inline-filters { display:flex; align-items:end; gap:8px; }
.inline-filters label { font-size:10px; }
.inline-filters input { min-height:34px; }
.report-panel { margin-top:16px; }
.transfer-layout { grid-template-columns:minmax(280px,.8fr) repeat(2,minmax(0,1fr)); }
.form-grid,.policy-form { padding:18px; }
.field-help { margin:0; font-size:11px; }
.request-reference { display:grid; gap:4px; padding:10px; border:1px dashed var(--line); background:#0d0b09; }
.request-reference span { color:var(--muted); font-size:10px; text-transform:uppercase; }
.request-reference code { overflow-wrap:anywhere; color:var(--gold-bright); font-size:11px; user-select:text; }
.admin-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.policy-form { display:grid; gap:17px; }
.columns-3 { grid-template-columns:repeat(3,minmax(0,1fr)); padding:0; }
details { border:1px solid var(--line-soft); background:#100d0b; }
summary { padding:12px; color:#d5c7ae; cursor:pointer; }
details label { padding:0 12px 12px; }
.confirm-dialog { width:min(480px,calc(100% - 28px)); padding:0; border:1px solid var(--line); border-top:3px solid var(--gold); border-radius:2px; background:#17120e; color:var(--cream); box-shadow:0 30px 100px #000d; }
.confirm-dialog::backdrop { background:#050403c9; backdrop-filter:blur(3px); }
.confirm-dialog form { padding:25px; }
.dialog-mark { display:grid; place-items:center; float:right; width:32px; height:32px; border:1px solid var(--gold); border-radius:50%; color:var(--gold); font-weight:900; }
.confirm-details { display:grid; grid-template-columns:1fr auto; margin:20px 0; border-top:1px solid var(--line-soft); }
.confirm-details dt,.confirm-details dd { margin:0; padding:10px 0; border-bottom:1px solid var(--line-soft); }
.confirm-details dt { color:var(--muted); }
.confirm-details dd { max-width:260px; overflow-wrap:anywhere; text-align:right; font-weight:700; }
.dialog-warning { color:#d9b878; font-size:12px; line-height:1.5; }
.dialog-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:20px; }
@media (max-width:1000px) { .metric-strip { grid-template-columns:1fr 1fr; } .metric:nth-child(2) { border-right:0; } .metric:nth-child(-n+2) { border-bottom:1px solid var(--line-soft); } .section-grid,.transfer-layout { grid-template-columns:1fr 1fr; } .panel.span-2 { grid-column:span 1; } .columns-3 { grid-template-columns:1fr 1fr; } }
@media (max-width:720px) { :root { --sidebar:0px; } .portal { grid-template:56px 1fr / 1fr; } .topbar { padding:0 13px; } .topbar>.brand-lockup { display:none; } .menu-toggle { display:block; min-height:36px; border:1px solid var(--line); background:#17120e; color:var(--cream); } .connection-state,.identity span { display:none; } .topbar-actions { gap:8px; } .identity { padding-left:0; border:0; } .sidebar { position:fixed; z-index:30; top:56px; left:0; width:min(280px,86vw); height:calc(100dvh - 56px); transform:translateX(-105%); transition:transform .18s ease; box-shadow:12px 0 30px #000a; } .sidebar.open { transform:none; } .workspace { padding:20px 13px 40px; } .section-grid,.transfer-layout,.admin-grid,.columns-3 { grid-template-columns:1fr; } .panel.span-2 { grid-column:auto; } .panel-head.responsive { align-items:stretch; flex-direction:column; } .inline-filters { display:grid; grid-template-columns:1fr 1fr auto; } }
.portal-orientation-gate { display:none; }
@media (orientation:portrait) {
  .portal-orientation-gate { position:fixed; inset:0; z-index:9999; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:24px; text-align:center; background:#0b0908; color:#e2b956; }
  .portal-orientation-gate p { color:#f1eadb; line-height:1.6; }
  body > :not(.portal-orientation-gate) { display:none !important; }
  dialog::backdrop { display:none; }
}