/* ATLAS 9.19.19 quick VÍ player */
#atlasQuick{position:fixed;inset:0;z-index:2147483000;background:#0b1220;color:#e8eef7;display:flex;flex-direction:column;font:500 14px/1.3 system-ui,-apple-system,"Segoe UI",sans-serif}
#atlasQuick[hidden]{display:none}
html.atlas-quick-open,html.atlas-quick-open body{overflow:hidden}
.aq-top{display:flex;align-items:center;gap:16px;padding:max(14px,env(safe-area-inset-top)) 32px 10px}
.aq-brand{font-weight:800;letter-spacing:.14em;font-size:13px;opacity:.9;margin-right:auto}
.aq-seg{display:inline-flex;background:rgba(255,255,255,.07);border-radius:999px;padding:3px}
.aq-seg button,.aq-chips button{appearance:none;border:0;background:none;color:inherit;font:inherit;padding:7px 12px;border-radius:999px;cursor:pointer;opacity:.75}
.aq-seg button[aria-pressed=true],.aq-chips button[aria-pressed=true]{background:#e8eef7;color:#0b1220;opacity:1}
#atlasQuickRegion{appearance:none;background:rgba(255,255,255,.07);color:inherit;border:0;border-radius:999px;padding:7px 12px;font:inherit}
#atlasQuickRegion option{color:#000}
.aq-live{appearance:none;border:1px solid rgba(255,255,255,.25);background:none;color:inherit;font:inherit;font-weight:700;padding:7px 14px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:7px}
.aq-live:before{content:"";width:7px;height:7px;border-radius:50%;background:#7a8597}
#atlasQuick.live-ready .aq-live{border-color:#4cc38a}
#atlasQuick.live-ready .aq-live:before{background:#4cc38a;box-shadow:0 0 0 3px rgba(76,195,138,.25)}
.aq-stage{position:relative;flex:1;min-height:0}
.aq-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .28s ease}
.aq-stage img.on{opacity:1}.aq-stage img.instant{transition:none}
.aq-title{position:absolute;left:14px;top:6px;font-size:12px;opacity:.7;z-index:1}
#atlasQuick.loading .aq-stage:after{content:"";position:absolute;left:50%;top:50%;width:28px;height:28px;margin:-14px;border:3px solid rgba(255,255,255,.2);border-top-color:#fff;border-radius:50%;animation:aqspin .8s linear infinite}
#atlasQuick.failed .aq-stage:after{content:"VÍ-kort náðust ekki. Opnaðu lifandi kortið.";position:absolute;inset:auto 0 45% 0;text-align:center;opacity:.8}
@keyframes aqspin{to{transform:rotate(1turn)}}
.aq-bar{display:grid;grid-template-columns:auto minmax(240px,1fr);align-items:center;gap:12px 40px;padding:16px 32px max(18px,env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(0,0,0,.35))}
.aq-ctrl{display:flex;align-items:center;gap:12px}
.aq-ctrl button{appearance:none;border:0;background:rgba(255,255,255,.08);color:inherit;width:40px;height:40px;border-radius:50%;cursor:pointer;display:grid;place-items:center;font-size:15px}
#atlasQuickPlay{width:48px;height:48px;background:#e8eef7;color:#0b1220}
#atlasQuickPlay[data-state=pause]:before{content:"";width:12px;height:14px;border-left:4px solid;border-right:4px solid;box-sizing:border-box}
#atlasQuickPlay[data-state=play]:before{content:"";border-left:13px solid;border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:3px}
#atlasQuickSpeed{font-size:12px;font-weight:700}
.aq-track{display:flex;align-items:center;gap:18px;min-width:0}
#atlasQuickTime{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap;min-width:9ch}
#atlasQuickRange{flex:1;min-width:60px;accent-color:#e8eef7}
.aq-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.aq-chips::-webkit-scrollbar{display:none}
@media (max-width:768px){
  .aq-top{flex-wrap:wrap;padding:max(8px,env(safe-area-inset-top)) 10px 6px}
  .aq-brand{display:none}
  .aq-seg{order:1}.aq-live{order:2;margin-left:auto}#atlasQuickRegion{order:3;width:100%}
  .aq-seg button{padding:7px 10px}
  .aq-top{gap:10px;padding:max(10px,env(safe-area-inset-top)) 14px 8px}
  .aq-seg{flex:1}.aq-seg button{flex:1}
  .aq-bar{grid-template-columns:1fr;gap:14px;padding:14px 16px max(16px,env(safe-area-inset-bottom))}
  .aq-chips{order:-2;justify-content:space-between;gap:6px}.aq-chips button{flex:1;padding:9px 6px}
  .aq-track{order:-1;gap:14px}
  .aq-ctrl{justify-content:space-between;padding:0 18px}
}

/* 9.19.19b: type chips get their own slim row above the play controls, never over the map */
.aq-chips{grid-column:1/-1;order:-1;justify-content:center;padding-bottom:4px;border-bottom:1px solid rgba(255,255,255,.08)}
@media (max-width:768px){.aq-chips{order:-2;justify-content:space-between;border-bottom:0;padding-bottom:0}}
/* 9.19.19c: pro transport — chips row, slider row, then ‹ far left, round play/pause dead centre, › far right; speed floats beside play without shifting the centre */
.aq-bar{grid-template-columns:1fr}
.aq-chips{order:1}.aq-track{order:2}.aq-ctrl{order:3}
.aq-ctrl{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;padding:0;gap:0}
#atlasQuickPrev{grid-column:1;grid-row:1}
#atlasQuickPlay{grid-column:2;grid-row:1;justify-self:center}
#atlasQuickNext{grid-column:3;grid-row:1}
#atlasQuickSpeed{position:absolute;left:calc(50% + 44px);top:50%;transform:translateY(-50%);width:auto;min-width:40px;height:30px;border-radius:15px;padding:0 10px;background:rgba(255,255,255,.06)}
#atlasQuickPrev,#atlasQuickNext{width:46px;height:46px;font-size:20px}
#atlasQuickPlay{width:58px;height:58px}
@media (max-width:768px){.aq-ctrl{padding:0}#atlasQuickPrev,#atlasQuickNext{width:44px;height:44px}#atlasQuickPlay{width:56px;height:56px}#atlasQuickSpeed{left:calc(50% + 40px)}}
/* 9.19.19d: desktop — compact centred cluster ‹ ▶ ›; speed sits just right of it. Phone keeps arrows at the outer ends. */
@media (min-width:769px){
  .aq-ctrl{grid-template-columns:1fr auto auto auto 1fr;column-gap:14px}
  #atlasQuickPrev{grid-column:2}#atlasQuickPlay{grid-column:3}#atlasQuickNext{grid-column:4}
  #atlasQuickSpeed{left:calc(50% + 105px)}
}

/* 9.19.21: Endurstilla + Tímabil */
.aq-reset,.aq-period-btn,.aq-period button{appearance:none;border:1px solid rgba(255,255,255,.18);background:none;color:inherit;font:inherit;font-weight:600;padding:7px 12px;border-radius:999px;cursor:pointer;white-space:nowrap}
.aq-period-btn[aria-pressed=true]{background:#e8eef7;color:#0b1220}
.aq-period{grid-column:1/-1;order:2;display:flex;gap:14px;align-items:center;justify-content:center;flex-wrap:wrap}
.aq-period[hidden]{display:none}
.aq-period label{display:inline-flex;gap:8px;align-items:center;opacity:.9}
.aq-period select{appearance:none;background:rgba(255,255,255,.08);color:inherit;border:0;border-radius:999px;padding:7px 12px;font:inherit}
.aq-period select option{color:#000}
.aq-ctrl{order:3}
@media (max-width:768px){.aq-reset{order:2;padding:7px 10px}.aq-live{order:2}}
.aq-live-reset-fab{position:fixed;left:12px;top:calc(env(safe-area-inset-top) + 124px);z-index:30;appearance:none;border:0;border-radius:999px;padding:8px 14px;background:rgba(18,24,30,.86);color:#fff;font:700 14px system-ui;box-shadow:0 2px 10px rgba(0,0,0,.3)}
html.atlas-quick-open .aq-live-reset-fab{display:none}
/* 9.19.22: slim scrollable chip row; Tímabil span shown on the slider */
.aq-chips{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;justify-content:safe center}
.aq-chips button{flex:0 0 auto!important;padding:7px 14px}
#atlasQuickRange{background:linear-gradient(90deg,rgba(255,255,255,.15) var(--ra,0%),rgba(232,238,247,.55) var(--ra,0%),rgba(232,238,247,.55) var(--rb,100%),rgba(255,255,255,.15) var(--rb,100%));height:6px;border-radius:3px;appearance:none;-webkit-appearance:none}
#atlasQuickRange::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:#e8eef7}
#atlasQuickRange::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#e8eef7;border:0}
@media (max-width:768px){.aq-chips{justify-content:flex-start}}
.aq-lang{padding:7px 10px;min-width:40px}
@media (max-width:768px){.aq-lang{order:2}}
/* 9.19.22b: Núna mirrors the speed pill on the other side of play — centre stays exact */
#atlasQuickNow{position:absolute;right:calc(50% + 44px);top:50%;transform:translateY(-50%);height:30px;padding:0 12px;font-size:13px;border-radius:15px;width:auto}
@media (max-width:768px){#atlasQuickNow{right:calc(50% + 40px)}}
@media (min-width:769px){#atlasQuickNow{right:calc(50% + 105px)}}
/* 9.19.23: static status dot (no pulse/halo), own Frá/Til picker */
.aq-live,.aq-live:before{animation:none!important;transition:none!important}
#atlasQuick.live-ready .aq-live:before{box-shadow:none}
.aq-pick{appearance:none;background:rgba(255,255,255,.08);color:inherit;border:0;border-radius:999px;padding:7px 12px;font:inherit;cursor:pointer}
.aq-picklist{flex-basis:100%;max-height:220px;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px;padding:8px;border-radius:14px;background:rgba(255,255,255,.05)}
.aq-picklist[hidden]{display:none}
.aq-picklist button{appearance:none;border:0;border-radius:10px;background:rgba(255,255,255,.07);color:inherit;font:inherit;padding:9px 8px;cursor:pointer}
.aq-picklist button[aria-selected=true]{background:#e8eef7;color:#0b1220}
.aq-picklist button:disabled{opacity:.3;cursor:default}
.aq-picklist{position:fixed;z-index:5;left:50%;transform:translateX(-50%);width:min(640px,calc(100% - 24px));bottom:calc(150px + env(safe-area-inset-bottom));max-height:45vh;background:#151d2c;box-shadow:0 10px 40px rgba(0,0,0,.5)}
/* 9.19.24: smooth playback — 250 ms crossfade over a frame that stays put, gliding thumb, fixed-width time label */
.aq-stage img{transition:opacity .25s linear;will-change:opacity}
.aq-stage img.instant{transition:none}
.aq-slider{position:relative;flex:1;min-width:60px;display:flex;align-items:center}
.aq-slider #atlasQuickRange{flex:1;width:100%;margin:0}
#atlasQuickRange::-webkit-slider-thumb{opacity:0}
#atlasQuickRange::-moz-range-thumb{opacity:0}
#atlasQuickThumb{position:absolute;top:50%;left:0;width:20px;height:20px;margin:-10px 0 0;border-radius:50%;background:#e8eef7;pointer-events:none;
  left:calc((100% - 20px) * var(--pp,0));transition:left .25s linear}
#atlasQuickTime{display:inline-block;width:16.5ch;min-width:16.5ch;text-align:left;font-variant-numeric:tabular-nums;overflow:hidden}
.aq-stage{isolation:isolate;z-index:0}.aq-bar{position:relative;z-index:2}
/* 9.19.25: zoomable map image, Fylla skjá, big day+time readout with day ticks */
.aq-stage{overflow:hidden;touch-action:none;cursor:grab}
.aq-stage.is-zoomed{cursor:move}
.aq-zoom{position:absolute;inset:0;transform-origin:50% 50%;will-change:transform}
.aq-title{pointer-events:none}
#atlasQuick.aq-fill .aq-top>*:not(#atlasQuickFill){display:none}#atlasQuick.aq-fill .aq-top{justify-content:flex-end;padding-bottom:4px}
#atlasQuick.aq-fill .aq-chips{display:none}
#atlasQuick.aq-fill:not(:fullscreen) .aq-stage{flex:1}
#atlasQuick.aq-fill::after{content:none}
.aq-fill-btn[aria-pressed=true]{background:#e8eef7;color:#0b1220}
#atlasQuick.aq-fill .aq-bar{padding-top:8px}
#atlasQuick.aq-fill .aq-track::before{content:none}
.aq-fill-exit{display:none}
#atlasQuickTime{font-size:19px;font-weight:800;letter-spacing:.01em;width:21ch;min-width:21ch;color:#fff}
.aq-slider{padding-bottom:16px}
.aq-days{position:absolute;left:10px;right:10px;bottom:0;height:14px;pointer-events:none}
.aq-day{position:absolute;bottom:0;transform:translateX(-1px);font-size:10px;line-height:12px;opacity:.55;padding-left:3px;border-left:1px solid rgba(255,255,255,.35);white-space:nowrap}
.aq-day.on{opacity:1;font-weight:800;color:#fff;border-left-color:#fff}
@media (max-width:768px){
  .aq-track{display:grid;grid-template-columns:1fr auto;gap:6px 12px}
  #atlasQuickTime{grid-column:1;grid-row:1;font-size:18px;width:auto;min-width:0}
  #atlasQuickRangeBtn{grid-column:2;grid-row:1}
  .aq-slider{grid-column:1/-1;grid-row:2}
  .aq-fill-btn{order:2;padding:7px 10px}
}
.aq-stage img{-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
/* 9.19.26: picker sheet at the top of the player's stacking order; thumb rides above the day labels; tappable days */
#atlasQuick>.aq-picklist{z-index:50}
.aq-lab{display:inline-flex;gap:8px;align-items:center;opacity:.9}
.aq-slider{padding-bottom:22px}
#atlasQuickThumb{width:18px;height:18px;margin-top:-20px;box-shadow:0 1px 4px rgba(0,0,0,.5)}
.aq-days{height:18px;pointer-events:auto}
.aq-day{appearance:none;background:none;border:0;border-left:1px solid rgba(255,255,255,.35);color:inherit;font:inherit;font-size:11px;line-height:16px;padding:0 4px 0 3px;cursor:pointer;opacity:.6}
.aq-day.on{opacity:1}
.aq-day[aria-pressed=true]{background:#e8eef7;color:#0b1220;border-radius:6px;opacity:1}
/* 9.19.26b phone: big touch slider, day chips, crisp top menus, map fills the free height, controls never cut off */
@media (max-width:768px){
  #atlasQuick{height:100dvh;inset:0 0 auto 0}
  .aq-top,.aq-bar{flex:none}
  .aq-stage{flex:1 1 auto;min-height:120px}
  .aq-bar{padding-bottom:max(12px,env(safe-area-inset-bottom));gap:10px}
  .aq-seg{background:#1c2638;border:1px solid rgba(255,255,255,.22)}
  .aq-seg button{opacity:1;color:#fff;font-weight:700}
  .aq-seg button[aria-pressed=true]{background:#fff;color:#0b1220}
  .aq-chips button{opacity:1;color:#fff}
  .aq-reset,.aq-period-btn{opacity:1;color:#fff;border-color:rgba(255,255,255,.4);background:#151e2e}
  .aq-title{opacity:.95;background:rgba(11,18,32,.72);padding:2px 8px;border-radius:8px}
  .aq-slider{padding-bottom:0;flex-direction:column;align-items:stretch;gap:6px}
  .aq-slider #atlasQuickRange{height:44px;padding:17px 0;background-clip:content-box;border-radius:5px;margin:0}
  #atlasQuickThumb{width:28px;height:28px;top:22px;margin:-14px 0 0;left:calc((100% - 28px) * var(--pp,0))}
  /* 9.19.26c: swipeable day strip — 5 equal chips per screen, snap, fade edges */
  .aq-days{position:static;display:flex;gap:6px;height:auto;left:auto;right:auto;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;touch-action:pan-x;scrollbar-width:none;padding:2px 0;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 14px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 14px),transparent)}
  .aq-days::-webkit-scrollbar{display:none}
  .aq-day{position:static;flex:0 0 calc((100% - 24px) / 5);scroll-snap-align:start;height:46px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:#151e2e;opacity:1;color:#cfd8e6;padding:0;transform:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;line-height:1.1}
  .aq-day b{font-size:14px;font-weight:800;letter-spacing:.01em}
  .aq-day small{font-size:11px;font-weight:600;opacity:.75}
  .aq-day.on{border-color:#fff;color:#fff;outline:0}
  .aq-day[aria-pressed=true]{background:#e8eef7;border-color:#e8eef7;color:#0b1220}
  .aq-day[aria-pressed=true] small{opacity:.8}
}
.aq-dayloop{background:#e8eef7!important;color:#0b1220!important;font-weight:800}
@media (min-width:769px){.aq-days{touch-action:none}.aq-day small{display:none}.aq-day b{font-weight:inherit}}

/* 9.19.27 phone: (1) top row clears iOS 26 Safari's top scroll-edge blur — it sat at y≈10 px directly under the status bar
   (viewport-fit=cover + black-translucent, safe-area-inset-top = 0 in Safari tabs) so Safari blurred/faded it; now it starts below that
   band on a solid header. (2) no dead band under the play row: bar sits on the safe-area inset only, solid bg (the old transparent→black
   gradient was the lighter band), map takes the space. (3) map caption moves to the bottom-left so it never covers the VÍ timestamp. */
html,body{background:#0b1220}
@media (max-width:768px){
  #atlasQuick{inset:0;height:auto;background:#0b1220}
  .aq-top{background:#0b1220;padding-top:calc(env(safe-area-inset-top) + 22px)}
  .aq-bar{background:#0b1220;padding-bottom:calc(env(safe-area-inset-bottom) + 6px);margin:0}
  .aq-title{top:auto;bottom:6px;left:8px;font-size:11px}
}
/* 9.19.28: only two frame buffers; no per-image compositing hints */
.aq-stage img{will-change:auto}
