{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "bracket-win",
  "title": "Bracket Win",
  "description": "A tournament bracket resolves match by match until remocn is crowned 'CHAMPION'.",
  "dependencies": ["remotion", "@remotion/google-fonts"],
  "files": [
    {
      "path": "registry/remocn/bracket-win/index.tsx",
      "content": "\"use client\";\n\nimport { loadFont as loadManrope } from \"@remotion/google-fonts/Manrope\";\nimport { loadFont } from \"@remotion/google-fonts/Tektur\";\nimport { useId } from \"react\";\nimport {\n  AbsoluteFill,\n  Easing,\n  interpolate,\n  useCurrentFrame,\n  useVideoConfig,\n} from \"remotion\";\n\nconst { fontFamily: tektur } = loadFont(\"normal\", {\n  weights: [\"400\", \"500\"],\n  subsets: [\"latin\"],\n});\nconst manrope = loadManrope(\"normal\", {\n  weights: [\"600\"],\n  subsets: [\"latin\"],\n});\n\nconst REMOCN_R_PATH =\n  \"M 0.01 0.81 C 0.01 1.73, 0.36 2.79, 1.09 4.13 C 4.91 11.04, 13.45 17.16, 21.7 18.9 C 22.94 19.16, 23.18 19.16, 51.39 19.27 C 76.07 19.36, 80.02 19.4, 81.32 19.57 C 89.89 20.69, 96.2 24.68, 99.38 31.01 C 103.19 38.56, 102.53 50.1, 97.91 57.07 C 94.66 61.96, 89.68 64.99, 83.26 66 C 82.81 66.07, 70.18 66.83, 55.2 67.69 C 24.82 69.43, 27.03 69.23, 24.18 70.4 C 19.9 72.15, 14.84 75.7, 10.65 79.89 C 4.86 85.68, 1.3 91.91, 0.25 98.13 C 0.12 98.85, 0.08 103.13, 0.04 116.66 L 0 134.26 9.5 134.26 L 19 134.26 19.05 119.41 C 19.1 103.27, 19.08 103.82, 19.82 101.04 C 21.79 93.65, 27.86 88.75, 36.45 87.63 C 37.23 87.53, 39.41 87.5, 43.57 87.53 C 50.12 87.59, 50.75 87.65, 53.22 88.45 C 56.61 89.56, 59.67 91.86, 62.02 95.07 C 62.52 95.76, 69.35 103.85, 77.2 113.07 C 85.04 122.28, 91.63 130.04, 91.85 130.32 C 92.07 130.59, 92.5 131.34, 92.82 131.97 C 93.52 133.35, 94.11 133.93, 95.06 134.13 C 95.5 134.23, 98.97 134.26, 106.36 134.23 L 117.01 134.19 100.82 113.07 C 91.91 101.45, 84.52 91.78, 84.39 91.57 C 83.36 89.89, 83.66 87.53, 85.09 86 C 85.79 85.25, 86.36 84.94, 88.07 84.38 C 96.18 81.72, 104.15 76.62, 109.97 70.36 C 120.59 58.93, 124.06 44.32, 119.44 30.43 C 114.59 15.81, 101.93 4.02, 87.64 0.83 C 83.93 0.01, 88.09 0.08, 41.85 0.04 L 0.01 0 0.01 0.81 Z\";\n\n/** Full logo as on remocn.dev: R mark (0.76em tall, baseline-aligned) + \"emocn\" in Manrope 600. */\nfunction RemocnLogo({ fontSize, color }: { fontSize: number; color: string }) {\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        alignItems: \"baseline\",\n        color,\n        fontFamily: manrope.fontFamily,\n        fontWeight: 600,\n        fontSize,\n        letterSpacing: \"-0.025em\",\n        lineHeight: 1,\n      }}\n    >\n      <svg\n        viewBox=\"0 0 124.06 134.26\"\n        style={{ height: \"0.76em\", width: \"auto\" }}\n        aria-hidden\n      >\n        <path fill=\"currentColor\" d={REMOCN_R_PATH} />\n      </svg>\n      <span style={{ marginLeft: \"0.04em\" }}>emocn</span>\n    </div>\n  );\n}\n\nexport interface BracketWinProps {\n  /**\n   * The seven teams remocn plays through, in bracket order after remocn:\n   * [QF opponent, the two teams of the other left quarterfinal, then the four\n   * teams of the right half]. remocn always holds the top-left seed.\n   */\n  opponents?: string[];\n  /** Word on the champion plate. */\n  title?: string;\n  /** Small line under the plate. */\n  caption?: string;\n  /** Round labels over the columns: quarterfinal, semifinal, final. */\n  rounds?: [string, string, string];\n  /** Winner ticks on the non-remocn matches. */\n  accent?: string;\n  theme?: \"dark\" | \"light\";\n  speed?: number;\n}\n\n// Beat sheet (30fps, speed 1):\n//   0–14   slots slide in from the outer edges, empty later-round slots and\n//          the connector lines draw toward the centre, round labels fade up\n//  20     quarterfinals resolve: scores tick in, losers dim, winners' lines\n//          draw to the semifinal slots (remocn's in the gradient)\n//  40     semifinals resolve the same way, winners advance into the final\n//  60     the final resolves; remocn's slot flashes\n//  68–82  the final node bursts: a gradient plate grows out of it with a ring,\n//          the bracket sinks back, \"CHAMPION\" slams in with the logo\n//  86–    poster hold\nconst ROUND_AT = [20, 40, 60] as const;\nconst DIM_DELAY = 4;\nconst LINE_LEN = 9;\nconst BURST_AT = 68;\n\nconst SLAM = Easing.bezier(0.12, 0.9, 0.25, 1);\nconst OUT = Easing.bezier(0.22, 1, 0.36, 1);\nconst INOUT = Easing.bezier(0.65, 0, 0.35, 1);\nconst CLAMP = {\n  extrapolateLeft: \"clamp\",\n  extrapolateRight: \"clamp\",\n} as const;\n\n// gradients.sh \"radial-glow\": bg #020204, [#f3f1ff, #9db4ff, #5a46cb, #1d1240].\nconst GLOW = [\"#F3F1FF\", \"#9DB4FF\", \"#5A46CB\", \"#1D1240\"] as const;\n\nconst THEMES = {\n  dark: {\n    stage: \"#050507\",\n    slot: \"#141418\",\n    edge: \"#24242A\",\n    line: \"#2A2A31\",\n    ink: \"#F3F2EF\",\n    dim: \"#7C7B82\",\n    score: \"#1D1D22\",\n  },\n  light: {\n    stage: \"#F5F4F0\",\n    slot: \"#FFFFFF\",\n    edge: \"#E1DFD8\",\n    line: \"#D3D1CA\",\n    ink: \"#121214\",\n    dim: \"#86847E\",\n    score: \"#EFEDE7\",\n  },\n} as const;\n\nfunction ramp(t: number, from: number, len: number) {\n  return interpolate(t, [from, from + len], [0, 1], CLAMP);\n}\n\n/** A hit: up in 1 frame, eases back over `len`. */\nfunction kick(d: number, len = 8) {\n  if (d < 0) return 0;\n  if (d < 1) return d;\n  const k = Math.max(0, 1 - (d - 1) / len);\n  return k * k;\n}\n\n// Team indices: 0 is remocn, 1–7 the opponents in bracket order.\ninterface Match {\n  round: 0 | 1 | 2;\n  a: number;\n  b: number;\n  win: number;\n  score: [number, number];\n}\nconst MATCHES: Match[] = [\n  { round: 0, a: 0, b: 1, win: 0, score: [2, 0] },\n  { round: 0, a: 2, b: 3, win: 2, score: [2, 1] },\n  { round: 0, a: 4, b: 5, win: 4, score: [2, 1] },\n  { round: 0, a: 6, b: 7, win: 6, score: [2, 0] },\n  { round: 1, a: 0, b: 2, win: 0, score: [2, 0] },\n  { round: 1, a: 4, b: 6, win: 6, score: [1, 2] },\n  { round: 2, a: 0, b: 6, win: 0, score: [3, 1] },\n];\n\ninterface Slot {\n  x: number;\n  y: number;\n  team: number;\n  match: number;\n  side: \"a\" | \"b\";\n  /** Frame the team's name appears in the slot. */\n  arrive: number;\n}\n\ninterface Link {\n  d: string;\n  len: number;\n  team: number;\n  at: number;\n}\n\nexport function BracketWin({\n  opponents = [\n    \"Keyframes\",\n    \"Stock clips\",\n    \"Agency\",\n    \"Screen rec\",\n    \"Slide decks\",\n    \"Templates\",\n    \"Freelance\",\n  ],\n  title = \"Champion\",\n  caption = \"Playoffs 2026 · 8 teams · 0 maps dropped\",\n  rounds = [\"Quarterfinal\", \"Semifinal\", \"Grand final\"],\n  accent = \"#3B5BFD\",\n  theme = \"dark\",\n  speed = 1,\n}: BracketWinProps) {\n  const t = useCurrentFrame() * speed + 1;\n  const { width: W, height: H } = useVideoConfig();\n  const c = THEMES[theme];\n  const u = Math.min(W / 1280, H / 720);\n  const id = useId().replace(/[^a-zA-Z0-9_-]/g, \"\");\n  const names = [\"remocn\", ...opponents];\n\n  // ── Geometry ──────────────────────────────────────────────────────────────\n  const slotW = 192 * u;\n  const slotH = 50 * u;\n  const pairGap = 6 * u;\n  const finalW = 204 * u;\n  const cx = W / 2;\n  const cy = H / 2 + 24 * u;\n  const qfX = [48 * u, W - 48 * u - slotW];\n  const sfX = [qfX[0] + slotW + 52 * u, qfX[1] - 52 * u - slotW];\n  const fX = cx - finalW / 2;\n  const qfCy = [cy - 142 * u, cy + 142 * u];\n  const pairTop = (mcy: number) => mcy - slotH - pairGap / 2;\n  const pairBot = (mcy: number) => mcy + pairGap / 2;\n\n  // Every slot in the bracket.\n  const slots: Slot[] = [];\n  const links: Link[] = [];\n  const addPair = (m: number, x: number, mcy: number, arrive: number): void => {\n    slots.push({\n      x,\n      y: pairTop(mcy),\n      team: MATCHES[m].a,\n      match: m,\n      side: \"a\",\n      arrive,\n    });\n    slots.push({\n      x,\n      y: pairBot(mcy),\n      team: MATCHES[m].b,\n      match: m,\n      side: \"b\",\n      arrive,\n    });\n  };\n  const winAt = (round: number) => ROUND_AT[round] + DIM_DELAY;\n  const landAt = (round: number) => winAt(round) + LINE_LEN - 1;\n\n  addPair(0, qfX[0], qfCy[0], 0);\n  addPair(1, qfX[0], qfCy[1], 0);\n  addPair(2, qfX[1], qfCy[0], 0);\n  addPair(3, qfX[1], qfCy[1], 0);\n  addPair(4, sfX[0], cy, landAt(0));\n  addPair(5, sfX[1], cy, landAt(0));\n  addPair(6, fX, cy, landAt(1));\n\n  const elbow = (x0: number, y0: number, x1: number, y1: number) => {\n    const xm = (x0 + x1) / 2;\n    return {\n      d: `M ${x0} ${y0} H ${xm} V ${y1} H ${x1}`,\n      len: Math.abs(xm - x0) + Math.abs(y1 - y0) + Math.abs(x1 - xm),\n    };\n  };\n  const slotMid = (y: number) => y + slotH / 2;\n  // Quarterfinal → semifinal, left and right.\n  for (let k = 0; k < 2; k++) {\n    const mL = MATCHES[k];\n    const toL = elbow(\n      qfX[0] + slotW,\n      qfCy[k],\n      sfX[0],\n      slotMid(k === 0 ? pairTop(cy) : pairBot(cy)),\n    );\n    links.push({ ...toL, team: mL.win, at: winAt(0) });\n    const mR = MATCHES[2 + k];\n    const toR = elbow(\n      qfX[1],\n      qfCy[k],\n      sfX[1] + slotW,\n      slotMid(k === 0 ? pairTop(cy) : pairBot(cy)),\n    );\n    links.push({ ...toR, team: mR.win, at: winAt(0) });\n  }\n  // Semifinal → final.\n  const toFL = elbow(sfX[0] + slotW, cy, fX, slotMid(pairTop(cy)));\n  links.push({ ...toFL, team: MATCHES[4].win, at: winAt(1) });\n  const toFR = elbow(sfX[1], cy, fX + finalW, slotMid(pairBot(cy)));\n  links.push({ ...toFR, team: MATCHES[5].win, at: winAt(1) });\n\n  // ── Global beats ──────────────────────────────────────────────────────────\n  const baseDraw = OUT(ramp(t, 4, 12));\n  const labelsIn = OUT(ramp(t, 6, 10));\n  const burst = SLAM(ramp(t, BURST_AT, 10));\n  const sinkP = OUT(ramp(t, BURST_AT, 12));\n  const titleIn = SLAM(ramp(t, BURST_AT + 2, 8));\n  const logoIn = OUT(ramp(t, BURST_AT + 5, 10));\n  const capIn = OUT(ramp(t, BURST_AT + 12, 10));\n  const push = 1 + 0.035 * INOUT(ramp(t, 0, BURST_AT + 20));\n  const hit = Math.max(\n    ...ROUND_AT.map((r) => kick(t - r, 7) * 0.6),\n    kick(t - BURST_AT - 4, 10),\n  );\n\n  // Final champion plate: grows out of the final node.\n  const plateW0 = finalW;\n  const plateH0 = slotH * 2 + pairGap;\n  const plateW1 = 2 * (cx - sfX[0]) + 28 * u;\n  const plateH1 = 262 * u;\n  const plateW = plateW0 + (plateW1 - plateW0) * burst;\n  const plateH = plateH0 + (plateH1 - plateH0) * burst;\n  const plateCut = 26 * u * burst;\n\n  const sunk = 1 - 0.72 * sinkP;\n\n  const slotEl = (s: Slot, i: number) => {\n    const m = MATCHES[s.match];\n    const resolveAt = ROUND_AT[m.round];\n    const isFinal = m.round === 2;\n    const w = isFinal ? finalW : slotW;\n    const enter =\n      m.round === 0\n        ? SLAM(ramp(t, (i % 4) - 1, 9))\n        : OUT(ramp(t, 3 + m.round * 2, 10));\n    const fromLeft = s.x < cx - (isFinal ? w : 0);\n    const named = t >= s.arrive;\n    const nameP = s.arrive === 0 ? 1 : SLAM(ramp(t, s.arrive, 6));\n    const resolved = t >= resolveAt;\n    const sc = s.side === \"a\" ? m.score[0] : m.score[1];\n    const scoreP = SLAM(ramp(t, resolveAt + (s.match % 4) * 1, 5));\n    const won = m.win === s.team;\n    const lost = !won;\n    const dimP = lost ? OUT(ramp(t, resolveAt + DIM_DELAY, 6)) : 0;\n    const isRemocn = s.team === 0;\n    const lit = isRemocn && named;\n    const winFlash = won ? kick(t - resolveAt - DIM_DELAY, 9) : 0;\n    const hideInBurst = isFinal && t >= BURST_AT;\n    if (hideInBurst) return null;\n    return (\n      <div\n        key={`slot-${i}`}\n        style={{\n          position: \"absolute\",\n          left: s.x,\n          top: s.y,\n          width: w,\n          height: slotH,\n          transform:\n            m.round === 0\n              ? `translateX(${(1 - enter) * (fromLeft ? -1 : 1) * (slotW + 60 * u)}px)`\n              : `scale(${0.94 + 0.06 * enter})`,\n          opacity:\n            (m.round === 0 ? 1 : enter) *\n            (1 - 0.68 * dimP) *\n            (isRemocn ? 1 : sunk),\n          display: \"flex\",\n          alignItems: \"stretch\",\n          background: lit\n            ? `linear-gradient(100deg, ${GLOW[2]} 0%, #3C3AA8 60%, ${GLOW[3]} 100%)`\n            : c.slot,\n          boxShadow: `inset 0 0 0 ${1 * u}px ${lit ? GLOW[2] : c.edge}`,\n          overflow: \"hidden\",\n        }}\n      >\n        <div\n          style={{\n            width: 4 * u,\n            background: isRemocn ? GLOW[0] : accent,\n            opacity: resolved && won && named ? 1 : 0,\n          }}\n        />\n        <div\n          style={{\n            flex: 1,\n            display: \"flex\",\n            alignItems: \"center\",\n            paddingLeft: 14 * u,\n            overflow: \"hidden\",\n          }}\n        >\n          {named ? (\n            <div\n              style={{\n                transform: `translateY(${(1 - nameP) * slotH}px)`,\n                display: \"flex\",\n                alignItems: \"center\",\n              }}\n            >\n              {isRemocn ? (\n                <RemocnLogo fontSize={25 * u} color=\"#FFFFFF\" />\n              ) : (\n                <span\n                  style={{\n                    fontFamily: tektur,\n                    fontWeight: 500,\n                    fontSize: 21 * u,\n                    letterSpacing: \"0.01em\",\n                    color: c.ink,\n                    whiteSpace: \"nowrap\",\n                  }}\n                >\n                  {names[s.team]}\n                </span>\n              )}\n            </div>\n          ) : (\n            <div\n              style={{\n                width: 34 * u,\n                height: 3 * u,\n                background: c.line,\n              }}\n            />\n          )}\n        </div>\n        <div\n          style={{\n            width: 40 * u,\n            display: \"flex\",\n            alignItems: \"center\",\n            justifyContent: \"center\",\n            background: lit ? \"rgba(255,255,255,0.12)\" : c.score,\n            fontFamily: tektur,\n            fontWeight: 500,\n            fontSize: 22 * u,\n            color: lit ? \"#FFFFFF\" : c.ink,\n            fontVariantNumeric: \"tabular-nums\",\n            overflow: \"hidden\",\n          }}\n        >\n          {resolved && named ? (\n            <span\n              style={{\n                transform: `translateY(${(1 - scoreP) * slotH * 0.8}px)`,\n              }}\n            >\n              {sc}\n            </span>\n          ) : null}\n        </div>\n        <div\n          style={{\n            position: \"absolute\",\n            inset: 0,\n            background: \"#FFFFFF\",\n            opacity: 0.55 * winFlash,\n          }}\n        />\n      </div>\n    );\n  };\n\n  const labelCols = [\n    { x: qfX[0], w: slotW, text: rounds[0] },\n    { x: sfX[0], w: slotW, text: rounds[1] },\n    { x: fX, w: finalW, text: rounds[2] },\n    { x: sfX[1], w: slotW, text: rounds[1] },\n    { x: qfX[1], w: slotW, text: rounds[0] },\n  ];\n\n  return (\n    <AbsoluteFill style={{ background: c.stage, overflow: \"hidden\" }}>\n      <div\n        style={{\n          position: \"absolute\",\n          inset: 0,\n          transform: `scale(${push * (1 + 0.01 * hit)})`,\n          transformOrigin: `${cx}px ${cy}px`,\n        }}\n      >\n        <div style={{ position: \"absolute\", inset: 0 }}>\n          {/* Round labels. */}\n          {labelCols.map((l, i) => (\n            <div\n              key={`label-${i}-${l.text}`}\n              style={{\n                position: \"absolute\",\n                left: l.x,\n                width: l.w,\n                top: qfCy[0] - slotH - 70 * u,\n                textAlign: i === 2 ? \"center\" : i < 2 ? \"left\" : \"right\",\n                fontFamily: tektur,\n                fontWeight: 400,\n                fontSize: 17 * u,\n                letterSpacing: \"0.24em\",\n                textTransform: \"uppercase\",\n                color: c.dim,\n                opacity: labelsIn * sunk,\n                transform: `translateY(${(1 - labelsIn) * 10 * u}px)`,\n              }}\n            >\n              {l.text}\n            </div>\n          ))}\n\n          {/* Connectors: base lines, then each winner's advance. */}\n          <svg\n            width={W}\n            height={H}\n            style={{ position: \"absolute\", inset: 0, opacity: sunk }}\n            aria-hidden\n          >\n            <defs>\n              <linearGradient\n                id={`${id}-path`}\n                gradientUnits=\"userSpaceOnUse\"\n                x1={qfX[0]}\n                y1={0}\n                x2={cx}\n                y2={0}\n              >\n                <stop offset=\"0\" stopColor={GLOW[1]} />\n                <stop offset=\"0.55\" stopColor=\"#7C6CF0\" />\n                <stop offset=\"1\" stopColor={GLOW[0]} />\n              </linearGradient>\n            </defs>\n            {links.map((l, i) => (\n              <path\n                key={`base-${i}`}\n                d={l.d}\n                fill=\"none\"\n                stroke={c.line}\n                strokeWidth={2 * u}\n                strokeDasharray={l.len}\n                strokeDashoffset={l.len * (1 - baseDraw)}\n              />\n            ))}\n            {links.map((l, i) => {\n              const p = SLAM(ramp(t, l.at, LINE_LEN));\n              if (p <= 0) return null;\n              const mine = l.team === 0;\n              return (\n                <path\n                  key={`win-${i}`}\n                  d={l.d}\n                  fill=\"none\"\n                  stroke={mine ? `url(#${id}-path)` : c.ink}\n                  strokeOpacity={mine ? 1 : 0.5}\n                  strokeWidth={(mine ? 4 : 2) * u}\n                  strokeDasharray={l.len}\n                  strokeDashoffset={l.len * (1 - p)}\n                />\n              );\n            })}\n          </svg>\n\n          {slots.map(slotEl)}\n        </div>\n\n        {/* remocn's lit path stays on top of the sunk bracket. */}\n        <svg\n          width={W}\n          height={H}\n          style={{ position: \"absolute\", inset: 0, opacity: sinkP }}\n          aria-hidden\n        >\n          {links\n            .filter((l) => l.team === 0)\n            .map((l, i) => (\n              <path\n                key={`lit-${i}`}\n                d={l.d}\n                fill=\"none\"\n                stroke={`url(#${id}-path)`}\n                strokeWidth={4 * u}\n              />\n            ))}\n        </svg>\n\n        {/* Burst: two crisp rings racing out of the final node. */}\n        {t >= BURST_AT\n          ? [0, 4].map((delay) => {\n              const p = OUT(ramp(t, BURST_AT + delay, 26));\n              const r = (120 + 560 * p) * u;\n              return (\n                <div\n                  key={`ring-${delay}`}\n                  style={{\n                    position: \"absolute\",\n                    left: cx - r,\n                    top: cy - r,\n                    width: 2 * r,\n                    height: 2 * r,\n                    borderRadius: \"50%\",\n                    boxShadow: `inset 0 0 0 ${(delay === 0 ? 4 : 2) * u}px ${delay === 0 ? GLOW[1] : GLOW[2]}`,\n                    opacity: (1 - p) * (p > 0 ? 1 : 0),\n                  }}\n                />\n              );\n            })\n          : null}\n\n        {/* Champion plate. */}\n        {t >= BURST_AT ? (\n          <div\n            style={{\n              position: \"absolute\",\n              left: cx - plateW / 2,\n              top: cy - plateH / 2,\n              width: plateW,\n              height: plateH,\n              clipPath: `polygon(${plateCut}px 0, 100% 0, 100% calc(100% - ${plateCut}px), calc(100% - ${plateCut}px) 100%, 0 100%, 0 ${plateCut}px)`,\n              background: [\n                `radial-gradient(70% 90% at 50% 115%, ${GLOW[1]} 0%, transparent 70%)`,\n                `radial-gradient(60% 80% at 50% 0%, ${GLOW[3]} 0%, transparent 80%)`,\n                `linear-gradient(180deg, ${GLOW[3]} 0%, ${GLOW[2]} 70%, #7D73E6 100%)`,\n              ].join(\", \"),\n              display: \"flex\",\n              flexDirection: \"column\",\n              alignItems: \"center\",\n              justifyContent: \"center\",\n              gap: 6 * u,\n              overflow: \"hidden\",\n            }}\n          >\n            <div\n              style={{\n                opacity: logoIn,\n                transform: `translateY(${(1 - logoIn) * 14 * u}px)`,\n              }}\n            >\n              <RemocnLogo fontSize={50 * u} color=\"#FFFFFF\" />\n            </div>\n            <div\n              style={{\n                fontFamily: tektur,\n                fontWeight: 500,\n                fontSize: 128 * u,\n                lineHeight: 1,\n                letterSpacing: \"0.02em\",\n                textTransform: \"uppercase\",\n                color: \"#FFFFFF\",\n                opacity: Math.min(1, titleIn * 1.5),\n                transform: `scale(${1 + 0.16 * (1 - titleIn)})`,\n                whiteSpace: \"nowrap\",\n              }}\n            >\n              {title}\n            </div>\n            <div\n              style={{\n                position: \"absolute\",\n                inset: 0,\n                background: \"#FFFFFF\",\n                opacity: 0.3 * kick(t - BURST_AT - 1, 7),\n              }}\n            />\n          </div>\n        ) : null}\n\n        {/* Caption under the plate. */}\n        {capIn > 0 ? (\n          <div\n            style={{\n              position: \"absolute\",\n              left: 0,\n              right: 0,\n              top: cy + plateH1 / 2 + 26 * u,\n              textAlign: \"center\",\n              fontFamily: tektur,\n              fontWeight: 400,\n              fontSize: 20 * u,\n              letterSpacing: \"0.22em\",\n              textTransform: \"uppercase\",\n              color: c.dim,\n              opacity: capIn,\n              transform: `translateY(${(1 - capIn) * 10 * u}px)`,\n            }}\n          >\n            {caption}\n          </div>\n        ) : null}\n      </div>\n    </AbsoluteFill>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/remocn/bracket-win.tsx"
    }
  ],
  "type": "registry:component"
}