:root {
  --bg: #071019;
  --bg-soft: #0b1621;
  --panel: rgba(14, 28, 40, .86);
  --panel-2: rgba(17, 33, 47, .96);
  --line: rgba(148, 163, 184, .16);
  --text: #eef7f4;
  --muted: #91a3b2;
  --green: #2ee6a6;
  --green-2: #16c784;
  --danger: #ff6b7d;
  --warning: #f5c66b;
  --shadow: 0 18px 60px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:radial-gradient(circle at 10% 0%,#102637 0,transparent 28%),radial-gradient(circle at 90% 10%,#0b2a22 0,transparent 22%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}
.shell{min-height:100vh;display:grid;grid-template-columns:260px 1fr}
.sidebar{position:sticky;top:0;height:100vh;border-right:1px solid var(--line);background:rgba(5,14,22,.88);backdrop-filter:blur(18px);padding:22px 18px;display:flex;flex-direction:column;gap:20px}
.brand{display:flex;align-items:center;gap:12px;padding:6px 8px 18px}
.logo{width:42px;height:42px;border:1px solid rgba(46,230,166,.45);border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(46,230,166,.22),rgba(46,230,166,.03));box-shadow:inset 0 0 18px rgba(46,230,166,.08)}
.logo::before{content:"◆";color:var(--green);font-size:18px}
.brand strong{letter-spacing:.18em;font-size:14px}.brand small{display:block;color:var(--green);letter-spacing:.35em;font-size:9px;margin-top:3px}
.section-title{font-size:11px;color:#6f8393;text-transform:uppercase;letter-spacing:.15em;margin:4px 10px 8px}
.nav-list{display:grid;gap:7px}.nav-item{border:1px solid transparent;background:transparent;color:#c8d5dd;border-radius:11px;padding:11px 12px;text-align:left;display:flex;justify-content:space-between;align-items:center}.nav-item:hover,.nav-item.active{background:rgba(46,230,166,.10);border-color:rgba(46,230,166,.20);color:#fff}.count{color:#83a093;font-size:12px}
.sidebar-footer{margin-top:auto;display:grid;gap:10px}.secure-note{font-size:12px;color:#7f938e;padding:12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02)}
.main{min-width:0}.topbar{height:74px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:rgba(7,16,25,.62);backdrop-filter:blur(14px);position:sticky;top:0;z-index:20}.status-pill{display:flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid rgba(46,230,166,.18);background:rgba(46,230,166,.08);border-radius:999px;color:#b9f5df;font-size:12px}.dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
.content{padding:28px;max-width:1500px;margin:0 auto}.hero{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin-bottom:22px}.hero h1{margin:0;font-size:29px}.hero p{margin:8px 0 0;color:var(--muted)}
.actions{display:flex;gap:10px;flex-wrap:wrap}.btn{border:1px solid var(--line);background:#122232;color:#eaf4f1;border-radius:10px;padding:10px 14px}.btn:hover{border-color:rgba(46,230,166,.35)}.btn.primary{background:linear-gradient(180deg,#1cc58a,#149b6b);border-color:#27d99b;color:white;font-weight:700}.btn.danger{color:#ffc1ca;border-color:rgba(255,107,125,.28);background:rgba(255,107,125,.06)}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.stat{border:1px solid var(--line);background:linear-gradient(180deg,rgba(18,35,50,.78),rgba(11,24,35,.86));border-radius:15px;padding:16px;box-shadow:var(--shadow)}.stat span{color:var(--muted);font-size:12px}.stat strong{display:block;margin-top:8px;font-size:27px}.stat em{font-style:normal;color:var(--green);font-size:11px}
.workspace{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:16px}.panel{border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:var(--shadow);overflow:hidden}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--line)}.search{width:min(520px,100%);position:relative}.search input{width:100%;background:#09141f;border:1px solid var(--line);color:var(--text);border-radius:10px;padding:11px 12px;outline:none}.search input:focus{border-color:rgba(46,230,166,.42);box-shadow:0 0 0 3px rgba(46,230,166,.07)}
.filters{display:flex;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line);overflow:auto}.chip{border:1px solid var(--line);color:#aebdc8;background:#0a1621;border-radius:999px;padding:7px 10px;font-size:12px;white-space:nowrap}.chip.active{background:rgba(46,230,166,.12);border-color:rgba(46,230,166,.28);color:#dffcf2}
.list{display:grid}.row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 16px;border-bottom:1px solid rgba(148,163,184,.10);cursor:pointer}.row:hover,.row.selected{background:rgba(46,230,166,.055)}.row:last-child{border-bottom:0}.favicon{width:38px;height:38px;border-radius:10px;background:#0a1823;border:1px solid var(--line);display:grid;place-items:center;font-weight:800;color:var(--green)}.row-title{font-weight:700}.row-sub{color:var(--muted);font-size:12px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tag{font-size:11px;padding:5px 8px;border-radius:999px;background:rgba(46,230,166,.09);color:#91eac9;border:1px solid rgba(46,230,166,.12)}
.empty{padding:54px 18px;text-align:center;color:var(--muted)}
.detail{padding:18px}.detail h2{margin:0 0 6px}.detail-sub{color:var(--muted);font-size:13px;margin-bottom:18px}.field{margin:14px 0}.field label{display:block;color:#8ea3b2;font-size:11px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:7px}.value-box{display:flex;align-items:center;gap:8px;background:#09141f;border:1px solid var(--line);border-radius:10px;padding:10px 11px}.value-box code{flex:1;color:#edf7f4;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini{padding:7px 9px;border-radius:8px;border:1px solid var(--line);background:#122232;color:#cfe0e8}.detail-actions{display:flex;gap:8px;margin-top:18px}.divider{height:1px;background:var(--line);margin:18px 0}.security-grid{display:flex;flex-wrap:wrap;gap:7px}.security-badge{font-size:11px;padding:6px 8px;border-radius:8px;border:1px solid rgba(46,230,166,.17);background:rgba(46,230,166,.08);color:#a9f2d6}
.lock-screen{min-height:100vh;display:grid;place-items:center;padding:22px}.lock-card{width:min(460px,100%);border:1px solid var(--line);border-radius:22px;background:rgba(10,22,32,.90);box-shadow:0 30px 90px rgba(0,0,0,.48);padding:30px;backdrop-filter:blur(20px)}.lock-card .brand{justify-content:center}.lock-card h1{text-align:center;margin:8px 0 6px}.lock-card>p{text-align:center;color:var(--muted);margin:0 0 22px}.lock-card input{width:100%;background:#07121b;color:var(--text);border:1px solid var(--line);border-radius:11px;padding:12px 13px;outline:none}.lock-card .btn{width:100%;margin-top:11px}.lock-meta{font-size:11px;color:#6f8393;text-align:center;margin-top:16px;line-height:1.6}.error{color:#ff9baa;font-size:12px;margin-top:8px;min-height:17px}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.62);display:grid;place-items:center;padding:20px;z-index:99}.modal{width:min(620px,100%);max-height:90vh;overflow:auto;border:1px solid var(--line);border-radius:18px;background:#0a1722;box-shadow:0 35px 100px rgba(0,0,0,.6)}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}.modal-body{padding:20px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-field{margin-bottom:13px}.form-field label{display:block;font-size:12px;color:#9aafbd;margin-bottom:6px}.form-field input,.form-field select,.form-field textarea{width:100%;background:#07131d;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:10px 11px;outline:none}.form-field textarea{min-height:90px;resize:vertical}.modal-foot{display:flex;justify-content:flex-end;gap:9px;padding:16px 20px;border-top:1px solid var(--line)}
.toast{position:fixed;right:22px;bottom:22px;background:#0f2a22;color:#c9fae8;border:1px solid rgba(46,230,166,.25);border-radius:11px;padding:11px 14px;z-index:120;box-shadow:var(--shadow);font-size:13px}
@media(max-width:1000px){.shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;border-right:0;border-bottom:1px solid var(--line)}.workspace{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar{top:0}.detail-panel{order:-1}}
@media(max-width:640px){.content{padding:18px}.topbar{padding:0 18px}.stats{grid-template-columns:1fr 1fr}.hero{align-items:flex-start;flex-direction:column}.grid2{grid-template-columns:1fr}.sidebar{padding:14px}.brand{padding-bottom:8px}.nav-list{grid-template-columns:1fr 1fr}.secure-note{display:none}}

/* Monceda Vault v1.1 polish */
.shell{grid-template-columns:286px minmax(0,1fr)}
.sidebar{padding:24px 20px;gap:22px}
.nav-item>span:first-child{display:flex;align-items:center;gap:9px;min-width:0}
.nav-icon{width:18px;color:#6f9489;text-align:center;font-size:12px}
.nav-item.active .nav-icon{color:var(--green)}
.secure-note{display:grid;gap:3px;padding:13px 14px}.secure-note strong{color:#c9ded7;font-size:12px}.secure-note span{font-size:11px;line-height:1.45}
.lock-wide{width:100%;padding:11px 14px}
.topbar{height:72px;padding:0 30px;gap:24px}
.global-search{width:min(520px,48vw);display:flex;align-items:center;gap:9px;background:#08131d;border:1px solid var(--line);border-radius:11px;padding:0 12px}.global-search span{color:#79909e}.global-search input{width:100%;height:40px;border:0;outline:0;background:transparent;color:var(--text)}
.top-actions{display:flex;align-items:center;gap:10px}.icon-btn{white-space:nowrap}
.content{padding:32px;max-width:1600px}.hero{align-items:center;margin-bottom:24px}.eyebrow{display:block;color:var(--green);font-size:10px;letter-spacing:.16em;font-weight:800;margin-bottom:8px}.hero h1{font-size:32px;letter-spacing:-.025em}
.stats{gap:16px;margin-bottom:20px}.stat{padding:18px;border-radius:16px;box-shadow:0 14px 40px rgba(0,0,0,.18)}
.workspace{grid-template-columns:minmax(520px,1.3fr) minmax(400px,.85fr);gap:18px;align-items:start}.credentials-panel,.detail-panel{min-width:0}.panel{box-shadow:0 18px 52px rgba(0,0,0,.22)}
.panel-head{gap:18px}.panel-head>div:first-child{display:grid;gap:3px;min-width:120px}.panel-head>div:first-child strong{font-size:15px}.panel-head>div:first-child span{font-size:11px;color:var(--muted)}.panel-head .search{margin-left:auto;width:min(430px,65%)}
.list{min-height:0}.row{padding:15px 16px;transition:.16s ease;background:transparent}.row:hover{background:rgba(255,255,255,.025)}.row.selected{background:linear-gradient(90deg,rgba(46,230,166,.10),rgba(46,230,166,.035));box-shadow:inset 3px 0 0 rgba(46,230,166,.7)}
.row-end{display:flex;align-items:center;gap:12px}.chev{font-size:22px;color:#516876}.star{color:#f5c66b;font-size:.8em}
.favicon{width:40px;height:40px;border-radius:11px;font-size:13px;letter-spacing:-.02em}.service-gmail,.service-google{color:#f5f7f8}.service-facebook{color:#8ec5ff}.service-instagram{color:#f6a8d0}.service-youtube{color:#ff9b9b}.service-github{color:#e8edf0}.service-paypal{color:#88baff}.service-binance{color:#f5c66b}
.detail{padding:22px}.detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.detail-service{display:flex;align-items:center;gap:13px}.detail-logo{width:48px;height:48px;border-radius:14px}.detail-kicker{color:var(--green);font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;margin-bottom:4px}.detail h2{font-size:23px;letter-spacing:-.02em}.round{width:36px;height:36px;border-radius:50%;padding:0;display:grid;place-items:center}
.detail-sub{padding-left:61px;margin-top:-2px;margin-bottom:22px;font-size:11px}.field{margin:16px 0}.field label,.section-mini-title{font-size:10px;letter-spacing:.14em;font-weight:800}.value-box{min-height:48px;padding:9px 10px 9px 13px}.value-box code{font-size:13px}.copy-icon{font-size:17px;padding:6px 9px}.field-hint{display:block;color:#647986;font-size:10px;margin:6px 2px 0}.section-mini-title{color:#8ea3b2;margin-bottom:9px}.security-badge.warning{color:#ffd29a;border-color:rgba(245,198,107,.2);background:rgba(245,198,107,.06)}.notes-box{min-height:76px;background:#09141f;border:1px solid var(--line);border-radius:10px;padding:12px;color:#c3d1d8;font-size:12px;line-height:1.55;white-space:pre-wrap}.detail-actions{justify-content:space-between}.detail-actions .danger{margin-left:auto}
.empty{min-height:220px;display:grid;place-items:center;align-content:center;gap:7px}.empty-icon{font-size:28px;color:#55766c}.empty strong{color:#cbd8dc}.empty span{font-size:12px}
.modal{background:linear-gradient(180deg,#0c1b28,#09151f)}.modal-head strong{font-size:16px}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:rgba(46,230,166,.42);box-shadow:0 0 0 3px rgba(46,230,166,.06)}
@media(max-width:1180px){.workspace{grid-template-columns:minmax(0,1fr) 390px}.shell{grid-template-columns:250px minmax(0,1fr)}.content{padding:24px}.global-search{width:380px}}
@media(max-width:980px){.shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto}.global-search{width:min(520px,60vw)}.workspace{grid-template-columns:1fr}.detail-panel{order:0}.category-nav{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.topbar{height:auto;min-height:70px;align-items:stretch;flex-direction:column;padding:12px 16px}.global-search{width:100%}.top-actions{justify-content:space-between}.status-pill{font-size:11px}.content{padding:18px}.workspace{gap:14px}.panel-head{align-items:stretch;flex-direction:column}.panel-head .search{width:100%;margin:0}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.row{grid-template-columns:42px minmax(0,1fr)}.row-end{grid-column:2;justify-content:space-between}.detail-sub{padding-left:0;margin-top:8px}.value-box{flex-wrap:wrap}.value-box code{width:100%;flex-basis:100%}}

/* Monceda Vault v1.2 encrypted backup / restore */
.backup-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.backup-actions .btn{padding:9px 10px;font-size:12px}
.lock-secondary{margin-top:9px}.lock-secondary .btn{width:100%;background:#0d1c28}
.restore-file{display:grid;gap:4px;padding:13px 14px;border:1px solid var(--line);border-radius:12px;background:#08131d;margin-bottom:14px}
.restore-file span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#7e93a1}
.restore-file strong{font-size:13px;color:#dce9e5;word-break:break-all}
.restore-file small{font-size:10px;color:#69808f}
.restore-warning{display:grid;gap:5px;padding:13px 14px;border:1px solid rgba(245,198,107,.18);border-radius:12px;background:rgba(245,198,107,.055);margin-bottom:16px}
.restore-warning strong{font-size:12px;color:#f3d89d}.restore-warning span{font-size:11px;line-height:1.5;color:#a9a18e}
.modal button:disabled{opacity:.55;cursor:not-allowed}
@media(max-width:640px){.backup-actions{grid-template-columns:1fr 1fr}.lock-secondary{margin-top:8px}}

/* Monceda Vault v1.3 security hardening */
.lock-guard{min-height:18px;margin-top:7px;color:#f4c985;font-size:12px;text-align:center}
.alert-count{color:#ffc67a!important}
.password-compose{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.password-compose .btn{margin:0;padding:9px 13px}
.password-strength{min-height:16px;margin-top:6px;font-size:11px;color:#8196a4}.password-strength[data-level="strong"]{color:#7ce7bd}.password-strength[data-level="good"]{color:#b8df91}.password-strength[data-level="fair"]{color:#f0c77e}.password-strength[data-level="weak"]{color:#ff9da9}
.security-modal{max-width:680px}.security-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}.security-summary>div{display:grid;gap:5px;padding:14px;border:1px solid var(--line);border-radius:12px;background:#08131d}.security-summary span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#8298a6}.security-summary strong{font-size:26px}.security-section{margin-top:18px}.security-section h3{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:#92a8b5}.security-section p{font-size:12px;color:#7f929f}.security-row{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.055);font-size:12px}.security-row em{font-style:normal;color:#f0c77e}.security-note{margin-top:18px;padding:12px 13px;border-radius:10px;background:rgba(46,230,166,.05);border:1px solid rgba(46,230,166,.12);font-size:11px;line-height:1.5;color:#8aa69b}
.sidebar-footer{gap:8px}
@media(max-width:640px){.password-compose{grid-template-columns:1fr}.security-summary{grid-template-columns:1fr 1fr 1fr}}

/* ===== V1.4 APP SHELL / INDEPENDENT SCROLL ===== */
@media (min-width:981px){
  html,body,#app{height:100%;overflow:hidden}
  .shell{height:100vh;min-height:0;overflow:hidden;display:grid;grid-template-columns:286px minmax(0,1fr)}
  .sidebar{position:relative!important;top:auto!important;height:100vh!important;min-height:0!important;max-height:100vh!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;scrollbar-width:thin}
  .main{height:100vh;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
  .topbar{position:sticky;top:0;z-index:50}
  .workspace{height:auto!important;overflow:visible!important}
}
@media (max-width:980px){
  html,body,#app{height:auto;overflow:auto}
  .shell{height:auto;min-height:100vh;overflow:visible}
  .sidebar,.main{height:auto!important;max-height:none!important;overflow:visible!important}
}

/* Monceda Vault v1.5 recovery, envelope encryption, device transfer */
.modal-sm{max-width:460px}.modal-md{max-width:540px}.modal-restore{max-width:560px}
.recovery-needed{border-color:rgba(245,198,107,.3)!important;color:#f0c77e!important;background:rgba(245,198,107,.055)!important}
.recovery-status{display:grid;gap:5px;padding:14px 15px;border-radius:12px;margin-bottom:18px}.recovery-status strong{font-size:13px}.recovery-status span{font-size:11px;line-height:1.55}
.recovery-status.ready{background:rgba(46,230,166,.055);border:1px solid rgba(46,230,166,.16);color:#bdebd9}.recovery-status.pending{background:rgba(245,198,107,.055);border:1px solid rgba(245,198,107,.18);color:#e9cf9a}
.restore-or{text-align:center;color:#607786;font-size:10px;text-transform:uppercase;letter-spacing:.15em;margin:2px 0 10px}
.security-section .btn{margin-top:8px}.security-section strong{color:#cbdad5}
.sidebar-footer{padding-bottom:6px}
@media(max-width:980px){.sidebar-footer{padding-bottom:14px}}

/* ===== V1.6 PRIVATE CLOUD SYNC ===== */
.cloud-sync-card{margin-top:auto;padding:14px;border:1px solid rgba(89,240,189,.16);background:rgba(10,31,35,.55);border-radius:16px;display:grid;gap:10px}.cloud-sync-card>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:8px}.cloud-sync-card strong{font-size:12px}.cloud-sync-card small{color:var(--muted);font-size:10px;line-height:1.45}.sync-pill{font-size:9px;font-weight:800;padding:4px 7px;border-radius:999px;border:1px solid rgba(255,255,255,.1)}.sync-synced{color:#67efbd;background:rgba(58,211,153,.08)}.sync-syncing{color:#f6d365;background:rgba(246,211,101,.08)}.sync-error,.sync-conflict{color:#ff9a9a;background:rgba(255,100,100,.08)}.sync-local{color:var(--muted)}

/* ===== V1.7 OWNER ACCESS GATE ===== */

.owner-gate-body {
  min-height: 100vh;
  margin: 0;
  overflow: auto !important;
  background:
    radial-gradient(circle at 25% 10%,
      rgba(52, 211, 153, .08), transparent 30%),
    #07100d;
}

.owner-gate {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 28px;
}

.owner-gate-card {
  width: min(440px, 100%);
  padding: 38px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 26px;
  background: rgba(10, 23, 19, .94);
  box-shadow: 0 28px 90px rgba(0,0,0,.42);
}

.owner-gate-mark {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  margin-bottom: 26px;
  border-radius: 16px;
  background: #35d39a;
  color: #04100c;
  font-weight: 900;
  font-size: 22px;
}

.owner-gate-card h1 {
  margin: 8px 0 10px;
  font-size: 34px;
}

.owner-gate-card > p {
  margin: 0 0 28px;
  color: var(--muted);
  line-height: 1.65;
}

.owner-gate-card form {
  display: grid;
  gap: 12px;
}

.owner-gate-card label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.owner-gate-card input {
  width: 100%;
  box-sizing: border-box;
  min-height: 52px;
}

.owner-gate-button {
  width: 100%;
  min-height: 52px;
  margin-top: 5px;
  justify-content: center;
}

.owner-gate-error {
  min-height: 20px;
  color: #fca5a5;
  font-size: 13px;
}

.owner-gate-security {
  display: grid;
  gap: 5px;
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.07);
}

.owner-gate-security strong {
  color: #6ee7b7;
  font-size: 12px;
}

.owner-gate-security span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

/* ===== V1.7 OWNER ACCESS GATE ===== */

.owner-gate-body {
  min-height: 100vh;
  margin: 0;
  overflow: auto !important;
  background:
    radial-gradient(circle at 25% 10%,
      rgba(52, 211, 153, .08), transparent 30%),
    #07100d;
}

.owner-gate {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 28px;
}

.owner-gate-card {
  width: min(440px, 100%);
  padding: 38px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 26px;
  background: rgba(10, 23, 19, .94);
  box-shadow: 0 28px 90px rgba(0,0,0,.42);
}

.owner-gate-mark {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  margin-bottom: 26px;
  border-radius: 16px;
  background: #35d39a;
  color: #04100c;
  font-weight: 900;
  font-size: 22px;
}

.owner-gate-card h1 {
  margin: 8px 0 10px;
  font-size: 34px;
}

.owner-gate-card > p {
  margin: 0 0 28px;
  color: var(--muted);
  line-height: 1.65;
}

.owner-gate-card form {
  display: grid;
  gap: 12px;
}

.owner-gate-card label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.owner-gate-card input {
  width: 100%;
  box-sizing: border-box;
  min-height: 52px;
}

.owner-gate-button {
  width: 100%;
  min-height: 52px;
  margin-top: 5px;
  justify-content: center;
}

.owner-gate-error {
  min-height: 20px;
  color: #fca5a5;
  font-size: 13px;
}

.owner-gate-security {
  display: grid;
  gap: 5px;
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.07);
}

.owner-gate-security strong {
  color: #6ee7b7;
  font-size: 12px;
}

.owner-gate-security span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

/* ===== V1.9.5 VAULT MANAGEMENT ===== */

.vault-nav-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) 34px;
  gap: 6px;
  align-items: center;
}

.vault-nav-row .nav-item {
  min-width: 0;
}

.vault-menu-btn {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}

.vault-menu-btn:hover {
  border-color: var(--line);
  background: rgba(255,255,255,.04);
  color: var(--text);
}

.vault-popup-menu {
  position: fixed;
  z-index: 150;
  min-width: 180px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #0a1722;
  box-shadow: 0 22px 60px rgba(0,0,0,.5);
}

.vault-popup-menu button {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 11px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  text-align: left;
  font: inherit;
  font-size: 12px;
}

.vault-popup-menu button:hover {
  background: rgba(255,255,255,.05);
}

.vault-popup-menu button.danger {
  color: #ff9a9a;
}

.vault-popup-menu button.danger:hover {
  background: rgba(255,100,100,.08);
}


/* ==================================================
   MONCEDA VAULT V2.0 — OFFICIAL BRAND IDENTITY
   ================================================== */

.brand {
  min-height: 58px;
}

.brand .logo {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border: 0;
  border-radius: 14px;
  padding: 5px;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 35% 25%,
      rgba(231,171,61,.12),
      transparent 58%
    ),
    linear-gradient(
      145deg,
      rgba(15,27,38,.96),
      rgba(5,12,18,.98)
    );
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.055),
    0 9px 26px rgba(0,0,0,.28);
}

.brand .logo::before {
  content: none;
}

.brand .logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.brand-wordmark {
  min-width: 0;
  line-height: 1;
}

.brand-wordmark strong {
  display: block;
  color: #edf2f6;
  font-size: 14px;
  font-weight: 750;
  letter-spacing: .19em;
}

.brand-wordmark small {
  display: block;
  margin-top: 6px;
  color: #e8ad43;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .43em;
}

.lock-card .brand {
  justify-content: center;
  margin-bottom: 10px;
}

.lock-card .brand .logo {
  width: 62px;
  height: 62px;
  flex-basis: 62px;
  border-radius: 18px;
}

/* ==================================================
   MONCEDA VAULT V2.1 — CREDENTIAL PAGINATION
   ================================================== */

.credential-pagination {
  display: grid;
  grid-template-columns:
    minmax(110px,1fr)
    auto
    minmax(130px,1fr);
  align-items: center;
  gap: 14px;
  padding: 14px 16px 16px;
  border-top: 1px solid var(--line);
}

.pagination-summary {
  color: var(--muted);
  font-size: 11px;
}

.pagination-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.pagination-pages {
  display: flex;
  gap: 5px;
  max-width: 260px;
  overflow-x: auto;
}

.pagination-btn {
  min-height: 32px;
  padding: 6px 10px;
  font-size: 11px;
  white-space: nowrap;
}

.pagination-btn:disabled {
  opacity: .35;
  cursor: default;
}

.pagination-number {
  min-width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
  color: var(--muted);
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
}

.pagination-number:hover {
  color: var(--text);
  border-color: rgba(46,230,166,.35);
}

.pagination-number.active {
  color: var(--green);
  border-color: rgba(46,230,166,.5);
  background: rgba(46,230,166,.10);
}

.pagination-size {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  color: var(--muted);
  font-size: 11px;
}

.pagination-size select {
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #07121b;
  color: var(--text);
}

@media(max-width:760px) {
  .credential-pagination {
    grid-template-columns: 1fr;
  }

  .pagination-controls {
    order: -1;
    flex-wrap: wrap;
  }

  .pagination-summary,
  .pagination-size {
    justify-content: center;
    text-align: center;
  }
}

/* ==================================================
   MONCEDA VAULT V2.1.1
   SEARCH / RESULTS / RESPONSIVE LAYOUT FIX
   ================================================== */

/*
 * Prevent dashboard cards and workspace from forcing
 * the page wider than the available viewport.
 */
.main,
.content,
.workspace,
.credentials-panel,
.detail-panel {
  min-width: 0;
}

/* Stats should never run outside the screen. */
.stats {
  display: grid;
  grid-template-columns: repeat(
    4,
    minmax(0, 1fr)
  );
  gap: 14px;
  width: 100%;
}

.stat {
  min-width: 0;
  overflow: hidden;
}

.stat span,
.stat strong,
.stat em {
  max-width: 100%;
}

.stat em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Credential panel heading remains stable during search. */
.credentials-panel .panel-head {
  display: grid;
  grid-template-columns:
    minmax(130px, auto)
    minmax(220px, 1fr);
  gap: 18px;
  align-items: center;
}

.credentials-panel .panel-head > div:first-child {
  min-width: 0;
}

.credentials-panel .panel-head strong {
  display: block;
}

.credentials-panel .panel-head span {
  display: block;
  margin-top: 2px;
}

.credentials-panel .search {
  min-width: 0;
  width: 100%;
}

.credentials-panel .search input {
  display: block;
  width: 100%;
  min-width: 0;
}

/* Top/global search must also shrink correctly. */
.global-search {
  min-width: 0;
  width: min(100%, 870px);
}

.global-search input {
  min-width: 0;
  width: 100%;
}

/*
 * Keep filter chips organized rather than squeezing
 * their labels into each other.
 */
.filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.filters .chip {
  flex: 0 0 auto;
  white-space: nowrap;
}

/* Empty search result should stay visually centered. */
.credentials-panel .list > .empty {
  min-height: 300px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 36px 20px;
}

/* Pagination must not cause horizontal page overflow. */
.pagination-controls,
.pagination-pages {
  min-width: 0;
  max-width: 100%;
}
/* Medium screens / narrower desktop windows. */
@media (max-width: 1180px) {
  .stats {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .credentials-panel .panel-head {
    grid-template-columns: 1fr;
  }

  .credentials-panel .search {
    width: 100%;
  }
}

/* Tablet/mobile. */
@media (max-width: 700px) {
  .stats {
    grid-template-columns: 1fr;
  }

.pagination-summary,
.pagination-controls {
    flex-wrap: wrap;
  }
}

/* ==================================================
   MONCEDA VAULT V2.2 — SECURE NOTES
   ================================================== */

.secure-notes-panel {
  min-width: 0;
}

.note-list {
  display: grid;
}

.secure-note-row {
  width: 100%;
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) 18px;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  color: var(--text);
  cursor: pointer;
  text-align: left;
}

.secure-note-row:hover {
  background: rgba(255,255,255,.025);
}

.secure-note-row.selected {
  background: rgba(46,230,166,.055);
  box-shadow:
    inset 3px 0 0 rgba(46,230,166,.7);
}

.secure-note-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(232,173,67,.25);
  border-radius: 10px;
  background: rgba(232,173,67,.06);
  color: #e8ad43;
  font-size: 15px;
}

.secure-note-summary {
  min-width: 0;
}

.secure-note-summary strong {
  display: block;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.secure-note-summary small {
  display: block;
  margin-top: 4px;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.secure-note-content {
  min-height: 240px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #07121b;
  color: #d8e2e8;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.7;
  overflow-wrap: anywhere;
  white-space: normal;
}

.secure-note-editor {
  min-height: 300px;
  resize: vertical;
  line-height: 1.6;
}

.secure-note-warning {
  padding: 11px 12px;
  border: 1px solid rgba(232,173,67,.2);
  border-radius: 10px;
  background: rgba(232,173,67,.045);
  color: #a99c7b;
  font-size: 11px;
  line-height: 1.55;
}

@media(max-width:760px) {
  .secure-note-content {
    min-height: 180px;
  }
}

/* ==================================================
   MONCEDA VAULT V2.2.1 — COLLAPSIBLE SECURE NOTES
   ================================================== */

.secure-note-content {
  position: relative;
  min-height: 0;
  transition: max-height .2s ease;
}

.secure-note-content.collapsed {
  max-height: 150px;
  overflow: hidden;
}

/* Soft fade indicates that more text exists below. */
.secure-note-content.collapsed::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 52px;
  pointer-events: none;
  background:
    linear-gradient(
      to bottom,
      rgba(7,18,27,0),
      #07121b
    );
}

.secure-note-content.expanded {
  max-height: none;
  overflow: visible;
}

.secure-note-content.expanded::after {
  display: none;
}

.secure-note-expand {
  width: 100%;
  margin-top: 8px;
  padding: 9px 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 11px;
  cursor: pointer;
  transition:
    border-color .15s ease,
    color .15s ease,
    background .15s ease;
}

.secure-note-expand:hover {
  border-color: rgba(46,230,166,.35);
  background: rgba(46,230,166,.045);
  color: var(--accent);
}

@media(max-width:760px) {
  .secure-note-content.collapsed {
    max-height: 130px;
  }
}

/* ==================================================
   MONCEDA VAULT V2.4 — MOBILE EXPERIENCE
   ================================================== */

.mobile-menu-btn,
.mobile-close-menu,
.mobile-detail-close,
.mobile-menu-overlay {
  display: none;
}


/* ==================================================
   IPHONE / MOBILE
   ================================================== */

@media (max-width: 760px) {

  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  body {
    min-height: 100dvh;
    background: var(--bg);
  }

  .shell {
    display: block;
    width: 100%;
    min-height: 100dvh;
  }


  /* ==========================
     MOBILE SIDEBAR DRAWER
     ========================== */

  .sidebar {
    position: fixed !important;
    z-index: 1000;
    top: 0;
    left: 0;

    width: min(88vw, 350px) !important;
    max-width: 350px;

    height: 100dvh;

    padding:
      calc(18px + env(safe-area-inset-top))
      18px
      calc(24px + env(safe-area-inset-bottom));

    overflow-y: auto;
    overflow-x: hidden;

    background: #061019;

    border-right: 1px solid var(--line);

    box-shadow:
      24px 0 60px rgba(0,0,0,.48);

    transform: translateX(-105%);
    transition: transform .22s ease;

    -webkit-overflow-scrolling: touch;
  }

  body.mobile-menu-open .sidebar {
    transform: translateX(0);
  }


  .mobile-menu-overlay {
    position: fixed;
    z-index: 990;
    inset: 0;

    background: rgba(0,0,0,.58);
    backdrop-filter: blur(2px);
  }

  body.mobile-menu-open .mobile-menu-overlay {
    display: block;
  }


  .mobile-close-menu {
    display: grid;

    position: absolute;
    top: calc(
      14px + env(safe-area-inset-top)
    );
    right: 14px;

    width: 38px;
    height: 38px;

    place-items: center;

    border: 1px solid var(--line);
    border-radius: 10px;

    background: rgba(255,255,255,.035);
    color: var(--muted);

    font-size: 16px;
    cursor: pointer;
  }


  /* Brand inside drawer */

  .sidebar .brand {
    padding-right: 46px;
    margin-bottom: 28px;
  }


  /* Force all sidebar navs to one column */

  .sidebar .nav-list,
  .sidebar .category-nav {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 5px !important;
  }

  .sidebar .vault-nav-row {
    display: grid !important;
    grid-template-columns:
      minmax(0,1fr)
      34px !important;
    gap: 6px;
  }

  .sidebar .nav-item {
    width: 100%;
    min-width: 0;

    padding: 11px 12px;

    font-size: 13px;
  }

  .sidebar .nav-item > span:first-child {
    min-width: 0;
  }

  .sidebar .nav-item .count {
    margin-left: auto;
  }

  .sidebar .section-title {
    margin-top: 22px;
  }


  /* Sidebar security/footer controls */

  .cloud-sync-card {
    margin-top: 22px;
  }

  .sidebar-footer {
    margin-top: 16px;
  }


  /* ==========================
     MAIN MOBILE PAGE
     ========================== */

  .main {
    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;
  }


  /* ==========================
     MOBILE HEADER
     ========================== */

  .topbar {
    position: sticky;
    z-index: 100;

    top: 0;

    display: grid !important;
    grid-template-columns:
      42px
      minmax(0,1fr)
      auto;

    gap: 8px;

    align-items: center;

    min-height: 64px;

    padding:
      calc(9px + env(safe-area-inset-top))
      12px
      9px;

    background: rgba(6,16,25,.96);

    border-bottom: 1px solid var(--line);

    backdrop-filter: blur(14px);
  }


  .mobile-menu-btn {
    display: grid;

    width: 40px;
    height: 40px;

    place-items: center;

    border: 1px solid var(--line);
    border-radius: 10px;

    background: #0c1b29;
    color: var(--text);

    font-size: 19px;

    cursor: pointer;
  }


  .global-search {
    width: 100% !important;
    min-width: 0;
  }

  .global-search input {
    height: 40px;
    font-size: 13px;
  }


  .top-actions {
    gap: 6px;
  }

  .top-actions .status-pill {
    display: none;
  }

  .top-actions .btn {
    min-width: 40px;
    height: 40px;

    padding: 0 9px;

    font-size: 0;
  }

  .top-actions .btn::first-letter {
    font-size: 16px;
  }


  /* ==========================
     CONTENT
     ========================== */

  .content {
    width: 100%;

    padding:
      18px
      14px
      calc(28px + env(safe-area-inset-bottom)) !important;
  }


  /* ==========================
     HERO
     ========================== */

  .hero {
    display: grid !important;
    grid-template-columns: 1fr;

    gap: 16px;

    margin-bottom: 18px;
  }

  .hero h1 {
    margin-top: 7px;

    font-size: 30px;
    line-height: 1.08;
  }

  .hero p {
    margin-top: 8px;

    font-size: 14px;
    line-height: 1.5;
  }

  .hero .actions {
    display: grid !important;
    grid-template-columns:
      minmax(0,1fr)
      minmax(0,1.25fr);

    gap: 8px;

    width: 100%;
  }

  .hero .actions .btn {
    width: 100%;

    min-height: 44px;

    padding: 9px 10px;

    font-size: 12px;
  }


  /* ==========================
     COMPACT STATS
     ========================== */

  .stats {
    display: grid !important;

    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;

    gap: 9px !important;

    margin-bottom: 18px;
  }

  .stat {
    min-height: 112px !important;

    padding: 14px !important;

    border-radius: 14px !important;
  }

  .stat span {
    font-size: 10px !important;
  }

  .stat strong {
    margin-top: 9px !important;

    font-size: 25px !important;
    line-height: 1 !important;
  }

  .stat em {
    margin-top: 8px !important;

    font-size: 9px !important;

    white-space: normal !important;
  }


  /* ==========================
     WORKSPACE
     ========================== */

  .workspace {
    display: block !important;

    width: 100%;
    min-width: 0;
  }

  .credentials-panel,
  .secure-notes-panel {
    width: 100%;
    min-width: 0;

    border-radius: 15px;
  }


  /* ==========================
     CREDENTIAL HEADER
     ========================== */

  .credentials-panel .panel-head,
  .secure-notes-panel .panel-head {
    display: grid !important;

    grid-template-columns: 1fr !important;

    gap: 12px !important;

    padding: 15px !important;
  }

  .credentials-panel .search,
  .secure-notes-panel .search {
    width: 100%;
  }

  .credentials-panel .search input,
  .secure-notes-panel .search input {
    height: 44px;
  }


  /* ==========================
     FILTER CHIPS
     ========================== */

  .filters {
    display: flex !important;

    flex-wrap: nowrap !important;

    gap: 7px !important;

    padding: 10px 12px !important;

    overflow-x: auto;

    scrollbar-width: none;

    -webkit-overflow-scrolling: touch;
  }

  .filters::-webkit-scrollbar {
    display: none;
  }

  .filters .chip {
    flex: 0 0 auto;

    min-height: 36px;

    padding: 7px 11px;

    font-size: 11px;
  }


  /* ==========================
     CREDENTIAL ROWS
     ========================== */

  .credentials-panel .row {
    display: grid !important;

    grid-template-columns:
      42px
      minmax(0,1fr)
      auto;

    gap: 11px !important;

    align-items: center;

    min-height: 76px !important;

    padding: 12px 13px !important;
  }

  .credentials-panel .favicon {
    width: 40px !important;
    height: 40px !important;

    border-radius: 11px !important;

    font-size: 12px !important;
  }

  .credentials-panel .row-title {
    overflow: hidden;

    font-size: 14px !important;
    font-weight: 700;

    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .credentials-panel .row-sub {
    margin-top: 3px;

    overflow: hidden;

    font-size: 11px !important;

    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .credentials-panel .row-end {
    display: flex;

    align-items: center;

    gap: 7px;
  }

  .credentials-panel .tag {
    display: none;
  }


  /* ==========================
     PAGINATION
     ========================== */

.pagination-summary {
    text-align: center;
  }

.pagination-pages {
    display: flex;

    justify-content: center;

    max-width: none !important;
  }

  .pagination-pages
  .pagination-number:not(.active) {
    display: none;
  }

.pagination-size {
    justify-content: center !important;
  }


  /* ==========================
     MOBILE CREDENTIAL DETAIL
     ========================== */

  .detail-panel {
    display: none;
  }

  body.mobile-detail-open
  .workspace > .detail-panel {
    display: block !important;

    position: fixed;

    z-index: 1200;

    inset: 0;

    width: 100%;
    height: 100dvh;

    padding:
      calc(14px + env(safe-area-inset-top))
      14px
      calc(20px + env(safe-area-inset-bottom));

    overflow-y: auto;

    border: 0 !important;
    border-radius: 0 !important;

    background: #071019;

    -webkit-overflow-scrolling: touch;
  }


  .mobile-detail-close {
    display: inline-flex;

    align-items: center;

    min-height: 38px;

    margin-bottom: 16px;

    padding: 8px 11px;

    border: 1px solid var(--line);
    border-radius: 9px;

    background: #0c1b29;

    color: var(--text);

    font: inherit;
    font-size: 12px;

    cursor: pointer;
  }


  .detail {
    max-width: 100%;
  }

  .detail h2 {
    font-size: 25px;
  }

  .detail .field {
    margin-top: 18px;
  }

  .value-box {
    min-width: 0;
  }

  .value-box code {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .security-grid {
    display: flex;

    flex-wrap: wrap;

    gap: 7px;
  }


  /* ==========================
     SECURE NOTES MOBILE DETAIL
     ========================== */

  body.mobile-note-detail-open
  .workspace > .detail-panel {
    display: block !important;

    position: fixed;

    z-index: 1200;

    inset: 0;

    width: 100%;
    height: 100dvh;

    padding:
      calc(14px + env(safe-area-inset-top))
      14px
      calc(20px + env(safe-area-inset-bottom));

    overflow-y: auto;

    border: 0 !important;
    border-radius: 0 !important;

    background: #071019;
  }


  .secure-note-row {
    min-height: 68px;

    padding: 11px 12px;
  }


  /* ==========================
     MODALS
     ========================== */

  .modal-backdrop {
    align-items: flex-end !important;
  }

  .modal {
    width: 100% !important;
    max-width: 100% !important;

    max-height: 92dvh;

    margin: 0 !important;

    border-radius:
      18px
      18px
      0
      0 !important;

    overflow-y: auto;

    padding-bottom:
      env(safe-area-inset-bottom);
  }

  .grid2 {
    grid-template-columns: 1fr !important;
  }


  /* Prevent background scrolling */

  body.mobile-menu-open,
  body.mobile-detail-open,
  body.mobile-note-detail-open {
    overflow: hidden;
  }
}


/* Very narrow iPhones */

@media (max-width: 390px) {

  .content {
    padding-left: 11px !important;
    padding-right: 11px !important;
  }

  .hero .actions {
    grid-template-columns: 1fr;
  }

  .stats {
    gap: 7px !important;
  }

  .stat {
    min-height: 105px !important;
    padding: 12px !important;
  }

  .stat strong {
    font-size: 22px !important;
  }
}


/* Installed iPhone PWA */

@media (
  display-mode: standalone
) and (max-width: 760px) {

  .topbar {
    padding-top:
      calc(
        10px +
        env(safe-area-inset-top)
      );
  }

  .content {
    padding-bottom:
      calc(
        30px +
        env(safe-area-inset-bottom)
      ) !important;
  }
}

/* ==================================================
   MONCEDA VAULT V2.4.1 — MOBILE SIDEBAR PARITY
   Keep every desktop sidebar control available
   inside the mobile drawer.
   ================================================== */

@media (max-width: 760px) {

  /*
   * Override old mobile rules such as:
   * .secure-note { display:none }
   */
  .sidebar .secure-note {
    display: grid !important;
  }

  .sidebar .cloud-sync-card {
    display: grid !important;
  }

  .sidebar .sidebar-footer {
    display: grid !important;
    gap: 9px !important;
    width: 100%;
    padding-bottom:
      calc(
        18px +
        env(safe-area-inset-bottom)
      ) !important;
  }

  .sidebar .backup-actions {
    display: grid !important;
    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;
    gap: 8px !important;
    width: 100%;
  }

  .sidebar .backup-actions .btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    min-height: 42px;
  }

  .sidebar .lock-wide {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 44px;
  }

  .sidebar #recoveryBtn,
  .sidebar #changeMasterBtn,
  .sidebar #ownerLogoutBtn,
  .sidebar #lockBtn,
  .sidebar #backupBtn,
  .sidebar #restoreBtn,
  .sidebar #syncNowBtn,
  .sidebar #pullCloudBtn {
    visibility: visible !important;
    opacity: 1;
  }

  /*
   * Make the footer visually separate from navigation.
   */
  .sidebar-footer {
    margin-top: 18px !important;
    padding-top: 4px;
  }

  .sidebar .secure-note {
    margin: 0;
    padding: 13px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(255,255,255,.018);
  }

  .sidebar .secure-note strong {
    display: block;
    font-size: 12px;
  }

  .sidebar .secure-note span {
    display: block;
    margin-top: 4px;
    font-size: 10px;
    line-height: 1.5;
  }

  /*
   * Ensure the full drawer can be scrolled all the
   * way through Sync / Backup / Recovery / Sign Out.
   */
  .sidebar {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  /*
   * Cloud Sync block stays visible like desktop.
   */
  .sidebar .cloud-sync-card {
    margin-top: 22px !important;
    flex-shrink: 0;
  }

  .sidebar .cloud-sync-card small {
    display: block !important;
  }
}



/* ==================================================
   MONCEDA VAULT V2.4.3
   MOBILE DRAWER — FULL HEIGHT + FULL SCROLL
   ================================================== */

@media (max-width: 760px) {

  .sidebar {
    position: fixed !important;

    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;

    height: 100dvh !important;
    max-height: 100dvh !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;

    -webkit-overflow-scrolling: touch;

    overscroll-behavior-y: contain;

    padding-top:
      calc(24px + env(safe-area-inset-top)) !important;

    padding-bottom:
      calc(40px + env(safe-area-inset-bottom)) !important;

    box-sizing: border-box !important;
  }

  /*
   * Prevent any inner sidebar section from clipping
   * the lower controls.
   */
  .sidebar-footer {
    position: static !important;

    display: grid !important;

    height: auto !important;
    max-height: none !important;

    overflow: visible !important;

    flex-shrink: 0 !important;

    margin-top: 28px !important;

    padding-bottom:
      calc(30px + env(safe-area-inset-bottom)) !important;
  }

  .sidebar .cloud-sync-card {
    position: static !important;

    display: grid !important;

    height: auto !important;
    max-height: none !important;

    overflow: visible !important;

    flex-shrink: 0 !important;
  }

  .sidebar .secure-note {
    position: static !important;

    display: grid !important;

    height: auto !important;
    max-height: none !important;

    overflow: visible !important;

    flex-shrink: 0 !important;
  }

  /*
   * All sidebar navigation remains part of the
   * same vertical scrolling surface.
   */
  .sidebar .nav-list {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /*
   * Extra breathing room after final Lock button.
   */
  .sidebar-footer > :last-child {
    margin-bottom:
      calc(30px + env(safe-area-inset-bottom)) !important;
  }
}

/* ==================================================
   MONCEDA VAULT V2.4.4
   IOS / PWA DRAWER SCROLL HARDENING
   ================================================== */

@media (max-width:760px) {

  /*
   * iOS is more reliable when a fixed scroll surface
   * is bounded by top + bottom instead of only 100dvh.
   */
  .sidebar {
    position: fixed !important;

    top: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    left: 0 !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    overflow-x: hidden !important;
    overflow-y: scroll !important;

    -webkit-overflow-scrolling: touch !important;

    touch-action: pan-y !important;

    overscroll-behavior-x: none;
    overscroll-behavior-y: contain;

    box-sizing: border-box !important;

    padding:
      calc(22px + env(safe-area-inset-top))
      18px
      calc(70px + env(safe-area-inset-bottom))
      18px !important;
  }

  /*
   * Nothing inside the drawer may become its own
   * clipped scrolling container.
   */
  .sidebar > *,
  .sidebar .nav-list,
  .sidebar .category-nav,
  .sidebar .cloud-sync-card,
  .sidebar .sidebar-footer {
    max-height: none !important;
    overflow: visible !important;
  }

  .sidebar .cloud-sync-card,
  .sidebar .sidebar-footer {
    flex: 0 0 auto !important;
  }

  /*
   * Remove desktop-style auto positioning that can
   * push the footer outside the iOS scroll surface.
   */
  .sidebar .cloud-sync-card {
    margin-top: 24px !important;
  }

  .sidebar .sidebar-footer {
    margin-top: 16px !important;
    margin-bottom: 0 !important;
    padding-bottom:
      calc(50px + env(safe-area-inset-bottom))
      !important;
  }

  .sidebar-footer > :last-child {
    margin-bottom:
      calc(40px + env(safe-area-inset-bottom))
      !important;
  }

  /*
   * Ensure every desktop sidebar section remains
   * physically present in the mobile drawer.
   */
  .sidebar .secure-note,
  .sidebar .cloud-sync-card,
  .sidebar .backup-actions,
  .sidebar #backupBtn,
  .sidebar #restoreBtn,
  .sidebar #recoveryBtn,
  .sidebar #changeMasterBtn,
  .sidebar #ownerLogoutBtn,
  .sidebar #lockBtn,
  .sidebar #syncNowBtn,
  .sidebar #pullCloudBtn {
    display: revert !important;
  }

  .sidebar .secure-note,
  .sidebar .cloud-sync-card {
    display: grid !important;
  }

  .sidebar .backup-actions {
    display: grid !important;
  }

  .sidebar #backupBtn,
  .sidebar #restoreBtn,
  .sidebar #recoveryBtn,
  .sidebar #changeMasterBtn,
  .sidebar #ownerLogoutBtn,
  .sidebar #lockBtn,
  .sidebar #syncNowBtn,
  .sidebar #pullCloudBtn {
    display: inline-flex !important;
  }
}

/* ==================================================
   MONCEDA VAULT V2.5 — CALENDAR MONTH VIEW
   ================================================== */

.calendar-panel {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.calendar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
}

.calendar-head h2 {
  margin-top: 6px;
  font-size: 23px;
}

.calendar-head small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
}

.calendar-head-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.calendar-search-row {
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
}

.calendar-search-row input {
  width: 100%;
  height: 42px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #07121b;
  color: var(--text);
  font: inherit;
  outline: none;
}

.calendar-search-row input:focus {
  border-color: rgba(46,230,166,.42);
  box-shadow: 0 0 0 3px rgba(46,230,166,.07);
}

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7,minmax(0,1fr));
  width: 100%;
}

.calendar-weekday {
  padding: 10px 5px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
  text-align: center;
  text-transform: uppercase;
}

.calendar-day {
  display: block;
  min-width: 0;
  min-height: 125px;
  padding: 7px;
  border: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(255,255,255,.005);
  color: var(--text);
  cursor: default;
  font: inherit;
  text-align: left;
}

.calendar-day.outside {
  opacity: .35;
}

.calendar-day-number {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  margin-left: auto;
  border-radius: 50%;
  color: var(--muted);
  font-size: 10px;
}

.calendar-day.today
.calendar-day-number {
  background: var(--green);
  color: #041d14;
  font-weight: 900;
}

.calendar-day-events {
  display: grid;
  gap: 4px;
  margin-top: 5px;
}

.calendar-event-pill {
  display: block;
  min-width: 0;
  padding: 5px 6px;
  overflow: hidden;
  border: 1px solid rgba(46,230,166,.16);
  border-radius: 6px;
  background: rgba(46,230,166,.06);
  color: #bceada;
  font-size: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calendar-more {
  color: var(--muted);
  font-size: 8px;
}


/* ===============================
   IPHONE / MOBILE CALENDAR
   =============================== */

@media(max-width:760px) {

  .workspace:has(.calendar-panel) {
    display: block !important;
  }

  .calendar-panel {
    border-radius: 14px;
  }

  .calendar-head {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 14px;
  }

  .calendar-head h2 {
    font-size: 20px;
  }

  .calendar-head-actions {
    display: grid;
    grid-template-columns: 1fr 44px 44px;
  }

  .calendar-search-row {
    padding: 10px;
  }

  .calendar-weekday {
    padding: 7px 1px;
    font-size: 7px;
  }

  .calendar-day {
    min-height: 78px;
    padding: 3px;
  }

  .calendar-day-number {
    width: 23px;
    height: 23px;
    font-size: 8px;
  }

  .calendar-day-events {
    gap: 2px;
    margin-top: 2px;
  }

  .calendar-event-pill {
    padding: 3px;
    font-size: 6.5px;
  }

  .calendar-day-events
  .calendar-event-pill:nth-child(n+3) {
    display: none;
  }
}

@media(max-width:390px) {
  .calendar-day {
    min-height: 68px;
  }

  .calendar-event-pill {
    font-size: 6px;
  }
}

/* ==================================================
   MONCEDA VAULT V2.5 — CALENDAR EVENT CRUD
   ================================================== */

.calendar-day {
  cursor: pointer;
}

.calendar-day:hover {
  background: rgba(255,255,255,.018);
}

.calendar-event-pill {
  cursor: pointer;
}

.calendar-event-pill:hover {
  border-color: rgba(46,230,166,.35);
  background: rgba(46,230,166,.11);
}

.calendar-event-pill small {
  display: block;
  margin-bottom: 2px;
  color: #70c7a8;
  font-size: 7px;
}

.calendar-event-modal textarea {
  min-height: 110px;
  resize: vertical;
}

.calendar-security-note {
  padding: 10px 12px;
  border: 1px solid rgba(46,230,166,.14);
  border-radius: 9px;
  background: rgba(46,230,166,.04);
  color: #88aa9e;
  font-size: 9px;
  line-height: 1.5;
}

.calendar-detail-title {
  margin-bottom: 17px;
}

.calendar-detail-title span {
  color: var(--green);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .13em;
}

.calendar-detail-title h2 {
  margin-top: 5px;
  font-size: 24px;
}

.calendar-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin-bottom: 14px;
}

.calendar-detail-grid > div {
  display: grid;
  gap: 5px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #07121b;
}

.calendar-detail-grid label {
  color: var(--muted);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.calendar-detail-grid strong {
  font-size: 10px;
}

@media(max-width:760px) {

  .calendar-head-actions {
    grid-template-columns:
      minmax(0,1fr)
      minmax(0,1fr)
      42px
      42px;
  }

  .calendar-event-modal {
    width: calc(100% - 24px);
    max-height: 92dvh;
    overflow-y: auto;
  }

  .calendar-detail-modal {
    width: calc(100% - 24px);
    max-height: 92dvh;
    overflow-y: auto;
  }

  .calendar-detail-grid {
    grid-template-columns: 1fr;
  }

  .calendar-event-pill small {
    display: none;
  }
}

@media(max-width:430px) {

  .calendar-head-actions {
    grid-template-columns: 1fr 1fr 42px 42px;
  }

  .calendar-head-actions
  #calendarAddEventBtn {
    grid-column: 1 / -1;
  }
}

/* ==================================================
   MONCEDA VAULT V2.5.1 — DESKTOP CALENDAR LAYOUT
   ================================================== */

/* Calendar gets its own one-column workspace */
.calendar-workspace {
  display: block !important;
  width: 100%;
  max-width: none !important;
}

/* Remove the dashboard-like narrow column behavior */
.calendar-workspace .calendar-panel {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  margin: 0;
}

/* Compact Calendar hero */
.calendar-hero {
  align-items: center !important;
  margin-bottom: 14px !important;
  padding-bottom: 0 !important;
}

.calendar-hero h1 {
  margin-top: 4px;
  font-size: 30px;
  line-height: 1.05;
}

.calendar-hero p {
  margin-top: 6px;
  font-size: 12px;
}

/* Calendar panel should feel like the main application */
.calendar-panel {
  min-height: calc(100vh - 250px);
}

/* Sticky Calendar controls while scrolling */
.calendar-head {
  position: sticky;
  top: 70px;
  z-index: 25;
  background: rgba(9,20,30,.96);
  backdrop-filter: blur(14px);
}

/* Better desktop toolbar balance */
.calendar-head {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 20px;
  padding: 14px 18px;
}

.calendar-head > div:first-child {
  min-width: 0;
}

.calendar-head h2 {
  margin: 4px 0 0;
  font-size: 24px;
  line-height: 1.1;
}

.calendar-head small {
  margin-top: 4px;
}

.calendar-head-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: nowrap;
}

#calendarAddEventBtn {
  min-width: 118px;
}

#calendarTodayBtn {
  min-width: 76px;
}

/* Compact search row */
.calendar-search-row {
  padding: 10px 14px;
}

.calendar-search-row input {
  height: 38px;
}

/* Weekday header remains visible under toolbar */
.calendar-weekday {
  position: sticky;
  top: 141px;
  z-index: 20;
  background: #0a1823;
}

/* Use the whole width and reduce vertical height */
.calendar-grid {
  width: 100%;
  grid-template-columns: repeat(7,minmax(0,1fr));
}

/* More balanced month cells */
.calendar-day {
  min-height: 94px;
  padding: 6px;
}

/* Outside-month dates should stay subtle */
.calendar-day.outside {
  opacity: .28;
}

/* Better event readability in wider cells */
.calendar-event-pill {
  padding: 4px 6px;
  font-size: 8px;
}

.calendar-event-pill small {
  font-size: 7px;
}

/* Avoid the huge blank-right impression */
.content {
  max-width: none !important;
}

/* Desktop-only spacing */
@media (min-width:761px) {

  .main {
    min-width: 0;
  }

  .content {
    width: 100%;
    max-width: none !important;
  }

  .calendar-workspace {
    width: 100%;
  }

  .calendar-panel {
    width: 100%;
  }

  .calendar-grid {
    min-width: 0;
  }
}

/* Keep the existing mobile layout isolated */
@media (max-width:760px) {

  .calendar-head {
    position: static;
  }

  .calendar-weekday {
    position: static;
  }

  .calendar-hero {
    margin-bottom: 12px !important;
  }

  .calendar-hero h1 {
    font-size: 28px;
  }

  .calendar-day {
    min-height: 78px;
  }
}

/* ==================================================
   MONCEDA VAULT V2.5.2
   MOBILE CALENDAR POLISH
   ================================================== */

@media (max-width:760px) {

  /* -----------------------------------------------
     Calendar page hero
     ----------------------------------------------- */

  .calendar-hero {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;

    margin-bottom: 12px !important;
  }

  .calendar-hero .eyebrow {
    font-size: 9px !important;
    letter-spacing: .14em;
  }

  .calendar-hero h1 {
    margin-top: 5px !important;

    font-size: 29px !important;
    line-height: 1.05 !important;
  }

  .calendar-hero p {
    margin-top: 7px !important;

    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  /*
   * New Vault remains available,
   * but it should not compete with Add Event.
   */
  .calendar-hero .actions {
    display: flex !important;
    width: auto !important;

    justify-content: flex-start !important;
    align-items: center !important;

    gap: 7px !important;
  }

  .calendar-hero .actions #addVaultBtn {
    width: auto !important;

    min-height: 38px !important;

    padding: 7px 12px !important;

    font-size: 11px !important;
  }


  /* -----------------------------------------------
     Calendar panel
     ----------------------------------------------- */

  .calendar-workspace {
    width: 100% !important;
  }

  .calendar-panel {
    width: 100% !important;

    overflow: hidden !important;

    border-radius: 14px !important;
  }


  /* -----------------------------------------------
     Month heading
     ----------------------------------------------- */

  .calendar-head {
    position: static !important;

    display: grid !important;
    grid-template-columns: 1fr !important;

    gap: 13px !important;

    padding: 15px !important;
  }

  .calendar-head > div:first-child {
    width: 100%;
    min-width: 0;
  }

  .calendar-head > div:first-child .eyebrow {
    display: block;

    max-width: 100%;

    margin-bottom: 5px;

    font-size: 8px !important;
    line-height: 1.35 !important;

    letter-spacing: .13em;

    white-space: normal;
  }

  .calendar-head h2 {
    margin: 0 !important;

    font-size: 26px !important;
    line-height: 1.05 !important;

    white-space: nowrap !important;
  }

  .calendar-head small {
    display: block;

    margin-top: 6px !important;

    font-size: 9px !important;
  }


  /* -----------------------------------------------
     Actions:
     Add Event on row 1
     Today + arrows on row 2
     ----------------------------------------------- */

  .calendar-head-actions {
    display: grid !important;

    grid-template-columns:
      minmax(0,1fr)
      44px
      44px !important;

    gap: 7px !important;

    width: 100% !important;
  }

  #calendarAddEventBtn {
    grid-column: 1 / -1 !important;

    width: 100% !important;

    min-width: 0 !important;
    min-height: 44px !important;

    padding: 9px 12px !important;

    font-size: 13px !important;
    font-weight: 800 !important;
  }

  #calendarTodayBtn {
    width: 100% !important;

    min-width: 0 !important;
    min-height: 40px !important;

    font-size: 11px !important;
  }

  #calendarPrevBtn,
  #calendarNextBtn {
    width: 44px !important;
    min-width: 44px !important;
    height: 40px !important;

    padding: 0 !important;

    font-size: 17px !important;
  }


  /* -----------------------------------------------
     Search
     ----------------------------------------------- */

  .calendar-search-row {
    padding: 9px 11px !important;
  }

  .calendar-search-row input {
    height: 40px !important;

    padding: 0 12px !important;

    font-size: 12px !important;
  }


  /* -----------------------------------------------
     Weekday heading
     ----------------------------------------------- */

  .calendar-weekday {
    position: static !important;

    padding: 7px 1px !important;

    font-size: 7px !important;
    letter-spacing: .08em !important;
  }


  /* -----------------------------------------------
     Month cells
     ----------------------------------------------- */

  .calendar-day {
    min-height: 72px !important;

    padding: 3px !important;
  }

  .calendar-day-number {
    width: 22px !important;
    height: 22px !important;

    font-size: 8px !important;
  }

  .calendar-day-events {
    gap: 2px !important;
    margin-top: 2px !important;
  }

  .calendar-event-pill {
    padding: 3px !important;

    font-size: 6.5px !important;
    line-height: 1.15 !important;
  }

  .calendar-event-pill small {
    display: none !important;
  }

  /*
   * Only two visible events per cell on phones.
   * Additional events still show through "+ more".
   */
  .calendar-day-events
  .calendar-event-pill:nth-of-type(n+3) {
    display: none !important;
  }


  /* -----------------------------------------------
     Modal polish
     ----------------------------------------------- */

  .calendar-event-modal,
  .calendar-detail-modal {
    width: 100% !important;
    max-width: 100% !important;

    max-height: 92dvh !important;

    margin: 0 !important;

    border-radius:
      18px
      18px
      0
      0 !important;
  }

  .calendar-detail-grid {
    grid-template-columns: 1fr !important;
  }
}


/* Extra-small phones */
@media (max-width:390px) {

  .calendar-head {
    padding: 13px !important;
  }

  .calendar-head h2 {
    font-size: 24px !important;
  }

  .calendar-day {
    min-height: 66px !important;
  }

  .calendar-event-pill {
    font-size: 6px !important;
  }
}

/* ==================================================
   MONCEDA VAULT V2.5.3
   CALENDAR MONTH / YEAR JUMP PICKER
   ================================================== */

.calendar-month-year-button {
  display: inline-flex;
  align-items: center;
  gap: 9px;

  max-width: 100%;

  margin: 5px 0 0;
  padding: 0;

  border: 0;
  border-radius: 8px;

  background: transparent;
  color: inherit;

  font: inherit;
  cursor: pointer;

  text-align: left;
}

.calendar-month-year-label {
  font-size: 24px;
  font-weight: 800;
  line-height: 1.1;
}

.calendar-month-year-chevron {
  display: inline-grid;
  place-items: center;

  width: 23px;
  height: 23px;

  flex: 0 0 23px;

  border: 1px solid var(--line);
  border-radius: 7px;

  color: var(--muted);

  font-size: 12px;
  line-height: 1;
}

.calendar-month-year-button:hover
.calendar-month-year-chevron {
  border-color: rgba(46,230,166,.4);
  background: rgba(46,230,166,.08);
  color: var(--green);
}

.calendar-month-year-button:focus-visible {
  outline: 2px solid rgba(46,230,166,.32);
  outline-offset: 5px;
}

.calendar-jump-modal {
  width: min(480px,calc(100vw - 32px));
}

.calendar-jump-modal .modal-head > div {
  display: grid;
  gap: 4px;
}

.calendar-jump-copy {
  margin: 0 0 18px;

  color: var(--muted);

  font-size: 11px;
  line-height: 1.55;
}

.calendar-jump-fields {
  display: grid;

  grid-template-columns:
    minmax(0,1.35fr)
    minmax(130px,.65fr);

  gap: 12px;
}

.calendar-jump-fields .field {
  display: grid;
  gap: 7px;
}

.calendar-jump-fields .field > span {
  color: var(--muted);

  font-size: 10px;
  font-weight: 700;
}

.calendar-jump-fields select,
.calendar-jump-fields input {
  width: 100%;
  box-sizing: border-box;
}

.calendar-jump-error {
  min-height: 16px;
  margin-top: 8px;
}

.calendar-jump-range {
  display: block;

  color: var(--muted);

  font-size: 9px;
}

.calendar-jump-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 10px;
}

.calendar-jump-footer-actions {
  display: flex;
  align-items: center;

  gap: 7px;
}


/* iPhone / mobile */
@media(max-width:760px) {

  .calendar-month-year-button {
    margin-top: 3px;

    gap: 8px;

    max-width: 100%;
  }

  .calendar-month-year-label {
    font-size: 25px;
    line-height: 1.05;

    white-space: nowrap;
  }

  .calendar-month-year-chevron {
    width: 24px;
    height: 24px;

    flex-basis: 24px;
  }

  .calendar-jump-modal {
    width: calc(100% - 24px) !important;
    max-width: 480px !important;

    max-height:
      calc(100dvh - 24px) !important;

    overflow-y: auto;

    margin: auto !important;

    border-radius: 16px !important;
  }

  .calendar-jump-fields {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .calendar-jump-fields select,
  .calendar-jump-fields input {
    min-height: 46px;

    font-size: 16px;
  }

  .calendar-jump-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .calendar-jump-footer >
  #calendarJumpTodayBtn {
    width: 100%;
  }

  .calendar-jump-footer-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;

    width: 100%;
  }

  .calendar-jump-footer-actions .btn {
    width: 100%;
  }
}

/* ==================================================
   MONCEDA VAULT V2.6
   ENCRYPTED PERSONAL FINANCE
   ================================================== */

.finance-overview {
  display: grid;
  gap: 16px;
  width: 100%;
}

.finance-kpi-grid {
  display: grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap: 12px;
}

.finance-kpi {
  min-width: 0;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background:
    linear-gradient(
      145deg,
      rgba(15,33,46,.98),
      rgba(9,22,32,.98)
    );
}

.finance-kpi-primary {
  border-color:
    rgba(46,230,166,.25);

  background:
    linear-gradient(
      145deg,
      rgba(17,56,50,.9),
      rgba(9,29,34,.98)
    );
}

.finance-kpi > span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .11em;
}

.finance-kpi > strong {
  display: block;
  margin-top: 10px;
  color: var(--text);
  font-size: 24px;
  line-height: 1.1;
}

.finance-kpi-primary > strong {
  color: var(--green);
}

.finance-kpi > small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.4;
}

.finance-dashboard-grid {
  display: grid;
  grid-template-columns:
    minmax(0,1fr)
    minmax(0,1fr);
  gap: 14px;
}

.finance-panel {
  overflow: hidden;
}

.finance-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 17px;
  border-bottom: 1px solid var(--line);
}

.finance-panel-head h3 {
  margin-top: 4px;
  font-size: 15px;
}

.finance-panel-head > strong {
  color: var(--muted);
  font-size: 12px;
}

.finance-account-row,
.finance-category-row,
.finance-transaction-row {
  border-bottom: 1px solid var(--line);
}

.finance-account-row,
.finance-category-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 13px 17px;
}

.finance-account-row > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.finance-account-row > div strong {
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-account-row > div span {
  color: var(--muted);
  font-size: 9px;
}

.finance-account-row > strong,
.finance-category-row > strong {
  color: var(--text);
  font-size: 11px;
  white-space: nowrap;
}

.finance-category-row > span {
  color: var(--muted);
  font-size: 11px;
}

.finance-transaction-row {
  display: grid;
  grid-template-columns:
    34px minmax(0,1fr) auto;
  gap: 11px;
  align-items: center;
  padding: 13px 17px;
}

.finance-transaction-kind {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--green);
  background: #07121b;
}

.finance-transaction-row > div:nth-child(2) {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.finance-transaction-row > div:nth-child(2) strong {
  overflow: hidden;
  color: var(--text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-transaction-row > div:nth-child(2) span {
  color: var(--muted);
  font-size: 9px;
}

.finance-amount {
  font-size: 11px;
  white-space: nowrap;
}

.finance-income {
  color: var(--green);
}

.finance-expense {
  color: #ff7b7b;
}

.finance-transfer {
  color: #9ab7ff;
}

.finance-empty {
  display: grid;
  gap: 6px;
  padding: 24px 17px;
  color: var(--muted);
  text-align: center;
}

.finance-empty strong {
  color: var(--text);
  font-size: 11px;
}

.finance-empty span {
  font-size: 9px;
  line-height: 1.5;
}

.finance-empty-large {
  min-height: 180px;
  place-content: center;
}

.finance-empty-large > div {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  margin: 0 auto 6px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--green);
  font-size: 22px;
}

.finance-security-note {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(46,230,166,.14);
  border-radius: 11px;
  background: rgba(46,230,166,.04);
}

.finance-security-note strong {
  color: #bceada;
  font-size: 10px;
  white-space: nowrap;
}

.finance-security-note span {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.5;
}

@media(max-width:1100px) {
  .finance-kpi-grid {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}

@media(max-width:760px) {

  .finance-kpi-grid {
    grid-template-columns: 1fr;
  }

  .finance-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .finance-kpi {
    padding: 15px;
  }

  .finance-kpi > strong {
    font-size: 25px;
  }

  .finance-security-note {
    align-items: flex-start;
    flex-direction: column;
  }

  .finance-transaction-row {
    grid-template-columns:
      32px minmax(0,1fr) auto;
    padding: 12px;
  }
}

/* ==================================================
   MONCEDA VAULT V2.6
   FINANCE CORE STAGE 2
   ================================================== */

.finance-workspace {
  display: grid;
  gap: 14px;
  width: 100%;
}

.finance-subnav {
  display: inline-flex;
  justify-self: start;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #07121b;
}

.finance-subnav button {
  min-height: 34px;
  padding: 6px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 700;
}

.finance-subnav button.active {
  background: rgba(46,230,166,.11);
  color: var(--green);
}

.finance-manager-panel {
  width: 100%;
  overflow: hidden;
}

.finance-manager-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 17px;
  border-bottom: 1px solid var(--line);
}

.finance-manager-head h2 {
  margin-top: 5px;
  font-size: 22px;
}

.finance-manager-head p {
  margin-top: 5px;
  color: var(--muted);
  font-size: 10px;
}

.finance-account-list,
.finance-ledger-list {
  display: grid;
}

.finance-account-card,
.finance-ledger-row {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.finance-account-card {
  display: grid;
  grid-template-columns:
    42px minmax(0,1fr)
    auto 18px;
  gap: 12px;
  align-items: center;
  padding: 14px 17px;
}

.finance-account-card:hover,
.finance-ledger-row:hover {
  background: rgba(255,255,255,.018);
}

.finance-account-card-icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(46,230,166,.17);
  border-radius: 11px;
  background: rgba(46,230,166,.055);
  color: var(--green);
  font-size: 14px;
  font-weight: 900;
}

.finance-account-card-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.finance-account-card-main strong {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-account-card-main span,
.finance-account-card-main small {
  color: var(--muted);
  font-size: 9px;
}

.finance-account-card-balance {
  display: grid;
  gap: 4px;
  justify-items: end;
}

.finance-account-card-balance span {
  color: var(--muted);
  font-size: 8px;
}

.finance-account-card-balance strong {
  font-size: 12px;
}

.finance-ledger-row {
  display: grid;
  grid-template-columns:
    38px minmax(0,1fr)
    auto 18px;
  gap: 11px;
  align-items: center;
  padding: 13px 17px;
}

.finance-ledger-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #07121b;
  font-weight: 900;
}

.finance-ledger-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.finance-ledger-main strong {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-ledger-main span,
.finance-ledger-main small {
  color: var(--muted);
  font-size: 9px;
}

.finance-ledger-amount {
  display: grid;
  gap: 3px;
  justify-items: end;
}

.finance-ledger-amount strong {
  font-size: 11px;
  white-space: nowrap;
}

.finance-ledger-amount span {
  color: var(--muted);
  font-size: 8px;
}

.finance-inline-notice {
  padding: 11px 15px;
  border-bottom: 1px solid var(--line);
  background: rgba(255,190,80,.045);
  color: #d4b379;
  font-size: 9px;
}

.finance-editor-modal textarea {
  min-height: 100px;
  resize: vertical;
}

.finance-editor-security {
  padding: 10px 12px;
  border: 1px solid rgba(46,230,166,.14);
  border-radius: 9px;
  background: rgba(46,230,166,.04);
  color: var(--muted);
  font-size: 9px;
}

.finance-editor-actions {
  display: flex;
  gap: 7px;
}

@media(max-width:760px) {

  .finance-subnav {
    display: grid;
    grid-template-columns:
      repeat(3,1fr);
    width: 100%;
    box-sizing: border-box;
  }

  .finance-subnav button {
    padding: 6px;
  }

  .finance-manager-head {
    align-items: stretch;
    flex-direction: column;
    padding: 14px;
  }

  .finance-manager-head .btn {
    width: 100%;
  }

  .finance-account-card {
    grid-template-columns:
      38px minmax(0,1fr) 16px;
    padding: 13px;
  }

  .finance-account-card-balance {
    grid-column: 2 / 3;
    justify-items: start;
  }

  .finance-account-card > .chev {
    grid-column: 3;
    grid-row: 1 / span 2;
  }

  .finance-ledger-row {
    grid-template-columns:
      34px minmax(0,1fr) 16px;
    padding: 12px;
  }

  .finance-ledger-amount {
    grid-column: 2 / 3;
    justify-items: start;
  }

  .finance-ledger-row > .chev {
    grid-column: 3;
    grid-row: 1 / span 2;
  }

  .finance-editor-modal {
    width: calc(100% - 24px);
    max-height: 92dvh;
    overflow-y: auto;
  }

  .finance-editor-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    flex: 1;
  }

  .finance-editor-actions .btn {
    width: 100%;
  }
}

/* ==================================================
   MONCEDA VAULT V2.6.1
   FINANCE POLISH
   ================================================== */

.finance-quick-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.finance-quick-actions .btn {
  min-width: 120px;
}

#financeHeroAddTransactionBtn {
  min-width: 150px;
}

@media(max-width:760px) {

  .finance-quick-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }

  .finance-quick-actions .btn {
    width: 100%;
    min-width: 0;
  }

  #financeHeroAddTransactionBtn {
    width: 100%;
    min-width: 0;
  }
}

/* =====================================================
   MONCEDA VAULT V2.6.2
   FINANCE FULL-WIDTH DASHBOARD + MONEY SAFETY
   ===================================================== */

.finance-workspace-shell {
  width: 100%;
  max-width: none;
  min-width: 0;
}

.finance-workspace-shell .finance-workspace,
.finance-workspace-shell .finance-overview {
  width: 100%;
  max-width: none;
  min-width: 0;
}

.finance-overview {
  display: block;
}

.finance-quick-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0 0 20px;
}

.finance-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  width: 100%;
}

.finance-kpi {
  min-width: 0;
  overflow: hidden;
}

.finance-kpi > strong {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin-top: 8px;

  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.08;
  letter-spacing: -0.035em;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.finance-kpi-primary > strong {
  font-size: clamp(23px, 2.15vw, 32px);
}

.finance-kpi > small {
  display: block;
  min-width: 0;
  margin-top: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.finance-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  width: 100%;
  margin-top: 16px;
}

.finance-dashboard-grid > *,
.finance-recent-panel {
  min-width: 0;
}

.finance-recent-panel {
  width: 100%;
  margin-top: 16px;
}

.finance-account-row,
.finance-category-row,
.finance-transaction-row {
  min-width: 0;
}

.finance-account-row > *,
.finance-category-row > *,
.finance-transaction-row > * {
  min-width: 0;
}

.finance-account-row > strong,
.finance-category-row > strong,
.finance-transaction-row .finance-amount {
  white-space: nowrap;
}

/* Negative monthly balance */
.finance-kpi-grid .finance-kpi:nth-child(4) > strong {
  white-space: nowrap;
}

.finance-kpi-grid .finance-kpi:nth-child(4) > strong[data-negative="true"] {
  color: #ff6b6b;
}

@media (min-width: 1500px) {
  .finance-kpi-grid {
    gap: 16px;
  }

  .finance-dashboard-grid {
    gap: 18px;
  }
}

@media (max-width: 1180px) {
  .finance-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .finance-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .finance-quick-actions {
    justify-content: stretch;
  }

  .finance-quick-actions .btn {
    flex: 1 1 auto;
  }
}

@media (max-width: 620px) {
  .finance-kpi-grid {
    grid-template-columns: 1fr;
  }

  .finance-kpi > strong,
  .finance-kpi-primary > strong {
    font-size: 27px;
  }

  .finance-quick-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .finance-quick-actions .btn {
    width: 100%;
  }
}


.finance-monthly-balance.finance-negative > strong {
  color: #ff6b6b;
}

.finance-monthly-balance.finance-positive > strong {
  color: #2ee6a6;
}




/* =====================================================
   MONCEDA VAULT V2.6.4 — FINANCE TRUE FULL WIDTH
   ===================================================== */

/*
 * Credentials use a master/detail workspace.
 * Finance needs one full-width workspace.
 */
.workspace.finance-workspace-shell {
  display: block !important;
  grid-template-columns: none !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  gap: 0 !important;
}

.workspace.finance-workspace-shell > .finance-workspace,
.finance-workspace-shell .finance-workspace,
.finance-workspace-shell .finance-overview,
.finance-workspace-shell .finance-manager-panel,
.finance-workspace-shell .finance-account-list,
.finance-workspace-shell .finance-ledger-list {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

.finance-workspace-shell .finance-overview {
  display: grid !important;
  gap: 16px !important;
}

.finance-workspace-shell .finance-quick-actions {
  width: 100% !important;
  margin: 0 !important;
}

@media (min-width: 1181px) {

  .finance-workspace-shell .finance-kpi-grid {
    display: grid !important;
    grid-template-columns:
      repeat(4, minmax(0,1fr)) !important;
    gap: 16px !important;
    width: 100% !important;
  }

  .finance-workspace-shell .finance-dashboard-grid {
    display: grid !important;
    grid-template-columns:
      repeat(2, minmax(0,1fr)) !important;
    gap: 16px !important;
    width: 100% !important;
  }

  .finance-workspace-shell .finance-recent-panel,
  .finance-workspace-shell .finance-manager-panel {
    width: 100% !important;
    max-width: none !important;
  }
}

@media (max-width: 1180px) {

  .finance-workspace-shell .finance-kpi-grid {
    grid-template-columns:
      repeat(2, minmax(0,1fr)) !important;
  }
}

@media (max-width: 820px) {

  .finance-workspace-shell .finance-dashboard-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 620px) {

  .finance-workspace-shell .finance-kpi-grid {
    grid-template-columns: 1fr !important;
  }
}


/* =====================================================
   MONCEDA VAULT V2.7 — MONTHLY BUDGET
   ===================================================== */

.finance-budget-workspace {
  display: grid;
  gap: 16px;
  width: 100%;
}

.finance-budget-summary {
  overflow: hidden;
}

.finance-budget-kpis {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 1px;
  border-top: 1px solid var(--line);
  background: var(--line);
}

.finance-budget-kpis > div {
  min-width: 0;
  padding: 17px;
  background: var(--panel);
}

.finance-budget-kpis span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .1em;
}

.finance-budget-kpis strong {
  display: block;
  margin-top: 8px;
  overflow: hidden;
  font-size: clamp(20px,2vw,28px);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-budget-list {
  display: grid;
}

.finance-budget-row {
  width: 100%;
  display: grid;
  grid-template-columns:
    minmax(0,1fr) auto 18px;
  align-items: center;
  gap: 18px;
  padding: 16px 18px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  color: var(--text);
  cursor: pointer;
  text-align: left;
  font: inherit;
}

.finance-budget-row:last-child {
  border-bottom: 0;
}

.finance-budget-row:hover {
  background: rgba(255,255,255,.018);
}

.finance-budget-main {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.finance-budget-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}

.finance-budget-title strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-budget-title span,
.finance-budget-main small {
  color: var(--muted);
  font-size: 10px;
}

.finance-budget-progress {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
}

.finance-budget-progress > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--green);
}

.finance-budget-remaining {
  display: grid;
  gap: 5px;
  min-width: 130px;
  text-align: right;
}

.finance-budget-remaining span {
  color: var(--muted);
  font-size: 9px;
}

.finance-budget-remaining strong {
  white-space: nowrap;
}

@media(max-width:760px) {
  .finance-budget-kpis {
    grid-template-columns: 1fr;
  }

  .finance-budget-row {
    grid-template-columns:
      minmax(0,1fr) 18px;
  }

  .finance-budget-remaining {
    grid-column: 1 / -1;
    grid-row: 2;
    min-width: 0;
    text-align: left;
  }
}


/* =====================================================
   MONCEDA VAULT V2.7.1 — CREDIT CARD LIABILITY
   ===================================================== */

.finance-credit-account-fields {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.018);
}

.finance-credit-account-fields[hidden] {
  display: none !important;
}

.finance-credit-due-field {
  grid-column: 1 / -1;
}

.finance-credit-meta,
.finance-credit-due {
  display: block;
  margin-top: 4px;
}

.finance-credit-meta {
  color: var(--muted);
}

.finance-credit-due {
  color: #fbbf24;
}

@media(max-width:760px) {

  .finance-credit-account-fields {
    grid-template-columns: 1fr;
  }

  .finance-credit-due-field {
    grid-column: auto;
  }
}


/* =====================================================
   MONCEDA VAULT V2.7.2 — LIABILITY SUMMARY
   ===================================================== */

.finance-liability-summary {
  display: grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap: 14px;
  width: 100%;
}

.finance-liability-card {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
}

.finance-liability-card span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .1em;
}

.finance-liability-card strong {
  display: block;
  margin-top: 9px;
  overflow: hidden;
  font-size: clamp(20px,2vw,28px);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-liability-card small {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 10px;
}

.finance-credit-card-total strong {
  color: #fbbf24;
}

@media(max-width:900px) {

  .finance-liability-summary {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}

@media(max-width:620px) {

  .finance-liability-summary {
    grid-template-columns: 1fr;
  }
}


/* =====================================================
   MONCEDA VAULT V2.8 — BILLS / RECURRING PAYMENTS
   ===================================================== */

.finance-bills-workspace {
  display: grid;
  gap: 16px;
  width: 100%;
}

.finance-bills-summary {
  overflow: hidden;
}

.finance-bill-kpis {
  display: grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap: 1px;
  border-top: 1px solid var(--line);
  background: var(--line);
}

.finance-bill-kpis > div {
  min-width: 0;
  padding: 17px;
  background: var(--panel);
}

.finance-bill-kpis span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .1em;
}

.finance-bill-kpis strong {
  display: block;
  margin-top: 8px;
  overflow: hidden;
  font-size: clamp(19px,2vw,27px);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-bill-list {
  display: grid;
}

.finance-bill-row {
  display: grid;
  grid-template-columns:
    minmax(0,1fr)
    minmax(130px,auto)
    auto;
  align-items: center;
  gap: 18px;
  padding: 15px 18px;
  border-bottom: 1px solid var(--line);
}

.finance-bill-row:last-child {
  border-bottom: 0;
}

.finance-bill-main {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  text-align: left;
  font: inherit;
}

.finance-bill-main > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.finance-bill-main strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-bill-main span,
.finance-bill-main small,
.finance-bill-paid-date {
  color: var(--muted);
  font-size: 10px;
}

.finance-bill-amount {
  display: grid;
  gap: 5px;
  text-align: right;
}

.finance-bill-amount strong {
  white-space: nowrap;
}

.finance-bill-status {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.finance-bill-status-upcoming {
  color: #fbbf24;
}

.finance-bill-status-overdue {
  color: #f87171;
}

.finance-bill-status-paid {
  color: var(--green);
}

.finance-bill-paid {
  opacity: .72;
}

.finance-pay-bill-btn {
  white-space: nowrap;
}

@media(max-width:900px) {
  .finance-bill-kpis {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}

@media(max-width:700px) {
  .finance-bill-row {
    grid-template-columns:
      minmax(0,1fr) auto;
  }

  .finance-pay-bill-btn,
  .finance-bill-paid-date {
    grid-column: 1 / -1;
  }
}

@media(max-width:520px) {
  .finance-bill-kpis {
    grid-template-columns: 1fr;
  }

  .finance-bill-row {
    grid-template-columns: 1fr;
  }

  .finance-bill-amount {
    text-align: left;
  }

  .finance-pay-bill-btn {
    width: 100%;
  }
}

/* =====================================================
   MONCEDA VAULT V2.8.2 — FINANCE MODAL POLISH
   Account / Transaction / Budget / Bills
   ===================================================== */

/* ---------- Main finance dialog ---------- */

.modal.finance-editor-modal {
  width: min(760px, calc(100vw - 32px)) !important;
  max-width: 760px !important;
  max-height: min(880px, calc(100vh - 40px)) !important;
  overflow: hidden !important;

  border: 1px solid rgba(148,163,184,.18) !important;
  border-radius: 22px !important;

  background:
    linear-gradient(
      180deg,
      rgba(13,31,44,.985),
      rgba(8,25,37,.995)
    ) !important;

  box-shadow:
    0 30px 90px rgba(0,0,0,.54),
    0 0 0 1px rgba(255,255,255,.018) inset !important;
}


/* ---------- Header ---------- */

.finance-editor-modal .modal-head {
  min-height: 72px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;

  gap: 18px !important;

  padding: 18px 22px !important;

  border-bottom:
    1px solid rgba(148,163,184,.13) !important;
}

.finance-editor-modal .modal-head strong {
  color: var(--text) !important;

  font-size: 20px !important;
  font-weight: 800 !important;

  letter-spacing: -.02em !important;
}


/* ---------- Close button ---------- */

.finance-editor-modal .modal-head .mini {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;

  border:
    1px solid rgba(148,163,184,.17) !important;

  border-radius: 12px !important;

  background:
    rgba(15,37,53,.88) !important;

  color: #d8e3ec !important;

  font-size: 21px !important;
}

.finance-editor-modal .modal-head .mini:hover {
  border-color:
    rgba(52,211,153,.35) !important;

  background:
    rgba(18,49,59,.95) !important;
}


/* ---------- Scrollable form body ---------- */

.finance-editor-modal .modal-body {
  display: block !important;

  padding: 22px 24px 24px !important;

  overflow-x: hidden !important;
  overflow-y: auto !important;

  max-height:
    calc(100vh - 190px) !important;
}


/* ---------- Two-column rows ---------- */

.finance-editor-modal .grid2 {
  display: grid !important;

  grid-template-columns:
    repeat(2, minmax(0,1fr)) !important;

  align-items: start !important;

  gap: 18px 22px !important;

  width: 100% !important;

  margin: 0 0 18px !important;
}


/* ---------- Fields ---------- */

.finance-editor-modal .field {
  display: grid !important;

  gap: 8px !important;

  width: 100% !important;
  min-width: 0 !important;

  margin: 0 0 18px !important;
}

.finance-editor-modal .grid2 > .field {
  margin-bottom: 0 !important;
}


/* ---------- Labels ---------- */

.finance-editor-modal .field > label {
  display: block !important;

  margin: 0 !important;

  color: #91a7b8 !important;

  font-size: 10px !important;
  font-weight: 800 !important;

  line-height: 1.3 !important;

  letter-spacing: .14em !important;

  text-transform: uppercase !important;
}


/* ---------- All form controls ---------- */

.finance-editor-modal input,
.finance-editor-modal select,
.finance-editor-modal textarea {
  width: 100% !important;
  max-width: none !important;

  box-sizing: border-box !important;

  border:
    1px solid rgba(148,163,184,.18) !important;

  border-radius: 10px !important;

  outline: none !important;

  background:
    rgba(13,31,44,.96) !important;

  color: #edf4f8 !important;

  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 500 !important;

  box-shadow:
    0 1px 0 rgba(255,255,255,.018) inset !important;

  color-scheme: dark !important;

  transition:
    border-color .15s ease,
    box-shadow .15s ease,
    background .15s ease !important;
}

.finance-editor-modal input,
.finance-editor-modal select {
  min-height: 46px !important;

  padding: 0 13px !important;
}

.finance-editor-modal textarea {
  min-height: 112px !important;

  resize: vertical !important;

  padding: 12px 13px !important;

  line-height: 1.45 !important;
}


/* ---------- Native select ---------- */

.finance-editor-modal select {
  cursor: pointer !important;

  text-overflow: ellipsis !important;
}

.finance-editor-modal select option {
  background: #0c1f2c !important;
  color: #edf4f8 !important;
}


/* ---------- Placeholder ---------- */

.finance-editor-modal input::placeholder,
.finance-editor-modal textarea::placeholder {
  color: #718595 !important;
  opacity: 1 !important;
}


/* ---------- Focus ---------- */

.finance-editor-modal input:focus,
.finance-editor-modal select:focus,
.finance-editor-modal textarea:focus {
  border-color:
    rgba(52,211,153,.68) !important;

  background:
    rgba(14,36,48,1) !important;

  box-shadow:
    0 0 0 3px
    rgba(52,211,153,.10) !important;
}


/* ---------- Date / number controls ---------- */

.finance-editor-modal
input[type="date"],
.finance-editor-modal
input[type="datetime-local"],
.finance-editor-modal
input[type="month"],
.finance-editor-modal
input[type="number"] {
  min-height: 46px !important;
}


/* ---------- Long account names ---------- */

.finance-editor-modal
select[name="accountId"],
.finance-editor-modal
select[name="toAccountId"] {
  font-size: 13px !important;

  white-space: nowrap !important;

  overflow: hidden !important;

  text-overflow: ellipsis !important;
}


/* ---------- Security notice ---------- */

.finance-editor-modal .finance-editor-security {
  width: 100% !important;

  box-sizing: border-box !important;

  margin: 4px 0 0 !important;

  padding: 12px 14px !important;

  border:
    1px solid rgba(52,211,153,.19) !important;

  border-radius: 12px !important;

  background:
    rgba(8,46,46,.42) !important;

  color: #96aab8 !important;

  font-size: 11px !important;

  line-height: 1.45 !important;
}


/* ---------- Validation ---------- */

.finance-editor-modal .error {
  min-height: 0 !important;

  margin: 0 0 10px !important;

  color: #fb7185 !important;

  font-size: 11px !important;
  font-weight: 700 !important;
}


/* ---------- Footer ---------- */

.finance-editor-modal .modal-foot {
  min-height: 76px !important;

  display: flex !important;

  align-items: center !important;
  justify-content: space-between !important;

  gap: 16px !important;

  padding: 14px 22px !important;

  border-top:
    1px solid rgba(148,163,184,.13) !important;

  background:
    rgba(7,24,35,.97) !important;
}

.finance-editor-modal .finance-editor-actions {
  display: flex !important;

  align-items: center !important;
  justify-content: flex-end !important;

  gap: 10px !important;

  margin-left: auto !important;
}


/* ---------- Buttons ---------- */

.finance-editor-modal .modal-foot .btn {
  min-height: 44px !important;

  padding: 0 18px !important;

  border-radius: 11px !important;

  font-weight: 750 !important;
}

.finance-editor-modal .modal-foot .btn.primary {
  min-width: 132px !important;
}


/* ---------- Credit-card editor ---------- */

.finance-editor-modal
.finance-credit-account-fields {
  grid-template-columns:
    repeat(2,minmax(0,1fr)) !important;

  gap: 16px 20px !important;

  width: 100% !important;

  margin: 2px 0 18px !important;

  padding: 16px !important;

  border-radius: 14px !important;

  background:
    rgba(5,21,31,.45) !important;
}


/* ---------- Budget helper text ---------- */

.finance-editor-modal small,
.finance-editor-modal .muted {
  color: #8195a4 !important;

  font-size: 10px !important;

  line-height: 1.45 !important;
}


/* ---------- Desktop breathing room ---------- */

@media(min-width:701px) {

  .finance-editor-modal
  .modal-body > .field:first-child {
    width: 100% !important;
  }

}


/* ---------- Tablet / Mobile ---------- */

@media(max-width:700px) {

  .modal.finance-editor-modal {
    width:
      calc(100vw - 18px) !important;

    max-height:
      calc(100vh - 18px) !important;

    border-radius: 18px !important;
  }

  .finance-editor-modal .modal-head {
    min-height: 64px !important;

    padding:
      14px 16px !important;
  }

  .finance-editor-modal .modal-head strong {
    font-size: 18px !important;
  }

  .finance-editor-modal .modal-body {
    padding:
      18px 16px 20px !important;

    max-height:
      calc(100vh - 160px) !important;
  }

  .finance-editor-modal .grid2 {
    grid-template-columns:
      1fr !important;

    gap: 16px !important;
  }

  .finance-editor-modal
  .finance-credit-account-fields {
    grid-template-columns:
      1fr !important;
  }

  .finance-editor-modal .modal-foot {
    min-height: 68px !important;

    padding:
      12px 16px !important;
  }

  .finance-editor-modal
  .finance-editor-actions {
    width: 100% !important;
  }

  .finance-editor-modal
  .finance-editor-actions .btn {
    flex: 1 !important;
  }

}


/* ---------- Small phones ---------- */

@media(max-width:440px) {

  .finance-editor-modal .modal-foot {
    align-items: stretch !important;

    flex-direction: column !important;
  }

  .finance-editor-modal
  .finance-editor-actions {
    display: grid !important;

    grid-template-columns:
      1fr 1fr !important;
  }

}


/* ==================================================
   MONCEDA VAULT V2.9 — REPORTS & ANALYTICS
   ================================================== */

.finance-reports-workspace {
  display: grid;
  gap: 18px;
  width: 100%;
  min-width: 0;
}

.finance-report-hero {
  width: 100%;
}

.finance-report-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}

.finance-report-head h2 {
  margin: 5px 0;
}

.finance-report-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.finance-report-month {
  width: 190px;
  flex: 0 0 190px;
}

.finance-report-month span {
  display: block;
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .1em;
}

.finance-report-month input {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
}

.finance-report-kpis {
  display: grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap: 12px;
  margin-top: 20px;
}

.finance-report-kpis > div,
.finance-report-budget-numbers > div,
.finance-report-bill-kpis > div {
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(5,21,31,.38);
}

.finance-report-kpis span,
.finance-report-budget-numbers span,
.finance-report-bill-kpis span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .06em;
}

.finance-report-kpis strong,
.finance-report-budget-numbers strong,
.finance-report-bill-kpis strong {
  display: block;
  margin-top: 7px;
  overflow: hidden;
  font-size: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-report-grid {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 18px;
}

.finance-report-card {
  min-width: 0;
}

.finance-report-card-head {
  margin-bottom: 18px;
}

.finance-report-card-head h3 {
  margin: 4px 0 0;
}

.finance-report-trend {
  height: 220px;
  display: grid;
  grid-template-columns:
    repeat(6,minmax(0,1fr));
  gap: 10px;
}

.finance-report-trend-column {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 7px;
  min-width: 0;
}

.finance-report-bars {
  height: 180px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 5px;
}

.finance-report-bar {
  width: 13px;
  min-height: 2px;
  border-radius: 5px 5px 2px 2px;
}

.finance-report-income-bar {
  background: rgba(52,211,153,.82);
}

.finance-report-expense-bar {
  background: rgba(251,113,133,.80);
}

.finance-report-trend-column small {
  color: var(--muted);
  text-align: center;
}

.finance-report-legend {
  display: flex;
  gap: 16px;
  margin-top: 12px;
  color: var(--muted);
  font-size: 10px;
}

.finance-report-legend span {
  display: flex;
  align-items: center;
  gap: 6px;
}

.finance-report-legend i {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 999px;
}

.finance-report-income-dot {
  background: rgba(52,211,153,.82);
}

.finance-report-expense-dot {
  background: rgba(251,113,133,.80);
}

.finance-report-budget-numbers {
  display: grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap: 10px;
}

.finance-report-progress,
.finance-report-category-track {
  overflow: hidden;
  border-radius: 999px;
  background: rgba(148,163,184,.12);
}

.finance-report-progress {
  height: 10px;
  margin: 18px 0 8px;
}

.finance-report-progress > span,
.finance-report-category-track > span {
  height: 100%;
  display: block;
  border-radius: inherit;
}

.finance-report-progress > span {
  background: rgba(52,211,153,.82);
}

.finance-report-category-list {
  display: grid;
  gap: 15px;
}

.finance-report-category > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 7px;
}

.finance-report-category strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-report-category-track {
  height: 7px;
}

.finance-report-category-track > span {
  background: rgba(96,165,250,.78);
}

.finance-report-category small {
  display: block;
  margin-top: 5px;
  color: var(--muted);
}

.finance-report-position-list {
  display: grid;
}

.finance-report-position-list > div {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
}

.finance-report-position-list > div:last-child {
  border-bottom: 0;
}

.finance-report-position-list span {
  color: var(--muted);
}

.finance-report-position-list strong {
  text-align: right;
}

.finance-report-bill-kpis {
  display: grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap: 10px;
}

.finance-report-bills-card {
  grid-column: 1 / -1;
}

.finance-report-empty {
  padding: 28px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--muted);
  text-align: center;
}


@media(max-width:900px) {

  .finance-report-grid {
    grid-template-columns: 1fr;
  }

  .finance-report-bills-card {
    grid-column: auto;
  }

  .finance-report-kpis {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}


@media(max-width:700px) {

  .finance-report-head {
    align-items: stretch;
    flex-direction: column;
  }

  .finance-report-month {
    width: 100%;
    flex: none;
  }

  .finance-report-budget-numbers,
  .finance-report-bill-kpis {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .finance-report-trend {
    gap: 6px;
  }

  .finance-report-bar {
    width: 10px;
  }
}


@media(max-width:440px) {

  .finance-report-kpis,
  .finance-report-budget-numbers,
  .finance-report-bill-kpis {
    grid-template-columns: 1fr;
  }
}


/* ==================================================
   MONCEDA VAULT V2.9.1 — REPORT MONTH PICKER
   ================================================== */

.finance-report-month {
  display: grid;
  gap: 7px;
  width: 210px;
  flex: 0 0 210px;
}

.finance-report-month span {
  margin: 0;
  color: #91a7b8;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.finance-report-month input[type="month"] {
  width: 100%;
  min-height: 46px;
  box-sizing: border-box;

  padding: 0 42px 0 14px;

  border:
    1px solid rgba(52,211,153,.46);

  border-radius: 11px;

  outline: none;

  background:
    rgba(10,29,41,.96);

  color: #edf4f8;

  font-family: inherit;
  font-size: 14px;
  font-weight: 700;

  color-scheme: dark;

  box-shadow:
    0 0 0 1px rgba(52,211,153,.04) inset;

  transition:
    border-color .15s ease,
    box-shadow .15s ease,
    background .15s ease;
}

.finance-report-month input[type="month"]:hover {
  border-color:
    rgba(52,211,153,.62);

  background:
    rgba(12,34,46,.98);
}

.finance-report-month input[type="month"]:focus {
  border-color:
    rgba(52,211,153,.85);

  box-shadow:
    0 0 0 3px rgba(52,211,153,.10);

  background:
    rgba(12,34,46,1);
}

/*
 * Chromium / WebKit calendar icon
 */
.finance-report-month
input[type="month"]
::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: .9;
  filter: invert(1);
}

/*
 * Keep native month control text readable
 */
.finance-report-month
input[type="month"]
::-webkit-datetime-edit,
.finance-report-month
input[type="month"]
::-webkit-datetime-edit-fields-wrapper,
.finance-report-month
input[type="month"]
::-webkit-datetime-edit-month-field,
.finance-report-month
input[type="month"]
::-webkit-datetime-edit-year-field {
  color: #edf4f8;
}

.finance-report-month
input[type="month"]
::-webkit-datetime-edit-text {
  color: #91a7b8;
}


/* Safari / Firefox fallback */
@supports not selector(
  input[type="month"]::-webkit-calendar-picker-indicator
) {
  .finance-report-month input[type="month"] {
    appearance: auto;
    background-color: rgba(10,29,41,.96);
    color: #edf4f8;
  }
}


@media(max-width:700px) {
  .finance-report-month {
    width: 100%;
    flex: none;
  }

  .finance-report-month input[type="month"] {
    width: 100%;
  }
}


/* ==================================================
   MONCEDA VAULT V2.9.2 — REPORTS SPACING POLISH
   ================================================== */

/*
 * Give every Reports panel proper interior breathing room.
 * This prevents eyebrow labels and headings from touching
 * or visually escaping the panel borders.
 */
.finance-report-hero,
.finance-report-card {
  box-sizing: border-box !important;
  padding: 22px 22px 20px !important;
}


/* ---------- Report hero ---------- */

.finance-report-hero {
  overflow: hidden !important;
}

.finance-report-head {
  padding: 0 !important;
  margin: 0 !important;
}

.finance-report-head > div {
  min-width: 0 !important;
}

.finance-report-head .eyebrow {
  display: block !important;

  margin: 0 0 7px !important;
  padding: 1px 0 0 !important;

  line-height: 1.35 !important;
}

.finance-report-head h2 {
  margin: 0 0 6px !important;

  line-height: 1.18 !important;
}

.finance-report-head p {
  margin: 0 !important;

  line-height: 1.5 !important;
}


/* ---------- KPI row ---------- */

.finance-report-kpis {
  width: 100% !important;

  margin-top: 20px !important;

  gap: 12px !important;
}

.finance-report-kpis > div {
  box-sizing: border-box !important;

  padding: 15px 16px !important;
}


/* ---------- Main report cards ---------- */

.finance-report-card {
  overflow: hidden !important;
}

.finance-report-card-head {
  width: 100% !important;

  box-sizing: border-box !important;

  margin: 0 0 18px !important;
  padding: 0 !important;
}

.finance-report-card-head > div {
  min-width: 0 !important;
}

.finance-report-card-head .eyebrow {
  display: block !important;

  margin: 0 0 7px !important;
  padding: 1px 0 0 !important;

  line-height: 1.35 !important;
}

.finance-report-card-head h3 {
  margin: 0 !important;

  line-height: 1.25 !important;
}


/* ---------- Grid spacing ---------- */

.finance-report-grid {
  gap: 18px !important;
}


/* ---------- Trend chart ---------- */

.finance-report-trend {
  width: 100% !important;

  box-sizing: border-box !important;

  margin-top: 2px !important;
}

.finance-report-legend {
  margin-top: 12px !important;
  padding-top: 2px !important;
}


/* ---------- Budget card ---------- */

.finance-report-budget-numbers {
  margin-top: 2px !important;
}

.finance-report-progress {
  margin:
    20px 0 9px !important;
}


/* ---------- Category card ---------- */

.finance-report-category-list {
  margin-top: 2px !important;
}

.finance-report-category {
  min-width: 0 !important;
}


/* ---------- Position card ---------- */

.finance-report-position-list {
  width: 100% !important;

  margin-top: 2px !important;
}

.finance-report-position-list > div {
  min-width: 0 !important;

  padding:
    13px 0 !important;
}

.finance-report-position-list > div:first-child {
  padding-top: 4px !important;
}


/* ---------- Bills ---------- */

.finance-report-bill-kpis {
  width: 100% !important;

  margin-top: 2px !important;
}

.finance-report-bill-kpis > div {
  box-sizing: border-box !important;

  padding:
    15px 16px !important;
}


/* ---------- Prevent money overflow ---------- */

.finance-report-kpis strong,
.finance-report-budget-numbers strong,
.finance-report-bill-kpis strong,
.finance-report-position-list strong {
  min-width: 0 !important;

  overflow: hidden !important;

  text-overflow: ellipsis !important;

  white-space: nowrap !important;
}


/* ---------- Tablet ---------- */

@media(max-width:900px) {

  .finance-report-hero,
  .finance-report-card {
    padding:
      20px 18px 18px !important;
  }

}


/* ---------- Mobile ---------- */

@media(max-width:700px) {

  .finance-report-hero,
  .finance-report-card {
    padding:
      18px 16px 16px !important;
  }

  .finance-report-card-head {
    margin-bottom:
      16px !important;
  }

  .finance-report-head .eyebrow,
  .finance-report-card-head .eyebrow {
    margin-bottom:
      6px !important;
  }

}


/* ---------- Small phones ---------- */

@media(max-width:440px) {

  .finance-report-hero,
  .finance-report-card {
    padding:
      16px 14px 15px !important;
  }

}


/* ==================================================
   MONCEDA VAULT V3.0 — SAVINGS & FINANCIAL GOALS
   ================================================== */

.finance-goals-workspace {
  display: grid;
  gap: 18px;
  width: 100%;
  min-width: 0;
}

.finance-goals-summary {
  padding: 22px !important;
}

.finance-goals-kpis {
  display: grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap: 12px;
  margin-top: 20px;
}

.finance-goals-kpis > div {
  min-width: 0;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(5,21,31,.38);
}

.finance-goals-kpis span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .07em;
}

.finance-goals-kpis strong {
  display: block;
  margin-top: 7px;
  overflow: hidden;
  font-size: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-goals-grid {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 18px;
}

.finance-goal-card {
  width: 100%;
  min-width: 0;
  padding: 20px !important;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.finance-goal-card:hover {
  border-color:
    rgba(52,211,153,.32);
}

.finance-goal-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.finance-goal-card-head h3 {
  margin: 5px 0 0;
}

.finance-goal-card-head > strong {
  flex: 0 0 auto;
  color: #34d399;
  font-size: 20px;
}

.finance-goal-progress {
  width: 100%;
  height: 10px;
  margin: 18px 0;
  overflow: hidden;
  border-radius: 999px;
  background:
    rgba(148,163,184,.12);
}

.finance-goal-progress > span {
  height: 100%;
  display: block;
  border-radius: inherit;
  background:
    linear-gradient(
      90deg,
      rgba(52,211,153,.76),
      rgba(52,211,153,1)
    );
}

.finance-goal-past-due
.finance-goal-progress > span {
  background:
    rgba(251,113,133,.84);
}

.finance-goal-values {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 12px;
}

.finance-goal-values > div {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background:
    rgba(5,21,31,.32);
}

.finance-goal-values span,
.finance-goal-meta {
  color: var(--muted);
  font-size: 10px;
}

.finance-goal-values strong {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-goal-meta {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-top: 15px;
}

.finance-goal-meta strong {
  color: var(--text);
}

.finance-goal-card > small {
  display: block;
  margin-top: 13px;
  overflow: hidden;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-goals-empty {
  padding: 48px 24px !important;
  text-align: center;
}

.finance-goals-empty > div {
  margin-bottom: 10px;
  color: #34d399;
  font-size: 34px;
}

.finance-goals-empty strong {
  font-size: 17px;
}

.finance-goals-empty p {
  max-width: 480px;
  margin: 8px auto 18px;
  color: var(--muted);
  line-height: 1.55;
}


@media(max-width:900px) {

  .finance-goals-kpis {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


@media(max-width:700px) {

  .finance-goals-grid {
    grid-template-columns: 1fr;
  }

  .finance-goals-summary {
    padding: 18px 16px !important;
  }

}


@media(max-width:440px) {

  .finance-goals-kpis,
  .finance-goal-values {
    grid-template-columns: 1fr;
  }

  .finance-goal-meta {
    flex-direction: column;
  }

}


/* ==================================================
   MONCEDA VAULT V3.1 — INVESTMENTS & VALUABLE ASSETS
   ================================================== */

.finance-investments-workspace {
  display: grid;
  gap: 18px;
  width: 100%;
  min-width: 0;
}

.finance-investments-summary {
  padding: 22px !important;
}

.finance-investment-kpis {
  display: grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap: 12px;
  margin-top: 20px;
}

.finance-investment-kpis > div {
  min-width: 0;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background:
    rgba(5,21,31,.38);
}

.finance-investment-kpis span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .07em;
}

.finance-investment-kpis strong {
  display: block;
  margin-top: 7px;
  min-width: 0;
  overflow: hidden;
  font-size: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-investment-grid {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 18px;
}

.finance-investment-card {
  width: 100%;
  min-width: 0;
  padding: 20px !important;

  border: 1px solid var(--line);

  color: inherit;
  cursor: pointer;
  text-align: left;

  transition:
    border-color .15s ease,
    transform .15s ease;
}

.finance-investment-card:hover {
  border-color:
    rgba(52,211,153,.34);

  transform:
    translateY(-1px);
}

.finance-investment-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.finance-investment-card-head > div:first-child {
  min-width: 0;
}

.finance-investment-card-head .eyebrow {
  display: block;
  margin-bottom: 6px;
}

.finance-investment-card-head h3 {
  margin: 0 0 5px;
  line-height: 1.25;
}

.finance-investment-card-head small {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-investment-gain {
  flex: 0 0 auto;
  min-width: 100px;
  text-align: right;
}

.finance-investment-gain strong,
.finance-investment-gain span {
  display: block;
}

.finance-investment-gain span {
  margin-top: 4px;
  font-size: 10px;
}

.finance-investment-values {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-top: 18px;
}

.finance-investment-values > div {
  min-width: 0;
  padding: 12px 13px;

  border:
    1px solid var(--line);

  border-radius: 11px;

  background:
    rgba(5,21,31,.32);
}

.finance-investment-values span {
  display: block;
  color: var(--muted);
  font-size: 10px;
}

.finance-investment-values strong {
  display: block;
  margin-top: 5px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-investment-meta {
  margin-top: 12px;
  color: var(--muted);
  font-size: 10px;
}

.finance-investment-meta strong {
  color: var(--text);
}

.finance-investments-empty {
  padding:
    48px 24px !important;

  text-align: center;
}

.finance-investments-empty > div {
  margin-bottom: 10px;
  color: #34d399;
  font-size: 30px;
}

.finance-investments-empty strong {
  font-size: 17px;
}

.finance-investments-empty p {
  max-width: 500px;

  margin:
    8px auto 18px;

  color: var(--muted);

  line-height: 1.55;
}


@media(max-width:900px) {

  .finance-investment-kpis {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


@media(max-width:700px) {

  .finance-investment-grid {
    grid-template-columns: 1fr;
  }

  .finance-investments-summary {
    padding:
      18px 16px !important;
  }

}


@media(max-width:440px) {

  .finance-investment-kpis,
  .finance-investment-values {
    grid-template-columns: 1fr;
  }

  .finance-investment-card-head {
    flex-direction: column;
  }

  .finance-investment-gain {
    min-width: 0;
    text-align: left;
  }

}


/* =====================================================
   MONCEDA VAULT V3.1.1 — FINANCE MOBILE UI POLISH
   Exact current selectors
   Mobile only
   ===================================================== */

@media(max-width:700px) {

  /* ---------- Finance workspace rhythm ---------- */

  .finance-workspace {
    gap: 12px;
  }

  .finance-overview {
    gap: 12px;
  }


  /* ---------- Finance navigation ---------- */

  .finance-subnav {
    display: grid;
    grid-template-columns:
      repeat(3,minmax(0,1fr));
    width: 100%;
    gap: 4px;
    padding: 5px;
    border-radius: 14px;
  }

  .finance-subnav button {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    padding: 8px 5px;
    border-radius: 10px;
    font-size: 10px;
    line-height: 1.15;
    text-align: center;
  }


  /* ---------- Quick actions ---------- */

  .finance-quick-actions {
    width: 100%;
    margin: 0;
  }

  .finance-quick-actions .btn,
  #financeOverviewAddAccountBtn {
    width: 100%;
    min-height: 48px;
    justify-content: center;
  }


  /* ---------- Overview KPI cards ---------- */

  .finance-kpi-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .finance-kpi {
    min-height: 0 !important;
    padding: 17px 18px !important;
    border-radius: 17px;
  }

  .finance-kpi > span {
    margin-bottom: 8px;
    font-size: 9px;
    line-height: 1.25;
    letter-spacing: .14em;
  }

  .finance-kpi > strong,
  .finance-kpi-primary > strong {
    display: block;
    margin: 0;
    font-size: clamp(
      27px,
      8.5vw,
      36px
    ) !important;
    line-height: 1.05 !important;
    overflow-wrap: anywhere;
  }

  .finance-kpi > small {
    display: block;
    margin-top: 10px;
    font-size: 9px;
    line-height: 1.45;
  }


  /* ---------- Liability cards ---------- */

  .finance-liability-summary {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .finance-liability-card {
    min-height: 0 !important;
    padding: 17px 18px !important;
    border-radius: 17px;
  }

  .finance-liability-card span {
    margin-bottom: 8px;
    font-size: 9px;
    line-height: 1.25;
    letter-spacing: .14em;
  }

  .finance-liability-card strong {
    display: block;
    margin: 0;
    font-size: clamp(
      23px,
      7.5vw,
      31px
    ) !important;
    line-height: 1.08 !important;
    overflow-wrap: anywhere;
  }

  .finance-liability-card small {
    display: block;
    margin-top: 9px;
    font-size: 9px;
    line-height: 1.4;
  }


  /* ---------- Dashboard panels ---------- */

  .finance-dashboard-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .finance-panel {
    border-radius: 17px;
    overflow: hidden;
  }

  .finance-panel-head {
    padding: 15px 17px !important;
  }

  .finance-panel-head h3 {
    margin-top: 5px;
    font-size: 18px;
    line-height: 1.15;
  }

  .finance-panel-head .eyebrow {
    font-size: 9px;
    line-height: 1.2;
    letter-spacing: .15em;
  }


  /* ---------- Account rows ---------- */

  .finance-account-row {
    min-height: 0 !important;
    gap: 12px;
    padding: 13px 17px !important;
  }

  .finance-account-row > div {
    min-width: 0;
  }

  .finance-account-row > div strong {
    font-size: 13px;
    line-height: 1.25;
  }

  .finance-account-row > div span {
    margin-top: 2px;
    font-size: 9px;
    line-height: 1.3;
  }

  .finance-account-row > strong {
    min-width: 0;
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
  }


  /* ---------- Spending rows ---------- */

  .finance-category-row {
    gap: 10px;
    padding: 13px 17px !important;
  }

  .finance-category-row > span {
    min-width: 0;
    font-size: 11px;
    line-height: 1.3;
  }

  .finance-category-row > strong {
    font-size: 12px;
    white-space: nowrap;
  }


  /* ---------- Recent transaction rows ---------- */

  .finance-transaction-row {
    grid-template-columns:
      38px minmax(0,1fr) auto !important;
    gap: 10px !important;
    padding: 13px 17px !important;
  }

  .finance-transaction-kind {
    width: 38px;
    height: 38px;
    min-width: 38px;
  }

  .finance-transaction-row > div:nth-child(2) {
    min-width: 0;
  }

  .finance-transaction-row > div:nth-child(2) strong {
    font-size: 12px;
    line-height: 1.25;
  }

  .finance-transaction-row > div:nth-child(2) span {
    font-size: 9px;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }

  .finance-transaction-row > strong,
  .finance-transaction-row .finance-amount {
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
  }

}


/* ---------- Extra-small phones ---------- */

@media(max-width:420px) {

  .finance-subnav {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .finance-subnav button {
    min-height: 40px;
  }

  .finance-kpi,
  .finance-liability-card {
    padding: 15px 16px !important;
  }

  .finance-account-row {
    padding:
      12px 15px !important;
  }

  .finance-account-row > strong {
    font-size: 11px;
  }

  .finance-transaction-row {
    padding:
      12px 15px !important;
  }

}

/* END MONCEDA VAULT V3.1.1 — FINANCE MOBILE UI POLISH */

/* ==================================================
   MONCEDA VAULT V3.1.2 — ACCOUNT PREVIEW
   ================================================== */

.finance-overview-view-all {
  padding: 12px 16px 15px;
  border-top: 1px solid var(--line);
}

.finance-overview-view-all .btn {
  width: 100%;
  min-height: 40px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-color:
    rgba(52,211,153,.18);

  background:
    rgba(52,211,153,.045);

  color:
    var(--green);
}

.finance-overview-view-all .btn:hover {
  border-color:
    rgba(52,211,153,.34);

  background:
    rgba(52,211,153,.08);
}


@media(max-width:700px) {

  .finance-overview-view-all {
    padding:
      10px 14px 13px;
  }

  .finance-overview-view-all .btn {
    min-height: 42px;

    border-radius:
      10px;
  }

}


/* ==================================================
   MONCEDA VAULT V3.1.4
   RECURRING TRANSACTIONS
   ================================================== */

.finance-transaction-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.finance-recurring-block {
  border-bottom: 1px solid var(--line);
}

.finance-recurring-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 17px;
  border-bottom: 1px solid var(--line);
  background: rgba(46,230,166,.025);
}

.finance-recurring-head > div {
  display: grid;
  gap: 4px;
}

.finance-recurring-head > div > strong {
  color: var(--text);
  font-size: 12px;
}

.finance-recurring-head > span {
  color: var(--muted);
  font-size: 11px;
}

.finance-recurring-list {
  display: grid;
}

.finance-recurring-row {
  width: 100%;
  display: grid;
  grid-template-columns:
    minmax(0,1fr)
    auto
    18px;
  gap: 12px;
  align-items: center;
  padding: 13px 17px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.finance-recurring-row:hover {
  background: rgba(255,255,255,.018);
}

.finance-recurring-row > div:first-child,
.finance-recurring-row > div:nth-child(2) {
  display: grid;
  gap: 4px;
}

.finance-recurring-row > div:first-child {
  min-width: 0;
}

.finance-recurring-row > div:first-child strong {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-recurring-row > div:first-child span,
.finance-recurring-row small {
  color: var(--muted);
  font-size: 9px;
}

.finance-recurring-row > div:nth-child(2) {
  justify-items: end;
}

.finance-recurring-row > div:nth-child(2) strong {
  font-size: 11px;
  white-space: nowrap;
}

@media(max-width:760px) {
  .finance-transaction-actions {
    width: 100%;
  }

  .finance-transaction-actions .btn {
    flex: 1 1 auto;
  }

  .finance-recurring-row {
    grid-template-columns:
      minmax(0,1fr)
      auto;
  }

  .finance-recurring-row > .chev {
    display: none;
  }
}

/* =====================================================
   MONCEDA VAULT V3.2 — BUDGET CARDS
   ===================================================== */

.finance-budget-card-grid {
  display: grid;
  grid-template-columns:
    repeat(auto-fit,minmax(300px,1fr));
  gap: 16px;
  padding: 16px;
}

.finance-budget-card {
  width: 100%;
  display: grid;
  gap: 16px;

  padding: 20px;

  border:
    1px solid rgba(148,163,184,.15);

  border-radius: 18px;

  background:
    linear-gradient(
      180deg,
      rgba(12,31,44,.96),
      rgba(7,22,33,.99)
    );

  color: var(--text);

  cursor: pointer;
  text-align: left;
  font: inherit;

  box-shadow:
    0 16px 42px rgba(0,0,0,.16);

  transition:
    transform .15s ease,
    border-color .15s ease,
    background .15s ease;
}

.finance-budget-card:hover {
  transform: translateY(-2px);

  border-color:
    rgba(52,211,153,.26);

  background:
    linear-gradient(
      180deg,
      rgba(14,36,49,.98),
      rgba(8,25,36,1)
    );
}

.finance-budget-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.finance-budget-card-top > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.finance-budget-card-eyebrow {
  color: #78909f;

  font-size: 9px;
  font-weight: 900;

  letter-spacing: .14em;
}

.finance-budget-card-name {
  overflow: hidden;

  color: #f2f7f9;

  font-size: 18px;
  font-weight: 800;

  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-budget-card-range {
  color: #8296a5;
  font-size: 11px;
}

.finance-budget-card-badge {
  flex: 0 0 auto;

  padding: 6px 9px;

  border:
    1px solid rgba(148,163,184,.15);

  border-radius: 999px;

  background:
    rgba(255,255,255,.035);

  color: #9fb1bd;

  font-size: 9px;
  font-weight: 900;

  letter-spacing: .08em;
}

.finance-budget-card-limit {
  display: grid;
  gap: 3px;
}

.finance-budget-card-limit strong {
  color: #f6fafb;
  font-size: 28px;
  line-height: 1;
}

.finance-budget-card-limit span {
  color: #718896;
  font-size: 10px;
}

.finance-budget-card-progress-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;

  color: #7f95a3;

  font-size: 9px;
  font-weight: 800;

  letter-spacing: .06em;
}

.finance-budget-card-progress {
  height: 8px;

  overflow: hidden;

  border-radius: 999px;

  background:
    rgba(255,255,255,.06);
}

.finance-budget-card-progress > span {
  display: block;
  height: 100%;

  border-radius: inherit;

  background: var(--green);

  transition: width .2s ease;
}

.finance-budget-card-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.finance-budget-card-stats > div {
  display: grid;
  gap: 5px;

  padding: 12px 13px;

  border:
    1px solid rgba(148,163,184,.10);

  border-radius: 12px;

  background:
    rgba(255,255,255,.018);
}

.finance-budget-card-stats span {
  color: #748b99;

  font-size: 9px;
  font-weight: 900;

  letter-spacing: .08em;
}

.finance-budget-card-stats strong {
  color: #eaf3f7;
  font-size: 15px;
}

.finance-budget-card-message {
  min-height: 46px;

  padding: 12px 13px;

  border:
    1px solid rgba(52,211,153,.13);

  border-radius: 12px;

  background:
    rgba(52,211,153,.045);

  color: #a8beb5;

  font-size: 11px;
  line-height: 1.5;
}

.finance-budget-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  padding-top: 2px;

  color: #778d9b;

  font-size: 10px;
}

.finance-budget-card-footer strong {
  color: #9fb5c0;

  font-size: 9px;
  font-weight: 900;

  letter-spacing: .06em;
}

.finance-budget-status-over {
  border-color:
    rgba(251,113,133,.26);
}

.finance-budget-status-over
.finance-budget-card-progress > span {
  background: var(--danger);
}

.finance-budget-status-over
.finance-budget-card-message {
  border-color:
    rgba(251,113,133,.19);

  background:
    rgba(251,113,133,.06);

  color: #ffc0ca;
}

.finance-budget-status-watch
.finance-budget-card-progress > span {
  background: #f2c66d;
}

.finance-budget-status-watch
.finance-budget-card-message {
  border-color:
    rgba(242,198,109,.16);

  background:
    rgba(242,198,109,.05);

  color: #d8c59b;
}

.finance-budget-status-full
.finance-budget-card-progress > span {
  background: #7ea6c9;
}

@media(max-width:700px) {
  .finance-budget-card-grid {
    grid-template-columns: 1fr;
    padding: 12px;
  }

  .finance-budget-card {
    padding: 17px;
  }

  .finance-budget-card-limit strong {
    font-size: 24px;
  }
}

@media(max-width:440px) {
  .finance-budget-card-stats {
    grid-template-columns: 1fr;
  }

  .finance-budget-card-footer {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* =====================================================
   MONCEDA VAULT V3.2.1 — BUDGET CARD VISUAL FIX
   ===================================================== */

.finance-budget-card-grid .finance-budget-card {
  appearance: none;
  -webkit-appearance: none;

  position: relative;

  display: flex;
  flex-direction: column;

  width: 100%;
  min-width: 0;

  margin: 0;
  padding: 20px;

  border:
    1px solid rgba(120,150,170,.18);

  border-radius: 18px;

  background:
    linear-gradient(
      145deg,
      rgba(15,34,47,.98),
      rgba(7,23,34,.98)
    );

  color: #eaf3f7;

  box-shadow:
    0 14px 32px rgba(0,0,0,.16);

  text-align: left;
}

.finance-budget-card-grid
.finance-budget-card * {
  box-sizing: border-box;
}

.finance-budget-card-actions {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}

.finance-budget-release-btn {
  flex: 1 1 180px;

  min-height: 40px;

  border-radius: 11px;

  font-weight: 800;
}

.finance-budget-card-actions .mini {
  min-height: 40px;
  padding-inline: 16px;
}

.finance-budget-release-btn:disabled {
  cursor: not-allowed;
  opacity: .45;
}

@media(max-width:600px) {
  .finance-budget-card-actions {
    display: grid;
    grid-template-columns: 1fr auto;
  }

  .finance-budget-release-btn {
    width: 100%;
  }
}

/* =====================================================
   MONCEDA VAULT V3.2.2 — WEEKLY RELEASE HISTORY
   ===================================================== */

.finance-budget-release-history {
  display: grid;
  gap: 10px;

  padding: 14px;

  border:
    1px solid rgba(148,163,184,.11);

  border-radius: 13px;

  background:
    rgba(255,255,255,.018);
}

.finance-budget-release-history-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.finance-budget-release-history-head span {
  color: #78909f;

  font-size: 9px;
  font-weight: 900;

  letter-spacing: .12em;
}

.finance-budget-release-days {
  display: grid;
  gap: 7px;
}

.finance-budget-release-day {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  min-height: 32px;

  padding: 7px 9px;

  border-radius: 9px;

  background:
    rgba(255,255,255,.018);
}

.finance-budget-release-day-left {
  display: flex;
  align-items: center;
  gap: 8px;

  min-width: 0;
}

.finance-budget-release-icon {
  width: 18px;

  color: #7d909c;

  font-size: 12px;
  font-weight: 900;

  text-align: center;
}

.finance-budget-release-day strong {
  overflow: hidden;

  color: #b8c7d0;

  font-size: 10px;
  font-weight: 700;

  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-budget-release-day-status {
  flex: 0 0 auto;

  color: #8295a1;

  font-size: 10px;
  font-weight: 700;
}

.finance-budget-release-day.released {
  background:
    rgba(52,211,153,.045);
}

.finance-budget-release-day.released
.finance-budget-release-icon,
.finance-budget-release-day.released
.finance-budget-release-day-status {
  color: #64d8ad;
}

.finance-budget-release-day.today {
  border:
    1px solid rgba(76,160,255,.13);

  background:
    rgba(76,160,255,.035);
}

.finance-budget-release-day.today
.finance-budget-release-icon {
  color: #80b9ff;
}

.finance-budget-release-day.missed
.finance-budget-release-day-status {
  color: #9b8d8d;
}

.finance-budget-release-day.future {
  opacity: .65;
}

.finance-budget-release-summary {
  display: grid;
  gap: 5px;

  padding: 14px;

  border:
    1px solid rgba(52,211,153,.13);

  border-radius: 12px;

  background:
    rgba(52,211,153,.04);
}

.finance-budget-release-summary span {
  color: #79929e;

  font-size: 9px;
  font-weight: 900;

  letter-spacing: .11em;
}

.finance-budget-release-summary strong {
  color: #dce9ee;
  font-size: 15px;
}

.finance-budget-release-summary b {
  color: #6ad9ae;
  font-size: 22px;
}

.finance-budget-release-info {
  padding: 10px 12px;

  border-radius: 10px;

  background:
    rgba(255,255,255,.025);

  color: #90a4af;

  font-size: 11px;
}

@media(max-width:500px) {
  .finance-budget-release-day {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .finance-budget-release-day-status {
    padding-left: 26px;
  }
}

/* =====================================================
   MONCEDA VAULT V3.2.3 — FINAL WEEKLY BUDGET CARD
   ===================================================== */

.finance-budget-card-grid {
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 18px;
  padding: 18px;
}

.finance-budget-card-grid .finance-budget-card {
  gap: 18px;

  padding: 22px;

  border:
    1px solid rgba(116,151,174,.20);

  border-radius: 18px;

  background:
    linear-gradient(
      150deg,
      rgba(13,34,48,.99),
      rgba(7,24,35,.99)
    );

  box-shadow:
    0 16px 36px rgba(0,0,0,.14);
}

.finance-budget-card-top {
  min-height: 58px;
}

.finance-budget-card-eyebrow {
  color: #8196a4;
  font-size: 10px;
}

.finance-budget-card-name {
  margin-top: 3px;
  font-size: 21px;
  line-height: 1.15;
}

.finance-budget-card-range {
  margin-top: 2px;
  font-size: 11px;
}

.finance-budget-card-badge {
  padding: 7px 11px;

  border:
    1px solid rgba(138,164,180,.17);

  background:
    rgba(255,255,255,.025);
}

.finance-budget-card-limit strong {
  font-size: 32px;
}

.finance-budget-card-limit span {
  margin-top: 4px;
  font-size: 11px;
}

.finance-budget-card-progress-head {
  margin-top: 2px;
}

.finance-budget-card-progress {
  height: 8px;
}

.finance-budget-card-progress > span {
  background:
    linear-gradient(
      90deg,
      #36d6a5,
      #47e3b2
    );
}

.finance-budget-card-stats-weekly {
  grid-template-columns:
    repeat(3,minmax(0,1fr));
}

.finance-budget-card-stats > div {
  min-height: 72px;
  align-content: center;

  padding: 13px 14px;

  border:
    1px solid rgba(119,151,170,.13);

  background:
    rgba(255,255,255,.016);
}

.finance-budget-card-stats span {
  font-size: 9px;
}

.finance-budget-card-stats strong {
  margin-top: 2px;
  font-size: 16px;
}

.finance-budget-card-message {
  min-height: auto;
  padding: 11px 13px;
}

.finance-budget-release-history {
  gap: 7px;

  padding: 15px 16px;

  border:
    1px solid rgba(119,151,170,.13);

  background:
    rgba(3,15,23,.18);
}

.finance-budget-release-history-head {
  padding-bottom: 5px;
}

.finance-budget-release-history-head span {
  font-size: 10px;
}

.finance-budget-release-days {
  gap: 0;
}

.finance-budget-release-day {
  min-height: 38px;

  padding: 8px 5px;

  border-radius: 0;

  border-bottom:
    1px solid rgba(115,145,163,.10);

  background: transparent;
}

.finance-budget-release-day:last-child {
  border-bottom: 0;
}

.finance-budget-release-day.released,
.finance-budget-release-day.today {
  background: transparent;
  border-left: 0;
}

.finance-budget-release-icon {
  display: inline-grid;
  place-items: center;

  width: 20px;
  height: 20px;

  border-radius: 999px;

  background:
    rgba(122,145,159,.10);
}

.finance-budget-release-day.released
.finance-budget-release-icon {
  background:
    rgba(52,211,153,.14);

  color: #43dfaa;
}

.finance-budget-release-day.missed
.finance-budget-release-icon {
  background:
    rgba(239,95,110,.13);

  color: #ed7381;
}

.finance-budget-release-day.today
.finance-budget-release-icon {
  background:
    rgba(66,153,255,.14);

  color: #65abff;
}

.finance-budget-release-day strong {
  font-size: 11px;
}

.finance-budget-release-day-status {
  font-size: 11px;
}

.finance-budget-card-actions {
  display: grid;

  grid-template-columns:
    minmax(150px,.9fr)
    minmax(180px,1.25fr)
    auto;

  gap: 10px;

  align-items: stretch;
}

.finance-budget-release-date-wrap {
  position: relative;
  min-width: 0;
}

.finance-budget-release-calendar-icon {
  position: absolute;
  left: 13px;
  top: 50%;

  z-index: 1;

  transform: translateY(-50%);

  color: #899da9;

  pointer-events: none;
}

.finance-budget-release-date {
  width: 100%;
  height: 42px;

  padding:
    0 12px 0 38px;

  border:
    1px solid rgba(122,151,170,.18);

  border-radius: 11px;

  outline: none;

  background:
    rgba(7,24,35,.80);

  color: #dce7ec;

  font: inherit;
  font-size: 12px;
}

.finance-budget-release-date:focus {
  border-color:
    rgba(52,211,153,.40);

  box-shadow:
    0 0 0 3px
    rgba(52,211,153,.07);
}

.finance-budget-release-btn {
  min-height: 42px;

  border-color:
    rgba(52,211,153,.32);

  background:
    linear-gradient(
      180deg,
      rgba(30,176,124,.95),
      rgba(18,144,101,.95)
    );

  color: #f4fffb;

  box-shadow:
    inset 0 1px 0
    rgba(255,255,255,.08);
}

.finance-budget-release-btn:hover:not(:disabled) {
  filter: brightness(1.06);
}

.finance-budget-edit-btn {
  min-width: 74px;
  min-height: 42px;
}

.finance-budget-card-footer {
  padding-top: 3px;

  border-top:
    1px solid rgba(116,145,163,.08);
}

@media(max-width:1100px) {
  .finance-budget-card-grid {
    grid-template-columns: 1fr;
  }
}

@media(max-width:680px) {
  .finance-budget-card-actions {
    grid-template-columns: 1fr;
  }

  .finance-budget-edit-btn {
    width: 100%;
  }
}

@media(max-width:520px) {
  .finance-budget-card-stats-weekly {
    grid-template-columns: 1fr;
  }

  .finance-budget-release-day {
    display: grid;
    grid-template-columns: 1fr;
  }

  .finance-budget-release-day-status {
    padding-left: 28px;
  }
}

/* =====================================================
   MONCEDA VAULT V3.2.4 — RELEASE EDIT / DELETE
   ===================================================== */

.finance-budget-release-day {
  display: grid;
  gap: 8px;
}

.finance-budget-release-day-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.finance-budget-release-records {
  display: grid;
  gap: 6px;

  padding-left: 28px;
}

.finance-budget-release-record {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  min-height: 38px;

  padding: 8px 10px;

  border:
    1px solid rgba(112,145,164,.10);

  border-radius: 9px;

  background:
    rgba(255,255,255,.015);
}

.finance-budget-release-record-main {
  display: flex;
  align-items: baseline;
  gap: 9px;

  min-width: 0;
}

.finance-budget-release-record-main strong {
  color: #63d8ad;
  font-size: 12px;
}

.finance-budget-release-record-main span {
  overflow: hidden;

  color: #8196a2;
  font-size: 10px;

  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-budget-release-edit {
  flex: 0 0 auto;

  min-width: 54px;
  min-height: 30px;
}

@media(max-width:520px) {
  .finance-budget-release-records {
    padding-left: 0;
  }

  .finance-budget-release-record {
    align-items: flex-start;
  }

  .finance-budget-release-record-main {
    display: grid;
    gap: 2px;
  }
}

/* =====================================================
   MONCEDA VAULT V3.2.5 — COMPACT EDIT ICONS
   ===================================================== */

.finance-budget-edit-btn,
.finance-budget-release-edit {
  display: inline-grid;
  place-items: center;

  flex: 0 0 auto;

  width: 42px;
  min-width: 42px;
  height: 42px;
  min-height: 42px;

  padding: 0;

  border:
    1px solid rgba(122,151,170,.18);

  border-radius: 11px;

  background:
    rgba(255,255,255,.025);

  color: #a8bac5;

  font-size: 19px;
  line-height: 1;

  cursor: pointer;

  transition:
    background .15s ease,
    border-color .15s ease,
    color .15s ease,
    transform .15s ease;
}

.finance-budget-edit-btn:hover,
.finance-budget-release-edit:hover {
  border-color:
    rgba(52,211,153,.32);

  background:
    rgba(52,211,153,.07);

  color: #55dcae;
}

.finance-budget-edit-btn:active,
.finance-budget-release-edit:active {
  transform: scale(.96);
}

/* Smaller pencil inside each release history row */
.finance-budget-release-edit {
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;

  border-radius: 9px;

  font-size: 16px;
}

/* Main action row:
   date | large release | compact edit icon */
.finance-budget-card-actions {
  grid-template-columns:
    minmax(150px,.9fr)
    minmax(200px,1.35fr)
    42px;
}

@media(max-width:680px) {
  .finance-budget-card-actions {
    grid-template-columns:
      minmax(0,1fr)
      42px;
  }

  .finance-budget-release-date-wrap {
    grid-column: 1 / -1;
  }

  .finance-budget-release-btn {
    width: 100%;
  }

  .finance-budget-edit-btn {
    width: 42px;
  }
}


/* =========================================================
   MONCEDA VAULT V3.3 — SECURE NOTE CHECKLIST / TO-DO
   ========================================================= */

.secure-note-checklist {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}

.secure-note-checklist-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.secure-note-checklist-head .section-mini-title {
  margin: 0;
  letter-spacing: 0.08em;
}

.secure-note-task-progress {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--muted);
}

.secure-note-add-task {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 7px 13px;
  white-space: nowrap;
}

.secure-note-task-list {
  display: grid;
  gap: 10px;
}

.secure-note-task {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: flex-start;
  gap: 12px;

  padding: 14px;

  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 14px;

  background:
    rgba(255, 255, 255, 0.025);

  transition:
    border-color 160ms ease,
    background 160ms ease,
    transform 160ms ease;
}

.secure-note-task:hover {
  border-color: rgba(148, 163, 184, 0.25);
  background: rgba(255, 255, 255, 0.04);
}

.secure-note-task-check {
  width: 28px;
  height: 28px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  margin: 1px 0 0;

  border: 1px solid rgba(148, 163, 184, 0.38);
  border-radius: 8px;

  background: transparent;
  color: inherit;

  font-size: 16px;
  font-weight: 800;
  line-height: 1;

  cursor: pointer;

  transition:
    border-color 150ms ease,
    background 150ms ease,
    transform 150ms ease;
}

.secure-note-task-check:hover {
  transform: scale(1.05);
  border-color: rgba(148, 163, 184, 0.65);
}

.secure-note-task.completed
.secure-note-task-check {
  border-color: rgba(34, 197, 94, 0.42);
  background: rgba(34, 197, 94, 0.13);
  color: #86efac;
}

.secure-note-task-main {
  min-width: 0;
}

.secure-note-task-title {
  color: var(--text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.secure-note-task.completed
.secure-note-task-title {
  color: var(--muted);
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}

.secure-note-task-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 12px;

  margin-top: 7px;

  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.secure-note-task-meta span {
  display: inline-flex;
  align-items: center;
}

.secure-note-task-side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.secure-note-task-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 24px;
  padding: 4px 8px;

  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 999px;

  background: rgba(148, 163, 184, 0.07);
  color: var(--muted);

  font-size: 9px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.06em;

  white-space: nowrap;
}

.secure-note-task-status.status-completed {
  border-color: rgba(34, 197, 94, 0.25);
  background: rgba(34, 197, 94, 0.09);
  color: #86efac;
}

.secure-note-task-status.status-overdue {
  border-color: rgba(239, 68, 68, 0.30);
  background: rgba(239, 68, 68, 0.09);
  color: #fca5a5;
}

.secure-note-task-status.status-today {
  border-color: rgba(245, 158, 11, 0.30);
  background: rgba(245, 158, 11, 0.09);
  color: #fcd34d;
}

.secure-note-task-status.status-soon {
  border-color: rgba(59, 130, 246, 0.28);
  background: rgba(59, 130, 246, 0.09);
  color: #93c5fd;
}

.secure-note-task-edit {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;

  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.secure-note-task-empty {
  min-height: 100px;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  padding: 22px;

  border: 1px dashed rgba(148, 163, 184, 0.22);
  border-radius: 14px;

  background: rgba(255, 255, 255, 0.018);

  text-align: center;
}

.secure-note-task-empty strong {
  color: var(--text);
  font-size: 13px;
}

.secure-note-task-empty span {
  max-width: 330px;
  margin-top: 5px;

  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
}

.secure-note-task-modal {
  max-width: 520px;
}

.secure-note-task-created {
  margin-top: 2px;
  padding: 10px 12px;

  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 10px;

  background: rgba(255, 255, 255, 0.025);

  color: var(--muted);
  font-size: 11px;
}


/* ---------- MOBILE ---------- */

@media (max-width: 760px) {

  .secure-note-checklist {
    margin-top: 20px;
    padding-top: 18px;
  }

  .secure-note-checklist-head {
    align-items: center;
    gap: 10px;
  }

  .secure-note-add-task {
    min-height: 34px;
    padding: 6px 10px;
    font-size: 12px;
  }

  .secure-note-task {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 10px;

    padding: 12px;
    border-radius: 12px;
  }

  .secure-note-task-check {
    width: 27px;
    height: 27px;
  }

  .secure-note-task-side {
    grid-column: 2;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-top: 2px;
  }

  .secure-note-task-title {
    font-size: 13px;
  }

  .secure-note-task-meta {
    display: grid;
    gap: 3px;
    margin-top: 6px;
  }

  .secure-note-task-status {
    min-height: 22px;
  }

  .secure-note-task-empty {
    min-height: 90px;
    padding: 18px 14px;
  }

  .secure-note-task-modal {
    max-width: none;
  }
}


/* ---------- VERY SMALL MOBILE ---------- */

@media (max-width: 420px) {

  .secure-note-checklist-head {
    align-items: flex-start;
  }

  .secure-note-task-progress {
    font-size: 11px;
  }

  .secure-note-add-task {
    padding-left: 9px;
    padding-right: 9px;
  }

  .secure-note-task {
    padding: 11px;
  }
}

/* =========================================================
   MONCEDA VAULT V3.3.2 — FINANCE CONTINUE VIEWING
   ========================================================= */

.finance-continue-viewing{
  width:100%;
  min-height:42px;
  margin-top:12px;
  padding:10px 14px;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;

  border:1px solid var(--line);
  border-radius:12px;

  background:rgba(255,255,255,.018);
  color:var(--muted);

  font:inherit;
  font-size:12px;
  font-weight:700;

  cursor:pointer;
  transition:
    border-color .18s ease,
    background .18s ease,
    color .18s ease;
}

.finance-continue-viewing:hover{
  color:var(--text);
  border-color:rgba(52,211,153,.32);
  background:rgba(52,211,153,.055);
}

.finance-continue-viewing small{
  font-size:10px;
  font-weight:700;
  opacity:.7;
}

.finance-continue-viewing[aria-expanded="true"]{
  color:var(--muted);
}

@media(max-width:760px){
  .finance-continue-viewing{
    min-height:44px;
    margin-top:10px;
  }
}

/* =========================================================
   MONCEDA VAULT V3.3.3 — FINANCE COLLAPSE WRAPPER
   ========================================================= */

.finance-continue-viewing-wrap{
  width:100%;
}

.finance-account-list > [hidden],
.finance-recurring-list > [hidden],
.finance-ledger-list > [hidden],
.finance-budget-card-grid > [hidden],
.finance-bill-list > [hidden],
.finance-goals-grid > [hidden],
.finance-investment-grid > [hidden]{
  display:none !important;
}


/* =========================================================
   MONCEDA VAULT V3.4 — ENCRYPTED ACTIVITY CENTER
   ========================================================= */

.activity-center {
  display: grid;
  gap: 18px;
  width: 100%;
}

.activity-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px;
}

.activity-summary h2 {
  margin: 5px 0 7px;
}

.activity-summary p {
  margin: 0;
  max-width: 680px;
  color: var(--muted);
  line-height: 1.6;
}

.activity-summary-count {
  min-width: 120px;
  padding: 16px 20px;
  border: 1px solid var(--border);
  border-radius: 16px;
  text-align: center;
  background: rgba(255,255,255,.025);
}

.activity-summary-count strong {
  display: block;
  font-size: 28px;
  line-height: 1;
}

.activity-summary-count span {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 12px;
}

.activity-panel {
  overflow: hidden;
}

.activity-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 22px;
  border-bottom: 1px solid var(--border);
}

.activity-panel-head h3 {
  margin: 4px 0 0;
}

.activity-private-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.activity-timeline {
  display: grid;
}

.activity-row {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 74px;
  padding: 14px 22px;
  border-bottom: 1px solid var(--border);
}

.activity-row:last-child {
  border-bottom: 0;
}

.activity-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(255,255,255,.035);
  font-weight: 800;
}

.activity-copy {
  min-width: 0;
}

.activity-copy strong,
.activity-copy span {
  display: block;
}

.activity-copy strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.activity-copy span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.activity-row time {
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}

.activity-empty {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 60px 24px;
  text-align: center;
}

.activity-empty > div {
  font-size: 30px;
}

.activity-empty span {
  max-width: 440px;
  color: var(--muted);
  line-height: 1.55;
}

.activity-security-note {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  border: 1px solid var(--border);
  border-radius: 14px;
}

.activity-security-note strong {
  white-space: nowrap;
}

.activity-security-note span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}


@media (max-width: 760px) {

  .activity-summary {
    align-items: stretch;
    flex-direction: column;
  }

  .activity-summary-count {
    width: 100%;
  }

  .activity-row {
    grid-template-columns: 38px minmax(0,1fr);
  }

  .activity-row time {
    grid-column: 2;
    white-space: normal;
  }

  .activity-security-note {
    align-items: flex-start;
    flex-direction: column;
  }

  .activity-security-note strong {
    white-space: normal;
  }
}



/* =========================================================
   MONCEDA VAULT V3.4.1 — ACTIVITY CENTER V2
   ========================================================= */

.activity-toolbar {
  display: grid;
  gap: 12px;
  padding: 16px 22px;
  border-bottom: 1px solid var(--border);
}

.activity-search {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
}

.activity-search span {
  color: var(--muted);
}

.activity-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
}

.activity-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.activity-filter {
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}

.activity-filter:hover,
.activity-filter.active {
  border-color: rgba(52,211,153,.34);
  background: rgba(52,211,153,.08);
  color: var(--text);
}

.activity-date-group {
  display: grid;
}

.activity-date-group +
.activity-date-group {
  border-top: 1px solid var(--border);
}

.activity-date-label {
  padding: 10px 22px;
  background: rgba(255,255,255,.018);
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.activity-icon-finance,
.activity-icon-bill {
  color: #6ee7b7;
}

.activity-icon-task {
  color: #86efac;
}

.activity-icon-note {
  color: #fbbf24;
}

.activity-icon-calendar {
  color: #93c5fd;
}

.activity-icon-credential {
  color: #c4b5fd;
}

.activity-icon-goal {
  color: #fcd34d;
}

.activity-icon-investment {
  color: #67e8f9;
}

.activity-continue {
  width: calc(100% - 44px);
  min-height: 42px;
  margin: 14px 22px 18px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(255,255,255,.018);
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.activity-continue:hover {
  border-color: rgba(52,211,153,.34);
  background: rgba(52,211,153,.055);
  color: var(--text);
}

@media(max-width:760px){

  .activity-toolbar {
    padding: 14px;
  }

  .activity-filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 3px;
  }

  .activity-filter {
    flex: 0 0 auto;
  }

  .activity-date-label {
    padding-left: 14px;
    padding-right: 14px;
  }

  .activity-continue {
    width: calc(100% - 28px);
    margin-left: 14px;
    margin-right: 14px;
  }
}


/* =========================================================
   MONCEDA VAULT V3.4.2 — ACTIVITY FINAL COMPACT LAYOUT
   ========================================================= */

.activity-center {
  display: grid;
  gap: 18px;
}

.activity-main-card {
  overflow: hidden;
}

.activity-main-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 22px;
  border-bottom: 1px solid var(--border);
}

.activity-main-copy {
  min-width: 0;
}

.activity-main-copy h2 {
  margin: 5px 0 5px;
}

.activity-main-copy p {
  margin: 0;
  max-width: 620px;
  color: var(--muted);
  line-height: 1.5;
}

.activity-main-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
}

.activity-main-card
.activity-summary-count {
  min-width: 94px;
  padding: 12px 15px;
}

.activity-main-card
.activity-summary-count strong {
  font-size: 24px;
}

.activity-main-card
.activity-toolbar {
  padding: 14px 22px;
}

.activity-main-card
.activity-search {
  min-height: 40px;
}

.activity-main-card
.activity-filters {
  gap: 6px;
}

.activity-main-card
.activity-filter {
  min-height: 29px;
  padding: 4px 10px;
}

.activity-main-card
.activity-date-label {
  padding-top: 9px;
  padding-bottom: 9px;
}

.activity-main-card
.activity-row {
  min-height: 66px;
}

.activity-main-card
.activity-copy {
  min-width: 0;
}

.activity-main-card
.activity-copy strong,
.activity-main-card
.activity-copy span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.activity-continue-wrap {
  padding: 14px 22px 18px;
  border-top: 1px solid var(--border);
}

.activity-main-card
.activity-continue {
  width: 100%;
  margin: 0;
}

.activity-security-note {
  margin-top: 0;
}


@media(max-width:760px){

  .activity-main-head {
    align-items: flex-start;
    padding: 18px 14px;
  }

  .activity-main-meta {
    flex-direction: column;
    align-items: flex-end;
  }

  .activity-main-card
  .activity-summary-count {
    min-width: 78px;
  }

  .activity-main-card
  .activity-toolbar {
    padding: 12px 14px;
  }

  .activity-continue-wrap {
    padding:
      12px
      14px
      14px;
  }
}


@media(max-width:520px){

  .activity-main-head {
    display: grid;
  }

  .activity-main-meta {
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .activity-main-card
  .activity-summary-count {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 5px;
  }

  .activity-main-card
  .activity-summary-count strong {
    font-size: 20px;
  }

  .activity-main-card
  .activity-summary-count span {
    font-size: 10px;
  }
}


/* =========================================================
   MONCEDA VAULT V3.4.3 — ACTIVITY EXTRA COMPACT
   ========================================================= */

.activity-main-head{
  padding:18px 20px;
  gap:18px;
}

.activity-main-copy h2{
  margin:3px 0 3px;
}

.activity-main-copy p{
  line-height:1.4;
  font-size:13px;
}

.activity-main-meta{
  gap:8px;
}

.activity-main-card
.activity-summary-count{
  min-width:82px;
  padding:10px 12px;
  border-radius:13px;
}

.activity-main-card
.activity-summary-count strong{
  font-size:22px;
}

.activity-main-card
.activity-summary-count span{
  margin-top:4px;
  font-size:10px;
}

.activity-private-pill{
  min-height:26px;
  padding:0 9px;
  font-size:10px;
}

.activity-main-card
.activity-toolbar{
  gap:9px;
  padding:11px 20px;
}

.activity-main-card
.activity-search{
  min-height:36px;
  border-radius:10px;
}

.activity-main-card
.activity-search input{
  font-size:12px;
}

.activity-main-card
.activity-filters{
  display:flex;
  flex-wrap:nowrap;
  gap:5px;
  overflow-x:auto;
  overflow-y:hidden;
  padding-bottom:2px;

  scrollbar-width:thin;
}

.activity-main-card
.activity-filter{
  flex:0 0 auto;
  min-height:26px;
  padding:3px 9px;
  font-size:10px;
}

.activity-main-card
.activity-date-label{
  padding:7px 20px;
  font-size:9px;
}

.activity-main-card
.activity-row{
  min-height:58px;
  padding:10px 20px;
  gap:11px;
  grid-template-columns:34px minmax(0,1fr) auto;
}

.activity-main-card
.activity-icon{
  width:32px;
  height:32px;
  border-radius:9px;
  font-size:12px;
}

.activity-main-card
.activity-copy strong{
  font-size:12px;
}

.activity-main-card
.activity-copy span{
  margin-top:2px;
  font-size:10px;
}

.activity-main-card
.activity-row time{
  font-size:10px;
}

.activity-continue-wrap{
  padding:10px 20px 12px;
}

.activity-main-card
.activity-continue{
  min-height:36px;
  font-size:11px;
}

.activity-security-note{
  padding:11px 15px;
  gap:10px;
}

.activity-security-note strong{
  font-size:12px;
}

.activity-security-note span{
  font-size:10px;
}


@media(max-width:760px){

  .activity-main-head{
    padding:15px 14px;
  }

  .activity-main-card
  .activity-toolbar{
    padding:10px 14px;
  }

  .activity-main-card
  .activity-date-label{
    padding-left:14px;
    padding-right:14px;
  }

  .activity-main-card
  .activity-row{
    padding:10px 14px;
    grid-template-columns:32px minmax(0,1fr);
  }

  .activity-main-card
  .activity-row time{
    grid-column:2;
    margin-top:-2px;
  }

  .activity-continue-wrap{
    padding:10px 14px 12px;
  }
}


/* =========================================================
   MONCEDA VAULT V3.4.4 — ACTIVITY WIDE COMPACT LAYOUT
   ========================================================= */

/*
 * Activity should use the Finance-style workspace width.
 * Keep rows vertically compact while removing the large
 * unused area on desktop.
 */

.activity-center{
  width:100%;
  max-width:none;
}

.activity-main-card{
  width:100%;
  max-width:none;
}

/* Main Activity header */
.activity-main-head{
  width:100%;
  padding:18px 22px;
}

/* Search / filter toolbar */
.activity-main-card .activity-toolbar{
  width:100%;
  padding:11px 22px;
}

.activity-main-card .activity-search{
  width:100%;
}

/*
 * Filters stay one compact horizontal row.
 * They may scroll horizontally on narrower screens.
 */
.activity-main-card .activity-filters{
  width:100%;
  display:flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:7px;
  overflow-x:auto;
  overflow-y:hidden;
  white-space:nowrap;
}

/* Timeline */
.activity-main-card .activity-date-label{
  padding:7px 22px;
}

.activity-main-card .activity-row{
  width:100%;
  min-height:56px;
  padding:9px 22px;
  grid-template-columns:
    34px
    minmax(220px,1fr)
    minmax(155px,auto);
}

/*
 * Keep dates aligned against the right edge instead
 * of clustering beside the activity description.
 */
.activity-main-card .activity-row time{
  justify-self:end;
  text-align:right;
  white-space:nowrap;
}

/* Bottom continue control */
.activity-continue-wrap{
  width:100%;
  padding:9px 22px 11px;
}

/* Security / derived note follows card width */
.activity-security-note{
  width:100%;
  max-width:none;
  margin-top:14px;
}


/* Desktop:
 * prevent the Activity workspace from inheriting an
 * older narrow content width.
 */
@media(min-width:1000px){

  .activity-center{
    max-width:1180px;
  }

  .activity-main-card{
    max-width:1180px;
  }

  .activity-security-note{
    max-width:1180px;
  }
}


/* Medium screens */
@media(max-width:999px){

  .activity-center,
  .activity-main-card,
  .activity-security-note{
    max-width:none;
  }
}


/* Mobile remains compact */
@media(max-width:760px){

  .activity-main-head{
    padding:15px 14px;
  }

  .activity-main-card .activity-toolbar{
    padding:10px 14px;
  }

  .activity-main-card .activity-date-label{
    padding:7px 14px;
  }

  .activity-main-card .activity-row{
    padding:9px 14px;
    grid-template-columns:
      32px
      minmax(0,1fr);
  }

  .activity-main-card .activity-row time{
    grid-column:2;
    justify-self:start;
    text-align:left;
    white-space:normal;
  }

  .activity-continue-wrap{
    padding:9px 14px 11px;
  }
}


/* =========================================================
   MONCEDA VAULT V3.4.5 — ACTIVITY WORKSPACE GRID FIX
   ========================================================= */

/*
 * Activity is a single-column workspace.
 * The generic Vault workspace reserves a right detail
 * column, which was causing the large empty area.
 */
.workspace.activity-workspace{
  grid-template-columns:minmax(0,1fr) !important;
  align-items:start;
}

.activity-workspace > .activity-center{
  grid-column:1 / -1;
  width:100%;
  max-width:none;
  min-width:0;
}

.activity-workspace .activity-main-card,
.activity-workspace .activity-security-note{
  width:100%;
  max-width:none;
}

/*
 * Override the previous temporary desktop cap.
 */
@media(min-width:1000px){
  .activity-workspace .activity-center,
  .activity-workspace .activity-main-card,
  .activity-workspace .activity-security-note{
    max-width:none;
  }
}

@media(max-width:760px){
  .workspace.activity-workspace{
    display:block;
  }
}


/* =========================================================
   MONCEDA VAULT V3.5 — RECOVERY HISTORY UI
   ========================================================= */

.vault-history-modal{
  width:min(760px,calc(100vw - 28px));
}

.vault-history-intro{
  display:grid;
  gap:5px;
  padding:14px;
  margin-bottom:12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}

.vault-history-intro span{
  color:var(--muted);
  font-size:12px;
  line-height:1.5;
}

.vault-history-status{
  margin-bottom:10px;
  color:var(--muted);
  font-size:11px;
}

.vault-history-list{
  display:grid;
  gap:8px;
}

.vault-history-row{
  display:grid;
  grid-template-columns:90px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.02);
}

.vault-history-revision,
.vault-history-meta{
  display:grid;
  gap:3px;
}

.vault-history-revision span,
.vault-history-meta span{
  color:var(--muted);
  font-size:9px;
  letter-spacing:.08em;
}

.vault-history-revision strong{
  font-size:17px;
}

.vault-history-meta strong{
  font-size:12px;
}

.vault-history-detail-modal{
  width:min(680px,calc(100vw - 28px));
}

.vault-history-verified{
  padding:11px 13px;
  margin-bottom:12px;
  border:1px solid rgba(88,214,141,.25);
  border-radius:12px;
  font-size:12px;
}

.vault-history-count-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}

.vault-history-count-grid > div{
  display:grid;
  gap:5px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.02);
}

.vault-history-count-grid span{
  color:var(--muted);
  font-size:9px;
}

.vault-history-count-grid strong{
  font-size:18px;
}

.vault-history-warning{
  display:grid;
  gap:4px;
  margin-top:12px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:12px;
}

.vault-history-warning span{
  color:var(--muted);
  font-size:11px;
  line-height:1.45;
}

@media(max-width:760px){

  .vault-history-row{
    grid-template-columns:72px minmax(0,1fr);
  }

  .vault-history-row > button{
    grid-column:1 / -1;
    width:100%;
  }

  .vault-history-count-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}

/* ==================================================
   MONCEDA VAULT V3.7 — PRIVATE LANDING EXPERIENCE
   ================================================== */

.vault-application {
  min-height: 100vh;
}

.vault-landing {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    radial-gradient(circle at 73% 38%, rgba(28,197,138,.11), transparent 25rem),
    radial-gradient(circle at 15% 12%, rgba(30,93,120,.16), transparent 30rem),
    #050b11;
  background-size:
    48px 48px,
    48px 48px,
    auto,
    auto,
    auto;
  color: #eef7f4;
}

.vault-landing::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(5,11,17,.25), transparent 45%, rgba(5,11,17,.08));
}

.vault-landing-glow {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(2px);
}

.vault-landing-glow-one {
  width: 520px;
  height: 520px;
  right: 6%;
  top: 13%;
  border: 1px solid rgba(46,230,166,.08);
  box-shadow:
    0 0 100px rgba(46,230,166,.035),
    inset 0 0 100px rgba(46,230,166,.025);
}

.vault-landing-glow-two {
  width: 260px;
  height: 260px;
  right: 15%;
  top: 28%;
  border: 1px solid rgba(46,230,166,.07);
}

.vault-landing-header {
  position: relative;
  z-index: 5;
  width: min(1440px, calc(100% - 72px));
  margin: 0 auto;
  min-height: 100px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,.055);
}

.vault-landing-brand {
  display: flex;
  align-items: center;
  gap: 13px;
  color: inherit;
  text-decoration: none;
}

.vault-landing-brand img {
  width: 48px;
  height: 48px;
}

.vault-landing-brand span {
  display: grid;
  gap: 3px;
}

.vault-landing-brand strong {
  font-size: 13px;
  letter-spacing: .22em;
}

.vault-landing-brand small {
  color: #2ee6a6;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .38em;
}

.vault-landing-status {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #718b84;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .17em;
}

.vault-landing-status span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2ee6a6;
  box-shadow: 0 0 14px rgba(46,230,166,.85);
}

.vault-landing-main {
  position: relative;
  z-index: 2;
  width: min(1440px, calc(100% - 72px));
  margin: auto;
  padding: 72px 0 82px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(440px, .85fr);
  gap: 80px;
  align-items: center;
}

.vault-landing-copy {
  max-width: 760px;
}

.vault-landing-eyebrow {
  margin-bottom: 22px;
  color: #2ee6a6;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .2em;
}

.vault-landing-copy h1 {
  margin: 0;
  max-width: 850px;
  color: #f3f8f6;
  font-size: clamp(3.6rem, 6.2vw, 7.3rem);
  font-weight: 760;
  line-height: .94;
  letter-spacing: -.065em;
}

.vault-landing-copy h1 span {
  color: #8ca099;
}

.vault-landing-lead {
  max-width: 650px;
  margin: 30px 0 0;
  color: #879ba5;
  font-size: clamp(1rem, 1.35vw, 1.18rem);
  line-height: 1.75;
}

.vault-landing-actions {
  margin-top: 38px;
}

.vault-open-button {
  min-width: 320px;
  min-height: 72px;
  display: grid;
  grid-template-columns: 38px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 11px 18px;
  border: 1px solid rgba(46,230,166,.45);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(35,213,151,.18), rgba(17,94,72,.28));
  color: #eafff7;
  box-shadow:
    0 18px 50px rgba(0,0,0,.28),
    inset 0 0 28px rgba(46,230,166,.035);
  text-align: left;
  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.vault-open-button:hover {
  transform: translateY(-2px);
  border-color: rgba(46,230,166,.8);
  box-shadow:
    0 22px 60px rgba(0,0,0,.34),
    0 0 32px rgba(46,230,166,.08);
}

.vault-open-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(46,230,166,.11);
  color: #2ee6a6;
}

.vault-open-button > span:nth-child(2) {
  display: grid;
  gap: 4px;
}

.vault-open-button strong {
  font-size: 14px;
}

.vault-open-button small {
  color: #7f9b91;
  font-size: 10px;
}

.vault-open-arrow {
  color: #2ee6a6;
  font-size: 21px;
}

.vault-landing-trust {
  margin-top: 28px;
  display: flex;
  gap: 22px;
  flex-wrap: wrap;
  color: #637a76;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.vault-security-visual {
  position: relative;
  min-height: 530px;
  display: grid;
  place-items: center;
}

.vault-security-orbit {
  position: absolute;
  border: 1px solid rgba(46,230,166,.11);
  border-radius: 50%;
}

.orbit-one {
  width: 230px;
  height: 230px;
}

.orbit-two {
  width: 360px;
  height: 360px;
  border-style: dashed;
}

.orbit-three {
  width: 490px;
  height: 490px;
  opacity: .55;
}

.vault-security-core {
  position: relative;
  z-index: 2;
  width: 155px;
  height: 155px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(46,230,166,.28);
  border-radius: 36px;
  background:
    radial-gradient(circle at 35% 25%, rgba(46,230,166,.18), transparent 60%),
    rgba(6,18,24,.9);
  box-shadow:
    0 0 0 18px rgba(46,230,166,.015),
    0 0 70px rgba(46,230,166,.12);
  transform: rotate(45deg);
}

.vault-security-core img {
  width: 92px;
  height: 92px;
  transform: rotate(-45deg);
}

.vault-security-node {
  position: absolute;
  z-index: 3;
  min-width: 130px;
  display: grid;
  gap: 4px;
  padding: 11px 14px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  background: rgba(6,16,23,.84);
  backdrop-filter: blur(12px);
  box-shadow: 0 15px 40px rgba(0,0,0,.25);
}

.vault-security-node span {
  color: #2ee6a6;
  font-size: 8px;
  letter-spacing: .15em;
}

.vault-security-node strong {
  color: #9fb0ac;
  font-size: 10px;
  letter-spacing: .04em;
}

.node-one { top: 9%; left: 5%; }
.node-two { top: 20%; right: 0; }
.node-three { bottom: 16%; left: 0; }
.node-four { right: 5%; bottom: 8%; }

.vault-landing-features {
  position: relative;
  z-index: 3;
  width: min(1440px, calc(100% - 72px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.vault-landing-features article {
  min-height: 118px;
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 15px;
  align-items: center;
  padding: 22px 30px;
  border-right: 1px solid rgba(255,255,255,.06);
}

.vault-landing-features article:first-child {
  padding-left: 0;
}

.vault-landing-features article:last-child {
  border-right: 0;
}

.vault-landing-features article > span {
  color: #2ee6a6;
  font-size: 9px;
  font-weight: 800;
}

.vault-landing-features article div {
  display: grid;
  gap: 6px;
}

.vault-landing-features strong {
  color: #d5e1dd;
  font-size: 12px;
}

.vault-landing-features p {
  margin: 0;
  color: #60747c;
  font-size: 10px;
  line-height: 1.55;
}

.vault-landing-footer {
  position: relative;
  z-index: 3;
  width: min(1440px, calc(100% - 72px));
  margin: 0 auto;
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #41544f;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .18em;
}

@media(max-width:1000px) {
  .vault-landing-main {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .vault-security-visual {
    min-height: 420px;
  }

  .orbit-three {
    width: 390px;
    height: 390px;
  }

  .vault-landing-features {
    grid-template-columns: 1fr;
  }

  .vault-landing-features article {
    border-right: 0;
    border-bottom: 1px solid rgba(255,255,255,.06);
    padding-left: 0;
  }
}

@media(max-width:640px) {
  .vault-landing-header,
  .vault-landing-main,
  .vault-landing-features,
  .vault-landing-footer {
    width: calc(100% - 36px);
  }

  .vault-landing-header {
    min-height: 82px;
  }

  .vault-landing-main {
    padding: 58px 0 55px;
  }

  .vault-landing-copy h1 {
    font-size: clamp(3rem, 15vw, 4.7rem);
  }

  .vault-open-button {
    width: 100%;
    min-width: 0;
  }

  .vault-landing-trust {
    display: grid;
    gap: 10px;
  }

  .vault-security-visual {
    min-height: 330px;
    transform: scale(.78);
  }

  .vault-landing-features article {
    min-height: 100px;
  }
}

/* ==================================================
   MONCEDA VAULT V3.8 — ORGANIZED VAULT LOOP
   ================================================== */

.vault-section-heading {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-right: 3px;
}

.vault-section-heading > span {
  min-width: 0;
}

.vault-add-btn {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(46,230,166,.25);
  border-radius: 7px;
  background: rgba(46,230,166,.055);
  color: #55e6b1;
  cursor: pointer;
  font: inherit;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  transition:
    background .16s ease,
    border-color .16s ease,
    color .16s ease,
    transform .16s ease;
}

.vault-add-btn:hover {
  border-color: rgba(46,230,166,.55);
  background: rgba(46,230,166,.11);
  color: #8af1cb;
  transform: translateY(-1px);
}

.vault-nav-row {
  position: relative;
  grid-template-columns: minmax(0,1fr) 28px;
  gap: 3px;
  margin: 2px 0;
  border-radius: 9px;
}

.vault-nav-row.active-vault-row {
  background:
    linear-gradient(
      90deg,
      rgba(46,230,166,.035),
      transparent 82%
    );
}

.vault-nav-row .nav-item {
  width: 100%;
}

.vault-nav-main {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

.vault-nav-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vault-nav-row .count {
  min-width: 22px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  padding: 0 5px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 999px;
  background: rgba(255,255,255,.025);
  color: var(--muted);
  font-size: 9px;
}

.vault-nav-row .nav-item.active .count {
  border-color: rgba(46,230,166,.16);
  background: rgba(46,230,166,.07);
  color: #71e7bd;
}

.vault-menu-btn {
  width: 28px;
  height: 32px;
  border-radius: 7px;
  opacity: .28;
  font-size: 16px;
  transition:
    opacity .15s ease,
    background .15s ease,
    color .15s ease;
}

.vault-nav-row:hover .vault-menu-btn,
.vault-menu-btn:focus,
.active-vault-row .vault-menu-btn {
  opacity: .8;
}

.vault-nav-row::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 7px;
  bottom: 7px;
  width: 2px;
  border-radius: 999px;
  background: transparent;
}

.vault-nav-row.active-vault-row::before {
  background: #2ee6a6;
  box-shadow: 0 0 9px rgba(46,230,166,.3);
}

.sidebar .section-title {
  margin-top: 21px;
}

.sidebar .section-title:first-of-type {
  margin-top: 13px;
}

@media(max-width:900px) {
  .vault-add-btn {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  .vault-menu-btn {
    opacity: .75;
  }
}

/* ==================================================
   MONCEDA VAULT V3.9 — INSIDE DASHBOARD
   ================================================== */

.inside-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 0;
}

.inside-primary-nav {
  gap: 5px;
}

.inside-nav-item {
  min-height: 43px;
}

.inside-primary-nav .inside-nav-item.active {
  background:
    linear-gradient(
      90deg,
      rgba(46,230,166,.12),
      rgba(46,230,166,.035)
    );
  border-color: rgba(46,230,166,.12);
}

.inside-vault-picker {
  margin-top: 10px;
}

.inside-context-nav {
  margin-top: 2px;
}

.inside-quick-stats {
  margin-top: 4px;
}

.quick-stats-card {
  display: grid;
  gap: 0;
  padding: 9px 13px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background:
    linear-gradient(
      145deg,
      rgba(12,28,40,.86),
      rgba(6,17,26,.92)
    );
}

.quick-stats-card > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 34px;
  color: var(--muted);
  font-size: 11px;
}

.quick-stats-card strong {
  color: var(--text);
  font-size: 13px;
}

.quick-stats-card .quick-stat-secure {
  color: var(--green);
}

.inside-sidebar-footer {
  margin-top: auto;
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.inside-security-status {
  display: flex;
  align-items: center;
  gap: 10px;
}

.inside-security-dot {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  border-radius: 50%;
  background: var(--green);
  box-shadow:
    0 0 14px rgba(46,230,166,.55);
}

.inside-security-status div {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.inside-security-status strong {
  font-size: 11px;
  color: var(--text);
}

.inside-security-status small {
  color: var(--muted);
  font-size: 9px;
}

.inside-footer-actions {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 6px;
}

.inside-footer-btn {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
  color: var(--text);
  cursor: pointer;
}

.inside-footer-btn:hover {
  border-color: rgba(46,230,166,.28);
  background: rgba(46,230,166,.06);
}

.inside-utility-links {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
}

.inside-utility-links button {
  appearance: none;
  padding: 0;
  border: 0;
  background: transparent;
  color: #71857f;
  font: inherit;
  font-size: 9px;
  cursor: pointer;
}

.inside-utility-links button:hover {
  color: var(--green);
}

@media(min-width:901px) {
  .shell {
    grid-template-columns:
      264px
      minmax(0,1fr);
  }

  .sidebar {
    padding:
      22px
      16px
      16px;
    gap: 12px;
  }

  .sidebar .brand {
    padding-bottom: 8px;
  }
}

@media(max-width:900px) {
  .inside-sidebar-footer {
    padding-bottom: 12px;
  }
}


/* ==================================================
   MONCEDA VAULT V4.0 — SIDEBAR POLISH
   ================================================== */

@media(min-width:901px) {
  .shell {
    grid-template-columns:
      280px
      minmax(0,1fr);
  }

  .sidebar {
    padding: 24px 18px 18px;
    gap: 14px;
  }
}

.inside-nav {
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  scrollbar-width: thin;
}

.inside-primary-nav {
  margin-bottom: 8px;
}

.inside-primary-nav .inside-nav-item {
  min-height: 44px;
  padding: 0 12px;
  border-radius: 10px;
}

.inside-primary-nav .nav-icon {
  width: 21px;
  opacity: .8;
}

.inside-vault-picker {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.055);
}

.inside-vault-picker .section-title {
  margin-top: 0 !important;
}

.vault-nav-list {
  gap: 4px;
}

.vault-nav-row {
  min-height: 40px;
}

.vault-nav-row .nav-item {
  min-height: 40px;
  padding-top: 7px;
  padding-bottom: 7px;
}

.vault-nav-name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.inside-sidebar-footer {
  position: relative;
  flex: 0 0 auto;
  margin-top: 0;
  padding-top: 14px;
  background: rgba(5,14,22,.96);
}

.inside-security-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.inside-lock-button {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
  color: var(--text);
  cursor: pointer;
}

.inside-lock-button:hover {
  border-color: rgba(46,230,166,.28);
  background: rgba(46,230,166,.06);
}

.inside-footer-actions {
  grid-template-columns: repeat(3,minmax(0,1fr));
  margin-top: 2px;
}

.inside-footer-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 36px;
  font-size: 10px;
}

.inside-tools-menu {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 48px;
  z-index: 80;

  display: grid;
  padding: 7px;

  border: 1px solid var(--line);
  border-radius: 12px;

  background: rgba(7,18,27,.985);

  box-shadow:
    0 20px 55px rgba(0,0,0,.45);
}

.inside-tools-menu.hidden {
  display: none;
}

.inside-tools-menu button {
  width: 100%;
  padding: 10px 11px;
  border: 0;
  border-radius: 8px;

  background: transparent;
  color: #aab9b5;

  font: inherit;
  font-size: 11px;
  text-align: left;

  cursor: pointer;
}

.inside-tools-menu button:hover {
  color: var(--text);
  background: rgba(46,230,166,.07);
}


/* ==================================================
   MONCEDA VAULT V4.0 — HOME DROPDOWN NAVIGATION
   ================================================== */

.inside-home-group {
  display: grid;
  gap: 5px;
}

.inside-home-toggle {
  min-height: 44px;
  padding: 0 12px;
}

.inside-home-chevron {
  flex: 0 0 auto;
  margin-left: auto;
  color: #71857f;
  font-size: 13px;
  line-height: 1;
}

.inside-home-menu {
  display: grid;
  gap: 3px;
  padding-left: 14px;
  overflow: hidden;
}

.inside-home-menu.collapsed {
  display: none;
}

.inside-home-child {
  position: relative;
  min-height: 36px;
  padding:
    0
    10px
    0
    13px;
  border-radius: 8px;
  font-size: 12px;
}

.inside-home-child::before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  bottom: 7px;
  width: 1px;
  background: rgba(255,255,255,.055);
}

.inside-home-child.active {
  background:
    linear-gradient(
      90deg,
      rgba(46,230,166,.10),
      rgba(46,230,166,.025)
    );
  border-color: rgba(46,230,166,.1);
}

.inside-home-child.active::before {
  width: 2px;
  background: var(--green);
  box-shadow:
    0 0 8px rgba(46,230,166,.32);
}

.inside-child-mark {
  width: 14px;
  display: inline-block;
  color: #526861;
  font-size: 12px;
}

.inside-home-child.active .inside-child-mark {
  color: var(--green);
}

.inside-vault-picker {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.055);
}


/* ==================================================
   MONCEDA VAULT V4.1 — COMPACT PRIMARY ACTION
   ================================================== */

.hero .btn.primary,
.hero button.btn.primary {
  min-height: 36px;
  height: 36px;

  padding: 0 14px;

  border-radius: 8px;

  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;

  box-shadow:
    0 5px 16px rgba(46,230,166,.10);

  white-space: nowrap;
}

.hero .btn.primary:hover,
.hero button.btn.primary:hover {
  transform: translateY(-1px);

  box-shadow:
    0 7px 20px rgba(46,230,166,.15);
}

.hero .btn.primary:active,
.hero button.btn.primary:active {
  transform: translateY(0);
}

@media(max-width:700px) {
  .hero .btn.primary,
  .hero button.btn.primary {
    min-height: 34px;
    height: 34px;
    padding: 0 12px;
    font-size: 11px;
  }
}


/* ==================================================
   MONCEDA VAULT V4.2 — COMPACT WORKSPACE ACTIONS
   ================================================== */

.finance-workspace .btn.primary,
.finance-workspace-shell .btn.primary,
.finance-workspace button.btn.primary,
.finance-workspace-shell button.btn.primary {
  min-height: 36px;
  height: 36px;

  padding: 0 14px;

  border-radius: 8px;

  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;

  white-space: nowrap;

  box-shadow:
    0 5px 16px rgba(46,230,166,.10);
}

.finance-workspace .btn.primary:hover,
.finance-workspace-shell .btn.primary:hover,
.finance-workspace button.btn.primary:hover,
.finance-workspace-shell button.btn.primary:hover {
  transform: translateY(-1px);

  box-shadow:
    0 7px 20px rgba(46,230,166,.15);
}

.finance-workspace .btn.primary:active,
.finance-workspace-shell .btn.primary:active {
  transform: translateY(0);
}

@media(max-width:700px) {
  .finance-workspace .btn.primary,
  .finance-workspace-shell .btn.primary {
    min-height: 34px;
    height: 34px;
    padding: 0 12px;
    font-size: 11px;
  }
}

/* ==================================================
   MONCEDA VAULT V4.3 — FINANCE BUTTON SYSTEM
   ================================================== */

.finance-workspace-shell .btn.primary,
.finance-workspace-shell button.btn.primary {
  min-height: 34px;
  height: 34px;

  padding: 0 13px;

  border-radius: 8px;

  font-size: 11px;
  font-weight: 700;
  line-height: 1;

  white-space: nowrap;

  box-shadow:
    0 4px 13px rgba(46,230,166,.08);
}

.finance-workspace-shell .btn.primary:hover,
.finance-workspace-shell button.btn.primary:hover {
  transform: translateY(-1px);

  box-shadow:
    0 6px 17px rgba(46,230,166,.13);
}


/* Empty-state actions */
.finance-workspace-shell .empty .btn.primary,
.finance-workspace-shell .empty-state .btn.primary,
.finance-workspace-shell [class*="empty"] .btn.primary {
  min-height: 36px;
  height: 36px;

  padding: 0 15px;

  font-size: 11px;

  margin-top: 12px;
}


/* Keep finance headers visually balanced */
.finance-workspace-shell .panel-head .btn.primary,
.finance-workspace-shell .finance-section-head .btn.primary,
.finance-workspace-shell .finance-page-head .btn.primary {
  align-self: center;
}


/* Mobile */
@media(max-width:700px) {
  .finance-workspace-shell .btn.primary,
  .finance-workspace-shell button.btn.primary {
    min-height: 32px;
    height: 32px;

    padding: 0 11px;

    font-size: 10px;
  }

  .finance-workspace-shell .empty .btn.primary,
  .finance-workspace-shell .empty-state .btn.primary,
  .finance-workspace-shell [class*="empty"] .btn.primary {
    min-height: 34px;
    height: 34px;
  }
}


/* ==================================================
   MONCEDA VAULT V4.4 — FINANCE TAB NAVIGATION
   ================================================== */

.finance-workspace-nav,
.finance-nav,
.finance-tabs {
  display: inline-flex;
  align-items: center;
  gap: 4px;

  max-width: 100%;

  padding: 4px;

  border: 1px solid var(--line);
  border-radius: 11px;

  background:
    rgba(6,17,26,.72);

  overflow-x: auto;
  overflow-y: hidden;

  scrollbar-width: none;
}

.finance-workspace-nav::-webkit-scrollbar,
.finance-nav::-webkit-scrollbar,
.finance-tabs::-webkit-scrollbar {
  display: none;
}

.finance-workspace-nav button,
.finance-nav button,
.finance-tabs button {
  flex: 0 0 auto;

  min-height: 32px;

  padding: 0 13px;

  border: 1px solid transparent;
  border-radius: 8px;

  background: transparent;

  color: #849891;

  font-size: 11px;
  font-weight: 650;

  white-space: nowrap;

  cursor: pointer;

  transition:
    color .15s ease,
    background .15s ease,
    border-color .15s ease;
}

.finance-workspace-nav button:hover,
.finance-nav button:hover,
.finance-tabs button:hover {
  color: var(--text);

  background:
    rgba(255,255,255,.025);
}

.finance-workspace-nav button.active,
.finance-nav button.active,
.finance-tabs button.active,
.finance-workspace-nav button[aria-current="page"],
.finance-nav button[aria-current="page"],
.finance-tabs button[aria-current="page"] {
  color: #55e8b4;

  border-color:
    rgba(46,230,166,.10);

  background:
    rgba(46,230,166,.10);
}

@media(max-width:700px) {
  .finance-workspace-nav,
  .finance-nav,
  .finance-tabs {
    display: flex;
    width: 100%;
  }

  .finance-workspace-nav button,
  .finance-nav button,
  .finance-tabs button {
    min-height: 31px;
    padding: 0 11px;
    font-size: 10px;
  }
}


/* ==================================================
   MONCEDA VAULT V4.4 — FINANCE SUBNAV
   ================================================== */

.finance-subnav {
  display: inline-flex;
  align-items: center;
  gap: 4px;

  max-width: 100%;

  padding: 4px;

  border: 1px solid var(--line);
  border-radius: 11px;

  background: rgba(6,17,26,.72);

  overflow-x: auto;
  overflow-y: hidden;

  scrollbar-width: none;
}

.finance-subnav::-webkit-scrollbar {
  display: none;
}

.finance-subnav button {
  flex: 0 0 auto;

  min-height: 31px;

  padding: 0 12px;

  border: 1px solid transparent;
  border-radius: 8px;

  background: transparent;

  color: #849891;

  font-size: 10.5px;
  font-weight: 650;

  white-space: nowrap;

  cursor: pointer;

  transition:
    color .15s ease,
    background .15s ease,
    border-color .15s ease;
}

.finance-subnav button:hover {
  color: var(--text);
  background: rgba(255,255,255,.025);
}

.finance-subnav button.active {
  color: #55e8b4;

  border-color: rgba(46,230,166,.10);

  background:
    linear-gradient(
      180deg,
      rgba(46,230,166,.12),
      rgba(46,230,166,.07)
    );
}

@media(max-width:700px) {
  .finance-subnav {
    display: flex;
    width: 100%;
  }

  .finance-subnav button {
    min-height: 30px;
    padding: 0 10px;
    font-size: 10px;
  }
}

/* ==================================================
   MONCEDA VAULT V4.5 — FRONT PAGE MOTION SYSTEM
   ================================================== */

#vaultLanding {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

#vaultLanding::before,
#vaultLanding::after {
  content: "";
  position: absolute;
  inset: auto;
  pointer-events: none;
  z-index: -1;
}

#vaultLanding::before {
  width: 680px;
  height: 680px;
  top: -210px;
  right: -180px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(46,230,166,.10) 0%,
      rgba(46,230,166,.045) 34%,
      transparent 70%
    );

  filter: blur(4px);

  animation:
    vaultAmbientGlow 18s ease-in-out infinite alternate;
}

#vaultLanding::after {
  width: 560px;
  height: 560px;
  left: -220px;
  bottom: -230px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(70,130,180,.07) 0%,
      transparent 70%
    );

  animation:
    vaultAmbientGlowSecondary 22s ease-in-out infinite alternate;
}

@keyframes vaultAmbientGlow {
  from {
    transform:
      translate3d(0,0,0)
      scale(1);
    opacity: .72;
  }

  to {
    transform:
      translate3d(-42px,34px,0)
      scale(1.08);
    opacity: 1;
  }
}

@keyframes vaultAmbientGlowSecondary {
  from {
    transform:
      translate3d(0,0,0)
      scale(1);
    opacity: .45;
  }

  to {
    transform:
      translate3d(46px,-28px,0)
      scale(1.1);
    opacity: .72;
  }
}


/* ---------- Initial hero entrance ---------- */

#vaultLanding
[data-vault-motion="hero"] {
  opacity: 0;

  transform:
    translate3d(0,14px,0);

  transition:
    opacity .7s ease,
    transform .7s cubic-bezier(.2,.7,.2,1);
}

#vaultLanding.motion-ready
[data-vault-motion="hero"] {
  opacity: 1;

  transform:
    translate3d(0,0,0);
}

#vaultLanding
[data-vault-motion-delay="1"] {
  transition-delay: .08s;
}

#vaultLanding
[data-vault-motion-delay="2"] {
  transition-delay: .17s;
}

#vaultLanding
[data-vault-motion-delay="3"] {
  transition-delay: .28s;
}

#vaultLanding
[data-vault-motion-delay="4"] {
  transition-delay: .40s;
}

#vaultLanding
[data-vault-motion-delay="5"] {
  transition-delay: .52s;
}


/* ---------- Open My Vault micro interaction ---------- */

#openVaultLandingBtn {
  position: relative;
  overflow: hidden;

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}

#openVaultLandingBtn::after {
  content: "";

  position: absolute;
  inset: -1px;

  border-radius: inherit;

  pointer-events: none;

  box-shadow:
    0 0 0 rgba(46,230,166,0);

  animation:
    vaultCtaBreath 4.8s ease-in-out infinite;
}

#openVaultLandingBtn:hover {
  transform:
    translateY(-2px);

  box-shadow:
    0 12px 32px rgba(46,230,166,.14);
}

#openVaultLandingBtn:active {
  transform:
    translateY(0);
}

@keyframes vaultCtaBreath {
  0%,
  55%,
  100% {
    box-shadow:
      0 0 0 rgba(46,230,166,0);
  }

  72% {
    box-shadow:
      0 0 28px rgba(46,230,166,.10);
  }
}


/* ---------- Decorative visual float ---------- */

#vaultLanding
.vault-landing-orbit,
#vaultLanding
.vault-orbit,
#vaultLanding
.landing-orbit,
#vaultLanding
.vault-security-orbit {
  animation:
    vaultOrbitFloat 7.5s ease-in-out infinite;
  transform-origin: center;
  will-change: transform;
}

@keyframes vaultOrbitFloat {
  0%,
  100% {
    transform:
      translate3d(0,0,0);
  }

  50% {
    transform:
      translate3d(0,-7px,0);
  }
}


/* ---------- Slow orbit movement for decorative children ---------- */

#vaultLanding
[class*="orbit"]
[class*="node"],
#vaultLanding
[class*="security"]
[class*="node"] {
  animation:
    vaultNodeFloat 6.2s ease-in-out infinite;
}

#vaultLanding
[class*="orbit"]
[class*="node"]:nth-child(2n),
#vaultLanding
[class*="security"]
[class*="node"]:nth-child(2n) {
  animation-delay: -2.1s;
}

#vaultLanding
[class*="orbit"]
[class*="node"]:nth-child(3n),
#vaultLanding
[class*="security"]
[class*="node"]:nth-child(3n) {
  animation-delay: -4s;
}

@keyframes vaultNodeFloat {
  0%,
  100% {
    transform:
      translate3d(0,0,0);
  }

  50% {
    transform:
      translate3d(0,-5px,0);
  }
}


/* ---------- Scroll reveal ---------- */

#vaultLanding
[data-vault-reveal] {
  opacity: 0;

  transform:
    translate3d(0,16px,0);

  transition:
    opacity .65s ease,
    transform .65s cubic-bezier(.2,.7,.2,1),
    border-color .18s ease,
    box-shadow .18s ease;
}

#vaultLanding
[data-vault-reveal].is-visible {
  opacity: 1;

  transform:
    translate3d(0,0,0);
}


/* ---------- Feature card micro lift ---------- */

#vaultLanding
[data-vault-reveal].is-visible:hover {
  transform:
    translate3d(0,-3px,0);

  border-color:
    rgba(46,230,166,.16);

  box-shadow:
    0 14px 34px rgba(0,0,0,.18);
}


/* ---------- Security / status dot breathing ---------- */

#vaultLanding
.vault-status-dot,
#vaultLanding
.security-dot,
#vaultLanding
.trust-dot {
  animation:
    vaultStatusBreath 2.8s ease-in-out infinite;
}

@keyframes vaultStatusBreath {
  0%,
  100% {
    opacity: .7;

    box-shadow:
      0 0 0 rgba(46,230,166,0);
  }

  50% {
    opacity: 1;

    box-shadow:
      0 0 13px rgba(46,230,166,.32);
  }
}


/* ---------- Reduced motion ---------- */

@media(prefers-reduced-motion: reduce) {
  #vaultLanding::before,
  #vaultLanding::after,
  #openVaultLandingBtn::after,
  #vaultLanding
  .vault-landing-orbit,
  #vaultLanding
  .vault-orbit,
  #vaultLanding
  .landing-orbit,
  #vaultLanding
  .vault-security-orbit,
  #vaultLanding
  [class*="orbit"]
  [class*="node"],
  #vaultLanding
  [class*="security"]
  [class*="node"],
  #vaultLanding
  .vault-status-dot,
  #vaultLanding
  .security-dot,
  #vaultLanding
  .trust-dot {
    animation: none !important;
  }

  #vaultLanding
  [data-vault-motion="hero"],
  #vaultLanding
  [data-vault-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}


/* ==================================================
   MONCEDA VAULT V4.7 — SECURITY VISUAL MOTION
   ================================================== */


/* ---------- LARGE ORBITS ---------- */

#vaultLanding .vault-security-orbit {
  transform-origin: 50% 50%;
  will-change: rotate, opacity;
}

#vaultLanding .vault-security-orbit.orbit-one {
  animation:
    vaultOrbitOne 31s linear infinite;
}

#vaultLanding .vault-security-orbit.orbit-two {
  animation:
    vaultOrbitTwo 39s linear infinite;
}

#vaultLanding .vault-security-orbit.orbit-three {
  animation:
    vaultOrbitThree 47s linear infinite;
}


