/* UNA Fund — dark instrument panel, gold accent. Presentation only. */
:root{
  --bg:#08090C; --panel-top:rgba(26,28,38,.72); --panel-bot:rgba(14,16,23,.85);
  --line:#1E2230; --line-2:#2B3044; --glass:rgba(150,160,190,.12);
  --ink:#EAEDF4; --muted:#8D95A8; --faint:#5A6172;
  --gold:#E8C574; --gold-dim:#9C7F3E;
  --green:#4FE39B; --red:#F0685E; --amber:#F2B048; --blue:#6EA8FF; --violet:#9b8cf5;
  --mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --r:16px; --shadow:0 18px 50px -22px rgba(0,0,0,.85);
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.45;
  -webkit-font-smoothing:antialiased;max-width:1060px;margin:0 auto;
  padding:max(14px,env(safe-area-inset-top)) 14px 80px;min-height:100vh;position:relative}
.aurora{position:fixed;inset:0;z-index:-1;pointer-events:none;background:
  radial-gradient(900px 500px at 50% -10%, rgba(50,45,30,.5) 0%, transparent 60%),
  radial-gradient(700px 600px at 100% 15%, rgba(232,197,116,.07) 0%, transparent 55%),
  radial-gradient(700px 600px at -5% 40%, rgba(110,168,255,.06) 0%, transparent 55%),
  var(--bg)}
h1,h2,h3{margin:0}
button{font-family:inherit;cursor:pointer;border:none;color:inherit}
input,select,textarea{font-family:var(--mono);background:#0b0e15;border:1px solid var(--line-2);
  border-radius:9px;color:var(--ink);padding:9px 11px;font-size:13px}
input:focus-visible,select:focus-visible,button:focus-visible,textarea:focus-visible{
  outline:2px solid rgba(232,197,116,.5);outline-offset:2px}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.eyebrow{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);font-weight:700}
.muted{color:var(--muted)} .pos{color:var(--green)} .neg{color:var(--red)}

/* topbar */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:6px 2px 18px;gap:12px}
.brand{display:flex;align-items:center;gap:12px}
.brand .mark{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#2a2415,#151009);border:1px solid rgba(232,197,116,.35);
  color:var(--gold);font-weight:800;font-size:15px;letter-spacing:.03em;
  box-shadow:0 0 18px -4px rgba(232,197,116,.45)}
.brand .seal{display:flex;flex:none;width:46px;height:46px;filter:drop-shadow(0 0 10px rgba(232,197,116,.35))}
.brand .seal svg{width:46px;height:46px}
.brand .name{font-weight:800;font-size:16px;letter-spacing:.16em;
  background:linear-gradient(90deg,#F5EEDC,#C9B383);-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent}
.brand .sub{font-size:11px;color:var(--muted)}
.userchip{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted)}
.userchip button{background:none;border:1px solid var(--line-2);border-radius:8px;padding:6px 11px;
  font-size:11px;color:var(--muted)} .userchip button:hover{color:var(--ink)}

/* tabs */
.tabs{display:flex;gap:8px;margin-bottom:16px}
.tab{background:linear-gradient(180deg,var(--panel-top),var(--panel-bot));border:1px solid var(--glass);
  border-radius:11px;padding:9px 18px;font-size:12.5px;font-weight:700;letter-spacing:.06em;color:var(--muted)}
.tab.on{color:var(--gold);border-color:rgba(232,197,116,.4);box-shadow:0 0 16px -6px rgba(232,197,116,.5)}

/* panels */
.panel{background:linear-gradient(180deg,var(--panel-top),var(--panel-bot));
  border:1px solid var(--glass);border-radius:var(--r);box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.04);
  padding:18px;margin-bottom:14px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.panel-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:14px}
.panel-h .eyebrow:first-child::before{content:"";display:inline-block;width:14px;height:2px;
  border-radius:2px;background:var(--gold);margin-right:8px;vertical-align:middle}

/* stat cards */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.stat{background:linear-gradient(180deg,var(--panel-top),var(--panel-bot));border:1px solid var(--glass);
  border-radius:13px;padding:13px 15px}
.stat .lab{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:700}
.stat .val{font-size:19px;white-space:nowrap;font-weight:700;font-family:var(--mono);margin-top:4px;letter-spacing:-.01em}
.stat .sub{font-size:10.5px;color:var(--muted);margin-top:2px}
.stat.hero .val{font-size:22px;background:linear-gradient(90deg,#F5EEDC,#E8C574);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.livedot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);
  box-shadow:0 0 8px 1px rgba(79,227,155,.7);margin-right:5px;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}

/* tables */
table{border-collapse:collapse;width:100%;font-size:13px}
th{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);text-align:left;
  padding:7px 9px;border-bottom:1px solid var(--line)}
