/* ===========================================================================
   REEVES -- Search pages (assets/js/home-pages.js): the icon in the account bar and the palette it opens.
   Shown only on the new home (html.home-next). Design rules K1-K5, U15; the house raised face (F4), 8px grid (F1).
   =========================================================================== */
.pg-btn{display:none}
/* a wide screen stacks the bar's buttons (Settings, Sign out): this one joins the stack, labelled, at the top */
html.home-next .who .pg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}
html.home-next .who .pg-btn svg{flex:0 0 auto;width:14px;height:14px}
html.home-next .who .pg-btn .pg-lbl{width:auto;color:inherit}   /* not the bar's gold name style (.who span) */
/* a phone puts them side by side: this one is the icon alone, the first of the three */
@media (max-width:600px), (max-height:520px) and (pointer:coarse){
  html.home-next .who .pg-btn{width:auto;flex:0 0 auto;padding:0 8px;align-self:stretch;min-width:40px}
  html.home-next .who .pg-btn svg{width:16px;height:16px}
  html.home-next .who .pg-btn .pg-lbl{display:none}
}
html.home-next .who .pg-btn:focus-visible{outline:2px solid #D6AF3C;outline-offset:2px}

.pg-layer{position:fixed;inset:0;z-index:55;display:flex;justify-content:center;align-items:flex-start;
  padding:max(8px,env(safe-area-inset-top)) 8px 8px;font-family:'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif}
.pg-layer[hidden]{display:none}
.pg-dim{position:absolute;inset:0;background:rgba(5,6,8,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:pgFade .15s ease-out}
.pg-panel{position:relative;width:100%;max-width:640px;max-height:calc(100% - 16px);display:flex;flex-direction:column;overflow:hidden;
  border-radius:24px;background:linear-gradient(180deg,#1A1D22,#121418);color:#F5F3EC;
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 0 0 1px rgba(255,255,255,.07) inset,0 24px 64px -24px rgba(0,0,0,.95);
  animation:pgIn .15s ease-out;outline:none}
@media (min-width:700px){ .pg-layer{padding-top:12vh} }

/* K1: the field -- 68px, 26px text */
.pg-field{flex:0 0 auto;display:flex;align-items:center;gap:8px;height:68px;padding:0 8px 0 24px;border-bottom:1px solid rgba(255,255,255,.07)}
.pg-field > svg{flex:0 0 auto;width:24px;height:24px;color:#8F979A}
.pg-in{flex:1 1 auto;min-width:0;height:100%;border:0;background:transparent;color:#F5F3EC;outline:none;
  font-family:inherit;font-size:26px;font-weight:400;line-height:1;letter-spacing:-.01em;caret-color:#D6AF3C;padding:0}
.pg-in::placeholder{color:#5F676B}
.pg-x{flex:0 0 auto;width:auto;max-width:none;height:40px;padding:0 16px;border-radius:12px;background:transparent;color:#C9CBC8;
  font-family:inherit;font-size:15px;font-weight:500;line-height:1;box-shadow:none}
.pg-x:focus-visible{outline:2px solid #D6AF3C;outline-offset:-2px}

/* K2: grouped results */
.pg-list{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;padding:8px}
.pg-group{padding:16px 16px 8px;font-size:12px;line-height:16px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#8F979A}
.pg-group:first-child{padding-top:8px}
.pg-row{display:flex;align-items:center;gap:16px;min-height:64px;padding:8px 16px;border-radius:16px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.pg-row.on{background:rgba(255,255,255,.06);box-shadow:0 1px 0 rgba(255,255,255,.06) inset}
.pg-row:active{transform:scale(.99)}
.pg-ic{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;
  background:linear-gradient(180deg,#22262C,#16181C);box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 0 0 1px rgba(255,255,255,.06) inset;color:#C9CBC8}
.pg-ic svg{width:20px;height:20px}
.pg-row.on .pg-ic{color:#F5F3EC}
.pg-tx{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.pg-nm{font-size:17px;line-height:24px;font-weight:600;color:#F5F3EC}
.pg-nm mark{background:transparent;color:#D6AF3C}   /* K3: the typed letters */
.pg-dt{font-size:14px;line-height:20px;color:#8F979A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-chev{flex:0 0 auto;width:16px;height:16px;color:#5F676B}   /* U9: every tappable row has a chevron */
.pg-row.on .pg-chev{color:#C9CBC8}
.pg-none{margin:0;padding:24px 16px;font-size:15px;line-height:24px;color:#8F979A;text-align:center}

/* K4: keyboard hints, on a keyboard only */
.pg-foot{flex:0 0 auto;display:flex;gap:16px;padding:8px 24px;border-top:1px solid rgba(255,255,255,.07);font-size:12px;line-height:24px;color:#8F979A}
.pg-foot kbd{display:inline-block;min-width:24px;margin-right:4px;padding:0 6px;border-radius:6px;background:rgba(255,255,255,.06);
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset;font-family:inherit;font-size:12px;font-weight:500;line-height:20px;text-align:center;color:#C9CBC8}
@media (hover:none){ .pg-foot{display:none} }

/* "< Back to <page>": the top left of the idle home after a page closes. An outline link (P7: the gold rim stays
   Talk's), 40px tall on the 8px grid, the 12px secondary radius (F5); outside the home's centred group, under every
   overlay (the page shell is 40, the palette 55, Settings 59) */
.pb-back{display:none}
html.home-next .pb-back:not([hidden]){position:fixed;z-index:30;top:max(16px,calc(env(safe-area-inset-top) + 8px));left:16px;
  display:inline-flex;align-items:center;gap:8px;width:auto;max-width:calc(100vw - 32px);height:40px;margin:0;padding:0 16px 0 8px;
  border-radius:12px;border:0;background:rgba(255,255,255,.03);box-shadow:0 0 0 1px rgba(255,255,255,.12) inset;color:#C9CBC8;
  font-family:'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-size:14px;font-weight:500;line-height:1;
  letter-spacing:0;text-transform:none;cursor:pointer;-webkit-tap-highlight-color:transparent;animation:pgFade .2s ease-out}
html.home-next .pb-back svg{flex:0 0 auto;width:16px;height:16px}
html.home-next .pb-back .pb-nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.home-next .pb-back .pb-sh,html.home-next .pb-back.pb-short .pb-nm{display:none}   /* the short form, when REEVES is in the way */
html.home-next .pb-back.pb-short .pb-sh{display:inline}
html.home-next .pb-back:hover{color:#F5F3EC;box-shadow:0 0 0 1px rgba(255,255,255,.2) inset}
html.home-next .pb-back:focus-visible{outline:2px solid #D6AF3C;outline-offset:2px}
html.home-next.home-live .pb-back{display:none}

@keyframes pgFade{ from{opacity:0} }
@keyframes pgIn{ from{opacity:0;transform:translateY(-8px) scale(.985)} }
@media (prefers-reduced-motion:reduce){ .pg-dim,.pg-panel{animation:none} .pg-row:active{transform:none} html.home-next .pb-back:not([hidden]){animation:none} }
