/* Elf Tracker set-up, the 2026 design (Paul approved 2 Nov 2026). Mock-up: elf-watch-preview/public/tracker-redesign,
   screens 0 to 6. js/tracker-new/setup-2026.js adds main#app.tk-s26, the step bar (#trxNav, before #app) and the
   Elf HQ file (.trx-file in .ob-vis); the right half (.ob-pane.trx-card) is a cream card with icicles.
   Loaded last on tracker.html and tracker-new.html, scoped to #app.tk-s26 so nothing else changes.
   No bottom bar: the step bar at the top is the only navigation (Paul, 2 Nov 2026). */

body.tnew{--s26-night:#0B1D4D;--s26-ink:#16296A;--s26-cream:#FFF8E8;--s26-gold:#F5C24A;--s26-red:#D9283E;--s26-green:#1E9A4F;
  --s26-cap:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='36' viewBox='0 0 260 36'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='36' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.42' stop-color='%23fff'/%3E%3Cstop offset='.62' stop-color='%23E4EEFC'/%3E%3Cstop offset='1' stop-color='%23B9D0F2'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 8 C10 8 14 3 26 3 C38 3 42 9 54 9 C64 9 70 1 86 1 C102 1 106 8 118 8 C128 8 134 4 146 4 C158 4 162 10 174 10 C184 10 190 2 204 2 C218 2 222 8 234 8 C244 8 250 8 260 8 L260 18 C255.0 18.6 253.0 18.4 250.0 19 C248.8 24.4 247.8 28.0 246.0 28.0 C244.2 28.0 243.2 24.4 242.0 19 C235.0 18.6 231.0 18.4 228.0 19 C226.8 23.2 225.8 26.0 224.0 26.0 C222.2 26.0 221.2 23.2 220.0 19 C208.2 18.6 199.5 18.4 196.5 19 C195.2 25.6 194.0 30.0 192.0 30.0 C190.0 30.0 188.8 25.6 187.5 19 C175.5 18.6 166.5 18.4 163.5 19 C162.4 22.6 161.6 25.0 160.0 25.0 C158.4 25.0 157.6 22.6 156.5 19 C146.2 18.6 139.0 18.4 136.0 19 C134.5 28.0 133.2 34.0 131.0 34.0 C128.8 34.0 127.5 28.0 126.0 19 C114.0 18.6 105.0 18.4 102.0 19 C100.8 25.0 99.8 29.0 98.0 29.0 C96.2 29.0 95.2 25.0 94.0 19 C81.8 18.6 72.5 18.4 69.5 19 C68.5 22.0 67.6 24.0 66.0 24.0 C64.4 24.0 63.5 22.0 62.5 19 C56.5 18.6 53.5 18.4 50.5 19 C49.1 26.2 48.0 31.0 46.0 31.0 C44.0 31.0 42.9 26.2 41.5 19 C31.2 18.6 24.0 18.4 21.0 19 C19.8 23.2 18.8 26.0 17.0 26.0 C15.2 26.0 14.2 23.2 13.0 19 C6.5 18.4 4 18.6 0 18 Z' fill='url(%23g)'/%3E%3C/svg%3E")}

/* ---------- the step bar (top) ----------
   Paul has not decided yet whether to keep it. ONE SWITCH hides it cleanly, with no gap left behind: either put
   class="s26-nosteps" on <body> in tracker.html and tracker-new.html, or change the line below to
   body.tnew .trx-nav-wrap{display:none!important}. The set-up works the same without it (each card has its own Back). */
body.tnew.s26-nosteps .trx-nav-wrap{display:none!important}
.trx-nav-wrap[hidden]{display:none!important}
.trx-nav-wrap{position:relative;z-index:3;box-sizing:border-box;width:100%;max-width:1200px;margin:8px auto 0;padding:0 16px}
.trx-nav{list-style:none;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:8px;border-radius:20px;background:rgba(8,20,58,.86);
  border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 10px 24px rgba(0,0,0,.3);max-width:760px;margin:0 auto}
.trx-nav li{display:flex;min-width:0}
/* 5 short words, never cut and never hyphenated: they fit at 320 wide in every language (German the longest) */
.trx-nav :is(button,.trx-step){flex:1;min-width:0;display:grid;justify-items:center;align-content:start;gap:6px;min-height:60px;padding:8px 2px;border:0;border-radius:14px;background:none;color:#9FB4E6;
  font:800 13px/1.15 'Plus Jakarta Sans','Inter',sans-serif;text-align:center;box-sizing:border-box;white-space:nowrap;hyphens:manual;transition:background .2s,color .2s,transform .3s cubic-bezier(.34,1.56,.64,1)}
.trx-nav b{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.1);color:#DCE6FF;font-size:15px}
.trx-nav button{cursor:pointer}
.trx-nav button:hover{background:rgba(255,255,255,.1);color:#fff}
.trx-nav button:focus-visible{outline:3px solid var(--s26-gold);outline-offset:2px}
.trx-nav .done{color:#DCE6FF}
.trx-nav .done b{background:var(--s26-green);color:#fff}
.trx-nav .now{background:var(--s26-cream);color:var(--s26-night);transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.35)}
.trx-nav .now b{background:var(--s26-red);color:#fff}
@media (max-width:420px){
  .trx-nav-wrap{padding:0 12px}
  .trx-nav{gap:2px;padding:5px;border-radius:18px}
  .trx-nav :is(button,.trx-step){font-size:11.5px;letter-spacing:-.01em;padding:7px 0;min-height:56px;gap:5px}
  .trx-nav b{width:28px;height:28px;font-size:14px}
}
@media (max-width:340px){.trx-nav :is(button,.trx-step){font-size:11px;letter-spacing:-.02em}}

/* ---------- the two halves (computers) ---------- */
@media (min-width:1000px){
  body.tnew #app.tk-s26{max-width:1200px;padding:28px 16px 56px;min-height:0}
  body.tnew #app.tk-s26.ob-grid,body.tnew #app.tk-s26 .ob-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)!important;column-gap:32px!important;align-items:stretch!important;align-content:start!important}
  body.tnew #app.tk-s26 .ob-grid>.ob-vis,body.tnew #app.tk-s26.ob-grid>.ob-vis{align-self:stretch!important;display:flex;flex-direction:column}
  body.tnew #app.tk-s26 .ob-grid>.ob-pane,body.tnew #app.tk-s26.ob-grid>.ob-pane{align-self:stretch!important;max-width:none}
}

/* ---------- the Elf HQ file ---------- */
#app.tk-s26 .trx-file{position:relative;box-sizing:border-box;display:flex;flex-direction:column;border-radius:26px;color:#fff;padding:36px 24px 24px;
  background:radial-gradient(70% 60% at 80% 0%,rgba(148,197,255,.25),transparent 60%),linear-gradient(180deg,#14306F,#0B1D4D);
  border:2px solid rgba(245,194,74,.7);box-shadow:0 0 50px rgba(245,194,74,.18),0 18px 40px rgba(0,0,0,.45);min-width:0}
#app.tk-s26 .trx-file::after,#app.tk-s26 .trx-card::after{content:"";position:absolute;left:-6px;right:-6px;top:-15px;height:36px;z-index:3;pointer-events:none;
  background:var(--s26-cap) repeat-x left top/260px 36px;border-radius:16px 16px 6px 6px}
#app.tk-s26 .ob-vis>.trx-file{flex:1 1 auto}
#app.tk-s26 .trx-file__top{display:flex;justify-content:space-between;align-items:center;gap:10px;font:700 12px/1 ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.12em;color:#7CF0A9}
#app.tk-s26 .trx-file__top i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#FF2A3D;margin-right:7px;box-shadow:0 0 8px #FF2A3D;animation:s26Rec 1.1s steps(1) infinite}
@keyframes s26Rec{50%{opacity:0}}
#app.tk-s26 .trx-radar{position:relative;margin:16px 0 0;flex:1 1 auto;min-height:240px;border-radius:18px;overflow:hidden;background:#06102E;border:1px solid rgba(124,240,169,.35);display:flex;flex-direction:column}
#app.tk-s26 .trx-radar__map{position:relative;flex:1 1 auto;min-height:240px;background:#06102E url(/img/tracker/map-night.jpg) center/cover;overflow:hidden}
#app.tk-s26 .trx-radar__map::before{content:"";position:absolute;inset:0;background:repeating-radial-gradient(circle at 50% 50%,transparent 0 38px,rgba(124,240,169,.16) 39px 40px),
  linear-gradient(transparent 49.6%,rgba(124,240,169,.25) 50%,transparent 50.4%),linear-gradient(90deg,transparent 49.8%,rgba(124,240,169,.25) 50%,transparent 50.2%)}
#app.tk-s26 .trx-radar__map::after{content:"";position:absolute;left:50%;top:50%;width:160%;aspect-ratio:1;translate:-50% -50%;background:conic-gradient(from 0deg,rgba(124,240,169,.45),transparent 12%);
  animation:s26Sweep 4s linear infinite;mix-blend-mode:screen}
@keyframes s26Sweep{to{rotate:360deg}}
#app.tk-s26 .trx-radar__pin{position:absolute;left:58%;top:42%;z-index:2;width:66px;height:66px;border-radius:50%;border:3px solid var(--s26-gold);background:#fff;overflow:hidden;
  box-shadow:0 0 0 6px rgba(245,194,74,.25),0 8px 18px rgba(0,0,0,.5);translate:-50% -50%;animation:s26Pop .5s cubic-bezier(.34,1.56,.64,1)}
