/* ══════════════════════════════════════════════════════════════════
   concept-prototype 版面（1:1 移植，2026-09-09）

   來源：concept-prototype/styles.css。改動只有四處，其餘逐字保留：
   1. 裸元素選擇器（*、button、input、select、svg）全部 scope 到 .app-shell，
      否則會污染既有的彈窗、Chart.js 圖表與 morphicons。
   2. 移除 html{scroll-behavior}，並讓 body 不再設 margin——正式版 style.css 的
      overflow-x:clip 必須保留（用 hidden 會讓 sticky 失效，見 CLAUDE.md 第 5 節）。
   3. 桌機側欄整段停用（2026-09-09 Jingyang 決定只做手機）。
   4. 檔尾追加深色模式 token（原型本身沒有深色模式）。
   ══════════════════════════════════════════════════════════════════ */
:root {
  --ink: #19332d;
  --ink-2: #39544d;
  --muted: #71817b;
  --paper: #f5f2ea;
  --surface: #fffdf8;
  --line: #deddd4;
  --green: #1f705d;
  --green-soft: #d8ece3;
  --coral: #d96851;
  --gold: #e0a83e;
  --shadow: 0 18px 60px rgba(49, 65, 58, .08);
  --radius: 22px;
}
.app-shell *{box-sizing:border-box}
/* html 規則移除：正式版已設 overflow-x:clip，不可覆蓋 */
body{background:var(--paper);color:var(--ink);font-family:"IBM Plex Sans","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;-webkit-font-smoothing:antialiased}
.app-shell :where(button,input,select){font:inherit;color:inherit}
.app-shell button{cursor:pointer}
.app-shell :where(svg){width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.app-shell{min-height:100vh}
.sidebar{position:fixed;inset:0 auto 0 0;width:244px;padding:32px 20px 22px;background:#173b33;color:#edf5f0;display:flex;flex-direction:column;z-index:50}
.brand{display:flex;gap:12px;align-items:center;color:inherit;text-decoration:none;padding:0 9px 36px}
.brand-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(255,255,255,.35);border-radius:13px;font-family:serif;font-size:19px;background:rgba(255,255,255,.08)}
.brand strong,.brand small{display:block}.brand strong{font-size:16px;letter-spacing:.08em}.brand small{margin-top:4px;color:#afc6bd;font-size:10px;letter-spacing:.08em}
.main-nav{display:grid;gap:7px}.nav-item{position:relative;width:100%;height:48px;border:0;border-radius:13px;background:transparent;color:#afc6bd;display:flex;align-items:center;gap:13px;padding:0 14px;text-align:left;transition:background .2s,color .2s}.nav-item:hover{background:rgba(255,255,255,.07);color:#fff}.nav-item.active{background:#f4ead0;color:#173b33;font-weight:700}.nav-item svg{width:19px}.nav-item em{margin-left:auto;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--coral);color:#fff;font-size:11px;font-style:normal}.sidebar-foot{margin-top:auto}.sync-state{display:flex;align-items:center;gap:7px;color:#a9c2b8;font-size:11px;padding:18px 14px 0}.sync-state>span{width:7px;height:7px;border-radius:50%;background:#69c098;box-shadow:0 0 0 4px rgba(105,192,152,.12)}.sync-state time{margin-left:auto;color:#74978a}
.content{margin-left:244px;padding:31px clamp(28px,4vw,64px) 70px;max-width:1600px}
.topbar{height:62px;display:flex;align-items:center;justify-content:space-between;margin-bottom:32px}.eyebrow,.section-label{margin:0 0 5px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.topbar h1{margin:0;font-family:Georgia,"Noto Serif TC",serif;font-size:25px;font-weight:600}.top-actions{display:flex;align-items:center;gap:11px}.period-select{height:40px;display:flex;align-items:center;gap:8px;padding:0 12px;background:rgba(255,253,248,.7);border:1px solid var(--line);border-radius:12px}.period-select svg{width:16px}.period-select select{border:0;background:transparent;font-size:13px;font-weight:600;outline:none}.icon-button{position:relative;width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.icon-button span{position:absolute;right:8px;top:7px;width:6px;height:6px;background:var(--coral);border:1.5px solid white;border-radius:50%}.avatar{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#c6d8ce;color:#21493f;font-weight:800;font-size:12px}
.page{display:none;animation:pageIn .28s ease}.page.active{display:block}@keyframes pageIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.quick-entry{position:relative;min-height:92px;padding:18px 22px;display:grid;grid-template-columns:46px 190px minmax(260px,1fr);gap:15px;align-items:center;background:var(--surface);border:1px solid #d8d8ce;border-radius:20px;box-shadow:var(--shadow);overflow:hidden}.quick-entry:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--gold)}.quick-entry-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:14px;background:#f6e9bd;color:#775b20}.quick-entry-icon svg{width:22px}.quick-copy h2{font-size:15px;margin:0 0 4px}.quick-copy p{font-size:11px;color:var(--muted);margin:0}.quick-entry form{display:flex;align-items:center;border:1px solid #cdd2cb;background:#f8f7f1;border-radius:14px;padding:4px 5px 4px 15px;transition:border-color .2s,box-shadow .2s}.quick-entry form:focus-within{border-color:var(--green);box-shadow:0 0 0 3px rgba(31,112,93,.12)}.quick-entry input{width:100%;height:38px;border:0;outline:0;background:transparent;font-size:13px}.quick-entry form button,.ai-compose button{display:grid;place-items:center;flex:0 0 36px;height:36px;border:0;border-radius:10px;background:var(--green);color:#fff}.quick-result{position:absolute;left:84px;bottom:7px;font-size:10px;color:var(--green);opacity:0;transition:opacity .2s}.quick-result.show{opacity:1}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,.85fr);gap:22px;margin-top:22px}.hero-card,.action-card,.category-card,.trend-card,.recent-section{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 10px 36px rgba(49,65,58,.05)}.hero-card{padding:27px 29px}.hero-head{display:flex;justify-content:space-between;align-items:flex-start}.hero-number{display:block;margin-top:4px;font-family:Georgia,serif;font-size:44px;font-weight:500;letter-spacing:-.03em}.quiet-button{border:1px solid var(--line);border-radius:10px;background:transparent;padding:8px 11px;color:var(--ink-2);font-size:11px}.budget-track{position:relative;height:10px;margin:25px 0 10px;border-radius:20px;background:#e7e8df;overflow:visible}.budget-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3f8a73,#74a58e)}.budget-track i{position:absolute;top:-4px;width:2px;height:18px;background:var(--ink);opacity:.65}.budget-scale{display:flex;justify-content:space-between;color:var(--muted);font-size:10px}.pace-note{margin-top:25px;padding-top:17px;border-top:1px solid #e7e6df;display:flex;align-items:center;gap:9px}.status-dot{width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px #f7edcf}.pace-note p{margin:0;font-size:11px;color:var(--ink-2)}.pace-note button{margin-left:auto;border:0;background:none;font-size:11px;font-weight:700;color:var(--green);display:flex;align-items:center;gap:4px}.pace-note button svg{width:13px}
.action-card{padding:22px}.section-head{display:flex;align-items:start;justify-content:space-between;padding:0 2px 11px}.section-head h2,.section-title-row h2{margin:0;font-family:Georgia,"Noto Serif TC",serif;font-size:19px;font-weight:600}.count-badge{display:grid;place-items:center;width:27px;height:27px;border-radius:9px;background:#f0dfd6;color:#9c4938;font-weight:800;font-size:11px}.action-row{width:100%;display:grid;grid-template-columns:37px 1fr 15px;align-items:center;gap:11px;border:0;border-top:1px solid #eceae3;background:transparent;padding:13px 0;text-align:left}.action-row:hover strong{color:var(--green)}.action-icon{width:35px;height:35px;border-radius:11px;display:grid;place-items:center}.action-icon svg{width:17px}.action-icon.coral{background:#f5ddd7;color:#9f4d3f}.action-icon.gold{background:#f5eacb;color:#886722}.action-icon.mint{background:#dcece4;color:#37725f}.action-row strong,.action-row small{display:block}.action-row strong{font-size:11px;margin-bottom:3px}.action-row small{font-size:9px;color:var(--muted)}.row-arrow{width:14px;color:#89958f}
.insights-section,.plans-preview{margin-top:35px}.section-title-row{display:flex;align-items:end;justify-content:space-between;margin-bottom:15px}.text-button{display:flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--green);font-size:11px;font-weight:700}.text-button svg{width:14px}.insight-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:22px}.category-card{display:grid;grid-template-columns:185px 1fr;align-items:center;padding:24px}.donut{width:156px;height:156px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#337d68 0 32%,#e2a847 32% 57%,#c86b5b 57% 77%,#78a7a1 77% 90%,#c9c4b7 90%);position:relative}.donut:after{content:"";position:absolute;inset:22px;border-radius:50%;background:var(--surface)}.donut div{position:relative;z-index:1;text-align:center}.donut strong,.donut small{display:block}.donut strong{font-family:Georgia,serif;font-size:20px}.donut small{font-size:9px;color:var(--muted);margin-top:4px}.legend{display:grid;gap:10px}.legend div{display:grid;grid-template-columns:8px 1fr 65px 28px;gap:8px;align-items:center;font-size:10px}.legend i{width:7px;height:7px;border-radius:50%}.legend .food{background:#337d68}.legend .daily{background:#e2a847}.legend .travel{background:#c86b5b}.legend .transport{background:#78a7a1}.legend .other{background:#c9c4b7}.legend strong{text-align:right}.legend em{font-style:normal;color:var(--muted);text-align:right}.trend-card{padding:25px;display:flex;flex-direction:column}.trend-copy span,.trend-copy strong,.trend-copy p{display:block}.trend-copy span{font-size:10px;color:var(--muted)}.trend-copy strong{font-size:17px;margin:7px 0}.trend-copy b{color:var(--green)}.trend-copy p{font-size:10px;color:var(--muted);margin:0}.bars{flex:1;min-height:120px;display:flex;gap:12px;align-items:end;padding-top:15px;border-bottom:1px solid var(--line)}.bars div{height:100px;flex:1;display:flex;flex-direction:column;justify-content:end;align-items:center;gap:6px}.bars i{display:block;width:70%;max-width:25px;background:#d3d8d2;border-radius:6px 6px 0 0;transition:height .4s}.bars .current i{background:var(--green)}.bars small{font-size:8px;color:var(--muted);margin-bottom:-17px}
.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.plan-card{min-height:178px;border-radius:20px;padding:20px;color:white;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 12px 24px rgba(39,58,51,.08)}.plan-card.sea{background:#327766}.plan-card.sunshine{background:#b98132}.plan-card.plum{background:#7d5c68}.plan-top span,.plan-top strong,.plan-top small{display:block}.plan-top span{font-size:8px;text-transform:uppercase;letter-spacing:.12em;opacity:.7}.plan-top strong{font-family:Georgia,"Noto Serif TC",serif;font-size:17px;margin:6px 0}.plan-top small{font-size:9px;opacity:.75}.plan-bottom>div:first-child{display:flex;align-items:baseline}.plan-bottom strong{font-size:15px}.plan-bottom span{font-size:9px;opacity:.7;margin-left:3px}.mini-track{height:4px;margin:8px 0;background:rgba(255,255,255,.25);border-radius:10px}.mini-track i{display:block;height:100%;background:white;border-radius:10px}.plan-bottom small{font-size:8px;opacity:.75}
.recent-section{margin-top:35px;padding:23px 25px}.round-add,.primary-button{display:flex;align-items:center;gap:6px;border:0;border-radius:12px;background:var(--green);color:#fff;font-size:11px;font-weight:700;padding:10px 14px}.round-add svg,.primary-button svg{width:15px}.transaction-list{border-top:1px solid var(--line)}.transaction-row{display:grid;grid-template-columns:42px minmax(100px,1fr) 100px 90px 90px;gap:12px;align-items:center;min-height:63px;border-bottom:1px solid #ebe9e2}.txn-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;font-weight:800;font-size:11px}.txn-icon.food{background:#dcebe4;color:#326b5b}.txn-icon.shop{background:#f3e7c7;color:#866623}.txn-icon.travel{background:#f0ddd8;color:#9b5142}.txn-icon.save{background:#e6dfe4;color:#755767}.txn-main strong,.txn-main small{display:block}.txn-main strong{font-size:11px}.txn-main small{font-size:9px;color:var(--muted);margin-top:3px}.txn-payment,.txn-date{font-size:9px;color:var(--muted)}.txn-amount{text-align:right;font-size:12px;font-weight:800}.txn-amount.income{color:var(--green)}
.subpage-head{display:flex;justify-content:space-between;align-items:end;margin:35px 0 23px}.subpage-head h2{font-family:Georgia,"Noto Serif TC",serif;font-size:32px;margin:0}.subpage-head p{color:var(--muted);font-size:12px;margin:7px 0 0}.filter-bar{display:flex;gap:9px;margin-bottom:16px}.filter-bar label{flex:1;max-width:420px;height:42px;display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:0 13px}.filter-bar label svg{width:16px;color:var(--muted)}.filter-bar input{border:0;outline:0;background:transparent;width:100%;font-size:11px}.filter-chip{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:0 15px;font-size:10px}.filter-chip.active{background:var(--ink);border-color:var(--ink);color:white}.full-list{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:4px 20px}.placeholder-page .plan-grid{margin-top:10px}.credit-grid,.settings-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.credit-card,.setting-panel{min-height:190px;padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--surface)}.credit-card{display:flex;flex-direction:column}.credit-card.urgent{border-top:4px solid var(--coral)}.credit-card.good{border-top:4px solid var(--green)}.credit-card .bank{font-size:10px;color:var(--muted)}.credit-card h3{font-family:Georgia,serif;font-size:20px;margin:6px 0 auto}.credit-card .due{font-size:10px;color:var(--muted)}.credit-card .due b{color:var(--coral)}.credit-card strong.amount{font-size:23px;margin:7px 0}.credit-card footer{display:flex;justify-content:space-between;font-size:9px;color:var(--muted);padding-top:10px;border-top:1px solid var(--line)}.setting-panel h3{margin:0 0 16px;font-family:Georgia,serif}.setting-row{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid var(--line);font-size:10px}.setting-row span{color:var(--muted)}
.ai-layout{min-height:calc(100vh - 150px);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;max-width:710px;margin:0 auto}.ai-orb{display:grid;place-items:center;width:62px;height:62px;margin:0 auto 24px;border-radius:21px;background:#dbece4;color:var(--green);box-shadow:0 12px 35px rgba(31,112,93,.13)}.ai-orb svg{width:28px}.ai-intro h2{font-family:Georgia,"Noto Serif TC",serif;font-size:36px;line-height:1.3;margin:10px 0}.ai-intro p{color:var(--muted);font-size:12px}.suggestions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:25px 0}.suggestions button{border:1px solid var(--line);background:var(--surface);border-radius:30px;padding:10px 14px;font-size:10px}.suggestions button:hover{border-color:var(--green);color:var(--green)}.ai-compose{width:100%;display:flex;padding:6px 6px 6px 17px;border:1px solid var(--line);background:var(--surface);border-radius:16px;box-shadow:var(--shadow)}.ai-compose input{flex:1;border:0;outline:0;background:transparent;font-size:12px}
.mobile-nav{display:none}.toast{position:fixed;right:30px;bottom:30px;z-index:80;display:flex;align-items:center;gap:12px;min-width:270px;padding:14px 17px;border-radius:15px;background:#183c33;color:white;box-shadow:0 18px 55px rgba(17,45,38,.25);opacity:0;transform:translateY(18px);pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:none}.toast-check{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#73b299}.toast strong,.toast small{display:block}.toast strong{font-size:11px}.toast small{font-size:9px;color:#b7d0c7;margin-top:3px}
:focus-visible{outline:3px solid rgba(31,112,93,.35);outline-offset:2px}
@media(max-width:1050px){.sidebar{width:205px}.content{margin-left:205px;padding-left:25px;padding-right:25px}.dashboard-grid{grid-template-columns:1fr}.insight-grid{grid-template-columns:1fr}.plan-grid{grid-template-columns:1fr 1fr}.quick-entry{grid-template-columns:45px 1fr}.quick-entry form{grid-column:1/-1}.quick-result{left:22px}}
@media(max-width:720px){body{background:#f7f4ed}.sidebar{display:none}.content{margin:0;padding:20px 16px 105px}.topbar{height:48px;margin-bottom:20px}.topbar h1{font-size:20px}.eyebrow{font-size:9px}.period-select,.avatar{display:none}.top-actions{gap:7px}.quick-entry{padding:16px;grid-template-columns:40px 1fr;gap:10px;border-radius:18px}.quick-entry-icon{width:38px;height:38px}.quick-entry form{grid-column:1/-1}.dashboard-grid{margin-top:15px;gap:15px}.hero-card{padding:22px 19px}.hero-number{font-size:36px}.budget-scale span:nth-child(2){display:none}.pace-note{align-items:flex-start}.pace-note button{white-space:nowrap}.action-card{padding:18px}.insights-section,.plans-preview{margin-top:28px}.insight-grid{gap:15px}.category-card{grid-template-columns:125px 1fr;padding:19px}.donut{width:112px;height:112px}.donut:after{inset:17px}.donut strong{font-size:16px}.legend div{grid-template-columns:7px 1fr 55px}.legend em{display:none}.trend-card{min-height:245px}.plan-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 1px 8px}.plan-card{flex:0 0 82%;scroll-snap-align:start}.recent-section{margin-top:25px;padding:18px 16px}.transaction-row{grid-template-columns:39px 1fr 75px}.txn-payment,.txn-date{display:none}.subpage-head{margin:15px 0 20px;align-items:start}.subpage-head h2{font-size:27px}.subpage-head p{max-width:230px}.primary-button{font-size:0;padding:11px}.primary-button svg{width:18px}.filter-bar{overflow-x:auto}.filter-bar label{min-width:220px}.filter-chip{min-height:40px}.credit-grid,.settings-grid{grid-template-columns:1fr}.ai-layout{min-height:calc(100vh - 160px)}.ai-intro h2{font-size:28px}.suggestions{flex-direction:column}.mobile-nav{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);inset:auto 0 0 0;height:79px;padding:8px 12px max(8px,env(safe-area-inset-bottom));background:rgba(255,253,248,.94);backdrop-filter:blur(16px);border-top:1px solid var(--line);z-index:60}.mobile-nav button{border:0;background:transparent;color:#7a8983;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:9px}.mobile-nav button.active{color:var(--green);font-weight:800}.mobile-nav svg{width:19px}.mobile-nav .mobile-add{position:relative;top:-20px;width:54px;height:54px;justify-self:center;border-radius:18px;background:var(--green);color:#fff;box-shadow:0 8px 22px rgba(31,112,93,.3)}.mobile-nav .mobile-add span{position:absolute;top:58px;color:var(--green)}.toast{left:16px;right:16px;bottom:95px;min-width:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Color study: three complete palettes using the same information architecture. */
:root{--sidebar-tone:#143a4b;--sidebar-muted:#abc4ce;--nav-active:#e0eff3;--nav-active-ink:#143a4b;--plan-a:#287b91;--plan-b:#c48645;--plan-c:#6e668f}
[data-theme="coastal"]{--ink:#18364a;--ink-2:#38556a;--muted:#708493;--paper:#f2f6f8;--surface:#fcfeff;--line:#d8e1e6;--green:#236d89;--green-soft:#d9edf3;--coral:#d46d5a;--gold:#d5a248}
[data-theme="apricot"]{--ink:#482f2a;--ink-2:#664740;--muted:#89736d;--paper:#fbf4ed;--surface:#fffaf5;--line:#eadbd0;--green:#b95840;--green-soft:#f6ddd2;--coral:#d66b55;--gold:#d69745;--sidebar-tone:#5b3330;--sidebar-muted:#d9b8ad;--nav-active:#f7dfcd;--nav-active-ink:#5b3330;--plan-a:#b8624c;--plan-b:#c18c46;--plan-c:#81636e}
[data-theme="violet"]{--ink:#2f2b49;--ink-2:#4a4566;--muted:#77718b;--paper:#f4f2f8;--surface:#fdfcff;--line:#ded9e9;--green:#6457a6;--green-soft:#e5e0f5;--coral:#bd6877;--gold:#ba8a46;--sidebar-tone:#28243f;--sidebar-muted:#bbb4d4;--nav-active:#e8e2f7;--nav-active-ink:#332b5d;--plan-a:#5e76a7;--plan-b:#a06d82;--plan-c:#68589e}
.sidebar{background:var(--sidebar-tone);transition:background .25s}.brand small,.nav-item,.sync-state{color:var(--sidebar-muted)}.nav-item.active{background:var(--nav-active);color:var(--nav-active-ink)}.plan-card.sea{background:var(--plan-a)}.plan-card.sunshine{background:var(--plan-b)}.plan-card.plum{background:var(--plan-c)}.period-select{background:var(--surface)}.avatar{background:var(--green-soft);color:var(--green)}.toast{background:var(--sidebar-tone)}
.theme-switcher{display:flex;gap:5px;padding:6px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.theme-dot{width:20px;height:20px;border:2px solid var(--surface);border-radius:7px;box-shadow:0 0 0 1px transparent;transition:box-shadow .2s}.theme-dot.active{box-shadow:0 0 0 2px var(--ink)}.theme-dot.coastal{background:linear-gradient(135deg,#143a4b 50%,#d8edf2 50%)}.theme-dot.apricot{background:linear-gradient(135deg,#a9503d 50%,#f7ddcc 50%)}.theme-dot.violet{background:linear-gradient(135deg,#342d57 50%,#ded6f0 50%)}
.theme-dot{width:auto;height:26px;display:flex;align-items:center;gap:5px;padding:0 7px;border:0;border-radius:8px;background:transparent!important;box-shadow:none!important;font-size:9px;color:var(--muted)}.theme-dot:before{content:"";width:13px;height:13px;border-radius:4px}.theme-dot.coastal:before{background:linear-gradient(135deg,#143a4b 50%,#d8edf2 50%)}.theme-dot.apricot:before{background:linear-gradient(135deg,#a9503d 50%,#f7ddcc 50%)}.theme-dot.violet:before{background:linear-gradient(135deg,#342d57 50%,#ded6f0 50%)}.theme-dot.active{background:var(--green-soft)!important;color:var(--green);font-weight:800}
.icon-button.active{border-color:var(--green);background:var(--green-soft);color:var(--green)}
.entry-overlay,.entry-sheet{display:none}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.vault-section{margin-top:28px;padding:24px;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:0 10px 36px rgba(49,65,58,.05)}.vault-summary{display:grid;grid-template-columns:48px 1fr auto;gap:14px;align-items:center;padding-bottom:22px;border-bottom:1px solid var(--line)}.vault-mark{display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:var(--green-soft);color:var(--green)}.vault-summary h3{margin:2px 0 5px;font-family:Georgia,"Noto Serif TC",serif;font-size:21px}.vault-summary p{margin:0;color:var(--muted);font-size:10px}.vault-balance{text-align:right}.vault-balance small,.vault-balance strong,.vault-balance span{display:block}.vault-balance small,.vault-balance span{color:var(--muted);font-size:9px}.vault-balance strong{margin:4px 0;font-family:Georgia,serif;font-size:28px}.vault-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-top:22px}.settlement-preview>strong{display:block;margin:7px 0 14px;font-size:15px}.settlement-preview b,.positive{color:var(--green)}.vault-track{height:6px;border-radius:8px;background:var(--line)}.vault-track i{display:block;height:100%;border-radius:inherit;background:var(--green)}.settlement-preview p{color:var(--muted);font-size:9px}.settlement-preview button{display:flex;align-items:center;gap:4px;padding:0;border:0;background:transparent;color:var(--green);font-size:10px;font-weight:800}.settlement-preview button svg{width:13px}.settlement-history>div{display:flex;justify-content:space-between;padding:11px 0;border-top:1px solid var(--line);font-size:10px}.settlement-history>div:first-of-type{margin-top:7px}.settlement-history strong:not(.positive){color:var(--coral)}

@media(max-width:720px){
  body{background:var(--paper)}.theme-switcher{padding:4px}.theme-dot{width:22px;height:22px;padding:0;justify-content:center}.theme-dot span{display:none}.quick-entry{display:none}.dashboard-grid{margin-top:0}.mobile-nav{background:color-mix(in srgb,var(--surface) 94%,transparent)}.mobile-nav button{color:var(--muted)}.settings-grid{grid-template-columns:1fr}.vault-summary{grid-template-columns:42px 1fr}.vault-balance{grid-column:1/-1;text-align:left;padding-top:12px}.vault-detail-grid{grid-template-columns:1fr;gap:20px}
  .entry-overlay{display:block;position:fixed;inset:0;background:rgba(18,25,31,.38);backdrop-filter:blur(3px);z-index:69;opacity:0;pointer-events:none;transition:opacity .25s}.entry-overlay.open{opacity:1;pointer-events:auto}
  .entry-sheet{display:block;position:fixed;left:0;right:0;bottom:0;z-index:70;padding:9px 20px max(28px,env(safe-area-inset-bottom));border-radius:26px 26px 0 0;background:var(--surface);box-shadow:0 -18px 60px rgba(22,31,37,.18);transform:translateY(105%);transition:transform .32s cubic-bezier(.22,.8,.25,1)}.entry-sheet.open{transform:none}
  .sheet-handle{width:38px;height:4px;margin:0 auto 18px;border-radius:5px;background:var(--line)}.entry-sheet header{display:flex;justify-content:space-between;align-items:start}.entry-sheet h2{font-family:Georgia,"Noto Serif TC",serif;font-size:27px;margin:0}.entry-sheet>p{color:var(--muted);font-size:11px;line-height:1.7;margin:8px 0 20px}.sheet-close{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:12px;background:transparent}.sheet-close svg{width:19px}.entry-sheet label{display:block;font-size:10px;font-weight:700;margin-bottom:7px}.sheet-input-row{display:flex;gap:8px}.sheet-input-row input{min-width:0;flex:1;height:48px;padding:0 13px;border:1px solid var(--line);border-radius:13px;background:var(--paper);outline:0;font-size:11px}.sheet-input-row input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft)}.sheet-input-row button{display:flex;align-items:center;gap:5px;padding:0 14px;border:0;border-radius:13px;background:var(--green);color:#fff;font-size:10px;font-weight:800;white-space:nowrap}.sheet-input-row button svg{width:14px}.entry-examples{display:flex;gap:7px;overflow-x:auto;margin-top:15px;padding-bottom:3px}.entry-examples span{font-size:9px;color:var(--muted);white-space:nowrap;padding:8px 1px}.entry-examples button{border:1px solid var(--line);border-radius:20px;background:transparent;padding:7px 10px;font-size:9px;white-space:nowrap}.toast.sheet-open{bottom:340px}
}

/* ── 桌機側欄停用（只做手機版） ── */
.sidebar{display:none!important}
.content{margin-left:0!important}

/* ── 深色模式：照 coastal 色相推導，原型沒有這一組 ── */
@media(prefers-color-scheme:dark){
  :root{
    --ink:#e8f0f4;--ink-2:#c2d3dc;--muted:#93a8b4;
    --paper:#12222b;--surface:#1b2f3a;--line:#2c4553;
    --green:#63b6d3;--green-soft:#1d3d4c;
    --coral:#e8887a;--gold:#e3b667;
    --shadow:0 18px 60px rgba(0,0,0,.45);
    --sidebar-tone:#0d1b23;--sidebar-muted:#8fa6b2;
    --nav-active:#1d3d4c;--nav-active-ink:#cfe6ef;
    --plan-a:#2b6076;--plan-b:#8a6633;--plan-c:#544d70;
  }
  [data-theme="coastal"]{--ink:#e8f0f4;--ink-2:#c2d3dc;--muted:#93a8b4;--paper:#12222b;--surface:#1b2f3a;--line:#2c4553;--green:#63b6d3;--green-soft:#1d3d4c;--coral:#e8887a;--gold:#e3b667}
  [data-theme="apricot"]{--ink:#f4e9e3;--ink-2:#dcc4b9;--muted:#a89189;--paper:#241a17;--surface:#332521;--line:#4a3630;--green:#d9836b;--green-soft:#432a23;--coral:#e08a74;--gold:#d9a45f}
  [data-theme="violet"]{--ink:#eae6f5;--ink-2:#c8c1de;--muted:#948db0;--paper:#1a1727;--surface:#262137;--line:#39324f;--green:#9b8fd8;--green-soft:#2f2848;--coral:#cf8593;--gold:#c9a05f}
  .hero-card,.action-card,.category-card,.trend-card,.recent-section{box-shadow:0 10px 36px rgba(0,0,0,.3)}
  .donut:after{background:var(--surface)}
  .bars i{background:#33505f}
  .filter-chip.active{background:var(--green);border-color:var(--green);color:#0f1f27}
}

/* ── 期間選擇器：原型手機版把它藏了（原型沒有換月需求），正式版必須留 ── */
@media(max-width:720px){
  .period-bar{display:flex;justify-content:center;padding:0 0 18px}
  .period-bar .period-select{display:flex}
}
.period-select select{border:0;background:transparent;font-size:13px;font-weight:600;outline:none;color:var(--ink)}

/* ── 明細頁的三段切換（交易明細／信用卡／固定支出，2026-09-10 併入） ──
   原型的明細頁沒有分段，這組樣式沿用它的 .filter-chip 語言，讓新元件
   看起來像本來就在那份設計裡。 */
.seg-bar{display:flex;gap:8px;margin-bottom:16px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.seg-chip{flex:0 0 auto;min-height:38px;padding:0 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--muted);font-size:11px;font-weight:700}
.seg-chip.active{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.detail-pane{display:none}
.detail-pane.active{display:block;animation:pageIn .24s ease}
.pane-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.pane-head h3{margin:0;font-family:Georgia,"Noto Serif TC",serif;font-size:17px;font-weight:600}
.filter-bar .filter-chip{min-height:42px}

/* ── 計畫頁補充：原型的 vault-section 沒有設定入口與負數狀態 ── */
.vault-summary{position:relative}
.vault-edit{border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--muted);padding:7px 11px;font-size:11px;font-weight:600}
.vault-edit:active{background:var(--green-soft)}
.is-negative,.settlement-preview b.is-negative{color:var(--coral)}
.vault-balance strong.is-negative{color:var(--coral)}
.plan-card[role="button"]{cursor:pointer;transition:transform .12s ease}
.plan-card[role="button"]:active{transform:scale(.985)}
.plan-grid.expanded{display:grid;grid-template-columns:1fr;gap:14px;overflow:visible}
@media(max-width:720px){.plan-grid.expanded{display:grid}.plan-grid.expanded .plan-card{flex:none}}
.settlement-history>div:first-of-type{margin-top:7px}
.vault-edit{position:absolute;top:0;right:0}
.vault-summary{padding-right:64px}
@media(max-width:720px){.vault-summary{padding-right:60px}}

/* ── 設定頁：原型的 setting-panel 只有唯讀列，這裡要容納既有的輸入元件 ── */
.settings-grid{display:grid;grid-template-columns:1fr;gap:16px}
.setting-panel .settings-group-heading{margin-bottom:14px}
.setting-panel .settings-group-heading .section-title{margin:0;font-family:Georgia,"Noto Serif TC",serif;font-size:17px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink)}
.setting-panel .settings-group-heading p{margin:5px 0 0;font-size:10px;color:var(--muted)}
.setting-panel h3{margin:0 0 14px;font-family:Georgia,"Noto Serif TC",serif;font-size:17px;font-weight:600}
.setting-panel .setting-row strong{font-weight:700}
.settings-switch-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:11px 0;border-top:1px solid var(--line)}
.settings-switch-row:first-child{border-top:0}
.settings-switch-row>span:first-child strong{display:block;font-size:12px}
.settings-switch-row>span:first-child small{display:block;font-size:9px;color:var(--muted);margin-top:2px}
.settings-cat-del{width:28px;height:28px;border:1px solid var(--line);border-radius:9px;background:transparent;color:var(--muted);font-size:15px;line-height:1}
.settings-cat-del:active{background:var(--coral);border-color:var(--coral);color:#fff}
.settings-help{font-size:10px;color:var(--muted);margin:10px 0}
#conn-api-status,#conn-ai-status{font-variant-numeric:tabular-nums}
/* filter-bar 在 390px 寬時，chip 會被搜尋框壓成直排文字——原型沒設 flex-shrink */
.filter-bar{flex-wrap:nowrap}
.filter-bar .filter-chip{flex:0 0 auto;white-space:nowrap}
@media(max-width:720px){.filter-bar label{min-width:150px}}

/* ══════════════════════════════════════════════════════════════════
   2026-09-10 實機回報修正
   ══════════════════════════════════════════════════════════════════ */

/* (4)(6) 記帳面板改用 .rd-entry，不再吃到原型 .entry-sheet 的 z-index:70，
   否則 .budget-modal-overlay(300) 會蓋在面板上面：畫面只剩灰幕、點哪裡都關掉。 */
.rd-entry{z-index:301}
.rd-entry .budget-modal-title{font-family:Georgia,"Noto Serif TC",serif;font-size:24px}
.rd-entry .entry-examples{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}
.rd-entry .entry-examples button{white-space:nowrap}

/* (7) 期間選擇器整條的底色跟頁面背景不同色（--bg 來自舊 style.css，
   --paper 來自原型），切換配色時會露出一塊藍灰色。改成透明。 */
.period-bar{background:transparent}

/* (2) 底部導覽：safe-area 較大的機種上，固定 height 會把內容擠出去，
   看起來像疊層。改成 min-height + 自動高度。 */
.mobile-nav{height:auto;min-height:79px;align-items:center}
.mobile-nav .mobile-add{top:-18px}

/* (2)(3) AI 分頁的輸入列貼齊導覽上緣；中央記帳鈕在這一頁收起來，
   否則會跟輸入列疊在一起（AI 頁本來就有自己的輸入框）。 */
.ai-chat-dock{bottom:calc(71px + max(8px, env(safe-area-inset-bottom, 0px)))}
body.is-ai-tab .mobile-add{opacity:0;pointer-events:none}
body.is-ai-tab .mobile-add span{opacity:0}

/* ══════════════════════════════════════════════════════════════════
   記帳面板（.rd-entry）— 結構與視覺照 concept-prototype 的 .entry-sheet，
   但 z-index 走既有彈窗那一套（300/301），不用原型的 69/70，
   否則會被 .budget-modal-overlay 蓋住。
   ══════════════════════════════════════════════════════════════════ */
.rd-overlay{position:fixed;inset:0;background:rgba(18,25,31,.38);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:300;opacity:0;pointer-events:none;transition:opacity .25s}
.rd-overlay.open{opacity:1;pointer-events:auto}
.rd-entry{position:fixed;left:0;right:0;bottom:0;z-index:301;padding:9px 20px max(28px,env(safe-area-inset-bottom));border-radius:26px 26px 0 0;background:var(--surface);box-shadow:0 -18px 60px rgba(22,31,37,.18);transform:translateY(105%);transition:transform .32s cubic-bezier(.22,.8,.25,1);max-height:92vh;overflow-y:auto;overscroll-behavior:contain}
.rd-entry.open{transform:none}
.rd-entry .sheet-handle{width:38px;height:4px;margin:0 auto 18px;border-radius:5px;background:var(--line)}
.rd-entry header{display:flex;justify-content:space-between;align-items:start}
.rd-entry h2{font-family:Georgia,"Noto Serif TC",serif;font-size:27px;font-weight:600;margin:0}
.rd-entry>p{color:var(--muted);font-size:11px;line-height:1.7;margin:8px 0 20px}
.rd-entry .sheet-close{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink-2)}
.rd-entry .sheet-close svg{width:19px}
.rd-entry label{display:block;font-size:10px;font-weight:700;letter-spacing:.1em;margin-bottom:7px;color:var(--muted)}
.rd-entry .sheet-input-row{display:flex;gap:8px}
.rd-entry .sheet-input-row input{min-width:0;flex:1;height:48px;padding:0 13px;border:1px solid var(--line);border-radius:13px;background:var(--paper);color:var(--ink);outline:0;font-size:16px}
.rd-entry .sheet-input-row input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
.rd-entry .sheet-input-row button{display:flex;align-items:center;gap:5px;padding:0 14px;border:0;border-radius:13px;background:var(--green);color:#fff;font-size:11px;font-weight:800;white-space:nowrap}
.rd-entry .sheet-input-row button svg{width:14px}
.rd-entry .sheet-input-row button.is-busy{opacity:.6}
.rd-entry .sheet-input-row button.is-busy::after{content:"…"}
.rd-entry .entry-examples{display:flex;gap:7px;overflow-x:auto;margin-top:15px;padding-bottom:3px}
.rd-entry .entry-examples>span{font-size:9px;color:var(--muted);white-space:nowrap;padding:8px 1px;letter-spacing:.1em}
.rd-entry .entry-examples button{border:1px solid var(--line);border-radius:20px;background:transparent;color:var(--ink-2);padding:7px 10px;font-size:10px;white-space:nowrap}
.rd-entry .entry-result{min-height:16px;margin-top:12px;font-size:11px;font-weight:600;text-align:center}
.rd-entry .entry-result-ok{color:var(--green)}
.rd-entry .entry-result-error{color:var(--coral)}

/* 底部導覽改實色底：半透明＋backdrop-filter 會讓捲到底的卡片邊緣透出來，
   看起來像多了一層色塊（2026-09-10 Jingyang 回報）。 */
.mobile-nav{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}

/* ══════════════════════════════════════════════════════════════════
   統一層：把 style.css 留下來的舊元件拉到 docs/DESIGN_LANGUAGE.md 的規範。
   這些元件的 DOM 還是舊結構，這裡只統一顏色、圓角、字型與尺度。
   ══════════════════════════════════════════════════════════════════ */

/* 其餘彈窗（月預算／玩樂／存錢罐／群組／信用卡／固定開銷／編輯明細）
   比照記帳面板：圓角 26、surface 底、同一組陰影與 handle。 */
.budget-modal,.gm-modal,.cc-modal,.tm-modal,.fx-modal{
  background:var(--surface);
  border-radius:26px 26px 0 0;
  box-shadow:0 -18px 60px rgba(22,31,37,.18);
}
.budget-modal-handle,.gm-handle,.cc-handle,.tm-handle,.fx-handle{background:var(--line)}
.budget-modal-title,.gm-title,.cc-title,.tm-title,.fx-title{
  font-family:Georgia,"Noto Serif TC",serif;font-size:24px;font-weight:600;color:var(--ink);
}
.budget-modal-sub{color:var(--muted);font-size:11px}

/* 表單元件 */
.gm-input,.budget-modal-input{
  border:1px solid var(--line);border-radius:13px;background:var(--paper);color:var(--ink);
  font-family:inherit;font-size:16px;  /* 16px 以下 iOS 會自動放大頁面 */
}
.gm-input:focus,.budget-modal-input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft);outline:0}
.gm-btn{border-radius:13px;font-weight:700;font-size:12px}
.gm-btn-save,.budget-modal-save{background:var(--green);color:#fff;border:0}
.gm-btn-cancel{background:transparent;color:var(--ink-2);border:1px solid var(--line)}
.gm-add-btn,.settings-icon-toggle{border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink-2)}
.gm-label{color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.1em}

/* 明細列、信用卡卡片、固定開銷卡片 */
.trans-item,.cc-card,.fx-card{background:var(--surface);border:1px solid var(--line);border-radius:18px}
.trans-note{color:var(--ink);font-size:12px;font-weight:700}
.trans-meta{color:var(--muted);font-size:10px}
.trans-item-delete-bg{background:var(--coral);border-radius:18px}

/* AI 對話 */
.ai-chat-dock{background:var(--surface);border-top:1px solid var(--line);backdrop-filter:none;-webkit-backdrop-filter:none}
.ai-chat-input{font-family:inherit;font-size:16px;color:var(--ink)}
.ai-chat-send-btn{background:var(--green);color:#fff;border-radius:12px}
.ai-suggest-chip,.ai-model-chip{border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink-2);font-size:11px}
.ai-msg-user .ai-msg-bubble{background:var(--green);color:#fff}
.ai-msg-ai .ai-msg-bubble{background:var(--surface);border:1px solid var(--line);color:var(--ink)}

/* 設定頁的 disclosure */
.settings-disclosure{border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.settings-disclosure summary strong{font-size:12px;color:var(--ink)}
.settings-disclosure summary small{font-size:10px;color:var(--muted)}
.settings-panel{background:transparent;border:0;padding:0}

/* ══════════════════════════════════════════════════════════════════
   2026-09-10 第二輪回報
   ══════════════════════════════════════════════════════════════════ */

/* 底部導覽的色差：上一版把底色改成 --surface（#fcfeff），但頁面底是
   --paper（#f2f6f8），等於在頁尾多出一塊更白的區域。改成與頁面同色，
   只靠上邊框分隔。導覽同時加高。 */
.mobile-nav{
  background:var(--paper);
  border-top:1px solid var(--line);
  min-height:88px;
  padding-top:10px;
}
.mobile-nav .mobile-add{top:-20px}
.content{padding-bottom:116px}

/* 期間入口：外觀維持 topbar 那行小字，只是變成可點 */
.period-trigger{
  display:inline-flex;align-items:center;gap:5px;
  padding:0;border:0;background:transparent;
  color:var(--muted);font-family:inherit;cursor:pointer;
}
.period-trigger::after{
  content:"";width:5px;height:5px;margin-left:1px;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-1px);
}
.period-trigger:active{opacity:.6}
.period-trigger.is-hidden{visibility:hidden}

/* 期間選擇面板 */
.rd-period .period-years{display:flex;gap:8px;overflow-x:auto;margin-bottom:16px;padding-bottom:4px}
.rd-period .period-years .filter-chip{flex:0 0 auto;min-height:38px}
.rd-period .period-months{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding-bottom:8px}
.period-month{
  min-height:46px;border:1px solid var(--line);border-radius:13px;
  background:var(--surface);color:var(--ink-2);
  font-family:inherit;font-size:12px;font-weight:600;
}
.period-month.active{background:var(--green);border-color:var(--green);color:#fff;font-weight:800}

/* ══════════════════════════════════════════════════════════════════
   無障礙與觸控修正（2026-09-10，依 ui-ux-pro-max 檢查清單實測後修）
   ══════════════════════════════════════════════════════════════════ */

/* 1. --muted 在 surface 上只有 3.84:1，低於 4.5:1 的最低要求。
      三組配色一起調深，色相不變，視覺差異極小。 */
:root{--muted:#5b6f7e}
[data-theme="coastal"]{--muted:#5b6f7e}
[data-theme="apricot"]{--muted:#75605a}
[data-theme="violet"]{--muted:#635d76}

/* 2. 計畫卡上的白字用 opacity .7～.75，對比掉到 3.07:1。提高不透明度。 */
.plan-top span,.plan-top small,.plan-bottom span,.plan-bottom small{opacity:.88}

/* 3. 觸控目標：視覺尺寸維持原設計，用偽元素把熱區補到 44px，
      不靠加大 padding 去撐版面。 */
.text-button,.period-trigger,.theme-dot,.pace-note button,
.settlement-preview button,.quiet-button,.vault-edit{position:relative}
.text-button::before,.period-trigger::before,.theme-dot::before,
.pace-note button::before,.settlement-preview button::before{
  content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:max(100%,44px);height:44px;
}
/* theme-dot 的 ::before 已被配色樣本用掉，改用 ::after 補熱區 */
.theme-dot::before{width:13px;height:13px;position:static;transform:none}
.theme-dot::after{content:"";position:absolute;inset:-11px}
.icon-button{width:44px;height:44px}
.sheet-close{width:44px;height:44px}

/* 4. 明細搜尋框 11px：iOS 會因此自動放大整頁（設計語言硬規則之一） */
.filter-bar input,.filter-bar label input{font-size:16px}

/* 5. 彈窗裡的按鈕不在 .app-shell 底下，吃不到原型那條 cursor 規則 */
.rd-entry button,.budget-modal button,.rd-overlay,
.gm-modal button,.cc-modal button,.tm-modal button,.fx-modal button{cursor:pointer}

/* 6. 鍵盤焦點：原型只給了主色外框，深色模式下看不清楚 */
.app-shell :focus-visible,.rd-entry :focus-visible,.budget-modal :focus-visible{
  outline:3px solid var(--green);outline-offset:2px;border-radius:6px;
}

/* 續：對比與觸控的第二輪 */

/* 年度玩樂卡的暖黃底配白字只有 2.9:1，把底色壓深到白字可讀 */
:root{--plan-b:#97682f}
[data-theme="apricot"]{--plan-b:#9c6f33}
[data-theme="violet"]{--plan-b:#87683a}

/* 負向數字用比 --coral 更深一階的字色（--coral 本身要留給圖示底與邊框） */
:root{--coral-text:#a8412c}
[data-theme="apricot"]{--coral-text:#a8412c}
[data-theme="violet"]{--coral-text:#96374a}
@media(prefers-color-scheme:dark){:root{--coral-text:#f0a094}}
.is-negative,.vault-balance strong.is-negative,.settlement-preview b.is-negative,
.settlement-history strong:not(.positive){color:var(--coral-text)}

/* 舊 style.css 的 --sub 沒跟著 --muted 一起調，載入中文字仍是 3.84:1 */
:root{--sub:#5b6f7e}
@media(prefers-color-scheme:dark){:root{--sub:#93a8b4}}

/* 分段與篩選 chip 補到 44px 觸控高度 */
.seg-chip,.filter-chip,.quiet-button{min-height:44px}
.filter-bar label{min-height:44px}
.filter-bar input{height:42px}

/* 觸控尺寸收尾：全部補到 44px */
.rd-entry .sheet-close{width:44px;height:44px}
.primary-button,.round-add{min-height:44px}
.settings-icon-toggle{width:44px;height:44px}
.settings-inline-form .gm-input{min-height:44px}
/* 底部導覽的每一格都要能點滿整個高度，不是只有圖示那 37px */
.mobile-nav button{min-height:100%;align-self:stretch}
.mobile-nav .mobile-add{min-height:54px;align-self:auto}