/* Pyramidiom monetize (branch monetize): the Join the Lodge screen, the rooms on the result, the Lodge letter, Restore purchase,
   the Archive list and the ad-slot placeholders. Same system as pyramidiom.css: ziggurat frames, Cinzel / Silkscreen / VT323,
   gold hairlines, square corners. No new colours. */

/* ---------- Join the Lodge: a full-screen sheet over the world ---------- */
.lodge { position: fixed; inset: 0; z-index: 35; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  background: var(--sky-top); padding: calc(var(--safe-t) + .6rem) .9rem calc(var(--safe-b) + 1.4rem); }
.lodge__inner { max-width: 30rem; margin: 0 auto; display: grid; gap: .8rem; position: relative; }
.lodge__close { justify-self: end; background: transparent; border: 0; cursor: pointer; color: var(--gold); padding: .4rem .2rem; }
.lodge__head { text-align: center; display: grid; justify-items: center; gap: .3rem; margin-top: -.4rem; }
.lodge__seal svg { display: block; }
.lodge__title { font-size: clamp(25px, 7.4vw, 40px); margin-top: .3rem; }
.lodge__sub { color: var(--gold); margin: 0; }
.lodge__lead { font-size: 19px; color: var(--sand); margin: .35rem 0 0; max-width: 24rem; text-wrap: pretty; }
.lodge__mock { color: var(--sienna-lt); border: 1px dashed var(--sienna-lt); padding: .25rem .6rem; margin: .3rem 0 0; }
.lodge__offers { display: grid; gap: .8rem; }
.lodge__foot { text-align: center; display: grid; justify-items: center; gap: .4rem; padding-top: .2rem; }
.lodge__rule { font-size: 18px; color: var(--sand); margin: 0; border-top: 1px solid var(--gold-dk); border-bottom: 1px solid var(--gold-dk); padding: .45rem .3rem; width: 100%; }
.lodge__rule b { font-weight: 400; color: var(--gold-lt); }
.lodge__fine { font-size: 8px; letter-spacing: .12em; text-transform: none; max-width: 22rem; }

.offer { padding: 1rem 1rem .95rem; }
.offer--lodge::before { opacity: 1; background: var(--gold-lt); }
.offer--lodge::after { background: linear-gradient(170deg, rgba(59,47,34,.97), rgba(26,20,16,.97)); }
.offer__title { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; margin: 0 0 .5rem;
  font-family: var(--title); font-weight: 700; font-size: 16px; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-lt); }
.offer--lodge .offer__title { font-size: 19px; }
.offer__price { font-family: var(--mono); font-weight: 400; font-size: 28px; letter-spacing: 0; color: var(--bone); white-space: nowrap; text-transform: none; }
.offer__price small { font-family: var(--lab); font-size: 8px; letter-spacing: .14em; color: var(--sand-dim); margin-left: .35em; text-transform: uppercase; }
.offer__text { font-size: 18px; line-height: 1.3; color: var(--sand); margin: 0 0 .75rem; text-wrap: pretty; }
.offer__text b, .perks b { font-weight: 400; color: var(--bone); }
.offer__owned { color: var(--jade-lt); text-align: center; margin: .2rem 0 0; }
.perks { list-style: none; margin: 0 0 .85rem; padding: 0; display: grid; gap: .42rem; }
.perks li { position: relative; padding-left: 1.05rem; font-size: 18px; line-height: 1.28; color: var(--sand); }
.perks li::before { content: ""; position: absolute; left: 2px; top: .52em; width: 5px; height: 5px; background: var(--gold); transform: rotate(45deg); }
.perks__secret { border-top: 1px dashed var(--gold-dk); padding-top: .5rem !important; margin-top: .15rem; color: var(--gold-lt) !important; }
.perks__secret::before { top: 1.05em !important; background: var(--gold-lt) !important; box-shadow: 0 0 6px rgba(246,226,160,.7); }
.perks__secret b { color: var(--gold-lt) !important; }
.offer__rows { list-style: none; margin: 0; padding: 0; }
.offer__row { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .38rem 0; border-top: 1px solid rgba(212,167,58,.22); }
.offer__name { font-size: 19px; color: var(--bone); line-height: 1.2; }
.offer__row.is-owned .offer__name { color: var(--sand-dim); }
.offer__buy { min-height: 2.25rem; padding: .35rem .75rem; font-size: 10px; flex: none; }
.offer__own { color: var(--jade-lt); flex: none; }

