/* Telegram-sized layout. Enabled on narrow screens or with ?mini=1. */
.mini-tabs,.mini-add{display:none}
.mini-layout{
  --mini-safe-top:max(env(safe-area-inset-top,0px),var(--mini-telegram-top,0px));
  --mini-safe-right:max(env(safe-area-inset-right,0px),var(--mini-telegram-right,0px));
  --mini-safe-bottom:max(env(safe-area-inset-bottom,0px),var(--mini-telegram-bottom,0px));
  --mini-safe-left:max(env(safe-area-inset-left,0px),var(--mini-telegram-left,0px));
  --mini-width:460px;
  -webkit-text-size-adjust:100%;text-size-adjust:100%;
}
.mini-layout body{min-height:100dvh;background-attachment:scroll;background-position:center center}
.mini-layout #app{width:100%;max-width:var(--mini-width);margin:0 auto;min-height:var(--tg-viewport-stable-height,100dvh);padding:0;display:block;border:0;border-radius:0;background:linear-gradient(160deg,#27221fe8,#1c1a19dc);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;isolation:isolate}
.mini-layout #app>aside,.mini-layout .topbar{display:none}
.mini-layout main{width:100%;padding:calc(18px + var(--mini-safe-top)) calc(16px + var(--mini-safe-right)) calc(106px + var(--mini-safe-bottom)) calc(16px + var(--mini-safe-left));min-width:0}
.mini-layout .page-toolbar{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:center;margin:0 0 18px}
.mini-layout .page-title{font-size:26px;line-height:1.2;margin:0;letter-spacing:-.5px;overflow-wrap:anywhere}
.mini-layout .page-toolbar .month{grid-column:1/-1;width:100%;display:flex;justify-content:space-between;align-items:center;margin:0;padding:4px 6px;border-radius:14px;background:#ffffff07;border:1px solid #ffffff10;font-size:14px;gap:10px;min-height:46px}
.mini-layout .month button{width:38px;height:36px;border-radius:10px;background:transparent}
.mini-layout .month button svg{width:18px;height:18px}
.mini-layout .card{padding:18px;border-radius:21px;background:linear-gradient(135deg,#53483b52,#302b285e);border-color:#f0d3b82a;min-width:0}
.mini-layout h2{font-size:16px;line-height:1.35;font-weight:600}
.mini-layout .section-head{gap:10px;margin-bottom:15px;min-height:27px}
.mini-layout .text-btn{font-size:12px;min-width:32px;min-height:32px;justify-content:center}
.mini-layout .badge{font-size:11px;padding:5px 9px;max-width:100%;white-space:normal;text-align:center}
.mini-layout p,.mini-layout .hint{font-size:13px;line-height:1.65}
.mini-layout .board-grid{display:flex;flex-direction:column;gap:14px}
.mini-layout .board-left,.mini-layout .board-center,.mini-layout .board-right,.mini-layout .board-bottom{display:contents}
.mini-layout .flow-card{order:0;padding:18px 0 0}
.mini-layout .quick-actions{order:1;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mini-layout .accounts-card{order:2}
.mini-layout .savings-card{order:3}
.mini-layout .categories-card{order:4}
.mini-layout .weekly-card{order:5}
.mini-layout .care-mini{order:6}
.mini-layout .next-card{order:7}
.mini-layout .recent-card{order:8}
.mini-layout .flow-card .section-head,.mini-layout .flow-top{padding:0 18px}
.mini-layout .flow-top strong{font-size:36px;line-height:1.2;letter-spacing:-1px}
.mini-layout .flow-top small{font-size:12px;margin-top:5px}
.mini-layout .flow-icon{display:none}
.mini-layout .flow-chart{height:80px;margin-top:20px}
.mini-layout .chart-labels{padding:6px 16px 16px;font-size:10px}
.mini-layout .flow-totals{padding:15px 17px;gap:7px}
.mini-layout .flow-totals small{font-size:11px;line-height:1.3;margin-bottom:5px}
.mini-layout .flow-totals strong{font-size:17px;white-space:nowrap}
.mini-layout .quick-card{min-height:76px;padding:16px 13px;gap:10px;border-radius:18px;text-align:left}
.mini-layout .quick-card strong{font-size:16px}
.mini-layout .quick-icon{height:32px;width:32px}
.mini-layout .quick-icon svg{width:20px;height:20px}
.mini-layout .quick-card>svg{display:none}
.mini-layout .accounts-card{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mini-layout .accounts-card .section-head{grid-column:1/-1;margin:0 0 3px}
.mini-layout .accounts-card .account-line{padding:5px 0 0;display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0}
.mini-layout .accounts-card .account-line>.mini-avatar{display:none}
.mini-layout .accounts-card .account-line strong{font-size:12px;font-weight:400;color:#e1d7cd}
.mini-layout .accounts-card .account-line b{font-size:18px;line-height:1.3;font-weight:500;margin:0;overflow-wrap:anywhere;max-width:100%}
.mini-layout .savings-wheel.compact{max-width:230px;margin:0 auto 5px}
.mini-layout .compact .savings-center{gap:6px}
.mini-layout .compact .savings-center>span{font-size:11px}
.mini-layout .compact .savings-center strong{font-size:25px}
.mini-layout .compact .circle-controls button{height:30px;width:30px}
.mini-layout .compact .circle-controls svg{height:14px;width:14px}
.mini-layout .savings-mini-legend{margin:4px 0 14px;gap:12px}
.mini-layout .savings-mini-legend>div,.mini-layout .savings-mini-legend strong{font-size:13px}
.mini-layout .add-pot{font-size:14px;min-height:46px;padding:12px}
.mini-layout .categories-card{padding:18px 12px 12px}
.mini-layout .category-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.mini-layout .category-tile{min-height:120px;padding:13px;border-radius:16px}
.mini-layout .tile-top{margin-bottom:10px}
.mini-layout .tile-top svg{width:20px;height:20px}
.mini-layout .tile-plus{width:25px;height:20px;font-size:16px}
.mini-layout .category-tile strong{font-size:22px;line-height:1.2;max-width:100%;overflow-wrap:anywhere}
.mini-layout .category-tile>span{font-size:13px;line-height:1.4}
.mini-layout .category-tile small{font-size:11px;line-height:1.4;color:#d5c9bd}
.mini-layout .tile-track{margin-top:10px}
.mini-layout .weekly-bars{height:140px;gap:13px;padding:0 2px}
.mini-layout .bar-item small,.mini-layout .bar-item>span{font-size:11px}
.mini-layout .care-mini{display:block;min-height:0}
.mini-layout .care-mini h2{font-size:16px}
.mini-layout .care-amount{font-size:30px}
.mini-layout .care-amount small{font-size:13px}
.mini-layout .care-mini p{font-size:13px}
.mini-layout .care-footer{font-size:12px;padding-top:12px;margin-top:12px}
.mini-layout .care-footer strong{font-size:14px}
.mini-layout .monthly-salaries{grid-template-columns:1fr 1fr;gap:9px}
.mini-layout .monthly-salary{padding:12px 10px;gap:8px}
.mini-layout .monthly-salary .mini-avatar{width:27px;height:27px;flex-shrink:0;font-size:11px}
.mini-layout .monthly-salary>div>span{font-size:11px}
.mini-layout .monthly-salary strong{font-size:17px}
.mini-layout .monthly-total{font-size:13px;margin-top:13px;padding-top:13px}
.mini-layout .monthly-total strong{font-size:16px}
.mini-layout .empty{padding:15px 5px}
.mini-layout .empty h3{font-size:15px}
.mini-layout .primary,.mini-layout .secondary{font-size:14px;padding:12px 16px;min-height:46px;border-radius:12px}
.mini-layout .empty .secondary{margin-top:12px}
.mini-layout .mini-tabs{position:fixed;bottom:calc(10px + var(--mini-safe-bottom));left:50%;transform:translateX(-50%);z-index:20;width:calc(100% - 28px - var(--mini-safe-left) - var(--mini-safe-right));max-width:432px;min-height:68px;display:grid;grid-template-columns:1fr 1fr 56px 1fr 1fr;align-items:center;padding:7px 7px;gap:3px;background:linear-gradient(140deg,#3a3531f7,#242526f7);border:1px solid #ddc9b536;border-radius:22px;box-shadow:0 8px 35px #0006;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.mini-layout .mini-tabs>button{width:100%;height:51px;min-width:0;padding:5px 1px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:14px;background:transparent;border:0;color:#cfc6bd;transform:none;flex:initial}
.mini-layout .mini-tabs>button::before{display:none}
.mini-layout .mini-tabs>button>span{font-size:10px;line-height:1.1;white-space:nowrap}
.mini-layout .mini-tabs>button>svg{width:21px;height:21px}
.mini-layout .mini-tabs>button.selected{color:#91d9ff;background:#43bfff0e}
.mini-layout .mini-tabs>button.mini-record{width:46px;height:46px;justify-self:center;background:linear-gradient(140deg,#62cbfa,#37b7ef);color:#143747;border:1px solid #b6e8ff60;border-radius:16px;box-shadow:0 2px 12px #30baff28}
.mini-layout .mini-tabs>.mini-record>svg{width:25px;height:25px}
.mini-layout .mini-tabs>button:active{background:#ffffff19}
.mini-layout dialog{position:fixed;inset:auto 0 0;width:100%;max-width:var(--mini-width);max-height:calc(var(--mini-visible-height,100dvh) - var(--mini-safe-top) - 14px);margin:0 auto;padding:22px 20px calc(22px + var(--mini-safe-bottom));border-radius:25px 25px 0 0;border:1px solid #f4ddc53b;border-bottom:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scroll-padding-bottom:80px;background:linear-gradient(145deg,#403a35fa,#222526fa)}
.mini-layout dialog::before{content:'';display:block;height:4px;width:34px;background:#ffffff40;border-radius:5px;margin:-9px auto 19px}
.mini-layout dialog .section-head{margin-bottom:20px}
.mini-layout dialog h2{font-size:22px}
.mini-layout dialog .close{width:44px;height:44px;flex:0 0 44px;padding:0;display:grid;place-items:center;border:1px solid #ead7c322;border-radius:50%;background:#ffffff08;color:#e7dfd6;line-height:1;box-shadow:none;-webkit-appearance:none;appearance:none}
.mini-layout dialog .close svg{display:block;width:20px;height:20px;pointer-events:none}
.mini-layout button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.mini-layout button:focus:not(:focus-visible){outline:none}
.mini-layout button:focus-visible{outline:2px solid #ddc49d;outline-offset:3px}
.mini-layout dialog h2:focus{outline:none}
.mini-layout dialog .close:active{background:#ffffff16;transform:scale(.96)}
.mini-layout .form-grid{grid-template-columns:1fr;gap:16px}
.mini-layout .form-grid .full{grid-column:auto}
.mini-layout label{font-size:13px;line-height:1.5;gap:7px}
.mini-layout input,.mini-layout select{font-size:16px;line-height:1.3;min-height:48px;padding:13px;width:100%;max-width:100%;min-width:0;border-radius:11px;box-sizing:border-box}
.mini-layout input[type=date],.mini-layout input[type=month]{display:block;-webkit-appearance:none;appearance:none;text-align:left}
.mini-layout dialog form>.primary{position:sticky;bottom:0;margin-top:21px;min-height:49px;box-shadow:0 7px 23px #191b1c}
.mini-layout dialog .hint{font-size:12px;margin-top:15px}
.mini-layout .mini-more-grid{display:grid;gap:7px}
.mini-layout .mini-more-grid>button{display:flex;align-items:center;gap:13px;text-align:left;padding:15px 12px;background:#ffffff06;border:1px solid #ffffff0d;border-radius:13px;min-height:57px;font-size:15px}
.mini-layout .mini-more-grid>button>svg:last-child{margin-left:auto;color:#c7c5bf}
.mini-layout .mini-more-grid>button>svg:first-child{color:#aadfff}
.mini-layout .settings-grid,.mini-layout .columns,.mini-layout .savings-layout,.mini-layout .pots-grid{grid-template-columns:1fr;gap:14px}
.mini-layout .savings-summary{position:static}
.mini-layout .savings-wheel{max-width:280px}
.mini-layout .savings-center>span{font-size:12px}
.mini-layout .savings-center strong{font-size:28px}
.mini-layout .savings-center .circle-controls button{height:31px;width:31px}
.mini-layout .pot-amount{font-size:31px}
.mini-layout .pot-progress-label{font-size:11px;line-height:1.5;gap:12px}
.mini-layout .pot-month{font-size:12px;margin-top:17px}
.mini-layout .pot-actions{gap:10px}
.mini-layout .pot-actions button{font-size:13px;flex:1;padding:11px 10px}
.mini-layout .create-pot-card{min-height:140px;gap:12px}
.mini-layout .create-pot-card strong{font-size:16px}
.mini-layout .budget-row{grid-template-columns:minmax(0,1fr) auto;font-size:13px;gap:10px;padding:16px 0;align-items:start}
.mini-layout .budget-row strong{font-size:13px;text-align:right;line-height:1.6}
.mini-layout .budget-row small{font-size:11px;line-height:1.5}
.mini-layout .filters{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:16px}
.mini-layout .filters #search{grid-column:1/-1;width:100%;min-width:0}
.mini-layout .filters select{font-size:13px;width:100%;padding:11px 8px;min-height:44px}
.mini-layout :is(#transaction-table,.recent-card) table,.mini-layout :is(#transaction-table,.recent-card) tbody{display:block;width:100%}
.mini-layout :is(#transaction-table,.recent-card) thead{display:none}
.mini-layout :is(#transaction-table,.recent-card) tbody{display:grid;gap:10px}
.mini-layout :is(#transaction-table,.recent-card) tr{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;padding:10px 11px;background:#ffffff05;border:1px solid #ffffff0c;border-radius:13px;font-size:13px}
.mini-layout :is(#transaction-table,.recent-card) td{border:0;padding:3px 0;min-width:0;line-height:1.5;width:auto;text-align:left}
.mini-layout :is(#transaction-table,.recent-card) td:first-child{grid-column:1;grid-row:1;overflow-wrap:anywhere}
.mini-layout :is(#transaction-table,.recent-card) td:nth-child(2){grid-column:1;grid-row:2;font-size:11px;color:#d2c6ba}
.mini-layout :is(#transaction-table,.recent-card) td:nth-child(3){grid-column:1;grid-row:3}
.mini-layout :is(#transaction-table,.recent-card) td:nth-child(4){grid-column:2;grid-row:1;text-align:right;font-size:14px}
.mini-layout :is(#transaction-table,.recent-card) td:nth-child(5){grid-column:2;grid-row:2/4;text-align:right}
.mini-layout :is(#transaction-table,.recent-card) td small{font-size:11px;line-height:1.4}
.mini-layout .chip{font-size:10px;padding:4px 7px}
.mini-layout .delete{min-height:36px;min-width:36px;font-size:23px;padding:0}
.mini-layout .mini-agenda{display:grid;gap:13px}
.mini-layout .agenda-day>h2{font-size:14px;color:#e8d6c2;text-transform:capitalize;margin-bottom:9px}
.mini-layout .agenda-row{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid #ffffff12;min-width:0}
.mini-layout .agenda-row:last-child{border:0;padding-bottom:0}
.mini-layout .agenda-icon{display:grid;place-items:center;height:33px;width:33px;border-radius:11px;background:#42bfff12;color:#92d9fa;flex-shrink:0}
.mini-layout .agenda-row>div{min-width:0;flex:1}
.mini-layout .agenda-row strong{font-size:13px;font-weight:500;display:block;overflow-wrap:anywhere}
.mini-layout .agenda-row small{font-size:11px;color:#cfc0b3;display:block;margin-top:4px}
.mini-layout .agenda-row b{font-size:13px;font-weight:500;white-space:nowrap;flex-shrink:0}
.mini-layout .goal-dial{max-width:230px}
.mini-layout .goal-amount{font-size:27px}
.mini-layout .goal-amount small{font-size:13px}
.mini-layout .cosmetic-value{font-size:30px}
.mini-layout .cosmetic .bottom{font-size:13px}
.mini-layout .banner{font-size:12px;padding:13px;gap:10px;flex-wrap:wrap}
.mini-layout #toast{bottom:calc(94px + var(--mini-safe-bottom));max-width:calc(100% - 36px);width:max-content;font-size:13px;line-height:1.5;padding:12px 17px;text-align:center}
.mini-preview #app{margin:20px auto;min-height:calc(100dvh - 40px);border:1px solid #edd7c536;border-radius:28px;box-shadow:0 24px 80px #0005;overflow:hidden}
.mini-preview .mini-tabs{bottom:16px}
@media(max-width:359px){.mini-layout main{padding-left:12px;padding-right:12px}.mini-layout .card{padding:15px}.mini-layout .categories-card{padding:15px 10px 10px}.mini-layout .page-title{font-size:24px}.mini-layout .mini-tabs{width:calc(100% - 18px);padding:6px 4px;grid-template-columns:1fr 1fr 48px 1fr 1fr;gap:0}.mini-layout .mini-tabs>button>span{font-size:9px}.mini-layout .flow-top strong{font-size:32px}.mini-layout .flow-totals strong{font-size:15px}.mini-layout .flow-totals small{font-size:10px}.mini-layout .monthly-salary .mini-avatar{display:none}.mini-layout .monthly-salary strong{font-size:17px}.mini-layout .category-tile strong{font-size:20px}.mini-layout .category-tile>span{font-size:12px}}
@media(prefers-reduced-motion:reduce){.mini-layout *{animation:none!important;transition:none!important}}
.mini-layout .board-grid{align-items:stretch}.mini-layout .board-grid>.card,.mini-layout .board-grid .board-left>.card,.mini-layout .board-grid .board-center>.card,.mini-layout .board-grid .board-right>.card,.mini-layout .board-grid .board-bottom>.card{width:100%}
/* iPhone: native type, readable labels, safe bottom area and larger touch targets. */
.mini-layout{--mini-width:430px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased}
.mini-layout .mini-tabs{max-width:calc(var(--mini-width) - 28px)}
.mini-layout .mini-tabs>button>span{font-size:11px}
.mini-layout .mini-tabs>button{min-height:52px}
.mini-layout h2{font-size:17px;line-height:1.4}
.mini-layout p,.mini-layout .hint{font-size:14px;line-height:1.65}
.mini-layout .page-title{font-size:27px}
.mini-layout .flow-top small{font-size:14px;line-height:1.4}
.mini-layout .flow-totals small{font-size:12px}
.mini-layout .flow-totals strong{font-size:18px}
.mini-layout .chart-labels{font-size:12px}
.mini-layout .accounts-card .account-line strong{font-size:14px}
.mini-layout .accounts-card .account-line b{font-size:20px}
.mini-layout .category-tile>span{font-size:15px}
.mini-layout .category-tile small{font-size:13px}
.mini-layout .category-tile{min-height:132px}
.mini-layout .tile-top svg{width:21px;height:21px}
.mini-layout .savings-wheel.compact{max-width:260px}
.mini-layout .compact .savings-center>span{font-size:13px}
.mini-layout .compact .savings-center strong{font-size:28px}
.mini-layout .savings-center .circle-controls button,.mini-layout .compact .circle-controls button{width:44px;height:44px;min-width:44px;min-height:44px}
.mini-layout .circle-controls svg,.mini-layout .compact .circle-controls svg{width:17px;height:17px}
.mini-layout .savings-mini-legend>div,.mini-layout .savings-mini-legend strong{font-size:14px}
.mini-layout .text-btn{min-height:40px}
.mini-layout .month button{min-height:40px;min-width:40px}
.mini-layout .course-actions .secondary{width:100%;font-size:15px;min-height:46px}
.mini-layout .care-mini h2{font-size:17px}
.mini-layout .care-amount small,.mini-layout .cosmetic-value small{font-size:14px}
.mini-layout .reserve-row-head>strong{font-size:15px;line-height:1.4}
.mini-layout .reserve-row-head>button{width:44px;height:44px;flex-shrink:0}
.mini-layout .reserve-amounts>small,.mini-layout .reserve-left{font-size:13px;line-height:1.5}
.mini-layout .reserve-amounts>span{font-size:22px}
.mini-layout .reserve-total{font-size:14px;line-height:1.4}
.mini-layout .reserve-total strong{font-size:17px;white-space:nowrap}
.mini-layout .budget-row{font-size:14px}
.mini-layout .budget-row small{font-size:12px}
.mini-layout .budget-row strong{font-size:14px}
.mini-layout .monthly-salary .mini-avatar{display:none}
.mini-layout .monthly-salary>div>span{font-size:14px}
.mini-layout .monthly-salary strong{font-size:20px}
.mini-layout .monthly-total{font-size:14px}
.mini-layout label{font-size:14px}
.mini-layout input,.mini-layout select{font-size:16px;min-height:50px}
.mini-layout .agenda-row strong{font-size:14px}
.mini-layout .agenda-row small{font-size:12px}
.mini-layout .agenda-row b{font-size:14px}
.mini-layout .agenda-day>h2{font-size:15px}
.mini-layout .form-error{font-size:14px;line-height:1.5}
@media(max-width:359px){.mini-layout .chart-labels{font-size:11px}.mini-layout .category-tile>span{font-size:14px}.mini-layout .category-tile small{font-size:12px}.mini-layout .flow-totals strong{font-size:16px}.mini-layout .monthly-salary strong{font-size:18px}.mini-layout .mini-tabs>button>span{font-size:10px}.mini-layout .reserve-total{flex-wrap:wrap}}
@supports(-webkit-touch-callout:none){.mini-layout input[type=date],.mini-layout input[type=month]{min-width:0;width:100%;max-width:100%;-webkit-appearance:none;appearance:none}.mini-layout input::-webkit-date-and-time-value{text-align:left;min-height:1.3em}.mini-layout body{background-attachment:scroll}}
/* Original portrait artwork, composed for the phone rather than cropped from a wide room. */
.mini-layout body::before{position:fixed;inset:0 auto 0 50%;transform:translateX(-50%);width:100%;max-width:var(--mini-width,430px);height:100dvh;z-index:0;pointer-events:none;background:linear-gradient(160deg,#160f0a30,#100c071f),url('cozy-room-mobile-v2.png') center center/cover no-repeat}
@media(max-width:640px){.mini-layout body{background:#21160e}}