/* Leon's conversation (6 Sep 2026). One body: the full page on /start (thread
   beside the canvas) and the rail on every cockpit page (thread alone). Every
   colour is a token of the product's own register; the studio's brand appears
   only inside the cards that show the studio's things. */

/* One column, one flow (6 Sep 2026): the cards live in the conversation, like a modern creative tool; the column
   is fluid up to 940 px and centred, so a wide screen frames it instead of losing it, and a phone gets the same flow. */
.leon { display: flex; flex-direction: column; width: min(100%, 940px); margin: 0 auto; border: 1px solid var(--lv-line); border-radius: 18px; overflow: hidden; background: var(--lv-panel); height: calc(100vh - 150px); min-height: 560px; }
.leon--rail { display: flex; flex-direction: column; border: 0; border-radius: 0; background: transparent; height: auto; min-height: 0; flex: 1 1 auto; }

.leon__thread { display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto; }
.leon--rail .leon__thread { border-right: 0; flex: 1 1 auto; min-height: 0; }
.leon__id { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--lv-line); }
.leon--rail .leon__id { display: none; }
.leon__id b { display: block; font-size: 13.5px; color: var(--lv-ink); font-weight: 700; }
.leon__id span { display: block; font-family: var(--lv-font-data); font-size: 10.5px; color: var(--lv-faint); margin-top: 2px; }
.leon__dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--lv-success); margin-right: 6px; vertical-align: middle; }
.lface { width: 34px; height: 34px; border-radius: 50%; background: var(--lv-action); color: var(--lv-action-ink); display: grid; place-items: center; font-weight: 800; font-size: 15px; flex: none; }
.lface--sm { width: 24px; height: 24px; font-size: 11px; }
.lface--pulse { animation: lpulse 1.4s ease-in-out infinite; }
@keyframes lpulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(228, 85, 47, .5); } 50% { box-shadow: 0 0 0 7px rgba(228, 85, 47, 0); } }

.leon__convo { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px 18px 8px; display: flex; flex-direction: column; gap: 14px; }
.lm { display: flex; flex-direction: column; gap: 8px; animation: lin .35s ease-out; }
@keyframes lin { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.lm__h { display: flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 600; color: var(--lv-mute); }
.lm__p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--lv-ink); text-wrap: pretty; max-width: 54ch; white-space: pre-wrap; }
.lm__p--work { color: var(--lv-mute); }
.lm-caret { display: inline-block; width: 7px; height: 15px; background: var(--lv-signal); margin-left: 3px; vertical-align: -2px; animation: lblink .9s steps(2) infinite; }
@keyframes lblink { to { visibility: hidden; } }
.lm-typing { display: inline-flex; gap: 5px; padding: 6px 2px; }
.lm-typing i { width: 6px; height: 6px; border-radius: 50%; background: var(--lv-signal); animation: ltdot 1s ease-in-out infinite; }
.lm-typing i:nth-child(2) { animation-delay: .15s; } .lm-typing i:nth-child(3) { animation-delay: .3s; }
.lm-typing--s i { width: 4px; height: 4px; }
@keyframes ltdot { 0%, 100% { opacity: .3; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-3px); } }
.lu { align-self: flex-end; background: var(--lv-inset); border: 1px solid var(--lv-line); padding: 9px 14px; border-radius: 14px 14px 4px 14px; font-size: 14.5px; max-width: 78%; color: var(--lv-ink); animation: lin .3s ease-out; }

.lchips { display: flex; flex-wrap: wrap; gap: 8px; animation: lin .3s ease-out; }
.lchip { font: inherit; font-weight: 600; font-size: 13.5px; padding: 9px 14px; border-radius: 999px; border: 1px solid var(--lv-ring); background: var(--lv-signal-bg); color: var(--lv-ink); cursor: pointer; }
.lchip:hover { background: var(--lv-action); border-color: var(--lv-action); color: var(--lv-action-ink); }
.lchip--ghost { background: transparent; border-color: var(--lv-line-strong); color: var(--lv-mute); }
.lchip:disabled { opacity: .5; cursor: default; }

