.comet-meta-overlay {
  position: absolute;
  inset: 0;
  z-index: 36;
  display: grid;
  place-items: center;
  padding: max(18px, env(safe-area-inset-top)) 14px max(18px, env(safe-area-inset-bottom));
  box-sizing: border-box;
  color: #173b35;
  background: rgba(19, 50, 55, .42);
  backdrop-filter: blur(7px) saturate(.9);
  font-family: Georgia, 'Times New Roman', serif;
}

.comet-meta-panel {
  position: relative;
  width: min(92vw, 560px);
  max-height: min(86vh, 760px);
  padding: 24px 18px 20px;
  overflow: hidden;
  box-sizing: border-box;
  border: 2px solid rgba(255, 255, 239, .9);
  border-radius: 28px;
  background:
    radial-gradient(circle at 22% 4%, rgba(255,255,255,.9), transparent 30%),
    linear-gradient(145deg, #fbf8db 0%, #e8ecd7 48%, #cadccb 100%);
  box-shadow: inset 0 -8px 12px rgba(76, 92, 65, .18), inset 0 3px 4px #fff,
    0 18px 42px rgba(14, 45, 52, .38), 0 5px 0 #98a68b;
}

.comet-meta-heading { display: flex; min-width: 0; align-items: center; gap: 14px; padding: 0 38px 14px 2px; }
.comet-meta-heading > div { min-width: 0; }
.comet-meta-heading h1 { margin: 0; overflow-wrap: anywhere; font-size: clamp(25px, 7vw, 38px); line-height: 1; }
.comet-meta-heading p { margin: 6px 0 0; font: 600 12px/1.3 system-ui, sans-serif; color: #557067; }
.comet-meta-emblem {
  flex: 0 0 54px; height: 54px; display: grid; place-items: center; border-radius: 50%;
  color: #fff1c0; font: 900 28px/1 system-ui, sans-serif;
  background: radial-gradient(circle at 35% 25%, #77b596, #2f7967 58%, #1c554d 100%);
  border: 3px solid #e9d594; box-shadow: inset 0 3px 4px rgba(255,255,255,.45), 0 4px 0 #897d55, 0 7px 12px rgba(44,65,57,.28);
}
.comet-meta-close {
  position: absolute; z-index: 2; top: 13px; right: 13px; width: 42px; height: 42px;
  border: 2px solid #f6edc7; border-radius: 50%; color: #fff8df; cursor: pointer;
  font: 700 28px/34px system-ui, sans-serif; background: linear-gradient(#568e7d, #276655);
  box-shadow: inset 0 2px 2px rgba(255,255,255,.35), 0 4px 0 #1d5147;
}
.comet-meta-close:active { transform: translateY(3px); box-shadow: inset 0 2px 3px rgba(0,0,0,.16), 0 1px 0 #1d5147; }
.comet-meta-list { display: grid; gap: 10px; max-height: calc(min(86vh, 760px) - 112px); overflow: auto; padding: 4px 5px 10px 2px; scrollbar-width: thin; }
.comet-meta-achievements .comet-meta-list { max-height: calc(min(86vh, 760px) - 158px); }
.comet-meta-card {
  display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: center; gap: 10px;
  min-height: 72px; padding: 10px 12px; box-sizing: border-box;
  border: 1px solid rgba(255,255,255,.9); border-radius: 18px;
  background: linear-gradient(160deg, rgba(255,255,245,.95), rgba(221,231,211,.96));
  box-shadow: inset 0 -4px 6px rgba(82,96,71,.14), 0 4px 0 #aab49a, 0 7px 10px rgba(47,75,66,.16);
  font-family: system-ui, sans-serif;
}
.comet-meta-card[data-complete="true"] { background: linear-gradient(155deg, #fff8d0, #dce9bd); }
.comet-meta-card-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: #fff0b7; font-size: 22px; background: linear-gradient(145deg, #5da184, #266452); box-shadow: inset 0 2px 3px rgba(255,255,255,.4), 0 3px 0 #17483f; }
.comet-meta-card-body { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 10px; }
.comet-meta-card-body strong { grid-column: 1 / -1; min-width: 0; overflow-wrap: anywhere; font-size: 14px; }
.comet-meta-description { grid-column: 1 / -1; color: #61766e; font-size: 10px; }
.comet-meta-card-body progress { grid-column: 1; width: 100%; height: 9px; accent-color: #3d806c; }
.comet-meta-card-body span { grid-column: 2; grid-row: 2; align-self: center; font-weight: 800; font-size: 11px; }
.comet-meta-reward { min-width: 74px; text-align: right; color: #a45816; font: 900 12px/1.2 system-ui, sans-serif; }
.comet-meta-status { display: block; margin-top: 4px; max-width: 110px; color: #46645c; font-size: 9px; }
.comet-meta-platform { width: 100%; min-height: 34px; margin-top: 10px; border: 1px solid #a5b2a1; border-radius: 13px; color: #64736d; background: linear-gradient(#edf0e6, #d4dccf); box-shadow: inset 0 1px 2px #fff, 0 2px 0 #a6af9d; font: 700 11px system-ui, sans-serif; }
.comet-meta-reward-note { margin: 10px 2px 0; color: #566f63; text-align: center; font: 700 11px/1.35 system-ui, sans-serif; }
.comet-meta-reward-note[hidden] { display: none; }
.comet-meta-toast {
  position: absolute; z-index: 48; top: max(94px, calc(env(safe-area-inset-top) + 78px)); left: 50%;
  width: min(82%, 430px); padding: 12px 18px; box-sizing: border-box; transform: translate(-50%, -22px) scale(.96);
  border: 2px solid #fff1bf; border-radius: 18px; opacity: 0; pointer-events: none;
  color: #fff9de; text-align: center; font: 800 14px/1.3 system-ui, sans-serif;
  background: linear-gradient(145deg, #d98a2a, #b65117); box-shadow: inset 0 2px 3px rgba(255,255,255,.36), 0 5px 0 #7b3516, 0 12px 24px rgba(39,49,44,.28);
  transition: opacity .18s ease, transform .22s ease;
}
.comet-meta-toast[data-visible="true"] { opacity: 1; transform: translate(-50%, 0) scale(1); }
.comet-home-action[data-badge]:not([data-badge=""])::after {
  content: attr(data-badge); position: absolute; top: -3px; right: calc(50% - 27px); min-width: 18px; height: 18px; padding: 0 3px;
  box-sizing: border-box; border-radius: 10px; color: white; background: #d95724; border: 2px solid #fff3c8;
  font: 800 10px/14px system-ui, sans-serif; box-shadow: 0 2px 0 #8b3218;
}

@media (max-width: 520px) {
  .comet-meta-panel { width: 96vw; max-height: 90vh; padding: 20px 12px 16px; border-radius: 24px; }
  .comet-meta-heading { gap: 10px; padding-bottom: 12px; }
  .comet-meta-emblem { flex-basis: 48px; height: 48px; }
  .comet-meta-list { max-height: calc(90vh - 102px); }
  .comet-meta-card { grid-template-columns: 40px minmax(0, 1fr); gap: 8px; padding: 9px; }
  .comet-meta-card-icon { width: 38px; height: 38px; }
  .comet-meta-reward { grid-column: 2; min-width: 0; text-align: left; overflow-wrap: anywhere; }
  .comet-meta-status { max-width: none; }
}

@media (prefers-reduced-motion: reduce) { .comet-meta-toast { transition: none; } }

.comet-daily-panel { overflow: visible; }
.comet-daily-emblem { background: radial-gradient(circle at 34% 24%, #ffd98a, #e58a26 58%, #a84b19 100%); }
.comet-daily-week { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding-top: 4px; }
.comet-daily-day {
  position: relative; min-height: 122px; padding: 10px 7px; box-sizing: border-box; display: grid; place-items: center; align-content: center; gap: 7px;
  border: 2px solid #fff8dc; border-radius: 20px; text-align: center; font-family: system-ui, sans-serif;
  color: #294d44; background: linear-gradient(155deg,#fffcec,#d9e5cf); box-shadow: inset 0 3px 2px #fff, inset 0 -5px 7px #869d7c33, 0 4px 0 #95a782, 0 7px 12px #284f4130;
}
.comet-daily-day[data-status="current"] { border-color: #ffd372; background: linear-gradient(150deg,#fff8ce,#f0c878); box-shadow: inset 0 3px 2px #fff9e3, inset 0 -6px 8px #ba671b35, 0 5px 0 #b86d27, 0 9px 16px #8e4d243d; transform: translateY(-3px); }
.comet-daily-day[data-status="future"] { filter: saturate(.65); opacity: .82; }
.comet-daily-day strong { font-size: 12px; }
.comet-daily-day small { min-height: 26px; font-size: 10px; font-weight: 800; line-height: 1.2; }
.comet-daily-reward-icon { width: 47px; height: 47px; display: grid; place-items: center; border-radius: 50%; color: #fff3b2; font-size: 24px; background: radial-gradient(circle at 35% 25%,#ffd967,#df7a1d 62%,#944015); border: 3px solid #fff0b2; box-shadow: inset 0 3px 3px #fff7, 0 4px 0 #85411d; }
.comet-daily-day:nth-child(7) { grid-column: 3 / 5; }
.comet-daily-day:nth-child(7) .comet-daily-reward-icon { background: radial-gradient(circle at 35% 25%,#9ed9bd,#3c8871 62%,#1d5147); }
.comet-daily-day i { position: absolute; top: 6px; right: 7px; width: 23px; height: 23px; border-radius: 50%; color: white; background: #3b826d; font: 900 15px/23px system-ui,sans-serif; }
.comet-daily-streak { margin: 15px 0 8px; text-align: center; color: #47665d; font: 800 12px/1.2 system-ui,sans-serif; }
.comet-daily-claim { width: min(100%, 330px); min-height: 58px; display: block; margin: 0 auto; border: 2px solid #ffe5a0; border-radius: 22px; color: white; background: linear-gradient(#ffad43,#eb6a18); box-shadow: inset 0 3px 3px #fff7, inset 0 -5px 6px #a53b1833, 0 5px 0 #a3451b, 0 9px 15px #7c3f2538; font: 900 16px/1 system-ui,sans-serif; }
.comet-daily-claim:disabled { color: #6e7770; border-color: #e6e7cf; background: linear-gradient(#eef0df,#cfd8c8); box-shadow: inset 0 2px 2px #fff, 0 4px 0 #9aa899; }
.comet-daily-status { min-height: 28px; margin: 10px 10px 0; text-align: center; color: #6b6655; font: 650 11px/1.3 system-ui,sans-serif; }
@media (max-width: 520px) {
  .comet-daily-week { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .comet-daily-day { min-height: 105px; padding: 8px 4px; border-radius: 17px; }
  .comet-daily-day:nth-child(7) { grid-column: 1 / 4; grid-template-columns: auto auto auto; min-height: 82px; }
  .comet-daily-reward-icon { width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) { .comet-daily-day[data-status="current"] { transform: none; } }

.comet-shop-panel { display: flex; flex-direction: column; overflow: hidden; }
.comet-shop-heading { padding-bottom: 8px; }
.comet-shop-preview,
.comet-shop-orb {
  --skin-a: #ff9a4d; --skin-b: #df4f17; --skin-c: #6f251b;
  position: relative; display: block; flex: 0 0 auto; border-radius: 50%;
  background: radial-gradient(circle at 31% 24%, #fff 0 3%, transparent 8%),
    radial-gradient(circle at 36% 30%, var(--skin-a) 0 18%, var(--skin-b) 58%, var(--skin-c) 100%);
  border: 2px solid rgba(255,255,235,.88);
  box-shadow: inset -7px -10px 12px rgba(25,24,37,.34), inset 5px 6px 8px rgba(255,255,255,.18), 0 5px 0 #7e765b, 0 9px 13px rgba(26,51,47,.28);
}
.comet-shop-preview { width: 70px; height: 70px; animation: comet-shop-float 2.8s ease-in-out infinite; }
.comet-shop-orb { width: 58px; height: 58px; margin: 0 auto 6px; }
.comet-shop-preview::after,.comet-shop-orb::after { content: ''; position: absolute; inset: 12% 9% auto 14%; height: 22%; border-radius: 50%; background: linear-gradient(100deg,transparent,#fff9,transparent); transform: rotate(-18deg); }
.comet-meta-panel .comet-overlay-wallet { position: relative; display: flex; top: auto; right: auto; align-self: flex-end;
  width: max-content; margin: 0 2px 10px auto; }
.comet-shop-heading .comet-overlay-wallet { align-self: flex-start; margin: 7px 0 0; padding: 4px 10px; font-size: 12px; }
.comet-shop-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: stretch; flex: 0 0 64px; height: 64px; margin: 0 4px 9px; }
.comet-shop-actions > button:not([hidden]) { min-width: 0; min-height: 0; height: 100%; margin: 0; padding: 6px 8px; }
.comet-shop-actions > button[hidden] { display: none; }
.comet-shop-actions[data-count="1"] > button:not([hidden]) { grid-column: 1 / -1; }
.comet-shop-action-summary { grid-column: 1 / -1; display: grid; place-items: center; min-width: 0; padding: 6px 12px; border: 1px solid #b7c9b0; border-radius: 14px; color: #2c594d; background: #e7eeddd9; font: 800 12px/1.25 system-ui,sans-serif; text-align: center; }
.comet-shop-action-summary[hidden] { display: none; }
.comet-shop-skin-ad { display: grid; place-content: center; gap: 2px; }
.comet-shop-skin-ad small { display: block; overflow-wrap: anywhere; font: 750 10px/1.2 system-ui,sans-serif; }
.comet-shop-skin-ad small[hidden] { display: none; }
.comet-shop-bundle { display:block; width:100%; min-height:42px; margin:0 0 10px; border:2px solid #e2b66b; border-radius:14px; color:#fff9dc; background:linear-gradient(#f0a13a,#cf5b1c); box-shadow:inset 0 2px 2px #fff7,0 3px 0 #91421d; font:850 12px system-ui,sans-serif; }
.comet-shop-bundle { align-self: flex-end; width: auto; min-height: 36px; margin: 0 4px 9px auto; padding: 5px 13px; border-color: #ffe5a2; border-radius: 999px; background: linear-gradient(145deg,#ffc861,#e88122 60%,#b95820); box-shadow: inset 0 2px 0 #fff9,0 3px 0 #8d4c24; font-size: 11px; text-shadow: 0 1px 2px #783b1b; transition: transform .15s ease, filter .15s ease; }
.comet-shop-bundle:not(.comet-shop-coins-ad) { align-self: stretch; width: calc(100% - 8px); min-height: 54px; margin: 0 4px 12px; padding: 10px 16px; border: 3px solid #fff1b5; border-radius: 18px; color: #fffdf0; background: linear-gradient(120deg,#ffc762,#f18b29 55%,#ca571b); box-shadow: inset 0 2px 2px #fff9,0 4px 0 #954516,0 0 14px #f6ac55a8; font: 900 14px/1.2 system-ui,sans-serif; letter-spacing: .01em; animation: comet-shop-paywall-glow 2.4s ease-in-out infinite; }
.comet-shop-bundle:not(.comet-shop-coins-ad):focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@keyframes comet-shop-paywall-glow { 50% { box-shadow: inset 0 2px 2px #fff9,0 4px 0 #954516,0 0 25px #ffd47c; filter: brightness(1.08); } }
.comet-shop-coins-ad { background: linear-gradient(145deg,#69bea0,#2d937b 60%,#1d6d5a); border-color: #e7ffe9; box-shadow: inset 0 2px 0 #fff8,0 5px 0 #175448,0 9px 18px #28433e49; }
.comet-shop-actions > [data-icon]:not([hidden]), .comet-shop-bundle[data-icon]:not(.comet-shop-coins-ad):not([hidden]) {
  display: flex; align-items: center; justify-content: flex-start; gap: 9px; text-align: left;
}
.comet-shop-actions > [data-icon]::before, .comet-shop-bundle[data-icon]::before {
  content: ''; display: block; flex: 0 0 28px; width: 28px; height: 28px; margin: 0;
  background: var(--comet-icon-light) center / contain no-repeat;
}
.comet-shop-skin-ad[data-icon]:not([hidden]) { display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: 9px; align-content: center; }
.comet-shop-skin-ad[data-icon]::before { grid-column: 1; grid-row: 1 / span 2; align-self: center; }
.comet-shop-skin-ad[data-icon] > span, .comet-shop-skin-ad[data-icon] > small { grid-column: 2; text-align: left; }
.comet-shop-actions > .comet-shop-coins-ad[data-icon]:not([hidden]) { margin: 0; padding: 6px 8px; }
.comet-shop-bundle[hidden] { display: none; }
.comet-shop-coins-ad:enabled, .comet-shop-skin-ad:enabled { animation: comet-shop-ad-pulse 1.8s ease-in-out infinite; }
@keyframes comet-shop-ad-pulse { 50% { transform: scale(1.025); filter: brightness(1.15); } }
@media (prefers-reduced-motion: reduce) { .comet-shop-coins-ad:enabled, .comet-shop-skin-ad:enabled, .comet-shop-bundle:not(.comet-shop-coins-ad) { animation: none; } }
.comet-shop-bundle:enabled:active { transform: translateY(3px); filter: brightness(1.1); }
@media (prefers-reduced-motion: reduce) { .comet-shop-bundle { transition: none; } }
.comet-shop-buy { min-height: 40px; margin: 3px 4px 9px; border: 2px solid #e2b66b; border-radius: 14px; color: #fff9dc; background: linear-gradient(#efaa40,#ce6821); box-shadow: inset 0 2px 2px #fff7,0 3px 0 #91421d; font: 850 12px system-ui,sans-serif; }
.comet-shop-buy[hidden] { display: none; }
.comet-shop-buy:disabled { opacity: .65; }
.comet-shop-tabs { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-bottom: 10px; }
.comet-shop-tabs button { min-height: 38px; border: 1px solid #fff9e6; border-radius: 14px; color: #365950; background: linear-gradient(#f7f6df,#d4dfd0); box-shadow: inset 0 2px 2px #fff,0 3px 0 #9ca991; font: 800 11px system-ui,sans-serif; }
.comet-shop-tabs button[data-active="true"] { color: #fff8d9; background: linear-gradient(#eaa64a,#c46720); box-shadow: inset 0 2px 2px #fff6,0 3px 0 #8e421b; }
.comet-shop-grid { display: grid; flex: 1 1 auto; grid-template-columns: repeat(3,minmax(0,1fr)); align-content: start; gap: 9px; min-height: 0; padding: 3px 4px 9px; overflow: auto; scrollbar-width: thin; overflow-anchor: none; }
.comet-shop-card { position: relative; min-height: 137px; padding: 11px 6px 9px; border: 2px solid #e8e4cc; border-radius: 18px; color: #294b43; background: linear-gradient(155deg,#fffdf0,#d7e2d2); box-shadow: inset 0 2px 3px #fff, inset 0 -5px 6px #81917b25,0 4px 0 #9da892; font-family: system-ui,sans-serif; }
.comet-shop-card[data-rarity="rare"] { border-color: #8abfe1; box-shadow: inset 0 2px 3px #fff, inset 0 -5px 7px #548bb133,0 4px 0 #668dab; }
.comet-shop-card[data-rarity="epic"] { border-color: #c699e1; box-shadow: inset 0 2px 3px #fff, inset 0 -5px 7px #8657ab33,0 4px 0 #8663a0; }
.comet-shop-card[data-selected="true"] { outline: 3px solid #ee9b32; outline-offset: -4px; transform: translateY(-2px); }
.comet-shop-selected-state { display:-webkit-box; min-height: 26px; max-height: 26px; margin-top:5px; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; color:#b96b22; font:850 11px/1.15 system-ui,sans-serif; }
.comet-shop-state-badge { position:absolute; z-index:2; top:7px; right:7px; display:grid; place-items:center; min-width:23px; height:23px; padding:0 4px; box-sizing:border-box; border:2px solid #fff8df; border-radius:50%; color:#fff; background:linear-gradient(#4d927a,#25604f); box-shadow:0 2px 0 #315848,0 2px 5px #183c3455; font:900 12px/1 system-ui,sans-serif; }
.comet-shop-state-badge[data-action="coins"] { background:linear-gradient(#ffbd4e,#d2761e);box-shadow:0 2px 0 #944813,0 2px 5px #5c320955; }
.comet-shop-state-badge[data-action="insufficient"],.comet-shop-state-badge[data-action="level"],.comet-shop-state-badge[data-action="sync"] { background:linear-gradient(#89938c,#59645e);box-shadow:0 2px 0 #444d48,0 2px 5px #26332d55; }
.comet-shop-state-badge[data-action="rewarded"] { background:linear-gradient(#f08b45,#c84f23);box-shadow:0 2px 0 #8f321b,0 2px 5px #5d201855; }
.comet-shop-state-badge[data-action="mission"],.comet-shop-state-badge[data-action="daily"] { background:linear-gradient(#76a7db,#4f63ae);box-shadow:0 2px 0 #364786,0 2px 5px #26356855; }
.comet-shop-state-badge[data-action="iap"] { background:linear-gradient(#c99ae7,#8554aa);box-shadow:0 2px 0 #643987,0 2px 5px #3a235855; }
.comet-shop-card-progress { position:absolute; left:12px; right:12px; bottom:7px; height:4px; overflow:hidden; border-radius:5px; background:#294b4326; box-shadow:inset 0 1px 1px #17332d44; }
.comet-shop-card-progress::after { content:''; display:block; width:calc(var(--progress) * 100%); height:100%; border-radius:inherit; background:linear-gradient(90deg,#e7a83e,#ffcf69); }
.comet-shop-card strong { display: block; min-height: 28px; font-size: 11px; line-height: 1.15; }
.comet-shop-card small { display: block; margin-top: 4px; color: #6b6655; font-size: 9px; line-height: 1.15; }
.comet-shop-status { min-height: 26px; margin: 9px 6px 0; text-align: center; color: #6b6655; font: 650 10px/1.3 system-ui,sans-serif; }

.comet-shop-orb[data-skin="ice"],.comet-shop-preview[data-skin="ice"] { --skin-a:#e7ffff;--skin-b:#69cfe5;--skin-c:#2a7997; }
.comet-shop-orb[data-skin="moon"],.comet-shop-preview[data-skin="moon"] { --skin-a:#f4f2dc;--skin-b:#aabcb0;--skin-c:#526c67; }
.comet-shop-orb[data-skin="asteroid"],.comet-shop-preview[data-skin="asteroid"] { --skin-a:#c4b39e;--skin-b:#776c63;--skin-c:#3d3838; background-image:radial-gradient(circle at 66% 68%,#332b2a 0 8%,transparent 9%),radial-gradient(circle at 32% 24%,#fff 0 3%,transparent 8%),radial-gradient(circle at 36% 30%,var(--skin-a),var(--skin-b) 58%,var(--skin-c)); }
.comet-shop-orb[data-skin="meteor"],.comet-shop-preview[data-skin="meteor"] { --skin-a:#e59053;--skin-b:#8c422c;--skin-c:#331c21; }
.comet-shop-orb[data-skin="satellite"],.comet-shop-preview[data-skin="satellite"] { --skin-a:#f4de94;--skin-b:#a28b64;--skin-c:#3f5f64; }
.comet-shop-orb[data-skin="solar"],.comet-shop-preview[data-skin="solar"] { --skin-a:#fff5a0;--skin-b:#ffa91d;--skin-c:#d74417; }
.comet-shop-orb[data-skin="dust"],.comet-shop-preview[data-skin="dust"] { --skin-a:#d8c095;--skin-b:#a07754;--skin-c:#594239; }
.comet-shop-orb[data-skin="ember"],.comet-shop-preview[data-skin="ember"] { --skin-a:#ffb23f;--skin-b:#d93a1f;--skin-c:#301d25; }
.comet-shop-orb[data-skin="three-moons"],.comet-shop-preview[data-skin="three-moons"] { --skin-a:#e3e2ff;--skin-b:#969bd8;--skin-c:#484783; }
.comet-shop-orb[data-skin="ringed"],.comet-shop-preview[data-skin="ringed"] { --skin-a:#b5f0d3;--skin-b:#5ba58f;--skin-c:#23535b; }
.comet-shop-orb[data-skin="ringed"]::before,.comet-shop-preview[data-skin="ringed"]::before { content:'';position:absolute;left:-17%;right:-17%;top:43%;height:16%;border:4px solid #e8c977;border-radius:50%;transform:rotate(-16deg); }
.comet-shop-orb[data-skin="red-giant"],.comet-shop-preview[data-skin="red-giant"] { --skin-a:#ffce62;--skin-b:#e44125;--skin-c:#6d1820; }
.comet-shop-orb[data-skin="pulsar"],.comet-shop-preview[data-skin="pulsar"] { --skin-a:#d7f3ff;--skin-b:#4389ff;--skin-c:#252b7d; }
.comet-shop-orb[data-skin="nebula"],.comet-shop-preview[data-skin="nebula"] { --skin-a:#ffb6e7;--skin-b:#8b4fc2;--skin-c:#263075; }
.comet-shop-orb[data-skin="probe"],.comet-shop-preview[data-skin="probe"] { --skin-a:#f5edd0;--skin-b:#9eaaa2;--skin-c:#32595e; }
.comet-shop-orb[data-skin="orbit"],.comet-shop-preview[data-skin="orbit"] { --skin-a:#e2ffff;--skin-b:#54abc5;--skin-c:#31518d; }
.comet-shop-orb[data-skin="shard"],.comet-shop-preview[data-skin="shard"] { --skin-a:#d7f8ff;--skin-b:#5ea9dd;--skin-c:#32477f; clip-path:polygon(50% 0,91% 26%,84% 78%,47% 100%,8% 70%,15% 20%);border-radius:25%; }
.comet-shop-orb[data-skin="wind"],.comet-shop-preview[data-skin="wind"] { --skin-a:#fff;--skin-b:#b7e4d7;--skin-c:#4f8d8b; }
.comet-shop-orb[data-skin="week"],.comet-shop-preview[data-skin="week"] { --skin-a:#f2f3ff;--skin-b:#9aa5dc;--skin-c:#424a8f; }
.comet-shop-orb[data-skin="black-hole"],.comet-shop-preview[data-skin="black-hole"] { --skin-a:#8d74d4;--skin-b:#27203f;--skin-c:#050610; }
.comet-shop-orb[data-skin="supernova"],.comet-shop-preview[data-skin="supernova"] { --skin-a:#fff6a3;--skin-b:#ff681f;--skin-c:#9e1723; box-shadow:0 0 15px #ff8c31,inset -7px -10px 12px #741d36,0 5px 0 #8d5529; }
.comet-shop-orb[data-skin="hundred"],.comet-shop-preview[data-skin="hundred"] { --skin-a:#fff;--skin-b:#c9e6ed;--skin-c:#57889d; }
.comet-shop-orb[data-skin="constellation"],.comet-shop-preview[data-skin="constellation"] { --skin-a:#9ec8ff;--skin-b:#3a4c9f;--skin-c:#171538; background-image:radial-gradient(circle at 67% 25%,#fff 0 2%,transparent 3%),radial-gradient(circle at 28% 65%,#fff 0 2%,transparent 3%),radial-gradient(circle at 31% 24%,#fff 0 3%,transparent 8%),radial-gradient(circle at 36% 30%,var(--skin-a),var(--skin-b) 58%,var(--skin-c)); }
.comet-shop-orb[data-skin="gold"],.comet-shop-preview[data-skin="gold"] { --skin-a:#fff2a2;--skin-b:#e7a72e;--skin-c:#7c4615; }
.comet-shop-preview[data-rendered="true"][data-skin],.comet-shop-orb[data-rendered="true"][data-skin] { border:0; border-radius:0; clip-path:none; background-color:transparent; background-position:center; background-repeat:no-repeat; background-size:contain; box-shadow:none; filter:drop-shadow(0 5px 4px rgba(26,51,47,.34)); }
.comet-shop-preview[data-rendered="true"][data-skin]::before,.comet-shop-preview[data-rendered="true"][data-skin]::after,.comet-shop-orb[data-rendered="true"][data-skin]::before,.comet-shop-orb[data-rendered="true"][data-skin]::after { display:none; content:none; }
@keyframes comet-shop-float { 0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-4px) rotate(3deg)} }
@media (max-width:520px) {
  .comet-shop-panel { height:min(90vh,790px); }
  .comet-shop-preview { width:58px;height:58px; }
  .comet-shop-grid { gap:7px; }
  .comet-shop-card { min-height:126px;padding:9px 4px 8px;border-radius:16px; }
  .comet-shop-orb { width:50px;height:50px; }
}
@media (prefers-reduced-motion:reduce) { .comet-shop-preview { animation:none; } }