/* =====================================================================
   Interior: lobby, overview, floors, proposal
   Same world as the exterior: stone-grey ground, royal navy serif, indigo
   only for action and the active floor, champagne gold only on metal.
   ===================================================================== */
[hidden] { display: none !important; }
[tabindex="-1"]:focus { outline: none; }
.interior p, .interior dd, .interior li { text-wrap: pretty; }
.sd-body, .ov-sub, .lede, .fh-sub, .why p { text-wrap: balance; }
.noscript { margin: 24px; padding: 16px 20px; background: var(--white); border: 1px solid var(--hairline); border-radius: 12px; }
.muted { color: var(--navy-soft); }
.fine { margin: 12px 0 0; font-size: 14px; line-height: 1.75; color: var(--navy-soft); }
.lede { margin: 6px 0 22px; font-size: 16px; line-height: 1.8; color: var(--navy-soft); max-width: 62ch; }
.h2 { margin: 0; font-family: var(--serif); font-weight: 700; font-size: 26px; line-height: 1.35; letter-spacing: .04em; color: var(--navy); }
.h3 { margin: 0 0 8px; font-family: var(--serif); font-weight: 700; font-size: 20px; line-height: 1.4; letter-spacing: .03em; color: var(--navy); }
.text-btn { appearance: none; border: 0; background: none; padding: 4px 2px; font: inherit; color: var(--indigo); cursor: pointer; display: inline-flex; align-items: center; gap: 4px; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.text-btn:disabled { color: #9AA3BC; cursor: default; text-decoration: none; }
.text-link { color: var(--indigo); text-underline-offset: 4px; margin-left: 8px; }
.ic.flip { transform: scaleX(-1); }
.diamond { display: inline-block; width: 12px; height: 12px; background: linear-gradient(135deg, #D8BE85, #A9853D); transform: rotate(45deg); border: 1.5px solid #fff; box-shadow: 0 1px 3px rgb(110 80 20 / .35); flex: none; }

/* buttons outside the comp frame use real px */
.interior .btn-primary, .dock .btn-primary {
  min-height: 48px; padding: 0 26px; font-size: 16px; letter-spacing: .08em;
  box-shadow: 0 6px 18px rgb(40 34 160 / .26), inset 0 1px 0 rgb(255 255 255 / .2);
}
.interior .btn-primary .ic { font-size: 18px; }
.btn-primary:disabled, .btn-primary[aria-busy="true"] { opacity: .6; cursor: progress; transform: none; }
.btn-primary { border: 0; cursor: pointer; font-family: var(--serif); }
.btn-line {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 0 22px; border-radius: 999px;
  border: 1.5px solid var(--navy); background: rgb(255 255 255 / .85); color: var(--navy);
  font-family: var(--serif); font-weight: 700; font-size: 15px; letter-spacing: .06em; text-decoration: none; cursor: pointer;
  transition: background-color .2s var(--ease-out), color .2s var(--ease-out), border-color .2s var(--ease-out);
}
.btn-line:hover { background: var(--navy); color: var(--white); }
.btn-line .ic { font-size: 18px; }

/* ---------- shell ---------- */
.interior {
  --rail: 112px; --dockw: 404px;
  display: grid;
  grid-template-columns: var(--rail) minmax(0, 1fr) var(--dockw);
  grid-template-rows: 56px minmax(calc(100vh - 56px), auto);
  min-height: 100vh; min-height: 100dvh;
  background: linear-gradient(180deg, var(--ground-top), var(--ground) 40%);
}
.bar {
  grid-column: 1 / -1; position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; gap: 24px; padding: 0 32px 0 28px;
  background: rgb(255 255 255 / .96); border-bottom: 1px solid var(--hairline);
}
.bar-mark { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--navy); font-family: var(--sans); font-weight: 600; font-size: 21px; letter-spacing: -.01em; }
.bar-mark .brand-logo { height: 34px; }
.bar-mark span { font-family: var(--serif); font-weight: 700; font-size: 15px; letter-spacing: .16em; color: var(--gold); }
.steps-inline { margin-left: auto; display: flex; gap: 28px; }
.steps-inline a { font-weight: 600; font-size: 14px; letter-spacing: .04em; color: var(--navy); text-decoration: none; padding: 17px 0 15px; border-bottom: 2px solid transparent; transition: color .2s var(--ease-out), border-color .2s var(--ease-out); }
.steps-inline a:hover { color: var(--indigo); }
.steps-inline a[aria-current] { color: var(--indigo); border-bottom-color: var(--indigo); }
.card-toggle { display: none; }

/* the gold lift panel */
.lift {
  grid-column: 1; grid-row: 2; position: sticky; top: 56px; align-self: start;
  height: calc(100vh - 56px);
  display: flex; flex-direction: column; justify-content: space-between; padding: 26px 0 22px;
  background: #C4A468 url("../assets/plates/brass-rail.webp") center / 100% 100% no-repeat;
  box-shadow: inset -1px 0 0 rgb(80 56 16 / .35), 4px 0 14px -2px rgb(80 56 16 / .18);
  z-index: 5;
}
/* the brass column always reaches the bottom, even when the sticky panel is shorter than the page */
.interior::before { content: ""; grid-column: 1; grid-row: 2; background: #C4A468 url("../assets/plates/brass-rail.webp") center top / 100% 100vh repeat-y; box-shadow: inset -1px 0 0 rgb(80 56 16 / .35); }
.lift-buttons, .lift-extra { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; align-items: center; gap: 18px; }
.lift-extra { gap: 14px; padding-top: 18px; border-top: 1px solid rgb(90 64 20 / .28); margin: 0 18px; }
.lift-btn { display: flex; flex-direction: column; align-items: center; gap: 6px; text-decoration: none; color: #3A2A0C; }
.lb-n {
  display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%;
  font-family: var(--serif); font-weight: 700; font-size: 26px; color: var(--navy);
  background: url("../assets/plates/lift-btn.webp") center / 158% no-repeat;
  text-shadow: 0 1px 0 rgb(255 246 221 / .7);
  transition: transform .2s var(--ease-out), color .2s var(--ease-out);
}
.lift-small .lb-n { width: 44px; height: 44px; font-size: 20px; }
.lift-small .lb-n .ic { width: 22px; height: 22px; }
.lb-t { font-family: var(--serif); font-weight: 700; font-size: 13px; letter-spacing: .06em; text-shadow: 0 1px 0 rgb(255 240 200 / .5); }
.lift-btn:hover .lb-n { transform: translateY(-1px); }
.lift-btn:active .lb-n { transform: translateY(1px); }
.lift-btn[aria-current] .lb-n { color: var(--white); text-shadow: 0 1px 2px rgb(20 16 90 / .6); background-image: url("../assets/plates/lift-btn-lit.webp"); background-size: 154%; }
.lift-btn.is-visited .lb-n { position: relative; }
.lift-btn.is-visited .lb-n::after { content: ""; position: absolute; right: 2px; top: 2px; width: 12px; height: 12px; border-radius: 50%; background: var(--indigo); border: 2px solid #FFF6DD; }

.stage { grid-column: 2; grid-row: 2; min-width: 0; }
.dock { grid-column: 3; grid-row: 2; position: sticky; top: 56px; align-self: start; max-height: calc(100vh - 56px); overflow: auto; padding: 28px 28px 32px 8px; }
.dock .plan.plan-docked { position: relative; inset: auto; left: auto; top: auto; width: 100%; height: auto; aspect-ratio: 583.5 / 480; --cu: calc(100cqw / 440); }
.dock-close { display: none; }
.dock-meta { margin-top: 14px; padding: 0 10px; }
.meta-fees { margin: 0; display: grid; gap: 2px; }
.meta-fees div { display: flex; justify-content: space-between; align-items: baseline; padding: 9px 0; border-bottom: 1px solid var(--hairline); }
.meta-fees dt { font-family: var(--serif); font-weight: 700; font-size: 14px; letter-spacing: .08em; }
.meta-fees dd { margin: 0; font-variant-numeric: tabular-nums; font-weight: 600; font-size: 16px; }
.meta-note { margin: 10px 0 0; font-size: 13px; line-height: 1.7; color: var(--navy-soft); }
.meta-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.meta-actions > * { flex: 1 1 auto; }
body[data-view="lobby"] .dock:not(.is-open), body[data-view="proposal"] .dock:not(.is-open) { display: none; }
body[data-view="lobby"] .stage, body[data-view="proposal"] .stage { grid-column: 2 / -1; }

/* ---------- lobby ---------- */
.lobby { padding: 0 0 28px; }
.lobby-stage { --lu: calc(100cqw / 1400); position: relative; container-type: inline-size; aspect-ratio: 2048 / 928; overflow: hidden; }
.lobby-plate { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lobby-sign {
  position: absolute; left: 22%; width: 47%; top: 19.5%; margin: 0;
  display: flex; justify-content: center; align-items: baseline; gap: calc(var(--lu) * 18);
  color: #9E7A33; white-space: nowrap;
  text-shadow: 0 1px 0 rgb(255 255 255 / .9), 0 calc(var(--lu) * 3) calc(var(--lu) * 5) rgb(110 80 20 / .25);
}
.ls-latin { font-family: var(--serif); font-weight: 700; font-size: calc(var(--lu) * 64); letter-spacing: -.005em; }
.ls-cjk { font-family: var(--serif); font-weight: 700; font-size: calc(var(--lu) * 58); letter-spacing: .04em; }
.lobby-rule { position: absolute; left: 24.5%; width: 41.5%; top: 36.8%; height: 2px; display: flex; align-items: center; background: linear-gradient(90deg, #B39256 0 47%, transparent 47% 53%, #B39256 53%); }
.lobby-rule i { margin: 0 auto; width: calc(var(--lu) * 12); height: calc(var(--lu) * 12); background: #B39256; transform: rotate(45deg); }
.lobby-parties { position: absolute; left: 20%; width: 51%; top: 41%; margin: 0; display: flex; justify-content: center; gap: calc(var(--lu) * 24); align-items: center; font-family: var(--serif); font-weight: 500; font-size: calc(var(--lu) * 21); letter-spacing: .14em; color: #6E5520; white-space: nowrap; }
.lobby-parties b { font-weight: 700; color: var(--navy); }
.lobby-parties .sep { width: 1px; height: 1.1em; background: #B39256; }
.desk-ask { position: absolute; left: 25%; width: 40%; top: 65.5%; display: flex; align-items: center; justify-content: center; gap: calc(var(--lu) * 14); }
.desk-ask label { font-family: var(--serif); font-weight: 700; font-size: calc(var(--lu) * 19); letter-spacing: .08em; color: var(--navy); white-space: nowrap; }
.desk-ask input {
  width: calc(var(--lu) * 250); height: calc(var(--lu) * 42); min-height: 34px; padding: 0 14px;
  font: inherit; font-size: max(15px, calc(var(--lu) * 17)); color: var(--navy);
  background: rgb(255 255 255 / .92); border: 1px solid #C8B98F; border-radius: 8px;
  box-shadow: inset 0 1px 2px rgb(0 0 0 / .06);
}
.desk-ask input:focus { outline: 2px solid var(--indigo); outline-offset: 1px; border-color: transparent; }
.desk-actions { position: absolute; left: 22.5%; width: 45%; top: 74.5%; display: flex; justify-content: center; gap: calc(var(--lu) * 18); }
.interior .desk-actions .btn-primary, .desk-actions .btn-line { min-height: calc(var(--lu) * 54); padding: 0 calc(var(--lu) * 26); font-size: max(14px, calc(var(--lu) * 17)); }
/* the board is a plate (directory.png 640x1504): navy band 3.9-14.3%, board 5.3-94.5% x, to 95.2% y */
.directory {
  position: absolute; left: 82.6%; width: 16%; top: 5%; aspect-ratio: 640 / 1504;
  background: url("../assets/plates/directory.webp") center / 100% 100% no-repeat;
}
.directory h2 { position: absolute; left: 9%; right: 9%; top: 3.9%; height: 10.4%; margin: 0; display: flex; align-items: center; color: var(--white); font-family: var(--serif); font-weight: 700; font-size: calc(var(--lu) * 25); letter-spacing: .14em; }
.directory ol { position: absolute; left: 8%; right: 8%; top: 15.5%; list-style: none; margin: 0; padding: 0 calc(var(--lu) * 4); }
.directory li + li { border-top: 1px solid var(--hairline); }
.directory a { display: flex; gap: calc(var(--lu) * 14); align-items: center; padding: calc(var(--lu) * 13) calc(var(--lu) * 4); color: var(--navy); text-decoration: none; }
.directory a:hover .d-q { color: var(--indigo); }
.directory b { font-family: var(--serif); font-size: calc(var(--lu) * 20); }
.directory .d-q { display: block; font-family: var(--serif); font-weight: 700; font-size: calc(var(--lu) * 16.5); letter-spacing: .06em; transition: color .2s var(--ease-out); }
.directory .d-s { display: block; margin-top: 2px; font-size: calc(var(--lu) * 12.5); color: var(--navy-soft); letter-spacing: .04em; }
.interior .directory .dir-card { position: absolute; left: 12%; right: 12%; bottom: 8.5%; display: flex; min-height: calc(var(--lu) * 44); padding: 0 calc(var(--lu) * 10); font-size: calc(var(--lu) * 15); border-radius: calc(var(--lu) * 6); width: auto; box-shadow: 0 calc(var(--lu) * 4) calc(var(--lu) * 10) rgb(40 34 160 / .25); }
.lobby-note { margin: 18px 32px 0; font-size: 14px; color: var(--navy-soft); }

/* ---------- overview (cross-section) ---------- */
.overview { display: grid; grid-template-columns: auto minmax(300px, 400px); column-gap: 40px; align-items: center; padding: 26px 48px 28px; }
.overview > [data-band] { grid-column: 1 / -1; }
.ov-card { margin-top: 22px; }
.ov-card .plan.plan-docked { position: relative; inset: auto; left: auto; top: auto; width: 100%; height: auto; aspect-ratio: 583.5 / 480; --cu: calc(100cqw / 440); }
body[data-view="lift"] .dock:not(.is-open) { display: none; }
body[data-view="lift"] .stage { grid-column: 2 / -1; }
.ov-title { margin: 0; font-family: var(--serif); font-weight: 700; font-size: clamp(30px, 3.2vw, 50px); line-height: 1.3; letter-spacing: .05em; color: var(--navy); outline: none; }
.ov-sub { margin: 12px 0 0; font-size: 17px; line-height: 1.85; color: var(--navy); max-width: 40em; }
.ov-legend { margin: 14px 0 0; display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--navy-soft); }
.lg { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }
.lg-now { background: var(--indigo); box-shadow: 0 0 0 3px rgb(58 54 201 / .2); }
.lg-done { background: #C9AC6E; margin-left: 12px; }
.section-stage {
  --labels: 240px;
  --h: min(calc(100vh - 56px - 54px - 196px), 600px, calc((100vw - 112px - 96px - 440px - var(--labels)) / 1.21));
  position: relative; height: var(--h); padding-left: var(--labels); width: max-content; max-width: 100%;
}
.section-plate { display: block; height: 100%; width: auto; }
.section-floors { list-style: none; margin: 0; padding: 0; position: absolute; inset: 0; }
.sf { position: absolute; left: 0; width: calc(var(--labels) + var(--h) * .29); transform: translateY(-50%); }
.sf5 { top: 17.5%; } .sf4 { top: 32.4%; } .sf3 { top: 47%; } .sf2 { top: 61.7%; } .sf1 { top: 79.6%; }
.sf a { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--navy); padding: 6px 0; }
.sf b { font-family: var(--serif); font-size: 24px; flex: none; width: 1.7em; }
.sf span { font-family: var(--serif); font-weight: 700; font-size: 17px; letter-spacing: .06em; white-space: nowrap; padding: 3px 8px; border-radius: 6px; transition: background-color .2s var(--ease-out), color .2s var(--ease-out); }
.sf-line { flex: 1; height: 1px; background: currentColor; position: relative; opacity: .55; min-width: 16px; }
.sf-line::after { content: ""; position: absolute; right: -3px; top: -3px; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.sf a:hover { color: var(--indigo); }
.sf a.is-now { color: var(--indigo); }
.sf a.is-now span { background: var(--indigo); color: var(--white); }
.sf a.is-done b::after { content: ""; display: inline-block; width: 8px; height: 8px; margin-left: 6px; border-radius: 50%; background: #C9AC6E; vertical-align: middle; }

/* 1F strip (lobby and overview): plate floorplan-lobby.png cropped to its content (x 24-2281, y 163-604) */
.lobby-band { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 22px 32px 0; }
.overview .lobby-band { padding: 14px 0 0; grid-template-columns: 310px minmax(0, 1fr); gap: 16px; align-items: center; }
@container (max-width: 960px) { .lb-room .rs { display: none; } }
.lb-head { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: center; }
.lb-floor { margin: 0; grid-row: span 2; font-family: var(--serif); font-weight: 700; font-size: 52px; line-height: 1; padding-right: 14px; border-right: 1.5px solid rgb(20 42 110 / .5); }
.lb-title { margin: 0; font-family: var(--serif); font-weight: 700; font-size: 20px; letter-spacing: .06em; }
.lb-sub { margin: 4px 0 0; font-size: 13.5px; letter-spacing: .06em; color: var(--navy-soft); }
.lb-plan { position: relative; aspect-ratio: 2257 / 441; container-type: inline-size; }
.lb-plan > img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.lb-room {
  --pu: calc(100cqw / 1100);
  position: absolute; top: 9%; transform: translateX(-50%); width: 14%;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  color: var(--navy); text-decoration: none; border-radius: 8px; padding: calc(var(--pu) * 6) 0;
  transition: background-color .2s var(--ease-out);
}
.lb-room:hover { background: rgb(255 255 255 / .55); }
.lb-top { display: flex; align-items: center; gap: calc(var(--pu) * 8); }
.lb-room .rn { font-family: var(--serif); font-weight: 700; font-size: max(12px, calc(var(--pu) * 22)); line-height: 1; }
.lb-room .ic { font-size: max(14px, calc(var(--pu) * 22)); stroke-width: 1.7; }
.lb-room .rt { margin-top: calc(var(--pu) * 10); font-family: var(--serif); font-weight: 700; font-size: max(12px, calc(var(--pu) * 17)); letter-spacing: .08em; white-space: nowrap; }
.lb-room .rs { margin-top: calc(var(--pu) * 6); font-size: max(10px, calc(var(--pu) * 12)); letter-spacing: .04em; color: var(--navy-soft); white-space: nowrap; }

/* overview additions from section-a: rooftop lettering and the entrance CTA, registered on the plate */
.section-box { position: relative; height: 100%; width: calc(var(--h) * 1104 / 912); container-type: size; }
.section-sign { position: absolute; left: 27%; width: 52%; top: 7.6%; margin: 0; display: flex; justify-content: center; align-items: baseline; gap: 2.2cqh; color: #9E7A33; white-space: nowrap; text-shadow: 0 1px 0 rgb(255 255 255 / .9), 0 .3cqh .5cqh rgb(110 80 20 / .25); pointer-events: none; }
.section-sign .s-latin { font-family: var(--sans); font-weight: 600; font-size: 2.7cqh; }
.section-sign .s-cjk { font-family: var(--serif); font-weight: 700; font-size: 2.1cqh; letter-spacing: .06em; }
.interior .section-cta { position: absolute; left: 52.5%; top: 87.5%; transform: translate(-50%, -50%); min-height: 0; height: 5.6cqh; padding: 0 2.6cqh; font-size: max(13px, 1.9cqh); border: 1.5px solid rgb(255 255 255 / .75); }
.interior .section-cta:hover { transform: translate(-50%, calc(-50% - 1px)); }

/* ---------- floor scenes ---------- */
.floor-scene, .proposal-scene { padding: 36px 48px 64px; max-width: 1120px; }
.proposal-scene { max-width: none; display: grid; justify-items: center; }
.proposal-scene > * { width: min(100%, 860px); }
.floor-head { display: flex; align-items: center; gap: 22px; margin-bottom: 30px; }
.fh-n { margin: 0; font-family: var(--serif); font-weight: 700; font-size: 68px; line-height: 1; letter-spacing: -.02em; color: var(--navy); }
.fh-rule { width: 1.5px; align-self: stretch; margin: 6px 0; background: var(--navy); opacity: .5; }
.fh-title { margin: 0; font-family: var(--serif); font-weight: 700; font-size: 32px; line-height: 1.3; letter-spacing: .06em; color: var(--navy); outline: none; }
.fh-sub { margin: 6px 0 0; font-size: 16px; letter-spacing: .08em; color: var(--navy-soft); }
.floor-next { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 52px; padding-top: 28px; border-top: 1px solid var(--hairline); }
.floor-scene > section, .floor-scene > aside { margin-top: 44px; }
.notice { margin: 0; padding: 18px 22px; background: var(--white); border: 1px dashed #B7C1D8; border-radius: 12px; line-height: 1.8; }
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 12px; background: var(--white); border: 1px solid var(--hairline); }

/* 1F */
.f1-plan { position: relative; aspect-ratio: 2257 / 441; }
.f1-figure { position: absolute; inset: 0; margin: 0; }
.f1-figure img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.f1-rooms { position: absolute; inset: 0; container-type: inline-size; }
.f1-room {
  --pu: calc(100cqw / 900);
  position: absolute; top: 5%; height: 74%;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding-top: calc(var(--pu) * 10);
  appearance: none; border: 0; border-radius: 6px; background: transparent; color: var(--navy); cursor: pointer; font: inherit;
  transition: background-color .2s var(--ease-out), box-shadow .25s var(--ease-out);
}
.f1-room .rn { font-family: var(--serif); font-weight: 700; font-size: max(12px, calc(var(--pu) * 17)); line-height: 1.3; }
.f1-room .rt { font-family: var(--serif); font-weight: 700; font-size: max(12px, calc(var(--pu) * 16.5)); letter-spacing: .08em; white-space: nowrap; }
.f1-room .ic { margin-top: calc(var(--pu) * 6); font-size: calc(var(--pu) * 22); stroke-width: 1.6; }
.f1-room .rs { display: none; }
.f1-room:hover { background: rgb(255 255 255 / .35); }
.f1-room[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--navy), 0 0 0 4px rgb(255 255 255 / .7); background: rgb(255 255 255 / .25); }
.f1-room[data-stage="1"][aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--white), 0 0 0 4px rgb(58 54 201 / .35); }
.gate-mark {
  position: absolute; top: 42%; transform: translate(-50%, -50%);
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  appearance: none; border: 0; background: none; padding: 6px; cursor: pointer; color: #6E5520;
}
.gate-mark i { width: 18px; height: 18px; border-radius: 3px; transform: rotate(45deg); }
.gate-mark:hover i, .gate-mark:focus-visible i { box-shadow: 0 0 0 2px var(--white), 0 0 0 4px var(--indigo); }
.gate-mark span { position: absolute; top: 100%; font-family: var(--serif); font-weight: 700; font-size: 12px; letter-spacing: .06em; background: rgb(255 255 255 / .95); padding: 1px 6px; border-radius: 4px; white-space: nowrap; opacity: 0; transform: translateY(-2px); transition: opacity .2s var(--ease-out), transform .2s var(--ease-out); pointer-events: none; }
.gate-mark:hover span, .gate-mark:focus-visible span { opacity: 1; transform: none; }
.stage-detail { margin-top: 28px; padding: 30px 34px; background: var(--white); border-radius: 16px; border: 1px solid var(--hairline); box-shadow: 0 12px 32px rgb(20 42 110 / .07); }
.sd-head { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.sd-no { font-family: var(--serif); font-weight: 700; font-size: 18px; color: var(--indigo); }
.sd-name { margin: 0; font-family: var(--serif); font-weight: 700; font-size: 28px; letter-spacing: .06em; }
.sd-here { font-size: 13px; letter-spacing: .04em; color: var(--indigo); background: var(--indigo-wash); padding: 4px 10px; border-radius: 999px; }
.sd-body { margin: 14px 0 0; font-size: 17px; line-height: 1.9; max-width: 68ch; }
.sd-facts { margin: 20px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--hairline); }
.sd-facts div { padding: 16px 18px 4px 0; }
.sd-facts div + div { padding-left: 18px; border-left: 1px solid var(--hairline); }
.sd-facts dt { font-family: var(--serif); font-weight: 700; font-size: 14px; letter-spacing: .1em; color: var(--navy-soft); }
.sd-facts dd { margin: 6px 0 0; font-size: 15.5px; line-height: 1.75; }
.sd-gate { margin: 20px 0 0; display: flex; gap: 14px; align-items: flex-start; padding: 14px 18px; background: #F8F4EA; border-radius: 10px; line-height: 1.8; font-size: 15px; }
.sd-gate .diamond { margin-top: 8px; }
.sd-gate b { margin-right: 10px; font-family: var(--serif); letter-spacing: .06em; }
.sd-nav { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; }
.sd-count { font-variant-numeric: tabular-nums; color: var(--navy-soft); font-size: 14px; letter-spacing: .1em; }

/* 2F */
.f2-grid { display: grid; gap: 28px; }
.q { margin: 0; padding: 0; border: 0; min-width: 0; }
.q + .q { margin-top: 34px; }
.q legend { display: flex; align-items: center; gap: 12px; padding: 0; margin-bottom: 16px; font-family: var(--serif); font-weight: 700; font-size: 21px; letter-spacing: .05em; color: var(--navy); }
.q-n { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--navy); color: var(--white); font-size: 15px; letter-spacing: 0; }
.choice-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.tile { position: relative; display: block; cursor: pointer; }
.tile input, .seg input, .chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.tile-body { display: block; height: 100%; padding: 20px 20px 18px; background: var(--white); border: 1.5px solid var(--hairline); border-radius: 14px; transition: border-color .2s var(--ease-out), box-shadow .25s var(--ease-out), background-color .2s var(--ease-out); }
.tile:hover .tile-body { border-color: #A9B3CF; }
.tile input:checked + .tile-body { border-color: var(--indigo); background: linear-gradient(180deg, #F4F3FF, var(--white) 60%); box-shadow: 0 0 0 3px var(--indigo-wash), 0 10px 24px rgb(58 54 201 / .12); }
.tile input:focus-visible + .tile-body, .chip input:focus-visible + .chip-body, .seg input:focus-visible + span { outline: 2px solid var(--indigo); outline-offset: 3px; }
.tile-label { display: block; font-family: var(--serif); font-size: 20px; letter-spacing: .06em; }
.tile-plan { display: inline-block; margin-top: 8px; font-size: 13px; font-weight: 600; letter-spacing: .08em; color: var(--indigo); }
.tile-where { display: block; margin-top: 4px; font-size: 14px; color: var(--navy-soft); }
.tile ul { margin: 12px 0 0; padding: 12px 0 0; border-top: 1px solid var(--hairline); list-style: none; font-size: 14px; line-height: 1.9; }
.tile li::before { content: ""; display: inline-block; width: 5px; height: 5px; margin: 0 8px 2px 0; border-radius: 50%; background: #C9AC6E; }
.sub-q { margin-top: 18px; padding: 16px 18px; border-radius: 12px; background: var(--white); border: 1px dashed #B7C1D8; }
.sub-q-title { margin: 0 0 10px; font-family: var(--serif); font-weight: 700; font-size: 16px; letter-spacing: .05em; }
.seg { display: inline-flex; flex-wrap: wrap; gap: 8px; }
.seg label { position: relative; cursor: pointer; }
.seg span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: 999px; background: var(--white); border: 1.5px solid var(--hairline); font-weight: 600; font-size: 15px; letter-spacing: .04em; transition: background-color .2s var(--ease-out), border-color .2s var(--ease-out), color .2s var(--ease-out); }
.seg label:hover span { border-color: #A9B3CF; }
.seg input:checked + span { background: var(--navy); border-color: var(--navy); color: var(--white); }
.count-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.count-row input { width: 180px; height: 56px; padding: 0 16px; font: inherit; font-size: 26px; font-variant-numeric: tabular-nums; color: var(--navy); background: var(--white); border: 1.5px solid var(--hairline); border-radius: 12px; }
.count-row input:focus { outline: 2px solid var(--indigo); outline-offset: 2px; }
.count-row input[aria-invalid="true"] { border-color: #B3261E; }
.count-unit { font-size: 18px; }
.count-tier { margin-left: 8px; padding: 6px 14px; border-radius: 999px; background: var(--indigo-wash); color: var(--indigo); font-weight: 600; font-size: 15px; }
.count-tier:empty { display: none; }
.hint { margin: 10px 0 0; font-size: 14px; color: var(--navy-soft); line-height: 1.7; }
.recommend { padding: 26px 30px; border-radius: 16px; background: var(--navy); color: var(--white); box-shadow: 0 18px 40px rgb(20 42 110 / .22); }
.rec-empty-title { margin: 0; font-family: var(--serif); font-weight: 700; font-size: 22px; letter-spacing: .06em; }
.rec-plan { margin: 6px 0 0; font-family: var(--serif); font-weight: 700; font-size: 30px; letter-spacing: .06em; }
.rec-plan span { margin-left: 14px; font-size: 18px; color: #DCE2F7; letter-spacing: .04em; }
.rec-where { margin: 6px 0 0; color: #DCE2F7; }
.rec-facts { margin: 16px 0 0; display: flex; gap: 32px; flex-wrap: wrap; }
.rec-facts dt { font-size: 13px; color: #C9D2F0; letter-spacing: .1em; }
.rec-facts dd { margin: 4px 0 0; font-weight: 600; font-size: 17px; }
.rec-note { margin: 14px 0 0; padding: 12px 14px; border-radius: 10px; background: rgb(255 255 255 / .08); line-height: 1.75; font-size: 14.5px; }
.rec-empty { margin: 8px 0 0; line-height: 1.8; color: #DCE2F7; }
.interior .recommend .btn-primary { margin-top: 18px; background: var(--white); color: var(--navy); box-shadow: none; }
.interior .recommend .btn-primary:hover { background: #E9ECFA; }
.cmp-table, .price-table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.7; }
.cmp-table th, .cmp-table td, .price-table th, .price-table td { padding: 14px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--hairline); }
.cmp-table thead th, .price-table thead th { font-family: var(--serif); font-weight: 700; font-size: 16px; letter-spacing: .06em; background: #F7F8FB; }
.cmp-table tbody th, .price-table tbody th { font-family: var(--serif); font-weight: 700; letter-spacing: .06em; white-space: nowrap; width: 9em; }
.cmp-table tr:last-child > *, .price-table tr:last-child > * { border-bottom: 0; }
.is-chosen { background: #F1F0FE; }
thead .is-chosen { box-shadow: inset 0 3px 0 var(--indigo); }
.chosen-tag { display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px; background: var(--indigo); color: var(--white); font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: .04em; vertical-align: 2px; }

/* 3F */
.fees-for { margin: 0 0 14px; font-family: var(--serif); font-weight: 700; font-size: 24px; letter-spacing: .06em; color: var(--navy); }
.fee-figs { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: var(--white); border: 1px solid var(--hairline); border-radius: 16px; }
.fee-figs div { padding: 22px 26px; }
.fee-figs div + div { border-left: 1px solid var(--hairline); }
.fee-figs dt { font-family: var(--serif); font-weight: 700; font-size: 15px; letter-spacing: .1em; color: var(--navy-soft); }
.fee-figs dd { margin: 8px 0 0; }
.fee-figs b { display: block; font-family: var(--serif); font-size: 40px; line-height: 1.15; letter-spacing: .01em; font-variant-numeric: tabular-nums; }
.fee-figs span { display: block; margin-top: 4px; font-size: 14px; color: var(--navy-soft); font-variant-numeric: tabular-nums; }
.price-table td { font-variant-numeric: tabular-nums; }
.pt-on, .pt-mo { display: block; }
.pt-mo { color: var(--navy-soft); font-size: 14px; }
.price-table td.is-chosen { box-shadow: inset 0 0 0 2px var(--indigo); }
.ladder { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: end; }
.step { position: relative; padding: 22px 22px 20px; background: var(--white); border-radius: 14px 14px 4px 4px; border: 1px solid var(--hairline); border-top: 3px solid #C9AC6E; }
.step.s1 { min-height: 176px; } .step.s2 { min-height: 212px; } .step.s3 { min-height: 248px; }
.step b { font-family: var(--serif); font-size: 20px; letter-spacing: .08em; }
.step p { margin: 8px 0 14px; font-size: 14.5px; line-height: 1.8; }
.price-tag { display: inline-block; padding: 4px 12px; border-radius: 999px; font-size: 13px; font-weight: 600; letter-spacing: .04em; background: #F3EEE1; color: #6E5520; }
.step.s1 .price-tag { background: var(--indigo-wash); color: var(--indigo); }
.module-chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.chip { position: relative; display: block; cursor: pointer; }
.chip-body { display: block; height: 100%; padding: 14px 42px 14px 16px; background: var(--white); border: 1.5px solid var(--hairline); border-radius: 12px; transition: border-color .2s var(--ease-out), background-color .2s var(--ease-out); }
.chip-body b { display: flex; align-items: center; gap: 8px; font-family: var(--serif); font-size: 16px; letter-spacing: .05em; }
.chip-body > span { display: block; margin-top: 4px; font-size: 13.5px; line-height: 1.65; color: var(--navy-soft); }
.chip:hover .chip-body { border-color: #A9B3CF; }
.chip input:checked + .chip-body { border-color: var(--indigo); background: #F6F5FF; }
.chip-check { position: absolute; right: 14px; top: 14px; width: 20px; height: 20px; padding: 2px; border-radius: 50%; color: transparent; border: 1.5px solid #B7C1D8; stroke-width: 2.4; transition: background-color .2s var(--ease-out), border-color .2s var(--ease-out), color .2s var(--ease-out); }
.chip input:checked ~ .chip-check { background: var(--indigo); border-color: var(--indigo); color: var(--white); }
.tag { font-style: normal; font-family: var(--sans); font-size: 11.5px; font-weight: 600; letter-spacing: .04em; padding: 1px 7px; border-radius: 999px; background: #F3EEE1; color: #6E5520; }
.model-fee { padding: 22px 26px; border-radius: 14px; background: #F8F4EA; border: 1px solid #E6D7B4; }
.model-fee p { margin: 0; line-height: 1.85; }

/* 4F */
.decisions { list-style: none; margin: 0 0 26px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.decisions li { display: flex; gap: 10px; align-items: baseline; padding: 10px 16px; border-radius: 999px; background: var(--white); border: 1px solid var(--hairline); font-size: 14.5px; }
.decisions b { font-family: var(--serif); color: var(--indigo); letter-spacing: .08em; }
.gate-track { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); position: relative; }
.gate-track::before { content: ""; position: absolute; left: 6px; right: 6px; top: 8px; height: 2px; background: linear-gradient(90deg, #C9AC6E, #E6D7B4); }
.gate { position: relative; padding: 0 18px 0 0; }
.gate .diamond { width: 16px; height: 16px; position: relative; }
.gate-when { margin: 4px 0 0; font-size: 13.5px; letter-spacing: .04em; color: var(--navy-soft); }
.gate .diamond + .gate-name { margin-top: 16px; }
.gate-name { margin: 4px 0 0; font-family: var(--serif); font-weight: 700; font-size: 21px; letter-spacing: .06em; }
.gate dl { margin: 12px 0 0; }
.gate dl div { padding: 8px 0; border-top: 1px solid var(--hairline); }
.gate dt { font-size: 12.5px; letter-spacing: .12em; color: var(--navy-soft); }
.gate dd { margin: 3px 0 0; font-size: 14.5px; line-height: 1.7; }
.gate dd.pay { font-weight: 700; color: var(--indigo); font-variant-numeric: tabular-nums; }
.paybar { display: flex; height: 72px; border-radius: 14px; overflow: hidden; box-shadow: 0 10px 24px rgb(58 54 201 / .16); }
.paybar > div { display: flex; flex-direction: column; justify-content: center; padding: 0 20px; color: var(--white); min-width: 0; }
.paybar > div + div { border-left: 2px solid rgb(255 255 255 / .6); }
.paybar b { font-family: var(--serif); font-size: 24px; font-variant-numeric: tabular-nums; }
.paybar span { font-size: 13.5px; letter-spacing: .08em; opacity: .92; white-space: nowrap; }
.paybar > div:nth-child(1) { background: #5A55DD; }
.paybar > div:nth-child(2) { background: var(--indigo); }
.paybar > div:nth-child(3) { background: #2C28A6; }
.guarantee-list { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.guarantee-list div { padding: 18px 0; border-top: 1px solid var(--hairline); }
.guarantee-list dt { display: flex; align-items: center; gap: 10px; font-family: var(--serif); font-weight: 700; font-size: 18px; letter-spacing: .06em; }
.guarantee-list dt .ic { font-size: 22px; color: var(--indigo); }
.guarantee-list dd { margin: 6px 0 0 32px; line-height: 1.8; font-size: 15px; }

/* 5F */
.start-path { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.start-path li { position: relative; padding: 0 28px 0 0; }
.start-path li:not(:last-child)::after { content: ""; position: absolute; top: 19px; left: 52px; right: 14px; height: 2px; background: repeating-linear-gradient(90deg, #B7C1D8 0 6px, transparent 6px 11px); }
.sp-n { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--navy); color: var(--white); font-family: var(--serif); font-weight: 700; font-size: 18px; }
.start-path li:first-child .sp-n { background: var(--indigo); box-shadow: 0 0 0 5px var(--indigo-wash); }
.start-path b { display: block; margin-top: 14px; font-family: var(--serif); font-size: 21px; letter-spacing: .06em; }
.start-path p { margin: 6px 0 8px; font-size: 15px; line-height: 1.8; }
.sp-out { font-size: 13.5px; color: #6E5520; background: #F3EEE1; padding: 3px 10px; border-radius: 999px; }
.why p { margin: 0; max-width: 68ch; line-height: 1.9; }
.f5-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 24px; align-items: start; margin-top: 44px; }
.f5-grid > section { margin-top: 0; padding: 28px 30px; background: var(--white); border: 1px solid var(--hairline); border-radius: 16px; }
.proposal-cta p { line-height: 1.85; }
.proposal-cta .hint:empty { display: none; }
.book { box-shadow: 0 16px 40px rgb(20 42 110 / .08); scroll-margin-top: 80px; }
.book h2 { outline: none; }
.book-form { margin-top: 18px; display: grid; gap: 16px; }
.field { display: grid; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; }
.field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.field label, .field legend, .field-label { font-weight: 600; font-size: 14px; letter-spacing: .04em; padding: 0; margin: 0; }
.field.more { gap: 14px; padding: 16px 18px 18px; border: 1px dashed #C9D0E0; border-radius: 12px; }
.field.more legend { padding: 0 6px; color: var(--navy-soft); }
.seg.goals { gap: 6px; }
.seg.goals span { min-height: 38px; padding: 0 14px; font-size: 14px; }
.field label i { font-style: normal; color: var(--indigo); margin-left: 2px; }
.field input, .field textarea, .field select {
  width: 100%; min-height: 48px; padding: 10px 14px; font: inherit; font-size: 16px; color: var(--navy);
  background: #FBFBFD; border: 1.5px solid #CBD2E3; border-radius: 10px;
  transition: border-color .2s var(--ease-out), box-shadow .2s var(--ease-out), background-color .2s var(--ease-out);
}
.field textarea { resize: vertical; line-height: 1.7; }
.field input:focus, .field textarea:focus, .field select:focus { outline: none; border-color: var(--indigo); background: var(--white); box-shadow: 0 0 0 3px var(--indigo-wash); }
.field [aria-invalid="true"] { border-color: #B3261E; box-shadow: 0 0 0 3px rgb(179 38 30 / .1); }
.field ::placeholder { color: #8C96B2; }
.slot { display: grid; grid-template-columns: minmax(0, 1fr) 110px; gap: 8px; margin-top: 8px; }
.consent { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 1.75; cursor: pointer; }
.consent input { width: 20px; height: 20px; margin-top: 3px; accent-color: var(--indigo); flex: none; }
.consent a { color: var(--indigo); text-underline-offset: 3px; }
.form-error { margin: 0; padding: 12px 14px; border-radius: 10px; background: #FCEEEE; color: #8C1D18; font-size: 14.5px; line-height: 1.7; }
.book-form .btn-primary { justify-self: start; }
.booked { display: grid; justify-items: start; gap: 10px; margin-top: 16px; }
.booked-ic { width: 44px; height: 44px; padding: 8px; border-radius: 50%; background: var(--indigo); color: var(--white); stroke-width: 2.4; }
.booked-title { margin: 6px 0 0; font-family: var(--serif); font-weight: 700; font-size: 22px; letter-spacing: .06em; }
.booked p { margin: 0; line-height: 1.85; }

/* proposal */
.doc-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 22px; }
.doc { max-width: 860px; padding: 56px 60px; background: var(--white); border-radius: 6px; box-shadow: 0 30px 60px rgb(20 42 110 / .12), 0 2px 6px rgb(20 42 110 / .06); }
.doc-head { padding-bottom: 22px; border-bottom: 2px solid var(--navy); }
.doc-brand { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.doc-mark { margin: 0; }
.doc-mark .brand-logo { height: 42px; }
.doc-by { margin: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; font-size: 12px; letter-spacing: .12em; color: var(--navy-soft); }
.doc-by img { height: 64px; width: auto; }
.doc-sign { display: flex; align-items: center; gap: 8px; }
.doc-sign img { height: 22px; width: auto; }
.doc-mark span { margin-left: 8px; font-family: var(--serif); font-size: 13px; letter-spacing: .18em; color: var(--gold); }
.doc h1 { margin: 18px 0; font-family: var(--serif); font-weight: 700; font-size: 36px; letter-spacing: .14em; outline: none; }
.doc-parties, .doc-grid { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
.doc-parties div, .doc-grid div { display: flex; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--hairline); }
.doc-parties dt, .doc-grid dt { flex: none; width: 6.5em; font-family: var(--serif); font-weight: 700; letter-spacing: .08em; color: var(--navy-soft); }
.doc-parties dd, .doc-grid dd { margin: 0; font-variant-numeric: tabular-nums; min-width: 0; }
.doc section { margin-top: 30px; }
.doc h2 { margin: 0 0 12px; font-family: var(--serif); font-weight: 700; font-size: 19px; letter-spacing: .1em; }
.doc p { margin: 0; line-height: 1.85; }
.doc-stages { margin: 0; padding: 0; list-style: none; counter-reset: st; display: grid; gap: 6px; }
.doc-stages li { counter-increment: st; display: grid; grid-template-columns: 2em 6.5em 1fr; gap: 8px; line-height: 1.7; }
.doc-stages li::before { content: counter(st, decimal-leading-zero); font-family: var(--serif); font-weight: 700; color: var(--indigo); }
.doc-stages b { font-family: var(--serif); letter-spacing: .06em; }
.doc-table { width: 100%; border-collapse: collapse; font-size: 14.5px; line-height: 1.7; }
.doc-table th, .doc-table td { padding: 9px 10px; border-bottom: 1px solid var(--hairline); text-align: left; vertical-align: top; }
.doc-table thead th { font-family: var(--serif); background: #F7F8FB; }
.doc-table tbody th { font-family: var(--serif); white-space: nowrap; }
.doc-table td:last-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
.doc-foot { margin-top: 36px; padding-top: 16px; border-top: 1px solid var(--hairline); display: flex; justify-content: space-between; gap: 20px; font-size: 13.5px; color: var(--navy-soft); }

/* ---------- ride ---------- */
.ride { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; align-content: center; gap: 18px; background: rgb(240 240 242 / .97); opacity: 0; transition: opacity .22s var(--ease-out); cursor: pointer; }
.ride.is-on { opacity: 1; }
.ride-shaft { position: relative; height: min(68vh, 640px); aspect-ratio: 1104 / 912; }
.ride-shaft img { width: 100%; height: 100%; }
.ride-car { position: absolute; left: 13%; width: 79%; height: 11%; transform: translateY(-50%); border-radius: 10px; border: 2px solid var(--indigo); background: rgb(58 54 201 / .16); box-shadow: 0 10px 24px -6px rgb(40 34 160 / .45), inset 0 0 0 1px rgb(255 255 255 / .5); }
.ride-label { margin: 0; display: flex; align-items: baseline; gap: 14px; color: var(--navy); }
.ride-label b { font-family: var(--serif); font-size: 40px; }
.ride-label span { font-family: var(--serif); font-weight: 700; font-size: 24px; letter-spacing: .08em; }

/* ---------- toast ---------- */
.toast { position: fixed; left: 50%; bottom: 24px; z-index: 60; max-width: min(92vw, 520px); margin: 0; padding: 12px 18px; border-radius: 12px; background: var(--navy); color: var(--white); font-size: 14.5px; line-height: 1.6; box-shadow: 0 12px 30px rgb(20 42 110 / .3); transform: translate(-50%, 12px); opacity: 0; transition: opacity .25s var(--ease-out), transform .3s var(--ease-out); }
.toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* ---------- tablet: rail on top, card as a drawer ---------- */
@media (max-width: 1179px) {
  .interior::before { display: none; }
  .interior { grid-template-columns: minmax(0, 1fr); grid-template-rows: 56px auto auto; }
  .bar { padding: 0 16px; gap: 14px; }
  .steps-inline { display: none; }
  .card-toggle {
    display: inline-flex; align-items: center; margin-left: auto; min-height: 40px; padding: 0 18px; border-radius: 999px;
    border: 0; background: var(--navy); color: var(--white); font: inherit; font-family: var(--serif); font-weight: 700; font-size: 14.5px; letter-spacing: .08em; cursor: pointer;
  }
  .lift { grid-column: 1; grid-row: 2; position: sticky; top: 56px; height: auto; flex-direction: row; align-items: center; justify-content: flex-start; gap: 6px; padding: 8px 12px; overflow-x: auto; z-index: 15; }
  .lift-buttons { flex-direction: row; gap: 4px; }
  .lift-extra { flex-direction: row; gap: 4px; padding: 0 0 0 10px; margin: 0 0 0 6px; border-top: 0; border-left: 1px solid rgb(90 64 20 / .28); }
  .lift-btn { flex-direction: row; gap: 8px; padding: 4px 10px 4px 4px; border-radius: 999px; }
  .lb-n, .lift-small .lb-n { width: 38px; height: 38px; font-size: 18px; }
  .lift-small .lb-n .ic { width: 18px; height: 18px; }
  .lb-t { font-size: 13px; white-space: nowrap; }
  .stage, body[data-view="lobby"] .stage, body[data-view="proposal"] .stage { grid-column: 1; grid-row: 3; }
  .dock {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 40; max-height: 88vh; padding: 20px 20px calc(24px + env(safe-area-inset-bottom));
    background: var(--ground); border-radius: 20px 20px 0 0; box-shadow: 0 -18px 48px rgb(20 42 110 / .25);
    transform: translateY(105%); transition: transform .35s var(--ease-out), visibility 0s .35s; visibility: hidden;
  }
  .dock.is-open { transform: none; visibility: visible; transition: transform .35s var(--ease-out); }
  body[data-view] .dock.is-open { display: block; }
  .dock-inner { max-width: 560px; margin: 0 auto; }
  .dock-close { display: block; margin: 16px auto 0; min-height: 44px; padding: 0 22px; border-radius: 999px; border: 1.5px solid var(--navy); background: none; color: var(--navy); font: inherit; font-weight: 600; cursor: pointer; }
  .floor-scene, .proposal-scene { padding: 28px 28px 56px; }
  .overview { padding: 28px; }
  .overview { grid-template-columns: minmax(0, 1fr); }
  .overview-copy { order: -1; }
  .ov-card { display: none; }
  .ov-title br { display: none; }
  body[data-view="lift"] .stage { grid-column: 1; }
  .section-stage { --labels: 200px; --h: min(calc(100vh - 330px), 560px, calc((100vw - 56px - var(--labels)) / 1.21)); margin-top: 18px; }
  .lobby-band { grid-template-columns: minmax(0, 1fr); padding: 18px 20px 0; }
}
@media (max-width: 1179px) and (min-width: 900px) {
  .lift { justify-content: center; }
}

/* ---------- print: the proposal only ---------- */
@media print {
  @page { size: A4; margin: 16mm 16mm 18mm; }
  body { background: #fff; }
  .frame, .bar, .lift, .dock, .doc-actions, .toast, .ride, .skip { display: none !important; }
  .interior { display: block; background: #fff; min-height: 0; }
  .proposal-scene { padding: 0; max-width: none; }
  .doc { max-width: none; padding: 0; box-shadow: none; border-radius: 0; }
  .doc section, .doc-table tr { break-inside: avoid; }
  a { color: inherit; text-decoration: none; }
}