@keyframes vaultOrbitOne {
  from {
    rotate: 0deg;
    opacity: .82;
  }

  50% {
    opacity: 1;
  }

  to {
    rotate: 360deg;
    opacity: .82;
  }
}


@keyframes vaultOrbitTwo {
  from {
    rotate: 0deg;
    opacity: .68;
  }

  50% {
    opacity: .9;
  }

  to {
    rotate: -360deg;
    opacity: .68;
  }
}


@keyframes vaultOrbitThree {
  from {
    rotate: 0deg;
    opacity: .55;
  }

  50% {
    opacity: .78;
  }

  to {
    rotate: 360deg;
    opacity: .55;
  }
}


/* ---------- CENTER CORE ---------- */

#vaultLanding .vault-security-core {
  will-change: scale, filter;

  animation:
    vaultSecurityCoreBreath
    4.8s
    ease-in-out
    infinite;
}


@keyframes vaultSecurityCoreBreath {
  0%,
  100% {
    scale: 1;

    filter:
      drop-shadow(
        0 0 0
        rgba(46,230,166,0)
      );
  }

  50% {
    scale: 1.025;

    filter:
      drop-shadow(
        0 0 15px
        rgba(46,230,166,.16)
      );
  }
}


/* ---------- CENTER LOGO ---------- */

