:root{color-scheme:dark;--bg:#0a0a0b;--ink:#f6f1f1;--mute:#a99c9e;--glass:rgba(22,22,24,.7);--edge:rgba(255,255,255,.09);--acc:#e11d2e;--pink:#ff4d5e;--sky:#7a0f1a;--shadow:0 12px 40px rgba(225,29,46,.18);--link:#ff5a68;--track:rgba(255,255,255,.1);--glow:#1a0508;--tsh:rgba(225,29,46,.45);box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
:root[data-theme="light"]{color-scheme:light;--bg:#fbf5f5;--ink:#1a1213;--mute:#6b5a5c;--glass:rgba(255,255,255,.78);--edge:rgba(26,18,19,.09);--acc:#d4121f;--pink:#ff7a85;--sky:#f6b9be;--shadow:0 12px 36px rgba(180,20,30,.14);--link:#c40f1c;--track:rgba(26,18,19,.1);--glow:#ffe3e5;--tsh:rgba(225,29,46,.18)}
*{box-sizing:border-box}html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.7 "DM Sans",system-ui,sans-serif;min-height:100vh;background-image:radial-gradient(circle at 50% 0,var(--glow),transparent 60%);position:relative;overflow-x:hidden}
.blob{position:fixed;border-radius:50%;filter:blur(70px);opacity:.4;z-index:0;pointer-events:none}
.b1{width:420px;height:420px;background:var(--pink);top:-120px;left:-100px}.b2{width:480px;height:480px;background:var(--sky);bottom:-160px;right:-120px}.b3{width:320px;height:320px;background:var(--acc);top:40%;left:55%;opacity:.22}
.mono{font-family:"DM Mono",Consolas,monospace}
nav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px);z-index:5;width:max-content;max-width:calc(100% - 24px);margin:12px auto 0;display:flex;gap:4px;padding:6px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--edge);border-radius:999px;box-shadow:var(--shadow);overflow-x:auto}
nav a{padding:8px 16px;border-radius:999px;color:var(--mute);text-decoration:none;white-space:nowrap;font:14px "DM Mono",Consolas,monospace}
#theme{border:0;cursor:pointer;width:38px;height:38px;border-radius:50%;background:var(--acc);color:#fff;font-size:17px;line-height:1;flex:none;margin-left:2px}
#theme:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
nav a:focus-visible{outline:2px solid var(--acc)}
nav a.on{background:var(--acc);color:#fff;box-shadow:0 0 18px rgba(225,29,46,.55)}
main{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:36px 20px 40px}
section{display:none}section.on{display:block;animation:in .5s ease}
@keyframes in{from{opacity:0;transform:translateY(8px)}}
#home.on{display:block}
.win{background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--edge);border-radius:20px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:22px}
.bar{display:flex;align-items:center;gap:7px;padding:11px 16px;border-bottom:1px solid var(--edge);color:var(--mute);font:13px "DM Mono",monospace}
.bar i{width:11px;height:11px;border-radius:50%;background:#e11d2e}.bar i:nth-child(2){background:#7a0f1a}.bar i:nth-child(3){background:#3a3a3d}.bar span{margin-left:8px}
.body{padding:24px}
.hero{width:100%;margin:0}
.hero .body{display:grid;gap:28px;align-items:center;padding:28px}
.hero .txt{text-align:center}
.me{margin:0;position:relative;border-radius:22px;overflow:hidden;border:2px solid var(--acc);box-shadow:0 0 0 6px rgba(225,29,46,.12),0 0 50px rgba(225,29,46,.35);background:#fff}
.me img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;object-position:center 20%}
@media(min-width:820px){.hero .body{grid-template-columns:1.05fr 1fr;gap:48px;padding:40px 48px;min-height:calc(100vh - 190px)}.hero .txt{text-align:left}.me img{aspect-ratio:4/5}}
.hi{color:var(--mute);margin:0 0 6px}
h1{text-shadow:0 0 28px var(--tsh);font:italic 400 clamp(32px,7vw,58px)/1.1 Fraunces,Georgia,serif;margin:0;min-height:1.2em;overflow-wrap:anywhere}
.cur{display:inline-block;width:3px;height:.9em;background:var(--acc);box-shadow:0 0 10px var(--acc);margin-left:4px;vertical-align:-.1em;animation:bl 1s steps(1) infinite}
@keyframes bl{50%{opacity:0}}
.role{color:var(--mute);margin:14px 0 26px}
.btn{display:inline-block;padding:10px 22px;border-radius:999px;background:var(--acc);color:#fff;text-decoration:none;margin:4px;font-weight:500}
.btn.alt{background:transparent;color:var(--link);border:1px solid var(--acc)}
h2{font:500 clamp(28px,5vw,40px)/1.2 Fraunces,Georgia,serif;margin:0 0 22px;text-align:center}
h3{font:500 22px/1.3 Fraunces,Georgia,serif;margin:0 0 4px}
dl{display:grid;grid-template-columns:auto 1fr;gap:8px 22px;margin:0}dt{color:var(--mute)}dd{margin:0;overflow-wrap:anywhere}
a{color:var(--link)}
.skill{margin-bottom:14px}.skill .r{display:flex;justify-content:space-between;font-size:14px;margin-bottom:4px}
.track{height:8px;background:var(--track);border-radius:99px;overflow:hidden}.track i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#7a0f1a,#ff2d3f)}
.edu{display:grid;gap:22px;align-items:center}
@media(min-width:720px){.edu{grid-template-columns:1fr 250px}.edu.flip{grid-template-columns:250px 1fr}.edu.flip .pol{order:-1}}
.pol{background:#f4efef;padding:10px 10px 14px;border-radius:6px;box-shadow:0 10px 28px rgba(0,0,0,.6);transform:rotate(2deg);position:relative;max-width:300px;justify-self:center}
.flip .pol{transform:rotate(-2deg)}
.pol::before{content:"";position:absolute;top:-10px;left:50%;width:70px;height:22px;margin-left:-35px;background:rgba(225,29,46,.8);transform:rotate(-3deg)}
.pol img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;display:block;border-radius:2px}
.pol figcaption{color:#1a1a1c;text-align:center;font:italic 15px Fraunces,Georgia,serif;margin-top:8px}
.when{color:var(--link);font:13px "DM Mono",monospace;margin:0 0 4px}
.badge{display:inline-block;margin-top:10px;padding:3px 14px;border-radius:99px;background:linear-gradient(90deg,#b0121f,#ff2d3f);color:#fff;font-size:14px;font-weight:500}
.fam{display:flex;flex-wrap:wrap;gap:34px;justify-content:center;padding:14px 0}
.fam .pol{width:300px}
.empty{padding:44px 20px;text-align:center;color:var(--mute)}
footer{position:relative;z-index:1;text-align:center;color:var(--mute);font-size:13px;padding:10px 20px 28px}
@media(prefers-reduced-motion:reduce){.cur,section.on{animation:none}}