#app.tk-s26 .trx-radar__pin img{width:100%;height:100%;object-fit:cover;object-position:top}
#app.tk-s26 .trx-radar__pin.empty{background:var(--s26-night);display:grid;place-items:center;color:var(--s26-gold);font:900 26px/1 'Plus Jakarta Sans',sans-serif;animation:none}
@keyframes s26Pop{from{scale:.6;opacity:0}}
#app.tk-s26 .trx-radar__status{position:absolute;left:50%;bottom:12px;translate:-50% 0;z-index:2;max-width:calc(100% - 24px);box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;padding:6px 12px;border-radius:8px;
  background:rgba(3,10,30,.82);font:700 12px/1 ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.1em;color:#7CF0A9;white-space:nowrap}
#app.tk-s26 .trx-rows{display:grid;gap:2px;margin:16px 0 0;border-radius:16px;overflow:hidden}
#app.tk-s26 .trx-row{display:grid;grid-template-columns:120px minmax(0,1fr);gap:12px;align-items:center;padding:12px 16px;background:rgba(255,255,255,.06)}
#app.tk-s26 .trx-row dt{font:700 11px/1.25 ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:#9FB4E6}
#app.tk-s26 .trx-row dd{margin:0;font:700 16px/1.3 'Plus Jakarta Sans','Inter',sans-serif;color:#fff;min-height:21px;overflow-wrap:break-word}
#app.tk-s26 .trx-row dd.wait{color:#7F93BF;font-weight:600}
#app.tk-s26 .trx-row dd .chip{display:inline-block;margin:0 6px 4px 0;padding:3px 10px;border:0;border-radius:999px;background:rgba(245,194,74,.18);color:var(--s26-gold);font:700 14px/1.3 'Plus Jakarta Sans',sans-serif;min-height:0}
#app.tk-s26 .trx-dots{display:inline-flex;gap:6px;vertical-align:middle}
#app.tk-s26 .trx-dots i{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.14);font:900 11px/1 sans-serif;font-style:normal;color:#fff}
#app.tk-s26 .trx-dots i.seen{background:#17803F}
#app.tk-s26 .trx-seen{color:#7CF0A9;font-size:14px}
/* the screen's own picture inside the file (the welcome camera, the search map, the save screen's globe) */
#app.tk-s26 .trx-file.own .trx-radar{background:none;border:0;border-radius:18px;min-height:0}
#app.tk-s26 .trx-file.own .trx-radar>*{margin:0!important;width:100%!important;max-width:none!important;border:0!important;border-radius:18px!important;box-shadow:none!important}
#app.tk-s26 .trx-file.own .trx-radar .rc-screen{border:0!important;border-radius:18px!important;box-shadow:none!important}
#app.tk-s26 .trx-file.own .trx-radar .welcam{position:relative}
@media (min-width:1000px){
  #app.tk-s26 .trx-file.own .trx-radar>:is(.kmap,.hookmap){flex:1 1 auto;min-height:300px;height:auto!important}
  #app.tk-s26 .trx-file.own .trx-radar>.kmap{aspect-ratio:auto}
}

