
:root {
  color-scheme:light;
  --bg:#fff;
  --surface:#fff;
  --text:#000;
  --muted:#606060;
  --line:#d8d8d8;
  --accent:#000;
  --soft:#eee;
  --button-text:#fff;
  --header-bg:#fff;
  --max:1040px;
}
html[data-theme="dark"] {
  color-scheme:dark;
  --bg:#000;
  --surface:#000;
  --text:#fff;
  --muted:#b0b0b0;
  --line:#303030;
  --accent:#fff;
  --soft:#171717;
  --button-text:#000;
  --header-bg:#000;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth;scroll-padding-top:95px}
body {margin:0;min-width:320px;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:15px;line-height:1.65;-webkit-font-smoothing:antialiased}
a {color:inherit;text-decoration-thickness:1px;text-underline-offset:5px}
button {font:inherit;color:inherit;cursor:pointer}
button,a {-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible {outline:3px solid var(--accent);outline-offset:5px}
img {display:block;max-width:100%;height:auto}
h1,h2,h3,h4,p {margin:0}
h2 {font-size:32px;line-height:1.25;letter-spacing:-.04em;font-weight:600}
h3 {font-size:23px;line-height:1.3;letter-spacing:-.025em;font-weight:600}
.skip-link {position:fixed;left:16px;top:0;z-index:100;background:var(--surface);padding:12px 18px;transform:translateY(-110%)}
.skip-link:focus {top:10px;transform:none}
.site-header {position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:32px;padding:16px max(28px,calc((100vw - var(--max))/2));border-bottom:1px solid var(--line);background:var(--header-bg)}
.logo {display:flex;align-items:center;gap:10px;flex-shrink:0;text-decoration:none;font-size:15px;font-weight:650;line-height:1.25}
.logo small {display:block;margin-top:2px;font-size:10px;font-weight:400;letter-spacing:.04em;color:var(--muted)}
.nav {display:flex;gap:27px;margin-left:auto}
.nav a {padding:8px 0;font-size:13px;text-decoration:none;color:var(--muted)}
.nav a:hover,.nav a[aria-current] {color:var(--accent)}
.nav a[aria-current] {text-decoration:underline;text-underline-offset:7px}
.header-actions {display:flex;align-items:center;gap:8px}
.theme-toggle {display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 10px;border:1px solid var(--line);border-radius:5px;background:transparent;font-size:12px;white-space:nowrap}
.theme-toggle:hover {background:var(--soft)}
.theme-icon {width:17px;height:17px}
.theme-icon svg {width:100%;height:100%}
.sun-icon {display:none}
[data-theme="dark"] .sun-icon {display:block}
[data-theme="dark"] .moon-icon {display:none}
.menu-button {display:none;width:40px;height:40px;padding:8px;border:1px solid var(--line);border-radius:5px;background:transparent}
.menu-button span {display:block;width:20px;height:1.5px;margin:5px auto;background:var(--text)}
.section {max-width:var(--max);width:calc(100% - 56px);margin:0 auto;padding:64px 0;border-bottom:1px solid var(--line)}
.hero {display:grid;grid-template-columns:minmax(0,1fr) 238px;gap:100px;align-items:center;padding:70px 0 65px}
.eyebrow {font-size:12px;color:var(--muted);margin-bottom:17px}
.hero h1 {font-size:clamp(58px,6.5vw,78px);font-weight:500;letter-spacing:.015em;word-spacing:.18em;font-kerning:none;line-height:1.06;margin-bottom:14px}
.hero-role {font-size:25px;line-height:1.35;letter-spacing:-.025em;margin-bottom:17px}
.hero-text {max-width:560px;font-size:16px;color:var(--muted);line-height:1.8}
.hero-actions {display:flex;gap:28px;align-items:center;margin-top:26px;flex-wrap:wrap}
.button {display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:44px;padding:11px 17px;border:1px solid transparent;border-radius:5px;text-decoration:none;font-size:13px;font-weight:550;line-height:1.4}
.primary {background:var(--accent);color:var(--button-text)}
.primary:hover {filter:brightness(1.12)}
.text-link {display:inline-flex;align-items:center;gap:10px;min-height:32px;font-size:13px;font-weight:550;text-decoration:none}
.text-link:hover {text-decoration:underline}
.profile-photo {width:238px;height:274px;object-fit:cover;object-position:center 40%;border-radius:8px}
.work-status {display:flex;gap:18px;align-items:center;margin-top:30px}
.availability-label {padding:5px 9px;background:var(--soft);color:var(--accent);border-radius:4px;font-size:11px;font-weight:550;white-space:nowrap}
.work-status p {font-size:11px;line-height:1.8;color:var(--muted)}
.section-heading {display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:30px}
.section-heading > p {font-size:12px;color:var(--muted)}
.project-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.project-card {display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;background:var(--surface);overflow:hidden}
.project-visual {height:215px;overflow:hidden;position:relative}
.project-copy {padding:25px 26px 22px;flex:1;display:flex;flex-direction:column;align-items:flex-start}
.project-category {color:var(--muted);font-size:11px;margin-bottom:8px}
.project-copy h3 {margin-bottom:12px}
.project-copy > p:not(.project-category) {font-size:14px;color:var(--muted);line-height:1.8;margin-bottom:20px}
.project-copy > .text-link,.project-links {margin-top:auto}
.project-links {display:flex;gap:25px;flex-wrap:wrap}
.convert-visual {background:var(--bg);color:var(--text);padding:23px 27px}
.visual-wordmark {display:block;font-size:14px;letter-spacing:-.03em;font-weight:650}
.file-formats {display:flex;gap:22px;align-items:center;justify-content:center;margin:26px 0 21px;font-size:23px;font-weight:500;letter-spacing:-.025em}
.file-formats > span:not(.format-arrow) {border:1px solid var(--line);border-radius:6px;padding:9px 20px;background:var(--bg)}
.format-arrow {font-size:26px;font-weight:400}
.visual-caption {display:block;text-align:center;font-size:11px}
.journal-visual {padding:23px 27px;background:var(--bg);color:var(--text)}
.journal-visual .visual-wordmark {font-family:Georgia,serif;font-size:17px}
.journal-title {display:block;font-family:Georgia,serif;text-align:center;font-size:34px;letter-spacing:-.025em;line-height:1.1;margin:17px 0 13px}
.resume-layout {display:grid;grid-template-columns:minmax(0,1.65fr) minmax(220px,1fr);gap:80px}
.resume-block + .resume-block {margin-top:32px}
.resume-block h3,.skills h3 {font-size:15px;font-weight:600;letter-spacing:0;margin-bottom:15px}
.resume-block h4 {font-size:15px;font-weight:550;line-height:1.5;margin-bottom:3px}
.resume-block p {font-size:14px;color:var(--muted);line-height:1.8}
.resume-block .entry-context {font-size:11px;margin-bottom:10px}
.recognition p {font-size:12px}
.recognition p + p {margin-top:12px}
.recognition strong {font-weight:550;color:var(--text)}
.skills {border-left:1px solid var(--line);padding-left:32px}
.skills dl {margin:0}
.skills dt {font-size:12px;font-weight:550;margin-top:23px}
.skills dd {margin:5px 0 0;color:var(--muted);font-size:13px;line-height:1.85}
.skills dt:first-child {margin-top:0}
.print-resume {border:0;padding:5px 0;background:transparent;color:var(--muted)}
.print-heading {display:none}
.contact-section {display:flex;justify-content:space-between;gap:32px;align-items:center;padding:56px 0}
.contact-section h2 {font-size:36px}
.contact-section p {font-size:13px;color:var(--muted);margin-top:10px}
.contact-details {display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.contact-email {font-size:22px;letter-spacing:-.03em;text-decoration:none}
.contact-email:hover {text-decoration:underline}
.contact-email span {font-size:17px;margin-left:12px}
.contact-phone {font-size:13px;color:var(--muted);text-decoration:none}
.contact-phone:hover {text-decoration:underline}
footer {max-width:var(--max);width:calc(100% - 56px);margin:0 auto;padding:23px 0;display:flex;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted)}
footer a {text-decoration:none}
footer a:hover {text-decoration:underline}
html:not(.js) .theme-toggle,html:not(.js) .menu-button,html:not(.js) .print-resume {display:none}
@media (max-width:1000px) {
  .hero {gap:55px;grid-template-columns:minmax(0,1fr) 210px}
  .profile-photo {width:210px;height:250px}
  .resume-layout {gap:40px}
  .site-header {gap:24px}
}
@media (max-width:760px) {
  .site-header {padding:12px 22px;gap:15px;flex-wrap:wrap}
  .header-actions {margin-left:auto}
  .menu-button {display:block}
  .nav {display:none;order:3;width:100%;margin:0;gap:28px;padding:6px 0}
  .nav.open,html:not(.js) .nav {display:flex}
  .nav a {font-size:14px;min-height:40px}
  .section {width:calc(100% - 44px);padding:44px 0}
  .hero {grid-template-columns:minmax(0,1fr) 150px;gap:25px;padding-top:46px}
  .hero h1 {font-size:clamp(42px,7.5vw,57px)}
  .hero-role {font-size:22px}
  .hero-text {font-size:14px}
  .profile-photo {width:150px;height:182px}
  .hero-actions {gap:21px}
  .work-status {gap:12px;align-items:flex-start;flex-direction:column;margin-top:23px}
  .work-status p {font-size:11px}
  .section-heading {align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:23px}
  .section-heading h2 {font-size:28px}
  .section-heading > p {width:100%}
  .project-grid {gap:18px}
  .project-visual {height:180px}
  .project-copy {padding:21px 20px}
  .project-copy h3 {font-size:21px}
  .project-copy > p:not(.project-category) {font-size:13px}
  .file-formats {font-size:18px;gap:12px;margin:20px 0 17px}
  .file-formats > span:not(.format-arrow) {padding:6px 12px}
  .convert-visual,.journal-visual {padding:20px}
  .journal-title {font-size:27px;margin:11px 0 10px}
  .orbit-visual img {width:125px;height:125px}
  .resume-layout {grid-template-columns:minmax(0,1.45fr) minmax(180px,1fr);gap:26px}
  .skills {padding-left:22px}
  .contact-email {font-size:18px}
  .contact-email span {margin-left:5px}
  footer {width:calc(100% - 44px)}
}
@media (max-width:560px) {
  .hero {grid-template-columns:minmax(0,1fr);gap:25px;padding-top:37px}
  .hero-copy {grid-column:1;grid-row:1}
  .profile-photo {grid-column:1;grid-row:1;align-self:start;justify-self:end;width:68px;height:80px;border-radius:5px}
  .eyebrow {max-width:calc(100% - 80px);font-size:11px;margin-bottom:17px}
  .hero h1 {font-size:clamp(32px,10.7vw,48px);max-width:calc(100% - 75px);margin-bottom:20px}
  .hero-role {font-size:22px;margin-bottom:13px}
  .hero-text {font-size:15px}
  .hero-actions {gap:21px;margin-top:23px}
  .work-status {flex-direction:row;align-items:center;gap:15px;margin-top:26px}
  .availability-label {font-size:10px;padding:5px 7px}
  .work-status p {font-size:10px}
  .project-grid {grid-template-columns:minmax(0,1fr);gap:22px}
  .project-visual {height:190px}
  .hero-visual img {width:100%;height:100%}
  .project-copy h3 {font-size:23px}
  .project-copy > p:not(.project-category) {font-size:14px}
  .file-formats {font-size:21px;gap:21px;margin:24px 0 17px}
  .file-formats > span:not(.format-arrow) {padding:7px 20px}
  .journal-title {font-size:31px;margin:14px 0 12px}
  .resume-layout {grid-template-columns:minmax(0,1fr);gap:30px}
  .skills {border-left:0;border-top:1px solid var(--line);padding:26px 0 0}
  .skills dl {display:grid;grid-template-columns:105px minmax(0,1fr);gap:14px 15px}
  .skills dt,.skills dd {margin:0;font-size:12px;line-height:1.8}
  .contact-section {align-items:flex-start;flex-direction:column;gap:24px}
  .contact-section h2 {font-size:32px}
  .contact-email {font-size:22px}
  .contact-phone {font-size:14px}
}
@media (max-width:360px) {
  .site-header {padding-inline:18px;gap:10px}
  #theme-label {display:none}
  .theme-toggle {width:40px}
  .section,footer {width:calc(100% - 36px)}
  .hero h1 {font-size:32px;word-spacing:.14em;margin-bottom:25px}
  .eyebrow {font-size:10px}
  .hero-actions {gap:19px}
  .hero-actions .button {padding-inline:12px;font-size:12px;gap:12px}
  .hero-actions .text-link {font-size:12px}
  .work-status {gap:10px}
  .contact-email {font-size:20px}
}
@media (prefers-reduced-motion:reduce) {html {scroll-behavior:auto}}
@media print {
  @page {size:letter;margin:15mm 17mm}
  html,body {background:white!important;color:#111!important;font-size:10pt}
  .site-header,.skip-link,.hero,.work-section,.games-section,.contact-section,footer,.resume-section > .section-heading {display:none!important}
  .resume-section {width:100%;max-width:none;margin:0;padding:0;border:0}
  .print-heading {display:block;border-bottom:1px solid #bbb;margin-bottom:6mm;padding-bottom:4mm}
  .print-heading h1 {font-size:24pt;line-height:1.2;margin-bottom:2mm;letter-spacing:-.04em}
  .print-heading p {font-size:9pt;line-height:1.55}
  .resume-layout {display:grid;grid-template-columns:1.6fr 1fr;gap:8mm}
  .resume-block + .resume-block {margin-top:6mm}
  .resume-block {break-inside:avoid}
  .resume-block h3,.skills h3 {font-size:11pt;margin-bottom:2mm}
  .resume-block h4 {font-size:10pt}
  .resume-block p,.resume-block .entry-context,.recognition p {font-size:9pt;color:#333;line-height:1.6}
  .skills {border-left:1px solid #bbb;padding-left:5mm}
  .skills dt {font-size:9pt;margin-top:5mm;color:#111}
  .skills dd {font-size:9pt;color:#333;margin-top:1mm}
  .recognition strong {color:#111}
}

/* Compact game catalog. */
.games-heading {display:flex;align-items:baseline;gap:22px;flex-wrap:wrap}
.release-count {font-size:13px;color:var(--muted)}
.release-count strong {color:var(--text);font-weight:600}
.games-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px 18px}
.game-tile {min-width:0;text-align:center;padding:15px 8px 9px;border:1px solid transparent;border-radius:7px}
.game-tile:hover,.game-tile:focus-within {border-color:var(--line)}
.game-main-link {display:flex;flex-direction:column;align-items:center;gap:12px;text-decoration:none}
.game-main-link h3 {font-size:13px;letter-spacing:-.015em;line-height:1.5;font-weight:550;min-height:39px;max-width:165px}
.game-main-link:hover h3 {text-decoration:underline}
.game-icon {display:grid;place-items:center;width:80px;height:80px}
.game-icon img {max-width:80px;max-height:80px;width:80px;height:80px;border-radius:10px;object-fit:contain}
.game-stores {display:flex;justify-content:center;align-items:center;gap:0 12px;flex-wrap:wrap;margin-top:3px}
.game-stores a {display:inline-flex;align-items:center;min-height:30px;font-size:10px;text-decoration:none;color:var(--muted);white-space:nowrap}
.game-stores a:hover {color:var(--text);text-decoration:underline}
.project-visual {border-bottom:1px solid var(--line)}
.contact-telegram {font-size:13px;text-decoration:none;color:var(--muted)}
.contact-telegram:hover {color:var(--text);text-decoration:underline}
.footer-links {display:flex;gap:26px;flex-wrap:wrap}
section[tabindex]:focus,main[tabindex]:focus {outline:none}
@media (max-width:1000px) {
  .nav {gap:20px}
  .games-grid {grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:760px) {
  .games-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 10px}
  .games-heading {gap:16px}
  .games-section > .section-heading {align-items:center}
}
@media (max-width:560px) {
  .games-grid {gap:16px 6px}
  .game-tile {padding-inline:2px}
  .game-main-link h3 {font-size:12px;min-height:36px}
  .game-stores {gap:0 9px}
  .footer-links {gap:11px;flex-direction:column;align-items:flex-end}
}
@media (max-width:440px) {
  .games-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 14px}
  .game-main-link h3 {max-width:150px;font-size:12px}
  .games-heading {gap:16px}
  .games-section .section-heading > .text-link {font-size:12px}
  .game-stores a {font-size:11px;min-height:32px}
}

.channel-links {display:flex;flex-wrap:wrap;gap:4px 23px;margin-top:9px}
.channel-links a {display:inline-flex;align-items:center;gap:7px;min-height:34px;font-size:12px;text-decoration:none}
.channel-links a:hover {text-decoration:underline}
@media print {
  .channel-links {gap:4mm;margin-top:2mm}
  .channel-links a {font-size:9pt;min-height:0;color:#111}
}

.wordmark {font-size:17px;letter-spacing:.01em;word-spacing:.12em}
.wordmark small {word-spacing:normal}

.name-first,.name-last {white-space:nowrap}
.name-final-t {margin-inline-start:.035em}
.wordmark {letter-spacing:.035em;font-weight:550}
.contact-form-link {margin-top:9px;color:var(--text)}
.contact-page {min-height:calc(100vh - 144px)}
.contact-layout {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:95px;align-items:start;padding-top:72px;padding-bottom:72px}
.contact-intro h1,.thanks-content h1 {font-size:clamp(40px,4.5vw,60px);font-weight:500;letter-spacing:-.02em;line-height:1.12;margin:0 0 22px}
.contact-lead {font-size:16px;color:var(--muted);line-height:1.8;max-width:335px}
.direct-contact {margin:34px 0 0}
.direct-contact dt {font-size:12px;color:var(--muted);margin-top:22px}
.direct-contact dd {margin:5px 0 0;font-size:15px;overflow-wrap:anywhere}
.direct-contact a {text-decoration:none}
.direct-contact a:hover {text-decoration:underline}
.contact-location {margin-top:30px;color:var(--muted);font-size:12px}
.message-form {border:1px solid var(--line);border-radius:8px;padding:30px;background:var(--surface)}
.message-form h2 {font-size:24px;letter-spacing:-.02em}
.form-intro {font-size:12px;color:var(--muted);margin:8px 0 25px}
.form-field {margin-bottom:21px}
.form-field label {display:block;font-size:13px;font-weight:550;margin-bottom:8px}
.form-field input,.form-field textarea {display:block;width:100%;border:1px solid var(--line);border-radius:4px;background:var(--bg);color:var(--text);font:inherit;font-size:16px;line-height:1.6;padding:11px 12px}
.form-field textarea {resize:vertical;min-height:170px}
.form-field input:focus,.form-field textarea:focus {outline:2px solid var(--accent);outline-offset:2px}
.form-note {font-size:11px;color:var(--muted);margin-top:18px;line-height:1.7}
.form-trap {display:none}
.thanks-page {min-height:calc(100vh - 144px)}
.thanks-content {padding-top:100px;padding-bottom:100px;min-height:60vh}
.thanks-content > p:not(.eyebrow) {color:var(--muted);font-size:16px;max-width:450px;margin-bottom:32px}
.thanks-content > .text-link {margin-left:24px}
@media (max-width:1000px) {
  .contact-layout {gap:45px}
}
@media (max-width:760px) {
  .contact-layout {grid-template-columns:minmax(0,1fr);gap:35px;padding-top:42px;padding-bottom:42px}
  .contact-intro h1 {font-size:42px;margin-bottom:16px}
  .direct-contact {display:flex;flex-wrap:wrap;gap:5px 12px;margin-top:25px}
  .direct-contact dt {flex-basis:100%;margin-top:12px;font-size:11px}
  .direct-contact dd {margin:0;font-size:14px}
  .contact-location {margin-top:24px}
  .message-form {padding:24px}
  .contact-lead {max-width:450px}
}
@media (max-width:440px) {
  .message-form {padding:23px 18px}
  .contact-layout {gap:30px}
  .thanks-content {padding-top:65px;padding-bottom:65px}
  .thanks-content > .text-link {display:flex;margin:17px 0 0}
}
