/* TradeRealm 3.5.0 — targeted public UI updates
   - Calculator: only the + item picker changes on mobile.
   - Profile: My Collection inherits the pets.php rarity backgrounds only.
   - Registration: Roblox referral pre-flight prompt. */

/* Calculator — do not touch the calculator shell, offers or result layout. */
@media (max-width:760px){
  body[data-page="calculator"] .calc-picker-modal .catalog-picker-layout{
    grid-template-columns:84px minmax(0,1fr)!important;
    gap:7px!important;
  }
  body[data-page="calculator"] .calc-picker-modal .catalog-item-grid,
  body[data-page="calculator"] .calc-picker-modal .catalog-item-grid.modal-catalog{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:5px!important;
    padding:3px 2px 12px!important;
  }
  body[data-page="calculator"] .calc-picker-modal .catalog-item-card{
    min-width:0!important;
    min-height:96px!important;
    padding:4px!important;
    border-radius:10px!important;
    grid-template-rows:50px auto!important;
  }
  body[data-page="calculator"] .calc-picker-modal .catalog-item-art{height:50px!important}
  body[data-page="calculator"] .calc-picker-modal .catalog-item-art .mini-pet-img{
    width:48px!important;height:48px!important;object-fit:contain!important;
  }
  body[data-page="calculator"] .calc-picker-modal .catalog-item-copy b{
    font-size:6.8px!important;line-height:1.05!important;display:-webkit-box!important;
    -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }
  body[data-page="calculator"] .calc-picker-modal .catalog-item-copy small{font-size:5.6px!important}
  body[data-page="calculator"] .calc-picker-modal .catalog-item-copy em{font-size:6px!important}
}
@media (max-width:430px){
  body[data-page="calculator"] .calc-picker-modal .catalog-picker-layout{grid-template-columns:78px minmax(0,1fr)!important}
  body[data-page="calculator"] .calc-picker-modal .catalog-item-grid,
  body[data-page="calculator"] .calc-picker-modal .catalog-item-grid.modal-catalog{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  body[data-page="calculator"] .calc-picker-modal .catalog-item-card{min-height:104px!important;grid-template-rows:57px auto!important}
  body[data-page="calculator"] .calc-picker-modal .catalog-item-art{height:57px!important}
  body[data-page="calculator"] .calc-picker-modal .catalog-item-art .mini-pet-img{width:55px!important;height:55px!important}
  body[data-page="calculator"] .calc-picker-modal .catalog-item-copy b{font-size:7.4px!important}
}

/* Profile — My Collection rarity backgrounds only. No layout/content changes. */
body[data-page="profile"] .profile-card-grid-v171 .collection-collectible-v140{
  --rarity-accent:#b7c0cf;--rarity-mid:#394253;--rarity-deep:#161d2b;
  background:
    radial-gradient(circle at 20% 5%,rgba(255,255,255,.22),transparent 25%),
    linear-gradient(145deg,var(--rarity-mid),var(--rarity-deep) 72%)!important;
  border-color:color-mix(in srgb,var(--rarity-accent) 62%,#eef4ff 38%)!important;
}
body[data-page="profile"] .profile-card-grid-v171 .collection-collectible-v140.rarity-common{--rarity-accent:#b7c0cf;--rarity-mid:#394253;--rarity-deep:#161d2b}
body[data-page="profile"] .profile-card-grid-v171 .collection-collectible-v140.rarity-uncommon{--rarity-accent:#62e39a;--rarity-mid:#245f47;--rarity-deep:#10291f}
body[data-page="profile"] .profile-card-grid-v171 .collection-collectible-v140.rarity-rare{--rarity-accent:#62b8ff;--rarity-mid:#23558c;--rarity-deep:#102846}
body[data-page="profile"] .profile-card-grid-v171 .collection-collectible-v140.rarity-ultra-rare{--rarity-accent:#da83ff;--rarity-mid:#70408c;--rarity-deep:#301b46}
body[data-page="profile"] .profile-card-grid-v171 .collection-collectible-v140.rarity-legendary{
  --rarity-accent:#ffe785;--rarity-mid:#5d3b84;--rarity-deep:#24163e;
  background:
    radial-gradient(circle at 12% 5%,rgba(255,255,255,.26),transparent 22%),
    linear-gradient(125deg,#71355c,#4f3d91,#196c88,#4f7d4b,#91662e,#71355c)!important;
  background-size:360% 360%!important;
  animation:tr350CollectionLegendaryHue 7s ease-in-out infinite!important;
}
body[data-page="profile"] .profile-card-grid-v171 .collection-collectible-v140.rarity-legendary:after{
  content:""!important;position:absolute!important;inset:-55%!important;z-index:1!important;
  background:
    linear-gradient(112deg,transparent 35%,rgba(255,255,255,.04) 43%,rgba(255,255,255,.28) 50%,rgba(255,255,255,.05) 57%,transparent 65%),
    radial-gradient(circle,rgba(255,245,176,.23) 0 1px,transparent 1.6px) 0 0/22px 22px!important;
  transform:translateX(-48%) rotate(9deg);animation:tr350CollectionLegendaryShine 5.4s linear infinite!important;pointer-events:none!important;
}
@keyframes tr350CollectionLegendaryHue{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes tr350CollectionLegendaryShine{0%{transform:translateX(-48%) rotate(9deg)}58%,100%{transform:translateX(48%) rotate(9deg)}}
@media(prefers-reduced-motion:reduce){
  body[data-page="profile"] .profile-card-grid-v171 .collection-collectible-v140.rarity-legendary,
  body[data-page="profile"] .profile-card-grid-v171 .collection-collectible-v140.rarity-legendary:after{animation:none!important}
}

/* Registration — referral reminder before leaving for Roblox OAuth. */
.tr350-oauth-referral-backdrop{position:fixed;inset:0;z-index:120;background:rgba(3,6,16,.78);backdrop-filter:blur(8px);display:grid;place-items:center;padding:16px}
.tr350-oauth-referral-backdrop[hidden]{display:none!important}
.tr350-oauth-referral-card{width:min(520px,100%);border:1px solid rgba(145,123,255,.34);border-radius:24px;background:linear-gradient(155deg,#171d43,#0b1029 70%);box-shadow:0 30px 90px rgba(0,0,0,.48);padding:24px;position:relative;overflow:hidden}
.tr350-oauth-referral-card:before{content:"";position:absolute;inset:-100px auto auto -80px;width:240px;height:240px;border-radius:50%;background:rgba(124,92,255,.20);filter:blur(55px);pointer-events:none}
.tr350-oauth-referral-card>*{position:relative;z-index:1}.tr350-oauth-referral-card .eyebrow{display:block;margin-bottom:7px}.tr350-oauth-referral-card h2{margin:0 0 8px;font-size:25px}.tr350-oauth-referral-card p{margin:0 0 16px;color:#aeb8d5;line-height:1.55;font-size:13px}.tr350-oauth-referral-card label{display:grid;gap:6px}.tr350-oauth-referral-card label span{font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#d9d5ff}.tr350-oauth-referral-card input{width:100%;min-height:48px;border-radius:13px;border:1px solid rgba(154,137,255,.32);background:#080d20;color:#fff;padding:0 13px;text-transform:uppercase;font-weight:850;letter-spacing:.05em;outline:none}.tr350-oauth-referral-card input:focus{border-color:#9e8cff;box-shadow:0 0 0 3px rgba(126,103,255,.12)}.tr350-oauth-referral-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.tr350-oauth-referral-card small{display:block;margin-top:12px;color:#7f8bab;font-size:9px;line-height:1.45}.tr350-oauth-referral-close{position:absolute;right:14px;top:12px;border:0;background:transparent;color:#9aa6c7;font-size:23px;cursor:pointer}
@media(max-width:560px){.tr350-oauth-referral-card{padding:19px;border-radius:20px}.tr350-oauth-referral-card h2{font-size:21px}.tr350-oauth-referral-actions{grid-template-columns:1fr}.tr350-oauth-referral-card p{font-size:12px}}