gpt-5.4-mini @ high · cursor-xl

cursor-xlhigh
config
gpt-5.4-mini-eff-high--cli--cursor-xl--dev
batch
2026-07-19--unified
transport
cursor-agent-cli-isolated-home
protocol
cli · plan
served model
gpt-5.4-mini-high
captured
Jul 18, 2026, 11:54 AM · N=2
variant
live
slot 0 · P-q · sandboxed iframe
gpt-5.4-mini @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 neighborsNo similarity data for this session — this batch has no computed pairs.

Fidelity — does the card show the right data?

  • namematch
  • conditionmatch
  • datematch
  • max tempmatchshown: 25.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">
  <meta name="color-scheme" content="dark">
  <meta name="theme-color" content="#08111d">
  <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect width='64' height='64' rx='16' fill='%2308111d'/%3E%3Ccircle cx='28' cy='26' r='11' fill='%23ffd56e'/%3E%3Cpath d='M20 38h24a8 8 0 1 0-1-16 13 13 0 0 0-23 6 7 7 0 0 0 0 14z' fill='%23dce8ff'/%3E%3C/svg%3E">
  <title>Weather Card</title>
  <style>
    :root {
      --bg-a: #08111d;
      --bg-b: #101c33;
      --bg-c: #1e355a;
      --card: rgba(9, 16, 30, 0.72);
      --card-border: rgba(255, 255, 255, 0.14);
      --text: #f5f7fb;
      --muted: rgba(229, 235, 245, 0.74);
      --faint: rgba(229, 235, 245, 0.46);
      --accent: #7dd3fc;
      --accent2: #c084fc;
      --glow: rgba(125, 211, 252, 0.28);
      --shadow: 0 30px 80px rgba(0, 0, 0, 0.44);
    }

    body[data-theme="clear"] {
      --bg-a: #08111d;
      --bg-b: #132341;
      --bg-c: #203b68;
      --card-border: rgba(255, 255, 255, 0.16);
      --accent: #ffd56e;
      --accent2: #ff8a5b;
      --glow: rgba(255, 214, 110, 0.34);
    }

    body[data-theme="clouds"] {
      --bg-a: #07111c;
      --bg-b: #101d34;
      --bg-c: #203552;
      --card-border: rgba(255, 255, 255, 0.14);
      --accent: #cbd5e1;
      --accent2: #7dd3fc;
      --glow: rgba(125, 211, 252, 0.25);
    }

    body[data-theme="rain"] {
      --bg-a: #06111f;
      --bg-b: #0a1b38;
      --bg-c: #17345e;
      --card-border: rgba(255, 255, 255, 0.14);
      --accent: #86e8ff;
      --accent2: #5f8cff;
      --glow: rgba(102, 161, 255, 0.30);
    }

    body[data-theme="snow"] {
      --bg-a: #08131f;
      --bg-b: #0f2539;
      --bg-c: #21405e;
      --card-border: rgba(255, 255, 255, 0.16);
      --accent: #edfaff;
      --accent2: #9ae6ff;
      --glow: rgba(154, 230, 255, 0.30);
    }

    body[data-theme="storm"] {
      --bg-a: #100f26;
      --bg-b: #1f123d;
      --bg-c: #311a52;
      --card-border: rgba(255, 255, 255, 0.15);
      --accent: #f0abfc;
      --accent2: #7c3aed;
      --glow: rgba(192, 132, 252, 0.30);
    }

    body[data-theme="fog"] {
      --bg-a: #0a131a;
      --bg-b: #17222c;
      --bg-c: #273542;
      --card-border: rgba(255, 255, 255, 0.12);
      --accent: #cbd5e1;
      --accent2: #94a3b8;
      --glow: rgba(148, 163, 184, 0.26);
    }

    * {
      box-sizing: border-box;
    }

    html, body {
      height: 100%;
    }

    body {
      margin: 0;
      min-height: 100vh;
      overflow: hidden;
      color: var(--text);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      background:
        radial-gradient(circle at 15% 15%, rgba(255, 255, 255, 0.08), transparent 24%),
        radial-gradient(circle at 85% 12%, rgba(255, 255, 255, 0.05), transparent 20%),
        linear-gradient(135deg, var(--bg-a), var(--bg-b) 54%, var(--bg-c));
      display: grid;
      place-items: center;
      padding: 24px;
      font-variant-numeric: tabular-nums;
    }

    .scene {
      position: fixed;
      inset: 0;
      pointer-events: none;
      overflow: hidden;
    }

    .orb {
      position: absolute;
      border-radius: 999px;
      filter: blur(24px);
      opacity: 0.95;
      background: radial-gradient(circle, var(--glow), transparent 70%);
      transform: translateZ(0);
    }

    .orb-a {
      width: 420px;
      height: 420px;
      left: -70px;
      top: -40px;
    }

    .orb-b {
      width: 520px;
      height: 520px;
      right: -120px;
      bottom: -140px;
    }

    .orb-c {
      width: 260px;
      height: 260px;
      right: 18%;
      top: 20%;
      opacity: 0.55;
    }

    .shell {
      position: relative;
      width: min(1180px, calc(100vw - 48px));
      min-height: 680px;
      padding: 0;
      z-index: 1;
    }

    .card {
      position: relative;
      height: 100%;
      min-height: 680px;
      padding: 34px;
      border-radius: 34px;
      background: var(--card);
      border: 1px solid var(--card-border);
      box-shadow: var(--shadow), inset 0 1px 0 rgba(255, 255, 255, 0.05);
      backdrop-filter: blur(24px) saturate(135%);
      overflow: hidden;
      isolation: isolate;
    }

    .card::before {
      content: "";
      position: absolute;
      inset: -40% auto auto -12%;
      width: 70%;
      height: 70%;
      background: radial-gradient(circle, var(--glow), transparent 68%);
      pointer-events: none;
      z-index: -1;
    }

    .card::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: 34px;
      pointer-events: none;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 18%);
      mix-blend-mode: screen;
      opacity: 0.5;
    }

    .header {
      display: flex;
      align-items: start;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 28px;
      position: relative;
      z-index: 1;
    }

    .eyebrow {
      margin: 0 0 8px;
      text-transform: uppercase;
      letter-spacing: 0.24em;
      font-size: 11px;
      font-weight: 700;
      color: var(--muted);
    }

    h1 {
      margin: 0;
      font-size: clamp(40px, 4vw, 60px);
      line-height: 0.98;
      letter-spacing: -0.05em;
      text-wrap: balance;
    }

    .date {
      margin: 10px 0 0;
      font-size: 15px;
      color: var(--muted);
      letter-spacing: 0.01em;
    }

    .badges {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 10px;
    }

    .badge {
      padding: 11px 14px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.08);
      border: 1px solid rgba(255, 255, 255, 0.08);
      color: var(--text);
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.01em;
      white-space: nowrap;
    }

    .badge.subtle {
      color: var(--muted);
      background: rgba(255, 255, 255, 0.05);
    }

    .hero {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: 220px minmax(0, 1fr);
      gap: 24px;
      align-items: center;
      padding: 26px;
      border-radius: 30px;
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.03));
      border: 1px solid rgba(255, 255, 255, 0.08);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    }

    .icon-panel {
      display: grid;
      place-items: center;
      min-height: 220px;
      border-radius: 24px;
      background:
        radial-gradient(circle at 35% 30%, rgba(255, 255, 255, 0.15), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.03));
      border: 1px solid rgba(255, 255, 255, 0.08);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
    }

    .icon {
      font-size: 112px;
      line-height: 1;
      transform: translateY(-2px);
      filter: drop-shadow(0 16px 24px rgba(0, 0, 0, 0.25));
      user-select: none;
    }

    .hero-copy {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .metric-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

    .metric {
      padding: 18px 18px 16px;
      border-radius: 22px;
      background: rgba(255, 255, 255, 0.06);
      border: 1px solid rgba(255, 255, 255, 0.07);
    }

    .metric-label {
      margin-bottom: 10px;
      font-size: 12px;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .metric-value {
      font-size: clamp(38px, 4vw, 62px);
      line-height: 0.95;
      letter-spacing: -0.06em;
    }

    .condition {
      font-size: clamp(22px, 2.1vw, 32px);
      line-height: 1.05;
      letter-spacing: -0.03em;
      font-weight: 700;
      text-wrap: balance;
    }

    .description {
      margin: 0;
      max-width: 720px;
      color: var(--muted);
      font-size: 16px;
      line-height: 1.7;
    }

    .chart-section {
      position: relative;
      z-index: 1;
      margin-top: 22px;
      padding: 22px 22px 18px;
      border-radius: 28px;
      background: rgba(255, 255, 255, 0.04);
      border: 1px solid rgba(255, 255, 255, 0.08);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    }

    .section-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 16px;
      margin-bottom: 16px;
    }

    .section-header h2 {
      margin: 0;
      font-size: 18px;
      letter-spacing: -0.02em;
    }

    .section-header .mini {
      color: var(--muted);
      font-size: 13px;
    }

    .chart-wrap {
      overflow-x: auto;
      padding-bottom: 4px;
    }

    .chart {
      display: grid;
      grid-template-columns: repeat(24, minmax(34px, 1fr));
      gap: 8px;
      min-width: 0;
      align-items: end;
    }

    .hour {
      min-width: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      padding-bottom: 2px;
    }

    .time-label {
      font-size: 12px;
      color: var(--muted);
      letter-spacing: 0.04em;
    }

    .bar-shell {
      position: relative;
      width: 100%;
      height: 160px;
      display: flex;
      align-items: flex-end;
      padding: 8px 8px 10px;
      border-radius: 18px;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
      border: 1px solid rgba(255, 255, 255, 0.06);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
      overflow: hidden;
    }

    .bar-shell::after {
      content: "";
      position: absolute;
      left: 8px;
      right: 8px;
      bottom: 10px;
      height: 1px;
      background: rgba(255, 255, 255, 0.08);
    }

    .bar-fill {
      width: 100%;
      height: 0%;
      border-radius: 999px 999px 10px 10px;
      background: linear-gradient(180deg, var(--accent) 0%, var(--accent2) 100%);
      box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18);
      transition: height 900ms cubic-bezier(0.2, 0.8, 0.2, 1);
      will-change: height;
    }

    .hour-temp {
      font-size: 13px;
      font-weight: 700;
      color: var(--text);
      line-height: 1;
    }

    .error {
      position: relative;
      z-index: 1;
      margin-top: 22px;
      min-height: 360px;
      display: grid;
      place-items: center;
      text-align: center;
      padding: 36px;
      border-radius: 28px;
      background: rgba(255, 255, 255, 0.05);
      border: 1px dashed rgba(255, 255, 255, 0.16);
      color: var(--text);
    }

    .error strong {
      display: block;
      font-size: 28px;
      letter-spacing: -0.04em;
      margin-bottom: 12px;
    }

    .error p {
      margin: 0;
      color: var(--muted);
      font-size: 16px;
      line-height: 1.7;
      max-width: 580px;
    }

    .status {
      color: var(--muted);
      font-size: 14px;
      letter-spacing: 0.01em;
    }

    noscript .noscript {
      margin-top: 22px;
      padding: 18px 20px;
      border-radius: 20px;
      background: rgba(255, 255, 255, 0.05);
      border: 1px solid rgba(255, 255, 255, 0.08);
      color: var(--muted);
      font-size: 14px;
      line-height: 1.6;
    }

    @media (max-width: 980px) {
      body {
        overflow: auto;
      }

      .shell {
        width: min(1180px, calc(100vw - 24px));
      }

      .hero {
        grid-template-columns: 1fr;
      }

      .icon-panel {
        min-height: 160px;
      }

      .chart {
        grid-template-columns: repeat(24, minmax(28px, 1fr));
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .bar-fill {
        transition: none;
      }
    }
  </style>
</head>
<body data-theme="clouds">
  <div class="scene" aria-hidden="true">
    <div class="orb orb-a"></div>
    <div class="orb orb-b"></div>
    <div class="orb orb-c"></div>
  </div>

  <main class="shell">
    <section class="card" aria-label="Weather card">
      <header class="header">
        <div>
          <p class="eyebrow">Weather card</p>
          <h1 id="locationName">Berlin</h1>
          <p class="date" id="dateLabel">Today • UTC</p>
        </div>
        <div class="badges">
          <div class="badge" id="sourceBadge">Loading…</div>
          <div class="badge subtle" id="coordsBadge">52.52° N · 13.41° E</div>
        </div>
      </header>

      <section class="hero" id="hero">
        <div class="icon-panel">
          <div class="icon" id="weatherIcon" aria-hidden="true">☁</div>
        </div>
        <div class="hero-copy">
          <div class="metric-grid">
            <div class="metric">
              <div class="metric-label">Max</div>
              <div class="metric-value" id="maxTemp">--°C</div>
            </div>
            <div class="metric">
              <div class="metric-label">Min</div>
              <div class="metric-value" id="minTemp">--°C</div>
            </div>
          </div>
          <div class="condition" id="condition">Fetching weather data…</div>
          <p class="description" id="description">Loading the same-origin weather feed for the requested day.</p>
        </div>
      </section>

      <section class="chart-section" id="chartSection">
        <div class="section-header">
          <h2>Hourly temperatures</h2>
          <div class="mini" id="hourCount">24 readings</div>
        </div>
        <div class="chart-wrap">
          <div class="chart" id="chart" aria-label="Hourly temperature chart"></div>
        </div>
      </section>

      <div class="error" id="errorState" hidden role="status" aria-live="polite">
        <div>
          <strong>Weather data could not be loaded.</strong>
          <p>Check the location, date, or API availability and try again.</p>
        </div>
      </div>

      <noscript>
        <div class="noscript">JavaScript is required to load the weather data for this card.</div>
      </noscript>
    </section>
  </main>

  <script>
    (function () {
      const params = new URLSearchParams(window.location.search);
      const todayUtc = new Date().toISOString().slice(0, 10);

      const queryDate = params.get("date");
      const requestedDate = isValidDate(queryDate) ? queryDate : todayUtc;

      const latitude = parseNumber(params.get("lat"), 52.52);
      const longitude = parseNumber(params.get("lon"), 13.405);
      const locationName = (params.get("name") || "Berlin").trim() || "Berlin";

      const locationNameEl = document.getElementById("locationName");
      const dateLabelEl = document.getElementById("dateLabel");
      const sourceBadgeEl = document.getElementById("sourceBadge");
      const coordsBadgeEl = document.getElementById("coordsBadge");
      const weatherIconEl = document.getElementById("weatherIcon");
      const maxTempEl = document.getElementById("maxTemp");
      const minTempEl = document.getElementById("minTemp");
      const conditionEl = document.getElementById("condition");
      const descriptionEl = document.getElementById("description");
      const hourCountEl = document.getElementById("hourCount");
      const chartEl = document.getElementById("chart");
      const errorEl = document.getElementById("errorState");
      const heroEl = document.getElementById("hero");
      const chartSectionEl = document.getElementById("chartSection");

      document.title = `${locationName} Weather Card`;
      locationNameEl.textContent = locationName;
      dateLabelEl.textContent = `${formatDateLabel(requestedDate)} • UTC`;
      coordsBadgeEl.textContent = `${formatLat(latitude)} · ${formatLon(longitude)}`;

      setTheme("clouds");
      setLoadingState();

      loadWeather().catch(() => {
        showError("Weather data could not be loaded for the requested location and date.");
      });

      async function loadWeather() {
        const primaryEndpoint = requestedDate < todayUtc ? "/api/om/archive" : "/api/om/forecast";
        const fallbackEndpoint = primaryEndpoint === "/api/om/forecast" ? "/api/om/archive" : "/api/om/forecast";

        try {
          const data = await fetchWeather(primaryEndpoint);
          renderWeather(data, primaryEndpoint);
        } catch (primaryError) {
          try {
            const data = await fetchWeather(fallbackEndpoint);
            renderWeather(data, fallbackEndpoint);
          } catch (fallbackError) {
            throw fallbackError || primaryError;
          }
        }
      }

      async function fetchWeather(endpoint) {
        const search = 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
        });

        const response = await fetch(`${endpoint}?${search.toString()}`, {
          cache: "no-store",
          credentials: "same-origin"
        });

        let json = null;
        try {
          json = await response.json();
        } catch (_) {
          json = null;
        }

        if (!response.ok || !json || json.error) {
          const reason = json && json.reason ? json.reason : `HTTP ${response.status}`;
          throw new Error(reason);
        }

        return json;
      }

      function renderWeather(data, endpoint) {
        const daily = data && data.daily ? data.daily : null;
        const hourly = data && data.hourly ? data.hourly : null;

        const dailyTimes = Array.isArray(daily && daily.time) ? daily.time : [];
        const dailyIndex = dailyTimes.indexOf(requestedDate);
        if (dailyIndex === -1) {
          throw new Error("Requested date not found in daily data.");
        }

        const dailyMax = Number(daily.temperature_2m_max && daily.temperature_2m_max[dailyIndex]);
        const dailyMin = Number(daily.temperature_2m_min && daily.temperature_2m_min[dailyIndex]);
        const weatherCode = Number(daily.weather_code && daily.weather_code[dailyIndex]);

        if (!Number.isFinite(dailyMax) || !Number.isFinite(dailyMin) || !Number.isFinite(weatherCode)) {
          throw new Error("Incomplete daily weather data.");
        }

        const meta = weatherMeta(weatherCode);
        setTheme(meta.theme);

        const hourlyTimes = Array.isArray(hourly && hourly.time) ? hourly.time : [];
        const hourlyTemps = Array.isArray(hourly && hourly.temperature_2m) ? hourly.temperature_2m : [];

        const pairs = [];
        const total = Math.min(hourlyTimes.length, hourlyTemps.length);
        for (let i = 0; i < total; i++) {
          const timeValue = String(hourlyTimes[i]);
          const tempValue = Number(hourlyTemps[i]);
          if (timeValue.startsWith(requestedDate) && Number.isFinite(tempValue)) {
            pairs.push([timeValue, tempValue]);
          }
        }

        if (!pairs.length) {
          throw new Error("Hourly temperatures unavailable.");
        }

        const values = pairs.map((pair) => pair[1]);
        const minHourly = Math.min(...values);
        const maxHourly = Math.max(...values);
        const spread = Math.max(1, maxHourly - minHourly);

        sourceBadgeEl.textContent = endpoint.indexOf("forecast") !== -1 ? "Forecast" : "Archive";
        weatherIconEl.textContent = meta.icon;
        maxTempEl.textContent = `${formatTemp(dailyMax)}°C`;
        minTempEl.textContent = `${formatTemp(dailyMin)}°C`;
        conditionEl.textContent = meta.label;
        descriptionEl.textContent = `${meta.description} High ${formatTemp(dailyMax)}°C and low ${formatTemp(dailyMin)}°C, with ${pairs.length} hourly temperatures in UTC.`;
        hourCountEl.textContent = `${pairs.length} hourly readings`;

        chartEl.innerHTML = pairs.map(([timeValue, tempValue]) => {
          const hourLabel = formatHourLabel(timeValue);
          const height = 12 + ((tempValue - minHourly) / spread) * 84;
          const safeHeight = Math.max(8, Math.min(96, height));
          return `
            <div class="hour" title="${hourLabel}:00 UTC • ${formatTemp(tempValue)}°C">
              <div class="time-label">${hourLabel}</div>
              <div class="bar-shell">
                <div class="bar-fill" style="height:0%" data-target="${safeHeight.toFixed(2)}"></div>
              </div>
              <div class="hour-temp">${formatTemp(tempValue)}°C</div>
            </div>
          `;
        }).join("");

        requestAnimationFrame(() => {
          chartEl.querySelectorAll(".bar-fill").forEach((bar) => {
            bar.style.height = `${bar.dataset.target}%`;
          });
        });

        errorEl.hidden = true;
        heroEl.hidden = false;
        chartSectionEl.hidden = false;
      }

      function showError(message) {
        setTheme("storm");
        sourceBadgeEl.textContent = "Unavailable";
        errorEl.hidden = false;
        heroEl.hidden = true;
        chartSectionEl.hidden = true;
        errorEl.querySelector("p").textContent = message || "Weather data could not be loaded.";
      }

      function setLoadingState() {
        conditionEl.textContent = "Fetching weather data…";
        descriptionEl.textContent = "Loading the same-origin weather feed for the requested day.";
        sourceBadgeEl.textContent = "Loading…";
        hourCountEl.textContent = "Waiting for data";
        chartEl.innerHTML = "";
      }

      function setTheme(theme) {
        document.body.dataset.theme = theme;
      }

      function weatherMeta(code) {
        switch (code) {
          case 0:
            return {
              theme: "clear",
              icon: "☀",
              label: "Clear sky",
              description: "Bright, open skies with plenty of sun."
            };
          case 1:
            return {
              theme: "clear",
              icon: "🌤",
              label: "Mainly clear",
              description: "Mostly sunny with a light cloud veil."
            };
          case 2:
            return {
              theme: "clear",
              icon: "⛅",
              label: "Partly cloudy",
              description: "A mix of sunshine and cloud cover."
            };
          case 3:
            return {
              theme: "clouds",
              icon: "☁",
              label: "Overcast",
              description: "Thick cloud cover with little direct sun."
            };
          case 45:
          case 48:
            return {
              theme: "fog",
              icon: "🌫",
              label: "Fog",
              description: "Reduced visibility and hazy air."
            };
          case 51:
          case 53:
          case 55:
          case 56:
          case 57:
            return {
              theme: "rain",
              icon: "🌦",
              label: "Drizzle",
              description: "Light wet conditions and fine misty rain."
            };
          case 61:
          case 63:
          case 65:
          case 66:
          case 67:
          case 80:
          case 81:
          case 82:
            return {
              theme: "rain",
              icon: "🌧",
              label: "Rain",
              description: "Wet conditions and passing showers."
            };
          case 71:
          case 73:
          case 75:
          case 77:
          case 85:
          case 86:
            return {
              theme: "snow",
              icon: "🌨",
              label: "Snow",
              description: "Wintry precipitation and cold air."
            };
          case 95:
          case 96:
          case 99:
            return {
              theme: "storm",
              icon: "⛈",
              label: "Thunderstorm",
              description: "Thunder activity with intense bursts of rain."
            };
          default:
            return {
              theme: "clouds",
              icon: "☁",
              label: `Weather code ${code}`,
              description: "Mixed conditions for the requested date."
            };
        }
      }

      function parseNumber(value, fallback) {
        const parsed = Number(value);
        return Number.isFinite(parsed) ? parsed : fallback;
      }

      function isValidDate(value) {
        return typeof value === "string" && /^\d{4}-\d{2}-\d{2}$/.test(value) && !Number.isNaN(new Date(`${value}T00:00:00Z`).getTime());
      }

      function formatDateLabel(dateValue) {
        const date = new Date(`${dateValue}T00:00:00Z`);
        return new Intl.DateTimeFormat("en-US", {
          weekday: "long",
          month: "long",
          day: "numeric",
          year: "numeric",
          timeZone: "UTC"
        }).format(date);
      }

      function parseUtcTime(value) {
        const text = String(value || "");
        if (/[zZ]$/.test(text) || /[+-]\d\d:?\d\d$/.test(text)) {
          return new Date(text);
        }
        return new Date(`${text}Z`);
      }

      function formatHourLabel(value) {
        return new Intl.DateTimeFormat("en-US", {
          hour: "2-digit",
          hour12: false,
          timeZone: "UTC"
        }).format(parseUtcTime(value));
      }

      function formatTemp(value) {
        const rounded = Math.round(Number(value) * 10) / 10;
        if (!Number.isFinite(rounded)) {
          return "--";
        }
        return Math.abs(rounded % 1) < 1e-9 ? rounded.toFixed(0) : rounded.toFixed(1);
      }

      function formatLat(value) {
        const hemi = value >= 0 ? "N" : "S";
        return `${Math.abs(value).toFixed(2)}° ${hemi}`;
      }

      function formatLon(value) {
        const hemi = value >= 0 ? "E" : "W";
        return `${Math.abs(value).toFixed(2)}° ${hemi}`;
      }
    })();
  </script>
