/* The wall — the opening diagnostics and the sign-in / agreement screens.
   Synthesised Australian colours: eucalypt green, wattle gold and the flag's
   navy, lifted into a 2030 palette: luminous, translucent, opened up with
   light rather than closed in with black. Red is reserved for one job: an
   error or a failed check. Loaded after future.css; phone.css stays last. */

:root[data-edition="AU"] {
  /* the flag, matured and made serious: one dark navy ground, pearl and
     ivory ink, a champagne thread for the wordmark and links, claret held
     back for the seal (signature, pressed primary) and an error. Ticks and
     "ok" are pearl, never green. Nothing glows, nothing drifts. */
  --wall-navy: #0b1f4b;
  --wall-navy-lit: #17305f;
  --wall-navy-deep: #040c20;
  --wall-navy-rgb: 11, 31, 75;
  --wall-navy-lit-rgb: 23, 48, 95;
  --wall-navy-deep-rgb: 4, 12, 32;
  --wall-claret: #8e1b2e;
  --wall-claret-rgb: 142, 27, 46;
  --wall-claret-grad: linear-gradient(135deg, #9a2238 0%, #8e1b2e 55%, #6a1424 100%);
  --wall-accent: #d6cbb0;
  --wall-accent-lum: #ece5d2;
  --wall-accent-rgb: 214, 203, 176;
  --wall-accent-lum-rgb: 236, 229, 210;
  --wall-ok: #d6cbb0;
  --wall-ok-lum: #ece5d2;
  --wall-ok-rgb: 214, 203, 176;
  --wall-red: #a3273d;
  --wall-red-lum: #e8586b;
  --wall-red-rgb: 163, 39, 61;
  --wall-ink: #f1ede4;
  --wall-ink-muted: #b4bdd3;
  --wall-glass: rgba(214, 203, 176, 0.03);
  --wall-glass-strong: rgba(214, 203, 176, 0.06);
  --wall-line: rgba(214, 203, 176, 0.20);
  --wall-line-soft: rgba(214, 203, 176, 0.10);
}

/* ---------- the ground: one still blend of navy, deeper at the edges ---------- */
.view-login,
#view-opening.opening-screen {
  background:
    radial-gradient(110% 80% at 80% 12%, rgba(var(--wall-navy-lit-rgb), 0.80) 0%, transparent 60%),
    radial-gradient(90% 70% at 10% 20%, rgba(var(--wall-navy-rgb), 0.70) 0%, transparent 60%),
    radial-gradient(60% 50% at 20% 94%, rgba(var(--wall-claret-rgb), 0.10) 0%, transparent 60%),
    linear-gradient(165deg, var(--wall-navy) 0%, #071531 45%, var(--wall-navy-deep) 100%) !important;
  color: var(--wall-ink);
}
/* the drift of light, the grid and the horizon line are retired: nothing moves */
.view-login::before,
#view-opening .opening-bg-sweep,
.view-login::after,
#view-opening .opening-bg-grid,
.login-scanlines,
#view-opening .opening-bg-scanlines,
#view-opening .opening-bg-horizon {
  display: none !important;
  animation: none !important;
  background: none !important;
}

/* ---------- the glass: quiet depth, one hairline ---------- */
.login-card,
.opening-card,
.opening-panel,
#view-opening .opening-play {
  background:
    linear-gradient(180deg, var(--wall-glass-strong), var(--wall-glass)),
    rgba(var(--wall-navy-rgb), 0.45) !important;
  border: 1px solid var(--wall-line) !important;
  border-radius: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 24px 60px rgba(var(--wall-navy-deep-rgb), 0.45) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.2);
  backdrop-filter: blur(20px) saturate(1.2);
}
/* the checks are a plain ledger inside the panel, not a second box */
#view-opening .opening-status-lines,
#view-opening .opening-checks {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
/* the corner ticks and telemetry captions are retired (login.css, opening.css) */

/* ---------- the wordmark: ink and champagne ---------- */
.view-login .brand-word-ink, #view-opening .opening-wordmark .ink { color: var(--wall-ink); }
.view-login .brand-word-accent, #view-opening .opening-wordmark .accent {
  color: var(--wall-accent) !important;
  text-shadow: none;
}
.login-caret, .opening-wordmark .caret { display: none !important; }

