claude-sonnet-5 @ low · kiro

kirolow
config
claude-sonnet-5-eff-low--cli--kiro--dev
batch
2026-07-19--unified
transport
kiro-cli-isolated-home-github-social
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 @low · kiro 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
claude-sonnet-4-6 @max · kiro0.64gpt-5.6-sol @xhigh · codex-oauth0.64qwen3.7-max · qoder0.64minimax-m2.5 · kiro0.63claude-opus-4-6 @medium · kiro0.61
farthest
qwen3.5-plus · go0.45minimax-m2.1 · kiro0.45hy3-free · api0.45minimax-m2.5 · go0.47mimo-v2.5-pro · opencode0.47

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 tempmatchshown: 25
  • min tempmatchshown: 16
  • hourlymatchcoverage 24/24 · 24 match · 0 mismatch · 0 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">
<title>Weather Card</title>
<style>
  :root {
    --card-w: 420px;
  }
  * { box-sizing: border-box; }
  html, body {
    margin: 0;
    padding: 0;
    width: 1280px;
    height: 800px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background: radial-gradient(1200px 800px at 20% 10%, #2b3a67 0%, #16213e 45%, #0d1224 100%);
    color: #f4f6fb;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }

  .backdrop {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
  }
  .blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.35;
  }
  .blob.a { width: 520px; height: 520px; background: #5b7cff; top: -180px; left: -120px; }
  .blob.b { width: 460px; height: 460px; background: #ff8a65; top: 420px; right: -140px; opacity: 0.18; }
  .blob.c { width: 360px; height: 360px; background: #29d3c8; bottom: -160px; left: 40%; opacity: 0.2; }

  .card {
    position: relative;
    z-index: 1;
    width: var(--card-w);
    min-height: 620px;
    background: linear-gradient(160deg, rgba(255,255,255,0.10), rgba(255,255,255,0.03));
    border: 1px solid rgba(255,255,255,0.14);
    border-radius: 28px;
    padding: 32px 32px 28px;
    box-shadow: 0 30px 60px -20px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.03) inset;
    backdrop-filter: blur(18px);
    display: flex;
    flex-direction: column;
  }

  .top-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 6px;
  }
  .location {
    font-size: 26px;
    font-weight: 600;
    letter-spacing: 0.2px;
  }
  .date {
    font-size: 14px;
    color: rgba(244,246,251,0.65);
    margin-top: 4px;
  }
  .icon-badge {
    font-size: 46px;
    line-height: 1;
    filter: drop-shadow(0 6px 10px rgba(0,0,0,0.35));
  }

  .main-temp-row {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin: 18px 0 2px;
  }
  .temp-max {
    font-size: 72px;
    font-weight: 700;
    letter-spacing: -2px;
  }
  .temp-unit {
    font-size: 30px;
    font-weight: 500;
    color: rgba(244,246,251,0.75);
  }
  .condition {
    font-size: 17px;
    color: rgba(244,246,251,0.85);
    margin-bottom: 2px;
  }

  .minmax-row {
    display: flex;
    gap: 18px;
    margin-top: 14px;
    margin-bottom: 22px;
  }
  .pill {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 14px;
    padding: 10px 14px;
    font-size: 14px;
    flex: 1;
  }
  .pill .label {
    color: rgba(244,246,251,0.6);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.6px;
  }
  .pill .val {
    font-size: 18px;
    font-weight: 600;
    margin-left: auto;
  }
  .pill.hi .val { color: #ff9e6d; }
  .pill.lo .val { color: #7ec8ff; }

  .divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.18), transparent);
    margin: 4px 0 18px;
  }

  .hourly-title {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(244,246,251,0.55);
    margin-bottom: 12px;
  }

  .hourly-scroll {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 8px;
    scrollbar-width: thin;
  }
  .hourly-scroll::-webkit-scrollbar { height: 6px; }
  .hourly-scroll::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.2);
    border-radius: 4px;
  }

  .hour-item {
    flex: 0 0 auto;
    width: 58px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 12px;
    padding: 10px 6px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
  }
  .hour-item .hr {
    font-size: 12px;
    color: rgba(244,246,251,0.6);
  }
  .hour-item .htemp {
    font-size: 15px;
    font-weight: 600;
  }
  .hour-item.now {
    background: rgba(91,124,255,0.25);
    border-color: rgba(91,124,255,0.5);
  }

  .status {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 20px;
  }
  .status .spinner {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 3px solid rgba(255,255,255,0.2);
    border-top-color: #7ec8ff;
    animation: spin 0.9s linear infinite;
    margin: 0 auto 16px;
  }
  @keyframes spin { to { transform: rotate(360deg); } }
  .status .msg {
    font-size: 15px;
    color: rgba(244,246,251,0.75);
    line-height: 1.5;
  }
  .status.error .msg {
    color: #ffb4a8;
  }
  .status .err-title {
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #ffb4a8;
  }

  .hidden { display: none !important; }

  .footer-note {
    margin-top: 18px;
    font-size: 11px;
    color: rgba(244,246,251,0.35);
    text-align: center;
  }
