/* 2026-07-23 全站主题与动效精修：清晰、克制、仅合成属性动画 */
:root{
  --ui-spring:cubic-bezier(.2,1.18,.28,1);
  --ui-smooth:cubic-bezier(.25,.1,.25,1);
  --ui-fast:180ms;
  --ui-medium:420ms;
  color-scheme:dark;
}

html[data-theme="light"]{
  color-scheme:light;
  --bg0:#edf5ff;--bg1:#f8fbff;--fg:#101828;
  --muted:rgba(35,52,76,.72);--muted2:rgba(52,70,94,.60);
  --stroke:rgba(47,91,144,.18);--stroke2:rgba(47,91,144,.11);
  --glass:rgba(255,255,255,.82);--glass2:rgba(246,251,255,.88);--glass3:rgba(255,255,255,.94);
}
html[data-theme="dark"]{
  color-scheme:dark;
  --bg0:#060a12;--bg1:#0a1120;--fg:#f5f8ff;
  --muted:rgba(218,228,244,.74);--muted2:rgba(169,186,211,.62);
  --stroke:rgba(142,178,225,.20);--stroke2:rgba(124,160,207,.12);
  --glass:rgba(18,27,43,.88);--glass2:rgba(25,38,60,.80);--glass3:rgba(13,22,37,.94);
}
html[data-theme="liquid-dark"]:not(.lg-ready){
  color-scheme:dark;
  --bg0:#07101f;--bg1:#0a1730;--fg:#f4f8ff;
  --muted:rgba(220,232,248,.74);--muted2:rgba(166,190,221,.62);
  --stroke:rgba(123,181,247,.22);--stroke2:rgba(102,164,237,.13);
  --glass:rgba(17,34,59,.88);--glass2:rgba(30,55,89,.76);--glass3:rgba(12,27,49,.94);
}

html[data-theme="light"] body{
  color:#101828!important;
  background-color:#edf5ff!important;
  background-image:
    radial-gradient(70rem 42rem at -8% -10%,rgba(78,156,255,.20),transparent 62%),
    radial-gradient(58rem 38rem at 108% 4%,rgba(166,107,255,.15),transparent 64%),
    linear-gradient(145deg,#f9fcff 0%,#edf6ff 48%,#f7f1ff 100%)!important;
  background-attachment:fixed!important;
}
html[data-theme="dark"] body{
  color:#f5f8ff!important;
  background-color:#060a12!important;
  background-image:
    radial-gradient(68rem 38rem at -8% -10%,rgba(38,116,255,.18),transparent 62%),
    radial-gradient(56rem 34rem at 108% 2%,rgba(127,74,235,.14),transparent 64%),
    linear-gradient(150deg,#05080e 0%,#08111f 52%,#0d1020 100%)!important;
  background-attachment:fixed!important;
}
html[data-theme="liquid-dark"]:not(.lg-ready) body{
  color:#f4f8ff!important;background-color:#07101f!important;
  background-image:radial-gradient(68rem 40rem at -8% -10%,rgba(42,134,255,.23),transparent 62%),radial-gradient(58rem 36rem at 108% 0,rgba(139,87,244,.18),transparent 64%),linear-gradient(150deg,#050b15 0%,#09182c 54%,#11112a 100%)!important;
  background-attachment:fixed!important;
}

/* 非液态主题的卡片：彩色层次来自静态渐变，不依赖重型滤镜。 */
html:not(.lg-ready)[data-theme="light"] :where(.card,.svc,.panel,.article,.sidebar,.content,.term-wrap,.auth-card,.chat-panel,.composer,.box){
  color:#101828;
  border-color:rgba(64,111,169,.18)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(239,247,255,.88) 58%,rgba(247,241,255,.84))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.98),0 16px 42px rgba(51,84,126,.12)!important;
}
html:not(.lg-ready)[data-theme="dark"] :where(.card,.svc,.panel,.article,.sidebar,.content,.term-wrap,.auth-card,.chat-panel,.composer,.box){
  color:#f5f8ff;
  border-color:rgba(135,178,231,.18)!important;
  background:linear-gradient(145deg,rgba(24,37,58,.94),rgba(12,22,38,.92) 58%,rgba(27,21,49,.90))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.10),0 20px 52px rgba(0,0,0,.30)!important;
}
html:not(.lg-ready)[data-theme="liquid-dark"] :where(.card,.svc,.panel,.article,.sidebar,.content,.term-wrap,.auth-card,.chat-panel,.composer,.box){
  color:#f4f8ff;border-color:rgba(126,185,250,.22)!important;
  background:linear-gradient(145deg,rgba(26,54,89,.94),rgba(10,27,51,.93) 58%,rgba(37,25,66,.91))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.13),0 20px 54px rgba(0,0,0,.34)!important;
}
html:not(.lg-ready)[data-theme="light"] :where(.card,.panel,.article,.sidebar,.content,.term-wrap) :where(p,small,.muted,.sub,.hint,.desc){color:rgba(35,52,76,.72)}
html:not(.lg-ready)[data-theme="dark"] :where(.card,.panel,.article,.sidebar,.content,.term-wrap) :where(p,small,.muted,.sub,.hint,.desc){color:rgba(218,228,244,.72)}
html:not(.lg-ready)[data-theme="liquid-dark"] :where(.card,.panel,.article,.sidebar,.content,.term-wrap) :where(p,small,.muted,.sub,.hint,.desc){color:rgba(220,232,248,.72)}

