/* ============================================================
   Simbien 2.0 — Complete Stylesheet
   iOS-inspired dark design
   ============================================================ */

:root {
  --bg:       #000;
  --bg1:      #0a0a0a;
  --bg2:      #111;
  --bg3:      #1c1c1e;
  --bg4:      #2c2c2e;
  --bg5:      #3a3a3c;
  --border:   rgba(255,255,255,.08);
  --border2:  rgba(255,255,255,.12);
  --t1: #fff;
  --t2: rgba(255,255,255,.72);
  --t3: rgba(255,255,255,.44);
  --t4: rgba(255,255,255,.24);
  --t5: rgba(255,255,255,.12);
  --green:  #30d158; --green-d: rgba(48,209,88,.12);
  --blue:   #0a84ff; --blue-d:  rgba(10,132,255,.12);
  --red:    #ff453a; --red-d:   rgba(255,69,58,.1);
  --orange: #ff9f0a; --orange-d:rgba(255,159,10,.12);
  --yellow: #ffd60a; --yellow-d:rgba(255,214,10,.1);
  --purple: #bf5af2; --purple-d:rgba(191,90,242,.1);
  --font: -apple-system, 'SF Pro Display', 'SF Pro Text', 'Helvetica Neue', system-ui, sans-serif;
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 20px; --r-2xl: 28px;
  --ease: cubic-bezier(.4,0,.2,1);
  --t: all .18s var(--ease);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
body{font-family:var(--font);background:var(--bg);color:var(--t1);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow:hidden;height:100vh;width:100vw;}

/* ─── PAGES ─────────────────────────────────────────────── */
.page{display:none;position:fixed;inset:0;z-index:1;overflow-y:auto;overflow-x:hidden;}
.page.active{display:block;animation:fadeIn .25s var(--ease);}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* ─── LANDING ────────────────────────────────────────────── */
.land-wrap{min-height:100vh;background:var(--bg);position:relative;overflow:hidden;}
.land-orb{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;}
.land-orb1{width:400px;height:400px;top:-100px;left:-100px;background:radial-gradient(circle,rgba(48,209,88,.15),transparent 70%);}
.land-orb2{width:350px;height:350px;bottom:-100px;right:-100px;background:radial-gradient(circle,rgba(10,132,255,.12),transparent 70%);}

.land-nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 24px;height:56px;background:rgba(0,0,0,.85);backdrop-filter:blur(20px);border-bottom:.5px solid var(--border);}
.land-brand{display:flex;align-items:center;gap:9px;font-size:17px;font-weight:700;letter-spacing:-.03em;color:var(--t1);text-decoration:none;}
.brand-mark{width:28px;height:28px;border-radius:8px;background:var(--green);display:flex;align-items:center;justify-content:center;}
.brand-mark svg{width:14px;height:14px;}
.land-nav-btns{display:flex;gap:8px;}

.land-hero{padding:72px 24px 60px;text-align:center;max-width:680px;margin:0 auto;position:relative;z-index:1;}
.land-pill{display:inline-flex;align-items:center;gap:7px;background:var(--green-d);border:.5px solid rgba(48,209,88,.2);border-radius:100px;padding:5px 14px;font-size:12px;font-weight:500;color:var(--green);letter-spacing:.01em;margin-bottom:24px;}
.pill-dot{width:6px;height:6px;border-radius:50%;background:var(--green);animation:blink 2s infinite;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
.land-h1{font-size:clamp(42px,12vw,68px);font-weight:700;letter-spacing:-.05em;line-height:1.02;margin-bottom:20px;}
.land-grad{background:linear-gradient(125deg,var(--green),#00c6ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.land-sub{font-size:17px;color:var(--t2);line-height:1.65;max-width:480px;margin:0 auto 36px;}
.land-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:36px;}
.land-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}
.lc{background:var(--bg2);border:.5px solid var(--border2);border-radius:100px;padding:6px 14px;font-size:13px;color:var(--t3);}

.land-feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;padding:0 20px 60px;max-width:860px;margin:0 auto;position:relative;z-index:1;}
.lf-card{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:22px;transition:var(--t);}
.lf-card:hover{background:var(--bg3);border-color:var(--border2);transform:translateY(-2px);}
.lf-ic{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:19px;margin-bottom:14px;}
.lf-card h3{font-size:15px;font-weight:600;letter-spacing:-.01em;margin-bottom:6px;}
.lf-card p{font-size:13px;color:var(--t3);line-height:1.6;}

