/* Build 3: room signs, amenities, next-step card, UPI pay, wallet visitor pass, meters, services, admin tools.
   Uses the tokens in app.css; dark mode follows them. */
:root { --sign-no: #C8102E; --sign-do: #1F5FB0; --pass-bg: #17130F; --pass-ink: #F6EBD3; --pass-gold: #D4A537; --pass-line: rgba(212, 165, 55, 0.35); }

/* ---------- rule signs (ISO style) ---------- */
.b3-sign { position: relative; display: inline-grid; place-items: center; flex: none; border-radius: 50%; }
.b3-sign .icon { width: 50%; height: 50%; }
.b3-sign--do { background: var(--sign-do); color: #fff; }
.b3-sign--no { background: #fff; color: var(--ink); }
.b3-sign__ring { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: var(--sign-no); stroke-width: 5; }
.b3-signs { display: grid; gap: var(--s4); }
.b3-signs__label { text-transform: uppercase; letter-spacing: .06em; margin: 0 0 var(--s2); }
.b3-signs__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--s3); }
.b3-signs__item { display: flex; align-items: center; gap: var(--s3); padding: var(--s2) var(--s3); border-radius: var(--r-sm); background: var(--surface); box-shadow: 0 0 0 1px var(--line); min-width: 0; }
.b3-signs__text { display: grid; min-width: 0; font-size: var(--fs-13); line-height: 1.25; }
.b3-signs__text b { font-weight: 600; }
.b3-signs--compact .b3-signs__list { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); }
.b3-ack { display: grid; gap: var(--s3); }

/* ---------- amenities ---------- */
.b3-amen__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--s2) var(--s3); }
.b3-amen__item { display: flex; align-items: center; gap: var(--s2); font-size: var(--fs-15); min-width: 0; }
.b3-amen__icon { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: var(--accent-tint); color: var(--accent-text); flex: none; }
.b3-amen__facts { margin-top: var(--s3); display: grid; gap: var(--s1); }
.b3-badges { display: inline-flex; flex-wrap: wrap; gap: var(--s1); margin-top: var(--s2); }
.b3-policy { margin: 0; padding-left: 1.1em; display: grid; gap: var(--s1); }
.b3-por .pub-quote__big { font-size: var(--fs-24); }
.b3-por-line { font-weight: 600; color: var(--accent-text); }

/* ---------- next step ---------- */
.b3-next { display: grid; grid-template-columns: auto 1fr; gap: var(--s3); align-items: start; padding: var(--s4); border-radius: var(--r-card);
  background: linear-gradient(135deg, var(--accent-tint), var(--surface)); box-shadow: 0 0 0 1px var(--accent-tint-2); }
.b3-next--danger { background: linear-gradient(135deg, var(--danger-tint), var(--surface)); box-shadow: 0 0 0 1px var(--danger-tint); }
.b3-next--info { background: linear-gradient(135deg, var(--info-tint), var(--surface)); box-shadow: 0 0 0 1px var(--info-tint); }
.b3-next__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--surface); color: var(--accent-text); box-shadow: var(--sh-1); }
.b3-next__k { font-size: var(--fs-12); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); }
.b3-next__actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: var(--s2); }

/* ---------- UPI ---------- */
.b3-upi { display: grid; gap: var(--s4); justify-items: center; text-align: center; }
.b3-upi__qr { width: min(240px, 70vw); aspect-ratio: 1; object-fit: contain; border-radius: var(--r-sm); background: #fff; padding: var(--s2); box-shadow: 0 0 0 1px var(--line); }
.b3-upi__amt { font-family: var(--font-num); font-size: var(--fs-28); font-weight: 700; }
.b3-upi__ref { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--fs-15); padding: 2px 8px; border-radius: 8px; background: var(--bg-sunken); }
.b3-upi form, .b3-upi .stack { width: 100%; text-align: left; }
.b3-was { text-decoration: line-through; color: var(--text-3); margin-left: 4px; font-size: .9em; }

