/* SIVIA Level（図面 01）だけの配置。色は sivia-tokens.css の変数のみ。 */

/* ── 1画面目 ── */
.lv-hero{padding-top:var(--s-4);row-gap:var(--s-5);align-items:end}
@media (max-width:900px){.lv-hero{row-gap:var(--s-3)}}
.lv-hero-text{grid-column:1/8;display:grid;row-gap:var(--s-3)}
.lv-mega{font-family:var(--en);font-weight:600;text-transform:uppercase;letter-spacing:.02em;line-height:.78;
  font-size:clamp(96px,17vw,240px);color:var(--sivia-red);margin:var(--s-2) 0 var(--s-1)}
.lv-hero h1{font-size:44px;line-height:1.45}
.lv-hero .lead{max-width:34em}
.lv-hero-foot{display:grid;row-gap:var(--s-3);margin-top:var(--s-2)}
.lv-spec{max-width:560px}
.lv-phone{grid-column:9/13;margin:0;display:grid;grid-template-columns:1fr 20px;column-gap:var(--s-2);align-self:center}
.phone-frame{padding:var(--s-2)}
.phone-frame img,.phone-frame video{width:100%;aspect-ratio:860/1869;object-fit:cover;background:var(--sivia-paper-2)}

/* ── 触れる野帳 ── */
.try-guide{grid-column:1/4;align-self:start;position:sticky;top:var(--s-6);display:grid;row-gap:var(--s-3);font-family:var(--jp)}
.try-steps{margin:0;padding:0;list-style:none;counter-reset:s;display:grid;row-gap:var(--s-2)}
.try-steps li{counter-increment:s;position:relative;padding-left:32px;color:var(--sivia-brown)}
.try-steps li::before{content:counter(s);position:absolute;left:0;top:0;font-family:var(--en);font-weight:600;color:var(--sivia-red);font-variant-numeric:tabular-nums}
.try-steps b{font-weight:500;color:var(--sivia-ink)}
.fieldbook{grid-column:5/-1;min-width:0}
.fb-tools{display:flex;gap:var(--s-2);margin-bottom:var(--s-3)}
.fb-scroll{overflow-x:auto;padding:var(--s-2)}
.fb{display:grid;grid-template-columns:minmax(104px,1.3fr) repeat(5,minmax(76px,1fr));min-width:560px;
  border:1px solid var(--line-2);background:var(--sivia-paper);font-variant-numeric:tabular-nums}
.fb .h{grid-row:1;padding:var(--s-1) 12px;background:var(--sivia-paper-3);border-bottom:1px solid var(--line-2);
  border-right:1px solid var(--line-3);font-family:var(--en);font-weight:600;font-size:14px;letter-spacing:.1em;line-height:1.3;
  text-transform:uppercase;color:var(--sivia-brown)}
.fb .h:nth-child(6){border-right:0}
.fb .c{border-right:1px solid var(--line-3);border-bottom:1px solid var(--line-3);display:flex;flex-direction:column;justify-content:center;
  padding:0 12px;min-width:0;position:relative}
.fb .c.grade{border-right:0}
.fb .sta{flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;font-family:var(--en);font-weight:600;font-size:16px;letter-spacing:.04em}
.fb .sta.is-blocked{color:var(--sivia-neutral-600)}
.fb .kind{font-family:var(--en);font-weight:600;font-size:14px;letter-spacing:.06em;color:var(--sivia-red);
  background:none;border:0;padding:2px 4px;align-self:flex-start;margin-top:6px}
.fb button.kind{border:1px solid var(--line-2);color:var(--sivia-brown);cursor:pointer;line-height:1.2;min-height:24px}
.fb button.kind:hover{border-color:var(--sivia-red);color:var(--sivia-red)}
.fb input{width:100%;min-width:0;border:0;border-bottom:1px solid transparent;background:transparent;padding:2px 0;
  font:inherit;font-family:var(--en);font-weight:400;font-size:18px;color:var(--sivia-ink);font-variant-numeric:tabular-nums;border-radius:0}
