/* Extra Credit, part two: Your Airline Accounts, Points or Cash, Travel Words, Talk Instead of Type. Deck tokens only (from styles.css). */
.xh3{display:flex;align-items:center;gap:10px}
.xh3 .n{background:var(--gold);border:2px solid var(--gold-line)}
.xsay{font:500 17px/1.45 var(--hf);color:var(--navy);border-left:5px solid var(--gold);padding:4px 0 4px 14px;margin:0 0 12px}
.xsay.teal{border-left-color:var(--teal-ink)}
.xhelp{display:block;font-size:13.5px;color:var(--muted);margin:4px 2px 0}
.xform{display:grid;gap:12px;margin-top:10px}
.xform input.field,.xform select.field{min-height:52px;width:100%}
.xform .fw input.field{padding-right:62px}
.xform .fw .mic{top:3px;right:6px}
/* airline accounts */
.xsum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}
.xsum div{background:var(--navy);color:#fff;border-radius:16px;padding:10px 8px;text-align:center;min-width:0}
.xsum div:nth-child(2){background:var(--gold-soft);color:var(--navy)}
.xsum div:nth-child(3){background:var(--mint);color:var(--navy)}
.xsum b{display:block;font:700 26px/1.1 var(--hf)}
.xsum span{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:700}
.xgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:12px}
.xair{display:grid;grid-template-columns:56px minmax(0,1fr);gap:8px 12px;background:#fff;border:1.5px solid var(--cool-line);border-radius:16px;padding:12px}
.xair.on{border-color:var(--teal-ink);background:var(--mint-light)}
.xair.want{border-color:var(--purple)}
.xlogo{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;background:var(--pale);border:1.5px solid var(--cool-line);overflow:hidden}
.xlogo img{width:100%;height:100%;object-fit:contain;display:block}
.xbadge{font:700 16px var(--bf);letter-spacing:.06em;color:#fff;background:var(--navy);width:46px;height:46px;border-radius:12px;display:grid;place-items:center}
.xbadge.b1{background:var(--teal-ink)}.xbadge.b2{background:var(--purple)}.xbadge.b3{background:var(--coral);color:var(--navy)}.xbadge.b4{background:var(--gold);color:var(--navy)}
.xname{min-width:0}
.xname b{display:block;font:700 17px/1.2 var(--hf);overflow-wrap:anywhere}
.xname small{display:block;font-size:13px;color:var(--muted);line-height:1.35}
.xtags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.xtag{font:700 11px/1.3 var(--bf);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:3px 9px;background:var(--lilac);color:var(--navy)}
.xtag.star{background:var(--gold-soft)}.xtag.ow{background:var(--sky)}.xtag.sky{background:var(--mint)}
.xbody{grid-column:1/-1;font-size:14.5px}
.xbody p{margin:0 0 4px}
.xbody a{font-weight:600;display:inline-block;padding:11px 0}
.xtog{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.xtog button{min-height:44px;border-radius:12px;border:2px solid var(--cool-line);background:#fff;color:var(--navy);font:700 13px var(--bf);padding:4px 6px;cursor:pointer}
.xtog button[aria-pressed=true]{background:var(--navy);color:#fff;border-color:var(--navy)}
.xtog button.want[aria-pressed=true]{background:var(--purple);border-color:var(--purple)}
.xtog button.acct[aria-pressed=true]{background:var(--teal-ink);border-color:var(--teal-ink)}
.xempty{background:var(--gold-wash);border:1.5px dashed var(--gold-line);border-radius:12px;padding:12px;font-weight:600}
.xmore{margin-top:10px}
/* points or cash */
.xres{background:var(--navy);color:var(--cream);border:3px solid var(--gold);border-radius:20px;padding:16px;margin-top:12px}
.xres b.big{display:block;font:700 clamp(30px,9vw,46px)/1.05 var(--hf);color:var(--gold)}
.xres .v{font:700 18px/1.3 var(--bf);margin:6px 0}
.xres p{color:var(--pale);margin:4px 0}
.xres .f{font-size:13.5px;color:var(--cream);opacity:.9}
.xres.bad{background:var(--gold-wash);color:var(--navy);border-color:var(--gold-line)}
.xres.bad p{color:var(--navy)}
.xbar{display:block;width:100%;max-width:440px;height:auto;margin:8px 0 2px}
.xbar text{font:700 13px var(--bf);fill:var(--cream)}
.xbar .bg{fill:var(--chalk-soft);stroke:var(--sage);stroke-width:1}
.xbar .val{fill:var(--gold)}
.xbar .fl{stroke:var(--teal);stroke-width:3}
.xhelper{margin-top:12px}
.xhelper>summary{display:flex;align-items:center;gap:8px;min-height:48px;cursor:pointer;font:700 17px var(--hf);color:var(--navy)}
.xout{background:var(--mint-light);border:1.5px solid var(--teal);border-radius:12px;padding:10px 12px;margin-top:10px;font-weight:600}
.xout b{font:700 22px/1.2 var(--hf);display:block}
.xchip{display:inline-block;background:var(--gold-wash);border:1.5px dashed var(--gold-line);border-radius:999px;padding:8px 14px;font-weight:700;font-size:14px;margin-top:8px}
/* travel words */
.xtabs{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.xprog{display:inline-flex;align-items:center;min-height:36px;border-radius:999px;background:var(--navy);color:#fff;font:700 13px var(--bf);padding:0 14px;margin-left:auto}
.xwords{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.xw{--c:var(--teal);min-width:0;border:2px solid var(--cool-line);border-top:8px solid var(--c);border-radius:18px;background:#fff}
.xw.g1{--c:var(--purple)}.xw.g2{--c:var(--coral)}.xw.g3{--c:var(--gold)}
.xw.open{grid-column:1/-1;background:var(--pale);border-color:var(--c)}
.xw.done{border-style:solid}
.xw.done .xwb::after{content:"\2713";position:absolute;top:8px;right:10px;width:22px;height:22px;border-radius:50%;background:var(--teal-ink);color:#fff;font-size:13px;display:grid;place-items:center}
.xwb{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;width:100%;min-height:84px;padding:10px 32px 10px 12px;border:0;background:transparent;text-align:left;cursor:pointer;color:var(--navy)}
.xwb b{font:700 17px/1.2 var(--hf);overflow-wrap:anywhere}
.xwb small{font:600 12px var(--bf);color:var(--teal-deep);letter-spacing:.04em;text-transform:uppercase}
.xback{padding:0 12px 12px;transform-origin:top}
.xw.open .xback{animation:xflip .26s ease-out}
.xback p{margin:0 0 8px;font-size:15px}
.xback .row{margin-top:4px}
@keyframes xflip{from{opacity:0;transform:rotateX(-70deg)}to{opacity:1;transform:none}}
.xquiz{background:var(--lilac);border:2px solid var(--purple);border-radius:18px;padding:14px;margin-top:14px}
.xquiz h4{font-size:20px;margin:0 0 6px}
.xq{font:500 16px/1.45 var(--bf);margin:6px 0 10px}
.xopts{display:grid;gap:8px}
.xopts button{min-height:52px;border-radius:14px;border:2px solid var(--cool-line);background:#fff;color:var(--navy);font:700 15px var(--hf);padding:8px 12px;text-align:left;cursor:pointer}
.xopts button.right{background:var(--mint);border-color:var(--teal-ink)}
.xopts button.wrong{background:var(--blush);border-color:var(--err)}
.xscore{font-weight:700;margin:10px 0 0}
/* referral card in stop 2 */
.xref{border:3px solid var(--purple);background:var(--lilac)}
.xref .acc{margin-top:10px}
/* talk instead of type */
.xtalk{border:3px solid var(--teal-ink);background:var(--mint-light);margin:0 0 16px}
.xtalk .ni{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--teal-ink);color:#fff;margin-bottom:6px}
.xkeys{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px}
.xkeys li{background:#fff;border:1.5px solid var(--cool-line);border-radius:12px;padding:10px 12px;font-size:14.5px}
.xkeys b{display:block;font-size:15px}
.xkeys kbd{font:700 13px var(--bf);background:var(--pale);border:1.5px solid var(--cool-line);border-bottom-width:3px;border-radius:6px;padding:1px 7px;white-space:nowrap}
#xcair .src a,#xccalc .src a,#xcterms .src a{display:flex;align-items:center;min-height:44px}
@media (min-width:560px){
  .xgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xform.two{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:640px){
  .xwords{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:900px){
  .xgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .xwords{grid-template-columns:repeat(4,minmax(0,1fr))}
}