.project{max-width:920px;color:var(--text-body);margin:0 auto;padding:2.5rem 1.5rem;line-height:1.6;overflow-x:hidden}.project h1{margin-bottom:.75rem;font-size:2.5rem;font-weight:700;line-height:1.2}.project-tagline{max-width:46rem;margin-bottom:2.5rem;font-size:1.25rem;font-weight:400;line-height:1.5}.project-hero{justify-content:center;align-items:center;margin:2.5rem 0;padding:1rem;display:flex}.centered-image{border-radius:var(--radius-md);max-width:100%;height:auto;transition:var(--transition-base)}.video-container{flex-direction:column;align-items:center;margin:2.5rem 0;display:flex}.project-video{border-radius:var(--radius-md);max-width:100%;box-shadow:var(--shadow-md);transition:var(--transition-base)}.video-caption{color:var(--text-muted);text-align:center;max-width:80%;margin-top:1rem;font-size:.95rem}.project h2{border-bottom:2px solid var(--border-light);color:var(--text-heading);margin-top:3rem;margin-bottom:1.25rem;padding-bottom:.5rem;font-size:1.85rem;font-weight:600}.project h3{color:var(--text-heading);margin-top:2rem;margin-bottom:1rem;font-size:1.5rem;font-weight:600}.screenshot-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));place-items:center;gap:1.75rem;margin:2rem 0;display:grid}.project-screenshot{border-radius:var(--radius-md);max-width:100%;height:auto;box-shadow:var(--shadow-md);object-fit:contain;display:block}.screenshot-caption{color:var(--text-muted);text-align:center;max-width:90%;margin-top:1rem;margin-left:auto;margin-right:auto;font-size:.95rem}.project-links{flex-direction:column;align-items:center;gap:1rem;margin:2.5rem 0;display:flex}.try-it-out{text-align:center;margin:.75rem 0}.password-note{margin-left:.5rem}.feature-list,.tech-list,.challenge-list,.link-list{margin:1.25rem 0 2.25rem;padding-left:1.75rem}.feature-list li,.tech-list li,.challenge-list li,.link-list li{margin-bottom:1rem;line-height:1.6;position:relative}.back-link{text-align:center;margin-top:4rem;margin-bottom:1rem}.back-link a{border-radius:var(--radius-md);transition:var(--transition-base);align-items:center;padding:.6rem 1.25rem;font-weight:500;display:inline-flex}.back-link a:before{content:"←";margin-right:.5rem;font-size:1.2rem}.back-link a:hover{transform:translate(-3px)}.tech-tag-container{flex-wrap:wrap;gap:.5rem;margin:1.5rem 0;display:flex}.zoomed-image-overlay{z-index:1000;cursor:zoom-out;background-color:#000000d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.zoomed-image-container{max-width:90vw;max-height:90vh}.zoomable-image-wrapper{cursor:zoom-in}@media (max-width:768px){.project{padding:1.5rem 1rem}.project h1{font-size:2rem}.project-tagline{font-size:1.1rem}.project h2{margin-top:2.5rem;font-size:1.5rem}.project h3{font-size:1.3rem}.screenshot-grid{grid-template-columns:1fr;gap:1.25rem}.video-caption,.screenshot-caption{max-width:100%}.feature-list,.tech-list,.challenge-list,.link-list{padding-left:1.25rem}}@media (max-width:480px){.project h1{font-size:1.75rem}.project-tagline{margin-bottom:1.5rem;font-size:1rem}.project h2{font-size:1.4rem}.project h3{font-size:1.2rem}.try-it-out a{padding:.5rem 1rem!important;font-size:.95rem!important}}
:root{--primary-color:#5a67d8;--primary-hover:#4c51bf;--text-on-primary:#fff;--background-light:#f7f9fc;--border-light:#e2e8f0;--text-heading:#2d3748;--text-body:#4a5568;--text-muted:#718096;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px #0000001a;--shadow-lg:0 10px 15px #0000001a;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--transition-base:all .3s ease}.project a{color:var(--primary-color);transition:var(--transition-base);text-decoration:none}.project a:hover{color:var(--primary-hover);text-decoration:underline}.project-header{border-bottom:1px solid var(--border-light);margin-bottom:2rem;padding-bottom:1.5rem}.project h1{color:var(--text-heading)!important}.project-tagline{color:var(--text-body)!important}.project-links a,.link-list a,.back-link a{color:var(--primary-color);font-weight:500}.project-button,.try-it-out a{cursor:pointer;transition:var(--transition-base);box-shadow:var(--shadow-sm);text-align:center;border:none;display:inline-block;background-color:var(--primary-color)!important;color:var(--text-on-primary)!important;border-radius:var(--radius-md)!important;padding:.75rem 1.5rem!important;font-weight:600!important}.project-button:hover,.try-it-out a:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);background-color:var(--primary-hover)!important;text-decoration:none!important}.project-tag{color:var(--primary-color);border:1px solid var(--primary-color);border-radius:var(--radius-sm);background-color:#5a67d81a;margin-right:.5rem;padding:.25rem .75rem;font-size:.8rem;font-weight:500;display:inline-block}.highlight,.feature-list strong,.tech-list strong,.challenge-list strong{color:var(--primary-color)!important}.coming-soon{background-color:var(--background-light)!important;border-left:4px solid var(--primary-color)!important;border-radius:0 var(--radius-md) var(--radius-md) 0!important;margin:2rem 0!important;padding:1.5rem!important}.coming-soon p{color:var(--text-body)!important;margin:.75rem 0!important;line-height:1.6!important}.back-link a{background-color:var(--background-light)!important;color:var(--text-body)!important}.back-link a:hover{background-color:var(--border-light)!important;color:var(--text-heading)!important}.project-section{margin:2.5rem 0}.password-note{color:var(--text-muted);font-style:italic}.video-container:hover .project-video{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.project-screenshot{transition:var(--transition-base)!important}.project-screenshot:hover{box-shadow:var(--shadow-lg)!important;transform:translateY(-3px)!important}