.fb input:hover{border-bottom-color:var(--line-2)}
.fb input:focus{outline:none;border-bottom-color:var(--sivia-red);background:var(--sivia-red-100)}
.fb .c.is-bad{background:var(--sivia-red-100);outline:1px solid var(--sivia-danger);outline-offset:-1px}
.fb .c.is-bad input{border-bottom-color:var(--sivia-danger)}
.fb .ih{font-family:var(--en);font-weight:600;font-size:18px;color:var(--sivia-terracotta-text)}
.fb .gh output{font-family:var(--en);font-weight:600;font-size:20px;color:var(--sivia-ink)}
.fb .gh input{font-weight:600;font-size:20px}
.fb .dist,.fb .grade{background:var(--sivia-paper)}
.fb .grade .rise{font-family:var(--en);font-size:14px;color:var(--sivia-olive-text);line-height:1.2}
.fb .grade .pct{font-family:var(--en);font-weight:600;font-size:18px;color:var(--sivia-red);line-height:1.2}
.fb-msg{min-height:1.9em;margin:var(--s-2) 0 0;color:var(--sivia-danger);font-size:14px}
.fb-summary{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-2);flex-wrap:wrap;
  margin-top:var(--s-3);padding-top:var(--s-2);border-top:1px solid var(--line)}
.fb-status{font-family:var(--en);font-weight:600;font-size:16px;letter-spacing:.06em;color:var(--sivia-brown)}
.fb-scroll-x{overflow-x:auto}
.fb-profile{width:100%;min-width:560px;height:auto;margin-top:var(--s-2)}
.fb-profile .p-grid{stroke:var(--sivia-neutral-300);stroke-width:1;fill:none}
.fb-profile .p-sta{stroke:var(--sivia-neutral-400);stroke-width:1;fill:none;stroke-dasharray:3 4}
.fb-profile .p-line{stroke:var(--sivia-red);stroke-width:2.5;fill:none;stroke-linejoin:round}
.fb-profile .p-pt{fill:var(--sivia-paper);stroke:var(--sivia-red);stroke-width:2}
.fb-profile text{font-family:var(--en);font-weight:600;font-size:18px;letter-spacing:.04em}
.fb-profile .t-axis{fill:var(--sivia-neutral-700);font-size:16px}
.fb-profile .t-name{fill:var(--sivia-brown)}
.fb-profile .t-muted{fill:var(--sivia-neutral-700);font-family:var(--jp);font-weight:400}

/* ── 機能 ── */
.feat{grid-column:1/-1;margin:0}
.feat>div{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding:var(--s-4) 0;border-bottom:1px solid var(--line-3)}
.feat>div:first-child{border-top:1px solid var(--line)}
.feat dt{grid-column:1/5;font-family:var(--jp);font-weight:500;font-size:24px;line-height:1.5}
.feat dt .no{display:block;font-family:var(--en);font-weight:600;font-size:14px;letter-spacing:.12em;color:var(--sivia-red);margin-bottom:var(--s-1)}
.feat dd{grid-column:5/12;margin:0;color:var(--sivia-brown)}

/* ── 画面（詳細図） ── */
.screens{grid-column:1/-1;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--gap);row-gap:var(--s-4)}
.screens figure{margin:0}
.screens .shot{padding:var(--s-1);transition:transform var(--dur-s) var(--ease)}
.screens .shot img{width:100%}
.screens li:hover .shot{transform:translateY(-6px)}
.screens figcaption{margin-top:var(--s-2);display:flex;gap:var(--s-2);align-items:baseline;font-family:var(--jp)}
.screens .det{font-family:var(--en);font-weight:600;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--sivia-red)}
.screens li:nth-child(even){margin-top:var(--s-7)}

/* ── 注記 ── */
.lv-notes{grid-column:4/11;margin:0;padding:0;list-style:none;counter-reset:n}
.lv-notes li{counter-increment:n;position:relative;padding:var(--s-2) 0 var(--s-2) 48px;border-bottom:1px solid var(--line-3);font-family:var(--jp)}
.lv-notes li::before{content:counter(n) ".";position:absolute;left:0;top:var(--s-2);font-family:var(--en);font-weight:600;color:var(--sivia-red)}

@media (max-width:1180px){
  .fieldbook{grid-column:4/-1}
}
@media (max-width:900px){
  .lv-hero-text{display:contents}
  .lv-hero-text>*{grid-column:1/-1}
  .lv-hero-foot{order:3}
  .lv-phone{order:2}
  .lv-hero h1{font-size:32px}
  .lv-phone{grid-column:3/11}
  .try-guide{grid-column:1/-1;position:static;margin-bottom:var(--s-4)}
  .fieldbook{grid-column:1/-1}
  .feat dt,.feat dd{grid-column:1/-1}
  .feat dd{margin-top:var(--s-1)}
  .screens{grid-template-columns:repeat(2,minmax(0,1fr))}
  .screens li:nth-child(even){margin-top:var(--s-5)}
  .lv-notes{grid-column:1/-1}
}
@media (max-width:560px){
  .lv-phone{grid-column:1/-1;max-width:300px;justify-self:center;width:100%}
  .fb-scroll{padding:var(--s-1)}
}