claude-opus-5 @ high · cursor-xl
cursor-xlhigh
- config
- claude-opus-5-eff-high--cli--cursor-xl--dev
- batch
- 2026-07-19--unified
- transport
- cursor-agent-cli-isolated-home
- protocol
- cli · plan
- served model
- claude-opus-5-high
- 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
claude-opus-5 @xhigh · CC0.73claude-opus-5-thinking @medium · cursor-xl0.73claude-fable-5 @high · cursor-xl0.73claude-fable-5-1 @high · CC0.72claude-fable-5 @xhigh · CC0.72farthest
north-mini-code-free · api0.49claude-sonnet-4 · cursor0.50claude-sonnet-4-5-thinking · cursor-xl0.51claude-sonnet-4 · cursor-xl0.51claude-sonnet-4 · kiro0.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 tempmatchshown: 25.3
- 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=1280, initial-scale=1" />
<title>Weather Card</title>
<style>
:root{
--bg-0:#0b1020;
--bg-1:#131a35;
--tint-a:#4f8cff;
--tint-b:#7de2ff;
--ink:#f2f5ff;
--ink-dim:rgba(242,245,255,.66);
--ink-faint:rgba(242,245,255,.42);
--stroke:rgba(255,255,255,.10);
--stroke-soft:rgba(255,255,255,.06);
--panel:rgba(255,255,255,.055);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
width:1280px;
min-height:800px;
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,"Helvetica Neue",Arial,sans-serif;
color:var(--ink);
background:var(--bg-0);
display:flex;
align-items:center;
justify-content:center;
overflow-x:hidden;
-webkit-font-smoothing:antialiased;
font-variant-numeric:tabular-nums;
}
/* ---------- ambient background ---------- */
.scene{
position:fixed;
inset:0;
background:
radial-gradient(1100px 700px at 14% -8%, color-mix(in srgb, var(--tint-a) 40%, transparent) 0%, transparent 62%),
radial-gradient(900px 620px at 92% 6%, color-mix(in srgb, var(--tint-b) 30%, transparent) 0%, transparent 58%),
radial-gradient(1000px 800px at 78% 108%, color-mix(in srgb, var(--tint-a) 22%, transparent) 0%, transparent 60%),
linear-gradient(165deg, var(--bg-1) 0%, var(--bg-0) 68%);
transition:background .9s ease;
}
.scene::after{
content:"";
position:absolute;
inset:0;
background-image:radial-gradient(rgba(255,255,255,.045) 1px, transparent 1px);
background-size:3px 3px;
mix-blend-mode:overlay;
opacity:.55;
}
/* ---------- card ---------- */
.card{
position:relative;
width:1120px;
min-height:648px;
display:grid;
grid-template-columns:420px 1fr;
border-radius:28px;
background:linear-gradient(150deg, rgba(255,255,255,.10), rgba(255,255,255,.035) 46%, rgba(255,255,255,.055));
border:1px solid var(--stroke);
box-shadow:
0 1px 0 rgba(255,255,255,.16) inset,
0 40px 90px -30px rgba(0,0,0,.75),
0 0 0 1px rgba(0,0,0,.18);
backdrop-filter:blur(26px) saturate(150%);
-webkit-backdrop-filter:blur(26px) saturate(150%);
overflow:hidden;
animation:rise .7s cubic-bezier(.2,.8,.25,1) both;
}
@keyframes rise{from{opacity:0;transform:translateY(16px) scale(.99)}to{opacity:1;transform:none}}
/* ---------- left: summary ---------- */
.summary{
position:relative;
padding:40px 36px 34px;
display:flex;
flex-direction:column;
gap:6px;
border-right:1px solid var(--stroke-soft);
background:linear-gradient(180deg, color-mix(in srgb, var(--tint-a) 20%, transparent), transparent 58%);
}
.eyebrow{
display:inline-flex;
align-items:center;
gap:8px;
align-self:flex-start;
padding:6px 12px 6px 10px;
border-radius:999px;
background:rgba(255,255,255,.09);
border:1px solid var(--stroke);
font-size:11.5px;
letter-spacing:.14em;
text-transform:uppercase;
color:var(--ink-dim);
}
.dot{width:7px;height:7px;border-radius:50%;background:var(--tint-b);box-shadow:0 0 10px var(--tint-b)}
.place{
margin-top:18px;
font-size:42px;
line-height:1.06;
font-weight:650;
letter-spacing:-.022em;
overflow-wrap:anywhere;
}
.date{margin-top:10px;font-size:15px;color:var(--ink-dim);letter-spacing:.005em}
.coords{margin-top:4px;font-size:12.5px;color:var(--ink-faint);letter-spacing:.03em}
.icon-wrap{margin:26px 0 6px;width:112px;height:112px;filter:drop-shadow(0 12px 26px rgba(0,0,0,.42))}
.icon-wrap svg{width:100%;height:100%;display:block}
.condition{font-size:21px;font-weight:600;letter-spacing:-.01em;margin-top:6px}
.temp{display:flex;align-items:flex-start;gap:4px;margin-top:14px}
.temp .val{font-size:96px;line-height:.92;font-weight:600;letter-spacing:-.05em}
.temp .unit{font-size:30px;font-weight:500;color:var(--ink-dim);margin-top:8px}
.range{display:flex;gap:10px;margin-top:26px}
.pill{
flex:1;
padding:14px 16px;
border-radius:16px;
background:var(--panel);
border:1px solid var(--stroke);
}
.pill .k{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-faint)}
.pill .v{margin-top:6px;font-size:26px;font-weight:600;letter-spacing:-.02em}
.pill.max .v{color:#ffd08a}
.pill.min .v{color:#9fd6ff}
.foot{margin-top:auto;padding-top:22px;font-size:11.5px;color:var(--ink-faint);letter-spacing:.02em}
/* ---------- right: detail ---------- */
.detail{padding:40px 36px 32px;display:flex;flex-direction:column;min-width:0}
.detail-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.h2{font-size:15px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim)}
.legend{font-size:12px;color:var(--ink-faint)}
.chart{
margin-top:16px;
position:relative;
height:258px;
border-radius:20px;
background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
border:1px solid var(--stroke-soft);
overflow:hidden;
}
.chart svg{width:100%;height:100%;display:block}
.chart .empty{
position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
font-size:13.5px;color:var(--ink-faint);
}
.hours{
margin-top:20px;
display:grid;
grid-template-columns:repeat(8,1fr);
gap:8px;
}
.hour{
padding:10px 8px 11px;
border-radius:13px;
background:rgba(255,255,255,.045);
border:1px solid var(--stroke-soft);
text-align:center;
transition:background .2s ease,border-color .2s ease,transform .2s ease;
}
.hour:hover{background:rgba(255,255,255,.09);border-color:var(--stroke);transform:translateY(-1px)}
.hour .hh{font-size:11px;color:var(--ink-faint);letter-spacing:.06em}
.hour .tt{margin-top:4px;font-size:16px;font-weight:600;letter-spacing:-.015em}
.hour .bar{margin-top:7px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--tint-a),var(--tint-b));opacity:.85}
.hour.peak{border-color:rgba(255,208,138,.45);background:rgba(255,208,138,.10)}
.hour.peak .tt{color:#ffd08a}
.hour.low{border-color:rgba(159,214,255,.42);background:rgba(159,214,255,.09)}
.hour.low .tt{color:#9fd6ff}
/* ---------- states ---------- */
.state{
grid-column:1 / -1;
min-height:648px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:14px;
padding:60px;
text-align:center;
}
.state h1{font-size:26px;font-weight:620;letter-spacing:-.02em}
.state p{font-size:14.5px;color:var(--ink-dim);max-width:560px;line-height:1.6}
.state .code{
margin-top:6px;font-size:12px;color:var(--ink-faint);
font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
background:rgba(255,255,255,.05);border:1px solid var(--stroke-soft);
padding:8px 14px;border-radius:10px;overflow-wrap:anywhere;
}
.state .badge{
width:64px;height:64px;border-radius:50%;
display:flex;align-items:center;justify-content:center;
background:rgba(255,255,255,.06);border:1px solid var(--stroke);
margin-bottom:4px;
}
.state.error .badge{background:rgba(255,120,120,.12);border-color:rgba(255,120,120,.35)}
.spinner{
width:34px;height:34px;border-radius:50%;
border:2.5px solid rgba(255,255,255,.14);
border-top-color:var(--tint-b);
animation:spin .85s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.hidden{display:none !important}
</style>
</head>
<body>
<div class="scene" id="scene"></div>
<main class="card" id="card" aria-live="polite">
<!-- loading -->
<section class="state" id="loadingState">
<div class="spinner" role="status" aria-label="Loading"></div>
<p>Loading weather…</p>
</section>
<!-- error -->
<section class="state error hidden" id="errorState" role="alert">
<div class="badge">
<svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#ff9a9a" stroke-width="1.8" stroke-linecap="round">
<path d="M12 7.5v6"/><circle cx="12" cy="17" r=".9" fill="#ff9a9a" stroke="none"/>
<path d="M10.3 3.6 2.6 17.4A2 2 0 0 0 4.3 20.4h15.4a2 2 0 0 0 1.7-3L13.7 3.6a2 2 0 0 0-3.4 0Z" stroke-linejoin="round"/>
</svg>
</div>
<h1>Weather data could not be loaded</h1>
<p id="errorMsg">The weather service did not return usable data for this location and date.</p>
<div class="code" id="errorDetail"></div>
</section>
<!-- content -->
<section class="summary hidden" id="summary">
<span class="eyebrow"><span class="dot"></span><span id="sourceLabel">Forecast</span></span>
<h1 class="place" id="place">Berlin</h1>
<div class="date" id="dateLabel">—</div>
<div class="coords" id="coords">—</div>
<div class="icon-wrap" id="icon"></div>
<div class="condition" id="condition">—</div>
<div class="temp"><span class="val" id="bigTemp">—</span><span class="unit">°C</span></div>
<div class="range">
<div class="pill max">
<div class="k">High</div>
<div class="v" id="tmax">—</div>
</div>
<div class="pill min">
<div class="k">Low</div>
<div class="v" id="tmin">—</div>
</div>
</div>
<div class="foot" id="foot">Temperatures in °C · Times in UTC</div>
</section>
<section class="detail hidden" id="detail">
<div class="detail-head">
<h2 class="h2">Hourly temperature</h2>
<span class="legend" id="chartLegend">°C · UTC</span>
</div>
<div class="chart" id="chart"></div>
<div class="hours" id="hours"></div>
</section>
</main>
<script>
(function () {
"use strict";
var THEMES = {
clear: { a:"#ffb347", b:"#ff7a59", bg0:"#1a1030", bg1:"#3a1f4d" },
cloudy: { a:"#7f9bc4", b:"#b9cbe3", bg0:"#0e131f", bg1:"#242c3d" },
fog: { a:"#8e9aa8", b:"#c7d0d9", bg0:"#11151b", bg1:"#2a3038" },
rain: { a:"#4f8cff", b:"#7de2ff", bg0:"#080f1f", bg1:"#152341" },
snow: { a:"#8fd0ff", b:"#e6f4ff", bg0:"#0c1524", bg1:"#1e2f47" },
thunder: { a:"#8b6cff", b:"#f2c94c", bg0:"#0a0a1c", bg1:"#221a45" }
};
var CODES = {
0:["Clear sky","clear"],
1:["Mainly clear","clear"],
2:["Partly cloudy","cloudy"],
3:["Overcast","cloudy"],
45:["Fog","fog"], 48:["Depositing rime fog","fog"],
51:["Light drizzle","rain"], 53:["Moderate drizzle","rain"], 55:["Dense drizzle","rain"],
56:["Light freezing drizzle","rain"], 57:["Dense freezing drizzle","rain"],
61:["Slight rain","rain"], 63:["Moderate rain","rain"], 65:["Heavy rain","rain"],
66:["Light freezing rain","rain"], 67:["Heavy freezing rain","rain"],
71:["Slight snowfall","snow"], 73:["Moderate snowfall","snow"], 75:["Heavy snowfall","snow"],
77:["Snow grains","snow"],
80:["Slight rain showers","rain"], 81:["Moderate rain showers","rain"], 82:["Violent rain showers","rain"],
85:["Slight snow showers","snow"], 86:["Heavy snow showers","snow"],
95:["Thunderstorm","thunder"], 96:["Thunderstorm with hail","thunder"], 99:["Thunderstorm with heavy hail","thunder"]
};
var $ = function (id) { return document.getElementById(id); };
function num(v) { return typeof v === "number" && isFinite(v); }
function fmt(v) {
if (!num(v)) return "—";
var r = Math.round(v * 10) / 10;
return (Math.abs(r % 1) < 0.05 ? String(Math.round(r)) : r.toFixed(1));
}
function todayUTC() {
return new Date().toISOString().slice(0, 10);
}
function readParams() {
var q = new URLSearchParams(location.search);
var lat = parseFloat(q.get("lat"));
var lon = parseFloat(q.get("lon"));
var name = (q.get("name") || "").trim();
var date = (q.get("date") || "").trim();
if (!/^\d{4}-\d{2}-\d{2}$/.test(date) || isNaN(Date.parse(date + "T00:00:00Z"))) {
date = todayUTC();
}
return {
lat: isFinite(lat) ? lat : 52.52,
lon: isFinite(lon) ? lon : 13.405,
name: name || "Berlin",
date: date
};
}
function prettyDate(iso) {
var d = new Date(iso + "T00:00:00Z");
try {
return new Intl.DateTimeFormat("en-GB", {
weekday: "long", day: "numeric", month: "long", year: "numeric", timeZone: "UTC"
}).format(d);
} catch (e) {
return iso;
}
}
function coordText(lat, lon) {
var la = Math.abs(lat).toFixed(3) + "° " + (lat >= 0 ? "N" : "S");
var lo = Math.abs(lon).toFixed(3) + "° " + (lon >= 0 ? "E" : "W");
return la + ", " + lo;
}
function applyTheme(group) {
var t = THEMES[group] || THEMES.cloudy;
var r = document.documentElement.style;
r.setProperty("--tint-a", t.a);
r.setProperty("--tint-b", t.b);
r.setProperty("--bg-0", t.bg0);
r.setProperty("--bg-1", t.bg1);
}
/* ---------------- icons ---------------- */
function svg(inner) {
return '<svg viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">' +
'<defs>' +
'<linearGradient id="gSun" x1="0" y1="0" x2="1" y2="1">' +
'<stop offset="0%" stop-color="#ffe08a"/><stop offset="100%" stop-color="#ff9d4d"/>' +
'</linearGradient>' +
'<linearGradient id="gCloud" x1="0" y1="0" x2="0.4" y2="1">' +
'<stop offset="0%" stop-color="#ffffff"/><stop offset="100%" stop-color="#c2d3e8"/>' +
'</linearGradient>' +
'<linearGradient id="gDrop" x1="0" y1="0" x2="0" y2="1">' +
'<stop offset="0%" stop-color="#9fd6ff"/><stop offset="100%" stop-color="#4f8cff"/>' +
'</linearGradient>' +
'</defs>' + inner + '</svg>';
}
function sunShape(cx, cy, r) {
var rays = "";
for (var i = 0; i < 8; i++) {
var a = (Math.PI / 4) * i;
var x1 = cx + Math.cos(a) * (r + 4.5), y1 = cy + Math.sin(a) * (r + 4.5);
var x2 = cx + Math.cos(a) * (r + 10), y2 = cy + Math.sin(a) * (r + 10);
rays += '<line x1="' + x1.toFixed(1) + '" y1="' + y1.toFixed(1) + '" x2="' + x2.toFixed(1) +
'" y2="' + y2.toFixed(1) + '" stroke="url(#gSun)" stroke-width="3.2" stroke-linecap="round"/>';
}
return rays + '<circle cx="' + cx + '" cy="' + cy + '" r="' + r + '" fill="url(#gSun)"/>';
}
var CLOUD = '<path d="M20 44h23a10 10 0 0 0 1.2-19.9A14 14 0 0 0 17.4 27 9.5 9.5 0 0 0 20 44Z" fill="url(#gCloud)"/>';
function drops(color) {
var s = "";
[24, 33, 42].forEach(function (x, i) {
s += '<line x1="' + x + '" y1="' + (48 + (i % 2) * 2) + '" x2="' + (x - 3) + '" y2="' + (57 + (i % 2) * 2) +
'" stroke="' + color + '" stroke-width="3.4" stroke-linecap="round"/>';
});
return s;
}
function flakes() {
var s = "";
[24, 33, 42].forEach(function (x, i) {
s += '<circle cx="' + x + '" cy="' + (52 + (i % 2) * 4) + '" r="2.8" fill="#e6f4ff"/>';
});
return s;
}
function iconFor(group) {
switch (group) {
case "clear":
return svg(sunShape(32, 30, 13));
case "cloudy":
return svg(sunShape(24, 22, 8.5) + CLOUD);
case "fog":
return svg(CLOUD +
'<line x1="18" y1="51" x2="46" y2="51" stroke="#c7d0d9" stroke-width="3.2" stroke-linecap="round"/>' +
'<line x1="22" y1="58" x2="42" y2="58" stroke="#c7d0d9" stroke-width="3.2" stroke-linecap="round" opacity=".7"/>');
case "rain":
return svg(CLOUD + drops("url(#gDrop)"));
case "snow":
return svg(CLOUD + flakes());
case "thunder":
return svg(CLOUD +
'<path d="M34 46 26 58h6l-2 8 10-13h-6l3-7Z" fill="#f2c94c"/>');
default:
return svg(CLOUD);
}
}
/* ---------------- chart ---------------- */
function smoothPath(pts) {
if (!pts.length) return "";
if (pts.length === 1) return "M" + pts[0].x + "," + pts[0].y;
var d = "M" + pts[0].x.toFixed(2) + "," + pts[0].y.toFixed(2);
for (var i = 0; i < pts.length - 1; i++) {
var p0 = pts[i - 1] || pts[i], p1 = pts[i], p2 = pts[i + 1], p3 = pts[i + 2] || p2;
var t = 0.2;
var c1x = p1.x + (p2.x - p0.x) * t, c1y = p1.y + (p2.y - p0.y) * t;
var c2x = p2.x - (p3.x - p1.x) * t, c2y = p2.y - (p3.y - p1.y) * t;
d += " C" + c1x.toFixed(2) + "," + c1y.toFixed(2) + " " + c2x.toFixed(2) + "," + c2y.toFixed(2) +
" " + p2.x.toFixed(2) + "," + p2.y.toFixed(2);
}
return d;
}
function renderChart(host, series) {
var valid = series.filter(function (p) { return num(p.t); });
if (valid.length < 2) {
host.innerHTML = '<div class="empty">No hourly temperatures available for this date.</div>';
return;
}
var W = 720, H = 258, PL = 44, PR = 24, PT = 30, PB = 30;
var iw = W - PL - PR, ih = H - PT - PB;
var temps = valid.map(function (p) { return p.t; });
var lo = Math.min.apply(null, temps), hi = Math.max.apply(null, temps);
if (hi - lo < 2) { var mid = (hi + lo) / 2; lo = mid - 1; hi = mid + 1; }
var pad = (hi - lo) * 0.18;
lo -= pad; hi += pad;
var maxHour = series.length > 1 ? series[series.length - 1].h : 23;
var X = function (h) { return PL + (maxHour ? (h / maxHour) : 0) * iw; };
var Y = function (t) { return PT + (1 - (t - lo) / (hi - lo)) * ih; };
var pts = valid.map(function (p) { return { x: X(p.h), y: Y(p.t), t: p.t, h: p.h }; });
var grid = "", ticks = 4;
for (var g = 0; g <= ticks; g++) {
var tv = lo + (hi - lo) * (g / ticks);
var y = Y(tv);
grid += '<line x1="' + PL + '" y1="' + y.toFixed(1) + '" x2="' + (W - PR) + '" y2="' + y.toFixed(1) +
'" stroke="rgba(255,255,255,.075)" stroke-width="1"/>' +
'<text x="' + (PL - 10) + '" y="' + (y + 4).toFixed(1) + '" text-anchor="end" ' +
'fill="rgba(242,245,255,.42)" font-size="11">' + Math.round(tv) + '°</text>';
}
var xl = "";
series.forEach(function (p) {
if (p.h % 3 !== 0) return;
var x = X(p.h);
xl += '<text x="' + x.toFixed(1) + '" y="' + (H - 9) + '" text-anchor="middle" ' +
'fill="rgba(242,245,255,.42)" font-size="11">' + String(p.h).padStart(2, "0") + '</text>';
});
var line = smoothPath(pts);
var area = line + " L" + pts[pts.length - 1].x.toFixed(2) + "," + (H - PB) +
" L" + pts[0].x.toFixed(2) + "," + (H - PB) + " Z";
var hiP = pts.reduce(function (a, b) { return b.t > a.t ? b : a; }, pts[0]);
var loP = pts.reduce(function (a, b) { return b.t < a.t ? b : a; }, pts[0]);
function marker(p, color, label) {
var above = p === hiP;
var ly = above ? Math.max(p.y - 14, PT - 12) : Math.min(p.y + 22, H - PB - 4);
var lx = Math.min(Math.max(p.x, PL + 18), W - PR - 18);
return '<circle cx="' + p.x.toFixed(1) + '" cy="' + p.y.toFixed(1) + '" r="5.5" fill="' + color + '" opacity=".22"/>' +
'<circle cx="' + p.x.toFixed(1) + '" cy="' + p.y.toFixed(1) + '" r="3.2" fill="' + color + '"/>' +
'<text x="' + lx.toFixed(1) + '" y="' + ly.toFixed(1) + '" text-anchor="middle" fill="' + color +
'" font-size="12" font-weight="600">' + label + '</text>';
}
var dots = pts.map(function (p) {
return '<circle cx="' + p.x.toFixed(1) + '" cy="' + p.y.toFixed(1) +
'" r="2" fill="rgba(255,255,255,.55)"><title>' + String(p.h).padStart(2, "0") +
':00 UTC · ' + fmt(p.t) + ' °C</title></circle>';
}).join("");
host.innerHTML =
'<svg viewBox="0 0 ' + W + ' ' + H + '" preserveAspectRatio="none" role="img" ' +
'aria-label="Hourly temperature chart in degrees Celsius">' +
'<defs>' +
'<linearGradient id="areaFill" x1="0" y1="0" x2="0" y2="1">' +
'<stop offset="0%" stop-color="var(--tint-b)" stop-opacity=".42"/>' +
'<stop offset="100%" stop-color="var(--tint-a)" stop-opacity="0"/>' +
'</linearGradient>' +
'<linearGradient id="lineStroke" x1="0" y1="0" x2="1" y2="0">' +
'<stop offset="0%" stop-color="var(--tint-a)"/>' +
'<stop offset="100%" stop-color="var(--tint-b)"/>' +
'</linearGradient>' +
'</defs>' +
grid + xl +
'<path d="' + area + '" fill="url(#areaFill)"/>' +
'<path d="' + line + '" fill="none" stroke="url(#lineStroke)" stroke-width="2.6" ' +
'stroke-linecap="round" stroke-linejoin="round"/>' +
dots +
marker(hiP, "#ffd08a", fmt(hiP.t) + "°") +
marker(loP, "#9fd6ff", fmt(loP.t) + "°") +
'</svg>';
}
function renderHours(host, series) {
var valid = series.filter(function (p) { return num(p.t); });
if (!valid.length) { host.innerHTML = ""; return; }
var temps = valid.map(function (p) { return p.t; });
var lo = Math.min.apply(null, temps), hi = Math.max.apply(null, temps);
var span = Math.max(hi - lo, 0.001);
host.innerHTML = series.map(function (p) {
var has = num(p.t);
var cls = "hour" + (has && p.t === hi ? " peak" : "") + (has && p.t === lo ? " low" : "");
var w = has ? (18 + 82 * (p.t - lo) / span) : 0;
return '<div class="' + cls + '">' +
'<div class="hh">' + String(p.h).padStart(2, "0") + ':00</div>' +
'<div class="tt">' + (has ? fmt(p.t) + "°" : "—") + '</div>' +
'<div class="bar" style="width:' + w.toFixed(0) + '%;margin:7px auto 0"></div>' +
'</div>';
}).join("");
}
/* ---------------- data ---------------- */
function buildURL(p) {
var past = p.date < todayUTC();
var base = past ? "/api/om/archive" : "/api/om/forecast";
var q = new URLSearchParams({
latitude: String(p.lat),
longitude: String(p.lon),
daily: "temperature_2m_max,temperature_2m_min,weather_code",
hourly: "temperature_2m",
timezone: "UTC",
temperature_unit: "celsius",
start_date: p.date,
end_date: p.date
});
return { url: base + "?" + q.toString(), past: past };
}
function showError(msg, detail) {
$("loadingState").classList.add("hidden");
$("summary").classList.add("hidden");
$("detail").classList.add("hidden");
$("errorState").classList.remove("hidden");
if (msg) $("errorMsg").textContent = msg;
var d = $("errorDetail");
if (detail) { d.textContent = detail; } else { d.classList.add("hidden"); }
}
function render(p, data, past) {
var daily = data && data.daily;
var tmax = daily && daily.temperature_2m_max ? daily.temperature_2m_max[0] : null;
var tmin = daily && daily.temperature_2m_min ? daily.temperature_2m_min[0] : null;
var code = daily && daily.weather_code ? daily.weather_code[0] : null;
var series = [];
var hourly = data && data.hourly;
if (hourly && Array.isArray(hourly.time) && Array.isArray(hourly.temperature_2m)) {
hourly.time.forEach(function (ts, i) {
if (typeof ts !== "string" || ts.slice(0, 10) !== p.date) return;
var h = parseInt(ts.slice(11, 13), 10);
if (!isFinite(h)) return;
var t = hourly.temperature_2m[i];
series.push({ h: h, t: num(t) ? t : null });
});
series.sort(function (a, b) { return a.h - b.h; });
}
var hasHourly = series.some(function (s) { return num(s.t); });
if (!num(tmax) && !num(tmin) && !hasHourly) {
showError(
"The weather service returned no temperatures for " + p.name + " on " + p.date + ".",
"Empty dataset from " + (past ? "/api/om/archive" : "/api/om/forecast")
);
return;
}
if (!num(tmax) && hasHourly) {
tmax = Math.max.apply(null, series.filter(function (s) { return num(s.t); }).map(function (s) { return s.t; }));
}
if (!num(tmin) && hasHourly) {
tmin = Math.min.apply(null, series.filter(function (s) { return num(s.t); }).map(function (s) { return s.t; }));
}
var info = CODES[code] || ["Condition unavailable", "cloudy"];
applyTheme(info[1]);
$("place").textContent = p.name;
document.title = p.name + " · " + p.date + " · Weather";
$("dateLabel").textContent = prettyDate(p.date);
$("coords").textContent = coordText(p.lat, p.lon);
$("sourceLabel").textContent = past ? "Archive" : "Forecast";
$("icon").innerHTML = iconFor(info[1]);
$("condition").textContent = info[0];
$("bigTemp").textContent = fmt(tmax);
$("tmax").textContent = fmt(tmax) + " °C";
$("tmin").textContent = fmt(tmin) + " °C";
$("foot").textContent = "Temperatures in °C · Hours in UTC · " +
(past ? "Historical reanalysis" : "Forecast model") + " · WMO code " + (num(code) ? code : "n/a");
renderChart($("chart"), series);
renderHours($("hours"), series);
$("loadingState").classList.add("hidden");
$("errorState").classList.add("hidden");
$("summary").classList.remove("hidden");
$("detail").classList.remove("hidden");
}
function init() {
var p = readParams();
var req = buildURL(p);
fetch(req.url, { headers: { accept: "application/json" } })
.then(function (res) {
if (!res.ok) throw new Error("HTTP " + res.status + " " + (res.statusText || ""));
return res.json();
})
.then(function (data) {
if (!data || typeof data !== "object") throw new Error("Malformed response");
if (data.error) throw new Error(String(data.reason || "API error"));
render(p, data, req.past);
})
.catch(function (err) {
showError(
"We couldn't reach the weather service or the response was invalid, so no data can be shown for " +
p.name + " on " + p.date + ".",
(err && err.message ? err.message : "Unknown error") + " — " + req.url
);
});
}
if (document.readyState === "loading") {
document.addEventListener("DOMContentLoaded", init);
} else {
init();
}
})();
</script>
</body>
</html>L1 — cheap deterministic descriptors
| bytes total | 25,921 | html / css / js | 2,325 / 7,468 / 16,128 |
|---|---|---|---|
| dom nodes | 48 | dom depth | 7 |
| css rules | 56 | js present | yes |
| brightness | 47.0 | contrast | 25.5 |
| colorfulness | 33.4 | whitespace | 43.4% |
This slot's telemetry
| prompt tokens | 6 | completion tokens | 27,288 |
|---|---|---|---|
| total tokens | 27,294 | wall | 269.8 s |
| cost | — | request id | — |
config.json578 B
{
"N": 2,
"auth": {
"credential_ref": "WCB_NONE",
"method": "oauth-login"
},
"billing": "plan",
"config_id": "claude-opus-5-eff-high--cli--cursor-xl--dev",
"effort": "high",
"family": "claude",
"m": {
"min": 2,
"q": 2
},
"model_id": "claude-opus-5",
"protocol": "cli",
"served_model": "claude-opus-5-high",
"telemetry": {
"completion_tokens": 74521,
"cost_usd": null,
"prompt_tokens": 16,
"total_tokens": 74537,
"wall_ms": 1084958
},
"transport": "cursor-agent-cli-isolated-home",
"vendor_sanction_ref": null
}send-log2.5 KB
{
"N": 2,
"batch_id": "2026-08-13--cursor-xl-s1",
"config_id": "claude-opus-5-eff-high--cli--cursor-xl--dev",
"positions": [
{
"attempts": [
{
"attempt_index": 0,
"backoff_ms": null,
"charged": true,
"ended_at": "2026-08-13T09:45:11.804648+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T09:43:56.654885+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-13T09:49:45.025860+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T09:45:15.204708+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-13T10:01:09.583775+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T09:49:48.655801+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-13T10:02:11.908149+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T10:01:12.841538+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
}
}
}