@import"https://fonts.googleapis.com/css2?family=Balsamiq+Sans:wght@400;700&display=swap";:root{--color-sand: #E6D5AC;--color-terracotta: #C17B61;--color-sage: #7A918D;--color-forest: #2D3A3A;--color-cream: #F5F1E8;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;font-family:Balsamiq Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:var(--color-cream);color:var(--color-forest);line-height:1.6}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}.container{max-width:1200px;margin:0 auto;padding:6rem 2rem 2rem}.section{margin-bottom:4rem}.section-title{color:var(--color-forest);margin-bottom:2rem;font-size:2.5rem;text-align:center}.portfolio-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-top:2rem}.portfolio-category{background-color:var(--color-sand);padding:2rem;border-radius:8px;transition:transform .3s ease}.portfolio-category:hover{transform:translateY(-5px)}.portfolio-category h3{color:var(--color-forest);margin-bottom:1rem;font-size:1.5rem}.project-page{min-height:100vh;padding-top:80px;background-color:#000;color:#fff;font-family:Courier New,monospace}.project-page-container{max-width:1000px;margin:0 auto;padding:2rem}.project-page-loading{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 80px);font-family:Courier New,monospace;color:#fff}.back-button{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background-color:transparent;border:2px solid #fff;color:#fff;font-family:Courier New,monospace;font-size:.9rem;font-weight:600;cursor:pointer;border-radius:6px;transition:all .3s ease;margin-bottom:2rem}.back-button:hover{background-color:#fff;color:#000}.project-section{margin-bottom:3rem;padding-bottom:2rem;border-bottom:1px solid #333}.project-section:last-child{border-bottom:none;margin-bottom:0}.section-heading{font-family:Courier New,monospace;font-size:1.1rem;color:var(--color-terracotta);margin:0 0 1.5rem;text-transform:uppercase;letter-spacing:2px;font-weight:600}.section-content{font-family:Courier New,monospace}.title-section{text-align:left;padding-bottom:2rem}.project-title{font-family:Courier New,monospace;font-size:3rem;color:#fff;margin:0 0 1rem;text-transform:uppercase;letter-spacing:3px;line-height:1.2}.project-tagline{font-family:Courier New,monospace;font-size:1.2rem;color:#aaa;margin:0;line-height:1.6;max-width:800px}.team-members{display:flex;flex-wrap:wrap;gap:1.5rem}.team-member{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;background-color:#1a1a1a;border-radius:8px;border:1px solid #333;transition:all .3s ease}.team-member:hover{border-color:#555;background-color:#222}.member-avatar{width:48px;height:48px;border-radius:50%;background-color:var(--color-terracotta);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:600;flex-shrink:0}.member-info{display:flex;flex-direction:column;gap:.25rem}.member-name{font-size:1rem;color:#fff;font-weight:600}.member-role{font-size:.85rem;color:#888}.overview-section .section-content p{font-size:1.1rem;line-height:1.8;color:#ccc;margin:0}.tools-grid{display:flex;flex-wrap:wrap;gap:.75rem}.tool-item{display:inline-flex;align-items:center;padding:.6rem 1.2rem;background-color:#1a1a1a;border-radius:6px;border:1px solid #333;transition:all .3s ease}.tool-item:hover{background-color:#fff;border-color:#fff}.tool-item:hover .tool-name{color:#000}.tool-name{font-size:.95rem;color:#fff;font-weight:500;transition:color .3s ease}.implementation-section .section-content>p{font-size:1.1rem;line-height:1.8;color:#ccc;margin:0}.implementation-steps{display:flex;flex-direction:column;gap:1.5rem}.implementation-step{display:flex;gap:1.5rem;align-items:flex-start}.step-number{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background-color:var(--color-terracotta);color:#fff;border-radius:50%;font-size:1rem;font-weight:600;flex-shrink:0}.step-content{flex:1;padding-top:.25rem}.step-content p{font-size:1.05rem;line-height:1.8;color:#ccc;margin:0}.gallery-container{display:flex;flex-direction:column;gap:1.5rem}.main-image-container{display:flex;align-items:center;justify-content:center;gap:1rem}.main-image-wrapper{position:relative;flex:1;max-width:100%;height:450px;display:flex;align-items:center;justify-content:center;background-color:#1a1a1a;border-radius:8px;overflow:hidden}.main-image{max-width:100%;max-height:100%;object-fit:contain}.image-counter{position:absolute;bottom:1rem;right:1rem;background-color:#000000b3;color:#fff;padding:.4rem .8rem;border-radius:4px;font-family:Courier New,monospace;font-size:.85rem}.gallery-nav-button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:2px solid #fff;background-color:transparent;color:#fff;font-size:1rem;cursor:pointer;transition:all .3s ease;flex-shrink:0}.gallery-nav-button:hover{background-color:#fff;color:#000}.thumbnail-strip{display:flex;gap:.5rem;overflow-x:auto;padding:.5rem 0;justify-content:flex-start}.thumbnail{flex-shrink:0;width:70px;height:50px;border-radius:4px;overflow:hidden;border:2px solid #333;cursor:pointer;transition:all .3s ease;padding:0;background:none}.thumbnail:hover{border-color:#666}.thumbnail.active{border-color:#fff;border-width:3px}.thumbnail img{width:100%;height:100%;object-fit:cover}.links-container{display:flex;gap:1rem;flex-wrap:wrap}.project-link{display:inline-flex;align-items:center;gap:.75rem;padding:.75rem 1.5rem;text-decoration:none;font-family:Courier New,monospace;font-size:.95rem;font-weight:600;border-radius:6px;transition:all .3s ease}.project-link.github{background-color:#24292e;color:#fff;border:1px solid #24292e}.project-link.github:hover{background-color:#2f363d;border-color:#2f363d;transform:translateY(-2px)}.project-link.live{background-color:var(--color-terracotta);color:#fff;border:1px solid var(--color-terracotta)}.project-link.live:hover{opacity:.9;transform:translateY(-2px)}.project-link.additional{background-color:#4a5568;color:#fff;border:1px solid #4a5568}.project-link.additional:hover{background-color:#5a6578;border-color:#5a6578;transform:translateY(-2px)}@media (max-width: 900px){.project-title{font-size:2.5rem}.main-image-wrapper{height:350px}.implementation-step{gap:1rem}.step-number{width:32px;height:32px;font-size:.9rem}.team-members{flex-direction:column}.team-member{width:100%}}@media (max-width: 600px){.project-page-container{padding:1rem}.project-title{font-size:2rem;letter-spacing:1px}.project-tagline,.section-heading{font-size:1rem}.main-image-wrapper{height:280px}.gallery-nav-button{width:36px;height:36px;font-size:.9rem}.thumbnail{width:55px;height:40px}.implementation-step{flex-direction:column;gap:.75rem}.step-number{width:28px;height:28px;font-size:.85rem}.step-content{padding-top:0}.links-container{flex-direction:column}.project-link{justify-content:center}.overview-section .section-content p,.step-content p{font-size:1rem}}#root{width:100%;min-height:100vh;position:relative;overflow:hidden}#root[data-theme=dark]{background-color:#000;color:#fff;font-family:Courier New,Courier,monospace}@keyframes fadeInDark{0%{opacity:0}to{opacity:1}}#root[data-theme=gallery]{background-color:var(--color-cream)}.theme-transition-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000;z-index:1001;transform:translateY(-100%);animation:slideDown .5s ease-in-out forwards,slideUp .5s ease-in-out .8s forwards;pointer-events:none}@keyframes slideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes slideUp{0%{transform:translateY(0)}to{transform:translateY(-100%)}}main{padding-top:60px;min-height:calc(100vh - 60px);position:relative;z-index:1}.navbar{padding:1.5rem 2rem;position:fixed;width:100%;top:0;z-index:1000;display:flex;justify-content:space-between;align-items:center}body.browser-view-open .navbar{z-index:1;pointer-events:none;opacity:0}#root[data-theme=dark] .navbar{background-color:#000000e6;animation:fadeInDark .4s ease-in-out forwards}.nav-logo{color:var(--color-forest);font-size:2rem;text-decoration:none;transition:all .3s ease;margin-left:2rem}#root[data-theme=dark] .nav-logo{color:#fff;animation:fadeInDark .4s ease-in-out forwards}.nav-logo:hover{color:var(--color-terracotta);transform:scale(1.1)}.nav-links{display:flex;justify-content:flex-end;gap:2.5rem;list-style:none;margin-right:2rem}.nav-links a{color:var(--color-forest);text-decoration:none;font-weight:700;font-size:1.1rem;transition:color .3s ease}#root[data-theme=dark] .nav-links a{color:#fff;animation:fadeInDark .4s ease-in-out forwards}.nav-links a:hover{color:var(--color-terracotta)}.home-container{width:100%;min-height:calc(100vh - 60px);padding:4rem 2rem;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.home-content{max-width:1400px;margin:0 auto;display:flex;gap:4rem;align-items:center}.intro-text{flex:3;padding-right:2rem;font-weight:400;font-size:1.3rem}.greeting{font-size:3.8rem;line-height:1.2;margin-bottom:1.2rem;color:var(--color-forest);font-weight:700}.typing-text{color:var(--color-terracotta);font-weight:700;display:inline-block;min-width:300px}.bio{font-size:1.3rem;line-height:1.5;color:var(--color-forest);font-weight:400;margin-bottom:2rem}.bio p{margin-bottom:1.5rem}.bio p:last-child{margin-bottom:0}.social-buttons{display:flex;gap:1.5rem;margin-top:2rem}.social-button{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:50%;background-color:var(--color-sand);color:var(--color-forest);text-decoration:none;transition:all .3s ease;font-size:1.5rem}.social-button:hover{background-color:var(--color-terracotta);color:var(--color-cream);transform:translateY(-3px)}.home-image{flex:2;min-height:500px;display:flex;align-items:center;justify-content:center}.home-image-img{max-width:130%;max-height:100%;object-fit:contain}.contact-links{display:flex;gap:2rem;margin-top:2rem;justify-content:center}.contact-links a{color:var(--color-forest);text-decoration:none;padding:.5rem 1rem;border:2px solid var(--color-terracotta);border-radius:4px;transition:all .3s ease;font-size:1.2rem;font-weight:700}.contact-links a:hover{background-color:var(--color-terracotta);color:var(--color-cream)}.logo,.card,.read-the-docs{display:none}.portfolio-sections{display:flex;justify-content:center;gap:2rem;margin:3rem 0}.section-button{padding:1rem 2rem;font-size:1.2rem;font-weight:700;border:none;background:none;color:var(--color-forest);cursor:pointer;transition:all .3s ease;position:relative}#root[data-theme=dark] .section-button{color:#fff;animation:fadeInDark .4s ease-in-out forwards}.section-button:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background-color:var(--color-terracotta);transition:all .3s ease;transform:translate(-50%)}#root[data-theme=dark] .section-button:after{background-color:#fff;animation:fadeInDark .4s ease-in-out forwards}.section-button:hover:after,.section-button.active:after{width:100%}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;padding:2rem;max-width:1400px;margin:0 auto}.gallery-item{background-color:var(--color-sand);border-radius:8px;overflow:hidden;transition:transform .3s ease}#root[data-theme=dark] .gallery-item{background-color:#1a1a1a;border:1px solid #333;animation:fadeInDark .4s ease-in-out forwards}.gallery-item:hover{transform:translateY(-5px)}.gallery-image{width:100%;height:200px;overflow:hidden;position:relative}.hacks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem;padding:1.5rem;width:100%;max-width:1400px;margin:0 auto}.hacks-card{min-height:220px;background:linear-gradient(145deg,#1a1a2e,#16213e);border-radius:16px;padding:0;cursor:pointer;position:relative;transition:transform .15s ease-out,box-shadow .3s ease;transform-style:preserve-3d;animation:cardFadeIn .5s ease-out backwards;animation-delay:calc(var(--card-index) * .05s);overflow:hidden}@keyframes cardFadeIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.hacks-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:16px;padding:1px;background:linear-gradient(135deg,#e07a5f80,#ffffff1a,#e07a5f4d);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.hacks-card-glow{position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at center,rgba(224,122,95,.15) 0%,transparent 50%);opacity:0;transition:opacity .3s ease;pointer-events:none}.hacks-card:hover .hacks-card-glow{opacity:1}.hacks-card:hover{box-shadow:0 20px 40px #0006,0 0 30px #e07a5f33}.hacks-card-content{padding:1.5rem;height:100%;display:flex;flex-direction:column;position:relative;z-index:1}.hacks-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.75rem}.hacks-card-header h3{font-size:1.3rem;font-weight:600;color:#fff;margin:0;line-height:1.3;flex:1}.hacks-card-arrow{font-size:1.5rem;color:var(--color-terracotta);opacity:0;transform:translate(-10px);transition:all .3s ease}.hacks-card:hover .hacks-card-arrow{opacity:1;transform:translate(0)}.hacks-card-tagline{font-size:.9rem;color:#ffffffb3;line-height:1.5;margin:0 0 auto;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.hacks-card-techs{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.hacks-tech-pill{font-size:.7rem;padding:.25rem .6rem;background:#e07a5f26;color:var(--color-terracotta);border-radius:20px;border:1px solid rgba(224,122,95,.3);transition:all .2s ease}.hacks-tech-pill.more{background:#ffffff1a;color:#fff9;border-color:#fff3}.hacks-card:hover .hacks-tech-pill{background:#e07a5f40;border-color:#e07a5f80}@media (max-width: 768px){.hacks-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;padding:1rem}.hacks-card{min-height:200px}.hacks-card-header h3{font-size:.95rem}}.gallery-img{width:100%;height:100%;object-fit:cover;object-position:20% 20%;transition:transform .3s ease}.gallery-item:hover .gallery-img{transform:scale(1.05)}.placeholder-image{width:100%;height:200px;background-color:var(--color-terracotta);opacity:.8}#root[data-theme=dark] .placeholder-image{background-color:#333;animation:fadeInDark .4s ease-in-out forwards}.gallery-caption{padding:1.5rem}.gallery-caption h3{margin-bottom:.5rem;color:var(--color-forest)}#root[data-theme=dark] .gallery-caption h3{color:#fff;animation:fadeInDark .4s ease-in-out forwards}.gallery-caption p{color:var(--color-forest);opacity:.8}#root[data-theme=dark] .gallery-caption p{color:#fff;opacity:.7;animation:fadeInDark .4s ease-in-out forwards}.clicks-gallery{position:relative;width:100%;height:80vh;background-color:#f0e6d2;background-image:linear-gradient(45deg,#e6d9c3 25%,transparent 25%),linear-gradient(-45deg,#e6d9c3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e6d9c3 75%),linear-gradient(-45deg,transparent 75%,#e6d9c3 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px;cursor:pointer;overflow:hidden;border-radius:12px;box-shadow:inset 0 0 20px #0000001a,0 0 0 2px #d4c5a8,0 0 0 4px #c4b393;padding:20px}.clicks-gallery .gallery-item{position:absolute;width:200px;background-color:#fff;border-radius:2px;overflow:hidden;transition:all .5s ease;animation:fadeIn .5s ease-out;box-shadow:0 4px 8px #0000001a,0 0 0 1px #0000000d;transform-origin:center center;padding:10px 10px 30px}.clicks-gallery .gallery-item:hover{transform:translate(-50%,-50%) scale(1.05) rotate(2deg);box-shadow:0 8px 16px #00000026,0 0 0 1px #0000000d;z-index:10}.clicks-gallery .gallery-image{width:100%;height:150px;overflow:hidden;background-color:#f8f8f8;border:1px solid rgba(0,0,0,.1)}.clicks-gallery .placeholder-image{width:100%;height:100%;background-color:#e0e0e0;opacity:.8;background-image:linear-gradient(45deg,#d0d0d0 25%,transparent 25%),linear-gradient(-45deg,#d0d0d0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d0d0d0 75%),linear-gradient(-45deg,transparent 75%,#d0d0d0 75%);background-size:10px 10px;background-position:0 0,0 5px,5px -5px,-5px 0px}.clicks-gallery .gallery-caption{padding:8px 4px 0;background-color:#fff;text-align:center}.clicks-gallery .gallery-caption h3{margin:0 0 4px;color:#333;font-size:.9rem;font-family:Courier New,monospace;text-transform:uppercase;letter-spacing:1px}.clicks-gallery .gallery-caption p{margin:0;color:#666;opacity:.8;font-size:.7rem;font-family:Courier New,monospace;line-height:1.3}.preview-box{position:absolute;width:200px;height:225px;border:2px dashed #8b7355;border-radius:2px;pointer-events:none;transition:all .1s ease;background-color:#ffffff1a;padding:10px 10px 30px;box-shadow:0 0 0 1px #0000000d}.preview-box.valid{border-color:#8b7355;background-color:#fff3}.preview-box.invalid{border-color:#c44;background-color:#cc44441a}.click-prompt{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:1.5rem;color:#8b7355;opacity:.7;pointer-events:none;animation:pulse 2s infinite;background-color:#ffffff1a;padding:1rem 2rem;border-radius:8px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);font-family:Courier New,monospace;letter-spacing:2px}@keyframes pulse{0%{opacity:.7}50%{opacity:.3}to{opacity:.7}}.popup-overlay{position:fixed;top:60px;left:0;width:100%;height:calc(100vh - 60px);background-color:#000000d9;display:flex;justify-content:center;align-items:center;z-index:1001}.popup-content{background-color:#fff;border-radius:12px;width:1200px;height:700px;max-width:calc(95vw - 4rem);max-height:calc(95vh - 80px);overflow:hidden;position:relative;animation:scaleIn .3s ease-out;box-shadow:0 4px 20px #0003;margin-top:20px}.popup-close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:2rem;color:var(--color-forest);cursor:pointer;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:50%;padding:.6em;transition:all .3s ease;z-index:1002}.popup-close:hover{background-color:var(--color-terracotta);color:var(--color-cream)}.popup-image{width:100%;height:400px;overflow:hidden}.popup-image .placeholder-image{width:100%;height:100%;background-color:#e0e0e0;opacity:.9}.popup-details{padding:2rem;background-color:#fff}.popup-details h2{color:#333;font-size:2rem;font-family:Courier New,monospace;text-transform:uppercase;letter-spacing:1px;flex:1}.popup-details p{color:#666;font-size:1.1rem;line-height:1.6;opacity:.9;font-family:Courier New,monospace;margin-top:1rem}.popup-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.popup-layout{display:flex;gap:0;width:100%;height:100%}.popup-carousel-section{flex:0 0 700px;display:flex;flex-direction:column;min-width:0}.popup-details{flex:1;padding:2rem;background-color:#fff;overflow-y:auto;min-width:500px;max-width:500px}.carousel-container{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#f8f8f8;border-radius:12px 0 0;overflow:hidden}.carousel-image{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.carousel-img{max-width:100%;max-height:100%;object-fit:contain;object-position:center}.carousel-image .placeholder-image{width:100%;height:100%;background-color:#e0e0e0;opacity:.9}.carousel-button{position:absolute;top:50%;transform:translateY(-50%);background-color:#333;border:none;width:40px;height:40px;border-radius:50%;font-size:24px;color:#e0e0e0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;padding:.6em;z-index:2}.carousel-button:hover{background-color:#444;color:#fff}#root[data-theme=dark] .carousel-button{background-color:#1a1a1a;color:#ccc;border:1px solid #333;animation:fadeInDark .4s ease-in-out forwards}#root[data-theme=dark] .carousel-button:hover{background-color:#333;color:#fff;border-color:#555}.carousel-button.prev{left:20px}.carousel-button.next{right:20px}.image-counter{position:absolute;bottom:20px;right:20px;background-color:#0009;color:#fff;padding:8px 12px;border-radius:20px;font-size:.9rem;z-index:2}.coming-soon{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;text-align:center;padding:2rem;background-color:#f8f8f8;border-radius:12px;box-shadow:0 4px 12px #0000001a;margin:2rem auto;max-width:600px}.coming-soon h2{font-size:3rem;color:#333;margin-bottom:1rem;font-family:Courier New,monospace;letter-spacing:2px;animation:pulse 2s infinite}.coming-soon p{font-size:1.2rem;color:#666;font-family:Courier New,monospace;opacity:.8}.project-technologies{margin-top:2rem;margin-right:1rem;display:flex}.project-technologies-caption{margin-top:1rem;align-items:left}.project-technologies h3{color:#333;font-size:1.2rem;margin-bottom:.5rem;font-family:Courier New,monospace;text-transform:uppercase;letter-spacing:1px}.tech-tags{display:flex;flex-wrap:wrap;gap:.1rem}.tech-tag{background-color:#333;color:#e0e0e0;padding:.25rem .75rem;border-radius:12px;font-size:.8rem;font-family:Courier New,monospace;font-weight:600;border:1px solid #444;transition:all .3s ease}.tech-tag:hover{background-color:#444;color:#fff;border-color:#666}#root[data-theme=dark] .tech-tag{background-color:#1a1a1a;color:#ccc;border-color:#333;animation:fadeInDark .4s ease-in-out forwards}#root[data-theme=dark] .tech-tag:hover{background-color:#333;color:#fff;border-color:#555}.project-links{margin-top:0;display:flex;gap:1rem}.link-buttons{display:flex;flex-wrap:wrap}.link-button{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:50%;text-decoration:none;transition:all .3s ease;font-size:1.5rem;color:#000}.link-button:hover{color:#6c7c8b;transform:translateY(-2px)}.gallery-item.clickable{cursor:pointer;transition:all .3s ease}.gallery-item.clickable:hover{transform:translateY(-8px);box-shadow:0 8px 25px #00000026}#root[data-theme=dark] .gallery-item.clickable:hover{box-shadow:0 8px 25px #ffffff1a}.gallery-item.clickable:active{transform:translateY(-4px)}@media (max-width: 1200px){.popup-content{width:1000px;height:600px;max-width:calc(98vw - 2rem);max-height:calc(95vh - 80px)}.popup-carousel-section{flex:0 0 500px}.popup-details{min-width:500px;max-width:500px}}@media (max-width: 900px){.popup-content{width:800px;height:500px;max-width:calc(98vw - 1rem);max-height:calc(95vh - 80px)}.popup-carousel-section{flex:0 0 400px}.popup-details{min-width:400px;max-width:400px;padding:1.5rem}}@media (max-width: 700px){.popup-layout{flex-direction:column}.popup-content{width:95vw;height:90vh;max-width:95vw;max-height:calc(90vh - 80px)}.popup-carousel-section{flex:0 0 60%;min-height:300px}.popup-details{min-width:100%;max-width:100%;padding:1rem}}.browser-window{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#0f0f1a;z-index:1100;display:flex;flex-direction:column;animation:browserFadeIn .3s ease-out}@keyframes browserFadeIn{0%{opacity:0}to{opacity:1}}.browser-chrome{display:flex;align-items:stretch;background:linear-gradient(180deg,#1e1e2e,#181825);width:100%;min-height:44px;border-bottom:1px solid rgba(255,255,255,.1)}.browser-controls{display:flex;gap:8px;padding:0 1rem;flex-shrink:0;align-items:center;background:#0003}.browser-control{width:14px;height:14px;min-width:14px;min-height:14px;max-width:14px;max-height:14px;border-radius:50%;border:none;padding:0;cursor:pointer;transition:all .2s ease;box-sizing:border-box}.browser-control.close{background-color:#ff5f57}.browser-control.close:hover{background-color:#ff3b30;transform:scale(1.1)}.browser-control.minimize{background-color:#ffbd2e}.browser-control.maximize{background-color:#28c840}.browser-tabs{display:flex;gap:1px;flex:1;overflow-x:auto;overflow-y:hidden;padding:8px 1rem 0 0;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent;align-items:flex-end}.browser-tabs::-webkit-scrollbar{height:4px}.browser-tabs::-webkit-scrollbar-track{background:transparent}.browser-tabs::-webkit-scrollbar-thumb{background:#fff3;border-radius:2px}.browser-tabs::-webkit-scrollbar-thumb:hover{background:#fff6}.browser-tab{display:flex;align-items:center;padding:.6rem 1.5rem;background-color:#ffffff0d;border:none;border-radius:20px 20px 0 0;color:#ffffff80;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:.8rem;cursor:pointer;transition:all .15s ease;white-space:nowrap;flex-shrink:0;margin-bottom:-1px;position:relative;clip-path:polygon(3px 0,calc(100% - 3px) 0,100% 100%,0 100%)}.browser-tab:hover{background-color:#ffffff1a;color:#fffc}.browser-tab.active{background-color:#0f0f1a;color:#fff;clip-path:polygon(3px 0,calc(100% - 3px) 0,100% 100%,0 100%)}.tab-title{white-space:nowrap}.browser-address-bar{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background-color:#0f0f1a;border-bottom:1px solid rgba(255,255,255,.08);width:100%}.address-back-btn{display:flex;align-items:center;justify-content:center;width:30px;height:30px;background-color:transparent;border:none;border-radius:6px;color:#fff9;cursor:pointer;transition:all .2s ease}.address-back-btn:hover{background-color:#ffffff1a;color:#fff}.address-input{flex:1;display:flex;align-items:center;background-color:#ffffff14;padding:.5rem 1rem;border-radius:8px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:.85rem}.address-protocol{color:#fff6}.address-domain{color:#ffffffb3}.browser-content{background-color:#0f0f1a;flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}.browser-content::-webkit-scrollbar{width:10px}.browser-content::-webkit-scrollbar-track{background:#ffffff05}.browser-content::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:5px;border:2px solid #0f0f1a}.browser-content::-webkit-scrollbar-thumb:hover{background:#ffffff40}.browser-page{padding:3rem 5rem;max-width:1100px;margin:0 auto}.browser-section{margin-bottom:2.5rem;padding-bottom:2rem;border-bottom:1px solid rgba(255,255,255,.1)}.browser-section:last-child{border-bottom:none;margin-bottom:0}.browser-section.title-section{text-align:left;padding-bottom:1.5rem}.browser-project-title{font-family:Courier New,monospace;font-size:2.5rem;color:#fff;margin:0 0 .75rem;text-transform:uppercase;letter-spacing:2px;line-height:1.2}.browser-project-tagline{font-family:Courier New,monospace;font-size:1.1rem;color:#ffffffb3;margin:0;line-height:1.5}.browser-section-heading{font-family:Courier New,monospace;font-size:1rem;color:var(--color-terracotta);margin:0 0 1.25rem;text-transform:uppercase;letter-spacing:2px;font-weight:600}.browser-section-text{font-family:Courier New,monospace;font-size:1rem;line-height:1.8;color:#fffc;margin:0}.browser-team-members{display:flex;flex-wrap:wrap;gap:1rem}.browser-team-member{display:flex;align-items:center;gap:.75rem;padding:.75rem 1.25rem;background-color:#ffffff0d;border-radius:8px;border:1px solid rgba(255,255,255,.1);transition:all .3s ease}.browser-team-member:hover{border-color:#fff3;background-color:#ffffff14}.browser-member-avatar{width:40px;height:40px;border-radius:50%;background-color:var(--color-terracotta);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:600;flex-shrink:0}.browser-member-info{display:flex;flex-direction:column;gap:.15rem}.browser-member-name{font-size:.9rem;color:#fff;font-weight:600}.browser-member-role{font-size:.75rem;color:#fff9}.browser-tools-grid{display:flex;flex-wrap:wrap;gap:.5rem}.browser-tool-item{display:inline-flex;align-items:center;padding:.5rem 1rem;background-color:#ffffff0d;border-radius:6px;border:1px solid rgba(255,255,255,.1);transition:all .3s ease}.browser-tool-item:hover{background-color:#fff;border-color:#fff}.browser-tool-item:hover .browser-tool-name{color:#000}.browser-tool-name{font-size:.85rem;color:#fff;font-weight:500;transition:color .3s ease}.browser-gallery-container{display:flex;flex-direction:column;gap:1rem}.browser-main-image-container{display:flex;align-items:center;justify-content:center;gap:1rem}.browser-main-image-wrapper{position:relative;flex:1;max-width:100%;height:350px;display:flex;align-items:center;justify-content:center;background-color:#ffffff0d;border-radius:8px;overflow:hidden}.browser-main-image{max-width:100%;max-height:100%;object-fit:contain}.browser-image-counter{position:absolute;bottom:1rem;right:1rem;background-color:#000000b3;color:#fff;padding:.4rem .8rem;border-radius:4px;font-family:Courier New,monospace;font-size:.8rem}.browser-gallery-nav{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:2px solid rgba(255,255,255,.3);background-color:transparent;color:#fff;font-size:.9rem;cursor:pointer;transition:all .3s ease;flex-shrink:0}.browser-gallery-nav:hover{background-color:#fff;color:#000;border-color:#fff}.browser-thumbnail-strip{display:flex;gap:.5rem;overflow-x:auto;padding:.5rem 0;justify-content:flex-start}.browser-thumbnail{flex-shrink:0;width:60px;height:45px;border-radius:4px;overflow:hidden;border:2px solid rgba(255,255,255,.2);cursor:pointer;transition:all .3s ease;padding:0;background:none}.browser-thumbnail:hover{border-color:#ffffff80}.browser-thumbnail.active{border-color:#fff;border-width:3px}.browser-thumbnail img{width:100%;height:100%;object-fit:cover}.browser-links-container{display:flex;gap:.75rem;flex-wrap:wrap}.browser-project-link{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.25rem;text-decoration:none;font-family:Courier New,monospace;font-size:.85rem;font-weight:600;border-radius:6px;transition:all .3s ease}.browser-project-link.github{background-color:#24292e;color:#fff;border:1px solid #24292e}.browser-project-link.github:hover{background-color:#2f363d;transform:translateY(-2px)}.browser-project-link.live{background-color:var(--color-terracotta);color:#fff;border:1px solid var(--color-terracotta)}.browser-project-link.live:hover{opacity:.9;transform:translateY(-2px)}.browser-project-link.additional{background-color:#4a5568;color:#fff;border:1px solid #4a5568}.browser-project-link.additional:hover{background-color:#5a6578;transform:translateY(-2px)}@media (max-width: 900px){.browser-project-title{font-size:2rem}.browser-tab{padding:.5rem 1rem;font-size:.75rem}.browser-main-image-wrapper{height:300px}.browser-page{padding:2rem 2.5rem}}@media (max-width: 600px){.browser-chrome{min-height:38px}.browser-controls{padding:0 .75rem;gap:6px}.browser-control{width:12px;height:12px;min-width:12px;min-height:12px;max-width:12px;max-height:12px}.browser-tabs{padding:6px .75rem 0 0}.browser-tab{padding:.4rem .75rem;font-size:.7rem;border-radius:8px 8px 0 0}.browser-address-bar{padding:.4rem .75rem}.address-back-btn{width:26px;height:26px}.address-input{font-size:.75rem;padding:.4rem .75rem}.browser-page{padding:1.5rem}.browser-project-title{font-size:1.5rem;letter-spacing:1px}.browser-project-tagline{font-size:.95rem}.browser-section-heading,.browser-section-text{font-size:.9rem}.browser-team-members{flex-direction:column}.browser-main-image-wrapper{height:250px}.browser-gallery-nav{width:32px;height:32px;font-size:.8rem}.browser-thumbnail{width:50px;height:35px}.browser-links-container{flex-direction:column}.browser-project-link{justify-content:center}}.docs-placeholder{display:flex;justify-content:center;align-items:flex-start;padding-top:3rem}.docs-placeholder-content{background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:24px;padding:5rem 8rem;text-align:center;box-shadow:0 4px 24px #0000000f;animation:placeholderFadeIn 1s ease-out}.docs-placeholder-text{font-family:SF Mono,Fira Code,Roboto Mono,Courier New,monospace;font-size:1.6rem;font-weight:500;color:#999;letter-spacing:1.5px;text-transform:lowercase}@keyframes placeholderFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.postit-board{min-height:70vh;padding:2rem;display:flex;justify-content:center;align-items:center}.postit-container{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem;max-width:1000px;padding:2rem}.postit{width:220px;min-height:220px;padding:1.5rem;position:relative;cursor:pointer;box-shadow:2px 2px 8px #00000026,inset 0 -40px 40px -40px #0000000d;transition:all .3s ease;animation:postItDrop .5s ease-out backwards}@keyframes postItDrop{0%{opacity:0;transform:translateY(-30px) rotate(0)}to{opacity:1}}.postit:hover{transform:scale(1.05) rotate(0)!important;box-shadow:4px 4px 15px #00000040,inset 0 -40px 40px -40px #0000000d;z-index:10}.postit-tape{position:absolute;top:-10px;left:50%;transform:translate(-50%);width:60px;height:20px;background:#fff9;opacity:.7}.postit-title{font-family:Courier New,monospace;font-size:1.1rem;font-weight:700;color:#333;margin:.5rem 0 .75rem;line-height:1.3}.postit-date{font-family:Courier New,monospace;font-size:.75rem;color:#666;margin:0 0 1rem}.postit-excerpt{font-family:Courier New,monospace;font-size:.85rem;color:#444;line-height:1.5;margin:0}.book-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:linear-gradient(135deg,#5c4033,#3e2723,#2c1810);z-index:1100;display:flex;justify-content:center;align-items:center;animation:bookFadeIn .4s ease-out}@keyframes bookFadeIn{0%{opacity:0}to{opacity:1}}.book-container{position:relative;width:100%;max-width:800px;height:90vh;display:flex;justify-content:center;align-items:center;padding:2rem;perspective:1500px}.book-close{position:absolute;top:1rem;right:1rem;background:#ffffff26;border:none;font-size:2rem;color:#fff;cursor:pointer;width:50px;height:50px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease;z-index:10}.book-close:hover{background:#ffffff40;transform:scale(1.1)}.book{display:flex;align-items:center;gap:1.5rem;width:100%;height:100%;position:relative}.book-page-wrapper{flex:1;height:100%;position:relative;transform-style:preserve-3d}.book-page{width:100%;height:100%;background:#fff;border-radius:2px 8px 8px 2px;padding:0;box-shadow:0 0 30px #0006,5px 5px 20px #0000004d;position:relative;overflow:hidden;display:flex;flex-direction:column;transform-origin:left center;transition:transform .6s ease-in-out}.book-page.flipping-next{animation:flipNext .6s ease-in-out}.book-page.flipping-prev{animation:flipPrev .6s ease-in-out}@keyframes flipNext{0%{transform:rotateY(0)}50%{transform:rotateY(-90deg)}51%{transform:rotateY(90deg)}to{transform:rotateY(0)}}@keyframes flipPrev{0%{transform:rotateY(0)}50%{transform:rotateY(90deg)}51%{transform:rotateY(-90deg)}to{transform:rotateY(0)}}.book-page:before{content:"";position:absolute;left:60px;top:0;bottom:0;width:2px;background:#ffb3b3;z-index:1}.book-page:after{content:"";position:absolute;left:0;top:0;right:0;bottom:0;background-image:repeating-linear-gradient(transparent,transparent 31px,#e0e0e0 31px,#e0e0e0 32px);pointer-events:none;z-index:0}.notebook-holes{position:absolute;left:15px;top:0;bottom:0;width:30px;display:flex;flex-direction:column;justify-content:space-evenly;padding:20px 0;z-index:2}.notebook-hole{width:20px;height:20px;background:#3e2723;border-radius:50%;box-shadow:inset 2px 2px 4px #0000004d}.page-inner{flex:1;display:flex;flex-direction:column;padding:2rem 2.5rem 2rem 80px;overflow-y:auto;position:relative;z-index:1}.page-header{padding-bottom:1rem;margin-bottom:1rem}.page-title{font-family:Caveat,Comic Sans MS,cursive;font-size:2.2rem;color:#1a237e;margin:0 0 .5rem;line-height:1.4;font-weight:700}.page-date{font-family:Caveat,Comic Sans MS,cursive;font-size:1.1rem;color:#666;margin:0}.page-content{flex:1;overflow-y:auto;padding-right:1rem}.page-content p{font-family:Caveat,Comic Sans MS,cursive;font-size:1.4rem;color:#1a1a2e;line-height:2;margin:0 0 .5rem;text-align:left}.page-content .page-subheading{font-family:Caveat,Comic Sans MS,cursive;font-size:1.5rem;color:#c62828;font-weight:700;margin:1rem 0 .5rem;text-decoration:underline}.page-number{text-align:right;font-family:Caveat,Comic Sans MS,cursive;font-size:1.2rem;color:#666;padding-top:1rem;margin-top:auto;padding-right:1rem}.page-turn{display:flex;align-items:center;justify-content:center;width:55px;height:55px;background:#ffffff26;border:2px solid rgba(255,255,255,.3);border-radius:50%;color:#fff;font-size:1.3rem;cursor:pointer;transition:all .3s ease;flex-shrink:0}.page-turn:hover{background:#ffffff40;border-color:#ffffff80;transform:scale(1.1)}.page-turn:active{transform:scale(.95)}@media (max-width: 768px){.postit-container{gap:1.5rem;padding:1rem}.postit{width:180px;min-height:180px;padding:1.25rem}.postit-title{font-size:1rem}.book-container{padding:1rem}.page-inner{padding:1.5rem 1.5rem 1.5rem 70px}.page-title{font-size:1.8rem}.page-content p{font-size:1.2rem;line-height:1.9}.page-turn{width:45px;height:45px;font-size:1rem}.notebook-holes{left:10px}.notebook-hole{width:16px;height:16px}.book-page:before{left:50px}}@media (max-width: 480px){.postit{width:160px;min-height:160px;padding:1rem}.postit-title{font-size:.9rem}.postit-excerpt{font-size:.8rem}.page-inner{padding:1rem 1rem 1rem 55px}.page-title{font-size:1.4rem}.page-content p{font-size:1.1rem;line-height:1.8}.page-content .page-subheading{font-size:1.2rem}.page-turn{width:38px;height:38px}.book-close{width:40px;height:40px;font-size:1.5rem}.notebook-holes{left:8px}.notebook-hole{width:14px;height:14px}.book-page:before{left:40px}.book{gap:.75rem}}