/* HYPERREALITY / MOTION LAYER v1 / additive over existing corridor */
#hrj{--hr-silver:#dce5e9;--hr-metal:#b9c4ca; background:#06080b;}
#hrj .hrj-sky{z-index:-2;background:#07090c!important;overflow:hidden;isolation:isolate;transition:none;}
#hrj .hrj-sky video.hrj-night-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.74;filter:brightness(.62) contrast(1.18) saturate(.44);transform:scale(1.07);pointer-events:none;}
#hrj .hrj-sky:before{content:"";position:absolute;z-index:1;inset:0;background:radial-gradient(ellipse at 51% 34%,transparent 0%,#03040519 34%,#030405bc 86%),linear-gradient(180deg,#03040655,#03050811 40%,#020303b3 100%);pointer-events:none}
#hrj .hrj-sky:after{z-index:2;opacity:.19;background-image:radial-gradient(#d7e2ee 0.6px,transparent 0.8px)!important;background-size:73px 71px!important;animation:hrj-stars 32s linear infinite;pointer-events:none;}
#hrj .hrj-head,#hrj .hrj-main,#hrj .hrj-footer{position:relative;z-index:3;}
#hrj .hrj-head{padding-top:clamp(15px,3vh,32px)}
#hrj .hrj-brand{font-weight:530;letter-spacing:.22em;text-shadow:0 0 22px #faf5e82a;}
#hrj .hrj-brand b{color:#d9e4eb;font-size:24px;text-shadow:0 0 20px #d4edf2bb}
#hrj .hrj-menu{text-decoration:none;color:#bfc4c8;border-bottom:1px solid #92999a66;padding-bottom:5px}
#hrj .hrj-lang{border-radius:30px;border-color:#ccd1d133;background:#090c10a8;backdrop-filter:blur(10px)}
#hrj .hrj-main{width:min(100% - 40px,1160px);min-height:calc(100svh - 134px);padding:4px 0 13px;justify-content:center}
#hrj .hrj-art{width:clamp(310px,58vw,660px);height:clamp(210px,35vw,350px);position:relative;filter:drop-shadow(0 9px 52px #d9e9e82b);margin-bottom:-3px;overflow:visible;transform:translateZ(0);}
#hrj .hrj-art:before,#hrj .hrj-art:after{display:none!important;}
#hrj .hrj-glyph{display:none!important;}
#hrj .hrj-art{background-image:url('hyperreality-portal.svg');background-repeat:no-repeat;background-position:center;background-size:contain;animation:hrj-portal 16s ease-in-out infinite;}
#hrj .hrj-art::selection{background:transparent}
#hrj .hrj-kicker{font-size:10px;letter-spacing:.3em;margin:0 0 11px;color:#b8c5cc}
#hrj .hrj-title{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.043em;line-height:1.05;font-size:clamp(43px,6.1vw,74px);max-width:900px;margin-bottom:12px;text-wrap:balance;text-shadow:0 2px 36px #000}
#hrj .hrj-lead{color:#c6c8ca;font-size:clamp(15px,1.48vw,19px);line-height:1.45;margin-bottom:25px;max-width:720px;}
#hrj .hrj-choices{gap:14px;width:min(100%,790px);}
#hrj .hrj-choice{background:linear-gradient(115deg,#323943a6,#10131788 67%,#23262eaa);border:1px solid #bcc5ce59;border-radius:17px;min-height:113px;padding:22px 26px;box-shadow:inset 0 1px 0 #eff5f511,0 10px 37px #0000001e;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);}
#hrj .hrj-choice::before{width:120px;height:120px;left:-25px;top:-32px;right:auto;background:radial-gradient(circle at 50% 50%,#e2e8e838 0%,#f3ead60d 40%,transparent 70%);border-radius:50%;opacity:.8}
#hrj .hrj-choice::after{content:"";position:absolute;inset:-95% -90%;background:linear-gradient(118deg,transparent 46%,#fff7e314 50%,transparent 54%);transform:translateX(-50%);transition:transform .75s;pointer-events:none}
#hrj .hrj-choice:hover::after{transform:translateX(55%)}
#hrj .hrj-choice:hover,#hrj .hrj-choice:focus-visible{background:linear-gradient(115deg,#424b55ad,#1b2026c4);border-color:#e7e8e5a6;transform:translateY(-3px)}
#hrj .hrj-choice strong{position:relative;z-index:1;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(22px,2.9vw,31px);letter-spacing:-.024em}
#hrj .hrj-choice i{position:relative;z-index:1;font-size:25px;display:grid;place-items:center;min-width:39px;height:39px;border:1px solid #cbd4d46e;border-radius:50%;color:#dce3e7;font-weight:200}
#hrj .hrj-footer{padding-top:9px;padding-bottom:15px;color:#a5aaad}
#hrj .hrj-progress span{width:19px;height:2px;background:#9da6b052}
#hrj .hrj-progress span.active{background:#e3e7e4;box-shadow:0 0 12px #e5f1f1c4}
#hrj[data-mood='quiet'] .hrj-sky video{filter:brightness(.56) saturate(.28) sepia(.06)}
#hrj[data-mood='motion'] .hrj-sky video{filter:brightness(.71) contrast(1.2) saturate(.62)}
#hrj[data-mood='unknown'] .hrj-sky video{filter:brightness(.60) contrast(1.22) hue-rotate(8deg)}
@keyframes hrj-portal{0%,100%{transform:translate3d(0,2px,0) rotate(-.25deg) scale(1)}50%{transform:translate3d(0,-7px,0) rotate(.27deg) scale(1.026)}}
@keyframes hrj-stars{0%{transform:translateX(0)}50%{transform:translateX(-8px)}100%{transform:translateX(0)}}
@media(max-width:650px){
 #hrj .hrj-main{width:min(100% - 32px,470px);min-height:calc(100svh - 142px);padding-top:4px;padding-bottom:12px;}
 #hrj .hrj-art{width:min(100%,430px);height:clamp(163px,49vw,237px);margin:0 auto -7px}
 #hrj .hrj-title{font-size:clamp(39px,9.3vw,56px);margin-bottom:11px}
 #hrj .hrj-lead{font-size:14px;line-height:1.45;margin:0 auto 22px}
 #hrj .hrj-choices{grid-template-columns:1fr!important;gap:10px}
 #hrj .hrj-choice{min-height:66px;max-width:450px;padding:16px 19px;border-radius:13px;}
 #hrj .hrj-choice strong{font-size:23px}
 #hrj .hrj-choice i{min-width:32px;height:32px;font-size:20px}
 #hrj .hrj-footer{padding:12px 20px}
 #hrj .hrj-head{padding:15px 18px}
 #hrj .hrj-sky video.hrj-night-film{transform:scale(1.7);object-position:center}
}
@media(max-height:720px) and (max-width:650px){#hrj .hrj-art{height:146px}#hrj .hrj-kicker{margin-bottom:7px}#hrj .hrj-lead{margin-bottom:14px}#hrj .hrj-choice{min-height:61px}}
@media(prefers-reduced-motion:reduce){#hrj .hrj-sky video.hrj-night-film{display:none!important}#hrj .hrj-art,#hrj .hrj-sky:after{animation:none!important}}
