@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
:root{color-scheme:dark;--bg:#0b1424;--panel:#111e33;--text:#f4f6fb;--muted:#a8b4c8;--blue:#7bacff;--line:#29364a;--font:'DM Sans',Arial,sans-serif;--heading:'Manrope',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--text);font:1rem/1.65 var(--font);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:5px}::selection{background:var(--blue);color:var(--bg)}.wrap{max-width:1280px;width:calc(100% - 112px);margin-inline:auto}.skip{position:fixed;top:8px;left:8px;background:var(--blue);color:var(--bg);padding:8px 16px;z-index:10;transform:translateY(-150%)}.skip:focus{transform:translateY(0)}.header{display:flex;justify-content:space-between;align-items:center;padding-block:28px;border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;gap:17px}.monogram{font:800 1.8rem/1 var(--heading);letter-spacing:-.12em}.monogram span{color:var(--blue);letter-spacing:0}.brand-name{font-size:.875rem;font-weight:600;letter-spacing:.1em}.header nav{display:flex;gap:34px;font-size:.95rem}.header nav a{color:var(--muted);transition:color .2s}.header nav a:hover{color:var(--text)}.hero{padding-block:78px 82px;display:grid;grid-template-columns:1.45fr 1fr;gap:85px;align-items:center}.eyebrow{display:flex;align-items:center;gap:12px;font-size:.8rem;font-weight:650;letter-spacing:.12em;color:var(--blue);margin:0 0 27px}.tiny-rule{width:25px;height:2px;background:var(--blue)}h1,h2,h3,p{margin-top:0}h1{font:750 clamp(2.8rem,5.3vw,4.8rem)/1.09 var(--heading);letter-spacing:-.065em;margin-bottom:26px}h1>span{color:var(--blue);white-space:nowrap}.hero-copy{color:var(--muted);max-width:460px;font-size:1.1rem;line-height:1.8;margin-bottom:30px}.button{display:inline-flex;padding:13px 22px;border:1px solid var(--blue);background:var(--blue);color:#0b1424;font-weight:650;font-size:.95rem;border-radius:4px;transition:background .2s,transform .2s}.button:hover{background:#a0c3ff;transform:translateY(-2px)}.identity{border:1px solid #35445c;background:linear-gradient(135deg,#15273f,#101c2f);padding:26px 29px 16px;position:relative;box-shadow:12px 12px 0 #101b2d}.identity-top,.identity-bottom{display:flex;justify-content:space-between;align-items:center;color:#b4c6e0;font-size:.75rem;letter-spacing:.08em}.identity-top{padding-bottom:24px;border-bottom:1px solid #35445c}.identity-name{font:800 clamp(2.3rem,4vw,3.7rem)/1.02 var(--heading);letter-spacing:-.04em;padding:31px 0}.identity-name span{color:var(--blue)}.identity-list>div{display:grid;grid-template-columns:70px 1fr;gap:16px;border-top:1px solid #35445c;padding:15px 0}.index-label{font-size:.75rem;letter-spacing:.12em;color:var(--blue);padding-top:4px}.identity-list p{line-height:1.5;font-size:.9rem;margin:0}.identity-bottom{border-top:1px solid #35445c;padding-top:13px;gap:15px;font-size:.7rem}.plus{font:400 1.7rem/1 var(--font);color:var(--blue)}.focus-strip{border-block:1px solid var(--line);background:#0e192b}.focus-inner{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-block:22px;font-size:.8rem;letter-spacing:.1em;font-weight:550;color:#bbc7d9}.focus-inner i{font-style:normal;color:#506781}.section{padding-block:92px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:36px}.section-heading .eyebrow{margin-bottom:19px}h2{font:650 clamp(2rem,3.1vw,2.8rem)/1.18 var(--heading);letter-spacing:-.055em;margin-bottom:0}h2 span{color:var(--muted)}.section-heading>p{color:var(--muted);font-size:.95rem;margin:0 0 5px}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.project-card{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#101b2d;transition:border-color .2s}.project-card:hover{border-color:#617594}.project-cover{min-height:250px;padding:27px 30px 22px;background:#2456a0;display:flex;flex-direction:column;justify-content:space-between;position:relative}.family .project-cover{background:#20394c}.cover-top{display:flex;justify-content:space-between;font-size:.75rem;letter-spacing:.1em;color:#d6e5ff}.family .cover-top{color:#c6dfec}.cover-title{font:800 clamp(1.65rem,2.6vw,2.3rem)/1.2 var(--heading);letter-spacing:-.035em;padding-block:28px}.cover-title span{color:#a9ceff}.family .cover-title span{color:#9ccedd}.feature-lines{display:flex;flex-wrap:wrap;gap:8px 20px;border-top:1px solid #ffffff38;padding-top:15px;font-size:.8rem;color:#e2ecfc}.project-body{padding:28px 30px 23px}.project-category{color:var(--blue);font-size:.75rem;letter-spacing:.08em;margin-bottom:11px}.family .project-category{color:#9ccedd}h3{font:650 1.45rem/1.3 var(--heading);letter-spacing:-.035em;margin-bottom:13px}.project-body>p:not(.project-category){color:var(--muted);font-size:1rem;line-height:1.7;min-height:82px}.text-button{display:flex;align-items:center;justify-content:space-between;gap:20px;background:none;color:var(--text);border:0;border-top:1px solid var(--line);padding:18px 0 0;width:100%;font-size:.95rem;cursor:pointer;font-weight:550;text-align:left}.text-button span{color:var(--blue);font-size:1.5rem;line-height:1}.text-button:hover{color:var(--blue)}.about{background:#101c2f;border-block:1px solid var(--line)}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.about h2{line-height:1.24}.about h2 span{color:var(--blue)}.about-copy p{color:var(--muted);margin-bottom:22px}.about-copy .lead{font-size:1.35rem;line-height:1.5;color:var(--text);letter-spacing:-.02em}.principles{display:flex;flex-wrap:wrap;gap:12px 20px;border-top:1px solid var(--line);padding-top:22px;font-size:.875rem;font-weight:550}.closing{padding-block:70px}.closing .eyebrow{margin-bottom:20px}.closing-title{font:650 clamp(1.7rem,2.5vw,2.2rem)/1.4 var(--heading);letter-spacing:-.04em;margin-bottom:23px}.closing-title span{color:var(--muted)}.closing .text-button{width:max-content;border:0;padding:0;gap:25px}.footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:24px;padding-block:27px;font-size:.8rem;color:var(--muted)}.footer .brand{color:var(--text)}.footer .monogram{font-size:1.4rem}.footer>a:last-child{white-space:nowrap}.footer>a:last-child:hover{color:var(--text)}dialog{color:var(--text);background:#111e33;border:1px solid #445672;border-radius:8px;padding:0;max-width:640px;width:calc(100% - 32px);max-height:85dvh;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#030a16c9;backdrop-filter:blur(5px)}.dialog-inner{padding:30px 35px}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.dialog-head .eyebrow{margin:0}.close-button{background:none;color:var(--text);border:1px solid var(--line);border-radius:4px;min-width:42px;min-height:42px;font-size:1.7rem;cursor:pointer}.close-button:hover{background:#22314a}dialog h2{margin:25px 0 18px}.dialog-intro{font-size:1.1rem;color:var(--muted)}.detail-block{padding-block:20px;border-top:1px solid var(--line)}.detail-block h3{font-size:1.05rem;margin-bottom:9px}.detail-block p{margin:0;color:var(--muted)}.dialog-footnote{margin:7px 0 0;color:#a1bbdf;border-left:2px solid var(--blue);padding-left:15px;font-size:.875rem}body.dialog-open{overflow:hidden}
@media(min-width:1450px){.hero{padding-block:100px}.hero h1{font-size:5.5rem}}
@media(max-width:1050px){.wrap{width:calc(100% - 64px)}.hero{gap:40px;padding-block:60px}.hero h1{font-size:clamp(2.6rem,5.4vw,4rem)}.identity{padding:23px}.identity-name{font-size:3rem}.identity-list>div{grid-template-columns:50px 1fr;gap:10px}.identity-bottom{font-size:.65rem;letter-spacing:.01em}.focus-inner{gap:15px;font-size:.7rem;letter-spacing:.07em}.section{padding-block:70px}.section-heading>p{max-width:280px}.about-grid{gap:40px}.feature-lines{gap:7px 14px}.project-cover,.project-body{padding-inline:24px}.footer>span{max-width:240px;text-align:center}}
@media(max-width:720px){.wrap{width:calc(100% - 40px)}.header{padding-block:22px}.brand-name{display:none}.header nav{gap:25px;font-size:.875rem}.hero{grid-template-columns:1fr;gap:40px;padding-block:47px}.hero h1{font-size:clamp(2.7rem,9.1vw,4.5rem)}.hero .eyebrow{font-size:.75rem;margin-bottom:23px}.hero-copy{font-size:1rem;max-width:500px}.identity{max-width:500px;width:100%;padding:22px 25px}.identity-name{font-size:3.2rem}.identity-list{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.identity-list>div{display:block}.identity-list>div:last-child{grid-column:1/-1;display:flex;gap:30px;align-items:baseline}.identity-list>div:last-child p br{display:none}.identity-list>div:last-child p br::after{content:' '}.identity-list p{margin-top:5px}.identity-bottom{font-size:.68rem}.focus-inner{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;padding-block:20px;font-size:.72rem}.focus-inner i{display:none}.section{padding-block:54px}.section-heading{display:block;margin-bottom:28px}.section-heading>p{margin-top:22px;max-width:none}.project-grid{grid-template-columns:1fr;gap:24px}.project-cover{min-height:245px}.cover-title{font-size:clamp(1.65rem,6.5vw,2.4rem)}.project-body>p:not(.project-category){min-height:0}.about-grid{grid-template-columns:1fr;gap:27px}.about-copy .lead{font-size:1.25rem}.principles{gap:10px 16px}.closing{padding-block:50px}.footer{flex-wrap:wrap;gap:20px}.footer>span{order:3;max-width:none;width:100%;text-align:left;font-size:.75rem}.footer .brand{gap:12px}.dialog-inner{padding:22px}.dialog-head .eyebrow{font-size:.7rem}dialog h2{font-size:1.9rem}.dialog-intro{font-size:1rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Simpler personal introduction; retain the existing visual design. */
.screenshot-cover{background:#162941!important;height:330px;padding:22px 26px 17px!important;gap:14px;overflow:hidden;justify-content:flex-start}
.screenshot-button{display:block;flex:1;min-height:0;width:100%;overflow:hidden;background:#0b1725;border:1px solid #4c6078;border-radius:5px;cursor:pointer;padding:0;box-shadow:0 10px 30px #0005}
.screenshot-button img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 12%;transition:transform .2s}
.screenshot-button:hover img{transform:scale(1.025)}
.screenshot-caption{color:#bac9de;font-size:.8rem;line-height:1.4}
.dialog-screenshot{margin:22px 0 28px;padding:14px;background:#0b1725;border:1px solid var(--line);border-radius:5px}
.dialog-screenshot img{display:block;max-width:100%;width:300px;height:auto;margin:auto;border-radius:3px}
.dialog-screenshot figcaption{font-size:.8rem;color:var(--muted);text-align:center;margin-top:12px}
.family .project-cover{min-height:330px}
.hero h1{font-size:clamp(4rem,7vw,6.5rem);line-height:1.05;letter-spacing:-.055em}
.identity-list>div{grid-template-columns:85px 1fr;padding-block:23px}
.identity-list p{font-size:1rem}
.identity-list>div:first-child{border-top:0}
.projects{border-top:1px solid var(--line)}
.about-copy p:last-child{margin-bottom:0}.contact{display:flex;align-items:center;gap:20px;border-top:1px solid var(--line);padding-top:22px}.contact span{color:var(--blue);font-size:.75rem;font-weight:650;letter-spacing:.12em}.contact a{font-weight:600;text-underline-offset:4px}.contact a:hover{text-decoration:underline;color:var(--blue)}
.footer{margin-top:35px}
@media(max-width:720px){.hero h1{font-size:clamp(3.8rem,14vw,6rem)}.identity-list>div{padding-block:18px}.identity-list{grid-template-columns:1fr}.identity-list>div{display:grid;grid-template-columns:90px 1fr;gap:12px}.identity-list>div:last-child{display:grid;gap:12px;align-items:start}.identity-list>div:last-child p br{display:block}.identity-list>div:last-child p br::after{content:none}.identity-list p{margin-top:0;font-size:.95rem}}