gpt-5.3-codex · cursor

cursor
config
gpt-5.3-codex--cli--cursor--dev
batch
2026-07-19--unified
transport
cursor-agent-cli-isolated-home
protocol
cli · plan
served model
gpt-5.3-codex
captured
Jul 18, 2026, 11:54 AM · N=2
variant
live
slot 0 · P-q · sandboxed iframe
gpt-5.3-codex · cursor P-q slot 0 screenshot

non-deterministic render — re-rendering the same input yields different pixels (random or time-dependent content), so the visual channels read this card less stably than the others.

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 neighborsNo similarity data for this session — this batch has no computed pairs.

Fidelity — does the card show the right data?

  • namematch
  • conditionmatch
  • datematch
  • max tempambiguousno-remaining-candidate
  • min tempmismatchshown: 25.3
  • 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=device-width, initial-scale=1" />
  <title>Weather Card</title>
  <style>
    :root {
      --bg-1: #0b1220;
      --bg-2: #101a2f;
      --card: rgba(12, 20, 36, 0.68);
      --card-border: rgba(255, 255, 255, 0.14);
      --text: #eaf2ff;
      --muted: #a6bad8;
      --accent: #7dc4ff;
      --accent-2: #8effcc;
      --danger: #ff8c9f;
      --shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
    }

    * { box-sizing: border-box; }

    html, body {
      width: 100%;
      height: 100%;
      margin: 0;
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
      color: var(--text);
      background: radial-gradient(1200px 500px at 12% 8%, #28477f66 0%, transparent 60%),
                  radial-gradient(900px 460px at 88% 92%, #2f9d8b55 0%, transparent 62%),
                  linear-gradient(160deg, var(--bg-1), var(--bg-2));
      overflow: hidden;
    }

    .stage {
      width: 100%;
      min-height: 100%;
      display: grid;
      place-items: center;
      padding: 28px;
      position: relative;
      isolation: isolate;
    }

    .aurora, .aurora::before, .aurora::after {
      content: "";
      position: absolute;
      inset: -20%;
      pointer-events: none;
      z-index: -1;
      filter: blur(50px);
      opacity: 0.45;
      animation: drift 22s ease-in-out infinite alternate;
      background:
        radial-gradient(42% 35% at 18% 30%, #4ea4ff88 0%, transparent 70%),
        radial-gradient(40% 30% at 82% 65%, #49ffc588 0%, transparent 70%),
        radial-gradient(28% 22% at 50% 50%, #93a0ff55 0%, transparent 74%);
    }
    .aurora::before { animation-duration: 30s; transform: rotate(16deg) scale(1.08); }
    .aurora::after { animation-duration: 26s; transform: rotate(-12deg) scale(0.96); }

    @keyframes drift {
      0% { transform: translate(-2%, -1%) scale(1); }
      100% { transform: translate(2%, 1.5%) scale(1.04); }
    }

    .card {
      width: min(1080px, 100%);
      min-height: min(690px, calc(100vh - 56px));
      border-radius: 28px;
      background: linear-gradient(165deg, rgba(255,255,255,0.09), rgba(255,255,255,0.02)) , var(--card);
      border: 1px solid var(--card-border);
      box-shadow: var(--shadow);
      backdrop-filter: blur(14px) saturate(140%);
      -webkit-backdrop-filter: blur(14px) saturate(140%);
      display: grid;
      grid-template-rows: auto auto 1fr;
      padding: 30px;
      gap: 24px;
      position: relative;
      overflow: hidden;
    }

    .card::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: 28px;
      pointer-events: none;
      background: linear-gradient(130deg, rgba(255,255,255,0.20), transparent 35%);
      mix-blend-mode: soft-light;
    }

    .top {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 12px;
      flex-wrap: wrap;
    }

    .title-wrap h1 {
      margin: 0;
      font-size: clamp(28px, 3.1vw, 42px);
      letter-spacing: 0.3px;
      line-height: 1.06;
      font-weight: 680;
    }

    .subtitle {
      margin-top: 8px;
      color: var(--muted);
      font-size: 16px;
      letter-spacing: 0.2px;
    }

    .badge {
      border: 1px solid rgba(255, 255, 255, 0.22);
      background: rgba(255,255,255,0.08);
      color: #d9ebff;
      border-radius: 999px;
      padding: 8px 14px;
      font-size: 13px;
      letter-spacing: 0.2px;
      white-space: nowrap;
    }

    .summary {
      display: grid;
      grid-template-columns: 1.15fr 1fr;
      gap: 18px;
      align-items: stretch;
    }

    .panel {
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.12);
      border-radius: 20px;
      padding: 18px 18px 16px;
      position: relative;
      overflow: hidden;
    }

    .condition {
      display: flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 12px;
    }

    .condition-icon {
      font-size: 38px;
      line-height: 1;
      filter: drop-shadow(0 8px 14px rgba(0,0,0,0.25));
    }

    .condition-text {
      font-size: 22px;
      font-weight: 620;
      letter-spacing: 0.2px;
    }

    .temp-main {
      display: flex;
      align-items: baseline;
      gap: 20px;
      margin-top: 2px;
    }

    .temp-max {
      font-size: clamp(44px, 5.3vw, 70px);
      line-height: 1;
      font-weight: 700;
      color: #f3fbff;
      text-shadow: 0 8px 28px rgba(125, 196, 255, 0.28);
    }

    .temp-min {
      font-size: 24px;
      color: #b5c7e6;
      font-weight: 560;
    }

    .meta {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      margin-top: 14px;
      color: #c3d4ed;
      font-size: 13px;
    }

    .kv {
      background: rgba(255,255,255,0.05);
      border-radius: 12px;
      padding: 10px;
      border: 1px solid rgba(255,255,255,0.08);
    }

    .kv .k {
      display: block;
      color: #9cb2d5;
      font-size: 11px;
      letter-spacing: 0.35px;
      text-transform: uppercase;
      margin-bottom: 4px;
    }

    .kv .v {
      display: block;
      font-size: 14px;
      color: #e4efff;
    }

    .chart-title {
      margin: 0 0 10px;
      font-size: 14px;
      color: #c7d8f3;
      letter-spacing: 0.2px;
    }

    .chart-wrap {
      height: 180px;
      border-radius: 14px;
      background: linear-gradient(180deg, rgba(125,196,255,0.10), rgba(255,255,255,0.02));
      border: 1px solid rgba(255,255,255,0.10);
      padding: 10px 10px 6px;
    }

    .chart-wrap svg {
      width: 100%;
      height: 100%;
      display: block;
    }

    .hours {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(86px, 1fr));
      gap: 10px;
      align-content: start;
    }

    .hour {
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.11);
      border-radius: 12px;
      padding: 9px 8px;
      text-align: center;
      min-height: 64px;
    }

    .hour-time {
      color: #b4c8e7;
      font-size: 12px;
      margin-bottom: 6px;
      letter-spacing: 0.2px;
    }

    .hour-temp {
      font-size: 18px;
      font-weight: 650;
      color: #f2f8ff;
      line-height: 1.1;
    }

    .status {
      margin: auto;
      text-align: center;
      font-size: 18px;
      color: #d2e5ff;
      padding: 28px;
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.12);
      border-radius: 16px;
    }

    .status.error {
      color: #ffd3db;
      border-color: #ff9fb033;
      background: #ff8c9f12;
    }

    .footer-note {
      color: #9db5d8;
      font-size: 12px;
      letter-spacing: 0.2px;
      margin-top: 2px;
      text-align: right;
    }

    @media (max-width: 980px) {
      .card { min-height: auto; }
      .summary { grid-template-columns: 1fr; }
      .chart-wrap { height: 160px; }
    }
  </style>