.lform { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; animation: lin .3s ease-out; }
.lform input { font: inherit; font-size: 15px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--lv-line-strong); background: var(--lv-inset); color: var(--lv-ink); min-width: 200px; }
.lform input[type="number"] { min-width: 100px; width: 110px; }
.lform button { font: inherit; font-weight: 700; font-size: 13px; padding: 10px 14px; border-radius: 999px; border: 1px solid var(--lv-action); background: var(--lv-action); color: var(--lv-action-ink); cursor: pointer; }
.lform button.lform__ghost { background: transparent; color: var(--lv-mute); border-color: var(--lv-line-strong); }

.lhand { margin: 0 18px; border: 1px solid var(--lv-line-strong); background: var(--lv-panel); border-radius: 12px; padding: 9px 12px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; animation: lin .3s ease-out; }
.leon--rail .lhand { margin: 0 0 8px; }
.lhand__k { font-family: var(--lv-font-data); font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--lv-signal); }
.lhand__s { flex: 1 1 140px; font-size: 12.5px; color: var(--lv-ink); min-width: 0; line-height: 1.45; }
.lhand__go { font: inherit; font-weight: 700; font-size: 11px; padding: 6px 11px; border-radius: 999px; background: var(--lv-action); border: 0; color: var(--lv-action-ink); cursor: pointer; text-decoration: none; }
.lhand__x { background: none; border: 0; color: var(--lv-faint); font-size: 16px; cursor: pointer; }

.composer { margin: 10px 18px 16px; border: 1px solid var(--lv-line-strong); border-radius: 14px; background: var(--lv-panel); }
.leon--rail .composer { margin: 0; }
.composer__line { margin: 0; padding: 8px 14px 0; font-size: 12px; color: var(--lv-faint); }
.composer__bar { display: flex; align-items: flex-end; gap: 6px; padding: 6px 8px 6px 0; }
.composer__bar textarea { flex: 1; border: 0; background: transparent; color: var(--lv-ink); font: inherit; font-size: 16px; padding: 10px 14px; resize: none; min-height: 42px; max-height: 164px; outline: none; }
.composer__bar textarea::placeholder { color: var(--lv-faint); }
.composer__mic, .composer__send { width: 36px; height: 36px; border-radius: 10px; border: 1px solid var(--lv-line-strong); background: transparent; color: var(--lv-mute); display: grid; place-items: center; cursor: pointer; flex: none; }
.composer__mic:hover, .composer__send:hover { color: var(--lv-ink); border-color: var(--lv-ink); }
.composer__mic--rec { border-color: var(--lv-action); color: var(--lv-signal); animation: lpulse 1.6s ease-in-out infinite; }
.composer__secs { font-family: var(--lv-font-data); font-size: 11px; font-variant-numeric: tabular-nums; }
.composer__send { background: var(--lv-action); border-color: var(--lv-action); color: var(--lv-action-ink); }
.composer__send:disabled { opacity: .35; pointer-events: none; }