/* ---------- the rooms on the result ---------- */
.rooms__grid { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; margin-bottom: .75rem; }
.room { position: relative; isolation: isolate; display: grid; justify-items: center; gap: .15rem; padding: .7rem .4rem .6rem; border: 0; background: transparent; cursor: pointer; color: var(--sand); }
.room::before, .room::after { content: ""; position: absolute; z-index: -1; clip-path: var(--zig); pointer-events: none; }
.room::before { inset: 0; background: var(--sand-dim); opacity: .45; }
.room::after { inset: 1px; background: rgba(14,11,8,.9); }
.room__glyph { font-size: 22px; line-height: 1; color: var(--sand-dim); }
.room__name { font-family: var(--lab); font-weight: 700; font-size: 10px; letter-spacing: .16em; text-transform: uppercase; }
.room__sub { font-family: var(--lab); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; color: var(--sienna-lt); }
.room[data-owned="1"]::before { background: var(--gold); opacity: .9; }
.room[data-owned="1"] .room__glyph { color: var(--gold-lt); }
.room[data-owned="1"] .room__sub { color: var(--jade-lt); }
.room[data-owned="0"] .room__name { color: var(--sand-dim); }
/* locked = the dim frame and the price line; no padlock emoji */
.rooms__join { margin-bottom: .2rem; }
.rooms__restore { display: block; margin: .35rem auto 0; background: transparent; border: 0; cursor: pointer; color: var(--gold); padding: .35rem .5rem; }
.door__lodge { display: flex; justify-content: center; align-items: baseline; gap: .4rem 1rem; flex-wrap: wrap; margin: .1rem 0 .2rem; }
.door__restore { background: transparent; border: 0; cursor: pointer; padding: .3rem .5rem; color: var(--sand-dim); text-shadow: 0 1px 0 var(--ink); }

/* ---------- the Lodge letter ---------- */
.letter { text-align: center; padding: 1rem 1.1rem 1rem; }
.letter::before { background: var(--gold-lt); opacity: .95; }
.letter__cap { display: block; color: var(--gold); margin-bottom: .55rem; }
.letter__seal { display: grid; place-items: center; margin: .1rem 0 .55rem; }
.letter__seal--ready svg { filter: drop-shadow(0 0 10px rgba(246,226,160,.45)); }
.letter__lead { font-family: var(--title); font-weight: 700; font-size: clamp(18px, 5vw, 23px); letter-spacing: .05em; color: var(--gold-lt); margin: 0 0 .35rem; }
.letter__small { font-size: 18px; color: var(--sand-dim); margin: 0; }
.letter__paper { text-align: left; border-top: 1px solid var(--gold-dk); border-bottom: 1px solid var(--gold-dk); padding: .8rem .2rem .7rem; }
.letter__body { font-family: Baskerville, "Libre Baskerville", Georgia, "Times New Roman", serif; font-size: 18px; line-height: 1.5; color: var(--bone); margin: 0 0 .7em; text-wrap: pretty; }
.letter__sign { font-family: Baskerville, Georgia, serif; font-style: italic; font-size: 18px; color: var(--gold-lt); text-align: right; margin: .2rem 0 0; }

/* ---------- Restore purchase + the Archive (in the how-to sheet) ---------- */
.restore__text { font-size: 18px; line-height: 1.3; margin: 0 0 .7rem; }
.restore__field { width: 100%; background: var(--ink-2); border: 0; border-bottom: 1px solid var(--gold); padding: .55rem .5rem; margin: 0 0 .8rem; font-family: var(--mono); font-size: 22px; color: var(--bone); border-radius: 0; }
.restore__field--code { text-align: center; letter-spacing: .5em; font-size: 30px; padding-left: 1em; }
.restore__mock { color: var(--sienna-lt); text-align: center; margin: -.3rem 0 .7rem; }
.restore__msg { min-height: 1.2em; text-align: center; }
.restore form + .restore__msg + .btn, #restore-close { width: 100%; margin-top: .3rem; }
.archive__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem; margin: 0 0 .9rem; max-height: 50vh; overflow-y: auto; }
.archive__list .empty { grid-column: 1 / -1; }
.archive__day { min-height: 2.5rem; font-size: 10px; }

/* ---------- ad units (placeholders; real units arrive in phase 4, never during play, never for "noads") ---------- */
.ad-slot { display: grid; place-items: center; width: 300px; height: 250px; margin: 0 auto; border: 1px dashed rgba(160,143,108,.55); background: #0e0b08; }
.ad-slot .lab { font-size: 8px; color: var(--sand-dim); }
.ad-slot--adhesion { position: fixed; left: 50%; transform: translateX(-50%); bottom: var(--safe-b); width: 320px; height: 50px; z-index: 20; margin: 0; }
html[data-ads] body:not([data-state="play"]) > #app { padding-bottom: calc(var(--safe-b) + 1rem + 50px); }
body[data-state="play"] .ad-slot, body[data-cine] .ad-slot { display: none !important; }
