@import "https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap";:root{--bg-main:#081120;--bg-elevated:#ffffff0f;--bg-elevated-2:#ffffff14;--border-soft:#ffffff1a;--text-main:#e5eefc;--text-soft:#94a3b8;--text-muted:#64748b;--accent-1:#7c3aed;--accent-2:#06b6d4;--accent-3:#22c55e;--accent-4:#f97316;--danger:#ef4444;--success:#22c55e;--card-shadow:0 20px 60px #00000047}.app-shell.light{--bg-main:#eef4ff;--bg-elevated:#ffffffb8;--bg-elevated-2:#ffffffe0;--border-soft:#0f172a14;--text-main:#0f172a;--text-soft:#475569;--text-muted:#64748b;--card-shadow:0 20px 60px #0f172a14}.app-shell{background:radial-gradient(circle at 10% 10%, #7c3aed2e, transparent 22%), radial-gradient(circle at 80% 20%, #06b6d426, transparent 22%), radial-gradient(circle at 50% 85%, #22c55e1a, transparent 18%), var(--bg-main);min-height:100vh;color:var(--text-main);grid-template-columns:280px 1fr;display:grid;position:relative;overflow:hidden}.bg-orb{filter:blur(120px);z-index:0;pointer-events:none;position:fixed}.orb-1{background:#7c3aed38;width:340px;height:340px;top:-80px;right:8%}.orb-2{background:#06b6d424;width:280px;height:280px;bottom:5%;left:18%}.bg-grid{pointer-events:none;z-index:0;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px);background-size:36px 36px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(circle,#000 30%,#0000 85%);mask-image:radial-gradient(circle,#000 30%,#0000 85%)}.sidebar,.main-content{z-index:1;position:relative}.sidebar{border-right:1px solid var(--border-soft);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:linear-gradient(#020617b3,#02061773);flex-direction:column;padding:24px 20px;display:flex}.app-shell.light .sidebar{background:linear-gradient(#ffffffbf,#ffffff80)}.brand{align-items:center;gap:14px;margin-bottom:28px;display:flex}.brand-icon{color:#fff;background:linear-gradient(135deg, var(--accent-1), var(--accent-2));border-radius:18px;place-items:center;width:54px;height:54px;display:grid;box-shadow:0 0 32px #7c3aed73}.brand-copy h1{margin:0;font-size:1.5rem;line-height:1.1}.brand-copy p{color:var(--text-soft);margin:6px 0 0;font-size:.95rem}.sidebar-nav{flex-direction:column;gap:10px;display:flex}.nav-link{color:var(--text-soft);border:1px solid #0000;border-radius:16px;align-items:center;gap:12px;padding:14px 16px;font-weight:600;text-decoration:none;transition:all .28s;display:flex}.nav-link:hover{color:var(--text-main);background:#7c3aed24;border-color:#7c3aed2e;transform:translate(6px)}.nav-link.active{color:#fff;background:linear-gradient(135deg,#7c3aede6,#06b6d4b8);box-shadow:0 14px 32px #7c3aed47}.sidebar-bottom{margin-top:auto;padding-top:20px}.role-switcher-card{-webkit-backdrop-filter:blur(22px);background:linear-gradient(#0a1228e0,#060e20f5);border:1px solid #94a3b81f;border-radius:28px;padding:22px 20px;position:relative;overflow:hidden;box-shadow:0 20px 60px #00000052,inset 0 1px #ffffff0a}.app-shell.light .role-switcher-card{background:linear-gradient(#ffffffdb,#f5f8fff5);border:1px solid #0f172a14;box-shadow:0 20px 50px #0f172a14,inset 0 1px #ffffffb3}.role-switcher-card:before{content:"";-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,#7c3aed6b,#06b6d438,#ffffff08);border-radius:28px;padding:1px;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.role-switcher-header{align-items:center;gap:14px;margin-bottom:18px;display:flex}.role-switcher-icon{color:#fff;background:linear-gradient(135deg,#7c3aed,#06b6d4);border-radius:18px;flex-shrink:0;place-items:center;width:52px;height:52px;display:grid;box-shadow:0 14px 32px #7c3aed59,inset 0 1px #ffffff2e}.role-switcher-label{letter-spacing:.12em;text-transform:uppercase;color:#e2e8f094;margin:0;font-size:.76rem;font-weight:700}.app-shell.light .role-switcher-label{color:#0f172a7a}.role-switcher-title{color:#f8fafc;margin:6px 0 0;font-size:1.08rem;font-weight:800}.app-shell.light .role-switcher-title{color:#0f172a}.custom-select-wrapper{margin-bottom:16px;position:relative}.custom-select-icon{color:#e2e8f0b8;pointer-events:none;transition:transform .2s;position:absolute;top:50%;right:18px;transform:translateY(-50%)}.app-shell.light .custom-select-icon{color:#0f172a99}.role-select{width:100%;min-height:56px;color:var(--text-main);appearance:none;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff14;border-radius:18px;outline:none;padding:14px 50px 14px 18px;font-size:1rem;font-weight:700;transition:all .25s;box-shadow:inset 0 1px #ffffff08,0 10px 22px #0000001f}.role-select:hover{background:#ffffff14;border-color:#7c3aed47}.role-select:focus{background:#ffffff17;border-color:#7c3aed9e;box-shadow:0 0 0 4px #7c3aed24,0 14px 28px #7c3aed24}.role-select option{color:#f8fafc;background:#0f172a;font-weight:600}.app-shell.light .role-select{color:#0f172a;background:#ffffffe0;border:1px solid #0f172a14;box-shadow:inset 0 1px #ffffff80,0 10px 24px #0f172a0f}.app-shell.light .role-select:hover{background:#fff;border-color:#7c3aed33}.app-shell.light .role-select:focus{border-color:#7c3aed73;box-shadow:0 0 0 4px #7c3aed1a,0 12px 24px #7c3aed14}.app-shell.light .role-select option{color:#0f172a;background:#fff}.role-switcher-note{color:#cbd5e1b8;margin:0;font-size:.94rem;line-height:1.7}.app-shell.light .role-switcher-note{color:#334155bd}.main-content{padding:28px}.topbar{justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;display:flex}.topbar-copy h2{letter-spacing:-.03em;background:linear-gradient(90deg,#fff,#b6d6ff 60%,#8be9ff);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:2.4rem;font-weight:800;line-height:1.05}.app-shell.light .topbar-copy h2{background:linear-gradient(90deg,#111827,#334155 60%,#0f172a);color:#0000;-webkit-background-clip:text;background-clip:text}.topbar-copy p{color:var(--text-soft);margin:10px 0 0;font-size:1rem}.theme-toggle{cursor:pointer;color:#fff;background:linear-gradient(135deg, var(--accent-1), var(--accent-2));border:none;border-radius:14px;align-items:center;gap:10px;padding:12px 16px;font-weight:700;transition:transform .22s,box-shadow .22s;display:inline-flex;box-shadow:0 14px 30px #7c3aed47}.theme-toggle:hover{transform:translateY(-2px)scale(1.02);box-shadow:0 18px 36px #7c3aed59}.page-content{flex-direction:column;gap:22px;display:flex}.page-header h2{color:var(--text-main);letter-spacing:-.02em;margin:0;font-size:1.9rem}.page-header p{color:var(--text-soft);margin:8px 0 0}.summary-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;display:grid}.summary-card{color:#fff;min-height:180px;box-shadow:var(--card-shadow);border-radius:24px;padding:24px;transition:transform .28s,box-shadow .28s;position:relative;overflow:hidden}.summary-card:hover{transform:translateY(-8px)scale(1.01)}.summary-card__shine{background:linear-gradient(110deg,#0000 0%,#ffffff14 45%,#0000 75%);animation:5s infinite shimmer;position:absolute;inset:0;transform:translate(-100%)}.summary-card:after{content:"";background:#ffffff1f;border-radius:999px;width:140px;height:140px;position:absolute;top:-36px;right:-36px}.summary-card.balance{background:linear-gradient(135deg,#7c3aed,#4c1d95)}.summary-card.income{background:linear-gradient(135deg,#059669,#22c55e)}.summary-card.expense{background:linear-gradient(135deg,#ea580c,#f97316)}.summary-card__title{opacity:.95;font-size:.95rem}.summary-card__value{letter-spacing:-.04em;margin:18px 0 10px;font-size:2.35rem;font-weight:800}.summary-card__subtitle{opacity:.92;font-size:.94rem}.panel,.insight-card{background:var(--bg-elevated);border:1px solid var(--border-soft);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:var(--card-shadow);border-radius:24px;padding:22px;transition:transform .28s,border-color .28s}.panel:hover,.insight-card:hover{border-color:#7c3aed38;transform:translateY(-4px)}.glow-panel{box-shadow:var(--card-shadow), 0 0 0 1px #ffffff05, 0 0 28px #7c3aed14}.panel-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px;display:flex}.panel-header h3{color:var(--text-main);margin:0;font-size:1.05rem}.panel-header span{color:var(--text-soft);font-size:.92rem}.chart-grid{grid-template-columns:1.5fr 1fr;gap:18px;display:grid}.chart-box{min-height:320px}.legend-list{gap:10px;margin-top:8px;display:grid}.legend-item{color:var(--text-soft);grid-template-columns:14px 1fr auto;align-items:center;gap:10px;font-size:.95rem;display:grid}.legend-item strong{color:var(--text-main)}.legend-dot{border-radius:999px;width:10px;height:10px}.form-panel,.filter-panel,.table-panel,.recent-panel{position:relative}.filters-row,.transaction-form{gap:12px;display:grid}.transaction-form{grid-template-columns:repeat(6,minmax(0,1fr))}.advanced-filters{grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;gap:14px;display:grid}.filters-row input,.filters-row select,.transaction-form input,.transaction-form select,.transaction-form button,.transaction-table input,.transaction-table select,.role-select{font:inherit;color:var(--text-main);background:#ffffff0f;border:1px solid #ffffff14;border-radius:16px;outline:none;padding:14px 16px;font-weight:500;transition:all .25s;box-shadow:inset 0 1px #ffffff08}.filters-row input:focus,.filters-row select:focus,.transaction-form input:focus,.transaction-form select:focus,.transaction-table input:focus,.transaction-table select:focus,.role-select:focus{background:#ffffff14;border-color:#7c3aeda6;box-shadow:0 0 0 4px #7c3aed24,0 10px 24px #7c3aed1f}.filters-row input::placeholder,.transaction-form input::placeholder{color:var(--text-soft);opacity:.9}.filters-row select,.transaction-form select,.transaction-table select,.role-select{appearance:none;cursor:pointer}.filters-row select option,.transaction-form select option,.transaction-table select option,.role-select option{color:#e5eefc;background-color:#0f172a;padding:12px;font-weight:500}.app-shell.light .filters-row input,.app-shell.light .filters-row select,.app-shell.light .transaction-form input,.app-shell.light .transaction-form select,.app-shell.light .transaction-table input,.app-shell.light .transaction-table select,.app-shell.light .role-select{color:#0f172a;background:#ffffffe6;border:1px solid #0f172a14}.app-shell.light select option{color:#0f172a;background-color:#fff}.transaction-form button{background:linear-gradient(135deg, var(--accent-1), var(--accent-2));color:#fff;cursor:pointer;border:none;font-weight:700}.transaction-form button:hover{transform:translateY(-2px)}.table-wrapper{border-radius:18px;overflow-x:auto}.transaction-table{border-collapse:collapse;width:100%}.transaction-table th,.transaction-table td{border-bottom:1px solid var(--border-soft);text-align:left;padding:16px 14px}.transaction-table th{color:var(--text-soft);font-size:.92rem;font-weight:700}.transaction-table td{color:var(--text-main)}.transaction-table tr:hover{background:#7c3aed0f}.category-pill{color:#c7d2fe;background:#6366f126;border-radius:999px;padding:7px 12px;font-size:.85rem;font-weight:700;display:inline-block}.app-shell.light .category-pill{color:#4338ca;background:#eef2ff}.type-badge{text-transform:capitalize;border-radius:999px;padding:7px 12px;font-size:.83rem;font-weight:800;display:inline-block}.type-badge.income{color:#86efac;background:#22c55e26}.type-badge.expense{color:#fca5a5;background:#ef444424}.app-shell.light .type-badge.income{color:#166534;background:#dcfce7}.app-shell.light .type-badge.expense{color:#991b1b;background:#fee2e2}.amount-cell{text-align:right;font-weight:800}.amount-cell.income{color:#22c55e}.amount-cell.expense{color:#ef4444}.action-buttons{gap:8px;display:flex}.edit-btn,.delete-btn,.export-btn{cursor:pointer;font-weight:700;font:inherit;border:none;border-radius:12px;padding:10px 14px;transition:transform .2s,opacity .2s}.edit-btn:hover,.delete-btn:hover,.export-btn:hover{transform:translateY(-2px)}.edit-btn{color:#93c5fd;background:#3b82f626}.delete-btn{color:#fca5a5;background:#ef444426}.export-btn{background:linear-gradient(135deg, var(--accent-1), var(--accent-2));color:#fff}.export-btn.secondary{background:linear-gradient(135deg,#0ea5e9,#14b8a6)}.insight-card h3{color:var(--text-main);margin:0 0 12px;font-size:1.05rem}.insight-card p{color:var(--text-soft);margin:0;line-height:1.7}.grouped-list{flex-direction:column;gap:10px;display:flex}.grouped-item{color:var(--text-main);background:#ffffff0d;border-radius:14px;justify-content:space-between;padding:12px 14px;display:flex}.app-shell.light .grouped-item{background:#f8fafc}.recent-list{flex-direction:column;gap:14px;display:flex}.recent-item{border:1px solid var(--border-soft);background:#ffffff0a;border-radius:18px;justify-content:space-between;align-items:center;gap:12px;padding:18px;transition:transform .22s,border-color .22s;display:flex}.recent-item:hover{border-color:#7c3aed40;transform:translate(6px)}.recent-item strong{color:var(--text-main);font-size:1rem}.recent-item p{color:var(--text-soft);margin:8px 0 0;font-size:.92rem}.recent-amount{font-size:1.05rem;font-weight:800}.recent-amount.income{color:#22c55e}.recent-amount.expense{color:#ef4444}.empty-state{text-align:center;color:var(--text-soft);padding:52px 20px}.empty-state h3{color:var(--text-main);margin-bottom:10px}.fade-in{animation:.42s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{transform:translate(-120%)}35%{transform:translate(120%)}to{transform:translate(120%)}}@media (width<=1280px){.summary-grid,.chart-grid,.insight-grid,.transaction-form{grid-template-columns:1fr}.advanced-filters{grid-template-columns:repeat(2,1fr)}}@media (width<=920px){.app-shell{grid-template-columns:1fr}.sidebar{border-right:none;border-bottom:1px solid var(--border-soft)}.main-content{padding:20px}.topbar{flex-direction:column;align-items:flex-start}}@media (width<=768px){.advanced-filters{grid-template-columns:1fr}}.insight-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.glow-card{background:linear-gradient(135deg,#7c3aed26,#06b6d41f);border:1px solid #7c3aed40;transition:all .3s;box-shadow:0 20px 40px #7c3aed26}.glow-card:hover{transform:translateY(-6px)scale(1.02);box-shadow:0 30px 60px #7c3aed40}.big-text{margin:12px 0;font-size:1.4rem;font-weight:700}.highlight{color:#22c55e;font-weight:700}.sub-text{color:var(--text-soft)}.big-card{margin-top:20px}.category-list{flex-direction:column;gap:10px;margin-top:14px;display:flex}.category-row{background:#ffffff0d;border-radius:12px;justify-content:space-between;padding:12px 14px;transition:all .2s;display:flex}.category-row:hover{background:#7c3aed26}.glass{border:1px solid var(--border-soft);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffff0d;margin-top:18px}@media (width<=900px){.insight-grid{grid-template-columns:1fr}}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0;font-family:Roboto,sans-serif}body{color:#0f172a;font-family:Roboto,sans-serif}button,input,select,textarea{font:inherit;font-family:Roboto,sans-serif}