/* Interior pages: organization, products and documentation.
   Home keeps its existing stylesheet; no late cascade overrides are needed here. */
@import url("https://fonts.googleapis.com/css2?family=BIZ+UDPGothic:wght@400;700&display=swap");

:root {
  color-scheme:light dark;
  --bg:#fff;
  --canvas:#f2f5f7;
  --surface:#fff;
  --ink:#203344;
  --muted:#586570;
  --line:#d9e0e5;
  --accent:#234b68;
  --selected:#e7eff6;
  --max:1160px;
  --sans:"BIZ UDPGothic",-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue","Hiragino Sans","Yu Gothic",sans-serif;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:100px;
}
body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font:16px/1.85 var(--sans);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4 {
  margin:0;
  font-weight:650;
  line-height:1.5;
  letter-spacing:0;
}
h1 {
  font-size:clamp(32px,3.2vw,46px);
}
h2 {
  font-size:27px;
}
h3 {
  font-size:20px;
}
p {
  margin:0 0 18px;
}
a {
  color:var(--accent);
  text-underline-offset:4px;
}
a:hover {
  text-decoration-thickness:2px;
}
img {
  max-width:100%;
  height:auto;
}
button,input,select,textarea {
  font:inherit;
}
button,a,input,select,summary {
  touch-action:manipulation;
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:4px;
}
[hidden] {
  display:none!important;
}
main,section,article,aside,nav,figure,div {
  min-width:0;
}
section[id],h2[id],h3[id] {
  scroll-margin-top:100px;
}
.skip-link {
  position:fixed;
  top:10px;
  left:16px;
  z-index:100;
  padding:8px 16px;
  background:var(--ink);
  color:var(--bg);
  transform:translateY(-160%);
}
.skip-link:focus {
  transform:none;
}
.site-header,.site-footer {
  padding-inline:max(24px,calc((100% - var(--max))/2));
}
.site-header {
  min-height:80px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-bottom:1px solid var(--line);
  position:relative;
  z-index:30;
  background:var(--bg);
}
.brand,.footer-brand,.docs-brand {
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:var(--ink);
  text-decoration:none;
  white-space:nowrap;
  font-size:19px;
  font-weight:650;
}
.brand-logo {
  width:auto;
  height:28px;
  max-width:40px;
  object-fit:contain;
}
.site-nav,.footer-nav {
  display:flex;
  align-items:center;
  gap:12px;
}
.site-nav a,.footer-nav a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:6px 8px;
  color:var(--muted);
  font-size:14px;
  text-decoration:none;
}
.site-nav a[aria-current],.site-nav a:hover,.footer-nav a:hover {
  color:var(--accent);
  text-decoration:underline;
  text-underline-offset:7px;
}
.site-nav-mobile-toggle {
  display:none;
}
.external::after {
  content:" ↗";
  font-size:.8em;
}
.site-main {
  max-width:var(--max);
  width:calc(100% - 48px);
  margin-inline:auto;
  padding-bottom:72px;
}
.site-footer {
  display:flex;
  justify-content:space-between;
  gap:32px;
  padding-block:32px;
  border-top:1px solid var(--line);
}
.footer-nav {
  align-self:flex-start;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.footer-meta,.footer-legal {
  font-size:12px;
  color:var(--muted);
  margin:8px 0 0;
}
.footer-legal {
  max-width:540px;
  line-height:1.7;
}
.footer-brand {
  font-size:16px;
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  border:1px solid var(--line);
  padding:9px 20px;
  border-radius:3px;
  font-size:14px;
  font-weight:550;
  text-decoration:none;
  cursor:pointer;
  background:var(--bg);
  color:var(--accent);
}
.button.primary {
  background:var(--accent);
  color:var(--bg);
  border-color:var(--accent);
}
.button:hover {
  background:var(--selected);
  color:var(--ink);
}
.button.primary:hover {
  background:var(--ink);
  color:var(--bg);
}
.action-row,.hero-actions,.docs-hero-actions {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 20px;
  margin-top:24px;
}
.text-link {
  font-size:14px;
  font-weight:550;
}
.has-arrow::after {
  content:" →";
}
.breadcrumb,.docs-breadcrumb {
  font-size:13px;
  color:var(--muted);
  margin:0 0 24px;
}
.hero-lead {
  font-size:20px;
  line-height:1.8;
  max-width:680px;
  margin:16px 0 0;
}
.inner-hero,.page-intro,.projects-intro {
  padding:32px 0;
  border-bottom:1px solid var(--line);
}
.page-intro-copy, .inner-hero > div:first-child {
  display: grid;
  grid-template-columns: minmax(220px, .65fr) minmax(0, 1fr);
  gap: 12px 44px;
  align-items: baseline;
}
.page-intro-copy > .breadcrumb, .inner-hero > div > .breadcrumb { grid-column: 1 / -1; margin-bottom: 8px; }
.page-intro-copy > .hero-lead, .inner-hero > div > .hero-lead { margin: 0; font-size: 17px; }
/* Organization pages */
.organization-hero {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:56px;
  align-items:center;
  padding:48px 0 56px;
  border-bottom:1px solid var(--line);
}
.organization-introduction {
  border-left:1px solid var(--line);
  padding-left:40px;
}
.organization-introduction p:last-child {
  margin-bottom:0;
}
.organization-row {
  display:grid;
  grid-template-columns:34% minmax(0,1fr);
  gap:40px;
  padding:44px 0;
  border-bottom:1px solid var(--line);
}
.organization-row p:last-child {
  margin-bottom:0;
}
.organization-activities {
  padding:36px 0;
}
.organization-activities>h2 {
  margin-bottom:24px;
}
.activity-row {
  display:grid;
  grid-template-columns:34% minmax(0,1fr);
  gap:40px;
  border-top:1px solid var(--line);
  padding:24px 0;
}
.activity-row p {
  margin:0;
}
.activity-row h3 {
  font-size:23px;
}
.organization-band {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  background:var(--canvas);
  padding:36px;
  margin-block:12px;
}
.organization-band section+section {
  padding-left:36px;
  border-left:1px solid var(--line);
}
.organization-band h2 {
  margin-bottom:18px;
}
.organization-band p:last-child {
  margin:0;
}
.next-page {
  display:flex;
  flex-wrap:wrap;
  gap:16px 28px;
  padding-top:24px;
  margin-top:32px;
  border-top:1px solid var(--line);
  font-size:14px;
}
.principles-section {
  padding-top:8px;
}
.principle-card {
  display:grid;
  grid-template-columns:200px minmax(0,1fr) 260px;
  gap:32px;
  padding:36px 0;
  border-bottom:1px solid var(--line);
}
.principle-card p {
  margin:0;
}
.principle-check {
  border-left:3px solid var(--accent);
  padding-left:20px;
  font-weight:550;
}
.principles-checklist {
  margin-top:48px;
  padding:36px;
  background:var(--canvas);
}
.principles-checklist h2 {
  margin-bottom:20px;
}
.principles-checklist ul {
  list-style:none;
  margin:0;
  padding:0;
}
.principles-checklist li {
  display:grid;
  grid-template-columns:200px 1fr;
  gap:24px;
  padding:16px 0;
  border-top:1px solid var(--line);
}
.contribution-content {
  padding-top:36px;
}
.contribution-article>.lead-copy {
  font-size:19px;
  max-width:760px;
}
.contribution-article>.article-section {
  margin-top:36px;
  display:flow-root;
}
.article-lead-media figcaption {
  font-size:11px;
}
.contribution-article h2 {
  margin-bottom:24px;
}
.contribution-article .rule-item {
  display:grid;
  grid-template-columns:34% 1fr;
  gap:40px;
  padding:24px 0;
  border-top:1px solid var(--line);
}
.contribution-article .rule-item p {
  margin:0;
}
.contribution-article .article-section:last-child {
  background:var(--canvas);
  padding:32px;
}
.link-list {
  display:grid;
  gap:0;
  margin:24px 0;
}
.link-list a {
  display:block;
  padding:12px 0;
  border-bottom:1px solid var(--line);
  font-size:15px;
}
.notice,.legal-warning {
  margin:24px 0;
  padding:18px 22px;
  border-left:3px solid var(--accent);
  background:var(--canvas);
}
.notice p,.legal-warning p {
  margin:0;
}
.quote-block {
  padding:12px 0 12px 24px;
  border-left:3px solid var(--accent);
  margin:24px 0;
}
.quote-block p {
  margin:0;
}
/* Product directory and introductions */
.project-directory-index {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 32px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}
.project-directory-index a { font-size: 14px; text-decoration: none; }
.project-directory-index a:hover { text-decoration: underline; }
.project-directory-row {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 48px;
  padding: 40px 0;
  border-bottom: 1px solid var(--line);
  align-items: center;
  scroll-margin-top: 24px;
}
.project-directory-copy h2 { font-size: 32px; }
.project-directory-copy h2 a { color: var(--ink); text-decoration: none; }
.project-directory-copy h2 a:hover { text-decoration: underline; }
.project-directory-copy p { margin: 12px 0 0; font-size: 15px; }
.project-directory-copy .project-directory-summary { font-size: 19px; font-weight: 600; margin-top: 8px; }
.project-directory-facts { margin: 20px 0; font-size: 13px; }
.project-directory-facts > div { display: grid; grid-template-columns: 76px 1fr; gap: 12px; margin-top: 6px; }
.project-directory-facts dt { color: var(--muted); }
.project-directory-facts dd { margin: 0; }
.project-directory-media { background: var(--canvas); margin: 0; padding: 24px; }
.project-directory-media img { display: block; height: 300px; width: 100%; object-fit: contain; }
.project-directory-media img.project-app-icon { width: 128px; height: 128px; margin: 86px auto; }
.project-directory-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; align-items: center; }
.project-directory-gallery--pair { grid-template-columns: repeat(2,minmax(0,1fr)); }
.project-directory-gallery a { display: block; min-width: 0; }
.project-directory-media figcaption { font-size: 12px; color: var(--muted); margin-top: 16px; text-align: center; }
.project-directory-actions { display: flex; gap: 12px 24px; flex-wrap: wrap; align-items: center; margin-top: 24px; }
.project-directory-actions > a:not(.button) { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; }
.project-hero--split {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:64px;
  align-items:center;
  padding:48px 0;
}
.project-hero h1 {
  font-size:48px;
}
.project-catch {
  font-size:24px;
  margin-top:16px;
}
.project-intro {
  font-size:18px;
}
.project-hero-media {
  margin:0;
  padding:28px;
  background:var(--canvas);
}
.project-hero-media>img {
  display:block;
  width:100%;
  max-height:340px;
  object-fit:contain;
}
.project-hero-media>img.project-app-icon {
  width:128px;
  height:128px;
  max-height:none;
  margin:36px auto;
}
.project-hero-media figcaption {
  font-size:12px;
  color:var(--muted);
  margin-top:12px;
}
.product-screen-group {
  display:flex;
  align-items:center;
  gap:12px;
}
.product-screen-group a {
  flex:1;
  min-width:0;
}
.product-screen-group img {
  display:block;
  width:100%;
  height:280px;
  object-fit:contain;
}
.project-subnav {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  padding:12px 0;
  border-block:1px solid var(--line);
}
.project-subnav a {
  font-size:14px;
  min-height:36px;
  display:inline-flex;
  align-items:center;
  text-decoration:none;
}
.project-subnav a[aria-current] {
  text-decoration:underline;
  text-underline-offset:8px;
}
.project-overview {
  display:grid;
  grid-template-columns:34% 1fr;
  gap:40px;
  padding:40px 0;
  border-bottom:1px solid var(--line);
}
.project-journey,.for-series-section,.for-flow-section {
  padding:40px 0;
  border-bottom:1px solid var(--line);
}
.project-journey-heading,.section-header {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:24px;
  margin-bottom:28px;
}
.project-journey-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
}
.project-journey-item {
  margin:0;
  display:flex;
  flex-direction:column;
}
.project-journey-item img {
  height:300px;
  object-fit:contain;
  background:var(--canvas);
  padding:20px;
  order:2;
}
.project-journey-item figcaption {
  margin-bottom:16px;
  display:grid;
  gap:4px;
}
.project-journey-item figcaption span {
  font-size:14px;
  color:var(--muted);
}
.for-series-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:32px;
}
.for-series-card {
  border-top:2px solid var(--accent);
  padding-top:20px;
}
.for-series-card p {
  margin:16px 0;
}
.for-flow-list {
  padding:0;
  margin:0 0 24px;
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
}
.for-flow-list li {
  border-top:1px solid var(--line);
  padding-top:20px;
}
.for-flow-list li>span {
  font-size:13px;
  color:var(--muted);
}
.for-flow-list strong {
  display:block;
  margin:8px 0;
}
.product-reading {
  padding-top:36px;
}
.product-article>.article-section {
  display:grid;
  grid-template-columns:34% 1fr;
  gap:16px 40px;
  margin:32px 0;
}
.product-article>.article-section>h2 {
  grid-column:1;
  grid-row:1 / span 10;
}
.product-article>.article-section>:not(h2) {
  grid-column:2;
}
.product-resources {
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:48px;
  padding:32px;
  background:var(--canvas);
  margin-top:40px;
}
.product-resources h2 {
  font-size:22px;
  margin-bottom:16px;
}
.product-resources nav a {
  display:block;
  padding:8px 0;
}
.product-resources p:last-child {
  margin-bottom:0;
}
/* Policy reading */
.legal-page {
  max-width:860px;
}
.legal-page-header {
  padding:48px 0 32px;
}
.legal-page-lead {
  font-size:18px;
  margin:20px 0;
}
.legal-page-date {
  font-size:13px;
  color:var(--muted);
}
.legal-toc {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 28px;
  background:var(--canvas);
  padding:24px;
  margin-bottom:36px;
}
.legal-toc a {
  font-size:14px;
}
.legal-page-content>section {
  padding:28px 0;
  border-bottom:1px solid var(--line);
}
.legal-page-content h2 {
  font-size:24px;
  margin-bottom:20px;
}
.legal-link-list {
  padding-left:20px;
  font-size:14px;
}
/* Documentation shell: actual content and navigation are static HTML. */
.docs-topbar {
  min-height:72px;
  display:flex;
  align-items:center;
  gap:28px;
  padding:12px 28px;
  border-bottom:1px solid var(--line);
  background:var(--bg);
  position:sticky;
  top:0;
  z-index:30;
}
.docs-title-link {
  margin:auto;
  color:var(--ink);
  font-size:16px;
  text-decoration:none;
}
.docs-top-actions {
  font-size:14px;
}
.docs-layout {
  display:grid;
  grid-template-columns:240px minmax(0,1fr);
  max-width:1600px;
  margin:auto;
  min-height:calc(100vh - 72px);
}
.docs-sidebar {
  background:var(--canvas);
  padding:28px 20px;
  position:sticky;
  top:72px;
  align-self:start;
  height:calc(100vh - 72px);
  overflow-y:auto;
  border-right:1px solid var(--line);
}
.docs-mobile-nav>summary {
  display:none;
}
.docs-back span {
  display:block;
  font-size:12px;
  font-weight:400;
  margin-top:4px;
  color:var(--muted);
}
.docs-back {
  display:block;
  font-size:17px;
  font-weight:650;
  text-decoration:none;
  margin-bottom:20px;
}
.docs-search label {
  display:block;
  font-size:12px;
  margin-bottom:6px;
  color:var(--muted);
}
.docs-search input {
  width:100%;
  min-height:40px;
  border:1px solid var(--line);
  border-radius:3px;
  background:var(--bg);
  color:var(--ink);
  padding:8px 10px;
  font-size:14px;
}
.docs-search [role=status] {
  font-size:12px;
  line-height:1.6;
  margin:8px 0 0;
}
.docs-group {
  margin-top:24px;
}
.docs-group-label {
  font-weight:650;
  font-size:13px;
  margin:0 0 8px;
}
.docs-group a {
  display:block;
  text-decoration:none;
  font-size:14px;
  color:var(--muted);
  padding:7px 10px;
  border-left:3px solid transparent;
  line-height:1.65;
}
.docs-group a:hover {
  color:var(--accent);
  background:var(--selected);
}
.docs-group a[aria-current] {
  background:var(--selected);
  border-left-color:var(--accent);
  color:var(--accent);
  font-weight:600;
}
.docs-main {
  padding:36px 32px 72px;
  display:grid;
  grid-template-columns:minmax(0,740px) 180px;
  gap:32px;
  justify-content:center;
}
.docs-page-heading {
  grid-column:1;
  grid-row:1;
}
.docs-page-heading .docs-hero {
  margin-bottom:0;
}
.docs-article {
  grid-column:1;
  grid-row:2;
}
.page-toc {
  grid-column:2;
  grid-row:1 / span 2;
  position:sticky;
  top:108px;
  align-self:start;
  border-left:1px solid var(--line);
  padding-left:20px;
  max-height:calc(100vh - 140px);
  overflow-y:auto;
}
.page-toc summary {
  font-size:13px;
  font-weight:650;
  list-style:none;
  cursor:pointer;
}
.page-toc nav {
  margin-top:12px;
}
.page-toc a {
  display:block;
  padding:5px 0;
  font-size:12px;
  line-height:1.65;
  text-decoration:none;
  color:var(--muted);
}
.page-toc a[aria-current] {
  color:var(--accent);
  font-weight:650;
}
.page-toc a:hover {
  color:var(--accent);
  text-decoration:underline;
}
.docs-hero {
  border-bottom:1px solid var(--line);
  padding-bottom:28px;
  margin-bottom:28px;
}
.docs-hero h1 {
  font-size:34px;
  margin-bottom:12px;
}
.docs-lead {
  font-size:16px;
  color:var(--muted);
  margin:0;
}
.docs-product-heading {
  display:flex;
  flex-wrap:wrap;
  gap:0 .2em;
}
.docs-article p {
  overflow-wrap:break-word;
}
.docs-page-content h2 {
  font-size:24px;
  margin:0 0 16px;
}
.docs-page-content h3 {
  font-size:18px;
  margin:20px 0 10px;
}
.article-section {
  margin-top:36px;
  display:flow-root;
}
.article-lead-media figcaption {
  font-size:11px;
}
.docs-page-content ul,.docs-page-content ol {
  padding-left:24px;
  margin:16px 0 24px;
}
.docs-page-content li {
  margin:6px 0;
}
.docs-purpose-list {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  margin:28px 0 36px;
}
.docs-purpose-list a {
  padding:16px 0;
  border-top:2px solid var(--accent);
  text-decoration:none;
  display:flex;
  flex-direction:column;
}
.docs-purpose-list strong {
  font-size:20px;
}
.docs-purpose-list span {
  font-size:13px;
  color:var(--muted);
  margin-top:8px;
}
.overview-screenshot {
  float:right;
  width:180px;
  margin:0 0 24px 28px;
  padding:12px;
  background:var(--canvas);
}
.overview-screenshot img {
  display:block;
  max-height:260px;
  width:100%;
  object-fit:contain;
}
.docs-page-content::after {
  content:"";
  display:block;
  clear:both;
}
.docs-index {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 24px;
  margin:24px 0;
}
.docs-index a {
  display:flex;
  flex-direction:column;
  padding:16px 0;
  border-top:1px solid var(--line);
  text-decoration:none;
}
.docs-index strong {
  font-size:16px;
}
.docs-index span {
  font-size:13px;
  color:var(--muted);
  margin-top:6px;
}
.docs-facts {
  margin:24px 0;
}
.docs-facts div {
  display:grid;
  grid-template-columns:180px 1fr;
  gap:24px;
  padding:14px 0;
  border-bottom:1px solid var(--line);
}
.docs-facts dt {
  font-weight:600;
}
.docs-facts dd {
  margin:0;
}
.docs-footer {
  border-top:1px solid var(--line);
  padding:24px 28px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:13px;
  color:var(--muted);
}
.docs-footer nav {
  display:flex;
  gap:20px;
}
.document-pagination {
  display:flex;
  justify-content:space-between;
  gap:24px;
  border-top:1px solid var(--line);
  margin-top:48px;
  padding-top:24px;
  clear:both;
}
.document-pagination a {
  display:flex;
  flex-direction:column;
  text-decoration:none;
  max-width:48%;
}
.document-pagination a:last-child {
  text-align:right;
}
.document-pagination span {
  font-size:12px;
  color:var(--muted);
}
.document-pagination strong {
  font-size:15px;
}
/* Article primitives */
.spec-table {
  width:100%;
  border-collapse:collapse;
  font-size:14px;
  line-height:1.8;
  margin:20px 0 28px;
  table-layout:fixed;
}
.spec-table th,.spec-table td {
  padding:12px 14px;
  border:1px solid var(--line);
  text-align:left;
  vertical-align:top;
  overflow-wrap:anywhere;
}
.spec-table th {
  font-weight:550;
  background:var(--canvas);
  width:34%;
}
.code-block {
  font:13px/1.8 ui-monospace,SFMono-Regular,Menlo,monospace;
  background:var(--canvas);
  border:1px solid var(--line);
  padding:20px;
  overflow-x:auto;
  max-width:100%;
  border-radius:3px;
  margin:24px 0;
}
.docs-article :not(pre)>code {
  font: .88em ui-monospace,SFMono-Regular,Menlo,monospace;
  background:var(--canvas);
  padding:2px 4px;
  overflow-wrap:anywhere;
}
.rule-list,.info-grid,.docs-scope-list {
  margin:20px 0;
}
.rule-item,.info-card,.docs-scope-list section {
  padding:20px 0;
  border-top:1px solid var(--line);
}
.rule-item {
  display:flex;
  gap:16px;
}
.rule-item .number {
  flex:none;
  font-size:13px;
  color:var(--muted);
  padding-top:4px;
}
.rule-item h3,.info-card h3,.docs-scope-list h3 {
  margin:0 0 8px;
}
.rule-item p:last-child,.info-card p:last-child,.docs-scope-list p:last-child {
  margin:0;
}
.docs-scope-list section {
  display:grid;
  grid-template-columns:160px 1fr;
  gap:24px;
}
.docs-screenshot {
  margin:24px 0;
  padding:20px;
  background:var(--canvas);
}
.docs-screenshot img {
  display:block;
  width:100%;
  max-height:500px;
  object-fit:contain;
}
.docs-screenshot.is-phone {
  max-width:320px;
}
.docs-screenshot figcaption,.project-preview figcaption {
  font-size:12px;
  color:var(--muted);
  margin-top:12px;
}
.docs-media-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}
.docs-media-grid .docs-screenshot {
  margin:0;
}
.project-preview {
  max-width:320px;
  margin:24px 0;
}
.project-preview img {
  display:block;
  max-height:400px;
  object-fit:contain;
}
.docs-visual {
  padding:20px;
  background:var(--canvas);
  margin:24px 0;
}
.docs-question-card {
  padding:24px;
  background:var(--bg);
  border:1px solid var(--line);
}
.docs-question-card span,.docs-question-card small {
  font-size:12px;
  color:var(--muted);
}
.docs-question-card p {
  font-size:22px;
  margin:16px 0;
}
.inner-hero-note {
  padding-left:20px;
  border-left:3px solid var(--line);
  color:var(--muted);
  font-size:14px;
  margin:20px 0;
}
.lead-copy {
  font-size:18px;
}
.docs-screenshot.article-lead-media {
  float:right;
  width:180px;
  margin:0 0 20px 24px;
  padding:12px;
}
.docs-screenshot.article-lead-media img {
  max-height:280px;
}
/* Question catalog retains all filtering and detail controls. */
.question-catalog-controls {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  background:var(--canvas);
  padding:20px;
  margin:24px 0;
}
.question-catalog-controls label {
  font-size:12px;
  font-weight:600;
  display:grid;
  gap:6px;
}
.question-catalog-controls label:first-child {
  grid-column:1 / -1;
}
.question-catalog-controls input,.question-catalog-controls select {
  width:100%;
  min-height:40px;
  border:1px solid var(--line);
  background:var(--bg);
  color:var(--ink);
  padding:8px;
  font-size:14px;
  border-radius:3px;
}
.question-catalog-status {
  font-size:13px;
  color:var(--muted);
}
.question-entry {
  padding:28px 0;
  border-top:1px solid var(--line);
}
.question-entry header {
  display:flex;
  justify-content:space-between;
  gap:16px;
  font-size:12px;
  color:var(--muted);
}
.question-entry h3 {
  font-size:20px!important;
  margin:14px 0!important;
}
.question-meta,.question-warning {
  font-size:12px;
  color:var(--muted);
  overflow-wrap:anywhere;
}
.question-entry summary {
  cursor:pointer;
  padding:10px 0;
  color:var(--accent);
  font-size:14px;
}
.question-entry details p {
  white-space:pre-line;
}
.question-catalog-empty {
  background:var(--canvas);
  padding:20px;
}
.question-catalog-load {
  margin-top:20px;
  cursor:pointer;
}
@media(prefers-color-scheme:dark) {
  :root {
    --bg:#171d23;
    --canvas:#202932;
    --surface:#171d23;
    --ink:#edf2f6;
    --muted:#b6c2cc;
    --line:#3a4752;
    --accent:#b5d1e6;
    --selected:#293c4c;
  }
}
@media(max-width:1199px) {
  .docs-main {
    grid-template-columns:minmax(0,740px);
  }
  .page-toc {
    grid-column:1;
    grid-row:2;
    position:static;
    max-height:none;
    padding:16px 20px;
    border:1px solid var(--line);
    background:var(--canvas);
  }
  .page-toc summary {
    pointer-events:auto;
    cursor:pointer;
    list-style:revert;
  }
  .page-toc nav {
    display:flex;
    flex-wrap:wrap;
    gap:4px 20px;
  }
  .docs-article {
    grid-row:3;
  }
  .principle-card {
    grid-template-columns:160px 1fr;
  }
  .principle-check {
    grid-column:2;
  }
}
@media(max-width:900px) {
  .organization-hero {
    gap:32px;
  }
  .organization-introduction {
    padding-left:24px;
  }
  .organization-row,.activity-row,.project-overview {
    grid-template-columns:30% 1fr;
    gap:28px;
  }
  .project-hero--split {
    gap:32px;
  }
  .project-directory-row {
    gap:28px;
    grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
  }
  .project-hero h1 {
    font-size:38px;
  }
  .docs-topbar {
    position:relative;
    min-height:72px;
    padding-inline:20px;
    gap:16px;
  }
  .docs-title-link {
    font-size:14px;
  }
  .docs-layout {
    display:block;
  }
  .docs-sidebar {
    position:static;
    height:auto;
    border:0;
    border-bottom:1px solid var(--line);
    padding:10px 20px;
  }
  .docs-mobile-nav>summary {
    display:flex;
    align-items:center;
    min-height:44px;
    cursor:pointer;
    font-size:14px;
    list-style:none;
    font-weight:600;
  }
  .docs-mobile-nav>summary::after {
    content:"＋";
    margin-left:auto;
  }
  .docs-mobile-nav[open]>summary::after {
    content:"−";
  }
  .docs-sidebar-content {
    padding:12px 0 20px;
  }
  .docs-main {
    padding:28px 24px 56px;
    gap:24px;
  }
  .page-toc {
    padding:12px 16px;
  }
  .page-toc details:not([open]) nav {
    display:none;
  }
  .docs-hero h1 {
    font-size:30px;
  }
  .for-flow-list {
    gap:20px;
  }
  .product-article>.article-section {
    grid-template-columns:1fr;
  }
  .product-article>.article-section>h2,.product-article>.article-section>:not(h2) {
    grid-column:1;
    grid-row:auto;
  }
  .product-resources {
    gap:28px;
  }
}
@media(max-width:600px) {
  html {
    scroll-padding-top:24px;
  }
  body {
    font-size:15px;
  }
  section[id],h2[id],h3[id] {
    scroll-margin-top:24px;
  }
  .site-header {
    min-height:68px;
    padding-inline:20px;
  }
  .brand,.docs-brand {
    font-size:17px;
  }
  .site-main {
    width:calc(100% - 40px);
    padding-bottom:48px;
  }
  .site-nav-mobile-toggle {
    display:inline-flex;
    align-items:center;
    gap:12px;
    min-height:44px;
    background:var(--bg);
    color:var(--ink);
    border:1px solid var(--line);
    padding:8px 12px;
    font-size:12px;
  }
  .site-header:has(.site-nav:not([data-enhanced])) {
    flex-wrap:wrap;
  }
  .site-nav:not([data-enhanced]) {
    display:flex;
    position:static;
    flex-direction:row;
    flex-wrap:wrap;
    width:100%;
    border:0;
  }
  .site-nav {
    display:none;
    position:absolute;
    top:100%;
    left:20px;
    right:20px;
    flex-direction:column;
    align-items:stretch;
    background:var(--bg);
    border:1px solid var(--line);
    padding:12px;
    gap:0;
  }
  .site-nav.is-mobile-open {
    display:flex;
  }
  .site-footer {
    display:block;
    padding:28px 20px;
  }
  .footer-nav {
    justify-content:flex-start;
    gap:8px;
    margin-top:20px;
  }
  .footer-nav a {
    padding-inline:0;
    margin-right:12px;
  }
  .organization-hero {
    grid-template-columns:1fr;
    gap:24px;
    padding:32px 0;
  }
  .organization-hero h1 {
    font-size:30px;
  }
  .organization-introduction {
    padding:0;
    border:0;
  }
  .hero-lead {
    font-size:18px;
  }
  .organization-row,.activity-row,.project-overview {
    grid-template-columns:1fr;
    gap:18px;
    padding-block:28px;
  }
  .organization-band {
    grid-template-columns:1fr;
    padding:24px;
    gap:28px;
    margin-inline:0;
  }
  .organization-band section+section {
    padding:24px 0 0;
    border-left:0;
    border-top:1px solid var(--line);
  }
  h2 {
    font-size:23px;
  }
  .activity-row h3 {
    font-size:20px;
  }
  .inner-hero,.page-intro,.projects-intro {
    padding:32px 0;
  }
  .principle-card {
    grid-template-columns:1fr;
    gap:18px;
    padding:28px 0;
  }
  .principle-check {
    grid-column:1;
  }
  .principles-checklist {
    padding:24px;
    margin-top:28px;
  }
  .principles-checklist li {
    grid-template-columns:1fr;
    gap:6px;
  }
  .contribution-article .rule-item {
    grid-template-columns:1fr;
    gap:12px;
  }
  .contribution-article .article-section:last-child {
    padding:24px;
  }
  .project-directory-row {
    grid-template-columns:1fr;
    gap:20px;
    padding:28px 0;
  }
  .project-directory-media {
    padding:16px;
  }
  .project-directory-media img {
    height:280px;
  }
  .project-directory-copy { order:-1; }
  .page-intro-copy, .inner-hero > div:first-child { display:block; }
  .page-intro-copy > .hero-lead, .inner-hero > div > .hero-lead { margin-top:12px; }
  .project-directory-index { gap:12px 24px; }
  .project-hero--split {
    grid-template-columns:1fr;
    padding:32px 0;
    gap:24px;
  }
  .project-hero h1 {
    font-size:36px;
  }
  .project-hero-media {
    padding:20px;
  }
  .project-hero-media>img {
    max-height:280px;
  }
  .product-screen-group {
    gap:8px;
  }
  .product-screen-group img {
    height:220px;
  }
  .project-subnav {
    gap:8px 20px;
  }
  .project-journey-grid,.for-series-grid,.for-flow-list {
    grid-template-columns:1fr;
    gap:28px;
  }
  .project-journey-heading,.section-header {
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }
  .project-journey-item img {
    height:320px;
  }
  .product-resources {
    grid-template-columns:1fr;
    padding:24px;
    gap:28px;
  }
  .legal-toc {
    grid-template-columns:1fr;
    padding:20px;
  }
  .legal-page-header {
    padding-top:32px;
  }
  .docs-title-link {
    order:3;
    width:100%;
    margin:0;
    font-size:13px;
  }
  .docs-topbar {
    flex-wrap:wrap;
    gap:8px 16px;
    padding:12px 20px;
  }
  .docs-top-actions {
    margin-left:auto;
    font-size:12px;
  }
  .docs-main {
    padding-inline:20px;
  }
  .docs-hero h1 {
    font-size:27px;
  }
  .docs-page-content h2 {
    font-size:22px;
  }
  .docs-page-content h3 {
    font-size:18px;
  }
  .docs-purpose-list {
    gap:16px;
    grid-template-columns:1fr;
  }
  .docs-purpose-list a {
    flex-direction:row;
    align-items:baseline;
    gap:24px;
    padding:14px 0;
  }
  .docs-purpose-list strong {
    font-size:18px;
    min-width:80px;
  }
  .docs-purpose-list span {
    margin:0;
  }
  .overview-screenshot {
    float:none;
    width:160px;
    margin:20px auto;
  }
  .article-section:has(>.article-lead-media) {
    display:flex;
    flex-direction:column;
  }
  .docs-screenshot.article-lead-media {
    float:none;
    width:180px;
    margin:20px auto;
    order:1;
  }
  .docs-index,.docs-media-grid {
    grid-template-columns:1fr;
  }
  .docs-facts div,.docs-scope-list section {
    grid-template-columns:1fr;
    gap:8px;
  }
  .docs-footer {
    display:block;
    padding-inline:20px;
  }
  .docs-footer nav {
    margin-top:12px;
  }
  .spec-table th,.spec-table td {
    padding:10px 8px;
  }
  .spec-table {
    font-size:13px;
  }
  .question-catalog-controls {
    grid-template-columns:1fr;
    padding:16px;
  }
  .document-pagination strong {
    font-size:14px;
  }
  .docs-breadcrumb {
    font-size:12px;
  }
  .page-toc nav {
    display:block;
  }
  .code-block {
    padding:16px;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
}

/* Omoi for Series: five-column presentation in a 3 + 2 centered rhythm. */
.for-series-card .series-age-note {
  display:inline-block;
  margin-left:.5em;
  font-size:.72em;
  font-weight:500;
  vertical-align:middle;
  color:var(--muted);
}
@media (min-width: 980px) {
  .for-series-grid {
    grid-template-columns:repeat(6,minmax(0,1fr));
  }
  .for-series-grid > .for-series-card {
    grid-column:span 2;
  }
  .for-series-grid > .for-series-card:nth-child(4) {
    grid-column:2 / span 2;
  }
  .for-series-grid > .for-series-card:nth-child(5) {
    grid-column:4 / span 2;
  }
}
@media (min-width: 601px) and (max-width: 979px) {
  .for-series-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

.project-overview-heading [data-category-name][data-category="couples"] { color:#ed702f; }
.project-overview-heading [data-category-name][data-category="family"] { color:#78956a; }
.project-overview-heading [data-category-name][data-category="friends"] { color:#6686a2; }
.project-overview-heading [data-category-name][data-category="adults"] { color:#805e7e; }
.project-overview-heading [data-category-name][data-category="self-care"] { color:#e5755d; }
.project-overview-heading .for-series-title { font-size:clamp(30px,3vw,34px); }
.for-series-section [data-category-heading][data-category="couples"] { color:#ed702f; }
.for-series-section [data-category-heading][data-category="family"] { color:#78956a; }
.for-series-section [data-category-heading][data-category="friends"] { color:#6686a2; }
.for-series-section [data-category-heading][data-category="adults"] { color:#805e7e; }
.for-series-section [data-category-heading][data-category="self-care"] { color:#e5755d; }

/* SafeSearch 4 — X-filtering system project page */
.xfilter-page { padding-bottom:88px; }
.xfilter-hero { padding:36px 0 56px; border-bottom:1px solid var(--line); }
.xfilter-hero .breadcrumb { margin-bottom:32px; }
.xfilter-hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);
  gap:64px;
  align-items:center;
}
.xfilter-hero-copy h1 {
  max-width:780px;
  font-size:clamp(42px,5.2vw,66px);
  line-height:1.12;
  letter-spacing:-.035em;
}
.xfilter-lead {
  max-width:700px;
  margin:24px 0 12px;
  font-size:clamp(20px,2.25vw,28px);
  line-height:1.55;
  font-weight:600;
}
.xfilter-intro { max-width:700px; margin:0; color:var(--muted); font-size:17px; }
.xfilter-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 24px; margin-top:28px; }
.xfilter-published {
  display:flex;
  align-items:baseline;
  gap:16px;
  width:max-content;
  margin:28px 0 0;
  padding-top:14px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:13px;
}
.xfilter-published strong { color:var(--ink); font-size:16px; }
.xfilter-mark { display:grid; justify-items:center; gap:16px; margin:0; padding:54px 32px 32px; background:var(--canvas); }
.xfilter-mark img { display:block; width:176px; height:176px; object-fit:contain; }
.xfilter-mark figcaption { color:var(--muted); font-size:13px; }
.xfilter-subnav { display:flex; flex-wrap:wrap; gap:8px 28px; padding:14px 0; border-bottom:1px solid var(--line); }
.xfilter-subnav a { display:inline-flex; align-items:center; min-height:36px; color:var(--muted); font-size:14px; text-decoration:none; }
.xfilter-subnav a:hover { color:var(--ink); text-decoration:underline; text-underline-offset:6px; }
.xfilter-section { padding:56px 0; border-bottom:1px solid var(--line); }
.xfilter-section-heading { max-width:780px; margin-bottom:28px; }
.xfilter-section-heading h2,.xfilter-availability h2 { font-size:clamp(27px,3vw,36px); letter-spacing:-.02em; }
.xfilter-section-heading>p:last-child { margin:8px 0 0; color:var(--muted); font-size:16px; }
.xfilter-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.xfilter-shot { min-width:0; margin:0; }
.xfilter-shot>a { display:block; overflow:hidden; aspect-ratio:1.65/1; border:1px solid var(--line); background:#fff; }
.xfilter-shot img { display:block; width:100%; height:100%; object-fit:cover; object-position:35% center; transform:scale(1.4); transform-origin:35% center; }
.xfilter-shot--settings>a { aspect-ratio:1.2/1; }
.xfilter-shot--settings img { object-position:35% center; transform:scale(1); }
.xfilter-shot figcaption { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:4px 20px; padding:14px 2px 0; }
.xfilter-shot figcaption strong { font-size:16px; }
.xfilter-shot figcaption span { color:var(--muted); font-size:13px; }
.xfilter-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; margin:0; padding:0; list-style:none; }
.xfilter-steps li { display:grid; grid-template-columns:52px minmax(0,1fr); gap:14px; padding:8px 24px 8px 0; }
.xfilter-steps li+li { padding-left:24px; border-left:1px solid var(--line); }
.xfilter-step-number { color:#1d5ca5; font-size:31px; font-weight:700; line-height:1.2; }
.xfilter-steps h3,.xfilter-setting-columns h3 { margin-bottom:10px; font-size:18px; }
.xfilter-steps p,.xfilter-setting-columns p { margin:0; color:var(--muted); font-size:14px; line-height:1.8; }
.xfilter-setting-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px; }
.xfilter-setting-columns article { padding-top:18px; border-top:2px solid var(--accent); }
.xfilter-limit-copy { max-width:860px; }
.xfilter-limit-copy p { margin:0 0 16px; }
.xfilter-limit-copy p:last-child { margin-bottom:0; }
.xfilter-limit-copy .xfilter-limit-lead { font-size:20px; font-weight:600; }
.xfilter-availability {
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:48px;
  margin-top:48px;
  padding:36px;
  background:var(--canvas);
}
.xfilter-availability-copy>p { margin:10px 0 0; color:var(--muted); }
.xfilter-availability-facts { margin:0; font-size:14px; }
.xfilter-availability-facts>div { display:grid; grid-template-columns:128px minmax(0,1fr); gap:16px; padding:12px 0; border-bottom:1px solid var(--line); }
.xfilter-availability-facts>div:first-child { border-top:1px solid var(--line); }
.xfilter-availability-facts dt { color:var(--muted); }
.xfilter-availability-facts dd { margin:0; }
@media(max-width:900px) {
  .xfilter-hero-grid { grid-template-columns:minmax(0,1.2fr) minmax(190px,.8fr); gap:36px; }
  .xfilter-gallery { gap:20px; }
  .xfilter-steps li { grid-template-columns:40px minmax(0,1fr); gap:10px; padding-right:16px; }
  .xfilter-steps li+li { padding-left:16px; }
  .xfilter-availability { gap:28px; padding:28px; }
}
@media(max-width:600px) {
  .xfilter-hero { padding:24px 0 36px; }
  .xfilter-hero .breadcrumb { margin-bottom:22px; }
  .xfilter-hero-grid,.xfilter-gallery,.xfilter-setting-columns,.xfilter-availability { grid-template-columns:1fr; }
  .xfilter-hero-grid { gap:28px; }
  .xfilter-hero-copy h1 { font-size:clamp(36px,10vw,48px); letter-spacing:-.025em; overflow-wrap:anywhere; }
  .xfilter-lead { margin-top:18px; font-size:21px; }
  .xfilter-intro { font-size:15px; }
  .xfilter-mark { justify-self:end; padding:20px; }
  .xfilter-mark img { width:116px; height:116px; }
  .xfilter-mark figcaption { display:none; }
  .xfilter-published { margin-top:20px; }
  .xfilter-subnav { gap:4px 18px; }
  .xfilter-section { padding:38px 0; }
  .xfilter-section-heading { margin-bottom:22px; }
  .xfilter-section-heading h2,.xfilter-availability h2 { font-size:27px; }
  .xfilter-gallery { gap:26px; }
  .xfilter-shot figcaption { display:grid; justify-content:start; gap:2px; }
  .xfilter-steps { grid-template-columns:1fr; gap:0; }
  .xfilter-steps li,.xfilter-steps li+li {
    grid-template-columns:48px minmax(0,1fr);
    gap:12px;
    padding:18px 0;
    border-left:0;
    border-top:1px solid var(--line);
  }
  .xfilter-setting-columns { gap:28px; }
  .xfilter-availability { gap:24px; margin-top:32px; padding:24px 20px; }
  .xfilter-availability-facts>div { grid-template-columns:92px minmax(0,1fr); gap:10px; }
}