*{box-sizing:border-box;margin:0;padding:0}
:root{
  /* Coastal blue — darker backgrounds, max contrast text */
  --t1:#06111a;--t2:#0c2030;--t3:#163a55;--t4:#1e4a6a;
  --acc:#0e3a5a;--acc2:#0a2a44;
  --pos:#1a7a50;--pos2:#136040;--warn:#6b2d08;--warn2:#4d1d06;--neg:#a03030;--neg2:#802020;
  --bg0:#7a9eb8;--bg1:#8ab0c8;--bg2:#98c0d8;--bg3:#a8cee6;
  --brd:#5a86a4;--brd2:#6a98b8;
  --bg:#98c0d8;
  --orange:#e08010;--pink:#a03868;
}
/* Mobile */
@media(max-width:768px){
  :root{
    --bg0:#7098b4;--bg1:#80aac4;--bg2:#8ebad4;--bg3:#9ec8e2;
    --brd:#5080a0;--brd2:#6090b2;
    --bg:#8ebad4;
  }
}
body{background:var(--bg0);color:var(--t1);font-family:'DM Sans',system-ui,sans-serif;padding:20px 24px;min-height:100vh;font-size:15px;line-height:1.5;opacity:0;transition:opacity .3s ease;border-top:4px solid transparent;border-image:linear-gradient(90deg,#0e3050,#081e38,#1a4a68,#0e3858,#124060) 1}
body.loaded{opacity:1}
/* ============================================================
   ROLE-BASED VISIBILITY
   Roles: admin > planner (board) > viewer > owner > community
   - admin:     sees everything
   - planner:   sees everything except Admin menu
   - viewer:    sees Planning (read-only) + Community + Library; no Admin, no board actions
   - owner:     sees My Unit + Community + Library only
   - community: sees Community + Library only
   ============================================================ */

/* --- planner: hide Admin menu --- */
body.role-planner .need-admin { display:none!important }

/* --- viewer: hide Admin + edit-only action menus, but keep Planning tabs visible --- */
body.role-viewer .need-admin  { display:none!important }
/* hide toolbar File/Reports/Requests/Log dropdowns but NOT planning tabs */
body.role-viewer #vs-requests-wrap { display:none!important }
body.role-viewer .toolbar-actions .tb-dd-wrap.need-board { display:none!important }
body.role-viewer .mob-nav-section.need-board { display:none!important }
/* keep Planning mobile section visible for viewer — override the above */
body.role-viewer #mob-acc-planning-wrap { display:block!important }

/* --- owner: hide Admin, board actions, Planning tabs, Settings --- */
body.role-owner .need-admin  { display:none!important }
body.role-owner .need-board  { display:none!important }
body.role-owner #vs-planning-wrap,
body.role-owner #vs-requests-wrap,
body.role-owner #vs-settings,
body.role-owner .toolbar-actions .tb-dd-wrap:not(.tb-dd-help) { display:none!important }
body.role-owner #planner-layout,
body.role-owner #yv-ctr,
body.role-owner #capex-ctr,
body.role-owner #settings-ctr { display:none!important }
/* owner mob nav: hide Planning + Admin sections */
body.role-owner .mob-nav-section.need-board,
body.role-owner .mob-nav-section.need-admin { display:none!important }

/* --- community: same as owner but also hide My Unit --- */
body.role-community .need-admin  { display:none!important }
body.role-community .need-board  { display:none!important }
body.role-community #vs-planning-wrap,
body.role-community #vs-requests-wrap,
body.role-community #vs-settings,
body.role-community #vs-myunit,
body.role-community .toolbar-actions .tb-dd-wrap:not(.tb-dd-help) { display:none!important }
body.role-community #planner-layout,
body.role-community #yv-ctr,
body.role-community #mu-ctr,
body.role-community #capex-ctr,
body.role-community #settings-ctr { display:none!important }
body.role-community .mob-nav-section.need-board,
body.role-community .mob-nav-section.need-admin { display:none!important }

/* --- legacy role names (belt-and-suspenders) --- */
body.role-board .need-admin { display:none!important }
body.role-resident .need-board, body.role-resident .need-admin { display:none!important }

.role-badge{display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;text-transform:uppercase;letter-spacing:.04em}
.role-badge.admin{background:#c84040;color:#fff}
.role-badge.board{background:#0e6b8a;color:#fff}
.role-badge.resident{background:#6b7280;color:#fff}
.quote-badge{display:inline-flex;align-items:center;gap:3px;font-size:10px;padding:2px 7px;border-radius:8px;background:rgba(14,116,144,.15);color:#30a8b8;font-weight:600}
.quote-badge.expired{background:rgba(239,68,68,.15);color:var(--neg)}
.vq-row{display:flex;gap:8px;align-items:center;margin-top:6px;font-size:11px}
.vq-row input,.vq-row select{padding:3px 6px;background:var(--bg);border:1px solid var(--brd);border-radius:4px;color:var(--t1);font-size:11px;font-family:inherit}
.vq-row input[type=text]{flex:1;min-width:80px}
.vq-row input[type=number]{width:80px}
.vq-row input[type=date]{width:120px}
@keyframes birdbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes birdtilt{0%,100%{transform:rotate(0deg)}30%{transform:rotate(8deg)}60%{transform:rotate(-5deg)}}
@keyframes birdpeck{0%,80%,100%{transform:rotate(0deg)}85%{transform:rotate(15deg)}90%{transform:rotate(0deg)}95%{transform:rotate(12deg)}}
.bird-bob{animation:birdbob 3s ease-in-out infinite}
.bird-tilt{animation:birdtilt 4s ease-in-out 1s infinite}
.bird-peck{animation:birdpeck 6s ease-in-out 2s infinite;transform-origin:bottom center}

@keyframes birdflutter{0%,100%{transform:translateY(0) rotate(0deg)}25%{transform:translateY(-3px) rotate(3deg)}75%{transform:translateY(-1px) rotate(-2deg)}}
@keyframes birdsoar{0%,100%{transform:translateX(0) rotate(0deg)}50%{transform:translateX(4px) rotate(-4deg)}}
@keyframes birdhop{0%,100%{transform:translateY(0)}40%{transform:translateY(-6px)}60%{transform:translateY(-4px)}}
@keyframes birdwatch{0%,100%{transform:rotate(0deg)}20%{transform:rotate(12deg)}40%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}}
.bird-flutter{animation:birdflutter 2.5s ease-in-out .5s infinite}
.bird-soar{animation:birdsoar 5s ease-in-out infinite}
.bird-hop{animation:birdhop 2s ease-in-out 1.5s infinite}
.bird-watch{animation:birdwatch 7s ease-in-out 3s infinite}
/* Fixed ambient birds */
.ambient-birds{position:fixed;pointer-events:none;z-index:0;top:0;left:0;width:100%;height:100%}
.ambient-bird{position:absolute;opacity:.18}

h1{font-size:24px;font-weight:800;letter-spacing:-0.02em;color:var(--acc)}
.sub{font-size:13px;color:var(--t2);margin-top:2px}
.header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px;flex-wrap:wrap;gap:8px}
.hdr-btns{display:flex;gap:6px;flex-wrap:wrap}
.btn{padding:6px 14px;border-radius:8px;border:1px solid var(--brd);background:var(--brd);color:var(--t1);cursor:pointer;font-size:13px;font-weight:700;font-family:inherit;white-space:nowrap;transition:all .2s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.btn:hover{border-color:var(--t3);color:var(--t1);box-shadow:0 2px 6px rgba(0,0,0,.12);transform:translateY(-0.5px)}
.btn:disabled{opacity:.35;cursor:default;transform:none;box-shadow:none}
.btn.active{border-color:#0e3a5a;background:#e8f0f8;color:#0e3a5a;box-shadow:0 0 0 1px #0e3a5a22}
.btn.sm{padding:4px 10px;font-size:12px}

/* Section navigation */
.sec-nav{position:sticky;top:0;z-index:90;background:var(--bg0)ee;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--brd);margin:-20px -24px 16px;padding:8px 24px;display:flex;gap:4px;flex-wrap:wrap}

.sec-nav .nav-btn{padding:5px 12px;border-radius:16px;border:none;background:transparent;color:var(--t1);cursor:pointer;font-size:12px;font-weight:600;font-family:inherit;transition:all .2s;white-space:nowrap}
.sec-nav .nav-btn:hover{color:var(--t1);background:rgba(255,255,255,.35);box-shadow:0 1px 4px rgba(0,0,0,.1)}
.sec-nav .nav-btn.active{color:#0e3a5a;background:rgba(255,255,255,.88);box-shadow:0 0 0 1px rgba(14,58,90,.2)}



.layout{display:grid;grid-template-columns:1fr;gap:20px;align-items:start}
.card{background:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.7);border-radius:12px;padding:16px 18px;transition:all .25s ease;box-shadow:0 2px 8px rgba(0,40,80,.14)}
.card:hover{box-shadow:0 4px 16px rgba(0,0,0,.18);border-color:var(--brd2)}
.mt{margin-top:16px}
.card-label{font-size:13px;font-weight:700;color:var(--t1);text-transform:uppercase;letter-spacing:0.04em;margin-bottom:10px;display:flex;align-items:center;gap:6px}
.row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.big-num{font-size:30px;font-weight:800;background:linear-gradient(135deg,#0e3a5a,#0a4a35);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-0.02em;line-height:1.1}
.big-num u{font-size:14px;font-weight:500;color:var(--t2);text-decoration:none}
input[type=range]{width:100%;accent-color:#f5a020;cursor:pointer;height:8px;margin-top:6px}
input[type=checkbox]{width:16px;height:16px;accent-color:#f5a020;cursor:pointer;flex-shrink:0}
.ticks{display:flex;justify-content:space-between;font-size:12px;color:var(--t2);margin-top:3px}
.ticks span{cursor:pointer}.ticks span:hover{color:var(--t2)}
select,.ninput{background:var(--bg2);border:1px solid var(--brd);border-radius:4px;color:var(--t1);padding:3px 6px;font-size:13px;font-family:inherit}
.ninput{width:90px}
.phase{margin-top:8px;padding:8px 10px;background:var(--bg1);border-radius:6px;border:1px solid var(--brd)}
.phase-grid{display:flex;gap:5px;flex-wrap:wrap}
.pi{flex:1 1 auto;text-align:center;padding:4px 6px;background:var(--brd);border-radius:4px;min-width:58px;cursor:pointer;transition:outline .1s}
.pi:hover{outline:1px solid #183e5c;outline-offset:-1px}
.pi.sel{outline:1.5px solid #f5a020;outline-offset:-1px}
.pv{font-size:14px;font-weight:800}.pp{font-size:11px;font-weight:600}.py{font-size:11px;color:var(--t2)}
.chart-wrap{position:relative;height:360px;margin-top:8px}
.legend{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:8px}
.li{display:flex;align-items:center;gap:3px;font-size:12px;color:var(--t2);cursor:pointer;padding:2px 6px;border-radius:4px;transition:all .15s;user-select:none}
.li:hover{background:var(--brd)}
.li.leg-hidden{opacity:.35;text-decoration:line-through}
.ldot{width:10px;height:10px;border-radius:2px;display:inline-block}
.lline{width:16px;height:3px;border-radius:2px;display:inline-block}
.ldash{width:16px;display:inline-block;border-top:2px dashed}
.sgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:2px}
.stat{text-align:center;padding:12px 6px;border-radius:10px;background:linear-gradient(145deg,var(--bg1) 0%,var(--bg0) 100%);transition:all .25s;border:1px solid transparent}
.stat:hover{background:linear-gradient(145deg,var(--brd) 0%,var(--brd) 100%);border-color:var(--brd);box-shadow:0 2px 8px rgba(0,0,0,.15)}


.sv{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}.sl{font-size:11px;color:var(--t2);margin-top:2px}
.alert{border-radius:10px;padding:14px 18px;font-size:13px;line-height:1.5;transition:all .25s}
.abr{background:#450a0a20;border:1px solid #7f1d1d;color:#fca5a5;box-shadow:0 2px 8px rgba(239,68,68,.08)}
.agr{background:var(--bg0)20;border:1px solid var(--pos);color:var(--pos);box-shadow:0 2px 8px rgba(74,222,128,.08)}

/* Collapsible cards */
.card-hdr{display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none}
.card-hdr .card-label{margin-bottom:0}
.card-tog{font-size:12px;color:var(--t3);transition:transform .2s;width:18px;text-align:center;flex-shrink:0}
.card-body{overflow:hidden;transition:max-height .3s ease,opacity .2s ease;opacity:1}
.card-body.card-collapsed{max-height:0!important;opacity:0;margin-top:0!important}
.card-body:not(.card-collapsed){margin-top:8px}

/* Tables - improved readability */
table{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px;font-variant-numeric:tabular-nums}
th{padding:8px 10px;text-align:right;color:var(--t1);font-weight:700;border-bottom:2px solid var(--t3);font-size:12px;text-transform:uppercase;letter-spacing:.03em}
td{padding:6px 10px;text-align:right}
tr:nth-child(even){background:var(--bg1)20}

tr+tr{border-top:1px solid var(--brd)18}
td:first-child{text-align:left}
th:first-child{text-align:left}

/* Year highlight sync */
.lane.yr-highlight{background:#d4e8f5!important;border-color:#0e3a5a66!important}


/* Expense panel improvements */
.sticky{position:sticky;top:16px;background:var(--bg0);border:1px solid var(--brd);border-radius:12px;padding:16px 18px;max-height:calc(100vh - 32px);overflow-y:auto;-webkit-overflow-scrolling:touch;box-shadow:0 2px 12px rgba(0,0,0,.15)}
.lanes{display:flex;flex-direction:column;gap:8px}
.lane{border:1.5px solid var(--brd);border-radius:10px;padding:10px 14px;min-height:32px;background:var(--bg1);transition:all .25s;overflow:visible;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.lane.dov{border-color:#f5a020;background:var(--bg0)}
.lane-hdr{display:flex;align-items:center;gap:8px;font-size:15px;cursor:pointer;user-select:none;padding:2px 0}
.lane-yr{font-weight:800;color:var(--t1);min-width:42px;font-size:15px}
.lane-t{font-size:13px;color:var(--t2);font-variant-numeric:tabular-nums}
.lane-b{font-size:13px;font-weight:700;margin-left:auto;font-variant-numeric:tabular-nums}
.lane-tog{font-size:12px;color:var(--t3);margin-left:4px;width:16px;text-align:center;transition:transform .2s}
.lane-items{overflow:visible;transition:max-height .25s ease}
.lane-items.collapsed{max-height:0!important;overflow:hidden}
.lane-empty{font-size:11px;color:var(--brd);text-align:center;padding:1px 0}
.lane.dov .lane-empty{color:#0e3a5a;font-weight:600}

/* Expense items - larger, more readable */
.exp{border-radius:10px;padding:10px 12px;margin-top:5px;cursor:grab;position:relative;transition:all .2s;-webkit-tap-highlight-color:transparent}
.exp:hover{box-shadow:0 2px 8px rgba(0,0,0,.15);transform:translateY(-1px)}
.exp.dragging{opacity:0.25;transform:scale(.98)}
.exp.off{background:var(--bg1)!important}
.exp.off .en,.exp.off .ea{color:var(--t4)!important;text-decoration:line-through}
.exp.edone{background:rgba(6,78,59,.18)!important;border-color:#155f3e!important;opacity:1}
.exp.edone .en{color:#a7f3d0!important;text-decoration:line-through}
.exp.edone .ea{color:#6ee7b7!important;text-decoration:line-through}
.etop{display:flex;align-items:center;gap:8px}
.en{flex:1;font-size:15px;font-weight:600;color:var(--t1);line-height:1.4}
.ea{font-size:15px;font-weight:700;color:var(--t1);white-space:nowrap;cursor:text;border-bottom:1px dashed var(--brd2);font-variant-numeric:tabular-nums}
.ea.ed{color:var(--acc)}
.ea-in{width:90px;font-size:14px;font-weight:700;color:var(--acc);background:var(--bg1);border:1px solid var(--acc);border-radius:4px;padding:3px 6px;text-align:right;outline:none;font-family:inherit}
.eex{font-size:11px;color:var(--neg);margin:4px 0 0 24px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.emod{font-size:12px;color:var(--acc);margin:4px 0 0 24px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.emod .ec{color:var(--acc)}
.ub{font-size:12px;color:var(--t2);background:none;border:1px solid var(--brd);border-radius:4px;padding:2px 6px;cursor:pointer;font-family:inherit}
.ub:hover{color:var(--t1)}
/* Drag handle - more visible */
.dh{position:absolute;right:6px;top:50%;transform:translateY(-50%);color:var(--t3);opacity:.6;font-size:14px;pointer-events:none;letter-spacing:1px}
/* Category dots */
.cat-dot{width:8px;height:8px;border-radius:2px;display:inline-block;flex-shrink:0}

/* Compact expense mode */
.exp-compact .exp{padding:5px 10px;margin-top:2px}
.exp-compact .etop{gap:6px}
.exp-compact .en{font-size:13px}
.exp-compact .ea{font-size:13px}
.exp-compact .emod,.exp-compact .eex,.exp-compact .exp-note,.exp-compact .exp-desc,.exp-compact .exp-meta,.exp-compact .defer-warn,
.exp-compact .exs-tag,.exp-compact div[style*="margin:3px 0 0 22px"],.exp-compact div[style*="margin:4px 0 0 24px"]{display:none!important}
.exp-compact .quoted-tag,.exp-compact .estimate-tag,.exp-compact .bundle-tag,.exp-compact .defer-risk-tag{display:none!important}
.exp-compact .info-btn,.exp-compact .done-cb,.exp-compact .study-cb,.exp-compact .edel,.exp-compact .ub,.exp-compact .note-in,.exp-compact .photo-btn{display:none!important}
.exp-compact div[style*="display:flex;align-items:center;gap:5px"]{display:none!important}
.exp-compact .dh{display:none!important}

.pu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.pu-box{background:var(--bg1);border-radius:10px;padding:12px;text-align:center;border:1px solid var(--brd);transition:all .2s}
.pu-box:hover{border-color:var(--brd);box-shadow:0 2px 8px rgba(0,0,0,.1)}
.pu-v{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;color:#f0f6ff}.pu-l{font-size:12px;color:var(--t3);margin-top:3px}
.sc-bar{display:flex;gap:4px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.sc-chip{color:var(--t2);padding:3px 10px;border-radius:12px;font-size:12px;font-weight:700;display:inline-flex;align-items:center;gap:4px;cursor:default}
.sc-chip .x{cursor:pointer;opacity:.5;font-size:13px}.sc-chip .x:hover{opacity:1}

/* Meeting mode - bigger KPIs */
body.meeting .sgrid{grid-template-columns:repeat(3,1fr);gap:6px}
body.meeting .stat{padding:20px 12px}
body.meeting .sv{font-size:36px}
body.meeting .sl{font-size:14px}
body.meeting .big-num{font-size:42px}
body.meeting .chart-wrap{height:420px}
input[type='number'],input[type='text'],input[type='date'],input[type='time'],input[type='email'],textarea{color:var(--t1)!important;}

@media print{
  body{background:#fff!important;color:#111!important;padding:10px;-webkit-print-color-adjust:exact;print-color-adjust:exact;opacity:1!important}
  .btn,.hdr-btns,.sticky,.no-print,input[type=range],.ticks,.phase,.sc-bar,.lane-tog,.dh,.ub,.study-cb,.edel,.add-form,.sec-nav,.exp-search{display:none!important}
  .layout{display:block!important}.card{border:1px solid #ccc;page-break-inside:avoid;margin-bottom:8px;background:#fff!important}
  .card-body.card-collapsed{max-height:none!important;opacity:1!important;display:block!important}
  h1{color:#111!important;-webkit-text-fill-color:#111!important}.card-label{color:#555!important}.sub{color:#888!important}
  .alert{border:1px solid #999}.abr{background:#fee!important;color:#900!important}.agr{background:#efe!important;color:#060!important}
  .sv,.big-num{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .chart-wrap{height:260px}
  table{border-collapse:collapse!important}
  th{background:#e2ecf4!important;color:var(--brd2)!important;border-bottom:2px solid #1a4060!important;font-size:10px!important;padding:4px 6px!important}
  td{color:var(--brd)!important;border-bottom:1px solid #c8d8e4!important;font-size:10px!important;padding:3px 6px!important}
  .stat{background:#eaf2f8!important;border:1px solid #c8d8e4!important;border-radius:6px!important}
  .sl{color:#183e5c!important}
  .ff-compare{background:#eaf2f8!important;border:1px solid #c8d8e4!important}
  .author-text{color:var(--t1)!important}
  #author-card{background:#e0f0fa!important;border:1px solid #a0c8f0!important}
}
@media(max-width:900px){
  .hdr-btns{flex-wrap:wrap;gap:4px}.hdr-btns .btn{padding:4px 8px;font-size:11px}
  .header{padding:12px 14px}.card{padding:12px 14px}h1{font-size:20px}
  .sgrid{grid-template-columns:1fr 1fr}
  .row{flex-wrap:wrap}
  .exp{padding:8px 10px}
  table{font-size:11px}th,td{padding:3px 4px}
}
@media(max-width:600px){
  body{padding:0;font-size:14px}
  .header{flex-direction:column;align-items:flex-start;gap:6px;padding:10px 12px;border-radius:0}
  .hdr-btns{width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
  .hdr-btns .btn{font-size:11px;padding:7px 4px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  h1{font-size:18px}.sub{font-size:11px}
  .card{padding:10px 12px;border-radius:10px;margin-bottom:10px}
  .card-label{font-size:12px}
  .big-num{font-size:26px}
  .sgrid{grid-template-columns:repeat(3,1fr)}
  .sv{font-size:18px}.sl{font-size:10px}
  .row{flex-direction:column;align-items:stretch}
  .row>*{width:100%}
  .exp{padding:7px 10px;margin-top:4px}
  .etop{gap:6px;flex-wrap:nowrap}
  .en{font-size:13px}
  .ea{font-size:13px}
  .edel,.info-btn{font-size:13px;padding:5px 8px;min-height:30px}
  .ub{font-size:11px;padding:3px 6px}
  .lane-hdr{min-height:34px}
  .lane-yr{font-size:14px}
  input[type=checkbox]{width:18px;height:18px;min-width:18px}
  .study-cb{width:18px!important;height:18px!important;min-width:18px!important}
  .dh{display:none!important}
  .chart-wrap{height:220px}
  .pu-grid{grid-template-columns:repeat(2,1fr)}
  table{font-size:10px}th,td{padding:3px 4px!important;font-size:10px!important}
  .sec-nav{margin:-10px -0px 12px;padding:6px 12px;gap:2px;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .sec-nav .nav-btn{font-size:11px;padding:5px 10px;flex-shrink:0}
  .view-switch{margin-left:0;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:0 12px;display:flex;gap:4px}
  .vs-btn{font-size:11px;padding:6px 10px;flex-shrink:0;white-space:nowrap}
  .ff-compare{font-size:11px;gap:6px}
  .info-card{max-width:calc(100vw - 16px)!important;left:8px!important;right:8px!important;top:auto!important;bottom:8px!important;position:fixed}
  .mdl-panel{width:100%!important;right:-100%!important;border-left:none;border-top:1px solid var(--brd)}
  .mdl-panel.open{right:0!important}
  .vq-box{width:calc(100vw - 24px)!important;max-height:85vh!important;padding:16px}
  .vq-form{grid-template-columns:1fr!important}
  .cmp-box{width:calc(100vw - 16px)!important;padding:16px}
  .help-modal{padding:16px;max-height:85vh;width:calc(100vw - 16px)!important}
  .ops-split{width:100%!important}
  input[type=range]{min-height:28px}
  .sc-bar{flex-wrap:wrap}
  .sc-chip{color:var(--t2);font-size:11px}
  /* Cap Ex tab on mobile */
  #capex-ctr>div{padding:12px 12px 40px}
}
/* Changelog modal */
.cl-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9998;cursor:pointer}
.cl-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(560px,92vw);max-height:80vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
  background:var(--bg1);border:1px solid var(--brd);border-radius:12px;padding:24px;z-index:9999;color:#1a4060;font-size:12px;line-height:1.6}

.cl-modal h2{font-size:16px;font-weight:800;color:#c8dcea;margin:0 0 12px}

.cl-entry{padding:6px 0;border-top:1px solid var(--brd);font-size:11px;display:flex;gap:10px}

.cl-entry .cl-ts{color:var(--t2);min-width:130px;font-size:10px}
/* Compare card */
.cmp-card{background:var(--bg0);border:1px solid var(--brd);border-radius:10px;padding:14px 16px;margin-top:12px}

.cmp-grid{display:grid;gap:1px;background:var(--brd);border-radius:6px;overflow:hidden;margin-top:8px;font-size:12px}

.cmp-grid .cmp-h{background:var(--bg1);padding:6px 8px;font-weight:700;color:#1a4060;font-size:11px;text-transform:uppercase;letter-spacing:.03em}

.cmp-grid .cmp-c{background:var(--bg0);padding:6px 8px;text-align:center}

.cmp-grid .cmp-c.cmp-best{background:var(--bg0)}






/* Owner summary */
.owner-summary{font-size:13px;line-height:1.7;padding:16px;background:#fff;color:var(--brd);max-width:700px;margin:0 auto}
/* Onboarding banner */
.onboard{background:#1c3018;border:1px solid #f5a02044;border-radius:10px;padding:16px 20px;margin-bottom:16px;position:relative;animation:onboardFade .5s ease}

.onboard-close{position:absolute;top:10px;right:12px;background:none;border:none;color:var(--t2);cursor:pointer;font-size:16px;padding:2px 6px;line-height:1}
.onboard-close:hover{color:#c8dcea}
.onboard h3{font-size:15px;font-weight:700;color:#0e3a5a;margin-bottom:6px}

.onboard p{font-size:13px;color:#1a4060;margin:0;line-height:1.6}
.onboard .steps{display:flex;gap:16px;margin-top:10px;flex-wrap:wrap}
.onboard .step{flex:1;min-width:140px;background:var(--bg0);border-radius:6px;padding:10px 12px;text-align:center}

.onboard .step-num{font-size:20px;font-weight:800;color:var(--acc)}

.onboard .step-txt{font-size:12px;color:#1a4060;margin-top:2px}
@keyframes onboardFade{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){
  body{padding:8px}
  .header{flex-direction:column;gap:8px;padding:10px}
  .hdr-btns{flex-wrap:wrap;gap:4px;justify-content:center}
  .hdr-btns .btn{font-size:12px;padding:5px 10px}
  h1{font-size:20px}
  .sec-nav{margin:-8px -8px 12px;padding:6px 8px;gap:2px;overflow-x:auto}
  .sec-nav .nav-btn{font-size:11px;padding:4px 8px;flex-shrink:0}
  .sgrid{grid-template-columns:repeat(3,1fr)}
  .sv{font-size:18px}
  .sl{font-size:10px}
  .chart-wrap{height:240px}
  .pu-grid{grid-template-columns:repeat(2,1fr)}
  .ops-split{width:100%!important}
  table{font-size:11px}
  th,td{padding:3px 4px!important;font-size:10px!important}
  .card{padding:8px}
  .row{flex-wrap:wrap}
  .exp{padding:6px 8px}
  .etop{gap:4px}
  .en{font-size:12px}
  .ea{font-size:12px}
  input[type=checkbox]{width:18px;height:18px;min-width:18px}
  .study-cb{width:18px!important;height:18px!important;min-width:18px!important}
  .edel{font-size:12px;padding:4px 8px;min-height:28px}
  .info-btn{font-size:16px;padding:4px 6px;min-height:28px}
  .ub{font-size:11px;padding:2px 6px;min-height:28px}
  .yr-sel{font-size:13px;padding:4px 6px;min-height:28px}
  .dh{display:none!important}
  .lane-hdr{padding:4px 0;min-height:32px}
  .lane-yr{font-size:14px}
  .ff-compare{font-size:11px;gap:6px}
  .help-modal{padding:20px 16px;font-size:13px}
  .help-modal h2{font-size:16px}
  .info-card{max-width:calc(100vw - 16px)!important;left:8px!important;right:8px!important;top:auto!important;bottom:8px!important;position:fixed}
}
/* iOS-specific: prevent auto-zoom on input focus (needs 16px+) */
@supports(-webkit-touch-callout:none){
  input[type=text],input[type=number],textarea,select{font-size:16px!important}
  .ea-in{font-size:16px!important;width:90px}
  .en-in{font-size:16px!important}
  .author-ta{font-size:16px!important}
  .note-in{font-size:16px!important}
  input[type=range]{min-height:28px}
}
/* Year select dropdown */
.yr-sel{margin-left:auto;background:var(--brd);border:1px solid var(--brd);border-radius:4px;color:#c8dcea;font-size:12px;font-family:inherit;padding:2px 4px;cursor:pointer}
@media(pointer:coarse){.dh{display:none!important}}
/* Info tooltip card */
.info-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:999;background:transparent}
.info-card{position:fixed;z-index:1000;max-width:380px;width:calc(100vw - 32px);background:var(--bg0);border:1px solid var(--brd2);border-radius:10px;padding:14px 16px;box-shadow:0 20px 40px rgba(0,0,0,.5);color:var(--t2);font-size:12px;line-height:1.55}
.info-card .ic-title{font-size:13px;font-weight:700;color:#e2ecf4;margin-bottom:6px;padding-right:24px}
.info-card .ic-src{font-size:12px;color:var(--acc);font-weight:600;letter-spacing:.03em;text-transform:uppercase;margin-bottom:6px}
.info-card .ic-close{position:absolute;top:10px;right:12px;color:var(--t2);cursor:pointer;font-size:16px;line-height:1;padding:2px}
.info-card .ic-close:hover{color:#c8dcea}
.info-btn{background:none;border:1px solid var(--brd);border-radius:50%;color:var(--t4);font-size:13px;cursor:default;padding:0;flex-shrink:0;line-height:1;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;transition:color .15s,border-color .15s}
.info-btn:hover{color:var(--acc);border-color:var(--acc)}
/* Category breakdown */
.cat-row{display:flex;align-items:center;gap:8px;margin:5px 0;font-size:11px}
.cat-bar-bg{flex:1;height:18px;background:var(--bg1);border-radius:4px;overflow:hidden;position:relative}
.cat-bar-fill{height:100%;border-radius:4px;display:flex;align-items:center;padding-left:6px;font-size:12px;font-weight:700;color:var(--bg0);white-space:nowrap;min-width:1px;transition:width .3s}
.cat-label{min-width:85px;color:#1a4060;font-weight:500}
.cat-amt{min-width:65px;text-align:right;font-weight:700;color:#c8dcea;font-size:13px}
.cat-pct{min-width:36px;text-align:right;color:#1a4060;font-size:13px}
/* Notes */
.exp-note{font-size:12px;color:#1a4060;margin:3px 0 0 22px;font-style:italic;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.exp-note:hover{color:#1a4060}
.note-in{width:calc(100% - 22px);margin:4px 0 0 22px;font-size:13px;color:#c8dcea;background:var(--bg1);border:1px solid var(--brd);border-radius:4px;padding:4px 8px;font-family:inherit;resize:none;outline:none;min-height:40px}
.note-in:focus{border-color:#f5a020}
/* Compliance */
.comply{margin-top:8px}
.comply-item{display:flex;align-items:flex-start;gap:6px;padding:4px 0;font-size:11px;line-height:1.4}
.comply-icon{font-size:13px;flex-shrink:0;width:18px;text-align:center}
.comply-ok{color:var(--pos)}.comply-warn{color:#6b2d08}.comply-fail{color:#e07070}
/* Bundles */
.bundle-tag{font-size:11px;color:#4a90c4;background:#4a90c422;border-radius:3px;padding:2px 6px;margin-left:4px;font-weight:600;letter-spacing:.03em}
/* Optimizer */
/* Deferral cost */
.defer-cost{margin-top:8px;padding:8px;background:#1e1a0f;border:1px solid #42371380;border-radius:6px;font-size:11px;color:#f5a020}
/* Meeting mode */
body.meeting .exp .etop input[type=checkbox],body.meeting .study-cb,body.meeting .done-cb,body.meeting .edel,body.meeting .ub,body.meeting .yr-sel,
body.meeting .add-form,body.meeting .info-btn,body.meeting .bundle-tag,body.meeting .dh,
body.meeting .emod,body.meeting .exs-tag,body.meeting .eex,body.meeting .exp-note,body.meeting .note-in,body.meeting .defer-warn,
body.meeting #add-ctr,body.meeting #sp-list,body.meeting .sc-bar,body.meeting #tog-all-btn,body.meeting #sort-btn,body.meeting .exp-search,body.meeting .cat-dot{display:none!important}
body.meeting .exp{pointer-events:none;cursor:default!important}
body.meeting .lane-hdr span[onclick]{pointer-events:none}
body.meeting .hdr-btns .btn:not(.help-btn):not(#view-dd-btn){opacity:0.3;pointer-events:none}
body.meeting .view-dd{opacity:1!important;pointer-events:auto!important}
body.meeting .view-dd .btn{opacity:1!important;pointer-events:auto!important}
body.meeting .sec-nav{display:none}
/* Presenter notes - visible on screen, hidden on projector/print */
.presenter-notes{margin-top:12px;padding:10px 14px;background:#1a1a2e;border:1px dashed var(--brd2);border-radius:6px;font-size:12px;color:#1a4060}
.presenter-notes textarea{width:100%;min-height:50px;background:var(--bg1);border:1px solid var(--brd);border-radius:4px;color:#c8dcea;padding:6px;font-size:12px;font-family:inherit;resize:vertical;outline:none}
@media screen and (display-mode:fullscreen){.presenter-notes{display:none}}
@media print{.presenter-notes{display:none!important}}
/* Exploded / audit mode */
.vd-item{display:block;width:100%;text-align:left;padding:8px 14px;background:none;border:none;color:rgba(255,255,255,.8);font-size:13px;cursor:pointer;font-family:inherit}
.vd-item:hover{background:rgba(255,255,255,.1);color:#fff}
.vd-item.active{color:#38bdf8;font-weight:700}
.vd-item.active::before{content:"✓ ";color:#38bdf8}
.defer-risk-tag,.defer-warn{display:none}
body.show-risk .defer-risk-tag{display:inline}
body.show-risk .defer-warn{display:block}
.exp-desc{font-size:13px;color:#1a4060;margin:5px 0 3px 22px;line-height:1.5;border-left:2px solid #183e5c;padding-left:8px}
.exp-meta{font-size:12px;color:#1a4060;margin:3px 0 0 22px;display:flex;gap:8px;flex-wrap:wrap}
.exp-meta span{background:var(--brd);padding:3px 7px;border-radius:3px}
.defer-risk-tag{font-size:11px;padding:2px 7px;border-radius:3px;margin-left:4px;font-weight:700;cursor:pointer}
.defer-risk-tag.high{background:#7f1d1d;color:#fca5a5}
.defer-risk-tag.med{background:#78350f;color:#fcd34d}
.defer-risk-tag.low{background:#2d2540;color:#7ab0d4}
.defer-warn{font-size:13px;margin:5px 0 3px 22px;padding:6px 10px;border-radius:5px;line-height:1.5}
.defer-warn.high{background:#450a0a;border-left:3px solid #e07070;color:#fca5a5}
.defer-warn.med{background:#451a03;border-left:3px solid #e8a04a;color:#fcd34d}
.defer-warn.low{background:#0a2438;border-left:3px solid #4a7ab5;color:#7ab0d4}
/* Fully funded comparison */
.ff-compare{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:6px;padding:6px 8px;background:var(--bg1);border:1px solid var(--brd);border-radius:6px;font-size:11px}
/* Vendor quote tag */
.quoted-tag{font-size:11px;color:var(--pos);background:var(--pos)22;border-radius:3px;padding:2px 6px;margin-left:4px;font-weight:600;letter-spacing:.03em}
.estimate-tag{font-size:11px;color:#1a4060;background:#64748b15;border-radius:3px;padding:2px 6px;margin-left:4px;font-weight:500;letter-spacing:.03em}
/* Author note */
.author-text{font-size:12px;color:var(--t1);line-height:1.6;white-space:pre-wrap}
.author-placeholder{font-size:11px;color:#183e5c;font-style:italic;padding:4px 0}
.author-ta{width:100%;min-height:60px;background:var(--bg1);border:1px solid var(--brd);border-radius:6px;color:var(--t1);padding:8px;font-size:12px;font-family:inherit;line-height:1.6;resize:vertical;outline:none}
.author-ta:focus{border-color:#f5a020}
/* Help modal */
.help-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9998;cursor:pointer}
.help-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(680px,92vw);max-height:85vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
  background:var(--bg1);border:1px solid var(--brd);border-radius:12px;padding:28px 32px;z-index:9999;color:#1a4060;font-size:13px;line-height:1.7}
.help-modal h2{font-size:18px;font-weight:800;color:#c8dcea;margin:0 0 16px}
.help-modal h3{font-size:14px;font-weight:700;color:#0e3a5a;margin:20px 0 6px;padding-top:12px;border-top:1px solid var(--brd)}
.help-modal h3:first-of-type{border-top:none;padding-top:0}
.help-modal p{margin:0 0 8px;color:#1a4060}
.help-modal kbd{display:inline-block;background:var(--brd);border:1px solid var(--brd);border-radius:3px;padding:0 5px;font-size:11px;font-family:inherit;color:#c8dcea}
.help-modal .hk{display:flex;gap:8px;align-items:baseline;margin:3px 0}
.help-modal .hk span:first-child{min-width:120px;color:var(--t2);font-size:11px;font-weight:600}
.help-modal .close-help{position:sticky;top:0;float:right;background:var(--brd);border:1px solid var(--brd);border-radius:6px;
  color:#1a4060;font-size:13px;padding:4px 10px;cursor:pointer;font-family:inherit;z-index:1}
.help-modal .close-help:hover{color:#c8dcea;border-color:var(--t2)}
.ops-split{display:flex;height:22px;border-radius:6px;overflow:hidden;margin:6px 0}
.ops-split div{display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;transition:width .3s}
.ops-tbl{width:100%;border-collapse:collapse;font-size:11px;margin-top:6px}
.ops-tbl td{padding:3px 6px;border-top:1px solid var(--brd)18}
.ops-tbl td:first-child{text-align:left;color:#1a4060;font-weight:500}
.ops-tbl td:nth-child(2){text-align:right;font-weight:700;color:#c8dcea;font-family:'DM Sans',monospace}
.ops-tbl td:nth-child(3){text-align:right;font-size:13px;color:#1a4060}
.ops-toggle{font-size:13px;color:#1a4060;cursor:pointer;user-select:none;display:inline-flex;align-items:center;gap:4px}
.ops-toggle:hover{color:#1a4060}
.study-cb{width:14px;height:14px;accent-color:#f5a020;cursor:pointer;flex-shrink:0}
.exs-tag{font-size:11px;color:#0e3a5a;font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin:3px 0 0 22px}
.en-in{flex:1;font-size:11px;font-weight:500;color:var(--acc);background:var(--bg1);border:1px solid var(--acc);border-radius:4px;padding:1px 4px;outline:none;font-family:inherit;min-width:0}
.edel{font-size:12px;color:var(--t2);background:none;border:1px solid var(--brd);border-radius:4px;padding:2px 6px;cursor:pointer;font-family:inherit;line-height:1.6}
.edel:hover{color:#e07070;border-color:#e07070}
.add-form{background:var(--bg1);border:1px solid #f5a020;border-radius:8px;padding:8px;margin-top:6px}
.add-form input,.add-form select{background:var(--brd);border:1px solid var(--brd);border-radius:4px;color:#c8dcea;padding:3px 6px;font-size:11px;font-family:inherit}
.add-form input{width:100%}
.add-form label{font-size:13px;color:#1a4060;font-weight:600;display:block;margin-top:5px}
.add-row{display:flex;gap:6px;margin-top:6px}
.add-row>*{flex:1}

/* Model Browser Panel */
.mdl-overlay{display:none;position:fixed;inset:0;background:#000a;z-index:9998}
.mdl-overlay.open{display:block}
.mdl-panel{position:fixed;top:0;right:-420px;width:400px;max-width:90vw;height:100vh;background:var(--bg1);border-left:1px solid var(--brd2);z-index:9999;transition:right .25s ease;display:flex;flex-direction:column;overflow:hidden}
.mdl-panel.open{right:0}

.mdl-panel-hdr{padding:16px;border-bottom:1px solid var(--brd2);display:flex;justify-content:space-between;align-items:center}

.mdl-panel-hdr h2{margin:0;font-size:16px;color:#c8dcea}

.mdl-close{background:none;border:none;color:#1a4060;font-size:20px;cursor:pointer;padding:4px 8px}
.mdl-close:hover{color:#c8dcea}
.mdl-tabs{display:flex;border-bottom:1px solid var(--brd2);padding:0 16px}

.mdl-tab{padding:10px 16px;border:none;background:none;color:var(--t2);cursor:pointer;font-size:13px;font-weight:600;border-bottom:2px solid transparent;font-family:inherit}
.mdl-tab:hover{color:#c8dcea}
.mdl-tab.active{color:#0e3a5a;border-bottom-color:var(--acc)}


.mdl-body{flex:1;overflow-y:auto;padding:16px}
.mdl-empty{text-align:center;color:var(--t2);padding:40px 16px;font-size:13px;line-height:1.6}
.mdl-item{background:var(--brd);border:1px solid var(--brd);border-radius:8px;padding:12px;margin-bottom:8px;cursor:pointer;transition:border-color .15s}
.mdl-item:hover{border-color:#183e5c}
.mdl-item.active{border-color:#0e3a5a;background:#d4e8f5}



.mdl-item-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.mdl-item-name{font-weight:600;font-size:14px;color:#c8dcea;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}

.mdl-item-meta{font-size:11px;color:var(--t2);display:flex;gap:8px;flex-wrap:wrap}
.mdl-item-actions{display:flex;gap:4px;flex-shrink:0;margin-left:8px}
.mdl-item-actions button{background:none;border:1px solid var(--brd);color:#1a4060;padding:3px 8px;border-radius:4px;cursor:pointer;font-size:11px;font-family:inherit}
.mdl-item-actions button:hover{border-color:var(--t2);color:#c8dcea}


.mdl-item-actions button.danger:hover{border-color:#e07070;color:#e07070}
.mdl-pub-badge{background:#1c3018;color:#f5a020;padding:1px 6px;border-radius:10px;font-size:10px;font-weight:600}

.mdl-author{color:#7ab0d4;font-size:11px}
.mdl-new-row{padding:16px;border-top:1px solid var(--brd2);display:flex;gap:6px}

.mdl-new-row input{flex:1;background:var(--brd);border:1px solid var(--brd);color:#c8dcea;padding:6px 10px;border-radius:6px;font-size:13px;font-family:inherit}

.mdl-new-row button{padding:6px 14px;border-radius:6px;border:none;background:#f5a020;color:var(--bg0);font-weight:600;cursor:pointer;font-size:13px;font-family:inherit}
.mdl-new-row button:hover{background:#40c8da}
/* Quick save dialog */
.qsave{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg1);border:1px solid var(--brd);border-radius:12px;padding:20px 24px;z-index:10001;min-width:320px;box-shadow:0 20px 60px #000a}

.qsave-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:10000;cursor:pointer}
.qsave h3{font-size:16px;font-weight:700;color:#c8dcea;margin:0 0 12px}

.qsave input{width:100%;padding:8px 12px;background:var(--bg2);border:1px solid var(--brd);border-radius:6px;color:var(--t1);font-size:14px;font-family:inherit;outline:none}

.qsave input:focus{border-color:#f5a020}
.qsave-btns{display:flex;gap:8px;margin-top:12px;justify-content:flex-end}
.qsave-btns button{padding:6px 16px;border-radius:6px;border:none;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.qsave-save{background:#f5a020;color:#111}.qsave-save:hover{background:#40c8da;color:#fff}
.qsave-cancel{background:var(--bg3);color:var(--t2)}.qsave-cancel:hover{background:rgba(255,255,255,.15);color:var(--t1)}

/* Save status indicator */
.save-ind{font-size:11px;color:var(--t2);margin-left:6px;display:inline-flex;align-items:center;gap:4px}
.save-ind.saving{color:var(--acc)}
.save-ind.saved{color:var(--pos)}
.save-ind.error{color:#e07070}
.save-dot{width:6px;height:6px;border-radius:50%;display:inline-block}
.save-ind.saving .save-dot{background:#f5a020;animation:pulse 1s infinite}
.save-ind.saved .save-dot{background:var(--pos)}
.save-ind.error .save-dot{background:#e07070}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* User identity in header */
.user-id{font-size:11px;color:rgba(255,255,255,.7);margin-right:8px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Vendor Quotes */
.vq-badge{display:inline-flex;align-items:center;gap:3px;font-size:10px;padding:1px 6px;border-radius:10px;background:#2d2540;color:#fdc57a;cursor:pointer;margin-left:4px}
.photo-badge{display:inline-flex;align-items:center;gap:3px;font-size:10px;padding:1px 6px;border-radius:10px;background:#1f2d25;color:#52c99e;cursor:pointer;margin-left:4px}

.photo-btn{background:none;border:none;cursor:pointer;font-size:12px;padding:0 2px;opacity:.4;transition:opacity .15s}
.photo-btn:hover{opacity:1}
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-top:8px}
.photo-thumb{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:1;cursor:pointer;border:1px solid var(--brd2);transition:all .2s}
.photo-thumb:hover{border-color:var(--acc);box-shadow:0 2px 8px rgba(0,0,0,.2);transform:scale(1.02)}
.photo-thumb img{width:100%;height:100%;object-fit:cover}
.photo-thumb .photo-del{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;border:none;cursor:pointer;font-size:11px;display:none;align-items:center;justify-content:center;line-height:1}
.photo-thumb:hover .photo-del{display:flex}
.photo-cap{font-size:10px;color:var(--t4);padding:4px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.photo-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:10001;display:flex;align-items:center;justify-content:center;cursor:pointer}
.photo-lightbox img{max-width:90vw;max-height:85vh;border-radius:8px;box-shadow:0 8px 32px rgba(0,0,0,.4)}
.photo-lightbox .lb-cap{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:#fff;font-size:14px;background:rgba(0,0,0,.5);padding:6px 16px;border-radius:8px;max-width:80vw;text-align:center}
.vq-badge.stale{background:#451a03;color:#f5a020}


.vq-modal{position:fixed;inset:0;background:#000a;z-index:10000;display:flex;align-items:center;justify-content:center}
.vq-box{background:var(--bg1);border:1px solid var(--brd);border-radius:14px;padding:24px;width:540px;max-width:90vw;max-height:80vh;overflow-y:auto;box-shadow:0 8px 32px rgba(0,0,0,.3)}

.vq-box h3{margin:0 0 16px;color:#c8dcea;font-size:16px}
.admin-vq-box{width:min(1000px,96vw)!important;max-width:min(1000px,96vw)!important;}

.vq-row{display:grid;grid-template-columns:1fr auto auto auto;gap:8px;padding:8px 0;border-bottom:1px solid var(--brd);align-items:center;font-size:13px}

.vq-row .vq-vendor{color:#c8dcea;font-weight:600}

.vq-row .vq-amt{color:var(--pos);font-weight:600}
.vq-row .vq-date{color:var(--t2);font-size:11px}
.vq-row .vq-stale{color:#0e3a5a;font-size:10px;font-weight:600}
.vq-form{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--brd2)}
.vq-form input{background:var(--brd);border:1px solid var(--brd);color:#c8dcea;padding:6px 10px;border-radius:6px;font-size:13px;font-family:inherit}

.vq-form label{font-size:11px;color:var(--t2);display:block;margin-bottom:2px}


/* Voting */
.vote-row{display:flex;align-items:center;gap:8px;margin-top:4px}
.vote-btn{background:none;border:1px solid var(--brd);color:var(--t2);padding:2px 8px;border-radius:12px;cursor:pointer;font-size:12px;font-family:inherit;display:inline-flex;align-items:center;gap:3px}
.vote-btn:hover{border-color:var(--t2);color:#c8dcea}
.vote-btn.active-up{border-color:var(--pos);color:var(--pos)}
.vote-btn.active-down{border-color:#e07070;color:#e07070}



/* Comments */
.cmt-section{margin-top:8px;padding-top:8px;border-top:1px solid var(--brd)}

.cmt-item{padding:6px 0;font-size:12px;border-bottom:1px solid var(--brd)22}
.cmt-author{font-weight:600;color:#7ab0d4;margin-right:6px}
.cmt-body{color:#1a4060}

.cmt-time{color:#183e5c;font-size:10px;margin-left:6px}
.cmt-del{background:none;border:none;color:#183e5c;cursor:pointer;font-size:10px;margin-left:4px}
.cmt-del:hover{color:#e07070}
.cmt-input{display:flex;gap:6px;margin-top:8px}
.cmt-input input{flex:1;background:var(--brd);border:1px solid var(--brd);color:#c8dcea;padding:5px 10px;border-radius:6px;font-size:12px;font-family:inherit}

.cmt-input button{padding:5px 12px;border-radius:6px;border:none;background:#f5a020;color:var(--bg0);font-weight:600;cursor:pointer;font-size:12px}

/* Snapshot History */
.snap-item{padding:8px;border-bottom:1px solid var(--brd);display:flex;justify-content:space-between;align-items:center}

.snap-label{font-size:13px;color:#c8dcea;font-weight:600}

.snap-time{font-size:11px;color:var(--t2)}
.snap-actions{display:flex;gap:4px}
.snap-actions button{font-size:11px}

/* What-if Comparison */
.cmp-overlay{display:none;position:fixed;inset:0;background:#000a;z-index:10000}
.cmp-overlay.open{display:flex;align-items:center;justify-content:center}
.cmp-box{background:var(--bg1);border:1px solid var(--brd);border-radius:12px;padding:24px;width:800px;max-width:95vw;max-height:85vh;overflow-y:auto}

.cmp-box h2{margin:0 0 16px;color:#c8dcea;font-size:18px}

.cmp-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;font-size:13px}
.cmp-grid>div{padding:8px 12px;border-bottom:1px solid var(--brd)}

.cmp-grid .cmp-lbl{color:var(--t2);font-weight:600}
.cmp-grid .cmp-val{color:#c8dcea;text-align:right}

.cmp-better{color:var(--pos)!important;font-weight:600}
.cmp-worse{color:#e07070!important;font-weight:600}
.cmp-pick{display:flex;gap:8px;margin-bottom:16px}
.cmp-pick select{flex:1;background:var(--brd);border:1px solid var(--brd);color:#c8dcea;padding:8px;border-radius:6px;font-size:13px;font-family:inherit}

/* ====== YEAR VIEW ====== */
#yv-ctr{max-width:920px;margin:0 auto;padding:0 20px 60px}
.yv-nav{display:flex;align-items:center;gap:4px;padding:12px 20px;background:var(--bg1);border-bottom:1px solid var(--brd2);position:sticky;top:40px;z-index:80}
.yv-pills{display:flex;gap:3px;flex:1;overflow-x:auto;scrollbar-width:none}.yv-pills::-webkit-scrollbar{display:none}
.yv-pill{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 10px;border-radius:10px;cursor:pointer;transition:all .25s ease;border:1px solid transparent;min-width:48px;position:relative}
.yv-pill:hover{background:var(--bg2);transform:translateY(-1px)}
.yv-pill.active{background:var(--bg2);border-color:var(--acc);box-shadow:0 2px 8px rgba(240,180,41,.15)}
.yv-pill .yr{font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}
.yv-pill .dot{width:8px;height:8px;border-radius:50%}
.yv-pill .dot.ok{background:var(--pos)}.yv-pill .dot.warn{background:var(--warn)}.yv-pill .dot.bad{background:var(--neg)}
.yv-pill.active .yr{color:var(--acc)}
.yv-pill .ptip{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);background:var(--bg2);border:1px solid var(--brd);border-radius:8px;padding:10px 14px;font-size:11px;line-height:1.6;color:var(--t2);min-width:220px;max-width:300px;pointer-events:none;opacity:0;transition:opacity .15s;z-index:200;box-shadow:0 8px 24px #0006;text-align:left;white-space:normal}
.yv-pill .ptip::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:var(--bg2)}
.yv-pill:hover .ptip{opacity:1}
.yv-pill:first-child .ptip{left:0;transform:none}.yv-pill:first-child .ptip::after{left:20px;transform:none}
.yv-pill:last-child .ptip{left:auto;right:0;transform:none}.yv-pill:last-child .ptip::after{left:auto;right:20px;transform:none}
.yv-arrow{width:32px;height:32px;border-radius:8px;border:1px solid var(--brd);background:var(--bg1);color:var(--t3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
.yv-arrow:hover{border-color:var(--t4);color:var(--t1)}
.yv-card{background:var(--bg1);border:1px solid var(--brd2);border-radius:14px;padding:22px;margin-bottom:14px;transition:all .3s;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.yv-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.12)}
.yv-card-title{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t4);margin-bottom:14px;display:flex;align-items:center}
.yv-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin-bottom:12px}
.yv-stat{background:var(--bg1);border:1px solid var(--brd2);border-radius:12px;padding:16px 18px;transition:all .3s;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.yv-stat:hover{box-shadow:0 3px 12px rgba(0,0,0,.1);border-color:var(--brd)}
.yv-stat .label{font-size:10px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--t4);margin-bottom:4px;display:flex;align-items:center}
.yv-stat .value{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
.yv-stat .sub{font-size:11px;color:var(--t4);margin-top:2px}
.yv-tip-w{position:relative;display:inline-flex;align-items:center}
.yv-tip-i{width:16px;height:16px;border-radius:50%;background:var(--brd);color:var(--t4);font-size:9px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;cursor:help;margin-left:6px;flex-shrink:0}
.yv-tip-i:hover{background:var(--acc2);color:var(--acc)}
.yv-tip-b{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--bg2);border:1px solid var(--brd);border-radius:8px;padding:10px 14px;font-size:11px;line-height:1.5;color:var(--t2);width:260px;pointer-events:none;opacity:0;transition:opacity .15s;z-index:200;box-shadow:0 8px 24px #0006}
.yv-tip-b::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:var(--bg2)}
.yv-tip-w:hover .yv-tip-b{opacity:1}
.yv-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:0;margin:8px 0}
.yv-fb{text-align:center;padding:18px 14px;border-radius:12px;border:1px solid var(--brd2);transition:all .3s}
.yv-fb:hover{box-shadow:0 2px 10px rgba(0,0,0,.08)}
.yv-fb .fl{font-size:10px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--t4);margin-bottom:6px}
.yv-fb .fv{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}
.yv-fb .fs{font-size:11px;color:var(--t4);margin-top:4px}
.yv-fb.in{border-color:rgba(74,222,128,.2);background:rgba(74,222,128,.06)}.yv-fb.in .fv{color:var(--pos)}
.yv-fb.out{border-color:rgba(239,68,68,.2);background:rgba(239,68,68,.06)}.yv-fb.out .fv{color:var(--neg)}
.yv-fa{text-align:center;color:var(--t4);font-size:18px;padding:0 4px}
.yv-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:700px){.yv-2col{grid-template-columns:1fr} .yv-flow{grid-template-columns:1fr;gap:8px} .yv-fa{transform:rotate(90deg)}}
.yv-op-grid{display:grid;grid-template-columns:1fr auto auto;gap:0;font-size:12px}
.yv-op-row{display:contents}.yv-op-row>*{padding:8px 0;border-bottom:1px solid var(--brd2)}
.yv-capex-item{display:flex;align-items:center;gap:12px;padding:14px;border-radius:10px;border:1px solid var(--brd2);margin-bottom:8px;transition:all .2s}
.yv-capex-item:hover{border-color:var(--brd);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.yv-capex-urg{width:4px;height:36px;border-radius:2px;flex-shrink:0}
.yv-gauge{flex:1;height:14px;background:var(--brd2);border-radius:7px;overflow:hidden}
.yv-gauge-fill{height:100%;border-radius:7px;transition:width .6s ease}
@keyframes yvPulse{0%,100%{opacity:1}50%{opacity:.6}}
.yv-pulse{animation:yvPulse 2s ease-in-out infinite}
@keyframes yvFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.yv-card{animation:yvFadeIn .4s ease both}
.yv-card:nth-child(2){animation-delay:.05s}.yv-card:nth-child(3){animation-delay:.1s}
.yv-card:nth-child(4){animation-delay:.15s}.yv-card:nth-child(5){animation-delay:.2s}
.yv-card:nth-child(6){animation-delay:.25s}.yv-card:nth-child(7){animation-delay:.3s}
.yv-tier-tog{font-size:12px;color:var(--acc);cursor:pointer;margin-top:12px;display:flex;align-items:center;gap:6px;font-weight:500;user-select:none}
.yv-tier-tog:hover{color:var(--t1)}
.yv-tier-tbl{margin-top:12px;border-collapse:collapse;width:100%;font-size:12px}
.yv-tier-tbl th{text-align:left;font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--t4);padding:6px 8px;border-bottom:1px solid var(--brd2)}
.yv-tier-tbl th:not(:first-child){text-align:right}
.yv-tier-tbl td{padding:7px 8px;border-bottom:1px solid var(--brd2)}.yv-tier-tbl td:not(:first-child){text-align:right;font-variant-numeric:tabular-nums;font-size:11px}
.yv-sum-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:500;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.yv-sum-modal{background:var(--bg1);border:1px solid var(--brd);border-radius:16px;width:95vw;max-width:1100px;max-height:90vh;overflow:auto;padding:24px;box-shadow:0 20px 60px #0008}
.yv-sum-tbl{width:100%;border-collapse:collapse;font-size:11px;font-variant-numeric:tabular-nums}
.yv-sum-tbl th{padding:8px 10px;text-align:right;font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--t4);border-bottom:2px solid var(--brd);white-space:nowrap;position:sticky;top:0;background:var(--bg1)}
.yv-sum-tbl th:first-child{text-align:left}
.yv-sum-tbl td{padding:7px 10px;text-align:right;border-bottom:1px solid var(--brd2);white-space:nowrap}
.yv-sum-tbl td:first-child{text-align:left;font-weight:600}
.yv-sum-tbl tr:hover td{background:var(--bg2)}
.yv-sum-tbl tr.yr-bad td{background:rgba(239,68,68,.06)}
.yv-sum-tbl tr.yr-warn td{background:rgba(251,191,36,.06)}
.view-switch{display:flex;gap:2px;background:var(--bg1);border:1px solid var(--brd2);border-radius:10px;padding:3px;width:fit-content;max-width:100%;margin:0 0 12px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.view-switch .vs-btn{padding:6px 14px;border-radius:7px;font-size:12px;font-weight:600;cursor:pointer;color:var(--t1);transition:all .15s;border:none;background:none;font-family:inherit;white-space:nowrap;flex-shrink:0}
.view-switch .vs-btn:hover{color:var(--t1);background:rgba(255,255,255,.35)}
.view-switch .vs-btn.active{background:rgba(255,255,255,.88);color:#0e3a5a;box-shadow:0 1px 3px rgba(0,0,0,.18)}
@media print{#yv-ctr .yv-nav,.yv-export-bar,.yv-tip-i,.yv-tier-tog,.yv-arrow{display:none!important}.yv-card{break-inside:avoid}}
/* My Unit panel */
.mu-tier-picker{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.mu-tier{padding:10px 14px;border-radius:10px;border:2px solid var(--brd);background:var(--bg2);cursor:pointer;text-align:center;transition:all .15s;min-width:80px}
.mu-tier:hover{border-color:#f5a020}
.mu-tier.active{border-color:#0e3a5a;background:rgba(14,58,90,.1)}
.mu-tier .mu-amt{font-size:20px;font-weight:800;color:var(--t1);display:block}
.mu-tier .mu-info{font-size:10px;color:var(--t4);margin-top:2px}
.mu-tier.active .mu-amt{color:var(--acc)}
.mu-section{margin-top:20px;padding-top:16px;border-top:1px solid var(--brd2)}
.mu-section h4{font-size:13px;font-weight:700;color:var(--t2);margin-bottom:10px;text-transform:uppercase;letter-spacing:.03em}
.mu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.mu-stat{background:var(--bg);border:1px solid var(--brd);border-radius:10px;padding:12px;text-align:center}
.mu-stat .mu-v{font-size:22px;font-weight:800}
.mu-stat .mu-l{font-size:10px;color:var(--t4);margin-top:2px;text-transform:uppercase;letter-spacing:.03em}
.mu-bar-row{display:flex;align-items:center;gap:10px;margin:6px 0;font-size:12px}
.mu-bar-label{width:140px;color:var(--t2);text-align:right;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mu-bar-track{flex:1;height:18px;background:var(--bg);border-radius:4px;overflow:hidden;position:relative}
.mu-bar-fill{height:100%;border-radius:4px;transition:width .3s}
.mu-bar-val{width:80px;font-weight:600;color:var(--t1);font-variant-numeric:tabular-nums}
.mu-traj-row{display:grid;grid-template-columns:50px 1fr 80px 70px;gap:8px;align-items:center;padding:5px 0;border-bottom:1px solid var(--brd2);font-size:12px}
.mu-traj-row.mu-traj-hdr{font-weight:700;color:var(--t4);font-size:10px;text-transform:uppercase;letter-spacing:.03em;border-bottom:2px solid var(--brd)}
.mu-traj-bar{height:14px;background:var(--bg);border-radius:3px;overflow:hidden}
.mu-traj-fill{height:100%;background:#f5a020;border-radius:3px;transition:width .3s}
.mu-callout{background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.3);border-radius:8px;padding:12px 16px;font-size:12px;color:var(--t1);line-height:1.7;margin-top:12px}
.mu-callout b{color:var(--acc)}
.mu-warn{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.3)}
.mu-warn b{color:#e07070}

/* === COMMUNITY FEATURES === */
.sug-card{padding:12px 14px;background:var(--bg2);border:1px solid var(--brd);border-radius:10px;margin-bottom:8px}
.sug-text{font-size:13px;color:var(--t1);line-height:1.5;margin-bottom:6px}
.sug-meta{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--t4);flex-wrap:wrap}
.sug-thumb{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:14px;border:1px solid var(--brd);background:none;color:var(--t3);cursor:pointer;font-size:12px;font-family:inherit;transition:all .15s}
.sug-thumb:hover{border-color:#0e3a5a;color:var(--acc)}
.sug-thumb.voted{border-color:var(--pos);color:var(--pos);background:rgba(6,78,59,.08)}
.sug-del{background:none;border:none;color:var(--t4);cursor:pointer;font-size:11px;padding:2px 6px;border-radius:4px;font-family:inherit}
.sug-del:hover{color:#e07070;background:rgba(217,107,90,.1)}
.sug-input{width:100%;padding:10px 14px;background:var(--bg);border:1px solid var(--brd);border-radius:10px;color:var(--t1);font-size:13px;font-family:inherit;resize:vertical;min-height:60px}
.sug-input:focus{outline:none;border-color:#f5a020}
.sug-submit{padding:6px 16px;background:#f5a020;color:#16181a;border:none;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit}
.sug-submit:hover{background:#cc9a35}
.sug-count{font-weight:700;font-variant-numeric:tabular-nums}
.doc-card{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--bg2);border:1px solid var(--brd);border-radius:10px;margin-bottom:6px;transition:border-color .15s}
.doc-card:hover{border-color:var(--brd2)}
.doc-icon{font-size:22px;flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:rgba(232,168,76,.08);border-radius:8px}
.doc-info{flex:1;min-width:0}
.doc-name{font-size:13px;font-weight:600;color:var(--t1);cursor:pointer;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-name:hover{color:var(--acc)}
.doc-detail{font-size:11px;color:var(--t4);margin-top:2px}
.doc-upload-zone{border:2px dashed var(--brd);border-radius:10px;padding:16px;text-align:center;cursor:pointer;transition:border-color .2s}
.doc-upload-zone:hover,.doc-upload-zone.drag-over{border-color:#f5a020;background:rgba(232,168,76,.04)}
.nbr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:10px}
.nbr-card{padding:16px;background:var(--bg2);border:1px solid var(--brd);border-radius:12px;text-align:center;transition:border-color .15s}
.nbr-card:hover{border-color:var(--brd2)}
.nbr-avatar{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid var(--brd);margin:0 auto 8px}
.nbr-placeholder{width:72px;height:72px;border-radius:50%;background:rgba(232,168,76,.1);border:2px dashed var(--brd);margin:0 auto 8px;display:flex;align-items:center;justify-content:center;font-size:28px;color:var(--t4)}
.nbr-name{font-size:14px;font-weight:700;color:var(--t1)}
.nbr-unit{font-size:11px;color:#0e3a5a;font-weight:600;margin-top:2px}
.nbr-bio{font-size:12px;color:var(--t2);margin-top:6px;line-height:1.5}
.nbr-edit{margin-top:8px;font-size:11px;color:var(--t4);background:none;border:1px solid var(--brd);border-radius:6px;padding:3px 10px;cursor:pointer;font-family:inherit}
.nbr-edit:hover{color:var(--t1);border-color:var(--brd2)}
.dog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-top:10px}
.dog-card{padding:16px 14px 14px;background:var(--bg2);border:1px solid var(--brd);border-radius:14px;text-align:center;transition:border-color .15s}
.dog-card:hover{border-color:var(--brd2)}
.dog-avatar{width:130px;height:130px;border-radius:50%;object-fit:cover;border:3px solid var(--brd);margin:0 auto 8px;box-shadow:0 4px 14px rgba(0,0,0,.3)}
.dog-placeholder{width:130px;height:130px;border-radius:50%;background:rgba(232,168,76,.1);border:2px dashed var(--brd);margin:0 auto 8px;display:flex;align-items:center;justify-content:center;font-size:44px}
.dog-name{font-size:15px;font-weight:700;color:var(--t1);margin-top:2px}
.dog-breed{font-size:11px;color:#0e3a5a;margin-top:2px}
.dog-humans{font-size:11px;color:var(--t3);margin-top:3px;line-height:1.35}
.dog-owner{font-size:11px;color:var(--t4);margin-top:2px}
.dog-bio{font-size:12px;color:var(--t2);margin-top:5px;line-height:1.45}
.cal-month{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;margin-top:8px;font-size:12px}
.cal-hdr{text-align:center;font-weight:700;color:var(--t4);padding:4px 0;font-size:10px;text-transform:uppercase}
.cal-day{text-align:center;padding:6px 2px;border-radius:6px;color:var(--t2);min-height:32px;position:relative}
.cal-day.today{background:rgba(232,168,76,.12);color:#f5a020;font-weight:700}
.cal-day.empty{color:transparent}
.cal-day.has-event{cursor:pointer}
.cal-day.has-event::after{content:'';position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:#f5a020}
.cal-day.has-event.board::after{background:#6690a8}
.cal-event{padding:8px 12px;background:var(--bg2);border:1px solid var(--brd);border-radius:8px;margin-top:4px;font-size:12px;display:flex;align-items:center;gap:8px}
.cal-event-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.cal-nav-btn{background:none;border:1px solid var(--brd);border-radius:6px;padding:4px 10px;color:var(--t2);cursor:pointer;font-family:inherit;font-size:12px}
.cal-nav-btn:hover{border-color:var(--brd2);color:var(--t1)}
/* Banner system */
#banner-zone{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.site-banner{display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:8px;font-size:13px;line-height:1.4;border:1px solid transparent;animation:bannerIn .3s ease}
@keyframes bannerIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.site-banner.info{background:#0a2a40;border-color:#1e5070;color:#80bcd8}
.site-banner.warning{background:#2a1f08;border-color:#5a3e10;color:#d4b060}
.site-banner.alert{background:#2a0808;border-color:#5a1818;color:#d48080}
.site-banner.success{background:#082a18;border-color:#185a30;color:#60d4a0}
.site-banner .banner-icon{font-size:16px;flex-shrink:0}
.site-banner .banner-text{flex:1}
.site-banner .banner-dismiss{background:none;border:none;cursor:pointer;opacity:.5;font-size:14px;padding:2px 4px;line-height:1;color:inherit;transition:opacity .15s;flex-shrink:0}
.site-banner .banner-dismiss:hover{opacity:1}
/* Settings tab */
#settings-ctr .settings-section{background:var(--bg1);border:1px solid var(--brd2);border-radius:12px;padding:18px 20px;margin-bottom:14px}
#settings-ctr .settings-section h3{font-size:13px;font-weight:700;color:var(--t2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px;display:flex;align-items:center;gap:8px}
#settings-ctr .settings-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap}
#settings-ctr .settings-label{font-size:12px;color:var(--t3);min-width:130px;font-weight:500}
/* Administration dropdown */
.admin-dd{position:relative;display:inline-block}
/* Banner admin */
.banner-admin-row{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--bg2);border-radius:8px;border:1px solid var(--brd);margin-bottom:6px}
.banner-admin-row .ban-type{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.banner-admin-row.info .ban-type{background:#3088aa}
.banner-admin-row.warning .ban-type{background:#d4b060}
.banner-admin-row.alert .ban-type{background:#c06060}
.banner-admin-row.success .ban-type{background:#40c080}
/* Inline expense info expansion */
.exp-inline-info{margin:8px 0 4px 20px;padding:10px 12px;background:rgba(0,0,0,.25);border-radius:8px;border-left:2px solid var(--brd);font-size:12px;animation:infoSlide .2s ease}
@keyframes infoSlide{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.exp-info-gap{min-width:40px}

/* ── Dog Carousel ─────────────────────────────────── */
.dog-carousel{position:relative;background:var(--bg1);border:1px solid var(--brd);border-radius:14px;overflow:hidden;margin-top:10px}
.dog-carousel-track{position:relative}
.dog-carousel-slide{display:none;animation:dogFadeIn .5s ease}
.dog-carousel-slide.active{display:block}
@keyframes dogFadeIn{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}
.dog-carousel-inner{display:flex;align-items:center;gap:20px;padding:24px 28px}
.dog-carousel-photo{width:150px;height:150px;border-radius:50%;object-fit:cover;border:3px solid var(--brd);flex-shrink:0;box-shadow:0 4px 16px rgba(0,0,0,.35)}
.dog-carousel-nophoto{width:150px;height:150px;border-radius:50%;background:var(--bg2);border:3px solid var(--brd);display:flex;align-items:center;justify-content:center;font-size:48px;flex-shrink:0}
.dog-carousel-info{flex:1;min-width:0}
.dog-carousel-name{font-size:22px;font-weight:800;color:var(--t1);letter-spacing:-.02em;margin-bottom:3px}
.dog-carousel-breed{font-size:13px;color:var(--acc);font-weight:600;margin-bottom:4px}
.dog-carousel-owner{font-size:12px;color:var(--t3);margin-bottom:6px}
.dog-carousel-bio{font-size:13px;color:var(--t2);line-height:1.55}
.dog-carousel-nav{display:flex;align-items:center;justify-content:center;gap:12px;padding:0 20px 16px}
.dog-carousel-arrow{background:var(--bg2);border:1px solid var(--brd);border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--t2);cursor:pointer;transition:all .15s;line-height:1;padding:0}
.dog-carousel-arrow:hover{background:var(--bg3);color:var(--t1);border-color:var(--acc)}
.dog-carousel-dots{display:flex;gap:7px;align-items:center}
.dog-dot{width:8px;height:8px;border-radius:50%;background:var(--brd);cursor:pointer;transition:all .2s}
.dog-dot.active{background:var(--acc);transform:scale(1.25)}
.dog-dot:hover{background:var(--t3)}
.dog-carousel-counter{text-align:center;font-size:11px;color:var(--t4);padding-bottom:12px;letter-spacing:.04em}

/* Current model highlight */
.mdl-item.mdl-current{border-color:rgba(212,168,60,.4);background:linear-gradient(135deg,rgba(212,168,60,.06),rgba(212,168,60,.02))}
.mdl-item.mdl-current:hover{border-color:rgba(212,168,60,.6)}
.mdl-current-badge{display:inline-block;font-size:10px;font-weight:700;color:var(--acc);background:rgba(212,168,60,.12);border:1px solid rgba(212,168,60,.25);border-radius:4px;padding:1px 5px;letter-spacing:.02em;vertical-align:middle;margin-left:5px;text-transform:uppercase}

/* ── Toolbar (replaces hdr-btns + view-switch) ────────────── */
.toolbar{display:flex;align-items:center;gap:0;background:rgba(8,18,36,.82);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:3px;margin-bottom:12px;overflow:visible;flex-wrap:nowrap;position:relative;z-index:200;box-shadow:0 4px 24px rgba(0,0,0,.35)}
.tb-tabs-scroll{flex:1;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.toolbar .view-switch{display:flex;gap:0;flex-shrink:0;flex-wrap:nowrap;align-items:center;background:none;border:none;padding:0;margin:0;border-radius:0;overflow:visible}
.toolbar .vs-btn{padding:6px 11px;border-radius:7px;font-size:12px;font-weight:600;cursor:pointer;color:rgba(255,255,255,.55);transition:all .15s;border:none;background:none;font-family:inherit;white-space:nowrap;flex-shrink:0}
.toolbar .vs-btn:hover{color:rgba(255,255,255,.95);background:rgba(255,255,255,.12)}
.toolbar .vs-btn.active{background:rgba(56,189,248,.22);color:#fff;box-shadow:0 1px 6px rgba(56,189,248,.3);text-shadow:0 0 10px rgba(56,189,248,.5)}
.toolbar-actions{display:flex;align-items:center;gap:0;flex-shrink:0;overflow:visible;position:relative;z-index:201}
#vs-community-wrap{position:relative;display:inline-flex;align-items:center;flex-shrink:0}

/* Mobile: two clean rows — tabs on top, actions below */
.tb-sep{width:1px;height:20px;background:rgba(14,58,90,.2);margin:0 3px;flex-shrink:0}
@media(max-width:700px){.tb-sep{display:none}}
.tb-btn{padding:5px 10px;border-radius:7px;border:none;background:none;color:var(--t1);cursor:pointer;font-size:12px;font-weight:600;font-family:inherit;white-space:nowrap;transition:all .15s;flex-shrink:0}
.tb-btn:hover{background:rgba(0,0,0,.06);color:var(--t2)}
.tb-btn:disabled{opacity:.3;cursor:default}
.tb-save{color:var(--acc)!important;border:1px solid var(--acc)!important;border-radius:7px;padding:4px 10px}
.tb-save:hover{background:rgba(184,144,46,.1)!important}
.tb-help{color:var(--t3)}
.tb-dd-wrap{position:relative;display:inline-block}
.tb-dd-menu{position:absolute;top:calc(100% + 4px);left:0;background:rgba(12,22,42,.96);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:4px 0;z-index:9000;min-width:210px;box-shadow:0 8px 32px rgba(0,0,0,.5);white-space:nowrap}
/* Identity strip */
.hdr-identity{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.hdr-identity #model-name-hdr{font-size:13px;font-weight:600;color:var(--t2);cursor:pointer;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hdr-identity #model-name-hdr:hover{color:var(--t1)}
/* vd-sep helper */
.vd-sep{border-top:1px solid var(--brd2);margin:4px 0}

/* ── Library Tab ───────────────────────────────────────────── */
.lib-section{margin-bottom:24px}
.lib-section-hdr{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--brd2);margin-bottom:10px}
.lib-cat-icon{font-size:22px;flex-shrink:0}
.lib-cat-name{font-size:14px;font-weight:700;color:var(--t1)}
.lib-cat-desc{font-size:11px;color:var(--t4);margin-top:1px}
.lib-doc-list{display:flex;flex-direction:column;gap:6px}
.lib-doc-item{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--bg1);border:1px solid var(--brd2);border-radius:10px;transition:border-color .15s}
.lib-doc-item:hover{border-color:var(--brd)}
.lib-doc-icon{font-size:20px;flex-shrink:0;width:24px;text-align:center}
.lib-doc-body{flex:1;min-width:0}
.lib-doc-name{font-size:13px;font-weight:600;color:var(--t1);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lib-doc-name:hover{color:var(--acc);text-decoration:underline}
.lib-doc-meta{display:flex;gap:8px;flex-wrap:wrap;font-size:11px;color:var(--t4);margin-top:3px}
.lib-doc-meta span::before{content:"·";margin-right:8px}
.lib-doc-meta span:first-child::before{content:"";margin-right:0}
.lib-doc-actions{display:flex;align-items:center;gap:4px;flex-shrink:0}
.lib-drop-zone{border:2px dashed var(--brd);border-radius:10px;padding:28px 20px;text-align:center;cursor:pointer;transition:all .2s}
.lib-drop-zone:hover,.lib-drop-zone.drag-over{border-color:var(--acc);background:rgba(184,144,46,.05)}
.min-lbl{font-size:11px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.04em}

/* ── CD rate inline in assessment card ─────────────────────── */
.cd-inline{background:var(--bg2);border:1px solid var(--brd2);border-radius:8px;padding:6px 12px}
.cd-inline select{background:var(--bg1)!important;border-color:var(--brd)!important;color:var(--acc)!important;font-weight:700}

/* ── Floating Suggestion Widget ─────────────────────────────── */
/* Wooden Suggestion Box */
/* ── Wooden Suggestion Box ─────────────────────────────────────────── */
.sug-box-btn{
  position:fixed;bottom:24px;right:24px;z-index:9500;
  width:76px;height:80px;
  background:
    repeating-linear-gradient(
      90deg,
      rgba(0,0,0,.06) 0px, rgba(0,0,0,0) 1px,
      rgba(255,255,255,.04) 2px, rgba(0,0,0,0) 3px
    ),
    repeating-linear-gradient(
      180deg,
      rgba(0,0,0,.04) 0px, rgba(0,0,0,0) 8px
    ),
    linear-gradient(170deg, #c8922a 0%, #a06820 40%, #8b5a18 65%, #6b4310 100%);
  border:3px solid #4a2e0a;
  border-radius:5px 5px 3px 3px;
  box-shadow:
    inset 0 1px 0 rgba(255,220,120,.3),
    inset 2px 0 4px rgba(0,0,0,.15),
    inset -2px 0 4px rgba(0,0,0,.15),
    inset 0 -3px 6px rgba(0,0,0,.35),
    0 6px 24px rgba(0,0,0,.55),
    0 2px 6px rgba(0,0,0,.4);
  cursor:pointer;
  user-select:none;
  transition:transform .15s, box-shadow .15s;
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  padding:10px 6px 8px;
  box-sizing:border-box;
}
.sug-box-btn:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,220,120,.3),inset 0 -3px 6px rgba(0,0,0,.35),0 10px 30px rgba(0,0,0,.65),0 3px 8px rgba(0,0,0,.4)}
.sug-box-btn:active{transform:translateY(1px)}
.sug-box-slot{
  width:44px;height:5px;
  background:#2a1505;
  border-radius:3px;
  flex-shrink:0;
  box-shadow:inset 0 2px 5px rgba(0,0,0,.9),inset 0 1px 2px rgba(0,0,0,.8),0 1px 0 rgba(255,200,80,.15);
}
.sug-box-label{
  font-size:7.5px;font-weight:900;letter-spacing:.14em;
  color:#f5deb3;text-shadow:0 1px 3px rgba(0,0,0,.7),0 -1px 0 rgba(0,0,0,.4);
  text-align:center;
  font-family:'DM Sans',system-ui,sans-serif;
  line-height:1.3;
  flex-shrink:0;
}
.sug-float-badge{
  position:absolute;top:-6px;right:-6px;
  background:var(--neg);color:#fff;
  font-size:10px;font-weight:800;
  min-width:18px;height:18px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  padding:0 4px;box-shadow:0 1px 4px rgba(0,0,0,.4);
}
.sug-float-panel{
  position:fixed;bottom:112px;right:24px;z-index:9501;
  width:340px;max-width:calc(100vw - 48px);
  background:rgba(8,18,34,.97);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.15);border-radius:14px;
  box-shadow:0 12px 40px rgba(0,0,0,.55);
  display:flex;flex-direction:column;max-height:480px;
}
.sug-float-hdr{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.12);
  font-size:13px;font-weight:700;color:#e2f0ff;
  flex-shrink:0;
}
.sug-float-body{padding:10px 12px;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:8px}
.sug-float-list{display:flex;flex-direction:column;gap:6px}
.sug-float-item{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:10px 12px}
.sug-float-text{font-size:12px;color:#d0e8f8;line-height:1.5;margin-bottom:6px}
.sug-float-meta{display:flex;align-items:center;gap:8px;font-size:11px;color:#7aa8c8}
.sug-float-textarea{
  width:100%;min-height:80px;padding:8px 10px;resize:vertical;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);border-radius:8px;
  color:#e2f0ff;font-size:12px;font-family:inherit;
  box-sizing:border-box;outline:none;
}
.sug-float-textarea::placeholder{color:rgba(160,200,230,.5)}
.sug-float-textarea:focus{border-color:#4a9bc0}
@media(max-width:480px){
  .sug-float-panel{right:12px;bottom:72px;width:calc(100vw - 24px)}
  .sug-float-btn{right:12px;bottom:16px;padding:9px 14px}
  .sug-float-label{display:none}
}
@media print{.sug-float-btn,.sug-box-btn,.sug-float-panel{display:none!important}}
/* ── Tide Widget (header badge) ─────────────────────────────────────────── */
#tide-widget{display:inline-flex;align-items:center;margin-left:10px;vertical-align:middle}
.tide-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 9px 3px 6px;border-radius:20px;cursor:pointer;font-size:12px;font-weight:600;border:1px solid transparent;transition:all .2s;user-select:none;white-space:nowrap;color:var(--t1)}
.tide-badge:hover{transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,.15)}
.tide-badge-text{display:flex;align-items:center;gap:4px}
.tide-ht{font-weight:800;font-variant-numeric:tabular-nums}
.tide-arrow{font-size:13px;font-weight:800}
.tide-dir{font-weight:500;color:var(--t2);font-size:11px}
.tide-risk-low{background:rgba(255,255,255,.82);border-color:rgba(39,174,96,.5);color:#0d5c2e}
.tide-risk-med{background:rgba(255,255,255,.82);border-color:rgba(180,83,8,.5);color:#6b2d08}
.tide-risk-high{background:rgba(255,255,255,.82);border-color:rgba(192,57,43,.5);color:#7f1d1d}
.tide-loading{background:rgba(255,255,255,.75);border-color:rgba(255,255,255,.5);color:#1a3a55}
.tide-offline{background:rgba(255,255,255,.6);border-color:rgba(255,255,255,.4);color:#2a4a65;opacity:.85}

/* ── Tide Panel ─────────────────────────────────────────────────────────── */
.tide-panel-box{width:540px;max-height:88vh;overflow-y:auto;background:var(--bg2)}
.tide-section-label{font-size:11px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}
.tide-current-strip{display:flex;align-items:flex-start;gap:16px;padding:14px 16px;background:var(--bg1);border:1px solid var(--brd);border-radius:10px}
.tide-gauge-wrap{flex-shrink:0;color:var(--t1)}
.tide-gauge-fill{transition:height .8s ease,y .8s ease}
.tide-current-info{flex:1;min-width:0}
.tide-big-ht{font-size:36px;font-weight:800;color:var(--t1);line-height:1;font-variant-numeric:tabular-nums}

/* Hi/Lo grid */
.tide-hilo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.tide-hilo-card{padding:10px 12px;border-radius:8px;border:1px solid var(--brd);text-align:center}
.tide-hilo-high{background:rgba(14,116,144,.12);border-color:rgba(14,116,144,.3)}
.tide-hilo-low{background:rgba(30,58,138,.08);border-color:rgba(30,58,138,.2)}
.tide-hilo-type{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--t3);margin-bottom:4px}
.tide-hilo-height{font-size:18px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums}
.tide-hilo-time{font-size:11px;color:var(--t2);margin-top:3px}

/* SLR table */
.tide-slr-table{border:1px solid var(--brd);border-radius:8px;overflow:hidden;font-size:12px}
.tide-slr-hdr{display:grid;grid-template-columns:50px 50px 1fr 70px 80px;gap:0;padding:7px 12px;background:var(--bg1);font-weight:700;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--t3);border-bottom:1px solid var(--brd)}
.tide-slr-row{display:grid;grid-template-columns:50px 50px 1fr 70px 80px;gap:0;padding:8px 12px;align-items:center;border-bottom:1px solid rgba(0,0,0,.06);color:var(--t1)}
.tide-slr-row:last-child{border-bottom:none}
.tide-slr-row:nth-child(even){background:rgba(0,0,0,.04)}
.tide-slr-bar-wrap{height:4px;background:rgba(0,0,0,.1);border-radius:2px;margin-top:4px;overflow:hidden}
.tide-slr-bar{height:4px;border-radius:2px;transition:width .4s ease}

/* Mobile */
@media(max-width:600px){
  .tide-panel-box{width:96vw}
  .tide-hilo-grid{grid-template-columns:repeat(2,1fr)}
  .tide-slr-hdr,.tide-slr-row{grid-template-columns:44px 44px 1fr 56px 64px;font-size:11px}
  .tide-dir{display:none}
}
/* ── Comps Panel ─────────────────────────────────────────────────────────── */
.comps-panel-box{width:640px;max-height:90vh;overflow-y:auto;background:var(--bg2)}
.comps-section{padding:14px 16px;background:var(--bg1);border:1px solid var(--brd);border-radius:10px}
.comps-section-label{font-size:11px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}
.comps-national{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px;padding:12px 14px;background:var(--bg1);border:1px solid var(--brd);border-radius:10px}
.comps-national-item{text-align:center;padding:8px 4px}
.comps-nat-val{display:block;font-size:22px;font-weight:800;color:var(--t1);font-variant-numeric:tabular-nums}
.comps-nat-lbl{display:block;font-size:10px;color:var(--t3);margin-top:3px;line-height:1.3}
/* Comp form */
.comp-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.comp-field{grid-column:1/-1}
.comp-field-half{grid-column:span 1}
.comp-label{display:block;font-size:11px;font-weight:700;color:var(--t3);margin-bottom:4px;text-transform:uppercase;letter-spacing:.04em}
.comp-input{width:100%;padding:7px 10px;background:var(--bg3);border:1px solid var(--brd);border-radius:6px;color:var(--t1);font-size:13px;font-family:inherit;box-sizing:border-box}
.comp-input:focus{outline:none;border-color:var(--t3)}
textarea.comp-input{min-height:52px}
/* Mobile */
@media(max-width:660px){
  .comps-panel-box{width:96vw}
  .comp-form-grid{grid-template-columns:1fr}
  .comp-field-half{grid-column:1/-1}
  .comps-national{grid-template-columns:repeat(3,1fr)}
}

/* ── News Feed ─────────────────────────────────────────────── */
.news-header{margin-bottom:12px}
.news-list{display:flex;flex-direction:column;gap:0}
.news-item{padding:14px 16px;background:#fff;border-bottom:1px solid rgba(14,58,90,.1);transition:background .15s}
.news-item:first-child{border-radius:10px 10px 0 0}
.news-item:last-child{border-radius:0 0 10px 10px;border-bottom:none}
.news-item:only-child{border-radius:10px;border-bottom:none}
.news-item:hover{background:#f5f9fd}
.news-item-boosted{border-left:3px solid #1a7a50}
.news-item-boosted:not(:first-child){margin-top:0}

/* Owner FAQ */
.qa{margin-bottom:14px;padding:10px 14px;background:var(--bg2);border-radius:8px;border-left:3px solid var(--acc)}
.qa .q{font-size:13px;font-weight:700;color:var(--t1);margin-bottom:5px}
.qa .a{font-size:13px;color:var(--t2);line-height:1.55}

/* ══════════════════════════════════════════════════════════
   MOBILE NAVIGATION — hamburger bar + slide-in drawer
   Active only on ≤700px; zero effect on desktop
   ══════════════════════════════════════════════════════════ */

/* Hide mobile chrome on desktop */
.mob-bar,.mob-drawer,.mob-backdrop{display:none}

@media(max-width:700px){

  /* ── Hide desktop toolbar ─────────────────────────────── */
  .toolbar{display:none!important}

  /* ── Mobile top bar ───────────────────────────────────── */
  .mob-bar{
    display:flex;align-items:center;gap:0;
    height:52px;padding:0 12px;margin-bottom:10px;
    background:rgba(255,255,255,.93);
    border:1px solid rgba(255,255,255,.7);
    border-radius:10px;
    box-shadow:0 2px 8px rgba(0,40,80,.16);
    position:relative;z-index:100;
  }

  /* Hamburger button */
  .mob-ham{
    width:40px;height:40px;padding:8px;border:none;background:none;
    cursor:pointer;flex-shrink:0;display:flex;flex-direction:column;
    justify-content:center;gap:5px;border-radius:7px;
  }
  .mob-ham:hover{background:rgba(14,58,90,.08)}
  .mob-ham span{
    display:block;height:2px;width:22px;
    background:#0e3a5a;border-radius:2px;
    transition:all .22s ease;
  }
  /* Animated X state */
  .mob-ham.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .mob-ham.open span:nth-child(2){opacity:0;transform:scaleX(0)}
  .mob-ham.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  /* Current view title */
  .mob-bar-title{
    flex:1;min-width:0;text-align:center;
    font-size:13px;font-weight:700;color:#0e3a5a;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    padding:0 8px;
  }

  /* Right side of bar */
  .mob-bar-right{display:flex;align-items:center;gap:6px;flex-shrink:0}
  .mob-save-ind{font-size:11px}
  .mob-role-badge{
    font-size:9px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
    padding:2px 6px;border-radius:8px;background:#0e3a5a22;color:#0e3a5a;
    display:none; /* shown by JS after role is known */
  }

  /* ── Backdrop ─────────────────────────────────────────── */
  .mob-backdrop{
    display:none;
    position:fixed;inset:0;
    background:rgba(4,18,30,.45);
    z-index:9998;
    backdrop-filter:blur(2px);
    -webkit-backdrop-filter:blur(2px);
  }
  .mob-backdrop.open{display:block}

  /* ── Drawer panel ─────────────────────────────────────── */
  .mob-drawer{
    display:flex;flex-direction:column;
    position:fixed;top:0;left:0;bottom:0;
    width:min(300px,88vw);
    background:#fff;
    z-index:9999;
    transform:translateX(-105%);
    transition:transform .28s cubic-bezier(.4,0,.2,1);
    box-shadow:4px 0 24px rgba(0,40,80,.22);
    overflow:hidden;
  }
  .mob-drawer.open{transform:translateX(0)}

  /* Identity header */
  .mob-drawer-identity{
    padding:20px 18px 14px;
    background:linear-gradient(135deg,#0e3a5a,#1d6fa4);
    color:#fff;
    flex-shrink:0;
  }

  /* Nav scroll area */
  .mob-nav{
    flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;
    padding:8px 0 32px;
  }

  .mob-nav-section{margin-bottom:2px}

  /* Top-level nav item (direct page link) */
  .mob-nav-item{
    display:block;width:100%;text-align:left;
    padding:12px 20px;
    border:none;background:none;
    font-size:14px;font-weight:600;color:#1a3a55;
    cursor:pointer;font-family:inherit;
    transition:background .12s;
  }
  .mob-nav-item:hover,.mob-nav-item:active{background:rgba(14,58,90,.07)}
  .mob-nav-item.active{
    background:rgba(14,58,90,.12);color:#0e3a5a;
    border-left:3px solid #0e3a5a;padding-left:17px;
  }

  /* Accordion group header */
  .mob-nav-group{
    display:flex;align-items:center;justify-content:space-between;
    width:100%;padding:12px 20px;
    border:none;background:none;
    font-size:14px;font-weight:600;color:#1a3a55;
    cursor:pointer;font-family:inherit;
    transition:background .12s;
  }
  .mob-nav-group:hover{background:rgba(14,58,90,.07)}
  .mob-nav-group.open{color:var(--acc)}

  /* Accordion arrow */
  .mob-acc-arrow{
    font-size:11px;color:#94a3b8;
    transition:transform .2s ease;flex-shrink:0;
  }
  .mob-nav-group.open .mob-acc-arrow{transform:rotate(90deg);color:var(--acc)}

  /* Accordion body — collapsed by default */
  .mob-acc-body{
    max-height:0;overflow:hidden;
    transition:max-height .25s ease;
    background:rgba(14,58,90,.03);
  }
  .mob-acc-body.open{max-height:600px}

  /* Sub-item */
  .mob-nav-sub{
    display:block;width:100%;text-align:left;
    padding:10px 20px 10px 32px;
    border:none;background:none;
    font-size:13px;font-weight:500;color:#334155;
    cursor:pointer;font-family:inherit;
    transition:background .12s;
  }
  .mob-nav-sub:hover,.mob-nav-sub:active{background:rgba(14,58,90,.09)}
  .mob-nav-sub.active{
    color:#0e3a5a;font-weight:700;
    background:rgba(14,58,90,.1);
    border-left:3px solid #0e3a5a;padding-left:29px;
  }

  /* Separator line */
  .mob-nav-sep{height:1px;background:rgba(14,58,90,.1);margin:4px 0}

  /* Body scroll lock when drawer open */
  body.mob-open{overflow:hidden;position:fixed;width:100%}

}
/* ── END MOBILE NAV ─────────────────────────────────────── */


/* ============================================================
   GLASSMORPHISM THEME OVERRIDES
   ============================================================ */

/* ── Imports ─────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

/* ── New design tokens ────────────────────────────────────── */
:root {
  --glass-bg:       rgba(255,255,255,0.07);
  --glass-bg-hover: rgba(255,255,255,0.12);
  --glass-bg-card:  rgba(255,255,255,0.09);
  --glass-border:   rgba(255,255,255,0.16);
  --glass-border-hover: rgba(255,255,255,0.30);
  --glass-shadow:   0 8px 32px rgba(0,0,0,0.32);
  --glass-shadow-lg:0 20px 60px rgba(0,0,0,0.45);
  --glow-gold:      rgba(251,191,36,0.25);
  --glow-blue:      rgba(56,189,248,0.18);
  --acc-gold:       #fbbf24;
  --acc-sky:        #38bdf8;
  --acc-glow:       #fbbf24;
  --radius-lg:      16px;
  --radius-md:      12px;
  --radius-sm:      8px;
}

/* ── Body — rich deep gradient ────────────────────────────── */
body {
  font-family: 'Inter', 'DM Sans', system-ui, sans-serif !important;
  background: linear-gradient(135deg,
    #0a0f1e 0%,
    #0d1b2a 25%,
    #0f2137 50%,
    #0d1e33 75%,
    #080d1a 100%) fixed !important;
  color: #e2eaf4 !important;
  border-top: 3px solid transparent !important;
  border-image: linear-gradient(90deg, #fbbf24, #38bdf8, #818cf8, #fbbf24) 1 !important;
}

/* Subtle animated noise texture overlay */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image:
    radial-gradient(ellipse at 20% 20%, rgba(56,189,248,0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 80%, rgba(129,140,248,0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 0%, rgba(251,191,36,0.04) 0%, transparent 40%);
  pointer-events: none;
  z-index: 0;
}

/* ── Color system remaps ──────────────────────────────────── */
:root {
  --t1: #f0f6ff;
  --t2: #cbd8ea;
  --t3: #94afc8;
  --t4: #5e7a96;
  --acc: #38bdf8;
  --acc2: #0ea5e9;
  --pos: #34d399;
  --pos2: #10b981;
  --warn: #fbbf24;
  --neg: #f87171;
  --bg0: rgba(255,255,255,0.04);
  --bg1: rgba(255,255,255,0.07);
  --bg2: rgba(255,255,255,0.10);
  --bg3: rgba(255,255,255,0.14);
  --bg:  rgba(255,255,255,0.06);
  --brd: rgba(255,255,255,0.13);
  --brd2:rgba(255,255,255,0.20);
  --orange: #fb923c;
  --pink: #f472b6;
}

/* ── Header ───────────────────────────────────────────────── */
.header {
  background: rgba(255,255,255,0.05) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: var(--radius-lg) !important;
  padding: 14px 20px !important;
  margin-bottom: 12px !important;
  box-shadow: var(--glass-shadow) !important;
}

h1 {
  color: #f0f6ff !important;
  -webkit-text-fill-color: #f0f6ff !important;
  background: none !important;
  font-size: 22px !important;
  letter-spacing: -0.03em !important;
}

.sub { color: var(--t3) !important; }

/* ── Cards — frosted glass ────────────────────────────────── */
.card {
  background: var(--glass-bg-card) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--glass-shadow) !important;
  transition: all 0.25s ease !important;
}
.card:hover {
  background: var(--glass-bg-hover) !important;
  border-color: var(--glass-border-hover) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.1) !important;
  transform: translateY(-1px) !important;
}

.card-label {
  color: var(--t2) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
}

/* ── Sticky nav ───────────────────────────────────────────── */
.sec-nav {
  background: rgba(10,15,30,0.72) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-bottom: 1px solid var(--glass-border) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3) !important;
}
.sec-nav .nav-btn {
  color: rgba(255,255,255,0.5) !important;
  border-radius: 20px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  transition: all 0.2s !important;
}
.sec-nav .nav-btn:hover {
  color: rgba(255,255,255,0.95) !important;
  background: rgba(255,255,255,0.12) !important;
}
.sec-nav .nav-btn.active {
  background: rgba(56,189,248,0.18) !important;
  color: #7dd8fb !important;
  box-shadow: 0 0 12px rgba(56,189,248,0.2), inset 0 0 0 1px rgba(56,189,248,0.35) !important;
}

/* ── View switch pill nav ─────────────────────────────────── */
.view-switch {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid var(--glass-border) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-radius: 12px !important;
  padding: 3px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
.view-switch .vs-btn {
  color: rgba(255,255,255,0.55) !important;
  font-weight: 600 !important;
  border-radius: 9px !important;
  transition: all 0.2s !important;
}
.view-switch .vs-btn:hover {
  color: rgba(255,255,255,0.95) !important;
  background: rgba(255,255,255,0.12) !important;
}
.view-switch .vs-btn.active {
  background: linear-gradient(135deg, rgba(56,189,248,0.3), rgba(129,140,248,0.22)) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.2) !important;
  text-shadow: 0 0 12px rgba(56,189,248,0.6) !important;
}

/* ── Buttons ──────────────────────────────────────────────── */
.btn {
  background: rgba(255,255,255,0.09) !important;
  border: 1px solid var(--glass-border) !important;
  color: var(--t2) !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  backdrop-filter: blur(8px) !important;
  transition: all 0.2s ease !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1) !important;
}
.btn:hover {
  background: rgba(255,255,255,0.16) !important;
  border-color: var(--glass-border-hover) !important;
  color: var(--t1) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  transform: translateY(-1px) !important;
}
.btn.active {
  background: linear-gradient(135deg, rgba(56,189,248,0.2), rgba(129,140,248,0.15)) !important;
  border-color: rgba(56,189,248,0.4) !important;
  color: #38bdf8 !important;
  box-shadow: 0 0 12px rgba(56,189,248,0.15) !important;
}

/* ── Big numbers ──────────────────────────────────────────── */
.big-num {
  background: linear-gradient(135deg, #fde68a, #38bdf8) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  filter: drop-shadow(0 0 8px rgba(251,191,36,0.4)) !important;
}
.big-num u {
  color: var(--t3) !important;
  -webkit-text-fill-color: var(--t3) !important;
}

/* ── Expense lanes ────────────────────────────────────────── */
.lane {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: var(--radius-md) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  transition: all 0.2s !important;
}
.lane:hover { border-color: var(--glass-border-hover) !important; }
.lane.dov {
  border-color: rgba(251,191,36,0.5) !important;
  background: rgba(251,191,36,0.06) !important;
  box-shadow: 0 0 20px rgba(251,191,36,0.1) !important;
}

/* Expense items */
.exp {
  border-radius: 10px !important;
  transition: all 0.2s !important;
}
.exp:hover {
  background: rgba(255,255,255,0.06) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.2) !important;
  transform: translateY(-1px) !important;
}

/* ── Sticky sidebar ───────────────────────────────────────── */
.sticky {
  background: rgba(10,15,30,0.6) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--glass-shadow-lg) !important;
}

/* ── Year view cards ──────────────────────────────────────── */
.yv-card {
  background: var(--glass-bg-card) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--glass-shadow) !important;
}
.yv-card:hover {
  border-color: var(--glass-border-hover) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.4) !important;
}

.yv-stat {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: var(--radius-md) !important;
  backdrop-filter: blur(10px) !important;
}
.yv-stat:hover {
  background: rgba(255,255,255,0.10) !important;
  border-color: var(--glass-border-hover) !important;
}

.yv-nav {
  background: rgba(10,15,30,0.72) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-bottom: 1px solid var(--glass-border) !important;
}
.yv-pill:hover { background: rgba(255,255,255,0.1) !important; }
.yv-pill.active {
  background: rgba(56,189,248,0.12) !important;
  border-color: rgba(56,189,248,0.4) !important;
  box-shadow: 0 0 16px rgba(56,189,248,0.15) !important;
}
.yv-pill.active .yr { color: #38bdf8 !important; }
.yv-arrow {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid var(--glass-border) !important;
  backdrop-filter: blur(8px) !important;
}
.yv-arrow:hover { background: rgba(255,255,255,0.14) !important; }

/* ── Community cards ──────────────────────────────────────── */
.nbr-card, .dog-card, .sug-card {
  background: var(--glass-bg-card) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid var(--glass-border) !important;
  transition: all 0.25s !important;
}
.nbr-card:hover, .dog-card:hover, .sug-card:hover {
  background: var(--glass-bg-hover) !important;
  border-color: var(--glass-border-hover) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.35) !important;
}

.nbr-avatar { border-color: rgba(56,189,248,0.4) !important; }
.dog-avatar  { border-color: rgba(251,191,36,0.4) !important; box-shadow: 0 4px 20px rgba(0,0,0,0.4) !important; }

/* ── Modals ───────────────────────────────────────────────── */
.vq-box, .qsave, .help-modal, .cl-modal, .cmp-box, .yv-sum-modal {
  background: rgba(12,20,38,0.88) !important;
  backdrop-filter: blur(32px) !important;
  -webkit-backdrop-filter: blur(32px) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.1) !important;
}
.vq-modal, .help-overlay, .cl-overlay, .cmp-overlay, .mdl-overlay, .qsave-overlay {
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
}

/* ── Model panel ──────────────────────────────────────────── */
.mdl-panel {
  background: rgba(10,18,34,0.92) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-left: 1px solid var(--glass-border) !important;
}

/* ── Inputs / selects ─────────────────────────────────────── */
input[type=text]:not([style]),
input[type=number]:not([style]),
input[type=date]:not([style]),
input[type=email]:not([style]),
textarea:not([style]),
select:not([style]) {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid var(--glass-border) !important;
  color: var(--t1) !important;
  border-radius: 8px !important;
}
input:focus, textarea:focus, select:focus {
  border-color: rgba(56,189,248,0.5) !important;
  box-shadow: 0 0 0 3px rgba(56,189,248,0.1) !important;
  outline: none !important;
}

/* ── Tables ───────────────────────────────────────────────── */
th { border-bottom-color: rgba(255,255,255,0.15) !important; }
tr:nth-child(even) { background: rgba(255,255,255,0.03) !important; }
tr+tr { border-top-color: rgba(255,255,255,0.06) !important; }

/* ── Stat boxes ───────────────────────────────────────────── */
.stat {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(10px) !important;
}
.stat:hover {
  background: rgba(255,255,255,0.1) !important;
  border-color: var(--glass-border-hover) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3) !important;
}
.sv { color: #f0f6ff !important; }
.sl { color: var(--t3) !important; }

/* ── Mu (My Unit) components ──────────────────────────────── */
.mu-stat {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid var(--glass-border) !important;
  backdrop-filter: blur(10px) !important;
}
.mu-stat .mu-v { color: #f0f6ff !important; text-shadow: 0 0 12px rgba(56,189,248,0.3) !important; }
.mu-stat .mu-l { color: var(--t4) !important; }
.mu-tier {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid var(--glass-border) !important;
  backdrop-filter: blur(8px) !important;
}
.mu-tier:hover { border-color: rgba(251,191,36,0.5) !important; }
.mu-tier.active {
  border-color: rgba(56,189,248,0.5) !important;
  background: rgba(56,189,248,0.1) !important;
  box-shadow: 0 0 16px rgba(56,189,248,0.12) !important;
}
.mu-tier.active .mu-amt { color: #7dd8fb !important; }
.mu-tier .mu-amt { color: #f0f6ff !important; }
.mu-tier .mu-info { color: var(--t3) !important; }

/* ── Library / doc cards ──────────────────────────────────── */
.doc-card {
  background: var(--glass-bg-card) !important;
  border: 1px solid var(--glass-border) !important;
  backdrop-filter: blur(10px) !important;
  border-radius: var(--radius-md) !important;
  transition: all 0.2s !important;
}
.doc-card:hover {
  background: var(--glass-bg-hover) !important;
  border-color: var(--glass-border-hover) !important;
  transform: translateY(-1px) !important;
}
.doc-upload-zone {
  border-color: var(--glass-border) !important;
  background: rgba(255,255,255,0.03) !important;
  border-radius: var(--radius-md) !important;
}
.doc-upload-zone:hover {
  border-color: rgba(251,191,36,0.5) !important;
  background: rgba(251,191,36,0.04) !important;
}

/* ── Suggestion submit button ─────────────────────────────── */
.sug-submit {
  background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
  color: #0a0f1e !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 12px rgba(251,191,36,0.3) !important;
  border: none !important;
}
.sug-submit:hover {
  background: linear-gradient(135deg, #fcd34d, #fbbf24) !important;
  box-shadow: 0 4px 20px rgba(251,191,36,0.4) !important;
  transform: translateY(-1px) !important;
}

/* ── Role badges ──────────────────────────────────────────── */
.role-badge.admin  { background: linear-gradient(135deg, #ef4444, #dc2626) !important; }
.role-badge.board  { background: linear-gradient(135deg, #0ea5e9, #0284c7) !important; }
.role-badge.planner{ background: linear-gradient(135deg, #8b5cf6, #7c3aed) !important; }

/* ── Info / alert boxes ───────────────────────────────────── */
.abr {
  background: rgba(239,68,68,0.1) !important;
  border-color: rgba(239,68,68,0.3) !important;
  color: #fca5a5 !important;
}
.agr {
  background: rgba(52,211,153,0.1) !important;
  border-color: rgba(52,211,153,0.3) !important;
  color: #6ee7b7 !important;
}

/* ── Phase / pi boxes ─────────────────────────────────────── */
.pi {
  background: rgba(255,255,255,0.07) !important;
  border-radius: 8px !important;
  transition: all 0.15s !important;
}
.pi.sel {
  outline-color: #fbbf24 !important;
  background: rgba(251,191,36,0.12) !important;
}

/* ── Scrollbar styling ────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.18); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.3); }

/* ── Header identity / toolbar area ──────────────────────── */
.hdr-identity { gap: 8px; }
.tb-dd-wrap > .btn { font-size: 12px !important; }

/* ── Mobile drawer ────────────────────────────────────────── */
#mob-drawer {
  background: rgba(10,18,34,0.95) !important;
  backdrop-filter: blur(32px) !important;
  -webkit-backdrop-filter: blur(32px) !important;
  border-right: 1px solid var(--glass-border) !important;
}

/* ── Mobile bar ───────────────────────────────────────────── */
#mob-bar {
  background: rgba(10,15,30,0.85) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid var(--glass-border) !important;
}

/* ── Onboarding banner ────────────────────────────────────── */
.onboard {
  background: rgba(56,189,248,0.08) !important;
  border: 1px solid rgba(56,189,248,0.2) !important;
}

/* ── Links tab cards ──────────────────────────────────────── */
#links-ctr a, #links-ctr [onclick] {
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

/* ── Print — restore light theme ─────────────────────────── */
@media print {
  body { background: #fff !important; color: #111 !important; }
  body::before { display: none !important; }
  .card, .yv-card, .yv-stat { background: #fff !important; border-color: #ddd !important; backdrop-filter: none !important; }
}


/* ============================================================
   GLASSMORPHISM PHASE 2 — Fix dark-text-on-dark-glass issues
   ============================================================ */

/* ── Toolbar (tab bar) — make it dark glass ───────────────── */
.toolbar {
  background: rgba(8,18,36,0.82) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.35) !important;
}
.toolbar .vs-btn {
  color: rgba(255,255,255,0.55) !important;
  background: none !important;
}
.toolbar .vs-btn:hover {
  color: rgba(255,255,255,0.95) !important;
  background: rgba(255,255,255,0.12) !important;
}
.toolbar .vs-btn.active {
  background: rgba(56,189,248,0.22) !important;
  color: #ffffff !important;
  box-shadow: 0 1px 6px rgba(56,189,248,0.3) !important;
  text-shadow: 0 0 10px rgba(56,189,248,0.5) !important;
}
.tb-sep { background: rgba(255,255,255,0.15) !important; }
.tb-btn { color: rgba(255,255,255,0.6) !important; }
.tb-btn:hover { color: rgba(255,255,255,0.95) !important; background: rgba(255,255,255,0.1) !important; }

/* ── Dropdown menus — dark glass ─────────────────────────── */
.tb-dd-menu {
  background: rgba(12,22,42,0.95) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.5) !important;
}
.vd-item {
  color: rgba(255,255,255,0.75) !important;
  background: none !important;
}
.vd-item:hover {
  background: rgba(255,255,255,0.1) !important;
  color: #ffffff !important;
}
.vd-item.active {
  color: #38bdf8 !important;
  font-weight: 700 !important;
}
.vd-item.active::before { color: #38bdf8 !important; }

/* ── Assessment / unit payment boxes ─────────────────────── */
.pu-box {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  backdrop-filter: blur(10px) !important;
}
.pu-v { color: #f0f6ff !important; }
.pu-l { color: var(--t3) !important; }

/* ── Reserve balance / planner big numbers ────────────────── */
.card-label { color: rgba(255,255,255,0.75) !important; }
.ticks { color: var(--t3) !important; }
.ticks span:hover { color: var(--t1) !important; }

/* ── Building Links / Front Steps ────────────────────────── */
#links-ctr { color: var(--t1) !important; }
#links-ctr a,
#links-ctr button,
#links-ctr [onclick] {
  color: var(--t1) !important;
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-radius: 10px !important;
}
#links-ctr a:hover,
#links-ctr button:hover,
#links-ctr [onclick]:hover {
  background: rgba(255,255,255,0.13) !important;
  border-color: rgba(255,255,255,0.28) !important;
  color: #ffffff !important;
}

/* ── Community tab dropdown wrapper ──────────────────────── */
#vs-community-wrap .tb-dd-menu,
.tb-dd-wrap .tb-dd-menu { /* catches all dropdowns */ }

/* ── Planning + Requests tab text fix ────────────────────── */
/* These use .vs-btn inside .toolbar — already covered above  */
/* But also fix any standalone view-switch outside toolbar    */
.view-switch .vs-btn {
  color: rgba(255,255,255,0.55) !important;
}
.view-switch .vs-btn:hover {
  color: rgba(255,255,255,0.95) !important;
  background: rgba(255,255,255,0.12) !important;
}
.view-switch .vs-btn.active {
  color: #ffffff !important;
  background: linear-gradient(135deg, rgba(56,189,248,0.28), rgba(129,140,248,0.2)) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  text-shadow: 0 0 10px rgba(56,189,248,0.4) !important;
}

/* ── Generic dark-text survivors ─────────────────────────── */
/* Catch all remaining hardcoded dark colors throughout       */
.phase { background: rgba(255,255,255,0.07) !important; border-color: rgba(255,255,255,0.14) !important; }
.ff-compare { background: rgba(255,255,255,0.07) !important; border-color: rgba(255,255,255,0.14) !important; }
.add-form { background: rgba(255,255,255,0.07) !important; border-color: rgba(251,191,36,0.4) !important; }
.add-form label { color: var(--t2) !important; }
.add-form input, .add-form select { background: rgba(255,255,255,0.1) !important; border-color: rgba(255,255,255,0.15) !important; color: var(--t1) !important; }

/* ── Mobile nav ───────────────────────────────────────────── */
.mob-nav-item { color: rgba(255,255,255,0.75) !important; }
.mob-nav-item:hover, .mob-nav-item:active { background: rgba(255,255,255,0.1) !important; }
.mob-nav-item.active { color: #38bdf8 !important; background: rgba(56,189,248,0.12) !important; }
.mob-nav-group { color: rgba(255,255,255,0.75) !important; }
.mob-nav-group:hover { background: rgba(255,255,255,0.1) !important; }
.mob-nav-group.open { color: #38bdf8 !important; }
.mob-nav-sub { color: rgba(255,255,255,0.65) !important; }
.mob-nav-sub:hover, .mob-nav-sub:active { background: rgba(255,255,255,0.1) !important; color: var(--t1) !important; }
.mob-nav-sub.active { color: #38bdf8 !important; }
.mob-nav-sep { background: rgba(255,255,255,0.1) !important; }

/* ── PDF Preview Modal ──────────────────────────────────────── */
#pdf-preview-modal {
  animation: pdfModalIn .2s ease;
}
@keyframes pdfModalIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
#pdf-preview-frame {
  background: #f8f8f8;
}

/* ── Spin animation (used by explain modal + PWA loaders) ───── */
@keyframes spin {
  to { transform: rotate(360deg); }
}
.explain-spinner {
  width: 20px; height: 20px;
  border: 2px solid rgba(251,191,36,.3);
  border-top-color: #fbbf24;
  border-radius: 50%;
  animation: spin .8s linear infinite;
  flex-shrink: 0;
}

/* ── Explain modal scroll ────────────────────────────────────── */
#explain-modal > div {
  scrollbar-width: thin;
  scrollbar-color: rgba(251,191,36,.2) transparent;
}