@font-face{font-family:Julio Roboto;src:url(/fonts/Roboto-variable.ttf) format("truetype");font-style:normal;font-weight:100 900;font-display:block}:root{font-family:Julio Roboto,sans-serif;font-synthesis:none;font-optical-sizing:none;color:#080808;background:#fff;--text-muted: #51545b;--link: #1a212b}*{box-sizing:border-box}body{margin:0;min-width:320px;-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0}a{color:inherit;text-decoration-thickness:1.5px;text-underline-offset:4px}a:hover{color:#38566e}button{font:inherit;cursor:pointer}:focus-visible{outline:3px solid #315f94;outline-offset:5px}h1:focus,#main:focus{outline:none}.container{width:calc(100% - 152px);max-width:1384px;margin-inline:auto}.skip-link{position:absolute;left:12px;top:-80px;z-index:10;padding:12px;background:#fff}.skip-link:focus{top:8px}.preview-caption{position:absolute;top:5px;left:12px;font-size:13px;line-height:16px;color:#343434}.site-header{display:flex;align-items:center;justify-content:space-between;height:48px;margin-top:38px}.site-name{font-size:40px;line-height:48px;font-weight:700;color:#191919;text-decoration:none;margin-left:-6px;position:relative;top:1px}.site-header nav{display:flex;align-items:center;gap:44px;padding-top:8px;margin-right:4px}.site-header nav a:last-child{margin-left:16px}.site-header nav a{font-size:19px;line-height:24px;color:#111;text-decoration:none;white-space:nowrap}.site-header nav a:hover,.site-header nav a[aria-current]{text-decoration:underline}.welcome{margin-top:33px;margin-left:-1px}.welcome h1{font-size:68.5px;line-height:83px;font-weight:700;color:#141414;position:relative;left:-1px;top:-1px}.intro{font-size:27.5px;line-height:38px;font-weight:380;color:#424348;margin-top:6px;margin-left:1px}.home-piano{margin-top:40px}.section-heading{position:relative}h2{font-size:46px;line-height:55px;font-weight:675}.section-heading h2{margin-left:-1px}.section-support{font-size:23.5px;line-height:29px;color:#484a50;margin-top:3px}.browse-link{position:absolute;right:-6px;top:40px;display:flex;align-items:center;gap:6px;font-size:24px;line-height:29px;color:var(--link)}.browse-link:after{content:"";position:absolute;left:0;right:0;bottom:1px;border-bottom:1.5px solid currentColor}.browse-link{text-decoration:none}.piano-grid{display:grid;grid-template-columns:443fr 429fr 442fr;gap:35px;margin-top:29px}.entry-preview{min-width:0}.player{position:relative;width:100%;aspect-ratio:443 / 237;background:#000;overflow:hidden}.piano-grid .player{aspect-ratio:auto;height:clamp(160px,calc((100vw - 222px) / 1314 * 237),237px)}.player video{display:block;width:100%;height:100%;object-fit:contain;background:#000}.play-excerpt{position:absolute;top:0;right:0;bottom:0;left:0;border:0;background:transparent;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:18px;gap:0}.play-disc{width:78px;height:78px;border-radius:50%;border:2px solid #b4b4b4;background:#000000bf;display:flex;align-items:center;justify-content:center}.play-disc svg{margin-left:5px}.play-label{font-size:18px;line-height:24px;font-weight:700;text-shadow:0 1px 3px #000}.play-excerpt:hover .play-disc{background:#000000eb;border-color:#fff}.play-excerpt:focus-visible{outline-offset:-6px}.duration{position:absolute;bottom:8px;right:8px;font-size:16px;line-height:23px;color:#fff;padding:1px 8px;border-radius:4px;background:#000000e0;pointer-events:none}.demo-badge{position:absolute;top:8px;left:8px;right:8px;width:fit-content;max-width:calc(100% - 16px);font-size:12px;line-height:18px;color:#fff;background:#000000e0;padding:3px 6px;pointer-events:none}.format-label{font-size:18.5px;line-height:23px;color:var(--text-muted);margin-top:11px;position:relative;top:1px}.entry-preview h3,.entry-preview h2{font-size:28.5px;line-height:34px;font-weight:675;margin-top:5px;position:relative;top:1px}.entry-summary{font-size:20.8px;line-height:29px;font-weight:380;color:var(--text-muted);margin-top:6px;position:relative;top:-1px}.read-post{display:inline-block;font-size:23px;line-height:29px;color:var(--link);margin-top:9px}.entry-preview:not(:first-child) .read-post{margin-top:11px}.other-interests{margin-top:59px;margin-left:-2px}.other-interests .section-support{margin-top:1px}.below-reference{margin-top:30px}.text-link,.back-link{display:inline-block;font-size:21px;line-height:29px;color:var(--link)}.hobby-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:35px;margin-top:38px}.hobby-list h3{font-size:28.5px;line-height:34px}.hobby-list p{font-size:21px;line-height:29px;color:var(--text-muted);margin-top:8px}.home-coding{margin-top:72px}.home-coding .text-link{margin-top:18px}.site-footer{padding-block:70px 35px;font-size:16px;line-height:24px;color:var(--text-muted)}.site-footer p{margin-top:18px}.supporting-view{margin-top:55px}.supporting-view h1{font-size:56px;line-height:1.2}.page-intro{font-size:28px;line-height:38px;margin-top:20px;color:#424348;max-width:950px}.content-note{margin-block:24px;font-size:18px;line-height:28px;color:var(--text-muted);max-width:850px}.entry-meta{font-size:16px;line-height:24px;color:var(--text-muted);margin-top:12px}.collection-grid{margin-top:42px}.post-view,.narrow-view{max-width:850px}.post-view .back-link{margin-bottom:24px}.post-view .player{margin-top:30px;aspect-ratio:16 / 9}.post-body p{margin-block:28px;font-size:21px;line-height:32px}.post-view>p:last-child{margin-top:20px}.project-list{display:grid;gap:38px;margin-top:48px}.project-list h2,.hobby-list h2{font-size:32px;line-height:40px}.project-list p{margin-top:10px;font-size:21px;line-height:29px;color:var(--text-muted)}.media-error{font-size:16px;line-height:24px;padding-top:8px}.media-error button{margin-left:8px}@media(max-width:1199px){.container{width:calc(100% - 80px)}.site-header nav{gap:25px}.site-header nav a:last-child{margin-left:0}.welcome h1{font-size:60px;line-height:74px}.intro{max-width:840px;font-size:25px;line-height:35px}.desktop-break{display:none}.intro span:first-child:after{content:" "}h2{font-size:40px;line-height:49px}.browse-link{font-size:20px;right:0;top:42px}.piano-grid{gap:24px}.piano-grid .player{height:max(155px,calc((100vw - 128px) / 3 / 1.87))}.entry-preview h3,.entry-preview h2{font-size:25px;line-height:31px}.entry-summary{font-size:19px;line-height:27px}}@media(max-width:899px){.site-header{height:auto;align-items:flex-start;flex-direction:column;gap:14px}.site-header nav{gap:8px 28px;flex-wrap:wrap;padding:0}.site-header nav a{padding-block:8px}.section-heading{display:flex;flex-direction:column;gap:16px}.browse-link{position:relative;top:auto;right:auto;align-self:flex-start}.piano-grid{grid-template-columns:1fr;max-width:650px;gap:42px}.piano-grid .player{height:auto;aspect-ratio:443 / 237}.entry-summary{max-width:550px}.other-interests{margin-top:56px}}@media(max-width:599px){.container{width:calc(100% - 40px)}.preview-caption{left:20px;top:8px;font-size:11px;line-height:15px;max-width:calc(100% - 40px)}.site-header{margin-top:42px;gap:10px}.site-name{margin-left:0;font-size:34px;line-height:41px}.site-header nav{column-gap:22px;row-gap:0}.site-header nav a{font-size:16px;line-height:24px;padding-block:10px}.welcome{margin-top:30px;margin-left:0}.welcome h1{font-size:44px;line-height:54px}.intro{margin:14px 0 0;font-size:21px;line-height:30px}.home-piano{margin-top:40px}h2{font-size:32px;line-height:40px}.section-heading h2{margin:0}.section-support{font-size:19px;line-height:27px;margin-top:8px}.browse-link{font-size:19px;line-height:29px;padding-block:6px}.piano-grid{margin-top:22px;gap:38px}.entry-preview h3,.entry-preview h2{font-size:26px;line-height:33px}.entry-summary{font-size:19px;line-height:27px}.read-post{font-size:20px;line-height:29px;padding-block:5px}.play-disc{width:64px;height:64px}.play-label{font-size:16px}.other-interests{margin-left:0}.other-interests .section-support{margin-top:8px}.hobby-list{grid-template-columns:1fr;gap:30px}.home-coding{margin-top:50px}.supporting-view{margin-top:38px}.supporting-view h1{font-size:40px;line-height:49px}.page-intro{font-size:22px;line-height:31px}.project-list h2,.hobby-list h2{font-size:28px;line-height:35px}.site-footer{padding-top:52px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}}
