gpt-5.5 @ high · codex-oauth
codex-oauthhigh
- config
- gpt-5.5-eff-high--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

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 @xhigh · codex-oauth0.66kimi-k3 · opencode0.63claude-opus-4-8 @high · CC0.59claude-sonnet-5 @low · CC0.59gpt-5.5 @medium · codex-oauth0.59farthest
qwen3.6-plus · go0.42kimi-k3 · go0.42deepseek-v4-flash @high · api0.42qwen3.6-plus · opencode0.44grok-4.3 · api0.44within 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
- hourlymismatchcoverage 1/24 · 1 match · 1 mismatch · 22 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: #17212b;
--muted: #65717f;
--panel: rgba(255,255,255,.82);
--line: rgba(23,33,43,.12);
--teal: #0f8b8d;
--coral: #f25f5c;
--gold: #f5b841;
--mint: #7fc8a9;
}
* { box-sizing: border-box; }
body {
margin: 0;
min-height: 100vh;
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
color: var(--ink);
background:
radial-gradient(circle at 16% 18%, rgba(245,184,65,.40), transparent 28%),
radial-gradient(circle at 82% 14%, rgba(15,139,141,.35), transparent 30%),
radial-gradient(circle at 76% 82%, rgba(242,95,92,.24), transparent 34%),
linear-gradient(135deg, #f9f4e8 0%, #d9f0eb 45%, #f8d8c9 100%);
display: grid;
place-items: center;
overflow: hidden;
}
.scene {
width: 1280px;
height: 800px;
padding: 56px;
position: relative;
}
.scene:before {
content: "";
position: absolute;
inset: 32px;
border: 1px solid rgba(255,255,255,.55);
border-radius: 28px;
pointer-events: none;
}
.card {
width: 100%;
height: 100%;
border-radius: 28px;
background: var(--panel);
border: 1px solid rgba(255,255,255,.72);
box-shadow: 0 28px 90px rgba(28,42,54,.20);
backdrop-filter: blur(22px);
display: grid;
grid-template-columns: 420px 1fr;
overflow: hidden;
}
.hero {
position: relative;
padding: 46px;
background:
linear-gradient(160deg, rgba(15,139,141,.92), rgba(20,122,117,.78) 46%, rgba(242,95,92,.70)),
radial-gradient(circle at 40% 22%, rgba(255,255,255,.35), transparent 26%);
color: white;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.weather-art {
position: absolute;
inset: 0;
overflow: hidden;
opacity: .95;
}
.sun {
position: absolute;
width: 158px;
height: 158px;
border-radius: 50%;
right: 44px;
top: 52px;
background: radial-gradient(circle, #ffe6a3 0 42%, #f5b841 43% 70%, rgba(245,184,65,0) 71%);
box-shadow: 0 0 70px rgba(255,230,163,.55);
}
.cloud {
position: absolute;
left: 42px;
top: 168px;
width: 240px;
height: 86px;
border-radius: 999px;
background: rgba(255,255,255,.78);
box-shadow: 80px 46px 0 -8px rgba(255,255,255,.38);
}
.cloud:before,
.cloud:after {
content: "";
position: absolute;
border-radius: 50%;
background: inherit;
}
.cloud:before {
width: 112px;
height: 112px;
left: 34px;
top: -54px;
}
.cloud:after {
width: 136px;
height: 136px;
left: 104px;
top: -74px;
}
.hero-content {
position: relative;
z-index: 1;
}
.eyebrow {
margin: 0 0 18px;
font-size: 13px;
font-weight: 800;
letter-spacing: .12em;
text-transform: uppercase;
opacity: .78;
}
h1 {
margin: 0;
max-width: 330px;
font-size: 54px;
line-height: .95;
letter-spacing: 0;
}
.date {
margin-top: 18px;
font-size: 19px;
opacity: .86;
}
.condition {
position: relative;
z-index: 1;
}
.condition-name {
font-size: 24px;
font-weight: 750;
margin-bottom: 14px;
}
.temp-pair {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 14px;
}
.temp-box {
border: 1px solid rgba(255,255,255,.35);
border-radius: 18px;
padding: 16px;
background: rgba(255,255,255,.16);
}
.temp-box span {
display: block;
font-size: 12px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: .10em;
opacity: .72;
}
.temp-box strong {
display: block;
margin-top: 6px;
font-size: 34px;
line-height: 1;
}
.details {
padding: 46px 48px 42px;
display: grid;
grid-template-rows: auto auto 1fr;
gap: 30px;
}
.topline {
display: flex;
justify-content: space-between;
gap: 24px;
align-items: start;
}
.summary h2 {
margin: 0;
font-size: 30px;
line-height: 1.1;
letter-spacing: 0;
}
.summary p {
margin: 10px 0 0;
color: var(--muted);
font-size: 16px;
}
.badge {
border: 1px solid var(--line);
border-radius: 999px;
padding: 10px 14px;
font-size: 14px;
color: #33404c;
background: rgba(255,255,255,.48);
white-space: nowrap;
}
.metrics {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 14px;
}
.metric {
min-height: 118px;
border-radius: 20px;
border: 1px solid var(--line);
background: rgba(255,255,255,.55);
padding: 20px;
}
.metric .label {
color: var(--muted);
font-size: 13px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: .08em;
}
.metric .value {
margin-top: 13px;
font-size: 34px;
font-weight: 780;
line-height: 1;
}
.hourly {
min-height: 0;
border-radius: 22px;
border: 1px solid var(--line);
background: rgba(255,255,255,.48);
padding: 22px 22px 18px;
display: grid;
grid-template-rows: auto 1fr;
gap: 16px;
}
.hourly-head {
display: flex;
align-items: baseline;
justify-content: space-between;
}
.hourly h3 {
margin: 0;
font-size: 19px;
}
.range {
color: var(--muted);
font-size: 14px;
}
.chart {
height: 280px;
display: grid;
grid-template-columns: repeat(24, minmax(18px, 1fr));
gap: 8px;
align-items: end;
padding-top: 8px;
}
.bar-wrap {
min-width: 0;
height: 100%;
display: grid;
grid-template-rows: 28px 1fr 22px;
gap: 8px;
align-items: end;
}
.bar-temp {
text-align: center;
font-size: 12px;
font-weight: 750;
color: #34414d;
white-space: nowrap;
}
.bar-track {
height: 100%;
display: flex;
align-items: end;
justify-content: center;
}
.bar {
width: 100%;
max-width: 25px;
min-height: 8px;
border-radius: 999px 999px 7px 7px;
background: linear-gradient(180deg, var(--coral), var(--gold) 52%, var(--teal));
box-shadow: 0 8px 18px rgba(15,139,141,.18);
}
.bar-hour {
text-align: center;
font-size: 11px;
color: var(--muted);
}
.state {
grid-column: 1 / -1;
display: grid;
place-items: center;
height: 100%;
text-align: center;
padding: 40px;
}
.state strong {
display: block;
font-size: 28px;
margin-bottom: 10px;
}
.state span {
color: var(--muted);
font-size: 16px;
}
</style>
</head>
<body>
<main class="scene">
<section class="card" aria-live="polite">
<aside class="hero">
<div class="weather-art" aria-hidden="true">
<div class="sun"></div>
<div class="cloud"></div>
</div>
<div class="hero-content">
<p class="eyebrow">Daily weather</p>
<h1 id="location">Berlin</h1>
<div class="date" id="dateLabel">Loading...</div>
</div>
<div class="condition">
<div class="condition-name" id="condition">Loading weather</div>
<div class="temp-pair">
<div class="temp-box">
<span>Maximum</span>
<strong id="maxTemp">--</strong>
</div>
<div class="temp-box">
<span>Minimum</span>
<strong id="minTemp">--</strong>
</div>
</div>
</div>
</aside>
<section class="details" id="details">
<div class="topline">
<div class="summary">
<h2 id="headline">Fetching forecast</h2>
<p id="subhead">Hourly temperatures will appear once the data loads.</p>
</div>
<div class="badge" id="sourceBadge">UTC timezone</div>
</div>
<div class="metrics">
<div class="metric">
<div class="label">High</div>
<div class="value" id="metricHigh">--</div>
</div>
<div class="metric">
<div class="label">Low</div>
<div class="value" id="metricLow">--</div>
</div>
<div class="metric">
<div class="label">Condition</div>
<div class="value" id="metricCondition" style="font-size:24px;line-height:1.15">--</div>
</div>
</div>
<div class="hourly">
<div class="hourly-head">
<h3>Hourly temperature</h3>
<div class="range" id="hourlyRange">00:00 to 23:00 UTC</div>
</div>
<div class="chart" id="chart"></div>
</div>
</section>
</section>
</main>
<script>
(function () {
"use strict";
var params = new URLSearchParams(window.location.search);
var todayUtc = new Date().toISOString().slice(0, 10);
function validDate(value) {
if (!/^\d{4}-\d{2}-\d{2}$/.test(value || "")) return false;
var d = new Date(value + "T00:00:00Z");
return !Number.isNaN(d.getTime()) && d.toISOString().slice(0, 10) === value;
}
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");
if (!Number.isFinite(lat)) lat = 52.52;
if (!Number.isFinite(lon)) lon = 13.405;
if (!validDate(date)) date = todayUtc;
var conditionMap = {
0: "Clear sky",
1: "Mainly clear",
2: "Partly cloudy",
3: "Overcast",
45: "Fog",
48: "Rime fog",
51: "Light drizzle",
53: "Drizzle",
55: "Heavy drizzle",
56: "Freezing drizzle",
57: "Heavy freezing drizzle",
61: "Light rain",
63: "Rain",
65: "Heavy rain",
66: "Freezing rain",
67: "Heavy 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: "Heavy snow showers",
95: "Thunderstorm",
96: "Thunderstorm with hail",
99: "Severe thunderstorm"
};
function formatDate(value) {
return new Intl.DateTimeFormat("en", {
weekday: "long",
year: "numeric",
month: "long",
day: "numeric",
timeZone: "UTC"
}).format(new Date(value + "T00:00:00Z"));
}
function temp(value) {
if (value === null || value === undefined || Number.isNaN(Number(value))) return "--";
return Math.round(Number(value)) + "°C";
}
function setText(id, value) {
var node = document.getElementById(id);
if (node) node.textContent = value;
}
function fail(message) {
setText("condition", "Unable to load");
setText("headline", "Weather data could not be loaded.");
setText("subhead", message || "Please check the requested location and date.");
setText("maxTemp", "--");
setText("minTemp", "--");
setText("metricHigh", "--");
setText("metricLow", "--");
setText("metricCondition", "--");
document.getElementById("chart").innerHTML =
'<div class="state"><div><strong>Weather data could not be loaded.</strong><span>Please try another date or location.</span></div></div>';
}
function render(data) {
if (!data || !data.daily || !data.hourly) throw new Error("Missing weather data");
var dailyIndex = (data.daily.time || []).indexOf(date);
if (dailyIndex < 0) dailyIndex = 0;
var high = data.daily.temperature_2m_max && data.daily.temperature_2m_max[dailyIndex];
var low = data.daily.temperature_2m_min && data.daily.temperature_2m_min[dailyIndex];
var code = data.daily.weather_code && data.daily.weather_code[dailyIndex];
var condition = conditionMap[code] || "Weather code " + code;
var hourlyTimes = data.hourly.time || [];
var hourlyTemps = data.hourly.temperature_2m || [];
var points = hourlyTimes.map(function (time, index) {
return { time: time, value: hourlyTemps[index] };
}).filter(function (point) {
return typeof point.time === "string" && point.time.slice(0, 10) === date && point.value !== null && point.value !== undefined;
});
if (!points.length) throw new Error("No hourly temperatures were returned");
var values = points.map(function (p) { return Number(p.value); }).filter(Number.isFinite);
var min = Math.min.apply(null, values);
var max = Math.max.apply(null, values);
var spread = Math.max(1, max - min);
setText("condition", condition);
setText("headline", condition + " in " + name);
setText("subhead", "Temperatures shown in Celsius for the requested UTC day.");
setText("maxTemp", temp(high));
setText("minTemp", temp(low));
setText("metricHigh", temp(high));
setText("metricLow", temp(low));
setText("metricCondition", condition);
var chart = document.getElementById("chart");
chart.innerHTML = "";
points.forEach(function (point) {
var hour = point.time.slice(11, 13);
var value = Number(point.value);
var height = 18 + ((value - min) / spread) * 82;
var wrap = document.createElement("div");
wrap.className = "bar-wrap";
wrap.title = hour + ":00 UTC, " + temp(value);
wrap.innerHTML =
'<div class="bar-temp">' + temp(value) + '</div>' +
'<div class="bar-track"><div class="bar" style="height:' + height.toFixed(1) + '%"></div></div>' +
'<div class="bar-hour">' + hour + '</div>';
chart.appendChild(wrap);
});
}
setText("location", name);
setText("dateLabel", formatDate(date));
setText("sourceBadge", date < todayUtc ? "Archive data" : "Forecast data");
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("Request failed");
return response.json();
})
.then(render)
.catch(function (error) {
fail(error && error.message);
});
})();
</script>
</body>
</html>L1 — cheap deterministic descriptors
| bytes total | 14,363 | html / css / js | 2,291 / 6,537 / 5,535 |
|---|---|---|---|
| dom nodes | 48 | dom depth | 9 |
| css rules | 45 | js present | yes |
| brightness | 205.9 | contrast | 45.0 |
| colorfulness | 53.4 | whitespace | 57.9% |
This slot's telemetry
| prompt tokens | 0 | completion tokens | 10,995 |
|---|---|---|---|
| total tokens | 0 | wall | 91.4 s |
| cost | — | request id | — |
config.json547 B
{
"N": 2,
"auth": {
"credential_ref": "WCB_NONE",
"method": "oauth-login"
},
"billing": "plan",
"config_id": "gpt-5.5-eff-high--cli--codex-oauth--dev",
"effort": "high",
"family": "gpt",
"m": {
"min": 2,
"q": 2
},
"model_id": "gpt-5.5",
"protocol": "cli",
"served_model": "gpt-5.5",
"telemetry": {
"completion_tokens": 42542,
"cost_usd": null,
"prompt_tokens": null,
"total_tokens": null,
"wall_ms": 353111
},
"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-high--cli--codex-oauth--dev",
"positions": [
{
"attempts": [
{
"attempt_index": 0,
"backoff_ms": null,
"charged": true,
"ended_at": "2026-07-17T13:46:27.843933+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-07-17T13:44:56.480806+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-17T13:47:50.618102+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-07-17T13:46:33.364666+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-17T13:49:11.159168+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-07-17T13:47:53.902947+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-17T13:51:02.039495+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-07-17T13:49:14.792364+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
}
}
}