/* 親トップ（図面 00）だけの配置。色は sivia-tokens.css の変数のみ。 */
.cover{min-height:calc(100svh - 96px);align-content:space-between;row-gap:var(--s-5);padding-top:var(--s-3);padding-bottom:var(--s-4)}
/* 右端は標尺目盛の読み（4.000）が来るので空けておく */
.cover-meta{grid-column:1/-1;display:flex;justify-content:space-between;gap:var(--s-2);flex-wrap:wrap;padding-right:var(--s-6)}
.cover-meta .coord{color:var(--sivia-neutral-700)}
.cover-mark{grid-column:1/-1;display:grid;row-gap:var(--s-2)}
.cover-mark .wordmark{width:100%;height:auto}
.cover-copy{grid-column:1/-1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:end;row-gap:var(--s-3)}
.cover-copy h1{grid-column:1/7;font-size:44px;line-height:1.45;color:var(--sivia-ink)}
.cover-copy .lead{grid-column:7/12}
.cover-profile{grid-column:1/-1;margin:0;position:relative}
/* 縦断線を読む（カーソルの位置の測点と GH） */
.probe{position:absolute;left:0;top:0;width:100%;height:140px;pointer-events:none;opacity:0;transition:opacity var(--dur-s) var(--ease)}
.cover-profile.is-probing .probe{opacity:1}
.probe-x{position:absolute;top:0;bottom:-8px;left:var(--px,0);width:1px;background:var(--sivia-terracotta)}
.probe-dot{position:absolute;left:var(--px,0);top:var(--py,0);width:9px;height:9px;margin:-4px 0 0 -4px;background:var(--sivia-paper);border:2px solid var(--sivia-terracotta)}
.probe-read{position:absolute;left:var(--px,0);top:calc(var(--py,0) - 40px);transform:translateX(12px);white-space:nowrap;padding:2px 8px;
  background:var(--sivia-ink);color:var(--sivia-paper);font-family:var(--en);font-weight:600;font-size:14px;letter-spacing:.06em;font-variant-numeric:tabular-nums}
.probe-read.flip{transform:translateX(calc(-100% - 12px))}
.profile-svg{width:100%;height:140px}
.profile-svg .grid-ln{stroke:var(--sivia-neutral-300);stroke-width:1;fill:none;vector-effect:non-scaling-stroke}
.profile-svg .path{stroke:var(--sivia-red);stroke-width:2;fill:none;vector-effect:non-scaling-stroke}
.profile-svg .sta path{stroke:var(--sivia-ink);stroke-width:1;vector-effect:non-scaling-stroke}
.profile-sta{list-style:none;margin:var(--s-1) 0 0;padding:0;display:flex;justify-content:space-between;
  font-family:var(--en);font-weight:600;font-size:14px;letter-spacing:.06em;color:var(--sivia-brown);font-variant-numeric:tabular-nums}
.profile-sta li{width:0;display:flex;justify-content:center;white-space:nowrap}
.profile-sta li:first-child{justify-content:flex-start}
.profile-sta li:last-child{justify-content:flex-end}
.cover-next{grid-column:1/-1;justify-self:center;display:flex;flex-direction:column;align-items:center;gap:var(--s-1);
  text-decoration:none;color:var(--sivia-brown);font-size:14px}
.cover-next .ln{display:block;width:1px;height:48px;background:var(--sivia-red)}

.film-text{grid-column:1/7;align-self:end;display:grid;row-gap:var(--s-5)}
.film-lead{font-family:var(--jp);font-size:24px;line-height:2;color:var(--sivia-ink)}
.film{grid-column:7/13;margin:0;display:grid;grid-template-columns:1fr 20px;column-gap:var(--s-2)}
.film-frame{display:block;position:relative;padding:var(--s-2);text-decoration:none;color:var(--sivia-ink)}
.film-frame img{width:100%;aspect-ratio:9/16;object-fit:cover;background:var(--sivia-paper-2);transition:transform var(--dur-l) var(--ease)}
.film-frame:hover img{transform:scale(1.015)}
.film-play{position:absolute;left:50%;bottom:var(--s-6);transform:translateX(-50%);display:flex;align-items:center;gap:var(--s-2);
  padding:var(--s-2) var(--s-3);background:var(--sivia-ink);color:var(--sivia-paper);font-size:14px}
.film-play-icon{width:0;height:0;border-left:12px solid var(--sivia-paper);border-top:7px solid transparent;border-bottom:7px solid transparent}
.film-frame:hover .film-play,.film-frame:focus-visible .film-play{background:var(--sivia-red)}
/* 再生: 画面の高さいっぱい（縦長） */
.film-dialog{padding:0;border:0;background:transparent;max-width:100vw;max-height:100vh;overflow:visible}
.film-dialog::backdrop{background:var(--sivia-ink);opacity:.94}
.film-dialog video{display:block;height:min(92vh,calc(92vw * 16 / 9));width:auto;max-width:92vw;background:var(--sivia-ink)}
.film-close{position:fixed;top:var(--s-3);right:var(--s-3);border-color:var(--sivia-paper);color:var(--sivia-paper)}
.film-close:hover{background:var(--sivia-paper);color:var(--sivia-ink)}
.notes-cap{margin-top:var(--s-2)}

@media (max-width:900px){
  .cover{min-height:auto}
  .cover-meta{padding-right:0}
  .cover-copy h1,.cover-copy .lead{grid-column:1/-1}
  .cover-copy h1{font-size:32px}
  .profile-svg{height:96px}
  .profile-sta li:nth-child(even){visibility:hidden}
  .film-text{grid-column:1/-1;margin-bottom:var(--s-5)}
  .film-lead{font-size:20px}
  .film{grid-column:2/12}
}
@media (max-width:560px){
  .cover-copy h1{font-size:32px}
  .cover-meta .coord{display:none}
}
/* Slope の見本は横向き */
.index-row .peek.land{width:240px}
.cover-profile{touch-action:pan-y}