/* ---- the canvas ---- */
.leon__canvas { display: none; }
.leon__ch { font-family: var(--lv-font-data); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--lv-faint); display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 2px 0 4px; }
.leon__ch b { color: var(--lv-mute); font-weight: 500; letter-spacing: 0; text-transform: none; font-family: var(--lv-font-body); font-size: 12px; }
.leon__inl { display: block; }
.lcard { background: var(--lv-panel); border: 1px solid var(--lv-line); border-radius: 14px; padding: 14px; animation: lin .4s ease-out; }
.lcard__t { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--lv-signal); margin: 0 0 10px; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.lpill { font-family: var(--lv-font-data); font-size: 9.5px; letter-spacing: .04em; padding: 3px 8px; border-radius: 999px; background: var(--lv-success-bg); color: var(--lv-success); text-transform: none; white-space: nowrap; }
.lpill--wait { background: var(--lv-signal-bg); color: var(--lv-signal); }
.lpill--held { background: var(--lv-attention-bg); color: var(--lv-attention); }
.lbrand { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start; }
.llogo { width: 56px; height: 56px; border-radius: 12px; background: #fff; display: grid; place-items: center; overflow: hidden; }
.llogo img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.llogo span { font-size: 10px; color: #6F5D50; text-align: center; padding: 4px; }
.lkv { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; font-size: 13px; }
.lkv span { color: var(--lv-faint); } .lkv b { font-weight: 600; color: var(--lv-ink); }
.lsw { display: inline-flex; gap: 6px; vertical-align: middle; margin-right: 6px; }
.lsw i { width: 16px; height: 16px; border-radius: 5px; border: 1px solid var(--lv-line-strong); display: inline-block; }
.lphotos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.lphotos button { padding: 0; border: 2px solid transparent; border-radius: 12px; background: none; cursor: pointer; overflow: hidden; }
.lphotos button[aria-pressed="true"] { border-color: var(--lv-action); }
.lphotos img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; display: block; }
.lg { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; }
.lg__big { font-family: var(--lv-font-data); font-size: 30px; font-weight: 600; color: var(--lv-ink); line-height: 1; }
.lg__sub { font-size: 13px; color: var(--lv-mute); }
.lstars { color: var(--lv-signal); letter-spacing: 2px; font-size: 13px; }
.lq { margin: 0; padding: 10px 12px; border-left: 3px solid var(--lv-action); background: var(--lv-inset); border-radius: 0 10px 10px 0; font-size: 13.5px; line-height: 1.45; color: var(--lv-ink); }
.lq + .lq { margin-top: 8px; }
.lads { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.lad__meta { display: block; padding: 0 8px 8px; font-family: var(--lv-font-data); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--lv-faint); }
.leon__credits { margin-left: auto; font-family: var(--lv-font-data); font-size: 10.5px; letter-spacing: .06em; color: var(--lv-faint); border: 1px solid var(--lv-line); border-radius: 999px; padding: 4px 9px; white-space: nowrap; }
.lad { border: 1px solid var(--lv-line); border-radius: 12px; overflow: hidden; background: var(--lv-inset); animation: lin .4s ease-out; }
.lad--held { opacity: .7; }
.lad__ph { aspect-ratio: 4 / 5; position: relative; overflow: hidden; background: var(--lv-well); }
.lad__ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.lad__ov { position: absolute; inset: auto 0 0 0; padding: 22px 10px 10px; background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(20, 14, 10, .92)); color: #fff; font-weight: 700; font-size: 12px; line-height: 1.2; }
.lad__ov small { display: block; font-weight: 400; font-size: 9.5px; opacity: .85; margin-top: 3px; }
.lad__ov .lad__b { display: inline-block; margin-top: 6px; color: #fff; font-weight: 700; font-size: 8.5px; padding: 4px 8px; border-radius: 999px; }
.lad__st { font-family: var(--lv-font-data); font-size: 9px; padding: 6px 8px; color: var(--lv-faint); display: flex; justify-content: space-between; gap: 6px; }
.lad__st .ok { color: var(--lv-success); }
.lpage { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: center; }
.lphone { width: 120px; border: 5px solid #0d0906; border-radius: 20px; background: #fff; overflow: hidden; color: #151513; }
.lphone__bar { height: 3px; }
.lphone__hero { position: relative; height: 110px; background: #241B14; color: #fff; overflow: hidden; }
.lphone__hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.lphone__hero div { position: absolute; inset: auto 6px 6px 6px; padding-top: 24px; background: linear-gradient(180deg, rgba(36, 27, 20, 0), rgba(36, 27, 20, .95) 45%); }
.lphone__hero b { display: block; font-size: 8px; line-height: 1.15; }
.lphone__hero i { display: inline-block; margin-top: 4px; font-style: normal; font-size: 6px; font-weight: 700; padding: 3px 6px; border-radius: 5px; color: #fff; }
.lphone__frm { padding: 6px; }
.lphone__frm span { display: block; height: 9px; border: 1px solid #ddd; border-radius: 3px; margin: 3px 0; }
.lphone__frm i { display: block; color: #fff; text-align: center; font-style: normal; font-size: 6px; font-weight: 700; padding: 4px; border-radius: 4px; margin-top: 4px; }
.lpage__u { font-family: var(--lv-font-data); font-size: 11.5px; color: var(--lv-signal); word-break: break-all; }
.lpage__u a { color: inherit; }
.lrows { display: flex; flex-direction: column; gap: 8px; }
.lrow { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--lv-line); border-radius: 10px; font-size: 13px; }
.lrow b { flex: 1; color: var(--lv-ink); font-weight: 600; display: block; }
.lrow b span { display: block; font-size: 11.5px; color: var(--lv-faint); font-weight: 400; }
.lrow a, .lrow .lrow__on { font: inherit; font-size: 11.5px; font-weight: 700; padding: 6px 11px; border-radius: 999px; border: 1px solid var(--lv-line-strong); color: var(--lv-ink); text-decoration: none; white-space: nowrap; }
.lrow a.p { background: var(--lv-action); border-color: var(--lv-action); color: var(--lv-action-ink); }
.lrow .lrow__on { border-color: var(--lv-success); color: var(--lv-success); }
.lweek { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-top: 8px; }
.lweek i { height: 34px; border-radius: 6px; background: var(--lv-inset); border: 1px solid var(--lv-line); font-style: normal; font-family: var(--lv-font-data); font-size: 9px; color: var(--lv-faint); display: grid; place-items: center; }
.lweek i.on { border-color: var(--lv-action); color: var(--lv-signal); }
.lsub { margin: 0; font-size: 13px; color: var(--lv-mute); }

/* the rail carries the thread alone; cards go inline */
.leon--rail .leon__canvas { display: none; }
.leon--rail .leon__inl { display: block; }
.leon--rail .leon__convo { padding: 12px 0 8px; }
.leon--rail .lads { grid-template-columns: repeat(2, 1fr); }

@media (max-width: 960px) {
  .leon { height: auto; min-height: 0; border-radius: 12px; }
  .leon__convo { max-height: 72vh; }
  .lads { grid-template-columns: repeat(2, 1fr); }
}

/* the Studio-Check and the material (6 Sep 2026) */
.lfind { display: grid; gap: 10px; }
.lfind__i { padding: 10px 12px; border-left: 3px solid var(--lv-action); background: var(--lv-inset); border-radius: 0 10px 10px 0; }
.lfind__i b { display: block; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--lv-faint); margin-bottom: 4px; }
.lfind__i p { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--lv-ink); }
.lpool { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.lpool img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 8px; display: block; }
.leon--rail .lpool { grid-template-columns: repeat(4, 1fr); }
.composer__attach { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--lv-line); background: var(--lv-panel); color: var(--lv-faint); display: grid; place-items: center; cursor: pointer; }
.composer__attach:hover { color: var(--lv-ink); }
.composer__attach:disabled { opacity: .5; cursor: default; }

/* the scheduled posts on the week card (6 Sep 2026) */
.lposts { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; margin-top: 8px; }
.lpost { display: grid; gap: 4px; }
.lpost img, .lpost__ph { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 8px; background: var(--lv-inset); }
.lpost b { font-size: 12px; font-weight: 600; color: var(--lv-ink); }
.lpost small { font-family: var(--lv-font-data); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--lv-faint); }

/* picking another photograph for one advert (6 Sep 2026) */
.lpick { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--lv-line); }
.lpick__row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; margin-top: 8px; }
.lpick__row button { padding: 0; border: 2px solid transparent; border-radius: 8px; background: none; cursor: pointer; overflow: hidden; aspect-ratio: 1; }
.lpick__row button[aria-pressed="true"] { border-color: var(--lv-action); }
.lpick__row img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 640px) { .lpick__row { grid-template-columns: repeat(4, 1fr); } }