/* ---------- the card ---------- */
body.tnew #app.tk-s26 .ob-pane.trx-card{position:relative;display:flex;flex-direction:column;justify-content:center;gap:18px;box-sizing:border-box;min-width:0;
  background:var(--s26-cream)!important;color:var(--s26-ink);border:0!important;border-radius:26px!important;padding:36px 32px 32px!important;
  box-shadow:0 18px 40px rgba(0,0,0,.4)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;text-align:left}
#app.tk-s26 .trx-card :is(.h,h1,h2,.kidh){color:var(--s26-night)!important;text-shadow:none!important;text-align:left;text-wrap:balance}
#app.tk-s26 .trx-card .h{font:800 clamp(28px,3vw,40px)/1.1 'Plus Jakarta Sans','Inter',sans-serif!important;letter-spacing:-.01em;margin:0}
#app.tk-s26 .trx-card :is(p,.sub,.hint,.small,.credit,label,.k,.qage-q,.qage-small,.preview,span.qelf,.disclaim,.note){color:#26365F!important;text-shadow:none!important;background:none!important;box-shadow:none!important}
#app.tk-s26 .trx-card .sub{font-size:17px;line-height:1.55;padding:0!important;margin:0;width:auto}
#app.tk-s26 .trx-card :is(.small,.hint,.credit,.disclaim){font-size:14px;line-height:1.5;color:#4A5B7D!important;padding:0!important;width:auto}
#app.tk-s26 .trx-card .k{color:#B3122A!important;font:800 12px/1.2 'Plus Jakarta Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:0!important;margin:0}
#app.tk-s26 .trx-card .warn{color:#B3122A!important;background:#FDE8EB!important;border-radius:12px;padding:10px 14px!important;text-shadow:none!important;font-weight:700;font-size:15px}
#app.tk-s26 .trx-card .ok,#app.tk-s26 .trx-card #cwarn.hint{color:#11663A!important;background:#E3F6EA!important;border-radius:12px;padding:10px 14px!important}
#app.tk-s26 .trx-card a{color:#B3122A}
#app.tk-s26 .trx-card .fill{display:none}
/* buttons: one big red one; the rest are clear secondary buttons (Jay: buttons, not links) */
#app.tk-s26 .trx-card .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:58px;padding:0 24px!important;border:0;border-radius:999px!important;
  font:800 18px/1.15 'Plus Jakarta Sans','Inter',sans-serif!important;text-decoration:none;cursor:pointer;box-sizing:border-box;transition:transform .3s cubic-bezier(.34,1.56,.64,1),background .2s}
#app.tk-s26 .trx-card .btn.red{background:var(--s26-red)!important;color:#fff!important;box-shadow:0 5px 0 #9F1D2B,0 12px 24px rgba(0,0,0,.2)!important}
#app.tk-s26 .trx-card .btn.red:hover{transform:translateY(-2px)}
#app.tk-s26 .trx-card .btn.red:active{transform:translateY(3px);box-shadow:0 2px 0 #9F1D2B!important}
#app.tk-s26 .trx-card .btn.red:is(:disabled,.faded){background:#B9C2D6!important;box-shadow:0 5px 0 #8E98AE!important;cursor:not-allowed;transform:none;opacity:1}
#app.tk-s26 .trx-card .btn.green{background:var(--s26-green)!important;color:#fff!important;box-shadow:0 5px 0 #11663A,0 12px 24px rgba(0,0,0,.15)!important}
#app.tk-s26 .trx-card :is(.btn.white,.btn.navy){background:#fff!important;color:var(--s26-night)!important;border:2px solid var(--s26-night)!important;box-shadow:none!important;min-height:52px;font-size:16px!important}
#app.tk-s26 .trx-card .btn.sm{width:auto;min-height:48px;font-size:15px!important;padding:0 18px!important}
#app.tk-s26 .trx-card :is(.link,.inlink):not(.pwshow){display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;min-height:44px;padding:0 18px!important;border:2px solid #C9D2E6!important;border-radius:999px;
  background:#fff!important;color:#2F5FB8!important;font:700 15px/1.2 'Inter',sans-serif;text-decoration:none!important;cursor:pointer;text-shadow:none!important;box-shadow:none!important;width:auto}
#app.tk-s26 .trx-card .inlink{min-height:36px;padding:0 12px!important;margin:4px 4px 0 0}
#app.tk-s26 .trx-card .stack{display:flex;flex-direction:column;gap:12px}
#app.tk-s26 .trx-card .stack>:is(.link,.small){align-self:center;text-align:center}
#app.tk-s26 .trx-card .credit a{color:#4A5B7D;font-size:12px}
/* back: a small pale pill at the top */
#app.tk-s26 .trx-card .qback{position:static!important;align-self:flex-start;display:inline-flex;align-items:center;gap:6px;min-height:40px;margin:0!important;border:0;background:#EEF3FF!important;color:var(--s26-night)!important;
  border-radius:999px;padding:0 16px;font:700 14px/1 'Inter',sans-serif;text-shadow:none!important;box-shadow:none!important;cursor:pointer}
/* the dots moved up into the step bar; the "Free" pill and "Elf 1 of 2" stay */
#app.tk-s26 .trx-card .qprog{position:static!important;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0}
#app.tk-s26 .trx-card .qdots{display:none}
#app.tk-s26 .trx-card .tn-free--chip{background:#FFE7A3!important;border:2px solid var(--s26-gold)!important;color:var(--s26-night)!important}
#app.tk-s26 .trx-card .qelf{color:#B3122A!important}
#app.tk-s26 .trx-card .why{color:var(--s26-night)}
/* boxes to type in */
#app.tk-s26 .trx-card :is(input.in,input[type=email],input[type=password],input[type=text],input:not([type]),select){font:500 17px/1.2 'Inter',sans-serif!important;min-height:54px;width:100%;box-sizing:border-box;padding:0 18px;
  border:1.5px solid #17274455;border-radius:14px!important;background:#fff!important;color:#172744!important;text-align:left;box-shadow:none}
