/* Registration controls reuse the existing palette and spacing. */
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: stretch; }
.hero-actions .early-access { border: 1px solid var(--mint); }
.hero-actions .beta-access { background: #04172080; color: var(--mint); }
.hero-actions .beta-access:hover { background: #9fe5d51a; }
.hero-actions + .store-status { border: 0; padding-left: 0; color: var(--muted); font-size: .8rem; }
.registration-tabs { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 36px auto 24px; }
.registration-tabs button { min-height: 48px; padding: 12px 20px; border: 1px solid var(--border); border-radius: 5px; background: transparent; color: var(--muted); font-size: .8rem; letter-spacing: .06em; cursor: pointer; }
.registration-tabs button[aria-selected=true] { border-color: var(--mint); background: #9fe5d51a; color: var(--mint); }
.registration-tabs button:hover { color: var(--white); }
#app-store [role=tabpanel] { max-width: 600px; margin-inline: auto; }
#app-store [role=tabpanel][hidden] { display: none; }
#app-store .beta-note { font-size: .875rem; color: var(--muted); margin: 12px auto 0; }
#beta-frame { display: block; width: 100%; height: 750px; border: 0; margin: 24px 0 0; color-scheme: dark; }
.beta-page-languages { justify-content: center; margin-top: 24px; }
@media(max-width:700px) { .hero-actions { flex-direction: column; align-items: stretch; max-width: 350px; } .registration-tabs { gap: 8px; } .registration-tabs button { flex: 1 1 140px; } }
@media(prefers-reduced-motion:no-preference) { #app-store [role=tabpanel]:not([hidden]) { animation: registration-in .2s ease-out; } @keyframes registration-in { from { opacity: .4; } to { opacity: 1; } } }