gpt-5.5 @ xhigh · codex-oauth

codex-oauthxhigh

config: gpt-5.5-eff-xhigh--cli--codex-oauth--dev
batch: 2026-07-19--unified
transport: codex-cli-oauth-chatgpt
protocol: cli · plan
served model: gpt-5.5
captured: Jul 18, 2026, 11:54 AM · N=2

variant

live

slot 0 · P-q · sandboxed iframe

gpt-5.5 @xhigh · codex-oauth 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

gpt-5.5 @high · codex-oauth0.66 claude-fable-5 · CC0.63 deepseek-v4-flash-free · api0.61 gpt-5.5 @low · codex-oauth0.61 claude-opus-4-8 @high · CC0.59

farthest

gpt-5.4-mini @medium · codex-oauth0.38 gpt-5.4-mini @high · codex-oauth0.39 gpt-5.6-sol @low · kiro0.41 gpt-5.6-luna @high · codex-oauth0.41 minimax-m2.5 · go0.42

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">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Weather Card</title>
<style>
  :root {
    --ink: #172126;
    --muted: #66727a;
    --line: rgba(23, 33, 38, 0.12);
    --panel: rgba(255, 255, 255, 0.78);
    --panel-strong: rgba(255, 255, 255, 0.92);
    --shadow: 0 30px 80px rgba(33, 54, 63, 0.18);
    --blue: #5f95d8;
    --teal: #55b7b0;
    --amber: #f1b85b;
    --rose: #d87775;
  }

  * {
    box-sizing: border-box;
  }

  html,
  body {
    width: 100%;
    min-height: 100%;
    margin: 0;
  }

  body {
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--ink);
    background:
      radial-gradient(circle at 18% 18%, rgba(255, 228, 169, 0.92) 0, rgba(255, 228, 169, 0.32) 24%, transparent 44%),
      linear-gradient(135deg, #d7edf4 0%, #eef5ed 43%, #f9eadb 100%);
    overflow: hidden;
  }

  .page {
    width: 100vw;
    height: 100vh;
    min-width: 980px;
    min-height: 640px;
    display: grid;
    place-items: center;
    padding: 48px;
    position: relative;
  }

  .sky {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
  }

  .sun {
    width: 190px;
    height: 190px;
    border-radius: 50%;
    position: absolute;
    left: 112px;
    top: 82px;
    background: radial-gradient(circle, #fff4b7 0 34%, #ffd478 35% 62%, rgba(255, 188, 90, 0.12) 63% 100%);
    box-shadow: 0 0 70px rgba(246, 183, 82, 0.35);
  }

  .cloud {
    position: absolute;
    right: 150px;
    top: 112px;
    width: 260px;
    height: 82px;
    border-radius: 48px;
    background: rgba(255, 255, 255, 0.56);
    filter: blur(0.2px);
    box-shadow: 0 20px 55px rgba(113, 139, 153, 0.12);
  }

  .cloud:before,
  .cloud:after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: inherit;
  }

  .cloud:before {
    width: 116px;
    height: 116px;
    left: 42px;
    bottom: 22px;
  }

  .cloud:after {
    width: 146px;
    height: 146px;
    right: 36px;
    bottom: 14px;
  }

  .card {
    width: min(1080px, calc(100vw - 96px));
    min-height: 626px;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 28px;
    background: linear-gradient(145deg, rgba(255,255,255,0.72), rgba(255,255,255,0.52));
    box-shadow: var(--shadow);
    backdrop-filter: blur(26px);
    -webkit-backdrop-filter: blur(26px);
    display: grid;
    grid-template-columns: 405px 1fr;
    overflow: hidden;
    position: relative;
  }

  .summary {
    padding: 42px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background:
      linear-gradient(160deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.24)),
      radial-gradient(circle at 20% 18%, rgba(255, 199, 102, 0.25), transparent 40%);
    border-right: 1px solid var(--line);
  }

  .kicker {
    margin: 0 0 12px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }

  h1 {
    margin: 0;
    font-size: 48px;
    line-height: 1.02;
    letter-spacing: 0;
    max-width: 320px;
    overflow-wrap: anywhere;
  }

  .date {
    margin: 14px 0 0;
    color: var(--muted);
    font-size: 17px;
    font-weight: 600;
  }

  .visual {
    height: 190px;
    margin: 28px 0;
    position: relative;
  }

  .weather-mark {
    width: 180px;
    height: 180px;
    position: absolute;
    left: -6px;
    top: 4px;
  }

  .weather-mark svg {
    width: 100%;
    height: 100%;
    display: block;
  }

  .condition {
    margin: 0;
    color: #2a3a41;
    font-size: 24px;
    line-height: 1.2;
    font-weight: 760;
  }

  .temps {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 24px;
  }

  .temp-box {
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 18px;
    background: rgba(255,255,255,0.52);
  }

  .temp-box span {
    display: block;
    color: var(--muted);
    font-size: 13px;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: 0.08em;
  }

  .temp-box strong {
    display: block;
    margin-top: 9px;
    font-size: 34px;
    line-height: 1;
    letter-spacing: 0;
  }

  .details {
    padding: 42px;
    display: flex;
    flex-direction: column;
    min-width: 0;
  }

  .details-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 28px;
  }

  h2 {
    margin: 0;
    font-size: 26px;
    line-height: 1.1;
    letter-spacing: 0;
  }

  .meta {
    margin: 7px 0 0;
    color: var(--muted);
    font-size: 14px;
    font-weight: 650;
  }

  .badge {
    flex: 0 0 auto;
    border: 1px solid rgba(23, 33, 38, 0.13);
    border-radius: 999px;
    padding: 10px 14px;
    background: rgba(255,255,255,0.54);
    color: #33454d;
    font-size: 13px;
    font-weight: 780;
  }

  .hourly {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 12px;
    align-content: stretch;
  }

  .hour {
    min-width: 0;
    border: 1px solid rgba(23, 33, 38, 0.11);
    border-radius: 18px;
    background: rgba(255,255,255,0.56);
    display: grid;
    grid-template-rows: 26px 1fr 32px;
    justify-items: center;
    padding: 14px 8px 12px;
    position: relative;
    overflow: hidden;
  }

  .hour:before {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: var(--fill, 50%);
    background: linear-gradient(180deg, rgba(95, 149, 216, 0.08), rgba(85, 183, 176, 0.28));
  }

  .hour time,
  .hour strong,
  .bar {
    position: relative;
    z-index: 1;
  }

  .hour time {
    color: var(--muted);
    font-size: 12px;
    font-weight: 760;
  }

  .bar {
    width: 9px;
    height: 100%;
    border-radius: 999px;
    background: rgba(23, 33, 38, 0.08);
    align-self: stretch;
    overflow: hidden;
    display: flex;
    align-items: end;
  }

  .bar i {
    width: 100%;
    height: var(--fill, 50%);
    border-radius: inherit;
    background: linear-gradient(180deg, var(--amber), var(--rose));
    display: block;
  }

  .hour strong {
    color: #24343a;
    font-size: 15px;
    line-height: 1;
    align-self: end;
    white-space: nowrap;
  }

  .state {
    grid-column: 1 / -1;
    min-height: 370px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: rgba(255,255,255,0.58);
    display: grid;
    place-items: center;
    padding: 36px;
    text-align: center;
    color: var(--muted);
    font-size: 18px;
    font-weight: 650;
  }

  .hidden {
    display: none !important;
  }

  @media (max-width: 1050px) {
    body {
      overflow: auto;
    }

    .page {
      min-width: 0;
      height: auto;
      min-height: 100vh;
      padding: 24px;
    }

    .card {
      width: 100%;
      grid-template-columns: 1fr;
    }

    .summary {
      border-right: 0;
      border-bottom: 1px solid var(--line);
    }

    .hourly {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
</style>
</head>
<body>
  <main class="page">
    <div class="sky" aria-hidden="true">
      <div class="sun"></div>
      <div class="cloud"></div>
    </div>

    <section class="card" aria-live="polite">
      <div class="summary">
        <div>
          <p class="kicker">Weather</p>
          <h1 id="location">Berlin</h1>
          <p class="date" id="dateLabel"></p>
        </div>

        <div class="visual">
          <div class="weather-mark" id="weatherIcon" aria-hidden="true"></div>
        </div>

        <div>
          <p class="condition" id="condition">Loading weather...</p>
          <div class="temps">
            <div class="temp-box">
              <span>Max</span>
              <strong id="maxTemp">--</strong>
            </div>
            <div class="temp-box">
              <span>Min</span>
              <strong id="minTemp">--</strong>
            </div>
          </div>
        </div>
      </div>

      <div class="details">
        <div class="details-head">
          <div>
            <h2>Hourly temperatures</h2>
            <p class="meta" id="rangeMeta">UTC, Celsius</p>
          </div>
          <div class="badge" id="apiBadge">Same-origin weather API</div>
        </div>

        <div class="state" id="message">Loading weather data...</div>
        <div class="hourly hidden" id="hourly"></div>
      </div>
    </section>
  </main>

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

  var params = new URLSearchParams(window.location.search);
  var todayUtc = new Date().toISOString().slice(0, 10);
  var isoDatePattern = /^\d{4}-\d{2}-\d{2}$/;

  var lat = Number(params.get("lat"));
  var lon = Number(params.get("lon"));
  var name = (params.get("name") || "Berlin").trim() || "Berlin";
  var date = params.get("date") || todayUtc;

  if (!Number.isFinite(lat)) lat = 52.52;
  if (!Number.isFinite(lon)) lon = 13.405;
  if (!isoDatePattern.test(date)) date = todayUtc;

  var els = {
    location: document.getElementById("location"),
    dateLabel: document.getElementById("dateLabel"),
    condition: document.getElementById("condition"),
    maxTemp: document.getElementById("maxTemp"),
    minTemp: document.getElementById("minTemp"),
    weatherIcon: document.getElementById("weatherIcon"),
    hourly: document.getElementById("hourly"),
    message: document.getElementById("message"),
    apiBadge: document.getElementById("apiBadge")
  };

  els.location.textContent = name;
  els.dateLabel.textContent = formatDate(date);
  els.apiBadge.textContent = date < todayUtc ? "Archive weather" : "Forecast weather";
  els.weatherIcon.innerHTML = iconMarkup("loading");

  var endpoint = date < todayUtc ? "/api/om/archive" : "/api/om/forecast";
  var query = 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
  });

  fetch(endpoint + "?" + query.toString())
    .then(function (response) {
      if (!response.ok) throw new Error("Weather request failed");
      return response.json();
    })
    .then(renderWeather)
    .catch(showError);

  function renderWeather(data) {
    var daily = data && data.daily;
    var hourly = data && data.hourly;
    var max = daily && daily.temperature_2m_max && daily.temperature_2m_max[0];
    var min = daily && daily.temperature_2m_min && daily.temperature_2m_min[0];
    var code = daily && daily.weather_code && daily.weather_code[0];
    var times = hourly && hourly.time;
    var temps = hourly && hourly.temperature_2m;

    if (!Number.isFinite(Number(max)) || !Number.isFinite(Number(min)) || !Array.isArray(times) || !Array.isArray(temps)) {
      throw new Error("Weather data was incomplete");
    }

    var condition = weatherCondition(Number(code));
    var points = times.map(function (time, index) {
      return { time: time, temp: Number(temps[index]) };
    }).filter(function (point) {
      return point.time && point.time.slice(0, 10) === date && Number.isFinite(point.temp);
    });

    if (!points.length) throw new Error("No hourly temperatures were returned");

    els.message.classList.add("hidden");
    els.hourly.classList.remove("hidden");
    els.condition.textContent = condition.label;
    els.maxTemp.textContent = formatTemp(max);
    els.minTemp.textContent = formatTemp(min);
    els.weatherIcon.innerHTML = iconMarkup(condition.kind);

    var values = points.map(function (point) { return point.temp; });
    var low = Math.min.apply(null, values);
    var high = Math.max.apply(null, values);
    var span = Math.max(1, high - low);

    els.hourly.innerHTML = points.map(function (point) {
      var fill = 18 + ((point.temp - low) / span) * 72;
      return '<div class="hour" style="--fill:' + fill.toFixed(1) + '%">' +
        '<time>' + escapeHtml(hourLabel(point.time)) + '</time>' +
        '<div class="bar"><i style="--fill:' + fill.toFixed(1) + '%"></i></div>' +
        '<strong>' + escapeHtml(formatTemp(point.temp)) + '</strong>' +
      '</div>';
    }).join("");
  }

  function showError() {
    els.condition.textContent = "Weather unavailable";
    els.maxTemp.textContent = "--";
    els.minTemp.textContent = "--";
    els.weatherIcon.innerHTML = iconMarkup("error");
    els.hourly.classList.add("hidden");
    els.message.classList.remove("hidden");
    els.message.textContent = "Weather data could not be loaded for this location and date.";
  }

  function weatherCondition(code) {
    var map = {
      0: ["Clear sky", "sun"],
      1: ["Mainly clear", "sun"],
      2: ["Partly cloudy", "cloud"],
      3: ["Overcast", "cloud"],
      45: ["Fog", "fog"],
      48: ["Depositing rime fog", "fog"],
      51: ["Light drizzle", "rain"],
      53: ["Moderate drizzle", "rain"],
      55: ["Dense drizzle", "rain"],
      56: ["Freezing drizzle", "rain"],
      57: ["Freezing drizzle", "rain"],
      61: ["Slight rain", "rain"],
      63: ["Moderate rain", "rain"],
      65: ["Heavy rain", "rain"],
      66: ["Freezing rain", "rain"],
      67: ["Freezing rain", "rain"],
      71: ["Slight snow", "snow"],
      73: ["Moderate snow", "snow"],
      75: ["Heavy snow", "snow"],
      77: ["Snow grains", "snow"],
      80: ["Rain showers", "rain"],
      81: ["Rain showers", "rain"],
      82: ["Violent rain showers", "rain"],
      85: ["Snow showers", "snow"],
      86: ["Snow showers", "snow"],
      95: ["Thunderstorm", "storm"],
      96: ["Thunderstorm with hail", "storm"],
      99: ["Thunderstorm with hail", "storm"]
    };
    var found = map[code] || ["Unknown conditions", "cloud"];
    return { label: found[0], kind: found[1] };
  }

  function iconMarkup(kind) {
    var common = 'viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg"';
    if (kind === "sun" || kind === "loading") {
      return '<svg ' + common + '><circle cx="82" cy="82" r="42" fill="#F7BD55"/><circle cx="82" cy="82" r="27" fill="#FFE08A"/><g stroke="#F0A94A" stroke-width="8" stroke-linecap="round"><path d="M82 16v18"/><path d="M82 130v18"/><path d="M16 82h18"/><path d="M130 82h18"/><path d="m35 35 13 13"/><path d="m116 116 13 13"/><path d="m129 35-13 13"/><path d="m48 116-13 13"/></g></svg>';
    }
    if (kind === "rain") {
      return '<svg ' + common + '><path d="M55 116h72c20 0 35-14 35-32 0-17-14-31-32-31-7-25-28-40-53-35-20 4-35 20-39 39-16 3-28 15-28 30 0 17 16 29 45 29Z" fill="#FFFFFF" opacity=".86"/><path d="M57 130l-13 24M91 130l-13 24M126 130l-13 24" stroke="#5F95D8" stroke-width="8" stroke-linecap="round"/></svg>';
    }
    if (kind === "snow") {
      return '<svg ' + common + '><path d="M55 112h72c20 0 35-14 35-32 0-17-14-31-32-31-7-25-28-40-53-35-20 4-35 20-39 39-16 3-28 15-28 30 0 17 16 29 45 29Z" fill="#FFFFFF" opacity=".9"/><g stroke="#6DA5D8" stroke-width="6" stroke-linecap="round"><path d="M58 138h22M69 127v22M103 138h22M114 127v22"/></g></svg>';
    }
    if (kind === "storm") {
      return '<svg ' + common + '><path d="M55 108h72c20 0 35-14 35-32 0-17-14-31-32-31-7-25-28-40-53-35-20 4-35 20-39 39-16 3-28 15-28 30 0 17 16 29 45 29Z" fill="#EEF2F4" opacity=".92"/><path d="M92 104 70 143h24l-10 30 35-49H94l13-20H92Z" fill="#F1B85B"/></svg>';
    }
    if (kind === "fog") {
      return '<svg ' + common + '><path d="M55 94h72c20 0 35-14 35-32 0-17-14-31-32-31-7-25-28-40-53-35-20 4-35 20-39 39-16 3-28 15-28 30 0 17 16 29 45 29Z" fill="#FFFFFF" opacity=".82"/><g stroke="#7F8D94" stroke-width="7" stroke-linecap="round"><path d="M25 119h124"/><path d="M41 141h104"/><path d="M64 162h78"/></g></svg>';
    }
    if (kind === "error") {
      return '<svg ' + common + '><circle cx="90" cy="90" r="58" fill="#F4D7D5"/><path d="M67 67l46 46M113 67l-46 46" stroke="#B95C5B" stroke-width="10" stroke-linecap="round"/></svg>';
    }
    return '<svg ' + common + '><circle cx="62" cy="70" r="33" fill="#F7BD55"/><path d="M59 121h72c20 0 35-14 35-32 0-17-14-31-32-31-7-25-28-40-53-35-20 4-35 20-39 39-16 3-28 15-28 30 0 17 16 29 45 29Z" fill="#FFFFFF" opacity=".88"/></svg>';
  }

  function formatDate(value) {
    var parts = value.split("-").map(Number);
    var dt = new Date(Date.UTC(parts[0], parts[1] - 1, parts[2]));
    return new Intl.DateTimeFormat("en", {
      weekday: "long",
      month: "long",
      day: "numeric",
      year: "numeric",
      timeZone: "UTC"
    }).format(dt);
  }

  function hourLabel(value) {
    var hour = value.slice(11, 13);
    return hour + ":00";
  }

  function formatTemp(value) {
    var rounded = Math.round(Number(value));
    return (rounded > 0 ? rounded : String(rounded)) + "°";
  }

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

