/* Book Gold Quiet Luxury
   Production visual integration of workshop concept #6:
   workshops/book-10-gallery/style-06-gemini-quiet-luxury/
   Design-only layer. No booking/runtime behavior lives here. */

:root[data-skin="quiet-luxury-gold"] {
  color-scheme: light;

  --skin-canvas: #f7f5f0;
  --skin-surface: #fcfaf7;
  --skin-surface-raised: #ffffff;
  --skin-text: #2b2723;
  --skin-text-strong: #1b1816;
  --skin-text-muted: #6d665f;
  --skin-text-subtle: #948b81;

  /* Gold is taken from the approved Book emblem family, not the workshop bronze. */
  --skin-primary: #e1b94f;
  --skin-primary-bright: #f4d979;
  --skin-primary-deep: #9b6f24;

  /* Keep the emblem's cool accent available only for functional state. */
  --skin-secondary: #6ecfdf;
  --skin-secondary-soft: #4f97a3;
  --skin-danger: #8c433e;

  --ql-bg: #f7f5f0;
  --ql-bg-soft: #f1ece3;
  --ql-surface: #fcfaf7;
  --ql-surface-raised: #ffffff;
  --ql-border: #e6e0d5;
  --ql-border-subtle: #ece8de;
  --ql-border-strong: #d5cdc0;
  --ql-ink: #1b1816;
  --ql-ink-mid: #5e5851;
  --ql-ink-muted: #8e877d;
  --ql-ink-light: #b7b0a4;
  --ql-gold: #d9ad3f;
  --ql-gold-bright: #f4d979;
  --ql-gold-deep: #956824;
  --ql-gold-dim: rgba(217, 173, 63, 0.11);
  --ql-cyan: #68c9da;
  --ql-danger: #8c433e;
  --ql-danger-bg: #faf2f1;
  --ql-font-serif: "Iowan Old Style", "Palatino Linotype", Palatino, "New York", Garamond, Georgia, serif;
  --ql-font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Helvetica Neue", Arial, sans-serif;
  --ql-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  --ql-shadow-subtle: 0 4px 20px -2px rgba(27, 24, 22, 0.045), 0 1px 2px rgba(27, 24, 22, 0.035);
  --ql-shadow-card: 0 14px 36px -10px rgba(27, 24, 22, 0.10), 0 1px 3px rgba(27, 24, 22, 0.035);

  --font-sans: var(--ql-font-sans);
  --font-serif-mark: var(--ql-font-serif);
  --gradient-canvas:
    radial-gradient(circle at 50% -10%, #ffffff 0%, rgba(255,255,255,.34) 24%, transparent 56%),
    linear-gradient(180deg, var(--ql-bg) 0%, var(--ql-bg-soft) 100%);
  --gradient-primary-text: linear-gradient(180deg, #fff2c6 0%, var(--ql-gold-bright) 26%, var(--ql-gold) 62%, var(--ql-gold-deep) 100%);
  --gradient-primary-action: linear-gradient(180deg, #231f1c 0%, var(--ql-ink) 100%);
  --shadow-primary-glow: 0 9px 24px rgba(149, 104, 36, .12);
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"],
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] body {
  background: var(--ql-bg) !important;
  color: var(--ql-ink) !important;
  color-scheme: light;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] body,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] button,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] input,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] textarea {
  font-family: var(--ql-font-sans) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] body {
  background:
    radial-gradient(circle at 50% -8%, #fff 0%, rgba(255,255,255,.55) 18%, transparent 52%),
    linear-gradient(180deg, var(--ql-bg) 0%, var(--ql-bg-soft) 100%) !important;
}

/* Access becomes the quiet-luxury invitation card while the real emblem animation stays intact. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-screen {
  background:
    radial-gradient(circle at 50% 0%, #fff 0%, rgba(255,255,255,.45) 22%, transparent 58%),
    var(--ql-bg) !important;
  padding:
    max(24px, env(safe-area-inset-top))
    20px
    max(24px, env(safe-area-inset-bottom)) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-panel {
  width: min(90vw, 398px) !important;
  padding: 0 28px 30px;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-panel::before {
  content: none !important;
  display: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .emblem-origin,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .emblem,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .emblem-complete {
  filter: drop-shadow(0 6px 16px rgba(149, 104, 36, .14)) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .emblem-origin {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  width: min(94vw, 78vh, 760px) !important;
  height: min(94vw, 78vh, 760px) !important;
  margin: 0 !important;
  transform: translate(-50%, -50%) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-panel > p {
  margin-top: 0 !important;
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif) !important;
  font-size: 34px !important;
  line-height: 1.12 !important;
  font-weight: 400 !important;
  letter-spacing: -.025em;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-form {
  gap: 16px !important;
  margin-top: 26px !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-form label {
  display: block !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: inset 0 -1px 0 rgba(149,104,36,.28) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-form input {
  height: 62px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ql-gold-deep) !important;
  -webkit-text-fill-color: var(--ql-gold-deep) !important;
  -webkit-text-security: disc;
  font-family: var(--ql-font-serif) !important;
  font-size: 30px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: .38em !important;
  font-variant-numeric: lining-nums tabular-nums;
  text-shadow: 0 1px 0 rgba(255,255,255,.78), 0 4px 14px rgba(149,104,36,.16);
  caret-color: var(--ql-gold-deep) !important;
  box-shadow: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-form label:focus-within {
  border-color: transparent !important;
  box-shadow: inset 0 -1px 0 var(--ql-gold), 0 10px 28px -24px rgba(149,104,36,.75) !important;
}

/* Production shell: preserve the real flow, but give it Maison No. 6's open canvas and spacing. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .app-shell {
  width: min(100%, 520px) !important;
  max-width: 520px !important;
  min-height: var(--book-vvh, 100dvh) !important;
  margin: 0 auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .app-shell::before {
  display: none;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .app-header {
  position: sticky !important;
  top: 0;
  z-index: 20;
  height: 76px !important;
  min-height: 76px !important;
  padding:
    max(10px, env(safe-area-inset-top))
    22px
    10px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ql-border-subtle) !important;
  background: rgba(247, 245, 240, .90) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .emblem-inside {
  width: 43px !important;
  height: 43px !important;
  opacity: 1;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-back {
  color: var(--ql-ink-mid) !important;
  border: 0 !important;
  background: transparent !important;
  font-weight: 400 !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-back:active {
  background: var(--ql-bg-soft) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .flow {
  width: 100% !important;
  max-width: none !important;
  min-height: calc(var(--book-vvh, 100dvh) - 76px) !important;
  padding: 0 24px !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .step {
  width: 100% !important;
  max-width: none !important;
  min-height: calc(var(--book-vvh, 100dvh) - 76px) !important;
  padding: 34px 0 calc(34px + env(safe-area-inset-bottom)) !important;
  background: transparent !important;
  color: var(--ql-ink) !important;
  box-shadow: none !important;
  animation: ql-production-in .34s cubic-bezier(.16,1,.3,1);
}

@keyframes ql-production-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes ql-production-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Day/date view owns a horizontal centering transform on tablet.
   Never animate transform here or Back visibly shifts the whole screen. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-day {
  animation: ql-production-fade .22s ease-out !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .step h1,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .step h2 {
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif) !important;
  font-weight: 400 !important;
  letter-spacing: -.02em !important;
  text-shadow: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .step h1 {
  margin: 6px 0 26px !important;
  font-size: clamp(34px, 9vw, 42px) !important;
  line-height: 1.14 !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .step h2 {
  font-size: 24px !important;
  line-height: 1.2 !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .eyebrow {
  color: var(--ql-gold-deep) !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  letter-spacing: .19em !important;
  text-transform: uppercase;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .field-help,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .status-line,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .privacy-mini,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .location-explainer {
  color: var(--ql-ink-mid) !important;
}

/* Day, host, location, and review choices become the workshop's restrained raised cards. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .choice-button,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .time-chip,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .host-choice,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .review-card,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .selected-time,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .optional-panel,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .selected-place-card {
  border: 1px solid var(--ql-border) !important;
  border-radius: 10px !important;
  background: var(--ql-surface-raised) !important;
  color: var(--ql-ink) !important;
  box-shadow: var(--ql-shadow-subtle) !important;
  background-image: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured {
  border: 1px solid rgba(217,173,63,.34) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 88% 15%, rgba(244,217,121,.18), transparent 30%),
    linear-gradient(145deg, #fffdf9 0%, #f7f1e7 100%) !important;
  box-shadow: 0 18px 45px -24px rgba(27,24,22,.28) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured-kicker {
  color: var(--ql-gold-deep) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured strong {
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif) !important;
  font-weight: 400 !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 9px !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini {
  border: 1px solid var(--ql-border) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini strong {
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif) !important;
  font-weight: 400 !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .now-choice {
  border: 0 !important;
  border-top: 1px solid var(--ql-border-subtle) !important;
  border-bottom: 1px solid var(--ql-border-subtle) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .choice-button:hover:not(:disabled),
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .host-choice:hover,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .time-chip:hover:not(:disabled) {
  border-color: var(--ql-gold) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .choice-button[aria-pressed="true"],
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .choice-button.selected,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .host-choice[aria-pressed="true"],
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .time-chip.selected {
  border-color: var(--ql-ink) !important;
  background: var(--ql-ink) !important;
  color: #fff !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .choice-button[aria-pressed="true"] *,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .choice-button.selected *,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .host-choice[aria-pressed="true"] * {
  color: #fff !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .host-grid {
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .host-choice {
  min-height: 64px !important;
  padding: 16px !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .host-choice strong {
  font-family: var(--ql-font-serif);
  font-size: 18px;
  font-weight: 400 !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .selected-time {
  margin-bottom: 20px !important;
  padding: 16px 18px !important;
  border-radius: 14px !important;
  box-shadow: var(--ql-shadow-card) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .selected-time strong {
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif);
  font-size: 20px;
  font-weight: 400;
}

/* The location card already says what to do. Do not repeat a second prompt
   above it; this also prevents the old location instruction flashing. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .selected-time.selected-time--pending {
  display: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .optional-panel,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .selected-place-card {
  padding: 18px !important;
  border-radius: 14px !important;
  box-shadow: var(--ql-shadow-card) !important;
}

/* The generic .step h2 rule and human-flow's display clamp both target this
   heading, and whichever won left it cropped inside the panel. Settle it here,
   with descender headroom that survives either font-size. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #location-wrap > h2,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #other-location-wrap > h2 {
  display: block !important;
  overflow: visible !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 0 2px !important;
  padding: 0 !important;
  font-size: clamp(26px, 7.2vw, 34px) !important;
  line-height: 1.24 !important;
  letter-spacing: -.02em !important;
  text-transform: lowercase;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: none;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .place-search-shell,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .place-autocomplete-mount {
  background: transparent !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] input,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] textarea,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] gmp-place-autocomplete {
  border: 1px solid var(--ql-border-strong) !important;
  border-radius: 10px !important;
  background: var(--ql-surface-raised) !important;
  color: var(--ql-ink) !important;
  box-shadow: var(--ql-shadow-subtle) !important;
  background-image: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #form-location {
  font-size: 18px !important; /* preserves the no-iOS-zoom safety floor */
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #form-notes {
  min-height: 112px !important;
  padding: 15px !important;
  font-size: 16px !important;
  line-height: 1.5;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] input:focus,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] textarea:focus {
  border-color: var(--ql-gold) !important;
  outline: none;
  box-shadow: 0 0 0 3px var(--ql-gold-dim), var(--ql-shadow-subtle) !important;
}

