gpt-5.6-terra @ max · cursor
cursormax
- config
- gpt-5.6-terra-eff-max--cli--cursor--dev
- batch
- 2026-07-19--unified
- transport
- cursor-agent-cli-isolated-home
- protocol
- cli · plan
- served model
- gpt-5.6-terra-max
- 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.6-sol @max · cursor0.68gpt-5.6-sol @max · kiro0.67gpt-5.6-sol @xhigh · cursor-xl0.67gpt-5.6-sol @max · cursor-xl0.67gpt-5.6-sol @medium · kiro0.66farthest
qwen3.6-plus · go0.49claude-haiku-4-5 @max · CC0.50hy3-free · api0.51kimi-k3 @low · api0.51claude-sonnet-4-6-thinking @medium · cursor0.51within 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 tempmismatchshown: 9.3
- min tempmatchshown: 16
- 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.0">
<title>Weather Card</title>
<style>
:root {
--ink: #1e303a;
--muted: #738793;
--line: #e4ebed;
--paper: #ffffff;
--scene-start: #4d88b0;
--scene-end: #1d466c;
--scene-glow: #b3e5f7;
--chart-accent: #347da3;
}
* {
box-sizing: border-box;
}
html,
body {
min-height: 100%;
}
body {
min-width: 960px;
margin: 0;
display: grid;
place-items: center;
overflow: hidden;
color: var(--ink);
background:
radial-gradient(circle at 8% 7%, rgba(155, 202, 219, 0.46), transparent 30rem),
radial-gradient(circle at 96% 94%, rgba(244, 207, 159, 0.28), transparent 26rem),
#eef2f2;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
font-feature-settings: "kern" 1, "liga" 1;
}
body::before {
position: fixed;
inset: 0;
z-index: -1;
pointer-events: none;
content: "";
opacity: 0.24;
background-image:
linear-gradient(rgba(91, 120, 133, 0.08) 1px, transparent 1px),
linear-gradient(90deg, rgba(91, 120, 133, 0.08) 1px, transparent 1px);
background-size: 28px 28px;
mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.6), transparent 75%);
}
.app-shell {
width: min(1120px, calc(100vw - 96px));
}
.deck-label {
display: flex;
align-items: center;
gap: 10px;
margin: 0 0 13px 14px;
color: #607783;
font-size: 10px;
font-weight: 800;
letter-spacing: 0.17em;
text-transform: uppercase;
}
.deck-label::before {
width: 7px;
height: 7px;
border-radius: 50%;
content: "";
background: #d08454;
box-shadow: 0 0 0 5px rgba(208, 132, 84, 0.13);
}
.deck-label span:last-child {
margin-left: auto;
margin-right: 14px;
color: #93a2aa;
font-weight: 700;
letter-spacing: 0.12em;
}
.weather-card {
display: grid;
grid-template-columns: 400px minmax(0, 1fr);
height: 616px;
overflow: hidden;
border: 1px solid rgba(255, 255, 255, 0.78);
border-radius: 31px;
background: var(--paper);
box-shadow:
0 30px 60px rgba(35, 60, 72, 0.14),
0 6px 16px rgba(35, 60, 72, 0.08);
}
.scene {
position: relative;
display: flex;
min-width: 0;
overflow: hidden;
padding: 35px 35px 30px;
color: #fff;
background:
radial-gradient(circle at 88% 8%, var(--scene-glow) 0, transparent 33%),
linear-gradient(145deg, var(--scene-start), var(--scene-end));
}
.scene::before {
position: absolute;
inset: 0;
content: "";
opacity: 0.62;
background:
linear-gradient(130deg, rgba(255, 255, 255, 0.12), transparent 39%),
radial-gradient(ellipse at 7% 105%, rgba(3, 24, 46, 0.35), transparent 58%);
}
.scene::after {
position: absolute;
inset: 12px;
border: 1px solid rgba(255, 255, 255, 0.17);
border-radius: 22px;
content: "";
pointer-events: none;
}
.orb {
position: absolute;
top: 129px;
right: -83px;
width: 243px;
height: 243px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 50%;
opacity: 0.75;
background: radial-gradient(circle at 38% 36%, rgba(255, 255, 255, 0.25), rgba(255, 255, 255, 0.02) 62%);
}
.scene-cloud {
position: absolute;
width: 92px;
height: 19px;
border-radius: 20px;
opacity: 0.14;
background: rgba(255, 255, 255, 0.82);
filter: blur(0.2px);
}
.scene-cloud::before,
.scene-cloud::after {
position: absolute;
bottom: 0;
border-radius: 50%;
content: "";
background: inherit;
}
.scene-cloud::before {
left: 16px;
width: 36px;
height: 36px;
}
.scene-cloud::after {
right: 11px;
width: 29px;
height: 29px;
}
.cloud-one {
top: 260px;
right: -27px;
transform: scale(1.3);
}
.cloud-two {
bottom: 87px;
left: -36px;
transform: scale(0.72);
}
.scene-content {
position: relative;
z-index: 1;
display: flex;
flex: 1;
min-width: 0;
flex-direction: column;
}
.location-kicker {
display: flex;
align-items: center;
gap: 8px;
color: rgba(255, 255, 255, 0.72);
font-size: 10px;
font-weight: 800;
letter-spacing: 0.17em;
text-transform: uppercase;
}
.location-kicker svg {
width: 15px;
height: 15px;
fill: none;
stroke: currentColor;
stroke-width: 2;
}
#locationName {
max-width: 315px;
margin: 10px 0 4px;
overflow: hidden;
font-size: 31px;
font-weight: 760;
letter-spacing: -0.045em;
line-height: 1.05;
text-overflow: ellipsis;
white-space: nowrap;
}
#dateLabel {
margin: 0;
color: rgba(255, 255, 255, 0.74);
font-size: 13px;
font-weight: 560;
letter-spacing: 0.005em;
}
.hero-weather {
margin-top: 19px;
}
#weatherIcon {
display: flex;
align-items: center;
width: 164px;
height: 117px;
filter: drop-shadow(0 14px 17px rgba(10, 33, 55, 0.18));
}
#weatherIcon svg {
width: 164px;
height: 117px;
overflow: visible;
}
#condition {
margin: 1px 0 0 3px;
font-size: 18px;
font-weight: 690;
letter-spacing: -0.025em;
}
.hero-temperature {
display: flex;
align-items: flex-end;
gap: 15px;
margin-top: 17px;
}
.big-temperature {
display: flex;
align-items: flex-start;
font-size: 82px;
font-weight: 720;
letter-spacing: -0.085em;
line-height: 0.86;
text-shadow: 0 5px 18px rgba(7, 34, 57, 0.14);
}
.big-temperature sup {
margin: 0.04em 0 0 3px;
font-size: 0.47em;
font-weight: 500;
letter-spacing: -0.06em;
}
.big-temperature em {
margin: 0.29em 0 0 1px;
color: rgba(255, 255, 255, 0.78);
font-size: 0.21em;
font-style: normal;
font-weight: 760;
letter-spacing: 0.02em;
}
.daily-high-label {
display: grid;
gap: 4px;
padding-bottom: 3px;
}
.daily-high-label span {
color: rgba(255, 255, 255, 0.63);
font-size: 9px;
font-weight: 800;
letter-spacing: 0.16em;
text-transform: uppercase;
}
.daily-high-label strong {
color: rgba(255, 255, 255, 0.95);
font-size: 13px;
font-weight: 700;
}
.scene-footer {
display: flex;
align-items: center;
gap: 16px;
margin-top: auto;
padding-top: 21px;
border-top: 1px solid rgba(255, 255, 255, 0.19);
}
.mini-stat {
display: grid;
gap: 5px;
}
.mini-stat span {
color: rgba(255, 255, 255, 0.57);
font-size: 8px;
font-weight: 800;
letter-spacing: 0.16em;
text-transform: uppercase;
}
.mini-stat strong {
color: rgba(255, 255, 255, 0.92);
font-size: 12px;
font-weight: 680;
white-space: nowrap;
}
.mini-divider {
width: 1px;
height: 27px;
background: rgba(255, 255, 255, 0.22);
}
.forecast-panel {
display: flex;
min-width: 0;
flex-direction: column;
padding: 33px 36px 25px;
background:
linear-gradient(135deg, rgba(239, 247, 249, 0.48), transparent 30%),
#fff;
}
.panel-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 18px;
}
.panel-kicker {
display: block;
margin-bottom: 5px;
color: #7f929b;
font-size: 9px;
font-weight: 800;
letter-spacing: 0.16em;
text-transform: uppercase;
}
#forecastTitle {
margin: 0;
color: #20333d;
font-size: 22px;
font-weight: 740;
letter-spacing: -0.045em;
line-height: 1.1;
}
.endpoint-tag {
display: inline-flex;
align-items: center;
gap: 7px;
margin-top: 1px;
padding: 8px 10px;
border: 1px solid #dde8eb;
border-radius: 999px;
color: #69818b;
background: #f7faf9;
font-size: 9px;
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
white-space: nowrap;
}
.endpoint-tag::before {
width: 6px;
height: 6px;
border-radius: 50%;
content: "";
background: #71b599;
box-shadow: 0 0 0 4px rgba(113, 181, 153, 0.12);
}
.summary {
display: grid;
grid-template-columns: minmax(0, 1fr) 108px 108px;
gap: 12px;
margin-top: 21px;
}
.condition-summary {
display: flex;
align-items: center;
min-width: 0;
padding: 17px 16px;
border: 1px solid #e6edef;
border-radius: 17px;
background: #fbfcfc;
}
.condition-mark {
flex: 0 0 auto;
width: 10px;
height: 10px;
margin-right: 11px;
border-radius: 50%;
background: var(--chart-accent);
box-shadow: 0 0 0 5px color-mix(in srgb, var(--chart-accent) 13%, transparent);
}
.condition-copy {
display: grid;
min-width: 0;
gap: 4px;
}
#conditionDetail {
overflow: hidden;
color: #2d414b;
font-size: 14px;
font-weight: 720;
letter-spacing: -0.02em;
text-overflow: ellipsis;
white-space: nowrap;
}
#rangeDetail {
overflow: hidden;
color: #83959d;
font-size: 11px;
font-weight: 560;
text-overflow: ellipsis;
white-space: nowrap;
}
.metric {
display: grid;
align-content: center;
gap: 7px;
min-width: 0;
padding: 14px 13px 12px;
border: 1px solid #e6edef;
border-radius: 17px;
background: #fff;
}
.metric > span {
color: #8798a0;
font-size: 8px;
font-weight: 800;
letter-spacing: 0.14em;
text-transform: uppercase;
}
.metric-reading {
display: flex;
align-items: baseline;
min-width: 0;
gap: 2px;
}
.metric strong {
overflow: hidden;
color: #233842;
font-size: 29px;
font-weight: 720;
letter-spacing: -0.075em;
line-height: 0.9;
text-overflow: ellipsis;
}
.metric em {
color: #84969f;
font-size: 10px;
font-style: normal;
font-weight: 750;
}
.section-divider {
height: 1px;
margin: 21px 0 16px;
background: linear-gradient(90deg, #e5edef, transparent);
}
.hourly-head {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 15px;
}
.hourly-head h3 {
margin: 0;
color: #2a3d47;
font-size: 14px;
font-weight: 760;
letter-spacing: -0.02em;
}
.hourly-head span {
color: #8c9da5;
font-size: 10px;
font-weight: 650;
}
.chart-wrap {
position: relative;
height: 163px;
margin-top: 11px;
overflow: hidden;
border: 1px solid #e8eff0;
border-radius: 18px;
background:
linear-gradient(180deg, rgba(241, 249, 250, 0.9), rgba(251, 253, 253, 0.7)),
#fbfcfc;
}
.temperature-chart {
display: block;
width: 100%;
height: 100%;
}
.temperature-chart .grid-line {
stroke: #dce7e9;
stroke-dasharray: 3 5;
stroke-width: 1;
}
.temperature-chart .grid-label,
.temperature-chart .time-label {
fill: #8a9da6;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
font-size: 9px;
font-weight: 650;
}
.temperature-chart .time-label {
fill: #77909b;
font-size: 9px;
}
.hourly-readings {
display: grid;
grid-template-columns: repeat(24, minmax(0, 1fr));
min-height: 52px;
margin-top: 12px;
overflow: hidden;
}
.hour-cell {
position: relative;
display: grid;
align-content: start;
justify-items: center;
min-width: 0;
gap: 5px;
padding-top: 1px;
text-align: center;
}
.hour-cell + .hour-cell::before {
position: absolute;
top: 3px;
bottom: 2px;
left: 0;
width: 1px;
content: "";
background: #edf2f3;
}
.hour-cell span {
color: #98a7ae;
font-size: 9px;
font-weight: 700;
letter-spacing: 0.02em;
}
.hour-cell strong {
color: #4f6671;
font-size: 11px;
font-weight: 750;
letter-spacing: -0.04em;
line-height: 1;
white-space: nowrap;
}
.hour-cell.is-high strong {
color: #bb7450;
}
.hour-cell.is-low strong {
color: #4e8aa8;
}
.hour-cell.is-high::after,
.hour-cell.is-low::after {
width: 4px;
height: 4px;
margin-top: 1px;
border-radius: 50%;
content: "";
}
.hour-cell.is-high::after {
background: #d69266;
}
.hour-cell.is-low::after {
background: #62a4c2;
}
.panel-footer {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
margin-top: auto;
padding-top: 16px;
border-top: 1px solid #edf2f3;
color: #8b9ca4;
font-size: 10px;
font-weight: 620;
}
#dataSource {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#coordinateLabel {
color: #718994;
font-size: 10px;
font-weight: 720;
white-space: nowrap;
}
.loading-chart {
display: grid;
height: 100%;
place-items: center;
color: #8b9ea6;
font-size: 12px;
font-weight: 650;
}
.loading-chart::before {
width: 30px;
height: 30px;
margin-bottom: -35px;
border: 3px solid #dce8ea;
border-top-color: var(--chart-accent);
border-radius: 50%;
content: "";
animation: spin 0.9s linear infinite;
}
.chart-error {
display: grid;
height: 100%;
place-content: center;
justify-items: center;
padding: 15px;
text-align: center;
}
.error-symbol {
display: grid;
width: 27px;
height: 27px;
margin-bottom: 7px;
border-radius: 50%;
place-items: center;
color: #b16d50;
background: #f8e8df;
font-size: 15px;
font-weight: 800;
}
.chart-error strong {
color: #40545d;
font-size: 13px;
font-weight: 730;
}
.chart-error p {
margin: 4px 0 0;
color: #8b9ca3;
font-size: 11px;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
@media (prefers-reduced-motion: reduce) {
.loading-chart::before {
animation: none;
}
}
</style>
</head>
<body>
<main class="app-shell">
<div class="deck-label">
<span>Weather brief</span>
<span>Daily outlook · UTC</span>
</div>
<article class="weather-card" id="weatherCard" aria-busy="true">
<section class="scene" aria-label="Daily weather summary">
<div class="orb"></div>
<div class="scene-cloud cloud-one"></div>
<div class="scene-cloud cloud-two"></div>
<div class="scene-content">
<div class="location-kicker">
<svg viewBox="0 0 24 24" aria-hidden="true">
<path d="M20 10c0 5-8 11-8 11S4 15 4 10a8 8 0 1 1 16 0Z"></path>
<circle cx="12" cy="10" r="2.5"></circle>
</svg>
Location
</div>
<h1 id="locationName">Berlin</h1>
<p id="dateLabel">Loading date…</p>
<div class="hero-weather">
<div id="weatherIcon" aria-hidden="true"></div>
<p id="condition">Loading weather data…</p>
</div>
<div class="hero-temperature">
<div class="big-temperature">
<span id="highTemp">—</span><sup>°</sup><em>C</em>
</div>
<div class="daily-high-label">
<span>Daily high</span>
<strong>Celsius</strong>
</div>
</div>
<div class="scene-footer">
<div class="mini-stat">
<span>Low</span>
<strong id="lowInline">—</strong>
</div>
<div class="mini-divider"></div>
<div class="mini-stat">
<span>Data window</span>
<strong>00—24 UTC</strong>
</div>
</div>
</div>
</section>
<section class="forecast-panel" aria-label="Hourly forecast">
<div class="panel-head">
<div>
<span class="panel-kicker" id="forecastKicker">Daily forecast</span>
<h2 id="forecastTitle">Preparing your weather brief</h2>
</div>
<span class="endpoint-tag" id="endpointTag">Forecast</span>
</div>
<div class="summary">
<div class="condition-summary">
<span class="condition-mark"></span>
<div class="condition-copy">
<strong id="conditionDetail">Loading weather data…</strong>
<span id="rangeDetail">Waiting for the daily temperature range</span>
</div>
</div>
<div class="metric">
<span>Maximum</span>
<div class="metric-reading">
<strong id="maxTemp">—</strong><em>°C</em>
</div>
</div>
<div class="metric">
<span>Minimum</span>
<div class="metric-reading">
<strong id="minTemp">—</strong><em>°C</em>
</div>
</div>
</div>
<div class="section-divider"></div>
<div class="hourly-head">
<h3>Hourly temperature</h3>
<span>All readings in °C</span>
</div>
<div class="chart-wrap" id="chartWrap">
<div class="loading-chart">Loading hourly readings</div>
</div>
<div class="hourly-readings" id="hourlyReadings" aria-label="Hourly temperatures"></div>
<footer class="panel-footer">
<span id="dataSource">Loading Open-Meteo compatible data…</span>
<span id="coordinateLabel">—</span>
</footer>
</section>
<span class="sr-only" id="statusMessage" aria-live="polite">Loading weather data.</span>
</article>
</main>
<script>
(() => {
const defaults = {
latitude: 52.52,
longitude: 13.405,
name: "Berlin"
};
const query = new URLSearchParams(window.location.search);
const utcToday = new Date().toISOString().slice(0, 10);
function isValidDate(value) {
if (!/^\d{4}-\d{2}-\d{2}$/.test(value || "")) return false;
const date = new Date(value + "T00:00:00Z");
return !Number.isNaN(date.getTime()) && date.toISOString().slice(0, 10) === value;
}
function coordinateFromQuery(key, fallback, minimum, maximum) {
const raw = query.get(key);
if (raw === null || raw.trim() === "") return fallback;
const value = Number(raw);
return Number.isFinite(value) && value >= minimum && value <= maximum ? value : fallback;
}
const latitude = coordinateFromQuery("lat", defaults.latitude, -90, 90);
const longitude = coordinateFromQuery("lon", defaults.longitude, -180, 180);
const requestedDate = isValidDate(query.get("date")) ? query.get("date") : utcToday;
const requestedName = (query.get("name") || "").trim();
const locationName = (requestedName || defaults.name).slice(0, 72);
const isHistorical = requestedDate < utcToday;
const ui = {
card: document.getElementById("weatherCard"),
locationName: document.getElementById("locationName"),
dateLabel: document.getElementById("dateLabel"),
weatherIcon: document.getElementById("weatherIcon"),
condition: document.getElementById("condition"),
highTemp: document.getElementById("highTemp"),
lowInline: document.getElementById("lowInline"),
forecastKicker: document.getElementById("forecastKicker"),
forecastTitle: document.getElementById("forecastTitle"),
endpointTag: document.getElementById("endpointTag"),
conditionDetail: document.getElementById("conditionDetail"),
rangeDetail: document.getElementById("rangeDetail"),
maxTemp: document.getElementById("maxTemp"),
minTemp: document.getElementById("minTemp"),
chartWrap: document.getElementById("chartWrap"),
hourlyReadings: document.getElementById("hourlyReadings"),
dataSource: document.getElementById("dataSource"),
coordinateLabel: document.getElementById("coordinateLabel"),
statusMessage: document.getElementById("statusMessage")
};
const themes = {
clear: {
start: "#4d88b0",
end: "#1d466c",
glow: "#b3e5f7",
chart: "#347da3"
},
cloud: {
start: "#70899a",
end: "#354c60",
glow: "#d1e0e3",
chart: "#5d8aa0"
},
rain: {
start: "#587187",
end: "#263d53",
glow: "#b3d0dc",
chart: "#497d98"
},
snow: {
start: "#7896a7",
end: "#3d5b70",
glow: "#daf1f7",
chart: "#548ca4"
},
storm: {
start: "#5f6881",
end: "#202d45",
glow: "#c9c8e7",
chart: "#6974b0"
},
fog: {
start: "#84969a",
end: "#4a5e65",
glow: "#d8e0dc",
chart: "#6c9695"
}
};
function formatTemperature(value) {
const rounded = Math.round(value * 10) / 10;
return Number.isInteger(rounded) ? String(rounded) : rounded.toFixed(1);
}
function formatDate(value) {
return new Intl.DateTimeFormat("en-US", {
weekday: "long",
month: "long",
day: "numeric",
year: "numeric",
timeZone: "UTC"
}).format(new Date(value + "T12:00:00Z"));
}
function weekday(value) {
return new Intl.DateTimeFormat("en-US", {
weekday: "long",
timeZone: "UTC"
}).format(new Date(value + "T12:00:00Z"));
}
function formatCoordinate(value, positive, negative) {
return Math.abs(value).toFixed(2) + "° " + (value >= 0 ? positive : negative);
}
function nullableNumber(value) {
if (value === null || value === undefined || value === "") return null;
const number = Number(value);
return Number.isFinite(number) ? number : null;
}
function weatherForCode(code) {
const direct = {
0: ["Clear sky", "Clear conditions through the day.", "clear"],
1: ["Mainly clear", "Mostly clear with only a little cloud.", "clear"],
2: ["Partly cloudy", "Sun and clouds sharing the sky.", "cloud"],
3: ["Overcast", "A fully cloud-covered day.", "cloud"],
45: ["Fog", "Reduced visibility may linger.", "fog"],
48: ["Rime fog", "Fog with a light icy deposit.", "fog"],
51: ["Light drizzle", "A light drizzle is expected.", "rain"],
53: ["Moderate drizzle", "Drizzle through parts of the day.", "rain"],
55: ["Dense drizzle", "Persistent drizzle is expected.", "rain"],
56: ["Freezing drizzle", "Light freezing drizzle is possible.", "rain"],
57: ["Freezing drizzle", "Dense freezing drizzle is possible.", "rain"],
61: ["Light rain", "Light rain is expected.", "rain"],
63: ["Moderate rain", "Rain is expected through the day.", "rain"],
65: ["Heavy rain", "Periods of heavy rain are expected.", "rain"],
66: ["Freezing rain", "Light freezing rain is possible.", "rain"],
67: ["Freezing rain", "Heavy freezing rain is possible.", "rain"],
71: ["Light snowfall", "Light snow is expected.", "snow"],
73: ["Moderate snowfall", "Snow is expected through the day.", "snow"],
75: ["Heavy snowfall", "Heavy snow is expected.", "snow"],
77: ["Snow grains", "Fine snow grains are expected.", "snow"],
80: ["Rain showers", "Light rain showers are expected.", "rain"],
81: ["Rain showers", "Moderate rain showers are expected.", "rain"],
82: ["Heavy rain showers", "Strong rain showers are expected.", "rain"],
85: ["Snow showers", "Light snow showers are expected.", "snow"],
86: ["Heavy snow showers", "Heavy snow showers are expected.", "snow"],
95: ["Thunderstorm", "Thunderstorms are expected.", "storm"],
96: ["Thunderstorm with hail", "Thunderstorms and hail are possible.", "storm"],
99: ["Severe thunderstorm", "Severe thunderstorms and hail are possible.", "storm"]
};
return direct[code] || ["Weather conditions", "Weather data is available for this date.", "cloud"];
}
function weatherIcon(kind) {
const cloud = `
<path d="M35 91c0-14 11-25 25-25 3-18 18-30 37-28 13 2 23 11 27 24 17-1 31 11 31 28 0 15-12 27-28 27H62c-15 0-27-12-27-26Z"
fill="rgba(255,255,255,.93)"/>
<path d="M56 96h78" stroke="rgba(211,235,243,.65)" stroke-width="3" stroke-linecap="round"/>
`;
if (kind === "clear") {
return `
<svg viewBox="0 0 180 130" aria-hidden="true">
<g fill="none" stroke="rgba(255,255,255,.86)" stroke-width="4" stroke-linecap="round">
<path d="M90 9v14M90 107v14M34 65h15M131 65h15M51 26l11 11M119 94l11 11M129 26l-11 11M62 94 51 105"/>
</g>
<circle cx="90" cy="65" r="30" fill="#ffd678"/>
<circle cx="80" cy="54" r="12" fill="rgba(255,255,255,.17)"/>
</svg>
`;
}
if (kind === "rain") {
return `
<svg viewBox="0 0 180 130" aria-hidden="true">
${cloud}
<g fill="none" stroke="#bce9fa" stroke-width="4" stroke-linecap="round">
<path d="M67 106l-5 11M90 106l-5 11M113 106l-5 11M136 106l-5 11"/>
</g>
</svg>
`;
}
if (kind === "snow") {
return `
<svg viewBox="0 0 180 130" aria-hidden="true">
${cloud}
<g stroke="#e6faff" stroke-width="2.5" stroke-linecap="round">
<path d="M65 107v13M59 110l12 7M71 110l-12 7M95 107v13M89 110l12 7M101 110l-12 7M125 107v13M119 110l12 7M131 110l-12 7"/>
</g>
</svg>
`;
}
if (kind === "storm") {
return `
<svg viewBox="0 0 180 130" aria-hidden="true">
${cloud}
<path d="m98 99-14 22h13l-4 16 19-25H99l7-13Z" fill="#ffd45e" transform="translate(0,-15)"/>
<path d="M130 108l-4 10" stroke="#bce9fa" stroke-width="4" stroke-linecap="round"/>
</svg>
`;
}
if (kind === "fog") {
return `
<svg viewBox="0 0 180 130" aria-hidden="true">
<circle cx="91" cy="57" r="31" fill="rgba(255,255,255,.3)"/>
<g fill="none" stroke="rgba(255,255,255,.88)" stroke-width="5" stroke-linecap="round">
<path d="M38 67h105M48 84h87M34 101h111"/>
</g>
<g fill="none" stroke="rgba(222,241,242,.72)" stroke-width="3" stroke-linecap="round">
<path d="M56 51h66"/>
</g>
</svg>
`;
}
if (kind === "cloud") {
return `
<svg viewBox="0 0 180 130" aria-hidden="true">
<circle cx="116" cy="40" r="24" fill="#ffe28a"/>
<circle cx="107" cy="31" r="9" fill="rgba(255,255,255,.16)"/>
${cloud}
</svg>
`;
}
return "";
}
function applyTheme(kind) {
const theme = themes[kind] || themes.cloud;
ui.card.style.setProperty("--scene-start", theme.start);
ui.card.style.setProperty("--scene-end", theme.end);
ui.card.style.setProperty("--scene-glow", theme.glow);
ui.card.style.setProperty("--chart-accent", theme.chart);
return theme;
}
function hourFromTimestamp(timestamp, fallback) {
const match = /T(\d{2})/.exec(timestamp);
return match ? match[1] : String(fallback).padStart(2, "0");
}
function renderHourlyStrip(hours) {
const validValues = hours.filter((hour) => hour.temp !== null).map((hour) => hour.temp);
const high = Math.max(...validValues);
const low = Math.min(...validValues);
const fragment = document.createDocumentFragment();
ui.hourlyReadings.style.gridTemplateColumns = `repeat(${hours.length}, minmax(0, 1fr))`;
hours.forEach((hour, index) => {
const cell = document.createElement("div");
const label = document.createElement("span");
const value = document.createElement("strong");
cell.className = "hour-cell";
label.textContent = hourFromTimestamp(hour.time, index);
value.textContent = hour.temp === null ? "—" : formatTemperature(hour.temp) + "°";
cell.title = hour.temp === null
? hourFromTimestamp(hour.time, index) + ":00 — unavailable"
: hourFromTimestamp(hour.time, index) + ":00 — " + formatTemperature(hour.temp) + " °C";
if (high !== low && hour.temp === high) cell.classList.add("is-high");
if (high !== low && hour.temp === low) cell.classList.add("is-low");
cell.append(label, value);
fragment.append(cell);
});
ui.hourlyReadings.replaceChildren(fragment);
}
function renderChart(hours, accent) {
const validValues = hours.filter((hour) => hour.temp !== null).map((hour) => hour.temp);
const observedLow = Math.min(...validValues);
const observedHigh = Math.max(...validValues);
const padding = Math.max(1, (observedHigh - observedLow) * 0.26);
const graphLow = Math.floor(observedLow - padding);
const graphHigh = Math.ceil(observedHigh + padding);
const graphRange = Math.max(4, graphHigh - graphLow);
const width = 660;
const height = 168;
const left = 40;
const right = 15;
const top = 16;
const bottom = 27;
const plotHeight = height - top - bottom;
const plotWidth = width - left - right;
const baseline = height - bottom;
const pointFor = (hour, index) => ({
index,
temp: hour.temp,
x: left + (plotWidth * index) / Math.max(hours.length - 1, 1),
y: top + ((graphHigh - hour.temp) / graphRange) * plotHeight
});
const segments = [];
let activeSegment = [];
hours.forEach((hour, index) => {
if (hour.temp === null) {
if (activeSegment.length) segments.push(activeSegment);
activeSegment = [];
return;
}
activeSegment.push(pointFor(hour, index));
});
if (activeSegment.length) segments.push(activeSegment);
const allPoints = segments.flat();
const grid = [0, 1 / 3, 2 / 3, 1].map((step) => {
const y = top + plotHeight * step;
const value = graphHigh - graphRange * step;
return `
<line class="grid-line" x1="${left}" x2="${width - right}" y1="${y.toFixed(1)}" y2="${y.toFixed(1)}"/>
<text class="grid-label" x="5" y="${(y + 3).toFixed(1)}">${formatTemperature(value)}°</text>
`;
}).join("");
const areaPaths = segments.filter((segment) => segment.length > 1).map((segment) => {
const first = segment[0];
const last = segment[segment.length - 1];
const points = segment.map((point) => `L ${point.x.toFixed(1)} ${point.y.toFixed(1)}`).join(" ");
return `<path d="M ${first.x.toFixed(1)} ${baseline} ${points} L ${last.x.toFixed(1)} ${baseline} Z" fill="url(#areaFill)"/>`;
}).join("");
const linePaths = segments.map((segment) => {
const [first, ...rest] = segment;
const points = rest.map((point) => `L ${point.x.toFixed(1)} ${point.y.toFixed(1)}`).join(" ");
return `<path d="M ${first.x.toFixed(1)} ${first.y.toFixed(1)} ${points}" fill="none" stroke="${accent}" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>`;
}).join("");
const nodes = allPoints.filter((point) => (
point.index % 3 === 0 ||
Math.abs(point.temp - observedHigh) < 0.0001 ||
Math.abs(point.temp - observedLow) < 0.0001
)).map((point) => (
`<circle cx="${point.x.toFixed(1)}" cy="${point.y.toFixed(1)}" r="3.8" fill="#fff" stroke="${accent}" stroke-width="2.3"/>`
)).join("");
const labelIndexes = [...new Set([
0,
Math.round((hours.length - 1) * 0.25),
Math.round((hours.length - 1) * 0.5),
Math.round((hours.length - 1) * 0.75),
hours.length - 1
])];
const timeLabels = labelIndexes.map((index) => {
const x = left + (plotWidth * index) / Math.max(hours.length - 1, 1);
return `<text class="time-label" text-anchor="middle" x="${x.toFixed(1)}" y="${height - 9}">${hourFromTimestamp(hours[index].time, index)}</text>`;
}).join("");
ui.chartWrap.innerHTML = `
<svg class="temperature-chart" viewBox="0 0 ${width} ${height}" preserveAspectRatio="none" role="img" aria-label="Hourly temperature chart in Celsius">
<defs>
<linearGradient id="areaFill" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="${accent}" stop-opacity="0.26"/>
<stop offset="100%" stop-color="${accent}" stop-opacity="0.015"/>
</linearGradient>
</defs>
${grid}
${areaPaths}
${linePaths}
${nodes}
${timeLabels}
</svg>
`;
}
function extractForecast(payload) {
const daily = payload && payload.daily;
const hourly = payload && payload.hourly;
if (!daily || !hourly || !Array.isArray(daily.time) || !Array.isArray(hourly.time)) {
throw new Error("Missing weather data");
}
const dailyIndex = daily.time.findIndex((time) => String(time).slice(0, 10) === requestedDate);
if (dailyIndex < 0) throw new Error("Requested daily record unavailable");
const maximum = nullableNumber(daily.temperature_2m_max && daily.temperature_2m_max[dailyIndex]);
const minimum = nullableNumber(daily.temperature_2m_min && daily.temperature_2m_min[dailyIndex]);
if (maximum === null || minimum === null) {
throw new Error("Missing daily temperatures");
}
const weatherCodeValue = nullableNumber(daily.weather_code && daily.weather_code[dailyIndex]);
const hourlyTemperatures = Array.isArray(hourly.temperature_2m) ? hourly.temperature_2m : [];
const hours = hourly.time.reduce((result, timestamp, index) => {
const time = String(timestamp);
if (time.slice(0, 10) === requestedDate) {
result.push({
time,
temp: nullableNumber(hourlyTemperatures[index])
});
}
return result;
}, []);
if (!hours.length || !hours.some((hour) => hour.temp !== null)) {
throw new Error("Missing hourly temperatures");
}
return {
maximum,
minimum,
weatherCode: weatherCodeValue === null ? -1 : Math.round(weatherCodeValue),
hours
};
}
function renderForecast(forecast) {
const [condition, description, kind] = weatherForCode(forecast.weatherCode);
const theme = applyTheme(kind);
const range = Math.abs(forecast.maximum - forecast.minimum);
ui.weatherIcon.innerHTML = weatherIcon(kind);
ui.condition.textContent = condition;
ui.highTemp.textContent = formatTemperature(forecast.maximum);
ui.lowInline.textContent = formatTemperature(forecast.minimum) + "°C";
ui.forecastKicker.textContent = isHistorical ? "Historical weather" : "Daily forecast";
ui.forecastTitle.textContent = weekday(requestedDate) + " at a glance";
ui.conditionDetail.textContent = condition;
ui.rangeDetail.textContent = description + " " + formatTemperature(range) + "°C daily range.";
ui.maxTemp.textContent = formatTemperature(forecast.maximum);
ui.minTemp.textContent = formatTemperature(forecast.minimum);
ui.dataSource.textContent = isHistorical
? "Historical weather · Open-Meteo compatible"
: "Forecast data · Open-Meteo compatible";
ui.statusMessage.textContent = "Weather data loaded for " + locationName + ".";
ui.card.setAttribute("aria-busy", "false");
renderChart(forecast.hours, theme.chart);
renderHourlyStrip(forecast.hours);
document.title = locationName + " weather · " + requestedDate;
}
function showError() {
applyTheme("fog");
ui.weatherIcon.innerHTML = weatherIcon("cloud");
ui.condition.textContent = "Weather unavailable";
ui.highTemp.textContent = "—";
ui.lowInline.textContent = "Unavailable";
ui.forecastKicker.textContent = "Data unavailable";
ui.forecastTitle.textContent = "Weather data unavailable";
ui.endpointTag.textContent = "Unavailable";
ui.conditionDetail.textContent = "Weather data could not be loaded.";
ui.rangeDetail.textContent = "Check the requested date and try again.";
ui.maxTemp.textContent = "—";
ui.minTemp.textContent = "—";
ui.dataSource.textContent = "The weather service did not return data";
ui.statusMessage.textContent = "Weather data could not be loaded.";
ui.chartWrap.innerHTML = `
<div class="chart-error" role="status">
<span class="error-symbol">!</span>
<strong>Weather data could not be loaded.</strong>
<p>Check the requested date and try again.</p>
</div>
`;
ui.hourlyReadings.replaceChildren();
ui.card.setAttribute("aria-busy", "false");
}
ui.locationName.textContent = locationName;
ui.dateLabel.textContent = formatDate(requestedDate) + " · UTC";
ui.endpointTag.textContent = isHistorical ? "Archive" : "Forecast";
ui.coordinateLabel.textContent =
formatCoordinate(latitude, "N", "S") + " · " +
formatCoordinate(longitude, "E", "W");
ui.weatherIcon.innerHTML = weatherIcon("cloud");
async function loadWeather() {
const endpoint = isHistorical ? "/api/om/archive" : "/api/om/forecast";
const params = new URLSearchParams({
latitude: String(latitude),
longitude: String(longitude),
daily: "temperature_2m_max,temperature_2m_min,weather_code",
hourly: "temperature_2m",
timezone: "UTC",
temperature_unit: "celsius",
start_date: requestedDate,
end_date: requestedDate
});
try {
const response = await fetch(endpoint + "?" + params.toString());
if (!response.ok) throw new Error("Weather request failed");
const payload = await response.json();
renderForecast(extractForecast(payload));
} catch (error) {
showError();
}
}
loadWeather();
})();
</script>
</body>
</html>L1 — cheap deterministic descriptors
| bytes total | 40,656 | html / css / js | 3,841 / 15,339 / 21,476 |
|---|---|---|---|
| dom nodes | 76 | dom depth | 9 |
| css rules | 91 | js present | yes |
| brightness | 208.1 | contrast | 63.5 |
| colorfulness | 20.0 | whitespace | 75.4% |
This slot's telemetry
| prompt tokens | 3 | completion tokens | 27,482 |
|---|---|---|---|
| total tokens | 27,485 | wall | 250.7 s |
| cost | — | request id | — |
config.json568 B
{
"N": 2,
"auth": {
"credential_ref": "WCB_NONE",
"method": "oauth-login"
},
"billing": "plan",
"config_id": "gpt-5.6-terra-eff-max--cli--cursor--dev",
"effort": "max",
"family": "gpt",
"m": {
"min": 2,
"q": 2
},
"model_id": "gpt-5.6-terra",
"protocol": "cli",
"served_model": "gpt-5.6-terra-max",
"telemetry": {
"completion_tokens": 64164,
"cost_usd": null,
"prompt_tokens": 12,
"total_tokens": 64176,
"wall_ms": 571405
},
"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.6-terra-eff-max--cli--cursor--dev",
"positions": [
{
"attempts": [
{
"attempt_index": 0,
"backoff_ms": null,
"charged": true,
"ended_at": "2026-08-13T01:01:44.802897+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T00:59:55.089529+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-13T01:05:59.224053+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T01:01:48.483952+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-13T01:08:47.500715+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T01:06:02.589815+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-13T01:09:37.731655+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T01:08:51.690738+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
}
}
}