L1 — cheap deterministic descriptors

bytes total	17,031	html / css / js	1,587 / 6,920 / 8,524
dom nodes	37	dom depth	9
css rules	45	js present	yes
brightness	238.6	contrast	17.6
colorfulness	16.6	whitespace	94.8%

This slot's telemetry

prompt tokens	0	completion tokens	12,032
total tokens	0	wall	113.9 s
cost	—	request id	—

config.json549 B

{
  "N": 2,
  "auth": {
    "credential_ref": "WCB_NONE",
    "method": "oauth-login"
  },
  "billing": "plan",
  "config_id": "gpt-5.5-eff-xhigh--cli--codex-oauth--dev",
  "effort": "xhigh",
  "family": "gpt",
  "m": {
    "min": 2,
    "q": 2
  },
  "model_id": "gpt-5.5",
  "protocol": "cli",
  "served_model": "gpt-5.5",
  "telemetry": {
    "completion_tokens": 44357,
    "cost_usd": null,
    "prompt_tokens": null,
    "total_tokens": null,
    "wall_ms": 387778
  },
  "transport": "codex-cli-oauth-chatgpt",
  "vendor_sanction_ref": null
}

send-log2.5 KB

{
  "N": 2,
  "batch_id": "2026-07-17--dev-codex-oauth-gpt-5.5",
  "config_id": "gpt-5.5-eff-xhigh--cli--codex-oauth--dev",
  "positions": [
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-17T14:04:46.845835+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T14:03:23.753915+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:06:43.842877+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T14:04:49.900783+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:08:26.425023+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T14:06:47.548231+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-07-17T14:10:01.936448+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T14:08:30.060370+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
    }
  }
}