</style>
</head>
<body>

<div class="backdrop">
  <div class="blob a"></div>
  <div class="blob b"></div>
  <div class="blob c"></div>
</div>

<div class="card" id="card">

  <div id="statusView" class="status">
    <div>
      <div class="spinner"></div>
      <div class="msg">Loading weather…</div>
    </div>
  </div>

  <div id="contentView" class="hidden" style="display:flex; flex-direction:column; flex:1;">
    <div class="top-row">
      <div>
        <div class="location" id="locationName">—</div>
        <div class="date" id="dateLabel">—</div>
      </div>
      <div class="icon-badge" id="weatherIcon">—</div>
    </div>

    <div class="main-temp-row">
      <div class="temp-max" id="tempMax">—</div>
      <div class="temp-unit">°C</div>
    </div>
    <div class="condition" id="conditionText">—</div>

    <div class="minmax-row">
      <div class="pill hi">
        <span class="label">High</span>
        <span class="val" id="pillHigh">—</span>
      </div>
      <div class="pill lo">
        <span class="label">Low</span>
        <span class="val" id="pillLow">—</span>
      </div>
    </div>

    <div class="divider"></div>

    <div class="hourly-title">Hourly forecast</div>
    <div class="hourly-scroll" id="hourlyScroll"></div>

    <div class="footer-note">Data via Open-Meteo compatible API</div>
  </div>

</div>