#vaultLanding
.vault-security-core img {
  animation:
    vaultCoreLogoBreath
    5.6s
    ease-in-out
    infinite;
}


@keyframes vaultCoreLogoBreath {
  0%,
  100% {
    opacity: .94;
    scale: 1;
  }

  50% {
    opacity: 1;
    scale: 1.035;
  }
}


/* ---------- SECURITY NODES ---------- */

#vaultLanding .vault-security-node {
  will-change: translate;

  animation:
    vaultSecurityNodeFloat
    6.8s
    ease-in-out
    infinite;
}


#vaultLanding
.vault-security-node.node-one {
  animation-delay: 0s;
}


#vaultLanding
.vault-security-node.node-two {
  animation-delay: -1.7s;
}


#vaultLanding
.vault-security-node.node-three {
  animation-delay: -3.4s;
}


#vaultLanding
.vault-security-node.node-four {
  animation-delay: -5.1s;
}


@keyframes vaultSecurityNodeFloat {
  0%,
  100% {
    translate: 0 0;
  }

  50% {
    translate: 0 -5px;
  }
}


/* ---------- NODE BORDER LIFE ---------- */

#vaultLanding
.vault-security-node {
  transition:
    border-color .25s ease,
    box-shadow .25s ease;
}


#vaultLanding
.vault-security-node:hover {
  border-color:
    rgba(46,230,166,.22);

  box-shadow:
    0 8px 26px
    rgba(0,0,0,.18);
}


