/* Game Experience v1 - shared in-game help, daily Home and equal-weight cards. */
.tg-game-page .tg-game-banner{position:relative}
.tg-game-help-button{
 position:absolute;z-index:8;top:clamp(11px,2.1vw,25px);right:clamp(12px,2.2vw,27px);
 width:33px;height:33px;border-radius:50%;display:grid;place-items:center;
 background:var(--surface);color:var(--text);border:1px solid var(--line);
 font-size:16px;font-weight:750;line-height:1;cursor:pointer;box-shadow:0 2px 9px #00000010;
}
.tg-game-help-button:hover{background:var(--surface-soft)}
.tg-game-help-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.tg-game-help-dialog .tg-dialog-content{display:grid;gap:15px}
.tg-help-art{
 min-height:132px;border:1px solid var(--line);border-radius:16px;
 background:var(--surface-soft);display:flex;align-items:center;justify-content:center;
 gap:12px;padding:18px;overflow:hidden;
}
.tg-help-steps{padding-left:24px;margin:0;display:grid;gap:9px;font-size:14px;line-height:1.5}
.tg-help-steps li{padding-left:5px}
.tg-help-note{font-size:12px;color:var(--muted);margin:0;line-height:1.45}
.tg-help-stack{width:48px;height:90px;display:flex;flex-direction:column;gap:3px;background:#24272b;
 padding:4px;border:1px solid #484b50;border-radius:8px}
.tg-help-stack .tg-help-tile{flex:1;border-radius:4px}
.tg-help-art[data-example="memory"]{display:grid;grid-template-columns:repeat(2,64px);grid-template-rows:repeat(2,64px);gap:9px}
.tg-help-square{border-radius:15px;display:grid;place-items:center;color:#21262c;font-weight:850;font-size:20px}
.tg-help-signal{background:#7ccf9c;border-radius:15px;min-width:96px;height:96px;display:grid;place-items:center;color:#20372c;font-weight:800}
.tg-help-signal-go{background:#ec6a74;color:#42171b}
.tg-help-arrow{font-size:25px;color:var(--muted)}
.tg-help-letters{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;max-width:225px}
.tg-help-letters span{border:1px solid var(--line);background:var(--surface);padding:7px 11px;text-align:center;border-radius:6px;font-weight:750}
.tg-help-path{font-size:12px;color:var(--muted);letter-spacing:.02em}
.tg-help-art[data-example="letters"]{flex-direction:column}
.tg-help-pitch-bar{background:#8b78dd;width:15px;border-radius:11px}
.tg-help-art[data-example="pitch"]{height:156px}
.tg-help-art[data-example="colour"] .tg-colour-wheel,
.tg-help-wheel-fallback{width:120px;height:120px;border-radius:50%;display:block;max-width:100%}
/* The chosen goal deliberately scales independently of the game catalogue. */
body.float-ui .app-shell:not(.admin-mode) .page-home .home-main{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:16px
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-featured,
body.float-ui .app-shell:not(.admin-mode) .page-home .home-progress{
 min-width:0;width:100%;border:1px solid var(--line);border-radius:16px;
 background:var(--surface);padding:18px;box-shadow:var(--shadow);margin:0;
}
.page-home .home-featured .section-header{margin-bottom:15px}
.page-home .home-featured .featured-grid{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px
}
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card,
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card[data-game="sequence-memory"]{
 display:flex;flex-direction:column;grid-column:auto;grid-row:auto;grid-template-columns:none;
 min-width:0;height:100%;overflow:hidden
}
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card .card-art,
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card[data-game="sequence-memory"] .card-art{
 width:100%;height:124px;min-height:124px;flex:none;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card .card-text,
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card[data-game="sequence-memory"] .card-text{
 padding:12px 13px 15px;flex:1
}
.home-daily{
 margin:0 0 18px;padding:20px;border:1px solid var(--line);border-radius:17px;
 background:var(--surface);box-shadow:var(--shadow);display:grid;gap:13px;
}
.home-daily-header,.home-daily-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.home-daily-header h2{margin:0;font-size:22px;letter-spacing:-.5px}
.home-daily-header p,.home-daily-footer p{margin:4px 0 0;font-size:12px;color:var(--muted)}
.home-daily-controls{display:flex;align-items:center;gap:9px}
.home-daily-controls label{font-size:12px;color:var(--muted)}
.home-daily-controls select{
 background:var(--surface-soft);border:1px solid var(--line);border-radius:9px;
 color:var(--text);padding:8px 28px 8px 10px;font-weight:700
}
.home-daily-tracker{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:center}
.home-daily-count{font-size:21px;font-weight:800;min-width:62px;font-variant-numeric:tabular-nums}
.home-daily-track{height:9px;border-radius:20px;background:var(--surface-soft);overflow:hidden}
.home-daily-fill{height:100%;width:0%;border-radius:20px;background:#78bd9d;transition:width .3s}
.home-daily-message{font-size:13px;color:var(--muted);margin:0}
.home-daily-games{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.home-daily-game{
 display:flex;align-items:center;gap:9px;min-width:0;padding:12px 13px;
 border:1px solid var(--line);border-radius:12px;background:var(--surface-soft);
 color:var(--text);text-decoration:none;transition:background .14s
}
.home-daily-game:hover{background:var(--surface)}
.home-daily-game:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.home-daily-game .home-daily-icon{flex:none;max-width:28px;max-height:28px}
.home-daily-game>span:not(.home-daily-icon){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700}
.home-daily-game small{font-size:10px;color:var(--muted);white-space:nowrap;margin-left:auto}
.home-daily-game.is-done{border-color:#78bd9d90}
.home-daily-game.is-done small{color:#398c67}
.home-daily-next{
 display:inline-flex;align-items:center;justify-content:center;min-height:35px;
 background:var(--text);color:var(--surface);padding:8px 14px;border-radius:9px;
 font-size:12px;font-weight:750;text-decoration:none
}
.home-daily-more{border:1px solid var(--line);background:var(--surface);
 border-radius:9px;color:var(--text);padding:8px 13px;cursor:pointer;font-size:12px}
.home-daily-next[hidden],.home-daily-more[hidden]{display:none!important}
.public-profile-edit[hidden]{display:none!important}
/* Preserve the same eyebrow / heading hierarchy as every other page.
   Back replaces the small eyebrow, not the large page heading. */
.page-public-profile .profile-page-header{display:block}
.page-public-profile .profile-page-header .public-profile-back{
 display:inline-flex;align-items:center;justify-content:flex-start;
 margin:0 0 9px;line-height:1.3;text-align:left;
}
/* Identity card is the editing context. Keep its action top-right. */
.page-public-profile .profile-main-top{align-items:flex-start}
.page-public-profile .profile-main-top>.profile-actions{
 width:auto;flex:0 0 auto;align-self:flex-start;
 margin-left:auto;justify-content:flex-end;
}
.page-public-profile .profile-main-card .public-profile-edit{
 white-space:nowrap;
}
@media(max-width:560px){
 .page-public-profile .profile-main-top>.profile-actions{
  width:100%;margin-left:0;justify-content:flex-end;
 }
}
/* Stats chart layout now lives exclusively in stats-charts.css. */
@media(max-width:950px){
 body.float-ui .app-shell:not(.admin-mode) .page-home .home-main{grid-template-columns:1fr}
 .home-daily-games{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:580px){
 .home-daily{padding:14px}
 .home-daily-header h2{font-size:20px}
 .home-daily-games{grid-template-columns:1fr}
 .home-daily-game{padding:10px 12px}
 .tg-game-help-button{top:8px;right:9px;width:30px;height:30px}
 .tg-help-art{gap:6px;padding:12px}
 .tg-help-stack{width:37px}
}

/* Experience v2 - open editorial Home, not three nested bordered panels.
   Reserve card surfaces for the actual artwork, not every piece of content. */
body.float-ui .app-shell:not(.admin-mode) .page-home .home-daily{
 background:transparent;border:0;border-radius:0;box-shadow:none;
 padding:14px 0 22px;margin:0 0 26px;
 border-bottom:1px solid var(--line);gap:12px;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-intro{
 padding-bottom:13px;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-main{
 grid-template-columns:minmax(0,1fr);gap:29px;align-items:start;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-featured,
body.float-ui .app-shell:not(.admin-mode) .page-home .home-progress{
 background:transparent;border:0;border-radius:0;box-shadow:none;
 margin:0;padding:0;min-width:0;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-featured .featured-grid{
 grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 16px;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card,
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card[data-game="sequence-memory"]{
 background:transparent;border:0;border-radius:0;box-shadow:none;
 padding:0;gap:0;min-height:0;align-self:start;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card:is(:hover,:focus-visible){
 box-shadow:none;transform:none;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card .card-art,
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card[data-game="sequence-memory"] .card-art{
 border-radius:13px;background:var(--surface-soft);min-height:133px;height:133px;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card .card-text,
body.float-ui .app-shell:not(.admin-mode) .page-home .featured-grid .game-catalog-card[data-game="sequence-memory"] .card-text{
 background:transparent;padding:11px 2px 0;min-width:0;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-progress{
 border-top:1px solid var(--line);padding-top:23px;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-progress-heading{
 border:0;padding:0 0 8px;margin:0 0 9px;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-progress-metrics{
 grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-progress .home-metric,
body.float-ui .app-shell:not(.admin-mode) .page-home .home-progress .home-metric-points{
 grid-column:auto;min-width:0;background:transparent;border:0;box-shadow:none;
 padding:8px 2px 3px;gap:7px;
}
body.float-ui .app-shell:not(.admin-mode) .page-home .home-progress .home-metric strong{
 font-size:clamp(24px,2.9vw,32px);
}
.page-home .home-daily-game{
 background:transparent;border:0;border-radius:0;padding:9px 8px 9px 0;
 border-bottom:1px solid var(--line);box-shadow:none;
}
.page-home .home-daily-game:hover{background:transparent}
.page-home .home-daily-game.is-done{border-color:var(--line)}
.page-home .home-daily-more{border:0;background:transparent;padding:7px 2px}
.page-home .home-daily-next{border-radius:9px}
.page-home .home-daily-track{height:6px}
.page-home .home-daily-controls select{border:0;background:var(--surface-soft);padding:8px 25px 8px 10px}
.page-home .home-daily-footer{gap:9px 17px}
.page-home .home-daily-footer p{margin-left:auto}
/* Literal replay of Sideweave's native board and path UI. */
.tg-game-help-dialog .tg-help-art{min-height:235px}
.tg-game-help-dialog .tg-help-sideweave{
 flex-direction:column;gap:7px;padding:8px 10px 12px;overflow:visible;
}
.tg-game-help-dialog .tg-help-sideweave .sw-board{
 width:min(100%,246px);height:auto;max-width:246px;max-height:246px;
 flex:none;aspect-ratio:1;overflow:visible;pointer-events:none;
}
.tg-game-help-dialog .tg-help-sideweave .sw-arc{
 stroke:var(--sw-ring,#9ea9ad);stroke-width:2;fill:none;
}
.tg-game-help-dialog .tg-help-sideweave .sw-letter text{
 fill:var(--text);font-weight:690;font-size:22px;
}
.tg-game-help-dialog .tg-help-sideweave .sw-path{
 stroke:var(--sw-used-ink,var(--muted));fill:none;stroke-width:3;
 stroke-linejoin:round;stroke-linecap:round;opacity:.48;
}
.tg-game-help-dialog .tg-help-sideweave .sw-path.current{
 stroke:var(--game-ink,var(--accent));stroke-width:4;opacity:.9;
}
.tg-game-help-dialog .tg-help-sideweave .sw-pip{
 fill:var(--sw-ring,#9ea9ad);stroke:none;
}
.tg-game-help-dialog .tg-help-sideweave .sw-letter.active text,
.tg-game-help-dialog .tg-help-sideweave .sw-pip.active{fill:var(--game-ink,var(--accent))}
.tg-game-help-dialog .tg-help-sideweave .tg-help-weave-cursor{
 fill:var(--game-ink,var(--accent));opacity:.18;pointer-events:none;
 transition:cx .36s ease,cy .36s ease;
}
.tg-help-word-bank{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
 min-height:25px;font-size:12px;font-weight:650;color:var(--text)}
.tg-help-accepted-word{color:var(--muted)}
.tg-help-current-word{color:var(--text)}
/* Sequence Memory: the SAME 2x2 tile art, explicitly constrained to squares.
   The old generic guide's four direct children made 2x1 rectangles. */
.tg-game-help-dialog .tg-help-art[data-example="memory"]{
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 gap:12px;min-height:290px;
}
.tg-help-memory-board{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
 grid-template-rows:repeat(2,minmax(0,1fr));
 width:min(100%,232px);aspect-ratio:1;height:auto;max-width:232px;
 gap:10px;flex:none;
}
.tg-help-memory-board .memory-tile{
 display:block;box-sizing:border-box;width:100%;height:100%;min-width:0;min-height:0;
 aspect-ratio:1!important;border-radius:17px;border:2px solid #00000008;
 opacity:1;box-shadow:inset 0 -5px 0 #00000011;
}
.tg-help-memory-board .memory-tile.is-lit{
 filter:brightness(1.2) saturate(1.18);transform:scale(1.035);
 border-color:#ffffffac;box-shadow:0 0 0 3px #ffffff73,0 3px 15px #00000014;
}
.tg-help-demo-caption{text-align:center;font-size:11px;color:var(--muted);letter-spacing:.075em;
 margin:0;min-height:18px}
/* Remaining games gain lightweight illustrative movement without scripts/timers. */
.tg-game-help-dialog[open] .tg-help-art[data-example="stack"] .tg-help-stack:first-child .tg-help-tile:first-child{
 animation:tg-guide-tile-lift 3.3s ease-in-out infinite;
}
.tg-game-help-dialog[open] .tg-help-art[data-example="reaction"] .tg-help-signal-go{
 animation:tg-guide-react 3s ease-in-out infinite;
}
.tg-game-help-dialog[open] .tg-help-art[data-example="pitch"] .tg-help-pitch-bar{
 animation:tg-guide-pitch 2.8s ease-in-out infinite;
 animation-delay:calc(var(--tg-guide-index,0) * .18s);
}
.tg-game-help-dialog[open] .tg-help-art[data-example="colour"] .tg-shared-colour-wheel{
 animation:tg-guide-colour 5s linear infinite;transform-origin:center;
}
@keyframes tg-guide-tile-lift{
 0%,22%,80%,100%{transform:translate(0,0);filter:none}
 42%,59%{transform:translate(16px,-16px);filter:brightness(1.15)}
}
@keyframes tg-guide-react{
 0%,49%,100%{transform:scale(1);filter:saturate(1)}
 58%,74%{transform:scale(1.045);filter:saturate(1.35)}
}
@keyframes tg-guide-pitch{
 0%,100%{transform:scaleY(.7)}50%{transform:scaleY(1.17)}
}
@keyframes tg-guide-colour{to{transform:rotate(360deg)}}
@media(max-width:950px){
 body.float-ui .app-shell:not(.admin-mode) .page-home .home-main{grid-template-columns:1fr}
 body.float-ui .app-shell:not(.admin-mode) .page-home .home-featured .featured-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))
 }
}
@media(max-width:570px){
 body.float-ui .app-shell:not(.admin-mode) .page-home .home-featured .featured-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 12px
 }
 body.float-ui .app-shell:not(.admin-mode) .page-home .home-progress-metrics{
  grid-template-columns:repeat(2,minmax(0,1fr))
 }
 .page-home .home-daily-games{grid-template-columns:repeat(2,minmax(0,1fr))}
 .page-home .home-daily-game{gap:6px;flex-wrap:wrap}
 .page-home .home-daily-game small{margin-left:0}
 .page-home .home-daily-footer p{width:100%;margin:0}
}
@media(max-width:390px){
 body.float-ui .app-shell:not(.admin-mode) .page-home .home-featured .featured-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))
 }
 .page-home .home-daily-games{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
 .tg-game-help-dialog .tg-help-art *,
 .tg-game-help-dialog .tg-help-art *::before,
 .tg-game-help-dialog .tg-help-art *::after{
  animation:none!important;transition:none!important;
 }
}

/* The same Reaction Time target changes from waiting green to tap red. */
.tg-help-art[data-example="reaction"]{min-height:230px}
.tg-help-reaction-square{
 width:min(100%,206px);height:206px;aspect-ratio:1;
 display:grid;place-items:center;border-radius:19px;
 background:var(--tg-reaction-green,#71d3ab);color:#163e32;
 font-size:23px;font-weight:850;letter-spacing:-.035em;
 transition:background-color .08s ease,transform .12s ease;
}
.tg-help-reaction-square[data-state="go"]{
 background:var(--tg-reaction-red,#ef6575);
 color:#431825;transform:scale(1.025);
}

/* The mobile help button lives in the same permanent topbar as the game
   title. It deliberately overrides Float's blanket .topbar > * {display:none},
   exactly as the mobile title does; the hidden attribute still takes priority. */
body.float-ui .app-shell:not(.admin-mode) .workspace>.topbar>.tg-mobile-game-help{
 display:none!important;
}
@media(max-width:700px){
 body.float-ui .app-shell:not(.admin-mode) .workspace>.topbar>.tg-mobile-game-help:not([hidden]){
   display:grid!important;place-items:center;flex:0 0 36px;
   position:relative!important;inset:auto!important;z-index:3;
   box-sizing:border-box;width:36px;height:36px;min-width:36px;min-height:36px;
   padding:0;margin:0 0 0 5px;
   border:1px solid var(--line);border-radius:50%;
   background:var(--surface);color:var(--text);
   font-family:inherit;font-size:16px;font-weight:750;line-height:1;cursor:pointer;touch-action:manipulation;
 }
 body.float-ui .app-shell:not(.admin-mode) .workspace>.topbar>.tg-mobile-game-help[hidden]{
   display:none!important;
 }
 body.float-ui .app-shell:not(.admin-mode) .workspace>.topbar>.tg-mobile-game-help:focus-visible{
   outline:2px solid var(--accent);outline-offset:3px;
 }
 body.float-ui .app-shell:not(.admin-mode) .tg-game-page .tg-game-banner>.tg-game-help-button{
   display:none!important;
 }
 body.float-ui .app-shell:not(.admin-mode) .workspace>.topbar>.tg-mobile-game-title:not([hidden]){
   max-width:calc(100vw - 185px);
 }
}

/* Phone controls must remain touch-friendly; narrow game-specific toolbars
   can opt into a second row rather than removing all horizontal padding. */
@media(max-width:700px){
 body.float-ui .app-shell:not(.admin-mode) .tg-game-page .tg-game-actions .tg-game-button,
 body.float-ui .app-shell:not(.admin-mode) .tg-game-page .gl-actions .tg-game-button{
  box-sizing:border-box;min-height:42px;padding-inline:clamp(11px,2.7vw,17px);
 }
}


/* Launch quick-guide contract: short instructions + a looping visual example.
   Animations only run with the modal open; reduced motion uses still artwork. */
.tg-game-help-dialog .tg-help-steps{gap:7px;font-size:13px;line-height:1.45}
.tg-game-help-dialog .tg-help-art{min-height:190px;flex-direction:column}
.tg-game-help-dialog .tg-help-art[data-example="number"] .nm-preview-number{
 animation:tg-help-memorise 3.8s ease-in-out infinite
}
.tg-game-help-dialog .tg-help-art[data-example="timescape"] .tscape-preview-wave{
 animation:tscape-preview-drift 7s ease-in-out infinite alternate
}
.tg-game-help-dialog .tg-help-art[data-example="shape"] .sm-preview-board{
 animation:tg-help-rebuild 4.7s ease-in-out infinite
}
.tg-help-bitnode-arena,.tg-help-kata-stage{
 position:relative;width:min(100%,285px);height:160px;flex:none;overflow:hidden;
 border-radius:14px;background:radial-gradient(circle at 50% 50%,#344c69 0%,#182330 85%);
}
.tg-help-bitnode-player{
 --tg-icon-size:73px;--tg-icon-art-size:58px;
 position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);z-index:2;
 animation:tg-help-bit-move 3.6s ease-in-out infinite;
}
.tg-help-bitnode-player .tg-bitnode-nav-pixel{
 width:50px!important;height:50px!important;image-rendering:pixelated
}
.tg-help-bitnode-foe{position:absolute;width:16px;height:16px;border:3px solid #802c45;
 background:#e46383;border-radius:4px;top:20%;left:20%;
 animation:tg-help-foe 3.6s ease-in-out infinite}
.tg-help-bitnode-foe:nth-of-type(2){top:68%;left:70%;animation-delay:-1.2s}
.tg-help-bitnode-foe:nth-of-type(3){top:25%;left:78%;animation-delay:-2.3s}
.tg-help-bitnode-beam{position:absolute;width:50px;height:3px;background:#a0e4f4;
 top:48%;left:52%;transform-origin:left center;transform:rotate(-24deg);
 box-shadow:0 0 9px #97e6f2;animation:tg-help-beam 1.2s ease-out infinite}
.tg-help-kata-stage{background:radial-gradient(ellipse at 50% 76%,#806e6266,transparent 65%),
 linear-gradient(150deg,#302b32,#1b2535)}
.tg-help-kata-fruit{position:absolute;width:83px;height:83px;left:50%;top:47%;
 transform:translate(-50%,-50%);border-radius:50%;background:#e0a55d;
 box-shadow:inset -13px -9px #a65d4b,0 8px 20px #0005;
 animation:tg-help-kata-fruit 3.2s ease-in-out infinite}
.tg-help-kata-fruit i{position:absolute;inset:0;border-radius:inherit;
 background:inherit;opacity:0;animation:tg-help-kata-half 3.2s ease-in-out infinite}
.tg-help-kata-fruit i:first-child{clip-path:inset(0 51% 0 0)}
.tg-help-kata-fruit i:last-child{clip-path:inset(0 0 0 51%);animation-name:tg-help-kata-other}
.tg-help-kata-slice{position:absolute;width:210px;height:3px;top:52%;left:50%;
 background:linear-gradient(90deg,transparent,#fff,#9ee6ef,transparent);
 transform:translate(-50%,-50%) rotate(-24deg) scaleX(0);
 box-shadow:0 0 11px #b9f6fa;animation:tg-help-sword 3.2s ease-in-out infinite}
.tg-help-grouplet-board{width:min(100%,310px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
 gap:7px;margin:0 auto}
.tg-help-grouplet-chip{padding:13px 4px;text-align:center;min-width:0;border-radius:9px;
 font-size:12px;font-weight:790;color:#32403c;background:#dde5e2;border:1px solid #b7cbc4;
 animation:tg-help-group 4.6s ease-in-out infinite}
.tg-help-grouplet-chip:nth-child(-n+4){animation-name:tg-help-group-selected}
@keyframes tg-help-memorise{0%,48%,100%{opacity:1;filter:none}62%,86%{opacity:.14;filter:blur(7px)}}
@keyframes tg-help-rebuild{0%,24%,100%{filter:none;transform:scale(1)}45%,65%{filter:brightness(.85) grayscale(.6);transform:scale(.89)}}
@keyframes tg-help-bit-move{0%,100%{transform:translate(-55%,-43%)}45%{transform:translate(-17%,-65%)}}
@keyframes tg-help-foe{0%,100%{opacity:1;scale:1}60%{opacity:.15;scale:.45}}
@keyframes tg-help-beam{0%,100%{opacity:0;scale:0 1}28%,58%{opacity:1;scale:1 1}}
@keyframes tg-help-kata-fruit{0%,35%,100%{opacity:1}65%,78%{opacity:.55}}
@keyframes tg-help-kata-half{0%,40%,100%{opacity:0;transform:none}55%,78%{opacity:1;transform:translate(-22px,10px) rotate(-15deg)}}
@keyframes tg-help-kata-other{0%,40%,100%{opacity:0;transform:none}55%,78%{opacity:1;transform:translate(22px,10px) rotate(15deg)}}
@keyframes tg-help-sword{0%,23%,83%,100%{opacity:0;transform:translate(-50%,-50%) rotate(-24deg) scaleX(0)}
 36%,50%{opacity:1;transform:translate(-50%,-50%) rotate(-24deg) scaleX(1)}}
@keyframes tg-help-group-selected{0%,24%,100%{background:#dde5e2;transform:translateY(0)}
 40%,74%{background:#8bd4b5;transform:translateY(-5px)}}
@keyframes tg-help-group{0%,100%{opacity:1}40%,74%{opacity:.37}}
/* Bitnode's real sprite, expanded as a low-contrast title motif, not a tiny badge. */
.page-bitnode .tg-game-banner .float-title-emblem{
 position:absolute;z-index:0;right:7%;top:50%;transform:translateY(-50%) rotate(-9deg);
 opacity:.23;display:grid;place-items:center;width:175px;height:175px;pointer-events:none
}
.page-bitnode .tg-game-banner .float-title-emblem .tg-game-icon{
 --tg-icon-size:155px;--tg-icon-art-size:145px;width:155px;height:155px
}
.page-bitnode .tg-game-banner .float-title-emblem .tg-game-icon img,
.page-bitnode .tg-game-banner .float-title-emblem .tg-game-icon .tg-bitnode-nav-pixel{
 width:145px!important;height:145px!important;max-width:none!important;max-height:none!important;
 image-rendering:pixelated;object-fit:contain
}
@media(max-width:700px){
 .page-bitnode .tg-game-banner .float-title-emblem{right:2%;width:112px;height:112px;opacity:.18}
 .page-bitnode .tg-game-banner .float-title-emblem .tg-game-icon{--tg-icon-size:110px;--tg-icon-art-size:98px}
 .page-bitnode .tg-game-banner .float-title-emblem .tg-game-icon img,
 .page-bitnode .tg-game-banner .float-title-emblem .tg-game-icon .tg-bitnode-nav-pixel{width:98px!important;height:98px!important}
}
@media(prefers-reduced-motion:reduce){
 .tg-game-help-dialog .tg-help-art *,
 .tg-game-help-dialog .tg-help-art *::before,
 .tg-game-help-dialog .tg-help-art *::after{animation:none!important;transition:none!important}
}

/* Give the Timescape silk demo a real height inside its flex-based guide. */
.tg-game-help-dialog .tg-help-art[data-example="timescape"] .tscape-preview{
 position:relative;display:block;width:100%;height:185px;min-height:185px;
 border:0;border-radius:13px;box-shadow:none;overflow:hidden
}
.tg-game-help-dialog .tg-help-art[data-example="timescape"] .tscape-preview-art{
 position:absolute;inset:0
}

/* Dormant guides must not keep animating while their dialog is closed. */
.tg-game-help-dialog:not([open]) .tg-help-art *,
.tg-game-help-dialog:not([open]) .tg-help-art *::before,
.tg-game-help-dialog:not([open]) .tg-help-art *::after{animation-play-state:paused!important}

/* Tutorials follow the active site theme, including their study artwork. */
:root[data-theme="dark"] .tg-game-help-dialog .tg-help-art[data-example="number"] .nm-preview{
 background:radial-gradient(ellipse at 50% 40%,#33405b 0%,#1a2233 74%)!important;
 color:#f4f4ff;border:0;box-shadow:none;
}
:root[data-theme="dark"] .tg-game-help-dialog .nm-preview-number{
 color:#b3caff;text-shadow:0 4px 18px #6b82df55;
}
:root[data-theme="dark"] .tg-game-help-dialog .nm-preview-caption{color:#b8c6e5}
:root[data-theme="dark"] .tg-game-help-dialog .tg-help-art[data-example="shape"] .sm-preview{
 background:radial-gradient(ellipse at 35% 40%,#394057 0%,#222738 82%)!important;
 border:0;box-shadow:none;
}
:root[data-theme="dark"] .tg-game-help-dialog .tg-help-art[data-example="shape"] .sm-board{
 background:transparent!important;border:0!important;box-shadow:none!important;
}
:root[data-theme="dark"] .tg-game-help-dialog .tg-help-art[data-example="shape"] .sm-board::before{opacity:.12}
.tg-game-help-dialog .tg-help-art[data-example="timescape"] .tg-guide-silk{
 position:relative;display:block;width:100%;height:210px;min-height:210px;
 background:transparent!important;border:0!important;box-shadow:none!important;
 overflow:hidden;border-radius:0;
}
.tg-game-help-dialog .tg-guide-silk .tg-showcase-silk-canvas{
 position:absolute;inset:0;width:100%;height:100%;display:block;background:transparent;
 -webkit-mask-image:radial-gradient(ellipse 58% 60% at 50% 48%,#000 24%,#000c 47%,transparent 88%);
 mask-image:radial-gradient(ellipse 58% 60% at 50% 48%,#000 24%,#000c 47%,transparent 88%);
}
.tg-help-bitnode-beam{display:none!important}

/* Universal help placement: visibly paired with the heading, never floating
   under the fixed Create account CTA. Keep the headline text itself intact for
   accessible return-to-intro controls and the mirrored phone title. */
.tg-game-page .tg-game-banner .tg-game-title-row{
 display:flex;align-items:center;justify-content:flex-start;gap:clamp(7px,1.3vw,13px);
 min-width:0;max-width:100%;
}
.tg-game-page .tg-game-banner .tg-game-title-row h1{
 min-width:0;max-width:calc(100% - 42px);
 flex:0 1 auto;
}
.tg-game-page .tg-game-banner .tg-game-title-row .tg-game-help-button{
 position:relative;top:auto;right:auto;inset:auto;z-index:4;
 flex:0 0 30px;width:30px;height:30px;padding:0;margin:0;
 font-size:14px;box-shadow:none;
 color:var(--text);background:var(--surface);
}
@media(max-width:700px){
 /* The actual guide remains in the hidden desktop heading; the independent
    mobile topbar button invokes the same dialog and is the touch target. */
 body.float-ui .app-shell:not(.admin-mode) .tg-game-page .tg-game-title-row .tg-game-help-button{
  display:none!important
 }
 body.float-ui .app-shell:not(.admin-mode) .workspace>.topbar>.tg-mobile-game-help:not([hidden]){
  font-size:14px!important
 }
}
