/* 站点外壳：顶栏导航 + 账户区 + 底栏 + 更新日志弹窗。
   日历只是这个站的一个功能，所以外壳独立于 timeline.js——
   读隐私政策的人不该为此加载整个 Canvas 应用。 */

:root{
  --ink:#2a2320; --ink-2:#5b5049; --ink-3:#8b8079;
  --paper:#fffdfa; --surface:#fffcf8; --surface-2:#f7f1e8;
  --line:#efe6da; --line-strong:#e2d5c4;
  --brand:#f39800; --brand-text:#b06e00; --coral:#f34f6d;
  --foot:#232020; --foot-ink:#e8e2da; --foot-ink-2:#9a918a;
  --header-h:52px;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:"Noto Sans SC","Noto Sans JP",-apple-system,BlinkMacSystemFont,
              "Segoe UI",sans-serif;
  color:var(--ink); background:var(--paper);
  -webkit-font-smoothing:antialiased;
}

/* ── 顶栏 ─────────────────────────────
   三段式：品牌 / 功能导航 / 账户区。功能导航是**站点级**的，
   日历和将来的功能都排在这一级；日历自己的筛选条在它下面另起一行。 */
.site-head{
  display:flex; align-items:center; gap:20px; flex:0 0 auto;
  height:var(--header-h); padding:0 20px;
  border-bottom:1px solid var(--line); background:var(--surface);
}
.site-brand{
  display:flex; align-items:baseline; gap:9px; text-decoration:none; flex:0 0 auto;
}
.site-brand b{ font-size:17px; font-weight:900; color:var(--ink); letter-spacing:.02em; }
.site-brand span{
  font-size:10px; letter-spacing:.26em; color:var(--ink-3); text-transform:uppercase;
}
.site-nav{ display:flex; align-items:center; gap:4px; flex:1 1 auto; min-width:0; }
.site-nav a{
  font-size:13px; color:var(--ink-2); text-decoration:none; padding:6px 12px;
  border-radius:999px; white-space:nowrap;
}
.site-nav a:hover{ background:var(--surface-2); }
.site-nav a[aria-current="page"]{ color:var(--ink); font-weight:600; background:var(--surface-2); }

