/* Shared motion language: soft entrances, tactile controls and living illustrations. */
button,summary,a,input,select,textarea{transition:background-color .2s,border-color .2s,color .2s,box-shadow .2s}
button:not(:disabled):active,summary:active{transform:scale(.97)}
input:focus,select:focus,textarea:focus{transition:border-color .2s,box-shadow .2s}
#tabs .t-ico{transition:background-color .25s,color .25s,transform .25s}
#tabs button.on .t-ico{animation:nav-arrive .4s cubic-bezier(.22,1,.36,1)}
#sheet:not([hidden]){animation:veil-in .22s ease-out}
#sheet:not([hidden]) .panel{animation:sheet-arrive .38s cubic-bezier(.22,1,.36,1)}
.account-menu[open] .account-dropdown{transform-origin:top right;animation:menu-arrive .22s cubic-bezier(.22,1,.36,1)}
.home-quick .i3{animation:icon-sway 5s ease-in-out infinite;transform-origin:50% 75%}
.home-quick button:nth-child(2) .i3{animation-delay:-1.4s}
.home-quick button:nth-child(3) .i3{animation-delay:-2.8s}
.home-quick button:nth-child(4) .i3{animation-delay:-4.2s}
.tile .ico .i3{animation:icon-drift 6s ease-in-out infinite}
.tile:nth-child(even) .ico .i3{animation-delay:-3s}
.tile.on .ico .i3{animation:sound-breathe 2.6s ease-in-out infinite}
.tracking-card .i3{animation:icon-welcome .65s cubic-bezier(.22,1,.36,1) both}
.tracking-card:nth-child(2n) .i3{animation-delay:.07s}
.tracking-card:nth-child(3n) .i3{animation-delay:.12s}
.dial-center{animation:center-arrive .65s ease-out}
.weekly-plot path[stroke="#ffe04a"]{stroke-dasharray:400;stroke-dashoffset:0;animation:chart-draw 1.1s ease-out}
.weekly-plot circle{transform-box:fill-box;transform-origin:center;animation:chart-dot .65s .15s both}
.profile-initial{animation:icon-welcome .6s cubic-bezier(.22,1,.36,1)}
.little-star{animation:star-turn 5s ease-in-out infinite}
#player:not([hidden]){animation:player-arrive .35s cubic-bezier(.22,1,.36,1)}
.mp-bar i{transition:width .6s linear}
@media(hover:hover){.tile:hover .ico .i3,.tracking-card:hover .i3{animation-play-state:paused;transform:translateY(-4px) rotate(-3deg)}.tile:hover,.tracking-card:hover{border-color:#ffffff24}.home-quick button:hover{color:#fff}}
@keyframes nav-arrive{0%{transform:translateY(3px) scale(.9)}70%{transform:translateY(-2px) scale(1.05)}100%{transform:none}}
@keyframes veil-in{from{background-color:transparent}}
@keyframes sheet-arrive{from{opacity:.5;transform:translateY(35px)}to{opacity:1;transform:none}}
@keyframes menu-arrive{from{opacity:0;transform:translateY(-6px) scale(.96)}to{opacity:1;transform:none}}
@keyframes icon-sway{0%,70%,100%{transform:none}80%{transform:translateY(-3px) rotate(-5deg)}90%{transform:translateY(-1px) rotate(4deg)}}
@keyframes icon-drift{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1.5deg)}}
@keyframes icon-welcome{from{opacity:0;transform:translateY(12px) scale(.85) rotate(-5deg)}to{opacity:1;transform:none}}
@keyframes center-arrive{from{opacity:0;filter:blur(3px)}to{opacity:1;filter:blur(0)}}
@keyframes chart-draw{from{stroke-dashoffset:400}to{stroke-dashoffset:0}}
@keyframes chart-dot{from{opacity:0;transform:scale(.2)}to{opacity:1;transform:scale(1)}}
@keyframes star-turn{0%,65%,100%{transform:scale(1) rotate(0);opacity:.8}80%{transform:scale(1.15) rotate(25deg);opacity:1}}
@keyframes player-arrive{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}button:active,summary:active{transform:none!important}}
