:root{
  --bg:#07071A; --card:#10102A; --card2:#1B1B40; --line:#242450;
  --cyan:#9B7BFF; --blue:#6C7BFF; --sky:#5FB6FF;
  --green:#3FDC9B; --red:#FF7A8A; --amber:#FFC24B; --violet:#7B61FF;
  --text:#F3F1FF; --muted:#8A88B4; --lite:#BDBAE6;
  --grad:linear-gradient(135deg,#7B61FF,#B07CFF);
}
*{box-sizing:border-box; margin:0; padding:0; -webkit-tap-highlight-color:transparent;}
body{
  background:
    radial-gradient(ellipse 90% 40% at 15% -5%, rgba(80,70,200,.16), transparent 60%),
    radial-gradient(ellipse 70% 35% at 95% 8%, rgba(60,120,220,.10), transparent 60%),
    var(--bg);
  color:var(--text);
  font-family:"Segoe UI Variable Text","Segoe UI",-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
  max-width:480px; margin:0 auto; min-height:100vh;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
#app{padding:16px 14px 0; display:flex; flex-direction:column; min-height:100vh;}
button{font-family:inherit;}

/* общие SVG-иконки (контурные) */
.ic{fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;}

/* ---------- шапка ---------- */
.topbar{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;}
.hello-name{font-size:23px; font-weight:800; letter-spacing:.2px;}
.hello-sub{font-size:12.5px; color:var(--muted); margin-top:2px;}
.avatar{position:relative; width:48px; height:48px; border-radius:50%; background:var(--grad);
  background-size:cover; background-position:center;
  display:flex; align-items:center; justify-content:center; font-size:17px; font-weight:700; color:#fff;
  box-shadow:0 0 0 2.5px rgba(108,123,255,.8), 0 0 22px rgba(108,123,255,.45);}
.avatar::after{content:""; position:absolute; right:0; bottom:0; width:11px; height:11px;
  border-radius:50%; background:var(--green); border:2.5px solid var(--bg);}
.topbar-txt{flex:1;}
.bell{width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.04);
  border:1px solid var(--line); cursor:pointer; margin-right:12px; color:var(--lite);
  display:flex; align-items:center; justify-content:center;}
.bell svg{width:19px; height:19px;}
.bell:active{transform:scale(.92); background:var(--card2);}

.screen{flex:1;}
.screen-title{font-size:21px; font-weight:700; margin:2px 0 12px;}
.tappable{cursor:pointer;}
.tappable:active{opacity:.75;}
.muted{color:var(--muted);}
.mini-label{font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);}

/* ---------- герой-карта баланса ---------- */
.hero{position:relative; overflow:hidden;
  background:linear-gradient(155deg,#20265F 0%,#171B4C 45%,#0E1136 100%);
  border:1px solid rgba(108,123,255,.35); border-radius:24px; padding:18px 18px 12px; margin-bottom:14px;
  box-shadow:0 14px 40px rgba(40,50,160,.35);}
.hero-glow{position:absolute; top:-80px; right:-40px; width:260px; height:260px; border-radius:50%;
  background:radial-gradient(circle,rgba(108,123,255,.30),transparent 65%); pointer-events:none;}
.hero-glow2{position:absolute; bottom:-90px; left:-60px; width:240px; height:240px; border-radius:50%;
  background:radial-gradient(circle,rgba(150,100,255,.16),transparent 65%); pointer-events:none;}
.hero-top{display:flex; align-items:center; justify-content:space-between; position:relative;}
.hero-label{display:flex; align-items:center; gap:7px;
  font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--lite);}
.hero-label svg{width:16px; height:16px; opacity:.9;}
.live{display:flex; align-items:center; gap:5px; font-size:10px; font-weight:700; letter-spacing:.1em; color:var(--green);}
.live i{width:7px; height:7px; border-radius:50%; background:var(--green);
  box-shadow:0 0 8px var(--green); animation:blink 1.6s infinite;}
