:root{--paper:#efebe2;--ink:#1b1a18;--muted:rgba(27, 26, 24, 0.5);--serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;--arrive-hold:6.2s;--arrive-out:1.6s}*{box-sizing:border-box}body,html{margin:0;height:100%;overflow:hidden;background:var(--paper);color:var(--ink);font-family:var(--serif);-webkit-text-size-adjust:100%;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}#grid{display:block;position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;touch-action:none;cursor:grab;background:var(--paper)}#grid.dragging{cursor:grabbing}body.arrive #grid{animation:focus var(--arrive-out) ease-in-out var(--arrive-hold) both}@keyframes focus{from{filter:blur(14px)}to{filter:blur(0)}}#veil{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:rgba(239,235,226,.55);animation:veil-out var(--arrive-out) ease-in-out var(--arrive-hold) forwards;pointer-events:none}#words{margin:0 24px;font-size:clamp(19px, 2.6vw, 30px);font-style:italic;letter-spacing:.015em;text-align:center;user-select:none;animation:words-out var(--arrive-out) ease-in-out var(--arrive-hold) forwards}#words .ph{opacity:0;animation:1.4s ease-out forwards phrase-in}#words .ph:first-child{animation-delay:.5s}#words .ph:nth-child(2){animation-delay:1.9s}#words .ph:nth-child(3){animation-delay:3.3s}@keyframes phrase-in{to{opacity:1}}@keyframes words-out{to{opacity:0}}@keyframes veil-out{from{opacity:1}to{opacity:0;visibility:hidden}}#bar{position:fixed;left:0;top:0;width:100%;height:var(--hair,1px);z-index:12;background:#fff;mix-blend-mode:difference;transform-origin:0 0;transform:scaleX(0);transition:transform .25s linear,opacity 1.2s;pointer-events:none}#bar.done{opacity:0}#card{position:fixed;left:0;top:0;z-index:5;max-width:min(340px,calc(100vw - 24px));padding:11px 14px 12px;background:var(--paper);border:1px solid rgba(27,26,24,.55);opacity:0;visibility:hidden;transform:translateY(3px);transition:opacity .18s,transform .18s,visibility 0s linear .18s;pointer-events:none;user-select:none}#card.on{opacity:1;visibility:visible;transform:none;transition:opacity .18s,transform .18s,visibility;pointer-events:auto}#card.measure{visibility:hidden;opacity:0;transition:none;display:block}#card-title{font-size:16px;font-style:italic;line-height:1.3}#card-why{margin-top:5px;font-size:13.5px;line-height:1.45;color:rgba(27,26,24,.78)}#card-why:empty{display:none}.hint{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));width:420px;height:30px;margin-left:-210px;z-index:4;opacity:0;transition:opacity 1.4s;pointer-events:none;user-select:none}.hint svg{display:block;width:100%;height:100%;overflow:visible}.hint text{font-family:var(--serif);font-size:15px;font-style:italic;letter-spacing:.06em}#hint{mix-blend-mode:difference}.hint.show{opacity:1}.hint.show.gone{opacity:0;transition-duration:.9s}body.nogl #veil{animation:none}body.nogl #words::after{content:" (this page needs WebGL 2)"}@media (prefers-reduced-motion:reduce){:root{--arrive-hold:3.2s;--arrive-out:0.6s}#words .ph{animation-duration:.4s}#card,#card.on{transition-duration:0s}}