claude-opus-5 @ high · cursor
cursorhigh
- config
- claude-opus-5-eff-high--cli--cursor--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

non-deterministic render — re-rendering the same input yields different pixels (random or time-dependent content), so the visual channels read this card less stably than the others.
The screenshot is the exact frozen pixels the similarity channels measured. Run live re-executes the raw output in a sandboxed iframe; its rendering depends on your browser and fonts and is not guaranteed to match the measured pixels.
similarity neighbors
nearest
claude-opus-5 @xhigh · CC0.71claude-opus-5-thinking @high · cursor-xl0.71claude-opus-5-thinking @high · cursor0.71claude-opus-5-thinking @max · cursor0.70claude-opus-5-thinking @xhigh · cursor0.70farthest
north-mini-code-free · api0.49claude-sonnet-4 · cursor0.50grok-4.3 @high · api0.50claude-opus-4-5-thinking @high · cursor0.50claude-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 tempambiguousinsufficient-distinct-temperature-nodes
- min tempambiguousinsufficient-distinct-temperature-nodes
- 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=1280, initial-scale=1">
<title>Weather Card</title>
<style>
*, *::before, *::after { box-sizing: border-box; }
:root {
--g1: #0d2b57;
--g2: #2a6bb0;
--g3: #6fa8d6;
--accent: #ffd275;
--ink: #f4f8ff;
--ink-dim: rgba(244, 248, 255, 0.66);
--ink-faint: rgba(244, 248, 255, 0.4);
--stroke: rgba(255, 255, 255, 0.16);
--glass: rgba(255, 255, 255, 0.085);
}
html, body { height: 100%; margin: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
color: var(--ink);
background: var(--g1);
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
-webkit-font-smoothing: antialiased;
}
/* ---------- ambient background ---------- */
.bg { position: fixed; inset: 0; z-index: 0; overflow: hidden; background: linear-gradient(165deg, var(--g1) 0%, var(--g2) 62%, var(--g3) 100%); transition: background 700ms ease; }
.bg::after {
content: ""; position: absolute; inset: 0;
background-image: radial-gradient(rgba(255,255,255,.16) 1px, transparent 1px);
background-size: 3px 3px; opacity: .22; mix-blend-mode: overlay;
}
.blob { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .5; will-change: transform; }
.blob.a { width: 620px; height: 620px; top: -240px; left: -140px; background: var(--accent); opacity: .3; animation: drift1 26s ease-in-out infinite alternate; }
.blob.b { width: 520px; height: 520px; bottom: -220px; right: -120px; background: #ffffff; opacity: .16; animation: drift2 32s ease-in-out infinite alternate; }
.blob.c { width: 420px; height: 420px; top: 40%; right: 22%; background: var(--g3); opacity: .28; animation: drift3 38s ease-in-out infinite alternate; }
@keyframes drift1 { from { transform: translate3d(0,0,0) scale(1); } to { transform: translate3d(90px,60px,0) scale(1.12); } }
@keyframes drift2 { from { transform: translate3d(0,0,0) scale(1.05); } to { transform: translate3d(-80px,-50px,0) scale(1); } }
@keyframes drift3 { from { transform: translate3d(0,0,0); } to { transform: translate3d(-60px,70px,0); } }
/* ---------- card ---------- */
.card {
position: relative; z-index: 1;
width: 1120px; min-height: 692px;
padding: 38px 40px 34px;
border-radius: 30px;
background: var(--glass);
border: 1px solid var(--stroke);
box-shadow: 0 42px 90px -30px rgba(3, 12, 30, .72), inset 0 1px 0 rgba(255,255,255,.22);
backdrop-filter: blur(34px) saturate(150%);
-webkit-backdrop-filter: blur(34px) saturate(150%);
display: flex; flex-direction: column;
animation: rise 720ms cubic-bezier(.2,.8,.25,1) both;
}
@keyframes rise { from { opacity: 0; transform: translateY(18px) scale(.99); } to { opacity: 1; transform: none; } }
/* ---------- header ---------- */
.top { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.loc { display: flex; align-items: center; gap: 12px; min-width: 0; }
.loc svg { flex: none; width: 22px; height: 22px; opacity: .8; }
.loc h1 { margin: 0; font-size: 34px; font-weight: 600; letter-spacing: -.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 560px; }
.coords { margin-top: 5px; font-size: 12.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-faint); font-variant-numeric: tabular-nums; }
.when { text-align: right; }
.when .d { font-size: 17px; font-weight: 500; color: var(--ink-dim); letter-spacing: .01em; }
.when .iso { margin-top: 4px; font-size: 12.5px; letter-spacing: .1em; color: var(--ink-faint); font-variant-numeric: tabular-nums; }
.chip {
display: inline-flex; align-items: center; gap: 7px; margin-top: 10px;
padding: 5px 12px; border-radius: 999px; font-size: 11.5px; font-weight: 600;
letter-spacing: .11em; text-transform: uppercase;
background: rgba(255,255,255,.12); border: 1px solid var(--stroke); color: var(--ink-dim);
}
.chip i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px var(--accent); }
.rule { height: 1px; margin: 26px 0 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.22) 12%, rgba(255,255,255,.22) 88%, transparent); }
/* ---------- hero ---------- */
.hero { display: flex; align-items: center; gap: 44px; padding: 30px 4px 34px; }
.icon { flex: none; width: 168px; height: 168px; filter: drop-shadow(0 14px 26px rgba(0,0,0,.32)); }
.icon svg { width: 100%; height: 100%; }
.readout { min-width: 0; flex: 1; }
.big { display: flex; align-items: flex-start; font-size: 118px; line-height: .86; font-weight: 200; letter-spacing: -.055em; font-variant-numeric: tabular-nums; }
.big .unit { font-size: 34px; font-weight: 400; letter-spacing: 0; margin: 12px 0 0 8px; color: var(--ink-dim); }
.cond { margin-top: 16px; font-size: 25px; font-weight: 500; letter-spacing: -.01em; }
.sub { margin-top: 6px; font-size: 13.5px; color: var(--ink-faint); letter-spacing: .02em; }
.stats { flex: none; display: flex; gap: 14px; }
.stat {
width: 138px; padding: 18px 18px 16px; border-radius: 18px;
background: rgba(255,255,255,.07); border: 1px solid var(--stroke);
}
.stat .k { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); }
.stat .v { margin-top: 10px; font-size: 33px; font-weight: 300; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.stat.max .k svg { color: #ffb08a; }
.stat.min .k svg { color: #9ed2ff; }
.stat .k svg { width: 13px; height: 13px; }
/* ---------- hourly ---------- */
.hourly { margin-top: auto; }
.hhead { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 2px; }
.hhead h2 { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; color: var(--ink-dim); }
.hhead span { font-size: 12px; color: var(--ink-faint); letter-spacing: .06em; font-variant-numeric: tabular-nums; }
.chart { display: block; width: 100%; height: auto; }
.chart text { font-family: inherit; font-variant-numeric: tabular-nums; }
.chart .val { font-size: 12.5px; font-weight: 600; fill: var(--ink); }
.chart .hr { font-size: 11px; fill: var(--ink-faint); letter-spacing: .05em; }
.chart .grid { stroke: rgba(255,255,255,.11); stroke-width: 1; stroke-dasharray: 2 6; }
.chart .line { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linecap: round; filter: drop-shadow(0 4px 12px rgba(0,0,0,.35)); }
.chart .dot { fill: var(--g1); stroke: var(--accent); stroke-width: 2; }
.chart .dot.peak { fill: var(--accent); r: 5; }
.draw { stroke-dasharray: var(--len); stroke-dashoffset: var(--len); animation: draw 1500ms cubic-bezier(.25,.8,.3,1) 120ms forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.fade { opacity: 0; animation: fade 700ms ease 900ms forwards; }
@keyframes fade { to { opacity: 1; } }
/* ---------- states ---------- */
.state { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; flex: 1; gap: 16px; padding: 60px 0; }
.spinner { width: 42px; height: 42px; border-radius: 50%; border: 3px solid rgba(255,255,255,.18); border-top-color: var(--accent); animation: spin 900ms linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.state h2 { margin: 4px 0 0; font-size: 26px; font-weight: 600; letter-spacing: -.02em; }
.state p { margin: 0; max-width: 520px; font-size: 15px; line-height: 1.6; color: var(--ink-dim); }
.state code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; padding: 2px 7px; border-radius: 6px; background: rgba(0,0,0,.25); color: var(--ink-dim); }
.badge-err { width: 62px; height: 62px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,120,120,.16); border: 1px solid rgba(255,150,150,.34); }
.badge-err svg { width: 30px; height: 30px; color: #ffb3b3; }
button.retry {
margin-top: 8px; padding: 11px 22px; border-radius: 999px; cursor: pointer;
font: inherit; font-size: 14px; font-weight: 600; color: var(--ink);
background: rgba(255,255,255,.12); border: 1px solid var(--stroke);
transition: background 160ms ease, transform 160ms ease;
}
button.retry:hover { background: rgba(255,255,255,.2); }
button.retry:active { transform: scale(.97); }
/* ---------- icon motion ---------- */
.sun-rays { transform-origin: 32px 32px; animation: spin 44s linear infinite; }
.sun-core { transform-origin: 32px 32px; animation: pulse 4.5s ease-in-out infinite; }
@keyframes pulse { 50% { transform: scale(1.06); } }
.cloud-g { animation: bob 6.5s ease-in-out infinite; }
@keyframes bob { 50% { transform: translateX(2.5px) translateY(-2px); } }
.drop { animation: fall 1.5s linear infinite; }
.drop:nth-of-type(2) { animation-delay: .35s; }
.drop:nth-of-type(3) { animation-delay: .7s; }
@keyframes fall { 0% { transform: translateY(-3px); opacity: 0; } 25% { opacity: 1; } 100% { transform: translateY(11px); opacity: 0; } }
.flake { transform-box: fill-box; transform-origin: center; animation: twinkle 2.6s ease-in-out infinite; }
.flake:nth-of-type(2) { animation-delay: .8s; }
.flake:nth-of-type(3) { animation-delay: 1.5s; }
@keyframes twinkle { 0%,100% { opacity: .45; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.1); } }
.bolt { animation: flicker 3.2s ease-in-out infinite; }
@keyframes flicker { 0%,42%,52%,100% { opacity: 1; } 46% { opacity: .25; } 49% { opacity: .9; } }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
.draw { stroke-dashoffset: 0; }
.fade { opacity: 1; }
}
</style>
</head>
<body>
<div class="bg" id="bg">
<div class="blob a"></div>
<div class="blob b"></div>
<div class="blob c"></div>
</div>
<main class="card" id="card">
<div class="state" id="loading">
<div class="spinner"></div>
<h2>Loading weather</h2>
<p id="loadingMsg">Fetching conditions…</p>
</div>
</main>
<script>
(function () {
"use strict";
/* ---------------- query parameters ---------------- */
var qs = new URLSearchParams(location.search);
function coord(raw, fallback, limit) {
var n = parseFloat(raw);
return (isFinite(n) && Math.abs(n) <= limit) ? n : fallback;
}
var lat = coord(qs.get("lat"), 52.52, 90);
var lon = coord(qs.get("lon"), 13.405, 180);
var name = (qs.get("name") || "").trim() || "Berlin";
var todayUTC = new Date().toISOString().slice(0, 10);
var date = (qs.get("date") || "").trim();
if (!/^\d{4}-\d{2}-\d{2}$/.test(date) || isNaN(Date.parse(date + "T00:00:00Z"))) date = todayUTC;
var isPast = date < todayUTC;
var path = isPast ? "/api/om/archive" : "/api/om/forecast";
/* ---------------- WMO weather codes ---------------- */
var CODES = {
0: ["Clear sky", "clear"],
1: ["Mainly clear", "clear"],
2: ["Partly cloudy", "partly"],
3: ["Overcast", "cloudy"],
45: ["Fog", "fog"],
48: ["Depositing rime fog", "fog"],
51: ["Light drizzle", "drizzle"],
53: ["Moderate drizzle", "drizzle"],
55: ["Dense drizzle", "drizzle"],
56: ["Light freezing drizzle", "drizzle"],
57: ["Dense freezing drizzle", "drizzle"],
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 slight hail", "thunder"],
99: ["Thunderstorm with heavy hail", "thunder"]
};
var THEMES = {
clear: { g1: "#0a3573", g2: "#2f7ec4", g3: "#8cc4e8", accent: "#ffd275" },
partly: { g1: "#123a68", g2: "#4179ab", g3: "#9dc3de", accent: "#ffe0a8" },
cloudy: { g1: "#26333f", g2: "#4f6577", g3: "#8fa4b4", accent: "#d8e7f3" },
fog: { g1: "#333c46", g2: "#63727f", g3: "#a3b0ba", accent: "#e3ecf2" },
drizzle: { g1: "#0f2739", g2: "#2f5f7c", g3: "#7ba6bd", accent: "#8fd6f0" },
rain: { g1: "#0b2130", g2: "#26536e", g3: "#6b9cb6", accent: "#7fd0ef" },
snow: { g1: "#22364f", g2: "#537ba4", g3: "#a9c8de", accent: "#eaf6ff" },
thunder: { g1: "#191333", g2: "#443a6d", g3: "#8d81be", accent: "#c9b8ff" }
};
/* ---------------- inline icons ---------------- */
var CLOUD = '<g class="cloud-g"><ellipse cx="26" cy="37" rx="12.5" ry="10.5"/><ellipse cx="40" cy="34" rx="13.5" ry="11.5"/><rect x="13.5" y="38" width="39" height="11" rx="5.5"/></g>';
function rays() {
var out = '<g class="sun-rays" stroke="currentColor" stroke-width="3.4" stroke-linecap="round">';
for (var i = 0; i < 8; i++) {
var a = i * Math.PI / 4;
var x1 = 32 + Math.cos(a) * 20.5, y1 = 32 + Math.sin(a) * 20.5;
var x2 = 32 + Math.cos(a) * 27.5, y2 = 32 + Math.sin(a) * 27.5;
out += '<line x1="' + x1.toFixed(1) + '" y1="' + y1.toFixed(1) + '" x2="' + x2.toFixed(1) + '" y2="' + y2.toFixed(1) + '"/>';
}
return out + "</g>";
}
function svgIcon(group) {
var head = '<svg viewBox="0 0 64 64" role="img" aria-hidden="true">';
var sunColor = 'style="color:var(--accent)"';
var cloudFill = 'fill="#f3f8ff" fill-opacity=".93"';
switch (group) {
case "clear":
return head + '<g ' + sunColor + ' fill="currentColor">' + rays() +
'<circle class="sun-core" cx="32" cy="32" r="13.5"/></g></svg>';
case "partly":
return head + '<g ' + sunColor + ' fill="currentColor"><g class="sun-rays" stroke="currentColor" stroke-width="3" stroke-linecap="round">' +
'<line x1="24" y1="6" x2="24" y2="12"/><line x1="10.5" y1="19.5" x2="4.5" y2="19.5"/>' +
'<line x1="14.4" y1="9.9" x2="10.2" y2="5.7"/><line x1="33.6" y1="9.9" x2="37.8" y2="5.7"/>' +
'</g><circle cx="24" cy="20" r="9"/></g><g ' + cloudFill + '>' + CLOUD + '</g></svg>';
case "cloudy":
return head + '<g ' + cloudFill + '>' + CLOUD + '</g><ellipse cx="18" cy="24" rx="9" ry="7.5" fill="#dbe7f2" fill-opacity=".55"/></svg>';
case "fog":
return head + '<g fill="#eef4fa" fill-opacity=".8" transform="translate(0,-5)">' + CLOUD + '</g>' +
'<g stroke="#eef4fa" stroke-opacity=".7" stroke-width="3.2" stroke-linecap="round">' +
'<line x1="15" y1="46" x2="49" y2="46"/><line x1="21" y1="53" x2="45" y2="53"/></g></svg>';
case "drizzle":
return head + '<g ' + cloudFill + ' transform="translate(0,-5)">' + CLOUD + '</g>' +
'<g fill="var(--accent)"><circle class="drop" cx="24" cy="50" r="2.4"/><circle class="drop" cx="32" cy="53" r="2.4"/><circle class="drop" cx="40" cy="50" r="2.4"/></g></svg>';
case "rain":
return head + '<g ' + cloudFill + ' transform="translate(0,-6)">' + CLOUD + '</g>' +
'<g stroke="var(--accent)" stroke-width="3.2" stroke-linecap="round">' +
'<line class="drop" x1="23" y1="47" x2="21" y2="54"/><line class="drop" x1="32" y1="48" x2="30" y2="55"/><line class="drop" x1="41" y1="47" x2="39" y2="54"/></g></svg>';
case "snow":
return head + '<g ' + cloudFill + ' transform="translate(0,-6)">' + CLOUD + '</g>' +
'<g stroke="var(--accent)" stroke-width="2.6" stroke-linecap="round">' +
'<g class="flake"><line x1="22" y1="47" x2="22" y2="55"/><line x1="18" y1="51" x2="26" y2="51"/></g>' +
'<g class="flake"><line x1="32" y1="49" x2="32" y2="57"/><line x1="28" y1="53" x2="36" y2="53"/></g>' +
'<g class="flake"><line x1="42" y1="47" x2="42" y2="55"/><line x1="38" y1="51" x2="46" y2="51"/></g></g></svg>';
case "thunder":
return head + '<g ' + cloudFill + ' transform="translate(0,-7)">' + CLOUD + '</g>' +
'<path class="bolt" d="M34 40l-11 12h7l-2 10 12-14h-7l3-8z" fill="var(--accent)"/></svg>';
default:
return head + '<g ' + cloudFill + '>' + CLOUD + '</g></svg>';
}
}
/* ---------------- helpers ---------------- */
var card = document.getElementById("card");
var bg = document.getElementById("bg");
function esc(s) {
return String(s).replace(/[&<>"']/g, function (c) {
return { "&": "&", "<": "<", ">": ">", '"': """, "'": "'" }[c];
});
}
function r1(v) { return (Math.round(v * 10) / 10).toFixed(1).replace(/\.0$/, ""); }
function r0(v) { return String(Math.round(v)); }
function applyTheme(group) {
var t = THEMES[group] || THEMES.cloudy;
var s = document.documentElement.style;
s.setProperty("--g1", t.g1);
s.setProperty("--g2", t.g2);
s.setProperty("--g3", t.g3);
s.setProperty("--accent", t.accent);
bg.style.background = "linear-gradient(165deg," + t.g1 + " 0%," + t.g2 + " 62%," + t.g3 + " 100%)";
}
function prettyDate(iso) {
var d = new Date(iso + "T00:00:00Z");
try {
return d.toLocaleDateString("en-GB", {
weekday: "long", day: "numeric", month: "long", year: "numeric", timeZone: "UTC"
});
} catch (e) { return iso; }
}
function relLabel(iso) {
var a = Date.parse(iso + "T00:00:00Z"), b = Date.parse(todayUTC + "T00:00:00Z");
var days = Math.round((a - b) / 86400000);
if (days === 0) return "Today";
if (days === 1) return "Tomorrow";
if (days === -1) return "Yesterday";
return days < 0 ? Math.abs(days) + " days ago" : "In " + days + " days";
}
/* ---------------- chart ---------------- */
function buildChart(hours) {
var W = 1040, H = 236;
var padL = 26, padR = 26, padT = 40, padB = 30;
var n = hours.length;
var innerW = W - padL - padR;
var innerH = H - padT - padB;
var temps = hours.map(function (h) { return h.v; });
var lo = Math.min.apply(null, temps), hi = Math.max.apply(null, temps);
var span = Math.max(hi - lo, 1.5);
var yMin = lo - span * 0.28, yMax = hi + span * 0.28;
function px(i) { return n === 1 ? padL + innerW / 2 : padL + (innerW * i) / (n - 1); }
function py(v) { return padT + innerH * (1 - (v - yMin) / (yMax - yMin)); }
var pts = hours.map(function (h, i) { return { x: px(i), y: py(h.v), v: h.v, t: h.t }; });
var line = "";
if (pts.length === 1) {
line = "";
} else {
line = "M" + pts[0].x.toFixed(1) + " " + pts[0].y.toFixed(1);
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 k = 0.16;
line += " C" + (p1.x + (p2.x - p0.x) * k).toFixed(1) + " " + (p1.y + (p2.y - p0.y) * k).toFixed(1) +
" " + (p2.x - (p3.x - p1.x) * k).toFixed(1) + " " + (p2.y - (p3.y - p1.y) * k).toFixed(1) +
" " + p2.x.toFixed(1) + " " + p2.y.toFixed(1);
}
}
var area = line ? line + " L" + pts[pts.length - 1].x.toFixed(1) + " " + (H - padB) + " L" + pts[0].x.toFixed(1) + " " + (H - padB) + " Z" : "";
var grid = "";
for (var g = 0; g <= 3; g++) {
var gy = padT + (innerH * g) / 3;
grid += '<line class="grid" x1="' + padL + '" y1="' + gy.toFixed(1) + '" x2="' + (W - padR) + '" y2="' + gy.toFixed(1) + '"/>';
}
var iMax = temps.indexOf(hi), iMin = temps.indexOf(lo);
var step = Math.max(1, Math.ceil(n / 13));
var dots = "", vals = "", hrs = "";
pts.forEach(function (p, i) {
var peak = (i === iMax || i === iMin);
dots += '<circle class="dot' + (peak ? " peak" : "") + '" cx="' + p.x.toFixed(1) + '" cy="' + p.y.toFixed(1) + '" r="' + (peak ? 4.6 : 3.1) + '"/>';
var ty = Math.max(p.y - 15, 14);
vals += '<text class="val" x="' + p.x.toFixed(1) + '" y="' + ty.toFixed(1) + '" text-anchor="middle"' +
(peak ? ' style="fill:var(--accent)"' : "") + '>' + r0(p.v) + "\u00B0</text>";
if (i % step === 0 || i === n - 1) {
hrs += '<text class="hr" x="' + p.x.toFixed(1) + '" y="' + (H - 8) + '" text-anchor="middle">' + esc(p.t.slice(11, 16)) + "</text>";
}
});
return '<svg class="chart" viewBox="0 0 ' + W + " " + H + '" role="img" aria-label="Hourly temperature chart">' +
'<defs><linearGradient id="fillGrad" x1="0" y1="0" x2="0" y2="1">' +
'<stop offset="0%" stop-color="var(--accent)" stop-opacity=".38"/>' +
'<stop offset="100%" stop-color="var(--accent)" stop-opacity="0"/></linearGradient></defs>' +
grid +
(area ? '<path class="fade" d="' + area + '" fill="url(#fillGrad)"/>' : "") +
(line ? '<path class="line draw" d="' + line + '" pathLength="1000" style="--len:1000"/>' : "") +
'<g class="fade">' + dots + vals + "</g>" + hrs +
"</svg>";
}
function hourList(hours) {
return '<div class="hours-fallback" hidden>' + hours.map(function (h) {
return esc(h.t.slice(11, 16)) + " " + r1(h.v) + "\u00B0C";
}).join(", ") + "</div>";
}
/* ---------------- render ---------------- */
function renderCard(d) {
applyTheme(d.group);
var pinSvg = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">' +
'<path d="M20 10c0 6-8 12-8 12S4 16 4 10a8 8 0 1 1 16 0Z"/><circle cx="12" cy="10" r="2.8"/></svg>';
var upSvg = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M12 19V5M5 12l7-7 7 7"/></svg>';
var downSvg = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M19 12l-7 7-7-7"/></svg>';
var avg = d.hours.length
? d.hours.reduce(function (s, h) { return s + h.v; }, 0) / d.hours.length
: null;
card.innerHTML =
'<div class="top">' +
'<div>' +
'<div class="loc">' + pinSvg + "<h1>" + esc(d.name) + "</h1></div>" +
'<div class="coords">' + d.lat.toFixed(3) + "\u00B0" + (d.lat >= 0 ? "N" : "S") + " \u00B7 " +
Math.abs(d.lon).toFixed(3) + "\u00B0" + (d.lon >= 0 ? "E" : "W") + "</div>" +
"</div>" +
'<div class="when">' +
'<div class="d">' + esc(prettyDate(d.date)) + "</div>" +
'<div class="iso">' + esc(d.date) + " \u00B7 UTC</div>" +
'<div class="chip"><i></i>' + esc(relLabel(d.date)) + " \u00B7 " + (d.archive ? "Archive" : "Forecast") + "</div>" +
"</div>" +
"</div>" +
'<div class="rule"></div>' +
'<div class="hero">' +
'<div class="icon">' + svgIcon(d.group) + "</div>" +
'<div class="readout">' +
'<div class="big">' + (d.max === null ? "\u2013" : r0(d.max)) + "\u00B0" + '<span class="unit">C</span></div>' +
'<div class="cond">' + esc(d.condition) + "</div>" +
'<div class="sub">Daily high' + (d.max === null ? "" : " " + r1(d.max) + "\u00B0C") +
(avg === null ? "" : " \u00B7 hourly average " + r1(avg) + "\u00B0C") +
" \u00B7 WMO code " + esc(String(d.code)) + "</div>" +
"</div>" +
'<div class="stats">' +
'<div class="stat max"><div class="k">' + upSvg + "Max</div><div class=\"v\">" +
(d.max === null ? "\u2013" : r1(d.max) + "\u00B0C") + "</div></div>" +
'<div class="stat min"><div class="k">' + downSvg + "Min</div><div class=\"v\">" +
(d.min === null ? "\u2013" : r1(d.min) + "\u00B0C") + "</div></div>" +
"</div>" +
"</div>" +
'<div class="hourly">' +
'<div class="hhead"><h2>Hourly temperature \u2014 \u00B0C</h2><span>' +
(d.hours.length ? d.hours.length + " readings \u00B7 " + esc(d.hours[0].t.slice(11, 16)) + "\u2013" + esc(d.hours[d.hours.length - 1].t.slice(11, 16)) + " UTC" : "no hourly data") +
"</span></div>" +
(d.hours.length ? buildChart(d.hours) + hourList(d.hours) : '<p class="sub">Hourly temperatures are unavailable for this date.</p>') +
"</div>";
}
function renderError(title, detail) {
var warn = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">' +
'<path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0Z"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>';
card.innerHTML =
'<div class="top"><div><div class="loc">' +
'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M20 10c0 6-8 12-8 12S4 16 4 10a8 8 0 1 1 16 0Z"/><circle cx="12" cy="10" r="2.8"/></svg>' +
"<h1>" + esc(name) + "</h1></div>" +
'<div class="coords">' + lat.toFixed(3) + "\u00B0 \u00B7 " + lon.toFixed(3) + "\u00B0</div></div>" +
'<div class="when"><div class="d">' + esc(prettyDate(date)) + '</div><div class="iso">' + esc(date) + " \u00B7 UTC</div></div>" +
"</div>" +
'<div class="rule"></div>' +
'<div class="state">' +
'<div class="badge-err">' + warn + "</div>" +
"<h2>" + esc(title) + "</h2>" +
"<p>" + detail + "</p>" +
'<button class="retry" type="button" id="retry">Try again</button>' +
"</div>";
var btn = document.getElementById("retry");
if (btn) btn.addEventListener("click", load);
}
/* ---------------- data ---------------- */
function load() {
card.innerHTML =
'<div class="state"><div class="spinner"></div><h2>Loading weather</h2>' +
'<p>Fetching ' + esc(name) + " for " + esc(date) + "\u2026</p></div>";
var params = new URLSearchParams({
latitude: String(lat),
longitude: String(lon),
daily: "temperature_2m_max,temperature_2m_min,weather_code",
hourly: "temperature_2m",
timezone: "UTC",
temperature_unit: "celsius",
start_date: date,
end_date: date
});
var url = path + "?" + params.toString();
fetch(url, { headers: { Accept: "application/json" } })
.then(function (res) {
if (!res.ok) throw new Error("The weather service responded with HTTP " + res.status + ".");
return res.json();
})
.then(function (json) {
if (!json || typeof json !== "object") throw new Error("The weather service returned an unreadable response.");
if (json.error) throw new Error(String(json.reason || "The weather service reported an error."));
var daily = json.daily || {};
var max = Array.isArray(daily.temperature_2m_max) ? daily.temperature_2m_max[0] : null;
var min = Array.isArray(daily.temperature_2m_min) ? daily.temperature_2m_min[0] : null;
var code = Array.isArray(daily.weather_code) ? daily.weather_code[0] : null;
var hours = [];
var h = json.hourly || {};
if (Array.isArray(h.time) && Array.isArray(h.temperature_2m)) {
for (var i = 0; i < h.time.length; i++) {
var t = String(h.time[i]), v = h.temperature_2m[i];
if (t.slice(0, 10) !== date) continue;
if (typeof v !== "number" || !isFinite(v)) continue;
hours.push({ t: t, v: v });
}
}
var hasMax = typeof max === "number" && isFinite(max);
var hasMin = typeof min === "number" && isFinite(min);
if (!hasMax && !hasMin && !hours.length) {
throw new Error("No weather data is available for " + esc(date) + " at this location.");
}
if (!hasMax && hours.length) max = Math.max.apply(null, hours.map(function (x) { return x.v; }));
if (!hasMin && hours.length) min = Math.min.apply(null, hours.map(function (x) { return x.v; }));
var info = CODES[code] || null;
renderCard({
name: name,
lat: lat,
lon: lon,
date: date,
archive: isPast,
max: (typeof max === "number" && isFinite(max)) ? max : null,
min: (typeof min === "number" && isFinite(min)) ? min : null,
code: (code === null || code === undefined) ? "n/a" : code,
condition: info ? info[0] : "Condition unavailable",
group: info ? info[1] : "cloudy",
hours: hours
});
})
.catch(function (err) {
var msg = (err && err.message) ? err.message : "Unknown error.";
renderError(
"Weather data could not be loaded",
esc(msg) + "<br><code>" + esc(url) + "</code>"
);
});
}
load();
})();
</script>
</body>
</html>L1 — cheap deterministic descriptors
| bytes total | 29,033 | html / css / js | 530 / 9,889 / 18,614 |
|---|---|---|---|
| dom nodes | 17 | dom depth | 5 |
| css rules | 108 | js present | yes |
| brightness | 101.0 | contrast | 27.3 |
| colorfulness | 39.2 | whitespace | 41.9% |
This slot's telemetry
| prompt tokens | 2 | completion tokens | 19,227 |
|---|---|---|---|
| total tokens | 19,229 | wall | 208.8 s |
| cost | — | request id | — |
config.json575 B
{
"N": 2,
"auth": {
"credential_ref": "WCB_NONE",
"method": "oauth-login"
},
"billing": "plan",
"config_id": "claude-opus-5-eff-high--cli--cursor--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": 83846,
"cost_usd": null,
"prompt_tokens": 70,
"total_tokens": 83916,
"wall_ms": 1251462
},
"transport": "cursor-agent-cli-isolated-home",
"vendor_sanction_ref": null
}send-log2.5 KB
{
"N": 2,
"batch_id": "2026-08-13--cursor-s3",
"config_id": "claude-opus-5-eff-high--cli--cursor--dev",
"positions": [
{
"attempts": [
{
"attempt_index": 0,
"backoff_ms": null,
"charged": true,
"ended_at": "2026-08-12T18:35:11.726618+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-12T18:31:42.974793+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-12T18:41:49.028629+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-12T18:35:16.040678+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-12T18:45:43.253617+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-12T18:41:52.625299+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-08-12T18:52:45.816944+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-12T18:45:46.663032+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
}
}
}