@font-face{font-family:Threshold Sans;src:url('assets/apocrypha/manrope.ttf') format('truetype');font-display:swap}
#threshold-film{position:absolute;inset:0;width:100%;height:100%;z-index:4}
#threshold-scene{position:fixed;inset:0;z-index:4;pointer-events:none;color:#eee7db;overflow:hidden;--ink:#711f1d;--paper:#eee7db}
#threshold-scene[hidden],#threshold-film[hidden]{display:none}
#threshold-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:54% 50%;z-index:-1}
#threshold-scene.has-film #threshold-fallback{visibility:hidden}
#threshold-title{position:absolute;left:5.4%;top:13%;width:62%;margin:0;font:450 clamp(80px,12.8vw,205px)/.77 var(--display);letter-spacing:-.075em;color:var(--paper);text-shadow:0 1px 20px #251a1333;transform-origin:10% 50%;}
#threshold-title span{display:block}
#threshold-title span+span{margin-left:9%;margin-top:2%}
#threshold-voice{position:absolute;margin:0;left:5.8%;top:10%;font:12px/1.3 Threshold Sans,sans-serif;letter-spacing:.02em;color:var(--paper)}
#threshold-body{position:absolute;right:5.8%;bottom:17%;width:23%;max-width:330px;margin:0;font:400 clamp(15px,1.2vw,19px)/1.6 Threshold Sans,sans-serif;white-space:pre-line;text-wrap:pretty;text-shadow:0 1px 12px #170e09,0 0 30px #170e09;}
#threshold-body:before{content:'';position:absolute;inset:-35px -40px;z-index:-1;background:radial-gradient(ellipse,#20160db0,transparent 72%)}
#threshold-scene[data-movement="arrival"] #threshold-title{color:#f0e6d4;top:20%;left:5.5%;width:62%}
#threshold-scene[data-movement="arrival"] #threshold-voice{top:16%;left:6%}
#threshold-scene[data-movement="occupant"] #threshold-title{top:16%;left:4.5%;font-size:clamp(80px,13.2vw,211px);color:#f0e6d4}
#threshold-scene[data-movement="occupant"] #threshold-title span+span{margin-left:0}
#threshold-scene[data-movement="occupant"] #threshold-body{right:auto;left:7%;bottom:14%;width:25%}
#threshold-scene[data-movement="touch"] #threshold-title{left:65%;top:22%;width:32%;font-size:clamp(65px,7.6vw,122px);color:var(--paper)}
#threshold-scene[data-movement="touch"] #threshold-title span+span{margin-left:-7%}
#threshold-scene[data-movement="touch"] #threshold-voice{left:66%;top:16%}
#threshold-scene[data-movement="touch"] #threshold-body{right:5%;bottom:19%;width:27%}
#threshold-scene[data-movement="desire"] #threshold-title{left:5%;top:17%;font-size:clamp(70px,10vw,160px);width:53%}
#threshold-scene[data-movement="desire"] #threshold-title span+span{margin-left:2%}
#threshold-scene[data-movement="desire"] #threshold-body{right:auto;left:8%;bottom:14%;width:29%}
#threshold-scene[data-movement="empty"] #threshold-title{top:62%;left:6%;font-size:clamp(70px,7.4vw,120px);width:55%}
#threshold-scene[data-movement="empty"] #threshold-voice{top:57%;left:6.5%}
#threshold-scene[data-movement="empty"] #threshold-body{bottom:16%;right:5%;width:24%}
#threshold-scene[data-movement="keep"] #threshold-title{left:9%;top:22%;width:43%;font-size:clamp(60px,6vw,96px)}
#threshold-scene[data-movement="keep"] #threshold-title span+span{margin-left:0}
#threshold-scene[data-movement="keep"] #threshold-voice{left:9.5%;top:17%}
#threshold-scene[data-movement="keep"] #threshold-body{left:10%;right:auto;bottom:18%;width:26%}
#threshold-looking{position:absolute;right:5.5%;bottom:7.5%;width:190px;pointer-events:auto;font:11px/1.4 Threshold Sans,sans-serif;text-shadow:0 1px 12px #000}
#threshold-looking label{display:flex;justify-content:space-between;gap:12px}
#threshold-focus{appearance:none;-webkit-appearance:none;width:100%;height:26px;margin:2px 0 0;background:transparent;cursor:ew-resize;opacity:.9}
#threshold-focus::-webkit-slider-runnable-track{height:1px;background:#eee7db88}
#threshold-focus::-webkit-slider-thumb{-webkit-appearance:none;width:9px;height:9px;margin-top:-4px;border:1px solid #eee7db;background:#352c21;border-radius:50%}
#threshold-focus::-moz-range-track{height:1px;background:#eee7db88}
#threshold-focus::-moz-range-thumb{width:8px;height:8px;border:1px solid #eee7db;background:#352c21;border-radius:50%}
#threshold-focus:focus-visible{outline:2px solid #eee7db;outline-offset:4px}
@media(min-width:651px) and (max-height:500px){
 #threshold-scene[data-movement="touch"] #threshold-body{bottom:25%;font-size:14px;line-height:1.5}
 #threshold-looking{width:225px}
}
.in-threshold #caption,.in-threshold #apparition,.in-threshold #stage>.shadows{visibility:hidden}
.in-threshold header,.in-threshold footer{z-index:6}
.in-threshold footer #instruction{visibility:hidden}
.in-threshold #loading{display:none}
.in-threshold header .author{opacity:.75}
.in-threshold footer{color:#eee7db;text-shadow:0 1px 12px #000}
.in-threshold header{color:#eee7db;text-shadow:0 1px 12px #000}
.in-threshold #threshold-scene:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(0deg,#110f0b66,transparent 23%,transparent 86%,#110f0b66)}
@media(max-width:650px){
 #threshold-title,#threshold-scene[data-movement="arrival"] #threshold-title,#threshold-scene[data-movement="occupant"] #threshold-title{font-size:clamp(64px,19vw,122px);width:93%;left:5%;top:17%}
 #threshold-title span+span{margin-left:4%}
 #threshold-voice,#threshold-scene[data-movement="arrival"] #threshold-voice{top:12%;left:6%;font-size:11px}
 #threshold-body,#threshold-scene[data-movement="occupant"] #threshold-body,#threshold-scene[data-movement="desire"] #threshold-body,#threshold-scene[data-movement="empty"] #threshold-body,#threshold-scene[data-movement="keep"] #threshold-body{left:7%;right:auto;bottom:17%;width:70%;font-size:14px;line-height:1.55}
 #threshold-scene[data-movement="touch"] #threshold-title{top:17%;left:46%;width:53%;font-size:12.5vw}
 #threshold-scene[data-movement="touch"] #threshold-voice{left:47%;top:12%;width:45%}
 #threshold-scene[data-movement="touch"] #threshold-body{left:47%;right:auto;bottom:21%;width:46%;font-size:14px}
 #threshold-scene[data-movement="desire"] #threshold-title{left:6%;top:18%;width:91%;font-size:17vw}
 #threshold-scene[data-movement="empty"] #threshold-title{left:7%;top:44%;width:90%;font-size:17vw}
 #threshold-scene[data-movement="empty"] #threshold-voice{left:7%;top:39%}
 #threshold-scene[data-movement="keep"] #threshold-title{left:7%;top:22%;width:91%;font-size:15.5vw}
 #threshold-scene[data-movement="keep"] #threshold-voice{left:7%;top:17%}
 #threshold-looking{right:7%;bottom:8%;width:165px;font-size:10px}
 .in-threshold header .author{display:none}
}