/* ---------- REDUCED MOTION ---------- */

@media(prefers-reduced-motion: reduce) {

  #vaultLanding .vault-security-orbit,
  #vaultLanding .vault-security-core,
  #vaultLanding .vault-security-core img,
  #vaultLanding .vault-security-node {
    animation: none !important;
    rotate: 0deg !important;
    translate: 0 0 !important;
    scale: 1 !important;
  }

}

/* ==================================================
   MONCEDA VAULT V4.8 — VISIBLE SUBTLE ORBITAL MOTION
   ================================================== */


/* -----------------------------------------------
   ORBIT VISIBILITY
   Keep the existing geometry, only improve presence
   ----------------------------------------------- */

#vaultLanding .vault-security-orbit {
  transform-origin: 50% 50%;

  border-color:
    rgba(46,230,166,.105) !important;

  will-change:
    rotate,
    opacity,
    filter;
}


/* Inner orbit — most visible */

#vaultLanding
.vault-security-orbit.orbit-one {
  opacity: .72;

  border-color:
    rgba(46,230,166,.16) !important;

  filter:
    drop-shadow(
      0 0 5px
      rgba(46,230,166,.035)
    );

  animation:
    vaultV48OrbitOne
    28s
    linear
    infinite;
}


/* Middle orbit */

