/* Original CSS: dot-field and spotlight ideas inspired by React Bits / interactive-dot-grid. */
:root{--tech-rgb:22,132,156;--tech-line:rgba(var(--tech-rgb),.17);--tech-dot:rgba(var(--tech-rgb),.29)}
:root[data-theme=dark]{--tech-rgb:95,216,227;--tech-line:rgba(var(--tech-rgb),.17);--tech-dot:rgba(var(--tech-rgb),.32)}
.search-section{position:relative;isolation:isolate}
.ambient-field{position:absolute;inset:-65px -115px -54px;z-index:-1;pointer-events:none;overflow:hidden;mask-image:radial-gradient(ellipse at center,#000 16%,transparent 72%);-webkit-mask-image:radial-gradient(ellipse at center,#000 16%,transparent 72%)}
.ambient-field::before{content:"";position:absolute;inset:0;background-image:radial-gradient(var(--tech-dot) .7px,transparent .9px);background-size:22px 22px;opacity:.65}
.ambient-field::after{content:"";position:absolute;inset:22% 8% 0;background:radial-gradient(ellipse at center,rgba(var(--tech-rgb),.085),transparent 66%);filter:blur(22px)}
.orbit{position:absolute;left:50%;top:51%;width:91%;height:69%;border:1px solid var(--tech-line);border-radius:50%;transform:translate(-50%,-50%) rotate(-14deg)}
.orbit:nth-child(2){width:72%;height:104%;transform:translate(-50%,-50%) rotate(25deg);opacity:.55}
.orbit::after{content:"";position:absolute;left:17%;top:10%;width:4px;height:4px;border-radius:50%;background:rgb(var(--tech-rgb));box-shadow:0 0 11px rgba(var(--tech-rgb),.35)}
.search-section h1{position:relative}
.search-box{box-shadow:0 7px 28px rgba(var(--tech-rgb),.035);transition:border-color .2s,box-shadow .2s}
.search-box:focus-within{border-color:rgba(var(--tech-rgb),.48);box-shadow:0 0 0 3px rgba(var(--tech-rgb),.045),0 10px 35px rgba(var(--tech-rgb),.05)}
.link-card{isolation:isolate;overflow:hidden;border:1px solid transparent;transition:transform .22s,border-color .22s,background .22s,box-shadow .22s}
.link-card::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;background:radial-gradient(260px circle at var(--spot-x,50%) var(--spot-y,50%),rgba(var(--tech-rgb),.11),transparent 75%);transition:opacity .25s}
.link-card:focus-within{border-color:rgba(var(--tech-rgb),.38)}
.link-card:focus-within::before{opacity:.5}
.site-icon{transition:color .2s}
.link-card:focus-within .site-icon{color:rgb(var(--tech-rgb))}
footer a{font-size:12px;text-decoration:underline;text-underline-offset:3px}
@media(hover:hover) and (pointer:fine){
 .link-card:hover{transform:translateY(-3px);border-color:rgba(var(--tech-rgb),.27);box-shadow:0 8px 20px rgba(var(--tech-rgb),.045)}
 .link-card:hover::before{opacity:1}
 .link-card:hover .site-icon{color:rgb(var(--tech-rgb))}
}
@media(prefers-reduced-motion:no-preference) and (hover:hover) and (pointer:fine){
 .orbit{animation:orbit-drift 28s ease-in-out infinite alternate}
 .orbit:nth-child(2){animation:orbit-drift-second 33s ease-in-out infinite alternate}
 @keyframes orbit-drift{from{transform:translate(-50%,-50%) rotate(-14deg)}to{transform:translate(-50%,-50%) rotate(9deg)}}
 @keyframes orbit-drift-second{from{transform:translate(-50%,-50%) rotate(25deg)}to{transform:translate(-50%,-50%) rotate(2deg)}}
}
.ambient-paused .orbit{animation-play-state:paused}
@media(max-width:900px){.ambient-field{inset:-45px -35px -40px}}
@media(max-width:640px){.ambient-field{inset:-30px -18px -35px}.orbit{opacity:.6}.ambient-field::before{opacity:.45;background-size:20px 20px}}
@media(prefers-reduced-motion:reduce){.orbit{animation:none!important}.link-card:hover{transform:none}.link-card,.link-card::before,.site-icon,.search-box{transition:none!important}}
