/* 11 · KNEE KICK callout — native to the Go lesson's existing HANE / NOBI callouts.
   White Montserrat ExtraBold label with soft white glow, thin golden-yellow leader + glowing dot, gold capsule outline. */
@font-face{font-family:"Montserrat";src:url(fonts/montserrat-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:block}
:root{--gold:#F0D20C;--white:#FFFFFF}
html,body{margin:0;height:100%;background:#1a120c;overflow:hidden}
body[data-bg="green"]{background:#00B140}
body[data-bg="transparent"],html:has(body[data-bg="transparent"]){background:transparent}
#stage{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;overflow:hidden;background:#1a120c url(frame.jpg) 0 0/1920px 1080px no-repeat}
#stage[data-bg="green"]{background:#00B140}
#stage[data-bg="blue"]{background:#0047BB}
#stage[data-bg="transparent"]{background:transparent}
#svg{position:absolute;left:0;top:0;width:1920px;height:1080px;overflow:visible}
/* label: HTML so each letter can stagger; baseline placed by JS from font metrics */
#label{position:absolute;left:0;top:0;white-space:pre;font:800 59px/1 "Montserrat",sans-serif;letter-spacing:0;color:#fff;--g:1;--gb:0}
#label .ch{display:inline-block;position:relative;isolation:isolate;will-change:transform,opacity,filter}
/* glow layer (+ faint RGB fringe seen on the reference labels) sits behind the halftone face */
#label .ch::before{content:attr(data-c);position:absolute;left:0;top:0;z-index:-1;color:#fff;opacity:var(--g);
  text-shadow:-1.2px -.9px 0 rgba(255,96,110,.55),1.1px .9px 0 rgba(110,225,255,.45),0 0 3px rgba(255,255,255,.55),0 0 10px rgba(255,255,255,.42),0 0 24px rgba(255,255,255,.36),0 0 52px rgba(255,255,255,.24)}
#label .ch::after{content:attr(data-c);position:absolute;left:0;top:0;z-index:-2;color:transparent;opacity:var(--gb);text-shadow:0 0 18px #fff,0 0 36px rgba(255,255,255,.7)}
#label .ch .f{display:inline-block;color:transparent;-webkit-background-clip:text;background-clip:text;
  background-image:radial-gradient(circle at 1.5px 1.5px,rgba(214,214,214,1) 0 .75px,rgba(255,255,255,1) 1.05px);background-size:3px 3px;background-color:#fff}
#hud{position:fixed;z-index:10;left:12px;top:10px;display:flex;gap:14px;align-items:center;font:600 13px/1 system-ui,Arial,sans-serif;color:#fff;background:rgba(17,17,17,.82);padding:8px 12px;border-radius:6px;opacity:0;transition:opacity .25s}
#hud.on{opacity:1}
#hud a{color:#F0D20C}
#hud .hint{opacity:.75}