/* AZRION 中古車販売 — 本体の見た目。
   世界：昼のロット／ショールーム。オフホワイト＋暖ニュートラルの地に墨が主役、
   色は状態と主操作だけ。比例は小さく洗練（家の作法）。 */
:root{
  --bg:#f3f0ea; --bg2:#ece8df; --card:#fffefa; --card2:#f6f2ea;
  --line:#ddd5c6; --line2:#c9bfa9;
  --ink:#211d17; --sub:#6e675c; --dim:#9c9484;
  --acc:#211d17; --acc2:#8a7f6a; --acc-ink:#f7f3ec; --brass:#9a7b4f;
  --warn:#b97f22; --bad:#c0453a; --ok:#4c7a52;
  --radius:16px;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--bg); color:var(--ink);
  font-family:-apple-system,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  -webkit-font-smoothing:antialiased; font-size:14px; line-height:1.65;
}
button{ font-family:inherit; }
img{ max-width:100%; }

/* ===== アプリ枠 ===== */
.app{ display:none; }
html.uc-ready .app{ display:flex; flex-direction:column; min-height:100vh; min-height:100dvh; }
.app-head{
  position:sticky; top:0; z-index:60; display:flex; align-items:center; justify-content:space-between;
  padding:calc(10px + env(safe-area-inset-top)) 16px 10px;
  background:linear-gradient(180deg, rgba(246,243,238,.97), rgba(246,243,238,.88));
  backdrop-filter:blur(10px); border-bottom:1px solid var(--line);
}
.app-brand{ display:flex; align-items:center; gap:11px; min-width:0; }
.app-brand-mark{ width:34px; height:34px; border-radius:9px; display:block; }
.app-brand-name{ font-size:14.5px; font-weight:800; letter-spacing:.05em; white-space:nowrap; }
.app-brand-sub{ font-size:10.5px; color:var(--sub); letter-spacing:.06em; }
.app-bell{ position:relative; appearance:none; background:none; border:0; color:var(--ink); padding:8px; cursor:pointer; }
.app-bell-dot{ position:absolute; top:6px; right:6px; width:8px; height:8px; border-radius:50%; background:var(--bad); }
.app-main{ flex:1 0 auto; width:100%; max-width:760px; margin:0 auto; padding:18px 16px 108px; }
.app-tabs{
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  display:flex; justify-content:space-around; align-items:stretch;
  padding:6px 8px calc(6px + env(safe-area-inset-bottom));
  background:rgba(250,248,244,.96); border-top:1px solid var(--line); backdrop-filter:blur(10px);
}
.tab{
  appearance:none; background:none; border:0; cursor:pointer; color:var(--dim);
  display:flex; flex-direction:column; align-items:center; gap:2px;
  font-size:10.5px; font-weight:600; letter-spacing:.05em; padding:6px 14px; border-radius:12px; min-width:64px;
}
.tab.is-on{ color:var(--acc); }