#app.tk-s26 .trx-card :is(input,select):focus{border-color:#2F5FB8;outline:3px solid rgba(47,95,184,.3);outline-offset:1px}
#app.tk-s26 .trx-card .field{display:grid;gap:8px}
#app.tk-s26 .trx-card .field>label,#app.tk-s26 .trx-card .qname>span{font:800 15px/1.2 'Plus Jakarta Sans','Inter',sans-serif!important;color:var(--s26-night)!important}
#app.tk-s26 .trx-card .tick{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.4;color:#26365F!important}
#app.tk-s26 .trx-card .tick input{width:22px;height:22px;min-height:0;flex:none;margin:1px 0 0;accent-color:var(--s26-red)}

/* the number buttons (how many children, how many Elves) */
#app.tk-s26 .trx-card .qnums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
#app.tk-s26 .trx-card .qnum{min-height:72px;border:2px solid #C9D2E6;border-radius:18px;background:#fff;color:var(--s26-night);font:800 30px/1 'Plus Jakarta Sans',sans-serif;cursor:pointer;
  box-shadow:0 8px 18px -12px rgba(11,29,77,.45);transition:transform .3s cubic-bezier(.34,1.56,.64,1),border-color .2s}
#app.tk-s26 .trx-card .qnum:hover{transform:translateY(-3px);border-color:var(--s26-gold)}
#app.tk-s26 .trx-card .qnum[aria-pressed="true"]{border-color:var(--s26-gold);background:#FFF1C2;box-shadow:0 0 0 4px rgba(245,194,74,.35)}

/* children: one white row each, the optional age inside it */
#app.tk-s26 .trx-card .qnames{display:grid;gap:10px}
#app.tk-s26 .trx-card .qkid{position:relative;display:grid;gap:10px;padding:14px;border-radius:16px;background:#fff;box-shadow:0 8px 18px -12px rgba(11,29,77,.45)}
#app.tk-s26 .trx-card .qkid:has(.qkidrm) .qname{padding-right:48px}
#app.tk-s26 .trx-card .qname{display:grid;gap:6px;margin:0}
#app.tk-s26 .trx-card .qkidrm{position:absolute;top:8px;right:8px;width:44px;height:44px;border:0;border-radius:50%;background:#EEF3FF;color:#4A5B7D;font-size:24px;line-height:1;cursor:pointer}
#app.tk-s26 .trx-card .qkidrm:hover{background:#FDE8EB;color:#B3122A}
#app.tk-s26 .trx-card .qaddkid2{min-height:52px;font-size:16px!important}
#app.tk-s26 .trx-card .qage{margin:0}
/* the quick start's "personalise" page fits a phone screen (Paul, 11 Nov 2026): smaller boxes, ages behind a switch */
#app.tk-s26 .trx-card .qnames.qfast{gap:8px}
#app.tk-s26 .trx-card .qnames.qfast .qkid{padding:10px 12px;gap:6px;border-radius:14px}
#app.tk-s26 .trx-card .qnames.qfast .qname{gap:4px}
#app.tk-s26 .trx-card .qnames.qfast .qname span{font-size:14px}
#app.tk-s26 .trx-card .qnames.qfast .in{min-height:46px;padding-top:8px;padding-bottom:8px;font-size:17px}
#app.tk-s26 .trx-card .qnames.qfast-ages .qkid{grid-template-columns:minmax(0,1fr) 92px;align-items:end}
#app.tk-s26 .trx-card .qnames.qfast-ages .qkid:has(.qkidrm){padding-right:56px}
#app.tk-s26 .trx-card .qnames.qfast-ages .qkid:has(.qkidrm) .qname{padding-right:0}
#app.tk-s26 .trx-card .qagen{display:grid;gap:4px;margin:0;font:700 13px/1.2 'Plus Jakarta Sans',sans-serif;color:var(--s26-night)}
#app.tk-s26 .trx-card .qagen .in{text-align:center;padding-left:6px;padding-right:6px}
#app.tk-s26 .trx-card .qlater{margin:4px 0 0;font-size:15px}
#app.tk-s26 .trx-card .qswitch{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:6px 4px;border:0;background:none;color:var(--s26-night);font:700 16px/1.2 'Plus Jakarta Sans',sans-serif;text-align:left;cursor:pointer}
#app.tk-s26 .trx-card .qswitch__t{flex:none;position:relative;width:50px;height:30px;border-radius:15px;background:#C9D2E6;transition:background .2s}
#app.tk-s26 .trx-card .qswitch__t i{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.25);transition:transform .2s}
#app.tk-s26 .trx-card .qswitch[aria-checked="true"] .qswitch__t{background:var(--s26-green)}
#app.tk-s26 .trx-card .qswitch[aria-checked="true"] .qswitch__t i{transform:translateX(20px)}
#app.tk-s26 .trx-card .qswitch:focus-visible{outline:3px solid var(--s26-gold);outline-offset:2px;border-radius:12px}
#app.tk-s26 .trx-card .qage-q{font:700 14px/1.3 'Plus Jakarta Sans',sans-serif!important;margin:0 0 8px}
#app.tk-s26 .trx-card .qage-chips .chip{min-height:44px;padding:0 14px;border:2px solid #C9D2E6;background:#fff;color:#26365F;font:700 14px 'Plus Jakarta Sans',sans-serif}
#app.tk-s26 .trx-card .qage-chips .chip[aria-pressed="true"]{background:var(--s26-night)!important;border-color:var(--s26-night)!important;color:#fff!important}