#vaultLanding
.vault-security-orbit.orbit-two {
  opacity: .52;

  border-color:
    rgba(46,230,166,.105) !important;

  animation:
    vaultV48OrbitTwo
    38s
    linear
    infinite;
}


/* Outer orbit — intentionally faint */

#vaultLanding
.vault-security-orbit.orbit-three {
  opacity: .34;

  border-color:
    rgba(46,230,166,.075) !important;

  animation:
    vaultV48OrbitThree
    52s
    linear
    infinite;
}


/* -----------------------------------------------
   INDEPENDENT ORBIT MOTION
   ----------------------------------------------- */

@keyframes vaultV48OrbitOne {

  0% {
    rotate: 0deg;
    opacity: .62;
  }

  25% {
    opacity: .78;
  }

  50% {
    rotate: 180deg;
    opacity: .68;
  }

  75% {
    opacity: .82;
  }

  100% {
    rotate: 360deg;
    opacity: .62;
  }

}


@keyframes vaultV48OrbitTwo {

  0% {
    rotate: 0deg;
    opacity: .42;
  }

  50% {
    rotate: -180deg;
    opacity: .62;
  }

  100% {
    rotate: -360deg;
    opacity: .42;
  }

}


@keyframes vaultV48OrbitThree {

  0% {
    rotate: 0deg;
    opacity: .27;
  }

  50% {
    rotate: 180deg;
    opacity: .42;
  }

  100% {
    rotate: 360deg;
    opacity: .27;
  }

}