/* the plan table: the creative brief before any picture is made (6 Sep 2026) */
.lplan { display: grid; gap: 4px; margin: 0 0 12px; font-size: 12.5px; color: var(--lv-ink); }
.lplan__r { display: grid; grid-template-columns: 18px 1.1fr 1.6fr 1fr 44px; gap: 10px; align-items: center; padding: 7px 8px; border-radius: 8px; background: var(--lv-inset); }
.lplan__r > span { min-width: 0; overflow-wrap: anywhere; }
.lplan__r > span:first-child { font-family: var(--lv-font-display); color: var(--lv-faint); font-size: 15px; text-align: center; }
.lplan__r b { display: block; font-weight: 600; line-height: 1.25; }
.lplan__r small { display: block; font-family: var(--lv-font-data); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--lv-faint); margin-top: 2px; }
.lplan__r img { display: block; width: 44px; height: 44px; object-fit: cover; border-radius: 6px; }
.lplan__h { background: transparent; padding-top: 0; padding-bottom: 2px; font-family: var(--lv-font-data); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--lv-faint); }
.lplan__h > span:first-child { font-size: 9.5px; }
@media (max-width: 640px) { .lplan__r { grid-template-columns: 18px 1fr 1fr; } .lplan__r > span:nth-child(4), .lplan__r > span:nth-child(5) { display: none; } }

