:root{
  --red:#e0001a; --red-deep:#a50012; --red-dark:#6e000c;
  --paper:#faf5e9; --card:#fffdf7; --ink:#231f20; --muted:#9a8c78;
  --gold:#c9a227; --green:#1e7a3c;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{background:var(--red-dark); color:var(--ink); font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif; line-height:1.5;}
.sky{background:linear-gradient(180deg,var(--red-deep) 0%,var(--red-dark) 100%); padding-bottom:10px;}
.wrap{max-width:1200px; margin:0 auto; padding:0 20px 70px;}
header.masthead{text-align:center; padding:48px 0 6px; color:var(--paper);}
.kicker{letter-spacing:.3em; font-size:12px; color:#ffd9a8; text-transform:uppercase; font-weight:700;}
.site-nav{display:flex; justify-content:center; gap:20px; margin-bottom:24px;}
.site-nav a{color:var(--paper); font-size:14px; font-weight:800; text-decoration:none; border-bottom:2px solid transparent;}
.site-nav a:hover,.site-nav a:focus-visible{border-color:var(--paper);}
.site-nav a:focus-visible,.postbox button:focus-visible,.postbox input:focus-visible,.expiry select:focus-visible,.fame-card:focus-visible,.route-link:focus-visible,.diary-month > summary:focus-visible{outline:3px solid #ffd9a8; outline-offset:3px;}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
.sr-only:focus-within{position:static; width:auto; height:auto; margin:14px 0 0; overflow:visible; clip:auto; white-space:normal;}
.posthelp{font-size:12px; color:#f3d9c8; margin-top:6px;}
.hall-of-fame h2{font-family:Georgia,serif; font-size:38px; margin-top:4px;}
.paper-kicker{color:var(--red-deep); letter-spacing:.2em;}
.section-intro{color:var(--muted); margin-top:4px;}
.fame-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:20px; padding-left:0; list-style:none;}
.fame-grid li{min-width:0;}
.fame-card{position:relative; display:flex; flex-direction:column; gap:4px; height:100%; padding:16px; padding-right:84px; color:var(--ink); background:var(--card); border:1px solid #e3dcc8; border-radius:10px; text-decoration:none;}
.fame-portrait{position:absolute; top:12px; right:12px; width:56px; margin:0; text-align:center;}
.fame-photo{display:block; width:56px; height:56px; object-fit:cover; border-radius:8px; border:2px solid #e3dcc8; background:var(--paper);}
.fame-photo-credit{display:block; margin-top:4px; color:var(--muted); font-size:9px; line-height:1.1; overflow-wrap:anywhere;}
.fame-card:hover{border-color:var(--red); transform:translateY(-2px);}
.fame-card span{color:var(--muted); font-size:13px;}
.fame-card .rank{color:var(--red-deep); font-size:12px; font-weight:900; letter-spacing:.08em;}
.fame-card .tier-text{font-weight:800; color:var(--ink);}
.fame-card .hall-spend,.fame-card .hall-surplus{font-variant-numeric:tabular-nums; color:var(--ink); font-weight:700;}
.fame-card .hall-surplus{color:var(--red-deep);}
.hall-empty{margin-top:20px; padding:16px; border:1px dashed var(--muted); border-radius:10px;}
@media (min-width:561px) and (max-width:700px){.fame-card{padding-right:96px;}.fame-portrait{width:72px;}.fame-photo{width:72px;height:72px;}}
@media(max-width:560px){.fame-grid{grid-template-columns:1fr;} .fame-card{padding-right:72px;} .fame-portrait{width:48px;} .fame-photo{width:48px; height:48px;} h1.brand{font-size:42px;} .postbox{flex-direction:column;}.postbox button{width:100%;}}
h1.brand{font-family:Georgia,serif; font-size:54px; margin:8px 0 4px;}
.tagline{color:#f3d9c8; font-size:17px;}
.postbox{margin:26px auto 0; max-width:440px; display:flex; gap:8px;}
.postbox input{flex:1; padding:13px 16px; font-size:19px; border-radius:12px; border:3px solid #fff; background:var(--paper); color:var(--ink); text-align:center; letter-spacing:.2em; font-weight:700;}
.postbox button{padding:13px 22px; font-size:16px; font-weight:800; border-radius:12px; border:3px solid #fff; background:var(--ink); color:#fff; cursor:pointer;}
.postnote{font-size:13px; color:#f3d9c8; margin-top:8px; min-height:20px;}
.postnote a{color:#fff; font-weight:800; text-decoration:underline; text-underline-offset:3px;}

/* ---- frequent flyer card ---- */
.card-receipt-pair{display:grid; grid-template-columns:minmax(380px,1.15fr) minmax(320px,0.95fr); gap:22px; align-items:start; margin-top:30px;}
.card-receipt-pair .ffcard{margin-top:0; align-self:start; transform:translateY(3px);}
.card-receipt-pair .splurges-receipt{margin-top:0; align-self:start;}
.ffcard{background:linear-gradient(120deg,var(--red) 0%,var(--red-deep) 70%); color:#fff;
  border-radius:20px; margin-top:30px; padding:26px 26px 20px; display:flex; gap:22px;
  transform:none; box-shadow:0 24px 50px rgba(0,0,0,.4); position:relative; overflow:hidden;}
.ffcard::after{content:""; position:absolute; right:-60px; top:-60px; width:220px; height:220px;
  border-radius:50%; background:rgba(255,255,255,.08);}
.ffcard .chip{width:52px; height:38px; border-radius:8px;
  background:linear-gradient(135deg,#f3d27a,#c9a227 60%,#8a6d15);}
.ffcard .meta{font-size:12px; letter-spacing:.24em; opacity:.85; font-weight:700;}
.ffcard h2{font-family:Georgia,serif; font-size:34px; margin:8px 0 2px;}
.ffcard .route{font-size:14px; opacity:.9;}
.ffcard img{width:120px; height:148px; object-fit:cover; border-radius:12px; border:3px solid rgba(255,255,255,.7); flex-shrink:0; background:#7a0010;}
.ffright{display:flex; flex-direction:column; margin-left:auto; flex-shrink:0;}
.ffstats{display:flex; gap:26px; margin-top:auto; padding-top:18px; align-items:flex-end; flex-wrap:wrap;}
.ffstats .mult{font-size:64px; font-weight:900; line-height:1;}
.ffstats .mult small{font-size:16px; font-weight:700; letter-spacing:.1em;}
.ffstats .spend,.ffstats .surplus{font-size:15px; opacity:.92; font-variant-numeric:tabular-nums;}
.ffstats .spend strong,.ffstats .surplus strong{font-size:26px; display:block;}
.ffstats .surplus{position:relative;}
.surplus-info-btn{width:18px; height:18px; border-radius:50%; border:1px solid currentColor; background:transparent; color:inherit; font:700 11px/1 inherit; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; vertical-align:middle; margin-left:6px;}
.surplus-info-btn:hover,.surplus-info-btn:focus-visible{border-color:currentColor; background:rgba(255,255,255,.14);}
.ffcard.tier-silver .surplus-info-btn:hover,.ffcard.tier-silver .surplus-info-btn:focus-visible,.ffcard.tier-gold .surplus-info-btn:hover,.ffcard.tier-gold .surplus-info-btn:focus-visible{background:rgba(44,53,57,.08);}
.surplus-info-btn:focus-visible{outline:3px solid #ffd9a8; outline-offset:2px;}
.surplus-info{position:absolute; left:0; top:calc(100% + 10px); max-width:280px; background:var(--card); color:var(--ink); border:1px solid #e3dcc8; border-radius:8px; padding:10px 12px; font-size:13px; line-height:1.45; box-shadow:0 8px 20px rgba(0,0,0,.15); z-index:8;}
.surplus-info-portal{position:fixed; left:0; top:0; z-index:50;}
.surplus-info[hidden]{display:none;}
.surplus-info em{font-style:italic;}
.tier-badge{display:flex; flex-direction:column; justify-content:center; min-width:112px; padding:8px 10px; border:2px solid currentColor; border-radius:10px; font-size:13px; line-height:1.2; text-align:center;}
.tier-badge strong{font-size:18px; letter-spacing:.04em;}
.tier-badge span{font-size:10px; margin-top:3px; text-transform:uppercase; letter-spacing:.08em;}

/* ---- per-tier frequent flyer schemes ---- */
/* Bronze keeps the house red card with a thin bronze edge. */
.ffcard.tier-bronze{background:linear-gradient(120deg,var(--red) 0%,var(--red-deep) 70%); color:#fff; border:2px solid #CD7F32;}
.tier-badge.tier-bronze{background:linear-gradient(120deg,var(--red) 0%,var(--red-deep) 100%); color:#fff; border-color:#CD7F32;}
/* Silver is a brushed metallic grey card with charcoal text. */
.ffcard.tier-silver{background:linear-gradient(135deg,#E3E3E3 0%,#C0C0C3 45%,#A8A9AD 75%,#A8A9AD 100%); color:#2C3539; border:2px solid #757575;}
.tier-badge.tier-silver{background:linear-gradient(135deg,#E3E3E3 0%,#C0C0C3 60%,#A8A9AD 100%); color:#2C3539; border-color:#757575;}
/* Gold is a glossy gold card with dark brown text. */
.ffcard.tier-gold{background:linear-gradient(135deg,#CFAB38 0%,#D4AF37 40%,#F8F0C9 55%,#CFAB38 100%); color:#3A2E0A; border:2px solid #A67D01;}
.tier-badge.tier-gold{background:linear-gradient(135deg,#D4AF37 0%,#F8F0C9 55%,#CFAB38 100%); color:#3A2E0A; border-color:#A67D01;}
/* Platinum runs dusky gunmetal to platinum with platinum text. */
.ffcard.tier-platinum{background:linear-gradient(135deg,#2C3539 0%,#575654 45%,#A8A9AD 80%,#E5E4E2 100%); color:#E5E4E2; border:2px solid #A8A9AD;}
.tier-badge.tier-platinum{background:linear-gradient(135deg,#2C3539 0%,#575654 60%,#A8A9AD 100%); color:#E5E4E2; border-color:#E5E4E2;}
/* Light cards need dark controls so the year picker stays legible. */
.ffcard.tier-silver .expiry select{color:#2C3539; background:rgba(44,53,57,.08); border-color:rgba(44,53,57,.6);}
.ffcard.tier-gold .expiry select{color:#3A2E0A; background:rgba(58,46,10,.08); border-color:rgba(58,46,10,.6);}
.ffcard.tier-silver img,.ffcard.tier-gold img{border-color:rgba(44,53,57,.5);}
.ffcard .expiry select:focus-visible{outline:3px solid #ffd9a8; outline-offset:3px;}
/* Hall of Fame tier dots reuse the card palette; labels always stay as text. */
.fame-card .tier-text{display:inline-flex; align-items:center; gap:8px;}
.fame-card .tier-text::before{content:""; width:10px; height:10px; border-radius:50%; background:#9a8c78; flex-shrink:0;}
.fame-card .tier-text[data-tier="bronze"]{color:#8f4f22;}
.fame-card .tier-text[data-tier="bronze"]::before{background:#CD7F32;}
.fame-card .tier-text[data-tier="silver"]{color:#2C3539;}
.fame-card .tier-text[data-tier="silver"]::before{background:#A8A9AD; border:1px solid #757575;}
.fame-card .tier-text[data-tier="gold"]{color:#3A2E0A;}
.fame-card .tier-text[data-tier="gold"]::before{background:#D4AF37; border:1px solid #A67D01;}
.fame-card .tier-text[data-tier="platinum"]{color:#2C3539;}
.fame-card .tier-text[data-tier="platinum"]::before{background:#575654; border:1px solid #A8A9AD;}
.fame-card .tier-text[data-tier="unclassified"]{color:var(--muted);}
.expiry{margin-top:auto; padding-top:14px; text-align:right;}
.expiry .xplabel{font-size:10px; letter-spacing:.3em; opacity:.75; font-weight:700;}
.expiry select{margin-top:4px; font-size:22px; font-weight:800; color:#fff; background:rgba(255,255,255,.12);
  border:2px solid rgba(255,255,255,.6); border-radius:10px; padding:4px 10px; cursor:pointer;}
.expiry select option{color:#231f20;}

/* ---- paper section ---- */
.paper{background:var(--paper); border-radius:20px; margin-top:26px; padding:28px 26px 30px; color:var(--ink);
   box-shadow:0 24px 50px rgba(0,0,0,.35);}
.splurges-receipt{background:#FFFDF5; font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace; position:relative; overflow:hidden;}
.splurges-receipt .receipt-content{position:relative; z-index:1;}
.splurges-receipt h3{font-family:Georgia,serif;}
.receipt-intro{color:var(--muted); font:12px/1.4 inherit; margin-top:4px;}
.receipt-stub{height:12px; margin:-28px -26px 22px; background:linear-gradient(90deg,var(--red),var(--red-deep));}
.receipt-stub.tier-bronze{background:linear-gradient(120deg,var(--red) 0%,var(--red-deep) 70%);}
.receipt-stub.tier-silver{background:linear-gradient(135deg,#E3E3E3 0%,#C0C0C3 45%,#A8A9AD 100%);}
.receipt-stub.tier-gold{background:linear-gradient(135deg,#A67D01 0%,#D4AF37 40%,#F8F0C9 55%,#CFAB38 100%);}
.receipt-stub.tier-platinum{background:linear-gradient(135deg,#2C3539 0%,#575654 45%,#A8A9AD 80%,#E5E4E2 100%);}
.splurge-rows{margin-top:18px;}
.splurge-row{border-top:1px solid #ded6c3; padding:10px 0 10px;}
.splurge-route{display:flex; flex-wrap:wrap; gap:7px; font-size:12px; font-weight:800; letter-spacing:.04em;}
.receipt-arrow{color:var(--red-deep); font-weight:400;}
.splurge-row time{display:block; color:var(--muted); font-size:11px; margin-top:3px;}
.splurge-fares{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:12px; font-size:11px; font-variant-numeric:tabular-nums;}
.splurge-fares dt{color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.08em;}
.splurge-fares dd{font-weight:800; margin-top:2px;}
.splurge-excess dd{color:var(--red-deep);}
.receipt-empty{border:1px dashed #a99d88; margin-top:20px; padding:16px; color:#655b4f; font-size:13px;}
.receipt-perforation{border-top:2px dashed #b8ab95; margin:18px 0 16px;}
.receipt-barcode{height:38px; width:70%; margin:0 auto; background:repeating-linear-gradient(90deg,#231f20 0 2px,transparent 2px 5px,#231f20 5px 6px,transparent 6px 10px); opacity:.8;}
.receipt-footer{text-align:center; color:var(--muted); font-size:10px; letter-spacing:.12em; margin-top:10px;}
@media(min-width:561px) and (max-width:700px){.card-receipt-pair{grid-template-columns:minmax(230px,0.95fr) minmax(230px,1.15fr);}.card-receipt-pair .ffcard{padding:20px 16px 16px; gap:12px;}.card-receipt-pair .ffcard > div:first-child{min-width:0; padding-right:84px;}.card-receipt-pair .ffright{position:absolute; top:12px; right:12px;}.card-receipt-pair .ffcard img{width:72px; height:90px;}.card-receipt-pair .expiry{margin-top:4px;}}
@media(max-width:560px){.card-receipt-pair{display:block; margin-top:30px;}.card-receipt-pair .splurges-receipt{margin-top:26px;}.splurge-fares{gap:6px; font-size:11px;}.receipt-stub{margin-left:-26px; margin-right:-26px;}}

.paper h3{font-family:Georgia,serif; font-size:26px;}
.paper h3 .yr{color:var(--red);}
#jmap{height:380px; border-radius:14px; margin-top:12px; border:2px solid #e6dcc4; z-index:0;}
.leghint{font-size:13px; color:var(--muted); margin-top:8px;}
.route-list{display:grid; gap:8px; margin-top:14px; list-style:none;}
.route-list.sr-only{position:absolute; display:block; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
.route-list li{list-style:none;}
.route-link{display:flex; justify-content:space-between; gap:12px; width:100%; padding:10px 12px; border:1px solid #e3dcc8; border-radius:8px; background:var(--card); color:var(--ink); text-align:left; font:inherit; cursor:pointer;}
.route-link:hover,.route-link:focus-visible{border-color:var(--red);}
.postcode-choices{display:grid; gap:6px; margin-top:8px; text-align:left;}
.postcode-choices [role="listitem"]{display:flex; justify-content:space-between; gap:10px;}
.postcode-choices a{color:#fff; font-weight:800; text-decoration:underline; text-underline-offset:3px;}

/* ---- diary ---- */
#entries{display:block;}
.diary-month{margin-top:20px;}
.diary-month:first-child{margin-top:14px;}
.diary-month > summary{display:flex; align-items:center; gap:8px; cursor:pointer; list-style:none; color:var(--muted); font-size:14px; font-weight:800; letter-spacing:.04em;}
.diary-month > summary::-webkit-details-marker{display:none;}
.diary-month > summary::before{content:"▾"; color:var(--red); font-size:13px; transition:transform .15s ease;}
.diary-month:not([open]) > summary::before{transform:rotate(-90deg);}
.diary-month-entries{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); column-gap:18px;}
.entry{background:var(--card); border-radius:6px; margin-top:22px; padding:20px 22px 18px; position:relative;
  box-shadow:0 6px 18px rgba(60,30,10,.14);
  background-image:repeating-linear-gradient(var(--card) 0 30px, #eef0f4 30px 31px);}
.entry::before{content:""; position:absolute; top:-12px; left:50%; transform:translateX(-50%) rotate(-2deg);
  width:110px; height:24px; background:rgba(201,162,39,.55); border-left:1px dashed rgba(0,0,0,.15); border-right:1px dashed rgba(0,0,0,.15);}
.entry.flash{outline:3px solid var(--red);}
.stamp{display:inline-block; font-size:12px; font-weight:800; letter-spacing:.14em; color:var(--red-deep);
  border:2px solid var(--red-deep); border-radius:6px; padding:2px 10px; transform:rotate(-3deg); text-transform:uppercase;}
.eroute{font-family:Georgia,serif; font-size:23px; margin:8px 0 2px;}
.farebar{margin:12px 0 4px;}
.farebar .scale{position:relative; height:30px; background:#ece4d0; border-radius:8px;}
.farebar .paid{position:absolute; left:0; top:0; bottom:0; border-radius:8px;}
.farebar .tick{position:absolute; top:-4px; bottom:-4px; width:3px; background:var(--ink);}
.farebar .ticklabel{position:absolute; top:-20px; transform:translateX(-50%); font-size:11px; font-weight:700; color:var(--ink); white-space:nowrap;}
.farebar .amounts{display:flex; justify-content:space-between; font-size:14px; margin-top:6px; font-variant-numeric:tabular-nums;}
.delta{display:inline-block; font-weight:800; font-size:14px; border-radius:999px; padding:3px 12px; margin-top:8px;}
.delta::before{content:"Status: ";}
.paid.hot{outline:3px solid var(--red-deep); outline-offset:1px;}
.delta.over{background:#fbe3e0; color:var(--red-deep);}
.delta.under{background:#e2f1e5; color:var(--green);}
.delta.none{background:#eee7d3; color:#6d6152;}

.tweet{margin-top:14px; background:#fff; border:1px solid #e3dcc8; border-radius:14px; padding:12px 14px; font-size:14px;}
.tweet .thead{display:flex; align-items:center; gap:10px;}
.tweet .avatar{width:38px; height:38px; border-radius:50%; background:var(--red); color:#fff; font-weight:800;
  display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0;}
.tweet .who strong{font-size:14px;} .tweet .who span{color:var(--muted); font-size:13px;}
.tweet .mockbadge{margin-left:auto; font-size:10px; font-weight:800; letter-spacing:.12em; color:var(--muted);
  border:1px solid #d8cdb2; border-radius:999px; padding:2px 8px; text-transform:uppercase;}
.tweet p{margin:8px 0 6px;}
.tweet .tmeta{color:var(--muted); font-size:12.5px;}
.imagined{margin-top:12px; font-family:"Segoe Print","Bradley Hand",cursive; font-size:17px; color:#4a3f30;}
.imagined b{font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif; font-size:10px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted); display:block; margin-bottom:2px;}
.credit{font-size:11px; color:var(--muted); margin-top:20px;}

#getaways{margin-bottom:26px;}
#getaways .paper-kicker{margin-bottom:4px;}
.getaway-list{display:grid; gap:12px; margin-top:18px; list-style:none;}
.getaway-card{padding:16px; border:1px solid #e3dcc8; border-radius:10px; background:var(--card);}
.getaway-heading,.getaway-route,.getaway-footer{display:flex; align-items:center; justify-content:space-between; gap:12px;}
.getaway-heading h4{display:inline; margin-left:10px; font-family:Georgia,serif; font-size:23px;}
.getaway-rank{color:var(--red-deep); font-size:12px; font-weight:900; letter-spacing:.08em;}
.getaway-count{display:flex; align-items:baseline; gap:5px; color:var(--muted);}
.getaway-count strong{color:var(--ink); font-size:24px; font-variant-numeric:tabular-nums;}
.getaway-count span,.getaway-route,.getaway-footer{font-size:13px;}
.getaway-route{margin-top:10px; color:var(--muted);}
.getaway-route span:first-child{color:var(--ink); font-family:Georgia,serif; font-size:16px;}
.getaway-footer{margin-top:14px; padding-top:10px; border-top:1px solid #eee5d4; color:var(--muted);}
.getaway-footer strong{margin-left:auto; color:var(--ink); font-variant-numeric:tabular-nums;}
.getaway-link{width:auto; padding:6px 10px; font-size:12px;}
.getaway-empty{margin-top:18px; padding:16px; border:1px dashed var(--muted); border-radius:10px; color:var(--muted);}
@media(max-width:560px){
  .diary-month-entries{display:block;}
  .getaway-heading,.getaway-route,.getaway-footer{align-items:flex-start; flex-wrap:wrap;}
  .getaway-footer strong{margin-left:0;}
  .getaway-link{margin-left:auto;}
}
