*{box-sizing:border-box}body{margin:0;background:var(--pn-bg,#EEF2F7);color:var(--pn-ink,#111827);font:16px/1.5 Arial,Helvetica,sans-serif}
.hub-top{background:var(--pn-navy,#1a3558);color:#fff;padding:14px 16px}
.hub-top a{color:#fff;text-decoration:none;font-weight:800}.hub-top b{color:#D97706}
.hub-wrap{max-width:720px;margin:0 auto;padding:16px 16px 56px}
.hub-card{background:#fff;border:1px solid var(--pn-pale,#D5E8F0);border-radius:var(--pn-r-card,12px);padding:16px;margin:0 0 14px;box-shadow:var(--pn-shadow,0 3px 10px rgba(15,30,55,.14))}
h1{margin:6px 0 4px;font-size:1.5rem;color:var(--pn-doc-navy,#1F4E79)}h2{margin:0 0 8px;font-size:1.05rem;color:var(--pn-doc-navy,#1F4E79)}
.hub-kicker{font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--pn-muted,#6B7280)}
.hub-list{list-style:none;margin:0;padding:0}.hub-list li{border-top:1px solid var(--pn-paler,#EBF3FB)}.hub-list li:first-child{border-top:0}
.hub-list a{display:block;padding:12px 4px;color:var(--pn-doc-navy,#1F4E79);text-decoration:none;font-weight:700;min-height:44px}
.hub-list small{display:block;color:var(--pn-muted,#6B7280);font-weight:400}
.hub-soon{background:var(--pn-gold-wash,#FEF3C7);color:var(--pn-gold-deep,#92400E);border-radius:var(--pn-r-sec,10px);padding:12px 14px}
.hub-trail{margin-left:12px;font-weight:400;font-size:.85rem}.hub-trail a{font-weight:400;text-decoration:underline}

.hub-loop{margin:0;padding-left:1.3rem}.hub-loop li{margin:0 0 .6rem}
.os-next{background:#fff;border:2px solid var(--pn-doc-navy,#1F4E79);border-radius:12px;padding:14px 16px;margin:16px auto;max-width:720px;font-family:Arial,Helvetica,sans-serif}
.os-next .ns-text{color:var(--pn-doc-navy,#1F4E79);font-weight:700;margin:0 0 10px}
.os-next a{display:inline-block;background:var(--pn-doc-navy,#1F4E79);color:#fff;text-decoration:none;font-weight:700;border-radius:8px;padding:10px 16px;min-height:44px}
/* Key examples sheet: on phones the table turns into stacked cards, but an older "width:24%" rule on the name and use cells
   outranks the page's own "width:auto" and squeezes them to one word per line. */
@media (max-width:680px){table.ex td.ex-name,table.ex td.use,table.ex td.n{width:auto !important;text-align:left}}