.about{isolation:isolate;padding:0 var(--gutter);position:relative}.about~*{z-index:1;position:relative}.about-stage{min-width:0;position:relative}.about-scroll{width:max-content;position:relative}.about-scroll>canvas{max-width:none;image-rendering:pixelated;display:block}#about-room:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}.about-scroll>.room-rebuild{position:absolute;top:0;left:0}.room-rebuild{background:var(--line);color:var(--ink);cursor:pointer;clip-path:var(--corners);font:700 var(--vt-9)/1 var(--font-pixel);-webkit-font-smoothing:none;text-transform:uppercase;letter-spacing:var(--type-px);border:0;padding:6px 10px}.room-rebuild:hover{background:var(--soft)}.room-rebuild:focus-visible{box-shadow:inset 0 0 0 2px var(--focus);outline:none}.about-text{--about-measure:540px;--about-body:color-mix(in srgb, var(--ink) 62%, var(--muted));color:var(--about-body);font-kerning:normal;line-height:30px;container:about-text/inline-size}.about-text>*{max-width:var(--about-measure)}.about-text p{text-wrap:pretty;margin:18px 0 0}.about-text .nowrap{white-space:nowrap}.about-title{margin:0 0 var(--cap-gap);color:var(--accent);text-box:trim-both cap alphabetic}@media (width>=1800px) and (height>=1200px){.about-title{font-size:var(--vt-18)}}.about-text .about-lead{color:var(--ink);text-wrap:balance;text-box:trim-start cap alphabetic;margin:0 0 36px;font-size:24px;line-height:36px}@media (width<=599.98px){.about-text .about-lead{margin-bottom:30px;font-size:21px;line-height:30px}}.about-now{position:relative}.about-portrait{--art-px:var(--px-hero,1px);width:calc(118 * var(--art-px));height:calc(140 * var(--art-px));margin-top:calc(36px - 4 * var(--art-px));display:block;position:relative}.about-portrait>*{max-width:none;image-rendering:pixelated;display:block;position:absolute;top:0;left:0}.about-portrait>img{width:calc(102 * var(--art-px));height:auto}.about-portrait[data-painted]>img{display:none}.about-portrait[data-painted]>canvas{left:var(--at-x,0px);top:var(--at-y,0px);cursor:grab;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.about-portrait[data-moved]>canvas{z-index:1}.about-portrait[data-lifted]>canvas{z-index:2;cursor:grabbing}.about:has(.about-portrait[data-moved]){z-index:2}.about-portrait:focus{outline:none}.about-portrait:focus-visible:after{content:"";z-index:2;pointer-events:none;left:var(--at-x,0px);top:calc(var(--at-y,0px) + 4 * var(--art-px));width:calc(116 * var(--art-px));height:calc(134 * var(--art-px));outline:2px solid var(--focus);outline-offset:3px;position:absolute}.about-portrait[data-lifted]:focus-visible:after{translate:0 calc(-1 * var(--art-px))}.about-text .about-story{margin-top:54px}.about-now+.about-story{margin-top:36px}@container about-text (width>=816px){.about-portrait{top:calc(9px - 4 * var(--art-px));left:calc(var(--about-measure) + clamp(40px, 100cqi - var(--about-measure) - 118 * var(--art-px), 48px));margin:0;position:absolute}.about-now+.about-story{margin-top:54px}}.about-text .about-coda{color:var(--ink);text-box:trim-end cap alphabetic;margin-top:36px}.about-bg{z-index:-1;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;position:absolute;top:0;left:0;overflow:clip}.about-bg-title{max-width:none;image-rendering:pixelated;position:absolute}.about[data-layout=stacked]{flex-direction:column;align-items:center;gap:32px;padding-block:8px 0;display:flex}.about[data-layout=stacked] .about-stage{margin-inline:calc(-1 * var(--gutter));overscroll-behavior-x:contain;scrollbar-width:thin;align-self:stretch;overflow-x:auto}.about[data-layout=stacked] .about-scroll{margin-inline:auto;padding-bottom:40px}.about[data-layout=stacked] .about-text{width:min(100%, var(--about-measure))}.about[data-layout=side]{padding-bottom:max(clamp(48px, 8vh, 144px), var(--floor,0px));grid-template-columns:minmax(0,1fr);display:grid}.about[data-layout=side]>:not(.about-bg){width:var(--w);margin:var(--y) 0 0 var(--x);grid-area:1/1;place-self:start}.js .about:not([data-layout]) .about-text{visibility:hidden;animation:0s 2s forwards unhide}.about:not([data-layout]) .about-stage{display:none}.about:not([data-layout]) .about-text{width:min(100%, var(--about-measure));margin-inline:auto;padding-top:8px}.about[data-layout=side][data-sticky] .about-stage{top:var(--stick);position:sticky}
