cursor-grok-4.6 @ high · cursor-xl

cursor-xlhigh
config
cursor-grok-4.6-eff-high--cli--cursor-xl--dev
batch
2026-07-19--unified
transport
cursor-agent-cli-isolated-home
protocol
cli · plan
served model
cursor-grok-4.6-high
captured
Jul 18, 2026, 11:54 AM · N=2
variant
live
slot 0 · P-q · sandboxed iframe
cursor-grok-4.6 @high · cursor-xl P-q slot 0 screenshot

The screenshot is the exact frozen pixels the similarity channels measured. Run live re-executes the raw output in a sandboxed iframe; its rendering depends on your browser and fonts and is not guaranteed to match the measured pixels.

similarity neighbors

within session 2026-07-19--unified

similarity measures convergence within this session — not quality.

Fidelity — does the card show the right data?

  • namematch
  • conditionmatch
  • datematch
  • max tempmismatchshown: 13.405
  • min tempmismatchshown: 52.52
  • hourlymatchcoverage 8/24 · 8 match · 0 mismatch · 16 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, height=800, initial-scale=1">
<title>Weather</title>
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'></svg>">
<style>
  :root {
    --sky-0: #1c2438;
    --sky-1: #3d4a62;
    --sky-2: #8b7355;
    --ink: #f4efe6;
    --ink-soft: rgba(244, 239, 230, 0.72);
    --ink-faint: rgba(244, 239, 230, 0.42);
    --rule: rgba(244, 239, 230, 0.16);
    --accent: #e8c9a0;
    --chart: #f0dcc0;
    --fill: rgba(232, 201, 160, 0.22);
    --glow: rgba(232, 201, 160, 0.18);
    --shadow: rgba(8, 10, 18, 0.35);
  }

  * { box-sizing: border-box; margin: 0; padding: 0; }

  html, body {
    width: 1280px;
    height: 800px;
    overflow: hidden;
    background: #10141c;
  }

  body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
    color: var(--ink);
    -webkit-font-smoothing: antialiased;
  }

  .stage {
    position: relative;
    width: 1280px;
    height: 800px;
    overflow: hidden;
    background:
      radial-gradient(ellipse 900px 520px at 18% 8%, var(--glow), transparent 58%),
      radial-gradient(ellipse 740px 480px at 92% 88%, rgba(20, 24, 36, 0.45), transparent 60%),
      linear-gradient(165deg, var(--sky-0) 0%, var(--sky-1) 48%, var(--sky-2) 100%);
  }

  .grain {
    pointer-events: none;
    position: absolute;
    inset: 0;
    opacity: 0.09;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='0.55'/></svg>");
  }

  .orb {
    pointer-events: none;
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
  }

  .orb-a {
    width: 420px;
    height: 420px;
    right: -80px;
    top: -120px;
    background: radial-gradient(circle at 40% 40%, var(--accent), transparent 62%);
    opacity: 0.28;
  }

  .orb-b {
    width: 280px;
    height: 280px;
    left: -60px;
    bottom: 80px;
    background: radial-gradient(circle at 50% 50%, var(--ink), transparent 68%);
    opacity: 0.06;
  }

  .frame {
    position: relative;
    z-index: 1;
    height: 100%;
    padding: 48px 56px 40px;
    display: grid;
    grid-template-rows: auto auto 1fr;
    gap: 28px;
  }

  header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 32px;
  }

  .kicker {
    font-size: 11px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--ink-faint);
    margin-bottom: 10px;
  }

  .place {
    font-family: Palatino, "Palatino Linotype", "Iowan Old Style", Georgia, serif;
    font-size: 56px;
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 0.95;
    max-width: 820px;
    text-wrap: balance;
  }

  .coords {
    margin-top: 10px;
    font-size: 13px;
    letter-spacing: 0.08em;
    color: var(--ink-faint);
    font-variant-numeric: tabular-nums;
  }

  .date-block {
    text-align: right;
    padding-top: 6px;
    min-width: 280px;
  }

  .date-block .weekday {
    font-size: 15px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 8px;
  }

  .date-block .fulldate {
    font-family: Palatino, "Palatino Linotype", Georgia, serif;
    font-size: 28px;
    font-style: italic;
    color: var(--ink-soft);
  }

  .hero {
    display: grid;
    grid-template-columns: 168px 1fr auto;
    align-items: center;
    gap: 36px;
    padding: 8px 0 4px;
    border-top: 1px solid var(--rule);
    border-bottom: 1px solid var(--rule);
    min-height: 236px;
  }

  .icon-wrap {
    width: 168px;
    height: 168px;
    display: grid;
    place-items: center;
  }

  .icon-wrap svg {
    width: 148px;
    height: 148px;
    filter: drop-shadow(0 18px 28px var(--shadow));
  }

  .condition {
    font-family: Palatino, "Palatino Linotype", Georgia, serif;
    font-size: 42px;
    font-style: italic;
    letter-spacing: -0.02em;
    line-height: 1.1;
    max-width: 520px;
  }

  .temps {
    display: flex;
    gap: 48px;
    align-items: flex-end;
    padding-right: 8px;
  }

  .temp-col {
    text-align: right;
    min-width: 150px;
  }

  .temp-col span {
    display: block;
    font-size: 11px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: var(--ink-faint);
    margin-bottom: 6px;
  }

  .temp-col strong {
    display: block;
    font-weight: 300;
    font-size: 92px;
    letter-spacing: -0.05em;
    line-height: 0.85;
    font-variant-numeric: tabular-nums;
  }

  .temp-col strong small {
    font-size: 32px;
    margin-left: 2px;
    color: var(--accent);
    font-weight: 400;
    letter-spacing: 0;
  }

  .chart-panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }

  .chart-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 12px;
  }

  .chart-head h2 {
    font-size: 11px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--ink-faint);
    font-weight: 500;
  }

  .chart-head p {
    font-size: 13px;
    color: var(--ink-soft);
  }

  .chart-box {
    position: relative;
    flex: 1;
    min-height: 220px;
  }

  .chart-box svg {
    width: 100%;
    height: 100%;
    display: block;
  }

  .status {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    text-align: center;
    padding: 48px;
  }

  .status p {
    font-family: Palatino, "Palatino Linotype", Georgia, serif;
    font-size: 32px;
    font-style: italic;
    color: var(--ink-soft);
    max-width: 640px;
    line-height: 1.3;
  }

  .status .sub {
    margin-top: 14px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
    font-size: 14px;
    font-style: normal;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ink-faint);
  }

  .hidden { display: none !important; }

  @keyframes rise {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
  }

  .frame > * {
    animation: rise 0.7s ease both;
  }

  header { animation-delay: 0.04s; }
  .hero { animation-delay: 0.12s; }
  .chart-panel { animation-delay: 0.2s; }
