/* Shared base and the original ball */
:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#f5efff;background:#090819;font-synthesis:none}
*{box-sizing:border-box}
:is(body.page-main,body.page-404){margin:0;min-height:100svh;background:radial-gradient(ellipse 42% 42% at 50% 42%,#241b49 0%,#11102a 56%,#090819 100%);overflow-x:hidden}
:is(body.page-main,body.page-404):before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.55;background-image:radial-gradient(1px 1px at 9% 18%,#dacaff 99%,transparent),radial-gradient(1px 1px at 83% 13%,#dacaff 99%,transparent),radial-gradient(2px 2px at 22% 65%,#ad96ff 99%,transparent),radial-gradient(1px 1px at 71% 72%,#dacaff 99%,transparent),radial-gradient(1px 1px at 88% 85%,#dacaff 99%,transparent),radial-gradient(1px 1px at 44% 10%,#dacaff 99%,transparent)}
:is(body.page-main,body.page-404) main{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px 52px;text-align:center}
:is(body.page-main,body.page-404) .eyebrow{font-size:.78rem;letter-spacing:.27em;text-transform:uppercase;color:#bd9fff;font-weight:700;margin:0 0 12px}
:is(body.page-main,body.page-404) h1{font-family:Georgia,serif;font-size:clamp(2.5rem,6vw,4.8rem);font-weight:400;line-height:1.08;margin:0;letter-spacing:-.045em}
:is(body.page-main,body.page-404) .intro{color:#b7aacd;font-size:1rem;line-height:1.5;margin:17px 0 8px}
:is(body.page-main,body.page-404) .orb-wrap{position:relative;width:min(410px,86vw);aspect-ratio:1;margin:0 auto -5px;display:grid;place-items:center;touch-action:none;user-select:none;cursor:grab;outline:none}
:is(body.page-main,body.page-404) .orb-wrap:active{cursor:grabbing}
:is(body.page-main,body.page-404) .orb-wrap:focus-visible{outline:2px solid #c4a6ff;outline-offset:4px;border-radius:50%}
:is(body.page-main,body.page-404) .orb-wrap:before{content:"";position:absolute;inset:15%;border-radius:50%;background:#8060fd;filter:blur(72px);opacity:.22}
:is(body.page-main,body.page-404) .orb{width:100%;height:100%;object-fit:contain;position:relative;filter:drop-shadow(0 22px 45px #0008);transform-origin:50% 53%;transition:transform .3s ease}
:is(body.page-main,body.page-404) .orb-wrap:hover .orb{transform:scale(1.035)}
:is(body.page-main,body.page-404) .orb-wrap.shaking .orb{animation:shake .62s ease-in-out}
:is(body.page-main,body.page-404) .orb-wrap.reveal .orb{animation:reveal .65s ease-out}
@keyframes shake{0%,100%{transform:translate(0) rotate(0)}15%{transform:translate(-15px,5px) rotate(-7deg)}30%{transform:translate(16px,-6px) rotate(8deg)}45%{transform:translate(-13px,4px) rotate(-7deg)}60%{transform:translate(12px,-3px) rotate(6deg)}75%{transform:translate(-7px,2px) rotate(-3deg)}}
@keyframes reveal{0%{filter:brightness(2) drop-shadow(0 0 60px #a883ff);transform:scale(1.09)}100%{filter:drop-shadow(0 22px 45px #0008);transform:scale(1)}}
:is(body.page-main,body.page-404) .controls{width:min(440px,100%);position:relative;z-index:1}
:is(body.page-main,body.page-404) button{margin-top:14px;width:100%;border:0;border-radius:15px;background:linear-gradient(120deg,#a77cfc,#7653dd);color:#130d26;padding:17px 22px;font:700 1rem inherit;font-family:inherit;font-weight:750;font-size:1rem;cursor:pointer;box-shadow:0 12px 30px #6745da44;transition:transform .2s,filter .2s}
:is(body.page-main,body.page-404) button:hover{filter:brightness(1.12);transform:translateY(-2px)}
:is(body.page-main,body.page-404) button:active{transform:translateY(1px)}
:is(body.page-main,body.page-404) button:focus-visible{outline:2px solid #fff;outline-offset:3px}
:is(body.page-main,body.page-404) .hint{color:#a99abe;font-size:.85rem;line-height:1.5;margin:16px 0 0}
:is(body.page-main,body.page-404) .answer{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);z-index:2;width:68%;min-height:28%;padding:18px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(ellipse,#0c0924e8 0%,#130b37cf 48%,#150a3370 75%,transparent 100%);color:#fff7ff;text-shadow:0 0 14px #daacff,0 2px 10px #09051d;font-family:Georgia,serif;font-size:clamp(1.1rem,4.5vw,1.8rem);font-weight:600;line-height:1.25;text-wrap:balance;opacity:0;pointer-events:none;transition:opacity .4s ease}
:is(body.page-main,body.page-404) .answer:not(:empty){opacity:1}
:is(body.page-main,body.page-404) .orb-wrap.shaking .answer{opacity:0}
@media(max-width:600px){
:is(body.page-main,body.page-404) main{justify-content:flex-start;padding:34px 20px 30px}
:is(body.page-main,body.page-404) .orb-wrap{width:min(340px,80vw);margin:4px auto -2px}
:is(body.page-main,body.page-404) .intro{margin-bottom:0}
:is(body.page-main,body.page-404) .answer{font-size:clamp(1rem,5vw,1.4rem);padding:12px}
}
@media(prefers-reduced-motion:reduce){
:is(body.page-main,body.page-404) *,:is(body.page-main,body.page-404) *:before,:is(body.page-main,body.page-404) *:after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* Page not found */
body.page-404 .error-code{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);z-index:2;width:68%;min-height:28%;display:grid;place-items:center;border-radius:50%;background:radial-gradient(ellipse,#0c0924d9 0%,#130b3799 50%,transparent 80%);color:#fff7ff;text-shadow:0 0 24px #daacff,0 2px 10px #09051d;font-family:Georgia,serif;font-size:clamp(3.8rem,16vw,6.5rem);line-height:1;pointer-events:none}
body.page-404 .home-link{display:block;margin-top:14px;width:100%;border-radius:15px;background:linear-gradient(120deg,#a77cfc,#7653dd);color:#130d26;padding:17px 22px;text-decoration:none;font-weight:750;font-size:1rem;box-shadow:0 12px 30px #6745da44;transition:transform .2s,filter .2s}
body.page-404 .home-link:hover{filter:brightness(1.12);transform:translateY(-2px)}
body.page-404 .home-link:focus-visible{outline:2px solid #fff;outline-offset:3px}
body.page-404 .orb-wrap{cursor:default;touch-action:auto}

/* SEO balls */
body.page-seo{margin:0;min-height:100svh;background:radial-gradient(ellipse 45% 46% at 50% 42%,var(--atmosphere) 0%,#11102a 62%,#090819 100%);overflow-x:hidden}
body.page-seo:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.5;background-image:radial-gradient(1px 1px at 9% 18%,#dacaff 99%,transparent),radial-gradient(1px 1px at 83% 13%,#dacaff 99%,transparent),radial-gradient(2px 2px at 22% 65%,#ad96ff 99%,transparent),radial-gradient(1px 1px at 71% 72%,#dacaff 99%,transparent)}
body.page-seo[data-kind="google"]{--atmosphere:#182850;--glow:#709fff;--button-a:#a9d6ff;--button-b:#7296f0}
body.page-seo[data-kind="yandex"]{--atmosphere:#4a1729;--glow:#f47586;--button-a:#ffb5a9;--button-b:#ed7385}
body.page-seo[data-kind="discover"]{--atmosphere:#282052;--glow:#b58cff;--button-a:#c8a5ff;--button-b:#9470ed}
body.page-seo main{min-height:calc(100svh - 86px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:42px 20px 38px;text-align:center}
body.page-seo .eyebrow{color:var(--glow);font-size:.78rem;letter-spacing:.23em;text-transform:uppercase;font-weight:700;margin:0 0 12px}
body.page-seo h1{font-family:Georgia,serif;font-size:clamp(2.4rem,6vw,4.2rem);font-weight:400;line-height:1.08;letter-spacing:-.04em;margin:0}
body.page-seo .intro{color:#c1b6d4;font-size:1rem;line-height:1.5;margin:15px 0 0;max-width:540px}
body.page-seo .orb-wrap{position:relative;width:min(430px,86vw);aspect-ratio:1;margin:4px auto 2px;display:grid;place-items:center;touch-action:none;user-select:none;cursor:grab;outline:none}
body.page-seo .orb-wrap:active{cursor:grabbing}
body.page-seo .orb-wrap:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:50%}
body.page-seo .orb-wrap:before{content:"";position:absolute;inset:16%;border-radius:50%;background:var(--glow);filter:blur(72px);opacity:.2}
body.page-seo .orb-image{width:100%;height:100%;object-fit:contain;position:relative;filter:drop-shadow(0 22px 36px #0009);transform-origin:50% 52%}
body.page-seo .orb-wrap.shaking .orb-image{animation:seo-shake .64s ease-in-out}
body.page-seo .orb-wrap.reveal .orb-image{animation:seo-reveal .6s ease-out}
@keyframes seo-shake{0%,100%{transform:translateX(0) rotate(0)}17%{transform:translate(-14px,5px) rotate(-7deg)}34%{transform:translate(16px,-5px) rotate(7deg)}51%{transform:translate(-12px,4px) rotate(-5deg)}68%{transform:translate(10px,-3px) rotate(4deg)}85%{transform:translate(-5px,2px) rotate(-2deg)}}
@keyframes seo-reveal{0%{filter:brightness(1.7) drop-shadow(0 0 60px var(--glow));transform:scale(1.05)}100%{filter:drop-shadow(0 22px 36px #0009);transform:scale(1)}}
body.page-seo .orb-logo{position:absolute;z-index:2;left:50%;top:42%;width:84%;height:70%;transform:translate(-50%,-50%) scale(.98);display:grid;place-items:center;mix-blend-mode:screen;opacity:.8;filter:blur(.4px) drop-shadow(0 0 15px var(--glow));pointer-events:none;transition:opacity .3s}
body.page-seo .orb-logo:before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(ellipse,#05031e8c 0%,#07051b58 42%,transparent 75%);z-index:-1}
body.page-seo .orb-logo:after{content:"";position:absolute;inset:12%;border-radius:50%;background:linear-gradient(145deg,#ffffff44,transparent 23%,transparent 74%,#ffffff1c);pointer-events:none}
body.page-seo .orb-wrap.has-answer .orb-logo{opacity:0}
body.page-seo .google-logo{font:bold clamp(9rem,28vw,12rem)/1 Arial,sans-serif;letter-spacing:-.08em;background:conic-gradient(#4285f4 0 26%,#34a853 26% 45%,#fbbc05 45% 63%,#ea4335 63% 79%,#4285f4 79%);-webkit-background-clip:text;background-clip:text;color:transparent}
body.page-seo .yandex-logo{font:bold clamp(9rem,28vw,12rem)/1 Arial,sans-serif;color:#fff3f3;text-shadow:0 0 30px #f22,0 0 55px #c00}
body.page-seo .discover-logo{display:grid;place-items:center}
body.page-seo .discover-star{font:400 clamp(8.5rem,26vw,11rem)/.75 Arial,sans-serif;background:conic-gradient(#4285f4 0 25%,#34a853 25% 50%,#fbbc05 50% 75%,#ea4335 75%);-webkit-background-clip:text;background-clip:text;color:transparent}
body.page-seo .discover-name{font:700 clamp(1.25rem,4vw,1.75rem)/1.1 Arial,sans-serif;color:#fff;text-shadow:0 0 18px #8dbdff}
body.page-seo .answer{position:absolute;z-index:3;left:50%;top:43%;transform:translate(-50%,-50%);width:71%;min-height:31%;padding:18px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(ellipse,#0a0822f2 0%,#100b2edd 47%,#130d2f8a 72%,transparent 100%);color:#fff;text-shadow:0 0 16px var(--glow),0 2px 8px #050315;font:600 clamp(1.08rem,3.6vw,1.5rem)/1.2 Georgia,serif;text-wrap:balance;overflow-wrap:anywhere;opacity:0;pointer-events:none;transition:opacity .35s}
body.page-seo .answer:not(:empty){opacity:1}
body.page-seo .orb-wrap.shaking .answer{opacity:0}
body.page-seo .controls{width:min(440px,100%);position:relative;z-index:1}
body.page-seo button{width:100%;border:0;border-radius:15px;background:linear-gradient(120deg,var(--button-a),var(--button-b));color:#130d26;padding:17px 22px;font:750 1rem Inter,ui-sans-serif,system-ui,sans-serif;cursor:pointer;box-shadow:0 12px 30px #0004;transition:transform .2s,filter .2s}
body.page-seo button:hover{filter:brightness(1.1);transform:translateY(-2px)}
body.page-seo button:active{transform:translateY(1px)}
body.page-seo button:focus-visible{outline:2px solid #fff;outline-offset:3px}
body.page-seo button:disabled{cursor:wait}
body.page-seo .hint{color:#aa9fbd;font-size:.85rem;line-height:1.5;margin:16px 0 0}
@media(max-width:600px){
body.page-seo main{justify-content:flex-start;padding:30px 20px 36px}
body.page-seo .orb-wrap{width:min(340px,85vw);margin:8px auto 1px}
body.page-seo .answer{font-size:clamp(1rem,5vw,1.3rem);padding:11px}
body.page-seo .google-logo,body.page-seo .yandex-logo{font-size:clamp(8rem,42vw,10rem)}
body.page-seo .discover-star{font-size:clamp(7.5rem,38vw,9rem)}
}
@media(prefers-reduced-motion:reduce){
body.page-seo *,body.page-seo *:before,body.page-seo *:after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* Shared footer */
.site-footer{position:relative;z-index:3;padding:24px 20px 32px;border-top:1px solid #ffffff1b;background:#090819;text-align:center;color:#b7aacd;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
.site-footer nav{display:flex;justify-content:center;align-items:center;gap:10px 22px;flex-wrap:wrap;max-width:850px;margin:auto}
.site-footer a{color:#d3c3ee;text-decoration:none;font-size:.94rem;line-height:1.5;padding:5px 2px;text-underline-offset:4px}
.site-footer a:hover,.site-footer a:focus-visible{text-decoration:underline;color:#fff}
.site-footer a[aria-current="page"]{color:#fff;font-weight:700}
@media(max-width:550px){.site-footer nav{gap:6px 16px}.site-footer a{font-size:.9rem}}
