:root{font-family:Segoe UI,Microsoft YaHei,Arial,sans-serif;color:#292c25;background:#f2efe6;font-synthesis:none;-webkit-font-smoothing:antialiased;font-weight:400}*{box-sizing:border-box}body{margin:0;min-width:320px}button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid #b64b37;outline-offset:5px}button:hover{color:#a64734}.page{min-height:100svh;position:relative;display:flex;flex-direction:column;padding:38px 46px 32px}.masthead,footer{display:flex;align-items:center;justify-content:space-between;gap:20px}.wordmark{font-size:17px;letter-spacing:.25em}.languages{display:flex;gap:17px;align-items:center}.languages button{font-size:12px;letter-spacing:.06em;min-width:32px;min-height:44px;color:#73756c;border-bottom:1px solid transparent}.languages button[aria-pressed=true]{color:#292c25;border-bottom-color:#b64b37}.composition{position:relative;flex:1;min-height:540px;margin:0 auto;width:min(1160px,100%);height:calc(100svh - 245px)}.artwork{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.caption{position:absolute;left:68%;top:76%;max-width:32%;pointer-events:none}.caption h1{font-size:clamp(23px,2.25vw,34px);line-height:1.5;font-weight:350;letter-spacing:.12em;margin:0 0 10px;text-wrap:balance}.caption p{font-family:Georgia,SimSun,serif;font-size:12px;letter-spacing:.2em;margin:0}.experience{position:relative;display:flex;justify-content:space-between;align-items:center;gap:24px;width:min(1160px,100%);margin:12px auto 30px}.hint{font-size:11px;letter-spacing:.1em;color:#797b71;margin:0;line-height:1.7}.state-toggle{display:flex;align-items:center;gap:22px;font-size:12px;letter-spacing:.09em;min-height:44px;flex-shrink:0}.state-toggle span{color:#b64b37;font-size:18px}.signature{font-size:15px;letter-spacing:.2em}.tagline{font-size:13px;letter-spacing:.13em;line-height:1.6;text-align:right}.state-panel{width:min(760px,100%);align-self:flex-end;background:#eae7dd;border:1px solid #d9d6cb;padding:23px 26px;margin:0 0 30px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;color:#6c6e64;font-size:11px;letter-spacing:.05em}.panel-heading p{margin:0}.panel-heading button{min-height:44px;min-width:44px}.mood-options{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px}.mood-options button{text-align:left;padding:15px 10px;line-height:1.6;font-size:13px;border-bottom:1px solid #c9c7bb;min-height:70px}.mood-options button[aria-pressed=true]{border-color:#b64b37;background:#f2efe6}.option-number{display:block;font-size:10px;letter-spacing:.1em;color:#898a7d;margin-bottom:6px}.mood-options button[aria-pressed=true] .option-number{color:#b64b37}.state-description{font-size:12px;line-height:1.8;margin:22px 0 12px;color:#64675d}.actions{display:flex;flex-wrap:wrap;gap:10px 25px}.actions button{font-size:12px;min-height:44px;border-bottom:1px solid #c9c7bb}.actions button:first-child{color:#a64734}footer{margin-top:auto}html[lang=en] .caption h1,html[lang=id] .caption h1{letter-spacing:.015em;font-family:Georgia,Times New Roman,serif}html[lang=en] .tagline,html[lang=id] .tagline{font-size:12px;letter-spacing:.02em}@media(min-width:1500px){.composition{width:min(1300px,100%);min-height:650px}.page{padding:42px 48px 40px}.experience{width:min(1300px,100%)}}@media(max-width:700px){.page{padding:20px 23px 23px}.wordmark{font-size:14px}.languages{gap:8px}.languages button{font-size:11px}.composition{min-height:430px;height:calc(100svh - 240px);flex:none}.artwork{top:12px;height:77%;width:142%;left:-13%}.caption{left:36%;top:78%;max-width:64%;padding-right:5px}.caption h1{font-size:24px;letter-spacing:.08em;margin-bottom:9px;overflow-wrap:break-word}.caption p{font-size:11px}.experience{flex-direction:column;align-items:flex-start;gap:10px;margin:10px auto 24px}.hint{font-size:10px;max-width:280px}.state-toggle{font-size:11px;gap:18px}.state-panel{padding:14px 16px;margin-bottom:25px}.mood-options{grid-template-columns:repeat(2,1fr);gap:8px}.mood-options button{min-height:69px}.panel-heading{font-size:10px}.actions{gap:5px 20px}.signature{font-size:12px;letter-spacing:.12em}.tagline{font-size:11px;max-width:49%}html[lang=en] .tagline,html[lang=id] .tagline{font-size:10px}}@media(max-width:380px){.page{padding-inline:18px}.composition{min-height:390px}.caption h1{font-size:21px}.hint{max-width:250px}}@media(max-height:550px)and (min-width:701px){.composition{min-height:430px}.page{padding-top:18px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}}.footer-identity{display:flex;align-items:center;gap:26px}.about-link{font-size:11px;letter-spacing:.08em;color:#74766b;min-height:44px;border-bottom:1px solid transparent}.about-link:hover{border-color:#b64b37}.about-dialog{color:#292c25;background:#f2efe6;border:0;padding:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;overscroll-behavior:contain}.about-dialog::backdrop{background:#f2efe6}.about-content{width:min(720px,100%);margin:auto;padding:42px 40px 72px}.about-content form{text-align:right;margin-bottom:72px}.back-link{font-size:12px;color:#74766b;min-height:44px}.about-eyebrow{font-size:11px;letter-spacing:.18em;color:#7c7e73;margin-bottom:36px}.about-content h2{font-weight:400;font-size:clamp(28px,4vw,42px);line-height:1.5;letter-spacing:.06em;margin:0 0 12px;text-wrap:balance}.about-name{font-family:Georgia,serif;font-size:17px;letter-spacing:.12em;margin:0 0 50px}.about-intro{font-size:19px;line-height:1.9;margin-bottom:35px}.about-prose{font-size:15px;line-height:2.1;letter-spacing:.025em}.about-prose p{margin:0 0 23px}.about-signature{font-family:Georgia,serif;font-weight:600;font-size:17px;text-align:right;margin:45px 0}.about-colophon{font-size:12px;font-style:italic;color:#74766b;margin-top:60px}.page:has(.about-dialog[open]){height:100dvh;overflow:hidden}.composition{overflow:hidden}@media(max-width:700px){.artwork{width:100%;left:0}.footer-identity{gap:14px}.about-link{font-size:10px}.about-content{padding:22px 26px 50px}.about-content form{margin-bottom:44px}.about-intro{font-size:17px}.about-prose{font-size:14px;line-height:2}.back-link{font-size:11px}.about-colophon{line-height:1.8}}.caption p{line-height:1.75;overflow-wrap:anywhere}.languages button{min-width:44px}.about-content form{position:sticky;top:0;z-index:1;background:#f2efe6;padding-block:8px}@media(max-width:700px){.composition{display:flex;flex-direction:column;gap:22px;min-height:0;height:auto;flex:1;overflow:visible;padding-block:10px 24px}.artwork{position:relative;inset:auto;display:block;flex:none;width:100%;height:clamp(250px,43svh,420px)}.caption{position:relative;left:auto;top:auto;margin-left:30%;max-width:70%;padding-right:0}.caption p{font-size:13px;letter-spacing:.03em;line-height:1.7}.hint{font-size:12px;letter-spacing:.025em;max-width:100%}.state-toggle{font-size:12px}.footer-identity{flex-shrink:0;gap:12px;white-space:nowrap}.about-link{font-size:12px;min-width:44px}footer{align-items:center;gap:14px}.tagline{flex:1;min-width:0;max-width:none;letter-spacing:.06em}html[lang=en] .tagline,html[lang=id] .tagline,.panel-heading{font-size:11px}.about-content form{margin-top:-8px;padding-block:8px}}@media(min-width:701px){.caption{top:auto;bottom:11%}}