kimi-k3 · go

config: kimi-k3--opencode-go--dev
batch: 2026-07-19--unified
transport: opencode-go-gateway
protocol: api · plan
served model: kimi-k3
captured: Jul 18, 2026, 11:54 AM · N=2

variant

live

slot 1 · P-q · sandboxed iframe

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

similarity neighbors

nearest

gpt-5.6-sol @low · kiro0.63 claude-sonnet-5 @medium · kiro0.61 deepseek-v3.2 · kiro0.61 kimi-k2.7-code · go0.61 claude-opus-4-8 @low · kiro0.59

farthest

minimax-m2.7 · go0.42 gpt-5.5 @medium · codex-oauth0.42 gpt-5.5 @high · codex-oauth0.42 claude-fable-5 · CC0.42 gpt-5.5 @xhigh · codex-oauth0.44

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 tempambiguousshown: 17max-equals-min
min tempambiguousshown: 17max-equals-min
hourlyambiguouscoverage · 0 match · 0 mismatch · 24 not shown
request sidematch0 violation(s)

extractor fidelity-extractor-v1+Berlin-2026-07-15

Source — raw model output, one byte unchanged

download card.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="color-scheme" content="dark">
<title>Weather</title>
<style>
  @property --bg1 { syntax:'<color>'; inherits:true; initial-value:#16222e; }
  @property --bg2 { syntax:'<color>'; inherits:true; initial-value:#3a6073; }
  @property --accent { syntax:'<color>'; inherits:true; initial-value:#fbbf24; }

  :root{
    --bg1:#16222e; --bg2:#3a6073; --accent:#fbbf24;
    --card-bg: rgba(12,19,33,.58);
    --stroke: rgba(255,255,255,.12);
    --text:#f1f5ff;
    --muted: rgba(226,232,255,.6);
    --faint: rgba(226,232,255,.4);
  }

  *{ margin:0; padding:0; box-sizing:border-box; }
  [hidden]{ display:none !important; }
  html,body{ height:100%; }

  body{
    font-family:"Avenir Next","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
    background:#0b1020;
    color:var(--text);
    min-height:100vh;
    display:flex; align-items:center; justify-content:center;
    overflow:hidden;
    -webkit-font-smoothing:antialiased;
    font-variant-numeric: tabular-nums;
  }

  .bg{ position:fixed; inset:0; z-index:0;
    background:linear-gradient(150deg,var(--bg1),var(--bg2));
    transition:--bg1 1.2s ease, --bg2 1.2s ease;
  }
  .blob{ position:fixed; border-radius:50%; filter:blur(90px); z-index:0; pointer-events:none; }
  .b1{ width:540px; height:540px; top:-140px; left:-110px; background:var(--accent); opacity:.24;
       animation:drift 18s ease-in-out infinite alternate; transition:background 1.2s ease; }
  .b2{ width:640px; height:640px; bottom:-240px; right:-170px; background:var(--bg2); opacity:.55;
       animation:drift 24s ease-in-out infinite alternate-reverse; transition:background 1.2s ease; }

  @keyframes drift{ from{ transform:translate3d(0,0,0) scale(1);} to{ transform:translate3d(70px,44px,0) scale(1.12);} }

  .card{
    position:relative; z-index:1;
    width:1080px; max-width:calc(100vw - 64px);
    background:var(--card-bg);
    border:1px solid var(--stroke);
    border-radius:28px;
    backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
    box-shadow:0 34px 90px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.09);
    padding:36px 44px 28px;
    animation:cardIn .65s cubic-bezier(.2,.75,.25,1) both;
  }
  .card::before{
    content:""; position:absolute; top:0; left:8%; right:8%; height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);
  }
  @keyframes cardIn{ from{ opacity:0; transform:translateY(16px) scale(.985);} to{ opacity:1; transform:none;} }

  /* ---------- header ---------- */
  .head{ display:flex; justify-content:space-between; align-items:flex-start; gap:24px; }
  .loc-wrap{ display:flex; align-items:center; gap:12px; }
  .pin{ width:24px; height:24px; color:var(--accent); flex:none; transition:color 1.2s ease; }
  .location{ font-size:34px; font-weight:700; letter-spacing:.2px; line-height:1.1; }
  .coords{ color:var(--muted); font-size:13px; margin-top:6px; letter-spacing:.6px; padding-left:36px; }
  .date{ text-align:right; flex:none; }
  .date .d1{ font-size:17px; font-weight:600; }
  .date .d2{ color:var(--muted); font-size:12px; margin-top:5px; letter-spacing:1.6px; text-transform:uppercase; }

  /* ---------- hero ---------- */
  .hero{ display:flex; align-items:center; gap:38px; margin-top:22px; }
  .wicon{ width:148px; height:148px; flex:none; filter:drop-shadow(0 12px 26px rgba(0,0,0,.4)); }
  .wicon svg{ width:100%; height:100%; overflow:visible; }
  .wicon .rays{ transform-box:fill-box; transform-origin:center; animation:spin 28s linear infinite; }
  .wicon .cloud-main{ animation:floaty 5.5s ease-in-out infinite; }
  .wicon .drop{ animation:dropFall 1.7s ease-in infinite; }
  .wicon .flake{ animation:dropFall 2.6s linear infinite; }
  .wicon .bolt{ transform-box:fill-box; transform-origin:center; animation:boltFlash 3.6s ease-in-out infinite; }
  @keyframes spin{ to{ transform:rotate(360deg);} }
  @keyframes floaty{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-4px);} }
  @keyframes dropFall{ 0%{ transform:translateY(-3px); opacity:0;} 30%{opacity:1;} 75%{opacity:1;} 100%{ transform:translateY(9px); opacity:0;} }
  @keyframes boltFlash{ 0%,70%,100%{opacity:1;} 74%{opacity:.15;} 78%{opacity:1;} 85%{opacity:.3;} 90%{opacity:1;} }

  .big-temp{ font-size:96px; font-weight:800; line-height:.95; letter-spacing:-3px; }
  .big-temp .deg{ font-size:38px; font-weight:600; color:var(--muted); letter-spacing:0; margin-left:6px; vertical-align:34px; }
  .chips{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
  .chip{ display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:999px;
    background:rgba(255,255,255,.07); border:1px solid var(--stroke); font-size:13.5px; color:var(--muted); }
  .chip b{ color:var(--text); font-weight:700; }
  .chip .dot{ width:8px; height:8px; border-radius:50%; }

  .cond{ margin-left:auto; text-align:right; }
  .cond .c1{ font-size:26px; font-weight:700; line-height:1.15; }
  .cond .c2{ color:var(--muted); font-size:11.5px; margin-top:8px; letter-spacing:2.4px; text-transform:uppercase; }

  /* ---------- sections ---------- */
  .section-title{ display:flex; justify-content:space-between; align-items:baseline;
    font-size:11.5px; letter-spacing:2.4px; text-transform:uppercase; color:var(--muted); margin:24px 0 10px; }
  .section-title span:last-child{ letter-spacing:1px; text-transform:none; color:var(--faint); }

  #chart{ width:100%; height:170px; display:block; overflow:visible; }
  .chart-lbl{ font-size:13px; font-weight:700; }
  .chart-tick{ font-size:10px; fill:rgba(226,232,255,.45); letter-spacing:.5px; }

  .hours{ display:grid; grid-template-columns:repeat(12,1fr); gap:8px; }
  .hour{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.07); border-radius:14px;
    padding:9px 4px 8px; text-align:center; transition:transform .15s ease, background .15s ease; }
  .hour:hover{ transform:translateY(-2px); background:rgba(255,255,255,.1); }
  .hour .h{ display:block; font-size:10.5px; color:var(--muted); letter-spacing:.5px; }
  .hour .t{ display:block; font-size:16px; font-weight:700; margin-top:3px; }
  .hour.now{ border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); }
  .hour.hi .t{ color:#fda4af; }
  .hour.lo .t{ color:#7dd3fc; }
  .no-hours{ grid-column:1/-1; color:var(--muted); font-size:13.5px; padding:12px 4px; }

  .foot{ margin-top:22px; display:flex; justify-content:space-between; gap:16px;
    color:var(--faint); font-size:11.5px; letter-spacing:.5px; }

  /* ---------- loading / error ---------- */
  .loading-card, .error-card{ width:560px; text-align:center; padding:64px 48px; }
  .spinner{ width:46px; height:46px; margin:0 auto 20px; border-radius:50%;
    border:3px solid rgba(255,255,255,.15); border-top-color:var(--accent);
    animation:spin .9s linear infinite; }
  .loading-card p{ color:var(--muted); font-size:15px; letter-spacing:.4px; }
  .err-icon{ width:64px; height:64px; margin:0 auto 18px; color:#fda4af; opacity:.9; }
  .err-icon svg{ width:100%; height:100%; }
  .error-card h1{ font-size:24px; font-weight:700; }
  .err-detail{ color:#fda4af; font-size:13.5px; margin-top:12px; word-break:break-word; }
  .err-hint{ color:var(--muted); font-size:13.5px; margin-top:10px; line-height:1.5; }
</style>
</head>
<body>
  <div class="bg"></div>
  <div class="blob b1"></div>
  <div class="blob b2"></div>

  <div id="loadingCard" class="card loading-card">
    <div class="spinner"></div>
    <p>Loading weather…</p>
  </div>

  <div id="errorCard" class="card error-card" hidden>
    <div class="err-icon">
      <svg viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="3.5" stroke-linecap="round" stroke-linejoin="round">
        <path d="M20 44h24a9 9 0 0 0 1.4-17.9A13 13 0 0 0 21 20.6 11.5 11.5 0 0 0 20 44z"/>
        <line x1="14" y1="14" x2="50" y2="50"/>
      </svg>
    </div>
    <h1>Couldn't load weather data</h1>
    <p class="err-detail" id="errDetail"></p>
    <p class="err-hint">The weather data for this location and date could not be retrieved. Check the query parameters and try again later.</p>
  </div>

  <main id="card" class="card" hidden>
    <header class="head">
      <div>
        <div class="loc-wrap">
          <svg class="pin" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
            <path d="M12 21s-7-5.6-7-11a7 7 0 1 1 14 0c0 5.4-7 11-7 11z"/><circle cx="12" cy="10" r="2.6"/>
          </svg>
          <h1 class="location" id="locName">–</h1>
        </div>
        <div class="coords" id="coords"></div>
      </div>
      <div class="date">
        <div class="d1" id="datePretty">–</div>
        <div class="d2" id="dateIso"></div>
      </div>
    </header>

    <section class="hero">
      <div class="wicon" id="wicon" aria-hidden="true"></div>
      <div class="temp-block">
        <div class="big-temp"><span id="tmax">–</span><span class="deg">°C</span></div>
        <div class="chips">
          <span class="chip"><span class="dot" style="background:#fb7185"></span>High&nbsp;<b id="chipHi">–</b></span>
          <span class="chip"><span class="dot" style="background:#7dd3fc"></span>Low&nbsp;<b id="chipLo">–</b></span>
        </div>
      </div>
      <div class="cond">
        <div class="c1" id="condText">–</div>
        <div class="c2">Conditions</div>
      </div>
    </section>

    <section id="chartWrap">
      <div class="section-title"><span>Hourly temperature</span><span id="rangeNote"></span></div>
      <svg id="chart" role="img" aria-label="Hourly temperature chart"></svg>
    </section>

    <section>
      <div class="section-title"><span>Hour by hour</span><span>°C · UTC</span></div>
      <div class="hours" id="hours"></div>
    </section>

    <footer class="foot">
      <span>Data: Open-Meteo compatible API · Temperatures in °C</span>
      <span id="footNote"></span>
    </footer>
  </main>

<script>
(function(){
  'use strict';
  var $ = function(id){ return document.getElementById(id); };

  /* ---------- query parameters ---------- */
  var qs = new URLSearchParams(location.search);
  function numParam(key, d){ var v = parseFloat(qs.get(key)); return Number.isFinite(v) ? v : d; }
  var lat  = numParam('lat', 52.52);
  var lon  = numParam('lon', 13.405);
  var name = (qs.get('name') || 'Berlin').trim() || 'Berlin';
  var today = new Date().toISOString().slice(0,10);
  var date = qs.get('date') || '';
  if(!/^\d{4}-\d{2}-\d{2}$/.test(date) || isNaN(Date.parse(date + 'T00:00:00Z'))) date = today;

  document.title = 'Weather · ' + name;

  var endpoint = date < today ? '/api/om/archive' : '/api/om/forecast';
  var url = endpoint + '?' + new URLSearchParams({
    latitude: lat,
    longitude: lon,
    daily: 'temperature_2m_max,temperature_2m_min,weather_code',
    hourly: 'temperature_2m',
    timezone: 'UTC',
    temperature_unit: 'celsius',
    start_date: date,
    end_date: date
  }).toString();

  /* ---------- weather code table ---------- */
  var WMO = {
    0:['Clear sky','clear'], 1:['Mainly clear','clear'], 2:['Partly cloudy','partly'], 3:['Overcast','cloudy'],
    45:['Fog','fog'], 48:['Rime fog','fog'],
    51:['Light drizzle','drizzle'], 53:['Moderate drizzle','drizzle'], 55:['Dense drizzle','drizzle'],
    56:['Freezing drizzle','drizzle'], 57:['Freezing drizzle','drizzle'],
    61:['Light rain','rain'], 63:['Moderate rain','rain'], 65:['Heavy rain','rain'],
    66:['Freezing rain','rain'], 67:['Freezing rain','rain'],
    71:['Light snow','snow'], 73:['Moderate snow','snow'], 75:['Heavy snow','snow'], 77:['Snow grains','snow'],
    80:['Light rain showers','rain'], 81:['Rain showers','rain'], 82:['Violent rain showers','rain'],
    85:['Snow showers','snow'], 86:['Heavy snow showers','snow'],
    95:['Thunderstorm','thunder'], 96:['Thunderstorm, slight hail','thunder'], 99:['Thunderstorm, heavy hail','thunder']
  };

  var THEMES = {
    clear:  { bg1:'#142636', bg2:'#3a6073', accent:'#fbbf24' },
    partly: { bg1:'#1b2735', bg2:'#3f5871', accent:'#fbbf24' },
    cloudy: { bg1:'#1e242e', bg2:'#414d5e', accent:'#9fb2c8' },
    fog:    { bg1:'#20242b', bg2:'#4a5462', accent:'#cbd5e1' },
    drizzle:{ bg1:'#17242f', bg2:'#33506b', accent:'#7dd3fc' },
    rain:   { bg1:'#101a29', bg2:'#2b4a6b', accent:'#60a5fa' },
    snow:   { bg1:'#1c2836', bg2:'#4c6b8a', accent:'#bae6fd' },
    thunder:{ bg1:'#171327', bg2:'#3c2f63', accent:'#c084fc' }
  };

  /* ---------- icons ---------- */
  var SG = '<defs><radialGradient id="sg" cx=".38" cy=".35" r=".95"><stop offset="0" stop-color="#fde68a"/><stop offset="1" stop-color="#f59e0b"/></radialGradient></defs>';
  var CG = '<defs><linearGradient id="cg" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#f8fafc"/><stop offset="1" stop-color="#b7c4d4"/></linearGradient></defs>';
  var CG2 = '<defs><linearGradient id="cg2" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#c3cedd"/><stop offset="1" stop-color="#77879b"/></linearGradient></defs>';
  var CLOUD_MID = '<g class="cloud-main" fill="url(#cg)"><circle cx="40" cy="52" r="13"/><circle cx="56" cy="44" r="16.5"/><circle cx="70" cy="53" r="11"/><rect x="34" y="52" width="44" height="15" rx="7.5"/></g>';

  var ICONS = {
    clear: '<svg viewBox="0 0 96 96">' + SG +
      '<g class="rays" stroke="#fbbf24" stroke-width="4.5" stroke-linecap="round">' +
      '<line x1="74" y1="48" x2="81" y2="48"/><line x1="66.4" y1="66.4" x2="71.3" y2="71.3"/>' +
      '<line x1="48" y1="74" x2="48" y2="81"/><line x1="29.6" y1="66.4" x2="24.7" y2="71.3"/>' +
      '<line x1="22" y1="48" x2="15" y2="48"/><line x1="29.6" y1="29.6" x2="24.7" y2="24.7"/>' +
      '<line x1="48" y1="22" x2="48" y2="15"/><line x1="66.4" y1="29.6" x2="71.3" y2="24.7"/></g>' +
      '<circle cx="48" cy="48" r="17" fill="url(#sg)"/></svg>',

    partly: '<svg viewBox="0 0 96 96">' + SG + CG +
      '<g class="rays" stroke="#fbbf24" stroke-width="4" stroke-linecap="round">' +
      '<line x1="54" y1="34" x2="59" y2="34"/><line x1="48.7" y1="46.7" x2="52.3" y2="50.3"/>' +
      '<line x1="36" y1="52" x2="36" y2="57"/><line x1="23.3" y1="46.7" x2="19.7" y2="50.3"/>' +
      '<line x1="18" y1="34" x2="13" y2="34"/><line x1="23.3" y1="21.3" x2="19.7" y2="17.7"/>' +
      '<line x1="36" y1="16" x2="36" y2="11"/><line x1="48.7" y1="21.3" x2="52.3" y2="17.7"/></g>' +
      '<circle cx="36" cy="34" r="12.5" fill="url(#sg)"/>' +
      '<g class="cloud-main" fill="url(#cg)"><circle cx="42" cy="58" r="13"/><circle cx="57" cy="50" r="16"/><circle cx="70" cy="59" r="11"/><rect x="36" y="58" width="42" height="15" rx="7.5"/></g></svg>',

    cloudy: '<svg viewBox="0 0 96 96">' + CG + CG2 +
      '<g opacity=".7" fill="url(#cg2)"><circle cx="32" cy="40" r="10"/><circle cx="44" cy="34" r="12.5"/><circle cx="55" cy="41" r="8.5"/><rect x="27" y="40" width="33" height="11" rx="5.5"/></g>' +
      '<g class="cloud-main" fill="url(#cg)"><circle cx="40" cy="62" r="13"/><circle cx="56" cy="54" r="16.5"/><circle cx="70" cy="63" r="11"/><rect x="34" y="62" width="44" height="15" rx="7.5"/></g></svg>',

    fog: '<svg viewBox="0 0 96 96">' + CG +
      '<g class="cloud-main" fill="url(#cg)"><circle cx="40" cy="48" r="13"/><circle cx="56" cy="40" r="16.5"/><circle cx="70" cy="49" r="11"/><rect x="34" y="48" width="44" height="15" rx="7.5"/></g>' +
      '<g stroke="#cbd5e1" stroke-width="4" stroke-linecap="round" opacity=".75">' +
      '<line x1="30" y1="73" x2="66" y2="73"/><line x1="38" y1="81" x2="74" y2="81"/><line x1="32" y1="89" x2="62" y2="89"/></g></svg>',

    drizzle: '<svg viewBox="0 0 96 96">' + CG + CLOUD_MID +
      '<g fill="#7dd3fc"><circle class="drop" cx="40" cy="73" r="2.8"/>' +
      '<circle class="drop" style="animation-delay:.55s" cx="52" cy="76" r="2.8"/>' +
      '<circle class="drop" style="animation-delay:1.1s" cx="64" cy="73" r="2.8"/></g></svg>',

    rain: '<svg viewBox="0 0 96 96">' + CG + CLOUD_MID +
      '<g stroke="#7dd3fc" stroke-width="4.5" stroke-linecap="round">' +
      '<line class="drop" x1="40" y1="72" x2="36.5" y2="81"/>' +
      '<line class="drop" style="animation-delay:.55s" x1="52" y1="72" x2="48.5" y2="81"/>' +
      '<line class="drop" style="animation-delay:1.1s" x1="64" y1="72" x2="60.5" y2="81"/></g></svg>',

    snow: '<svg viewBox="0 0 96 96">' + CG + CLOUD_MID +
      '<g stroke="#e0f2fe" stroke-width="2.4" stroke-linecap="round">' +
      '<g transform="translate(40,76)"><g class="flake"><line x1="-4" y1="0" x2="4" y2="0"/><line x1="-2" y1="-3.4" x2="2" y2="3.4"/><line x1="-2" y1="3.4" x2="2" y2="-3.4"/></g></g>' +
      '<g transform="translate(52,81)"><g class="flake" style="animation-delay:.85s"><line x1="-4" y1="0" x2="4" y2="0"/><line x1="-2" y1="-3.4" x2="2" y2="3.4"/><line x1="-2" y1="3.4" x2="2" y2="-3.4"/></g></g>' +
      '<g transform="translate(64,76)"><g class="flake" style="animation-delay:1.7s"><line x1="-4" y1="0" x2="4" y2="0"/><line x1="-2" y1="-3.4" x2="2" y2="3.4"/><line x1="-2" y1="3.4" x2="2" y2="-3.4"/></g></g></g></svg>',

    thunder: '<svg viewBox="0 0 96 96">' + CG2 +
      '<g class="cloud-main" fill="url(#cg2)"><circle cx="40" cy="52" r="13"/><circle cx="56" cy="44" r="16.5"/><circle cx="70" cy="53" r="11"/><rect x="34" y="52" width="44" height="15" rx="7.5"/></g>' +
      '<path class="bolt" d="M50 66 L40 82 L48 82 L43 94 L60 74 L51 74 L58 66 Z" fill="#fbbf24"/></svg>'
  };

  /* ---------- helpers ---------- */
  function applyTheme(kind){
    var t = THEMES[kind] || THEMES.cloudy;
    var st = document.documentElement.style;
    st.setProperty('--bg1', t.bg1);
    st.setProperty('--bg2', t.bg2);
    st.setProperty('--accent', t.accent);
  }
  function currentAccent(){
    return getComputedStyle(document.documentElement).getPropertyValue('--accent').trim() || '#fbbf24';
  }
  function fmtCoord(v, pos, neg){ return Math.abs(v).toFixed(2) + '° ' + (v >= 0 ? pos : neg); }
  function prettyDate(dstr){
    try{
      return new Intl.DateTimeFormat('en-GB', { weekday:'long', day:'numeric', month:'long', year:'numeric', timeZone:'UTC' })
        .format(new Date(dstr + 'T00:00:00Z'));
    }catch(e){ return dstr; }
  }
  function R(v){ return Math.round(v * 10) / 10; }
  function smooth(pts){
    var d = 'M ' + R(pts[0].x) + ' ' + R(pts[0].y);
    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;
      d += ' C ' + R(p1.x + (p2.x - p0.x)/6) + ' ' + R(p1.y + (p2.y - p0.y)/6) +
           ' '  + R(p2.x - (p3.x - p1.x)/6) + ' ' + R(p2.y - (p3.y - p1.y)/6) +
           ' '  + R(p2.x) + ' ' + R(p2.y);
    }
    return d;
  }

  /* ---------- chart ---------- */
  var lastHours = null;
  function renderChart(hours){
    var svg = $('chart'), wrap = $('chartWrap');
    var valid = hours.filter(function(h){ return h.temp != null; });
    if(valid.length < 2){ wrap.hidden = true; return; }
    wrap.hidden = false;
    var W = Math.max(svg.clientWidth, 320);
    var H = 170, padL = 16, padR = 16, padT = 30, padB = 26;
    var nums = valid.map(function(h){ return h.temp; });
    var lo = Math.min.apply(null, nums), hi = Math.max.apply(null, nums);
    var span = (hi - lo) || 1;
    var n = hours.length;
    var X = function(i){ return padL + (n <= 1 ? 0 : i * (W - padL - padR) / (n - 1)); };
    var Y = function(t){ return padT + (1 - (t - lo) / span) * (H - padT - padB); };
    var pts = [];
    hours.forEach(function(h, i){ if(h.temp != null) pts.push({ x:X(i), y:Y(h.temp), t:h.temp }); });
    var accent = currentAccent();
    var s = '<defs><linearGradient id="areaG" x1="0" y1="0" x2="0" y2="1">' +
            '<stop offset="0" stop-color="' + accent + '" stop-opacity=".3"/>' +
            '<stop offset="1" stop-color="' + accent + '" stop-opacity="0"/></linearGradient></defs>';
    [lo, (lo + hi) / 2, hi].forEach(function(t){
      s += '<line x1="' + R(padL) + '" y1="' + R(Y(t)) + '" x2="' + R(W - padR) + '" y2="' + R(Y(t)) +
           '" stroke="rgba(255,255,255,.08)" stroke-width="1" stroke-dasharray="2 6"/>';
    });
    var line = smooth(pts);
    s += '<path d="' + line + ' L ' + R(pts[pts.length-1].x) + ' ' + (H - padB + 8) + ' L ' + R(pts[0].x) + ' ' + (H - padB + 8) + ' Z" fill="url(#areaG)"/>';
    s += '<path d="' + line + '" fill="none" stroke="' + accent + '" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>';
    pts.forEach(function(p){
      s += '<circle cx="' + R(p.x) + '" cy="' + R(p.y) + '" r="2.6" fill="#0d1422" stroke="' + accent + '" stroke-width="1.6"/>';
    });
    var pHi = null, pLo = null;
    pts.forEach(function(p){ if(pHi === null && p.t === hi) pHi = p; if(pLo === null && p.t === lo) pLo = p; });
    if(pHi) s += '<text x="' + R(pHi.x) + '" y="' + R(pHi.y - 12) + '" text-anchor="middle" class="chart-lbl" fill="' + accent + '">' + Math.round(hi) + '°</text>';
    if(pLo && pLo !== pHi) s += '<text x="' + R(pLo.x) + '" y="' + R(pLo.y + 20) + '" text-anchor="middle" class="chart-lbl" fill="#93c5fd">' + Math.round(lo) + '°</text>';
    hours.forEach(function(h, i){
      if(i % 3 === 0) s += '<text x="' + R(X(i)) + '" y="' + (H - 6) + '" text-anchor="middle" class="chart-tick">' + h.time.slice(0,2) + '</text>';
    });
    svg.setAttribute('viewBox', '0 0 ' + W + ' ' + H);
    svg.innerHTML = s;
  }

  /* ---------- render ---------- */
  function render(data){
    var tmax = data.tmax, tmin = data.tmin, code = data.code, hours = data.hours;
    var info = code == null ? ['Unavailable','cloudy'] : (WMO[code] || ['Weather code ' + code, 'cloudy']);
    applyTheme(info[1]);

    $('locName').textContent = name;
    $('coords').textContent = fmtCoord(lat, 'N', 'S') + ' · ' + fmtCoord(lon, 'E', 'W');
    $('datePretty').textContent = prettyDate(date);
    $('dateIso').textContent = date + ' · UTC';
    $('tmax').textContent = Math.round(tmax);
    $('chipHi').textContent = Math.round(tmax) + '°C';
    $('chipLo').textContent = Math.round(tmin) + '°C';
    $('condText').textContent = info[0];
    $('wicon').innerHTML = ICONS[info[1]];
    $('rangeNote').textContent = 'Min ' + Math.round(tmin) + '° · Max ' + Math.round(tmax) + '°';

    var hoursEl = $('hours');
    hoursEl.innerHTML = '';
    if(!hours.length){
      var nh = document.createElement('div');
      nh.className = 'no-hours';
      nh.textContent = 'No hourly data available for this date.';
      hoursEl.appendChild(nh);
    } else {
      var temps = hours.map(function(h){ return h.temp; }).filter(function(t){ return t != null; });
      var hi = Math.max.apply(null, temps), lo = Math.min.apply(null, temps);
      var nowH = new Date().getUTCHours();
      hours.forEach(function(h){
        var cell = document.createElement('div');
        cell.className = 'hour';
        if(h.temp != null && h.temp === hi) cell.classList.add('hi');
        if(h.temp != null && h.temp === lo) cell.classList.add('lo');
        if(date === today && parseInt(h.time.slice(0,2), 10) === nowH) cell.classList.add('now');
        var hh = document.createElement('span'); hh.className = 'h'; hh.textContent = h.time;
        var tt = document.createElement('span'); tt.className = 't';
        tt.textContent = h.temp == null ? '–' : Math.round(h.temp) + '°';
        cell.appendChild(hh); cell.appendChild(tt);
        hoursEl.appendChild(cell);
      });
    }
    $('footNote').textContent = (endpoint.indexOf('archive') >= 0 ? 'Archive' : 'Forecast') + ' dataset';

    lastHours = hours;
    $('loadingCard').hidden = true;
    $('errorCard').hidden = true;
    $('card').hidden = false;
    requestAnimationFrame(function(){ renderChart(hours); });
  }

  function showError(err){
    if(window.console && console.error) console.error(err);
    $('loadingCard').hidden = true;
    $('card').hidden = true;
    $('errDetail').textContent = err && err.message ? err.message : String(err);
    $('errorCard').hidden = false;
  }

  /* ---------- load ---------- */
  fetch(url, { headers: { 'Accept': 'application/json' } })
    .then(function(res){
      if(!res.ok) throw new Error('The ' + (endpoint.indexOf('archive') >= 0 ? 'archive' : 'forecast') + ' API returned HTTP ' + res.status + '.');
      return res.json().then(function(data){ return data; }, function(){
        throw new Error('The API response was not valid JSON.');
      });
    })
    .then(function(data){
      if(data && data.error) throw new Error(data.reason || 'The API reported an error.');
      var daily = data && data.daily;
      if(!daily || !Array.isArray(daily.time) || !daily.time.length)
        throw new Error('No daily data was returned for this date.');
      var di = daily.time.indexOf(date);
      if(di < 0) di = 0;
      var tmax = daily.temperature_2m_max && daily.temperature_2m_max[di];
      var tmin = daily.temperature_2m_min && daily.temperature_2m_min[di];
      var code = daily.weather_code && daily.weather_code[di];
      if(tmax == null || tmin == null)
        throw new Error('Daily temperature values are missing for this date.');
      var hours = [];
      var hourly = data.hourly;
      if(hourly && Array.isArray(hourly.time) && Array.isArray(hourly.temperature_2m)){
        hourly.time.forEach(function(t, i){
          if(typeof t === 'string' && t.slice(0,10) === date)
            hours.push({ time: t.slice(11,16) || t.slice(11), temp: hourly.temperature_2m[i] });
        });
      }
      render({ tmax: tmax, tmin: tmin, code: code, hours: hours });
    })
    .catch(showError);

  var rt;
  window.addEventListener('resize', function(){
    clearTimeout(rt);
    rt = setTimeout(function(){
      if(lastHours && !$('card').hidden) renderChart(lastHours);
    }, 150);
  });
})();
</script>
</body>
</html>

L1 — cheap deterministic descriptors

bytes total	25,915	html / css / js	2,955 / 7,205 / 15,755
dom nodes	64	dom depth	8
css rules	84	js present	yes
brightness	45.8	contrast	22.9
colorfulness	16.2	whitespace	62.9%

This slot's telemetry

prompt tokens	390	completion tokens	29,568
total tokens	29,958	wall	857.6 s
cost	—	request id	—

config.json532 B

{
  "N": 2,
  "auth": {
    "credential_ref": "WCB_OPENCODE_KEY",
    "method": "oauth"
  },
  "billing": "plan",
  "config_id": "kimi-k3--opencode-go--dev",
  "effort": null,
  "family": "kimi",
  "m": {
    "min": 2,
    "q": 1
  },
  "model_id": "kimi-k3",
  "protocol": "api",
  "served_model": "kimi-k3",
  "telemetry": {
    "completion_tokens": 40019,
    "cost_usd": null,
    "prompt_tokens": 1154,
    "total_tokens": 41173,
    "wall_ms": 1100791
  },
  "transport": "opencode-go-gateway",
  "vendor_sanction_ref": null
}

send-log2.5 KB

{
  "N": 2,
  "batch_id": "2026-07-19--go-requeue2",
  "config_id": "kimi-k3--opencode-go--dev",
  "positions": [
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-18T20:10:54.723462+00:00",
          "http_status": 200,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-18T20:08:30.370974+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-07-18T20:22:33.293951+00:00",
          "http_status": 200,
          "outcome": "infra-failed",
          "reached_model": true,
          "reason": "mid-stream-death",
          "request_id": null,
          "started_at": "2026-07-18T20:10:58.217262+00:00"
        }
      ],
      "block_index": 0,
      "model_reaching_attempt_index": 0,
      "slot_index": 0,
      "terminal_state": "infra-failed",
      "variant": "P-q"
    },
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-18T20:36:50.947438+00:00",
          "http_status": 200,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-18T20:22:33.297423+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-07-18T20:38:33.946250+00:00",
          "http_status": 200,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-18T20:36:55.151514+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
    }
  }
}