@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,650&family=Manrope:wght@400;500;600;700;800&display=swap");

:root {
  --font-sans: "Manrope", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Fraunces", Georgia, serif;
  --bg: #07130d;
  --bg-deep: #030905;
  --surface: #0d1d14;
  --surface-2: #11281a;
  --surface-3: #173322;
  --ink: #f5fbf6;
  --muted: #a8b8ad;
  --dim: #74857a;
  --line: rgba(151, 224, 175, .17);
  --line-strong: rgba(151, 224, 175, .34);
  --accent: #68df93;
  --accent-strong: #34c66a;
  --accent-soft: #c3f6d2;
  --gold: #f0c96f;
  --violet: #c3b4ff;
  --danger: #ff8585;
  --shadow: 0 28px 80px rgba(0,0,0,.34);
  --radius-sm: 12px;
  --radius: 20px;
  --radius-lg: 30px;
  --header-h: 74px;
  --text-scale: 1;
  color-scheme: dark;
}

html[data-theme="thornmoon"] {
  --bg: #160708;
  --bg-deep: #090203;
  --surface: #240b0d;
  --surface-2: #311014;
  --surface-3: #42171b;
  --ink: #fff7f6;
  --muted: #d4b1b2;
  --dim: #a57679;
  --line: rgba(255, 111, 119, .20);
  --line-strong: rgba(255, 111, 119, .42);
  --accent: #ff6871;
  --accent-strong: #e83e49;
  --accent-soft: #ffc0c4;
  --gold: #ffc96d;
  --violet: #e0a6ff;
  --danger: #ff7676;
}

html[data-theme="dark"] {
  --bg: #020504;
  --bg-deep: #000201;
  --surface: #07100b;
  --surface-2: #0b1710;
  --surface-3: #102318;
  --ink: #ffffff;
  --muted: #b5c2b9;
  --dim: #6f7f74;
  --line: rgba(95, 190, 128, .18);
  --line-strong: rgba(95, 190, 128, .38);
  --accent: #4bc27a;
  --accent-strong: #2a9858;
  --accent-soft: #bee9cc;
  --gold: #d8bd78;
  --violet: #b5a8e8;
}

html[data-text="large"] { --text-scale: 1.085; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 104px; background: var(--bg-deep); }
body {
  margin: 0;
  min-width: 300px;
  min-height: 100vh;
  overflow-x: hidden;
  color: var(--ink);
  background:
    radial-gradient(circle at 8% -8%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 34rem),
    radial-gradient(circle at 100% 18%, color-mix(in srgb, var(--violet) 8%, transparent), transparent 28rem),
    linear-gradient(180deg, var(--bg), var(--bg-deep));
  font-family: var(--font-sans);
  font-size: calc(16px * var(--text-scale));
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.menu-open, body.settings-open { overflow: hidden; }
a { color: inherit; text-underline-offset: 3px; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { max-width: 100%; }
code, .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.lb-skip { position: fixed; z-index: 999; left: 14px; top: 8px; transform: translateY(-160%); padding: 9px 12px; border-radius: 10px; background: var(--ink); color: var(--bg-deep); font-weight: 900; text-decoration: none; transition: transform .16s ease; }
.lb-skip:focus { transform: translateY(0); }

.lb-site-header {
  position: fixed; z-index: 100; inset: 0 0 auto;
  height: var(--header-h);
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter: blur(18px) saturate(130%);
}
.lb-nav { width: min(1240px, calc(100% - 28px)); height: 100%; margin: 0 auto; display: flex; align-items: center; gap: 18px; }
.lb-brand { display: inline-flex; align-items: center; gap: 10px; min-width: max-content; text-decoration: none; }
.lb-brand img { width: 36px; height: 36px; image-rendering: pixelated; filter: drop-shadow(0 6px 12px rgba(0,0,0,.2)); }
.lb-brand-word { font-size: 1.05rem; font-weight: 950; letter-spacing: -.035em; }
.lb-brand-word em { color: var(--accent); font-style: normal; }
.lb-nav-links { display: none; align-items: center; gap: 4px; margin-left: 8px; }
.lb-nav-links a { position: relative; padding: 9px 10px; border-radius: 10px; color: var(--muted); font-size: .83rem; font-weight: 800; text-decoration: none; transition: color .18s, background .18s; }
.lb-nav-links a:hover, .lb-nav-links a[aria-current="page"] { color: var(--ink); background: color-mix(in srgb, var(--accent) 9%, transparent); }
.lb-nav-links a[aria-current="page"]::after { content: ""; position: absolute; left: 11px; right: 11px; bottom: 4px; height: 2px; border-radius: 99px; background: var(--accent); }
.lb-nav-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.lb-nav-status { display: none; align-items: center; gap: 7px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: .76rem; font-weight: 850; text-decoration: none; white-space: nowrap; }
.lb-status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--dim); box-shadow: 0 0 0 4px color-mix(in srgb, var(--dim) 14%, transparent); }
.lb-status-dot.online { background: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 15%, transparent), 0 0 16px color-mix(in srgb, var(--accent) 50%, transparent); }
.lb-status-dot.offline { background: var(--danger); box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger) 14%, transparent); }
.lb-icon-btn { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface-2) 70%, transparent); color: var(--ink); cursor: pointer; transition: transform .18s, border-color .18s, background .18s; }
.lb-icon-btn:hover { transform: translateY(-1px); border-color: var(--line-strong); background: var(--surface-2); }
.lb-account-link { display: none; min-height: 40px; align-items: center; padding: 0 14px; border-radius: 12px; background: var(--accent); color: #041108; font-size: .8rem; font-weight: 950; text-decoration: none; }
.lb-menu-btn { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--ink); cursor: pointer; }

