/* V30 -- tighter icon alignment, legible steps, complete login guide mock, and homepage section controls */

/* Registration menu: same restrained line icons as the home shortcut tiles */
body.public-site.page-register .portal-grid{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;align-items:stretch;
}
body.public-site.page-register .portal-card{
  --portal-card-border:#dfe7ef;
  min-width:0;min-height:190px!important;
  padding:22px 18px!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;
  justify-content:center!important;gap:10px!important;
  text-align:center!important;border:1px solid var(--portal-card-border)!important;
  border-radius:20px!important;background:#fff!important;
  box-shadow:0 12px 28px rgba(33,48,67,.055)!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
body.public-site.page-register .portal-card:hover,
body.public-site.page-register .portal-card:focus-visible{
  transform:translateY(-3px);box-shadow:0 15px 32px rgba(33,48,67,.11)!important;
  border-color:#b4d6c8!important;
}
body.public-site.page-register .portal-card .portal-card-symbol{
  display:grid;place-items:center;width:64px;height:64px;
  flex:0 0 64px;border-radius:18px;
  background:color-mix(in srgb, var(--portal-accent) 10%, white);
  border:1px solid color-mix(in srgb, var(--portal-accent) 14%, white);
  color:var(--portal-accent);
}
body.public-site.page-register .portal-card .portal-card-symbol svg{
  width:29px;height:29px;display:block;stroke:currentColor;
}
body.public-site.page-register .portal-card h3{
  margin:1px 0 0!important;font-size:16px!important;
  line-height:1.35!important;color:#1b355a!important;
  -webkit-text-fill-color:#1b355a!important;
}
body.public-site.page-register .portal-card p{
  margin:0!important;font-size:12.5px!important;line-height:1.6!important;
  max-width:330px;color:#6a7c90!important;-webkit-text-fill-color:#6a7c90!important;
}

/* BEFORE THE GAME: legible steps, subtle sporty numbering */
body.public-site.page-index .home-useful-line{
  grid-template-columns:70px minmax(0,1fr) auto!important;
  column-gap:18px!important;align-items:center!important;
  padding:16px 0!important;
}
body.public-site.page-index .home-useful-line .useful-index{
  display:grid!important;place-items:center!important;
  width:58px!important;height:53px!important;
  font-size:26px!important;font-weight:900!important;line-height:1!important;
  font-variant-numeric:tabular-nums;color:#214a57!important;
  -webkit-text-fill-color:#214a57!important;
  background:linear-gradient(135deg,#f1f7f4,#eef1f9)!important;
  border:1px solid #d7e4e3!important;border-radius:14px!important;
  letter-spacing:-.06em!important;
}
body.public-site.page-index .home-useful-line:nth-of-type(3) .useful-index{background:#eef3fa!important;color:#234c82!important;-webkit-text-fill-color:#234c82!important}
body.public-site.page-index .home-useful-line:nth-of-type(4) .useful-index{background:#fbf3ec!important;color:#a05e30!important;-webkit-text-fill-color:#a05e30!important}

/* Full-width login screenshot, not cover-cropped in phone mock */
body.public-site.page-index .home-reg-guide-layout{
  grid-template-columns:minmax(290px,.86fr) minmax(0,1.2fr)!important;
  gap:clamp(24px,4vw,60px)!important;
}
body.public-site.page-index .home-reg-guide-visual{
  width:100%!important;min-width:0!important;overflow:visible!important;padding:20px 12px!important;
}
body.public-site.page-index .home-reg-guide-device{
  display:flex!important;flex-direction:column!important;
  width:min(100%,350px)!important;
  max-width:350px!important;
  height:auto!important;aspect-ratio:auto!important;
  min-height:0!important;border:9px solid #17382e!important;
  border-radius:39px!important;overflow:hidden!important;
  background:#ffffff!important;
  margin:0 auto!important;
  box-shadow:0 22px 42px rgba(29,54,48,.16)!important;
}
body.public-site.page-index .home-reg-guide-device-top{
  flex:0 0 20px!important;height:20px!important;min-height:20px!important;
}
body.public-site.page-index .home-reg-guide-device img{
  display:block!important;width:100%!important;height:auto!important;
  max-width:100%!important;max-height:none!important;
  object-fit:contain!important;object-position:center top!important;
  aspect-ratio:auto!important;flex:0 0 auto!important;
  border-radius:0!important;background:white!important;
}

/* V31: Section visibility belongs directly on the original dashboard cards.
   V30's extra flex wrappers constrained the card height, clipping live data. */
body.public-site.page-index [data-home-section][hidden]{display:none!important;}
body.public-site.page-index .home-primary-dashboard-grid,
body.public-site.page-index .home-discovery-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
/* Expand a remaining card to full width if its sibling was hidden. */
body.public-site.page-index :is(.home-primary-dashboard-grid,.home-discovery-grid):has(> [data-home-section][hidden]){
  grid-template-columns:minmax(0,1fr)!important;
}

/* Admin's server-side section visibility controls */
body.admin-body .home-visibility-admin-panel{padding:18px;border:1px solid #d9e5e4;border-radius:16px;background:linear-gradient(135deg,#f8fcfa,#f9f8fc);}
body.admin-body .home-visibility-admin-panel h3{font-size:17px;margin:0 0 4px;color:#184c3e}
body.admin-body .home-visibility-admin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
body.admin-body .home-visibility-option{display:flex;align-items:center;gap:10px;padding:11px 12px;margin:0!important;background:#fff;border:1px solid #e0e6ea;border-radius:12px;cursor:pointer;min-height:45px;}
body.admin-body .home-visibility-option input{width:17px;height:17px;accent-color:#177b5b;flex:0 0 17px;}
body.admin-body .home-visibility-option span{font-size:12.5px;color:#37495e;}
body.admin-body .home-visibility-actions{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
body.admin-body .home-visibility-actions button{border-radius:9px;padding:9px 14px;border:1px solid #d6e2e0;background:#fff;color:#1e594a;font-weight:750;cursor:pointer}

@media(max-width:900px){
  body.public-site.page-register .portal-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  body.public-site.page-index .home-reg-guide-layout{grid-template-columns:1fr!important;gap:15px!important}
  body.public-site.page-index .home-reg-guide-device{width:min(100%,320px)!important;max-width:320px!important}
  body.admin-body .home-visibility-admin-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:700px){
  body.public-site.page-index .home-useful-line{grid-template-columns:54px minmax(0,1fr)!important;column-gap:10px!important;padding:12px 0!important;}
  body.public-site.page-index .home-useful-line .useful-index{width:44px!important;height:45px!important;font-size:20px!important;border-radius:12px!important;grid-row:1 / span 2;}
  body.public-site.page-index .home-useful-line a{grid-column:2!important;white-space:normal!important}
  body.public-site.page-index .home-primary-dashboard-grid,
  body.public-site.page-index .home-discovery-grid{grid-template-columns:1fr!important;}
  body.public-site.page-index .home-reg-guide-device{width:min(100%,315px)!important;max-width:315px!important}
}
@media(max-width:530px){
  body.public-site.page-register .portal-grid{grid-template-columns:1fr!important;gap:10px!important}
  body.public-site.page-register .portal-card{min-height:154px!important;padding:16px 14px!important}
  body.public-site.page-register .portal-card .portal-card-symbol{width:56px;height:56px;flex-basis:56px;border-radius:16px;}
  body.public-site.page-register .portal-card .portal-card-symbol svg{width:25px;height:25px}
  body.admin-body .home-visibility-admin-grid{grid-template-columns:1fr;}
}
