:root{--bg:#06060a;--surface:#ffffff09;--border:#ffffff17;--text:#f4f4f8;--muted:#9a9aab;--accent:#7c6cff;--accent-2:#00d4c4;--accent-3:#ff5db1}*{box-sizing:border-box;margin:0;padding:0}html{overflow-x:hidden}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}main{z-index:1;max-width:1100px;margin:0 auto;padding:8rem 1.5rem 4rem;position:relative}.constellation{z-index:0;pointer-events:none;position:fixed;inset:0}.bg-orb{filter:blur(130px);opacity:.4;z-index:-1;pointer-events:none;will-change:transform;border-radius:50%;position:fixed}.orb-a{background:var(--accent);width:520px;height:520px;animation:16s ease-in-out infinite float-a;top:-180px;left:-140px}.orb-b{background:var(--accent-2);width:460px;height:460px;animation:19s ease-in-out infinite float-b;bottom:-180px;right:-140px}.orb-c{background:var(--accent-3);opacity:.22;width:380px;height:380px;animation:22s ease-in-out infinite float-c;top:30%;left:50%}@keyframes float-a{50%{transform:translate(80px,60px)scale(1.1)}}@keyframes float-b{50%{transform:translate(-70px,-50px)scale(1.08)}}@keyframes float-c{50%{transform:translate(-120px,40px)scale(1.15)}}.grid-overlay{z-index:-1;pointer-events:none;background-image:linear-gradient(#ffffff06 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-size:54px 54px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(circle at 50% 35%,#000 0%,#0000 75%);mask-image:radial-gradient(circle at 50% 35%,#000 0%,#0000 75%)}.hero{text-align:center;margin-bottom:4.5rem}.badge{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff0a;border-radius:999px;align-items:center;gap:.55rem;margin-bottom:1.8rem;padding:.45rem 1rem;font-size:.78rem;animation:.7s both rise;display:inline-flex}.pulse{background:var(--accent-2);border-radius:50%;width:8px;height:8px;animation:2s infinite pulse;box-shadow:0 0 #00d4c499}@keyframes pulse{0%{box-shadow:0 0 #00d4c480}70%{box-shadow:0 0 0 8px #00d4c400}to{box-shadow:0 0 #00d4c400}}h1{letter-spacing:-.03em;font-size:clamp(2.6rem,7vw,4.6rem);font-weight:800;line-height:1.04}.line{animation:.8s both rise;display:block}.line:first-child{animation-delay:50ms}.line:nth-child(2){animation-delay:.18s}.grad{background:linear-gradient(100deg, var(--accent), var(--accent-2), var(--accent-3), var(--accent));color:#0000;background-size:300% 100%;-webkit-background-clip:text;background-clip:text}.shimmer{animation:.8s .18s both rise,8s linear infinite flow}@keyframes flow{to{background-position:300% 0}}.sub{color:var(--muted);margin-top:1.4rem;font-size:1.18rem;animation:.8s .35s both rise}@keyframes rise{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.grid{perspective:1000px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:1.4rem;display:grid}.card{color:inherit;transform:rotateX(var(--rx,0)) rotateY(var(--ry,0));transform-style:preserve-3d;border-radius:20px;text-decoration:none;transition:transform .25s;animation:.7s both rise;display:block;position:relative}.card:before{content:"";-webkit-mask-composite:xor;opacity:.5;background:linear-gradient(140deg,#7c6cff99,#00d4c440,#0000 60%);border-radius:20px;padding:1px;transition:opacity .25s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.card:hover:before{opacity:1}.card-glow{opacity:0;background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%), #7c6cff2e, transparent 60%);pointer-events:none;border-radius:20px;transition:opacity .25s;position:absolute;inset:0}.card:hover .card-glow{opacity:1}.card-shot{opacity:0;filter:saturate(1.1);pointer-events:none;background-position:top;background-size:cover;border-radius:20px;transition:opacity .3s;position:absolute;inset:0}.card:hover .card-shot{opacity:.16}.card-inner{background:var(--surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;flex-direction:column;height:100%;padding:1.7rem;transition:background .25s,transform .25s;display:flex;position:relative}.card:hover .card-inner{background:#ffffff0e;transform:translateY(-3px)}.card-top{justify-content:space-between;align-items:center;margin-bottom:1.2rem;display:flex}.icon{color:#b9b0ff;background:#7c6cff1f;border:1px solid #7c6cff38;border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;transition:background .25s,color .25s,transform .25s;display:inline-flex}.icon svg{width:22px;height:22px}.card:hover .icon{color:#cfc8ff;background:#7c6cff33;transform:translateY(-2px)}.tag{letter-spacing:.05em;text-transform:uppercase;color:var(--muted);border:1px solid var(--border);background:#ffffff05;border-radius:999px;padding:.28rem .75rem;font-size:.7rem}.card h2{letter-spacing:-.01em;margin-bottom:.55rem;font-size:1.4rem;font-weight:700}.card p{color:var(--muted);flex:1;font-size:.95rem;line-height:1.6}.go{color:var(--accent);align-items:center;gap:.45rem;margin-top:1.5rem;font-size:.93rem;font-weight:600;display:inline-flex}.arrow{transition:transform .25s}.card:hover .arrow{transform:translate(5px)}.footer{text-align:center;color:var(--muted);margin-top:4.5rem;font-size:.85rem;animation:.8s .6s both rise}.dot{opacity:.5;margin:0 .5rem}.detail{max-width:820px;animation:.6s both rise}.back,.back-foot{color:var(--muted);align-items:center;gap:.45rem;margin-bottom:2.2rem;font-size:.92rem;text-decoration:none;transition:color .2s;display:inline-flex}.back:hover,.back-foot:hover{color:var(--text)}.arrow-l{transition:transform .2s}.back:hover .arrow-l{transform:translate(-4px)}.detail-head{align-items:center;gap:1.1rem;margin-bottom:1.6rem;display:flex}.icon-lg{border-radius:16px;flex-shrink:0;width:60px;height:60px}.icon-lg svg{width:30px;height:30px}.detail-head h1{letter-spacing:-.02em;margin-top:.5rem;font-size:clamp(2rem,5vw,2.8rem);font-weight:800}.detail-about{color:var(--muted);max-width:65ch;margin-bottom:1.8rem;font-size:1.15rem;line-height:1.7}.btn-primary{background:linear-gradient(100deg, var(--accent), var(--accent-2));color:#08080c;border-radius:999px;align-items:center;gap:.5rem;padding:.8rem 1.5rem;font-size:.98rem;font-weight:600;text-decoration:none;transition:transform .2s,filter .2s;display:inline-flex}.btn-primary:hover{filter:brightness(1.08);transform:translateY(-2px)}.btn-primary .arrow{transition:transform .2s}.btn-primary:hover .arrow{transform:translate(2px,-2px)}.shots{gap:2rem;margin:2.8rem 0;display:grid}.shot-wrap figcaption{color:var(--muted);border-top:1px solid var(--border);padding:.7rem 1rem;font-size:.88rem}.shot-wrap{border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff08;border-radius:16px;overflow:hidden}.browser-bar{border-bottom:1px solid var(--border);align-items:center;gap:8px;padding:.7rem 1rem;display:flex}.dot-r,.dot-y,.dot-g{border-radius:50%;width:11px;height:11px}.dot-r{background:#ff5f57}.dot-y{background:#febc2e}.dot-g{background:#28c840}.browser-bar .url{color:var(--muted);margin-left:.6rem;font-size:.82rem}.shot{width:100%;height:auto;display:block}.features{margin-bottom:1rem}.features h2{margin-bottom:1.2rem;font-size:1.4rem;font-weight:700}.features ul{gap:.85rem;list-style:none;display:grid}.features li{color:#d6d6e0;align-items:flex-start;gap:.75rem;font-size:1.02rem;display:flex}.check{color:#4fe0d2;background:#00d4c424;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;margin-top:1px;display:inline-flex}.check svg{width:16px;height:16px}@media (max-width:720px){main{padding:5rem 1.15rem 3rem}.hero{margin-bottom:3rem}.sub{font-size:1.05rem}.grid{perspective:none;gap:1rem}.card{transform:none!important}.card-inner{-webkit-backdrop-filter:none;backdrop-filter:none;padding:1.4rem}.bg-orb{filter:blur(90px);opacity:.3;animation:none}.orb-c{display:none}.grid-overlay{background-size:40px 40px}}@media (prefers-reduced-motion:reduce){*,:before,.bg-orb{animation:none!important}}.reveal{opacity:0;transition:opacity .55s,transform .55s;transform:translateY(22px)}.revealed{opacity:1;transform:translateY(0)}.detail-v2{max-width:980px}.detail-topbar{justify-content:space-between;align-items:center;margin-bottom:3rem;display:flex}.detail-topbar .back{margin-bottom:0}.btn-ghost{color:var(--muted);border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff08;border-radius:999px;align-items:center;gap:.45rem;padding:.55rem 1.1rem;font-size:.92rem;font-weight:500;text-decoration:none;transition:color .2s,border-color .2s,background .2s;display:inline-flex}.btn-ghost:hover{color:var(--text);background:#ffffff0f;border-color:#ffffff38}.btn-ghost .arrow{transition:transform .2s}.btn-ghost:hover .arrow{transform:translate(2px,-2px)}.detail-hero{margin-bottom:2.5rem}.detail-hero-meta{flex-wrap:wrap;align-items:center;gap:1rem;margin-bottom:1.4rem;display:flex}.icon-xl{border-radius:18px;flex-shrink:0;width:68px;height:68px}.icon-xl svg{width:34px;height:34px}.detail-hero-badges{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.tag-live{color:#4fe0d2;background:#00d4c40f;border-color:#00d4c44d;align-items:center;gap:.45rem;display:inline-flex}.live-dot{background:#00d4c4;border-radius:50%;width:7px;height:7px;animation:2s infinite pulse;box-shadow:0 0 #00d4c480}.detail-title{letter-spacing:-.03em;margin-bottom:1rem;font-size:clamp(2.6rem,6vw,3.8rem);font-weight:800;line-height:1.06}.detail-blurb{color:var(--muted);max-width:58ch;margin-bottom:1.8rem;font-size:1.18rem;line-height:1.7}.detail-hero-shot{margin-bottom:2.5rem}.shot-hero{box-shadow:0 24px 80px #0009,0 0 0 1px #ffffff0f}.detail-glance{border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff08;border-radius:16px;flex-wrap:wrap;align-items:center;gap:1rem;margin-bottom:3rem;padding:1.4rem 2rem;display:flex}.glance-item{flex-direction:column;flex:1;align-items:center;gap:.3rem;min-width:80px;display:flex}.glance-num{letter-spacing:-.03em;background:linear-gradient(100deg, var(--accent), var(--accent-2));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:1.7rem;font-weight:800;line-height:1}.glance-num-live{letter-spacing:0;font-size:1.15rem}.glance-label{text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-size:.78rem}.glance-divider{background:var(--border);flex-shrink:0;width:1px;height:36px}.glance-live-wrap{align-items:center;gap:.5rem;display:flex}.pulse-dot{background:#00d4c4;border-radius:50%;flex-shrink:0;width:8px;height:8px;animation:2s infinite pulse;box-shadow:0 0 #00d4c480}.detail-section{margin-bottom:3.5rem}.section-title{letter-spacing:.05em;text-transform:uppercase;color:var(--muted);align-items:center;gap:.7rem;margin-bottom:1.4rem;font-size:1.1rem;font-weight:700;display:flex}.section-title:after{content:"";background:var(--border);flex:1;height:1px}.section-count{color:#b9b0ff;letter-spacing:0;text-transform:none;background:#7c6cff26;border:1px solid #7c6cff40;border-radius:999px;padding:.2rem .6rem;font-size:.72rem;font-weight:600}.detail-about-block{border:1px solid var(--border);border-left:3px solid var(--accent);background:#ffffff06;border-radius:12px;padding:1.4rem 1.6rem}.detail-about{color:#c8c8d8;font-size:1.08rem;line-height:1.75}.gallery{grid-template-columns:repeat(2,1fr);gap:1.4rem;display:grid}.gallery-item{transition:transform .25s,box-shadow .25s}.gallery-item:hover{transform:translateY(-3px);box-shadow:0 12px 40px #00000073}.shot-label{color:var(--muted);border-top:1px solid var(--border);padding:.7rem 1rem;font-size:.88rem;display:block}.feature-grid{grid-template-columns:repeat(2,1fr);gap:.85rem;list-style:none;display:grid}.feature-card{border:1px solid var(--border);background:#ffffff06;border-radius:12px;align-items:flex-start;gap:.85rem;padding:1.1rem 1.2rem;transition:background .2s,border-color .2s,transform .2s;display:flex}.feature-card:hover{background:#ffffff0a;border-color:#7c6cff40;transform:translateY(-2px)}.feature-card .check{flex-shrink:0;margin-top:1px}.feature-text{color:#d6d6e0;font-size:.97rem;line-height:1.5}.feature-groups{flex-direction:column;gap:2rem;display:flex}.feature-group-title{text-transform:uppercase;letter-spacing:.08em;color:var(--accent);align-items:center;gap:.6rem;margin-bottom:.85rem;font-size:.82rem;font-weight:600;display:flex}.feature-group-title:before{content:"";background:linear-gradient(to bottom, var(--accent), var(--accent-2));border-radius:2px;flex-shrink:0;width:3px;height:14px;display:inline-block}.tech-chips{flex-wrap:wrap;gap:.65rem;display:flex}.tech-chip{color:#c4beff;letter-spacing:.01em;background:#7c6cff1a;border:1px solid #7c6cff38;border-radius:999px;align-items:center;padding:.55rem 1.1rem;font-size:.88rem;font-weight:500;transition:background .2s,border-color .2s;display:inline-flex}.tech-chip:hover{background:#7c6cff2e;border-color:#7c6cff66}.project-nav{margin-bottom:2.5rem}.project-nav-label{text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin-bottom:1rem;font-size:.78rem}.project-nav-row{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.proj-nav-card{border:1px solid var(--border);color:inherit;background:#ffffff06;border-radius:14px;flex-direction:column;gap:.35rem;padding:1.2rem 1.4rem;text-decoration:none;transition:background .2s,border-color .2s,transform .2s;display:flex}.proj-nav-card:hover{background:#ffffff0d;border-color:#7c6cff4d;transform:translateY(-2px)}.proj-nav-right{text-align:right;align-items:flex-end}.proj-nav-dir{text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-size:.78rem}.proj-nav-icon{color:#b9b0ff;background:#7c6cff1f;border:1px solid #7c6cff33;border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;margin:.2rem 0;display:inline-flex}.proj-nav-icon svg{width:18px;height:18px}.proj-nav-name{color:var(--text);letter-spacing:-.01em;font-size:1.05rem;font-weight:700}.proj-nav-tag{color:var(--muted);font-size:.78rem}.shot-clickable{cursor:zoom-in}.shot-expand-hint{color:var(--muted);opacity:0;margin-left:auto;font-size:.75rem;transition:opacity .2s}.shot-clickable:hover .shot-expand-hint{opacity:1}.lb-backdrop{z-index:1000;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#040408eb;justify-content:center;align-items:center;padding:1.5rem;animation:.18s both lb-in;display:flex;position:fixed;inset:0}@keyframes lb-in{0%{opacity:0}to{opacity:1}}.lb-content{border:1px solid var(--border);border-radius:16px;flex-direction:column;max-width:min(1200px,92vw);max-height:90vh;animation:.2s both lb-scale;display:flex;position:relative;overflow:hidden;box-shadow:0 32px 100px #000c}@keyframes lb-scale{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.lb-browser-bar{border-bottom:1px solid var(--border);background:#ffffff0a;flex-shrink:0;align-items:center;gap:8px;padding:.65rem 1rem;display:flex}.lb-url{color:var(--muted);margin-left:.5rem;font-size:.82rem}.lb-counter{color:var(--muted);font-variant-numeric:tabular-nums;margin-left:auto;font-size:.78rem}.lb-img{object-fit:contain;background:#08080e;width:100%;height:auto;max-height:calc(90vh - 6rem);display:block}.lb-caption{color:var(--muted);border-top:1px solid var(--border);background:#ffffff05;flex-shrink:0;padding:.75rem 1rem;font-size:.9rem}.lb-close{z-index:1001;border:1px solid var(--border);width:40px;height:40px;color:var(--muted);cursor:pointer;background:#ffffff0f;border-radius:50%;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex;position:fixed;top:1.2rem;right:1.2rem}.lb-close:hover{color:var(--text);background:#ffffff1f}.lb-close svg{width:18px;height:18px}.lb-nav{z-index:1001;border:1px solid var(--border);width:44px;height:44px;color:var(--muted);cursor:pointer;background:#ffffff0f;border-radius:50%;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex;position:fixed;top:50%;transform:translateY(-50%)}.lb-nav:hover{color:var(--text);background:#ffffff1f}.lb-nav svg{width:20px;height:20px}.lb-prev{left:1rem}.lb-next{right:1rem}@media (max-width:720px){.detail-topbar{margin-bottom:2rem}.gallery,.feature-grid,.project-nav-row{grid-template-columns:1fr}.detail-glance{gap:.7rem;padding:1.1rem 1.2rem}.glance-divider{display:none}.glance-item{flex-direction:row;flex:unset;border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;width:100%;min-width:auto;padding:.2rem 0}.glance-item:last-child{border-bottom:none}.detail-title{font-size:clamp(2rem,8vw,3rem)}.reveal{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.reveal{opacity:1!important;transition:none!important;transform:none!important}}