td{padding:9px;border-bottom:1px solid var(--line);vertical-align:middle}
tr:last-child td{border-bottom:none}
tr.click{cursor:pointer} tr.click:hover td{background:rgba(255,255,255,.025)}
.chip{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  padding:3px 8px;border-radius:6px;background:#191d2a;color:var(--muted)}
.chip.cash{color:var(--blue)} .chip.low{color:var(--green)} .chip.medium{color:var(--amber)} .chip.high{color:var(--red)}
.chip.live{color:var(--green);border:1px solid rgba(79,227,155,.3);background:rgba(79,227,155,.08)}
/* vote chips — .chip sets its own colour after .pos/.neg, so these need the extra specificity */
.chip.pos{color:var(--green);border:1px solid rgba(79,227,155,.28);background:rgba(79,227,155,.08)}
.chip.neg{color:var(--red);border:1px solid rgba(240,104,94,.28);background:rgba(240,104,94,.08)}
.chip.muted{color:var(--muted)}

/* charts */
.chartwrap{overflow-x:auto}
svg text{font-family:var(--mono);fill:var(--muted)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11px;color:var(--muted);margin-top:8px}
.legend b{font-weight:700}

/* forms */
.frm{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.frm input,.frm select{flex:1;min-width:110px}
.btn{background:linear-gradient(180deg,#2c2412,#1a1408);border:1px solid rgba(232,197,116,.4);
  color:var(--gold);border-radius:10px;padding:10px 18px;font-weight:700;font-size:12.5px;letter-spacing:.05em}
.btn:hover{box-shadow:0 0 14px -4px rgba(232,197,116,.6)}
.btn.ghost{background:none;border-color:var(--line-2);color:var(--muted)}
.btn.danger{border-color:rgba(240,104,94,.4);color:var(--red);background:linear-gradient(180deg,#241010,#180b0b)}
.note{font-size:11.5px;color:var(--muted)}

/* editor drawer */
.editor{border:1px solid var(--line-2);border-radius:12px;padding:14px;margin-top:12px;background:rgba(0,0,0,.25)}
.editor .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:9px}
.editor label{display:flex;flex-direction:column;gap:4px;font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--faint);font-weight:700}

/* login */
.loginwrap{min-height:88vh;display:flex;align-items:center;justify-content:center}
.logincard{width:min(360px,92vw);text-align:center}
.logincard .mark{margin:0 auto 14px;width:54px;height:54px;font-size:20px}
.logincard input{width:100%;margin-bottom:10px;padding:12px}
.logincard .btn{width:100%;padding:13px}
.loginerr{color:var(--red);font-size:12px;min-height:18px;margin:6px 0}

.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(12px);
  background:#161a24;border:1px solid var(--line-2);border-radius:12px;padding:12px 18px;
  font-size:13px;opacity:0;pointer-events:none;transition:.25s;z-index:60;box-shadow:var(--shadow)}
.toast.show{opacity:1;transform:translateX(-50%)}
.toast.err{border-color:rgba(240,104,94,.5)}
/* ---------- mobile ---------- */
@media(max-width:680px){
  body{padding:max(10px,env(safe-area-inset-top)) 10px 60px}
  .topbar{padding-bottom:12px}
  .brand .sub{max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .userchip span{max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tabs{position:sticky;top:0;z-index:30;padding:8px 0;margin:0 0 12px;
    background:linear-gradient(180deg,rgba(8,9,12,.96),rgba(8,9,12,.88));
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  .tab{flex:1;text-align:center;padding:10px 4px;font-size:12px;letter-spacing:.03em}
  .stats{grid-template-columns:1fr 1fr;gap:8px}
  .stat.hero{grid-column:1 / -1}
  .stat .val{font-size:17px} .stat.hero .val{font-size:24px}
  .panel{padding:13px;border-radius:14px;margin-bottom:11px}
  .panel-h{flex-wrap:wrap;gap:6px;row-gap:4px}
  /* tables become horizontal scrollers — nothing gets crushed */
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  th,td{white-space:nowrap}
  td .note{white-space:normal;min-width:120px}
  #benchChart{min-width:560px}
  .frm{gap:7px}
  .frm input,.frm select{flex:1 1 calc(50% - 7px);min-width:0;max-width:none !important}
  .frm .btn{flex:1 1 100%}
  .editor .grid{grid-template-columns:1fr 1fr}
  .report{margin:14px auto}
  .rhead{flex-direction:column;align-items:flex-start;gap:8px}
  .rhead > div[style*="text-align"]{text-align:left !important}
}

/* reconciliation warning (admin): stables moved between spot and Earn since last update */
.warnbanner{border:1px solid rgba(242,176,72,.45);background:rgba(242,176,72,.08);
  border-radius:12px;padding:12px 15px;font-size:12.5px;line-height:1.5;color:var(--ink);
  margin-bottom:12px}
.warnbanner b{color:var(--amber)}

/* access control — external (view-only) accounts never see admin controls */
body.external .admin-only{display:none !important}
.ro-badge{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--amber);border:1px solid rgba(242,176,72,.4);background:rgba(242,176,72,.08);
  border-radius:6px;padding:3px 7px}

/* investor logins */
#usrTable td .chip.admin{color:var(--gold)} #usrTable td .chip.external{color:var(--blue)}
#usrCred{font-family:var(--mono);background:rgba(79,227,155,.06);border:1px solid rgba(79,227,155,.3);
  border-radius:10px;padding:11px 13px;color:var(--ink);word-break:break-all}
#usrCred b{color:var(--green)}

/* positions totals row */
#posTable tr.total td, #allocTable tr.total td, #trMonthly tr.total td{border-top:2px solid var(--line-2);
  border-bottom:none;background:rgba(232,197,116,.05);font-variant-numeric:tabular-nums}

/* portfolio analytics */
.anaGrpH{margin:16px 0 8px;color:var(--gold-dim)}
.anaGrpH:first-of-type{margin-top:2px}
#anaAssets td, #allocTable td, #anaOpt td{vertical-align:middle}
#anaOpt tr:hover td{background:rgba(255,255,255,.02)}

/* document vault */
.dropzone{border:2px dashed var(--line-2);border-radius:14px;padding:34px 18px;text-align:center;
  cursor:pointer;transition:.18s;background:rgba(0,0,0,.15)}
.dropzone:hover{border-color:rgba(232,197,116,.5)}
.dropzone.over{border-color:var(--gold);background:rgba(232,197,116,.06)}
.dz-inner{display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none}
.dz-ico{font-size:30px;color:var(--gold)}
.dz-browse{color:var(--gold);text-decoration:underline}
#docsTable a{color:var(--ink);text-decoration:none;font-weight:600}
#docsTable a:hover{color:var(--gold)}