/* -----------------------------------------------
   CORE LIGHT SWEEP
   ----------------------------------------------- */

#vaultLanding .vault-security-core {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}


/* moving reflected light */

#vaultLanding
.vault-security-core::after {
  content: "";

  position: absolute;

  width: 38%;
  height: 180%;

  top: -40%;
  left: -65%;

  pointer-events: none;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(130,255,215,.07),
      rgba(255,255,255,.09),
      rgba(130,255,215,.045),
      transparent
    );

  transform:
    rotate(18deg);

  filter:
    blur(3px);

  opacity: 0;

  animation:
    vaultV48CoreSweep
    9s
    ease-in-out
    infinite;

  z-index: 2;
}


@keyframes vaultV48CoreSweep {

  0%,
  62% {
    left: -65%;
    opacity: 0;
  }

  68% {
    opacity: .6;
  }

  82% {
    left: 130%;
    opacity: .28;
  }

  88%,
  100% {
    left: 130%;
    opacity: 0;
  }

}


/* Keep logo above the light sweep */

#vaultLanding
.vault-security-core img {
  position: relative;
  z-index: 3;
}


/* -----------------------------------------------
   SOFT CENTER ENERGY
   ----------------------------------------------- */

#vaultLanding
.vault-security-core {
  box-shadow:
    0 0 0 1px rgba(46,230,166,.05),
    0 0 30px rgba(46,230,166,.035);

  animation:
    vaultV48CoreEnergy
    5.4s
    ease-in-out
    infinite;
}


@keyframes vaultV48CoreEnergy {

  0%,
  100% {
    box-shadow:
      0 0 0 1px rgba(46,230,166,.045),
      0 0 24px rgba(46,230,166,.025);

    scale: 1;
  }

  50% {
    box-shadow:
      0 0 0 1px rgba(46,230,166,.09),
      0 0 38px rgba(46,230,166,.075);

    scale: 1.018;
  }

}


/* -----------------------------------------------
   REDUCED MOTION
   ----------------------------------------------- */

@media(prefers-reduced-motion: reduce) {

  #vaultLanding .vault-security-orbit,
  #vaultLanding .vault-security-core,
  #vaultLanding .vault-security-core::after {
    animation: none !important;
  }

  #vaultLanding .vault-security-orbit {
    rotate: 0deg !important;
  }

  #vaultLanding .vault-security-core {
    scale: 1 !important;
  }

  #vaultLanding
  .vault-security-core::after {
    display: none;
  }

}

/* =========================================================
   MY VAULTS — COLLAPSIBLE SIDEBAR GROUP
   ========================================================= */

.vault-section-heading{
  display:flex;
  align-items:center;
  gap:10px;
}

.vault-section-toggle{
  flex:1;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  text-align:left;
  cursor:pointer;
}

.vault-section-toggle-main{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px;
}

.vault-section-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  height:24px;
  padding:0 7px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:999px;
  color:var(--muted, #8fa3b5);
  font-size:12px;
  line-height:1;
}

.vault-section-chevron{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--muted, #8fa3b5);
  font-size:14px;
  transition:transform .18s ease;
}

.vault-section-toggle.collapsed .vault-section-chevron{
  transform:rotate(-90deg);
}

.vault-nav-list[hidden]{
  display:none !important;
}

/* =========================================================
   MY VAULTS — NATIVE CONTROL RESET + SIDEBAR INTEGRATION
   ========================================================= */

.inside-vault-picker .vault-section-heading{
  width:100%;
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.inside-vault-picker .vault-section-toggle{
  -webkit-appearance:none !important;
  appearance:none !important;

  flex:1 1 auto;
  min-width:0;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;

  margin:0;
  padding:4px 0;

  border:0 !important;
  border-radius:0;
  outline:0;

  background:none !important;
  box-shadow:none !important;

  color:#6f8393;
  font-family:inherit;
  font-size:11px;
  font-weight:inherit;
  line-height:1.2;
  letter-spacing:.15em;
  text-align:left;
  text-transform:uppercase;

  cursor:pointer;
}

.inside-vault-picker .vault-section-toggle:hover{
  background:none !important;
  color:#9aafbd;
}

.inside-vault-picker .vault-section-toggle:focus{
  outline:none;
}

.inside-vault-picker .vault-section-toggle:focus-visible{
  outline:1px solid rgba(46,230,166,.38);
  outline-offset:4px;
  border-radius:4px;
}

.inside-vault-picker .vault-section-toggle-main{
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
}

.inside-vault-picker .vault-section-count{
  min-width:20px;
  height:20px;
  padding:0 6px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  border:1px solid rgba(148,163,184,.12);
  border-radius:999px;

  background:rgba(255,255,255,.025);
  color:#8295a3;

  font-size:10px;
  font-weight:600;
  line-height:1;
  letter-spacing:0;
}

.inside-vault-picker .vault-section-chevron{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;

  color:#718694;
  font-size:11px;
  line-height:1;

  transition:
    transform .18s ease,
    color .18s ease;
}

.inside-vault-picker
.vault-section-toggle:hover
.vault-section-chevron{
  color:#9aafbd;
}

.inside-vault-picker
.vault-section-toggle.collapsed
.vault-section-chevron{
  transform:rotate(-90deg);
}

.inside-vault-picker .vault-add-btn{
  -webkit-appearance:none;
  appearance:none;
}
/* ==========================================================
   MONCEDA VAULT — FINAL MASTER UNLOCK EXPERIENCE
   ========================================================== */

.vault-security-stage{
  position:relative;
  isolation:isolate;
  min-height:100%;
  padding:
    clamp(30px,4vw,58px)
    24px
    112px;
  overflow:hidden;
  background:
    radial-gradient(
      circle at 50% 36%,
      rgba(22,128,85,.15),
      transparent 34%
    ),
    radial-gradient(
      circle at 83% 46%,
      rgba(28,184,123,.07),
      transparent 26%
    ),
    linear-gradient(
      180deg,
      #020a09 0%,
      #03100d 54%,
      #020908 100%
    );
}

.vault-security-ambient{
  position:absolute;
  inset:0;
  z-index:-2;
  overflow:hidden;
  pointer-events:none;
}

/* ---------- ambient wave ---------- */

.vault-security-stage .security-wave{
  position:absolute;
  left:-8%;
  top:25%;
  width:min(46vw,700px);
  height:320px;
  opacity:.42;
  filter:
    drop-shadow(0 0 12px rgba(56,242,163,.17));
}

.vault-security-stage .security-wave path{
  fill:none;
  stroke:rgba(74,242,172,.36);
  stroke-width:1.25;
  stroke-linecap:round;
  stroke-dasharray:8 10;
  animation:mvMasterWave 15s linear infinite;
}

.vault-security-stage .security-wave path:nth-child(2){
  opacity:.64;
  animation-duration:18s;
}

.vault-security-stage .security-wave path:nth-child(3){
  opacity:.40;
  animation-duration:21s;
}

/* ---------- network ---------- */

.vault-security-stage .security-node-network{
  position:absolute;
  right:2%;
  top:17%;
  width:min(32vw,450px);
  height:420px;
  opacity:.60;
}

.vault-security-stage .security-node-network::before,
.vault-security-stage .security-node-network::after{
  content:"";
  position:absolute;
  inset:7%;
  background:
    linear-gradient(
      35deg,
      transparent 22%,
      rgba(59,232,157,.20) 22.5%,
      transparent 23.2%,
      transparent 48%,
      rgba(59,232,157,.14) 48.5%,
      transparent 49.2%
    ),
    linear-gradient(
      145deg,
      transparent 32%,
      rgba(59,232,157,.16) 32.5%,
      transparent 33.2%,
      transparent 68%,
      rgba(59,232,157,.19) 68.5%,
      transparent 69.2%
    );
}

.vault-security-stage .security-node-network::after{
  transform:scale(.84) rotate(19deg);
  opacity:.68;
}

.vault-security-stage .security-node-network i{
  position:absolute;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#5af4ac;
  box-shadow:
    0 0 9px rgba(77,244,172,.85),
    0 0 21px rgba(77,244,172,.34);
  animation:mvMasterNode 3.8s ease-in-out infinite;
}

.vault-security-stage .security-node-network i:nth-child(1){left:12%;top:17%}
.vault-security-stage .security-node-network i:nth-child(2){left:34%;top:27%;animation-delay:-.6s}
.vault-security-stage .security-node-network i:nth-child(3){left:61%;top:15%;animation-delay:-1.2s}
.vault-security-stage .security-node-network i:nth-child(4){left:80%;top:39%;animation-delay:-1.8s}
.vault-security-stage .security-node-network i:nth-child(5){left:46%;top:54%;animation-delay:-2.4s}
.vault-security-stage .security-node-network i:nth-child(6){left:22%;top:73%;animation-delay:-3s}
.vault-security-stage .security-node-network i:nth-child(7){left:73%;top:79%;animation-delay:-3.4s}

/* ---------- floor ---------- */

.vault-security-stage .security-floor-grid{
  position:absolute;
  left:-10%;
  right:-10%;
  bottom:-13%;
  height:47%;
  opacity:.20;
  transform:
    perspective(680px)
    rotateX(66deg);
  transform-origin:center bottom;
  background-image:
    linear-gradient(
      rgba(51,224,151,.22) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(51,224,151,.22) 1px,
      transparent 1px
    );
  background-size:48px 48px;
  mask-image:
    linear-gradient(
      to bottom,
      transparent,
      #000 24%,
      #000 76%,
      transparent
    );
}

.vault-security-stage .security-floor-ring{
  position:absolute;
  left:50%;
  bottom:38px;
  width:min(78vw,760px);
  aspect-ratio:2.85/1;
  transform:translateX(-50%);
  border:1px solid rgba(75,255,180,.32);
  border-radius:50%;
  box-shadow:
    0 0 27px rgba(62,246,169,.14),
    inset 0 0 26px rgba(62,246,169,.07);
  animation:mvMasterPlatform 5s ease-in-out infinite;
}

.vault-security-stage .security-floor-ring::before,
.vault-security-stage .security-floor-ring::after{
  content:"";
  position:absolute;
  inset:12% 14%;
  border:1px solid rgba(75,255,180,.16);
  border-radius:50%;
}

.vault-security-stage .security-floor-ring::after{
  inset:27% 29%;
  opacity:.55;
}

/* ---------- particles ---------- */

.vault-security-stage .security-particle{
  position:absolute;
  width:3px;
  height:3px;
  border-radius:50%;
  background:#65f7b7;
  box-shadow:0 0 10px rgba(101,247,183,.8);
  opacity:.55;
  animation:mvMasterParticle 8s ease-in-out infinite;
}

.vault-security-stage .p1{left:8%;top:16%}
.vault-security-stage .p2{left:18%;top:50%;animation-delay:-2s}
.vault-security-stage .p3{left:34%;top:25%;animation-delay:-4s}
.vault-security-stage .p4{right:31%;top:18%;animation-delay:-1s}
.vault-security-stage .p5{right:18%;top:52%;animation-delay:-3s}
.vault-security-stage .p6{right:8%;top:31%;animation-delay:-5s}

/* ---------- card ---------- */

.vault-premium-lock-card{
  position:relative;
  width:min(100%,520px);
  margin:auto;
  padding:
    30px
    36px
    29px;
  overflow:hidden;
  border:1px solid rgba(75,255,183,.18);
  border-radius:18px;
  background:
    radial-gradient(
      circle at 50% 24%,
      rgba(36,205,135,.11),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      rgba(8,35,29,.96),
      rgba(3,20,17,.94)
    );
  box-shadow:
    0 28px 80px rgba(0,0,0,.46),
    0 0 42px rgba(32,212,140,.08),
    inset 0 1px rgba(255,255,255,.025);
  backdrop-filter:blur(18px);
}

.vault-premium-lock-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(
      120deg,
      transparent 28%,
      rgba(97,255,192,.03) 50%,
      transparent 72%
    );
}

/* ---------- compact brand ---------- */

.vault-premium-lock-card .brand{
  position:relative;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:11px;
  width:max-content;
  margin:0 0 8px;
}

.vault-premium-lock-card .brand .logo{
  width:45px;
  height:45px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
}

.vault-premium-lock-card .brand .logo img{
  width:100%;
  height:100%;
  object-fit:contain;
}

.vault-premium-lock-card .brand-wordmark{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  line-height:1;
}

.vault-premium-lock-card .brand-wordmark strong{
  color:#f6f8f7;
  font-size:16px;
  font-weight:800;
  letter-spacing:.16em;
}

.vault-premium-lock-card .brand-wordmark small{
  margin-top:5px;
  color:#d0a743;
  font-size:10px;
  font-weight:800;
  letter-spacing:.52em;
}

/* ---------- large radar lock ---------- */

.vault-lock-visual{
  position:relative;
  z-index:2;
  width:176px;
  height:176px;
  margin:8px auto 17px;
  display:grid;
  place-items:center;
  border-radius:50%;
}

.vault-lock-visual::before{
  content:"";
  position:absolute;
  inset:29px;
  border-radius:50%;
  background:
    radial-gradient(
      circle,
      rgba(63,242,163,.19),
      rgba(20,113,75,.04) 58%,
      transparent 72%
    );
  box-shadow:
    0 0 42px rgba(54,236,157,.14);
}

.vault-lock-orbit{
  position:absolute;
  border:1px solid rgba(72,242,169,.28);
  border-radius:50%;
  animation:mvMasterOrbit 10s linear infinite;
}

.vault-lock-orbit.orbit-a{
  inset:7px;
}

.vault-lock-orbit.orbit-b{
  inset:22px;
  border-style:dashed;
  opacity:.78;
  animation-duration:14s;
  animation-direction:reverse;
}

.vault-lock-orbit.orbit-c{
  inset:38px;
  opacity:.62;
  animation-duration:18s;
}

.vault-lock-visual .lock-core,
.vault-lock-visual .vault-lock-core{
  position:relative;
  z-index:3;
  filter:
    drop-shadow(0 0 12px rgba(62,239,161,.36))
    drop-shadow(0 0 28px rgba(62,239,161,.16));
}


/* ---------- final central lock geometry ---------- */

.vault-lock-core{
  position:relative;
  z-index:5;
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border:1px solid rgba(91,250,180,.22);
  border-radius:50%;
  background:
    radial-gradient(
      circle,
      rgba(63,242,163,.16),
      rgba(3,28,19,.72) 70%
    );
  box-shadow:
    0 0 18px rgba(63,242,163,.20),
    0 0 42px rgba(63,242,163,.09);
}

.vault-lock-body{
  position:relative;
  width:27px;
  height:23px;
  margin-top:8px;
  border:2px solid #69f4b2;
  border-radius:6px;
  background:rgba(2,18,13,.82);
  box-shadow:
    0 0 11px rgba(76,244,171,.30);
}

.vault-lock-body::before{
  content:"";
  position:absolute;
  left:50%;
  bottom:18px;
  width:17px;
  height:17px;
  transform:translateX(-50%);
  border:2px solid #69f4b2;
  border-bottom:0;
  border-radius:10px 10px 0 0;
}

.vault-lock-body::after{
  content:"";
  position:absolute;
  left:50%;
  top:7px;
  width:3px;
  height:7px;
  transform:translateX(-50%);
  border-radius:3px;
  background:#69f4b2;
  box-shadow:0 0 6px rgba(105,244,178,.65);
}

/* ---------- title ---------- */

.vault-premium-lock-card h1{
  position:relative;
  z-index:3;
  margin:0 0 8px;
  color:#f2f7f5;
  text-align:center;
  font-size:clamp(27px,3.2vw,36px);
  line-height:1.07;
  letter-spacing:-.03em;
}

.vault-premium-lock-card > p{
  position:relative;
  z-index:3;
  max-width:370px;
  margin:0 auto 21px;
  color:#8fa9a0;
  text-align:center;
  font-size:13px;
  line-height:1.58;
}

/* ---------- form ---------- */

.vault-premium-lock-card form{
  position:relative;
  z-index:3;
}

.vault-premium-lock-card input{
  width:100%;
  min-height:49px;
  padding:0 15px;
  border:1px solid rgba(93,150,131,.25);
  border-radius:8px;
  outline:none;
  background:rgba(1,12,10,.72);
  color:#f7faf8;
  font-size:16px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.02);
  transition:
    border-color .2s ease,
    box-shadow .2s ease,
    background .2s ease;
}

.vault-premium-lock-card input:focus{
  border-color:rgba(67,240,162,.72);
  background:rgba(2,18,14,.90);
  box-shadow:
    0 0 0 3px rgba(67,240,162,.09),
    0 0 22px rgba(67,240,162,.08);
}

.vault-password-field{
  position:relative;
}

.vault-password-field input{
  padding-right:68px;
}

.vault-password-eye{
  position:absolute;
  top:50%;
  right:9px;
  z-index:4;
  min-width:48px;
  padding:7px 8px;
  transform:translateY(-50%);
  border:0;
  border-radius:6px;
  background:transparent;
  color:#8fa9a0;
  font:700 11px/1 system-ui,-apple-system,sans-serif;
  cursor:pointer;
}

.vault-password-eye:hover,
.vault-password-eye:focus-visible{
  color:#43f0a2;
  background:rgba(67,240,162,.08);
  outline:none;
}

/* ---------- unlock CTA ---------- */

.vault-premium-lock-card .btn.primary{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:51px;
  margin-top:9px;
  padding:0 52px 0 22px;
  overflow:hidden;
  border:1px solid rgba(99,255,190,.54);
  border-radius:8px;
  background:
    linear-gradient(
      180deg,
      #4ceca4,
      #20c47b
    );
  color:#02140e;
  font-size:14px;
  font-weight:900;
  box-shadow:
    0 11px 28px rgba(25,201,121,.20),
    inset 0 1px rgba(255,255,255,.30);
}

.vault-premium-lock-card .btn.primary::before{
  content:"→";
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-52%);
  font-size:21px;
  font-weight:500;
}

.vault-premium-lock-card .btn.primary::after{
  content:"";
  position:absolute;
  top:-40%;
  left:-45%;
  width:34%;
  height:180%;
  transform:rotate(18deg);
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.27),
    transparent
  );
  animation:mvMasterButtonSweep 5.5s ease-in-out infinite;
}

/* ---------- restore ---------- */

.vault-premium-lock-card .lock-secondary{
  position:relative;
  z-index:3;
  margin-top:10px;
}

.vault-premium-lock-card .lock-secondary .btn{
  width:100%;
  min-height:44px;
  border:1px solid rgba(91,140,123,.20);
  border-radius:8px;
  background:rgba(3,18,15,.64);
  color:#8ba097;
  font-size:12px;
  font-weight:700;
}

.vault-premium-lock-card .lock-secondary .btn:hover{
  border-color:rgba(76,222,158,.32);
  color:#c3d5ce;
}

/* ---------- encryption panel ---------- */

.vault-premium-lock-card .lock-meta{
  position:relative;
  z-index:3;
  margin-top:14px;
  padding:13px 14px;
  border:1px solid rgba(75,255,183,.10);
  border-radius:8px;
  background:rgba(5,26,21,.66);
  color:#657d74;
  font-size:9px;
  line-height:1.55;
  text-align:center;
}

.vault-premium-lock-card .lock-meta strong{
  color:#91a89f;
}

/* ---------- trust rail ---------- */

.vault-trust-rail{
  position:absolute;
  z-index:4;
  left:50%;
  bottom:24px;
  width:min(calc(100% - 48px),980px);
  min-height:66px;
  transform:translateX(-50%);
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  overflow:hidden;
  border:1px solid rgba(75,255,183,.12);
  border-radius:11px;
  background:rgba(2,18,15,.68);
  box-shadow:
    0 18px 42px rgba(0,0,0,.22),
    inset 0 1px rgba(255,255,255,.018);
  backdrop-filter:blur(14px);
}

.vault-trust-rail > div{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
  padding:13px 18px;
  border-right:1px solid rgba(75,255,183,.09);
}

.vault-trust-rail > div:last-child{
  border-right:0;
}

.vault-trust-rail .security-trust-icon{
  flex:0 0 auto;
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border:1px solid rgba(75,255,183,.18);
  border-radius:50%;
  color:#58f0aa;
  font-size:12px;
  background:rgba(42,211,137,.055);
}

.vault-trust-rail p{
  min-width:0;
  margin:0;
}

.vault-trust-rail strong,
.vault-trust-rail small{
  display:block;
}

.vault-trust-rail strong{
  color:#cbd9d4;
  font-size:11px;
  font-weight:750;
}

.vault-trust-rail small{
  margin-top:3px;
  color:#627b72;
  font-size:9px;
  line-height:1.35;
}

/* ---------- animation ---------- */

@keyframes mvMasterWave{
  to{
    stroke-dashoffset:-180;
  }
}

@keyframes mvMasterNode{
  0%,100%{
    opacity:.35;
    transform:scale(.88);
  }
  50%{
    opacity:1;
    transform:scale(1.18);
  }
}

@keyframes mvMasterPlatform{
  0%,100%{
    opacity:.55;
    transform:translateX(-50%) scale(1);
  }
  50%{
    opacity:.88;
    transform:translateX(-50%) scale(1.025);
  }
}

@keyframes mvMasterParticle{
  0%,100%{
    transform:translate3d(0,0,0);
    opacity:.25;
  }
  50%{
    transform:translate3d(0,-18px,0);
    opacity:.82;
  }
}

@keyframes mvMasterOrbit{
  to{
    transform:rotate(360deg);
  }
}

@keyframes mvMasterButtonSweep{
  0%,68%{
    left:-45%;
  }
  88%,100%{
    left:122%;
  }
}

/* ---------- responsive ---------- */

@media(max-width:900px){
  .vault-security-stage{
    padding-bottom:34px;
  }

  .vault-trust-rail{
    position:relative;
    left:auto;
    bottom:auto;
    width:min(100%,520px);
    margin:24px auto 0;
    transform:none;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .vault-trust-rail > div:nth-child(2){
    border-right:0;
  }

  .vault-trust-rail > div:nth-child(-n+2){
    border-bottom:1px solid rgba(75,255,183,.09);
  }
}

@media(max-width:600px){
  .vault-security-stage{
    padding:18px 14px 24px;
  }

  .vault-security-stage .security-wave{
    left:-34%;
    width:94vw;
    opacity:.22;
  }

  .vault-security-stage .security-node-network{
    opacity:.23;
  }

  .vault-security-stage .security-floor-ring{
    width:120vw;
  }

  .vault-premium-lock-card{
    padding:24px 21px 23px;
    border-radius:15px;
  }

  .vault-lock-visual{
    width:150px;
    height:150px;
    margin-top:4px;
  }

  .vault-premium-lock-card h1{
    font-size:29px;
  }

  .vault-trust-rail{
    grid-template-columns:1fr;
  }

  .vault-trust-rail > div{
    border-right:0!important;
    border-bottom:1px solid rgba(75,255,183,.09);
  }

  .vault-trust-rail > div:last-child{
    border-bottom:0;
  }
}

@media(prefers-reduced-motion:reduce){
  .vault-security-stage .security-wave path,
  .vault-security-stage .security-node-network i,
  .vault-security-stage .security-floor-ring,
  .vault-security-stage .security-particle,
  .vault-lock-orbit,
  .vault-premium-lock-card .btn.primary::after{
    animation:none!important;
  }
}

/* ==========================================================
   MONCEDA VAULT — WEEKLY SAVINGS REPORT
   ========================================================== */

.finance-budget-head-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.finance-weekly-savings-trigger{
  border-color:rgba(61,224,159,.25);
  background:rgba(20,106,77,.15);
  color:#74dfae;
}

.finance-weekly-savings-trigger:hover{
  border-color:rgba(61,224,159,.42);
  background:rgba(20,126,88,.24);
  color:#b2f2d3;
}

.finance-weekly-savings-modal{
  position:fixed;
  inset:0;
  z-index:1400;
  display:grid;
  place-items:center;
  padding:24px;
}

.finance-weekly-savings-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,8,12,.80);
  backdrop-filter:blur(10px);
}

.finance-weekly-savings-dialog{
  position:relative;
  z-index:1;
  width:min(1040px,100%);
  max-height:min(88vh,900px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(72,227,166,.16);
  border-radius:18px;
  background:
    radial-gradient(
      circle at 90% 4%,
      rgba(31,190,127,.10),
      transparent 28%
    ),
    #081821;
  box-shadow:
    0 34px 100px rgba(0,0,0,.56);
}

.finance-weekly-savings-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  padding:24px 26px 20px;
  border-bottom:1px solid rgba(124,166,184,.12);
}

.finance-weekly-savings-head span{
  display:block;
  margin-bottom:6px;
  color:#4ce6aa;
  font-size:10px;
  font-weight:850;
  letter-spacing:.16em;
}

.finance-weekly-savings-head h3{
  margin:0;
  color:#f3f8f6;
  font-size:24px;
}

.finance-weekly-savings-head p{
  margin:7px 0 0;
  color:#8096a0;
  font-size:13px;
}

.finance-weekly-savings-close{
  width:38px;
  height:38px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:1px solid rgba(130,170,188,.16);
  border-radius:10px;
  background:rgba(255,255,255,.025);
  color:#93a7b0;
  font-size:22px;
  cursor:pointer;
}

.finance-weekly-savings-body{
  overflow:auto;
  padding:22px 26px 28px;
}

.finance-weekly-savings-summary{
  display:grid;
  grid-template-columns:
    repeat(
      auto-fit,
      minmax(170px,1fr)
    );
  gap:12px;
  margin-bottom:18px;
}

.finance-weekly-savings-summary > div{
  min-width:0;
  padding:16px;
  border:1px solid rgba(73,216,159,.11);
  border-radius:12px;
  background:rgba(7,31,39,.72);
}

.finance-weekly-savings-summary span,
.finance-weekly-savings-summary small{
  display:block;
  color:#718993;
  font-size:10px;
}

.finance-weekly-savings-summary span{
  margin-bottom:7px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.finance-weekly-savings-summary strong{
  display:block;
  color:#f1f7f5;
  font-size:22px;
}

.finance-weekly-savings-summary small{
  margin-top:4px;
}

.finance-weekly-savings-history{
  display:grid;
  gap:14px;
}

.finance-weekly-savings-pagination{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.finance-weekly-savings-plus{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:7px 16px 7px 8px;
  border:1px solid rgba(77,230,168,.28);
  border-radius:13px;
  background:rgba(8,32,39,.78);
  color:#dce8e5;
  cursor:pointer;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}

.finance-weekly-savings-plus:hover{
  transform:translateY(-1px);
  border-color:rgba(77,230,168,.55);
  background:rgba(10,43,48,.9);
}

.finance-weekly-savings-plus > span{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:10px;
  background:linear-gradient(145deg,#49e6aa,#19b979);
  color:#022219;
  font-size:24px;
  font-weight:500;
  line-height:1;
  box-shadow:0 8px 24px rgba(40,213,146,.18);
}

.finance-weekly-savings-plus > strong{
  font-size:12px;
}

.finance-weekly-savings-period-count{
  color:#708791;
  font-size:11px;
  font-weight:700;
}

.finance-weekly-savings-details{
  display:grid;
  gap:14px;
  padding:14px;
  border:1px solid rgba(79,226,166,.18);
  border-radius:14px;
  background:rgba(3,18,24,.62);
}

.finance-weekly-savings-details-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(112,157,174,.1);
}

.finance-weekly-savings-details-head span,
.finance-weekly-savings-details-head strong{
  display:block;
}

.finance-weekly-savings-details-head span{
  margin-bottom:5px;
  color:#4ce1a5;
  font-size:9px;
  font-weight:850;
  letter-spacing:.13em;
}

.finance-weekly-savings-details-head > div strong{
  color:#dce9e5;
  font-size:14px;
}

.finance-weekly-savings-details-head > strong{
  color:#7e949c;
  font-size:11px;
}

.finance-weekly-savings-week-picker{
  display:grid;
  gap:7px;
}

.finance-weekly-savings-week-picker > label{
  color:#718992;
  font-size:9px;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.finance-weekly-savings-week-picker > div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.finance-weekly-savings-week-picker select{
  width:min(100%,520px);
  min-height:44px;
  padding:0 42px 0 13px;
  border:1px solid rgba(113,157,174,.14);
  border-radius:10px;
  background:rgba(9,31,40,.7);
  color:#e5f4ef;
  font:700 12px/1.2 system-ui,-apple-system,sans-serif;
  cursor:pointer;
}

.finance-weekly-savings-week-picker select:focus{
  border-color:rgba(73,230,170,.5);
  outline:3px solid rgba(73,230,170,.08);
}

.finance-weekly-savings-week-picker > div > span{
  flex:0 0 auto;
  color:#718992;
  font-size:11px;
  font-weight:700;
}

.finance-weekly-savings-detail-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:12px;
}

.finance-weekly-savings-detail-grid > article{
  overflow:hidden;
  border:1px solid rgba(112,157,174,.12);
  border-radius:12px;
  background:rgba(7,28,36,.78);
}

.finance-weekly-savings-detail-grid article > header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  padding:14px 15px;
  border-bottom:1px solid rgba(112,157,174,.1);
}

.finance-weekly-savings-detail-grid header span,
.finance-weekly-savings-detail-grid header small{
  display:block;
  margin-bottom:4px;
  color:#718992;
  font-size:9px;
  font-weight:800;
  letter-spacing:.11em;
}

.finance-weekly-savings-detail-grid header > div:last-child{
  text-align:right;
}

.finance-weekly-savings-detail-grid header > div:last-child strong{
  color:#50e0a7;
}

.finance-weekly-savings-detail-totals{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:rgba(112,157,174,.08);
}

.finance-weekly-savings-detail-totals > div{
  padding:11px 12px;
  background:#071d25;
}

.finance-weekly-savings-detail-totals span,
.finance-weekly-savings-detail-totals strong{
  display:block;
}

.finance-weekly-savings-detail-totals span{
  margin-bottom:4px;
  color:#708791;
  font-size:9px;
}

.finance-weekly-savings-detail-totals strong{
  color:#d4e1de;
  font-size:11px;
}

.finance-weekly-savings-days{
  padding:8px 14px 12px;
}

.finance-weekly-savings-days > div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:9px 2px;
  border-bottom:1px solid rgba(112,157,174,.08);
}

.finance-weekly-savings-days > div:last-child{
  border-bottom:0;
}

.finance-weekly-savings-days > div > div:last-child{
  text-align:right;
}

.finance-weekly-savings-days strong,
.finance-weekly-savings-days span,
.finance-weekly-savings-days small{
  display:block;
}

.finance-weekly-savings-days strong{
  color:#d3dfdc;
  font-size:11px;
}

.finance-weekly-savings-days span,
.finance-weekly-savings-days small{
  color:#738992;
  font-size:10px;
}

.finance-weekly-savings-days .has-release > div:last-child span{
  color:#52dda7;
}

.finance-weekly-savings-days .no-release > div:last-child span{
  color:#c37e88;
}

.finance-weekly-savings-week{
  overflow:hidden;
  border:1px solid rgba(124,166,184,.12);
  border-radius:14px;
  background:rgba(5,23,31,.76);
}

.finance-weekly-savings-week.is-current{
  border-color:rgba(64,230,164,.24);
}

.finance-weekly-savings-week-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:16px 18px;
  border-bottom:1px solid rgba(124,166,184,.10);
}

.finance-weekly-savings-week-head span{
  display:block;
  margin-bottom:4px;
  color:#6f8791;
  font-size:9px;
  font-weight:800;
  letter-spacing:.12em;
}

.finance-weekly-savings-week-head strong{
  color:#e8f0ed;
  font-size:15px;
}

.finance-weekly-savings-total{
  text-align:right;
}

.finance-weekly-savings-total strong{
  color:#55e7aa;
  font-size:18px;
}

.finance-weekly-savings-grid{
  display:grid;
  grid-template-columns:
    repeat(
      auto-fit,
      minmax(250px,1fr)
    );
  gap:12px;
  padding:14px;
}

.finance-weekly-savings-grid article{
  padding:15px;
  border:1px solid rgba(111,154,173,.11);
  border-radius:11px;
  background:rgba(8,31,40,.66);
}

.finance-weekly-savings-person{
  margin-bottom:12px;
}

.finance-weekly-savings-person strong{
  color:#f2f6f5;
  font-size:15px;
}

.finance-weekly-savings-grid dl{
  margin:0;
}

.finance-weekly-savings-grid dl > div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:8px 0;
  border-top:1px solid rgba(120,158,173,.08);
}

.finance-weekly-savings-grid dl > div:first-child{
  border-top:0;
}

.finance-weekly-savings-grid dt{
  color:#738a94;
  font-size:11px;
}

.finance-weekly-savings-grid dd{
  margin:0;
  color:#c5d3d6;
  font-size:12px;
  font-weight:750;
}

.finance-weekly-savings-grid .remaining dd{
  color:#55e7aa;
  font-size:14px;
}

.finance-weekly-savings-empty{
  padding:38px 24px;
  text-align:center;
}

.finance-weekly-savings-empty strong,
.finance-weekly-savings-empty span{
  display:block;
}

.finance-weekly-savings-empty strong{
  color:#dce7e4;
  font-size:16px;
}

.finance-weekly-savings-empty span{
  max-width:420px;
  margin:8px auto 0;
  color:#728993;
  font-size:12px;
  line-height:1.6;
}

@media(max-width:700px){
  .finance-budget-head-actions{
    width:100%;
  }

  .finance-budget-head-actions .btn{
    flex:1 1 auto;
  }

  .finance-weekly-savings-modal{
    padding:10px;
  }

  .finance-weekly-savings-dialog{
    max-height:92vh;
    border-radius:14px;
  }

  .finance-weekly-savings-head{
    padding:19px 18px 16px;
  }

  .finance-weekly-savings-body{
    padding:16px 18px 20px;
  }

  .finance-weekly-savings-week-head{
    align-items:flex-start;
  }

  .finance-weekly-savings-grid{
    grid-template-columns:1fr;
  }

  .finance-weekly-savings-pagination{
    align-items:stretch;
    flex-direction:column;
  }

  .finance-weekly-savings-plus{
    width:100%;
  }

  .finance-weekly-savings-detail-grid{
    grid-template-columns:1fr;
  }

  .finance-weekly-savings-week-picker > div{
    align-items:stretch;
    flex-direction:column;
  }

  .finance-weekly-savings-details-head{
    align-items:flex-start;
    flex-direction:column;
  }

  .finance-weekly-savings-week-picker select{
    width:100%;
  }

  .finance-weekly-savings-detail-totals{
    grid-template-columns:1fr;
  }
}

