/* FlowOS css bundle —— 由 tools/build-bundle.mjs 自动生成，勿手改 */
/* ===== assets/fonts/fonts.css ===== */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter-400.woff2') format("woff2");}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/inter-500.woff2') format("woff2");}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/inter-600.woff2') format("woff2");}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/inter-700.woff2') format("woff2");}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/jetbrains-mono-400.woff2') format("woff2");}

/* 像素 RPG 主题专用像素字体（最像素 / Zpix，原创位图风，覆盖中文 + 数字 + 拉丁）。
   自托管以支持离线 / 国内网络；文件缺失时浏览器自动回退到 JetBrains Mono（数字/等级）
   与系统清晰字体（中文标题），不破版。放入 assets/fonts/zpix.woff2 即生效。 */
@font-face{font-family:"Zpix";font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/zpix.woff2') format("woff2");}
@font-face{font-family:"Zpix";font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/zpix.woff2') format("woff2");}

/* ===== assets/vendor/fontawesome/css/all.min.css ===== */
/*!
 * Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 * Copyright 2023 Fonticons, Inc.
 */
.fa{font-family:var(--fa-style-family,"Font Awesome 6 Free");font-weight:var(--fa-style,900)}
.fa,.fa-brands,.fa-classic,.fa-regular,.fa-sharp,.fa-solid,.fab,.far,.fas{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:var(--fa-display,inline-block);font-style:normal;font-variant:normal;line-height:1;text-rendering:auto}
.fa-classic,.fa-regular,.fa-solid,.far,.fas{font-family:"Font Awesome 6 Free"}
.fa-brands,.fab{font-family:"Font Awesome 6 Brands"}
.fa-1x{font-size:1em}
.fa-2x{font-size:2em}
.fa-3x{font-size:3em}
.fa-4x{font-size:4em}
.fa-5x{font-size:5em}
.fa-6x{font-size:6em}
.fa-7x{font-size:7em}
.fa-8x{font-size:8em}
.fa-9x{font-size:9em}
.fa-10x{font-size:10em}
.fa-2xs{font-size:.625em;line-height:.1em;vertical-align:.225em}
.fa-xs{font-size:.75em;line-height:.08333em;vertical-align:.125em}
.fa-sm{font-size:.875em;line-height:.07143em;vertical-align:.05357em}
.fa-lg{font-size:1.25em;line-height:.05em;vertical-align:-.075em}
.fa-xl{font-size:1.5em;line-height:.04167em;vertical-align:-.125em}
.fa-2xl{font-size:2em;line-height:.03125em;vertical-align:-.1875em}
.fa-fw{text-align:center;width:1.25em}
.fa-ul{list-style-type:none;margin-left:var(--fa-li-margin,2.5em);padding-left:0}
.fa-ul>li{position:relative}
.fa-li{left:calc(var(--fa-li-width, 2em)*-1);position:absolute;text-align:center;width:var(--fa-li-width,2em);line-height:inherit}
.fa-border{border-radius:var(--fa-border-radius,.1em);border:var(--fa-border-width,.08em) var(--fa-border-style,solid) var(--fa-border-color,#eee);padding:var(--fa-border-padding,.2em .25em .15em)}
.fa-pull-left{float:left;margin-right:var(--fa-pull-margin,.3em)}
.fa-pull-right{float:right;margin-left:var(--fa-pull-margin,.3em)}
.fa-beat{-webkit-animation-name:fa-beat;animation-name:fa-beat;-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,ease-in-out);animation-timing-function:var(--fa-animation-timing,ease-in-out)}
.fa-bounce{-webkit-animation-name:fa-bounce;animation-name:fa-bounce;-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,cubic-bezier(.28,.84,.42,1));animation-timing-function:var(--fa-animation-timing,cubic-bezier(.28,.84,.42,1))}
.fa-fade{-webkit-animation-name:fa-fade;animation-name:fa-fade;-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1));animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1))}
.fa-beat-fade,.fa-fade{-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s)}
.fa-beat-fade{-webkit-animation-name:fa-beat-fade;animation-name:fa-beat-fade;-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1));animation-timing-function:var(--fa-animation-timing,cubic-bezier(.4,0,.6,1))}
.fa-flip{-webkit-animation-name:fa-flip;animation-name:fa-flip;-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,ease-in-out);animation-timing-function:var(--fa-animation-timing,ease-in-out)}
.fa-shake{-webkit-animation-name:fa-shake;animation-name:fa-shake;-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,linear);animation-timing-function:var(--fa-animation-timing,linear)}
.fa-shake,.fa-spin{-webkit-animation-delay:var(--fa-animation-delay,0s);animation-delay:var(--fa-animation-delay,0s);-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal)}
.fa-spin{-webkit-animation-name:fa-spin;animation-name:fa-spin;-webkit-animation-duration:var(--fa-animation-duration,2s);animation-duration:var(--fa-animation-duration,2s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,linear);animation-timing-function:var(--fa-animation-timing,linear)}
.fa-spin-reverse{--fa-animation-direction:reverse}
.fa-pulse,.fa-spin-pulse{-webkit-animation-name:fa-spin;animation-name:fa-spin;-webkit-animation-direction:var(--fa-animation-direction,normal);animation-direction:var(--fa-animation-direction,normal);-webkit-animation-duration:var(--fa-animation-duration,1s);animation-duration:var(--fa-animation-duration,1s);-webkit-animation-iteration-count:var(--fa-animation-iteration-count,infinite);animation-iteration-count:var(--fa-animation-iteration-count,infinite);-webkit-animation-timing-function:var(--fa-animation-timing,steps(8));animation-timing-function:var(--fa-animation-timing,steps(8))}
@media (prefers-reduced-motion:reduce){.fa-beat,.fa-beat-fade,.fa-bounce,.fa-fade,.fa-flip,.fa-pulse,.fa-shake,.fa-spin,.fa-spin-pulse{-webkit-animation-delay:-1ms;animation-delay:-1ms;-webkit-animation-duration:1ms;animation-duration:1ms;-webkit-animation-iteration-count:1;animation-iteration-count:1;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s}}
@-webkit-keyframes fa-beat{0%,90%{-webkit-transform:scale(1);transform:scale(1)}45%{-webkit-transform:scale(var(--fa-beat-scale,1.25));transform:scale(var(--fa-beat-scale,1.25))}}
@keyframes fa-beat{0%,90%{-webkit-transform:scale(1);transform:scale(1)}45%{-webkit-transform:scale(var(--fa-beat-scale,1.25));transform:scale(var(--fa-beat-scale,1.25))}}
@-webkit-keyframes fa-bounce{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}10%{-webkit-transform:scale(var(--fa-bounce-start-scale-x,1.1),var(--fa-bounce-start-scale-y,.9)) translateY(0);transform:scale(var(--fa-bounce-start-scale-x,1.1),var(--fa-bounce-start-scale-y,.9)) translateY(0)}30%{-webkit-transform:scale(var(--fa-bounce-jump-scale-x,.9),var(--fa-bounce-jump-scale-y,1.1)) translateY(var(--fa-bounce-height,-.5em));transform:scale(var(--fa-bounce-jump-scale-x,.9),var(--fa-bounce-jump-scale-y,1.1)) translateY(var(--fa-bounce-height,-.5em))}50%{-webkit-transform:scale(var(--fa-bounce-land-scale-x,1.05),var(--fa-bounce-land-scale-y,.95)) translateY(0);transform:scale(var(--fa-bounce-land-scale-x,1.05),var(--fa-bounce-land-scale-y,.95)) translateY(0)}57%{-webkit-transform:scale(1) translateY(var(--fa-bounce-rebound,-.125em));transform:scale(1) translateY(var(--fa-bounce-rebound,-.125em))}64%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}to{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}}
@keyframes fa-bounce{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}10%{-webkit-transform:scale(var(--fa-bounce-start-scale-x,1.1),var(--fa-bounce-start-scale-y,.9)) translateY(0);transform:scale(var(--fa-bounce-start-scale-x,1.1),var(--fa-bounce-start-scale-y,.9)) translateY(0)}30%{-webkit-transform:scale(var(--fa-bounce-jump-scale-x,.9),var(--fa-bounce-jump-scale-y,1.1)) translateY(var(--fa-bounce-height,-.5em));transform:scale(var(--fa-bounce-jump-scale-x,.9),var(--fa-bounce-jump-scale-y,1.1)) translateY(var(--fa-bounce-height,-.5em))}50%{-webkit-transform:scale(var(--fa-bounce-land-scale-x,1.05),var(--fa-bounce-land-scale-y,.95)) translateY(0);transform:scale(var(--fa-bounce-land-scale-x,1.05),var(--fa-bounce-land-scale-y,.95)) translateY(0)}57%{-webkit-transform:scale(1) translateY(var(--fa-bounce-rebound,-.125em));transform:scale(1) translateY(var(--fa-bounce-rebound,-.125em))}64%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}to{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}}
@-webkit-keyframes fa-fade{50%{opacity:var(--fa-fade-opacity,.4)}}
@keyframes fa-fade{50%{opacity:var(--fa-fade-opacity,.4)}}
@-webkit-keyframes fa-beat-fade{0%,to{opacity:var(--fa-beat-fade-opacity,.4);-webkit-transform:scale(1);transform:scale(1)}50%{opacity:1;-webkit-transform:scale(var(--fa-beat-fade-scale,1.125));transform:scale(var(--fa-beat-fade-scale,1.125))}}
@keyframes fa-beat-fade{0%,to{opacity:var(--fa-beat-fade-opacity,.4);-webkit-transform:scale(1);transform:scale(1)}50%{opacity:1;-webkit-transform:scale(var(--fa-beat-fade-scale,1.125));transform:scale(var(--fa-beat-fade-scale,1.125))}}
@-webkit-keyframes fa-flip{50%{-webkit-transform:rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg));transform:rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg))}}
@keyframes fa-flip{50%{-webkit-transform:rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg));transform:rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg))}}
@-webkit-keyframes fa-shake{0%{-webkit-transform:rotate(-15deg);transform:rotate(-15deg)}4%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}8%,24%{-webkit-transform:rotate(-18deg);transform:rotate(-18deg)}12%,28%{-webkit-transform:rotate(18deg);transform:rotate(18deg)}16%{-webkit-transform:rotate(-22deg);transform:rotate(-22deg)}20%{-webkit-transform:rotate(22deg);transform:rotate(22deg)}32%{-webkit-transform:rotate(-12deg);transform:rotate(-12deg)}36%{-webkit-transform:rotate(12deg);transform:rotate(12deg)}40%,to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}
@keyframes fa-shake{0%{-webkit-transform:rotate(-15deg);transform:rotate(-15deg)}4%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}8%,24%{-webkit-transform:rotate(-18deg);transform:rotate(-18deg)}12%,28%{-webkit-transform:rotate(18deg);transform:rotate(18deg)}16%{-webkit-transform:rotate(-22deg);transform:rotate(-22deg)}20%{-webkit-transform:rotate(22deg);transform:rotate(22deg)}32%{-webkit-transform:rotate(-12deg);transform:rotate(-12deg)}36%{-webkit-transform:rotate(12deg);transform:rotate(12deg)}40%,to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}
@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
.fa-rotate-90{-webkit-transform:rotate(90deg);transform:rotate(90deg)}
.fa-rotate-180{-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.fa-rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg)}
.fa-flip-horizontal{-webkit-transform:scaleX(-1);transform:scaleX(-1)}
.fa-flip-vertical{-webkit-transform:scaleY(-1);transform:scaleY(-1)}
.fa-flip-both,.fa-flip-horizontal.fa-flip-vertical{-webkit-transform:scale(-1);transform:scale(-1)}
.fa-rotate-by{-webkit-transform:rotate(var(--fa-rotate-angle,none));transform:rotate(var(--fa-rotate-angle,none))}
.fa-stack{display:inline-block;height:2em;line-height:2em;position:relative;vertical-align:middle;width:2.5em}
.fa-stack-1x,.fa-stack-2x{left:0;position:absolute;text-align:center;width:100%;z-index:var(--fa-stack-z-index,auto)}
.fa-stack-1x{line-height:inherit}
.fa-stack-2x{font-size:2em}
.fa-inverse{color:var(--fa-inverse,#fff)}
.fa-trash-alt:before,.fa-trash-can:before{content:"\f2ed"}
.fa-calendar-alt:before,.fa-calendar-days:before{content:"\f073"}
.fa-caret-right:before{content:"\f0da"}
.fa-archive:before,.fa-box-archive:before{content:"\f187"}
.fa-cloud:before{content:"\f0c2"}
.fa-bars:before,.fa-navicon:before{content:"\f0c9"}
.fa-lightbulb:before{content:"\f0eb"}
.fa-caret-left:before{content:"\f0d9"}
.fa-circle-exclamation:before,.fa-exclamation-circle:before{content:"\f06a"}
.fa-cloud-showers-heavy:before{content:"\f740"}
.fa-compress:before{content:"\f066"}
.fa-gamepad:before{content:"\f11b"}
.fa-lock:before{content:"\f023"}
.fa-edit:before,.fa-pen-to-square:before{content:"\f044"}
.fa-hourglass-2:before,.fa-hourglass-half:before{content:"\f252"}
.fa-eye-slash:before{content:"\f070"}
.fa-chevron-up:before{content:"\f077"}
.fa-stopwatch:before{content:"\f2f2"}
.fa-bookmark:before{content:"\f02e"}
.fa-bullseye:before{content:"\f140"}
.fa-folder-blank:before,.fa-folder:before{content:"\f07b"}
.fa-chart-simple:before{content:"\e473"}
.fa-key:before{content:"\f084"}
.fa-star:before{content:"\f005"}
.fa-microchip:before{content:"\f2db"}
.fa-crown:before{content:"\f521"}
.fa-fire:before{content:"\f06d"}
.fa-image:before{content:"\f03e"}
.fa-caret-up:before{content:"\f0d8"}
.fa-angle-double-right:before,.fa-angles-right:before{content:"\f101"}
.fa-check-circle:before,.fa-circle-check:before{content:"\f058"}
.fa-arrow-right-to-file:before,.fa-file-import:before{content:"\f56f"}
.fa-pause:before{content:"\f04c"}
.fa-smog:before{content:"\f75f"}
.fa-cloud-arrow-up:before,.fa-cloud-upload-alt:before,.fa-cloud-upload:before{content:"\f0ee"}
.fa-palette:before{content:"\f53f"}
.fa-seedling:before,.fa-sprout:before{content:"\f4d8"}
.fa-cloud-arrow-down:before,.fa-cloud-download-alt:before,.fa-cloud-download:before{content:"\f0ed"}
.fa-arrows-rotate:before,.fa-refresh:before,.fa-sync:before{content:"\f021"}
.fa-shield-alt:before,.fa-shield-halved:before{content:"\f3ed"}
.fa-layer-group:before{content:"\f5fd"}
.fa-snowflake:before{content:"\f2dc"}
.fa-chart-pie:before,.fa-pie-chart:before{content:"\f200"}
.fa-chart-line:before,.fa-line-chart:before{content:"\f201"}
.fa-heart:before{content:"\f004"}
.fa-cube:before{content:"\f1b2"}
.fa-volume-high:before,.fa-volume-up:before{content:"\f028"}
.fa-eye:before{content:"\f06e"}
.fa-pen:before{content:"\f304"}
.fa-signal-5:before,.fa-signal-perfect:before,.fa-signal:before{content:"\f012"}
.fa-floppy-disk:before,.fa-save:before{content:"\f0c7"}
.fa-arrow-right-rotate:before,.fa-arrow-rotate-forward:before,.fa-arrow-rotate-right:before,.fa-redo:before{content:"\f01e"}
.fa-trash:before{content:"\f1f8"}
.fa-arrow-left:before{content:"\f060"}
.fa-external-link-alt:before,.fa-up-right-from-square:before{content:"\f35d"}
.fa-tag:before{content:"\f02b"}
.fa-birthday-cake:before,.fa-cake-candles:before,.fa-cake:before{content:"\f1fd"}
.fa-envelope:before{content:"\f0e0"}
.fa-calendar-check:before{content:"\f274"}
.fa-arrow-left-rotate:before,.fa-arrow-rotate-back:before,.fa-arrow-rotate-backward:before,.fa-arrow-rotate-left:before,.fa-undo:before{content:"\f0e2"}
.fa-calendar-plus:before{content:"\f271"}
.fa-cog:before,.fa-gear:before{content:"\f013"}
.fa-clock-four:before,.fa-clock:before{content:"\f017"}
.fa-caret-down:before{content:"\f0d7"}
.fa-ellipsis-v:before,.fa-ellipsis-vertical:before{content:"\f142"}
.fa-cloud-rain:before{content:"\f73d"}
.fa-download:before{content:"\f019"}
.fa-calendar-week:before{content:"\f784"}
.fa-stop:before{content:"\f04d"}
.fa-upload:before{content:"\f093"}
.fa-bolt:before,.fa-zap:before{content:"\f0e7"}
.fa-sun:before{content:"\f185"}
.fa-medal:before{content:"\f5a2"}
.fa-bell:before{content:"\f0f3"}
.fa-location-dot:before,.fa-map-marker-alt:before{content:"\f3c5"}
.fa-arrow-down:before{content:"\f063"}
.fa-droplet:before,.fa-tint:before{content:"\f043"}
.fa-inbox:before{content:"\f01c"}
.fa-envelope-open-text:before{content:"\f658"}
.fa-chain:before,.fa-link:before{content:"\f0c1"}
.fa-play:before{content:"\f04b"}
.fa-magnifying-glass:before,.fa-search:before{content:"\f002"}
.fa-chevron-down:before{content:"\f078"}
.fa-ranking-star:before{content:"\e561"}
.fa-arrow-up:before{content:"\f062"}
.fa-list-check:before,.fa-tasks:before{content:"\f0ae"}
.fa-copy:before{content:"\f0c5"}
.fa-volume-mute:before,.fa-volume-times:before,.fa-volume-xmark:before{content:"\f6a9"}
.fa-add:before,.fa-plus:before{content:"\2b"}
.fa-expand:before{content:"\f065"}
.fa-close:before,.fa-multiply:before,.fa-remove:before,.fa-times:before,.fa-xmark:before{content:"\f00d"}
.fa-chevron-left:before{content:"\f053"}
.fa-chevron-right:before{content:"\f054"}
.fa-face-smile:before,.fa-smile:before{content:"\f118"}
.fa-trophy:before{content:"\f091"}
.fa-rotate:before,.fa-sync-alt:before{content:"\f2f1"}
.fa-spinner:before{content:"\f110"}
.fa-award:before{content:"\f559"}
.fa-angle-double-left:before,.fa-angles-left:before{content:"\f100"}
.fa-clock-rotate-left:before,.fa-history:before{content:"\f1da"}
.fa-moon:before{content:"\f186"}
.fa-calendar:before{content:"\f133"}
.fa-book:before{content:"\f02d"}
.fa-check:before{content:"\f00c"}
.fa-briefcase:before{content:"\f0b1"}
.fa-book-open:before{content:"\f518"}
.fa-exclamation-triangle:before,.fa-triangle-exclamation:before,.fa-warning:before{content:"\f071"}
.fa-paper-plane:before{content:"\f1d8"}
.fa-calendar-day:before{content:"\f783"}
.fa-brain:before{content:"\f5dc"}
.fa-circle-xmark:before,.fa-times-circle:before,.fa-xmark-circle:before{content:"\f057"}
.fa-cloud-sun:before{content:"\f6c4"}
.fa-graduation-cap:before,.fa-mortar-board:before{content:"\f19d"}
.fa-sr-only,.fa-sr-only-focusable:not(:focus),.sr-only,.sr-only-focusable:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
:host,:root{--fa-style-family-brands:"Font Awesome 6 Brands";--fa-font-brands:normal 400 1em/1 "Font Awesome 6 Brands"}
@font-face{font-family:"Font Awesome 6 Brands";font-style:normal;font-weight:400;font-display:swap;src:url('/assets/vendor/fontawesome/webfonts/fa-brands-400.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-brands-400.ttf') format("truetype")}
.fa-brands,.fab{font-weight:400}
:host,:root{--fa-font-regular:normal 400 1em/1 "Font Awesome 6 Free"}
@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:400;font-display:swap;src:url('/assets/vendor/fontawesome/webfonts/fa-regular-400.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-regular-400.ttf') format("truetype")}
.fa-regular,.far{font-weight:400}
:host,:root{--fa-style-family-classic:"Font Awesome 6 Free";--fa-font-solid:normal 900 1em/1 "Font Awesome 6 Free"}
@font-face{font-family:"Font Awesome 6 Free";font-style:normal;font-weight:900;font-display:swap;src:url('/assets/vendor/fontawesome/webfonts/fa-solid-900.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-solid-900.ttf') format("truetype")}
.fa-solid,.fas{font-weight:900}
@font-face{font-family:"Font Awesome 5 Brands";font-display:swap;font-weight:400;src:url('/assets/vendor/fontawesome/webfonts/fa-brands-400.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-brands-400.ttf') format("truetype")}
@font-face{font-family:"Font Awesome 5 Free";font-display:swap;font-weight:900;src:url('/assets/vendor/fontawesome/webfonts/fa-solid-900.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-solid-900.ttf') format("truetype")}
@font-face{font-family:"Font Awesome 5 Free";font-display:swap;font-weight:400;src:url('/assets/vendor/fontawesome/webfonts/fa-regular-400.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-regular-400.ttf') format("truetype")}
@font-face{font-family:"FontAwesome";font-display:swap;src:url('/assets/vendor/fontawesome/webfonts/fa-solid-900.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-solid-900.ttf') format("truetype")}
@font-face{font-family:"FontAwesome";font-display:swap;src:url('/assets/vendor/fontawesome/webfonts/fa-brands-400.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-brands-400.ttf') format("truetype")}
@font-face{font-family:"FontAwesome";font-display:swap;src:url('/assets/vendor/fontawesome/webfonts/fa-regular-400.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-regular-400.ttf') format("truetype");unicode-range:u+f003,u+f006,u+f014,u+f016-f017,u+f01a-f01b,u+f01d,u+f022,u+f03e,u+f044,u+f046,u+f05c-f05d,u+f06e,u+f070,u+f087-f088,u+f08a,u+f094,u+f096-f097,u+f09d,u+f0a0,u+f0a2,u+f0a4-f0a7,u+f0c5,u+f0c7,u+f0e5-f0e6,u+f0eb,u+f0f6-f0f8,u+f10c,u+f114-f115,u+f118-f11a,u+f11c-f11d,u+f133,u+f147,u+f14e,u+f150-f152,u+f185-f186,u+f18e,u+f190-f192,u+f196,u+f1c1-f1c9,u+f1d9,u+f1db,u+f1e3,u+f1ea,u+f1f7,u+f1f9,u+f20a,u+f247-f248,u+f24a,u+f24d,u+f255-f25b,u+f25d,u+f271-f274,u+f278,u+f27b,u+f28c,u+f28e,u+f29c,u+f2b5,u+f2b7,u+f2ba,u+f2bc,u+f2be,u+f2c0-f2c1,u+f2c3,u+f2d0,u+f2d2,u+f2d4,u+f2dc}
@font-face{font-family:"FontAwesome";font-display:swap;src:url('/assets/vendor/fontawesome/webfonts/fa-v4compatibility.woff2') format("woff2"),url('/assets/vendor/fontawesome/webfonts/fa-v4compatibility.ttf') format("truetype");unicode-range:u+f041,u+f047,u+f065-f066,u+f07d-f07e,u+f080,u+f08b,u+f08e,u+f090,u+f09a,u+f0ac,u+f0ae,u+f0b2,u+f0d0,u+f0d6,u+f0e4,u+f0ec,u+f10a-f10b,u+f123,u+f13e,u+f148-f149,u+f14c,u+f156,u+f15e,u+f160-f161,u+f163,u+f175-f178,u+f195,u+f1f8,u+f219,u+f27a}

/* ===== css/variables.css ===== */
/* =====================================================================
   Flow OS · Design Tokens — "Linear Canvas"
   ---------------------------------------------------------------------
   设计语言：严格遵循 Linear DESIGN.md 规范。
   · 近黑画布（near-black canvas）#010102 作为系统锚点（带极淡蓝调）。
   · 单一「品牌强调色」薰衣草蓝（lavender-blue）#5e6ad2，
     仅用于：品牌标 / 主操作 CTA / 焦点环 / 链接与激活强调。
   · 四级表面阶梯（surface-1 → surface-4）承载层级，无投影。
   · 发丝边框（hairline）从 #23252a 至 #3e3e44。
   · 浅灰文字（ink）#f7f8f8 承载标题与正文。
   · 字体：Inter（Linear Display / Text 的开源替代），等宽用 JetBrains Mono。
   · 扁平表面 + 发丝边框，近乎无阴影；零环境渐变、零聚光卡片、零第二彩色。
   · 深色为唯一主题（DESIGN.md：不提供浅色营销页）。
   ===================================================================== */
:root,
.dark {
  --sidebar-w: 244px;

  /* ---------- 字体 ---------- */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
               "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Roboto, sans-serif;
  --font-display: var(--font-sans);
  --font-mono: "JetBrains Mono", "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* ---------- 间距系统（4px 基础单位，对齐 DESIGN.md） ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-section: 96px;

  /* ---------- 控件高度 ---------- */
  --ctrl-h: 40px;
  --ctrl-h-sm: 32px;
  --ctrl-h-lg: 44px;

  /* ---------- 画布 / 表面阶梯（深炭灰蓝 + 4-step ladder；2026-08-23 调亮：手机 OLED 全黑刺眼） ---------- */
  --bg: #0e1013;                   /* canvas：深炭灰蓝画布（原 #010102 近黑过暗，手机端调亮） */
  --surface: #171a1f;              /* surface-1：卡片 / 面板 */
  --surface-2: #1e2228;            /* surface-2：次级表面 / 输入框 */
  --surface-3: #242931;            /* surface-3：凹陷 / hover */
  --surface-4: #272c34;            /* surface-4：最浅抬升表面 */

  /* ---------- 发丝边框（hairline ladder） ---------- */
  --border: #2d323a;               /* hairline */
  --border-strong: #3d434d;        /* hairline-strong */
  --border-tertiary: #4a515c;      /* hairline-tertiary */
  --hairline: var(--border);

  /* ---------- 文字（ink ladder） ---------- */
  --text-primary: #f7f8f8;         /* ink */
  --text-secondary: #d0d6e0;       /* ink-muted */
  --text-muted: #8a8f98;           /* ink-subtle */
  --text-tertiary: #62666d;        /* ink-tertiary */

  /* ---------- 主操作 / 品牌强调：薰衣草蓝（lavender-blue） ---------- */
  --primary: #5e6ad2;              /* 主 CTA 背景 */
  --primary-hover: #828fff;
  --primary-press: #5e69d1;
  --primary-weak: rgba(94, 106, 210, 0.10);
  --primary-press-tint: rgba(94, 106, 210, 0.16);
  --on-primary: #ffffff;           /* 主 CTA / 激活态文字 */

  --accent: #5e6ad2;               /* 品牌 / 焦点 / 激活强调 */
  --accent-hover: #828fff;
  --accent-weak: rgba(94, 106, 210, 0.12);
  --accent-press: rgba(94, 106, 210, 0.18);
  --accent-glow: rgba(94, 106, 210, 0.32);
  --accent-strong: #828fff;
  --accent-ink: #aeb4f5;           /* 激活态浅薰衣草文字（深底可读） */
  --accent-tint: rgba(94, 106, 210, 0.08);
  --primary-glow: var(--accent-glow);
  --primary-glow-strong: rgba(94, 106, 210, 0.40);

  /* ---------- 语义 / 分类色（产品内标签，去饱和、与冷调协调） ---------- */
  --success: #27a644;              /* 完成 / 成功（DESIGN.md semantic-success） */
  --success-weak: rgba(39, 166, 68, 0.14);
  --success-press: rgba(39, 166, 68, 0.20);

  --warning: #d9a23b;             /* 提醒 / 星级（柔和琥珀） */
  --warning-weak: rgba(217, 162, 59, 0.14);

  --danger: #e5484d;              /* 删除 / 危险（正红，适配深底） */
  --danger-weak: rgba(229, 72, 77, 0.14);
  --danger-press: rgba(229, 72, 77, 0.20);

  --violet: #8b7ff0;              /* 计划 / 收集（雾靛） */
  --violet-weak: rgba(139, 127, 240, 0.14);

  --pink: #d45b86;                /* 日记（雾玫） */
  --pink-weak: rgba(212, 91, 134, 0.14);

  /* ---------- 圆角尺度（对齐 DESIGN.md：xs4 / sm6 / md8 / lg12 / xl16 / xxl24 / pill） ---------- */
  --radius-xl: 16px;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-xs: 6px;
  --radius-2xs: 4px;
  --radius-pill: 9999px;

  /* ---------- 阴影（克制：深底近乎无投影；仅浮层使用单层） ---------- */
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.65);   /* 模态 / 抽屉浮层 */
  --shadow-focus: 0 0 0 3px rgba(94, 105, 209, 0.50); /* 焦点环：primary-focus 50% */
  --shadow-lift: none;
  --shadow-lift-strong: none;

  /* ---------- 缓动曲线 ---------- */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);

  /* ---------- 海拔（扁平为主，浮层略抬） ---------- */
  --elevation-1: none;
  --elevation-2: none;
  --elevation-3: var(--shadow-lg);

  /* ---------- 字号阶梯 ---------- */
  --fs-1: 12px;  --fs-2: 13px;  --fs-3: 14px;  --fs-4: 16px;
  --fs-5: 20px;  --fs-6: 24px;  --fs-7: 32px;
  --fs-heading-track: -0.02em;

  /* ---------- 保留别名以兼容既有引用（统一映射为深底实心表面） ---------- */
  --glass-bg: var(--surface);
  --glass-border: var(--border);
  --glass-shadow: none;
  --blur: none;
}

/* =====================================================================
   Flow OS · Light Theme — "Paper Canvas"
   ---------------------------------------------------------------------
   浅色模式：以近白纸面 + 发丝边框还原 Linear Canvas 语言。
   品牌强调色保持薰衣草蓝；文字 / 边框 / 语义色在白底上按 WCAG 调整对比度。
   本块刻意置于 `:root, .dark` 之后：`.light` 与 `:root` 特异度相同，
   源码靠后者胜出，故移除 .dark 进入浅色时本组令牌生效，深色模式不受影响。
   ===================================================================== */
.light {
  color-scheme: light;

  /* ---------- 画布 / 表面阶梯（近白纸面 + 4-step ladder） ---------- */
  --bg: #f4f5f7;
  --surface: #ffffff;
  --surface-2: #f1f2f5;
  --surface-3: #e9ebef;
  --surface-4: #fafbfc;

  /* ---------- 发丝边框（hairline ladder） ---------- */
  --border: #e4e6ea;
  --border-strong: #d3d6dc;
  --border-tertiary: #c2c6ce;
  --hairline: var(--border);

  /* ---------- 文字（ink ladder） ---------- */
  --text-primary: #1a1b1e;
  --text-secondary: #3c4046;
  --text-muted: #6b7280;
  --text-tertiary: #9aa0a8;

  /* ---------- 主操作 / 品牌强调：薰衣草蓝（保持品牌） ---------- */
  --primary: #5e6ad2;
  --primary-hover: #4f5ac6;   /* 浅底白字：hover 略深以保证对比 */
  --primary-press: #4a54ba;
  --primary-weak: rgba(94, 106, 210, 0.08);
  --primary-press-tint: rgba(94, 106, 210, 0.14);
  --on-primary: #ffffff;

  --accent: #5e6ad2;
  --accent-hover: #6e78e6;
  --accent-weak: rgba(94, 106, 210, 0.10);
  --accent-press: rgba(94, 106, 210, 0.16);
  --accent-glow: rgba(94, 106, 210, 0.22);
  --accent-strong: #4f5ac6;
  --accent-ink: #3f43a8;       /* 浅底可读的深薰衣草（激活态文字） */
  --accent-tint: rgba(94, 106, 210, 0.06);
  --primary-glow: var(--accent-glow);
  --primary-glow-strong: rgba(94, 106, 210, 0.30);

  /* ---------- 语义 / 分类色（浅底更深的去饱和色，保证对比） ---------- */
  --success: #1f9d4e;
  --success-weak: rgba(31, 157, 78, 0.12);
  --success-press: rgba(31, 157, 78, 0.18);

  --warning: #b07d1a;
  --warning-weak: rgba(176, 125, 26, 0.14);

  --danger: #d23b40;
  --danger-weak: rgba(210, 59, 64, 0.12);
  --danger-press: rgba(210, 59, 64, 0.18);

  --violet: #6b5fd6;
  --violet-weak: rgba(107, 95, 214, 0.12);

  --pink: #c44d80;
  --pink-weak: rgba(196, 77, 128, 0.12);

  /* ---------- 阴影（浅底：克制但可见的抬升） ---------- */
  --shadow-sm: 0 1px 2px rgba(16, 17, 20, 0.06);
  --shadow-md: 0 6px 18px rgba(16, 17, 20, 0.10);
  --shadow-lg: 0 24px 64px rgba(16, 17, 20, 0.18);
  --shadow-focus: 0 0 0 3px rgba(94, 105, 209, 0.35);
  --shadow-lift: 0 8px 24px rgba(16, 17, 20, 0.12);
  --shadow-lift-strong: 0 16px 40px rgba(16, 17, 20, 0.18);

  /* ---------- 海拔 ---------- */
  --elevation-1: 0 1px 2px rgba(16, 17, 20, 0.05);
  --elevation-2: 0 4px 12px rgba(16, 17, 20, 0.08);
  --elevation-3: var(--shadow-lg);

  /* ---------- 保留别名 ---------- */
  --glass-bg: var(--surface);
  --glass-border: var(--border);
  --glass-shadow: var(--shadow-md);
  --blur: none;
}


/* =====================================================================
   FlowOS · Pixel RPG Theme — "Night Quest"（16-bit RPG / GBA HUD）
   ---------------------------------------------------------------------
   像素 RPG 视觉皮肤：深蓝夜色游戏 UI + 宝可梦伙伴 + Quest 任务隐喻。
   · 背景 = 深蓝 / 蓝灰 / 深蓝紫（夜空营地）。
   · 面板 = 亮一级深蓝，多层像素描边（浅色内高光 + 深色外框）。
   · 主强调 = 草绿 / 青绿；EXP = 黄；重要 = 红；文字 = 奶油 / 浅灰。
   · 低饱和、统一、复古。无大渐变、无玻璃、无大圆角。
   · 复用 .light 组件覆盖（html 同时挂 light + pixel 两个类）。
   ===================================================================== */
.pixel {
  color-scheme: dark;

  /* ---------- 像素墨线 / 轮廓 ----------
     暗底上使用奶油/钢蓝浅色描边，像 GBA 暗色菜单的亮边 */
  --pixel-ink: #C8D2E0;
  --pixel-ink-soft: #8DA0B8;
  --pixel-ink-light: rgba(255, 255, 255, 0.12);
  --pixel-ink-dark: #1A2F4F;

  /* ---------- 材质色板（深蓝夜色营地） ---------- */
  --pixel-parchment: #1A2F4F;
  --pixel-parchment-shadow: #0F1B33;
  --pixel-parchment-highlight: #243B5E;
  --pixel-wood: #6B4E36;
  --pixel-wood-light: #8B6A4A;
  --pixel-wood-dark: #4A3626;
  --pixel-panel: #1F3A6E;
  --pixel-panel-light: #2A4F8A;
  --pixel-panel-dark: #162B52;
  --pixel-wood: #6B4E36;
  --pixel-wood-light: #8B6A4A;
  --pixel-wood-dark: #4A3626;
  --pixel-grass: #5EC269;
  --pixel-grass-light: #7ED589;
  --pixel-grass-dark: #3E9A55;
  --pixel-sky: #5ABCD6;
  --pixel-sky-light: #7ED0E8;
  --pixel-sky-dark: #3E8BA0;
  --pixel-gold: #E8C84C;
  --pixel-gold-light: #F5D96E;
  --pixel-gold-dark: #BFA030;
  --pixel-red: #E85A4F;

  /* ---------- 字体 ----------
     中文正文保持清晰系统字体；数字/等级/计时器在有 Zpix 时像素化 */
  --font-mono: "Zpix", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-display: "Zpix", var(--font-sans);

  /* ---------- 画布 / 表面阶梯 ----------
     背景：深蓝夜空；面板：亮一级深蓝 */
  --bg: #0C1729;
  --surface: #1A2F4F;
  --surface-2: #243B5E;
  --surface-3: #162744;
  --surface-4: #2D4A70;

  /* ---------- 描边 ---------- */
  --border: #3E5A7E;
  --border-strong: #C8D2E0;
  --border-tertiary: #5A7898;
  --hairline: #2A4566;

  /* ---------- 文字 ---------- */
  --text-primary: #F5F1D8;
  --text-secondary: #C8D2E0;
  --text-muted: #7E96B0;
  --text-tertiary: #5A7898;

  /* ---------- 主操作：草绿 / 青绿 ---------- */
  --primary: #5EC269;
  --primary-hover: #7ED589;
  --primary-press: #3E9A55;
  --primary-weak: rgba(94, 194, 105, 0.18);
  --primary-press-tint: rgba(94, 194, 105, 0.24);
  --primary-glow: rgba(94, 194, 105, 0.30);
  --primary-glow-strong: rgba(94, 194, 105, 0.42);
  --on-primary: #0C1729;

  /* ---------- 强调 / 激活：EXP 金色 ---------- */
  --accent: #E8C84C;
  --accent-hover: #F5D96E;
  --accent-weak: rgba(232, 200, 76, 0.18);
  --accent-press: rgba(232, 200, 76, 0.24);
  --accent-glow: rgba(232, 200, 76, 0.35);
  --accent-strong: #BFA030;
  --accent-ink: #0C1729;
  --accent-tint: rgba(232, 200, 76, 0.12);

  /* ---------- 语义 / 分类色 ---------- */
  --success: #5EC269;
  --success-weak: rgba(94, 194, 105, 0.18);
  --success-press: rgba(94, 194, 105, 0.24);
  --warning: #E8A23F;
  --warning-weak: rgba(232, 162, 63, 0.18);
  --danger: #E85A4F;
  --danger-weak: rgba(232, 90, 79, 0.16);
  --danger-press: rgba(232, 90, 79, 0.22);
  --violet: #8A7BD4;
  --violet-weak: rgba(138, 123, 212, 0.16);
  --pink: #E07FA0;
  --pink-weak: rgba(224, 127, 160, 0.16);

  /* ---------- 阴影：硬边偏移 + 内高光 ---------- */
  --shadow-sm: 2px 2px 0 var(--pixel-ink);
  --shadow-md: 4px 4px 0 var(--pixel-ink);
  --shadow-lg: 6px 6px 0 var(--pixel-ink);
  --shadow-focus: 0 0 0 3px rgba(94, 194, 105, 0.45);
  --shadow-lift: 4px 4px 0 var(--pixel-ink);
  --shadow-lift-strong: 7px 7px 0 var(--pixel-ink);
  --shadow-inset-highlight: inset 2px 2px 0 var(--pixel-ink-light), inset -2px -2px 0 rgba(0, 0, 0, 0.25);
  --shadow-panel: inset 2px 2px 0 rgba(255, 255, 255, 0.10), inset -2px -2px 0 rgba(0, 0, 0, 0.35), 4px 4px 0 var(--pixel-ink);
  --shadow-wood: inset 2px 2px 0 var(--pixel-wood-light), inset -2px -2px 0 var(--pixel-wood-dark), 4px 4px 0 var(--pixel-ink);
  --shadow-parchment: inset 2px 2px 0 var(--pixel-parchment-highlight), inset -2px -2px 0 var(--pixel-parchment-shadow), 4px 4px 0 var(--pixel-ink);

  /* ---------- 海拔 ---------- */
  --elevation-1: 2px 2px 0 var(--pixel-ink);
  --elevation-2: 3px 3px 0 var(--pixel-ink);
  --elevation-3: var(--shadow-lg);

  /* ---------- 圆角：RPG 窗户，0 大圆角 ---------- */
  --radius-sm: 0px;
  --radius: 0px;
  --radius-lg: 2px;
  --radius-xl: 4px;
  --radius-2xs: 0px;
  --radius-xs: 0px;
  --radius-pill: 9999px;

  /* ---------- 玻璃：无玻璃（实心不透明材质） ---------- */
  --glass-bg: var(--surface);
  --glass-border: var(--pixel-ink);
  --glass-shadow: var(--shadow-md);
  --blur: none;
}

