/* বাকির খাতা — হিসাবের খাতার থিম: কাপড়ের মলাট, সোনালি ছাপ, রুলটানা পাতা, লাল ও নীল কালি */
:root{
  --desk:#e4ebe8; --paper:#f8faf8; --rule:#d3e2de; --margin:rgba(179,38,46,.42);
  --text:#18242a; --muted:#66767a; --line:#cbd8d4; --input:#ffffff;
  --red:#b3262e; --red-bg:#f8e7e6; --red-solid:#b3262e;
  --blue:#1f4e8c; --blue-bg:#e3ecf7; --blue-solid:#1f4e8c;
  --green:var(--blue); --green-bg:var(--blue-bg); --green-solid:var(--blue-solid); /* "জমা" = নীল কালি */
  --warn:#7a5200; --warn-bg:#f8edcf;
  --gold:#d9b65a; --gold-hi:#f3dfa2; --gold-ink:#3a0f18;
  --cover:#164638; --cover-deep:#0b2b23;
  --ink:#18242a; --ink-fg:#ffffff;
  --shadow:0 1px 0 rgba(0,0,0,.04),0 10px 24px -14px rgba(20,36,42,.35);
}
[data-theme="dark"]{
  --desk:#0c1113; --paper:#141b1e; --rule:#232f33; --margin:rgba(255,141,136,.30);
  --text:#e5ecea; --muted:#8a9d9f; --line:#2a373b; --input:#1a2326;
  --red:#ff8d88; --red-bg:#35191b; --red-solid:#c8353d;
  --blue:#86b6f2; --blue-bg:#16263b; --blue-solid:#2f6bb8;
  --warn:#f0c76b; --warn-bg:#352c11;
  --cover:#10382e; --cover-deep:#071f19;
  --ink:#d9b65a; --ink-fg:#2a0a11;
  --shadow:0 1px 0 rgba(255,255,255,.03),0 12px 28px -16px rgba(0,0,0,.85);
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--desk);color:var(--text);
  font-family:'Hind Siliguri','Noto Sans Bengali','Kalpurush','SolaimanLipi',system-ui,sans-serif;
  font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,.name,.amt,.big,.cover-title{font-family:'Tiro Bangla','Noto Serif Bengali','Kalpurush',serif;font-weight:400}
#app{max-width:560px;margin:0 auto;min-height:100vh;padding-bottom:96px}
#printArea{display:none}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 28%,transparent)}

