:root{--ink:#17231e;--muted:#6d7772;--paper:#f3f2ed;--card:#fffefa;--line:#d9ddd8;--green:#245c4c;--green-dark:#153e34;--green-soft:#e6f1eb;--amber:#d5942e;--amber-soft:#fbefd7;--violet:#7a63a8;--red:#c55748;--red-soft:#f8e8e4;--shadow:0 12px 32px #1c312912}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font-family:var(--font-geist-sans), "PingFang TC", "Noto Sans TC", sans-serif;margin:0}button,input,select{font:inherit}button{color:inherit}button,summary,select,input[type=range]{cursor:pointer}.topbar{z-index:50;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#fffefaeb;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;height:68px;padding:0 max(24px,50vw - 770px);display:grid;position:sticky;top:0}.brand{align-items:center;gap:11px;display:flex}.brand>span:last-child{flex-direction:column;display:flex}.brand strong{letter-spacing:-.01em;font-size:14px}.brand small{color:var(--muted);margin-top:2px;font-size:9px}.brand-mark{background:var(--green);color:#fff;border-radius:50%;place-items:center;width:34px;height:34px;font-weight:850;display:grid}.topbar-status{color:var(--muted);align-items:center;gap:7px;font-size:10px;display:flex}.topbar-status i{background:#49a876;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #49a8761f}.reset-button{color:#52615b;background:0 0;border:1px solid #cbd1cd;border-radius:5px;justify-self:end;padding:8px 13px;font-size:10px;font-weight:700}.reset-button:hover{border-color:var(--green);color:var(--green)}.workspace{grid-template-columns:330px minmax(0,1fr);align-items:start;gap:22px;width:min(1540px,100% - 40px);margin:0 auto;padding:22px 0 60px;display:grid}.control-panel{background:var(--card);border:1px solid var(--line);max-height:calc(100vh - 112px);box-shadow:var(--shadow);scrollbar-width:thin;padding:24px;position:sticky;top:90px;overflow-y:auto}.panel-title{border-bottom:1px solid var(--line);padding-bottom:20px}.panel-title p,.dashboard-head p,.analysis-card header p{color:var(--green);letter-spacing:.16em;margin:0 0 6px;font-size:9px;font-weight:850}.panel-title h1{letter-spacing:-.035em;margin:0;font-family:Georgia,Noto Serif TC,serif;font-size:30px;font-weight:500}.panel-title span,.dashboard-head>div>span{color:var(--muted);margin-top:7px;font-size:10px;display:block}fieldset{border:0;margin:22px 0 0;padding:0}legend{margin-bottom:10px;font-size:11px;font-weight:780}.segmented,.preset-row{grid-template-columns:repeat(3,1fr);gap:5px;display:grid}.segmented button,.preset-row button{background:#fff;border:1px solid #cfd5d1;min-width:0;padding:9px 5px;font-size:11px}.segmented button.active,.preset-row button.active{border-color:var(--green);background:var(--green);color:#fff;font-weight:800}.year-selector button small{margin-top:2px;font-size:6px;display:block}.year-selector button:disabled{color:#9aa09c;cursor:not-allowed;background:#eceeeb}.year-selector button:disabled span{text-decoration:line-through}.field-help{color:#858d89;margin:7px 0 0;font-size:9px;line-height:1.5}.money-input{background:#fff;border:1px solid #cfd5d1;align-items:center;height:43px;display:flex}.money-input input{text-align:right;background:0 0;border:0;outline:0;flex:1;min-width:0;padding:0 10px;font-size:18px;font-weight:800}.money-input span{color:var(--muted);border-left:1px solid var(--line);padding:0 12px;font-size:10px}.spend-display{align-items:baseline;gap:7px;margin-bottom:8px;display:flex}.spend-display strong{color:var(--green);font-family:Georgia,serif;font-size:30px}.spend-display span{color:var(--muted);font-size:10px}.spend-number{border:1px solid var(--line);background:#fff;grid-template-columns:auto 1fr auto;align-items:center;gap:7px;margin-bottom:9px;padding:6px 9px;display:grid}.spend-number>span,.spend-number>small{color:var(--muted);font-size:8px}.spend-number input{width:100%;min-width:0;color:var(--green);text-align:right;background:0 0;border:0;outline:0;font-size:13px;font-weight:800}input[type=range]{width:100%;accent-color:var(--green)}.preset-row{margin-top:7px}.portfolio-fieldset{border-top:1px solid var(--line);padding-top:19px}.fieldset-note{color:var(--muted);margin:-5px 0 9px;font-size:8px}.slot-editor{gap:7px;display:grid}.etf-select-row{grid-template-columns:39px minmax(0,1fr) 30px;align-items:center;gap:5px;display:grid}.slot-weight{background:var(--green-dark);color:#fff;place-items:center;height:34px;font-size:9px;font-weight:800;display:grid}.etf-select-row select{background:#fff;border:1px solid #cfd5d1;min-width:0;height:34px;padding:0 5px;font-size:10px}.etf-select-row button{width:30px;height:34px;color:var(--green);background:#fff;border:1px solid #b8c7c0;border-radius:50%;font-family:Georgia,serif;font-size:13px;font-weight:800}.allocation-explain{background:var(--amber-soft);border-left:3px solid var(--amber);color:#6d5731;margin:9px 0 0;padding:9px 10px;font-size:9px;line-height:1.55}.coverage-status{background:var(--green-soft);border-left:3px solid var(--green);grid-template-columns:26px 1fr;align-items:center;gap:9px;margin-top:18px;padding:11px;display:grid}.coverage-status.warn{background:var(--red-soft);border-color:var(--red)}.coverage-status>span{background:var(--green);color:#fff;border-radius:50%;place-items:center;width:24px;height:24px;font-size:11px;font-weight:850;display:grid}.coverage-status.warn>span{background:var(--red)}.coverage-status strong,.coverage-status small{display:block}.coverage-status strong{font-size:10px}.coverage-status small{color:var(--muted);margin-top:3px;font-size:8px}.sidebar-etf-info{border:1px solid var(--line);background:#f5f7f4;margin-top:16px;padding:15px}.sidebar-info-head{justify-content:space-between;align-items:center;font-size:10px;font-weight:800;display:flex}.sidebar-info-head button{color:var(--muted);background:0 0;border:0;font-size:18px}.insight-tabs{grid-template-columns:repeat(3,1fr);gap:3px;margin-top:10px;display:grid}.insight-tabs button{border:1px solid var(--line);background:#fff;padding:7px 4px}.insight-tabs button.active{background:var(--green);color:#fff}.insight-tabs strong,.insight-tabs small{font-size:8px;display:block}.sidebar-etf-info h2{margin:14px 0 7px;font-family:Georgia,serif;font-size:16px;font-weight:500}.sidebar-etf-info>p{color:var(--muted);font-size:9px;line-height:1.65}.mini-pros-cons{grid-template-columns:1fr 1fr;gap:7px;display:grid}.mini-pros-cons>div{border-top:2px solid var(--green);background:#fff;padding:8px}.mini-pros-cons>div:last-child{border-color:var(--red)}.mini-pros-cons strong,.mini-pros-cons span{font-size:8px;line-height:1.5;display:block}.mini-pros-cons span{color:var(--muted);margin-top:5px}.history-note{background:var(--amber-soft);padding:8px}.dashboard{min-width:0}.dashboard-head{justify-content:space-between;align-items:end;gap:20px;min-height:77px;padding:6px 2px 17px;display:flex}.dashboard-head h2{letter-spacing:-.035em;margin:0;font-family:Georgia,Noto Serif TC,serif;font-size:clamp(28px,3vw,39px);font-weight:500}.active-combination{gap:5px;padding-bottom:4px;display:flex}.active-combination span{color:var(--green);background:#e8ece9;padding:5px 8px;font-size:9px;font-weight:800}.kpi-grid{background:var(--line);border:1px solid var(--line);grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;display:grid}.metric-card{background:var(--card);min-width:0;min-height:128px;padding:20px}.metric-card.primary{background:var(--green-dark);color:#fff}.metric-card>span,.metric-card>small,.metric-value{display:block}.metric-card>span{color:var(--muted);font-size:9px}.metric-card.primary>span,.metric-card.primary>small{color:#ffffff9e}.metric-value{white-space:nowrap;margin:15px 0 10px;font-family:Georgia,serif;font-size:clamp(18px,2vw,25px);font-weight:500}.metric-value.positive{color:#247957}.metric-value.negative{color:var(--red)}.metric-card.primary .metric-value{color:#d5f0e3}.metric-card>small{color:var(--muted);font-size:8px;line-height:1.5}.decision-strip{border-left:4px solid var(--green);background:var(--green-soft);align-items:center;gap:13px;margin-top:10px;padding:11px 15px;display:flex}.decision-strip.risk{border-color:var(--red);background:var(--red-soft)}.decision-strip strong{font-size:10px}.decision-strip span{color:var(--muted);font-size:9px}.analysis-grid{grid-template-columns:minmax(310px,.76fr) minmax(520px,1.5fr);gap:12px;margin-top:12px;display:grid}.analysis-card{background:var(--card);border:1px solid var(--line);min-width:0;box-shadow:var(--shadow)}.analysis-card>header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:14px;min-height:68px;padding:15px 18px;display:flex}.analysis-card header h3{margin:0;font-family:Georgia,serif;font-size:19px;font-weight:500}.analysis-card header>small{max-width:150px;color:var(--muted);text-align:right;font-size:8px;line-height:1.45}.allocation-body{grid-template-columns:178px 1fr;align-items:center;gap:12px;padding:20px 18px 12px;display:grid}.donut-chart{width:170px;height:170px;position:relative}.donut-chart svg{width:100%;height:100%;display:block;overflow:visible}.donut-slice{transform-origin:90px 90px;stroke:var(--card);stroke-width:2px;cursor:pointer;transition:transform .2s,filter .2s,opacity .2s;transform:translate(0)}.donut-slice:hover,.donut-slice:focus-visible{transform:translate(var(--slice-x), var(--slice-y));filter:drop-shadow(0 7px 5px #17231e30);outline:none}.donut-slice.selected{stroke:#fffefa;stroke-width:3px}.donut-center{pointer-events:none;z-index:2;background:var(--card);box-shadow:0 0 0 1px var(--line);text-align:center;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:48px}.donut-center span{color:var(--green);font-size:10px;font-weight:850}.donut-center strong{margin:5px 0 2px;font-family:Georgia,serif;font-size:19px}.donut-center small{color:var(--muted);font-size:8px}.allocation-legend{gap:4px;display:grid}.allocation-legend button{text-align:left;background:0 0;border:1px solid #0000;grid-template-columns:7px 1fr auto;align-items:center;gap:8px;min-width:0;padding:8px;display:grid}.allocation-legend button:hover,.allocation-legend button:focus,.allocation-legend button[aria-pressed=true]{background:#f2f5f2;border-color:#b8c8c0;outline:0}.allocation-legend i{border-radius:4px;width:7px;height:30px}.allocation-legend span{min-width:0}.allocation-legend strong,.allocation-legend small{display:block}.allocation-legend strong{font-size:11px}.allocation-legend small{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:8px;overflow:hidden}.allocation-legend b{font-size:10px}.allocation-detail{border-top:1px solid var(--line);grid-template-columns:1fr 1fr;display:grid}.allocation-detail span{color:var(--muted);padding:11px 14px;font-size:8px}.allocation-detail span+span{border-left:1px solid var(--line)}.allocation-detail b{color:var(--ink);margin-top:3px;font-size:10px;display:block}.year-legend{gap:6px;padding:12px 18px 0;display:flex}.year-legend button{border:1px solid var(--line);background:#fff;grid-template-columns:7px auto;align-items:center;column-gap:6px;padding:6px 8px;display:grid}.year-legend button.active{border-color:var(--green);background:var(--green-soft)}.year-legend button:disabled{opacity:.4;cursor:not-allowed}.year-legend i{border-radius:4px;grid-row:1/3;width:7px;height:25px}.year-legend span{font-size:9px;font-weight:800}.year-legend small{color:var(--muted);font-size:7px}.year-chart-shell{padding:2px 10px 0;overflow:hidden}.year-chart-canvas{min-width:600px;position:relative}.year-chart-canvas svg{width:100%;height:auto;display:block}.year-chart-canvas text{fill:#8c9490;font-size:9px}.grid-line{stroke:#e4e8e4;stroke-width:1px}.hover-guide{stroke:#9da8a2;stroke-width:1px;stroke-dasharray:4 4}.series polyline{fill:none;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 2px #0000000f);stroke-dasharray:1400;stroke-dashoffset:0;animation:.9s ease-out draw-line}.series circle{stroke:#fff;stroke-width:3px;transition:cx .16s,cy .16s}.chart-hit-grid{grid-template-columns:repeat(12,1fr);display:grid;position:absolute;inset:7% 1.8% 14% 6%}.chart-hit-grid button{background:0 0;border:0}.chart-hit-grid button:hover,.chart-hit-grid button:focus{background:#245c4c09;outline:0}.year-tooltip{border-top:1px solid var(--line);background:#f3f6f3;align-items:center;gap:13px;min-height:43px;padding:8px 18px;display:flex}.year-tooltip>strong{margin-right:auto;font-size:10px}.year-tooltip span{color:var(--muted);align-items:center;gap:5px;font-size:8px;display:flex}.year-tooltip i{border-radius:50%;width:7px;height:7px}.year-tooltip b{color:var(--ink);font-size:10px}.cashflow-panel{margin-top:12px}.cashflow-panel>header button{background:var(--green-soft);color:var(--green);border:0;border-radius:999px;padding:8px 11px;font-size:8px;font-weight:800}.cashflow-panel>header button.playing{background:var(--amber-soft);color:#765520}.cashflow-layout{grid-template-columns:minmax(0,1fr) 275px;gap:15px;padding:18px;display:grid}.month-chart{grid-template-columns:repeat(12,1fr);gap:5px;height:225px;display:grid}.month-chart button{background:0 0;border:0;border-bottom:3px solid #0000;flex-direction:column;min-width:0;padding:0 2px 7px;display:flex;position:relative}.month-chart button.selected{border-color:var(--green)}.month-chart button>span{color:var(--muted);margin-top:6px;font-size:8px}.bar-track{background:#edf0ed;flex:1;width:100%;position:relative;overflow:hidden}.dividend-bar{background:var(--green);min-height:2px;transition:height .28s,background .2s;position:absolute;bottom:0;left:19%;right:19%}.month-chart button.negative .dividend-bar{background:var(--red)}.spend-line{z-index:2;border-top:1px dashed var(--amber);position:absolute;left:0;right:0}.month-chart button i{z-index:3;background:var(--red);color:#fff;border-radius:50%;place-items:center;width:19px;height:19px;font-size:7px;font-style:normal;font-weight:800;display:grid;position:absolute;top:-5px;right:-4px}.chart-legend{color:var(--muted);flex-wrap:wrap;gap:14px;margin-top:9px;font-size:8px;display:flex}.chart-legend span{align-items:center;gap:5px;display:flex}.chart-legend i{width:9px;height:9px}.legend-dividend{background:var(--green)}.legend-shortage{background:var(--red)}.legend-spend{border-top:1px dashed var(--amber);height:1px!important}.month-detail{border-left:4px solid var(--green);background:var(--green-soft);padding:17px}.month-detail.negative{border-color:var(--red);background:var(--red-soft)}.month-detail-title{align-items:center;gap:12px;display:flex}.month-detail-title>span{color:var(--green);font-family:Georgia,serif;font-size:38px}.month-detail.negative .month-detail-title>span{color:var(--red)}.month-detail-title small{color:var(--muted);font-size:8px}.month-detail-title h4{margin:3px 0 0;font-size:13px}.month-detail dl{margin:15px 0}.month-detail dl div{border-top:1px solid #245c4c24;justify-content:space-between;gap:8px;padding:7px 0;font-size:9px;display:flex}.month-detail dt{color:var(--muted)}.month-detail dd{margin:0;font-weight:800}.month-detail p{margin:0;font-size:9px;line-height:1.55}.month-detail>small{color:var(--muted);margin-top:10px;font-size:7px;line-height:1.55;display:block}.data-section{background:var(--card);border:1px solid var(--line);margin-top:12px}.data-section summary{justify-content:space-between;align-items:center;gap:15px;padding:16px 18px;font-size:11px;font-weight:800;display:flex}.data-section summary small{color:var(--muted);font-size:8px;font-weight:400}.data-section[open] summary{border-bottom:1px solid var(--line)}.table-wrap{overflow-x:auto}.table-wrap table{border-collapse:collapse;width:100%;min-width:1000px}.table-wrap th,.table-wrap td{text-align:left;white-space:nowrap;border-bottom:1px solid #e8ebe8;padding:12px 13px;font-size:8px}.table-wrap th{color:var(--muted);background:#f0f3f0;font-weight:800}.table-wrap tbody tr{cursor:pointer}.table-wrap tbody tr:hover{background:#f4f7f4}.table-wrap tr.sale-row{background:#fff6f2}.positive-text{color:#247957;font-weight:800}.negative-text{color:var(--red);font-weight:800}.etf-library-grid{background:var(--line);grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;display:grid}.etf-library-grid button{text-align:left;background:#fff;border:0;min-width:0;padding:14px}.etf-library-grid button:hover{background:var(--green-soft)}.etf-library-grid span,.etf-library-grid strong,.etf-library-grid small{display:block}.etf-library-grid span{color:var(--green);font-family:Georgia,serif;font-size:16px;font-weight:800}.etf-library-grid strong{text-overflow:ellipsis;white-space:nowrap;margin:6px 0;font-size:9px;overflow:hidden}.etf-library-grid small{color:var(--muted);font-size:7px}.method-note{background:#e8ece9;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin-top:12px;padding:13px 16px;display:grid}.method-note strong{font-size:9px}.method-note span,.method-note small{color:var(--muted);font-size:8px}@keyframes draw-line{0%{stroke-dashoffset:1400px}to{stroke-dashoffset:0}}@media (max-width:1180px){.workspace{grid-template-columns:300px minmax(0,1fr)}.kpi-grid{grid-template-columns:repeat(2,1fr)}.analysis-grid{grid-template-columns:1fr}.allocation-body{grid-template-columns:200px 1fr}.allocation-panel{min-height:0}.etf-library-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:820px){.topbar{grid-template-columns:1fr auto;padding:0 16px}.topbar-status{display:none}.workspace{grid-template-columns:1fr;width:min(100% - 24px,760px)}.control-panel{max-height:none;position:static;overflow:visible}.cashflow-layout{grid-template-columns:1fr}.month-detail{min-height:0}}@media (max-width:640px){.workspace{grid-template-columns:1fr;width:min(100% - 18px,620px);padding-top:10px}.topbar{height:60px}.brand small{display:none}.reset-button{padding:7px 9px;font-size:8px}.control-panel{padding:18px}.dashboard-head{flex-direction:column;align-items:start}.kpi-grid{grid-template-columns:1fr}.metric-card{min-height:104px}.decision-strip{flex-direction:column;align-items:flex-start;gap:4px}.analysis-grid{grid-template-columns:1fr}.allocation-body{grid-template-columns:1fr;justify-items:center}.allocation-legend{width:100%}.year-chart-shell{overflow-x:auto}.year-chart-canvas{width:690px}.year-tooltip{gap:8px;overflow-x:auto}.cashflow-layout{padding:13px}.month-chart{gap:2px;height:185px}.month-chart button>span{font-size:7px}.month-chart button i{right:-6px}.etf-library-grid{grid-template-columns:repeat(2,1fr)}.method-note{grid-template-columns:1fr;gap:5px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
