*{box-sizing:border-box}body,html,#root{color:#fff;background-color:#050510;width:100vw;height:100vh;margin:0;padding:0;font-family:Inter,system-ui,sans-serif;overflow:hidden}h1,h2,header,section{font-size:inherit;font-weight:inherit;margin:0;padding:0}.global-header{z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);pointer-events:none;background:#050510bf;border-bottom:1px solid #00ffcc26;align-items:center;padding:10px 20px;display:flex;position:fixed;top:0;left:0;right:0}.global-header-text{pointer-events:none;flex-direction:column;align-items:center;gap:2px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.global-header-name{letter-spacing:5px;color:#ffffffd9;text-transform:uppercase;text-shadow:0 0 8px #00ffcc40;font-size:1.56rem;font-weight:900;line-height:1.1;animation:4s ease-in-out infinite headerNamePulse}@keyframes headerNamePulse{0%,to{text-shadow:0 0 4px #0fc3,0 0 10px #00ffcc14}50%{text-shadow:0 0 8px #00ffcc80,0 0 20px #0fc3,0 0 35px #00ffcc12}}.global-header-role{letter-spacing:3px;color:#00ffccb3;text-transform:uppercase;margin-top:-2px;font-size:.65rem;font-weight:700}@keyframes headerGlow{0%,to{text-shadow:0 0 2px #00ffccb3,0 0 5px #00ffcc4d}50%{text-shadow:0 0 5px #0fc,0 0 12px #00ffcc80,0 0 20px #00ffcc26}}.global-header-accent{color:#0fc;animation:3.5s ease-in-out infinite headerGlow}.cv-download-btn{color:#0fc;letter-spacing:1.2px;white-space:nowrap;pointer-events:auto;text-transform:uppercase;background:#00ffcc1a;border:1px solid #0fc9;border-radius:6px;margin-left:auto;padding:8px 18px;font-size:.85rem;font-weight:800;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #00ffcc1a}.cv-download-btn:hover{color:#fff;background:#00ffcc40;border-color:#0fc;transform:translateY(-1px);box-shadow:0 0 20px #0fc6}.path-tracker{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.path-node{letter-spacing:1px;color:#3a3a50;background:#00000080;border:1px solid #2a2a3a;border-radius:4px;padding:3px 7px;font-size:.6rem;font-weight:700;transition:all .4s}.path-node.visited{color:#0fc;border-color:#0fc9;box-shadow:0 0 8px #00ffcc40}.hud-top-right{grid-area:1/3;justify-content:flex-end;display:flex}.gem-counter{letter-spacing:3px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0000008c;border:1px solid #ffffff1a;border-radius:10px;padding:8px 14px;font-size:.7rem;font-weight:900}@keyframes blinkOn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.hud-container{pointer-events:none;z-index:15;grid-template-rows:auto 1fr auto;grid-template-columns:1fr 1fr 1fr;width:100vw;height:100vh;padding:52px 30px 30px;display:grid;position:absolute;top:0;left:0}.hud-top-left{pointer-events:auto;flex-direction:column;grid-area:1/1;align-items:flex-start;gap:12px;display:flex}.hud-bottom-center{pointer-events:none;color:#0fc;letter-spacing:1.5px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);text-align:center;background:#0009;border:1px solid #00ffcc4d;border-radius:8px;grid-area:3/2;place-self:end center;padding:10px 20px;font-size:.8rem;font-weight:700}.hud-bottom-right{color:#ffb703;text-shadow:0 0 10px #ffb703;background:#0009;border:1px solid #ffb70366;border-radius:8px;grid-area:3/3;place-self:end;padding:10px 20px;font-size:1.5rem;font-weight:700}@keyframes scorePop{0%{transform:scale(1)}40%{color:#fff;text-shadow:0 0 12px #ffb703;transform:scale(1.5)}to{transform:scale(1)}}.score-value{animation:.4s ease-out scorePop;display:inline-block}.btn-hub{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);letter-spacing:1px;white-space:nowrap;background:#ffffff14;border:1px solid #ffffff40;border-radius:8px;margin-top:12px;padding:9px 22px;font-size:.8rem;font-weight:700;transition:all .2s}.btn-hub:hover{background:#ffffff2e;border-color:#fff}.section-panel-container{z-index:10;pointer-events:none;align-items:center;height:100vh;padding:60px 20px 30px;display:flex;position:absolute;top:0;left:0}.section-panel{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);pointer-events:none;scrollbar-width:none;background:#0a0a0ab8;border:1px solid #0fc;border-radius:10px;width:100%;max-width:270px;max-height:80vh;padding:20px 18px;overflow-y:auto}.section-panel-title{letter-spacing:3px;margin-bottom:3px;font-size:.9rem;font-weight:900}.section-panel-hint{color:#44445a;letter-spacing:1px;text-transform:uppercase;margin-bottom:14px;font-size:.68rem}.skill-list{flex-direction:column;gap:9px;margin:0;padding:0;list-style:none;display:flex}.skill-row{opacity:.3;align-items:center;gap:8px;transition:opacity .4s;display:flex}.skill-row.unlocked{opacity:1}.skill-check{text-align:center;flex-shrink:0;width:16px;font-size:.8rem;font-weight:900}.skill-label{color:#555;letter-spacing:.3px;font-size:.75rem;font-weight:600}.project-list{flex-direction:column;gap:12px;display:flex}.project-card{background:#ffffff08;border:1px solid #333;border-radius:8px;padding:12px 14px}.project-title{letter-spacing:.5px;margin-bottom:5px;font-size:.8rem;font-weight:800}.project-desc{color:#666;margin-bottom:8px;font-size:.7rem;line-height:1.45}.project-tags{flex-wrap:wrap;gap:5px;display:flex}.project-tag{letter-spacing:.5px;opacity:.8;border:1px solid #333;border-radius:4px;padding:2px 6px;font-size:.62rem;font-weight:700}.timeline{flex-direction:column;gap:0;display:flex}.timeline-item{gap:12px;display:flex}.timeline-rail{flex-direction:column;flex-shrink:0;align-items:center;width:14px;display:flex}.timeline-dot{border-radius:50%;flex-shrink:0;width:12px;height:12px;margin-top:3px}.timeline-line{flex:1;width:2px;min-height:20px;margin:4px 0}.timeline-body{padding-bottom:18px}.timeline-role{letter-spacing:.4px;margin-bottom:2px;font-size:.8rem;font-weight:800}.timeline-period{color:#555;letter-spacing:.5px;margin-bottom:6px;font-size:.68rem}.timeline-points{margin:0;padding-left:14px;list-style:outside}.timeline-points li{color:#666;font-size:.7rem;line-height:1.5}.exp-gem-row{border-top:1px solid #1a1a2a;flex-wrap:wrap;gap:6px;margin-top:10px;padding-top:8px;display:flex}.exp-gem-badge{letter-spacing:.5px;color:#333;text-transform:uppercase;border:1px solid #333;border-radius:12px;padding:3px 8px;font-size:.62rem;font-weight:700;transition:color .3s,border-color .3s,box-shadow .3s}.exp-gem-badge.unlocked{animation:.4s ease-out gemUnlock}@keyframes gemUnlock{0%{transform:scale(1.3)}to{transform:scale(1)}}@keyframes announceIn{0%{opacity:0;transform:translate(-50%,-50%)scale(.7)}20%{opacity:1;transform:translate(-50%,-50%)scale(1.05)}40%{transform:translate(-50%,-50%)scale(1)}70%{opacity:1}to{opacity:0;transform:translate(-50%,-50%)scale(1)}}.section-announcement{pointer-events:none;z-index:50;flex-direction:column;align-items:center;gap:6px;animation:2.5s cubic-bezier(.4,0,.2,1) forwards announceIn;display:flex;position:fixed;top:42%;left:50%;transform:translate(-50%,-50%)}.announce-label{letter-spacing:6px;color:#c8c8dcb3;text-transform:uppercase;font-size:.65rem;font-weight:700}.announce-name{letter-spacing:8px;color:var(--announce-color,#0fc);text-shadow:0 0 20px var(--announce-color,#0fc), 0 0 60px var(--announce-color,#0fc);text-transform:uppercase;font-size:2.8rem;font-weight:900}.toast-bubble{color:#0fc;pointer-events:none;z-index:20;white-space:nowrap;background:#00ffcc1a;border:1px solid #0fc;border-radius:30px;padding:10px 22px;font-size:1.1rem;font-weight:700;animation:1.6s ease-out forwards floatUp;position:absolute;top:15%;left:50%;transform:translate(-50%);box-shadow:0 0 20px #0fc3}@keyframes floatUp{0%{opacity:0;transform:translate(-50%,20px)}15%{opacity:1;transform:translate(-50%)}85%{opacity:1;transform:translate(-50%,-20px)}to{opacity:0;transform:translate(-50%,-40px)}}.nav-arrows{z-index:25;pointer-events:auto;gap:12px;display:flex;position:fixed;bottom:90px;left:50%;transform:translate(-50%)}.nav-arrow{border:1px solid color-mix(in srgb, var(--nav-color) 50%, transparent);color:var(--nav-color);cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#080814b3;border-radius:12px;flex-direction:column;align-items:center;gap:4px;width:110px;min-width:110px;padding:12px 18px;font-family:inherit;transition:all .2s;display:flex}.nav-arrow:hover{border-color:var(--nav-color);box-shadow:0 0 16px color-mix(in srgb, var(--nav-color) 40%, transparent);background:#ffffff14}.nav-arrow-symbol{text-shadow:0 0 10px var(--nav-color);font-size:1.4rem;font-weight:900;line-height:1}.nav-arrow-label{letter-spacing:2px;opacity:.7;font-size:.6rem;font-weight:700}.nav-arrow.confirmed{background:color-mix(in srgb, var(--nav-color) 18%, transparent);border-color:var(--nav-color);box-shadow:0 0 28px var(--nav-color), 0 0 8px var(--nav-color) inset;animation:.4s ease-out arrowPulse}@keyframes arrowPulse{0%{transform:scale(1)}40%{transform:scale(1.18)}to{transform:scale(1)}}.side-panel-container{z-index:10;pointer-events:none;justify-content:flex-end;align-items:center;width:100vw;height:100vh;padding:50px;display:flex;position:absolute;top:0;right:0}.popup-box{pointer-events:auto;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f0a14e6;border-left:4px solid #ffb703;border-radius:8px;width:100%;max-width:480px;max-height:85vh;padding:30px;overflow-y:auto;box-shadow:-10px 0 30px #ffb70326}.close-btn{color:#fff;cursor:pointer;letter-spacing:2px;background:#ffffff1a;border:1px solid #ffffff4d;border-radius:6px;width:100%;padding:12px 24px;font-size:.9rem;font-weight:700;transition:all .2s}.close-btn:hover{background:#fff3}.fade-shield{pointer-events:none;z-index:100;opacity:0;background:#000;width:100vw;height:100vh;transition:opacity .5s;position:absolute;top:0;left:0}.fade-shield.active{opacity:1;pointer-events:auto}.fab-toggle{color:#0fc;cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:20;pointer-events:auto;background:#080814e0;border:1px solid #00ffcc80;border-radius:50%;justify-content:center;align-items:center;width:46px;height:46px;font-size:1.3rem;transition:all .2s;display:none;position:fixed;bottom:90px;left:16px;box-shadow:0 0 16px #0fc3}.touch-zone{z-index:5;background:0 0;height:100vh;display:none;position:fixed;top:0}.touch-zone-left{width:33vw;left:0}.touch-zone-center{width:34vw;left:33vw}.touch-zone-right{width:33vw;right:0}.portrait-overlay{z-index:1000;color:#fff;text-align:center;background:#050510;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:40px;display:none;position:fixed;inset:0}.portrait-icon{color:#0fc;text-shadow:0 0 20px #0fc9;font-size:3.5rem;animation:2s ease-in-out infinite rotateHint}@keyframes rotateHint{0%,to{transform:rotate(0)}50%{transform:rotate(90deg)}}.portrait-text{letter-spacing:4px;color:#0fc;font-size:1rem;font-weight:900}.portrait-sub{color:#444;letter-spacing:1px;font-size:.8rem}@media (width<=768px){.fab-toggle{display:flex}.touch-zone{display:block}.section-panel-container{padding:70px 12px 12px;display:none}.section-panel-container.fab-open{z-index:18;display:flex}.section-panel{pointer-events:auto;max-width:100%}.hud-container{padding:52px 14px 20px}.hud-bottom-center{letter-spacing:.5px;padding:7px 12px;font-size:.65rem}.hud-bottom-right{padding:7px 12px;font-size:1.1rem}.global-header-text{letter-spacing:3px;font-size:1.3rem}.path-tracker{display:none}.toast-bubble{padding:8px 16px;font-size:.9rem}}@media (orientation:portrait){.portrait-overlay{display:flex}}@keyframes milestoneIn{0%{opacity:0;filter:blur(12px);transform:translate(80px)scale(.6)rotate(5deg)}20%{opacity:1;filter:blur();transform:translate(0)scale(.9)rotate(0)}80%{opacity:1;transform:translate(0)scale(.9)}to{opacity:0;transform:translate(40px)scale(1)}}@keyframes milestoneGlow{0%,to{text-shadow:0 0 20px #0fc,0 0 40px #0fc}50%{text-shadow:0 0 40px #0fc,0 0 80px #0fc,0 0 120px #0fc}}.milestone-overlay{z-index:100;pointer-events:none;background:radial-gradient(circle at 70%,#00ffcc1a 0%,#0000 70%);justify-content:center;align-items:center;width:340px;display:flex;position:fixed;top:0;bottom:0;right:0}.milestone-content{text-align:center;padding-right:30px;animation:4.5s cubic-bezier(.2,.8,.2,1) forwards milestoneIn}.milestone-label{letter-spacing:6px;color:#fff9;text-transform:uppercase;margin-bottom:3px;font-size:.68rem;font-weight:900}.milestone-score{color:#0fc;letter-spacing:-.5px;margin-bottom:10px;font-size:2.6rem;font-weight:900;line-height:1;animation:2s ease-in-out infinite milestoneGlow}.milestone-compliment{color:#fff;letter-spacing:.5px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0a0a14d9;border:1px solid #00ffcc26;border-radius:30px;padding:6px 20px;font-size:.98rem;font-weight:700;box-shadow:0 6px 20px #000000b3}.start-screen{z-index:100;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:radial-gradient(circle,#08081466 0%,#05050c 100%);justify-content:center;align-items:center;padding:40px;display:flex;position:fixed;inset:0}.start-content{text-align:center;flex-direction:column;align-items:center;max-width:800px;animation:.8s ease-out startFadeIn;display:flex}@keyframes startFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.start-title{letter-spacing:12px;color:#fff;text-transform:uppercase;margin-bottom:40px;font-size:3.5rem;font-weight:900;line-height:1.2}.start-subtitle{letter-spacing:6px;color:#00ffccb3;margin-top:10px;font-size:.9rem;display:block}.start-actions{gap:20px;margin-bottom:40px;display:flex}.btn-play{color:#050510;letter-spacing:3px;cursor:pointer;background:#0fc;border:none;border-radius:4px;align-items:center;gap:12px;padding:18px 36px;font-size:1.1rem;font-weight:900;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:flex;box-shadow:0 0 30px #0fc6}.btn-play:hover{background:#fff;transform:scale(1.08);box-shadow:0 0 50px #0fc9}.btn-play-icon{font-size:1.4rem}.btn-cv-alt{color:#fff;letter-spacing:2px;background:#ffffff0d;border:1px solid #fff3;border-radius:4px;padding:18px 36px;font-size:.9rem;font-weight:700;text-decoration:none;transition:all .2s}.btn-cv-alt:hover{background:#ffffff1a;border-color:#fff;box-shadow:0 0 20px #ffffff1a}.start-hint{letter-spacing:4px;color:#fff6;font-size:.75rem;font-weight:600}@media (width<=768px){.start-title{letter-spacing:6px;font-size:2rem}.start-actions{flex-direction:column;width:100%}.btn-play,.btn-cv-alt{justify-content:center;width:100%}}.path-node{font-size:.75rem}.gem-counter{font-size:.875rem}.hud-bottom-center{font-size:1rem}.hud-bottom-right{font-size:1.875rem}.btn-hub{font-size:1rem}.cv-download-btn{font-size:1.0625rem}.section-panel-title{font-size:1.125rem}.section-panel-hint{font-size:.85rem}.skill-check{font-size:1rem}.skill-label{font-size:.9375rem}.project-title{font-size:1rem}.project-desc{font-size:.875rem}.project-tag{font-size:.775rem}.timeline-role{font-size:1rem}.timeline-period{font-size:.85rem}.timeline-points li{font-size:.875rem}.exp-gem-badge{font-size:.775rem}.announce-label{font-size:.8125rem}.announce-name{font-size:3.5rem}.toast-bubble{font-size:1.375rem}.nav-arrow-symbol{font-size:1.75rem}.nav-arrow-label{font-size:.75rem}.milestone-label{font-size:.85rem}.milestone-score{font-size:3.25rem}.milestone-compliment{font-size:1.225rem}.start-subtitle{font-size:1.125rem}.btn-play{font-size:1.375rem}.start-hint{font-size:.9375rem}@keyframes eduPanelIn{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes eduContentSwap{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.edu-follow-panel{border:1px solid var(--edu-color,#a29bfe);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);width:280px;box-shadow:0 0 40px color-mix(in srgb, var(--edu-color,#a29bfe) 20%, transparent), inset 0 0 30px color-mix(in srgb, var(--edu-color,#a29bfe) 4%, transparent);z-index:12;pointer-events:none;background:#0a0814d1;border-radius:14px;padding:20px 22px 18px;animation:.4s cubic-bezier(.22,1,.36,1) forwards eduPanelIn;position:fixed;top:50%;right:22px;transform:translateY(-50%)}.edu-follow-progress{background:#ffffff1a;border-radius:2px;height:2px;margin-bottom:16px;overflow:hidden}.edu-follow-progress-bar{background:var(--edu-color,#a29bfe);height:100%;box-shadow:0 0 8px var(--edu-color,#a29bfe);border-radius:2px;transition:width 1.2s cubic-bezier(.4,0,.2,1)}.edu-follow-label{letter-spacing:5px;color:#ffffff59;text-transform:uppercase;margin-bottom:10px;font-size:.625rem;font-weight:900}.edu-follow-degree{letter-spacing:.5px;margin-bottom:8px;font-size:.9rem;font-weight:900;line-height:1.35;animation:.5s ease-out eduContentSwap}.edu-follow-school{color:#ffffffbf;margin-bottom:4px;font-size:.75rem;font-weight:600;animation:.5s ease-out 50ms both eduContentSwap}.edu-follow-period{letter-spacing:1px;margin-bottom:4px;font-size:.875rem;font-weight:800;animation:.5s ease-out .1s both eduContentSwap}.edu-follow-detail{color:#ffffff80;letter-spacing:.3px;margin-bottom:14px;font-size:.7rem;animation:.5s ease-out .15s both eduContentSwap}.edu-follow-step{align-items:center;gap:6px;display:flex}.edu-step-dot{background:#fff3;border-radius:50%;width:6px;height:6px;transition:background .4s,transform .4s}.edu-step-dot.active{box-shadow:0 0 6px var(--edu-color,#a29bfe);transform:scale(1.4)}@media (width<=768px){.edu-follow-panel{width:200px;padding:14px 16px 12px;right:10px}}
