*,:before,:after{box-sizing:border-box}html,body{color:#211d17;background:#f5efe3;margin:0;font-family:Georgia,Times New Roman,serif}#plate{width:100%;height:100dvh;display:block;position:fixed;inset:0}#masthead{top:calc(1.5rem + env(safe-area-inset-top,0px));left:calc(1.75rem + env(safe-area-inset-left,0px));z-index:3;position:fixed}#masthead h1{letter-spacing:.28em;text-transform:uppercase;margin:0;font-size:1.15rem;font-weight:400}#counter{top:calc(1.6rem + env(safe-area-inset-top,0px));right:calc(1.75rem + env(safe-area-inset-right,0px));z-index:3;font-variant-numeric:tabular-nums;color:#211d17bf;text-align:right;opacity:0;max-width:60vw;font-size:.95rem;transition:opacity .4s;position:fixed}#counter.visible{opacity:1}#story{z-index:2;position:relative}.beat{position:relative}.beat .card{opacity:0;pointer-events:none;background:#f5efe3eb;border:1px solid #3f382c40;max-width:24rem;margin:0 auto;padding:1rem 1.25rem;transition:opacity .2s,transform .2s;position:sticky;top:62svh;transform:translateY(.6rem)}.beat.active .card{opacity:1;transition:opacity .4s .35s,transform .4s .35s;transform:none}.beat .card.leaving{opacity:0;transition:opacity .22s,transform .28s;transform:translateY(-1.4rem)}#story .beat .card.cleared{opacity:0;transition:opacity .15s,transform .2s;transform:translateY(-1.4rem)}.beat .card p{margin:0;font-size:1rem;line-height:1.55}.beat .card .note{letter-spacing:.12em;text-transform:uppercase;color:#211d17b8;margin-top:.5rem;font-size:.8rem}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}#playground{z-index:4;background:#f5efe3;border-top:1px solid #3f382c40;padding:3rem 1.5rem 4rem;position:relative}.playground-inner{max-width:64rem;margin:0 auto}#playground h2{letter-spacing:.2em;text-transform:uppercase;margin:0 0 1.5rem;font-size:1rem;font-weight:400}.playground-plate{border:1px solid #3f382c40;width:100%;height:min(62vh,34rem);display:block}.area-line{font-variant-numeric:tabular-nums;color:#211d17bf;margin:.75rem 0 1.25rem;font-size:.95rem}.controls{flex-wrap:wrap;align-items:center;gap:1rem 2rem;display:flex}.controls button{font:inherit;letter-spacing:.08em;text-transform:uppercase;color:inherit;cursor:pointer;background:0 0;border:1px solid #3f382c99;padding:.55rem 1rem;font-size:.85rem}.controls button:hover{background:#3f382c0f}.controls button.playing{background:#3f382c1a;border-color:#3f382cb3}.control{letter-spacing:.1em;text-transform:uppercase;color:#211d17b8;align-items:center;gap:.6rem;font-size:.8rem;display:inline-flex}.control .control-name{align-items:center;gap:.6rem;display:inline-flex}.control input[type=range]{accent-color:#c73a26;width:8.5rem}.control-value{font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0;min-width:5.5rem}.playground-note{color:#211d17cc;max-width:34rem;margin-top:1.5rem;font-size:.95rem;line-height:1.55}:focus-visible{outline-offset:2px;outline:2px solid #c73a26}#reading{z-index:4;background:#f5efe3;border-top:1px solid #3f382c40;padding:3rem 1.5rem 2rem;position:relative}#reading h2,#reading ol{max-width:44rem;margin-left:auto;margin-right:auto}#reading h2{letter-spacing:.2em;text-transform:uppercase;margin:0 auto 1.5rem;font-size:1rem;font-weight:400}#reading ol{padding:0;list-style:none}#reading li{border-bottom:1px solid #3f382c26;padding:1.1rem 0}#reading a{color:inherit;border-bottom:1px solid #c73a26;text-decoration:none}#reading a:hover{color:#c73a26}#reading .cite{letter-spacing:.1em;text-transform:uppercase;color:#211d17b8;margin-top:.25rem;font-size:.8rem;display:block}#reading li p{color:#211d17cc;margin:.4rem 0 0;font-size:.95rem}#colophon{z-index:4;background:#f5efe3;padding:1.5rem;position:relative}#colophon p{color:#211d17b8;max-width:44rem;margin:0 auto;font-size:.85rem;line-height:1.6}.reduced .beat .card{transition:none}@media (min-width:900px){.beat .card{max-width:21rem;margin-left:5vw;margin-right:auto;top:58svh}}@media (max-width:640px){#masthead{top:calc(1rem + env(safe-area-inset-top,0px));left:calc(1rem + env(safe-area-inset-left,0px))}#counter{top:calc(3.1rem + env(safe-area-inset-top,0px));font-size:.85rem;right:1rem}.beat .card{max-width:calc(100vw - 2.5rem);padding:.85rem 1rem;top:66svh}.playground-plate{height:48vh}.controls{grid-template-columns:1fr;gap:1.1rem;display:grid}.controls button{width:100%;padding:.8rem 1rem}.control{grid-template-columns:1fr;gap:.4rem;display:grid}.control .control-name{grid-template-columns:auto 1fr;gap:.4rem .8rem;width:100%;display:grid}.control input[type=range]{width:100%;min-height:2rem}.control-value{text-align:right}}