/* Keep the existing iOS wheel mechanics, only reskin the material and hierarchy. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-picker .picker-rollers {
  border: 1px solid var(--ql-border) !important;
  border-radius: 16px !important;
  background: var(--ql-surface-raised) !important;
  box-shadow: var(--ql-shadow-card) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-label,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-label small {
  background: var(--ql-surface-raised) !important;
  color: var(--ql-gold-deep) !important;
  text-shadow: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-divider {
  background: var(--ql-border-subtle) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-band {
  border-color: rgba(217, 173, 63, .38) !important;
  background: linear-gradient(90deg, rgba(217,173,63,.035), rgba(217,173,63,.10), rgba(217,173,63,.035)) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-value {
  color: var(--ql-ink-mid) !important;
  font-family: var(--ql-font-serif) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-value.selected {
  color: var(--ql-ink) !important;
  font-weight: 500 !important;
  text-shadow: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-summary {
  border-left-color: var(--ql-gold) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-summary strong {
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif);
  font-weight: 400 !important;
  text-shadow: none !important;
}

/* Primary actions match concept #6: ink-filled, quiet, and full width. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .primary-action,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .flow-continue,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .note-actions .gold-word,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-form .gold-word {
  width: 100% !important;
  min-height: 52px !important;
  padding: 14px 20px !important;
  border: 1px solid var(--ql-ink) !important;
  border-radius: 10px !important;
  background: var(--ql-ink) !important;
  color: #fff !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase;
  filter: none !important;
  box-shadow: 0 5px 18px rgba(27,24,22,.12) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .primary-action:active,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .flow-continue:active,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .note-actions .gold-word:active {
  transform: translateY(1px);
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .text-button,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .current-location-button,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-refresh {
  color: var(--ql-ink-mid) !important;
  border-color: var(--ql-border-strong) !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Legacy note compatibility only. The canonical post-submit surface is the
   persisted request card, so old tabs must not show an extra branded receipt. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-note {
  justify-content: center !important;
  text-align: center !important;
  background: transparent !important;
  color: var(--ql-ink) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-note::before {
  content: none !important;
  display: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-note .emblem-complete {
  width: 126px !important;
  height: 126px !important;
  margin: 6px auto 28px !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-note #confirmed-copy,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-note .note-help {
  color: var(--ql-ink-mid) !important;
  text-shadow: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .note-actions {
  gap: 10px;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .request-management-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
  width: 100% !important;
  margin-top: 16px !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .request-management-actions .text-button {
  width: 100% !important;
  min-height: 48px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--ql-border-strong) !important;
  border-radius: 10px !important;
  background: var(--ql-surface-raised) !important;
  color: var(--ql-ink-mid) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .request-management-actions .request-cancel {
  border-color: rgba(140,67,62,.22) !important;
  background: var(--ql-danger-bg) !important;
  color: var(--ql-danger) !important;
}

/* Persisted request-state overlay must visually belong to the same skin. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #guest-booking-state {
  top: 76px !important;
  right: auto !important;
  bottom: 0 !important;
  left: 50% !important;
  width: min(100%, 520px) !important;
  padding: 34px 24px calc(34px + env(safe-area-inset-bottom)) !important;
  border: 0 !important;
  background:
    radial-gradient(circle at 50% 0%, #fff 0%, rgba(255,255,255,.3) 24%, transparent 60%),
    var(--ql-bg) !important;
  color: var(--ql-ink) !important;
  box-shadow: none !important;
  transform: translateX(-50%) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #guest-booking-state h1 {
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif) !important;
  font-size: clamp(34px, 9vw, 42px) !important;
  font-weight: 400 !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #guest-booking-state .guest-state-kicker {
  color: var(--ql-gold-deep) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #guest-booking-state .guest-state-when {
  padding: 16px !important;
  border: 1px solid var(--ql-border) !important;
  border-radius: 14px !important;
  background: var(--ql-surface-raised) !important;
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif);
  box-shadow: var(--ql-shadow-card) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #guest-booking-state .guest-state-copy {
  color: var(--ql-ink-mid) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #guest-booking-state .guest-state-action {
  min-height: 50px !important;
  border: 1px solid var(--ql-border-strong) !important;
  border-radius: 10px !important;
  background: var(--ql-surface-raised) !important;
  color: var(--ql-ink) !important;
  box-shadow: var(--ql-shadow-subtle) !important;
}

/* Toast remains high contrast, but loses the old neon treatment. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .toast-card {
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 999px !important;
  background: var(--ql-ink) !important;
  color: #fff !important;
  box-shadow: 0 12px 34px rgba(27,24,22,.20) !important;
}

/* Tablet: same composition, slightly more breathing room, never a desktop redesign. */
@media (min-width: 700px) {
  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .app-shell {
    max-width: 580px !important;
  }

  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .flow {
    padding: 0 34px !important;
  }

  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .step {
    padding: 42px 0 calc(42px + env(safe-area-inset-bottom)) !important;
  }

  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #guest-booking-state {
    width: min(100%, 580px) !important;
    padding-inline: 34px !important;
  }
}