/* ---------- wallet-style visitor pass ---------- */
.b3-pass { perspective: 1200px; width: 100%; max-width: 360px; margin: 0 auto; }
.b3-pass__inner { position: relative; display: grid; transition: transform .6s cubic-bezier(.2, .7, .2, 1); transform-style: preserve-3d; min-height: 520px; }
.b3-pass.is-flipped .b3-pass__inner { transform: rotateY(180deg); }
.b3-pass__face { grid-area: 1 / 1; position: relative; backface-visibility: hidden; -webkit-backface-visibility: hidden; border-radius: 24px; padding: 20px; color: var(--pass-ink);
  background: radial-gradient(120% 80% at 100% 0%, rgba(212, 165, 55, .18), transparent 60%), var(--pass-bg); box-shadow: 0 20px 40px -18px rgba(0, 0, 0, .55), inset 0 0 0 1px var(--pass-line);
  display: grid; gap: 14px; align-content: start; overflow: hidden; }
.b3-pass__face--back { transform: rotateY(180deg); }
.b3-pass__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.b3-pass__brand { display: flex; align-items: center; gap: 8px; font-weight: 700; letter-spacing: .02em; }
.b3-pass__brand img { width: 28px; height: 28px; }
.b3-pass__k { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: var(--pass-gold); }
.b3-pass__who { display: grid; grid-template-columns: 76px 1fr; gap: 14px; align-items: center; }
.b3-pass__photo { width: 76px; height: 92px; border-radius: 14px; object-fit: cover; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px var(--pass-line); display: grid; place-items: center; }
.b3-pass__name { font-size: 20px; font-weight: 700; line-height: 1.2; }
.b3-pass__row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.b3-pass__v { font-weight: 600; font-family: var(--font-num); }
.b3-pass__qr { background: #fff; border-radius: 14px; padding: 8px; width: 156px; justify-self: center; color: #000; }
.b3-pass__qr svg { width: 100%; height: auto; display: block; }
.b3-pass__code { text-align: center; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .08em; color: var(--pass-gold); }
.b3-stamp { justify-self: start; transform: rotate(-6deg); border: 2px solid var(--pass-gold); color: var(--pass-gold); border-radius: 10px; padding: 4px 10px; display: grid; line-height: 1.15; }
.b3-stamp b { font-size: 15px; letter-spacing: .14em; text-transform: uppercase; }
.b3-stamp span { font-size: 11px; opacity: .9; }
.b3-pass__face ul { margin: 0; padding-left: 1.1em; display: grid; gap: 6px; font-size: 14px; }
.b3-pass__offer { border-top: 1px solid var(--pass-line); padding-top: 10px; display: grid; gap: 6px; font-size: 14px; }
.b3-pass .btn { justify-self: stretch; }
.b3-pass__flip { color: var(--pass-gold) !important; }

/* ---------- guest page ---------- */
.b3-guest { max-width: 520px; margin: 0 auto; display: grid; gap: var(--s5, 20px); }
.b3-selfie { display: grid; gap: var(--s3); justify-items: center; }
.b3-selfie video, .b3-selfie img { width: min(260px, 80vw); aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-card); background: var(--bg-sunken); transform: scaleX(-1); }
.b3-selfie img { transform: none; }