/* the quiet placeholder before a picture exists, and the reading checklist (6 Sep 2026: no mock adverts) */
.lad__ph--wait { background: var(--lv-inset); display: grid; place-items: center; }
.lad__plan { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 12px; text-align: center; }
.lad__plan .lad__n { font-family: var(--lv-font-display); font-size: 28px; color: var(--lv-faint); line-height: 1; }
.lad__plan b { font-size: 12.5px; color: var(--lv-ink); font-weight: 600; line-height: 1.25; }
.lad__plan small { font-family: var(--lv-font-data); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--lv-faint); }
.lshim { display: block; width: 46%; height: 3px; border-radius: 2px; background: linear-gradient(90deg, var(--lv-line) 0%, var(--lv-action) 50%, var(--lv-line) 100%); background-size: 200% 100%; animation: lshim 1.6s linear infinite; margin-top: 2px; }
@keyframes lshim { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.lread { display: grid; gap: 6px; }
.lread__i { display: grid; grid-template-columns: 18px 1fr auto; align-items: center; gap: 10px; font-size: 13px; color: var(--lv-ink); padding: 6px 8px; border-radius: 8px; background: var(--lv-inset); }
.lread__i i { font-style: normal; font-weight: 700; color: var(--lv-success); text-align: center; }
.lread__i small { font-family: var(--lv-font-data); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--lv-faint); }
.lread__i--none { opacity: .55; }
.lread__i--none i { color: var(--lv-faint); }
.lread__i--later { opacity: .8; }
.lread__i--pending i::after { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; border: 2px solid var(--lv-action); border-right-color: transparent; animation: lspin .9s linear infinite; }
@keyframes lspin { to { transform: rotate(360deg); } }

/* the facts strip and the customers' words on the Studio-Check (6 Sep 2026) */
.lfacts { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.lfacts span { font-family: var(--lv-font-data); font-size: 11px; letter-spacing: .04em; padding: 5px 9px; border-radius: 999px; border: 1px solid var(--lv-line); color: var(--lv-mute); }
.lfacts span b { color: var(--lv-ink); font-weight: 600; margin-right: 3px; }
.lfind__q { margin-top: 12px; }
.lfind__qh { display: block; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--lv-faint); margin-bottom: 6px; }

/* THE OPEN FIRST CONVERSATION (7 Sep 2026): the progress line over the first
   conversation, the ask inside it, the four-digit code, the wall. */
