/* Shared warmth and motion. Pages remain fully usable if this stylesheet or JS is unavailable. */
.landing-copy{max-width:610px}
.landing .eyebrow,.account-intro .eyebrow{font-size:.85rem;letter-spacing:.04em;text-transform:none;color:#855044}
.landing h1{max-width:10ch}
.landing .hero-art{min-height:470px;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 54% 30%,#fffaf4 0%,#e8f0e9 55%,#f4ddd2 100%);border-radius:42% 42% 26px 26px}
.landing-halo{position:absolute;top:7%;right:7%;width:210px;aspect-ratio:1;border-radius:50%;background:#f9e1d5;box-shadow:0 0 0 24px #fffaf477}
.landing-nelli{position:absolute;z-index:2;top:5%;right:8%;width:155px;height:155px;filter:drop-shadow(0 15px 12px #8c706333)}
.landing .art-card{z-index:1;transform:translate(-7%,36px) rotate(-4deg);background:#fffdf9;box-shadow:0 26px 65px #604b3e2b}
.landing .art-card small{letter-spacing:.03em;text-transform:none;font-size:.78rem;color:#855044}
.landing .art-card h2{font-family:var(--serif);font-weight:500;font-size:2.35rem;letter-spacing:-.04em}
.account-layout{align-items:center}
.account-intro{max-width:540px}
.account-welcome{display:flex;align-items:center;gap:14px;max-width:390px;margin-top:2rem;padding:12px 20px 12px 8px;border:1px solid #d6e3d7;border-radius:18px;background:#eaf2e9;box-shadow:0 12px 28px #604b3e14}
.account-welcome img{flex:none;width:72px;height:72px}
.account-welcome span{font:500 1.1rem/1.3 var(--serif);color:#365c49}
.account-layout>.panel{box-shadow:0 22px 60px #604b3e18}

@media(max-width:760px){
  .landing .hero-art{min-height:310px;border-radius:35% 35% 22px 22px}
  .landing-nelli{width:108px;height:108px;top:2%;right:5%}
  .landing-halo{width:140px;top:3%;right:3%}
  .landing .art-card{transform:translate(-9%,22px) rotate(-3deg);padding:1.5rem}
  .landing .art-card h2{font-size:1.85rem}
  .account-layout{align-items:stretch}
}

@media(prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  @keyframes nelli-page-out{to{opacity:0;transform:translateY(-5px)}}
  @keyframes nelli-page-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
  @keyframes nelli-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
  @keyframes nelli-hello{0%,100%{transform:translateY(0) scale(1,1)}38%{transform:translateY(-11px) scale(.96,1.05)}63%{transform:translateY(0) scale(1.06,.95)}82%{transform:translateY(-3px) scale(.99,1.01)}}
  @keyframes nelli-header-bounce{0%,100%{transform:translateY(0) scale(1,1)}17%{transform:translateY(0) scale(1.06,.9)}39%{transform:translateY(-13px) scale(.96,1.04)}61%{transform:translateY(0) scale(1.05,.92)}78%{transform:translateY(-5px) scale(.99,1.02)}}
  ::view-transition-old(root){animation:nelli-page-out .2s ease-in both}
  ::view-transition-new(root){animation:nelli-page-in .36s ease-out both}
  .top,.site-header{view-transition-name:nelli-header}
  .nelli-header-mark{transform-origin:center 86%;animation:nelli-header-bounce 1.1s .12s ease-out both}
  .landing-copy>*{animation:nelli-rise .6s ease-out both}
  .landing-copy>*:nth-child(2){animation-delay:.07s}
  .landing-copy>*:nth-child(3){animation-delay:.14s}
  .landing-copy>*:nth-child(4){animation-delay:.21s}
  .landing-copy>*:nth-child(5){animation-delay:.28s}
  .landing .hero-art{animation:nelli-rise .7s .14s ease-out both}
  .landing-nelli{animation:nelli-hello .95s .62s ease-out both}
  .account-intro{animation:nelli-rise .6s ease-out both}
  .account-layout>.panel{animation:nelli-rise .6s .12s ease-out both}
  .account-welcome img{animation:nelli-hello .9s .55s ease-out both}
  main>.page:not([hidden]){animation:nelli-page-in .42s ease-out both}
  #page-home:not([hidden]) .hero-copy{animation:nelli-rise .55s ease-out both}
  #page-home:not([hidden]) .hero-stage{animation:nelli-rise .65s .12s ease-out both}
  .profile-layout>div,.profile-layout>.panel{animation:nelli-rise .55s ease-out both}
  .profile-layout>.panel{animation-delay:.1s}
  .profile-home>h1,.profile-home>.profile-menu{animation:nelli-rise .55s ease-out both}
  .profile-home>.profile-menu{animation-delay:.08s}
  .motion-ready [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .65s ease-out,transform .65s ease-out}
  .motion-ready [data-reveal].is-visible{opacity:1;transform:none}
  .button,.btn,.start-card,.profile-menu a,.tiles article{transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease,border-color .22s ease}
  @media(hover:hover){
    .button:hover:not(:disabled),.btn:hover:not(:disabled),.start-card:hover,.profile-menu a:hover,.tiles article:hover{transform:translateY(-2px)}
    .tiles article:hover{box-shadow:0 16px 36px #604b3e18}
  }
}
