:root{--paper: #F6F7F9;--ink: #1C1F2E;--graphite: #5A5F73;--rule: #DADDE5;--signal: #3D4FE0;--red-pencil: #E4572E;--bg: var(--paper);--bg-sidebar: #EEF0F4;--bg-raised: #E9EBF0;--bg-active: #E1E4EC;--bg-card: #FFFFFF;--border: var(--rule);--border-soft: #E6E8EE;--border-strong: #C5C9D4;--text: var(--ink);--text-dim: #3E4256;--text-dimmer: var(--graphite);--text-faint: #9297A8;--accent: var(--signal);--established: #2F8F5B;--play-purple: #C9BBFC;--play-yellow: #FCE45E;--play-pink: #FCB6E0;--play-orange: #FDB07A;--play-lime: #D7EF7E;--play-teal: #9FE8DB;--font-display: "Funnel Display", "Atkinson Hyperlegible Next", system-ui, sans-serif;--font-body: "Atkinson Hyperlegible Next", system-ui, sans-serif;--t-xs: 13px;--t-sm: 14.5px;--t-md: 16.5px;--t-lg: 20px;--t-xl: 25px;--t-2xl: 32px;--t-3xl: 44px;--t-4xl: 60px}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:var(--t-md);line-height:1.6;-webkit-font-smoothing:antialiased}a{color:var(--accent);text-decoration:none}a:hover{color:var(--text)}input,button{font:inherit}:focus-visible{outline:2px solid var(--signal);outline-offset:2px;border-radius:3px}::selection{background:var(--signal);color:#fff}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:5px}::-webkit-scrollbar-track{background:transparent}.app{display:flex;min-height:100vh}.main{flex:1;min-width:0}.content{max-width:880px;margin:0 auto;padding:64px 48px 140px}.content-wide{max-width:1080px}.sidebar{width:300px;flex-shrink:0;border-right:1px solid var(--border);display:flex;flex-direction:column;background:var(--bg-sidebar);position:sticky;top:0;height:100vh;overflow:hidden}.sidebar-head{padding:22px 20px 16px;display:flex;flex-direction:column;gap:14px}.sidebar-title-link{color:inherit}.sidebar-title{font-family:var(--font-display);font-size:22px;font-weight:700;line-height:1.1;letter-spacing:-.02em;color:var(--text)}.sidebar-sub{font-size:var(--t-xs);color:var(--text-dimmer);margin-top:6px;line-height:1.4}.view-toggle{display:flex;padding:3px;gap:3px;background:var(--bg-active);border-radius:8px}.view-toggle button{flex:1;padding:6px 0;cursor:pointer;font-size:var(--t-xs);font-weight:600;color:var(--text-dimmer);background:transparent;border:none;border-radius:6px}.view-toggle button[aria-pressed=true]{color:var(--text);background:var(--bg-card);box-shadow:0 1px 0 var(--border-strong)}.sidebar-search{width:100%;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:8px 11px;font-size:var(--t-sm)}.sidebar-search::placeholder{color:var(--text-faint)}.sidebar-scroll{flex:1;overflow-y:auto;padding:4px 10px 24px}.sidebar-foot{display:flex;align-items:center;gap:10px;padding:12px 16px 14px 20px;border-top:1px solid var(--border);background:var(--bg-sidebar)}.sidebar-foot-photo{width:36px;height:36px;flex-shrink:0;border-radius:50%;object-fit:cover;background:var(--bg-active)}.sidebar-foot-text{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.25}.sidebar-foot-label{font-size:11.5px;color:var(--text-dimmer)}.sidebar-foot-names{font-size:var(--t-xs);font-weight:600;color:var(--text);white-space:nowrap}.sidebar-foot-links{display:flex;gap:2px;flex-shrink:0}.sidebar-foot-links a{display:grid;place-items:center;width:30px;height:30px;border-radius:7px;color:var(--text-dimmer)}.sidebar-foot-links a:hover{color:var(--text);background:var(--bg-active)}.sidebar-foot-links a:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.sidebar-foot-links svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.nav-home{display:block;padding:8px 10px;margin-bottom:4px;border-radius:7px;font-size:var(--t-sm);font-weight:600;color:var(--text-dim)}.nav-home:hover{background:var(--bg-raised);color:var(--text)}.nav-home.active{background:var(--bg-card);color:var(--text)}.nav-group summary{list-style:none;display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:7px;cursor:pointer}.nav-group summary::-webkit-details-marker{display:none}.nav-group summary:hover{background:var(--bg-raised)}.nav-group.active-group>summary{background:var(--bg-card)}.nav-group-num{width:20px;height:20px;border-radius:50%;border:1.5px solid var(--border-strong);display:grid;place-items:center;flex-shrink:0;font-size:11px;font-weight:700;color:var(--text-dimmer)}.nav-group.active-group .nav-group-num{border-color:var(--signal);background:var(--signal);color:#fff}.nav-group-name{flex:1;font-size:var(--t-sm);font-weight:600;color:var(--text-dim);line-height:1.3}.nav-group.active-group .nav-group-name,.nav-group[open] .nav-group-name{color:var(--text)}.nav-group-count{font-size:12px;color:var(--text-faint)}.nav-items{padding:2px 0 8px 20px;margin-left:9px;border-left:1.5px solid var(--border)}.nav-item{display:flex;align-items:center;gap:9px;padding:5px 10px;border-radius:6px;font-size:var(--t-sm);line-height:1.4;color:var(--text-dim)}.nav-item:hover{background:var(--bg-raised);color:var(--text)}.nav-item.active{color:var(--text);font-weight:600;background:var(--bg-card)}.nav-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.h1{font-family:var(--font-display);font-size:var(--t-4xl);font-weight:700;line-height:1.02;letter-spacing:-.035em;color:var(--text);margin:0 0 20px;text-wrap:balance}.h2{font-family:var(--font-display);font-size:var(--t-2xl);font-weight:700;line-height:1.1;letter-spacing:-.025em;color:var(--text);margin:0 0 10px}.h3{font-family:var(--font-display);font-size:var(--t-lg);font-weight:700;line-height:1.2;letter-spacing:-.015em;color:var(--text);margin:0 0 8px}.lede{font-size:var(--t-lg);line-height:1.55;color:var(--text-dim);max-width:62ch;text-wrap:pretty;margin:0 0 32px}.prose{font-size:var(--t-md);line-height:1.65;color:var(--text-dim);max-width:68ch;text-wrap:pretty;margin:0}.prose+.prose{margin-top:14px}.muted{color:var(--text-dimmer)}.section{margin-top:88px}.section-intro{font-size:var(--t-md);line-height:1.6;color:var(--text-dimmer);max-width:64ch;margin:0 0 28px;text-wrap:pretty}.maturity{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-xs);font-weight:600;color:var(--text-dim)}.maturity:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}.maturity-Emerging{color:var(--signal)}.maturity-Standard{color:var(--established)}.maturity-Established{color:var(--text-dimmer)}.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:var(--t-sm);color:var(--text-dim);margin-bottom:18px}.crumbs a{color:var(--text);font-weight:600}.crumbs a:hover{text-decoration:underline}.crumbs .sep{color:var(--text-dimmer);opacity:.6}.mini{display:block;width:100%;aspect-ratio:3 / 2;border-radius:8px;padding:8px;overflow:hidden}.mini-inner{zoom:.5;width:100%}.band{padding:56px 48px 48px;border-bottom:1px solid rgba(28,31,46,.08)}.band-inner{max-width:1000px;margin:0 auto}.band .lede{color:var(--ink);opacity:.82}.band-meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}.band-meta .crumbs{margin:0}.band-meta .maturity{background:#ffffffb3;padding:3px 10px 3px 8px;border-radius:99px}.journey{margin:0 0 36px}.journey ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(9,minmax(0,1fr))}.journey-stop{position:relative}.journey-stop+.journey-stop:before{content:"";position:absolute;top:13px;right:calc(50% + 14px);left:calc(-50% + 14px);height:2px;background:#1c1f2e29}.journey-stop.is-done:before{background:var(--signal)}.journey-stop a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 4px;color:var(--ink);text-align:center}.journey-node{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#ffffff8c;border:2px solid rgba(28,31,46,.2);font-family:var(--font-display);font-size:12px;font-weight:700;color:#1c1f2e8c;transition:border-color .15s ease,color .15s ease}.journey-stop.is-done .journey-node,.journey-stop.is-also .journey-node{background:#fff;border-color:var(--signal);color:var(--signal)}.journey-stop.is-current .journey-node{background:var(--signal);color:#fff;box-shadow:0 0 0 4px #3d4fe033}.journey-label{font-size:12.5px;line-height:1.3;opacity:.72;text-wrap:balance}.journey-stop.is-current .journey-label{opacity:1;font-weight:700}.journey-note{display:block;margin-top:3px;font-size:11.5px;font-weight:600;color:var(--signal)}.journey-stop a:hover .journey-label{opacity:1;text-decoration:underline}.journey-stop:not(.is-current) a:hover .journey-node{border-color:var(--ink);color:var(--ink)}.journey-caption{display:none;margin:12px 0 0;font-size:var(--t-sm);color:var(--ink)}.detail{max-width:1096px;margin:0 auto;padding:56px 48px 140px}.guidance{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:40px;margin-top:64px}.guidance-block+.guidance-block{margin-top:28px}.guidance-block p{margin:0}.dont{align-self:start;border:2px solid var(--red-pencil);border-radius:14px;padding:22px 24px;background:#fff}.dont .h3{color:var(--red-pencil);display:flex;align-items:center;gap:10px}.dont .h3:before{content:"";width:18px;height:18px;border-radius:50%;border:2px solid currentColor;background:linear-gradient(45deg,transparent 44%,currentColor 44%,currentColor 56%,transparent 56%)}.dont p{margin:0;color:var(--text);font-size:var(--t-md);line-height:1.6}.eng{margin-top:40px;padding:20px 24px;border-radius:14px;background:var(--bg-raised);display:grid;grid-template-columns:150px 1fr;gap:16px}.eng .h3{margin:0;font-size:var(--t-md)}.eng p{margin:0;color:var(--text-dim)}.also{margin-top:24px;font-size:var(--t-sm);color:var(--text-dimmer)}.checklist{margin-top:64px}.checklist-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:6px}.checklist-progress{font-size:var(--t-sm);color:var(--text-dimmer);display:flex;gap:14px;align-items:baseline}.checklist-clear{background:none;border:none;padding:0;color:var(--accent);cursor:pointer;font-size:var(--t-sm)}.checklist-clear:hover{text-decoration:underline}.checklist-clear[hidden]{display:none}.checklist ul{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid var(--border)}.checklist li{border-bottom:1px solid var(--border)}.checklist label{display:flex;gap:14px;align-items:flex-start;padding:14px 4px;cursor:pointer;font-size:var(--t-md);line-height:1.5;color:var(--text)}.checklist input{appearance:none;-webkit-appearance:none;width:22px;height:22px;margin:0;flex-shrink:0;border:2px solid var(--border-strong);border-radius:6px;background:#fff;cursor:pointer;display:grid;place-items:center;transition:background-color .15s ease,border-color .15s ease}.checklist input:after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg) scale(0);margin-top:-2px;transition:transform .15s ease}.checklist input:checked{background:var(--established);border-color:var(--established)}.checklist input:checked:after{transform:rotate(45deg) scale(1)}.checklist input:checked+span{color:var(--text-dimmer)}.pattern-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 28px}.pattern-card{display:flex;flex-direction:column;gap:14px;color:inherit}.pattern-card .mini{aspect-ratio:auto;height:180px;padding:16px;display:flex;align-items:center;outline:2px solid transparent;outline-offset:3px;transition:outline-color .15s ease}.pattern-card .mini-inner{zoom:.8;width:100%}.pattern-card:hover .mini{outline-color:var(--ink)}.pattern-card-title{font-family:var(--font-display);font-size:var(--t-lg);font-weight:700;letter-spacing:-.015em;color:var(--text);line-height:1.2}.pattern-card-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:6px 0 8px;font-size:var(--t-xs);color:var(--text-dimmer)}.pattern-card-desc{font-size:var(--t-sm);line-height:1.55;color:var(--text-dim);text-wrap:pretty;margin:0}.pager{margin-top:72px;display:grid;grid-template-columns:1fr 1fr;gap:24px}.pager a{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center;color:inherit;padding:12px;border-radius:14px}.pager a:hover{background:var(--bg-raised)}.pager .mini{aspect-ratio:3 / 2}.pager-next{grid-template-columns:1fr 120px!important;text-align:right}.pager-next .mini{order:2}.pager-label{font-size:var(--t-xs);color:var(--text-dimmer)}.pager-value{font-family:var(--font-display);font-size:var(--t-lg);font-weight:700;letter-spacing:-.015em;line-height:1.2;color:var(--text)}.track{display:flex;align-items:center;margin-bottom:40px}.track a{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--border-strong);background:var(--bg);font-size:var(--t-xs);font-weight:700;color:var(--text-dimmer);flex-shrink:0}.track a:hover{border-color:var(--ink);color:var(--ink)}.track a.done{border-color:var(--signal);color:var(--signal)}.track a.active{background:var(--signal);border-color:var(--signal);color:#fff;width:auto;padding:0 14px 0 6px;border-radius:99px;gap:8px;display:inline-flex}.track a.active .track-n{width:20px;height:20px;border-radius:50%;background:#fff;color:var(--signal);display:grid;place-items:center;font-size:11px}.track-line{flex:1;height:1.5px;background:var(--border-strong);min-width:8px}.track-line.done{background:var(--signal)}.pull{margin:8px 0 72px;padding:28px 32px;border-radius:16px;background:var(--bg-card);border:1px solid var(--border)}.pull-label{font-size:var(--t-sm);font-weight:700;color:var(--signal);margin-bottom:8px}.pull-body{font-family:var(--font-display);font-size:var(--t-xl);line-height:1.32;letter-spacing:-.012em;color:var(--text);margin:0;text-wrap:pretty}.hero{padding-top:0}.hero .h1{font-size:clamp(36px,4.3vw,58px);max-width:21ch;margin-bottom:24px}.hero-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;max-width:900px}.hero-cols .prose+.prose{margin-top:0}.hero+.section{margin-top:64px}.route{position:relative;margin-top:8px;padding-left:56px}.route:before{content:"";position:absolute;left:15px;top:18px;bottom:18px;width:2px;background:var(--signal);transform-origin:top}.route-stop{position:relative;display:grid;grid-template-columns:250px minmax(0,1fr);gap:28px;padding:26px 0;border-top:1px solid var(--border)}.route-stop:first-child{border-top:none}.route-node{position:absolute;left:-56px;top:24px;width:32px;height:32px;border-radius:50%;background:var(--bg);border:2px solid var(--signal);display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:var(--t-sm);color:var(--signal)}.route-stop:hover .route-node{background:var(--signal);color:#fff}.route-name{font-family:var(--font-display);font-size:var(--t-xl);font-weight:700;letter-spacing:-.02em;line-height:1.1;color:var(--text)}.route-name:hover{color:var(--signal)}.route-q{font-size:var(--t-sm);line-height:1.5;color:var(--text-dimmer);margin:8px 0 0;text-wrap:pretty}.route-count{font-size:var(--t-xs);color:var(--text-dimmer);margin-top:10px}.route-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:14px 12px;align-content:start}.thumb{display:flex;flex-direction:column;gap:6px;color:inherit}.thumb .mini{outline:2px solid transparent;outline-offset:2px;transition:outline-color .15s ease}.thumb:hover .mini{outline-color:var(--ink)}.thumb-name{font-size:12.5px;line-height:1.3;color:var(--text-dim);text-wrap:balance}.thumb:hover .thumb-name{color:var(--text)}@media(prefers-reduced-motion:no-preference){.route.is-drawing:before{animation:route-draw 1.4s cubic-bezier(.6,0,.2,1) both}.route.is-drawing .route-node{animation:node-in .35s ease both;animation-delay:calc(var(--i) * .13s + .15s)}}@keyframes route-draw{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes node-in{0%{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}.shifts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}.shift{padding:22px 0;border-top:2px solid var(--ink)}.shift .h3{font-size:var(--t-xl);margin-bottom:8px}.shift p{margin:0;color:var(--text-dim);font-size:var(--t-md);line-height:1.6}.families{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.family-tile{display:flex;flex-direction:column;gap:10px;padding:18px;border-radius:16px;color:var(--ink);outline:2px solid transparent;outline-offset:3px;transition:outline-color .15s ease}.family-tile:hover{color:var(--ink);outline-color:var(--ink)}.family-tile .mini{background:#ffffff8c}.family-tile-name{font-family:var(--font-display);font-size:var(--t-lg);font-weight:700;letter-spacing:-.015em;line-height:1.15;display:flex;justify-content:space-between;gap:8px}.family-tile-name span{font-family:var(--font-body);font-size:var(--t-xs);font-weight:600;opacity:.65;padding-top:4px}.family-tile p{margin:0;font-size:var(--t-sm);line-height:1.5;opacity:.85;text-wrap:pretty}.colophon{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:48px;margin-top:96px;padding-top:32px;border-top:1px solid var(--border)}.sources{display:flex;flex-direction:column;gap:8px;font-size:var(--t-sm);line-height:1.55;color:var(--text-dim)}@media(max-width:1100px){.families{grid-template-columns:repeat(2,minmax(0,1fr))}.route-stop{grid-template-columns:1fr;gap:16px}}@media(max-width:860px){.app{flex-direction:column}.sidebar{position:relative;width:100%;height:auto;max-height:60vh;border-right:none;border-bottom:1px solid var(--border)}.content,.detail{padding:40px 16px 96px}.band{padding:36px 16px 32px}.h1{font-size:var(--t-3xl)}.hero-cols,.shifts,.guidance,.colophon,.pattern-grid,.pager{grid-template-columns:1fr}.eng{grid-template-columns:1fr;gap:6px}.families{grid-template-columns:1fr}.route{padding-left:44px}.route-node{left:-44px;width:28px;height:28px}.route:before{left:13px}.route-thumbs{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}.track a:not(.active){width:24px;height:24px;font-size:11px}.track a.active{padding:0 3px}.track-label{display:none}.journey{margin-bottom:28px}.journey-label{display:none}.journey-caption{display:block}.journey-node{width:24px;height:24px;font-size:11px}.journey-stop+.journey-stop:before{top:11px;right:calc(50% + 12px);left:calc(-50% + 12px)}}.nav-group-swatch{width:14px;height:14px;border-radius:4px;margin:0 3px;flex-shrink:0;box-shadow:inset 0 0 0 1px #1c1f2e1f}.demo-wrap .ui-window{box-shadow:0 1px #1c1f2e1f,0 24px 48px -28px #1c1f2e73}.sidebar-brand{display:flex;align-items:center;gap:10px}.sidebar-mark{width:30px;height:30px;border-radius:9px;flex-shrink:0;background:var(--ink);position:relative}.sidebar-mark:after{content:"";position:absolute;inset:6px;background:#fff;-webkit-mask:url(/brand/milky-paw.svg) center / contain no-repeat;mask:url(/brand/milky-paw.svg) center / contain no-repeat}.sidebar-title-link:hover .sidebar-mark{background:var(--signal)}