:root{color-scheme:dark;--paper:#e8e0cc;--ink:#e8e0cc;--quiet:#9d9482;--faint:#6f6657;--cut:#cf5b44;--night:#0d0c0a;--serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--ink);background:var(--night);font-synthesis:none}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--night)}body{overscroll-behavior:none}
button,a,input{font:inherit;color:inherit;background:none;border:0;text-decoration:none;-webkit-tap-highlight-color:transparent}button,a{cursor:pointer}button:disabled{opacity:.36;cursor:default}
button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:1px solid var(--paper);outline-offset:4px}[hidden]{display:none!important}
.superscript-visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#superscript-stage{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:manipulation;outline:none;cursor:default}#superscript-stage:focus-visible{outline:1px solid var(--paper);outline-offset:-4px}
/* The band of a phone's screen that the page keeps free of words: the stage stands in it. */
#superscript-band{display:none;position:fixed;left:var(--stage-left,0px);right:var(--stage-right,0px);top:var(--stage-top);bottom:var(--stage-bottom);visibility:hidden;pointer-events:none}
body[data-act=reading] #superscript-stage,body[data-act=running] #superscript-stage{cursor:crosshair}
header{position:fixed;top:max(4.6vh,env(safe-area-inset-top));left:5.4vw;right:5.4vw;display:flex;align-items:center;justify-content:space-between;font-size:11px;letter-spacing:.14em;text-shadow:0 1px 10px #000;pointer-events:none}
header a{pointer-events:auto}#superscript-brand{min-height:44px;display:flex;align-items:center}#superscript-mark{font:italic 13px/1 var(--serif);letter-spacing:.04em;color:var(--quiet)}
#superscript-entrance{position:fixed;left:6.2vw;top:24vh;pointer-events:none;transition:opacity 2.2s,transform 2.6s;text-shadow:0 2px 18px #000;max-width:min(80vw,560px)}
#superscript-entrance h1{margin:0;font:400 clamp(46px,6.8vw,96px)/1 var(--serif);letter-spacing:.02em;color:var(--paper)}#superscript-entrance h1 sup{font-size:.42em;color:var(--cut);margin-left:.04em}
.superscript-subtitle{margin:16px 0 0;font-size:11px;letter-spacing:.16em;color:var(--quiet)}#superscript-entrance p:last-child{margin:28px 0 0;font:italic 16px/1.6 var(--serif);color:#cbbfa6}
body:not([data-act=entrance]) #superscript-entrance{opacity:0;transform:translateY(-10px)}
/* The machine's ledger: its reading, its word written with superscripts, what it has found. */
#superscript-ledger{position:fixed;top:calc(max(4.6vh,env(safe-area-inset-top)) + 104px);right:calc(5.4vw - 12px);width:calc(min(36vw,420px) + 52px);padding:6px 12px 8px 40px;background:linear-gradient(to left,#0d0c0ae8 72%,#0d0c0a00);text-align:right;pointer-events:none;font-size:10px;line-height:1.7;color:var(--quiet);text-shadow:0 1px 8px #000,0 0 3px #000}
#superscript-ledger p{margin:0}#superscript-count{letter-spacing:.06em;color:var(--paper)}#superscript-word{margin-top:4px!important;font:italic 13px/1.5 var(--serif);color:#d8ccb2;overflow-wrap:anywhere;max-height:4.6em;overflow:hidden}#superscript-word sup{font-style:normal;font-size:.68em;color:var(--cut);margin-left:1px}
#superscript-verdict{margin-top:8px!important;color:#e2b99f;max-height:5.1em;overflow:hidden}#superscript-verdict[data-proof=true]{color:var(--paper)}
/* The document is a column of footnotes, and the first one is the artist's. */
#superscript-notes-list{position:fixed;left:5.4vw;bottom:calc(max(4.6vh,env(safe-area-inset-bottom)) + 62px);width:min(40vw,480px);max-height:max(60px,calc(31vh - 130px));margin:0;padding:12px 0 0;list-style:none;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;border-top:1px solid #e8e0cc2a;font:13px/1.55 var(--serif);color:#c9bea6;pointer-events:none;text-shadow:0 1px 10px #000,0 0 3px #000}
#superscript-notes-list.overflowing{-webkit-mask-image:linear-gradient(to bottom,#000 0 1px,transparent 2px,#000 34px);mask-image:linear-gradient(to bottom,#000 0 1px,transparent 2px,#000 34px)}#superscript-notes-list li{margin:3px 0}#superscript-notes-list sup{font-size:.72em;color:var(--cut);margin-right:3px}#superscript-notes-list li[data-kind=machine]{color:var(--paper)}#superscript-notes-list li[data-kind=you]{color:#e2b99f}
#superscript-question{position:fixed;left:50%;top:38vh;transform:translate(-50%,-50%);margin:0;font:italic clamp(30px,4.6vw,64px)/1.1 var(--serif);color:var(--paper);text-shadow:0 2px 26px #000,0 0 8px #000;pointer-events:none;white-space:nowrap;animation:arrive 2.4s ease-out both}
#superscript-question.quiet{left:auto;right:5.4vw;top:calc(max(4.6vh,env(safe-area-inset-top)) + 264px);transform:none;font-size:clamp(20px,2vw,28px);text-align:right}
@keyframes arrive{from{opacity:0;letter-spacing:.06em}to{opacity:1}}body.still #superscript-question{animation:none}
#superscript-answer{position:fixed;left:5.4vw;top:calc(64vh - 118px);display:flex;align-items:center;gap:10px;width:min(30vw,380px);font:15px/1.4 var(--serif);color:var(--paper)}
#superscript-answer label{color:var(--cut);font-size:15px}#superscript-answer input{flex:1;min-width:0;min-height:44px;padding:6px 2px;border-bottom:1px solid #e8e0cc66;font:italic 16px/1.4 var(--serif);color:var(--paper)}#superscript-answer input::placeholder{color:#8d8473}
#superscript-answer button{min-height:44px;padding:8px 10px;font:11px ui-monospace,monospace;letter-spacing:.08em;color:var(--quiet)}
#superscript-controls{position:fixed;left:5.4vw;right:5.4vw;bottom:max(4.6vh,env(safe-area-inset-bottom));display:flex;align-items:center;gap:clamp(4px,1.1vw,18px);font-size:12px;letter-spacing:.04em;color:var(--quiet);text-shadow:0 1px 8px #000}
#superscript-controls button,#superscript-controls a{min-height:44px;padding:10px 8px}#superscript-controls button:hover:not(:disabled),#superscript-controls a:hover{color:var(--paper)}
#superscript-controls .superscript-primary{min-width:104px;padding:10px 22px;border:1px solid #e8e0cc88;color:var(--paper);letter-spacing:.08em}
#superscript-cut:not(:disabled){color:var(--cut)}#superscript-controls [aria-pressed=true]{color:#e2b99f;text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:1px}
#superscript-help{font-size:17px;min-width:44px}#superscript-leave{margin-left:auto}
.superscript-time{position:fixed;right:5.6vw;bottom:calc(max(4.6vh,env(safe-area-inset-bottom)) + 54px);display:flex;gap:10px;font-size:9px;letter-spacing:.1em;color:var(--quiet)}
#superscript-notice{position:fixed;right:5.4vw;bottom:calc(max(4.6vh,env(safe-area-inset-bottom)) + 78px);max-width:min(36vw,420px);margin:0;text-align:right;font-size:11px;line-height:1.7;color:#e2b99f;pointer-events:none;text-shadow:0 1px 10px #000}#superscript-notice:empty{display:none}
#superscript-notes{position:fixed;right:0;top:0;bottom:0;z-index:6;width:min(480px,100vw);overflow:auto;padding:46px 34px 30px;background:#100e0bf6;border-left:1px solid #e8e0cc2e;backdrop-filter:blur(16px)}
#superscript-notes h2{margin:0 0 26px;font:italic 400 20px/1.4 var(--serif);color:var(--paper)}#superscript-notes p{font:13px/1.85 var(--serif);color:#d0c5ad;margin:16px 0}#superscript-notes a{text-decoration:underline;text-underline-offset:4px}
#superscript-notes-close{position:absolute;top:20px;right:24px;font-size:27px;min-width:44px;min-height:44px}#superscript-metrics{display:block;margin-top:24px;padding-top:18px;border-top:1px solid #9d948240;font:9px/1.9 ui-monospace,monospace;color:#8d8473}
body.closed canvas{opacity:.4}
.p3r-recording-floating[data-p3r-recording="superscript"]{top:max(4.6vh,env(safe-area-inset-top));right:calc(5.4vw + 120px);transform:rotate(1deg);background:#100e0be8;border-color:#e8e0cc44}
@media(max-width:900px){#superscript-ledger{width:calc(min(46vw,360px) + 52px)}#superscript-notes-list{width:min(52vw,420px)}}
@media(orientation:portrait) and (max-width:1100px),(max-width:600px) and (min-height:501px){
 :root{--stage-top:calc(max(12px,env(safe-area-inset-top)) + 224px);--stage-bottom:calc(max(10px,env(safe-area-inset-bottom)) + 308px)}
 #superscript-band{display:block}
 header{left:16px;right:16px;top:max(12px,env(safe-area-inset-top))}
 #superscript-entrance{left:16px;right:16px;top:27vh}#superscript-entrance p:last-child{font-size:14px}
 #superscript-ledger{left:16px;right:16px;width:auto;padding:0;background:none;top:calc(max(12px,env(safe-area-inset-top)) + 46px);height:72px;overflow:hidden;text-align:left;font-size:9px;line-height:1.55}
 #superscript-word{font-size:12px;max-height:1.5em;white-space:nowrap;text-overflow:ellipsis}#superscript-verdict{margin-top:4px!important;max-height:3.1em;overflow:hidden}
 .p3r-recording-floating[data-p3r-recording="superscript"]{top:calc(max(12px,env(safe-area-inset-top)) + 128px);right:12px;bottom:auto;left:auto;transform:none}
 #superscript-notice{left:16px;right:16px;max-width:none;top:var(--stage-top);bottom:auto;padding:5px 9px;text-align:left;background:#0d0c0af0}
 #superscript-question{top:calc((var(--stage-top) + 100vh - var(--stage-bottom))/2);font-size:30px}#superscript-question.quiet{left:16px;right:16px;top:auto;bottom:calc(var(--stage-bottom) - 28px);font-size:19px;text-align:left}
 #superscript-answer{left:16px;right:16px;width:auto;top:auto;bottom:calc(var(--stage-bottom) - 72px)}
 #superscript-notes-list{left:16px;right:16px;width:auto;bottom:calc(max(10px,env(safe-area-inset-bottom)) + 136px);max-height:92px;font-size:11.5px;line-height:1.45;padding-top:8px}
 .superscript-time{right:16px;bottom:calc(max(10px,env(safe-area-inset-bottom)) + 106px)}
 #superscript-controls{left:8px;right:8px;bottom:max(10px,env(safe-area-inset-bottom));flex-wrap:wrap;gap:0 2px;font-size:11px}#superscript-controls button,#superscript-controls a{padding:9px 6px}#superscript-controls .superscript-primary{min-width:76px;padding:9px 14px}
}
/* A short phone keeps the same order with less of each: one line of the word, two footnotes, no clock. */
@media(orientation:portrait) and (max-height:700px),(max-width:600px) and (min-height:501px) and (max-height:700px){
 :root{--stage-top:calc(max(8px,env(safe-area-inset-top)) + 196px);--stage-bottom:calc(max(10px,env(safe-area-inset-bottom)) + 212px)}
 header{top:max(8px,env(safe-area-inset-top))}
 #superscript-ledger{top:calc(max(8px,env(safe-area-inset-top)) + 45px);height:62px}#superscript-word{font-size:11px;margin-top:1px!important}#superscript-verdict{margin-top:2px!important}
 .p3r-recording-floating[data-p3r-recording="superscript"]{top:calc(max(8px,env(safe-area-inset-top)) + 112px);padding:6px 8px}
 .p3r-recording-floating[data-p3r-recording="superscript"] button{min-height:30px;padding:4px 6px}
 .p3r-recording-floating[data-p3r-recording="superscript"] output{margin-top:2px}
 #superscript-notes-list{bottom:calc(max(10px,env(safe-area-inset-bottom)) + 94px);max-height:41px}
 .superscript-time{display:none}
 /* The band is short here: the notice is set closer so that it ends above the strip being read. */
 #superscript-notice{padding:4px 8px;font-size:10px;line-height:1.45}
}
/* A phone on its side: the words keep to a left column and the stage stands to the right of them. */
@media(orientation:landscape) and (max-height:500px){
 :root{--stage-top:calc(max(10px,env(safe-area-inset-top)) + 138px);--stage-bottom:calc(max(6px,env(safe-area-inset-bottom)) + 56px);--stage-left:calc(max(16px,env(safe-area-inset-left)) + 38vw);--stage-right:max(16px,env(safe-area-inset-right))}
 #superscript-band{display:block}
 header{left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));top:max(4px,env(safe-area-inset-top))}
 #superscript-entrance{top:22vh}
 #superscript-ledger{left:max(16px,env(safe-area-inset-left));right:auto;width:calc(38vw - 8px);padding:0;background:none;top:calc(max(4px,env(safe-area-inset-top)) + 46px);height:66px;overflow:hidden;text-align:left;font-size:9px;line-height:1.55}
 #superscript-word{font-size:12px;max-height:1.5em;white-space:nowrap;text-overflow:ellipsis}#superscript-verdict{margin-top:4px!important;max-height:3.1em;overflow:hidden}
 .p3r-recording-floating[data-p3r-recording="superscript"]{top:calc(max(4px,env(safe-area-inset-top)) + 46px);right:max(16px,env(safe-area-inset-right));left:auto;bottom:auto;transform:none;padding:6px 8px}
 .p3r-recording-floating[data-p3r-recording="superscript"] button{min-height:30px;padding:4px 6px}
 #superscript-notice{left:var(--stage-left);right:var(--stage-right);max-width:none;top:var(--stage-top);bottom:auto;padding:5px 9px;text-align:left;background:#0d0c0af0}
 #superscript-question{left:calc(var(--stage-left) + (100vw - var(--stage-left) - var(--stage-right))/2);top:calc((var(--stage-top) + 100vh - var(--stage-bottom))/2);font-size:28px}
 #superscript-question.quiet{left:max(16px,env(safe-area-inset-left));right:auto;top:calc(max(4px,env(safe-area-inset-top)) + 118px);font-size:18px;text-align:left}
 #superscript-answer{left:max(16px,env(safe-area-inset-left));width:calc(38vw - 8px);top:calc(max(4px,env(safe-area-inset-top)) + 142px);bottom:auto}
 #superscript-notes-list{left:max(16px,env(safe-area-inset-left));width:calc(38vw - 8px);bottom:calc(max(6px,env(safe-area-inset-bottom)) + 52px);max-height:calc(100vh - 252px);font-size:11.5px;line-height:1.45;padding-top:8px}
 .superscript-time{display:none}
 #superscript-controls{left:8px;right:8px;bottom:max(6px,env(safe-area-inset-bottom));gap:0;font-size:10.5px;white-space:nowrap}#superscript-controls button,#superscript-controls a{padding:8px 5px}#superscript-controls .superscript-primary{min-width:72px;padding:8px 12px}
}
@media(max-width:350px){#superscript-controls{font-size:10px}#superscript-controls button,#superscript-controls a{padding:8px 4px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}