/*
Theme Name: Here Is Nothing
Theme URI: https://example.com/
Author: OpenAI
Description: A cinematic, single-page horror experience with a blinking eye, floating phrases, atmospheric fog and subtle glitch effects.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: here-is-nothing
*/
:root{--void:#030304;--blood:#a20d18;--mist:rgba(220,220,220,.12);--text:#ded9d5}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--void);color:var(--text)}
body{font-family:Georgia,"Times New Roman",serif;overflow:hidden}
.hin-stage{position:relative;isolation:isolate;width:100%;height:100svh;min-height:520px;overflow:hidden;background:radial-gradient(ellipse at 50% 48%,#171012 0%,#080607 35%,#020203 78%);display:grid;place-items:center}
.hin-stage:before,.hin-stage:after{content:"";position:absolute;inset:-30%;pointer-events:none;z-index:-1}
.hin-stage:before{background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.018) 4px,transparent 5px);opacity:.35;animation:scan 12s linear infinite}
.hin-stage:after{background:radial-gradient(ellipse,transparent 30%,rgba(0,0,0,.45) 72%,#000 100%)}
.hin-grain{position:absolute;inset:-50%;opacity:.08;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");animation:grain .22s steps(2) infinite}
.hin-eye-wrap{position:relative;width:min(76vw,760px);height:min(43vw,390px);min-height:210px;display:grid;place-items:center;filter:drop-shadow(0 0 35px rgba(130,0,10,.22));z-index:2}
.hin-eye{position:relative;width:100%;height:100%;overflow:hidden;clip-path:ellipse(50% 48% at 50% 50%);background:radial-gradient(ellipse at 50% 50%,#b7a9a0 0%,#695c58 35%,#241719 70%,#090506 100%);box-shadow:inset 0 0 70px #000}
.hin-sclera{position:absolute;inset:8% 3%;border-radius:50%;background:radial-gradient(ellipse at 50% 45%,#e4d8ce 0%,#a99b92 42%,#574447 74%,#12090b 100%);box-shadow:inset 0 0 45px #120508}
.hin-iris{position:absolute;left:50%;top:50%;width:31%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:repeating-conic-gradient(from 5deg,#4b1a1e 0deg 5deg,#9a4a37 6deg 10deg,#271014 11deg 15deg),radial-gradient(circle,#080608 0 27%,#6c2527 29% 65%,#12090b 72%);box-shadow:0 0 25px #24070b,inset 0 0 18px #080203;transition:transform .12s ease-out}
.hin-iris:before{content:"";position:absolute;inset:28%;border-radius:50%;background:radial-gradient(circle,#000 0 56%,#12080a 70%,transparent 72%)}
.hin-iris:after{content:"";position:absolute;width:13%;height:13%;left:25%;top:19%;border-radius:50%;background:rgba(255,240,225,.72);filter:blur(2px)}
.hin-lid{position:absolute;z-index:4;left:-3%;width:106%;height:53%;background:linear-gradient(180deg,#10080a,#321519 75%,#0b0607);transition:transform .16s cubic-bezier(.7,0,.2,1);pointer-events:none}
.hin-lid-top{top:0;transform:translateY(-91%);border-radius:0 0 50% 50%}
.hin-lid-bottom{bottom:0;transform:translateY(91%);border-radius:50% 50% 0 0;background:linear-gradient(0deg,#080506,#251115 80%,#10080a)}
.hin-eye-wrap.blink .hin-lid-top{transform:translateY(0)}
.hin-eye-wrap.blink .hin-lid-bottom{transform:translateY(0)}
.hin-vein{position:absolute;inset:0;opacity:.28;background:repeating-radial-gradient(ellipse at 50% 50%,transparent 0 42px,rgba(92,17,25,.22) 43px 45px,transparent 46px 65px);mix-blend-mode:multiply}
.hin-title{position:absolute;z-index:5;top:8%;left:0;width:100%;text-align:center;font-family:Arial,sans-serif;font-size:clamp(10px,1.2vw,14px);letter-spacing:.65em;text-transform:uppercase;color:rgba(210,190,185,.45);padding-left:.65em}
.hin-center-copy{position:absolute;z-index:6;bottom:12%;left:0;width:100%;text-align:center;text-transform:uppercase;font-family:Arial,sans-serif;letter-spacing:.35em;font-size:clamp(11px,1.5vw,16px);color:#c9b9b6;text-shadow:0 0 14px rgba(150,0,15,.7);animation:softFlicker 6s infinite}
.hin-center-copy span{display:block;margin-top:12px;color:#75121b;letter-spacing:.5em;font-size:.72em}
.hin-float-layer{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.hin-float{position:absolute;white-space:nowrap;font-family:Arial,sans-serif;font-size:clamp(9px,1.2vw,14px);font-weight:300;letter-spacing:.35em;color:rgba(201,185,183,.34);text-transform:uppercase;text-shadow:0 0 12px rgba(125,0,12,.45);animation:drift var(--duration,22s) linear infinite;animation-delay:var(--delay,0s)}
.hin-float.red{color:rgba(150,22,31,.48)}
.hin-fog{position:absolute;inset:auto -20% -22%;height:48%;z-index:2;opacity:.32;filter:blur(34px);background:radial-gradient(ellipse at 20% 50%,rgba(140,130,130,.18),transparent 55%),radial-gradient(ellipse at 75% 40%,rgba(110,20,28,.16),transparent 50%);animation:fog 15s ease-in-out infinite alternate}
.hin-corner{position:absolute;z-index:8;bottom:22px;left:0;width:100%;text-align:center;font:9px/1.4 Arial,sans-serif;letter-spacing:.3em;color:rgba(190,175,175,.22);text-transform:uppercase}
.hin-stage.is-glitch{animation:glitch .22s steps(2) 1}
@keyframes blink{0%,92%,100%{opacity:1}94%,96%{opacity:.2}}
@keyframes drift{0%{transform:translate3d(12vw,8vh,0) rotate(-4deg);opacity:0}10%{opacity:.7}85%{opacity:.55}100%{transform:translate3d(-25vw,-18vh,0) rotate(5deg);opacity:0}}
@keyframes fog{from{transform:translateX(-5%) scale(1)}to{transform:translateX(8%) scale(1.12)}}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(2%,-1%)}50%{transform:translate(-1%,2%)}75%{transform:translate(1%,1%)}100%{transform:translate(-2%,-1%)}}
@keyframes scan{to{transform:translateY(20px)}}
@keyframes softFlicker{0%,18%,20%,22%,65%,67%,100%{opacity:.9}19%,21%,66%{opacity:.35}}
@keyframes glitch{0%{transform:translateX(0)}25%{transform:translateX(3px)}50%{transform:translateX(-4px)}75%{transform:translateX(2px)}100%{transform:translateX(0)}}
@media(max-width:600px){.hin-eye-wrap{width:94vw;height:58vw;min-height:190px}.hin-title{top:7%;letter-spacing:.38em}.hin-center-copy{bottom:15%;letter-spacing:.2em}.hin-float{letter-spacing:.2em}.hin-corner{bottom:14px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
