:root {
  --bg: #f4f2ea;
  --fg: #152019;
  --soft: #435048;
  --muted: #657068;
  --line: rgba(21, 32, 25, .18);
  --line-soft: rgba(21, 32, 25, .09);
  --signal: #a64624;
  --signal-soft: rgba(166, 70, 36, .075);
  --atlas-bg: #17211b;
  --atlas-fg: #f1efe7;
  --atlas-muted: #aeb7af;
  --pad: clamp(22px, 4.2vw, 68px);
  --rail-w: 164px;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --serif: Georgia, "Times New Roman", serif;
  --sans-zh: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --serif-zh: "Songti SC", STSong, "Noto Serif CJK SC", "Source Han Serif SC", SimSun, serif;
  --mono: "SFMono-Regular", "Roboto Mono", "Liberation Mono", Menlo, Consolas, monospace;
  --ease: cubic-bezier(.16, 1, .3, 1);
}

* { box-sizing: border-box; }
html { background: var(--bg); color-scheme: light; scroll-behavior: smooth; }
html[lang="zh-CN"] { --sans: var(--sans-zh); --serif: var(--serif-zh); }
body {
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 78% 18%, rgba(46, 83, 63, .045), transparent 29%),
    radial-gradient(circle at 16% 84%, rgba(166, 70, 36, .025), transparent 25%),
    var(--bg);
  color: var(--fg);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
