/* Shared, quiet feedback for every interactive surface. */
:where(button,a[href],summary,select,input[type=checkbox],input[type=range]){
 --interaction-accent:var(--chakra,#c9a6f5);
 transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease,text-shadow .2s ease,translate .2s ease,filter .2s ease;
}
:where(button,a[href],summary){border-radius:9px;touch-action:manipulation}
:where(button,a[href],summary,select,input[type=checkbox],input[type=range]):not(:disabled):not([aria-disabled=true]){cursor:pointer}
body :is(button,a[href],summary,select,input,textarea):focus-visible{
 outline:2px solid #e3c8ff;outline-offset:4px;
 box-shadow:0 0 0 5px #b68bdd24,0 0 24px #b68bdd30;
}
body :is(button,a[href],summary):focus-visible{color:#fff5ff;text-shadow:0 0 15px #d3aaff66}
body .btn.primary:focus-visible{background:#e1caff;color:#21122f}
.text-btn,.back,.nav button,.footer button,a[href]:not(.btn):not(.brand):not(.skip){
 text-decoration-line:underline;text-decoration-color:transparent;text-underline-offset:5px;text-decoration-thickness:1px;
 transform-origin:left center;
 transition:color .22s ease,text-shadow .22s ease,text-decoration-color .22s ease,scale .22s ease;
}
.nav button{transform-origin:center}.footer button{transform-origin:right center}
body .nav button.active{border-bottom-color:transparent;text-decoration-color:#d6b1fb99}
a[href]:not(.btn):not(.brand):not(.skip){display:inline-block}
.btn>span[aria-hidden=true]{transition:translate .2s ease}
.visual-choice-art canvas{transition:filter .25s ease,scale .3s ease}
.practice-phases label{border-radius:8px;transition:color .2s ease,box-shadow .2s ease,background-color .2s ease}
.practice-phases label:has(input:focus-visible){color:#f5e8ff;background:#c5a0ed18;box-shadow:0 0 0 5px #c5a0ed18}
@media(hover:hover) and (pointer:fine){
 body :where(button:not(:disabled):not([aria-disabled=true]),a.btn:not([aria-disabled=true]),summary):hover{
  color:#fff4ff;background-color:color-mix(in srgb,var(--interaction-accent) 17%,#191224);
  border-color:color-mix(in srgb,var(--interaction-accent) 70%,#fff0ff);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--interaction-accent) 33%,transparent),0 0 23px color-mix(in srgb,var(--interaction-accent) 20%,transparent);
 }
 body :is(.chip,.preview-button,.choose-music,.track-use,.home-sample-toggle,.practice-choices button,.silhouette-toggle button,.setup-tabs [role=tab],.feeling-scale button,.session button):not(:disabled):hover{
  background-color:color-mix(in srgb,var(--interaction-accent) 20%,#21162e);border-color:#dcc1f5;color:#fff0ff;
 }
 body .btn:not(:disabled):hover{translate:0 -2px}
 body .btn.primary:not(:disabled):hover{background:#e2ccff;color:#21122f;border-color:#f0dfff;box-shadow:0 0 0 1px #ead4ff88,0 8px 32px #bb85ee44,inset 0 1px 0 #ffffff66;text-shadow:none}
 body .entry-continue:not(:disabled):hover{background:#e2ccff!important}
 body .btn:not(:disabled):hover>span[aria-hidden=true]{translate:4px 0}
 body :is(.text-btn,.back,.nav button,.footer button):not(:disabled):hover,body a[href]:not(.btn):not(.skip):hover{
  color:#fff1ff;text-decoration-color:#d7b1ff;text-shadow:0 0 14px #d2a5ff88;
 }
 body .brand:hover{background:none;box-shadow:none;text-decoration:none}
 body .brand:hover .brand-mark{filter:drop-shadow(0 0 9px #d2a5ffb3);color:#f4dcff}
 body .brand:hover .brand-tagline{color:#d2b8ed}
 body .visual-choice:hover{translate:0 -3px;background:#2b1c3e;border-color:#e4c8ff;box-shadow:0 0 0 1px #c99dec66,0 12px 30px #09051470,0 0 30px #b784e329}
 body .visual-choice:hover .visual-choice-art canvas{filter:brightness(1.18) saturate(1.12);scale:1.025}
 body .visual-choice:hover .visual-choice-state{color:#f0d3ff}
 body .chakra-node:hover{background:color-mix(in srgb,var(--chakra) 25%,#171225);border-color:color-mix(in srgb,var(--chakra) 70%,white);box-shadow:0 0 0 2px color-mix(in srgb,var(--chakra) 26%,transparent),0 0 25px color-mix(in srgb,var(--chakra) 47%,transparent)}
 body .chakra-node:not(.selected):hover>svg{opacity:.9;filter:drop-shadow(0 0 5px var(--chakra))}
 body .chakra-node:hover .chakra-node-label,body .phone-chakra-node:hover span{color:#fff0ff;text-shadow:0 0 10px var(--chakra)}
 body .practice-phases label:hover{color:#fff0ff;background:#c5a0ed18;box-shadow:0 0 0 5px #c5a0ed18}
 body :is(select,input[type=checkbox],input[type=range]):not(:disabled):hover{border-color:#d9b4f6;filter:brightness(1.2);box-shadow:0 0 0 3px #bb8ee728,0 0 18px #bb8ee730}
}
/* Press feedback also works on touch screens without sticky hover. */
body :where(button:not(:disabled):not([aria-disabled=true]),a.btn:not([aria-disabled=true]),summary):active{filter:brightness(1.18);box-shadow:inset 0 0 0 2px #ead4ff66,0 0 20px #b88ce033}
body .btn:not(:disabled):active,body .visual-choice:active{translate:0 1px}
body .chakra-node:active{background:color-mix(in srgb,var(--chakra) 32%,#171225);box-shadow:0 0 24px color-mix(in srgb,var(--chakra) 50%,transparent)}
/* Text links stay part of the page; feedback never creates a new surface. */
body :is(.text-btn,.back,.nav button,.footer button,a[href]:not(.brand):not(.skip)):not(.btn):not(:disabled):is(:hover,:focus-visible,:active){
 background:transparent;box-shadow:none;
 color:#fff1ff;text-decoration-color:#d6b1fbc7;text-shadow:0 0 10px #c9a7f550;
}
@media(hover:hover) and (pointer:fine){
 body :is(.text-btn,.back,.nav button,.footer button,a[href]:not(.brand):not(.skip)):not(.btn):not(:disabled):hover{scale:1.045}
}
@media(prefers-reduced-motion:reduce){
 :where(button,a[href],summary,select,input),.btn>span[aria-hidden=true],.visual-choice-art canvas,.practice-phases label{transition:none!important}
 body .btn:hover,body .btn:active,body .visual-choice:hover,body .visual-choice:active,body .btn:hover>span[aria-hidden=true]{translate:none}
 body .btn:hover,body .btn:active{transform:none}
 body .visual-choice:hover .visual-choice-art canvas{scale:1}
 body :is(.text-btn,.back,.nav button,.footer button,a[href]:not(.brand):not(.skip)):not(.btn):hover{scale:1}
}