fmode-app/src/styles.scss

/* 应用层全局兜底：令牌覆盖、布局契约和无法下沉到组件的基础规则。 */
@use './app/core/styles/base';
@use './app/core/styles/palette';

:root,
.dark {
  --ok: var(--success);
  --ok-bg: var(--success-subtle);
  --ok-ink: var(--success);
  --crit: var(--danger);
  --crit-ink: var(--danger);
  --crit-soft: var(--danger-subtle);
  --warn-ink: var(--warning);
  --warn-bg: var(--warning-subtle);
}

html, body { height: 100%; margin: 0; padding: 0; }
body {
  background: var(--canvas); color: var(--ink);
  font-size: var(--fs-15); line-height: 1.6;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
/* AC-19.3：移动端输入框 ≥16px（底座用 Tailwind text-sm=14px，需 !important 压制）*/
input, textarea, select { font-size: var(--fs-17) !important; }

:root[data-palette] {
  .ui-m-tabbar--glass {
    background: linear-gradient(to top,
      color-mix(in srgb, var(--canvas) 94%, transparent) 45%,
      color-mix(in srgb, var(--canvas) 72%, transparent) 78%, transparent);
  }
  .ui-m-tabpill {
    background: color-mix(in srgb, var(--nav-surface) 90%, var(--surface));
    border-color: color-mix(in srgb, var(--nav-line) 70%, transparent);
    box-shadow: 0 8px 30px color-mix(in srgb, var(--nav-surface) 24%, transparent);
  }
  .ui-m-tabpill::before {
    background: linear-gradient(to bottom, color-mix(in srgb, var(--nav-ink) 18%, transparent), transparent 45%);
  }
  .ui-m-tab, .ui-m-tab i, .ui-m-tab em { color: var(--nav-text) !important; }
  .ui-m-tab.on { background: var(--nav-accent) !important; }
  .ui-m-tab.on i, .ui-m-tab.on em { color: var(--nav-on-brand) !important; }
  .ui-m-tab-badge, .ui-m-tab-dot { background: var(--danger) !important; }
}

.m-page--fixed { min-height: 100%; }

@media (max-width: 767px) {
  .m-main > * > .m-header,
  .m-main > *:not(:has(.m-header)) .m-page > .m-head,
  .m-main > * .m-page > .page-title {
    position: sticky;
    top: 0;
    z-index: var(--z-affix);
    background: var(--canvas);
  }
  .m-main > *:not(:has(.m-header)) .m-page > .m-head,
  .m-main > * .m-page > .page-title {
    padding-top: var(--sp-2);
  }
}

router-outlet + * { animation: fade-in var(--motion-page) var(--ease-standard) both; }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }

* { scrollbar-width: thin; scrollbar-color: var(--edge-strong) transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: var(--edge-strong); border-radius: var(--r-tag); }
*::-webkit-scrollbar-thumb:hover { background: var(--muted); }

@media (prefers-reduced-motion: reduce) { router-outlet + * { animation: none; } }

/* Modal sheets own the bottom edge while open; keep the fixed TabBar from
   showing through the scrim or competing with the sheet actions. */
body:has(.backdrop, .sheet-backdrop) .ui-m-tabbar--glass { display: none; }

/* 全局字号缩放：ChatFontService 写 --ui-scale(16px=1.0)，此处乘上；只乘字号不乘间距（覆盖底座生成物，ADR-006） */
:root { --fs-9: calc(10.5px * var(--ui-scale, 1)); --fs-10: calc(11px * var(--ui-scale, 1)); --fs-11: calc(11.5px * var(--ui-scale, 1)); --fs-12: calc(12px * var(--ui-scale, 1)); --fs-13: calc(13px * var(--ui-scale, 1)); --fs-135: calc(13.5px * var(--ui-scale, 1)); --fs-15: calc(15px * var(--ui-scale, 1)); --fs-17: calc(17px * var(--ui-scale, 1)); }