/* =====================================================================
   FlowOS · Jelly Theme — "Soft Relief"（凸起软方块 · 果冻质感）
   ---------------------------------------------------------------------
   新拟态（Neumorphism）+ 果冻质感：同色画布与表面，靠「左上柔光 + 右下柔影」
   双阴影把区块从背景顶起来，呈现凸面弧面与柔和阴影。
   · 卡片 / 面板 / 按钮 = 凸起软方块（无硬边框、圆角方块）。
   · 输入框 = 内陷（inset）凹陷，与凸起区块形成对比。
   · 导航图标 = 浮在屏幕上的圆角方块小瓷砖（凸面高光 + 落影）。
   · 复用 .light 组件覆盖（html 同时挂 light + jelly 两个类）。
   ===================================================================== */
.jelly {
  color-scheme: light;

  /* 同色画布与表面（新拟态基石：靠阴影塑形，不靠边框） */
  --bg: #e9edf4;
  --surface: #e9edf4;
  --surface-2: #eef1f7;
  --surface-3: #e1e5ee;
  --surface-4: #eef1f7;

  /* 发丝边框：略加深（保证分隔清晰可见，20260825e 对比调整） */
  --border: rgba(163,170,190,0.48);
  --border-strong: rgba(163,170,190,0.62);
  --border-tertiary: rgba(163,170,190,0.72);
  --hairline: rgba(163,170,190,0.48);

  /* 文字（柔底深墨蓝灰，20260825e 加深次级/弱化文字提升可读性） */
  --text-primary: #1b2330;
  --text-secondary: #2f3747;
  --text-muted: #465062;
  --text-tertiary: #5e687c;

  /* 主操作 / 品牌：保持薰衣草蓝，略加果冻感 */
  --primary: #5e6ad2;
  --primary-hover: #6e78e6;
  --primary-press: #4a54ba;
  --primary-weak: rgba(94,106,210,0.12);
  --primary-press-tint: rgba(94,106,210,0.18);
  --on-primary: #ffffff;

  --accent: #5e6ad2;
  --accent-hover: #6e78e6;
  --accent-weak: rgba(94,106,210,0.12);
  --accent-press: rgba(94,106,210,0.18);
  --accent-glow: rgba(94,106,210,0.30);
  --accent-strong: #4f5ac6;
  --accent-ink: #3f43a8;
  --accent-tint: rgba(94,106,210,0.08);
  --primary-glow: var(--accent-glow);
  --primary-glow-strong: rgba(94,106,210,0.40);

  /* 语义 / 分类色（略加深，保证柔底对比） */
  --success: #1f9d4e;
  --success-weak: rgba(31,157,78,0.14);
  --success-press: rgba(31,157,78,0.20);
  --warning: #b07d1a;
  --warning-weak: rgba(176,125,26,0.14);
  --danger: #d23b40;
  --danger-weak: rgba(210,59,64,0.14);
  --danger-press: rgba(210,59,64,0.20);
  --violet: #6b5fd6;
  --violet-weak: rgba(107,95,214,0.14);
  --pink: #c44d80;
  --pink-weak: rgba(196,77,128,0.14);

  /* 圆角：圆角方块（果冻块） */
  --radius-xl: 22px;
  --radius: 18px;
  --radius-sm: 14px;
  --radius-xs: 12px;
  --radius-2xs: 10px;
  --radius-pill: 9999px;

  /* 阴影：新拟态双阴影（左上柔光 + 右下柔影）+ 0 0 0 1px 发丝描边。
     20260825e 散射光降档：阴影透明度/模糊整体下调（保留 1px 描边立边界），
     消除"灰蒙蒙"扩散感，让对比更清楚。 */
  --jelly-edge: rgba(176,185,212,0.72);
  --neu-out-sm: 2px 2px 5px rgba(150,158,185,0.26), -2px -2px 5px rgba(255,255,255,0.30), 0 0 0 1px var(--jelly-edge);
  --neu-out: 4px 4px 9px rgba(150,158,185,0.30), -4px -4px 9px rgba(255,255,255,0.34), 0 0 0 1px var(--jelly-edge);
  --neu-out-lg: 7px 7px 14px rgba(150,158,185,0.34), -6px -6px 12px rgba(255,255,255,0.38), 0 0 0 1px var(--jelly-edge);
  --neu-in-sm: inset 2px 2px 5px rgba(150,158,185,0.28), inset -2px -2px 5px rgba(255,255,255,0.34);
  --neu-in: inset 3px 3px 8px rgba(150,158,185,0.30), inset -3px -3px 8px rgba(255,255,255,0.36);

  --shadow-sm: 2px 2px 5px rgba(150,158,185,0.26), -2px -2px 5px rgba(255,255,255,0.30), 0 0 0 1px var(--jelly-edge);
  --shadow-md: 4px 4px 9px rgba(150,158,185,0.30), -4px -4px 9px rgba(255,255,255,0.34), 0 0 0 1px var(--jelly-edge);
  --shadow-lg: 8px 8px 16px rgba(150,158,185,0.36), -6px -6px 14px rgba(255,255,255,0.40), 0 0 0 1px var(--jelly-edge);
  --shadow-focus: 0 0 0 3px rgba(94,105,209,0.40);
  --shadow-lift: 5px 5px 10px rgba(150,158,185,0.30), -4px -4px 9px rgba(255,255,255,0.36), 0 0 0 1px var(--jelly-edge);
  --shadow-lift-strong: 9px 9px 16px rgba(150,158,185,0.36), -6px -6px 12px rgba(255,255,255,0.40), 0 0 0 1px var(--jelly-edge);

  /* 海拔 */
  --elevation-1: var(--shadow-sm);
  --elevation-2: var(--shadow-md);
  --elevation-3: var(--shadow-lg);

  /* 玻璃：果冻实心（无玻璃） */
  --glass-bg: var(--surface);
  --glass-border: rgba(160,168,190,0.0);
  --glass-shadow: var(--shadow-md);
  --blur: none;
}


/* ===== css/base.css ===== */
/* =====================================================================
   Flow OS · Base Styles — "Quiet System"
   ===================================================================== */
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }

html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body {
  font-family: var(--font-sans);
  background-color: var(--bg);
  color: var(--text-primary);
  overflow:hidden; height:100vh; height:100dvh; width:100vw;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}
/* 深底为统一画布：无环境渐变、无聚光（遵循 DESIGN.md） */

/* ===== Focus ring（键盘可见焦点 · 朱红信号） ===== */
button:focus-visible, a:focus-visible, .btn:focus-visible, .nav-item:focus-visible,
.lock-btn:focus-visible, .filter-chip:focus-visible,
.task-check:focus-visible, [role="button"]:focus-visible, .color-option:focus-visible,
.form-input:focus-visible, .form-select:focus-visible,
.form-textarea:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: var(--radius-xs);
}

/* ===== 品牌标记（内联 SVG 容器） ===== */
.brand-mark { display:block; width:30px; height:30px; flex-shrink:0; }

/* =====================================================================
   Lock Screen — 浅色简洁主体（保留贝塞尔曲线动态 Logo）
   ---------------------------------------------------------------------
   强制浅色：把浅色令牌作用域限定在 #lockScreen 子树，
   无论应用主题为深/浅，锁屏始终是浅色纸面。
   ===================================================================== */
#lockScreen, #authScreen {
  position:fixed; inset:0; z-index:99999;
  background-color: var(--bg);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  transition: opacity .45s cubic-bezier(0.32,0.72,0,1), visibility .45s var(--ease-out);
}
#lockScreen.hidden, #authScreen.hidden { opacity:0; visibility:hidden; pointer-events:none; }

.lock-card {
  width:90%; max-width:380px; text-align:center;
  background: var(--surface);
  border:1px solid var(--border);
  border-radius: var(--radius-xl);
  padding:48px 34px 34px;
  box-shadow: var(--shadow-lg);
  position:relative; z-index:1;
  animation: lockIn .5s cubic-bezier(0.32,0.72,0,1) both;
}
@keyframes lockIn { from { opacity:0; transform:translateY(16px) scale(.985); } to { opacity:1; transform:translateY(0) scale(1); } }

/* ---- 贝塞尔曲线 Logo（悬浮呼吸 + 内部描边绘制动画） ---- */
.lock-icon-wrap {
  width:76px; height:76px; margin:0 auto 22px;
  display:flex; align-items:center; justify-content:center; position:relative;
}
.lock-icon-wrap img,
.lock-icon-wrap svg {
  width:72px; height:auto; border-radius:16px;
  filter: drop-shadow(0 4px 14px rgba(94,106,210,.22));
  animation: logoFloat 3.5s ease-in-out infinite;
}
@keyframes logoFloat {
  0%,100% { transform: translateY(0) scale(1); }
  50%     { transform: translateY(-7px) scale(1.03); }
}

.lock-title {
  font-family: var(--font-display);
  font-size:2rem; font-weight:600; letter-spacing:-0.035em; margin-bottom:8px;
  color: var(--text-primary); text-wrap:balance; font-optical-sizing:auto;
}
.lock-subtitle { color:var(--text-muted); font-size:.85rem; margin-bottom:28px; }

.lock-input {
  width:100%; padding:14px 18px;
  background:var(--surface-2); border:1.5px solid var(--border);
  border-radius: var(--radius-xs); color:var(--text-primary); font-size:1rem;
  outline:none; transition:border-color .2s var(--ease-out), box-shadow .2s var(--ease-out);
  text-align:left; font-family: var(--font-sans);
}
.lock-input::placeholder { color:var(--text-muted); }
.lock-input:focus { border-color:var(--accent); box-shadow:var(--shadow-focus); }
.lock-input-wrapper { position:relative; margin-bottom:16px; }
.lock-toggle-pwd {
  position:absolute; right:14px; top:50%; transform:translateY(-50%);
  background:none; border:none; cursor:pointer;
  opacity:.4; transition: opacity .2s var(--ease-out); padding:4px 8px;
  color:var(--text-muted);
}
.lock-toggle-pwd:hover { opacity:1; }

.lock-btn {
  width:100%; padding:14px;
  background:var(--primary); border:none; border-radius:var(--radius-xs);
  color:var(--on-primary); font-weight:600; font-size:1rem; cursor:pointer;
  transition: background .2s var(--ease-out), transform .12s var(--ease-out);
  letter-spacing:.04em; font-family: var(--font-sans);
}
.lock-btn:hover { background:var(--primary-hover); }
.lock-btn:active { transform:scale(.985); background:var(--primary-press); }

.lock-error { color:var(--danger); font-size:.82rem; margin-top:14px; min-height:1.2em; font-weight:500; }
/* 20261016a：纯加载 splash 的转圈（#lockScreen 已无密码框） */
.lock-spinner {
  width:34px; height:34px; margin:20px auto 4px;
  border:3px solid var(--border); border-top-color:var(--accent);
  border-radius:50%; box-sizing:border-box;
  animation: lockSpin .8s linear infinite;
}
@keyframes lockSpin { to { transform: rotate(360deg); } }
.lock-switch-link { color:var(--accent); text-decoration:underline; cursor:pointer; font-size:.8rem; }
.lock-switch-link:hover { color:var(--primary-hover); }
.lock-about-btn {
  width:30px; height:30px; border-radius:50%; border:1px solid var(--border);
  background:var(--surface-2); color:var(--text-muted); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; font-size:.95rem;
  transition: background .2s var(--ease-out), color .2s var(--ease-out), border-color .2s var(--ease-out);
}
.lock-about-btn:hover { background:var(--accent); color:#fff; border-color:var(--accent); }

/* ---- 登录/注册 切换标签 ---- */
.auth-tabs {
  display:flex; gap:8px; margin:0 0 22px;
  background:var(--surface-2); border:1px solid var(--border);
  border-radius:var(--radius-xs); padding:4px;
}
.auth-tab {
  flex:1; padding:10px; border:none; background:transparent;
  border-radius:calc(var(--radius-xs) - 2px); color:var(--text-muted);
  font-weight:600; font-size:.92rem; cursor:pointer;
  transition:background .2s var(--ease-out), color .2s var(--ease-out);
  font-family:var(--font-sans);
}
.auth-tab.active { background:var(--surface); color:var(--text-primary); box-shadow:var(--shadow-sm); }

/* ---- 分层入场动画（克制错落） ---- */
.lock-card > * { animation: lockItemIn .42s var(--ease-out) both; }
.lock-card > *:nth-child(1) { animation-delay:.06s; }
.lock-card > *:nth-child(2) { animation-delay:.11s; }
.lock-card > *:nth-child(3) { animation-delay:.16s; }
.lock-card > *:nth-child(4) { animation-delay:.21s; }
.lock-card > *:nth-child(5) { animation-delay:.26s; }
.lock-card > *:nth-child(6) { animation-delay:.31s; }
@keyframes lockItemIn {
  from { opacity:0; transform:translateY(8px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ===== 解锁界面固定为深色（深色「Private Workspace」锁屏，独立于应用主题）
   与中间件入口锁屏视觉一致；仅把深色令牌作用域限定在 #lockScreen / #authScreen 子树，不影响解锁后的应用主题。 */
#lockScreen, #authScreen {
  --bg: #0f1115;
  --surface: #171a21;
  --surface-2: #0e1116;
  --surface-3: #262b33;
  --border: #262b33;
  --border-strong: #353b47;
  --text-primary: #e8eaed;
  --text-secondary: #c9ccd1;
  --text-muted: #9aa0a6;
  --accent: #6c8cff;
  --accent-hover: #8a9fff;
  --accent-glow: rgba(108, 140, 255, 0.25);
  --on-primary: #ffffff;
  --primary: #6c8cff;
  --primary-hover: #5b7cff;
  --primary-press: #4a6bff;
  --primary-weak: rgba(108, 140, 255, 0.12);
  --danger: #ff8080;
  --danger-weak: rgba(255, 128, 128, 0.15);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 6px 18px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.6);
  --shadow-focus: 0 0 0 3px rgba(108, 140, 255, 0.35);
}

/* ===== Scrollbar（极细、深底浅灰） ===== */
::-webkit-scrollbar { width:9px; height:9px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(247,248,248,0.12); border-radius:999px; border:2px solid transparent; background-clip:padding-box; }
::-webkit-scrollbar-thumb:hover { background:rgba(247,248,248,0.22); border:2px solid transparent; background-clip:padding-box; }
* { scrollbar-width: thin; scrollbar-color: rgba(247,248,248,0.14) transparent; }

/* ===== Light theme: 滚动条反色（深底浅灰 thumb → 浅底深灰 thumb） ===== */
.light ::-webkit-scrollbar-thumb { background: rgba(16,17,20,0.18); border:2px solid transparent; background-clip:padding-box; }
.light ::-webkit-scrollbar-thumb:hover { background: rgba(16,17,20,0.30); border:2px solid transparent; background-clip:padding-box; }
.light * { scrollbar-color: rgba(16,17,20,0.20) transparent; scrollbar-width: thin; }

/* ===== 账户管理（仅主人）列表 ===== */
.admin-user-list { padding: 4px 2px 6px; flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.admin-loading { padding: 22px 8px; color: var(--text-muted); text-align: center; font-size: .9rem; }
.admin-user-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 11px 12px; margin-bottom: 8px;
  background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm);
}
.admin-user-name { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1; flex-wrap: wrap; }
.admin-user-name i { color: var(--text-muted); }
.admin-user-name .admin-badge {
  font-size: .68rem; padding: 1px 7px; border-radius: 999px;
  background: var(--accent-weak); color: var(--accent); font-weight: 600;
}
.admin-user-name .admin-date { font-size: .72rem; color: var(--text-muted); }
.admin-del-btn {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 12px; border-radius: var(--radius-sm); border: 1px solid transparent;
  background: var(--danger-weak); color: var(--danger); font-weight: 600; cursor: pointer;
  font-family: var(--font-sans); font-size: .84rem; transition: background .15s var(--ease-out);
}
.admin-del-btn:hover:not(:disabled) { background: var(--danger); color: #fff; }
.admin-del-btn:disabled { opacity: .45; cursor: not-allowed; }

/* 账户管理模态框：账号卡片（查看密码 + 管理数据） */
.admin-user-card {
  padding: 12px 14px; margin-bottom: 10px;
  background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm);
}
.admin-user-head { display: flex; align-items: flex-start; }
.admin-user-name { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1; flex-wrap: wrap; }
.admin-user-name i { color: var(--text-muted); }
.admin-user-name .admin-badge {
  font-size: .68rem; padding: 1px 7px; border-radius: 999px;
  background: var(--accent-weak); color: var(--accent); font-weight: 600;
}
.admin-user-name .admin-date { font-size: .72rem; color: var(--text-muted); }
.admin-pw-row { display: flex; align-items: center; gap: 8px; margin-top: 9px; font-size: .86rem; }
.admin-pw-label { color: var(--text-muted); flex: 0 0 auto; }
.admin-pw-val {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  font-weight: 600; color: var(--text-primary); word-break: break-all; flex: 1 1 auto; min-width: 0;
}
.admin-pw-toggle {
  flex: 0 0 auto; padding: 3px 10px; border-radius: var(--radius-sm);
  border: 1px solid var(--border); background: transparent; color: var(--accent);
  font-size: .78rem; cursor: pointer; font-family: var(--font-sans);
}
.admin-pw-toggle:hover { background: var(--accent-weak); }
.admin-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 11px; }
.admin-actions .btn { flex: 0 0 auto; }
.admin-hint {
  margin: 0 0 4px; padding: 10px 12px; font-size: .8rem; line-height: 1.5;
  color: var(--text-muted); background: var(--surface-2);
  border: 1px solid var(--border); border-radius: var(--radius-sm);
}

/* 账号数据查看：可滚动的 JSON 预览 */
.admin-data-view {
  flex: 1 1 auto; min-height: 0; overflow: auto; margin: 0; padding: 14px 16px;
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  font-size: .78rem; line-height: 1.55; color: var(--text-primary);
  background: var(--surface-2); border-top: 1px solid var(--border);
  white-space: pre-wrap; word-break: break-word;
}

/* ===== css/layout.css ===== */
/* =====================================================================
   Flow OS · Layout — "Quiet System"
   实心暖表面 + 发丝边框，移除毛玻璃；导航激活用朱红指示条。
   ===================================================================== */
#appShell {
  display:flex; height:100vh; height:100dvh; width:100vw; overflow:hidden;
  opacity:0; transition: opacity .35s var(--ease-out);
  background: transparent; position:relative; z-index:1;
}
#appShell.active { opacity:1; }

/* ===== Sidebar（实心暖卡面 + 右侧发丝边框） ===== */
#sidebar {
  width:var(--sidebar-w); flex-shrink:0;
  background: var(--surface);
  border-right:1px solid var(--border);
  display:flex; flex-direction:column; z-index:50;
  transition: transform .35s cubic-bezier(0.32, 0.72, 0, 1), width .3s var(--ease-out);
}
.sidebar-header { padding:22px 18px 14px; display:flex; align-items:center; justify-content:space-between; }
.sidebar-logo { display:flex; align-items:center; gap:11px; }
.sidebar-logo-icon {
  width:34px; height:34px; flex-shrink:0;
  border-radius:var(--radius-sm);
  object-fit:contain;
}
.sidebar-logo-text {
  font-family: var(--font-display);
  font-size:19px; font-weight:600; letter-spacing:-0.02em; color:var(--text-primary);
  font-optical-sizing:auto;
}
.sidebar-nav { flex:1; overflow-y:auto; padding:6px 12px; }
.nav-item {
  display:flex; align-items:center; gap:11px; padding:10px 13px; border-radius:var(--radius-sm);
  cursor:pointer; transition: background .18s var(--ease-out), color .18s var(--ease-out); color:var(--text-secondary);
  font-size:.9rem; font-weight:500; margin-bottom:3px; border:1px solid transparent;
  position:relative; overflow:hidden; user-select:none;
}
.nav-item:hover { background: var(--surface-3); color:var(--text-primary); }
.nav-item.active {
  background: var(--accent-weak); color:var(--accent-ink); font-weight:700;
}
/* 激活指示条（朱红，加粗 + 微光），替代蓝色填充 */
.nav-item.active::before {
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:4px; height:20px; border-radius:0 3px 3px 0; background:var(--accent);
  box-shadow: 0 0 10px var(--accent-glow);
}
.nav-item i { width:20px; text-align:center; font-size:1rem; opacity:.9; }
.nav-group { margin-top:6px; }
.nav-group-title { font-size:.72rem; font-weight:600; color:var(--text-muted); padding:12px 14px 4px; letter-spacing:.06em; text-transform:uppercase; }

.sidebar-footer { padding:14px; border-top:1px solid var(--border); display:flex; flex-direction:column; gap:8px; }

/* ===== Collapse button ===== */
.sidebar-collapse-btn {
  width:30px; height:30px; border:none; border-radius:8px; background:transparent;
  color:var(--text-muted); cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition: background .2s var(--ease-out), color .2s var(--ease-out); flex-shrink:0;
}
.sidebar-collapse-btn:hover { background: var(--surface-3); color:var(--text-primary); }
.sidebar-collapse-btn i { transition: transform .3s var(--ease-out); }
@media (min-width:769px) {
  #appShell.sidebar-collapsed #sidebar { width:0; min-width:0; transform:translateX(-100%); overflow:hidden; }
  #appShell.sidebar-collapsed #menuToggle { display:inline-flex !important; }
  #appShell.sidebar-collapsed .sidebar-collapse-btn i { transform:rotate(180deg); }
}

/* ===== Main Area ===== */
#mainArea { flex:1; display:flex; flex-direction:column; overflow:hidden; position:relative; }

#topBar {
  height:48px; flex-shrink:0; display:flex; align-items:center; justify-content:space-between;
  padding:0 18px; background: var(--surface);
  border-bottom:1px solid var(--border); z-index:40;
}
.top-title {
  font-family: var(--font-display);
  font-size:1.1rem; font-weight:600; letter-spacing:-0.02em; color:var(--text-primary);
  font-optical-sizing:auto;
}
.top-actions { display:flex; gap:8px; align-items:center; }
.top-date { margin-left:auto; font-size:.78rem; color:var(--text-muted); white-space:nowrap; padding-right:4px; }

#moduleContainer { flex:1; overflow-y:auto; padding:clamp(8px, 1vw, 16px); position:relative; overflow-anchor:none; z-index:1; }
#moduleContainer > .module-panel { max-width:var(--content-max, 1320px); margin-inline:auto; }
:root { --content-max: 1320px; }
@media (min-width:1700px) { :root { --content-max: 1480px; } }
@media (min-width:2200px) { :root { --content-max: 1640px; } }

/* ===== Module Panels ===== */
.module-panel { display:none; opacity:0; transform:translateY(8px); transition: opacity .3s var(--ease-out), transform .3s var(--ease-out); }
.module-panel.active { display:block; opacity:1; transform:translateY(0); animation:fadeIn .38s cubic-bezier(0.32, 0.72, 0, 1); }
@keyframes fadeIn { from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:translateY(0);} }

/* ===== Mobile overlay ===== */
.mobile-overlay { position:fixed; inset:0; background:rgba(1,1,2,0.5); z-index:45; display:none; }
.mobile-overlay.active { display:block; }

/* ===== css/components.css ===== */
/* =====================================================================
   Flow OS · Components — "Quiet System"
   全部组件去 AI 味：扁平实心表面 + 发丝边框，主操作为墨黑，
   信号色朱红；分类色去饱和；编辑感字体用于标题与数字。
   ===================================================================== */

/* ===== Card（扁平、靠表面阶梯 + 发丝边框抬起；顶边极淡白高光） ===== */
.card, .glass-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  box-shadow: inset 0 1px 0 rgba(247,248,248,0.04);
  padding: var(--space-5);
  transition: border-color .2s var(--ease-out), box-shadow .2s var(--ease-out), transform .2s var(--ease-out);
  position: relative;
}
.card:hover, .glass-card:hover {
  border-color: var(--border-strong);
  box-shadow: inset 0 1px 0 rgba(247,248,248,0.06);
  transform: translateY(-2px);
}

/* ===== Buttons ===== */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:var(--ctrl-h); padding:0 16px;
  border-radius:var(--radius-xs); border:1px solid var(--border); background:var(--surface);
  color:var(--text-secondary); font-size:var(--fs-2); font-weight:500; cursor:pointer; white-space:nowrap;
  font-family: var(--font-sans);
  transition: background .15s var(--ease-out), border-color .15s var(--ease-out), color .15s var(--ease-out), transform .12s var(--ease-out), box-shadow .15s var(--ease-out);
}
.btn:hover { border-color:var(--border-strong); color:var(--text-primary); background:var(--surface-3); }
.btn:active { transform:scale(.985); }

.btn-primary { background:var(--primary); color:var(--on-primary); border-color:var(--primary); box-shadow:var(--shadow-sm); }
.dark .btn-primary { color:var(--on-primary); border-color:var(--border-strong); }
.btn-primary:hover { background:var(--primary-hover); color:var(--on-primary); border-color:var(--primary-hover); box-shadow:var(--shadow-md); }
.dark .btn-primary:hover { color:var(--on-primary); border-color:var(--border-strong); }
.btn-primary:active { transform:scale(.985); background:var(--primary-press); }

.btn-secondary { background:var(--surface); color:var(--text-primary); border-color:var(--border); }
.btn-secondary:hover { border-color:var(--accent); color:var(--accent); background:var(--accent-weak); }

.btn-ghost { background:transparent; border-color:transparent; color:var(--text-secondary); }
.btn-ghost:hover { background:var(--surface-3); color:var(--text-primary); }

.btn-danger { background:transparent; color:var(--danger); border-color:var(--danger-weak); }
.btn-danger:hover { background:var(--danger-weak); color:var(--danger); border-color:var(--danger); }

.btn-sm { min-height:var(--ctrl-h-sm); padding:0 12px; font-size:var(--fs-1); border-radius:var(--radius-2xs); }

/* ===== Modal ===== */
.modal-overlay {
  position:fixed; inset:0; background:rgba(20,19,15,0.32);
  z-index:9999; display:none; align-items:center; justify-content:center; padding:20px;
}
.modal-overlay.active { display:flex; }
.modal {
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-xl);
  max-width:460px; width:100%; max-height:88dvh;
  box-shadow:var(--shadow-lg); padding:14px;
  /* 弹窗布局：flex 纵向，header/footer 固定，body 独立滚动。
     20260824a：把滚动从 .modal 移到 #modalBody —— 此前整窗滚动 + body 用 flex-shrink 收缩，
     在移动端（触摸设备跳过 SimpleBar）会令 body 内容溢出、页脚（确定/取消）盖住底部内容。
     现改为 body 内滚、页脚常驻底部不被遮挡；桌面端 SimpleBar 同样作用于 #modalBody，行为一致。 */
  display:flex; flex-direction:column;
  opacity:0; transform:translateY(12px) scale(.985);
}
.modal > .modal-header { flex:0 0 auto; }
.modal > #modalBody { flex:1 1 auto; min-height:0; overflow-y:auto; }
.modal > #settingsBody { flex:1 1 auto; min-height:0; overflow-y:auto; }
.modal > #habitPopupBody { flex:1 1 auto; min-height:0; overflow-y:auto; }
.modal > .modal-footer { flex:0 0 auto; }
.modal-overlay.active .modal { animation:modalIn .28s var(--ease-out) both; }
@keyframes modalIn { from{opacity:0; transform:translateY(12px) scale(.985);} to{opacity:1; transform:none;} }
.modal-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.modal-title { font-family:var(--font-display); font-size:17px; font-weight:600; letter-spacing:-0.02em; font-optical-sizing:auto; }
.modal-close { background:none; border:none; font-size:18px; cursor:pointer; color:var(--text-muted); }
.modal-close:hover { color:var(--text-primary); }
.modal-footer { display:flex; justify-content:flex-end; gap:10px; margin-top:12px; padding-top:12px; border-top:1px solid var(--border); }
.modal .form-group { margin-bottom:11px; }
.modal .form-label { margin-bottom:5px; font-size:.84rem; font-weight:600; }
.modal .form-input, .modal .form-select, .modal .form-textarea { padding:10px 14px; font-size:.92rem; }
.modal .btn { padding:9px 16px; }
/* 弹窗内文本行距收紧（确认/提示类弹窗更紧凑） */
.modal-body p, #modalBody p { line-height:1.5; margin:2px 0; }
/* 弹窗内文本行距收紧（确认/提示类弹窗更紧凑） */
.modal-body p, #modalBody p { line-height:1.5; margin:2px 0; }

/* ===== Form ===== */
.form-group { margin-bottom:var(--space-3); }
.form-label { display:block; font-size:var(--fs-2); font-weight:600; margin-bottom:4px; color:var(--text-secondary); }
.form-input, .form-select, .form-textarea {
  width:100%; padding:10px 14px; border:1px solid var(--border); border-radius:var(--radius-sm);
  font-size:var(--fs-3); outline:none; transition: .15s var(--ease-out); background:var(--surface-2); color:var(--text-primary);
  font-family: var(--font-sans);
}
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color:var(--accent); box-shadow:var(--shadow-focus); }
.form-textarea { resize:none; min-height:60px; overflow-y:hidden; }
/* ===== 输入框自动增高（20261021y）=====
   需求：「我已经拉了很长的输入框，想多写一点东西，但它永远都是那么大，无法总览全部内容」。
   改为随内容自动增高（高度由 FlowCore._growTextarea 按 scrollHeight 计算），
   只有超过上限（约 55vh）才出现内部滚动条，因此手动拖拽手柄已无必要（resize:none）。
   表单场景的所有 textarea 统一适用；超出上限时 JS 会改 overflow-y:auto。 */
textarea {
  resize: none;
  overflow-y: hidden;
  box-sizing: border-box;
  transition: height .12s ease-out;
}
#dailyTomorrow { min-height:52px; line-height:1.5; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }

