:root{--bg:#0f1010;--panel:#151616;--line:#303233;--text:#efefed;--sub:#a0a4a2;--orange:#e97145}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid var(--orange);outline-offset:4px}.skip-link{position:absolute;left:12px;top:-60px;background:#fff;color:#000;padding:10px;z-index:10}.skip-link:focus{top:12px}.site-shell{max-width:1600px;margin:auto}.site-header{height:85px;display:flex;align-items:center;gap:30px;padding:0 4.5%;border-bottom:1px solid var(--line)}.logo{font-size:18px;font-weight:700;letter-spacing:-.07em;white-space:nowrap}.logo-bars{font-size:21px;letter-spacing:-.25em;margin-right:9px}.logo-dot{color:var(--orange)}.site-header nav{display:flex;gap:32px;margin:auto}.site-header nav a{font-size:11px;color:#d0d1cd}.site-header nav a:hover,.inline-link:hover{color:var(--orange)}.header-index{font:10px 'DM Mono',monospace;color:#6f7470;letter-spacing:.08em}.hero,.section{padding-left:4.5%;padding-right:4.5%}.hero{padding-top:20px}.hero-label,.section-top,.work-meta,.image-number,.image-overlay-label,.graph-base,.matrix-prompt,.learn-path,.post-meta,.post-art>span,.writing-foot,.interlude>span,.contact>span,.contact-bottom>a,footer,.hero-photo>span,.hero-name-foot,.hero-disciplines,.hero-stamp{font-family:'DM Mono',monospace}.hero-label,.section-top{display:flex;justify-content:space-between;color:#949995;font-size:10px;letter-spacing:.07em;padding:12px 0 18px}.hero-main{display:grid;grid-template-columns:25% 75%;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.hero-photo{height:310px;position:relative;overflow:hidden;border-right:1px solid var(--line)}.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:54% 33%;filter:grayscale(1) contrast(1.04)}.hero-photo:after,.about-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 65%,#0009)}.hero-photo>span{position:absolute;z-index:1;bottom:12px;left:14px;font-size:9px;background:#101010cb;padding:5px}.hero-name{padding:44px 4% 20px;display:flex;flex-direction:column;justify-content:space-between;background:repeating-linear-gradient(0deg,transparent 0 61px,#ffffff13 62px 63px)}.hero-name p{font-size:12px;color:#a5aaa5;margin:0 0 10px}.hero-name h1{font-size:clamp(58px,7.9vw,127px);font-weight:400;line-height:.86;letter-spacing:-.09em;margin:0;white-space:nowrap}.hero-name h1 span{color:var(--orange)}.hero-name-foot{display:flex;gap:20px;flex-wrap:wrap;color:#8f9590;font-size:9px;letter-spacing:.08em}.hero-name-foot span+span:before{content:' / ';color:#5b625c}.hero-rules{padding:15px 0;display:grid;gap:13px}.hero-rules i{border-top:1px solid var(--line)}.hero-bottom{display:grid;grid-template-columns:27% 1fr auto;gap:25px;align-items:end;border-top:1px solid var(--line);padding:20px 0 36px}.hero-disciplines{font-size:13px;line-height:1.3;color:#c9ccc8}.hero-bottom p{max-width:460px;font-size:12px;line-height:1.55;color:#a5aaa6;margin:0}.hero-stamp{font-size:23px;line-height:.94;letter-spacing:-.07em;text-align:right;white-space:nowrap}.hero-stamp span{color:var(--orange)}.section{padding-top:100px;padding-bottom:115px}.section-top{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin:45px 0 45px}.section-heading h2,.about h2{font-size:clamp(43px,5vw,78px);font-weight:500;letter-spacing:-.075em;line-height:1;max-width:820px;margin:0}.thin{font-weight:400;color:#a6aaa6}.section-heading>p{font-size:12px;line-height:1.5;color:#929994;max-width:310px;margin:0 0 5px}.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.work-card{position:relative;min-width:0}.work-link{position:absolute;inset:0;z-index:3}.work-link:focus-visible{outline-offset:2px}.work-image{height:360px;position:relative;overflow:hidden;background:#202220}.work-image>img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}.work-card:hover .work-image>img{transform:scale(1.035)}.hunt .work-image>img{object-position:50% 43%}.dungeon .work-image>img{object-position:63% center}.image-number{position:absolute;top:17px;left:18px;color:#fff;z-index:1;background:#0a0b0ba8;padding:6px 8px;font-size:10px}.image-overlay-label{position:absolute;bottom:18px;left:20px;color:#dfc898;letter-spacing:.17em;font-size:12px}.work-info{border-top:1px solid #565a54;padding:17px 0 27px}.work-meta{display:flex;justify-content:space-between;gap:12px;color:#8f9690;font-size:9px;letter-spacing:.07em}.work-meta span:last-child{color:#d5a584}.work-info h3{font-size:clamp(29px,3vw,44px);font-weight:500;letter-spacing:-.065em;line-height:1;margin:26px 0 11px;display:flex;justify-content:space-between}.work-info h3 span{font-size:23px;color:#9da49d}.work-info p{font-size:12px;color:#9ca29d;max-width:500px;line-height:1.55;margin:0}.graph-image{background:radial-gradient(circle at 75% 25%,#5b704d 0,#28372a 37%,#161d18 78%);padding:20px}.graph-head{font-size:clamp(46px,5.8vw,86px);line-height:.85;font-weight:600;letter-spacing:-.08em;position:absolute;left:6%;top:20%;color:#d7f2cd}.graph-head span{color:#98cb88}.graph-axis{position:absolute;bottom:0;left:55%;right:0;height:64%;display:flex;align-items:end;gap:7px;opacity:.76}.graph-axis i{width:10%;background:#9dd28e;border:1px solid #d1f3c0}.graph-base{position:absolute;left:6%;bottom:14px;font-size:9px;color:#b8d5b1}.matrix-image{background:#07140d;display:flex;align-items:center;justify-content:center}.matrix-rain{position:absolute;inset:-40px 0;color:#45bb69;font:26px/1.18 'DM Mono',monospace;letter-spacing:12px;opacity:.22;writing-mode:vertical-rl;transform:rotate(180deg);overflow:hidden}.matrix-image>img{width:min(85%,520px);height:auto;object-fit:contain;position:relative;z-index:1;filter:drop-shadow(0 0 22px #4fe18a70)}.matrix-prompt{position:absolute;left:20px;bottom:17px;color:#a6e4b2;font-size:10px;z-index:2}.learn-image{background:#d7d6cb;color:#172219}.learn-path{position:absolute;top:25%;left:7%;right:7%;display:flex;justify-content:space-between;border-top:2px dotted #546754;font-size:10px}.learn-path>div{display:flex;flex-direction:column;gap:55px;margin-top:-10px;align-items:center}.learn-path b{display:grid;place-items:center;border:1px solid #304631;border-radius:50%;width:20px;height:20px;background:#d7d6cb;font-weight:400}.learn-title{position:absolute;bottom:13%;left:7%;font-weight:600;font-size:clamp(55px,7vw,100px);letter-spacing:-.11em}.learn-title span{color:#6e8c68}.interlude{background:#dddcd4;color:#101210;padding:45px 4.5% 60px;display:grid;grid-template-columns:1fr 3fr auto;gap:30px;align-items:start}.interlude>span{font-size:10px;letter-spacing:.07em}.interlude p{font-size:clamp(29px,3.5vw,54px);font-weight:500;letter-spacing:-.065em;line-height:1.05;margin:0}.interlude p em{font-style:normal;color:#79877a}.interlude-mark{font-size:45px!important}.writing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.post{min-width:0}.post-art{height:245px;position:relative;overflow:hidden}.post-art>span{position:absolute;left:15px;bottom:14px;font-size:10px;letter-spacing:.08em;color:#fff}.post-art-one{background:linear-gradient(130deg,#f38659,#e6494e 55%,#8f2e64)}.art-blur{position:absolute;width:70%;aspect-ratio:1;left:22%;top:-20%;border-radius:50%;background:linear-gradient(110deg,#ffebbe,#e57556);filter:blur(12px);box-shadow:-120px 110px 0 #e7b292}.post-art-two{background:#dcddd8}.art-sphere{width:240px;height:240px;border-radius:50%;position:absolute;left:28%;top:-10%;background:radial-gradient(circle at 28% 23%,#e9e2db,#bcc1c8 36%,#78529d 58%,#2b2d64 78%);box-shadow:20px 26px 60px #5b466e80}.post-art-two>span{color:#27292d}.post-art-three{background:#aba6a0}.art-lines{position:absolute;inset:0;background:repeating-radial-gradient(ellipse at 60% 40%,transparent 0 13px,#f2e9e2 15px 16px,transparent 18px 30px);transform:rotate(-18deg) scale(1.3);opacity:.8}.post-art-three>span{color:#1b1d1d}.post-meta{font-size:9px;letter-spacing:.1em;color:#a6aaa6;margin-top:20px}.post-meta span{color:var(--orange);padding:0 4px}.post h3{font-size:clamp(23px,2.4vw,35px);font-weight:500;letter-spacing:-.055em;line-height:1.12;margin:13px 0 11px}.post p{font-size:12px;color:#9da29e;line-height:1.55;margin:0;max-width:390px}.writing-foot{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:17px;margin-top:45px;color:#7d837f;font-size:9px;letter-spacing:.07em}.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:9%;padding-top:55px}.about h2{margin:0 0 40px}.about-copy{padding-top:10px}.about-copy p{color:#adb3ad;line-height:1.7;font-size:16px;max-width:600px}.inline-link{display:inline-flex;gap:60px;border-bottom:1px solid #888e87;padding:14px 0;margin-top:30px;font:11px 'DM Mono',monospace;letter-spacing:.08em}.about-photo{height:510px;position:relative;overflow:hidden;max-width:530px}.about-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;filter:grayscale(1)}.about-photo>span{position:absolute;z-index:1;bottom:16px;left:16px;font:10px 'DM Mono';color:#fff;letter-spacing:.08em}.contact{background:#e56f49;color:#101211;margin:0 4.5% 35px;padding:50px 5% 35px}.contact>span{font-size:10px}.contact h2{font-size:clamp(45px,6.6vw,100px);font-weight:500;letter-spacing:-.08em;line-height:.99;margin:55px 0 70px}.contact h2 em{font-style:normal;color:#f9c7ad}.contact-bottom{display:flex;justify-content:space-between;align-items:end;gap:30px}.contact-bottom p{font-size:12px;line-height:1.55;max-width:500px;margin:0}.contact-bottom>a{border:1px solid #222;padding:15px 18px;font-size:10px;white-space:nowrap}.contact-bottom>a:hover{background:#181a18;color:#fff}footer{border-top:1px solid var(--line);padding:26px 4.5%;display:flex;justify-content:space-between;gap:15px;font-size:10px;color:#8f9590}footer span:first-child{font:700 14px Inter;color:#fff}footer a:hover{color:var(--orange)}@media(max-width:1000px){.header-index{display:none}.site-header nav{margin-left:auto;margin-right:0}.hero-main{grid-template-columns:30% 70%}.hero-name h1{font-size:clamp(54px,8vw,80px)}.hero-bottom{grid-template-columns:30% 1fr}.hero-stamp{display:none}.work-image{height:280px}.writing-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.about-grid{gap:5%}}@media(max-width:700px){.site-header{height:66px;padding:0 5%}.site-header nav{gap:13px}.site-header nav a{font-size:10px}.logo{font-size:14px}.logo-bars{font-size:15px}.hero,.section{padding-left:5%;padding-right:5%}.hero-main{grid-template-columns:1fr}.hero-photo{height:260px;width:230px;border-right:0;border-bottom:1px solid var(--line)}.hero-name{padding:28px 0 16px;min-height:300px}.hero-name h1{font-size:clamp(52px,13vw,80px)}.hero-name-foot{font-size:8px}.hero-bottom{grid-template-columns:1fr;gap:22px}.hero-disciplines{font-size:12px}.section{padding-top:65px;padding-bottom:80px}.section-top{font-size:8px}.section-top span:last-child{display:none}.section-heading{display:block;margin:30px 0}.section-heading h2,.about h2{font-size:48px}.section-heading>p{margin-top:22px}.work-grid{grid-template-columns:1fr;gap:12px}.work-image{height:270px}.work-info{padding-bottom:32px}.work-info h3{font-size:34px}.interlude{display:block;padding:37px 5%}.interlude p{font-size:38px;margin:33px 0}.writing-grid{grid-template-columns:1fr;gap:40px}.post-art{height:230px}.post h3{font-size:29px}.writing-foot{display:block;line-height:1.8}.writing-foot span{display:block}.about-grid{grid-template-columns:1fr;gap:50px}.about h2{margin-bottom:25px}.about-copy p{font-size:15px}.about-photo{height:400px}.contact{margin:0 5% 20px;padding:35px 6%}.contact h2{font-size:49px;margin:40px 0}.contact-bottom{display:block}.contact-bottom>a{display:inline-block;margin-top:30px}footer{padding:25px 5%;flex-wrap:wrap}footer span:nth-child(2){order:3;width:100%}}@media(max-width:390px){.site-header nav{gap:10px}.site-header nav a{font-size:9px}.logo{font-size:13px}.hero-name h1{font-size:50px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important}}

/* Asset and name refinements requested for the second mock. */
.hero-name h1 .jr { color: var(--text); font-size: .72em; letter-spacing: -.07em; white-space: nowrap; }
.hero-name h1 .jr-dot { color: var(--orange); }
.hunt-image { background: #09090d; }
.hunt-image>img { object-position: center; }
.hunt-image-caption { position: absolute; bottom: 18px; left: 20px; color: #c9b1cd; font: 10px 'DM Mono', monospace; letter-spacing: .08em; }
.dungeon .work-image>img { object-position: center; }
.matrix-image>img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: none; }

/* Personal interests and reading shelf. */
.hobbies { padding-bottom: 60px; }
.hobby-grid { display: grid; grid-template-columns: 1fr; gap: 22px; }
.hobby-card { min-width: 0; border: 1px solid var(--line); background: #161718; }
.hobby-top, .reading-column-head { display: flex; justify-content: space-between; gap: 12px; font: 10px 'DM Mono', monospace; letter-spacing: .08em; color: #aab1ab; }
.hobby-top { padding: 19px 20px; border-bottom: 1px solid #ffffff29; }
.game-art { height: 255px; position: relative; overflow: hidden; }
.game-art { background: radial-gradient(circle at 70% 32%, #41516b 0, #1c293b 32%, #12171e 75%); display: flex; align-items: center; justify-content: center; gap: 16px; }
.game-art span { color: #bdc8df; font-size: clamp(55px, 7vw, 108px); font-weight: 700; line-height: .8; letter-spacing: -.1em; text-shadow: 9px 11px 0 #070b12; }
.game-art span:nth-child(2) { color: #ec8b68; align-self: flex-end; margin-bottom: 52px; }
.game-art i { position: absolute; top: 26px; right: 30px; color: #e3a482; font-size: 28px; font-style: normal; }
.hobby-copy { padding: 25px 28px 30px; min-height: 223px; }
.hobby-copy h3 { font-size: clamp(27px, 3vw, 42px); font-weight: 500; letter-spacing: -.065em; margin: 0 0 14px; }
.hobby-copy p { max-width: 470px; color: #a9afa9; font-size: 13px; line-height: 1.6; margin: 0; }
.hobby-copy a { display: inline-flex; justify-content: space-between; gap: 35px; margin-top: 25px; padding-bottom: 8px; border-bottom: 1px solid #a1a8a0; font: 10px 'DM Mono', monospace; letter-spacing: .07em; }
.hobby-copy a:hover { color: var(--orange); border-color: var(--orange); }
.music-intro { display: grid; grid-template-columns: 1fr 1.15fr; gap: 55px; align-items: end; padding: 44px 3.5% 40px; }
.music-intro h3 { font-size: clamp(54px, 7vw, 108px); font-weight: 500; letter-spacing: -.09em; line-height: .9; margin: 0; }
.music-intro h3 span { color: #aeb3ab; }
.music-intro p { max-width: 550px; color: #c1c4bd; font-size: clamp(14px, 1.3vw, 17px); line-height: 1.6; margin: 0; }
.music-intro a { display: inline-flex; gap: 28px; margin-top: 25px; padding-bottom: 8px; border-bottom: 1px solid #a1a8a0; font: 10px 'DM Mono', monospace; letter-spacing: .07em; }
.music-intro a:hover { color: var(--orange); border-color: var(--orange); }
.music-timeline { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0 3.5% 35px; }
.music-timeline li { min-width: 0; }
.music-timeline figure { margin: 0; }
.music-photo { aspect-ratio: 1.45; overflow: hidden; background: #222; }
.music-photo img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); }
.music-timeline li:first-child img { object-position: center 48%; }
.music-timeline li:nth-child(2) img { object-position: center 43%; }
.music-timeline li:nth-child(3) img { object-position: center 28%; }
.music-timeline figcaption { border-top: 1px solid #646863; padding: 15px 0 4px; }
.music-timeline figcaption span { display: block; color: #c4927c; font: 9px 'DM Mono', monospace; letter-spacing: .08em; margin-bottom: 11px; }
.music-timeline figcaption strong { display: block; font-size: clamp(21px, 2.3vw, 34px); font-weight: 500; letter-spacing: -.065em; }
.music-timeline figcaption p { color: #a9afa9; font-size: 12px; line-height: 1.5; margin: 7px 0 0; }
.gaming-card { display: grid; grid-template-columns: .8fr 1.2fr; }
.gaming-card .hobby-top { grid-column: 1 / -1; }
.gaming-card .game-art { height: 100%; min-height: 260px; }
.gaming-card .hobby-copy { min-height: 0; padding: 30px 6%; }
.game-list { list-style: none; padding: 0; margin: 22px 0 0; }
.game-list li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid #ffffff26; color: #dededb; font: 10px 'DM Mono', monospace; letter-spacing: .04em; }
.game-list li span { color: #a7afbe; }
.reading { padding-top: 70px; }
.reading-grid { display: grid; grid-template-columns: 1.25fr 1fr 1.1fr; gap: 22px; }
.reading-column { min-width: 0; border-top: 1px solid #777d76; }
.reading-column-head { padding: 16px 0 20px; }
.reading-column ol { list-style: none; padding: 0; margin: 0; }
.reading-column li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 5px 10px; padding: 18px 0; border-top: 1px solid var(--line); }
.book-index, .book-note { font: 10px 'DM Mono', monospace; color: #9ba19a; letter-spacing: .06em; }
.book-title { font-size: clamp(18px, 2vw, 28px); letter-spacing: -.055em; line-height: 1.1; }
.book-note { grid-column: 2; font-size: 9px; color: #d19a82; }
.featured-book { min-height: 264px; display: grid; grid-template-columns: 70px 1fr; gap: 22px; padding: 23px 19px; border: 1px solid #95735f; background: linear-gradient(135deg, #4a3027, #241d1b 72%); }
.book-spine { writing-mode: vertical-rl; transform: rotate(180deg); background: #ce8061; color: #291b17; padding: 13px 9px; font: 10px 'DM Mono', monospace; letter-spacing: .1em; }
.featured-book h3 { max-width: 210px; font-size: clamp(29px, 2.7vw, 43px); font-weight: 500; letter-spacing: -.07em; line-height: 1; margin: 48px 0 14px; }
.featured-book p { color: #c5afa3; font-size: 12px; line-height: 1.5; margin: 0; }
@media (max-width: 1000px) { .game-art span { font-size: 70px; } .reading-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .hobbies { padding-bottom: 30px; } .hobby-grid, .reading-grid { grid-template-columns: 1fr; gap: 18px; } .hobby-top { padding: 16px; font-size: 9px; } .music-intro { display: block; padding: 30px 20px; } .music-intro h3 { font-size: clamp(52px, 13vw, 75px); margin-bottom: 25px; } .music-timeline { grid-template-columns: 1fr; padding: 0 20px 25px; gap: 24px; } .music-photo { aspect-ratio: 1.4; } .music-timeline li:nth-child(3) .music-photo { aspect-ratio: 1.2; } .gaming-card { display: block; } .gaming-card .game-art { height: 220px; min-height: 0; } .game-art span { font-size: clamp(58px, 15vw, 78px); } .game-art span:nth-child(2) { margin-bottom: 43px; } .hobby-copy, .gaming-card .hobby-copy { padding: 22px 20px 26px; min-height: 0; } .reading { padding-top: 55px; } .reading-column-head { font-size: 9px; } .featured-book { min-height: 230px; } }
@media (max-width: 390px) { .game-art span { font-size: 56px; } }

/* Reveal the original colors only when a pointer hovers over the visual. */
.work-image { filter: grayscale(1); transition: filter .35s ease; }
.hero-photo img, .about-photo img, .music-photo img { filter: grayscale(1); transition: filter .35s ease; }
.work-card:focus-within .work-image { filter: none; }
@media (hover: hover) and (pointer: fine) {
  .work-card:hover .work-image,
  .hero-photo:hover img,
  .about-photo:hover img,
  .music-photo:hover img { filter: none; }
}

/* Education and personal gaming history. */
.education-note { display:flex; align-items:center; gap:24px; padding:20px 0; border-bottom:1px solid var(--line); }
.education-note span { font:10px 'DM Mono',monospace; color:var(--sub); letter-spacing:.06em; }
.education-note p { margin:0; font-size:18px; letter-spacing:-.04em; }
.education-note span:last-child { margin-left:auto; white-space:nowrap; }
.gaming-card .jinx-photo { background:#101114; min-height:400px; }
.jinx-photo img { display:block; height:400px; width:100%; object-fit:contain; filter:grayscale(1); transition:filter .35s ease; }
.game-list li { align-items:center; padding:17px 0; }
.game-list strong { font-weight:400; }
.game-list small { display:block; margin-top:8px; color:#9da49e; font-size:10px; }
.game-list li>span { text-align:right; line-height:1.6; }
@media (hover:hover) and (pointer:fine) { .gaming-card:hover .jinx-photo img { filter:none; } }
@media(max-width:700px) { .education-note { flex-wrap:wrap; gap:9px 20px; } .education-note>span:first-child { width:100%; } .education-note p { font-size:16px; } .gaming-card .jinx-photo { height:360px; min-height:0; } .jinx-photo img { height:360px; } }

.hero-bottom { grid-template-columns:27% 1fr; }
.note-art { margin:0; height:300px; position:relative; overflow:hidden; background:#171717; }
.note-art img { width:100%; height:100%; object-fit:cover; object-position:center 35%; filter:grayscale(1); transition:filter .35s ease; }
.note-art figcaption { position:absolute; bottom:0; left:0; right:0; padding:48px 16px 16px; background:linear-gradient(transparent,#000e); color:#fff; }
.note-art figcaption strong { display:block; font-size:14px; line-height:1.3; font-weight:500; }
.note-art figcaption span { display:block; margin-top:5px; font:10px 'DM Mono',monospace; color:#ddd; }
.art-picker { display:block; font:9px 'DM Mono',monospace; color:#a9ada9; margin-top:12px; }
.art-picker select { display:block; width:100%; min-width:0; margin-top:7px; padding:9px; color:#ddd; background:#171818; border:1px solid #454745; font:11px Inter,sans-serif; }
.art-picker select:focus-visible { outline:2px solid var(--orange); outline-offset:2px; }
.note-art:focus-within img { filter:none; }
@media(hover:hover) and (pointer:fine) { .note-art:hover img { filter:none; } }
@media(max-width:700px) { .hero-bottom { grid-template-columns:1fr; } .note-art { height:320px; } }

.sort-image { background:#262221; color:#ecd7bc; padding:30px; }
.sort-title { position:absolute; top:23%; left:7%; font-size:clamp(52px,6vw,88px); font-weight:600; letter-spacing:-.08em; line-height:.87; }
.sort-process { position:absolute; bottom:25px; left:7%; right:7%; display:flex; justify-content:space-between; border-top:1px solid #85766a; padding-top:16px; font:10px 'DM Mono',monospace; }
.sort-process span { color:#e97145; }

/* Explore links beneath the name and a clear return at the end. */
.hero-name-foot { gap:8px 18px; align-items:center; }
.hero-name-foot a { display:inline-flex; align-items:center; min-height:32px; line-height:1.5; border-bottom:1px solid transparent; }
.hero-name-foot a+a::before { content:'/'; color:#5b625c; margin-right:14px; }
.hero-name-foot a:hover { color:var(--text); border-bottom-color:var(--orange); }
.hero-name-foot a:focus-visible { color:var(--text); }
.back-top-button { display:inline-flex; align-items:center; justify-content:center; min-width:100px; min-height:44px; padding:12px 20px; border:1px solid #747a73; color:var(--text); }
.back-top-button:hover { background:var(--text); color:var(--bg); }
#music, #gaming, #reading, #about, #writing, #work { scroll-margin-top:24px; }
@media(max-width:700px) { .hero-name-foot { gap:4px 12px; margin-top:20px; } .hero-name-foot a { min-height:44px; } .hero-name-foot a+a::before { margin-right:10px; } }

/* A personal photograph for the book currently open. */
.featured-book { display:block; padding:0; background:#181919; border-color:#505550; overflow:hidden; }
.book-photo { height:260px; overflow:hidden; background:#222; }
.book-photo img { width:100%; height:100%; display:block; object-fit:cover; object-position:50% 65%; filter:grayscale(1) contrast(1.04); transition:filter .35s ease; }
.featured-book-copy { padding:20px; }
.featured-book h3 { margin:15px 0 12px; max-width:none; }
.featured-book p { color:#adb3ad; }
@media(hover:hover) and (pointer:fine) { .featured-book:hover .book-photo img { filter:none; } }
@media(max-width:700px) { .book-photo { height:300px; } }

/* Personal contact card. */
.contact-card h2 { margin:40px 0 50px; }
.contact-details { display:grid; grid-template-columns:.8fr 1.2fr; gap:60px; }
.contact-identity h3 { font-size:28px; font-weight:500; letter-spacing:-.06em; margin:0 0 10px; }
.contact-identity p { font-size:13px; line-height:1.5; margin:0; }
.resume-link { display:flex; justify-content:space-between; gap:25px; align-items:center; padding:18px; margin-top:30px; border:1px solid #232723; font:11px 'DM Mono',monospace; }
.resume-link:hover { background:#161816; color:#fff; }
.resume-download { display:inline-block; font-size:11px; margin-top:14px; text-decoration:underline; text-underline-offset:4px; }
.contact-links { list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 26px; padding:0; margin:0; }
.contact-email { grid-column:1/-1; }
.contact-links a { display:grid; grid-template-columns:1fr auto; gap:9px 10px; border-top:1px solid #21272166; padding:18px 0; min-height:85px; }
.contact-links a>span { font:9px 'DM Mono',monospace; letter-spacing:.08em; }
.contact-links strong { grid-row:2; font-size:clamp(16px,1.8vw,24px); font-weight:500; letter-spacing:-.04em; overflow-wrap:anywhere; }
.contact-links i { grid-column:2; grid-row:1/3; align-self:center; font-size:22px; font-style:normal; }
.contact-links a:hover strong { text-decoration:underline; text-underline-offset:5px; }
.contact-card a:focus-visible { outline-color:#151715; }
@media(max-width:700px) { .contact-details { grid-template-columns:1fr; gap:35px; } .contact-card h2 { font-size:55px; margin:30px 0; } .contact-links { gap:0 18px; } .contact-links strong { font-size:16px; } .contact-links i { font-size:17px; } }