/* Japan drive field-test HUD — austere movie ground */
.jd-page { --m-bg:#0a0a0a; --m-ink:#f5f5f0; --m-mute:#a8a89e; --m-rule:rgba(245,245,240,.28); background:var(--m-bg); color:var(--m-ink); min-height:100dvh; }
.jd-wrap { max-width: 46rem; margin: 0 auto; padding: 2rem 1.1rem 3rem; }
.jd-eyebrow { font: 0.72rem/1.3 var(--font-sans, system-ui, sans-serif); letter-spacing: .28em; text-transform: uppercase; color: var(--m-mute); }
.jd-wrap h1 { font-weight: 500; font-size: 1.6rem; margin: .4rem 0 1rem; }
.jd-gate, .jd-hud { border: 1px solid var(--m-rule); padding: 1.1rem 1.15rem; background: rgba(255,255,255,.03); }
.jd-gate label { display:block; font-size:.85rem; color:var(--m-mute); margin-bottom:.45rem; }
.jd-gate input { width:100%; background:#111; color:var(--m-ink); border:1px solid var(--m-rule); padding:.55rem .7rem; font: inherit; }
.jd-gate button, .jd-hud button { margin-top:.75rem; background:transparent; color:var(--m-ink); border:1px solid var(--m-rule); padding:.45rem .85rem; cursor:pointer; }
.jd-err { color:#d4a0a0; font-size:.85rem; min-height:1.2em; }
.jd-grids { display:grid; grid-template-columns: 1fr 1fr; gap:1rem; margin:1.1rem 0; }
.jd-grid { display:grid; grid-template-columns: 1fr 1fr; gap:.45rem; }
.jd-cell { border:1px solid var(--m-rule); padding:.55rem .6rem; font-size:.8rem; min-height:4.2rem; }
.jd-cell strong { display:block; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--m-mute); }
.jd-meta { font-size:.85rem; color:var(--m-mute); }
canvas.jd-flow { width:100%; height:160px; display:block; background:#050505; border:1px solid var(--m-rule); margin-top:.8rem; }
.jd-hud[hidden], .jd-gate[hidden] { display:none !important; }
@media (max-width: 640px) { .jd-grids { grid-template-columns: 1fr; } }

.jd-modules, .jd-factives { display:flex; flex-wrap:wrap; gap:.35rem; margin:.65rem 0 .2rem; }
.jd-chip, .jd-gate { border:1px solid var(--m-rule); padding:.18rem .45rem; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--m-mute); }
.jd-chip { color:#c9b896; }
.jd-chip.is-decode { border-color:rgba(201,184,150,.45); color:#e8e0d2; }
.jd-status-wait { color:var(--m-mute); font-size:.8rem; }

.jd-cell[data-load] {
  background: rgba(232, 224, 210, calc(0.04 + var(--jd-load, 0) * 0.55));
}
