/* Dreamsnity's cheerful, toy-like layer. Legal copy keeps its reading typography. */
:root { --play-font: "Arial Rounded MT Bold", "Avenir Next", "Segoe UI", sans-serif; --sky-top: #c7eaff; --sky-middle: #e4f5ff; --happy-coral: #ca4d4f; --happy-yellow: #ffda68; }
[data-theme="dark"] { --sky-top: #233f72; --sky-middle: #192c4f; --happy-coral: #ffaaa6; }
.brand, .hero h1, .section-heading h2, .app-title h3, .studio-section h2 { font-family: var(--play-font); font-weight: 700; letter-spacing: -.04em; }
.header-inner { border: 2px solid var(--surface); border-radius: 25px; box-shadow: 0 6px 0 rgba(94,151,202,.08); }
.brand-mark { transform: rotate(-6deg); }
.site-header nav a { font-weight: 650; }
.hero { min-height: 575px; padding-top: 48px; padding-bottom: 75px; grid-template-columns: 1fr 1.03fr; }
.hero-label { font-size: .75rem; letter-spacing: .07em; color: #685319; background: #fff1ae; border: 2px solid #fff8d6; border-radius: 100px; padding: 8px 13px; transform: rotate(-2deg); margin-bottom: 29px; box-shadow: 0 3px 0 rgba(182,143,42,.12); }
.label-block { background: #efb922; border-radius: 50%; }
.hero h1 { position: relative; font-size: clamp(47px,4.9vw,69px); line-height: 1.09; letter-spacing: -.055em; }
.hero h1 em { display: inline-block; font-family: var(--play-font); font-weight: 700; color: var(--happy-coral); position: relative; }
.heading-swoosh { position: absolute; left: 9px; bottom: -17px; width: 48%; height: 13px; border-top: 5px solid #ffcb53; border-radius: 50%; transform: rotate(-3deg); }
.hero-copy > p { margin-top: 34px; max-width: 410px; font-size: 1.0625rem; }
.hero-actions { flex-wrap: wrap; gap: 18px 23px; }
.button { border-radius: 18px; padding: 14px 21px; font-weight: 700; }
.button.primary { min-height: 55px; box-shadow: 0 5px 0 var(--button-bottom), 0 12px 23px #2a69d318; }
.magic-button { display: inline-flex; align-items: center; gap: 7px; border: 0; background: transparent; min-height: 48px; padding: 9px 0; font-size: .875rem; font-weight: 650; }
.magic-button > span:first-child { color: var(--happy-coral); font-size: 25px; transition: transform .4s; }
.magic-button:hover > span:first-child { transform: rotate(70deg) scale(1.2); }
.hero-signature { margin-top: 27px; }
.dream-stage { height: 460px; }
.world-parallax { inset: -4px -30px 5px -20px; }
.dream-world { animation-duration: 8s; }
.happy-sun { position: absolute; width: 89px; height: 89px; right: 13%; top: -9px; border-radius: 50%; background: #ffdb66; border: 5px solid #ffe999; box-shadow: 0 5px 0 #edbb4b; transform: rotate(10deg); z-index: 2; animation: sun-sway 7s ease-in-out infinite; }
.happy-sun::before { content: ''; position: absolute; inset: -16px; border: 3px dashed #f5c44c; border-radius: 50%; }
.sun-face { position: absolute; inset: 0; }
.sun-face i { position: absolute; background: #745120; width: 5px; height: 9px; top: 27px; left: 22px; border-radius: 50%; }
.sun-face i + i { left: 47px; }
.sun-face b { position: absolute; top: 40px; left: 31px; width: 15px; height: 9px; border-bottom: 3px solid #745120; border-radius: 0 0 14px 14px; }
.sun-face::after { content: ''; position: absolute; width: 12px; height: 6px; background: #f1ae67; top: 41px; left: 14px; border-radius: 50%; box-shadow: 37px 0 #f1ae67; }
.cloud-pal { width: 184px; height: 170px; left: -52px; bottom: -12px; animation-duration: 4.5s; }
.cloud-invitation { position: absolute; left: -56px; bottom: 146px; color: var(--text); font-size: .875rem; font-weight: 650; transform: rotate(-9deg); pointer-events: none; }
.cloud-invitation::after { content: '↘'; display: block; margin: -3px 0 0 61px; font-size: 26px; line-height: 1; }
.cloud-greeting { left: -50px; bottom: 173px; border-radius: 18px 18px 18px 4px; font-weight: 650; border-width: 2px; }
.cloud-invitation.is-hidden { visibility: hidden; }
.sky-scribble { position: absolute; font-size: 45px; line-height: 1; pointer-events: none; }
.scribble-one { left: 9%; top: 10%; color: #e79b28; transform: rotate(-12deg); }
.scribble-two { right: -3%; bottom: 23%; color: var(--happy-coral); transform: rotate(16deg); }
.cube-one { top: 14px; left: 12px; width: 62px; height: 62px; }
.cube-two { top: 125px; right: -20px; }
.scene-caption { bottom: -32px; left: 128px; right: -5px; gap: 15px; }
.scene-caption > span { display: none; }
.magic-particles { position: absolute; inset: -15% -10%; overflow: hidden; z-index: 8; pointer-events: none; }
.magic-particle { position: absolute; left: 50%; top: 55%; width: 17px; height: 17px; background: var(--particle-color); clip-path: polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 95%,50% 73%,21% 95%,32% 57%,2% 35%,39% 35%); animation: wish-pop 1400ms cubic-bezier(.12,.64,.24,1) both; }
.sky-hero { position: relative; }
.sky-hero::after { content: ''; display: block; position: absolute; bottom: -1px; left: 0; width: 100%; height: 38px; background: radial-gradient(ellipse at 50% 100%,var(--bg) 69%,transparent 71%) 0 0 / 100px 40px repeat-x; pointer-events: none; }
.apps-section { padding-top: 42px; }
.section-heading h2 { font-size: 34px; }
.section-count { background: var(--surface); padding: 9px 14px; border: 1px solid var(--line); border-radius: 100px; }
.app-card { border-radius: 30px; border-width: 2px; box-shadow: 0 7px 0 #c8ddf8; transition: transform .3s cubic-bezier(.2,.8,.25,1.4),box-shadow .3s; }
.app-card.mint { box-shadow: 0 7px 0 #c4e4d6; }
.app-card:hover { transform: translateY(-7px) rotate(-.6deg); box-shadow: 0 14px 0 #c8ddf8; }
.app-card.mint:hover { transform: translateY(-7px) rotate(.6deg); box-shadow: 0 14px 0 #c4e4d6; }
.app-platform, .app-label { border-radius: 100px; }
.app-title h3 { font-size: 32px; }
.app-play-scene { position: relative; height: 188px; margin: -10px 0 22px; display: flex; align-items: center; justify-content: center; }
.app-play-scene::before { content: ''; position: absolute; width: 202px; height: 125px; background: #dbeaff; border-radius: 48% 52% 43% 57%; transform: rotate(-8deg); }
.mint .app-play-scene::before { background: #d6efe3; transform: rotate(9deg); }
.app-toy { position: relative; width: 221px; height: 174px; filter: drop-shadow(0 7px 0 #233f6910); transform: rotate(-6deg); transition: transform .5s cubic-bezier(.2,.8,.25,1.4); }
.mint .app-toy { transform: rotate(5deg); }
.app-card:hover .app-toy { transform: translateY(-7px) rotate(4deg); }
.app-card.mint:hover .app-toy { transform: translateY(-7px) rotate(-5deg); }
.toy-spark { position: absolute; font-size: 28px; color: #dd9f2c; }
.toy-spark-one { top: 18px; left: calc(50% - 142px); transform: rotate(-13deg); }
.toy-spark-two { right: calc(50% - 139px); bottom: 36px; color: var(--happy-coral); font-size: 34px; }
.toy-caption { position: absolute; bottom: 3px; right: 2px; font-size: .8125rem; font-family: var(--play-font); color: var(--violet-ink); transform: rotate(-5deg); background: var(--surface); padding: 5px 9px; border-radius: 7px; box-shadow: 0 2px 0 var(--line); }
.mint .toy-caption { color: var(--mint-ink); transform: rotate(4deg); }
.card-top { margin-bottom: 20px; }
.app-card .tag-list { gap: 7px; }
.app-card .tag-list > span { padding: 4px 10px; border: 1px solid var(--line); background: var(--surface); border-radius: 100px; font-size: .8125rem; }
.app-card .tag-list > span + span::before { display: none; }
.card-action > span { width: 43px; height: 43px; border-radius: 15px; box-shadow: 0 3px 0 var(--line); }
.studio-section { border-top-style: dashed; border-top-width: 2px; }
.studio-section h2 em { font-family: var(--play-font); font-weight: 700; color: var(--happy-coral); }
[data-theme="dark"] .hero-label { background: #52492e; color: #ffe795; border-color: #71603a; }
[data-theme="dark"] .app-card { box-shadow: 0 7px 0 #2b456a; }
[data-theme="dark"] .app-card.mint { box-shadow: 0 7px 0 #274c49; }
[data-theme="dark"] .app-play-scene::before { background: #29466e; }
[data-theme="dark"] .mint .app-play-scene::before { background: #29564e; }
@keyframes sun-sway { 0%,100% { transform: rotate(-8deg); } 50% { transform: rotate(9deg) translateY(-5px); } }
@keyframes wish-pop { 0% { transform: translate(0,0) scale(.1) rotate(0); opacity: 0; } 15% { opacity: 1; } 70% { opacity: 1; } 100% { transform: translate(var(--particle-x),var(--particle-y)) scale(.7) rotate(var(--particle-angle)); opacity: 0; } }
@media (max-width: 1120px) and (min-width: 761px) {
  .hero h1 { font-size: 54px; }
  .cloud-pal { left: -34px; width: 159px; height: 150px; }
  .cloud-invitation { left: -29px; bottom: 129px; }
  .cloud-greeting { left: -29px; bottom: 152px; }
  .happy-sun { right: 15%; top: 15px; width: 80px; height: 80px; }
  .sun-face { transform: scale(.9); transform-origin: top left; }
}
@media (max-width: 850px) and (min-width: 761px) { .hero h1 { font-size: 46px; } .hero-label { letter-spacing: 0; } .dream-stage { height: 405px; } }
@media (max-width: 760px) {
  .header-inner { border-radius: 22px; }
  .hero { padding-top: 30px; padding-bottom: 68px; }
  .hero-label { font-size: .6875rem; letter-spacing: .04em; margin-bottom: 26px; }
  .hero h1 { font-size: clamp(39px,10.5vw,65px); line-height: 1.1; }
  .hero-copy > p { margin-top: 32px; }
  .hero-actions { gap: 17px; }
  .hero-actions .button { padding-inline: 18px; gap: 13px; }
  .magic-button { font-size: .8125rem; gap: 6px; }
  .magic-button > span:first-child { font-size: 21px; }
  .dream-stage { height: 352px; margin-top: 36px; }
  .world-parallax { inset: -12px -8px 10px -3px; }
  .happy-sun { width: 64px; height: 64px; right: 15%; top: -13px; border-width: 4px; }
  .sun-face { transform: scale(.7); transform-origin: top left; }
  .happy-sun::before { inset: -12px; border-width: 2px; }
  .cloud-pal { width: 143px; height: 131px; left: -12px; bottom: -10px; }
  .cloud-invitation { left: 0; bottom: 116px; font-size: .8125rem; }
  .cloud-greeting { bottom: 144px; left: 0; }
  .cube-one { width: 45px; height: 45px; left: 0; top: 0; }
  .cube-two { right: -5px; top: 83px; }
  .cube-three { bottom: 0; }
  .scribble-one { top: 16%; font-size: 33px; }
  .scribble-two { right: 0; bottom: 20%; font-size: 32px; }
  .scene-caption { bottom: -36px; left: 136px; right: 0; }
  .section-heading h2 { font-size: 30px; }
  .section-count { padding: 6px 11px; }
  .app-card { border-radius: 26px; }
  .app-play-scene { margin-top: 2px; height: 170px; }
  .app-toy { width: 204px; height: 161px; }
  .toy-caption { right: -4px; font-size: .75rem; }
}
@media (prefers-reduced-motion: reduce) {
  .magic-particle { animation: none; }
  .magic-button > span:first-child, .app-card, .app-toy { transition: none; }
  .app-card:hover, .app-card.mint:hover, .magic-button:hover > span:first-child, .app-card:hover .app-toy { transform: none; }
}
[data-motion="paused"] .magic-particle { display: none; }
[data-motion="paused"] .app-card:hover, [data-motion="paused"] .app-card:hover .app-toy, [data-motion="paused"] .magic-button:hover > span:first-child { transform: none; transition: none; }

.magic-label { min-width: 115px; text-align: left; }

/* A small, cheerful introduction to the studio's values. */
.why-section { padding-top: 45px; padding-bottom: 88px; scroll-margin-top: 115px; }
.why-heading { display: flex; justify-content: space-between; align-items: end; gap: 25px; margin-bottom: 37px; }
.why-heading .eyebrow { color: var(--muted); font-size: .8125rem; letter-spacing: .07em; }
.why-heading h2 { font-family: var(--play-font); font-weight: 700; font-size: clamp(32px,3.8vw,46px); line-height: 1.15; letter-spacing: -.045em; margin-top: 13px; }
.why-heading > p { color: var(--muted); font-size: 1rem; line-height: 1.7; text-align: right; }
.why-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; align-items: stretch; }
.why-card { --why-ink: #274b81; --why-base: #edf5ff; --why-edge: #c8dcf6; --why-tilt: -1.6deg; position: relative; min-width: 0; padding: 22px 25px 28px; border: 2px solid var(--why-edge); border-radius: 28px; background: var(--why-base); color: var(--why-ink); box-shadow: 0 7px 0 var(--why-edge); transform: rotate(var(--why-tilt)); transition: transform .3s cubic-bezier(.2,.8,.3,1.2); }
.why-card:hover, .why-card:focus-within { transform: translateY(-5px) rotate(0); }
.why-peach { --why-ink: #85423d; --why-base: #fff0e7; --why-edge: #f0d4c8; --why-tilt: 1.6deg; }
.why-mint { --why-ink: #2d6757; --why-base: #eaf6ef; --why-edge: #c4e3d4; --why-tilt: -1deg; }
.why-top { min-height: 106px; display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.why-number { font-size: .8125rem; line-height: 1.6; letter-spacing: .045em; font-weight: 750; padding-top: 13px; }
.why-art { width: 85px; height: 85px; object-fit: contain; flex: 0 0 auto; transition: transform .45s cubic-bezier(.2,.8,.25,1.4); }
.why-block { transform: rotate(-8deg); }
.why-mascot { width: 78px; height: 78px; transform: rotate(7deg); }
.why-card:hover .why-block { transform: translateY(-6px) rotate(12deg); }
.why-card:hover .why-mascot { transform: rotate(-9deg) translateY(-4px); }
.why-card h3 { font-family: var(--play-font); font-weight: 700; font-size: 1.625rem; line-height: 1.24; letter-spacing: -.035em; }
.why-card > p { font-size: 1rem; line-height: 1.75; margin-top: 18px; }
.why-sticker { display: inline-block; margin-top: 24px; padding: 6px 10px; border: 1px solid var(--why-edge); border-radius: 8px; background: #ffffffa8; font-size: .8125rem; line-height: 1.6; font-weight: 650; transform: rotate(-2deg); }
.why-contact { display: inline-flex; align-items: center; gap: 9px; font-size: 1rem; font-weight: 750; min-height: 44px; margin-top: 12px; text-underline-offset: 4px; }
.why-contact:hover { text-decoration: underline; }
.why-contact svg { width: 17px; height: 17px; }
.why-high-five { flex: 0 0 auto; width: 105px; height: 100px; background: transparent; border: 0; border-radius: 40%; padding: 0; margin: -9px -7px 0 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.why-high-five .why-cloud { width: 105px; height: 100px; }
.why-high-five:hover .why-cloud { transform: translateY(-5px) rotate(8deg); }
.why-high-five:focus-visible, .why-contact:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.why-high-five.is-cheering .why-cloud { animation: why-high-five .75s ease-in-out both; }
.why-cheer { min-height: 44px; padding-top: 8px; font-size: .8125rem; font-weight: 650; line-height: 1.65; }
[data-theme="dark"] .why-blue { --why-ink: #d5e6ff; --why-base: #233d60; --why-edge: #33557a; }
[data-theme="dark"] .why-peach { --why-ink: #ffe1d7; --why-base: #4d3439; --why-edge: #69464b; }
[data-theme="dark"] .why-mint { --why-ink: #d7f3e5; --why-base: #26483f; --why-edge: #365f51; }
[data-theme="dark"] .why-sticker { background: #14253c66; }
@keyframes why-high-five { 0%,100% { transform: translateY(0) rotate(0); } 30% { transform: translateY(-18px) rotate(-13deg) scale(1.08); } 60% { transform: translateY(-7px) rotate(13deg); } 80% { transform: translateY(-4px) rotate(-4deg); } }
@media (min-width: 761px) and (max-width: 1050px) {
  .why-grid { gap: 16px; }
  .why-card { padding: 18px 20px 24px; }
  .why-top { flex-direction: column-reverse; align-items: flex-start; min-height: 155px; justify-content: end; gap: 5px; padding-bottom: 18px; }
  .why-card h3 { font-size: 1.5rem; }
  .why-number { padding-top: 0; }
}
@media (max-width: 760px) {
  .why-section { padding-top: 38px; padding-bottom: 63px; }
  .why-heading { display: block; margin-bottom: 31px; }
  .why-heading h2 { font-size: 34px; }
  .why-heading > p { margin-top: 15px; text-align: left; }
  .why-grid { grid-template-columns: 1fr; gap: 27px; }
  .why-card { padding: 21px 24px 25px; --why-tilt: -.7deg; }
  .why-peach { --why-tilt: .7deg; }
  .why-top { min-height: 96px; }
  .why-card h3 { font-size: 1.625rem; }
  .why-card > p { margin-top: 13px; }
  .why-sticker { margin-top: 19px; }
}
[data-motion="paused"] .why-card, [data-motion="paused"] .why-art { transform: none; transition: none; animation: none; }
@media (prefers-reduced-motion: reduce) {
  .why-card, .why-art, .why-card:hover .why-art, .why-high-five.is-cheering .why-cloud { transform: none !important; animation: none; transition: none; }
}

/* The studio mascot and Docenity's little waiting room. */
.brand .brand-mascot, .footer-top .brand .brand-mascot { width: 49px; height: 49px; object-fit: contain; flex: 0 0 auto; transform: rotate(-5deg); transition: transform .35s cubic-bezier(.2,.8,.3,1.4); }
.brand:hover .brand-mascot, .brand:focus-visible .brand-mascot { transform: rotate(7deg) translateY(-2px); }
.app-card.is-coming-soon .card-action { position: static; }
.app-card.is-coming-soon .card-action::after { content: ''; position: absolute; inset: 0; z-index: 3; border-radius: inherit; }
.app-card.is-coming-soon .card-action:focus-visible { outline: none; }
.app-card.is-coming-soon:focus-within { outline: 3px solid var(--accent); outline-offset: 5px; }
.coming-page { overflow: hidden; background: radial-gradient(ellipse at 78% 42%,#d4f0e5 0,transparent 53%),linear-gradient(180deg,var(--sky-middle),var(--bg)); border-bottom: 1px solid var(--line); }
.coming-inner { min-height: 680px; padding-top: 62px; padding-bottom: 70px; display: grid; grid-template-columns: 1fr 1.05fr; align-items: center; gap: 32px; }
.coming-sticker { display: inline-block; padding: 11px 17px; border: 2px solid #fff7d0; border-radius: 13px; background: #ffe799; color: #69501f; font-size: .875rem; font-weight: 750; letter-spacing: .025em; transform: rotate(-3deg); box-shadow: 0 4px 0 #ecc76a; }
.coming-copy h1 { font-family: var(--play-font); font-size: clamp(45px,4.7vw,65px); font-weight: 700; line-height: 1.12; letter-spacing: -.045em; margin-top: 30px; }
.coming-copy h1 em { font: inherit; color: var(--happy-coral); }
.coming-copy > p { font-size: 1.125rem; line-height: 1.75; max-width: 390px; margin: 25px 0 30px; color: var(--muted); }
.coming-playground { position: relative; min-width: 0; height: 475px; isolation: isolate; }
.coming-orbit { position: absolute; width: 370px; height: 330px; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-18deg); border: 2px dashed #a8cdbf; border-radius: 50%; opacity: .75; }
.coming-character { position: absolute; top: 70px; left: 50%; width: 365px; height: 300px; transform: translateX(-50%); padding: 0; background: transparent; border: none; border-radius: 45%; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.coming-character:focus-visible { outline: 3px solid var(--accent); outline-offset: 7px; }
.coming-character .app-play-scene { height: 100%; margin: 0; pointer-events: none; }
.coming-character .app-play-scene::before { width: 255px; height: 45px; bottom: 18px; background: #94bca34a; transform: none; filter: blur(2px); animation: coming-shadow 3.6s ease-in-out infinite; }
.coming-character .app-toy { width: 370px; height: 291px; max-width: none; animation: coming-bounce 3.6s ease-in-out infinite; filter: drop-shadow(0 12px 0 #3b756519); }
.coming-character .toy-caption { display: none; }
.coming-character .toy-spark-one { top: 56px; left: 5px; font-size: 40px; animation: coming-twinkle 4s ease-in-out infinite; }
.coming-character .toy-spark-two { bottom: 45px; right: 8px; font-size: 48px; animation: coming-twinkle 4s ease-in-out -2s infinite; }
.coming-bubble { position: absolute; top: 14px; left: 50%; transform: translateX(-50%) rotate(4deg); z-index: 2; width: max-content; max-width: 100%; border: 2px solid var(--line); border-radius: 23px 23px 23px 5px; padding: 15px 22px; background: var(--surface); box-shadow: 0 5px 0 #7bad9824; font-family: var(--play-font); font-size: 1.25rem; font-weight: 700; color: var(--text); text-align: center; }
.coming-cube { position: absolute; width: 70px; height: 70px; object-fit: contain; pointer-events: none; animation: coming-cube-float 5s ease-in-out infinite; }
.coming-cube-one { top: 67px; left: 8px; transform: rotate(-15deg); }
.coming-cube-two { width: 52px; height: 52px; right: 0; bottom: 109px; animation-delay: -2.5s; }
.coming-tap { position: absolute; bottom: 65px; left: 0; width: 100%; text-align: center; font-size: .9375rem; color: var(--mint-ink); font-weight: 650; }
.coming-controls { position: absolute; bottom: 0; left: 0; width: 100%; display: flex; justify-content: center; }
.coming-controls .motion-toggle { min-height: 44px; }
.coming-confetti { position: absolute; inset: -30px; pointer-events: none; overflow: hidden; z-index: 5; }
.coming-playground.is-celebrating .app-toy { animation: coming-dance 1.3s cubic-bezier(.2,.7,.2,1) both; }
.coming-playground.is-celebrating .coming-bubble { animation: coming-cheer .6s ease-out both; }
[data-theme="dark"] .coming-page { background: radial-gradient(ellipse at 78% 42%,#254b48 0,transparent 55%),linear-gradient(180deg,var(--sky-middle),var(--bg)); }
[data-theme="dark"] .coming-orbit { border-color: #416d61; }
[data-theme="dark"] .coming-character .app-play-scene::before { background: #081c2566; }
[data-theme="dark"] .coming-sticker { background: #ffe799; color: #69501f; }
@keyframes coming-bounce { 0%,100% { transform: translateY(0) rotate(-6deg); } 45% { transform: translateY(-21px) rotate(6deg); } 70% { transform: translateY(-5px) rotate(2deg); } }
@keyframes coming-shadow { 0%,100% { scale: 1; opacity: .8; } 45% { scale: .8; opacity: .4; } }
@keyframes coming-cube-float { 0%,100% { translate: 0 0; rotate: -12deg; } 50% { translate: 0 -17px; rotate: 10deg; } }
@keyframes coming-twinkle { 0%,100% { scale: .85; rotate: -15deg; } 50% { scale: 1.1; rotate: 15deg; } }
@keyframes coming-dance { 0%,100% { transform: translateY(0) rotate(-6deg); } 20% { transform: translateY(8px) rotate(-13deg) scale(1.05,.95); } 45% { transform: translateY(-60px) rotate(17deg) scale(.95,1.05); } 65% { transform: translateY(7px) rotate(-10deg) scale(1.06,.94); } 82% { transform: translateY(-17px) rotate(8deg); } }
@keyframes coming-cheer { 0%,100% { transform: translateX(-50%) rotate(4deg) scale(1); } 45% { transform: translateX(-50%) rotate(-3deg) scale(1.07); } }
@media (max-width: 1000px) and (min-width: 761px) {
  .coming-inner { gap: 15px; }
  .coming-copy h1 { font-size: 48px; }
  .coming-character { width: 310px; }
  .coming-character .app-toy { width: 330px; height: 260px; }
  .coming-orbit { width: 300px; height: 310px; }
}
@media (max-width: 760px) {
  .brand .brand-mascot, .footer-top .brand .brand-mascot { width: 43px; height: 43px; }
  .coming-inner { grid-template-columns: 1fr; gap: 5px; min-height: 0; padding-top: 22px; padding-bottom: 58px; }
  .coming-playground { order: -1; height: 390px; width: min(100%,440px); margin-inline: auto; }
  .coming-copy { text-align: center; }
  .coming-copy h1 { font-size: clamp(37px,10vw,53px); margin-top: 25px; }
  .coming-copy > p { margin: 20px auto 27px; font-size: 1rem; max-width: 340px; }
  .coming-sticker { font-size: .8125rem; }
  .coming-character { top: 58px; width: 295px; height: 255px; }
  .coming-character .app-toy { width: 310px; height: 244px; }
  .coming-character .app-play-scene::before { width: 195px; bottom: 17px; }
  .coming-bubble { font-size: 1.0625rem; padding: 12px 17px; top: 3px; }
  .coming-orbit { width: 280px; height: 260px; top: 45%; }
  .coming-cube-one { left: -5px; top: 52px; width: 53px; height: 53px; }
  .coming-cube-two { right: -4px; bottom: 109px; width: 43px; height: 43px; }
  .coming-tap { bottom: 45px; font-size: .875rem; }
  .coming-controls { bottom: 0; }
}
[data-motion="paused"] .coming-character *, [data-motion="paused"] .coming-character *::before, [data-motion="paused"] .coming-cube, [data-motion="paused"] .coming-bubble { animation-play-state: paused; }
[data-motion="paused"] .coming-confetti { display: none; }
[data-motion="paused"] .brand .brand-mascot { transform: none; transition: none; }
@media (prefers-reduced-motion: reduce) {
  .coming-character *, .coming-character *::before, .coming-cube, .coming-bubble { animation: none !important; }
  .brand .brand-mascot, .brand:hover .brand-mascot { transform: none; transition: none; }
}