/* 内容录入类输入限宽 *
.journal-compose .form-input, .journal-title-input, .journal-content, .daily-topgoal-input .form-input, .daily-task-input .form-input, .daily-search input, .task-top-row .form-input, .task-top-chips .task-search, .form-row .form-input, .form-row .form-select, .bz-quickadd-input 

/* ===== Toast ===== */
#toastContainer { position:fixed; bottom:calc(24px + env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%); z-index:99999; display:flex; flex-direction:column; gap:8px; pointer-events:none; }
.toast {
  background:var(--primary); color:var(--on-primary); padding:10px 20px; border-radius:var(--radius-sm);
  font-size:var(--fs-2); font-weight:500; box-shadow:var(--shadow-md);
  animation:toastIn .3s var(--ease-out); pointer-events:auto;
}
.dark .toast { color:var(--on-primary); }
.toast.success { background:var(--success); color:#fff; }
.toast.error { background:var(--danger); color:#fff; }
@keyframes toastIn { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }

/* 专注：结束动效 */
@keyframes timerPop { 0%{transform:scale(1)} 35%{transform:scale(1.12)} 70%{transform:scale(.97)} 100%{transform:scale(1)} }
.timer-digit.timer-pop { animation:timerPop .9s var(--ease-out); }

/* 我的提醒（20261013a：日历内应用内提醒） */
.myrem-count { font-size:.7rem; background:var(--accent-weak); color:var(--accent); padding:1px 8px; border-radius:20px; margin-left:auto; }
.myrem-item { display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:var(--radius-sm); border:1px solid var(--border); margin-bottom:6px; }
.myrem-item.overdue { border-color:var(--danger); background:var(--danger-weak, rgba(210,59,64,.06)); }
.myrem-main { flex:1; min-width:0; }
.myrem-title { font-size:var(--fs-2); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.myrem-due { font-size:var(--fs-1); color:var(--text-muted); margin-top:1px; }
.myrem-item.overdue .myrem-due { color:var(--danger); font-weight:600; }
.myrem-rep { margin-left:6px; background:var(--surface-2); border-radius:4px; padding:0 5px; }
.myrem-actions { display:flex; gap:2px; flex-shrink:0; }
.myrem-actions .btn { padding:3px 8px; }
.myrem-done { color:var(--success); }
.myrem-del { color:var(--danger); }

/* ===== Ctrl+K 命令面板 / 全局搜索（20261013a）===== */
.cp-overlay { position:fixed; inset:0; background:rgba(20,19,15,0.32); z-index:10050; display:none; align-items:flex-start; justify-content:center; padding:12vh 20px 20px; }
.cp-overlay.active { display:flex; }
.cp-box { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); width:100%; max-width:560px; max-height:70dvh; display:flex; flex-direction:column; overflow:hidden; animation:cpIn .18s var(--ease-out) both; }
@keyframes cpIn { from{opacity:0;transform:translateY(-8px) scale(.99)} to{opacity:1;transform:translateY(0) scale(1)} }
.cp-head { display:flex; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--border); color:var(--text-muted); }
.cp-input { flex:1; border:none; outline:none; background:transparent; font-size:15px; color:var(--text-primary); }
.cp-input::placeholder { color:var(--text-muted); }
.cp-kbd { font-size:11px; padding:2px 6px; border:1px solid var(--border); border-radius:4px; color:var(--text-muted); background:var(--surface-2); }
.cp-results { overflow-y:auto; padding:6px; }
.cp-group { font-size:11px; font-weight:700; color:var(--text-muted); padding:8px 10px 4px; letter-spacing:.04em; }
.cp-item { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:var(--radius-sm); cursor:pointer; }
.cp-item.sel { background:var(--accent-weak); }
.cp-item-icon { width:16px; text-align:center; color:var(--text-muted); font-size:13px; flex-shrink:0; }
.cp-item.sel .cp-item-icon { color:var(--accent); }
.cp-item-title { font-size:14px; color:var(--text-primary); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:55%; }
.cp-item-sub { font-size:12px; color:var(--text-muted); margin-left:auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:40%; flex-shrink:0; }
/* 计数徽标（20261013d：专注按备注分组后显示次数） */
.cp-item-badge { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:16px; padding:0 5px; margin-left:6px; border-radius:999px; font-size:10px; font-weight:700; line-height:1; color:var(--on-accent); background:var(--accent); flex-shrink:0; }
.dark .cp-item-badge { color:var(--on-primary); }
.cp-empty { text-align:center; color:var(--text-muted); font-size:13px; padding:28px 16px; line-height:1.6; }
/* 搜索定位高亮（20261013c） */
@keyframes cpFlash { 0%,100%{box-shadow:0 0 0 0 var(--accent);} 30%{box-shadow:0 0 0 4px var(--accent-weak);} }
.myrem-item.cp-flash { animation:cpFlash 1.6s var(--ease-out) 1; border-color:var(--accent); }
.cp-foot { padding:8px 14px; border-top:1px solid var(--border); font-size:11px; color:var(--text-muted); }

/* ===== Sync Status ===== */
.sync-badge {
  font-size:var(--fs-1); padding:4px 12px; border-radius:var(--radius-pill); background:var(--surface-3); color:var(--text-muted);
  display:inline-flex; align-items:center; gap:6px; font-weight:500; border:1px solid var(--border);
}
.sync-badge.success { background:var(--success-weak); color:var(--success); }
.sync-badge.syncing { background:var(--accent-weak); color:var(--accent); }
.sync-badge.locked { background:var(--danger-weak); color:var(--danger); }
.sync-badge.error { background:var(--danger-weak); color:var(--danger); }
.sync-badge.local { background:var(--warning-weak); color:var(--warning); }
.sync-time { font-size:var(--fs-1); color:var(--text-muted); margin-left:2px; }

/* ===== Filter chips ===== */
.filter-chip { background:var(--surface-3); border:1px solid var(--border); border-radius:var(--radius-pill); padding:4px 14px; font-size:var(--fs-2); cursor:pointer; transition: all .15s var(--ease-out); color:var(--text-muted); }
.filter-chip.active { background:var(--accent); color:#fff; border-color:var(--accent); }
.dark .filter-chip.active { color:var(--on-primary); }
#timerNoteFilterBtn.active { background:var(--accent); color:var(--on-primary); border-color:var(--accent); }

/* ===== Color picker ===== */
.color-picker { display:flex; gap:8px; flex-wrap:wrap; }
.color-option { width:28px; height:28px; border-radius:50%; cursor:pointer; border:2px solid transparent; transition: .15s var(--ease-out); }
.color-option.active { border-color:var(--text-primary); transform:scale(1.1); }

/* ===== Password Vault ===== */
.pwd-item {
  display:flex; align-items:center; gap:16px; padding:16px 20px;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  margin-bottom:10px; transition: border-color .15s var(--ease-out), transform .15s var(--ease-out);
}
.pwd-item:hover { border-color:var(--border-strong); transform:translateX(3px); }
.pwd-site { font-weight:600; min-width:140px; }
/* 网页跳转按钮：紧凑图标按钮，桌面/移动端都小巧，不撑大行高 */
.pwd-web-btn {
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto;
  width:26px; height:26px; padding:0; border-radius:var(--radius-2xs);
  border:1px solid var(--border); background:var(--surface-2); color:var(--text-secondary);
  font-size:.7rem; cursor:pointer; transition:background .15s var(--ease-out), color .15s var(--ease-out), border-color .15s var(--ease-out);
}
.pwd-web-btn:hover { background:var(--accent-weak); color:var(--accent); border-color:var(--accent); }
.pwd-field { flex:1; display:flex; align-items:center; gap:8px; min-width:0; }
.pwd-value {
  flex:1; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-2xs);
  padding:6px 10px; font-size:var(--fs-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.pwd-cat-chip { display:inline-flex; align-items:stretch; border-radius:var(--radius-2xs); overflow:hidden; flex:0 0 auto; }
.pwd-cat-chip .btn-sm { border-radius:var(--radius-2xs); }
/* 密码分类筛选条：第一行横排，超出左右滑动（不换行到第二排） */
.pwd-cat-scroll { display:flex; gap:8px; margin-bottom:16px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding-bottom:2px; }
.pwd-cat-scroll::-webkit-scrollbar { display:none; }
.pwd-cat-scroll > * { flex:0 0 auto; }

/* ===== Timer ===== */
.timer-box { container-type:inline-size; container-name:timerbox; }
.timer-digit {
  font-family:var(--font-sans); font-weight:800; font-size:clamp(2.4rem, 18cqi, 7rem);
  line-height:1.05; color:var(--success); text-align:center; letter-spacing:.01em;
  font-variant-numeric:tabular-nums;
}
.timer-pulse { animation:pulseGlow 2.5s infinite ease-in-out; }
@keyframes pulseGlow { 0%{transform:scale(1)} 50%{transform:scale(1.02)} 100%{transform:scale(1)} }
.timer-btn {
  /* 领域增强：大号 action 按钮（继承 .btn 基础体系；模板为 class="btn btn-primary/secondary timer-btn"） */
  width:100%; height:100%;
  border-radius:var(--radius-pill);
  font-size:clamp(.72rem, 3.6cqi, 1.1rem);
  padding:clamp(8px, 2.6cqi, 16px) clamp(4px, 1cqi, 10px);
}
.timer-note-input { width:100%; height:100%; text-align:center; padding-left:26px; padding-right:8px;
  font-size:clamp(.7rem, 2.6cqi, 1rem); background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm); color:var(--text-primary); }
.timer-box { position:relative; text-align:center; padding:24px 20px; }
.timer-note-wrap { position:relative; display:flex; align-items:center; }
.timer-top-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.timer-bottom-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.timer-top-grid > .glass-card, .timer-bottom-grid > .glass-card { min-width:0; }
@media (max-width:900px) { .timer-top-grid, .timer-bottom-grid { grid-template-columns:1fr; } }
.time-filter-group { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm); display:inline-flex; padding:2px; gap:0; }
.filter-chip--sm { padding:3px 10px; font-size:.7rem; }
.tm-note-item { padding:6px 14px; font-size:var(--fs-1); cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:12px; transition: background .15s var(--ease-out); border-radius:var(--radius-xs); }
.tm-note-item:hover { background:var(--surface-3); }
.tm-note-item.active-filter { background:var(--success); color:#fff; }
.tm-note-item .tm-color-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; display:inline-block; }
.tm-note-item .badge { font-size:.6rem; background:var(--surface-3); color:var(--text-muted); padding:1px 6px; border-radius:var(--radius-xs); }
.tm-note-item.active-filter .badge { background:rgba(255,255,255,0.3); color:#fff; }
.tm-rec-row { border-bottom:1px solid var(--border); transition: background .15s var(--ease-out); }
.tm-rec-row:hover { background:var(--success-weak); }
.tm-rec-row td { color:var(--text-secondary); }
.tm-note-editable { width:80px; background:transparent; border:none; border-bottom:1px dashed var(--border); font-size:var(--fs-2); padding:2px 4px; outline:none; transition: border-color .15s var(--ease-out); color:inherit; font-family:var(--font-sans); }
.tm-note-editable:focus { border-bottom-color:var(--success); }
.tm-del-btn { color:var(--danger); cursor:pointer; padding:4px; transition: color .15s var(--ease-out); background:none; border:none; }
.tm-del-btn:hover { color:var(--danger-press); }
#timerRecordsScroll thead tr { background:var(--surface-2); }
#timerCustomPanel, #timerPieCustomPanel, #timerTrendCustomPanel { background:var(--surface-2); }
.time-filter-group .filter-chip:not(.active) { background:var(--surface-3); border-color:var(--border); color:var(--text-muted); }
.tm-note-item[data-note="__all__"] { border-bottom:1px solid var(--border); }

/* ===== Calendar ===== */
/* 分割线改用「单元格边框」而非 gap+背景色：gap:1px 在非整数列宽/缩放时会被子像素取整吞掉，
   导致分割线偶发消失（20260826d 修复）。边框法 1px 恒定、永不消失。 */
.fc-grid { display:grid; grid-template-columns:repeat(7,1fr); border-top:1px solid var(--border); border-left:1px solid var(--border); border-radius:var(--radius-sm); overflow:hidden; }
.fc-cell, .cal-weekday { border-right:1px solid var(--border); border-bottom:1px solid var(--border); }
.fc-cell { background:var(--surface); min-height:clamp(52px, 8vw, 80px); padding:6px; cursor:pointer; transition: .15s var(--ease-out); min-width:0; overflow:hidden; }
.fc-cell:hover { background:var(--surface-3); }
.fc-cell.today { background:var(--accent-weak); }
.fc-cell.other-month { background:var(--surface-2); color:var(--text-muted); }
.fc-cell.weekend .fc-day-num { color:var(--danger); }
.fc-day-num { font-size:var(--fs-2); font-weight:600; width:26px; height:26px; display:flex; align-items:center; justify-content:center; border-radius:50%; }
.fc-cell.today .fc-day-num { background:var(--accent); color:#fff; }
.dark .fc-cell.today .fc-day-num { color:var(--on-primary); }
.fc-lunar { font-size:.65rem; color:var(--text-muted); margin-top:2px; }
.fc-event-dot { font-size:.65rem; padding:1px 6px; border-radius:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; background:var(--accent-weak); color:var(--accent); }
.fc-event-dot { cursor:pointer; transition:filter .12s; }
.fc-event-dot:hover { filter:brightness(.92); }
/* 月格「+N」与当天列表弹窗（20261013a） */
.fc-more { font-size:.6rem; color:var(--text-muted); cursor:pointer; padding:0 6px; margin-top:2px; border-radius:4px; }
.fc-more:hover { color:var(--accent); background:var(--accent-weak); }
.fc-daylist { display:flex; flex-direction:column; gap:2px; }
.fc-daylist-row { display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:var(--radius-sm); cursor:pointer; font-size:var(--fs-2); }
.fc-daylist-row:hover { background:var(--surface-2); }
.fc-daylist-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.fc-daylist-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fc-daylist-time { color:var(--text-muted); font-size:var(--fs-1); flex-shrink:0; }
.solar-term { color:var(--accent); }
.festival { color:var(--danger); }
/* 日历头部/导航：窄屏时允许换行，按钮不收缩、不挤成一团（20260826d） */
.cal-head { flex-wrap:wrap; }
.cal-nav .btn { flex:0 0 auto; white-space:nowrap; }
/* 桌面端给日历网格一个最小宽度，避免窄窗口把 7 列网格挤成竖长条（20260826d） */
@media (min-width:769px) {
  #mod-calendar .flex-1 { min-width:340px; }
}

/* ===== Habit (打卡) ===== */
.habit-day { width:32px; height:32px; border-radius:var(--radius-xs); display:flex; align-items:center; justify-content:center; font-size:var(--fs-1); font-weight:600; background:var(--surface-2); transition: .1s var(--ease-out); cursor:pointer; color:var(--text-muted); border:1px solid var(--border); }
.habit-day:hover { border-color:var(--accent); color:var(--accent); }
.habit-day.checked:hover { filter:brightness(1.08); }
.habit-day.checked { background:var(--success); color:#fff; border-color:var(--success); }
.habit-day.skipped { background:var(--warning); color:#fff; border-color:var(--warning); }
.habit-day.failed { background:var(--danger); color:#fff; border-color:var(--danger); }
.habit-day.today-hl { outline:2px solid var(--accent); outline-offset:2px; }
/* 今天未打卡：标红提示未完成（20261013b，点击格子即补签） */
.habit-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:14px 12px 12px; transition: border-color .1s var(--ease-out); margin-bottom:10px; position:relative; }
.habit-card:hover { border-color:var(--border-strong); }
.habit-stat-card { background:var(--surface); border-radius:var(--radius); padding:10px 4px; text-align:center; border:1px solid var(--border); }
.habit-stat-card .stat-value { font-size:1.1rem; font-weight:700; line-height:1.2; color:var(--text-primary); display:flex; align-items:center; justify-content:center; font-variant-numeric:tabular-nums; }
.habit-stat-card .stat-label { font-size:.6rem; color:var(--text-muted); font-weight:500; margin-top:2px; }
.habit-badge { background:var(--surface-3); padding:2px 8px; border-radius:var(--radius-pill); font-size:.65rem; font-weight:600; color:var(--text-secondary); display:inline-flex; align-items:center; gap:3px; }

.brain-date { font-size:var(--fs-6); font-weight:700; color:var(--text-primary); letter-spacing:-0.02em; line-height:1.3; }
.brain-greeting { font-size:var(--fs-3); color:var(--text-secondary); margin-top:6px; }

/* ===== 签名绘制线：首屏 hero 下方一道朱红发丝，载入时从左向右绘制 ===== */
.brain-draw { height:2px; width:100%; max-width:160px; margin:14px 0 4px; position:relative; overflow:hidden; border-radius:2px; background:var(--border); }
.brain-draw::after {
  content:""; position:absolute; inset:0; transform-origin:left center;
  background:var(--accent);
  animation: brainDraw 1.1s var(--ease-out) .25s both;
}
@keyframes brainDraw { from { transform:scaleX(0); } to { transform:scaleX(1); } }

.bw-progress { height:6px; border-radius:var(--radius-2xs); background:var(--surface-3); overflow:hidden; }
.bw-progress-bar { height:100%; border-radius:var(--radius-2xs); transition: width .4s var(--ease-out); }
.bw-task { display:flex; align-items:center; gap:8px; }
.bw-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; background:var(--text-muted); }
.bw-dot.on { background:var(--success); }
.bw-task-text { color:var(--text-secondary); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:flex; flex-direction:column; }
.bw-task-text.done { text-decoration:line-through; color:var(--text-muted); }
.bw-sub { font-size:.68rem; color:var(--text-muted); }

/* ============================================================
   Daily · 每日计划
   ============================================================ */
.daily-header { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.daily-date { font-family:var(--font-display); font-size:1.3rem; font-weight:600; color:var(--text-primary); letter-spacing:-0.02em; font-optical-sizing:auto; }
.daily-greeting { font-size:var(--fs-2); color:var(--text-muted); margin-top:2px; }
.daily-header-left { display:flex; flex-direction:column; gap:2px; min-width:0; }
.daily-header-right { display:flex; align-items:center; gap:16px; flex-wrap:wrap; justify-content:flex-end; }
.daily-energy-inline { display:flex; align-items:center; gap:4px; }
.daily-status-label { font-size:var(--fs-2); font-weight:600; color:var(--text-muted); }
.daily-energy-btn {
  font-size:1.25rem; background:transparent; border:2px solid transparent; border-radius:var(--radius-xs);
  width:30px; height:30px; cursor:pointer; transition: .12s var(--ease-out); filter:grayscale(.55); opacity:.4;
}
.daily-energy-btn:hover { transform:scale(1.1); opacity:1; filter:none; }
.daily-energy-btn.active { border-color:rgba(63,157,106,0.6); background:var(--success-weak); opacity:1; filter:none; box-shadow:0 2px 8px var(--success-weak); }
.daily-energy-btn:not(.active) { opacity:.4; filter:grayscale(.55); }
.daily-mood-pick { display:flex; gap:2px; flex-wrap:wrap; }
.daily-mood-btn {
  font-size:1.05rem; background:transparent; border:2px solid transparent; border-radius:var(--radius-sm);
  width:34px; height:34px; cursor:pointer; transition: .12s var(--ease-out); filter:grayscale(0.4); opacity:.7;
}
.daily-mood-btn:hover { transform:scale(1.1); opacity:1; filter:none; }
.daily-mood-btn.active { border-color:var(--accent); background:var(--accent-weak); opacity:1; filter:none; }

.daily-section { margin-bottom:var(--space-4); padding:var(--space-4); border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.daily-section-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:var(--space-3); }
.daily-section-head h3 { font-size:var(--fs-3); font-weight:700; display:flex; align-items:center; gap:6px; }
.daily-topgoal-input, .daily-task-input { display:flex; gap:8px; margin-bottom:10px; flex-wrap:wrap; }
.daily-task-input .form-input { flex:1; min-width:160px; }
.daily-search { position:relative; margin-bottom:12px; }
.daily-search i { position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--text-muted); font-size:var(--fs-1); }
.daily-search input { width:100%; padding:8px 12px 8px 32px; border:1px solid var(--border); border-radius:var(--radius-xs); font-size:var(--fs-2); outline:none; background:var(--surface-2); color:var(--text-primary); font-family:var(--font-sans); }
.daily-search input:focus { border-color:var(--accent); }
.daily-list { display:flex; flex-direction:column; gap:8px; }
/* 待排期紧凑（20260823q）：条目/空状态整体缩小 */
#planBacklog.daily-list { gap:6px; }
#planBacklog .daily-item { padding:7px 10px; gap:8px; }
#planBacklog .daily-text { font-size:var(--fs-2); }
#planBacklog .daily-act { padding:3px 5px; font-size:var(--fs-2); }
#planBacklogEmpty { padding:14px 10px; gap:4px; }
#planBacklogEmpty i { font-size:1.4rem; }
.daily-item {
  display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:var(--radius-sm);
  background:var(--surface); border:1px solid var(--border); transition: .12s var(--ease-out);
}
.daily-item:hover { border-color:var(--border-strong); }
.daily-item.done .daily-text { text-decoration:line-through; color:var(--text-muted); }
.daily-item.dragging { opacity:.4; }
.drag-handle { cursor:grab; color:var(--text-muted); font-size:var(--fs-3); user-select:none; }
.daily-check {
  width:20px; height:20px; border-radius:50%; border:2px solid var(--border); background:transparent;
  cursor:pointer; flex-shrink:0; color:#fff; font-size:var(--fs-1); font-weight:700; line-height:1; display:flex; align-items:center; justify-content:center;
}
.daily-check:hover { border-color:var(--success); }
.daily-item.done .daily-check { background:var(--success); border-color:var(--success); }
.daily-text { flex:1; min-width:0; font-size:var(--fs-3); color:var(--text-secondary); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.daily-prio { width:20px; height:20px; border-radius:var(--radius-2xs); color:#fff; font-size:.65rem; font-weight:700; cursor:pointer; flex-shrink:0; border:none; display:flex; align-items:center; justify-content:center; }
.daily-badges { display:flex; gap:4px; flex-wrap:wrap; flex-shrink:0; }
.daily-chip { font-size:.65rem; padding:2px 7px; border-radius:var(--radius-xs); background:var(--surface-3); color:var(--text-muted); white-space:nowrap; }
.daily-chip.deadline { background:var(--warning-weak); color:var(--warning); }
.daily-chip.cat { background:var(--violet-weak); color:var(--violet); }
.daily-chip.habit { background:var(--success-weak); color:var(--success); }
.daily-chip.focus { background:var(--accent-weak); color:var(--accent); }
.daily-chip.note { background:var(--warning-weak); color:var(--warning); }
.daily-actions { display:flex; gap:2px; flex-shrink:0; }
.daily-act { background:transparent; border:none; color:var(--text-muted); cursor:pointer; padding:4px 6px; border-radius:var(--radius-2xs); font-size:var(--fs-2); transition: .12s var(--ease-out); }
.daily-act:hover { background:var(--accent-weak); color:var(--accent); }
.daily-act.del:hover { background:var(--danger-weak); color:var(--danger); }
.daily-del { background:transparent; border:none; color:var(--text-muted); cursor:pointer; padding:4px 6px; border-radius:var(--radius-2xs); }
.daily-del:hover { color:var(--danger); }
.daily-two-col { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.daily-two-col .form-textarea { min-height:90px; }
@media (max-width:768px) { .daily-two-col { grid-template-columns:1fr; } }

/* ===== 本周 7 天看板 ===== */
.plan-week { display:grid; grid-template-columns:repeat(7,1fr); gap:8px; }
@media (max-width:900px) { .plan-week { grid-template-columns:repeat(3,1fr); } }
.plan-day { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); padding:8px; display:flex; flex-direction:column; min-height:120px; transition: border-color .15s var(--ease-out); }
.plan-day:hover { border-color:var(--border-strong); }
.plan-day-today { border-color:var(--violet); box-shadow:0 0 0 2px var(--violet-weak); }
.plan-day-head { display:flex; justify-content:space-between; align-items:center; font-size:var(--fs-2); font-weight:700; color:var(--text-secondary); margin-bottom:6px; }
.plan-day-date { font-size:.66rem; color:var(--text-muted); font-weight:600; }
.plan-day-list { flex:1; display:flex; flex-direction:column; gap:5px; }

/* 本周计划：周翻页器 + 周序号 */
.plan-week-head { flex-wrap:wrap; gap:8px; }
.plan-week-pager { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.plan-week-label { font-size:var(--fs-1); color:var(--text-secondary); font-weight:600; white-space:nowrap; margin:0 2px; }
.plan-pager-btn {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:30px; height:30px; padding:0 9px;
  border:1px solid var(--border); border-radius:var(--radius-sm);
  background:var(--surface-2); color:var(--text-secondary);
  cursor:pointer; font-size:var(--fs-1); line-height:1;
  transition:border-color .15s var(--ease-out), color .15s var(--ease-out), background .15s var(--ease-out);
}
.plan-pager-btn:hover { border-color:var(--border-strong); color:var(--text-primary); background:var(--surface-3); }
.plan-today-btn { font-weight:700; color:var(--accent); }
.plan-task { display:flex; align-items:center; gap:5px; padding:5px 6px; border-radius:var(--radius-2xs); background:var(--violet-weak); font-size:var(--fs-1); cursor:grab; }
.plan-task:active { cursor: grabbing; }
.plan-task-dragging { opacity: .45; }
.plan-task.done { opacity:.55; text-decoration:line-through; }
.plan-task.done .plan-task-title { text-decoration:line-through; }
.plan-check { width:20px; height:20px; border-radius:50%; border:1.5px solid var(--border); background:transparent; color:var(--success); cursor:pointer; flex-shrink:0; font-size:.6rem; line-height:1; display:flex; align-items:center; justify-content:center; }
.plan-task.done .plan-check { border-color:var(--success); background:var(--success); color:#fff; }
.plan-task.failed { opacity:.55; }
.plan-task.failed .plan-task-title { color:var(--text-muted); }
.plan-check.failed { border-color:var(--danger); background:var(--danger); color:#fff; }
/* 20261015a：失败原因小字（换行使标题与原因各占一行，原因可截断但悬停可看全） */
.plan-fail-reason { flex:1 1 100%; min-width:0; font-size:.65rem; color:var(--danger); opacity:.9; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-left:22px; margin-top:-2px; cursor:help; }
.plan-task-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-secondary); }
.plan-task-actions { display:flex; gap:1px; flex-shrink:0; }
.plan-title-input { flex:1; min-width:0; height:auto; min-height:0; padding:2px 6px; font-size:inherit; border-radius:var(--radius-2xs); }
.plan-act { background:transparent; border:none; color:var(--text-muted); cursor:pointer; padding:1px 3px; border-radius:var(--radius-2xs); font-size:var(--fs-1); }
.plan-act:hover { background:var(--violet-weak); color:var(--violet); }
.plan-act.del:hover { background:var(--danger-weak); color:var(--danger); }
.plan-add { margin-top:6px; border:1px dashed var(--border); background:transparent; color:var(--text-muted); border-radius:var(--radius-2xs); padding:4px; font-size:var(--fs-1); cursor:pointer; transition: .12s var(--ease-out); }
.plan-add:hover { border-color:var(--violet); color:var(--violet); }
.plan-empty { text-align:center; color:var(--text-muted); font-size:var(--fs-3); padding:8px 0; }
/* 计划看板内的日历日程同步行（20261013b：只读展示，点击去日历） */
.plan-cal-event { display:flex; align-items:center; gap:6px; padding:5px 8px; margin-top:3px; border-radius:var(--radius-2xs); background:var(--surface-2); border-left:2px solid var(--accent); cursor:pointer; font-size:var(--fs-1); color:var(--text-secondary); }
.plan-cal-event:hover { background:var(--accent-weak); }
.plan-cal-dot { flex-shrink:0; font-size:.75rem; }
.plan-cal-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.plan-day.drag-over { outline: 2px dashed var(--accent); outline-offset: -4px; background:var(--accent-weak); }

/* 手机端（20260823t）：恢复「左右滑动」视图（原版）—— 每天一张 72vw 卡片，横向滑动浏览 7 天 */
@media (max-width:768px) {
  .plan-week { display:flex; flex-wrap:nowrap; overflow-x:auto; gap:10px; padding-bottom:8px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
  .plan-day { flex:0 0 auto; width:72vw; max-width:260px; scroll-snap-align:start; min-height:120px; }
}

/* ============================================================
   Weekly · 每周总结
   ============================================================ */
.ws-val { font-family:var(--font-display); font-size:1.5rem; font-weight:600; color:var(--text-primary); font-variant-numeric:tabular-nums; letter-spacing:-0.02em; }
.ws-label { font-size:var(--fs-1); color:var(--text-muted); margin-top:2px; }
.ws-sub { font-size:.68rem; color:var(--text-muted); }

/* ============================================================
   Journal · 日记
   ============================================================ */
.journal-header { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.journal-today-hint { font-size:var(--fs-2); font-weight:600; color:var(--text-muted); }
.journal-compose { padding:var(--space-4); margin-bottom:var(--space-4); border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.journal-title-input, .journal-content {
  display:block; width:100%; max-width:600px; box-sizing:border-box;
  border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface-2);
  padding:12px 14px; margin:0 0 12px;
}
.journal-title-input { font-family:var(--font-display); font-size:clamp(1.3rem,2.4vw,1.7rem); font-weight:600; letter-spacing:-.02em; }
.journal-content { resize:vertical; min-height:64px; font-size:var(--fs-3); }
.journal-title-input:focus, .journal-content:focus { border-color:var(--accent); box-shadow:var(--shadow-focus); outline:none; }
.journal-fixed-tags-label { font-size:var(--fs-1); font-weight:600; color:var(--text-muted); margin-bottom:6px; }
.journal-fixed-tags { display:flex; gap:6px; flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; margin-bottom:14px; scrollbar-width:thin; scrollbar-color:var(--border-strong) transparent; -webkit-overflow-scrolling:touch; }
.journal-fixed-tags::-webkit-scrollbar { height:6px; }
.journal-fixed-tags::-webkit-scrollbar-track { background:transparent; }
.journal-fixed-tags::-webkit-scrollbar-thumb { background:var(--border-strong); border-radius:3px; }
.journal-fixed-tags > * { flex:0 0 auto; }
.journal-fixed-tag {
  font-size:var(--fs-1); font-weight:600; padding:5px 14px; border-radius:var(--radius-pill); cursor:pointer;
  border:1px solid var(--border); background:var(--surface-3); color:var(--text-muted); transition: .12s var(--ease-out);
}
.journal-fixed-tag:hover { border-color:var(--pink); color:var(--pink); background:var(--pink-weak); }
.journal-fixed-tag.active { background:var(--pink); color:#fff; border-color:var(--pink); }
.journal-fixed-tag.custom { background:var(--pink); color:#fff; border-color:var(--pink); }
.journal-fixed-tag.custom i { font-size:.66rem; margin-left:2px; }
.journal-tag-add { display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }
.journal-tag-add .form-input { flex:1 1 160px; min-width:0; min-height:34px; height:34px; max-width:220px; }
.journal-tag-add .btn-sm { flex:0 0 auto; }
.journal-tags-empty { font-size:var(--fs-1); color:var(--text-muted); font-weight:500; }
.journal-compose-foot { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.journal-compose-foot-right { display:flex; align-items:center; gap:8px; }
/* 预览切换：复用全站 .btn 体系（20261013f），active 态与 .btn-secondary 一致 */
.journal-preview-btn.active { background:var(--accent-weak); color:var(--accent); border-color:var(--accent); }
.journal-save-hint { font-size:var(--fs-1); color:var(--text-muted); }
.journal-toolbar { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:14px; flex-wrap:wrap; }
.journal-tags-filter { display:flex; gap:6px; flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; flex:1; min-width:0; scrollbar-width:thin; scrollbar-color:var(--border-strong) transparent; -webkit-overflow-scrolling:touch; }
.journal-tags-filter::-webkit-scrollbar { height:6px; }
.journal-tags-filter::-webkit-scrollbar-track { background:transparent; }
.journal-tags-filter::-webkit-scrollbar-thumb { background:var(--border-strong); border-radius:3px; }
.journal-tags-filter > * { flex:0 0 auto; }
.journal-tag-filter {
  font-size:var(--fs-1); font-weight:600; padding:4px 14px; border-radius:var(--radius-pill); cursor:pointer;
  border:1px solid var(--border); background:var(--surface-3); color:var(--text-muted); transition: .12s var(--ease-out);
}
.journal-tag-filter span { opacity:.7; font-weight:500; }
.journal-tag-filter.active { background:var(--pink); color:#fff; border-color:var(--pink); }
.journal-search { width:170px; max-width:46vw; flex:0 0 auto; min-width:0; }
.journal-timeline { display:flex; flex-direction:column; gap:14px; }
.journal-bucket-title { font-size:var(--fs-2); font-weight:700; color:var(--text-muted); margin-bottom:8px; padding-left:4px; border-left:3px solid var(--pink); }
.journal-bucket { display:flex; flex-direction:column; gap:8px; }
.journal-bucket-items { display:flex; flex-wrap:wrap; gap:10px; align-items:flex-start; }
.journal-entry { flex:0 1 300px; max-width:100%; margin:0; padding:13px 14px; border-radius:var(--radius); background:var(--surface); border:1px solid var(--border); transition:.12s var(--ease-out); box-sizing:border-box; }
.journal-entry:hover { border-color:var(--border-strong); }
.journal-entry-head { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.journal-type-chip { font-size:.68rem; font-weight:600; padding:3px 9px; border-radius:var(--radius-pill); background:color-mix(in srgb, var(--c) 16%, transparent); color:var(--c); white-space:nowrap; }
.journal-entry-title { font-size:var(--fs-3); font-weight:700; color:var(--text-secondary); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.journal-related { color:var(--text-muted); font-size:var(--fs-1); }
.journal-del { background:transparent; border:none; color:var(--text-muted); cursor:pointer; padding:2px 6px; border-radius:var(--radius-2xs); transition:.12s var(--ease-out); }
.journal-del:hover { color:var(--danger); background:var(--danger-weak); }
.journal-edit { background:transparent; border:none; color:var(--text-muted); cursor:pointer; padding:2px 6px; border-radius:var(--radius-2xs); margin-left:auto; transition:.12s var(--ease-out); }
.journal-edit:hover { color:var(--accent); background:var(--accent-weak); }
.journal-edit-form { display:flex; flex-direction:column; gap:12px; }
.journal-edit-form .journal-fixed-tags-label:first-of-type { margin-top:4px; }
.journal-readonly-note { display:flex; align-items:center; gap:8px; font-size:var(--fs-1); color:var(--text-muted); background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm); padding:8px 12px; margin-bottom:10px; }
.journal-readonly-note i { color:var(--warning); }
.journal-edit-readonly-content { max-height:46vh; overflow-y:auto; border:1px solid var(--border); border-radius:var(--radius-sm); padding:12px 14px; background:var(--surface-2); margin-bottom:6px; }
.journal-filter-right { display:flex; gap:8px; align-items:center; flex:0 0 auto; flex-wrap:wrap; }
.journal-ym-filter { max-width:160px; }
.journal-entry-content { font-size:.86rem; color:var(--text-secondary); line-height:1.6; white-space:pre-wrap; word-break:break-word; }
.journal-entry-foot { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:8px; font-size:var(--fs-1); color:var(--text-muted); }
.journal-tag { padding:2px 8px; border-radius:var(--radius-xs); background:var(--pink-weak); color:var(--pink); }
.journal-stars { color:var(--warning); letter-spacing:1px; }
.journal-mood { font-size:var(--fs-3); }
.journal-date { margin-left:auto; }
.journal-empty { text-align:center; padding:40px 0; color:var(--text-muted); }
.journal-empty i { font-size:2.4rem; color:var(--text-muted); display:block; margin-bottom:10px; }
@media (max-width:768px) { .journal-compose-foot { flex-wrap:nowrap; gap:6px; } .journal-compose-foot-right { flex:1 1 auto; justify-content:flex-end; min-width:0; gap:6px; } .journal-save-hint { display:none; } .journal-toolbar { gap:8px; } .journal-filter-right { width:100%; } .journal-ym-filter { flex:0 0 auto; max-width:140px; } .journal-search { flex:1 1 auto; width:auto; max-width:100%; min-width:0; } .journal-bucket-items { gap:8px; } .journal-entry { flex:1 1 100%; } }
@media (max-width:768px) {
  .cal-head { flex-direction:column; align-items:stretch; gap:10px; }
  .cal-title { font-size:1rem; }
  .cal-nav { flex-wrap:wrap; justify-content:flex-start; gap:6px; width:100%; }
  .cal-nav .btn { flex:0 0 auto; }
  .cal-nav-text { display:none; }
}
@media (max-width:560px) {
  .cal-nav .btn { padding:5px 9px; font-size:.72rem; }
  .cal-nav #calYearPrev, .cal-nav #calYearNext { padding:5px 7px; }
}

/* 日记图片：附件 / 缩略图 / 时间线网格 / 灯箱 */
.journal-img-attach { display:flex; align-items:center; gap:10px; margin:4px 0 2px; }
.journal-img-hint { font-size:var(--fs-1); color:var(--text-muted); }
.journal-img-grid { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.journal-img-thumb { position:relative; width:84px; height:84px; border-radius:var(--radius-sm); overflow:hidden; border:1px solid var(--border); background:var(--surface-2); flex:none; }
.journal-img-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.journal-img-remove { position:absolute; top:3px; right:3px; width:18px; height:18px; border:none; border-radius:50%; background:rgba(0,0,0,.55); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:.6rem; line-height:1; padding:0; }
.journal-img-remove:hover { background:var(--danger); }
.journal-entry-imgs { display:grid; grid-template-columns:repeat(auto-fill, minmax(96px, 124px)); gap:8px; margin:10px 0 2px; }
.journal-entry-img { width:100%; height:96px; object-fit:cover; border-radius:var(--radius-sm); cursor:pointer; border:1px solid var(--border); transition:.12s var(--ease-out); }
.journal-entry-img:hover { border-color:var(--pink); transform:scale(1.02); }
.journal-lightbox { display:flex; justify-content:center; align-items:center; max-height:78vh; }
.journal-lightbox img { max-width:100%; max-height:78vh; border-radius:var(--radius); box-shadow:0 10px 40px rgba(0,0,0,.35); }

/* ===== 侧栏分组（5.0） ===== */
/* 20260823m：恢复统一间距。首页与「工作」保持和其他分组一样的 8px 上边距，
   使 首页→工作 与 工作→生活→系统 的视觉距离完全一致（此前 l 版把首页贴紧到 0px，
   用户反馈「太近了，应该和其他导航模块保持一定距离」）。 */
.nav-group { margin-top:8px; }
.nav-group-title { font-size:var(--fs-1); font-weight:600; color:var(--text-muted); padding:6px 16px 4px; letter-spacing:.06em; text-transform:uppercase; cursor:pointer; display:flex; align-items:center; justify-content:space-between; user-select:none; }
.nav-group-title i { transition: transform .2s var(--ease-out); font-size:.7rem; opacity:.55; }
.nav-group-tools > .nav-group-title { cursor:pointer; display:flex; align-items:center; justify-content:space-between; }
/* 分组折叠：标题后紧邻的分组容器加 .collapsed 即隐藏（工作/生活/系统 通用，新增分组自动生效）
   同样避开 > 直子，兼容 SimpleBar 包裹 */
.sidebar-nav .nav-group > .nav-group-title + div.collapsed { display:none; }

/* ===== 6.0 Flow Brain 首页三区 ===== */
.brain-card { padding:var(--space-4); }
.brain-q-title { font-size:var(--fs-3); font-weight:700; color:var(--text-secondary); margin-bottom:10px; display:flex; align-items:center; gap:8px; }
.brain-zone { display:flex; flex-direction:column; gap:0; }
.bz-row { display:flex; align-items:center; gap:10px; padding:7px 2px; border-bottom:1px solid var(--border); }
.bz-row:last-child { border-bottom:none; }
.bz-row.done .bz-text { text-decoration:line-through; color:var(--text-muted); }
.bz-check { width:20px; height:20px; border-radius:50%; border:2px solid var(--border); display:inline-flex; align-items:center; justify-content:center; font-size:var(--fs-1); color:white; flex:0 0 auto; cursor:pointer; transition: border-color .12s var(--ease-out), background .12s var(--ease-out); }
.bz-check:hover { border-color:var(--success); }
.bz-check.on { background:var(--success); border-color:var(--success); }
.bz-check.failed { background:var(--danger); border-color:var(--danger); color:#fff; }
.bz-check.failed:hover { border-color:var(--danger); }
.bz-plan-task.failed .bz-plan-task-title { color:var(--text-muted); }
.bz-dot { width:8px; height:8px; border-radius:50%; background:var(--violet); flex:0 0 auto; }
.bz-text { flex:1; font-size:var(--fs-2); color:var(--text-secondary); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bz-tag { font-size:.65rem; padding:2px 8px; border-radius:var(--radius-xs); background:var(--success-weak); color:var(--success); flex:0 0 auto; }
.bz-rel { font-size:var(--fs-1); color:var(--text-muted); font-weight:600; flex:0 0 auto; min-width:48px; }
.bz-anniv { font-size:var(--fs-2); flex:0 0 auto; line-height:1; }
.bz-time { font-size:var(--fs-1); color:var(--text-muted); flex:0 0 auto; }
.bz-more { font-size:var(--fs-2); color:var(--violet); cursor:pointer; padding:4px 2px; }
.bz-more:hover { text-decoration:underline; }
.bz-empty { font-size:var(--fs-2); color:var(--text-muted); padding:12px 14px; text-align:center; background:var(--surface-2); border:1px dashed var(--border); border-radius:var(--radius-sm); }
.bz-empty i { font-size:1.6rem; display:block; margin-bottom:8px; color:var(--accent); opacity:.7; }
.bz-empty p { margin:0 0 3px; font-weight:600; color:var(--text-secondary); }
.bz-empty span { display:block; font-size:var(--fs-2); color:var(--text-muted); line-height:1.6; }
.bz-edit { font-size:var(--fs-1); color:var(--text-muted); cursor:pointer; flex:0 0 auto; padding:2px 6px; border-radius:var(--radius-2xs); transition: .12s var(--ease-out); }
.bz-edit:hover { color:var(--accent); background:var(--accent-weak); }

/* ===== 6.0 首页区：本周主题 / 今日重点 / 本周计划 / 未来30天 ===== */
.brain-theme { font-size:var(--fs-5); color:var(--text-secondary); margin-top:12px; font-weight:700; }
.brain-theme-label { font-size:var(--fs-3); color:var(--success); margin-right:10px; font-weight:700; }
.brain-theme-empty { font-size:var(--fs-4); color:var(--text-muted); font-weight:400; }

/* ===== 首页两卡网格（20260823p 起；20260825f 删书签卡两列；20260825i 去固定高度、字号放大） ===== */
.brain-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:8px; }
.brain-grid .brain-card { display:flex; flex-direction:column; min-height:0; }
#brainZoneSchedule,
#brainWeatherBody { flex:1; min-width:0; }
#brainWeatherBody { display:flex; flex-direction:column; justify-content:center; }
/* 未来30天：首页放大字号（20260825i，仅作用于首页卡，不影响其他 bz-* 组件） */
#brainZoneSchedule .bz-row { padding:9px 2px; }
#brainZoneSchedule .bz-text { font-size:var(--fs-3); }
#brainZoneSchedule .bz-rel { font-size:var(--fs-2); min-width:52px; }
#brainZoneSchedule .bz-more { font-size:var(--fs-2); padding:4px 2px; }
#brainZoneSchedule .bz-dot { width:9px; height:9px; }
#brainZoneSchedule .bz-empty { padding:16px 14px; }

/* ===== 首页：AI 快捷入口 ===== */
.brain-ai-btn {
  display:inline-flex; align-items:center; gap:8px; flex:0 0 auto;
  padding:10px 18px; border-radius:var(--radius-pill);
  border:1px solid var(--border); background:var(--surface); color:var(--accent);
  font-weight:700; font-size:var(--fs-2); cursor:pointer; white-space:nowrap;
  box-shadow:var(--shadow-sm); transition:all .18s var(--ease-out);
}
.brain-ai-btn:hover { background:var(--accent-weak); border-color:var(--accent); transform:translateY(-1px); }
.brain-ai-btn i { font-size:var(--fs-3); }

/* ===== 首页：今日许昌天气 ===== */
.brain-weather { margin-top:20px; margin-bottom:0; }
.brain-weather .brain-q-title { margin-bottom:12px; }
/* 首页天气缩小版：移入网格首格（原"今日重点"位置）。20260825i 字号放大（此前缩过头） */
.brain-grid .brain-weather-inline { padding:var(--space-3); }
.brain-grid .brain-weather-inline .brain-q-title { margin-bottom:6px; font-size:var(--fs-3); }
.brain-grid .brain-weather-inline .brain-weather-summary { gap:10px; margin-bottom:6px; }
.brain-grid .brain-weather-inline .brain-weather-icon { font-size:1.7rem; }
.brain-grid .brain-weather-inline .brain-weather-temp { font-size:1.35rem; }
.brain-grid .brain-weather-inline .brain-weather-desc { font-size:var(--fs-2); }
.brain-grid .brain-weather-inline .brain-weather-chips { gap:6px; margin:6px 0 6px; }
.brain-grid .brain-weather-inline .brain-weather-chip { font-size:11px; padding:2px 8px; }
.brain-grid .brain-weather-inline .brain-weather-sun { gap:8px; margin:0 0 4px; }
.brain-grid .brain-weather-inline .brain-weather-more { margin-top:0; }
.brain-weather-refresh {
  margin-left:auto; width:30px; height:30px; border-radius:50%;
  border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted);
  cursor:pointer; display:inline-flex; align-items:center; justify-content:center;
  font-size:var(--fs-2); transition:all .15s var(--ease-out);
}
.brain-weather-refresh:hover { color:var(--accent); border-color:var(--accent); background:var(--accent-weak); }
.brain-weather-body { font-size:var(--fs-2); color:var(--text-secondary); line-height:1.7; }
.brain-weather-loading { color:var(--text-muted); }
.brain-weather-summary { display:flex; align-items:center; gap:14px; margin-bottom:10px; }
.brain-weather-icon { font-size:2.6rem; color:var(--accent); flex:0 0 auto; line-height:1; }
.brain-weather-now { display:flex; flex-direction:column; }
.brain-weather-temp { font-size:2rem; font-weight:700; color:var(--text-primary); line-height:1; }
.brain-weather-desc { font-size:var(--fs-2); color:var(--text-secondary); margin-top:4px; }
/* 指标改为统一小药丸标签，与其它模块（.bz-tag）风格对齐 */
.brain-weather-chips { display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 12px; }
.brain-weather-chip {
  display:inline-flex; align-items:baseline; gap:4px;
  font-size:var(--fs-1); color:var(--text-muted);
  background:var(--surface-2); border:1px solid var(--border);
  border-radius:var(--radius-xs); padding:3px 9px; line-height:1.55;
  white-space:nowrap;
}
.brain-weather-chip b { color:var(--text-secondary); font-weight:600; }
/* 日出 / 日落 */
.brain-weather-sun { display:flex; flex-wrap:wrap; gap:18px; margin:0 0 12px; font-size:var(--fs-1); color:var(--text-secondary); }
.brain-weather-sun span { display:inline-flex; align-items:center; gap:6px; }
.brain-weather-sun i { color:var(--accent); font-size:.95rem; }
.brain-weather-more { margin-top:2px; }
.brain-weather-link { font-size:var(--fs-1); color:var(--accent); cursor:pointer; transition:opacity .15s var(--ease-out); }
.brain-weather-link:hover { opacity:.78; text-decoration:underline; }
.brain-weather-brief { border-top:1px solid var(--border); padding-top:12px; margin-top:4px; }
.brain-weather-brief b { color:var(--text-primary); }
.brain-weather-note {
  margin-top:8px; font-size:var(--fs-1); color:var(--text-muted); line-height:1.6;
  background:var(--surface-2); border:1px dashed var(--border); border-radius:var(--radius-sm); padding:10px 12px;
}
.brain-weather-note i { color:var(--accent); margin-right:4px; }
.brain-weather-src {
  margin-top:10px; font-size:11px; color:var(--text-muted); opacity:.75; letter-spacing:.2px;
  display:flex; align-items:center; gap:4px;
}
.brain-weather-src::before { content:"\f0ec"; font-family:"Font Awesome 6 Free"; font-weight:900; font-size:10px; opacity:.8; }
.brain-weather-actions { margin-top:12px; }
.brain-weather-ai-btn {
  display:inline-flex; align-items:center; gap:6px; cursor:pointer;
  font-size:var(--fs-1); color:var(--accent);
  background:var(--accent-weak); border:1px solid var(--accent-weak);
  border-radius:var(--radius-sm); padding:6px 12px; transition:.15s;
}
.brain-weather-ai-btn:hover { border-color:var(--accent); }
.brain-weather-ai-btn i { font-size:.85em; }

/* ===== 工具：天气（7天预报 + 详细信息） ===== */
.ww-wrap { max-width:900px; margin:0 auto; padding:4px 2px; }
.ww-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.ww-city-pick { display:flex; align-items:center; gap:8px; }
.ww-city-pick > i { color:var(--accent); font-size:1.05rem; }
.ww-city-select { font-size:1rem; font-weight:700; color:var(--text-primary); background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-pill); padding:7px 10px; max-width:200px; cursor:pointer; transition:all .18s var(--ease-out); }
.ww-city-select:hover { border-color:var(--accent); }
.ww-city-select:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-weak); }
.ww-city-add { background:var(--surface-2); border:1px solid var(--border); color:var(--text-secondary); width:32px; height:32px; border-radius:var(--radius-pill); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:all .18s var(--ease-out); }
.ww-city-add:hover { border-color:var(--accent); color:var(--accent); }
.ww-refresh { background:var(--surface-2); border:1px solid var(--border); color:var(--text-secondary); width:38px; height:38px; border-radius:var(--radius-pill); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:all .18s var(--ease-out); }
.ww-refresh:hover { border-color:var(--accent); color:var(--accent); }

.ww-current { display:flex; align-items:center; gap:18px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-xl); padding:22px 24px; margin-bottom:24px; }
.ww-cur-icon { font-size:3.4rem; color:var(--accent); flex:0 0 auto; line-height:1; }
.ww-cur-main { display:flex; flex-direction:column; }
.ww-cur-temp { font-size:2.7rem; font-weight:700; color:var(--text-primary); line-height:1; }
.ww-cur-desc { font-size:1.1rem; color:var(--text-secondary); margin-top:4px; }
.ww-cur-sub { font-size:.85rem; color:var(--text-muted); margin-top:6px; }

.ww-section-title { font-size:.95rem; font-weight:700; color:var(--text-secondary); margin:0 0 12px; }
.ww-forecast { display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:10px; margin-bottom:28px; }
.ww-day { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:14px 8px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:6px; }
.ww-day-name { font-weight:700; color:var(--text-primary); font-size:.9rem; }
.ww-day-date { font-size:.72rem; color:var(--text-muted); }
.ww-day-icon { font-size:1.55rem; color:var(--accent); }
.ww-day-temp { font-size:.85rem; white-space:nowrap; }
.ww-hi { color:var(--text-primary); font-weight:600; }
.ww-lo { color:var(--text-muted); margin-left:4px; }
.ww-day-precip { font-size:.72rem; color:var(--accent); display:flex; align-items:center; gap:3px; }

.ww-details { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:10px; }
.ww-detail { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:12px 14px; }
.ww-detail-label { font-size:.78rem; color:var(--text-muted); margin-bottom:4px; }
.ww-detail-val { font-size:1.05rem; font-weight:600; color:var(--text-primary); }

.ww-error { color:var(--text-muted); padding:20px; text-align:center; }
.ww-error i { color:var(--danger); margin-right:4px; }

@media (max-width:640px) {
  .ww-forecast { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:84px; overflow-x:auto; padding-bottom:6px; }
  .ww-cur-temp { font-size:2.2rem; }
  .ww-cur-icon { font-size:2.8rem; }
}

/* ===== 总结模块 ===== */
.summary-wrap { display:flex; flex-direction:column; gap:14px; }
.summary-head { display:flex; justify-content:flex-end; }
.summary-list { display:flex; flex-direction:column; gap:10px; }
.summary-empty { color:var(--text-muted); font-size:var(--fs-1); padding:24px 0; text-align:center; background:var(--surface-2); border:1px dashed var(--border); border-radius:var(--radius); }
.summary-item { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:12px 14px; cursor:pointer; transition:.15s; }
.summary-item:hover { border-color:var(--accent); background:var(--surface-2); }
.summary-item-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.summary-item-title { font-weight:600; color:var(--text-primary); }
.summary-item-type { font-size:11px; color:var(--text-muted); background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:1px 8px; flex:0 0 auto; }
.summary-item-meta { margin-top:4px; font-size:var(--fs-1); color:var(--text-muted); }

/* ===== 6.1 Today Lens 快速捕捉 ===== */
.bz-quickadd { display:flex; align-items:center; gap:8px; margin-top:12px; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius); padding:6px 10px; }
.bz-quickadd-input {
  flex:1; height:36px; border-radius:var(--radius-xs); border:1px solid var(--border);
  background:transparent; padding:0 12px; font-size:var(--fs-2); color:var(--text-secondary);
  transition: .15s var(--ease-out); outline:none; font-family:var(--font-sans);
}
.bz-quickadd-input::placeholder { color:var(--text-muted); }
.bz-quickadd-input:focus { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-weak); }
.bz-quickadd .btn-sm { height:36px; padding:0 12px; border-radius:var(--radius-xs); flex:0 0 auto; }
#brainZoneToday .bz-row { cursor:pointer; transition: background .12s var(--ease-out), transform .08s var(--ease-out); }
#brainZoneToday .bz-row:hover { border-color:var(--success); }
#brainZoneToday .bz-row:active { transform:scale(.992); }
.bz-plan-goal { font-size:var(--fs-2); color:var(--text-secondary); background:var(--success-weak); border:1px solid var(--success-weak); border-radius:var(--radius-xs); padding:8px 12px; margin-bottom:10px; }
.bz-plan-goal-label { font-size:var(--fs-1); color:var(--success); font-weight:700; margin-right:8px; }
.bz-plan-days { display:flex; flex-direction:column; gap:8px; }
.bz-plan-day { border:1px solid var(--border); border-radius:var(--radius-sm); padding:10px 14px; background:var(--surface); transition: border-color .15s var(--ease-out); }
.bz-plan-day-today { border-color:var(--success); box-shadow:0 0 0 1px var(--success-weak); background:var(--success-weak); }
.bz-plan-day-head { display:flex; align-items:baseline; gap:8px; margin-bottom:6px; }
.bz-plan-day-head .bz-plan-add { margin-left:auto; width:22px; height:22px; border-radius:50%; border:1px solid var(--border); background:transparent; color:var(--text-muted); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; font-size:.7rem; flex-shrink:0; transition: .12s var(--ease-out); }
.bz-plan-day-head .bz-plan-add:hover { border-color:var(--accent); color:var(--accent); background:var(--accent-weak); }
.bz-plan-day-label { font-size:var(--fs-2); font-weight:700; color:var(--text-primary); }
.bz-plan-day-date { font-size:var(--fs-1); color:var(--text-muted); font-weight:500; }
.bz-plan-day-tasks { display:flex; flex-direction:column; gap:4px; }
.bz-plan-task { display:flex; align-items:center; gap:8px; font-size:var(--fs-2); color:var(--text-secondary); }
.bz-plan-task.done .bz-plan-task-title { text-decoration:line-through; color:var(--text-muted); }
.bz-plan-task-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bz-plan-empty { font-size:var(--fs-2); color:var(--text-muted); padding:4px 0; }
/* 首页本周计划：日历日程同步行（20261013c） */
.bz-plan-day-cals { display:flex; flex-direction:column; gap:3px; margin-top:4px; }
.bz-plan-cal-event { display:flex; align-items:center; gap:5px; padding:3px 7px; border-radius:var(--radius-2xs); background:var(--surface-2); border-left:2px solid var(--accent); cursor:pointer; font-size:var(--fs-1); color:var(--text-secondary); }
.bz-plan-cal-event:hover { background:var(--accent-weak); }
.bz-plan-cal-event .plan-cal-dot { font-size:.68rem; flex-shrink:0; }
.bz-plan-cal-event .plan-cal-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bz-plan-backlog { margin-top:10px; border-top:1px dashed var(--border); padding-top:8px; }
.bz-plan-backlog-head { font-size:var(--fs-1); color:var(--text-muted); font-weight:600; margin-bottom:5px; }
.bz-plan-count { background:var(--violet-weak); color:var(--violet); border-radius:var(--radius-2xs); padding:1px 7px; font-size:var(--fs-1); }
.brain-zone .bz-plan-days { display:grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.brain-zone .bz-plan-day { padding: 10px 12px; border-left: 3px solid var(--border); }
.brain-zone .bz-plan-day-today { border-left-color: var(--success); }

/* 首页本周计划翻周器（20260823t，与计划模块一致：上一周 / 下一周 / 回到本周） */
.bz-plan-pager { display:flex; align-items:center; gap:6px; margin-bottom:10px; flex-wrap:wrap; }
.bz-plan-pager-btn {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:30px; height:30px; padding:0 9px;
  border:1px solid var(--border); border-radius:var(--radius-sm);
  background:var(--surface-2); color:var(--text-secondary);
  cursor:pointer; font-size:var(--fs-1); line-height:1;
  transition:border-color .15s var(--ease-out), color .15s var(--ease-out), background .15s var(--ease-out);
}
.bz-plan-pager-btn:hover { border-color:var(--border-strong); color:var(--text-primary); background:var(--surface-3); }
.bz-plan-pager-label { font-size:var(--fs-1); color:var(--text-secondary); font-weight:600; white-space:nowrap; margin:0 2px; }
.bz-plan-today { font-weight:700; color:var(--accent); }

/* ===== 7.0 任务库 ===== */
.task-item { display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); }
.task-item-done { opacity:.6; }
.task-item-main { flex:1; min-width:0; }
.task-item-title { font-size:var(--fs-3); font-weight:600; color:var(--text-secondary); }
.task-item-actions { display:flex; gap:4px; flex:0 0 auto; }
.task-search { width:100%; }
.task-chip { border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); padding:5px 12px; border-radius:var(--radius-xs); font-size:var(--fs-2); font-weight:600; cursor:pointer; transition: .15s var(--ease-out); }
.task-chip:hover { color:var(--text-secondary); border-color:var(--border-strong); }
.task-chip.active { background:var(--accent); border-color:var(--accent); color:#fff; }
.dark .task-chip.active { color:var(--on-primary); }

/* 日期分组 */
.task-group { margin-top:14px; }
.task-group:first-child { margin-top:0; }
.task-group-head { display:flex; align-items:center; justify-content:space-between; font-size:var(--fs-2); font-weight:700; color:var(--text-muted); padding:2px 4px 8px; letter-spacing:.04em; cursor:pointer; user-select:none; }
.task-group-cnt { font-size:var(--fs-1); color:var(--text-muted); font-weight:600; }
.task-group .task-item + .task-item { margin-top:8px; }
.task-top { padding:var(--space-4); display:flex; flex-direction:column; gap:var(--space-3); border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.task-top-row { display:flex; gap:8px; align-items:center; }
.task-top-row .form-input { flex:1; min-width:0; }
.task-top-chips { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.task-top-chips .task-search { flex:1; min-width:120px; }
.task-group-caret { font-size:.68rem; color:var(--text-muted); transition: transform .15s var(--ease-out); margin-right:2px; }
.task-group.collapsed .task-group-caret { transform:rotate(-90deg); }
.task-group-label { flex:1; }
.task-group-body { margin-top:8px; }
.task-group.collapsed .task-group-body { display:none; }
.task-check { flex:0 0 auto; width:20px; height:20px; border-radius:50%; border:2px solid var(--border); background:transparent; cursor:pointer; transition: .15s var(--ease-out); position:relative; }
.task-check:hover { border-color:var(--success); }
.task-item-done .task-check { border-color:var(--success); background:var(--success); }
.task-item-done .task-check::after { content:''; position:absolute; left:6px; top:1px; width:5px; height:10px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); }
/* 失败态（三态圆圈）：红色 ✕ */
.task-item-failed .task-check { border-color:var(--danger); background:var(--danger); }
.task-item-failed .task-check::after { content:'✕'; position:absolute; left:50%; top:50%; width:auto; height:auto; border:none; transform:translate(-50%,-51%); color:#fff; font-size:.72rem; font-weight:700; line-height:1; }
/* 20261015a：失败原因小字 */
.task-fail-reason { font-size:var(--fs-1); color:var(--danger); opacity:.9; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; cursor:help; }
.task-date-label { font-size:var(--fs-1); color:var(--text-muted); margin-top:2px; }
.task-focus-label { font-size:var(--fs-1); color:var(--accent); margin-top:2px; font-weight:600; }

/* ===== FlowOS 目标执行中心（目标任务卡片 / 详情执行空间） ===== */

/* 目标卡片区 */
.goal-cards { display:flex; flex-direction:column; gap:10px; margin-bottom:14px; }
.goal-card { padding:12px 14px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); cursor:pointer; transition:.15s var(--ease-out); }
.goal-card:hover { border-color:var(--border-strong); box-shadow:var(--shadow-sm); transform:translateY(-1px); }
.goal-card-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; }
.goal-card-name { font-size:var(--fs-3); font-weight:700; color:var(--text-secondary); }
.goal-card-pct { font-size:var(--fs-3); font-weight:700; color:var(--accent); }
.goal-card-bar { height:6px; border-radius:var(--radius-xs); background:var(--surface-2); overflow:hidden; }
.goal-card-fill { height:100%; background:linear-gradient(90deg,var(--accent),var(--success)); border-radius:var(--radius-xs); transition:width .3s var(--ease-out); }
.goal-card-meta { margin-top:6px; font-size:var(--fs-1); color:var(--text-muted); }

/* 目标详情执行空间 */
.goal-detail { display:flex; flex-direction:column; gap:14px; padding:4px 2px; }
.gd-back { display:inline-flex; align-items:center; gap:6px; font-size:var(--fs-2); font-weight:600; color:var(--text-muted); cursor:pointer; width:fit-content; }
.gd-back:hover { color:var(--accent); }
.gd-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.gd-title { font-size:var(--fs-5); font-weight:700; color:var(--text-secondary); }
.gd-actions { flex:0 0 auto; }
.gd-stats { display:flex; gap:10px; flex-wrap:wrap; }
.gd-field { display:flex; flex-direction:column; gap:2px; padding:8px 14px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); font-size:var(--fs-3); font-weight:700; color:var(--text-secondary); flex:1; min-width:120px; }
.gd-field span { font-size:var(--fs-1); font-weight:600; color:var(--text-muted); }
.gd-bar { height:8px; border-radius:var(--radius-xs); background:var(--surface-2); overflow:hidden; }
.gd-bar-fill { height:100%; background:linear-gradient(90deg,var(--accent),var(--success)); border-radius:var(--radius-xs); transition:width .3s var(--ease-out); }
.gd-section { border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); padding:12px 14px; }
.gd-section-head { display:flex; align-items:center; justify-content:space-between; font-size:var(--fs-2); font-weight:700; color:var(--text-secondary); margin-bottom:10px; }
.gd-add { width:26px; height:26px; border-radius:50%; border:1px solid var(--border); background:var(--surface-2); color:var(--text-muted); cursor:pointer; font-size:var(--fs-1); display:inline-flex; align-items:center; justify-content:center; transition:.15s var(--ease-out); }
.gd-add:hover { color:var(--accent); border-color:var(--accent); background:var(--accent-weak); }
.gd-subtasks { display:flex; flex-direction:column; gap:8px; }

/* 关联项（日程/笔记/提醒） */
.rel-item { display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface-2); font-size:var(--fs-2); color:var(--text-secondary); }
.rel-item i { color:var(--accent); width:16px; text-align:center; }
.rel-empty { padding:10px; text-align:center; font-size:var(--fs-1); color:var(--text-muted); }

/* 时间线 */
.tl-item { display:flex; align-items:center; gap:10px; padding:7px 0; border-bottom:1px solid var(--border); font-size:var(--fs-2); }
.tl-item:last-child { border-bottom:none; }
.tl-time { flex:0 0 auto; color:var(--text-muted); font-variant-numeric:tabular-nums; }
.tl-label { flex:0 0 auto; font-weight:600; color:var(--text-secondary); }
.tl-extra { color:var(--text-muted); margin-left:auto; }

/* ===== 5.0 计划视图切换（今天/明天/本周） ===== */
/* ===== 5.0 本周计划池 + 概览 ===== */
.wo-block { margin-top:14px; }
.wo-summary { display:flex; align-items:baseline; gap:10px; }
.wo-summary-num { font-family:var(--font-display); font-size:1.5rem; font-weight:600; color:var(--text-primary); font-variant-numeric:tabular-nums; letter-spacing:-0.02em; }
.wo-summary-rate { font-size:var(--fs-2); color:var(--text-muted); }
.wo-bar { height:8px; background:var(--violet-weak); border-radius:var(--radius-2xs); overflow:hidden; margin:8px 0 14px; }
.wo-bar-fill { height:100%; border-radius:var(--radius-2xs); transition: width .2s var(--ease-out); }
.wo-empty { font-size:var(--fs-2); color:var(--text-muted); margin-top:10px; }
.wo-days { display:grid; grid-template-columns:repeat(7,1fr); gap:8px; }
.wo-day { text-align:center; }
.wo-day-label { font-size:var(--fs-1); color:var(--text-muted); margin-bottom:6px; }
.wo-day-bar { height:48px; background:var(--violet-weak); border-radius:var(--radius-2xs); display:flex; align-items:flex-end; overflow:hidden; }
.wo-day-fill { width:100%; border-radius:var(--radius-2xs) 8px 0 0; }
.wo-day-empty .wo-day-bar { background:var(--surface-3); }
.wo-day-meta { font-size:.66rem; color:var(--text-muted); margin-top:4px; }
.wo-day-today .wo-day-label { color:var(--violet); font-weight:700; }
.wo-day-today .wo-day-bar { box-shadow:0 0 0 2px var(--violet-weak); }
@media (max-width:480px){ .wo-days { gap:4px; } .wo-day-label { font-size:.58rem; } .wo-day-bar { height:36px; } }

/* ===== 5.0 本周成长报告 ===== */

/* ===== 6.1 总结·成长分析中心 ===== */

/* ===== 5.0 模块边界说明 ===== */
.module-boundary-note { background:var(--violet-weak); border:1px solid var(--border); border-left:3px solid var(--violet); border-radius:var(--radius-xs); padding:10px 12px; font-size:var(--fs-2); color:var(--text-secondary); line-height:1.6; margin-bottom:14px; }
.module-boundary-note b { color:var(--violet); }
.module-boundary-note { cursor:default; }
.module-boundary-note summary { cursor:pointer; list-style:none; display:flex; align-items:center; gap:6px; font-weight:600; color:var(--text-secondary); }
.module-boundary-note summary::-webkit-details-marker { display:none; }
.module-boundary-note summary::marker { content:''; }
.module-boundary-note > p { margin:8px 0 0; font-weight:400; }

/* 模块卡片收敛到统一表面/边框（结构不变） */
.habit-card, .daily-item, .inbox-item, .journal-entry, .task-item, .plan-day,
.pwd-item, .bz-stat, .module-boundary-note {
  background:var(--surface); border:1px solid var(--border);
}

/* 顶栏右侧日期 */
.top-date { margin-left:auto; font-size:var(--fs-2); color:var(--text-muted); white-space:nowrap; padding-right:4px; }

/* 设置弹窗结构类 */
.setting-actions { display:flex; align-items:center; gap:8px; margin-top:6px; flex-wrap:wrap; }
.setting-hint { font-size:var(--fs-1); color:var(--text-muted); margin-top:4px; line-height:1.5; }
.setting-divider { margin-top:12px; border-top:1px solid var(--border); padding-top:12px; }
.history-list { margin-top:10px; max-height:240px; overflow-y:auto; display:flex; flex-direction:column; gap:8px; }
.history-item { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 10px; border:1px solid var(--border); border-radius:8px; background:var(--bg-elevated, rgba(127,127,127,0.06)); }
.history-ts { font-size:var(--fs-1); color:var(--text); font-variant-numeric:tabular-nums; }

/* Task: 加入今日 快捷操作 */
.task-today-btn { flex:0 0 auto; width:32px; height:32px; border:none; background:transparent; color:var(--text-muted); border-radius:var(--radius-xs); cursor:pointer; font-size:var(--fs-2); display:inline-flex; align-items:center; justify-content:center; transition: .15s var(--ease-out); }
.task-today-btn:hover { color:var(--warning); background:var(--warning-weak); }

/* ===== 排版：标题防难看断行（taste: 强层级、对齐讲究） ===== */
.sidebar-logo-text, .top-title, .modal-title, .brain-date, .daily-date, .ws-val, .wo-summary-num { text-wrap: balance; }

/* ===== 无障碍：尊重「减少动态效果」偏好 ===== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ===== 书签（Bookmark，由信息中心精简保留） ===== */
.hub-wrap { display:flex; flex-direction:column; gap:16px; max-width:1080px; margin:0 auto; }
.hub-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.hub-head-left { min-width:0; }
.hub-title { font-size:var(--fs-5, 1.4rem); font-weight:700; color:var(--text-secondary); letter-spacing:-0.01em; }
.hub-sub { font-size:var(--fs-2); color:var(--text-muted); margin-top:2px; }
.hub-head-actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.hub-stats { display:grid; grid-template-columns:repeat(4, 1fr); gap:10px; }
.hub-stat { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); padding:12px 14px; }
.hub-stat-n { font-family:var(--font-display, inherit); font-size:1.5rem; font-weight:700; font-variant-numeric:tabular-nums; line-height:1; }
.hub-stat-l { font-size:var(--fs-1); color:var(--text-muted); margin-top:4px; }
.hub-cols { display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start; }
.hub-col { display:flex; flex-direction:column; }
.hub-col-head { display:flex; align-items:center; gap:8px; font-size:var(--fs-3); font-weight:700; color:var(--text-secondary); padding:12px 14px; border-bottom:1px solid var(--border); }
.hub-col-head i { color:var(--accent); }
.hub-count { margin-left:auto; font-size:var(--fs-1); font-weight:600; color:var(--text-muted); background:var(--surface-2); border-radius:999px; padding:1px 9px; }
.hub-list { display:flex; flex-direction:column; gap:10px; padding:12px 14px; }
.hub-empty { text-align:center; color:var(--text-muted); font-size:var(--fs-2); line-height:1.8; padding:20px 8px; }
.hub-col-toggle { cursor:pointer; transition:transform .2s var(--ease-out); color:var(--text-muted); font-size:.8rem; }
.hub-col-toggle.collapsed { transform:rotate(-90deg); }
.hub-chk { display:inline-flex; align-items:center; margin-right:6px; }
.hub-batchbar { display:flex; align-items:center; gap:8px; padding:8px 10px; background:var(--surface-2); border-radius:10px; margin:8px 14px 0; flex-wrap:wrap; }
.hub-batchbar input[type=checkbox] { margin-right:4px; }
.hub-bookmarks { padding:16px; }
/* 顶栏书签（Edge 风格横条，位于顶栏「首页」标题右侧，仅首页显示；20260825f） */
#topBmBar { display:flex; align-items:center; gap:4px; flex:0 0 auto; min-width:0; margin-left:4px; }
/* 顶栏书签入口按钮（20260826b：纯图标，不夺「首页」/日期注意力，折叠态） */
.bm-entry { display:inline-flex; align-items:center; justify-content:center; padding:5px 8px; border:1px solid var(--border); border-radius:8px; background:var(--surface-2); color:var(--text-secondary); font-family:inherit; cursor:pointer; flex:0 0 auto; transition:background .13s var(--ease-out), color .13s var(--ease-out), border-color .13s var(--ease-out); }
.bm-entry:hover { background:var(--surface-3); color:var(--text-primary); border-color:var(--border-strong); }
.bm-entry i { font-size:.82rem; color:var(--accent); flex:none; }
.bm-entry-label { display:none; }
.bm-top { display:inline-flex; align-items:center; gap:5px; padding:4px 9px; border:none; background:transparent; border-radius:8px; color:var(--text-secondary); font-size:.78rem; cursor:pointer; white-space:nowrap; flex:0 0 auto; font-family:inherit; transition:background .13s var(--ease-out), color .13s var(--ease-out); }
.bm-top:hover { background:var(--surface-3); color:var(--text-primary); }
.bm-top i { font-size:.7rem; color:var(--text-muted); flex:none; }
/* 文件夹：浅底胶囊 + 中性图标（20260825g 去掉黄色 warning，更贴近 Edge 收藏夹按钮） */
.bm-top-folder { background:var(--surface-2); border:1px solid var(--border); }
.bm-top-folder:hover { background:var(--surface-3); border-color:var(--border-strong); }
.bm-top-folder i { color:var(--text-secondary); }
.bm-top-hint { display:inline-flex; align-items:center; gap:5px; padding:4px 9px; color:var(--text-muted); font-size:.78rem; white-space:nowrap; }
/* favicon 图标：字母色块占位，网站图标加载成功后覆盖（Edge 风格，20260825h） */
.bm-fav-ico { position:relative; width:16px; height:16px; flex:0 0 auto; }
.bm-fav-ico .bm-fav-ch { position:absolute; inset:0; border-radius:5px; background:var(--accent-weak); color:var(--accent); font-size:.62rem; font-weight:700; display:flex; align-items:center; justify-content:center; }
.bm-fav-ico img { position:absolute; inset:0; width:16px; height:16px; border-radius:4px; background:#fff; object-fit:contain; }
.bm-top-add { color:var(--text-muted); }
.bm-top-add:hover { color:var(--accent); background:var(--accent-weak); }
.bm-top-import { color:var(--text-muted); }
.bm-top-import:hover { color:var(--accent); background:var(--accent-weak); }
.bm-top-label { max-width:120px; overflow:hidden; text-overflow:ellipsis; }
/* 文件夹下拉：行尾「⋯」弹出管理菜单（20260825j 取代 hover 三按钮） */
.bm-more { flex:none; padding:3px 5px; border-radius:6px; color:var(--text-muted); cursor:pointer; font-size:.72rem; line-height:1; margin-left:4px; }
.bm-more:hover { color:var(--accent); background:var(--surface-3); }

/* 书签弹出面板（20260826a）：复用 .menu-pop 基础样式，仅补齐内部布局 */
#bmPopover { min-width:200px; max-width:264px; max-height:62vh; overflow-y:auto; padding:6px; }
.bm-pop-head { display:flex; align-items:center; gap:8px; padding:6px 8px 8px; font-weight:600; font-size:.82rem; color:var(--text-primary); border-bottom:1px solid var(--border); margin-bottom:4px; }
.bm-pop-head i { color:var(--accent); font-size:.8rem; }
.bm-pop-list { display:flex; flex-direction:column; }
.bm-pop-group { margin-bottom:2px; }
.bm-pop-group-name { display:flex; align-items:center; gap:6px; width:100%; padding:6px 8px; border:none; background:transparent; border-radius:6px; font-size:.68rem; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--text-muted); cursor:pointer; font-family:inherit; transition:background .12s var(--ease-out), color .12s var(--ease-out); }
.bm-pop-group-name:hover { background:var(--surface-3); color:var(--text-secondary); }
.bm-pop-caret { font-size:.58rem; transition:transform .15s var(--ease-out); flex:none; }
.bm-pop-group:not(.collapsed) > .bm-pop-group-name .bm-pop-caret { transform:rotate(90deg); }
.bm-pop-items { display:flex; flex-direction:column; }
.bm-pop-group.collapsed > .bm-pop-items { display:none; }
.bm-pop-count { display:inline-flex; align-items:center; justify-content:center; min-width:16px; height:16px; padding:0 5px; border-radius:10px; background:var(--surface-3); font-size:.6rem; color:var(--text-secondary); font-weight:600; margin-left:auto; flex:none; }
.bm-pop-link { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:inherit; text-decoration:none; }
.bm-pop-sep { height:1px; background:var(--border); margin:6px 4px 5px; }
.bm-pop-foot { display:flex; gap:6px; }
.bm-pop-add, .bm-pop-import { flex:1; display:flex; align-items:center; justify-content:center; gap:5px; padding:7px 6px; border:1px solid var(--border); border-radius:var(--radius-xs); background:var(--surface-2); color:var(--text-secondary); font-size:.74rem; font-family:inherit; cursor:pointer; transition:background .13s var(--ease-out), color .13s var(--ease-out), border-color .13s var(--ease-out); }
.bm-pop-add:hover, .bm-pop-import:hover { background:var(--surface-3); color:var(--accent); border-color:var(--border-strong); }
.bm-pop-empty { padding:16px 10px; text-align:center; color:var(--text-muted); font-size:.78rem; line-height:1.6; }
.hub-bm-group { margin-bottom:8px; }
.hub-bm-group-head { display:flex; align-items:center; gap:8px; cursor:pointer; padding:7px 10px; background:var(--surface-2); border-radius:8px; font-weight:600; font-size:.85rem; color:var(--text-secondary); }
.hub-bm-caret { color:var(--text-muted); font-size:.72rem; width:12px; text-align:center; transition:transform .15s var(--ease-out); }
.hub-bm-group-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hub-bm-group-count { color:var(--text-muted); font-weight:400; font-size:.76rem; }
.hub-bm-group { margin-bottom:8px; }
.hub-bm-group-head { display:flex; align-items:center; gap:8px; cursor:pointer; padding:7px 10px; background:var(--surface-2); border-radius:8px; font-weight:600; font-size:.85rem; color:var(--text-secondary); transition:background .13s var(--ease-out); }
.hub-bm-group-head:hover { background:var(--surface-3); }
.hub-bm-group.collapsed .hub-bm-caret { transform:rotate(90deg); }
.hub-bm-group:last-child { margin-bottom:0; }
.hub-bm-items { display:block; padding:2px 0; }
.hub-bm-row { display:flex; align-items:center; gap:8px; padding:6px 8px; border-bottom:1px solid var(--border); }
.hub-bm-row:last-child { border-bottom:none; }
.hub-bm-link { flex:1; min-width:0; color:var(--accent); text-decoration:none; font-size:.85rem; display:flex; align-items:center; gap:6px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hub-bm-link:hover { text-decoration:underline; }
.hub-bm-link i { color:var(--text-muted); flex:none; }
.hub-bm-del { border:none; background:transparent; color:var(--text-muted); cursor:pointer; padding:2px 4px; border-radius:6px; flex:none; margin-left:2px; }
.hub-bm-del:hover { background:rgba(229,115,107,.12); color:var(--danger); }
.hub-bm-edit, .hub-bm-move { border:none; background:transparent; color:var(--text-muted); cursor:pointer; padding:2px 4px; border-radius:6px; flex:none; margin-left:2px; }
.hub-bm-edit:hover { background:rgba(94,106,210,.12); color:var(--accent); }
.hub-bm-move:hover { background:rgba(52,178,122,.12); color:var(--success); }
/* 安全中心：头部操作按钮 */
.se-actions { display:flex; gap:8px; flex:none; }
.se-btn { border:1px solid var(--border); background:var(--surface-2); color:var(--text-secondary); font-size:.8rem; font-weight:600; padding:5px 12px; border-radius:8px; cursor:pointer; transition:border-color .15s var(--ease-out), background .15s var(--ease-out); }
.se-btn:hover { border-color:var(--border-strong); background:var(--surface); }
.se-btn-danger { color:var(--danger); border-color:rgba(229,115,107,.4); }
.se-btn-danger:hover { background:rgba(229,115,107,.12); border-color:var(--danger); }

/* 来源卡片 */
.hub-source { border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); padding:12px 14px; display:flex; flex-direction:column; gap:8px; transition:border-color .15s var(--ease-out); }
.hub-source:hover { border-color:var(--border-strong, var(--border)); }
.hub-source-row1 { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.hub-source-name { font-size:var(--fs-3); font-weight:700; color:var(--text-secondary); margin-right:auto; }
.hub-badge { font-size:var(--fs-1); font-weight:600; color:var(--text-muted); background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:2px 9px; display:inline-flex; align-items:center; gap:5px; }
.hub-status { font-size:var(--fs-1); font-weight:600; padding:2px 9px; border-radius:999px; }
.hub-status-active { color:var(--success); background:var(--success-weak, rgba(52,178,122,.12)); }
.hub-status-paused { color:var(--warning); background:var(--warning-weak, rgba(217,162,59,.12)); }
.hub-status-archived { color:var(--text-muted); background:var(--surface-2); }
.hub-source-meta { font-size:var(--fs-1); color:var(--text-muted); line-height:1.5; word-break:break-all; }
.hub-source-runs { font-size:var(--fs-1); color:var(--text-muted); line-height:1.5; }
.hub-source-actions { display:flex; gap:6px; flex-wrap:wrap; }

/* 信息条目 */
.hub-info { display:flex; align-items:flex-start; gap:10px; padding:10px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); cursor:pointer; transition:border-color .15s var(--ease-out), background .15s var(--ease-out); }
.hub-info:hover { border-color:var(--accent); background:var(--accent-weak, rgba(94,106,210,.06)); }
.hub-info-main { min-width:0; flex:1; }
.hub-info-title { font-size:var(--fs-2); font-weight:600; color:var(--text-secondary); }
.hub-info-sum { font-size:var(--fs-1); color:var(--text-muted); margin-top:2px; line-height:1.5; }
.hub-info-meta { font-size:var(--fs-1); color:var(--text-muted); margin-top:4px; display:flex; gap:8px; flex-wrap:wrap; }
.hub-info-src { color:var(--accent); }
.hub-info-tags { display:flex; gap:5px; flex-wrap:wrap; margin-top:5px; }
.hub-tag { font-size:var(--fs-1); color:var(--text-muted); background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:1px 8px; }
.hub-info-link { flex:0 0 auto; align-self:center; color:var(--text-muted); font-size:var(--fs-2); }
.hub-info-link:hover { color:var(--accent); }

/* 信息详情 */
.hub-detail { display:flex; flex-direction:column; gap:12px; }
.hub-detail-meta { display:flex; gap:12px; font-size:var(--fs-1); color:var(--text-muted); }
.hub-detail-title { font-size:var(--fs-4, 1.15rem); font-weight:700; color:var(--text-secondary); margin:0; }
.hub-detail-link { font-size:var(--fs-2); }
.hub-detail-link a { color:var(--accent); word-break:break-all; }
.hub-detail-block { font-size:var(--fs-2); color:var(--text-secondary); line-height:1.6; }
.hub-detail-label { font-size:var(--fs-1); font-weight:700; color:var(--text-muted); margin-bottom:3px; text-transform:uppercase; letter-spacing:.04em; }
.hub-raw { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-xs); padding:10px 12px; font-size:var(--fs-1); color:var(--text-muted); white-space:pre-wrap; word-break:break-word; max-height:200px; overflow:auto; margin:0; }

/* 小按钮（与现有 .btn 体系一致） */
.btn-xs { padding:4px 9px; font-size:var(--fs-1); border-radius:var(--radius-xs); }

/* 操作入口弹窗菜单（整合原散落按钮） */
.hub-actions-menu { display:flex; flex-direction:column; gap:8px; }
.hub-action-item {
  display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  padding:12px 14px; border:1px solid var(--border); border-radius:var(--radius);
  background:var(--surface); cursor:pointer;
  transition:border-color .15s var(--ease-out), background .15s var(--ease-out), transform .12s var(--ease-out);
  color:var(--text-secondary); font-family:inherit;
}
.hub-action-item:hover { border-color:var(--accent); background:var(--accent-weak, rgba(94,106,210,.06)); transform:translateY(-1px); }
.hub-action-item:active { transform:translateY(0); }
.hub-action-item i { font-size:1.15rem; width:22px; text-align:center; color:var(--accent); flex:none; }
.hub-action-item span { display:flex; flex-direction:column; gap:2px; min-width:0; }
.hub-action-item b { font-size:var(--fs-3); font-weight:700; }
.hub-action-item small { font-size:var(--fs-1); color:var(--text-muted); }

@media (max-width:768px){
  .hub-stats { grid-template-columns:repeat(2, 1fr); }
  .hub-cols { grid-template-columns:1fr; }
}

/* =====================================================================
   Quiet System · 模块再设计（计时器 / 日记 / 密码箱 / 习惯）
   说明：JS 结构不可改，以下均为在既有 class 上的「视觉再设计」覆盖层。
   置于文件末尾，同特异度下以源码顺序取胜；覆盖内联 padding 用 !important。
   ===================================================================== */

/* ---------- 计时器：聚焦英雄，消除空洞、数字随框缩放 ---------- */
.timer-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(12px, 2.2vh, 26px);
  padding: clamp(30px, 5vh, 56px) clamp(22px, 3vw, 44px) !important;
  min-height: clamp(300px, 42vh, 420px);
  position: relative;
}
.timer-box::after {
  content: "点开始，进入心流";
  font-size: var(--fs-1);
  color: var(--text-muted);
  margin-top: clamp(2px, 1vh, 8px);
}
.timer-digit {
  font-family: var(--font-sans);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  font-size: clamp(3.4rem, 30cqi, 12rem);
  line-height: .9;
  letter-spacing: -.02em;
  color: var(--success);
  text-wrap: balance;
}
.timer-box > div:last-child { width: 100%; max-width: 460px; }
.timer-note-input { border-radius: var(--radius-pill); }

/* ---------- 日记：编辑感再设计 ---------- */
.journal-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
.journal-count-badge {
  font-family: var(--font-sans); font-weight: 700; font-size: var(--fs-1);
  padding: 5px 14px; border-radius: var(--radius-pill);
  background: var(--accent-weak); color: var(--accent); border: 1px solid var(--accent-press);
}
.journal-compose { padding: clamp(18px, 2.4vw, 28px); border-radius: var(--radius-xl); border-color: var(--border-strong); }
.journal-title-input { font-family: var(--font-display); font-size: clamp(1.3rem, 2.4vw, 1.7rem); font-weight: 600; letter-spacing: -.02em; }
/* 标题框与内容框的边框/圆角/内边距/宽度已在基础规则（.journal-title-input, .journal-content 共用）统一定义，此处不再重复，避免两框盒模型不一致导致错位 */
.journal-fixed-tags-label { text-transform: uppercase; letter-spacing: .12em; font-size: var(--fs-1); }
.journal-fixed-tag, .journal-tag-filter { border-radius: var(--radius-pill); }
.journal-toolbar { padding: 14px 16px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 16px; }
.journal-bucket-title { font-family: var(--font-sans); text-transform: uppercase; letter-spacing: .14em; font-size: .72rem; font-weight: 700; color: var(--text-muted); border-left: 3px solid var(--pink); padding-left: 10px; }
.journal-entry { border-radius: var(--radius); padding: 16px 18px; transition: transform .18s var(--ease-out), border-color .18s var(--ease-out), box-shadow .18s var(--ease-out); }
.journal-entry:hover { transform: translateY(-2px); border-color: var(--border-strong); box-shadow: var(--shadow-md); }
.journal-entry-title { font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; color: var(--text-primary); letter-spacing: -.01em; }
.journal-entry-content { font-size: .9rem; }
.journal-type-chip { border-radius: var(--radius-pill); font-weight: 600; }

/* ---------- 密码箱：凭证卡片再设计 ---------- */
.pwd-item {
  display: flex; align-items: center; gap: clamp(14px, 2vw, 22px);
  padding: 16px 20px; border-radius: var(--radius);
  background: var(--surface); border: 1px solid var(--border); flex-wrap: wrap;
  transition: border-color .15s var(--ease-out), transform .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
.pwd-item:hover { border-color: var(--border-strong); transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.pwd-site { font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; letter-spacing: -.01em; color: var(--text-primary); min-width: 150px; }
.pwd-field { flex: 1 1 220px; display: flex; align-items: center; gap: 10px; }
.pwd-field > span:first-child { font-size: .7rem !important; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); min-width: 42px; }
.pwd-value { font-family: var(--font-sans); font-variant-numeric: tabular-nums; font-size: var(--fs-3); background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.pwd-item > div:last-child { margin-left: auto; }
.pwd-cat-chip .btn, #pwdCategoryFilter .btn { border-radius: var(--radius-pill); }

/* ---------- 习惯：打卡再设计 ---------- */
.habit-stat-card { border-radius: var(--radius); padding: 14px 6px; background: var(--surface); border: 1px solid var(--border); }
.habit-stat-card .stat-value { font-family: var(--font-display); font-size: 1.5rem; font-weight: 600; letter-spacing: -.02em; }
.habit-card { border-radius: var(--radius); padding: 16px 18px; transition: border-color .15s var(--ease-out), transform .15s var(--ease-out), box-shadow .15s var(--ease-out); }
.habit-card:hover { border-color: var(--border-strong); transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.habit-day { width: 28px; height: 28px; border-radius: var(--radius-2xs); font-size: var(--fs-1); }
.habit-day.checked { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18); }
.habit-badge { background: var(--surface-3); }

/* ---------- 深色模式：主操作按钮在暗底下的「抬升感」（仍保持薰衣草蓝 CTA） ---------- */
.dark .btn-primary {
  background: var(--primary);
  border-color: var(--border-strong);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 2px 10px rgba(0, 0, 0, 0.35);
}
.dark .btn-primary:hover { background: var(--primary-hover); border-color: var(--border-strong); }
.dark .lock-btn { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 2px 10px rgba(0, 0, 0, 0.35); }

/* =====================================================================
   Quiet System · 模块再设计（续）— 全面推进
   Daily / 计划看板 / Inbox / Notes / 任务库 / 日历 / 周报
   原则：JS 结构零改动；沿用既有分类色（紫=计划/收集、粉=日记、绿=完成、
   朱红=全局信号）；统一「悬停抬升 + 发丝边框」交互语言，强化编辑感层级
   与邀约式交互态。覆盖层置于文件末尾，同特异度以源码顺序取胜。
   ===================================================================== */

/* ---------- Daily · 每日计划 ---------- */
.daily-item {
  position: relative;
  transition: border-color .12s var(--ease-out), transform .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
.daily-item:hover { transform: translateY(-1px); border-color: var(--border-strong); box-shadow: var(--shadow-sm); }
.daily-check { transition: border-color .12s var(--ease-out), background .12s var(--ease-out), box-shadow .12s var(--ease-out); }
.daily-item.done .daily-check { box-shadow: 0 2px 8px var(--success-weak); }
.daily-prio { box-shadow: var(--shadow-sm); font-weight: 700; }
.daily-chip { font-weight: 600; }
.daily-mood-btn, .daily-energy-btn { border-radius: var(--radius-2xs); }

/* ---------- 本周 7 天看板（计划） ---------- */
.plan-week { gap: 10px; }
.plan-day {
  position: relative;
  transition: border-color .15s var(--ease-out), box-shadow .15s var(--ease-out), transform .15s var(--ease-out);
}
.plan-day:hover { transform: translateY(-2px); border-color: var(--border-strong); box-shadow: var(--shadow-md); }
.plan-day-today { background: var(--violet-weak); border-color: var(--violet); box-shadow: 0 2px 10px var(--violet-weak); }
.plan-task { transition: background .14s var(--ease-out), color .14s var(--ease-out); cursor: grab; }
.plan-task:hover { background: var(--violet); }
.plan-task:hover .plan-task-title { color: #fff; }
.plan-task:hover .plan-check { border-color: rgba(255, 255, 255, 0.75); color: #fff; }
.plan-day.drag-over { box-shadow: 0 0 0 2px var(--accent); outline: none; }

/* ---------- Weekly · 周报统计卡 ---------- */

/* ---------- Inbox · 收集箱 ---------- */
.inbox-item {
  position: relative;
  transition: border-color .12s var(--ease-out), transform .18s var(--ease-out), box-shadow .18s var(--ease-out);
}
.inbox-item:hover { transform: translateY(-2px); border-color: var(--border-strong); box-shadow: var(--shadow-md); }
.inbox-capture { border-radius: var(--radius-xl); border-color: var(--border-strong); }
.inbox-type-btn, .inbox-tab { font-weight: 600; }
.inbox-tab.active, .inbox-type-btn.active { box-shadow: var(--shadow-sm); }
.inbox-tag { font-weight: 600; }

/* ---------- Task · 任务库 ---------- */
.task-item {
  position: relative;
  transition: border-color .15s var(--ease-out), transform .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
.task-item:hover { transform: translateY(-1px); border-color: var(--border-strong); box-shadow: var(--shadow-sm); }
.task-check { transition: border-color .15s var(--ease-out), background .15s var(--ease-out), box-shadow .15s var(--ease-out); }
.task-item-done .task-check { box-shadow: 0 2px 8px var(--success-weak); }
.task-group-head { font-size: var(--fs-1); letter-spacing: .08em; text-transform: uppercase; font-weight: 700; }

/* ---------- Calendar · 日历 ---------- */
.fc-cell:hover { box-shadow: inset 0 0 0 1px var(--border-strong); }
/* 今天格子完整四边框（20261013c：原 box-shadow 1px 在 grid 里被相邻格背景吞掉左右/下侧，
   观感只剩上+左；outline 画在元素自身盒上且提层级，四边完整） */
.fc-cell.today { background:var(--accent-weak); outline:2px solid var(--accent); outline-offset:-2px; position:relative; z-index:1; }
.fc-cell.today .fc-day-num { background:var(--accent); color:#fff; }
.fc-event-dot { font-weight: 600; }

/* =====================================================================
   Quiet System · 动效层（克制 · MOTION≈3）
   原则：hover / 聚焦 / 模块入场为主，绝不做线性 ease 与泛滥动效；
   入场仅作用于模块面板的「顶层区块」，不作用于每次 render 重绘的内部列表，
   以免勾选/刷新时 flicker。统一使用设计系统缓动曲线。
   尊重 prefers-reduced-motion（文件末尾已全局收敛时长）。
   ===================================================================== */

/* 模块切换：面板内顶层区块依次轻微上浮 + 淡入（错峰，营造「呼吸到位」感） */
.module-panel.active > * {
  animation: panelRise .5s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.module-panel.active > *:nth-child(1) { animation-delay: .02s; }
.module-panel.active > *:nth-child(2) { animation-delay: .06s; }
.module-panel.active > *:nth-child(3) { animation-delay: .10s; }
.module-panel.active > *:nth-child(4) { animation-delay: .14s; }
.module-panel.active > *:nth-child(5) { animation-delay: .18s; }
.module-panel.active > *:nth-child(6) { animation-delay: .22s; }
.module-panel.active > *:nth-child(n+7) { animation-delay: .26s; }
@keyframes panelRise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* 导航项：悬停轻微右移 + 信号感（替代生硬背景切换） */
.nav-item { transition: background .18s var(--ease-out), color .18s var(--ease-out), transform .18s cubic-bezier(0.22, 1, 0.36, 1); }
.nav-item:hover { transform: translateX(3px); }
.nav-item.active:hover { transform: translateX(2px); }

/* 图标按钮：按下回弹（轻微 spring），强化触感 */
.btn-sm, .daily-act, .inbox-act, .plan-act, .bz-edit, .journal-del, .daily-del,
.inbox-conv, .menu-pop .menu-item, .tm-del-btn, .task-today-btn {
  transition: background .15s var(--ease-out), color .15s var(--ease-out),
              border-color .15s var(--ease-out), transform .12s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.btn-sm:active, .daily-act:active, .inbox-act:active, .plan-act:active,
.bz-edit:active, .journal-del:active, .daily-del:active, .inbox-conv:active,
.tm-del-btn:active, .task-today-btn:active { transform: scale(.9); }

/* 注：列表项（.inbox-item/.pwd-item/.daily-item 等）由 .render() 频繁重建，
   若对其施加 animation 会在每次勾选/刷新时重放造成 flicker；故仅让「顶层区块」
   在模块切换时错峰上浮，列表项保留 hover 抬升（transition，无 flicker）即可。 */

/* =====================================================================
   Quiet System · Light Theme overrides
   仅修复「硬编码深底假设」的细节，其余组件全部跟随 .light 令牌自动翻色。
   · 卡片顶边高光：浅底用极淡暗高光，避免深底的白色高光在白卡上隐形。
   · 思维导图：浅色画布 / 面板 / 提示气泡（原 #0f1011 / #1b1d22 为深底硬编码）。
   · 模态 / 命令面板浮层保留中性深色 scrim（两端通用，符合惯例）。
   ===================================================================== */

/* 卡片顶边高光反色 */
.light .card, .light .glass-card { box-shadow: inset 0 1px 0 rgba(16, 17, 20, 0.04); }
.light .card:hover, .light .glass-card:hover { box-shadow: inset 0 1px 0 rgba(16, 17, 20, 0.06), var(--shadow-md); }

/* 焦点环：更顺滑的朱红信号（键盘可达性 + 设计一致） */
.btn:focus-visible, .nav-item:focus-visible,
.lock-btn:focus-visible, .form-input:focus-visible, .form-select:focus-visible,
.form-textarea:focus-visible, .filter-chip:focus-visible, .daily-check:focus-visible,
.task-check:focus-visible, .bz-check:focus-visible, .habit-day:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--accent-glow);
}

/* =====================================================================
   动效增强 · Motion Enhancement（在 Quiet System 之上叠加表现力特效）
   仅作用于静态结构 / 状态切换，避免对 render 频繁重建的列表项使用 animation。
   ===================================================================== */

/* 1. 背景保持纯深底：无氛围渐变（遵循 DESIGN.md，不引入环境渐变 / 聚光） */

/* 2. 首页 Brain 卡片：逐张浮入（错峰，配合面板入场） */
.brain-grid .brain-card { animation: fx-brainIn .5s cubic-bezier(0.22,1,0.36,1) both; }
.brain-grid .brain-card:nth-child(1) { animation-delay: .08s; }
.brain-grid .brain-card:nth-child(2) { animation-delay: .14s; }
.brain-grid .brain-card:nth-child(3) { animation-delay: .20s; }
@keyframes fx-brainIn {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* 3. 主操作按钮：高光横扫（hover 时光带划过，克制记忆点） */
.btn-primary { position: relative; overflow: hidden; }
.btn-primary::after {
  content: ""; position: absolute; top: 0; left: -130%; width: 60%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.30), transparent);
  transform: skewX(-20deg); transition: left .6s var(--ease-out); pointer-events: none;
}
.btn-primary:hover::after { left: 150%; }

/* 4. 专注计时器：绿色柔光（数字改绿后的信号光晕，运行时呼吸） */
.timer-digit { text-shadow: 0 0 22px rgba(63,157,106,0.18); }
.dark .timer-digit { text-shadow: 0 0 22px rgba(79,179,126,0.22); }
.timer-pulse { animation: pulseGlow 2.5s infinite ease-in-out, fx-digitGlow 2.6s var(--ease-in-out) infinite; }
@keyframes fx-digitGlow {
  0%, 100% { text-shadow: 0 0 16px rgba(63,157,106,0.16); }
  50%      { text-shadow: 0 0 38px rgba(63,157,106,0.42); }
}
.dark .timer-pulse { animation: pulseGlow 2.5s infinite ease-in-out, fx-digitGlowDark 2.6s var(--ease-in-out) infinite; }
@keyframes fx-digitGlowDark {
  0%, 100% { text-shadow: 0 0 18px rgba(79,179,126,0.18); }
  50%      { text-shadow: 0 0 40px rgba(79,179,126,0.46); }
}

/* 5. 导航激活条：切换模块时朱红指示条自上而下展开（保留垂直居中） */
.nav-item.active::before { animation: fx-navBar .3s var(--ease-out) both; }
@keyframes fx-navBar {
  from { transform: translateY(-50%) scaleY(0); }
  to   { transform: translateY(-50%) scaleY(1); }
}

/* 6. 习惯统计卡：悬停数值轻跳 + 朱红高亮 */
.habit-stat-card .stat-value { transition: transform .2s var(--ease-out), color .2s var(--ease-out); }
.habit-stat-card:hover .stat-value { transform: scale(1.08); color: var(--accent); }

/* 7. 勾选圈：按下回弹（transition，无 flicker） */
.task-check, .bz-check, .plan-check, .daily-check {
  transition: transform .16s cubic-bezier(0.34,1.56,0.64,1), background .2s var(--ease-out), border-color .2s var(--ease-out);
}
.task-check:active, .bz-check:active, .plan-check:active, .daily-check:active { transform: scale(.82); }

/* 8. 跳转链接：悬停朱红 */
.bz-more { transition: color .18s var(--ease-out), opacity .18s var(--ease-out); cursor: pointer; }
.bz-more:hover { color: var(--accent); }

/* 9. 侧边栏折叠：更顺滑的宽度 / 位移过渡 */
#sidebar { transition: width .32s var(--ease-drawer), transform .32s var(--ease-drawer); }

/* 10. 尊重「减少动态」偏好：关闭新增动画 */
@media (prefers-reduced-motion: reduce) {
  body::before, .brain-grid .brain-card, .btn-primary::after,
  .timer-pulse, .nav-item.active::before { animation: none !important; }
  .habit-stat-card:hover .stat-value { transform: none; }
}

/* =====================================================================
   20261021s：Markdown 渲染样式（.md / .md-preview / .md-toggle-btn）已整套移除。
   日记内容改为纯文本 + white-space:pre-wrap 显示（保留你一句一行的节奏）。
   ===================================================================== */

/* =====================================================================
   星期五 模块
   ===================================================================== */
.ai-wrap { display: flex; flex-direction: column; height: calc(100dvh - 130px); max-width: 820px; margin: 0 auto; }
.ai-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 2px 14px; }
.ai-head-title { font-size: 1.15rem; font-weight: 700; display: flex; align-items: center; gap: 9px; }
.ai-head-title i { color: var(--accent); }
.ai-gear { width: 38px; height: 38px; border-radius: var(--radius-pill); border: 1px solid var(--border); background: var(--surface-2); color: var(--text-secondary); cursor: pointer; font-size: .95rem; transition: all .18s var(--ease-out); }
.ai-gear:hover { border-color: var(--accent); color: var(--accent); }

.ai-log { flex: 1; min-height: 0; overflow-y: auto; padding: 6px 4px; display: flex; flex-direction: column; gap: 12px; }
.ai-empty { text-align: center; color: var(--text-muted); padding: 40px 20px; }
.ai-empty i { font-size: 2.4rem; color: var(--accent); opacity: .7; margin-bottom: 12px; display: block; }
.ai-empty p { font-size: .9rem; line-height: 1.6; max-width: 360px; margin: 0 auto; }

.ai-msg { display: flex; }
.ai-msg.user { justify-content: flex-end; }
.ai-msg.assistant { justify-content: flex-start; }
.ai-bubble { max-width: 82%; padding: 11px 15px; border-radius: var(--radius-lg); font-size: .92rem; line-height: 1.6; word-break: break-word; }
.ai-msg.user .ai-bubble { background: var(--accent); color: #fff; border-bottom-right-radius: 6px; }
.ai-msg.assistant .ai-bubble { background: var(--surface-2); border: 1px solid var(--border); color: var(--text); border-bottom-left-radius: 6px; }
.ai-msg.system { justify-content: flex-start; }
.ai-sys { font-size: .78rem; color: var(--success); background: var(--success-weak); border: 1px solid color-mix(in srgb, var(--success) 25%, transparent); padding: 5px 11px; border-radius: var(--radius-pill); }

.ai-suggest { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 2px; }
.ai-chip { font-size: .78rem; padding: 6px 12px; border-radius: var(--radius-pill); border: 1px solid var(--border); background: var(--surface); color: var(--text-secondary); cursor: pointer; transition: all .18s var(--ease-out); }
.ai-chip:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-weak); }

.ai-input-row { display: flex; gap: 10px; align-items: flex-end; padding: 6px 2px 0; }
.ai-input-row .form-input { flex: 1; resize: none; }
.ai-input-row .btn-primary { flex: 0 0 auto; height: 44px; width: 48px; display: inline-flex; align-items: center; justify-content: center; }
.ai-input-row .btn-primary:disabled { opacity: .6; cursor: not-allowed; }
.ai-hint { text-align: center; font-size: .7rem; color: var(--text-muted); padding-top: 8px; }

.ai-set-hint { font-size: .78rem; color: var(--text-muted); line-height: 1.6; margin-top: 6px; }
.ai-set-hint code { background: var(--surface-2); padding: 1px 6px; border-radius: 5px; border: 1px solid var(--border); }

/* 长期记忆管理列表 */
.mem-list { max-height: 240px; overflow-y: auto; margin-top: 8px; display: flex; flex-direction: column; gap: 7px; }
.mem-empty { font-size: .82rem; color: var(--text-muted); padding: 10px 2px; }
.mem-item { display: flex; align-items: flex-start; gap: 9px; padding: 9px 10px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.mem-cat { flex: 0 0 auto; font-size: .68rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; color: #fff; background: var(--accent); text-transform: capitalize; }
.mem-cat-profile { background: #4a8fc0; }
.mem-cat-preference { background: #5e6ad2; }
.mem-cat-goal { background: #e08a3c; }
.mem-cat-habit { background: #2f9e6f; }
.mem-cat-project { background: #c0506a; }
.mem-cat-insight { background: #8a6dc4; }
.mem-body { flex: 1; min-width: 0; }
.mem-content { font-size: .85rem; color: var(--text); line-height: 1.45; }
.mem-meta { font-size: .7rem; color: var(--text-muted); margin-top: 3px; }
.mem-del { flex: 0 0 auto; background: transparent; border: none; color: var(--text-muted); cursor: pointer; font-size: .85rem; padding: 2px 4px; border-radius: 6px; }
.mem-del:hover { color: var(--danger); background: var(--danger-weak); }

/* 移动端：让聊天区更贴合 */
@media (max-width: 768px) {
  .ai-wrap { height: calc(100dvh - 118px); }
  .ai-bubble { max-width: 90%; }
}

/* ===== 专注 · 全屏模式 ===== */
.timer-fs-btn {
  position: absolute; top: 10px; right: 12px; z-index: 5;
  width: 32px; height: 32px; border-radius: 8px;
  border: 1px solid var(--border); background: var(--surface-2); color: var(--text-muted);
  cursor: pointer; font-size: .85rem; display: flex; align-items: center; justify-content: center;
  transition: all .15s var(--ease-out, ease);
}
.timer-fs-btn:hover { color: var(--accent); border-color: var(--accent); }

/* 全屏态：仅保留计时数字 + 开始/结束 两个控制按钮，其余全部隐藏 */
body.timer-fs .timer-note-wrap { display: none !important; }
body.timer-fs .timer-top-grid > .glass-card:not(.timer-box) { display: none !important; }
body.timer-fs .timer-bottom-grid { display: none !important; }
body.timer-fs .timer-top-grid { display: block; }
/* 真全屏包裹层：作为 requestFullscreen 的元素；box + 视频层 + 控制条都在其内部，真全屏下全部可见 */
.timer-fs-root { position: fixed; inset: 0; z-index: 9000; overflow: hidden; background: #000 !important; }

body.timer-fs .timer-box {
  position: absolute !important; inset: 0; margin: 0; border-radius: 0;
  width: 100%; height: 100%; max-height: none;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 18px;
  background: var(--surface); overflow-y: auto; padding: 11vh 16px 0; box-sizing: border-box;
}
body.timer-fs .timer-box .timer-digit { font-size: clamp(34px, 8vw, 100px); line-height: 1; }
/* 全屏下隐藏「点开始，进入心流」提示（仅普通视图保留） */
body.timer-fs .timer-box::after { display: none; }
body.timer-fs .timer-box > div[style*="grid"] { width: min(92vw, 720px); }
body.timer-fs .timer-fs-btn { top: calc(24px + env(safe-area-inset-top)); right: calc(24px + env(safe-area-inset-right)); width: 44px; height: 44px; font-size: 1.1rem; }

/* 全屏专注 · 氛围媒体层（zhuanzhu 6 模式） */
/* 透出视频画面：计时卡片背景透明化，仅数字/按钮加暗角保证可读性 */
body.timer-fs .timer-box { background: transparent !important; border: none !important; box-shadow: none !important; }
/* 全屏态强制页面底色为黑：任何缝隙（视频亚像素/边缘）都读作影院黑，而非浅色主题底色 */
html.timer-fs, body.timer-fs { background: #000 !important; }
body.timer-fs .timer-box .timer-digit { color: #fff; text-shadow: 0 2px 28px rgba(0,0,0,.55); }
body.timer-fs .timer-box > div[style*="grid"] {
  background: rgba(0,0,0,.30); padding: 14px 16px; border-radius: 16px;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
/* 媒体层直接用 fixed+视口锚定：不依赖 .timer-fs-root 的盒模型，在 requestFullscreen / CSS 覆盖两种路径下都保证贴满屏幕。
   纯黑背景 + overflow:hidden 配合视频放大裁掉溢出，任何缝隙都读作影院黑而非浅色。 */
#timerFsMedia { position: fixed; inset: 0; z-index: -1; background: #000; overflow: hidden; }
/* 视频铺满媒体层：object-fit:cover 裁剪；transform:scale(1.08) 再扩大 8% 吞掉亚像素缝隙；
   自身背景也黑，作为 letterbox 的最终兜底色。 */
#timerFsMedia video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transform-origin: center; background: #000; }
.timer-fs-scrim {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,0) 26%, rgba(0,0,0,0) 60%, rgba(0,0,0,.42) 100%);
}
#timerFsControls {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 14px 16px calc(14px + env(safe-area-inset-bottom));
}
.tm-mode-row { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; max-width: 92vw; }
.tm-mode-chip {
  font-size: .8rem; padding: 7px 16px; border-radius: 999px; cursor: pointer;
  border: 1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.34); color: #fff;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: all .15s var(--ease-out, ease);
}
.tm-mode-chip:hover { border-color: #fff; background: rgba(0,0,0,.5); }
.tm-mode-chip.active { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
.tm-mode-actions button {
  width: 40px; height: 40px; border-radius: 999px; cursor: pointer; font-size: 1rem;
  border: 1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.34); color: #fff;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center; transition: all .15s var(--ease-out, ease);
}
.tm-mode-actions button:hover { border-color: #fff; background: rgba(0,0,0,.5); }

/* 全屏精简：中间 3 列网格收成单个居中主按钮，隐藏独立暂停按钮（改为点数字暂停） */
body.timer-fs #timerPauseBtn { display: none !important; }
body.timer-fs .timer-box > div[style*="grid"] { display: flex !important; justify-content: center !important; }

/* 点数字暂停 / 继续的轻提示（仅暂停态显示，纯视觉，点击交给数字本身） */
.tm-fs-pausehint {
  display: none; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 72px; height: 72px; border-radius: 50%; align-items: center; justify-content: center;
  background: rgba(0,0,0,.42); color: #fff; font-size: 1.4rem; pointer-events: none;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
}
body.timer-fs #timerDisplay { position: relative; cursor: pointer; }

/* 闲置隐藏全部控制层（退出按钮 + 模式条 + 主按钮行），仅留计时数字与氛围画面，更沉浸；
   任意交互（移动 / 触摸 / 点击 / 按键）即唤醒恢复显示——手机端无 Esc 也能通过点按露出退出键。 */
body.timer-fs .timer-box > div[style*="grid"],
body.timer-fs #timerFsControls,
body.timer-fs .timer-fs-btn { transition: opacity .7s ease; }
body.timer-fs.timer-fs-idle .timer-box > div[style*="grid"],
body.timer-fs.timer-fs-idle #timerFsControls,
body.timer-fs.timer-fs-idle .timer-fs-btn { opacity: 0; pointer-events: none; }

/* ===== 安全中心（Security Log / 登录审计） ===== */
.se-wrap { padding:18px; max-width:920px; margin:0 auto; }
.se-head { margin-bottom:14px; }
.se-title { font-size:1.18rem; font-weight:700; color:var(--text-primary); }
.se-sub { font-size:.78rem; color:var(--text-muted); margin-top:2px; }
.se-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:16px; }

.se-stat { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:12px 10px; text-align:center; }
.se-stat-n { font-size:1.5rem; font-weight:700; line-height:1.1; }
.se-stat-l { font-size:.72rem; color:var(--text-muted); margin-top:4px; }
.se-stat-login .se-stat-n { color:#2f9e6e; }
.se-stat-fail .se-stat-n { color:#d05a4f; }
.se-stat-ip .se-stat-n { color:#c0883b; }
.se-stat-dev .se-stat-n { color:#5a7bd0; }
.se-filters { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:14px; }
.se-filter-group { display:flex; flex-wrap:wrap; gap:6px; }
.se-chip { border:1px solid var(--border); background:var(--surface); color:var(--text-secondary); border-radius:999px; padding:5px 12px; font-size:.8rem; cursor:pointer; transition:.15s; }
.se-chip:hover { border-color:var(--accent); }
.se-chip.on { background:var(--accent); border-color:var(--accent); color:#fff; }
.se-list { display:flex; flex-direction:column; gap:8px; }
.se-empty { text-align:center; color:var(--text-muted); padding:40px 0; font-size:.9rem; }
.se-card { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:12px 14px; cursor:pointer; transition:.15s; }
.se-card:hover { border-color:var(--accent); }
.se-card.expanded { border-color:var(--accent); }
.se-card-main { display:flex; align-items:flex-start; gap:12px; }
.se-ico { font-size:1.25rem; margin-top:2px; }
.se-ico.se-ok { color:#2f9e6e; }
.se-ico.se-fail { color:#d05a4f; }
.se-ico.se-block { color:#c0883b; }
.se-card-body { flex:1; min-width:0; }
.se-card-row1 { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.se-result { font-weight:600; font-size:.92rem; }
.se-result.se-ok { color:#2f9e6e; }
.se-result.se-fail { color:#d05a4f; }
.se-result.se-block { color:#c0883b; }
.se-flag { font-size:.68rem; padding:1px 7px; border-radius:999px; font-weight:600; }
.se-flag.ip { background:rgba(192,136,59,0.15); color:#b0782c; }
.se-flag.dev { background:rgba(90,123,208,0.15); color:#4a67b8; }
.se-flag.fail { background:rgba(208,90,79,0.15); color:#b04a40; }
.se-time { margin-left:auto; font-size:.76rem; color:var(--text-muted); }
.se-card-row2 { font-size:.82rem; color:var(--text-secondary); margin-top:3px; }
.se-card-row3 { font-size:.74rem; color:var(--text-muted); margin-top:1px; }
.se-ip { color:var(--text-secondary); font-variant-numeric:tabular-nums; }
.se-toggle { color:var(--text-muted); margin-top:4px; }
.se-detail { margin-top:10px; padding-top:10px; border-top:1px dashed var(--border); }
.se-detail-tbl { width:100%; border-collapse:collapse; font-size:.8rem; }
.se-detail-tbl td { padding:4px 6px; vertical-align:top; }
.se-dk { color:var(--text-muted); white-space:nowrap; width:88px; }
.se-dv { color:var(--text-primary); word-break:break-all; }
.se-ua-label { font-size:.72rem; color:var(--text-muted); margin:8px 0 3px; }
.se-ua { font-size:.72rem; color:var(--text-secondary); background:var(--surface-2,#f3f4f6); border:1px solid var(--border); border-radius:8px; padding:6px 8px; word-break:break-all; font-family:ui-monospace,Menlo,Consolas,monospace; }
@media (max-width: 560px) {
  .se-stats { grid-template-columns:repeat(2,1fr); }
  .se-wrap { padding:12px; }
}

/* ===== 成长（Growth）模块 ===== */

/* 主线卡片操作（编辑/删除）常显，不再依赖 hover —— 确保桌面/手机都能直接看到并删除 */

/* 主线（根方向）专属头部节点：在成长树顶部，带完整操作，且始终可见删除入口 */

/* 搜索结果 */

/* 成长树 */

/* 关联任务弹窗 */

@media (max-width: 600px) {
  /* 移动端：操作默认隐藏，点按行（.sel）展开，避免 6 个图标常驻拥挤 */
}

/* 成长面板：关闭入场 fadeIn 重放（render() 频繁整树重建，重放动画会让人误以为"刷新"） */

/* =====================================================================
   像素 RPG 主题视觉覆盖（html.pixel）
   像素描边 + 硬边偏移阴影 + 小圆角 + 点阵/方格背景 + 原创像素宠物装饰
   （16-bit RPG 菜单面板感；不动结构，只换灵魂）
   ===================================================================== */

/* 点阵 / 方格背景（固定铺满视口，极淡，不影响阅读） */
html.pixel body {
  background-color: var(--bg);
  background-image:
    linear-gradient(rgba(43, 47, 74, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43, 47, 74, 0.045) 1px, transparent 1px);
  background-size: 16px 16px;
  background-attachment: fixed;
}

/* 卡片 / 玻璃卡：像素描边 + 硬阴影（RPG 菜单面板） */
html.pixel .card,
html.pixel .glass-card {
  border: 3px solid var(--pixel-ink);
  border-radius: 8px;
  box-shadow: 4px 4px 0 var(--pixel-ink);
  background: var(--surface);
}
html.pixel .card:hover,
html.pixel .glass-card:hover {
  border-color: var(--pixel-ink);
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--pixel-ink);
}

/* 按钮：像素描边 + 硬阴影 + 粗体，按下塌陷 */
html.pixel .btn {
  border: 2px solid var(--pixel-ink);
  border-radius: 6px;
  box-shadow: 3px 3px 0 var(--pixel-ink);
  font-weight: 800;
  letter-spacing: .01em;
  background: var(--surface);
  color: var(--text-primary);
  transition: transform .08s var(--ease-out), box-shadow .08s var(--ease-out), background .12s var(--ease-out);
}
html.pixel .btn:hover {
  transform: translate(-1px, -1px);
  box-shadow: 4px 4px 0 var(--pixel-ink);
  border-color: var(--pixel-ink);
  color: var(--text-primary);
  background: var(--surface-3);
}
html.pixel .btn:active {
  transform: translate(3px, 3px);
  box-shadow: 0 0 0 var(--pixel-ink);
}
html.pixel .btn-sm {
  border-width: 2px;
  border-radius: 5px;
  box-shadow: 2px 2px 0 var(--pixel-ink);
  font-weight: 700;
}
html.pixel .btn-sm:hover { box-shadow: 3px 3px 0 var(--pixel-ink); }
html.pixel .btn-primary { background: var(--primary); color: var(--on-primary); border-color: var(--pixel-ink); }
html.pixel .btn-primary:hover { background: var(--primary-hover); color: var(--on-primary); border-color: var(--pixel-ink); }
html.pixel .btn-primary:active { background: var(--primary-press); }
html.pixel .btn-secondary { background: var(--surface); color: var(--text-primary); border-color: var(--pixel-ink); }
html.pixel .btn-secondary:hover { color: var(--primary); border-color: var(--pixel-ink); background: var(--primary-weak); }
html.pixel .btn-ghost { background: transparent; border-color: transparent; box-shadow: none; }
html.pixel .btn-ghost:hover { background: var(--surface-3); color: var(--text-primary); }
html.pixel .btn-danger { background: transparent; color: var(--danger); border-color: var(--pixel-ink); }
html.pixel .btn-danger:hover { background: var(--danger-weak); color: var(--danger); border-color: var(--pixel-ink); }

/* 表单控件：像素描边 + 硬阴影 */
html.pixel .form-input,
html.pixel .form-select,
html.pixel .form-textarea {
  border: 2px solid var(--pixel-ink);
  border-radius: 5px;
  background: var(--surface);
  box-shadow: 2px 2px 0 var(--pixel-ink);
}
html.pixel .form-input:focus,
html.pixel .form-select:focus,
html.pixel .form-textarea:focus {
  border-color: var(--primary);
  box-shadow: 2px 2px 0 var(--pixel-ink), 0 0 0 3px rgba(59, 111, 212, .45);
}

/* 筛选 / 标签胶囊：像素小圆角 + 墨描边（RPG 属性标签 [学习] 风） */
html.pixel .filter-chip {
  border: 2px solid var(--pixel-ink);
  border-radius: 6px;
  box-shadow: none;
  color: var(--text-primary);
  background: var(--surface);
  font-weight: 700;
}
html.pixel .filter-chip.active { background: var(--accent); color: #2b2f4a; border-color: var(--pixel-ink); box-shadow: 2px 2px 0 var(--pixel-ink); }
html.pixel .tag-chip,
html.pixel .journal-tag,
html.pixel .pwd-cat-chip {
  border: 2px solid var(--pixel-ink);
  border-radius: 6px;
  box-shadow: none;
  font-weight: 700;
}

/* 弹窗：厚墨描边 + 硬阴影 */
html.pixel .modal {
  border: 3px solid var(--pixel-ink);
  border-radius: 10px;
  box-shadow: 6px 6px 0 var(--pixel-ink);
}
html.pixel .modal-footer { border-top: 2px solid var(--pixel-ink); }

/* 侧栏 / 导航：激活态金色填充 + 深蓝灰墨描边 + 左侧天空蓝脊线（▶ 当前选项意象，纯 CSS 不增 DOM） */
html.pixel #sidebar {
  border-right: 3px solid var(--pixel-ink);
  background: var(--surface);
}
html.pixel .nav-item.active {
  background: var(--accent);
  color: #2b2f4a;
  font-weight: 800;
  border: 2px solid var(--pixel-ink);
  border-radius: 6px;
  box-shadow: 3px 3px 0 var(--pixel-ink), inset 4px 0 0 var(--primary);
}
/* 导航图标裹像素容器：让 Font Awesome 图标融入 RPG 主菜单（不替换图标，只加外壳） */
html.pixel .nav-item i {
  display: inline-block;
  line-height: 1;
  border: 2px solid var(--pixel-ink);
  border-radius: 4px;
  background: var(--surface-2);
  padding: 4px;
  margin-right: 4px;
  box-shadow: 2px 2px 0 var(--pixel-ink);
}
html.pixel .nav-item.active i {
  background: var(--primary);
  color: #fff;
  border-color: var(--pixel-ink);
  box-shadow: 2px 2px 0 var(--pixel-ink);
}

/* 任务勾选：像素方块 */
html.pixel .task-check {
  border: 2px solid var(--pixel-ink);
  border-radius: 4px;
  box-shadow: none;
}

/* 密码箱条目 / 跳转按钮 */
html.pixel .pwd-item {
  border: 3px solid var(--pixel-ink);
  border-radius: 8px;
  box-shadow: 3px 3px 0 var(--pixel-ink);
}
html.pixel .pwd-web-btn { border: 2px solid var(--pixel-ink); }

/* 颜色选项 / 同步徽标 / Toast */
html.pixel .color-option.active { border-color: var(--pixel-ink); }
html.pixel .sync-badge { border: 2px solid var(--pixel-ink); box-shadow: none; }
html.pixel .toast { border: 2px solid var(--pixel-ink); box-shadow: 3px 3px 0 var(--pixel-ink); border-radius: 8px; }

/* 进度条：EXP BAR 风格（像素描边 + 硬边填充 + 斜纹） */
html.pixel .bw-progress {
  border: 2px solid var(--pixel-ink);
  border-radius: 4px;
  background: var(--surface-3);
  box-shadow: 2px 2px 0 var(--pixel-ink);
}
html.pixel .bw-progress-bar {
  border-radius: 2px;
  background-color: var(--primary);
  background-image: repeating-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.25) 0 4px,
    rgba(255, 255, 255, 0) 4px 8px
  );
}

/* 标题：像素字体 + 粗体 + 极淡像素偏移（中文标题也像素化；正文仍用清晰字体） */
html.pixel h1, html.pixel h2, html.pixel h3,
html.pixel .modal-title, html.pixel .card-title, html.pixel .pwd-site,
html.pixel .pwd-site-title {
  font-family: "Zpix", var(--font-sans);
  font-weight: 800;
  letter-spacing: 0;
  text-shadow: 1px 1px 0 rgba(43, 47, 74, 0.12);
}

/* 成长树大框：像素描边 + 硬阴影（保持风格一致） *

/* =====================================================================
   原创像素宠物（UI Companion，非页面主体；80% UI + 20% RPG 氛围）
   全部为内联 SVG（原创，不抓取官方素材），仅作装饰、pointer-events:none、不增 DOM。
   ===================================================================== *

/* 空状态：草系小兽陪伴（原创像素，绿） *
html.pixel .mem-empty::before, html.pixel .rel-empty::before, html.pixel .brain-theme-empty::before 

/* 固定陪伴宠物（原创像素魔法小兽，紫）：仅桌面端、右下角、不参与交互、不挡布局 */
@keyframes pixel-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}
@keyframes pixel-pet-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}
@media (min-width: 768px) {
  html.pixel body::after {
    content: "";
    position: fixed;
    right: 14px;
    bottom: 14px;
    width: 40px;
    height: 40px;
    z-index: 60;
    pointer-events: none;
    image-rendering: pixelated;
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' shape-rendering='crispEdges'><rect x='3' y='2' width='2' height='2' fill='rgb(110,74,170)'/><rect x='11' y='2' width='2' height='2' fill='rgb(110,74,170)'/><rect x='4' y='4' width='8' height='8' fill='rgb(154,108,212)'/><rect x='6' y='8' width='4' height='3' fill='rgb(200,170,235)'/><rect x='5' y='6' width='2' height='2' fill='rgb(255,255,255)'/><rect x='9' y='6' width='2' height='2' fill='rgb(255,255,255)'/><rect x='6' y='7' width='1' height='1' fill='rgb(43,47,74)'/><rect x='10' y='7' width='1' height='1' fill='rgb(43,47,74)'/><rect x='4' y='9' width='1' height='1' fill='rgb(224,165,46)'/><rect x='5' y='12' width='2' height='1' fill='rgb(110,74,170)'/><rect x='9' y='12' width='2' height='1' fill='rgb(110,74,170)'/></svg>") center / contain no-repeat;
    animation: pixel-bob 2.4s steps(2, jump-none) infinite;
  }
}
@media (prefers-reduced-motion: reduce) {
  html.pixel .mem-empty::before,
  html.pixel .rel-empty::before,
  html.pixel .brain-theme-empty::before,
  html.pixel body::after { animation: none !important; }
}

/* =====================================================================
   像素RPG·暗色变体补充（Night Canvas）：夜色网格 + 夜光宠物 + 暗底标题偏移
   组件硬描边 / 按钮 / 进度条等继续沿用 html.pixel 规则（令牌已由 .pixel.dark 覆盖）
   ===================================================================== */

/* 夜色点阵网格（暖浅墨线，暗底上若隐若现） */
html.pixel.dark body {
  background-image:
    linear-gradient(rgba(231, 225, 198, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(231, 225, 198, 0.05) 1px, transparent 1px);
}

/* 暗底标题像素偏移转为暖浅墨线 */
html.pixel.dark h1, html.pixel.dark h2, html.pixel.dark h3,
html.pixel.dark .modal-title, html.pixel.dark .card-title, html.pixel.dark .pwd-site,
html.pixel.dark .pwd-site-title {
  text-shadow: 1px 1px 0 rgba(231, 225, 198, 0.14);
}

/* 夜光宠物：暗底上给陪伴小兽一点暖金辉光（不增 DOM、不挡布局） */
@media (min-width: 768px) {
  html.pixel.dark body::after {
    filter: drop-shadow(0 0 3px rgba(240, 187, 62, 0.45));
  }
}
html.pixel.dark .mem-empty::before, html.pixel.dark .rel-empty::before, html.pixel.dark .brain-theme-empty::before 

html.pixel.dark .tabs .tab:not(.active) 
/* =====================================================================
   专注模块 · 手机端布局收敛（消除「太空」）
   覆盖「计时器再设计」层给 timer-box 的强制 tall min-height / 大 padding，
   让手机端聚焦框随内容收缩、图表与记录区高度下调，整体更紧凑合理。
   ===================================================================== *
@media (max-width: 900px) 
@media (max-width: 600px) {
  .timer-box { min-height: 0 !important; padding: 16px 14px !important; gap: 12px; }
  .timer-digit { font-size: clamp(3rem, 26cqi, 7rem); }
  .timer-bottom-grid { margin-top: 12px !important; }
  #timerRecordsScroll { max-height: 260px; }
  #timerTrendChart, #timerPieChart { height: 200px !important; min-height: 200px !important; }
  .timer-top-grid > .glass-card:last-child .time-filter-group { flex-wrap: wrap; }
}

/* =====================================================================
   Jelly 主题视觉覆盖（html.jelly）
   凸起软方块 + 凸面弧面 + 果冻质感 + 图标浮起 + 曲面高光 + 柔和阴影 + 圆角方块
   （新拟态：同色画布 / 表面，靠双阴影顶起；输入框内陷形成对比）
   ===================================================================== */

/* 画布：纯净柔色，无网格 / 渐变（新拟态靠同色 + 阴影塑形） */
html.jelly body { background-color: var(--bg); background-image: none; }

/* 卡片 / 玻璃卡：凸起软方块（同色 + 双阴影顶起 + 顶边白高光 = 凸面弧面） */
html.jelly .card, html.jelly .glass-card,
html.jelly .bz-stat {
  background: linear-gradient(145deg, #f1f4fa 0%, #e2e6ef 100%);
  border: none;
  border-radius: var(--radius);
  box-shadow: var(--neu-out), inset 0 2px 2px rgba(255,255,255,0.28);
  padding: var(--space-5);
}
html.jelly .card:hover, html.jelly .glass-card:hover {
  border: none;
  box-shadow: var(--neu-out-lg), inset 0 2px 2px rgba(255,255,255,0.30);
  transform: translateY(-3px);
}

/* 按钮：凸起果冻块（圆角方块 + 凸面高光 + 落影） */
html.jelly .btn {
  background: linear-gradient(145deg, #f1f4fa 0%, #dfe3ec 100%);
  border: none;
  border-radius: var(--radius-sm);
  color: var(--text-secondary);
  box-shadow: var(--neu-out-sm);
}
html.jelly .btn:hover {
  background: linear-gradient(145deg, #f4f7fc 0%, #e2e6ef 100%);
  color: var(--text-primary);
  border: none;
  box-shadow: var(--neu-out);
}
html.jelly .btn:active { transform: scale(.97); box-shadow: var(--neu-in-sm); }

/* 主操作：果冻光泽（保留 .btn-primary 既有光带 ::after） */
html.jelly .btn-primary {
  background: linear-gradient(145deg, var(--primary-hover) 0%, var(--primary-press) 100%);
  color: var(--on-primary);
  border: none;
  box-shadow: 4px 4px 8px rgba(94,106,210,0.28), -3px -3px 8px rgba(255,255,255,0.32),
              inset 0 1px 2px rgba(255,255,255,0.16);
}
html.jelly .btn-primary:hover {
  background: linear-gradient(145deg, var(--primary-hover) 0%, var(--primary) 100%);
  color: var(--on-primary);
  border: none;
  box-shadow: 5px 5px 10px rgba(94,106,210,0.30), -4px -4px 9px rgba(255,255,255,0.34),
              inset 0 1px 2px rgba(255,255,255,0.18);
}
html.jelly .btn-primary:active {
  transform: scale(.97);
  box-shadow: inset 3px 3px 6px rgba(74,84,186,0.40), inset -2px -2px 4px rgba(255,255,255,0.18);
}

/* 次操作 / 幽灵 / 危险：统一去硬边框，跟随果冻 */
html.jelly .btn-secondary { background: linear-gradient(145deg,#f1f4fa,#dfe3ec); color:var(--text-primary); border:none; box-shadow:var(--neu-out-sm); }
html.jelly .btn-secondary:hover { border:none; color:var(--accent); background:var(--accent-weak); box-shadow:var(--neu-out); }
html.jelly .btn-ghost { background:transparent; border:none; box-shadow:none; }
html.jelly .btn-ghost:hover { background:var(--surface-3); box-shadow:none; }
html.jelly .btn-danger { background:transparent; border:none; color:var(--danger); box-shadow:none; }
html.jelly .btn-danger:hover { background:var(--danger-weak); color:var(--danger); border:none; box-shadow:var(--neu-out-sm); }

/* 输入框：内陷（凹陷），与凸起区块形成对比 */
html.jelly .form-input, html.jelly .form-select, html.jelly .form-textarea {
  background: var(--surface-2);
  border: none;
  border-radius: var(--radius-xs);
  box-shadow: var(--neu-in);
  color: var(--text-primary);
}
html.jelly .form-input:focus, html.jelly .form-select:focus, html.jelly .form-textarea:focus {
  border: none;
  box-shadow: var(--neu-in), 0 0 0 3px var(--accent-glow);
}

/* 模态：凸起大圆角柔软浮层 */
html.jelly .modal {
  background: linear-gradient(145deg, #f1f4fa 0%, #e4e8f1 100%);
  border: none;
  border-radius: var(--radius);
  box-shadow: var(--neu-out-lg);
}

/* 侧栏 / 导航：图标浮在屏幕上的圆角方块小瓷砖（凸面高光 + 落影） */
html.jelly #sidebar {
  background: var(--bg);
  border-right: none;
  box-shadow: 3px 0 8px rgba(160,168,190,0.16), 0 0 0 1px var(--jelly-edge);
  /* 取消侧栏左右拖拽 / 横拉手势（仅保留竖向滚动），与其它主题一致 */
  touch-action: pan-y;
  overflow-x: hidden;
}
html.jelly .sidebar-nav {
  /* 禁止横向平移，避免误触发左右滑动 */
  touch-action: pan-y;
  overflow-x: hidden;
}
html.jelly .nav-item i {
  display: inline-flex; align-items:center; justify-content:center;
  width: 30px; height: 30px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(145deg, #f1f4fa 0%, #dfe3ec 100%);
  box-shadow: 2px 2px 6px rgba(165,172,190,0.20), -2px -2px 6px rgba(255,255,255,0.32),
              inset 0 1px 1px rgba(255,255,255,0.30), 0 0 0 1px var(--jelly-edge);
  margin-right: 8px;
}
html.jelly .nav-item.active {
  background: var(--accent-weak);
  border: none;
  border-radius: var(--radius-sm);
  color: var(--accent);
  font-weight: 600;
  box-shadow: var(--neu-in-sm);
}
html.jelly .nav-item.active i {
  background: linear-gradient(145deg, var(--primary-hover), var(--primary-press));
  color: #fff;
  box-shadow: 2px 2px 5px rgba(94,106,210,0.28), inset 0 1px 1px rgba(255,255,255,0.18);
}

/* 勾选 / 打卡方块：圆角软瓷砖（凸面高光），完成态内陷果冻绿 */
html.jelly .task-check, html.jelly .bz-check, html.jelly .plan-check, html.jelly .daily-check {
  border: none;
  border-radius: 7px;
  background: linear-gradient(145deg, #f1f4fa 0%, #dfe3ec 100%);
  box-shadow: var(--neu-out-sm);
  color: var(--success);
}
html.jelly .task-check:hover, html.jelly .bz-check:hover, html.jelly .plan-check:hover, html.jelly .daily-check:hover { border: none; box-shadow: var(--neu-out); }
html.jelly .task-item-done .task-check,
html.jelly .bz-check.on,
html.jelly .plan-task.done .plan-check,
html.jelly .daily-item.done .daily-check {
  background: var(--success);
  border: none;
  color: #fff;
  box-shadow: var(--neu-in-sm);
}
/* 失败态：内陷果冻红 */
html.jelly .task-item-failed .task-check,
html.jelly .plan-task.failed .plan-check,
html.jelly .bz-check.failed {
  background: var(--danger);
  border: none;
  color: #fff;
  box-shadow: var(--neu-in-sm);
}

/* 习惯日格：圆角软瓷砖 */
html.jelly .habit-day {
  border: none;
  border-radius: 10px;
  background: linear-gradient(145deg, #f1f4fa 0%, #dfe3ec 100%);
  box-shadow: var(--neu-out-sm);
  color: var(--text-muted);
}
html.jelly .habit-day.checked { background: var(--success); color:#fff; border:none; box-shadow: var(--neu-in-sm); }
html.jelly .habit-day.skipped { background: var(--warning); color:#fff; border:none; box-shadow: var(--neu-in-sm); }
html.jelly .habit-day.failed  { background: var(--danger);  color:#fff; border:none; box-shadow: var(--neu-in-sm); }
html.jelly .habit-day.today-hl { outline:none; box-shadow: var(--neu-out-sm), 0 0 0 3px var(--accent-glow); }

/* 筛选胶囊：软浮起 */
html.jelly .filter-chip {
  background: linear-gradient(145deg, #f1f4fa 0%, #dfe3ec 100%);
  border: none;
  border-radius: var(--radius-pill);
  box-shadow: var(--neu-out-sm);
  color: var(--text-muted);
}
html.jelly .filter-chip.active { background: linear-gradient(145deg, var(--primary-hover), var(--primary)); color:#fff; border:none; box-shadow: var(--neu-out-sm); }
html.jelly .time-filter-group .filter-chip:not(.active) { background: linear-gradient(145deg,#f1f4fa,#dfe3ec); border:none; color:var(--text-muted); box-shadow: var(--neu-out-sm); }

/* 密码箱条目：凸起软块 */
html.jelly .pwd-item {
  border: none;
  border-radius: var(--radius-sm);
  background: linear-gradient(145deg, #f1f4fa 0%, #e2e6ef 100%);
  box-shadow: var(--neu-out);
}
html.jelly .pwd-item:hover { border:none; transform: translateY(-2px); box-shadow: var(--neu-out-lg); }

/* 同步徽标 / 颜色选项：柔化处理 */
html.jelly .sync-badge { border:none; border-radius: var(--radius-pill); background: var(--surface-3); box-shadow: var(--neu-out-sm); }
html.jelly .color-option { border-radius: 9px; border: none; box-shadow: var(--neu-out-sm); }
html.jelly .color-option.active { border: none; transform: scale(1.1); box-shadow: var(--neu-out); }

/* Toast：柔软浮起（保留语义色背景） */
html.jelly .toast { border:none; border-radius: var(--radius-sm); box-shadow: var(--neu-out); }

/* =====================================================================
   自定义滚动条：simplebar（主题适配） + 原生滚动条兜底（主题化）
   ===================================================================== */
/* 滚动条配色变量（按主题覆盖），simplebar 与原生兜底共用 */
:root { --scroll-thumb: var(--border); --scroll-thumb-hover: var(--text-muted); }
html.dark { --scroll-thumb: #3a3f4b; --scroll-thumb-hover: #565d6b; }
html.jelly { --scroll-thumb: var(--jelly-edge); --scroll-thumb-hover: var(--jelly-edge); }

/* —— simplebar 外观（由 CSS 变量驱动，自动跟随主题） —— */
.simplebar-scrollbar::before {
  background: var(--scroll-thumb);
  border-radius: 999px;
  opacity: .5;
  left: 2px; right: 2px;
  transition: opacity .2s var(--ease-out);
}
.simplebar-scrollbar.simplebar-visible::before,
.simplebar-scrollbar:hover::before { opacity: .8; }
.simplebar-track.simplebar-vertical { width: 10px; }
.simplebar-track.simplebar-horizontal { height: 10px; }

/* —— 原生滚动条兜底（未被 simplebar 包裹的滚动区） —— *
/* 主题化滚动条（20261021y 修复：此前这 5 行只有选择器、漏了 { } 规则体，
   整组一直是无效 CSS —— 主题化滚动条从未生效。现补全，并把弹窗三个 body 纳入：
   弹窗已改回原生滚动（不再用 SimpleBar），需要这里提供一致的细滚动条外观）。 */
#moduleContainer, .ai-log, .journal-edit-readonly-content, .hub-raw, .history-list, .mem-list,
.note-fs-read, .note-fs-edit-area, .note-fs-edit-preview, #modalBody, #settingsBody, #habitPopupBody {
  scrollbar-width: thin;
  scrollbar-color: var(--scroll-thumb) transparent;
}
#moduleContainer::-webkit-scrollbar, .ai-log::-webkit-scrollbar, .journal-edit-readonly-content::-webkit-scrollbar,
.hub-raw::-webkit-scrollbar, .history-list::-webkit-scrollbar, .mem-list::-webkit-scrollbar,
.note-fs-read::-webkit-scrollbar, .note-fs-edit-area::-webkit-scrollbar, .note-fs-edit-preview::-webkit-scrollbar,
#modalBody::-webkit-scrollbar, #settingsBody::-webkit-scrollbar, #habitPopupBody::-webkit-scrollbar {
  width: 8px; height: 8px;
}
#moduleContainer::-webkit-scrollbar-thumb, .ai-log::-webkit-scrollbar-thumb, .journal-edit-readonly-content::-webkit-scrollbar-thumb,
.hub-raw::-webkit-scrollbar-thumb, .history-list::-webkit-scrollbar-thumb, .mem-list::-webkit-scrollbar-thumb,
.note-fs-read::-webkit-scrollbar-thumb, .note-fs-edit-area::-webkit-scrollbar-thumb, .note-fs-edit-preview::-webkit-scrollbar-thumb,
#modalBody::-webkit-scrollbar-thumb, #settingsBody::-webkit-scrollbar-thumb, #habitPopupBody::-webkit-scrollbar-thumb {
  background: var(--scroll-thumb); border-radius: 999px;
}
#moduleContainer::-webkit-scrollbar-thumb:hover, .ai-log::-webkit-scrollbar-thumb:hover, .journal-edit-readonly-content::-webkit-scrollbar-thumb:hover,
.hub-raw::-webkit-scrollbar-thumb:hover, .history-list::-webkit-scrollbar-thumb:hover, .mem-list::-webkit-scrollbar-thumb:hover,
.note-fs-read::-webkit-scrollbar-thumb:hover, .note-fs-edit-area::-webkit-scrollbar-thumb:hover, .note-fs-edit-preview::-webkit-scrollbar-thumb:hover,
#modalBody::-webkit-scrollbar-thumb:hover, #settingsBody::-webkit-scrollbar-thumb:hover, #habitPopupBody::-webkit-scrollbar-thumb:hover {
  background: var(--scroll-thumb-hover);
}
#moduleContainer::-webkit-scrollbar-track, .ai-log::-webkit-scrollbar-track, .journal-edit-readonly-content::-webkit-scrollbar-track,
.hub-raw::-webkit-scrollbar-track, .history-list::-webkit-scrollbar-track, .mem-list::-webkit-scrollbar-track,
.note-fs-read::-webkit-scrollbar-track, .note-fs-edit-area::-webkit-scrollbar-track, .note-fs-edit-preview::-webkit-scrollbar-track,
#modalBody::-webkit-scrollbar-track, #settingsBody::-webkit-scrollbar-track, #habitPopupBody::-webkit-scrollbar-track {
  background: transparent;
}
/* 侧栏导航：20261021y 起改回原生滚动（不再用 SimpleBar），滚动条外观与上面一致 */
.sidebar-nav {
  scrollbar-width: thin;
  scrollbar-color: var(--scroll-thumb) transparent;
}
.sidebar-nav::-webkit-scrollbar { width: 8px; height: 8px; }
.sidebar-nav::-webkit-scrollbar-thumb { background: var(--scroll-thumb); border-radius: 999px; }
.sidebar-nav::-webkit-scrollbar-thumb:hover { background: var(--scroll-thumb-hover); }
.sidebar-nav::-webkit-scrollbar-track { background: transparent; }
/* 分段控件容器：让「本周计划 / 任务」成为一体的切换器（2026-10-20c） */
.tabs { display:flex; gap:4px; padding:4px; background:rgba(128,128,128,.10); border-radius:var(--radius-md); margin-bottom:16px; }
.tabs .tab { border-radius:calc(var(--radius-md) - 4px); }
.tab {
  flex:1; min-width:0; border:none; background:transparent;
  padding:8px 10px; border-radius:var(--radius-xs);
  font-size:var(--fs-2); font-weight:600; color:var(--text-muted);
  cursor:pointer; white-space:nowrap;
  font-family:var(--font-sans);
  transition:background .15s var(--ease-out), color .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
.tab:hover { color:var(--text-secondary); }
.tab.active { background:var(--accent-weak); color:var(--accent); box-shadow:var(--shadow-sm); }
.dark .tab.active { color:var(--accent-ink); }
.tab--solid.active { background:var(--accent); color:var(--on-primary); box-shadow:var(--shadow-sm); }
.dark .tab--solid.active { color:var(--on-primary); }
/* 窄屏：允许横向滚动（不换行挤压） */
@media (max-width:600px) {
  .tabs { overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .tabs::-webkit-scrollbar { display:none; }
  .tab { flex:1 0 auto; }
}
.empty-state i { font-size:2rem; opacity:.55; display:block; }
.empty-state p { font-size:var(--fs-2); line-height:1.5; margin:0; }
.empty-state .btn { margin-top:4px; }
.empty-state--compact { padding:18px 12px; }
.empty-state--compact i { font-size:1.5rem; }

/* ---- Section Head（统一区块标题；由 daily-section-head 提级为标准）
   旧 daily-section-head / gd-section-head / se-head 及 timer/calendar/habit 的内联 h3 迁移至此。 ---- */
.section-head {
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:var(--space-3); gap:8px; flex-wrap:wrap;
}
.section-head h3,
.section-head-title {
  font-size:var(--fs-3); font-weight:700; margin:0;
  display:flex; align-items:center; gap:6px; color:var(--text-primary);
}
.section-head h3 i,
.section-head-title i { color:var(--text-secondary); }
.section-count {
  font-size:var(--fs-1); color:var(--text-muted); background:var(--surface-3);
  padding:2px 10px; border-radius:var(--radius-pill);
}

/* ---- Loading（统一加载态；旧 ww-loading/bz-loading 及内联「加载中…」迁移至此） ---- */
.loading {
  display:flex; align-items:center; justify-content:center; gap:8px;
  padding:24px 12px; color:var(--text-muted); font-size:var(--fs-2);
}
.loading i { font-size:var(--fs-3); }

/* ---- Icon Button（统一图标小按钮；旧 daily-act/plan-act/bz-edit/journal-del/tm-del-btn 等迁移至此） ---- */
.icon-btn {
  display:inline-flex; align-items:center; justify-content:center;
  width:var(--ctrl-h-sm); height:var(--ctrl-h-sm); flex:0 0 auto;
  border:none; background:transparent; border-radius:var(--radius-sm);
  color:var(--text-muted); cursor:pointer; font-size:var(--fs-3);
  transition:background .15s var(--ease-out), color .15s var(--ease-out),
              border-color .15s var(--ease-out), transform .12s cubic-bezier(0.34,1.56,0.64,1);
}
.icon-btn:hover { background:var(--surface-3); color:var(--text-primary); }
.icon-btn:active { transform:scale(.9); }
.icon-btn.danger:hover { background:var(--danger-weak); color:var(--danger); }
.icon-btn.danger { color:var(--danger); }

/* ---- Quick Add（统一快捷新增行；由 task-top 模式提级为标准） ---- */
.quick-add { display:flex; gap:8px; margin-bottom:12px; flex-wrap:wrap; }
.quick-add .form-input { flex:1; min-width:160px; }

/* ---- 共享组件扩展（UI/UX 统一化 2026-08-23） ---- */
.modal--wide { max-width:720px; }
.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:14px; }
@media (max-width:600px) { .stat-grid { grid-template-columns:repeat(2,1fr); } }
.btn-block { width:100%; }

/* =====================================================================
   10.1 Design System 3.0 组件补全（2026-08-23）
   Dropdown / List / Progress / Page Sub —— 由模块私有实现提级为共享组件。
   ===================================================================== */

/* ---- Dropdown（统一弹出菜单；由 kb-menu-pop / habit-menu-dropdown 提级）
   用法：<div class="menu-pop" id="...">（position:fixed，JS 锚定）
   条目：.menu-pop .menu-item（icon + 文案，可选 .on / .danger） ---- */
.menu-pop {
  position:fixed; z-index:9995;
  min-width:168px; max-width:248px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow-lg);
  padding:6px;
  display:none;
}
.menu-pop.open { display:block; animation:menuPopIn .16s var(--ease-out); }
@keyframes menuPopIn { from { opacity:0; transform:translateY(-4px) scale(.98); } to { opacity:1; transform:translateY(0) scale(1); } }
.menu-pop .menu-item {
  display:flex; align-items:center; gap:8px;
  padding:8px 10px; border-radius:var(--radius-xs);
  color:var(--text-primary); cursor:pointer;
  font-size:var(--fs-2); white-space:nowrap;
  transition:background .13s var(--ease-out);
}
.menu-pop .menu-item:hover { background:var(--surface-3); }
.menu-pop .menu-item.on { background:var(--accent-weak); color:var(--accent); font-weight:600; }
.menu-pop .menu-item.on::after { content:'✓'; margin-left:auto; color:var(--accent); font-weight:700; }
.menu-pop .menu-item.danger { color:var(--danger); }
.menu-pop .menu-item.danger:hover { background:var(--danger-weak); }
.menu-pop .menu-item i { width:16px; text-align:center; opacity:.85; }
.menu-pop .menu-sep { height:1px; background:var(--border); margin:5px 4px; }

/* ---- List Item（统一列表行基础；各模块领域行在此基础上增强） ---- */
.list-item {
  display:flex; align-items:center; gap:10px;
  padding:10px 12px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  margin-bottom:8px;
  transition:border-color .15s var(--ease-out), background .15s var(--ease-out);
}
.list-item:hover { border-color:var(--border-strong); }
.list-item + .list-item { margin-top:0; }

/* ---- Progress（统一进度条；由 wo-day-bar / gd-bar 提级） ---- */
.progress {
  height:8px; border-radius:var(--radius-pill);
  background:var(--surface-3); border:1px solid var(--border);
  overflow:hidden;
}
.progress-fill {
  height:100%; border-radius:var(--radius-pill);
  background:var(--accent);
  transition:width .4s var(--ease-out);
}
.progress--sm { height:4px; }

/* ---- Page Sub（页面说明/状态行，Page Layout 第二层） ---- */
.page-sub {
  font-size:var(--fs-2); color:var(--text-muted);
  margin:-6px 0 var(--space-4); line-height:1.5;
}

/* Dropdown 挂载式变体（habit 等：absolute 锚定在触发按钮内，JS 控制显隐） */
.menu-pop--anchor { position:absolute; min-width:130px; }

/* =====================================================================
   10.3 设置面板：模块显隐 / 模块顺序（2026-08-23）
   此前这些类无任何 CSS 定义（裸样式），本次补齐标准 Switch 与行/分组样式。
   ===================================================================== */

/* ---- Switch（标准开关组件；显隐开关等使用，5 主题自动适配） ---- */
.switch { position:relative; display:inline-block; width:36px; height:20px; flex:0 0 auto; }
.switch input { opacity:0; width:0; height:0; }
.switch .slider {
  position:absolute; inset:0; cursor:pointer;
  background:var(--surface-3); border:1px solid var(--border);
  border-radius:var(--radius-pill);
  transition:background .18s var(--ease-out), border-color .18s var(--ease-out);
}
.switch .slider::before {
  content:''; position:absolute; left:2px; top:2px; width:14px; height:14px;
  background:var(--text-muted); border-radius:50%;
  transition:transform .18s var(--ease-out), background .18s var(--ease-out);
}
.switch input:checked + .slider { background:var(--accent); border-color:var(--accent); }
.switch input:checked + .slider::before { transform:translateX(16px); background:#fff; }
.dark .switch input:checked + .slider::before { background:var(--on-primary); }
.switch input:focus-visible + .slider { outline:2px solid var(--accent); outline-offset:1px; }

/* ---- 模块显隐 / 模块顺序 列表 ---- */
.module-toggles, .module-order-list { display:flex; flex-direction:column; gap:6px; margin-top:2px; }
.module-toggle-row {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:9px 12px; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-sm); cursor:pointer;
  transition:border-color .15s var(--ease-out), background .15s var(--ease-out);
}
.module-toggle-row:hover { border-color:var(--border-strong); }
.mt-info { display:flex; align-items:center; gap:8px; font-size:var(--fs-2); color:var(--text-primary); min-width:0; }
.mt-info i { width:16px; text-align:center; color:var(--text-secondary); }
.mod-order-group-label {
  font-size:var(--fs-1); font-weight:700; color:var(--text-muted);
  letter-spacing:.05em; text-transform:uppercase;
  margin:10px 2px 2px; padding-top:8px; border-top:1px dashed var(--border);
}
.mod-order-group-label:first-child { margin-top:0; padding-top:0; border-top:none; }
.mod-order-row {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:9px 12px; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-sm);
}
.mod-order-actions { display:flex; gap:4px; flex:0 0 auto; }
.mod-order-placeholder { width:26px; flex:0 0 auto; }
@media (max-width:600px) {
  .module-toggle-row, .mod-order-row { padding:11px 12px; }  /* 移动端加大点按区 */
}

/* =====================================================================
   10.2 Layout Utilities（Design System 3.0：内联样式收敛）
   仅覆盖高频布局/文字模式，禁止滥用；优先语义组件类，其次工具类。
   ===================================================================== */
.flex { display:flex; }
.flex-col { display:flex; flex-direction:column; }
.flex-between { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.flex-center { display:flex; align-items:center; gap:8px; }
.flex-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.flex-1 { flex:1; min-width:0; }
.text-muted { color:var(--text-muted); }
.text-secondary { color:var(--text-secondary); }
.text-accent { color:var(--accent); }
.fs-xs { font-size:.7rem; }
.fs-sm { font-size:.78rem; }
.mt-6 { margin-top:6px; }
.mt-8 { margin-top:8px; }
.mt-10 { margin-top:10px; }
.mt-12 { margin-top:12px; }
.mt-14 { margin-top:14px; }
.mb-8 { margin-bottom:8px; }
.mb-10 { margin-bottom:10px; }
.mb-12 { margin-bottom:12px; }
.mb-14 { margin-bottom:14px; }
.mb-16 { margin-bottom:16px; }
.w-full { width:100%; }
/* 领域高频容器（timer/calendar 提取） */
.input-sm { font-size:.7rem; padding:4px 8px; flex:1; min-width:90px; }
.scroll-260 { max-height:260px; overflow-y:auto; }
.chart-box { height:260px; flex:1; min-height:220px; }
.panel-box { display:none; padding:8px; border-radius:12px; margin-bottom:8px; }

/* timer 记录表格 / 筛选下拉（Phase 4 收敛） */
.tm-table { width:100%; font-size:.8rem; border-collapse:collapse; min-width:420px; }
.tm-thead { position:sticky; top:0; z-index:10; }
.tm-tr-head { font-size:.65rem; font-weight:600; color:var(--text-secondary); text-transform:uppercase; }
.tm-th { padding:6px 4px; text-align:left; }
.tm-th-c { text-align:center; }
.tm-td { padding:5px 4px; font-size:.75rem; }
.tm-td-sec { color:var(--text-secondary); }
.tm-td-ok { font-weight:600; color:var(--success); }
.tm-td-c { text-align:center; }
.tm-td-empty { padding:24px; text-align:center; color:var(--text-muted); }
.menu-pop--lg { min-width:160px; max-height:240px; overflow-y:auto; }

/* calendar 领域行/标签（Phase 4 收敛） */
.cal-empty { text-align:center; color:var(--text-muted); padding:20px; }
.cal-empty-lg { text-align:center; padding:24px; color:var(--text-muted); }
.cal-row { display:flex; align-items:center; gap:8px; font-size:.85rem; cursor:pointer; }
.cal-title { flex:1; font-size:.88rem; }
.cal-label { font-weight:600; font-size:.85rem; }
.cal-weekday { text-align:center; padding:8px 0; font-size:.75rem; font-weight:600; color:var(--text-secondary); background:var(--surface-2); }
.cal-sidebar { width:320px; min-width:260px; }
.scroll-60vh { max-height:60vh; overflow-y:auto; }

/* =====================================================================
   打卡 V3.0 · 多项目 + 按日期打卡（20261020g 重构）
   图表全部内联 SVG，--accent 由插件按项目主题色动态注入（全局联动）。
   ===================================================================== */
.hk3 {
  --hk3-track: rgba(128,128,128,.18);
  --hk3-fill: rgba(128,128,128,.10);
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-bottom: 24px;
}

/* ---------- 项目条 ---------- */
.hk3-bar { position: sticky; top: 0; z-index: 6; margin: 0 -4px; }
.hk3-bar-scroll { display: flex; gap: 8px; overflow-x: auto; padding: 4px; scrollbar-width: none; }
.hk3-bar-scroll::-webkit-scrollbar { display: none; }
.hk3-chip {
  display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto;
  padding: 7px 12px; border-radius: 999px;
  border: 1px solid var(--border); background: var(--surface-2);
  color: var(--text-secondary); font-size: .82rem; cursor: pointer;
  transition: border-color .18s, color .18s, background .18s;
}
.hk3-chip:hover { border-color: var(--border-strong); color: var(--text-primary); }
.hk3-chip.on {
  border-color: var(--chip, var(--accent));
  background: var(--surface-3);
  color: var(--text-primary);
  box-shadow: inset 0 0 0 1px var(--chip, var(--accent));
}
.hk3-chip-ic { font-size: 1rem; line-height: 1; }
.hk3-chip--add { padding: 7px 11px; color: var(--text-muted); }
.hk3-chip--add:hover { color: var(--accent); border-color: var(--accent); }

/* ---------- 头部：日期 + 状态 ---------- */
.hk3-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.hk3-date { display: flex; align-items: baseline; gap: 10px; }
.hk3-date-d { font-size: 2.4rem; font-weight: 700; line-height: 1; letter-spacing: -.02em; color: var(--text-primary); }
.hk3-date-m { font-size: .82rem; color: var(--text-muted); }
.hk3-head-right { display: flex; align-items: center; gap: 10px; }
.hk3-status { font-size: .74rem; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border); color: var(--text-muted); white-space: nowrap; }
.hk3-status.done { color: var(--success); border-color: var(--success); background: var(--success-weak); }
.hk3-status.pending { color: var(--warning); border-color: var(--warning); background: var(--warning-weak); }
.hk3-bf { font-size: .7rem; color: var(--text-muted); display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.hk3-iconbtn {
  width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px; border: 1px solid var(--border); background: var(--surface-2);
  color: var(--text-secondary); cursor: pointer;
}
.hk3-iconbtn:hover { color: var(--text-primary); border-color: var(--border-strong); }

/* ---------- 更多菜单 ---------- */
.hk3-menu {
  position: absolute; right: 12px; top: 84px; z-index: 40; min-width: 156px;
  padding: 6px; border-radius: 12px; border: 1px solid var(--border-strong);
  background: var(--surface-2); box-shadow: 0 14px 36px rgba(0,0,0,.38);
}
.hk3-menu-item {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 9px 10px; border: 0; background: none; border-radius: 8px;
  color: var(--text-secondary); font-size: .82rem; font-family: inherit;
  cursor: pointer; text-align: left;
}
.hk3-menu-item:hover { background: var(--surface-3); color: var(--text-primary); }
.hk3-menu-item.danger { color: var(--danger); }
.hk3-menu-item.danger:hover { background: var(--danger-weak); }
.hk3-moods { display: flex; gap: 8px; flex-wrap: wrap; }
.hk3-mood {
  width: 40px; height: 40px; font-size: 1.2rem; line-height: 1;
  border-radius: 12px; border: 1px solid var(--border);
  background: var(--surface-2); cursor: pointer;
  transition: transform .15s, border-color .15s, background .15s;
}
.hk3-mood:hover { border-color: var(--accent); transform: translateY(-1px); }
.hk3-mood.on { border-color: var(--accent); background: var(--accent-weak); box-shadow: inset 0 0 0 1px var(--accent); }
.hk3-note {
  width: 100%; box-sizing: border-box; resize: vertical; min-height: 56px;
  padding: 10px 12px; border-radius: 10px;
  border: 1px solid var(--border); background: var(--surface-2);
  color: var(--text-primary); font-size: .85rem; font-family: inherit; line-height: 1.5;
}
.hk3-note:focus { outline: none; border-color: var(--accent); }
.hk3-note::placeholder { color: var(--text-tertiary); }
.hk3-note-count { align-self: flex-end; margin-top: -4px; font-size: .7rem; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.hk3-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; height: 48px; border-radius: 12px; border: 0;
  background: var(--accent); color: #fff; font-size: .95rem; font-weight: 600;
  font-family: inherit; cursor: pointer;
  transition: filter .18s, transform .1s;
}
.hk3-btn:hover { filter: brightness(1.08); }
.hk3-btn:active { transform: scale(.99); }
.hk3-btn:disabled, .hk3-btn--disabled {
  background: var(--surface-3); color: var(--text-muted);
  cursor: not-allowed; filter: none; transform: none;
}
.hk3-btn--sm { width: auto; height: 40px; padding: 0 18px; margin: 0 auto; font-size: .85rem; }
.hk3-done { display: flex; flex-direction: column; gap: 6px; }
.hk3-done-line { display: flex; align-items: center; gap: 8px; color: var(--success); font-weight: 600; }
.hk3-done-mood { font-size: 1.6rem; }
.hk3-done-note { font-size: .85rem; color: var(--text-secondary); line-height: 1.5; word-break: break-word; }

/* ---------- 四项统计 ---------- */
.hk3-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.hk3-stat {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 16px 8px; border-radius: 14px;
  border: 1px solid var(--border); background: var(--surface);
}
.hk3-num { font-size: 1.5rem; font-weight: 700; line-height: 1; color: var(--text-primary); font-variant-numeric: tabular-nums; }
.hk3-stat span { font-size: .7rem; color: var(--text-muted); display: flex; align-items: center; gap: 4px; }
.hk3-stat span i { color: var(--accent); }

/* ---------- 空态 ---------- */
.hk3-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 56px 20px; text-align: center; }
.hk3-empty-ic { font-size: 2.4rem; color: var(--accent); }
.hk3-empty-t { font-size: 1rem; font-weight: 600; color: var(--text-primary); }
.hk3-empty-d { font-size: .82rem; color: var(--text-muted); }

/* ---------- 新建 / 编辑项目 ---------- */
.hk3-editor { display: flex; flex-direction: column; gap: 16px; }
.hk3-field { display: flex; flex-direction: column; gap: 8px; }
.hk3-field label { font-size: .78rem; color: var(--text-secondary); }
.hk3-icons {
  display: grid; grid-template-columns: repeat(8, 1fr); gap: 6px;
  max-height: 172px; overflow-y: auto; padding: 2px;
}
.hk3-iconopt {
  aspect-ratio: 1; font-size: 1.15rem; line-height: 1;
  border-radius: 10px; border: 1px solid var(--border);
  background: var(--surface-2); cursor: pointer;
}
.hk3-iconopt:hover { border-color: var(--border-strong); }
.hk3-iconopt.on { border-color: var(--accent); background: var(--accent-weak); }
.hk3-colors { display: flex; gap: 8px; flex-wrap: wrap; }
.hk3-color { width: 28px; height: 28px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; }
.hk3-color.on { border-color: var(--text-primary); box-shadow: 0 0 0 2px var(--surface); }

/* ---------- 响应式 ---------- */
@media (max-width: 560px) {
  .hk3-stats { grid-template-columns: repeat(2, 1fr); }
  .hk3-date-d { font-size: 2rem; }
  .hk3-icons { grid-template-columns: repeat(7, 1fr); }
}

/* ===== 打卡 V3.1 · 对齐专注模块（glass-card + section-head + ECharts）===== */
.hk3-hero2 { display:flex; flex-direction:column; gap:14px; }
.hk4-checkin { display:flex; flex-direction:column; gap:10px; }
.hk4-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.hk4-grid > .glass-card { min-width:0; }
.hk4-chart-card { display:flex; flex-direction:column; }
.hk4-chart-card .chart-box { margin-top:4px; }
.hk4-wide { grid-column:1 / -1; }
.hk4-ranges { display:flex; gap:4px; flex-wrap:wrap; }
@media (max-width:900px) { .hk4-grid { grid-template-columns:1fr; } }

/* =====================================================================
   按钮体验补全（20261021g）
   原则：只补「状态」，不改造型 —— 颜色 / 尺寸 / 圆角全部沿用既有令牌，
        观感与原来一致，只把「点了没反应」「看起来能点其实不能点」修掉。
   修的四个问题：
     1) 全局缺禁用态：此前只有 3 处零星覆盖，大量 disabled 按钮与可用态无法区分；
     2) 触屏点击区偏小：.btn 40px / .btn-sm 32px，低于 44px 可点性下限；
     3) 部分按钮无按下反馈：secondary / ghost / danger / icon-btn / filter-chip / se-btn 没有 :active；
     4) filter-chip 没有 hover（13 条规则里 0 个）。
   ===================================================================== */

/* ---------- 1. 禁用态：统一变淡 + 冻结 hover（禁用按钮不应再响应变色） ---------- */
.btn:disabled, .btn[disabled],
.icon-btn:disabled, .icon-btn[disabled],
.filter-chip:disabled, .filter-chip[disabled],
.se-btn:disabled, .se-btn[disabled] {
  opacity: .45;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}
.btn:disabled:hover, .btn[disabled]:hover,
.icon-btn:disabled:hover, .filter-chip:disabled:hover, .se-btn:disabled:hover {
  background: var(--surface);
  border-color: var(--border);
  color: var(--text-secondary);
  box-shadow: none;
}
/* primary 禁用：保留主色语义但变淡，hover 不再变亮 */
.btn-primary:disabled, .btn-primary[disabled],
.btn-primary:disabled:hover, .btn-primary[disabled]:hover {
  background: var(--primary);
  border-color: var(--primary);
  color: var(--on-primary);
  box-shadow: none;
}
.btn-danger:disabled, .btn-danger[disabled],
.btn-danger:disabled:hover, .btn-danger[disabled]:hover {
  background: transparent;
  border-color: var(--danger-weak);
  color: var(--danger);
}
.btn-ghost:disabled, .btn-ghost[disabled],
.btn-ghost:disabled:hover, .btn-ghost[disabled]:hover {
  background: transparent;
  border-color: transparent;
  color: var(--text-secondary);
}

/* ---------- 2. 按下反馈（补上缺 :active 的几类） ---------- */
.btn-secondary:active, .btn-ghost:active, .btn-danger:active,
.se-btn:active, .filter-chip:active { transform: scale(.97); }
.btn-ghost:active { background: var(--surface-3); }
.btn-danger:active { background: var(--danger-weak); }
.icon-btn:active { transform: scale(.92); background: var(--surface-3); }
.filter-chip:active { background: var(--surface); }

/* ---------- 3. filter-chip 的悬停 ---------- */
.filter-chip:hover { border-color: var(--border-strong); color: var(--text-primary); background: var(--surface); }
.filter-chip.active:hover { background: var(--accent); color: #fff; border-color: var(--accent); }
.dark .filter-chip.active:hover { color: var(--on-primary); }

/* ---------- 4. 触屏：点击区抬到可点性下限（只影响粗指针设备，桌面鼠标不变） ---------- */
@media (pointer: coarse) {
  .btn { min-height: 44px; }
  .btn-sm { min-height: 40px; padding: 0 14px; }
  .btn-xs { min-height: 34px; }
  .icon-btn { width: 40px; height: 40px; }
  .filter-chip { min-height: 38px; padding: 6px 16px; }
  .se-btn { min-height: 36px; }
  /* 触屏没有 hover 兜底，按下反馈给足一点 */
  .btn:active, .btn-primary:active, .se-btn:active,
  .filter-chip:active, .lock-btn:active { transform: scale(.96); }
}

/* ---------- 5. 键盘可达性：让所有按钮类都吃到统一焦点环 ---------- */
.icon-btn:focus-visible, .se-btn:focus-visible, .timer-btn:focus-visible,
.btn-xs:focus-visible, .btn-sm:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--accent-glow);
}

/* ---------- 6. 列表操作按钮的悬停 + 触控响应（20261021g） ---------- */
/* inbox-act / inbox-conv 此前只有 :active，鼠标悬停无任何反馈 */
.inbox-act:hover, .inbox-conv:hover { background: var(--surface-3); color: var(--text-primary); }
/* 声明「这里只做点击/滚动」，去掉浏览器为双击缩放保留的等待，连点更跟手 */
.btn, .icon-btn, .filter-chip, .se-btn, .lock-btn,
.daily-act, .inbox-act, .plan-act, .journal-del, .daily-del,
.bz-edit, .tm-del-btn, .task-today-btn {
  touch-action: manipulation;
}

/* =========================================================
   20261021r · 视觉整改（来源：2026-10-26 双端审计）
   ① 日记 A 时间轴版式 ② 像素宠物遮挡 ③ 手机计划列
   ④ 触控尺寸 ⑤ 手机底部标签栏 ⑥ 日历小字
   ========================================================= */

/* ---------- ① 日记：头部 + 速记条 ---------- */
.journal-header { align-items: center; }
.jn-head-left { display: flex; align-items: center; gap: 10px; min-width: 0; }

.jn-compose { padding: 12px 14px; margin-bottom: 14px; }
.jn-quick { display: flex; align-items: center; gap: 10px; min-height: 40px; cursor: text; outline: none; }
.jn-quick:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: var(--radius-sm); }
.jn-quick-ph { flex: 1; min-width: 0; color: var(--text-muted); font-size: var(--fs-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jn-quick-tools { display: flex; gap: 6px; flex: 0 0 auto; }
.jn-qbtn {
  width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--border); background: var(--surface); color: var(--text-muted);
  border-radius: var(--radius-sm); cursor: pointer; font-size: .86rem; transition: .12s var(--ease-out);
}
.jn-qbtn:hover { color: var(--text-primary); border-color: var(--border-strong); }
.jn-qbtn-go { background: var(--primary); border-color: transparent; color: var(--on-primary); }
.jn-qbtn-go:hover { background: var(--primary-hover); color: var(--on-primary); }
.jn-editor { padding-top: 6px; }

/* ---------- 筛选吸顶 ---------- */
.jn-sticky {
  position: sticky; top: 0; z-index: 12;
  background: color-mix(in srgb, var(--bg) 93%, transparent);
  backdrop-filter: blur(10px);
  padding: 8px 0; margin-bottom: 8px;
  border-bottom: 1px solid var(--border);
}

/* ---------- 时间轴 ---------- */
.jn-layout { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 20px; align-items: start; }
.jn-main { min-width: 0; }
.jn-timeline { position: relative; }
.jn-group { position: relative; }
.jn-band {
  position: relative; display: flex; align-items: center; gap: 8px;
  margin: 14px 0 8px; padding-left: 84px;
  font-size: var(--fs-1); font-weight: 700; color: var(--text-muted); letter-spacing: .4px;
}
.jn-band span { font-size: .64rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-pill); padding: 0 7px; }
.jn-band::after { content: ""; flex: 1; height: 1px; background: var(--border); }

.jn-row { position: relative; padding-left: 84px; padding-bottom: 10px; }
.jn-row::before { content: ""; position: absolute; left: 62px; top: 0; bottom: -10px; width: 2px; background: var(--border); }
.jn-node {
  position: absolute; left: 58px; top: 16px; width: 10px; height: 10px; z-index: 1;
  border-radius: 50%; background: var(--surface); border: 2px solid var(--violet);
}
.jn-rail { position: absolute; left: 0; top: 12px; width: 52px; text-align: right; line-height: 1.15; }
.jn-rail b { display: block; font-size: .8rem; font-weight: 700; color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.jn-rail span { font-size: .62rem; color: var(--text-muted); }

/* 条目：不再定宽；收起态 = 纯文本 3 行截断（Markdown 只在展开后渲染，
   否则 <p> 块会让 line-clamp 失效、行间出现大片空隙） */
.jn-row .journal-entry { flex: none; width: auto; max-width: none; cursor: pointer; }
.journal-entry-content { white-space: pre-wrap; overflow-wrap: anywhere; }
.journal-entry-content.is-clamp {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.jn-more { margin-left: auto; border: 0; background: none; color: var(--accent); font-size: var(--fs-1); font-weight: 600; cursor: pointer; padding: 2px 4px; }
.jn-date-inline { display: none; }
.journal-entry-foot .journal-date { margin-left: 8px; }

/* 右侧统计 */
.jn-aside { display: flex; flex-direction: column; gap: 10px; }
.jn-stat { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; }
.jn-stat .k { font-size: var(--fs-1); font-weight: 700; color: var(--text-muted); letter-spacing: .3px; }
.jn-stat .v { font-size: 1.3rem; font-weight: 800; margin-top: 2px; font-variant-numeric: tabular-nums; }
.jn-stat .v small { font-size: .68rem; font-weight: 700; color: var(--text-muted); margin-left: 3px; }
.jn-taglist { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.jn-taglist .journal-tag { display: inline-flex; align-items: center; gap: 4px; }
.jn-taglist .journal-tag i { font-style: normal; opacity: .62; font-size: .62rem; }

/* 手机：日期改内联、隐藏侧栏与竖轨 */
@media (max-width: 900px) {
  .jn-layout { display: block; }
  .jn-aside { display: none; }
  .jn-row { padding-left: 0; }
  .jn-row::before, .jn-node, .jn-rail { display: none; }
  .jn-band { padding-left: 0; }
  .jn-date-inline { display: inline; margin-right: 6px; font-size: .68rem; font-weight: 700; color: var(--text-muted); }
  .journal-entry-foot .journal-date { display: none; }
  /* 筛选压成两行：标签条一行、年月 + 搜索一行（原来堆三行，白占 ~60px） */
  .jn-sticky .journal-filter-right { width: 100%; flex-wrap: nowrap; }
  .jn-sticky .journal-ym-filter { max-width: 128px; }
  .jn-sticky .journal-search { flex: 1 1 auto; min-width: 0; max-width: none; }
  .jn-sticky .journal-tags-filter { padding-right: 28px; }
}

/* ---------- ② 像素主题：底部宠物安全区（P0 遮挡修复） ----------
   宠物是 position:fixed 的底部浮层（高 96px），只加 padding 挡不住滚动内容。
   必须缩短滚动容器本身（margin-bottom），让内容在浮层上方结束。 */
html.pixel #moduleContainer { margin-bottom: 96px; padding-bottom: 12px; }

/* ---------- ③ 手机计划：2 列网格，取消横向挤压（P0） ---------- */
@media (max-width: 560px) {
  .plan-week {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px; overflow: visible;
  }
  .plan-week .plan-day { width: auto; max-width: none; flex: none; min-height: 104px; }
}

/* ---------- ④ 日历小字可读性（农历 10px → 11px） ---------- */
.fc-lunar, .cal-cell .l { font-size: .7rem; }
@media (max-width: 560px) { .fc-lunar { font-size: .68rem; } }

/* ---------- ⑤ 触屏点击目标 ≥38px（P1） ---------- */
@media (pointer: coarse) {
  .btn-sm, .journal-edit, .journal-del, .jn-qbtn, .filter-chip,
  .daily-act, .plan-act, .tm-del-btn, .bz-edit { min-height: 38px; min-width: 38px; }
  .journal-edit, .journal-del { display: inline-flex; align-items: center; justify-content: center; }
}

/* ---------- ⑥ 手机底部标签栏（P1：一次可达） ---------- */
.mobile-tabbar { display: none; }
@media (max-width: 768px) {
  .mobile-tabbar {
    display: grid; grid-template-columns: repeat(5, 1fr);
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    height: calc(58px + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    backdrop-filter: blur(14px);
    border-top: 1px solid var(--border);
  }
  .mobile-tabbar button {
    border: 0; background: none; cursor: pointer;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    color: var(--text-muted); font-size: .62rem; font-weight: 600; padding: 0;
  }
  .mobile-tabbar button i { font-size: 1.05rem; line-height: 1; }
  .mobile-tabbar button.active { color: var(--accent); }
  /* 20261021w：抽屉打开时必须隐藏标签栏。
     标签栏 z-index:60 而 #sidebar 只有 50，两者都贴视口底部，
     标签栏会盖住侧栏底部「锁定 / 设置」按钮 → 手机端点不到设置。 */
  body.drawer-open .mobile-tabbar { display: none; }
  /* 20261021w：手机端 Toast 抬到底部标签栏之上。
     原来 bottom:24px，会正好压在抽屉底部的「锁定 / 设置」按钮上（视觉遮挡，
     虽然 pointer-events:none 不拦截点击，但用户会以为点不到）。 */
  #toastContainer { bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
  #moduleContainer { padding-bottom: calc(58px + env(safe-area-inset-bottom, 0px)); }
}

/* ===== css/pixel-rpg.css ===== */
/* @import 已移除（外网阻塞，见 build-bundle.mjs） */
/* =====================================================================
   FlowOS · Pixel World Theme — "Modern OS × Pixel Art"
   ---------------------------------------------------------------------
   方向（v6，替代旧 RPG/GBA 方案）：
   · 现代 Web App 的信息结构与留白 + Pixel Art 的边缘/阴影/装饰语言。
   · 深色 Pixel World 画布（克制深松绿夜空 + 星点 + 阶梯远山），
     温暖米纸 Surface 浮于其上；自然绿 Accent，少量黄/红/蓝点缀。
   · Pixel Panel 技法：clip-path 阶梯切角 + inset 多层像素边框 +
     drop-shadow 硬偏移投影 + 内高光/内阴影；克制的非对称细节。
   · 三级面板层级：Primary（浮起，切角，主内容）/ Secondary（方角墨框，
     硬投影，常规卡片）/ Sub（凹陷槽，辅助信息）。
   · 像素字体仅用于数字与小标签；正文保持现代清晰字体。
   · 宝可梦 = Pixel Companion（陪伴/反馈），无任何 HP/EXP/战斗 HUD。
   · 布局/功能/数据/业务 DOM 一律不动，仅做 UI 美术层覆盖。
   ===================================================================== */

/* ---------- 动画 ---------- */
@keyframes pet-bob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }
@keyframes cloud-drift { from { transform: translateX(0); } to { transform: translateX(14px); } }
@keyframes star-twinkle { 0%,100%{opacity:.95} 50%{opacity:.45} }
@keyframes moon-drift { 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(-4px); } }

/* =====================================================================
   设计令牌
   ===================================================================== */
html.pixel {
  color-scheme: light;

  /* 像素字体：仅数字 / 小标签（拉丁），正文中文回退系统字体 */
  --font-pixel: "Press Start 2P", "VT323", var(--font-mono);
  --font-pixel-latin: "VT323", "Press Start 2P", var(--font-mono);

  /* ---------- Pixel World 画布（深松绿夜空，克制不霓虹） ---------- */
  --px-world-1: #2A453B;            /* 夜空上缘 */
  --px-world-2: #1E352E;            /* 夜空主体 */
  --px-world-3: #17291F;            /* 夜空下缘 */
  --px-hill: #1B3128;               /* 阶梯远山剪影 */
  --px-grass: #2C5438;              /* 前景草地 */
  --px-grass-edge: #417A50;         /* 草地上缘亮线 */
  --px-star: #F2E3AC;               /* 星点（暖） */
  --px-star-2: #CFE0CF;             /* 星点（冷） */
  --px-moon: #F5E6B8;               /* 像素月亮 */

  /* ---------- 米纸 Surface（温暖浅色，深墨文字） ---------- */
  --px-cream: #F7F1E0;              /* 主面板纸面 */
  --px-cream-2: #EFE6CE;            /* 次面板 / 头部带 */
  --px-cream-3: #E6D9BC;            /* 凹陷槽 / 输入井 */
  --px-cream-4: #DBCCA9;
  --px-hi: rgba(255,252,240,.70);   /* 内高光（顶部受光） */
  --px-shade: rgba(58,51,43,.08);   /* 内阴影（底部背光） */

  /* ---------- 墨线与文字（暖棕黑，非纯黑） ---------- */
  --px-ink: #3A332B;
  --px-ink-soft: #5C5344;
  --px-ink-mute: #857A64;

  /* ---------- Accent：自然绿为主，黄/红/蓝少量点缀 ---------- */
  --px-green: #5FA75B;
  --px-green-lt: #79BC6E;
  --px-green-dk: #48844A;
  --px-green-pale: #DCEACB;
  --px-amber: #C99327;
  --px-amber-pale: #F3E3B6;
  --px-red: #C24A42;
  --px-red-pale: #F0D2C6;
  --px-blue: #5E88AE;
  --px-blue-pale: #D6E2EB;

  /* ---------- 硬投影（无模糊，像素错位感） ---------- */
  --px-drop-sm: drop-shadow(2px 2px 0 rgba(24,19,12,.25));
  --px-drop-md: drop-shadow(3px 3px 0 rgba(24,19,12,.28));
  --px-drop-lg: drop-shadow(5px 5px 0 rgba(24,19,12,.32));
  --px-shadow-card: 4px 4px 0 rgba(24,19,12,.28);

  /* ---------- 阶梯切角 ----------
     lg：两级 4px 阶梯（Primary 面板 / 弹窗 / 锁屏卡）
     sm：一级 2px 切角（按钮 / 输入 / 标签 / 进度 / Toast / 下拉） */
  --px-clip-lg: polygon(
    4px 0, calc(100% - 4px) 0,
    calc(100% - 4px) 2px, calc(100% - 2px) 2px,
    calc(100% - 2px) 4px, 100% 4px,
    100% calc(100% - 4px), calc(100% - 2px) calc(100% - 4px),
    calc(100% - 2px) calc(100% - 2px), calc(100% - 4px) calc(100% - 2px),
    calc(100% - 4px) 100%, 4px 100%,
    4px calc(100% - 2px), 2px calc(100% - 2px),
    2px calc(100% - 4px), 0 calc(100% - 4px),
    0 4px, 2px 4px, 2px 2px, 4px 2px
  );
  --px-clip-sm: polygon(
    2px 0, calc(100% - 2px) 0, 100% 2px,
    100% calc(100% - 2px), calc(100% - 2px) 100%,
    2px 100%, 0 calc(100% - 2px), 0 2px
  );

  /* ============================================================
     基础令牌覆盖：把 variables.css 残留的旧暗色 .pixel 块
     整组翻成「暖米纸 + 深墨字 + 自然绿」。html.pixel 特异性
     (0,1,1) > .pixel (0,1,0)，且本文件后加载，必覆盖。
     components.css 的 html.pixel 段用 var(--pixel-ink) 等基础
     令牌做描边/硬影，此处统一改向，整段自动跟随。
     ============================================================ */
  --pixel-ink: #3A332B;
  --pixel-ink-soft: #5C5344;
  --pixel-ink-light: rgba(58,51,43,.12);
  --pixel-ink-dark: #241F19;

  --bg: #1E352E;
  --surface: #F7F1E0;
  --surface-2: #EFE6CE;
  --surface-3: #E6D9BC;
  --surface-4: #DBCCA9;

  --border: #C7B995;
  --border-strong: #3A332B;
  --border-tertiary: #AE9F7C;
  --hairline: #DCD0B2;
  --glass-border: #3A332B;

  --text-primary: #35302A;
  --text-secondary: #5C5344;
  --text-muted: #857A64;
  --text-tertiary: #A2947A;
  /* 关键：base 主题大量用 var(--text) 但从未定义该 token（仅定义了 --text-primary 等）。
     pixel 主题下 var(--text) 非法 → 回退继承 .module-panel 的米色 → 成长/星期五/笔记/知识等
     浅底卡片文字「米色融背景看不见」。此处显式定义为深墨，一次性根治。 */
  --text: #35302A;

  --primary: #5FA75B;
  --primary-hover: #71B96B;
  --primary-press: #48844A;
  --primary-weak: rgba(95,167,91,.16);
  --primary-press-tint: rgba(95,167,91,.22);
  --primary-glow: rgba(95,167,91,.30);
  --primary-glow-strong: rgba(95,167,91,.42);
  --on-primary: #FFFFFF;

  --accent: #5E88AE;
  --accent-hover: #6E99BE;
  --accent-weak: rgba(94,136,174,.16);
  --accent-press: rgba(94,136,174,.22);
  --accent-glow: rgba(94,136,174,.30);
  --accent-strong: #456B8E;
  --accent-ink: #FFFFFF;
  --accent-tint: rgba(94,136,174,.12);

  --success: #48844A;
  --success-weak: rgba(95,167,91,.18);
  --success-press: rgba(72,132,74,.24);
  --warning: #A87B12;
  --warning-weak: rgba(201,147,39,.20);
  --danger: #C24A42;
  --danger-weak: rgba(194,74,66,.16);
  --danger-press: rgba(194,74,66,.22);
  --violet: #7A6FA8;
  --violet-weak: rgba(122,111,168,.16);
  --pink: #C47E8F;
  --pink-weak: rgba(196,126,143,.16);

  --shadow-sm: 2px 2px 0 rgba(30,25,17,.16);
  --shadow-md: 3px 3px 0 rgba(30,25,17,.18);
  --shadow-lg: 4px 4px 0 rgba(30,25,17,.20);
  --shadow-focus: 0 0 0 3px rgba(95,167,91,.40);
  --shadow-lift: 4px 4px 0 rgba(30,25,17,.18);
  --shadow-lift-strong: 6px 6px 0 rgba(30,25,17,.20);
  --elevation-1: 2px 2px 0 rgba(30,25,17,.16);
  --elevation-2: 3px 3px 0 rgba(30,25,17,.18);
  --shadow-inset-highlight: inset 2px 2px 0 rgba(255,252,240,.7), inset -2px -2px 0 rgba(58,51,43,.06);
  --shadow-panel: inset 2px 2px 0 rgba(255,252,240,.7), inset -2px -2px 0 rgba(58,51,43,.06), 3px 3px 0 rgba(30,25,17,.16);

  /* 消灭一切大圆角/胶囊（含 --radius-pill，timer 按钮/搜索框在用） */
  --radius-sm: 0px;
  --radius: 0px;
  --radius-lg: 2px;
  --radius-xl: 4px;
  --radius-2xs: 0px;
  --radius-xs: 0px;
  --radius-pill: 2px;

  --blur: none;
}

/* =====================================================================
   世界画布：深松绿夜空 + 像素星点 + 像素月亮 + 阶梯远山
   ===================================================================== */
html.pixel body {
  background:
    repeating-conic-gradient(rgba(255,255,255,.022) 0% 25%, transparent 0% 50%) 0 0/4px 4px,
    linear-gradient(to bottom, var(--px-world-1) 0%, var(--px-world-2) 46%, var(--px-world-3) 100%);
  background-attachment: fixed;
  background-repeat: no-repeat;
  color: var(--px-ink);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
html.pixel #appShell { position: relative; z-index: 1; }
html.pixel #appShell,
html.pixel .app-content,
html.pixel #moduleContainer,
html.pixel .module-scroll { background: transparent; }
/* 为底部伙伴草地留出站位：仅保留精灵伙伴固定层(96px) + 少量余量，避免主题切换后底部留出过大空隙。
   20261021r：改为「缩短滚动容器」(margin-bottom)——padding 只是给滚动内容末尾留白，
   滚动时内容仍会从浮层底下穿过并被遮挡；margin 才能让视口真正止步于草地之上。 */
html.pixel #moduleContainer { margin-bottom: calc(96px + 16px); padding-bottom: 8px; }
html.pixel #moduleContainer > .module-panel { margin-bottom: 0; }
/* 像素主题：底部被伙伴草地(96px 固定层)占据，Toast 上移到草地之上，避免与精灵重叠 */
html.pixel #toastContainer { bottom: calc(96px + 20px + env(safe-area-inset-bottom)); }
/* 安全网：深底世界上的裸文字用米色，保证可读。
   浅底子面板/卡片由下方覆盖块强制深墨字（防止宝可梦主题「字和背景融为一体看不见」）。
   这里只用 html.pixel .module-panel 的低特异性(0,1,1)，让下方同特异性覆盖块按出现顺序胜出。 */
html.pixel .module-panel { color: #EFE7D2; }
/* 浅底子面板/槽位：强制深墨字（覆盖上方米色安全网）。 *
html.pixel .bz-plan-day, html.pixel .bz-plan-day-today, html.pixel .time-filter-group, html.pixel .plan-day, html.pixel .plan-day-today, html.pixel .plan-task, html.pixel .plan-task-title, html.pixel .plan-empty, html.pixel .bz-empty, html.pixel .bz-plan-empty, html.pixel .daily-section, html.pixel .goal-card, html.pixel .gd-section, html.pixel .se-card, html.pixel .hub-info, html.pixel .hub-source, html.pixel .mem-item, html.pixel .journal-entry, html.pixel .note-card, html.pixel .summary-item, html.pixel .bz-stat, html.pixel .bz-quickadd, html.pixel .bz-quickadd-input, html.pixel .wo-summary, html.pixel .wo-day, html.pixel .wo-day-meta, html.pixel .wo-summary-rate, html.pixel .pw-stat, html.pixel .loading, html.pixel .skeleton 
/* 星期五/AI 模块标题：直接落在透明深色世界上（.module-panel 无背景），用米色才显眼 */
html.pixel .ai-head-title,
html.pixel .ai-head-actions { color: var(--px-cream); }
/* 直接落在深底世界上的空状态用米色（可读）；包在浅底卡片内的继承卡片深墨（见 line 839 的 .empty-state 规则） */
html.pixel .module-panel > .empty-state,
html.pixel #moduleContainer > .empty-state { color: var(--px-cream); }
/* 任务·目标详情落在透明深底世界上（.goal-detail 无背景），标题/分区头用米色才显眼 */
html.pixel .goal-detail .gd-section-head,
html.pixel .goal-detail .gd-title { color: var(--px-cream); }

/* 世界装饰层（仅 pixel 主题注入；位于 UI 之下，不挡交互） */
html.pixel #pixel-world {
  position: fixed; inset: 0; z-index: 0;
  pointer-events: none; overflow: hidden;
}
/* 星点：box-shadow 点阵，集中于上半夜空 */
html.pixel #pixel-world::before {
  content: "";
  position: absolute; top: 0; left: 0;
  width: 3px; height: 3px;
  background: transparent;
  box-shadow:
    6vw 8vh 0 var(--px-star), 14vw 18vh 0 var(--px-star-2), 22vw 6vh 0 var(--px-star),
    30vw 14vh 0 var(--px-star), 38vw 9vh 0 var(--px-star-2), 46vw 20vh 0 var(--px-star),
    54vw 7vh 0 var(--px-star-2), 60vw 16vh 0 var(--px-star), 68vw 11vh 0 var(--px-star),
    76vw 5vh 0 var(--px-star-2), 84vw 14vh 0 var(--px-star), 92vw 9vh 0 var(--px-star),
    10vw 30vh 0 var(--px-star), 26vw 26vh 0 var(--px-star-2), 42vw 30vh 0 var(--px-star),
    58vw 28vh 0 var(--px-star-2), 74vw 26vh 0 var(--px-star), 88vw 24vh 0 var(--px-star-2),
    18vw 38vh 0 var(--px-star-2), 50vw 36vh 0 var(--px-star), 82vw 34vh 0 var(--px-star),
    34vw 42vh 0 var(--px-star), 66vw 40vh 0 var(--px-star-2);
  animation: star-twinkle 5s steps(2) infinite;
}
/* 像素月亮：大切角方块 + 柔光 */
html.pixel #pixel-world::after {
  content: "";
  position: absolute; top: 14%; right: 7%;
  width: 44px; height: 44px;
  background: var(--px-moon);
  clip-path: polygon(
    12px 0, calc(100% - 12px) 0, calc(100% - 12px) 6px, calc(100% - 6px) 6px,
    calc(100% - 6px) 12px, 100% 12px, 100% calc(100% - 12px), calc(100% - 6px) calc(100% - 12px),
    calc(100% - 6px) calc(100% - 6px), calc(100% - 12px) calc(100% - 6px),
    calc(100% - 12px) 100%, 12px 100%, 12px calc(100% - 6px), 6px calc(100% - 6px),
    6px calc(100% - 12px), 0 calc(100% - 12px), 0 12px, 6px 12px, 6px 6px, 12px 6px
  );
  filter: drop-shadow(0 0 14px rgba(245,230,184,.35));
  animation: moon-drift 7s ease-in-out infinite;
}
/* 阶梯远山剪影带 */
html.pixel .pixel-ground {
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 150px;
  background: var(--px-hill);
  clip-path: polygon(
    0 40%, 6% 40%, 6% 31%, 14% 31%, 14% 23%, 24% 23%, 24% 31%,
    33% 31%, 33% 40%, 44% 40%, 44% 31%, 55% 31%, 55% 23%, 66% 23%,
    66% 31%, 76% 31%, 76% 40%, 86% 40%, 86% 31%, 94% 31%, 94% 24%,
    100% 24%, 100% 100%, 0 100%
  );
  opacity: .92;
}
/* 夜景云/树：压暗成剪影，融入夜色 */
html.pixel .pixel-cloud {
  position: absolute; image-rendering: pixelated;
  opacity: .5; filter: brightness(.55) saturate(.5);
  animation: cloud-drift 16s ease-in-out infinite alternate;
}
html.pixel .pixel-tree {
  position: absolute; bottom: 42px; image-rendering: pixelated;
  width: auto; opacity: .8;
  filter: brightness(.42) saturate(.7) drop-shadow(3px 3px 0 rgba(0,0,0,.3));
}

/* =====================================================================
   Pixel Panel · 三级层级
   ---------------------------------------------------------------------
   Primary：切角阶梯 + 3px 墨框 + 大硬投影 + 内高光（主内容/锁屏卡）
   Secondary：方角 2px 墨框 + 硬投影（常规卡片；内含弹窗故不切角）
   Sub：凹陷槽（内阴影，无投影；辅助信息/小格）
   ===================================================================== */

/* ---------- Secondary Panel：常规卡片 ---------- */
html.pixel .card,
html.pixel .glass-card,
html.pixel .brain-card {
  position: relative;
  background: var(--px-cream);
  border: 2px solid var(--px-ink);
  border-radius: 0;
  color: var(--px-ink);
  box-shadow:
    inset 0 2px 0 var(--px-hi),
    inset 0 -2px 0 var(--px-shade),
    var(--px-shadow-card);
  transition: transform .08s var(--ease-out), box-shadow .08s var(--ease-out);
}
html.pixel .card:hover,
html.pixel .glass-card:hover,
html.pixel .brain-card:hover {
  transform: translate(-2px,-2px);
  box-shadow:
    inset 0 2px 0 var(--px-hi),
    inset 0 -2px 0 var(--px-shade),
    6px 6px 0 rgba(24,19,12,.28);
}

/* ---------- Primary Panel：主内容（Timer / 锁屏卡） ---------- */
html.pixel .timer-box,
html.pixel #lockScreen .lock-card {
  background: var(--px-cream);
  border: none;
  border-radius: 0;
  color: var(--px-ink);
  clip-path: var(--px-clip-lg);
  box-shadow:
    inset 0 0 0 3px var(--px-ink),
    inset 0 6px 0 var(--px-hi),
    inset 0 -6px 0 var(--px-shade);
  filter: var(--px-drop-lg);
}
html.pixel .timer-box:hover,
html.pixel #lockScreen .lock-card:hover { transform: none; }
/* 全屏专注时退回纯氛围（视频背景），去掉面板切角/投影/伙伴 */
html.pixel body.timer-fs .timer-box {
  clip-path: none; filter: none; box-shadow: none; border: none;
}

/* ---------- Sub Panel：凹陷槽（辅助小格） ---------- */
html.pixel .bz-plan-day,
html.pixel .time-filter-group {
  background: var(--px-cream-3);
  border: none;
  border-radius: 0;
  box-shadow:
    inset 0 0 0 2px rgba(58,51,43,.35),
    inset 0 3px 0 rgba(58,51,43,.12),
    inset 0 -2px 0 rgba(255,252,240,.45);
}
html.pixel .brain-zone .bz-plan-day { border-left: none; }
html.pixel .brain-zone .bz-plan-day-today,
html.pixel .bz-plan-day-today {
  background: var(--px-green-pale);
  box-shadow:
    inset 0 0 0 2px var(--px-green-dk),
    inset 4px 0 0 var(--px-green),
    inset 0 3px 0 rgba(58,51,43,.10);
}

/* ---------- 模块页头（首页问候带）= Secondary ---------- */
html.pixel .brain-header {
  background: var(--px-cream);
  border: 2px solid var(--px-ink);
  border-radius: 0;
  color: var(--px-ink);
  box-shadow:
    inset 0 2px 0 var(--px-hi),
    inset 0 -2px 0 var(--px-shade),
    var(--px-shadow-card);
  padding: 16px 20px;
}

/* =====================================================================
   标题：现代排版，不贴游戏标签；仅小方点标记（克制的像素细节）
   ===================================================================== */
html.pixel h1, html.pixel h2, html.pixel h3,
html.pixel .card-title,
html.pixel .modal-title,
html.pixel .brain-q-title {
  color: var(--px-ink);
  font-weight: 700;
  letter-spacing: .01em;
  text-shadow: none;
}
html.pixel .card-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font-size: 14px;
}
html.pixel .card-title::before {
  content: "";
  width: 9px; height: 9px; flex: 0 0 auto;
  background: var(--px-green);
  box-shadow: inset -2px -2px 0 rgba(0,0,0,.18);
}
html.pixel .card-title i,
html.pixel .card-title .icon { color: var(--px-green-dk); }
html.pixel .brain-q-title i { color: var(--px-green-dk); }

/* =====================================================================
   Sidebar：米纸导航轨（现代，无游戏菜单标记）
   ===================================================================== */
html.pixel #sidebar {
  background: var(--px-cream);
  border-right: 2px solid var(--px-ink);
  box-shadow: 3px 0 0 rgba(24,19,12,.22);
}
html.pixel .nav-item {
  position: relative;
  margin: 3px 10px;
  padding: 9px 12px 9px 14px;
  border: 2px solid transparent;
  border-radius: 0;
  color: var(--px-ink-soft);
  font-weight: 600;
  transition: background .08s var(--ease-out), color .08s var(--ease-out), border-color .08s var(--ease-out);
}
html.pixel .nav-item:hover {
  background: var(--px-green-pale);
  color: var(--px-ink);
}
html.pixel .nav-item.active {
  background: var(--px-green-pale);
  color: var(--px-ink);
  border-color: var(--px-ink);
  box-shadow: 3px 3px 0 rgba(24,19,12,.22);
}
/* 激活态：左侧绿色阶梯条（像素标记，替代 ▶） */
html.pixel .nav-item.active::before {
  content: "";
  position: absolute; left: -2px; top: 4px; bottom: 4px;
  width: 4px; background: var(--px-green);
  box-shadow: 2px 0 0 var(--px-green-dk);
}
html.pixel .nav-item i {
  width: 22px; margin-right: 8px;
  text-align: center;
  color: var(--px-ink-mute);
  background: none; border: none; box-shadow: none;
}
html.pixel .nav-item:hover i { color: var(--px-ink); }
html.pixel .nav-item.active i { color: var(--px-green-dk); background: none; }

/* =====================================================================
   Header：米纸顶栏
   ===================================================================== */
html.pixel #topHeader,
html.pixel .header {
  background: var(--px-cream);
  border-bottom: 2px solid var(--px-ink);
  box-shadow: 0 3px 0 rgba(24,19,12,.22);
}
html.pixel #topHeader .brand,
html.pixel #pageTitle,
html.pixel .header-title {
  color: var(--px-ink);
  text-shadow: none;
  font-weight: 700;
}
html.pixel #topHeader .btn,
html.pixel #topHeader button {
  background: var(--px-cream);
  border: 2px solid var(--px-ink);
  color: var(--px-ink);
  border-radius: 0;
}

/* =====================================================================
   按钮：Pixel Button（切角 + 墨框 + 硬投影 + 按压塌陷）
   ===================================================================== */
html.pixel .btn {
  position: relative;
  border: none;
  border-radius: 0;
  background: var(--px-cream);
  color: var(--px-ink);
  font-weight: 700;
  clip-path: var(--px-clip-sm);
  box-shadow:
    inset 0 0 0 2px var(--px-ink),
    inset 0 -3px 0 rgba(58,51,43,.10);
  filter: var(--px-drop-sm);
  padding: 8px 16px;
  transition: transform .06s var(--ease-out), filter .06s var(--ease-out), background .06s var(--ease-out);
}
html.pixel .btn:hover {
  transform: translate(-1px,-1px);
  filter: drop-shadow(3px 3px 0 rgba(24,19,12,.25));
  background: #FFFCF0;
}
html.pixel .btn:active {
  transform: translate(2px,2px);
  filter: none;
  box-shadow:
    inset 0 0 0 2px var(--px-ink),
    inset 0 3px 0 rgba(58,51,43,.14);
}
/* 主操作：自然绿 */
html.pixel .btn-primary {
  background: var(--px-green);
  color: #fff;
  padding-left: 16px;
  box-shadow:
    inset 0 0 0 2px var(--px-ink),
    inset 0 2px 0 rgba(255,255,255,.25),
    inset 0 -3px 0 rgba(0,0,0,.18);
}
html.pixel .btn-primary:hover { background: var(--px-green-lt); }
html.pixel .btn-primary:active { background: var(--px-green-dk); }
/* 次操作：米纸描边 */
html.pixel .btn-secondary {
  background: var(--px-cream);
  color: var(--px-ink);
  padding-left: 16px;
}
html.pixel .btn-secondary:hover { background: #FFFCF0; }
html.pixel .btn-danger {
  background: var(--px-red);
  color: #fff;
  box-shadow:
    inset 0 0 0 2px var(--px-ink),
    inset 0 2px 0 rgba(255,255,255,.22),
    inset 0 -3px 0 rgba(0,0,0,.18);
}
html.pixel .btn-danger:hover { background: #D35F56; }

/* =====================================================================
   表单控件：凹陷输入井
   ===================================================================== */
html.pixel .form-input,
html.pixel .form-select,
html.pixel .form-textarea {
  border: none;
  border-radius: 0;
  background: var(--px-cream);
  clip-path: var(--px-clip-sm);
  box-shadow:
    inset 0 0 0 2px var(--px-ink),
    inset 0 3px 0 rgba(58,51,43,.10);
  color: var(--px-ink);
  font-weight: 500;
}
html.pixel .form-input:focus,
html.pixel .form-select:focus,
html.pixel .form-textarea:focus {
  background: #FFFCF0;
  box-shadow:
    inset 0 0 0 2px var(--px-green-dk),
    inset 0 3px 0 rgba(58,51,43,.08);
}
/* 内联胶囊残留（timer 插件内联 border-radius 的容器） */
html.pixel .time-filter-group,
html.pixel .timer-note-input,
html.pixel #timerSearch { border-radius: 0 !important; }

/* =====================================================================
   标签 / 徽章：切角小片
   ===================================================================== */
html.pixel .tag-chip,
html.pixel .journal-tag,
html.pixel .pwd-cat-chip,
html.pixel .filter-chip,
html.pixel .badge,
html.pixel .chip {
  border: none;
  border-radius: 0;
  background: var(--px-cream-2);
  color: var(--px-ink);
  clip-path: var(--px-clip-sm);
  box-shadow: inset 0 0 0 2px var(--px-ink);
  font-weight: 600;
  text-shadow: none;
}
html.pixel .filter-chip.active,
html.pixel .tag-chip.active,
html.pixel .badge-primary {
  background: var(--px-green);
  color: #fff;
}

/* =====================================================================
   进度条：像素分段槽（中性绿；exp 变体用少量蓝）
   ===================================================================== */
html.pixel .bw-progress,
html.pixel .progress,
html.pixel .exp-bar {
  height: 16px;
  border: none;
  border-radius: 0;
  background: var(--px-cream-3);
  clip-path: var(--px-clip-sm);
  box-shadow:
    inset 0 0 0 2px var(--px-ink),
    inset 0 3px 0 rgba(58,51,43,.14);
  overflow: hidden;
  position: relative;
}
html.pixel .bw-progress-bar,
html.pixel .progress-bar {
  height: 100%;
  background: repeating-linear-gradient(90deg, var(--px-green) 0 7px, var(--px-green-lt) 7px 14px);
  box-shadow: inset 0 -3px 0 var(--px-green-dk);
  transition: width .35s steps(8,end);
}
html.pixel .bw-progress::after,
html.pixel .progress::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(90deg, transparent 0 13px, rgba(58,51,43,.20) 13px 14px);
}
html.pixel .exp-bar,
html.pixel .exp-bar .bw-progress-bar,
html.pixel .exp-bar .progress-bar {
  height: 10px;
}
html.pixel .exp-bar .bw-progress-bar,
html.pixel .exp-bar .progress-bar {
  background: repeating-linear-gradient(90deg, var(--px-blue) 0 7px, #7BA1C2 7px 14px);
  box-shadow: inset 0 -3px 0 var(--px-blue);
}

/* =====================================================================
   勾选框：方形像素格（任务 / 习惯 / 首页）
   ===================================================================== */
html.pixel .task-check {
  width: 22px; height: 22px;
  border: none; border-radius: 0;
  background: var(--px-cream);
  clip-path: var(--px-clip-sm);
  box-shadow: inset 0 0 0 2px var(--px-ink);
  filter: var(--px-drop-sm);
  transition: background .08s var(--ease-out);
  position: relative;
}
html.pixel .task-check:checked,
html.pixel .task-check[checked] {
  background: var(--px-green);
  box-shadow: inset 0 0 0 2px var(--px-ink), inset 0 2px 0 rgba(255,255,255,.25);
}
html.pixel .task-check:checked::after,
html.pixel .task-check[checked]::after {
  content: "✓"; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 900; font-size: 14px;
}
/* 首页勾选：方形小格 */
html.pixel .bz-check {
  border-radius: 0;
  border-color: var(--px-ink);
  color: var(--px-ink);
}
html.pixel .bz-check.on { color: #fff; }
/* 失败态：像素红格 */
html.pixel .task-item-failed .task-check { background: var(--danger); box-shadow: inset 0 0 0 2px var(--px-ink), inset 0 2px 0 rgba(255,255,255,.25); }
html.pixel .plan-task.failed .plan-check { background: var(--danger); border-color: var(--danger); color: #fff; }
html.pixel .bz-check.failed { background: var(--danger); border-color: var(--danger); color: #fff; }
html.pixel .bz-row:last-child { border-bottom: none; }

/* =====================================================================
   弹窗：Primary 级切角面板（现代对话框，非游戏窗口）
   ===================================================================== */
html.pixel .modal {
  border: none;
  border-radius: 0;
  background: var(--px-cream);
  color: var(--px-ink);
  clip-path: var(--px-clip-lg);
  box-shadow:
    inset 0 0 0 3px var(--px-ink),
    inset 0 6px 0 var(--px-hi),
    inset 0 -6px 0 var(--px-shade);
  filter: var(--px-drop-lg);
}
html.pixel .modal-header {
  background: var(--px-cream-2);
  border-bottom: 2px solid var(--px-ink);
  padding: 12px 16px;
}
html.pixel .modal-title { color: var(--px-ink); }
html.pixel .modal-close {
  background: var(--px-cream);
  border: none;
  color: var(--px-ink);
  clip-path: var(--px-clip-sm);
  box-shadow: inset 0 0 0 2px var(--px-ink);
  filter: var(--px-drop-sm);
  border-radius: 0;
}
html.pixel .modal-close:hover { background: var(--px-red); color: #fff; }
html.pixel .modal-footer {
  border-top: 2px solid var(--px-ink);
  background: var(--px-cream-2);
  color: var(--px-ink);
}

/* =====================================================================
   Toast：事件提示小片
   ===================================================================== */
html.pixel .toast {
  border: none;
  border-radius: 0;
  background: var(--px-cream);
  clip-path: var(--px-clip-sm);
  box-shadow: inset 0 0 0 2px var(--px-ink);
  filter: var(--px-drop-md);
  font-weight: 600;
  color: var(--px-ink);
}
html.pixel .toast.success {
  background: var(--px-green-pale);
  box-shadow: inset 0 0 0 2px var(--px-green-dk), inset 4px 0 0 var(--px-green);
  color: var(--px-green-dk);
}
html.pixel .toast.error {
  background: var(--px-red-pale);
  box-shadow: inset 0 0 0 2px var(--px-red), inset 4px 0 0 var(--px-red);
  color: var(--px-red);
}

/* =====================================================================
   锁屏：像素世界登场（星点 + 月亮 + Primary 卡）
   ===================================================================== */
html.pixel #lockScreen {
  background:
    repeating-conic-gradient(rgba(255,255,255,.022) 0% 25%, transparent 0% 50%) 0 0/4px 4px,
    linear-gradient(to bottom, var(--px-world-1) 0%, var(--px-world-2) 46%, var(--px-world-3) 100%);
  background-attachment: fixed;
  background-repeat: no-repeat;
}
html.pixel #lockScreen::before {
  content: "";
  position: absolute; top: 0; left: 0;
  width: 3px; height: 3px;
  background: transparent;
  box-shadow:
    6vw 8vh 0 var(--px-star), 14vw 18vh 0 var(--px-star-2), 22vw 6vh 0 var(--px-star),
    30vw 14vh 0 var(--px-star), 38vw 9vh 0 var(--px-star-2), 46vw 20vh 0 var(--px-star),
    54vw 7vh 0 var(--px-star-2), 60vw 16vh 0 var(--px-star), 68vw 11vh 0 var(--px-star),
    76vw 5vh 0 var(--px-star-2), 84vw 14vh 0 var(--px-star), 92vw 9vh 0 var(--px-star),
    10vw 30vh 0 var(--px-star), 26vw 26vh 0 var(--px-star-2), 42vw 30vh 0 var(--px-star),
    58vw 28vh 0 var(--px-star-2), 74vw 26vh 0 var(--px-star), 88vw 24vh 0 var(--px-star-2),
    18vw 60vh 0 var(--px-star-2), 50vw 66vh 0 var(--px-star), 82vw 58vh 0 var(--px-star),
    34vw 72vh 0 var(--px-star), 66vw 70vh 0 var(--px-star-2);
  animation: star-twinkle 5s steps(2) infinite;
  pointer-events: none;
}
html.pixel #lockScreen::after {
  content: "";
  position: absolute; top: 7%; right: 9%;
  width: 52px; height: 52px;
  background: var(--px-moon);
  clip-path: polygon(
    14px 0, calc(100% - 14px) 0, calc(100% - 14px) 7px, calc(100% - 7px) 7px,
    calc(100% - 7px) 14px, 100% 14px, 100% calc(100% - 14px), calc(100% - 7px) calc(100% - 14px),
    calc(100% - 7px) calc(100% - 7px), calc(100% - 14px) calc(100% - 7px),
    calc(100% - 14px) 100%, 14px 100%, 14px calc(100% - 7px), 7px calc(100% - 7px),
    7px calc(100% - 14px), 0 calc(100% - 14px), 0 14px, 7px 14px, 7px 7px, 14px 7px
  );
  filter: drop-shadow(0 0 16px rgba(245,230,184,.4));
  animation: moon-drift 7s ease-in-out infinite;
  pointer-events: none;
}
html.pixel #lockScreen .lock-card { border: none; }

/* =====================================================================
   空状态：伙伴陪伴（Pikachu）
   ===================================================================== *
html.pixel .mem-empty, html.pixel .rel-empty, html.pixel .brain-theme-empty, html.pixel .empty-state 
html.pixel .mem-empty::before, html.pixel .rel-empty::before, html.pixel .brain-theme-empty::before, html.pixel .empty-state::before 
/* 20260823q：删除「待排期」空状态里的像素小宠物（皮卡丘），配合待排期整体缩小 */
html.pixel #planBacklogEmpty::before { content:none; display:none; margin:0; }

/* =====================================================================
   宝可梦伙伴：底部夜景草地（Pixel Companion，无 HUD）
   ===================================================================== */
html.pixel #pixel-party {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 120;
  height: 96px;
  pointer-events: none;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
html.pixel .pixel-party-ground {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 40px;
  background: var(--px-grass);
  border-top: 3px solid var(--px-grass-edge);
}
html.pixel .pixel-party-ground::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: -14px; height: 16px;
  background: url('/assets/pixel-pets/grass.svg') repeat-x left bottom;
  image-rendering: pixelated;
  filter: brightness(.55);
}
html.pixel .pixel-party-row {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 4px;
  max-width: 100%;
  /* 关键：绝不可 overflow:hidden —— 否则精灵 bob 上弹 -5px 会被裁掉顶部，显示不全。
     装饰层 pointer-events:none 无法手动横向滚动，故不启用 overflow-x:auto。 */
  overflow: visible;
  padding: 0 12px 8px;
}
html.pixel .pixel-pet {
  flex: 0 0 auto;
  height: 72px;
  image-rendering: auto;
  filter: drop-shadow(2px 2px 0 rgba(0,0,0,.35));
  animation: pet-bob 2.6s steps(2) infinite;
}
html.pixel .pixel-pet img {
  width: auto; height: 100%;
  object-fit: contain;
  pointer-events: none;
}
/* 状态表情叠层(.pixel-party-emote)已按用户要求彻底移除（zzz/fx-* 呼噜白线会挡住中间精灵）。
   相关 JS 注入一并删除。 */

/* =====================================================================
   计时器 / 统计数字：VT323 像素数字（仅数字用像素字体）
   ===================================================================== */
html.pixel .timer-digit,
html.pixel .timer-display,
html.pixel .pomodoro-time,
html.pixel .stat-value,
html.pixel .count-value {
  font-family: var(--font-pixel-latin);
  font-weight: 700;
  color: var(--px-green-dk);
  text-shadow: 3px 3px 0 rgba(58,51,43,.15);
  line-height: 1;
}
html.pixel .timer-digit {
  font-size: clamp(3.2rem, 26cqi, 9rem);
  letter-spacing: .02em;
}

/* =====================================================================
   滚动条：像素轨
   ===================================================================== */
html.pixel ::-webkit-scrollbar { width: 12px; height: 12px; }
html.pixel ::-webkit-scrollbar-track { background: var(--px-cream-3); border-left: 1px solid rgba(58,51,43,.35); }
html.pixel ::-webkit-scrollbar-thumb {
  background: var(--px-green);
  border: 2px solid var(--px-ink);
  border-radius: 0;
}
html.pixel ::-webkit-scrollbar-thumb:hover { background: var(--px-green-dk); }

/* =====================================================================
   设置面板
   ===================================================================== */
html.pixel #settingsModal .form-group {
  border-bottom: 1px dashed var(--hairline);
  padding-bottom: 12px; margin-bottom: 12px;
}
html.pixel #settingsModal .form-group:last-child { border-bottom: none; }

/* =====================================================================
   下拉菜单 / 弹出菜单：切角米纸（无 ▶ 游戏标记）
   ===================================================================== */
html.pixel .dropdown-menu,
html.pixel .menu-pop,
html.pixel .pop-menu {
  background: var(--px-cream);
  border: none;
  border-radius: 0;
  clip-path: var(--px-clip-sm);
  box-shadow: inset 0 0 0 2px var(--px-ink);
  filter: var(--px-drop-md);
  padding: 4px;
}
html.pixel .dropdown-item,
html.pixel .menu-item,
html.pixel .pop-item {
  display: block;
  position: relative;
  padding: 8px 12px;
  color: var(--px-ink);
  font-weight: 600;
  border: none;
  border-radius: 0;
  transition: background .06s var(--ease-out);
}

/* 顶栏书签（20260825h 新增）：像素化——直角、切角胶囊、字母块直角（20260825i） */
html.pixel .bm-top,
html.pixel .bm-top-hint { border-radius: 0; }
html.pixel .bm-top-folder { background: var(--surface-2); border-color: var(--border); }
html.pixel .bm-top-folder:hover { background: var(--surface-3); }
html.pixel .bm-fav-ico .bm-fav-ch { border-radius: 0; }
html.pixel .bm-fav-ico img { border-radius: 0; background: #fff; }
html.pixel .bm-more { border-radius: 0; }
/* 关键修复（20260825j）：像素主题 .menu-item 被覆盖为 display:block，
   会破坏书签菜单项的 flex 布局（favicon 的 width 在 inline 下失效），
   导致图标与文字重叠。此处仅对书签文件夹菜单恢复 flex，不影响其他像素菜单。 */
html.pixel #topBmMenu .menu-item { display: flex; align-items: center; gap: 8px; }
/* 顶栏书签入口 + 弹出面板（20260826a） */
html.pixel .bm-entry { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-cream); color: var(--px-ink); }
html.pixel .bm-entry:hover { background: var(--px-green-pale); color: var(--px-ink); border-color: var(--px-ink); }
html.pixel .bm-entry i { color: var(--px-ink); }
html.pixel #bmPopover .menu-item,
html.pixel #bmPopover .bm-pop-row { display: flex; align-items: center; gap: 8px; }
html.pixel .bm-pop-head { border-bottom: 2px solid var(--px-ink); color: var(--px-ink); }
html.pixel .bm-pop-head i { color: var(--px-ink); }
html.pixel .bm-pop-group-name { color: var(--px-ink); border-radius:0; }
html.pixel .bm-pop-group-name:hover { background: var(--px-green-pale); }
html.pixel .bm-pop-caret { color: var(--px-ink); }
html.pixel .bm-pop-count { background: var(--px-cream); border: 1px solid var(--px-ink); color: var(--px-ink); }
html.pixel .bm-pop-sep { background: var(--px-ink); }
html.pixel .bm-pop-add,
html.pixel .bm-pop-import { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-cream); color: var(--px-ink); }
html.pixel .bm-pop-add:hover,
html.pixel .bm-pop-import:hover { background: var(--px-green-pale); color: var(--px-ink); }
html.pixel .dropdown-item:hover,
html.pixel .menu-item:hover,
html.pixel .pop-item:hover {
  background: var(--px-green-pale);
}
html.pixel .dropdown-item.active,
html.pixel .menu-item.active {
  background: var(--px-green-pale);
  color: var(--px-ink);
  box-shadow: inset 3px 0 0 var(--px-green);
}
html.pixel .dropdown-divider { height: 1px; background: var(--hairline); margin: 4px 2px; }

/* =====================================================================
   工具提示：反色墨块
   ===================================================================== */
html.pixel .tooltip,
html.pixel [data-tooltip]::after {
  background: var(--px-ink);
  border: none;
  border-radius: 0;
  color: var(--px-cream);
  clip-path: var(--px-clip-sm);
  box-shadow: none;
  filter: var(--px-drop-sm);
  font-weight: 600;
  font-size: 11px;
}

/* =====================================================================
   加载 / 骨架
   ===================================================================== */
html.pixel .loading,
html.pixel .spinner,
html.pixel .skeleton {
  border: none;
  border-radius: 0;
  background: var(--px-cream-2);
  clip-path: var(--px-clip-sm);
  box-shadow: inset 0 0 0 2px rgba(58,51,43,.35);
}
html.pixel .spinner {
  border: 3px solid rgba(58,51,43,.25);
  border-top-color: var(--px-green);
  image-rendering: pixelated;
}
html.pixel .skeleton {
  background: repeating-linear-gradient(90deg, var(--px-cream-2) 0 8px, var(--px-cream-3) 8px 16px);
}

/* =====================================================================
   移动端适配
   ===================================================================== */
@media (max-width: 767px) {
  html.pixel #pixel-party { height: 72px; }
  html.pixel .pixel-party-ground { height: 30px; }
  html.pixel .pixel-party-ground::before { top: -10px; height: 12px; }
  html.pixel .pixel-pet { height: 50px; }
  html.pixel .pixel-party-emote { bottom: 50px; width: 24px; height: 24px; }
  html.pixel .pixel-tree { bottom: 32px; }
  html.pixel #moduleContainer { padding-bottom: calc(96px + 14px); }
  html.pixel .timer-digit { font-size: 3rem; }
  html.pixel #pixel-world::after { width: 32px; height: 32px; }
}

/* =====================================================================
   减少动画
   ===================================================================== */
@media (prefers-reduced-motion: reduce) {
  html.pixel .pixel-pet,
  html.pixel .pixel-cloud,
  html.pixel #pixel-world::before,
  html.pixel #pixel-world::after,
  html.pixel #lockScreen::before,
  html.pixel #lockScreen::after,
  html.pixel .mem-empty::before,
  html.pixel .empty-state::before { animation: none !important; }
}

/* =====================================================================
   中和 components.css 的 html.pixel 残留（同特异性、本文件后加载生效）
   ===================================================================== */
/* 1. 删掉右下角「原创紫兽」body::after —— 伙伴只用真实宝可梦精灵 */
html.pixel body::after { content: none; display: none; }
/* 2. 标题回归现代字体（清掉 Zpix 像素字体残留，遵守「像素字体仅数字/小标签」） */
html.pixel h1, html.pixel h2, html.pixel h3,
html.pixel .modal-title, html.pixel .card-title,
html.pixel .pwd-site, html.pixel .pwd-site-title {
  font-family: var(--font-sans);
}
/* 3. 幽灵按钮保持幽灵（不被 Pixel Button 框架吞掉） */
html.pixel .btn-ghost { background: transparent; box-shadow: none; filter: none; clip-path: none; }
html.pixel .btn-ghost:hover { background: var(--px-cream-2); transform: none; }
/* 5. Timer 按钮不带 .btn 类，单独并入 Pixel Button 语言；主操作用自然绿 */
html.pixel .timer-btn {
  border: none;
  border-radius: 0;
  clip-path: var(--px-clip-sm);
  box-shadow:
    inset 0 0 0 2px var(--px-ink),
    inset 0 -3px 0 rgba(58,51,43,.10);
  filter: var(--px-drop-sm);
  font-weight: 700;
  transition: transform .06s var(--ease-out), filter .06s var(--ease-out), background .06s var(--ease-out);
}
html.pixel .timer-btn:hover { transform: translate(-1px,-1px); filter: drop-shadow(3px 3px 0 rgba(24,19,12,.25)); }
html.pixel .timer-btn:active { transform: translate(2px,2px); filter: none; }
/* 6. 首页 AI 快捷入口：像素小按钮 */
html.pixel .brain-ai-btn {
  border: none;
  background: var(--px-cream);
  color: var(--px-ink);
  clip-path: var(--px-clip-sm);
  box-shadow: inset 0 0 0 2px var(--px-ink);
  filter: var(--px-drop-sm);
}
html.pixel .brain-ai-btn:hover {
  background: var(--px-green-pale);
  transform: translate(-1px,-1px);
  filter: drop-shadow(3px 3px 0 rgba(24,19,12,.25));
}
html.pixel .brain-ai-btn i { color: var(--px-green-dk); }
/* 7. 键盘焦点可见性：clip-path 会裁掉 box-shadow 焦环，改用 outline */
html.pixel .btn:focus-visible,
html.pixel .timer-btn:focus-visible,
html.pixel .nav-item:focus-visible,
html.pixel .form-input:focus-visible,
html.pixel .form-select:focus-visible,
html.pixel .form-textarea:focus-visible,
html.pixel .filter-chip:focus-visible,
html.pixel .task-check:focus-visible,
html.pixel .bz-check:focus-visible,
html.pixel .habit-day:focus-visible {
  outline: 2px solid var(--px-green-dk);
  outline-offset: 1px;
}

/* ===== 打卡模块 V2（hb2-*）像素主题适配（20261020）===== */
html.pixel .hb2-tabs { gap: 8px; }
html.pixel .hb2-tab { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-cream-2); color: var(--px-ink); box-shadow: 2px 2px 0 rgba(24,19,12,.18); font-family: var(--font-pixel, inherit); }
html.pixel .hb2-tab.on { background: var(--px-green); color: #fff; }
html.pixel .hb2-card { border-radius: 0; }
html.pixel .hb2-icon { border-radius: 0; clip-path: var(--px-clip-sm); box-shadow: inset 0 0 0 2px var(--px-ink); }
html.pixel .hb2-pill { border-radius: 0; border: 1px solid var(--px-ink); background: var(--px-cream); color: var(--px-ink); }
html.pixel .hb2-pill--focus.done { background: var(--px-green); color: #fff; }
html.pixel .hb2-check { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-cream); color: var(--px-ink); box-shadow: 2px 2px 0 rgba(24,19,12,.18); }
html.pixel .hb2-check.on { background: var(--px-green); color: #fff; box-shadow: inset 0 0 0 2px var(--px-ink); }
html.pixel .hb2-stepper { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-cream); }
html.pixel .hb2-step { border-radius: 0; color: var(--px-ink); }
html.pixel .hb2-step:hover { background: var(--px-cream-2); }
html.pixel .hb2-val { color: var(--px-ink); }
html.pixel .hb2-hm, html.pixel .hb2-dhm { border-radius: 0; }
html.pixel .hb2-dhm.on { box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); }
html.pixel .hb2-sec { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-cream-2); }
html.pixel .hb2-chip { border-radius: 0; border: 2px solid var(--px-ink); }
html.pixel .hb2-chip.on { background: var(--px-green); color: #fff; }
html.pixel .hb2-wd { border-radius: 0; border: 2px solid var(--px-ink); }
html.pixel .hb2-wd.on { background: var(--px-green); color: #fff; }
html.pixel .hb2-switch span { border-radius: 0; border: 2px solid var(--px-ink); }
html.pixel .hb2-switch span::after { border-radius: 0; }
html.pixel .hb2-icon-trigger { border-radius: 0; border: 2px solid var(--px-ink); }
html.pixel .hb2-color.on { border-color: var(--px-ink); }
html.pixel .hb2-log-row { border-bottom: 1px dashed var(--hairline); }
html.pixel .hb2-table th, html.pixel .hb2-table td { border: 1px solid var(--px-ink); }

/* ===== 打卡模块 V2.1 新布局 · 像素主题（20261020b）===== */
html.pixel .hk-hero { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-cream-2); box-shadow: 4px 4px 0 rgba(24,19,12,.18); }
html.pixel .hk-hero-date { font-family: var(--font-pixel, inherit); color: var(--px-ink); }
html.pixel .hk-chip { border-radius: 0; border: 1px solid var(--px-ink); background: var(--px-cream); color: var(--px-ink); }
html.pixel .hk-seg { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-cream-2); }
html.pixel .hk-seg-btn { border-radius: 0; color: var(--px-ink); }
html.pixel .hk-seg-btn.on { background: var(--px-green); color: #fff; }
html.pixel .hk-seg-add { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-green); }
html.pixel .hk-row { border-radius: 0; border: none; background: var(--px-cream-2); box-shadow: inset 0 0 0 2px rgba(58,51,43,.35); }
html.pixel .hk-row:hover { box-shadow: inset 0 0 0 2px var(--px-ink), 3px 3px 0 rgba(24,19,12,.22); }
html.pixel .hk-tile { border-radius: 0; clip-path: var(--px-clip-sm); box-shadow: inset 0 0 0 2px var(--px-ink); }
html.pixel .hk-tile--sm, html.pixel .hk-tile--lg { border-radius: 0; }
html.pixel .hk-more-btn { border-radius: 0; border: 2px solid var(--px-ink); }
html.pixel .hk-banner { border-radius: 0; border: 2px solid var(--danger); }
html.pixel .hk-stat { border-radius: 0; border: 2px solid var(--px-ink); background: var(--px-cream); }
html.pixel .hk-panel, html.pixel .hk-detail-hero { border-radius: 0; }
html.pixel .hk-ring-num { color: var(--px-ink); font-family: var(--font-pixel, inherit); }

/* ===== css/responsive.css ===== */
/* =====================================================================
   Flow OS · Responsive（适配各端 · Apple 触控规范）
   ===================================================================== */
@media (max-width: 768px) {
  :root { --sidebar-w: 0px; }

  #sidebar {
    position:absolute; left:0; top:0; bottom:0; transform:translateX(-100%);
    width:268px; padding-top:env(safe-area-inset-top); padding-bottom:env(safe-area-inset-bottom);
    box-shadow: var(--shadow-lg);
  }
  #sidebar.open { transform:translateX(0); }

  #topBar { padding:env(safe-area-inset-top) 14px 0; height:calc(52px + env(safe-area-inset-top)); }
  #menuToggle { display:inline-flex !important; }
  /* 顶栏搜索按钮窄屏只留图标（20261013b） */
  .top-search-label { display:none; }
  #globalSearchBtn { min-width:32px; min-height:32px; padding:4px 9px; }

  #moduleContainer { padding:14px; padding-bottom:calc(14px + env(safe-area-inset-bottom)); }
  .lock-card { padding:36px 24px 28px; }

  .modal {
    padding:12px; border-radius:var(--radius-xl);
    padding-top:calc(12px + env(safe-area-inset-top));
    padding-bottom:calc(12px + env(safe-area-inset-bottom));
    max-height:calc(90dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    max-width:94vw !important;
  }
  .modal-header { margin-bottom:8px; }
  .modal-footer { margin-top:10px; padding-top:10px; }
  .modal .form-input, .modal .form-select, .modal .form-textarea { padding:9px 12px; font-size:.9rem; }
  .modal .btn { padding:8px 14px; }
  .modal-overlay { padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }

  /* 首页两块：窄屏单列堆叠 */
  .brain-grid { grid-template-columns:1fr; }
  .brain-grid > .brain-card { padding:14px; }
  .brain-grid > .brain-card { height:auto; } /* 单列无对齐需求，恢复内容自然高度（20260825d） */

  /* 首页：AI 快捷入口 + 天气卡片在窄屏适配 */
  .brain-header { align-items:flex-start; }
  .brain-ai-btn { margin-top:4px; padding:9px 14px; font-size:var(--fs-1); }
  .brain-weather-icon { font-size:2.2rem; }
  .brain-weather-temp { font-size:1.7rem; }

  /* 列表行内操作：放大点按区（≥38px，兼顾触控与紧凑） */
  .daily-act, .inbox-act, .plan-act, .journal-del, .daily-del, .tm-del-btn,
  .menu-pop .menu-item,
  .task-check, .task-status, .habit-day, .pwd-item .btn-sm,
  .inbox-conv, .journal-star, .bz-edit {
    min-width:38px; min-height:38px; display:inline-flex; align-items:center; justify-content:center;
  }
  /* 勾选圈居中勾选标记 */
  .task-item-done .task-check::after { left:6px; top:1px; width:5px; height:10px; border-width:0 2px 2px 0; }

  /* 通用：放大点按目标 / 防横向溢出 */
  .nav-item { padding:13px 14px; }
  .glass-card { padding:14px; }
  .form-row { grid-template-columns:1fr; }
  .timer-top-grid, .timer-bottom-grid { grid-template-columns:1fr; }
  .time-filter-group { flex-wrap:wrap; }
  .filter-chip { padding:5px 12px; font-size:.78rem; }

  /* 输入框：移动端放大、可纵向拉长、恢复全宽（覆盖桌面 600px 限宽） */
  .form-input { min-height:46px; font-size:1rem; }
  textarea.form-input { min-height:96px; resize:none; overflow:hidden; line-height:1.55; }
  .journal-compose .form-input, .journal-title-input, .journal-content,
  .inbox-capture .inbox-quick, .inbox-capture .inbox-tags,
  .daily-topgoal-input .form-input, .daily-task-input .form-input, .daily-search input,
  .task-top-row .form-input, .task-top-chips .task-search,
  .form-row .form-input, .form-row .form-select,
  .bz-quickadd-input { max-width:100%; }

  /* 快速捕捉：输入 + 操作按钮保持单行紧凑排列 */
  .bz-quickadd, .daily-topgoal-input, .task-top-row { flex-direction:row; align-items:center; }
  .bz-quickadd .btn-sm, .daily-topgoal-input .btn-sm, .task-top-row .btn-sm { width:auto; flex:0 0 auto; min-width:38px; min-height:38px; }

  /* 计划区块标题换行不挤压（.section-head 自带 wrap+gap，此处仅保底） */
  .section-head .btn-sm { flex:0 0 auto; }

  .daily-task-input { flex-wrap:wrap; }
  .daily-task-input .form-input { flex:1; min-width:160px; }
  .daily-task-input .form-select { flex:0 0 auto; min-width:72px; }
  .daily-task-input .btn-sm { flex:0 0 auto; min-width:38px; min-height:38px; }

  .daily-header-right { width:100%; justify-content:flex-start; gap:14px; margin-top:4px; }

  /* 日历：移动端右侧面板堆叠占满宽度，且网格不溢出视口 */
  #mod-calendar > div { flex-direction:column; }
  #mod-calendar > div > div { width:100% !important; min-width:0 !important; }
  #mod-calendar .glass-card { padding:14px !important; }
  .fc-cell { min-height:60px; }
  .fc-event-dot { max-width:100%; }
  /* 工具条在窄屏换行，避免按钮挤压 */
  #mod-calendar .glass-card > div[style*="display:flex"] { flex-wrap:wrap; }

  /* 计时器 */
  #timerRecordsScroll { max-height:300px; }
  #timerRecordsScroll table { min-width:360px; }
  .timer-digit { font-size:3rem; }
  /* 记录区头部：窄屏下「手动添加」按钮收起文字、只留 + 图标，避免与筛选组挤压 */
  #timerAddManualBtn .timer-add-label { display:none; }
  #timerAddManualBtn { padding:4px 8px; }

  /* 密码：移动端可滚动到底部（含安全区）；字段紧凑纵排、整行铺满、按钮不独占空行 */
  .pwd-item { flex-direction:column; align-items:stretch; gap:8px; }
  .pwd-meta { min-width:0 !important; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
  .pwd-field { width:100%; flex:0 1 auto; gap:8px; }
  .pwd-field .pwd-value { flex:1; min-width:0; }
  .pwd-field .btn-sm { flex:0 0 auto; }
  .pwd-item > div:last-child { width:100%; justify-content:flex-end; }
  .pwd-item > div:last-child .btn-sm { flex:0 0 auto !important; width:auto !important; min-width:40px !important; min-height:36px !important; max-width:none !important; padding:4px 11px !important; font-size:.82rem !important; }

  /* 侧边栏折叠按钮在移动端隐藏（用抽屉交互） */
  .sidebar-collapse-btn { display:none !important; }
}

@media (max-width: 480px) {
  .timer-digit { font-size:2.5rem; }
  .fc-cell { min-height:48px; }
  .habit-day { font-size:.65rem; }
  .habit-card { padding:12px 10px 10px; border-radius:var(--radius); margin-bottom:8px; }
  .habit-stat-card { padding:8px 2px; }
  .habit-stat-card .stat-value { font-size:.95rem; }
  .habit-stat-card .stat-label { font-size:.55rem; }
  .lock-title { font-size:1.3rem; }
  .brain-draw { display:none; }
  .lock-icon-wrap { width:60px; height:60px; }
  #globalSyncStatus { font-size:.66rem; padding:3px 7px; }
  .glass-card { padding:12px; border-radius:var(--radius); }
  #moduleContainer { padding:10px 10px calc(10px + env(safe-area-inset-bottom)); }
  .modal { max-width:95vw !important; }
  .form-input { font-size:.88rem; }
  .btn { font-size:.82rem; padding:8px 14px; min-height:38px; }
  .btn-sm { font-size:.74rem; }
}

/* ===== 顶栏移动端：保持「菜单+标题 / 搜索 / 日期」结构不变，仅等比缩小，防止搜索框被挤成圆形 ===== */
@media (max-width: 768px) {
  #topBar { gap:8px; }
  #topBar > div:first-child { gap:8px; min-width:0; }
  #pageTitle { font-size:.92rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }

  /* 顶栏书签（移动端）：加大点按区，保证触摸可点/可横滑（20260825i） */
  #topBmBar { margin-left:0; min-height:40px; }
  #topBmBar .bm-top { padding:9px 11px; font-size:.85rem; }
  #topBmBar .bm-top-label { max-width:88px; }
  #topBmBar .bm-top-hint { padding:9px 11px; font-size:.85rem; }

  /* 计划看板：心情/精力表情始终单行，被挤时横向滚动而非换行成两排 */
  .daily-mood-pick { flex-wrap:nowrap; overflow-x:auto; padding-bottom:2px; -webkit-overflow-scrolling:touch; }
  .daily-mood-btn { width:32px; height:32px; font-size:1.05rem; }
  .daily-energy-inline { flex-wrap:nowrap; }

  /* 列表行操作按钮：移动端缩小，避免遮住任务名称 */
  .daily-item { gap:8px; padding:8px 10px; }
  .daily-act, .plan-act, .daily-del, .journal-del, .tm-del-btn { min-width:38px; min-height:38px; font-size:.78rem; padding:2px 4px; }
  .daily-check, .daily-prio, .plan-check { width:18px; height:18px; }
}

@media (max-width: 480px) {
  #pageTitle { max-width:84px; }
  .top-date { display:none; }
}

/* 大屏（桌面）优化：限制主区内容最大宽度，避免超宽拉伸。
   20260825i：顶部 padding 与全局一致（此前 clamp(20px,2.4vw,40px) 把上提覆盖回去了） */
@media (min-width: 1280px) {
  #moduleContainer { padding:clamp(10px, 1.2vw, 20px) clamp(16px, 2vw, 32px); }
}

/* =====================================================================
   移动端专项微调（覆盖前述规则，置于文件末尾）
   ===================================================================== */

/* 1) 左侧导航：抽屉收起（折叠）后不再残留阴影带；仅展开态保留抽屉阴影 */
@media (max-width: 768px) {
  #sidebar { box-shadow: none !important; }
  #sidebar.open { box-shadow: var(--shadow-lg) !important; }
}

/* 3) 移动端 · 专注/计时器：放大数字（覆盖原固定的 3rem/2.5rem），收紧英雄框与看板空洞 */
@media (max-width: 768px) {
  .timer-digit { font-size: clamp(4.2rem, 32cqi, 10rem); }
  .timer-box { min-height: auto !important; padding: 22px 16px !important; gap: 14px; }
  #timerTrendChart, #timerPieChart { height: 210px !important; min-height: 190px !important; }
  #mod-timer .glass-card[style*="max-height:450px"] { max-height: 340px !important; }
  #timerRecordsScroll { max-height: 260px !important; }
}
@media (max-width: 480px) {
  .timer-digit { font-size: clamp(3.8rem, 36cqi, 8rem); }
}

/* 2) 移动端顶栏菜单(汉堡)按钮缩小（覆盖移动端 .btn 的 44px 放大，避免顶栏左侧过挤） */
@media (max-width: 768px) {
  #menuToggle { min-width:32px !important; min-height:32px !important; padding:4px 9px !important; font-size:.92rem !important; }
}
@media (max-width: 480px) {
  #menuToggle { min-width:30px !important; min-height:30px !important; padding:3px 8px !important; font-size:.88rem !important; }
}

/* 4) 密码箱：密码方框内的行内按钮（复制 / 显示隐藏）在移动端缩小，避免遮挡账号与密码 */
@media (max-width: 768px) {
  .pwd-field .btn-sm { min-width:30px !important; min-height:30px !important; font-size:.68rem !important; padding:3px 6px !important; }
}

/* 6) 日记：新建区的「添加」与「保存」按钮在移动端缩小，避免过大挤压输入区 */
@media (max-width: 768px) {
  #journalAddTag, #journalSaveBtn {
    min-height:36px !important; padding:8px 18px !important; font-size:.84rem !important;
  }
  #journalAddTag { padding:8px 14px !important; }
}

@media (max-width: 768px) {
}
@media (max-width: 480px) {
}

/* ===== 移动端 · 通用按钮策略（防止长标签按钮溢出 / 挤压 UI） ===== */
/* 这是普遍问题的统一修复：按钮默认 white-space:nowrap，长标签在窄屏会撑破容器、挤压其它元素。 */
@media (max-width: 768px) {
  /* 模态底部按钮：并排均分（20260823l 由竖排铺满改为并排，弹窗高度大减；
     两个按钮各占一行容易把确认弹窗撑得比内容还高） */
  .modal-footer { flex-wrap:wrap; gap:8px; }
  .modal-footer .btn { flex:1 1 0; min-width:0; }
  .modal-footer .btn-primary { flex:1; }

  /* 卡片内独立主操作按钮（如「打开邮箱设置」）移动端铺满整行，不再溢出 */
  .glass-card > .btn-primary { width:100%; }
}

@media (max-width: 480px) {
  /* 极窄屏：允许按钮文字换行，杜绝横向溢出（保持点按高度） */
  .btn { white-space:normal; }
  .modal-footer .btn { padding:8px 12px; font-size:.9rem; }
}

/* =====================================================================
   手机底部标签栏留白（20261021v 修复）
   问题：本文件前面的 `#moduleContainer` padding 简写（14px / 10px）会覆盖
   components.css 里为 tabbar 预留的 58px，导致模块面板最后一段内容被
   `.mobile-tabbar`（height: 58px + safe-area）盖住，滑到底也看不全。
   解决：放在文件最末（最后加载 + 同特异性下的后者胜），并把 tabbar 高度、
   安全区、少量呼吸空间一起算进底部留白。
   ===================================================================== */
@media (max-width: 768px) {
  #moduleContainer {
    padding-bottom: calc(58px + env(safe-area-inset-bottom, 0px) + 14px);
  }
}