/* ---------- meters / services / misc ---------- */
.b3-meter { display: grid; gap: var(--s3); }
.b3-meter__head { display: flex; justify-content: space-between; gap: var(--s2); align-items: center; flex-wrap: wrap; }
.b3-meter__shot { width: 100%; max-height: 220px; object-fit: cover; border-radius: var(--r-sm); }
.b3-svc { display: grid; gap: var(--s3); }
.b3-svc__card { display: grid; gap: var(--s2); }
.b3-svc__offer { color: var(--accent-text); font-size: var(--fs-13); font-weight: 600; }
.b3-slots { display: flex; flex-wrap: wrap; gap: var(--s2); }
.b3-row { display: flex; gap: var(--s2); align-items: center; flex-wrap: wrap; }
.b3-row > * { min-width: 0; }
.b3-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--fs-13); padding: 1px 6px; border-radius: 6px; background: var(--bg-sunken); white-space: nowrap; }
.b3-otp { font-family: var(--font-num); font-size: var(--fs-24); font-weight: 700; letter-spacing: .14em; }
.b3-tiers { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: var(--fs-12); color: var(--text-2); }
.b3-bedrow { display: grid; gap: var(--s2); padding: var(--s3) 0; border-top: 1px solid var(--line); }
.b3-bedrow:first-child { border-top: 0; }
.b3-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s2); }
.b3-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: var(--s2); }
.b3-photos img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-xs); }
.b3-decl { max-width: 720px; margin: 0 auto; background: #fff; color: #111; padding: 24px; border-radius: 12px; box-shadow: 0 0 0 1px var(--line); }
.b3-decl h1 { font-size: 20px; margin: 0 0 4px; }
.b3-decl table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 12px 0; }
.b3-decl td { padding: 6px 4px; border-bottom: 1px solid #ddd; vertical-align: top; overflow-wrap: anywhere; }
.b3-decl td:first-child { width: 38%; color: #555; }
.b3-decl__photo { float: right; width: 90px; height: 110px; object-fit: cover; border: 1px solid #ccc; margin-left: 12px; }
.b3-decl__sig { margin-top: 24px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 14px; }
.b3-decl__sig img { max-height: 48px; display: block; }
@media print {
  .r-printing body * { visibility: hidden; }
  .r-printing .b3-decl, .r-printing .b3-decl * { visibility: visible; }
  .r-printing .b3-decl { position: absolute; inset: 0; box-shadow: none; }
}
@media (max-width: 420px) { .b3-grid2 { grid-template-columns: 1fr; } .b3-signs__list { grid-template-columns: 1fr 1fr; } }
@media (prefers-reduced-motion: reduce) { .b3-pass__inner { transition: none; } }

/* Bed board (#/admin/beds) */
.bb-room { padding: var(--s3); }
.bb-beds { list-style: none; margin: var(--s2) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: var(--s2); }
.bb-bed { border: 1px solid var(--line); border-radius: 12px; padding: var(--s2) var(--s3); min-width: 0; overflow-wrap: anywhere; background: var(--surface); }
.bb-bed--vacant { border-style: dashed; }
.bb-bed__head { display: flex; justify-content: space-between; align-items: center; gap: var(--s2); }
.bb-bed__who { font-weight: 600; margin-top: 2px; }
/* Occupancy import preview */
.occ-errors { margin: 0; padding-left: 1.1em; color: var(--danger-ink); }
/* Overnight guest stay card (same wallet style as the visit pass) */
.b3-pass__chip { display: inline-block; margin-top: 4px; padding: 2px 10px; border-radius: 999px; border: 1px solid currentColor; font-size: 12px; font-weight: 700; letter-spacing: .02em; }
.b3-pass--stay .b3-pass__row { flex-wrap: wrap; row-gap: var(--s2); }
.gs-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s2); }
.gs-option { text-align: left; border: 1px solid var(--line-strong); border-radius: 12px; padding: var(--s3); background: var(--surface); color: inherit; font: inherit; min-width: 0; }
.gs-option[aria-checked="true"] { border-color: var(--accent, currentColor); box-shadow: 0 0 0 2px var(--accent, currentColor) inset; }
.gs-option[disabled] { opacity: .55; }
@media (max-width: 380px) { .gs-options { grid-template-columns: 1fr; } }

/* ---------- Resident i-card: light cream/gold card with a dark top band, distinct from the dark guest passes.
   The card itself stays light in dark mode (it is a physical-looking card). ---------- */
.icard { --ic-bg1: #FFFBF0; --ic-bg2: #F3E3BC; --ic-ink: #2A2116; --ic-soft: #5E4E33; --ic-gold: #8A5F0E; --ic-rim: #C9A04A; --ic-line: rgba(154, 107, 18, .45); --ic-band: #17130F; --ic-band-ink: #F6EBD3;
  perspective: 1200px; width: 100%; max-width: 360px; margin: 0 auto; }
.icard__inner { position: relative; display: grid; transition: transform .6s cubic-bezier(.2, .7, .2, 1); transform-style: preserve-3d; cursor: pointer; }
.icard.is-flipped .icard__inner { transform: rotateY(180deg); }
.icard__face { grid-area: 1 / 1; backface-visibility: hidden; -webkit-backface-visibility: hidden; border-radius: 22px; color: var(--ic-ink);
  background: radial-gradient(120% 70% at 0% 30%, rgba(255, 255, 255, .9), transparent 60%), linear-gradient(155deg, var(--ic-bg1), var(--ic-bg2));
  box-shadow: 0 18px 36px -20px rgba(60, 40, 0, .55), inset 0 0 0 1.5px var(--ic-rim); display: grid; align-content: start; overflow: hidden; }
.icard__face--back { transform: rotateY(180deg); }
.icard__band { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 12px 16px; background: var(--ic-band); color: var(--ic-band-ink); }
.icard__brand { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.icard__brand img { width: 26px; height: 26px; }
.icard__chip { font-size: 11px; font-weight: 800; letter-spacing: .1em; padding: 4px 10px; border-radius: 999px; color: #fff; }
.icard__chip--valid { background: #1E7B45; }
.icard__chip--notice { background: #B86E00; }
.icard__chip--expired { background: #6E6E6E; }
.icard__body { display: grid; gap: 12px; padding: 16px 16px 4px; }
.icard__k { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: var(--ic-gold); font-weight: 600; }
.icard__who { display: grid; grid-template-columns: 88px 1fr; gap: 14px; align-items: center; }
.icard__photo { width: 88px; height: 108px; border-radius: 12px; object-fit: cover; background: #E8DBBE; border: 3px solid var(--ic-rim); box-sizing: border-box; display: grid; place-items: center; color: var(--ic-soft); }
.icard__name { font-size: 20px; font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.icard__mascot { font-size: 12px; color: var(--ic-soft); }
.icard__gid { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; color: var(--ic-gold); letter-spacing: .02em; margin-top: 4px; overflow-wrap: anywhere; }
.icard__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-top: 10px; border-top: 1px solid var(--ic-line); }
.icard__v { font-weight: 600; margin: 0; overflow-wrap: anywhere; }
.icard__foot { display: grid; gap: 8px; padding-top: 10px; border-top: 1px solid var(--ic-line); }
.icard__valid { font-weight: 700; }
.icard--notice .icard__valid { color: #8A4F00; }
/* Live check line: ticking time with a moving sheen, so a screenshot is easy to tell apart. */
.icard__live { position: relative; overflow: hidden; display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; color: var(--ic-soft); padding: 6px 10px; border-radius: 8px;
  background: linear-gradient(100deg, rgba(201, 160, 74, .14) 0%, rgba(201, 160, 74, .14) 40%, rgba(255, 255, 255, .85) 50%, rgba(201, 160, 74, .14) 60%, rgba(201, 160, 74, .14) 100%);
  background-size: 300% 100%; animation: icard-shimmer 3.2s linear infinite; font-variant-numeric: tabular-nums; }
.icard__live.is-offline { animation: none; background: rgba(110, 110, 110, .12); }
.icard__pulse { width: 8px; height: 8px; border-radius: 50%; background: #1E7B45; flex: none; animation: icard-pulse 1.6s ease-in-out infinite; }
.icard__live.is-offline .icard__pulse { background: #6E6E6E; animation: none; }
@keyframes icard-shimmer { from { background-position: 100% 0; } to { background-position: 0 0; } }
@keyframes icard-pulse { 50% { opacity: .3; } }
.icard__qr { background: #fff; border-radius: 14px; padding: 8px; width: 150px; justify-self: center; color: #000; box-shadow: inset 0 0 0 1px var(--ic-line); }
.icard__qr svg { width: 100%; height: auto; display: block; }
.icard__qr.is-stale { opacity: .45; }
/* Bright mode for the gate scanner: maximum contrast, bigger code. */
.icard.is-bright .icard__qr { width: 236px; padding: 12px; box-shadow: 0 0 0 4px #000; }
.icard.is-bright .icard__qr svg * { fill: #000; }
.icard.is-bright .icard__face:not(.icard__face--back) { background: #fff; }
.icard__expired { justify-self: center; transform: rotate(-7deg); border: 4px solid #6E6E6E; color: #6E6E6E; border-radius: 12px; padding: 6px 18px; font-size: 34px; font-weight: 800; letter-spacing: .12em; margin: 12px 0; }
.icard--expired .icard__body { filter: grayscale(1); }
.icard__actions { display: flex; justify-content: center; }
.icard__note { font-size: 13px; color: var(--ic-soft); margin: 0; text-align: center; }
.icard__found { font-weight: 700; font-size: 17px; margin: 0; }
.icard__found a { color: inherit; }
.icard__issued { font-size: 12px; color: var(--ic-soft); margin: 8px 0 0; border-top: 1px solid var(--ic-line); padding-top: 10px; }
.icard__btn { color: var(--ic-gold) !important; }
.icard__flip { justify-self: stretch; margin: 0 8px 8px; }
.icard-actions { justify-content: center; }
.icard-blood { align-items: flex-end; }
.icard-blood > :first-child { flex: 1; }
.icard-queue { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.icard-queue li { display: grid; grid-template-columns: 72px 1fr; gap: 12px; align-items: center; }
.icard-queue img { width: 72px; height: 90px; object-fit: cover; border-radius: 10px; background: var(--surface-2, #eee); }
.g-icard { display: grid; grid-template-columns: 64px 1fr; gap: 12px; align-items: center; margin-top: 10px; }
.g-icard img, .g-icard .g-icard__ph { width: 64px; height: 80px; object-fit: cover; border-radius: 10px; background: var(--surface-2, #eee); display: grid; place-items: center; }
@media (prefers-reduced-motion: reduce) { .icard__inner { transition: none; } .icard__live { animation-duration: 12s; } .icard__pulse { animation: none; } }

/* Hotfix v1.0.2: manual bed availability (Beds board, Rooms & pricing) */
.bb-bed--filled { border-style: solid; background: var(--bg-sunken); }
.bb-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s2); }
.bb-toolbar .t-foot { margin: 0; flex: 1 1 220px; min-width: 0; }
.bb-sheet-foot { justify-content: flex-end; gap: var(--s2); width: 100%; }
.bav { display: grid; gap: var(--s1); margin-top: var(--s2); min-width: 0; }
.bav__row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2); min-width: 0; }
.bav__from { display: inline-flex; align-items: center; gap: var(--s2); min-width: 0; }
.bav .input--sm { min-height: 36px; height: 36px; padding: 4px 8px; width: auto; max-width: 100%; font-size: var(--fs-14, 14px); }
.bav .check { min-height: 36px; padding: 6px 0; }
.pub-card__avail { display: block; margin-top: 2px; }
.pub-bed-daily { color: var(--accent-ink, var(--accent)); }
.bav .segmented { flex: 0 0 auto; }
.bav .segmented__opt { flex: 1 0 auto; min-width: max-content; padding: 0 var(--s3); }

/* Scan a form (#/admin/forms) */
.fs-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s2); margin-bottom: var(--s4); }
.fs-pages { list-style: none; margin: 0 0 var(--s3); padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 140px), 1fr)); gap: var(--s2); }
.fs-pages li { display: grid; gap: var(--s1); justify-items: start; min-width: 0; }
.fs-pages img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 12px; border: 1px solid var(--line); background: var(--bg-sunken); }
.fs-actions { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; }
.fs-top .segmented { flex: 0 0 auto; }
.fs-top .segmented__opt { flex: 1 0 auto; min-width: max-content; }
.fs-field { min-width: 0; border-radius: 12px; }
.fs-field--check { background: var(--fs-check-bg); box-shadow: 0 0 0 6px var(--fs-check-bg); }
.fs-field--check .input, .fs-field--check .select, .fs-field--check .textarea { border-color: var(--fs-check-line); }
.fs-hint { display: block; margin-top: 2px; color: var(--fs-check-ink); font-weight: 600; }
.fs-field--check .field__hint { color: var(--fs-check-ink); font-weight: 600; }
:root { --fs-check-bg: #FFF3C4; --fs-check-line: #D9A400; --fs-check-ink: #7A5A00; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --fs-check-bg: #3A3010; --fs-check-line: #C99A1A; --fs-check-ink: #F2D27A; } }
:root[data-theme="dark"] { --fs-check-bg: #3A3010; --fs-check-line: #C99A1A; --fs-check-ink: #F2D27A; }

/* Request access (#/request-access) and the staff list (Accounts & IDs > Access requests) */
.ra-hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.ra-form .segmented { width: 100%; }
.ra-form .segmented__opt { flex: 1 1 0; min-width: 0; white-space: normal; line-height: 1.2; }
.ar-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s3); }
.ar-item { display: grid; gap: var(--s2); padding: var(--s3); border: 1px solid var(--line); border-radius: 14px; background: var(--bg-raised, var(--bg)); min-width: 0; }
.ar-item__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2); align-items: flex-start; }
.ar-item__note { margin: 0; padding: var(--s2) var(--s3); border-radius: 10px; background: var(--bg-sunken); overflow-wrap: anywhere; }
.ar-tab-count { margin-left: 6px; }
.ar-done { display: grid; gap: var(--s3); }
.ar-done__msg { margin: 0; padding: var(--s3); border-radius: 12px; background: var(--bg-sunken); overflow-wrap: anywhere; white-space: pre-wrap; }
.ar-seg .segmented { flex: 0 0 auto; }
.ar-seg .segmented__opt { flex: 1 0 auto; min-width: max-content; padding: 0 var(--s3); }

/* Public availability wording (no capacity): room page */
.pub-avail { font-weight: 600; }
.pub-avail--ok { color: var(--success-ink, var(--sage-ink, inherit)); }
.pub-avail--info { color: var(--accent-ink, var(--accent)); }
.pub-avail--full { color: var(--ink-3, inherit); }

/* Google review prompt (resident Me > Your review) */
.gr-card { display: grid; gap: var(--s2); padding: var(--s4); border-radius: 16px; border: 1px solid var(--line); background: var(--bg-sunken); }
.gr-card p { margin: 0; }
.gr-card--prominent { background: var(--success-tint); border-color: transparent; }

/* Staff games: Team Goldy badge on leaderboards; #/admin/games */
.leader__badge { margin-left: 6px; vertical-align: middle; font-size: var(--fs-12, 12px); }
.sg-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: var(--s3); }
.sg-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); gap: var(--s3); }
.sg-stat { padding: var(--s3); border-radius: 14px; border: 1px solid var(--line); display: grid; gap: 2px; }
.sg-stat b { font-size: var(--fs-24, 24px); }
.sg-q { display: grid; gap: var(--s2); padding: var(--s3); border: 1px solid var(--line); border-radius: 12px; }

/* Scan a form: ID card photos on review */
.fs-tip { display: flex; gap: 6px; align-items: center; margin: 0 0 var(--s3); }
.fs-ids { list-style: none; margin: 0 0 var(--s3); padding: 0; display: grid; gap: var(--s3); }
.fs-id { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: var(--s3); align-items: start; padding: var(--s2); }
.fs-id img, .fs-id__ph { width: 96px; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); background: var(--bg-sunken); display: grid; place-items: center; }
.fs-id.is-removed img { opacity: .35; }
/* Overnight guest form: Aadhaar photo preview */
.sg-aadhaar__img { width: min(320px, 100%); max-height: 220px; object-fit: contain; border-radius: var(--r-input); background: var(--bg-sunken); }
.gs-id { display: flex; flex-wrap: wrap; gap: var(--s3); align-items: flex-start; }
.gs-id figure { margin: 0; display: grid; gap: var(--s1); min-width: 0; }
.gs-id__aadhaar { width: min(260px, 70vw); max-height: 180px; object-fit: contain; border-radius: var(--r-input); background: var(--bg-sunken); border: 1px solid var(--line); }

/* Get the app: phone banner, iPhone steps, home page section, store badges, public footer */
.ga-banner { position: fixed; z-index: 30; left: var(--s3); right: var(--s3); bottom: calc(var(--tabbar-h) + var(--safe-b) + var(--s2));
  display: flex; align-items: center; gap: var(--s3); padding: var(--s2) var(--s2) var(--s2) var(--s3); border-radius: 16px;
  background: var(--surface, var(--bg)); border: 1px solid var(--line); box-shadow: var(--sh-2); min-width: 0; max-width: 560px; margin: 0 auto; }
@media (min-width: 900px) { .ga-banner { bottom: var(--s4); left: calc(var(--sidebar-w) + var(--s4)); } }
.ga-banner__icon { width: 40px; height: 40px; border-radius: 10px; flex: 0 0 auto; }
.ga-banner__text { display: grid; gap: 1px; min-width: 0; flex: 1 1 auto; line-height: 1.25; }
.ga-banner__text b { font-size: var(--fs-14, 14px); overflow-wrap: anywhere; }
.ga-banner .btn { flex: 0 0 auto; }
.ga-banner__x { flex: 0 0 auto; }
.ga-steps { list-style: none; margin: var(--s3) 0 0; padding: 0; display: grid; gap: var(--s4); }
.ga-step { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: var(--s3); align-items: center; }
.ga-step__hint { display: block; margin-top: 2px; }
.ga-step__art { display: grid; place-items: center; height: 72px; border-radius: 14px; background: var(--bg-sunken); border: 1px solid var(--line); overflow: hidden; padding: 0 6px; }
.ga-step__bar { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--surface, var(--bg)); color: var(--accent-ink, var(--accent)); box-shadow: var(--sh-1, none); }
.ga-step__menu { display: flex; align-items: center; gap: 4px; padding: 7px 8px; border-radius: 10px; background: var(--surface, var(--bg)); font-size: 11px; max-width: 100%; min-width: 0; line-height: 1.2; font-weight: 600; box-shadow: var(--sh-1, none); }
.ga-sec__card { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s4); }
.ga-sec__text { display: grid; gap: var(--s2); flex: 1 1 280px; min-width: 0; }
.ga-sec__text p { margin: 0; }
.ga-badges { display: flex; flex-wrap: wrap; gap: var(--s2); }
.ga-badges:empty { display: none; }
.ga-badge { display: inline-grid; padding: 6px 16px 7px; border-radius: 10px; background: var(--ga-badge-bg); color: var(--ga-badge-ink); border: 1px solid var(--ga-badge-line); text-decoration: none; line-height: 1.1; min-height: 44px; align-content: center; }
.ga-badge:hover { text-decoration: none; filter: brightness(1.1); }
.ga-badge__small { font-size: 11px; letter-spacing: .02em; }
.ga-badge__big { font-size: 18px; font-weight: 700; }
.ga-qr { flex: 0 0 auto; border-radius: 12px; border: 1px solid var(--line); background: #fff; padding: 6px; }
.pub-foot { margin: var(--s6) 0 var(--s2); }
:root { --ga-badge-bg: #1F1A14; --ga-badge-ink: #FFFFFF; --ga-badge-line: #1F1A14; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --ga-badge-bg: #000000; --ga-badge-ink: #FFFFFF; --ga-badge-line: #6B635A; } }
:root[data-theme="dark"] { --ga-badge-bg: #000000; --ga-badge-ink: #FFFFFF; --ga-badge-line: #6B635A; }