/* Lior HQ production additions (phase2-design §3.1), loaded after hq.css (the prototype's CSS, verbatim).
   Nothing here restyles the prototype's look; it adds what production needs around it. */

/* The hidden attribute always hides (the prototype's display rules would otherwise win). #mSettings keeps the
   prototype's own !important rule and shows once boot.js sets hidden = false (§3.2 #2). */
[hidden]{display:none!important}
.fab[hidden]{display:none!important}
/* Search arrives in Phase 3: the pill keeps its place in the topbar grid, invisible and inert. */
.topbar .search[hidden]{display:flex!important;visibility:hidden;pointer-events:none}
.flex1{flex:1}

/* Hebrew and mixed-direction text, the gaps of the prototype's L654 rule (C#8) */
#askInput, .proposal textarea, .field, .fq, #searchInput, .evidbox, .walksay p, .walkans, .opt, .statusline, .iprev, .tmsg .txt, .cmsg .txt{unicode-bidi:plaintext;text-align:start}

/* Home without the Support and meeting tiles (§3.2 #9) */
.sstats.two{grid-template-columns:repeat(2,minmax(0,1fr))}

/* The Slack view's height (hq.css L637/L646) was set inside Claude's iframe, which has no safe-area insets. In the
   installed app html is padded by both insets, so the inbox subtracts them too and the composer clears the pill nav. */
body[data-view="slack"] .inbox{height:calc(100vh - 190px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important}
@media (max-width:1023px){ body[data-view="slack"] .inbox{height:calc(100vh - 200px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important} }

/* ---------- sign-in gate (auth.js) ---------- */
/* body[data-auth]: boot → the sphere, out → the sign-in screen, in → the app. */
body:not([data-auth="in"]) .shell, body:not([data-auth="in"]) .bottomnav, body:not([data-auth="in"]) .fab, body:not([data-auth="in"]) .drawer, body:not([data-auth="in"]) .dscrim{display:none!important}
body[data-auth="in"] #gate{display:none!important}
/* html already pads by the safe-area insets (hq.css :root), so the gate doesn't add them a second time. */
.gate{max-width:560px;margin:0 auto;padding:0 16px 60px}
.gtop{display:flex;align-items:center;gap:9px;padding:14px 4px 10px;font-weight:700;font-size:16px;letter-spacing:-.01em}
.gate .orb{width:96px;height:96px;margin-bottom:26px;cursor:default}
.gate .orb:hover{transform:none}
.gate .orb::after{width:80px;height:16px;bottom:-30px}
.gate .shead{font-size:clamp(30px,8vw,46px);margin:0 0 14px;max-width:18ch}
.ssub{color:var(--soft);margin:0 0 26px;max-width:36ch}
.gcard{border-radius:28px;padding:20px}
.gstack{display:flex;flex-direction:column;gap:12px}
.glab{display:block;font-size:13px;font-weight:600;color:var(--soft);margin:0 4px -4px}
.gate .field{height:50px;padding:0 16px;font-size:16px;outline:none}
.gate .field:focus{border-color:rgba(217,255,0,.45)!important}
.gate .field.gcode{font-size:26px;font-weight:700;letter-spacing:.35em;text-align:center;font-variant-numeric:tabular-nums}
.gblock{width:100%}
.gnote{font-size:13.5px;color:var(--soft);margin:14px 4px 0;text-align:center}
.gerr{color:var(--warn)}
.gcenter{display:flex;justify-content:center}

/* ---------- phone alerts panel in Settings (HQAuth.pushPanel, the Phase 1 device list) ---------- */
.pushpanel .gprow{align-items:flex-start}
.pushpanel .mark{width:30px;height:30px;border-radius:10px;flex:none;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#EDEDEA;
  background:linear-gradient(180deg,#2c2c30,#18181b);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 2px 6px rgba(0,0,0,.5)}
.pushpanel .mark.done{background:linear-gradient(180deg,#F2FF8A,#C4E800);color:#0a0a0a;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.gacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.gwhy{color:var(--faint);font-size:12.5px;margin:0}
.gwhy b{color:var(--ink);font-weight:600}
.devs{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.dev{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--soft)}
.dev .grow{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.codebox{margin-top:14px;padding:16px;border-radius:20px;background:rgba(217,255,0,.06);border:1px solid rgba(217,255,0,.3);text-align:center;width:100%}
.codeval{font-size:40px;font-weight:800;letter-spacing:.3em;color:var(--lime);font-variant-numeric:tabular-nums;margin:0 0 8px;padding-left:.3em}
.gspin{display:inline-block;width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent}

/* ---------- Settings additions (VIP picker, weekend days, logs) ---------- */
.vippick{margin-top:10px}
.set .srow .seg{flex:none;align-self:center}
.set .srow .pbar{max-width:none}
.set .fcats{margin-bottom:0}
.srow.notif small{overflow-wrap:anywhere}
@media (prefers-reduced-motion: reduce){.gspin{animation:none}}