
:root{--purple:#2b0645;--deep:#180027;--violet:#7600a7;--gold:#ffd64a;--gold2:#f5a900;--ink:#210d36;--muted:#77758b;--line:#e9e6ed;--paper:#faf9fc;--green:#158b4b;--shadow:0 14px 40px #20002c12}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f4f1f7;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}button,input,select,textarea{font:inherit}button,a{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #c99cff;outline-offset:3px}.shell{max-width:1180px;margin:auto;min-height:100vh;background:var(--paper);padding-bottom:92px}.top{background:radial-gradient(ellipse at 75% 0%,#750091 0%,#390052 42%,#1d002f 100%);color:#fff;padding:22px clamp(18px,4vw,42px) 28px}.topline{display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{font-weight:1000;letter-spacing:-1.7px;color:var(--gold);font-size:clamp(24px,4vw,36px);text-decoration:none;text-shadow:2px 3px 0 #57116c}.brand small{display:block;font-size:9px;letter-spacing:2px;text-align:center;margin-top:5px}.top-actions{display:flex;gap:9px}.iconbtn,.menu-btn{border:1px solid #ffd84c;background:#300044;color:#ffdc5c;border-radius:50%;width:42px;height:42px}.hero{margin-top:25px;max-width:820px}.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#e6c8f5;font-weight:800}.hero h1{font-size:clamp(25px,4vw,38px);margin:8px 0}.hero p{color:#e8d9ef;line-height:1.55;max-width:720px}.layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:22px;padding:24px clamp(16px,3vw,34px)}.side{background:#fff;border:1px solid var(--line);border-radius:19px;padding:13px;height:max-content;position:sticky;top:16px;box-shadow:var(--shadow)}.side a{display:flex;gap:11px;align-items:center;padding:11px 12px;border-radius:12px;text-decoration:none;color:#65576f;font-size:13px;font-weight:700}.side a.active,.side a:hover{background:#f2e8f8;color:#5b087c}.side .group{font-size:10px;letter-spacing:1.5px;color:#9a8ca2;padding:13px 12px 5px;text-transform:uppercase;font-weight:850}main{min-width:0}.page-title{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin:2px 0 18px}.page-title h2{margin:0;font-size:25px;letter-spacing:-.7px}.page-title p{margin:5px 0 0;color:var(--muted);font-size:13px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 2px 10px #20002c06;min-width:0}.card h3{margin:0 0 12px;color:var(--purple);font-size:16px}.card p{color:var(--muted);font-size:13px;line-height:1.55}.balance-card{background:linear-gradient(130deg,#3d0759,#26003d 62%,#3b0757);color:#fff;border:2px solid var(--gold)}.balance-card h3{color:#f8e7a3}.balance{font-size:clamp(25px,4vw,36px);font-weight:900;color:var(--gold);margin:12px 0}.muted-light{color:#eee2f4;font-size:12px}.stat{font-size:25px;font-weight:850;color:var(--purple);margin-top:6px}.label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-weight:800}.btn{border:0;border-radius:12px;padding:12px 16px;background:linear-gradient(#ffe77e,#f4b21d);color:#27103b;font-weight:850}.btn.secondary{background:white;border:1px solid #7b1aa2;color:#68128c}.btn.dark{background:var(--purple);color:#fff}.actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}.field{margin:13px 0}.field label{display:block;font-size:12px;font-weight:800;margin-bottom:6px}.field input,.field select,.field textarea,input.search{width:100%;border:1px solid #dcd4e5;border-radius:11px;padding:12px;background:#fff;color:var(--ink)}.field textarea{min-height:95px}.hint{font-size:11px;color:var(--muted);margin-top:5px}.notice{border:1px solid #efd27a;background:#fff8df;color:#71551c;padding:12px 14px;border-radius:12px;font-size:12px;line-height:1.5;margin:12px 0}.success-note{border:1px solid #b5ebc4;background:#effbf2;color:#28633f;padding:12px;border-radius:12px;font-size:12px}.row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid #f0edf2}.row:last-child{border-bottom:0}.row strong{font-size:13px}.row small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.amount{font-weight:850;white-space:nowrap}.in{color:var(--green)}.out{color:#6c248e}.pill{display:inline-flex;border-radius:30px;background:#f2e8f8;color:#64118a;padding:5px 9px;font-size:10px;font-weight:850}.pill.warn{background:#fff2d4;color:#79580a}.pill.good{background:#e2f8e9;color:#287344}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px}th,td{text-align:left;padding:11px 9px;border-bottom:1px solid #eee9f1;vertical-align:top}th{font-size:10px;color:#887c91;text-transform:uppercase;letter-spacing:.7px}.bottomnav{position:fixed;z-index:5;bottom:0;left:50%;transform:translateX(-50%);width:min(1180px,100%);height:78px;background:linear-gradient(105deg,#2c0645,#1d002e 65%,#35004b);display:flex;justify-content:space-around;align-items:center;color:#d7b8eb;border-radius:22px 22px 0 0}.bottomnav a{font-size:11px;text-decoration:none;text-align:center;padding:12px;color:inherit}.bottomnav a.active{color:var(--gold)}.modal{display:none;position:fixed;inset:0;background:#1700219c;z-index:20;align-items:center;justify-content:center;padding:16px}.modal.open{display:flex}.modalbox{background:#fff;border-radius:20px;padding:22px;width:min(560px,100%);max-height:90vh;overflow:auto}.modalhead{display:flex;justify-content:space-between;align-items:center}.close{border:0;background:#f1eaf6;border-radius:50%;width:34px;height:34px;font-size:22px}.toast{position:fixed;top:15px;left:50%;transform:translate(-50%,-150%);z-index:40;background:#251033;color:white;padding:12px 18px;border-radius:12px;transition:.2s}.toast.show{transform:translate(-50%,0)}.footer{padding:0 24px 24px;color:#8c8294;font-size:11px;text-align:center}.hidden{display:none!important}
@media(max-width:800px){.layout{grid-template-columns:1fr}.side{display:none}.grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}.top{padding-bottom:22px}}
@media(max-width:520px){.layout{padding:18px 14px}.grid,.grid.three{grid-template-columns:1fr}.card{padding:15px}.page-title h2{font-size:22px}.bottomnav{height:70px}.bottomnav a{font-size:10px;padding:9px 4px}.top{padding:17px 17px 20px}}
