:root{--bg:#f7f4ec;--surface:#fffdf8;--text:#1f2a4d;--muted:#5e6684;--rule:#e4ddcc;--accent:#d98e1f;--accent-text:#9a5b00;--accent-soft:#f8e7c4;--hit:#f6deaa;--on-accent:#1f2a4d;--sans:"Sarabun", system-ui, -apple-system, "Segoe UI", sans-serif;--display:"Chakra Petch", "Sarabun", system-ui, sans-serif;--mono:"IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#121a33;--surface:#1a2447;--text:#f1ebdd;--muted:#a9b0c8;--rule:#2a3560;--accent:#f0a93b;--accent-text:#f0a93b;--accent-soft:#3a2f14;--hit:#4d3c16;--on-accent:#121a33}}:root[data-theme=dark]{--bg:#121a33;--surface:#1a2447;--text:#f1ebdd;--muted:#a9b0c8;--rule:#2a3560;--accent:#f0a93b;--accent-text:#f0a93b;--accent-soft:#3a2f14;--hit:#4d3c16;--on-accent:#121a33}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0;font-size:17px;line-height:1.6}a{color:inherit;text-decoration-color:var(--rule);text-underline-offset:3px}a:hover{color:var(--accent-text);text-decoration-color:var(--accent)}:focus-visible{outline:2px solid var(--accent-text);outline-offset:3px;border-radius:2px}.skip{background:var(--accent);color:var(--on-accent);z-index:10;padding:8px 14px;position:absolute;top:8px;left:-999px}.skip:focus{left:8px}.wrap{max-width:1120px;margin:0 auto;padding:0 28px}.layout{grid-template-columns:320px 1fr;gap:88px;padding:64px 0 40px;display:grid}.icon{flex:none;width:1.1em;height:1.1em;display:inline-flex}.icon svg{stroke-width:1.75px;width:100%;height:100%}.rail{align-self:start;position:sticky;top:56px}.rail .where{font-family:var(--mono);color:var(--muted);align-items:center;gap:6px;margin:0 0 20px;font-size:13px;display:flex}.rail h1{font-family:var(--display);letter-spacing:-.01em;margin:0 0 6px;font-size:clamp(2.1rem,3.8vw,2.7rem);font-weight:700;line-height:1.08}.rail .name-th{color:var(--muted);margin:0 0 14px;font-size:1.05rem}.rail h1 .nick{letter-spacing:0;color:var(--muted);white-space:nowrap;font-size:.45em;font-weight:400}.rail .role{font-family:var(--display);color:var(--accent-text);letter-spacing:.01em;margin:0 0 18px;font-size:1.2rem;font-weight:600}.rail .intro{color:var(--muted);margin:0 0 28px;font-size:1rem}.links{gap:4px;margin:0;padding:0;list-style:none;display:grid}.links a{justify-content:space-between;padding:9px 0;font-weight:500;text-decoration:none;display:flex}.links .lbl{align-items:center;gap:12px;display:inline-flex}.links .icon{color:var(--accent-text)}.links a span.arrow{color:var(--muted);transition:transform .2s}.links a:hover span.arrow{color:var(--accent-text);transform:translate(4px)}.theme{border:1px solid var(--rule);width:38px;height:38px;color:var(--muted);cursor:pointer;background:0 0;border-radius:50%;place-items:center;margin-top:26px;padding:0;display:grid}.theme .icon{width:1.15rem;height:1.15rem}.t-sun{display:none}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .t-moon{display:none}:root:not([data-theme=light]) .t-sun{display:inline-flex}}:root[data-theme=dark] .t-moon{display:none}:root[data-theme=dark] .t-sun{display:inline-flex}.theme:hover{color:var(--text);border-color:var(--muted)}section{margin-bottom:72px;scroll-margin-top:40px}h2{font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);align-items:center;gap:16px;margin:0 0 30px;font-size:.8rem;font-weight:500;display:flex}h2:before{content:"";background:var(--accent);border-radius:2px;flex:none;width:18px;height:3px}h2:after{content:"";background:var(--rule);flex:1;height:1px}.job{padding-bottom:38px}.job+.job{border-top:1px solid var(--rule);padding-top:38px}.when{font-family:var(--mono);color:var(--muted);padding-top:5px;font-size:.82rem;line-height:1.5}.org{flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 0 12px;display:flex}.org h3{font-family:var(--display);letter-spacing:0;margin:0;font-size:1.2rem;font-weight:600}.org .loc{color:var(--muted);align-items:center;gap:5px;font-size:.92rem;display:inline-flex}.org .loc .icon{width:.95em;height:.95em}.roles{border-left:2px solid var(--accent);gap:8px;margin:0 0 14px;padding:0 0 0 18px;list-style:none;display:grid}.roles li{flex-wrap:wrap;justify-content:space-between;gap:4px 16px;display:flex}.roles .title{color:var(--accent-text);font-weight:600}.roles .span{font-family:var(--mono);color:var(--muted);align-self:center;font-size:.78rem}.badge{font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em;background:var(--accent-soft);color:var(--accent-text);vertical-align:2px;border-radius:4px;margin-left:8px;padding:2px 8px;font-size:.68rem}.job ul.points{gap:9px;margin:0;padding-left:20px;display:grid}.job ul.points li{padding-left:2px}.job ul.points li::marker{color:var(--accent)}.job b{font-weight:600}.skills{gap:0;margin:0;display:grid}.skills>div{border-bottom:1px solid var(--rule);grid-template-columns:220px 1fr;gap:20px;padding:12px 0;display:grid}.skills>div:first-child{padding-top:0}.skills dt{color:var(--accent-text);align-items:flex-start;gap:9px;font-weight:600;display:flex}.skills dt .icon{margin-top:.24em}.skills dd{color:var(--text);margin:0}.edu{border-left:2px solid var(--accent);padding-left:18px}.edu-head{justify-content:space-between;align-items:baseline;gap:4px 16px;margin-bottom:4px;display:flex}.edu-head .when{white-space:nowrap;flex:none;padding-top:0}.edu h3{min-width:0;font-family:var(--display);margin:0;font-size:1.1rem;font-weight:600}.edu p{color:var(--muted);margin:0 0 4px}.edu p:first-of-type{color:var(--accent-text);font-weight:600}.timeline{margin:0 0 40px}.tl-row{grid-template-columns:124px 1fr;align-items:center;gap:14px;display:grid}.tl-head{height:22px}.tl-track{height:14px;position:relative}.tl-head .tl-track{height:22px}.tl-year{font-family:var(--mono);color:var(--muted);font-size:.72rem;position:absolute;top:0;transform:translate(-50%)}.tl-body{gap:8px;display:grid;position:relative}.tl-lines{pointer-events:none;position:absolute;inset:0 0 0 138px}.tl-line{background:var(--rule);width:1px;position:absolute;top:0;bottom:0}.tl-label{text-align:right;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:.82rem;overflow:hidden}.tl-bar{background:var(--accent);border-radius:4px;min-width:6px;height:100%;transition:filter .15s;position:absolute;top:0}.tl-bar:hover{filter:brightness(.9)}.tl-bar:focus-visible{outline-offset:2px}.hint{color:var(--muted);margin:-14px 0 22px;font-size:.88rem}.chip[data-hits]{text-decoration:underline dotted var(--accent);text-underline-offset:4px;cursor:pointer;border-radius:3px;text-decoration-thickness:1.5px}.chip[data-hits]:hover,.chip.on{color:var(--accent-text)}.job ul.points li,.proj{transition:background-color .2s,box-shadow .2s}.job ul.points li.hit,.proj.hit{background:var(--hit);box-shadow:-8px 0 0 var(--hit), 8px 0 0 var(--hit);border-radius:2px}.clamp-text.is-clamped{-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.hit .more{display:none}.more{font:inherit;color:var(--accent-text);cursor:pointer;text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:3px;background:0 0;border:0;margin-top:4px;padding:0;font-size:.88rem;font-weight:600;display:inline-block}.more:hover{text-decoration-color:var(--accent)}.more:after{content:"";border-bottom:2px solid;border-right:2px solid;width:6px;height:6px;margin:0 0 3px 7px;transition:transform .34s cubic-bezier(.2,.7,.2,1);display:inline-block;transform:rotate(45deg)}.more[aria-expanded=true]:after{transform:rotate(-135deg)translate(-2px,-2px)}.toolbar{justify-content:flex-end;margin:-14px 0 14px;display:flex}.more[hidden],.toolbar[hidden]{display:none}footer{border-top:1px solid var(--rule);color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding:28px 0 56px;font-size:.9rem;display:flex}.notfound{text-align:center;place-content:center;gap:12px;min-height:70vh;display:grid}.notfound h1{font-family:var(--display);margin:0;font-size:3rem}.reveal{opacity:0;transition:opacity .6s,transform .6s;transform:translateY(14px)}.reveal.in{opacity:1;transform:none}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transition:none;transform:none}.links a span.arrow,.tl-bar,.job ul.points li,.proj,.more:after{transition:none}}@media (width<=920px){.layout{grid-template-columns:1fr;gap:56px;padding-top:40px}.rail{position:static}}@media (width<=640px){body{font-size:16px}.wrap{padding:0 20px}.skills>div{grid-template-columns:1fr;gap:2px}.edu-head{flex-wrap:wrap}.tl-row{grid-template-columns:84px 1fr;gap:10px}.tl-lines{left:94px}.tl-label{font-size:.74rem}}@media print{:root{--bg:#fff;--surface:#fff;--text:#000;--muted:#444;--rule:#ccc;--accent:#9a5b00;--accent-text:#7a4700;--accent-soft:#f3e3c0}.theme,.links,.skip{display:none}.layout{grid-template-columns:1fr;gap:24px;padding-top:0}.rail{position:static}.reveal{opacity:1;transform:none}section{break-inside:avoid-page;margin-bottom:32px}.clamp-text.is-clamped{-webkit-line-clamp:unset;line-clamp:unset;display:block;overflow:visible}.more,.toolbar{display:none}}
