/* v5: same ink, red signal, VCR type and pixel language; quieter proportions. */
[hidden]{display:none!important} :focus-visible{outline:2px solid var(--signal);outline-offset:4px} :target{scroll-margin-top:112px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:20px;top:-90px;z-index:250;background:var(--paper);color:var(--void);padding:14px}.skip-link:focus{top:12px}
.muted,.privacy-note{color:var(--muted);line-height:1.6}.empty-state{padding:24px;color:var(--muted);border:1px dashed var(--line)}
.page{max-width:1400px;padding-top:108px}.compact-intro{padding-bottom:35px}.page-title{font-size:clamp(42px,6vw,82px)}.page-lead{max-width:760px;font-size:17px;line-height:1.65}.page-code{flex-wrap:wrap;gap:12px}.page-code i{font-size:10px}.route-next{margin-block:65px;font-size:inherit}.site-footer{padding-bottom:116px;gap:18px;flex-wrap:wrap}.site-footer a{white-space:nowrap}.home-hero{min-height:calc(100svh - 165px)}
.site-header{top:14px;left:50%;transform:translateX(-50%);width:min(1280px,calc(100% - 36px));height:66px;border:1px solid var(--line);border-radius:14px;grid-template-columns:auto 1fr auto;gap:14px;padding:0 18px;background:rgba(6,13,20,.92);box-shadow:0 8px 32px #0003;backdrop-filter:blur(18px)}
.brand{gap:8px}.brand img{height:32px!important;width:32px;image-rendering:pixelated}.brand span{font-size:9px}.desktop-nav{align-items:center;gap:2px}.desktop-nav a{min-width:0;gap:7px;padding:11px 10px;font:11px VCR;border-radius:7px}.desktop-nav a>svg{width:17px;height:17px}.desktop-nav a::after{display:none}.desktop-nav a:hover>svg,.desktop-nav a.active>svg{transform:none;filter:none}.nav-label{white-space:nowrap}.desktop-nav a.active{background:#8fd6ff16;color:var(--signal)}.header-actions{align-items:center;gap:5px}.header-actions button{border-radius:7px;min-height:38px;height:38px;min-width:36px;padding:7px 10px}.header-actions #commandTrigger{display:flex;gap:8px;align-items:center}.header-actions #commandTrigger>span{font-size:23px}.header-actions kbd{font:10px VCR;color:var(--muted)}.auth-trigger{color:var(--signal)}
.menu-overlay{padding-top:120px;overflow:auto}.menu-index{top:97px}.menu-overlay nav a{min-height:62px}
#backgroundMedia{position:absolute;inset:0}#backgroundMedia>img,#backgroundMedia>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:none;filter:none;will-change:auto;opacity:1}.cosmic-grain{animation:none;opacity:.04}.cosmic-dots{animation:none;opacity:.12}.cosmic-background{background:radial-gradient(ellipse at 70% 25%,#112335,#030507 65%)}
.collection-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin-bottom:24px}.search-field{min-width:200px;display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--line);background:var(--panel)}.search-field>span{font-size:21px;color:var(--signal)}.search-field input{width:180px;max-width:100%;border:0;outline:0;background:transparent;font-size:14px}.filter-chips{display:flex;gap:6px;flex-wrap:wrap}.filter-chips button,.text-button{min-height:38px;border:1px solid var(--line);background:var(--panel);color:var(--muted);padding:9px 12px;font-size:12px;text-decoration:none}.filter-chips button.active,.filter-chips button:hover{border-color:var(--signal);color:var(--signal)}#projectCount{font:11px VCR;color:var(--muted);margin-left:auto}.collection-total{font:32px VCR;color:var(--signal)}.collection-total small{font-size:10px;color:var(--muted)}
.project-stack{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.project-card{display:flex;flex-direction:column;min-width:0;transform:none!important;box-shadow:none;transition:border-color .2s,background .2s}.project-card:hover{border-color:#8fd6ff70}.project-card-header{width:100%;height:37px;min-height:37px;font-size:10px;padding:0 14px;grid-template-columns:32px 1fr auto}.project-visual{position:relative;aspect-ratio:16/10;overflow:hidden;border-bottom:1px solid var(--line)}.project-card .project-preview{position:absolute;inset:0;min-height:0;height:100%;width:100%;border:0;overflow:hidden}.project-copy{padding:22px;min-height:0;display:flex;flex:1;flex-direction:column;gap:0}.project-copy>small{font-size:10px;line-height:1.4;color:var(--signal)}.project-copy h2{font-size:29px;line-height:1.06;margin:12px 0;letter-spacing:-.035em}.project-copy>p{font-size:14px;line-height:1.65;margin:0 0 18px;color:var(--muted)}.tech-list{gap:5px;margin-top:auto}.tech-chip{padding:5px 7px;font-size:10px;gap:5px}.tech-chip i{font-size:9px}.tech-chip b{font-size:10px}.project-actions{display:flex;flex-wrap:wrap;flex-direction:row;gap:8px;margin-top:18px}.project-button{flex:1;min-width:0;min-height:38px;width:auto;padding:9px 10px;font:10px VCR;gap:7px;justify-content:center}.project-button svg{width:15px;height:15px}.project-button.disabled{font-size:9px}.preview-hud{inset:auto 12px 12px;gap:7px;font-size:8px}.preview-hud span,.preview-hud b{font-size:8px}.pixel-dialog{left:12px;bottom:34px;font:9px VCR;padding:8px}.scene-layers{inset:-6%}.scene-layers img{width:112%;height:112%;inset:-6%;object-fit:cover;transform:translate3d(calc((var(--mx,.5) - .5) * var(--layer) * -4px),calc((var(--my,.5) - .5) * var(--layer) * -2px),0) scale(1.025);transition:transform .35s ease-out}.vault-window{width:100%;min-height:0;height:100%;grid-template-columns:58px 1fr;font-size:10px}.vault-window header{height:30px;padding:7px;font-size:8px}.vault-window header span{font-size:6px}.vault-window aside{gap:10px;padding:12px 7px}.vault-window aside span{font-size:7px}.vault-window .vault-content{padding:15px 10px}.vault-window .vault-content strong{font-size:14px}.vault-window li{padding:7px;gap:6px;grid-template-columns:22px 1fr}.vault-window li>i{display:none}.vault-window li>b{font-size:10px}
.reaction-row{display:flex;align-items:center;gap:7px;border-top:1px solid var(--line);margin-top:18px;padding-top:13px}.reaction-row button{border:1px solid var(--line);padding:6px 8px;background:transparent;min-height:32px;display:flex;align-items:center;gap:7px;font:12px VCR}.reaction-row button[aria-pressed=true]{background:#ff3b2f18;border-color:var(--red);color:var(--red)}.reaction-row small{font-size:10px;line-height:1.3;color:var(--muted);margin-left:auto;max-width:80px}.reaction-row b{font-size:10px;font-weight:400}
.certificate-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.certificate-tile{border:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;min-width:0}.certificate-tile:hover{border-color:var(--line-strong)}.certificate-card{display:flex;flex-direction:column;min-height:0;border:0;flex:1;background:transparent;transform:none!important}.cert-art{width:100%;aspect-ratio:1.6;min-height:0;background:#e8eaec}.cert-art img{padding:12px}.cert-copy{padding:20px;gap:10px;flex:1}.cert-copy small{font:9px/1.5 VCR}.cert-copy h2{font-size:21px;line-height:1.25;margin:0;letter-spacing:-.025em}.cert-copy p{font-size:13px;line-height:1.5}.cert-copy>span{margin-top:auto;padding-top:10px;font:10px VCR}.validation-link{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding:13px 20px;color:var(--signal);font-size:12px;text-decoration:none}.validation-link small{font:8px VCR;color:#e8c886}.modal-dialog .validation-link{border:1px solid var(--line);margin-bottom:12px}.modal-dialog h2{font-size:clamp(26px,4vw,44px);line-height:1.12}.dialog-data b{overflow-wrap:anywhere}.certificate-pdf{height:min(62svh,650px)}
.gallery-toolbar{top:95px;flex-wrap:wrap;gap:3px}.gallery-toolbar button{font-size:10px;padding:7px 12px;min-height:38px}.gallery-grid .gallery-item h2{font-size:23px;line-height:1.1}.gallery-next-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 20px;border-block:1px solid var(--line)}.gallery-next-bar button{min-height:40px;padding:9px 12px;background:var(--void);border:1px solid var(--line);font-size:12px}.gallery-next-bar>span{font:11px VCR;color:var(--muted)}.gallery-dialog figcaption h2{font-size:30px}.gallery-original-image{min-height:150px}.gallery-original-image img{max-height:65svh}.gallery-dialog figure{min-width:0}.media-fallback{object-fit:cover!important}
.telemetry-grid .telemetry-card{grid-column:span 4;min-height:0;padding:22px;min-width:0;position:relative}.telemetry-grid #wakaCard,.telemetry-grid #githubCard{grid-column:span 6}.telemetry-card>header{font-size:9px;gap:6px;grid-template-columns:20px 1fr auto}.telemetry-card>header b{font-weight:400}.telemetry-card>header i{font-size:8px}.integration-loading{height:235px}.integration-loading p{font-size:9px}.integration-content{padding-top:22px}.integration-empty{min-height:230px}.integration-empty h2{font-size:22px}.integration-empty p{font-size:14px}.coding-time{flex-wrap:wrap;gap:14px}.coding-time strong{font-size:clamp(34px,4.8vw,65px);line-height:1;letter-spacing:-.06em}.discord-profile,.steam-profile{grid-template-columns:50px 1fr;gap:13px}.live-avatar img,.steam-profile>img{width:50px;height:50px}.discord-profile h2,.steam-profile h2{font-size:21px;overflow-wrap:anywhere}.discord-activity,.recent-game{padding:14px;margin-top:20px}.discord-activity strong,.recent-game strong{font-size:18px}.discord-activity p,.recent-game p{font-size:13px}.live-stat-row{margin-top:20px}.live-stat-row b{font-size:20px}.live-stat-row span,.signal-foot span{font-size:9px;padding:13px 7px}.signal-foot{margin-top:18px}.stat-detail{display:block;width:100%;padding:12px;background:transparent;border:1px solid var(--line);color:var(--signal);font-size:11px;margin-top:18px}.github-heading{display:flex;gap:14px;align-items:flex-start;justify-content:space-between}.github-heading a{font:13px VCR;text-decoration:none;color:var(--signal)}.github-heading p{font-size:13px;color:var(--muted);line-height:1.5;margin:9px 0}.github-heading img{border-radius:8px}.contribution-summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;margin:27px 0 18px}.contribution-summary strong{font-size:38px;letter-spacing:-.05em}.contribution-summary span{font-size:12px;color:var(--muted)}.contribution-scroll{max-width:100%;overflow-x:auto;padding:4px 2px 12px;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}.contribution-calendar{display:flex;gap:3px;width:max-content}.contribution-week{display:grid;grid-template-rows:repeat(7,10px);gap:3px}.contribution-day{width:10px;height:10px;border:0;border-radius:2px;padding:0}.level-0{background:#182730}.level-1{background:#234b45}.level-2{background:#397d64}.level-3{background:#59b887}.level-4{background:#87ebad}.contribution-day:hover,.contribution-day:focus{outline:1px solid var(--paper);outline-offset:1px}.contribution-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;color:var(--muted);font-size:10px}.contribution-footer>p{margin:2px 0;min-height:2.5em;line-height:1.6}.contribution-footer>span{display:flex;align-items:center;gap:4px;align-self:flex-start}.contribution-footer i{width:9px;height:9px;border-radius:1px}.github-numbers{display:flex;flex-wrap:wrap;gap:18px;border-top:1px solid var(--line);padding-top:22px;margin-top:20px}.github-numbers span{font-size:11px;color:var(--muted)}.github-numbers b{color:var(--paper);margin-right:4px;font-size:18px}.calendar-empty{padding:28px 0;color:var(--muted);line-height:1.5}.calendar-empty a{color:var(--signal);font-size:12px}.monkey-heading{display:flex;align-items:center;gap:13px}.monkey-heading>span{font:bold 30px VCR;color:#e8c886}.monkey-heading a{display:block;text-decoration:none;font-size:18px}.monkey-heading small{display:block;font:8px VCR;color:var(--muted);margin-top:7px}.typing-bests{display:grid;grid-template-columns:repeat(2,1fr);margin-top:18px;gap:10px}.typing-bests>div{border:1px solid var(--line);padding:12px;display:flex;flex-direction:column;gap:5px}.typing-bests small{font:9px/1.45 VCR;color:var(--muted);overflow-wrap:anywhere}.typing-bests strong{font-size:26px;font-weight:400}.typing-bests strong em{font:9px VCR}.typing-bests span{font-size:10px;color:#e8c886}.popular-repositories{margin-block:50px}.section-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.section-heading h2{font-size:28px;letter-spacing:-.035em;margin:0}.section-heading a{font:10px VCR;color:var(--signal)}.popular-repo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.popular-repo{display:flex;flex-direction:column;gap:12px;border:1px solid var(--line);padding:21px;background:var(--panel);text-decoration:none;min-width:0}.popular-repo:hover{border-color:var(--signal)}.popular-repo>div{display:flex;gap:12px;justify-content:space-between}.popular-repo h3{font-size:17px;margin:0;overflow-wrap:anywhere}.popular-repo>div>b{color:var(--signal)}.popular-repo p{margin:0;color:var(--muted);line-height:1.5;font-size:13px}.popular-repo footer{margin-top:auto;display:flex;gap:13px;font:10px VCR;color:var(--muted)}.popular-repo footer span:first-child{margin-right:auto;color:var(--signal)}.resume-stats article{min-height:115px}.resume-stats strong{font-size:42px}
.contact-banner{position:relative;display:flex;align-items:center;gap:35px;border:1px solid var(--line);margin-top:38px;padding:35px 42px;min-height:210px;overflow:hidden;background:linear-gradient(115deg,#101e2a,#07121b);isolation:isolate}.contact-banner:after{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#8fd6ff07 1px,transparent 1px),linear-gradient(90deg,#8fd6ff07 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(90deg,transparent,#000)}.contact-banner>img{width:86px;height:86px;image-rendering:pixelated;filter:drop-shadow(8px 8px 0 #ff3b2f30)}.contact-banner>div>span{font:10px VCR;color:var(--signal)}.contact-banner p{font-size:clamp(24px,3.7vw,46px);line-height:1.04;letter-spacing:-.04em;margin:12px 0 0}.banner-coordinate{margin-left:auto;font:10px/1.8 VCR;color:var(--muted);text-align:right}.contact-hero h1{font-size:clamp(40px,5.5vw,76px);max-width:1000px}.social-card{min-height:130px;padding:20px;gap:14px}.social-card strong{font-size:19px;overflow-wrap:anywhere}.contact-layout{gap:30px}.contact-form{padding:26px}.contact-form input,.contact-form textarea{padding:12px 0;font-size:15px}.contact-form button{min-height:45px}.contact-form button:disabled{opacity:.5;cursor:not-allowed}#contactStatus{font-size:13px;line-height:1.65;color:var(--muted);margin:15px 0}.email-fallback{font-size:12px;color:var(--signal)}.form-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}#contactCaptcha{margin:10px 0;max-width:100%;overflow:hidden}
.story-section{margin:20px 0 75px;border:1px solid var(--line);background:#07121b}
.terminal-section{margin:60px 0;border:1px solid var(--line);background:#050c12;max-width:930px}.terminal-top{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--line);font:10px VCR;color:var(--muted)}.terminal-top>span:first-child{color:var(--red);letter-spacing:5px}.terminal-top small{color:var(--signal);font:9px VCR}#terminalOutput{height:230px;overflow-y:auto;padding:18px 22px;font:13px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;color:#b1c5d1}#terminalOutput p{white-space:pre-wrap;margin:0 0 12px;overflow-wrap:anywhere}#terminalForm{display:flex;align-items:center;gap:10px;padding:13px 22px;border-block:1px solid var(--line);font:12px ui-monospace,monospace}#terminalForm label{white-space:nowrap;color:var(--green)}#terminalForm b{color:var(--signal)}#terminalInput{min-width:0;flex:1;padding:9px 0;border:0;background:transparent;outline:0}#terminalForm button{background:transparent;border:1px solid var(--line);width:38px;height:36px}.terminal-note{font-size:11px;line-height:1.5;color:var(--muted);padding:0 22px}
.dialog-open{overflow:hidden}.modal-dialog{border-radius:10px;overscroll-behavior:contain}.modal-dialog::backdrop{background:#02060cbf;backdrop-filter:blur(8px)}.small-dialog{max-width:490px;padding:28px}.small-dialog h2{clear:both;font-size:33px;padding-top:15px}.small-dialog p{font-size:14px}.small-dialog a{font-size:12px;color:var(--signal)}.small-dialog input{display:block;width:100%;margin-block:10px 16px;border:1px solid var(--line);background:var(--void);padding:13px}.small-dialog label{font-size:12px;color:var(--muted)}.primary-button,.oauth-buttons button,.account-actions button,#deleteConfirmation button,.guestbook-signin button{border:1px solid var(--line);background:var(--deep);padding:12px 16px;min-height:42px;font-size:12px}.primary-button{background:var(--signal);color:var(--void)}.oauth-buttons{display:grid;gap:10px;margin-block:24px}.oauth-buttons button{text-align:left;padding:17px;border-color:var(--line-strong)}.oauth-buttons button:hover{border-color:var(--signal)}.oauth-buttons button:disabled{opacity:.4;cursor:not-allowed}.privacy-note{font-size:12px!important}.account-actions{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.account-actions button:last-child{color:#ff8d86}#deleteConfirmation{border:1px solid #ff3b2f66;padding:14px;margin-bottom:15px}#deleteConfirmation button{margin:4px}.guestbook-dialog{position:fixed;inset:auto 18px 84px auto;margin:0;width:min(430px,calc(100vw - 28px));height:min(680px,calc(100svh - 115px));max-height:calc(100svh - 115px);padding:25px;overflow-y:auto}.guestbook-dialog .dialog-close{position:absolute;right:16px;top:16px;width:32px;height:32px}.guestbook-heading>small{font:9px VCR;color:var(--signal)}.guestbook-heading h2{display:flex;align-items:center;gap:18px;font-size:34px;letter-spacing:-.05em;margin:18px 0 8px}.guestbook-heading h2>span{color:var(--red);font-size:23px}.guestbook-heading>p{font-size:13px;margin:0 0 20px}.guestbook-signin{padding:16px;border:1px solid var(--line);background:var(--void)}.guestbook-signin p{font-size:13px;margin:0 0 14px}.guestbook-signin button{color:var(--signal);width:100%}#guestbookStatus{font-size:12px;line-height:1.6}#guestbookForm{padding:15px;background:var(--void);border:1px solid var(--line)}.composer-identity{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;font-size:12px}.composer-identity span{color:var(--signal);overflow-wrap:anywhere}.composer-identity button{font-size:10px;background:transparent;border:0;color:var(--muted)}#guestbookMessage{width:100%;resize:vertical;background:transparent;border:0;border-bottom:1px solid var(--line);font-size:13px;line-height:1.6;padding:8px 0;min-height:80px}.composer-bottom{display:flex;align-items:center;gap:8px;justify-content:space-between;margin-top:10px}.composer-bottom small{font-size:9px;color:var(--muted)}.composer-bottom button{padding:9px 13px;background:var(--signal);color:var(--void);border:0;min-height:36px;font-size:12px}.guestbook-entry{border-bottom:1px solid var(--line);padding:20px 0}.guestbook-entry header{display:flex;align-items:center;gap:10px}.guest-avatar{width:32px;height:32px;background:#8fd6ff14;display:grid;place-items:center;color:var(--signal);font:13px VCR;border:1px solid var(--line)}.guestbook-entry header>div{display:grid;gap:5px;min-width:0}.guestbook-entry header b{font-size:12px;overflow-wrap:anywhere}.guestbook-entry time{font:9px VCR;color:var(--muted)}.guestbook-entry header>button{margin-left:auto;background:transparent;border:1px solid var(--line);width:30px;height:30px}.guestbook-entry p{font-size:13px;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere;margin:12px 0 0;color:var(--paper)}#guestbookMore{width:100%;margin-top:18px}.command-dialog{max-width:620px;border-radius:12px;align-self:start;margin:14svh auto auto}.command-dialog>[data-close]{display:none}.command-search{display:flex;gap:13px;align-items:center;padding:22px;border-bottom:1px solid var(--line)}.command-search>span{font-size:27px;color:var(--signal)}.command-search input{border:0;outline:0;background:transparent;font-size:18px;flex:1;min-width:0}.command-search kbd{font:9px VCR;border:1px solid var(--line);padding:5px;color:var(--muted)}#commandResults{max-height:min(400px,50svh);overflow-y:auto;padding:8px}#commandResults button{display:flex;align-items:center;gap:14px;width:100%;padding:14px;border:1px solid transparent;background:transparent;text-align:left;min-height:49px;border-radius:6px}#commandResults button[aria-selected=true],#commandResults button:hover{background:#8fd6ff12;border-color:#8fd6ff30;color:var(--signal)}#commandResults small{margin-left:auto;font:9px VCR;color:var(--muted)}#commandResults b{font-weight:400;color:var(--muted)}.command-footer{display:flex;justify-content:space-between;padding:14px 20px;border-top:1px solid var(--line);font:9px VCR;color:var(--muted)}#toast{position:fixed;z-index:220;left:50%;bottom:90px;transform:translateX(-50%);max-width:calc(100vw - 40px);width:max-content;border:1px solid var(--line-strong);background:var(--panel-solid);padding:15px 20px;font-size:13px;box-shadow:var(--shadow);border-radius:8px}.privacy-page{max-width:930px}.privacy-prose{line-height:1.8;font-size:16px;margin-bottom:70px}.privacy-prose h2{font-size:25px;letter-spacing:-.025em;margin-top:35px}.privacy-prose p,.privacy-prose li{color:var(--muted)}.privacy-prose a{color:var(--signal)}.auth-page{min-height:80svh;display:grid;place-content:center}.auth-page h1{font-size:42px}.auth-page a{color:var(--signal)}
@media(min-width:1600px){.home-hero{min-height:720px}}
@media(max-width:1180px){.brand span{display:none}.desktop-nav a{padding:10px 8px;font-size:10px}.desktop-nav a>svg{width:15px}.site-header{gap:9px;padding:0 12px}.header-actions kbd{display:none}.project-stack,.certificate-list{grid-template-columns:repeat(2,minmax(0,1fr))}.project-visual{aspect-ratio:16/9}.telemetry-grid .telemetry-card{grid-column:span 6}.telemetry-grid #monkeytypeCard{grid-column:span 12}.typing-bests{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:980px){.desktop-nav{display:none}.site-header{grid-template-columns:1fr auto;padding-inline:18px}.menu-toggle{display:grid!important}.brand span{display:block}.popular-repo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.telemetry-grid #wakaCard,.telemetry-grid #githubCard{grid-column:span 12}.contact-banner{padding:30px}.contact-layout{grid-template-columns:1fr}.contact-profile{max-height:280px}.contact-profile img{max-height:280px;width:50%;object-fit:cover}.contact-profile{display:flex}.contact-profile>div{width:50%;padding:25px}.social-constellation{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.page{padding:94px 18px 0}.site-header{width:calc(100% - 24px);top:10px;height:61px;border-radius:11px;padding-inline:12px}.brand span{font-size:8px}.header-actions button{min-width:34px;padding:7px 9px}.page-code{font-size:9px}.page-code i{display:none}.page-title{font-size:clamp(38px,10vw,58px)}.page-lead{font-size:15px}.home-hero{min-height:0}.project-stack,.certificate-list{grid-template-columns:1fr;gap:18px}.project-copy{padding:21px}.project-copy h2{font-size:30px}.project-visual{aspect-ratio:16/9}.collection-toolbar{gap:12px}.search-field{flex:1}.search-field input{width:100%}.filter-chips{gap:5px}.filter-chips button{font-size:11px;padding:8px 10px}#projectCount{margin-left:0;font-size:10px}.certificate-card{flex-direction:row;align-items:stretch}.cert-art{width:36%;aspect-ratio:auto;flex-shrink:0}.cert-art img{padding:5px}.cert-copy{padding:18px;min-height:170px}.cert-copy h2{font-size:17px}.cert-copy p{font-size:11px}.cert-copy small{font-size:8px}.gallery-toolbar{top:81px}.gallery-toolbar>span{width:100%;padding:3px 8px}.gallery-toolbar button{padding:7px 10px;font-size:9px}.gallery-next-bar{padding:12px 10px;gap:5px}.gallery-next-bar button{font-size:11px}.gallery-dialog figcaption{padding:23px}.gallery-dialog figcaption h2{font-size:26px}.telemetry-grid{gap:16px}.telemetry-grid .telemetry-card,.telemetry-grid #monkeytypeCard{grid-column:span 12;padding:20px}.typing-bests{grid-template-columns:repeat(2,minmax(0,1fr))}.coding-time strong{font-size:46px}.popular-repo-grid{grid-template-columns:1fr}.resume-stats{grid-template-columns:repeat(2,1fr)}.resume-stats article{border-bottom:1px solid var(--line);padding:20px;min-height:105px}.resume-stats strong{font-size:38px}.resume-stats span{font-size:9px}.contact-banner{gap:20px;padding:25px;min-height:160px;margin-top:20px}.contact-banner>img{width:55px;height:55px}.contact-banner>div>span{font-size:8px}.banner-coordinate{display:none}.contact-hero h1{font-size:40px}.social-card{padding:15px;gap:10px}.social-card>span{font-size:9px}.contact-profile{display:none}.contact-form{padding:22px}.story-section{margin-block:20px 45px}.terminal-section{margin-block:40px}.terminal-top{padding:14px;font-size:9px}.terminal-top small{display:none}#terminalForm{padding:12px;font-size:10px;gap:6px}#terminalOutput{font-size:12px;padding:16px}.guestbook-dialog{right:12px;bottom:74px;max-height:calc(100svh - 92px);height:calc(100svh - 105px)}.small-dialog{padding:24px}.modal-dialog h2{font-size:30px}.command-dialog{margin-top:10svh}.command-search{padding:18px}.command-search input{font-size:16px}#commandResults button{padding:14px 10px;font-size:14px}#commandResults small{font-size:8px}.command-footer{font-size:8px;gap:10px}.site-footer{font-size:9px}.experience-list article{grid-template-columns:1fr;gap:13px;padding:24px 0}.experience-list h3{font-size:26px}.dialog-data{grid-template-columns:1fr;gap:7px}.privacy-prose{font-size:15px}}
@media(max-width:380px){.brand span{display:none}.header-actions{gap:3px}.header-actions button{padding:7px}.social-constellation{grid-template-columns:1fr}.certificate-card{flex-direction:column}.cert-art{width:100%;aspect-ratio:1.6}.cert-copy{min-height:0}.terminal-top>span:first-child{display:none}.gallery-next-bar button{padding:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.scene-layers img{transform:none!important}.cursor-orb{display:none}.route-transition{display:none!important}}
/* Compact vertical rhythm and inherited-layout corrections. */
.page-intro,.page-intro.compact-intro{min-height:0;padding:42px 0 40px}.page-title{line-height:1.02;margin-top:28px}.contact-hero{min-height:0;padding:42px 0 45px}.contact-layout{margin-top:48px}.contact-form{gap:16px}.contact-form label{margin-bottom:0}.contact-end{min-height:330px}.contact-profile{min-height:480px}.project-card .project-preview,.project-copy{transform:none}.project-actions{padding-top:0}.reaction-row{width:100%}.vault-window{grid-template-rows:30px 1fr}.menu-open{overflow:hidden}.gallery-dialog{padding:0}.command-dialog{padding:0}.page-code{grid-template-columns:60px 1fr auto}.site-footer{padding-inline:clamp(18px,4vw,60px)}
@media(max-width:980px){.contact-profile{min-height:0}.contact-profile>div{position:relative;inset:auto;align-content:center}.contact-profile::after{display:none}}
@media(max-width:700px){.page-intro,.page-intro.compact-intro{min-height:0;padding:25px 0 32px}.page-code{grid-template-columns:45px 1fr}.page-title{margin-top:24px}.social-constellation{grid-template-columns:1fr}.social-card{min-height:96px}.social-card strong{font-size:17px}.contact-end p{font:11px/1.8 VCR}.contact-end{min-height:280px}.about-portrait-section{padding:25px 0 65px}.resume-section{padding:50px 0}.gallery-dialog{padding:0}.gallery-toolbar>span{display:block}.guestbook-dialog{padding:22px}.command-dialog{padding:0}.home-hero{padding-top:20px}.home-manifesto{min-height:0;padding:60px 0}.site-footer{margin-top:50px}}

@keyframes albumDiscSpin {
  to {
    transform: rotate(360deg);
  }
}

/* ===== Pixel journey ===== */

.story-section.pixel-story {
  margin: 24px 0 64px;
  border: 0;
  background: transparent;
}

.journey-stage {
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--panel-solid);
}

.journey-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
  font: 10px VCR;
  color: var(--muted);
}

.journey-header span:first-child {
  color: var(--signal);
}

.journey-scene{height:clamp(220px, 30vw, 360px);overflow:hidden;background:#102535}

.journey-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  image-rendering: pixelated;
}

.journey-copy {
  display: grid;
  padding: 20px 24px;
}

.journey-chapter {
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}

.journey-chapter:last-child {
  border-bottom: 0;
}

.journey-chapter small {
  font: 10px VCR;
  color: var(--signal);
}

.journey-chapter h2 {
  margin: 12px 0;
  font-size: clamp(25px, 3vw, 38px);
  line-height: 1.12;
  letter-spacing: -.035em;
}

.journey-chapter p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.7;
}

.journey-steps {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin: 0;
  padding: 14px;
  list-style: none;
  border-top: 1px solid var(--line);
  font: 10px VCR;
  color: var(--muted);
}

.journey-steps .is-active {
  color: var(--signal);
}

/* Layout ketika ScrollTrigger mengaktifkan pinning */
.pixel-story.is-pinned .journey-stage {
  display: grid;
  grid-template-rows: auto minmax(180px, 1fr) auto auto;
  height: min(720px, calc(100svh - 132px));
}

.pixel-story.is-pinned .journey-scene {
  height: auto;
}

.pixel-story.is-pinned .journey-chapter {
  grid-area: 1 / 1;
  padding: 0;
  border: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .2s, transform .2s;
}

.pixel-story.is-pinned .journey-chapter.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

@media (max-width: 700px) {
  .journey-header {
    padding: 14px;
    font-size: 8px;
  }

  .journey-copy {
    padding: 16px;
  }

  .journey-chapter p {
    font-size: 14px;
  }
}

/* ===== Stack marquee with logos ===== */

.skill-marquee {
  margin: 32px 0;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--panel);
}

.stack-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}

.stack-heading h2 {
  margin: 0;
  font: 10px VCR;
  color: var(--muted);
}

.stack-heading button {
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: transparent;
  color: var(--signal);
  font: 10px VCR;
}

.skill-marquee .stack-track {
  display: flex;
  width: max-content;
  padding-block: 14px;
  animation: stackTravel var(--stack-duration, 90s) linear infinite;
}

.stack-track ul {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 0 10px 0 0;
  list-style: none;
}

.stack-chip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  white-space: nowrap;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-solid);
}

.stack-chip img,
.stack-chip svg {
  display: block;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  object-fit: contain;
  color: var(--signal);
}

.stack-chip img {
  border-radius: 6px;
}

.stack-chip b {
  font: 10px VCR;
  font-weight: 400;
}

.skill-marquee.is-paused .stack-track {
  animation-play-state: paused;
}

@keyframes stackTravel {
  to {
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .skill-marquee .stack-track {
    width: 100%;
    animation: none;
  }

  .stack-track ul {
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    padding: 0 12px;
  }

  .stack-track ul[aria-hidden="true"],
  .stack-heading button {
    display: none;
  }
}

.journey-scene {
  position: relative;
  container-type: size;
  container-name: journeyScene;
}

.journey-sky {
  position: absolute;
  z-index: 2;
  top: 8%;
  inset-inline: 20px;
  text-align: center;
  pointer-events: none;
}

.journey-sky__label,
.journey-sky__title {
  font-family: "VCR", monospace;
  font-weight: 400;
  font-style: normal;
}

.journey-sky__label {
  display: block;
  margin-bottom: 12px;
  color: #a8dbc5;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-shadow: 2px 2px 0 #07121a;
}

.journey-sky__title {
  margin: 0;
  color: #edf7e8;
  font-size: clamp(22px, 3.8vw, 48px);
  line-height: 1.12;
  letter-spacing: 0.025em;
  white-space: pre-line;
  text-wrap: balance;
  text-shadow:
    3px 3px 0 rgba(4, 15, 24, 0.95),
    0 0 24px rgba(168, 219, 197, 0.12);
}

/* Sesuaikan dengan tinggi area animasi yang tersedia. */
@container journeyScene (max-height: 280px) {
  .journey-sky__label {
    display: none;
  }

  .journey-sky__title {
    font-size: 18px;
    line-height: 1.1;
  }
}

.oauth-buttons button{display:inline-flex;align-items:center;justify-content:center;gap:.6rem}
.provider-icon{width:1.15em;height:1.15em;flex:none}

#wakaCard {
  align-self: start;
}

.waka-more {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.waka-more > summary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 36px;
  margin-left: auto;
  padding: 8px 13px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: rgba(143, 214, 255, 0.06);
  color: var(--signal);
  font: 12px VCR, monospace;
  list-style: none;
  cursor: pointer;
}

.waka-more > summary::-webkit-details-marker {
  display: none;
}

.waka-more > summary:hover {
  border-color: var(--signal);
}

.waka-more > summary:focus-visible {
  outline: 2px solid var(--signal);
  outline-offset: 4px;
}

.waka-less-label,
.waka-more[open] .waka-more-label {
  display: none;
}

.waka-more[open] .waka-less-label {
  display: inline;
}

.waka-expanded {
  padding-top: 22px;
}

.waka-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.waka-metrics > div {
  display: grid;
  gap: 9px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.waka-metrics small {
  color: var(--muted);
  font: 10px VCR, monospace;
}

.waka-metrics strong {
  font-size: 16px;
  overflow-wrap: anywhere;
}

.waka-breakdowns {
  display: grid;
  grid-template-columns:
    repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: 24px;
  margin-top: 24px;
}

.waka-breakdown {
  min-width: 0;
}

.waka-breakdown h3 {
  margin: 0 0 12px;
  color: var(--signal);
  font: 11px VCR, monospace;
  letter-spacing: 0.06em;
}

.waka-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 13px;
}

.waka-table th,
.waka-table td {
  padding: 10px 4px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.waka-table th {
  color: var(--muted);
  font-size: 11px;
  font-weight: 400;
}

.waka-table th:first-child {
  width: 42%;
}

.waka-table th:nth-child(2) {
  width: 38%;
}

.waka-table th:last-child {
  width: 20%;
}

.waka-table th:last-child,
.waka-table td:last-child {
  text-align: right;
}

.waka-empty {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}