.lb-overlay { position: fixed; z-index: 180; inset: 0; background: rgba(0,0,0,.58); opacity: 0; pointer-events: none; transition: opacity .2s ease; }
.lb-overlay.open { opacity: 1; pointer-events: auto; }
.lb-mobile-menu, .lb-settings-panel { position: fixed; z-index: 190; top: 0; right: 0; width: min(390px, 92vw); height: 100dvh; transform: translateX(105%); transition: transform .24s ease; border-left: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 96%, black); box-shadow: -24px 0 70px rgba(0,0,0,.34); overflow-y: auto; }
.lb-mobile-menu.open, .lb-settings-panel.open { transform: translateX(0); }
.lb-panel-head { position: sticky; top: 0; z-index: 2; min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(14px); }
.lb-panel-head strong { font-size: .95rem; }
.lb-panel-close { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); color: var(--ink); cursor: pointer; }
.lb-mobile-server { margin: 16px 16px 10px; padding: 15px; border-radius: 16px; background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, transparent), var(--surface-2)); border: 1px solid var(--line); text-decoration: none; display: block; }
.lb-mobile-server span { display: block; color: var(--muted); font-size: .74rem; font-weight: 800; }
.lb-mobile-server strong { display: block; margin-top: 2px; font-size: 1rem; }
.lb-mobile-links { display: grid; padding: 8px; }
.lb-mobile-links a { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 12px; border-radius: 12px; color: var(--muted); font-weight: 850; text-decoration: none; }
.lb-mobile-links a:hover, .lb-mobile-links a[aria-current="page"] { color: var(--ink); background: color-mix(in srgb, var(--accent) 10%, transparent); }
.lb-mobile-links .icon { width: 22px; text-align: center; color: var(--accent); }

