:root {
  color-scheme: light;
  --ink: #123733;
  --muted: #54706d;
  --paper: #f8fbf4;
  --card: rgba(255,255,255,.92);
  --soft: #e9f5e3;
  --line: #cfe1d7;
  --teal: #0f6f68;
  --teal-dark: #07514d;
  --mint: #78c79a;
  --gold: #f4bd55;
  --berry: #a13f61;
  --shadow: 0 14px 38px rgba(13,66,58,.12);
  --radius: 22px;
  font-family: Inter, ui-rounded, "Segoe UI", system-ui, -apple-system, sans-serif;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #eefcf6;
  --muted: #b7d0ca;
  --paper: #0a2527;
  --card: rgba(15,52,52,.94);
  --soft: #123f3c;
  --line: #32625d;
  --teal: #6bd1bc;
  --teal-dark: #a6ead8;
  --gold: #ffd17b;
  --berry: #f19ab6;
  --shadow: 0 14px 38px rgba(0,0,0,.28);
}

:root[data-theme="contrast"] {
  color-scheme: dark;
  --ink: #fff;
  --muted: #fff;
  --paper: #000;
  --card: #000;
  --soft: #111;
  --line: #fff;
  --teal: #54ffd1;
  --teal-dark: #54ffd1;
  --gold: #ffeb3b;
  --berry: #ff79aa;
  --shadow: none;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--paper); scroll-behavior: smooth; }