/* ==================================================
   MY VAULTS — HEADER ALIGNMENT FIX
   ================================================== */

.inside-vault-picker .vault-section-heading {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 26px !important;
  align-items: center !important;
  gap: 8px !important;

  width: auto !important;
  min-width: 0;

  margin-left: 10px !important;
  margin-right: 10px !important;

  box-sizing: border-box;
}

.inside-vault-picker .vault-section-toggle {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.inside-vault-picker .vault-add-btn {
  position: static !important;
  justify-self: end;
  margin: 0 !important;
}

/* =========================================================
   MONCEDA VAULT — NAVIGATION SVG ICON SYSTEM
   Local, dependency-free interface icons.
   ========================================================= */

.vault-svg-icon {
  display: inline-grid;
  place-items: center;
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  color: #78968d;
  line-height: 1;
}

.vault-svg-icon svg {
  display: block;
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.nav-item:hover .vault-svg-icon {
  color: #a9c4bb;
}

.nav-item.active .vault-svg-icon,
.active-vault-row .nav-item.active .vault-svg-icon {
  color: var(--green);
}

.inside-home-child > span:first-child {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.inside-home-child .vault-svg-icon {
  width: 18px;
  height: 18px;
  flex-basis: 18px;
}

.inside-home-child .vault-svg-icon svg {
  width: 16px;
  height: 16px;
}

@media (max-width: 980px) {
  .vault-svg-icon {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
  }

  .vault-svg-icon svg {
    width: 18px;
    height: 18px;
  }
}

/* =========================================================
   MONCEDA VAULT — FOOTER ACTION & TOOLS MENU ICONS
   ========================================================= */

.inside-footer-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.inside-footer-btn .vault-svg-icon {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
}

.inside-footer-btn .vault-svg-icon svg {
  width: 15px;
  height: 15px;
  stroke-width: 1.65;
}

.inside-tools-menu {
  background: #091722;
  border: 1px solid rgba(151,181,172,.18);
  border-radius: 14px;
  padding: 7px;
  box-shadow:
    0 18px 45px rgba(0,0,0,.42),
    0 2px 10px rgba(0,0,0,.28);
}

.inside-tools-menu button {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 43px;
  gap: 11px;
  padding: 9px 11px;
  border-radius: 9px;
}

.inside-tools-menu button .vault-svg-icon {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}

.inside-tools-menu button .vault-svg-icon svg {
  width: 16px;
  height: 16px;
  stroke-width: 1.6;
}

.inside-tools-menu button > span:last-child {
  min-width: 0;
  text-align: left;
}

.inside-tools-menu button:hover .vault-svg-icon {
  color: var(--green);
}

.inside-tools-menu #changeMasterBtn {
  margin-top: 5px;
}

.inside-tools-menu #ownerLogoutBtn {
  position: relative;
  margin-top: 7px;
  padding-top: 11px;
}

.inside-tools-menu #ownerLogoutBtn::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 8px;
  right: 8px;
  height: 1px;
  background: rgba(151,181,172,.13);
}

.inside-tools-menu #ownerLogoutBtn:hover {
  background: rgba(255,255,255,.045);
}


/* MONCEDA VAULT — ACCOUNT FUNDING LEDGER */

.finance-account-funding-panel {
  display: grid;
  gap: 14px;
  margin: 18px 0 14px;
  padding: 15px;
  border: 1px solid rgba(46,230,166,.18);
  border-radius: 14px;
  background: rgba(46,230,166,.035);
}

.finance-account-funding-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.finance-account-funding-head > div {
  display: grid;
  gap: 3px;
}

.finance-account-funding-head > div > span {
  color: var(--green);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .12em;
}

.finance-account-funding-head > div > strong {
  font-size: 20px;
}

.finance-account-funding-head small,
.finance-account-funding-tally span,
.finance-funding-stat span,
.finance-funding-account span,
.finance-funding-preview span,
.finance-funds-history-row span {
  color: var(--muted);
  font-size: 9px;
}

.finance-account-funding-tally {
  display: grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap: 8px;
}

.finance-account-funding-tally > div,
.finance-funding-stat {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(0,0,0,.12);
}

.finance-account-funding-tally strong,
.finance-funding-stat strong {
  font-size: 11px;
}

.finance-funds-history {
  display: grid;
  gap: 8px;
}

.finance-funds-history-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.finance-funds-history-title strong {
  font-size: 11px;
}

.finance-funds-history-title span {
  color: var(--muted);
  font-size: 9px;
}

.finance-funds-history-list {
  display: grid;
  max-height: 240px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 11px;
}

.finance-funds-history-row {
  display: grid;
  grid-template-columns:
    minmax(0,1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 11px 12px;
  border-bottom: 1px solid var(--line);
}

.finance-funds-history-row:last-child {
  border-bottom: 0;
}

.finance-funds-history-row > div {
  display: grid;
  gap: 3px;
}

.finance-funds-history-row > div:last-child {
  justify-items: end;
}

.finance-funds-history-row
> div:first-child
> strong {
  color: var(--green);
  font-size: 11px;
}

.finance-funds-history-row small {
  color: #91a4b2;
  font-size: 9px;
}

.finance-funds-history-empty {
  padding: 11px 12px;
  border: 1px dashed var(--line);
  border-radius: 10px;
  color: var(--muted);
  font-size: 9px;
}

.finance-opening-balance-lock {
  display: block;
  margin-top: 6px;
  color: #8195a4;
  font-size: 9px;
}

.finance-editor-modal
input[name="balance"][readonly] {
  cursor: not-allowed;
  opacity: .72;
}

.finance-funding-account {
  display: grid;
  gap: 3px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(255,255,255,.018);
}

.finance-funding-account strong {
  font-size: 14px;
}

.finance-funding-account small {
  color: var(--muted);
  font-size: 9px;
}

.finance-funding-summary-grid {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 9px;
  margin: 12px 0 16px;
}

.finance-funding-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: -2px 0 14px;
  padding: 12px 14px;
  border: 1px solid rgba(46,230,166,.2);
  border-radius: 11px;
  background: rgba(46,230,166,.045);
}

.finance-funding-preview strong {
  color: var(--green);
  font-size: 15px;
}

@media(max-width:700px) {
  .finance-account-funding-head {
    align-items: stretch;
    flex-direction: column;
  }

  .finance-account-funding-head .btn {
    width: 100%;
  }

  .finance-account-funding-tally {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}

@media(max-width:440px) {
  .finance-funding-summary-grid,
  .finance-account-funding-tally {
    grid-template-columns: 1fr;
  }

  .finance-funds-history-row {
    grid-template-columns: 1fr;
  }

  .finance-funds-history-row
  > div:last-child {
    justify-items: start;
  }
}


/* ==========================================================
   MONCEDA VAULT — ACCOUNT FUNDS PROFESSIONAL LAYOUT
   ========================================================== */

.finance-account-funding-panel {
  display: grid;
  gap: 18px;
  margin: 22px 0 16px;
  padding: 20px;
  border: 1px solid rgba(46,230,166,.18);
  border-radius: 16px;
  background:
    linear-gradient(
      145deg,
      rgba(46,230,166,.055),
      rgba(8,25,36,.34)
    );
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025);
}


/* Header */

.finance-account-funding-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 17px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.finance-account-funding-head > div {
  display: grid;
  gap: 5px;
}

