/* X3 Legal — shared dashboard shell (CSA-style header, brighter navy) */
:root{--x3cy:#22D3EE;--x3cy2:#67E8F9;--x3bg:#0A1322;--x3panel:#0E1D31;--x3ln:#22456a;--x3mut:#C3D2E0;--x3faint:#7d94ab}
body.x3lsh{margin:0;background:var(--x3bg);color:#fff;font-family:Geist,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;padding:126px 0 0 262px}
/* rolling banner */
.x3l-banner{position:fixed;top:0;left:0;right:0;height:30px;z-index:70;display:flex;align-items:center;justify-content:center;font:600 12.5px/1 Geist,system-ui;color:#fff;background:linear-gradient(90deg,#00B2FD,#67E8F9,#2DD4BF,#A855F7,#EC4899,#FBBF24);padding:0 16px;text-align:center}
/* brand box — big logo, centered, matches header height */
.x3l-brand{position:fixed;top:30px;left:0;width:262px;height:96px;z-index:65;display:flex;align-items:center;justify-content:center;border-right:1px solid #17324b;border-bottom:1px solid #17324b;background:#0B1A2E}
.x3l-brand img{height:72px;width:auto;display:block}
/* topbar — same height as brand box; centered big title + ticker */
.x3l-top{position:fixed;top:30px;left:262px;right:0;height:96px;z-index:60;display:flex;align-items:center;justify-content:flex-end;gap:14px;padding:0 24px;border-bottom:1px solid #17324b;background:rgba(11,26,46,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.x3l-center{position:absolute;left:0;right:0;top:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;padding:0 230px}
.x3l-title{font:900 31px/1 Geist;letter-spacing:.04em;color:var(--x3cy);text-transform:uppercase;text-shadow:0 0 24px rgba(34,211,238,.35)}
.x3l-ticker{margin-top:8px;max-width:600px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.x3l-ticker-track{display:inline-flex;white-space:nowrap;animation:x3lmarq 30s linear infinite}
.x3l-ticker-track span{font:600 12px/1 Geist;letter-spacing:.03em;text-transform:uppercase}
.x3l-ticker-track>span>span{color:#9fc2d8}
.x3l-live{color:#34d399!important;font-weight:800;letter-spacing:.1em}
.x3l-sep{margin:0 12px;color:#3a5c78}
@keyframes x3lmarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* right controls */
.x3l-right{position:relative;z-index:2;display:flex;align-items:center;gap:12px}
.x3l-bell{width:44px;height:44px;border-radius:12px;border:1px solid var(--x3ln);background:#0D2136;display:flex;align-items:center;justify-content:center;color:#9fc2d8;text-decoration:none}
.x3l-bell:hover{border-color:var(--x3cy);color:#fff}
.x3l-bell svg{width:20px;height:20px}
.x3l-user{display:flex;align-items:center;gap:10px;background:#0D2136;border:1px solid var(--x3ln);border-radius:12px;padding:7px 13px 7px 9px;cursor:pointer;font-family:inherit}
.x3l-user:hover{border-color:#2f5f86}
.x3l-user .av{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#123a55,#0e2a40);display:flex;align-items:center;justify-content:center;color:var(--x3cy);flex:none}
.x3l-user .av svg{width:19px;height:19px}
.x3l-user .txt{display:flex;flex-direction:column;line-height:1.15;text-align:left}
.x3l-user .nm{font:700 14px Geist;color:#fff;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.x3l-user .co{font:500 11.5px Geist;color:#9fb3c8;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.x3l-user .cx{color:var(--x3faint);font-size:11px}
.x3l-menu{position:fixed;top:132px;right:24px;z-index:80;width:216px;background:var(--x3panel);border:1px solid var(--x3ln);border-radius:12px;box-shadow:0 24px 60px -20px rgba(0,0,0,.8);padding:6px;display:none}
.x3l-menu.open{display:block}
.x3l-menu a{display:flex;align-items:center;gap:9px;padding:10px 11px;border-radius:8px;color:var(--x3mut);font:600 13px Geist;text-decoration:none}
.x3l-menu a:hover{background:#12314a;color:#fff}
.x3l-menu a svg{width:15px;height:15px}
.x3l-menu .sep{height:1px;background:var(--x3ln);margin:4px 0}
/* sidebar */
.x3l-side{position:fixed;top:126px;left:0;bottom:0;width:262px;z-index:55;overflow-y:auto;border-right:1px solid #17324b;background:#0B1A2E;padding:12px 12px 20px;display:flex;flex-direction:column}
.x3l-side a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;color:var(--x3mut);font:600 14px/1.2 Geist;text-decoration:none;transition:.14s}
.x3l-side a:hover{background:#12314a;color:#fff}
.x3l-side a.on{background:linear-gradient(90deg,rgba(34,211,238,.20),transparent);color:#fff;border:1px solid #2f5f86}
.x3l-side svg{width:17px;height:17px;flex:none;stroke:currentColor}
.x3l-side a .lk{margin-left:auto;display:none;align-items:center}
.x3l-side a.locked{opacity:.5}
.x3l-side a.locked:hover{background:#12314a;opacity:.7}
.x3l-side a.locked .lk{display:inline-flex;color:#6f8aa3}
.x3l-grp{font:800 11px/1 Geist;letter-spacing:.16em;text-transform:uppercase;color:#6f8aa3;padding:16px 12px 7px}
.x3l-note{margin-top:auto;background:var(--x3panel);border:1px solid var(--x3ln);border-radius:14px;padding:14px}
.x3l-note b{display:flex;align-items:center;gap:7px;font:800 11.5px/1 Geist;letter-spacing:.1em;text-transform:uppercase;color:var(--x3cy2)}
.x3l-note b svg{width:15px;height:15px}
.x3l-note p{margin:7px 0 0;font:400 12px/1.5 Geist;color:#9fb3c8}
/* burger (mobile) */
.x3l-burger{display:none;position:fixed;top:38px;left:12px;z-index:66;width:44px;height:44px;align-items:center;justify-content:center;background:#0B1A2E;border:1px solid #17324b;border-radius:10px;color:#fff;cursor:pointer}
.x3l-burger svg{width:20px;height:20px}
@media(max-width:960px){
  body.x3lsh{padding-left:0}
  .x3l-brand{left:auto;right:14px;width:auto;padding:0 8px;border:0;background:transparent;justify-content:flex-end}
  .x3l-brand img{height:46px}
  .x3l-top{left:0;padding-left:64px;justify-content:flex-start}
  .x3l-center{display:none}
  .x3l-user .txt{display:none}
  .x3l-side{top:0;padding-top:132px;transform:translateX(-100%);transition:transform .22s ease;box-shadow:0 0 50px rgba(0,0,0,.7)}
  .x3l-side.open{transform:none}
  .x3l-burger{display:flex}
}