</body>
</html>

L1 — cheap deterministic descriptors

bytes total26,004html / css / js2,899 / 11,250 / 11,855
dom nodes50dom depth9
css rules61js presentyes
brightness43.1contrast32.8
colorfulness27.7whitespace72.5%

This slot's telemetry

prompt tokens16,097completion tokens35,204
total tokens51,301wall234.1 s
costrequest id
config.json576 B
{
  "N": 2,
  "auth": {
    "credential_ref": "WCB_NONE",
    "method": "oauth-login"
  },
  "billing": "plan",
  "config_id": "gpt-5.4-mini-eff-high--cli--cursor-xl--dev",
  "effort": "high",
  "family": "gpt",
  "m": {
    "min": 2,
    "q": 2
  },
  "model_id": "gpt-5.4-mini",
  "protocol": "cli",
  "served_model": "gpt-5.4-mini-high",
  "telemetry": {
    "completion_tokens": 101032,
    "cost_usd": null,
    "prompt_tokens": 50033,
    "total_tokens": 151065,
    "wall_ms": 700525
  },
  "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": "gpt-5.4-mini-eff-high--cli--cursor-xl--dev",
  "positions": [
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-08-13T15:35:50.488437+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-13T15:34:50.165287+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-13T15:39:48.296989+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-13T15:35:54.124599+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-13T15:46:01.299395+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-13T15:39:51.868102+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-13T15:46:42.067929+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-08-13T15:46:05.423688+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
    }
  }
}