/* ============================================================
   STORMY TITANS™ — HOME / PROFILE / VISIBLE-VIEWPORT FIX — R5
   ============================================================ */

:root{
  --st-vvh:100dvh;
  --st-vvtop:0px;
  --st-lake-top:92px;
  --st-lake-bottom-gap:12px;
}

/* Safari/iPhone: lake menus must end inside the *visible* viewport,
   not beneath Safari's tab/address controls. */
.lake-reveal{
  display:flex !important;
  flex-direction:column !important;
  max-height:calc(
    var(--st-vvh, 100dvh)
    - var(--st-lake-top)
    - var(--st-lake-bottom-gap)
    - env(safe-area-inset-bottom)
  ) !important;
}
.lake-reveal .lake-scroll,
.lake-reveal .lake-you-links{
  flex:1 1 auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:auto !important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.lake-training .training-brand,
.lake-you .you-card,
.lake-reveal .lake-titlebar,
.lake-reveal .lake-admin-links{
  flex:0 0 auto;
}
.you-profile-image{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
  display:block;
}
.super-admin-avatar{position:relative}
.header-profile-image{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.super-admin-check{
  position:absolute;right:-4px;bottom:-4px;width:20px;height:20px;border-radius:50%;
  display:grid;place-items:center;background:#d71920;color:#fff;border:2px solid #fff;
  font-style:normal;font-size:.72rem;font-weight:1000;line-height:1
}

/* ---------------- HOME ---------------- */
.home-welcome{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:0 0 12px;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.26)
}
.home-welcome strong{font-size:1rem}
.home-membership{margin-top:2px;color:var(--muted);font-size:.78rem}
.compact{padding:.55rem .7rem!important;min-height:auto!important}

.character-strip{
  display:flex;gap:10px;overflow-x:auto;padding:2px 2px 12px;margin-bottom:12px;
  scrollbar-width:none;-webkit-overflow-scrolling:touch
}
.character-strip::-webkit-scrollbar{display:none}
.strip-character{
  flex:0 0 78px;text-align:center;color:#fff!important;text-decoration:none!important;
  font-size:.72rem;overflow:hidden
}
.strip-avatar{
  width:72px;height:72px;border:1px solid rgba(255,255,255,.65);border-radius:8px;
  display:grid;place-items:center;position:relative;overflow:hidden;
  background:linear-gradient(145deg,#173b5d,#071c2e);margin:0 auto 5px
}
.strip-avatar img{width:100%;height:100%;object-fit:cover}
.strip-avatar b{font-size:1.45rem}
.strip-avatar em{
  position:absolute;right:2px;bottom:2px;background:var(--cyan);color:#00253a;
  border:1px solid #fff;border-radius:8px;padding:1px 4px;font-size:.55rem;font-style:normal;font-weight:1000
}
.presence-dot{
  position:absolute;left:4px;top:4px;width:12px;height:12px;border-radius:50%;
  background:#26b85a;border:2px solid #fff;z-index:3
}

.home-quick-grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;
  padding:12px;margin:0 0 14px;border:1px solid #36536a;border-radius:10px;
  background:rgba(255,255,255,.045)
}
.home-quick-grid a{
  min-height:74px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;padding:8px 4px;border:1px solid rgba(255,255,255,.20);border-radius:8px;
  background:rgba(255,255,255,.06);color:#fff!important;text-decoration:none!important;text-align:center
}
.home-quick-grid a span{font-size:1.25rem}
.home-quick-grid a b{font-size:.72rem}

.home-account-panel{
  margin-bottom:16px;border:1px solid #36536a;border-radius:9px;overflow:hidden;background:rgba(255,255,255,.035)
}
.home-account-panel>header,.home-section-head,.st-profile-module>header{
  background:linear-gradient(90deg,#173e67,#2e6b9d,#173e67);
  color:#fff;padding:8px 10px;font-size:.83rem;font-weight:900
}
.account-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#36536a}
.account-summary-grid>div{background:#0d273c;padding:10px}
.account-summary-grid small{display:block;color:var(--muted);font-size:.65rem;text-transform:uppercase;letter-spacing:.05em}
.account-summary-grid b{display:block;margin-top:3px;font-size:.82rem}
.home-account-actions{display:flex;gap:8px;flex-wrap:wrap;padding:10px}

.home-section-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 8px;border-radius:7px}
.home-section-head span{font-size:.68rem;color:#d8f5ff;text-transform:uppercase;letter-spacing:.08em}

.character-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:20px}
.character-card{min-width:0;border:1px solid #36536a;border-radius:8px;overflow:hidden;background:#fff;color:#071521}
.character-image{display:block;position:relative;aspect-ratio:4/5;background:linear-gradient(145deg,#173b5d,#071c2e);overflow:hidden}
.character-image img{width:100%;height:100%;object-fit:cover}
.character-placeholder{width:100%;height:100%;display:grid;place-items:center;color:#fff;font-size:3rem;font-weight:900}
.character-ai-tag{position:absolute;right:5px;top:5px;background:#00cfff;color:#00253a;border:1px solid #fff;border-radius:8px;padding:2px 5px;font-size:.58rem;font-weight:1000}
.character-card-body{padding:7px}
.character-name{display:block;color:#0b67a1!important;font-weight:900;text-decoration:none!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.character-card-body small{display:block;color:#64727d;font-size:.65rem;margin-top:2px}
.character-card-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:7px}
.character-card-actions a{display:grid;place-items:center;border:1px solid #dde3e7;border-radius:4px;padding:4px;text-decoration:none!important}

.universe-feature{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  margin:20px 0;padding:18px;border:1px solid #3e6f91;border-radius:10px;
  background:linear-gradient(110deg,rgba(0,207,255,.08),rgba(255,255,255,.02))
}
.universe-feature small{display:block;color:var(--cyan);letter-spacing:.12em;font-weight:900}
.universe-feature strong{display:block;font-size:1.25rem;margin:3px 0}
.universe-feature p{margin:5px 0 0;color:var(--muted);font-size:.85rem}

/* ---------------- PROFILE ---------------- */
.st-profile-view{max-width:760px;margin-inline:auto}
.st-profile-idbar{
  display:flex;gap:8px;align-items:center;flex-wrap:wrap;
  padding:7px 10px;margin-bottom:10px;border-radius:6px;
  background:linear-gradient(90deg,#173e67,#2d6897);font-size:.82rem
}
.st-profile-idbar span{color:#d9effc}.st-profile-idbar em{margin-left:auto;color:var(--cyan);font-style:normal;font-weight:900}
.st-profile-hero{display:grid;grid-template-columns:minmax(180px,360px) 1fr;gap:12px;align-items:start}
.st-profile-photo-wrap{position:relative;max-width:360px}
.st-profile-photo{width:100%;aspect-ratio:4/5;object-fit:cover;border:2px solid #fff;border-radius:9px;background:#081a28}
.st-profile-placeholder{display:grid;place-items:center;font-size:5rem;background:linear-gradient(145deg,#173b5d,#071c2e)}
.st-profile-actions{display:grid;gap:7px}
.st-profile-actionbar{display:grid;grid-template-columns:repeat(3,1fr);margin:10px 0;border:1px solid #36536a;border-radius:7px;overflow:hidden}
.st-profile-actionbar a{display:grid;place-items:center;min-height:42px;background:#fff;color:#60717c!important;text-decoration:none!important;border-right:1px solid #e1e5e8}
.st-profile-actionbar a:last-child{border-right:0}
.super-admin-badge{position:absolute;right:-7px;bottom:-7px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#d71920;color:#fff;border:3px solid #fff;font-weight:1000;font-size:1.3rem}
.ai-badge{position:absolute;left:5px;bottom:5px;padding:4px 7px;border-radius:10px;background:#00cfff;color:#002b40;font-weight:1000;border:2px solid #fff}

.st-profile-module{margin:0 0 11px;border:1px solid #36536a;border-radius:7px;overflow:hidden;background:rgba(255,255,255,.03)}
.st-profile-photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px}
.st-profile-photo-grid img,.st-photo-placeholder{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:5px}
.st-photo-placeholder{display:grid;place-items:center;background:#102c43;color:#d4eaf7;font-size:1rem;text-decoration:none!important}
.st-profile-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:5px;padding:8px}
.st-profile-detail-grid>div{padding:9px;background:rgba(255,255,255,.06);border-radius:5px}
.st-profile-detail-grid small{display:block;color:var(--muted);font-size:.62rem;text-transform:uppercase;letter-spacing:.06em}
.st-profile-detail-grid b{display:block;margin-top:3px;font-size:.82rem}
.st-profile-copy{padding:12px;font-size:.88rem;line-height:1.55}
.st-social-list{margin:0;padding-left:1.2rem}
.public-id-list{display:grid;gap:6px}.public-id-list>div{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

@media(max-width:700px){
  :root{--st-lake-top:80px;--st-lake-bottom-gap:8px}
  .home-welcome{padding-inline:4px}
  .home-quick-grid{grid-template-columns:repeat(4,1fr);gap:5px;padding:8px}
  .home-quick-grid a{min-height:66px;padding:5px 2px}
  .account-summary-grid{grid-template-columns:repeat(2,1fr)}
  .character-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .character-card-body{padding:6px}
  .universe-feature{align-items:flex-start;padding:12px}
  .st-profile-hero{grid-template-columns:1fr}
  .st-profile-photo-wrap{width:min(100%,360px);margin-inline:auto}
  .st-profile-actions{grid-template-columns:repeat(2,1fr)}
  .st-profile-detail-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:390px){
  .home-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .home-quick-grid a b{font-size:.64rem}
  .st-profile-detail-grid{gap:4px;padding:6px}
  .st-profile-detail-grid>div{padding:7px}
}