.finance-account-funding-head > div > span {
  color: var(--green);
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.finance-account-funding-head > div > strong {
  display: block;
  margin-top: 3px;
  font-size: clamp(24px,3vw,32px);
  line-height: 1.1;
  letter-spacing: -.025em;
  font-variant-numeric: tabular-nums;
}

.finance-account-funding-head > div > small {
  color: #91a4b2;
  font-size: 11px;
  line-height: 1.4;
}

.finance-account-funding-head .btn {
  flex: 0 0 auto;
  min-height: 42px;
  padding-inline: 18px;
  border-radius: 11px;
  font-size: 13px;
  font-weight: 800;
}


/* Summary cards */

.finance-account-funding-tally {
  display: grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap: 10px;
}

.finance-account-funding-tally > div {
  display: flex;
  min-width: 0;
  min-height: 76px;
  padding: 13px 14px;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid rgba(139,169,187,.14);
  border-radius: 12px;
  background: rgba(3,15,23,.30);
}

.finance-account-funding-tally > div:nth-child(4) {
  grid-column: 1 / -1;
  min-height: auto;
  flex-direction: row;
  align-items: center;
  padding-block: 11px;
}

.finance-account-funding-tally span {
  color: #8197a7;
  font-size: 10px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: .025em;
}

.finance-account-funding-tally strong {
  overflow-wrap: anywhere;
  color: #edf7fa;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.finance-account-funding-tally > div:nth-child(2) strong {
  color: var(--green);
}


/* Funds history */

.finance-funds-history {
  display: grid;
  gap: 10px;
  padding-top: 2px;
}

.finance-funds-history-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.finance-funds-history-title strong {
  color: #dcebef;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.finance-funds-history-title span {
  flex: 0 0 auto;
  padding: 4px 8px;
  border: 1px solid rgba(139,169,187,.13);
  border-radius: 999px;
  background: rgba(255,255,255,.025);
  color: #8197a7;
  font-size: 9px;
  font-weight: 700;
}

.finance-funds-history-list {
  display: grid;
  max-height: 260px;
  overflow: auto;
  border: 1px solid rgba(139,169,187,.14);
  border-radius: 12px;
  background: rgba(3,15,23,.22);
}

.finance-funds-history-row {
  display: grid;
  grid-template-columns:
    minmax(0,1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 13px 14px;
  border-bottom: 1px solid rgba(139,169,187,.11);
}

.finance-funds-history-row:last-child {
  border-bottom: 0;
}

.finance-funds-history-row > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.finance-funds-history-row > div:last-child {
  justify-items: end;
  text-align: right;
}

.finance-funds-history-row
> div:first-child
> strong {
  color: var(--green);
  font-size: 14px;
  line-height: 1.2;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}

.finance-funds-history-row span {
  color: #8197a7;
  font-size: 10px;
  line-height: 1.35;
}

.finance-funds-history-row small {
  overflow: hidden;
  color: #a1b2bd;
  font-size: 10px;
  line-height: 1.35;
  text-overflow: ellipsis;
}

.finance-funds-history-row
> div:last-child
> strong {
  color: #e7f1f4;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.finance-funds-history-empty {
  display: flex;
  min-height: 58px;
  align-items: center;
  justify-content: center;
  padding: 14px 16px;
  border: 1px dashed rgba(139,169,187,.17);
  border-radius: 11px;
  background: rgba(3,15,23,.18);
  color: #8197a7;
  font-size: 11px;
  text-align: center;
}


/* Opening balance locked helper */

.finance-opening-balance-lock {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 7px;
  color: #8195a4;
  font-size: 10px;
  line-height: 1.4;
}


/* Tablet */

@media(max-width:700px) {

  .finance-account-funding-panel {
    padding: 16px;
  }

  .finance-account-funding-head {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  .finance-account-funding-head .btn {
    width: 100%;
  }

  .finance-account-funding-tally {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .finance-account-funding-tally > div:nth-child(4) {
    grid-column: auto;
    min-height: 76px;
    align-items: flex-start;
    flex-direction: column;
  }
}


/* Mobile */

@media(max-width:440px) {

  .finance-account-funding-panel {
    gap: 15px;
    margin-inline: 0;
    padding: 14px;
    border-radius: 14px;
  }

  .finance-account-funding-head > div > strong {
    font-size: 25px;
  }

  .finance-account-funding-tally {
    grid-template-columns: 1fr;
  }

  .finance-account-funding-tally > div,
  .finance-account-funding-tally > div:nth-child(4) {
    min-height: auto;
    padding: 12px;
  }

  .finance-funds-history-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .finance-funds-history-row > div:last-child {
    justify-items: start;
    text-align: left;
    padding-top: 8px;
    border-top: 1px solid rgba(139,169,187,.10);
  }
}


/* MONCEDA VAULT — COLLAPSIBLE FUNDS HISTORY */

.finance-funds-history-row[hidden] {
  display: none !important;
}

.finance-funds-history-toggle {
  width: 100%;
  min-height: 38px;
  margin-top: 2px;
  border: 1px solid rgba(139,169,187,.14);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
  color: #a8bac5;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .025em;
  cursor: pointer;
  transition:
    border-color .18s ease,
    background .18s ease,
    color .18s ease;
}

.finance-funds-history-toggle:hover {
  border-color: rgba(46,230,166,.28);
  background: rgba(46,230,166,.055);
  color: var(--green);
}

.finance-funds-history-toggle:focus-visible {
  outline: 2px solid rgba(46,230,166,.4);
  outline-offset: 2px;
}

/* =========================================================
   MONCEDA VAULT — COMPACT FINANCE MODAL ACTIONS
   ========================================================= */

.finance-account-funding-head #financeAccountAddFundsBtn {
  min-height: 40px;
  padding: 8px 18px;
  font-size: 14px;
  line-height: 1.2;
  border-radius: 10px;
}

.modal .modal-actions .btn,
.modal .modal-footer .btn {
  min-height: 42px;
  padding: 9px 18px;
  font-size: 14px;
  line-height: 1.2;
  border-radius: 10px;
}

@media (max-width: 640px) {
  .finance-account-funding-head #financeAccountAddFundsBtn {
    min-height: 38px;
    padding: 8px 14px;
    font-size: 13px;
  }

  .modal .modal-actions .btn,
  .modal .modal-footer .btn {
    min-height: 40px;
    padding: 8px 14px;
    font-size: 13px;
  }
}

/* =========================================================
   MONCEDA VAULT — FINANCE ACCOUNT MODAL 100% ZOOM FIT
   ========================================================= */

.finance-account-modal .modal-card,
.modal.finance-account-modal .modal-card {
  width: min(760px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
}

.finance-account-modal .modal-body,
.modal.finance-account-modal .modal-body {
  padding-top: 16px;
  padding-bottom: 16px;
  overflow-y: auto;
}

.finance-account-modal .form-grid,
.modal.finance-account-modal .form-grid {
  gap: 12px 14px;
}

.finance-account-modal label,
.modal.finance-account-modal label {
  margin-bottom: 4px;
}

.finance-account-modal input,
.finance-account-modal select,
.finance-account-modal textarea,
.modal.finance-account-modal input,
.modal.finance-account-modal select,
.modal.finance-account-modal textarea {
  min-height: 40px;
}

.finance-account-modal textarea,
.modal.finance-account-modal textarea {
  min-height: 78px;
}

.finance-account-funding-panel {
  margin-top: 14px;
  padding: 16px;
  gap: 14px;
}

.finance-account-funding-head {
  padding-bottom: 12px;
}

.finance-account-funding-tally {
  gap: 10px;
}

.finance-account-funding-tally > div {
  padding: 12px 14px;
}

.finance-funds-history {
  gap: 10px;
}

.finance-funds-history-list {
  max-height: 220px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.finance-funds-history-row {
  padding-top: 11px;
  padding-bottom: 11px;
}

.finance-account-modal .modal-footer,
.finance-account-modal .modal-actions,
.modal.finance-account-modal .modal-footer,
.modal.finance-account-modal .modal-actions {
  padding-top: 12px;
  padding-bottom: 12px;
}

@media (max-height: 800px) {
  .finance-account-modal .modal-card,
  .modal.finance-account-modal .modal-card {
    max-height: calc(100vh - 16px);
  }

  .finance-account-modal .modal-body,
  .modal.finance-account-modal .modal-body {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .finance-account-funding-panel {
    margin-top: 10px;
    padding: 14px;
    gap: 12px;
  }

  .finance-funds-history-list {
    max-height: 180px;
  }
}

@media (max-width: 640px) {
  .finance-account-modal .modal-card,
  .modal.finance-account-modal .modal-card {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
  }

  .finance-account-funding-panel {
    padding: 12px;
  }

  .finance-account-funding-tally {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   MONCEDA VAULT — FINANCE EDITOR FIXED FOOTER
   ========================================================= */

.modal.finance-editor-modal {
  display: flex;
  flex-direction: column;
  width: min(760px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  overflow: hidden;
}

.modal.finance-editor-modal > .modal-head {
  flex: 0 0 auto;
}

.modal.finance-editor-modal > form {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

.modal.finance-editor-modal .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-top: 16px;
  padding-bottom: 16px;
}

.modal.finance-editor-modal .modal-foot {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  margin-top: auto;
  padding: 12px 20px;
  background: #0a1722;
  border-top: 1px solid var(--line);
}

.modal.finance-editor-modal .finance-account-funding-panel {
  margin-top: 14px;
  padding: 16px;
  gap: 14px;
}

.modal.finance-editor-modal .finance-funds-history-list {
  max-height: 210px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

@media (max-height: 800px) {
  .modal.finance-editor-modal {
    max-height: calc(100vh - 16px);
  }

  .modal.finance-editor-modal .modal-body {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .modal.finance-editor-modal .finance-account-funding-panel {
    margin-top: 10px;
    padding: 14px;
    gap: 12px;
  }

  .modal.finance-editor-modal .finance-funds-history-list {
    max-height: 170px;
  }

  .modal.finance-editor-modal .modal-foot {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}

@media (max-width: 640px) {
  .modal.finance-editor-modal {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
  }
}

/* =========================================================
   MONCEDA VAULT — FINANCE EDITOR VIEWPORT HEIGHT FIX
   ========================================================= */

.modal.finance-editor-modal {
  height: min(860px, calc(100dvh - 32px));
  max-height: calc(100dvh - 32px);
  overflow: hidden;
}

.modal.finance-editor-modal > form {
  flex: 1 1 0;
  min-height: 0;
  overflow: hidden;
}

.modal.finance-editor-modal .modal-body {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
}

.modal.finance-editor-modal .modal-foot {
  flex: 0 0 auto;
  position: relative;
  inset: auto;
  margin: 0;
  visibility: visible;
  opacity: 1;
}

@media (max-height: 900px) {
  .modal.finance-editor-modal {
    height: calc(100dvh - 16px);
    max-height: calc(100dvh - 16px);
  }
}

@supports not (height: 100dvh) {
  .modal.finance-editor-modal {
    height: min(860px, calc(100vh - 32px));
    max-height: calc(100vh - 32px);
  }

  @media (max-height: 900px) {
    .modal.finance-editor-modal {
      height: calc(100vh - 16px);
      max-height: calc(100vh - 16px);
    }
  }
}

/* =========================================================
   MONCEDA VAULT — FINANCE EDITOR SINGLE SCROLL LAYOUT
   Final authority for finance editor viewport behavior.
   ========================================================= */

.modal.finance-editor-modal {
  display: flex !important;
  flex-direction: column !important;

  width: min(760px, calc(100vw - 32px)) !important;

  height: auto !important;
  max-height: calc(100dvh - 32px) !important;

  overflow: hidden !important;
}

.modal.finance-editor-modal > .modal-head {
  flex: 0 0 auto !important;
}

.modal.finance-editor-modal > form {
  display: flex !important;
  flex-direction: column !important;

  flex: 1 1 auto !important;
  min-height: 0 !important;

  overflow: hidden !important;
}

.modal.finance-editor-modal .modal-body {
  flex: 1 1 auto !important;

  min-height: 0 !important;
  max-height: none !important;

  overflow-x: hidden !important;
  overflow-y: auto !important;

  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.modal.finance-editor-modal .modal-foot {
  display: flex !important;

  flex: 0 0 auto !important;

  position: relative !important;
  inset: auto !important;

  margin: 0 !important;

  visibility: visible !important;
  opacity: 1 !important;

  z-index: 5;

  background: #0a1722;
  border-top: 1px solid var(--line);
}

@media (max-height: 900px) {
  .modal.finance-editor-modal {
    max-height: calc(100dvh - 16px) !important;
  }
}

@media (max-width: 700px) {
  .modal.finance-editor-modal {
    width: calc(100vw - 18px) !important;
    max-height: calc(100dvh - 18px) !important;
  }
}

@supports not (height: 100dvh) {
  .modal.finance-editor-modal {
    max-height: calc(100vh - 32px) !important;
  }

  @media (max-height: 900px) {
    .modal.finance-editor-modal {
      max-height: calc(100vh - 16px) !important;
    }
  }
}


/* =========================================================
   MONCEDA VAULT V3.3.3 — COLLAPSIBLE SECURE NOTE TASKS
   Presentation only. Vault task data remains untouched.
   ========================================================= */

.secure-note-task-disclosure {
  margin: 0;
}

.secure-note-task-disclosure > summary {
  list-style: none;
}

.secure-note-task-disclosure > summary::-webkit-details-marker {
  display: none;
}

.secure-note-task-disclosure .secure-note-checklist-head {
  align-items: center;
  margin-bottom: 0;
  cursor: pointer;
  user-select: none;
}

.secure-note-task-toggle {
  flex: 0 0 auto;

  min-height: 36px;
  padding: 7px 13px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 10px;

  background: rgba(255, 255, 255, 0.035);
  color: var(--text);

  font-size: 12px;
  font-weight: 700;
  line-height: 1;

  white-space: nowrap;

  transition:
    border-color 150ms ease,
    background 150ms ease;
}

.secure-note-task-disclosure
.secure-note-checklist-head:hover
.secure-note-task-toggle {
  border-color: rgba(148, 163, 184, 0.36);
  background: rgba(255, 255, 255, 0.055);
}

.secure-note-task-toggle-open {
  display: none;
}

.secure-note-task-disclosure[open]
.secure-note-task-toggle-closed {
  display: none;
}

.secure-note-task-disclosure[open]
.secure-note-task-toggle-open {
  display: inline;
}

.secure-note-task-panel {
  margin-top: 16px;
}

.secure-note-task-actions {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}

@media (max-width: 760px) {
  .secure-note-task-toggle {
    min-height: 34px;
    padding: 6px 10px;
    font-size: 12px;
  }

  .secure-note-task-panel {
    margin-top: 14px;
  }
}

@media (max-width: 420px) {
  .secure-note-task-disclosure
  .secure-note-checklist-head {
    align-items: flex-start;
  }

  .secure-note-task-toggle {
    padding-left: 9px;
    padding-right: 9px;
  }
}


/* =========================================================
   MONCEDA VAULT V3.3.5 — COLLAPSIBLE SECURE NOTES LIST
   Presentation only. Encrypted note records remain untouched.
   ========================================================= */

.secure-notes-list-toggle {
  width: 100%;
  min-height: 38px;

  margin-top: 9px;
  padding: 8px 12px;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 10px;

  background: rgba(255, 255, 255, 0.025);
  color: var(--muted);

  font: inherit;
  font-size: 12px;
  font-weight: 700;

  cursor: pointer;

  transition:
    border-color 150ms ease,
    background 150ms ease,
    color 150ms ease;
}

.secure-notes-list-toggle:hover {
  border-color: rgba(45, 212, 191, 0.30);
  background: rgba(45, 212, 191, 0.045);
  color: var(--text);
}

.secure-notes-list-toggle:focus-visible {
  outline: 2px solid rgba(45, 212, 191, 0.50);
  outline-offset: 2px;
}

@media (max-width: 760px) {
  .secure-notes-list-toggle {
    min-height: 40px;
    margin-top: 8px;
  }
}


/* =========================================================
   MONCEDA VAULT V3.3.6 — TASK DISCLOSURE POINTER CURSOR
   ========================================================= */

.secure-note-task-disclosure > summary,
.secure-note-task-disclosure .secure-note-checklist-head,
.secure-note-task-disclosure .secure-note-task-toggle,
.secure-note-task-disclosure .secure-note-task-toggle-closed,
.secure-note-task-disclosure .secure-note-task-toggle-open {
  cursor: pointer;
}

/* =========================================================
   MONCEDA VAULT V3.3.7 — MOBILE APP POLISH
   Presentation only.
   Installed PWA / mobile experience.
   Desktop remains unchanged.
   ========================================================= */

@media (max-width: 760px) {

  html,
  body {
    width: 100%;
    min-width: 0;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
  }

  body {
    overscroll-behavior-x: none;
  }

  #app,
  .shell,
  .main,
  .content {
    width: 100%;
    min-width: 0;
  }

  .shell {
    display: block !important;
    min-height: 100dvh !important;
    overflow: visible !important;
  }

  .main {
    min-height: 100dvh;
    overflow-x: hidden !important;
  }


  /* ---------- Native-style mobile drawer ---------- */

  .mobile-menu-overlay {
    display: block !important;
    position: fixed;
    inset: 0;
    z-index: 900;

    background: rgba(1, 7, 12, .68);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition:
      opacity 180ms ease,
      visibility 180ms ease;
  }

  body.mobile-menu-open {
    overflow: hidden !important;
  }

  body.mobile-menu-open .mobile-menu-overlay {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .sidebar {
    position: fixed !important;

    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;

    width: min(86vw, 340px) !important;
    height: 100dvh !important;
    min-height: 0 !important;
    max-height: 100dvh !important;

    padding:
      calc(14px + env(safe-area-inset-top, 0px))
      14px
      calc(14px + env(safe-area-inset-bottom, 0px)) !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    overscroll-behavior: contain;

    border-right: 1px solid rgba(148, 163, 184, .16) !important;
    border-bottom: 0 !important;

    background: rgba(6, 15, 23, .985) !important;

    box-shadow:
      24px 0 70px rgba(0, 0, 0, .52);

    transform: translate3d(-105%, 0, 0);

    transition:
      transform 220ms cubic-bezier(.2,.8,.2,1);

    z-index: 910;
  }

  body.mobile-menu-open .sidebar {
    transform: translate3d(0, 0, 0);
  }

  .sidebar .brand {
    min-height: 52px;
    padding:
      4px 52px 12px
      4px !important;
  }

  .mobile-close-menu {
    display: grid !important;

    position: absolute;
    top: calc(10px + env(safe-area-inset-top, 0px));
    right: 10px;

    width: 44px;
    height: 44px;

    place-items: center;

    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 13px;

    background: rgba(255, 255, 255, .035);
    color: #dce8e5;

    font-size: 17px;
    line-height: 1;

    z-index: 2;
  }

  .mobile-menu-btn {
    display: grid !important;

    width: 44px;
    height: 44px;
    min-width: 44px;

    padding: 0;

    place-items: center;

    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 13px;

    background: rgba(255, 255, 255, .035);
    color: var(--text);

    font-size: 20px;
    line-height: 1;
  }


  /* ---------- Sidebar touch UX ---------- */

  .nav-item,
  .inside-footer-btn,
  .inside-lock-button,
  .vault-add-btn,
  .vault-menu-btn,
  .vault-section-toggle {
    min-height: 44px;
  }

  .nav-item {
    border-radius: 12px;
  }

  .inside-nav {
    min-width: 0;
  }

  .inside-sidebar-footer {
    padding-bottom:
      env(safe-area-inset-bottom, 0px);
  }


  /* ---------- Compact mobile app bar ---------- */

  .topbar {
    position: sticky !important;
    top: 0 !important;

    z-index: 100 !important;

    display: grid !important;

    grid-template-columns:
      44px
      minmax(0, 1fr)
      auto;

    grid-template-rows:
      auto
      auto;

    align-items: center !important;

    gap:
      9px
      10px !important;

    width: 100%;

    height: auto !important;
    min-height: 0 !important;

    padding:
      calc(8px + env(safe-area-inset-top, 0px))
      14px
      10px !important;

    border-bottom:
      1px solid rgba(148, 163, 184, .13);

    background:
      rgba(7, 16, 25, .94) !important;

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }

  .topbar .mobile-menu-btn {
    grid-column: 1;
    grid-row: 1;
  }

  .top-actions {
    grid-column: 2 / 4;
    grid-row: 1;

    display: flex;
    align-items: center;
    justify-content: flex-end;

    min-width: 0;

    gap: 8px;
  }

  .status-pill {
    min-height: 40px;

    padding:
      0 10px;

    font-size: 11px;

    white-space: nowrap;
  }

  #lockTop {
    min-height: 40px;

    padding:
      0 11px;

    white-space: nowrap;
  }

  .global-search {
    grid-column: 1 / -1;
    grid-row: 2;

    width: 100% !important;
    min-width: 0;

    height: 44px;

    padding:
      0 12px !important;

    border-radius: 13px !important;

    background:
      rgba(7, 18, 28, .94) !important;
  }

  .global-search input {
    height: 42px !important;
    min-width: 0;

    font-size: 16px;
  }


  /* ---------- Main mobile content ---------- */

  .content {
    max-width: none !important;

    padding:
      16px
      14px
      calc(28px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .hero {
    align-items: flex-start !important;
    flex-direction: column !important;

    gap: 11px !important;

    margin-bottom: 16px !important;
  }

  .hero .eyebrow {
    margin-bottom: 5px !important;

    font-size: 9px;

    letter-spacing: .13em;
  }

  .hero h1 {
    margin: 0 !important;

    font-size: 25px !important;
    line-height: 1.12;

    letter-spacing: -.025em;
  }

  .hero p {
    margin:
      5px 0 0 !important;

    font-size: 13px;
    line-height: 1.45;
  }

  .hero .actions {
    width: 100%;

    display: grid;

    grid-template-columns:
      repeat(2, minmax(0, 1fr));

    gap: 8px;
  }

  .hero .actions .btn {
    width: 100%;
    min-height: 44px;

    justify-content: center;
  }


  /* ---------- Dashboard cards ---------- */

  .stats {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;

    gap: 10px !important;

    margin-bottom: 14px !important;
  }

  .stat {
    min-width: 0;

    padding: 14px !important;

    border-radius: 14px !important;

    box-shadow:
      0 10px 28px rgba(0, 0, 0, .16) !important;
  }

  .stat span {
    font-size: 11px;
  }

  .stat strong {
    margin-top: 6px !important;

    font-size: 22px !important;
    line-height: 1.15;

    overflow: hidden;

    text-overflow: ellipsis;
  }

  .workspace {
    grid-template-columns: 1fr !important;

    gap: 12px !important;

    min-width: 0;
  }

  .panel {
    min-width: 0;

    border-radius: 14px !important;

    box-shadow:
      0 12px 32px rgba(0, 0, 0, .17) !important;
  }

  .panel-head {
    align-items: stretch !important;
    flex-direction: column !important;

    gap: 11px !important;

    padding: 14px !important;
  }

  .panel-head .search {
    width: 100% !important;

    margin: 0 !important;
  }

  .filters {
    gap: 7px;

    padding:
      10px 14px !important;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;
  }

  .filters::-webkit-scrollbar {
    display: none;
  }

  .row {
    min-width: 0;
    min-height: 64px;

    padding:
      12px 14px !important;
  }


  /* ---------- General touch targets ---------- */

  .btn,
  .mini,
  .icon-btn {
    min-height: 44px;
  }

  .form-field input,
  .form-field select {
    min-height: 46px;
  }

  .form-field textarea {
    min-height: 100px;
  }

  .secure-note-task-toggle,
  .secure-notes-list-toggle {
    min-height: 44px !important;
  }


  /* ---------- Mobile forms / modals ---------- */

  .modal-backdrop {
    align-items: flex-end !important;

    padding:
      8px
      8px
      calc(8px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .modal {
    width: calc(100vw - 16px) !important;
    max-width: none !important;

    max-height:
      calc(
        100dvh
        - 16px
        - env(safe-area-inset-top, 0px)
        - env(safe-area-inset-bottom, 0px)
      ) !important;

    border-radius:
      20px !important;

    overflow-x: hidden;
  }

  .modal-head {
    min-height: 56px;

    padding:
      14px 16px !important;
  }

  .modal-body {
    padding:
      16px !important;
  }

  .modal-foot {
    gap: 8px !important;

    padding:
      12px
      16px
      calc(12px + env(safe-area-inset-bottom, 0px)) !important;

    flex-wrap: wrap;
  }

  .modal-foot .btn {
    flex:
      1 1 120px;

    min-height: 44px;
  }

  .grid2 {
    grid-template-columns:
      1fr !important;
  }

  .security-summary {
    grid-template-columns:
      1fr !important;

    gap: 8px !important;
  }

  .finance-account-funding-tally {
    grid-template-columns:
      1fr !important;
  }

  .finance-report-hero,
  .finance-report-card {
    border-radius:
      14px !important;
  }


  /* ---------- Toast ---------- */

  .toast {
    left: 12px !important;
    right: 12px !important;

    bottom:
      calc(
        12px
        + env(safe-area-inset-bottom, 0px)
      ) !important;

    width: auto;

    text-align: center;
  }
}


/* ---------- Small phones ---------- */

@media (max-width: 440px) {

  .sidebar {
    width: min(90vw, 330px) !important;
  }

  .topbar {
    padding-left:
      12px !important;

    padding-right:
      12px !important;
  }

  .content {
    padding-left:
      12px !important;

    padding-right:
      12px !important;
  }

  .status-pill {
    padding:
      0 8px;

    font-size: 10px;
  }

  #lockTop {
    padding:
      0 9px;

    font-size: 12px;
  }

  .hero .actions {
    grid-template-columns:
      1fr;
  }

  .stat {
    padding:
      12px !important;
  }

  .stat strong {
    font-size:
      20px !important;
  }
}


/* ---------- Installed app ---------- */

@media (display-mode: standalone) and (max-width: 760px) {

  html,
  body,
  #app,
  .shell,
  .main {
    min-height:
      100dvh;
  }

  body {
    background:
      var(--bg);
  }
}

/* =========================================================
   MONCEDA VAULT V3.3.8 — MOBILE FINANCE NAV
   Presentation only.
   Keeps all Finance sections accessible on narrow screens.
   Desktop remains unchanged.
   ========================================================= */

@media (max-width: 760px) {

  .finance-subnav {
    display: flex !important;
    grid-template-columns: none !important;

    align-items: center !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    gap: 8px !important;

    margin:
      0 0 14px !important;

    padding:
      2px 2px 8px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    scroll-snap-type: x proximity;
    scrollbar-width: none;

    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  .finance-subnav::-webkit-scrollbar {
    display: none !important;
  }

  .finance-subnav button {
    flex:
      0 0 auto !important;

    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;

    min-height: 44px !important;

    padding:
      0 14px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    white-space: nowrap !important;

    border-radius: 11px !important;

    scroll-snap-align: start;
  }

}


/* ---------- Small phones ---------- */

@media (max-width: 440px) {

  .finance-subnav {
    gap: 7px !important;

    margin-bottom:
      12px !important;

    padding-bottom:
      7px !important;
  }

  .finance-subnav button {
    min-height:
      44px !important;

    padding:
      0 12px !important;

    font-size:
      11px !important;
  }

}


/* =========================================================
   MONCEDA VAULT — WEEKLY SAVINGS TRANSFER
   ========================================================= */

.finance-weekly-savings-overall{
  position:relative;
}

.finance-weekly-savings-transfer-btn{
  width:100%;
  min-height:38px;
  margin-top:12px;
  padding:0 12px;

  border:
    1px solid rgba(72,227,166,.24);

  border-radius:9px;

  background:
    rgba(32,165,113,.11);

  color:#64e6ad;

  font:800 10px/1 system-ui,-apple-system,sans-serif;

  letter-spacing:.03em;

  cursor:pointer;

  transition:
    background .18s ease,
    border-color .18s ease,
    transform .18s ease;
}

.finance-weekly-savings-transfer-btn:hover:not(:disabled){
  transform:translateY(-1px);

  border-color:
    rgba(72,227,166,.48);

  background:
    rgba(32,165,113,.2);
}

.finance-weekly-savings-transfer-btn:disabled{
  opacity:.42;
  cursor:not-allowed;
}

.finance-weekly-savings-transfer-modal{
  z-index:1550!important;
}

.finance-weekly-savings-transfer-dialog{
  width:min(560px,100%)!important;
}

.finance-weekly-savings-transfer-balance{
  margin-bottom:18px;
  padding:16px;

  border:
    1px solid rgba(72,227,166,.18);

  border-radius:12px;

  background:
    linear-gradient(
      145deg,
      rgba(14,87,67,.26),
      rgba(7,29,38,.78)
    );
}

.finance-weekly-savings-transfer-balance span,
.finance-weekly-savings-transfer-balance small{
  display:block;
}

.finance-weekly-savings-transfer-balance span{
  margin-bottom:7px;

  color:#73a394;

  font-size:9px;
  font-weight:850;
  letter-spacing:.13em;
}

.finance-weekly-savings-transfer-balance strong{
  display:block;

  color:#50e0a7;

  font-size:25px;
  line-height:1.15;
}

.finance-weekly-savings-transfer-balance small{
  margin-top:5px;

  color:#748b94;

  font-size:10px;
}

.finance-weekly-savings-transfer-preview-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:10px;

  margin:14px 0;
}

@media(max-width:600px){

  .finance-weekly-savings-transfer-btn{
    min-height:44px;
  }

  .finance-weekly-savings-transfer-preview-grid{
    grid-template-columns:1fr;
  }

}

/* =========================================================
   MONCEDA VAULT — WEEKLY SAVINGS TRANSFER PROFESSIONAL POLISH
   ========================================================= */

.finance-weekly-savings-transfer-modal{
  padding:24px!important;
  background:rgba(1,8,12,.38);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.finance-weekly-savings-transfer-modal .finance-weekly-savings-transfer-dialog{
  width:min(620px,100%)!important;
  max-height:min(88dvh,820px)!important;
  overflow:hidden!important;

  border:1px solid rgba(109,181,166,.16)!important;
  border-radius:20px!important;

  background:
    radial-gradient(
      circle at 88% 0%,
      rgba(51,214,154,.08),
      transparent 32%
    ),
    linear-gradient(
      180deg,
      rgba(10,29,38,.99),
      rgba(6,20,28,.995)
    )!important;

  box-shadow:
    0 34px 90px rgba(0,0,0,.58),
    0 0 0 1px rgba(255,255,255,.015) inset!important;
}

.finance-weekly-savings-transfer-modal .modal-head{
  align-items:flex-start!important;
  gap:20px!important;

  padding:24px 26px 20px!important;

  border-bottom:
    1px solid rgba(117,160,176,.10)!important;
}

.finance-weekly-savings-transfer-modal .modal-head .eyebrow{
  margin:0 0 7px!important;

  color:#58dfaa!important;

  font-size:10px!important;
  font-weight:850!important;
  letter-spacing:.16em!important;
}

.finance-weekly-savings-transfer-modal .modal-head h3{
  margin:0!important;

  color:#f4f8f7!important;

  font-size:25px!important;
  line-height:1.12!important;
  letter-spacing:-.025em!important;
}

.finance-weekly-savings-transfer-modal .modal-head .muted{
  max-width:460px!important;
  margin:8px 0 0!important;

  color:#7f959e!important;

  font-size:12px!important;
  line-height:1.55!important;
}

.finance-weekly-savings-transfer-modal .modal-head .icon-btn{
  width:38px!important;
  height:38px!important;
  flex:0 0 38px!important;

  border:
    1px solid rgba(128,166,182,.14)!important;

  border-radius:11px!important;

  background:
    rgba(255,255,255,.025)!important;

  color:#8fa3ab!important;

  font-size:20px!important;
}

.finance-weekly-savings-transfer-modal .modal-body{
  overflow-y:auto!important;

  padding:22px 26px 24px!important;
}

.finance-weekly-savings-transfer-balance{
  position:relative;

  margin:0 0 22px!important;
  padding:19px 20px!important;

  overflow:hidden;

  border:
    1px solid rgba(74,222,164,.18)!important;

  border-radius:15px!important;

  background:
    linear-gradient(
      135deg,
      rgba(24,111,82,.24),
      rgba(8,35,42,.84)
    )!important;

  box-shadow:
    0 14px 34px rgba(0,0,0,.14)!important;
}

.finance-weekly-savings-transfer-balance::after{
  content:"";
  position:absolute;
  top:-55px;
  right:-35px;

  width:150px;
  height:150px;

  border-radius:50%;

  background:
    rgba(59,220,160,.07);

  pointer-events:none;
}

.finance-weekly-savings-transfer-balance span{
  margin-bottom:8px!important;

  color:#7ca493!important;

  font-size:9px!important;
  font-weight:850!important;
  letter-spacing:.15em!important;
}

.finance-weekly-savings-transfer-balance strong{
  position:relative;
  z-index:1;

  color:#5ce2ad!important;

  font-size:30px!important;
  font-weight:820!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
}

.finance-weekly-savings-transfer-balance small{
  position:relative;
  z-index:1;

  margin-top:7px!important;

  color:#789099!important;

  font-size:10px!important;
  line-height:1.45!important;
}

.finance-weekly-savings-transfer-modal .field{
  margin-top:17px!important;
}

.finance-weekly-savings-transfer-modal .field > label{
  display:block!important;

  margin:0 0 7px!important;

  color:#91a5ad!important;

  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.06em!important;
}

.finance-weekly-savings-transfer-modal
:is(
  input,
  select,
  textarea
){
  width:100%!important;
  box-sizing:border-box!important;

  border:
    1px solid rgba(118,158,174,.15)!important;

  border-radius:11px!important;

  background:
    rgba(5,23,31,.92)!important;

  color:#e6efec!important;

  outline:none!important;

  transition:
    border-color .16s ease,
    box-shadow .16s ease,
    background .16s ease!important;
}

.finance-weekly-savings-transfer-modal
:is(input,select){
  min-height:48px!important;
  padding:0 14px!important;
}

.finance-weekly-savings-transfer-modal textarea{
  min-height:92px!important;
  resize:vertical!important;
  padding:12px 14px!important;
}

.finance-weekly-savings-transfer-modal
:is(
  input,
  select,
  textarea
):focus{
  border-color:
    rgba(76,225,168,.52)!important;

  background:
    rgba(7,29,38,.98)!important;

  box-shadow:
    0 0 0 3px rgba(76,225,168,.07)!important;
}

.finance-weekly-savings-transfer-preview-grid{
  display:grid!important;

  grid-template-columns:
    repeat(2,minmax(0,1fr))!important;

  gap:11px!important;

  margin:18px 0 4px!important;
}

.finance-weekly-savings-transfer-modal
.finance-funding-preview{
  min-width:0!important;
  margin:0!important;
  padding:14px 15px!important;

  border:
    1px solid rgba(114,157,174,.11)!important;

  border-radius:12px!important;

  background:
    rgba(7,27,35,.74)!important;
}

.finance-weekly-savings-transfer-modal
.finance-funding-preview span{
  display:block!important;

  margin-bottom:7px!important;

  color:#748b94!important;

  font-size:9px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

.finance-weekly-savings-transfer-modal
.finance-funding-preview strong{
  display:block!important;

  overflow:hidden!important;

  color:#e6efec!important;

  font-size:17px!important;
  font-weight:780!important;

  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}

.finance-weekly-savings-transfer-modal
.finance-funding-preview:first-child strong{
  color:#6ee5b5!important;
}

.finance-weekly-savings-transfer-modal
.finance-editor-security{
  margin-top:18px!important;
  padding:11px 13px!important;

  border:
    1px solid rgba(104,146,162,.09)!important;

  border-radius:10px!important;

  background:
    rgba(255,255,255,.018)!important;

  color:#6f858e!important;

  font-size:10px!important;
  line-height:1.5!important;
}

.finance-weekly-savings-transfer-modal .modal-foot{
  position:relative!important;

  padding:16px 26px 19px!important;

  border-top:
    1px solid rgba(117,160,176,.10)!important;

  background:
    rgba(5,19,26,.97)!important;
}

.finance-weekly-savings-transfer-modal
.finance-editor-actions{
  display:flex!important;
  justify-content:flex-end!important;
  gap:10px!important;
}

.finance-weekly-savings-transfer-modal
.finance-editor-actions .btn{
  min-width:112px!important;
  min-height:43px!important;

  border-radius:10px!important;

  font-size:11px!important;
  font-weight:800!important;
}

.finance-weekly-savings-transfer-modal
.finance-editor-actions .btn:not(.primary){
  border-color:
    rgba(120,158,174,.15)!important;

  background:
    rgba(255,255,255,.025)!important;

  color:#9fb0b6!important;
}

.finance-weekly-savings-transfer-modal
.finance-editor-actions .btn.primary{
  border-color:
    rgba(67,218,159,.42)!important;

  background:
    linear-gradient(
      135deg,
      #38d89d,
      #1db77e
    )!important;

  color:#05251b!important;

  box-shadow:
    0 10px 28px rgba(35,205,142,.16)!important;
}

.finance-weekly-savings-transfer-modal
.finance-editor-actions .btn.primary:hover{
  transform:translateY(-1px);

  box-shadow:
    0 13px 34px rgba(35,205,142,.22)!important;
}


/* ---------- Mobile / installed PWA ---------- */

@media(max-width:600px){

  .finance-weekly-savings-transfer-modal{
    align-items:end!important;

    padding:
      0!important;
  }

  .finance-weekly-savings-transfer-modal
  .finance-weekly-savings-transfer-dialog{
    width:100%!important;

    max-height:
      calc(
        94dvh - env(safe-area-inset-top)
      )!important;

    border-left:0!important;
    border-right:0!important;
    border-bottom:0!important;

    border-radius:
      20px 20px 0 0!important;
  }

  .finance-weekly-savings-transfer-modal
  .modal-head{
    padding:
      19px 18px 16px!important;
  }

  .finance-weekly-savings-transfer-modal
  .modal-head h3{
    font-size:22px!important;
  }

  .finance-weekly-savings-transfer-modal
  .modal-body{
    padding:
      18px 18px 20px!important;
  }

  .finance-weekly-savings-transfer-balance{
    padding:17px!important;
  }

  .finance-weekly-savings-transfer-balance strong{
    font-size:27px!important;
  }

  .finance-weekly-savings-transfer-preview-grid{
    grid-template-columns:1fr!important;
  }

  .finance-weekly-savings-transfer-modal
  .modal-foot{
    padding:
      14px 18px
      calc(
        14px + env(safe-area-inset-bottom)
      )!important;
  }

  .finance-weekly-savings-transfer-modal
  .finance-editor-actions{
    width:100%!important;
  }

  .finance-weekly-savings-transfer-modal
  .finance-editor-actions .btn{
    flex:1 1 0!important;
    min-height:46px!important;
  }
}

/* =========================================================
   MONCEDA VAULT — TRANSFER PREVIEW FULL AMOUNT FIX
   ========================================================= */

.finance-weekly-savings-transfer-preview-grid{
  grid-template-columns:
    repeat(2,minmax(0,1fr))!important;
}

.finance-weekly-savings-transfer-modal
.finance-funding-preview{
  display:grid!important;
  grid-template-columns:1fr!important;
  align-content:center!important;
  gap:6px!important;

  min-width:0!important;
  min-height:72px!important;
}

.finance-weekly-savings-transfer-modal
.finance-funding-preview span{
  width:100%!important;
  margin:0!important;

  white-space:normal!important;
  line-height:1.25!important;
}

.finance-weekly-savings-transfer-modal
.finance-funding-preview strong{
  width:100%!important;
  min-width:0!important;

  overflow:visible!important;
  text-overflow:clip!important;

  white-space:nowrap!important;

  font-size:
    clamp(15px,1.35vw,18px)!important;

  line-height:1.2!important;

  font-variant-numeric:
    tabular-nums!important;

  letter-spacing:-.015em!important;
}

@media(max-width:600px){

  .finance-weekly-savings-transfer-preview-grid{
    grid-template-columns:1fr!important;
  }

  .finance-weekly-savings-transfer-modal
  .finance-funding-preview strong{
    font-size:18px!important;
  }
}

/* =========================================================
   MONCEDA VAULT — TRANSFER MODAL SCROLL + STICKY ACTIONS FIX
   ========================================================= */

.finance-weekly-savings-transfer-modal{
  overflow:hidden!important;

  padding:
    max(16px,env(safe-area-inset-top))
    16px
    max(16px,env(safe-area-inset-bottom))!important;
}

.finance-weekly-savings-transfer-modal
.finance-weekly-savings-transfer-dialog{
  display:flex!important;
  flex-direction:column!important;

  width:min(620px,100%)!important;

  max-height:
    calc(
      100dvh -
      32px -
      env(safe-area-inset-top) -
      env(safe-area-inset-bottom)
    )!important;

  min-height:0!important;

  overflow:hidden!important;
}


/* Header never disappears */

.finance-weekly-savings-transfer-modal
.modal-head{
  flex:0 0 auto!important;
}


/* Only the content area scrolls */

.finance-weekly-savings-transfer-modal
#financeWeeklySavingsTransferForm{
  display:flex!important;
  flex:1 1 auto!important;
  flex-direction:column!important;

  min-height:0!important;
  overflow:hidden!important;
}

.finance-weekly-savings-transfer-modal
.modal-body{
  flex:1 1 auto!important;

  min-height:0!important;

  overflow-x:hidden!important;
  overflow-y:auto!important;

  overscroll-behavior:contain!important;

  -webkit-overflow-scrolling:touch;
}


/* Keep actions visible at all times */

.finance-weekly-savings-transfer-modal
.modal-foot{
  position:relative!important;
  inset:auto!important;

  flex:0 0 auto!important;

  z-index:5!important;

  margin:0!important;

  background:
    linear-gradient(
      180deg,
      rgba(6,20,28,.98),
      rgba(5,18,25,1)
    )!important;

  box-shadow:
    0 -10px 30px rgba(0,0,0,.12)!important;
}


/* Clean scrollbar */

.finance-weekly-savings-transfer-modal
.modal-body{
  scrollbar-width:thin;
  scrollbar-color:
    rgba(79,201,158,.28)
    transparent;
}

.finance-weekly-savings-transfer-modal
.modal-body::-webkit-scrollbar{
  width:6px;
}

.finance-weekly-savings-transfer-modal
.modal-body::-webkit-scrollbar-track{
  background:transparent;
}

.finance-weekly-savings-transfer-modal
.modal-body::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:rgba(79,201,158,.25);
}


/* Short desktop/laptop windows */

@media(max-height:760px) and (min-width:601px){

  .finance-weekly-savings-transfer-modal{
    align-items:center!important;

    padding:12px!important;
  }

  .finance-weekly-savings-transfer-modal
  .finance-weekly-savings-transfer-dialog{
    max-height:
      calc(100dvh - 24px)!important;
  }

  .finance-weekly-savings-transfer-modal
  .modal-head{
    padding:
      18px 22px 15px!important;
  }

  .finance-weekly-savings-transfer-modal
  .modal-body{
    padding:
      17px 22px 18px!important;
  }

  .finance-weekly-savings-transfer-modal
  .modal-foot{
    padding:
      13px 22px 15px!important;
  }

  .finance-weekly-savings-transfer-balance{
    margin-bottom:16px!important;
    padding:15px 17px!important;
  }

}


/* Mobile / installed PWA */

@media(max-width:600px){

  .finance-weekly-savings-transfer-modal{
    align-items:flex-end!important;

    padding:
      max(8px,env(safe-area-inset-top))
      0
      0!important;
  }

  .finance-weekly-savings-transfer-modal
  .finance-weekly-savings-transfer-dialog{
    max-height:
      calc(
        100dvh -
        max(8px,env(safe-area-inset-top))
      )!important;

    border-radius:
      20px 20px 0 0!important;
  }

  .finance-weekly-savings-transfer-modal
  .modal-foot{
    padding:
      13px 18px
      calc(
        13px +
        env(safe-area-inset-bottom)
      )!important;
  }

}


/* =========================================================
   MONCEDA VAULT — WEEKLY SAVINGS TRANSFER HISTORY
   ========================================================= */

.finance-weekly-transfer-history{
  margin:0 0 18px;

  overflow:hidden;

  border:
    1px solid rgba(112,157,174,.11);

  border-radius:14px;

  background:
    rgba(5,23,31,.70);
}

.finance-weekly-transfer-history-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;

  gap:20px;

  padding:15px 17px;

  border-bottom:
    1px solid rgba(112,157,174,.09);
}

.finance-weekly-transfer-history-head > div:first-child > span{
  display:block;

  margin-bottom:5px;

  color:#4ce1a5;

  font-size:9px;
  font-weight:850;
  letter-spacing:.13em;
}

.finance-weekly-transfer-history-head > div:first-child > strong{
  display:block;

  color:#e3ece9;

  font-size:14px;
  line-height:1.2;
}

.finance-weekly-transfer-history-meta{
  flex:0 0 auto;

  text-align:right;
}

.finance-weekly-transfer-history-meta small,
.finance-weekly-transfer-history-meta strong{
  display:block;
}

.finance-weekly-transfer-history-meta small{
  margin-bottom:3px;

  color:#718892;

  font-size:9px;
  font-weight:700;
}

.finance-weekly-transfer-history-meta strong{
  color:#5de2ad;

  font-size:13px;
  font-variant-numeric:tabular-nums;
}

.finance-weekly-transfer-history-list{
  display:grid;
}

.finance-weekly-transfer-history-row{
  display:grid;

  grid-template-columns:
    34px
    minmax(0,1fr)
    auto;

  align-items:center;

  gap:12px;

  min-width:0;

  padding:13px 16px;

  border-bottom:
    1px solid rgba(112,157,174,.075);
}

.finance-weekly-transfer-history-row:last-child{
  border-bottom:0;
}

.finance-weekly-transfer-history-icon{
  display:grid;
  place-items:center;

  width:34px;
  height:34px;

  border:
    1px solid rgba(75,222,164,.17);

  border-radius:10px;

  background:
    rgba(27,131,94,.13);

  color:#58dfa8;

  font-size:16px;
  font-weight:700;
}

.finance-weekly-transfer-history-info{
  min-width:0;
}

.finance-weekly-transfer-history-destination{
  display:flex;
  align-items:baseline;

  gap:7px;

  min-width:0;
}

.finance-weekly-transfer-history-destination strong{
  min-width:0;

  overflow:hidden;

  color:#dae6e2;

  font-size:12px;
  font-weight:780;

  white-space:nowrap;
  text-overflow:ellipsis;
}

.finance-weekly-transfer-history-destination span{
  flex:0 1 auto;

  overflow:hidden;

  color:#748a93;

  font-size:9px;

  white-space:nowrap;
  text-overflow:ellipsis;
}

.finance-weekly-transfer-history-detail{
  display:flex;
  align-items:center;

  gap:8px;

  min-width:0;

  margin-top:5px;
}

.finance-weekly-transfer-history-detail > span{
  color:#718892;

  font-size:9px;
}

.finance-weekly-transfer-history-detail > span + span::before{
  content:"·";

  margin-right:8px;

  color:#49616b;
}

.finance-weekly-transfer-history-note{
  min-width:0;

  overflow:hidden;

  white-space:nowrap;
  text-overflow:ellipsis;
}

.finance-weekly-transfer-history-amount{
  flex:0 0 auto;

  color:#62e1ae;

  font-size:13px;
  font-weight:820;

  font-variant-numeric:tabular-nums;

  white-space:nowrap;
}

.finance-weekly-transfer-history-empty{
  padding:25px 18px;

  text-align:center;
}

.finance-weekly-transfer-history-empty strong,
.finance-weekly-transfer-history-empty span{
  display:block;
}

.finance-weekly-transfer-history-empty strong{
  color:#d5e1de;

  font-size:13px;
}

.finance-weekly-transfer-history-empty span{
  margin-top:6px;

  color:#718892;

  font-size:10px;
}

.finance-weekly-transfer-history-more{
  padding:10px 16px;

  border-top:
    1px solid rgba(112,157,174,.075);

  color:#6f858e;

  font-size:9px;
  line-height:1.5;

  text-align:center;
}


/* ---------- Mobile ---------- */

@media(max-width:600px){

  .finance-weekly-transfer-history{
    margin-bottom:14px;
  }

  .finance-weekly-transfer-history-head{
    align-items:flex-start;

    padding:14px;
  }

  .finance-weekly-transfer-history-row{
    grid-template-columns:
      32px
      minmax(0,1fr);

    gap:10px;

    padding:12px 14px;
  }

  .finance-weekly-transfer-history-icon{
    width:32px;
    height:32px;
  }

  .finance-weekly-transfer-history-amount{
    grid-column:2;

    margin-top:-2px;

    font-size:12px;
  }

  .finance-weekly-transfer-history-destination{
    align-items:flex-start;
    flex-direction:column;

    gap:2px;
  }

  .finance-weekly-transfer-history-detail{
    align-items:flex-start;
    flex-direction:column;

    gap:2px;
  }

  .finance-weekly-transfer-history-detail > span + span::before{
    content:"";
    margin:0;
  }

}


/* =========================================================
   MONCEDA VAULT — TRANSFER HISTORY SCROLLABLE LEDGER
   ========================================================= */

.finance-weekly-transfer-history{
  overflow:hidden;
}

.finance-weekly-transfer-history-head{
  position:relative;
  z-index:2;

  background:
    rgba(6,25,33,.96);
}

.finance-weekly-transfer-history-list{
  display:grid;

  max-height:220px;

  overflow-x:hidden;
  overflow-y:auto;

  overscroll-behavior:contain;

  scrollbar-gutter:stable;

  -webkit-overflow-scrolling:touch;

  scrollbar-width:thin;

  scrollbar-color:
    rgba(76,225,168,.30)
    transparent;
}

.finance-weekly-transfer-history-list::-webkit-scrollbar{
  width:6px;
}

.finance-weekly-transfer-history-list::-webkit-scrollbar-track{
  background:transparent;
}

.finance-weekly-transfer-history-list::-webkit-scrollbar-thumb{
  border-radius:999px;

  background:
    rgba(76,225,168,.25);
}

.finance-weekly-transfer-history-list::-webkit-scrollbar-thumb:hover{
  background:
    rgba(76,225,168,.42);
}

.finance-weekly-transfer-history-row{
  transition:
    background .16s ease;
}

.finance-weekly-transfer-history-row:hover{
  background:
    rgba(61,224,159,.035);
}


/* subtle scroll fade */

.finance-weekly-transfer-history-list{
  mask-image:
    linear-gradient(
      to bottom,
      #000 0,
      #000 calc(100% - 18px),
      rgba(0,0,0,.35) 100%
    );

  -webkit-mask-image:
    linear-gradient(
      to bottom,
      #000 0,
      #000 calc(100% - 18px),
      rgba(0,0,0,.35) 100%
    );
}

.finance-weekly-transfer-history-list:hover,
.finance-weekly-transfer-history-list:focus-within{
  mask-image:none;
  -webkit-mask-image:none;
}


/* Mobile / PWA */

@media(max-width:600px){

  .finance-weekly-transfer-history-list{
    max-height:235px;
  }

}


/* =========================================================
   MONCEDA VAULT — WEEKLY TRANSFER EDIT DELETE
   ========================================================= */

.finance-weekly-transfer-history-side{
  display:grid;
  justify-items:end;
  gap:7px;

  min-width:108px;
}

.finance-weekly-transfer-history-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;

  gap:5px;
}

.finance-weekly-transfer-history-actions button{
  min-height:27px;
  padding:0 9px;

  border:
    1px solid rgba(115,157,174,.13);

  border-radius:7px;

  background:
    rgba(255,255,255,.02);

  color:#82969e;

  font-size:9px;
  font-weight:800;

  cursor:pointer;

  transition:
    color .15s ease,
    border-color .15s ease,
    background .15s ease;
}

.finance-weekly-transfer-history-actions button:hover{
  border-color:
    rgba(76,225,168,.28);

  background:
    rgba(76,225,168,.06);

  color:#7ce5ba;
}

.finance-weekly-transfer-history-actions button.danger:hover{
  border-color:
    rgba(228,105,119,.28);

  background:
    rgba(204,68,85,.07);

  color:#e8949f;
}


/* Delete confirmation */

.finance-weekly-savings-delete-dialog{
  width:min(500px,100%)!important;
}

.finance-weekly-savings-delete-summary{
  padding:18px;

  border:
    1px solid rgba(223,103,117,.16);

  border-radius:13px;

  background:
    rgba(115,35,47,.08);
}

.finance-weekly-savings-delete-summary span,
.finance-weekly-savings-delete-summary strong,
.finance-weekly-savings-delete-summary small{
  display:block;
}

.finance-weekly-savings-delete-summary span{
  margin-bottom:7px;

  color:#a17c82;

  font-size:9px;
  font-weight:850;
  letter-spacing:.12em;
}

.finance-weekly-savings-delete-summary strong{
  color:#f0d7da;

  font-size:25px;
  font-variant-numeric:tabular-nums;
}

.finance-weekly-savings-delete-summary small{
  margin-top:6px;

  color:#899ba1;

  font-size:10px;
}

.finance-weekly-savings-delete-warning{
  margin-top:14px;
  padding:13px 14px;

  border:
    1px solid rgba(126,158,171,.10);

  border-radius:10px;

  background:
    rgba(255,255,255,.018);

  color:#85979e;

  font-size:10px;
  line-height:1.55;
}

.finance-transfer-delete-confirm{
  min-width:125px!important;

  border-color:
    rgba(219,91,107,.34)!important;

  background:
    rgba(174,53,69,.14)!important;

  color:#e8a0aa!important;
}

.finance-transfer-delete-confirm:hover{
  border-color:
    rgba(232,105,120,.55)!important;

  background:
    rgba(190,58,75,.22)!important;
}


/* Mobile */

@media(max-width:600px){

  .finance-weekly-transfer-history-side{
    grid-column:2;

    width:100%;

    justify-items:start;

    min-width:0;

    margin-top:2px;
  }

  .finance-weekly-transfer-history-actions{
    justify-content:flex-start;
  }

  .finance-weekly-transfer-history-actions button{
    min-height:32px;
    padding:0 11px;
  }

  .finance-weekly-savings-delete-dialog{
    width:100%!important;
  }

}

/* =========================================================
   MONCEDA VAULT — IOS / PWA DRAWER ROOT FIX
   Single authoritative mobile scrolling architecture.
   ========================================================= */

@media (max-width: 760px) {

  /*
   * LAYERING
   * Main app < overlay < drawer.
   */

  .mobile-menu-overlay {
    position: fixed !important;
    inset: 0 !important;

    z-index: 1990 !important;

    background:
      rgba(0, 5, 9, .64) !important;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    backdrop-filter:
      blur(4px);

    -webkit-backdrop-filter:
      blur(4px);

    transition:
      opacity 180ms ease,
      visibility 180ms ease;
  }

  body.mobile-menu-open
  .mobile-menu-overlay {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }


  /*
   * Lock interaction with the page behind the drawer.
   */

  body.mobile-menu-open {
    overflow: hidden !important;
    overscroll-behavior: none !important;
    touch-action: none;
  }


  /*
   * DRAWER SHELL
   *
   * Important:
   * The outer sidebar itself DOES NOT scroll.
   *
   * Grid rows:
   *   1. Brand
   *   2. Navigation — only scrolling region
   *   3. Security / utility footer
   */

  #vaultSidebar.sidebar {
    position: fixed !important;

    top: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    left: 0 !important;

    display: grid !important;

    grid-template-rows:
      auto
      minmax(0, 1fr)
      auto !important;

    align-content: stretch !important;

    gap: 0 !important;

    width:
      min(88vw, 350px) !important;

    height: 100dvh !important;
    min-height: 0 !important;
    max-height: 100dvh !important;

    box-sizing: border-box !important;

    padding:
      0
      14px
      0 !important;

    overflow: hidden !important;

    overscroll-behavior: none !important;

    touch-action: pan-y !important;

    border-right:
      1px solid
      rgba(148, 163, 184, .16) !important;

    border-bottom:
      0 !important;

    background:
      rgb(5, 15, 23) !important;

    box-shadow:
      24px 0 72px
      rgba(0, 0, 0, .58) !important;

    isolation: isolate;

    transform:
      translate3d(-105%, 0, 0);

    transition:
      transform
      220ms
      cubic-bezier(.2,.8,.2,1);

    z-index: 2000 !important;
  }

  body.mobile-menu-open
  #vaultSidebar.sidebar {
    transform:
      translate3d(0, 0, 0) !important;
  }


  /*
   * TOP / BRAND
   */

  #vaultSidebar.sidebar > .brand {
    grid-row: 1;

    flex: none !important;

    min-height: 64px !important;

    margin: 0 !important;

    padding:
      calc(
        12px +
        env(safe-area-inset-top, 0px)
      )
      54px
      12px
      4px !important;

    overflow: visible !important;

    background:
      rgb(5, 15, 23) !important;

    z-index: 3;
  }


  /*
   * ONLY SCROLLING REGION
   *
   * This deliberately overrides the older
   * ".sidebar > * { overflow:visible !important }"
   * iOS hardening rule.
   */

  #vaultSidebar.sidebar
  > .inside-nav {
    grid-row: 2;

    flex: none !important;

    width: 100% !important;

    min-width: 0 !important;
    min-height: 0 !important;

    height: auto !important;
    max-height: none !important;

    margin: 0 !important;

    padding:
      8px
      0
      18px !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;

    -webkit-overflow-scrolling:
      touch !important;

    overscroll-behavior-x:
      none !important;

    overscroll-behavior-y:
      contain !important;

    touch-action:
      pan-y !important;

    scrollbar-width:
      none;
  }

  #vaultSidebar.sidebar
  > .inside-nav::-webkit-scrollbar {
    display: none;
  }


  /*
   * Do not allow nested navigation regions
   * to become secondary scrolling surfaces.
   */

  #vaultSidebar.sidebar
  .nav-list,

  #vaultSidebar.sidebar
  .vault-nav-list,

  #vaultSidebar.sidebar
  .category-nav,

  #vaultSidebar.sidebar
  .inside-home-menu,

  #vaultSidebar.sidebar
  .inside-vault-picker {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    overflow: visible !important;
  }


  /*
   * FOOTER
   *
   * Dedicated bottom grid row.
   * It can no longer overlap Vault rows.
   */

  #vaultSidebar.sidebar
  > .inside-sidebar-footer {
    grid-row: 3;

    position: relative !important;

    flex: none !important;

    width: 100% !important;

    min-width: 0 !important;
    min-height: 0 !important;

    height: auto !important;
    max-height: none !important;

    margin: 0 !important;

    padding:
      13px
      0
      calc(
        12px +
        env(safe-area-inset-bottom, 0px)
      ) !important;

    overflow: visible !important;

    border-top:
      1px solid
      rgba(148, 163, 184, .11);

    background:
      rgb(5, 15, 23) !important;

    box-shadow:
      0 -14px 28px
      rgba(5, 15, 23, .96);

    z-index: 4;
  }


  /*
   * Neutralize historical footer spacing
   * from the older iOS drawer implementations.
   */

  #vaultSidebar.sidebar
  .inside-sidebar-footer > :last-child {
    margin-bottom: 0 !important;
  }

  #vaultSidebar.sidebar
  .sidebar-footer {
    margin-top: 0 !important;
    margin-bottom: 0 !important;

    padding-bottom: 0 !important;
  }


  /*
   * Close control stays above drawer content.
   */

  #vaultSidebar.sidebar
  .mobile-close-menu {
    position: absolute !important;

    top:
      calc(
        10px +
        env(safe-area-inset-top, 0px)
      ) !important;

    right: 10px !important;

    z-index: 10 !important;
  }


  /*
   * Vault popup menus must still appear above
   * the drawer when opened from a vault row.
   */

  .vault-popup-menu {
    z-index: 2050 !important;
  }

}


/* ---------- Narrow iPhones ---------- */

@media (max-width: 440px) {

  #vaultSidebar.sidebar {
    width:
      min(90vw, 340px) !important;
  }

}

/* =========================================================
   MONCEDA VAULT — IPHONE FINANCE ACTION DOCK FINAL
   Consolidated modal structure + approved V9 bottom dock.
   ========================================================= */

@media (max-width: 480px) {

  /*
   * Modal shell:
   * header + remaining form area.
   */

  .modal.finance-editor-modal {
    display: grid !important;

    grid-template-rows:
      auto
      minmax(0, 1fr) !important;

    height:
      calc(
        100dvh
        - 6px
        - env(safe-area-inset-top, 0px)
        - env(safe-area-inset-bottom, 0px)
      ) !important;

    max-height:
      calc(
        100dvh
        - 6px
        - env(safe-area-inset-top, 0px)
        - env(safe-area-inset-bottom, 0px)
      ) !important;

    overflow: hidden !important;
  }


  .modal.finance-editor-modal
  > .modal-head {
    grid-row: 1 !important;

    min-height: 0 !important;
  }


  /*
   * Form owns one scrollable content region.
   * The action dock is fixed independently below it.
   */

  .modal.finance-editor-modal
  > form {
    grid-row: 2 !important;

    display: grid !important;

    grid-template-rows:
      minmax(0, 1fr)
      auto !important;

    width: 100% !important;
    height: 100% !important;

    min-height: 0 !important;

    overflow: hidden !important;
  }


  .modal.finance-editor-modal
  .modal-body {
    grid-row: 1 !important;

    min-height: 0 !important;
    height: auto !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;

    /*
     * Clearance behind fixed bottom dock.
     */
    padding-bottom: 96px !important;

    -webkit-overflow-scrolling: touch;
  }


  /*
   * Approved iPhone action dock.
   */

  .modal.finance-editor-modal
  .modal-foot {
    grid-row: 2 !important;

    position: fixed !important;

    inset: auto !important;

    top: auto !important;
    left: 50% !important;
    right: auto !important;

    bottom:
      calc(
        8px
        + env(safe-area-inset-bottom, 0px)
      ) !important;

    width:
      calc(
        100vw
        - 24px
      ) !important;

    max-width: 456px !important;

    transform:
      translateX(-50%) !important;

    display: grid !important;

    grid-template-columns:
      64px
      minmax(0, 1fr) !important;

    align-items: center !important;

    gap: 6px !important;

    margin: 0 !important;

    padding:
      5px
      7px !important;

    border:
      1px solid
      rgba(148, 163, 184, .10) !important;

    border-radius:
      12px !important;

    background:
      rgba(7, 21, 30, .985) !important;

    box-shadow:
      0 12px 40px rgba(0, 0, 0, .34),
      0 -8px 24px rgba(0, 0, 0, .14) !important;

    z-index:
      9999 !important;
  }


  /*
   * Delete.
   */

  .modal.finance-editor-modal
  .modal-foot > .btn {
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;

    height: 30px !important;
    min-height: 30px !important;

    padding: 0 5px !important;

    margin: 0 !important;

    border-radius: 8px !important;

    font-size: 9.5px !important;
    line-height: 1 !important;

    flex: none !important;
  }


  /*
   * Cancel + Save.
   */

  .modal.finance-editor-modal
  .modal-foot
  > .finance-editor-actions {
    display: grid !important;

    grid-template-columns:
      72px
      minmax(0, 1fr) !important;

    grid-column: 2 !important;

    gap: 6px !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
  }


  .modal.finance-editor-modal
  .finance-editor-actions
  .btn {
    width: 100% !important;

    min-width: 0 !important;
    max-width: none !important;

    height: 30px !important;
    min-height: 30px !important;

    padding: 0 6px !important;

    margin: 0 !important;

    border-radius: 8px !important;

    font-size: 9.5px !important;
    line-height: 1 !important;

    flex: none !important;

    white-space: nowrap !important;
  }


  /*
   * New-account mode has no Delete button.
   */

  .modal.finance-editor-modal
  .modal-foot > span:empty {
    display: none !important;
  }


  .modal.finance-editor-modal
  .modal-foot > span:empty
  + .finance-editor-actions {
    grid-column:
      1 / -1 !important;

    width:
      min(100%, 220px) !important;

    justify-self:
      end !important;
  }

}


/* =========================================================
   MONCEDA VAULT — SIDEBAR LOCK FINAL
   Authoritative centered monochrome SVG implementation.
   ========================================================= */

/*
 * Retire the old pseudo-element icon.
 */

.inside-lock-button::before {
  content: none !important;
  display: none !important;
}


/*
 * SVG glyph.
 */

.inside-lock-glyph {
  display: grid !important;
  place-items: center !important;

  width: 17px !important;
  height: 17px !important;

  margin: 0 !important;
  padding: 0 !important;

  line-height: 0 !important;

  pointer-events: none;
}


.inside-lock-glyph svg {
  display: block !important;

  width: 17px !important;
  height: 17px !important;

  margin: 0 !important;

  overflow: visible;

  fill: none !important;
  stroke: currentColor !important;

  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}


/*
 * Exact square control.
 * High specificity intentionally overrides legacy
 * mobile sidebar rules.
 */

.sidebar
#lockBtn.inside-lock-button {
  width: 44px !important;
  height: 44px !important;

  min-width: 44px !important;
  min-height: 44px !important;

  max-width: 44px !important;
  max-height: 44px !important;

  flex:
    0 0 44px !important;

  display: grid !important;

  grid-template-columns:
    1fr !important;

  grid-template-rows:
    1fr !important;

  place-items:
    center !important;

  align-items:
    center !important;

  justify-items:
    center !important;

  justify-content:
    center !important;

  padding: 0 !important;
  margin: 0 !important;

  box-sizing:
    border-box !important;

  font-size: 0 !important;
  line-height: 0 !important;
}


.sidebar
#lockBtn.inside-lock-button
.inside-lock-glyph {
  grid-column: 1 !important;
  grid-row: 1 !important;

  align-self:
    center !important;

  justify-self:
    center !important;

  width: 17px !important;
  height: 17px !important;

  margin: 0 !important;

  transform:
    none !important;
}


.sidebar
#lockBtn.inside-lock-button
.inside-lock-glyph svg {
  display: block !important;

  width: 17px !important;
  height: 17px !important;

  margin: 0 !important;

  transform:
    none !important;
}


/* =========================================================
   MONCEDA VAULT — TOP LOCK MONOCHROME SVG
   Match sidebar lock visual language.
   ========================================================= */

#lockTop {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 7px !important;
}

.top-lock-glyph {
  display: grid !important;
  place-items: center !important;

  width: 17px !important;
  height: 17px !important;

  flex: 0 0 17px !important;

  margin: 0 !important;
  padding: 0 !important;

  color: currentColor !important;

  line-height: 0 !important;
}

.top-lock-glyph svg {
  display: block !important;

  width: 17px !important;
  height: 17px !important;

  margin: 0 !important;

  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}


/* iPhone / mobile — icon-only square */

@media (max-width: 900px) {

  #lockTop {
    width: 44px !important;
    height: 44px !important;

    min-width: 44px !important;
    min-height: 44px !important;

    max-width: 44px !important;
    max-height: 44px !important;

    padding: 0 !important;

    gap: 0 !important;

    display: grid !important;
    place-items: center !important;

    box-sizing: border-box !important;
  }

  #lockTop .top-lock-label {
    display: none !important;
  }

  #lockTop .top-lock-glyph {
    grid-area: 1 / 1 !important;

    align-self: center !important;
    justify-self: center !important;
  }

}


/* =========================================================
   MONCEDA VAULT — GLOBAL KEYBOARD FOCUS SYSTEM
   Consistent keyboard-only focus indication.
   ========================================================= */

:where(
  button,
  a[href],
  input,
  select,
  textarea,
  [role="button"],
  [tabindex]:not([tabindex="-1"])
):focus-visible {
  outline:
    2px solid
    rgba(46, 230, 166, .82) !important;

  outline-offset:
    2px !important;
}


/*
 * Preserve clean pointer/touch presentation.
 * Focus ring appears for keyboard navigation only.
 */

:where(
  button,
  a[href],
  [role="button"]
):focus:not(:focus-visible) {
  outline: none;
}


/*
 * High-contrast users retain a stronger system-compatible
 * indicator instead of relying on color alone.
 */

@media (forced-colors: active) {
  :where(
    button,
    a[href],
    input,
    select,
    textarea,
    [role="button"],
    [tabindex]:not([tabindex="-1"])
  ):focus-visible {
    outline:
      2px solid CanvasText !important;
  }
}