claude-sonnet-5 @ max · CC

CCmax
config
claude-sonnet-5-eff-max--cli--claude-code--dev
batch
2026-07-19--unified
transport
claude-code-cli-headless
protocol
cli · plan
served model
claude-sonnet-5
captured
Jul 18, 2026, 11:54 AM · N=2
all efforts & arms of this model →
variant
live
slot 0 · P-q · sandboxed iframe
claude-sonnet-5 @max · CC P-q slot 0 screenshot

The screenshot is the exact frozen pixels the similarity channels measured. Run live re-executes the raw output in a sandboxed iframe; its rendering depends on your browser and fonts and is not guaranteed to match the measured pixels.

similarity neighbors

nearest
qwen3.7-max · go0.59deepseek-v4-flash @max · api0.58deepseek-v4-flash-free · api0.58gpt-5.6-terra @low · codex-oauth0.58kimi-k3 · opencode0.58
farthest
gpt-5.6-sol @high · codex-oauth0.42deepseek-v3.2 · kiro0.42claude-sonnet-5 @high · CC0.42claude-opus-4-8 @low · CC0.42qwen3.5-plus · go0.44

within session 2026-07-19--unified

similarity measures convergence within this session — not quality.

Fidelity — does the card show the right data?

  • namematch
  • conditionmatch
  • datematch
  • max tempambiguousshown: 25max-equals-min
  • min tempambiguousshown: 25max-equals-min
  • hourlyambiguouscoverage · 0 match · 0 mismatch · 24 not shown
  • request sidematch0 violation(s)

extractor fidelity-extractor-v1+Berlin-2026-07-15

Source — raw model output, one byte unchanged