/* 账户区。登录后换成头像；未登录时是「登录 / 注册」。 */
.site-acct{ display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.site-acct .link{
  font:inherit; font-size:12.5px; color:var(--ink-2); background:none; border:0;
  cursor:pointer; padding:6px 10px; border-radius:999px;
}
.site-acct .link:hover{ background:var(--surface-2); }
.site-acct .primary{
  background:var(--brand); color:#fff; font-weight:500; padding:6px 14px;
}
.site-acct .primary:hover{ filter:brightness(1.05); }
.avatar{
  width:30px; height:30px; border-radius:50%; background:var(--surface-2);
  border:1px solid var(--line-strong); display:inline-flex;
  align-items:center; justify-content:center; font-size:12px; color:var(--ink-3);
  cursor:pointer; padding:0;
}

/* ── 底栏 ─────────────────────────────
   深色是刻意的：它是全站共用的收尾区，和上面的浅色内容区分开，
   一眼知道「页面到这里为止」。 */
.site-foot{
  background:var(--foot); color:var(--foot-ink-2);
  padding:34px 20px 26px; margin-top:auto;
}
.foot-in{
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:minmax(240px,1.6fr) repeat(3,minmax(120px,1fr));
  gap:26px 30px;
}
.foot-brand b{ display:block; font-size:19px; font-weight:900; color:#fff; letter-spacing:.01em; }
.foot-brand b i{ font-style:normal; color:var(--brand); }
.foot-brand p{
  margin:12px 0 0; font-size:12px; line-height:1.85; color:var(--foot-ink-2);
  max-width:34em;
}
.foot-col h4{
  margin:0 0 12px; font-size:12px; font-weight:600; color:var(--foot-ink);
  letter-spacing:.18em;
}
.foot-col a, .foot-col button, .foot-col span.dim{
  display:block; font:inherit; font-size:12.5px; text-align:left;
  color:var(--foot-ink-2); text-decoration:none; background:none; border:0; padding:0;
  margin-bottom:11px; cursor:pointer;
}
.foot-col a:hover, .foot-col button:hover{ color:#fff; }
/* 还没有地址的条目：摆字但不做成链接，免得点了没反应 */
.foot-col span.dim{ cursor:default; color:#6f6862; }
.foot-bottom{
  max-width:1180px; margin:26px auto 0; padding-top:18px;
  border-top:1px solid #332e2b;
  display:flex; flex-wrap:wrap; gap:10px 20px; justify-content:space-between;
  font-size:11.5px; color:#6f6862;
}
.foot-bottom .mono{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
@media (max-width: 720px){
  .foot-in{ grid-template-columns:1fr 1fr; }
  .foot-brand{ grid-column:1 / -1; }
}

/* ── 更新日志弹窗 ─────────────────────
   一篇一页，像翻书一样上下滚。背景压暗，让注意力全在这一叠上。 */
#logScrim{
  position:fixed; inset:0; z-index:40; background:rgba(24,20,18,.62);
  opacity:0; transition:opacity .2s ease;
}
#logScrim[data-on="1"]{ opacity:1; }
#logScrim[hidden]{ display:none; }
#logModal{
  position:fixed; inset:0; z-index:41; display:flex; align-items:center;
  justify-content:center; padding:38px 16px; pointer-events:none;
}
#logModal[hidden]{ display:none; }
.log-deck{
  width:min(620px, 100%); max-height:100%; overflow-y:auto; pointer-events:auto;
  scroll-snap-type:y proximity;
  opacity:0; transform:translateY(10px);
  transition:opacity .22s ease, transform .26s cubic-bezier(.22,.9,.3,1);
}
#logModal[data-on="1"] .log-deck{ opacity:1; transform:none; }
.log-page{
  background:var(--paper); border-radius:14px; padding:30px 34px;
  box-shadow:0 18px 50px -22px rgba(0,0,0,.7);
  margin-bottom:18px; scroll-snap-align:center;
}
.log-page h3{ margin:0; font-size:16px; color:var(--ink); }
.log-page .when{
  margin-top:6px; font-size:11.5px; color:var(--ink-3);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.log-page .body{ margin-top:16px; font-size:13.5px; line-height:1.95; color:var(--ink-2); }
.log-page .body p{ margin:0 0 10px; }
.log-close{
  position:fixed; top:16px; right:18px; z-index:42;
  width:36px; height:36px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(255,255,255,.14); color:#fff; font-size:20px; line-height:1;
}
.log-close:hover{ background:rgba(255,255,255,.24); }
@media (prefers-reduced-motion:reduce){
  #logScrim, .log-deck{ transition:none; }
}

/* ── 内容页（主页 / 法律页）通用 ───────── */
.page{ flex:1 1 auto; }
.page-in{ max-width:760px; margin:0 auto; padding:44px 22px 64px; }
.page-in h1{ font-size:23px; margin:0 0 6px; }
.page-in .lede{ margin:0 0 30px; font-size:12.5px; color:var(--ink-3); }
.page-in h2{
  font-size:15px; margin:34px 0 10px; padding-top:18px;
  border-top:1px solid var(--line);
}
.page-in p, .page-in li{ font-size:13.5px; line-height:2; color:var(--ink-2); }
.page-in ul{ padding-left:1.3em; }
.page-in strong{ color:var(--ink); font-weight:600; }
.page-in code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12.5px;
  background:var(--surface-2); padding:1px 5px; border-radius:4px;
}

/* 主页占位。功能还不全，先诚实地说「在建」，不摆假的仪表盘。 */
.building{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:14px; min-height:min(58vh, 460px); text-align:center;
}
.building .mark{ width:54px; height:54px; opacity:.5; }
.building h1{ margin:0; font-size:19px; font-weight:600; color:var(--ink-2); }
.building p{ margin:0; font-size:13px; color:var(--ink-3); }
.building .go{
  margin-top:6px; font-size:13px; text-decoration:none; color:#fff; font-weight:500;
  background:var(--brand); padding:9px 20px; border-radius:999px;
}

/* ── 窄屏 ─────────────────────────────
   375px 上「品牌 + 副标题 + 两个导航 + 登录 + 注册」放不下，
   会把账户区挤出屏幕。副标题是装饰，先让它走。 */
@media (max-width: 560px){
  .site-head{ gap:10px; padding:0 12px; }
  .site-brand span{ display:none; }
  .site-nav{ gap:0; }
  .site-nav a{ padding:6px 9px; font-size:12.5px; }
  .site-acct .link{ padding:6px 8px; font-size:12px; }
  .site-acct .primary{ padding:6px 11px; }
}

:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; }