File size: 5,095 Bytes
64b629a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="383" height="77" viewBox="0 0 383 77">
  <defs>
    <!-- Tokyo Night gradient: storm blue to night blue -->
    <linearGradient id="bgGrad" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" stop-color="#1a1b26"/>
      <stop offset="50%" stop-color="#24283b"/>
      <stop offset="100%" stop-color="#1f2335"/>
    </linearGradient>
    <!-- Subtle scanline pattern for cyberpunk feel -->
    <pattern id="scan" width="2" height="2" patternUnits="userSpaceOnUse">
      <rect width="2" height="1" fill="#1a1b26" opacity="0.0"/>
      <rect y="1" width="2" height="1" fill="#7aa2f7" opacity="0.04"/>
    </pattern>
    <!-- Token-stream scan beam: gradient sweeps along the lower edge -->
    <linearGradient id="beam" x1="0%" y1="0%" x2="100%" y2="0%">
      <stop offset="0%" stop-color="#7aa2f7" stop-opacity="0"/>
      <stop offset="50%" stop-color="#7dcfff" stop-opacity="0.55"/>
      <stop offset="100%" stop-color="#7aa2f7" stop-opacity="0"/>
    </linearGradient>
  </defs>

  <!-- Background -->
  <rect width="383" height="77" fill="url(#bgGrad)"/>
  <rect width="383" height="77" fill="url(#scan)"/>

  <!-- Left accent bar: Tokyo Night cyan -->
  <rect x="0" y="0" width="3" height="77" fill="#7dcfff"/>

  <!-- MoE expert-routing dot grid (12 cells; staggered opacity cycles
       evoke the 8-of-256 sparse activation pattern in the real model). -->
  <g>
    <circle cx="320" cy="14" r="1.6" fill="#bb9af7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;1;0.15" dur="2.4s" begin="0s" repeatCount="indefinite"/>
    </circle>
    <circle cx="330" cy="14" r="1.6" fill="#7aa2f7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;0.85;0.15" dur="2.6s" begin="0.3s" repeatCount="indefinite"/>
    </circle>
    <circle cx="340" cy="14" r="1.6" fill="#bb9af7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;0.9;0.15" dur="3.0s" begin="0.7s" repeatCount="indefinite"/>
    </circle>
    <circle cx="350" cy="14" r="1.6" fill="#7dcfff" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;0.9;0.15" dur="2.8s" begin="1.1s" repeatCount="indefinite"/>
    </circle>
    <circle cx="360" cy="14" r="1.6" fill="#7aa2f7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;0.85;0.15" dur="3.2s" begin="0.5s" repeatCount="indefinite"/>
    </circle>
    <circle cx="370" cy="14" r="1.6" fill="#bb9af7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;1;0.15" dur="2.7s" begin="1.5s" repeatCount="indefinite"/>
    </circle>
    <circle cx="320" cy="24" r="1.6" fill="#7aa2f7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;0.85;0.15" dur="2.9s" begin="0.9s" repeatCount="indefinite"/>
    </circle>
    <circle cx="330" cy="24" r="1.6" fill="#bb9af7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;0.95;0.15" dur="3.3s" begin="1.7s" repeatCount="indefinite"/>
    </circle>
    <circle cx="340" cy="24" r="1.6" fill="#7dcfff" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;0.85;0.15" dur="2.5s" begin="0.2s" repeatCount="indefinite"/>
    </circle>
    <circle cx="350" cy="24" r="1.6" fill="#bb9af7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;0.9;0.15" dur="3.1s" begin="1.3s" repeatCount="indefinite"/>
    </circle>
    <circle cx="360" cy="24" r="1.6" fill="#7aa2f7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;1;0.15" dur="2.8s" begin="0.6s" repeatCount="indefinite"/>
    </circle>
    <circle cx="370" cy="24" r="1.6" fill="#bb9af7" fill-opacity="0.15">
      <animate attributeName="fill-opacity" values="0.15;0.85;0.15" dur="2.5s" begin="2.0s" repeatCount="indefinite"/>
    </circle>
  </g>

  <!-- Wordmark: JANUS-35B -->
  <text x="20" y="38"
        font-family="ui-monospace, 'SF Mono', 'Cascadia Mono', 'JetBrains Mono', Menlo, Consolas, monospace"
        font-size="26"
        font-weight="700"
        letter-spacing="2"
        fill="#c0caf5">JANUS<tspan fill="#7aa2f7">-35B</tspan></text>

  <!-- Subtitle -->
  <text x="20" y="58"
        font-family="ui-monospace, 'SF Mono', 'Cascadia Mono', 'JetBrains Mono', Menlo, Consolas, monospace"
        font-size="10"
        font-weight="400"
        letter-spacing="1.5"
        fill="#9aa5ce">Qwen 3.6 · MoE 35B/3B · Opus 4.7 distilled</text>

  <!-- Token-stream scan beam: sweeps left-to-right along the bottom edge,
       evoking the cursor of an LLM generating tokens in real time. -->
  <rect x="-100" y="73" width="100" height="1.2" fill="url(#beam)" opacity="0.85">
    <animate attributeName="x" values="-100;500" dur="4s" repeatCount="indefinite"/>
  </rect>

  <!-- Right accent: status dot (terminal cursor) -->
  <rect x="370" y="56" width="6" height="10" fill="#9ece6a">
    <animate attributeName="opacity" values="1;0.3;1" dur="2s" repeatCount="indefinite"/>
  </rect>
</svg>