@font-face{font-family:"Smiley Sans";src:url("assets/fonts/SmileySans-Oblique.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
/* Smiley Sans is for headings and controls. Body text inherits each page's original reading font; print stays intact. */
@media screen{
  html{--studio-font:"Smiley Sans","Hiragino Sans","Yu Gothic","Microsoft YaHei",sans-serif}
  :is(h1,h2,h3,h4,h5,h6,.sec-title,.article-title,.bio-name,.wk-t,.ab-t,.ac-title,.ab-h,.stat-n,.journey-island,.journey-island *,.reader-island,.reader-island *,.studio-language,.studio-language *,button,button *,.about-links,.about-links *,.reader-ending,.reader-ending *,.lamp-caption,.lamp-caption *,.record-caption,.record-caption *,.reader-prop,.reader-prop *,.resume-tools,.resume-tools *,.toc,.toc *,.chip,.tag,.chapter-kicker,.scroll-indicator,.back-link,.all-link,.pj-links,.pj-links *){font-family:var(--studio-font)!important;font-synthesis:none}
  .home-copy h1{letter-spacing:-.035em;font-weight:400}
  .chapter-copy h2{letter-spacing:-.025em;line-height:1.16}
  .projects-copy h2{font-size:clamp(42px,4.8vw,74px)}
  .project-row h3{font-size:clamp(21px,1.85vw,27px);letter-spacing:0;line-height:1.25;margin-bottom:7px}
  .project-row p{font-size:13px;line-height:1.6;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  .chapter-intro,.biography{font-size:15px;line-height:1.85}
  .about-links a{font-size:14px}
  .education b{font-size:13px}.education span{font-size:11px}
  html body .article-title{text-wrap:balance;font-size:clamp(43px,5.6vw,80px);letter-spacing:-.025em;line-height:1.15;margin-bottom:22px}
  html body .article-p,html body .bio p{font-size:17px;line-height:1.95}
  .detail-sec{row-gap:46px}
  html body .ab-h{font-size:21px;line-height:1.5;margin-top:48px;margin-bottom:22px}
  html body .wk-t{font-size:22px;line-height:1.5}
  html body .wk-d{font-size:16px;line-height:1.95}
  .wk{padding-block:24px}
  .pj-meta .row,.pj-award{font-size:14px}.pj-meta b,.pj-links a{font-size:12px}
  .stat-n{font-size:38px}.stat-l{font-size:14px}
  .sec-sub,.ab-note{font-size:14px}.ab-t{font-size:19px}
  .sec-title{letter-spacing:-.02em}.ac-title{font-size:clamp(25px,2.6vw,37px)}
  html body.studio-report .stage-desc,html body.studio-report li,html body.studio-report .experience-note p,html body.studio-report .suggestion-note p{font-size:16px;line-height:1.95}
}
/* Flat amber control: always reachable, including before the journey starts. */
.studio-language{position:fixed;z-index:40;top:max(23px,env(safe-area-inset-top));right:max(30px,env(safe-area-inset-right));color:#dec198;font-size:14px;line-height:1.4;text-align:left}
.studio-language summary{list-style:none;display:flex;align-items:center;gap:12px;min-height:40px;padding:8px 13px;cursor:pointer;border:1px solid #c7af852a;border-radius:8px;background:#232720;box-shadow:0 4px 18px #1020140c;user-select:none}
.studio-language summary::-webkit-details-marker{display:none}.studio-language summary small{font-size:11px;letter-spacing:.08em;color:#a79d86}.studio-language summary i{font-style:normal;font-size:12px;color:#ac9675;transition:transform .2s}.studio-language[open] summary i{transform:rotate(180deg)}
.studio-language nav{position:absolute;right:0;top:calc(100% + 9px);display:grid;gap:3px;width:184px;padding:7px;border:1px solid #c7af852a;border-radius:10px;background:#232720;box-shadow:0 14px 36px #0a100f20}
.studio-language nav a{position:relative;display:block;padding:11px 35px 11px 13px;color:#d1c2a5;border-radius:5px;text-decoration:none;font-size:16px;line-height:1.4}
.studio-language nav a:hover,.studio-language nav a[aria-current]{color:#edc18a;background:#d9b27910}.studio-language nav a[aria-current]::after{content:"";position:absolute;right:15px;top:50%;width:5px;height:5px;border-radius:50%;background:#dfad6e}
.studio-language summary:focus-visible,.studio-language a:focus-visible{outline:2px solid #dfad6e;outline-offset:3px}
html[data-light=day] .studio-language{color:#394131}html[data-light=day] .studio-language summary{background:#daddc6;border-color:#4b5d362a}html[data-light=day] .studio-language summary small,html[data-light=day] .studio-language summary i{color:#6b735b}
/* The old in-island selector moves to the persistent corner control. */
.island-languages,.reader-languages{display:none}
@media screen and (max-width:1100px) and (min-width:801px){.project-row{padding-block:12px}.project-row h3{font-size:22px}.project-row p{font-size:12px}.chapter-intro,.biography{font-size:14px}}
@media screen and (max-width:800px){
  .studio-language{top:16px;right:16px}.studio-language summary{min-height:36px;padding:7px 10px;font-size:13px;gap:8px}
  .projects-copy h2{font-size:35px;margin:12px 0}.project-row{padding-block:9px}.project-row h3{font-size:18px;margin-bottom:4px}.project-row p{font-size:11px;line-height:1.5}.chapter-intro,.biography{font-size:13px;line-height:1.8}.chapter-intro{margin-bottom:12px}.about-links a{font-size:12px}.education b{font-size:12px}.education span{font-size:10px}
}
/* On phones the island uses two compact readouts beside the language button. */
@media(max-width:680px){
  .studio-language{right:12px;top:17px}.studio-language summary{gap:6px;padding-inline:9px}.studio-language summary small{display:none}
  .journey-island,.reader-island{left:12px;transform:none;top:14px;width:calc(100% - 122px);max-width:none;border-radius:23px}
  .journey-island{transform:translateY(-90px) scale(.92)}.journey-island.is-visible{transform:none}
  .journey-island.is-expanded,.reader-island[open]{width:calc(100% - 24px);top:64px}
  .island-summary{padding-inline:12px;gap:7px}.island-toggle{gap:7px}.island-meter{width:25px;font-size:12px}.island-meter small{font-size:7px}.island-current strong{font-size:11px}.island-current small{font-size:7px}.island-chevron{display:none}.island-next{width:78px;min-width:78px;padding-left:8px}.island-next b{font-size:10px}.island-next>small{font-size:7px}.island-next>span{gap:3px}
  .reader-island summary{padding:12px 97px 12px 13px;gap:8px}.reader-meter{font-size:11px}.reader-meter small{font-size:7px}.reader-status strong{font-size:11px}.reader-status small{font-size:7px}.reader-caret{display:none}.reader-next{right:9px;width:80px;padding-left:8px}.reader-next span{max-width:68px;font-size:10px}
}
@media screen and (max-width:520px){
  html body .article-title{text-wrap:balance;font-size:43px;line-height:1.16;margin-bottom:12px}.detail-sec{row-gap:30px}
  html body .article-p,html body .bio p{font-size:16px;line-height:1.9}
  html body .wk-t{font-size:20px}html body .wk-d{font-size:15px}.wk{padding-block:21px}html body .ab-h{font-size:20px;margin-top:36px}
  .pj-meta .row,.pj-award{font-size:13px}.stat-n{font-size:32px}.stat-l{font-size:13px}
}
@media screen and (max-width:800px) and (max-height:740px){.projects-copy h2{font-size:29px;margin:8px 0}.projects-copy .chapter-intro{font-size:11px;margin-bottom:8px}.project-row{padding-block:6px}.project-row h3{font-size:17px}.project-row p{font-size:10px;-webkit-line-clamp:1}.biography{font-size:12px;line-height:1.75}}
@media(prefers-reduced-motion:reduce){.studio-language summary i{transition:none}}
@media print{.studio-language{display:none}}

/* A transparent return at the top of the document; it scrolls away with the article. */
.studio-return{position:absolute;z-index:35;left:0;top:0;display:flex;align-items:center;gap:12px;min-height:68px;max-width:205px;padding:16px 22px 16px max(18px,env(safe-area-inset-left));border:0;border-radius:0;background:transparent;color:var(--ink);text-decoration:none;font:19px/1.3 var(--studio-font);box-shadow:none}
.studio-return span:first-child{font-size:30px;line-height:1;flex:none}.studio-return:hover{color:var(--accent,var(--orange));background:transparent}.studio-return:focus-visible{outline:2px solid #dfad6e;outline-offset:3px}
html[data-light=day] .studio-return{background:transparent;color:var(--ink)}
.has-studio-return .back-link,.has-studio-return .site-back{display:none}
.studio-back-edge{display:none}
@media(max-width:899px){
  .studio-back-edge{display:block;position:fixed;left:0;top:85px;bottom:0;width:24px;z-index:14;touch-action:pan-y pinch-zoom}
  .studio-back-edge>span{position:fixed;left:-34px;top:48%;width:38px;height:38px;display:grid;place-items:center;border:1px solid #c7af8540;border-radius:50%;background:#232720;color:#edc18a;font-size:22px;pointer-events:none;opacity:0;transform:translateX(var(--swipe,0px))}
  .studio-back-edge.is-tracking>span{opacity:1}
}
@media(min-width:681px) and (max-width:900px){.studio-return{max-width:148px;min-height:64px;font-size:18px;padding:14px 15px;gap:9px}.studio-return span:first-child{font-size:27px}.reader-island{width:340px}}
@media(max-width:680px){.studio-return{display:none}.has-studio-return .back-link,.has-studio-return .site-back{display:inline-block}}
@media print{.studio-return,.studio-back-edge{display:none}}

.studio-github{position:fixed;z-index:39;display:grid;place-items:center;background:#232720;color:#dec198;border:1px solid #c7af852a;border-radius:8px;transform-origin:center;text-decoration:none}
.studio-github svg{width:21px;height:21px;fill:currentColor;display:block}.studio-github:hover{color:#ffe0b7;border-color:#c7af8580}.studio-github:focus-visible{outline:2px solid #dfad6e;outline-offset:3px}
html[data-light=day] .studio-github{background:#daddc6;color:#394131;border-color:#4b5d362a}
@media(max-width:680px){.has-studio-github .journey-island,.has-studio-github .reader-island{width:calc(100% - 164px)}.has-studio-github .journey-island.is-expanded,.has-studio-github .reader-island[open]{width:calc(100% - 24px)}}
@media(max-width:360px){.has-studio-github .island-meter,.has-studio-github .reader-meter{display:none}.has-studio-github .island-next{width:60px;min-width:60px}.has-studio-github .reader-next{width:62px;right:8px}.has-studio-github .reader-island summary{padding-right:80px;padding-left:10px}.has-studio-github .island-summary{padding-inline:10px}.has-studio-github .island-current small{font-size:6px}}
@media print{.studio-github{display:none}}

@media screen and (max-width:680px){
 .studio-return{display:flex;min-height:50px;max-width:calc(100% - 168px);padding:12px 10px 10px max(12px,env(safe-area-inset-left));gap:6px;font-size:13px;white-space:nowrap}
 .studio-return span:first-child{font-size:21px}.studio-return span:last-child{overflow:hidden;text-overflow:ellipsis}
 .has-studio-return .reader-island{left:52px;transform:none}
 .has-studio-return .window{padding-top:108px}
 .has-studio-return .back-link,.has-studio-return .site-back{display:none}
 .studio-report.has-studio-return{padding-top:100px}
}

/* One compact top row: identical visible heights for reading, GitHub and language. */
@media screen{
 :root{--studio-control-height:40px;--studio-control-top:max(23px,env(safe-area-inset-top))}
 .studio-language,.journey-island,.reader-island{top:var(--studio-control-top)}
 .studio-language summary{box-sizing:border-box;height:var(--studio-control-height);min-height:0}
 .journey-island{height:var(--studio-control-height);border-radius:19px}
 .island-summary{height:38px;padding:4px 15px;gap:9px}.island-toggle{height:28px;gap:9px}
 .island-current{gap:2px}.island-current strong{font-size:11px}.island-current small{font-size:7px}
 .island-next{height:26px;gap:2px}.island-next>small{font-size:7px}.island-next b{font-size:10px}
 .island-track{top:38px;left:16px;right:16px}
 .journey-island.is-expanded{height:204px;border-radius:19px}
 .reader-island{border-radius:19px}
 .reader-island summary{box-sizing:border-box;height:38px;padding-block:4px}
 .reader-next{top:6px;height:26px}.reader-next small{margin-bottom:2px}
 .reader-status small{margin-top:1px}.reader-progress{position:absolute;top:38px;left:16px;right:16px;margin:0}
 .reader-island[open]{border-radius:19px}
 .ui-arrow{display:inline-block;width:1em;height:1em;vertical-align:-.12em;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
 .project-row>b{display:flex;align-items:center;justify-content:center}
}
@media screen and (max-width:800px){:root{--studio-control-height:36px;--studio-control-top:max(14px,env(safe-area-inset-top))}.island-summary,.reader-island summary{height:34px}.island-track,.reader-progress{top:34px}.reader-next{top:4px}}
@media screen and (max-width:680px){
 .studio-language{top:var(--studio-control-top)}
 .journey-island,.reader-island,.has-studio-github .journey-island,.has-studio-github .reader-island{top:var(--studio-control-top);left:12px;width:calc(var(--studio-tools-start,100vw - 152px) - 20px);border-radius:16px}
 .has-studio-return .reader-island{left:52px;width:calc(var(--studio-tools-start,100vw - 152px) - 60px)}
 .island-summary{padding:3px 9px;gap:5px}.island-toggle{gap:5px;height:28px}
 .island-meter,.has-studio-github .island-meter{display:flex;width:23px;font-size:11px}
 .island-current small,.reader-status small,.island-next>small{display:none}
 .island-current strong{font-size:11px}.island-next{width:62px;min-width:0;padding-left:7px;height:22px}
 .island-next b{font-size:10px}.island-next i{font-size:12px}
 .reader-island summary,.has-studio-github .reader-island summary{padding:3px 66px 3px 9px;gap:5px}
 .reader-meter,.has-studio-github .reader-meter{display:block;font-size:10px}.reader-status strong{font-size:10px}
 .reader-next,.has-studio-github .reader-next{right:7px;top:6px;width:55px;height:22px;padding-left:6px}
 .reader-next small{font-size:6px;margin-bottom:1px}.reader-next span{font-size:9px;max-width:47px}
 .studio-return{top:var(--studio-control-top);min-height:36px;height:36px;width:32px;max-width:32px;left:10px;padding:0;justify-content:center}
 .studio-return span:first-child{font-size:22px}.studio-return span:last-child{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .journey-island.is-expanded,.has-studio-github .journey-island.is-expanded,.reader-island[open],.has-studio-return .reader-island[open]{top:var(--studio-control-top);left:12px;width:calc(100% - 24px);z-index:45}
 .island-panel{padding-top:14px}.reader-island[open] .reader-status small{display:block}
}