@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+KR:wght@400;500;600;700&display=swap');
[hidden]{display:none!important}
:root{--ink:#242936;--muted:#8a8e9c;--line:#eceef3;--purple:#7770dc}*{box-sizing:border-box}body{margin:0;background:#fafbfc;color:var(--ink);font:14px 'DM Sans','Noto Sans KR',sans-serif}button,input,select{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit;border-radius:10px}button:hover{filter:brightness(.96)}button:focus-visible,a:focus-visible{outline:3px solid #aaa4ee}aside{width:238px;background:#fff;position:fixed;height:100vh;padding:35px 24px;border-right:1px solid var(--line);display:flex;flex-direction:column}.brand{display:flex;gap:12px;font-size:36px;color:#7976c8;text-decoration:none;align-items:center}.brand b{color:var(--ink);font-size:27px;letter-spacing:-1px}.brand span{display:block;font-size:10px;color:var(--muted);letter-spacing:2px;margin-top:2px}.navlabel{font-size:10px;letter-spacing:2px;color:#a1a5b0;margin:52px 16px 18px}nav{display:grid;gap:10px}nav button{text-align:left;padding:15px 17px;color:#858996}nav button.active{background:linear-gradient(100deg,#eeedfc,#f0f9f8);color:#6863bb;font-weight:600}.aside-bottom{margin-top:auto;background:linear-gradient(135deg,#f6f3ff,#eff9f8,#fff3f5);border:1px solid #eeeaf6;border-radius:16px;padding:20px 16px}.mini-orb{height:39px;width:39px;border-radius:50%;background:linear-gradient(130deg,#c8b9f2,#e4f7fa,#fbdfe7);box-shadow:inset 2px 2px 8px white;margin-bottom:18px}.aside-bottom b{font-size:12px}.aside-bottom p{font-size:11px;color:var(--muted)}.aside-bottom small{font-size:9px;color:#9b9eaa}main{margin-left:238px;padding:0 48px;max-width:1600px}header{height:91px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.breadcrumb{font-size:10px;letter-spacing:1px;color:#a3a6b1}.breadcrumb span{margin:0 14px}.breadcrumb b{font-weight:500;color:#747987;letter-spacing:0}.avatar{width:34px;height:34px;display:grid;place-items:center;background:#ecebf6;border:3px solid white;border-radius:50%;color:#7a74a0;font-size:11px}.heading{display:flex;justify-content:space-between;align-items:center;padding:37px 0 28px}.eyebrow{font-size:10px;letter-spacing:2px;color:#9996b2}h1{font-size:29px;letter-spacing:-1.2px;margin:10px 0}p{color:var(--muted);line-height:1.7}.heading p{margin:0;font-size:12px}.primary{padding:13px 21px;background:#2e3242;color:white;font-weight:500;box-shadow:0 5px 10px #24293612}.toolbar{display:flex;justify-content:space-between;align-items:center;margin:5px 0 23px}.month{display:flex;align-items:center;gap:16px}.month button{background:#fff;border:1px solid var(--line);width:27px;height:27px}.month b{font-size:14px}.saved{font-size:10px;color:#82a59a;margin-right:10px}.subtle{font-size:11px;color:#8c8e9b;padding:8px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.stat{background:white;border:1px solid var(--line);border-radius:16px;padding:24px;position:relative;overflow:hidden}.stat.balance{background:linear-gradient(115deg,#f1efff 0%,#eaf7f7 58%,#fcf0f6 100%);border-color:#e4e6f4}.stat .label{color:#777d8b;font-size:12px}.stat .value{font-size:29px;font-weight:600;letter-spacing:-1px;margin:16px 0 13px}.stat .value small{font-size:14px;font-weight:400;margin-left:4px}.stat .hint{font-size:10px;color:#a1a3af}.stat .icon{float:right;border-radius:10px;background:#f1f4f9;padding:7px 10px;color:#858ab6}.grid{display:grid;grid-template-columns:1.65fr 1fr;gap:20px;margin-top:23px}.panel{border:1px solid var(--line);border-radius:16px;background:white;padding:24px}.panel h2{font-size:14px;margin:0}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px}.panel-head small{font-size:10px;color:var(--muted)}.chart{height:178px;display:flex;align-items:end;gap:14px;border-bottom:1px solid var(--line);padding:0 10px;background:repeating-linear-gradient(to top,transparent 0,transparent 43px,#f5f5f9 44px)}.bar-group{height:100%;flex:1;display:flex;gap:5px;align-items:end;position:relative;padding-bottom:24px}.bar{flex:1;max-width:25px;min-height:2px;background:linear-gradient(#c0bbee,#e6e2fa);border-radius:5px 5px 0 0}.bar.income{background:linear-gradient(#b8dfd4,#e0f2ed)}.bar-group span{position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:10px;color:#aaa}.legend{display:flex;justify-content:center;gap:18px;color:#9b9eaa;font-size:10px;margin-top:17px}.legend i{display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:5px;background:#c2bbed}.legend i.green{background:#c1e2d8}.donut-wrap{display:flex;align-items:center;gap:24px;min-height:180px}.donut{flex-shrink:0;width:140px;height:140px;border-radius:50%;position:relative}.donut:after{content:'';position:absolute;inset:21px;border-radius:50%;background:white}.donut-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1;font-size:10px;color:var(--muted)}.donut-center b{font-size:19px;color:var(--ink);margin-top:5px}.category-list{flex:1;display:grid;gap:16px}.category{display:flex;justify-content:space-between;font-size:10px;gap:10px}.category em{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:8px}.category b{font-weight:500;color:#888e9a}.wide{margin-top:23px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.filters button{font-size:11px;padding:7px 13px;background:#f7f8fa;color:#9296a2}.filters button.selected{background:#efedf9;color:#7770c0}.filters input{margin-left:auto;border:1px solid var(--line);padding:8px 12px;border-radius:9px;font-size:11px;width:190px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;font-size:10px;color:#a1a5af;font-weight:400;padding:12px 8px;background:#fafbfc}td{padding:15px 8px;font-size:12px;border-bottom:1px solid #f1f2f6}td.muted{font-size:10px;color:#a1a5ae}.item-icon{display:inline-grid;place-items:center;width:31px;height:31px;background:#f1f0f9;border-radius:10px;margin-right:12px;color:#8d84b5}.tag{font-size:9px;background:#f4f3f9;padding:4px 8px;border-radius:5px;color:#9590ab;margin-right:4px}.amount{text-align:right;font-weight:600}.positive{color:#5aab92}.actions{text-align:right}.actions button{font-size:10px;color:#9b99b6;padding:5px}.empty{padding:42px 10px;text-align:center;color:#999eaa;font-size:12px}.empty b{display:block;color:#666d7c;font-size:14px;margin-bottom:8px}.rec-list{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.rec-card{border:1px solid var(--line);border-radius:13px;padding:20px}.rec-card h3{font-size:14px}.rec-card strong{font-size:22px}.rec-card p{font-size:11px}.rec-card button{font-size:11px;padding:9px;background:#f0eef9;color:#7770c0;margin:12px 4px 0 0}.pill{font-size:10px;color:#81a294}.backup-info{font-size:11px;color:#999;margin-top:18px}footer{display:flex;justify-content:space-between;gap:15px;margin:30px 0;font-size:10px;color:#b0b3bc}footer>span:first-of-type{margin-right:auto}dialog{width:min(460px,90vw);border:1px solid #e8e5f3;border-radius:20px;padding:26px;box-shadow:0 30px 90px #2a2c4520}dialog::backdrop{background:#25273845;backdrop-filter:blur(4px)}.dialoghead{display:flex;align-items:center;justify-content:space-between}.dialoghead h2{font-size:20px}.dialoghead button{font-size:25px;color:#999}form>label{display:block;font-size:11px;color:#7b8090;margin:15px 0}form input:not([type=radio]){display:block;width:100%;padding:12px;border-radius:9px;border:1px solid #e7e8ef;margin-top:7px;background:#fcfcfe;color:var(--ink)}.seg{display:flex;gap:20px;padding:13px;background:#f6f5fa;border-radius:10px;margin:10px 0}.full{width:100%;margin-top:12px}.form-note{font-size:11px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#303544;color:white;padding:12px 22px;border-radius:10px;display:none;z-index:5}.insight{margin-top:20px;border-radius:12px;background:linear-gradient(110deg,#f6f3fd,#f0f9f7,#fff6f7);padding:16px 20px;color:#8a839d;font-size:11px}.tag-row{display:flex;gap:20px;align-items:center;margin:22px 0}.tag-row>span{width:90px}.track{height:8px;background:#f5f4f9;border-radius:8px;flex:1}.track i{height:100%;display:block;background:linear-gradient(90deg,#b6a8e7,#bddfd6);border-radius:8px}.tag-row b{width:120px;text-align:right;font-size:12px}.tag-row small{width:55px;color:#999;font-size:11px}@media(min-width:1500px){main{padding:0 65px}}@media(max-width:1100px){aside{width:195px;padding:30px 16px}main{margin-left:195px;padding:0 25px}.donut-wrap{gap:12px}.donut{width:110px;height:110px}.stat .value{font-size:24px}}@media(max-width:800px){aside{width:auto;height:auto;position:static;padding:17px 20px;border-bottom:1px solid var(--line)}.brand{font-size:26px}.brand b{font-size:22px}.brand span,.navlabel,.aside-bottom{display:none}nav{display:flex;margin-top:17px;gap:4px}nav button{padding:10px;font-size:11px;flex:1;text-align:center}main{margin:0;padding:0 20px}header{height:58px}.heading{padding-top:25px;gap:10px}h1{font-size:23px}.heading .primary{padding:11px 13px;font-size:11px}.eyebrow{font-size:8px}.stats{gap:9px}.stat{padding:15px}.stat .value{font-size:19px}.stat .icon,.stat .hint{display:none}.grid{grid-template-columns:1fr}.rec-list{grid-template-columns:1fr 1fr}.saved{display:none}.subtle{font-size:10px}.panel{padding:19px}.donut-wrap{justify-content:center;gap:35px}.category-list{max-width:230px}footer>span:first-of-type{display:none}.filters input{width:100%;margin:5px 0}.tag-row{gap:10px}.tag-row b{width:95px}.tag-row small{display:none}}@media(max-width:420px){.stat .value{font-size:16px}.stat .value small{font-size:10px}.rec-list{grid-template-columns:1fr}.heading p{font-size:10px}.toolbar{flex-wrap:wrap;gap:12px}}

.tag-picker{margin:18px 0}.tag-label{font-size:11px;color:#7b8090;margin-bottom:10px}.tag-label span{float:right;font-size:10px;color:#a1a3af}.tag-buttons{display:flex;flex-wrap:wrap;gap:8px}.tag-choice{padding:9px 13px;border:1px solid #e8e7f0;background:#fafafe;color:#9290a4;font-size:12px;transition:background .15s}.tag-choice.chosen{background:linear-gradient(115deg,#eeebfc,#e9f6f1);border-color:#c7bfe5;color:#6860a7;font-weight:600}.tag-add{display:flex;gap:8px;align-items:center;margin-top:12px}.tag-add input{flex:1;min-width:0;margin:0!important;padding:10px!important;font-size:12px}.tag-add button{flex-shrink:0;padding:10px 14px;background:#f1eff9;color:#7770c0;font-size:11px}.heading-actions{display:flex;align-items:center;gap:8px}@media(max-width:520px){.heading{align-items:flex-start;flex-wrap:wrap}.heading-actions{margin-top:10px}}

.analysis-row{width:100%;text-align:left;padding:10px;border-radius:10px;margin:8px 0;border:1px solid transparent}.analysis-row:hover{background:#f7f6fc}.analysis-row.current{border-color:#dad4ef;background:#f5f3fc}.manage-tag{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 0;border-bottom:1px solid #f0f0f5}.manage-tag small{font-size:10px;color:#999eaa;margin-left:12px}.danger{color:#be7e8d}.manage-add{display:flex;gap:8px;margin-bottom:15px}.manage-add input{border:1px solid #e7e8ef;border-radius:9px;padding:10px 12px;min-width:0;font-size:12px}.detail-summary{font-size:12px;color:#7d779e}@media(max-width:520px){.manage-tag small{display:block;margin:8px 0 0}.analysis-row small{display:block;width:40px;font-size:9px}.analysis-row .tag{width:75px}.manage-tag .subtle{padding:8px}.manage-add{flex-wrap:wrap}}

.brand{color:#b484a9}.brand b{font-size:23px}nav button.active{background:linear-gradient(100deg,#fbecf4,#f0f4ff);color:#a2789d}.stat.balance{background:linear-gradient(115deg,#faeef6,#eeefff 55%,#edf8f5)}.tag-choice.chosen{background:linear-gradient(115deg,#f9e9f2,#eeedfb);border-color:#dfbfd3;color:#9a6c92}.payer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.payer-grid>div{padding:15px 18px;border-radius:12px;background:linear-gradient(130deg,#fcf4f8,#f4f5fc)}.payer-grid span{display:block;font-size:11px;color:#aaa}.payer-grid b{display:block;margin-top:10px;font-size:22px;font-weight:500}.payer-grid small{font-size:11px;font-weight:400}form select{display:block;width:100%;padding:12px;margin-top:7px;border:1px solid #e7e8ef;border-radius:9px;background:#fcfcfe;color:#666}@media(max-width:520px){.payer-grid{gap:8px}.payer-grid>div{padding:12px}.payer-grid b{font-size:17px}.brand b{font-size:22px}}
