:root{--ink: #000;--paper: #fff;--b: 5px}*{box-sizing:border-box;margin:0}html,body,#root{height:100%}body{background:var(--ink);color:var(--ink);font-family:Zen Kaku Gothic New,system-ui,sans-serif;font-weight:700;overflow:hidden}h1,h2,h3,.sfx,.nav button{font-family:Dela Gothic One,Zen Kaku Gothic New,sans-serif;font-weight:400}a{color:inherit}:focus-visible{outline:4px solid var(--paper);outline-offset:3px}.panel{position:relative;background:var(--paper);border:var(--b) solid var(--ink);box-shadow:0 0 0 3px var(--paper);padding:clamp(14px,2vw,28px);overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:12px}.fill-0{background:var(--paper) radial-gradient(var(--ink) 28%,transparent 30%) 0 0 / 9px 9px}.fill-1{background:repeating-conic-gradient(var(--ink) 0 2deg,var(--paper) 2deg 6deg)}.fill-2{background:var(--ink);color:var(--paper)}.fill-3{background:var(--paper) repeating-linear-gradient(135deg,var(--ink) 0 2px,transparent 2px 9px)}.sfx{font-size:clamp(1.4rem,4vw,3.2rem);background:var(--paper);padding:4px 14px;border:4px solid var(--ink);transform:rotate(-4deg);align-self:center;text-align:center}.sfx.big{font-size:clamp(2.5rem,8vw,6rem)}.intro{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--ink);z-index:10;display:grid;place-items:center;overflow:hidden}.intro-grid{width:100%;height:100%;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:10px;padding:10px}.intro .panel{align-items:center;padding:6px}.intro-title{position:absolute;font-size:clamp(2rem,9vw,7rem);color:var(--ink);background:var(--paper);border:var(--b) solid var(--ink);box-shadow:10px 10px 0 var(--ink),10px 10px 0 3px var(--paper);padding:.1em .4em;transform:rotate(-3deg);text-align:center}.skip{position:absolute;right:16px;bottom:16px;background:var(--paper);border:3px solid var(--ink);font:inherit;padding:8px 14px;cursor:pointer}.skip-link{position:fixed;left:8px;top:-60px;z-index:20;background:var(--paper);border:3px solid var(--ink);padding:8px 14px}.skip-link:focus{top:8px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.book{height:100vh;height:100dvh;display:flex;flex-direction:column;gap:12px;padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}.stage{flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:none}main{min-height:100%;display:flex}.page{flex:1;min-height:520px;display:grid;gap:12px;padding:4px}.cover{grid-template:"t t b" 3fr "k s s" 2fr / 1.1fr 1fr 1fr}.contact{grid-template:"e e" 3fr "l l" 2fr / 1fr 1fr}.p-title{grid-area:t}.p-bubble{grid-area:b}.p-sfx{grid-area:k}.p-skills{grid-area:s}.p-bio{grid-area:a}.p-end{grid-area:e}.p-links{grid-area:l;flex-direction:row;flex-wrap:wrap;align-items:center}.p-title h1{font-size:clamp(2.2rem,8vw,6.5rem);line-height:1;overflow-wrap:anywhere}.role{font-size:clamp(1rem,2.4vw,1.8rem)}h2{font-size:clamp(1.6rem,4vw,3rem)}h3{font-size:clamp(1.1rem,2.4vw,1.8rem)}p{font-size:clamp(.95rem,1.6vw,1.2rem);line-height:1.6;max-width:62ch}.bubble{background:var(--paper);border:4px solid var(--ink);border-radius:50%/40%;padding:1.4em;text-align:center;font-size:clamp(1rem,1.8vw,1.4rem);position:relative}.bubble:after{content:"";position:absolute;left:18%;bottom:-22px;border:14px solid transparent;border-top:22px solid var(--ink);border-bottom:0}.tbc{font-size:clamp(2.4rem,9vw,7rem);background:var(--paper);border:var(--b) solid var(--ink);padding:.15em .4em;align-self:center;transform:rotate(-2deg);text-align:center}.tags{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}.tags li{border:3px solid currentColor;background:var(--paper);color:var(--ink);padding:3px 10px}.btn{display:inline-flex;align-items:center;align-self:flex-start;background:var(--ink);color:var(--paper);text-decoration:none;padding:10px 18px;border:3px solid var(--ink);overflow-wrap:anywhere}.btn.alt{background:var(--paper);color:var(--ink)}.nav{display:flex;justify-content:center;gap:8px}.nav button{background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:0 0 0 2px var(--paper);padding:8px 16px;cursor:pointer;font-size:.95rem}.nav button.on{background:var(--ink);color:var(--paper);border-color:var(--paper)}.nav button:disabled{opacity:.35;cursor:default}.hint{display:none;color:var(--paper);text-align:center;font-size:.8rem}@media (hover: hover){.btn:hover{background:var(--paper);color:var(--ink)}.btn.alt:hover{background:var(--ink);color:var(--paper)}.nav button:not(:disabled):not(.on):hover{background:var(--ink);color:var(--paper);border-color:var(--paper)}}@media (pointer: coarse){.nav button,.btn,.skip{min-height:44px;min-width:44px}.hint{display:block}}@media (max-width: 1023px){.cover{grid-template:"t t" 3fr "b k" 2fr "s s" 1.4fr / 1fr 1fr}}@media (max-width: 639px){.page{display:flex;flex-direction:column;min-height:0}.panel{min-height:150px;flex-shrink:0}.p-sfx{min-height:110px}.intro-grid{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);gap:6px;padding:6px}.nav{gap:4px}.nav button{flex:1;padding:8px 2px;font-size:.72rem;box-shadow:none}.nav button:first-child,.nav button:last-child{flex:0 0 44px}.bubble{border-radius:40px}}@media (max-height: 480px) and (orientation: landscape){.book{gap:6px}.p-title h1{font-size:2rem}.panel{padding:10px}.nav button{padding:4px 10px}.hint{display:none}}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}.progress{position:fixed;top:0;left:0;right:0;height:6px;background:var(--paper);transform-origin:0 50%;z-index:8}.flow{align-content:start;grid-auto-rows:auto}.exp,.skills,.certs{grid-template-columns:repeat(2,1fr)}.projects{grid-template-columns:repeat(3,1fr)}.chapter,.span2{grid-column:1 / -1}.chapter{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}.meta{font-size:.95rem;line-height:1.4}.log{padding-left:1.2em;display:grid;gap:8px;line-height:1.5;font-size:clamp(.9rem,1.5vw,1.1rem)}.log li::marker{content:"■  ";font-size:.7em}.badge{align-self:flex-start;background:var(--ink);color:var(--paper);padding:2px 10px}@media (max-width: 1023px){.projects{grid-template-columns:repeat(2,1fr)}}@media (max-width: 639px){.nav{overflow-x:auto;justify-content:flex-start;scrollbar-width:none}.nav button{flex:0 0 auto;padding:8px 14px;font-size:.8rem;white-space:nowrap}.nav button:first-child,.nav button:last-child{display:none}.chapter{flex-direction:row}}.meta.live{display:flex;align-items:center;gap:8px}.dot{width:10px;height:10px;border-radius:50%;background:currentColor;animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.6);opacity:.4}}.btn:hover,.nav button:hover{transform:translate(-2px,-2px) rotate(-1deg)}.btn,.nav button{transition:transform .15s}.btn:disabled{opacity:.4;cursor:not-allowed}@media (prefers-reduced-motion: reduce){.dot{animation:none}}.p-links{flex-direction:column;align-items:flex-start;gap:14px}.actions{display:flex;flex-wrap:wrap;gap:10px}button.btn{font:inherit;cursor:pointer}.msg{text-decoration:none;color:var(--ink);cursor:pointer;align-items:center}.msg .tbc{transition:transform .2s,background .2s,color .2s}.arrow{display:inline-block;animation:nudge 1.2s ease-in-out infinite}@keyframes nudge{50%{transform:translate(.2em)}}@media (hover: hover){.msg:hover .tbc{background:var(--ink);color:var(--paper);transform:rotate(1deg) scale(1.04)}}.chips li.chip{display:flex;align-items:center;gap:8px;padding:6px 12px;animation:pop .45s both;animation-delay:calc(var(--i) * 45ms);transition:transform .15s,background .15s,color .15s,box-shadow .15s}.chip svg{width:22px;height:22px;fill:currentColor;transition:transform .4s}.glyph{display:inline-grid;place-items:center;min-width:22px;height:22px;font-size:.72rem}@keyframes pop{0%{opacity:0;transform:scale(.6) rotate(-8deg)}}@media (hover: hover){.chip:hover{background:var(--ink)!important;color:var(--paper)!important;transform:translateY(-4px) rotate(-2deg);box-shadow:4px 4px 0 var(--ink)}.chip:hover svg{transform:rotate(360deg) scale(1.2)}}.proj .shot{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;display:grid;place-items:center;background:var(--paper) repeating-conic-gradient(var(--ink) 0 2deg,var(--paper) 2deg 6deg);opacity:0;transform:scale(1.06);transition:opacity .25s,transform .25s;pointer-events:none}.proj .shot img{width:100%;height:100%;object-fit:cover;display:block}.proj .btn,.proj .peek{position:relative;z-index:2}.proj .peek{align-self:flex-start;font:inherit;background:var(--paper);color:var(--ink);border:3px solid var(--ink);padding:6px 12px;cursor:pointer}.hoverhint{display:none;font-size:.8rem}.proj.open .shot{opacity:1;transform:none}@media (hover: hover){.hoverhint{display:block}.peek{display:none}.proj:hover .shot,.proj:focus-within .shot{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.chips li.chip,.arrow{animation:none}.proj .shot,.chip,.chip svg,.msg .tbc{transition:none}}.p-stats{grid-area:m;flex-direction:row;align-items:stretch;gap:0;padding:0}.stat{flex:1;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:12px 16px;border-right:3px solid var(--ink)}.stat:last-child{border-right:0}.stat b{font-family:Dela Gothic One,sans-serif;font-weight:400;font-size:clamp(1.8rem,4.2vw,3.4rem);line-height:1}.stat span{font-size:clamp(.75rem,1.2vw,1rem);line-height:1.3}.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}.fill-2 .btn{border-color:var(--paper)}.word{display:inline-block;white-space:nowrap;margin-right:.28em}.ch{display:inline-block}.chips.big li.chip{font-size:clamp(.9rem,1.4vw,1.1rem);padding:8px 14px}.chips.big .chip svg{width:26px;height:26px}.p-sfx.fill-1{background:var(--paper)}.p-sfx:before{content:"";position:absolute;top:-50%;right:-50%;bottom:-50%;left:-50%;background:repeating-conic-gradient(var(--ink) 0 2deg,var(--paper) 2deg 6deg);animation:spin 60s linear infinite}.p-sfx .sfx{position:relative;z-index:1}@keyframes spin{to{transform:rotate(360deg)}}@media (min-width: 1024px){.cover{grid-template-areas:"t t b" "k m m" "k s s";grid-template-columns:1.1fr 1fr 1fr;grid-template-rows:minmax(0,2.2fr) minmax(0,1fr) minmax(0,1fr);height:max(600px,calc(100dvh - 100px));min-height:0}}@media (max-width: 1023px){.cover{grid-template:"t t" 3fr "b k" 2fr "m m" 1.2fr "s s" 1.4fr / 1fr 1fr}}@media (max-width: 639px){.p-stats{flex-direction:column}.stat{border-right:0;border-bottom:3px solid var(--ink)}.stat:last-child{border-bottom:0}}@media (prefers-reduced-motion: reduce){.p-sfx:before{animation:none}}@media (min-width: 1024px){.p-title h1{font-size:clamp(2.2rem,6vw,5.2rem)}.p-stats .stat b{font-size:clamp(1.6rem,3.4vw,2.8rem)}}