.land-footer{padding:24px;display:flex;align-items:center;justify-content:center;gap:12px;border-top:.5px solid var(--border);}
.land-footer a{font-size:13px;color:var(--t4);text-decoration:none;transition:var(--t);}
.land-footer a:hover{color:var(--t3);}
.land-footer span{font-size:13px;color:var(--t4);}

/* ─── BUTTONS ────────────────────────────────────────────── */
.btn-green-sm,.btn-outline-sm,.btn-ghost-sm{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-md);padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;border:none;transition:var(--t);font-family:var(--font);}
.btn-green-sm{background:var(--green);color:#000;}
.btn-green-sm:hover{background:#3ae261;}
.btn-outline-sm{background:var(--bg3);color:var(--t2);border:.5px solid var(--border2);}
.btn-outline-sm:hover{background:var(--bg4);}
.btn-green-lg,.btn-ghost-lg{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-lg);padding:14px 30px;font-size:16px;font-weight:600;cursor:pointer;border:none;transition:var(--t);font-family:var(--font);}
.btn-green-lg{background:var(--green);color:#000;}
.btn-green-lg:hover{background:#3ae261;transform:scale(1.01);}
.btn-ghost-lg{background:var(--bg3);color:var(--t2);border:.5px solid var(--border2);}
.btn-ghost-lg:hover{background:var(--bg4);}
.btn-green-full,.btn-ghost-full,.btn-red-full{width:100%;padding:13px;border-radius:var(--r-lg);font-size:15px;font-weight:600;cursor:pointer;border:none;transition:var(--t);font-family:var(--font);}
.btn-green-full{background:var(--green);color:#000;}
.btn-green-full:hover{background:#3ae261;}
.btn-ghost-full{background:var(--bg3);color:var(--t2);border:.5px solid var(--border2);}
.btn-ghost-full:hover{background:var(--bg4);}
.btn-red-full{background:var(--red);color:#fff;}
.btn-danger-sm{display:inline-flex;align-items:center;gap:6px;background:var(--red-d);color:var(--red);font-size:13px;font-weight:500;border:.5px solid rgba(255,69,58,.2);border-radius:var(--r-md);padding:9px 14px;cursor:pointer;transition:var(--t);margin-top:8px;font-family:var(--font);}
.btn-danger-sm:hover{background:rgba(255,69,58,.2);}

/* ─── AUTH ───────────────────────────────────────────────── */
.auth-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;background:var(--bg);max-width:400px;margin:0 auto;}
.auth-back{align-self:flex-start;background:none;border:none;color:var(--t3);font-size:15px;cursor:pointer;padding:0;margin-bottom:32px;font-family:var(--font);}
.auth-back:hover{color:var(--t2);}
.auth-mark{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;font-size:22px;}
.green-mark{background:var(--green);}
.green-mark svg{width:22px;height:22px;}
.red-mark{background:var(--red);}
.auth-screen h1{font-size:26px;font-weight:700;letter-spacing:-.03em;margin-bottom:6px;align-self:flex-start;}
.auth-sub{font-size:14px;color:var(--t3);margin-bottom:28px;align-self:flex-start;}
.auth-fields{width:100%;display:flex;flex-direction:column;gap:12px;margin-bottom:16px;}
.auth-switch{font-size:13px;color:var(--t4);}
.auth-switch a{color:var(--green);text-decoration:none;}
.demo-box{display:flex;align-items:center;gap:8px;background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-md);padding:10px 14px;margin-top:16px;width:100%;}
.demo-tag{font-size:10px;font-weight:700;color:var(--green);background:var(--green-d);border-radius:4px;padding:2px 6px;letter-spacing:.04em;}
.demo-box span:last-child{font-size:12px;color:var(--t3);font-family:monospace;}

/* ─── FORM ───────────────────────────────────────────────── */
.fld{display:flex;flex-direction:column;gap:5px;}
.fld label{font-size:11px;font-weight:600;color:var(--t4);letter-spacing:.04em;text-transform:uppercase;}
.fld-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=month],input[type=time],select,textarea{width:100%;background:var(--bg3);border:.5px solid var(--border2);border-radius:var(--r-md);padding:11px 14px;font-family:var(--font);font-size:15px;color:var(--t1);outline:none;transition:var(--t);-webkit-appearance:none;appearance:none;}
input::placeholder,textarea::placeholder{color:var(--t4);}
input:focus,select:focus,textarea:focus{border-color:var(--green);background:var(--bg4);box-shadow:0 0 0 3px rgba(48,209,88,.07);}
select option{background:#1c1c1e;}

/* ─── APP ────────────────────────────────────────────────── */
.app-status-bar{height:env(safe-area-inset-top,0px);background:var(--bg);}
.app-content{height:calc(100vh - env(safe-area-inset-top,0px) - 68px);overflow:hidden;position:relative;}

/* ─── TABS ───────────────────────────────────────────────── */
.tab{display:none;height:100%;overflow:hidden;}
.tab.active{display:flex;flex-direction:column;}
.tab-scroll{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:16px 16px 8px;}

/* ─── BOTTOM NAV ─────────────────────────────────────────── */
.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:50;height:68px;background:rgba(0,0,0,.92);backdrop-filter:blur(20px);border-top:.5px solid var(--border);display:flex;align-items:flex-start;padding-top:8px;padding-bottom:env(safe-area-inset-bottom,0);}
.bn-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;cursor:pointer;padding:4px 0;transition:var(--t);}
.bn-btn svg{width:22px;height:22px;color:var(--t4);transition:var(--t);}
.bn-btn span{font-size:10px;font-weight:500;color:var(--t4);letter-spacing:.01em;transition:var(--t);}
.bn-btn.active svg{color:var(--green);}
.bn-btn.active span{color:var(--green);}

/* ─── ICON BUTTONS ───────────────────────────────────────── */
.icon-btn{width:34px;height:34px;background:var(--bg3);border:.5px solid var(--border2);border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;color:var(--t2);transition:var(--t);}
.icon-btn:hover{background:var(--bg4);}
.icon-btn svg{width:16px;height:16px;}
.icon-btn-sm{width:30px;height:30px;background:none;border:.5px solid var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--t3);font-size:16px;transition:var(--t);font-family:var(--font);}
.icon-btn-sm:hover{background:var(--bg3);color:var(--t1);}
.green-ic{background:var(--green-d)!important;color:var(--green)!important;border-color:rgba(48,209,88,.2)!important;}
.green-txt{color:var(--green)!important;}

/* ─── TODAY TAB ──────────────────────────────────────────── */
.today-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:18px;}
.today-label{font-size:13px;color:var(--t3);font-weight:500;margin-bottom:2px;}
.today-title{font-size:30px;font-weight:700;letter-spacing:-.04em;line-height:1;}
.today-day-num{color:var(--green);}

