:root{--red:#e63946;--red2:#c1121f;--navy:#0b1f4b;--navy2:#142f6b;--ink:#0f172a;--mut:#6b7488;--line:#e8ebf2;--bg:#f6f7fb;--ok:#14935a}
*{box-sizing:border-box;margin:0}
body{font-family:'Plus Jakarta Sans','Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:15px;line-height:1.5}
a{color:inherit;text-decoration:none}p a{color:var(--navy2);font-weight:600;text-decoration:underline}
.btn{display:inline-block;text-align:center;border:0;cursor:pointer;background:var(--red);color:#fff;font:600 15px inherit;padding:13px 22px;border-radius:12px;transition:background .15s}
.btn:hover{background:var(--red2)}.btn.navy{background:var(--navy)}.btn.navy:hover{background:var(--navy2)}
:focus-visible{outline:3px solid #9db4ff;outline-offset:2px}
input,select{width:100%;font:inherit;padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
input:focus,select:focus{border-color:var(--navy2)}
label{display:block;font-weight:600;font-size:13px;margin:14px 0 6px;color:var(--navy)}
.err{background:#fde8ea;color:var(--red2);padding:11px 14px;border-radius:10px;font-weight:600;margin-top:16px}
.ok{background:#e3f6ec;color:var(--ok);padding:11px 14px;border-radius:10px;font-weight:600;margin:16px 0}
.muted{color:var(--mut)}.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;color:var(--navy)}
.logo i{width:34px;height:34px;border-radius:10px;background:var(--red);color:#fff;display:grid;place-items:center;font-style:normal}
/* public pages */
body.plain{background:#fff;min-height:100vh;display:flex;flex-direction:column;border-top:5px solid var(--navy);background-image:radial-gradient(circle at 100% 0,rgba(230,57,70,.08),transparent 420px),radial-gradient(circle at 0 100%,rgba(11,31,75,.07),transparent 480px)}
.bar{display:flex;justify-content:space-between;align-items:center;padding:20px 32px}
.center{flex:1;display:flex;flex-direction:column;align-items:center;padding:20px 16px 48px}
.login-card{width:100%;max-width:430px;background:#fff;border:1px solid var(--line);border-radius:24px;padding:38px 34px;box-shadow:0 24px 60px rgba(11,31,75,.12);margin-top:12px}
.login-card.wide{max-width:560px}.login-card .logo{margin-bottom:22px}
.lock{width:56px;height:56px;border-radius:18px;background:var(--navy);display:grid;place-items:center;font-size:24px;margin:0 auto 18px;box-shadow:0 8px 0 -2px var(--red)}
.login-card h1{font-size:26px;color:var(--navy);letter-spacing:-.02em;text-align:center;line-height:1.2}
.login-card .sub{color:var(--mut);margin-top:8px;text-align:center}.wide h1,.wide .sub{text-align:left}
.login-card .btn{width:100%;margin-top:22px}
.pw{position:relative}.pw input{padding-right:50px}.pw button{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:40px;height:40px;border:0;background:none;cursor:pointer;font-size:18px;opacity:.55;border-radius:10px}.pw button:hover{background:var(--bg)}
.consent{font-size:12.5px;color:var(--mut);text-align:center;margin-top:18px}.secure{font-size:12px;color:var(--ok);text-align:center;margin-top:10px;font-weight:600}
.sec{font-size:15px;color:var(--navy);margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.chk{display:flex;gap:10px;align-items:center;font-weight:500}.chk input{width:auto}
.faq{width:100%;max-width:640px;margin-top:56px}.faq h2{font-size:22px;color:var(--navy);margin-bottom:16px}
details{border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin-bottom:10px;background:#fff}
summary{cursor:pointer;font-weight:700;color:var(--navy);list-style:none;display:flex;justify-content:space-between;gap:12px}
summary::after{content:"+";color:var(--red);font-size:20px;line-height:1}details[open] summary::after{content:"−"}
details p{color:var(--mut);margin-top:10px}
.lang{display:flex;gap:6px;font-weight:700;font-size:13px}.lang a{padding:6px 12px;border-radius:8px;color:var(--mut);border:1.5px solid var(--line);background:#fff}.lang a.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:24px 32px;background:var(--navy);color:#c3cde6;font-size:14px}.foot b{color:#fff}.foot small{opacity:.75}.fl{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.fl a:hover{color:#fff;text-decoration:underline}
.doc{width:100%;max-width:720px}.doc h1{font-size:34px;color:var(--navy);letter-spacing:-.02em;margin-top:22px}.doc .sub{color:var(--mut);margin:6px 0 10px}
.doc h2{font-size:18px;color:var(--navy);margin-top:26px}.doc p{margin-top:8px;color:#334155}.doc .note{background:var(--bg);border-left:4px solid var(--red);padding:12px 14px;border-radius:8px;margin:30px 0 24px;font-size:13px}
.tabs{display:flex;gap:6px;background:var(--bg);border-radius:12px;padding:4px;flex-wrap:wrap}.tabs a{flex:1;text-align:center;padding:10px 12px;border-radius:9px;font-weight:600;color:var(--mut);white-space:nowrap}.tabs a.on{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(11,31,75,.1)}
/* app */
.app{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.side{background:var(--navy);color:#fff;padding:28px 20px;display:flex;flex-direction:column;gap:6px;position:sticky;top:0;height:100vh}
.side .logo{color:#fff;margin-bottom:26px}
.side .nav{display:block;width:100%;text-align:left;padding:12px 14px;border-radius:12px;color:#c3cde6;font:600 15px inherit;background:none;border:0;cursor:pointer}
.side .nav.on{background:var(--red);color:#fff}.side .nav:hover:not(.on){background:rgba(255,255,255,.08)}
.side form{margin-top:10px}.me{margin-top:auto;display:flex;gap:10px;align-items:center;padding:14px;background:rgba(255,255,255,.08);border-radius:14px}.me small{display:block;color:#a9b7d8;font-size:12px}
.meta{color:#8d9cc4;font-size:11.5px;padding:0 4px}
.wrap{display:flex;flex-direction:column;min-width:0}.main{padding:32px 38px;flex:1;width:100%;max-width:1180px}
.top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:26px;gap:12px}
.top h1{font-size:28px;color:var(--navy);letter-spacing:-.02em}.top p{color:var(--mut)}
.av{width:42px;height:42px;flex:none;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-weight:800}
.grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:20px}
.card{background:#fff;border-radius:20px;padding:22px;border:1px solid var(--line)}.card h3{font-size:16px;color:var(--navy);margin-bottom:14px}
.bal{background:linear-gradient(135deg,var(--navy),var(--navy2) 55%,var(--red) 130%);color:#fff;border:0;min-height:170px;position:relative}
.bal small{opacity:.75}.bal b{display:block;font-size:36px;margin-top:6px;letter-spacing:-.02em}.bal .chip{position:absolute;right:22px;bottom:20px;font-size:13px;opacity:.8}
.stat small{color:var(--mut)}.stat b{display:block;font-size:26px;margin-top:6px}.up{color:var(--ok)}.down{color:var(--red)}
.two{display:grid;grid-template-columns:1.5fr 1fr;gap:20px;margin-top:20px}
.bars{display:flex;align-items:flex-end;gap:16px;height:190px;padding-top:10px}.col{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;height:100%;justify-content:flex-end}
.pair{display:flex;align-items:flex-end;gap:5px;height:100%;width:100%;justify-content:center}.pair span{width:38%;border-radius:7px 7px 3px 3px;min-height:4px}.pair .i{background:var(--navy)}.pair .x{background:var(--red)}
.col em{font-style:normal;color:var(--mut);font-size:12px}.leg{display:flex;gap:16px;font-size:12px;color:var(--mut);margin-bottom:6px}.leg b{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
.cat{margin-bottom:14px}.cat div{display:flex;justify-content:space-between;font-weight:600;font-size:14px}.cat i{display:block;height:8px;border-radius:5px;background:var(--bg);margin-top:7px;overflow:hidden}.cat s{display:block;height:100%;background:var(--red);border-radius:5px}
.pills{display:flex;gap:6px;margin-bottom:8px}.pills a{padding:6px 14px;border-radius:99px;font-weight:600;font-size:13px;color:var(--mut);background:var(--bg)}.pills a.on{background:var(--navy);color:#fff}
table{width:100%;border-collapse:collapse}td{padding:13px 4px;border-top:1px solid var(--line)}td:last-child{text-align:right;font-weight:700;white-space:nowrap}
.dot{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;margin-right:12px;vertical-align:middle;font-weight:800}.dot.income{background:#e3ecff;color:var(--navy)}.dot.expense{background:#fde8ea;color:var(--red)}
.tt{display:inline-block;vertical-align:middle}td small{display:block;color:var(--mut)}.del{border:0;background:none;color:var(--mut);cursor:pointer;font-size:18px;margin-left:8px}.del:hover{color:var(--red)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:980px){.app{grid-template-columns:1fr}.side{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center}.side .logo{margin:0 12px 0 0}.me,.meta{display:none}.side form{margin:0 0 0 auto}.grid,.two{grid-template-columns:1fr}.main{padding:22px 16px}.top{flex-direction:column}}
@media(max-width:520px){.login-card{padding:30px 22px}.bar,.foot{padding-left:18px;padding-right:18px}.row2{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
