.site-nav{position:fixed;left:0;right:0;top:0;background:var(--nav-bg);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:40;transition:box-shadow .2s,background .2s}.nav-shadow{box-shadow:0 6px 24px #0f172a14}.nav-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:12px 16px}.brand{font-weight:700;font-size:22px;letter-spacing:-.3px;display:flex;align-items:center;gap:10px;cursor:pointer}.brand-logo{width:34px;height:34px;border-radius:999px;object-fit:cover;border:1px solid rgba(255,255,255,.35)}.brand-text{line-height:1}.nav-links{display:flex;gap:16px;align-items:center;transition:color .25s ease}.nav-group{display:flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:#ffffff05;max-width:112px;overflow:hidden;transition:max-width .24s ease,background .18s ease,border-color .18s ease}.nav-group-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:#ffffff8c;padding:0 4px 0 0;white-space:nowrap;flex:0 0 auto}.nav-group-links{display:flex;align-items:center;gap:8px;opacity:0;transform:translate(-6px);pointer-events:none;transition:opacity .18s ease,transform .18s ease}.nav-links a{text-decoration:none;color:#fff;font-weight:500;padding:6px 10px;border-radius:999px;white-space:nowrap}.nav-links a.active{font-weight:700;color:var(--primary)}.nav-links a:hover{color:var(--primary)}.nav-toggle{display:none;background:transparent;border:0;cursor:pointer;padding:8px}.hamburger,.hamburger:before,.hamburger:after{display:block;width:22px;height:2px;background:var(--accent);border-radius:2px;position:relative;transition:transform .2s ease,opacity .2s ease}.hamburger:before,.hamburger:after{content:"";position:absolute;left:0}.hamburger:before{top:-7px}.hamburger:after{top:7px}.hamburger.open{background:transparent}.hamburger.open:before{transform:translateY(7px) rotate(45deg)}.hamburger.open:after{transform:translateY(-7px) rotate(-45deg)}@media(max-width:800px){.nav-toggle{display:block}.brand{font-size:18px}.brand-logo{width:30px;height:30px}.nav-links{position:fixed;left:14px;right:14px;top:62px;background:var(--card);border-radius:14px;border:1px solid rgba(255,255,255,.12);padding:12px 10px;box-shadow:0 10px 30px #02061714;flex-direction:column;display:none;align-items:stretch;gap:10px}.nav-group{flex-wrap:wrap;justify-content:flex-start;border-radius:14px;padding:10px;gap:8px;max-width:none;overflow:visible}.nav-group-label{width:100%;margin-bottom:2px}.nav-group-links{opacity:1;transform:none;pointer-events:auto;flex-wrap:wrap}.nav-links a{padding:10px 12px}.nav-links.open{display:flex}}@media(min-width:801px){.nav-group:hover,.nav-group:focus-within{max-width:420px;background:#ffffff0a;border-color:#ecaa2f2e}.nav-group:hover .nav-group-links,.nav-group:focus-within .nav-group-links{opacity:1;transform:translate(0);pointer-events:auto}}.hero-card{position:relative;width:100vw;height:100vh;overflow:hidden;margin:0;padding:0;display:flex;align-items:center;justify-content:center}.hero-video{position:absolute;top:0;left:0;width:100vw;height:100vh;object-fit:cover;z-index:0}.hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,#02061761,#02061733);z-index:1}.hero-content-centered{position:relative;z-index:2;text-align:center;padding:24px;max-width:1100px;width:100%}.hero-name{font-size:clamp(36px,6vw,72px);line-height:1;margin-bottom:12px;font-weight:800;letter-spacing:-.02em;color:#fff;text-shadow:0 6px 24px rgba(2,6,23,.6)}.hero-tagline{font-size:clamp(14px,1.6vw,20px);color:var(--muted, rgba(255,255,255,.8));margin:0 auto;max-width:900px}.hero-content-centered{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#fff;text-align:center;padding:2rem;opacity:0;transform:translateY(20px);transition:opacity .8s ease-out,transform .8s ease-out}.hero-content-centered.show{opacity:1;transform:translateY(0)}.hero-download-btn{margin-top:12px;padding:10px 22px;background:var(--primary, #ECAA2F);color:#0a0a1a;text-decoration:none;font-weight:700;border-radius:10px;font-size:15px;transition:transform .2s ease,box-shadow .25s ease;box-shadow:0 8px 20px #0000004d}.hero-download-btn:hover{transform:translateY(-3px);box-shadow:0 10px 26px #0006}@media(max-width:480px){.hero-card{min-height:100svh;height:100svh}.hero-video{width:100%;height:100%;object-position:center center;transform:scale(1.22);filter:brightness(.78) saturate(.9)}.hero-overlay{background:linear-gradient(180deg,#0206172e,#0206177a),radial-gradient(circle at center,rgba(236,170,47,.08),transparent 55%)}.hero-content-centered{align-items:center;justify-content:center;padding:1rem 1.1rem}.hero-name{font-size:clamp(30px,10vw,40px)}.hero-tagline{font-size:13px;max-width:18rem}.hero-download-btn{padding:10px 18px;font-size:14px}}.edu-list{display:flex;flex-direction:column;gap:14px;margin-top:10px}.edu-item{display:block;padding:14px;border-radius:10px;background:#ffffff05;border:1px solid rgba(255,255,255,.12)}.edu-row{display:flex;align-items:center;gap:14px}.edu-logo{width:72px;height:72px;min-width:56px;min-height:56px;object-fit:contain;background:#ffffff08;border-radius:8px;padding:6px;border:1px solid rgba(255,255,255,.12)}.edu-item h3{color:var(--primary);margin:0;font-size:1rem;line-height:1.2}#education .small-muted{color:#fff;font-size:.92rem;margin-top:6px}.edu-notes{margin-top:8px;font-size:.95rem;color:#fff}@media(max-width:640px){.edu-row{gap:10px;align-items:flex-start}.edu-logo{width:56px;height:56px;padding:4px}}#experience .exp-list{max-height:350px;overflow-y:scroll;padding-right:8px;display:flex;flex-direction:column;gap:12px}#experience .exp-list::-webkit-scrollbar{width:0;height:0}#experience .exp-list{scrollbar-width:none}#experience .exp-list{-ms-overflow-style:none}#experience .exp-item{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.12)}#experience .exp-item:last-child{border-bottom:none}#experience .exp-head h3{font-size:1rem;margin:0;font-weight:600;color:#fff}#experience .small-muted{color:#fff;font-size:.85rem}#experience .exp-bullets{margin-top:6px;margin-left:18px;font-size:.9rem;color:#fff}@media(max-width:700px){#experience .exp-list{max-height:none;overflow:visible;padding-right:0}}.projects-card{background:#2f2f2f;--project-overlay-opacity: 82%}.projects-intro{max-width:800px}.projects-grid{margin-top:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.project-item{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:16px;background:#ffffff05;transition:transform .35s cubic-bezier(.2,.9,.2,1),box-shadow .35s cubic-bezier(.2,.9,.2,1)}.project-item.has-image{background-color:#1a1a1a}.project-item.has-image:before{content:"";position:absolute;inset:0;background-image:var(--project-img);background-size:cover;background-position:var(--project-img-pos, center);opacity:0;transition:opacity .35s cubic-bezier(.2,.9,.2,1);z-index:0}.project-item.has-image:hover{transform:scale(1.04);box-shadow:0 16px 40px #00000073}.project-item.has-image:hover:before{opacity:1}.project-item.has-image:hover .project-item-overlay{opacity:.55}.project-clickable{cursor:pointer}.project-item-overlay{position:absolute;inset:0;background:#2f2f2f;opacity:var(--project-overlay-opacity);z-index:1;border-radius:12px;transition:opacity .35s cubic-bezier(.2,.9,.2,1)}.project-item-content{position:relative;z-index:2}.project-meta{color:var(--accent);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px}.project-item h3{margin:0 0 8px;color:var(--primary);font-size:1.05rem}.project-item p{margin:0;color:var(--muted);line-height:1.5}.projects-grid .project-item:first-child{grid-column:span 2}@media(max-width:860px){.projects-grid{grid-template-columns:1fr}.projects-grid .project-item:first-child{grid-column:auto}}.skills-section{background:transparent;padding:0;display:flex;flex-direction:column;align-items:stretch}.skills-title{font-size:clamp(24px,3vw,34px);font-weight:800;letter-spacing:.04em;color:var(--accent);margin-bottom:clamp(18px,3vw,30px);text-align:center}.skills-grid{width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2.5vw,28px)}@media(min-width:901px){.skills-grid.six-items .skills-col:nth-child(5){grid-column:2}.skills-grid.six-items .skills-col:nth-child(6){grid-column:3}}.skills-col{display:flex;flex-direction:column}.skills-col-heading{font-size:15px;font-weight:800;color:var(--primary);text-align:center;margin-bottom:10px;letter-spacing:.03em;text-transform:uppercase}.skills-list{list-style:none;padding:0;margin:0;text-align:center;display:flex;flex-direction:column;gap:8px}.skill-item{color:var(--muted);font-size:14px;letter-spacing:.02em}@media(max-width:900px){.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr));text-align:center}.skills-col-heading:before{margin:0 auto 6px}}@media(max-width:560px){.skills-grid{grid-template-columns:1fr;gap:16px}}.centered-cert-section{width:min(1100px,100%);margin:0 auto;display:flex;flex-direction:column;gap:18px}.cert-title-header{font-size:clamp(24px,3vw,34px);font-weight:800;color:var(--accent);margin:0;text-align:left}.cert-row{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:clamp(16px,3vw,28px);align-items:start}.cert-carousel{position:relative;width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,2.2fr) minmax(0,1fr) auto;align-items:center;gap:clamp(8px,2vw,16px)}.cert-arrow{background:transparent;border:1px solid rgba(255,255,255,.22);border-radius:999px;width:42px;height:42px;font-size:24px;line-height:1;cursor:pointer;color:var(--primary);transition:transform .15s ease,border-color .15s ease}.cert-arrow:hover{transform:scale(1.04);border-color:#ffffff6b}.cert-small-left,.cert-small-right,.cert-center{border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:#242424}.cert-small-left,.cert-small-right{aspect-ratio:3 / 4}.cert-center{aspect-ratio:4 / 3;box-shadow:0 10px 28px #00000047}.cert-small-left img,.cert-small-right img,.cert-center img{width:100%;height:100%;object-fit:cover;display:block}.cert-details{display:flex;flex-direction:column;gap:12px}.cert-info{display:flex;flex-direction:column;gap:8px}.cert-info-title{margin:0;color:var(--primary);font-size:1.1rem}.cert-meta{color:var(--muted);font-size:.92rem}.cert-info-right{display:flex;flex-wrap:wrap;gap:10px}.btn-outline{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.28);color:var(--primary);text-decoration:none;font-weight:600}.btn-outline:hover{border-color:#ffffff7a}.cert-desc{margin:0;color:var(--muted);line-height:1.5}@media(max-width:920px){.cert-row{grid-template-columns:1fr}.cert-carousel{grid-template-columns:auto minmax(0,1fr) minmax(0,1fr) auto}.cert-small-left,.cert-small-right{display:none}.cert-details .cert-title-header{font-size:clamp(20px,6vw,28px)}}.services-card{background:#2f2f2f}.services-intro{max-width:760px}.services-grid{margin-top:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.service-item{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:14px;background:#ffffff05}.service-item h3{margin:0 0 8px;color:var(--primary);font-size:1.02rem}.service-item ul{margin:0;padding-left:18px;display:grid;gap:6px}.service-item li{color:var(--muted);line-height:1.45}@media(max-width:860px){.services-grid{grid-template-columns:1fr}}.templates-card{background:#2f2f2f}.templates-intro{max-width:780px}.template-item{margin-top:14px;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:14px;background:#ffffff05}.template-link{text-decoration:none;display:block;transition:transform .14s ease,border-color .14s ease}.template-featured{max-width:760px}.template-link:hover{transform:translateY(-2px);border-color:#ecaa2f73}.template-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.template-item h3{margin:0;color:var(--primary);font-size:1.02rem}.template-status{font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;border:1px solid rgba(236,170,47,.45);color:var(--accent);border-radius:999px;padding:4px 8px}.template-item ul{margin:0;padding-left:18px;display:grid;gap:6px}.template-item li{color:var(--muted);line-height:1.45}.achievements-card{position:relative;background:#2f2f2f;overflow:hidden}.achievements-card:before{content:"";position:absolute;inset:0;background-image:url(/photos/portrait-4.jpeg);background-size:cover;background-position:var(--achieve-img-pos, center);opacity:.15;z-index:0}.achievements-card>*{position:relative;z-index:1}.ach-list{margin-top:14px;display:grid;gap:10px}.ach-item{border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:12px 14px;background:#ffffff05;color:var(--muted)}.achievements-card{--achieve-img-pos: 50% 40%}:root{--white: white;--muted: #9ca3af}.contact-wrapper{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(18px,3vw,34px);width:100%;align-items:start;padding:2px}.contact-left{display:flex;flex-direction:column;gap:8px;width:100%;max-width:520px}.contact-right{display:flex;flex-direction:column;gap:12px;justify-content:flex-start;padding-left:0}.contact-right .contact-big{font-size:3rem;color:var(--white);margin:0;font-weight:800;line-height:1}.contact-right .contact-tagline{color:#ffffffeb;background:#f5deb305;padding:10px 12px;border-radius:8px;max-width:520px;font-size:1rem}.contact-note{color:var(--muted);font-size:.9rem;margin:-2px 0 4px}.contact-links{display:flex;flex-wrap:wrap;gap:10px}.contact-links a{text-decoration:none;color:var(--primary);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:8px 12px;font-size:.92rem}.contact-links a:hover{border-color:#ffffff61}.contact-form{display:flex;flex-direction:column;gap:22px;margin-top:6px}.contact-form label{display:flex;flex-direction:column;gap:6px;margin:0}.label{font-size:.92rem;color:var(--white);font-weight:500}.contact-form input,.contact-form textarea{width:100%;max-width:100%;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:12px 14px;font-size:1rem;box-shadow:0 4px 12px #0000001f;transition:border-color .12s ease,box-shadow .12s ease,transform .08s ease;box-sizing:border-box}.contact-form textarea{height:140px;resize:vertical}.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--white);box-shadow:0 10px 30px #f5deb31f;transform:translateY(-1px)}.contact-form .btn{width:100%;max-width:100%;background:var(--muted);color:var(--nav-bg );border-radius:10px;padding:12px 16px;font-weight:700;cursor:pointer;border:none;box-shadow:0 8px 24px #0000002e;transition:transform .12s ease,box-shadow .12s ease}.contact-form .btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px #00000038;color:var(--muted);background:var(--nav-bg)}.contact-status{margin-top:8px;font-size:.95rem;color:var(--muted);max-width:100%}@media(max-width:900px){.contact-wrapper{grid-template-columns:1fr;gap:18px}.contact-right{margin-top:6px}.contact-form input,.contact-form textarea,.btn,.contact-status{max-width:100%}.contact-right .contact-big{font-size:2.4rem}}@media(max-width:420px){.contact-form{gap:18px}.contact-form .label{font-size:.88rem}.contact-right .contact-big{font-size:1.8rem}}.api-template-page{min-height:100vh;background:var(--bg);padding:26px 14px}.api-template-shell{width:min(1100px,100%);margin:0 auto;gap:14px}.api-template-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.api-template-back{text-decoration:none;color:var(--primary);border:1px solid rgba(255,255,255,.26);border-radius:8px;padding:8px 10px}.api-panel{border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#ffffff05;padding:14px}.api-panel h2{margin:0 0 12px;color:var(--primary);font-size:1.05rem}.request-row{display:grid;grid-template-columns:180px minmax(0,1fr);gap:10px}.field{display:grid;gap:6px;margin-bottom:10px}.field span,.body-head span{color:var(--muted);font-size:.85rem;text-transform:uppercase;letter-spacing:.04em}.field input,.field select,.body-head select,.header-row input,.body-editor{width:100%;background:#00000040;border:1px solid rgba(255,255,255,.14);color:#fff;border-radius:8px;padding:10px 12px;font-size:.94rem}.header-table{display:grid;gap:8px}.header-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.btn-outline-lite{margin-top:8px;background:transparent;border:1px solid rgba(255,255,255,.24);color:var(--primary);border-radius:8px;padding:8px 10px;cursor:pointer}.body-head{margin-top:10px;display:flex;justify-content:space-between;align-items:center;gap:8px}.body-editor{margin-top:8px;min-height:180px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.visual-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.btn-visualize{border-color:#ecaa2f80;color:var(--accent)}.preview-line{color:var(--muted);margin-bottom:8px}.preview-line strong{color:#fff;margin-right:6px}.preview-code{margin:0;padding:10px;border-radius:8px;background:#0000004d;border:1px solid rgba(255,255,255,.12);color:var(--muted);white-space:pre-wrap;word-break:break-word}.visualizer-panel{margin-top:2px}.dns-strip{display:grid;gap:6px;font-size:.92rem;margin-bottom:14px}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#fff}.mono.ip{color:#f5cb76}.network-lane{--packet-travel: 132px;position:relative;display:grid;grid-template-columns:88px minmax(160px,280px) minmax(80px,1fr) 88px;align-items:center;gap:10px;padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:#0003}.network-lane.tls-secured{box-shadow:inset 0 0 0 1px #6dc6ff38,0 0 20px #6dc6ff1a}.lane-node{text-align:center;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:8px 6px;color:#fff;font-size:.86rem}.lane-node.server{border-color:#ecaa2f73}.lane-path{height:2px;border-radius:999px;background:linear-gradient(90deg,#ecaa2f4d,#ecaa2fbf,#ecaa2f4d);position:relative}.packet-stage{position:relative;height:96px;display:flex;align-items:center}.payload-sheet{width:150px;min-height:80px;border-radius:8px;border:1px solid rgba(255,255,255,.22);background:#fffdf6;color:#1c1c1c;overflow:hidden;transform-origin:center;transition:transform .45s ease,opacity .45s ease}.payload-sheet.folded{transform:scale(.78) translateY(5px);opacity:0}.sheet-lines{white-space:pre-wrap;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.66rem;line-height:1.24;padding:8px}.payload-envelope{position:absolute;left:0;top:16px;width:150px;min-height:66px;border:1px solid rgba(236,170,47,.55);background:#ecaa2f2e;border-radius:8px;display:grid;align-content:center;justify-items:center;gap:2px;opacity:0;transform:scale(.82);transition:transform .45s ease,opacity .45s ease}.payload-envelope.show{opacity:1;transform:scale(1)}.payload-envelope.request{border-color:#ecaa2f8c;background:#ecaa2f2e}.payload-envelope.response{border-color:#6dc6ffb3;background:#6dc6ff2e}.payload-envelope:before{content:"";position:absolute;top:0;left:0;right:0;margin:auto;width:0;height:0;border-left:75px solid transparent;border-right:75px solid transparent;border-top:30px solid rgba(236,170,47,.35)}.payload-envelope.response:before{border-top-color:#6dc6ff59}.payload-envelope span{position:relative;z-index:2;font-size:.73rem;color:#ffeec8}.packet-stage.sending .payload-envelope{animation:sendPacket 1.45s ease-in-out infinite}.packet-stage.responding .payload-envelope{animation:returnPacket 1.45s ease-in-out infinite}.packet-stage.response-ready .payload-envelope.response{transform:translate(var(--packet-travel)) scale(.98);opacity:1}@keyframes sendPacket{0%{transform:translate(0) scale(1);opacity:1}60%{transform:translate(calc(var(--packet-travel) - 16px)) scale(.98);opacity:1}to{transform:translate(var(--packet-travel)) scale(.94);opacity:.35}}@keyframes returnPacket{0%{transform:translate(var(--packet-travel)) scale(.98);opacity:1}60%{transform:translate(36px) scale(.99);opacity:1}to{transform:translate(0) scale(1);opacity:.6}}.tcp-pulse{position:absolute;left:168px;top:34%;transform:translateY(-50%);opacity:0;padding:4px 8px;border-radius:999px;font-size:.72rem;color:#ffd9a1;border:1px solid rgba(236,170,47,.65);background:#ecaa2f29;pointer-events:none}.tcp-pulse.show{opacity:1}.tcp-pulse.syn{animation:tcpClientPulse .75s ease-in-out}.tcp-pulse.syn-ack{animation:tcpServerPulse .75s ease-in-out}.tcp-pulse.ack{animation:tcpClientPulse .75s ease-in-out}@keyframes tcpClientPulse{0%{transform:translateY(-50%);opacity:0}22%{opacity:1}to{transform:translate(var(--packet-travel),-50%);opacity:0}}@keyframes tcpServerPulse{0%{transform:translate(var(--packet-travel),-50%);opacity:0}22%{opacity:1}to{transform:translateY(-50%);opacity:0}}.tls-pulse{position:absolute;left:168px;top:50%;transform:translateY(-50%);opacity:0;padding:4px 8px;border-radius:999px;font-size:.72rem;color:#dff4ff;border:1px solid rgba(109,198,255,.6);background:#6dc6ff26;pointer-events:none}.tls-pulse.show{opacity:1}.tls-pulse.client-hello{animation:tlsClientPulse .9s ease-in-out}.tls-pulse.server-hello{animation:tlsServerPulse .9s ease-in-out}.tls-pulse.secure{left:50%;transform:translate(-50%,-50%);animation:tlsSecurePulse 1.1s ease-in-out infinite}@keyframes tlsClientPulse{0%{transform:translateY(-50%);opacity:0}20%{opacity:1}to{transform:translate(260px,-50%);opacity:0}}@keyframes tlsServerPulse{0%{transform:translate(260px,-50%);opacity:0}20%{opacity:1}to{transform:translateY(-50%);opacity:0}}@keyframes tlsSecurePulse{0%{opacity:.55;box-shadow:0 0 #6dc6ff00}50%{opacity:1;box-shadow:0 0 18px #6dc6ff80}to{opacity:.55;box-shadow:0 0 #6dc6ff00}}.phase-chip{margin-top:10px;display:inline-block;border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:5px 10px;font-size:.78rem;color:var(--muted);text-transform:uppercase}.protocol-strip{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}.protocol-chip{border:1px solid rgba(255,255,255,.2);color:var(--muted);border-radius:999px;padding:5px 9px;font-size:.74rem}.protocol-chip.done{border-color:#ecaa2f99;color:#ffd782;background:#ecaa2f1f}.guide-popup{margin-top:12px;border:1px solid rgba(236,170,47,.45);border-radius:10px;background:#ecaa2f1a;padding:10px}.guide-step{color:#ffe3aa;font-weight:700;margin-bottom:5px}.guide-popup p{margin:0;color:#f4e9cf;line-height:1.4}.btn-guide-next{margin-top:9px;border-color:#ecaa2fb3;color:#ffe3aa}.log-console{margin-top:10px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#00000057;padding:10px;max-height:220px;overflow-y:auto}.log-title{margin-bottom:8px;color:#fff;font-weight:600}.log-line{display:grid;grid-template-columns:78px minmax(0,1fr);gap:10px;margin-bottom:6px;font-size:.86rem;color:var(--muted)}.log-line.muted{display:block}.log-stamp{color:#f5cb76;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}@media(max-width:860px){.request-row,.header-row{grid-template-columns:1fr}.api-template-top{flex-direction:column;align-items:flex-start}.network-lane{grid-template-columns:1fr}.lane-path{width:100%}.packet-stage{justify-content:center}.packet-stage.sending .payload-envelope{animation:sendPacketMobile 1.35s ease-in-out infinite}.packet-stage.responding .payload-envelope{animation:returnPacketMobile 1.35s ease-in-out infinite}.packet-stage.response-ready .payload-envelope.response{transform:translateY(56px) scale(.92)}.tcp-pulse{left:50%;top:16%;transform:translate(-50%,-50%)}.tcp-pulse.syn,.tcp-pulse.syn-ack,.tcp-pulse.ack{animation:tcpPulseMobile .75s ease-in-out}.tls-pulse{left:50%;top:28%;transform:translate(-50%,-50%)}.tls-pulse.client-hello,.tls-pulse.server-hello{animation:tlsPulseMobile .9s ease-in-out}}@keyframes sendPacketMobile{0%{transform:translateY(0) scale(1);opacity:1}70%{transform:translateY(42px) scale(.96);opacity:1}to{transform:translateY(56px) scale(.92);opacity:.35}}@keyframes returnPacketMobile{0%{transform:translateY(56px) scale(.92);opacity:1}70%{transform:translateY(16px) scale(.97);opacity:1}to{transform:translateY(0) scale(1);opacity:.6}}@keyframes tlsPulseMobile{0%{opacity:0;transform:translate(-50%,-70%)}30%{opacity:1;transform:translate(-50%,-48%)}to{opacity:0;transform:translate(-50%,-25%)}}@keyframes tcpPulseMobile{0%{opacity:0;transform:translate(-50%,-65%)}30%{opacity:1;transform:translate(-50%,-42%)}to{opacity:0;transform:translate(-50%,-20%)}}.bg-portrait{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:0;pointer-events:none;width:200px;height:260px;opacity:.35}.bg-portrait-img{width:100%;height:100%;object-fit:contain}.bg-portrait-placeholder{width:100%;height:100%;border-radius:16px;background:linear-gradient(135deg,#ffffff0a,#ffffff03);border:1px dashed rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;font-size:13px;color:#fff3;text-align:center;padding:12px}.bg-portrait-placeholder:after{content:"Your photo here"}.bg-edu{width:360px;height:480px;opacity:.3;top:59%;left:50%;transform:translate(-50%,-50%)}.bg-exp{width:360px;height:480px;opacity:.3;top:53%;left:50%;transform:translate(-50%,-50%)}.bg-achievements{width:220px;height:280px;opacity:.3;top:50%;left:50%;transform:translate(-50%,-50%)}@media(max-width:700px){.bg-portrait{display:none}}:root{--bg: #2c2c2c;--card: #2c2c2c;--accent: #ECAA2F;--muted: #c7c7d7;--primary: white;--nav-bg: #2c2c2c;--nav-height: 72px}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100%}body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;background:var(--bg);color:var(--accent);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5;scroll-behavior:smooth}main{width:100%;margin:0;padding:0}.section-card{width:min(1100px,100%);margin:0 auto;min-height:0;background:var(--card);display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;padding:clamp(18px,3vw,36px);border-radius:18px;border:1px solid rgba(255,255,255,.08)}#home .section-card{width:100vw!important;min-height:100vh;padding:0!important;margin:0!important;display:flex;justify-content:center;align-items:center;border-radius:0;border:0}.section-title{font-size:clamp(24px,3.2vw,34px);margin-bottom:14px;color:var(--accent)}section{width:100%;margin:0;display:block;position:relative;padding:clamp(24px,6vw,64px) clamp(14px,4vw,40px);scroll-margin-top:var(--nav-height)}#home{padding:0}.edu-exp-wrapper{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,28px);align-items:stretch}.edu-cell,.exp-cell{position:relative;display:flex;flex-direction:column;background:#2f2f2f;border-radius:18px;border:1px solid rgba(255,255,255,.08)}.edu-cell>.section-card,.exp-cell>.section-card{flex:1;background:transparent;border:none;margin:0;width:100%}.reveal{opacity:0;transform:translateY(18px);transition:opacity .42s cubic-bezier(.2,.9,.2,1) var(--reveal-delay, 0ms),transform .42s cubic-bezier(.2,.9,.2,1) var(--reveal-delay, 0ms);will-change:opacity,transform;pointer-events:auto}.reveal.in-view{opacity:1;transform:translateY(0)}.reveal-lg{transform:translateY(28px)}.reveal-lg.in-view{transform:translateY(0)}.reveal-pop{transform:translateY(12px) scale(.985)}.reveal-pop.in-view{transform:translateY(0) scale(1);transition:opacity .38s cubic-bezier(.2,.9,.2,1) var(--reveal-delay, 0ms),transform .42s cubic-bezier(.2,.9,.2,1) var(--reveal-delay, 0ms)}[data-reveal-delay]{--reveal-delay: 0ms}[data-reveal-delay="50"]{--reveal-delay: 50ms}[data-reveal-delay="100"]{--reveal-delay: .1s}@media(prefers-reduced-motion:reduce){.reveal,.reveal-pop,.reveal-lg{transition:none!important;transform:none!important;opacity:1!important}}.reveal-stagger>*{opacity:0;transform:translateY(18px);transition:opacity .42s cubic-bezier(.2,.9,.2,1),transform .42s cubic-bezier(.2,.9,.2,1)}.reveal-stagger.in-view>*{opacity:1;transform:translateY(0)}.reveal-stagger.in-view>*:nth-child(1){transition-delay:60ms}.reveal-stagger.in-view>*:nth-child(2){transition-delay:.11s}.reveal-stagger.in-view>*:nth-child(3){transition-delay:.16s}.reveal-stagger.in-view>*:nth-child(4){transition-delay:.21s}.reveal-stagger.in-view>*:nth-child(5){transition-delay:.26s}.reveal,.reveal-pop,.reveal-lg{display:block}.small-muted{color:var(--muted);font-size:14px}@media(max-width:980px){:root{--nav-height: 64px}.edu-exp-wrapper{grid-template-columns:1fr}section{padding:22px 14px}}@media(max-width:560px){section{padding:16px 12px}.section-card{padding:16px 14px;border-radius:14px}.section-title{font-size:22px;margin-bottom:10px}.small-muted{font-size:13px}}