/* 華航 2026 ITF ─ AI 時空旅拍｜目的地入口（出境航班看板） */
:root{--navy:#1d294c;--plum:#ca5766;--red:#a12132;--paper:#fbf7f1;--muted:#6a7290;--amber:#ffcf6b;
  --serif:"Noto Serif TC",serif;--sans:"Noto Sans TC",system-ui,-apple-system,"PingFang TC",sans-serif;--mono:"Space Mono",monospace;--cond:"Barlow Condensed","Noto Sans TC",sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--sans);color:var(--navy);background:linear-gradient(180deg,#cfe0f3,#eef4fb 42%,#fbf7f1 80%);-webkit-font-smoothing:antialiased;overflow:hidden}
a{color:inherit;text-decoration:none}
svg{display:block}
.lp{position:relative;max-width:460px;height:100dvh;margin:0 auto;overflow:hidden}
.lp-sky{position:absolute;inset:0;pointer-events:none}
.lp-sky svg{width:100%;height:100%}
.lp-sky path{fill:none;stroke:var(--navy);stroke-opacity:.12;stroke-width:1.2;stroke-dasharray:2 7;stroke-linecap:round}
.lp-inner{position:relative;display:flex;flex-direction:column;min-height:100%;padding:calc(env(safe-area-inset-top) + 14px) 18px calc(env(safe-area-inset-bottom) + 14px)}
.lp-top{display:flex;align-items:center;justify-content:space-between;height:40px}
.lp-top img{height:21px}
.lp-itf{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15}
.lp-itf b{font-family:var(--cond);font-size:17px;letter-spacing:.06em;color:var(--plum)}
.lp-itf span{font-size:10.5px;letter-spacing:.06em;color:var(--muted)}
.lp-kv{text-align:center;margin-top:10px;animation:rise .8s cubic-bezier(.2,.8,.2,1) both}
.lp-title{width:86%;max-width:330px;display:block;margin:0 auto}
.flap{display:inline-flex;gap:2px;margin-top:8px}
.flap i,.code i{font-style:normal;font-family:var(--cond);font-weight:700;line-height:1;display:grid;place-items:center;border-radius:3px;position:relative;animation:flip .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--k) * 35ms + 200ms)}
.flap i{width:13px;height:18px;font-size:12px;color:#fff;background:linear-gradient(180deg,#2c3b6c 0 49%,#16203f 51%)}
.flap i::after,.code i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.55)}
.flap em,.code em{width:5px}
.lp-kv p{margin-top:8px;font-size:13.5px;line-height:1.6;letter-spacing:.05em;font-weight:500}
@keyframes flip{0%{transform:rotateX(90deg)}60%{transform:rotateX(-20deg)}100%{transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

.board{margin-top:14px;background:linear-gradient(180deg,#16203f,#0c1430);border-radius:18px;padding:12px 10px 8px;color:#fff;box-shadow:0 18px 34px rgba(12,20,48,.32),inset 0 0 0 1px rgba(255,255,255,.08);animation:rise .8s cubic-bezier(.2,.8,.2,1) .15s both}
.board-head{display:flex;align-items:baseline;gap:8px;padding:0 6px 8px;border-bottom:1px solid rgba(255,255,255,.12)}
.board-head b{font-family:var(--cond);font-size:21px;letter-spacing:.1em;color:var(--amber)}
.board-head em{font-style:normal;font-size:11.5px;opacity:.7}
.board-head time{margin-left:auto;font-family:var(--mono);font-size:13px;color:var(--amber)}
.board-cols{display:grid;grid-template-columns:28px 64px 1fr 96px;gap:8px;padding:7px 6px 3px;font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;opacity:.5}
.board-cols span:first-child{grid-column:1/3}
.rows{display:flex;flex-direction:column}
.row{display:grid;grid-template-columns:28px 64px 1fr 96px;gap:8px;align-items:center;padding:8px 6px;border-top:1px solid rgba(255,255,255,.07);border-radius:10px;transition:background .25s;animation:rise .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--n) * 60ms + 300ms)}
.row:first-child{border-top:0}
.row:active,.row:hover{background:rgba(255,255,255,.06)}
.fl{width:26px;height:26px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35));transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.row:hover .fl,.row.picked .fl{transform:rotate(72deg) scale(1.12)}
.code{display:inline-flex;gap:2px}
.code i{width:18px;height:25px;font-size:17px;color:#fff;background:linear-gradient(180deg,#2c3b6c 0 49%,#1a254a 51%)}
.row.picked .code i{animation:flip .4s ease both;animation-delay:calc(var(--k) * 40ms - var(--n) * 120ms)}
.dest{min-width:0;display:flex;flex-direction:column;line-height:1.2}
.dest b{font-size:16px;letter-spacing:.06em;display:flex;align-items:baseline;gap:6px;white-space:nowrap}
.dest b small{font-size:11.5px;font-weight:500;opacity:.65;letter-spacing:.04em}
.dest em{font-style:normal;font-size:11.5px;color:var(--cc);filter:brightness(1.75) saturate(.9);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.gate{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.st{font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.08em;color:var(--amber);background:rgba(255,207,107,.14);padding:3px 8px;border-radius:4px;animation:blink 2.4s ease-in-out infinite;animation-delay:calc(var(--n) * .3s)}
.row.picked .st{color:#0c1430;background:#8ff0b8;animation:none}
.go{width:18px;height:18px;color:#fff;opacity:.6}
@keyframes blink{50%{opacity:.5}}
.lp-foot{margin-top:auto;padding-top:12px;text-align:center;font-size:11.5px;color:var(--muted);letter-spacing:.08em}
@media (min-width:600px){.lp{height:min(100dvh - 48px,920px);margin-top:max(24px,calc((100dvh - 920px)/2));border-radius:36px;box-shadow:0 30px 80px rgba(29,41,76,.3);background:linear-gradient(180deg,#cfe0f3,#eef4fb 42%,#fbf7f1 80%)}body{background:#10183a}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* 看板填滿剩餘高度，列距平均分配；收窄代碼與登機欄，避免長問候語被截斷 */
.board{flex:1;display:flex;flex-direction:column;min-height:0}
.rows{flex:1;justify-content:space-evenly}
.board-cols,.row{grid-template-columns:26px 58px 1fr 84px;gap:7px}
.code i{width:16px;height:23px;font-size:15px}
.dest em{font-size:11px;letter-spacing:-.01em}
.st{font-size:11.5px;padding:3px 6px}
.lp-foot{padding-top:10px}

/* 1013 客戶修改：新版 logo、狀態欄改為各國招呼語、GATE 改 CI */
.lp-top{height:48px}
.lp-top img{height:40px}
.lp-itf b{font-size:18px;letter-spacing:.08em}
.lp-itf span{color:var(--navy);font-weight:500;letter-spacing:.04em}
.board-cols,.row{grid-template-columns:26px 58px minmax(0,1fr) auto}
.board-cols span:last-child{text-align:right;padding-right:24px}
.dest b{font-size:16.5px}
.gate{min-width:0}
.st{font-family:var(--cond),"Noto Sans TC","Noto Sans Thai",sans-serif;font-size:12.5px;letter-spacing:.04em;padding:4px 8px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--amber)}
.st:lang(th){font-family:"Noto Sans Thai",var(--sans);font-size:13px}
.st:lang(kr),.st:lang(jp){font-family:var(--sans);font-weight:700;letter-spacing:.02em}