*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{color:#e0e0e0;background-color:#212121;min-height:100vh;margin:0;padding:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;overflow-x:hidden}#root{width:100%;min-height:100vh;position:relative}.app-container{width:100%;min-height:200vh;position:relative}.threejs-canvas{z-index:0;pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0}.loading-screen{z-index:999;will-change:opacity, transform, filter;-webkit-user-select:none;user-select:none;background-color:#212121;justify-content:center;align-items:center;transition:opacity .65s cubic-bezier(.16,1,.3,1),transform .65s cubic-bezier(.16,1,.3,1),filter .65s;display:flex;position:fixed;inset:0}.loading-screen.fading-out{opacity:0;filter:blur(8px);pointer-events:none;transform:scale(1.04)}@keyframes blinkCursor{50%{border-right-color:#0000}}@keyframes typeAndDelete{0%,10%{width:0}45%,55%{width:6.2em}90%,to{width:0}}.terminal-loader{color:#00ff41;box-sizing:border-box;-webkit-user-select:none;user-select:none;background-color:#1a1a1a;border:.1em solid #333;border-radius:8px;width:13em;padding:1.5em 1em;font-family:Courier New,Courier,monospace;font-size:1.1em;position:relative;overflow:hidden;box-shadow:0 12px 32px #0009,0 0 20px #00ff4114}.terminal-header{box-sizing:border-box;background-color:#2a2a2a;border-top-left-radius:7px;border-top-right-radius:7px;height:1.6em;padding:0 .5em;position:absolute;top:0;left:0;right:0}.terminal-controls{float:right;line-height:1.6em}.control{vertical-align:middle;background-color:#666;border-radius:50%;width:.65em;height:.65em;margin-left:.35em;display:inline-block}.control.close{background-color:#f55}.control.minimize{background-color:#ffbd2e}.control.maximize{background-color:#50fa7b}.terminal-title{float:left;color:#999;font-size:.85em;font-weight:600;line-height:1.6em}.terminal-text{white-space:nowrap;letter-spacing:.05em;border-right:.2em solid #00ff41;margin-top:1.2em;font-weight:600;animation:3.2s steps(11,end) infinite typeAndDelete,.5s step-end infinite alternate blinkCursor;display:inline-block;overflow:hidden}.ambient-glow{pointer-events:none;z-index:0;-webkit-user-select:none;user-select:none;background-image:radial-gradient(circle at 50% 35%,#00ff410a 0%,#0000 60%),radial-gradient(circle at 80% 75%,#00ff4106 0%,#0000 50%),radial-gradient(circle at 20% 85%,#ffffff05 0%,#0000 40%);background-attachment:fixed;animation:12s ease-in-out infinite alternate ambientBreathe;position:fixed;inset:0}@keyframes ambientBreathe{0%{opacity:.85;transform:scale(1)}to{opacity:1.15;transform:scale(1.05)}}.dust-container{-webkit-user-select:none;user-select:none;pointer-events:none;z-index:1;position:fixed;inset:0;overflow:hidden}.dust-particle{filter:blur(.4px);will-change:transform, opacity;background-color:#00ff4180;border-radius:50%;animation-name:floatDust;animation-timing-function:ease-in-out;animation-iteration-count:infinite;position:absolute;box-shadow:0 0 3px #00ff4140}@keyframes floatDust{0%{opacity:0;transform:translate(0,0)}20%{opacity:var(--target-opacity)}50%{transform:translate3d(calc(var(--drift-x) * .55), calc(var(--drift-y) * .5), 0);opacity:calc(var(--target-opacity) * .8)}80%{opacity:var(--target-opacity)}to{transform:translate3d(var(--drift-x), var(--drift-y), 0);opacity:0}}.hero-wrapper{z-index:2;will-change:opacity, transform;justify-content:center;align-items:center;width:100%;height:100vh;display:flex;position:sticky;top:0;left:0}.hero-container{text-align:center;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:2rem;display:flex;position:relative}.hero-content{z-index:10;flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.speech-bubble{cursor:default;-webkit-user-select:none;user-select:none;background-color:#333;border:3.5px solid #00ff41;border-radius:16px;width:max-content;max-width:min(90vw,360px);margin-bottom:1.25rem;padding:.65rem 1.25rem;transition:transform .25s,box-shadow .25s;animation:.6s cubic-bezier(.16,1,.3,1) both bubblePop,4s ease-in-out .6s infinite bubbleFloat;position:relative;box-shadow:0 10px 24px #00000080,0 2px 6px #00000040,0 0 15px #00ff4126}.speech-bubble:hover{transform:translateY(-4px)scale(1.03);box-shadow:0 14px 28px #0009,0 4px 10px #00000059,0 0 20px #00ff4140}.speech-text{color:#e0e0e0;letter-spacing:-.01em;white-space:normal;word-break:break-word;-webkit-user-select:none;user-select:none;font-size:clamp(.85rem,2.2vw,1.05rem);font-weight:750;display:inline-block}.speech-dot{opacity:.6;margin:0 .35rem;font-weight:900}.speech-tail{pointer-events:none;-webkit-user-select:none;user-select:none;width:28px;height:22px;position:absolute;bottom:-18px;left:28px}.speech-tail svg{width:100%;height:100%;display:block}@keyframes bubblePop{0%{opacity:0;transform:translateY(15px)scale(.85)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes bubbleFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.text{color:#666;cursor:pointer;letter-spacing:.04em;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;margin:0;font-size:clamp(3rem,10vw,6.5rem);font-weight:800}.text span{-webkit-user-select:none;user-select:none;transition:transform .4s cubic-bezier(.16,1,.3,1),color .35s,text-shadow .35s;display:inline-block}.text span:hover{color:#00ff41;text-shadow:0 0 20px #00ff4199,0 0 45px #00ff414d;transform:scale(1.15)translateY(-10px)}.scroll-explore{cursor:pointer;-webkit-user-select:none;user-select:none;z-index:10;flex-direction:column;align-items:center;gap:.4rem;transition:transform .3s;display:flex;position:absolute;bottom:2.25rem;left:50%;transform:translate(-50%)}.scroll-text{letter-spacing:.08em;text-transform:uppercase;color:#666;white-space:nowrap;-webkit-user-select:none;user-select:none;font-size:clamp(1.4rem,3.2vw,2.2rem);font-weight:800;transition:color .35s,text-shadow .35s}.scroll-arrow{color:#666;-webkit-user-select:none;user-select:none;font-size:clamp(1.2rem,2.5vw,1.8rem);line-height:1;transition:color .35s,text-shadow .35s;animation:2s ease-in-out infinite scrollBounce}.scroll-explore:hover .scroll-text,.scroll-explore:hover .scroll-arrow{color:#00ff41;text-shadow:0 0 20px #00ff4199,0 0 45px #00ff414d}.scroll-explore:hover{transform:translate(-50%)translateY(4px)}@keyframes scrollBounce{0%,to{transform:translateY(0)}50%{transform:translateY(8px)}}.demo-wrapper{z-index:5;will-change:opacity, transform;justify-content:center;align-items:center;min-height:100vh;padding:4rem 2rem 6rem;display:flex;position:relative}.demo-section{justify-content:center;align-items:center;width:100%;display:flex}.demo-container{text-align:center;width:100%;max-width:1100px;margin:0 auto}.demo-badge{text-transform:uppercase;letter-spacing:.12em;color:#00ff41;-webkit-user-select:none;user-select:none;background:#00ff4114;border:1px solid #00ff4140;border-radius:999px;margin-bottom:1.25rem;padding:.4rem 1rem;font-size:.8rem;font-weight:750;transition:all .3s;display:inline-block}.demo-badge:hover{background:#00ff4126;border-color:#00ff4166;box-shadow:0 0 20px #00ff4133}.demo-title{color:#666;letter-spacing:.04em;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;cursor:pointer;margin:0 0 1rem;font-size:clamp(2.4rem,6vw,4.2rem);font-weight:800}.demo-title span{-webkit-user-select:none;user-select:none;transition:transform .4s cubic-bezier(.16,1,.3,1),color .35s,text-shadow .35s;display:inline-block}.demo-title span:hover{color:#00ff41;text-shadow:0 0 20px #00ff4199,0 0 45px #00ff414d;transform:scale(1.15)translateY(-8px)}.title-space{width:.75rem}.demo-subtitle{color:#999;-webkit-user-select:none;user-select:none;max-width:600px;margin:0 auto 3.5rem;font-size:clamp(1rem,2vw,1.2rem);line-height:1.6}.demo-grid{text-align:left;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));align-items:start;gap:1.75rem;display:grid}.demo-card{--card-accent:#00ff41;--card-accent-soft:#00ff410f;--card-accent-edge:#00ff4126;-webkit-backdrop-filter:blur(16px);-webkit-user-select:none;user-select:none;background:#1a1a1ad9;border:1px solid #00ff4126;border-radius:20px;flex-direction:column;padding:2.25rem 2rem;display:flex;position:relative;overflow:hidden;box-shadow:0 12px 32px #00000059}.demo-card:before{content:"";background:linear-gradient(90deg,#0000,#00ff4166,#0000);height:1px;position:absolute;top:0;left:0;right:0}.card-icon{-webkit-user-select:none;user-select:none;margin-bottom:1.25rem;font-size:2.2rem}.demo-card h3{color:#ccc;-webkit-user-select:none;user-select:none;margin:0 0 .75rem;font-size:1.4rem;font-weight:700}.demo-card p{color:#999;margin:0 0 1rem;font-size:.95rem;line-height:1.6}.card-footer{justify-content:space-between;align-items:center;margin-top:auto;display:flex}.card-tag{color:var(--card-accent);background:var(--card-accent-soft);border:1px solid var(--card-accent-edge);-webkit-user-select:none;user-select:none;border-radius:8px;margin-top:auto;padding:.3rem .75rem;font-size:.75rem;font-weight:600;transition:all .3s}.card-arrow{color:#666;-webkit-user-select:none;user-select:none;font-size:1.2rem;transition:color .3s,transform .3s}.demo-card:hover .card-arrow{color:#00ff41;transform:translate(3px,-3px)}.card-visit{white-space:nowrap;letter-spacing:.05em;color:var(--card-accent);background:var(--card-accent-soft);border:1px solid var(--card-accent-edge);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:999px;align-self:flex-start;align-items:center;gap:.5rem;margin:0 0 .9rem;padding:.5rem 1.05rem;font-size:.8rem;font-weight:700;text-decoration:none;animation:2.4s ease-in-out .55s infinite cardVisitGlow;display:inline-flex;position:relative;overflow:hidden}.card-visit:after{content:"";pointer-events:none;background:linear-gradient(105deg,#0000,#ffffff38,#0000);width:45%;animation:2.4s cubic-bezier(.16,1,.3,1) .55s infinite cardVisitSheen;position:absolute;top:0;bottom:0;left:0;transform:translate(-160%)skew(-20deg)}.card-visit-arrow{font-size:1rem;line-height:1;animation:2.4s ease-in-out .55s infinite cardVisitNudge;display:inline-block}.card-visit:hover{filter:brightness(1.1);background:#00ff4124;border-color:#00ff4166}.card-visit:focus-visible{outline:2px solid var(--card-accent);outline-offset:3px}@keyframes cardVisitGlow{0%,to{box-shadow:0 0 #00ff4100}50%{box-shadow:0 0 16px #00ff4159}}@keyframes cardVisitSheen{0%,55%{transform:translate(-160%)skew(-20deg)}to{transform:translate(220%)skew(-20deg)}}@keyframes cardVisitNudge{0%,70%,to{transform:translate(0)}85%{transform:translate(4px)}}@media (prefers-reduced-motion:reduce){.card-visit,.card-visit:after,.card-visit-arrow{animation:none!important}}@media (width<=768px){.hero-container{padding:1.5rem}.text{letter-spacing:.03em;font-size:clamp(2.5rem,12vw,4.5rem)}.scroll-explore{bottom:1.75rem}.scroll-text{font-size:clamp(1.1rem,4vw,1.6rem)}.demo-wrapper{padding:3rem 1.5rem 4rem}.demo-title{font-size:clamp(2rem,7vw,3.2rem)}.demo-subtitle{margin:0 auto 2.5rem;font-size:clamp(.95rem,2.5vw,1.1rem)}.demo-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.25rem}.demo-card{padding:1.75rem 1.5rem}.demo-card h3{font-size:1.25rem}.demo-card p{font-size:.9rem}.card-visit{padding:.45rem .95rem}}@media (width<=480px){.hero-container{padding:1rem}.speech-bubble{border-width:3px;max-width:92vw;padding:.55rem 1rem}.speech-text{font-size:clamp(.75rem,3.5vw,.9rem)}.text{letter-spacing:.02em;font-size:clamp(2rem,14vw,3.5rem)}.text span:hover{transform:scale(1.1)translateY(-6px)}.scroll-explore{bottom:1.5rem}.scroll-text{letter-spacing:.06em;font-size:clamp(.95rem,4.5vw,1.3rem)}.scroll-arrow{font-size:clamp(1rem,4vw,1.4rem)}.demo-wrapper{padding:2.5rem 1rem 3.5rem}.demo-badge{margin-bottom:1rem;padding:.35rem .85rem;font-size:.7rem}.demo-title{margin:0 0 .75rem;font-size:clamp(1.7rem,8vw,2.6rem)}.demo-subtitle{margin:0 auto 2rem;font-size:clamp(.85rem,3.5vw,1rem);line-height:1.5}.demo-grid{grid-template-columns:1fr;gap:1rem}.demo-card{border-radius:16px;padding:1.5rem 1.25rem}.card-icon{margin-bottom:1rem;font-size:1.8rem}.demo-card h3{margin:0 0 .6rem;font-size:1.15rem}.demo-card p{font-size:.85rem;line-height:1.55}.card-tag{padding:.25rem .6rem;font-size:.7rem}.card-visit{padding:.4rem .85rem;font-size:.75rem}.card-arrow{font-size:1rem}.demo-card:hover{transform:translateY(-4px)}}@media (width<=360px){.text{font-size:clamp(1.7rem,15vw,2.4rem)}.speech-bubble{max-width:95vw}.demo-card{padding:1.25rem 1rem}.demo-title{font-size:clamp(1.5rem,9vw,2.2rem)}}
