@layer reset,tokens,base,layout,components,pages;@layer tokens{:root{color-scheme:light;--font-ui: "標楷體", "DFKai-SB", "BiauKai", serif;--font-weight-ui: 700;font-family:var(--font-ui);color:#203b55;background:#e8f3f9;font-synthesis:none;--ink: #1d3851;--muted: #5d748a;--line: rgba(75, 119, 148, .28);--surface: rgba(255, 255, 255, .62);--soft: rgba(255, 255, 255, .45);--teal: #228bb4;--teal-dark: #1e6382;--blue: #3c8dbb;--violet: #8075bd;--amber: #bd8433;--danger: #c55968;--sidebar: #122640;--input-surface: rgba(255, 255, 255, .82);--input-text: #20324e;--glass-surface: rgba(255, 255, 255, .44);--glass-surface-strong: rgba(255, 255, 255, .62);--glass-surface-soft: rgba(255, 255, 255, .28);--glass-border: rgba(255, 255, 255, .8);--glass-blur: blur(14px);--shadow: 0 16px 38px rgba(3, 10, 24, .34);--color-background: #e8f3f9;--color-surface: rgba(255, 255, 255, .54);--color-text: #203b55;--color-text-muted: #5d748a;--color-border: rgba(75, 119, 148, .28);--color-focus: #4d9dcd;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 17px;--motion-fast: .15s;--motion-normal: .18s;--z-sidebar: 4;--z-mobile-nav: 10;--z-toast: 20}}@layer components{*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 12% 8%,rgba(255,255,255,.92) 0,transparent 28rem),radial-gradient(circle at 86% 88%,rgba(142,201,232,.48) 0,transparent 31rem),linear-gradient(135deg,#f5fafc,#eaf5fa 45%,#cfe7f3);color:var(--color-text);font-weight:var(--font-weight-ui)}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,dialog:focus-visible{outline:3px solid color-mix(in srgb,var(--color-focus) 42%,transparent);outline-offset:2px}img{max-width:100%}strong,h1,h2,h3{overflow-wrap:anywhere}.app-shell{min-height:100vh;display:flex}.sidebar{width:246px;background:linear-gradient(180deg,#142c4ad1,#1e466bb8);color:#e6f0fc;padding:28px 18px;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:4;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}.brand{padding:4px 10px 34px}.brand strong{display:block;color:#fff;font-size:18px;letter-spacing:.02em}.brand small{color:#a6bed9;font-size:11px}.sidebar-nav{display:grid;gap:5px}.nav-link{display:flex;align-items:center;gap:12px;color:#b3c5db;padding:12px 13px;border-radius:11px;font-size:14px;transition:.18s ease}.nav-link:hover{background:#84beef2e;color:#fff}.nav-link.active{background:#3e79b2c7;color:#f7fbff;font-weight:700;box-shadow:0 7px 18px #01081447}.nav-icon{width:21px;text-align:center;font-size:18px}.sidebar-footer{margin-top:auto;display:flex;align-items:center;gap:7px;color:#a7bdd5;font-size:12px;padding:10px}.status-dot{width:8px;height:8px;border-radius:50%;background:#6ce5a7;box-shadow:0 0 0 4px #6ce5a724}.main-content{margin-left:246px;width:calc(100% - 246px);padding:42px clamp(22px,5vw,72px) 70px;position:relative}.main-brand-photo{position:absolute;top:16px;right:clamp(22px,5vw,72px);z-index:2;width:168px;padding:0;border:0;border-radius:14px;background:transparent;overflow:hidden}.main-brand-photo img{display:block;width:100%;height:auto;object-fit:contain}.page-frame{max-width:1380px;margin:0 auto}.page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}.c-eyebrow{color:#2d83ae;text-transform:uppercase;letter-spacing:.13em;font-size:10px;font-weight:800;margin-bottom:8px}h1,h2,h3,p{margin-top:0}h1{margin-bottom:8px;color:#173c57;font-size:clamp(28px,4vw,43px);letter-spacing:-.045em;line-height:1.06}.page-header h1.dashboard-title{font-size:clamp(26px,calc(4vw - 2px),41px);white-space:pre-line}h2{font-size:18px;margin:0;letter-spacing:-.02em}h3{font-size:15px;margin:0}.page-description{margin-bottom:0;color:var(--muted);font-size:14px;max-width:670px}.toolbar{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}.dashboard-toolbar .c-field{min-width:142px}.c-card{background:linear-gradient(145deg,var(--glass-surface-strong),var(--glass-surface-soft));border:1px solid var(--glass-border);border-radius:17px;padding:22px;box-shadow:var(--shadow);min-width:0;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}.c-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:18px}.c-card-header .c-field{min-width:180px}.muted{color:var(--muted);font-size:12px;margin:5px 0 0}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.stat-card{padding:19px 20px;border-radius:16px;background:var(--glass-surface);border:1px solid var(--glass-border);box-shadow:0 9px 23px #030a183d;position:relative;overflow:hidden;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.stat-card:after{content:"";position:absolute;width:92px;height:92px;border-radius:50%;right:-35px;bottom:-40px;background:currentColor;opacity:.08}.accent-teal{color:var(--teal)}.accent-blue{color:var(--blue)}.accent-violet{color:var(--violet)}.accent-amber{color:var(--amber)}.stat-label,.stat-detail{display:block;color:var(--muted);font-size:12px}.stat-value{display:block;color:var(--ink);font-size:25px;margin:12px 0 7px;letter-spacing:-.04em}.dashboard-grid,.two-column{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:20px;align-items:start}.two-column>.c-card{min-height:220px}.stack-list{display:grid;gap:8px}.list-row{min-width:0;display:flex;align-items:center;gap:10px;border:1px solid var(--glass-border);border-radius:12px;padding:11px 12px;background:var(--glass-surface-soft);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.list-row.is-done{opacity:.55}.list-row.is-done strong{text-decoration:line-through}.row-main{flex:1;min-width:0}.row-main strong{display:block;overflow-wrap:anywhere;font-size:13px}.row-main small,.table-note{display:block;color:var(--muted);font-size:11px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kind-dot{flex:0 0 29px;width:29px;height:29px;border-radius:9px;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800}.kind-dot.todo{background:#d06b86}.kind-dot.work{background:var(--amber)}.kind-dot.practice{background:var(--blue)}.kind-dot.goal{background:var(--violet)}.empty-state{border:1px dashed var(--glass-border);border-radius:13px;padding:28px 16px;text-align:center;color:var(--muted);background:#ffffff0f;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.empty-icon{font-size:26px;color:#99b2ce;margin-bottom:8px}.empty-state h3{color:#22455f;margin-bottom:14px}.loading{padding:30px 8px;color:var(--muted);font-size:13px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.form-grid>.c-field:nth-child(2),.form-grid>.c-field:last-of-type,.form-grid>.form-actions{grid-column:1 / -1}.c-field{display:grid;gap:6px;min-width:0}.c-field-label{color:#3b5e75;font-size:12px;font-weight:700}.c-input{width:100%;border:1px solid rgba(255,255,255,.58);background:#ffffffd6;color:var(--input-text);border-radius:10px;padding:10px 11px;outline:none;min-height:44px;color-scheme:light;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.c-input::placeholder{color:#7187a3}textarea.c-input{resize:vertical;min-height:86px}.c-input:focus{border-color:#4d9dcd;box-shadow:0 0 0 3px #4d9dcd3d;background:#fffffff0}.form-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:5px}.form-actions.center{justify-content:center}.c-button{min-height:44px;border:0;border-radius:10px;padding:9px 14px;display:inline-flex;justify-content:center;align-items:center;gap:6px;cursor:pointer;font-size:13px;font-weight:700;transition:transform var(--motion-fast) ease,box-shadow var(--motion-fast) ease,background var(--motion-fast) ease}.c-button:hover{transform:translateY(-1px)}.c-button:disabled{cursor:not-allowed;opacity:.55;transform:none}.c-button.primary{color:#fff;background:#4a86c0c7;box-shadow:0 7px 15px #15487959}.c-button.secondary{color:#e2f0ff;background:#355a7fb8}.c-button.ghost{color:#315d79;background:transparent;border:1px solid rgba(63,117,151,.56)}.c-button.danger{color:#ffbec7;background:#603b49b8}.c-button.warning{color:#fff;background:#be8545c7}.c-button.small{min-height:44px;padding:7px 9px;font-size:11px;border-radius:8px}.actions{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}table{width:100%;border-collapse:collapse;min-width:650px}th{color:var(--muted);font-size:11px;font-weight:700;text-align:left;padding:0 11px 10px;border-bottom:1px solid var(--line)}td{padding:13px 11px;border-bottom:1px solid rgba(75,119,148,.25);font-size:13px;vertical-align:middle}td.numeric,th:nth-last-child(2){text-align:right}.portfolio-layout{grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr)}.portfolio-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.portfolio-card{overflow:hidden;border:1px solid var(--glass-border);border-radius:15px;background:var(--glass-surface);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.portfolio-visual{height:150px;background:linear-gradient(135deg,#355e87b8,#53607bad);display:grid;place-items:center;position:relative;overflow:hidden}.portfolio-visual img{width:100%;height:100%;object-fit:cover;cursor:zoom-in}.visual-placeholder{color:#b0cae3;font-size:18px;font-weight:800}.media-count{position:absolute;right:8px;bottom:8px;border-radius:99px;background:#081426c7;color:#fff;padding:4px 7px;font-size:11px}.portfolio-body{padding:14px}.portfolio-body h3{margin:0 0 7px}.portfolio-body p{color:#5b7388;min-height:38px;font-size:12px;line-height:1.5;margin:0 0 10px}.portfolio-body .actions{margin-top:13px}.goal-layout{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(0,1.2fr);gap:18px}.goal-achieved{grid-column:1 / -1}.goal-list{display:grid;gap:12px}.goal-card{display:grid;gap:11px;padding:15px;border:1px solid var(--glass-border);border-radius:14px;background:var(--glass-surface);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.goal-card.is-completed{background:#bbf4d72e}.goal-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.goal-card-header h3{margin-top:5px}.goal-category{color:var(--teal);font-size:10px;font-weight:800;letter-spacing:.08em}.goal-status{flex:0 0 auto;border-radius:99px;padding:5px 8px;color:#f3f9ff;background:#35658fc7;font-size:10px;font-weight:800}.goal-card.is-completed .goal-status{color:#c3f1d8;background:#36705db8}.goal-description{color:var(--muted);font-size:12px;line-height:1.5;margin:0}.goal-meta,.goal-progress-values{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:11px}.goal-progress-track{height:10px;overflow:hidden;border-radius:99px;background:#ffffff29}.goal-progress-bar{height:100%;border-radius:inherit;background:linear-gradient(90deg,#4f95cfe6,#8bc3ebe6);transition:width var(--motion-normal) ease}.goal-card.is-completed .goal-progress-bar{background:#61b88ee6}.goal-actions{justify-content:flex-start}.settings-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.button-stack{display:grid;gap:9px}.health-panel{border-radius:12px;padding:17px;background:#d3faf573;color:#2c6765;border:1px solid var(--glass-border);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.health-panel p{margin:8px 0 0;font-size:12px}.health-ok{color:#1e9b6d;margin-right:6px}.error-text{color:var(--danger)}.bar-chart{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px;min-height:235px;align-items:end;padding-top:20px}.bar-group{height:210px;display:flex;align-items:end;justify-content:center;gap:4px;position:relative;padding-bottom:22px}.bar-stack{height:190px;display:flex;align-items:end;gap:3px}.bar{width:15px;min-height:4px;border-radius:5px 5px 0 0;cursor:help}.bar.income{background:var(--teal)}.bar.work{background:var(--blue)}.bar.practice{background:var(--violet)}.bar-label{position:absolute;bottom:0;color:var(--muted);font-size:11px}.chart-legend{grid-column:1 / -1;display:flex;gap:16px;color:var(--muted);font-size:11px}.chart-legend span:before{content:"";width:8px;height:8px;display:inline-block;border-radius:2px;background:var(--teal);margin-right:5px}.chart-legend span:nth-child(2):before{background:var(--blue)}.chart-legend span:nth-child(3):before{background:var(--violet)}.image-dialog{border:1px solid var(--glass-border);border-radius:16px;padding:14px;max-width:min(92vw,900px);max-height:calc(100dvh - 32px);overflow:auto;background:#ffffffb8;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}.image-dialog::backdrop{background:#020814cc}.image-dialog img{display:block;max-width:86vw;max-height:76vh;object-fit:contain}.dialog-actions{display:flex;justify-content:flex-end;margin-top:10px}#toast-area{position:fixed;right:22px;bottom:22px;display:grid;gap:8px;z-index:20}.toast{max-width:min(360px,calc(100vw - 44px));padding:12px 15px;border-radius:11px;color:#fff;background:#3c80b8d1;box-shadow:0 12px 25px #030a1866;font-size:13px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.toast.error{background:#b95a6ad1}.mobile-nav{display:none}@media(max-width:1120px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-grid{grid-template-columns:1fr 1fr}.settings-grid .c-card:last-child{grid-column:1 / -1}}@media(max-width:820px){.sidebar{width:74px;padding:20px 10px;align-items:center}.brand{display:none}.sidebar-footer span:last-child{display:none}.nav-link{justify-content:center;padding:12px 8px}.nav-link span:last-child{display:none}.sidebar-footer{padding:8px}.main-content{margin-left:74px;width:calc(100% - 74px);padding:30px 22px 50px}.main-brand-photo{width:132px;right:22px}.dashboard-grid,.two-column,.portfolio-layout,.goal-layout{grid-template-columns:1fr}.goal-achieved{grid-column:auto}.page-header{align-items:flex-start;flex-direction:column}.dashboard-toolbar{width:100%}.settings-grid{grid-template-columns:1fr}.settings-grid .c-card:last-child{grid-column:auto}}@media(max-width:560px){.sidebar{display:none}.main-content{margin-left:0;width:100%;padding:82px 15px 92px}.main-brand-photo{top:14px;right:15px;width:112px}.mobile-nav{position:fixed;display:grid;grid-template-columns:repeat(4,1fr);left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));z-index:var(--z-mobile-nav);padding:7px;padding-bottom:max(7px,env(safe-area-inset-bottom));gap:3px;border:1px solid var(--glass-border);border-radius:18px;background:#ffffff1f;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 10px 30px #0209166b}.mobile-nav a{display:grid;gap:2px;justify-items:center;color:#3f6580;padding:7px 1px;border-radius:12px;font-size:17px}.mobile-nav a small{font-size:9px}.mobile-nav a.active{background:#3e79b2c7;color:#f7fbff;font-weight:800}.stats-grid{grid-template-columns:1fr 1fr;gap:9px}.stat-card{padding:14px}.stat-value{font-size:20px}.c-card{padding:16px;border-radius:14px}.form-grid{grid-template-columns:1fr}.form-grid>.c-field:nth-child(2),.form-grid>.c-field:last-of-type,.form-grid>.form-actions{grid-column:auto}.c-card-header{flex-direction:column}.c-card-header .c-field{width:100%}.page-header h1{font-size:31px}.page-header h1.dashboard-title{font-size:29px}.actions{justify-content:flex-start}.bar-chart{gap:7px}.bar{width:9px}}@media(max-width:400px){.main-content{padding-inline:12px}.main-brand-photo{right:12px;width:102px}.c-card{padding:14px}.stats-grid{gap:7px}.stat-card{padding:12px 10px}.stat-value{font-size:18px}.c-button{padding-inline:11px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}}
