/* Load after the current deck styles. Only rk- classes are new. */
.rk-row,.lbRow.rk-row,.suRow.rk-row{box-sizing:border-box;display:grid;grid-template-columns:22px 50px minmax(0,1fr) max-content;align-items:center;gap:8px;position:relative;isolation:isolate;min-width:0;width:100%;min-height:68px;padding:7px 10px;margin:0 0 7px;border:1px solid var(--rk-edge);border-radius:13px;overflow:hidden;background-color:#101f35;background-image:var(--rk-banner);background-size:100% 100%;background-repeat:no-repeat;color:#f4f7ff;font:14px/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;animation:none;box-shadow:none}
.rk-row.rk-compact,.lbRow.rk-row{grid-template-columns:22px 38px minmax(0,1fr) max-content;gap:6px;min-height:52px;padding:5px 8px;font-size:13px;margin-bottom:6px;border-radius:10px}
.rk-row.rk-light{background-color:#fffcf5;color:#142846}
.rk-row::before,.suRow.rk-row::before{display:none}
.rk-row.rk-you{outline:2px solid #76b936;outline-offset:-2px}
.rk-place{font-size:11px;line-height:1;font-weight:750;text-align:center;color:inherit;opacity:.76;min-width:0;font-variant-numeric:tabular-nums}
.rk-emblem{display:block;object-fit:contain;width:50px;height:45px;max-width:100%;flex:none}
.rk-compact .rk-emblem{width:38px;height:34px}
.rk-copy{min-width:0;display:flex;flex-direction:column;gap:3px}
.rk-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;font-size:inherit;line-height:1.18;font-weight:750;margin:0;min-width:0;color:inherit}
.rk-meta{display:flex;gap:5px;align-items:center;min-width:0;font-size:10px;line-height:1.2}
.rk-tier{color:var(--rk-label);font-weight:750;flex-shrink:0;letter-spacing:.025em}
.rk-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.8;font-size:10px;min-width:0}
.rk-stats{display:flex;flex-direction:column;align-items:flex-end;gap:3px;white-space:nowrap;font-variant-numeric:tabular-nums;min-width:0}
.rk-elo{font-weight:850;font-size:15px;color:inherit;line-height:1}
.rk-unit{font-size:8px;letter-spacing:.04em;font-weight:650;opacity:.75;margin-left:2px}
.rk-gold{font-size:10px;color:#f0d296;font-weight:600;line-height:1}
.rk-light .rk-gold{color:#795018}
.rk-first,.rank1.rk-first{min-height:76px;grid-template-columns:58px minmax(0,1fr) max-content;padding:9px 10px;animation:none;box-shadow:none;margin-bottom:12px}
.rk-first .rk-emblem{width:58px;height:53px}
.rk-first .rk-meta{order:-1;font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.rk-first .rk-name{font-size:13px}
.rk-mini{width:24px;height:24px;object-fit:contain;display:inline-block;vertical-align:middle}
/* Neutral fallback keeps names and scores legible if an asset cannot load. */
.rk-row img[hidden]{display:none}
@media(prefers-reduced-motion:reduce){.rk-row{animation:none!important;transition:none!important}}

.rk-first .rk-meta{display:block;white-space:normal;overflow-wrap:anywhere;line-height:1.35}

/* The empty Rank 1 seat: dimmed crest, until somebody earns it. */
.rk-row.rk-vacant .rk-emblem{filter:grayscale(.85);opacity:.55}
.rk-row.rk-vacant{opacity:.9}

/* ---- the Rank 1 card: king of the hill (19 Sep 2026) ---- */
.rk-throne{box-sizing:border-box;display:grid;grid-template-columns:64px minmax(0,1fr);gap:4px 12px;align-items:center;
  position:relative;overflow:hidden;border-radius:16px;padding:12px 14px;margin:0 0 12px;border:1.5px solid #EDC568;
  font:14px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.rk-throne.rk-dark{background:radial-gradient(120% 140% at 0% 0%,rgba(237,197,104,.28),transparent 55%),linear-gradient(150deg,#1d2640,#0d1629);color:#FFF6DA;
  box-shadow:0 0 28px -8px rgba(237,197,104,.7)}
.rk-throne.rk-light{background:radial-gradient(120% 140% at 0% 0%,rgba(237,197,104,.35),transparent 55%),linear-gradient(150deg,#FFF9E8,#FFF2CF);color:#3d2c0a;
  box-shadow:0 10px 26px -16px rgba(150,112,41,.8)}
.rk-throne.rk-you{outline:2px solid #76b936;outline-offset:-3px}
.rk-th-emblem{width:64px;height:58px;object-fit:contain;grid-row:span 2;filter:drop-shadow(0 4px 10px rgba(237,197,104,.55))}
.rk-throne-empty .rk-th-emblem{filter:grayscale(.8);opacity:.5}
.rk-th-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.rk-th-kick{font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#C99A2E}
.rk-dark .rk-th-kick{color:#EDC568}
.rk-th-name{font-size:19px;font-weight:900;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rk-th-sub{font-size:12px;opacity:.85;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.rk-th-rule{grid-column:2;font-size:11px;line-height:1.4;opacity:.78}
.rk-th-held{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin-top:6px;padding-top:7px;
  border-top:1px dashed rgba(201,154,46,.5)}
.rk-th-hl{font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;opacity:.7;margin-right:2px}
.rk-th-chip{font-size:11px;font-weight:800;border-radius:999px;padding:2px 8px;background:rgba(237,197,104,.2);border:1px solid rgba(237,197,104,.5)}
.rk-th-chip.on{background:#EDC568;color:#3d2c0a}
@media(max-width:380px){.rk-throne{grid-template-columns:48px minmax(0,1fr)}.rk-th-emblem{width:48px;height:44px}}

/* ---- titles with effects: the cooler, the dearer ---- */
.rk-tfx{font-style:normal;font-weight:800;display:inline-block;position:relative;overflow:visible;white-space:nowrap;letter-spacing:.01em}
.rk-meta .rk-tfx{opacity:1;font-size:10.5px}
.rk-tfx-glow{color:#FFD76A;text-shadow:0 0 6px rgba(255,205,80,.85),0 0 12px rgba(255,205,80,.45)}
.rk-light .rk-tfx-glow,.rk-tfx-glow.rk-on-light{color:#A06C00;text-shadow:0 0 6px rgba(255,200,60,.9)}
.rk-tfx-shimmer,.rk-tfx-flow,.rk-tfx-frost,.rk-tfx-fire,.rk-tfx-prism,.rk-tfx-crown{-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.rk-tfx-shimmer{background-image:linear-gradient(100deg,#B98A2E 25%,#FFF8DC 45%,#C9CED6 55%,#B98A2E 75%);background-size:250% 100%;animation:rkShine 2.6s linear infinite}
.rk-tfx-flow{background-image:linear-gradient(90deg,#00C2A8,#5B7CFA,#C64BFF,#FF5FA2,#00C2A8);background-size:300% 100%;animation:rkFlow 4s linear infinite}
.rk-tfx-neon{color:#E9FDFF;text-shadow:0 0 3px #fff,0 0 7px #3CE6FF,0 0 14px #3CE6FF,0 0 22px #0096FF;animation:rkNeon 3.2s infinite}
.rk-light .rk-tfx-neon,.rk-tfx-neon.rk-on-light{color:#0071E3;text-shadow:0 0 4px #7CEBFF,0 0 10px #3CE6FF}
.rk-tfx-frost{background-image:linear-gradient(180deg,#FFFFFF 0%,#BFEFFF 45%,#5CC8FF 100%);filter:drop-shadow(0 0 4px rgba(92,200,255,.8));padding-right:.95em}
.rk-light .rk-tfx-frost,.rk-tfx-frost.rk-on-light{background-image:linear-gradient(180deg,#5CC8FF 0%,#1E7FD0 60%,#0D4E8C 100%)}
.rk-tfx-frost::after{content:"\2744";position:absolute;right:0;top:-.1em;font-size:.8em;color:#9FE3FF;-webkit-text-fill-color:#9FE3FF;animation:rkSpin 6s linear infinite}
.rk-tfx-fire{background-image:linear-gradient(0deg,#D7263D 0%,#FF7A00 45%,#FFE259 100%);background-size:100% 200%;animation:rkFire 1.1s ease-in-out infinite alternate;filter:drop-shadow(0 0 5px rgba(255,110,0,.75))}
.rk-tfx-prism{background-image:linear-gradient(90deg,#FF4D4D,#FFB84D,#FFF04D,#4DFF88,#4DD2FF,#8C6BFF,#FF4DD2,#FF4D4D);background-size:400% 100%;animation:rkFlow 3s linear infinite;
  filter:drop-shadow(0 0 4px rgba(255,255,255,.55));padding:0 .9em}
.rk-tfx-prism::before,.rk-tfx-prism::after,.rk-tfx-cosmic::after,.rk-tfx-crown::after{content:"\2726";position:absolute;font-size:.75em;-webkit-text-fill-color:#FFF6B0;color:#FFF6B0;
  text-shadow:0 0 6px #fff;animation:rkTwinkle 1.6s ease-in-out infinite}
.rk-tfx-prism::before{left:0;top:-.15em}
.rk-tfx-prism::after{right:0;bottom:-.1em;animation-delay:.8s}
.rk-tfx-cosmic{color:#fff;-webkit-text-fill-color:#fff;padding:.05em .7em .05em .55em;border-radius:999px;
  background:radial-gradient(1px 1px at 12% 30%,#fff,transparent),radial-gradient(1px 1px at 40% 70%,#fff,transparent),radial-gradient(1.5px 1.5px at 70% 25%,#fff,transparent),radial-gradient(1px 1px at 88% 65%,#fff,transparent),
    linear-gradient(120deg,#1a0b3d,#4b1b8c,#0b2a5c,#1a0b3d);background-size:120px 100%,90px 100%,140px 100%,100px 100%,300% 100%;
  animation:rkCosmos 9s linear infinite;text-shadow:0 0 6px #d8b4ff,0 0 12px #9b5cff;box-shadow:0 0 10px -1px rgba(155,92,255,.8),inset 0 0 6px rgba(255,255,255,.2)}
.rk-tfx-cosmic::after{right:.15em;top:-.25em}
.rk-tfx-crown{background-image:linear-gradient(100deg,#B8860B 20%,#FFF1A8 40%,#EDC568 55%,#B8860B 80%);background-size:250% 100%;animation:rkShine 2.2s linear infinite;
  filter:drop-shadow(0 0 5px rgba(237,197,104,.9));padding-left:1.25em;padding-right:.8em}
.rk-tfx-crown::before{content:"\1F451";position:absolute;left:0;top:0;-webkit-text-fill-color:initial;color:initial;animation:rkBob 2s ease-in-out infinite}
.rk-tfx-crown::after{right:0;top:-.2em}
@keyframes rkShine{from{background-position:120% 0}to{background-position:-120% 0}}
@keyframes rkFlow{from{background-position:0% 0}to{background-position:300% 0}}
@keyframes rkNeon{0%,18%,22%,62%,64%,100%{opacity:1}20%,63%{opacity:.55}}
@keyframes rkFire{from{background-position:0 0}to{background-position:0 100%}}
@keyframes rkTwinkle{0%,100%{opacity:.2;transform:scale(.6)}50%{opacity:1;transform:scale(1.15)}}
@keyframes rkSpin{to{transform:rotate(360deg)}}
@keyframes rkCosmos{from{background-position:0 0,0 0,0 0,0 0,0% 0}to{background-position:120px 0,-90px 0,140px 0,-100px 0,300% 0}}
@keyframes rkBob{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-2px) rotate(6deg)}}
@media(prefers-reduced-motion:reduce){.rk-tfx,.rk-tfx::before,.rk-tfx::after{animation:none!important}}
/* A title inside a clipped cell still shows its sparkles. */
.rk-meta{overflow:visible}

/* The teacher cabinet's own rows are four columns; the Rank 1 card must not inherit that. */
.lbRow.rk-row.rk-first{grid-template-columns:58px minmax(0,1fr) max-content}
/* On a cream background the pale metals disappear, so the light panels get deeper versions. */
.rk-light .rk-tfx-shimmer,.rk-tfx-shimmer.rk-on-light{background-image:linear-gradient(100deg,#7A560F 25%,#D9A93A 42%,#5E6B7A 55%,#7A560F 75%)}
.rk-light .rk-tfx-fire,.rk-tfx-fire.rk-on-light{background-image:linear-gradient(0deg,#A50E2A 0%,#E04E00 50%,#F29A00 100%);filter:drop-shadow(0 0 3px rgba(255,110,0,.45))}
.rk-light .rk-tfx-crown,.rk-tfx-crown.rk-on-light{background-image:linear-gradient(100deg,#7A560F 20%,#D9A93A 42%,#A87A12 58%,#7A560F 80%);filter:drop-shadow(0 0 3px rgba(237,197,104,.7))}
.rk-light .rk-tfx-frost::after{color:#3AA0E0;-webkit-text-fill-color:#3AA0E0}
.rk-light .rk-tfx-prism::before,.rk-light .rk-tfx-prism::after,.rk-light .rk-tfx-crown::after{-webkit-text-fill-color:#E0A21B;color:#E0A21B;text-shadow:none}

/* ---- legendary titles, 150k to 1,000,000 (19 Sep 2026) ----
   Each one is its own idea, and the dearer ones stack more going on. The
   pill-shaped ones carry their own background, so they read the same on the
   dark student panels and the cream teacher ones. */
.rk-tfx-adapt,.rk-tfx-sustain,.rk-tfx-enviro,.rk-tfx-hokage,.rk-tfx-lion{-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
/* the Adaptable: a chameleon -- its colour keeps shifting and it leans as it goes */
.rk-tfx-adapt{background-image:linear-gradient(90deg,#16C79A,#F9A826,#FF4F79,#5B7CFA,#16C79A);background-size:400% 100%;
  animation:rkFlow 5s linear infinite,rkLean 3s ease-in-out infinite;filter:drop-shadow(0 0 3px rgba(22,199,154,.5))}
@keyframes rkLean{0%,100%{transform:skewX(0)}25%{transform:skewX(-8deg)}75%{transform:skewX(8deg)}}
/* the Sustainable: fresh greens and a recycling mark that turns */
.rk-tfx-sustain{background-image:linear-gradient(90deg,#2E9E4F,#9BE15D,#2E9E4F);background-size:200% 100%;animation:rkFlow 3s linear infinite;padding-right:1.2em}
.rk-tfx-sustain::after{content:"\267B\FE0F";position:absolute;right:0;top:0;-webkit-text-fill-color:initial;color:#2E9E4F;animation:rkSpin 4s linear infinite}
/* the Engineer: a blueprint -- blue grid pill, white lettering, a gear */
.rk-tfx-engineer{color:#fff;-webkit-text-fill-color:#fff;padding:.05em .6em .05em 1.55em;border-radius:6px;font-family:ui-monospace,Menlo,monospace;
  background:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px) 0 0/8px 8px,linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px) 0 0/8px 8px,#1C5DB8;
  box-shadow:0 0 0 1px #9CC8FF inset,0 0 8px -2px rgba(28,93,184,.8)}
.rk-tfx-engineer::before{content:"\2699\FE0F";position:absolute;left:.3em;top:.02em;animation:rkSpin 5s linear infinite}
/* the Doctor: a white coat pill with a heartbeat */
.rk-tfx-doctor{color:#C8102E;-webkit-text-fill-color:#C8102E;background:#fff;padding:.05em .6em .05em 1.45em;border-radius:999px;
  box-shadow:0 0 0 1.5px #C8102E inset,0 0 10px -3px rgba(200,16,46,.7);animation:rkBeat 1.2s ease-in-out infinite}
.rk-tfx-doctor::before{content:"\271A";position:absolute;left:.45em;top:.02em;color:#C8102E}
@keyframes rkBeat{0%,40%,100%{transform:scale(1)}10%{transform:scale(1.08)}20%{transform:scale(.98)}30%{transform:scale(1.05)}}
/* the Environmentalist: sea to forest to sand flowing, a leaf that sways, a globe */
.rk-tfx-enviro{background-image:linear-gradient(90deg,#0E7CC2,#27AE60,#C9A227,#27AE60,#0E7CC2);background-size:300% 100%;animation:rkFlow 5s linear infinite;
  padding:0 1.25em;filter:drop-shadow(0 0 3px rgba(39,174,96,.6))}
.rk-tfx-enviro::before{content:"\1F33F";position:absolute;left:0;top:0;-webkit-text-fill-color:initial;animation:rkSway 2s ease-in-out infinite;transform-origin:bottom center}
.rk-tfx-enviro::after{content:"\1F30D";position:absolute;right:0;top:0;-webkit-text-fill-color:initial}
@keyframes rkSway{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(12deg)}}
/* the Leader: a navy banner with a gold star and a shine marching across */
.rk-tfx-leader{color:#FFD76A;-webkit-text-fill-color:#FFD76A;padding:.05em .7em .05em 1.5em;border-radius:4px 14px 14px 4px;
  background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.35) 45%,transparent 60%) 0 0/250% 100%,linear-gradient(90deg,#0B2C5F,#17457F);
  animation:rkShine 2.4s linear infinite;box-shadow:0 0 0 1.5px #E9A72F inset,0 4px 10px -4px rgba(11,44,95,.8)}
.rk-tfx-leader::before{content:"\2605";position:absolute;left:.45em;top:.02em;color:#FFD76A;animation:rkTwinkle 2s ease-in-out infinite}
/* the Mechatronic: brushed steel, robot lettering, a scan line sweeping over it */
.rk-tfx-mecha{color:#7CF7FF;-webkit-text-fill-color:#7CF7FF;font-family:ui-monospace,Menlo,monospace;letter-spacing:.06em;padding:.05em .6em;border-radius:5px;overflow:hidden;
  background:linear-gradient(180deg,#3A4452,#1B222C);box-shadow:0 0 0 1px #7CF7FF inset,0 0 10px -2px rgba(124,247,255,.7);text-shadow:0 0 6px #19D3FF}
.rk-tfx-mecha::after{content:"";position:absolute;top:0;bottom:0;width:30%;left:-40%;background:linear-gradient(90deg,transparent,rgba(124,247,255,.55),transparent);animation:rkScan 1.8s linear infinite}
@keyframes rkScan{to{left:110%}}
/* the Ninja: black smoke, letters that vanish and return, a spinning star */
.rk-tfx-ninja{color:#E8E8F0;-webkit-text-fill-color:#E8E8F0;padding:.05em 1.45em .05em .6em;border-radius:999px;
  background:radial-gradient(circle at 20% 50%,#3a3a4a,transparent 60%),#0d0d12;box-shadow:0 0 12px -2px rgba(0,0,0,.9),0 0 0 1px #555 inset;
  animation:rkVanish 4s ease-in-out infinite}
.rk-tfx-ninja::after{content:"\2726";position:absolute;right:.4em;top:.02em;color:#C0C0D0;animation:rkSpin .9s linear infinite}
@keyframes rkVanish{0%,60%,100%{opacity:1;filter:blur(0)}70%{opacity:.15;filter:blur(2px)}80%{opacity:1;filter:blur(0)}}
/* the Hokage: fire rising through the letters, the "fire" kanji, embers */
.rk-tfx-hokage{background-image:linear-gradient(0deg,#B3001B 0%,#FF5A00 40%,#FFD000 100%);background-size:100% 200%;
  animation:rkFire .8s ease-in-out infinite alternate;filter:drop-shadow(0 0 5px rgba(255,90,0,.85));padding:0 .9em 0 1.3em}
.rk-tfx-hokage::before{content:"\706B";position:absolute;left:0;top:0;font-weight:900;-webkit-text-fill-color:#FF5A00;color:#FF5A00;text-shadow:0 0 6px #FFB000}
.rk-tfx-hokage::after{content:"\2022";position:absolute;right:.1em;bottom:0;-webkit-text-fill-color:#FFB000;color:#FFB000;animation:rkEmber 1.4s ease-out infinite}
@keyframes rkEmber{from{transform:translateY(0);opacity:1}to{transform:translateY(-14px);opacity:0}}
/* the Lion: our school -- a golden mane that roars outward, and a lion that nods */
.rk-tfx-lion{background-image:linear-gradient(100deg,#F2A516 20%,#FFF3C0 45%,#FFC940 60%,#F2A516 80%);background-size:250% 100%;
  animation:rkShine 2.2s linear infinite,rkRoar 2.6s ease-in-out infinite;padding-left:1.35em}
.rk-tfx-lion::before{content:"\1F981";position:absolute;left:0;top:0;-webkit-text-fill-color:initial;animation:rkBob 1.6s ease-in-out infinite}
@keyframes rkRoar{0%,100%{filter:drop-shadow(0 0 2px rgba(233,167,47,.5))}50%{filter:drop-shadow(0 0 9px rgba(233,167,47,1)) drop-shadow(0 0 16px rgba(255,140,0,.6))}}
/* AURA: rings of light pulse out from the name */
.rk-tfx-aura{color:#fff;-webkit-text-fill-color:#fff;letter-spacing:.14em;padding:.05em .7em;border-radius:999px;
  background:radial-gradient(circle,rgba(190,140,255,.55),rgba(90,40,170,.9));text-shadow:0 0 6px #fff,0 0 14px #C9A2FF;
  animation:rkAura 2s ease-out infinite}
@keyframes rkAura{0%{box-shadow:0 0 0 0 rgba(201,162,255,.9),0 0 0 0 rgba(255,255,255,.6)}
  70%{box-shadow:0 0 0 9px rgba(201,162,255,0),0 0 0 16px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(201,162,255,0),0 0 0 0 rgba(255,255,255,0)}}
.rk-tfx-aura::after{content:"\2727";position:absolute;right:-.35em;top:-.45em;color:#F2E6FF;animation:rkTwinkle 1.4s ease-in-out infinite}
/* the G.O.A.T: a million gold. Gold-and-diamond lettering on a dark pill, a
   border of light running round it, a crowned goat, and sparks in orbit. */
.rk-tfx-goat{color:#FFF3C4;-webkit-text-fill-color:#FFF3C4;font-weight:900;letter-spacing:.08em;padding:.08em .8em .08em 1.75em;border-radius:999px;
  border:2px solid transparent;
  background:linear-gradient(#1a1300,#2b1d00) padding-box,linear-gradient(90deg,#FFD700,#FFFFFF,#7FE7FF,#FFD700,#FF9F1C,#FFD700) border-box;
  background-size:100% 100%,300% 100%;animation:rkGoatRim 2.5s linear infinite,rkGoatGlow 2s ease-in-out infinite;
  text-shadow:0 0 4px #FFD700,0 0 10px rgba(255,215,0,.8),0 0 18px rgba(127,231,255,.5)}
.rk-tfx-goat::before{content:"\1F410";position:absolute;left:.35em;top:.05em;animation:rkBob 1.8s ease-in-out infinite}
.rk-tfx-goat::after{content:"\2726";position:absolute;right:50%;top:50%;color:#FFF6B0;font-size:.75em;text-shadow:0 0 6px #fff;
  transform-origin:0 0;animation:rkOrbit 2.4s linear infinite}
@keyframes rkGoatRim{from{background-position:0 0,0% 0}to{background-position:0 0,300% 0}}
@keyframes rkGoatGlow{0%,100%{box-shadow:0 0 8px -2px rgba(255,215,0,.7)}50%{box-shadow:0 0 18px 2px rgba(255,215,0,.95),0 0 26px 4px rgba(127,231,255,.35)}}
@keyframes rkOrbit{from{transform:rotate(0) translateX(3.2em) rotate(0)}to{transform:rotate(360deg) translateX(3.2em) rotate(-360deg)}}
@media(prefers-reduced-motion:reduce){.rk-tfx-goat,.rk-tfx-aura,.rk-tfx-ninja,.rk-tfx-doctor,.rk-tfx-adapt{animation:none!important}}
/* An emoji inside see-through gradient lettering inherits the see-through
   colour and vanishes; give the decorations a real one. */
.rk-tfx-lion::before,.rk-tfx-enviro::before,.rk-tfx-enviro::after,.rk-tfx-crown::before{color:#000;-webkit-text-fill-color:#000}
.rk-tfx-sustain::after{-webkit-text-fill-color:#2E9E4F}
.rk-light .rk-tfx-lion,.rk-tfx-lion.rk-on-light{background-image:linear-gradient(100deg,#9A5B00 20%,#E9A72F 45%,#B06F00 60%,#9A5B00 80%)}

/* the Khaleeji: all eight Gulf flags (Gulf Cup, 19 Sep 2026). Rebuilt the same
   evening -- the first version was a green copy of the Lion. Now: a pitch-green
   pill, a rim of gold light running round it, a bobbing trophy, gold lettering,
   and the eight Gulf flags turning over one by one (rank-ui.js drives the flag). */
.rk-tfx-gulf{color:#FFE9A8;-webkit-text-fill-color:#FFE9A8;font-weight:900;letter-spacing:.03em;
  padding:.05em .5em .05em 1.6em;border-radius:999px;border:2px solid transparent;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 10px,transparent 10px 20px) padding-box,
    linear-gradient(160deg,#0b6b3a,#063d22) padding-box,
    linear-gradient(90deg,#F2C14E,#FFFFFF,#0f9d58,#F2C14E,#CE1126,#FFFFFF,#F2C14E) border-box;
  background-size:100% 100%,100% 100%,300% 100%;
  animation:rkGulfRim 3s linear infinite,rkGulfGlow 2.2s ease-in-out infinite;
  text-shadow:0 0 5px rgba(242,193,78,.85),0 1px 0 #03260f}
.rk-tfx-gulf::before{content:"\1F3C6";position:absolute;left:.4em;top:.04em;color:#000;-webkit-text-fill-color:#000;
  text-shadow:none;animation:rkBob 1.8s ease-in-out infinite}
.rk-tfx-gulf .rk-gflag{display:inline-block;margin-left:.4em;text-shadow:none;-webkit-text-fill-color:initial;
  animation:rkFlagIn .45s cubic-bezier(.2,1.5,.35,1)}
.rk-tfx-gulf .rk-gflag.b{animation-name:rkFlagIn2}
@keyframes rkGulfRim{from{background-position:0 0,0 0,0% 0}to{background-position:0 0,0 0,300% 0}}
@keyframes rkGulfGlow{0%,100%{box-shadow:0 0 8px -2px rgba(15,157,88,.8)}50%{box-shadow:0 0 16px 1px rgba(242,193,78,.9),0 0 24px 3px rgba(15,157,88,.4)}}
@keyframes rkFlagIn{from{transform:rotateY(90deg) scale(.6)}to{transform:none}}
@keyframes rkFlagIn2{from{transform:rotateY(90deg) scale(.6)}to{transform:none}}
@media(prefers-reduced-motion:reduce){.rk-tfx-gulf,.rk-tfx-gulf::before,.rk-tfx-gulf .rk-gflag{animation:none!important}}
/* An effect title is not a dim footnote: the plain .rk-title rule (opacity .8,
   clipped overflow) was fading every one of them and cutting off their glow. */
.rk-title.rk-tfx{opacity:1;overflow:visible;text-overflow:clip}
.rk-tfx-gulf .rk-gflag{font-size:1.1em;line-height:1}