/* whose Elf: the children as big chips */
#app.tk-s26 .trx-card .qface{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:top;border:3px solid var(--s26-gold);background:#fff;margin:0}
#app.tk-s26 .trx-card .qchips{display:flex;flex-wrap:wrap;gap:10px}
/* the quick start's Elves so far, above "Is Buddy the only Elf?" (Paul, 11 Nov 2026: organised, every Elf and whose it is) */
#app.tk-s26 .trx-card .qelves{list-style:none;margin:0;padding:0;display:grid;gap:8px}
#app.tk-s26 .trx-card .qelves li{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:14px;background:#fff;box-shadow:0 8px 18px -12px rgba(11,29,77,.45);font:700 16px/1.3 'Plus Jakarta Sans',sans-serif;color:var(--s26-night)}
#app.tk-s26 .trx-card .qelves li::after{content:"\2713";margin-left:auto;color:var(--s26-green);font-weight:900}
#app.tk-s26 .trx-card .qelves img{flex:none;width:42px;height:42px;border-radius:50%;object-fit:cover;object-position:top;border:2px solid var(--s26-gold);background:#fff}
#app.tk-s26 .trx-card .qaddk{display:block;margin-top:2px}
#app.tk-s26 .trx-card .qname-k{margin:6px 0 0;font:700 15px/1.3 'Plus Jakarta Sans',sans-serif;color:var(--s26-night)}
#app.tk-s26 .trx-card .qchips .chip,#app.tk-s26 .trx-card .chips .chip{min-height:52px;padding:0 20px;border:2px solid #C9D2E6;border-radius:999px;background:#fff;color:var(--s26-night);font:800 17px 'Plus Jakarta Sans',sans-serif;cursor:pointer}
#app.tk-s26 .trx-card .qchips .chip[aria-pressed="true"],#app.tk-s26 .trx-card .chips .chip[aria-pressed="true"]{background:var(--s26-night);border-color:var(--s26-night);color:#fff}
#app.tk-s26 .trx-card .qchips .chip[aria-pressed="true"]::before{content:"\2713\00a0"}
#app.tk-s26 .trx-card .qallshare{margin:0;border:2px dashed var(--s26-gold);background:#FFF1C2;color:var(--s26-night);font:800 16px 'Plus Jakarta Sans',sans-serif;text-shadow:none}
#app.tk-s26 .trx-card .qallshare[aria-pressed="true"]{background:var(--s26-green);border:2px solid var(--s26-green);color:#fff}
#app.tk-s26 .trx-card .qallshare[aria-pressed="true"] .qtick::after{border-color:var(--s26-green)}
#app.tk-s26 .trx-card .qdone{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:14px;background:#E3F6EA;color:#11663A;font-weight:700}
#app.tk-s26 .trx-card .qdone img{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:top}
#app.tk-s26 .trx-card .qdone b{color:#17803F}

/* the Elf's name: one big box with a thicker border (Jay, 2 Nov 2026) */
#app.tk-s26 .trx-card #elfn{min-height:60px;font-size:20px!important;border:3px solid var(--s26-night)!important;padding:0 18px!important}

/* the Elf catalogue: Boy Elves / Girl Elves tabs, 4 across, "My Elf isn't here" a full-width bar under the grid */
#app.tk-s26 .trx-card .cattabs{align-self:flex-start;display:inline-flex;padding:4px;border-radius:999px;background:#EEF3FF;gap:4px}
#app.tk-s26 .trx-card .cattabs button{min-height:44px;border:0;background:none;border-radius:999px;padding:0 18px;font:800 15px/1 'Plus Jakarta Sans',sans-serif;color:#4A5B7D;cursor:pointer}
#app.tk-s26 .trx-card .cattabs button[aria-selected="true"]{background:var(--s26-night);color:#fff}
#app.tk-s26 .trx-card .catsec[hidden]{display:none}
#app.tk-s26 .trx-card .cath{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.tnew #app.tk-s26 .trx-card .grid2.cat{--c:var(--cw,4);display:flex!important;flex-wrap:wrap;justify-content:center;gap:10px;margin:0}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile:not(.nothere){flex:0 0 calc((100% - (var(--c) - 1) * 10px) / var(--c))!important;max-width:none}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile{width:auto;box-sizing:border-box;position:relative;padding:0;border:3px solid transparent;border-radius:16px;overflow:hidden;background:#fff;aspect-ratio:3/4;
  box-shadow:0 8px 18px -12px rgba(11,29,77,.5);transition:transform .3s cubic-bezier(.34,1.56,.64,1),border-color .2s;cursor:pointer}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-radius:0;display:block}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile:hover{transform:translateY(-4px)}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile[aria-pressed="true"]{border-color:var(--s26-gold);transform:translateY(-4px) scale(1.03);box-shadow:0 0 0 4px rgba(245,194,74,.35),0 14px 24px -10px rgba(0,0,0,.5)}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile[aria-pressed="true"]::after{content:"\2713";position:absolute;top:8px;right:8px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#17803F;color:#fff;font-weight:900;font-size:14px}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile.elfie span{position:absolute;left:0;right:0;bottom:0;padding:4px;background:rgba(255,255,255,.9);font-size:12px}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile.nothere{flex:0 0 100%!important;aspect-ratio:auto;min-height:56px;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:14px;border:0;
  background:var(--s26-night)!important;color:var(--s26-gold)!important;font:800 16px/1.2 'Plus Jakarta Sans',sans-serif!important;padding:8px 16px}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile.nothere .q{width:30px;height:30px;aspect-ratio:auto;border-radius:50%;background:rgba(245,194,74,.2)!important;font-size:18px!important;color:var(--s26-gold)!important;flex:none}