/* ---------- মলাট (হেডার ও লগইন) ---------- */
.top,.login{
  position:relative;color:var(--gold-hi);
  background:
    linear-gradient(90deg,var(--cover-deep) 0,var(--cover-deep) 20px,rgba(0,0,0,.38) 20px,rgba(0,0,0,.38) 21px,transparent 21px),
    repeating-linear-gradient(45deg,rgba(255,255,255,.03) 0 2px,transparent 2px 4px),
    repeating-linear-gradient(-45deg,rgba(0,0,0,.06) 0 2px,transparent 2px 4px),
    var(--cover);
}
.top::before,.login::before{content:"";position:absolute;inset:12px 12px 12px 32px;border:1px solid rgba(217,182,90,.72);border-radius:3px;pointer-events:none}
.top::after,.login::after{content:"";position:absolute;inset:16px 16px 16px 36px;border:1px solid rgba(217,182,90,.26);border-radius:2px;pointer-events:none}
.top{padding:calc(env(safe-area-inset-top) + 30px) 30px 28px 52px;border-radius:0 0 14px 14px;box-shadow:var(--shadow)}
.top>*{position:relative;z-index:1}
.top .row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.top h1{margin:0;font-size:21px;line-height:1.3;color:var(--gold-hi)}
.cover-title{display:flex;align-items:center;gap:10px;font-size:17px;color:var(--gold-hi)}
.top .big{font-size:46px;line-height:1.2;margin:12px 0 0;color:#e5c776;
  background:linear-gradient(180deg,#f7e8b4 0%,#d9b65a 55%,#b8923a 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.45))}
.top .sub{font-size:14.5px;color:rgba(243,223,162,.8)}
.telink{color:var(--gold-hi);margin-left:10px;display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.back,.icon-btn{border:1px solid rgba(217,182,90,.55);background:transparent;color:var(--gold-hi);cursor:pointer}
.back{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;flex:none}
.icon-btn{height:36px;padding:0 12px;border-radius:8px;display:inline-flex;align-items:center;gap:6px;font-size:14px;flex:none}
.pills,.infos{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.infos{margin-top:10px}
.pills span,.infos span{border:1px solid rgba(217,182,90,.45);border-radius:4px;padding:2px 10px;font-size:13px;color:var(--gold-hi)}
.pills .p-red{border-color:#f0a7a3;color:#f9c9c6}
.limitbar{height:6px;border-radius:3px;background:rgba(255,255,255,.14);margin:12px 0 4px;overflow:hidden}
.limitbar i{display:block;height:100%;background:var(--gold);border-radius:3px}
.limitbar.hot i{background:#f6d37a} .limitbar.over i{background:#ff8d88}

.login{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:44px 34px 44px 56px;text-align:center}
.login>*{position:relative;z-index:1}
.login .logo svg{display:block}
.login h1{margin:12px 0 8px;font-size:32px;color:var(--gold-hi)}
.login p{color:rgba(243,223,162,.8);margin:0 0 26px;max-width:290px}
.login .btn.brand{background:linear-gradient(180deg,#ecd08a,#c9a24a);color:var(--gold-ink)}
.login .btn.ghost{border-color:rgba(217,182,90,.55);color:var(--gold-hi)}
.authbox{width:100%;max-width:300px;text-align:left}
.login .field label{color:rgba(243,223,162,.85)}
.login .field input{border:1px solid rgba(217,182,90,.55);background:rgba(255,255,255,.07);color:var(--gold-hi);font-size:16px}
.setup{background:var(--warn-bg);color:var(--warn);border-radius:6px;padding:14px;text-align:left;font-size:14px;line-height:1.7}
.pinbox input{width:210px;text-align:center;font-size:30px;letter-spacing:14px;padding:12px;border:1px solid rgba(217,182,90,.6);border-radius:8px;background:rgba(255,255,255,.07);color:var(--gold-hi);margin:6px 0 20px}

/* ---------- পাতা ---------- */
.pad{padding:18px 14px 0}
.search{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:6px;background:var(--input);margin-bottom:10px}
.small{font-size:13px;color:var(--muted)}
.red{color:var(--red)} .green{color:var(--blue)} .gray{color:var(--muted)} .warn{color:var(--warn)}

.paper{
  position:relative;background-color:var(--paper);border:1px solid var(--line);border-radius:4px;box-shadow:var(--shadow);margin-bottom:16px;
  background-image:linear-gradient(90deg,transparent 40px,var(--margin) 40px,var(--margin) 41px,transparent 41px,transparent 45px,var(--margin) 45px,var(--margin) 46px,transparent 46px);
}
.paper .card{background:transparent;border:0;border-bottom:1px solid var(--rule);border-radius:0;box-shadow:none;margin:0;padding:13px 14px 13px 60px}
.paper .card:last-child{border-bottom:0}
.paper .card:active{background:rgba(127,150,150,.1)}
.paper .empty{padding:36px 18px 36px 60px;text-align:left}
.day{margin:0;padding:6px 14px 6px 60px;font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-size:14px;color:var(--muted);background:rgba(127,150,150,.09);border-bottom:1px solid var(--rule)}
.empty{text-align:center;color:var(--muted);padding:36px 12px}

.card{background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:14px 15px;margin-bottom:12px;box-shadow:var(--shadow)}
.shop,.entry{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer}
.shop .name{font-size:18px;line-height:1.35}
.entry .note{font-size:13.5px;color:var(--muted)}
.amt{font-size:18px;text-align:right;white-space:nowrap}
.amt small{display:block;font-family:'Hind Siliguri','Noto Sans Bengali',sans-serif;font-size:12px;line-height:1.4;color:inherit;opacity:.85}
.amt small.gray{color:var(--muted);opacity:1}

.tag{display:inline-block;font-size:12px;font-weight:600;line-height:1.55;padding:0 7px;border:1px solid currentColor;border-radius:3px;margin:0 5px 3px 0;background:transparent}
.tag.red{color:var(--red)} .tag.green{color:var(--blue)} .tag.warn{color:var(--warn)}

.alert{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;margin-bottom:10px;border:1.5px solid currentColor;border-radius:4px;cursor:pointer;font-size:14.5px;background:transparent}
.alert span{display:inline-flex;align-items:center;gap:8px}
.alert.red{color:var(--red)} .alert.warn{color:var(--warn)}
.alert b{font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400;font-size:17px;white-space:nowrap}

.chips{display:flex;gap:20px;overflow-x:auto;border-bottom:1px solid var(--line);margin-bottom:12px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;border:0;border-bottom:2px solid transparent;background:none;color:var(--muted);padding:8px 2px 9px;margin-bottom:-1px;font-size:15px;cursor:pointer}
.chip.on{color:var(--text);font-weight:600;border-bottom-color:var(--red)}
.modal .chips{border:0;gap:8px;margin:8px 0 0;overflow:visible;flex-wrap:wrap}
.modal .chip{border:1px solid var(--line);border-radius:6px;padding:6px 12px;margin:0;font-size:14px;color:var(--text)}
.sortrow{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.sortrow select{flex:1;padding:10px;border:1px solid var(--line);border-radius:6px;background:var(--input)}

/* ---------- বাটন ---------- */
.actions{display:flex;gap:10px;margin:16px 14px 4px}
.btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;border-radius:8px;padding:13px 14px;font-weight:600;font-size:16px;cursor:pointer;transition:transform .08s}
.btn:active{transform:scale(.98)}
.btn.red{background:var(--red-solid);color:#fff} .btn.green{background:var(--blue-solid);color:#fff}
.btn.brand{background:var(--ink);color:var(--ink-fg)}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
.btn.danger{background:var(--red-bg);color:var(--red)}
.btn.block{display:flex;width:100%;margin-bottom:10px}
.btn.sm{padding:10px 8px;font-size:14px}
.fab{position:fixed;right:max(16px,calc(50% - 264px));bottom:calc(env(safe-area-inset-bottom) + 84px);display:inline-flex;align-items:center;gap:8px;
  background:linear-gradient(180deg,#ecd08a,#c9a24a);color:var(--gold-ink);border:0;border-radius:10px;padding:13px 18px;font-weight:700;font-size:15.5px;
  box-shadow:0 10px 20px -8px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.5);cursor:pointer;z-index:5}

/* ---------- নিচের মেনু ---------- */
.nav{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:center;background:var(--paper);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);z-index:6}
.nav button{flex:1;max-width:140px;position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;border:0;background:none;padding:10px 2px 9px;font-size:12.5px;color:var(--muted);cursor:pointer}
.nav button.on{color:var(--text);font-weight:600}
.nav button.on::before{content:"";position:absolute;top:-1px;left:24%;right:24%;height:3px;background:var(--red);border-radius:0 0 3px 3px}

/* ---------- ফিল্টার, যোগফল ---------- */
.filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.filters select{grid-column:auto}
.filters label{font-size:12.5px;color:var(--muted);display:block;margin-bottom:3px}
.filters input,.filters select,.field input,.field textarea,.field select{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:6px;background:var(--input)}
.sum{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:14px}
.sum div{background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:10px 8px;text-align:center}
.sum b{display:block;margin-top:2px;font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400;font-size:17px}

/* ---------- মডাল ---------- */
.modal{position:fixed;inset:0;background:rgba(10,14,16,.55);display:flex;align-items:flex-end;justify-content:center;z-index:20}
.sheet{background:var(--paper);width:100%;max-width:560px;border-radius:12px 12px 0 0;border-top:3px solid var(--gold);padding:20px 18px calc(env(safe-area-inset-bottom) + 20px);max-height:92vh;overflow:auto;animation:slideup .22s ease-out}
@keyframes slideup{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
.sheet h2{margin:0 0 16px;padding-bottom:10px;border-bottom:1px solid var(--rule);font-size:21px;line-height:1.35}
.field{margin-bottom:12px}
.field label{display:block;font-size:13.5px;color:var(--muted);margin-bottom:4px}
.seg{display:flex;gap:8px;margin-bottom:14px}
.seg label{flex:1;text-align:center;padding:11px 6px;border-radius:6px;border:1.5px solid var(--line);font-weight:600;cursor:pointer}
.seg input{display:none}
.seg label.sel-red{border-color:var(--red);background:var(--red-bg);color:var(--red)}
.seg label.sel-green{border-color:var(--blue);background:var(--blue-bg);color:var(--blue)}
.two{display:flex;gap:10px}
.themeseg{display:flex;gap:8px;margin-top:10px}
.themeseg button{flex:1}

/* ---------- রিপোর্ট ---------- */
.chart{width:100%;height:auto}
.chart .bar-r{fill:var(--red)} .chart .bar-g{fill:var(--blue)}
.chart text{fill:var(--muted);font-size:10px;text-anchor:middle}
.chart line{stroke:var(--line)}
.legend{display:flex;gap:16px;justify-content:center;font-size:13px;color:var(--muted);margin-top:6px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px}
.hbar{margin-bottom:12px;cursor:pointer}
.hbar .t{display:flex;justify-content:space-between;align-items:baseline;font-size:15px;margin-bottom:4px}
.hbar .t b{font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400}
.hbar .b{height:6px;border-radius:3px;background:var(--rule);overflow:hidden}
.hbar .b i{display:block;height:100%;background:var(--red);border-radius:3px}
.kpi{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
.kpi div{background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:11px 12px}
.kpi b{display:block;margin:2px 0;font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400;font-size:20px}

#toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + 90px);transform:translateX(-50%);background:#18242a;color:var(--gold-hi);padding:10px 16px;border-radius:8px;
  font-size:14.5px;opacity:0;pointer-events:none;transition:opacity .25s;z-index:30;max-width:92%;box-shadow:0 10px 24px -8px rgba(0,0,0,.6)}
#toast.show{opacity:.97}
#toast.act{pointer-events:auto}
#toast button{margin-left:14px;background:none;border:0;color:var(--gold);font-weight:700;cursor:pointer}

@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}

@media print{
  body.printing > *:not(#printArea){display:none !important}
  body.printing #printArea{display:block;color:#000;background:#fff;padding:12px;font-size:13px;font-family:'Hind Siliguri','Noto Sans Bengali',sans-serif}
  body.printing{background:#fff}
  #printArea table{width:100%;border-collapse:collapse;margin-top:10px}
  #printArea th,#printArea td{border:1px solid #999;padding:6px 8px;text-align:left}
  #printArea td.r{text-align:right}
}

/* =====================================================================
   প্রিমিয়াম লেয়ার — মলাটের টেক্সচার ও খাতার দাগ সরিয়ে পরিষ্কার, গভীর ও হালকা ছায়ার ডিজাইন
   রং: অক্সব্লাড মলাট · পিতল সোনালি · হিমশুভ্র পাতা · নীল/লাল কালি
   ===================================================================== */
[data-theme="light"]{
  --desk:#edf0ee; --paper:#fcfdfc; --line:#dde5e2; --rule:#e9efec; --muted:#5d6e72; --input:#fff;
  --shadow:0 1px 2px rgba(20,36,42,.05),0 12px 28px -18px rgba(20,36,42,.28);
  --lift:0 1px 0 rgba(255,255,255,.7) inset,0 18px 40px -18px rgba(20,36,42,.35);
}
[data-theme="dark"]{
  --desk:#090d0f; --paper:#131a1d; --line:#243035; --rule:#1d282c; --input:#182124;
  --shadow:0 1px 0 rgba(255,255,255,.04) inset,0 14px 30px -18px rgba(0,0,0,.9);
  --lift:0 1px 0 rgba(255,255,255,.05) inset,0 20px 44px -18px rgba(0,0,0,.95);
}
html,body{font-variant-numeric:tabular-nums}
#app{padding-bottom:128px}

/* মলাট: টেক্সচার নেই, একটাই সোনালি আভা */
.top,.login{
  background:
    radial-gradient(120% 90% at 100% 0%,rgba(217,182,90,.20) 0,transparent 55%),
    linear-gradient(165deg,#5f2030 0%,var(--cover) 45%,var(--cover-deep) 100%);
}
.top::before,.top::after{display:none}
.top{padding:calc(env(safe-area-inset-top) + 26px) 22px 26px;border-radius:0 0 28px 28px;
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 22px 40px -22px rgba(52,16,26,.75)}
.top::after{display:block;content:"";position:absolute;left:22px;right:22px;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(217,182,90,.7),transparent);border:0;inset:auto 22px 0 22px}
.top h1{font-size:22px;letter-spacing:.1px}
.top .big{font-size:52px;line-height:1.15;margin-top:10px;filter:drop-shadow(0 2px 10px rgba(217,182,90,.25))}
.top .sub{color:rgba(243,223,162,.72)}
.pills span,.infos span{border:0;border-radius:999px;padding:4px 12px;background:rgba(255,255,255,.09);backdrop-filter:blur(6px)}
.pills .p-red{background:rgba(255,141,136,.18);color:#ffd3d0}
.back,.icon-btn{border:0;background:rgba(255,255,255,.1);transition:background .15s}
.back:active,.icon-btn:active{background:rgba(255,255,255,.2)}
.limitbar{height:8px;border-radius:99px;background:rgba(255,255,255,.12)}
.limitbar i{background:linear-gradient(90deg,#c9a24a,#f3dfa2);border-radius:99px}

/* লগইন */
.login{padding:44px 30px}
.login::before{inset:14px;border:1px solid rgba(217,182,90,.4);border-radius:26px}
.login::after{display:none}
.login h1{font-size:34px;margin:14px 0 8px}
.login .btn.brand{background:linear-gradient(180deg,#f0d78f,#c9a24a);box-shadow:0 10px 24px -10px rgba(201,162,74,.7),0 1px 0 rgba(255,255,255,.5) inset}
.login .btn.ghost{border:0;background:rgba(255,255,255,.08)}
.login .field input{border-radius:12px;border-color:rgba(217,182,90,.4);padding:13px 14px}
.login .field input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(217,182,90,.25)}
.pinbox input{border-radius:16px}

/* তালিকা: একটাই মসৃণ কার্ড, ভেতরে পাতলা বিভাজক */
.pad{padding:20px 16px 0}
.paper{background-image:none;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:18px}
.paper .card{padding:15px 18px;border-bottom:1px solid var(--rule);transition:background .15s}
.paper .card:active{background:color-mix(in srgb,var(--gold) 12%,transparent)}
.paper .empty{padding:40px 22px;text-align:center}
.day{padding:8px 18px;font-size:13px;color:var(--muted);background:color-mix(in srgb,var(--desk) 60%,var(--paper));border-bottom:1px solid var(--rule)}
.card{border-radius:18px;box-shadow:var(--shadow)}
.shop .name{font-size:19px}
.amt{font-size:19px;letter-spacing:-.2px}
.search,.sortrow select,.filters input,.filters select,.field input,.field textarea,.field select{border-radius:12px;padding:12px 14px;border-color:var(--line)}
.search{box-shadow:var(--shadow)}
input:focus,select:focus,textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 30%,transparent)}

/* ট্যাগ ও সতর্কতা: রঙিন হালকা ব্যাকগ্রাউন্ড */
.tag{border:0;border-radius:999px;padding:1px 9px}
.tag.red{background:var(--red-bg)} .tag.green{background:var(--blue-bg)} .tag.warn{background:var(--warn-bg)}
.alert{border:0;border-radius:16px;padding:12px 14px;box-shadow:inset 4px 0 0 currentColor}
.alert.red{background:var(--red-bg)} .alert.warn{background:var(--warn-bg)}

/* ফিল্টার চিপ: গোল ট্যাব */
.chips{border:0;gap:8px;padding-bottom:2px;margin-bottom:14px}
.chip{border:1px solid var(--line);border-radius:999px;padding:7px 15px;margin:0;background:var(--paper);font-size:14.5px;transition:all .15s}
.chip.on{background:linear-gradient(165deg,#5f2030,var(--cover-deep));color:var(--gold-hi);border-color:transparent;box-shadow:0 8px 16px -10px rgba(52,16,26,.9)}
[data-theme="dark"] .chip.on{background:linear-gradient(165deg,#d9b65a,#b8923a);color:#2a0a11}

/* বাটন */
.actions{margin:18px 16px 4px}
.btn{border-radius:14px;padding:14px;transition:transform .1s,box-shadow .15s}
.btn.red{background:linear-gradient(180deg,#c3333b,#a3202a);box-shadow:0 10px 20px -12px rgba(179,38,46,.9),0 1px 0 rgba(255,255,255,.2) inset}
.btn.green{background:linear-gradient(180deg,#2c63ad,#1b4482);box-shadow:0 10px 20px -12px rgba(31,78,140,.9),0 1px 0 rgba(255,255,255,.2) inset}
.btn.brand{background:linear-gradient(165deg,#5f2030,var(--cover-deep));color:var(--gold-hi);box-shadow:0 10px 22px -12px rgba(52,16,26,.9),0 1px 0 rgba(255,255,255,.12) inset}
[data-theme="dark"] .btn.brand{background:linear-gradient(180deg,#e6c673,#c9a24a);color:#2a0a11}
.btn.ghost{background:var(--paper)}
.btn.danger{border:1px solid color-mix(in srgb,var(--red) 30%,transparent)}
.fab{bottom:calc(env(safe-area-inset-bottom) + 98px);border-radius:18px;padding:14px 20px;
  background:linear-gradient(180deg,#f0d78f,#c9a24a);box-shadow:0 16px 30px -12px rgba(120,86,20,.75),0 1px 0 rgba(255,255,255,.6) inset}

/* নিচের মেনু: ভাসমান কাচের বার */
.nav{left:0;right:0;margin:0 auto;width:calc(100% - 24px);max-width:420px;bottom:calc(env(safe-area-inset-bottom) + 10px);
  border:1px solid var(--line);border-radius:24px;padding:6px;gap:2px;
  background:color-mix(in srgb,var(--paper) 78%,transparent);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);box-shadow:var(--lift)}
.nav button{max-width:none;border-radius:18px;padding:8px 2px 7px;transition:background .2s,color .2s}
.nav button.on{background:linear-gradient(165deg,#5f2030,var(--cover-deep));color:var(--gold-hi)}
[data-theme="dark"] .nav button.on{background:linear-gradient(180deg,#e6c673,#c9a24a);color:#2a0a11}
.nav button.on::before{display:none}

/* সামারি, KPI */
.sum div,.kpi div{border-radius:16px;box-shadow:var(--shadow)}
.sum b{font-size:18px} .kpi b{font-size:22px}

/* মডাল: নিচ থেকে ওঠা শীট */
.modal{background:rgba(10,14,16,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.sheet{border-top:0;border-radius:28px 28px 0 0;padding-top:30px;box-shadow:0 -20px 50px -20px rgba(0,0,0,.5);position:relative}
.sheet::before{content:"";position:absolute;top:10px;left:50%;width:42px;height:4px;margin-left:-21px;border-radius:4px;background:color-mix(in srgb,var(--muted) 45%,transparent)}
.sheet h2{border-bottom:0;padding-bottom:4px;margin-bottom:14px}
.seg{gap:10px}.seg label{border-radius:14px;padding:12px 6px}
.modal .chip{border-radius:999px}

/* চার্ট */
.chart .bar-r,.chart .bar-g{rx:3px}
.hbar .b{height:8px;border-radius:99px}.hbar .b i{background:linear-gradient(90deg,#b3262e,#e0555c);border-radius:99px}

#toast{background:rgba(24,36,42,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:999px;padding:11px 20px;bottom:calc(env(safe-area-inset-bottom) + 104px)}

/* একবারই: ওপরের মোট অঙ্ক নরম ভাবে ফুটে ওঠে */
@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.top .big{animation:rise .5s ease-out both}

/* দেনা-পাওনা: কভারে দুই পাশের যোগফল */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.duo div{background:rgba(255,255,255,.08);border-radius:18px;padding:11px 14px;box-shadow:0 1px 0 rgba(255,255,255,.08) inset}
.duo small{display:block;font-size:12.5px;color:rgba(243,223,162,.75)}
.duo b{display:block;font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400;font-size:21px;color:var(--gold-hi);margin-top:1px}
.duo div:first-child b{color:#ffc9c5}
.day.sec{display:flex;justify-content:space-between;align-items:baseline;font-size:14px;font-weight:600;color:var(--text)}
.day.sec b{font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400;font-size:16px}

/* অ্যাভাটার ও দেনা-পাওনার অনুপাত বার */
.av{flex:none;width:44px;height:44px;border-radius:15px;display:grid;place-items:center;font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-size:20px;
  box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 8px 14px -10px rgba(0,0,0,.5)}
.av.d{background:linear-gradient(160deg,#f7e3e1,#efc9c6);color:#8c1d25}
.av.p{background:linear-gradient(160deg,#e1ecf8,#c5daf2);color:#1b4482}
[data-theme="dark"] .av.d{background:linear-gradient(160deg,#4a2226,#33171a);color:#ffb0ab}
[data-theme="dark"] .av.p{background:linear-gradient(160deg,#1d3556,#142640);color:#9cc5f6}
.grow{flex:1;min-width:0}
.split{display:flex;height:8px;border-radius:99px;overflow:hidden;margin-top:16px;background:rgba(255,255,255,.1);gap:2px}
.split i{display:block;height:100%}
.split .d{background:linear-gradient(90deg,#e0555c,#ff8d88)}
.split .p{background:linear-gradient(90deg,#4d86cf,#86b6f2)}
.split+.duo{margin-top:12px}

/* ---------- প্রিমিয়াম A4 প্রিন্ট ---------- */
@page{size:A4;margin:12mm}
@media print{
  body.printing #printArea:has(.pr){padding:0;font-size:12.5px}
  #printArea .pr{color:#18242a;line-height:1.55;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  #printArea .pr *{box-sizing:border-box}
  #printArea .prh{display:flex;align-items:center;justify-content:space-between;padding:20px 26px;border-radius:16px;color:#f3dfa2;
    background:linear-gradient(165deg,#5f2030 0%,#521a25 50%,#34101a 100%);border-bottom:3px solid #d9b65a}
  #printArea .prh h1{margin:0;font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400;font-size:28px;color:#f3dfa2}
  #printArea .prh p{margin:4px 0 0;font-size:13px;color:rgba(243,223,162,.8)}
  #printArea .prs{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:12px;margin:16px 0 6px}
  #printArea .prs>div{border:1px solid #dde5e2;border-radius:14px;padding:12px 16px;background:#fbfcfb;break-inside:avoid}
  #printArea .prs .pn{background:linear-gradient(165deg,#5f2030,#34101a);border-color:#d9b65a;color:#f3dfa2}
  #printArea .prs small{display:block;font-size:12px;color:#5d6e72}
  #printArea .prs .pn small{color:rgba(243,223,162,.8)}
  #printArea .prs b{display:block;font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400;font-size:24px}
  #printArea .pr h2{margin:22px 0 8px;padding-bottom:5px;font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400;font-size:18px;color:#521a25;border-bottom:2px solid #d9b65a;break-after:avoid}
  #printArea .pr h2.brk{break-before:page}
  #printArea .pt{width:100%;border-collapse:collapse;margin:0 0 8px}
  #printArea .pt th{border:0;border-bottom:1px solid #b9c6c2;padding:6px 8px;text-align:left;font-size:12px;font-weight:600;color:#5d6e72;background:#f3f6f4}
  #printArea .pt td{border:0;border-bottom:1px solid #e9efec;padding:6px 8px;vertical-align:top}
  #printArea .pt tbody tr:nth-child(even) td{background:#fafcfb}
  #printArea .pt tr{break-inside:avoid}
  #printArea .pt .r{text-align:right;white-space:nowrap}
  #printArea .pt td small{display:block;color:#7a8a8e;font-size:11px}
  #printArea .pt tfoot td{border-top:2px solid #521a25;border-bottom:0;font-weight:700;padding-top:7px}
  #printArea .pt em,#printArea .ps em{font-style:normal;color:#b3262e;font-size:11.5px}
  #printArea .rd{color:#b3262e}#printArea .bl{color:#1f4e8c}
  #printArea .pe{color:#5d6e72;font-size:12px;margin:4px 0 8px}
  #printArea .ps{margin:0 0 16px}
  #printArea .ps h3{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 4px;padding:6px 10px;border-radius:8px;background:#f3ece0;
    font-family:'Tiro Bangla','Noto Serif Bengali',serif;font-weight:400;font-size:15px;break-after:avoid}
  #printArea .ps h3 em{font-family:'Hind Siliguri',sans-serif;border:1px solid currentColor;border-radius:99px;padding:0 8px;margin-left:6px;color:#5d6e72}
  #printArea .prf{margin-top:22px;padding-top:8px;border-top:1px solid #d9b65a;text-align:center;font-size:11.5px;color:#7a8a8e}
}

/* প্রিন্ট: টেবিলের হেডার প্রতি পাতায় আবার আসে, সারি ভাঙে না */
@media print{
  #printArea .pt thead{display:table-header-group}
  #printArea .pt tfoot{display:table-row-group}
  #printArea .ps{break-inside:auto}
  #printArea .pr{max-width:100%}
}

/* My Finance — emerald & champagne premium identity */
:root{--gold:#c9a65a;--gold-hi:#f0dfad;--gold-ink:#17372d}
[data-theme="dark"]{--gold:#d7b967;--gold-hi:#f4e4b5;--gold-ink:#17372d}
.top,.login{background:radial-gradient(120% 90% at 100% 0%,rgba(215,185,103,.18) 0,transparent 55%),linear-gradient(165deg,#1b5745 0%,var(--cover) 48%,var(--cover-deep) 100%)}
.btn.brand{background:linear-gradient(165deg,#1b5745,var(--cover-deep));color:#f4e4b5}
[data-theme="dark"] .btn.brand{background:linear-gradient(180deg,#e6ca7e,#c9a65a);color:#17372d}

/* ===== OFFICIAL MY FINANCE UI — Emerald / White / Champagne ===== */
:root{
  --desk:#f3f7f5;--paper:#ffffff;--text:#132a22;--muted:#6e8179;--line:#e0eae5;--rule:#edf2ef;--input:#fff;
  --red:#dc5b55;--red-bg:#fff0ee;--red-solid:#d94f49;--blue:#16845c;--blue-bg:#e5f5ed;--blue-solid:#087c50;
  --green:#087c50;--green-bg:#e5f5ed;--green-solid:#087c50;--gold:#c9a653;--gold-hi:#f4e4b5;--gold-ink:#17372d;
  --cover:#07583e;--cover-deep:#063b2d;--shadow:0 8px 24px -18px rgba(15,65,46,.28);--lift:0 14px 36px -18px rgba(7,73,48,.26);
}
[data-theme="dark"]{
  --desk:#07130f;--paper:#101e18;--text:#eef7f1;--muted:#9bb2a5;--line:#263d32;--rule:#1b3026;--input:#14251d;
  --red:#ff9189;--red-bg:#351d1b;--red-solid:#c84a43;--blue:#75d5a7;--blue-bg:#173b2b;--blue-solid:#087c50;
  --green:#75d5a7;--green-bg:#173b2b;--green-solid:#087c50;--cover:#07583e;--cover-deep:#03291e;
  --shadow:0 8px 26px -18px rgba(0,0,0,.8);--lift:0 18px 40px -20px rgba(0,0,0,.85);
}
html,body{background:var(--desk);color:var(--text)}
#app{max-width:560px}
.top,.login{background:radial-gradient(120% 100% at 100% 0%,rgba(120,230,168,.20),transparent 55%),linear-gradient(145deg,#08734e 0%,#07583e 52%,#03291e 100%);color:#f3fff7}
.top{padding:calc(env(safe-area-inset-top) + 22px) 20px 22px;border-radius:0 0 30px 30px;box-shadow:0 16px 36px -24px rgba(0,65,42,.65)}
.top h1,.top .cover-title{color:#f5fff8}.top .big{font-family:'Hind Siliguri',sans-serif;font-weight:700;font-size:clamp(34px,9vw,48px);letter-spacing:-1px;color:#fff;background:none;-webkit-text-fill-color:currentColor;filter:none}.top .sub{color:rgba(236,255,244,.78)}
.top .back,.top .icon-btn{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);color:#fff;border-radius:13px}
.top .pills span{background:rgba(255,255,255,.12);color:#eafff1;border:1px solid rgba(255,255,255,.12)}
.top .pills .p-red{background:rgba(255,130,120,.18);color:#ffe0dc}
.brand-lockup{display:flex;align-items:center;gap:11px;min-width:0}.brand-mark{width:43px;height:43px;display:grid;place-items:center;border-radius:14px;color:#f5d98d;background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.brand-name{font-family:system-ui,sans-serif;font-size:21px;font-weight:750;line-height:1.1;letter-spacing:-.5px;color:#fff}.brand-name b{color:#f1d487}.brand-sub{font-size:11px;color:rgba(238,255,245,.72);margin-top:3px}.hero-label{margin-top:22px;font-size:13px;color:#d8f4e4}.dashboard-top .big{margin-top:1px}.dashboard-top .sub{font-size:12px}
.dashboard-stats{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:18px}.dash-stat{padding:12px 13px;border-radius:17px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);min-width:0}.dash-stat span{display:block;font-size:12px;color:rgba(242,255,247,.75)}.dash-stat b{display:block;margin-top:3px;font-size:19px;line-height:1.25;color:#fff;font-weight:700;white-space:nowrap}.income-stat{background:linear-gradient(135deg,rgba(25,190,111,.24),rgba(255,255,255,.07))}.expense-stat{background:linear-gradient(135deg,rgba(230,105,75,.20),rgba(255,255,255,.07))}.debt-stat{background:linear-gradient(135deg,rgba(43,153,224,.19),rgba(255,255,255,.07))}.receivable-stat{background:linear-gradient(135deg,rgba(232,184,76,.20),rgba(255,255,255,.07))}
.dashboard-pad{padding-top:17px}.quick-title{display:flex;justify-content:space-between;align-items:baseline;margin:2px 2px 11px}.quick-title b,.section-heading b{font-size:16px}.quick-title .small{font-size:11px}.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:23px}.quick-action{min-width:0;min-height:86px;border:1px solid var(--line);border-radius:18px;background:var(--paper);box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:var(--text);padding:9px 4px;cursor:pointer}.quick-action b{font-size:12px;white-space:nowrap}.qa-icon{width:36px;height:36px;border-radius:13px;display:grid;place-items:center;color:#fff}.qa-income .qa-icon{background:linear-gradient(145deg,#18bd72,#07814d)}.qa-expense .qa-icon{background:linear-gradient(145deg,#f28a55,#d94f49)}.qa-credit .qa-icon{background:linear-gradient(145deg,#27a5d9,#176caa)}.qa-wallet .qa-icon{background:linear-gradient(145deg,#e8bd55,#b98b2f)}
.section-heading{display:flex;justify-content:space-between;align-items:center;margin:0 2px 10px}.section-heading div{display:flex;flex-direction:column}.section-heading span{font-size:11px;color:var(--muted)}.text-action{border:0;background:transparent;color:var(--green);font-weight:700;padding:7px 2px}
.pad{padding-left:16px;padding-right:16px}.paper,.card{border-radius:19px;border-color:var(--line);background:var(--paper);box-shadow:var(--shadow)}.paper .card{padding:14px 15px}.shop .name{font-family:'Hind Siliguri',sans-serif;font-weight:650;font-size:16px}.amt{font-family:'Hind Siliguri',sans-serif;font-weight:700;font-size:17px}.av{border-radius:14px}.av.d{background:linear-gradient(145deg,#ffe6e2,#ffd0ca);color:#b63d35}.av.p{background:linear-gradient(145deg,#dff8e9,#b9ebd0);color:#087c50}
.chip{border-radius:999px}.chip.on{background:linear-gradient(135deg,#0b8958,#05603f);color:#fff;border-color:transparent;box-shadow:0 7px 16px -10px #087c50}[data-theme="dark"] .chip.on{background:linear-gradient(135deg,#20b875,#087c50);color:#fff}
.btn{border-radius:14px}.btn.green,.btn.brand{background:linear-gradient(135deg,#0b9861,#05613f);color:#fff;box-shadow:0 9px 20px -13px rgba(4,125,78,.8)}[data-theme="dark"] .btn.brand{background:linear-gradient(135deg,#20b875,#087c50);color:#fff}.btn.red{background:linear-gradient(135deg,#e86e62,#c63d3d)}.btn.ghost{background:var(--paper);border:1px solid var(--line)}
.fab{background:linear-gradient(135deg,#f4d989,#c9a653);color:#17372d;border-radius:17px;box-shadow:0 14px 28px -13px rgba(151,112,28,.65)}
.nav{background:color-mix(in srgb,var(--paper) 88%,transparent);border:1px solid var(--line);box-shadow:var(--lift);backdrop-filter:blur(20px) saturate(1.5)}.nav button.on{background:linear-gradient(145deg,#0b8958,#05603f);color:#fff}.nav button{font-size:11px}
.sheet{border-radius:26px 26px 0 0}.sheet h2{font-family:'Hind Siliguri',sans-serif;font-weight:700}.field input,.field textarea,.field select,.search,.filters input,.filters select{border-radius:13px}.kpi div,.sum div{border-radius:16px}.hbar .b i{background:linear-gradient(90deg,#0c9b63,#43c88c)}.chart .bar-g{fill:#0c9b63}.chart .bar-r{fill:#e56a5f}
.login{background:radial-gradient(ellipse at 50% 18%,rgba(79,201,135,.22),transparent 48%),linear-gradient(145deg,#08734e,#03291e);padding:42px 28px}.login h1{color:#f4df9e}.login .btn.brand{background:linear-gradient(135deg,#f4d989,#c9a653);color:#17372d}
@media(max-width:380px){.quick-grid{gap:6px}.quick-action b{font-size:10.5px}.dash-stat b{font-size:16px}.brand-name{font-size:19px}}
@media(prefers-reduced-motion:no-preference){.quick-action,.card,.btn{transition:transform .16s ease,box-shadow .16s ease}.quick-action:active{transform:translateY(1px) scale(.98)}}

/* ===== পুরো স্ক্রিন জুড়ে: মোবাইল, ট্যাবলেট ও কম্পিউটার ===== */
html,body{width:100%;min-height:100vh;min-height:100dvh}
#app{width:100%;max-width:none;margin:0;min-height:100vh;min-height:100dvh}
.top{border-radius:0 0 14px 14px}
.pad{padding:18px clamp(14px,3vw,40px) 0}
.top{padding-left:max(52px,calc(env(safe-area-inset-left) + 52px));padding-right:clamp(30px,4vw,56px)}
.login{width:100%;min-height:100vh;min-height:100dvh}
.authbox{max-width:clamp(300px,34vw,400px)}
.login p{max-width:min(90%,420px)}
.nav{width:calc(100% - 24px);max-width:clamp(420px,60vw,760px)}
.sheet{max-width:min(100%,720px)}
@media(min-width:900px){
  .quick-grid{gap:14px}
  .quick-action{min-height:100px}
}

/* ===== সাইডবার ও নতুন ডিজাইন ===== */
.shell{min-height:100vh;min-height:100dvh}
.main{position:relative;min-width:0}
.side{position:fixed;top:0;bottom:0;left:0;width:min(84vw,290px);z-index:60;transform:translateX(-105%);transition:transform .26s ease;display:flex;flex-direction:column;gap:4px;overflow:auto;
  padding:calc(env(safe-area-inset-top) + 20px) 14px calc(env(safe-area-inset-bottom) + 16px);color:#f3fff7;
  background:radial-gradient(120% 70% at 100% 0%,rgba(120,230,168,.18),transparent 60%),linear-gradient(165deg,#08734e 0%,#07583e 55%,#03291e 100%);box-shadow:12px 0 40px -12px rgba(0,0,0,.55)}
.shell.open .side{transform:none}
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .2s;z-index:55}
.shell.open .scrim{opacity:1;pointer-events:auto}
.menu-btn{position:absolute;left:10px;top:calc(env(safe-area-inset-top) + 14px);z-index:5;width:40px;height:40px;border:0;border-radius:13px;background:rgba(3,41,30,.55);color:#fff;display:grid;place-items:center;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.side-brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:700;padding:4px 8px 18px;color:#fff}
.side-link{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;color:rgba(243,255,247,.82);padding:12px 14px;border-radius:14px;font-size:15.5px;text-align:left;cursor:pointer;transition:background .18s,color .18s}
.side-link:hover{background:rgba(255,255,255,.1);color:#fff}
.side-link.on{background:rgba(255,255,255,.18);color:#fff;font-weight:600;box-shadow:inset 3px 0 0 #d9b65a}
.side-foot{margin-top:auto;display:grid;gap:8px;padding-top:14px}
.install-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:10px}
.side .install-btn{margin-top:0;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);color:#fff}
.pw{position:relative}.pw input{width:100%;padding-right:46px}
.eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;border-radius:10px;background:none;color:inherit;opacity:.72;display:grid;place-items:center;cursor:pointer}
.eye:hover{opacity:1;background:rgba(127,127,127,.15)}

/* নতুন ডিজাইনের ছোঁয়া */
.top::before,.top::after,.login::before,.login::after{display:none}
.top{padding:calc(env(safe-area-inset-top) + 24px) 22px 26px 64px;border-radius:0 0 28px 28px}
.login{padding:40px 24px}
.btn{border-radius:14px;transition:transform .15s,box-shadow .2s,background .2s}.btn:active{transform:scale(.97)}
.field input,.field select,.field textarea{border-radius:14px}
.card{border-radius:18px;box-shadow:var(--shadow)}
.quick-action,.card{transition:transform .18s,box-shadow .2s}
@media(hover:hover){.quick-action:hover,.card:hover{transform:translateY(-2px);box-shadow:var(--lift)}}
*{scrollbar-width:thin}

@media(min-width:900px){
  .shell{display:grid;grid-template-columns:272px minmax(0,1fr)}
  .side{position:sticky;height:100vh;height:100dvh;width:auto;transform:none;z-index:2;box-shadow:none}
  .scrim,.menu-btn{display:none}
  .nav{display:none}
  #app{padding-bottom:40px}
  .top{padding:30px 36px 30px;border-radius:0 0 28px 28px}
}

/* হোটেল ও মিল */
.hm-mon{display:flex;align-items:center;justify-content:space-between;margin:2px 0 14px;padding:6px;border:1px solid var(--line);border-radius:16px;background:var(--paper)}
.hm-mon b{font-size:16px}.hm-mon button{width:40px;height:40px;border:0;border-radius:12px;background:none;font-size:24px;line-height:1;color:var(--text);cursor:pointer}.hm-mon button:hover{background:rgba(127,127,127,.14)}
.hm-h{margin:20px 2px 10px;font-size:15px}
.hm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.hm-card{padding:14px 16px}.hm-amt{font-size:24px;font-weight:700;margin:2px 0}
.hm-chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.hm-chip{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:var(--paper)}.hm-chip b{font-size:14px}
.hm-list{display:grid;gap:8px}
.hm-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:var(--paper);color:var(--text);cursor:pointer;transition:transform .15s,box-shadow .2s}
@media(hover:hover){.hm-row:hover{transform:translateY(-1px);box-shadow:var(--shadow)}}
.hm-ic{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:rgba(127,127,127,.13);font-size:21px;flex:none}
.hm-main{display:flex;flex-direction:column;min-width:0;flex:1}.hm-main .small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hm-price{font-size:16px;white-space:nowrap}
.hm-empty{padding:26px 18px;text-align:center;line-height:1.8}
@media(min-width:900px){.hm-list{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* বাজেট সতর্কতা, হোটেলের বাকি */
.bd-alert{display:grid;gap:6px;margin:0 0 12px;padding:12px 14px;border-radius:16px;border:1px solid #e8a33d;background:color-mix(in srgb,#e8a33d 14%,var(--paper));font-size:14px}
.p-amber{background:rgba(232,163,61,.25)!important;color:#ffd48a!important}
.hm-due{margin:8px 0 6px;color:#d94f49;font-weight:600;font-size:14px}
.hm-badge{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:rgba(217,79,73,.16);color:#d94f49;font-size:11.5px;font-weight:600}

/* লগইন/এরর স্ক্রিনে বাটন লম্বা হওয়া ঠিক */
.login .btn{flex:none;width:100%;max-width:300px;min-height:48px}

/* ডেস্কটপে ভাসমান বাটন ডান-নিচে */
@media(min-width:900px){.fab{right:32px;bottom:32px}}

/* চওড়া স্ক্রিনে কনটেন্ট সীমিত */
@media(min-width:1100px){.main>*:not(.top):not(.dashboard-top){max-width:1100px;margin-left:auto;margin-right:auto}}

/* ===== গতি ও অ্যানিমেশন ===== */
:root{--ease:cubic-bezier(.22,.8,.24,1);--spring:cubic-bezier(.2,.9,.25,1.05)}
@keyframes rv{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@keyframes topin{from{opacity:.0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes growY{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@keyframes sheetin{from{transform:translateY(42px);opacity:.4}to{transform:none;opacity:1}}
@keyframes breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes sweep{0%{background-position:-160% 0}100%{background-position:160% 0}}
@keyframes pop{0%{transform:scale(.92)}60%{transform:scale(1.04)}100%{transform:scale(1)}}
.rv{animation:rv .55s var(--ease) both;animation-delay:calc(var(--i,0) * 55ms)}
.anim .top{animation:topin .5s var(--ease) both}
.anim .hbar .b i,.anim .limitbar i,.anim .bd-bar i{transform-origin:left center;animation:grow .9s var(--ease) .25s both}
.anim .chart .bar-r,.anim .chart .bar-g{transform-box:fill-box;transform-origin:50% 100%;animation:growY .8s var(--ease) .2s both}
.anim .chart .bar-g{animation-delay:.32s}
.modal{animation:fadein .22s ease-out both}
.sheet{animation:sheetin .46s var(--spring) both}
.login .logo{animation:breathe 4.5s ease-in-out infinite}
.login>*{animation:rv .6s var(--ease) both}
.login>*:nth-child(2){animation-delay:.07s}.login>*:nth-child(3){animation-delay:.14s}.login>*:nth-child(4){animation-delay:.21s}
.login .logo{animation:rv .6s var(--ease) both,breathe 4.5s ease-in-out .7s infinite}
.btn,.chip,.quick-action,.nav button,.side a,.side button,.text-action{transition:transform .18s var(--ease),box-shadow .2s ease,background-color .2s ease,filter .2s ease}
.chip:active,.quick-action:active,.nav button:active{transform:scale(.95)}
.btn.brand:active,.fab:active{filter:brightness(.95)}
.fab{animation:rv .6s var(--ease) .5s both;transition:transform .2s var(--spring),box-shadow .2s ease}
.fab:active{transform:scale(.93)}
.chip.on{animation:pop .32s var(--spring)}
.alert{transition:transform .18s var(--ease)}.alert:active{transform:scale(.985)}
#toast{transition:transform .38s var(--spring),opacity .25s ease}
@media(hover:hover){.hbar:hover .b i{filter:brightness(1.08)}.btn:hover{filter:brightness(1.04)}}
@media(prefers-reduced-motion:reduce){.rv,.anim .top,.login>*,.login .logo,.fab,.sheet,.modal{animation:none!important}}

/* সংযোগের অবস্থা */
#netbar{position:fixed;left:50%;top:calc(env(safe-area-inset-top) + 8px);transform:translate(-50%,-140%);z-index:70;max-width:min(92vw,460px);padding:8px 16px;border-radius:999px;font-size:13.5px;font-weight:600;text-align:center;color:#fff;background:#8a5a12;box-shadow:0 10px 26px -12px rgba(0,0,0,.5);transition:transform .45s var(--spring);pointer-events:none}
#netbar.off,#netbar.wait{transform:translate(-50%,0)}
#netbar.wait{background:#1b5745;pointer-events:auto;cursor:pointer}
#netbar.off{background:#7a4a0c}

/* ====== লগইন পোর্টাল: অ্যানিমেশন সিস্টেম ====== */
.login.lg{overflow:hidden;isolation:isolate}
.login.lg>.lg-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;animation:none}
.lg-blob{position:absolute;border-radius:50%;filter:blur(64px);opacity:.55;will-change:transform}
.lg-blob.b1{width:46vmax;height:46vmax;left:-14vmax;top:-12vmax;background:radial-gradient(circle,#2fbf86,transparent 65%);animation:lgDrift 18s ease-in-out infinite alternate}
.lg-blob.b2{width:40vmax;height:40vmax;right:-12vmax;bottom:-10vmax;background:radial-gradient(circle,#d9b65a,transparent 65%);opacity:.32;animation:lgDrift 22s ease-in-out -6s infinite alternate-reverse}
.lg-blob.b3{width:30vmax;height:30vmax;left:30%;top:40%;background:radial-gradient(circle,#0f8f63,transparent 65%);opacity:.4;animation:lgDrift 26s ease-in-out -12s infinite alternate}
.lg-coin{position:absolute;bottom:-40px;font-size:var(--s);font-weight:700;color:rgba(244,217,137,.55);animation:lgFloat var(--t) linear var(--d) infinite;opacity:0;will-change:transform,opacity;text-shadow:0 0 12px rgba(244,217,137,.35)}
@keyframes lgDrift{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(6vmax,5vmax,0) scale(1.18)}}
@keyframes lgFloat{0%{transform:translateY(0) rotate(0);opacity:0}12%{opacity:.55}85%{opacity:.3}100%{transform:translateY(-115vh) rotate(300deg);opacity:0}}

/* ধাপে ধাপে প্রবেশ */
.login.lg>.logo{animation:rv .7s var(--ease) .05s both,breathe 4.5s ease-in-out .8s infinite;position:relative;display:inline-flex}
.login.lg>.logo::before,.login.lg>.logo::after{content:"";position:absolute;inset:-12px;border-radius:50%;border:1px solid rgba(244,217,137,.5);animation:lgRing 3.2s ease-out 1s infinite;pointer-events:none}
.login.lg>.logo::after{animation-delay:2.1s;border-color:rgba(244,217,137,.35)}
@keyframes lgRing{0%{transform:scale(.8);opacity:.9}100%{transform:scale(1.7);opacity:0}}
.login.lg>h1{animation:rv .7s var(--ease) .12s both,lgShine 6s linear 1s infinite;background:linear-gradient(100deg,#f4df9e 35%,#fffbe6 50%,#f4df9e 65%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
@keyframes lgShine{0%{background-position:150% 0}100%{background-position:-150% 0}}
.login.lg>p{animation:rv .7s var(--ease) .19s both}
.login.lg>.authbox{animation:rv .7s var(--ease) .26s both}
.authbox>*{animation:lgIn .55s var(--ease) both}
.authbox>*:nth-child(1){animation-delay:.34s}.authbox>*:nth-child(2){animation-delay:.40s}.authbox>*:nth-child(3){animation-delay:.46s}
.authbox>*:nth-child(4){animation-delay:.52s}.authbox>*:nth-child(5){animation-delay:.58s}.authbox>*:nth-child(6){animation-delay:.64s}
.authbox>*:nth-child(n+7){animation-delay:.70s}
@keyframes lgIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* ইনপুট ও বোতাম */
.login .field input{transition:border-color .2s,box-shadow .25s,background .25s,transform .2s}
.login .field input:focus{background:rgba(255,255,255,.12);transform:translateY(-1px)}
.login .field:focus-within label{color:var(--gold-hi);transition:color .2s}
.login .btn{transition:transform .18s var(--spring),filter .2s,box-shadow .25s}
.login .btn:active{transform:scale(.97)}
.login .btn.brand{position:relative;overflow:hidden}
.login .btn.brand::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:lgSheen 4.2s ease-in-out 1.4s infinite}
@keyframes lgSheen{0%,55%{left:-60%}100%{left:140%}}
.login .btn.brand.busy{pointer-events:none;filter:saturate(.85)}
.login .btn.brand.busy::before{content:"";display:inline-block;width:14px;height:14px;margin-right:8px;vertical-align:-2px;border:2px solid rgba(23,55,45,.3);border-top-color:#17372d;border-radius:50%;animation:lgSpin .7s linear infinite}
@keyframes lgSpin{to{transform:rotate(360deg)}}
.authbox.shake{animation:lgShake .5s cubic-bezier(.36,.07,.19,.97)}
@keyframes lgShake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}30%,50%,70%{transform:translateX(-7px)}40%,60%{transform:translateX(7px)}}

/* পাসওয়ার্ডের শক্তি */
.pwmeter{height:4px;border-radius:4px;background:rgba(255,255,255,.12);margin:-6px 0 12px;overflow:hidden}
.pwmeter i{display:block;height:100%;width:0;border-radius:4px;background:#e5534b;transition:width .35s var(--ease),background .3s}
.pwmeter i[data-l="2"]{background:#e8a33d}.pwmeter i[data-l="3"]{background:#9ccc5a}.pwmeter i[data-l="4"]{background:#34c98a}

@media(prefers-reduced-motion:reduce){
  .login.lg *,.login.lg *::before,.login.lg *::after{animation:none!important;transition:none!important}
  .lg-coin{display:none}
  .login.lg>h1{-webkit-text-fill-color:currentColor;color:#f4df9e;background:none}
}

.daily-btn{width:100%;display:flex;align-items:center;gap:12px;text-align:left;border:1px solid var(--line);border-radius:18px;background:var(--paper);box-shadow:var(--shadow);color:var(--text);padding:12px 14px;margin:-9px 0 22px;cursor:pointer}
.daily-btn .qa-icon{background:linear-gradient(145deg,#f28a55,#d94f49);flex:none}
.daily-btn .grow{display:flex;flex-direction:column;gap:2px;min-width:0}.daily-btn b{font-size:14px}.daily-btn small{font-size:11px;opacity:.7}
.daily-go{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--text);color:var(--paper);font-size:20px;flex:none}
.daily-sum{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-radius:14px;background:rgba(217,79,73,.1);margin-bottom:12px}.daily-sum b{font-size:18px;color:#d94f49}
.daily-cats,.daily-amts{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.daily-cat,.daily-amt{border:1px solid var(--line);background:var(--paper);color:var(--text);border-radius:999px;padding:8px 14px;font-size:13px;cursor:pointer}
.daily-cat.on{background:#d94f49;border-color:#d94f49;color:#fff}
.daily-row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--line);font-size:13px}

.daily-sum{gap:12px}.daily-sum>div{display:flex;flex-direction:column;gap:2px;flex:1}.daily-sum span{font-size:11px;opacity:.7}.daily-sum b{font-size:17px}
.daily-cat.inc.on{background:#0f9d63;border-color:#0f9d63}

/* ব্যাচেলার প্যাক */
.today-card{border:1px solid var(--line);border-radius:18px;background:var(--paper);box-shadow:var(--shadow);padding:14px;margin-bottom:14px}
.tc-main{display:flex;justify-content:space-between;align-items:baseline;margin-top:8px}.tc-main span{font-size:12px;opacity:.75}.tc-main b{font-size:24px}
.tc-bar{height:8px;border-radius:99px;background:rgba(128,128,128,.18);overflow:hidden;margin:8px 0}.tc-bar i{display:block;height:100%;border-radius:99px;background:#18a366}.tc-bar i.warn{background:#e8a93a}.tc-bar i.over{background:#d94f49}
.tc-run{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line);font-size:13px}
.inc-remind{display:flex;align-items:center;gap:8px;border:1px solid #e8bd55;background:rgba(232,189,85,.14);border-radius:14px;padding:10px 12px;margin-bottom:12px}.inc-remind .grow{display:flex;flex-direction:column;min-width:0}.inc-remind small{font-size:11px;opacity:.8}
.fav-row{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}.fav-chip{border:1px solid var(--line);background:var(--paper);color:var(--text);border-radius:999px;padding:8px 13px;font-size:13px;cursor:pointer}.fav-chip b{color:#d94f49}.fav-chip.inc b{color:#0f9d63}
.home-links{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}.home-links button{flex:1 1 auto;border:1px dashed var(--line);background:transparent;color:var(--text);border-radius:12px;padding:9px 10px;font-size:12.5px;cursor:pointer}
.fav-wrap{display:inline-flex;align-items:center;gap:2px}.daily-cat.fav.inc{border-color:#0f9d63;color:#0f9d63}.fav-x{border:0;background:transparent;color:inherit;opacity:.55;font-size:16px;padding:2px 6px;cursor:pointer}
.goal-item{margin-top:12px}.goal-item .btn{margin-top:6px}