</head>
<body>
  <div class="stage">
    <div class="aurora"></div>
    <main class="card" id="card">
      <div class="status" id="status">Loading weather data...</div>
    </main>
  </div>

  <script>
    (function () {
      const DEFAULTS = {
        lat: 52.52,
        lon: 13.405,
        name: "Berlin"
      };

      function utcTodayYMD() {
        return new Date().toISOString().slice(0, 10);
      }

      function isValidDateYMD(value) {
        if (!/^\d{4}-\d{2}-\d{2}$/.test(value || "")) return false;
        const dt = new Date(value + "T00:00:00Z");
        return !Number.isNaN(dt.getTime()) && dt.toISOString().slice(0, 10) === value;
      }

      function toNum(value, fallback) {
        const n = parseFloat(value);
        return Number.isFinite(n) ? n : fallback;
      }

      function weatherFromCode(code) {
        const table = {
          0: { text: "Clear sky", icon: "☀️" },
          1: { text: "Mainly clear", icon: "🌤️" },
          2: { text: "Partly cloudy", icon: "⛅" },
          3: { text: "Overcast", icon: "☁️" },
          45: { text: "Fog", icon: "🌫️" },
          48: { text: "Rime fog", icon: "🌫️" },
          51: { text: "Light drizzle", icon: "🌦️" },
          53: { text: "Drizzle", icon: "🌦️" },
          55: { text: "Dense drizzle", icon: "🌧️" },
          56: { text: "Freezing drizzle", icon: "🌧️" },
          57: { text: "Freezing drizzle", icon: "🌧️" },
          61: { text: "Slight rain", icon: "🌦️" },
          63: { text: "Rain", icon: "🌧️" },
          65: { text: "Heavy rain", icon: "🌧️" },
          66: { text: "Freezing rain", icon: "🌧️" },
          67: { text: "Freezing rain", icon: "🌧️" },
          71: { text: "Slight snow", icon: "🌨️" },
          73: { text: "Snow", icon: "❄️" },
          75: { text: "Heavy snow", icon: "❄️" },
          77: { text: "Snow grains", icon: "❄️" },
          80: { text: "Rain showers", icon: "🌦️" },
          81: { text: "Rain showers", icon: "🌧️" },
          82: { text: "Violent showers", icon: "⛈️" },
          85: { text: "Snow showers", icon: "🌨️" },
          86: { text: "Heavy snow showers", icon: "🌨️" },
          95: { text: "Thunderstorm", icon: "⛈️" },
          96: { text: "Thunderstorm hail", icon: "⛈️" },
          99: { text: "Thunderstorm hail", icon: "⛈️" }
        };
        return table[code] || { text: "Unknown conditions", icon: "🌡️" };
      }

      function fmtDateLongUTC(ymd) {
        const d = new Date(ymd + "T00:00:00Z");
        return new Intl.DateTimeFormat("en-US", {
          weekday: "long",
          year: "numeric",
          month: "long",
          day: "numeric",
          timeZone: "UTC"
        }).format(d);
      }

      function fmtTemp(v) {
        if (!Number.isFinite(v)) return "—";
        const rounded = Math.round(v * 10) / 10;
        return (Object.is(rounded, -0) ? 0 : rounded).toString();
      }

      function hourLabel(iso) {
        const t = String(iso).split("T")[1] || "";
        const hh = t.slice(0, 2);
        return /^\d{2}$/.test(hh) ? hh + ":00" : "--:--";
      }

      function pathFromTemps(temps, width, height, pad) {
        if (!temps.length) return "";
        const min = Math.min.apply(null, temps);
        const max = Math.max.apply(null, temps);
        const span = max - min || 1;
        const xStep = (width - pad * 2) / Math.max(temps.length - 1, 1);
        return temps.map(function (v, i) {
          const x = pad + i * xStep;
          const y = pad + (height - pad * 2) * (1 - (v - min) / span);
          return (i === 0 ? "M" : "L") + x.toFixed(2) + " " + y.toFixed(2);
        }).join(" ");
      }

      function areaFromLinePath(linePath, temps, width, height, pad) {
        if (!temps.length || !linePath) return "";
        const xStep = (width - pad * 2) / Math.max(temps.length - 1, 1);
        const firstX = pad;
        const lastX = pad + xStep * (temps.length - 1);
        return linePath + " L " + lastX.toFixed(2) + " " + (height - pad).toFixed(2) +
          " L " + firstX.toFixed(2) + " " + (height - pad).toFixed(2) + " Z";
      }

      function escapeHtml(s) {
        return String(s).replace(/[&<>"']/g, function (c) {
          return ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[c];
        });
      }

      function renderError(message) {
        const card = document.getElementById("card");
        card.innerHTML = '<div class="status error">' + escapeHtml(message || "Could not load weather data.") + "</div>";
      }

      async function run() {
        const q = new URLSearchParams(location.search);
        const lat = toNum(q.get("lat"), DEFAULTS.lat);
        const lon = toNum(q.get("lon"), DEFAULTS.lon);
        const name = (q.get("name") || DEFAULTS.name).trim() || DEFAULTS.name;
        const todayUTC = utcTodayYMD();
        const reqDateRaw = q.get("date");
        const date = isValidDateYMD(reqDateRaw) ? reqDateRaw : todayUTC;

        const endpoint = date < todayUTC ? "/api/om/archive" : "/api/om/forecast";
        const params = new URLSearchParams({
          latitude: String(lat),
          longitude: String(lon),
          daily: "temperature_2m_max,temperature_2m_min,weather_code",
          hourly: "temperature_2m",
          timezone: "UTC",
          temperature_unit: "celsius",
          start_date: date,
          end_date: date
        });

        let data;
        try {
          const res = await fetch(endpoint + "?" + params.toString(), { method: "GET" });
          if (!res.ok) throw new Error("HTTP " + res.status);
          data = await res.json();
        } catch (e) {
          renderError("Could not load weather data.");
          return;
        }

        try {
          const daily = data.daily || {};
          const max = Number(daily.temperature_2m_max && daily.temperature_2m_max[0]);
          const min = Number(daily.temperature_2m_min && daily.temperature_2m_min[0]);
          const code = Number(daily.weather_code && daily.weather_code[0]);

          const hourly = data.hourly || {};
          const times = Array.isArray(hourly.time) ? hourly.time : [];
          const tempsRaw = Array.isArray(hourly.temperature_2m) ? hourly.temperature_2m : [];

          const paired = [];
          for (let i = 0; i < Math.min(times.length, tempsRaw.length); i += 1) {
            const t = String(times[i] || "");
            if (t.slice(0, 10) !== date) continue;
            const tv = Number(tempsRaw[i]);
            if (!Number.isFinite(tv)) continue;
            paired.push({ time: t, temp: tv });
          }

          if (!Number.isFinite(max) || !Number.isFinite(min) || !Number.isFinite(code) || paired.length === 0) {
            throw new Error("Missing required weather data");
          }

          const weather = weatherFromCode(code);
          const tempSeries = paired.map(function (p) { return p.temp; });
          const svgW = 560, svgH = 170, pad = 10;
          const linePath = pathFromTemps(tempSeries, svgW, svgH, pad);
          const areaPath = areaFromLinePath(linePath, tempSeries, svgW, svgH, pad);

          const hoursHtml = paired.map(function (p) {
            return (
              '<div class="hour">' +
                '<div class="hour-time">' + escapeHtml(hourLabel(p.time)) + "</div>" +
                '<div class="hour-temp">' + escapeHtml(fmtTemp(p.temp)) + "&deg;C</div>" +
              "</div>"
            );
          }).join("");

          const card = document.getElementById("card");
          card.innerHTML =
            '<section class="top">' +
              '<div class="title-wrap">' +
                "<h1>" + escapeHtml(name) + "</h1>" +
                '<div class="subtitle">' + escapeHtml(fmtDateLongUTC(date)) + " (UTC)</div>" +
              "</div>" +
              '<div class="badge">Weather Card</div>' +
            "</section>" +

            '<section class="summary">' +
              '<article class="panel">' +
                '<div class="condition">' +
                  '<div class="condition-icon" aria-hidden="true">' + weather.icon + "</div>" +
                  '<div class="condition-text">' + escapeHtml(weather.text) + "</div>" +
                "</div>" +
                '<div class="temp-main">' +
                  '<div class="temp-max">' + escapeHtml(fmtTemp(max)) + "&deg;C</div>" +
                  '<div class="temp-min">Min ' + escapeHtml(fmtTemp(min)) + "&deg;C</div>" +
                "</div>" +
                '<div class="meta">' +
                  '<div class="kv"><span class="k">Latitude</span><span class="v">' + escapeHtml(String(lat)) + "</span></div>" +
                  '<div class="kv"><span class="k">Longitude</span><span class="v">' + escapeHtml(String(lon)) + "</span></div>" +
                  '<div class="kv"><span class="k">Weather Code</span><span class="v">' + escapeHtml(String(code)) + "</span></div>" +
                  '<div class="kv"><span class="k">Temp Unit</span><span class="v">&deg;C</span></div>' +
                "</div>" +
              "</article>" +

              '<article class="panel">' +
                '<h2 class="chart-title">Hourly Temperature Trend</h2>' +
                '<div class="chart-wrap">' +
                  '<svg viewBox="0 0 560 170" role="img" aria-label="Hourly temperature chart">' +
                    '<defs>' +
                      '<linearGradient id="lineGlow" x1="0" x2="0" y1="0" y2="1">' +
                        '<stop offset="0%" stop-color="#8effcc"/>' +
                        '<stop offset="100%" stop-color="#7dc4ff"/>' +
                      "</linearGradient>" +
                      '<linearGradient id="areaFill" x1="0" x2="0" y1="0" y2="1">' +
                        '<stop offset="0%" stop-color="#7dc4ff66"/>' +
                        '<stop offset="100%" stop-color="#7dc4ff06"/>' +
                      "</linearGradient>" +
                    "</defs>" +
                    '<path d="' + areaPath + '" fill="url(#areaFill)"></path>' +
                    '<path d="' + linePath + '" fill="none" stroke="url(#lineGlow)" stroke-width="3.2" stroke-linecap="round" stroke-linejoin="round"></path>' +
                  "</svg>" +
                "</div>" +
              "</article>" +
            "</section>" +

            '<section class="hours">' + hoursHtml + "</section>" +
            '<div class="footer-note">Source: ' + escapeHtml(endpoint) + " | UTC day only</div>";
        } catch (e) {
          renderError("Could not load weather data.");
        }
      }

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

L1 — cheap deterministic descriptors

bytes total17,747html / css / js415 / 6,826 / 10,506
dom nodes12dom depth5
css rules42js presentyes
brightness50.3contrast24.9
colorfulness21.6whitespace45.7%

This slot's telemetry

prompt tokens1,929completion tokens5,950
total tokens7,879wall53.3 s
costrequest id
config.json558 B
{
  "N": 2,
  "auth": {
    "credential_ref": "WCB_NONE",
    "method": "oauth-login"
  },
  "billing": "plan",
  "config_id": "gpt-5.3-codex--cli--cursor--dev",
  "effort": null,
  "family": "gpt",
  "m": {
    "min": 2,
    "q": 2
  },
  "model_id": "gpt-5.3-codex",
  "protocol": "cli",
  "served_model": "gpt-5.3-codex",
  "telemetry": {
    "completion_tokens": 17879,
    "cost_usd": null,
    "prompt_tokens": 49172,
    "total_tokens": 67051,
    "wall_ms": 169739
  },
  "transport": "cursor-agent-cli-isolated-home",
  "vendor_sanction_ref": null
}
send-log2.5 KB
{
  "N": 2,
  "batch_id": "2026-08-13--cursor-s1",
  "config_id": "gpt-5.3-codex--cli--cursor--dev",
  "positions": [
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-08-12T16:54:16.504169+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-12T16:53:38.829120+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-08-12T16:55:15.147460+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-12T16:54:21.823771+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-08-12T16:56:03.707971+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-12T16:55:19.908573+00:00"
        }
      ],
      "block_index": 1,
      "model_reaching_attempt_index": 0,
      "slot_index": 1,
      "terminal_state": "valid",
      "variant": "P-q"
    },
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-08-12T16:56:42.021888+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-12T16:56:07.070188+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
    }
  }
}