</style>
</head>
<body>
  <div class="stage" id="stage">
    <div class="grain"></div>
    <div class="orb orb-a"></div>
    <div class="orb orb-b"></div>
    <div class="frame" id="app">
      <div class="status" id="status">
        <div>
          <p>Reading the sky…</p>
          <div class="sub">Fetching conditions</div>
        </div>
      </div>
    </div>
  </div>
<script>
(function () {
  const WMO = {
    0: "Clear sky",
    1: "Mainly clear",
    2: "Partly cloudy",
    3: "Overcast",
    45: "Fog",
    48: "Depositing rime fog",
    51: "Light drizzle",
    53: "Moderate drizzle",
    55: "Dense drizzle",
    56: "Light freezing drizzle",
    57: "Dense freezing drizzle",
    61: "Slight rain",
    63: "Moderate rain",
    65: "Heavy rain",
    66: "Light freezing rain",
    67: "Heavy freezing rain",
    71: "Slight snow",
    73: "Moderate snow",
    75: "Heavy snow",
    77: "Snow grains",
    80: "Slight rain showers",
    81: "Moderate rain showers",
    82: "Violent rain showers",
    85: "Slight snow showers",
    86: "Heavy snow showers",
    95: "Thunderstorm",
    96: "Thunderstorm with slight hail",
    99: "Thunderstorm with heavy hail"
  };

  const THEMES = {
    clear:   { sky0: "#15233d", sky1: "#3b5a86", sky2: "#c9894a", accent: "#f0c48a", chart: "#f6d7a8", fill: "rgba(240,196,138,0.22)", glow: "rgba(240,196,138,0.28)" },
    cloud:   { sky0: "#232833", sky1: "#4a5363", sky2: "#8b8e97", accent: "#d7d2c8", chart: "#ece7dc", fill: "rgba(215,210,200,0.18)", glow: "rgba(180,186,198,0.2)" },
    fog:     { sky0: "#2c2a28", sky1: "#5a564f", sky2: "#9a9286", accent: "#e2d5c2", chart: "#efe4d4", fill: "rgba(226,213,194,0.2)", glow: "rgba(180,170,150,0.22)" },
    drizzle: { sky0: "#17303a", sky1: "#2f5a66", sky2: "#6f8f8a", accent: "#b7ddd4", chart: "#cfe8e1", fill: "rgba(183,221,212,0.2)", glow: "rgba(120,180,170,0.22)" },
    rain:    { sky0: "#0f2438", sky1: "#1f4d68", sky2: "#3d7a8c", accent: "#8fd0e4", chart: "#b7e4f2", fill: "rgba(143,208,228,0.2)", glow: "rgba(90,170,190,0.24)" },
    snow:    { sky0: "#1a2838", sky1: "#4a6580", sky2: "#c9d6e2", accent: "#eef5fb", chart: "#ffffff", fill: "rgba(238,245,251,0.22)", glow: "rgba(220,230,240,0.28)" },
    storm:   { sky0: "#161226", sky1: "#3a2a58", sky2: "#6b4a3a", accent: "#e0b45a", chart: "#f0d08a", fill: "rgba(224,180,90,0.2)", glow: "rgba(180,120,80,0.22)" }
  };

  function themeFor(code) {
    if (code === 0 || code === 1) return "clear";
    if (code === 2 || code === 3) return "cloud";
    if (code === 45 || code === 48) return "fog";
    if (code >= 51 && code <= 57) return "drizzle";
    if ((code >= 61 && code <= 67) || (code >= 80 && code <= 82)) return "rain";
    if ((code >= 71 && code <= 77) || code === 85 || code === 86) return "snow";
    if (code >= 95) return "storm";
    return "cloud";
  }

  function applyTheme(key) {
    const t = THEMES[key] || THEMES.cloud;
    const r = document.documentElement.style;
    r.setProperty("--sky-0", t.sky0);
    r.setProperty("--sky-1", t.sky1);
    r.setProperty("--sky-2", t.sky2);
    r.setProperty("--accent", t.accent);
    r.setProperty("--chart", t.chart);
    r.setProperty("--fill", t.fill);
    r.setProperty("--glow", t.glow);
  }

  function iconSvg(code) {
    const stroke = "currentColor";
    if (code === 0) {
      return `<svg viewBox="0 0 120 120" fill="none" aria-hidden="true">
        <circle cx="60" cy="60" r="22" fill="${stroke}" opacity="0.95"/>
        <g stroke="${stroke}" stroke-width="3.2" stroke-linecap="round">
          <path d="M60 14v12M60 94v12M14 60h12M94 60h12M27 27l8.5 8.5M84.5 84.5l8.5 8.5M27 93l8.5-8.5M84.5 35.5l8.5-8.5"/>
        </g>
      </svg>`;
    }
    if (code === 1 || code === 2) {
      return `<svg viewBox="0 0 120 120" fill="none" aria-hidden="true">
        <circle cx="44" cy="42" r="16" fill="${stroke}" opacity="0.95"/>
        <g stroke="${stroke}" stroke-width="2.8" stroke-linecap="round">
          <path d="M44 16v8M22 42h-8M28 26l-6-6M60 26l6-6"/>
        </g>
        <path d="M38 78h42c10 0 18-8 18-17s-8-17-18-17c-1.4 0-2.8.16-4.1.46C73.2 34.4 63.6 28 52 28c-16 0-29 13-29 29 0 2.1.24 4.1.7 6.1C18.4 65.4 14 72.2 14 80.2 14 90.1 22 98 32 98h48" stroke="${stroke}" stroke-width="3.2" stroke-linecap="round" fill="none"/>
        <path d="M34 70c8-14 36-14 44 0" stroke="${stroke}" stroke-width="2.4" opacity="0.45" fill="none"/>
      </svg>`;
    }
    if (code === 3) {
      return `<svg viewBox="0 0 120 120" fill="none" aria-hidden="true">
        <path d="M30 74h52c12 0 22-9.5 22-21.2S94 31.6 82 31.6c-1.7 0-3.3.2-4.9.55C73.4 22.4 62.6 16 50 16 32.3 16 18 30.1 18 47.6c0 2.6.3 5.1.9 7.5C12.6 58.2 8 66.4 8 76.2 8 88.4 18 98 30 98h54" stroke="${stroke}" stroke-width="3.2" stroke-linecap="round"/>
        <path d="M28 58c10-16 42-16 52 2" stroke="${stroke}" stroke-width="2.4" opacity="0.4"/>
      </svg>`;
    }
    if (code === 45 || code === 48) {
      return `<svg viewBox="0 0 120 120" fill="none" aria-hidden="true">
        <g stroke="${stroke}" stroke-width="3.2" stroke-linecap="round">
          <path d="M18 44h84M26 60h68M22 76h76M34 92h52"/>
        </g>
      </svg>`;
    }
    if (code >= 51 && code <= 57) {
      return `<svg viewBox="0 0 120 120" fill="none" aria-hidden="true">
        <path d="M32 52h50c11 0 20-8.6 20-19.2S93 13.6 82 13.6c-1.6 0-3.1.18-4.6.5C73.8 7.2 64.8 2 54 2 38.3 2 25.6 14.4 25.6 29.8c0 2.2.25 4.4.72 6.4C20.8 38.8 16 46 16 54.8 16 65.6 24.8 74 36 74h46" stroke="${stroke}" stroke-width="3.2" stroke-linecap="round"/>
        <g stroke="${stroke}" stroke-width="3" stroke-linecap="round">
          <path d="M40 86v10M56 84v14M72 86v10"/>
        </g>
      </svg>`;
    }
    if ((code >= 61 && code <= 67) || (code >= 80 && code <= 82)) {
      return `<svg viewBox="0 0 120 120" fill="none" aria-hidden="true">
        <path d="M30 54h50c11.5 0 21-9 21-20.2S91.5 13.6 80 13.6c-1.6 0-3.2.2-4.7.54C71.6 7 61.6 1 50 1 33.8 1 20.6 14 20.6 30.2c0 2.4.27 4.7.78 6.9C15.2 40 10.4 47.6 10.4 56.8 10.4 68 19.6 77 30.4 77h50" stroke="${stroke}" stroke-width="3.2" stroke-linecap="round"/>
        <g stroke="${stroke}" stroke-width="3.2" stroke-linecap="round">
          <path d="M40 88l-6 16M60 86l-6 18M80 88l-6 16"/>
        </g>
      </svg>`;
    }
    if ((code >= 71 && code <= 77) || code === 85 || code === 86) {
      return `<svg viewBox="0 0 120 120" fill="none" aria-hidden="true">
        <path d="M30 52h50c11.5 0 21-9 21-20S91.5 12 80 12c-1.6 0-3.2.18-4.7.52C71.6 5.4 61.8 0 50 0 34 0 21 12.8 21 28.6c0 2.3.26 4.6.76 6.7C16.2 38 12 45.4 12 54.2 12 65.6 21.4 75 33 75h48" stroke="${stroke}" stroke-width="3.2" stroke-linecap="round"/>
        <g fill="${stroke}">
          <path d="M40 88l4 7 4-7-4-7z"/>
          <path d="M58 96l4 7 4-7-4-7z"/>
          <path d="M76 88l4 7 4-7-4-7z"/>
        </g>
      </svg>`;
    }
    return `<svg viewBox="0 0 120 120" fill="none" aria-hidden="true">
      <path d="M28 58h52c12 0 22-9.2 22-20.6S92 16.8 80 16.8c-1.6 0-3.2.2-4.7.54C71.6 9.6 61.6 4 50 4 33.6 4 20.4 17 20.4 33.2c0 2.5.28 4.8.8 7.1C15 43.2 10 51 10 60.4 10 72 19.6 81 31 81h50" stroke="${stroke}" stroke-width="3.2" stroke-linecap="round"/>
      <path d="M58 86l-10 18h8l-4 12 16-22h-8l6-8z" fill="${stroke}"/>
    </svg>`;
  }

  function utcToday() {
    return new Date().toISOString().slice(0, 10);
  }

  function params() {
    const q = new URLSearchParams(location.search);
    const lat = parseFloat(q.get("lat"));
    const lon = parseFloat(q.get("lon"));
    const name = q.get("name");
    const date = q.get("date");
    return {
      lat: Number.isFinite(lat) ? lat : 52.52,
      lon: Number.isFinite(lon) ? lon : 13.405,
      name: name && name.trim() ? name.trim() : "Berlin",
      date: date && /^\d{4}-\d{2}-\d{2}$/.test(date) ? date : utcToday()
    };
  }

  function formatDate(iso) {
    const [y, m, d] = iso.split("-").map(Number);
    const dt = new Date(Date.UTC(y, m - 1, d));
    const weekday = new Intl.DateTimeFormat("en-GB", { weekday: "long", timeZone: "UTC" }).format(dt);
    const rest = new Intl.DateTimeFormat("en-GB", { day: "numeric", month: "long", year: "numeric", timeZone: "UTC" }).format(dt);
    return { weekday, rest };
  }

  function fmtCoord(n, pos, neg) {
    const hemi = n >= 0 ? pos : neg;
    return Math.abs(n).toFixed(3) + "°" + hemi;
  }

  function showError(message) {
    applyTheme("cloud");
    document.getElementById("app").innerHTML =
      `<div class="status"><div><p>${message}</p><div class="sub">Weather data could not be loaded</div></div></div>`;
  }

  function catmull(points) {
    if (!points.length) return "";
    let d = `M ${points[0].x} ${points[0].y}`;
    if (points.length === 1) return d;
    for (let i = 0; i < points.length - 1; i++) {
      const p0 = points[i - 1] || points[i];
      const p1 = points[i];
      const p2 = points[i + 1];
      const p3 = points[i + 2] || p2;
      const c1x = p1.x + (p2.x - p0.x) / 6;
      const c1y = p1.y + (p2.y - p0.y) / 6;
      const c2x = p2.x - (p3.x - p1.x) / 6;
      const c2y = p2.y - (p3.y - p1.y) / 6;
      d += ` C ${c1x} ${c1y}, ${c2x} ${c2y}, ${p2.x} ${p2.y}`;
    }
    return d;
  }

  function renderChart(temps) {
    const W = 1168, H = 248;
    const padL = 8, padR = 8, padT = 28, padB = 36;
    const min = Math.min.apply(null, temps);
    const max = Math.max.apply(null, temps);
    const span = max - min || 1;
    const innerW = W - padL - padR;
    const innerH = H - padT - padB;
    const pts = temps.map(function (t, i) {
      const x = padL + (temps.length === 1 ? innerW / 2 : (i / (temps.length - 1)) * innerW);
      const y = padT + (1 - (t - min) / span) * innerH;
      return { x: x, y: y, t: t, i: i };
    });
    const line = catmull(pts);
    const area = line + ` L ${pts[pts.length - 1].x} ${H - padB} L ${pts[0].x} ${H - padB} Z`;
    const labels = [0, 3, 6, 9, 12, 15, 18, 21].filter(function (h) { return h < temps.length; });
    const grid = [0, 0.5, 1].map(function (f) {
      const y = padT + f * innerH;
      return `<line x1="${padL}" y1="${y}" x2="${W - padR}" y2="${y}" stroke="rgba(244,239,230,0.12)" stroke-width="1"/>`;
    }).join("");

    const dots = pts.map(function (p, i) {
      if (i % 3 !== 0 && i !== pts.length - 1) return "";
      return `<circle cx="${p.x}" cy="${p.y}" r="3.2" fill="var(--chart)"/>`;
    }).join("");

    const hours = labels.map(function (h) {
      const p = pts[h];
      const hh = String(h).padStart(2, "0");
      const val = Math.round(temps[h]);
      return `<text x="${p.x}" y="${H - 8}" text-anchor="middle" fill="rgba(244,239,230,0.55)" font-size="12" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif" letter-spacing="0.06em">${hh}:00</text>
        <text x="${p.x}" y="${p.y - 12}" text-anchor="middle" fill="var(--ink)" font-size="13" font-weight="500" font-family="-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif">${val}°</text>`;
    }).join("");

    return `<svg viewBox="0 0 ${W} ${H}" preserveAspectRatio="none" role="img" aria-label="Hourly temperatures">
      ${grid}
      <path d="${area}" fill="var(--fill)"/>
      <path d="${line}" fill="none" stroke="var(--chart)" stroke-width="2.4" stroke-linejoin="round" stroke-linecap="round"/>
      ${dots}
      ${hours}
    </svg>`;
  }

  function render(p, data) {
    const daily = data.daily || {};
    const hourly = data.hourly || {};
    const tmax = daily.temperature_2m_max && daily.temperature_2m_max[0];
    const tmin = daily.temperature_2m_min && daily.temperature_2m_min[0];
    const code = daily.weather_code && daily.weather_code[0];
    const times = hourly.time || [];
    const series = hourly.temperature_2m || [];

    if (![tmax, tmin, code].every(function (v) { return v !== undefined && v !== null && !Number.isNaN(Number(v)); })) {
      showError("Weather data could not be loaded.");
      return;
    }

    const hours = [];
    for (let i = 0; i < times.length; i++) {
      if (String(times[i]).slice(0, 10) === p.date && typeof series[i] === "number") {
        hours.push(series[i]);
      }
    }
    if (!hours.length) {
      showError("Weather data could not be loaded.");
      return;
    }

    const wmo = Number(code);
    const label = WMO[wmo] || "Unknown conditions";
    applyTheme(themeFor(wmo));
    const dated = formatDate(p.date);
    const maxR = Math.round(Number(tmax));
    const minR = Math.round(Number(tmin));

    document.getElementById("app").innerHTML = `
      <header>
        <div>
          <div class="kicker">Observatory · UTC</div>
          <h1 class="place">${escapeHtml(p.name)}</h1>
          <div class="coords">${fmtCoord(p.lat, "N", "S")}  ·  ${fmtCoord(p.lon, "E", "W")}</div>
        </div>
        <div class="date-block">
          <div class="weekday">${dated.weekday}</div>
          <div class="fulldate">${dated.rest}</div>
        </div>
      </header>
      <section class="hero">
        <div class="icon-wrap">${iconSvg(wmo)}</div>
        <div class="condition">${label}</div>
        <div class="temps">
          <div class="temp-col">
            <span>Maximum</span>
            <strong>${maxR}<small>°C</small></strong>
          </div>
          <div class="temp-col">
            <span>Minimum</span>
            <strong>${minR}<small>°C</small></strong>
          </div>
        </div>
      </section>
      <section class="chart-panel">
        <div class="chart-head">
          <h2>Hourly temperature</h2>
          <p>${hours.length} hours · Celsius</p>
        </div>
        <div class="chart-box">${renderChart(hours)}</div>
      </section>
    `;
  }

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

  async function load() {
    const p = params();
    const today = utcToday();
    const endpoint = p.date < today ? "/api/om/archive" : "/api/om/forecast";
    const url = endpoint
      + "?latitude=" + encodeURIComponent(p.lat)
      + "&longitude=" + encodeURIComponent(p.lon)
      + "&daily=" + encodeURIComponent("temperature_2m_max,temperature_2m_min,weather_code")
      + "&hourly=" + encodeURIComponent("temperature_2m")
      + "&timezone=UTC"
      + "&temperature_unit=celsius"
      + "&start_date=" + encodeURIComponent(p.date)
      + "&end_date=" + encodeURIComponent(p.date);

    try {
      const res = await fetch(url);
      if (!res.ok) throw new Error("bad status");
      const data = await res.json();
      if (!data || data.error) throw new Error("api error");
      render(p, data);
    } catch (e) {
      showError("Weather data could not be loaded.");
    }
  }

  load();
})();
</script>
</body>
</html>

