:root{--large:22px;--small:16px}*{box-sizing:border-box}html{background:#fff;color:#000;color-scheme:light}body{margin:0;font-family:Arial,Helvetica,sans-serif;font-weight:400;font-synthesis:none;-webkit-text-size-adjust:100%}main{max-width:1080px;margin:auto}.composition{display:flex;flex-direction:column;min-height:100vh;min-height:100svh;padding:max(28px,env(safe-area-inset-top)) 28px max(28px,env(safe-area-inset-bottom))}.identity,.text-composition{flex:none}.identity h1{margin:0;font-size:var(--large);font-weight:400;line-height:1.12;letter-spacing:-.025em}.photographs{flex:1 0 auto;min-height:clamp(200px,30vw,320px);position:relative;margin:0}.photo{position:absolute;margin:0;width:18%;max-width:154px;aspect-ratio:1}.stair{left:15%;bottom:24%}.facade{left:52%;top:19%}.bridge{right:5%;bottom:24%}.crop{width:100%;height:100%;overflow:hidden;position:relative}.crop img{position:absolute;display:block;max-width:none;height:auto;width:1211.111%}.stair img{left:-109.402%;top:-429.06%}.facade img{left:-308.547%;top:-279.487%}.bridge img{left:-433.333%;top:-429.915%}.text-composition{display:grid;grid-template-columns:44% 50%;column-gap:6%;align-items:start}.statement{grid-column:1;grid-row:1 / span 2;font-size:var(--large);line-height:1.24;letter-spacing:-.025em;margin:0;font-weight:400;overflow-wrap:normal}.subjects{grid-column:2;font-size:var(--small);line-height:1.4;margin-bottom:22px}.essay{grid-column:2;font-size:var(--small);line-height:1.4;letter-spacing:-.012em;min-width:0}.essay p{margin:0 0 1.4em}.essay p:last-child{margin-bottom:0}[data-depth]{transform:translate3d(0,0,0)}footer{padding:32px 28px max(28px,env(safe-area-inset-bottom));font-size:var(--small);line-height:1.5}.actions{display:flex;flex-wrap:wrap;gap:4px 24px}button{font:inherit;color:#000;background:none;border:0;padding:10px 0;text-decoration:underline;text-underline-offset:4px;min-height:44px;cursor:pointer}button:disabled{cursor:wait}button[hidden]{display:none}#status{font:inherit;margin:4px 0 0;max-width:36ch}@media(min-width:720px){.text-composition{grid-template-columns:44% 14% 30%;gap:0 6%}.statement{grid-row:1}.subjects{grid-column:2;margin-bottom:0}.essay{grid-column:3}}@media(max-width:350px){.text-composition{grid-template-columns:43% 51%}}