.lprog { display: flex; gap: 4px; padding: 10px 18px 0; }
.lprog i { flex: 1; height: 3px; border-radius: 2px; background: var(--lv-line); position: relative; overflow: hidden; }
.lprog i.on { background: var(--lv-action); }
.lprog i.half::after { content: ""; position: absolute; inset: 0 50% 0 0; background: var(--lv-action); }
.lprog__k { display: flex; justify-content: space-between; padding: 4px 18px 0; font-family: var(--lv-font-data); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--lv-faint); }
.lprog__k span.on { color: var(--lv-ink); }
.leon--rail .lprog, .leon--rail .lprog__k { display: none; }
.lgate { display: flex; flex-direction: column; gap: 10px; max-width: 420px; animation: lin .3s ease-out; }
.lgate input[type="email"], .lgate input[type="text"] { font: inherit; font-size: 16px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--lv-line-strong); background: var(--lv-inset); color: var(--lv-ink); width: 100%; }
.lgate__go { font: inherit; font-weight: 700; font-size: 14.5px; padding: 12px 16px; border-radius: 999px; border: 1px solid var(--lv-action); background: var(--lv-action); color: var(--lv-action-ink); cursor: pointer; width: 100%; }
.lgate__ghost { font: inherit; font-weight: 600; font-size: 13.5px; padding: 11px 16px; border-radius: 999px; border: 1px solid var(--lv-line-strong); background: transparent; color: var(--lv-ink); cursor: pointer; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.lgate__ghost svg { width: 16px; height: 16px; }
.lgate__fine { font-size: 12px; color: var(--lv-faint); line-height: 1.45; margin: 0; }
.lgate__fine a { color: var(--lv-mute); }
.lgate__consent { display: flex; gap: 9px; align-items: flex-start; font-size: 12.5px; color: var(--lv-mute); line-height: 1.4; }
.lgate__consent input { margin-top: 3px; }
.lgate__or { font-family: var(--lv-font-data); font-size: 10px; letter-spacing: .12em; color: var(--lv-faint); text-align: center; }
.lgate__err { color: var(--lv-signal); font-size: 13px; margin: 0; }
.lcode { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; animation: lin .3s ease-out; }
.lcode input { font-family: var(--lv-font-data); font-size: 28px; letter-spacing: .5em; text-indent: .25em; padding: 10px 6px 10px 14px; width: 190px; border-radius: 12px; border: 1px solid var(--lv-line-strong); background: var(--lv-inset); color: var(--lv-ink); text-align: center; }
.lcode button { font: inherit; font-weight: 700; font-size: 13.5px; padding: 11px 16px; border-radius: 999px; border: 1px solid var(--lv-action); background: var(--lv-action); color: var(--lv-action-ink); cursor: pointer; }
.lcode button.lform__ghost { background: transparent; color: var(--lv-mute); border-color: var(--lv-line-strong); font-weight: 600; }
.lwall { display: flex; flex-direction: column; gap: 10px; }
.lwall__head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.lwall__code { display: inline-flex; align-items: center; gap: 6px; font-family: var(--lv-font-data); font-size: 11px; letter-spacing: .04em; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--lv-ring); background: var(--lv-signal-bg); color: var(--lv-ink); }
.lwall__code b { color: var(--lv-action); font-weight: 700; }
.lwall__code.off { opacity: .6; }
.lblocks { display: flex; flex-direction: column; border: 1px solid var(--lv-line-strong); border-radius: 14px; overflow: hidden; }
.lblock { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 11px 14px; border-top: 1px solid var(--lv-line); font-size: 14px; color: var(--lv-ink); }
.lblock:first-child { border-top: 0; }
.lblock.pop { background: var(--lv-signal-bg); }
.lblock b { font-weight: 800; font-variant-numeric: tabular-nums; }
.lblock s { color: var(--lv-faint); font-weight: 400; margin-right: 6px; }
.lblock small { display: block; font-family: var(--lv-font-data); font-size: 10.5px; color: var(--lv-faint); font-weight: 400; margin-top: 2px; }
.lblock .lpill { margin-left: 8px; }
.lblocks__after { padding: 8px 14px; font-size: 12px; color: var(--lv-mute); text-align: center; border-top: 1px solid var(--lv-line); }
.lwall__list { display: flex; flex-direction: column; gap: 5px; margin: 0; padding: 0; list-style: none; }
.lwall__list li { font-size: 13px; color: var(--lv-mute); display: flex; gap: 8px; }
.lwall__list li::before { content: "✓"; color: var(--lv-action); font-weight: 700; }
.lwall__fine { font-size: 12px; color: var(--lv-faint); margin: 0; line-height: 1.45; }
.lfaq { display: flex; flex-wrap: wrap; gap: 8px; animation: lin .3s ease-out; }
.lfaq button { font: inherit; font-size: 12.5px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--lv-line-strong); background: transparent; color: var(--lv-mute); cursor: pointer; }

/* the looks per advert (8 Sep 2026): two or three per concept, the owner taps one */
.lvars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 6px; border-top: 1px solid var(--lv-line); }
.lvars button { padding: 0; border: 2px solid transparent; border-radius: 6px; background: var(--lv-well); cursor: pointer; overflow: hidden; aspect-ratio: 4 / 5; position: relative; }
.lvars button[aria-pressed="true"] { border-color: var(--lv-action); }
.lvars button:disabled { cursor: default; }
.lvars img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lvars__wait { position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent); animation: lshim 1.4s infinite; }
.lvars__x { position: absolute; inset: 0; background: repeating-linear-gradient(45deg, transparent 0 6px, var(--lv-line) 6px 8px); }
/* the second door, on the first screen (8 Sep 2026) */
.leon__signin { margin-left: auto; font-size: 12.5px; color: var(--lv-faint); text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
.leon__signin:hover { color: var(--lv-ink, inherit); }