/* Hub UI: all product rules are scoped. Existing article styles stay intact. */
.xb-hub{--hub-accent:#c8f784;--hub-ink:#253a12;--hub-pale:#f0f8e7;color:#202721;background:#f7f8f3;font:17px/1.7 Arial,sans-serif;margin:0;overflow-wrap:anywhere}
.xb-hub[data-accent=blue]{--hub-accent:#a5d1ff;--hub-ink:#193b67;--hub-pale:#edf5ff}
.xb-hub[data-accent=coral]{--hub-accent:#ffb6a0;--hub-ink:#773323;--hub-pale:#fff2ed}
.xb-hub[data-accent=cyan]{--hub-accent:#91e5e3;--hub-ink:#14514f;--hub-pale:#eaf8f7}
.xb-hub[data-accent=violet]{--hub-accent:#d3bbff;--hub-ink:#523580;--hub-pale:#f5efff}
.xb-hub[data-accent=mint]{--hub-accent:#a7e7be;--hub-ink:#245936;--hub-pale:#eff9f2}
.xb-hub[data-accent=rose]{--hub-accent:#f4b5ce;--hub-ink:#73344f;--hub-pale:#fff1f7}
.xb-hub[data-accent=gold]{--hub-accent:#f8d98c;--hub-ink:#664c0f;--hub-pale:#fff8e6}
.xb-hub *{box-sizing:border-box}.xb-hub [hidden]{display:none!important}
.xb-hub a{color:var(--hub-ink);text-underline-offset:4px}.xb-hub a:hover{text-decoration-thickness:2px}
.xb-hub button,.xb-hub input,.xb-hub select{font:inherit;max-width:100%}
.xb-hub :is(a,button,select,input,summary,[tabindex]):focus-visible{outline:3px solid #4c6930;outline-offset:4px}
.xb-hub h1,.xb-hub h2,.xb-hub h3{font-family:Arial,sans-serif;line-height:1.18;letter-spacing:-.025em;margin:0 0 20px;color:inherit;max-width:none}
.xb-hub h1{font-size:clamp(32px,4.1vw,56px);font-weight:800}.xb-hub h2{font-size:clamp(25px,2.9vw,35px)}.xb-hub h3{font-size:22px}
.xb-hub p{margin:0 0 20px}.xb-hub ul,.xb-hub ol{padding-left:24px}.xb-hub li{padding-left:5px;margin:12px 0}.xb-hub section{scroll-margin-top:100px}
.xb-hub .hub-width{max-width:1208px;margin:0 auto;padding-inline:28px}
.xb-hub .hub-hero{background:#0e1715;color:#fff;padding:38px 0 54px;position:relative;overflow:hidden}
.xb-hub .hub-crumb{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:13px;margin-bottom:34px;color:#d0dad6}
.xb-hub .hub-crumb a{color:#d0dad6}.xb-hub .hub-hero-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(230px,.8fr);align-items:center;gap:54px}
.xb-hub .hub-kicker{font-size:12px;letter-spacing:1.6px;text-transform:uppercase;font-weight:700;color:var(--hub-ink);margin:0 0 17px}
.xb-hub .hub-hero .hub-kicker{color:var(--hub-accent)}.xb-hub .hub-dek{font-size:19px;line-height:1.65;color:#d3ddd7;max-width:780px}
.xb-hub .hub-meta{font-size:12px;color:#b6c6bd;display:flex;gap:16px;flex-wrap:wrap;margin-top:25px}
.xb-hub .hub-orbit{position:relative;aspect-ratio:1;max-width:285px;display:grid;place-items:center;margin:auto;width:100%;border:1px solid #3d5148;border-radius:50%;background:radial-gradient(circle,#294436 0,transparent 70%)}
.xb-hub .hub-orbit:before{content:'';position:absolute;inset:24px;border:1px dashed #576f5d;border-radius:50%}
.xb-hub .hub-symbol{display:grid;place-items:center;width:130px;height:130px;background:var(--hub-accent);color:#13221b;border-radius:36px;transform:rotate(-8deg);box-shadow:10px 10px 0 #ffffff0b}
.xb-hub .hub-symbol svg{width:76px;height:76px;transform:rotate(8deg)}
.xb-hub .hub-node{position:absolute;padding:5px 12px;background:#1c2b23;border:1px solid #58705a;color:#e9f2ec;border-radius:30px;font-size:12px;line-height:1.6;max-width:180px;text-align:center}
.xb-hub .hub-node:nth-last-child(3){top:7px;left:8px}.xb-hub .hub-node:nth-last-child(2){right:-12px;top:51%}.xb-hub .hub-node:last-child{bottom:3px;left:14px}
.xb-hub .hub-jump{display:flex;gap:10px;padding-block:19px;flex-wrap:wrap;border-bottom:1px solid #dce2d8}.xb-hub .hub-jump a{padding:8px 14px;min-height:44px;border:1px solid #d0d9cb;border-radius:24px;text-decoration:none;font-size:14px;background:#fff;font-weight:600}
.xb-hub .hub-jump a:first-child{background:var(--hub-accent);border-color:var(--hub-accent);color:#17251a}
.xb-hub .hub-answer{display:grid;grid-template-columns:180px minmax(0,1fr);gap:28px;padding:38px 0;border-bottom:1px solid #dce2d8}
.xb-hub .hub-answer p{font-size:19px;line-height:1.75;margin:0;max-width:900px}.xb-hub .hub-answer .hub-kicker{font-size:12px;line-height:1.6}
.xb-hub .hub-tool{margin:38px 0;background:var(--hub-pale);border:1px solid #cfd9cb;border-radius:24px;padding:30px}
.xb-hub .hub-tool>p{max-width:850px;color:#49584a}.xb-hub .hub-route-form{display:grid;grid-template-columns:minmax(230px,1fr) minmax(0,1.7fr);gap:26px;align-items:start}
.xb-hub label{display:block;font-size:14px;font-weight:700}.xb-hub select,.xb-hub input[type=search]{display:block;width:100%;min-height:48px;padding:11px 12px;background:#fff;color:#243426;border:1px solid #98ad94;border-radius:9px;margin-top:8px}
.xb-hub .hub-route-result{padding:23px 25px;background:#fff;border:1px solid #d3dfcf;border-radius:15px}.xb-hub .hub-route-result+ .hub-route-result{margin-top:16px}
.xb-hub .hub-route-result h3{font-size:23px}.xb-hub .hub-route-result p{font-size:16px}.xb-hub .hub-route-result li{font-size:16px;margin:10px 0}
.xb-hub .hub-result-links{display:flex;gap:10px;flex-direction:column;font-size:15px;border-top:1px solid #e2e7de;padding-top:15px;margin-top:20px}
.xb-hub .hub-route-form:not(.is-ready){display:block}.xb-hub .hub-tool-note{font-size:13px;color:#53634f;margin:20px 0 0}
.xb-hub .hub-content-grid{display:grid;grid-template-columns:230px minmax(0,1fr);gap:55px;padding:46px 0 20px;align-items:start}
.xb-hub .hub-side{position:sticky;top:95px;font-size:14px}.xb-hub .hub-side strong{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#51674d;display:block;margin-bottom:15px}
.xb-hub .hub-side nav{display:flex;flex-direction:column;gap:1px;border-left:2px solid #d6e0d0}.xb-hub .hub-side a{padding:9px 14px;text-decoration:none;line-height:1.45;min-height:42px}.xb-hub .hub-side a:hover{background:var(--hub-pale)}
.xb-hub .hub-reading{min-width:0;max-width:860px}.xb-hub .hub-reading>section{margin-bottom:48px;padding-bottom:30px;border-bottom:1px solid #dce2d8}
.xb-hub .hub-reading>section:last-child{border:0}.xb-hub .hub-reading>section>p:first-of-type{font-size:18px}
.xb-hub .hub-step-label{font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:var(--hub-ink);font-weight:700;margin:0 0 14px;display:block}
.xb-hub .hub-table-wrap{overflow-x:auto;border:1px solid #ccd9c6;border-radius:13px}.xb-hub table{width:100%;border-collapse:collapse;font-size:15px;min-width:550px;margin:0;background:#fff}
.xb-hub caption{text-align:left;padding:15px 20px;font-weight:700;background:var(--hub-pale)}.xb-hub th,.xb-hub td{text-align:left;vertical-align:top;padding:14px 18px;border-bottom:1px solid #dfe5dc}.xb-hub thead th{font-size:12px;text-transform:uppercase;letter-spacing:.6px;background:#eff2eb}.xb-hub tbody th{width:23%}
.xb-hub .hub-library{padding:38px 0 48px}.xb-hub .hub-library-intro{max-width:780px}.xb-hub .hub-library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.xb-hub .hub-link-group{background:#fff;border-radius:17px;padding:24px;border:1px solid #d7dfd1}.xb-hub .hub-link-group h3{font-size:21px;padding-bottom:17px;border-bottom:3px solid var(--hub-accent)}
.xb-hub .hub-article-link{display:block;padding:16px 0;border-bottom:1px solid #e4e9e1;text-decoration:none}.xb-hub .hub-article-link:last-child{border-bottom:0;padding-bottom:0}
.xb-hub .hub-article-link strong{display:block;font-size:16px;line-height:1.45}.xb-hub .hub-article-link span{display:block;font-size:14px;line-height:1.65;color:#52614f;margin-top:6px}.xb-hub .hub-article-link:hover strong{text-decoration:underline}
.xb-hub .hub-faq{max-width:900px;padding:25px 0 50px}.xb-hub details.hub-question{border-top:1px solid #cdd9c6;padding:0}.xb-hub .hub-question:last-child{border-bottom:1px solid #cdd9c6}.xb-hub .hub-question summary{cursor:pointer;font-weight:700;padding:19px 32px 19px 0;font-size:17px}.xb-hub .hub-question p{padding:0 0 12px;font-size:16px}
.xb-hub .hub-more{background:#eaf0e4;padding:35px 0 40px}.xb-hub .hub-more-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.xb-hub .hub-more-links a{padding:20px;background:#fff;border:1px solid #d7dfd1;border-radius:14px;text-decoration:none;font-size:16px;font-weight:700}.xb-hub .hub-more-links small{display:block;font-size:12px;line-height:1.7;color:#5b6c56;font-weight:400;margin-top:9px}
.xb-hub .hub-catalog{padding:40px 0 28px;scroll-margin-top:95px}.xb-hub .hub-catalog-head{max-width:860px}.xb-hub .hub-catalog-head p{font-size:16px}
.xb-hub .hub-catalog-controls{padding:23px;background:#fff;border:1px solid #cdd7c4;border-radius:16px;display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:15px;align-items:end}
.xb-hub .hub-reset{min-height:48px;background:#f1f5eb;border:1px solid #a9bba0;padding:9px 15px;border-radius:9px;cursor:pointer;color:#283c1c}
.xb-hub .hub-counter{font-size:14px;color:#53664c;margin:20px 0}.xb-hub .hub-games-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.xb-hub .hub-game{background:#fff;border:1px solid #d8dfd1;border-radius:17px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.xb-hub .hub-game-top{background:var(--hub-pale);padding:22px 23px 20px;position:relative;border-bottom:1px solid #e4e8dc}.xb-hub .hub-game-top:after{content:'';position:absolute;right:16px;top:15px;width:26px;height:26px;border:2px solid var(--hub-accent);border-radius:8px;transform:rotate(15deg)}
.xb-hub .hub-game h3{font-size:22px;line-height:1.2;margin:0 15px 15px 0}.xb-hub .hub-game h3 a{text-decoration:none;color:#21321c}.xb-hub .hub-game h3 a:hover{text-decoration:underline}
.xb-hub .hub-tags{display:flex;gap:5px;flex-wrap:wrap;font-size:11px;line-height:1.5}.xb-hub .hub-tags span{border:1px solid #c9d3be;padding:3px 7px;border-radius:20px;background:#fff;color:#46563c}
.xb-hub .hub-game-body{padding:21px 23px;display:flex;flex:1;flex-direction:column}.xb-hub .hub-game-body p{font-size:15px;line-height:1.7}.xb-hub .hub-game-body strong{display:block;font-size:12px;letter-spacing:.4px;text-transform:uppercase;color:#546947;margin-bottom:4px}
.xb-hub .hub-game-body>a{margin-top:auto;padding-top:13px;border-top:1px solid #e0e7d9;font-size:14px;font-weight:700}.xb-hub .hub-empty{padding:30px;border:1px dashed #9caf92;border-radius:14px;background:#fff}
.xb-hub .glossary{margin:0 0 45px;border:1px solid #d3dfca;padding:25px;border-radius:14px;background:#f0f5ea;font-size:15px}.xb-hub .glossary h2{font-size:25px}.xb-hub .glossary dt{font-weight:700;margin-top:18px}.xb-hub .glossary dd{margin:6px 0 18px}.xb-hub .glossary p{margin-bottom:7px}.xb-hub .term-source{font-size:12px}
.hub-directory{max-width:1208px;margin:35px auto 45px;padding-inline:28px}.hub-directory h2{font-size:32px;line-height:1.2;margin:0 0 15px}.hub-directory>p{max-width:800px;margin-bottom:25px}.hub-directory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.hub-directory-card{display:block;background:#fff;color:#23341b;border:1px solid #ccd9c2;border-top:4px solid var(--card-accent,#b9ee75);border-radius:13px;padding:22px;text-decoration:none;min-height:145px}.hub-directory-card strong{display:block;font-size:22px;line-height:1.2}.hub-directory-card span{display:block;font-size:14px;color:#506348;margin-top:13px}.hub-directory-card:hover strong{text-decoration:underline}.hub-breadcrumb-link{font-weight:600}
.hub-return{padding:14px 20px;margin:20px auto;max-width:800px;background:#edf4e4;border:1px solid #cadcba;border-radius:10px;font-size:15px}.hub-return a{color:#365c14}
@media(min-width:1000px){.xb-hub .hub-game:nth-child(6n+2){--hub-pale:#edf5ff;--hub-accent:#b9d7ff}.xb-hub .hub-game:nth-child(6n+3){--hub-pale:#f4effc;--hub-accent:#d7c5f1}}
@media(max-width:1000px){.xb-hub .hub-hero-grid{gap:30px;grid-template-columns:minmax(0,1fr) 220px}.xb-hub .hub-content-grid{grid-template-columns:180px minmax(0,1fr);gap:30px}.xb-hub .hub-games-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.xb-hub .hub-catalog-controls{grid-template-columns:1fr 1fr}.xb-hub .hub-more-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.xb-hub .hub-width{padding-inline:21px}.xb-hub .hub-hero{padding:28px 0 36px}.xb-hub .hub-hero-grid{display:block}.xb-hub .hub-orbit{display:none}.xb-hub .hub-crumb{margin-bottom:25px}.xb-hub .hub-dek{font-size:17px}.xb-hub .hub-answer{grid-template-columns:1fr;gap:10px;padding:28px 0}.xb-hub .hub-answer p{font-size:17px}.xb-hub .hub-content-grid{display:block;padding-top:30px}.xb-hub .hub-side{position:static;margin-bottom:35px}.xb-hub .hub-side nav{gap:0}.xb-hub .hub-side a{padding-block:10px}.xb-hub .hub-tool{padding:23px 18px;margin:28px 0}.xb-hub .hub-route-form{grid-template-columns:1fr;gap:17px}.xb-hub .hub-route-result{padding:20px 18px}.xb-hub .hub-library-grid{grid-template-columns:1fr;gap:20px}.xb-hub .hub-reading>section{margin-bottom:30px;padding-bottom:20px}.xb-hub .hub-library{padding-block:20px 35px}.hub-directory-grid{grid-template-columns:1fr 1fr}.xb-hub .hub-meta{font-size:11px}.xb-hub .hub-catalog-controls{padding:17px}.xb-hub .hub-jump{gap:8px}.xb-hub .hub-jump a{font-size:13px;padding:8px 12px}}
@media(max-width:500px){.xb-hub .hub-games-grid{grid-template-columns:1fr}.xb-hub .hub-catalog-controls{grid-template-columns:1fr}.xb-hub .hub-game-body{padding:20px}.xb-hub .hub-more-links{grid-template-columns:1fr 1fr;gap:10px}.xb-hub .hub-more-links a{padding:15px;font-size:15px}.hub-directory{padding-inline:20px}.hub-directory-grid{grid-template-columns:1fr}.xb-hub .hub-link-group{padding:20px}.xb-hub .hub-reading>section>p:first-of-type{font-size:17px}}
@media(prefers-reduced-motion:reduce){.xb-hub{scroll-behavior:auto}.xb-hub *{transition:none!important;animation:none!important}}
@media print{.xb-hub .hub-side,.xb-hub .hub-jump,.xb-hub .hub-route-controls,.xb-hub .hub-catalog-controls,.xb-hub .hub-orbit{display:none!important}.xb-hub .hub-hero{background:#fff;color:#152312;padding:20px 0}.xb-hub .hub-hero .hub-kicker,.xb-hub .hub-dek,.xb-hub .hub-meta{color:#314929}.xb-hub .hub-content-grid{display:block}.xb-hub .hub-games-grid{grid-template-columns:1fr 1fr}.xb-hub .hub-route-result[hidden],.xb-hub .hub-game[hidden]{display:block!important}.xb-hub .hub-route-form{display:block}.xb-hub .hub-game,.xb-hub .hub-route-result{break-inside:avoid}.xb-hub .hub-width{padding:0}.xb-hub h2{break-after:avoid}.xb-hub .hub-hero{break-before:page}.xb-hub .hub-table-wrap{overflow:visible}.xb-hub table{min-width:0}.xb-hub .hub-reading{max-width:none}}

.xb-hub .hub-game-tips{margin:0 0 18px;border-top:1px solid #e0e7d9;padding-top:4px}.xb-hub .hub-game-tips summary{cursor:pointer;min-height:44px;padding:11px 0;font-size:14px;font-weight:700;color:#3f5832}.xb-hub .hub-game-tips p{padding-top:12px;margin-bottom:4px}.xb-hub .hub-game-tips[open]{padding-bottom:12px}
