.tp-hero{min-height:100svh;max-width:calc(var(--col) + 2 * var(--gut));padding:60px var(--gut) 0;grid-template-rows:minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);gap:clamp(20px,3.5vh,44px) 0;margin:0 auto;display:grid}.tp-sheet{align-self:center;width:100%}.tp-q{letter-spacing:-.035em;color:var(--tx);max-width:13em;margin:0 0 .5em;font-size:clamp(34px,4.6vw,62px);font-weight:700;line-height:1.02}.tp-typed p,.tp-line{letter-spacing:-.018em;color:var(--tx);max-width:44em;margin:0 0 .35em;font-size:clamp(18px,1.75vw,23px);font-weight:500;line-height:1.15}.tp-typed{--ink:var(--tx)}.tp-typed p:last-child{--ink:var(--tx2);color:var(--ink);margin-top:.7em}.tp-lines{margin-top:1em}.tp-typed span,.tp-line{transition:color .1s}html.js .tp-typed span{--letter:var(--ground);color:var(--letter);animation:0s 12s forwards tpRevealLetter}html.js .tp-typed span.lit{--letter:var(--ink)}@keyframes tpRevealLetter{to{--letter:var(--ink)}}html.js .tp-line{--ink:var(--tx);--line-ink:var(--ground);color:var(--line-ink);transition:color .5s;animation:0s 30s forwards tpRevealLine}html.js .tp-line.on{--line-ink:var(--ink)}@keyframes tpRevealLine{to{--line-ink:var(--ink)}}.tp-q .caret{vertical-align:-.1em}.tp-dock{padding-bottom:clamp(14px,2.4vh,26px)}.tp-board{gap:var(--g);--u:56px;--g:7px;--tp-row:calc(var(--u) * 11.9 + var(--g) * 10.4);width:calc(var(--tp-row) + 1px);margin:0 0 0 max(0px, calc(50% - var(--tp-row) / 2));flex-wrap:wrap;display:flex}.tp-board>.k:nth-child(8n+5){margin-left:calc(var(--u) * .5)}.tp-board .k{--wall:3px;color:var(--cap-dim);cursor:pointer;font-size:16px;text-decoration:none;transition-duration:.12s}.tp-board .k.played,.tp-board .k.ret{color:var(--cap-txt)}.tp-board .k.ret{white-space:nowrap;justify-content:center;align-items:center;gap:.35em;display:flex}.tp-board .k.ret span{font-weight:500}@media (hover:hover) and (pointer:fine){.tp-board .k:hover{transform:translateY(calc(var(--wall) * .25));box-shadow:inset 0 1px 0 #ffffff1f, 0 0 0 1px var(--key-edge), 0 calc(var(--wall) * .75) 0 0 var(--wall-c)}}.tp-board .k:focus-visible{outline:2px solid var(--tx);outline-offset:3px}.tp .page p{max-width:34em}.tp-sec{grid-template-columns:minmax(0,1fr) minmax(0,540px);align-items:center;gap:clamp(28px,4vw,72px);display:grid}.tp-sec h2{margin-top:0}.tp-sec .k.chap{--u:56px;--g:7px;--wall:3px;color:var(--cap-txt);margin-bottom:22px;font-size:16px}.tp-sec:target .k.chap{transform:translateY(calc(var(--wall) * .3));box-shadow:inset 0 1px 0 #ffffff1f, 0 0 0 1px var(--key-edge), 0 calc(var(--wall) * .7) 0 0 var(--wall-c)}.tp-scene{--u:50px;--g:7px;place-items:center;min-height:320px;display:grid;position:relative}.tp-b{gap:var(--g);flex-direction:column;display:flex}.tp-b .row{gap:var(--g);display:flex}.tp-b .row.stagger{padding-left:calc(var(--u) * .5)}.tp-scene .k{--wall:3px;color:var(--cap-txt);white-space:nowrap;font-size:14px;transition-duration:.12s}.tp-scene .k.dim{color:var(--cap-dim)}.tp-scene .k.flat{transform:translateY(var(--wall));box-shadow:inset 0 1px 0 #ffffff0f, 0 0 0 1px var(--key-edge);opacity:.55}.tp-scene .tp-big{--u:20px;--g:3px;opacity:.32}.tp-scene .tp-small{position:absolute;bottom:6%;right:6%}@keyframes tpTap{0%,to{box-shadow:inset 0 1px 0 #ffffff1f, 0 0 0 1px var(--key-edge), 0 var(--wall) 0 0 var(--wall-c);transform:translateY(0)}10%,22%{transform:translateY(calc(var(--wall) * .3));box-shadow:inset 0 1px 0 #ffffff1f, 0 0 0 1px var(--key-edge), 0 calc(var(--wall) * .7) 0 0 var(--wall-c)}}@keyframes tpSink{0%{opacity:1;box-shadow:inset 0 1px 0 #ffffff1f, 0 0 0 1px var(--key-edge), 0 var(--wall) 0 0 var(--wall-c);transform:translateY(0)}to{transform:translateY(var(--wall));opacity:.55;box-shadow:inset 0 1px 0 #ffffff0f, 0 0 0 1px var(--key-edge)}}@keyframes tpLight{0%,28%{color:var(--cap-dim)}36%,80%{color:var(--cap-txt)}to{color:var(--cap-dim)}}.tp-scene.live[data-scene=day1] .k{animation:tpTap 2.8s var(--ease) infinite;animation-delay:calc(var(--d) * .11s)}.tp-scene.live[data-scene=prfaq] .k{animation:tpTap 4.2s var(--ease) infinite;animation-delay:calc(var(--d) * .6s)}.tp-scene.live[data-scene=prfaq] .k.ship{animation:tpTap 4.2s var(--ease) infinite 1.2s, tpLight 4.2s ease infinite}.tp-scene.live[data-scene=seventy] .k.lit{animation:tpTap 3.6s var(--ease) infinite;animation-delay:calc(var(--d) * .14s)}.tp-scene.live[data-scene=owner] .k.sink{animation:tpSink .7s var(--ease) both;animation-delay:calc(var(--d) * 90ms + .3s)}.tp-scene.live[data-scene=owner] .k.own{animation:tpTap 2.4s var(--ease) 1 .2s}.tp-scene.live[data-scene=pizzas] .k.roll{animation:tpTap 1.9s var(--ease) infinite;animation-delay:calc(var(--d) * .12s)}.tp-scene.live[data-scene=simplify] .k.pile{animation:tpSink .8s var(--ease) both;animation-delay:calc(var(--d) * .26s + .2s)}.tp-scene.live[data-scene=simplify] .k.one{animation:tpTap 2.6s var(--ease) 1 1.2s}.tp-scene.live[data-scene=range] .k.tap{animation:tpTap 3.2s var(--ease) infinite;animation-delay:calc(var(--d) * .22s)}@media (max-width:960px){.tp-sec{grid-template-columns:minmax(0,1fr)}}@media (max-width:600px){.tp-hero{padding:calc(72px * var(--ph)) var(--gut) 0;gap:calc(16px * var(--ph)) 0}.tp-dock{padding-bottom:calc(12px * var(--ph))}.tp-q{font-size:calc(30px * var(--ph));line-height:1.06}.tp-typed p,.tp-line{font-size:calc(15px * var(--ph));line-height:1.24}.tp-board{--u:calc(44px * var(--ph));--g:calc(6px * var(--ph));--tp-row:calc(var(--u) * 8.3 + var(--g) * 6.8)}.tp-board>.k:nth-child(8n+5){margin-left:0}.tp-board>.k:nth-child(6n+4){margin-left:calc(var(--u) * .5)}.tp-board .k{--wall:calc(3px * var(--ph));font-size:calc(12px * var(--ph))}.tp-sec{gap:calc(24px * var(--ph))}.tp-sec .k.chap{--u:calc(44px * var(--ph));--g:calc(6px * var(--ph));--wall:calc(3px * var(--ph));font-size:calc(12px * var(--ph));margin-bottom:calc(14px * var(--ph))}.tp-scene{--u:calc(30px * var(--ph));--g:calc(4px * var(--ph));min-height:calc(200px * var(--ph))}.tp-scene .k{--wall:calc(2px * var(--ph));font-size:calc(10px * var(--ph))}.tp-scene .tp-big{--u:calc(13px * var(--ph));--g:calc(2px * var(--ph))}}@media (prefers-reduced-motion:reduce){.tp-typed span,.tp-line,.tp-board .k,.tp-scene .k{transition:none}.tp-scene .k{animation:none!important}html.js .tp-typed span{--letter:var(--ink);animation:none}html.js .tp-line{--line-ink:var(--ink);animation:none}}
