/* Public indexable pages. Independent of the signed-in SPA, matching the site palette.
   All pages are usable without JavaScript and remain readable at 320px. */
html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans,system-ui,sans-serif);line-height:1.68}
*,*:before,*:after{box-sizing:border-box}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
a:focus-visible{outline:3px solid var(--brand);outline-offset:3px}
.skip-link{position:absolute;top:-100px;left:16px;background:var(--surface);padding:12px;z-index:5}
.skip-link:focus{top:10px}
.public-header{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1160px;margin:auto;padding:19px 23px;border-bottom:1px solid var(--line)}
.site-wordmark{font:650 1.65rem var(--serif,Georgia,serif);letter-spacing:-.04em}
.public-header nav{display:flex;align-items:center;gap:10px 23px;flex-wrap:wrap}
.public-header nav a{color:var(--muted);font-size:.87rem}
.public-header nav a:hover{color:var(--brand)}
.public-main{max-width:1000px;padding:25px clamp(18px,4vw,38px) 70px;margin:auto}
.public-content{min-width:0}
.breadcrumbs{display:flex;gap:11px;flex-wrap:wrap;align-items:center;margin-bottom:25px;font-size:.8rem;color:var(--muted)}
h1,h2,h3{overflow-wrap:anywhere}
h1{font:600 clamp(2rem,5vw,3rem)/1.18 var(--serif,Georgia,serif);max-width:23ch;margin:12px 0 23px}
h2{font:600 1.62rem/1.3 var(--serif,Georgia,serif);margin:35px 0 15px}
h3{font-size:1.12rem;line-height:1.4;margin:0 0 8px}
p{margin:12px 0;max-width:75ch}
.public-collection{display:grid;gap:0;margin:24px 0;border-top:1px solid var(--line)}
.public-item{border-bottom:1px solid var(--line);padding:18px 4px;overflow-wrap:anywhere}
.public-item h3{font-size:1.1rem}
.public-item h3 a:hover{color:var(--brand)}
.public-item p{font-size:.9rem;color:var(--muted);line-height:1.6;margin-top:7px}
.public-item small{display:block;color:var(--muted);margin-top:8px;font-size:.8rem}
.public-note{font-size:.88rem;color:var(--muted);max-width:75ch}
.post{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:clamp(18px,3vw,28px);margin:19px 0;min-width:0}
.post header{display:flex;align-items:center;flex-wrap:wrap;gap:12px;font-size:.82rem;border-bottom:1px solid var(--line);padding-bottom:13px;margin-bottom:16px;color:var(--muted)}
.post-author{font-weight:700;color:var(--ink)}
.post-text{font-size:1rem;line-height:1.8;overflow-wrap:anywhere}
.public-cta{display:inline-flex;align-items:center;min-height:44px;padding:11px 18px;border-radius:10px;background:var(--lavender);color:var(--brand);font-weight:650;font-size:.88rem}
.public-cta:hover{background:var(--brand);color:var(--surface);text-decoration:none}
.page-switch{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin:22px 0}
.page-switch a{display:inline-flex;align-items:center;min-height:44px;padding:10px 15px;border:1px solid var(--line);border-radius:9px}
.public-footer{border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:13px 23px;justify-content:center;align-items:center;padding:26px 20px 40px;font-size:.78rem;color:var(--muted);text-align:center}
@media(max-width:690px){
 .public-header{align-items:flex-start;flex-direction:column;gap:12px;padding:17px 16px}
 .site-wordmark{font-size:1.45rem}
 .public-header nav{gap:9px 16px}
 .public-header nav a{min-height:36px;display:flex;align-items:center;font-size:.82rem}
 .public-main{padding-block:19px 55px}
 .breadcrumbs{margin-bottom:18px}
 h1{font-size:clamp(1.8rem,8vw,2.4rem)}
 .post-text{font-size:1rem}
}


/* Reader hub: substantive, author-authentic reviews and linked discussion. */
.public-reader-search{max-width:680px;padding:17px 20px 19px;border:1px solid var(--line);border-radius:12px;background:var(--surface);margin:25px 0 20px}
.public-reader-search label{display:block;font-weight:650;font-size:.9rem;margin-bottom:10px}
.public-reader-search .search-line{display:flex;gap:10px;min-width:0}
.public-reader-search input{flex:1 1 0;min-width:0;min-height:44px;padding:10px 13px;border:1px solid var(--line);border-radius:8px;font:inherit;background:var(--bg);color:var(--ink);font-size:1rem}
.public-reader-search button{min-height:44px;padding:10px 15px;cursor:pointer;border:0;border-radius:8px;background:var(--lavender);color:var(--brand);font:600 .9rem var(--sans,system-ui,sans-serif)}
.reader-seo-kicker{font-size:.75rem;letter-spacing:.09em;text-transform:uppercase;color:var(--brand);font-weight:650}
.reader-seo-overview{font-size:1rem;line-height:1.75;max-width:76ch}
.reader-seo-jump{display:flex;flex-wrap:wrap;gap:10px;margin:21px 0 28px}
.reader-seo-jump a{display:inline-flex;align-items:center;min-height:44px;padding:10px 14px;border-radius:9px;border:1px solid var(--line);font-size:.9rem}
.reader-seo-section{scroll-margin-top:20px;max-width:100%;margin:29px 0}
.reader-seo-section>p{font-size:.9rem;color:var(--muted)}
.reader-seo-invite{border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:24px;margin:35px 0 20px}
.reader-seo-invite h2{margin-top:0}
.reader-seo-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:18px}
.reader-seo-actions>a{min-height:44px;display:inline-flex;align-items:center}
.reader-seo-related{border-top:1px solid var(--line);margin-top:35px;padding-top:12px}
@media(max-width:600px){
 .public-reader-search{padding:15px}
 .public-reader-search .search-line{flex-wrap:wrap}
 .public-reader-search .search-line button{width:100%}
 .reader-seo-invite{padding:19px 16px}
 .reader-seo-jump a{font-size:.85rem}
}

.editorial-page{max-width:830px}
.editorial-page .editorial-lead{font:400 clamp(1.08rem,2.2vw,1.35rem)/1.75 var(--serif,Georgia,serif);color:var(--muted);margin:12px 0 30px}
.editorial-page section{margin:30px 0}
.editorial-page section p{line-height:1.85}
.editorial-links{border-top:1px solid var(--line);padding-top:21px;margin-top:35px;display:flex;flex-wrap:wrap;gap:12px}
.editorial-links a{display:inline-flex;min-height:44px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:10px 13px;font-size:.88rem}