/* AirData v14 - the flight stage, the destinations in depth, tonight in the city (v14.js). Warm gold of v13; the glass stays
   on the controls, the scenes are photo and type; motion is transform and opacity only. */

/* ================================================================ «Рейсы»: the stage */
html.v13 #view .v14-stage { position:relative; height:430px; margin:4px -2px 14px; border-radius:30px; overflow:hidden; isolation:isolate;
  background:#0d0b08; box-shadow:0 24px 50px rgba(0,0,0,.45), 0 0 0 1px rgba(255,226,160,.16); }
html.v13 #view .v14-stage.nophoto { background:radial-gradient(120% 80% at 50% 0%, rgba(247,201,72,.28), rgba(13,11,8,0) 60%), #0d0b08; }
html.v13 #view .v14-stage .st-ph { position:absolute; inset:-4%; background-size:cover; background-position:center; filter:brightness(.66) saturate(1.12);
  animation:v14Ken 22s ease-in-out infinite alternate; will-change:transform; }
@keyframes v14Ken { from { transform:scale(1.04) translate3d(0,0,0); } to { transform:scale(1.14) translate3d(-2%,-1%,0); } }
html.v13 #view .v14-stage .st-grade { position:absolute; inset:0; background:linear-gradient(180deg, rgba(6,5,4,.55), rgba(6,5,4,.05) 30%, rgba(6,5,4,.2) 55%, rgba(8,7,5,.94) 100%); }
html.v13 #view .v14-stage .st-dur { position:absolute; top:16px; left:0; right:0; display:flex; justify-content:center; align-items:center; gap:6px; font-size:13px; font-weight:700; color:rgba(255,255,255,.85); z-index:2; }
html.v13 #view .v14-stage .st-dur svg.i { width:15px; height:15px; color:#F7C948; stroke:currentColor; }
html.v13 #view .v14-stage .st-arc { position:absolute; left:0; right:0; top:44px; width:100%; height:auto; z-index:2; overflow:visible; }
.v14-stage .st-arc .a0 { fill:none; stroke:rgba(255,255,255,.3); stroke-width:1.5; stroke-dasharray:1.2 3.2; }
.v14-stage .st-arc .a1 { fill:none; stroke:url(#v14g); stroke-width:2.8; stroke-linecap:round; stroke-dasharray:100; stroke-dashoffset:26; filter:drop-shadow(0 0 6px rgba(247,201,72,.8)); }
.v14-stage .st-arc .o { fill:#F7C948; } .v14-stage .st-arc .or { fill:none; stroke:#F7C948; stroke-opacity:.4; }
.v14-stage .st-arc .d { fill:#fff; } .v14-stage .st-arc .dr { fill:none; stroke:#fff; stroke-opacity:.35; }
.v14-stage .st-arc .or, .v14-stage .st-arc .dr { transform-box:fill-box; transform-origin:center; animation:v14Ping 2.6s ease-out infinite; }
.v14-stage .st-arc .dr { animation-delay:1.3s; }
@keyframes v14Ping { from { transform:scale(.5); opacity:1; } to { transform:scale(1.8); opacity:0; } }
.v14-stage .st-arc .pl path { fill:none; stroke:#fff; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.v14-stage .st-arc .plg { fill:#F7C948; opacity:.28; }
html.v13 #view .v14-stage .st-codes { position:absolute; left:18px; right:18px; top:196px; display:flex; align-items:flex-start; justify-content:space-between; z-index:3; }
html.v13 #view .v14-stage .st-c { width:44%; }
html.v13 #view .v14-stage .st-c.r { text-align:right; }
html.v13 #view .v14-stage .st-c > b { display:block; font-size:34px; font-weight:800; letter-spacing:.02em; line-height:1; text-shadow:0 4px 18px rgba(0,0,0,.5); }
html.v13 #view .v14-stage .cin { display:block; padding:0 !important; margin:4px 0 0 !important; background:none !important; border:0 !important; box-shadow:none !important; }
html.v13 #view .v14-stage .cin label { display:none; }
html.v13 #view .v14-stage .cin input { width:100%; background:none !important; border:0 !important; box-shadow:none !important; padding:2px 0 !important; margin:0;
  color:rgba(255,255,255,.8) !important; font-size:14px !important; font-weight:600; border-bottom:1px dashed rgba(255,255,255,.25) !important; border-radius:0 !important; }
html.v13 #view .v14-stage .st-c.r .cin input { text-align:right; }
html.v13 #view .v14-stage .cin input:focus { outline:none; border-bottom-color:#F7C948 !important; color:#fff !important; }
html.v13 #view .v14-stage .swap { flex:none; width:38px; height:38px; margin-top:4px; border-radius:50%; display:grid; place-items:center; color:#fff;
  background:linear-gradient(180deg, rgba(255,236,190,.2), rgba(255,214,140,.07)) !important; border:1px solid rgba(255,226,160,.32) !important;
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); transition:transform .4s cubic-bezier(.34,1.56,.64,1); }
html.v13 #view .v14-stage .swap:active { transform:rotate(180deg) scale(.92); }
html.v13 #view .v14-stage .st-price { position:absolute; left:18px; right:18px; bottom:16px; z-index:3; display:block; text-align:left; background:none !important; border:0 !important; padding:0 !important; color:#fff; box-shadow:none !important; }
html.v13 #view .v14-stage .st-price .kick { display:inline-block; font-size:12px; font-weight:800; color:#1a1307; background:#F7C948; border-radius:10px; padding:4px 10px; }
html.v13 #view .v14-stage .st-num { display:block; font-size:64px; font-weight:800; letter-spacing:-.03em; line-height:1.04; margin-top:6px; font-variant-numeric:tabular-nums;
  background:linear-gradient(100deg, #fff 10%, #FFE7A3 45%, #F7C948 90%); -webkit-background-clip:text; background-clip:text; color:transparent; }
html.v13 #view .v14-stage .st-price > span { display:block; font-size:15px; font-weight:600; color:rgba(255,255,255,.82); }
html.v13 #view .v14-stage .st-price:active { transform:scale(.98); }

/* sixty days of fares */
html.v13 #view .v14-bars { margin:0 0 14px; padding:14px 14px 10px; border-radius:24px; background:linear-gradient(180deg, #17130d, #110e09); border:1px solid rgba(255,220,150,.1); }
html.v13 #view .v14-bars .vb-head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:6px; }
html.v13 #view .v14-bars .vb-head b { font-size:18px; font-weight:800; }
html.v13 #view .v14-bars .vb-head em { font-style:normal; font-size:12px; color:rgba(255,255,255,.5); font-weight:600; }
html.v13 #view .v14-bars .vb-plot { position:relative; padding-top:24px; }
html.v13 #view .v14-bars .vb-cols { height:92px; display:flex; align-items:flex-end; gap:2px; }
html.v13 #view .v14-bars .vb-cols > button { flex:1; height:100%; min-width:0; padding:0 !important; margin:0; border:0 !important; border-radius:3px 3px 1px 1px !important; box-shadow:none !important;
  background:rgba(255,255,255,.18) !important; transform-origin:50% 100%; transform:scaleY(var(--h)); animation:v14Up .7s cubic-bezier(.22,1,.36,1) calc(var(--i) * 14ms) backwards; }
html.v13 #view .v14-bars .vb-cols > button.lo { background:rgba(247,201,72,.5) !important; }
html.v13 #view .v14-bars .vb-cols > button.best { background:linear-gradient(180deg, #FFF3CF, #F7C948) !important; box-shadow:0 0 16px rgba(247,201,72,.9) !important; }
html.v13 #view .v14-bars .vb-cols > button.sel { outline:1.5px solid #fff; outline-offset:1px; }
@keyframes v14Up { from { transform:scaleY(0); } }
html.v13 #view .v14-bars .vb-tip { position:absolute; top:0; transform:translateX(-50%); font-size:13px; font-weight:800; color:#F7C948; white-space:nowrap; animation:v14Fade .5s ease-out .9s backwards; }
html.v13 #view .v14-bars .vb-tip small { margin-left:4px; color:rgba(255,255,255,.55); font-weight:600; }
@keyframes v14Fade { from { opacity:0; transform:translateX(-50%) translate3d(0,6px,0); } }
html.v13 #view .v14-bars .vb-axis { position:relative; height:16px; margin-top:6px; font-size:11px; color:rgba(255,255,255,.45); font-weight:600; }
html.v13 #view .v14-bars .vb-axis span { position:absolute; transform:translateX(-10%); white-space:nowrap; }

/* the first flight of the day: a boarding pass */
html.v13 body #view .card.v2-flt.v14-pass.v14-pass.v14-pass { position:relative; padding-bottom:30px !important; background:linear-gradient(180deg, #1e1810, #14100a) !important; border:1px solid rgba(255,220,150,.18) !important; }
html.v13 body #view .card.v2-flt.v14-pass.v14-pass.v14-pass::after { content:""; display:block !important; position:absolute; left:18px; right:18px; bottom:16px; border-top:2px dashed rgba(255,255,255,.14); }
html.v13 body #view .card.v2-flt.v14-pass.v14-pass.v14-pass::before { content:""; position:absolute; left:-9px; right:-9px; bottom:8px; height:18px; display:block !important;
  background:radial-gradient(circle at 0 50%, #0b0a08 8px, transparent 9px), radial-gradient(circle at 100% 50%, #0b0a08 8px, transparent 9px); pointer-events:none; }
html.v13 body #view .card.v2-flt.v14-pass.v14-pass.v14-pass .pr { font-size:22px !important; color:#F7C948; }

/* ================================================================ «Места»: the destinations in depth */
html.v13 #view .v14-head { margin:8px 4px 10px; }
html.v13 #view .v14-head h2 { font-size:32px; font-weight:800; letter-spacing:-.03em; line-height:1.05; }
html.v13 #view .v14-head small { display:block; margin-top:4px; font-size:14px; font-weight:600; color:rgba(255,255,255,.66); }
html.v13 #view .swipe.v14-flow { height:min(56vh, 400px); perspective:1000px; margin:0 -16px; }
html.v13 #view .swipe.v14-flow .scard { left:19%; right:19%; border-radius:30px; transition:transform .6s cubic-bezier(.22,1,.36,1), opacity .6s; box-shadow:0 30px 60px rgba(0,0,0,.55); }
html.v13 #view .swipe.v14-flow .scard.front { z-index:3; box-shadow:0 30px 70px rgba(0,0,0,.6), 0 0 0 1px rgba(255,226,160,.28), 0 0 44px rgba(247,201,72,.14); }
html.v13 #view .swipe.v14-flow .scard.back1 { z-index:2; transform:translate3d(58%,0,-160px) rotateY(-34deg) scale(.86); opacity:.6; }
html.v13 #view .swipe.v14-flow .scard.back2 { z-index:1; transform:translate3d(-58%,0,-160px) rotateY(34deg) scale(.86); opacity:.6; }
html.v13 #view .swipe.v14-flow .scard:not(.front) .sbody, html.v13 #view .swipe.v14-flow .scard:not(.front) .deal2 { opacity:0; }
html.v13 #view .swipe.v14-flow .scard::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.82)); pointer-events:none; }
html.v13 #view .swipe.v14-flow .sbody { z-index:2; left:16px !important; right:16px !important; bottom:14px !important; padding:0 !important; background:none !important; border:0 !important; box-shadow:none !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important; transition:opacity .4s; }
html.v13 #view .swipe.v14-flow .sbody b { font-size:30px; font-weight:800; letter-spacing:-.02em; text-shadow:0 4px 18px rgba(0,0,0,.5); }
html.v13 #view .swipe.v14-flow .tp { display:inline-block; font-size:15px !important; color:#1a1307 !important; background:#F7C948; border-radius:12px; padding:4px 10px; }
html.v13 #view .swipe.v14-flow .deal2 { z-index:2; }
html.v13 #view .v14-flow + .swbtns { margin-top:10px; }

/* the reason as a story */
html.v13 #view .v14-reason { margin:18px 0 10px; }
html.v13 #view .v14-reason .rs-deck { height:200px; }
html.v13 #view .v14-reason .v2-card.reason { height:200px; border-radius:26px !important; }
html.v13 #view .v14-steps { position:relative; margin:12px 2px 0; padding-left:2px; }
html.v13 #view .v14-steps::before { content:""; position:absolute; left:19px; top:18px; bottom:18px; width:2px; background:linear-gradient(180deg, #F7C948, rgba(247,201,72,.15)); }
html.v13 #view .v14-steps > div { position:relative; display:flex; align-items:center; gap:12px; padding:6px 0; animation:v14Rise .6s cubic-bezier(.22,1,.36,1) backwards; }
html.v13 #view .v14-steps > div:nth-child(2) { animation-delay:.12s; } html.v13 #view .v14-steps > div:nth-child(3) { animation-delay:.24s; }
@keyframes v14Rise { from { opacity:0; transform:translate3d(0,10px,0); } }
html.v13 #view .v14-steps span { width:36px; height:36px; flex:none; border-radius:50%; display:grid; place-items:center; background:#1d1810; border:1.5px solid #F7C948; color:#F7C948; z-index:1; }
html.v13 #view .v14-steps span svg.i { width:17px; height:17px; }
html.v13 #view .v14-steps b { font-size:14.5px; font-weight:700; }
html.v13 #view .v14-build { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:12px; height:52px; border-radius:18px; border:0;
  background:linear-gradient(180deg, #F9D46E, #D9A93C); color:#1a1307; font-size:16px; font-weight:800; box-shadow:0 10px 26px rgba(247,201,72,.3), inset 0 1px 0 rgba(255,255,255,.6); transition:transform .2s; }
html.v13 #view .v14-build svg.i { width:18px; height:18px; }
html.v13 #view .v14-build:active { transform:scale(.97); }

/* ================================================================ «Афиша»: tonight in the city */
html.v13 #view .v14-night { position:relative; margin:4px 4px 16px; }
html.v13 #view .v14-night .nt-top { display:flex; justify-content:flex-end; min-height:4px; }
html.v13 #view .v14-night .nt-wx { position:absolute; right:0; top:0; display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:16px; font-size:13px;
  background:linear-gradient(180deg, rgba(255,236,190,.16), rgba(255,214,140,.06)); border:1px solid rgba(255,226,160,.28); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); }
html.v13 #view .v14-night .nt-wx svg { width:18px; height:18px; }
html.v13 #view .v14-night .nt-wx small { color:rgba(255,255,255,.72); font-size:12px; }
html.v13 #view .v14-night .nt-clock { display:block; font-size:78px; font-weight:300; letter-spacing:-.045em; line-height:1; font-variant-numeric:tabular-nums; text-shadow:0 8px 40px rgba(0,0,0,.45); margin-top:22px;
  animation:v14Rise .8s cubic-bezier(.22,1,.36,1) backwards; }
html.v13 #view .v14-night .nt-date { display:block; margin-top:6px; font-size:15px; font-weight:600; color:rgba(255,255,255,.82); animation:v14Rise .8s cubic-bezier(.22,1,.36,1) .1s backwards; }
html.v13 #view .v14-night .nt-date::first-letter { text-transform:uppercase; }
html.v13 #view .v14-night .nt-n { display:inline-block; margin-top:10px; font-style:normal; font-size:13px; font-weight:800; color:#F7C948; animation:v14Rise .8s cubic-bezier(.22,1,.36,1) .2s backwards; }

/* the posters in depth */
html.v13 #view .v14-pflow { position:relative; height:268px; margin:6px -16px 0; perspective:1000px; touch-action:pan-y; }
html.v13 #view .v14-pflow > .pst { position:absolute !important; top:0; left:50%; width:188px !important; height:258px !important; margin:0 0 0 -94px !important; padding:0 !important; border-radius:22px !important;
  overflow:hidden; border:0 !important; background:#221c12 !important; box-shadow:0 24px 50px rgba(0,0,0,.6) !important; flex:none !important;
  transition:transform .7s cubic-bezier(.22,1,.36,1), opacity .7s, filter .7s; will-change:transform; }
