/* One visual language for the public site, writing tools and research workspace.
   Loaded after feature styles so existing documents receive the new appearance. */
:root {
  --bg:#eef2f1; --surface:#ffffff; --surface-alt:#f5f8f7;
  --ink:#172d3a; --muted:#526b75; --line:#d4e0dc;
  --accent:#236655; --accent-hover:#174b40; --on-accent:#ffffff;
  --soft:#e8f3ee; --gold:#a47b37; --gold-soft:#faf1df;
  --hero:#173d36; --hero-ink:#f4faf6; --hero-muted:#c3dbd1;
  --shadow:0 4px 16px #173d3607,0 1px 3px #173d3605;
  --radius:14px;
}
html[data-theme=dark] {
  --bg:#101b23; --surface:#192932; --surface-alt:#1d3038;
  --ink:#e9f2f0; --muted:#aac3c7; --line:#365059;
  --accent:#9cdbbb; --accent-hover:#c0eed3; --on-accent:#12392f;
  --soft:#24453e; --gold:#e4c185; --gold-soft:#3a3427;
  --hero:#173d36; --hero-ink:#f4faf6; --hero-muted:#c3dbd1;
  --shadow:0 4px 16px #0002;
}
body { background:var(--bg); }
.public-shell { background:var(--bg); }
::selection { background:#c7dfcc; color:#15392f; }
.brand-icon { background:linear-gradient(135deg,#236655,#172d3a); box-shadow:0 3px 10px #173d361c; border:1px solid #fff3; border-radius:12px; }
.brand-icon span { background:#dfba75; }
.brand small { font-size:11px; }
.button:not(.secondary):not(.danger),button[type=submit]:not(.secondary):not(.danger) { box-shadow:0 3px 9px #173d3614; }
.button.secondary { background:var(--surface-alt); border-color:var(--line); }
.icon-tile,.avatar,.record-icon,.blog-stat-icon { border:1px solid color-mix(in srgb,var(--accent) 12%,var(--line)); }
.tags span,.status { border:1px solid color-mix(in srgb,currentColor 13%,transparent); }
.public-header { min-height:84px; padding:16px max(24px,calc((100vw - 1180px)/2)); gap:20px; background:var(--surface); box-shadow:0 3px 14px #173d3605; }
.public-header nav { gap:6px; }
.public-header nav a { padding:8px 12px; border-radius:8px; font-size:13px; font-weight:600; color:var(--muted); }
.public-header nav a:hover,.public-header nav [aria-current=page] { background:var(--soft); color:var(--accent); }
.public-header nav [aria-current=page] { box-shadow:inset 0 -2px var(--accent); }
.public-shell main { max-width:1240px; padding:24px 30px 40px; }
.public-shell .app-footer { padding:22px max(24px,calc((100vw - 1180px)/2)); background:var(--surface); }
.public-shell .page-heading,.welcome-heading,.blog-masthead {
  padding:24px; border:1px solid #456d62; border-radius:var(--radius);
  background:var(--hero) url("math-field.43c063ebaed3.svg") no-repeat left center/auto 100%;
  color:var(--hero-ink); position:relative; isolation:isolate;
}
html[dir=ltr] :is(.public-shell .page-heading,.welcome-heading,.blog-masthead) { background-position:right center; }
:is(.public-shell .page-heading,.welcome-heading,.blog-masthead) :is(.eyebrow,.blog-eyebrow,.page-description,.today) { color:var(--hero-muted); }
:is(.public-shell .page-heading,.welcome-heading,.blog-masthead) h1 { color:var(--hero-ink); font-weight:850; }
.blog-masthead h1 { font-size:clamp(30px,3.2vw,44px); }
.blog-masthead p:not(.blog-eyebrow) { color:var(--hero-muted); font-size:15px; }
.blog-masthead .blog-rss { color:var(--hero-muted); }
:is(.public-shell .page-heading,.welcome-heading,.blog-masthead) .secondary { background:#f4faf6; color:#173d36; border-color:#d2e4db; }
.welcome-heading { margin-bottom:18px; min-height:144px; }
.welcome-heading h1 { font-size:28px; }
.welcome-heading .today { padding:14px; border:1px solid #ffffff25; border-radius:10px; background:#173d3680; }
.panel,.card,.stat-card,.blog-stats>a,.blog-posts-panel,.blog-writing-canvas,.blog-side-panel,.hs-outline,.hs-inspector { box-shadow:var(--shadow); border-color:var(--line); }
.panel,.card { padding:21px; }
.panel-heading { padding-bottom:12px; border-bottom:1px solid var(--line); }
.panel-heading h2 { font-size:18px; }
.stat-grid,.dashboard-columns { gap:14px; }
.stat-card,.blog-stats>a { border-top:3px solid var(--accent); }
.stat-card:nth-child(2),.blog-stats>a:nth-child(2) { border-top-color:#62889e; }
.stat-card:nth-child(3),.blog-stats>a:nth-child(3) { border-top-color:var(--gold); }
.stat-card:nth-child(4) { border-top-color:#8b91ae; }
.stat-card:hover { background:var(--surface-alt); }
.sidebar { padding-top:22px; background:var(--surface); }
.sidebar>.brand { padding-bottom:22px; }
.sidebar-link { font-size:12px; padding:9px 11px; }
.sidebar-link.is-active { box-shadow:inset 3px 0 var(--accent); border:1px solid color-mix(in srgb,var(--accent) 20%,var(--line)); }
html[dir=rtl] .sidebar-link.is-active { box-shadow:inset -3px 0 var(--accent); }
.app-topbar { height:70px; background:var(--surface); box-shadow:0 2px 12px #173d3604; }
.workspace-shell main { padding-top:24px; }
.resource-card { overflow:hidden; transition:box-shadow .18s,border-color .18s; }
.resource-card:hover,.blog-card:hover { border-color:var(--accent); box-shadow:0 6px 22px #173d3612; }
.resource-card h3 { font-size:18px; line-height:1.7; }
.resource-card>.card-top { margin-bottom:12px; }
.research-card-art { height:136px; margin:-21px -21px 18px; position:relative; overflow:hidden; display:flex; align-items:center; padding:20px; background:var(--hero); color:#c6e5d2; }
.research-card-art .research-math-art { position:absolute; inset-inline-end:-10px; top:-45px; width:245px; height:220px; opacity:.8; }
.research-card-art>span { position:relative; z-index:1; font-weight:750; border:1px solid #fff3; padding:5px 12px; border-radius:7px; background:#173d3666; color:#fff; }
.record-kind-project .research-card-art,.record-kind-project .record-art-fallback { background:#233d50; color:#bedae3; }
.math-gold { color:#d7b67a; }
.blog-masthead { margin-bottom:18px; }
.blog-category-nav { background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:9px; margin-bottom:20px; }
.blog-category-nav .is-active { background:var(--accent); color:var(--on-accent); }
.blog-featured { border-radius:var(--radius); margin-bottom:30px; box-shadow:var(--shadow); }
.blog-featured-copy { background:var(--surface); }
.blog-card-grid { gap:16px; }
.blog-card { box-shadow:var(--shadow); border-radius:var(--radius); }
.blog-art-fallback { background:linear-gradient(125deg,#173d36,#294958); color:#cfdeca; }
.blog-art-fallback .blog-art-orbit { opacity:.35; }
.blog-art-fallback .blog-art-label { color:#e5c78e; }
.blog-art-fallback .blog-art-mark { color:#e1eee5; opacity:.85; }
.blog-card-copy { padding:18px; }
.blog-card-meta { font-size:11px; }
.blog-article-header { border-inline-start:4px solid var(--gold); padding-inline-start:22px; }
.blog-article-deck { color:var(--muted); }
.blog-topics { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
.blog-toc { background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:18px; }
.blog-reader-controls { background:var(--surface-alt); border-radius:10px; padding:3px; }
.hs-toolbar { border-radius:10px; box-shadow:var(--shadow); }
.hs-outline,.hs-inspector { border-radius:10px; }
.hs-panel-title { border-bottom:1px solid var(--line); padding-bottom:10px; }
.hs-palette button { background:var(--surface-alt); }
.hs-palette button:hover { background:var(--soft); border-color:var(--accent); color:var(--accent); }
/* Homepage modules use the same surfaces, type hierarchy and accents. */
.homepage-shell #main { padding:20px 24px 30px; }
.homepage-shell .public-header { min-height:84px; padding-block:16px; }
.home-document { --home-paper:var(--surface); --home-accent-readable:var(--home-accent); }
html[data-theme=dark] .home-document { --home-accent-readable:color-mix(in srgb,var(--home-accent) 45%,#d5f5dd); }
.home-bg-grid { background-image:none; }
.home-bg-paper { background:var(--surface-alt); }
.home-block { box-shadow:var(--shadow); border-color:var(--line); container-type:inline-size; }
.home-skin-plain,.home-type-separator { box-shadow:none; }
.home-skin-plain { border-color:transparent; }
.home-block a { color:var(--home-accent-readable); }
.home-block-heading { padding-bottom:12px; border-bottom:1px solid var(--line); margin-bottom:14px; }
.home-block-heading h2 { font-size:1.2em; font-weight:800; position:relative; padding-inline-start:13px; }
.home-block-heading h2:before { content:''; width:4px; height:18px; border-radius:2px; background:var(--gold); position:absolute; inset-inline-start:0; top:50%; transform:translateY(-50%); }
.home-block-heading>a { font-size:.82em; font-weight:650; }
.home-type-hero { overflow:hidden; }
.home-type-hero.home-skin-tint,.home-type-hero.home-skin-ink {
  background:linear-gradient(125deg,#17303b,color-mix(in srgb,var(--home-accent) 75%,#102a22));
  --ink:#f4faf6; --muted:#c3dbd1; --line:#ffffff26;
  --home-accent-readable:#d0ead6; color:var(--ink); border-color:#456d62;
}
.home-intro { grid-template-columns:minmax(0,1.3fr) minmax(160px,.9fr); gap:20px; min-height:260px; }
.home-intro h1 { font-size:clamp(26px,3vw,40px); line-height:1.45; font-weight:900; margin:14px 0; color:var(--ink); }
.home-coordinate { font-family:inherit; display:flex; align-items:center; gap:7px; font-size:.78em; font-weight:650; letter-spacing:0; direction:inherit; opacity:1; color:var(--gold); }
.home-type-hero:is(.home-skin-tint,.home-skin-ink) .home-coordinate { color:#dfc28e; }
.home-intro .home-prose { font-size:1em; color:var(--muted); line-height:1.9; }
.home-intro-copy { min-width:0; }
.home-visual { position:relative; align-self:stretch; display:flex; align-items:center; justify-content:center; min-width:0; color:var(--home-accent-readable); background:linear-gradient(150deg,#ffffff0a,#ffffff02); border:1px solid var(--line); border-radius:calc(var(--home-radius) * .8); padding:6px; }
.research-math-art { width:100%; max-width:360px; height:auto; display:block; }
.home-visual .research-math-art { min-height:180px; }
.home-image-start { grid-template-columns:minmax(160px,.9fr) minmax(0,1.3fr); }
.home-image-start .home-visual { grid-column:1; grid-row:1; }
.home-image-start .home-intro-copy { grid-column:2; }
.home-portrait { height:var(--home-height); max-height:350px; width:100%; border-radius:calc(var(--home-radius) * .65); }
.home-intro .home-link-list { margin-top:16px; gap:8px; }
.home-intro .home-link-list a { border:1px solid var(--line); background:#ffffff0b; border-radius:8px; padding:7px 12px; font-size:.84em; }
.home-intro .home-link-list a:hover { background:#ffffff18; }
.home-record { padding:14px 0; gap:12px; }
.home-record-index { font-family:inherit; color:var(--home-accent-readable); padding:10px; display:grid; place-items:center; background:var(--surface-alt); border:1px solid var(--line); border-radius:10px; }
.home-skin-ink { --home-accent-readable:#c4dfc6; --surface-alt:#203c32; --gold:#e4c185; }
.home-record-kicker { display:flex; align-items:center; justify-content:space-between; gap:6px; color:var(--home-accent-readable); font-size:.7em; font-weight:650; margin:0 0 4px; }
.home-record-kicker span:last-child:not(:first-child) { color:var(--gold); display:flex; align-items:center; gap:3px; }
.home-record h3 { font-size:1.02em; font-weight:750; line-height:1.7; }
.home-record h3 a { color:var(--ink); }
.home-record h3 a:hover { color:var(--home-accent-readable); }
.home-record p { font-size:.86em; color:var(--muted); line-height:1.85; }
.home-record small { font-size:.75em; }
.home-record-arrow { display:grid; place-items:center; padding:6px; background:var(--surface-alt); border:1px solid var(--line); border-radius:50%; flex-shrink:0; }
.home-records-cards { gap:12px; }
.home-records-cards .home-record { border:1px solid var(--line); border-radius:calc(var(--home-radius) * .8); padding:0; display:flex; flex-direction:column; overflow:hidden; background:var(--surface); }
.home-records-cards .home-record:first-child { border-inline-start:1px solid var(--line); }
.home-records-cards .home-record-copy { width:100%; padding:14px; }
.home-records-cards .home-record-arrow { margin:0 14px 14px; align-self:flex-end; }
.home-record-art { height:150px; position:relative; display:flex; width:100%; flex-shrink:0; overflow:hidden; background:#173d36; color:#c6e5d2!important; }
.home-record-art img { width:100%; height:100%; object-fit:cover; }
.home-record-art .research-math-art { position:absolute; width:250px; max-width:none; inset-inline-end:-25px; top:-45px; }
.home-record-art>span { position:absolute; inset-inline-start:14px; bottom:12px; background:#173d3699; border:1px solid #ffffff30; padding:4px 8px; border-radius:6px; font-size:.72em; color:#f4faf6; }
.home-records-cards .home-record:nth-child(2n) .record-art-fallback { background:#233d50; color:#bedae3!important; }
.home-records-cards .home-record:nth-child(3n) .record-art-fallback { background:#594934; color:#f0dfb9!important; }
.home-link-list a { padding:11px 8px; font-size:.93em; font-weight:600; }
.home-type-links .home-link-list a:hover { background:var(--surface-alt); border-radius:7px; }
.home-type-links .home-link-list .icon { width:25px; height:25px; padding:4px; background:var(--soft); border-radius:6px; }
.home-type-equation.home-skin-ink { background:linear-gradient(145deg,#173d36,#203449); }
.home-equation { padding:20px 0; font-size:1.1em; }
.home-stats { flex-wrap:wrap; }
.home-stats>div { padding:14px; background:var(--surface-alt); border:1px solid var(--line); border-radius:10px; flex:1; }
.home-stats strong { color:var(--home-accent-readable); font-weight:750; }
.home-type-separator { padding-block:3px; }
.home-gallery img,.home-figure>img,.home-slide>img { border:1px solid var(--line); }
.home-tabs button[aria-selected=true] { color:var(--home-accent-readable); border-color:var(--home-accent-readable); }
.home-edit-bar { background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:8px 12px; }
#hs-canvas .home-intro { grid-template-columns:minmax(0,1fr) minmax(80px,.7fr); min-height:200px; }
#hs-canvas .home-image-start { grid-template-columns:minmax(80px,.7fr) minmax(0,1fr); }
#hs-canvas .home-intro h1 { font-size:1.8em; }
#hs-canvas .home-visual .research-math-art { min-height:100px; }
#hs-canvas .home-records-cards { grid-template-columns:1fr; }
/* A narrow module should work even on a wide monitor. */
@container (max-width:440px) {
  .home-intro,#hs-canvas .home-intro { grid-template-columns:1fr; gap:16px; }
  .home-image-start .home-intro-copy { grid-column:1; grid-row:auto; }
  .home-image-start .home-visual { grid-column:1; grid-row:auto; }
  .home-visual { max-height:190px; }
  .home-visual .research-math-art { max-width:245px; }
  .home-intro h1 { font-size:1.9em; }
  .home-records-cards { grid-template-columns:1fr; }
  .home-records-cards .home-record { flex-direction:row; flex-wrap:wrap; }
  .home-records-cards .home-record-art { height:120px; }
  .home-records-cards .home-record-copy { padding:12px; }
  .home-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:1050px) {
  .public-header { flex-wrap:wrap; gap:12px; padding-inline:24px; }
  .public-header nav { order:3; width:100%; border-top:1px solid var(--line); padding-top:8px; }
  .public-header nav a { padding:6px 10px; font-size:12px; }
}
@media (max-width:800px) {
  .public-shell main,.homepage-shell #main { padding:16px 12px 30px; }
  .public-header { padding:14px 16px!important; }
  .brand { font-size:18px; }
  .brand small { font-size:10px; }
  .public-header .brand-icon { width:37px; height:37px; }
  .public-header .topbar-actions { gap:3px; }
  .public-header .button-small { padding-inline:9px; font-size:10px; }
  .public-header nav { flex-wrap:nowrap; overflow:auto; scrollbar-width:thin; }
  .public-header nav a { white-space:nowrap; flex-shrink:0; }
  .public-shell .page-heading,.welcome-heading,.blog-masthead { padding:20px; background-size:auto 100%; }
  .welcome-heading { align-items:start; gap:12px; }
  .welcome-heading h1 { font-size:24px; }
  .welcome-heading .today { padding:8px; font-size:10px; }
  .home-intro { grid-template-columns:minmax(0,1.3fr) minmax(100px,.7fr); }
  .home-image-start { grid-template-columns:minmax(100px,.7fr) minmax(0,1.3fr); }
  .home-records-cards .home-record { padding:0; border:1px solid var(--line); }
  .home-records-cards .home-record:first-child { border:1px solid var(--line); }
  .home-block-heading h2 { font-size:1.12em; }
  .panel,.card { padding:18px; }
  .research-card-art { margin:-18px -18px 16px; }
  .public-shell .app-footer { padding-inline:16px; }
  .app-topbar { height:62px; }
  .blog-masthead h1 { font-size:29px; }
  .blog-masthead-actions { flex-wrap:wrap; }
  .blog-article-header { padding-inline-start:16px; }
}
@media (max-width:460px) {
  .home-intro,.home-image-start { grid-template-columns:1fr; gap:16px; }
  .home-image-start .home-visual,.home-image-start .home-intro-copy { grid-column:1; grid-row:auto; }
  .home-intro h1 { font-size:28px; }
  .home-visual { max-height:190px; }
  .home-visual .research-math-art { max-width:245px; }
  .welcome-heading { flex-direction:column; }
  .welcome-heading .today { display:flex; align-items:center; gap:6px; border:0; background:none; padding:0; }
  .welcome-heading .today br { display:none; }
  .home-record-index { padding:7px; }
  .home-records-cards .home-record-art { height:140px; }
}
@media (prefers-reduced-motion:reduce) {
  .resource-card,.blog-card { transition:none; }
  .blog-card:hover { transform:none; }
}
@media print {
  body,.public-shell { background:white; color:#172d3a; }
  .public-shell .page-heading,.welcome-heading,.blog-masthead { background:white; color:#172d3a; border-color:#ccc; }
  :is(.public-shell .page-heading,.welcome-heading,.blog-masthead) :is(h1,.eyebrow,.blog-eyebrow,.page-description,.today) { color:#172d3a; }
  .home-type-hero.home-skin-tint,.home-type-hero.home-skin-ink { background:white; color:#172d3a; --ink:#172d3a; --muted:#526b75; }
  .home-block,.panel,.card { box-shadow:none; }
}
.home-bg-grid { background-image:linear-gradient(color-mix(in srgb,var(--line) 35%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--line) 35%,transparent) 1px,transparent 1px); background-size:32px 32px; }
.research-math-art { direction:ltr; }