/* UbayBian v0.5.7 · Profile Select — Cosmic Adventure
   Scoped only to the logged-in profile chooser. Home v0.5.3 remains the locked baseline. */

body[data-profile=""]:not(.login-gateway){
  background:
    radial-gradient(circle at 18% 18%,rgba(71,178,255,.32),transparent 24%),
    radial-gradient(circle at 82% 16%,rgba(196,122,255,.28),transparent 26%),
    radial-gradient(circle at 78% 84%,rgba(255,164,117,.16),transparent 22%),
    linear-gradient(150deg,#153f86 0%,#246fc0 38%,#6b63b9 72%,#425087 100%);
  color:#15324b;
}

body[data-profile=""]:not(.login-gateway) .shell{
  max-width:none;
  width:100%;
  min-height:calc(100vh - 24px);
  display:grid;
  grid-template-rows:auto 1fr auto;
  overflow:hidden;
  border-radius:28px;
  border:1px solid rgba(218,238,255,.32);
  background:transparent;
  box-shadow:0 22px 56px rgba(18,35,78,.24),inset 0 1px 0 rgba(255,255,255,.08);
}

/* Floating cosmic topbar */
body[data-profile=""]:not(.login-gateway) .topbar{
  margin:0;
  min-height:72px;
  padding:13px 26px;
  border:0;
  border-bottom:1px solid rgba(220,238,255,.16);
  border-radius:27px 27px 0 0;
  background:linear-gradient(180deg,rgba(29,48,83,.92),rgba(27,43,74,.88));
  box-shadow:0 10px 28px rgba(18,32,67,.16),inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(18px);
}
body[data-profile=""]:not(.login-gateway) .brand{
  font-size:21px;
  font-weight:900;
  gap:8px;
}
body[data-profile=""]:not(.login-gateway) .brand-icon{font-size:28px;}
body[data-profile=""]:not(.login-gateway) .brand-wordmark{display:inline-flex;gap:0;}
body[data-profile=""]:not(.login-gateway) .brand-wordmark>span{color:#ffd34d;}
body[data-profile=""]:not(.login-gateway) .version{
  margin-left:auto;
  color:#dce9f6;
  background:rgba(255,255,255,.045);
  border-color:rgba(219,235,248,.23);
  padding:5px 10px;
}
body[data-profile=""]:not(.login-gateway) .family-logout{
  min-height:42px;
  padding:8px 18px;
  border-radius:14px;
  border-color:rgba(220,238,248,.34);
  background:rgba(255,255,255,.05);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}

/* Cosmic stage */
body[data-profile=""]:not(.login-gateway) main{
  position:relative;
  min-height:0;
  padding:36px 7vw 30px;
  overflow:hidden;
  background:
    radial-gradient(circle at 7% 20%,rgba(136,192,255,.34) 0 5.2%,transparent 5.35%),
    radial-gradient(circle at 91% 9%,rgba(222,184,255,.24) 0 8%,transparent 8.2%),
    radial-gradient(circle at 9% 87%,rgba(255,179,145,.15) 0 5%,transparent 5.2%),
    radial-gradient(circle at 92% 76%,rgba(255,201,145,.18) 0 6.3%,transparent 6.5%),
    radial-gradient(circle at 15% 13%,rgba(255,255,255,.68) 0 1px,transparent 2px),
    radial-gradient(circle at 26% 33%,rgba(255,255,255,.54) 0 1.4px,transparent 2.2px),
    radial-gradient(circle at 64% 14%,rgba(255,255,255,.65) 0 1.2px,transparent 2px),
    radial-gradient(circle at 79% 37%,rgba(255,255,255,.52) 0 1px,transparent 1.8px),
    radial-gradient(circle at 38% 79%,rgba(255,255,255,.46) 0 1px,transparent 1.8px),
    linear-gradient(155deg,rgba(53,127,198,.88),rgba(63,103,177,.78) 47%,rgba(122,94,162,.72));
}
body[data-profile=""]:not(.login-gateway) main::before,
body[data-profile=""]:not(.login-gateway) main::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:0;
  border:1px solid rgba(226,240,255,.12);
  border-radius:50%;
}
body[data-profile=""]:not(.login-gateway) main::before{
  width:460px;height:460px;
  right:-205px;top:-190px;
  box-shadow:0 0 0 58px rgba(255,255,255,.018),0 0 0 118px rgba(255,255,255,.012);
}
body[data-profile=""]:not(.login-gateway) main::after{
  width:350px;height:350px;
  left:-190px;bottom:-205px;
  box-shadow:0 0 0 52px rgba(255,255,255,.017);
}

/* Intro */
body[data-profile=""]:not(.login-gateway) .profile-intro{
  position:relative;
  z-index:2;
  max-width:1080px;
  margin:0 auto 20px;
  color:white;
}
body[data-profile=""]:not(.login-gateway) .profile-intro::before{
  content:"🪐";
  position:absolute;
  left:-118px;
  top:10px;
  font-size:66px;
  opacity:.42;
  filter:drop-shadow(0 12px 22px rgba(28,49,99,.18));
}
body[data-profile=""]:not(.login-gateway) .profile-intro::after{
  content:"✦";
  position:absolute;
  right:14px;
  top:16px;
  color:#ffe27a;
  font-size:25px;
  text-shadow:-72px 22px 0 rgba(255,229,132,.65),52px 54px 0 rgba(255,255,255,.48);
}
body[data-profile=""]:not(.login-gateway) .profile-intro .eyebrow{
  margin:0 0 7px;
  color:rgba(241,248,255,.84);
  font-size:12px;
  letter-spacing:.11em;
}
body[data-profile=""]:not(.login-gateway) .profile-intro h1{
  margin:0 0 7px;
  font-size:44px;
  line-height:1.04;
  letter-spacing:-.035em;
  color:#fff;
  text-shadow:0 3px 12px rgba(25,45,92,.18);
}
body[data-profile=""]:not(.login-gateway) .profile-intro .intro{
  max-width:780px;
  color:rgba(248,251,255,.90);
  font-size:14px;
  line-height:1.45;
}

/* Character select cards */
body[data-profile=""]:not(.login-gateway) .profile-grid{
  position:relative;
  z-index:2;
  max-width:1080px;
  margin:0 auto;
  gap:20px;
}
body[data-profile=""]:not(.login-gateway) .profile-card{
  min-height:270px;
  padding:26px 26px 22px;
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  grid-template-rows:auto auto auto auto 1fr auto;
  column-gap:22px;
  row-gap:4px;
  align-items:start;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.72);
  border-radius:25px;
  background:
    radial-gradient(circle at 9% 16%,rgba(143,214,255,.24),transparent 25%),
    linear-gradient(145deg,rgba(255,255,255,.94),rgba(243,249,255,.89));
  box-shadow:0 18px 34px rgba(22,42,86,.20),inset 0 1px 0 rgba(255,255,255,.95);
  backdrop-filter:blur(18px);
  transform:translateZ(0);
}
body[data-profile=""]:not(.login-gateway) .profile-card.orange{
  background:
    radial-gradient(circle at 90% 15%,rgba(255,211,125,.20),transparent 27%),
    linear-gradient(145deg,rgba(255,255,255,.95),rgba(255,249,239,.90));
}
body[data-profile=""]:not(.login-gateway) .profile-card:hover{
  transform:translateY(-4px) scale(1.008);
  box-shadow:0 24px 46px rgba(20,38,78,.24),0 0 0 3px rgba(130,206,255,.10),inset 0 1px 0 rgba(255,255,255,.98);
}
body[data-profile=""]:not(.login-gateway) .profile-card.orange:hover{
  box-shadow:0 24px 46px rgba(20,38,78,.22),0 0 0 3px rgba(255,201,92,.11),inset 0 1px 0 rgba(255,255,255,.98);
}

