/* Shared visual language for the Xianjie operations platform. No external fonts. */
:root {
  color-scheme: light;
  --xj-paper: #f5f1e8;
  --xj-surface: #fffdf8;
  --xj-ink: #263d36;
  --xj-muted: #6a776d;
  --xj-jade: #285c4f;
  --xj-jade-dark: #1b423a;
  --xj-jade-soft: #e8efe8;
  --xj-gold: #aa874e;
  --xj-line: #ded9cb;
  --xj-danger: #a33f36;
  --xj-radius: 14px;
  --xj-shadow: 0 18px 50px #263d3610, 0 2px 8px #263d3606;
  --xj-font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  --xj-serif: "Songti SC", "STSong", "Noto Serif CJK SC", "SimSun", serif;
}
.xj-theme *, .xj-theme *::before, .xj-theme *::after { box-sizing: border-box; }
.xj-theme {
  margin: 0;
  color: var(--xj-ink);
  font-family: var(--xj-font);
  font-size: 14px;
  line-height: 1.65;
  background: var(--xj-paper);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  text-size-adjust: 100%;
}
.xj-theme h1, .xj-theme h2, .xj-theme h3 { color: var(--xj-ink); text-wrap: balance; }
.xj-theme h1 { font-family: var(--xj-serif); letter-spacing: .06em; line-height: 1.35; }
.xj-theme p { overflow-wrap: anywhere; }
.xj-theme a { color: var(--xj-jade); text-underline-offset: 4px; }
.xj-theme a:hover { color: var(--xj-jade-dark); }
.xj-theme button, .xj-theme input, .xj-theme select, .xj-theme textarea { font: inherit; }
.xj-theme button, .xj-theme input:not([type=hidden]):not([type=checkbox]):not([type=radio]), .xj-theme select { min-height: 44px; }
.xj-theme input:not([type=checkbox]):not([type=radio]), .xj-theme select, .xj-theme textarea {
  max-width: 100%;
  border: 1px solid var(--xj-line);
  border-radius: 8px;
  color: var(--xj-ink);
  background: #fffefb;
  transition: border-color .16s, box-shadow .16s;
}
.xj-theme textarea { min-height: 104px; padding: 12px; resize: vertical; }
.xj-theme input::placeholder, .xj-theme textarea::placeholder { color: #8c9287; opacity: 1; }
.xj-theme input:read-only:not([type=button]):not([type=submit]) { background-color: #efeee7; }
.xj-theme input:focus, .xj-theme select:focus, .xj-theme textarea:focus {
  border-color: var(--xj-jade);
  box-shadow: 0 0 0 3px #285c4f13;
  outline: none;
}
.xj-theme :focus-visible { outline: 2px solid var(--xj-jade); outline-offset: 4px; }
.xj-theme button { touch-action: manipulation; transition: background .16s, border-color .16s, box-shadow .16s; }
.xj-theme button:disabled, .xj-theme [aria-disabled=true] { cursor: not-allowed; }
.xj-theme button[aria-busy=true] { cursor: progress; }
.xj-theme input[type=checkbox], .xj-theme input[type=radio] { accent-color: var(--xj-jade); }
.xj-theme [hidden] { display: none !important; }
.xj-theme ::selection { color: var(--xj-jade-dark); background: #d5e3d0; }
.xj-theme .muted { color: var(--xj-muted); }
.xj-theme .xj-eyebrow { display: block; color: var(--xj-gold); font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.xj-theme .xj-brand-mark {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 44px; height: 44px; border: 1px solid currentColor; border-radius: 12px 4px 12px 4px;
  color: var(--xj-gold); font: 24px var(--xj-serif); line-height: 1;
}
.xj-theme .xj-page-intro { color: var(--xj-muted); margin: 8px 0 24px; font-size: 14px; }
.xj-theme .xj-form-note { color: var(--xj-muted); margin: 5px 0 0; font-size: 12px; line-height: 1.7; }
.xj-theme .xj-status { display: inline-flex; gap: 6px; align-items: center; padding: 3px 10px; border-radius: 999px; background: var(--xj-jade-soft); color: var(--xj-jade-dark); font-size: 12px; }
.xj-theme .xj-status::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.xj-theme .xj-field-error, .xj-theme .error, .xj-theme .hint.err { color: var(--xj-danger); }
.xj-theme .xj-skip-link { position: fixed; top: 8px; left: 12px; z-index: 1000; padding: 10px 16px; color: #fff; background: var(--xj-jade); border-radius: 6px; transform: translateY(-160%); }
.xj-theme .xj-skip-link:focus { transform: none; }
.xj-theme .xj-scroll-table { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; border: 1px solid var(--xj-line); border-radius: 10px; background: var(--xj-surface); }
.xj-theme .xj-scroll-table table { margin: 0; border: 0; }
.xj-theme table { font-variant-numeric: tabular-nums; }
.xj-theme table caption { text-align: left; color: var(--xj-muted); padding: 12px; }
.xj-theme img { max-width: 100%; }
.xj-theme .xj-password-field { position: relative; }
.xj-theme .xj-password-field input { padding-right: 64px; }
.xj-theme [data-xj-password-toggle] { min-height: 40px; padding: 4px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--xj-jade); font-size: 12px; cursor: pointer; }
.xj-theme .xj-password-field [data-xj-password-toggle] { position: absolute; right: 3px; bottom: 2px; margin: 0; width: auto; }
@media (max-width: 600px) {
  .xj-theme { font-size: 14px; }
  .xj-theme input:not([type=checkbox]):not([type=radio]), .xj-theme select, .xj-theme textarea { font-size: 16px; }
  .xj-theme .xj-brand-mark { width: 38px; height: 38px; font-size: 21px; }
}
@media (prefers-reduced-motion: reduce) {
  .xj-theme *, .xj-theme *::before, .xj-theme *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
@media print {
  .xj-theme { color: #000; background: #fff; }
  .xj-theme .xj-sidebar, .xj-theme .xj-mobile-menu, .xj-theme .xj-drawer-backdrop { display: none !important; }
  .xj-theme main { margin: 0 !important; padding: 0 !important; }
}
