/* Persistent yuga orientation and explicitly named transitions. */
.journey-stage{padding-right:250px}
.journey-toolbar{height:67px}
.yuga-status{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:17px 0 20px;border-bottom:1px solid var(--line);flex-shrink:0}
.yuga-identity{display:grid;gap:3px}
.yuga-status-kicker{font-size:8px;letter-spacing:1.5px;color:#aebbae;line-height:1.3}
#current-yuga-name{font:32px/1.15 var(--serif);font-weight:400;color:var(--era);letter-spacing:-.5px}
#current-yuga-range{font-size:9px;color:#b3c0b3;letter-spacing:.15px}
.yuga-ending{text-align:right;display:grid;justify-items:end;gap:3px}
.yuga-ending>span{font-size:7px;letter-spacing:1.3px;color:#a9b5a8}
#jump-yuga-end{display:flex;align-items:center;gap:17px;padding:0;background:none;color:var(--era)}
#jump-yuga-end strong{font:20px/1.2 var(--serif);font-weight:400}
#jump-yuga-end>span{font-size:17px}
#jump-yuga-end:hover{color:#fff}
.yuga-ending small{font-size:9px;color:#c8cec1}
.yuga-progress-track{position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#c6bc9420}
#current-yuga-progress{display:block;width:0;height:100%;background:var(--era)}
.scene-frame{padding-top:22px;padding-bottom:22px}
.scene-copy h2{font-size:clamp(30px,3vw,46px)}
.scene-copy .era-label{font-size:10px;font-weight:600;letter-spacing:1.4px;margin-bottom:14px}
.is-yuga-ending .scene-copy h2>span,.is-yuga-ending .scene-copy h2>em{display:block}
.is-yuga-ending .scene-copy h2>em{color:var(--era);font-weight:400}
.is-yuga-ending .scene-date{font-size:clamp(23px,2.3vw,35px);margin-bottom:16px}
.is-yuga-ending .scene-copy .era-label{color:var(--gold)}
.boundary-overlay[hidden]{display:none}
.boundary-overlay{position:absolute;left:22px;right:22px;top:22px;background:#10211ce6;border:1px solid #d6b98588;border-left:3px solid var(--gold);padding:15px 18px;display:grid;gap:5px;backdrop-filter:blur(8px)}
.boundary-overlay>span{font-size:7px;letter-spacing:1.8px;color:var(--gold)}
.boundary-overlay>strong{font:27px/1.15 var(--serif);font-weight:400;color:#f2e7cf}
.boundary-overlay>small{font-size:11px;color:#d9cfb3;letter-spacing:.4px}
.is-yuga-ending .photo-number{display:none}
.time-ruler{width:214px;padding:23px 16px 25px 17px}
.ruler-top>span{font-size:8px;letter-spacing:1.6px;color:#b7c6b6}
.ruler-top>#ruler-current-yuga{display:block;font:17px/1.2 var(--serif);font-weight:400;color:var(--era);margin-top:10px}
.ruler-top>#ruler-live-date{display:block;font-size:12px;font-weight:500;color:#e6e5d3;margin-top:6px}
.ruler-top>small{font-size:7px;max-width:none;margin-top:6px}
.ruler-track{margin-top:29px;margin-bottom:33px}
.ruler-track:before{left:55px;background:#c3cba866}
#ruler-eras{left:0;width:46px}
.ruler-era{width:46px;background:color-mix(in srgb,var(--band-color) 10%,transparent);border-right:3px solid color-mix(in srgb,var(--band-color) 60%,transparent);opacity:1;display:grid;place-items:center;transition:background .2s}
.ruler-era>span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:10px;letter-spacing:1.7px;font-weight:600;color:color-mix(in srgb,var(--band-color) 85%,white);white-space:nowrap;line-height:1}
.ruler-era.is-current{background:color-mix(in srgb,var(--band-color) 28%,transparent);border-right-color:var(--band-color);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--band-color) 30%,transparent)}
.ruler-era.is-current>span{color:#fff8e4}
.ruler-tick{left:55px;font-size:8px;color:#a4b39d}
.ruler-tick span{left:14px;top:-5px}
.ruler-tick:before,.ruler-tick.boundary:before{width:8px}
.ruler-pin{left:53px}
#ruler-progress{left:55px}
#ruler-cursor{left:0;z-index:7}
#ruler-cursor>span{left:51px;top:-4px;width:9px;height:9px;box-shadow:0 0 0 3px #111917}
#cursor-date{display:none}
#ruler-input{position:absolute;inset:0;z-index:3;cursor:ns-resize}
#ruler-boundaries{position:absolute;inset:0;pointer-events:none;z-index:5}
.ruler-boundary{position:absolute;left:0;right:0;display:grid;gap:2px;text-align:left;padding:5px 0 5px 70px;border-top:1px solid color-mix(in srgb,var(--boundary-color) 70%,transparent);background:transparent;pointer-events:auto;color:#cfc7ac;line-height:1.2}
.ruler-boundary>strong{font-size:9px;text-transform:uppercase;letter-spacing:.6px;font-weight:600}
.ruler-boundary>span{font-size:8px;color:#c2c6b7;white-space:nowrap}
.ruler-boundary>i{position:absolute;top:-4px;left:52px;width:7px;height:7px;transform:rotate(45deg);background:var(--boundary-color);border:1px solid #111917}
.ruler-boundary:hover,.ruler-boundary.is-active{background:linear-gradient(90deg,transparent 30%,#d6b98522);color:#fff4d8;border-top-color:#f7d798}
.ruler-boundary.is-active>strong{color:#ffe6ae}
.ruler-boundary.is-active>i{box-shadow:0 0 0 3px #d6b98533}
.ruler-bottom{padding-left:0;font-size:10px}
.ruler-bottom>span{font-size:6px;max-width:150px;line-height:1.6;letter-spacing:1px}
@media(max-width:1100px){
 .journey-stage{padding-right:222px}
 .time-ruler{width:193px;padding-left:13px;padding-right:12px}
 #current-yuga-name{font-size:28px}
 .scene-copy h2{font-size:34px}
 .scene-summary{font-size:11px;line-height:1.8}
 .scene-frame{gap:5%;padding-top:18px;padding-bottom:18px}
 .scene-date{font-size:30px;margin-bottom:17px}
 .scene-context{padding-top:11px}
 .evidence-button{margin-top:15px}
 .boundary-overlay{left:15px;right:15px;top:15px;padding:12px 13px}
 .boundary-overlay>strong{font-size:23px}
}
@media(max-width:760px){
 .journey-stage{padding-left:4%;padding-right:126px}
 .journey-toolbar{height:51px}
 .yuga-status{display:block;padding:11px 0 12px}
 .yuga-identity{gap:3px}
 .yuga-status-kicker{font-size:6px;letter-spacing:1.1px}
 #current-yuga-name{font-size:24px;line-height:1.1;letter-spacing:-.4px}
 #current-yuga-range{font-size:7px;line-height:1.5;letter-spacing:0}
 .yuga-ending{display:flex;flex-wrap:wrap;align-items:center;gap:3px 8px;text-align:left;margin-top:7px}
 .yuga-ending>span{font-size:6px;letter-spacing:.7px}
 #jump-yuga-end{gap:6px}
 #jump-yuga-end strong{font:11px var(--sans);font-weight:500}
 #jump-yuga-end>span{font-size:11px}
 .yuga-ending small{font-size:7px}
 .scene-frame{padding-top:12px;padding-bottom:12px;gap:0}
 .scene-copy{padding-top:12px}
 .scene-copy .era-label{font-size:7px;margin-bottom:7px;letter-spacing:.8px}
 .scene-copy h2{font-size:29px;letter-spacing:-.8px;margin:10px 0}
 .scene-date,.is-yuga-ending .scene-date{font-size:22px;letter-spacing:-.5px;margin-bottom:9px}
 .scene-summary{font-size:10px;line-height:1.7;margin-bottom:11px}
 .scene-context{font-size:7px;padding-top:8px;gap:5px}
 .scene-context>div{grid-template-columns:50px 1fr;gap:6px}
 .evidence-button{margin-top:9px;font-size:9px}
 .boundary-overlay{top:10px;left:10px;right:10px;padding:8px 10px;gap:4px}
 .boundary-overlay>span{font-size:5px;letter-spacing:1px}
 .boundary-overlay>strong{font-size:18px}
 .boundary-overlay>small{font-size:8px}
 .time-ruler{width:112px;padding:18px 6px 20px 8px}
 .ruler-top>span{font-size:6px;letter-spacing:1px}
 .ruler-top>#ruler-current-yuga{font:13px/1.2 var(--serif);margin-top:9px}
 .ruler-top>#ruler-live-date{font-size:10px;margin-top:6px}
 .ruler-top>small{font-size:5px;line-height:1.5;max-width:80px;margin-top:5px}
 .ruler-track{margin-top:23px;margin-bottom:25px}
 .ruler-track:before{left:30px}
 #ruler-eras{width:24px}
 .ruler-era{width:24px;border-right-width:2px}
 .ruler-era>span{font-size:8px;letter-spacing:1px}
 .ruler-tick{left:30px;font-size:6px}
 .ruler-tick span{left:10px;top:-4px}
 .ruler-tick:before,.ruler-tick.boundary:before{width:6px}
 .ruler-pin{left:28px;width:4px;height:4px}
 #ruler-progress{left:30px}
 #ruler-cursor{left:0}
 #ruler-cursor>span{left:27px;width:7px;height:7px;top:-3px;box-shadow:0 0 0 2px #111917}
 .ruler-boundary{padding:4px 0 4px 40px;gap:2px}
 .ruler-boundary>strong{font-size:7px;line-height:1.3;letter-spacing:0}
 .ruler-boundary>span{font-size:6px;line-height:1.3}
 .ruler-boundary>i{width:5px;height:5px;left:28px;top:-3px}
 .ruler-bottom{font-size:8px;padding:0}
 .ruler-bottom>span{font-size:5px;letter-spacing:.5px;line-height:1.5}
 .journey-footer{font-size:6px;gap:6px}
 #journey-status{max-width:130px;line-height:1.5}
}
@media(max-width:760px) and (max-height:730px){
 #current-yuga-name{font-size:22px}
 .yuga-status{padding-top:9px;padding-bottom:10px}
 .yuga-ending small{display:none}
 .scene-photo{min-height:97px;flex-basis:26%}
 .scene-copy h2{font-size:25px;line-height:1.07;margin:8px 0}
 .scene-summary{font-size:9px;line-height:1.65;margin-bottom:6px}
 .scene-copy .era-label{font-size:6px}
 .scene-date,.is-yuga-ending .scene-date{font-size:20px;margin-bottom:7px}
 .scene-context{display:none}
 .evidence-button{margin-top:5px;font-size:8px}
 .boundary-overlay>strong{font-size:16px}
 .boundary-overlay>small{font-size:7px}
 .ruler-top>#ruler-current-yuga{font-size:12px}
 .ruler-track{margin-top:20px;margin-bottom:22px}
}
@media(min-width:761px) and (max-height:750px){
 .yuga-status{padding-top:12px;padding-bottom:14px}
 #current-yuga-name{font-size:26px}
 .scene-copy h2{font-size:32px}
 .scene-summary{font-size:11px;line-height:1.7;margin-bottom:14px}
 .scene-copy .era-label{margin-bottom:10px}
 .scene-date{font-size:28px;margin-bottom:13px}
 .scene-context{font-size:8px;padding-top:10px;gap:7px}
 .evidence-button{margin-top:13px}
}