<script>
(function () {
  "use strict";

  // ---- Weather code -> icon/label mapping (WMO codes used by Open-Meteo) ----
  var WMO = {
    0: ["Clear sky", "☀️"],
    1: ["Mainly clear", "🌤️"],
    2: ["Partly cloudy", "⛅"],
    3: ["Overcast", "☁️"],
    45: ["Fog", "🌫️"],
    48: ["Rime fog", "🌫️"],
    51: ["Light drizzle", "🌦️"],
    53: ["Drizzle", "🌦️"],
    55: ["Dense drizzle", "🌦️"],
    56: ["Freezing drizzle", "🌧️"],
    57: ["Freezing drizzle", "🌧️"],
    61: ["Light rain", "🌧️"],
    63: ["Rain", "🌧️"],
    65: ["Heavy rain", "🌧️"],
    66: ["Freezing rain", "🌧️"],
    67: ["Freezing rain", "🌧️"],
    71: ["Light snow", "🌨️"],
    73: ["Snow", "🌨️"],
    75: ["Heavy snow", "❄️"],
    77: ["Snow grains", "❄️"],
    80: ["Light showers", "🌦️"],
    81: ["Showers", "🌦️"],
    82: ["Violent showers", "⛈️"],
    85: ["Snow showers", "🌨️"],
    86: ["Snow showers", "🌨️"],
    95: ["Thunderstorm", "⛈️"],
    96: ["Thunderstorm w/ hail", "⛈️"],
    99: ["Thunderstorm w/ hail", "⛈️"]
  };

  function describeCode(code) {
    if (code === null || code === undefined || !WMO.hasOwnProperty(code)) {
      return ["Unknown", "❔"];
    }
    return WMO[code];
  }

  function pad(n) { return n < 10 ? "0" + n : "" + n; }

  function todayUTC() {
    var now = new Date();
    return now.getUTCFullYear() + "-" + pad(now.getUTCMonth() + 1) + "-" + pad(now.getUTCDate());
  }

  function getParams() {
    var qs = new URLSearchParams(window.location.search);
    var lat = parseFloat(qs.get("lat"));
    var lon = parseFloat(qs.get("lon"));
    var name = qs.get("name");
    var date = qs.get("date");

    if (isNaN(lat)) lat = 52.52;
    if (isNaN(lon)) lon = 13.405;
    if (!name) name = "Berlin";
    if (!date || !/^\d{4}-\d{2}-\d{2}$/.test(date)) date = todayUTC();

    return { lat: lat, lon: lon, name: name, date: date };
  }

  function isPastDate(dateStr) {
    return dateStr < todayUTC();
  }

  function formatDateLabel(dateStr) {
    var parts = dateStr.split("-").map(Number);
    var d = new Date(Date.UTC(parts[0], parts[1] - 1, parts[2]));
    var opts = { weekday: "long", year: "numeric", month: "long", day: "numeric", timeZone: "UTC" };
    try {
      return d.toLocaleDateString(undefined, opts);
    } catch (e) {
      return dateStr;
    }
  }

  function buildUrl(base, p) {
    var url = new URL(base, window.location.origin);
    url.searchParams.set("latitude", p.lat);
    url.searchParams.set("longitude", p.lon);
    url.searchParams.set("daily", "temperature_2m_max,temperature_2m_min,weather_code");
    url.searchParams.set("hourly", "temperature_2m");
    url.searchParams.set("timezone", "UTC");
    url.searchParams.set("temperature_unit", "celsius");
    url.searchParams.set("start_date", p.date);
    url.searchParams.set("end_date", p.date);
    return url.toString();
  }

  function showError(title, detail) {
    var statusView = document.getElementById("statusView");
    var contentView = document.getElementById("contentView");
    contentView.classList.add("hidden");
    statusView.classList.remove("hidden");
    statusView.classList.add("error");
    statusView.innerHTML =
      '<div>' +
        '<div class="err-title">⚠️ ' + title + '</div>' +
        '<div class="msg">' + detail + '</div>' +
      '</div>';
  }

  function round(n) {
    if (n === null || n === undefined || isNaN(n)) return "—";
    return Math.round(n);
  }

  function render(data, params) {
    var statusView = document.getElementById("statusView");
    var contentView = document.getElementById("contentView");

    var daily = data.daily || {};
    var hourly = data.hourly || {};

    var maxT = daily.temperature_2m_max ? daily.temperature_2m_max[0] : null;
    var minT = daily.temperature_2m_min ? daily.temperature_2m_min[0] : null;
    var code = daily.weather_code ? daily.weather_code[0] : null;

    if (maxT === null && minT === null && (!hourly.time || hourly.time.length === 0)) {
      showError("No data available", "The weather service did not return data for this location and date.");
      return;
    }

    var desc = describeCode(code);

    document.getElementById("locationName").textContent = params.name;
    document.getElementById("dateLabel").textContent = formatDateLabel(params.date);
    document.getElementById("weatherIcon").textContent = desc[1];
    document.getElementById("tempMax").textContent = round(maxT);
    document.getElementById("conditionText").textContent = desc[0];
    document.getElementById("pillHigh").textContent = round(maxT) + "°";
    document.getElementById("pillLow").textContent = round(minT) + "°";

    var hourlyScroll = document.getElementById("hourlyScroll");
    hourlyScroll.innerHTML = "";

    var times = hourly.time || [];
    var temps = hourly.temperature_2m || [];
    var currentHourUTC = new Date().getUTCHours();
    var isToday = params.date === todayUTC();

    for (var i = 0; i < times.length; i++) {
      var t = times[i];
      var hourNum = parseInt(t.slice(11, 13), 10);
      var item = document.createElement("div");
      item.className = "hour-item" + (isToday && hourNum === currentHourUTC ? " now" : "");

      var hrLabel = document.createElement("div");
      hrLabel.className = "hr";
      hrLabel.textContent = pad(hourNum) + ":00";

      var tempLabel = document.createElement("div");
      tempLabel.className = "htemp";
      tempLabel.textContent = round(temps[i]) + "°";

      item.appendChild(hrLabel);
      item.appendChild(tempLabel);
      hourlyScroll.appendChild(item);
    }

    statusView.classList.add("hidden");
    contentView.classList.remove("hidden");
  }

  function load() {
    var params = getParams();
    var endpoint = isPastDate(params.date) ? "/api/om/archive" : "/api/om/forecast";
    var url = buildUrl(endpoint, params);

    fetch(url)
      .then(function (res) {
        if (!res.ok) {
          throw new Error("HTTP " + res.status);
        }
        return res.json();
      })
      .then(function (data) {
        if (data && data.error) {
          throw new Error(data.reason || "API returned an error");
        }
        render(data, params);
      })
      .catch(function (err) {
        showError(
          "Couldn't load weather data",
          "Please check your connection or try again later.<br>(" + (err && err.message ? err.message : "Unknown error") + ")"
        );
      });
  }

  load();
})();
</script>