@keyframes blink{50%{opacity:.35;}}

.hero-body{display:flex; gap:8px; margin-top:8px; position:relative;}
.hero-left{flex:1; min-width:0; display:flex; flex-direction:column; align-items:flex-start;}
.hero-total{font-size:clamp(30px,9.6vw,42px); font-weight:800; letter-spacing:.5px;
  font-variant-numeric:tabular-nums; white-space:nowrap; line-height:1.15;
  text-shadow:0 2px 18px rgba(120,110,255,.35);}
.period-pill{display:flex; align-items:center; gap:6px; margin:10px 0 14px;
  background:rgba(255,255,255,.06); border:1px solid rgba(160,150,255,.30); border-radius:20px;
  padding:6px 13px; color:#CFC8FF; font-size:12px; font-weight:600; cursor:pointer;}
.period-pill svg{width:12px; height:12px;}
.period-pill:active{background:rgba(255,255,255,.1);}
.hero-flows{display:flex; gap:0; margin-top:10px;}
.flow{display:flex; flex-direction:column; gap:3px; min-width:0;}
.flow-sep{width:1px; background:rgba(160,150,255,.22); margin:2px 16px;}
.flow-label{font-size:11.5px; color:var(--lite); opacity:.85;}
.flow-val{font-size:14.5px; font-weight:800; font-variant-numeric:tabular-nums; white-space:nowrap;}
.flow-cmp{font-size:9.5px; color:var(--lite); opacity:.7; white-space:nowrap;}
.up{color:var(--green);} .down{color:var(--red);} .amber{color:var(--amber);}

/* график справа в герой-карте */
.hero-chart{position:relative; width:50%; min-width:145px; display:flex; flex-direction:column;}
.hero-bubble{position:absolute; top:0; right:2px; z-index:2;
  background:rgba(10,12,40,.78); backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.18); border-radius:12px;
  padding:4px 11px; font-size:11.5px; font-weight:800; white-space:nowrap; pointer-events:none;}
.hero-chart svg{width:100%; flex:1; min-height:118px; display:block; margin-top:6px;}
.hero-months{display:flex; justify-content:space-between; padding:4px 6px 2px;
  font-size:9.5px; color:var(--lite); opacity:.75;}
