:root{
  --bg:#050608;--panel:rgba(255,255,255,.065);--panel2:rgba(255,255,255,.04);--line:rgba(255,255,255,.13);--text:#f7f8fb;--muted:#a8adb9;--soft:#717786;--accent:#ffffff;
  --radius:28px;--shadow:0 26px 80px rgba(0,0,0,.42);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 50% -10%,#151924 0,#090b10 28%,#050608 62%);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}button,input{font:inherit}.noise{position:fixed;inset:0;pointer-events:none;opacity:.055;z-index:99;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='.92' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E")}.cursor-glow{position:fixed;width:420px;height:420px;border-radius:50%;pointer-events:none;z-index:-1;background:radial-gradient(circle,rgba(150,175,255,.12),transparent 67%);transform:translate(-50%,-50%);filter:blur(10px)}
.shell{width:min(1440px,calc(100% - 48px));margin:auto}.glass{background:linear-gradient(140deg,rgba(255,255,255,.105),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),var(--shadow);backdrop-filter:blur(24px) saturate(155%);-webkit-backdrop-filter:blur(24px) saturate(155%)}
.nav-wrap{position:fixed;top:20px;left:0;right:0;z-index:80}.nav{width:min(1180px,calc(100% - 32px));margin:auto;border-radius:22px;padding:10px 12px 10px 18px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.12em;font-size:12px}.brand-orb{width:31px;height:31px;border-radius:11px;background:radial-gradient(circle at 30% 20%,#fff 0 8%,#a5b8ff 24%,#5c5e79 56%,#111 100%);box-shadow:inset 0 0 18px rgba(255,255,255,.3),0 0 30px rgba(130,150,255,.18)}.navlinks{display:flex;gap:8px}.navlinks a{padding:10px 14px;color:#c7cad3;font-size:13px;border-radius:13px;transition:.2s}.navlinks a:hover,.navlinks a.active{background:rgba(255,255,255,.085);color:white}.nav-social{padding:10px 14px;border-radius:14px;background:white;color:#0b0c0f;font-size:12px;font-weight:750}.menu{display:none;background:none;border:0;color:white;font-size:20px}
.hero{min-height:100vh;display:flex;align-items:flex-end;position:relative;padding:140px 0 54px}.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 22%,rgba(102,120,255,.18),transparent 28%),radial-gradient(circle at 18% 66%,rgba(95,213,255,.08),transparent 24%);pointer-events:none}.hero-grid{position:absolute;inset:0;opacity:.16;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,black,transparent 85%)}.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.12fr .88fr;align-items:end;gap:44px}.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:9px 13px;border-radius:999px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1);font-size:11px;letter-spacing:.14em;color:#c9ccd5;text-transform:uppercase}.dot{width:6px;height:6px;border-radius:50%;background:#8cffbe;box-shadow:0 0 14px #8cffbe}.hero h1{font-size:clamp(62px,8.6vw,144px);line-height:.83;letter-spacing:-.07em;margin:28px 0 26px;font-weight:850;max-width:980px}.hero h1 span{color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.42)}.hero-copy{max-width:650px;color:#b7bbc7;font-size:clamp(16px,1.6vw,22px);line-height:1.55}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.btn{padding:14px 19px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.055);color:white;font-size:13px;font-weight:700;display:inline-flex;gap:12px;align-items:center;transition:.22s}.btn:hover{transform:translateY(-2px);background:rgba(255,255,255,.1)}.btn.primary{background:#fff;color:#090a0c}.hero-feature{border-radius:32px;padding:13px;overflow:hidden;position:relative}.feature-cover{aspect-ratio:4/5;border-radius:23px;position:relative;overflow:hidden;background:radial-gradient(circle at 70% 20%,rgba(255,255,255,.26),transparent 18%),linear-gradient(150deg,#0c0d12 0,#20283d 47%,#6a4e66 100%)}.feature-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,5,8,.94),transparent 48%)}.feature-copy{position:absolute;left:30px;right:30px;bottom:29px;z-index:2}.feature-copy small{font-size:10px;letter-spacing:.16em;color:#c6cad6}.feature-copy h3{font-size:clamp(31px,4vw,58px);line-height:.93;letter-spacing:-.045em;margin:10px 0 13px}.feature-copy p{color:#c6cad3;margin:0;font-size:13px}.glass-streak{position:absolute;left:-30%;top:-18%;width:70%;height:160%;transform:rotate(20deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);filter:blur(2px);transition:.7s}.hero-feature:hover .glass-streak{left:110%}
.section{padding:110px 0}.section-head{display:flex;justify-content:space-between;gap:40px;align-items:flex-end;margin-bottom:38px}.kicker{font-size:10px;letter-spacing:.17em;color:#9ea4b1;text-transform:uppercase}.section h2{font-size:clamp(42px,6vw,84px);line-height:.95;letter-spacing:-.05em;margin:10px 0 0}.section-head p{max-width:480px;color:#989daa;line-height:1.65;font-size:14px}
.project-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}.project-card{grid-column:span 4;border-radius:26px;padding:11px;position:relative;overflow:hidden;min-height:430px;transition:.28s transform,.28s border-color}.project-card:nth-child(1),.project-card:nth-child(6){grid-column:span 8}.project-card:hover{transform:translateY(-7px);border-color:rgba(255,255,255,.25)}.project-art{position:absolute;inset:11px;border-radius:19px;overflow:hidden;background:linear-gradient(145deg,#10131b,#262d41 54%,#4a4150)}.project-art::before{content:"";position:absolute;width:60%;height:60%;right:-10%;top:-12%;border-radius:50%;background:rgba(255,255,255,.15);filter:blur(58px)}.project-art::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.94) 3%,rgba(0,0,0,.15) 62%,rgba(255,255,255,.03))}.project-card[data-tone="ocean"] .project-art{background:linear-gradient(145deg,#08141e,#123b4c 55%,#766340)}.project-card[data-tone="sunset"] .project-art{background:linear-gradient(145deg,#16111a,#763548 58%,#e39a49)}.project-card[data-tone="ember"] .project-art{background:linear-gradient(145deg,#100c0a,#38251d 52%,#85492e)}.project-card[data-tone="red"] .project-art{background:linear-gradient(145deg,#11080a,#4e171c 58%,#9b342f)}.project-card[data-tone="midnight"] .project-art{background:linear-gradient(145deg,#050711,#101d3a 58%,#344f77)}.project-card[data-tone="gold"] .project-art{background:linear-gradient(145deg,#11100c,#51442b 58%,#ba9553)}.project-card[data-tone="magenta"] .project-art{background:linear-gradient(145deg,#100916,#3e1b53 56%,#a83f91)}.project-card[data-tone="crimson"] .project-art{background:linear-gradient(145deg,#0b0a0d,#391219 53%,#bf283c)}.project-card[data-tone="toxic"] .project-art{background:linear-gradient(145deg,#090d08,#1c3c28 56%,#719655)}.project-card[data-tone="sand"] .project-art,.project-card[data-tone="desert"] .project-art{background:linear-gradient(145deg,#17120d,#674c2f 55%,#bb8b50)}.project-card[data-tone="forest"] .project-art{background:linear-gradient(145deg,#070b08,#152c22 55%,#49654f)}.project-meta{position:absolute;z-index:3;left:29px;right:29px;bottom:29px}.project-meta-top{display:flex;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#c0c4ce}.project-meta h3{font-size:clamp(27px,2.7vw,48px);line-height:.98;letter-spacing:-.045em;margin:10px 0 6px}.project-arrow{position:absolute;right:26px;top:26px;width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.13);backdrop-filter:blur(12px);z-index:4;transition:.25s}.project-card:hover .project-arrow{transform:translate(2px,-2px);background:white;color:#0a0b0d}
.about-panel{border-radius:32px;padding:48px;display:grid;grid-template-columns:.8fr 1.2fr;gap:52px}.about-panel h3{font-size:clamp(42px,5vw,78px);letter-spacing:-.055em;line-height:.92;margin:8px 0}.about-panel p{font-size:20px;line-height:1.6;color:#bcc1cc;margin-top:8px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px}.metric{border-radius:20px;padding:22px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09)}.metric b{display:block;font-size:28px}.metric span{font-size:11px;color:#8f95a2}
.archive-hero{padding:155px 0 45px}.archive-hero h1{font-size:clamp(58px,10vw,150px);line-height:.85;letter-spacing:-.07em;margin:20px 0 24px}.archive-hero p{max-width:720px;color:#aeb3c0;font-size:18px;line-height:1.6}.archive-tools{position:sticky;top:92px;z-index:20;margin:25px 0 34px;border-radius:22px;padding:10px;display:flex;gap:10px;align-items:center}.search{flex:1;position:relative}.search input{width:100%;padding:15px 16px;border:0;outline:0;color:white;border-radius:15px;background:rgba(255,255,255,.055)}.filters{display:flex;gap:7px;flex-wrap:wrap}.filter{border:0;color:#aeb3bf;background:rgba(255,255,255,.045);padding:11px 13px;border-radius:12px;cursor:pointer}.filter.active,.filter:hover{background:white;color:#0a0b0d}
.project-page-hero{min-height:78vh;display:flex;align-items:flex-end;padding:160px 0 48px;position:relative}.project-backdrop{position:absolute;inset:0;overflow:hidden}.project-backdrop::before{content:"";position:absolute;inset:-10%;background:radial-gradient(circle at 72% 22%,rgba(135,160,255,.32),transparent 28%),linear-gradient(145deg,#080a0f,#252a3b 55%,#5c465a);filter:saturate(1.1)}.project-backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,#050608 4%,rgba(5,6,8,.62) 42%,rgba(5,6,8,.2))}.project-title{position:relative;z-index:2}.project-title .crumb{font-size:11px;color:#aab0bc;letter-spacing:.12em;text-transform:uppercase}.project-title h1{font-size:clamp(60px,10vw,152px);line-height:.82;letter-spacing:-.075em;margin:22px 0 28px;max-width:1200px}.project-title-footer{display:flex;justify-content:space-between;gap:30px;align-items:flex-end}.project-title p{max-width:650px;color:#b9bec9;line-height:1.6}.project-data{display:flex;gap:26px}.project-data div{min-width:110px}.project-data small{display:block;color:#757b88;font-size:9px;letter-spacing:.14em;text-transform:uppercase}.project-data b{display:block;margin-top:7px;font-size:13px}.gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}.gallery-shot{grid-column:span 6;aspect-ratio:16/10;border-radius:24px;overflow:hidden;position:relative;cursor:pointer;border:1px solid rgba(255,255,255,.09);background:linear-gradient(145deg,#10131a,#323849)}.gallery-shot:nth-child(3n+1){grid-column:span 12;aspect-ratio:21/9}.gallery-shot::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 25%,rgba(255,255,255,.18),transparent 17%),linear-gradient(160deg,transparent 30%,rgba(0,0,0,.55))}.gallery-shot::after{content:"VIEW";position:absolute;right:17px;bottom:17px;padding:9px 11px;border-radius:12px;font-size:9px;letter-spacing:.13em;background:rgba(255,255,255,.1);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12)}.gallery-note{margin-bottom:24px;color:#838997;font-size:12px}.lightbox{position:fixed;inset:0;background:rgba(3,4,6,.78);backdrop-filter:blur(25px);z-index:100;display:none;place-items:center;padding:34px}.lightbox.show{display:grid}.lightbox-frame{width:min(1260px,94vw);aspect-ratio:16/10;border-radius:28px;background:linear-gradient(145deg,#10131a,#323849);border:1px solid rgba(255,255,255,.15);box-shadow:0 40px 120px rgba(0,0,0,.65);position:relative}.close{position:absolute;right:18px;top:18px;width:44px;height:44px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:white;cursor:pointer;backdrop-filter:blur(12px)}
footer{margin-top:80px;padding:26px 0 44px;border-top:1px solid rgba(255,255,255,.08);color:#7e8490;font-size:11px}.footer-row{display:flex;justify-content:space-between;gap:20px;align-items:center}
.reveal{opacity:0;transform:translateY(22px);transition:.7s cubic-bezier(.2,.75,.2,1)}.reveal.in{opacity:1;transform:none}
@media(max-width:980px){.hero-inner{grid-template-columns:1fr}.hero-feature{max-width:680px}.navlinks{display:none}.menu{display:block}.project-card,.project-card:nth-child(1),.project-card:nth-child(6){grid-column:span 6}.about-panel{grid-template-columns:1fr}.project-title-footer{align-items:flex-start;flex-direction:column}.archive-tools{align-items:stretch;flex-direction:column}.filters{overflow-x:auto;flex-wrap:nowrap}.filter{white-space:nowrap}}
@media(max-width:650px){.shell{width:min(100% - 24px,1440px)}.nav-social{display:none}.hero{padding-top:120px;min-height:auto}.hero h1{font-size:58px}.section{padding:78px 0}.section-head{flex-direction:column;align-items:flex-start}.project-card,.project-card:nth-child(1),.project-card:nth-child(6){grid-column:span 12;min-height:390px}.about-panel{padding:26px}.metrics{grid-template-columns:1fr}.archive-hero h1{font-size:64px}.project-page-hero{min-height:72vh}.project-title h1{font-size:58px}.project-data{flex-wrap:wrap}.gallery-shot,.gallery-shot:nth-child(3n+1){grid-column:span 12;aspect-ratio:4/3}.footer-row{flex-direction:column;align-items:flex-start}}

/* V3 — archive/gallery fixes */
.brand-word{font-size:20px!important;letter-spacing:-.045em!important;text-transform:lowercase;font-weight:900!important;padding:8px 10px;min-width:72px;justify-content:center}
.project-card{min-height:470px}.project-art{background-size:cover;background-position:center}.project-cover-label{position:absolute;left:20px;right:20px;top:20px;z-index:2;display:flex;justify-content:space-between;gap:10px;color:rgba(255,255,255,.8);font-size:10px;text-transform:uppercase;letter-spacing:.12em}.project-meta{bottom:28px}.project-meta h3{font-size:clamp(25px,2.1vw,38px);max-width:90%}.project-meta p{margin:8px 0 0;color:#b6bbc6;font-size:12px}
.gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:10px}.gallery-shot{grid-column:span 6;padding:0;border:0;border-radius:18px;overflow:hidden;aspect-ratio:16/10;background:#101217;cursor:zoom-in;position:relative;box-shadow:0 18px 50px rgba(0,0,0,.22);transition:transform .25s ease,filter .25s ease}.gallery-shot:nth-child(5n+1){grid-column:span 12;aspect-ratio:21/9}.gallery-shot:nth-child(5n+4){grid-column:span 5}.gallery-shot:nth-child(5n+5){grid-column:span 7}.gallery-shot:hover{transform:translateY(-3px);filter:brightness(1.05)}.gallery-shot img{width:100%;height:100%;object-fit:cover;display:block}.gallery-shot.missing{cursor:default;border:1px dashed rgba(255,255,255,.16);background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012));display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;color:#737987}.missing-no{font-size:30px;font-weight:800;color:#a0a5b0}.gallery-shot.missing:hover{transform:none;filter:none}.no-scroll{overflow:hidden}
.lightbox{position:fixed;inset:0;z-index:150;background:rgba(2,3,5,.88);backdrop-filter:blur(26px) saturate(130%);display:flex;align-items:center;justify-content:center;padding:34px;opacity:0;pointer-events:none;transition:opacity .22s}.lightbox.show{opacity:1;pointer-events:auto}.lightbox-frame{margin:0;max-width:min(1450px,86vw);max-height:90vh;border-radius:24px;padding:10px;position:relative;display:flex;flex-direction:column}.lightbox-frame img{max-width:100%;max-height:82vh;object-fit:contain;border-radius:16px;display:block}.lightbox-frame figcaption{text-align:center;color:#aeb3bd;font-size:11px;letter-spacing:.16em;padding:12px 0 3px}.close{position:fixed;right:28px;top:26px;z-index:3;width:46px;height:46px;border-radius:16px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;backdrop-filter:blur(18px)}.lightbox-nav{position:fixed;top:50%;transform:translateY(-50%);z-index:3;width:54px;height:54px;border-radius:18px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:white;font-size:22px;cursor:pointer;backdrop-filter:blur(18px)}.lightbox-prev{left:24px}.lightbox-next{right:24px}
@media(max-width:780px){.brand-word{font-size:18px!important}.gallery-shot,.gallery-shot:nth-child(5n+1),.gallery-shot:nth-child(5n+4),.gallery-shot:nth-child(5n+5){grid-column:span 12;aspect-ratio:4/3}.lightbox{padding:12px}.lightbox-nav{top:auto;bottom:22px;transform:none}.lightbox-prev{left:20px}.lightbox-next{right:20px}.close{right:16px;top:16px}.lightbox-frame{max-width:96vw}}

/* V4 brand mark */
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;color:#f5f7ff;font-weight:800;letter-spacing:.045em;white-space:nowrap}
.brand-logo{width:34px;height:34px;display:block;filter:drop-shadow(0 6px 13px rgba(0,0,0,.28)) drop-shadow(0 0 10px rgba(121,92,255,.16));transition:transform .3s ease,filter .3s ease}
.brand span{font-size:13px}
.brand:hover .brand-logo{transform:translateY(-1px) scale(1.055) rotate(-1.5deg);filter:drop-shadow(0 8px 15px rgba(0,0,0,.32)) drop-shadow(0 0 14px rgba(72,211,174,.22)) drop-shadow(0 0 15px rgba(121,92,255,.20))}
@media (max-width:720px){.brand span{display:none}.brand-logo{width:36px;height:36px}}


/* V5 — Archive browser / A-Z index */
.archive-browser{padding:10px 0 120px}.archive-layout{display:grid;grid-template-columns:285px minmax(0,1fr);gap:22px;align-items:start}.archive-sidebar{position:sticky;top:108px;border-radius:26px;padding:20px;max-height:calc(100vh - 132px);overflow:hidden;display:flex;flex-direction:column}.sidebar-kicker{font-size:10px;letter-spacing:.18em;color:#858b98;font-weight:800}.sidebar-search{margin-top:14px}.sidebar-search input,.archive-tools .search input{width:100%;border:1px solid rgba(255,255,255,.11);background:rgba(0,0,0,.22);color:#fff;border-radius:14px;padding:12px 14px;outline:0}.sidebar-search input:focus,.archive-tools .search input:focus{border-color:rgba(255,255,255,.28);box-shadow:0 0 0 4px rgba(255,255,255,.035)}.alphabet-row{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 12px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08)}.alpha{border:0;background:transparent;color:#737987;font-size:10px;font-weight:800;padding:5px 6px;border-radius:8px;cursor:pointer}.alpha:hover,.alpha.active{color:#fff;background:rgba(255,255,255,.08)}.game-index{overflow:auto;padding-right:5px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.16) transparent}.game-index-link{display:flex;justify-content:space-between;gap:10px;padding:9px 8px;border-radius:10px;color:#9096a4;font-size:11px;line-height:1.3;letter-spacing:.035em;transition:.18s}.game-index-link:hover{background:rgba(255,255,255,.07);color:#fff;transform:translateX(2px)}.game-index-link small{font-size:9px;color:#626875;flex:none}.archive-main{min-width:0}.archive-tools{border-radius:26px;padding:18px;margin-bottom:18px}.archive-tools-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:14px}.archive-tools-title{font-size:22px!important;letter-spacing:-.025em!important;margin:6px 0 0!important}.clear-filter{border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.04);color:#b8bdc8;border-radius:12px;padding:9px 12px;font-size:11px;cursor:pointer}.clear-filter:hover{background:rgba(255,255,255,.09);color:#fff}.photo-filters{margin-top:13px;display:flex;gap:8px;flex-wrap:wrap}.photo-filters .filter{border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.035);color:#9da3b0;border-radius:999px;padding:9px 12px;font-size:11px;cursor:pointer;transition:.18s}.photo-filters .filter:hover{color:#fff;border-color:rgba(255,255,255,.18)}.photo-filters .filter.active{background:#f4f6fb;color:#08090c;border-color:#fff;box-shadow:0 8px 22px rgba(255,255,255,.08)}.result-row{margin-top:14px;padding-top:13px;border-top:1px solid rgba(255,255,255,.07);display:flex;justify-content:space-between;color:#676d79;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.archive-grid-v5{grid-template-columns:repeat(12,1fr)}.archive-grid-v5 .project-card{grid-column:span 6;min-height:390px}.archive-grid-v5 .project-card:nth-child(1),.archive-grid-v5 .project-card:nth-child(6){grid-column:span 6}.empty-state{display:none;border-radius:22px;padding:28px;text-align:center;color:#8f95a2;margin-top:14px}.empty-state.show{display:flex;flex-direction:column;align-items:center;gap:12px}.empty-state button{border:0;border-radius:12px;background:#fff;color:#08090c;padding:10px 14px;font-size:11px;font-weight:800;cursor:pointer}
@media(max-width:980px){.archive-layout{grid-template-columns:1fr}.archive-sidebar{position:relative;top:auto;max-height:none}.game-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-height:300px}.archive-grid-v5 .project-card{grid-column:span 6}}
@media(max-width:640px){.archive-browser{padding-bottom:80px}.archive-sidebar{padding:16px}.game-index{grid-template-columns:1fr;max-height:260px}.archive-tools{padding:15px}.archive-tools-head{align-items:flex-start}.archive-tools-title{font-size:18px!important}.archive-grid-v5 .project-card{grid-column:span 12!important;min-height:340px}.result-row{gap:12px;flex-wrap:wrap}}

/* V6 — archive filter panel layout fix */
.archive-main .archive-tools{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:0;
  align-items:stretch;
  position:sticky;
  top:92px;
  z-index:20;
  width:100%;
  box-sizing:border-box;
}
.archive-main .archive-tools-head{
  width:100%;
  min-width:0;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin:0 0 14px;
}
.archive-main .archive-tools-head > div{
  min-width:0;
}
.archive-main .archive-tools .search{
  display:block;
  width:100%;
  min-width:0;
  flex:none;
  margin:0;
}
.archive-main .archive-tools .search input{
  display:block;
  width:100%;
  min-width:0;
  box-sizing:border-box;
}
.archive-main .photo-filters{
  width:100%;
  min-width:0;
  margin:13px 0 0;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  overflow:visible;
}
.archive-main .photo-filters .filter{
  flex:0 0 auto;
  white-space:nowrap;
}
.archive-main .result-row{
  width:100%;
  box-sizing:border-box;
  margin:14px 0 0;
}

@media (max-width:980px){
  .archive-main .archive-tools{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-items:stretch;
  }
  .archive-main .photo-filters{
    overflow-x:auto;
    overflow-y:hidden;
    flex-wrap:nowrap;
    padding-bottom:4px;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.14) transparent;
  }
}

@media (max-width:640px){
  .archive-main .archive-tools-head{
    align-items:flex-start;
    gap:14px;
  }
  .archive-main .clear-filter{
    flex:none;
  }
  .archive-main .result-row{
    align-items:center;
  }
}

/* V7 — Filter Collection stays in page flow (not sticky while scrolling) */
.archive-main .archive-tools{
  position:relative;
  top:auto;
  z-index:2;
}

/* =========================================================
   V8 — NEON LIQUID GLASS / mockup-matched lighting system
   ========================================================= */
:root{
  --neon-violet:#7b4dff;
  --neon-purple:#a35cff;
  --neon-cyan:#43ddff;
  --neon-teal:#18e6c2;
  --neon-blue:#5c8dff;
  --deep:#03060b;
}
body{
  background:
    radial-gradient(900px 520px at 18% 3%,rgba(81,54,255,.12),transparent 62%),
    radial-gradient(800px 520px at 86% 5%,rgba(0,235,204,.09),transparent 60%),
    radial-gradient(620px 500px at 54% 45%,rgba(65,80,255,.055),transparent 72%),
    linear-gradient(180deg,#04070c 0%,#02050a 52%,#03060a 100%);
}
body::before{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:
    linear-gradient(rgba(72,102,158,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(72,102,158,.035) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.85),transparent 82%);
}
.cursor-glow{
  width:560px;height:560px;z-index:-2;filter:blur(18px);opacity:.78;
  background:
    radial-gradient(circle at 42% 44%,rgba(123,77,255,.15),transparent 28%),
    radial-gradient(circle at 58% 52%,rgba(24,230,194,.11),transparent 35%),
    radial-gradient(circle,rgba(67,221,255,.06),transparent 68%);
}
.glass{
  background:
    linear-gradient(145deg,rgba(17,28,48,.78),rgba(6,11,20,.69) 54%,rgba(6,14,22,.76));
  border:1px solid rgba(116,163,255,.34);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -1px 0 rgba(52,230,211,.05),
    0 26px 70px rgba(0,0,0,.44),
    0 0 0 1px rgba(81,57,166,.09),
    0 0 34px rgba(94,70,255,.055);
  backdrop-filter:blur(26px) saturate(165%);
  -webkit-backdrop-filter:blur(26px) saturate(165%);
}
.neon-surface{isolation:isolate;--mx:50%;--my:50%}
.neon-surface::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1;
  background:
    radial-gradient(300px circle at var(--mx) var(--my),rgba(82,220,255,.12),transparent 44%),
    radial-gradient(420px circle at calc(var(--mx) - 100px) calc(var(--my) + 60px),rgba(125,71,255,.105),transparent 47%);
  opacity:0;transition:opacity .28s ease;
}
.neon-surface:hover::before{opacity:1}
/* Keep the neon layer visual-only. Do NOT change the positioning of card children. */
.neon-surface::before{z-index:5;mix-blend-mode:screen}
.neon-surface > *{z-index:auto}
.project-card > .project-art{position:absolute;inset:8px;z-index:0}
.project-card > .project-meta{position:absolute;z-index:3}
.project-card > .project-arrow{position:absolute;right:26px;top:26px;z-index:4}
.project-card > .project-art .project-cover-label{position:absolute;z-index:2}

/* navbar from the reference mockup */
.nav-wrap{top:14px}.nav{
  width:min(1440px,calc(100% - 36px));min-height:76px;border-radius:25px;padding:10px 16px 10px 20px;
  border-color:rgba(65,226,241,.62);
  background:linear-gradient(105deg,rgba(13,23,43,.86),rgba(10,14,30,.82) 45%,rgba(3,30,31,.8));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 16px 54px rgba(0,0,0,.38),
    -24px 0 45px rgba(94,56,255,.12),
    24px 0 52px rgba(0,235,207,.12),
    0 0 16px rgba(62,206,255,.09);
  position:relative;overflow:hidden;
}
.nav::after{
  content:"";position:absolute;left:4%;right:4%;bottom:-2px;height:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--neon-violet),var(--neon-cyan),var(--neon-teal),transparent);
  filter:blur(.3px);opacity:.78;box-shadow:0 0 14px var(--neon-violet),0 0 16px var(--neon-teal);
}
.brand{gap:14px}.brand-logo{
  width:45px;height:45px;
  filter:drop-shadow(0 0 7px rgba(115,74,255,.75)) drop-shadow(0 0 13px rgba(35,231,203,.48));
}
.brand:hover .brand-logo{filter:drop-shadow(0 0 9px rgba(129,80,255,.9)) drop-shadow(0 0 18px rgba(35,231,203,.72))}
.brand span{font-size:15px;line-height:1.05;text-shadow:0 0 18px rgba(255,255,255,.12)}
.brand span::after{content:"VIRTUAL PHOTOGRAPHY";display:block;margin-top:7px;font-size:8px;font-weight:600;letter-spacing:.29em;color:#8894b2;text-shadow:0 0 12px rgba(90,103,255,.28)}
.navlinks{gap:9px;align-items:center}.navlinks a{position:relative;padding:12px 17px;border:1px solid transparent;color:#c4cbe0;border-radius:18px}
.navlinks a:hover{color:white;background:rgba(73,100,167,.11);border-color:rgba(106,149,255,.14);box-shadow:inset 0 0 22px rgba(81,91,255,.08)}
.navlinks a.active{color:#fff;background:linear-gradient(145deg,rgba(85,95,178,.26),rgba(56,59,110,.20));border-color:rgba(116,134,225,.18);box-shadow:inset 0 0 24px rgba(88,75,255,.10),0 0 22px rgba(98,62,255,.08)}
.navlinks a.active::before{content:"";width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:10px;background:#69e9ff;box-shadow:0 0 9px #5beaff,0 0 17px #8255ff}
.nav-social{border:1px solid rgba(57,218,224,.22);background:linear-gradient(145deg,rgba(24,68,77,.75),rgba(15,34,52,.82));color:#f5fbff;box-shadow:inset 0 0 20px rgba(31,228,211,.06),0 0 20px rgba(25,205,214,.05);padding:12px 17px;border-radius:18px}
.nav-social:hover{border-color:rgba(58,233,225,.44);box-shadow:0 0 24px rgba(18,221,208,.13)}

/* archive hero toned down so neon UI becomes focal point */
.archive-hero{padding-bottom:30px}.archive-hero::after{content:"";position:absolute;inset:90px 0 auto;height:360px;z-index:-1;pointer-events:none;background:radial-gradient(circle at 52% 20%,rgba(95,64,255,.09),transparent 48%)}

/* sidebar */
.archive-sidebar{
  border-color:rgba(95,130,240,.55);
  background:linear-gradient(160deg,rgba(17,30,54,.82),rgba(7,14,26,.76));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 24px 70px rgba(0,0,0,.42),0 0 24px rgba(86,61,255,.075);
}
.sidebar-kicker{color:#97a9cc}.sidebar-search input,.archive-tools .search input{
  border-color:rgba(99,126,212,.28);background:rgba(2,8,19,.55);color:#eaf3ff;
  box-shadow:inset 0 0 24px rgba(23,40,88,.16);
}
.sidebar-search input::placeholder,.archive-tools .search input::placeholder{color:#74809a}
.sidebar-search input:focus,.archive-tools .search input:focus{border-color:rgba(70,224,242,.52);box-shadow:0 0 0 3px rgba(38,209,229,.055),0 0 26px rgba(62,113,255,.08),inset 0 0 24px rgba(19,73,95,.16)}
.alpha{color:#8d9bbb}.alpha:hover,.alpha.active{color:#fff;background:linear-gradient(145deg,rgba(63,124,193,.5),rgba(49,73,123,.42));box-shadow:0 0 14px rgba(74,182,255,.16)}
.game-index-link{color:#b1bdd2}.game-index-link small{color:#6680a4}.game-index-link:hover{background:linear-gradient(90deg,rgba(76,61,166,.17),rgba(23,168,165,.07));box-shadow:inset 2px 0 0 rgba(83,220,255,.42);text-shadow:0 0 12px rgba(124,168,255,.18)}

/* filter collection */
.archive-main .archive-tools{
  border-color:rgba(105,79,255,.62);
  background:
    radial-gradient(620px 250px at 55% 0%,rgba(101,68,255,.16),transparent 58%),
    radial-gradient(520px 260px at 92% 10%,rgba(0,223,195,.11),transparent 64%),
    linear-gradient(145deg,rgba(15,24,46,.89),rgba(7,13,26,.82));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 26px 68px rgba(0,0,0,.42),0 0 24px rgba(109,65,255,.10);
}
.archive-tools-title{color:#f3f6ff;text-shadow:0 0 16px rgba(112,99,255,.12)}
.clear-filter{border-color:rgba(38,208,211,.2);background:rgba(13,51,65,.36);color:#dcecff;box-shadow:inset 0 0 17px rgba(27,200,194,.035)}
.clear-filter:hover{border-color:rgba(48,228,220,.42);background:rgba(21,73,82,.5);box-shadow:0 0 19px rgba(25,212,205,.10)}
.photo-filters .filter{border-color:rgba(90,113,182,.23);background:linear-gradient(145deg,rgba(31,40,78,.46),rgba(12,20,39,.68));color:#b6c0d7;box-shadow:inset 0 0 12px rgba(88,69,255,.03)}
.photo-filters .filter:hover{border-color:rgba(103,100,255,.45);background:rgba(71,63,145,.22);box-shadow:0 0 17px rgba(93,64,255,.10);transform:translateY(-1px)}
.photo-filters .filter.active{background:#f6f7ff;color:#080b12;border-color:#fff;box-shadow:0 0 17px rgba(255,255,255,.18),0 0 28px rgba(112,72,255,.12)}
.result-row{border-color:rgba(102,118,171,.14);color:#7485a5}

/* project cards */
.project-card{
  border-color:rgba(89,128,211,.44);
  background:linear-gradient(145deg,rgba(15,23,40,.72),rgba(5,10,18,.82));
  box-shadow:0 22px 58px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08),0 0 15px rgba(77,60,255,.035);
}
.project-card:hover{transform:translateY(-6px);border-color:rgba(100,139,255,.78);box-shadow:0 28px 72px rgba(0,0,0,.52),0 0 28px rgba(81,67,255,.12),0 0 20px rgba(20,221,209,.06)}
.project-card .project-art{inset:8px;border-radius:20px}
.project-card .project-art::before{background:radial-gradient(circle,rgba(105,92,255,.18),transparent 64%)}
.project-card .project-art::after{background:linear-gradient(to top,rgba(2,6,12,.97) 0%,rgba(3,7,13,.40) 45%,rgba(0,0,0,.06) 72%)}
.project-cover-label{color:#e9f3ff;font-weight:700;text-shadow:0 1px 12px rgba(0,0,0,.8)}
.project-meta h3{color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.7)}
.project-meta p{color:#aebed7}.project-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.project-tags span{padding:6px 10px;border-radius:999px;border:1px solid rgba(120,145,225,.19);background:rgba(22,37,65,.72);color:#dbe7fb;font-size:9px;line-height:1;box-shadow:inset 0 0 12px rgba(63,102,255,.04)}
.project-arrow{border-color:rgba(107,145,220,.35);background:linear-gradient(145deg,rgba(35,55,86,.78),rgba(12,20,36,.82));box-shadow:inset 0 0 18px rgba(76,108,255,.06),0 0 18px rgba(44,205,255,.06)}
.project-card:hover .project-arrow{background:linear-gradient(145deg,#eaf7ff,#cfdcff);color:#09101d;box-shadow:0 0 22px rgba(85,199,255,.30)}

/* three-column archive grid like the reference, where space allows */
@media(min-width:1240px){
  .archive-layout{grid-template-columns:300px minmax(0,1fr);gap:26px}
  .archive-grid-v5 .project-card,.archive-grid-v5 .project-card:nth-child(1),.archive-grid-v5 .project-card:nth-child(6){grid-column:span 4;min-height:355px}
  .archive-grid-v5 .project-meta h3{font-size:clamp(23px,1.65vw,34px)}
}

/* home / about / project gallery get the same lighting language */
.hero::before{background:radial-gradient(circle at 72% 22%,rgba(105,68,255,.19),transparent 30%),radial-gradient(circle at 18% 66%,rgba(20,226,203,.085),transparent 26%)}
.eyebrow{border-color:rgba(72,207,224,.2);background:rgba(15,38,57,.37);box-shadow:inset 0 0 20px rgba(33,211,202,.035)}
.dot{background:#65f4dc;box-shadow:0 0 8px #65f4dc,0 0 18px rgba(98,81,255,.8)}
.btn{border-color:rgba(94,124,206,.25);background:linear-gradient(145deg,rgba(22,34,62,.65),rgba(8,15,28,.72));box-shadow:inset 0 0 17px rgba(77,63,255,.035)}
.btn:hover{border-color:rgba(78,216,230,.36);box-shadow:0 0 22px rgba(45,210,221,.08),0 0 24px rgba(102,70,255,.07)}
.btn.primary{background:linear-gradient(135deg,#f8fbff,#dce9ff);color:#07101d;box-shadow:0 0 20px rgba(96,162,255,.16)}
.about-panel,.hero-feature{border-color:rgba(96,122,220,.34)}
.gallery-shot{border:1px solid rgba(91,126,219,.26);box-shadow:0 18px 50px rgba(0,0,0,.32),0 0 16px rgba(95,71,255,.035)}
.gallery-shot:hover{border-color:rgba(75,222,225,.44);box-shadow:0 24px 62px rgba(0,0,0,.42),0 0 24px rgba(40,219,210,.08),0 0 18px rgba(105,68,255,.08)}
.lightbox{background:rgba(0,3,9,.90)}
.lightbox-frame{border-color:rgba(97,121,230,.44);box-shadow:0 0 55px rgba(99,67,255,.12),0 0 48px rgba(20,218,205,.06)}

@media(max-width:720px){
  .nav{min-height:62px;padding:8px 11px}.brand-logo{width:40px;height:40px}.brand span::after{display:none}
  .navlinks a.active::before{display:none}
}
@media(prefers-reduced-motion:reduce){.neon-surface::before{display:none}.project-card,.filter,.brand-logo{transition:none!important}}


/* V9 — restore original project-card geometry after neon pass */
.archive-grid-v5 .project-card{position:relative;overflow:hidden}
.archive-grid-v5 .project-card .project-art{position:absolute!important;inset:8px!important;border-radius:20px;overflow:hidden;z-index:0!important}
.archive-grid-v5 .project-card .project-meta{position:absolute!important;left:29px;right:29px;bottom:29px;z-index:3!important}
.archive-grid-v5 .project-card .project-arrow{position:absolute!important;right:26px!important;top:26px!important;left:auto!important;bottom:auto!important;z-index:4!important}
.archive-grid-v5 .project-card .project-cover-label{position:absolute!important;left:20px;right:20px;top:20px;z-index:2!important}
.archive-grid-v5 .project-card::before{pointer-events:none}

/* V10 — project card top row fix: date left, action button right */
.archive-grid-v5 .project-card .project-cover-label{
  position:absolute!important;
  top:20px!important;
  left:20px!important;
  right:86px!important;
  z-index:3!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  min-height:46px;
  pointer-events:none;
}
.archive-grid-v5 .project-card .project-cover-label > span{
  display:none!important;
}
.archive-grid-v5 .project-card .project-cover-label > small{
  display:block!important;
  margin:0!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:rgba(255,255,255,.86);
  font-size:10px;
  font-weight:800;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.archive-grid-v5 .project-card .project-arrow{
  position:absolute!important;
  top:20px!important;
  right:20px!important;
  left:auto!important;
  bottom:auto!important;
  width:46px!important;
  height:46px!important;
  flex:0 0 46px!important;
  margin:0!important;
  z-index:5!important;
  display:grid!important;
  place-items:center!important;
  transform:none;
}
.archive-grid-v5 .project-card:hover .project-arrow{
  transform:translate(2px,-2px)!important;
}
@media(max-width:640px){
  .archive-grid-v5 .project-card .project-cover-label{top:16px!important;left:16px!important;right:76px!important;min-height:42px}
  .archive-grid-v5 .project-card .project-arrow{top:16px!important;right:16px!important;width:42px!important;height:42px!important;flex-basis:42px!important}
}