body[data-profile=""]:not(.login-gateway) .profile-card .avatar{
  grid-column:1;
  grid-row:1 / 6;
  width:150px;
  height:150px;
  margin:0;
  padding:0;
  display:grid;
  place-items:center;
  align-self:center;
  justify-self:center;
  border-radius:36px;
  font-size:82px;
  line-height:1;
  background:linear-gradient(145deg,#e8f8ff,#c9edff);
  border:1px solid rgba(86,178,225,.18);
  box-shadow:0 14px 28px rgba(45,133,181,.14),inset 0 1px 0 rgba(255,255,255,.86);
  filter:drop-shadow(0 9px 12px rgba(33,94,137,.10));
}
body[data-profile=""]:not(.login-gateway) .profile-card.orange .avatar{
  background:linear-gradient(145deg,#fff7dc,#ffe5a7);
  border-color:rgba(225,166,52,.18);
  box-shadow:0 14px 28px rgba(177,127,39,.13),inset 0 1px 0 rgba(255,255,255,.86);
}
body[data-profile=""]:not(.login-gateway) .profile-name{
  grid-column:2;
  grid-row:1;
  align-self:end;
  margin:3px 0 0;
  font-size:31px;
  line-height:1.05;
  color:#172e52;
}
body[data-profile=""]:not(.login-gateway) .profile-meta{
  grid-column:2;
  grid-row:2;
  color:#334e69;
  font-size:13px;
  font-weight:700;
}
/* Real subject icons from each child's curriculum, not fake progress data */
body[data-profile=""]:not(.login-gateway) .profile-card::before{
  grid-column:2;
  grid-row:3;
  align-self:center;
  content:"📚  🧮  💻";
  display:block;
  margin-top:11px;
  font-size:22px;
  letter-spacing:3px;
  filter:drop-shadow(0 3px 5px rgba(31,70,112,.10));
}
body[data-profile=""]:not(.login-gateway) .profile-card.orange::before{content:"📚  ✏️  🔬";}
body[data-profile=""]:not(.login-gateway) .profile-card::after{
  grid-column:2;
  grid-row:3;
  justify-self:end;
  align-self:center;
  content:"⭐  🏅";
  margin-top:11px;
  padding:5px 9px;
  border-radius:999px;
  background:rgba(224,244,255,.62);
  border:1px solid rgba(139,198,230,.20);
  font-size:18px;
}
body[data-profile=""]:not(.login-gateway) .profile-card.orange::after{
  background:rgba(255,243,210,.70);
  border-color:rgba(227,184,83,.20);
}
body[data-profile=""]:not(.login-gateway) .profile-count{
  grid-column:2;
  grid-row:4;
  margin-top:7px;
  color:#61798e;
  font-size:12px;
  font-weight:700;
}
body[data-profile=""]:not(.login-gateway) .profile-enter{
  grid-column:1 / -1;
  grid-row:6;
  margin-top:15px;
  min-height:46px;
  display:grid;
  place-items:center;
  border-radius:15px;
  color:#fff;
  background:linear-gradient(180deg,#399df0,#2579ce);
  box-shadow:0 8px 16px rgba(37,121,206,.24),inset 0 1px 0 rgba(255,255,255,.34);
  font-size:15px;
  font-weight:900;
}
body[data-profile=""]:not(.login-gateway) .profile-card.orange .profile-enter{
  color:#fff;
  background:linear-gradient(180deg,#f7c83e,#dca51c);
  box-shadow:0 8px 16px rgba(198,142,18,.23),inset 0 1px 0 rgba(255,255,255,.34);
}

body[data-profile=""]:not(.login-gateway) .hint{
  position:relative;
  z-index:2;
  margin:18px auto 0;
  color:rgba(250,252,255,.92);
  font-size:11.5px;
  text-shadow:0 2px 8px rgba(23,39,80,.22);
}

body[data-profile=""]:not(.login-gateway) footer{
  min-height:42px;
  padding:11px 22px;
  color:rgba(242,248,255,.91);
  background:rgba(23,42,76,.58);
  border-top:1px solid rgba(223,237,255,.12);
  backdrop-filter:blur(12px);
}

@media (max-height:780px) and (min-width:801px){
  body[data-profile=""]:not(.login-gateway) main{padding-top:24px;padding-bottom:20px;}
  body[data-profile=""]:not(.login-gateway) .profile-intro{margin-bottom:14px;}
  body[data-profile=""]:not(.login-gateway) .profile-intro h1{font-size:38px;}
  body[data-profile=""]:not(.login-gateway) .profile-card{min-height:238px;padding:20px 22px 18px;grid-template-columns:145px minmax(0,1fr);}
  body[data-profile=""]:not(.login-gateway) .profile-card .avatar{width:128px;height:128px;font-size:70px;border-radius:30px;}
  body[data-profile=""]:not(.login-gateway) .profile-name{font-size:28px;}
  body[data-profile=""]:not(.login-gateway) .profile-card::before{font-size:20px;margin-top:7px;}
  body[data-profile=""]:not(.login-gateway) .profile-card::after{font-size:16px;margin-top:7px;}
  body[data-profile=""]:not(.login-gateway) .profile-enter{margin-top:10px;min-height:42px;}
  body[data-profile=""]:not(.login-gateway) .hint{margin-top:12px;}
}

@media (max-width:800px){
  body[data-profile=""]:not(.login-gateway){padding:10px;}
  body[data-profile=""]:not(.login-gateway) .shell{min-height:calc(100vh - 20px);border-radius:22px;}
  body[data-profile=""]:not(.login-gateway) .topbar{min-height:62px;padding:10px 15px;border-radius:21px 21px 0 0;}
  body[data-profile=""]:not(.login-gateway) main{padding:26px 16px 30px;overflow:auto;}
  body[data-profile=""]:not(.login-gateway) .profile-intro{margin-bottom:18px;}
  body[data-profile=""]:not(.login-gateway) .profile-intro::before{display:none;}
  body[data-profile=""]:not(.login-gateway) .profile-intro h1{font-size:34px;}
  body[data-profile=""]:not(.login-gateway) .profile-intro .intro{font-size:13px;}
  body[data-profile=""]:not(.login-gateway) .profile-grid{grid-template-columns:1fr;gap:16px;}
  body[data-profile=""]:not(.login-gateway) .profile-card{min-height:230px;grid-template-columns:130px minmax(0,1fr);padding:20px;column-gap:18px;}
  body[data-profile=""]:not(.login-gateway) .profile-card .avatar{width:116px;height:116px;font-size:65px;border-radius:28px;}
  body[data-profile=""]:not(.login-gateway) .profile-name{font-size:27px;}
  body[data-profile=""]:not(.login-gateway) .profile-card::before{font-size:18px;letter-spacing:1px;}
  body[data-profile=""]:not(.login-gateway) .profile-card::after{font-size:15px;padding:4px 7px;}
}

@media (max-width:520px){
  body[data-profile=""]:not(.login-gateway) .brand{font-size:18px;}
  body[data-profile=""]:not(.login-gateway) .version{display:none;}
  body[data-profile=""]:not(.login-gateway) .family-logout{padding:7px 12px;min-height:38px;}
  body[data-profile=""]:not(.login-gateway) .profile-intro h1{font-size:30px;}
  body[data-profile=""]:not(.login-gateway) .profile-card{grid-template-columns:98px minmax(0,1fr);padding:17px;column-gap:14px;}
  body[data-profile=""]:not(.login-gateway) .profile-card .avatar{width:88px;height:88px;font-size:52px;border-radius:23px;align-self:start;}
  body[data-profile=""]:not(.login-gateway) .profile-card::after{display:none;}
  body[data-profile=""]:not(.login-gateway) .profile-card::before{font-size:16px;}
  body[data-profile=""]:not(.login-gateway) .profile-enter{min-height:43px;}
}
