body{background:#0f172a;color:#e5e7eb;font-family:Arial,Helvetica,sans-serif;margin:0}html{scroll-behavior:smooth}#vue-tracer-overlay{pointer-events:none}.page{min-height:100vh}.hero{margin:0 auto;max-width:960px;padding:6rem 1.5rem 4rem}.eyebrow{color:#94a3b8;font-size:.85rem;letter-spacing:.2em;text-transform:uppercase}h1{font-size:clamp(2.5rem,7vw,5rem);line-height:1;margin:.5rem 0 1rem}.intro{color:#cbd5e1;font-size:1.15rem;line-height:1.7;max-width:700px}.actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}.btn{background:transparent;border:1px solid #334155;border-radius:999px;color:#fff;display:inline-block;padding:.9rem 1.3rem;text-decoration:none;transition:.2s ease}.btn:hover{border-color:#64748b;transform:translateY(-2px)}.btn.primary{background:#38bdf8;border-color:#38bdf8;color:#0f172a}.section{margin:0 auto;max-width:960px;padding:2rem 1.5rem 4rem}h2{font-size:2rem;margin-bottom:1.5rem}.project-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.card{background:#ffffff08;border:1px solid #38bdf8;border-radius:16px;overflow:hidden;padding:1.25rem;position:relative;transition:all .25s ease}.card h3{margin-bottom:.75rem;margin-top:0}.card p{color:#cbd5e1;line-height:1.6;margin:0}.card:before{background:linear-gradient(120deg,transparent,rgba(56,189,248,.25),transparent);border-radius:16px;content:"";inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .3s ease}.card:hover{border-color:#38bdf8;box-shadow:0 10px 30px #38bdf833;transform:translateY(-6px)}.card:hover:before{opacity:1}.card[data-type=engine]{border-color:#f97316}.card[data-type=engine] .badge{color:#f97316}.card[data-type=experimental]{border-color:#8b5cf6}.card[data-type=experimental] .badge{color:#8b5cf6}.card[data-type=archive]{border-color:#fbbf24}.card[data-type=archive] .badge{color:#fbbf24}.card[data-type=fun]{border-color:#ec4899}.card[data-type=fun] .badge{color:#ec4899}.badge{color:#94a3b8;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}.tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.75rem}.tags span{background:#ffffff14;border-radius:999px;font-size:.75rem;padding:.2rem .5rem}.fade-in{opacity:0;transform:translateY(30px);transition:all .6s ease}.fade-in.visible{opacity:1;transform:translateY(0)}.links{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.links a{font-size:.9rem}.about{margin-top:6rem}.about-container{display:grid;gap:2.5rem;grid-template-columns:1fr}.about-intro h2{font-size:2.5rem;margin-bottom:.5rem}.about-lead{color:#94a3b8;font-size:1.2rem;max-width:600px}.about-content{max-width:750px}.about-content p{color:#cbd5e1;line-height:1.8;margin-bottom:1.5rem}.about-card{background:linear-gradient(180deg,#38bdf814,#0f172a99);border:1px solid rgba(56,189,248,.2);border-radius:20px;box-shadow:0 20px 60px #00000040;padding:2rem}.about-tech{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.about-tech span{background:#94a3b826;border-radius:999px;color:#cbd5e1;font-size:.75rem;padding:.4rem .7rem}.project-page{min-height:100vh;padding:4rem 1.5rem}.project-wrap{margin:0 auto;max-width:900px}.back-link{color:#94a3b8;display:inline-block;margin-bottom:2rem;text-decoration:none}.back-link:hover{color:#e2e8f0}.project-type{color:#94a3b8;font-size:.75rem;letter-spacing:.12em;margin-bottom:.75rem;text-transform:uppercase}.project-page h1{font-size:clamp(2.2rem,6vw,4rem);margin:0 0 1rem}.project-intro{font-size:1.15rem;max-width:760px}.project-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin:2rem 0}.project-content{margin-top:2rem}.project-content p{color:#dbe4f0;line-height:1.8;margin-bottom:1.25rem}.project-hero{border:1px solid #1e293b;border-radius:16px;box-shadow:0 20px 60px #38bdf826;margin:1.5rem 0 2rem;width:100%}.project-section{margin-top:3rem}.project-section h2{font-size:1.6rem;margin-bottom:1rem}.project-section ul{padding-left:1.2rem}.project-section li{margin-bottom:.5rem}.project-intro{color:#cbd5e1;font-size:1.2rem;line-height:1.8;max-width:750px}.project-video{border:1px solid #1e293b;border-radius:16px;margin:2rem 0;width:100%}.image-caption{color:#94a3b8;font-size:.9rem;margin-bottom:1.5rem;margin-top:.5rem}.gallery{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.gallery-item img{border:1px solid #1e293b;border-radius:12px;cursor:pointer;transition:transform .2s ease;width:100%}.gallery-item img:hover{transform:scale(1.03)}.gallery-item p{color:#94a3b8;font-size:.85rem;margin-top:.5rem}.lightbox{align-items:center;background:#000000d9;display:flex;flex-direction:column;inset:0;justify-content:center;padding:2rem;position:fixed;z-index:9999}.lightbox img{border-radius:12px;max-height:70vh;max-width:90%}.lightbox-caption{color:#cbd5e1;margin-top:1rem;text-align:center}.postmortem{background:linear-gradient(180deg,#a855f71f,#0f172aa6);border:1px solid rgba(168,85,247,.35);border-radius:18px;box-shadow:0 12px 40px #a855f71f;margin-top:3rem;padding:1.5rem}.postmortem h2{color:#d8b4fe;margin-bottom:1rem;margin-top:0}.postmortem p{color:#e2e8f0}.postmortem p:last-child{margin-bottom:0}.postmortem-label{color:#c084fc;font-size:.72rem;letter-spacing:.14em;margin:0 0 .75rem;text-transform:uppercase}.project-page--archive{background:linear-gradient(#0a0e18eb,#0a0e18eb),repeating-linear-gradient(0deg,hsla(0,0%,100%,.03),hsla(0,0%,100%,.03) 1px,transparent 0,transparent 3px)}.project-page--archive .project-wrap{background:linear-gradient(180deg,#fbbf2414,#0f172ab8);border:1px solid rgba(251,191,36,.22);border-radius:20px;box-shadow:0 20px 60px #00000059;padding:2rem}.project-page--archive .project-type{color:#fbbf24}.project-page--archive h1{color:#fef3c7;text-shadow:0 0 12px rgba(251,191,36,.12)}.project-page--archive .back-link{color:#fcd34d}.project-page--archive .back-link:hover{color:#fde68a}.project-page--archive .tags span{background:#fbbf241f;border:1px solid rgba(251,191,36,.2);color:#fde68a}.project-page--archive .project-hero,.project-page--archive .project-image,.project-page--archive .project-video{border:1px solid rgba(251,191,36,.25);box-shadow:0 10px 30px #fbbf2414}.archive-note{color:#fbbf24;font-size:.78rem;letter-spacing:.14em;margin:0 0 1rem;text-transform:uppercase}.project-page--archive h1{font-family:Trebuchet MS,Verdana,Arial,sans-serif;letter-spacing:.01em}.project-status{color:#fbbf24;font-size:.8rem;margin-top:.5rem}