.hero-months .on{color:#C9A8FF; font-weight:700; opacity:1;}
.hero-dots{display:flex; justify-content:center; gap:6px; padding:10px 0 4px;}
.hero-dots i{width:6px; height:6px; border-radius:3px; background:rgba(255,255,255,.18);}
.hero-dots i.on{width:22px; background:var(--grad); box-shadow:0 0 8px rgba(140,110,255,.6);}

/* ---------- карточки счетов с мини-диаграммой ---------- */
.acc-cards{display:flex; gap:10px; margin-bottom:12px;}
.acc-card{flex:1; padding:14px 14px 12px; border-radius:20px; cursor:pointer; min-width:0;}
.acc-card:active{opacity:.85; transform:scale(.98);}
.acc-card.card{background:linear-gradient(155deg,#252059,#141239);
  border:1px solid rgba(123,97,255,.45); box-shadow:0 8px 26px rgba(70,50,180,.28);}
.acc-card.cash{background:linear-gradient(155deg,#0F3038,#0A1F2E);
  border:1px solid rgba(63,220,155,.35); box-shadow:0 8px 26px rgba(20,110,85,.22);}
.acc-head{display:flex; align-items:center; gap:10px;}
.acc-ico{width:40px; height:40px; min-width:40px; border-radius:12px;
  display:flex; align-items:center; justify-content:center; font-size:19px;}
.acc-card.card .acc-ico{background:linear-gradient(145deg,#6C5CE7,#8E6CFF);
  box-shadow:0 4px 14px rgba(123,97,255,.5);}
.acc-card.cash .acc-ico{background:linear-gradient(145deg,#0F5F46,#1B8A62);
  box-shadow:0 4px 14px rgba(40,170,120,.4);}
.acc-name{font-size:13px; color:var(--lite); font-weight:600;}
.acc-card .chev{margin-left:auto; color:var(--muted); font-size:19px;}
.acc-bal{font-size:19px; font-weight:800; margin-top:9px; font-variant-numeric:tabular-nums;
  white-space:nowrap;}
.acc-bars{display:flex; align-items:flex-end; gap:2px; height:26px; margin-top:10px;}
.acc-bars i{flex:1; border-radius:1.5px;}
.acc-card.card .acc-bars i{background:#8E7BFF;}
.acc-card.cash .acc-bars i{background:#3FDC9B;}

/* ---------- быстрые действия: круглые неон-кнопки ---------- */
.quick{display:flex; gap:7px; margin-bottom:12px;}
.qbtn{flex:1; background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:18px;
  padding:13px 2px 11px; color:var(--text); cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:8px; min-width:0;}
.qbtn:active{transform:scale(.94); background:var(--card2);}
.qbtn b{font-size:10.5px; font-weight:600; color:var(--lite);}
.qring{width:44px; height:44px; border-radius:50%; border:1.8px solid;
  display:flex; align-items:center; justify-content:center;}
.qring svg{width:20px; height:20px;}
.qr-green{color:var(--green); border-color:rgba(63,220,155,.65);
  box-shadow:0 0 14px rgba(63,220,155,.30), inset 0 0 10px rgba(63,220,155,.10);}
.qr-red{color:var(--red); border-color:rgba(255,122,138,.65);
  box-shadow:0 0 14px rgba(255,122,138,.30), inset 0 0 10px rgba(255,122,138,.10);}
.qr-blue{color:var(--sky); border-color:rgba(95,182,255,.65);
  box-shadow:0 0 14px rgba(95,182,255,.30), inset 0 0 10px rgba(95,182,255,.10);}
.qr-amber{color:#FFB65C; border-color:rgba(255,182,92,.6);
  box-shadow:0 0 14px rgba(255,182,92,.28), inset 0 0 10px rgba(255,182,92,.10);}
.qr-violet{color:#B07CFF; border-color:rgba(176,124,255,.65);
  box-shadow:0 0 14px rgba(176,124,255,.35), inset 0 0 10px rgba(176,124,255,.10);}

/* ---------- пончики: накопления и долги ---------- */
.donut-stats{display:flex; gap:10px; margin-bottom:12px;}
.dstat{flex:1; background:var(--card); border:1px solid var(--line); border-radius:20px;
  padding:13px 14px; min-width:0;}
.dstat-head{display:flex; justify-content:space-between; align-items:center;
  font-size:13px; font-weight:700; color:var(--text); margin-bottom:10px;}
.dstat-head .chev{color:var(--muted); font-size:16px; font-weight:400;}
.dstat-body{display:flex; align-items:center; gap:11px;}
.donut{position:relative; width:58px; height:58px; min-width:58px;}
.donut svg{width:100%; height:100%; transform:rotate(-90deg);}
.donut-bg{fill:none; stroke:var(--card2); stroke-width:6;}
.donut-fg{fill:none; stroke-width:6; stroke-linecap:round;
  filter:drop-shadow(0 0 5px rgba(155,123,255,.55)); transition:stroke-dashoffset .6s ease;}
.donut-pct{position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:12.5px; font-weight:800;}
.dstat-val{font-size:17px; font-weight:800; font-variant-numeric:tabular-nums;}
.dstat-sub{font-size:10.5px; color:var(--muted); margin-top:3px; line-height:1.35;}
.dstat-sub2{font-size:10px; color:var(--muted); margin-top:5px;}
.dstat-info{flex:1; min-width:0;}
.goal-track{height:5px; background:var(--card2); border-radius:3px; margin-top:7px; overflow:hidden;}
.goal-fill{height:100%; background:linear-gradient(90deg,#5FB6FF,#8E6CFF); border-radius:3px;
  box-shadow:0 0 8px rgba(140,120,255,.6); transition:width .5s ease;}

/* ---------- больше всего ушло (огонь 🔥) ---------- */
.leak{display:flex; align-items:center; gap:11px;
  background:linear-gradient(150deg,rgba(255,100,70,.10),rgba(200,60,60,.04)), var(--card);
  border:1px solid rgba(255,130,90,.32); border-radius:20px; padding:13px 14px; margin-bottom:12px;
  cursor:pointer;}
.leak:active{opacity:.85;}
.leak-ico{width:44px; height:44px; min-width:44px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, rgba(255,150,80,.35), rgba(255,90,60,.14));
  box-shadow:0 0 16px rgba(255,120,60,.4);
  display:flex; align-items:center; justify-content:center; font-size:20px;}
.leak-main{min-width:0;}
.leak-title{font-size:11px; color:var(--muted);}
.leak-cat{font-size:16px; font-weight:800; margin-top:1px; text-transform:capitalize;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.leak-spark{width:80px; height:34px; min-width:56px; margin-left:auto;}
.leak-amt{text-align:right;}
.leak-amt b{display:block; font-size:15px; color:var(--amber); font-variant-numeric:tabular-nums; white-space:nowrap;}
.leak-amt span{font-size:10px; color:var(--muted);}
.leak .chev{color:var(--muted); font-size:18px;}

/* ---------- списки ---------- */
.section-head{display:flex; align-items:center; justify-content:space-between; margin:8px 2px 9px;}
.section-title{font-size:12px; color:var(--muted); margin:4px 2px 8px; display:block;}
.section-head .section-title{margin:0; font-size:15px; font-weight:700; color:var(--text);}
.link-btn{background:none; border:none; color:var(--blue); font-size:12.5px; font-weight:700; cursor:pointer;}
.recent-list{display:flex; flex-direction:column; gap:5px;}
.row{display:flex; align-items:center; gap:11px; padding:10px 11px;
  background:var(--card); border:1px solid var(--line); border-radius:16px;}
.row-ico{width:38px; height:38px; min-width:38px; border-radius:50%; background:var(--card2);
  display:flex; align-items:center; justify-content:center; font-size:17px;}
.row-main{flex:1; min-width:0;}
.row-name{font-size:13.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.row-sub{font-size:11px; color:var(--muted); margin-top:1px;}
.row-amt{font-size:14.5px; font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums;}
.row-amt.income{color:var(--green);} .row-amt.expense{color:var(--red);}
.row-amt.save,.row-amt.unsave{color:var(--cyan);}
.row-amt.transfer{color:var(--sky);}
.row-amt.adjustment_in,.row-amt.debt_take,.row-amt.debt_repaid{color:var(--green);}
.row-amt.adjustment_out,.row-amt.debt_give,.row-amt.debt_paid{color:var(--red);}
.day-head{font-size:12.5px; font-weight:700; color:var(--lite); margin:14px 2px 7px;}
.day-head:first-child{margin-top:4px;}
.row-del{cursor:pointer;}
.row-del:active{background:var(--card2);}
.row-chev{color:var(--muted); font-size:17px; margin-left:-2px;}

/* ---------- нижняя навигация ---------- */
.tab-space{height:92px;}
.tabbar{position:fixed; bottom:0; left:50%; transform:translateX(-50%);
  width:100%; max-width:480px; display:flex; align-items:flex-end;
  background:rgba(7,7,26,.92); backdrop-filter:blur(16px);
  border-top:1px solid var(--line); border-radius:22px 22px 0 0;
  padding:9px 6px calc(10px + env(safe-area-inset-bottom)); z-index:20;}
.tab{flex:1; background:none; border:none; color:var(--muted); font-size:9.5px; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:4px; padding-top:4px;}
.tab svg{width:21px; height:21px;}
.tab.active{color:#A88CFF;}
.tab.active svg{filter:drop-shadow(0 0 8px rgba(155,123,255,.7));}
.tab::after{content:""; width:16px; height:2.5px; border-radius:2px; background:transparent; margin-top:1px;}
.tab.active::after{background:var(--grad); box-shadow:0 0 8px rgba(155,123,255,.7);}
.fab-slot{flex:1.15; display:flex; justify-content:center;}
.fab{position:relative; width:64px; height:64px; border-radius:50%; border:none;
  background:linear-gradient(145deg,#8A63FF,#B07CFF 60%,#C98BFF);
  cursor:pointer; margin-top:-30px; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 28px rgba(123,97,255,.6), 0 0 0 5px var(--bg), inset 0 1px 2px rgba(255,255,255,.4);}
.fab-mic-ico{width:27px; height:27px; position:relative; z-index:2;
  filter:drop-shadow(0 1px 2px rgba(40,10,90,.5));}
.fab-ring{position:absolute; inset:-5px; border-radius:50%;
  border:2px solid rgba(179,124,255,.55); opacity:0;}
.fab:active{transform:scale(.93);}
.fab.listening{animation:fabpulse 1.1s infinite;}
.fab.listening .fab-ring{animation:fabring 1.3s infinite;}
@keyframes fabpulse{0%,100%{box-shadow:0 8px 26px rgba(123,97,255,.6),0 0 0 5px var(--bg);}
  50%{box-shadow:0 8px 34px rgba(179,124,255,1),0 0 0 5px var(--bg);}}
@keyframes fabring{0%{opacity:.7; transform:scale(1);}100%{opacity:0; transform:scale(1.5);}}

/* ---------- шторка добавления ---------- */
.sheet-back{position:fixed; inset:0; background:rgba(2,4,14,.65); backdrop-filter:blur(3px); z-index:29;}
.add-panel{position:fixed; bottom:0; left:50%; transform:translateX(-50%);
  width:100%; max-width:480px; background:#12122E;
  border:1px solid var(--line); border-bottom:none; border-radius:24px 24px 0 0;
  padding:10px 16px calc(18px + env(safe-area-inset-bottom)); z-index:30;
  box-shadow:0 -12px 40px rgba(0,0,0,.5);}
.sheet-grip{width:38px; height:4px; border-radius:2px; background:var(--card2); margin:0 auto 12px;}
.add-title{font-size:15px; font-weight:700; margin-bottom:10px;}
.acc-seg{margin-bottom:10px;}
.add-row{display:flex; gap:8px;}
.add-input{width:100%; background:var(--bg); border:1px solid var(--line); border-radius:13px;
  padding:13px 14px; color:var(--text); font-size:16px; font-family:inherit; outline:none;}
.add-input:focus{border-color:var(--cyan); box-shadow:0 0 0 3px rgba(155,123,255,.15);}
.add-input + .add-input{margin-top:8px;}
.add-hint{font-size:11px; color:var(--muted); margin:8px 2px 12px;}
.add-actions{display:flex; gap:8px;}
.add-cancel,.add-save{flex:1; border:none; border-radius:13px; padding:13px; font-size:14px;
  font-weight:700; cursor:pointer;}
.add-cancel{background:var(--card2); color:var(--text);}
.add-save{background:var(--grad); color:#fff; box-shadow:0 6px 18px rgba(123,97,255,.4);}
.add-save:active,.add-cancel:active{transform:scale(.98);}
.add-input.err{border-color:var(--red);}

.mic-btn{min-width:50px; border:none; border-radius:13px; background:var(--card2);
  font-size:20px; cursor:pointer; color:var(--text);}
.mic-btn.listening{background:var(--grad); color:#fff; animation:pulse 1s infinite;}
.mic-btn.mic-off{opacity:.35;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(123,97,255,.5);}70%{box-shadow:0 0 0 12px rgba(123,97,255,0);}100%{box-shadow:0 0 0 0 rgba(123,97,255,0);}}

/* ---------- аналитика ---------- */
.month-nav{display:flex; align-items:center; justify-content:space-between; margin-bottom:12px;}
.month-btn{width:40px; height:40px; border:1px solid var(--line); border-radius:13px; background:var(--card);
  color:var(--text); font-size:20px; cursor:pointer;}
.month-btn:active{background:var(--card2);}
.month-title{font-size:16px; font-weight:700;}

.stats{display:flex; gap:8px; margin-bottom:8px;}
.stat{flex:1; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:12px 14px;}
.stat-value{font-size:18px; font-weight:700; margin-top:3px; font-variant-numeric:tabular-nums;}
.balance-line{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
.balance-line .stat-value{margin-top:0;}

.chart-card{background:var(--card); border:1px solid var(--line); border-radius:18px;
  padding:13px 14px; margin-bottom:10px;}

.daily-chart{display:flex; align-items:flex-end; gap:2px; height:72px;}
.dbar-wrap{flex:1; height:100%; display:flex; align-items:flex-end;}
.dbar{width:100%; background:linear-gradient(180deg,var(--red),#B24558); border-radius:2px 2px 0 0;}

/* пончик по категориям */
.cat-donut-wrap{display:flex; justify-content:center; margin:8px 0 16px;}
.cat-donut{position:relative; width:132px; height:132px;}
.cat-donut svg{width:100%; height:100%;}
.cat-donut-center{position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center;}
.cat-donut-center b{font-size:17px; font-weight:800; font-variant-numeric:tabular-nums;}
.cat-donut-center span{font-size:9px; color:var(--muted); text-transform:uppercase;
  letter-spacing:.1em; margin-top:2px;}
.cat-top .dot{margin-right:6px;}

.cat-bars{display:flex; flex-direction:column; gap:11px;}
.cat-row{display:flex; align-items:center; gap:10px;}
.cat-ico{width:32px; height:32px; min-width:32px; border-radius:10px; background:var(--card2);
  display:flex; align-items:center; justify-content:center; font-size:15px;}
.cat-main{flex:1; min-width:0;}
.cat-top{display:flex; justify-content:space-between; font-size:12px; margin-bottom:4px;}
.cat-top b{font-weight:700;}
.cat-track{height:6px; background:var(--card2); border-radius:3px; overflow:hidden;}
.cat-fill{height:100%; background:var(--grad); border-radius:3px;}
.cat-pct{font-size:11px; color:var(--muted); min-width:32px; text-align:right;}

.trend-chart{display:flex; gap:6px; height:96px; align-items:flex-end;}
.tcol{flex:1; display:flex; flex-direction:column; height:100%;}
.tbars{flex:1; display:flex; gap:2px; align-items:flex-end; justify-content:center;}
.tbar{width:38%; border-radius:3px 3px 0 0;}
.tbar-in{background:var(--green);}
.tbar-ex{background:var(--red);}
.tcol-label{font-size:10px; color:var(--muted); text-align:center; margin-top:4px;}
.trend-legend{display:flex; gap:14px; font-size:11px; color:var(--muted); margin-top:8px;}
.dot{width:7px; height:7px; border-radius:50%; display:inline-block; margin-right:4px;}
.dot-green{background:var(--green);} .dot-red{background:var(--red);}

/* ---------- долги ---------- */
.ghost-btn{width:100%; background:var(--card); border:1px dashed var(--line); border-radius:15px;
  padding:13px; color:var(--cyan); font-size:14px; font-weight:700; cursor:pointer; margin-top:6px;}
.ghost-btn:active{background:var(--card2);}

.debt-form{background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:13px; margin-top:10px; display:flex; flex-direction:column; gap:8px;}
.seg{display:flex; background:var(--bg); border-radius:13px; padding:3px; gap:3px;}
.seg-btn{flex:1; border:none; border-radius:10px; background:none; color:var(--muted);
  padding:10px; font-size:13px; font-weight:700; cursor:pointer;}
.seg-btn.active{background:var(--grad); color:#fff;}
.check-line{font-size:12px; color:var(--muted); display:flex; align-items:center; gap:7px; padding:2px;}
.input-hint{font-size:11px; line-height:1.35; color:var(--muted); margin-top:-2px;}

.debt-row.settled{opacity:.4;}
.mini-btn{width:34px; height:34px; min-width:34px; border:none; border-radius:10px;
  font-size:14px; cursor:pointer;}
.mini-btn.ok{background:rgba(63,220,155,.14); color:var(--green);}
.mini-btn.del{background:rgba(255,122,138,.12); color:var(--red);}
.mini-btn:active{transform:scale(.92);}

/* ---------- поля ввода с подписью ---------- */
.field-label{display:block; font-size:11px; color:var(--lite); margin:12px 2px 5px;}

/* ---------- кабинет ---------- */
.profile-head{display:flex; align-items:center; gap:13px; margin-bottom:14px;}
.profile-ava{width:56px; height:56px; border-radius:50%; background:var(--grad);
  display:flex; align-items:center; justify-content:center; font-size:23px; font-weight:800; color:#fff;
  box-shadow:0 0 22px rgba(123,97,255,.45);}
.profile-name{font-size:18px; font-weight:700;}
.profile-plan{display:inline-block; font-size:11px; font-weight:700; margin-top:4px;
  color:var(--lite); background:var(--card2); border-radius:20px; padding:3px 10px;}
.profile-plan.pro{color:#04121F; background:linear-gradient(135deg,#FFC24B,#FF9F45);}
.profile-save{width:100%; margin-top:14px;}

.pro-card{background:linear-gradient(160deg,#2C2C77,#181850); border:1px solid rgba(140,130,255,.4);
  border-radius:20px; padding:16px; margin-bottom:10px; box-shadow:0 0 26px rgba(108,123,255,.18);}
.pro-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:12px;}
.pro-title{font-size:16px; font-weight:800;}
.pro-price{font-size:14px; font-weight:700; color:var(--cyan);}
.pro-list{list-style:none; display:flex; flex-direction:column; gap:8px; margin-bottom:14px;}
.pro-list li{font-size:13px; color:var(--lite);}
.pro-btn{width:100%;}

.prof-misc{padding:4px 14px;}
.misc-row{display:flex; align-items:center; justify-content:space-between; padding:13px 0;
  font-size:14px; border-bottom:1px solid var(--line); cursor:pointer;}
.misc-row:last-child{border-bottom:none;}
.misc-row:active{opacity:.7;}
.misc-row .chev{color:var(--muted); font-size:18px;}
.misc-row .soon,.misc-row .ver{font-size:11px; color:var(--muted); cursor:default;}

/* ---------- карточка редактирования операции ---------- */
.edit-head{display:flex; align-items:center; gap:12px; margin-bottom:6px;}
.edit-ico{width:44px; height:44px; min-width:44px; border-radius:50%; background:var(--card2);
  display:flex; align-items:center; justify-content:center; font-size:21px;}
.edit-sub{font-size:12px; color:var(--muted); margin-top:2px;}
.edit-panel .add-actions{margin-top:14px;}
.edit-panel .add-cancel{background:rgba(255,122,138,.14); color:var(--red);}
.edit-close{width:100%; margin-top:10px; background:none; border:none; color:var(--muted);
  font-size:13px; padding:8px; cursor:pointer;}

/* ---------- тост ---------- */
.toast{position:fixed; left:50%; bottom:120px; transform:translateX(-50%);
  background:var(--card2); color:var(--text); padding:11px 20px; border-radius:14px;
  font-size:13px; font-weight:700; box-shadow:0 8px 28px rgba(0,0,0,.5); z-index:99;
  white-space:nowrap; border:1px solid var(--line);}
.toast.ok{border-color:rgba(63,220,155,.4);}
.toast.err{border-color:rgba(255,122,138,.4);}

/* ---------- чипы категорий (панель записи и карточка операции) ---------- */
.cat-chips{display:flex; flex-wrap:wrap; gap:7px; margin:10px 0 2px;}
.chip{border:1px solid var(--line); background:var(--card2); color:var(--lite);
  border-radius:999px; padding:7px 12px; font-size:12.5px; font-weight:600; cursor:pointer;
  white-space:nowrap; transition:transform .06s;}
.chip:active{transform:scale(.94);}
.chip.on{background:var(--grad); color:#fff; border-color:transparent;
  box-shadow:0 0 14px rgba(123,97,255,.45);}

/* ---------- дата записи ---------- */
.date-row{display:flex; align-items:center; gap:8px; margin-top:10px;}
.date-quick{border:1px solid var(--line); background:var(--card2); color:var(--lite);
  border-radius:999px; padding:7px 14px; font-size:12.5px; font-weight:600; cursor:pointer;}
.date-quick:active{transform:scale(.94);}
.date-quick.on{background:var(--grad); color:#fff; border-color:transparent;}
.date-input{margin-left:auto; background:var(--card); border:1px solid var(--line);
  color:var(--text); border-radius:10px; padding:7px 10px; font-size:12.5px; font-family:inherit;}

/* ---------- управление категориями (кабинет) ---------- */
.cat-form{background:var(--card2); border:1px solid var(--line); border-radius:14px;
  padding:12px; margin:6px 0 12px; display:flex; flex-direction:column; gap:10px;}
.cat-form-row{display:flex; gap:8px;}
.cat-emoji-in{width:56px; text-align:center; font-size:18px; flex:none;}
.cat-group-title{font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); margin:12px 2px 7px;}
.cat-manage-list{display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-bottom:4px;}
.cat-manage-row{display:flex; align-items:center; gap:6px; background:var(--card);
  border:1px solid var(--line); border-radius:11px; padding:7px 8px; min-width:0;}
.cat-emoji-btn{background:none; border:none; font-size:16px; cursor:pointer; width:22px; flex:none; text-align:center;}
.cat-emoji-btn:active{transform:scale(.9);}
.cat-nm{flex:1; min-width:0; font-size:13px; font-weight:600; color:var(--text); cursor:pointer;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.cat-star{background:none; border:none; font-size:14px; cursor:pointer; opacity:.28;
  filter:grayscale(1); flex:none; padding:0 1px;}
.cat-star.on{opacity:1; filter:none;}
.cat-del{background:none; border:none; color:var(--muted); font-size:14px; cursor:pointer;
  padding:0 2px; flex:none;}
.cat-del:active{color:var(--red);}
.cat-empty{color:var(--muted); font-size:12.5px; padding:4px 2px;}
.cat-hint{color:var(--muted); font-size:11px; margin-top:10px; line-height:1.5;}
.cat-screen-head{display:flex; align-items:center; gap:10px; margin:2px 0 6px;}
.back-btn{width:40px; height:40px; flex:none; border-radius:50%; background:rgba(255,255,255,.04);
  border:1px solid var(--line); color:var(--lite); cursor:pointer;
  display:flex; align-items:center; justify-content:center;}
.back-btn svg{width:20px; height:20px;}
.back-btn:active{transform:scale(.92); background:var(--card2);}
.add-mini{flex:none; border:1px solid var(--line); background:var(--card2); color:var(--cyan);
  border-radius:999px; padding:8px 14px; font-size:12.5px; font-weight:700; cursor:pointer;}
.add-mini:active{transform:scale(.94);}
