:root{--spice-orange: #c8692a;--spice-deep: #8b3a0f;--spice-gold: #e8a84c;--sand: #d4a96a;--sand-light: #f0d4a0;--space-dark: #04060f;--space-mid: #080d1a;--hud-cyan: #4af0e8;--hud-cyan-dim: rgba(74, 240, 232, .15);--text-primary: #f0e8d8;--text-dim: rgba(240, 232, 216, .6);--glass: rgba(8, 13, 26, .75);--glass-border: rgba(74, 240, 232, .2)}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--space-dark);color:var(--text-primary);font-family:Crimson Pro,serif;overflow:hidden;height:100vh;width:100vw}#root{width:100vw;height:100vh;overflow:hidden}.star-canvas{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0}.planet-canvas{position:fixed;bottom:0;left:0;right:0;height:100vh;z-index:10;pointer-events:none}.label-canvas{position:fixed;bottom:0;left:0;right:0;height:20vh;z-index:15;pointer-events:none}nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:1.2rem 2.5rem;background:linear-gradient(to bottom,rgba(4,6,15,.95),transparent)}.nav-logo{font-family:Cinzel,serif;font-size:1.3rem;letter-spacing:.25em;color:var(--spice-gold);text-transform:uppercase}.nav-logo span{color:var(--hud-cyan);font-size:.82rem;display:block;letter-spacing:.4em;margin-top:2px;font-family:Share Tech Mono,monospace}.nav-links{display:flex;gap:.25rem;list-style:none}.nav-links li button{background:none;border:none;color:var(--text-dim);font-family:Share Tech Mono,monospace;font-size:.85rem;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;padding:.5rem .9rem;position:relative;transition:color .3s}.nav-links li button:after{content:"";position:absolute;bottom:0;left:50%;right:50%;height:1px;background:var(--hud-cyan);transition:left .3s,right .3s}.nav-links li button:hover,.nav-links li button.active{color:var(--hud-cyan)}.nav-links li button:hover:after,.nav-links li button.active:after{left:.9rem;right:.9rem}.hud-corner{position:fixed;z-index:50;width:60px;height:60px;opacity:.4}.hud-corner svg{width:100%;height:100%}.hud-tl{top:0;left:0}.hud-tr{top:0;right:0;transform:scaleX(-1)}.transition-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:500;background:var(--space-dark);opacity:0;pointer-events:none;transition:opacity .4s}.transition-overlay.active{opacity:.7;pointer-events:all}.content-area{position:fixed;top:0;left:0;right:0;bottom:0;z-index:80;display:flex;align-items:center;pointer-events:none}.hero-panel{padding:0 4rem;max-width:580px;pointer-events:all;opacity:0;transform:translateY(20px);transition:opacity .8s ease .3s,transform .8s ease .3s}.hero-panel.visible{opacity:1;transform:translateY(0)}.hero-eyebrow{font-family:Share Tech Mono,monospace;font-size:.82rem;letter-spacing:.5em;color:var(--hud-cyan);text-transform:uppercase;margin-bottom:1rem;display:flex;align-items:center;gap:1rem}.hero-eyebrow:before{content:"";display:inline-block;width:30px;height:1px;background:var(--hud-cyan)}.hero-name{font-family:Cinzel,serif;font-size:clamp(3.3rem,5.3vw,4.9rem);font-weight:700;line-height:1;color:var(--text-primary);margin-bottom:.5rem}.hero-name .accent{color:var(--spice-gold)}.hero-title{font-family:Cinzel,serif;font-size:1.15rem;color:var(--spice-orange);letter-spacing:.2em;text-transform:uppercase;margin-bottom:1.75rem}.hero-desc{font-size:1.2rem;line-height:1.8;color:var(--text-dim);margin-bottom:2rem;max-width:440px}.hero-ctas{display:flex;gap:1rem}.btn-primary{background:var(--spice-orange);border:none;color:var(--space-dark);font-family:Share Tech Mono,monospace;font-size:.85rem;letter-spacing:.25em;text-transform:uppercase;padding:.85rem 1.75rem;cursor:pointer;transition:background .3s}.btn-primary:hover{background:var(--spice-gold)}.btn-outline{background:none;border:1px solid var(--glass-border);color:var(--text-dim);font-family:Share Tech Mono,monospace;font-size:.85rem;letter-spacing:.25em;text-transform:uppercase;padding:.85rem 1.75rem;cursor:pointer;transition:border-color .3s,color .3s}.btn-outline:hover{border-color:var(--hud-cyan);color:var(--hud-cyan)}.panel-wrapper{position:fixed;top:0;left:0;right:0;bottom:0;padding:5rem 3rem 2rem;z-index:80}.content-panel{width:min(520px,90vw);max-height:100%;overflow-y:auto;background:var(--glass);border:1px solid var(--glass-border);border-radius:2px;padding:2.5rem;pointer-events:all;opacity:0;transform:translate(40px);transition:opacity .6s ease,transform .6s ease;scrollbar-width:thin;scrollbar-color:var(--spice-orange) transparent;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 0 60px #4af0e80d,inset 0 0 40px #080d1a80}.content-panel.visible{opacity:1;transform:translate(0)}.content-panel::-webkit-scrollbar{width:3px}.content-panel::-webkit-scrollbar-track{background:transparent}.content-panel::-webkit-scrollbar-thumb{background:var(--spice-orange);border-radius:2px}.panel-tag{font-family:Share Tech Mono,monospace;font-size:.7rem;letter-spacing:.4em;color:var(--hud-cyan);text-transform:uppercase;margin-bottom:.75rem;display:flex;align-items:center;gap:.75rem}.panel-tag:before{content:"";display:inline-block;width:20px;height:1px;background:var(--hud-cyan)}h1.panel-title{font-family:Cinzel,serif;font-size:2.1rem;font-weight:600;color:var(--spice-gold);line-height:1.2;margin-bottom:1.5rem}h2.section-title{font-family:Cinzel,serif;font-size:1.3rem;color:var(--spice-gold);margin:1.5rem 0 .75rem;letter-spacing:.05em}.panel-body p{font-size:1.15rem;line-height:1.75;color:var(--text-primary);margin-bottom:1rem;font-weight:300}.panel-body p em{color:var(--spice-gold);font-style:italic}.skills-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:.5rem 0 1.5rem}.skill-tag{font-family:Share Tech Mono,monospace;font-size:.82rem;padding:.4rem .75rem;border:1px solid var(--glass-border);color:var(--sand-light);letter-spacing:.05em;background:rgba(74,240,232,.04);transition:border-color .2s,color .2s}.skill-tag:hover{border-color:var(--hud-cyan);color:var(--hud-cyan)}.skill-tag.highlight{border-color:#c8692a80;color:var(--spice-gold)}.timeline{margin:.5rem 0 1.5rem}.timeline-item{padding:0 0 1.5rem 1.25rem;border-left:1px solid var(--glass-border);position:relative}.timeline-item:before{content:"";position:absolute;left:-3px;top:6px;width:5px;height:5px;border-radius:50%;background:var(--hud-cyan);box-shadow:0 0 6px var(--hud-cyan)}.timeline-date{font-family:Share Tech Mono,monospace;font-size:.76rem;color:var(--hud-cyan);letter-spacing:.1em;margin-bottom:.25rem}.timeline-role{font-family:Cinzel,serif;font-size:1rem;color:var(--spice-gold);margin-bottom:.25rem}.timeline-company{font-size:.94rem;color:var(--sand);margin-bottom:.5rem}.timeline-desc{font-size:1.05rem;color:var(--text-dim);line-height:1.6}.hobby-cards{display:flex;flex-direction:column;gap:1rem;margin-top:.5rem}.hobby-card{border:1px solid var(--glass-border);padding:1rem 1.25rem;background:rgba(74,240,232,.03);transition:border-color .3s}.hobby-card:hover{border-color:#c8692a80}.hobby-card-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.5rem}.hobby-icon{font-size:1.65rem}.hobby-name{font-family:Cinzel,serif;font-size:1.05rem;color:var(--spice-gold)}.hobby-card p{font-size:1rem;margin-bottom:0;color:var(--text-dim)}.contact-form{margin-top:.5rem}.form-group{margin-bottom:1rem}.form-group label{display:block;font-family:Share Tech Mono,monospace;font-size:.76rem;letter-spacing:.2em;color:var(--hud-cyan);text-transform:uppercase;margin-bottom:.4rem}.form-group input,.form-group textarea{width:100%;background:rgba(74,240,232,.04);border:1px solid var(--glass-border);color:var(--text-primary);font-family:Crimson Pro,serif;font-size:1.1rem;padding:.6rem .85rem;outline:none;transition:border-color .2s;resize:none;border-radius:0}.form-group input:focus,.form-group textarea:focus{border-color:var(--hud-cyan)}.form-group textarea{min-height:90px}.btn-transmit{width:100%;background:none;border:1px solid var(--spice-orange);color:var(--spice-gold);font-family:Share Tech Mono,monospace;font-size:.88rem;letter-spacing:.3em;text-transform:uppercase;padding:.8rem;cursor:pointer;transition:background .3s,color .3s;margin-top:.5rem}.btn-transmit:hover{background:var(--spice-orange);color:var(--space-dark)}.badge{display:inline-block;font-family:Share Tech Mono,monospace;font-size:.7rem;letter-spacing:.1em;padding:.25rem .6rem;border:1px solid var(--spice-orange);color:var(--spice-gold);margin-bottom:.75rem}.msg-status{font-family:Share Tech Mono,monospace;font-size:.82rem;letter-spacing:.1em;padding:.6rem;text-align:center;margin-top:.5rem}.msg-status.success{color:var(--hud-cyan);border:1px solid var(--glass-border)}.msg-status.error{color:var(--spice-orange);border:1px solid rgba(200,105,42,.3)}.info-btn{position:fixed;bottom:1rem;right:1.5rem;z-index:200;background:none;border:none;color:var(--text-dim);font-family:Share Tech Mono,monospace;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;padding:.3rem 0;transition:color .2s}.info-btn:hover{color:var(--hud-cyan)}.info-popup{position:fixed;bottom:3rem;right:1.5rem;z-index:200;width:min(300px,calc(100vw - 3rem));background:var(--glass);border:1px solid var(--glass-border);padding:1.25rem 1.25rem 1rem;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 0 40px #4af0e80f}.info-popup-close{position:absolute;top:.6rem;right:.75rem;background:none;border:none;color:var(--text-dim);font-size:.7rem;cursor:pointer;padding:.2rem;transition:color .2s}.info-popup-close:hover{color:var(--hud-cyan)}.info-popup-heading{font-family:Cinzel,serif;font-size:.85rem;color:var(--spice-gold);letter-spacing:.08em;margin-bottom:.75rem}.info-popup p{font-size:.82rem;line-height:1.65;color:var(--text-dim);margin-bottom:.6rem}.info-popup p:last-child{margin-bottom:0}.info-popup strong{color:var(--text-primary);font-weight:600}@media (max-width: 768px){nav{padding:.65rem 1rem .4rem;flex-wrap:wrap;gap:.2rem;background:linear-gradient(to bottom,rgba(4,6,15,.98) 60%,transparent)}.nav-logo{font-size:1rem;letter-spacing:.15em;white-space:nowrap}.nav-logo span{display:none}.nav-links{width:100%;justify-content:space-between;gap:0}.nav-links li button{font-size:.6rem;letter-spacing:.04em;padding:.3rem 0}.nav-links li button:hover:after,.nav-links li button.active:after{left:0;right:0}.content-area{bottom:20vh}.panel-wrapper{bottom:20vh;padding:5.5rem .75rem 1.5rem}.hero-panel{padding:0 1.25rem}.content-panel{width:min(96vw,520px);padding:1.25rem}.hero-name{font-size:2.2rem}.hero-title{font-size:.95rem;letter-spacing:.12em}.hero-desc{font-size:1.05rem}h1.panel-title{font-size:1.7rem}h2.section-title{font-size:1.1rem}.panel-body p{font-size:1rem}}
