*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
    --font:'JetBrains Mono','Fira Code','Cascadia Code',monospace;
    --sans:'Inter',-apple-system,sans-serif;
    --bg:#0d1117;
    --bg2:#161b22;
    --border:#21262d;
    --text:#c9d1d9;
    --text2:#8b949e;
    --text3:#484f58;
    --green:#3fb950;
    --green-dim:rgba(63,185,80,.08);
    --blue:#58a6ff;
    --red:#f85149;
    --orange:#d2991d;
    --purple:#bc8cff;
    --cyan:#39d2c0;
    --header-h:44px;
    --max-w:1000px;
    --pad:clamp(1rem,4vw,2.5rem);
}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.7;min-height:100vh;overflow-x:hidden;font-size:14px}
::selection{background:var(--green);color:var(--bg)}
a{color:inherit;text-decoration:none}ul{list-style:none}img{max-width:100%}
button{cursor:pointer;border:none;background:none;font-family:inherit;color:inherit}
input,textarea{font-family:var(--font);font-size:.85rem;color:var(--text)}

/* Terminal Frame */
.terminal{min-height:100vh;display:flex;flex-direction:column}
.terminal__bar{position:fixed;top:0;left:0;right:0;z-index:200;height:var(--header-h);background:var(--bg2);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 1rem;gap:.75rem}
.terminal__dots{display:flex;gap:6px}
.terminal__dot{width:10px;height:10px;border-radius:50%}
.terminal__dot--r{background:#ff5f57}.terminal__dot--y{background:#febc2e}.terminal__dot--g{background:#28c840}
.terminal__title{font-size:.72rem;color:var(--text2);letter-spacing:.04em;flex:1;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.terminal__body{flex:1;padding-top:var(--header-h);position:relative;z-index:1}
.terminal__scan{position:fixed;inset:0;z-index:2;pointer-events:none;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.015) 2px,rgba(0,0,0,.015) 4px);opacity:.5}

/* Grid bg */
.t-grid{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.35}
.t-grid canvas{width:100%;height:100%}

/* Loading */
#loading{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--font);transition:opacity .5s,visibility .5s}
#loading.hide{opacity:0;visibility:hidden;pointer-events:none}
.loading__text{font-size:.75rem;color:var(--green);letter-spacing:.1em}
.loading__text::after{content:'...';animation:loadDots 1.2s steps(4,infinite)}@keyframes loadDots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}

/* Container */
.container{width:100%;max-width:var(--max-w);margin:0 auto;padding:0 var(--pad)}
.container--sm{max-width:700px}

/* Nav */
.nav{display:flex;align-items:center;justify-content:space-between;height:100%;max-width:var(--max-w);margin:0 auto;padding:0 var(--pad)}
.nav__logo{font-size:.78rem;font-weight:600;color:var(--green);letter-spacing:.02em}
.nav__logo::before{content:'➜ ~/';opacity:.5;margin-right:2px}
.nav__links{display:flex;gap:.2rem}
.nav__link{padding:.3rem .6rem;font-size:.74rem;font-weight:500;color:var(--text2);letter-spacing:.02em;border-radius:3px;transition:all .12s}
.nav__link:hover{color:var(--text);background:var(--green-dim)}
.nav__link.active{color:var(--green)}
.nav__actions{display:flex;align-items:center;gap:.4rem}
.nav__theme{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:3px;color:var(--text2);font-size:.8rem;transition:all .12s;border:1px solid transparent}
.nav__theme:hover{color:var(--text);border-color:var(--border)}
.nav__burger{display:none;flex-direction:column;gap:4px;width:26px;padding:4px}
.nav__burger span{display:block;width:100%;height:2px;background:var(--text);border-radius:1px}
@media(max-width:768px){
    .nav__links{position:fixed;top:calc(var(--header-h)+4px);left:var(--pad);right:var(--pad);flex-direction:column;background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:.4rem;opacity:0;visibility:hidden;transform:translateY(-4px);transition:all .15s;z-index:100}
    .nav__links.active{opacity:1;visibility:visible;transform:translateY(0)}
    .nav__link{width:100%;padding:.5rem .6rem}
    .nav__burger{display:flex}
}