L1 — cheap deterministic descriptors

bytes total21,207html / css / js686 / 6,156 / 14,365
dom nodes18dom depth7
css rules43js presentyes
brightness89.7contrast20.1
colorfulness21.2whitespace58.7%

This slot's telemetry

prompt tokens92,875completion tokens16,623
total tokens109,498wall259.9 s
cost—request id—
config.json587 B
{
  "N": 2,
  "auth": {
    "credential_ref": "WCB_NONE",
    "method": "oauth-login"
  },
  "billing": "plan",
  "config_id": "cursor-grok-4.6-eff-high--cli--cursor-xl--dev",
  "effort": "high",
  "family": "grok",
  "m": {
    "min": 2,
    "q": 2
  },
  "model_id": "cursor-grok-4.6",
  "protocol": "cli",
  "served_model": "cursor-grok-4.6-high",
  "telemetry": {
    "completion_tokens": 69401,
    "cost_usd": null,
    "prompt_tokens": 319661,
    "total_tokens": 389062,
    "wall_ms": 1013413
  },
  "transport": "cursor-agent-cli-isolated-home",
  "vendor_sanction_ref": null
}
send-log2.5 KB
{
  "N": 2,
  "batch_id": "2026-08-13--cursor-xl-s0",
  "config_id": "cursor-grok-4.6-eff-high--cli--cursor-xl--dev",
  "positions": [
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-08-13T10:14:28.533907+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-13T10:10:08.627378+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:16:58.003384+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-13T10:14:33.333502+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-13T10:22:43.095953+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-13T10:17:01.938419+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-13T10:27:14.341577+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-13T10:22:46.609145+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
    }
  }
}