/* /ai-calls/ pages (scripts/bake-ai-calls.py). Tokens only — website/brand.css (docs/standards/web-brand.md).
   The bar rules mirror the home "For my AI" story (website/index.html): on html[data-page=ai] the bar shows
   "50 free credits" + Start instead of the trial line + store badges (web-store-cta.md §2). */
.store-bar .tw-bar-ai{display:none}
html[data-page=ai] .store-bar .tw-bar-ai{display:flex}
html[data-page=ai] .store-bar__inner>:not(.tw-bar-ai):is(.store-bar__title,.store-bar__cta){display:none}
.store-bar p.tw-bar-ai{align-items:center}
.tw-bar-start{flex:none;height:44px;align-items:center;padding:0 var(--space-24);border-radius:var(--radius-pill);background:var(--fill-btn);color:var(--on-fill);font-size:14px;font-weight:700;text-decoration:none}

/* the For my AI button (a web sign-in, not a store download — so never a .badge) */
.ai-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 var(--space-24);border-radius:var(--radius-pill);background:var(--fill-btn);color:var(--on-fill);font-family:var(--font-sans);font-size:15px;font-weight:700;text-decoration:none;white-space:nowrap}
.ai-btn:hover{box-shadow:var(--shadow-cta)}
.ai-btn--sm{min-height:36px;padding:0 var(--space-16);font-size:14px}
.ai-cta__row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-16);margin-top:var(--space-12)}
.ai-more{font-family:var(--font-sans);font-size:15px;font-weight:600;color:var(--ink)}

/* an illustrative chat between the reader, their AI app and OsmO */
.ai-chat p{margin:var(--space-8) 0;font-size:17px;line-height:1.5}
.ai-chat p span{display:block;font-family:var(--font-sans);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.ai-chat__osmo span{color:var(--gold-deep)}

/* sources, related links and the hub list */
.ai-checked{font-size:15px;color:var(--ink-2)}
.ai-sources li,.ai-related li{font-size:16px}
.ai-hub th a{font-weight:700}
.ai-hub td{color:var(--ink-2)}
/* article link styles (underline, gold ink) must not reach the button */
a.ai-btn,a.ai-btn:hover,a.tw-bar-start{text-decoration:none!important;color:var(--on-fill)!important}

/* feature-page layout (2026-11-13): hero CTA, 4-up takeaway cards, card grids for related pages and the hub */
.ai-hero-fine{margin:-12px 0 18px;font-size:13px;color:var(--ink-3)}
.k-benefits.ai-benefits--4{grid-template-columns:repeat(2,minmax(0,1fr))}
.k-benefit p a{color:var(--k-gold-text)}
@media (max-width:900px){.k-benefits.ai-benefits--4{grid-template-columns:1fr}}