/* 页眉照搬 coldspot.net（spiekermann 主题）。布局按 ricky/wayne 2026-10-12 的草图。
   规矩：除非明确要求，不加分割线、不加框。 */

@font-face {
  font-family: "Alpha Lyrae";
  font-style: normal;
  font-weight: 400;
  font-display: fallback;
  src: url("AlphaLyrae-Medium.woff2") format("woff2");
}

/* Alpha Lyrae 没有的字（中文、全角标点、°、⁻¹ 等）落到 Unifont。和主站 uploads/fonts 里是同一个文件。
   用 swap 而不是 fallback：文件大，慢网下 3 秒内下不完的话 fallback 会让这次访问一直停在系统字体 */
@font-face {
  font-family: "Unifont";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("unifont-16.0.03.otf") format("opentype");
}

:root {
  --font-body: "Alpha Lyrae", "Unifont", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
  --body-margin: clamp(16px, 3.6vw, 36px);
  --indent: clamp(0px, 14vw, 260px);   /* Today 栏左边空出来的那块 */
  --col-gap: clamp(2rem, 5vw, 5rem);

  /* 和主站一样：固定白底黑字，不跟系统深色模式走（ricky/wayne 2026-10-13 要求） */
  color-scheme: light;
  --bg: #fff;
  --fg: #000;
  --muted: #777;

  --wx-sun: #f5b400;
  --wx-cloud: #c3cad3;
  --wx-rain: #3b82f6;
  --wx-snow: #93c5fd;
  --sock-a: #ff5a1f;
  --sock-b: #e4e4e4;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-body);
  line-height: 1.5;
  /* 照抄主站 spiekermann 主题的 body：Alpha Lyrae 用 salt 那套字形，
     关掉 calt（默认开着时会随机出"故障"字形）和连字 */
  font-feature-settings: 'salt' on, 'calt' off, 'liga' off;
  font-synthesis: small-caps style;   /* 同主站：不伪造粗体，像素字加粗会糊 */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a { color: inherit; }
.visually-hidden {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---- 页眉：与 coldspot.net 一致，右上角加城市下拉 ---- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: var(--body-margin) var(--body-margin) 0;
  background: var(--bg);
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 1.4rem;               /* 主站：block-gap 1em × body 1.4rem */
  text-decoration: none;
}
.brand img { display: block; width: 90px; height: auto; }
.brand-title { font-size: 2.5rem; line-height: 1.2; }
.brand:hover .brand-title { text-decoration: underline; }

.city-pick { position: relative; }
.city-pick select {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 1.125rem;
  padding: 0.25rem 1.25rem 0.25rem 0.25rem;
  cursor: pointer;
}
.city-pick::after {
  content: "▾";
  position: absolute;
  right: 0.25rem;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}
.city-pick select option { color: #111; background: #fff; }

/* ---- 问候语 ---- */
.greeting {
  margin: 2rem 0 0;
  padding: 0 var(--body-margin);
  /* 字号同正文（2026-10-13 定的） */
}

/* ---- 两栏 ---- */
.board {
  display: grid;
  grid-template-columns: var(--indent) minmax(0, 1fr) minmax(0, 1.3fr);
  column-gap: var(--col-gap);
  padding: 0 var(--body-margin) 4rem;
}
.col-left  { grid-column: 2; }
.col-right { grid-column: 3; }

h2 {
  margin: 3rem 0 1rem;
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: normal;
  line-height: 1.2;
}
.col > section:first-child h2 { margin-top: 2.5rem; }

/* ---- 天气 ---- */
.wx-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.wx-city { font-size: 1.5rem; }
.wx-icon { display: block; flex: none; }
.wx-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 1.5rem;
  margin: 0.25rem 0 0;
  font-size: 1.125rem;
}
.wx-wind { display: inline-flex; align-items: center; gap: 0.4rem; }
.wx-note { margin: 0.25rem 0 0; }

.windsock { display: block; overflow: visible; }
.sock-pole { stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.sock-a { fill: var(--sock-a); }
.sock-b { fill: var(--sock-b); }
.sock-live {
  transform-box: view-box;
  transform-origin: 3px 4px;
  animation: sock-flutter var(--flutter, 2s) ease-in-out infinite alternate;
}
@keyframes sock-flutter {
  from { transform: rotate(-3deg); }
  to   { transform: rotate(3deg); }
}
@media (prefers-reduced-motion: reduce) {
  .sock-live { animation: none; }
}

/* ---- 内容块（AI / 城市 / News 共用） ---- */
.ai, .local { margin-top: 2rem; }
.item + .item { margin-top: 1.5rem; }
.item h3 { margin: 0 0 0.25rem; font-size: 1.125rem; }
.item p { margin: 0.25rem 0; }
.item ul { margin: 0.25rem 0; padding-left: 1.25rem; }
.hint { color: var(--muted); }

/* ---- Up next：日期 | 事件 两列对齐 ---- */
.upnext dl {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 0.35rem 2rem;
  margin: 0;
}
.upnext dt, .upnext dd { margin: 0; }
.upnext dt { font-variant-numeric: tabular-nums; }

.site-footer { padding: 2rem var(--body-margin); color: var(--muted); font-size: 0.75rem; }

/* ---- 窄屏：一栏，News 排在最后 ---- */
@media (max-width: 860px) {
  .board { grid-template-columns: minmax(0, 1fr); }
  .col-left, .col-right { grid-column: 1; }
  .brand-title { font-size: 2rem; }
  .brand img { width: 72px; }
}