:root{
  --bg:#f5f7fb;--panel:#ffffff;--panel2:#f8fbff;--text:#172033;--muted:#586174;--line:#d8e1ee;--brand:#0b4aa2;--brand2:#0f62d8;--soft:#edf5ff;--ok:#e9fff5;--okline:#9ee8c3;--shadow:0 14px 34px rgba(15,32,64,.08);
  --codebg:#0f172a;--codetext:#dbeafe;--codeborder:#26334d;
}
html[data-theme="dark"]{
  --bg:#0b1020;--panel:#111827;--panel2:#0f172a;--text:#e5edf8;--muted:#a8b3c7;--line:#26334d;--brand:#7db4ff;--brand2:#9cc7ff;--soft:#111f34;--ok:#10291e;--okline:#1d8b5a;--shadow:0 16px 42px rgba(0,0,0,.45);
  --codebg:#050914;--codetext:#dbeafe;--codeborder:#334155;
}
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65} 
a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}.page{max-width:1120px;margin:0 auto;padding:92px 28px 54px}.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:24px;margin:20px 0;box-shadow:var(--shadow)}.hero{background:linear-gradient(135deg,var(--panel),var(--soft));border:1px solid var(--line);border-radius:24px;padding:34px;margin:20px 0 28px;box-shadow:var(--shadow)}h1{font-size:clamp(2.1rem,6vw,4.4rem);line-height:1.02;margin:.1em 0 .35em;color:var(--text)}h2{font-size:clamp(1.45rem,3vw,2.2rem);margin:1.35em 0 .55em;color:var(--brand)}h3{font-size:1.25rem;color:var(--brand);margin:1.1em 0 .45em}hr{border:0;border-top:1px solid var(--line);margin:2rem 0}.muted{color:var(--muted)}
.topbar{position:fixed;top:0;left:0;right:0;z-index:50;background:color-mix(in srgb,var(--panel) 91%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.topbar-inner{max-width:1180px;margin:0 auto;padding:11px 18px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.topbar a,.topbar button{font:inherit;font-weight:700;border:1px solid var(--line);background:var(--panel2);color:var(--brand);border-radius:12px;padding:9px 12px;cursor:pointer}.topbar .spacer{flex:1}.theme-toggle{min-width:44px}.home-badge{font-weight:900;color:var(--text)!important;background:var(--soft)!important}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.tile{display:block;border:1px solid var(--line);background:var(--panel);border-radius:18px;padding:18px;box-shadow:var(--shadow)}.tile strong{display:block;color:var(--brand);font-size:1.12rem;margin-bottom:6px}.tile span{color:var(--muted)}
details{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:0;margin:16px 0;box-shadow:var(--shadow)}summary{cursor:pointer;font-weight:800;color:var(--brand);padding:17px 18px;list-style:none}summary::-webkit-details-marker{display:none}summary:before{content:'▸';display:inline-block;margin-right:.55rem;transition:.2s}details[open] summary:before{transform:rotate(90deg)}.details-body{padding:0 18px 18px;border-top:1px solid var(--line)}
ul{padding-left:1.35rem}li{margin:.45rem 0}blockquote{border-left:4px solid var(--brand2);background:var(--soft);padding:12px 16px;margin:18px 0;border-radius:12px;color:var(--text)}code{background:var(--soft);border:1px solid var(--line);border-radius:7px;padding:.15em .35em;color:var(--text)}pre{position:relative;overflow-x:auto;background:var(--codebg);color:var(--codetext);border:1px solid var(--codeborder);border-radius:16px;padding:18px;margin:18px 0}pre code{background:transparent;border:0;color:inherit;padding:0}.copy-btn{position:absolute;right:10px;top:8px;border:1px solid var(--codeborder);background:#111827;color:#dbeafe;border-radius:8px;padding:4px 7px;font-size:.82rem;cursor:pointer}.note-ok{background:var(--ok);border:1px solid var(--okline);border-radius:16px;padding:16px;margin:18px 0}.breadcrumbs{font-size:.92rem;color:var(--muted);margin-bottom:16px}@media(max-width:720px){.page{padding:86px 16px 36px}.topbar-inner{gap:6px}.topbar a,.topbar button{padding:8px 10px}.hide-mobile{display:none}}


/* v34 Final Dark Contrast + MD Cleanup Patch (portal fallback)
   Goal: no unreadable zebra rows, no overflowing pattern paths, no weak button contrast. */
html[data-theme="dark"] body,
html[data-theme="dark"] main,
html[data-theme="dark"] .wrap,
html[data-theme="dark"] .page,
html[data-theme="dark"] .card,
html[data-theme="dark"] .tile,
html[data-theme="dark"] details,
html[data-theme="dark"] section,
html[data-theme="dark"] article{
  background-color:var(--v31-bg)!important;
  color:var(--v31-text)!important;
}
html[data-theme="dark"] .card,
html[data-theme="dark"] .tile,
html[data-theme="dark"] details,
html[data-theme="dark"] .pattern-card,
html[data-theme="dark"] .quality-card{
  background-color:#101827!important;
  border-color:#344258!important;
  color:#eef4ff!important;
}
html[data-theme="dark"] .hero{
  background:linear-gradient(135deg,#101827,#14243d)!important;
  border-color:#344258!important;
  color:#eef4ff!important;
}
html[data-theme="dark"] p,
html[data-theme="dark"] li,
html[data-theme="dark"] td,
html[data-theme="dark"] th,
html[data-theme="dark"] summary,
html[data-theme="dark"] label,
html[data-theme="dark"] .details-body{
  color:#eef4ff!important;
}
html[data-theme="dark"] .muted,
html[data-theme="dark"] .footer,
html[data-theme="dark"] .v31-footer{
  color:#c3cee3!important;
}
html[data-theme="dark"] a{color:#9fc9ff!important;}
html[data-theme="dark"] .v31-btn,
html[data-theme="dark"] .btn,
html[data-theme="dark"] button,
html[data-theme="dark"] .v31-tool,
html[data-theme="dark"] .theme-toggle,
html[data-theme="dark"] .control-btn{
  background:#17243a!important;
  border-color:#40516b!important;
  color:#eef4ff!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .v31-home,
html[data-theme="dark"] .home-badge{
  background:#20314f!important;
  color:#ffffff!important;
}
html[data-theme="dark"] .table-wrap{
  background:#0f172a!important;
  border-color:#40516b!important;
  overflow-x:auto!important;
}
html[data-theme="dark"] table{
  background:#0f172a!important;
  color:#eef4ff!important;
  border-color:#40516b!important;
}
html[data-theme="dark"] thead,
html[data-theme="dark"] th{
  background:#1b2a44!important;
  color:#b9d8ff!important;
  border-color:#40516b!important;
}
html[data-theme="dark"] tbody,
html[data-theme="dark"] tr,
html[data-theme="dark"] td{
  border-color:#40516b!important;
}
html[data-theme="dark"] tbody tr:nth-child(odd),
html[data-theme="dark"] table tr:nth-child(odd){
  background:#0f172a!important;
  color:#eef4ff!important;
}
html[data-theme="dark"] tbody tr:nth-child(even),
html[data-theme="dark"] table tr:nth-child(even){
  background:#162238!important;
  color:#eef4ff!important;
}
html[data-theme="dark"] tbody tr:nth-child(even) td,
html[data-theme="dark"] tbody tr:nth-child(odd) td,
html[data-theme="dark"] table tr td{
  color:#eef4ff!important;
  background:transparent!important;
}
html[data-theme="dark"] code,
html[data-theme="dark"] .path,
html[data-theme="dark"] .path-block{
  background:#0b1324!important;
  border-color:#40516b!important;
  color:#dbeafe!important;
}
html[data-theme="dark"] pre{
  background:#050914!important;
  border-color:#40516b!important;
  color:#e3eeff!important;
}
html[data-theme="dark"] blockquote,
html[data-theme="dark"] .note-ok,
html[data-theme="dark"] .notice{
  background:#10291e!important;
  border-color:#2aa36d!important;
  color:#eef4ff!important;
}
.pattern-grid{grid-template-columns:repeat(auto-fit,minmax(285px,1fr))!important;}
.pattern-card{min-width:0!important;overflow:hidden!important;}
.pattern-card h2{word-break:normal!important;overflow-wrap:anywhere!important;hyphens:auto!important;}
.pattern-card code,.pattern-card .path,.pattern-card .path-block{display:block!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;}
.table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;}
table{max-width:100%!important;}
@media(max-width:760px){
  .pattern-grid{grid-template-columns:1fr!important;}
  .v31-nav{align-items:flex-start!important;}
  .table-wrap table{min-width:560px!important;}
}