/* travel.tnaado.ca: dark theme on the shared TNAADO tokens (css/tokens.css). No invented values. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--on-black);font-family:var(--font-body);font-size:var(--text-base);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--on-black);text-decoration-color:var(--red);text-underline-offset:3px}
a:hover,a:focus-visible{color:var(--red)}
:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.skip{position:absolute;left:var(--spacing-2);top:-100px;background:var(--red);color:var(--on-black);padding:var(--spacing-2) var(--spacing-4);z-index:var(--z-toast)}
.skip:focus{top:var(--spacing-2)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wrap{max-width:var(--container-xl);margin:0 auto;padding:0 var(--spacing-4)}
.prose{max-width:var(--container-md)}
h1,h2,h3{font-family:var(--font-display);font-weight:var(--font-medium);color:var(--on-black);margin:0 0 var(--spacing-4);letter-spacing:-0.01em}
h1{font-size:var(--text-3xl);line-height:var(--leading-tight)}
h2{font-size:var(--text-2xl);line-height:var(--leading-snug);margin-top:var(--spacing-12)}
h3{font-size:var(--text-xl);line-height:var(--leading-snug);margin-top:var(--spacing-6)}
p,ul,ol{margin:0 0 var(--spacing-4)}
li{margin-bottom:var(--spacing-2)}
small{color:var(--on-black-mute)}
.eyebrow{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--on-black-mute);margin:0 0 var(--spacing-3)}
.lead{font-size:var(--text-lg);color:var(--on-black-mute)}
/* header */
.hdr{position:sticky;top:0;z-index:var(--z-header);background:var(--ink);border-bottom:1px solid var(--rule-on-black)}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-4);min-height:var(--spacing-16);flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;gap:var(--spacing-3);text-decoration:none}
.brand img{height:var(--spacing-6);width:auto;filter:brightness(0) invert(1)}
.brand span{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.nav{display:flex;gap:var(--spacing-4);flex-wrap:wrap;font-size:var(--text-sm);align-items:center}
.nav a{text-decoration:none;color:var(--on-black-mute);padding:var(--spacing-3) 0;min-height:var(--spacing-8)}
.nav a:hover,.nav a[aria-current]{color:var(--on-black)}
.nav a[aria-current]{border-bottom:2px solid var(--red)}
.nav .lang{border:1px solid var(--rule-on-black);border-radius:var(--radius-md);padding:var(--spacing-1) var(--spacing-3);min-height:0}
/* breadcrumb */
.crumbs{font-size:var(--text-sm);color:var(--on-black-mute);margin:var(--spacing-6) 0 var(--spacing-4)}
.crumbs ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:var(--spacing-2)}
.crumbs li{margin:0}.crumbs li+li::before{content:"/";margin-right:var(--spacing-2);color:var(--on-black-mute)}
.crumbs a{color:var(--on-black-mute)}
.crossing{padding-bottom:var(--spacing-12)}
.crossing>*{max-width:var(--container-md)}
.crossing>.table-wrap,.crossing>.live{max-width:none}
/* live panel */
.live{border:1px solid var(--rule-on-black);border-radius:var(--radius-lg);padding:var(--spacing-4) var(--spacing-6);margin:var(--spacing-6) 0;background:var(--red-mist);min-height:160px}
.live h2{margin-top:var(--spacing-4);font-size:var(--text-xl)}
.live__dir+.live__dir{margin-top:var(--spacing-6)}
.live__src{font-size:var(--text-xs);color:var(--on-black-mute);margin:var(--spacing-3) 0 0}
.live__status{border-left:3px solid var(--red);padding-left:var(--spacing-3)}
.stamp{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.04em;margin:var(--spacing-2) 0 0;color:var(--on-black-mute)}
.stamp--amber{color:#d9a400}.stamp--stale{color:var(--on-black-mute);border-left:3px solid var(--on-black-mute);padding-left:var(--spacing-3)}
.wait{font-family:var(--font-mono);font-weight:var(--font-medium);white-space:nowrap}
.wait--ok{color:#7ac36a}.wait--warn{color:#e0b341}.wait--bad{color:var(--red)}.wait--amber{opacity:.85}
.wait--stale,.wait--na,.wait--closed{color:var(--on-black-mute)}
.rank{list-style:decimal;padding-left:var(--spacing-6)}
.rank li{display:list-item;margin-bottom:var(--spacing-3)}
.rank .wait{margin-left:var(--spacing-2)}
/* tables */
.table-wrap{overflow-x:auto;margin:0 0 var(--spacing-6)}
table{border-collapse:collapse;width:100%;font-size:var(--text-sm)}
th,td{text-align:left;padding:var(--spacing-3);border-bottom:1px solid var(--rule-on-black);vertical-align:top}
th{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--on-black-mute);font-weight:var(--font-medium)}
tbody th a{font-family:var(--font-body);text-transform:none;letter-spacing:0;font-size:var(--text-sm)}
caption{text-align:left;font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--on-black-mute);padding-bottom:var(--spacing-3)}
table.heat{font-size:var(--text-xs);table-layout:fixed;min-width:640px}
table.heat th,table.heat td{padding:var(--spacing-1);text-align:center}
.hm--na{color:var(--on-black-mute)}.hm--0{background:rgba(74,122,58,.25)}.hm--1{background:rgba(74,122,58,.45)}.hm--2{background:rgba(138,106,0,.55)}.hm--3{background:rgba(200,16,46,.45)}.hm--4{background:rgba(200,16,46,.75)}
/* notices */
.legal,.notice{border:1px solid var(--rule-on-black);border-left:3px solid var(--red);background:var(--red-mist);padding:var(--spacing-4);border-radius:var(--radius-md);font-size:var(--text-sm);margin:var(--spacing-8) 0}
.legal p,.notice{margin-bottom:var(--spacing-2)}
/* cards */
.hero{padding:var(--spacing-12) 0 var(--spacing-8)}
.hero h1{font-size:var(--text-4xl)}
.cards{display:grid;gap:var(--spacing-4);grid-template-columns:1fr;list-style:none;padding:0}
.cards li{margin:0}
.card{display:block;height:100%;padding:var(--spacing-6);border:1px solid var(--rule-on-black);border-radius:var(--radius-lg);text-decoration:none;transition:border-color var(--transition-fast)}
.card:hover{border-color:var(--red);color:var(--on-black)}
.card strong{display:block;font-family:var(--font-display);font-size:var(--text-xl);font-weight:var(--font-medium);margin-bottom:var(--spacing-2)}
.card span{color:var(--on-black-mute);font-size:var(--text-sm)}
.chips{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:var(--spacing-2)}
.chips a{display:inline-block;padding:var(--spacing-2) var(--spacing-4);border:1px solid var(--rule-on-black);border-radius:var(--radius-full);text-decoration:none;font-size:var(--text-sm)}
.chips a:hover{border-color:var(--red)}
.cols-list{columns:1;padding-left:var(--spacing-6)}
/* calculators */
.calc{border:1px solid var(--rule-on-black);border-radius:var(--radius-lg);padding:var(--spacing-6);background:var(--red-mist);margin-bottom:var(--spacing-4)}
.calc label{display:block;font-weight:var(--font-medium);margin:var(--spacing-3) 0 var(--spacing-2)}
.calc input[type=number],.calc select{background:var(--ink);color:var(--on-black);border:1px solid var(--rule-on-black);border-radius:var(--radius-md);padding:var(--spacing-3);font:inherit;min-height:44px;max-width:100%}
.calc__row{display:flex;gap:var(--spacing-3);flex-wrap:wrap}
.calc__check{display:flex!important;gap:var(--spacing-3);align-items:center;font-weight:var(--font-normal)!important}
.calc__check input{width:20px;height:20px;accent-color:var(--red)}
.calc__out{border-left:3px solid var(--red);padding:var(--spacing-2) var(--spacing-4);margin-bottom:var(--spacing-6)}
.calc__big{font-family:var(--font-display);font-size:var(--text-4xl);margin:0 0 var(--spacing-2)}
.calc__src{font-size:var(--text-xs);color:var(--on-black-mute)}
/* footer */
.ftr{border-top:1px solid var(--rule-on-black);padding:var(--spacing-8) 0;margin-top:var(--spacing-16);font-size:var(--text-sm);color:var(--on-black-mute)}
.ftr a{color:var(--on-black-mute)}
.ftr__row{display:flex;flex-wrap:wrap;gap:var(--spacing-3) var(--spacing-4);align-items:center;margin-bottom:var(--spacing-4)}
.ftr p{max-width:var(--container-md)}
@media (min-width:768px){
 h1{font-size:var(--text-4xl)}
 .hero h1{font-size:var(--text-5xl)}
 .cards{grid-template-columns:1fr 1fr}
 .cols-list{columns:2}
}
@media (min-width:1024px){.cards{grid-template-columns:repeat(3,1fr)}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