/* ---------- controls ---------- */
.view-login .login-tabs { background: rgba(var(--wall-navy-deep-rgb), 0.35) !important; border: 1px solid var(--wall-line-soft) !important; }
.view-login .login-tabs-indicator {
  background: rgba(var(--wall-accent-rgb), 0.12) !important;
  border: 1px solid rgba(var(--wall-accent-rgb), 0.22);
  box-shadow: none;
}
.view-login .login-tab { color: var(--wall-ink-muted) !important; }
.view-login .login-tab.is-active { color: var(--wall-ink) !important; }
.view-login .field-label { color: var(--wall-ink-muted) !important; letter-spacing: 0.12em; }
.view-login .field-input, .view-login .nda-box {
  background: rgba(var(--wall-navy-deep-rgb), 0.32) !important;
  border: 1px solid var(--wall-line-soft) !important;
  color: var(--wall-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.view-login .field-input:focus {
  border-color: var(--wall-accent) !important;
  box-shadow: none !important;
  outline: none;
}
.view-login .btn-primary,
#view-opening .opening-enter-btn {
  background: transparent !important;
  border: 1px solid rgba(var(--wall-accent-rgb), 0.55) !important;
  border-radius: 6px;
  color: var(--wall-ink) !important;
  text-shadow: none;
  box-shadow: none !important;
}
.view-login .btn-primary:hover, .view-login .btn-primary:focus-visible,
#view-opening .opening-enter-btn:hover, #view-opening .opening-enter-btn:focus-visible {
  background: var(--wall-claret) !important;
  border-color: var(--wall-claret) !important;
  color: var(--wall-ink) !important;
  text-shadow: none;
  box-shadow: none !important;
}
/* a disabled primary never takes the seal, hovered or not */
.view-login .btn-primary:disabled, .view-login .btn-primary:disabled:hover {
  background: transparent !important;
  border-color: var(--wall-line-soft) !important;
  color: var(--wall-ink-muted) !important;
  cursor: not-allowed;
}
.view-login .btn-secondary, #view-opening .opening-retry-btn {
  border-color: rgba(var(--wall-ok-rgb), 0.45) !important;
  color: var(--wall-ok-lum) !important;
  background: transparent !important;
}
.view-login .nda-check { color: var(--wall-ink-muted); }
.view-login .nda-title { color: var(--wall-accent) !important; letter-spacing: 0.12em; }
.view-login .nda-scroll-hint { color: var(--wall-ok-lum) !important; }

/* status strip: pearl dots, muted words, nothing lit */
.login-status-strip { color: var(--wall-ink-muted) !important; border-color: var(--wall-line-soft) !important; }
.login-status-strip .dot { background: var(--wall-ok) !important; box-shadow: none; }

/* the checks list */
#view-opening .opening-status-lines li, #view-opening .opening-check { color: var(--wall-ink-muted); }
#view-opening .opening-check.is-ok, #view-opening .opening-status-lines .ok { color: var(--wall-ink); }
#view-opening .opening-check .tick, #view-opening .opening-status-lines .tick { color: var(--wall-ok-lum) !important; }
#view-opening .opening-progress, #view-opening .opening-bar { --accent: var(--wall-accent); }
#view-opening .opening-progress-fill, #view-opening .opening-bar-fill {
  background: var(--wall-accent) !important;
  box-shadow: none;
}
#view-opening .opening-result-text { color: var(--wall-ink-muted) !important; }

/* ---------- red: only for an error or a failed check ---------- */
.view-login .form-error,
.view-login .core-down-banner,
#view-opening .opening-check.is-fail,
#view-opening .opening-status-lines .fail,
#view-opening .opening-result-text.is-fail,
#view-opening .opening-error {
  color: var(--wall-red-lum) !important;
}
#view-opening .opening-check.is-fail .tick, #view-opening .opening-status-lines .fail .tick { color: var(--wall-red) !important; }
.view-login .form-error:not(:empty) {
  border: 1px solid rgba(var(--wall-red-rgb), 0.35) !important;
  background: rgba(var(--wall-red-rgb), 0.08) !important;
  border-radius: 10px; padding: 8px 12px;
}

/* the speaker is gone from the wall; if any copy of it lingers, it never shows */
.opening-mute-btn { display: none !important; }

