/* Apple-inspired V2 preview. Scoped to the preview copy; source site styles remain intact. */
:root.v2-preview[data-theme] {
  color-scheme: light;
  --bg:#f4f6f9; --surface:#ffffff; --surface-subtle:#f8fafc; --surface-hover:#f2f6fb;
  --panel:var(--surface); --panel-2:var(--surface); --panel-3:var(--surface-subtle);
  --border:#e3e9ef; --text:#1b2028; --muted:#56677b; --faint:#6d7d90;
  --green:#14875f; --green-soft:rgba(20,135,95,.10); --orange:#df8d46;
  --orange-soft:rgba(223,141,70,.12); --red:#d95062; --blue:#0878f9;
  --accent-soft:#eaf3ff; --accent-border:#dbe8f8; --focus-ring:rgba(8,120,249,.28);
  --dividend-color:#d44878; --success-surface:#f0faf6;
  --shadow:0 5px 18px rgba(25,48,77,.055); --bg-glow:transparent; --sidebar:#fff;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang TC","Noto Sans TC",sans-serif;
  color:var(--text); background:var(--bg);
}
:root.v2-preview[data-theme] body{min-width:320px;background:var(--bg);color:var(--text)}
:root.v2-preview[data-theme] .app-shell{min-height:100vh}
:root.v2-preview[data-theme] .sidebar{position:sticky;top:0;width:196px;height:100vh;flex:0 0 196px;padding:24px 15px 20px;background:#fff;border-right:1px solid var(--border)}
:root.v2-preview[data-theme] .brand{justify-content:flex-start;padding:0 7px}
:root.v2-preview[data-theme] .brand-mark{width:44px;height:44px;border-radius:15px;color:#fff;background:var(--blue);transform:none;box-shadow:0 5px 12px rgba(8,120,249,.18)}
:root.v2-preview[data-theme] .brand > div:not(.brand-mark){display:block}
:root.v2-preview[data-theme] .demo-pill{display:none}
:root.v2-preview[data-theme] .main-nav{gap:5px;margin-top:27px}
:root.v2-preview[data-theme] .nav-item{position:relative;justify-content:flex-start;width:100%;height:44px;padding:9px 11px;gap:10px;border-radius:13px;color:var(--muted);font-size:12px;text-align:left}
:root.v2-preview[data-theme] .nav-item > span:first-child{width:20px;flex:0 0 20px;color:inherit;font-size:18px;text-align:center}
:root.v2-preview[data-theme] .nav-item:hover{color:var(--blue);background:#f3f7fc}
:root.v2-preview[data-theme] .nav-item.active{color:var(--blue);background:#eaf3ff}
:root.v2-preview[data-theme] .nav-item.active::before{content:"";position:absolute;left:-15px;width:3px;height:22px;border-radius:0 3px 3px 0;background:var(--blue)}
:root.v2-preview[data-theme] .sidebar-footer{padding:14px 0 0;border-color:var(--border)}
:root.v2-preview[data-theme] .mini-profile{justify-content:flex-start;margin:0;gap:9px}
:root.v2-preview[data-theme] .mini-profile > div:not(.avatar){display:block;min-width:0}
:root.v2-preview[data-theme] .avatar{width:38px;height:38px;color:var(--blue);background:#eaf3ff}
:root.v2-preview[data-theme] .main-content{width:calc(100% - 196px);max-width:none;padding:27px clamp(24px,3.1vw,46px) 50px}
:root.v2-preview[data-theme] .topbar{align-items:center;gap:18px;margin-bottom:25px}
:root.v2-preview[data-theme] .topbar .eyebrow{margin-bottom:3px;font-size:10px;letter-spacing:.03em;text-transform:none}
:root.v2-preview[data-theme] h1{font-size:30px;letter-spacing:-.035em;font-weight:740}
:root.v2-preview[data-theme] h1 span{display:none}
:root.v2-preview[data-theme] .topbar-actions{gap:7px;flex:0 1 auto}
:root.v2-preview[data-theme] .topbar-actions > button,#accountButton,.theme-select{min-height:40px;border:1px solid var(--border);border-radius:12px;padding:9px 12px;color:#354255;background:#fff;font-size:11px}
:root.v2-preview[data-theme] .topbar-actions .theme-select{appearance:none;-webkit-appearance:none;padding:9px 32px 9px 12px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='m3.5 5.25 3.5 3.5 3.5-3.5' stroke='%23586a80' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center;background-size:14px 14px}
:root.v2-preview[data-theme] .topbar-actions .theme-mode-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:82px;cursor:pointer}
:root.v2-preview[data-theme] .topbar-actions .theme-mode-toggle[aria-pressed="true"]{border-color:var(--accent-border);color:var(--blue);background:var(--accent-soft)}
:root.v2-preview[data-theme] .topbar-actions .primary-button{border-color:var(--blue);color:#fff;background:var(--blue);box-shadow:0 4px 10px rgba(8,120,249,.16)}
:root.v2-preview[data-theme] .topbar-actions .updated-label{font-size:9px;color:var(--muted)}
:root.v2-preview[data-theme] #accountButton{display:flex;align-items:center;padding:4px 9px}
:root.v2-preview[data-theme] #accountButton .avatar{width:30px;height:30px;margin:0 5px 0 0}
:root.v2-preview[data-theme] #accountButton .avatar-label{color:var(--muted);font-size:10px}
:root.v2-preview[data-theme] .account-menu{border-color:var(--border);background:#fff;box-shadow:0 16px 44px rgba(25,48,77,.16)}
:root.v2-preview[data-theme] .account-menu button:hover{background:#f3f7fc;color:var(--text)}
:root.v2-preview[data-theme] .demo-notice{border:1px solid #dbe8f8;border-radius:15px;padding:13px 16px;color:#53677d;background:#f1f7ff;box-shadow:none}
:root.v2-preview[data-theme] .demo-notice .notice-icon{color:var(--blue)}
:root.v2-preview[data-theme] .demo-notice #dismissNotice{color:#708198}
:root.v2-preview[data-theme] .trust-panel{margin:0 0 22px;padding:20px;border:1px solid var(--border);border-radius:18px;background:#fff;box-shadow:var(--shadow)}
:root.v2-preview[data-theme] .trust-panel-heading{align-items:center}
:root.v2-preview[data-theme] .trust-panel-heading .eyebrow{color:var(--blue);letter-spacing:.03em;text-transform:none}
:root.v2-preview[data-theme] .trust-panel-heading h2{font-size:18px;color:var(--text)}
:root.v2-preview[data-theme] .trust-panel-heading p{color:var(--muted)}
:root.v2-preview[data-theme] .trust-card{border-color:#edf1f5;border-radius:13px;background:#f9fbfd}
:root.v2-preview[data-theme] .trust-card-icon{color:var(--blue);background:#eaf3ff}
:root.v2-preview[data-theme] .trust-panel-links{color:var(--muted)}
:root.v2-preview[data-theme] .panel,:root.v2-preview[data-theme] .summary-card,:root.v2-preview[data-theme] .report-card{border:1px solid var(--border);border-radius:18px;background:#fff;box-shadow:var(--shadow)}
:root.v2-preview[data-theme] .panel{padding:21px}
:root.v2-preview[data-theme] .panel-heading{align-items:center;margin-bottom:17px}
:root.v2-preview[data-theme] .panel-heading h2{font-size:16px;letter-spacing:-.02em}
:root.v2-preview[data-theme] .panel-heading p{margin-top:5px;color:var(--muted);font-size:11px}
:root.v2-preview[data-theme] .summary-grid{gap:12px;margin-bottom:14px}
:root.v2-preview[data-theme] .summary-card{min-height:124px;padding:17px 19px}
:root.v2-preview[data-theme] .summary-card::after{display:none}
:root.v2-preview[data-theme] .card-label{color:var(--muted)}
:root.v2-preview[data-theme] .card-value{margin:12px 0 7px;font-size:24px}
:root.v2-preview[data-theme] .section-grid{gap:14px;margin-bottom:14px}
:root.v2-preview[data-theme] .asset-scope-bar{margin-bottom:14px;padding:12px 15px;border:1px solid var(--border);border-left:3px solid var(--blue);border-radius:14px;background:#fff}
:root.v2-preview[data-theme] .asset-scope-bar strong{color:var(--text)}
:root.v2-preview[data-theme] .asset-scope-bar span b{color:var(--blue)}
:root.v2-preview[data-theme] .asset-scope-bar .ghost-button{color:var(--blue)}
:root.v2-preview[data-theme] .view-header{align-items:center;margin-bottom:17px}
:root.v2-preview[data-theme] .view-header p{color:var(--muted);font-size:12px}
:root.v2-preview[data-theme] .view-header .filter-badge{border-color:var(--border);background:#f7f9fb}
:root.v2-preview[data-theme] .holdings-panel{padding-bottom:12px}
:root.v2-preview[data-theme] .holdings-table th,:root.v2-preview[data-theme] .holdings-table td,:root.v2-preview[data-theme] .transactions-table th,:root.v2-preview[data-theme] .transactions-table td{border-bottom-color:#edf1f5}
:root.v2-preview[data-theme] .holdings-table th,:root.v2-preview[data-theme] .transactions-table th{color:var(--muted)}
:root.v2-preview[data-theme] .asset-icon{color:var(--blue);background:#eaf3ff}
:root.v2-preview[data-theme] .select-small,:root.v2-preview[data-theme] .income-plan-row select,:root.v2-preview[data-theme] .income-plan-row input{color:var(--text);background:#fff}
:root.v2-preview[data-theme] .ghost-button,:root.v2-preview[data-theme] .select-small,:root.v2-preview[data-theme] .theme-select{border-color:var(--border);border-radius:11px;color:#405064;background:#fff}
:root.v2-preview[data-theme] .ghost-button:hover{border-color:#bad8fb;color:var(--blue);background:#f5f9ff}
:root.v2-preview[data-theme] .primary-button{border-radius:11px;color:#fff;background:var(--blue);box-shadow:0 5px 12px rgba(8,120,249,.16)}
:root.v2-preview[data-theme] .type-tag.buy,:root.v2-preview[data-theme] .type-tag.paid{color:var(--green);background:var(--green-soft)}
:root.v2-preview[data-theme] .type-tag.sell{color:var(--red);background:rgba(217,80,98,.1)}
:root.v2-preview[data-theme] .type-tag.announced{color:#b86b22;background:var(--orange-soft)}
:root.v2-preview[data-theme] .upcoming-dividend-card{border-color:#ccebe0;background:linear-gradient(135deg,#f0faf6,#fff 70%);box-shadow:none}
:root.v2-preview[data-theme] .month-card,:root.v2-preview[data-theme] .price-alert-card,:root.v2-preview[data-theme] .custom-etf-item{border-color:var(--border);background:#fff}
:root.v2-preview[data-theme] .dividend-rule-note,:root.v2-preview[data-theme] .income-goal-disclaimer,:root.v2-preview[data-theme] .income-goal-data-note{color:var(--muted)}
:root.v2-preview[data-theme] .push-instructions{border-color:#dce9f8;color:var(--muted);background:#f4f8fe}
:root.v2-preview[data-theme] .iphone-push-guide,:root.v2-preview[data-theme] .android-push-guide{border-color:#d7ece3;background:#f4faf7}
:root.v2-preview[data-theme] .push-preference-grid label{border-color:var(--border);color:var(--text);background:#fff}
:root.v2-preview[data-theme] .price-alert-notice{border-color:#d7ece3;color:var(--green);background:#f2faf6}
:root.v2-preview[data-theme] .income-plan-summary > div{border-color:var(--border);background:#f8fafc}
:root.v2-preview[data-theme] .modal,:root.v2-preview[data-theme] .account-dialog,:root.v2-preview[data-theme] .legal-dialog{border-color:var(--border);color:var(--text);background:#fff;box-shadow:0 22px 70px rgba(25,48,77,.18)}
:root.v2-preview[data-theme] .account-overlay,:root.v2-preview[data-theme] .modal-backdrop{background:rgba(18,32,48,.32);backdrop-filter:blur(8px)}
:root.v2-preview[data-theme] input,:root.v2-preview[data-theme] select,:root.v2-preview[data-theme] textarea{color:var(--text)}
:root.v2-preview[data-theme] .site-footer{border-color:var(--border);color:var(--faint)}
:root.v2-preview[data-theme] button:focus-visible,:root.v2-preview[data-theme] a:focus-visible,:root.v2-preview[data-theme] select:focus-visible,:root.v2-preview[data-theme] input:focus-visible{outline:3px solid rgba(8,120,249,.28);outline-offset:2px}
:root.v2-preview[data-theme] .guide-tour{border-color:var(--border);border-top-color:var(--blue);background:#fff;box-shadow:0 22px 70px rgba(25,48,77,.18)}
:root.v2-preview[data-theme] .guide-tour-target{outline-color:var(--blue);box-shadow:0 0 0 7px rgba(8,120,249,.1)}

@media(max-width:1100px){
  :root.v2-preview[data-theme] .sidebar{width:178px;flex-basis:178px;padding-right:12px;padding-left:12px}
  :root.v2-preview[data-theme] .main-content{width:calc(100% - 178px);padding-right:20px;padding-left:20px}
  :root.v2-preview[data-theme] .topbar-actions .updated-label{display:none}
}
@media(max-width:720px){
  :root.v2-preview[data-theme] .sidebar{position:fixed;z-index:5;left:-270px;width:250px;height:100vh;flex-basis:250px;padding:25px 16px 18px;transition:left .25s ease}
  :root.v2-preview[data-theme] .sidebar.open{left:0;box-shadow:20px 0 60px rgba(25,48,77,.18)}
  :root.v2-preview[data-theme] .brand{justify-content:flex-start;padding:0 10px}
  :root.v2-preview[data-theme] .brand > div:not(.brand-mark){display:block}
  :root.v2-preview[data-theme] .demo-pill{display:block}
  :root.v2-preview[data-theme] .main-nav{margin-top:0}
  :root.v2-preview[data-theme] .nav-item{width:auto;height:44px;justify-content:flex-start;padding:10px 12px;font-size:13px}
  :root.v2-preview[data-theme] .nav-item > span:first-child{width:20px;font-size:18px}
  :root.v2-preview[data-theme] .nav-item.active::before{display:none}
  :root.v2-preview[data-theme] .mini-profile{justify-content:flex-start}
  :root.v2-preview[data-theme] .mini-profile > div:not(.avatar){display:block}
  :root.v2-preview[data-theme] .main-content{width:100%;padding:20px 15px 46px}
  :root.v2-preview[data-theme] .topbar{grid-template-columns:36px minmax(0,1fr);gap:10px 8px;margin-bottom:18px}
  :root.v2-preview[data-theme] .topbar-actions{grid-column:1/-1;justify-content:flex-start}
  :root.v2-preview[data-theme] .topbar-actions > button,:root.v2-preview[data-theme] .topbar-actions > select{min-height:39px}
  :root.v2-preview[data-theme] .trust-panel{padding:15px}
  :root.v2-preview[data-theme] .panel{padding:16px}
}
@media(min-width:1200px){:root.v2-preview[data-theme] .trust-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}}
:root.v2-preview[data-theme] .dividend-history-chart,:root.v2-preview[data-theme] .dividend-chart-empty{background:#f6f8fb}
:root.v2-preview[data-theme] .income-goal-controls input,:root.v2-preview[data-theme] .income-plan-row select,:root.v2-preview[data-theme] .income-plan-row input,:root.v2-preview[data-theme] .batch-row input,:root.v2-preview[data-theme] .batch-row select,:root.v2-preview[data-theme] .dividend-actual-form input{color:var(--text);background:#fff}
:root.v2-preview[data-theme] .income-goal-summary > div,:root.v2-preview[data-theme] .income-plan-summary > div,:root.v2-preview[data-theme] .income-goal-stat{border-color:var(--border);background:#f7f9fb}

/* The selected theme changes the accent, while the V2 light layout stays in place. */
:root.v2-preview[data-theme="apple"]{--blue:#0878f9}
:root.v2-preview[data-theme="forest"]{--blue:#16845c}
:root.v2-preview[data-theme="ocean"]{--blue:#087bd2}
:root.v2-preview[data-theme="amber"]{--blue:#bd7620}
:root.v2-preview[data-theme="violet"]{--blue:#775bd6}
:root.v2-preview[data-theme="rose"]{--blue:#d14f79}
:root.v2-preview[data-theme] .topbar{align-items:flex-start;flex-wrap:wrap;row-gap:12px}
:root.v2-preview[data-theme] .topbar > div:not(.topbar-actions){flex:0 0 auto}
:root.v2-preview[data-theme] .topbar-actions{flex:1 1 760px;max-width:calc(100% - 250px);min-width:0;gap:7px;justify-content:flex-end}
:root.v2-preview[data-theme] .topbar-actions .updated-label{display:none}
:root.v2-preview[data-theme] .topbar-actions .theme-select{width:126px;min-width:126px;max-width:100%;flex:0 0 126px}
:root.v2-preview[data-theme] .summary-grid>.summary-card:nth-child(3) .card-value{color:var(--dividend-color)}
:root.v2-preview[data-theme] .report-grid>.summary-card:nth-child(2) .card-value{color:var(--dividend-color)}
:root.v2-preview[data-theme] .alerts-layout{display:grid;grid-template-columns:minmax(330px,.86fr) minmax(0,1.14fr);align-items:start;gap:14px}
:root.v2-preview[data-theme] .alerts-layout>.panel{margin:0;min-width:0}
:root.v2-preview[data-theme] .alerts-layout .price-alert-list{grid-template-columns:1fr}
:root.v2-preview[data-theme] .alerts-layout .iphone-push-guide[open] summary{border-bottom:0}
@media(max-width:1100px){:root.v2-preview[data-theme] .topbar-actions{max-width:calc(100% - 240px);flex-basis:680px}}
@media(max-width:900px){:root.v2-preview[data-theme] .alerts-layout{grid-template-columns:1fr}}
@media(max-width:720px){
  :root.v2-preview[data-theme] .topbar{align-items:center}
  :root.v2-preview[data-theme] .topbar-actions{max-width:100%;flex:1 1 100%;justify-content:flex-start}
  :root.v2-preview[data-theme] .alerts-layout{grid-template-columns:1fr}
  :root.v2-preview[data-theme] .alerts-layout .price-alert-list{grid-template-columns:1fr}
}

/* Theme palettes: the selected color carries through the canvas, surfaces, text and controls. */
:root.v2-preview[data-theme="apple"]{--bg:#f3f5f8;--surface:#fff;--surface-subtle:#f8fafc;--surface-hover:#edf2f8;--border:#dfe5ed;--text:#202a38;--muted:#586a80;--faint:#78879a;--blue:#315f9f;--green:var(--blue);--dividend-color:var(--blue);--orange:#d9783d;--accent-soft:#eaf0f9;--accent-border:#d4e0f1;--focus-ring:rgba(49,95,159,.25);--success-surface:#eff7f3}
:root.v2-preview[data-theme="forest"]{--bg:#eff4ed;--surface:#fcfefb;--surface-subtle:#f4f8f1;--surface-hover:#eaf1e7;--border:#d9e4d5;--text:#26342b;--muted:#536b59;--faint:#748578;--blue:#4d7557;--green:var(--blue);--dividend-color:var(--blue);--orange:#bd6c51;--accent-soft:#e7f0e5;--accent-border:#d0e0ce;--focus-ring:rgba(77,117,87,.24);--success-surface:#edf6ed}
:root.v2-preview[data-theme="ocean"]{--bg:#edf4f6;--surface:#fbfdfd;--surface-subtle:#f2f8f9;--surface-hover:#e7f1f3;--border:#d6e4e7;--text:#203039;--muted:#526a73;--faint:#758a91;--blue:#287992;--green:var(--blue);--dividend-color:var(--blue);--orange:#d97860;--accent-soft:#e5f1f3;--accent-border:#cce1e5;--focus-ring:rgba(40,121,146,.25);--success-surface:#eef7f7}
:root.v2-preview[data-theme="amber"]{--bg:#f7f2e8;--surface:#fffdf8;--surface-subtle:#faf6ed;--surface-hover:#f1e9d9;--border:#e6dcc8;--text:#342f27;--muted:#6d6253;--faint:#897e6e;--blue:#c07837;--green:var(--blue);--dividend-color:var(--blue);--orange:#4d7184;--accent-soft:#f5ead9;--accent-border:#e9d3b4;--focus-ring:rgba(192,120,55,.24);--success-surface:#f0f5ef}
:root.v2-preview[data-theme="violet"]{--bg:#f3eff7;--surface:#fefcff;--surface-subtle:#f8f4fa;--surface-hover:#f0eaf5;--border:#e2d9e9;--text:#2d2937;--muted:#635b70;--faint:#827a8d;--blue:#755497;--green:var(--blue);--dividend-color:var(--blue);--orange:#cd9844;--accent-soft:#eee8f5;--accent-border:#ddd0e9;--focus-ring:rgba(117,84,151,.25);--success-surface:#f4f0f7}
:root.v2-preview[data-theme="rose"]{--bg:#f8eff1;--surface:#fffdfd;--surface-subtle:#fcf5f6;--surface-hover:#f5e9ed;--border:#ead9df;--text:#352830;--muted:#735d67;--faint:#947e87;--blue:#bd526f;--green:var(--blue);--dividend-color:var(--blue);--orange:#568ba0;--accent-soft:#f7e9ed;--accent-border:#ebd1da;--focus-ring:rgba(189,82,111,.24);--success-surface:#f5f1f3}
:root.v2-preview[data-theme]{--sidebar:var(--surface);--panel:var(--surface);--panel-2:var(--surface);--panel-3:var(--surface-subtle)}
:root.v2-preview[data-theme] .sidebar,:root.v2-preview[data-theme] .panel,:root.v2-preview[data-theme] .summary-card,:root.v2-preview[data-theme] .report-card,:root.v2-preview[data-theme] .price-alert-card,:root.v2-preview[data-theme] .month-card,:root.v2-preview[data-theme] .custom-etf-item,:root.v2-preview[data-theme] .trust-panel,:root.v2-preview[data-theme] .modal,:root.v2-preview[data-theme] .account-dialog,:root.v2-preview[data-theme] .legal-dialog{background:var(--surface)}
:root.v2-preview[data-theme] .summary-card,:root.v2-preview[data-theme] .panel,:root.v2-preview[data-theme] .trust-card,:root.v2-preview[data-theme] .push-toggle-row,:root.v2-preview[data-theme] .income-plan-summary>div,:root.v2-preview[data-theme] .income-goal-summary>div,:root.v2-preview[data-theme] .income-goal-stat,:root.v2-preview[data-theme] .dividend-history-chart,:root.v2-preview[data-theme] .dividend-chart-empty{border-color:var(--border)}
:root.v2-preview[data-theme] .trust-card,:root.v2-preview[data-theme] .income-plan-summary>div,:root.v2-preview[data-theme] .income-goal-summary>div,:root.v2-preview[data-theme] .income-goal-stat,:root.v2-preview[data-theme] .dividend-history-chart,:root.v2-preview[data-theme] .dividend-chart-empty,:root.v2-preview[data-theme] .push-preference-grid label{background:var(--surface-subtle)}
:root.v2-preview[data-theme] .topbar-actions>button,:root.v2-preview[data-theme] #accountButton,:root.v2-preview[data-theme] .theme-select,:root.v2-preview[data-theme] .ghost-button,:root.v2-preview[data-theme] .select-small,:root.v2-preview[data-theme] input,:root.v2-preview[data-theme] select,:root.v2-preview[data-theme] textarea{border-color:var(--border);color:var(--text);background:var(--surface)}
:root.v2-preview[data-theme] .nav-item:hover,:root.v2-preview[data-theme] .account-menu button:hover,:root.v2-preview[data-theme] .ghost-button:hover{color:var(--blue);background:var(--surface-hover)}
:root.v2-preview[data-theme] .nav-item.active,:root.v2-preview[data-theme] .avatar,:root.v2-preview[data-theme] .asset-icon,:root.v2-preview[data-theme] .trust-card-icon{color:var(--blue);background:var(--accent-soft)}
:root.v2-preview[data-theme] .demo-notice{border-color:var(--accent-border);color:var(--muted);background:var(--accent-soft)}
:root.v2-preview[data-theme] .push-instructions{border-color:var(--accent-border);color:var(--muted);background:var(--surface-subtle)}
:root.v2-preview[data-theme] .iphone-push-guide,:root.v2-preview[data-theme] .android-push-guide{border-color:var(--border);background:var(--surface-subtle)}
:root.v2-preview[data-theme] .price-alert-notice{border-color:var(--border);color:var(--green);background:var(--success-surface)}
:root.v2-preview[data-theme] .upcoming-dividend-card{border-color:var(--border);background:linear-gradient(135deg,var(--success-surface),var(--surface) 70%)}
:root.v2-preview[data-theme] .upcoming-dividend-description{flex:1;min-width:0}
:root.v2-preview[data-theme] .upcoming-dividend-date{display:flex;align-items:baseline;gap:8px;margin-top:6px}
:root.v2-preview[data-theme] .upcoming-dividend-date span{margin:0;color:var(--muted);font-size:calc(11px * var(--type-scale));font-weight:600}
:root.v2-preview[data-theme] .upcoming-dividend-date b{color:var(--blue);font-size:calc(24px * var(--type-scale));font-weight:760;font-variant-numeric:tabular-nums;line-height:1.05}
:root.v2-preview[data-theme] .upcoming-dividend-main .upcoming-dividend-details{margin-top:4px;font-size:calc(11px * var(--type-scale))}
:root.v2-preview[data-theme] .asset-scope-bar,:root.v2-preview[data-theme] .view-header .filter-badge{border-color:var(--border);background:var(--surface)}
:root.v2-preview[data-theme] button:focus-visible,:root.v2-preview[data-theme] a:focus-visible,:root.v2-preview[data-theme] select:focus-visible,:root.v2-preview[data-theme] input:focus-visible{outline-color:var(--focus-ring)}
:root.v2-preview[data-theme] .push-preference-grid{gap:8px 10px}
:root.v2-preview[data-theme] .push-toggle-row{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 13px;border:1px solid var(--border);border-radius:13px;color:var(--text);background:var(--surface)}
:root.v2-preview[data-theme] .push-toggle-row input[type="checkbox"]{appearance:none;-webkit-appearance:none;position:relative;flex:0 0 42px;width:42px;height:26px;margin:0;border:0;border-radius:999px;background:#cbd2da;cursor:pointer;transition:background-color .18s ease,box-shadow .18s ease}
:root.v2-preview[data-theme] .push-toggle-row input[type="checkbox"]::before{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .18s ease}
:root.v2-preview[data-theme] .push-toggle-row input[type="checkbox"]:checked{background:var(--blue)}
:root.v2-preview[data-theme] .push-toggle-row input[type="checkbox"]:checked::before{transform:translateX(16px)}
:root.v2-preview[data-theme] .push-toggle-row input[type="checkbox"]:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px}
:root.v2-preview[data-theme] .summary-grid>.summary-card:nth-child(3) .card-value{color:var(--dividend-color)}
:root.v2-preview[data-theme] .report-grid>.summary-card:nth-child(2) .card-value{color:var(--dividend-color)}
:root.v2-preview[data-theme] .summary-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media(max-width:900px){:root.v2-preview[data-theme] .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){:root.v2-preview[data-theme] .summary-grid{grid-template-columns:1fr}}

/* Dashboard hierarchy follows the reference: a large portfolio card, compact annual cards, then chart and upcoming income. */
:root.v2-preview[data-theme] .overview-top-grid{display:grid;grid-template-columns:minmax(0,1.42fr) minmax(310px,.9fr);gap:14px;margin-bottom:14px}
:root.v2-preview[data-theme] .overview-market-card{min-height:218px;display:flex;flex-direction:column;justify-content:space-between;padding:22px 24px}
:root.v2-preview[data-theme] .overview-market-head{display:flex;align-items:flex-start;justify-content:space-between}
:root.v2-preview[data-theme] .overview-section-label{display:inline-block;color:var(--muted);font-size:11px}
:root.v2-preview[data-theme] .overview-market-head .metric-label{color:var(--muted);font-size:11px}
:root.v2-preview[data-theme] .overview-market-head .metric-help-button{margin-left:5px}
:root.v2-preview[data-theme] .overview-market-total{display:block;margin:8px 0 6px;color:var(--text);font-size:42px;letter-spacing:-.045em;line-height:1.05}
:root.v2-preview[data-theme] .overview-holdings-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;color:var(--blue);background:var(--accent-soft);font-size:10px;font-weight:650}
:root.v2-preview[data-theme] .overview-holdings-pill:first-letter{font-size:8px}
:root.v2-preview[data-theme] .overview-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding-top:15px;border-top:1px solid var(--border)}
:root.v2-preview[data-theme] .overview-metrics>div{min-width:0}
:root.v2-preview[data-theme] .overview-metrics .metric-label{color:var(--muted);font-size:10px;white-space:nowrap}
:root.v2-preview[data-theme] .overview-metrics .metric-help-button{width:14px;height:14px;line-height:12px}
:root.v2-preview[data-theme] .overview-metrics strong{display:block;margin-top:4px;overflow:hidden;color:var(--blue);font-size:17px;letter-spacing:-.02em;text-overflow:ellipsis;white-space:nowrap}
:root.v2-preview[data-theme] .overview-metrics strong.negative{color:var(--red)}
:root.v2-preview[data-theme] .overview-accent-value{color:var(--blue)}
:root.v2-preview[data-theme] .overview-side-cards{display:grid;grid-template-rows:1fr 1fr;gap:14px;min-height:218px}
:root.v2-preview[data-theme] .overview-year-card{display:flex;flex-direction:column;justify-content:center;padding:17px 20px}
:root.v2-preview[data-theme] .overview-year-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
:root.v2-preview[data-theme] .overview-year-heading>div:first-child strong{display:block;margin-top:5px;color:var(--blue);font-size:26px;letter-spacing:-.035em}
:root.v2-preview[data-theme] .overview-year-heading>div:last-child{text-align:right}
:root.v2-preview[data-theme] .overview-year-heading>div:last-child span{display:block;color:var(--muted);font-size:10px}
:root.v2-preview[data-theme] .overview-year-heading>div:last-child strong{display:block;margin-top:4px;color:var(--text);font-size:15px}
:root.v2-preview[data-theme] .overview-year-card .progress-track{height:6px;margin:12px 0 0;background:var(--surface-hover)}
:root.v2-preview[data-theme] .overview-year-card .progress-fill{background:var(--blue)}
:root.v2-preview[data-theme] .overview-progress-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px}
:root.v2-preview[data-theme] .overview-progress-title{display:block;margin-top:5px;color:var(--text);font-size:20px;letter-spacing:-.02em}
:root.v2-preview[data-theme] .overview-pending{display:block;margin-top:7px;color:var(--muted);font-size:10px}
:root.v2-preview[data-theme] .overview-progress-ring{position:relative;width:74px;height:74px;flex:0 0 74px;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--blue) var(--progress),var(--border) 0)}
:root.v2-preview[data-theme] .overview-progress-ring::before{content:"";position:absolute;width:58px;height:58px;border-radius:50%;background:var(--surface)}
:root.v2-preview[data-theme] .overview-progress-ring span{position:relative;z-index:1;color:var(--text);font-size:15px;font-weight:700}
:root.v2-preview[data-theme] .overview-activity-grid{grid-template-columns:minmax(0,1.42fr) minmax(310px,.9fr);align-items:stretch;gap:14px;margin-bottom:14px}
:root.v2-preview[data-theme] .overview-activity-grid>.panel{min-width:0;min-height:238px;margin:0}
:root.v2-preview[data-theme] .overview-activity-grid .panel-heading{margin-bottom:16px}
:root.v2-preview[data-theme] .overview-upcoming-panel .income-row{border-top-color:var(--border)}
:root.v2-preview[data-theme] .text-link-button{border:0;padding:6px 0;color:var(--blue);background:transparent;font-size:10px;font-weight:650;white-space:nowrap}
:root.v2-preview[data-theme] .text-link-button:hover{text-decoration:underline;text-underline-offset:3px}
:root.v2-preview[data-theme] .calendar-item{gap:10px;padding-top:12px}
:root.v2-preview[data-theme] .calendar-item-info>strong{line-height:1.35}
:root.v2-preview[data-theme] .calendar-payment-date{display:flex;align-items:baseline;gap:6px;width:max-content;margin:4px 0 0!important;padding:0;color:var(--blue)!important;background:transparent;white-space:nowrap}
:root.v2-preview[data-theme] .calendar-payment-date small{color:var(--muted);font-size:10px;font-weight:600}
:root.v2-preview[data-theme] .calendar-payment-date b{color:var(--blue);font-size:calc(17px * var(--type-scale));font-weight:750;font-variant-numeric:tabular-nums;line-height:1.1}
:root.v2-preview[data-theme] .bar{background:linear-gradient(180deg,color-mix(in srgb,var(--blue) 82%,#fff),var(--blue))}
:root.v2-preview[data-theme] .bar.future{background:linear-gradient(180deg,color-mix(in srgb,var(--orange) 82%,#fff),var(--orange))}
:root.v2-preview[data-theme] .legend-dot{background:var(--blue)}
:root.v2-preview[data-theme] .legend-dot.orange{background:var(--orange)}
:root.v2-preview[data-theme] .progress-track{background:var(--surface-hover)}
:root.v2-preview[data-theme] .progress-fill{background:var(--blue)}
:root.v2-preview[data-theme] .metric-help-button,:root.v2-preview[data-theme] .metric-help-button:hover,:root.v2-preview[data-theme] .metric-help-button[aria-expanded="true"]{color:var(--blue);border-color:var(--accent-border);background:var(--accent-soft)}
@media(max-width:1000px){
  :root.v2-preview[data-theme] .overview-top-grid,:root.v2-preview[data-theme] .overview-activity-grid{grid-template-columns:minmax(0,1fr)}
  :root.v2-preview[data-theme] .overview-side-cards{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;min-height:0}
  :root.v2-preview[data-theme] .overview-year-card,:root.v2-preview[data-theme] .overview-progress-card{min-height:108px}
}
@media(max-width:620px){
  :root.v2-preview[data-theme] .overview-market-card{min-height:0;gap:22px;padding:18px}
  :root.v2-preview[data-theme] .overview-market-total{font-size:34px}
  :root.v2-preview[data-theme] .overview-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}
  :root.v2-preview[data-theme] .overview-metrics strong{font-size:16px}
  :root.v2-preview[data-theme] .overview-side-cards{grid-template-columns:1fr}
  :root.v2-preview[data-theme] .overview-activity-grid>.panel{min-height:0;padding:17px}
  :root.v2-preview[data-theme] .overview-activity-grid .panel-heading-actions{justify-content:flex-start}
  :root.v2-preview[data-theme] .overview-year-heading>div:first-child strong{font-size:23px}
}

/* Dark appearance is independent from the selected accent palette. */
:root.v2-preview[data-theme][data-mode="dark"]{
  color-scheme:dark;
  --bg:#10151c;--surface:#171f28;--surface-subtle:#1d2732;--surface-hover:#263341;
  --border:#2e3b49;--text:#edf2f7;--muted:#abb8c6;--faint:#8291a1;
  --sidebar:var(--surface);--panel:var(--surface);--panel-2:#202a35;--panel-3:var(--surface-subtle);
  --accent-soft:color-mix(in srgb,var(--blue) 19%,var(--surface));
  --accent-border:color-mix(in srgb,var(--blue) 42%,var(--border));
  --success-surface:#192d27;--shadow:0 12px 32px rgba(0,0,0,.2);--bg-glow:transparent;
}
:root.v2-preview[data-theme][data-mode="dark"] body{background:var(--bg);color:var(--text)}
:root.v2-preview[data-theme][data-mode="dark"] .sidebar,
:root.v2-preview[data-theme][data-mode="dark"] .panel,
:root.v2-preview[data-theme][data-mode="dark"] .summary-card,
:root.v2-preview[data-theme][data-mode="dark"] .report-card,
:root.v2-preview[data-theme][data-mode="dark"] .price-alert-card,
:root.v2-preview[data-theme][data-mode="dark"] .month-card,
:root.v2-preview[data-theme][data-mode="dark"] .custom-etf-item,
:root.v2-preview[data-theme][data-mode="dark"] .trust-panel,
:root.v2-preview[data-theme][data-mode="dark"] .modal,
:root.v2-preview[data-theme][data-mode="dark"] .account-dialog,
:root.v2-preview[data-theme][data-mode="dark"] .legal-dialog,
:root.v2-preview[data-theme][data-mode="dark"] .account-menu,
:root.v2-preview[data-theme][data-mode="dark"] .guide-tour{border-color:var(--border);background:var(--surface);color:var(--text);box-shadow:var(--shadow)}
:root.v2-preview[data-theme][data-mode="dark"] .demo-notice,
:root.v2-preview[data-theme][data-mode="dark"] .asset-scope-bar,
:root.v2-preview[data-theme][data-mode="dark"] .view-header .filter-badge{border-color:var(--accent-border);background:var(--accent-soft);color:var(--muted)}
:root.v2-preview[data-theme][data-mode="dark"] .trust-card,
:root.v2-preview[data-theme][data-mode="dark"] .income-plan-summary>div,
:root.v2-preview[data-theme][data-mode="dark"] .income-goal-summary>div,
:root.v2-preview[data-theme][data-mode="dark"] .income-goal-stat,
:root.v2-preview[data-theme][data-mode="dark"] .dividend-history-chart,
:root.v2-preview[data-theme][data-mode="dark"] .dividend-chart-empty,
:root.v2-preview[data-theme][data-mode="dark"] .push-preference-grid label,
:root.v2-preview[data-theme][data-mode="dark"] .push-instructions,
:root.v2-preview[data-theme][data-mode="dark"] .iphone-push-guide,
:root.v2-preview[data-theme][data-mode="dark"] .android-push-guide{border-color:var(--border);background:var(--surface-subtle);color:var(--text)}
:root.v2-preview[data-theme][data-mode="dark"] .topbar-actions>button,
:root.v2-preview[data-theme][data-mode="dark"] #accountButton,
:root.v2-preview[data-theme][data-mode="dark"] .ghost-button,
:root.v2-preview[data-theme][data-mode="dark"] .select-small,
:root.v2-preview[data-theme][data-mode="dark"] .theme-select,
:root.v2-preview[data-theme][data-mode="dark"] .theme-mode-toggle,
:root.v2-preview[data-theme][data-mode="dark"] input,
:root.v2-preview[data-theme][data-mode="dark"] select,
:root.v2-preview[data-theme][data-mode="dark"] textarea{border-color:var(--border);background-color:var(--surface);color:var(--text)}
:root.v2-preview[data-theme][data-mode="dark"] .topbar-actions .theme-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='m3.5 5.25 3.5 3.5 3.5-3.5' stroke='%23abb8c6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 11px center;background-repeat:no-repeat;background-size:14px 14px}
:root.v2-preview[data-theme][data-mode="dark"] .primary-button{border-color:var(--blue);background:var(--blue);color:#fff}
:root.v2-preview[data-theme][data-mode="dark"] .nav-item:hover,
:root.v2-preview[data-theme][data-mode="dark"] .account-menu button:hover,
:root.v2-preview[data-theme][data-mode="dark"] .ghost-button:hover{background:var(--surface-hover);color:var(--blue)}
:root.v2-preview[data-theme][data-mode="dark"] .nav-item.active,
:root.v2-preview[data-theme][data-mode="dark"] .avatar,
:root.v2-preview[data-theme][data-mode="dark"] .asset-icon,
:root.v2-preview[data-theme][data-mode="dark"] .trust-card-icon{background:var(--accent-soft);color:var(--blue)}
:root.v2-preview[data-theme][data-mode="dark"] .theme-mode-toggle[aria-pressed="true"]{border-color:var(--accent-border);background:var(--accent-soft);color:var(--blue)}
:root.v2-preview[data-theme][data-mode="dark"] .upcoming-dividend-card{border-color:var(--border);background:linear-gradient(135deg,var(--success-surface),var(--surface) 70%)}
:root.v2-preview[data-theme][data-mode="dark"] .holdings-table th,
:root.v2-preview[data-theme][data-mode="dark"] .holdings-table td,
:root.v2-preview[data-theme][data-mode="dark"] .transactions-table th,
:root.v2-preview[data-theme][data-mode="dark"] .transactions-table td,
:root.v2-preview[data-theme][data-mode="dark"] .income-row,
:root.v2-preview[data-theme][data-mode="dark"] .overview-upcoming-panel .income-row{border-color:var(--border)}
:root.v2-preview[data-theme][data-mode="dark"] .demo-notice #dismissNotice,
:root.v2-preview[data-theme][data-mode="dark"] .site-footer{color:var(--faint)}
:root.v2-preview[data-theme][data-mode="dark"] .account-overlay,:root.v2-preview[data-theme][data-mode="dark"] .modal-backdrop{background:rgba(0,0,0,.58)}
:root.v2-preview[data-theme][data-mode="dark"] button:focus-visible,
:root.v2-preview[data-theme][data-mode="dark"] a:focus-visible,
:root.v2-preview[data-theme][data-mode="dark"] select:focus-visible,
:root.v2-preview[data-theme][data-mode="dark"] input:focus-visible{outline-color:var(--focus-ring)}
:root.v2-preview[data-theme]:not([data-mode="dark"]) .topbar-actions .theme-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='m3.5 5.25 3.5 3.5 3.5-3.5' stroke='%23586a80' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 11px center;background-repeat:no-repeat;background-size:14px 14px}

/* Achievements: a quiet progress view using the existing theme tokens. */
:root.v2-preview[data-theme] .achievements-intro{margin-bottom:14px}
:root.v2-preview[data-theme] .achievements-intro .dividend-rule-note{max-width:820px;line-height:1.65}
:root.v2-preview[data-theme] .achievement-overview{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px 28px;margin-bottom:28px;padding:25px 28px}
:root.v2-preview[data-theme] .achievement-overview-copy .eyebrow{color:var(--blue);font-size:11px}
:root.v2-preview[data-theme] .achievement-overview-copy h2{margin:7px 0 5px;font-size:21px;letter-spacing:-.025em}
:root.v2-preview[data-theme] .achievement-overview-copy p{margin:0;color:var(--muted);font-size:12px}
:root.v2-preview[data-theme] .achievement-overview-count{display:flex;flex-direction:column;align-items:flex-end;gap:3px;color:var(--muted);font-size:11px}
:root.v2-preview[data-theme] .achievement-overview-count strong{color:var(--text);font-size:34px;line-height:1;letter-spacing:-.04em}
:root.v2-preview[data-theme] .achievement-overview-count strong span{color:var(--faint);font-size:17px;font-weight:500;letter-spacing:0}
:root.v2-preview[data-theme] .achievement-overview-progress{grid-column:1/-1;max-width:540px;width:100%}
:root.v2-preview[data-theme] .achievement-progress-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 7px;color:var(--muted);font-size:11px}
:root.v2-preview[data-theme] .achievement-progress-meta strong{color:var(--text);font-size:11px;font-weight:650}
:root.v2-preview[data-theme] .achievement-progress{height:7px;overflow:hidden;border-radius:999px;background:var(--surface-hover)}
:root.v2-preview[data-theme] .achievement-progress span{display:block;height:100%;border-radius:inherit;background:var(--blue);transition:width .25s ease}
:root.v2-preview[data-theme] .achievement-section-heading{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:0 0 13px}
:root.v2-preview[data-theme] .achievement-section-heading h2{margin:0;font-size:16px;letter-spacing:-.02em}
:root.v2-preview[data-theme] .achievement-section-heading p{margin:4px 0 0;color:var(--muted);font-size:11px}
:root.v2-preview[data-theme] .achievement-section-heading > span{color:var(--muted);font-size:11px}
:root.v2-preview[data-theme] .achievement-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
:root.v2-preview[data-theme] .achievement-card{min-width:0;min-height:220px;padding:18px;border:1px solid var(--border);border-radius:17px;background:var(--surface);box-shadow:var(--shadow)}
:root.v2-preview[data-theme] .achievement-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
:root.v2-preview[data-theme] .achievement-mark{display:grid;width:42px;height:42px;place-items:center;border:1px solid var(--accent-border);border-radius:14px;color:var(--blue);background:var(--accent-soft);font-size:15px;font-weight:700;letter-spacing:-.02em}
:root.v2-preview[data-theme] .achievement-state{padding:5px 8px;border-radius:999px;color:var(--faint);background:var(--surface-subtle);font-size:10px;white-space:nowrap}
:root.v2-preview[data-theme] .achievement-card.is-unlocked .achievement-state{color:var(--blue);background:var(--accent-soft)}
:root.v2-preview[data-theme] .achievement-card h3{margin:17px 0 5px;font-size:15px;letter-spacing:-.015em}
:root.v2-preview[data-theme] .achievement-card p{min-height:38px;margin:0 0 20px;color:var(--muted);font-size:11px;line-height:1.65}
:root.v2-preview[data-theme] .achievement-card .achievement-progress-meta{margin-bottom:7px}
:root.v2-preview[data-theme] .achievement-footnote{margin:15px 0 0;color:var(--faint);font-size:10px;line-height:1.6}
:root.v2-preview[data-theme][data-mode="dark"] .achievement-card{background:var(--surface)}
@media(max-width:1050px){:root.v2-preview[data-theme] .achievement-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){:root.v2-preview[data-theme] .achievement-overview{grid-template-columns:minmax(0,1fr) auto;gap:15px;padding:19px}
:root.v2-preview[data-theme] .achievement-overview-copy h2{font-size:18px}
:root.v2-preview[data-theme] .achievement-overview-progress{grid-column:1/-1}
:root.v2-preview[data-theme] .achievement-grid{grid-template-columns:1fr;gap:10px}
:root.v2-preview[data-theme] .achievement-card{min-height:0;padding:16px}
:root.v2-preview[data-theme] .achievement-card p{min-height:0;margin-bottom:16px}}
@media(max-width:430px){:root.v2-preview[data-theme] .achievement-overview{grid-template-columns:minmax(0,1fr);gap:14px}
:root.v2-preview[data-theme] .achievement-overview-count{align-items:flex-start}
:root.v2-preview[data-theme] .achievement-section-heading{align-items:flex-start}}
/* 本機成就 V2：主題色、分階段徽章與分享預覽 */
:root.v2-preview[data-theme] .milestone-hero{display:grid;grid-template-columns:1.4fr 1fr;gap:32px;padding:40px;margin-bottom:24px;background:linear-gradient(135deg,var(--surface),var(--accent-soft));align-items:center}
.milestone-hero h2{font-size:clamp(28px,3.5vw,44px);line-height:1.22;letter-spacing:-1px;margin:12px 0 16px}.milestone-hero p,.milestone-series-heading p{color:var(--muted);line-height:1.7}.milestone-demo-note{display:inline-block;color:var(--muted);font-size:12px;margin-top:16px}.milestone-hero-count{text-align:center}.milestone-hero-count>strong{font-size:64px;color:var(--blue);letter-spacing:-2px}.milestone-hero-count>strong span{font-size:24px;color:var(--muted);letter-spacing:0}.milestone-mini-badges{display:flex;justify-content:center;gap:12px;margin-top:20px}.milestone-mini-badges svg{width:72px;height:72px;color:var(--blue)}
:root.v2-preview[data-theme] .milestone-series{padding:28px;margin-bottom:24px}.milestone-series-heading{display:flex;justify-content:space-between;gap:16px;align-items:center}.milestone-series-heading h2{font-size:24px;margin:8px 0}.milestone-current{text-align:right;display:grid;gap:8px}.milestone-current strong{font-size:28px;font-variant-numeric:tabular-nums;color:var(--blue)}.milestone-current span{font-size:12px;color:var(--muted)}.milestone-next{display:flex;justify-content:space-between;gap:16px;font-size:12px;color:var(--muted);margin:24px 0 10px}.milestone-series .achievement-progress{height:6px;background:var(--border);border-radius:99px;overflow:hidden}.milestone-series .achievement-progress span{display:block;height:100%;background:var(--blue)}.milestone-badges{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;margin:28px 0 16px}.milestone-tile{border:1px solid transparent;border-radius:20px;padding:16px 8px;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--text);background:transparent;cursor:pointer;min-height:44px;font:inherit}.milestone-tile:hover,.milestone-tile:focus-visible{background:var(--accent-soft);border-color:var(--accent-border)}.milestone-badge{width:92px;height:92px;color:var(--blue);flex-shrink:0}.milestone-tile strong{font-size:13px;text-align:center;line-height:1.5}.milestone-tile span{font-size:12px;color:var(--muted)}.milestone-tile small{font-size:11px;color:var(--blue)}.milestone-tile.is-pending small{color:var(--muted)}.badge-locked{color:var(--muted);opacity:.5}.milestone-rule{font-size:12px;color:var(--muted);border-top:1px solid var(--border);padding-top:16px}.milestone-rule summary{cursor:pointer;min-height:44px;display:flex;align-items:center}.milestone-rule p{line-height:1.8;margin:8px 0}.milestone-dialog{text-align:center;position:relative;max-width:520px;max-height:90dvh;overflow:auto;padding:32px}.milestone-dialog>.milestone-badge{width:140px;height:140px;display:block;margin:8px auto 24px}.milestone-dialog h2{font-size:28px;margin:12px 0}.milestone-dialog p{color:var(--muted);line-height:1.7}.milestone-close{position:absolute;right:16px;top:16px;min-width:44px;min-height:44px}.milestone-dialog-target{display:block;font-size:32px;color:var(--blue);margin:16px}.milestone-dialog-rule{font-size:13px}.milestone-privacy{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;min-height:44px;margin:16px 0}.milestone-privacy input{width:18px;height:18px;accent-color:var(--blue)}#achievementSharePreview canvas{display:block;width:100%;height:auto;max-width:280px;margin:24px auto;border-radius:16px;box-shadow:0 8px 32px #0002}.milestone-share-actions{display:flex;justify-content:center;gap:12px}.milestone-share-actions[hidden]{display:none}#achievementDialog[hidden]{display:none}.milestone-dialog .primary-button{min-height:44px}
@media(max-width:1000px){.milestone-badges{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:600px){:root.v2-preview[data-theme] .milestone-hero{grid-template-columns:1fr;padding:24px;gap:24px}.milestone-hero-count>strong{font-size:48px}.milestone-mini-badges{margin-top:12px}:root.v2-preview[data-theme] .milestone-series{padding:20px}.milestone-series-heading{align-items:flex-start;flex-direction:column}.milestone-current{text-align:left}.milestone-badges{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}.milestone-badge{width:76px;height:76px}.milestone-tile{padding:12px 4px}.milestone-tile strong{font-size:12px}.milestone-dialog{padding:24px;margin:12px;width:calc(100% - 24px)}}
.milestone-selection-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px;margin-bottom:24px}.milestone-selection-bar strong{font-size:18px}.milestone-selection-bar p{color:var(--muted);font-size:13px;margin-top:8px;line-height:1.6}.milestone-selection-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.milestone-selection-controls>span{color:var(--muted);font-size:13px}.milestone-selection-controls button{min-height:44px}.milestone-selection-controls button:disabled{opacity:.45;cursor:not-allowed}.milestone-selectable{border:1px solid transparent;border-radius:20px;min-width:0}.milestone-selectable.is-selected{background:var(--accent-soft);border-color:var(--blue)}.milestone-selectable .milestone-tile{width:100%}.milestone-select-label{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;font-size:12px;color:var(--blue);cursor:pointer}.milestone-select-label input{width:18px;height:18px;accent-color:var(--blue)}.milestone-selection-placeholder{display:block;height:44px}.milestone-selected-summary{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:20px 0}.milestone-selected-summary span{font-size:12px;background:var(--accent-soft);color:var(--blue);padding:8px 12px;border-radius:99px}
@media(max-width:900px){.milestone-selection-bar{flex-direction:column;align-items:flex-start}.milestone-selection-controls{width:100%}}
/* 收藏勳章：金屬外框、系列底色與階級緞帶 */
.milestone-badge.medal-badge{width:100px;height:112px;filter:drop-shadow(0 5px 5px rgba(27,35,49,.16))}.milestone-tile{padding-top:18px;padding-bottom:16px}.milestone-tile.is-earned:hover .medal-badge{filter:drop-shadow(0 8px 8px rgba(27,35,49,.22))}.medal-badge.badge-locked{opacity:.52;filter:grayscale(1)}.milestone-mini-badges svg.medal-badge{width:72px;height:82px}.milestone-dialog>.medal-badge{width:160px;height:180px}@media(max-width:600px){.milestone-badge.medal-badge{width:82px;height:94px}}
.milestone-mini-badges{flex-wrap:wrap}

/* Qwen 成就插畫：透明背景，頁面與分享圖使用相同素材。 */
.milestone-badge.medal-badge{width:120px;height:120px;max-width:100%;object-fit:contain;filter:drop-shadow(0 4px 5px rgba(27,35,49,.12))}
.milestone-mini-badges .medal-badge{width:76px;height:76px}
.milestone-dialog>.medal-badge{width:200px;height:200px}
.medal-badge.badge-locked{opacity:.48;filter:grayscale(1)}
@media(max-width:600px){.milestone-badge.medal-badge{width:100px;height:100px}.milestone-dialog>.medal-badge{width:180px;height:180px}}

/* 手機導覽：點擊原頁面區域收起，按鈕固定於安全區左上角。 */
.mobile-nav-backdrop { display: none; }
@media (max-width: 720px) {
  .mobile-nav-backdrop:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 4; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: rgba(20, 30, 45, .18); cursor: pointer; }
  #mobileMenu { display: grid; place-items: center; position: fixed; top: calc(12px + env(safe-area-inset-top, 0px)); left: calc(12px + env(safe-area-inset-left, 0px)); z-index: 6; width: 44px; height: 44px; padding: 0; border: 1px solid var(--border); border-radius: 12px; color: var(--text); background: var(--surface, var(--panel)); box-shadow: 0 3px 12px rgba(0, 0, 0, .12); line-height: 1; }
  body #sidebar { top: 0; z-index: 5; height: 100dvh; padding-top: calc(76px + env(safe-area-inset-top, 0px)); overflow-y: auto; }
  #mobileMenu:focus-visible { outline: 2px solid var(--blue, var(--green)); outline-offset: 3px; }
}
