:root{--paper: #fffdf7;--paper-warm: #fcf3df;--paper-shade: rgb(44 95 117 / .04);--wash: #eaf7ff;--wash-deep: #d6eef9;--sky: #c8efff;--sky-deep: #9addf3;--pool: #6ec5dd;--pool-deep: #4aa6c1;--mint: #bdecd7;--mint-deep: #8ddabb;--lemon: #ffe58f;--lemon-deep: #f5c651;--coral: #f7a7a0;--coral-deep: #e87a72;--blush: #ffd7d2;--lilac: #e2d6f3;--ink: #2c5f75;--ink-soft: #5a8497;--ink-faint: rgb(44 95 117 / .55);--line: rgb(44 95 117 / .22);--line-bold: rgb(44 95 117 / .45);--soft-shadow: 0 18px 40px rgb(44 95 117 / .13);--hover-shadow: 0 22px 46px rgb(44 95 117 / .18);--inset-light: inset 0 1.5px 0 rgb(255 255 255 / .72);--inset-dark: inset 0 -2px 0 rgb(44 95 117 / .06);--r-card: 30px 24px 32px 22px;--r-pill: 22px 18px 21px 17px;--r-input: 18px 15px 17px 14px;--r-tag: 14px 10px 13px 11px;--font-body: "Zen Maru Gothic", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, -apple-system, sans-serif;--font-display: "Zen Maru Gothic", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, -apple-system, sans-serif;--font-numeric: "Zen Maru Gothic", "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, -apple-system, sans-serif;--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-soft: cubic-bezier(.25, .46, .45, .94)}*{box-sizing:border-box}html{min-width:0}body{min-height:100vh;margin:0;background:radial-gradient(ellipse at 12% 8%,rgb(255 230 195 / .55) 0%,transparent 42%),radial-gradient(ellipse at 92% 22%,rgb(189 236 215 / .45) 0%,transparent 38%),radial-gradient(ellipse at 50% 100%,rgb(200 239 255 / .65) 0%,transparent 55%),linear-gradient(180deg,#fffdf6,#f0f8ff);background-attachment:fixed;color:var(--ink);font-family:var(--font-body);font-size:14.5px;font-weight:500;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body:before{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-2;pointer-events:none;content:"";opacity:.32;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23paper)' opacity='0.32'/%3E%3C/svg%3E")}body:after{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;content:"";opacity:.18;background-image:radial-gradient(circle,rgb(44 95 117 / .32) 1px,transparent 1.4px);background-size:28px 28px}button,input,select{font-family:inherit;font-size:14px}button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;border:1.5px solid var(--line);border-radius:var(--r-pill);background:var(--paper);color:var(--ink);cursor:pointer;padding:8px 14px;font-family:var(--font-body);font-weight:800;letter-spacing:.01em;box-shadow:var(--inset-light),0 2px #2c5f750d;transition:background .24s var(--ease-soft),border-color .24s var(--ease-soft),color .24s var(--ease-soft),transform .28s var(--ease-spring),box-shadow .28s var(--ease-soft)}button:disabled{cursor:not-allowed;opacity:.5}button:not(:disabled):hover{background:var(--sky);border-color:#2c5f756b;transform:translateY(-2px) rotate(-.4deg);box-shadow:var(--inset-light),0 12px 22px #2c5f7529}button:not(:disabled):active{transform:translateY(0) scale(.98);box-shadow:var(--inset-light),0 4px 8px #2c5f751f}button.active{border-color:var(--pool-deep);background:linear-gradient(135deg,var(--pool) 0%,var(--pool-deep) 100%);color:var(--paper);box-shadow:inset 0 1.5px #fff6,0 6px 14px #4aa6c15c}button.active:hover{background:linear-gradient(135deg,var(--pool) 0%,var(--pool-deep) 100%);color:var(--paper)}.danger-button{border-color:var(--coral-deep);background:linear-gradient(135deg,var(--coral) 0%,var(--coral-deep) 100%);color:var(--paper);box-shadow:inset 0 1.5px #fff6,0 6px 14px #e87a7252}.danger-button:not(:disabled):hover{border-color:var(--coral-deep);background:linear-gradient(135deg,var(--coral) 0%,var(--coral-deep) 100%);color:var(--paper);transform:translateY(-2px) rotate(.4deg);box-shadow:inset 0 1.5px #fff6,0 12px 24px #e87a7266}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgb(110 197 221 / .5);outline-offset:2px}input,select{font-family:inherit;color:var(--ink);font-weight:600}input::placeholder{color:var(--ink-faint);opacity:1;font-weight:500}.ui-icon,.brand-icon{flex:0 0 auto}.ui-icon{width:17px;height:17px}.brand-icon{width:26px;height:26px}.ui-icon path,.brand-icon path{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.9}.app-shell{position:relative;min-height:100vh;padding-bottom:32px;overflow:hidden}.app-shell:before,.app-shell:after{position:absolute;z-index:0;pointer-events:none;content:"";border-radius:50%;filter:blur(2px);opacity:.42;animation:drift 18s ease-in-out infinite alternate}.app-shell:before{top:12%;right:-60px;width:220px;height:220px;background:radial-gradient(circle,rgb(189 236 215 / .65),transparent 70%)}.app-shell:after{bottom:18%;left:-90px;width:280px;height:280px;background:radial-gradient(circle,rgb(255 215 210 / .55),transparent 70%);animation-delay:-6s}@keyframes drift{0%{transform:translate(0) scale(1)}50%{transform:translate(20px,-18px) scale(1.06)}to{transform:translate(-12px,14px) scale(.96)}}.top-bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;min-height:70px;padding:12px 26px;border-bottom:1.5px solid var(--line);background:#fffdf7db;backdrop-filter:blur(16px) saturate(1.1);-webkit-backdrop-filter:blur(16px) saturate(1.1)}.brand-mark{display:inline-flex;align-items:center;gap:12px;color:var(--ink);font-family:var(--font-display);font-size:22px;font-weight:900;letter-spacing:.04em;white-space:nowrap}.brand-mark .brand-icon{border:1.5px solid var(--line);border-radius:18px 14px 17px 13px;background:linear-gradient(135deg,#fffdf780,#ffe58f8c),var(--sky);padding:5px;box-shadow:inset 0 1.5px #ffffffb3,0 4px 10px #2c5f751f;transform:rotate(-3deg);animation:brand-bob 4.5s var(--ease-soft) infinite}@keyframes brand-bob{0%,to{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(-1deg) translateY(-2px)}}.nav-links{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}.user-pill{max-width:220px;overflow:hidden;border:1.5px solid var(--line);border-radius:999px;background:linear-gradient(135deg,rgb(255 253 247 / .45),transparent),var(--sky);color:var(--ink);padding:8px 14px;font-weight:800;text-overflow:ellipsis;white-space:nowrap;box-shadow:var(--inset-light),0 3px 8px #2c5f7514}.workspace{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:22px;max-width:1440px;margin:0 auto;padding:22px 22px 0}.history-workspace{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.82fr);gap:22px;width:min(1360px,100%);margin:0 auto;padding:22px 22px 0}.entry-panel,.chart-panel,.details-panel,.history-panel{position:relative;overflow:hidden;border:1.5px solid var(--line);border-radius:var(--r-card);background:radial-gradient(circle at 12% 0%,rgb(255 230 195 / .4),transparent 45%),radial-gradient(circle at 100% 100%,rgb(189 236 215 / .32),transparent 50%),linear-gradient(135deg,#fffdf7f0,#f5fcffdb);box-shadow:var(--soft-shadow),var(--inset-light),var(--inset-dark);padding:22px;animation:panel-rise .72s var(--ease-spring) both}.entry-panel{animation-delay:60ms}.summary-panel>.chart-panel:first-child,.history-side-panel>.chart-panel:first-child{animation-delay:.14s}.summary-panel>.details-panel,.history-side-panel>.history-trend-panel{animation-delay:.22s}.history-panel{animation-delay:60ms;overflow-x:auto}@keyframes panel-rise{0%{opacity:0;transform:translateY(22px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.entry-panel:before,.chart-panel:before,.details-panel:before,.history-panel:before,.modal:before{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;content:"";opacity:.16;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='wash'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.62' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23wash)' opacity='0.36'/%3E%3C/svg%3E")}.entry-panel:after,.chart-panel:after,.details-panel:after,.history-panel:after{position:absolute;top:-10px;left:32px;width:78px;height:22px;pointer-events:none;content:"";background:repeating-linear-gradient(45deg,rgb(255 255 255 / .18) 0 4px,transparent 4px 8px),linear-gradient(135deg,var(--coral),var(--blush));border-radius:3px 1px 4px 2px;box-shadow:0 4px 10px #2c5f7524;transform:rotate(-3deg);z-index:2}.chart-panel:after{left:auto;right:32px;background:repeating-linear-gradient(45deg,rgb(255 255 255 / .18) 0 4px,transparent 4px 8px),linear-gradient(135deg,var(--mint),var(--mint-deep));transform:rotate(3deg)}.details-panel:after{background:repeating-linear-gradient(45deg,rgb(255 255 255 / .18) 0 4px,transparent 4px 8px),linear-gradient(135deg,var(--lemon),var(--lemon-deep))}.history-panel:after{background:repeating-linear-gradient(45deg,rgb(255 255 255 / .18) 0 4px,transparent 4px 8px),linear-gradient(135deg,var(--sky-deep),var(--pool))}.history-panel table{margin-top:14px}.summary-panel,.history-side-panel{display:grid;gap:22px;align-self:start}.summary-panel,.history-side-panel,.entry-panel,.chart-panel,.details-panel,.history-panel{min-width:0}.history-summary-panel{align-self:start}.history-trend-panel{overflow-x:auto}h1,h2{position:relative;z-index:1;margin:0 0 18px;color:var(--ink);font-family:var(--font-display);font-size:24px;font-weight:900;letter-spacing:.01em;line-height:1.15}h2{font-size:20px}h1:after,.panel-header h2:after{display:block;width:64px;height:7px;margin-top:4px;content:"";background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 8' fill='none'%3E%3Cpath d='M2 5 C 14 1, 26 8, 38 4 S 64 2, 78 5' stroke='%236EC5DD' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain}.panel-header h2:after{width:48px;height:6px}.entry-list{position:relative;z-index:1;display:grid;gap:12px;min-width:0}.entry-card{position:relative;z-index:1;display:grid;align-items:start;grid-template-columns:minmax(88px,.84fr) minmax(136px,.98fr) minmax(74px,.5fr) minmax(88px,.52fr) minmax(0,3.7fr) 40px;grid-template-areas:"type date amount category note remove";gap:10px;border:1.5px solid var(--line);border-radius:25px 21px 24px 19px;background:linear-gradient(135deg,#fffdf7f5,#bdecd72e);padding:12px;box-shadow:var(--inset-light),0 4px 10px #2c5f750f;transition:transform .28s var(--ease-spring),box-shadow .28s var(--ease-soft)}.entry-card:hover{transform:translateY(-2px);box-shadow:var(--inset-light),0 14px 26px #2c5f751f}.entry-card>:nth-child(1){grid-area:type}.entry-card>:nth-child(2){grid-area:date}.entry-card>:nth-child(3){grid-area:amount}.entry-card>:nth-child(4){grid-area:category}.entry-row{display:grid;align-items:center;grid-template-columns:minmax(90px,.75fr) minmax(140px,1fr) minmax(100px,.8fr) minmax(130px,1fr) minmax(160px,1.2fr) 36px;gap:8px}.entry-head{color:var(--ink);font-size:13px}.entry-row input,.entry-row select,.entry-card input,.entry-card select,.history-controls input,.history-controls select,.details-panel .panel-header select,.modal-form input,.modal-form select{width:100%;min-width:0;border:1.5px solid var(--line);border-radius:var(--r-input);background:#fffdf7f0;color:var(--ink);padding:10px 12px;font-weight:600;box-shadow:inset 0 2px 4px #2c5f750d;transition:border-color .2s var(--ease-soft),box-shadow .2s var(--ease-soft),transform .2s var(--ease-soft)}.entry-card>*{min-width:0}.entry-card>input:last-of-type{width:100%}.entry-card>:nth-child(5){grid-area:note;min-width:0;width:100%}.entry-card>:nth-child(6){grid-area:remove}.entry-card>:nth-child(1) select,.entry-card>:nth-child(2) input{min-width:0}.entry-row input:hover,.entry-row select:hover,.entry-card input:hover,.entry-card select:hover,.history-controls input:hover,.history-controls select:hover,.modal-form input:hover,.modal-form select:hover{border-color:var(--line-bold)}.entry-row input:focus,.entry-row select:focus,.entry-card input:focus,.entry-card select:focus,.history-controls input:focus,.history-controls select:focus,.modal-form input:focus,.modal-form select:focus{border-color:var(--pool-deep);box-shadow:inset 0 2px 4px #2c5f750a,0 0 0 3px #6ec5dd47}.category-field{display:grid;gap:8px;min-width:0}.date-field{position:relative;min-width:0}.date-placeholder{position:absolute;top:50%;left:14px;color:var(--ink-faint);pointer-events:none;transform:translateY(-50%);font-weight:500}.date-field input.empty:not(:focus){color:transparent}.date-field input.empty:not(:focus)::-webkit-datetime-edit{color:transparent}.icon-button{width:40px;height:40px;border-radius:22px 18px 20px 17px;padding:0;background:var(--blush);border-color:var(--coral);color:var(--coral-deep)}.icon-button:not(:disabled):hover{background:var(--coral);color:var(--paper);border-color:var(--coral-deep)}.actions,.panel-header,.segmented,.history-controls,.pager{display:flex;align-items:center;gap:8px}.actions{position:relative;z-index:1;justify-content:center;margin-top:18px}.actions button:last-child,.modal-actions button:last-child:not(.danger-button){border-color:var(--pool-deep);background:linear-gradient(135deg,var(--pool) 0%,var(--pool-deep) 100%);color:var(--paper);box-shadow:inset 0 1.5px #ffffff6b,0 8px 18px #4aa6c152;padding:10px 22px;min-height:42px}.actions button:last-child:not(:disabled):hover,.modal-actions button:last-child:not(.danger-button):not(:disabled):hover{background:linear-gradient(135deg,var(--pool-deep) 0%,var(--pool) 100%);color:var(--paper);border-color:var(--pool-deep);box-shadow:inset 0 1.5px #ffffff6b,0 14px 26px #4aa6c16b}.panel-header{position:relative;z-index:1;justify-content:space-between;min-width:0}.panel-header h2{flex:0 0 auto;margin:0;white-space:nowrap}.segmented{flex-wrap:wrap;justify-content:flex-end}.segmented button{min-height:34px;border-radius:999px;padding:7px 12px;font-size:13px;white-space:nowrap}.chart-header{flex-wrap:nowrap}.summary-panel>.chart-panel>.panel-header{flex-wrap:nowrap}.chart-header h2{flex:1 1 auto;font-size:18px;line-height:1.2;white-space:normal;word-break:keep-all}.summary-panel>.chart-panel>.panel-header h2{flex:1 1 auto;white-space:normal;word-break:keep-all}.chart-header .segmented{flex:0 0 auto;flex-wrap:nowrap}.summary-panel>.chart-panel>.panel-header .segmented{flex:0 0 auto;flex-wrap:nowrap}.chart-header .segmented button{padding:6px 10px}.summary-panel>.chart-panel>.panel-header .segmented button{padding:6px 10px}.chart-title{position:relative;z-index:1;margin:4px 0 14px;color:var(--ink-soft);font-family:var(--font-body);font-size:13px;font-weight:700;letter-spacing:.02em}.history-controls{flex-wrap:wrap;justify-content:flex-end}.pager{position:relative;z-index:1;justify-content:center;margin-top:12px}.pager span{border:1.5px solid var(--line);border-radius:var(--r-input);background:var(--paper-warm);padding:8px 14px;font-family:var(--font-body);font-size:13.5px;font-weight:800;letter-spacing:.03em;box-shadow:var(--inset-light)}table{position:relative;z-index:1;width:100%;border-collapse:separate;border-spacing:0 8px;margin-bottom:12px;table-layout:auto}th,td{border:0;color:var(--ink);font-size:13.5px;padding:11px 10px;text-align:left;white-space:nowrap}th{color:var(--ink-soft);font-weight:800;font-size:12px;letter-spacing:.06em;text-transform:uppercase}td{background:linear-gradient(135deg,#fffdf7eb,#eaf7ff80);font-weight:600;font-variant-numeric:tabular-nums;box-shadow:var(--inset-light)}tbody tr{transition:transform .22s var(--ease-spring)}tbody tr:hover td{background:linear-gradient(135deg,#fffdf7fa,#c8efff99)}tbody tr td:first-child{border-radius:17px 0 0 14px;border-left:1.5px solid var(--line)}tbody tr td:last-child{border-radius:0 15px 18px 0;border-right:1.5px solid var(--line)}tbody tr td:first-child,tbody tr td:last-child,tbody tr td{border-top:1.5px solid var(--line);border-bottom:1.5px solid var(--line)}tbody tr td:not(:first-child):not(:last-child){border-left:0;border-right:0}td[colspan]{border-radius:var(--r-input);border:1.5px dashed var(--line);background:#fffdf7bf;text-align:center;font-family:var(--font-body);font-size:14px;font-weight:700;color:var(--ink-soft)}.truncate{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-actions{display:flex;gap:6px}.square-action{display:inline-grid;width:34px;height:34px;place-items:center;border:1.5px solid var(--line);border-radius:17px 14px 16px 13px;padding:0}.square-action svg{width:18px;height:18px}.square-action svg path{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.9}.edit-action{background:linear-gradient(135deg,var(--mint),var(--mint-deep));color:var(--ink);border-color:var(--mint-deep)}.edit-action:not(:disabled):hover{background:linear-gradient(135deg,var(--mint-deep),var(--mint));color:var(--ink)}.delete-action{background:linear-gradient(135deg,var(--coral),var(--coral-deep));color:var(--paper);border-color:var(--coral-deep)}.delete-action:not(:disabled):hover{background:linear-gradient(135deg,var(--coral-deep),var(--coral));color:var(--paper)}.details-panel{padding:18px}.details-panel .panel-header{align-items:center;margin-bottom:14px}.details-panel .panel-header select{flex:0 0 auto;width:auto;min-width:86px}.details-panel table{table-layout:fixed}.details-panel th,.details-panel td{padding:8px 4px;font-size:12px;white-space:nowrap}.details-panel th:nth-child(1),.details-panel td:nth-child(1){width:78px}.details-panel th:nth-child(2),.details-panel td:nth-child(2){width:38px}.details-panel th:nth-child(3),.details-panel td:nth-child(3){width:54px}.details-panel th:nth-child(4),.details-panel td:nth-child(4){width:66px}.details-panel th:nth-child(5),.details-panel td:nth-child(5){width:auto;min-width:50px}.details-panel th:nth-child(6),.details-panel td:nth-child(6){width:110px;white-space:nowrap}.details-panel .truncate{max-width:100%;overflow:hidden;text-overflow:ellipsis}.details-panel .note-cell{white-space:normal;overflow:hidden;text-overflow:clip;overflow-wrap:anywhere;word-break:break-all}.details-panel tbody tr td:first-child{padding-left:8px}.details-panel tbody tr td:last-child{padding-right:8px}.details-panel>button{position:relative;z-index:1;width:100%;margin-top:4px}.details-panel .row-actions{gap:4px}.details-panel .square-action{width:30px;height:30px}.details-panel .square-action svg{width:16px;height:16px}.summary-table{margin-bottom:0}.summary-table tbody td:nth-child(2){font-family:var(--font-numeric);font-weight:800;font-size:14px;font-variant-numeric:tabular-nums;color:var(--ink)}.summary-table tbody td:nth-child(3){font-family:var(--font-numeric);font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink-soft)}.donut-block{position:relative;z-index:1;display:grid;place-items:center;margin-bottom:14px;color:var(--ink)}.donut-block.empty{min-height:200px;border:1.5px dashed var(--line);border-radius:28px 23px 29px 21px;background:#c8efff52;font-family:var(--font-body);font-size:14px;font-weight:700;color:var(--ink-soft)}.donut-content{display:grid;grid-template-columns:minmax(160px,220px) minmax(220px,1fr);align-items:center;justify-content:center;gap:18px;width:100%}.donut-chart{position:relative;display:grid;width:min(220px,100%);aspect-ratio:1;place-items:center;justify-self:end;border-radius:30px 24px 28px 22px;background:radial-gradient(circle at 30% 30%,rgb(255 255 255 / .6),transparent 50%),linear-gradient(135deg,#c8efff59,#bdecd740);padding:12px;box-shadow:var(--inset-light),0 6px 14px #2c5f7514}.donut-chart svg{width:100%;height:100%;transform:rotate(-90deg);filter:drop-shadow(0 2px 4px rgb(44 95 117 / .1))}.donut-bg,.donut-segment{fill:none;stroke-width:18}.donut-bg{stroke:#2c5f751a;stroke-dasharray:3 4}.donut-segment{stroke-linecap:round;transition:stroke-dasharray .54s var(--ease-spring)}.donut-center{position:absolute;display:grid;gap:4px;place-items:center;color:var(--ink);text-align:center}.donut-center span{color:var(--ink-soft);font-family:var(--font-body);font-size:12px;font-weight:700;letter-spacing:.04em}.donut-center strong{font-family:var(--font-numeric);font-size:18px;font-weight:900;letter-spacing:0;font-variant-numeric:tabular-nums}.donut-legend{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-content:center;gap:10px 14px;min-width:0;margin:0;padding:0;color:var(--ink);font-size:12.5px;font-weight:700;list-style:none}.donut-legend li{display:grid;grid-template-columns:14px minmax(0,1fr);align-items:center;gap:7px;min-width:0}.donut-legend i{width:14px;height:14px;border:1.5px solid var(--line);border-radius:8px 6px 7px 5px;box-shadow:var(--inset-light)}.donut-legend span{overflow:visible;text-overflow:clip;white-space:normal;word-break:keep-all;line-height:1.35}.trend-chart{position:relative;z-index:1;display:grid;min-height:220px;place-items:center;color:var(--ink);padding-top:4px}.trend-chart svg{width:100%;max-width:460px;min-height:240px;overflow:visible}.trend-chart.empty{border:1.5px dashed var(--line);border-radius:28px 23px 29px 21px;background:#c8efff4d;font-family:var(--font-body);font-size:14px;font-weight:700;color:var(--ink-soft);min-height:220px;place-items:center}.trend-legend{display:flex;flex-wrap:wrap;justify-content:flex-end;justify-self:end;gap:12px;width:100%;max-width:460px;margin:0 auto 12px;color:var(--ink);font-size:12px;font-weight:700}.trend-legend span{display:inline-flex;align-items:center;gap:6px}.trend-legend i{display:inline-block}.legend-bar{width:14px;height:10px;border-radius:6px 4px 5px 3px;background:linear-gradient(180deg,var(--pool),var(--pool-deep));box-shadow:var(--inset-light)}.legend-bar.negative{background:linear-gradient(180deg,var(--coral),var(--coral-deep))}.legend-line{width:22px;height:3px;border-radius:999px;background:var(--ink)}.trend-axis{fill:none;stroke:var(--line-bold);stroke-width:1.6;stroke-linecap:round}.trend-grid-line{stroke:#2c5f7514;stroke-width:1;stroke-dasharray:2 4}.trend-zero{stroke:var(--line-bold);stroke-dasharray:4 4;stroke-width:1.4}.trend-guide{stroke:var(--line);stroke-dasharray:3 4;stroke-width:1;opacity:0;transition:opacity .18s var(--ease-soft)}.trend-bar{fill:var(--pool);rx:6;filter:drop-shadow(0 2px 3px rgb(74 166 193 / .32));transition:fill .22s var(--ease-soft),transform .28s var(--ease-spring);transform-origin:center bottom}.trend-bar-group:hover .trend-bar{filter:drop-shadow(0 5px 7px rgb(74 166 193 / .4))}.trend-bar.negative{fill:var(--coral);filter:drop-shadow(0 2px 3px rgb(232 122 114 / .32))}.trend-bar-group:hover .trend-bar.negative{filter:drop-shadow(0 5px 7px rgb(232 122 114 / .42))}.trend-line-path{fill:none;stroke:var(--ink);stroke-linecap:round;stroke-linejoin:round;stroke-width:3;filter:drop-shadow(0 2px 3px rgb(44 95 117 / .18))}.trend-point{fill:var(--paper);stroke:var(--ink);stroke-width:3;transition:r .2s var(--ease-spring)}.trend-line-point:hover .trend-point{r:6}.trend-bar-group:hover .trend-guide,.trend-bar-group:focus-within .trend-guide{opacity:1}.trend-axis-tick,.trend-axis-corner{fill:var(--ink-soft);color:var(--ink-soft);font-family:var(--font-body);font-size:10px;font-weight:800}.trend-axis-tick-y{font-family:var(--font-body);font-size:9px;font-weight:700;font-variant-numeric:tabular-nums}.trend-axis-corner{font-family:var(--font-body);font-size:11px;font-weight:800;fill:var(--ink);color:var(--ink)}.trend-bar-value,.trend-point-value{opacity:0;fill:var(--ink);color:var(--ink);font-family:var(--font-body);font-size:9.5px;font-weight:800;font-variant-numeric:tabular-nums;paint-order:stroke;pointer-events:none;stroke:var(--paper);stroke-width:4px;transition:opacity .18s var(--ease-soft)}.trend-bar-group:hover .trend-bar-value,.trend-bar-group:focus-within .trend-bar-value,.trend-line-point:hover .trend-point-value,.trend-line-point:focus-within .trend-point-value{opacity:1}.trend-header{align-items:flex-start;margin-bottom:22px}.trend-header .chart-title{margin:6px 0 0}.message{position:fixed;right:18px;bottom:18px;z-index:20;margin:0;border:1.5px solid var(--ink);border-radius:var(--r-pill);background:linear-gradient(135deg,var(--ink) 0%,#1f4a5e 100%);color:var(--paper);padding:12px 18px;font-family:var(--font-body);font-size:14px;font-weight:800;letter-spacing:.04em;box-shadow:0 18px 36px #2c5f7552;animation:toast-in .54s var(--ease-spring)}@keyframes toast-in{0%{opacity:0;transform:translateY(28px) rotate(2deg)}60%{opacity:1;transform:translateY(-6px) rotate(-1deg)}to{opacity:1;transform:translateY(0) rotate(0)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:grid;place-items:center;background:#2c5f7552;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:16px;animation:backdrop-in .24s var(--ease-soft)}@keyframes backdrop-in{0%{opacity:0}to{opacity:1}}.modal{position:relative;overflow:hidden;width:min(440px,100%);border:1.5px solid var(--line);border-radius:var(--r-card);background:radial-gradient(circle at 12% 0%,rgb(255 230 195 / .45),transparent 45%),radial-gradient(circle at 100% 100%,rgb(189 236 215 / .32),transparent 50%),linear-gradient(135deg,#fffdf7f5,#f5fcffe0);padding:22px;box-shadow:0 30px 60px #2c5f7547,var(--inset-light);animation:modal-pop .48s var(--ease-spring)}@keyframes modal-pop{0%{opacity:0;transform:translateY(18px) scale(.94) rotate(-1deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}.modal:after{position:absolute;top:-10px;left:50%;width:96px;height:22px;pointer-events:none;content:"";background:repeating-linear-gradient(45deg,rgb(255 255 255 / .18) 0 4px,transparent 4px 8px),linear-gradient(135deg,var(--lemon),var(--coral));border-radius:3px 1px 4px 2px;box-shadow:0 4px 10px #2c5f7529;transform:translate(-50%) rotate(-2deg);z-index:2}.modal h2{margin-top:4px;text-align:center}.modal h2:after{margin:6px auto 0}.modal-form{position:relative;z-index:1;display:grid;gap:12px}.modal-form label{display:grid;gap:6px;color:var(--ink);font-size:13px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.modal-actions{position:relative;z-index:1;display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.delete-summary{position:relative;z-index:1;display:grid;gap:10px;margin:0}.delete-summary div{display:grid;grid-template-columns:84px 1fr;gap:8px;border:1.5px solid var(--line);border-radius:var(--r-input);background:linear-gradient(135deg,#c8efff66,#ffe58f38);padding:11px 14px;box-shadow:var(--inset-light)}.delete-summary dt{color:var(--ink-soft);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.delete-summary dd{margin:0;font-family:var(--font-numeric);font-weight:800;font-size:14px;font-variant-numeric:tabular-nums}.delete-message{position:relative;z-index:1;margin:18px 0 0;font-family:var(--font-body);font-size:15px;font-weight:800;text-align:center;color:var(--ink)}.watercolor-mascot{--mascot-size: 116px;--mascot-edge: 14px;position:fixed;bottom:14px;left:var(--mascot-edge);z-index:4;width:var(--mascot-size);height:var(--mascot-size);pointer-events:none;filter:drop-shadow(0 12px 18px rgb(44 95 117 / .18));will-change:left,transform}.watercolor-mascot-blue{animation:mascot-blue-travel 22s ease-in-out infinite}.watercolor-mascot-pink{bottom:30px;left:calc(100vw - var(--mascot-size) - var(--mascot-edge));animation:mascot-pink-travel 26s ease-in-out .8s infinite}.mascot-image{display:block;width:100%;height:100%;object-fit:contain;transform-origin:50% 92%;animation:mascot-hop 1.4s ease-in-out infinite;will-change:transform}.watercolor-mascot-pink .mascot-image{animation-duration:1.65s;animation-delay:.35s}@keyframes mascot-hop{0%,to{transform:translateY(0) scale(1) rotate(-4deg)}18%{transform:translateY(2px) scale(1.08,.9) rotate(0)}45%{transform:translateY(-16px) scale(.95,1.07) rotate(4deg)}78%{transform:translateY(1px) scale(1.06,.94) rotate(0)}}@keyframes mascot-blue-travel{0%{left:var(--mascot-edge);transform:scaleX(1)}46%{left:calc(100vw - var(--mascot-size) - var(--mascot-edge));transform:scaleX(1)}50%{left:calc(100vw - var(--mascot-size) - var(--mascot-edge));transform:scaleX(-1)}96%{left:var(--mascot-edge);transform:scaleX(-1)}to{left:var(--mascot-edge);transform:scaleX(1)}}@keyframes mascot-pink-travel{0%{left:calc(100vw - var(--mascot-size) - var(--mascot-edge));transform:scaleX(-1)}46%{left:var(--mascot-edge);transform:scaleX(-1)}50%{left:var(--mascot-edge);transform:scaleX(1)}96%{left:calc(100vw - var(--mascot-size) - var(--mascot-edge));transform:scaleX(1)}to{left:calc(100vw - var(--mascot-size) - var(--mascot-edge));transform:scaleX(-1)}}@media(prefers-reduced-motion:reduce){.watercolor-mascot-blue,.watercolor-mascot-pink{animation-duration:60s}.mascot-image,.watercolor-mascot-pink .mascot-image{animation-duration:4s}.entry-panel,.chart-panel,.details-panel,.history-panel,.modal,.message,.brand-mark .brand-icon,.app-shell:before,.app-shell:after{animation:none!important}}@media(max-width:1060px){.workspace,.history-workspace{grid-template-columns:1fr}}@media(max-width:900px){.donut-content{grid-template-columns:1fr}.donut-chart{justify-self:center}.donut-legend{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));width:100%}.history-header{align-items:flex-start;flex-direction:column}.history-controls{justify-content:flex-start;width:100%}.entry-row{grid-template-columns:1fr}.entry-head{display:none}}@media(max-width:640px){.app-shell{padding-bottom:18px;overflow-x:hidden}.top-bar{align-items:flex-start;flex-direction:column;gap:10px;padding:14px}.brand-mark{font-size:26px}.nav-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));justify-content:stretch;width:100%}.nav-links button{width:100%}.user-pill{min-width:0}.nav-links button:last-child:nth-child(3){grid-column:1 / -1}.nav-links button,.user-pill{max-width:100%}.workspace,.history-workspace{gap:14px;width:100%;padding:12px}input[type=date]{max-width:100%;min-width:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.entry-panel,.chart-panel,.details-panel,.history-panel{border-radius:26px 22px 28px 20px;padding:16px}.entry-panel:after,.chart-panel:after,.details-panel:after,.history-panel:after{left:22px;width:60px;height:18px}.chart-panel:after{right:22px;left:auto}h1{font-size:26px}h2{font-size:22px}.panel-header,.chart-header{align-items:flex-start;flex-direction:column}.segmented,.chart-header .segmented,.history-controls,.actions,.modal-actions{display:grid;grid-template-columns:1fr;width:100%}.segmented button,.actions button,.history-controls input,.history-controls select,.modal-actions button{min-width:0;width:100%}.entry-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"type amount" "date date" "category category" "note note" "remove remove";gap:8px}.entry-card>:nth-child(2){width:100%}.entry-card>:nth-child(5){min-height:42px}.icon-button{justify-self:end}.history-panel,.details-panel,.history-trend-panel{overflow-x:hidden}table{display:block;min-width:0;border-spacing:0}thead{display:none}tbody{display:grid;gap:10px}tbody tr{display:grid;gap:0;border:1.5px solid var(--line);border-radius:22px 18px 23px 17px;overflow:hidden;background:linear-gradient(135deg,#fffdf7f0,#eaf7ff80);box-shadow:var(--inset-light),0 4px 10px #2c5f750f}th,td,.details-panel th,.details-panel td{width:auto;min-width:0;padding:9px 12px;white-space:normal}.details-panel table{table-layout:auto}.details-panel th:nth-child(n),.details-panel td:nth-child(n){width:auto;min-width:0}.details-panel tbody tr td:first-child,.details-panel tbody tr td:last-child{padding-right:12px;padding-left:12px}td{display:grid;grid-template-columns:82px minmax(0,1fr);gap:10px;align-items:start;border:0;border-radius:0;background:transparent;box-shadow:none}td:before{color:var(--ink-soft);font-size:12px;font-weight:900;letter-spacing:.04em}tbody tr td:first-child,tbody tr td:last-child,tbody tr td{border:0;border-bottom:1.5px solid var(--line);border-radius:0}tbody tr td:last-child{border-bottom:0}td[colspan]{display:block;border:1.5px dashed var(--line);border-radius:var(--r-input)}td[colspan]:before{content:none}table:not(.summary-table) td:nth-child(1):before{content:"日期"}table:not(.summary-table) td:nth-child(2):before{content:"類型"}table:not(.summary-table) td:nth-child(3):before{content:"類別"}table:not(.summary-table) td:nth-child(4):before{content:"金額"}table:not(.summary-table) td:nth-child(5):before{content:"備註"}table:not(.summary-table) td:nth-child(6):before{content:"建立時間"}table:not(.summary-table) td:nth-child(7):before{content:"操作"}.summary-table{min-width:0}.summary-table td:nth-child(1):before{content:"項目"}.summary-table td:nth-child(2):before{content:"金額"}.summary-table td:nth-child(3):before{content:"比例"}.truncate,.details-panel .truncate{max-width:100%;white-space:normal;overflow-wrap:anywhere}.row-actions{flex-wrap:wrap}.trend-chart svg{min-height:210px}.pager{display:grid;grid-template-columns:1fr}.pager button,.pager span{width:100%}.watercolor-mascot{--mascot-size: 84px;--mascot-edge: 8px;opacity:.92}.watercolor-mascot-pink{bottom:22px}}