html.v13 #view .v14-pflow > .pst[data-pos="0"] { z-index:5; transform:none; box-shadow:0 26px 60px rgba(0,0,0,.7), 0 0 0 1px rgba(255,226,160,.32), 0 0 50px rgba(247,201,72,.2) !important; }
html.v13 #view .v14-pflow > .pst[data-pos="1"] { z-index:4; transform:translate3d(64%,0,-150px) rotateY(-36deg) scale(.88); opacity:.62; }
html.v13 #view .v14-pflow > .pst[data-pos="-1"] { z-index:4; transform:translate3d(-64%,0,-150px) rotateY(36deg) scale(.88); opacity:.62; }
html.v13 #view .v14-pflow > .pst[data-pos="2"] { z-index:3; transform:translate3d(108%,0,-300px) rotateY(-44deg) scale(.78); opacity:.3; }
html.v13 #view .v14-pflow > .pst[data-pos="-2"] { z-index:3; transform:translate3d(-108%,0,-300px) rotateY(44deg) scale(.78); opacity:.3; }
html.v13 #view .v14-pflow > .pst[data-pos="3"], html.v13 #view .v14-pflow > .pst[data-pos="-3"] { z-index:1; transform:translate3d(0,0,-420px) scale(.6); opacity:0; pointer-events:none; }
html.v13 #view .v14-pflow > .pst .pimg { position:absolute; inset:0; background-size:cover; background-position:center; }
html.v13 #view .v14-pflow > .pst .psh { position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,0) 25%, rgba(0,0,0,0) 60%, rgba(0,0,0,.35)); }
html.v13 #view .v14-pflow > .pst .ptx { display:none !important; }
html.v13 #view .v14-pflow > .pst .tm { position:absolute; left:10px; top:10px; z-index:2; font-size:12px; font-weight:800; color:#1a1307; background:#F7C948; border-radius:10px; padding:3px 8px; }
html.v13 #view .v14-pflow > .pst:not([data-pos="0"]) .tm { opacity:0; }
html.v13 #view .v14-pcap { text-align:center; margin:10px 16px 2px; min-height:44px; }
html.v13 #view .v14-pcap b { display:block; font-size:18px; font-weight:800; line-height:1.2; }
html.v13 #view .v14-pcap small { display:block; margin-top:3px; font-size:13px; font-weight:600; color:rgba(255,255,255,.6); }