/* Section */
.sec{padding:5rem 0;position:relative;z-index:1}
.sec-head{margin-bottom:3rem}
.sec-prompt{font-size:.7rem;color:var(--green);margin-bottom:1.2rem;display:flex;align-items:center;gap:.4rem}
.sec-prompt::before{content:'$'}
.sec-prompt::after{content:'cat ~/readme.txt';color:var(--text3);margin-left:.3rem}
.sec-title{font-size:clamp(1.6rem,4vw,2.4rem);font-weight:800;letter-spacing:-.03em;line-height:1.2;margin-bottom:.6rem;font-family:var(--sans)}
.sec-sub{font-size:.88rem;color:var(--text2);max-width:520px;line-height:1.8;font-family:var(--sans)}

.cmd{color:var(--green);font-size:.72rem;margin-bottom:.8rem;display:block}
.cmd::before{content:'$ ';color:var(--green)}.cmd::after{content:'';display:inline-block;width:8px;height:15px;background:var(--green);margin-left:3px;vertical-align:-2px;animation:blink 1s steps(1)infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

/* Reveal */
.rev{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease}
.rev.on{opacity:1;transform:translateY(0)}
.d1{transition-delay:.04s}.d2{transition-delay:.08s}.d3{transition-delay:.12s}.d4{transition-delay:.16s}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1.2rem;font-size:.76rem;font-weight:600;letter-spacing:.04em;border-radius:3px;transition:all .15s;white-space:nowrap;font-family:var(--font)}
.btn-p{background:var(--green);color:var(--bg)}
.btn-p:hover{background:#2ea043;transform:translateY(-1px)}
.btn-s{background:transparent;color:var(--text);border:1px solid var(--border)}
.btn-s:hover{border-color:var(--text2);transform:translateY(-1px)}

/* Hero */
.hero{min-height:calc(100vh - var(--header-h));display:flex;align-items:center;padding:2rem 0 4rem;position:relative;z-index:1}
.hero__inner{max-width:680px}
.hero__cmd{font-size:.75rem;color:var(--green);margin-bottom:2rem;display:block}
.hero__cmd::before{content:'➜ ~ ';color:var(--text3)}.hero__cmd::after{content:'|';color:var(--green);animation:blink 1s steps(1)infinite}
.hero__title{font-size:clamp(2.2rem,6vw,3.8rem);font-weight:900;letter-spacing:-.04em;line-height:1.05;margin-bottom:1rem;font-family:var(--sans)}
.hero__title em{font-style:normal;color:var(--green)}
.hero__tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
.hero__tags span{font-size:.72rem;color:var(--text2);padding:.25rem .6rem;border:1px solid var(--border);border-radius:3px}
.hero__desc{font-size:.9rem;color:var(--text2);max-width:460px;line-height:1.8;margin-bottom:2rem;font-family:var(--sans)}
.hero__btns{display:flex;gap:.5rem;flex-wrap:wrap}
.hero__stats{display:flex;gap:2rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--border);font-family:var(--font)}
.hero__stat strong{display:block;font-size:1.3rem;color:var(--green);font-weight:700;letter-spacing:-.02em;line-height:1}
.hero__stat span{font-size:.65rem;color:var(--text3);text-transform:uppercase;letter-spacing:.1em}

/* Term block */
.term-block{border:1px solid var(--border);border-radius:4px;overflow:hidden;max-width:520px;background:rgba(0,0,0,.25)}
.term-block__head{background:var(--bg2);border-bottom:1px solid var(--border);padding:.4rem .8rem;display:flex;align-items:center;gap:6px}
.term-block__head .tdot{width:7px;height:7px;border-radius:50%}
.tdot-r{background:#ff5f57}.tdot-y{background:#febc2e}.tdot-g{background:#28c840}
.term-block__body{padding:1rem 1.2rem;font-size:.74rem;line-height:2;color:var(--text2)}
.term-block__body .p{color:var(--green)}.term-block__body .c{color:var(--cyan)}.term-block__body .o{color:var(--orange)}

/* Stats row */
.stats-row{padding:1rem 0 4rem;position:relative;z-index:1}
.stats-row__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;font-family:var(--font)}
.stat-itm{padding:1.2rem .5rem;text-align:left}
.stat-itm__num{font-size:1.6rem;font-weight:700;color:var(--green);letter-spacing:-.02em;line-height:1}
.stat-itm__label{font-size:.65rem;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-top:3px}
@media(max-width:600px){.stats-row__grid{grid-template-columns:repeat(2,1fr)}}