html[data-large-text="true"] { font-size: 112.5%; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: radial-gradient(circle at 85% 0, rgba(120,199,154,.22), transparent 30rem), var(--paper); }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: var(--teal-dark); text-underline-offset: .18em; }
img { max-width: 100%; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.skip-link { position: fixed; z-index: 9999; left: 1rem; top: -5rem; background: var(--ink); color: var(--paper); padding: .7rem 1rem; border-radius: 12px; }
.skip-link:focus { top: 1rem; }
.aurora { position: fixed; inset: 0 0 auto; height: 6px; z-index: 100; background: linear-gradient(90deg,#67d6ae,#9d86dc,#f3bc62,#67d6ae); background-size: 200% 100%; animation: aurora 12s linear infinite; }
@keyframes aurora { to { background-position: 200% 0; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
html[data-reduced-motion="true"] *,html[data-reduced-motion="true"] *::before,html[data-reduced-motion="true"] *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }

.site-header { min-height: 82px; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem clamp(1rem,4vw,3.2rem); border-bottom: 1px solid var(--line); background: color-mix(in srgb,var(--paper) 88%,transparent); backdrop-filter: blur(18px); position: sticky; top: 0; z-index: 40; }
.brand { display: flex; align-items: center; gap: .75rem; color: var(--ink); text-decoration: none; }
.brand img { width: 48px; filter: drop-shadow(0 5px 8px rgba(16,89,76,.18)); }
.brand strong { display: block; font-size: clamp(1rem,2.4vw,1.25rem); letter-spacing: -.025em; }
.brand small { display: block; margin-top: .15rem; color: var(--muted); font-weight: 600; font-size: .74rem; }
.header-tools { display: flex; gap: .65rem; align-items: center; }
.status-pill, .points-pill { border: 1px solid var(--line); background: var(--card); border-radius: 999px; display: inline-flex; align-items: center; box-shadow: 0 4px 14px rgba(13,66,58,.06); }
.status-pill { padding: .45rem .75rem; gap: .4rem; color: var(--muted); font-size: .78rem; font-weight: 700; }
.status-dot { width: .55rem; height: .55rem; border-radius: 99px; background: #e39b3d; }
.status-pill.online .status-dot { background: #2bac70; }
.status-pill.offline .status-dot { background: #e26e68; }
.points-pill { min-width: 108px; padding: .42rem .85rem; flex-direction: column; align-items: flex-end; line-height: 1.02; color:var(--ink); cursor:pointer; }
.points-pill:hover { border-color:var(--teal); box-shadow:0 7px 20px rgba(13,66,58,.13); }
.points-pill span { font-size: .65rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }
.points-pill strong { font-size: 1.25rem; font-variant-numeric: tabular-nums; color: var(--teal-dark); }

.tab-bar { display: flex; gap: .35rem; justify-content: center; padding: .7rem 1rem; position: sticky; top: 82px; z-index: 35; background: color-mix(in srgb,var(--paper) 88%,transparent); backdrop-filter: blur(16px); border-bottom: 1px solid var(--line); overflow-x: auto; }
.tab-bar button { min-height: 42px; border: 0; background: transparent; border-radius: 999px; padding: .55rem .9rem; white-space: nowrap; cursor: pointer; color: var(--muted); font-weight: 760; }
.tab-bar button:hover { background: var(--soft); color: var(--ink); }
.tab-bar button[aria-current="page"] { background: var(--teal); color: var(--paper); box-shadow: 0 6px 16px rgba(15,111,104,.2); }

main { width: min(1180px,calc(100% - 2rem)); margin: 0 auto; padding: clamp(1.25rem,4vw,3.5rem) 0 6rem; }
.guest-connect-banner { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:1rem 1.5rem; margin:0 0 1.25rem; padding:1rem 1.15rem; border:1px solid color-mix(in srgb,var(--gold) 62%,var(--line)); border-left:6px solid var(--gold); border-radius:18px; background:linear-gradient(120deg,color-mix(in srgb,var(--gold) 13%,var(--card)),var(--card)); box-shadow:0 8px 24px rgba(13,66,58,.07); }
.guest-banner-copy { min-width:0; }
.guest-banner-copy .eyebrow { margin-bottom:.2rem; }
.guest-connect-banner h2 { margin:0 0 .2rem; font-size:1.05rem; letter-spacing:-.02em; }
.guest-connect-banner p:not(.eyebrow) { margin:0; color:var(--muted); line-height:1.45; font-size:.86rem; }
.guest-banner-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:.55rem; }
.guest-banner-actions .button { white-space:nowrap; }
.guest-banner-actions .button.google b { font-weight:800; }
.view { animation: view-in .22s ease-out; }
@keyframes view-in { from { opacity: 0; transform: translateY(6px); } }
.hero { min-height: 310px; border-radius: 34px; padding: clamp(1.5rem,5vw,4rem); display: grid; grid-template-columns: minmax(0,1.3fr) minmax(240px,.7fr); gap: 2rem; align-items: center; color: #f6fff9; background: linear-gradient(135deg,#0c655f,#198475 58%,#49946c); box-shadow: var(--shadow); overflow: hidden; position: relative; }
.hero::before { content:""; position:absolute; width:360px; height:360px; border-radius:50%; right:-90px; top:-210px; border:52px solid rgba(255,255,255,.08); }
.hero h1, .page-intro h1 { margin: .2rem 0 .7rem; font-size: clamp(2rem,6vw,4rem); letter-spacing: -.055em; line-height: .98; }
.hero p:not(.eyebrow) { max-width: 650px; color: rgba(255,255,255,.85); font-size: 1.06rem; line-height: 1.55; }
.hero .hero-context { margin:.7rem 0 0; padding:.6rem .75rem; border-left:3px solid rgba(255,255,255,.65); background:rgba(0,0,0,.08); border-radius:0 12px 12px 0; font-size:.88rem; }
.eyebrow { color: var(--teal-dark); text-transform: uppercase; letter-spacing: .14em; font-size: .7rem; font-weight: 850; margin: 0 0 .4rem; }
.hero .eyebrow { color: #bfead2; }
.hero-actions, .modal-actions { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.35rem; }
.hero-art { min-height: 210px; position: relative; }
.mountain { position:absolute; bottom:-55px; width:260px; height:230px; transform:rotate(45deg); border-radius:42px; background:rgba(255,255,255,.13); }
.mountain-back { right:80px; bottom:-95px; }
.mountain-front { right:-25px; background:rgba(255,255,255,.19); }
.sprout { position:absolute; left:52%; bottom:32px; width:10px; height:86px; background:#f0d083; border-radius:99px; transform:rotate(-3deg); }
.sprout i,.sprout b { position:absolute; width:58px; height:32px; border-radius:100% 0 100% 0; background:#9ee5a8; }
.sprout i { left:-52px; top:12px; transform:rotate(18deg); }
.sprout b { left:6px; top:-8px; transform:scaleX(-1) rotate(18deg); }
.button { appearance:none; border:1px solid transparent; border-radius:14px; min-height:46px; padding:.7rem 1.05rem; font-weight:800; cursor:pointer; display:inline-flex; justify-content:center; align-items:center; gap:.5rem; text-decoration:none; transition:transform .15s ease,box-shadow .15s ease,background .15s ease; }
.button:hover:not(:disabled) { transform:translateY(-1px); }
.button:disabled { opacity:.5; cursor:not-allowed; }
.button.primary { color:#fff; background:var(--teal); box-shadow:0 8px 18px rgba(15,111,104,.2); }
.hero .button.primary { color:var(--teal-dark); background:#fff; }
.button.secondary { background:var(--soft); border-color:var(--line); color:var(--teal-dark); }
.hero .button.secondary { background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.28); color:#fff; }
.button.quiet { background:transparent; border-color:var(--line); }
.button.compact { min-height:38px; padding:.5rem .75rem; font-size:.85rem; }
.button.google { background:#fff; color:#263238; border-color:#cfd8dc; box-shadow:0 6px 16px rgba(0,0,0,.08); }
.button.google span { width:25px; height:25px; display:grid; place-items:center; border-radius:50%; color:#4285f4; font-size:1.05rem; }
.button.danger { color:#8f264b; border-color:#dba9b8; }

.notice { border:1px solid var(--line); background:var(--soft); color:var(--ink); border-radius:16px; padding:.8rem 1rem; margin:1rem 0; line-height:1.45; }
.notice.error { border-color:#e0a7a5; background:color-mix(in srgb,#f7d7d5 70%,var(--card)); }
.library-goal-preview { margin:1.2rem 0; }
.library-goal-card { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:1rem; padding:1.1rem 1.2rem; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(115deg,color-mix(in srgb,var(--mint) 16%,var(--card)),var(--card)); box-shadow:0 8px 24px rgba(13,66,58,.06); }
.library-goal-card h2 { margin:.1rem 0 .35rem; font-size:1.25rem; }
.library-goal-card p { margin:.2rem 0; color:var(--muted); line-height:1.45; }
.library-goal-progress { display:grid; grid-template-columns:minmax(120px,1fr) auto; align-items:center; gap:.7rem; margin-top:.7rem; font-size:.76rem; font-weight:800; color:var(--muted); }
.library-goal-card.completed { background:linear-gradient(115deg,color-mix(in srgb,var(--gold) 20%,var(--card)),var(--card)); }
.library-goal-card .goal-complete-mark { color:var(--teal-dark); font-weight:900; }
.garden-panel { display:grid; grid-template-columns:minmax(210px,.65fr) minmax(300px,1.35fr); gap:1rem 1.5rem; align-items:center; margin:1.2rem 0; padding:1.15rem 1.25rem; border:1px solid var(--line); border-radius:var(--radius); background:var(--card); box-shadow:0 8px 24px rgba(13,66,58,.06); overflow:hidden; }
.garden-copy h2 { margin:.1rem 0 .3rem; }
.garden-copy p:not(.eyebrow) { margin:0; color:var(--muted); line-height:1.45; font-size:.88rem; }
.garden-scene { position:relative; min-height:128px; border-radius:18px; overflow:hidden; background:linear-gradient(#bde7e0 0 48%,#dbe8cf 49% 73%,#7c9e72 74% 100%); isolation:isolate; }
.garden-scene::before { content:""; position:absolute; inset:10px 16px auto auto; width:54px; height:54px; border-radius:50%; background:#fff3b0; box-shadow:0 0 0 12px rgba(255,255,255,.2); }
.garden-scene::after { content:""; position:absolute; inset:auto 0 23px; height:25px; background:linear-gradient(150deg,transparent 18%,rgba(255,255,255,.75) 19% 31%,transparent 32%) 0 0/110px 100%; opacity:.65; }
.garden-item { position:absolute; bottom:17px; z-index:2; width:42px; height:62px; opacity:.2; filter:grayscale(1); transform:translateY(8px); transition:opacity .3s ease,filter .3s ease,transform .3s ease; }
.garden-item.unlocked { opacity:1; filter:none; transform:none; }
.garden-item::before,.garden-item::after { content:""; position:absolute; }
.garden-item[data-kind="sprout"] { left:8%; }
.garden-item[data-kind="sprout"]::before { left:19px; bottom:0; width:5px; height:48px; border-radius:9px; background:#426f45; }
.garden-item[data-kind="sprout"]::after { left:3px; bottom:25px; width:36px; height:18px; border-radius:100% 0 100% 0; background:#65aa68; transform:rotate(9deg); }
.garden-item[data-kind="flower"] { left:27%; }
.garden-item[data-kind="flower"]::before { left:19px; bottom:0; width:5px; height:43px; background:#3f7a4e; border-radius:8px; }
.garden-item[data-kind="flower"]::after { left:6px; bottom:34px; width:31px; height:31px; border-radius:50%; background:radial-gradient(circle,#f7c857 0 20%,#d15a7b 21% 42%,transparent 43%),conic-gradient(from 0deg,#f29cbc,#e65f8d,#f5b2c8,#e65f8d,#f29cbc); }
.garden-item[data-kind="bush"] { left:46%; width:62px; }
.garden-item[data-kind="bush"]::before { inset:15px 0 0; border-radius:50% 50% 30% 30%; background:radial-gradient(circle at 25% 35%,#b43155 0 5%,transparent 6%),radial-gradient(circle at 62% 24%,#b43155 0 5%,transparent 6%),radial-gradient(circle at 74% 52%,#b43155 0 5%,transparent 6%),#4b8a58; }
.garden-item[data-kind="fireweed"] { left:67%; height:82px; }
.garden-item[data-kind="fireweed"]::before { left:20px; bottom:0; width:4px; height:72px; background:#3e794a; }
.garden-item[data-kind="fireweed"]::after { left:6px; bottom:28px; width:32px; height:47px; background:radial-gradient(circle,#d55386 0 35%,transparent 38%) 0 0/15px 15px; }
.garden-item[data-kind="star"] { right:6%; bottom:47px; width:48px; height:48px; }
.garden-item[data-kind="star"]::before { inset:0; background:#fff; clip-path:polygon(50% 0,58% 38%,100% 50%,58% 62%,50% 100%,42% 62%,0 50%,42% 38%); filter:drop-shadow(0 0 5px #fff); }
.garden-progress { grid-column:1/-1; display:grid; grid-template-columns:minmax(120px,1fr) auto; gap:.7rem; align-items:center; color:var(--muted); font-size:.76rem; }
.garden-progress .progress-track span { width:0; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin:2.5rem 0 1.1rem; }
.section-heading h2,.page-intro h1 { margin:.12rem 0; }
.search-label,label { font-weight:750; color:var(--ink); }
.search-label { font-size:.78rem; color:var(--muted); }
input,select { width:100%; min-height:44px; margin-top:.3rem; border:1px solid var(--line); border-radius:12px; background:var(--card); color:var(--ink); padding:.64rem .75rem; }
textarea { width:100%; margin-top:.3rem; resize:vertical; border:1px solid var(--line); border-radius:12px; background:var(--card); color:var(--ink); padding:.64rem .75rem; font:inherit; }
.search-label input { width:min(310px,70vw); }
.discovery-chips { display:flex; gap:.5rem; overflow-x:auto; padding:.1rem 0 .9rem; scrollbar-width:thin; }
.discovery-chips button { flex:0 0 auto; min-height:38px; padding:.45rem .75rem; border:1px solid var(--line); border-radius:999px; background:var(--card); color:var(--muted); cursor:pointer; font-weight:800; }
.discovery-chips button:hover { border-color:var(--teal); color:var(--ink); }
.discovery-chips button[aria-pressed="true"] { color:#fff; background:var(--teal); border-color:var(--teal); }
.game-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.1rem; }
.game-card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:0 8px 26px rgba(13,66,58,.07); display:flex; flex-direction:column; min-width:0; }
.game-card:hover { box-shadow:var(--shadow); }
.game-thumb { height:175px; background:linear-gradient(145deg,var(--soft),color-mix(in srgb,var(--mint) 30%,var(--card))); position:relative; overflow:hidden; }
.game-thumb img { width:100%; height:100%; object-fit:cover; }
.game-thumb .fallback-icon { height:100%; display:grid; place-items:center; font-size:4rem; color:var(--teal); }
.type-chip { position:absolute; top:.75rem; left:.75rem; padding:.3rem .6rem; border-radius:999px; color:#fff; background:rgba(8,63,59,.82); backdrop-filter:blur(8px); font-size:.7rem; font-weight:800; }
.game-card-body { padding:1.05rem; display:flex; flex:1; flex-direction:column; }
.game-card h3 { font-size:1.22rem; letter-spacing:-.025em; margin:0 0 .35rem; }
.game-card p { color:var(--muted); font-size:.88rem; line-height:1.48; margin:0 0 1rem; flex:1; }
.game-card .game-detail-line { display:flex; flex:0 0 auto; flex-wrap:wrap; gap:.35rem .75rem; margin:-.05rem 0 .55rem; color:var(--accent-strong); font-size:.76rem; font-weight:750; }
.game-card .game-detail-line span + span::before { content:"·"; margin-right:.75rem; color:var(--muted); }
.game-progress-row { display:grid; gap:.4rem; margin:.1rem 0 .65rem; }
.game-progress-row .progress-track { height:8px; }
.game-progress-row>span { display:flex; justify-content:space-between; gap:.5rem; color:var(--muted); font-size:.72rem; }
.game-best { font-weight:750; color:var(--teal-dark) !important; }
.game-meta { display:flex; justify-content:space-between; gap:.5rem; align-items:center; font-size:.76rem; color:var(--muted); }
.game-card-actions { display:flex; gap:.4rem; align-items:center; }
.read-game-button { width:40px; min-height:40px; padding:0; border-radius:12px; }
.game-meta .button { min-height:40px; }

.page-intro { max-width:820px; margin-bottom:2rem; }
.page-intro>p:not(.eyebrow) { color:var(--muted); line-height:1.55; font-size:1.05rem; }
.split-intro { max-width:none; display:flex; align-items:end; justify-content:space-between; gap:2rem; }
.no-prizes { display:flex; flex-direction:column; flex:0 0 280px; padding:1rem; background:var(--soft); border:1px solid var(--line); border-radius:16px; }
.no-prizes strong { color:var(--berry); }
.no-prizes span { color:var(--muted); font-size:.82rem; line-height:1.4; }
.goal-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.goal-card,.panel,.leaderboard-card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 8px 24px rgba(13,66,58,.06); }
.goal-card { padding:1.25rem; }
.goal-card header { display:flex; align-items:start; justify-content:space-between; gap:1rem; }
.goal-card h2 { margin:0; font-size:1.2rem; }
.goal-card p { color:var(--muted); line-height:1.5; }
.goal-bonus { color:var(--teal-dark); background:var(--soft); border-radius:999px; padding:.35rem .6rem; white-space:nowrap; font-size:.74rem; font-weight:850; }
.progress-track { height:12px; border-radius:99px; overflow:hidden; background:var(--soft); border:1px solid var(--line); }
.progress-track span { display:block; height:100%; background:linear-gradient(90deg,var(--teal),var(--mint)); border-radius:inherit; }
.goal-progress { width:100%; height:13px; appearance:none; border:1px solid var(--line); border-radius:99px; overflow:hidden; background:var(--soft); }
.goal-progress::-webkit-progress-bar { background:var(--soft); }
.goal-progress::-webkit-progress-value { background:linear-gradient(90deg,var(--teal),var(--mint)); border-radius:99px; }
.goal-progress::-moz-progress-bar { background:linear-gradient(90deg,var(--teal),var(--mint)); border-radius:99px; }
.goal-foot { display:flex; justify-content:space-between; margin-top:.55rem; color:var(--muted); font-size:.78rem; }
.goal-actions { display:flex; justify-content:flex-end; margin-top:.9rem; }
.goal-card.completed { border-color:color-mix(in srgb,var(--gold) 65%,var(--line)); background:linear-gradient(145deg,color-mix(in srgb,var(--gold) 12%,var(--card)),var(--card)); }
.goal-card.completed .goal-bonus { color:var(--ink); background:color-mix(in srgb,var(--gold) 30%,var(--soft)); }
.empty-state { text-align:center; padding:2.5rem; background:var(--card); border:1px dashed var(--line); border-radius:var(--radius); color:var(--muted); }
.filter-bar { display:flex; gap:.8rem; align-items:end; flex-wrap:wrap; margin-bottom:1rem; }
.filter-bar label { min-width:170px; color:var(--muted); font-size:.74rem; }
.ranking-guide { display:flex; justify-content:space-between; gap:1rem; margin:.2rem 0 1rem; color:var(--muted); font-size:.78rem; }
.ranking-guide p { margin:0; }
.ranking-summary { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin:0 0 1rem; padding:1rem 1.1rem; border:1px solid color-mix(in srgb,var(--gold) 60%,var(--line)); border-radius:18px; background:color-mix(in srgb,var(--gold) 12%,var(--card)); }
.ranking-summary strong { font-size:1.2rem; color:var(--teal-dark); }
.ranking-summary p { margin:.2rem 0 0; color:var(--muted); font-size:.8rem; }
.ranking-nearby { margin:0 0 1rem; border:1px solid var(--line); border-radius:18px; overflow:hidden; background:var(--card); }
.ranking-nearby h2 { margin:0; padding:.7rem 1rem; background:var(--soft); font-size:.9rem; }
.compact-leaderboard li { min-height:44px; padding:.55rem 1rem; }
.leaderboard-card { overflow:hidden; }
.leaderboard-head,.leaderboard li { display:grid; grid-template-columns:70px minmax(0,1fr) minmax(100px,180px); align-items:center; gap:.7rem; }
.leaderboard-head { padding:.75rem 1.1rem; color:var(--muted); background:var(--soft); font-size:.7rem; text-transform:uppercase; letter-spacing:.09em; font-weight:850; }
.leaderboard-head span:last-child,.leaderboard li strong { text-align:right; }
.leaderboard { list-style:none; padding:0; margin:0; }
.leaderboard li { padding:.9rem 1.1rem; border-top:1px solid var(--line); }
.leaderboard li.current { background:color-mix(in srgb,var(--gold) 15%,var(--card)); }
.rank-number { font-weight:900; color:var(--teal-dark); font-variant-numeric:tabular-nums; }
.alias { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.leaderboard .verification { display:inline-block; margin-left:.4rem; font-size:.62rem; color:var(--muted); font-weight:600; }
.leaderboard-card>.button { margin:1rem; }

.settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.panel { padding:1.25rem; }
.panel h2,.panel h3 { margin-top:0; }
.panel p { color:var(--muted); line-height:1.5; }
.switch-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.switch-row+.switch-row { margin-top:1rem; }
.switch-row span { display:flex; flex-direction:column; }
.switch-row small { color:var(--muted); font-weight:500; }
.switch-row input { width:52px; height:28px; accent-color:var(--teal); }
.choice-row { border:0; padding:0; margin:1.5rem 0 0; }
.choice-row legend { font-weight:800; margin-bottom:.5rem; }
.choice-row button { border:1px solid var(--line); background:var(--card); border-radius:12px; padding:.55rem .7rem; margin:.2rem; cursor:pointer; }
.choice-row button.selected { background:var(--teal); color:var(--paper); border-color:var(--teal); }
.offline-scope-label { display:block; margin:.9rem 0; color:var(--muted); font-size:.78rem; }
.detail-list { margin:0; }
.detail-list div { display:flex; justify-content:space-between; border-bottom:1px solid var(--line); padding:.65rem 0; }
.detail-list dt { color:var(--muted); }
.detail-list dd { margin:0; font-weight:800; }
.link-list { padding-left:1.2rem; line-height:2; }
.small-status,.fine-print { color:var(--muted); font-size:.76rem; line-height:1.45; }

.accent-panel { display:flex; align-items:center; justify-content:space-between; gap:2rem; margin-bottom:1rem; background:linear-gradient(120deg,var(--soft),var(--card)); }
.inline-form { display:flex; align-items:end; gap:.65rem; flex-wrap:wrap; }
.inline-form label { min-width:220px; flex:1; font-size:.78rem; color:var(--muted); }
.parent-signin { display:flex; justify-content:space-between; align-items:center; gap:2rem; }
.check-list { list-style:"✓  "; color:var(--muted); padding-left:1.3rem; }
.check-list li::marker { color:var(--teal); font-weight:900; }
.dashboard-head { display:flex; align-items:center; justify-content:space-between; margin:1.2rem 0; }
.dashboard-head h2 { margin:0; }
.parent-setup { display:grid; grid-template-columns:minmax(230px,.7fr) minmax(320px,1.3fr); gap:1.4rem; align-items:center; margin-bottom:1rem; border-left:6px solid var(--gold); }
.parent-setup h3 { margin:.1rem 0 .25rem; }
.parent-setup p:not(.eyebrow) { margin:.2rem 0; }
.setup-checklist { list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; margin:0; padding:0; counter-reset:setup; }
.setup-checklist li { position:relative; min-height:44px; padding:.65rem .65rem .65rem 2.5rem; border:1px solid var(--line); border-radius:13px; background:var(--soft); font-size:.79rem; font-weight:750; }
.setup-checklist li::before { counter-increment:setup; content:counter(setup); position:absolute; left:.65rem; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:1.35rem; height:1.35rem; border:1px solid var(--line); border-radius:50%; background:var(--card); color:var(--muted); }
.setup-checklist li.done::before { content:"✓"; color:#fff; background:var(--teal); border-color:var(--teal); }
.parent-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(250px,.8fr); gap:1rem; }
.kid-list { display:grid; gap:1rem; margin-top:1rem; }
.kid-card { padding:1.1rem; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); }
.kid-card.active-kid { border:2px solid var(--teal); box-shadow:0 9px 25px rgba(15,111,104,.12); }
.active-device-badge { display:inline-flex; margin-top:.45rem; padding:.27rem .5rem; border-radius:999px; background:var(--teal); color:#fff; font-size:.68rem; font-weight:850; }
.kid-card header { display:flex; align-items:start; justify-content:space-between; gap:1rem; }
.kid-card h3 { margin:0; }
.kid-card .alias-line { color:var(--muted); font-size:.8rem; margin:.2rem 0; }
.kid-actions { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.kid-actions .button { min-height:39px; font-size:.77rem; padding:.48rem .7rem; }
.visibility-control { display:flex; justify-content:space-between; gap:1rem; align-items:center; background:var(--soft); border-radius:14px; padding:.7rem .8rem; margin-top:.8rem; }
.visibility-control input { width:24px; height:24px; accent-color:var(--teal); }
.device-list { list-style:none; margin:.7rem 0 0; padding:0; }
.device-list li { display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); padding:.55rem 0; font-size:.78rem; }
.family-tools { align-self:start; position:sticky; top:160px; }
.family-tools .button { width:100%; margin:.3rem 0; }
.family-tools hr { border:0; border-top:1px solid var(--line); margin:1rem 0; }
.owner-panel { margin-top:2.5rem; padding-top:1.5rem; border-top:3px solid var(--teal); }
.owner-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.75fr); gap:1rem; }
.owner-tools { display:grid; align-content:start; gap:1rem; }
.stack-form { display:grid; gap:.8rem; }
.stack-form label { color:var(--muted); font-size:.78rem; }
.form-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; }
.owner-drafts { display:grid; gap:.7rem; margin-top:1.2rem; }
.owner-draft { border:1px solid var(--line); background:var(--soft); border-radius:14px; padding:.8rem; }
.owner-draft header { display:flex; justify-content:space-between; align-items:start; gap:.7rem; }
.owner-draft h4 { margin:0; }
.owner-draft p { margin:.35rem 0; font-size:.8rem; }

.game-view { position:fixed; inset:0; z-index:200; background:#071b1c; display:grid; grid-template-rows:62px minmax(0,1fr); }
.game-view>header { display:flex; align-items:center; gap:1rem; padding:.55rem 1rem; color:#f5fffb; background:#0b3735; }
.game-view>header>div { display:flex; flex:1; min-width:0; flex-direction:column; }
.game-view>header span { color:#b8d9d3; font-size:.72rem; }
.game-view .button.quiet { border-color:#537975; color:#fff; }
.mini-points { color:#fff !important; font-weight:900; }
.game-view iframe { width:100%; height:100%; border:0; background:#fff; }
.game-loading { position:absolute; inset:62px 0 0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#eefcf6; background:#0b2b2c; gap:.55rem; }
.game-loading img { width:90px; animation:float 1.8s ease-in-out infinite; }
@keyframes float { 50% { transform:translateY(-8px); } }
.game-loading span { color:#b8d9d3; }

dialog { color:var(--ink); }
.modal { width:min(560px,calc(100% - 2rem)); max-height:calc(100vh - 2rem); overflow:auto; border:1px solid var(--line); border-radius:26px; padding:1.5rem; background:var(--card); box-shadow:0 30px 90px rgba(0,0,0,.28); }
.modal::backdrop { background:rgba(3,24,24,.66); backdrop-filter:blur(5px); }
.modal h2 { margin:.2rem 2rem .7rem 0; font-size:1.6rem; }
.close-button { position:absolute; right:1rem; top:1rem; }
.icon-button { width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; background:transparent; cursor:pointer; font-size:1.4rem; }
.guest-connect-modal { width:min(660px,calc(100% - 2rem)); }
.guest-connect-modal>p:not(.eyebrow) { color:var(--muted); line-height:1.55; }
.guest-google-button { width:100%; margin-top:.55rem; }
.guest-choice-divider { display:flex; align-items:center; gap:.7rem; margin:1rem 0; color:var(--muted); font-size:.75rem; font-weight:850; text-transform:uppercase; letter-spacing:.1em; }
.guest-choice-divider::before,.guest-choice-divider::after { content:""; flex:1; height:1px; background:var(--line); }
.guest-pair-form label { display:block; font-size:.82rem; color:var(--ink); }
.guest-pair-row { display:grid; grid-template-columns:minmax(150px,1fr) auto; align-items:end; gap:.6rem; margin-top:.25rem; }
.guest-pair-row input { margin:0; text-transform:uppercase; letter-spacing:.12em; font-weight:850; }
.guest-pair-form small { display:block; margin-top:.4rem; color:var(--muted); line-height:1.4; }
.guest-anonymous-choice { margin-top:1.15rem; padding:1rem; border:1px solid var(--line); border-radius:16px; background:var(--soft); }
.guest-anonymous-choice .button { width:100%; }
.guest-anonymous-choice p { margin:.75rem 0 0; color:var(--muted); font-size:.9rem; line-height:1.5; }
.big-award { font-size:3.2rem; line-height:1; font-weight:950; color:var(--teal-dark); }
.result-highlights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.55rem; margin:1rem 0; }
.result-highlight { padding:.72rem; border:1px solid var(--line); border-radius:14px; background:var(--card); }
.result-highlight strong { display:block; color:var(--teal-dark); font-size:1.05rem; }
.result-highlight span { display:block; margin-top:.2rem; color:var(--muted); font-size:.72rem; line-height:1.35; }
.result-details { background:var(--soft); padding:.8rem; border-radius:14px; font-size:.84rem; }
.result-actions .button { flex:1 1 190px; }
.points-breakdown { display:grid; gap:.7rem; margin:1rem 0; }
.points-breakdown div { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.2rem 1rem; padding:.85rem; border:1px solid var(--line); border-radius:14px; background:var(--soft); }
.points-breakdown dt { font-weight:850; }
.points-breakdown dd { margin:0; color:var(--teal-dark); font-size:1.15rem; font-weight:950; }
.points-breakdown small { grid-column:1/-1; color:var(--muted); line-height:1.4; }
.merge-preview { background:var(--soft); border-radius:14px; padding:1rem; }
.merge-preview dl { margin:0; display:grid; grid-template-columns:1fr auto; gap:.5rem; }
.merge-preview dd { margin:0; font-weight:900; }
.confirm-row { display:flex; gap:.6rem; align-items:start; margin:1rem 0; line-height:1.4; }
.confirm-row input { flex:0 0 auto; width:22px; height:22px; margin:0; accent-color:var(--teal); }
.pair-code { letter-spacing:.24em; font-size:2.2rem; font-weight:950; text-align:center; color:var(--teal-dark); background:var(--soft); border-radius:16px; padding:1rem; font-variant-numeric:tabular-nums; }
.pair-qr { width:220px; height:220px; display:block; margin:1rem auto; border:10px solid #fff; border-radius:10px; }
.pair-link { overflow-wrap:anywhere; text-align:center; }
.pending-pair { margin-top:1rem; border-top:1px solid var(--line); padding-top:1rem; }
.toast { position:fixed; z-index:400; bottom:1rem; left:50%; transform:translateX(-50%); max-width:min(520px,calc(100% - 2rem)); background:var(--ink); color:var(--paper); box-shadow:var(--shadow); padding:.8rem 1rem; border-radius:14px; }
.noscript { position:fixed; inset:auto 1rem 1rem; z-index:999; padding:1rem; background:#801f32; color:white; border-radius:12px; }

.legal-shell { width:min(800px,calc(100% - 2rem)); margin:0 auto; padding:2rem 0 5rem; }
.legal-shell header { margin-bottom:2rem; }
.legal-shell .brand { display:inline-flex; }
.legal-card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(1.2rem,4vw,2.5rem); box-shadow:var(--shadow); line-height:1.65; }
.legal-card h1 { font-size:clamp(2rem,6vw,3.3rem); line-height:1; letter-spacing:-.05em; }
.legal-card h2 { margin-top:2rem; }
.legal-card .updated { color:var(--muted); }

@media (max-width:850px) {
  .game-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero { grid-template-columns:1fr; }
  .hero-art { display:none; }
  .guest-connect-banner { grid-template-columns:1fr; align-items:stretch; }
  .guest-banner-actions { justify-content:flex-start; }
  .garden-panel,.parent-setup { grid-template-columns:1fr; }
  .garden-progress { grid-column:auto; }
  .parent-layout { grid-template-columns:1fr; }
  .owner-grid { grid-template-columns:1fr; }
  .family-tools { position:static; }
  .split-intro,.parent-signin,.accent-panel { align-items:stretch; flex-direction:column; }
  .no-prizes { flex:auto; }
}

@media (max-width:620px) {
  body { padding-bottom:70px; }
  .site-header { min-height:72px; padding:.75rem; top:0; }
  .brand img { width:40px; }
  .brand small,.status-pill,#installButton { display:none; }
  .points-pill { min-width:86px; }
  .tab-bar { position:fixed; inset:auto 0 0; top:auto; z-index:100; justify-content:space-around; padding:.38rem max(.35rem,env(safe-area-inset-right)) calc(.38rem + env(safe-area-inset-bottom)) max(.35rem,env(safe-area-inset-left)); background:var(--card); box-shadow:0 -8px 28px rgba(13,66,58,.12); }
  .tab-bar button { display:flex; flex-direction:column; gap:.1rem; align-items:center; min-width:62px; padding:.35rem .25rem; font-size:.63rem; }
  .tab-bar button span { font-size:1rem; }
  main { width:min(100% - 1rem,1180px); padding-top:.75rem; padding-bottom:2rem; }
  .hero { min-height:0; border-radius:24px; padding:1.35rem; }
  .hero h1 { font-size:2.25rem; }
  .section-heading { align-items:stretch; flex-direction:column; }
  .library-goal-card { grid-template-columns:1fr; }
  .library-goal-card>.button { width:100%; }
  .garden-scene { min-height:112px; }
  .garden-progress { grid-template-columns:1fr; }
  .search-label input { width:100%; }
  .game-grid,.goal-grid,.settings-grid { grid-template-columns:1fr; }
  .game-card { flex-direction:row; }
  .game-thumb { flex:0 0 120px; height:auto; min-height:170px; }
  .game-card-body { min-width:0; }
  .game-card p { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .filter-bar label { min-width:calc(50% - .5rem); flex:1; }
  .ranking-guide { flex-direction:column; gap:.3rem; }
  .ranking-summary { align-items:flex-start; flex-direction:column; }
  .leaderboard-head,.leaderboard li { grid-template-columns:45px minmax(0,1fr) 88px; padding-left:.65rem; padding-right:.65rem; }
  .verification { display:none !important; }
  .accent-panel,.parent-signin { padding:1rem; }
  .inline-form,.inline-form label,.inline-form .button { width:100%; }
  .guest-banner-actions,.guest-banner-actions .button { width:100%; }
  .guest-pair-row { grid-template-columns:1fr; }
  .guest-pair-row .button { width:100%; }
  .form-pair { grid-template-columns:1fr; }
  .setup-checklist { grid-template-columns:1fr; }
  .result-highlights { grid-template-columns:1fr; }
  .game-view { grid-template-rows:56px minmax(0,1fr); }
  .game-loading { inset:56px 0 0; }
}

@media (max-width:390px) {
  .brand strong { font-size:.92rem; }
  .game-card { display:block; }
  .game-thumb { height:150px; }
  .tab-bar button { min-width:54px; font-size:.57rem; }
}