/* the kinds as photo tiles */
html.v13 #view .v12-cats.v14-tiles { display:grid !important; grid-template-columns:1fr 1fr; gap:10px; overflow:visible; margin:14px 0 16px !important; }
html.v13 #view .v12-cats.v14-tiles > button { position:relative; height:74px !important; min-height:74px !important; border-radius:18px !important; overflow:hidden; display:block !important; text-align:left; padding:0 !important;
  background:#1a150e !important; border:1px solid rgba(255,220,150,.1) !important; color:#fff; transition:transform .25s; }
html.v13 #view .v12-cats.v14-tiles > button:active { transform:scale(.97); }
html.v13 #view .v12-cats.v14-tiles .tph { position:absolute; inset:0; background-size:cover; background-position:center; filter:brightness(.55) saturate(1.1); }
html.v13 #view .v12-cats.v14-tiles .tph.none { background:radial-gradient(90% 120% at 0% 0%, rgba(247,201,72,.3), rgba(26,21,14,0) 70%); filter:none; }
html.v13 #view .v12-cats.v14-tiles .tsh { position:absolute; inset:0; background:linear-gradient(90deg, rgba(10,8,5,.86), rgba(10,8,5,.1)); }
html.v13 #view .v12-cats.v14-tiles b { position:absolute; left:14px; top:14px; display:flex; align-items:center; gap:7px; font-size:15px; font-weight:800; }
html.v13 #view .v12-cats.v14-tiles .ti svg.i { width:17px; height:17px; color:#F7C948; }
html.v13 #view .v12-cats.v14-tiles em { position:absolute; left:14px; bottom:10px; font-style:normal; font-size:12px; font-weight:600; color:rgba(255,255,255,.65); }
html.v13 #view .v12-cats.v14-tiles > button.on { border-color:#F7C948 !important; box-shadow:0 0 0 1px #F7C948, 0 8px 24px rgba(247,201,72,.25) !important; }

@media (prefers-reduced-motion: reduce) {
  html.v13 #view .v14-stage .st-ph, .v14-stage .st-arc .or, .v14-stage .st-arc .dr { animation:none; }
  html.v13 #view .v14-bars .vb-cols > button, html.v13 #view .v14-night *, html.v13 #view .v14-steps > div { animation:none; }
}
html.v13 #view .v14-reason > .sec { display:flex; justify-content:space-between; align-items:baseline; }
html.v13 #view .v14-reason > .sec .rs-n { font-style:normal; font-size:13px; font-weight:600; color:rgba(255,255,255,.55); }
