/* playBGT(TM) Table Type Quiz v1.0. Scoped under .tt */
.tt{--ink:#22163a;--paper:#fff8ef;--r:22px;--c1:#ff4d5a;--c2:#7b2cbf;--cink:#fff;
  font-family:"Source Sans 3",system-ui,sans-serif;color:var(--ink);
  background:
   radial-gradient(1200px 500px at 10% -10%,rgba(255,214,10,.22),transparent 60%),
   radial-gradient(900px 500px at 110% 10%,rgba(199,125,255,.22),transparent 60%),
   radial-gradient(900px 600px at 50% 110%,rgba(46,196,182,.18),transparent 60%),#fff8ef;
  min-height:70vh;overflow-x:hidden}
.tt *{box-sizing:border-box}
.tt [hidden]{display:none!important}
.tt-wrap{max-width:640px;margin:0 auto;padding:22px 16px 44px}
.tt h1,.tt h2,.tt h3,.tt-go,.tt-btn,.tt-band-name,.tt-count{font-family:"Fredoka","Trebuchet MS",system-ui,sans-serif}
.tt-kicker{margin:0 0 6px;text-align:center;font:600 .82rem/1.2 "Fredoka",sans-serif;letter-spacing:.04em;color:#7b2cbf}
.tt-spark{display:inline-block;color:#ffb703;animation:tt-twinkle 1.8s ease-in-out infinite}
.tt-spark:last-child{animation-delay:.9s}
.tt-title{margin:0 0 14px;text-align:center;line-height:.98;font-weight:700;letter-spacing:-.01em}
.tt-title span{display:block}
.tt-t1,.tt-t3{font-size:clamp(1.7rem,8.4vw,2.6rem);color:var(--ink);animation:tt-drop .6s cubic-bezier(.2,1.4,.4,1) both}
.tt-t3{animation-delay:.35s}
.tt-t2{font-size:clamp(2.7rem,15vw,4.4rem);padding:.04em 0;
  background:linear-gradient(90deg,#ff4d5a,#ffa040,#ffd60a,#5fd08f,#2fd6c4,#4fb3ff,#7c7ff7,#d08cff,#ff4d5a);background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:tt-pop .7s .15s cubic-bezier(.2,1.6,.4,1) both,tt-flow 6s linear 1s infinite;
  filter:drop-shadow(0 3px 0 rgba(34,22,58,.18))}
.tt-herobox{position:relative;border-radius:var(--r);padding:5px;margin:4px 0 18px;
  background:linear-gradient(120deg,#ff4d5a,#ffa040,#ffd60a,#5fd08f,#2fd6c4,#4fb3ff,#7c7ff7,#d08cff);background-size:300% 300%;
  animation:tt-flow 8s linear infinite,tt-rise .7s .3s both;box-shadow:0 14px 34px rgba(123,44,191,.22)}
.tt-hero{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:calc(var(--r) - 5px);background:#f1e4d0}
.tt-go{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:60px;padding:14px 22px;border:0;border-radius:999px;cursor:pointer;
  font-weight:700;font-size:1.3rem;color:#fff;background:linear-gradient(90deg,#ff4d5a,#ff8c42 45%,#d08cff);
  box-shadow:0 6px 0 #a4161a,0 14px 26px rgba(255,77,90,.35);transition:transform .12s,box-shadow .12s;animation:tt-rise .6s .5s both,tt-pulse 2.4s 1.4s ease-in-out infinite;position:relative;overflow:hidden}
.tt-go:hover{transform:translateY(-2px)}
.tt-go:active{transform:translateY(4px);box-shadow:0 2px 0 #a4161a,0 6px 14px rgba(255,77,90,.3)}
.tt-go:focus-visible,.tt-opt-btn:focus-visible,.tt-btn:focus-visible,.tt-back:focus-visible,.tt-link:focus-visible{outline:3px solid #22163a;outline-offset:3px}
.tt-go-arrow{transition:transform .2s}.tt-go:hover .tt-go-arrow{transform:translateX(4px)}
.tt-go-sm{min-height:50px;font-size:1.1rem;animation:none;margin-top:10px}
.tt-meta{text-align:center;margin:12px 0 18px;font-size:.98rem;opacity:.8}
.tt-foot{text-align:center;font:italic 1rem/1.4 "Source Serif 4",Georgia,serif;opacity:.75;margin:22px 0 0}
/* bands */
.tt-bands{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.tt-band{--d:0s;display:flex;align-items:center;gap:12px;min-height:66px;padding:10px 14px 10px 10px;border-radius:16px;color:var(--bi,#fff);
  background:linear-gradient(100deg,var(--b1),var(--b2));box-shadow:0 4px 0 rgba(34,22,58,.12),0 8px 18px rgba(34,22,58,.08);
  position:relative;overflow:hidden;animation:tt-slide .55s var(--d) cubic-bezier(.2,1.3,.4,1) both}
.tt-band::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 45%,transparent 60%);transform:translateX(-120%);animation:tt-shine 5s calc(var(--d) + 1.2s) ease-in-out infinite}
.tt-band-n{font:700 1.4rem "Fredoka",sans-serif;width:22px;text-align:center;opacity:.9}
.tt-band-ic{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
.tt-band-ic svg{width:26px;height:26px}
.tt-band-name{display:block;font-weight:700;font-size:1.18rem;line-height:1.1}
.tt-band-tag{display:block;font-size:.92rem;opacity:.95}
.tt-bands-sm .tt-band{min-height:54px;animation:none}
.tt-bands-sm .tt-band.me{outline:3px solid var(--ink);outline-offset:2px;transform:scale(1.02)}
.tt-band .tt-you{margin-left:auto;font:700 .75rem "Fredoka",sans-serif;background:#fff;color:var(--ink);border-radius:999px;padding:3px 9px;letter-spacing:.04em}
/* quiz */
.tt-qtop{display:flex;align-items:center;gap:10px}
.tt-back{min-height:44px;padding:0 16px;border-radius:999px;border:2px solid rgba(34,22,58,.2);background:#fff;font:600 1rem "Fredoka",sans-serif;cursor:pointer;color:var(--ink)}
.tt-back:disabled{opacity:.4;cursor:default}
.tt-count{font-weight:600;font-size:1.05rem}
.tt-prog{height:14px;border-radius:99px;background:rgba(34,22,58,.1);margin:12px 0 18px;overflow:hidden;box-shadow:inset 0 2px 3px rgba(0,0,0,.08)}
.tt-prog i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#ff4d5a,#ffa040,#ffd60a,#5fd08f,#2fd6c4,#4fb3ff,#7c7ff7,#d08cff);background-size:640px 100%;transition:width .5s cubic-bezier(.3,1.4,.5,1);position:relative}
.tt-prog i::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.25) 0 8px,transparent 8px 16px);animation:tt-stripes 1s linear infinite}
.tt-qcard{background:#fff;border-radius:var(--r);padding:20px 16px 12px;box-shadow:0 10px 30px rgba(34,22,58,.1);border:2px solid rgba(34,22,58,.06)}
.tt-qcard.in{animation:tt-cardin .45s cubic-bezier(.2,1.3,.4,1) both}
.tt-qcard.out{animation:tt-cardout .28s ease-in both}
.tt-q{margin:0 0 14px;font-size:clamp(1.35rem,5.6vw,1.7rem);line-height:1.18;font-weight:600;outline:none}
.tt-opts{display:grid;gap:10px}
.tt-opt-btn{--oc:#ff4d5a;display:flex;align-items:center;gap:12px;width:100%;min-height:60px;padding:12px 14px;border-radius:16px;border:2px solid rgba(34,22,58,.1);
  background:#fff;color:var(--ink);font:560 1.06rem/1.3 "Source Sans 3",sans-serif;text-align:left;cursor:pointer;position:relative;overflow:hidden;
  box-shadow:0 4px 0 rgba(34,22,58,.08);transition:transform .12s,border-color .15s,box-shadow .12s;animation:tt-rise .4s calc(var(--i)*70ms + 120ms) both}
@media (hover:hover){.tt-opt-btn:hover{border-color:var(--oc);transform:translateY(-2px)}}
.tt-opt-btn:active{transform:translateY(3px) scale(.98);box-shadow:0 1px 0 rgba(34,22,58,.08)}
.tt-opt-l{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font:700 1.05rem "Fredoka",sans-serif;color:#fff;background:var(--oc);transition:transform .2s}
.tt-opt-btn.picked{border-color:var(--oc);background:color-mix(in srgb,var(--oc) 14%,#fff);animation:tt-bounce .45s cubic-bezier(.2,1.6,.4,1) both}
.tt-opt-btn.picked .tt-opt-l{transform:rotate(-8deg) scale(1.12)}
.tt-opt-btn.dim{opacity:.45}
.tt-ripple{position:absolute;border-radius:50%;background:var(--oc);opacity:.35;transform:scale(0);animation:tt-ripple .55s ease-out forwards;pointer-events:none}
.tt-pop{position:absolute;pointer-events:none;font-size:18px;animation:tt-popout .7s ease-out forwards}
/* reveal */
.tt-reveal{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:20px;color:var(--cink);
  background:radial-gradient(circle at 50% 40%,var(--c1),var(--c2) 70%);animation:tt-fadein .3s both}
.tt-reveal canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.tt-rv-inner{position:relative;text-align:center;max-width:420px}
.tt-rv-pre{font:600 1.2rem "Fredoka",sans-serif;margin:0 0 18px;letter-spacing:.02em;animation:tt-rise .4s both}
.tt-rv-badge{width:150px;height:150px;margin:0 auto 18px;border-radius:38px;display:grid;place-items:center;background:rgba(255,255,255,.2);
  box-shadow:inset 0 0 0 4px rgba(255,255,255,.5),0 18px 40px rgba(0,0,0,.25);position:relative}
.tt-rv-badge svg{width:84px;height:84px}
.tt-rv-badge.spin{animation:tt-wobble .16s linear infinite}
.tt-rv-badge.land{animation:tt-land .7s cubic-bezier(.2,1.8,.4,1) both}
.tt-rv-badge.land::before{content:"";position:absolute;inset:-30px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.7),transparent 65%);animation:tt-burst .9s ease-out both}
.tt-rv-name{font-size:clamp(2.2rem,11vw,3.4rem);margin:0;line-height:1;font-weight:700;text-shadow:0 4px 0 rgba(0,0,0,.18);opacity:0}
.tt-rv-tag{font:600 1.25rem "Fredoka",sans-serif;margin:10px 0 24px;opacity:0}
.tt-reveal.done .tt-rv-name{animation:tt-pop .6s cubic-bezier(.2,1.6,.4,1) both}
.tt-reveal.done .tt-rv-tag{animation:tt-rise .5s .25s both}
.tt-rv-btn{opacity:0;background:#fff;color:var(--ink);box-shadow:0 6px 0 rgba(0,0,0,.25);animation:none;max-width:320px;margin:0 auto}
.tt-reveal.done .tt-rv-btn{animation:tt-rise .5s .55s both}
.tt-rv-btn:active{box-shadow:0 2px 0 rgba(0,0,0,.25)}
/* result card */
.tt-friend{background:#fff;border-radius:var(--r);padding:16px;margin-bottom:16px;border:3px dashed var(--c2);box-shadow:0 8px 20px rgba(34,22,58,.08)}
.tt-friend p{margin:0}
.tt-card{background:#fff;border-radius:26px;overflow:hidden;box-shadow:0 18px 40px rgba(34,22,58,.16);border:3px solid #fff;animation:tt-cardin .6s cubic-bezier(.2,1.3,.4,1) both}
.tt-card-band{display:flex;align-items:center;gap:12px;padding:18px 16px;color:var(--cink);background:linear-gradient(100deg,var(--c1),var(--c2));position:relative;overflow:hidden}
.tt-card-band::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 45%,transparent 60%);transform:translateX(-120%);animation:tt-shine 4s 1s ease-in-out infinite}
.tt-card-num{font:700 2.2rem "Fredoka",sans-serif;opacity:.85}
.tt-card-icon{flex:none;width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 2px rgba(255,255,255,.4)}
.tt-card-icon svg{width:34px;height:34px}
.tt-card-title{min-width:0}
.tt-card-kicker{margin:0;font:600 .78rem "Fredoka",sans-serif;letter-spacing:.08em;text-transform:uppercase;opacity:.9}
.tt-card-band h2{margin:0;font-size:clamp(1.6rem,7.6vw,2.2rem);line-height:1.05;font-weight:700}
.tt-card-tag{margin:2px 0 0;font:600 1.05rem "Fredoka",sans-serif}
.tt-card-art{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#f1e4d0}
.tt-card-body{padding:16px 18px 6px;font-size:1.07rem;line-height:1.5}
.tt-card-desc{font-size:1.12rem;margin-top:0}
.tt-card-body h3{font-size:1.18rem;margin:18px 0 6px;color:var(--c2)}
.tt-card-body h3 span{display:inline-block;width:28px;height:28px;line-height:28px;text-align:center;border-radius:9px;background:linear-gradient(135deg,var(--c1),var(--c2));color:var(--cink);margin-right:6px;font-size:.95rem}
.tt-str{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.tt-str li{padding:8px 12px;border-radius:12px;background:color-mix(in srgb,var(--c1) 13%,#fff);border-left:5px solid var(--c1)}
.tt-card-body p{margin:0 0 6px}
.tt-card-ex{font-size:.98rem;opacity:.8}
.tt-card-foot{padding:12px 18px 16px;font-size:.85rem;opacity:.6}
/* share + panels */
.tt-share,.tt-panel{background:#fff;border-radius:var(--r);padding:18px 16px;margin-top:16px;box-shadow:0 8px 22px rgba(34,22,58,.08)}
.tt-h{margin:0 0 10px;font-size:1.35rem;font-weight:600}
.tt-btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:52px;padding:12px 16px;border:0;border-radius:14px;cursor:pointer;font-weight:600;font-size:1.05rem;text-decoration:none;color:#fff;transition:transform .12s,box-shadow .12s}
.tt-btn:active{transform:translateY(3px)}
.tt-btn-big{background:linear-gradient(100deg,var(--c1),var(--c2));color:var(--cink);font-size:1.15rem;min-height:58px;box-shadow:0 5px 0 rgba(34,22,58,.25)}
.tt-share-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.tt-btn-x{background:#111}.tt-btn-fb{background:#1464d8}
.tt-btn-x:hover,.tt-btn-fb:hover{color:#fff;transform:translateY(-2px)}
.tt-btn-ghost{background:#fff;color:var(--ink);border:2px solid rgba(34,22,58,.15);margin-top:14px}
.tt-copyrow{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:10px 0 0}
.tt-link{background:none;border:0;padding:4px 0;color:var(--c2);font:600 1rem "Fredoka",sans-serif;text-decoration:underline;cursor:pointer}
#tt-shmsg{color:#1f7a4d;font-weight:600}
.tt-shfield{width:100%;padding:10px 12px;border:2px solid rgba(34,22,58,.15);border-radius:10px;font:.92rem system-ui,sans-serif;margin-top:6px}
.tt-opt{margin:0;color:var(--c2);font:600 .78rem "Fredoka",sans-serif;letter-spacing:.08em;text-transform:uppercase}
.tt-signup label{display:block;font:600 .95rem "Fredoka",sans-serif;margin:10px 0 5px}
.tt-signup input[type=email],.tt-signup input[type=text]{width:100%;padding:13px 14px;border:2px solid rgba(34,22,58,.15);border-radius:12px;font:inherit;font-size:1.05rem;background:#fff;color:var(--ink)}
.tt-signup input:focus{outline:none;border-color:var(--c2);box-shadow:0 0 0 3px color-mix(in srgb,var(--c2) 25%,transparent)}
.tt-ints{border:0;padding:0;margin:12px 0}
.tt-ints legend{font:600 .95rem "Fredoka",sans-serif;padding:0;margin-bottom:4px}
.tt-ckgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.tt-signup label.tt-ck{display:flex;gap:8px;align-items:flex-start;font:400 1rem/1.3 "Source Sans 3",sans-serif;margin:0;padding:6px 0;cursor:pointer}
.tt-ck input{width:20px;height:20px;margin:0;accent-color:var(--c2);flex:none}
.tt-ck-wide{grid-column:1/-1}
.tt-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.tt-btn[disabled]{opacity:.65;cursor:wait}
.tt-msg{border-radius:12px;padding:12px 14px;margin:10px 0 0}
.tt-ok{background:#eaf7ef;border:2px solid #5fd08f}.tt-err{background:#fdecec;border:2px solid #ff4d5a;color:#7a1016}
.tt-err a{color:inherit}
.tt-small{font-size:.92rem;opacity:.8;margin:12px 0 0}.tt-small a{color:var(--c2)}
@media(min-width:760px){.tt-wrap{padding-top:34px}.tt-bands:not(.tt-bands-sm){grid-template-columns:1fr 1fr}}
/* keyframes */
@keyframes tt-drop{from{opacity:0;transform:translateY(-24px) rotate(-3deg)}to{opacity:1;transform:none}}
@keyframes tt-pop{0%{opacity:0;transform:scale(.4) rotate(-6deg)}70%{opacity:1;transform:scale(1.08) rotate(2deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes tt-flow{to{background-position:200% 50%}}
@keyframes tt-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes tt-slide{from{opacity:0;transform:translateX(-60px) skewX(-8deg)}to{opacity:1;transform:none}}
@keyframes tt-shine{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@keyframes tt-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
@keyframes tt-twinkle{0%,100%{transform:scale(1) rotate(0);opacity:1}50%{transform:scale(1.4) rotate(40deg);opacity:.6}}
@keyframes tt-stripes{to{background-position:32px 0}}
@keyframes tt-cardin{from{opacity:0;transform:translateX(40px) rotate(2deg) scale(.96)}to{opacity:1;transform:none}}
@keyframes tt-cardout{to{opacity:0;transform:translateX(-50px) rotate(-3deg) scale(.95)}}
@keyframes tt-bounce{0%{transform:scale(1)}40%{transform:scale(1.05)}100%{transform:scale(1)}}
@keyframes tt-ripple{to{transform:scale(1);opacity:0}}
@keyframes tt-popout{from{opacity:1;transform:translate(0,0) scale(.6)}to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.3) rotate(var(--rt))}}
@keyframes tt-fadein{from{opacity:0}to{opacity:1}}
@keyframes tt-wobble{0%{transform:rotate(-6deg) scale(.95)}50%{transform:rotate(6deg) scale(1.03)}100%{transform:rotate(-6deg) scale(.95)}}
@keyframes tt-land{0%{transform:scale(.3) rotate(-30deg)}60%{transform:scale(1.18) rotate(6deg)}100%{transform:scale(1) rotate(0)}}
@keyframes tt-burst{from{transform:scale(.2);opacity:1}to{transform:scale(1.8);opacity:0}}
@media (prefers-reduced-motion:reduce){
  .tt *,.tt *::before,.tt *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.001ms!important}
  .tt-band::after,.tt-card-band::after,.tt-prog i::after{display:none}
  .tt-rv-name,.tt-rv-tag,.tt-rv-btn{opacity:1}
}
/* overrides vs site.css heading/link colors */
.tt .tt-rv-name{color:var(--cink)}
.tt .tt-card-band h2{color:inherit}
.tt a.tt-btn,.tt a.tt-btn:visited,.tt a.tt-btn:hover{color:#fff;text-decoration:none}
.tt-btn{white-space:nowrap}
@media(max-width:429px){.tt-share-row{grid-template-columns:1fr}}

/* ===== v1.0 additions ===== */
.tt{--acc:#d08cff}
.tt-sub{text-align:center;font:500 clamp(1.08rem,4.4vw,1.28rem)/1.4 "Source Sans 3",sans-serif;margin:0 auto 16px;max-width:30em;color:#3b2d55}
.tt-disc-short{text-align:center;font-size:.95rem;margin:4px 0 18px;color:#4a3d63}
.tt-ver{text-align:center;font:600 .8rem "Fredoka",sans-serif;letter-spacing:.06em;color:#5b4d73;margin:18px 0 0}
.tt-loaderr{background:#fdecec;border:2px solid #d62839;color:#7a1016;border-radius:12px;padding:10px 14px;text-align:center}
.tt-go:disabled{opacity:.6;cursor:wait}
.tt-meta{opacity:1;color:#3b2d55}
.tt-band-ic{color:inherit}
.tt-count{color:#2c2142}
.tt-hint{text-align:center;font-size:.95rem;margin:16px 0 0;color:#4a3d63}
.tt-opt-btn.chosen{border-color:var(--oc);border-width:3px;background:color-mix(in srgb,var(--oc) 12%,#fff)}
.tt-opt-btn.chosen::after{content:"\2713";margin-left:auto;font:700 1.2rem "Fredoka",sans-serif;color:var(--oc)}
.tt-opt-btn.dim{opacity:.55}
.tt-next{display:block;margin:14px 0 4px auto;min-height:46px;padding:0 20px;border-radius:999px;border:0;background:#22163a;color:#fff;font:600 1.02rem "Fredoka",sans-serif;cursor:pointer}
.tt-next:focus-visible,.tt-pickbtn:focus-visible,.tt-carddl:focus-visible{outline:3px solid #22163a;outline-offset:3px}
.tt-opt-btn:focus-visible{outline:3px solid #22163a;outline-offset:2px;border-color:#22163a}
/* result hero */
.tt-hero-r{position:relative;background:linear-gradient(160deg,var(--acc),var(--c2))}
.tt-art{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#f1e4d0}
.tt-hero-r .tt-art-big{border-bottom:5px solid var(--acc)}
.tt-hero-band{display:flex;align-items:center;gap:14px;padding:16px 18px 18px;color:var(--cink);background:linear-gradient(100deg,var(--c1),var(--c2))}
.tt-hero-band h2{margin:0;font-size:clamp(1.55rem,7vw,2.3rem);line-height:1.08;font-weight:700;color:inherit}
.tt .tt-hero-band h2,.tt .tt-sub-head h2{color:inherit}
.tt-card-kicker{font-size:.82rem}
.tt-primary-line{font:600 1.12rem/1.4 "Fredoka",sans-serif;color:var(--c2);margin:0 0 10px!important;padding:10px 14px;border-radius:14px;background:color-mix(in srgb,var(--acc) 18%,#fff)}
.tt-card-tie .tt-primary-line{color:#22163a}
.tt-desc{font-size:1.12rem;margin:0 0 6px}
.tt-detail h3{font-size:1.18rem;margin:18px 0 8px;color:var(--chd,var(--c2))}
.tt-detail h3 span{display:inline-block;width:28px;height:28px;line-height:28px;text-align:center;border-radius:9px;background:linear-gradient(135deg,var(--c1),var(--c2));color:var(--cink);margin-right:6px;font-size:.95rem}
.tt-grow,.tt-games{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.tt-grow li{padding:9px 12px;border-radius:12px;background:#f7f3fb;border:2px dashed color-mix(in srgb,var(--c1) 45%,#fff)}
.tt-games li{display:grid;gap:2px;padding:10px 12px 10px 46px;border-radius:12px;background:#fff;border:2px solid color-mix(in srgb,var(--c1) 25%,#fff);position:relative}
.tt-games li::before{content:"";position:absolute;left:14px;top:13px;width:20px;height:24px;background:var(--c1);
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 24"><path d="M10 0a4.6 4.6 0 0 1 4.6 4.6c0 1.6-.8 3-2 3.8 3.3.6 7.4 2.3 7.4 4.6 0 1.6-2.4 1.9-4.1 1.9l3 7.9c.2.6-.2 1.2-.8 1.2h-4.4L10 18.5 6.3 24H1.9c-.6 0-1-.6-.8-1.2l3-7.9C2.4 14.9 0 14.6 0 13c0-2.3 4.1-4 7.4-4.6a4.6 4.6 0 0 1 2.6-8.4z"/></svg>') center/contain no-repeat;
  mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 24"><path d="M10 0a4.6 4.6 0 0 1 4.6 4.6c0 1.6-.8 3-2 3.8 3.3.6 7.4 2.3 7.4 4.6 0 1.6-2.4 1.9-4.1 1.9l3 7.9c.2.6-.2 1.2-.8 1.2h-4.4L10 18.5 6.3 24H1.9c-.6 0-1-.6-.8-1.2l3-7.9C2.4 14.9 0 14.6 0 13c0-2.3 4.1-4 7.4-4.6a4.6 4.6 0 0 1 2.6-8.4z"/></svg>') center/contain no-repeat}
.tt-games strong{font:600 1.05rem "Fredoka",sans-serif}
.tt-games span{font-size:1rem;color:#3b2d55}
.tt-try{margin:18px 0 10px;padding:4px 16px 14px;border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--acc) 30%,#fff),#fff8ef);border:2px solid color-mix(in srgb,var(--acc) 60%,#fff)}
.tt-try h3{margin-top:12px}
.tt-try p{margin:0}
.tt-sec{display:grid;gap:8px}
.tt-sec-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:14px;color:var(--bi);background:linear-gradient(100deg,var(--b1),var(--b2))}
.tt-sec-item strong{display:block;font:700 1.1rem "Fredoka",sans-serif}
.tt-sec-item small{display:block;font-size:.95rem}
.tt-sec-none{margin:0}
/* ties */
.tt-tie-head{background:linear-gradient(135deg,#6b21a8,#22163a)}
.tt-tie-art{display:grid;gap:4px;background:#fff}
.tt-tie-art.n2{grid-template-columns:1fr 1fr}
.tt-tie-art.n3,.tt-tie-art.n4{grid-template-columns:1fr 1fr}
.tt-tie-art.n3 img:first-child{grid-column:1/-1}
.tt-tie-art .tt-art{aspect-ratio:4/3}
.tt-tie-art.n3 img:first-child{aspect-ratio:16/9}
.tt-card-tie .tt-hero-band{background:linear-gradient(100deg,#6b21a8,#22163a);color:#fff}
.tt-card-sub{margin-top:16px;animation:none}
.tt-sub-head{display:flex;align-items:center;gap:12px;padding:14px 16px;color:var(--cink);background:linear-gradient(100deg,var(--c1),var(--c2))}
.tt-sub-head h2{margin:0;font-size:1.5rem;line-height:1.1}
.tt-sub-head .tt-card-tag{margin:0}
.tt-card-sub .tt-card-icon{width:48px;height:48px}
.tt-picks{display:grid;gap:8px}
.tt-pickbtn{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 14px;border-radius:14px;border:3px solid transparent;cursor:pointer;color:var(--bi);background:linear-gradient(100deg,var(--b1),var(--b2));font:600 1.08rem "Fredoka",sans-serif;text-align:left}
.tt-pickbtn .tt-band-ic{width:36px;height:36px}.tt-pickbtn .tt-band-ic svg{width:22px;height:22px}
.tt-pickbtn[aria-pressed=true]{border-color:#22163a;box-shadow:0 0 0 3px #fff inset}
.tt-pickbtn[aria-pressed=true]::after{content:"Your pick";margin-left:auto;font-size:.8rem;background:#fff;color:#22163a;border-radius:99px;padding:3px 9px}
.tt-pickbtn-none{--b1:#fff;--b2:#fff;--bi:#22163a;border-color:rgba(34,22,58,.2);justify-content:center}
.tt-pickbtn-none[aria-pressed=true]::after{content:none}
/* scores */
.tt-bars{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:7px}
.tt-bars li{display:grid;grid-template-columns:7.2em 1fr 1.6em;align-items:center;gap:10px;font-size:.98rem}
.tt-bars li.lead .tt-bar-n,.tt-bars li.lead .tt-bar-v{font-weight:700}
.tt-bar{height:14px;border-radius:99px;background:rgba(34,22,58,.08);overflow:hidden}
.tt-bar i{display:block;height:100%;border-radius:99px}
.tt-bar-v{text-align:right;font:600 1rem "Fredoka",sans-serif}
/* share card */
.tt-cardbox{margin:0 0 14px}
.tt-cardimg{display:block;width:min(100%,340px);height:auto;aspect-ratio:4/5;margin:0 auto 12px;border-radius:18px;background:linear-gradient(135deg,#efe6f7,#fff3df);box-shadow:0 10px 26px rgba(34,22,58,.18)}
.tt-cardbox.busy .tt-cardimg{animation:tt-pulse 1.4s ease-in-out infinite}
.tt-cardmsg{text-align:center;margin:0 0 8px;font-size:.95rem}
.tt-cardbox .tt-share-row{margin-top:0}
.tt-cardbox .tt-share-row:has(#tt-cardshare[hidden]){grid-template-columns:1fr}
.tt-btn-dark{background:#22163a;color:#fff}
.tt a.tt-btn-dark,.tt a.tt-btn-dark:visited{color:#fff;text-decoration:none}
.tt-share>.tt-btn-big{margin-top:4px}
.tt-about{margin-top:18px;padding:16px;border-radius:var(--r);background:rgba(255,255,255,.7);border:2px dashed rgba(34,22,58,.18);font-size:.98rem}
.tt-about p{margin:0 0 8px}
.tt-about .tt-ver{text-align:left;margin:8px 0 6px}
.tt-rv-badge.multi{width:auto;min-width:150px;padding:0 22px;gap:10px;grid-auto-flow:column}
.tt-rv-badge.multi svg{width:60px;height:60px}
.tt-small{opacity:1;color:#4a3d63}
.tt-signup .tt-consent{margin-top:6px!important;padding:10px 12px!important;border-radius:12px;background:#f7f3fb;font-weight:560!important}
@media(min-width:760px){.tt-wrap{max-width:680px}}
@media (prefers-reduced-motion:reduce){.tt-cardbox.busy .tt-cardimg{animation:none}.tt-spark,.tt-t2,.tt-herobox{animation:none!important}}

/* build 1.0.6: contrast fixes (Facebook button, Chaos Agent headings) */
.tt-meta-note{margin-top:-12px;font-size:.9rem}

/* tt-focus-fix: no outline on script-focused headings */
#tt-r-name:focus,#tt-q:focus,h2[tabindex="-1"]:focus{outline:none;box-shadow:none}
