Restyle to a clean, flat look and rename brand to SCOPENET

- Brand is now SCOPENET everywhere (defaults, UI, installer, docs)
- Launcher: solid backgrounds (no animated orbs/grain), flat Play button
  without gradient/shine/glow, quieter rail with a simple active
  indicator, smaller type scale, Inter as default font, glass off by
  default, restyled sliders
- Panel: same flat treatment; live preview mirrors the new launcher
- New flat scope-reticle logo and app icons
- Calmer default palette
- Fix: lock the shared cargo cache in the Docker build (amd64/arm64 raced)
- Fix: Windows-only clippy lint in sys.rs

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_011ARcGWxLx21FwXJ3yfGriS

panel/web/src/pages/Branding.svelte

@@ -40,6 +40,7 @@
   }
 
   const presets = [
+    { name: 'SCOPENET', c: { accent: '#6d6af5', accent_2: '#8b88f8', background: '#0d0e12', surface: '#16181e', text: '#ecedf1', muted: '#8b8f9a' } },
     { name: 'Nebula', c: { accent: '#7c5cff', accent_2: '#22d3ee', background: '#0b0d17', surface: '#141828', text: '#eef0ff', muted: '#8b90b3' } },
     { name: 'Creeper', c: { accent: '#22c55e', accent_2: '#a3e635', background: '#07110b', surface: '#0f1d15', text: '#ecfdf3', muted: '#86a893' } },
     { name: 'Nether', c: { accent: '#f97316', accent_2: '#ef4444', background: '#130806', surface: '#22100c', text: '#fff1eb', muted: '#b48a7e' } },
@@ -116,15 +117,14 @@
             <div class="presets">
               {#each presets as p}
                 <button class="preset" onclick={() => applyPreset(p)} title={p.name}>
-                  <span class="sw" style:background="linear-gradient(135deg, {p.c.accent}, {p.c.accent_2})"></span>
-                  <span class="sw2" style:background={p.c.background}></span>
+                  <span class="sw" style:background={p.c.background}><i style:background={p.c.accent}></i><i style:background={p.c.surface}></i></span>
                   <span>{p.name}</span>
                 </button>
               {/each}
             </div>
             <div class="colors">
               <ColorInput bind:value={b.colors.accent} label="Accent" />
-              <ColorInput bind:value={b.colors.accent_2} label="Accent 2 (gradient)" />
+              <ColorInput bind:value={b.colors.accent_2} label="Accent 2" />
               <ColorInput bind:value={b.colors.background} label="Background" />
               <ColorInput bind:value={b.colors.surface} label="Surface" />
               <ColorInput bind:value={b.colors.text} label="Text" />
@@ -137,14 +137,14 @@
           <div class="card col">
             <div class="segmented">
               {#each ['gradient', 'image', 'video'] as k}
-                <button class:active={b.background.kind === k} onclick={() => b && (b.background.kind = k as Branding['background']['kind'])}>{k[0].toUpperCase() + k.slice(1)}</button>
+                <button class:active={b.background.kind === k} onclick={() => b && (b.background.kind = k as Branding['background']['kind'])}>{k === 'gradient' ? 'Solid colour' : k[0].toUpperCase() + k.slice(1)}</button>
               {/each}
             </div>
             {#if b.background.kind !== 'gradient'}
               <ImageInput bind:value={b.background.url} label={b.background.kind === 'video' ? 'Video (mp4/webm)' : 'Image'} video={b.background.kind === 'video'}
                 help={b.background.kind === 'video' ? 'Keep it short and under ~10 MB. Players can turn video off to save resources.' : 'At least 1600×900 looks sharp.'} />
             {:else}
-              <p class="muted small">An animated gradient built from your accent colours. The lightest option on player PCs.</p>
+              <p class="muted small">A plain background in your background colour. Clean, and the lightest option on player PCs.</p>
             {/if}
             <label class="field"><span class="row">Blur <span class="spacer"></span>{b.background.blur}px</span><input type="range" min="0" max="30" bind:value={b.background.blur} /></label>
             <label class="field"><span class="row">Darken <span class="spacer"></span>{b.background.dim}%</span><input type="range" min="0" max="90" bind:value={b.background.dim} /></label>
@@ -162,7 +162,7 @@
               </div>
             </div>
             <label class="field"><span class="row">Corner radius <span class="spacer"></span>{b.radius}px</span><input type="range" min="0" max="28" bind:value={b.radius} /></label>
-            <Toggle bind:checked={b.glass} label="Frosted glass" help="Blurred translucent panels. Turn off for very old graphics cards." />
+            <Toggle bind:checked={b.glass} label="Frosted glass" help="Translucent, blurred panels over image/video backgrounds. Off keeps panels solid." />
           </div>
         {:else if section === 'news'}
           <div class="col">
@@ -236,8 +236,8 @@
   .lbl { font-size: 0.85rem; color: var(--text-2); font-weight: 500; }
   .presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 8px; }
   .preset { flex-direction: column; gap: 6px; padding: 10px; background: var(--bg-2); font-size: 0.8rem; position: relative; }
-  .sw { width: 100%; height: 28px; border-radius: 8px; }
-  .sw2 { position: absolute; right: 16px; top: 16px; width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, 0.3); }
+  .sw { width: 100%; height: 28px; border-radius: 6px; display: flex; gap: 4px; align-items: center; padding: 0 6px; border: 1px solid var(--line); }
+  .sw i { width: 14px; height: 14px; border-radius: 4px; }
   .colors { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
   .fonts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
   .font { flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 14px; background: var(--bg-2); font-weight: 400; }