/* Personal gamer theme: airy midnight palette, mint signals, and soft violet depth.
   Layout overrides preserve existing content and project interactions. */
:root{--bg:#0b1221;--panel:#111c2e;--line:#27344b;--text:#e1e8ff;--muted:#a2afc9;--accent:#83f2cf;--cyan:#b8adff;--max:1180px}body{background:radial-gradient(ellipse at 90% 9%,#44306b22,transparent 28%),var(--bg);font-family:'Trebuchet MS','Segoe UI',sans-serif}header{background:#0b1221e8;border-bottom-color:#27344b70}.nav{height:80px}.brand{font-weight:600;letter-spacing:-1px}.brand small{letter-spacing:1px}.nav-contact{border-color:#536979;border-radius:30px}nav a[aria-current]{color:var(--accent)}.hero{position:relative;min-height:720px;padding-block:90px 110px;gap:35px;grid-template-columns:1.15fr 1fr}.hero h1{font-size:clamp(48px,5.2vw,74px);font-weight:500;letter-spacing:-3px;line-height:1.15;margin-bottom:20px;white-space:nowrap}.hero h1 em{font-weight:600}.intro-cursor{font-size:.7em;color:#ad9bf5;animation:cursor-blink 1.4s step-end infinite}.hero-role{font-size:21px;color:#c7c4ef;line-height:1.5;margin-bottom:22px}.hero .intro{max-width:530px;font-size:17px;line-height:1.9}.intro strong{color:#d4e4ef;font-weight:500}.eyebrow{font-size:12px;letter-spacing:1.7px;font-weight:500}.hero .actions{gap:12px}.button{border-radius:9px;padding:13px 17px;font-family:inherit}.primary{background:#83f2cf;color:#0e2730}.primary:hover{background:#a2ffe2;box-shadow:0 8px 30px #83f2cf12}.secondary{border-color:#5f6880;color:var(--text)}.secondary:hover{background:#83f2cf0b;border-color:var(--accent)}.hero-note{border:0;gap:28px;font-size:10px;letter-spacing:1px;margin-top:35px;padding-top:0;color:#8c9cbd}.hero-note b{display:block;margin-top:8px;color:#bac8e1;font:14px 'Trebuchet MS',sans-serif;letter-spacing:0}.play-zone{position:relative;min-width:0;border:1px solid #48537066;border-radius:22px;background:radial-gradient(ellipse at 50% 38%,#394d6333,transparent 65%),#111b2b77;overflow:hidden;box-shadow:0 20px 100px #060b1922}.play-top{position:absolute;top:19px;left:22px;right:22px;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:12px;font:10px ui-monospace,monospace;letter-spacing:1px;color:#a7b6d1}.play-top button{border:0;border-bottom:1px solid #596982;padding:3px 0;background:none;color:#a7b6d1;font:11px 'Trebuchet MS',sans-serif}.play-zone canvas{display:block;width:100%;height:430px;outline-offset:-5px;border-radius:22px}.player-label{position:absolute;left:34px;top:155px;pointer-events:none;transition:opacity .25s}.player-label>span{font:10px ui-monospace,monospace;letter-spacing:1.5px;color:#a2bcbb}.player-label strong{display:block;font-size:58px;line-height:1.06;letter-spacing:-2.4px;font-weight:500;margin-top:14px;color:#edf0ff}.player-label strong span{color:var(--accent)}.play-bottom{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #35455b88;margin:0 22px;padding:19px 0}.mini-label{font:9px ui-monospace,monospace;letter-spacing:1px;color:#aeb9db}.play-bottom p{font-size:12px;margin:7px 0 0;color:var(--muted)}.play-bottom .button{font-size:12px;padding:10px 13px;gap:12px;white-space:nowrap}.scroll-cue{position:absolute;bottom:30px;left:0;right:0;display:flex;justify-content:center;gap:20px;color:var(--accent)}.scroll-cue span{font:10px/2 ui-monospace,monospace;letter-spacing:2px;color:#a5b1cd}.proof-strip{background:transparent;border-color:#27344b80}.proof-grid{padding-block:25px}.proof-grid p{border-color:#83f2cf44}.proof-grid strong{font-weight:500}.section{padding-block:90px}.section-heading{align-items:center}.section h2,.focus-section h2,.contact-section h2{font-size:40px;letter-spacing:-1.6px;font-weight:500}.section h2 em,.contact-section h2 em{color:#a99beb}.section-heading .eyebrow:before,.about-grid .eyebrow:before{content:'/ ';color:#ad9bf5}.filters button{border-radius:30px}.filters button[aria-pressed=true]{background:#83f2cf13;border-color:#83f2cf77;color:var(--accent)}.project-card{border-radius:17px;background:linear-gradient(150deg,#172238,#101b2b);box-shadow:0 12px 35px #0001}.project-card:hover{border-color:#83f2cf88;box-shadow:0 18px 45px #0002;transform:translateY(-6px)}.project-visual{height:335px;background:linear-gradient(135deg,#162939,#294553);padding:0 24px}.aydin-visual{background:linear-gradient(135deg,#30283e,#35504d)}.preview-window{border-radius:9px;box-shadow:0 10px 35px #0004}.visual-toolbar{color:#d2dbea}.project-body h3{font-size:27px;letter-spacing:-.6px}.project-meta{letter-spacing:.5px}.tags span{background:#27354a77;color:#bfcae3;border-radius:5px}.badge{background:#28344a66;color:#bdcbe4;border-color:#54607a66}.project-feature{border-color:#35425a}.project-actions button:hover{color:var(--accent)}.work-note{border:0;padding-top:32px}.experience-section{background:#101a2a;border-color:#27344b77}.experience-layout{grid-template-columns:.85fr 1.5fr;gap:80px}.job-title h3{font-weight:500;color:#d8ddfa}.job-tools{border-color:#ad9bf577}.responsibilities article{border-top-color:#33415988}.responsibilities article>span{color:#af9fe5}.responsibilities h3{font-weight:500}.about-copy strong{font-weight:500;color:var(--accent)}.education{border-color:#ad9bf5}.skill-card{border-radius:14px;background:#111c2b}.skill-icon{background:#283048;color:#b9a9fa;border-radius:10px}.skill-level{color:var(--accent)}.skill-level.learning{color:#c3b2fc}.skill-card h3{letter-spacing:-.5px}.focus-section{background:linear-gradient(115deg,#1c2340,#142b34);border-color:#3c4560}.focus-grid{grid-template-columns:1fr 1.3fr}.resume-actions .secondary{border-color:#46536e}.contact-section{background:radial-gradient(ellipse at 0 100%,#302d5033,transparent 70%),#101a2a;border-color:#27344b}.contact-links a{transition:transform .2s}.contact-links a:hover{transform:translateY(-3px)}input,textarea{background:#0d1726;border-color:#35465e;border-radius:8px}footer{padding-block:34px}footer>div{flex-wrap:wrap}dialog{background:#111e30;border-color:#51647c;border-radius:18px}dialog h2{color:var(--accent)}.reveal{opacity:1;transform:none}.motion-ready .reveal.pending-reveal{opacity:0;transform:translateY(23px)}.motion-ready .reveal{transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}#game-controls{border-top:1px solid #35455b;margin:0 22px;padding:15px 0 20px}#game-controls[hidden]{display:none}#game-instructions{font-size:12px;color:var(--muted);margin:0 0 13px}.game-stats{display:flex;align-items:center;gap:25px;font-size:14px}.game-stats strong{color:var(--accent);font:20px ui-monospace,monospace;margin-left:7px}.game-stats button{background:none;border:0;color:#c2b3ed;font-size:12px;margin-left:auto}.play-zone.playing .player-label{opacity:0}.play-zone.playing canvas{cursor:crosshair}.play-zone.playing .play-bottom{display:none}.play-zone.playing #motion-toggle{visibility:hidden}.motion-paused .intro-cursor{animation:none}@keyframes cursor-blink{50%{opacity:0}}@media(min-width:1500px){.hero{min-height:790px}}@media(max-width:1050px){.hero{gap:26px}.hero h1{font-size:56px;white-space:normal}.hero .intro{font-size:16px}.hero-note{gap:18px;display:flex}.play-zone canvas{height:410px}.player-label strong{font-size:52px}.play-bottom{align-items:start;flex-direction:column}.project-visual{height:285px}.preview-window{height:190px}.section h2,.focus-section h2,.contact-section h2{font-size:36px}.experience-layout{gap:45px}}@media(max-width:760px){header .nav{height:74px}.hero{grid-template-columns:1fr;padding-block:50px 85px;gap:30px;min-height:0}.hero h1{font-size:clamp(43px,9.4vw,66px);letter-spacing:-2px;white-space:normal}.hero .eyebrow{font-size:11px}.hero-role{font-size:18px}.hero .intro{font-size:16px;max-width:600px}.hero .actions{gap:12px}.hero-note{display:flex;flex-wrap:wrap;gap:24px;margin-top:27px}.hero-note b{font-size:13px}.play-zone{max-width:540px;width:100%;justify-self:center;border-radius:18px}.play-zone canvas{height:350px}.player-label{top:115px;left:30px}.player-label strong{font-size:54px}.play-bottom{flex-direction:row;align-items:center;gap:12px}.play-bottom p{max-width:150px}.play-bottom .button{font-size:11px;padding:9px 11px;gap:8px}.scroll-cue{bottom:23px}.proof-grid{gap:20px 15px}.section{padding-block:60px}.section-heading{margin-bottom:27px}.section h2,.focus-section h2,.contact-section h2{font-size:33px}.section-heading>p{max-width:440px}.project-visual{height:290px}.preview-window{height:200px}.experience-layout,.focus-grid{grid-template-columns:1fr;gap:30px}.job-title h3{font-size:27px}.contact-section{padding-block:60px}.game-stats{gap:16px}footer>div{gap:13px}nav a[aria-current]{border-left:2px solid var(--accent)}}@media(max-width:390px){.hero-note{gap:18px}.hero-note span{font-size:9px}.hero .button{font-size:12px;padding:12px}.project-visual{height:268px;padding-inline:18px}.preview-window{height:182px}.play-bottom{margin-inline:18px}.play-bottom p{font-size:11px;max-width:125px}.play-top{left:18px;right:18px;font-size:9px}.player-label strong{font-size:48px}.play-zone canvas{height:325px}}@media(prefers-reduced-motion:reduce){.intro-cursor{animation:none}.motion-ready .reveal.pending-reveal{opacity:1;transform:none}.project-card:hover,.primary:hover,.contact-links a:hover{transform:none}}@media print{dialog{background:white;color:black}dialog h2{color:black}}

/* Long email addresses remain within narrow contact columns. */
.contact-links>a{min-width:0;overflow-wrap:anywhere}footer>div{justify-content:flex-end}
@media(max-width:760px){footer>div{justify-content:flex-start}}

/* The original transparent photo stays untouched; CSS supplies the green treatment.
   A native button makes the color reveal available to keyboard and touch users. */
.portrait{position:absolute;inset:64px 28px 92px;width:calc(100% - 56px);height:338px;border:0;padding:0;background:none;color:var(--accent);cursor:pointer;isolation:isolate;text-align:left;perspective:900px}
.portrait-frame{position:absolute;inset:27px 20px 35px;border:1px solid #83f2cf66;border-radius:48% 48% 12px 12px;background:radial-gradient(ellipse at 50% 65%,#83f2cf25,transparent 72%);transform:rotate(-5deg);transition:transform .5s ease,border-color .5s ease}
.portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:grayscale(1) sepia(1) saturate(2.2) hue-rotate(100deg) brightness(.9);transform:translateY(0) scale(1);transform-origin:center bottom;transition:filter .5s ease,transform .5s ease;pointer-events:none}
.portrait-caption{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;gap:10px;background:#0b1221e8;border-top:1px solid #83f2cf55;padding:12px;font:11px/1.5 ui-monospace,monospace;letter-spacing:.6px}
.portrait-caption span{color:#a2afc9;font-size:10px}
.portrait[aria-pressed=true] img,.portrait:focus-visible img{filter:none;transform:translateY(-5px) scale(1.025)}
.portrait[aria-pressed=true] .portrait-frame,.portrait:focus-visible .portrait-frame{transform:rotate(2deg);border-color:#b8adff}
.portrait:focus-visible{outline:2px solid var(--accent);outline-offset:5px;border-radius:12px}
.play-zone.playing .portrait{display:none}
@media(hover:hover){.portrait:hover img{filter:none;transform:translateY(-5px) scale(1.025)}.portrait:hover .portrait-frame{transform:rotate(2deg);border-color:#b8adff}}
@media(max-width:1050px){.portrait{height:318px}}
@media(max-width:760px){.portrait{top:55px;height:286px;inset-inline:24px;width:calc(100% - 48px)}.portrait-caption{font-size:10px;padding:9px}.portrait-caption span{font-size:9px}}
@media(max-width:390px){.portrait{height:260px}.portrait-caption{gap:6px;letter-spacing:0}}
@media(prefers-reduced-motion:reduce){.portrait img,.portrait-frame{transition:none}.portrait:hover img,.portrait[aria-pressed=true] img,.portrait:focus-visible img{transform:none}}
.motion-paused .portrait img,.motion-paused .portrait-frame{transition:none}
.motion-paused .portrait:hover img,.motion-paused .portrait[aria-pressed=true] img,.motion-paused .portrait:focus-visible img{transform:none}

/* Editorial polish: let the portrait and playable projects carry the identity. */
body{background:var(--bg)}
.hero{min-height:660px;padding-block:65px 90px}
.hero-role{max-width:440px;font-size:21px;line-height:1.55;color:var(--text)}
.play-zone{background:#101b2b;box-shadow:none;border-color:#344257}
.project-card{background:#111c2b;box-shadow:none;border-radius:10px}
.project-card:hover{transform:translateY(-3px);box-shadow:none}
.project-visual{background:#1b303b}.aydin-visual{background:#293339}
.focus-section{background:#111c2b}.contact-section{background:#101a2a}
.section-heading .eyebrow:before,.about-grid .eyebrow:before{content:none}
.section h2 em,.contact-section h2 em{color:var(--text);font-style:normal}
.skill-card{background:transparent;border-radius:0;border-width:1px 0 0}
.skill-icon{display:none}
.section h2,.focus-section h2,.contact-section h2{line-height:1.2}
.hero-note{font-size:12px}.eyebrow{font-size:12px}
.play-top{font-size:12px;letter-spacing:.5px}.play-top button{font-size:12px}
.mini-label,.portrait-caption,.portrait-caption span{font-size:12px;letter-spacing:0}
.portrait-caption{flex-wrap:wrap}.play-bottom p{font-size:14px}
.motion-ready .reveal.pending-reveal{opacity:1;transform:none}
.motion-ready .reveal{transition:none}
@media(max-width:760px){.hero{min-height:0;padding-block:42px 80px}.hero-role{font-size:19px}.portrait-caption,.portrait-caption span{font-size:12px}.play-top{font-size:12px}.play-bottom{flex-wrap:wrap}.play-bottom p{max-width:none}.section h2,.focus-section h2,.contact-section h2{font-size:32px}}
@media(prefers-reduced-motion:reduce){.project-card:hover{transform:none}}

/* A narrow caret follows the last revealed character, including the final period. */
.typed-character{position:relative}
.typed-character.untyped{visibility:hidden}
.typing-caret::after{content:'';position:absolute;left:calc(100% + .045em);top:.12em;height:.88em;width:2px;background:var(--accent);animation:heading-caret 1s step-end infinite}
@keyframes heading-caret{50%{opacity:0}}
.motion-paused .typing-caret::after{animation:none}
@media(prefers-reduced-motion:reduce){.typing-caret::after{animation:none}}

/* My courses sit alongside my education, with completion status stated explicitly. */
.course-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.course-entry{border-top:1px solid var(--line);padding-top:24px;min-width:0}
.course-entry h3{font-size:24px;line-height:1.3;margin:12px 0}
.course-entry p,.course-entry li{font-size:16px;line-height:1.75;color:var(--muted)}
.course-entry .skill-level{color:var(--accent);font-size:12px}
.course-entry .learning{color:#c3b2fc}.course-provider{margin-top:0}
.course-entry ul{padding-left:20px}.course-links{display:flex;flex-wrap:wrap;gap:20px;margin-top:22px}
.course-links a{color:var(--accent);font-size:14px;text-decoration:underline;text-underline-offset:5px}
.course-entry .course-note{font-size:14px}.course-entry strong{color:var(--text)}
@media(max-width:760px){.course-grid{grid-template-columns:1fr;gap:30px}}