﻿*{margin:0;padding:0;box-sizing:border-box}:root{--bg:#060a13;--card:#0d1420;--accent:#3b9eff;--text:#d0d8e8;--muted:#5a6a80;--border:#141e30}body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;position:relative;overflow-x:hidden}body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(59,158,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(59,158,255,.03) 1px,transparent 1px);background-size:60px 60px}body::after{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 800px 600px at 20% 10%,rgba(59,158,255,.06),transparent),radial-gradient(ellipse 600px 400px at 80% 80%,rgba(59,100,255,.04),transparent)}header,section{position:relative;z-index:1}header{max-width:1100px;margin:0 auto;padding:3rem 2rem 2rem;display:flex;justify-content:space-between;align-items:flex-start;gap:2rem;flex-wrap:wrap}.header-info h1{font-size:1.8rem;font-weight:700;color:#fff;margin-bottom:.35rem}.header-info p{color:var(--muted);font-size:.95rem;line-height:1.6;max-width:500px}.header-info a{color:var(--accent);text-decoration:none}.header-info a:hover{color:#fff}.stats-bar{max-width:1100px;margin:0 auto;padding:0 2rem;display:flex;justify-content:center;gap:clamp(.55rem,4vw,2rem);flex-wrap:nowrap}.stat-item{font-size:clamp(.62rem,2.7vw,.85rem);color:var(--muted);display:flex;align-items:center;justify-content:center;gap:clamp(.18rem,1vw,.4rem);white-space:nowrap;flex:0 1 auto;min-width:0}.stat-value{font-weight:700;color:#fff;font-variant-numeric:tabular-nums;font-size:clamp(.68rem,3vw,.95rem)}.header-right{display:flex;align-items:center;gap:1rem;padding-top:.25rem}.github-link{display:flex;align-items:center;gap:.5rem;color:var(--muted);text-decoration:none;font-size:.9rem;padding:.5rem .85rem;border-radius:8px;border:1px solid var(--border);transition:color .2s,border-color .2s,background .2s}.github-link:hover{color:#fff;border-color:var(--accent);background:rgba(59,158,255,.08)}.github-link svg{width:18px;height:18px;fill:currentColor}.email-link svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.email-link{display:flex;align-items:center;gap:.5rem;color:var(--muted);text-decoration:none;font-size:.9rem;padding:.5rem .85rem;border-radius:8px;border:1px solid var(--border);transition:color .2s,border-color .2s,background .2s}.email-link:hover{color:#fff;border-color:var(--accent);background:rgba(59,158,255,.08)}section{max-width:1100px;margin:0 auto;padding:2.5rem 2rem}.section-label{font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:1.25rem}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.project-card.hero-card{grid-column:1/-1}.project-card.hero-card .project-thumb{aspect-ratio:21/9}.project-card.hero-card .project-info h3{font-size:1.25rem}.project-card.hero-card .project-info .summary{font-size:.9rem}.project-card{background:var(--card);border:1px solid var(--border);border-radius:10px;overflow:hidden;transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;flex-direction:column;text-decoration:none;color:inherit}.project-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.4);border-color:rgba(59,158,255,.3)}.project-thumb{aspect-ratio:21/9;position:relative;overflow:hidden;background:#080c16}.carousel-track{position:relative;width:100%;height:100%}.carousel-slide{position:absolute;inset:0;opacity:0;transition:opacity .4s}.carousel-slide.active{opacity:1}.carousel-slide img,.carousel-slide video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}.project-card:hover .carousel-slide.active img,.project-card:hover .carousel-slide.active video{transform:scale(1.03)}.project-thumb .overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,10,19,.7) 0%,transparent 50%);opacity:0;transition:opacity .3s;display:flex;align-items:flex-end;justify-content:center;padding-bottom:1rem;font-size:.85rem;color:#fff;font-weight:600;letter-spacing:.02em;pointer-events:none;z-index:2}.project-card:hover .overlay{opacity:1}.thumb-strip{display:flex;gap:4px;padding:8px 12px 4px;background:var(--card);overflow-x:auto;scrollbar-width:none;margin-top:6px}.thumb-strip::-webkit-scrollbar{display:none}.thumb-strip-item{flex:0 0 auto;width:56px;height:34px;border-radius:4px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:border-color .2s,opacity .2s;opacity:.5;position:relative}.thumb-strip-item.active{border-color:var(--accent);opacity:1}.thumb-strip-item:hover{opacity:.85}.thumb-strip-item img{width:100%;height:100%;object-fit:cover;display:block}.thumb-strip-item .play-badge{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.3)}.thumb-strip-item .play-badge svg{width:14px;height:14px;fill:#fff}.project-info{padding:.5rem 12px 12px;flex:1;display:flex;flex-direction:column}.project-title-row{display:flex;align-items:flex-start;gap:.5rem;margin-bottom:.3rem;min-width:0}.project-tags{margin-left:auto;flex:0 0 auto}.project-icon{width:19px;height:19px;border-radius:4px;object-fit:cover;flex-shrink:0}.project-card.hero-card .project-icon{width:23px;height:23px;border-radius:5px}.project-info h3{font-size:1rem;font-weight:600;color:#fff;min-width:0;overflow-wrap:anywhere}.project-info .summary{font-size:.82rem;color:var(--muted);line-height:1.55;margin-bottom:.65rem}.project-meta{display:flex;gap:.45rem 1rem;flex-wrap:wrap;font-size:.75rem;color:var(--muted)}.project-meta span{display:flex;align-items:center;gap:.35rem}.project-meta svg{width:14px;height:14px;fill:none;stroke:var(--muted);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.project-tags{display:flex;gap:.35rem;flex-wrap:nowrap;margin-bottom:.5rem}.tag{font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:.2rem .55rem;border-radius:100px;background:rgba(59,158,255,.12);color:var(--accent);border:1px solid rgba(59,158,255,.2);line-height:1;white-space:nowrap}.now-playing{color:#34d399}.live-dot{width:6px;height:6px;border-radius:50%;background:#34d399;display:inline-block;animation:pulse 2s infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}.skeleton{background:linear-gradient(90deg,var(--card) 25%,var(--border) 50%,var(--card) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:6px}.skeleton-card{background:var(--card);border:1px solid var(--border);border-radius:10px;overflow:hidden}.skeleton-thumb{aspect-ratio:21/9}.skeleton-card.hero-card .skeleton-thumb{aspect-ratio:21/9}.skeleton-line{height:14px;margin:1.1rem 1.25rem .5rem;width:60%}.skeleton-line-short{height:11px;margin:.5rem 1.25rem 1.1rem;width:80%}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.reveal{opacity:0;transform:translateY(25px);transition:opacity .5s,transform .5s}.reveal.visible{opacity:1;transform:translateY(0)}@media(max-width:768px){header{padding:2rem 1.25rem 1.5rem;flex-direction:column}.header-info h1{font-size:1.5rem}section{padding:2rem 1.25rem}.projects-grid{grid-template-columns:1fr}.project-title-row{align-items:flex-start}.project-card.hero-card .project-info h3{font-size:1.1rem}.stats-bar{padding:0 1.25rem;gap:.5rem}.project-meta{font-size:.68rem;gap:.4rem .8rem}.project-meta .now-playing{flex-basis:100%}.tag{font-size:.6rem;letter-spacing:.04em}}