body.tnew #app.tk-s26 .trx-card .grid2.cat>.tile.nothere[aria-pressed="true"]{box-shadow:0 0 0 4px rgba(245,194,74,.6)}
@media (max-width:640px){body.tnew #app.tk-s26 .trx-card .grid2.cat{--c:var(--cn,3)}}

/* the town search */
#app.tk-s26 .trx-card .tpick{display:grid;gap:10px}
#app.tk-s26 .trx-card .tp-sug,#app.tk-s26 .trx-card .tsug{margin:4px 0 0;padding:6px;border-radius:14px;background:#fff!important;box-shadow:0 14px 30px -14px rgba(11,29,77,.5);color:var(--s26-ink)}
#app.tk-s26 .trx-card .tsug :is(li,button){color:var(--s26-ink)!important;border-radius:10px}
#app.tk-s26 .trx-card .tp-ok{background:#fff!important;border:2px solid var(--s26-gold);color:var(--s26-ink)}
#app.tk-s26 .trx-card .tp-ok b{color:var(--s26-night)!important}
#app.tk-s26 .trx-card #tctry{padding:14px;border-radius:14px;background:#EEF3FF}

/* the save screen and the email code */
#app.tk-s26 .trx-card .savecard{display:flex;flex-direction:column;gap:14px;background:none!important;border:0!important;padding:0!important;box-shadow:none!important;color:var(--s26-ink)}
#app.tk-s26 .trx-card .savecard h2{font:800 clamp(26px,2.8vw,36px)/1.1 'Plus Jakarta Sans',sans-serif!important;margin:0}
#app.tk-s26 .trx-card .camlist{list-style:none;margin:0;padding:0}
#app.tk-s26 .trx-card .camlist li,#app.tk-s26 .trx-card .camlist li button{background:#fff!important;color:var(--s26-ink)!important;border-radius:16px;text-shadow:none;border-color:#C9D2E6}
#app.tk-s26 .trx-card .camlist li :is(b,span){color:var(--s26-ink)!important}
#app.tk-s26 .trx-card .camlist li .ok{color:#17803F!important}
#app.tk-s26 .trx-card .hdistrow{color:var(--s26-ink)!important}
#app.tk-s26 .trx-card .code{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;width:100%}
#app.tk-s26 .trx-card .code input{width:100%;min-width:0;height:64px;padding:0!important;text-align:center!important;font:800 28px/1 'Plus Jakarta Sans',sans-serif!important;border:2px solid #17274466!important}
#app.tk-s26 .trx-card .row2.links{display:flex;flex-wrap:wrap;gap:10px}
#app.tk-s26 .trx-card .sso{min-height:56px;border-radius:999px;border:2px solid #C9D2E6;background:#fff;color:var(--s26-night)}
#app.tk-s26 .trx-card .sso.apple{background:#000;color:#fff;border-color:#000}
#app.tk-s26 .trx-card .tn-free-stamp{margin:0}
/* the welcome */
#app.tk-s26 .trx-card .resume{background:#fff!important;border:2px solid var(--s26-gold)!important;border-radius:18px!important;padding:14px 16px!important;color:var(--s26-ink)}
#app.tk-s26 .trx-card .resume b{color:var(--s26-night)}
#app.tk-s26 .trx-card .qrcard{background:#fff!important;border:1px solid #DCE3F2!important;color:var(--s26-ink)}
#app.tk-s26 .trx-card .qrcard b{color:var(--s26-night)}
#app.tk-s26 .trx-card .sightings{font-weight:600;color:#26365F!important}
/* the search map's words under the map */
#app.tk-s26 .trx-card .safter{display:flex;flex-direction:column;gap:14px}
/* the checked-in screen */
#app.tk-s26 .trx-card :is(.rwsaved,.freevid,.count,.alsotxt,.qmovehint){background:#E3F6EA!important;color:#11663A!important;text-shadow:none!important}
#app.tk-s26 .trx-card .card:not(.savecard):not(.resume){background:#fff!important;border:1px solid #DCE3F2!important;color:var(--s26-ink)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
#app.tk-s26 .trx-card .card :is(b,h2,h3,p,span){color:inherit;text-shadow:none}

@media (min-width:700px) and (max-width:999px){body.tnew #app.tk-s26{max-width:680px;margin:0 auto}}
@media (max-width:360px){
  body.tnew #app.tk-s26 .ob-pane.trx-card{padding:30px 14px 18px!important}
  #app.tk-s26 .trx-card .qnum{min-height:64px}
  #app.tk-s26 .trx-card .code{gap:5px}
  #app.tk-s26 .trx-card .code input{height:54px;font-size:22px!important}
}
@media (prefers-reduced-motion:reduce){
  #app.tk-s26 .trx-radar__map::after,#app.tk-s26 .trx-file__top i{animation:none}
  .trx-nav .now{transform:none}
}
/* every block in the card runs the full width of the card (the town box and Next were 520px and centred) */
#app.tk-s26 .trx-card :is(.btn:not(.sm),.field,.tpick,.tp-find,.tp-ok,.warn,.stack,.savecard,.camlist,.qnames,.qnums,.code){max-width:none!important;margin-left:0!important;margin-right:0!important}
/* the search (spot): Elf HQ's lines type in on the card while the radar searches, then the words take over */
.ssearch{display:none}
#app.tk-s26 .ssearch{display:grid;gap:14px}
#app.tk-s26 .trx-card:has(#safter.on) .ssearch{display:none}
#app.tk-s26 .safter:not(.on){display:none!important}
#app.tk-s26 .safter.on{animation:s26In .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes s26In{from{opacity:0;translate:0 8px}}
#app.tk-s26 .trx-search{display:grid;gap:12px;padding:18px;border-radius:18px;background:#06122F;color:#7CF0A9;font:700 14px/1.6 ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.06em}
#app.tk-s26 .trx-search p{margin:0;color:#7CF0A9!important;opacity:0;animation:s26Line .4s forwards;overflow-wrap:anywhere}
#app.tk-s26 .trx-search p:nth-child(2){animation-delay:1.3s}#app.tk-s26 .trx-search p:nth-child(3){animation-delay:4.6s}#app.tk-s26 .trx-search p:nth-child(4){animation-delay:6.7s}
@keyframes s26Line{to{opacity:1}}
#app.tk-s26 .trx-bar-load{height:8px;border-radius:999px;background:#13244F;overflow:hidden}
#app.tk-s26 .trx-bar-load i{display:block;height:100%;width:0;background:linear-gradient(90deg,#7CF0A9,#F5C24A);animation:s26Load 8.2s ease-in-out forwards}
@keyframes s26Load{to{width:100%}}
/* the search map inside the file: one label at the top is enough */
#app.tk-s26 .trx-file.own .spotmap .shud.t{display:none}
/* the main button sits in its place in the card, as in the mock-up (it used to float at the bottom of the phone
   over the name boxes; Paul, 2 Nov 2026: nothing pinned to the bottom of the page) */
#app.tk-s26 .trx-card .btn{position:static!important}
/* Back on the left and the "Free" pill on the right of the same line (one less line before the question) */
#app.tk-s26 .trx-card>.qback+.qprog{position:absolute!important;top:36px;right:32px;left:auto;justify-content:flex-end;max-width:calc(100% - 170px)}
@media (max-width:999px){#app.tk-s26 .trx-card>.qback+.qprog{top:32px;right:18px}}
@media (max-width:360px){#app.tk-s26 .trx-card>.qback+.qprog{right:14px;top:30px}}
@media (max-width:699px){#app.tk-s26 .trx-card>.qface{width:60px;height:60px}}
/* the save box sits flat in the card: no second set of icicles or frame of its own */
#app.tk-s26 .trx-card .savecard::before,#app.tk-s26 .trx-card .savecard::after{content:none!important;display:none!important}
#app.tk-s26 .trx-card .savecard{outline:0!important;border-image:none!important}
/* "Wrong town? Change it" under the map is a button, not a link (Jay, 2 Nov 2026) */
#app.tk-s26 .trx-file .hTown{display:inline-flex;align-items:center;min-height:44px;padding:0 16px!important;border:2px solid var(--s26-gold)!important;border-radius:999px;background:rgba(245,194,74,.14)!important;color:#FFE7A3!important;text-decoration:none!important;font:700 15px/1.2 'Inter',sans-serif}

/* ---------- phones and tablets (design test, 2 Nov 2026) ----------
   The Elf HQ file is ONE fixed 2x2 strip at the top of every set-up screen, the welcome too (Watching, Elf,
   Flies home to, Sightings), with "?" until answered: the same height on every step, no empty navy.
   The screen's own picture (the welcome camera, the search map, the save screen's map) comes out of the file
   and sits under the strip; on the save screen it goes under the card (the email box first, S8). */
@media (max-width:999px){
  body.tnew #app.tk-s26{padding-top:16px}
  body.tnew #app.tk-s26 .ob-vis{display:contents!important}
  body.tnew #app.tk-s26 .ob-pane.trx-card{order:3;margin:26px 0 0;padding:32px 18px 22px!important;gap:16px;justify-content:flex-start}
  #app.tk-s26 .trx-card .h{font-size:clamp(26px,7.4vw,34px)!important}
  #app.tk-s26 .trx-file,#app.tk-s26 .ob-vis>.trx-file{display:contents}
  #app.tk-s26 .trx-file::after{content:none}
  #app.tk-s26 .trx-file__top{display:none}
  #app.tk-s26 .trx-file:not(.own) .trx-radar{display:none}
  #app.tk-s26 .trx-file.own .trx-radar{order:2;flex:none;min-height:0;margin:14px 0 0;border-radius:18px;overflow:hidden}
  /* the welcome: the heading and Track my Elf straight under the file, the Elf HQ camera under the card */
  body.tnew #app.tk-s26.tk-welcome .trx-file.own .trx-radar{order:4;margin-top:20px}
  body.tnew #app.tk-s26.tk-hook .trx-file.own .trx-radar{order:4;margin-top:20px;border-radius:22px;background:linear-gradient(180deg,#14306F,#0B1D4D);padding:10px}
  #app.tk-s26 .trx-file.own .trx-radar :is(.rc-screen,.kmap,.hookmap,.welcam,.welspot){margin:0!important;width:100%!important;max-width:none!important;border-radius:16px!important}
  #app.tk-s26 .trx-rows{order:1;position:relative;flex:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin:14px 0 0;padding:24px 10px 10px;border-radius:22px;overflow:visible;
    background:radial-gradient(70% 60% at 80% 0%,rgba(148,197,255,.25),transparent 60%),linear-gradient(180deg,#14306F,#0B1D4D);border:2px solid rgba(245,194,74,.7);box-shadow:0 0 30px rgba(245,194,74,.15),0 14px 30px rgba(0,0,0,.4)}
  #app.tk-s26 .trx-rows::before{content:"";position:absolute;left:-6px;right:-6px;top:-15px;height:36px;z-index:3;pointer-events:none;background:var(--s26-cap) repeat-x left top/260px 36px;border-radius:16px 16px 6px 6px}
  #app.tk-s26 .trx-row{display:block;height:54px;box-sizing:border-box;padding:8px 10px;border-radius:12px;overflow:hidden;min-width:0}
  #app.tk-s26 .trx-row dt{font-size:10px;line-height:14px;letter-spacing:.08em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #app.tk-s26 .trx-row dd{margin-top:4px;font-size:14px;line-height:22px;min-height:0;height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #app.tk-s26 .trx-row dd.wait{color:#7F93BF}
  #app.tk-s26 .trx-row dd .chip{font-size:13px;line-height:20px;padding:0 8px;margin:0 4px 0 0;vertical-align:top}
  #app.tk-s26 .trx-dots{gap:4px;vertical-align:top;margin-top:3px}
  #app.tk-s26 .trx-dots i{width:16px;height:16px;font-size:9px}
}
@media (max-width:340px){
  #app.tk-s26 .trx-rows{padding:22px 8px 8px;gap:3px}
  #app.tk-s26 .trx-row{padding:8px}
  #app.tk-s26 .trx-dots{gap:3px}
  #app.tk-s26 .trx-dots i{width:14px;height:14px}
}

/* the town found: "Not this one? Choose again" gets a line of its own under the town, on one line */
#app.tk-s26 .trx-card .tp-ok{display:grid;grid-template-columns:72px minmax(0,1fr);grid-template-areas:"dot k" "dot b" "again again";column-gap:14px;row-gap:4px;align-items:center}
#app.tk-s26 .trx-card .tp-oktxt{display:contents}
#app.tk-s26 .trx-card .tp-dot{grid-area:dot;width:72px;height:72px}
#app.tk-s26 .trx-card .tp-oktxt>.k{grid-area:k;align-self:end}
#app.tk-s26 .trx-card .tp-oktxt>b{grid-area:b;align-self:start;overflow-wrap:anywhere}
#app.tk-s26 .trx-card .tp-again{grid-area:again;justify-self:start;max-width:100%;box-sizing:border-box;margin-top:10px!important;padding:0 12px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px!important}
@media (max-width:360px){#app.tk-s26 .trx-card .tp-ok{padding:12px}#app.tk-s26 .trx-card .tp-again{font-size:13px!important;padding:0 10px!important}}
/* the town list opens inside the card and the card grows with it (it spilled over the footer) */
#app.tk-s26 .trx-card .tsug{position:static!important;max-height:none;margin-top:6px}
#app.tk-s26 .trx-card .tfield{position:relative}
/* the sightings so far: "1 so far" beside the dots on computers; the dots alone in the phone strip */
#app.tk-s26 .trx-seen{color:#7CF0A9;font-size:14px}
/* phones too (Paul, 3 Nov 2026: the SIGHTINGS box was empty on the save step) */
/* "Already tracking? Sign in": a real second button under Track my Elf (phone test, 2 Nov 2026) */
#app.tk-s26 .trx-card #already{align-self:stretch;width:100%;min-height:52px;border:2px solid var(--s26-night)!important;color:var(--s26-night)!important;font:800 16px/1.2 'Plus Jakarta Sans','Inter',sans-serif!important;border-radius:999px}
/* Forensic round 1 (2 Nov 2026). 15: on phones the Elf HQ file waits until it has something in it, and is slim while
   the questions are asked (no radar), so each question starts near the top. "Elf 2 of 4" always on its own line. */
@media (max-width:699px){
  #app.tk-s26 .trx-file.blank{display:none}
  #app.tk-s26 .trx-file:not(.own){padding:14px 16px 12px}
  #app.tk-s26 .trx-file:not(.own) .trx-radar{display:none}
}
.qprog .qelf,.hq-of .qelf{display:block;width:100%;margin-top:6px;text-align:center}
.qwhyrow{margin:10px 0 0;text-align:center}
.qnothere{margin:6px auto 0;max-width:30em;text-align:center}
/* 15: the file's four rows smaller on phones while the questions are asked, so each question starts higher. */
@media (max-width:699px){
  #app.tk-s26 .trx-file:not(.own) .trx-rows{margin-top:8px;padding:18px 8px 8px;gap:3px}
  #app.tk-s26 .trx-file:not(.own) .trx-row{height:40px;padding:5px 8px}
  #app.tk-s26 .trx-file:not(.own) .trx-row dt{font-size:9.5px}
  #app.tk-s26 .trx-file:not(.own) .trx-row dd{font-size:13px;min-height:0}
  #app.tk-s26 .trx-file:not(.own) .trx-row dd .chip{font-size:12px;padding:1px 8px}
}
/* Round 2, 13: Next on "Whose Elf" is the full red main button once a child is ticked. */
#app.tk-s26 #wnext:not(:disabled){opacity:1!important;filter:none!important;background:#D9283E!important;color:#fff!important}
/* Phones (375 test, 2 Nov 2026): the question card always starts in the same place, so the Free badge in its top row
   never moves between steps, and the Home step's Next stays in view. The Elf HQ file (it appears once there is
   something to show in it) comes under the card instead of above it. */
@media (max-width:999px){body.tnew #app.tk-s26 .ob-vis>.trx-file:not(.own),body.tnew #app.tk-s26 .ob-vis>.trx-file:not(.own)>*{order:4}body.tnew #app.tk-s26 .ob-vis>.trx-file:not(.own)>.trx-rows{margin-top:16px}}
/* Round 3 test B, 6: the set-up summary rows grow with their content (the Home step's last row was clipped at 375). */
@media (max-width:699px){#app.tk-s26 .trx-row,#app.tk-s26 .trx-file:not(.own) .trx-row{height:auto!important;min-height:40px;overflow:visible}}
/* Review notes, 3 Nov 2026 (Paul). The FREE sign sits wholly inside the camera picture: the picture's frame clips
   anything past its edge, so the sign no longer hangs over the top. */
#app.tk-s26 .trx-radar .tn-sticker{top:12px;right:12px}
@media (min-width:1000px){#app.tk-s26 .trx-radar .tn-sticker{top:16px;right:16px}}
/* Example names in the boxes are clearly examples, not filled-in answers: light and italic */
#app.tk-s26 .trx-card :is(input,textarea)::placeholder{color:#AEB8CF!important;opacity:1;font-style:italic;font-weight:500}
/* "Where is your Elf right now?": bigger and Christmassy like the homepage's heading, less empty space */
#app.tk-s26 .trx-card .h.tn-wtitle{font:800 clamp(38px,4.6vw,60px)/1.04 'Plus Jakarta Sans','Inter',sans-serif!important;letter-spacing:-.02em}
#app.tk-s26 .tn-wtitle .tc-r{color:#C8102E}
#app.tk-s26 .tn-wtitle .tc-g{color:#17803F}
/* The logo on phones held sideways and small tablets (Paul, 3 Nov 2026: "what has happened to the logo"): header.css
   forces the logo 96px tall from 760px wide, which squashed it out of the smaller bauble on short screens. Keep
   its own shape, sized to fit the bauble. */
@media (max-height:500px) and (orientation:landscape){
  body.tnew:not(.logo-tile):not(.logo-cloud) .nav__home img{width:68px!important;height:auto!important;max-width:none}
}
/* The Save screen's sightings panel (spot.css .hpromise, Paul 3 Nov 2026): its own colourful words on the night panel,
   not the card's dark text */
#app.tk-s26 .trx-card .hpromise p{background:none!important;text-shadow:0 2px 8px rgba(0,0,0,.35)!important;margin:0!important}
#app.tk-s26 .trx-card .hpromise .hpromise-k{background:linear-gradient(90deg,#FF7A88 0%,#FFD36E 35%,#7CF7B2 65%,#9CCBFF 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent;text-shadow:none!important}
#app.tk-s26 .trx-card .hpromise .hpromise-big{color:#fff!important}
#app.tk-s26 .trx-card .hpromise .hpromise-big .hp-gold{color:#FFD36E!important}
#app.tk-s26 .trx-card .hpromise .hpromise-free{color:#7CF7B2!important}

/* "A call from Buddy" on the checked-in screen (11 Nov 2026) */
.rwcall{display:grid;gap:12px;margin:14px 0 0;padding:16px;border-radius:18px;background:#fff;border:2px solid #E3DCCB;box-shadow:0 8px 18px -12px rgba(11,29,77,.45);text-align:left}
.rwcall h2{margin:0;font:800 19px/1.2 'Plus Jakarta Sans',Inter,sans-serif;color:#0B1D4D}
.rwcall .rwcall-p{color:#C8102E;white-space:nowrap}
.rwcall p{margin:4px 0 0;font-size:14.5px;line-height:1.4;color:#26365F}
.rwcall-b{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rwcall-b .btn{min-height:48px;margin:0!important;width:100%}