.consent-gate{z-index:50;padding-inline:max(12px, env(safe-area-inset-left), env(safe-area-inset-right));pointer-events:none;place-items:center;display:grid;position:fixed;inset:0}.consent-gate-card{width:100%;max-height:max(0px, calc(100dvh - 2 * (var(--app-nav-height,calc(68px + env(safe-area-inset-bottom))) + max(60px, var(--admob-banner-height,60px)) + 12px)));overscroll-behavior:contain;pointer-events:auto;overflow-y:auto}.first-tutorial-overlay{z-index:9000;background:color-mix(in oklab, var(--background) 88%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);position:fixed;inset:0}.first-tutorial-card{z-index:9001;width:min(100% - 1.5rem,28rem);max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 1.5rem);border:1px solid var(--accent);background:var(--background);color:var(--foreground);box-shadow:var(--launch-ring-shadow);letter-spacing:0;border-radius:8px;flex-direction:column;display:flex;position:fixed;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.first-tutorial-heading{font-family:var(--font-display);text-align:center;letter-spacing:0;background:linear-gradient(100deg, var(--mode-observe), var(--mode-duel), var(--mode-mix), var(--mode-trap), var(--c-gold));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;padding:1.15rem 1rem .85rem;font-size:1.25rem;font-weight:700}.first-tutorial-scroll{overscroll-behavior:contain;scrollbar-width:thin;min-height:0;padding:0 1rem;overflow-y:auto}.first-tutorial-block{--tutorial-block-color:var(--accent);border:1px solid color-mix(in oklab, var(--tutorial-block-color) 55%, transparent);text-align:center;background:color-mix(in oklab, var(--card) 65%, var(--background));border-radius:6px;padding:.65rem .8rem .8rem}.first-tutorial-block+.first-tutorial-block{margin-top:.75rem}.first-tutorial-ranked{--tutorial-block-color:var(--mode-duel)}.first-tutorial-art{object-fit:contain;width:5.5rem;height:5.5rem;margin:0 auto .25rem;display:block}.first-tutorial-ranked .first-tutorial-art{width:3.5rem;height:3.5rem}.first-tutorial-block h2{color:var(--tutorial-block-color);font-family:var(--font-display);letter-spacing:0;margin:0 0 .4rem;font-size:.95rem}.first-tutorial-block p{color:var(--foreground);margin:0;font-size:.8rem;line-height:1.65}.first-tutorial-footer{text-align:center;flex-shrink:0;padding:.9rem 1rem 1rem}.first-tutorial-footer .first-tutorial-confirm{background:var(--accent);width:100%;min-height:2.75rem;color:var(--accent-foreground);font-family:var(--font-display);letter-spacing:0;border-radius:999px}.first-tutorial-footer .first-tutorial-confirm:hover{background:var(--c-gold)}@media (height<=650px){.first-tutorial-heading{padding:.8rem .75rem .65rem;font-size:1.125rem}.first-tutorial-art{width:4.5rem;height:4.5rem}.first-tutorial-ranked .first-tutorial-art{width:3rem;height:3rem}.first-tutorial-block{padding:.5rem .65rem .6rem}.first-tutorial-block p{line-height:1.5}}.avatar-carousel-viewport{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--border) transparent;padding:.5rem .125rem .75rem;overflow:auto hidden}.avatar-carousel-track>button{flex-shrink:0}.avatar-carousel-viewport:focus-visible{outline:2px solid var(--ring);outline-offset:2px}.avatar-carousel-hint{background:var(--avatar-scroll-hint)}.launch-screen{z-index:10000;opacity:1}.launch-screen-leaving{animation:.3s ease-out both launch-screen-exit}.launch-screen-content{gap:2rem;width:min(88vw,30rem)}.launch-screen-circle{aspect-ratio:1;width:min(50vw,28vh,16rem);box-shadow:var(--launch-ring-shadow);border-width:.125rem;animation:1.6s ease-in-out infinite launch-ring-pulse}.launch-screen-wordmark{letter-spacing:0;font-size:4rem;line-height:1}.launch-screen-message{max-width:28rem;margin:0;font-size:1rem;line-height:1.65}@media (width>=48rem){.launch-screen-wordmark{font-size:5rem}.launch-screen-message{font-size:1.125rem}}@media (height<=25rem){.launch-screen-content{gap:1rem}.launch-screen-wordmark{font-size:2.5rem}}@keyframes launch-screen-exit{0%{opacity:1}to{opacity:0}}@keyframes launch-ring-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.035)}}@media (prefers-reduced-motion:reduce){.launch-screen-circle,.launch-screen{animation:none}}