/* 首页下方快捷磁贴在浅色/深色主题中统一为对应主题渐变，不再使用多色分类底。 */
html[data-theme="light"] .tiles .tile{
  color:#13233b!important;--tile-color:#5a8ed8!important;
  background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(226,241,255,.93) 58%,rgba(243,234,255,.91))!important;
  border-color:rgba(65,111,167,.18)!important;
  box-shadow:inset 0 1px #fff,0 16px 38px rgba(48,82,124,.14)!important;
}
html[data-theme="dark"] .tiles .tile{
  color:#f4f8ff!important;--tile-color:#568de6!important;
  background:linear-gradient(145deg,rgba(27,43,68,.96),rgba(11,23,41,.95) 58%,rgba(31,24,55,.93))!important;
  border-color:rgba(132,176,231,.18)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.11),0 20px 44px rgba(0,0,0,.30)!important;
}

/* 色块保留原本配色，再叠加统一的光照渐变与边缘。 */
html:not(.lg-ready) :where(.tile,.chip,.badge){
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.22),0 14px 32px rgba(14,31,57,.16);
}
html[data-theme="light"] :where(input:not([type="color"]):not([type="range"]),textarea,select){
  color:#101828!important;background:rgba(255,255,255,.84)!important;border-color:rgba(56,97,149,.20)!important;
}
html[data-theme="dark"] :where(input:not([type="color"]):not([type="range"]),textarea,select){
  color:#f5f8ff!important;background:rgba(6,13,25,.72)!important;border-color:rgba(135,178,231,.20)!important;
}
html[data-theme="liquid-dark"]:not(.lg-ready) :where(input:not([type="color"]):not([type="range"]),textarea,select){color:#f4f8ff!important;background:rgba(5,18,36,.74)!important;border-color:rgba(126,185,250,.22)!important}
html :where(input,textarea,select):focus-visible{outline:none!important;box-shadow:0 0 0 4px rgba(47,139,255,.16)!important;border-color:rgba(47,139,255,.70)!important}

/* 主题按钮和菜单始终显示当前主题的视觉语言；支持导航内嵌与首页 Top Layer 两种结构。 */
.theme-dropdown{position:relative}
.theme-dropdown .theme-menu{position:absolute;right:0;top:calc(100% + 10px);left:auto;z-index:2147483647}
.theme-menu{
  min-width:208px;padding:8px;display:flex;flex-direction:column;gap:4px;
  border:1px solid rgba(255,255,255,.16);border-radius:20px;
  opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px) scale(.96);
  border-radius:20px!important;
  transform-origin:80% 0;
  transition:opacity var(--ui-fast) linear,transform var(--ui-medium) var(--ui-spring),visibility var(--ui-fast)!important;
}
.theme-dropdown.open .theme-menu,.theme-menu.open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1)}
html[data-theme="light"] .theme-menu{
  color:#12213a!important;border-color:rgba(255,255,255,.92)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(231,243,255,.94) 58%,rgba(244,235,255,.92))!important;
  box-shadow:inset 0 1px #fff,0 24px 64px rgba(42,73,112,.22)!important;
}
html[data-theme="dark"] .theme-menu{
  color:#f2f6ff!important;border-color:rgba(143,184,235,.22)!important;
  background:linear-gradient(145deg,rgba(24,38,61,.97),rgba(9,17,31,.97) 58%,rgba(28,21,50,.96))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.12),0 28px 72px rgba(0,0,0,.48)!important;
}
html[data-theme="liquid-dark"] .theme-menu{
  color:#f4f8ff!important;border-color:rgba(201,230,255,.34)!important;
  background:linear-gradient(145deg,rgba(39,78,128,.72),rgba(7,20,42,.78) 58%,rgba(57,30,91,.68))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.24),0 30px 80px rgba(0,0,0,.48)!important;
}
.theme-menu .theme-option{position:relative;display:flex;align-items:center;gap:10px;width:100%;padding:10px 11px;border:0;border-radius:12px!important;background:transparent;color:inherit!important;font:inherit;font-size:13px;text-align:left;cursor:pointer;transition:background 180ms ease,transform 260ms var(--ui-spring)}
.theme-menu .theme-option:hover{background:rgba(96,151,226,.12);transform:translateX(2px)}
.theme-menu .theme-option .dot{width:13px;height:13px;flex:0 0 13px;border-radius:50%;border:1px solid rgba(255,255,255,.28)}
.theme-menu .theme-option .dot-lg{background:conic-gradient(from 45deg,#d9f0ff,#6baeff,#9b75f5,#57d4ff,#d9f0ff)}
.theme-menu .theme-option .dot-plain,.theme-menu .theme-option .dot-dark{background:linear-gradient(135deg,#101827,#35445e)}
.theme-menu .theme-option .dot-light{background:linear-gradient(135deg,#fff,#d9e8f8);border-color:rgba(43,77,119,.18)}
.theme-menu .theme-option.is-active{
  color:inherit!important;
  background:linear-gradient(135deg,rgba(47,139,255,.22),rgba(160,103,255,.16))!important;
  box-shadow:inset 0 0 0 1px rgba(79,154,255,.24)!important;
}
.theme-menu .theme-option.is-active::after{content:"✓";margin-left:auto;font-weight:750;color:#2997ff}
html[data-theme="light"] .nav #themeBtn{background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(225,241,255,.88))!important;color:#152641!important}
html[data-theme="dark"] .nav #themeBtn{background:linear-gradient(135deg,rgba(31,48,75,.92),rgba(17,26,44,.94))!important;color:#f5f8ff!important}
html[data-theme="liquid-dark"] .nav #themeBtn{background:linear-gradient(135deg,rgba(75,150,255,.24),rgba(150,92,255,.18))!important;color:#f7faff!important}

/* 弹性入场与交互：只使用 opacity/transform，交给合成线程。 */
:where(.card,.tile,.svc,.panel,.article,.row,.action){
  transition:transform var(--ui-medium) var(--ui-spring),box-shadow 300ms var(--ui-smooth),border-color 220ms linear!important;
}
:where(.tile.in,.svc.in,.fx-fade-up.in,.fx-pop-in.in,.reveal.in,.fx-stagger>*.in){
  animation:ui-spring-in 560ms var(--ui-spring) both;
}
@keyframes ui-spring-in{
  0%{opacity:.72;transform:translate3d(0,14px,0) scale(.985)}
  66%{opacity:1;transform:translate3d(0,-3px,0) scale(1.006)}
  100%{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@media(hover:hover) and (pointer:fine){
  :where(.card,.tile,.svc,.panel,.row,.action):hover{transform:translate3d(0,-4px,0) scale(1.006)}
}
:where(.card,.tile,.svc,.panel,.row,.action):active{transform:translate3d(0,-1px,0) scale(.99)}

/* 加载遮罩跟随主题，避免浅色模式闪黑。 */
html[data-theme="light"]::before{background:linear-gradient(145deg,#f9fcff,#eaf4ff 54%,#f5efff)!important}
html[data-theme="light"]::after{border-color:rgba(35,64,105,.14)!important;border-top-color:#1677ff!important}
html[data-theme="dark"]::before{background:linear-gradient(145deg,#05080e,#0a1322 58%,#111126)!important}
html[data-theme="liquid-dark"]::before{background:radial-gradient(circle at 50% 35%,#123364,#071225 58%,#040711)!important}

/* 长页面在视口外跳过布局与绘制；保持占位，减少滚动主线程压力。 */
main :where(section,.section){content-visibility:auto;contain-intrinsic-size:auto 420px}

@media(max-width:760px){
  html[data-theme="light"] body,html[data-theme="dark"] body{background-attachment:scroll!important}
  :where(.tile.in,.svc.in,.fx-fade-up.in,.fx-pop-in.in,.reveal.in,.fx-stagger>*.in){animation-duration:460ms}
}
@media(prefers-reduced-motion:reduce){
  :where(.tile.in,.svc.in,.fx-fade-up.in,.fx-pop-in.in,.reveal.in,.fx-stagger>*.in){animation:none!important}
  :where(.card,.tile,.svc,.panel,.article,.row,.action){transition:none!important;transform:none!important}
}

/* 纯浅色 / 纯深色以流畅度优先：使用静态不透明表面，避免滚动时重复计算大面积滤镜。 */
html[data-theme="light"] body,html[data-theme="dark"] body{background-attachment:scroll!important}
html[data-theme="light"] :where(.nav,.brand,.pill,.card,.svc,.tile,.panel,.article,.sidebar,.content,.term-wrap,.auth-card,.chat-panel,.composer),
html[data-theme="dark"] :where(.nav,.brand,.pill,.card,.svc,.tile,.panel,.article,.sidebar,.content,.term-wrap,.auth-card,.chat-panel,.composer){
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
html[data-theme="light"] .nav{background:rgba(246,250,255,.96)!important}
html[data-theme="dark"] .nav{background:rgba(8,15,27,.96)!important}
html[data-theme="light"] .orb,html[data-theme="dark"] .orb{animation:none!important;will-change:auto!important}