*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
.cursor{width:10px;height:10px;background:var(--yellow);border-radius:50%;position:fixed;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:width .2s,height .2s,opacity .2s;}
.cursor.hovering{width:22px;height:22px;}
.cursor-ring{width:34px;height:34px;border:1px solid var(--yellow);border-radius:50%;position:fixed;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);opacity:.5;transition:width .25s,height .25s,opacity .2s,border-color .2s;}
.cursor-ring.hovering{width:0;height:0;opacity:0;}
body{animation:pageIn .4s ease both;}
@keyframes pageIn{from{opacity:0;}to{opacity:1;}}
a:focus-visible,button:focus-visible{outline:2px solid var(--yellow);outline-offset:3px;}

/* Drag cursor (before/after slider) — same grow dot */
.cursor.cursor--drag{width:22px;height:22px;}
.cursor-ring.cursor--drag{width:0;height:0;opacity:0;}

/* Text cursor — same grow dot */
.cursor.cursor--text{width:22px;height:22px;}
.cursor-ring.cursor--text{width:0;height:0;opacity:0;}

/* Select cursor (form fields) — same grow dot */
.cursor.cursor--select{width:22px;height:22px;}
.cursor-ring.cursor--select{width:0;height:0;opacity:0;}
@media(max-width:900px){body{cursor:auto;}a,button,input,label{cursor:auto;}.cursor,.cursor-ring{display:none !important;}}
