/* Paid keeping. Same tokens, radius, and type as the life archive and the save dialog. */
.bil-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 4px;
  border: 1px solid var(--rule, #C7D2CE); color: var(--ink3, #5F6E72); background: transparent;
  font: 500 12px/1.4 var(--f-mono, ui-monospace, Menlo, monospace); font-variant-numeric: tabular-nums;
  letter-spacing: .02em; white-space: nowrap;
}
.bil-chip::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.bil-chip.is-soon { color: var(--gold, #9C7020); border-color: currentColor; }
.bil-chip.is-kept { color: var(--stamp, #0F6E68); border-color: currentColor; background: var(--stamp-soft, #DCEDEA); }
.bil-chip.is-lapsed { color: var(--bad, #B0362B); border-color: currentColor; }

.bil-bar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 14px;
  margin: 12px 0; padding: 12px 14px; border: 1px solid var(--rule, #C7D2CE); border-left: 3px solid var(--gold, #9C7020);
  border-radius: 4px; background: var(--card, #F7FAF8); color: var(--ink, #13212A);
  font: 14px/1.55 var(--f-body, system-ui, sans-serif);
}
.bil-bar p { margin: 0; flex: 1 1 260px; color: var(--ink2, #4A5A61); text-wrap: pretty; }

.bil-cta, .bil-ghost, .bil-link, .bil-x, .bil-plan { font: inherit; cursor: pointer; }
.bil-cta, .bil-ghost {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px;
  padding: 10px 16px; border-radius: 4px; font-size: 15px; font-weight: 600; text-decoration: none; line-height: 1.3;
}
.bil-cta { background: var(--accent, #8C1D3C); color: var(--accent-ink, #FFFFFF); border: 1px solid var(--accent, #8C1D3C); }
.bil-cta:hover { filter: brightness(1.08); }
.bil-ghost { background: transparent; color: var(--ink, #13212A); border: 1px solid var(--rule, #C7D2CE); }
.bil-ghost:hover { border-color: var(--ink3, #5F6E72); }
.bil-cta.sm, .bil-ghost.sm { min-height: 36px; padding: 7px 12px; font-size: 14px; }
.bil-cta:disabled, .bil-ghost:disabled, .bil-plan:disabled { opacity: .6; cursor: wait; }
.bil-link { background: none; border: 0; padding: 6px 0; color: var(--stamp, #0F6E68); text-decoration: underline; text-underline-offset: 3px; font-size: 14px; text-align: left; }
.bil-cta:focus-visible, .bil-ghost:focus-visible, .bil-link:focus-visible, .bil-x:focus-visible, .bil-plan:focus-visible, .bil-input:focus-visible {
  outline: 2px solid var(--accent, #8C1D3C); outline-offset: 2px;
}

dialog.bil-sheet {
  width: min(480px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 22px;
  border: 1px solid var(--rule, #C7D2CE); border-radius: 4px; background: var(--card, #F7FAF8); color: var(--ink, #13212A);
  box-shadow: var(--shadow, 0 8px 24px -12px rgba(19,33,42,.18)); font: 15px/1.6 var(--f-body, system-ui, sans-serif);
  overscroll-behavior: contain;
}
dialog.bil-sheet::backdrop { background: rgba(19, 33, 42, .55); }
.bil-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.bil-title { margin: 0; font-family: var(--f-display, serif); font-size: 26px; font-weight: 700; letter-spacing: -.03em; line-height: 1.2; text-wrap: balance; }
.bil-x { width: 40px; height: 40px; flex: none; border: 1px solid var(--rule, #C7D2CE); border-radius: 4px; background: transparent; color: var(--ink2, #4A5A61); font-size: 20px; line-height: 1; }
.bil-lead { margin: 0 0 14px; color: var(--ink2, #4A5A61); text-wrap: pretty; }
.bil-sub { margin: 16px 0 8px; font-family: var(--f-display, serif); font-size: 16px; font-weight: 600; }
.bil-terms { margin: 14px 0 4px; color: var(--ink3, #5F6E72); font-size: 13px; text-wrap: pretty; }
.bil-msg { min-height: 1.4em; margin: 10px 0 0; color: var(--stamp, #0F6E68); font-size: 14px; }
.bil-msg:empty { min-height: 0; margin: 0; }
.bil-msg.is-bad, .bil-warn { color: var(--bad, #B0362B); }
.bil-warn { margin: 10px 0; font-size: 14px; }

.bil-plans { display: grid; gap: 8px; }
.bil-plan {
  position: relative; display: grid; gap: 4px; width: 100%; padding: 14px 16px; text-align: left;
  border: 1px solid var(--rule, #C7D2CE); border-radius: 4px; background: var(--paper, #EBF0ED); color: var(--ink, #13212A);
}
.bil-plan:hover { border-color: var(--accent, #8C1D3C); }
.bil-plan.is-primary { border-color: var(--accent, #8C1D3C); background: var(--accent-soft, #F3E3E8); }
.bil-plan__top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.bil-plan__name { font-family: var(--f-display, serif); font-size: 18px; font-weight: 600; }
.bil-plan__price { font: 600 18px/1.2 var(--f-mono, ui-monospace, Menlo, monospace); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bil-plan__price small { font-size: 12px; font-weight: 500; color: var(--ink3, #5F6E72); }
.bil-plan__sub { color: var(--ink2, #4A5A61); font-size: 14px; text-wrap: pretty; }
.bil-plan__badge { justify-self: start; padding: 1px 8px; border-radius: 4px; background: var(--stamp-soft, #DCEDEA); color: var(--stamp, #0F6E68); font-size: 12px; font-weight: 600; }
.bil-plan__go { justify-self: end; color: var(--accent, #8C1D3C); font-size: 14px; font-weight: 600; }

.bil-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.bil-facts { margin: 0; display: grid; gap: 0; border-top: 1px solid var(--rule2, #DCE4E1); }
.bil-facts > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--rule2, #DCE4E1); }
.bil-facts dt { color: var(--ink3, #5F6E72); font-size: 14px; }
.bil-facts dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.bil-lives { list-style: none; margin: 0; padding: 0; }
.bil-lives li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--rule2, #DCE4E1); }
.bil-lives a { color: var(--stamp, #0F6E68); text-decoration: none; }
.bil-lives a:hover { text-decoration: underline; }
.bil-lives span { color: var(--ink3, #5F6E72); font: 13px var(--f-mono, ui-monospace, monospace); font-variant-numeric: tabular-nums; }

.bil-form { display: grid; gap: 12px; }
.bil-label { display: grid; gap: 6px; font-size: 14px; color: var(--ink2, #4A5A61); }
.bil-label[hidden] { display: none; }
.bil-input {
  min-height: 44px; padding: 10px 12px; border: 1px solid var(--rule, #C7D2CE); border-radius: 4px;
  background: var(--paper, #EBF0ED); color: var(--ink, #13212A); font: 16px var(--f-body, system-ui, sans-serif);
}
.bil-input[name="code"] { font-family: var(--f-mono, ui-monospace, monospace); letter-spacing: .2em; }

.bil-toast {
  position: fixed; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 60; transform: translateX(-50%);
  max-width: min(520px, calc(100vw - 32px)); margin: 0; padding: 12px 16px; border-radius: 4px;
  background: var(--ink, #13212A); color: var(--card, #F7FAF8); box-shadow: var(--shadow, 0 8px 24px -12px rgba(19,33,42,.18));
  font: 600 14px/1.5 var(--f-body, system-ui, sans-serif); text-wrap: pretty;
}
.bil-toast.is-bad { background: var(--bad, #B0362B); color: #fff; }

.bil-locked {
  margin: 0 auto; max-width: 720px; border: 1px solid var(--rule, #C7D2CE); border-radius: 4px;
  background: var(--card, #F7FAF8); color: var(--ink, #13212A); box-shadow: var(--shadow, 0 8px 24px -12px rgba(19,33,42,.18));
  font: 15px/1.6 var(--f-body, system-ui, sans-serif); overflow: hidden;
}
.bil-locked__band {
  padding: 8px 18px; background: var(--bad, #B0362B); color: #fff;
  font: 600 12px/1.4 var(--f-mono, ui-monospace, monospace); letter-spacing: .12em; text-transform: uppercase;
}
.bil-locked.is-gone .bil-locked__band { background: var(--ink3, #5F6E72); }
.bil-locked__body { padding: 22px 22px 24px; }
.bil-locked__life { margin: 0 0 6px; color: var(--ink3, #5F6E72); font: 13px var(--f-mono, ui-monospace, monospace); }
.bil-locked__title { margin: 0 0 10px; font-family: var(--f-display, serif); font-size: clamp(24px, 4vw, 32px); font-weight: 700; letter-spacing: -.03em; line-height: 1.2; text-wrap: balance; }
.bil-locked__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(12px, 1fr)); gap: 3px; margin: 16px 0 4px; filter: blur(1.5px); opacity: .55; }
.bil-locked__grid span { aspect-ratio: 1; border-radius: 2px; background: var(--rule, #C7D2CE); }
.bil-locked__grid span:nth-child(3n) { background: var(--stamp-soft, #DCEDEA); }
.bil-locked__grid span:nth-child(7n) { background: var(--accent-soft, #F3E3E8); }
.memo-body .bil-locked { margin: 24px auto; }

.bil-lockable { position: relative; }
.bil-lockable::after {
  content: ''; display: inline-block; width: 12px; height: 12px; margin-left: 6px; vertical-align: -1px;
  background: currentColor; opacity: .8;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 7V5a4 4 0 1 1 8 0v2h1v8H3V7h1Zm2 0h4V5a2 2 0 1 0-4 0v2Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 7V5a4 4 0 1 1 8 0v2h1v8H3V7h1Zm2 0h4V5a2 2 0 1 0-4 0v2Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.lar-past__chip { margin-left: auto; }

@media (prefers-color-scheme: dark) {
  .bil-toast { background: var(--card, #141D21); color: var(--ink, #E1E9E6); border: 1px solid var(--rule, #2A383D); }
}
@media (prefers-reduced-motion: no-preference) {
  dialog.bil-sheet[open] { animation: bil-in .18s ease-out; }
  @keyframes bil-in { from { opacity: 0; transform: translateY(8px); } }
}

.archive-pass {
  margin-left: auto; display: inline-flex; align-items: center; padding: 8px 12px;
  border: 1px solid var(--rule); border-radius: 4px; background: var(--card); color: var(--ink);
  font: inherit; font-size: 14px; cursor: pointer;
}
.archive-pass:hover { border-color: var(--ink3); }
.archive-pass:focus-visible { outline: 2px solid var(--accent, #8C1D3C); outline-offset: 2px; }

/* Sign-in */
.auth-google {
  display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 10px 16px;
  border: 1px solid var(--rule, #C7D2CE); border-radius: 4px; background: #FFFFFF; color: #1F1F1F;
  font: 500 15px/1.2 var(--f-body, system-ui, sans-serif); text-decoration: none;
}
.auth-google:hover { border-color: var(--ink3, #5F6E72); }
.auth-google:focus-visible { outline: 2px solid var(--accent, #8C1D3C); outline-offset: 2px; }
.auth-google svg { flex: none; }
.auth-or {
  display: flex; align-items: center; gap: 12px; margin: 16px 0 10px; color: var(--ink3, #5F6E72);
  font: 500 12px/1.4 var(--f-mono, ui-monospace, Menlo, monospace); letter-spacing: .04em;
}
.auth-or::before, .auth-or::after { content: ''; flex: 1; height: 1px; background: var(--rule, #C7D2CE); }
.auth-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; margin: 4px 0 0; }
.auth-links .bil-link:disabled { color: var(--ink3, #5F6E72); text-decoration: none; cursor: default; }
.auth-who { overflow-wrap: anywhere; }
.auth-human:empty { display: none; }
.auth-google[hidden], .auth-or[hidden], .auth-links[hidden], .bil-form[hidden] { display: none; }

/* Subscribers see no ads */
html[data-ad-free] .ad-slot, html[data-ad-free] [data-ad] { display: none !important; }
