@charset "UTF-8";
:root{color-scheme:dark;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#101011;color:#efeff1;font-synthesis:none;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
body{margin:0;min-width:280px}
a{color:inherit;text-decoration:none}
::selection{background:#6d5d8b;color:white}
.page{max-width:1040px;margin:auto;padding:56px 40px 80px}
.profile{text-align:center}
.avatar-link{display:inline-flex;border-radius:50%;padding:6px;border:1px solid #353337;transition:border-color .2s,transform .2s}
.avatar-link:hover{border-color:#8c7ba8;transform:translateY(-2px)}
.avatar{display:block;width:112px;height:112px;object-fit:cover;border-radius:50%}
h1{font-size:40px;letter-spacing:-1.5px;font-weight:600;line-height:1.15;margin:22px 0 0}
.socials{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:24px}
.tag{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:48px;padding:0 18px;border:1px solid #38353c;background:#1b191e;border-radius:10px;font-size:15px;line-height:1.4;color:#d3ceda;transition:background .2s,border-color .2s,color .2s}
.tag svg{width:17px;height:17px;fill:currentColor;flex-shrink:0}
.tag .external{font-size:17px;color:#968c9f;margin-left:3px}
.tag:hover{color:white;background:#28242e;border-color:#6a5b79}
.projects{margin-top:58px;scroll-margin-top:32px}
.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:38px 26px}
.project{display:block;min-width:0;border-radius:12px}
.art{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:12px;border:1px solid #302b36;background:#1b191f;isolation:isolate;transition:border-color .2s,box-shadow .2s}
.art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,#00000014);pointer-events:none}
.art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s,filter .4s;filter:saturate(.85) brightness(.92)}
.open{position:absolute;top:14px;right:14px;z-index:1;display:grid;place-items:center;width:36px;height:36px;border:1px solid #ffffff26;background:#131216b8;backdrop-filter:blur(8px);border-radius:50%;color:#eee8f5;font-size:21px;opacity:0;transform:translate(-3px,3px);transition:opacity .2s,transform .2s}
.caption{padding:17px 2px 0}
.caption h2{font-size:19px;line-height:1.4;font-weight:500;letter-spacing:-.25px;margin:0;color:#e2dde8;transition:color .2s}
.caption p{font-size:14px;line-height:1.6;margin:6px 0 0;color:#a39aaa}
.caption p span{padding:0 4px;color:#807589}
.project:hover .art,.project:focus-visible .art{border-color:#756086;box-shadow:0 6px 30px #0003}
.project:hover img,.project:focus-visible img{transform:scale(1.025);filter:saturate(1) brightness(1)}
.project:hover .open,.project:focus-visible .open{opacity:1;transform:none}
.project:hover h2{color:white}
a:focus-visible{outline:2px solid #b69aca;outline-offset:6px}
.skip-link{position:fixed;top:-100px;left:20px;z-index:5;background:#efeff1;color:#101011;border-radius:6px;padding:12px 18px}
.skip-link:focus{top:16px}
@media(max-width:700px){.page{padding:42px 24px 64px}.project-grid{gap:32px 20px}.caption h2{font-size:17px}.caption p{font-size:13px}.open{opacity:1;transform:none;width:32px;height:32px;font-size:19px}}
@media(max-width:580px){.page{max-width:480px;padding:36px 22px 56px}.avatar{width:104px;height:104px}h1{font-size:36px;margin-top:20px}.socials{gap:10px;margin-top:22px}.tag{min-height:48px;padding:0 16px}.projects{margin-top:46px}.project-grid{grid-template-columns:1fr;gap:32px}.caption h2{font-size:19px}.caption p{font-size:14px}.caption{padding-top:15px}}
@media(max-width:340px){.page{padding-right:16px;padding-left:16px}.tag{gap:8px;padding:0 12px;font-size:14px}.socials{gap:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
