/* Shared RankBlob foundations. Loaded after each page's structural styles. */
@font-face { font-family: Geist; src: url('./fonts/geist-regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: Geist; src: url('./fonts/geist-semibold.woff2') format('woff2'); font-weight: 600 900; font-display: swap; }
:root { --ink:#242923; --muted:#62665d; --faint:#73776d; --line:#dedfd5; --bg:#faf9f5; --card:#fffefa; --brand:#1a56db; --brand-dark:#1443ad; --shadow:0 12px 36px rgba(44,49,35,.06); --good-bg:#e5edda; --good:#34512c; --mid-bg:#e9eef9; --low-bg:#eeeee7; --low:#62665d; --ease-out:cubic-bezier(.23,1,.32,1); }
body { font-family:Geist,-apple-system,'Segoe UI',sans-serif; background:var(--bg); color:var(--ink); -webkit-font-smoothing:antialiased; line-height:1.6; }
button,input,textarea,select { font-family:inherit; }
nav { min-height:78px; border-bottom:1px solid var(--line); background:rgba(250,249,245,.95); }
nav .logo { font-weight:600; font-size:22px; letter-spacing:-.04em; }
nav .links a { font-size:13px; }
nav .links a.cta,.btn { box-shadow:none; }
.navcheck input { width:160px; }
:where(h1,h2,h3,h4) { text-wrap:balance; }
h1 { font-weight:600; letter-spacing:-.045em; line-height:1.1; }
h2,h3 { font-weight:600; letter-spacing:-.03em; }
body:not(.home) h1 { font-size:clamp(32px,4.5vw,48px); }
body:not(.home) .wrap { max-width:1080px; padding-inline:28px; }
body:not(.home) .hero { text-align:left; padding:48px 0 20px; }
body:not(.home) .hero p { margin-left:0; max-width:660px; font-size:17px; }
.lede { line-height:1.7; }
.btn { border-radius:9px; font-size:14px; }
:where(.card,.board,.profile,.contrast,.vs,.lcard,.lvideo,.tier-card,.tbl-wrap,.tbl-wrap-mini,.tl-card,.bars,.more a,.faq details) { box-shadow:none; border-color:var(--line); }
body:not(.home) :is(.card,.board,.profile,.lvideo,.tl-card,.bars) { border-radius:20px; }
body:not(.home) :is(.step,.lcard) { background:var(--card); border-radius:16px; }
body:not(.home) .band { background:#eef0e5; border-color:#dce0ce; border-radius:24px; }
body:not(.home) .band .blobs img { width:64px; height:64px; border-radius:20px; box-shadow:none; }
body:not(.home) :is(.methods,.fact,.kf) { background:#eef0e5; border-color:#d8decb; color:var(--ink); }
body:not(.home) .methods .m-h { color:#34512c; }
table thead th { background:#f1f1e9; }
:where(table.cmp,table.cmp-mini) td.us { background:#f0f3ed; }
footer { color:var(--muted); }
:focus-visible { outline:3px solid var(--brand); outline-offset:4px; }
.site-mascot { float:right; width:100px; height:100px; object-fit:contain; border-radius:26px; margin:32px 0 18px 28px; border:5px solid var(--card); transform:rotate(5deg); }
/* Long reads retain their source material and a comfortable reading measure. */
.article-page .post,.document-page .doc { max-width:760px; margin-inline:auto; }
.article-page .post > p,.document-page .doc > p { line-height:1.8; }
.article-page .post h2,.document-page .doc h2 { margin-top:42px; }
.article-page .post > h1 { max-width:720px; }
.article-page .eyebrow { color:var(--muted); font-weight:600; font-size:11px; }
.article-page .tl-card.today { border-width:1px; background:#f0f3e9; }
.article-page .tl-title { font-weight:600; }
/* The checker keeps the same controls and report structure. */
.tool-page header.brand { align-items:center; gap:14px; padding-bottom:18px; border-bottom:1px solid var(--line); margin-bottom:20px; }
.tool-page header.brand .logo { font-size:26px; font-weight:600; }
.tool-page .logo a { color:inherit; text-decoration:none; }
.tool-page .sub { max-width:580px; font-size:16px; margin-bottom:28px; }
.tool-page .card { padding:28px; }
.tool-page input,.tool-page textarea,.tool-page select { background:var(--card); border-color:#d3d7ca; border-radius:10px; line-height:1.5; }
.tool-page .selected { background:#eef0e5; border-color:#dce0ce; }
.tool-page section.kw { border-radius:18px; padding:24px; }
.tool-page .hint { line-height:1.6; }
.tool-page .pick { background:var(--card); }
/* A shelf of guides, with real app artwork and concise previews. */
.guides-page a.post { display:block; padding:24px 24px 24px 116px; position:relative; min-height:155px; border-radius:20px; box-shadow:none; }
.guides-page a.post .post-art { position:absolute; left:24px; top:28px; width:66px; height:66px; object-fit:cover; border-radius:18px; transform:rotate(-5deg); }
.guides-page a.post:nth-of-type(3n+1) { background:#eef0e5; }
.guides-page a.post:nth-of-type(3n+2) { background:#f4ece0; }
.guides-page a.post .kind { font-size:10px; font-weight:600; color:var(--muted); }
.guides-page a.post h2 { font-size:22px; margin-top:6px; }
.guides-page a.post p { font-size:14px; line-height:1.7; }
.guides-page a.post .date { font-size:11px; }
.library-page .lvideo { background:#eef0e5; padding:24px; }
.library-page .lv-title { font-weight:600; font-size:25px; }
.library-page .lv-kind { color:var(--muted); font-size:10px; }
.library-page .lcard { border:0; border-top:1px solid var(--line); border-radius:0; background:transparent; padding:22px 0; }
.library-page .learn-grid { gap:24px; }
/* The homepage's two interactive examples are a single hands-on section. */
.playground { margin-top:70px; }
.playground > h2.sec { margin-top:0; }
.playground-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:start; }
.playground .race,.playground .demo { max-width:none; margin:0; min-width:0; border-radius:22px; box-shadow:none; padding:26px; animation:none; }
.playground .race { background:#f0f3e9; --who:132px; }
.playground .demo { background:var(--card); }
.playground .race-eyebrow { font-size:11px; text-transform:none; letter-spacing:0; font-weight:400; color:var(--muted); }
.playground .race-kw { font-size:28px; font-weight:600; letter-spacing:-.045em; margin:8px 0; }
.playground .race-sub { font-size:13px; margin-bottom:20px; }
.playground .race-lane { padding:12px 0; }
.playground .race-name { font-size:13px; }
.playground .race-ico,.playground .race-tile { width:32px; height:32px; border-radius:9px; }
.playground .race-marker { font-size:12px; min-width:44px; padding-inline:7px; }
.playground .race-dots { flex-wrap:wrap; justify-content:flex-start; margin-top:20px; gap:6px; }
.playground .race-dot { width:auto; height:auto; min-height:30px; padding:5px 9px; font:inherit; font-size:11px; color:var(--muted); background:var(--card); border:1px solid var(--line); }
.playground .race-dot[aria-current="true"] { color:#fff; background:var(--ink); border-color:var(--ink); }
.playground .race-cap,.playground .ex-cap { font-size:11px; line-height:1.7; }
.playground .demo .ex-head { border-bottom:1px solid var(--line); padding-bottom:20px; margin-bottom:18px; }
.playground .demo .ex-app { font-size:23px; font-weight:600; letter-spacing:-.04em; }
.playground .demo .ex-meta { font-size:12px; }
.playground .demo .appicon { width:52px; height:52px; border-radius:15px; }
.playground .chips { border:1px solid var(--line); border-radius:12px; padding:4px; gap:4px; background:#f3f2ec; }
.playground .chip { flex:1; padding:8px 5px; border-color:transparent; border-radius:8px; font-size:12px; background:transparent; }
.playground .chip[aria-pressed="true"] { background:var(--card); border-color:var(--line); color:var(--ink); }
.playground .demo td { padding:16px 2px; font-size:14px; }
.playground .demo .pill { font-size:12px; }
.playground .demo-err { font-size:12px; }
.race-pause { font:inherit; font-size:11px; background:transparent; color:var(--muted); border:0; border-bottom:1px solid var(--line); padding:5px 0; cursor:pointer; margin-top:10px; }
@media (max-width:900px) { .playground-grid { grid-template-columns:1fr; max-width:660px; margin-inline:auto; } }
@media (max-width:640px) {
  body:not(.home) .wrap { padding-inline:20px; }
  nav { min-height:70px; }
  nav .logo { font-size:19px; }
  body:not(.home) .hero { padding-top:32px; }
  .site-mascot { width:66px; height:66px; margin:26px 0 12px 16px; border-radius:20px; }
  .guides-page a.post { padding:20px; }
  .guides-page a.post .post-art { position:static; float:right; width:52px; height:52px; margin:0 0 12px 16px; }
  .tool-page .card,.tool-page section.kw { padding:20px; }
  .playground { margin-top:48px; }
  .playground .race,.playground .demo { padding:20px; }
  .playground .race { --who:132px; }
  .playground .race-name { font-size:12px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; }
  .hero > * { opacity:1; transform:none; }
}
@media print { body { background:#fff; } .site-mascot { display:none; } }

/* No decorative entry delays on the everyday navigation path. */
.hero > * { animation:none; }
@media (min-width:901px) {
  .playground-grid { align-items:stretch; }
  .playground .demo { display:flex; flex-direction:column; }
  .playground .demo .ex-cap { margin-top:auto; padding-top:20px; }
}
@media (max-width:480px) {
  .playground .race-scale span:nth-child(2),
  .playground .race-scale span:nth-child(3) { display:none; }
}
h1,.lede,.tbl-wrap { animation:none; }
/* Rank snapshots: the result first, competitor detail on demand. */
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.tool-page #report { scroll-margin-top:24px; outline:none; }
.tool-page .report-intro { margin:42px 0 24px; }
.tool-page .report-eyebrow { font-size:11px; color:var(--muted); margin-bottom:5px; }
.tool-page .rep-head { align-items:center; }
.tool-page .rep-head h2 { font-size:26px; line-height:1.2; margin:0 0 7px; }
.tool-page .rep-meta { font-size:12px; }
.tool-page .rep-stamp { font-size:11px; margin-top:16px; }
.report-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); background:#eef0e5; border:1px solid #dce0ce; border-radius:20px; padding:24px 10px; margin-bottom:24px; }
.report-summary > div { padding-inline:20px; }
.report-summary > div + div { border-left:1px solid #d5dac7; }
.report-summary span { display:block; font-size:12px; color:var(--muted); }
.report-summary strong { display:block; font-size:32px; font-weight:600; letter-spacing:-.04em; font-variant-numeric:tabular-nums; margin-top:4px; }
.report-summary small { font-size:17px; font-weight:400; color:var(--muted); }
.tool-page section.kw { margin-top:12px; padding:24px; }
.tool-page .kw-head { align-items:flex-start; flex-wrap:nowrap; gap:20px; }
.tool-page .kw-head h3 { font-family:inherit; word-break:normal; overflow-wrap:anywhere; font-size:20px; font-weight:600; line-height:1.3; }
.rank-insight { font-size:13px; color:var(--muted); margin:8px 0 0; }
.your-position { flex:none; text-align:right; }
.your-position > span:first-child { display:block; font-size:10px; color:var(--muted); margin-bottom:8px; }
.tool-page .your-position .rank { display:inline-block; font-size:20px; padding:4px 14px; border-radius:12px; }
.tool-page .your-position .rank.none { font-size:12px; background:var(--low-bg); color:var(--muted); }
.competitor-details { margin-top:20px; border-top:1px solid var(--line); }
.competitor-details summary { font-size:12px; color:var(--muted); cursor:pointer; padding-top:14px; }
.competitor-scroll { overflow-x:auto; }
.tool-page table.comp { display:table; width:100%; border-collapse:collapse; margin-top:16px; }
.tool-page table.comp th { font-size:10px; font-weight:400; background:transparent; padding:10px; }
.tool-page table.comp td { padding:12px 10px; border-color:#eeeee7; }
.tool-page table.comp .position { width:50px; color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.competitor-app { display:flex; align-items:center; gap:10px; min-width:180px; }
.competitor-app img { border-radius:9px; object-fit:cover; flex:none; }
.competitor-name { display:block; font-size:13px; line-height:1.4; }
.competitor-maker { display:block; font-size:11px; font-weight:400; color:var(--muted); }
.competitor-name em { display:inline-block; font-size:9px; font-style:normal; color:var(--good); background:var(--good-bg); padding:2px 6px; margin-left:6px; border-radius:4px; }
.rating-cell { font-size:11px; text-align:right !important; white-space:nowrap; }
.tool-page table.comp tr.target td { background:#f0f3e9; font-weight:400; }
.report-next { display:flex; align-items:center; gap:24px; background:#f3e9db; border:1px solid #e6dbc9; border-radius:22px; padding:28px; margin-top:28px; }
.report-next > img { flex:none; border:4px solid var(--card); border-radius:25px; transform:rotate(-6deg); }
.report-next h2 { font-size:25px; line-height:1.2; margin:0 0 9px; }
.report-next p { font-size:14px; color:var(--muted); margin:0 0 18px; max-width:440px; }
.report-next .btn { text-decoration:none; display:inline-block; }
.report-next .btn span { margin-left:18px; }
.community-soon { display:block; font-size:10px; color:var(--muted); margin-top:12px; }
.report-tools { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:20px; }
.text-action { border:0; padding:10px 0; background:none; color:var(--muted); text-decoration:underline; text-underline-offset:4px; font-size:12px; cursor:pointer; }
.tool-page .report-tools .secondary { color:var(--ink); background:var(--card); border-color:var(--line); }
.report-progress { color:var(--muted); font-size:13px; }
@media (max-width:640px) {
 .report-summary { padding:20px 4px; }
 .report-summary > div { padding-inline:10px; }
 .report-summary span { font-size:10px; }
 .report-summary strong { font-size:28px; }
 .tool-page section.kw { padding:20px; }
 .tool-page .kw-head { gap:14px; }
 .tool-page .kw-head h3 { font-size:17px; }
 .tool-page .rep-head h2 { font-size:22px; }
 .tool-page .your-position .rank { font-size:18px; }
 .tool-page .your-position .rank.none { max-width:100px; white-space:normal; }
 .rank-insight { font-size:12px; }
 .report-next { align-items:flex-start; padding:22px; gap:16px; }
 .report-next > img { width:54px; height:54px; border-radius:18px; }
 .report-next h2 { font-size:22px; }
 .report-next p { font-size:13px; }
 .report-tools { flex-wrap:wrap; }
}
@media print {
 .tool-page .report-summary { background:#fff; }
 .competitor-details > summary { display:none; }
 .competitor-details::details-content { content-visibility:visible; }
 .tool-page #report { margin:0; }
 .tool-page section.kw { break-inside:avoid; }
 .tool-page .rep-head h2 { font-size:22px; }
 .competitor-scroll { overflow:visible; }
}
/* One-page PDF snapshot: ranks and context, without competitor detail. */
@page { size:A4; margin:14mm; }
@media print {
 html,body { margin:0; padding:0; font-size:10pt; line-height:1.35; color:#242923; background:#fff; }
 .tool-page .wrap { max-width:none; padding:0; }
 .tool-page header.brand { padding-bottom:8px; margin-bottom:12px; }
 .tool-page header.brand .logo { font-size:18pt; }
 .tool-page header.brand svg { width:22px; height:22px; }
 .tool-page .sub,.tool-page .competitor-details,.tool-page .rank-insight,
 .tool-page .kw-err,.tool-page .kw-note,.tool-page .report-progress,
 .tool-page .your-position > span:first-child { display:none !important; }
 .tool-page .report-intro { margin:0 0 14px; }
 .tool-page .rep-head { gap:12px; }
 .tool-page .rep-head img { width:44px; height:44px; }
 .tool-page .rep-head h2 { font-size:16pt; margin-bottom:4px; }
 .tool-page .rep-meta,.tool-page .rep-stamp { font-size:8pt; }
 .tool-page .rep-stamp { margin:8px 0 0; }
 .tool-page .report-summary { padding:10px 4px; margin-bottom:14px; border-radius:10px; break-inside:avoid; }
 .tool-page .report-summary span { font-size:8pt; }
 .tool-page .report-summary strong { font-size:20pt; margin-top:2px; }
 .tool-page .report-summary small { font-size:11pt; }
 .tool-page section.kw { padding:12px 14px; margin-top:8px; border-radius:10px; break-inside:avoid; }
 .tool-page .kw-head { align-items:center; gap:20px; }
 .tool-page .kw-head h3 { font-size:11pt; line-height:1.3; }
 .tool-page .your-position .rank { font-size:12pt; padding:4px 10px; border-radius:6px; }
 .tool-page .your-position .rank.none { font-size:9pt; max-width:none; white-space:nowrap; }
 .tool-page .watermark { font-size:8pt; line-height:1.4; margin-top:14px; padding-top:10px; }
}
.tool-page h1.sub { font-size:20px; font-weight:600; letter-spacing:-.03em; line-height:1.5; }
/* The same quiet, human footer on every page. */
.site-footer { margin-top:80px; border-top:1px solid var(--line); padding-top:36px; color:var(--muted); font-size:13px; }
.footer-top { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:32px; padding-bottom:34px; }
.footer-brand { min-width:0; }
.site-footer .footer-wordmark { display:flex; align-items:center; gap:12px; color:var(--ink); font-size:23px; font-weight:600; letter-spacing:-.04em; text-decoration:none; }
.footer-wordmark img { width:54px; height:54px; border:3px solid var(--card); border-radius:17px; transform:rotate(-5deg); }
.footer-brand p { margin:15px 0 6px; font-size:13px; }
.site-footer nav.footer-links { display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:10px; position:static; min-height:0; padding:5px 0 0; border:0; background:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; z-index:auto; }
.site-footer .footer-links h2 { font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.09em; margin:0 0 6px; color:var(--muted); }
.site-footer .footer-links a { color:var(--muted); text-decoration:none; font-size:13px; line-height:1.6; }
.site-footer .footer-links a:hover { color:var(--brand); }
.footer-bottom { display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px 24px; border-top:1px solid var(--line); padding:20px 0 0; font-size:10px; line-height:1.7; }
.source-notes { max-width:760px; margin:30px auto 0; font-size:12px; color:var(--muted); }
.source-notes summary { cursor:pointer; }
.source-notes > div { padding-top:12px; line-height:1.8; }
/* Community: a welcoming preview, anchored in dated, real App Store data. */
body.community-page .community-hero { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:36px; padding:54px 0 48px; }
.community-status { display:inline-block; font-size:11px; color:#4e6042; background:#edf0e4; border-radius:7px; padding:6px 10px; margin-bottom:20px; }
body.community-page .community-hero h1 { font-size:clamp(40px,5vw,62px); letter-spacing:-.05em; line-height:1.06; margin:0 0 20px; }
body.community-page .community-hero p { max-width:480px; font-size:16px; line-height:1.7; margin:0 0 24px; }
.community-actions { display:flex; align-items:center; flex-wrap:wrap; gap:18px 22px; }
.community-actions > a:not(.btn) { font-size:13px; color:var(--ink); text-decoration:none; }
.community-actions .btn span { margin-left:20px; }
.community-cast { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:0; padding:55px 12px 28px; border-radius:32px; background:#eef0e5; }
.community-cast img { width:27%; height:auto; aspect-ratio:1; border:5px solid var(--card); border-radius:26%; box-shadow:0 8px 18px rgba(40,50,25,.07); transform:rotate(-12deg); }
.community-cast img:nth-child(2) { width:36%; transform:rotate(5deg) translateY(-20px); z-index:1; }
.community-cast img:nth-child(3) { transform:rotate(12deg); }
.community-cast > span { display:block; width:100%; text-align:center; font-size:11px; color:#59634e; margin-top:28px; }
.board-explorer { padding-top:24px; border-top:1px solid var(--line); }
.board-explorer > h2,.community-plans > h2 { font-size:30px; line-height:1.2; margin:12px 0; font-weight:600; letter-spacing:-.04em; }
.board-intro { font-size:14px; color:var(--muted); margin:0 0 24px; }
.board-toolbar { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:18px; }
.board-search { width:min(420px,100%); }
.board-search label { display:block; font-size:11px; color:var(--muted); margin-bottom:8px; }
.board-search input { width:100%; min-width:0; font:inherit; font-size:16px; background:var(--card); color:var(--ink); border:1px solid #d3d7ca; border-radius:12px; padding:12px 15px; }
#board-count { font-size:12px; color:var(--muted); padding-bottom:12px; }
.board-dateline { font-size:11px; color:var(--muted); margin:0 0 22px; }
.community-page .boards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.community-page .board { padding:26px; background:var(--card); box-shadow:none; transform:none; }
.community-page .board h3 { font-size:23px; font-weight:600; letter-spacing:-.035em; margin:0 0 18px; }
.community-page .brow { padding:11px 0; }
.community-page .bname { white-space:normal; font-size:13px; line-height:1.4; }
.community-page .brat { font-size:10px; margin-top:3px; }
.community-page .bico { width:36px; height:36px; border-radius:10px; }
.community-page .brk { color:var(--muted); font-size:11px; }
.board-rest { margin-top:10px; }
.board-rest summary { font-size:11px; color:var(--muted); cursor:pointer; padding-bottom:10px; }
.community-page .door { background:#eef0e5; border-color:#dce0ce; color:#37542d; border-radius:12px; padding:13px 15px; font-size:12px; line-height:1.65; margin-top:14px; }
.community-page .door-k { font-size:10px; letter-spacing:0; text-transform:none; margin-bottom:5px; }
.community-page a.check { display:inline-block; font-size:12px; margin-top:16px; }
.community-plans { margin-top:64px; }
.community-plans > .sec-sub { text-align:left; margin:0 0 24px; max-width:none; }
.community-page .steps { gap:18px; }
body.community-page .step { background:var(--card); padding:26px; border:1px solid var(--line); border-radius:18px; box-shadow:none; transform:none; }
.community-page .step .blob { width:64px; height:64px; border-radius:18px; margin-bottom:18px; }
.community-page .step h3 { font-size:19px; font-weight:600; }
.community-page .step p { font-size:14px; line-height:1.7; }
.profile-preview { margin:30px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:20px 0; }
.profile-preview > summary { font-size:15px; font-weight:600; cursor:pointer; }
.profile-preview > summary span { font-size:11px; font-weight:400; color:var(--muted); margin-left:14px; }
.profile-preview .profile { margin-top:22px; }
.community-page .band { margin-top:40px; padding:30px; }
.community-page .band h2 { font-size:27px; font-weight:600; }
.community-page .band p { max-width:450px; font-size:14px; }
.community-page .band .alt { margin:14px 0 0; display:block; font-size:12px; }
.community-page .method { font-size:11px; line-height:1.8; max-width:680px; }
.community-page .method a { color:var(--muted); }
.board-empty { text-align:center; background:#f0f2e9; border-radius:20px; padding:32px; }
.board-empty img { border-radius:20px; }
.board-empty h3 { font-size:22px; margin:18px 0 10px; }
.board-empty p { font-size:14px; color:var(--muted); max-width:400px; margin:0 auto 20px; }
.community-page [hidden] { display:none !important; }
@media (max-width:760px) {
 .footer-top { grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 18px; }
 .footer-brand { grid-column:1/-1; }
 body.community-page .community-hero { grid-template-columns:1fr; gap:30px; padding:36px 0; }
 .community-cast { padding:35px 24px 22px; max-width:420px; width:100%; }
 .community-cast img { max-width:104px; }
 .community-cast img:nth-child(2) { max-width:140px; }
 .community-page .boards { grid-template-columns:1fr; }
 .community-page .band { flex-direction:column; align-items:flex-start; gap:30px; }
}
@media (max-width:480px) {
 .site-footer { margin-top:54px; padding-top:28px; }
 .footer-top { grid-template-columns:1fr 1fr; }
 .footer-brand { grid-column:1/-1; }
 .footer-bottom { flex-direction:column; gap:5px; }
 .community-page .board { padding:20px; }
 .board-explorer > h2,.community-plans > h2 { font-size:26px; }
 .profile-preview > summary span { display:block; margin:7px 0 0 16px; }
 .community-page .band { padding:24px; }
 .community-page .band .blobs { flex-wrap:wrap; }
}
@media (max-width:760px) {
 .community-page .band .blobs { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); width:100%; max-width:400px; gap:5px; }
 body.community-page .band .blobs img { width:100%; height:auto; aspect-ratio:1; margin:0; border-width:2px; border-radius:24%; }
}
.btn:focus-visible:active { transform:none; }
/* The Library: a curated collection, with filtering as immediate feedback. */
body.library-page .shelf-hero { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:48px 0 38px; }
body.library-page .shelf-hero h1 { font-size:clamp(36px,5vw,58px); margin:0 0 18px; }
body.library-page .shelf-hero p { margin:0; font-size:16px; line-height:1.7; }
.shelf-librarian { display:flex; align-items:center; gap:20px; flex:none; background:#eee7dc; border-radius:24px; padding:24px; }
.shelf-librarian img { width:90px; height:90px; border-radius:24px; transform:rotate(6deg); border:4px solid var(--card); }
.shelf-librarian span { font-size:12px; line-height:1.7; color:#6c6256; }
.shelf-browser { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:18px; border-top:1px solid var(--line); padding-top:24px; }
.shelf-filters { display:flex; gap:5px; flex-wrap:wrap; }
.shelf-filters button { font:inherit; font-size:12px; padding:9px 13px; background:transparent; border:1px solid transparent; border-radius:9px; color:var(--muted); cursor:pointer; }
.shelf-filters button span { margin-left:5px; font-size:10px; opacity:.7; }
.shelf-filters button[aria-pressed="true"] { background:var(--ink); color:var(--card); }
.shelf-search { display:block; width:260px; max-width:100%; }
.shelf-search input { width:100%; font:inherit; font-size:16px; padding:10px 14px; background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:10px; }
.shelf-count { color:var(--muted); font-size:11px; margin:18px 0 24px; }
.shelf-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.shelf-resource { min-width:0; text-decoration:none; color:var(--ink); background:var(--card); border:1px solid var(--line); border-radius:20px; overflow:hidden; }
.shelf-feature { grid-column:1/-1; display:grid; grid-template-columns:1.15fr 1fr; }
.shelf-video { position:relative; background:#e3e6db; overflow:hidden; display:flex; align-items:center; }
.shelf-video > img { display:block; width:100%; height:100%; aspect-ratio:4/3; object-fit:cover; }
.shelf-play { position:absolute; left:20px; bottom:20px; width:46px; height:46px; display:grid; place-items:center; border-radius:50%; color:var(--ink); background:var(--card); font-size:15px; padding-left:3px; box-shadow:0 3px 16px rgba(0,0,0,.12); }
.shelf-copy { padding:24px; display:flex; flex-direction:column; flex:1; align-items:flex-start; }
.shelf-kind { font-size:10px; color:var(--muted); }
.shelf-copy h2 { font-size:21px; line-height:1.25; font-weight:600; letter-spacing:-.035em; margin:10px 0; }
.shelf-copy p { font-size:13px; line-height:1.7; color:var(--muted); margin:0 0 24px; }
.shelf-go { font-size:11px; display:flex; justify-content:space-between; gap:12px; width:100%; margin-top:auto; }
.shelf-feature .shelf-copy { justify-content:center; padding:36px; }
.shelf-feature h2 { font-size:34px; }
.shelf-feature .shelf-go { margin-top:8px; }
.shelf-card { display:flex; flex-direction:column; }
.shelf-art { min-height:145px; display:flex; align-items:center; justify-content:center; padding:22px; }
.shelf-art img { width:84px; height:84px; object-fit:contain; border-radius:23%; transform:rotate(-7deg); box-shadow:0 8px 14px rgba(50,55,30,.08); }
.shelf-art-peach { background:#f4e5d2; }
.shelf-art-sage { background:#e8edda; }
.shelf-art-blue { background:#e3edf0; }
.shelf-art-lilac { background:#eee5ee; }
.tool-wordmark { padding:30px 24px; font-size:25px; font-weight:600; letter-spacing:-.04em; min-height:105px; display:flex; align-items:center; }
.shelf-suggest { display:flex; align-items:center; flex-wrap:wrap; gap:20px; background:#eef0e5; border:1px solid #dce0ce; border-radius:22px; padding:26px; margin-top:36px; }
.shelf-suggest img { border-radius:18px; transform:rotate(-7deg); border:3px solid var(--card); }
.shelf-suggest h2 { font-size:22px; margin:0 0 5px; }
.shelf-suggest p { font-size:13px; color:var(--muted); margin:0; }
.shelf-suggest a { font-size:12px; color:var(--ink); margin-left:auto; text-decoration:underline; text-underline-offset:4px; }
.shelf-suggest a span { margin-left:12px; }
.shelf-empty { padding:40px 24px; text-align:center; border-radius:22px; background:#eef0e5; }
.shelf-empty img { border-radius:22px; }
.shelf-empty h2 { font-size:25px; margin:20px 0 10px; }
.shelf-empty p { font-size:14px; color:var(--muted); margin-bottom:24px; }
.library-shelf [hidden] { display:none !important; }
@media (hover:hover) and (pointer:fine) {
 .shelf-resource:hover { border-color:#a6af99; }
 .shelf-resource:hover .shelf-go { color:var(--brand); }
 .shelf-filters button:hover { border-color:var(--line); }
}
@media (max-width:900px) {
 .shelf-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .shelf-librarian { padding:18px; }
 .shelf-librarian span { display:none; }
 .shelf-feature h2 { font-size:28px; }
 .shelf-feature .shelf-copy { padding:24px; }
}
@media (max-width:640px) {
 body.library-page .shelf-hero { padding:34px 0; align-items:flex-start; gap:18px; }
 body.library-page .shelf-hero h1 { font-size:36px; }
 .shelf-librarian { background:transparent; padding:0; }
 .shelf-librarian img { width:62px; height:62px; border-radius:19px; }
 body.library-page .shelf-hero p { font-size:14px; }
 .shelf-search { width:100%; }
 .shelf-feature { grid-template-columns:1fr; }
 .shelf-video > img { aspect-ratio:16/9; }
 .shelf-feature .shelf-copy { padding:24px; }
 .shelf-card .shelf-copy { padding:20px; }
 .shelf-copy h2 { font-size:20px; }
 .shelf-art { min-height:130px; }
}
@media (max-width:480px) {
 .shelf-grid { grid-template-columns:1fr; }
 .shelf-filters { gap:2px; }
 .shelf-filters button { padding:9px 10px; }
 .shelf-suggest { gap:16px; padding:22px; }
 .shelf-suggest > div { flex:1; min-width:180px; }
 .shelf-suggest a { margin-left:0; }
}
.shelf-title-phrase { white-space:nowrap; }
@media (max-width:480px) { body.library-page .shelf-hero h1 { font-size:32px; } }
/* Builder identity leads; apps are the supporting work beneath it. */
.builder-profile { max-width:760px; margin:24px auto 0; background:var(--card); border:1px solid var(--line); border-radius:24px; overflow:hidden; }
.builder-preview-label { font-size:10px; color:var(--muted); margin:0; padding:18px 28px; border-bottom:1px solid #e9e6da; background:#f7f4ec; }
.builder-identity { display:grid; grid-template-columns:174px 1fr; gap:32px; align-items:center; padding:36px 32px; background:#faf7ee; }
.builder-avatar { text-align:center; }
.builder-avatar img { display:block; width:152px; height:152px; margin:0 auto; border:5px solid var(--card); border-radius:38px; box-shadow:0 8px 20px rgba(106,82,16,.09); }
.builder-avatar > span { display:block; font-size:11px; color:#75612d; margin-top:16px; }
.builder-about { min-width:0; }
.builder-about h3 { font-size:34px; font-weight:600; line-height:1.15; letter-spacing:-.045em; margin:0 0 8px; }
.builder-handle { font-size:17px; color:var(--muted); margin:0 0 18px; overflow-wrap:anywhere; }
.builder-bio { font-size:14px; color:var(--ink); line-height:1.7; margin:0; max-width:300px; }
.builder-workbench { padding:26px 32px 16px; border-top:1px solid var(--line); }
.builder-workbench > h4 { font-size:11px; font-weight:400; color:var(--muted); margin:0 0 14px; }
.builder-app { display:flex; align-items:center; gap:13px; padding:15px 0; }
.builder-app + .builder-app { border-top:1px solid #edeee7; }
.concept-app-icon { display:grid; place-items:center; flex:none; width:42px; height:42px; border-radius:12px; font-size:23px; letter-spacing:-.08em; font-weight:600; }
.ritual-icon { background:#e4ebdb; color:#526a41; }
.focus-icon { background:#e7e8f0; color:#59617e; }
.builder-app > div { min-width:0; }
.builder-app h5 { font-size:14px; font-weight:600; margin:0 0 4px; }
.builder-app p { font-size:12px; color:var(--muted); margin:0; line-height:1.5; }
.builder-app-status { margin-left:auto; flex:none; font-size:10px; color:var(--muted); padding:5px 8px; background:#f1f1eb; border-radius:6px; }
.builder-preview-note { max-width:700px; margin:16px auto 0; font-size:11px; line-height:1.7; color:var(--muted); }
@media (max-width:640px) {
 .builder-identity { grid-template-columns:116px 1fr; gap:22px; padding:28px 22px; }
 .builder-avatar img { width:112px; height:112px; border-radius:30px; }
 .builder-avatar > span { font-size:10px; }
 .builder-about h3 { font-size:29px; }
 .builder-handle { font-size:15px; margin-bottom:12px; }
 .builder-bio { font-size:13px; }
 .builder-workbench { padding:22px 22px 12px; }
 .builder-preview-label { padding:16px 22px; }
}
@media (max-width:420px) {
 .builder-identity { grid-template-columns:1fr; text-align:center; gap:24px; }
 .builder-avatar img { width:140px; height:140px; border-radius:36px; }
 .builder-bio { margin-inline:auto; }
 .builder-app { flex-wrap:wrap; }
 .builder-app-status { margin-left:55px; }
}
/* Community identity is a person, with their projects underneath. */
.developer-explorer { border-top:1px solid var(--line); padding-top:30px; }
.developer-section-heading h2 { font-size:32px; font-weight:600; letter-spacing:-.04em; margin:0 0 12px; }
.developer-section-heading > p { font-size:15px; color:var(--muted); max-width:580px; line-height:1.7; margin:0 0 18px; }
.developer-concept-label { font-size:11px; color:var(--muted); padding:10px 13px; border-radius:8px; background:#f0eee6; margin:0 0 24px; }
.developer-toolbar { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:24px; }
.developer-toolbar label { display:block; width:min(440px,100%); font-size:11px; color:var(--muted); }
.developer-toolbar input { display:block; width:100%; font:inherit; font-size:16px; margin-top:8px; padding:12px 14px; border:1px solid var(--line); border-radius:11px; background:var(--card); color:var(--ink); }
#developer-count { font-size:11px; color:var(--muted); padding-bottom:12px; }
.developer-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.developer-card { padding:26px; background:var(--card); border:1px solid var(--line); border-radius:24px; min-width:0; }
.developer-card-person { display:grid; grid-template-columns:112px 1fr; align-items:center; gap:22px; }
.developer-card-avatar img { display:block; width:112px; height:112px; border-radius:29px; border:4px solid #f8f5ec; }
.developer-card-avatar > span { display:block; margin-top:12px; font-size:10px; color:#75612d; text-align:center; }
.developer-card h3 { font-size:27px; font-weight:600; letter-spacing:-.04em; margin:0 0 5px; }
.developer-card-handle { font-size:14px; color:var(--muted); margin:0 0 12px; overflow-wrap:anywhere; }
.developer-card-bio { font-size:13px; color:var(--ink); line-height:1.7; margin:0; }
.developer-interest { font-size:12px; color:#4d6044; background:#eef0e5; border-radius:8px; margin:24px 0 20px; padding:10px 12px; }
.developer-interest > span { color:var(--muted); font-size:10px; margin-right:10px; }
.developer-card-work { border-top:1px solid var(--line); padding-top:16px; }
.developer-work-label { font-size:10px; color:var(--muted); display:block; margin-bottom:10px; }
.developer-card-work > div { display:flex; align-items:center; gap:12px; }
.developer-card-work .concept-app-icon { width:34px; height:34px; border-radius:10px; font-size:18px; }
.developer-card-work strong { font-size:12px; font-weight:600; display:block; }
.developer-card-work small { font-size:10px; color:var(--muted); display:block; margin-top:3px; }
.developer-empty { padding:30px; text-align:center; background:#eef0e5; border-radius:20px; }
.developer-empty img { border-radius:18px; }
.developer-empty h3 { font-size:22px; margin:16px 0 10px; }
.developer-empty p { font-size:13px; color:var(--muted); margin:0 0 20px; }
.app-reference { margin:36px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:20px 0; }
.app-reference > summary { cursor:pointer; font-size:14px; font-weight:600; }
.app-reference > summary span { font-size:11px; font-weight:400; color:var(--muted); margin-left:12px; }
.app-reference .board-explorer { border-top:0; margin-top:24px; padding-top:0; }
@media (max-width:760px) { .developer-grid { grid-template-columns:1fr; } }
@media (max-width:480px) {
 .developer-card { padding:22px; }
 .developer-card-person { grid-template-columns:94px 1fr; gap:18px; }
 .developer-card-avatar img { width:94px; height:94px; border-radius:26px; }
 .developer-card h3 { font-size:24px; }
 .developer-card-handle { font-size:12px; }
 .developer-card-bio { font-size:12px; }
 .developer-section-heading h2 { font-size:28px; }
 .app-reference > summary span { display:block; margin:7px 0 0 16px; }
}
.library-page .resource-suggestion { display:block; }
.resource-suggestion-heading { display:flex; align-items:center; gap:18px; margin-bottom:22px; }
.resource-suggestion-heading > img { flex:none; }
.resource-suggestion form > label { font-size:11px; color:var(--muted); display:block; margin-bottom:8px; }
.resource-suggestion-row { display:flex; align-items:stretch; gap:10px; }
.resource-suggestion-row input { flex:1; min-width:0; border:1px solid #d3d7ca; background:var(--card); color:var(--ink); font:inherit; font-size:16px; border-radius:10px; padding:12px 15px; }
.resource-suggestion-row .btn { flex:none; font-family:inherit; }
.resource-suggestion-row .btn span { margin-left:14px; }
.resource-suggestion #resource-suggestion-note,.resource-suggestion #resource-suggestion-status { font-size:11px; color:var(--muted); margin:12px 0 0; line-height:1.7; }
@media (max-width:480px) {
 .resource-suggestion-row { flex-direction:column; }
 .resource-suggestion-row .btn { width:100%; }
 .resource-suggestion-heading { align-items:flex-start; gap:14px; }
 .resource-suggestion-heading h2 { font-size:22px; }
}
.resource-suggestion { scroll-margin-top:96px; }

/* Resource symbols describe the content instead of competing with its title. */
.resource-type-icon { display:grid; place-items:center; width:42px; height:42px; margin:24px 24px 0; border:1px solid var(--line); border-radius:12px; background:#f1f2eb; color:#626b55; flex:none; }
.library-page .shelf-card .shelf-copy { padding-top:18px; }
.library-page .shelf-copy h2 { font-size:22px; }
.library-page .shelf-kind { text-transform:uppercase; letter-spacing:.07em; }
.library-page .shelf-go { color:var(--brand); }
.tool-article .tool-summary { background:#eef0e5; padding:22px 24px; border-radius:16px; margin:24px 0 30px; }
.tool-article .tool-summary p { margin:0; }
.tool-article .official-link { display:inline-flex; font-size:14px; text-underline-offset:4px; margin:8px 0 20px; }
.tool-article .article-back { display:inline-block; font-size:13px; margin-bottom:24px; text-underline-offset:4px; }
@media(max-width:480px) { .resource-type-icon { margin:20px 20px 0; } }

/* Keep recognizable app identities attached to names in research comparisons. */
.comparison-app { display:inline-flex; align-items:center; gap:10px; vertical-align:middle; }
.comparison-app > img { display:block; flex:none; width:32px; height:32px; border-radius:8px; object-fit:cover; border:1px solid var(--line); background:var(--card); }
.comparison-app > span { min-width:0; }

.shelf-author { display:block; font-size:12px; margin:0 0 20px; color:var(--ink); }
.shelf-author span { color:var(--muted); margin-left:5px; }

.logo .brand-icon { display:block; flex:none; width:32px; height:32px; object-fit:contain; border-radius:8px; }

/* Opportunity-first community: evidence, a small commitment, then your work. */
.opportunity-heading,.builder-home-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.opportunity-heading h2,.community-account h2 { font-size:32px; letter-spacing:-.04em; margin:8px 0 16px; }
.opportunity-intro { color:var(--muted); max-width:780px; font-size:15px; line-height:1.8; margin:0 0 28px; }
.opportunity-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.opportunity-card { display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line); border-radius:22px; padding:24px; min-width:0; }
.opportunity-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.keyword-tag,.milestone-pill { display:inline-block; background:#e9eddf; color:#455936; padding:7px 11px; font-size:12px; border-radius:999px; }
.opportunity-card h3 { font-size:23px; line-height:1.25; letter-spacing:-.04em; margin:20px 0 12px; }
.opportunity-card > p { color:var(--muted); font-size:14px; line-height:1.7; }
.opportunity-evidence { border-top:1px solid var(--line); padding-top:18px; margin-top:auto; }
.opportunity-evidence > strong { font-size:14px; display:block; }
.opportunity-evidence > span { color:var(--muted); font-size:11px; display:block; margin-top:5px; }
.opportunity-evidence > div { display:flex; align-items:center; gap:10px; margin-top:16px; font-size:12px; }
.opportunity-evidence img { border-radius:7px; flex:none; }
.opportunity-evidence small { display:block; color:var(--muted); font-size:10px; margin-top:4px; }
.opportunity-date { color:var(--muted); font-size:11px!important; }
.opportunity-date a { color:inherit; text-underline-offset:3px; }
.commit-button { width:100%; margin-top:8px; font:inherit; font-size:14px; }
.room-members { display:flex; flex-wrap:wrap; gap:6px; margin-top:16px; font-size:11px; color:var(--muted); }
.room-members > span:first-child { width:100%; }
.room-handle { color:var(--ink); padding:4px 6px; border-radius:5px; background:var(--bg); }
.text-button { color:var(--brand); background:none; border:0; padding:8px 0; font:inherit; font-size:14px; cursor:pointer; text-align:left; text-decoration:underline; text-underline-offset:4px; }
.commit-dialog { width:min(480px,calc(100% - 32px)); max-height:90dvh; overflow:auto; padding:30px; color:var(--ink); background:var(--card); border:1px solid var(--line); border-radius:24px; box-shadow:var(--shadow); }
.commit-dialog::backdrop { background:rgba(28,33,24,.36); }
.commit-dialog > img { display:block; margin-bottom:12px; }
.commit-dialog h2 { font-size:28px; line-height:1.2; letter-spacing:-.035em; margin:12px 0; }
.commit-dialog p { font-size:14px; line-height:1.7; color:var(--muted); }
.dialog-close { position:absolute; right:16px; top:14px; width:36px; height:36px; border:0; border-radius:50%; font-size:24px; background:var(--bg); cursor:pointer; }
.commit-dialog label,.community-account label { display:block; margin:18px 0 7px; font-size:13px; }
.commit-dialog input,.community-account input,.community-account select { width:100%; box-sizing:border-box; font:inherit; font-size:16px; color:var(--ink); background:var(--card); border:1px solid var(--line); border-radius:10px; padding:12px; }
.commit-dialog .btn { width:100%; font-size:14px; }
.form-note { color:var(--muted); font-size:12px!important; line-height:1.7; }
.community-account { border:1px solid var(--line); border-radius:24px; padding:30px; margin:10px 0 48px; background:var(--card); scroll-margin-top:100px; }
.milestone-earned { display:flex; align-items:center; gap:16px; padding:18px; border-radius:16px; background:#edf2e3; margin:20px 0; }
.milestone-earned strong { font-size:20px; }.milestone-earned p { font-size:13px; color:var(--muted); margin:6px 0 0; }
.my-pledge { display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--line); padding:14px 0; font-size:15px; }
.my-pledge small { display:block; color:var(--muted); margin-top:5px; }
.optional-onboarding { margin-top:30px; padding-top:16px; border-top:1px solid var(--line); }
.onboarding-fields { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
.onboarding-fields label span { color:var(--muted); font-size:11px; }
.onboarded-app { display:flex; gap:16px; padding:24px 0; border-bottom:1px solid var(--line); }
.onboarded-app > img { flex:none; border-radius:12px; }.onboarded-app h3 { margin:0 0 12px; }.onboarded-app p { font-size:13px; color:var(--muted); }
.app-controls { display:flex; gap:20px; flex-wrap:wrap; }.onboarded-app code { display:block; word-break:break-all; padding:12px; background:var(--bg); font-size:12px; }
@media(max-width:900px) { .opportunity-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:580px) { .opportunity-grid { grid-template-columns:1fr; }.opportunity-heading { align-items:flex-start; flex-direction:column; gap:0; }.community-account { padding:22px; }.onboarding-fields { grid-template-columns:1fr; gap:0; }.opportunity-heading h2 { font-size:28px; } }

.room-handle { display:inline-flex; align-items:center; gap:5px; }.room-handle img { border-radius:6px; }.builder-home-heading > div { margin-right:auto; }

.article-breadcrumbs { position:static; display:flex; justify-content:flex-start; flex-wrap:wrap; gap:8px; padding:0; margin:0 0 24px; background:none; backdrop-filter:none; -webkit-backdrop-filter:none; font-size:12px; color:var(--muted); }
.article-breadcrumbs a { font-size:12px; margin:0; padding:0; color:var(--muted); text-underline-offset:3px; }
.time-machine-grid { grid-template-columns:repeat(2,minmax(0,1fr)); margin:28px 0; }.time-machine-link { font-size:13px; margin:0 0 24px; }.time-machine-link a { color:var(--brand); text-underline-offset:4px; }
@media(max-width:580px) { .time-machine-grid { grid-template-columns:1fr; } }

/* One shared primary navigation; secondary destinations remain in the footer. */
nav.site-nav { display:flex; align-items:center; gap:24px; justify-content:flex-start; }
nav.site-nav > .logo { display:flex; align-items:center; gap:9px; flex:none; text-decoration:none; color:var(--ink); }
nav.site-nav > .links { display:flex; gap:24px; margin-left:auto; align-items:center; }
nav.site-nav > .links > a { display:inline-flex!important; margin:0; padding:8px 0; font-size:14px; }
nav.site-nav .navcheck { display:flex!important; margin:0; flex:none; width:260px; }
nav.site-nav .navcheck input { flex:1; width:0; min-width:0; font-size:16px; }
nav.site-nav .navcheck button { flex:none; }
.community-activity,.collection-archive { border-top:1px solid var(--line); padding-top:32px; margin-top:44px; }
.community-activity h2,.collection-archive h2 { font-size:30px; letter-spacing:-.04em; margin:0 0 12px; }
.community-activity > p,.collection-archive > p { color:var(--muted); font-size:14px; line-height:1.8; }
.builder-activity { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; color:var(--muted); font-size:14px; }
.activity-builder { display:flex; gap:12px; padding:18px; border:1px solid var(--line); border-radius:16px; background:var(--card); }
.activity-builder img { flex:none; }.activity-builder p { font-size:13px; margin:8px 0; }.activity-builder strong { color:var(--ink); }.activity-builder small { font-size:11px; }
.collection-links { display:flex; gap:16px; flex-wrap:wrap; }.collection-links a { padding:20px; border:1px solid var(--line); background:var(--card); border-radius:16px; color:var(--ink); text-decoration:none; min-width:240px; }.collection-links span,.collection-links small { display:block; color:var(--muted); font-size:12px; }.collection-links strong { display:block; margin:8px 0; }
.more-opportunities { margin-top:26px; border-top:1px solid var(--line); padding-top:20px; }.more-opportunities > summary { cursor:pointer; font-size:15px; font-weight:600; }.more-opportunities > p { color:var(--muted); font-size:13px; }.more-opportunities .opportunity-grid { margin-top:20px; }
.collection-page { padding:44px 0; }.collection-page h1 { max-width:800px; font-size:44px; line-height:1.12; letter-spacing:-.045em; }.collection-page > p { color:var(--muted); line-height:1.8; max-width:780px; }.collection-page .opportunity-grid { margin:30px 0; }
@media(max-width:640px) { nav.site-nav { flex-wrap:wrap; gap:12px; }nav.site-nav > .links { gap:18px; }nav.site-nav .navcheck { flex:1 0 100%; width:100%; }.builder-activity { grid-template-columns:1fr; }.collection-page h1 { font-size:34px; } }
nav.site-nav .navcheck { align-items:center; gap:6px; padding:4px; border:1px solid var(--line); border-radius:999px; background:var(--card); box-shadow:0 2px 8px rgba(30,35,24,.04); }
nav.site-nav .navcheck input { border:0; border-radius:999px; background:transparent; color:var(--ink); padding:8px 10px; font:inherit; font-size:16px; outline:none; }
nav.site-nav .navcheck:focus-within { outline:2px solid var(--brand); outline-offset:2px; }
nav.site-nav .navcheck button { border:0; border-radius:999px; padding:9px 15px; min-height:38px; color:#fff; background:var(--brand); font:inherit; font-size:14px; font-weight:600; cursor:pointer; }

/* Time Machine: recognizable apps first, their earlier chapters just beneath. */
.tm-hub { padding:36px 0 16px; }
.tm-hero { display:flex; align-items:center; justify-content:space-between; gap:32px; padding:14px 0 32px; }
.tm-eyebrow { display:block; font-size:12px; color:var(--muted); margin-bottom:18px; }
.tm-hero h1 { font-size:clamp(42px,5.5vw,66px); line-height:1.02; letter-spacing:-.055em; font-weight:600; margin:0 0 22px; }
.tm-hero p { color:var(--muted); font-size:16px; max-width:490px; line-height:1.7; margin:0; }
.tm-guide { display:flex; align-items:center; gap:14px; background:#eeeee3; padding:22px; border-radius:24px; flex:none; }
.tm-guide img { border-radius:22px; }.tm-guide span { font-size:12px; color:var(--muted); line-height:1.8; }
.tm-search { max-width:650px; margin:0 0 38px; }
.tm-search label { display:block; font-size:13px; margin-bottom:10px; color:var(--ink); }
.tm-search-field { display:flex; align-items:center; gap:12px; background:var(--card); border:1px solid #d4d8cb; border-radius:14px; padding:10px 16px; color:var(--muted); }
.tm-search-field:focus-within { outline:2px solid var(--brand); outline-offset:3px; }
.tm-search-field input { flex:1; width:0; min-width:0; border:0; background:transparent; padding:8px 0; color:var(--ink); font:inherit; font-size:17px; outline:none; }
.tm-search-field input::-webkit-search-cancel-button { -webkit-appearance:none; }
.tm-search-field > svg { flex:none; }
.tm-search-field button { width:32px; height:32px; border:0; border-radius:50%; background:var(--bg); font-size:22px; color:var(--muted); cursor:pointer; flex:none; }
.tm-collection-heading { display:flex; align-items:baseline; justify-content:space-between; gap:16px; border-top:1px solid var(--line); padding-top:26px; margin-bottom:22px; }
.tm-collection-heading h2 { font-size:22px; letter-spacing:-.035em; margin:0; }.tm-collection-heading p { font-size:12px; color:var(--muted); margin:0; flex:none; }
.tm-app-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.tm-app { color:var(--ink); text-decoration:none; padding:26px; border:1px solid var(--line); border-radius:22px; background:var(--card); transition:border-color 150ms ease,transform 150ms var(--ease-out); }
.tm-app-heading { display:flex; align-items:center; gap:14px; }.tm-app-heading > img { flex:none; border-radius:15px; width:60px; height:60px; object-fit:cover; border:1px solid var(--line); }
.tm-app-heading h2 { margin:0 0 5px; font-size:24px; font-weight:600; letter-spacing:-.04em; }.tm-app-heading div > span { font-size:12px; color:var(--muted); }.tm-card-arrow { margin-left:auto; color:var(--muted); font-size:20px; }
.tm-icon-history { display:flex; align-items:center; gap:9px; margin:26px 0 22px; padding:14px; background:#f4f3ed; border-radius:12px; }
.tm-icon-history img { flex:none; width:38px; height:38px; border-radius:9px; border:1px solid var(--line); object-fit:cover; }.tm-icon-history > span { width:18px; height:1px; background:#c9cdbd; }.tm-icon-history small { font-size:11px; margin-left:auto; color:var(--muted); }
.tm-app h3 { font-size:19px; letter-spacing:-.03em; line-height:1.3; margin:0 0 9px; }.tm-app > p { font-size:14px; line-height:1.7; color:var(--muted); margin:0 0 22px; }.tm-read { display:flex; justify-content:space-between; font-size:12px; color:var(--brand); }
.tm-app:active { transform:scale(.985); }
@media(hover:hover) and (pointer:fine) { .tm-app:hover { border-color:#a9b59a; transform:translateY(-2px); } }
.tm-empty { text-align:center; padding:36px 22px; border:1px dashed var(--line); border-radius:18px; }.tm-empty h2 { font-size:24px; letter-spacing:-.035em; }.tm-empty p { color:var(--muted); font-size:14px; }.tm-empty .btn { font-size:14px; }
.tm-method { display:flex; align-items:center; gap:18px; border-top:1px solid var(--line); margin-top:32px; padding-top:22px; color:var(--muted); }.tm-method > span { font-size:30px; }.tm-method p { margin:0; font-size:12px; line-height:1.8; max-width:660px; }.tm-method a { color:var(--brand); font-size:12px; flex:none; margin-left:auto; }
@media(max-width:900px) { .tm-guide { flex-direction:column; text-align:center; padding:18px; }.tm-guide img { width:72px; height:72px; } }
@media(max-width:640px) { .tm-hub { padding-top:24px; }.tm-hero { align-items:flex-start; padding-top:0; }.tm-guide { display:none; }.tm-app-grid { grid-template-columns:1fr; }.tm-search { margin-bottom:28px; }.tm-collection-heading { align-items:flex-start; flex-direction:column; gap:10px; }.tm-app { padding:22px; }.tm-method { flex-wrap:wrap; }.tm-method a { margin-left:0; }.tm-icon-history small { font-size:10px; } }
@media(prefers-reduced-motion:reduce) { .tm-app { transition:border-color 150ms ease; }.tm-app:hover,.tm-app:active { transform:none; } }

/* Agent field notes: one readable collection, with research status visible. */
.shelf-agent-feature { grid-column:1/-1; background:#eeeee3; position:relative; padding-right:126px; }.agent-feature-blob { position:absolute; right:26px; top:28px; border-radius:22px; }
.agent-notes-hero { display:flex; align-items:center; gap:24px; justify-content:space-between; }.agent-notes-hero img { border-radius:26px; }.agent-notes-hero .kicker { margin-top:30px; }
.agent-jump { display:flex; gap:10px; flex-wrap:wrap; margin:24px 0; }.agent-jump a { border:1px solid var(--line); border-radius:999px; padding:8px 14px; font-size:13px; text-decoration:none; }
.agent-note { border:1px solid var(--line); border-radius:22px; background:var(--card); padding:26px; margin:22px 0; scroll-margin-top:110px; }.agent-note-kind { font-size:12px; color:var(--muted); }.agent-note h2 { margin:10px 0 14px; }.agent-note dl { margin:20px 0; }.agent-note dl > div { border-top:1px solid var(--line); padding:12px 0; }.agent-note dt { font-size:12px; color:var(--muted); margin-bottom:5px; }.agent-note dd { margin:0; font-size:15px; }.agent-source { font-size:13px; }.agent-notes blockquote { margin:22px 0; padding:22px; background:#eeeee3; border-radius:16px; font-size:16px; }.search-coverage { display:block; font-size:12px; margin-top:6px; color:var(--muted); }
@media(max-width:640px) { .shelf-agent-feature { padding-right:22px; }.agent-feature-blob { display:none; }.agent-notes-hero img { width:72px;height:72px; }.agent-note { padding:20px; } }

/* Topic identity stays put while the platform changes. */
.topic-boards { border-top:1px solid var(--line); padding-top:26px; margin-top:26px; text-align:left; }
.topic-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }.topic-heading :is(h2,h3) { font-size:24px; line-height:1.2; letter-spacing:-.04em; margin:0 0 7px; }.topic-heading p { margin:0; color:var(--muted); font-size:14px; }
.topic-switch { display:flex; flex-wrap:wrap; gap:4px; border:1px solid var(--line); padding:4px; border-radius:15px; background:#f5f4ed; }.topic-switch button { display:inline-flex; align-items:center; justify-content:center; gap:7px; border:1px solid transparent; border-radius:11px; background:transparent; color:var(--muted); padding:10px 12px; min-height:44px; font:inherit; font-size:13px; cursor:pointer; }.topic-switch button[aria-pressed="true"] { color:var(--ink); border-color:var(--line); background:var(--card); box-shadow:0 1px 3px #20291c09; }.topic-switch svg { width:18px; height:18px; flex:none; }.topic-switch button:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
.topic-context { font-size:12px!important; color:var(--muted); line-height:1.7; margin:17px 0 22px!important; }.topic-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.topic-card { display:flex; flex-direction:column; min-width:0; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:22px; }.topic-card-heading { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }.topic-card :is(h3,h4) { margin:0; font-size:20px; letter-spacing:-.03em; scroll-margin-top:110px; }.topic-source { color:var(--muted); font-size:11px; white-space:nowrap; }.topic-query { font-size:12px!important; color:var(--muted); margin:7px 0 18px!important; }
.topic-app { display:flex; align-items:center; gap:10px; border-top:1px solid var(--line); padding:11px 0; min-height:55px; }.topic-app img { width:32px;height:32px; border-radius:8px; flex:none; }.topic-app > span { font-size:13px; line-height:1.4; overflow-wrap:anywhere; }.topic-app > strong { margin-left:auto; flex:none; color:var(--brand); font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; }.topic-snapshot { color:var(--muted); font-size:11px!important; line-height:1.6; margin:16px 0 12px!important; }.topic-action { font-size:12px; color:var(--brand); text-decoration:none; margin-top:auto; padding-top:8px; }
.topic-agent { display:flex; align-items:center; gap:10px; border-top:1px solid var(--line); padding:11px 0; color:var(--ink); text-decoration:none; }.agent-initial { width:32px;height:32px; border-radius:10px; background:#eeeee3; display:grid; place-items:center; font-size:14px; flex:none; }.topic-agent strong { font-size:14px; font-weight:600; }.topic-agent small { display:block; color:var(--muted); font-size:11px; margin-top:4px; }.topic-agent > span:last-child { margin-left:auto; color:var(--muted); }.topic-unresearched { display:flex; align-items:center; gap:12px; padding:28px 0; flex:1; }.topic-unresearched p { font-size:14px; margin:0; }.topic-unresearched p span { display:block; font-size:12px; margin-top:6px; color:var(--muted); }.topic-unresearched img { border-radius:12px; }.topic-search { display:block; font-size:13px; margin:18px 0; }.topic-search input { display:block; width:100%; max-width:440px; margin-top:8px; padding:12px; font:inherit; font-size:16px; border:1px solid var(--line); border-radius:12px; background:var(--card); }.topic-no-results { padding:24px; background:var(--card); border-radius:16px; color:var(--muted); }
@media(hover:hover) and (pointer:fine) { .topic-action:hover,.topic-agent:hover strong { text-decoration:underline; text-underline-offset:3px; } }
@media(max-width:640px) { .topic-heading { gap:16px; }.topic-switch { width:100%; }.topic-switch button { flex:1; padding:10px 7px; font-size:12px; }.topic-grid { grid-template-columns:1fr; }.topic-card { padding:20px; }.topic-heading :is(h2,h3) { font-size:22px; } }

.topic-boards [hidden] { display:none!important; }

.topic-boards { scroll-margin-top:105px; }
@media(max-width:640px) { .topic-switch button { flex:1 0 auto; gap:5px; padding:10px 6px; white-space:nowrap; } }

/* Library media: watch in place; recognize case studies by the app. */
.resource-app-icon { width:56px; height:56px; border-radius:14px; object-fit:cover; margin:24px 24px 0; flex:none; }
.shelf-video-player { aspect-ratio:16/9; width:100%; background:#eeeee3; flex:none; }.shelf-video-player iframe { display:block; width:100%; height:100%; border:0; }.shelf-video-source { color:var(--muted); font-size:11px; margin-top:auto; text-underline-offset:3px; }.library-page .shelf-video .shelf-copy { padding-top:20px; }.shelf-video .shelf-copy p { margin-bottom:18px; }

.library-page .shelf-video { background:var(--card); align-items:stretch; }
.shelf-grid[data-view="watch"] .shelf-video { grid-column:1/-1; width:100%; max-width:800px; margin-inline:auto; }

/* One topic explorer joins the race and selected-app detail. */
.topic-explorer { margin:56px 0; scroll-margin-top:105px; }.explorer-anchor { display:block; scroll-margin-top:105px; }.topic-preview-link { color:var(--brand); font-size:14px; text-decoration:none; }.explorer-controls { display:grid; gap:16px; margin:28px 0 18px; }.explorer-control-row { display:flex; align-items:center; flex-wrap:wrap; gap:14px; }.explorer-label { width:65px; font-size:12px; color:var(--muted); flex:none; }.explorer-topics,.explorer-keywords { display:flex; flex-wrap:wrap; gap:7px; }.explorer-topics button,.explorer-keywords button { padding:10px 15px; min-height:42px; border:1px solid var(--line); border-radius:999px; background:var(--card); color:var(--muted); font:inherit; font-size:13px; cursor:pointer; }.explorer-topics button[aria-pressed="true"],.explorer-keywords button[aria-pressed="true"] { background:var(--ink); color:var(--bg); border-color:var(--ink); }.explorer-status { font-size:12px; color:var(--muted); line-height:1.7; margin:20px 0; }.explorer-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:20px; }.explorer-race,.explorer-detail { border:1px solid var(--line); border-radius:24px; padding:28px; min-width:0; }.explorer-race { background:#eef0e4; }.explorer-detail { background:var(--card); }.explorer-eyebrow { font-size:12px; color:var(--muted); }.explorer-race h3 { font-size:28px; line-height:1.2; letter-spacing:-.04em; margin:15px 0; }.explorer-help { color:var(--muted); font-size:12px; line-height:1.7; margin:12px 0 20px; }.explorer-lane { display:grid; grid-template-columns:45% minmax(0,1fr); align-items:center; gap:12px; padding:14px 5px; width:100%; border:0; border-top:1px solid var(--line); background:transparent; text-align:left; color:var(--ink); font:inherit; cursor:pointer; border-radius:8px; }.explorer-lane[aria-pressed="true"] { background:#ffffff90; }.explorer-who { display:flex; align-items:center; gap:9px; min-width:0; }.explorer-who img { width:32px;height:32px; border-radius:9px; flex:none; }.explorer-who > span { font-size:12px; line-height:1.4; overflow-wrap:anywhere; }.explorer-rail { height:36px; position:relative; }.explorer-rail:before { content:""; position:absolute; width:100%; height:5px; top:16px; border-radius:5px; background:#dce3d0; }.explorer-marker { position:absolute; top:2px; border-radius:999px; background:#e1ebd3; color:#3f5930; font-size:12px; font-weight:600; line-height:32px; padding:0 10px; white-space:nowrap; }.explorer-marker.not-found { font-size:10px; background:#f3f2ec; color:var(--muted); }.explorer-auto .explorer-marker { transition:left 500ms var(--ease-out),transform 500ms var(--ease-out); }.explorer-scale { display:flex; justify-content:space-between; margin:8px 0 20px 47%; color:var(--muted); font-size:10px; }.explorer-race-tools { display:flex; gap:18px; flex-wrap:wrap; }.explorer-race-tools button { border:0; background:transparent; padding:8px 0; color:var(--muted); font:inherit; font-size:12px; text-decoration:underline; text-underline-offset:5px; cursor:pointer; }.explorer-race-tools button:disabled { opacity:.5; cursor:wait; }.explorer-source { font-size:10px; line-height:1.8; color:var(--muted); margin-top:16px; }.explorer-source a { color:inherit; }.explorer-app-head { display:flex; gap:14px; align-items:center; margin-bottom:24px; }.explorer-app-head img { width:56px;height:56px; border-radius:15px; flex:none; }.explorer-app-head h3 { font-size:23px; line-height:1.25; letter-spacing:-.035em; margin:6px 0; }.explorer-app-head p { color:var(--muted); font-size:12px; margin:0; }.explorer-detail-row { display:flex; justify-content:space-between; align-items:center; gap:10px; width:100%; border:0; border-top:1px solid var(--line); padding:17px 8px; background:transparent; text-align:left; font:inherit; font-size:14px; color:var(--ink); cursor:pointer; }.explorer-detail-row[aria-pressed="true"] { background:#f2f4eb; }.explorer-detail-row small { display:block; font-size:10px; color:var(--muted); line-height:1.6; margin-top:5px; }.explorer-detail-row strong { font-size:13px; color:var(--brand); white-space:nowrap; font-weight:600; }.explorer-detail .btn { padding:12px 18px; font-size:14px; }.explorer-community { display:block; color:var(--brand); font-size:12px; margin-top:17px; }.explorer-agent-intro { display:flex; align-items:center; gap:18px; margin:24px 0; }.explorer-agent-intro img { border-radius:20px; }.explorer-agent-intro h3,.explorer-agent-empty h3 { font-size:24px; letter-spacing:-.04em; margin:0 0 10px; }.explorer-agent-intro p,.explorer-agent-empty p { color:var(--muted); font-size:14px; line-height:1.7; }.explorer-agent-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }.explorer-agent-grid > a { padding:24px; border:1px solid var(--line); border-radius:22px; background:var(--card); color:var(--ink); text-decoration:none; }.explorer-agent-grid h3 { font-size:22px; margin:18px 0 12px; }.explorer-agent-grid p { font-size:14px; line-height:1.7; color:var(--muted); }.explorer-agent-grid a > span:last-child { font-size:12px; color:var(--brand); }.explorer-agent-empty { border:1px dashed var(--line); border-radius:22px; text-align:center; padding:32px; }.explorer-agent-empty img { border-radius:20px; margin-bottom:20px; }.topic-explorer [hidden] { display:none!important; }.topic-explorer button:focus-visible,.topic-explorer a:focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
@media(max-width:800px) { .explorer-grid { grid-template-columns:1fr; }.explorer-agent-grid { grid-template-columns:1fr; } }
@media(max-width:640px) { .explorer-control-row { gap:10px; }.explorer-label { width:100%; }.explorer-topics button,.explorer-keywords button { font-size:12px;padding:9px 12px; }.explorer-race,.explorer-detail { padding:20px; }.explorer-race h3 { font-size:25px; }.explorer-app-head h3 { font-size:21px; }.explorer-marker { padding:0 8px; }.explorer-agent-intro { align-items:flex-start; } }
@media(prefers-reduced-motion:reduce) { .explorer-auto .explorer-marker { transition:none; } }
@media(max-width:640px) { .explorer-topics button,.explorer-keywords button { padding-inline:8px; }.explorer-controls { gap:13px; } }
