/* Almost Free Travel Companion. Colours and fonts come from the class deck (Rewards Travel on Steroids).
   Every colour below is a token from the block at the top: change a colour there and it changes everywhere.
   Light page on purpose. The green chalkboard is used for the bar, hero, section bands, voice panel and footer. */
:root{color-scheme:light;
  --chalk:#103A32;
  --chalk-deep:#0A2923;
  --chalk-soft:#1B4A3E;
  --wood:#8A5A44;
  --gold:#FFD166;
  --gold-line:#E9AD22;
  --coral:#FF6B6B;
  --teal:#2EC4B6;
  --teal-ink:#087E73;
  --teal-deep:#06695F;
  --navy:#1A2B4C;
  --purple:#7C63B8;
  --pale:#F9F6F0;
  --mint:#D8F5F1;
  --mint-light:#EAF8F6;
  --lilac:#E7DFF8;
  --blush:#FFE0DE;
  --gold-soft:#FFF0BD;
  --gold-wash:#FFF8DD;
  --cool-line:#B8C2CF;
  --cream:#FFF2E2;
  --peach:#FFE6D9;
  --sky:#C3E9EC;
  --sage:#8BA697;
  --ink:#1A2B4C;
  --muted:#4A5675;
  --err:#A8322B;
}
:root{--r:20px;--gl:max(16px,env(safe-area-inset-left,0px));--gr:max(16px,env(safe-area-inset-right,0px));
  --hf:'Playfair Display','Iowan Old Style','Palatino Linotype',Palatino,'Book Antiqua',Georgia,serif;
  --bf:'DM Sans','Avenir Next','Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --sh:0 1px 0 rgba(26,43,76,.05),0 12px 26px -16px rgba(26,43,76,.45)}
*{box-sizing:border-box}
/* Padding for phones with a notch or a home bar, and a limit on image width. */
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
img,svg{max-width:100%}
html{background:var(--chalk-deep);-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(76px + env(safe-area-inset-top,0px))}
body{margin:0;background:var(--cream);color:var(--navy);font:400 16px/1.55 var(--bf);overflow-x:hidden}
[hidden]{display:none!important}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--chalk-deep)}
h1,h2,h3,h4{font-family:var(--hf);margin:0;line-height:1.14;color:var(--navy);font-weight:700}
p{margin:0 0 10px}
i{font-style:normal}
a{color:var(--teal-deep)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--purple);outline-offset:2px}
.bar :focus-visible,.hero :focus-visible,.band :focus-visible,.vp :focus-visible,.foot :focus-visible,.dark :focus-visible,.case :focus-visible{outline-color:var(--gold)}
.wrap{width:100%;max-width:1040px;margin:0 auto;padding-left:var(--gl);padding-right:var(--gr)}
.wrap>*{min-width:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sr:focus{position:fixed;left:12px;top:12px;z-index:60;width:auto;height:auto;clip:auto;background:var(--gold);color:var(--navy);padding:10px 18px;border-radius:999px;font-weight:700;text-decoration:none}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ico{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ico.sm{width:18px;height:18px}
/* sticky bar */
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--chalk-deep);color:var(--cream);border-bottom:3px solid var(--gold)}
.bar-in{display:flex;align-items:center;gap:12px;min-height:62px;padding-top:6px;padding-bottom:6px}
.word{display:flex;flex-direction:column;text-decoration:none;color:var(--cream);line-height:1;flex:none}
.word b{font:700 22px/1 var(--hf);letter-spacing:.01em;white-space:nowrap;color:var(--cream)}
.word i{font:700 10.5px/1 var(--bf);letter-spacing:.32em;text-transform:uppercase;color:var(--gold);margin-top:5px;padding-left:2px}
.bar .word{min-height:44px;justify-content:center}
.savechip{display:none;font:600 12.5px/1.2 var(--bf);color:var(--teal);border:1.5px solid var(--teal);border-radius:999px;padding:5px 12px;white-space:nowrap}
.topnav{display:none}
.bar .btn{margin-left:auto;flex:none}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;border:2px solid var(--navy);font:700 16px/1.2 var(--bf);cursor:pointer;text-decoration:none;text-align:center;background:var(--navy);color:#fff;transition:transform .12s,box-shadow .12s}
.btn:hover{box-shadow:0 6px 14px -8px rgba(26,43,76,.7)}
.btn:active{transform:translateY(1px)}
.btn.gold{background:var(--gold);border-color:var(--gold-line);color:var(--navy)}
.btn.line{background:var(--pale);color:var(--navy);border-color:var(--navy)}
.btn.ghost{background:transparent;color:var(--cream);border-color:var(--cream)}
.btn.sm{min-height:44px;padding:0 16px;font-size:15px}
.btn[disabled]{opacity:.55;cursor:default}
.btn.warn{background:var(--pale);color:var(--err);border-color:var(--err)}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
/* pills */
.sp{display:inline-block;border-radius:999px;padding:3px 12px;font:700 11.5px/1.35 var(--bf);letter-spacing:.09em;text-transform:uppercase}
.sp.coral{background:var(--coral);color:var(--navy)}
.sp.teal{background:var(--teal);color:var(--navy)}
.sp.purple{background:var(--purple);color:#fff}
.sp.gold{background:var(--gold);color:var(--navy)}
.sp.navy{background:var(--navy);color:#fff}
/* hero */
.hero{position:relative;overflow:hidden;color:var(--cream);padding:0 0 58px;
  background:radial-gradient(90% 70% at 100% 0,var(--chalk-soft) 0,transparent 62%),radial-gradient(70% 60% at 0 100%,var(--chalk-deep) 0,transparent 70%),var(--chalk)}
.hero-art{position:relative;height:290px;margin:0;background:linear-gradient(165deg,var(--sky),var(--peach) 58%,var(--cream));-webkit-mask-image:linear-gradient(to bottom,#000 62%,transparent);mask-image:linear-gradient(to bottom,#000 62%,transparent)}
.hero-img{display:block;width:100%;height:100%;object-fit:cover;object-position:60% 16%}
img.nopic{display:none!important}
.hero .wrap{position:relative;z-index:1}
.hero-panel{position:relative;margin-top:-52px;background:rgba(16,58,50,.86);border:2px solid var(--cream);border-radius:24px;padding:24px 20px 22px;box-shadow:0 20px 44px -20px rgba(0,0,0,.65)}
.hero-panel::before{content:"";position:absolute;inset:7px;border:1.5px dotted rgba(255,242,226,.5);border-radius:17px;pointer-events:none}
.hero-panel>*:not(.doodle){position:relative}
.tagtop{display:inline-block;margin:0 0 14px;padding:4px 13px;border-radius:999px;background:var(--gold);color:var(--navy);font:700 11.5px/1.3 var(--bf);letter-spacing:.14em;text-transform:uppercase}
.eyebrow{font:700 12px/1.35 var(--bf);letter-spacing:.16em;text-transform:uppercase;margin:0 0 8px;color:var(--gold)}
.hero .eyebrow{color:var(--cream)}
.hero h1{font:700 clamp(27px,8.4vw,66px)/1.03 var(--hf);text-transform:uppercase;letter-spacing:.015em;color:var(--cream);margin:0}
.hero h1 span{display:block}
.edition{font:600 clamp(16px,4.5vw,23px)/1.3 var(--hf);color:var(--gold);margin:10px 0 0}
.rule{width:64px;height:4px;background:var(--gold);border-radius:3px;margin:16px 0}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.pill{display:inline-block;border-radius:999px;padding:7px 15px;font:700 13.5px/1.25 var(--bf)}
.pill.out{border:2px solid var(--gold);color:var(--gold)}
.pill.teal{background:var(--teal);color:var(--navy)}
.pill.navy{background:var(--navy);color:#fff;border:1.5px solid rgba(255,242,226,.45)}
.when{font:700 16px/1.4 var(--bf);color:var(--cream);margin:0 0 2px}
.by{font:500 15px/1.4 var(--bf);color:var(--pale);margin:0 0 18px}
.saves{font-size:13px;color:var(--pale);margin:14px 0 0}
.doodle{position:absolute;color:var(--gold);pointer-events:none}
.hero-panel .d1{right:16px;top:-17px;width:34px;height:34px;background:var(--chalk);border-radius:50%;padding:5px;border:2px solid var(--cream)}
@keyframes twinkle{50%{opacity:.45;transform:scale(.88)}}
.hero-panel .d1{animation:twinkle 3.2s ease-in-out infinite}
/* plan strip */
.plan{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:-34px;position:relative;z-index:2}
.stopc{display:flex;flex-direction:column;align-items:flex-start;gap:3px;background:var(--pale);border:2px solid var(--gold-line);border-radius:18px;padding:12px 12px 14px;text-decoration:none;color:var(--navy);min-height:112px;box-shadow:var(--sh);transition:transform .15s}
.stopc:hover{transform:translateY(-3px)}
.stopc b{font:700 17px/1.2 var(--hf);color:var(--navy);margin-top:6px}
.stopc .s{font-size:13px;color:var(--muted);line-height:1.35}
.stopc.xc{grid-column:1/-1;background:var(--gold-wash);border-color:var(--gold)}
/* sections and bands */
.sec{padding:42px 0 4px}
.band{position:relative;overflow:hidden;background:var(--chalk);color:var(--cream);border:4px solid var(--wood);border-radius:26px;padding:22px 20px 20px;margin:0 0 18px;box-shadow:inset 0 0 0 2px rgba(255,242,226,.42),0 12px 26px -16px rgba(26,43,76,.6)}
.band-art{position:absolute;top:0;right:0;bottom:0;width:38%;background:no-repeat right center/auto 100%;opacity:.42;-webkit-mask-image:linear-gradient(to right,transparent,#000 55%);mask-image:linear-gradient(to right,transparent,#000 55%);pointer-events:none}
.band-in{position:relative}
.band h2{font-size:clamp(26px,6.8vw,40px);color:var(--cream);text-wrap:balance}
.band .lede{color:var(--pale);margin:8px 0 14px;max-width:56ch;font-size:17px}
.band .eyebrow{margin-bottom:10px}
.band .vn{color:var(--teal)}
.band .vn.bad{color:var(--blush)}
.lede{color:var(--muted);margin:8px 0 14px;max-width:62ch}
.strip{position:relative;margin:0 0 16px;border:2px solid var(--gold-line);border-radius:20px;overflow:hidden;background:linear-gradient(120deg,var(--sky),var(--peach),var(--gold-soft));box-shadow:var(--sh);min-height:60px}
.strip img{display:block;width:100%;height:auto;max-height:230px;object-fit:cover;object-position:50% 40%}
.nextstop{display:inline-flex;align-items:center;gap:8px;margin:6px 0 0;font:700 15px var(--bf);color:var(--teal-deep);text-decoration:none;min-height:44px}
.nextstop:hover{text-decoration:underline}
/* cards */
.card{background:var(--pale);border:2px solid var(--gold-line);border-radius:var(--r);padding:18px 16px;margin:0 0 14px;box-shadow:var(--sh)}
.card h3{font-size:21px;margin:0 0 6px}
.card.dark{background:var(--navy);color:var(--cream);border-color:var(--gold)}
.card.dark h3{color:var(--cream)}
.card.dark p{color:var(--pale)}
.goalline{margin:8px 0 0;font:700 21px/1.2 var(--hf);color:var(--gold)}
.card.dark p.goalline{color:var(--gold)}
.sub{font-size:14.5px;color:var(--muted);margin:0}
.note{font-size:13.5px;color:var(--muted);margin:10px 0 0}
.kv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}
.kv>div{background:#fff;border:1.5px solid var(--cool-line);border-left:6px solid var(--coral);border-radius:12px;padding:9px 12px;min-width:0}
.kv>div:nth-child(4n+2){border-left-color:var(--teal)}
.kv>div:nth-child(4n+3){border-left-color:var(--purple)}
.kv>div:nth-child(4n+4){border-left-color:var(--gold)}
.kv b{display:block;font:700 12.5px/1.3 var(--bf);letter-spacing:.06em;text-transform:uppercase;color:var(--navy)}
.kv span{font-size:14.5px;color:var(--muted)}
.steps{list-style:none;margin:12px 0;padding:0;display:grid;gap:8px}
.steps li{display:flex;gap:12px;align-items:center;background:#fff;border:1.5px solid var(--cool-line);border-radius:14px;padding:10px 12px}
.n{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:700 15px var(--hf);background:var(--coral);color:var(--navy)}
.steps li:nth-child(4n+2) .n{background:var(--teal)}
.steps li:nth-child(4n+3) .n{background:var(--purple);color:#fff}
.steps li:nth-child(4n+4) .n{background:var(--gold)}
.steps b{display:block;font:700 16px/1.3 var(--bf)}
.steps small{display:block;font-size:14.5px;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border-radius:999px;border:2px solid var(--cool-line);background:#fff;color:var(--navy);font-weight:700;font-size:15px;cursor:pointer;line-height:1.2;text-align:left}
.chip:hover{border-color:var(--gold-line)}
.chip[aria-pressed=true]{background:var(--navy);border-color:var(--navy);color:#fff}
.chip.static{cursor:default;min-height:36px;font-size:14px;padding:0 14px;border-color:transparent;background:var(--coral);color:var(--navy)}
.chip.static:nth-child(5n+2){background:var(--teal)}
.chip.static:nth-child(5n+3){background:var(--purple);color:#fff}
.chip.static:nth-child(5n+4){background:var(--gold)}
.chip.static:nth-child(5n+5){background:var(--navy);color:#fff}
.groupt{font:700 12px var(--bf);letter-spacing:.12em;text-transform:uppercase;color:var(--teal-deep);margin:16px 0 6px}
/* accordion */
details.acc{background:var(--pale);border:2px solid var(--gold-line);border-radius:var(--r);margin:0 0 12px;overflow:hidden;box-shadow:var(--sh)}
details.acc>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;min-height:60px;padding:10px 14px}
details.acc>summary::-webkit-details-marker{display:none}
details.acc>summary::after{content:"+";margin-left:auto;font:700 26px/1 var(--hf);color:var(--teal-deep)}
details.acc[open]>summary::after{content:"-"}
details.acc>summary b{font:700 18px/1.2 var(--hf);color:var(--navy);display:block}
details.acc>summary small{display:block;font-size:13.5px;color:var(--muted)}
details.acc>div{padding:2px 14px 14px;min-width:0}
.badge{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:var(--navy)}
.badge .ico{width:20px;height:20px}
/* currency explorer */
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.cur{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:92px;border:2px solid var(--cool-line);border-radius:18px;background:#fff;text-align:left;padding:12px 12px 10px;font:700 15.5px/1.25 var(--bf);cursor:pointer;color:var(--navy)}
.cur .ci{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--coral);color:var(--navy)}
.cur .ci .ico{width:19px;height:19px}
.cur:nth-child(4n+2) .ci{background:var(--teal)}
.cur:nth-child(4n+3) .ci{background:var(--purple);color:#fff}
.cur:nth-child(4n+4) .ci{background:var(--gold)}
.cur[aria-pressed=true]{border-color:var(--purple);background:var(--lilac)}
.cur .ck{position:absolute;top:10px;right:10px;width:24px;height:24px;border-radius:50%;border:2px solid var(--cool-line);display:grid;place-items:center;font-size:13px;color:#fff;background:#fff}
.cur.has .ck{background:var(--teal-ink);border-color:var(--teal-ink)}
.cur small{display:block;font:500 12.5px/1.3 var(--bf);color:var(--muted)}
.detail{background:var(--lilac);border:2px solid var(--purple);border-radius:18px;padding:14px;margin:12px 0}
.detail h3{font-size:21px}
/* doors */
.doors h3{font-size:24px}
.portals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0 12px}
.portal{--c:var(--coral);position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;min-height:196px;padding:34px 10px 14px;background:var(--pale);border:2px solid var(--gold-line);border-radius:50% 50% 20px 20px/78px 78px 20px 20px;box-shadow:0 10px 22px -12px var(--c);cursor:pointer;color:var(--navy);transition:transform .15s}
.portal:hover{transform:translateY(-3px)}
.portal.c-teal{--c:var(--teal)}.portal.c-purple{--c:var(--purple)}.portal.c-gold{--c:var(--gold)}.portal.c-navy{--c:var(--navy)}
.pico{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--c);color:var(--navy);border:2px solid var(--navy)}
.portal.c-purple .pico,.portal.c-navy .pico{color:#fff}
.pico .ico{width:25px;height:25px}
.pname{display:inline-block;background:var(--c);color:var(--navy);border-radius:999px;padding:3px 12px;font:700 14.5px/1.25 var(--bf)}
.portal.c-purple .pname,.portal.c-navy .pname{color:#fff}
.ptag{font:700 11.5px var(--bf);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pgoal{font:700 15px/1.25 var(--hf);color:var(--navy)}
.portal[aria-pressed=true]{border:3px solid var(--c);background:#fff;transform:translateY(-3px)}
.portal.c-navy[aria-pressed=true]{border-color:var(--navy)}
.portal.wide{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;justify-content:center;min-height:0;padding:12px 16px;border-radius:999px;gap:10px 12px}
.portal.wide .ptag{letter-spacing:.08em}
.door{--c:var(--coral);border:2px solid var(--c);border-top-width:8px;border-radius:var(--r);background:#fff;padding:16px;margin:0 0 14px;box-shadow:var(--sh)}
.door.c-teal{--c:var(--teal)}.door.c-purple{--c:var(--purple)}.door.c-gold{--c:var(--gold)}.door.c-navy{--c:var(--navy)}
.door .tag{display:inline-block;background:var(--c);color:var(--navy);border-radius:999px;padding:3px 13px;font:700 12px var(--bf);letter-spacing:.09em;text-transform:uppercase}
.door.c-purple .tag,.door.c-navy .tag{color:#fff}
.door h3{font-size:26px;margin:10px 0 2px}
/* checklist and meter */
.chk{display:flex;gap:12px;align-items:center;min-height:54px;padding:10px 12px;border:2px solid var(--cool-line);border-radius:14px;background:#fff;margin:0 0 8px;cursor:pointer}
.chk input{flex:none;width:26px;height:26px;margin:0;accent-color:var(--teal-ink)}
.chk b{display:block;font:700 16px/1.3 var(--bf)}
.chk small{display:block;font-size:13px;color:var(--muted)}
.chk:has(input:checked){background:var(--mint);border-color:var(--teal-ink)}
.meter{height:14px;border-radius:99px;background:var(--gold-soft);border:1.5px solid var(--gold-line);overflow:hidden;margin:8px 0}
.meter>i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--coral),var(--gold),var(--teal));border-radius:99px;transition:width .3s}
/* cart math */
.nums{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:12px}
.fl{display:block;font:700 12.5px var(--bf);letter-spacing:.06em;text-transform:uppercase;color:var(--navy);margin:0 0 4px}
.fl.q{text-transform:none;letter-spacing:0;font-size:15px;line-height:1.35;margin:0 0 6px}
.field{display:block;width:100%;min-height:48px;padding:12px 14px;border:2px solid var(--wood);border-radius:14px;font-size:16px;line-height:1.4;background:#fff;color:var(--navy)}
textarea.field{min-height:92px;resize:vertical}
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}
.tile{border-radius:16px;padding:14px;background:var(--navy);color:#fff;min-width:0}
.tile.cash{background:var(--gold-soft);color:var(--navy);border:2px solid var(--gold-line)}
.tile.tbd{grid-column:1/-1;background:#fff;color:var(--navy);border:2px dashed var(--navy)}
.tile b{display:block;font:700 clamp(22px,6.2vw,36px)/1.05 var(--hf);overflow-wrap:anywhere}
.tile span{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
.bars{width:100%;max-width:440px;height:auto;display:block}
.bars text{font:700 13px var(--bf);fill:var(--navy)}
.bars .bg{fill:var(--gold-soft);stroke:var(--gold-line);stroke-width:1.5}
.bars .b1{fill:var(--gold-line)}
.bars .b2{fill:var(--teal)}
/* fields with a mic */
.fw{position:relative;margin:0 0 12px}
.fw textarea.field{padding-right:62px}
.mic{position:absolute;top:8px;right:8px;width:46px;height:46px;border-radius:50%;border:2px solid var(--navy);background:var(--navy);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
.mic svg{width:22px;height:22px;fill:currentColor;stroke:none}
.mic.live{background:var(--err);border-color:var(--err);animation:pulse 1.2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 7px rgba(168,50,43,.28)}}
.vn{min-height:1.4em;font-size:13.5px;color:var(--teal-deep);margin:4px 2px 0}
.vn.bad{color:var(--err)}
.pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#fff;border:2px solid var(--cool-line);border-radius:14px;padding:14px;font:14px/1.5 var(--bf);margin:8px 0;max-height:480px;overflow:auto}
.ta{display:block;width:100%;min-height:200px;border:2px solid var(--wood);border-radius:14px;padding:12px;font:14px/1.5 var(--bf);margin:8px 0;background:#fff}
/* engine: the suitcase with six trays */
.case{position:relative;background:var(--navy);color:var(--cream);border:4px solid var(--gold);border-radius:26px;padding:26px 16px 18px;margin:30px 0 16px;box-shadow:inset 0 0 0 2px rgba(255,242,226,.18),var(--sh)}
.case::before{content:"";position:absolute;left:50%;top:-24px;width:92px;height:22px;margin-left:-46px;border:4px solid var(--gold);border-bottom:0;border-radius:16px 16px 0 0}
.case h3{color:var(--cream);font-size:24px}
.case .sub{color:var(--pale);margin:2px 0 14px}
.trays{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tray{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 12px;align-items:center;background:rgba(255,242,226,.09);border:1.5px solid rgba(255,242,226,.35);border-radius:16px;padding:10px 12px}
.tray .n{grid-row:1/3}
.tray b{font:700 16px/1.25 var(--bf);color:#fff}
.tray .tp2{justify-self:start;background:var(--pale);color:var(--navy);border-radius:999px;padding:2px 12px;font:700 12.5px/1.4 var(--bf)}
.tray:nth-child(6n+2) .n{background:var(--teal)}
.tray:nth-child(6n+3) .n{background:var(--purple);color:#fff}
.tray:nth-child(6n+4) .n{background:var(--gold)}
.tray:nth-child(6n+5) .n{background:var(--coral)}
.tray:nth-child(6n+6) .n{background:var(--teal)}
.helper{display:flex;align-items:center;gap:12px;margin-top:14px}
.helper svg{width:76px;height:76px;flex:none;max-width:none}
.helper span{font:700 15px/1.3 var(--hf);color:var(--gold)}
.rb-head{fill:var(--teal);stroke:var(--navy);stroke-width:2.4}.rb-body{fill:var(--gold);stroke:var(--navy);stroke-width:2.4}.rb-eye{fill:var(--navy)}.rb-line{fill:none;stroke:var(--navy);stroke-width:2.4;stroke-linecap:round}.rb-cheek{fill:var(--coral)}.rb-ball{fill:var(--coral)}
/* voice panel */
.vp{background:var(--chalk);color:var(--cream);border:4px solid var(--wood);border-radius:26px;padding:20px 18px;margin:0 0 16px;box-shadow:inset 0 0 0 2px rgba(255,242,226,.42)}
.vp h3{color:var(--cream);font-size:24px;margin:0 0 8px}
.vp p{color:var(--pale)}
.vp .field{background:var(--chalk-soft);color:var(--cream);border-color:var(--sage)}
.vp .fl{color:var(--cream)}
.vs{min-height:1.3em;color:var(--teal);font-weight:700;font-size:15px;margin:8px 0 0}
.vs.bad{color:var(--blush)}
.priv{font-size:13px;color:var(--pale);margin:10px 0 0}
.draft{display:inline-block;background:var(--gold);color:var(--navy);border-radius:8px;padding:2px 8px;font:700 12px var(--bf);margin-left:6px}
/* worksheet and its trail */
.wsn{display:flex;align-items:center;gap:10px;margin:0 0 6px}
.wsn b{font:700 16px var(--bf)}
.wsn.w1 .n{background:var(--teal)}.wsn.w2 .n{background:var(--purple);color:#fff}.wsn.w3 .n{background:var(--gold)}.wsn.w4 .n{background:var(--navy);color:#fff}
.trail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 6px;margin:14px 0 8px}
.tp{--c:var(--coral);position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;color:var(--navy);text-align:center;min-width:0}
.tp.t1{--c:var(--teal)}.tp.t2{--c:var(--purple)}.tp.t3{--c:var(--gold)}.tp.t4{--c:var(--navy)}
.tp .tn{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--pale);border:3px solid var(--c);font:700 20px var(--hf);color:var(--navy);box-shadow:var(--sh)}
.tp.done .tn{background:var(--c)}
.tp.t2.done .tn,.tp.t4.done .tn{color:#fff}
.tp b{font:700 12.5px/1.25 var(--bf)}
.tp:not(:nth-child(3n))::after{content:"";position:absolute;top:26px;left:calc(50% + 31px);width:calc(100% - 56px);border-top:3px dotted var(--gold-line)}
.tp.end{grid-column:1/-1;justify-self:center}
.tp.end::after{display:none}
.tcoast{width:68px;height:68px;border-radius:50%;border:3px solid var(--gold);overflow:hidden;background:linear-gradient(165deg,var(--sky),var(--peach));display:block;box-shadow:var(--sh)}
.tcoast img{display:block;width:100%;height:100%;object-fit:cover}
.banner{background:var(--gold-soft);border:2px solid var(--gold-line);border-radius:16px;padding:14px;margin:14px 0;font:700 17px/1.3 var(--hf);color:var(--navy)}
.banner span{display:block;font:500 15px var(--bf);color:var(--muted);margin-top:2px}
/* what's next, sources, footer */
.cards3{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.nc{--c:var(--coral);display:flex;flex-direction:column;gap:8px;background:var(--pale);border:2px solid var(--gold-line);border-top:8px solid var(--c);border-radius:var(--r);padding:16px;box-shadow:var(--sh)}
.nc:nth-child(3n+2){--c:var(--teal)}.nc:nth-child(3n+3){--c:var(--purple)}
.nc h3{font-size:21px}
.nc .ni{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--c);color:var(--navy)}
.nc:nth-child(3n+3) .ni{color:#fff}
.nc .btn{margin-top:auto}
.nc .room{font-weight:700;color:var(--navy);background:var(--gold-wash);border:1.5px dashed var(--gold-line);border-radius:12px;padding:10px 12px;font-size:15px;margin:auto 0 0}
.src{list-style:none;margin:10px 0;padding:0;display:grid;gap:8px}
.src li{background:#fff;border:1.5px solid var(--cool-line);border-radius:14px;padding:10px 12px;overflow-wrap:anywhere}
.src b,.src a,.src span{display:block}
.src b,.src a{font-weight:700}
.foot{background:var(--chalk-deep);color:var(--cream);margin-top:44px;padding:30px 0 38px;border-top:4px solid var(--gold)}
.foot .word{margin-bottom:14px}
.foot .tm{font:700 clamp(19px,5.2vw,26px)/1.25 var(--hf);color:var(--cream);margin:0 0 12px}
.foot p{color:var(--pale);font-size:14px;margin:0 0 8px}
.foot .gold{color:var(--gold);font-weight:700}
.foot .fine{font-size:13px;color:var(--sage)}
/* desktop */
@media (min-width:560px){.savechip{display:inline-block}}
@media (min-width:640px){
  .plan{grid-template-columns:repeat(4,minmax(0,1fr))}
  .plan.five{grid-template-columns:repeat(5,minmax(0,1fr))}
  .stopc.xc{grid-column:auto}
  .grid2{grid-template-columns:repeat(3,minmax(0,1fr))}
  .portals{grid-template-columns:repeat(4,minmax(0,1fr))}
  .nums{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tile.tbd{grid-column:auto}
  .cards3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kv{grid-template-columns:repeat(3,minmax(0,1fr))}
  .trays{grid-template-columns:repeat(2,minmax(0,1fr))}
  .trail{grid-template-columns:repeat(7,minmax(0,1fr))}
  .tp::after{content:"";position:absolute;top:26px;left:calc(50% + 31px);width:calc(100% - 56px);border-top:3px dotted var(--gold-line)}
  .tp.end{grid-column:auto;justify-self:stretch}
  .band{padding:28px 30px 26px}
  .hero-panel{padding:30px 30px 26px}
}
@media (min-width:760px){
  .savechip{display:none}
  .topnav{display:flex;align-items:center;gap:8px;margin-left:10px}
  .topnav a{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;color:var(--cream);font:700 13px var(--bf);border-radius:999px;min-height:44px;min-width:44px}
  .topnav .nn b{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--coral);color:var(--navy);font:700 15px var(--hf)}
  .topnav .nn.teal b{background:var(--teal)}.topnav .nn.purple b{background:var(--purple);color:#fff}.topnav .nn.gold b{background:var(--gold)}
  .topnav .nn span{display:none}
  .topnav .xcb{background:var(--gold);color:var(--navy);padding:0 14px}
  .topnav .xcb .ico{width:18px;height:18px}
  .topnav a:hover b{outline:2px solid var(--cream)}
}
@media (min-width:1100px){
  .topnav .nn{padding-right:10px}
  .topnav .nn span{display:inline}
}
@media (min-width:880px){
  .hero{min-height:600px;display:flex;align-items:center;padding:52px 0 70px}
  .hero-art{position:absolute;top:0;right:0;bottom:0;width:56%;height:auto;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 34%);mask-image:linear-gradient(to right,transparent 0,#000 34%)}
  .hero-img{object-position:50% 20%}
  .hero .wrap{width:100%}
  .hero-panel{margin-top:0;max-width:580px}
  .sec{padding-top:56px}
  .band-art{width:30%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}