.page-journey{overflow:hidden;background:#100806}.journey-main{position:relative;height:100svh;min-height:700px;overflow:hidden;isolation:isolate}.journey-backdrop{position:absolute;z-index:-3;inset:0;background:url("../../assets/backgrounds/live-road-wadi-rum.png") center/cover no-repeat;transform:scale(1.01);transition:transform 8s ease}.journey-main.is-live .journey-backdrop{transform:scale(1.055)}.journey-shade{position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,rgba(4,3,3,.62),transparent 42%,rgba(5,3,2,.25)),linear-gradient(0deg,rgba(3,2,2,.35),transparent 45%,rgba(4,3,2,.28))}.page-journey .site-header{background:rgba(6,5,5,.38);backdrop-filter:blur(10px)}.page-journey .nav-shell{border-color:rgba(255,255,255,.14)}.journey-glass{border:1px solid rgba(255,255,255,.18);background:linear-gradient(145deg,rgba(255,255,255,.08),transparent 30%),rgba(10,11,11,.82);box-shadow:0 30px 80px rgba(0,0,0,.5);backdrop-filter:blur(20px)}
.journey-itinerary{position:absolute;z-index:5;top:128px;bottom:10vh;left:1.5vw;width:min(29vw,500px);padding:26px;border-radius:0 22px 22px 0}.journey-itinerary>header{display:flex;align-items:flex-start;gap:18px;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.14)}.journey-itinerary>header>a{width:53px;height:53px;flex:0 0 auto;display:grid;place-items:center;border:1px solid rgba(255,255,255,.26);border-radius:50%;font-size:1.55rem;transition:transform 180ms ease}.journey-itinerary>header>a:hover{transform:translateX(-4px)}.journey-itinerary header p{margin:0;color:#efbd68;font-size:.55rem;letter-spacing:.17em}.journey-itinerary h1{margin:3px 0 2px;font:500 2rem var(--serif)}.journey-itinerary header span{color:rgba(255,255,255,.65);font-size:.74rem}.journey-progress{display:flex;align-items:center;gap:12px;margin:15px 0}.journey-progress>span{height:4px;flex:1;overflow:hidden;border-radius:3px;background:rgba(255,255,255,.13)}.journey-progress i{display:block;width:20%;height:100%;border-radius:inherit;background:#efbd68;transition:width 500ms var(--ease)}.journey-progress b{color:rgba(255,255,255,.62);font-size:.59rem;font-weight:500}.journey-stops{height:calc(100% - 162px);overflow-y:auto;padding:2px 4px 2px 35px}.journey-stops::before{content:"";position:absolute;left:47px;top:155px;bottom:66px;width:2px;background:linear-gradient(#efbd68,rgba(255,255,255,.18))}.journey-stop{position:relative;width:100%;min-height:87px;display:grid;grid-template-columns:79px 1fr;align-items:center;gap:14px;padding:8px;border:1px solid transparent;border-radius:13px;background:transparent;color:#fff;text-align:left;cursor:pointer;transition:background 220ms ease,border-color 220ms ease,transform 220ms var(--ease)}.journey-stop:hover{transform:translateX(4px)}.journey-stop.is-current{border-color:rgba(235,185,99,.42);background:linear-gradient(100deg,rgba(224,151,65,.17),transparent)}.journey-stop.is-complete{opacity:.62}.journey-stop::before{content:attr(data-day);position:absolute;left:-35px;top:50%;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#f3d38f;color:#21140b;font-size:.65rem;font-weight:600;transform:translate(-50%,-50%);z-index:2}.journey-stop.is-complete::before{content:"✓";background:#7ea478;color:#fff}.journey-stop img{width:79px;height:70px;object-fit:cover;border-radius:9px}.journey-stop small{color:rgba(255,255,255,.52);font-size:.58rem}.journey-stop h2{margin:2px 0;font:500 1rem var(--serif)}.journey-stop p{margin:0;color:rgba(255,255,255,.55);font-size:.62rem}.journey-reset{position:absolute;left:26px;right:26px;bottom:17px;height:36px;border-radius:18px;background:rgba(255,255,255,.055);color:rgba(255,255,255,.62);font-size:.6rem;cursor:pointer}
.live-tools{position:absolute;z-index:7;right:3vw;top:136px;display:flex;gap:10px}.live-tools button{height:55px;border:1px solid rgba(255,255,255,.26);background:rgba(12,13,13,.7);color:#fff;backdrop-filter:blur(16px);cursor:pointer}.live-tools button:first-child{min-width:188px;padding:0 20px;border-radius:28px;display:flex;align-items:center;justify-content:center;gap:10px}.live-tools button:last-child{width:55px;border-radius:50%;font-size:1.4rem}.live-dot{width:11px;height:11px;border-radius:50%;background:#887c6f}.journey-main.is-live .live-dot{background:#e85035;box-shadow:0 0 0 0 rgba(232,80,53,.5);animation:live-pulse 1.5s infinite}
.next-stop-card{position:absolute;z-index:6;top:27vh;right:1.5vw;width:min(28vw,455px);padding:24px;border-radius:22px}.next-stop-card>header{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:12px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.14)}.next-stop-card>header>span{width:47px;height:47px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.07);font-size:1.8rem}.next-stop-card small{display:block;color:rgba(255,255,255,.55);font-size:.67rem}.next-stop-card h2{margin:1px 0 0;font:500 1.15rem var(--serif)}.next-stop-card header>b{font-size:.72rem;font-weight:500}.next-stop-visual{position:relative;height:180px;margin:15px 0;overflow:hidden;border-radius:13px}.next-stop-visual img{width:100%;height:100%;object-fit:cover;transition:transform 6s ease}.next-stop-visual button{position:absolute;z-index:2;inset:50% auto auto 50%;width:68px;height:68px;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(20,20,20,.66);color:#fff;font-size:.8rem;font-weight:700;transform:translate(-50%,-50%);cursor:pointer;backdrop-filter:blur(7px)}#preview-pulse{position:absolute;inset:50% auto auto 50%;width:70px;height:70px;border:1px solid rgba(255,255,255,.65);border-radius:50%;transform:translate(-50%,-50%);opacity:.45}.drive-stats{display:grid;grid-template-columns:1fr 1fr;margin-bottom:16px}.drive-stats>div{display:flex;align-items:center;gap:12px;padding:4px 12px}.drive-stats>div+div{border-left:1px solid rgba(255,255,255,.13)}.drive-stats>div>span{color:#efb83d;font-size:2rem}.drive-stats p{margin:0}.drive-stats strong{font-size:.78rem;font-weight:500}.drive-stats small{margin-top:2px}.open-map{height:58px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:0 19px;border:1px solid #e4c180;border-radius:15px;color:#fff;font-size:.78rem;font-weight:600}.open-map>span{font-size:1.4rem}.open-map>b{font-size:1.5rem}.journey-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.journey-actions button{height:44px;border-radius:22px;background:rgba(255,255,255,.06);color:#fff;font-size:.65rem;cursor:pointer}.journey-actions button:last-child{background:#efbd68;color:#25170e;font-weight:600}.journey-actions button:disabled{opacity:.35;cursor:not-allowed}
.speed-indicator{position:absolute;z-index:4;left:53%;bottom:5.8vh;display:grid;justify-items:center;color:#f1c5cc;text-shadow:0 3px 10px #000}.speed-indicator strong{font-size:2.4rem;font-weight:400}.speed-indicator span{font-size:.58rem}.journey-status{position:absolute;z-index:4;left:50%;bottom:3vh;padding:7px 12px;border-radius:15px;background:rgba(7,7,7,.44);color:rgba(255,255,255,.62);font-size:.58rem;transform:translateX(-50%);backdrop-filter:blur(8px)}
.journey-credit{display:block;margin-top:8px;color:rgba(255,255,255,.35);font-size:.49rem;text-align:center}.journey-credit a{color:rgba(255,255,255,.55)}
@keyframes live-pulse{70%{box-shadow:0 0 0 9px transparent}}@keyframes preview-pulse{to{width:145px;height:145px;opacity:0}}@media(max-width:1000px){.page-journey{overflow-y:auto}.journey-main{height:auto;min-height:1550px}.journey-backdrop{position:fixed;background-position:58% center}.journey-itinerary{top:125px;left:4vw;width:44vw;height:720px;bottom:auto;border-radius:20px}.next-stop-card{top:265px;right:4vw;width:44vw}.live-tools{right:4vw}.speed-indicator{display:none}.journey-status{top:205px;bottom:auto;left:auto;right:4vw;transform:none}}
@media(max-width:680px){.journey-main{min-height:1640px}.journey-backdrop{background-position:57% center}.live-tools{top:104px;right:4vw}.live-tools button:first-child{min-width:155px}.journey-status{top:168px}.journey-itinerary{position:relative;top:auto;left:auto;width:92vw;height:700px;margin:210px auto 0;padding:20px;border-radius:20px}.journey-itinerary>header{gap:12px}.journey-itinerary h1{font-size:1.65rem}.journey-stops::before{left:41px}.journey-stop::before{left:-27px}.journey-stops{padding-left:28px}.next-stop-card{position:relative;top:auto;right:auto;width:92vw;margin:20px auto}.next-stop-visual{height:210px}}
.journey-stop::before{left:-14px}
@media(max-width:680px){.journey-stop::before{left:-9px}}

@media(max-width:680px){
  .journey-main{padding-bottom:calc(28px + env(safe-area-inset-bottom))}
  .journey-stop,.journey-actions button,.open-map,.live-tools button{touch-action:manipulation}
  .journey-actions button{min-height:46px}
}
@media(max-width:380px){
  .live-tools{left:4vw;right:4vw;justify-content:flex-end}
  .live-tools button:first-child{min-width:132px;padding-inline:13px}
  .live-tools button:last-child{width:50px}
  .journey-itinerary{width:94vw;padding:17px;margin-top:205px}
  .journey-itinerary>header>a{width:46px;height:46px}
  .journey-itinerary h1{font-size:1.5rem}
  .journey-stop{grid-template-columns:68px minmax(0,1fr);gap:10px}
  .journey-stop img{width:68px;height:64px}
  .next-stop-card{width:94vw;padding:19px}
  .drive-stats>div{padding-inline:7px}
}

@media (min-width:1001px) {
  html[dir="rtl"] .journey-itinerary { left:auto; right:1.5vw; border-radius:22px 0 0 22px; }
  html[dir="rtl"] .next-stop-card { right:auto; left:1.5vw; }
  html[dir="rtl"] .live-tools { right:auto; left:3vw; }
}
html[dir="rtl"] .journey-stops { padding:2px 35px 2px 4px; }
html[dir="rtl"] .journey-stops::before { left:auto; right:47px; }
html[dir="rtl"] .journey-stop { text-align:right; }
html[dir="rtl"] .journey-stop::before { left:auto; right:-35px; transform:translate(50%,-50%); }
html[dir="rtl"] .drive-stats>div+div { border-left:0; border-right:1px solid rgba(255,255,255,.13); }
@media (max-width:680px) {
  html[dir="rtl"] .journey-stops { padding-right:28px; }
  html[dir="rtl"] .journey-stops::before { right:41px; }
  html[dir="rtl"] .journey-stop::before { right:-9px; }
}
