/* PM World · Sky Garden · shared visual tokens */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700&family=Noto+Serif+SC:wght@600&display=swap');
:root {
  color-scheme: light;
  --world-bg: #f5f6f0;
  --world-paper: #ffffff;
  --world-glass: rgba(255,255,252,.84);
  --world-ink: #223c35;
  --world-muted: #62736b;
  --world-green: #356957;
  --world-soft: #e5eee4;
  --world-line: #dce4da;
  --world-gold: #aa762f;
  --world-shadow: 0 16px 40px -22px rgba(38,65,48,.28), 0 2px 8px rgba(38,65,48,.035);
  --world-font: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  --world-ease: cubic-bezier(.22,.8,.3,1);
}
:root[data-theme="night"] {
  color-scheme: dark;
  --world-bg: #142420;
  --world-paper: #1e322b;
  --world-glass: rgba(27,47,39,.92);
  --world-ink: #edf2e8;
  --world-muted: #b0c2b4;
  --world-green: #b6d5ab;
  --world-soft: #2b4236;
  --world-line: #385044;
  --world-gold: #e3ba79;
  --world-shadow: 0 16px 40px -20px rgba(0,0,0,.35);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; font-family: var(--world-font); color: var(--world-ink); background: var(--world-bg); -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--world-green); outline-offset: 5px; }
::selection { color: #223c35; background: #d1e2c3; }
.world-icon { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.world-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; color: #fff9e9; background: linear-gradient(145deg,#739582,#315e4f); box-shadow: inset 0 1px 1px #ffffff60, 0 5px 12px #35695725; font-family: Georgia,serif; font-size: 20px; letter-spacing: -2px; }
.world-theme { border: 1px solid var(--world-line); color: var(--world-ink); background: var(--world-glass); width: 44px; height: 44px; border-radius: 50%; display: inline-grid; place-items: center; transition: background .2s, transform .2s; }
.world-theme:hover { background: var(--world-soft); transform: rotate(-12deg); }
.world-skip { position: fixed; left: 20px; top: -100px; padding: 14px 20px; background: var(--world-paper); z-index: 100; border-radius: 12px; }
.world-skip:focus { top: 12px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