download card.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=1280, height=800">
<title>Weather</title>
<style>
  :root{
    --bg1:#8fb8e8; --bg2:#6c8fc7; --bg3:#4a6da3; --accent:#5b8def;
    --card-bg:rgba(15,23,42,.38); --card-border:rgba(255,255,255,.16);
    --text:#f4f7fb; --text-dim:rgba(244,247,251,.68);
  }
  *{box-sizing:border-box;}
  html,body{height:100%;margin:0;}
  body{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    color:var(--text);
    background:
      radial-gradient(circle at 18% 22%, var(--bg1), transparent 55%),
      radial-gradient(circle at 82% 78%, var(--bg2), transparent 55%),
      linear-gradient(160deg, var(--bg2), var(--bg3));
    background-size:160% 160%;
    animation:drift 24s ease-in-out infinite alternate;
    transition:background-color .8s ease;
  }
  @keyframes drift{
    0%{background-position:0% 0%,100% 100%,0% 0%;}
    100%{background-position:15% 10%,85% 92%,0% 0%;}
  }
  body[data-theme="sun"]{--bg1:#ffdb8a; --bg2:#ff9a56; --bg3:#e0724a; --accent:#ff9142;}
  body[data-theme="cloud-sun"]{--bg1:#cfe8ff; --bg2:#8fb8e8; --bg3:#5b7ea8; --accent:#5b8def;}
  body[data-theme="cloud"]{--bg1:#c9d6e3; --bg2:#93a5b8; --bg3:#5c6e82; --accent:#9fb2c6;}
  body[data-theme="fog"]{--bg1:#d7dde2; --bg2:#b7c0c8; --bg3:#7c8994; --accent:#aab6c0;}
  body[data-theme="rain"]{--bg1:#8fa9c9; --bg2:#5b7ba3; --bg3:#324royal; --accent:#6fa3e0;}
  body[data-theme="rain"]{--bg3:#324a6e;}
  body[data-theme="snow"]{--bg1:#eef4f9; --bg2:#c9dcec; --bg3:#93b3cf; --accent:#8fbfe6;}
  body[data-theme="storm"]{--bg1:#5a5a80; --bg2:#33334d; --bg3:#1a1a2e; --accent:#a89bff;}

  .stage{min-height:100vh;display:grid;place-items:center;padding:40px;}
  .card{
    width:min(860px,92vw);
    background:var(--card-bg);
    border:1px solid var(--card-border);
    border-radius:28px;
    padding:44px 48px;
    backdrop-filter:blur(22px) saturate(140%);
    -webkit-backdrop-filter:blur(22px) saturate(140%);
    box-shadow:0 30px 60px -20px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.15);
    animation:rise .5s ease-out;
  }
  @keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}

  .status{margin:0;padding:60px 0;text-align:center;font-size:16px;color:var(--text-dim);}

  .head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:8px;}
  .loc{display:flex;align-items:center;gap:8px;}
  .pin{width:20px;height:20px;color:var(--accent);flex:none;}
  .head h1{margin:0;font-size:26px;font-weight:650;letter-spacing:.2px;}
  .date{margin:2px 0 0;font-size:14px;color:var(--text-dim);}

  .hero{display:flex;align-items:center;gap:28px;padding:28px 0 22px;border-bottom:1px solid rgba(255,255,255,.14);}
  .icon-badge{
    width:128px;height:128px;flex:none;border-radius:50%;
    background:radial-gradient(circle, rgba(255,255,255,.2), rgba(255,255,255,.02) 70%);
    display:flex;align-items:center;justify-content:center;
  }
  .w-icon{width:84px;height:84px;color:var(--accent);}
  .temps{flex:1;min-width:0;}
  .hilo{display:flex;align-items:baseline;gap:14px;}
  .hi{font-size:64px;font-weight:700;letter-spacing:-1px;line-height:1;}
  .lo{font-size:28px;font-weight:500;color:var(--text-dim);}
  .condition{margin:8px 0 0;font-size:17px;color:var(--text-dim);}

  .hourly{padding-top:24px;}
  .hourly h2{margin:0 0 14px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-dim);}
  #hourlyChart{width:100%;height:150px;color:var(--accent);overflow:visible;}
  .pt{fill:var(--card-bg);stroke:currentColor;stroke-width:2.5;}
  .hour-labels{display:flex;justify-content:space-between;padding:6px 4px 0;font-size:12px;color:var(--text-dim);}

  .foot{margin:26px 0 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);font-size:12px;color:var(--text-dim);display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;}
</style>
</head>
<body data-theme="cloud-sun">
  <div class="stage">
    <main class="card" id="card">
      <p class="status" id="status" role="status" aria-live="polite">Loading weather…</p>
      <div id="mainContent" hidden>
        <header class="head">
          <div class="loc">
            <svg class="pin" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z"/></svg>
            <h1 id="locationName"></h1>
          </div>
          <p class="date" id="dateLabel"></p>
        </header>

        <section class="hero">
          <div class="icon-badge" id="iconWrap"></div>
          <div class="temps">
            <div class="hilo">
              <span class="hi" id="tempMax"></span>
              <span class="lo" id="tempMin"></span>
            </div>
            <p class="condition" id="conditionLabel"></p>
          </div>
        </section>

        <section class="hourly">
          <h2>Hourly Temperature</h2>
          <svg id="hourlyChart" viewBox="0 0 1000 150" preserveAspectRatio="none"></svg>
          <div class="hour-labels" id="hourLabels"></div>
        </section>

        <footer class="foot">
          <span>Data via Open-Meteo</span>
          <span id="coordsLabel"></span>
        </footer>
      </div>
    </main>
  </div>

<script>
(function(){
  var WMO = {
    0:['Clear sky','sun'],1:['Mainly clear','sun'],2:['Partly cloudy','cloud-sun'],3:['Overcast','cloud'],
    45:['Fog','fog'],48:['Depositing rime fog','fog'],
    51:['Light drizzle','rain'],53:['Drizzle','rain'],55:['Dense drizzle','rain'],
    56:['Light freezing drizzle','rain'],57:['Freezing drizzle','rain'],
    61:['Slight rain','rain'],63:['Rain','rain'],65:['Heavy rain','rain'],
    66:['Light freezing rain','rain'],67:['Freezing rain','rain'],
    71:['Slight snow','snow'],73:['Snow','snow'],75:['Heavy snow','snow'],77:['Snow grains','snow'],
    80:['Slight rain showers','rain'],81:['Rain showers','rain'],82:['Violent rain showers','rain'],
    85:['Slight snow showers','snow'],86:['Heavy snow showers','snow'],
    95:['Thunderstorm','storm'],96:['Thunderstorm with hail','storm'],99:['Thunderstorm with heavy hail','storm']
  };

  var CLOUD_PATH = 'M30,74 Q16,74 16,60 Q16,48 28,46 Q30,32 46,32 Q62,32 66,46 Q80,46 80,60 Q80,74 66,74 Z';

  function sunShape(cx,cy,r,r1,r2){
    var s = '<circle cx="'+cx+'" cy="'+cy+'" r="'+r+'" fill="currentColor"/>';
    for(var i=0;i<8;i++){
      var a = i*Math.PI/4;
      var x1=cx+Math.cos(a)*r1, y1=cy+Math.sin(a)*r1;
      var x2=cx+Math.cos(a)*r2, y2=cy+Math.sin(a)*r2;
      s += '<line x1="'+x1.toFixed(1)+'" y1="'+y1.toFixed(1)+'" x2="'+x2.toFixed(1)+'" y2="'+y2.toFixed(1)+'" stroke="currentColor" stroke-width="5" stroke-linecap="round"/>';
    }
    return s;
  }
  function cloudShape(){ return '<path d="'+CLOUD_PATH+'" fill="currentColor"/>'; }

  var ICONS = {
    'sun': function(){ return sunShape(50,50,20,28,38); },
    'cloud-sun': function(){ return '<g transform="translate(-8,-6) scale(0.6)">'+sunShape(50,50,20,28,38)+'</g>'+cloudShape(); },
    'cloud': function(){ return cloudShape(); },
    'fog': function(){
      var out=''; var ys=[44,57,70];
      for(var i=0;i<ys.length;i++){
        out += '<line x1="'+(20+i*3)+'" y1="'+ys[i]+'" x2="'+(80-i*3)+'" y2="'+ys[i]+'" stroke="currentColor" stroke-width="5" stroke-linecap="round" opacity="'+(1-i*0.2)+'"/>';
      }
      return out;
    },
    'rain': function(){
      var out=cloudShape();
      for(var i=0;i<3;i++){ var x=34+i*16; out += '<line x1="'+x+'" y1="78" x2="'+(x-6)+'" y2="92" stroke="currentColor" stroke-width="5" stroke-linecap="round"/>'; }
      return out;
    },
    'snow': function(){
      var out=cloudShape();
      for(var i=0;i<3;i++){ var x=34+i*16, y=84+(i%2)*7; out += '<circle cx="'+x+'" cy="'+y+'" r="3" fill="currentColor"/>'; }
      return out;
    },
    'storm': function(){
      return cloudShape()+'<path d="M52,72 L42,88 L50,88 L45,100 L64,80 L54,80 Z" fill="currentColor"/>';
    }
  };

  function buildIconSvg(key){
    var fn = ICONS[key] || ICONS['cloud'];
    return '<svg viewBox="0 0 100 100" class="w-icon">'+fn()+'</svg>';
  }

  function getParams(){
    var p = new URLSearchParams(window.location.search);
    var lat = parseFloat(p.get('lat')); if(!isFinite(lat)) lat = 52.52;
    var lon = parseFloat(p.get('lon')); if(!isFinite(lon)) lon = 13.405;
    var name = p.get('name') || 'Berlin';
    var dateStr = p.get('date');
    if(!dateStr || !/^\d{4}-\d{2}-\d{2}$/.test(dateStr)){
      dateStr = new Date().toISOString().slice(0,10);
    }
    return {lat:lat, lon:lon, name:name, dateStr:dateStr};
  }

  function formatDate(dateStr){
    var d = new Date(dateStr+'T00:00:00Z');
    return d.toLocaleDateString('en-US', {weekday:'long', year:'numeric', month:'long', day:'numeric', timeZone:'UTC'});
  }
  function formatHour(h){
    var period = h<12 ? 'AM':'PM';
    var hh = h%12; if(hh===0) hh=12;
    return hh+' '+period;
  }

  function renderChart(temps, times){
    var svg = document.getElementById('hourlyChart');
    var W=1000,H=150,padX=16,padY=16;
    var min = Math.min.apply(null, temps), max = Math.max.apply(null, temps);
    var range = (max-min) || 1;
    var n = temps.length;
    var stepX = (W-padX*2)/((n>1?n-1:1));
    var pts = [];
    for(var i=0;i<n;i++){
      var x = padX+i*stepX;
      var y = padY+(H-padY*2)*(1-(temps[i]-min)/range);
      pts.push([x,y]);
    }
    var line = pts.map(function(p,i){ return (i?'L':'M')+p[0].toFixed(1)+','+p[1].toFixed(1); }).join(' ');
    var area = line+' L'+pts[n-1][0].toFixed(1)+','+(H-padY)+' L'+pts[0][0].toFixed(1)+','+(H-padY)+' Z';
    var dots = pts.map(function(p,i){
      var hh = times && times[i] ? times[i].slice(11,16) : '';
      return '<circle cx="'+p[0].toFixed(1)+'" cy="'+p[1].toFixed(1)+'" r="4" class="pt"><title>'+hh+' — '+Math.round(temps[i])+'°C</title></circle>';
    }).join('');
    svg.innerHTML =
      '<defs><linearGradient id="areaFill" x1="0" y1="0" x2="0" y2="1">'+
      '<stop offset="0%" stop-color="currentColor" stop-opacity="0.45"/>'+
      '<stop offset="100%" stop-color="currentColor" stop-opacity="0"/>'+
      '</linearGradient></defs>'+
      '<path d="'+area+'" fill="url(#areaFill)" stroke="none"/>'+
      '<path d="'+line+'" fill="none" stroke="currentColor" stroke-width="3.5" stroke-linecap="round" stroke-linejoin="round"/>'+
      dots;

    var labelsEl = document.getElementById('hourLabels');
    labelsEl.innerHTML = '';
    if(times){
      var idxs = [0,3,6,9,12,15,18,21].filter(function(i){ return i<times.length; });
      idxs.forEach(function(i){
        var span = document.createElement('span');
        var hr = parseInt(times[i].slice(11,13),10);
        span.textContent = formatHour(hr);
        labelsEl.appendChild(span);
      });
    }
  }

  function showError(msg){
    var status = document.getElementById('status');
    status.hidden = false;
    status.textContent = msg || 'Weather data is unavailable right now. Please try again later.';
    document.getElementById('mainContent').hidden = true;
  }

  function renderWeather(params, data){
    var daily = data.daily, hourly = data.hourly;
    var tmax = daily.temperature_2m_max[0];
    var tmin = daily.temperature_2m_min[0];
    var code = daily.weather_code[0];
    var entry = WMO[code] || ['Unknown','cloud'];
    var label = entry[0], key = entry[1];

    document.body.setAttribute('data-theme', key);
    document.getElementById('locationName').textContent = params.name;
    document.getElementById('dateLabel').textContent = formatDate(params.dateStr);
    document.getElementById('tempMax').textContent = Math.round(tmax)+'°';
    document.getElementById('tempMin').textContent = Math.round(tmin)+'°';
    document.getElementById('conditionLabel').textContent = label;
    document.getElementById('iconWrap').innerHTML = buildIconSvg(key);
    document.getElementById('coordsLabel').textContent = params.lat.toFixed(2)+', '+params.lon.toFixed(2);
    renderChart(hourly.temperature_2m, hourly.time);

    document.getElementById('status').hidden = true;
    document.getElementById('mainContent').hidden = false;
    document.title = 'Weather — '+params.name;
  }

  async function loadWeather(){
    var params = getParams();
    document.title = 'Weather — '+params.name;
    try{
      var todayStr = new Date().toISOString().slice(0,10);
      var endpoint = params.dateStr >= todayStr ? '/api/om/forecast' : '/api/om/archive';
      var qs = new URLSearchParams({
        latitude: params.lat,
        longitude: params.lon,
        daily: 'temperature_2m_max,temperature_2m_min,weather_code',
        hourly: 'temperature_2m',
        timezone: 'UTC',
        temperature_unit: 'celsius',
        start_date: params.dateStr,
        end_date: params.dateStr
      });
      var res = await fetch(endpoint+'?'+qs.toString());
      if(!res.ok) throw new Error('Request failed with status '+res.status);
      var data = await res.json();
      if(!data || !data.daily || !data.hourly ||
         !Array.isArray(data.daily.temperature_2m_max) || !data.daily.temperature_2m_max.length ||
         !Array.isArray(data.daily.temperature_2m_min) || !data.daily.temperature_2m_min.length ||
         !Array.isArray(data.daily.weather_code) || !data.daily.weather_code.length ||
         !Array.isArray(data.hourly.temperature_2m) || !data.hourly.temperature_2m.length){
        throw new Error('Incomplete weather data received');
      }
      renderWeather(params, data);
    }catch(err){
      console.error(err);
      showError();
    }
  }

  loadWeather();
})();
</script>
</body>
</html>

L1 — cheap deterministic descriptors

bytes total13,733html / css / js1,568 / 3,832 / 8,333
dom nodes32dom depth9
css rules40js presentyes
brightness119.1contrast20.3
colorfulness22.2whitespace57.9%

This slot's telemetry

prompt tokens6completion tokens94,719
total tokens94,725wall952.9 s
cost—request id—
config.json575 B
{
  "N": 2,
  "auth": {
    "credential_ref": "WCB_NONE",
    "method": "oauth-login"
  },
  "billing": "plan",
  "config_id": "claude-sonnet-5-eff-max--cli--claude-code--dev",
  "effort": "max",
  "family": "claude",
  "m": {
    "min": 2,
    "q": 1
  },
  "model_id": "claude-sonnet-5",
  "protocol": "cli",
  "served_model": "claude-sonnet-5",
  "telemetry": {
    "completion_tokens": 170417,
    "cost_usd": null,
    "prompt_tokens": 28,
    "total_tokens": 170445,
    "wall_ms": 1659147
  },
  "transport": "claude-code-cli-headless",
  "vendor_sanction_ref": null
}
send-log2.5 KB
{
  "N": 2,
  "batch_id": "2026-07-17--dev-cc-sonnet5",
  "config_id": "claude-sonnet-5-eff-max--cli--claude-code--dev",
  "positions": [
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-17T14:01:07.923517+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T13:53:00.603624+00:00"
        }
      ],
      "block_index": 0,
      "model_reaching_attempt_index": 0,
      "slot_index": 0,
      "terminal_state": "valid",
      "variant": "P-min"
    },
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-17T14:17:04.365458+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T14:01:11.501711+00:00"
        }
      ],
      "block_index": 0,
      "model_reaching_attempt_index": 0,
      "slot_index": 0,
      "terminal_state": "valid",
      "variant": "P-q"
    },
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-17T14:42:08.301143+00:00",
          "http_status": null,
          "outcome": "infra-failed",
          "reached_model": true,
          "reason": "mid-stream-death",
          "request_id": null,
          "started_at": "2026-07-17T14:17:08.297387+00:00"
        }
      ],
      "block_index": 1,
      "model_reaching_attempt_index": 0,
      "slot_index": 1,
      "terminal_state": "infra-failed",
      "variant": "P-q"
    },
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-17T14:45:47.287303+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T14:42:08.305313+00:00"
        }
      ],
      "block_index": 1,
      "model_reaching_attempt_index": 0,
      "slot_index": 1,
      "terminal_state": "valid",
      "variant": "P-min"
    }
  ],
  "retry_policy": {
    "max_unreachable_retries": 5,
    "rate_limit_backoff": {
      "max_attempts": 4,
      "max_total_ms": 60000
    }
  }
}