:root{color-scheme:dark;--ink:#dce6df;--quiet:#9fb0ab;--spoken:#e9c79b;--sung:#b9dfe0;--code:#9fdcb4;--deep:#050a0b;--turn-fade:1;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--ink);background:var(--deep);font-synthesis:none}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--deep)}body{overscroll-behavior:none}
button,a{font:inherit;color:inherit;background:none;border:0;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.38;cursor:wait}
button:focus-visible,a:focus-visible,canvas:focus-visible{outline:1px solid var(--sung);outline-offset:4px}[hidden]{display:none!important}
/* The stage turns as a whole; what it holds is drawn in its own, unturned frame. */
#elgnah-stage{position:fixed;inset:0;transform-origin:50% 50%;transform:scale(-1,1);will-change:transform,opacity}
#elgnah-edge{position:fixed;pointer-events:none;opacity:0;background:linear-gradient(var(--edge-dir,180deg),transparent,#cfe4e0 22%,#f2fbf6 50%,#cfe4e0 78%,transparent);box-shadow:0 0 18px #b9dfe066}
#elgnah-edge[data-axis=y]{left:calc(50% - 1px);top:6vh;bottom:6vh;width:2px}#elgnah-edge[data-axis=x]{top:calc(50% - 1px);left:6vw;right:6vw;height:2px;--edge-dir:90deg}
#elgnah-water,#elgnah-field{position:absolute;inset:0;width:100%;height:100%;display:block}#elgnah-field{touch-action:none;outline:none;cursor:crosshair}#elgnah-field:focus-visible{outline-offset:-4px}
header{position:fixed;top:max(4.6vh,env(safe-area-inset-top));left:5.4vw;display:flex;align-items:center;gap:28px;font-size:11px;letter-spacing:.14em;text-shadow:0 1px 10px #000}
#elgnah-brand{min-height:44px;display:flex;align-items:center;color:var(--ink)}.elgnah-name-frame{display:inline-block;color:var(--sung);font-size:9px;letter-spacing:.32em}#elgnah-name{display:inline-block;transform:scaleX(-1);transition:transform .2s}
#elgnah-entrance{position:fixed;left:6.2vw;top:23vh;pointer-events:none;transition:opacity 2.4s,transform 3s;text-shadow:0 2px 18px #000}
#elgnah-entrance h1{margin:0;font:400 clamp(44px,6.4vw,92px)/1 Georgia,'Times New Roman',serif;letter-spacing:.09em;color:#e7efe9}
.elgnah-subtitle{margin:16px 0 0;font-size:11px;letter-spacing:.16em;color:var(--sung)}#elgnah-score-line{margin:30px 0 0;max-width:min(78vw,430px);font:italic 16px/1.6 Georgia,'Times New Roman',serif;color:var(--spoken)}
body.entered #elgnah-entrance{opacity:0;transform:translateY(-10px)}
/* The ledger: the stage's matrix and what it keeps. It belongs to the reader, so it never turns. */
#elgnah-ledger{position:fixed;top:max(4.6vh,env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;gap:14px;align-items:flex-start;max-width:min(46vw,560px);pointer-events:none;font-size:9.5px;line-height:1.6;color:var(--quiet);text-shadow:0 1px 8px #000,0 0 3px #000}
#elgnah-matrix{margin:0;font:inherit;font-size:11px;line-height:1.35;color:var(--sung);white-space:pre}#elgnah-ledger p{margin:0}#elgnah-element{color:var(--ink);letter-spacing:.06em}#elgnah-kept{color:#a9cdb8}#elgnah-lost{color:#d6b3a0}
#elgnah-code{position:fixed;right:4.2vw;top:29vh;width:min(30vw,350px);max-height:44vh;margin:0;padding:0 0 0 14px;list-style:none;overflow:hidden;font-size:10.5px;line-height:1.78;color:var(--code);opacity:calc(.86 * var(--turn-fade));pointer-events:none;border-left:1px solid #9fdcb426;text-shadow:0 0 10px #000,0 0 3px #000;display:flex;flex-direction:column;justify-content:flex-end}
#elgnah-code li{white-space:pre;overflow:hidden;text-overflow:ellipsis}#elgnah-code li[data-kind=half]{color:var(--spoken)}#elgnah-code li[data-kind=other]{color:var(--sung)}#elgnah-code li[data-kind=lose]{color:#d6b3a0}#elgnah-code li[data-kind=ledger]{color:#c9cfa8}#elgnah-code li:last-child::after{content:'▍';margin-left:2px;opacity:.7;animation:caret 1.1s steps(2) infinite}
@keyframes caret{50%{opacity:0}}body.still #elgnah-code li:last-child::after{animation:none}
#elgnah-lower-third{position:fixed;left:6.2vw;bottom:15.5vh;max-width:min(62vw,720px);pointer-events:none;border-top:1px solid #b9dfe03a;padding-top:12px;text-shadow:0 1px 14px #000,0 0 4px #000;opacity:var(--turn-fade)}
body:not(.entered) #elgnah-lower-third{opacity:0}
#elgnah-sung{margin:0;min-height:1.3em;font:italic clamp(19px,2.5vw,32px)/1.3 Georgia,'Times New Roman',serif;color:var(--sung)}
#elgnah-spoken{margin:8px 0 0;min-height:1.6em;font-size:11px;letter-spacing:.05em;color:var(--spoken);transform-origin:50% 50%;transition:opacity .25s;display:inline-block}#elgnah-spoken::before{content:'spoken, 2026 — ';color:#e9c79b99}
#elgnah-lower-third[data-kind=wait] #elgnah-sung{letter-spacing:.02em;color:#f0dcc0}
/* The score's furniture follows the stage: across sends it to the other side, over to the other third. */
body.flip-x #elgnah-lower-third{left:auto;right:6.2vw;text-align:right;border-top-color:#b9dfe03a}
body.flip-x #elgnah-code{right:auto;left:4.2vw;padding:0 14px 0 0;border-left:0;border-right:1px solid #9fdcb426;text-align:right}
body.flip-y #elgnah-lower-third{bottom:auto;top:17vh;border-top:0;border-bottom:1px solid #b9dfe03a;padding:0 0 12px}
#elgnah-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(6px,1.3vw,20px);font-size:12px;letter-spacing:.04em;color:var(--quiet);text-shadow:0 1px 8px #000}
#elgnah-controls button,#elgnah-controls a{min-height:44px;padding:10px 8px}#elgnah-controls button:hover:not(:disabled),#elgnah-controls a:hover{color:var(--ink)}
#elgnah-controls .ellipse{min-width:96px;padding:10px 24px;border:1px solid #dce6df88;border-radius:50%;color:var(--ink);letter-spacing:.08em}
.elgnah-turns{display:flex;align-items:center;gap:2px;padding:0 6px;border-left:1px solid #dce6df22;border-right:1px solid #dce6df22}
.elgnah-turns button{min-width:44px;font-size:16px;color:var(--sung)}.elgnah-turns button:disabled{cursor:default}#elgnah-quarter{font-size:14px}
#elgnah-controls [aria-pressed=true]{color:var(--spoken);text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:1px}
#elgnah-help{font-size:17px;min-width:44px}#elgnah-leave{margin-left:auto}
.elgnah-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)}
.elgnah-line{position:fixed;left:5.4vw;right:5.4vw;bottom:max(2.2vh,calc(env(safe-area-inset-bottom) - 8px));height:1px;background:#dce6df24}.elgnah-line div{height:1px;width:0;background:#b9dfe0aa}.elgnah-line i{position:absolute;top:-3px;width:1px;height:7px;background:#dce6df55}.elgnah-line i:nth-of-type(1){left:33.333%}.elgnah-line i:nth-of-type(2){left:66.667%}
#elgnah-notice{position:fixed;left:6.2vw;bottom:calc(max(4.6vh,env(safe-area-inset-bottom)) + 56px);max-width:min(70vw,520px);margin:0;font-size:11px;line-height:1.7;color:var(--spoken);pointer-events:none;text-shadow:0 1px 10px #000}#elgnah-notice:empty{display:none}
body.flip-x:not(.flip-y) #elgnah-notice{left:auto;right:6.2vw;text-align:right;bottom:calc(max(4.6vh,env(safe-area-inset-bottom)) + 74px)}
#elgnah-notes{position:fixed;right:0;top:0;bottom:0;z-index:6;width:min(460px,100vw);overflow:auto;padding:46px 34px 30px;background:#071012f4;border-left:1px solid #b9dfe033;backdrop-filter:blur(16px)}
#elgnah-notes h2{margin:0 0 26px;font:400 12px/1.6 ui-monospace,monospace;letter-spacing:.12em;color:var(--sung)}#elgnah-notes p{font-size:11px;line-height:1.9;color:#c7d3cf;margin:18px 0}#elgnah-notes a{text-decoration:underline;text-underline-offset:4px}
#elgnah-notes-close{position:absolute;top:20px;right:24px;font-size:27px;min-width:44px;min-height:44px}#elgnah-metrics{display:block;margin-top:24px;padding-top:18px;border-top:1px solid #9fb0ab40;font-size:9px;line-height:1.9;color:#8d9c98}
body.closed canvas{opacity:.4}
.p3r-recording-floating[data-p3r-recording="elgnah"]{top:max(4.6vh,env(safe-area-inset-top));right:5.4vw;transform:rotate(-1deg);background:#061012e8;border-color:#b9dfe055}
@media(max-width:1100px){#elgnah-ledger{left:5.4vw;transform:none;top:calc(max(4.6vh,env(safe-area-inset-top)) + 50px);max-width:60vw}}
@media(max-width:900px){#elgnah-code{width:min(36vw,300px);font-size:9.5px}}
@media(max-width:600px){
 header{left:16px;top:max(12px,env(safe-area-inset-top));gap:14px}.elgnah-name-frame{font-size:8px;letter-spacing:.2em}
 #elgnah-ledger{left:16px;right:16px;top:146px;max-width:none;gap:10px;font-size:8.5px;line-height:1.5}#elgnah-matrix{font-size:9.5px}#elgnah-ledger div{min-width:0;flex:1}#elgnah-ledger p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 #elgnah-entrance{left:16px;right:16px;top:32vh}#elgnah-score-line{font-size:14px}
 #elgnah-code{left:16px;right:16px;top:200px;width:auto;max-height:64px;font-size:9px;line-height:1.65;border-left:0;padding:0}
 body.flip-x #elgnah-code{left:16px;right:16px;border-right:0;padding:0}
 #elgnah-lower-third{left:16px;right:16px;bottom:166px;max-width:none}#elgnah-sung{font-size:20px}#elgnah-spoken{font-size:10px}
 body.flip-x #elgnah-lower-third{left:16px;right:16px}
 body.flip-y #elgnah-lower-third{top:200px;bottom:auto}body.flip-y #elgnah-code{top:auto;bottom:178px;max-height:48px}
 #elgnah-controls{left:10px;right:10px;bottom:max(12px,env(safe-area-inset-bottom));flex-wrap:wrap;gap:2px 4px;font-size:11px}#elgnah-controls button,#elgnah-controls a{padding:9px 6px}#elgnah-controls .ellipse{min-width:78px;padding:9px 16px}
 .elgnah-turns{padding:0 2px}.elgnah-turns button{min-width:40px}
 .elgnah-time{right:16px;bottom:130px}.elgnah-line{left:16px;right:16px;bottom:8px}#elgnah-notice,body.flip-x:not(.flip-y) #elgnah-notice{left:16px;right:16px;bottom:138px;max-width:none;text-align:left}
 body.flip-y #elgnah-notice{bottom:236px}
 .p3r-recording-floating[data-p3r-recording="elgnah"]{top:58px;right:10px}
 #elgnah-notes{padding:44px 26px}#elgnah-help{font-size:20px}
}
@media(max-width:600px) and (max-height:620px){#elgnah-code{max-height:32px;font-size:8.5px}body.flip-y #elgnah-code{max-height:32px;bottom:170px}#elgnah-entrance{top:38vh}#elgnah-entrance h1{font-size:40px}#elgnah-ledger{top:140px}#elgnah-code{top:188px}body.flip-y #elgnah-lower-third{top:188px}}
@media(max-height:560px) and (min-width:601px){#elgnah-code{top:24vh;max-height:36vh}#elgnah-lower-third{bottom:19vh}body.flip-y #elgnah-lower-third{top:21vh}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}