@import url('cover-lab.css?v=10');

.console-field { position:fixed; z-index:1; inset:0 0 0 40%; overflow:hidden; pointer-events:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 100%); }
.console-field * { user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.console-glow { position:absolute; inset:4% -10% -15% 12%; opacity:.55; background:radial-gradient(circle at 48% 32%,rgba(80,255,201,.2),transparent 34%),radial-gradient(circle at 78% 62%,rgba(116,71,255,.3),transparent 42%); filter:blur(50px); }
.console-window { position:absolute; inset:0; padding:1.5rem 1rem; overflow:hidden; contain:layout paint; color:rgba(225,235,231,.48); background:transparent; font:400 clamp(.86rem,1vw,1rem)/1.62 var(--mono); }
.console-window::before { position:absolute; z-index:0; inset:0; background:linear-gradient(135deg,rgba(0,0,0,.58),rgba(0,0,0,.42)); mix-blend-mode:multiply; content:''; pointer-events:none; }
.console-bar { display:none; }
.console-output { position:relative; z-index:1; display:grid; gap:.12rem; width:min(96%,920px); }
.console-paragraph { position:relative; min-height:1.62em; padding-left:4rem; color:inherit; overflow-wrap:anywhere; }
.console-paragraph.is-new { animation:log-line-in .48s cubic-bezier(.22,1,.36,1) both; }
.console-paragraph::before { position:absolute; left:0; width:2rem; color:rgba(205,220,211,.36); content:attr(data-line); text-align:right; }
.console-paragraph::after { position:absolute; left:2.8rem; color:rgba(130,236,157,.58); content:'+'; }
.console-char.syntax-green { color:rgba(176,245,178,.76); }
.console-char.syntax-blue { color:rgba(128,185,255,.8); }
.console-char.syntax-purple { color:rgba(217,160,255,.82); }
.console-char.syntax-orange { color:rgba(255,184,122,.85); }
.console-char.syntax-yellow { color:rgba(255,225,154,.86); }
.console-char { display:inline-block; transition:transform .65s cubic-bezier(.18,.8,.18,1),opacity .55s,color .4s,filter .55s; transform:translate(var(--scatter-x,0),var(--scatter-y,0)) rotate(var(--scatter-r,0)); }
.console-char.is-touch-scattered { animation:touch-char-glitch .76s var(--touch-delay,0ms) cubic-bezier(.16,.72,.24,1) both; }
.console-char.space { width:.62em; }
.console-line .prompt { color:rgba(200,255,69,.52); }
.console-line .key { color:rgba(117,226,255,.5); }
.console-line .string { color:rgba(255,157,205,.47); }
.console-line .comment { color:rgba(255,255,255,.2); }
.console-line.hot { color:rgba(225,255,244,.68); text-shadow:0 0 16px rgba(98,255,207,.18); }
.console-window.is-scattered .console-char.is-near { opacity:.92; color:rgba(230,255,246,.92); text-shadow:0 0 16px rgba(98,255,207,.24); transition-duration:.75s; }
.console-cursor { display:inline-block; width:7px; height:1.1em; margin-top:.25rem; background:rgba(200,255,69,.55); animation:console-blink 1s steps(1) infinite; }
.console-touch-ripple { position:absolute; z-index:4; top:var(--ripple-y); left:var(--ripple-x); width:24px; height:24px; border:2px solid rgba(200,255,69,.95); border-radius:50%; pointer-events:none; transform:translate(-50%,-50%) scale(.2); animation:console-touch-ripple .9s cubic-bezier(.16,.72,.24,1) forwards; box-shadow:0 0 28px rgba(98,255,207,.72),inset 0 0 20px rgba(217,160,255,.38); }
.console-touch-ripple::after { position:absolute; inset:5px; border:1px solid rgba(128,185,255,.9); border-radius:inherit; content:''; animation:console-touch-ripple-inner .9s .06s cubic-bezier(.16,.72,.24,1) forwards; }
@keyframes console-blink { 50% { opacity:0; } }
@keyframes log-line-in { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@keyframes console-touch-ripple { 0% { opacity:0; transform:translate(-50%,-50%) scale(.2); } 12% { opacity:1; } 100% { opacity:0; transform:translate(-50%,-50%) scale(17); } }
@keyframes console-touch-ripple-inner { from { opacity:1; transform:scale(.4); } to { opacity:0; transform:scale(1.35); } }
@keyframes touch-char-glitch {
  0% { opacity:1; transform:none; filter:none; text-shadow:none; }
  18% { opacity:.96; transform:translate(var(--touch-x),var(--touch-y)) rotate(var(--touch-r)); filter:brightness(1.55); text-shadow:-3px 0 rgba(255,70,190,.9),3px 0 rgba(70,235,255,.9); }
  38% { opacity:.72; transform:translate(var(--touch-x),var(--touch-y)) rotate(var(--touch-r)); filter:brightness(1.8); text-shadow:4px 0 rgba(200,255,69,.82),-4px 0 rgba(116,71,255,.9); }
  58% { opacity:.92; transform:translate(3px,-2px); filter:brightness(1.3); text-shadow:-2px 0 rgba(255,70,190,.65),2px 0 rgba(70,235,255,.7); }
  100% { opacity:1; transform:none; filter:none; text-shadow:none; }
}

@media (min-width:992px) {
  .cover { min-height:100svh; }
  .cover::after { position:fixed; z-index:2; top:0; bottom:0; left:0; width:calc(52% - 30px); background:#08080b; clip-path:polygon(0 0,calc(100% - 18px) 0,100% 24%,calc(100% - 38px) 56%,100% 79%,calc(100% - 10px) 100%,0 100%); content:''; pointer-events:none; }
  .cover-copy { width:calc(48% - var(--gutter)); max-width:none; min-height:100svh; margin-left:var(--gutter); margin-right:auto; padding-block:5rem; transform:none; }
  .cover-copy h1 { font-size:clamp(3rem,4.7vw,5rem); white-space:nowrap; }
  .cover-copy h1 { max-width:100%; }
  .cover-copy .intro { width:350px; max-width:100%; }
  .portfolio-links { width:350px; max-width:100%; }
  .portfolio-link:first-child { border-top:0; }
  .portfolio-link-actions { gap:30px; }
  .console-field { pointer-events:auto; }
}

.title-lockup { display:flex; width:100%; align-items:center; gap:clamp(1rem,1.6vw,1.5rem); }
.title-lockup h1 { width:auto; letter-spacing:-.01em; }
.title-logo { width:clamp(42px,4vw,58px); height:clamp(50px,4.8vw,70px); flex:0 0 auto; }
.cover-footer { position:fixed; z-index:9; bottom:1.5rem; left:var(--gutter); display:flex; width:350px; max-width:calc(100vw - (var(--gutter) * 2)); align-items:center; justify-content:space-between; }
.cover-footer>small { color:var(--muted); font:500 .61rem/1 var(--mono); letter-spacing:.06em; }
.professional-links { margin:0; }
.professional-links a { font:500 .61rem/1.2 var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.professional-links a:not(.download-link)>svg { display:none; }
.portfolio-link small,.cover-footer>small { font:500 .61rem/1.2 var(--mono); letter-spacing:.08em; text-transform:uppercase; }

.resume-pill { display:inline-flex; border:1px solid var(--line); border-radius:999px; overflow:hidden; }
.header-links .resume-pill a { border:0; border-radius:0; }
.header-links .resume-pill .download-link { border-left:1px solid var(--line); }

@media (max-width:991.98px), (hover:none) and (pointer:coarse) {
  html { width:100%; height:100%; overflow:hidden; overflow:clip; overscroll-behavior:none; }
  body { position:fixed; inset:0; width:100vw; height:100dvh; max-height:100dvh; overflow:hidden; overflow:clip; overscroll-behavior:none; touch-action:none; }
  .cover { position:absolute; inset:0; width:100%; height:100%; min-height:0; max-width:100vw; overflow:hidden; overflow:clip; touch-action:none; }
  .aurora,.aurora-orb { animation:none; transform:none; }
  .cover::before { position:absolute; z-index:0; top:0; right:0; left:0; height:34svh; background:radial-gradient(circle at 72% 10%,rgba(116,71,255,.48),transparent 52%),radial-gradient(circle at 96% 72%,rgba(52,215,255,.28),transparent 48%),radial-gradient(ellipse at 42% 112%,rgba(255,102,126,.48),transparent 58%),linear-gradient(135deg,#08080b 5%,#171333 62%,#0d1320); content:''; opacity:.78; }
  .cover::after { position:absolute; z-index:2; top:24svh; right:0; bottom:0; left:0; background:#08080b; clip-path:polygon(0 17px,22% 0,32% 28px,100% 28px,100% 100%,0 100%); content:''; pointer-events:none; }
  .console-field { position:absolute; display:block; inset:0 0 auto; height:34svh; opacity:.62; mask-image:linear-gradient(to bottom,#000 0,#000 72%,transparent 100%); pointer-events:auto; touch-action:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
  .console-window { inset:0; padding:.35rem 0; background:transparent; font-size:clamp(.64rem,1.7vw,.82rem); line-height:1.5; transform:none; }
  .console-window::before { background:rgba(0,0,0,.34); }
  .console-output { --touch-console-scale:1.18; width:126%; gap:.04rem; transform:scale(var(--touch-console-scale)); transform-origin:left top; }
  .console-paragraph { min-height:1.5em; padding-left:3.2rem; white-space:nowrap; }
  .console-paragraph::before { width:1.7rem; }
  .console-paragraph::after { left:2.35rem; }
  .cover-copy { position:absolute; top:24svh; bottom:5.25rem; width:calc(100vw - (var(--gutter) * 2)); max-width:none; min-height:0; margin-inline:var(--gutter); padding:2rem 0 0; justify-content:center; align-items:stretch; }
  .cover-copy::before { display:none; }
  .portfolio-links { width:100%; margin-top:clamp(1.25rem,3vh,2rem); }
  .portfolio-link { min-height:clamp(72px,10.5vh,88px); padding-block:.8rem; }
  .intro { max-width:560px; }
  .cover-footer { position:static; display:flex; width:100%; max-width:none; margin-top:clamp(1.15rem,2.5vh,1.75rem); }
}

@media (min-width:600px) and (max-width:991.98px), (min-width:600px) and (hover:none) and (pointer:coarse) {
  .title-logo { width:clamp(60px,9vw,72px); height:clamp(72px,11vw,88px); }
  .console-char.is-touch-scattered { animation-name:touch-char-glitch-tablet; }
  .console-touch-ripple { box-shadow:0 0 18px rgba(98,255,207,.48); }
  .professional-links { gap:.65rem; }
  .professional-links a { min-height:46px; padding:.7rem 1rem; font-size:.72rem; }
  .professional-links .download-link { width:46px; padding:0; }
  .professional-links svg { width:17px; height:17px; }
}

@media (min-width:800px) and (orientation:landscape) and (hover:none) and (pointer:coarse) {
  .cover::before { top:0; right:0; bottom:0; left:50%; width:auto; height:auto; background:radial-gradient(circle at 64% 12%,rgba(116,71,255,.48),transparent 48%),radial-gradient(circle at 92% 58%,rgba(52,215,255,.34),transparent 46%),radial-gradient(ellipse at 34% 105%,rgba(255,102,126,.5),transparent 58%),linear-gradient(145deg,#171333,#0d1320); }
  .cover::after { top:0; right:auto; bottom:0; left:0; width:calc(50% + 30px); background:#08080b; clip-path:polygon(0 0,calc(100% - 18px) 0,100% 25%,calc(100% - 28px) 58%,100% 82%,calc(100% - 10px) 100%,0 100%); }
  .console-field { inset:0 0 0 50%; width:auto; height:100%; opacity:.62; mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 100%); }
  .console-window { padding:1rem .5rem; font-size:clamp(.68rem,1.15vw,.86rem); }
  .console-output { --touch-console-scale:1.08; width:135%; transform:scale(var(--touch-console-scale)); transform-origin:left top; }
  .cover-copy { top:0; bottom:0; width:calc(50% - (var(--gutter) * 2)); margin-left:var(--gutter); margin-right:auto; padding:clamp(2.5rem,5vh,4rem) 0; justify-content:center; }
  .portfolio-links { width:100%; }
  .cover-footer { width:100%; }
}

@media (min-width:600px) and (orientation:portrait) and (hover:none) and (pointer:coarse) {
  .cover::before { top:0; right:0; bottom:auto; left:0; width:100%; height:34svh; }
  .cover::after { top:24svh; right:0; bottom:0; left:0; width:100%; background:#08080b; clip-path:polygon(0 17px,22% 0,32% 28px,100% 28px,100% 100%,0 100%); }
  .console-field { inset:0 0 auto; width:100%; height:34svh; mask-image:linear-gradient(to bottom,#000 0,#000 72%,transparent 100%); }
  .console-window { padding:.35rem 0; font-size:clamp(.68rem,1.7vw,.84rem); }
  .console-output { --touch-console-scale:1.14; width:126%; transform:scale(var(--touch-console-scale)); }
  .cover-copy { top:24svh; right:auto; bottom:5.25rem; left:auto; width:calc(100vw - (var(--gutter) * 2)); margin-inline:var(--gutter); padding:2rem 0 0; justify-content:center; }
  .portfolio-links,.cover-footer { width:100%; }
}

@keyframes touch-char-glitch-tablet {
  0% { opacity:1; transform:none; text-shadow:none; }
  24% { opacity:.9; transform:translate(var(--touch-x),var(--touch-y)) rotate(var(--touch-r)); text-shadow:-2px 0 rgba(255,70,190,.7),2px 0 rgba(70,235,255,.75); }
  52% { opacity:.88; transform:translate(2px,-1px); text-shadow:1px 0 rgba(200,255,69,.65),-1px 0 rgba(116,71,255,.68); }
  100% { opacity:1; transform:none; text-shadow:none; }
}

@media (max-width:599.98px) {
  .title-lockup { width:85vw; max-width:85vw; inline-size:85vw; max-inline-size:85vw; flex-direction:column; align-items:flex-start; gap:.65rem; }
  .title-logo { width:60px; height:71px; }
  .title-lockup h1 { font-size:clamp(2.5rem,10.8vw,3rem); white-space:normal; text-wrap:balance; }
  .cover-footer { position:absolute; top:65px; right:1rem; bottom:auto; left:auto; width:180px; max-width:calc(100vw - 108px); margin:0; gap:.5rem; justify-content:flex-end; overflow:visible; }
  .cover-footer .professional-links { width:100%; max-width:100%; justify-content:flex-end; }
  .cover-copy { top:24svh; bottom:1rem; padding:48px 0 0; justify-content:flex-start; }
  .intro { width:85vw; max-width:85vw; inline-size:85vw; max-inline-size:85vw; }
  .intro { margin-top:1rem; font-size:1rem; line-height:1.5; }
  .portfolio-link-copy { gap:.35rem; }
  .portfolio-link-copy strong { font-size:1.45rem; }
  .portfolio-links { display:grid; width:calc(100vw - (var(--gutter) * 2)); max-width:calc(100vw - (var(--gutter) * 2)); inline-size:calc(100vw - (var(--gutter) * 2)); max-inline-size:calc(100vw - (var(--gutter) * 2)); margin-top:35px; gap:.65rem; }
  .portfolio-link { width:100%; min-height:84px; margin:0; padding:1rem; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.18); border-radius:16px; }
  .portfolio-link-copy { min-width:0; }
  .portfolio-link-actions,.portfolio-link>i { flex:0 0 auto; }
  .portfolio-link:first-child { border-top:1px solid rgba(255,255,255,.18); }
  .portfolio-link i { width:38px; height:38px; border-color:rgba(200,255,69,.42); }
  .professional-links a:not(.download-link)>svg { display:block; }
  .professional-links a span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .professional-links a { width:36px; min-height:36px; padding:0; justify-content:center; }
  .professional-links .resume-link>svg { display:none; }
  .professional-links .resume-link span { position:static; width:auto; height:auto; overflow:visible; clip:auto; }
  .professional-links .resume-link { width:auto; padding-inline:.7rem; }
  .professional-links .download-link { width:36px; padding:0; }
  .professional-links svg { width:15px; height:15px; }
  .cover-footer>small { display:none; }
}

@media (prefers-reduced-motion:reduce) {
  .console-cursor { animation:none; }
  .console-touch-ripple { display:none; }
}
