.welcome-panel {
  position: absolute;
  z-index: 3;
  width: min(500px, calc(100% - 34px));
  padding: 22px;
  border: 1px solid rgba(239, 199, 94, .48);
  border-radius: 19px;
  color: #f1f2f4;
  background: linear-gradient(145deg, rgba(25, 30, 40, .98), rgba(12, 15, 21, .98));
  box-shadow: 0 28px 80px rgba(0, 0, 0, .64), inset 0 1px rgba(255,255,255,.05);
}
.welcome-panel h2 { max-width: 410px; margin: 5px 0 8px; font-size: 27px; line-height: 1.04; letter-spacing: -.04em; }
.welcome-lead { max-width: 420px; margin: 0; color: #c4cad3; font-size: 11px; line-height: 1.5; }
.welcome-panel > p:last-child { margin: 10px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.welcome-dismiss { position: absolute; top: 10px; right: 10px; display: grid; place-items: center; min-width: 32px; min-height: 32px; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; color: #b1b8c2; background: transparent; font-size: 20px; }
.motion-starters { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.motion-starter { min-width: 0; min-height: 78px; display: grid; grid-template-columns: 52px minmax(0,1fr); align-items: center; gap: 8px; padding: 8px; text-align: left; }
.motion-starter.best { border-color: rgba(239,199,94,.7); background: linear-gradient(135deg, rgba(239,199,94,.16), rgba(99,213,192,.08)); box-shadow: inset 0 0 0 1px rgba(239,199,94,.12); }
.motion-starter > span:last-child { min-width: 0; display: grid; gap: 2px; }
.motion-starter small { color: var(--gold); font-size: 7px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.motion-starter strong { overflow: hidden; color: #f6f2e8; font-size: 12px; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.motion-starter em { overflow: hidden; color: #959eaa; font-size: 8px; font-style: normal; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.starter-art { position: relative; display: block; width: 52px; height: 52px; overflow: hidden; border: 1px solid rgba(255,255,255,.16); border-radius: 13px; background: #071218; box-shadow: inset 0 0 20px rgba(0,0,0,.38); }
.orbit-art { background: radial-gradient(circle at 50% 50%, #f6d56f 0 7%, rgba(246,213,111,.18) 8% 16%, transparent 17%), radial-gradient(circle at 34% 33%, #72e4d0 0 5%, transparent 6%), #071218; }
.orbit-art::before { content:""; position:absolute; inset:8px; border:1px solid rgba(99,213,192,.56); border-radius:50%; transform:rotate(-22deg) scaleY(.58); }
.orbit-art i { position:absolute; width:7px; height:7px; top:9px; left:30px; border-radius:50%; background:#7cf3dd; box-shadow:0 0 11px #66e2cf; }
.bounce-art { background: linear-gradient(180deg,#fff5df 0 72%,#e8c9a5 73% 100%); }
.bounce-art::after { content:""; position:absolute; left:13px; right:13px; bottom:9px; height:5px; border-radius:50%; background:rgba(49,37,31,.26); filter:blur(1px); }
.bounce-art i { position:absolute; z-index:1; width:18px; height:22px; left:17px; top:10px; border-radius:50%; background:linear-gradient(145deg,#ff8c68,#cf3c36 68%); box-shadow:inset -4px -4px 7px rgba(80,12,8,.2); }
.welcome-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 9px; }
.welcome-actions button { min-height: 36px; }
@media (max-width: 760px) {
  .welcome-panel { padding: 18px; }
  .welcome-panel h2 { font-size: 23px; }
}

@media (max-width: 540px) {
  .motion-starters { grid-template-columns: 1fr; }
  .motion-starter { min-height: 62px; }
}