/* ===== 汎用部品 ===== */
.page-title{ font-size:17px; font-weight:800; letter-spacing:.04em; margin:2px 0 4px; }
.page-lead{ font-size:12.5px; color:var(--sub); line-height:1.85; margin:0 0 16px; }
.card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:14px; margin-bottom:14px; }
.card-t{ font-size:13px; font-weight:800; letter-spacing:.06em; margin:0 0 10px; }
.note{ font-size:11.5px; color:var(--sub); line-height:1.85; }
.src-note{ font-size:10.5px; color:var(--dim); line-height:1.8; margin-top:8px; }
.btn{
  appearance:none; border:0; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--ink); color:var(--acc-ink);
  font-size:14px; font-weight:800; letter-spacing:.06em; padding:13px 20px; border-radius:999px; width:100%;
}
.btn:active{ transform:scale(.985); }
.btn-sub{
  appearance:none; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--card2); color:var(--ink); border:1px solid var(--line2);
  font-size:13px; font-weight:700; padding:11px 18px; border-radius:999px; width:100%;
}
.btn-ghost{
  appearance:none; background:none; cursor:pointer; color:var(--sub);
  border:1px solid var(--line); font-size:12.5px; font-weight:600; padding:9px 16px; border-radius:999px;
}
.btn-danger{ color:var(--bad); border-color:#e0c6c0; }
.btn[disabled], .btn-sub[disabled]{ opacity:.45; pointer-events:none; }
.rows{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; margin-bottom:14px; }
.row{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  appearance:none; background:none; border:0; border-bottom:1px solid var(--line);
  padding:14px 16px; cursor:pointer; color:var(--ink);
}
.row:last-child{ border-bottom:0; }
.row-dot{ flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:var(--acc); }
.row-tx{ flex:1 1 auto; min-width:0; }
.row-tx b{ display:block; font-size:13.5px; font-weight:700; }
.row-tx small{ display:block; font-size:11px; color:var(--sub); margin-top:1px; }
.row-val{ font-size:12px; color:var(--sub); white-space:nowrap; }
.row-chev{ color:var(--dim); font-size:16px; }
.grp-lbl{ font-size:11px; font-weight:700; letter-spacing:.14em; color:var(--dim); margin:18px 2px 8px; }
.chip{
  appearance:none; cursor:pointer; border:1px solid var(--line2); background:var(--card);
  color:var(--ink); font-size:12.5px; font-weight:600; padding:8px 14px; border-radius:999px;
}
.chip.is-on{ background:var(--acc); border-color:var(--acc); color:var(--acc-ink); font-weight:800; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.field{ margin-bottom:13px; }
.field label{ display:block; font-size:11.5px; font-weight:700; color:var(--sub); letter-spacing:.05em; margin-bottom:6px; }
.field input,.field select,.field textarea{
  width:100%; background:var(--bg2); border:1px solid var(--line2); border-radius:12px;
  color:var(--ink); font-size:16px; padding:12px 13px; outline:none; font-family:inherit;
}
.field textarea{ min-height:76px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus{ border-color:var(--acc2); }
.pw-wrap{ position:relative; }
.pw-eye{ position:absolute; right:8px; top:50%; transform:translateY(-50%); appearance:none; background:none; border:0; color:var(--sub); cursor:pointer; padding:8px; }
.pw-meter{ height:5px; border-radius:99px; background:var(--line); margin-top:7px; overflow:hidden; }
.pw-meter i{ display:block; height:100%; width:0; background:var(--acc2); border-radius:99px; transition:width .25s ease; }
.form-err{ display:none; background:#f9e9e6; color:#8c352d; border:1px solid #e3c4bd; border-radius:12px; padding:11px 13px; font-size:12.5px; line-height:1.7; margin-bottom:13px; }
.form-err.show{ display:block; }
.empty{
  border:1px dashed var(--line2); border-radius:var(--radius); padding:26px 18px; text-align:center;
  color:var(--sub); font-size:13px; line-height:1.9; margin-bottom:14px; background:rgba(33,29,23,.02);
}
.empty b{ color:var(--ink); display:block; font-size:14px; margin-bottom:4px; }
.toast{
  position:fixed; left:50%; transform:translateX(-50%); bottom:calc(96px + env(safe-area-inset-bottom)); z-index:900;
  background:#211d17; color:#f7f3ec; font-size:13px; font-weight:700; padding:11px 18px; border-radius:999px;
  box-shadow:0 12px 32px rgba(31,26,18,.28); max-width:88vw; text-align:center;
}

/* ===== ホームのヒーロー ===== */
.hero{ padding:8px 2px 18px; }
.hero-kicker{ font-size:10.5px; letter-spacing:.34em; color:var(--brass); font-weight:800; margin-bottom:8px; }
.hero-title{ font-size:23px; font-weight:800; line-height:1.45; letter-spacing:.03em; margin:0 0 8px; }
.hero-lead{ font-size:12.5px; color:var(--sub); line-height:1.9; margin:0; }
.hero-cta{ margin-top:16px; }

/* ===== 車両カード／詳細 ===== */
.car-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; margin-bottom:14px; cursor:pointer; }
.car-card:active{ transform:scale(.995); }
.car-ph{ position:relative; aspect-ratio:16/10; background:#e7e1d5; overflow:hidden; }
.car-ph img{ width:100%; height:100%; object-fit:cover; display:block; }
.car-ph-none{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--dim); font-size:12px; letter-spacing:.1em; }
.car-badge{ position:absolute; top:10px; left:10px; background:rgba(24,21,17,.82); color:#f2ede4; font-size:10.5px; font-weight:800; letter-spacing:.08em; padding:4px 9px; border-radius:999px; }
.car-badge.reserved{ color:var(--warn); }
.car-body{ padding:13px 15px 15px; }
.car-name{ font-size:15px; font-weight:800; letter-spacing:.02em; margin:0 0 3px; }
.car-meta{ font-size:11.5px; color:var(--sub); }
.car-price-row{ display:flex; align-items:baseline; gap:8px; margin-top:8px; }
.car-price-lbl{ font-size:10.5px; color:var(--dim); letter-spacing:.08em; }
.car-price{ font-size:21px; font-weight:800; letter-spacing:.01em; }
.car-price small{ font-size:11px; color:var(--sub); font-weight:600; }
.spec-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:14px 0; }
.spec{ background:var(--bg2); border:1px solid var(--line); border-radius:12px; padding:9px 6px; text-align:center; }
.spec b{ display:block; font-size:13.5px; font-weight:800; }
.spec span{ display:block; font-size:9.5px; color:var(--dim); letter-spacing:.06em; margin-top:1px; }
.detail-hero{ margin:-18px -16px 0; position:relative; background:#e7e1d5; }
.detail-hero .car-ph{ aspect-ratio:4/3; }
.detail-price-band{ padding:16px 2px 4px; }
.detail-price{ font-size:29px; font-weight:800; line-height:1.15; }
.detail-price small{ font-size:12px; color:var(--sub); font-weight:600; }
.gallery{ display:flex; gap:8px; overflow-x:auto; padding:12px 16px 4px; scrollbar-width:none; }
.gallery::-webkit-scrollbar{ display:none; }
.gallery img{ width:104px; height:74px; object-fit:cover; border-radius:10px; border:2px solid transparent; flex:0 0 auto; cursor:pointer; }
.gallery img.is-on{ border-color:var(--acc); }
table.fees{ width:100%; border-collapse:collapse; font-size:13px; }
table.fees th, table.fees td{ padding:9px 2px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
table.fees td.amt{ text-align:right; font-weight:700; white-space:nowrap; }
table.fees tr.total td{ border-bottom:0; font-weight:800; font-size:14.5px; }
.pay-tag{ display:inline-block; font-size:9.5px; font-weight:800; letter-spacing:.05em; padding:2px 7px; border-radius:99px; margin-left:6px; vertical-align:2px; }
.pay-tag.card{ background:#ece5d8; color:#6b5636; }
.pay-tag.transfer{ background:#e9e6df; color:#5c564c; }
.split-box{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }
.split{ border-radius:12px; padding:12px; background:var(--bg2); border:1px solid var(--line); }
.split .k{ font-size:10.5px; color:var(--sub); letter-spacing:.06em; }
.split .v{ font-size:17px; font-weight:800; margin-top:2px; }
.split .v small{ font-size:11px; color:var(--sub); font-weight:600; }

/* ===== 360°ビューア＋傷ピン ===== */
.pano{ position:relative; overflow:hidden; border-radius:12px; background:#ddd5c3; aspect-ratio:16/10; touch-action:pan-y; user-select:none; }
.pano-strip{ position:absolute; top:0; left:0; height:100%; will-change:transform; }
.pano-strip img{ height:100%; width:auto; max-width:none; display:block; pointer-events:none; }
.pano-pin{
  position:absolute; width:26px; height:26px; margin:-13px 0 0 -13px; border-radius:50%;
  border:2px solid #fff; cursor:pointer; appearance:none; padding:0;
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:12px; font-weight:800; box-shadow:0 4px 14px rgba(0,0,0,.5);
}
.pano-pin.sev-light{ background:#d9a82e; } .pano-pin.sev-mid{ background:#d9702e; } .pano-pin.sev-heavy{ background:#d63c2e; }
.pano-hint{ position:absolute; right:10px; bottom:8px; font-size:10px; color:rgba(255,255,255,.75); background:rgba(0,0,0,.45); padding:3px 8px; border-radius:99px; pointer-events:none; transition:opacity .45s ease; }
.orb .pano-hint{ left:10px; right:auto; bottom:56px; }
.dmg-item{ display:flex; gap:11px; padding:11px 0; border-bottom:1px solid var(--line); }
.dmg-item:last-child{ border-bottom:0; }
.dmg-no{ flex:0 0 auto; width:24px; height:24px; border-radius:50%; color:#fff; font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center; margin-top:2px; }
.dmg-item b{ font-size:13px; display:block; }
.dmg-item p{ margin:2px 0 0; font-size:12px; color:var(--sub); line-height:1.7; }
.dmg-item img{ width:74px; height:56px; object-fit:cover; border-radius:8px; flex:0 0 auto; }

/* ===== 図鑑 ===== */
.maker-grid{ display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.maker-cell{
  appearance:none; cursor:pointer; text-align:left; background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:14px; color:var(--ink);
}
.maker-cell b{ font-size:14px; display:block; }
.maker-cell small{ font-size:11px; color:var(--sub); }
.model-row{ display:flex; align-items:center; gap:11px; padding:13px 2px; border-bottom:1px solid var(--line); }
.model-row:last-child{ border-bottom:0; }
.model-row .tx{ flex:1 1 auto; min-width:0; }
.model-row b{ font-size:14px; display:block; }
.model-row small{ font-size:11px; color:var(--sub); }
.mini-btn{
  appearance:none; cursor:pointer; border-radius:999px; font-size:11.5px; font-weight:700; padding:8px 13px;
  border:1px solid var(--line2); background:var(--card2); color:var(--ink); white-space:nowrap;
}
.mini-btn.is-on{ background:var(--acc); border-color:var(--acc); color:var(--acc-ink); font-weight:800; }
.count-badge{ display:inline-block; background:#ece5d8; color:#6b5636; font-size:10.5px; font-weight:800; padding:2px 8px; border-radius:99px; margin-left:6px; vertical-align:2px; }

/* ===== タイムライン ===== */
.tl{ position:relative; margin:6px 0 2px; padding-left:22px; }
.tl::before{ content:""; position:absolute; left:7px; top:8px; bottom:8px; width:2px; background:var(--line2); }
.tl-step{ position:relative; padding:9px 0; }
.tl-dot{ position:absolute; left:-22px; top:12px; width:16px; height:16px; border-radius:50%; border:2px solid var(--line2); background:var(--bg); }
.tl-step.done .tl-dot{ background:var(--ok); border-color:var(--ok); }
.tl-step b{ font-size:13.5px; }
.tl-step .st{ font-size:11px; color:var(--sub); margin-left:8px; }
.tl-step.done .st{ color:var(--ok); }
.doc-row{ display:flex; align-items:center; gap:10px; padding:12px 0; border-bottom:1px solid var(--line); }
.doc-row:last-child{ border-bottom:0; }
.doc-row .tx{ flex:1 1 auto; }
.doc-row b{ font-size:13px; display:block; }
.doc-row small{ font-size:11px; color:var(--sub); display:block; }
.state-pill{ font-size:10.5px; font-weight:800; padding:3px 9px; border-radius:99px; white-space:nowrap; }
.state-pill.none{ background:#e9e6df; color:var(--dim); }
.state-pill.generated{ background:#e9e6df; color:#5c564c; }
.state-pill.sent{ background:#f3e8cf; color:var(--warn); }
.state-pill.received{ background:#e2ebdd; color:#3d5c40; }
.state-pill.done{ background:#e2ebdd; color:#3d5c40; }

/* ===== イントロ ===== */
.intro{ position:fixed; inset:0; z-index:1000; background:rgba(38,33,26,.5); display:flex; align-items:flex-end; justify-content:center; padding:0 0 calc(18px + env(safe-area-inset-bottom)); }
.intro[hidden]{ display:none; }
.intro-card{ background:var(--card); border:1px solid var(--line2); border-radius:22px; width:calc(100% - 28px); max-width:480px; padding:24px 22px 18px; }
.intro-no{ font-size:10.5px; letter-spacing:.28em; color:var(--brass); font-weight:800; margin-bottom:10px; }
.intro-card h3{ font-size:19px; margin:0 0 10px; letter-spacing:.03em; }
.intro-card p{ font-size:13px; line-height:1.9; color:var(--sub); margin:0; }
.intro-actions{ display:flex; justify-content:space-between; align-items:center; margin-top:22px; }
.intro-skip{ appearance:none; background:none; border:0; color:var(--dim); font-size:13px; cursor:pointer; padding:10px 6px; }
.intro-next{ appearance:none; border:0; cursor:pointer; background:var(--ink); color:var(--acc-ink); font-weight:800; font-size:14px; padding:12px 26px; border-radius:999px; }

/* ===== シート（下から） ===== */
.sheet{ position:fixed; inset:0; z-index:950; background:rgba(38,33,26,.48); display:flex; align-items:flex-end; justify-content:center; }
.sheet[hidden]{ display:none; }
.sheet-card{ background:var(--card); border:1px solid var(--line2); border-radius:22px 22px 0 0; width:100%; max-width:560px; max-height:86vh; overflow-y:auto; padding:20px 18px calc(20px + env(safe-area-inset-bottom)); }
.sheet-t{ font-size:16px; font-weight:800; margin:0 0 6px; }
.sheet-x{ float:right; appearance:none; background:var(--card2); border:1px solid var(--line); color:var(--ink); width:34px; height:34px; border-radius:50%; cursor:pointer; font-size:15px; }

.profile-head{ display:flex; align-items:center; gap:13px; }
.profile-ava{ width:48px; height:48px; border-radius:50%; background:#e8e1d2; color:var(--ink); display:flex; align-items:center; justify-content:center; font-size:19px; font-weight:800; flex:0 0 auto; }
.profile-head b{ font-size:16px; display:block; }
.profile-head small{ font-size:11.5px; color:var(--sub); display:block; }
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.mt{ margin-top:12px; } .mb{ margin-bottom:12px; }
.center{ text-align:center; }

/* ===== ロット／詳細ステージ／認証ガラス（2026-10-31 写真オービット＋ショールーム配色） =====
   世界は昼のロット。地はオフホワイト＋暖ニュートラル、墨が主役、色は状態と主操作だけ。
   車は実写の切り抜きが地面に接地して立つ。動きは静かにスッと（家の作法）。 */
.btn-flat{
  appearance:none; border:0; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--ink); color:var(--acc-ink);
  font-size:14px; font-weight:800; letter-spacing:.06em; padding:13px 20px; border-radius:999px; width:100%;
}
.btn-flat:active{ transform:scale(.985); }

/* メーカーのロット入口 */
.maker-lot{
  display:flex; align-items:center; gap:14px; width:100%; text-align:left; appearance:none; cursor:pointer;
  background:var(--card); border:1px solid var(--line); border-radius:16px; padding:12px 14px; margin-bottom:11px; color:var(--ink);
}
.maker-lot:active{ transform:scale(.995); }
.maker-lot-img{ width:96px; height:64px; object-fit:cover; border-radius:10px; flex:0 0 auto; background:#e7e1d5; }
.maker-lot-tx{ flex:1 1 auto; min-width:0; }
.maker-lot-tx b{ display:block; font-size:15.5px; font-weight:800; letter-spacing:.03em; }
.maker-lot-tx small{ display:block; font-size:11.5px; color:var(--sub); margin-top:2px; }

/* ロット（実写の切り抜きが停まる駐車場） */
.lot-head{ display:flex; align-items:center; gap:10px; margin:2px 0 8px; }
.lot-back{
  appearance:none; cursor:pointer; background:var(--card); border:1px solid var(--line2); color:var(--ink);
  font-size:12px; font-weight:700; padding:7px 12px; border-radius:999px;
}
.lot-sign{ display:flex; align-items:baseline; gap:8px; }
.lot-sign span{ font-size:18px; font-weight:800; letter-spacing:.05em; }
.lot-sign small{ font-size:10px; letter-spacing:.32em; color:var(--dim); font-weight:700; }
.lot-head-sp{ flex:1 1 auto; }
.lot-space{
  position:relative; border-radius:20px; padding:16px 14px 18px; margin-bottom:6px; overflow:hidden;
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(255,255,255,.35), rgba(255,255,255,0) 55%),
    linear-gradient(180deg, #d7e1e4 0%, #e4e3d8 30%, #c9bda6 30.4%, #b2a891 100%);
  border:1px solid var(--line);
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
  transition:transform .45s cubic-bezier(.22,.8,.3,1), opacity .45s ease;
}
.lot-space.is-zoom{ transform:scale(1.55); opacity:.2; }
.lot-bay{
  position:relative; appearance:none; cursor:pointer; color:var(--ink);
  background:rgba(255,255,255,.10);
  border:1.5px solid rgba(255,255,255,.55); border-bottom-color:rgba(255,255,255,.18); border-radius:8px;
  padding:28px 8px 10px; display:flex; flex-direction:column; align-items:center; gap:3px;
  animation:lotIn .55s cubic-bezier(.22,.8,.3,1) both;
}
.lot-bay:active{ background:rgba(255,255,255,.22); }
.lot-tag{
  position:absolute; top:7px; left:50%; transform:translateX(-50%); white-space:nowrap; z-index:2;
  background:rgba(24,21,17,.88); color:#f2ede4; font-size:12.5px; font-weight:800; letter-spacing:.02em;
  padding:3px 9px; border-radius:99px; border:1px solid rgba(255,255,255,.14);
}
.lot-tag small{ font-size:9px; color:#b9b0a0; font-weight:700; margin-right:4px; letter-spacing:.08em; }
.lot-car{ position:relative; display:flex; justify-content:center; width:100%; min-height:64px; }
.lot-car-img{ width:94%; max-height:96px; object-fit:contain; position:relative; z-index:1; display:block; }
.lot-car-img.is-photo{ width:100%; height:76px; max-height:76px; object-fit:cover; border-radius:8px; }
.lot-shadow{
  position:absolute; left:50%; transform:translateX(-50%); bottom:1px; width:80%; height:13px; z-index:0;
  background:radial-gradient(ellipse at center, rgba(24,19,12,.42), rgba(24,19,12,0) 68%); border-radius:50%;
}
.lot-name{ font-size:12px; font-weight:700; color:#241f19; letter-spacing:.04em; text-shadow:0 1px 0 rgba(255,255,255,.28); }
.lot-state{ position:absolute; bottom:8px; right:8px; font-size:9.5px; font-weight:800; color:var(--warn); background:rgba(255,251,240,.92); padding:2px 7px; border-radius:99px; }
.lot-row{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left; appearance:none; cursor:pointer;
  background:var(--card); border:1px solid var(--line); border-radius:14px; padding:13px 15px; margin-bottom:9px; color:var(--ink);
}
.lot-row-tx{ flex:1 1 auto; min-width:0; }
.lot-row-tx b{ display:block; font-size:13.5px; }
.lot-row-tx small{ display:block; font-size:11px; color:var(--sub); margin-top:1px; }
.lot-row-price{ font-size:15px; font-weight:800; white-space:nowrap; }
@keyframes lotIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }

/* 詳細ステージ：空間に停めた実写を回す */
.stage{ margin:-18px -16px 0; position:relative; background:transparent; animation:stageIn .45s cubic-bezier(.22,.8,.3,1) both; }
@keyframes stageIn{ from{ opacity:.35; } to{ opacity:1; } }
.stage-view{ aspect-ratio:4/3; position:relative; overflow:hidden; }
.stage-img{ width:100%; height:100%; object-fit:cover; display:block; }
.stage .pano{ border-radius:0; aspect-ratio:4/3; }
.stage-pins{ position:absolute; inset:0; pointer-events:none; z-index:5; }
.stage-pins .pano-pin{ pointer-events:auto; }
.orb{ position:absolute; inset:0; overflow:hidden; touch-action:pan-y; user-select:none; -webkit-user-select:none; cursor:grab; background:#ddd6c6; }
.orb:active{ cursor:grabbing; }
.orb-world{ position:absolute; inset:0 -16px; z-index:0; will-change:transform; }
.orb-sky{ position:absolute; left:0; right:0; top:0; height:31%; background:linear-gradient(180deg,#c7d8de,#e7e8dc); }
.orb-floor{
  position:absolute; left:0; right:0; top:31%; bottom:0;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,0) 0 118px, rgba(255,255,255,.16) 118px 120px),
    linear-gradient(180deg,#c6bca7,#a3977f);
  border-top:2px solid rgba(255,255,255,.5);
}
.orb-shadow{
  position:absolute; left:50%; transform:translateX(-50%); bottom:9.5%; height:26px; z-index:1;
  background:radial-gradient(ellipse at center, rgba(24,19,12,.5), rgba(24,19,12,0) 68%); border-radius:50%;
}
.orb-frame{ position:absolute; left:50%; bottom:11%; z-index:2; will-change:transform,opacity; }
.orb-frame img{ display:block; height:100%; width:auto; pointer-events:none; }
.orb-frame .orb-pins{ position:absolute; inset:0; pointer-events:none; }
.orb-frame .orb-pins .pano-pin{ pointer-events:auto; }
.orb.pins-off .orb-pins{ display:none; }
.orb-flat{ background:#e9e4d8; }
.orb-flat .orb-frame{ inset:0; bottom:0; height:auto; transform:none !important; }
.orb-flat .orb-frame img{ width:100%; height:100%; object-fit:cover; }
.orb-door-btn{
  position:absolute; right:12px; bottom:60px; z-index:6; appearance:none; cursor:pointer;
  border:1px solid rgba(255,255,255,.35); background:rgba(24,21,17,.78); color:#f2ede4;
  font-size:12px; font-weight:700; padding:8px 14px; border-radius:99px;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.stage-nav{
  position:absolute; top:42%; z-index:7; width:38px; height:38px; border-radius:50%;
  border:1px solid rgba(255,255,255,.22); background:rgba(24,21,17,.55); color:#fff; font-size:20px; line-height:1;
  cursor:pointer; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; appearance:none; padding:0;
}
.stage-nav.prev{ left:10px; } .stage-nav.next{ right:10px; }
.stage-pin-toggle{
  position:absolute; top:12px; right:12px; z-index:7; display:inline-flex; align-items:center; gap:6px;
  appearance:none; cursor:pointer; border:1px solid rgba(255,255,255,.22); background:rgba(24,21,17,.55); color:#d8d2c6;
  font-size:11px; font-weight:700; padding:6px 11px; border-radius:99px; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.stage-pin-toggle .pt-dot{ width:7px; height:7px; border-radius:50%; background:#8b8578; }
.stage-pin-toggle.is-on{ color:#fff; }
.stage-pin-toggle.is-on .pt-dot{ background:var(--warn); }
.stage-bar{
  position:absolute; left:0; right:0; bottom:0; z-index:7; display:flex; align-items:flex-end; justify-content:space-between; gap:10px;
  padding:28px 12px 10px; background:linear-gradient(180deg, rgba(24,21,17,0), rgba(24,21,17,.55)); pointer-events:none;
}
.stage-bar > *{ pointer-events:auto; }
.stage-angles{ display:flex; gap:6px; flex-wrap:wrap; }
.stage-chip{
  appearance:none; cursor:pointer; border:1px solid rgba(255,255,255,.25); background:rgba(24,21,17,.55); color:#e8e2d4;
  font-size:11.5px; font-weight:700; padding:6px 12px; border-radius:99px; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.stage-chip.is-on{ background:#f4efe6; color:#14171a; border-color:#f4efe6; }
.stage-pos{ font-size:10.5px; color:rgba(244,239,230,.9); letter-spacing:.06em; white-space:nowrap; padding-bottom:5px; }
.detail-panel{ padding:16px 2px 2px; }
.detail-name{ font-size:19px; font-weight:800; letter-spacing:.02em; margin:2px 0 2px; }
.detail-price{ font-size:29px; font-weight:800; line-height:1.2; }
.detail-price small{ font-size:11.5px; color:var(--sub); font-weight:600; }

/* ピンの拡大（シート内） */
.pin-zoom{ position:relative; height:220px; border-radius:12px; margin-top:12px; background-size:300%; background-repeat:no-repeat; background-color:#e7e1d5; }
.pin-zoom span{ position:absolute; left:10px; bottom:8px; font-size:10px; color:rgba(255,255,255,.85); background:rgba(0,0,0,.5); padding:3px 8px; border-radius:99px; }
.pin-zoom-img{ width:100%; border-radius:12px; margin-top:12px; display:block; }

/* デモバッジ（販売コンソール専用） */
.demo-badge{ display:inline-block; background:#f3e8cf; color:var(--warn); font-size:10.5px; font-weight:800; letter-spacing:.06em; padding:2px 8px; border-radius:99px; margin-left:8px; vertical-align:2px; }

/* 認証：ロットの世界の上に浮くガラスカード（艦隊の文法） */
.auth-wrap{ position:relative; }
.auth-wrap > *:not(.auth-bg){ position:relative; z-index:1; }
.auth-bg{
  position:absolute; inset:-18px -16px -14px; z-index:0; overflow:hidden;
  background:linear-gradient(180deg,#d3dee2 0%, #e6e5da 52%, #cfc6b2 52.4%, #b3aa97 100%);
  border-bottom:1px solid var(--line);
}
.auth-lot{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:18px; opacity:.85; }
.auth-bay{ border:1.5px solid rgba(255,255,255,.5); border-bottom-color:rgba(255,255,255,.15); border-radius:8px; padding:12px 6px 8px; display:flex; justify-content:center; }
.auth-bay img{ width:88%; height:46px; object-fit:contain; display:block; filter:drop-shadow(0 7px 5px rgba(24,19,12,.35)); }
.glass-card{
  background:rgba(255,253,248,.66); border:1px solid rgba(255,255,255,.7);
  backdrop-filter:blur(16px) saturate(1.2); -webkit-backdrop-filter:blur(16px) saturate(1.2);
  box-shadow:0 24px 60px rgba(31,26,18,.18);
}
.glass-card .field input{ background:rgba(255,255,255,.78); border-color:var(--line2); color:var(--ink); }
.glass-card .field input:focus{ border-color:var(--acc2); }

/* ===== メーカーのお店（入口）／入店ベール ===== */
.shops{ margin-bottom:4px; }
.shop{
  display:block; width:100%; text-align:left; appearance:none; cursor:pointer; color:var(--ink);
  background:var(--card); border:1px solid var(--line); border-radius:18px; padding:0; margin-bottom:14px; overflow:hidden;
}
.shop:active{ transform:scale(.995); }
.shop-sign{
  display:flex; align-items:baseline; gap:10px; padding:13px 16px 11px;
  border-bottom:1px solid var(--line); background:linear-gradient(180deg,#fbf9f4, var(--card));
}
.shop-sign b{ font-size:18px; font-weight:800; letter-spacing:.06em; }
.shop-sign small{ font-size:9.5px; letter-spacing:.3em; color:var(--dim); font-weight:700; }
.shop-window{ position:relative; display:block; aspect-ratio:16/7.5; background:#e7e1d5; overflow:hidden; }
.shop-window img{ width:100%; height:100%; object-fit:cover; display:block; }
.shop-glass{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(112deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 34%), linear-gradient(0deg, rgba(24,21,17,.20), rgba(24,21,17,0) 46%);
}
.shop-window-none{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--dim); font-size:12px; letter-spacing:.14em; }
.shop-meta{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:11px 16px 13px; font-size:12px; color:var(--sub); }
.shop-enter{ color:var(--ink); font-weight:800; font-size:12.5px; white-space:nowrap; }
.enter-veil{
  position:fixed; inset:0; z-index:980; background:#f3f0ea;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .38s ease;
}
.enter-veil.is-in{ opacity:1; }
.enter-veil-tx{ text-align:center; }
.enter-veil-tx span{ display:block; font-size:25px; font-weight:800; letter-spacing:.08em; color:var(--ink); }
.enter-veil-tx small{ display:block; margin-top:6px; font-size:11px; letter-spacing:.24em; color:var(--dim); }

@media (prefers-reduced-motion: reduce){
  .lot-bay, .stage{ animation:none; }
  .enter-veil{ transition:none; }
  .lot-space{ transition:none; }
}