/**
 * GLiBz home redesign ("Strongbox first", mockup A, 2026-10-28).
 * Loaded only by the Home services (GlibzFrontierHome.php), which only show up once
 * activate_home_redesign.php?apply=1 has placed them. Nothing here applies before that.
 * Colours/fonts: the theme tokens in glibz-western-theme.css (:root --gw-*), with fallbacks.
 */
.gh{--gh-deep:var(--gw-bg-deep,#110E0A);--gh-page:var(--gw-bg-page,#1C1710);--gh-block:var(--gw-bg-block,#2A2318);--gh-border:var(--gw-border,#5A4D3E);
  --gh-border-dim:var(--gw-border-dim,#3D3429);--gh-gold:var(--gw-gold,#D4A843);--gh-gold-dim:var(--gw-gold-dim,#A07830);--gh-copper:var(--gw-copper,#B87333);
  --gh-cream:var(--gw-cream,#E8DCC8);--gh-cream-dim:var(--gw-cream-dim,#B8A88C);--gh-muted:#8a7d68;--gh-term:var(--gw-terminal,#00FF41);--gh-term-dim:var(--gw-term-dim,#33CC55);
  --gh-display:'Rye',Georgia,serif;--gh-type:'Special Elite','Courier New',monospace;--gh-read:Georgia,'Times New Roman',serif;
  font-family:var(--gh-read);color:var(--gh-cream);line-height:1.5;box-sizing:border-box}
.gh *,.gh *:before,.gh *:after{box-sizing:border-box}
.gh a{color:var(--gh-gold)}
/* the site's scroll-fade script must never hide these blocks (see fix_fade_injection.php) */
.bx-db-container:has(.gh){opacity:1!important;transform:none!important}

/* guest entry: slim top bar + tagline (the splash has no site header) */
.gh-entry{background:var(--gh-page);margin:0 auto;padding:0 0 24px}
.gh-top{display:flex;align-items:center;gap:12px;padding:10px 16px;background:linear-gradient(#16120C,#110E0A);border-bottom:2px solid var(--gh-gold-dim)}
.gh-logo{font-family:var(--gh-display);font-size:1.7rem;color:var(--gh-cream)!important;text-decoration:none;text-shadow:0 0 12px rgba(212,168,67,.35)}
.gh-top .gh-r{margin-left:auto;display:flex;align-items:center;gap:12px}
.gh-ridein{font-family:var(--gh-type);color:var(--gh-cream-dim)!important;text-decoration:none}
.gh-tag{margin:0;padding:10px 16px;text-align:center;font-family:var(--gh-type);font-size:.92rem;color:var(--gh-cream-dim);background:var(--gh-deep);border-bottom:1px solid var(--gh-border-dim)}
.gh-tag b{color:var(--gh-cream);font-weight:normal}
.gh-in{max-width:1120px;margin:0 auto;padding:0 16px}
.gh-hero{margin-top:18px}

/* buttons */
.gh-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--gh-display);font-size:1.02rem;letter-spacing:.03em;color:#110E0A!important;text-decoration:none!important;
  background:linear-gradient(135deg,var(--gh-gold),var(--gh-copper));border-radius:8px;padding:12px 20px;border:0;box-shadow:0 2px 0 #6b4a1c,0 0 18px rgba(212,168,67,.18)}
.gh-btn.sm{font-size:.9rem;padding:8px 14px}
.gh-btn.big{font-size:1.2rem;padding:15px 26px}
.gh-btn.ghost{background:transparent;color:var(--gh-gold)!important;border:1.5px solid var(--gh-gold-dim);box-shadow:none}

/* fallback hero (only when THE STRONGBOX isn't available) */
.gh-fb{text-align:center;background:radial-gradient(120% 80% at 50% 0%,#2b2213,#110E0A 70%);border:1px solid rgba(212,168,67,.45);border-radius:12px;padding:28px 18px}
.gh-fb h1{font-family:var(--gh-display);font-weight:normal;color:var(--gh-gold);font-size:2rem;line-height:1.15;margin:0 0 8px}
.gh-fb p{color:var(--gh-cream-dim);margin:0 0 16px}
.gh-fine{font-size:.78rem;color:var(--gh-muted);margin:8px 0 0}
.gh-fine b{color:var(--gh-cream-dim)}

/* sections */
.gh-s{margin:30px 0 0}
.gh-kick{font-family:var(--gh-type);color:var(--gh-term-dim);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;margin:0 0 4px}
.gh-h{font-family:var(--gh-display);font-weight:normal;color:var(--gh-gold);font-size:1.55rem;margin:0 0 4px;line-height:1.2}
.gh-lead{color:var(--gh-cream-dim);margin:0 0 16px}

/* steps */
.gh-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:1fr}
.gh-step{position:relative;background:linear-gradient(160deg,var(--gh-block),#1a150e);border:1px solid var(--gh-border);border-radius:12px;padding:16px 16px 16px 70px;min-height:92px}
.gh-n{position:absolute;left:16px;top:16px;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--gh-display);font-size:1.2rem;color:#110E0A;background:linear-gradient(135deg,var(--gh-gold),var(--gh-copper))}
.gh-step h3{margin:0;font-family:var(--gh-display);font-weight:normal;font-size:1.12rem;color:var(--gh-cream)}
.gh-step p{margin:3px 0 6px;color:var(--gh-cream-dim);font-size:.93rem}
.gh-gets{font-family:var(--gh-type);font-size:.8rem;color:var(--gh-term-dim)}
.gh-state{display:inline-block;margin:0 0 4px;font-family:var(--gh-type);font-size:.72rem;padding:2px 8px;border-radius:99px;border:1px solid var(--gh-border);color:var(--gh-cream-dim)}
.gh-step.done{border-color:rgba(0,255,65,.4)}
.gh-step.done .gh-n{background:var(--gh-term)}
.gh-step.done .gh-state{color:var(--gh-term);border-color:rgba(0,255,65,.4)}
.gh-step.now{border-color:var(--gh-gold);box-shadow:0 0 0 1px rgba(212,168,67,.35),0 6px 24px rgba(0,0,0,.4)}
.gh-step.now .gh-state{color:#110E0A;background:var(--gh-gold);border-color:var(--gh-gold)}
.gh-bar{height:6px;background:#0D0D08;border:1px solid var(--gh-border-dim);border-radius:99px;overflow:hidden;margin:5px 0}
.gh-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gh-copper),var(--gh-gold))}
.gh-cta{margin:16px 0 0;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.gh-cta small{color:var(--gh-muted);font-size:.8rem}

/* feed teaser */
.gh-two{display:grid;grid-template-columns:1fr;gap:24px}
.gh-post{display:flex;gap:12px;background:var(--gh-block);border:1px solid var(--gh-border-dim);border-radius:10px;padding:13px 14px;margin:0 0 10px;text-decoration:none!important;color:var(--gh-cream)!important}
.gh-post img,.gh-post .gh-pa{flex:0 0 38px;width:38px;height:38px;border-radius:50%;border:2px solid var(--gh-border);object-fit:cover;background:#4a3f33}
.gh-who{font-family:var(--gh-type);font-size:.85rem;color:var(--gh-cream-dim)}
.gh-who b{color:var(--gh-gold);font-weight:normal}
.gh-post p{margin:2px 0 4px;font-size:.98rem}
.gh-more{display:inline-block;font-family:var(--gh-type);margin-top:4px}

/* doors */
.gh-doors{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gh-door{display:block;text-decoration:none!important;color:var(--gh-cream)!important;background:var(--gh-block);border:1px solid var(--gh-border-dim);border-radius:10px;padding:12px}
.gh-door .ic{font-size:1.4rem;line-height:1}
.gh-door b{display:block;font-family:var(--gh-display);font-weight:normal;color:var(--gh-gold);font-size:1rem;margin-top:6px}
.gh-door span{display:block;color:var(--gh-cream-dim);font-size:.82rem}
.gh-door.wide{grid-column:1/-1}
.gh-sister{margin-top:12px;border:1px dashed var(--gh-border);border-radius:10px;padding:10px 12px;font-size:.85rem;color:var(--gh-cream-dim)}
.gh-sister b{color:var(--gh-cream)}

/* member block on sys_home */
.gh-member{margin:0 0 16px}
.gh-member .gh-s{margin-top:0}
.gh-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.gh-strip .gh-door{padding:10px;text-align:center}
.gh-strip .gh-door span{display:none}

/* mobile bottom bar (max 5) + next-step chip */
.gh-bbar{position:fixed;left:0;right:0;bottom:0;z-index:9990;background:#110E0A;border-top:2px solid var(--gh-gold-dim);display:grid;grid-template-columns:repeat(5,1fr);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
.gh-bbar a{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none!important;color:var(--gh-cream-dim)!important;font-family:var(--gh-type);font-size:.7rem}
.gh-bbar a .i{font-size:1.25rem;line-height:1.1}
.gh-bbar a.on{color:var(--gh-gold)!important}
.gh-bbar a.mid{color:var(--gh-gold)!important}
.gh-bbar a.mid .i{width:44px;height:44px;margin-top:-20px;border-radius:50%;background:linear-gradient(135deg,var(--gh-gold),var(--gh-copper));display:flex;align-items:center;justify-content:center;border:3px solid #110E0A}
.gh-chip{position:fixed;left:10px;right:10px;bottom:calc(64px + env(safe-area-inset-bottom));z-index:9989;display:flex;align-items:center;gap:10px;background:#0D0D08;border:1px solid var(--gh-gold-dim);border-radius:10px;padding:8px 10px;font-size:.88rem;box-shadow:0 6px 20px rgba(0,0,0,.5)}
.gh-chip .t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gh-chip .t b{color:var(--gh-cream)}
.gh-chip .gh-btn{padding:6px 12px;font-size:.85rem}
body.gh-has-bbar{padding-bottom:72px}
body.gh-has-chip{padding-bottom:124px}
/* the frontier's floating buttons and toasts sit where the bar is: lift them above it (phones only) */
@media (max-width:759px){
  body.gh-has-bbar .gf-prefs-btn,body.gh-has-bbar .gf-prefs-menu,body.gh-has-bbar .gf-games-btn,body.gh-has-bbar .gf-fab-boot,body.gh-has-bbar .gf-toast{translate:0 -72px}
  body.gh-has-chip .gf-prefs-btn,body.gh-has-chip .gf-prefs-menu,body.gh-has-chip .gf-games-btn,body.gh-has-chip .gf-fab-boot,body.gh-has-chip .gf-toast{translate:0 -124px}
}

@media (min-width:760px){
  .gh-steps{grid-template-columns:repeat(3,1fr)}
  .gh-steps.four{grid-template-columns:repeat(4,1fr)}
  .gh-step{padding:62px 18px 18px;min-height:180px}
  .gh-two{grid-template-columns:1.6fr 1fr}
  .gh-h{font-size:1.8rem}
  .gh-cta{flex-direction:row;justify-content:center}
  .gh-bbar,.gh-chip{display:none}
  body.gh-has-bbar,body.gh-has-chip{padding-bottom:0}
}
@media (max-width:759px){
  /* phones: with THE STRONGBOX's compact strip on top, all three steps fit the first screen (390x844) */
  .gh-s{margin-top:18px}
  .gh-entry .gh-kick{display:none}
  .gh-h{font-size:1.35rem}
  .gh-lead{margin-bottom:10px;font-size:.92rem}
  .gh-steps{gap:8px}
  .gh-step{min-height:0;padding:10px 12px 10px 58px}
  .gh-n{left:12px;top:12px;width:34px;height:34px;font-size:1rem}
  .gh-step h3{font-size:1.05rem}
  .gh-step p{font-size:.88rem;line-height:1.35;margin:2px 0 3px}
  .gh-gets{font-size:.75rem}
  /* finished steps shrink to one line so the next step is on screen */
  .gh-step.done{min-height:0;padding-top:10px;padding-bottom:10px}
  .gh-step.done .gh-n{top:8px;width:30px;height:30px;font-size:1rem}
  .gh-step.done p,.gh-step.done .gh-gets,.gh-step.done .gh-state{display:none}
  .gh-strip{grid-template-columns:repeat(3,1fr)}
  .gh-strip .gh-door:nth-child(n+4){display:none}
}