/* Cards */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border)}
.card{background:var(--bg);padding:2rem 1.5rem;transition:background .2s;border:0}
.card:hover{background:var(--bg2)}
.card__num{font-size:.62rem;color:var(--green);letter-spacing:.1em;margin-bottom:.8rem;display:block}
.card__title{font-size:.88rem;font-weight:700;font-family:var(--sans);letter-spacing:-.01em;margin-bottom:.35rem}
.card__desc{font-size:.76rem;color:var(--text2);line-height:1.7;margin-bottom:1rem;font-family:var(--sans)}
.card__tags{display:flex;flex-wrap:wrap;gap:.25rem}
.card__tags span{font-size:.6rem;color:var(--text3);padding:.12rem .4rem;border:1px solid var(--border);border-radius:3px}
@media(max-width:768px){.card-grid{grid-template-columns:1fr}}

/* About */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.about-visual{border:1px solid var(--border);border-radius:4px;aspect-ratio:4/5;background:var(--bg2);display:flex;align-items:flex-end;padding:1.5rem;position:relative;overflow:hidden}
.about-visual::before{content:'root@server:~#';position:absolute;top:.8rem;left:1rem;font-size:.62rem;color:var(--green);opacity:.5}
.about-visual__label{font-size:.65rem;color:var(--text3);letter-spacing:.06em}
.about-text p{color:var(--text2);line-height:1.9;font-size:.85rem;margin-bottom:1.2rem;font-family:var(--sans)}
.about-text p strong{color:var(--text);font-weight:600}
.about-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.5rem}
.about-tags span{font-size:.65rem;color:var(--text3);padding:.3rem .6rem;border:1px solid var(--border);border-radius:3px}
@media(max-width:768px){.about-grid{grid-template-columns:1fr;gap:2.5rem}.about-visual{aspect-ratio:3/2}}

/* Skills */
.skills-section{padding:5rem 0;position:relative;z-index:1}
.skills-tabs{display:flex;gap:.2rem;margin-bottom:2.5rem;flex-wrap:wrap}
.skills-tabs button{font-size:.64rem;font-weight:600;padding:.25rem .6rem;color:var(--text3);letter-spacing:.06em;border-radius:3px;transition:all .12s;text-transform:uppercase;background:transparent;border:none;cursor:pointer;font-family:var(--font)}
.skills-tabs button:hover{color:var(--text)}
.skills-tabs button.active{color:var(--green);background:var(--green-dim)}
.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:0;border-top:1px solid var(--border)}
.skill-row{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid var(--border);gap:.5rem}
.skill-row__name{font-size:.76rem;font-weight:500;letter-spacing:.02em;flex:1}
.skill-row__pct{font-size:.64rem;color:var(--text3);min-width:35px;text-align:right}
.skill-row__bar{width:50px;height:2px;background:var(--border);border-radius:1px;overflow:hidden}
.skill-row__fill{height:100%;width:0;background:var(--green);transition:width 1s ease}

