*{box-sizing:border-box}html{color-scheme:light}body{margin:0;background:#167dbd;color:#173449;font:16px/1.65 Arial,Helvetica,sans-serif}a{color:inherit}a:focus-visible{outline:3px solid #125b91;outline-offset:5px}.layout{max-width:1280px;margin:28px auto;display:grid;grid-template-columns:minmax(0,40%) minmax(0,60%);background:#f0f5f4;box-shadow:0 16px 50px #064b7338;border:1px solid #a9cfde}.art{min-width:0;background:#268dc6;position:relative}.art-inner{position:sticky;top:20px;padding:0;height:auto}.art img{display:block;width:100%;height:auto;max-height:calc(100vh - 40px);object-fit:contain;object-position:top center}.content{min-width:0;padding:40px clamp(24px,4vw,52px);background:#f0f5f4}.intro{padding-bottom:26px;border-bottom:1px solid #b3c9d1}.title{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:15px}h1{font-size:clamp(64px,7vw,96px);line-height:1.12;font-weight:900;font-style:italic;letter-spacing:-.045em;color:#116ba4;margin:0}.star{display:inline-block;color:#cb6d60;font-size:38px;line-height:1;flex:none}.location{font:14px/1.6 monospace;color:#385669;margin:0 0 18px}.role{font-size:20px;line-height:1.45;font-weight:600;margin:0 0 12px}.summary{font-size:16px;line-height:1.75;color:#365366;margin:0;max-width:520px}.experience{margin-top:26px}.experience>h2{font:14px/1.5 monospace;color:#385669;margin:0 0 5px}.job{padding:24px 0;border-bottom:1px solid #b9ccd3}.job-heading{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:6px 18px}.job h3{font-size:26px;line-height:1.35;letter-spacing:-.6px;margin:0;color:#126c9f}.date{font:14px/1.6 monospace;color:#385669}.job-role{font-size:16px;line-height:1.5;font-weight:600;margin:9px 0 13px}.job ul{padding-left:20px;margin:0;color:#304d61;font-size:16px;line-height:1.75}.job li+li{margin-top:9px}.job li::marker{color:#39738d}.job strong{font-weight:600;color:#173c54}.contact{display:flex;gap:12px;flex-wrap:wrap;margin-top:27px}.contact a{text-decoration:none;min-height:50px;display:flex;align-items:center;justify-content:center;padding:12px 20px;font-size:16px;border:1px solid #9bb8c5;border-radius:3px;background:#e2edf0;transition:background-color 150ms ease,border-color 150ms ease}.contact a:first-child{background:#f3a394;border-color:#cf8072;color:#382927;flex:1}.contact a:hover{background:#cfe2e9;border-color:#5e94ac}.contact a:first-child:hover{background:#ed9584;border-color:#b36c60}
@media(max-width:1340px){.layout{margin:24px}}@media(max-width:1000px){.layout{margin:18px;grid-template-columns:minmax(0,34%) minmax(0,66%)}.content{padding:30px 26px}h1{font-size:76px}.star{font-size:34px}.role{font-size:19px}.job-heading{display:block}.date{display:block;margin-top:5px}}
@media(max-width:720px){.layout{display:flex;flex-direction:column;margin:12px}.art-inner{position:static;height:auto;padding:0;background:#268dc6}.art img{height:220px;max-height:none;width:100%;object-fit:contain;object-position:center}.content{padding:27px 22px}.title{gap:18px}h1{font-size:clamp(60px,16vw,82px)}.star{font-size:32px}.role{font-size:19px}.location{font-size:14px}.job{padding:22px 0}.job h3{font-size:25px}.contact a{flex:1 1 100%}.job-heading{display:block}}
@media(max-width:360px){.layout{margin:8px}.content{padding:24px 16px}.art img{height:190px}.title{gap:12px}h1{font-size:60px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.metrics{display:grid;grid-template-columns:1.15fr .85fr 1.15fr;gap:0;margin:25px 0 30px;padding:22px 0;background:linear-gradient(110deg,#e2eef1,#f8fbfa);border-top:1px solid #b4cbd4;border-bottom:1px solid #b4cbd4}
.metric{min-width:0;padding:0 15px;border-right:1px solid #bacfd6}.metric:first-child{padding-left:16px}.metric:last-child{border-right:0}.metric strong{display:block;font-size:36px;line-height:1.25;letter-spacing:-1.5px;color:#126b9f;font-variant-numeric:tabular-nums}.metric strong span{font-size:26px;color:#bd6254}.metric p{font-size:14px;font-weight:600;line-height:1.45;margin:7px 0 5px;color:#244b63}.metric small{display:block;font-size:12px;line-height:1.5;color:#426075}.intro{border-bottom:0;padding-bottom:0}.experience{margin-top:0}.job{border-left:2px solid #c1d6dd;padding-left:20px;margin-top:12px;padding-top:17px;padding-bottom:25px}.job:first-of-type{border-left-color:#d98576}.job-heading{align-items:start}.date{font-size:13px;padding-top:5px}.job-role{color:#25465e}.contact{padding-top:8px}.art{background:linear-gradient(#268dc6,#187dbb)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.metric strong{transition:color 180ms ease}.metric:hover strong{color:#b65e52}.contact a{transition:background-color 150ms ease,box-shadow 150ms ease}.contact a:hover{box-shadow:0 3px 12px #245b701b}}
@media(max-width:1000px){.metric{padding:0 10px}.metric:first-child{padding-left:10px}.metric strong{font-size:32px}.metric p{font-size:14px}}
@media(max-width:420px){.metrics{grid-template-columns:1fr;gap:15px;padding:19px 16px}.metric,.metric:first-child{display:grid;grid-template-columns:78px 1fr;column-gap:12px;padding:0 0 14px;border-right:0;border-bottom:1px solid #c4d5dc}.metric:last-child{padding-bottom:0;border-bottom:0}.metric strong{grid-row:span 2;align-self:center;font-size:32px}.metric p{margin:0 0 3px}.metric small{grid-column:2}.job{padding-left:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* PS2-inspired reflections: text stays opaque and geometry stays stable. */
@media (prefers-reduced-motion:no-preference){
  h1{animation:chrome-reflection 7s ease-in-out 2;text-shadow:0 1px #fff,0 3px #98bacb}
  .star{animation:coral-reflection 6s ease-in-out 2}
  .metrics{position:relative;background-size:200% 100%;animation:panel-reflection 8s ease-in-out 2}
  .job{transition:border-color 240ms ease,background-color 240ms ease,box-shadow 240ms ease}
  .contact a{transition:background-color 180ms ease,border-color 180ms ease,box-shadow 180ms ease}
  .contact a:active{box-shadow:inset 0 2px 5px #163b6326}
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .job:hover{border-left-color:#d98576;background-color:#e8f0f2;box-shadow:8px 0 0 #e8f0f2}
  .metric{transition:background-color 250ms ease}
  .metric:hover{background-color:#dcebf0}
  .title:hover .star{animation:star-nudge 650ms ease-out 1}
  .contact a:hover{box-shadow:0 0 0 3px #85b4c22b,inset 0 1px #fff9}
}
@keyframes chrome-reflection{
  0%,40%,100%{color:#116ba4;text-shadow:0 1px #fff,0 3px #98bacb}
  55%{color:#285d83;text-shadow:1px 1px #fff,-1px 3px #c69991}
  70%{color:#116ba4;text-shadow:0 1px #fff,0 3px #98bacb}
}
@keyframes coral-reflection{0%,100%{color:#cb6d60}50%{color:#a85252}}
@keyframes panel-reflection{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes star-nudge{0%,100%{transform:rotate(0)}45%{transform:rotate(12deg)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Deep-blue console frame with a quiet, readable silver content surface. */
body{background:#07376b;background-image:radial-gradient(ellipse at 10% 0%,#2389c4 0,transparent 48%),radial-gradient(ellipse at 90% 90%,#125390 0,transparent 50%);background-attachment:fixed}
.layout{max-width:1370px;margin:36px auto;border:1px solid #acc8d6;border-radius:10px;box-shadow:0 0 0 5px #084274,0 0 0 6px #5085a7,0 30px 80px #00172d70;gap:0}
.art{border-radius:9px 0 0 9px;background:linear-gradient(155deg,#3b9bd0,#0c538c 70%,#143c67);border-right:1px solid #759daf}
.art-inner{top:24px;padding:18px}.art img{border:1px solid #aad9e5;border-radius:3px;box-shadow:0 16px 35px #052b5955;max-height:calc(100vh - 84px)}
.content{background:linear-gradient(135deg,#f5f9f9,#e4edf0 80%);border-radius:0 9px 9px 0;padding:43px clamp(25px,3.3vw,48px)}
.title{margin-bottom:19px}h1{letter-spacing:-.06em}.location{color:#315870}.summary{color:#36586c}.role{font-size:21px}
.metrics{border:1px solid #a9c2cf;border-radius:5px;background:linear-gradient(115deg,#fafdfe,#dce8ee 40%,#f5f9fb);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #fff8,0 6px 14px #0e41670a;padding:20px 0;margin:26px 0 30px}
.metric strong{font-size:39px;color:#135d8f}.metric small{color:#3d596c}.experience>h2{margin-bottom:16px;font-size:14px}
.job{position:relative;isolation:isolate;padding:25px 24px;margin-top:14px;border:1px solid #b0c6d0!important;border-radius:6px;background:linear-gradient(120deg,#f8fbfc,#e9f0f3);box-shadow:inset 0 1px 0 #fff,0 4px 10px #16426308;outline:none}
.job:first-of-type{border-color:#a2bdc9!important}.job-heading{padding-right:70px;display:block;min-height:57px}.job h3{font-size:27px;color:#135b89}.date{display:block;font-size:13px;color:#405d70;margin-top:5px;padding:0}.job-role{margin-top:13px}.job ul{color:#315269;font-size:16px;line-height:1.75}.job-symbol{position:absolute;right:20px;top:23px;width:58px;height:58px;display:grid;place-items:center;border-radius:50%;border:1px solid #b2c7d2;background:linear-gradient(145deg,#fff,#d1e0e9 50%,#f4f9fc);box-shadow:inset 0 1px #fff,0 3px 7px #103d5c13;color:#6a879b;font:36px/1 Arial,sans-serif;pointer-events:none}
.job:after{content:'';position:absolute;inset:0;border-radius:6px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at var(--shine-x,80%) var(--shine-y,10%),#c0deef77,transparent 65%);opacity:0}
.job:focus-visible{outline:2px solid #176a9b;outline-offset:4px}.job:focus-visible .job-symbol{color:#b76557;border-color:#cc968d}.job:focus-visible:after{opacity:1}
.contact{margin-top:27px;padding:0}.contact a{border-radius:4px;box-shadow:inset 0 1px #fff,0 4px 9px #143c6514;background:linear-gradient(#fcfeff,#cddfe8)}.contact a:first-child{background:linear-gradient(#ffc1b1,#e99a89);border-color:#c57f70}
@media (hover:hover) and (pointer:fine){.job:hover{background:linear-gradient(120deg,#f8fbfc,#e9f0f3);border-color:#77a5bd!important;box-shadow:inset 0 1px #fff,0 8px 22px #15476717}.job:hover:after{opacity:1}.job:hover .job-symbol{color:#145b87;border-color:#88adc1;background:linear-gradient(145deg,#fff,#c4dfed 50%,#fff)}.job-aeroflot:hover .job-symbol{color:#b96b5b}.job-initia:hover .job-symbol{color:#387163}}
@media(prefers-reduced-motion:no-preference){.job-symbol{transition:color .25s,border-color .25s,box-shadow .25s}.job:after{transition:opacity .3s}}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.job-aeroflot:hover .job-symbol{animation:flight-symbol 900ms ease-out 1}.job-peaq:hover .job-symbol{animation:signal-symbol 1.2s ease-out 1}.job-initia:hover .job-symbol{animation:branch-symbol 700ms ease-out 1}.job-wws:hover .job-symbol{animation:cursor-symbol 650ms ease-out 1}}
@keyframes flight-symbol{0%,100%{transform:translate(0,0)}45%{transform:translate(4px,-4px)}}
@keyframes signal-symbol{0%,100%{box-shadow:0 0 0 0 #538caf00}40%{box-shadow:0 0 0 8px #538caf26}75%{box-shadow:0 0 0 14px #538caf00}}
@keyframes branch-symbol{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes cursor-symbol{0%,100%{transform:translate(0,0)}35%{transform:translate(-3px,-3px)}65%{transform:translate(-3px,-3px) scale(.94)}}
@media(max-width:1430px){.layout{margin:28px}}@media(max-width:1000px){.layout{margin:22px}.content{padding:32px 24px}.art-inner{padding:12px}.job{padding:22px 19px}.job-symbol{right:17px;top:21px;width:51px;height:51px;font-size:32px}.job-heading{padding-right:58px}.job h3{font-size:25px}.metric strong{font-size:33px}}
@media(max-width:720px){.layout{margin:15px;border-radius:7px}.art{border-right:0;border-bottom:1px solid #a3bdcc;border-radius:6px 6px 0 0}.art-inner{padding:14px;position:static}.art img{height:230px;width:auto;max-width:100%;max-height:none;margin:auto;object-fit:contain}.content{padding:29px 20px;border-radius:0 0 6px 6px}.job{padding:20px 18px}.job-symbol{top:20px;right:15px;width:48px;height:48px;font-size:30px}.job-heading{padding-right:55px}.job h3{font-size:24px}.job-role{margin-top:13px}.job ul{padding-left:17px}.role{font-size:19px}}
@media(max-width:420px){.metrics{padding:19px 16px}.metric strong{font-size:32px}.job{padding:20px 15px}.job-symbol{right:12px;width:44px;height:44px}.job-heading{padding-right:48px}.job h3{font-size:22px}.date{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Topic-specific icons, restrained light trails and a stronger console finish. */
.job-symbol{border-radius:15px;color:#315f7b}.job-symbol svg{width:29px;height:29px;stroke-width:1.65;display:block;overflow:visible}
.job{--role-accent:#5184aa}.job-aeroflot{--role-accent:#bb7867}.job-peaq{--role-accent:#367b91}.job-initia{--role-accent:#5b8777}
.job:before{content:'';position:absolute;left:-1px;top:22px;bottom:22px;width:3px;border-radius:2px;background:var(--role-accent);pointer-events:none;transform:scaleY(.22);transform-origin:top;opacity:.4}
.job-symbol:after{content:'';position:absolute;inset:-5px;border:1px solid var(--role-accent);border-radius:19px;opacity:0;pointer-events:none}
.job:focus-visible .job-symbol,.job:active .job-symbol{color:var(--role-accent)}
@media(prefers-reduced-motion:no-preference){
 .job:before{transition:transform 450ms cubic-bezier(.2,.75,.25,1),opacity 300ms}
 .job-symbol svg{transition:filter 300ms}
 .art img{animation:art-reflection 9s ease-in-out 2}
 .metrics{animation:panel-reflection 8s ease-in-out 2;box-shadow:inset 0 1px #fff,0 5px 20px #236e9014}
 .contact a{background-size:200% 100%;transition:background-position 500ms,box-shadow 250ms,border-color 250ms}
 .contact a:hover,.contact a:focus-visible{background-position:100% 0}
}
@media(hover:hover) and (pointer:fine){
 .job:hover{border-color:var(--role-accent)!important;box-shadow:inset 0 1px #fff,0 9px 26px #15476720}
 .job:hover:before,.job:focus-visible:before{transform:scaleY(1);opacity:1}
 .job:hover .job-symbol{color:var(--role-accent);box-shadow:inset 0 1px #fff,0 5px 14px #1a507d22}
 .job:hover .job-symbol svg{filter:drop-shadow(0 2px 1px #fff)}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .job:hover .job-symbol{animation:none}
 .job:hover .job-symbol:after{animation:icon-orbit 850ms ease-out 1}
 .job-aeroflot:hover .job-symbol svg{animation:flight-symbol 950ms ease-in-out 1}
 .job-peaq:hover .job-symbol svg{animation:community-symbol 850ms ease-out 1}
 .job-initia:hover .job-symbol svg{animation:book-symbol 850ms ease-out 1}
 .job-wws:hover .job-symbol svg{animation:message-symbol 800ms ease-out 1}
}
@keyframes icon-orbit{0%{opacity:0;transform:scale(.93)}35%{opacity:.45}100%{opacity:0;transform:scale(1.18)}}
@keyframes community-symbol{0%,100%{transform:scale(1)}40%{transform:scale(1.12)}70%{transform:scale(.98)}}
@keyframes book-symbol{0%,100%{transform:perspective(100px) rotateY(0)}40%{transform:perspective(100px) rotateY(-18deg)}70%{transform:perspective(100px) rotateY(8deg)}}
@keyframes message-symbol{0%,100%{transform:translateY(0)}40%{transform:translateY(-4px) rotate(-5deg)}70%{transform:translateY(0) rotate(2deg)}}
@keyframes art-reflection{0%,100%{box-shadow:0 16px 35px #052b5955}50%{box-shadow:0 16px 35px #052b5955,0 0 22px #a6dbe633}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.job:before{transform:none}}

/* Pixel-cat mascot: a small animated stamp beside the name. */
.cat-badge{position:fixed;left:18px;top:50%;transform:translateY(-50%) rotate(3deg);display:block;width:86px;height:86px;z-index:50;border:2px solid #f3fbff;border-radius:5px;background:#77b9dc;box-shadow:0 0 0 1px #729eb5,5px 6px 0 #174f78;overflow:hidden}
.cat-badge:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px #ffffff80}
.cat-badge img{display:block;width:100%;height:100%;object-fit:cover}
@media(prefers-reduced-motion:no-preference){.cat-badge{animation:cat-float 3.4s ease-in-out infinite;transform-origin:50% 80%}.cat-badge img{animation:cat-breathe 3.4s ease-in-out infinite}}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.cat-badge:hover{animation:cat-surprise 650ms ease-out 1}.cat-badge:hover img{animation:none;transform:scale(1.08)}}
@keyframes cat-float{0%,100%{transform:translateY(-50%) rotate(3deg)}50%{transform:translateY(calc(-50% - 7px)) rotate(-2deg)}}
@keyframes cat-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
@keyframes cat-surprise{0%,100%{transform:translateY(-50%) rotate(3deg)}30%{transform:translateY(calc(-50% - 11px)) rotate(-7deg) scale(1.04)}60%{transform:translateY(calc(-50% - 5px)) rotate(7deg) scale(1.04)}}
@media(max-width:1000px){.cat-badge{width:72px;height:72px;left:14px}}
@media(max-width:720px){.cat-badge{width:64px;height:64px;left:10px;top:auto;bottom:14px;transform:rotate(3deg)}.cat-badge{animation-name:cat-float-mobile}}
@media(max-width:420px){.cat-badge{width:56px;height:56px;box-shadow:0 0 0 1px #729eb5,3px 4px 0 #174f78}}
@keyframes cat-float-mobile{0%,100%{transform:translateY(0) rotate(3deg)}50%{transform:translateY(-7px) rotate(-2deg)}}