::selection { background: #d8c5b6; color: var(--fg); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--signal); outline-offset: 5px; }

.skip {
  position: fixed; z-index: 200; top: 10px; left: 10px;
  padding: 9px 12px; background: var(--fg); color: var(--bg);
  transform: translateY(-160%); font: 600 12px/1 var(--mono);
}
.skip:focus { transform: none; }

.site-nav {
  position: fixed; z-index: 90; inset: 0 0 auto; height: 72px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 var(--pad); border-bottom: 1px solid rgba(21, 32, 25, .08);
  background: linear-gradient(to bottom, rgba(244,242,234,.98), rgba(244,242,234,.92), rgba(244,242,234,.68));
  backdrop-filter: blur(14px);
}
.brand { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 680; letter-spacing: -.03em; }
.brand-mark {
  position: relative; width: 14px; height: 14px; border: 1px solid var(--soft); border-radius: 50%;
  background: radial-gradient(circle at center, var(--signal) 0 2px, transparent 2.4px);
}
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; background: var(--soft); }
.brand-mark::before { left: 6px; top: 0; width: 1px; height: 14px; }
.brand-mark::after { left: 0; top: 6px; width: 14px; height: 1px; }
.nav-links { display: flex; align-items: center; gap: clamp(20px, 2.2vw, 36px); margin-left: auto; }
.nav-links a { position: relative; color: #4f5b53; font-size: 13px; font-weight: 600; letter-spacing: .035em; }
.lang-switch { appearance: none; border: 0; border-left: 1px solid var(--line); background: transparent; color: var(--muted); padding: 2px 0 2px clamp(18px, 2vw, 28px); cursor: pointer; font: 700 12px/1 var(--mono); letter-spacing: .06em; }
.lang-switch:hover { color: var(--signal); }
.nav-links a:hover, .nav-links a[aria-current="page"] { color: var(--fg); }
.nav-links a[aria-current="page"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -12px; height: 2px; background: var(--signal); }
.nav-toggle { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; border: 1px solid var(--line); background: rgba(244,242,234,.82); padding: 9px 12px; font: 650 12px/1 var(--mono); letter-spacing: .05em; cursor: pointer; }

.bg-field { position: fixed; z-index: 0; inset: 0; pointer-events: none; }
#contourCanvas { width: 100%; height: 100%; }
main { position: relative; z-index: 2; }

.scale-ui {
  position: fixed; z-index: 70; right: var(--pad); top: 96px;
  min-width: 132px; display: grid; gap: 6px; text-align: right;
  opacity: .72; cursor: help; transition: opacity .25s var(--ease);
}
.scale-ui:hover, .scale-ui:focus-within { opacity: 1; }
body.origin-active .scale-ui { opacity: .38; }
body.origin-active .scale-ui:hover, body.origin-active .scale-ui:focus-within { opacity: .86; }
.scale-ui > span { color: var(--muted); font: 700 11px/1 var(--mono); letter-spacing: .085em; }
.scale-ui > strong { color: var(--fg); font: 650 13px/1 var(--mono); }
.scale-ui > em { color: var(--signal); font: 700 11px/1 var(--mono); letter-spacing: .07em; font-style: normal; }
.scale-legend {
  position: absolute; right: 0; top: calc(100% + 13px); width: 200px;
  padding: 12px 14px; border: 1px solid var(--line); background: rgba(244,242,234,.97);
  box-shadow: 0 16px 40px rgba(21,32,25,.08); opacity: 0; transform: translateY(-5px);
  pointer-events: none; transition: opacity .2s var(--ease), transform .2s var(--ease);
}
.scale-ui:hover .scale-legend, .scale-ui:focus .scale-legend, .scale-ui:focus-within .scale-legend, .scale-ui.is-open .scale-legend { opacity: 1; transform: none; pointer-events: auto; }

.scale-legend b { color: var(--fg); font: 650 11px/1 var(--mono); }
.scale-legend small { color: var(--muted); font: 700 11px/1 var(--mono); letter-spacing: .05em; }

.scale-step {
  width: 100%; min-height: 34px; display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center;
  padding: 7px 0; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; text-align: left; cursor: pointer;
}
.scale-step:last-child { border-bottom: 0; }
.scale-step b { color: var(--fg); font: 650 11px/1 var(--mono); }
.scale-step small { justify-self: end; }
.scale-step:hover:not(:disabled) small, .scale-step.is-active small { color: var(--signal); }
.scale-step.is-active::before { content: ""; position: absolute; right: -5px; width: 2px; height: 16px; background: var(--signal); }
.scale-step { position: relative; }
.scale-step:disabled { opacity: .32; cursor: not-allowed; }


.sheet-index {
  position: fixed; z-index: 64; left: 22px; top: 50%; width: 142px;
  display: grid; gap: 2px; padding-left: 18px; color: var(--muted);
  transform: translateY(-42%); transition: opacity .42s var(--ease), transform .42s var(--ease);
}
.sheet-index::before { content: ""; position: absolute; left: 3px; top: 30px; bottom: 34px; width: 1px; background: var(--line); }
.sheet-index-title { margin: 0 0 12px -18px; color: var(--muted); font: 750 11px/1 var(--mono); letter-spacing: .11em; }
.sheet-index a { position: relative; min-height: 31px; display: grid; grid-template-columns: 25px 1fr; gap: 6px; align-items: center; font-family: var(--mono); transition: color .2s var(--ease), transform .25s var(--ease); }
.sheet-index a::before { content: ""; position: absolute; left: -18px; top: 50%; width: 7px; height: 7px; border: 1px solid var(--muted); border-radius: 50%; background: var(--bg); transform: translate(-3px,-50%); transition: background .2s, border-color .2s, transform .25s; }
.sheet-index a::after { content: ""; position: absolute; left: -11px; top: 50%; width: 0; height: 1px; background: var(--signal); transition: width .25s var(--ease); }
.sheet-index a span { color: var(--muted); font-size: 11px; font-weight: 650; }
.sheet-index a b { color: inherit; font-size: 12px; line-height: 1.2; font-weight: 650; letter-spacing: .01em; }
.sheet-index a:hover, .sheet-index a[aria-current="location"], .sheet-index a[aria-current="page"] { color: var(--fg); transform: translateX(4px); }
.sheet-index a:hover::before, .sheet-index a[aria-current="location"]::before, .sheet-index a[aria-current="page"]::before { border-color: var(--signal); background: var(--signal); transform: translate(-3px,-50%) scale(.8); }
.sheet-index a:hover::after, .sheet-index a[aria-current="location"]::after, .sheet-index a[aria-current="page"]::after { width: 13px; }
.sheet-index-foot { margin: 12px 0 0 -18px; max-width: 128px; color: #7b857d; font: 650 11px/1.4 var(--mono); letter-spacing: .045em; }
.home-index { opacity: 0; transform: translate(-10px,-42%); pointer-events: none; }
.home-index.is-visible { opacity: 1; transform: translate(0,-42%); pointer-events: auto; }

.eyebrow, .section-label { color: var(--muted); font: 600 12px/1.2 var(--mono); letter-spacing: .10em; text-transform: uppercase; }
.muted { color: var(--muted); }

.hero.hero-centered {
  position: relative; min-height: 100svh; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  padding: 96px var(--pad) 56px; text-align: center;
}
.hero-copy { position: relative; z-index: 3; width: min(1180px,92vw); transform: translateY(-1.5vh); }
.hero-eyebrow { margin: 0 0 26px; color: #536057; font-size: 12px; font-weight: 600; letter-spacing: .105em; }
.display { margin: 0; color: var(--fg); font-size: clamp(100px,16.8vw,286px); line-height: .72; letter-spacing: -.083em; font-weight: 620; white-space: nowrap; }
.hero-tagline { margin: 46px 0 0; color: #202b24; font-family: var(--serif); font-style: italic; font-size: clamp(30px,4.1vw,68px); line-height: 1; letter-spacing: -.045em; white-space: nowrap; }
.hero-lexicon { margin: 30px auto 0; display: flex; align-items: center; justify-content: center; gap: 13px; color: #6a756d; font: 600 12px/1 var(--mono); letter-spacing: .08em; }
.hero-lexicon i { display: block; width: 18px; height: 1px; background: rgba(21,32,25,.22); }
.hero-edge { position: absolute; z-index: 3; bottom: 28px; color: #677169; font: 600 11px/1 var(--mono); letter-spacing: .055em; }
.hero-edge-left { left: var(--pad); }
.hero-edge-right { right: var(--pad); }
.map-corners { position: absolute; z-index: 1; inset: 92px calc(var(--pad) - 7px) 48px; pointer-events: none; }
.map-corners i { position: absolute; width: 18px; height: 18px; opacity: .34; }
.map-corners i:nth-child(1) { left: 0; top: 0; border-left: 1px solid var(--soft); border-top: 1px solid var(--soft); }
.map-corners i:nth-child(2) { right: 0; top: 0; border-right: 1px solid var(--soft); border-top: 1px solid var(--soft); }
.map-corners i:nth-child(3) { right: 0; bottom: 0; border-right: 1px solid var(--soft); border-bottom: 1px solid var(--soft); }
.map-corners i:nth-child(4) { left: 0; bottom: 0; border-left: 1px solid var(--soft); border-bottom: 1px solid var(--soft); }
.hero-centered::after { content: ""; position: absolute; z-index: 1; left: 50%; top: 50%; width: min(74vw,1120px); height: min(53vh,520px); transform: translate(-50%,-50%); background: radial-gradient(ellipse at center, rgba(244,242,234,.84) 0%, rgba(244,242,234,.69) 45%, rgba(244,242,234,0) 75%); pointer-events: none; }

.home-section { position: relative; padding: clamp(100px,10vw,145px) var(--pad) clamp(110px,11vw,155px); border-top: 1px solid var(--line-soft); }
.home-section[data-scale="1 : 25,000"] .section-label::after { content: " · 1:25K"; color: #8a938c; font-weight: 600; }
.section-head { display: grid; grid-template-columns: minmax(180px,220px) minmax(0,1fr); gap: clamp(30px,4vw,64px); align-items: start; margin-bottom: 52px; }
.section-head h2 { margin: 0; max-width: none; color: var(--fg); font-size: clamp(42px,4.65vw,68px); line-height: .96; letter-spacing: -.055em; font-weight: 560; text-wrap: pretty; }
.section-head p { margin: 16px 0 0; max-width: 920px; color: #47534b; font-family: var(--serif); font-size: clamp(18px,1.5vw,22px); line-height: 1.55; text-wrap: pretty; }

.now-grid { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.now-grid article { min-height: 230px; padding: 22px 24px 24px 0; border-right: 1px solid var(--line); }
.now-grid article + article { padding-left: 24px; }
.now-grid article:last-child { border-right: 0; }
.now-grid span { color: var(--muted); font: 650 12px/1 var(--mono); letter-spacing: .055em; }
.now-grid h3 { margin: 72px 0 12px; font-family: var(--serif); font-size: clamp(23px,2.25vw,32px); line-height: 1.04; font-weight: 400; letter-spacing: -.035em; }
.now-grid p { margin: 0; max-width: 340px; color: var(--soft); font-size: 15px; line-height: 1.62; }

.preview-list { border-top: 1px solid var(--line); }
.preview-row, .note-row, .lab-row { position: relative; display: grid; align-items: center; border-bottom: 1px solid var(--line-soft); overflow: hidden; }
.preview-row { grid-template-columns: 135px minmax(0,1fr) minmax(180px,auto); gap: 30px; padding: 27px 0; }
.preview-row time { color: var(--muted); font: 600 12px/1 var(--mono); }
.preview-row strong { font-size: clamp(18px,1.7vw,24px); line-height: 1.35; font-weight: 520; }
.preview-row small { color: var(--muted); font: 600 11px/1.45 var(--mono); text-align: right; }
.preview-row:hover, .note-row:hover, .lab-row:hover { border-bottom-color: rgba(166,70,36,.30); }
.preview-row:hover time, .preview-row:hover small, .note-row:hover time, .note-row:hover .note-meta { color: #9f5638; }

.contour-target { --geo-x: 50%; --geo-y: 50%; position: relative; isolation: isolate; }
.contour-target > * { position: relative; z-index: 1; }
.contour-target::after { content: ""; position: absolute; inset: -12px -16px; z-index: 0; pointer-events: none; opacity: 0; background:
  radial-gradient(ellipse at var(--geo-x) var(--geo-y), transparent 0 31px, rgba(166,70,36,.16) 32px 32.8px, transparent 33.8px),
  radial-gradient(ellipse at var(--geo-x) var(--geo-y), transparent 0 51px, rgba(21,32,25,.115) 52px 52.7px, transparent 53.7px),
  radial-gradient(ellipse at var(--geo-x) var(--geo-y), transparent 0 72px, rgba(21,32,25,.075) 73px 73.7px, transparent 74.7px),
  radial-gradient(ellipse at var(--geo-x) var(--geo-y), transparent 0 94px, rgba(21,32,25,.05) 95px 95.7px, transparent 96.7px); transition: opacity .16s ease; }
.contour-target:hover::after, .contour-target:focus-within::after { opacity: .8; }

.atlas-preview { position: relative; display: block; height: 420px; overflow: hidden; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background-color: rgba(21,32,25,.025); background-image: linear-gradient(rgba(21,32,25,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(21,32,25,.05) 1px, transparent 1px); background-size: 72px 72px; }
.atlas-dot { position: absolute; width: 9px; height: 9px; border: 1px solid #68736c; border-radius: 50%; background: var(--bg); transform: translate(-50%,-50%); transition: transform .3s var(--ease), background .2s, border-color .2s; }
.atlas-dot.square { border-radius: 0; }
.atlas-dot.photo { background: transparent; }
.atlas-dot.cross { border: 0; background: transparent; }
.atlas-dot.cross::before, .atlas-dot.cross::after { content: ""; position: absolute; background: #68736c; }
.atlas-dot.cross::before { width: 13px; height: 1px; left: -2px; top: 4px; }
.atlas-dot.cross::after { width: 1px; height: 13px; left: 4px; top: -2px; }
.atlas-dot:hover { transform: translate(-50%,-50%) scale(1.7); background: var(--signal); border-color: var(--signal); }
.atlas-caption { position: absolute; left: 20px; bottom: 18px; color: var(--muted); font: 650 11px/1.5 var(--mono); }

.elsewhere-strip { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--line); }
.life-tile { min-height: 310px; padding: 24px; background: var(--bg); display: flex; flex-direction: column; justify-content: space-between; transition: background .25s var(--ease); }
.life-tile:hover { background: #efede5; }
.life-tile .kind { color: var(--muted); font: 650 12px/1 var(--mono); text-transform: uppercase; }
.life-tile h3 { margin: 0 0 14px; font-family: var(--serif); font-weight: 400; font-size: clamp(24px,2.6vw,38px); line-height: 1.05; }
.life-tile p { margin: 0; color: var(--soft); font-size: 15px; line-height: 1.62; }
.life-tile small { display: block; margin-top: 18px; color: var(--muted); font: 600 11px/1.35 var(--mono); text-transform: uppercase; }

.page-shell { min-height: 100svh; padding: 130px var(--pad) 100px; }
.page-title { display: grid; grid-template-columns: minmax(0,1fr) .42fr; gap: 60px; align-items: end; padding-bottom: 55px; border-bottom: 1px solid var(--line); }
.page-title h1 { margin: 20px 0 0; color: var(--fg); font-size: clamp(54px,8vw,118px); line-height: .86; letter-spacing: -.07em; font-weight: 620; }
.page-title .page-intro { max-width: 460px; color: var(--soft); font-family: var(--serif); font-size: clamp(18px,1.45vw,22px); line-height: 1.58; }

.filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 38px 0; }
.filters button { appearance: none; border: 1px solid var(--line); background: transparent; color: var(--muted); border-radius: 999px; padding: 9px 12px; cursor: pointer; font: 650 11px/1 var(--mono); text-transform: uppercase; }
.filters button:hover, .filters button.is-active { color: var(--fg); border-color: rgba(166,70,36,.45); background: var(--signal-soft); }

.note-row { width: 100%; grid-template-columns: 118px minmax(0,1fr) minmax(210px,.35fr) 28px; gap: 25px; padding: 27px 0; cursor: pointer; background: transparent; border-left: 0; border-right: 0; border-top: 0; color: inherit; text-align: left; }
.note-row time { color: var(--muted); font: 600 11px/1 var(--mono); }
.note-row h2 { margin: 0; font-size: clamp(20px,2vw,29px); font-weight: 530; line-height: 1.25; }
.note-row .note-meta { color: var(--muted); font: 600 11px/1.5 var(--mono); text-transform: uppercase; }
.note-row .arrow { color: var(--muted); font-size: 18px; }
.note-row:hover .arrow { color: var(--signal); }


.lab-list { margin-top: 50px; border-top: 1px solid var(--line); }
.lab-row { grid-template-columns: 115px minmax(240px,.8fr) minmax(280px,1fr) 115px; gap: 28px; padding: 31px 0; }
.lab-status, .lab-coord { color: var(--muted); font: 650 11px/1.4 var(--mono); text-transform: uppercase; }
.lab-coord { text-align: right; }
.lab-row h2 { margin: 0; font-size: clamp(21px,2vw,30px); line-height: 1.18; font-weight: 530; }
.lab-tags { margin-top: 9px; color: var(--muted); font: 650 11px/1.45 var(--mono); text-transform: uppercase; }
.lab-row p { margin: 0; color: var(--soft); font-size: 15px; line-height: 1.62; }

.elsewhere-grid { margin-top: 50px; display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.elsewhere-card { border-top: 1px solid var(--line); padding-top: 16px; }
.elsewhere-card .visual { height: 340px; margin-bottom: 18px; border: 1px solid var(--line); background: radial-gradient(circle at 30% 40%, rgba(166,70,36,.09), transparent 30%), linear-gradient(140deg, rgba(21,32,25,.055), transparent 55%); }
.elsewhere-card h2 { margin: 12px 0; font-family: var(--serif); font-size: clamp(28px,3vw,44px); line-height: 1.02; font-weight: 400; }
.elsewhere-card p { margin: 0; color: var(--soft); font-size: 15px; line-height: 1.62; }
.elsewhere-meta { margin-top: 16px !important; color: var(--muted) !important; font: 650 11px/1.35 var(--mono) !important; text-transform: uppercase; }

.atlas-controls { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin: 40px 0 18px; }
.projections { display: flex; flex-wrap: wrap; gap: 8px; }
.projections button { border: 1px solid rgba(241,239,231,.22); background: transparent; color: var(--atlas-muted); padding: 9px 13px; cursor: pointer; font: 650 11px/1 var(--mono); text-transform: uppercase; }
.projections button:hover, .projections button.is-active { border-color: var(--signal); color: var(--atlas-fg); background: rgba(166,70,36,.13); }
.atlas-status { color: var(--muted); font: 650 11px/1.4 var(--mono); text-transform: uppercase; }
.atlas-stage { position: relative; height: min(68vw,680px); min-height: 520px; overflow: hidden; border: 1px solid #2c3a31; background-color: var(--atlas-bg); background-image: linear-gradient(rgba(241,239,231,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(241,239,231,.04) 1px, transparent 1px); background-size: 80px 80px; }
.atlas-links { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.atlas-links line { stroke: rgba(241,239,231,.18); stroke-width: 1; vector-effect: non-scaling-stroke; }
.atlas-links line.signal { stroke: rgba(166,70,36,.72); }
.atlas-guides { position: absolute; inset: 0; pointer-events: none; }
.atlas-guide { position: absolute; transform: translate(-50%,-50%); color: #8e9a91; font: 650 11px/1 var(--mono); text-transform: uppercase; letter-spacing: .055em; }
.atlas-node { position: absolute; z-index: 4; width: 12px; height: 12px; padding: 0; border: 1px solid var(--atlas-fg); border-radius: 50%; background: var(--atlas-bg); transform: translate(-50%,-50%); cursor: crosshair; transition: left .78s var(--ease), top .78s var(--ease), transform .2s, background .2s, border-color .2s; }
.atlas-node[data-type="lab"] { border-radius: 0; }
.atlas-node[data-type="photo"] { background: transparent; }
.atlas-node[data-type="place"] { border: 0; background: transparent; }
.atlas-node[data-type="place"]::before, .atlas-node[data-type="place"]::after { content: ""; position: absolute; left: 50%; top: 50%; background: var(--atlas-fg); transform: translate(-50%,-50%); }
.atlas-node[data-type="place"]::before { width: 14px; height: 1px; }
.atlas-node[data-type="place"]::after { width: 1px; height: 14px; }
.atlas-node:hover, .atlas-node:focus, .atlas-node.is-active { transform: translate(-50%,-50%) scale(1.6); border-color: var(--signal); background: var(--signal); }
.atlas-node[data-type="place"]:hover, .atlas-node[data-type="place"]:focus, .atlas-node[data-type="place"].is-active { background: transparent; }
.atlas-node[data-type="place"]:hover::before, .atlas-node[data-type="place"]:hover::after, .atlas-node[data-type="place"].is-active::before, .atlas-node[data-type="place"].is-active::after { background: var(--signal); }
.atlas-workspace { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,320px); gap:14px; align-items:stretch; }
.atlas-tooltip { position:relative; z-index:5; display:grid; align-content:start; gap:8px; min-width:0; padding:22px; border:1px solid #2c3a31; background:rgba(19,29,23,.96); color:var(--atlas-fg); }
.atlas-tooltip span { color:var(--atlas-muted); font:700 11px/1.45 var(--mono); letter-spacing:.075em; text-transform:uppercase; }
.atlas-tooltip strong { color:var(--atlas-fg); font:500 clamp(20px,2vw,30px)/1.18 var(--serif); letter-spacing:-.02em; }
.atlas-tooltip small { color:#9eaaa1; font:600 11px/1.55 var(--mono); }
.atlas-open-record { min-height:44px; margin-top:12px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(209,99,57,.42); background:rgba(166,70,36,.10); color:#e0e5e1; font:700 11px/1 var(--mono); letter-spacing:.07em; text-transform:uppercase; }
.atlas-inspector-close { position:absolute; top:10px; right:10px; width:44px; height:44px; border:0; background:transparent; color:#758279; font-size:22px; cursor:pointer; }
.atlas-inspector-close:hover,.atlas-inspector-close:focus-visible { color:var(--signal); outline:none; }
.atlas-inspector.is-empty .atlas-inspector-close { visibility:hidden; }
.atlas-labels { position:absolute; inset:0; z-index:3; pointer-events:none; }
.atlas-node-label { position:absolute; padding:5px 7px; border:1px solid rgba(241,239,231,.10); background:rgba(11,17,14,.82); color:#9eaaa1; font:650 11px/1.25 var(--mono); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.atlas-node-label.is-selected { border-color:rgba(209,99,57,.45); color:#e1e6e2; }
.atlas-foot { display: grid; grid-template-columns: 1fr minmax(280px,.62fr); gap: 40px; align-items: end; margin-top: 30px; }
.atlas-philosophy { margin: 0; font: italic clamp(30px,4vw,58px)/1 var(--serif); }
.atlas-explain { margin: 0; color: var(--soft); font: 650 12px/1.65 var(--mono); }

.footer { position: relative; z-index: 2; padding: 45px var(--pad) 55px; border-top: 1px solid var(--line-soft); display: flex; justify-content: space-between; gap: 30px; align-items: end; }
.footer-brand { font-size: clamp(40px,6vw,88px); line-height: .9; letter-spacing: -.065em; font-weight: 620; }
.footer-meta { display: grid; gap: 9px; text-align: right; color: var(--muted); font: 650 11px/1.35 var(--mono); }
.footer-meta a:hover { color: var(--signal); }

html[lang="zh-CN"] body { letter-spacing: 0; }
html[lang="zh-CN"] .brand,
html[lang="zh-CN"] .display,
html[lang="zh-CN"] .footer-brand { font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; }
html[lang="zh-CN"] .nav-links a { font-size: 14px; font-weight: 560; letter-spacing: .08em; }
html[lang="zh-CN"] .hero-eyebrow { letter-spacing: .16em; }
html[lang="zh-CN"] .hero-tagline { font-style: normal; font-size: clamp(30px,3.65vw,58px); letter-spacing: .06em; }
html[lang="zh-CN"] .hero-lexicon { font-family: var(--serif); font-size: 14px; letter-spacing: .22em; }
html[lang="zh-CN"] .section-head h2 { font-family: var(--serif); font-weight: 500; letter-spacing: -.018em; }
html[lang="zh-CN"] .section-head p { letter-spacing: .015em; line-height: 1.72; }
html[lang="zh-CN"] .now-grid span,
html[lang="zh-CN"] .section-label,
html[lang="zh-CN"] .sheet-index,
html[lang="zh-CN"] .scale-ui,
html[lang="zh-CN"] .filters button { letter-spacing: .08em; }
html[lang="zh-CN"] .now-grid h3 { letter-spacing: .01em; line-height: 1.2; }
html[lang="zh-CN"] .now-grid p,
html[lang="zh-CN"] .lab-row p,
html[lang="zh-CN"] .elsewhere-card p,
html[lang="zh-CN"] .life-tile p { line-height: 1.82; }
html[lang="zh-CN"] .page-title h1 { font-family: var(--serif); font-weight: 520; letter-spacing: -.02em; }
html[lang="zh-CN"] .page-title .page-intro { line-height: 1.78; }
html[lang="zh-CN"] .atlas-philosophy { font-style: normal; letter-spacing: .025em; }

.lab-group-label { display: flex; align-items: center; gap: 18px; padding: 38px 0 10px; border-bottom: 1px solid var(--line-soft); color: var(--muted); font: 700 11px/1 var(--mono); letter-spacing: .10em; text-transform: uppercase; }
.lab-group-label:first-child { padding-top: 18px; }
.lab-group-label i { height: 1px; flex: 1; background: linear-gradient(90deg, var(--line), transparent); }

#contourCanvas { transition: opacity .35s var(--ease); }
#contourCanvas.is-paused { opacity: .20; }

.lab-row.is-instrument { grid-template-columns: 115px minmax(240px,.8fr) minmax(280px,1fr) 115px; }
.lab-row.is-instrument h2::after { content: " ·"; color: var(--signal); }
.lab-enter { align-self: center; justify-self: stretch; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0; border: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: transparent; color: var(--muted); cursor: pointer; font: 700 11px/1 var(--mono); letter-spacing: .075em; text-transform: uppercase; }
.lab-enter b { color: var(--signal); font-size: 15px; font-weight: 500; transition: transform .2s var(--ease); }
.lab-enter:hover, .lab-enter:focus-visible { color: var(--fg); border-color: rgba(166,70,36,.45); outline: none; }
.lab-enter:hover b, .lab-enter:focus-visible b { transform: translate(3px,-3px); }
.lab-principle { display: grid; grid-template-columns: minmax(170px,.28fr) minmax(0,1fr); gap: clamp(30px,5vw,76px); align-items: start; margin-top: 72px; padding-top: 18px; border-top: 1px solid var(--line); }
.lab-principle span { color: var(--muted); font: 650 11px/1.4 var(--mono); letter-spacing: .08em; }
.lab-principle p { margin: 0; color: var(--soft); font: italic clamp(21px,2.1vw,31px)/1.35 var(--serif); text-wrap: pretty; }

.instrument-dialog { width: min(1420px, calc(100vw - 34px)); height: min(900px, calc(100svh - 34px)); height: min(900px, calc(100dvh - 34px)); max-width: none; max-height: none; padding: 0; border: 1px solid rgba(241,239,231,.20); background: var(--atlas-bg); color: var(--atlas-fg); box-shadow: 0 35px 120px rgba(7,13,9,.42); overflow: hidden; }
.instrument-dialog::backdrop { background: rgba(17,25,20,.67); backdrop-filter: blur(7px); }
.instrument-shell { height: 100%; display: grid; grid-template-rows: auto auto minmax(0,1fr) auto; }
.instrument-head { display: flex; align-items: start; justify-content: space-between; gap: 30px; padding: 24px 28px 18px; border-bottom: 1px solid rgba(241,239,231,.12); }
.instrument-kicker { color: #89968c; font: 700 11px/1 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.instrument-head h2 { margin: 9px 0 0; color: var(--atlas-fg); font-size: clamp(30px,4vw,58px); line-height: .95; letter-spacing: -.045em; font-weight: 530; }
.instrument-close { width: 40px; height: 40px; flex: 0 0 40px; border: 1px solid rgba(241,239,231,.22); border-radius: 50%; background: transparent; color: var(--atlas-muted); cursor: pointer; font-size: 25px; line-height: 1; }
.instrument-close:hover, .instrument-close:focus-visible { color: var(--atlas-fg); border-color: var(--signal); outline: none; }
.instrument-meta { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 36px; padding: 15px 28px; border-bottom: 1px solid rgba(241,239,231,.08); }
.instrument-meta p { margin: 0; max-width: 840px; color: #c3cac4; font-size: 13px; line-height: 1.6; }
.instrument-meta span { color: #859188; font: 650 11px/1.5 var(--mono); text-transform: uppercase; text-align: right; }
.instrument-stage { position: relative; min-height: 0; overflow: hidden; background-color: #131d17; background-image: linear-gradient(rgba(241,239,231,.032) 1px, transparent 1px), linear-gradient(90deg, rgba(241,239,231,.032) 1px, transparent 1px); background-size: 72px 72px; }
.instrument-foot { display: flex; justify-content: space-between; gap: 30px; padding: 13px 28px; border-top: 1px solid rgba(241,239,231,.11); color: #829087; font: 650 11px/1.4 var(--mono); letter-spacing: .065em; text-transform: uppercase; }
.instrument-loading, .instrument-error { position: absolute; inset: 0; display: grid; place-content: center; gap: 16px; padding: 40px; text-align: center; color: var(--atlas-muted); }
.instrument-loading span { color: var(--signal); font: 400 42px/1 var(--serif); animation: instrument-pulse 1.6s ease-in-out infinite alternate; }
.instrument-loading strong, .instrument-error strong { color: var(--atlas-fg); font: 500 clamp(20px,2vw,30px)/1.3 var(--serif); }
.instrument-error p { max-width: 520px; margin: 0; font-size: 13px; line-height: 1.6; }
@keyframes instrument-pulse { to { opacity: .3; transform: translateY(-4px); } }

.orbit-upstream { display: inline-flex; margin-top: 22px; padding: 10px 0 8px; border-top: 1px solid rgba(241,239,231,.12); border-bottom: 1px solid rgba(241,239,231,.12); color: #bcc6be; font: 700 11px/1 var(--mono); letter-spacing: .075em; text-transform: uppercase; }
.orbit-upstream:hover, .orbit-upstream:focus-visible { color: var(--atlas-fg); border-color: var(--signal); outline: none; }
.earth-controls { position: relative; z-index: 2; min-height: 0; overflow-y: auto; padding: 24px; border-left: 1px solid rgba(241,239,231,.11); background: rgba(23,33,27,.72); backdrop-filter: blur(8px); }
.orbit-panel-label { margin-bottom: 18px; color: #869289; font: 700 11px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.earth-controls > strong { display: block; color: var(--atlas-fg); font: 500 clamp(20px,2vw,29px)/1.18 var(--serif); }
.earth-controls p { margin: 30px 0 0; color: #9eaaa1; font-size: 12px; line-height: 1.7; }

.earth-layout { height: 100%; display: grid; grid-template-columns: minmax(0,1fr) 320px; }
.earth-image-wrap { position: relative; min-height: 0; display: grid; place-items: center; overflow: hidden; padding: clamp(14px,2.4vw,28px); background: #0d1510; }
.earth-map-frame { position: relative; width: min(100%, 1120px); aspect-ratio: 2 / 1; overflow: hidden; background: #080d0a; border: 1px solid rgba(241,239,231,.10); }
.earth-map-frame img { display: block; width: 100%; height: 100%; object-fit: fill; transition: opacity .35s ease; }
.earth-map-frame img.is-loading { opacity: .32; }
.earth-grid { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(241,239,231,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(241,239,231,.07) 1px, transparent 1px); background-size: 12.5% 25%; mix-blend-mode: screen; opacity: .35; }
.earth-grid::before, .earth-grid::after { content: ""; position: absolute; background: rgba(166,70,36,.55); }
.earth-grid::before { left: 50%; top: 0; bottom: 0; width: 1px; }
.earth-grid::after { top: 50%; left: 0; right: 0; height: 1px; }
.earth-stamp { position: absolute; left: 18px; bottom: 16px; padding: 7px 9px; background: rgba(19,29,23,.72); color: #d6dbd6; font: 700 11px/1 var(--mono); letter-spacing: .07em; }
.earth-controls label { display: grid; gap: 8px; margin: 30px 0 10px; color: #7f8c83; font: 700 11px/1 var(--mono); letter-spacing: .065em; }
.earth-controls output { color: #e3e5e1; font-size: 12px; }
.earth-controls input[type="range"] { width: 100%; accent-color: var(--signal); }
.earth-controls button { width: 100%; margin-top: 17px; padding: 12px 14px; border: 1px solid rgba(241,239,231,.20); background: transparent; color: #c7cec8; cursor: pointer; font: 700 11px/1 var(--mono); letter-spacing: .075em; }
.earth-controls button:hover, .earth-controls button.is-active { color: var(--atlas-fg); border-color: var(--signal); background: rgba(166,70,36,.12); }
.source-line { display: block; margin-top: 24px; color: #718078; font: 650 11px/1.5 var(--mono); text-transform: uppercase; }

.flow-layout { position: relative; height: 100%; min-height: 0; background: #111b15; }
.flow-layout iframe { display: block; width: 100%; height: 100%; min-height: 0; border: 0; }
.flow-caption { position: absolute; z-index: 2; left: 22px; top: 22px; max-width: 390px; padding: 12px 14px; background: rgba(19,29,23,.84); border: 1px solid rgba(241,239,231,.13); pointer-events: none; }
.flow-caption span { display: block; margin-bottom: 7px; color: #89968d; font: 700 11px/1 var(--mono); letter-spacing: .08em; }
.flow-caption strong { color: var(--atlas-fg); font: 500 clamp(17px,1.5vw,23px)/1.25 var(--serif); }

.game-layout { height: 100%; min-height: 0; display: grid; grid-template-columns: minmax(0,1fr) 330px; }
.game-map-wrap { position: relative; min-width: 0; min-height: 0; display: grid; place-items: center; overflow: hidden; background: #101913; }
.game-map { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; cursor: crosshair; }
.game-sphere { fill: #142018; stroke: rgba(241,239,231,.16); stroke-width: 1; }
.game-graticule { fill: none; stroke: rgba(241,239,231,.075); stroke-width: .7; }
.game-countries path { fill: #1c2921; stroke: rgba(241,239,231,.20); stroke-width: .65; vector-effect: non-scaling-stroke; transition: fill .16s ease, stroke .16s ease, opacity .16s ease; }
.game-countries path:hover { fill: #29392f; stroke: rgba(241,239,231,.48); }
.game-countries path.is-wrong { fill: rgba(166,70,36,.32); stroke: #c75b33; }
.game-countries path.is-correct { fill: #c75b33; stroke: #f1efe7; }
.game-countries path.is-target { fill: rgba(166,70,36,.12); stroke: #c75b33; stroke-width: 1.8; stroke-dasharray: 4 3; }
.game-countries path.is-start { fill: #839087; stroke: #e8ebe6; }
.game-countries path.is-route { fill: #46574c; stroke: #d5dbd6; }
.game-countries path.is-current { fill: #c75b33; stroke: #f1efe7; }
.game-answer-line { fill: none; stroke: #c75b33; stroke-width: 1.5; stroke-dasharray: 5 5; vector-effect: non-scaling-stroke; }
.game-guess-point { fill: #101913; stroke: #f1efe7; stroke-width: 2; vector-effect: non-scaling-stroke; }
.game-target-point { fill: #c75b33; stroke: #f1efe7; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.game-panel { position: relative; z-index: 2; min-height: 0; overflow-y: auto; padding: 24px; border-left: 1px solid rgba(241,239,231,.11); background: rgba(23,33,27,.78); backdrop-filter: blur(8px); }
.game-panel > strong { display: block; color: var(--atlas-fg); font: 500 clamp(21px,2vw,30px)/1.18 var(--serif); }
.game-statline { display: flex; justify-content: space-between; gap: 14px; margin-top: 26px; padding: 11px 0; border-top: 1px solid rgba(241,239,231,.10); border-bottom: 1px solid rgba(241,239,231,.10); color: #87938a; font: 700 11px/1.35 var(--mono); letter-spacing: .06em; }
.game-statline b { color: #d7ddd8; font-weight: 700; }
.game-prompt { margin-top: 28px; color: var(--atlas-fg); font: 500 clamp(24px,2.7vw,39px)/1.08 var(--serif); }
.game-hint { margin: 18px 0 0; color: #9eaaa1; font-size: 12px; line-height: 1.72; }
.game-feedback { min-height: 45px; margin-top: 22px; padding-top: 13px; border-top: 1px solid rgba(241,239,231,.09); color: #d1d7d2; font: 700 11px/1.55 var(--mono); letter-spacing: .04em; }
.game-next { width: 100%; margin-top: 12px; padding: 12px 14px; border: 1px solid rgba(241,239,231,.20); background: transparent; color: #c7cec8; cursor: pointer; font: 700 11px/1 var(--mono); letter-spacing: .075em; }
.game-next:hover:not(:disabled), .game-next:focus-visible:not(:disabled) { color: var(--atlas-fg); border-color: var(--signal); background: rgba(166,70,36,.12); outline: none; }
.game-next:disabled { opacity: .38; cursor: default; }
.game-references { display: flex; flex-wrap: wrap; gap: 8px 12px; margin-top: 26px; color: #718078; font: 650 11px/1.5 var(--mono); }
.game-references span { width: 100%; text-transform: uppercase; }
.game-references a { color: #9eaaa1; border-bottom: 1px solid rgba(241,239,231,.12); }
.game-references a:hover, .game-references a:focus-visible { color: var(--atlas-fg); border-color: var(--signal); outline: none; }
html[lang="zh-CN"] .game-panel > strong, html[lang="zh-CN"] .game-prompt { font-style: normal; letter-spacing: .02em; }

.atlas-stage[data-mode="trace"] { background-size: 56px 56px; }
.atlas-stage[data-mode="trace"] .atlas-links line { stroke: rgba(166,70,36,.62); stroke-width: 1.4; stroke-dasharray: 4 6; animation: trace-drift 4.5s linear infinite; }
.atlas-stage[data-mode="trace"] .atlas-node { box-shadow: 0 0 0 4px rgba(166,70,36,.045); }
@keyframes trace-drift { to { stroke-dashoffset: -20; } }

html[lang="zh-CN"] .lab-principle p,
html[lang="zh-CN"] .orbit-panel > strong,
html[lang="zh-CN"] .earth-controls > strong,
html[lang="zh-CN"] .flow-caption strong { font-style: normal; letter-spacing: .02em; }

@media (min-width: 1260px) {
  .home-section, .page-shell { padding-left: max(var(--pad), calc(var(--rail-w) + 40px)); }
}
@media (max-width: 1259px) { .sheet-index { display: none; } }

@media (min-width: 981px) {
  .lab-principle p { white-space: nowrap; }
}
@media (max-width: 980px) {
.now-grid { grid-template-columns: repeat(2,1fr); }
  .now-grid article:nth-child(2) { border-right: 0; }
  .now-grid article:nth-child(3), .now-grid article:nth-child(4) { border-top: 1px solid var(--line); }
  .elsewhere-grid { grid-template-columns: 1fr 1fr; }
  .lab-row { grid-template-columns: 100px 1fr; }
  .lab-row p, .lab-coord { grid-column: 2; }
  .lab-coord { text-align: left; }
  .atlas-foot { grid-template-columns: 1fr; }
.lab-row.is-instrument { grid-template-columns: 100px 1fr; }
  .lab-row.is-instrument p, .lab-row.is-instrument .lab-enter { grid-column: 2; }
  .orbit-layout, .earth-layout, .game-layout { grid-template-columns: 1fr 280px; }
}
@media (max-width: 760px) {
.site-nav { height: 64px; padding: 0 18px; }
  .brand { font-size: 15px; }
  .nav-toggle { display: inline-flex; min-width: 52px; min-height: 44px; }
  .nav-links { display: none; }
  .scale-ui { top: 80px; right: 16px; }
  .hero.hero-centered { padding: 90px 20px 62px; }
  .hero-copy { width: 100%; transform: translateY(-2vh); }
  .hero-eyebrow { font-size: 11px; line-height: 1.45; margin-bottom: 22px; }
  .display { font-size: clamp(70px,24vw,118px); letter-spacing: -.075em; }
  .hero-tagline { margin-top: 34px; font-size: clamp(25px,7vw,34px); white-space: normal; }
  .hero-lexicon { max-width: 320px; flex-wrap: wrap; gap: 8px; font-size: 11px; }
  .hero-lexicon i { width: 11px; }
  .hero-edge { bottom: 22px; font-size: 11px; }
  .hero-edge-left { left: 18px; }
  .hero-edge-right { right: 18px; }
  .map-corners { inset: 78px 14px 44px; }
  .home-section, .page-shell { padding-left: 20px; padding-right: 20px; }
  .section-head { grid-template-columns: 1fr; gap: 20px; }
  .section-head p { max-width: none; font-size: 18px; }
  .now-grid { grid-template-columns: 1fr; }
  .now-grid article, .now-grid article + article { padding: 22px 0 30px; border-right: 0; border-top: 1px solid var(--line); }
  .now-grid article:first-child { border-top: 0; }
  .now-grid h3 { margin-top: 42px; }
  .preview-row { grid-template-columns: 1fr; gap: 9px; padding: 24px 0; }
  .preview-row small { text-align: left; }
  .page-title { grid-template-columns: 1fr; gap: 28px; }
  .page-title .page-intro { margin: 0; }
  .note-row { grid-template-columns: 1fr 28px; gap: 10px 18px; }
  .note-row time, .note-row h2, .note-row .note-meta { grid-column: 1; }
  .note-row .arrow { grid-column: 2; grid-row: 1 / 4; align-self: center; }
  .lab-row { grid-template-columns: 1fr; gap: 12px; }
  .lab-row p, .lab-coord { grid-column: 1; }
  .elsewhere-grid { grid-template-columns: 1fr; }
  .atlas-controls { align-items: flex-start; flex-direction: column; }
  .atlas-stage { min-height: 500px; height: 70vh; }
  .atlas-guide { font-size: 11px; }
  .footer { flex-direction: column; align-items: flex-start; }
  .footer-meta { text-align: left; }
.lab-row.is-instrument { grid-template-columns: 1fr; }
  .lab-row.is-instrument p, .lab-row.is-instrument .lab-enter { grid-column: 1; }
  .lab-enter { max-width: 160px; }
  .lab-principle { grid-template-columns: 1fr; gap: 18px; }
  .instrument-dialog { width: 100vw; height: 100svh; height: 100dvh; border: 0; }
  .instrument-head { padding: 18px; }
  .instrument-meta { grid-template-columns: 1fr; gap: 8px; padding: 12px 18px; }
  .instrument-meta span { text-align: left; }
  .instrument-foot { padding: 11px 18px; flex-direction: column; gap: 4px; }
  .orbit-layout, .earth-layout, .game-layout { grid-template-columns: 1fr; overflow: auto; }
  .game-layout { grid-template-rows: auto auto; height: 100%; min-height: 0; overflow-y: auto; }
  .earth-layout { grid-template-rows: auto auto; height: 100%; min-height: 0; overflow-y: auto; }
  .earth-image-wrap { aspect-ratio: 2 / 1; }
  .orbit-panel, .earth-controls, .game-panel { border-left: 0; border-top: 1px solid rgba(241,239,231,.11); padding: 18px; }
  .orbit-globe { min-height: 390px; }
  .earth-image-wrap { min-height: 0; }
  .game-map-wrap { min-height: 0; aspect-ratio: 1000 / 520; }
  .game-map { min-height: 0; width: 100%; height: 100%; }
        .flow-layout, .flow-layout iframe { min-height: 100%; }
}
@media (max-width: 480px) {
  .hero-edge-right { display: none; }
  .hero-lexicon { max-width: 290px; }
  .scale-ui > span { font-size: 11px; }
  .scale-ui > strong { font-size: 12px; }
  .scale-ui > em { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
.instrument-loading span, .atlas-stage[data-mode="trace"] .atlas-links line { animation: none; }
}




.home-project-grid, .project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin-top: 28px; }
.lab-group-block { margin-top: 42px; }
.project-card { position: relative; border: 1px solid var(--line); border-radius: 26px; overflow: hidden; background: linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,.08)); box-shadow: 0 18px 60px rgba(31,34,27,.08); transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.project-card:hover { transform: translateY(-4px); border-color: rgba(166,70,36,.32); box-shadow: 0 26px 72px rgba(31,34,27,.12); }
.project-card-home { min-height: 100%; }
.project-card.is-actionable { cursor: default; }
.project-visual { position: relative; aspect-ratio: 16 / 9; background: radial-gradient(circle at 52% 46%, rgba(26,36,30,.34), transparent 48%), linear-gradient(180deg, rgba(20,28,23,.94), rgba(10,14,12,.98)); border-bottom: 1px solid rgba(241,239,231,.08); overflow: hidden; }
.project-copy { display: grid; gap: 14px; padding: 22px 24px 24px; }
.project-meta { display: flex; justify-content: space-between; gap: 14px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.project-card h2, .project-card h3 { margin: 0; font-size: clamp(22px, 2.05vw, 42px); line-height: 1.1; font-weight: 560; }
.project-card p { margin: 0; color: var(--soft); font-size: 15.5px; line-height: 1.7; }
.project-foot { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.project-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.project-cta { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 14px; border-radius: 999px; border: 1px solid rgba(166,70,36,.24); background: rgba(166,70,36,.06); color: var(--ink); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; }
.project-link { border: 1px dashed rgba(21,32,25,.22); background: rgba(21,32,25,.03); color: var(--soft); }
.project-cta b { font-size: 14px; line-height: 1; }
.preview-art { position: absolute; inset: 0; }
.preview-art::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(241,239,231,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(241,239,231,.05) 1px, transparent 1px); background-size: 58px 58px; opacity: .45; }
.preview-art::after { content: ''; position: absolute; inset: 0; background-image: radial-gradient(110% 90% at 18% 20%, rgba(166,70,36,.14), transparent 42%), radial-gradient(120% 95% at 86% 8%, rgba(255,255,255,.06), transparent 36%); }
.preview-stamp { position: absolute; left: 18px; bottom: 14px; z-index: 2; color: rgba(241,239,231,.82); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; font-weight: 500; }
.preview-terrain .contour, .preview-flow .stream, .preview-orbit .orbit-arc { position: absolute; border: 1px solid rgba(241,239,231,.38); border-radius: 50%; }
.preview-terrain .c1 { inset: 14% 8% 28% 6%; opacity: .34; } .preview-terrain .c2 { inset: 22% 20% 12% 14%; opacity: .38; } .preview-terrain .c3 { inset: 40% 34% 18% 24%; opacity: .44; } .preview-terrain .c4 { inset: 58% 10% 6% 46%; opacity: .24; }
.preview-evidence .node, .preview-pulse .quake, .preview-game .target-dot { position: absolute; width: 11px; height: 11px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 4px rgba(166,70,36,.16); z-index: 2; }
.preview-evidence .n1 { left: 18%; top: 26%; } .preview-evidence .n2 { left: 42%; top: 44%; background: rgba(241,239,231,.86); box-shadow: 0 0 0 4px rgba(241,239,231,.10); } .preview-evidence .n3 { left: 63%; top: 28%; } .preview-evidence .n4 { left: 74%; top: 64%; background: rgba(234,193,83,.95); box-shadow: 0 0 0 4px rgba(234,193,83,.14); }
.preview-evidence .edge { position: absolute; border-top: 1px solid rgba(241,239,231,.42); transform-origin: left center; }
.preview-evidence .e1 { left: 19%; top: 29%; width: 28%; transform: rotate(22deg); } .preview-evidence .e2 { left: 43%; top: 46%; width: 22%; transform: rotate(-26deg); } .preview-evidence .e3 { left: 43%; top: 46%; width: 38%; transform: rotate(26deg); }
.preview-orbit .preview-orbit .orbit-arc { border-color: rgba(241,239,231,.58); border-width: 1px; background: transparent; }
.preview-orbit .orbit-arc-a { inset: 10% 24% 18% 22%; border-left-color: transparent; border-bottom-color: transparent; transform: rotate(-18deg); } .preview-orbit .orbit-arc-b { inset: 24% 18% 10% 38%; border-right-color: transparent; border-top-color: transparent; transform: rotate(10deg); } .preview-orbit .orbit-arc-c { inset: 34% 42% 14% 18%; border-left-color: transparent; border-top-color: transparent; transform: rotate(28deg); }
.preview-earth .map.mass, .preview-pulse .map.mass, .preview-world .map.mass, .preview-game .map.mass { position: absolute; display: block; background: rgba(184,189,182,.52); filter: blur(.2px); }
.preview-earth .a, .preview-pulse .a, .preview-world .a, .preview-game .a { left: 6%; top: 18%; width: 33%; height: 42%; clip-path: polygon(4% 28%, 22% 8%, 46% 6%, 66% 22%, 74% 44%, 56% 66%, 34% 88%, 6% 74%); }
.preview-earth .b, .preview-pulse .b, .preview-world .b, .preview-game .b { left: 49%; top: 14%; width: 39%; height: 46%; clip-path: polygon(18% 10%, 42% 0, 74% 18%, 92% 46%, 74% 74%, 42% 88%, 8% 56%); }
.preview-earth .c, .preview-pulse .c, .preview-world .c, .preview-game .c { left: 63%; top: 57%; width: 20%; height: 14%; clip-path: polygon(14% 12%, 82% 0, 98% 44%, 76% 96%, 18% 78%, 0 42%); }
.preview-earth .marker, .preview-pulse .quake { position: absolute; border-radius: 50%; }
.preview-earth .m1 { left: 23%; top: 35%; width: 8px; height: 8px; background: var(--signal); box-shadow: 0 0 0 3px rgba(166,70,36,.18); } .preview-earth .m2 { left: 58%; top: 26%; width: 7px; height: 7px; background: rgba(241,239,231,.84); box-shadow: 0 0 0 3px rgba(241,239,231,.12); } .preview-earth .m3 { left: 70%; top: 52%; width: 7px; height: 7px; background: rgba(234,193,83,.92); box-shadow: 0 0 0 3px rgba(234,193,83,.12); }
.preview-flow .stream { inset: auto; border: none; width: 34%; height: 24%; border-top: 1px solid rgba(241,239,231,.56); border-radius: 50%; }
.preview-flow .s1 { left: 6%; top: 28%; transform: rotate(-8deg); } .preview-flow .s2 { left: 28%; top: 42%; transform: rotate(12deg); } .preview-flow .s3 { left: 52%; top: 26%; transform: rotate(-16deg); } .preview-flow .s4 { left: 58%; top: 56%; transform: rotate(8deg); }
.preview-pulse .q1 { left: 18%; top: 38%; } .preview-pulse .q2 { left: 56%; top: 28%; width: 13px; height: 13px; } .preview-pulse .q3 { left: 73%; top: 55%; width: 9px; height: 9px; background: rgba(241,239,231,.86); box-shadow: 0 0 0 4px rgba(241,239,231,.10); } .preview-pulse .q4 { left: 62%; top: 34%; width: 7px; height: 7px; }
.preview-figure { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 18px; }
.preview-figure .figure-panel { position: relative; border-radius: 18px; overflow: hidden; background: linear-gradient(180deg, rgba(241,239,231,.18), rgba(241,239,231,.06)); }
.preview-figure .raster::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 32% 38%, rgba(241,239,231,.32), transparent 26%), radial-gradient(circle at 63% 56%, rgba(166,70,36,.34), transparent 32%), radial-gradient(circle at 48% 58%, rgba(241,239,231,.22), transparent 46%), linear-gradient(180deg, rgba(19,26,22,.82), rgba(10,14,11,.98)); filter: blur(.2px); }
.preview-figure .vector::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(19,26,22,.82), rgba(10,14,11,.98)); }
.preview-figure .vector::after { content: ''; position: absolute; inset: 12% 8%; border-radius: 20px; background-image: radial-gradient(circle at 58% 46%, rgba(166,70,36,.18) 0 22%, transparent 23%), linear-gradient(transparent 0 18%, rgba(241,239,231,.52) 18% 19%, transparent 19% 34%, rgba(241,239,231,.48) 34% 35%, transparent 35% 54%, rgba(166,70,36,.78) 54% 55%, transparent 55% 76%, rgba(241,239,231,.42) 76% 77%, transparent 77%); }
.preview-world .graticule { position: absolute; inset: 10% 10%; border: 1px solid rgba(241,239,231,.16); }
.preview-world .graticule::before, .preview-world .graticule::after { content: ''; position: absolute; background: rgba(241,239,231,.14); }
.preview-world .graticule::before { left: 50%; top: 0; bottom: 0; width: 1px; } .preview-world .graticule::after { top: 50%; left: 0; right: 0; height: 1px; }
.preview-game .crosshair, .preview-game .zone-fill, .preview-game .route-line { position: absolute; }
.preview-game .target-dot { left: 59%; top: 28%; }
.preview-game .crosshair { left: 55%; top: 24%; width: 34px; height: 34px; border: 1px solid rgba(241,239,231,.58); border-radius: 50%; }
.preview-zone .zone-fill { left: 47%; top: 19%; width: 18%; height: 28%; background: rgba(166,70,36,.28); clip-path: polygon(16% 10%, 88% 6%, 98% 54%, 62% 96%, 12% 70%, 2% 34%); }
.preview-path .route-line { left: 30%; top: 28%; width: 42%; height: 30%; border-left: 2px solid rgba(166,70,36,.9); border-bottom: 2px solid rgba(166,70,36,.9); border-right: 2px solid rgba(166,70,36,.9); transform: skewX(-16deg) rotate(-7deg); }
.pulse-layout, .figure-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(260px, .7fr); gap: 18px; height: 100%; min-height: 0; }
.pulse-map-wrap, .figure-stage { position: relative; min-height: 0; border: 1px solid rgba(241,239,231,.12); border-radius: 22px; overflow: hidden; background: linear-gradient(180deg, rgba(14,19,16,.98), rgba(8,11,9,.98)); }
.pulse-map { width: 100%; height: 100%; display: block; }
.pulse-panel, .figure-control { display: grid; align-content: start; gap: 16px; min-height: 0; overflow-y: auto; padding: 18px 20px; border: 1px solid rgba(241,239,231,.12); border-radius: 22px; background: rgba(13,18,15,.92); }
.pulse-panel strong { font-size: 22px; line-height: 1.2; font-weight: 550; }
.pulse-panel dl, .figure-control label { display: grid; gap: 10px; }
.pulse-panel dl div { display: grid; gap: 4px; padding: 10px 0; border-top: 1px solid rgba(241,239,231,.08); }
.pulse-panel dt, .figure-control label span { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: rgba(241,239,231,.58); }
.pulse-panel dd { margin: 0; font-size: 14px; color: rgba(241,239,231,.96); }
.pulse-panel p, .figure-control p { margin: 0; color: rgba(241,239,231,.74); font-size: 14px; line-height: 1.7; }
.figure-stage { display: grid; place-items: center; }
.figure-canvas, .figure-svg { position: absolute; inset: 24px; width: calc(100% - 48px); height: calc(100% - 48px); border-radius: 20px; }
.figure-svg { pointer-events: none; }
.figure-control input[type="range"] { width: 100%; accent-color: var(--signal); }
@media (max-width: 1100px) { .home-project-grid, .project-grid, .pulse-layout, .figure-layout { grid-template-columns: 1fr; } .pulse-layout, .figure-layout { height: 100%; min-height: 0; overflow-y: auto; grid-template-rows: auto auto; } .pulse-map-wrap, .figure-stage { min-height: 420px; } }
@media (max-width: 760px) { .project-copy { padding: 18px; } .project-card p { font-size: 14.5px; } .project-meta { flex-direction: column; gap: 6px; } .project-foot { align-items: flex-start; } .figure-canvas, .figure-svg { inset: 16px; width: calc(100% - 32px); height: calc(100% - 32px); } .pulse-map-wrap, .figure-stage { min-height: 420px; } }


.project-visual { isolation:isolate; }
.project-visual::after { content:''; position:absolute; inset:0; pointer-events:none; z-index:8; background:linear-gradient(180deg, transparent 58%, rgba(4,7,5,.46)); }
.project-probe { position:absolute; inset:0; z-index:9; opacity:0; pointer-events:none; transition:opacity .18s ease; }
.project-card:hover .project-probe { opacity:1; }
.project-probe i, .project-probe b { position:absolute; display:block; background:rgba(241,239,231,.34); }
.project-probe i { left:var(--probe-x,50%); top:0; bottom:0; width:1px; }
.project-probe b { top:var(--probe-y,50%); left:0; right:0; height:1px; }
.project-probe::before { content:''; position:absolute; left:var(--probe-x,50%); top:var(--probe-y,50%); width:28px; height:28px; border:1px solid rgba(166,70,36,.78); border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 0 0 5px rgba(166,70,36,.07); }
.project-probe span { position:absolute; left:min(calc(var(--probe-x,50%) + 12px), calc(100% - 98px)); top:min(calc(var(--probe-y,50%) + 10px), calc(100% - 26px)); padding:3px 6px; background:rgba(8,12,10,.72); color:rgba(241,239,231,.78); font-size:11px; letter-spacing:.12em; white-space:nowrap; }
.live-earth-preview { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; opacity:.62; }
.project-visual-earth .preview-art::before { z-index:2; }
.project-visual-earth .preview-art::after { z-index:3; }
.live-pulse-layer { position:absolute; inset:0; z-index:4; pointer-events:none; }
.live-pulse-dot { position:absolute; display:block; border-radius:50%; background:rgba(166,70,36,.88); border:1px solid rgba(241,239,231,.66); transform:translate(-50%,-50%); box-shadow:0 0 0 2px rgba(166,70,36,.10); }
.orbit-live-point { --phase:0deg; --delay:0s; position:absolute; left:50%; top:48%; width:5px; height:5px; border-radius:50%; background:rgba(241,239,231,.86); z-index:5; transform-origin:0 0; animation:orbit-preview 8s linear infinite; animation-delay:var(--delay); }
@keyframes orbit-preview { from{ transform:rotate(var(--phase)) translateX(112px) scale(.8); opacity:.32;} 45%{opacity:1;} to{ transform:rotate(calc(var(--phase) + 360deg)) translateX(112px) scale(.8); opacity:.32;} }
.project-card .preview-stamp { z-index:7; max-width:calc(100% - 36px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.world-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(270px,.62fr); gap:18px; height:100%; min-height:0; }
.world-map-wrap { position:relative; min-height:0; overflow:hidden; border:1px solid rgba(241,239,231,.12); border-radius:22px; background:rgba(8,12,10,.98); cursor:crosshair; }
.world-map { width:100%; height:100%; display:block; }
.world-panel { display:grid; align-content:start; gap:16px; min-height:0; overflow-y:auto; padding:18px 20px; border:1px solid rgba(241,239,231,.12); border-radius:22px; background:rgba(13,18,15,.92); }
.world-controls { display:grid; grid-template-columns:1fr; gap:8px; }
.world-controls button { min-height:42px; border:1px solid rgba(241,239,231,.14); border-radius:999px; background:transparent; color:rgba(241,239,231,.78); font-size:11px; letter-spacing:.14em; }
.world-controls button.is-active { border-color:rgba(166,70,36,.68); background:rgba(166,70,36,.12); color:#f1efe7; }
.world-panel dl { display:grid; gap:0; margin:0; }
.world-panel dl div { display:grid; gap:4px; padding:11px 0; border-top:1px solid rgba(241,239,231,.08); }
.world-panel dt { font-size:11px; letter-spacing:.14em; color:rgba(241,239,231,.54); }
.world-panel dd { margin:0; color:rgba(241,239,231,.92); font-size:13px; line-height:1.5; }
.world-panel p { margin:0; color:rgba(241,239,231,.70); font-size:14px; line-height:1.7; }
.world-hover { position:absolute; opacity:0; pointer-events:none; z-index:8; padding:5px 8px; border:1px solid rgba(241,239,231,.14); border-radius:999px; background:rgba(7,10,8,.88); color:#f1efe7; font-size:11px; letter-spacing:.08em; transition:opacity .1s; }
@media(max-width:1100px){ .world-layout{grid-template-columns:1fr; height:100%; min-height:0; overflow-y:auto; grid-template-rows:auto auto;} .world-map-wrap{min-height:460px;} }
@media(max-width:760px){ .world-map-wrap{min-height:380px;} .project-probe{display:none;} }
@media(prefers-reduced-motion:reduce){ .orbit-live-point{animation:none;} }

.orbital-threshold {
  position: relative;
  z-index: 4;
  min-height: auto;
  padding: 18px var(--pad) 20px;
  scroll-margin-top: 72px;
  background: #0d1410;
  color: var(--atlas-fg);
  overflow: hidden;
  border-top: 1px solid rgba(21,32,25,.16);
  border-bottom: 1px solid rgba(21,32,25,.16);
}
.orbital-shell {
  width: min(1540px, 100%);
  height: clamp(560px, calc(100svh - 112px), 780px);
  min-height: 0;
  margin: 0 auto;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto auto;
  border: 1px solid rgba(241,239,231,.13);
  border-radius: clamp(24px, 3vw, 44px);
  overflow: hidden;
  background:
    radial-gradient(circle at 51% 47%, rgba(77,104,87,.12), transparent 34%),
    #0b110e;
  box-shadow: 0 34px 110px rgba(4,9,6,.26);
}
.orbital-stage { position: relative; min-height: 0; overflow: hidden; cursor: crosshair; }
.orbital-threshold-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; outline: none; touch-action: none; }
.orbital-grid {
  position: absolute; inset: 0; pointer-events: none; opacity: .30;
  background-image: linear-gradient(rgba(241,239,231,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(241,239,231,.035) 1px, transparent 1px);
  background-size: 9.09% 16.66%;
  mask-image: radial-gradient(ellipse at 50% 50%, #000 0 58%, transparent 94%);
}
.orbital-grid::before, .orbital-grid::after { content: ""; position: absolute; background: rgba(241,239,231,.12); }
.orbital-grid::before { left: 50%; top: 0; bottom: 0; width: 1px; }
.orbital-grid::after { top: 50%; left: 0; right: 0; height: 1px; }
.orbital-status, .orbital-datum, .orbital-source {
  color: rgba(214,222,216,.58);
  font: 650 11px/1.4 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.orbital-status { position: absolute; left: 22px; top: 20px; display: flex; align-items: center; gap: 8px; }
.orbital-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; border: 1px solid currentColor; }
.orbital-status.is-live::before { background: var(--signal); border-color: var(--signal); box-shadow: 0 0 0 5px rgba(166,70,36,.10); }
.orbital-datum { position: absolute; right: 22px; top: 20px; }
.orbital-hover {
  position: absolute; z-index: 8; left: 50%; top: 28px; transform: translateX(-50%);
  min-width: 240px; padding: 11px 13px; border: 1px solid rgba(241,239,231,.13);
  background: rgba(10,16,12,.76); backdrop-filter: blur(12px); pointer-events: none;
}
.orbital-hover strong, .orbital-hover span { display: block; }
.orbital-hover strong { color: var(--atlas-fg); font: 650 12px/1.4 var(--sans); }
.orbital-hover span { margin-top: 4px; color: rgba(209,218,211,.62); font: 600 11px/1.3 var(--mono); }
.orbital-selected {
  position: absolute; left: 22px; bottom: 22px; width: min(430px, calc(100% - 44px));
  display: grid; gap: 6px; padding-left: 15px; border-left: 1px solid rgba(241,239,231,.16);
  transition: border-color .25s ease;
}
.orbital-selected.has-selection { border-left-color: var(--signal); }
.orbital-selected > span { color: #809087; font: 700 11px/1 var(--mono); letter-spacing: .11em; }
.orbital-selected strong { color: var(--atlas-fg); font: 500 clamp(18px, 1.8vw, 27px)/1.15 var(--serif); }
.orbital-selected small, .orbital-selected em { color: #9aa79e; font: 650 11px/1.45 var(--mono); font-style: normal; letter-spacing: .035em; }
.orbital-selected em { color: #bd7659; }
.orbital-trace-key { position: absolute; right: 22px; bottom: 22px; display: flex; flex-direction: column; gap: 8px; align-items: flex-end; }
.orbital-trace-key span, .orbital-trace-legend span { display: flex; align-items: center; gap: 8px; color: #89968d; font: 650 11px/1.2 var(--mono); letter-spacing: .05em; }
.trace-orbit, .trace-ground { display: inline-block; width: 26px; height: 1px; }
.trace-orbit { background: #d16339; }
.trace-ground { background: rgba(241,239,231,.52); }
.orbital-copy {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: end;
  padding: clamp(16px,2vw,24px) clamp(22px,2.5vw,36px);
  border-top: 1px solid rgba(241,239,231,.10);
  background: rgba(16,24,19,.74);
}
.orbital-eyebrow { margin: 0 0 8px; color: #849188; font: 700 11px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.orbital-copy h2 { margin: 0; max-width: none; color: var(--atlas-fg); font: 400 clamp(30px,3.6vw,54px)/.98 var(--serif); letter-spacing: -.04em; text-wrap: pretty; }
.orbital-copy p:not(.orbital-eyebrow) { margin: 8px 0 0; color: #9ca8a0; font-size: 14px; line-height: 1.6; }
.orbital-copy > a { padding: 12px 0 9px; border-top: 1px solid rgba(241,239,231,.18); border-bottom: 1px solid rgba(241,239,231,.18); color: #cbd2cc; font: 700 11px/1 var(--mono); letter-spacing: .08em; white-space: nowrap; }
.orbital-copy > a:hover, .orbital-copy > a:focus-visible { color: var(--atlas-fg); border-color: var(--signal); outline: none; }
.orbital-source { padding: 8px clamp(22px,2.5vw,36px) 9px; border-top: 1px solid rgba(241,239,231,.065); color: rgba(180,191,183,.42); font-size: 11px; }

body.orbital-active .site-nav {
  color: var(--atlas-fg);
  border-bottom-color: rgba(241,239,231,.08);
  background: linear-gradient(to bottom, rgba(11,17,14,.96), rgba(11,17,14,.88), rgba(11,17,14,.58));
}
body.orbital-active .brand, body.orbital-active .nav-links a { color: #cbd3cc; }
body.orbital-active .nav-links a:hover, body.orbital-active .nav-links a[aria-current="page"] { color: var(--atlas-fg); }
body.orbital-active .lang-switch { color: #8f9c93; border-left-color: rgba(241,239,231,.14); }
body.orbital-active .brand-mark { border-color: #9da9a0; }
body.orbital-active .brand-mark::before, body.orbital-active .brand-mark::after { background: #9da9a0; }
body.orbital-active .sheet-index { color: #89968d; }
body.orbital-active .sheet-index::before { background: rgba(241,239,231,.15); }
body.orbital-active .sheet-index-title, body.orbital-active .sheet-index-foot, body.orbital-active .sheet-index a span { color: #78877e; }
body.orbital-active .sheet-index a::before { background: #0d1410; border-color: #738178; }
body.orbital-active .sheet-index a:hover, body.orbital-active .sheet-index a[aria-current="location"] { color: var(--atlas-fg); }
body.orbital-active .scale-ui > span { color: #7e8b82; }
body.orbital-active .scale-ui > strong { color: #d7ddd8; }
body.orbital-active .scale-ui > em { color: #d16339; }
body.orbital-active .scale-legend { border-color: rgba(241,239,231,.12); background: rgba(11,17,14,.96); box-shadow: 0 18px 50px rgba(0,0,0,.28); }
body.orbital-active .scale-legend i { border-bottom-color: rgba(241,239,231,.08); }
body.orbital-active .scale-legend b { color: #d7ddd8; }
body.orbital-active .scale-legend small { color: #7e8b82; }

.orbital-lab { height: 100%; display: grid; grid-template-columns: minmax(0,1fr) 330px; }
.orbital-lab-stage { position: relative; min-height: 0; overflow: hidden; background: #0b110e; cursor: crosshair; }
.orbital-lab-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; outline: none; touch-action: none; }
.orbital-lab-status { position: absolute; left: 18px; top: 18px; color: #849188; font: 700 11px/1 var(--mono); letter-spacing: .075em; }
.orbital-lab-hover { position: absolute; left: 50%; top: 18px; transform: translateX(-50%); padding: 9px 11px; border: 1px solid rgba(241,239,231,.13); background: rgba(10,16,12,.76); color: #cdd4ce; font: 650 11px/1.3 var(--mono); pointer-events: none; }
.orbital-lab-panel { position: relative; z-index: 2; min-height: 0; overflow-y: auto; padding: 24px; border-left: 1px solid rgba(241,239,231,.11); background: rgba(23,33,27,.78); backdrop-filter: blur(8px); }
.orbital-lab-panel > strong { display: block; color: var(--atlas-fg); font: 500 clamp(20px,2vw,29px)/1.18 var(--serif); }
.orbital-lab-panel dl { margin: 26px 0 0; }
.orbital-lab-panel dl div { display: grid; grid-template-columns: 85px 1fr; gap: 14px; padding: 11px 0; border-top: 1px solid rgba(241,239,231,.09); }
.orbital-lab-panel dt { color: #79877e; font: 700 11px/1.45 var(--mono); letter-spacing: .065em; }
.orbital-lab-panel dd { margin: 0; color: #d7dbd7; font: 600 11px/1.45 var(--mono); text-align: right; }
.orbital-lab-panel p { margin: 26px 0 0; color: #9eaaa1; font-size: 12px; line-height: 1.72; }
.orbital-trace-legend { display: grid; gap: 8px; margin-top: 24px; padding-top: 15px; border-top: 1px solid rgba(241,239,231,.09); }

@media (max-width: 980px) {
  .orbital-threshold { padding: 16px; }
  .orbital-shell { height: auto; min-height: 0; grid-template-rows: clamp(400px, 58svh, 560px) auto auto; }
  .orbital-stage { min-height: 0; }
  .orbital-copy { grid-template-columns: 1fr; align-items: start; }
  .orbital-copy > a { justify-self: start; }
  .orbital-lab { grid-template-columns: 1fr; grid-template-rows: minmax(430px,1fr) auto; }
  .orbital-lab-panel { border-left: 0; border-top: 1px solid rgba(241,239,231,.11); }
}
@media (max-width: 760px) {
  .orbital-threshold { min-height: auto; padding: 12px; }
  .orbital-shell { height: auto; grid-template-rows: clamp(360px, 54svh, 500px) auto auto; border-radius: 22px; }
  .orbital-stage { min-height: 0; }
  .orbital-status { left: 14px; top: 14px; }
  .orbital-datum { right: 14px; top: 14px; max-width: 45%; text-align: right; }
  .orbital-hover { top: 54px; min-width: 190px; }
  .orbital-selected { left: 14px; bottom: 14px; width: calc(100% - 28px); }
  .orbital-trace-key { display: flex; right: 14px; top: 54px; bottom: auto; gap: 6px; }
  .orbital-trace-key span { font-size: 11px; }
  .orbital-trace-key .trace-orbit, .orbital-trace-key .trace-ground { width: 18px; }
  .orbital-copy { padding: 18px 20px 20px; gap: 14px; }
  .orbital-copy h2 { font-size: clamp(28px, 8.4vw, 44px); }
  .orbital-copy p:not(.orbital-eyebrow) { margin-top: 7px; }
  .orbital-source { padding: 8px 20px 10px; font-size: 11px; }
  body.orbital-active .nav-toggle { border-color: rgba(241,239,231,.16); background: rgba(11,17,14,.84); color: var(--atlas-fg); }
}
.orbital-threshold + .home-section { border-top: 0; }
.orbital-stage::before {
  content: ""; position: absolute; z-index: 0; left: 50%; top: 47%; width: min(42vw, 480px); aspect-ratio: 1;
  transform: translate(-50%,-50%); border-radius: 50%; opacity: .9;
  background: radial-gradient(circle at 34% 28%, #26372d 0 8%, #17231d 37%, #0b100d 72%);
  box-shadow: 0 0 0 1px rgba(241,239,231,.09), 0 0 90px rgba(164,184,171,.08);
  transition: opacity .35s ease;
}
.orbital-stage::after {
  content: ""; position: absolute; z-index: 0; left: 50%; top: 47%; width: min(64vw, 760px); height: min(29vw, 330px);
  transform: translate(-50%,-50%) rotate(-13deg); border: 1px solid rgba(241,239,231,.22); border-radius: 50%; opacity: .7;
  transition: opacity .35s ease;
}
.orbital-stage.has-webgl::before, .orbital-stage.has-webgl::after { opacity: 0; }
.orbital-threshold-canvas { z-index: 1; }
.orbital-grid { z-index: 2; }
.orbital-status, .orbital-datum, .orbital-selected, .orbital-trace-key { z-index: 4; }


@media (max-width: 760px) {
  :root { --pad: 20px; }
  body { -webkit-text-size-adjust: 100%; }
  .site-nav { padding-left: max(18px, env(safe-area-inset-left)); padding-right: max(18px, env(safe-area-inset-right)); }
  .nav-toggle { min-width: 48px; min-height: 44px; }
  .nav-links {
    inset: 64px 0 0;
    min-height: calc(100svh - 64px);
    align-content: start;
    padding: 18px max(22px, env(safe-area-inset-right)) calc(32px + env(safe-area-inset-bottom)) max(22px, env(safe-area-inset-left));
    border-bottom: 0;
  }
  .nav-links a, .nav-links .lang-switch { min-height: 48px; display: flex; align-items: center; }
  body.orbital-active .nav-links { background: rgba(11,17,14,.985); border-color: rgba(241,239,231,.10); }
  body.orbital-active .nav-links a { border-bottom-color: rgba(241,239,231,.09); color: #cbd3cc; }
  body.orbital-active .nav-links .lang-switch { color: #8f9c93; }

  .scale-ui {
    top: 76px; right: 12px; padding: 8px 10px; border: 1px solid rgba(21,32,25,.10);
    border-radius: 14px; background: rgba(244,242,234,.88); backdrop-filter: blur(10px);
  }
  .scale-ui > span { display: none; }
  .scale-ui > strong, .scale-ui > em { display: block; }
  body.orbital-active .scale-ui { border-color: rgba(241,239,231,.10); background: rgba(11,17,14,.76); }

  .orbital-threshold { padding: 0; }
  .orbital-shell { border: 0; border-radius: 0; height: auto; min-height: 0; grid-template-rows: clamp(360px, 54svh, 500px) auto auto; }
  .orbital-stage { min-height: 0; }
  .orbital-status { max-width: 56%; line-height: 1.5; }
  .orbital-datum { max-width: 40%; }
  .orbital-hover { display: none !important; }
  .orbital-selected { bottom: 18px; padding: 12px 0 0 13px; background: linear-gradient(90deg, rgba(11,17,14,.68), transparent); }
  .orbital-selected strong { font-size: clamp(19px, 5.8vw, 27px); }
  .orbital-copy h2 { max-width: none; }
  .orbital-copy > a { min-height: 44px; display: inline-flex; align-items: center; }
  .orbital-source { padding-bottom: calc(12px + env(safe-area-inset-bottom)); }

  .project-card:hover { transform: none; box-shadow: 0 18px 60px rgba(31,34,27,.08); }
  .project-cta, .lab-enter, .projections button { min-height: 44px; }
  .project-visual { aspect-ratio: 4 / 3; }

  .atlas-controls { position: sticky; top: 64px; z-index: 7; margin: 24px -20px 14px; padding: 10px 20px; background: rgba(23,33,27,.96); border-top: 1px solid rgba(241,239,231,.08); border-bottom: 1px solid rgba(241,239,231,.08); }
  .projections { width: 100%; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
  .projections::-webkit-scrollbar { display: none; }
  .projections button { flex: 0 0 auto; padding: 0 14px; }
  .atlas-status { display: block; width: 100%; font-size: 11px; line-height: 1.45; }
  .atlas-stage { height: 66svh; min-height: 460px; }
  .atlas-node { width: 18px; height: 18px; border-width: 1.5px; }
  .atlas-node[data-type="place"]::before { width: 20px; }
  .atlas-node[data-type="place"]::after { height: 20px; }
  .atlas-workspace { grid-template-columns:1fr; }
  .atlas-tooltip { position:fixed; left:12px; right:12px; bottom:max(12px,env(safe-area-inset-bottom)); z-index:30; max-height:min(42svh,360px); overflow:auto; padding:18px 54px 18px 18px; border:1px solid rgba(241,239,231,.13); background:rgba(12,18,14,.94); backdrop-filter:blur(12px); box-shadow:0 -18px 50px rgba(0,0,0,.22); }
  .atlas-tooltip.is-empty { display:none; }
  .atlas-tooltip strong { font-size:20px; }

  .instrument-head { padding-top: max(18px, env(safe-area-inset-top)); }
  .instrument-close { min-width: 44px; min-height: 44px; }
  .instrument-stage { min-height: 0; overflow-y: auto; }
  .instrument-foot { flex-wrap:wrap; gap:8px 12px; }
  .instrument-status { order:3; width:100%; margin-left:0; justify-content:flex-start; }
  .orbital-lab { min-height: 100%; grid-template-rows: minmax(54svh, 1fr) auto; }
  .orbital-lab-stage { min-height: 54svh; }
  .orbital-lab-hover { display: none !important; }
  .orbital-lab-panel { padding-bottom: calc(22px + env(safe-area-inset-bottom)); }
}

@media (max-width: 420px) {
  .display { font-size: clamp(66px, 23vw, 98px); }
  .hero-tagline { font-size: clamp(23px, 7vw, 30px); }
  .orbital-shell { grid-template-rows: clamp(340px, 52svh, 440px) auto auto; }
  .orbital-stage { min-height: 0; }
  .orbital-copy { padding-left: 18px; padding-right: 18px; }
  .home-section, .page-shell { padding-left: 18px; padding-right: 18px; }
}

.scale-ui > .scale-mode {
  color: #7b857d;
  font: 650 11px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.instrument-meta {
  grid-template-columns: minmax(0,1fr) minmax(360px,.75fr);
  align-items: start;
}
.instrument-conditions {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  margin: 0;
  border-left: 1px solid rgba(241,239,231,.09);
}
.instrument-conditions div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 2px 0 9px 16px;
}
.instrument-conditions dt {
  color: #758179;
  font: 700 11px/1.25 var(--mono);
  letter-spacing: .07em;
  text-transform: uppercase;
}
.instrument-conditions dd {
  margin: 0;
  color: #d1d7d2;
  font: 600 11px/1.35 var(--mono);
  overflow-wrap: anywhere;
}
.world-distortion-toggle {
  min-height: 42px;
  border: 1px dashed rgba(241,239,231,.18);
  border-radius: 999px;
  background: transparent;
  color: rgba(241,239,231,.68);
  cursor: pointer;
  font: 700 11px/1 var(--mono);
  letter-spacing: .12em;
}
.world-distortion-toggle:hover,
.world-distortion-toggle.is-active {
  border-color: rgba(166,70,36,.72);
  background: rgba(166,70,36,.10);
  color: #f1efe7;
}
.preview-geo-svg {
  position: absolute;
  inset: 7% 5% 10%;
  z-index: 1;
  width: 90%;
  height: 83%;
  overflow: visible;
  pointer-events: none;
}
.preview-geo-svg .geo-land {
  fill: rgba(174,185,176,.27);
  stroke: rgba(241,239,231,.32);
  stroke-width: .65;
  vector-effect: non-scaling-stroke;
}
.preview-geo-svg .geo-zone {
  fill: rgba(166,70,36,.42);
  stroke: rgba(241,239,231,.78);
  stroke-width: .9;
  vector-effect: non-scaling-stroke;
}
.preview-geo-svg .geo-route {
  fill: none;
  stroke: rgba(209,99,57,.92);
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.preview-geo-svg .geo-point {
  fill: #d16339;
  stroke: #f1efe7;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.project-visual.has-geo-specimen .map.mass,
.project-visual.has-geo-specimen .zone-fill,
.project-visual.has-geo-specimen .route-line,
.project-visual.has-geo-specimen .target-dot,
.project-visual.has-geo-specimen .crosshair,
.project-visual.has-geo-specimen .graticule {
  opacity: 0;
}
.project-visual-pulse.has-geo-specimen .preview-geo-svg { opacity: .82; }
.project-visual-world.has-geo-specimen .preview-geo-svg,
.project-visual-locate.has-geo-specimen .preview-geo-svg,
.project-visual-zone.has-geo-specimen .preview-geo-svg,
.project-visual-path.has-geo-specimen .preview-geo-svg { opacity: .95; }

@media (max-width:760px) {
  .scale-ui > .scale-mode { display: none; }
  .instrument-meta { grid-template-columns: 1fr; }
  .instrument-conditions { grid-template-columns: repeat(2,minmax(0,1fr)); border-left: 0; border-top: 1px solid rgba(241,239,231,.09); padding-top: 10px; }
  .instrument-conditions div { padding-left: 0; padding-right: 10px; }
  .world-distortion-toggle { min-height: 44px; }
}


@media (max-width:760px) {
  .earth-image-wrap { min-height: 0; padding: 12px; }
  .earth-map-frame { width: 100%; }
  .earth-stamp { left: 10px; bottom: 10px; max-width: calc(100% - 20px); font-size: 11px; letter-spacing: .04em; }
}


@view-transition { navigation: auto; }
.brand { view-transition-name: geogeek-brand; }
.scale-ui { view-transition-name: geogeek-scale; }
::view-transition-old(root), ::view-transition-new(root) { animation: none; }
::view-transition-old(record-title) { animation: 180ms ease both fade-out; }
::view-transition-new(record-title) { animation: 420ms var(--ease) both record-arrive; }
@keyframes fade-out { to { opacity: 0; } }
@keyframes fade-in { from { opacity: 0; } }
@keyframes record-arrive { from { opacity: .45; transform: translateY(8px); } }

.record-shell { max-width: 1500px; margin: 0 auto; }
.record-heading { padding: 6vh 0 64px; border-bottom: 1px solid var(--line); }
.record-back { display: inline-flex; margin-bottom: clamp(46px,8vh,96px); color: var(--muted); font: 700 11px/1 var(--mono); letter-spacing: .075em; text-transform: uppercase; }
.record-back:hover { color: var(--signal); }
.record-kicker, .record-section-label { color: var(--signal); font: 700 11px/1.3 var(--mono); letter-spacing: .10em; text-transform: uppercase; }
.record-heading h1 { max-width: none; margin: 18px 0 28px; font-size: clamp(52px,8.4vw,126px); line-height: .88; letter-spacing: -.066em; font-weight: 560; text-wrap: pretty; }
.record-deck { max-width: 860px; margin: 0; color: #303b34; font: italic clamp(21px,2.3vw,34px)/1.42 var(--serif); }
.record-conditions { display: grid; grid-template-columns: 180px minmax(0,1fr); gap: 40px; padding: 42px 0; border-bottom: 1px solid var(--line); }
.record-conditions dl { margin: 0; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px 28px; }
.record-conditions dl div { min-width: 0; }
.record-conditions dt { margin: 0 0 7px; color: var(--muted); font: 700 11px/1.25 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.record-conditions dd { margin: 0; color: var(--fg); font: 600 12px/1.45 var(--mono); overflow-wrap: anywhere; }
.record-detail { display: grid; grid-template-columns: 180px minmax(0,1fr); gap: 40px; padding: 70px 0 20px; scroll-margin-top: 100px; }
.record-body { max-width: 780px; }
.record-body p { margin: 0; color: #2f3b33; font-family: var(--serif); font-size: clamp(20px,1.65vw,25px); line-height: 1.72; }
.record-actions { grid-column: 2; display: flex; flex-wrap: wrap; gap: 10px; margin-top: 38px; }
.record-action { min-height: 44px; display: inline-flex; align-items: center; padding: 0 15px; border: 1px solid var(--line); border-radius: 999px; color: var(--fg); font: 700 11px/1 var(--mono); letter-spacing: .08em; }
.record-action.primary { border-color: rgba(166,70,36,.38); background: var(--signal-soft); }
.record-action:hover { border-color: var(--signal); }

@media (max-width: 760px) {
  .elsewhere-strip { grid-template-columns: 1fr; }
  .scale-ui { cursor: pointer; }
  .scale-legend { display: block; width: min(220px, calc(100vw - 32px)); opacity: 0; transform: translateY(-5px); pointer-events: none; }
  .scale-ui.is-open .scale-legend { opacity: 1; transform: none; pointer-events: auto; }
  .scale-ui:not(.is-open) .scale-legend { visibility: hidden; }
  .scale-ui.is-open .scale-legend { visibility: visible; }
  .record-heading { padding-top: 3vh; padding-bottom: 42px; }
  .record-back { margin-bottom: 54px; }
  .record-heading h1 { font-size: clamp(46px,15vw,80px); }
  .record-conditions, .record-detail { grid-template-columns: 1fr; gap: 22px; }
  .record-conditions dl { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .record-actions { grid-column: 1; }
  .project-actions { width: 100%; }
  .project-actions .project-cta { flex: 1 1 auto; justify-content: center; min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root), ::view-transition-old(record-title), ::view-transition-new(record-title) { animation: none; }
}

.brand { order: 1; }
.nav-links { order: 2; }
.nav-toggle { order: 3; }
.nav-toggle { margin-left: 18px; }
@media (max-width: 760px) { .nav-toggle { margin-left: auto; } }

/* Spatial browser */
.site-map {
  width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0;
  background: var(--atlas-bg); color: var(--atlas-fg); overflow: auto; overscroll-behavior: contain;
}
.site-map::backdrop { background: rgba(9,13,10,.68); }
.spatial-browser-shell {
  min-height: 100dvh; display: grid; grid-template-rows: auto auto minmax(500px,1fr) auto;
  padding: max(22px,env(safe-area-inset-top)) max(22px,3.2vw) max(18px,env(safe-area-inset-bottom));
}
.spatial-browser-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding-bottom:16px; border-bottom:1px solid rgba(241,239,231,.14); }
.spatial-browser-head > div > span, .site-map-route span, .spatial-browser-foot, .map-inspector-kicker, .map-structure-list > span {
  color:var(--atlas-muted); font:700 11px/1.35 var(--mono); letter-spacing:.09em; text-transform:uppercase;
}
.spatial-browser-head h2 { margin:7px 0 0; font-size:clamp(38px,5.2vw,78px); line-height:.88; letter-spacing:-.055em; font-weight:580; }
.site-map-close { width:46px; height:46px; flex:0 0 auto; border:1px solid rgba(241,239,231,.18); border-radius:50%; background:transparent; color:var(--atlas-fg); cursor:pointer; font-size:26px; }
.site-map-close:hover, .site-map-close:focus-visible { border-color:var(--signal); outline:none; }
.spatial-browser-bar { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:11px 0 12px; }
.site-map-route { display:grid; gap:3px; min-width:0; }
.site-map-route strong { max-width:min(58vw,760px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#d9dfda; font:650 11px/1.35 var(--mono); letter-spacing:.045em; }
.map-scale { display:flex; gap:0; border:1px solid rgba(241,239,231,.13); }
.map-scale button { min-width:96px; min-height:45px; padding:7px 11px; border:0; border-right:1px solid rgba(241,239,231,.1); background:transparent; color:#87938a; cursor:pointer; text-align:left; }
.map-scale button:last-child { border-right:0; }
.map-scale button span, .map-scale button small { display:block; font-family:var(--mono); }
.map-scale button span { font-size:11px; font-weight:750; letter-spacing:.065em; }
.map-scale button small { margin-top:4px; font-size:11px; color:#647168; }
.map-scale button:hover:not(:disabled), .map-scale button.is-active { background:rgba(166,70,36,.11); color:var(--atlas-fg); }
.map-scale button.is-active span { color:#dc7753; }
.map-scale button:disabled { opacity:.24; cursor:not-allowed; }
.spatial-browser-body { min-height:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,320px); gap:14px; }
.site-map-viewport { min-width:0; min-height:0; overflow:auto; border:1px solid rgba(241,239,231,.10); scrollbar-color:rgba(166,70,36,.55) rgba(241,239,231,.04); }
.site-map-viewport:focus-visible { outline:1px solid var(--signal); outline-offset:-1px; }
.spatial-map-field {
  position:relative; width:100%; min-width:760px; height:100%; min-height:500px; overflow:hidden;
  background-image:linear-gradient(rgba(241,239,231,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(241,239,231,.035) 1px,transparent 1px);
  background-size:68px 68px;
}
.spatial-map-field svg, .site-map-nodes { position:absolute; inset:0; width:100%; height:100%; }
.spatial-map-field svg { pointer-events:none; }
.spatial-map-field line { stroke:rgba(241,239,231,.14); stroke-width:.16; vector-effect:non-scaling-stroke; transition:stroke .18s,opacity .18s; }
.spatial-map-field line.is-active { stroke:rgba(209,99,57,.72); stroke-width:.24; }
.spatial-map-field line.is-record-line { stroke-dasharray:2.5 3.5; opacity:.68; }
.site-map-origin-mark { position:absolute; left:10%; top:50%; width:34px; height:34px; border:1px solid rgba(166,70,36,.34); border-radius:50%; transform:translate(-50%,-50%); pointer-events:none; }
.site-map-node {
  position:absolute; z-index:3; left:var(--mx); top:var(--my); display:grid; grid-template-columns:15px minmax(0,auto); grid-template-rows:auto auto;
  gap:3px 8px; min-height:44px; max-width:190px; padding:6px 8px 6px 2px; border:0; background:transparent; color:#c6cec8; text-align:left; transform:translate(-7px,-50%); cursor:pointer;
  transition:opacity .18s var(--ease),color .18s var(--ease),transform .18s var(--ease);
}
.site-map-node i { grid-row:1/3; align-self:center; width:10px; height:10px; border:1px solid #b9c3bb; border-radius:50%; background:var(--atlas-bg); transition:transform .18s,background .18s,border-color .18s; }
.site-map-node[data-node-type="lab"] i { border-radius:0; }
.site-map-node[data-node-type="atlas"] i { border-radius:0; transform:rotate(45deg); }
.site-map-node[data-node-type="elsewhere"] i { border-style:dashed; }
.site-map-node span { color:#78857c; font:700 11px/1 var(--mono); letter-spacing:.07em; }
.site-map-node strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:560 clamp(11px,1vw,15px)/1.12 var(--sans); }
.site-map-node.is-record strong { max-width:116px; font-size:12px; }
.site-map-node.is-record i { width:8px; height:8px; }
.site-map-node.is-dim { opacity:.22; }
.site-map-node.is-selected, .site-map-node.is-current, .site-map-node:hover, .site-map-node:focus-visible { color:#fff; outline:none; opacity:1; }
.site-map-node.is-selected i, .site-map-node.is-current i, .site-map-node:hover i, .site-map-node:focus-visible i { border-color:var(--signal); background:var(--signal); transform:scale(1.35); }
.site-map-node[data-node-type="atlas"].is-selected i, .site-map-node[data-node-type="atlas"].is-current i, .site-map-node[data-node-type="atlas"]:hover i, .site-map-node[data-node-type="atlas"]:focus-visible i { transform:rotate(45deg) scale(1.35); }
.site-map-node.is-current strong::after { content:" ·"; color:var(--signal); }
.site-map-node.is-right-edge { grid-template-columns:auto 15px; transform:translate(calc(-100% + 7px),-50%); text-align:right; }
.site-map-node.is-right-edge i { grid-column:2; grid-row:1/3; }
.site-map-node.is-right-edge span, .site-map-node.is-right-edge strong { grid-column:1; }
.map-inspector { min-height:0; overflow:auto; padding:22px; border:1px solid rgba(241,239,231,.10); background:rgba(11,17,14,.58); }
.map-inspector h3 { margin:11px 0 12px; color:var(--atlas-fg); font:500 clamp(24px,2.3vw,37px)/1.02 var(--serif); letter-spacing:-.025em; }
.map-inspector p { margin:0; color:#9eaaa1; font:500 13px/1.62 var(--sans); }
.map-inspector dl { display:grid; gap:0; margin:24px 0 0; border-top:1px solid rgba(241,239,231,.08); }
.map-inspector dl div { display:grid; grid-template-columns:1fr 1.25fr; gap:14px; padding:10px 0; border-bottom:1px solid rgba(241,239,231,.08); }
.map-inspector dt, .map-inspector dd { margin:0; font:650 11px/1.45 var(--mono); }
.map-inspector dt { color:#6f7d73; text-transform:uppercase; letter-spacing:.07em; }
.map-inspector dd { color:#c4cdc6; overflow-wrap:anywhere; }
.map-inspector-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:22px; }
.map-inspector-actions a, .map-inspector-actions button { min-height:44px; display:inline-flex; align-items:center; padding:0 13px; border:1px solid rgba(241,239,231,.14); background:transparent; color:#d8ded9; cursor:pointer; font:700 11px/1 var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.map-inspector-actions a:first-child, .map-inspector-actions button:first-child { border-color:rgba(166,70,36,.48); background:rgba(166,70,36,.12); }
.map-inspector-actions a:hover, .map-inspector-actions button:hover { border-color:var(--signal); }
.map-structure-list { display:grid; gap:2px; margin-top:26px; padding-top:16px; border-top:1px solid rgba(241,239,231,.08); }
.map-structure-list > span { margin-bottom:7px; }
.map-structure-list button { min-height:44px; padding:9px 0; border:0; border-bottom:1px solid rgba(241,239,231,.055); background:transparent; color:#8f9b92; text-align:left; cursor:pointer; font:600 11px/1.35 var(--mono); }
.map-structure-list button:hover, .map-structure-list button.is-active { color:#e2e7e3; }
.spatial-browser-foot { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:12px; }
.spatial-browser-foot > span { display:grid; gap:3px; }
.spatial-browser-foot b { color:#7e8a81; font:700 11px/1.4 var(--mono); letter-spacing:.06em; }
.spatial-browser-foot i { display:none; color:#68756c; font:600 11px/1.4 var(--mono); font-style:normal; letter-spacing:.02em; }
.site-map-lang { min-width:50px; min-height:44px; border:1px solid rgba(241,239,231,.16); background:transparent; color:var(--atlas-fg); cursor:pointer; font:700 11px/1 var(--mono); }
body.site-map-open { overflow:hidden; }

.instrument-status { margin-left:auto; padding:0 10px; min-height:28px; display:inline-flex; align-items:center; border:1px solid rgba(241,239,231,.10); color:#9aa69d; font:700 11px/1 var(--mono); letter-spacing:.06em; white-space:nowrap; }
.instrument-status[data-state="live"] { border-color:rgba(113,151,121,.38); color:#b9c7bc; }
.instrument-status[data-state="loading"] { border-color:rgba(241,239,231,.12); color:#8d9990; }
.instrument-status[data-state="error"] { border-color:rgba(209,99,57,.5); color:#e09a7e; }
.instrument-status[data-state="demo"], .instrument-status[data-state="stale"] { border-color:rgba(209,99,57,.42); color:#d8a18b; border-style:dashed; }
.instrument-status[data-state="static"] { border-style:dashed; }


/* Semantic scale */
.scale-nudge { display:none; position:absolute; top:12px; width:32px; height:34px; border:0; background:transparent; color:var(--muted); font:500 22px/1 var(--sans); cursor:pointer; }
.scale-nudge-prev { left:0; }
.scale-nudge-next { right:0; }
.scale-nudge:disabled { opacity:.18; cursor:not-allowed; }

/* Atlas projection field */
.atlas-node { transition:left .34s var(--ease),top .34s var(--ease),transform .18s,background .18s,border-color .18s,opacity .18s; }
.atlas-node > i { display:none; }
.atlas-stage[data-mode="geographic"] { background-image:none; }
.atlas-geographic-frame { position:absolute; inset:0; }
.atlas-geographic-frame svg { width:100%; height:100%; }
.atlas-geographic-frame rect { fill:rgba(21,31,25,.34); stroke:rgba(241,239,231,.16); stroke-width:1; vector-effect:non-scaling-stroke; }
.atlas-geographic-frame line { stroke:rgba(241,239,231,.07); stroke-width:1; vector-effect:non-scaling-stroke; }
.atlas-geographic-frame .atlas-nonspatial-divider { stroke:rgba(209,99,57,.28); stroke-dasharray:4 5; }
.atlas-guide.geo-axis { color:#68756c; font-size:11px; }
.atlas-guide.geo-band { color:#b3bdb5; font-size:11px; letter-spacing:.07em; }
.atlas-guide.trace-note { color:#68756c; font-size:11px; }
.atlas-stage[data-mode="geographic"] .atlas-node.is-global { width:10px; height:10px; border-color:#d16339; background:rgba(166,70,36,.18); }
.atlas-stage[data-mode="geographic"] .atlas-node.is-nonspatial { opacity:.56; border-style:dashed; }
.atlas-stage[data-mode="geographic"] .atlas-links { opacity:0; }

@media (max-width: 900px) {
  .spatial-browser-shell { grid-template-rows:auto auto auto auto; padding-left:16px; padding-right:16px; }
  .spatial-browser-bar { align-items:flex-start; flex-direction:column; gap:10px; }
  .site-map-route strong { max-width:calc(100vw - 32px); }
  .map-scale { width:100%; overflow-x:auto; }
  .map-scale button { flex:1 0 104px; }
  .spatial-browser-body { grid-template-columns:1fr; }
  .site-map-viewport { min-height:56dvh; }
  .spatial-map-field { width:900px; min-width:900px; min-height:56dvh; }
  .map-inspector { max-height:none; }
  .spatial-browser-foot i { display:block; }
  .spatial-browser-foot > span { max-width:80%; }
}

@media (max-width: 760px) {
  .scale-ui { min-width:154px; padding:10px 34px; border:1px solid rgba(21,32,25,.09); background:rgba(244,242,234,.86); backdrop-filter:blur(8px); border-radius:2px; cursor:pointer; }
  .scale-ui > strong, .scale-ui > em { text-align:center; }
  .scale-nudge { display:block; }
  .scale-legend { right:-1px; width:min(240px,calc(100vw - 32px)); }
  body.orbital-active .scale-ui { border-color:rgba(241,239,231,.10); background:rgba(11,17,14,.78); }
  .spatial-browser-head h2 { font-size:42px; }
  .site-map-close { width:44px; height:44px; }
  .site-map-node { max-width:170px; }
  .site-map-node strong { font-size:12px; }
  .atlas-stage { min-height:520px; height:68svh; }
  .projections { flex-wrap:nowrap; width:100%; overflow-x:auto; padding-bottom:2px; scrollbar-width:thin; }
  .projections button { flex:0 0 auto; min-height:42px; }
}

@media (prefers-reduced-motion: reduce) {
  .site-map-node, .spatial-map-field line, .atlas-node { transition:none; }
}
.site-map { overflow-x: hidden; overflow-y: auto; }
.spatial-browser-shell { width: 100%; box-sizing: border-box; overflow-x: hidden; }


/* Viewport integrity */
html, body { max-width: 100%; overflow-x: clip; }
.life-tile { min-width: 0; overflow-wrap: anywhere; }
.spatial-browser-head,
.spatial-browser-bar,
.spatial-browser-body,
.spatial-browser-foot,
.map-scale { min-width: 0; }
.map-scale { max-width: 100%; box-sizing: border-box; }

@media (max-width: 900px) {
  .spatial-browser-shell { min-width: 0; }
  .spatial-browser-bar,
  .spatial-browser-body,
  .site-map-viewport { width: 100%; max-width: 100%; box-sizing: border-box; }
}

@media (max-width: 420px) {
  .atlas-controls { margin-left: -18px; margin-right: -18px; padding-left: 18px; padding-right: 18px; }
}

/* Commons / shared geographic field */
.home-commons {
  position:relative; z-index:2; margin:0 var(--pad); padding:clamp(74px,7vw,108px) 0 clamp(84px,8vw,118px);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.home-commons-head { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:clamp(28px,4vw,68px); align-items:end; }
.home-commons-title { max-width:980px; }
.commons-gateway-kicker { color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.09em; text-transform:uppercase; }
.home-commons-title h2 { margin:10px 0 9px; font:500 clamp(38px,4.7vw,68px)/.96 var(--serif); letter-spacing:-.045em; }
.commons-gateway-copy { margin:0; max-width:920px; color:#47534b; font:400 clamp(16px,1.25vw,19px)/1.55 var(--sans); }
.commons-gateway-privacy { display:block; color:var(--muted); font:600 11px/1.5 var(--mono); }
.commons-gateway-actions { display:flex; gap:8px; align-items:center; }
.commons-gateway-actions a { min-height:44px; display:inline-flex; align-items:center; justify-content:center; padding:0 14px; border:1px solid var(--line); font:700 11px/1 var(--mono); letter-spacing:.06em; white-space:nowrap; }
.commons-gateway-actions a:last-child { border-color:rgba(166,70,36,.42); color:var(--signal); }
.home-commons-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:36px; border-top:1px solid var(--line); border-bottom:1px solid var(--line-soft); }
.home-commons-metrics > div { min-width:0; padding:15px 16px 17px 0; border-right:1px solid var(--line-soft); }
.home-commons-metrics > div + div { padding-left:16px; }
.home-commons-metrics > div:last-child { border-right:0; }
.home-commons-metrics span { display:block; color:var(--muted); font:700 11px/1.2 var(--mono); letter-spacing:.065em; }
.home-commons-metrics strong { display:block; margin-top:8px; color:var(--fg); font:500 clamp(23px,2.4vw,36px)/1 var(--serif); letter-spacing:-.035em; }
.home-commons-toolbar { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-top:30px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.home-commons-toolbar > div:first-child { display:grid; gap:6px; }
.home-commons-field-label { color:var(--fg); font:700 11px/1 var(--mono); letter-spacing:.08em; }
.home-commons-toolbar small { color:var(--muted); font:650 11px/1.3 var(--mono); }
.home-commons-horizon { display:flex; gap:5px; }
.home-commons-horizon button { min-height:40px; min-width:48px; padding:0 11px; border:1px solid var(--line); background:transparent; color:var(--muted); cursor:pointer; font:700 11px/1 var(--mono); letter-spacing:.05em; }
.home-commons-horizon button.is-active { border-color:rgba(166,70,36,.42); color:var(--signal); background:rgba(166,70,36,.045); }
.home-commons-map-mount { position:relative; margin-top:14px; height:clamp(460px,50vw,620px); border:1px solid var(--line); background:rgba(244,242,234,.36); overflow:hidden; }
.home-commons-map-mount .commons-preview-map { width:100%; height:100%; max-height:none; border:0; background:transparent; }
.home-commons-map-mount .commons-preview-map-status { position:absolute; z-index:3; left:14px; top:12px; margin:0; pointer-events:none; }
.home-commons-map-mount .commons-preview-map-status.is-demo { color:#9b5a3d; }
.home-commons-map-mount .commons-preview-map-status.is-error { color:var(--signal); }
.home-commons-map-legend { position:absolute; z-index:3; right:13px; bottom:12px; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px 13px; }
.home-commons-map-legend span { display:flex; align-items:center; gap:5px; color:var(--muted); font:700 11px/1 var(--mono); }
.home-commons-map-legend i { width:8px; height:8px; border:1px solid var(--soft); border-radius:50%; }
.home-commons-map-legend .visit-dot { border-color:var(--signal); background:rgba(166,70,36,.16); }
.home-commons-map-legend .observation-dot { width:11px; height:11px; border-style:dashed; background:transparent; }
.home-commons-map-legend .now-dot { border-color:var(--signal); background:var(--signal); }
.home-commons-map-legend .host-dot { border-color:var(--fg); background:var(--fg); }
.home-commons-map-source { position:absolute; z-index:3; left:14px; bottom:12px; color:var(--muted); font:650 11px/1.3 var(--mono); }
.home-commons-foot { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; margin-top:12px; }
.home-commons-foot > span { color:var(--muted); font:700 11px/1.4 var(--mono); letter-spacing:.055em; white-space:nowrap; }
.sheet-index .sheet-index-sub b { color:var(--muted); }
.sheet-index .sheet-index-sub span { font-size:11px; }

.commons-page { padding-bottom:111px; }
.commons-summary { margin-top:8px; }
.commons-status-line { display:flex; align-items:center; gap:16px; justify-content:space-between; padding:13px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line-soft); }
.commons-status-line .instrument-status { margin-left:0; }
.commons-status-line p { margin:0; max-width:820px; color:var(--muted); font:600 11px/1.45 var(--mono); text-align:right; }
.commons-metrics { display:grid; grid-template-columns:repeat(5,1fr); border-bottom:1px solid var(--line); }
.commons-metrics article { min-width:0; padding:22px 18px 24px 0; border-right:1px solid var(--line-soft); }
.commons-metrics article + article { padding-left:18px; }
.commons-metrics article:last-child { border-right:0; }
.commons-metrics span { display:block; color:var(--muted); font:700 11px/1.2 var(--mono); letter-spacing:.065em; }
.commons-metrics strong { display:block; margin-top:14px; color:var(--fg); font:500 clamp(28px,3.5vw,48px)/1 var(--serif); letter-spacing:-.04em; }

.commons-workspace { margin-top:54px; }
.commons-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; padding-bottom:11px; border-bottom:1px solid var(--line); }
.commons-layer-controls,.commons-horizon,.commons-time-modes,.commons-time-reference { display:flex; flex-wrap:wrap; gap:5px; }
.commons-layer-controls button,.commons-horizon button,.commons-time-modes button,.commons-time-reference button {
  min-height:40px; padding:0 12px; border:1px solid var(--line); background:transparent; color:var(--muted); cursor:pointer;
  font:700 11px/1 var(--mono); letter-spacing:.055em;
}
.commons-layer-controls button.is-active,.commons-horizon button.is-active,.commons-time-modes button.is-active,.commons-time-reference button.is-active { border-color:rgba(166,70,36,.42); color:var(--signal); background:rgba(166,70,36,.045); }
.commons-time-controls { display:flex; align-items:center; gap:12px; }
.commons-time-controls > span { color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.075em; }
.commons-map-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,315px); gap:18px; padding-top:18px; }
.commons-map-frame { position:relative; min-width:0; aspect-ratio:1.76/1; min-height:470px; overflow:hidden; border:1px solid var(--line); background:rgba(244,242,234,.45); }
#commonsMap { display:block; width:100%; height:100%; }
.commons-sphere { fill:rgba(244,242,234,.28); stroke:rgba(21,32,25,.28); stroke-width:1.1; vector-effect:non-scaling-stroke; }
.commons-countries path { fill:rgba(21,32,25,.035); stroke:rgba(21,32,25,.18); stroke-width:.65; vector-effect:non-scaling-stroke; }
.commons-graticule { fill:none; stroke:rgba(21,32,25,.09); stroke-width:.6; vector-effect:non-scaling-stroke; }
.commons-night { fill:rgba(21,32,25,.12); stroke:rgba(21,32,25,.18); stroke-width:.75; vector-effect:non-scaling-stroke; }
.commons-visits circle { fill:rgba(166,70,36,.18); stroke:rgba(166,70,36,.56); stroke-width:1; vector-effect:non-scaling-stroke; cursor:pointer; transition:r .16s var(--ease),fill .16s; }
.commons-visits circle:hover,.commons-visits circle:focus { fill:rgba(166,70,36,.32); outline:none; }
.commons-observation-marks circle { fill:none; stroke:rgba(21,32,25,.72); stroke-width:1.25; stroke-dasharray:2 3; vector-effect:non-scaling-stroke; cursor:pointer; }
.commons-now-marks circle { fill:var(--signal); stroke:var(--bg); stroke-width:1.8; vector-effect:non-scaling-stroke; }
.commons-host-mark circle,.commons-host-preview { fill:var(--fg); stroke:var(--bg); stroke-width:2; vector-effect:non-scaling-stroke; }
.commons-you-mark circle { fill:var(--signal); stroke:var(--bg); stroke-width:2; vector-effect:non-scaling-stroke; }
.commons-relation-line { fill:none; stroke:var(--signal); stroke-width:1.35; stroke-dasharray:4 3; vector-effect:non-scaling-stroke; }
.commons-selected-ring { fill:none; stroke:var(--signal); stroke-width:1.2; vector-effect:non-scaling-stroke; }
.commons-map-status { position:absolute; z-index:3; left:14px; top:12px; max-width:min(520px,70%); color:var(--muted); font:700 11px/1.35 var(--mono); letter-spacing:.04em; pointer-events:none; }
.commons-map-status.is-demo { color:#9b5a3d; }
.commons-map-status.is-error { color:var(--signal); }
.commons-map-source { position:absolute; z-index:3; left:14px; bottom:11px; color:var(--muted); font:650 11px/1.3 var(--mono); }
.commons-map-legend { position:absolute; z-index:3; right:12px; bottom:11px; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px 12px; max-width:55%; }
.commons-map-legend span { display:flex; align-items:center; gap:5px; color:var(--muted); font:700 11px/1 var(--mono); }
.commons-map-legend i { width:8px; height:8px; display:inline-block; border:1px solid var(--soft); border-radius:50%; }
.commons-map-legend .visit-dot { border-color:var(--signal); background:rgba(166,70,36,.16); }
.commons-map-legend .observation-dot { width:11px; height:11px; border-style:dashed; }
.commons-map-legend .now-dot { background:var(--signal); border-color:var(--signal); }
.commons-map-legend .host-dot { background:var(--fg); border-color:var(--fg); }

.commons-inspector { min-width:0; padding:20px; border:1px solid var(--line); background:rgba(244,242,234,.42); }
.commons-inspector-kicker { color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.075em; }
.commons-inspector h2 { margin:11px 0 11px; font:500 clamp(25px,2.4vw,35px)/1.03 var(--serif); letter-spacing:-.035em; }
.commons-inspector > p { margin:0; color:var(--soft); font-size:14px; line-height:1.55; }
.commons-inspector > small { display:block; margin-top:12px; color:var(--muted); font:600 11px/1.45 var(--mono); }
.commons-inspector dl { margin:18px 0 0; border-top:1px solid var(--line-soft); }
.commons-inspector dl div { display:grid; grid-template-columns:1fr 1.2fr; gap:12px; padding:9px 0; border-bottom:1px solid var(--line-soft); }
.commons-inspector dt,.commons-inspector dd { margin:0; font:650 11px/1.35 var(--mono); }
.commons-inspector dt { color:var(--muted); } .commons-inspector dd { color:var(--fg); text-align:right; }
.commons-place-meta { display:flex; flex-wrap:wrap; gap:8px 14px; margin-top:15px; color:var(--muted); font:650 11px/1.35 var(--mono); }
.commons-observation-list { margin-top:18px; border-top:1px solid var(--line); }
.commons-observation-list article { padding:11px 0; border-bottom:1px solid var(--line-soft); }
.commons-observation-list time,.commons-observation-list small { color:var(--muted); font:600 11px/1.3 var(--mono); }
.commons-observation-list p { margin:5px 0; font:400 14px/1.45 var(--serif); }

.commons-temporal-panel { display:grid; grid-template-columns:auto minmax(180px,1fr) auto; gap:20px; align-items:center; padding:13px 0 0; }
.commons-hour-control label { display:flex; justify-content:space-between; margin-bottom:7px; color:var(--muted); font:700 11px/1 var(--mono); }
.commons-hour-control input { width:100%; accent-color:var(--signal); }

.commons-participate { display:grid; grid-template-columns:1fr 1fr; gap:34px; margin-top:96px; padding-top:34px; border-top:1px solid var(--line); }
.commons-you,.commons-observe { min-width:0; }
.commons-block-head > span { color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.075em; }
.commons-block-head h2 { margin:11px 0 24px; max-width:620px; font:500 clamp(28px,3vw,44px)/1.02 var(--serif); letter-spacing:-.04em; }
.commons-relation-readout { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--line); }
.commons-relation-readout > div { min-width:0; padding:15px 16px 16px 0; border-bottom:1px solid var(--line-soft); }
.commons-relation-readout > div:nth-child(even) { padding-left:16px; border-left:1px solid var(--line-soft); }
.commons-relation-readout span,.commons-relation-readout small { display:block; color:var(--muted); font:650 11px/1.35 var(--mono); }
.commons-relation-readout strong { display:block; margin:8px 0 5px; overflow-wrap:anywhere; font:550 17px/1.25 var(--sans); }
.commons-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:18px; }
.commons-actions button,.commons-form-foot button { min-height:44px; padding:0 14px; border:1px solid var(--line); background:transparent; color:var(--fg); cursor:pointer; font:700 11px/1 var(--mono); letter-spacing:.05em; }
.commons-actions button.primary,.commons-form-foot button { border-color:rgba(166,70,36,.5); color:var(--signal); }
.commons-actions button:disabled,.commons-form-foot button:disabled { opacity:.34; cursor:not-allowed; }
.commons-privacy-note { margin:16px 0 0; max-width:620px; color:var(--muted); font:600 11px/1.55 var(--mono); }
#commonsObservationForm { display:grid; gap:13px; }
#commonsObservationForm label { display:grid; gap:7px; }
#commonsObservationForm label > span { color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.06em; }
#commonsObservationForm input,#commonsObservationForm textarea { width:100%; min-width:0; box-sizing:border-box; border:1px solid var(--line); border-radius:0; background:rgba(244,242,234,.56); padding:12px; color:var(--fg); font:400 15px/1.5 var(--sans); }
#commonsObservationForm input[readonly] { color:var(--muted); font-family:var(--mono); font-size:12px; }
#commonsObservationForm textarea { resize:vertical; min-height:108px; }
#commonsObservationForm label small { justify-self:end; color:var(--muted); font:600 11px/1 var(--mono); }
.commons-form-foot { display:flex; align-items:center; gap:14px; min-height:44px; }
.commons-form-foot span { color:var(--muted); font:600 11px/1.4 var(--mono); }

.site-map-modes { display:flex; align-items:center; gap:5px; margin-left:auto; margin-right:18px; }
.site-map-modes button { min-height:38px; padding:0 12px; border:1px solid rgba(241,239,231,.12); background:transparent; color:#88958c; cursor:pointer; font:700 11px/1 var(--mono); letter-spacing:.06em; }
.site-map-modes button.is-active { border-color:rgba(209,99,57,.45); color:#d9dfda; background:rgba(166,70,36,.11); }
.site-map-commons { min-height:0; overflow:auto; }
.site-map-commons-mount { min-height:100%; padding:8px 0 0; }
.commons-preview-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:14px; }
.commons-preview-head span { color:#6e7a72; font:700 11px/1 var(--mono); letter-spacing:.075em; }
.commons-preview-head h3 { margin:7px 0 0; color:#e0e5e1; font:500 clamp(28px,3vw,42px)/1 var(--serif); }
.commons-preview-head a { min-height:42px; display:inline-flex; align-items:center; padding:0 12px; border:1px solid rgba(209,99,57,.4); color:#d39a82; font:700 11px/1 var(--mono); }
.commons-preview-map { display:block; width:100%; max-height:58dvh; border:1px solid rgba(241,239,231,.1); background:rgba(12,18,15,.38); }
.commons-preview-map .commons-sphere { fill:rgba(241,239,231,.015); stroke:rgba(241,239,231,.18); }
.commons-preview-map .commons-countries path { fill:rgba(241,239,231,.025); stroke:rgba(241,239,231,.12); }
.commons-preview-map .commons-graticule { stroke:rgba(241,239,231,.06); }
.commons-preview-map .commons-visits circle { fill:rgba(209,99,57,.25); stroke:rgba(209,99,57,.7); }
.commons-preview-map .commons-host-preview { fill:#d3dad4; stroke:#17211b; }
.commons-preview-map-status,.commons-preview-stats,.commons-preview-loading { color:#7e8a81; font:700 11px/1.4 var(--mono); }
.commons-preview-map-status { margin-bottom:8px; }
.commons-preview-stats { margin-top:11px; }

@media (max-width: 980px) {
  .home-commons-head { grid-template-columns:1fr; align-items:start; }
  .commons-gateway-actions { justify-self:start; }
  .home-commons-map-mount { height:clamp(400px,54vw,520px); }
  .commons-metrics { grid-template-columns:repeat(3,1fr); }
  .commons-metrics article:nth-child(3) { border-right:0; }
  .commons-metrics article:nth-child(n+4) { border-top:1px solid var(--line-soft); }
  .commons-map-layout { grid-template-columns:1fr; }
  .commons-map-frame { min-height:430px; }
  .commons-inspector { min-height:180px; }
  .commons-participate { grid-template-columns:1fr; }
}

@media (max-width: 760px) {
  .home-commons { margin:0 18px; padding:58px 0 68px; }
  .home-commons-head { gap:20px; }
  .commons-gateway-actions { width:100%; }
  .commons-gateway-actions a { flex:1; justify-content:center; }
  .home-commons-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:28px; }
  .home-commons-metrics > div,.home-commons-metrics > div + div { padding:13px 10px 14px 0; border-right:1px solid var(--line-soft); }
  .home-commons-metrics > div:nth-child(even) { padding-left:10px; border-right:0; }
  .home-commons-metrics > div:nth-child(n+3) { border-top:1px solid var(--line-soft); }
  .home-commons-toolbar { align-items:stretch; flex-direction:column; gap:13px; margin-top:24px; }
  .home-commons-horizon { width:100%; overflow-x:auto; }
  .home-commons-horizon button { min-height:44px; flex:1 0 auto; }
  .home-commons-map-mount { height:auto; min-height:0; }
  .home-commons-map-mount .commons-preview-map { height:auto; aspect-ratio:1.18/1; }
  .home-commons-map-legend { left:12px; right:12px; bottom:30px; justify-content:flex-start; }
  .home-commons-map-source { right:12px; max-width:calc(100% - 24px); }
  .home-commons-foot { flex-direction:column; gap:8px; }
  .commons-status-line { align-items:flex-start; flex-direction:column; }
  .commons-status-line p { text-align:left; }
  .commons-metrics { grid-template-columns:repeat(2,1fr); }
  .commons-metrics article,.commons-metrics article + article { padding:16px 12px 18px 0; border-top:0; border-right:1px solid var(--line-soft); }
  .commons-metrics article:nth-child(even) { padding-left:12px; border-right:0; }
  .commons-metrics article:nth-child(n+3) { border-top:1px solid var(--line-soft); }
  .commons-metrics article:last-child { grid-column:1 / -1; border-right:0; }
  .commons-toolbar { align-items:stretch; flex-direction:column; }
  .commons-layer-controls,.commons-horizon { flex-wrap:nowrap; width:100%; overflow-x:auto; }
  .commons-layer-controls button,.commons-horizon button { flex:0 0 auto; min-height:44px; }
  .commons-time-controls { width:100%; justify-content:space-between; }
  .commons-map-frame { min-height:0; aspect-ratio:1.15/1; }
  .commons-map-legend { left:11px; right:11px; max-width:none; justify-content:flex-start; bottom:29px; }
  .commons-map-source { right:11px; max-width:calc(100% - 20px); font-size:11px; }
  .commons-map-status { max-width:80%; font-size:11px; }
  .commons-temporal-panel { grid-template-columns:1fr; gap:12px; }
  .commons-time-modes,.commons-time-reference { width:100%; flex-wrap:nowrap; overflow-x:auto; }
  .commons-time-modes button,.commons-time-reference button { min-height:44px; flex:1 0 auto; }
  .commons-participate { margin-top:72px; }
  .commons-relation-readout { grid-template-columns:1fr; }
  .commons-relation-readout > div:nth-child(even) { padding-left:0; border-left:0; }
  .site-map-modes { order:3; width:100%; margin:8px 0 0; }
  .site-map-modes button { flex:1; min-height:44px; }
  .commons-preview-map { max-height:none; }
}

body[data-page-key="commons"] { overflow: hidden; }
body[data-page-key="commons"] > .footer { display: none; }
body[data-page-key="commons"] .scale-ui { top: 84px; }

.commons-page {
  height: 100svh;
  min-height: 0;
  padding-top: 84px;
  padding-bottom: 12px;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 8px;
  overflow: hidden;
}
.commons-page .page-title {
  grid-template-columns: minmax(0, .85fr) minmax(340px, .65fr);
  gap: 28px;
  align-items: end;
  padding-bottom: 9px;
}
.commons-page .page-title h1 {
  margin-top: 5px;
  font-size: clamp(36px, 3.7vw, 58px);
  line-height: .9;
}
.commons-page .page-title .page-intro {
  max-width: 620px;
  margin: 0;
  font-size: clamp(14px, 1.05vw, 17px);
  line-height: 1.35;
}
.commons-page .commons-summary { margin-top: 0; min-height: 0; }
.commons-page .commons-status-line { min-height: 32px; padding: 5px 0; }
.commons-page .commons-status-line p { max-width: 760px; line-height: 1.3; }
.commons-page .commons-metrics { min-height: 0; }
.commons-page .commons-metrics article { padding: 8px 12px 9px 0; }
.commons-page .commons-metrics article + article { padding-left: 12px; }
.commons-page .commons-metrics strong { margin-top: 4px; font-size: clamp(20px, 2vw, 29px); }
.commons-page .commons-workspace {
  min-height: 0;
  margin-top: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}
.commons-page .commons-toolbar { min-height: 38px; padding-bottom: 6px; }
.commons-page .commons-layer-controls button,
.commons-page .commons-horizon button,
.commons-page .commons-time-modes button,
.commons-page .commons-time-reference button { min-height: 34px; padding: 0 10px; }
.commons-page .commons-map-layout {
  min-height: 0;
  height: 100%;
  padding-top: 8px;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 350px);
  gap: 12px;
  overflow: hidden;
}
.commons-map-stack {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}
.commons-page .commons-map-frame {
  min-height: 0;
  height: 100%;
  aspect-ratio: auto;
}
.commons-page .commons-temporal-panel {
  min-height: 38px;
  padding-top: 6px;
  gap: 10px;
}
.commons-side-stack {
  min-width: 0;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  border: 1px solid var(--line);
  background: rgba(244,242,234,.42);
}
.commons-side-stack .commons-inspector {
  min-height: 0;
  padding: 13px 14px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
}
.commons-side-stack .commons-inspector h2 { margin: 7px 0 7px; font-size: clamp(21px, 1.8vw, 27px); }
.commons-side-stack .commons-inspector dl { margin-top: 10px; }
.commons-side-stack .commons-inspector dl div { padding: 6px 0; }
.commons-side-stack .commons-place-meta { margin-top: 10px; }
.commons-side-stack .commons-observation-list { margin-top: 10px; }
.commons-side-stack .commons-observation-list article { padding: 8px 0; }
.commons-side-stack .commons-participate {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin: 0;
  padding: 13px 14px 18px;
  border-top: 0;
}
.commons-side-stack .commons-observe { padding-top: 14px; border-top: 1px solid var(--line-soft); }
.commons-side-stack .commons-block-head h2 {
  margin: 6px 0 10px;
  max-width: none;
  font-size: 20px;
  line-height: 1.08;
}
.commons-side-stack .commons-relation-readout > div { padding: 8px 8px 9px 0; }
.commons-side-stack .commons-relation-readout > div:nth-child(even) { padding-left: 8px; }
.commons-side-stack .commons-relation-readout strong { margin: 4px 0 2px; font-size: 14px; }
.commons-side-stack .commons-actions { margin-top: 10px; }
.commons-side-stack .commons-privacy-note { margin-top: 9px; line-height: 1.4; }
.commons-side-stack #commonsObservationForm { gap: 8px; }
.commons-side-stack #commonsObservationForm label { gap: 5px; }
.commons-side-stack #commonsObservationForm input,
.commons-side-stack #commonsObservationForm textarea { padding: 9px 10px; font-size: 14px; }
.commons-side-stack #commonsObservationForm textarea { min-height: 68px; resize: none; }

.home-commons { scroll-margin-top: 72px; }

@media (min-width: 761px) {
  .home-commons {
    height: calc(100svh - 72px);
    min-height: 620px;
    padding: 20px 0 16px;
    display: grid;
    grid-template-rows: auto auto auto minmax(0, 1fr) auto;
    align-content: stretch;
    gap: 8px;
    overflow: hidden;
  }
  .home-commons-head { grid-template-columns: minmax(0,1fr) auto; gap: 28px; align-items: end; }
  .home-commons-title h2 { margin: 6px 0 5px; font-size: clamp(36px, 3.8vw, 52px); }
  .commons-gateway-copy { font-size: clamp(14px, 1.05vw, 17px); line-height: 1.4; }
  .home-commons-metrics { margin-top: 4px; }
  .home-commons-metrics > div { padding-top: 8px; padding-bottom: 9px; }
  .home-commons-metrics strong { margin-top: 4px; font-size: clamp(20px, 2vw, 28px); }
  .home-commons-toolbar { margin-top: 0; padding-bottom: 6px; }
  .home-commons-horizon button { min-height: 34px; }
  .home-commons-map-mount { min-height: 0; height: auto; margin-top: 0; }
  .home-commons-foot { margin-top: 0; align-items: center; }
}

@media (min-width: 1260px) {
  .home-commons {
    margin-left: max(var(--pad), calc(var(--rail-w) + 52px));
    margin-right: var(--pad);
  }
  .commons-page {
    padding-left: max(var(--pad), calc(var(--rail-w) + 52px));
    padding-right: var(--pad);
  }
}

@media (max-width: 980px) {
  .commons-page .page-title { grid-template-columns: minmax(0,1fr) minmax(260px,.7fr); gap: 18px; }
  .commons-page .commons-map-layout { grid-template-columns: minmax(0,1fr) minmax(270px, 310px); }
  .commons-page .commons-map-frame { min-height: 0; }
  .commons-page .commons-inspector { min-height: 0; }
}

@media (max-width: 760px) {
  body[data-page-key="commons"] .scale-ui { top: 76px; }
  .commons-page {
    height: 100svh;
    padding: 76px 14px 10px;
    gap: 6px;
  }
  .commons-page .page-title {
    grid-template-columns: 1fr;
    gap: 4px;
    padding-bottom: 6px;
  }
  .commons-page .page-title h1 { margin-top: 3px; font-size: 34px; }
  .commons-page .page-title .page-intro { max-width: 78%; font-size: 13px; line-height: 1.3; }
  .commons-page .commons-status-line { min-height: 26px; padding: 3px 0; flex-direction: row; align-items: center; }
  .commons-page .commons-status-line p { max-width: 68%; text-align: right; font-size: 11px; line-height: 1.25; }
  .commons-page .commons-metrics {
    display: flex;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .commons-page .commons-metrics::-webkit-scrollbar { display: none; }
  .commons-page .commons-metrics article,
  .commons-page .commons-metrics article + article {
    flex: 0 0 106px;
    padding: 6px 10px 7px 0;
    border-top: 0;
    border-right: 1px solid var(--line-soft);
  }
  .commons-page .commons-metrics article + article { padding-left: 10px; }
  .commons-page .commons-metrics article:last-child { border-right: 0; }
  .commons-page .commons-metrics strong { margin-top: 3px; font-size: 20px; }
  .commons-page .commons-toolbar { min-height: 0; flex-direction: row; align-items: center; gap: 8px; overflow: hidden; }
  .commons-page .commons-layer-controls { flex: 1 1 auto; width: auto; overflow-x: auto; }
  .commons-page .commons-time-controls { flex: 0 0 auto; width: auto; gap: 5px; }
  .commons-page .commons-time-controls > span { display: none; }
  .commons-page .commons-horizon { width: auto; max-width: 128px; overflow-x: auto; }
  .commons-page .commons-layer-controls button,
  .commons-page .commons-horizon button { min-height: 36px; }
  .commons-page .commons-map-layout {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(245px, 1.15fr) minmax(175px, .85fr);
    gap: 7px;
    padding-top: 6px;
  }
  .commons-page .commons-map-frame { aspect-ratio: auto; }
  .commons-page .commons-map-legend { bottom: 27px; }
  .commons-page .commons-temporal-panel {
    display: flex;
    align-items: center;
    gap: 5px;
    min-height: 38px;
    overflow-x: auto;
  }
  .commons-page .commons-time-modes,
  .commons-page .commons-time-reference { width: auto; flex-wrap: nowrap; overflow: visible; }
  .commons-page .commons-time-modes button,
  .commons-page .commons-time-reference button { min-height: 36px; flex: 0 0 auto; }
  .commons-page .commons-hour-control { min-width: 130px; }
  .commons-side-stack { min-height: 0; }
  .commons-side-stack .commons-participate { margin: 0; }

  .home-commons {
    height: calc(100svh - 72px);
    min-height: 640px;
    margin: 0 18px;
    padding: 14px 0 12px;
    display: grid;
    grid-template-rows: auto auto auto minmax(0,1fr) auto;
    gap: 7px;
    overflow: hidden;
  }
  .home-commons-head { grid-template-columns: 1fr; gap: 8px; }
  .home-commons-title h2 { margin: 5px 0 4px; font-size: 32px; }
  .commons-gateway-copy { font-size: 14px; line-height: 1.35; }
  .commons-gateway-actions { width: auto; justify-self: start; }
  .commons-gateway-actions a { min-height: 38px; }
  .home-commons-metrics {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    margin-top: 0;
  }
  .home-commons-metrics > div,
  .home-commons-metrics > div + div,
  .home-commons-metrics > div:nth-child(even),
  .home-commons-metrics > div:nth-child(n+3) {
    min-width: 0;
    padding: 6px 6px 7px;
    border-top: 0;
    border-right: 1px solid var(--line-soft);
  }
  .home-commons-metrics > div:first-child { padding-left: 0; }
  .home-commons-metrics > div:last-child { border-right: 0; }
  .home-commons-metrics span { font-size: 11px; overflow-wrap: anywhere; }
  .home-commons-metrics strong { margin-top: 3px; font-size: 20px; }
  .home-commons-toolbar { margin-top: 0; padding-bottom: 5px; flex-direction: row; align-items: end; gap: 8px; }
  .home-commons-toolbar > div:first-child { min-width: 0; }
  .home-commons-toolbar small { display: none; }
  .home-commons-horizon { width: auto; overflow-x: auto; }
  .home-commons-horizon button { min-height: 36px; min-width: 44px; }
  .home-commons-map-mount { min-height: 0; height: auto; margin-top: 0; }
  .home-commons-map-mount .commons-preview-map { width: 100%; height: 100%; aspect-ratio: auto; }
  .home-commons-foot { margin-top: 0; flex-direction: row; gap: 8px; align-items: center; }
  .home-commons-foot .commons-gateway-privacy { max-width: 75%; line-height: 1.25; }
}

/* Archive edition */
.archive-filters { margin-bottom: 22px; }
.archive-series-key {
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 0;
  margin: 0 0 30px;
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
}
.archive-series-key span {
  min-width: 0;
  padding: 14px 16px 13px 0;
  color: var(--muted);
  font: 650 11px/1.4 var(--mono);
  letter-spacing: .045em;
}
.archive-series-key b {
  display: block;
  margin-bottom: 5px;
  color: var(--signal);
  font-weight: 750;
}
.archive-note-row {
  min-height: 74px;
  grid-template-columns: 96px minmax(0,1fr) minmax(190px,.31fr) 24px;
  gap: 18px;
  padding: 18px 0;
}
.archive-note-row h2 {
  max-width: 900px;
  font-size: clamp(19px,1.55vw,24px);
  line-height: 1.28;
  text-wrap: pretty;
}
.archive-note-row .note-meta { line-height: 1.55; }
.archive-note-row .arrow { justify-self: end; }
.archive-record-page .record-heading { padding-top: 4.2vh; padding-bottom: 52px; }
.archive-record-page .record-heading h1 {
  max-width: 940px;
  margin-bottom: 22px;
  font-size: clamp(38px,4.45vw,70px);
  line-height: 1.01;
  letter-spacing: -.038em;
  text-wrap: balance;
}
html[lang="zh-CN"] .archive-record-page .record-heading h1 {
  max-width: 880px;
  font-family: var(--serif);
  font-weight: 560;
  font-size: clamp(37px,4.05vw,64px);
  letter-spacing: -.012em;
  line-height: 1.1;
  text-wrap: pretty;
}
.archive-record-page .record-deck {
  max-width: 780px;
  margin-top: 16px;
  color: #4e5b53;
  font-size: clamp(18px,1.55vw,24px);
  line-height: 1.7;
  text-wrap: pretty;
}
.archive-record-page .record-detail { gap: 48px; }
.archive-record-page .record-body { max-width: 720px; }
html[lang="zh-CN"] .archive-record-page .record-body { max-width: 700px; }
.archive-record-page .record-body > p {
  margin: 0 0 1.68em;
  color: #2f3b33;
  font-family: var(--serif);
  font-size: clamp(18px,1.12vw,20.5px);
  line-height: 1.96;
  text-wrap: pretty;
}
html[lang="zh-CN"] .archive-record-page .record-body > p {
  margin-bottom: 1.78em;
  line-height: 2.08;
  letter-spacing: .006em;
}
.archive-record-page .record-body h2 {
  margin: 2.85em 0 .9em;
  color: var(--fg);
  font-family: var(--serif);
  font-size: clamp(25px,2.2vw,34px);
  line-height: 1.24;
  font-weight: 560;
  letter-spacing: -.02em;
  text-wrap: pretty;
}
html[lang="zh-CN"] .archive-record-page .record-body h2 {
  letter-spacing: -.01em;
}
.archive-record-page .archive-figure {
  width: min(100%, 720px);
  margin: 44px auto 18px;
  overflow: hidden;
}
.archive-record-page .archive-figure.is-portrait { width: min(100%, 520px); }
.archive-record-page .archive-figure.is-compact { width: min(100%, 620px); }
.archive-record-page .archive-figure.is-wide { width: min(100%, 900px); }
.archive-record-page .archive-figure.is-ultrawide { width: min(100%, 980px); }
.archive-record-page .archive-figure img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 66svh;
  object-fit: contain;
  border: 1px solid rgba(21,32,25,.11);
  background: rgba(255,255,255,.18);
}
.archive-record-page .archive-figure.is-portrait img { max-height: 72svh; }
.archive-record-page .archive-caption {
  width: min(100%, 720px);
  margin: 10px auto 38px !important;
  color: var(--muted) !important;
  font: 550 12px/1.72 var(--mono) !important;
  letter-spacing: .01em;
}
.archive-record-page .archive-figure.is-wide + .archive-caption,
.archive-record-page .archive-figure.is-ultrawide + .archive-caption { width: min(100%, 900px); }
.archive-record-page .archive-note,
.archive-record-page .archive-source-note {
  display: block;
  margin: 32px 0;
  padding: 17px 18px;
  border-left: 2px solid rgba(166,70,36,.55);
  background: rgba(166,70,36,.045);
  color: #4d5a52;
  font: 600 12px/1.7 var(--mono);
}
.archive-record-page .archive-source-note {
  margin-top: 54px;
  border-left-color: rgba(21,32,25,.28);
  background: rgba(21,32,25,.025);
}
.archive-record-page .archive-references {
  margin: 0;
  padding-left: 1.5em;
  color: #46534b;
}
.archive-record-page .archive-references li {
  margin: 0 0 10px;
  padding-left: .35em;
  font: 500 13px/1.62 var(--mono);
}
.archive-record-page .record-conditions dl {
  grid-template-columns: repeat(5,minmax(0,1fr));
}

@media (max-width: 1180px) {
  .archive-series-key { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .archive-record-page .record-conditions dl { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 760px) {
  .archive-filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    margin-right: -18px;
    padding-right: 18px;
    scrollbar-width: none;
  }
  .archive-filters::-webkit-scrollbar { display: none; }
  .archive-filters button { flex: 0 0 auto; min-height: 44px; }
  .archive-series-key { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .archive-series-key span { padding-right: 10px; }
  .archive-note-row { min-height: 0; padding: 19px 0; }
  .archive-note-row h2 { font-size: 20px; line-height: 1.32; }
  .archive-record-page .record-heading { padding-top: 2.5vh; padding-bottom: 38px; }
  .archive-record-page .record-heading h1 { max-width: 100%; font-size: clamp(32px,9.6vw,52px); line-height: 1.08; }
  html[lang="zh-CN"] .archive-record-page .record-heading h1 { font-size: clamp(32px,9.2vw,50px); line-height: 1.12; }
  .archive-record-page .record-deck { max-width: 100%; margin-top: 14px; font-size: 18px; line-height: 1.7; }
  .archive-record-page .record-body,
  html[lang="zh-CN"] .archive-record-page .record-body { max-width: 100%; }
  .archive-record-page .record-body > p { font-size: 18px; line-height: 1.94; margin-bottom: 1.58em; }
  html[lang="zh-CN"] .archive-record-page .record-body > p { line-height: 2.02; margin-bottom: 1.68em; }
  .archive-record-page .record-body h2 { font-size: 26px; margin-top: 2.35em; }
  .archive-record-page .record-conditions dl { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .archive-record-page .archive-figure,
  .archive-record-page .archive-figure.is-compact,
  .archive-record-page .archive-figure.is-wide,
  .archive-record-page .archive-figure.is-ultrawide { width: 100%; margin-top: 34px; }
  .archive-record-page .archive-figure.is-portrait { width: min(86vw, 430px); }
  .archive-record-page .archive-figure img { max-height: none; }
  .archive-record-page .archive-figure.is-wide,
  .archive-record-page .archive-figure.is-ultrawide {
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    padding-bottom: 5px;
  }
  .archive-record-page .archive-figure.is-wide img { width: 620px; max-width: none; }
  .archive-record-page .archive-figure.is-ultrawide img { width: 760px; max-width: none; }
  .archive-record-page .archive-caption,
  .archive-record-page .archive-figure.is-wide + .archive-caption,
  .archive-record-page .archive-figure.is-ultrawide + .archive-caption { width: 100%; }
}
.archive-record-page .record-body > p.is-dense {
  max-width: 680px;
  line-height: 2.04;
}
html[lang="zh-CN"] .archive-record-page .record-body > p.is-dense { line-height: 2.14; }
.archive-record-page .record-body > p + .archive-figure { margin-top: 36px; }
.archive-record-page .record-body strong { font-weight: 650; }

.archive-inline-link {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(166,70,36,.34);
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}
.archive-inline-link:hover { color: var(--signal); text-decoration-color: currentColor; }
/* WeChat archive provenance */
.wechat-archive-portal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 30px;
  align-items: center;
  margin: 68px 0 8px;
  padding: 22px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.wechat-archive-copy { max-width: 680px; }
.wechat-archive-copy h2 {
  margin: 8px 0 6px;
  font: 500 clamp(22px, 2vw, 30px)/1.15 var(--serif);
  color: var(--ink);
}
.wechat-archive-copy p {
  margin: 0;
  max-width: 620px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--muted);
}
.wechat-archive-code {
  margin: 0;
  display: grid;
  justify-items: center;
  gap: 7px;
}
.wechat-archive-code img {
  display: block;
  width: 112px;
  height: 112px;
  padding: 5px;
  object-fit: contain;
  background: #fff;
  border: 1px solid var(--line);
}
.wechat-archive-code figcaption {
  font: 600 10px/1.2 var(--mono);
  letter-spacing: .08em;
  color: var(--muted);
}
.record-wechat-portal {
  grid-column: 2;
  width: min(100%, 840px);
  margin-top: 48px;
}
@media (max-width: 820px) {
  .wechat-archive-portal { margin-top: 46px; gap: 20px; }
  .record-wechat-portal { grid-column: 1; }
  .wechat-archive-code img { width: 100px; height: 100px; }
}
@media (max-width: 540px) {
  .wechat-archive-portal {
    grid-template-columns: minmax(0, 1fr) 92px;
    gap: 16px;
    padding: 18px 0;
  }
  .wechat-archive-copy h2 { font-size: 21px; }
  .wechat-archive-copy p { font-size: 13px; }
  .wechat-archive-code img { width: 88px; height: 88px; padding: 4px; }
  .wechat-archive-code figcaption { font-size: 9px; letter-spacing: .05em; text-align: center; }
}

.archive-channel {
  margin: 26px 0 42px;
  padding: 18px 0;
}
.archive-channel .wechat-archive-code img { width: 96px; height: 96px; }