</body>
</html>

L1 — cheap deterministic descriptors

bytes total12,945html / css / js1,502 / 4,900 / 6,543
dom nodes37dom depth7
css rules41js presentyes
brightness43.2contrast20.0
colorfulness32.2whitespace55.2%

This slot's telemetry

prompt tokens0completion tokens0
total tokens0wall55.4 s
cost—request id—
config.json577 B
{
  "N": 2,
  "auth": {
    "credential_ref": "WCB_NONE",
    "method": "oauth-login"
  },
  "billing": "plan",
  "config_id": "claude-sonnet-5-eff-low--cli--kiro--dev",
  "effort": "low",
  "family": "claude",
  "m": {
    "min": 2,
    "q": 2
  },
  "model_id": "claude-sonnet-5",
  "protocol": "cli",
  "served_model": "claude-sonnet-5",
  "telemetry": {
    "completion_tokens": null,
    "cost_usd": null,
    "prompt_tokens": null,
    "total_tokens": null,
    "wall_ms": 223632
  },
  "transport": "kiro-cli-isolated-home-github-social",
  "vendor_sanction_ref": null
}
send-log2.5 KB
{
  "N": 2,
  "batch_id": "2026-07-18--kiro-cli",
  "config_id": "claude-sonnet-5-eff-low--cli--kiro--dev",
  "positions": [
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-18T17:19:32.624204+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-18T17:18:37.249302+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-18T17:20:46.515555+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-18T17:19:36.650379+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-18T17:21:36.676065+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-18T17:20:50.316042+00:00"
        }
      ],
      "block_index": 1,
      "model_reaching_attempt_index": 0,
      "slot_index": 1,
      "terminal_state": "valid",
      "variant": "P-min"
    },
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-18T17:22:31.872414+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-18T17:21:39.767191+00:00"
        }
      ],
      "block_index": 1,
      "model_reaching_attempt_index": 0,
      "slot_index": 1,
      "terminal_state": "valid",
      "variant": "P-q"
    }
  ],
  "retry_policy": {
    "max_unreachable_retries": 5,
    "rate_limit_backoff": {
      "max_attempts": 4,
      "max_total_ms": 60000
    }
  }
}