/* Projects */
.proj-list{border-top:1px solid var(--border)}
.proj-item{display:grid;grid-template-columns:28px 1fr auto;gap:1.5rem;align-items:baseline;padding:1.8rem 0;border-bottom:1px solid var(--border);transition:background .12s}
.proj-item:hover{background:var(--green-dim)}
.proj-item__idx{font-size:.62rem;color:var(--text3);padding-top:3px}
.proj-item__body{min-width:0}
.proj-item__label{font-size:.6rem;color:var(--green);text-transform:uppercase;letter-spacing:.1em;margin-bottom:2px;display:block}
.proj-item__title{font-size:.9rem;font-weight:700;font-family:var(--sans);letter-spacing:-.01em;margin-bottom:2px}
.proj-item__desc{font-size:.76rem;color:var(--text2);line-height:1.6;font-family:var(--sans);max-width:480px}
.proj-item__tags{display:flex;flex-wrap:wrap;gap:.2rem;padding-top:2px}
.proj-item__tags span{font-size:.58rem;color:var(--text3)}
.proj-item__emoji{font-size:1.4rem;opacity:.6;padding-top:3px}
@media(max-width:600px){.proj-item{grid-template-columns:1fr;gap:.4rem}.proj-item__idx,.proj-item__emoji{display:none}}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:4rem;align-items:start}
.contact-aside p{color:var(--text2);line-height:1.8;margin-bottom:1.8rem;font-size:.85rem;font-family:var(--sans)}
.contact-item{display:flex;align-items:center;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--border);font-size:.76rem;margin-bottom:.3rem}
.contact-item__ico{color:var(--green);font-size:.9rem;flex-shrink:0}
.contact-item strong{display:block;font-weight:600;font-size:.7rem;margin-bottom:1px}
.contact-item span{color:var(--text2);font-size:.7rem}
.form{display:flex;flex-direction:column;gap:1.2rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.form-grp{display:flex;flex-direction:column;gap:.2rem}
.form-lbl{font-size:.66rem;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.06em}
.form-lbl--req::after{content:' *';color:var(--red)}
.form-inp,.form-txt{padding:.6rem .7rem;background:var(--bg);border:1px solid var(--border);border-radius:3px;font-size:.78rem;color:var(--text);outline:none;transition:all .12s}
.form-inp:focus,.form-txt:focus{border-color:var(--green);box-shadow:0 0 0 2px var(--green-dim)}
.form-txt{min-height:110px;resize:vertical}
.form-inp.err,.form-txt.err{border-color:var(--red)}
.form-err{font-size:.64rem;color:var(--red)}
.form-msg{padding:.7rem .9rem;border-radius:3px;font-size:.7rem;font-weight:500}
.form-msg--ok{background:var(--green-dim);border:1px solid var(--green);color:var(--green)}
.form-msg--err{background:rgba(248,81,73,.06);border:1px solid var(--red);color:var(--red)}
.form-submit{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1.5rem;font-size:.74rem;font-weight:600;letter-spacing:.04em;background:var(--green);color:var(--bg);border-radius:3px;transition:all .12s;align-self:flex-start;font-family:var(--font)}
.form-submit:hover{background:#2ea043;transform:translateY(-1px)}
.form-submit:disabled{opacity:.4;cursor:not-allowed;transform:none}
@media(max-width:768px){.contact-grid{grid-template-columns:1fr;gap:2.5rem}.form-row{grid-template-columns:1fr}}

/* Footer */
.footer{border-top:1px solid var(--border);padding:2rem 0;position:relative;z-index:1;font-family:var(--font)}
.footer__inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.8rem}
.footer__left{display:flex;align-items:center;gap:1rem;font-size:.68rem;color:var(--text3)}
.footer__links{display:flex;gap:1rem}
.footer__links a{font-size:.68rem;color:var(--text3);transition:color .1s}
.footer__links a:hover{color:var(--text)}

/* Back top */
.back-top{position:fixed;bottom:1.2rem;right:1.2rem;z-index:99;width:30px;height:30px;border:1px solid var(--border);border-radius:3px;background:var(--bg2);color:var(--text3);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(4px);transition:all .2s;cursor:pointer;font-family:var(--font)}
.back-top.on{opacity:1;visibility:visible;transform:translateY(0)}
.back-top:hover{color:var(--text);border-color:var(--text2)}

/* Light */
[data-theme="light"]{--bg:#f6f8fa;--bg2:#fff;--border:#d0d7de;--text:#1f2328;--text2:#656d76;--text3:#8c959f;--green:#1a7f37;--green-dim:rgba(26,127,55,.06)}
[data-theme="light"] .terminal__scan{display:none}

.hidden{display:none!important}
.spinner{width:14px;height:14px;border:2px solid rgba(0,0,0,.2);border-top-color:#000;border-radius:50%;animation:spin .4s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}