/* Home-screen install experiment: isolated on the lobby, easy to revert. */
.home-install{max-width:620px;margin:28px auto 34px;padding:0 12px}
.home-install[hidden]{display:none!important}
.home-install-inner{
  border:1px solid rgba(222,106,143,.36);
  border-radius:16px;padding:18px;
  background:linear-gradient(120deg,rgba(155,32,65,.12),rgba(24,24,29,.68));
  color:#E7E7EB;
}
.home-install-kicker{margin:0 0 8px;color:#F4B0C4;font-size:.71rem;font-weight:800;letter-spacing:.13em}
.home-install h2{font-size:1.22rem;line-height:1.3;margin:0 0 8px;color:#F3F1F3}
.home-install-description{font-size:.89rem;line-height:1.55;margin:0 0 14px;color:#C4C4CC}
.home-install-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-width:310px}
.home-install-buttons button{
  appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:39px;width:100%;cursor:pointer;
  padding:8px 10px;border-radius:9px;
  background:#8C1C40;color:#FFF;border:1px solid #D0557B;
  font-family:inherit;font-size:.82rem;font-weight:700;line-height:1.35;
  text-align:center;
}
.home-install-platform-icon{display:block;width:19px;height:19px;flex:none;fill:currentColor}
.home-install-platform-icon.android{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.home-install-platform-icon.android .android-eye{fill:currentColor;stroke:none}
.home-install-buttons button:hover{background:#A42A52}
.home-install-buttons button:focus-visible{outline:3px solid #F9C2D1;outline-offset:2px}
.home-install-status{margin:14px 0 0;color:#F1C8D4;font-size:.86rem;line-height:1.55}
.home-install-status[hidden]{display:none}
html[data-theme="light"] .home-install-inner{background:#FBF0F3;border-color:#BC7790;color:#30212A}
html[data-theme="light"] .home-install-kicker{color:#89304A}
html[data-theme="light"] .home-install h2{color:#2A2026}
html[data-theme="light"] .home-install-description{color:#514650}
html[data-theme="light"] .home-install-status{color:#682B42}
@media(max-width:420px){
  .home-install{padding:0 4px}
  .home-install-inner{padding:16px}
  .home-install-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* The iOS walkthrough is expanded on demand; illustrations use inline
   vector symbols, not platform screenshots that quickly become obsolete. */
.home-install-guide{margin-top:16px;padding:16px;border:1px solid rgba(244,176,196,.28);border-radius:12px;background:rgba(9,8,14,.23)}
.home-install-guide[hidden]{display:none!important}
.home-install-guide-heading{margin:0 0 14px;font-size:1rem;line-height:1.4;color:#F3E9EE}
.home-install-steps{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.home-install-step{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:start;gap:12px}
.home-install-step-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid rgba(231,133,167,.33);border-radius:10px;background:rgba(147,33,70,.20);color:#F6BBD0}
.home-install-step-icon svg{width:23px;height:23px;flex:none}
.home-install-step-copy{min-width:0;font-size:.84rem;line-height:1.58;color:#D6CAD0}
.home-install-step-copy strong{color:#FFFFFF;font-weight:750}
.home-install-close{margin-top:16px;padding:9px 14px;border:1px solid rgba(244,176,196,.5);border-radius:9px;background:transparent;color:#F4D5E0;font:inherit;font-size:.83rem;cursor:pointer}
.home-install-close:hover{background:rgba(204,83,117,.14)}
.home-install-close:focus-visible{outline:3px solid #F9C2D1;outline-offset:2px}
html[data-theme="light"] .home-install-guide{background:#FFF9FB;border-color:#D7B4C2}
html[data-theme="light"] .home-install-guide-heading{color:#362832}
html[data-theme="light"] .home-install-step-icon{background:#F3DFE6;border-color:#CA9BAE;color:#812844}
html[data-theme="light"] .home-install-step-copy{color:#574B54}
html[data-theme="light"] .home-install-step-copy strong{color:#33232A}
html[data-theme="light"] .home-install-close{color:#6C2541;border-color:#B87E95}

/* Consistent rhythm between top-level Lobby panels. Previously the Hero had
   74px bottom padding while the philosophy panel used a negative top margin;
   both led to uneven gaps. Scope overrides to the Lobby only. */
.lobby-page{--lobby-panel-gap:28px}
.lobby-page .hero{padding-bottom:0}
.lobby-page .lobby-note{margin-top:var(--lobby-panel-gap)}
.lobby-page main > .safeword-why{margin:var(--lobby-panel-gap) auto 0}
.lobby-page main > .home-install{margin:var(--lobby-panel-gap) auto var(--lobby-panel-gap)}