@media (prefers-reduced-transparency: reduce) {
  .login-card, .opening-card, .opening-panel { background: var(--wall-navy) !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* The wall fills the screen and holds the card in the middle; the ground
   never stops half way down (it did: the view was only as tall as the card). */
.view-login:not([hidden]) {
  min-height: 100dvh !important;
  display: grid !important;
  grid-template-rows: 1fr auto auto 1fr;
  align-items: center;
  justify-items: center;
  padding: max(24px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom)) !important;
  box-sizing: border-box;
  position: relative;
}
.view-login:not([hidden]) > .login-hud { grid-row: 1 / -1; grid-column: 1; pointer-events: none; }
.view-login:not([hidden]) > .login-scanlines { grid-row: 1 / -1; grid-column: 1; }
.view-login:not([hidden]) > .login-card { grid-row: 2; grid-column: 1; width: min(440px, 100%); }
.view-login:not([hidden]) > .login-status-strip { grid-row: 4; grid-column: 1; align-self: end; }
.view-login:not([hidden]) > .core-down-banner { grid-row: 1; grid-column: 1; align-self: end; }
.view-login:not([hidden]) > .login-status-strip { margin-bottom: 24px; }

/* forgot / reset: a quiet champagne link, a full 44 px hand */
.view-login .link-btn {
  display: block; width: 100%; min-height: 44px; margin-top: 6px;
  background: transparent; border: 0; color: var(--wall-accent, var(--accent)); font: inherit; font-size: 13px;
  letter-spacing: 0.04em; cursor: pointer; text-decoration: underline; text-decoration-color: rgba(var(--wall-accent-rgb), 0.35); text-underline-offset: 4px;
}
.view-login .link-btn:hover, .view-login .link-btn:focus-visible { color: var(--wall-accent-lum, var(--accent-strong)); text-decoration-color: currentColor; outline: none; }
.view-login .login-help { margin: 0 0 12px; color: var(--wall-ink-muted, var(--text-muted)); font-size: 13px; line-height: 1.5; }
.view-login .form-note { margin: 8px 0 0; padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(var(--wall-ok-rgb), 0.35); background: rgba(var(--wall-ok-rgb), 0.08); color: var(--wall-ink, var(--text)); font-size: 13px; line-height: 1.5; }
.view-login .form-error.is-ok { color: var(--wall-ok-lum, #e9e4d8) !important; border-color: rgba(var(--wall-ok-rgb), 0.35) !important; background: rgba(var(--wall-ok-rgb), 0.08) !important; border-radius: 10px; padding: 8px 12px; }

/* ==========================================================================
   The NDA wall — the agreement, full screen, signed properly (owner: "make
   it clearly an NDA, and sign properly at the bottom so the person is
   always aware"). #nda-box in the card is now only the TRIGGER — a plain
   44px-tall button, never the scrolling reading surface app.css/login.css
   still style for the old inline box (max-height/overflow/pre-wrap), which
   this overrides for the wall era. ========================================== */

.view-login .nda-box {
  display: flex; align-items: center; justify-content: center;
  max-height: none; overflow: visible; white-space: normal;
  min-height: 44px; width: 100%;
  font-family: inherit; font-size: 14px; font-weight: 600;
  letter-spacing: 0.02em; text-align: center; cursor: pointer;
  color: var(--wall-accent-lum, var(--accent-strong)) !important;
  background: rgba(var(--wall-navy-deep-rgb), 0.32) !important;
  border: 1px solid var(--wall-line, var(--border)) !important;
  border-radius: 10px;
}
.view-login .nda-box:hover, .view-login .nda-box:focus-visible {
  border-color: var(--wall-accent) !important;
  box-shadow: none;
  outline: none;
}
.view-login .nda-box:disabled { opacity: 0.5; cursor: not-allowed; }
.nda-signed-line {
  margin: 6px 0 0; font-size: 13px; color: var(--wall-ok-lum, #e9e4d8);
  display: flex; align-items: center; gap: 6px;
}
.nda-signed-line::before { content: "✓"; font-weight: 700; }

.nda-wall {
  position: fixed; inset: 0; z-index: 400;
  display: flex; align-items: center; justify-content: center;
}
.nda-wall[hidden] { display: none; }
.nda-wall-scrim {
  position: absolute; inset: 0;
  background: radial-gradient(120% 90% at 50% 0%, rgba(var(--wall-navy-lit-rgb), 0.92), var(--wall-navy-deep, #040b26) 80%);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.nda-wall-sheet {
  position: relative;
  display: flex; flex-direction: column;
  width: min(760px, 100%);
  height: 100dvh; max-height: 100dvh;
  background: linear-gradient(180deg, var(--wall-glass-strong), var(--wall-glass));
  border-left: 1px solid var(--wall-line);
  border-right: 1px solid var(--wall-line);
  box-shadow: 0 0 80px rgba(var(--wall-navy-deep-rgb), 0.6);
}
@media (min-width: 560px) {
  .nda-wall-sheet {
    height: min(92dvh, 880px); max-height: 92dvh;
    border-radius: 18px;
    border: 1px solid var(--wall-line);
  }
}

.nda-wall-head {
  flex: 0 0 auto;
  position: relative;
  padding: max(18px, env(safe-area-inset-top)) 56px 12px max(20px, env(safe-area-inset-left));
  border-bottom: 1px solid var(--wall-line-soft);
  text-align: center;
}
.nda-wall-close {
  position: absolute; top: max(10px, env(safe-area-inset-top)); right: max(10px, env(safe-area-inset-right));
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(var(--wall-navy-deep-rgb), 0.4); border: 1px solid var(--wall-line-soft);
  border-radius: 50%; color: var(--wall-ink-muted); cursor: pointer;
}
.nda-wall-close:hover, .nda-wall-close:focus-visible { color: var(--wall-accent-lum); border-color: var(--wall-accent); outline: none; }
.nda-wall-title {
  margin: 0; font-size: 19px; font-weight: 700; letter-spacing: 0.02em;
  color: var(--wall-ink);
}
.nda-wall-meta {
  margin: 4px 0 0; font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--wall-accent, var(--accent)); font-family: var(--font-mono);
}

.nda-wall-sphere-slot {
  flex: 0 0 auto;
  display: flex; justify-content: center;
  padding: 12px max(16px, env(safe-area-inset-left)) 4px;
}

.nda-wall-scroll {
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 8px max(16px, env(safe-area-inset-left)) max(28px, env(safe-area-inset-bottom));
}
.nda-wall-column {
  max-width: 68ch;
  margin: 0 auto;
}
.nda-wall-text {
  font-size: 17px;
  line-height: 1.7;
  color: var(--wall-ink);
}
.nda-wall-text p, .nda-wall-text li { margin: 0 0 1em; }
.nda-wall-text h1, .nda-wall-text h2, .nda-wall-text h3, .nda-wall-text h4 {
  color: var(--wall-accent, var(--accent)); margin: 1.2em 0 0.5em; line-height: 1.3;
}
/* The two "NON-DISCLOSURE AGREEMENT" section headings (top, and again just
   before the terms-of-use section) — capitals, gold, letter-spaced, the
   display font, per the owner's addition. Both are real <h4>s (##, via
   renderMarkdown), so the sphere's karaoke reads them like any other
   sentence, and this only styles their look. */
.nda-wall-text h4 {
  font-family: var(--font-display, inherit);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--wall-accent-lum, var(--wall-accent, var(--accent-strong)));
  text-shadow: none;
}
.nda-wall-text h4:first-child { margin-top: 0; }
.nda-wall-text .ra-sentence--live { cursor: pointer; }

.nda-wall-sign {
  margin: 32px 0 0;
  padding: 20px;
  border-top: 1px solid var(--wall-line);
  border-radius: 14px;
  background: rgba(var(--wall-navy-deep-rgb), 0.28);
}
.nda-wall-sign-title {
  margin: 0 0 14px; font-size: 15px; font-weight: 700; color: var(--wall-accent-lum, var(--accent-strong));
}
.nda-wall-sign .field-label { display: block; margin: 12px 0 4px; }
.nda-wall-sign .field-input {
  width: 100%; min-height: 44px; box-sizing: border-box;
}
.nda-wall-sign .field-input[readonly] { opacity: 0.75; cursor: default; }
.nda-wall-tick { display: flex; align-items: flex-start; gap: 10px; margin: 16px 0; min-height: 44px; }
.nda-wall-tick input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--wall-accent, var(--accent)); }
.nda-wall-hint {
  margin: 0 0 12px; font-size: 12.5px; color: var(--wall-ink-muted);
  transition: opacity 0.2s ease;
}
.nda-wall-hint.is-met { color: var(--wall-ok-lum, #e9e4d8); }
.nda-wall-sign-btn {
  min-height: 48px;
  background: var(--wall-claret) !important;
  color: var(--wall-ink) !important;
  border: 1px solid var(--wall-claret) !important;
  border-radius: 6px;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.nda-wall-sign-btn:disabled {
  background: rgba(var(--wall-navy-deep-rgb), 0.32) !important;
  color: var(--wall-ink-muted) !important;
  border-color: var(--wall-line-soft) !important;
  cursor: not-allowed;
}

@media (max-width: 480px) {
  .nda-wall-text { font-size: 16px; }
  .nda-wall-title { font-size: 17px; }
}

/* the background never scrolls behind the open wall */
body.nda-wall-open { overflow: hidden; }