/* Home: "Korea, open now." A departure board under a sky that follows Seoul's clock. */
.open-now{--sky-a:var(--chalk);--sky-b:var(--chalk);--on-text:var(--ink);--on-muted:var(--muted);--sun:#f2b134;--sun-x:78%;--sun-y:16%;--sun-o:0;--stars-o:0;
  position:relative;overflow:hidden;color:var(--on-text);background:linear-gradient(180deg,var(--sky-a) 0%,var(--sky-b) 100%);padding:clamp(34px,4.6vw,66px) 0 clamp(46px,5.5vw,80px);transition:background .8s ease,color .8s ease}
.open-now[data-phase=dawn]{--sky-a:#f7e6d6;--sky-b:var(--chalk);--sun:#f4a25f;--sun-x:84%;--sun-y:44%;--sun-o:.75}
.open-now[data-phase=day]{--sky-a:#f6f2e8;--sky-b:var(--chalk);--sun:#f2c14e;--sun-x:80%;--sun-y:-6%;--sun-o:.55}
.open-now[data-phase=dusk]{--sky-a:#f2a77f;--sky-b:#f3e2cf;--sun:#ed562f;--sun-x:82%;--sun-y:46%;--sun-o:.9;--on-muted:#4d4238}
.open-now[data-phase=night]{--sky-a:#0e1117;--sky-b:#191817;--on-text:var(--chalk);--on-muted:#b7afa2;--sun:#f3f0e8;--sun-x:84%;--sun-y:10%;--sun-o:.9;--stars-o:1}
.open-now-sky{position:absolute;inset:0;pointer-events:none}
.sky-sun{position:absolute;left:var(--sun-x);top:var(--sun-y);width:clamp(180px,24vw,360px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,var(--sun) 0 38%,transparent 70%);opacity:var(--sun-o);filter:blur(2px);transition:all 1.2s ease}
.open-now[data-phase=night] .sky-sun{width:clamp(70px,7vw,110px);background:radial-gradient(circle at 40% 40%,#fffdf7 0 46%,rgba(243,240,232,.18) 52%,transparent 70%);filter:none}
.sky-stars{position:absolute;inset:0;opacity:var(--stars-o);transition:opacity 1.2s ease;background-image:radial-gradient(1.4px 1.4px at 12% 18%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 28% 8%,#fff 50%,transparent 51%),radial-gradient(1.6px 1.6px at 46% 22%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 61% 6%,#fff 50%,transparent 51%),radial-gradient(1.2px 1.2px at 70% 30%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 92% 34%,#fff 50%,transparent 51%),radial-gradient(1.3px 1.3px at 36% 36%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 6% 40%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 54% 40%,#fff 50%,transparent 51%)}
.open-now-inner{position:relative}
.open-now-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(24px,4vw,64px);align-items:end;margin-bottom:clamp(28px,3.4vw,46px)}
.open-now-eyebrow{color:var(--on-text);margin:0 0 clamp(16px,2vw,26px)}
.open-now-eyebrow::before{display:none}
.live-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 0 rgba(237,86,47,.6);animation:live-pulse 2s infinite}
@keyframes live-pulse{0%{box-shadow:0 0 0 0 rgba(237,86,47,.55)}70%{box-shadow:0 0 0 10px rgba(237,86,47,0)}100%{box-shadow:0 0 0 0 rgba(237,86,47,0)}}
.open-now-title{font-family:var(--display);font-weight:400;font-size:clamp(76px,12.6vw,198px);line-height:.86;letter-spacing:-.01em;margin:0;text-transform:uppercase;color:var(--on-text)}
.open-now-title em{font-family:var(--body);font-style:normal;text-transform:none;color:var(--orange);letter-spacing:-.02em;font-size:.92em}
.open-now[data-phase=dusk] .open-now-title em{color:#191817}
.open-now-lede{max-width:52ch;margin:clamp(18px,2vw,28px) 0 0;font-size:clamp(16px,1.25vw,19px);line-height:1.7;color:var(--on-muted)}
.open-now-clock{text-align:right;padding-bottom:6px}
.clock-phase{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;margin:0;color:var(--on-muted)}
.clock-big{color:var(--on-text);font-family:var(--display);font-size:clamp(84px,10.4vw,164px);line-height:.9;margin:6px 0 4px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.clock-date{color:var(--on-text);font-family:'richmond-display',Georgia,serif;font-size:clamp(18px,1.6vw,24px);margin:0}

/* The board */
.board{position:relative;background:#141312;color:var(--chalk);border-radius:10px;padding:clamp(16px,2vw,26px) clamp(14px,2vw,28px) clamp(14px,1.6vw,20px);box-shadow:0 30px 60px -30px rgba(20,19,18,.55),inset 0 0 0 1px rgba(243,240,232,.07)}
.open-now[data-phase=night] .board{box-shadow:0 0 0 1px rgba(243,240,232,.14),0 30px 80px -20px rgba(237,86,47,.22)}
.board-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:14px;border-bottom:1px solid rgba(243,240,232,.14)}
.board-title{margin:0;font-family:var(--display);font-size:clamp(22px,2vw,30px);letter-spacing:.04em;text-transform:uppercase}
.board-live{display:flex;align-items:center;gap:10px;margin:0;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#cfc7b8;font-variant-numeric:tabular-nums}
.board-head,.board-row{display:grid;grid-template-columns:clamp(96px,10vw,140px) minmax(0,1.5fr) minmax(0,.8fr) minmax(0,1fr);gap:clamp(10px,1.4vw,22px);align-items:center}
.board-head{padding:12px 12px 8px;font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#8f877a}
.board-rows{list-style:none;margin:0;padding:0;counter-reset:row}
.board-row{position:relative;min-height:58px;padding:8px 12px;border-radius:4px;background:linear-gradient(180deg,#201f1d 0 50%,#1b1a18 50% 100%);margin-top:6px}
.board-row::after{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.55);pointer-events:none}
.board-row>*{position:relative;z-index:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--display);text-transform:uppercase;letter-spacing:.05em;line-height:1.1}
.board-time{font-size:clamp(24px,2.3vw,34px);color:#f5c04a;font-variant-numeric:tabular-nums}
.board-what{font-size:clamp(19px,1.7vw,26px);color:var(--chalk);text-decoration:none}
.board-what:hover,.board-what:focus-visible{color:var(--orange)}
.board-where{font-size:clamp(15px,1.25vw,19px);color:#cfc7b8}
.board-status{justify-self:start;font-size:clamp(13px,1.05vw,16px);letter-spacing:.07em;padding:6px 10px 5px;border:1.5px solid rgba(243,240,232,.32);border-radius:3px;color:var(--chalk)}
.board-row[data-state=open] .board-status{background:var(--orange);border-color:var(--orange);color:#141312}
.board-row[data-state=closing] .board-status{border-color:var(--orange);color:#ffb08f}
.board-row[data-state=closed]>*{color:#7d766b}
.board-row[data-state=closed] .board-status{border-color:rgba(243,240,232,.14);color:#7d766b}
.board-row[data-state=closed] .board-time{color:#8d7a4c}
.is-flapping{color:#f5c04a!important}
.board-foot{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;padding-top:16px;margin-top:14px;border-top:1px solid rgba(243,240,232,.14);font-size:12px;color:#a8a093}
.board-foot p{margin:0}
.board-foot a{color:var(--chalk)}

/* Night: the header goes dark with the sky. */
body[data-phase=night] .site-header{background:rgba(14,17,23,.96);border-bottom-color:rgba(243,240,232,.2);color:var(--chalk)}
body[data-phase=night] .site-header .header-tools button{color:var(--chalk);border-color:rgba(243,240,232,.35)}
body[data-phase=night] .site-header .header-tools button:hover{background:rgba(243,240,232,.1)}
body[data-phase=night] .site-header .wordmark-top{color:var(--chalk)}body[data-phase=night] .site-header .wordmark-bottom{color:#9db8e8}body[data-phase=night] .site-header .brand-day{display:none}body[data-phase=night] .site-header .brand-night{display:block}

/* Festival tickets */
.fest-strip{padding:clamp(64px,7vw,110px) 0;background:var(--paper);border-top:1px solid var(--ink)}
.fest-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.fest-ticket{--notch:var(--paper);position:relative;display:grid;grid-template-rows:auto 1fr auto;background:var(--chalk);border:1.5px solid var(--ink);text-decoration:none;color:var(--ink);transition:transform .25s ease,box-shadow .25s ease}
.fest-ticket:hover{transform:translateY(-4px) rotate(-.6deg);box-shadow:0 18px 30px -18px rgba(25,24,23,.45)}
.fest-date{display:flex;align-items:baseline;gap:10px;padding:18px 20px 14px;background:var(--ink);color:var(--chalk)}
.fest-date b{font-family:var(--display);font-weight:400;font-size:64px;line-height:.9}
.fest-date i{font-family:var(--body);font-size:26px;color:var(--orange)}
.fest-ticket.is-on .fest-date{background:var(--orange);color:var(--ink)}
.fest-ticket.is-on .fest-date i{color:var(--ink)}
.fest-body{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px}
.fest-body small{font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.fest-body strong{font-family:var(--display);font-weight:400;font-size:clamp(26px,2.1vw,32px);line-height:1.02;text-transform:uppercase}
.fest-body>span{font-size:13px;line-height:1.6;color:#575149}
.fest-stub{position:relative;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 20px;border-top:2px dashed var(--line);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.fest-stub::before,.fest-stub::after{content:'';position:absolute;top:-12px;width:22px;height:22px;border-radius:50%;background:var(--notch);border:1.5px solid var(--ink)}
.fest-stub::before{left:-12px;clip-path:inset(0 0 0 50%)}.fest-stub::after{right:-12px;clip-path:inset(0 50% 0 0)}
.fest-stub em{font-style:normal;color:#a93618}
.fest-ticket.is-on .fest-stub em{color:var(--ink);background:var(--orange);padding:3px 8px}

/* Boarding passes */
.pass-strip{padding:clamp(64px,7vw,110px) 0;border-top:1px solid var(--ink)}
.pass-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.pass{position:relative;display:flex;flex-direction:column;background:var(--paper);border-radius:14px;overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:0 1px 0 rgba(25,24,23,.18),0 0 0 1px rgba(25,24,23,.1);transition:transform .25s ease,box-shadow .25s ease}
.pass:hover{transform:translateY(-5px);box-shadow:0 22px 34px -20px rgba(25,24,23,.5),0 0 0 1px rgba(25,24,23,.14)}
.pass-top{display:flex;justify-content:space-between;gap:10px;padding:12px 18px;background:var(--ink);color:var(--chalk)}
.pass-top small{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.pass-top small:last-child{color:var(--orange)}
.pass-route{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:12px;padding:20px 18px 6px}
.pass-route small{display:block;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.pass-route b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(36px,3vw,48px);line-height:.9}
.pass-route>span:first-child b{font-size:clamp(20px,1.5vw,24px);padding-bottom:3px}
.pass-route>span:last-child b{color:var(--orange)}
.pass-plane{position:relative;min-width:34px;height:2px;margin-bottom:22px;background:repeating-linear-gradient(90deg,var(--ink) 0 6px,transparent 6px 11px)}
.pass-plane::after{content:'';position:absolute;right:-2px;top:50%;width:11px;height:11px;border-radius:50%;background:var(--orange);transform:translateY(-50%)}
.pass-city{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding:12px 18px 0}
.pass-city strong{font-family:'richmond-display',Georgia,serif;font-weight:400;font-size:clamp(24px,1.9vw,30px);line-height:1.05}
.pass-city .korean-text{font-size:15px;color:var(--muted)}
.pass-line{padding:8px 18px 18px;font-size:14px;line-height:1.6;color:#575149;flex:1}
.pass-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px 16px;border-top:2px dashed var(--line);font-size:13px;font-weight:600}
.pass-foot small{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.pass-code{width:96px;height:34px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 4px,var(--ink) 4px 5px,transparent 5px 8px,var(--ink) 8px 11px,transparent 11px 13px)}
.pass-soon{background:#f7f4ec}
.pass-soon .pass-top{background:#4a4640}
.pass-soon .pass-route>span:last-child b{color:var(--ink)}
.pass-soon .pass-plane{background:repeating-linear-gradient(90deg,#8d867b 0 6px,transparent 6px 11px)}
.pass-soon .pass-plane::after{background:#8d867b}

@media(max-width:1280px){.pass-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1100px){.fest-grid,.pass-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .open-now-head{grid-template-columns:1fr;gap:20px}
  .open-now-clock{text-align:left;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 16px;padding:14px 0 0;border-top:1px solid currentColor}
  .clock-phase{flex-basis:100%}
  .clock-big{font-size:64px;margin:0}
  .open-now-title{font-size:clamp(64px,19vw,100px)}
  .board{padding:14px 10px 12px;border-radius:8px}
  .board-head{display:none}
  .board-row{grid-template-columns:78px minmax(0,1fr);grid-template-rows:auto auto;gap:6px 12px;padding:11px 10px;background:#1d1c1a}
  .board-what{white-space:normal;overflow:visible}
  .board-row::after{display:none}
  .board-time{grid-row:1/3;font-size:21px;white-space:normal;overflow:visible;line-height:1}
  .board-what{font-size:19px}
  .board-where{display:none}
  .board-status{grid-column:2;font-size:12px;padding:4px 8px 3px}
  .board-title{font-size:19px}
  .board-top{align-items:flex-start}
  .board-live{font-size:10px;white-space:nowrap}
}
@media(max-width:560px){.fest-grid,.pass-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.live-dot{animation:none}.fest-ticket:hover,.pass:hover{transform:none}}
body.reduced-motion .live-dot,body.motion-paused .live-dot{animation:none}
