:root{--cyan:#24e6ff;--panel:#061522;--line:rgba(36,230,255,.55)}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#020913;color:#eaffff;font-family:Arial,Helvetica,sans-serif}
body{background:
radial-gradient(circle at 50% -10%,rgba(36,230,255,.22),transparent 34%),
radial-gradient(circle at 80% 15%,rgba(126,88,255,.16),transparent 28%),
#020913}
.erq-page{max-width:1120px;margin:0 auto;padding:14px}
.erq-top,.erq-main,.erq-card{border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(5,24,38,.96),rgba(2,10,20,.96));box-shadow:0 0 24px rgba(0,225,255,.16)}
.erq-top{display:flex;align-items:center;gap:20px;padding:18px;margin-bottom:16px}
.rank{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#8f7cff,#24e6ff,#23314a,#8f7cff);font-weight:900;font-size:22px;box-shadow:0 0 18px rgba(36,230,255,.35)}
.erq-top h1{margin:0;font-size:34px;line-height:1}.erq-top small{color:#8ff7ff;font-weight:800;letter-spacing:.08em}
.erq-main{display:grid;grid-template-columns:minmax(0,1fr) 284px;gap:16px;padding:14px}
.erq-stage h2{margin:0 0 10px;color:#fff;text-shadow:0 0 12px rgba(36,230,255,.4)}
#gameCanvas{display:block;width:100%;max-width:800px;aspect-ratio:25/17;border:1px solid rgba(36,230,255,.65);border-radius:14px;background:#102638;image-rendering:pixelated;box-shadow:inset 0 0 28px rgba(0,0,0,.42),0 0 22px rgba(36,230,255,.12)}
.erq-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
button{border:1px solid var(--line);background:linear-gradient(180deg,#0c3f5a,#061b2d);color:white;border-radius:10px;padding:10px 18px;font-weight:900;cursor:pointer;box-shadow:0 0 12px rgba(36,230,255,.14)}
button:hover{filter:brightness(1.15)}
.erq-side{display:flex;flex-direction:column;gap:12px}.erq-card{padding:14px}
.erq-card h3{margin:0 0 12px;color:#24e6ff;letter-spacing:.08em}.stat{display:flex;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.09);padding:7px 0}
.start{position:fixed;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,rgba(0,215,255,.18),rgba(0,0,0,.82));z-index:20}
.start-card{width:min(520px,88vw);border:1px solid var(--line);border-radius:20px;background:rgba(3,17,29,.96);padding:32px;text-align:center;box-shadow:0 0 35px rgba(0,225,255,.24)}
.start-card h1{font-size:38px;margin:8px 0}.start-card p{color:#aeefff}
.start-card button{width:240px;margin:8px auto;display:block}
.hidden{display:none!important}
@media(max-width:900px){.erq-main{grid-template-columns:1fr}.erq-top h1{font-size:26px}.erq-side{display:grid;grid-template-columns:1fr 1fr}}
@media(max-width:560px){.erq-side{display:flex}.erq-top{align-items:flex-start}.rank{width:48px;height:48px}.erq-page{padding:8px}}

/* V10.2 cards rebuild additions */
.erq-cards-build .erq-top{justify-content:space-between}
.erq-title p{margin:6px 0 0;color:#9eefff}
.erq-top-actions{display:flex;gap:8px;margin-left:auto}
.erq-dashboard-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.profile-row{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.avatar-egg{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:radial-gradient(circle,#fff5be,#ffd45a);box-shadow:0 0 18px rgba(255,215,90,.28);font-size:24px}
.profile-row strong{display:block;font-size:18px}.profile-row span{color:#9eefff;font-size:12px;font-weight:800;text-transform:uppercase}
.quest-pill{border:1px solid rgba(36,230,255,.25);border-radius:10px;padding:8px 10px;margin:7px 0;background:rgba(8,35,55,.64);color:#dffcff;font-weight:800}
.quest-pill.active{border-color:rgba(255,211,84,.65);box-shadow:0 0 14px rgba(255,211,84,.14);color:#fff4b0}
.inventory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.inventory-grid span{display:grid;place-items:center;height:38px;border:1px solid rgba(36,230,255,.25);border-radius:10px;background:rgba(255,255,255,.04);font-size:21px}
.erq-main-wide{grid-template-columns:minmax(0,1fr) 310px}
.stage-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.stage-badges{display:flex;gap:6px;flex-wrap:wrap}.stage-badges span{border:1px solid rgba(36,230,255,.28);border-radius:999px;padding:6px 9px;color:#9eefff;background:rgba(0,215,255,.07);font-size:11px;font-weight:900;text-transform:uppercase}
.activity-line,.leader-row{border-bottom:1px solid rgba(255,255,255,.08);padding:8px 0;color:#dffcff}.activity-line b{color:#24e6ff}
.leader-row{display:flex;justify-content:space-between}.leader-row strong{color:#fff4a6}
.shop-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.shop-preview div{border:1px solid rgba(36,230,255,.25);border-radius:12px;background:rgba(255,255,255,.04);padding:10px 6px;text-align:center}.shop-preview span{display:block;font-size:24px}.shop-preview b{font-size:12px;color:#dffcff}
@media(max-width:1050px){.erq-dashboard-grid{grid-template-columns:repeat(2,1fr)}.erq-main-wide{grid-template-columns:1fr}}
@media(max-width:600px){.erq-dashboard-grid{grid-template-columns:1fr}.erq-top-actions{width:100%;margin-left:0}.erq-top{flex-wrap:wrap}}

/* V10.2 shop restored */
.shop-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.shop-preview .shop-tile{height:auto;min-height:76px;padding:10px 6px;display:grid;place-items:center;text-align:center}
.shop-preview .shop-tile span{display:block;font-size:25px}.shop-preview .shop-tile b{font-size:12px}
.wide-shop-btn{width:100%;margin-top:10px}
.shop-modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:rgba(0,5,12,.78);backdrop-filter:blur(7px)}
.shop-modal-card{width:min(760px,94vw);max-height:88vh;overflow:auto;border:1px solid rgba(36,230,255,.65);border-radius:22px;background:linear-gradient(180deg,rgba(5,24,38,.98),rgba(2,10,20,.98));box-shadow:0 0 38px rgba(0,225,255,.25);padding:18px}
.shop-modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:14px}
.shop-modal-head small{color:#8ff7ff;font-weight:900;letter-spacing:.12em}.shop-modal-head h2{margin:4px 0 0}
#closeShopBtn{width:42px;height:42px;border-radius:14px;font-size:24px;padding:0}
.shop-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.shop-tabs button.active{background:linear-gradient(180deg,#1c7c98,#07314a);box-shadow:0 0 18px rgba(36,230,255,.25)}
.shop-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.shop-item-card{min-height:140px;padding:14px 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:linear-gradient(180deg,rgba(7,35,55,.95),rgba(3,17,29,.95))}
.shop-item-card .shop-icon{font-size:34px}.shop-item-card b{font-size:14px}.shop-item-card em{font-style:normal;color:#9eefff;font-size:11px;text-transform:uppercase;font-weight:900}.shop-item-card strong{color:#fff4a6;font-size:12px}
.rarity-rare{border-color:rgba(80,190,255,.75)}.rarity-epic{border-color:rgba(174,107,255,.75)}.rarity-legendary{border-color:rgba(255,206,74,.85)}
.shop-footer{display:flex;justify-content:space-between;gap:12px;margin-top:14px;color:#9eefff}.shop-footer strong{color:#fff4a6}
.shop-toast{position:fixed;right:18px;bottom:18px;z-index:70;border:1px solid rgba(36,230,255,.65);border-radius:14px;background:rgba(4,18,31,.96);color:#fff;padding:12px 16px;box-shadow:0 0 20px rgba(0,225,255,.22);opacity:0;transform:translateY(10px);transition:.2s}
.shop-toast.show{opacity:1;transform:translateY(0)}
@media(max-width:760px){.shop-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:430px){.shop-grid{grid-template-columns:1fr}.shop-preview{grid-template-columns:1fr}}
/* V10.2 zone/building compatibility additions */
.zone-chip-list{display:flex;flex-wrap:wrap;gap:7px}
.zone-chip-list span{border:1px solid rgba(36,230,255,.25);background:rgba(0,215,255,.07);border-radius:999px;padding:6px 9px;color:#dffcff;font-size:11px;font-weight:900;text-transform:uppercase}


/* V10.2 travel + visibility fix */
.erq-page{max-width:1320px}
.erq-main-wide{grid-template-columns:820px minmax(260px,1fr);align-items:start}
.erq-stage{overflow:visible}
#gameCanvas{width:800px!important;max-width:800px!important;height:544px!important}
.stage-head h2::after{content:'  • Press T for Travel';font-size:12px;color:#8ff7ff;margin-left:10px}
.travel-modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:rgba(0,5,12,.76);backdrop-filter:blur(6px)}
.travel-card{width:min(680px,94vw);border:1px solid rgba(36,230,255,.7);border-radius:22px;background:linear-gradient(180deg,rgba(5,24,38,.98),rgba(2,10,20,.98));box-shadow:0 0 38px rgba(0,225,255,.25);padding:18px}
.travel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.travel-head small{color:#8ff7ff;font-weight:900;letter-spacing:.12em}.travel-head h2{margin:4px 0 0}
#closeTravelBtn{width:42px;height:42px;border-radius:14px;font-size:24px;padding:0}
.travel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.travel-grid button{display:grid;grid-template-columns:38px 1fr;grid-template-areas:'num name' 'num type';text-align:left;align-items:center;gap:2px 10px;padding:12px}
.travel-grid b{grid-area:num;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#24e6ff,#8f7cff);color:#fff}
.travel-grid span{grid-area:name;font-size:15px}.travel-grid em{grid-area:type;font-style:normal;color:#9eefff;font-size:11px;text-transform:uppercase;font-weight:900}
@media(max-width:1180px){.erq-main-wide{grid-template-columns:1fr}#gameCanvas{width:100%!important;height:auto!important}.erq-page{max-width:980px}}
@media(max-width:620px){.travel-grid{grid-template-columns:1fr}}
/* V10.3 biome + 100 zone world */
.travel-card-wide{width:min(980px,96vw)}
.travel-world-grid{display:grid;grid-template-columns:300px 1fr;gap:14px}
.travel-world-grid h3{margin:0 0 10px;color:#24e6ff;letter-spacing:.08em}
.travel-biome-list{display:flex;flex-direction:column;gap:8px;max-height:520px;overflow:auto;padding-right:4px}
.travel-biome-list button{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left}
.travel-biome-list button.active{border-color:rgba(255,211,84,.85);box-shadow:0 0 16px rgba(255,211,84,.18)}
.travel-biome-list em{font-style:normal;color:#9eefff;font-size:11px;text-transform:uppercase;font-weight:900}
.travel-zone-list{display:grid;grid-template-columns:repeat(10,1fr);gap:6px;max-height:520px;overflow:auto;padding-right:4px}
.travel-zone-list button{padding:8px 4px;font-size:11px;border-radius:8px}
[data-zone-name]{color:inherit}
@media(max-width:900px){.travel-world-grid{grid-template-columns:1fr}.travel-zone-list{grid-template-columns:repeat(5,1fr)}}

/* V10.3 free-roam walking zone transitions */
.zone-walk-toast{position:fixed;left:50%;top:24px;transform:translate(-50%,-12px);z-index:90;border:1px solid rgba(36,230,255,.75);border-radius:999px;background:rgba(4,18,31,.96);color:#fff;padding:11px 18px;font-weight:900;box-shadow:0 0 24px rgba(0,225,255,.25);opacity:0;transition:.22s}
.zone-walk-toast.show{opacity:1;transform:translate(-50%,0)}
.stage-head h2::after{content:'  • Walk off map edges to roam zones';font-size:12px;color:#8ff7ff;margin-left:10px}

/* V10.3 unique zone world */
.stage-badges span:last-child{border-color:rgba(255,211,84,.65);color:#fff4a6}
.zone-walk-toast{max-width:90vw;text-align:center}

/* V10.3 scroll control fix */
#gameCanvas{
  touch-action:none;
  overscroll-behavior:contain;
}
.erq-stage{
  overscroll-behavior:contain;
}
body.erq-playing{
  overscroll-behavior:contain;
}


/* OPTION 2 FULL CSS FIX - premium player card layout */
.option2-layout{max-width:1320px}
.option2-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:18px 22px;
  margin-bottom:14px;
  border:1px solid rgba(36,230,255,.62);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(5,24,38,.97),rgba(2,10,20,.97));
  box-shadow:0 0 24px rgba(0,225,255,.16);
}
.option2-brand{display:flex;align-items:center;gap:18px}
.eggy-logo{
  width:132px;
  max-height:58px;
  object-fit:contain;
  filter:drop-shadow(0 0 10px rgba(36,230,255,.32));
}
.option2-brand small{color:#24e6ff;font-weight:900;letter-spacing:.12em}
.option2-brand h1{margin:0;font-size:34px;line-height:1;text-shadow:0 0 16px rgba(36,230,255,.24)}
.option2-brand p{margin:7px 0 0;color:#9eefff;font-weight:700}
.option2-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.option2-actions button{min-width:84px}

.premium-player-card{
  display:grid;
  grid-template-columns:260px 110px minmax(230px,1fr) 210px 260px;
  gap:14px;
  align-items:center;
  padding:16px;
  margin-bottom:14px;
  border:1px solid rgba(36,230,255,.55);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(5,24,38,.96),rgba(2,10,20,.96));
  box-shadow:0 0 24px rgba(0,225,255,.13);
}
.premium-profile{display:flex;align-items:center;gap:13px}
.premium-avatar{
  width:64px!important;
  height:64px!important;
  border-radius:16px!important;
  font-size:30px!important;
}
.premium-profile-text small,
.premium-level small,
.premium-rank small{color:#24e6ff;font-weight:900;letter-spacing:.08em}
.premium-profile-text strong{display:block;font-size:24px}
.premium-profile-text span{color:#54f5ff;font-weight:900;font-size:12px}
.premium-level{text-align:center}
.level-orb{
  width:66px;
  height:66px;
  margin:4px auto 0;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:28px;
  font-weight:900;
  background:radial-gradient(circle at 30% 25%,#8ff7ff,#1bcde8 42%,#6a5cff 100%);
  box-shadow:0 0 22px rgba(36,230,255,.28);
}
.premium-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}
.premium-row small{color:#24e6ff;font-weight:900}
.xp-bar{
  height:12px;
  border:1px solid rgba(36,230,255,.28);
  border-radius:999px;
  overflow:hidden;
  background:#091827;
}
.xp-bar span{
  display:block;
  height:100%;
  background:linear-gradient(90deg,#25e6ff,#7b66ff);
  box-shadow:0 0 12px rgba(36,230,255,.5);
}
.premium-xp em,.premium-rank em{display:block;margin-top:7px;color:#9eefff;font-style:normal;font-size:12px}
.premium-rank{display:grid;grid-template-columns:54px 1fr;grid-template-rows:auto auto auto;column-gap:10px;align-items:center}
.premium-rank small{grid-column:1/3}
.rank-badge{
  grid-row:2/4;
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:linear-gradient(135deg,#7a3b16,#e1a63e);
  box-shadow:0 0 18px rgba(255,192,70,.25);
  font-size:25px;
}
.premium-rank strong{font-size:20px}
.premium-mini-stats{display:grid;gap:8px}
.premium-mini-stats div{
  display:grid;
  grid-template-columns:28px 1fr auto;
  align-items:center;
  gap:8px;
  border:1px solid rgba(36,230,255,.22);
  border-radius:12px;
  padding:8px 10px;
  background:rgba(255,255,255,.035);
}
.premium-mini-stats b{color:#9eefff}
.premium-zone{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  gap:10px;
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:12px;
}
.premium-zone span{color:#24e6ff;font-weight:900}
.premium-zone strong{font-size:15px}
.premium-zone em{
  margin-left:auto;
  color:#fff4a6;
  font-style:normal;
  font-weight:900;
  text-transform:uppercase;
}
.option2-card-row{
  display:grid;
  grid-template-columns:1.1fr .9fr 1.2fr;
  gap:14px;
  margin-bottom:14px;
}
.start-logo{width:160px;max-height:62px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(36,230,255,.35));margin-bottom:10px}

@media(max-width:1180px){
  .premium-player-card{grid-template-columns:1fr 100px 1fr}
  .premium-mini-stats{grid-column:1/3}
  .premium-zone{grid-column:1/-1}
  .option2-card-row{grid-template-columns:1fr}
}
@media(max-width:760px){
  .option2-header{align-items:flex-start;flex-direction:column}
  .premium-player-card{grid-template-columns:1fr}
  .premium-mini-stats,.premium-zone{grid-column:auto}
  .premium-zone{align-items:flex-start;flex-direction:column}
  .premium-zone em{margin-left:0}
}

/* Assorted design full replacement - game-first layout with safe existing game/cards/shop */
.assorted-layout{max-width:1440px}
.assorted-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:18px 22px;
  margin-bottom:14px;
  border:1px solid rgba(36,230,255,.62);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(5,24,38,.97),rgba(2,10,20,.97));
  box-shadow:0 0 24px rgba(0,225,255,.16);
}
.assorted-brand{display:flex;align-items:center;gap:18px}
.eggy-logo{width:136px;max-height:58px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(36,230,255,.32))}
.assorted-brand small{display:block;color:#24e6ff;font-weight:900;letter-spacing:.12em}
.assorted-brand h1{margin:0;font-size:34px;line-height:1;text-shadow:0 0 16px rgba(36,230,255,.24)}
.assorted-brand p{margin:7px 0 0;color:#9eefff;font-weight:700}
.assorted-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.assorted-actions button{min-width:84px}

.assorted-player-strip{
  display:grid;
  grid-template-columns:230px 92px minmax(220px,1fr) 190px 250px 260px;
  gap:16px;
  align-items:center;
  padding:18px;
  margin-bottom:14px;
  border:1px solid rgba(36,230,255,.55);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(5,24,38,.96),rgba(2,10,20,.96));
  box-shadow:0 0 24px rgba(0,225,255,.13);
}
.player-mini{display:flex;align-items:center;gap:12px}
.player-mini small,.level-mini small,.rank-mini small,.zone-mini small{color:#24e6ff;font-weight:900;letter-spacing:.08em}
.player-mini strong{display:block;font-size:24px}
.player-mini span{color:#54f5ff;font-weight:900;font-size:12px}
.premium-avatar{width:64px!important;height:64px!important;border-radius:16px!important;font-size:30px!important}
.level-mini{text-align:center}
.level-orb{
  width:66px;height:66px;margin:4px auto 0;border-radius:50%;
  display:grid;place-items:center;color:#fff;font-size:28px;font-weight:900;
  background:radial-gradient(circle at 30% 25%,#8ff7ff,#1bcde8 42%,#6a5cff 100%);
  box-shadow:0 0 22px rgba(36,230,255,.28)
}
.mini-title{display:flex;justify-content:space-between;margin-bottom:7px}
.mini-title span{color:#24e6ff;font-weight:900}
.xp-bar{height:12px;border:1px solid rgba(36,230,255,.28);border-radius:999px;overflow:hidden;background:#091827}
.xp-bar span{display:block;height:100%;background:linear-gradient(90deg,#25e6ff,#7b66ff);box-shadow:0 0 12px rgba(36,230,255,.5)}
.xp-mini em,.rank-mini em{display:block;margin-top:7px;color:#9eefff;font-style:normal;font-size:12px}
.rank-mini{display:grid;grid-template-columns:54px 1fr;grid-template-rows:auto auto auto;column-gap:10px;align-items:center}
.rank-mini small{grid-column:1/3}
.rank-badge{grid-row:2/4;width:50px;height:50px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,#7a3b16,#e1a63e);box-shadow:0 0 18px rgba(255,192,70,.25);font-size:25px}
.rank-mini strong{font-size:20px}
.stats-mini{display:grid;gap:8px}
.stats-mini div{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;border:1px solid rgba(36,230,255,.22);border-radius:12px;padding:8px 10px;background:rgba(255,255,255,.035)}
.stats-mini b{color:#9eefff}
.zone-mini{border-left:1px solid rgba(255,255,255,.12);padding-left:16px}
.zone-mini strong{display:block;margin:6px 0;font-size:15px}.zone-mini span:last-child{color:#fff4a6;text-transform:uppercase;font-weight:900}

.assorted-game-grid{display:grid;grid-template-columns:minmax(800px,1fr) 390px;gap:16px;align-items:start}
.game-panel-large{padding:14px;border:1px solid rgba(36,230,255,.62);border-radius:18px;background:linear-gradient(180deg,rgba(5,24,38,.96),rgba(2,10,20,.96))}
.game-panel-large .stage-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.game-panel-large .stage-head h2{font-size:22px;margin:0}
.game-panel-large .stage-head p{margin:0;color:#8ff7ff;font-size:12px;font-weight:900}
.game-panel-large #gameCanvas{width:100%!important;max-width:100%!important;height:auto!important}
.assorted-side{display:flex;flex-direction:column;gap:14px}
.bottom-card-row{display:grid;grid-template-columns:1.05fr 1fr .95fr 1.1fr;gap:16px;margin-top:16px}
.bottom-card-row .erq-card{min-height:214px}
.shop-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.shop-preview .shop-tile{min-height:78px;display:grid;place-items:center;text-align:center}
.shop-preview .shop-tile span{font-size:25px}.wide-shop-btn{width:100%;margin-top:12px}
.start-logo{width:160px;max-height:62px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(36,230,255,.35));margin-bottom:10px}

@media(max-width:1280px){
  .assorted-player-strip{grid-template-columns:1fr 90px 1fr;align-items:stretch}
  .stats-mini,.zone-mini{grid-column:auto}
  .assorted-game-grid{grid-template-columns:1fr}
  .assorted-side{display:grid;grid-template-columns:1fr 1fr}
  .bottom-card-row{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .assorted-header{flex-direction:column;align-items:flex-start}
  .assorted-player-strip{grid-template-columns:1fr}
  .zone-mini{border-left:0;padding-left:0}
  .assorted-side,.bottom-card-row{grid-template-columns:1fr}
}
/* V10.4 biome MIDI + stronger zone variety */
.stage-badges span:last-child{border-color:rgba(255,211,84,.75);color:#fff4a6}

/* V10.5 gameplay systems cards */
.unique-stats-card .stat strong{color:#fff4a6}
.achievement-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.ach{display:flex;align-items:center;gap:8px;min-height:42px;border:1px solid rgba(36,230,255,.22);border-radius:10px;background:rgba(255,255,255,.035);padding:8px;font-size:12px;font-weight:800}
.ach b{font-size:18px}.ach.unlocked{border-color:rgba(255,211,84,.65);box-shadow:0 0 12px rgba(255,211,84,.14);color:#fff4a6}
.inventory-grid span{cursor:help}

/* V10.6 profile SQL sync */
.sql-profile-sync-card{margin-bottom:14px}
[data-sql-rank-badge] img{display:block}



/* ==========================================================
   EGGY QUEST COMPACT MMORPG CLIENT INTEGRATION
   Directly integrated into v10_2_clean.css.
   Purpose:
   - compact live gameplay HUD
   - earthy atlas/RPG palette
   - remove cyan/neon/purple/green visual language
   - preserve existing PHP, IDs, canvas, and JS hooks
   ========================================================== */

:root {
  --erq-bg-deep: #100904;
  --erq-bg-dark: #1a0f08;
  --erq-panel: #2b170b;
  --erq-panel-hi: #4e2e14;
  --erq-wood: #5a3518;
  --erq-wood-hi: #8b5a27;
  --erq-bronze: #b48236;
  --erq-gold: #e8bd5d;
  --erq-stone: #4d3f2e;
  --erq-stone-hi: #7b705b;
  --erq-moss: #315f36;
  --erq-text: #fff0c9;
  --erq-muted: #c9b27d;
  --erq-line: #8b5a27;
}

html,
body {
  background:
    radial-gradient(circle at 50% -10%, rgba(184, 128, 52, .20), transparent 34%),
    linear-gradient(180deg, #201208 0%, #100904 58%, #090503 100%) !important;
  color: var(--erq-text) !important;
}

.erq-page.assorted-layout,
.assorted-layout {
  width: min(1540px, 98vw) !important;
  margin: 8px auto 18px !important;
  padding: 0 !important;
  display: block !important;
}

/* Compact top bar */
.assorted-header {
  min-height: 0 !important;
  padding: 10px 12px !important;
  margin: 0 0 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(232,189,93,.13), transparent 38%),
    linear-gradient(180deg, var(--erq-panel-hi), var(--erq-bg-dark)) !important;
  border: 4px solid var(--erq-stone) !important;
  outline: 2px solid var(--erq-line) !important;
  box-shadow:
    0 0 0 3px #201208,
    0 10px 20px rgba(0,0,0,.55),
    inset 0 0 18px rgba(0,0,0,.55) !important;
  border-radius: 6px !important;
}

.assorted-brand {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.eggy-logo {
  width: 42px !important;
  height: 42px !important;
  object-fit: contain !important;
  background: #160b04 !important;
  border: 3px solid var(--erq-line) !important;
  outline: 2px solid #201208 !important;
  border-radius: 6px !important;
  padding: 3px !important;
}

.assorted-brand small,
.stage-head p,
.zone-mini small,
.player-mini small,
.level-mini small,
.rank-mini small,
.erq-card h3,
.travel-head small,
.shop-modal-head small {
  color: var(--erq-muted) !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.assorted-brand h1 {
  margin: 0 !important;
  font-size: clamp(18px, 2vw, 26px) !important;
  color: var(--erq-gold) !important;
  text-shadow: 2px 2px 0 #000 !important;
}

.assorted-brand p {
  margin: 2px 0 0 !important;
  font-size: 12px !important;
  color: var(--erq-muted) !important;
}

.assorted-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 7px !important;
}

/* Compact player strip */
.assorted-player-strip {
  display: grid !important;
  grid-template-columns: 1.35fr .6fr 1.45fr .9fr 1.25fr 1.2fr !important;
  gap: 8px !important;
  margin: 0 0 8px !important;
  padding: 8px !important;
  background:
    linear-gradient(180deg, rgba(78,46,20,.98), rgba(26,15,8,.98)) !important;
  border: 4px solid var(--erq-stone) !important;
  outline: 2px solid var(--erq-line) !important;
  box-shadow:
    0 0 0 3px #201208,
    0 10px 18px rgba(0,0,0,.46),
    inset 0 0 16px rgba(0,0,0,.56) !important;
  border-radius: 6px !important;
}

.player-mini,
.level-mini,
.xp-mini,
.rank-mini,
.stats-mini,
.zone-mini {
  min-height: 0 !important;
  padding: 7px 8px !important;
  background: rgba(18, 10, 5, .72) !important;
  border: 2px solid #5e4323 !important;
  box-shadow: inset 0 0 12px rgba(0,0,0,.62) !important;
  border-radius: 4px !important;
}

.avatar-egg,
.premium-avatar,
.level-orb,
.rank-badge {
  background: #160b04 !important;
  border: 3px solid var(--erq-line) !important;
  box-shadow: inset 0 0 12px rgba(0,0,0,.7) !important;
  color: var(--erq-gold) !important;
}

.stats-mini {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 5px !important;
}

.stats-mini div {
  padding: 5px !important;
  background: #120905 !important;
  border: 1px solid #5e4323 !important;
  color: var(--erq-text) !important;
}

.xp-bar {
  height: 10px !important;
  background: #120905 !important;
  border: 2px solid #5e4323 !important;
  box-shadow: inset 0 0 8px #000 !important;
}

.xp-bar span {
  background: linear-gradient(90deg, #7b4f24, var(--erq-gold)) !important;
}

/* Main compact MMORPG layout */
.assorted-game-grid {
  display: grid !important;
  grid-template-columns: minmax(620px, 1fr) 315px !important;
  gap: 10px !important;
  align-items: start !important;
  margin: 0 !important;
}

.game-column,
.assorted-side {
  min-width: 0 !important;
}

.erq-stage,
.game-panel-large {
  padding: 10px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(232,189,93,.12), transparent 40%),
    linear-gradient(180deg, var(--erq-panel-hi), var(--erq-bg-dark)) !important;
  border: 5px solid var(--erq-stone) !important;
  outline: 2px solid var(--erq-line) !important;
  border-radius: 6px !important;
  box-shadow:
    0 0 0 4px #201208,
    0 14px 26px rgba(0,0,0,.58),
    inset 0 0 22px rgba(0,0,0,.62) !important;
}

.stage-head {
  padding: 0 2px 7px !important;
  margin: 0 !important;
}

.stage-head h2 {
  margin: 0 !important;
  color: var(--erq-gold) !important;
  font-size: 18px !important;
  text-shadow: 2px 2px 0 #000 !important;
}

.stage-head p {
  margin: 2px 0 0 !important;
  font-size: 11px !important;
}

.stage-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  margin: 0 0 8px !important;
}

.stage-badges span {
  padding: 4px 7px !important;
  font-size: 10px !important;
  color: #ead2a3 !important;
  background: #120905 !important;
  border: 1px solid var(--erq-line) !important;
  border-radius: 3px !important;
}

/* Keep real game canvas central and dominant */
#gameCanvas {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 800 / 544 !important;
  background: #0c0704 !important;
  border: 6px solid #2b1a0c !important;
  outline: 3px solid var(--erq-line) !important;
  border-radius: 4px !important;
  box-shadow:
    inset 0 0 24px rgba(0,0,0,.72),
    0 10px 22px rgba(0,0,0,.5) !important;
  image-rendering: pixelated !important;
}

/* Compact stage action bar */
.erq-buttons {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 6px !important;
  margin-top: 8px !important;
}

/* Side HUD cards closer/tighter */
.assorted-side {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.erq-card,
.unique-stats-card,
.achievement-card {
  padding: 9px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(232,189,93,.08), transparent 40%),
    linear-gradient(180deg, #3c2411, #160c06) !important;
  border: 4px solid var(--erq-stone) !important;
  outline: 2px solid var(--erq-line) !important;
  border-radius: 5px !important;
  box-shadow:
    0 0 0 3px #201208,
    0 8px 18px rgba(0,0,0,.5),
    inset 0 0 16px rgba(0,0,0,.66) !important;
}

.erq-card h3 {
  margin: 0 0 7px !important;
  padding-bottom: 5px !important;
  color: var(--erq-gold) !important;
  font-size: 13px !important;
  text-shadow: 2px 2px 0 #000 !important;
  border-bottom: 1px solid rgba(180,130,54,.45) !important;
}

.activity-line,
.leader-row,
.stat,
.quest-pill {
  margin: 5px 0 !important;
  padding: 6px 7px !important;
  background: rgba(18,10,5,.68) !important;
  border: 1px solid #5e4323 !important;
  border-radius: 3px !important;
  color: var(--erq-text) !important;
}

.leader-row strong,
.stat strong {
  color: var(--erq-gold) !important;
}

.achievement-grid,
.inventory-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 5px !important;
}

.inventory-grid {
  grid-template-columns: repeat(4, 1fr) !important;
}

.ach,
.inventory-grid span {
  min-height: 34px !important;
  padding: 5px !important;
  background: #120905 !important;
  border: 2px solid #5e4323 !important;
  box-shadow: inset 0 0 10px rgba(0,0,0,.72) !important;
  border-radius: 3px !important;
}

/* Convert bottom section into compact HUD row */
.bottom-card-row {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 10px !important;
}

/* Buttons: remove green/purple/cyan globally */
button,
.assorted-actions button,
.erq-buttons button,
.start-card button,
.travel-card button,
.shop-modal-card button,
.shop-tabs button,
.shop-tile,
.wide-shop-btn,
#continueBtn,
#newGameBtn,
#saveBtn,
#homeBtn,
#questsBtn,
#inventoryBtn,
#openShopBtn,
#openShopBtnTop,
#openShopBtnStage,
#travelBtnTop,
#travelBtnStage,
#prevZoneBtn,
#nextZoneBtn {
  color: var(--erq-text) !important;
  background:
    linear-gradient(180deg, rgba(255,229,140,.18), rgba(0,0,0,.22)),
    linear-gradient(180deg, var(--erq-wood-hi), var(--erq-wood) 58%, #37200f) !important;
  background-color: var(--erq-wood) !important;
  border: 3px solid #2b1a0c !important;
  outline: 2px solid var(--erq-line) !important;
  border-radius: 4px !important;
  box-shadow:
    0 3px 0 #160b04,
    0 6px 12px rgba(0,0,0,.42),
    inset 0 2px 0 rgba(255,230,160,.18),
    inset 0 -3px 0 rgba(0,0,0,.32) !important;
  text-shadow: 2px 2px 0 #000 !important;
  filter: none !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
  padding: 8px 10px !important;
  min-height: 0 !important;
}

button:hover,
.assorted-actions button:hover,
.erq-buttons button:hover,
.start-card button:hover,
.travel-card button:hover,
.shop-modal-card button:hover,
.shop-tabs button:hover,
.shop-tile:hover,
.wide-shop-btn:hover {
  color: #fff7d6 !important;
  background:
    linear-gradient(180deg, rgba(255,232,150,.24), rgba(0,0,0,.18)),
    linear-gradient(180deg, #a36d32, #6e421e 58%, #442713) !important;
  box-shadow:
    0 3px 0 #160b04,
    0 0 14px rgba(218,168,72,.24),
    inset 0 2px 0 rgba(255,230,160,.25),
    inset 0 -3px 0 rgba(0,0,0,.28) !important;
}

.shop-tabs button.active,
button.active,
.quest-pill.active {
  background:
    linear-gradient(180deg, rgba(255,226,126,.25), rgba(0,0,0,.18)),
    linear-gradient(180deg, var(--erq-bronze), #73501f 62%, #3d2810) !important;
  color: #fff7d6 !important;
  outline-color: var(--erq-gold) !important;
}

/* Splash/modal cards: same earthy system, no cyan neon */
.start {
  background: rgba(10, 6, 3, .78) !important;
  backdrop-filter: blur(2px) saturate(.85) !important;
}

.start-card,
.travel-card,
.travel-card-wide,
.shop-modal-card {
  color: var(--erq-text) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(232,189,93,.16), transparent 38%),
    linear-gradient(180deg, #4e2e14, #1a0f08) !important;
  border: 6px solid var(--erq-stone) !important;
  outline: 3px solid var(--erq-line) !important;
  border-radius: 6px !important;
  box-shadow:
    0 0 0 4px #201208,
    0 22px 42px rgba(0,0,0,.78),
    inset 0 0 35px rgba(0,0,0,.72) !important;
  text-shadow: 2px 2px 0 #000 !important;
}

.start-card h1,
.travel-card h2,
.shop-modal-card h2 {
  color: var(--erq-gold) !important;
  text-shadow: 2px 2px 0 #000, 0 0 10px rgba(232,189,93,.18) !important;
}

.start-card p,
.travel-card,
.shop-modal-card {
  color: var(--erq-text) !important;
}

.start-logo {
  max-width: 92px !important;
  margin-bottom: 8px !important;
  background: #160b04 !important;
  border: 4px solid var(--erq-line) !important;
  outline: 2px solid #201208 !important;
  border-radius: 8px !important;
  padding: 5px !important;
}

/* Shop/travel modals */
.travel-modal,
.shop-modal {
  background: rgba(10,6,3,.78) !important;
  backdrop-filter: blur(2px) saturate(.85) !important;
}

.travel-head,
.shop-modal-head {
  border-bottom: 1px solid rgba(180,130,54,.45) !important;
}

#closeTravelBtn,
#closeShopBtn {
  background: linear-gradient(180deg, #8b4126, #4d2112) !important;
  border-color: #1b0e07 !important;
}

/* Mobile/portrait compact behavior */
@media (max-width: 1100px) {
  .assorted-player-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .assorted-game-grid {
    grid-template-columns: 1fr !important;
  }

  .assorted-side {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .bottom-card-row {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}

@media (max-width: 700px) {
  .erq-page.assorted-layout,
  .assorted-layout {
    width: 96vw !important;
    margin-top: 6px !important;
  }

  .assorted-header {
    display: block !important;
  }

  .assorted-actions {
    margin-top: 8px !important;
    justify-content: stretch !important;
  }

  .assorted-actions button {
    flex: 1 1 calc(50% - 6px) !important;
  }

  .assorted-player-strip,
  .assorted-side,
  .bottom-card-row {
    grid-template-columns: 1fr !important;
  }

  .erq-buttons {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }

  .stats-mini {
    grid-template-columns: 1fr !important;
  }
}



/* ===== UI HIERARCHY OVERRIDE PATCH ===== */

/* make map dominant */
.erq-main{
  box-shadow: 0 0 60px rgba(0,0,0,0.7) !important;
  transform: scale(1.01);
  position: relative;
  z-index: 5;
}

/* push side panels back */
.erq-sidebar, .erq-right-panel{
  opacity: 0.92 !important;
  filter: saturate(0.85) brightness(0.9);
  transform: scale(0.98);
}

/* flatten heavy gold glow */
*{
  text-shadow: none !important;
}

/* soften panels */
.erq-top,.erq-card{
  box-shadow: 0 4px 12px rgba(0,0,0,0.35) !important;
}

/* global depth vignette */
body::before{
  content:"";
  position:fixed;
  inset:0;
  background: radial-gradient(circle at center, transparent 45%, rgba(0,0,0,0.55) 100%);
  pointer-events:none;
  z-index:999;
}

/* bottom bar cleaner */
.erq-bottom{
  opacity:0.95;
  transform:scale(0.97);
}




/* === HARD UI HIERARCHY OVERRIDE === */

.erq-main{
  box-shadow:0 0 60px rgba(0,0,0,.7) !important;
  transform:scale(1.01) !important;
  z-index:5 !important;
}

.erq-sidebar, .erq-right-panel{
  opacity:.92 !important;
  filter:saturate(.85) brightness(.9) !important;
  transform:scale(.98) !important;
}

.erq-top, .erq-card{
  box-shadow:0 4px 12px rgba(0,0,0,.35) !important;
}

*{
  text-shadow:none !important;
}

body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at center, transparent 40%, rgba(0,0,0,.55) 100%);
  z-index:9999;
}

.erq-bottom-bar{
  transform:scale(.97) !important;
  opacity:.95 !important;
}


/* v14.73-zone-title-safe-style-only: safe visual-only zone title style override.
   Never hide .stage-head or layout parents; only neutralise the visible title pill. */
.erq-account-style-v8 .stage-head h2[data-zone-name],
.stage-head h2[data-zone-name] {
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#f1d28a !important;
  text-shadow:0 2px 0 rgba(0,0,0,.78), 0 0 10px rgba(179,117,35,.16) !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.erq-account-style-v8 .stage-head h2[data-zone-name]::before,
.erq-account-style-v8 .stage-head h2[data-zone-name]::after,
.stage-head h2[data-zone-name]::before,
.stage-head h2[data-zone-name]::after {
  content:none !important;
  display:none !important;
}
.erq-account-style-v8 .zone-mini span[data-zone-type],
.zone-mini span[data-zone-type] {
  display:none !important;
}
.erq-account-style-v8 .zone-mini strong[data-zone-name],
.zone-mini strong[data-zone-name] {
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:#f1d28a !important;
  text-shadow:0 2px 0 rgba(0,0,0,.78) !important;
}
