/* Restore the original colored app tiles on the public welcome page. */
#welcome-page .home234-tool-grid>span{background:var(--welcome-icon-color,#565d67)!important;border:0!important;border-radius:18%!important;box-shadow:inset 0 1px 0 #ffffff78,0 12px 22px #0003!important;overflow:hidden!important}
#welcome-page .home234-tool-grid>span img{filter:none!important;mix-blend-mode:screen!important}
#welcome-page .home233-fav-card img,#welcome-page .home233-fav-list [data-home-tool] img{box-sizing:border-box;background:var(--welcome-icon-color,#6f7d89)!important;border:0!important;filter:none!important;mix-blend-mode:screen!important}

/* A small line of real conversion details gives the card substance without settings. */
.home253-convert-details{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:-1px 0 14px}
.home253-convert-details>span{text-align:center;padding:8px 3px;border:1px solid var(--border);border-radius:6px;background:var(--bg)}
.home253-convert-details b{display:block;color:var(--text);font-size:12px;line-height:1.2}
.home253-convert-details small{display:block;margin-top:4px;color:var(--muted);font-size:7px;letter-spacing:.06em}
.home252-convert-body{padding-bottom:18px}

/* The numeral needs much more contrast against the light canvas. */
html[data-theme="light"] .home250-free-number{background:linear-gradient(135deg,#4d7167 3%,#5f708a 51%,#766083 95%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:#576e75!important;filter:drop-shadow(8px 10px 0 #dce4e6)!important}
html[data-theme="light"] .home250-free-glow{opacity:.35}

/* The gradient changes only after the pointer clicks it. */
.home249-work-preview{position:relative;overflow:hidden;filter:none!important}
.home249-work-preview:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(45deg,#2b8899,#73c3aa 48%,#8e7cc8);opacity:0;transition:opacity .55s ease}
.home249-workspace.is-gradient-changed .home249-work-preview:after{opacity:1}
.home249-work-colors i{transition:background-color .55s ease}
.home249-workspace.is-gradient-changed .home249-work-colors i:nth-child(1){background:#2b8899}
.home249-workspace.is-gradient-changed .home249-work-colors i:nth-child(2){background:#73c3aa}
.home249-workspace.is-gradient-changed .home249-work-colors i:nth-child(3){background:#8e7cc8}

/* The click pulse is placed where the one moving pointer actually lands. */
.home249-pointer>b{animation:none!important;display:none!important}
.home253-click-ripple{position:absolute;z-index:8;width:13px;height:13px;border:2px solid #e6fff1;border-radius:50%;pointer-events:none;box-shadow:0 0 0 0 #a6eed06b;animation:home253-ripple .78s cubic-bezier(.17,.65,.24,1) forwards}
.home253-click-ripple:after{content:"";position:absolute;inset:-3px;border:1px solid #b4efdb;border-radius:50%;animation:home253-ripple-inner .7s ease-out .1s forwards}
@keyframes home253-ripple{0%{opacity:1;transform:translate(-50%,-50%) scale(.25);box-shadow:0 0 0 0 #a6eed077}55%{opacity:.95;transform:translate(-50%,-50%) scale(1.6);box-shadow:0 0 0 8px #a6eed044}100%{opacity:0;transform:translate(-50%,-50%) scale(2.45);box-shadow:0 0 0 15px #a6eed000}}
@keyframes home253-ripple-inner{0%{opacity:.8;transform:scale(.5)}100%{opacity:0;transform:scale(1.8)}}
@media(prefers-reduced-motion:reduce){.home249-work-preview:after{transition:none}.home253-click-ripple{display:none}}
@media(max-width:760px){.home253-convert-details{margin-bottom:10px}.home253-convert-details>span{padding:6px 2px}.home253-convert-details b{font-size:10px}.home253-convert-details small{font-size:6px}}
@media(max-width:760px){#welcome-page .home249-transfer{aspect-ratio:auto;height:420px;max-width:340px}.home252-converter{width:96%}}

/* The public story illustrations alternate their columns. */
@media(min-width:761px){
  #welcome-page .home217-stories>.home217-story:nth-child(even) .home217-orbit{order:2}
  #welcome-page .home217-stories>.home217-story:nth-child(odd) .home217-orbit{order:0}
}
/* One cursor downloads a PNG, makes a gradient, swaps two tools and returns them. */
.home249-workspace .home249-pointer{transition:left 1.35s cubic-bezier(.22,.7,.18,1),top 1.35s cubic-bezier(.22,.7,.18,1),transform .18s ease}
.home249-workspace:is([data-work-stage="ready"],[data-work-stage="download"],[data-work-stage="gradient"],[data-work-stage="grab"],[data-work-stage="swap"],[data-work-stage="grab-back"],[data-work-stage="swap-back"]) .home249-work-result,
.home249-workspace:is([data-work-stage="ready"],[data-work-stage="download"],[data-work-stage="gradient"],[data-work-stage="grab"],[data-work-stage="swap"],[data-work-stage="grab-back"],[data-work-stage="swap-back"]) .home249-work-download{opacity:1}
.home249-workspace .home249-work-canvas>div{transition:transform 1.1s cubic-bezier(.22,.7,.18,1),box-shadow 1.1s ease}
.home249-workspace.is-swapped .home249-work-converter{transform:translateX(calc(100% + 7px));box-shadow:0 12px 20px #0004;z-index:2}
.home249-workspace.is-swapped .home249-work-gradient{transform:translateX(calc(-100% - 7px));z-index:1}
.home249-workspace .home249-work-preview{filter:none!important}
/* A quiet conversion cycle: source, progress, result, then download. */
.home252-converter.is-demo-playing .home252-source{animation:home256-source 8s ease-in-out infinite}
.home252-converter.is-demo-playing .home252-convert-path>i{animation:home256-progress 8s ease-in-out infinite}
.home252-converter.is-demo-playing .home253-convert-details{animation:home256-details 8s ease-in-out infinite}
.home252-converter.is-demo-playing .home252-result{animation:home256-result 8s ease-in-out infinite}
.home252-converter.is-demo-playing .home252-convert-foot>b{animation:home256-download 8s ease-in-out infinite}
@keyframes home256-source{0%,100%{border-color:var(--border);transform:translateY(0)}8%,25%{border-color:#9fc2db;transform:translateY(-2px)}40%{transform:translateY(0)}}
@keyframes home256-progress{0%,16%,100%{opacity:.4;transform:translateY(-5px)}28%,42%{opacity:1;transform:translateY(5px)}52%{opacity:.45;transform:translateY(0)}}
@keyframes home256-details{0%,22%,100%{opacity:.48}42%,78%{opacity:1}}
@keyframes home256-result{0%,34%,100%{opacity:.35;transform:translateY(5px)}49%,82%{opacity:1;transform:translateY(0)}}
@keyframes home256-download{0%,48%,100%{filter:saturate(.65);transform:scale(1)}60%,82%{filter:saturate(1);transform:scale(1.035)}}
@media(prefers-reduced-motion:reduce){.home249-workspace .home249-pointer,.home249-workspace .home249-work-canvas>div{transition:none!important}}
/* Give the Favorites cursor time to reach the heart before it clicks. */
#welcome-page .home233-fav-art .home233-fav-pointer{transition:left 1.4s cubic-bezier(.22,.7,.2,1),top 1.4s cubic-bezier(.22,.7,.2,1),transform .18s ease!important}
/* Keep the colored Favorites app art legible against the light card. */
#welcome-page .home233-fav-art .home256-fav-icon{display:grid;place-items:center;flex:none;width:33px;height:33px;border-radius:5px;overflow:hidden;background:var(--welcome-icon-color,#6f7d89);isolation:isolate}
#welcome-page .home233-fav-list .home256-fav-icon{width:24px;height:24px}
#welcome-page .home233-fav-art .home256-fav-icon img{display:block;width:100%;height:100%;object-fit:contain;background:transparent!important;border:0!important;filter:none!important;mix-blend-mode:screen!important}

/* v257: a consistent, compact rhythm on phones. */
@media (max-width:760px){
  #welcome-page.home81:not([hidden]){gap:22px!important}
  #welcome-page.home81 .welcome-hero{padding:22px 20px!important;gap:10px!important}
  #welcome-page.home81 .welcome-copy h1{margin:14px 0 15px!important;font-size:36px!important;line-height:1.07!important}
  #welcome-page.home81 .welcome-copy>p:not(.welcome-caption){font-size:15px!important;line-height:1.55!important}
  #welcome-page.home81 .welcome-actions{margin:20px 0 12px!important;gap:9px!important}
  #welcome-page.home81 .welcome-primary{min-height:43px!important;padding:11px 16px!important}
  #welcome-page.home81 .home249-hero.creative-scene{height:330px!important;min-height:330px!important}
  #welcome-page.home81>.home217-stories{margin-top:0!important}
  #welcome-page .home217-stories>.home217-story{padding:25px 0!important;gap:16px!important}
  #welcome-page .home217-story .home217-orbit{width:100%;max-width:290px;min-height:0;margin:0 auto!important}
  #welcome-page .home217-story .home249-transfer{height:360px;max-width:315px;aspect-ratio:auto}
  #welcome-page .home249-transfer .home252-converter{transform:rotate(-2deg) scale(.9)}
  #welcome-page .home217-story .home249-work-art{height:340px;max-width:320px!important;aspect-ratio:auto}
  #welcome-page .home217-copy>.home81-kicker{margin-bottom:9px!important;font-size:10px!important;line-height:1.45!important}
  #welcome-page .home217-copy h2{font-size:clamp(27px,8vw,33px)!important;line-height:1.13!important}
  #welcome-page .home217-copy p{font-size:15px!important;line-height:1.58!important;margin:13px 0 16px!important}
  #welcome-page .home217-copy small{font-size:11px;line-height:1.5;margin-top:11px}
  #welcome-page .home217-copy .home249-story-link{margin-top:8px!important}
  #welcome-page .home81-premium{padding:24px 20px;gap:20px}
}
@media (max-width:350px){
  #welcome-page.home81 .welcome-hero{padding:20px 16px!important}
  #welcome-page.home81 .welcome-copy h1{font-size:33px!important}
  #welcome-page .home217-story .home249-transfer{height:350px}
  #welcome-page .home249-transfer .home252-converter{transform:rotate(-2deg) scale(.86)}
  #welcome-page .home217-story .home249-work-art{height:325px}
}
@media(max-width:760px){
  #welcome-page .home217-stories>.home217-story .home217-orbit{max-width:290px!important}
  #welcome-page .home217-stories>.home217-story .home249-transfer{max-width:315px!important}
  #welcome-page .home217-stories>.home217-story .home249-work-art{max-width:320px!important}
}
@layer pxls-typography{
  @media(max-width:760px){
    #welcome-page.home81 .welcome-copy>p:not(.welcome-caption){font-size:15px!important;line-height:1.55!important}
    #welcome-page .home217-copy>.home81-kicker{font-size:10px!important;line-height:1.45!important;margin-bottom:9px!important}
    #welcome-page .home217-copy h2{font-size:clamp(27px,8vw,33px)!important;line-height:1.13!important}
    #welcome-page .home217-copy p{font-size:15px!important;line-height:1.58!important}
  }
}
@media(max-width:760px){
  #welcome-page .home217-stories>.home217-story .home217-orbit{height:245px;aspect-ratio:auto}
  #welcome-page .home217-stories>.home217-story .home249-transfer{height:360px}
  #welcome-page .home217-stories>.home217-story .home249-work-art{height:340px}
}
@media(max-width:350px){
  #welcome-page .home217-stories>.home217-story .home249-transfer{height:350px}
  #welcome-page .home217-stories>.home217-story .home249-work-art{height:325px}
}