.summary-row{display:flex;gap:8px;margin-bottom:18px;}
.sum-pill{flex:1;background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-lg);padding:12px;display:flex;flex-direction:column;gap:5px;}
.sp-lbl{font-size:10px;font-weight:600;color:var(--t4);letter-spacing:.05em;text-transform:uppercase;}
.sp-val{font-size:17px;font-weight:700;letter-spacing:-.03em;}
.sum-pill.green .sp-val{color:var(--green);}
.sum-pill.red   .sp-val{color:var(--red);}
.sum-pill.blue  .sp-val{color:var(--blue);}

/* Mini calendar */
.mini-cal-wrap{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:14px;margin-bottom:18px;}
.mini-cal-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.mc-title{font-size:14px;font-weight:600;letter-spacing:-.01em;}
.mc-nav{display:flex;gap:4px;}
.mc-nav button{background:none;border:none;color:var(--t3);font-size:16px;cursor:pointer;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:var(--t);font-family:var(--font);}
.mc-nav button:hover{background:var(--bg3);color:var(--t1);}
.mini-cal-days,.mini-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.mc-dn{font-size:10px;font-weight:600;color:var(--t4);text-align:center;padding:2px 0 5px;letter-spacing:.02em;}
.mc-day{aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:500;color:var(--t2);cursor:pointer;position:relative;transition:var(--t);}
.mc-day:hover:not(.mc-today){background:var(--bg3);}
.mc-day.mc-today{background:var(--red);color:#fff;font-weight:700;}
.mc-day.mc-selected:not(.mc-today){background:var(--bg4);}
.mc-day.mc-other{color:var(--t5);}
.mc-day.mc-weekend:not(.mc-today){color:var(--t3);}
.mc-dot{position:absolute;bottom:1px;left:50%;transform:translateX(-50%);display:flex;gap:1.5px;}
.mc-dot span{width:3.5px;height:3.5px;border-radius:50%;}

/* Today list */
.today-section-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.ts-title{font-size:13px;font-weight:600;color:var(--t3);letter-spacing:.03em;text-transform:uppercase;}
.ts-add{background:none;border:none;color:var(--green);font-size:13px;cursor:pointer;font-family:var(--font);}
.today-list{display:flex;flex-direction:column;gap:5px;margin-bottom:6px;}
.tl-item{display:flex;align-items:center;gap:11px;background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-lg);padding:11px 13px;cursor:pointer;transition:var(--t);}
.tl-item:hover{background:var(--bg3);}
.tl-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;}
.tl-info{flex:1;min-width:0;}
.tl-title{font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tl-sub{font-size:11px;color:var(--t4);margin-top:1px;}
.tl-right{text-align:right;flex-shrink:0;}
.tl-amt{font-size:14px;font-weight:700;letter-spacing:-.02em;}
.tl-time{font-size:11px;color:var(--t4);}
.tl-badge{font-size:10px;font-weight:600;padding:2px 7px;border-radius:100px;}
.tl-empty{text-align:center;padding:20px;color:var(--t4);font-size:13px;}

/* ─── CALENDAR TAB ───────────────────────────────────────── */
.cal-header-bar{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px;}
.cal-hdr-month{font-size:28px;font-weight:700;letter-spacing:-.04em;line-height:1;}
.cal-hdr-year{font-size:18px;font-weight:300;color:var(--t3);margin-top:2px;}
.cal-hdr-actions{display:flex;gap:6px;align-items:center;}

/* Big calendar */
.big-cal-daynames,.big-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);}
.big-cal-daynames{margin-bottom:4px;}
.bcd-name{font-size:11px;font-weight:600;color:var(--t4);text-align:center;padding:0 0 4px;letter-spacing:.02em;}
.big-cal-grid{gap:1px;}
.bc-day{min-height:52px;border-radius:var(--r-md);padding:5px 4px 3px;cursor:pointer;transition:var(--t);position:relative;display:flex;flex-direction:column;}
.bc-day:hover{background:var(--bg2);}
.bc-day.bc-today .bc-num{background:var(--red);color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.bc-day.bc-selected:not(.bc-today){background:var(--bg3);}
.bc-day.bc-other .bc-num{color:var(--t5);}
.bc-num{font-size:15px;font-weight:500;color:var(--t1);text-align:center;line-height:1;margin-bottom:3px;}
.bc-dots{display:flex;gap:2px;justify-content:center;flex-wrap:wrap;}
.bc-dot{width:5px;height:5px;border-radius:50%;}

/* Calendar day events */
.cal-day-events{margin-top:14px;}
.cde-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.cde-date{font-size:15px;font-weight:600;color:var(--t2);letter-spacing:-.01em;}
.cde-list{display:flex;flex-direction:column;gap:6px;}
.cde-item{display:flex;align-items:center;gap:10px;background:var(--bg2);border-radius:var(--r-lg);padding:12px 14px;border-left:3px solid;cursor:pointer;transition:var(--t);}
.cde-item:hover{background:var(--bg3);}
.cde-item.ev-event{border-color:var(--blue);}
.cde-item.ev-income{border-color:var(--green);}
.cde-item.ev-expense{border-color:var(--red);}
.cde-item.ev-note{border-color:var(--yellow);}
.cde-item.ev-budget{border-color:var(--orange);}
.cde-title{font-size:14px;font-weight:500;}
.cde-sub{font-size:12px;color:var(--t4);margin-top:2px;}
.cde-tag{margin-left:auto;font-size:10px;font-weight:700;padding:2px 8px;border-radius:100px;flex-shrink:0;}

/* ─── NOTES TAB ──────────────────────────────────────────── */
.notes-hdr{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px;}
.notes-title{font-size:28px;font-weight:700;letter-spacing:-.04em;}
.notes-count{font-size:13px;color:var(--t3);margin-top:3px;}
.note-search-box{display:flex;align-items:center;gap:8px;background:var(--bg3);border-radius:var(--r-md);padding:10px 13px;margin-bottom:12px;}
.note-search-box input{background:none;border:none;flex:1;font-size:14px;color:var(--t1);outline:none;padding:0;}
.note-search-box input::placeholder{color:var(--t4);}
.note-filters{display:flex;gap:6px;margin-bottom:14px;overflow-x:auto;padding-bottom:2px;}
.nf-btn{background:var(--bg2);border:.5px solid var(--border);color:var(--t3);border-radius:100px;padding:6px 14px;font-size:12px;cursor:pointer;white-space:nowrap;transition:var(--t);font-family:var(--font);}
.nf-btn.active{background:var(--bg3);border-color:var(--border2);color:var(--t1);}
.notes-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.note-card{border-radius:var(--r-xl);padding:14px;cursor:pointer;transition:var(--t);border:.5px solid transparent;position:relative;}
.note-card:hover{transform:translateY(-1px);}
.note-card.nc-default{background:var(--bg3);}
.note-card.nc-yellow{background:rgba(255,214,10,.08);border-color:rgba(255,214,10,.15);}
.note-card.nc-blue{background:rgba(10,132,255,.08);border-color:rgba(10,132,255,.15);}
.note-card.nc-green{background:rgba(48,209,88,.08);border-color:rgba(48,209,88,.13);}
.note-card.nc-red{background:rgba(255,69,58,.08);border-color:rgba(255,69,58,.13);}
.note-card.nc-purple{background:rgba(191,90,242,.08);border-color:rgba(191,90,242,.13);}
.note-card.nc-wide{grid-column:span 2;}
.nc-pin-mark{font-size:10px;font-weight:700;color:var(--orange);letter-spacing:.04em;text-transform:uppercase;margin-bottom:5px;}
.nc-title{font-size:14px;font-weight:600;margin-bottom:5px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.nc-preview{font-size:12px;color:var(--t3);line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.nc-footer{display:flex;align-items:center;justify-content:space-between;margin-top:10px;}
.nc-date{font-size:10px;color:var(--t4);}
.nc-badges{display:flex;gap:4px;}
.nc-badge{font-size:10px;padding:1px 6px;border-radius:100px;}
.notes-empty{grid-column:span 2;text-align:center;padding:40px 20px;color:var(--t4);}

/* ─── NOTE EDITOR ────────────────────────────────────────── */
.note-editor-screen{min-height:100vh;background:var(--bg3);display:flex;flex-direction:column;}
.ne-topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 8px;border-bottom:.5px solid var(--border);background:var(--bg3);}
.ne-back{background:none;border:none;color:var(--blue);font-size:15px;cursor:pointer;font-family:var(--font);}
.ne-actions{display:flex;gap:8px;align-items:center;}
.ne-action-btn{background:none;border:none;font-size:16px;cursor:pointer;padding:4px;color:var(--t2);font-family:var(--font);}
.ne-meta{font-size:12px;color:var(--t4);text-align:center;padding:8px;border-bottom:.5px solid var(--border);}
.ne-title-inp{width:100%;background:none;border:none;padding:16px 20px 8px;font-size:22px;font-weight:700;color:var(--t1);font-family:var(--font);outline:none;letter-spacing:-.02em;}
.ne-body-inp{flex:1;width:100%;background:none;border:none;padding:8px 20px;font-size:15px;color:var(--t2);font-family:var(--font);outline:none;resize:none;min-height:200px;line-height:1.7;}
.ne-links-section{padding:12px 20px;border-top:.5px solid var(--border);}
.ne-links-title{font-size:11px;font-weight:700;color:var(--t4);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;}
.ne-links-list{display:flex;flex-direction:column;gap:6px;}
.ne-link-item{display:flex;align-items:center;gap:8px;background:var(--bg4);border-radius:var(--r-md);padding:10px 12px;}
.nli-ic{font-size:15px;}
.nli-info{flex:1;}
.nli-title{font-size:13px;font-weight:500;}
.nli-sub{font-size:11px;color:var(--t4);}
.nli-val{font-size:12px;font-weight:600;}
.ne-toolbar{display:flex;gap:4px;padding:8px 12px;border-top:.5px solid var(--border);background:var(--bg3);overflow-x:auto;}
.ntb-btn{background:var(--bg4);border:none;color:var(--t2);border-radius:var(--r-sm);padding:7px 12px;font-size:12px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:var(--t);font-family:var(--font);}
.ntb-btn:hover{background:var(--bg5);color:var(--t1);}

/* ─── BUDGET TAB ─────────────────────────────────────────── */
.bud-hdr{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:18px;}
.bud-title{font-size:28px;font-weight:700;letter-spacing:-.04em;line-height:1;}
.bud-subtitle{font-size:13px;color:var(--t3);margin-top:3px;}

/* Ring */
.ring-section{display:flex;align-items:center;gap:16px;margin-bottom:18px;background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:16px;}
.ring-outer{position:relative;width:140px;height:140px;flex-shrink:0;}
.ring-outer svg{width:100%;height:100%;}
.ring-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;}
.ri-lbl{font-size:10px;color:var(--t4);font-weight:500;}
.ri-val{font-size:22px;font-weight:700;letter-spacing:-.04em;color:var(--green);}
.ri-sub{font-size:11px;color:var(--t3);}
.ring-legend{display:flex;flex-direction:column;gap:10px;}
.rl-item{display:flex;align-items:center;gap:8px;}
.rl-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.rl-lbl{font-size:12px;color:var(--t3);flex:1;}
.rl-val{font-size:14px;font-weight:700;letter-spacing:-.02em;}
.rl-val.green{color:var(--green);}
.rl-val.red{color:var(--red);}
.rl-val.orange{color:var(--orange);}

/* Budget period bar */
.bud-period-bar{display:flex;gap:2px;background:var(--bg2);border-radius:var(--r-md);padding:3px;margin-bottom:16px;border:.5px solid var(--border);}
.bpb-btn{flex:1;background:none;border:none;color:var(--t4);font-size:13px;font-weight:500;font-family:var(--font);padding:7px 4px;border-radius:9px;cursor:pointer;transition:var(--t);}
.bpb-btn.active{background:var(--bg4);color:var(--t1);}

/* Budget views */
.bud-view{display:none;}
.bud-view.active{display:block;}
.bv-section-title{font-size:13px;font-weight:600;color:var(--t3);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px;}

/* Budget bars */
.bud-bars{display:flex;flex-direction:column;gap:12px;margin-bottom:12px;}
.bud-bar-item{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:14px;}
.bbi-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.bbi-left{display:flex;align-items:center;gap:8px;}
.bbi-cat{font-size:14px;font-weight:600;}
.bbi-period{font-size:11px;color:var(--t4);background:var(--bg3);border-radius:100px;padding:2px 7px;}
.bbi-amts{font-size:12px;color:var(--t3);}
.bbi-bar-bg{height:5px;background:var(--bg4);border-radius:3px;overflow:hidden;margin-bottom:5px;}
.bbi-bar-fill{height:100%;border-radius:3px;transition:width .6s var(--ease);}
.bbi-status{font-size:12px;}
.add-budget-btn{width:100%;background:none;border:.5px dashed var(--border2);color:var(--t3);border-radius:var(--r-lg);padding:12px;font-size:14px;cursor:pointer;transition:var(--t);font-family:var(--font);margin-top:6px;}
.add-budget-btn:hover{background:var(--bg2);color:var(--t2);}

/* Transactions list */
.tx-filters{display:flex;gap:6px;margin-bottom:12px;}
.txf-btn{background:var(--bg2);border:.5px solid var(--border);color:var(--t3);border-radius:100px;padding:6px 14px;font-size:12px;cursor:pointer;transition:var(--t);font-family:var(--font);}
.txf-btn.active{background:var(--bg3);border-color:var(--border2);color:var(--t1);}
.tx-list{display:flex;flex-direction:column;gap:4px;}
.tx-item{display:flex;align-items:center;gap:11px;background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-lg);padding:11px 13px;cursor:pointer;transition:var(--t);}
.tx-item:hover{background:var(--bg3);}
.tx-ic{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.tx-info{flex:1;min-width:0;}
.tx-desc{font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tx-meta{font-size:11px;color:var(--t4);margin-top:1px;}
.tx-right{text-align:right;}
.tx-amt{font-size:15px;font-weight:700;letter-spacing:-.02em;}
.tx-amt.inc{color:var(--green);}
.tx-amt.exp{color:var(--t1);}
.tx-date{font-size:11px;color:var(--t4);}

/* Credit cards */
.cc-list{display:flex;flex-direction:column;gap:12px;}
.cc-card-item{border-radius:var(--r-2xl);padding:20px;position:relative;overflow:hidden;min-height:160px;color:#fff;}
.cc-card-item::after{content:'';position:absolute;right:-20px;top:-20px;width:130px;height:130px;border-radius:50%;background:rgba(255,255,255,.04);pointer-events:none;}
.cc-bank{font-size:18px;font-weight:700;letter-spacing:-.02em;margin-bottom:2px;}
.cc-cname{font-size:12px;opacity:.55;margin-bottom:16px;}
.cc-stats{display:flex;gap:16px;position:relative;z-index:1;}
.cc-stat span{font-size:10px;opacity:.5;text-transform:uppercase;letter-spacing:.04em;display:block;}
.cc-stat strong{font-size:15px;font-weight:700;display:block;margin-top:2px;}
.cc-bar-bg{height:3px;background:rgba(255,255,255,.12);border-radius:2px;margin-top:12px;position:relative;z-index:1;}
.cc-bar-fill{height:100%;border-radius:2px;}
.cc-card-btns{display:flex;gap:5px;margin-top:10px;position:relative;z-index:1;}
.cc-card-btn{flex:1;background:rgba(255,255,255,.1);border:.5px solid rgba(255,255,255,.15);color:rgba(255,255,255,.85);border-radius:var(--r-md);padding:7px 4px;font-size:11px;cursor:pointer;transition:var(--t);font-family:var(--font);}
.cc-card-btn:hover{background:rgba(255,255,255,.18);}

/* Reports */
.report-content{display:flex;flex-direction:column;gap:12px;}
.rep-card{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:16px;}
.rep-card h3{font-size:14px;font-weight:600;letter-spacing:-.01em;margin-bottom:12px;}
.yr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.yr-m{background:var(--bg3);border-radius:var(--r-md);padding:10px;text-align:center;}
.yr-mn{font-size:11px;color:var(--t4);}
.yr-net{font-size:13px;font-weight:700;letter-spacing:-.02em;margin-top:3px;}
.yr-net.pos{color:var(--green);}
.yr-net.neg{color:var(--red);}

/* ─── AI TAB ─────────────────────────────────────────────── */
.ai-hdr{display:flex;align-items:center;gap:12px;padding-bottom:16px;border-bottom:.5px solid var(--border);margin-bottom:16px;}
.ai-av-lg{width:46px;height:46px;border-radius:14px;background:var(--green-d);border:.5px solid rgba(48,209,88,.2);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;}
.ai-hdr-title{font-size:17px;font-weight:700;letter-spacing:-.02em;}
.ai-hdr-sub{font-size:12px;color:var(--green);margin-top:1px;}

.tab#tab-ai{flex-direction:column;}
.tab#tab-ai .tab-scroll{display:flex;flex-direction:column;height:100%;padding-bottom:0;}
.ai-msgs{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:12px;padding-bottom:8px;}
.ai-welcome{text-align:center;padding:24px 16px;}
.aw-icon{font-size:48px;display:block;margin-bottom:12px;}
.ai-welcome h3{font-size:18px;font-weight:700;margin-bottom:8px;}
.ai-welcome p{font-size:14px;color:var(--t3);line-height:1.6;}
.ai-msg{display:flex;gap:8px;}
.ai-msg.usr{flex-direction:row-reverse;}
.ai-msg-av{width:28px;height:28px;border-radius:8px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:12px;}
.ai-msg:not(.usr) .ai-msg-av{background:var(--green-d);}
.ai-msg.usr .ai-msg-av{background:var(--green);color:#000;font-weight:700;}
.ai-bubble{max-width:82%;background:var(--bg3);border-radius:14px;padding:10px 13px;font-size:14px;line-height:1.55;}
.ai-msg.usr .ai-bubble{background:var(--blue-d);border:.5px solid rgba(10,132,255,.15);}
.ai-typing{display:flex;gap:4px;padding:14px;}
.ai-typing span{width:5px;height:5px;border-radius:50%;background:var(--t4);animation:td 1.2s infinite;}
.ai-typing span:nth-child(2){animation-delay:.2s;}
.ai-typing span:nth-child(3){animation-delay:.4s;}
@keyframes td{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}
.ai-quick-btns{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin-bottom:8px;}
.ai-quick-btns button{background:var(--bg3);border:.5px solid var(--border);color:var(--t3);border-radius:100px;padding:7px 13px;font-size:12px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:var(--t);font-family:var(--font);}
.ai-quick-btns button:hover{background:var(--green-d);border-color:rgba(48,209,88,.2);color:var(--green);}
.ai-input-row{display:flex;gap:8px;padding-top:8px;border-top:.5px solid var(--border);flex-shrink:0;}
.ai-input-row input{flex:1;}
.ai-send-btn{width:42px;height:42px;border-radius:12px;background:var(--green);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:var(--t);}
.ai-send-btn:hover{background:#3ae261;}
.ai-send-btn svg{width:16px;height:16px;color:#000;}

/* ─── SHEETS ─────────────────────────────────────────────── */
.sheet-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.65);backdrop-filter:blur(12px);display:none;align-items:flex-end;justify-content:center;}
.sheet-overlay.open{display:flex;}
.sheet{background:var(--bg2);border:.5px solid var(--border2);border-radius:var(--r-2xl) var(--r-2xl) 0 0;width:100%;max-width:540px;max-height:88vh;overflow-y:auto;animation:sheetUp .28s var(--ease);}
.sheet-lg{max-height:92vh;}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.sheet::before{content:'';display:block;width:36px;height:4px;border-radius:2px;background:var(--bg5);margin:10px auto 0;}
.sheet-handle{display:none;}/* handled by ::before */
.sheet-hdr{display:flex;align-items:center;justify-content:space-between;padding:14px 20px 0;}
.sheet-hdr h3{font-size:17px;font-weight:700;letter-spacing:-.02em;}
.sheet-close{width:28px;height:28px;border-radius:50%;background:var(--bg4);border:none;color:var(--t3);font-size:14px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.sheet-body{padding:16px 20px;display:flex;flex-direction:column;gap:12px;}
.sheet-foot{padding:0 20px 24px;display:flex;gap:10px;}
.sheet-foot .btn-ghost-full{flex:1;}
.sheet-foot .btn-green-full{flex:2;}

/* Add options */
.add-options{display:flex;flex-direction:column;gap:6px;padding:12px 20px 20px;}
.add-opt-btn{display:flex;align-items:center;gap:14px;background:var(--bg3);border:none;border-radius:var(--r-xl);padding:14px 16px;cursor:pointer;transition:var(--t);width:100%;text-align:left;}
.add-opt-btn:hover{background:var(--bg4);}
.aob-ic{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;}
.aob-title{font-size:15px;font-weight:600;color:var(--t1);}
.aob-sub{font-size:12px;color:var(--t3);margin-top:1px;}

/* Note color grid */
.note-color-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.nc-btn{border-radius:var(--r-lg);padding:14px;font-size:14px;font-weight:500;cursor:pointer;transition:var(--t);font-family:var(--font);}
.nc-btn:hover{opacity:.85;}

/* Color picker */
.clr-row{display:flex;gap:10px;}
.clr{width:28px;height:28px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:var(--t);}
.clr.active{border-color:#fff;transform:scale(1.2);}

/* ─── ADMIN ──────────────────────────────────────────────── */
.admin-screen{min-height:100vh;background:var(--bg);padding-bottom:40px;}
.admin-topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:.5px solid var(--border);position:sticky;top:0;background:rgba(0,0,0,.9);backdrop-filter:blur(20px);z-index:10;}
.admin-title{font-size:16px;font-weight:700;color:var(--red);}
.admin-tabs{display:flex;gap:4px;padding:12px 16px;overflow-x:auto;}
.at-btn{background:var(--bg2);border:.5px solid var(--border);color:var(--t3);border-radius:var(--r-md);padding:8px 16px;font-size:13px;cursor:pointer;white-space:nowrap;transition:var(--t);font-family:var(--font);}
.at-btn.active{background:var(--bg3);border-color:var(--border2);color:var(--t1);}
.admin-tab-content{display:none;padding:0 16px;}
.admin-tab-content.active{display:block;}
.admin-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;}
.admin-stat{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:16px;text-align:center;}
.as-v{font-size:28px;font-weight:700;letter-spacing:-.04em;color:var(--red);}
.as-l{font-size:11px;color:var(--t4);margin-top:4px;}
.admin-storage-bar{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:16px;}
.asb-lbl{font-size:12px;color:var(--t3);margin-bottom:8px;}
.asb-bar{height:5px;background:var(--bg4);border-radius:3px;overflow:hidden;margin-bottom:6px;}
.asb-fill{height:100%;background:var(--blue);border-radius:3px;transition:width .6s;}
.asb-info{font-size:12px;color:var(--t4);}
.admin-user-list{display:flex;flex-direction:column;gap:6px;}
.adm-ur{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-lg);padding:12px 14px;display:flex;align-items:center;justify-content:space-between;}
.adm-unm{font-size:14px;font-weight:500;}
.adm-uem{font-size:11px;color:var(--t4);}
.system-section{background:var(--bg2);border:.5px solid var(--border);border-radius:var(--r-xl);padding:18px;display:flex;flex-direction:column;gap:12px;margin-bottom:12px;}
.sys-sec-title{font-size:11px;font-weight:700;color:var(--t4);text-transform:uppercase;letter-spacing:.06em;}

/* ─── TOAST ──────────────────────────────────────────────── */
.toast{position:fixed;bottom:84px;left:50%;transform:translateX(-50%) translateY(12px);background:var(--bg3);border:.5px solid var(--border2);border-radius:var(--r-lg);padding:10px 18px;font-size:13px;z-index:999;opacity:0;pointer-events:none;transition:all .22s var(--ease);white-space:nowrap;backdrop-filter:blur(20px);}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast.ok {border-color:rgba(48,209,88,.3);color:var(--green);}
.toast.err{border-color:rgba(255,69,58,.3);color:var(--red);}
.toast.inf{border-color:rgba(10,132,255,.3);color:var(--blue);}

/* ─── SCROLLBAR ──────────────────────────────────────────── */
::-webkit-scrollbar{width:3px;height:3px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:2px;}

/* ─── RESPONSIVE ─────────────────────────────────────────── */
@media(min-width:600px){
  .sheet{border-radius:var(--r-2xl);margin:auto;}
  .sheet-overlay{align-items:center;}
  .notes-grid{grid-template-columns:repeat(3,1fr);}
  .yr-grid{grid-template-columns:repeat(4,1fr);}
}
@media(min-width:900px){
  .app-content{max-width:480px;margin:0 auto;}
  .bottom-nav{max-width:480px;left:50%;transform:translateX(-50%);}
}