.lb-settings-body { padding: 18px; }
.lb-settings-group { padding: 0 0 22px; margin-bottom: 22px; border-bottom: 1px solid var(--line); }
.lb-settings-group:last-child { border-bottom: 0; }
.lb-settings-group h3 { margin: 0 0 4px; font-size: .92rem; }
.lb-settings-group p { margin: 0 0 12px; color: var(--muted); font-size: .8rem; }
.lb-theme-choices { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.lb-theme-choice { min-height: 76px; display: grid; align-content: end; gap: 3px; padding: 10px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); color: var(--ink); text-align: left; cursor: pointer; }
.lb-theme-choice::before { content: ""; width: 28px; height: 18px; border-radius: 99px; background: linear-gradient(90deg, var(--preview-a), var(--preview-b)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.lb-theme-choice[data-theme-choice="default"] { --preview-a:#68df93; --preview-b:#10271a; }
.lb-theme-choice[data-theme-choice="thornmoon"] { --preview-a:#ff6871; --preview-b:#2a0b0d; }
.lb-theme-choice[data-theme-choice="dark"] { --preview-a:#4bc27a; --preview-b:#020504; }
.lb-theme-choice.active { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 16%, transparent); }
.lb-theme-choice span { font-size: .74rem; font-weight: 900; }
.lb-setting-row { min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.lb-setting-row + .lb-setting-row { border-top: 1px solid color-mix(in srgb, var(--line) 60%, transparent); }
.lb-setting-row label, .lb-setting-row .label { color: var(--ink); font-size: .83rem; font-weight: 800; }
.lb-switch { width: 46px; height: 26px; position: relative; border: 0; border-radius: 99px; background: #33413a; cursor: pointer; transition: background .2s; }
.lb-switch::after { content:""; position:absolute; width:20px; height:20px; left:3px; top:3px; border-radius:50%; background:white; transition: transform .2s; }
.lb-switch[aria-pressed="true"] { background: var(--accent-strong); }
.lb-switch[aria-pressed="true"]::after { transform: translateX(20px); }
.lb-select { min-height: 36px; padding: 0 30px 0 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); color: var(--ink); }

main { padding-top: var(--header-h); }
.lb-container { width: min(1180px, calc(100% - 30px)); margin-inline: auto; }
.lb-narrow { width: min(820px, calc(100% - 30px)); margin-inline: auto; }
.lb-section { position: relative; padding: 62px 0; }
.lb-section + .lb-section { border-top: 1px solid color-mix(in srgb, var(--line) 60%, transparent); }
.lb-section.tint { background: linear-gradient(180deg, color-mix(in srgb, var(--surface-2) 44%, transparent), transparent); }
.lb-kicker { margin: 0 0 10px; color: var(--accent); font-size: .75rem; font-weight: 950; letter-spacing: .14em; text-transform: uppercase; }
.lb-display { margin: 0; max-width: 980px; font-family: var(--font-display); font-size: clamp(2.7rem, 8vw, 6.8rem); font-weight: 650; line-height: .95; letter-spacing: -.05em; text-wrap: balance; }
.lb-display .accent { color: var(--accent-soft); }
.lb-title { margin: 0; font-family: var(--font-display); font-size: clamp(2.2rem, 6vw, 4.7rem); font-weight: 640; line-height: 1.02; letter-spacing: -.045em; text-wrap: balance; }
.lb-h2 { margin: 0; font-family: var(--font-display); font-size: clamp(1.9rem, 4.6vw, 3.4rem); font-weight: 620; line-height: 1.06; letter-spacing: -.035em; text-wrap: balance; }
.lb-lead { max-width: 760px; margin: 20px 0 0; color: var(--muted); font-size: clamp(1rem, 2.1vw, 1.22rem); line-height: 1.7; }
.lb-copy { color: var(--muted); }
.lb-hero { position: relative; min-height: 620px; display: grid; align-items: end; padding: 76px 0 68px; overflow: hidden; }
.lb-hero.compact { min-height: 430px; }
.lb-hero::before { content:""; position:absolute; inset:0; pointer-events:none; background: linear-gradient(180deg, transparent 15%, color-mix(in srgb, var(--bg-deep) 42%, transparent) 70%, var(--bg-deep) 100%); }
.lb-hero-media { position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; opacity:.22; filter:saturate(.75) contrast(1.05); }
.lb-hero-glow { position:absolute; z-index:-1; width: min(760px, 72vw); aspect-ratio:1; right:-20%; top:-24%; border-radius:50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 18%, transparent), transparent 68%); filter: blur(10px); }
.lb-hero-content { position:relative; z-index:1; }
.lb-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.lb-btn { min-height:46px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 17px; border:1px solid transparent; border-radius:13px; background:var(--accent); color:#041008; font-weight:950; text-decoration:none; cursor:pointer; transition:transform .18s, box-shadow .18s, border-color .18s; }
.lb-btn:hover { transform:translateY(-2px); box-shadow:0 12px 28px color-mix(in srgb, var(--accent) 18%, transparent); }
.lb-btn.secondary { background:transparent; color:var(--ink); border-color:var(--line-strong); }
.lb-btn.ghost { min-height:40px; padding:0 12px; background:color-mix(in srgb, var(--surface-2) 70%, transparent); color:var(--muted); border-color:var(--line); font-size:.8rem; }
.lb-btn.gold { background:var(--gold); color:#171006; }
.lb-btn[aria-disabled="true"], .lb-btn:disabled { opacity:.48; cursor:not-allowed; transform:none; box-shadow:none; }

.lb-status-ribbon { margin-top: 34px; display:flex; flex-wrap:wrap; gap:8px 18px; align-items:center; width:fit-content; max-width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:14px; background:color-mix(in srgb, var(--surface) 74%, transparent); backdrop-filter:blur(12px); }
.lb-status-ribbon .primary { display:flex; align-items:center; gap:9px; font-weight:900; }
.lb-status-ribbon .meta { color:var(--muted); font-size:.8rem; }
.lb-status-ribbon code { color:var(--accent-soft); }

.lb-section-head { display:grid; gap:10px; margin-bottom:32px; }
.lb-section-head.split { grid-template-columns:1fr; }
.lb-section-head .lb-copy { max-width:700px; margin:0; }
.lb-statline { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); border-block:1px solid var(--line); }
.lb-stat { padding:20px 14px; }
.lb-stat:nth-child(odd) { border-right:1px solid var(--line); }
.lb-stat strong { display:block; font-family:var(--font-display); font-size:clamp(1.8rem,5vw,3rem); line-height:1; color:var(--accent-soft); }
.lb-stat span { display:block; margin-top:7px; color:var(--muted); font-size:.78rem; font-weight:800; }

.lb-feature-rail { display:grid; border-top:1px solid var(--line); }
.lb-feature-row { display:grid; grid-template-columns:44px minmax(0,1fr); gap:4px 14px; padding:22px 0; border-bottom:1px solid var(--line); }
.lb-feature-index { grid-column:1; grid-row:1 / span 4; width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--line-strong); border-radius:50%; color:var(--accent); font-size:.72rem; font-weight:950; }
.lb-feature-row h3 { grid-column:2; margin:0 0 2px; font-size:1.05rem; }
.lb-feature-row p { grid-column:2; margin:0; color:var(--muted); }
.lb-feature-row .meta { grid-column:2; margin-top:7px; display:flex; flex-wrap:wrap; gap:6px; }
.lb-chip { display:inline-flex; align-items:center; min-height:28px; padding:3px 9px; border:1px solid var(--line); border-radius:999px; color:var(--muted); background:color-mix(in srgb, var(--surface-2) 55%, transparent); font-size:.72rem; font-weight:850; text-decoration:none; }
.lb-chip.accent { border-color:color-mix(in srgb, var(--accent) 36%, transparent); color:var(--accent-soft); }

.lb-editorial { display:grid; gap:28px; align-items:start; }
.lb-editorial-copy { position:relative; }
.lb-editorial-copy p { color:var(--muted); }
.lb-panel { border:1px solid var(--line); border-radius:var(--radius-lg); background:linear-gradient(145deg, color-mix(in srgb, var(--surface-2) 86%, transparent), color-mix(in srgb, var(--surface) 78%, transparent)); box-shadow:var(--shadow); overflow:hidden; }
.lb-panel-pad { padding:24px; }
.lb-panel-label { color:var(--accent); font-size:.72rem; font-weight:950; letter-spacing:.1em; text-transform:uppercase; }
.lb-panel h3 { margin:5px 0 7px; }
.lb-panel p { margin:0; color:var(--muted); }
.lb-panel hr { border:0; border-top:1px solid var(--line); margin:20px 0; }

.lb-mosaic { display:grid; gap:12px; }
.lb-mosaic-item { min-height:180px; position:relative; padding:22px; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(145deg, color-mix(in srgb, var(--surface-2) 72%, transparent), color-mix(in srgb, var(--surface) 72%, transparent)); overflow:hidden; }
.lb-mosaic-item::after { content:""; position:absolute; width:130px; height:130px; right:-55px; bottom:-60px; border-radius:50%; background:radial-gradient(circle, color-mix(in srgb, var(--accent) 13%, transparent), transparent 66%); }
.lb-mosaic-item h3 { position:relative; z-index:1; margin:0 0 8px; }
.lb-mosaic-item p { position:relative; z-index:1; margin:0; color:var(--muted); }
.lb-mosaic-item .eyebrow { position:relative; z-index:1; display:block; margin-bottom:28px; color:var(--accent); font-size:.72rem; font-weight:950; text-transform:uppercase; letter-spacing:.1em; }

.lb-stepper { counter-reset:step; border-top:1px solid var(--line); }
.lb-step { counter-increment:step; display:grid; grid-template-columns:46px 1fr; gap:16px; padding:22px 0; border-bottom:1px solid var(--line); }
.lb-step::before { content:counter(step); width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:var(--accent); color:#041008; font-weight:950; }
.lb-step h3 { margin:0 0 5px; }
.lb-step p { margin:0; color:var(--muted); }

.lb-codebox { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; border:1px solid var(--line); border-radius:14px; background:var(--bg-deep); }
.lb-codebox code { overflow:hidden; text-overflow:ellipsis; color:var(--accent-soft); font-weight:800; }
.lb-copy-btn { flex:none; min-height:34px; padding:0 10px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface-2); color:var(--ink); font-size:.76rem; font-weight:900; cursor:pointer; }

.lb-tabs { display:flex; gap:6px; padding:5px; width:fit-content; max-width:100%; overflow:auto; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.lb-tab { min-height:38px; padding:0 13px; border:0; border-radius:10px; background:transparent; color:var(--muted); font-weight:900; white-space:nowrap; cursor:pointer; }
.lb-tab.active, .lb-tab[aria-selected="true"] { background:var(--surface-3); color:var(--ink); box-shadow:inset 0 0 0 1px var(--line); }
.lb-tab-panel[hidden] { display:none; }

.lb-disclosure { border-bottom:1px solid var(--line); }
.lb-disclosure:first-child { border-top:1px solid var(--line); }
.lb-disclosure button { width:100%; min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 0; border:0; background:transparent; color:var(--ink); text-align:left; font-weight:900; cursor:pointer; }
.lb-disclosure button::after { content:"+"; width:28px; height:28px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--accent); transition:transform .2s; }
.lb-disclosure button[aria-expanded="true"]::after { transform:rotate(45deg); }
.lb-disclosure-panel { padding:0 0 18px; color:var(--muted); }
.lb-disclosure-panel[hidden] { display:none; }

.lb-note { padding:16px 18px; border-left:3px solid var(--gold); border-radius:0 14px 14px 0; background:color-mix(in srgb, var(--gold) 7%, transparent); color:color-mix(in srgb, var(--gold) 78%, white); }
.lb-note strong { color:var(--ink); }
.lb-command { display:inline-flex; align-items:center; padding:2px 7px; border-radius:7px; background:var(--bg-deep); border:1px solid var(--line); color:var(--accent-soft); font-family:ui-monospace,monospace; font-size:.86em; }

.lb-topic-nav { display:flex; gap:8px; overflow:auto; padding-bottom:6px; scrollbar-width:thin; }
.lb-topic-nav button { min-height:40px; padding:0 12px; border:1px solid var(--line); border-radius:999px; background:transparent; color:var(--muted); font-weight:850; white-space:nowrap; cursor:pointer; }
.lb-topic-nav button.active { background:var(--surface-3); color:var(--ink); border-color:var(--line-strong); }
.lb-guide-topic { scroll-margin-top:102px; }
.lb-guide-topic[hidden] { display:none; }

.lb-recipe-list { display:grid; gap:14px; }
.lb-recipe { display:grid; gap:0; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--surface); }
.lb-recipe-media { min-height:180px; display:grid; place-items:center; padding:18px; background:radial-gradient(circle at center, color-mix(in srgb, var(--accent) 8%, transparent), transparent 60%); border-bottom:1px solid var(--line); }
.lb-recipe-media img { width:min(100%, 430px); image-rendering:pixelated; }
.lb-recipe-body { padding:20px; }
.lb-recipe-body h3 { margin:0 0 6px; }
.lb-recipe-body p { margin:0; color:var(--muted); }
.lb-recipe-meta { display:grid; grid-template-columns:auto 1fr; gap:7px 12px; margin:16px 0 0; font-size:.82rem; }
.lb-recipe-meta dt { color:var(--dim); font-weight:900; }
.lb-recipe-meta dd { margin:0; color:var(--ink); }
.lb-recipe.compact .lb-recipe-media { display:none; }

.lb-rules { counter-reset:rule; }
.lb-rule { counter-increment:rule; display:grid; grid-template-columns:54px 1fr; gap:16px; padding:25px 0; border-bottom:1px solid var(--line); }
.lb-rule:first-child { border-top:1px solid var(--line); }
.lb-rule::before { content:counter(rule, decimal-leading-zero); color:var(--accent); font-family:var(--font-display); font-size:1.5rem; }
.lb-rule h2 { margin:0 0 5px; font-size:1.1rem; }
.lb-rule p { margin:0; color:var(--muted); }

.lb-tier-stage { display:grid; gap:18px; }
.lb-tier-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.lb-tier-tab { min-height:72px; padding:10px; border:1px solid var(--line); border-radius:14px; background:var(--surface); color:var(--muted); cursor:pointer; text-align:left; }
.lb-tier-tab strong { display:block; color:var(--ink); font-size:.95rem; }
.lb-tier-tab span { font-size:.75rem; }
.lb-tier-tab.active { border-color:var(--accent); background:color-mix(in srgb, var(--accent) 9%, var(--surface)); }
.lb-tier-detail { padding:24px; border:1px solid var(--line); border-radius:var(--radius-lg); background:linear-gradient(145deg, var(--surface-2), var(--surface)); }
.lb-tier-detail-head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:14px; }
.lb-tier-price { font-family:var(--font-display); font-size:3rem; line-height:1; }
.lb-tier-price small { font-family:var(--font-sans); font-size:.75rem; color:var(--muted); }
.lb-cosmetic-grid { display:grid; gap:12px; margin-top:22px; }
.lb-cosmetic-group { padding-top:14px; border-top:1px solid var(--line); }
.lb-cosmetic-group h4 { margin:0 0 7px; font-size:.82rem; color:var(--accent-soft); text-transform:uppercase; letter-spacing:.08em; }
.lb-cosmetic-group p { margin:0; color:var(--muted); font-size:.9rem; }
.lb-tier-counts { overflow:auto; border-block:1px solid var(--line); }
.lb-tier-counts table { width:100%; min-width:640px; border-collapse:collapse; }
.lb-tier-counts th, .lb-tier-counts td { padding:13px 12px; border-bottom:1px solid var(--line); text-align:left; }
.lb-tier-counts th { color:var(--muted); font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; }
.lb-tier-counts td:first-child { font-weight:900; }

.lb-leaderboard-shell { display:grid; gap:18px; }
.lb-board-toolbar { display:grid; gap:12px; }
.lb-category-scroll { display:flex; gap:7px; overflow:auto; padding-bottom:4px; }
.lb-category-btn { min-height:38px; padding:0 11px; border:1px solid var(--line); border-radius:999px; background:transparent; color:var(--muted); white-space:nowrap; cursor:pointer; font-size:.78rem; font-weight:850; }
.lb-category-btn.active { color:var(--ink); background:var(--surface-3); border-color:var(--line-strong); }
.lb-rank-list { border-top:1px solid var(--line); }
.lb-rank-row { display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:12px; align-items:center; min-height:68px; border-bottom:1px solid var(--line); }
.lb-rank-number { font-family:var(--font-display); color:var(--dim); font-size:1.15rem; }
.lb-rank-row:nth-child(1) .lb-rank-number { color:var(--gold); }
.lb-rank-name { min-width:0; }
.lb-rank-name strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lb-rank-name small { color:var(--dim); }
.lb-rank-value { font-weight:900; color:var(--accent-soft); text-align:right; }
.lb-empty { padding:40px 0; color:var(--muted); text-align:center; }

.lb-account-hero { display:grid; gap:18px; }
.lb-account-grid { display:grid; gap:14px; }
.lb-profile-row { display:grid; gap:10px; padding:18px 0; border-bottom:1px solid var(--line); }
.lb-profile-row:first-child { border-top:1px solid var(--line); }
.lb-profile-row .label { color:var(--dim); font-size:.72rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.lb-profile-row .value { font-weight:900; overflow-wrap:anywhere; }
.lb-metric-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.lb-metric { min-height:92px; padding:15px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.lb-metric strong { display:block; font-size:1.35rem; }
.lb-metric span { color:var(--dim); font-size:.72rem; font-weight:850; }
.lb-progress { height:8px; margin-top:10px; border-radius:99px; overflow:hidden; background:var(--bg-deep); border:1px solid var(--line); }
.lb-progress > span { display:block; height:100%; background:linear-gradient(90deg,var(--accent-strong),var(--accent)); border-radius:99px; }

.lb-settings-page-grid { display:grid; gap:20px; }
.lb-setting-card { padding:22px 0; border-bottom:1px solid var(--line); }
.lb-setting-card:first-child { border-top:1px solid var(--line); }
.lb-setting-card h2 { margin:0 0 5px; font-size:1.1rem; }
.lb-setting-card p { margin:0 0 14px; color:var(--muted); }

.lb-site-footer { margin-top:36px; border-top:1px solid var(--line); background:color-mix(in srgb, var(--bg-deep) 78%, transparent); }
.lb-footer-grid { display:grid; gap:26px; padding:42px 0 28px; }
.lb-footer-about p { max-width:520px; margin:10px 0 0; color:var(--dim); font-size:.86rem; }
.lb-footer-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 18px; }
.lb-footer-nav a { color:var(--muted); font-size:.82rem; font-weight:800; text-decoration:none; }
.lb-footer-nav a:hover { color:var(--ink); }
.lb-footer-bottom { padding:18px 0 32px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 20px; color:var(--dim); font-size:.72rem; }

.lb-toast { position:fixed; z-index:250; left:50%; bottom:24px; transform:translate(-50%,18px); opacity:0; pointer-events:none; padding:11px 14px; border:1px solid var(--line-strong); border-radius:12px; background:var(--surface-3); color:var(--ink); font-weight:850; box-shadow:var(--shadow); transition:.2s ease; }
.lb-toast.show { opacity:1; transform:translate(-50%,0); }

.lb-leaf-field { position:fixed; z-index:1; inset:var(--header-h) 0 0; pointer-events:none; overflow:hidden; opacity:.46; }
.lb-floating-leaf { position:absolute; top:-40px; left:var(--x); width:var(--size); height:calc(var(--size) * .58); border-radius:100% 0 100% 0; background:color-mix(in srgb, var(--accent) 70%, var(--gold)); opacity:.24; transform:rotate(35deg); animation:leaf-fall var(--duration) linear var(--delay) infinite; filter:blur(.2px); }
@keyframes leaf-fall { 0% { transform:translate3d(0,-50px,0) rotate(20deg); opacity:0; } 8%{opacity:.26;} 55% { transform:translate3d(var(--drift),55vh,0) rotate(270deg); } 100% { transform:translate3d(calc(var(--drift) * -.55),110vh,0) rotate(540deg); opacity:0; } }
html[data-motion="reduced"] *, html[data-motion="reduced"] *::before, html[data-motion="reduced"] *::after { scroll-behavior:auto !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
html[data-motion="reduced"] .lb-leaf-field { display:none !important; }

@media (min-width: 640px) {
  .lb-container { width:min(1180px, calc(100% - 48px)); }
  .lb-narrow { width:min(820px, calc(100% - 48px)); }
  .lb-statline { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .lb-stat { border-right:1px solid var(--line); }
  .lb-stat:last-child { border-right:0; }
  .lb-mosaic { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .lb-recipe-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .lb-cosmetic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .lb-metric-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .lb-nav-status { display:flex; }
  .lb-account-link { display:inline-flex; }
}
@media (min-width: 900px) {
  .lb-section { padding:82px 0; }
  .lb-section-head.split { grid-template-columns:minmax(0,1fr) minmax(320px,.7fr); align-items:end; }
  .lb-editorial { grid-template-columns:minmax(0,1.05fr) minmax(340px,.75fr); gap:64px; }
  .lb-feature-row { grid-template-columns:52px minmax(0,1fr); align-items:start; gap:4px 18px; }
  .lb-feature-row h3 { margin:4px 0 0; }
  .lb-mosaic-item.featured { grid-column:span 2; min-height:230px; }
  .lb-footer-grid { grid-template-columns:1.2fr 1fr; }
  .lb-footer-nav { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .lb-tier-stage { grid-template-columns:220px minmax(0,1fr); align-items:start; }
  .lb-tier-tabs { grid-template-columns:1fr; position:sticky; top:100px; }
  .lb-account-grid { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:32px; }
}
@media (min-width: 1080px) {
  .lb-nav-links { display:flex; }
  .lb-menu-btn { display:none; }
  .lb-mosaic { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .lb-mosaic-item.featured { grid-column:span 2; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .lb-leaf-field { display:none !important; }
}
.lb-mt-8 { margin-top: 8px !important; }
.lb-mt-10 { margin-top: 10px !important; }
.lb-mt-16 { margin-top: 16px !important; }
.lb-mt-18 { margin-top: 18px !important; }
.lb-mt-22 { margin-top: 22px !important; }
.lb-mt-24 { margin-top: 24px !important; }
.lb-mt-28 { margin-top: 28px !important; }
.lb-mt-54 { margin-top: 54px !important; }
.lb-progress > span { width: 0; }