/* Hayabyna bottom app bar (v145) — Home · Daily · My IQ · Me, like an app */
html.hb-app{--hbtab:calc(84px + env(safe-area-inset-bottom,0px))}
html.hb-app .siteFoot{display:none!important}            /* the footer's links and socials live in "Me" now */
html.hb-app .screen.on::after{content:"";display:block;flex:0 0 auto;height:var(--hbtab)}
html.hb-app .scoreView{padding-bottom:var(--hbtab)}
html.hb-app .cookieBar{bottom:calc(var(--hbtab) + 4px)}
html.hb-veil .hbTabs,html.hb-veil .hbSh{display:none}

.hbTabs{position:fixed;z-index:75;left:50%;transform:translateX(-50%);bottom:calc(10px + env(safe-area-inset-bottom,0px));
  width:min(calc(100% - 24px),520px);height:64px;box-sizing:border-box;padding:0 6px;border-radius:26px;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;
  background:rgba(24,18,40,.72);border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(24px) saturate(150%);backdrop-filter:blur(24px) saturate(150%);box-shadow:0 14px 34px rgba(10,6,24,.35)}
.hbTab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:56px;min-width:0;margin:0;padding:0;border:0;border-radius:18px;
  background:none;cursor:pointer;color:rgba(255,255,255,.86);font:600 11.5px/1.1 Figtree,Cairo,system-ui,sans-serif;-webkit-tap-highlight-color:transparent;text-decoration:none}
html[lang="ar"] .hbTab{font:700 12.5px/1.1 Cairo,"Noto Naskh Arabic",system-ui,sans-serif}
.hbTab svg{width:24px;height:24px;flex:none}
.hbTab span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}
.hbTab.on{color:#F6D77E}
.hbTab:active{background:rgba(255,255,255,.12)}
.hbTab:focus-visible{outline:2px solid #F6D77E;outline-offset:-2px}

.hbSh{position:fixed;inset:0;z-index:74;background:rgba(8,6,18,.38);opacity:0;visibility:hidden;transition:opacity .2s,visibility 0s .2s}
.hbSh.on{opacity:1;visibility:visible;transition:opacity .2s}
.hbShp{position:absolute;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));width:min(calc(100% - 24px),520px);box-sizing:border-box;
  padding:16px 12px 14px;border-radius:26px;color:#fff;background:rgba(26,20,44,.92);border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);box-shadow:0 24px 60px rgba(8,6,24,.45);
  transform:translate(-50%,14px);transition:transform .22s;max-height:calc(100svh - 120px);overflow:auto}
.hbSh.on .hbShp{transform:translate(-50%,0)}
.hbShp h2{margin:0 10px 8px;font:700 15px Figtree,Cairo,system-ui,sans-serif;color:rgba(255,255,255,.72)}
.hbMl{display:grid;gap:2px}
.hbMl a{display:flex;align-items:center;gap:14px;padding:12px;border-radius:14px;color:#fff;text-decoration:none;font:600 16px/1.2 Figtree,Cairo,system-ui,sans-serif}
html[lang="ar"] .hbMl a{font:700 16.5px/1.3 Cairo,"Noto Naskh Arabic",system-ui,sans-serif}
.hbMl a[hidden]{display:none}
.hbMl a svg{width:22px;height:22px;flex:none;opacity:.92}
.hbMl a:active{background:rgba(255,255,255,.12)}
.hbFh{margin:12px 12px 10px;font:700 13.5px Figtree,Cairo,system-ui,sans-serif;color:rgba(255,255,255,.72)}
.hbSoc{margin-top:12px;display:flex;justify-content:space-between;gap:6px;padding:0 10px 4px;direction:ltr}
.hbSoc a{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;color:#fff;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.1)}
.hbSoc a svg{width:20px;height:20px}
.hbSoc a:active{background:rgba(255,255,255,.24)}


.hbCopy{margin:12px 0 0;text-align:center;font:600 12px Figtree,system-ui,sans-serif;color:rgba(255,255,255,.62);direction:ltr}
[data-theme="light"] .hbCopy{color:#6b6672}
/* light theme: white glass, dark words */
[data-theme="light"] .hbTabs{background:rgba(255,255,255,.84);border-color:rgba(0,0,0,.08);box-shadow:0 12px 30px rgba(20,16,40,.18)}
[data-theme="light"] .hbTab{color:#2a2730}
[data-theme="light"] .hbTab.on{color:#9A6B0C}
[data-theme="light"] .hbTab:active{background:rgba(0,0,0,.06)}
[data-theme="light"] .hbShp{background:rgba(255,255,255,.95);color:#1d1d22;border-color:rgba(0,0,0,.08);box-shadow:0 24px 60px rgba(20,16,40,.22)}
[data-theme="light"] .hbShp h2,[data-theme="light"] .hbFh{color:#5b5664}
[data-theme="light"] .hbMl a{color:#1d1d22}
[data-theme="light"] .hbMl a:active{background:rgba(0,0,0,.06)}
[data-theme="light"] .hbSoc a{color:#1d1d22;border-color:rgba(0,0,0,.16);background:rgba(0,0,0,.04)}
@media (prefers-reduced-motion:reduce){.hbSh,.hbShp{transition:none}}