/* Pool AI public header (front page and /demo/). Loaded after the page's own styles.
   One glass bar: logo + language on the left; quiet text links, then two clear buttons (one per audience) on the right. */
header.hdr{position:sticky;top:10px;z-index:60;gap:8px 12px;margin-bottom:24px;padding:8px 12px 8px 16px;background:rgba(19,19,20,.78);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border:1px solid var(--ln);border-radius:22px;box-shadow:0 10px 34px rgba(0,0,0,.4)}
header.hdr .lg{width:34px;height:34px;border-radius:9px}
header.hdr .brand{font-size:19px}
/* language capsule sits next to the logo, so it never ends up alone on a second row */
header.hdr .pick{order:2;margin-left:6px;padding:0 12px;border:1px solid var(--ln);border-radius:999px;background:rgba(255,255,255,.03)}
header.hdr .pick:hover{border-color:var(--b3)}
header.hdr .nav{order:3;margin-left:auto;flex-wrap:wrap;gap:2px 4px;align-items:center;justify-content:flex-end}
header.hdr .nav a{font:700 12px var(--sans);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
/* quiet links */
header.hdr .nav a.nl,header.hdr .nav a.mini{display:inline-flex;align-items:center;min-height:40px;padding:0 10px;border:0;border-radius:999px;background:none;color:var(--so);text-decoration:none;transition:color .15s,background .15s}
header.hdr .nav a.nl:hover,header.hdr .nav a.mini:hover{color:#fff;background:rgba(255,255,255,.07)}
header.hdr .nav a.mini{color:var(--mu);font-weight:600;font-size:11px}
header.hdr .nav a.nl{order:1}header.hdr .nav a.mini{order:2}
/* live demo gets a small "live" dot */
header.hdr .nav a.lv::before{content:"";flex:none;width:7px;height:7px;margin-right:8px;border-radius:50%;background:#3DDC84;animation:lvp 2.2s ease-out infinite}
@keyframes lvp{0%{box-shadow:0 0 0 0 rgba(61,220,132,.55)}70%,100%{box-shadow:0 0 0 8px rgba(61,220,132,0)}}
/* the two buttons */
header.hdr .nav a.pill:not(.nl){order:4;min-height:42px;padding:0 18px;border:0;transition:transform .15s,box-shadow .15s,background .15s}
header.hdr .nav a.pill:not(.nl):hover{transform:translateY(-1px)}
header.hdr .nav a.p-w{margin-left:8px;box-shadow:0 4px 16px rgba(255,255,255,.12)}
header.hdr .nav a.p-d{order:5;background:linear-gradient(135deg,#3A82EB,#2160C4);box-shadow:0 6px 20px rgba(42,114,219,.45)}
header.hdr .nav a.p-d:hover{background:linear-gradient(135deg,#5EBBFE,#2A72DB);color:#fff}
@media(prefers-reduced-motion:reduce){header.hdr .nav a.lv::before{animation:none}header.hdr .nav a.pill{transition:none}}
/* narrower screens: the two buttons first and full width, links wrap under them, the bar scrolls away with the page */
@media(max-width:1099px){
  header.hdr{position:static;padding:10px 12px 12px;border-radius:20px}
  header.hdr .nav{width:100%;margin-left:0;justify-content:flex-start;gap:8px}
  header.hdr .pick{margin-left:auto}
  header.hdr .nav a.pill:not(.nl){flex:1 1 calc(50% - 4px);justify-content:center;text-align:center;white-space:normal;line-height:1.2;min-height:46px;padding:6px 14px}
  header.hdr .nav a.pill.p-w:not(.nl){order:1;margin-left:0}header.hdr .nav a.pill.p-d:not(.nl){order:2}
  header.hdr .nav a.nl{order:3}header.hdr .nav a.mini{order:4}
  header.hdr .nav a.nl,header.hdr .nav a.mini{min-height:44px}
}
@media(max-width:339px){
  header.hdr .nav a.pill:not(.nl){flex:1 1 100%}
}
