/* A brighter evening palette; the existing daylight colors stay intact. */
body:not(.light){--bg:#252747;--solid:#323553;--panel:rgba(225,230,255,.105);--line:rgba(235,237,255,.24);--muted:#d0d1e6;--mint:#b1ffe3;--coral:#ffc0aa;--shadow:0 16px 35px #10122e45,0 4px 0 #12173355,inset 0 2px 1px #ffffff32,inset 0 -2px 2px #11192b35;background:radial-gradient(ellipse at 4% 9%,#5676c980,transparent 39%),radial-gradient(ellipse at 95% 20%,#b06eab55,transparent 36%),radial-gradient(ellipse at 25% 70%,#459d9640,transparent 40%),radial-gradient(ellipse at 90% 85%,#aa6a8740,transparent 34%),var(--bg)}
body:not(.light) header{background:#292c4bd9;box-shadow:0 5px 25px #17192a30,inset 0 -1px 0 #ffffff12}
button,.soft,.search,.pill,.tiny,.saved-icons span,.planitem,.field input,.field select,.previewpaper,.paper,.ad,.glass{position:relative;isolation:isolate;box-shadow:0 5px 0 #141b3538,0 10px 22px #10182c22,inset 0 2px 1px #ffffff35,inset 0 -2px 2px #10152724;transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s,border-color .24s,background .24s}
button,.soft,.chip{background-image:linear-gradient(140deg,#ffffff20,#ffffff03 48%,#ffffff0a);backdrop-filter:blur(14px)}
button{overflow:hidden}
.primary{background:linear-gradient(140deg,#ffdbc3,#ffb4a6 60%,#eca7ce);box-shadow:0 5px 0 #965e6955,0 12px 24px #ffaf9b25,inset 0 2px 1px #fff9,inset 0 -2px 2px #9d617333}
.primary:hover{background:linear-gradient(140deg,#ffe4ce,#ffc0b5 60%,#f1b7dc)}
.glass{transform:perspective(950px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(var(--lift,0px));overflow:hidden;background-image:radial-gradient(circle at var(--shine-x,20%) var(--shine-y,0%),#ffffff12,transparent 55%),linear-gradient(135deg,#ffffff10,#ffffff02 50%,#ffffff09)}
.glass:before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,#fff1,transparent 35%,transparent 65%,#fff08)}
body:not(.light) .daily{background-color:#8174b925}
body:not(.light) .dashboard>.widget:nth-child(2){background-color:#71bba51b}
body:not(.light) .dashboard>.widget:nth-child(3){background-color:#e49d9b18}
body:not(.light) .kit:nth-child(3n+1){background-color:#8e9de215}
body:not(.light) .kit:nth-child(3n+2){background-color:#71bba515}
body:not(.light) .kit:nth-child(3n){background-color:#c68eb515}
.glass:hover{--lift:-3px;border-color:color-mix(in srgb,var(--mint) 48%,var(--line));box-shadow:0 22px 40px #121b3330,0 5px 0 #141b3538,inset 0 2px 1px #ffffff45,inset 0 -2px 2px #10152724}
.kit:hover{transform:perspective(950px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-6px)}
.kit .paper{transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.kit:hover .paper:not(.back){transform:translateY(-7px) rotate(-5deg)}
.kit:hover .paper.back{transform:translate(61px,-1px) rotate(17deg)}
.textbtn,.kitopen{border:1px solid var(--line);padding:5px 9px;border-radius:9px;background-color:var(--panel);box-shadow:0 3px 0 #141b3528,inset 0 1px 1px #fff3;font-size:11px}
.widgettop{flex-wrap:wrap}.daily .widgettop:last-child{gap:8px}
.saved-icons span:nth-child(1){background-color:#a4c1ff20}.saved-icons span:nth-child(2){background-color:#ffb1c420}.saved-icons span:nth-child(3){background-color:#a8f0d520}
.celebrations button:nth-child(3n+1){background-color:#b0a2ed20}.celebrations button:nth-child(3n+2){background-color:#ffb69e20}.celebrations button:nth-child(3n){background-color:#94e8d020}
.chip.active{box-shadow:0 4px 0 #28564b38,0 5px 18px #a5f6d915,inset 0 2px 1px #d9fff83a}
.heart{box-shadow:0 3px 0 #161a3044,inset 0 2px 2px #fff5}.heart[aria-pressed=true]{border-color:#ffd5e4;box-shadow:0 3px 0 #50233f55,0 0 20px #ff96c13b,inset 0 2px 2px #fff5}
.primary,.banner .soft{animation:happy-nudge 8s ease-in-out infinite}.banner .soft{animation-delay:3s}
@keyframes happy-nudge{0%,85%,100%{transform:translateY(0) rotate(0)}88%{transform:translateY(-4px) rotate(-2deg)}91%{transform:translateY(-2px) rotate(2deg)}94%{transform:translateY(-4px) rotate(-1deg)}97%{transform:translateY(0) rotate(0)}}
@keyframes button-dance{0%,100%{transform:translateY(-3px) rotate(0)}25%{transform:translateY(-5px) rotate(-2deg)}65%{transform:translateY(-5px) rotate(2deg)}}
@media(hover:hover) and (pointer:fine){button:hover,.soft:hover{animation:button-dance .55s ease-in-out 1;transform:translateY(-3px);border-color:color-mix(in srgb,var(--mint) 55%,var(--line));box-shadow:0 7px 0 #141b3530,0 15px 24px #10182c25,inset 0 2px 1px #ffffff65}button.primary:hover{border-color:#ffe8da;box-shadow:0 7px 0 #965e6955,0 16px 26px #ffaf9b35,inset 0 2px 1px #fff9}}
button:active,.soft:active{animation:none;transform:translateY(3px) scale(.98);box-shadow:0 1px 0 #141b3530,inset 0 1px 3px #fff4}
.tap-spark{position:absolute;pointer-events:none;z-index:4;left:var(--spark-x,50%);top:var(--spark-y,50%);width:10px;height:10px;border-radius:50%;background:#fff8;box-shadow:0 0 12px #d6fff6;animation:tap-ripple .6s ease-out forwards}
@keyframes tap-ripple{from{transform:translate(-50%,-50%) scale(0);opacity:.7}to{transform:translate(-50%,-50%) scale(22);opacity:0}}
.motion-toggle{font-size:12px;white-space:nowrap}
.light .glass{background-image:radial-gradient(circle at var(--shine-x,20%) var(--shine-y,0%),#ffffff80,transparent 55%),linear-gradient(135deg,#ffffff66,#ffffff15)}
.light button,.light .soft{box-shadow:0 4px 0 #7c77952a,0 8px 18px #786e8d12,inset 0 2px 1px white,inset 0 -1px 1px #89809a18}
.motion-paused *{animation:none!important}.motion-paused .glass,.motion-paused .kit:hover{transform:none!important}.motion-paused button:hover,.motion-paused .soft:hover{transform:none!important}
@media(max-width:560px){.nav{gap:7px}.brand{gap:8px;font-size:16px}.nav>.icon{padding:7px 9px}.motion-toggle{font-size:11px}.daily .textbtn{font-size:10px;padding:5px 7px}.glass:hover{--lift:0px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.glass,.kit:hover,button:hover,.soft:hover{transform:none!important}.tap-spark{display:none}}
@media print{.tap-spark{display:none!important}}

.hero-actions{flex-wrap:wrap}@media(max-width:600px){.hero .hero-actions{flex-direction:column;align-items:stretch;max-width:340px;margin-left:auto;margin-right:auto}}