@media (max-width: 380px) {
  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .flow {
    padding-inline: 18px !important;
  }

  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-panel {
    padding-inline: 22px;
  }

  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .step h1 {
    font-size: 33px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .step {
    animation: none;
  }
}


/* Access sequence: copy clears first; the emblem layer appears only after the fade gate. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #access-modal.access-success-fading .access-panel > p,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #access-modal.access-success-fading #access-form {
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(-6px) !important;
  filter: blur(3px) !important;
  transition: opacity 360ms ease, transform 360ms ease, filter 360ms ease !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #access-modal.emblem-building .access-panel > p,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #access-modal.emblem-building #access-form {
  display: none !important;
}


/* Access keypad: borderless frosted circles — approved 2026-09-19. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-keypad {
  width: min(78vw, 286px);
  gap: 12px 14px;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-key {
  aspect-ratio: 1 / 1 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at 34% 26%, rgba(255,255,255,.72), rgba(255,255,255,.18) 44%, transparent 68%),
    rgba(252,250,247,.48) !important;
  color: var(--ql-gold-deep) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.72),
    inset 0 -1px 0 rgba(149,104,36,.06),
    0 9px 22px rgba(149,104,36,.07) !important;
  -webkit-backdrop-filter: blur(14px) saturate(112%);
  backdrop-filter: blur(14px) saturate(112%);
  font-family: var(--ql-font-serif) !important;
  font-weight: 400 !important;
  transition: transform 90ms ease, background 140ms ease, box-shadow 140ms ease, opacity 140ms ease !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-key:active {
  transform: scale(.94);
  background:
    radial-gradient(circle at 34% 26%, rgba(255,255,255,.82), rgba(255,255,255,.24) 44%, transparent 68%),
    rgba(244,217,121,.16) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.78),
    0 4px 12px rgba(149,104,36,.08) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-key:focus-visible {
  outline: 1px solid rgba(217,173,63,.58) !important;
  outline-offset: 4px !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-key-peach,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-key-delete {
  border: 0 !important;
  background:
    radial-gradient(circle at 34% 26%, rgba(255,255,255,.72), rgba(255,255,255,.18) 44%, transparent 68%),
    rgba(252,250,247,.48) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-key-delete {
  color: rgba(149,104,36,.78) !important;
}

@media (max-height: 720px) {
  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .access-keypad {
    width: min(66vw, 228px);
    gap: 8px 10px;
  }
}


/* Continuous Book flow: location -> date -> time.
   Motion is restrained and shared-element driven; the business state machine remains in app.js. */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-location-context {
  margin: 0 0 12px !important;
  overflow: hidden;
  color: var(--ql-gold-deep) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: .08em !important;
  text-overflow: ellipsis;
  text-transform: lowercase;
  white-space: nowrap;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] body.book-motion-active .step.active {
  animation: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-source-hidden {
  opacity: 0 !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-ghost {
  box-sizing: border-box !important;
  overflow: hidden !important;
  contain: layout paint style !important;
  will-change: left, top, width, height, opacity, transform;
  -webkit-user-select: none;
  user-select: none;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-location-ghost {
  padding: 14px 16px !important;
  border: 1px solid var(--ql-border) !important;
  border-radius: 12px !important;
  background: rgba(252,250,247,.96) !important;
  box-shadow: 0 18px 42px rgba(27,24,22,.10) !important;
  color: var(--ql-ink) !important;
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-location-ghost #change-place,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-location-ghost button {
  display: none !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-location-ghost strong {
  display: block;
  overflow: hidden;
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif) !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-location-ghost p {
  margin: 4px 0 0 !important;
  overflow: hidden;
  color: var(--ql-ink-mid) !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-status {
  position: fixed;
  z-index: 2410;
  top: max(166px, calc(env(safe-area-inset-top) + 146px));
  left: 50%;
  width: min(calc(100vw - 48px), 520px);
  transform: translateX(-50%);
  pointer-events: none;
  color: var(--ql-ink-mid);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .02em;
  text-align: center;
  text-transform: lowercase;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-day-ghost {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  padding: 18px 18px !important;
  border: 1px solid rgba(217,173,63,.34) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 88% 15%, rgba(244,217,121,.18), transparent 30%),
    linear-gradient(145deg, rgba(255,253,249,.985) 0%, rgba(247,241,231,.985) 100%) !important;
  box-shadow: 0 22px 54px -26px rgba(27,24,22,.30) !important;
  color: var(--ql-ink) !important;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-day-ghost .day-featured-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-day-ghost .day-featured-kicker {
  color: var(--ql-gold-deep) !important;
  font-size: 9px !important;
  font-weight: 650 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-day-ghost strong {
  overflow: hidden;
  color: var(--ql-ink) !important;
  font-family: var(--ql-font-serif) !important;
  font-size: clamp(18px, 5.2vw, 25px) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: -.025em !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-day-ghost .day-featured-status {
  overflow: hidden;
  color: var(--ql-ink-mid) !important;
  font-size: 10px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-day-ghost > b {
  color: var(--ql-gold-deep) !important;
  opacity: .5;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-day.active .day-featured,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-day.active .day-mini,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-time.active #time-list {
  backface-visibility: hidden;
  will-change: transform, opacity;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-day .day-mini:active {
  transform: scale(.975);
  transition: transform 80ms ease;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-day .day-featured:active {
  transform: scale(.988);
  transition: transform 90ms ease;
}

html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-time.book-motion-time-arrival #time-range-label {
  margin-bottom: 7px !important;
}

@media (max-width: 420px) {
  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-status {
    width: calc(100vw - 36px);
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-ghost,
  html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-motion-status {
    display: none !important;
  }
}

/* 2026-09-19 approved BOOK(ED) day + time treatment */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured {
  min-height: 11.5rem !important;
  background: linear-gradient(145deg,#fffdf9 0%,#f8f3ea 100%) !important;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured strong {
  max-width: none !important;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-picker .picker-rollers {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-column {
  background: transparent !important;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-label,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-label small {
  background: transparent !important;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-divider {
  opacity: .55;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-value,
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-value.selected {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-value {
  color: var(--ql-ink) !important;
  opacity: .52;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-value.selected {
  color: var(--ql-ink) !important;
  opacity: 1;
  font-weight: 500 !important;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-band {
  z-index: 4 !important;
  top: calc(50% + 16px) !important;
  height: 64px !important;
  border: 0 !important;
  border-top: 1.5px solid var(--ql-gold) !important;
  border-bottom: 1.5px solid var(--ql-gold) !important;
  background: transparent !important;
  box-shadow: none !important;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-utilities:empty {
  display: none !important;
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-refresh {
  display: none !important;
}

/* Reference-match pass: BOOK(ED) 2026-09-19 */
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .app-shell{width:min(100%,650px)!important;max-width:650px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .app-header{height:96px!important;min-height:96px!important;padding:14px 28px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .app-wordmark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--ql-font-serif);font-size:clamp(30px,5vw,43px);font-weight:400;letter-spacing:-.04em;color:var(--ql-ink);white-space:nowrap;pointer-events:none}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .app-wordmark b{font-weight:1000;color:var(--ql-gold-deep);-webkit-text-stroke:.65px currentColor;paint-order:stroke fill}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .emblem-inside{
  width:46px!important;height:46px!important;
  border-radius:50%;
  box-shadow:0 0 0 2.5px var(--ql-gold-deep), 0 0 0 4px rgba(149,104,36,.18);
  filter:saturate(1.55) contrast(1.12);
}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-back{font-size:0!important;width:48px;height:48px}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-back::before{content:"←";font-size:38px;line-height:1;font-family:var(--ql-font-serif)}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .flow{min-height:calc(var(--book-vvh,100dvh) - 96px)!important;padding:0 42px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .step{min-height:calc(var(--book-vvh,100dvh) - 96px)!important;padding:34px 0 46px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-day{text-align:center}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-day .book-location-context{margin:0 auto 20px!important;text-align:center;text-transform:uppercase!important;letter-spacing:.19em!important;line-height:1.75!important;white-space:normal}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-day h1{font-size:clamp(44px,7vw,58px)!important;margin:0 0 14px!important;line-height:1!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #step-day #notice{margin:0 0 30px!important;color:var(--ql-ink-mid)!important;font-size:16px}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list{gap:18px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured{min-height:245px!important;padding:34px 38px!important;text-align:left;border-radius:30px!important;display:grid!important;align-items:end!important;background:linear-gradient(145deg,#fffdf9 0%,#f5efe4 100%)!important;box-shadow:0 20px 48px -30px rgba(27,24,22,.34)!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured-kicker{font-size:12px!important;letter-spacing:.2em!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured strong{font-size:clamp(42px,7vw,60px)!important;line-height:.98!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured-status{font-size:16px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini-grid{gap:10px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini{min-height:138px!important;padding:22px 10px!important;text-align:center!important;border-radius:18px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini strong{font-size:21px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini small{font-size:13px!important;margin-top:6px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini>b{display:none!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .book-picker{max-width:none!important;gap:22px!important;margin-top:0!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-copy{text-align:left}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-copy .eyebrow{margin:0 0 10px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-copy h2{font-size:clamp(48px,8vw,64px)!important;line-height:.98!important;margin:0 0 24px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-copy .picker-status{font-size:15px!important;margin:0!important;min-height:0!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-rollers{height:390px!important;grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr)!important;margin-top:4px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-column{grid-template-rows:56px 1fr!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-label{font-size:17px!important;letter-spacing:.22em!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-wheel{padding:112px 0!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-value{min-height:72px!important;font-family:var(--ql-font-serif)!important;font-size:30px!important;font-weight:400!important;opacity:.34!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-value.selected{font-size:39px!important;opacity:1!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-band{top:calc(50% + 20px)!important;height:72px!important;border-top:1.5px solid var(--ql-gold)!important;border-bottom:1.5px solid var(--ql-gold)!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-summary{margin-top:4px!important;padding:8px 0 8px 16px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-summary strong{font-size:clamp(38px,7vw,54px)!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .picker-limit{font-size:13px!important}
html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #picker-confirm{margin-top:6px!important;min-height:70px!important;border:0!important;border-radius:999px!important;background:linear-gradient(100deg,#b98930,#f1cf72,#b98930)!important;color:white!important;font-size:14px!important;letter-spacing:.18em!important;box-shadow:0 12px 30px rgba(149,104,36,.18)!important}
@media(max-width:560px){html[data-skin="quiet-luxury-gold"][data-skeleton="01"] .flow{padding:0 22px!important}html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured{padding:28px 24px!important;min-height:210px!important}html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-featured strong{font-size:38px!important}html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini{min-height:120px!important;padding:18px 7px!important}html[data-skin="quiet-luxury-gold"][data-skeleton="01"] #day-list .day-mini strong{font-size:17px!important}}