gpt-5.6-luna @ max · cursor-xl
cursor-xlmax
- config
- gpt-5.6-luna-eff-max--cli--cursor-xl--dev
- batch
- 2026-07-19--unified
- transport
- cursor-agent-cli-isolated-home
- protocol
- cli · plan
- served model
- gpt-5.6-luna-max
- 采集于
- 2026年7月18日 11:54 · N=2
variant
live
slot 0 · P-q · sandboxed iframe

截图是 similarity 通道测量时的原始像素。运行 live 会在 sandboxed iframe 中重新执行原始输出;渲染结果取决于你的浏览器和字体,不保证与测量像素一致。
similarity 邻居
最近
gpt-5.6-terra @max · cursor-xl0.75gpt-5.6-luna @xhigh · kiro0.74gpt-5.6-luna @xhigh · cursor-xl0.74gpt-5.6-luna @xhigh · cursor0.73gpt-5.6-luna @max · kiro0.72最远
north-mini-code-free · api0.48claude-haiku-4-5 @max · CC0.48claude-sonnet-4 · cursor0.49claude-sonnet-4-thinking · cursor0.49claude-haiku-4-5 @medium · CC0.50限于 session 2026-07-19--unified
similarity 衡量本 session 内的趋同程度 —— 不是质量。
Fidelity —— 卡片展示的数据对不对?
- namematch
- conditionmatch
- datematch
- max tempmismatch展示值:16
- min tempmismatch展示值:25
- hourlymatchcoverage 24/24 · 24 命中 · 0 不符 · 0 未展示
- request sidematch0 处违规
extractor fidelity-extractor-v1+Berlin-2026-07-15
源码 —— 原始模型输出,一字节未改
下载 card.html<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="data:,">
<title>Weather Card</title>
<style>
:root {
color-scheme: dark;
--ink: #f4f7fb;
--muted: #91a4bb;
--soft: #6f849e;
--panel: rgba(255, 255, 255, 0.055);
--line: rgba(255, 255, 255, 0.105);
--gold: #ffd783;
--blue: #9bdcff;
--accent: #8ccfff;
}
* {
box-sizing: border-box;
}
html,
body {
min-height: 100%;
margin: 0;
}
body {
overflow-x: hidden;
background:
radial-gradient(circle at 8% 14%, rgba(45, 126, 167, 0.24), transparent 31%),
radial-gradient(circle at 92% 84%, rgba(76, 65, 154, 0.22), transparent 34%),
#07111f;
color: var(--ink);
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
-webkit-font-smoothing: antialiased;
}
[hidden] {
display: none !important;
}
.app {
display: flex;
min-height: 100vh;
align-items: center;
justify-content: center;
padding: 24px 48px;
}
.weather-card {
position: relative;
display: flex;
width: min(1180px, 100%);
height: min(748px, calc(100vh - 48px));
min-height: 640px;
flex-direction: column;
overflow: hidden;
border: 1px solid rgba(185, 221, 255, 0.14);
border-radius: 30px;
background:
linear-gradient(135deg, rgba(20, 42, 66, 0.98), rgba(10, 25, 43, 0.985) 58%, rgba(12, 24, 43, 0.99)),
#0d2037;
box-shadow:
0 30px 90px rgba(0, 0, 0, 0.42),
inset 0 1px rgba(255, 255, 255, 0.08);
}
.weather-card::before,
.weather-card::after {
position: absolute;
z-index: 0;
pointer-events: none;
content: "";
border-radius: 50%;
}
.weather-card::before {
top: -260px;
right: -160px;
width: 620px;
height: 620px;
border: 1px solid rgba(164, 216, 255, 0.1);
box-shadow:
0 0 0 30px rgba(164, 216, 255, 0.018),
0 0 0 75px rgba(164, 216, 255, 0.014);
}
.weather-card::after {
bottom: -300px;
left: -240px;
width: 560px;
height: 560px;
background: radial-gradient(circle, rgba(75, 145, 186, 0.08), transparent 68%);
}
.topbar,
.content-stage {
position: relative;
z-index: 1;
}
.topbar {
display: flex;
min-height: 88px;
align-items: center;
justify-content: space-between;
padding: 22px 42px;
border-bottom: 1px solid var(--line);
}
.brand {
display: flex;
align-items: center;
gap: 14px;
}
.brand-symbol {
position: relative;
width: 42px;
height: 42px;
flex: 0 0 auto;
border: 1px solid rgba(255, 218, 139, 0.34);
border-radius: 50%;
background: linear-gradient(145deg, rgba(255, 218, 139, 0.25), rgba(255, 218, 139, 0.035));
box-shadow: 0 0 28px rgba(255, 194, 89, 0.12);
}
.brand-symbol::before {
position: absolute;
top: 8px;
left: 8px;
width: 24px;
height: 24px;
border: 1px solid rgba(255, 220, 150, 0.4);
border-radius: 50%;
content: "";
}
.brand-symbol span {
position: absolute;
top: 17px;
left: 17px;
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--gold);
box-shadow: 0 0 14px rgba(255, 215, 131, 0.8);
}
.brand-overline,
.section-label {
margin: 0 0 4px;
color: #83a0bd;
font-size: 10px;
font-weight: 700;
letter-spacing: 0.19em;
line-height: 1.2;
text-transform: uppercase;
}
.brand-name {
color: #f6f8fb;
font-size: 15px;
font-weight: 650;
letter-spacing: -0.01em;
}
.data-meta,
.reading-badge {
display: flex;
align-items: center;
gap: 9px;
color: #9aafc4;
font-size: 10px;
font-weight: 700;
letter-spacing: 0.13em;
text-transform: uppercase;
}
.meta-dot,
.status-dot {
width: 7px;
height: 7px;
border-radius: 50%;
background: #84d7bd;
box-shadow: 0 0 0 4px rgba(132, 215, 189, 0.1), 0 0 12px rgba(132, 215, 189, 0.6);
}
.meta-divider {
width: 1px;
height: 14px;
margin: 0 4px;
background: rgba(255, 255, 255, 0.16);
}
.content-stage {
display: flex;
min-height: 0;
flex: 1;
flex-direction: column;
}
.state {
display: flex;
min-height: 0;
flex: 1;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 40px;
text-align: center;
}
.state p {
margin: 18px 0 6px;
color: #e9f0f7;
font-size: 17px;
font-weight: 600;
}
.state small {
color: var(--muted);
font-size: 12px;
}
.loading-ring {
position: relative;
width: 50px;
height: 50px;
border: 1px solid rgba(155, 220, 255, 0.18);
border-top-color: var(--accent);
border-radius: 50%;
animation: spin 1.1s linear infinite;
}
.loading-ring::after {
position: absolute;
top: 12px;
left: 12px;
width: 24px;
height: 24px;
border: 1px solid rgba(255, 215, 131, 0.24);
border-bottom-color: var(--gold);
border-radius: 50%;
content: "";
animation: spin 1.7s linear infinite reverse;
}
.error-symbol {
display: grid;
width: 48px;
height: 48px;
place-items: center;
border: 1px solid rgba(255, 145, 139, 0.45);
border-radius: 50%;
color: #ffaaa4;
font-size: 22px;
font-weight: 700;
background: rgba(255, 112, 104, 0.1);
}
.retry-button {
margin-top: 22px;
padding: 10px 17px;
border: 1px solid rgba(155, 220, 255, 0.27);
border-radius: 999px;
color: #dff4ff;
font: inherit;
font-size: 12px;
font-weight: 700;
background: rgba(155, 220, 255, 0.1);
cursor: pointer;
transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}
.retry-button:hover {
border-color: rgba(155, 220, 255, 0.55);
background: rgba(155, 220, 255, 0.18);
transform: translateY(-1px);
}
#weatherContent {
display: flex;
min-height: 0;
flex: 1;
flex-direction: column;
}
.overview {
position: relative;
display: grid;
flex: 0 0 auto;
grid-template-columns: minmax(0, 1.2fr) minmax(390px, 0.8fr);
gap: 48px;
padding: 30px 42px 26px;
border-bottom: 1px solid var(--line);
}
.overview-copy {
position: relative;
z-index: 1;
min-width: 0;
}
.label-row {
display: flex;
align-items: center;
gap: 13px;
}
.label-row .section-label {
margin: 0;
}
.day-type {
padding: 5px 8px;
border: 1px solid rgba(155, 220, 255, 0.18);
border-radius: 5px;
color: #9ad9f5;
font-size: 9px;
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
background: rgba(155, 220, 255, 0.07);
}
.location-title {
display: flex;
max-width: 650px;
align-items: center;
gap: 13px;
margin-top: 10px;
}
.location-title h1 {
overflow: hidden;
margin: 0;
color: #f7f9fc;
font-size: clamp(42px, 5vw, 66px);
font-weight: 650;
letter-spacing: -0.065em;
line-height: 0.98;
text-overflow: ellipsis;
white-space: nowrap;
}
.location-pin {
display: grid;
width: 26px;
height: 26px;
flex: 0 0 auto;
place-items: center;
border: 1px solid rgba(155, 220, 255, 0.27);
border-radius: 50%;
color: #9bdcff;
font-size: 13px;
background: rgba(155, 220, 255, 0.08);
}
.date-line {
margin: 12px 0 0;
color: #a5b8ca;
font-size: 15px;
font-weight: 500;
letter-spacing: -0.01em;
}
.condition-row {
display: flex;
align-items: center;
gap: 17px;
margin-top: 26px;
}
.weather-icon {
display: grid;
width: 76px;
height: 76px;
flex: 0 0 auto;
place-items: center;
border: 1px solid rgba(255, 255, 255, 0.13);
border-radius: 23px;
font-family: Georgia, serif;
font-size: 43px;
line-height: 1;
background: rgba(255, 255, 255, 0.06);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
}
.weather-icon.tone-clear {
color: var(--gold);
border-color: rgba(255, 215, 131, 0.27);
background: linear-gradient(145deg, rgba(255, 215, 131, 0.2), rgba(255, 215, 131, 0.035));
box-shadow: 0 8px 28px rgba(255, 192, 85, 0.1), inset 0 1px rgba(255, 255, 255, 0.15);
}
.weather-icon.tone-cloud {
color: #c9e4f5;
background: linear-gradient(145deg, rgba(180, 221, 242, 0.18), rgba(180, 221, 242, 0.035));
}
.weather-icon.tone-rain {
color: #8fd6ff;
border-color: rgba(143, 214, 255, 0.25);
background: linear-gradient(145deg, rgba(97, 176, 230, 0.18), rgba(97, 176, 230, 0.035));
}
.weather-icon.tone-snow {
color: #e1f5ff;
border-color: rgba(225, 245, 255, 0.25);
background: linear-gradient(145deg, rgba(191, 226, 245, 0.17), rgba(191, 226, 245, 0.035));
}
.weather-icon.tone-storm {
color: #d8caff;
border-color: rgba(192, 169, 255, 0.3);
background: linear-gradient(145deg, rgba(145, 116, 225, 0.2), rgba(145, 116, 225, 0.035));
}
.condition-copy {
display: flex;
min-width: 0;
flex-direction: column;
gap: 7px;
}
.condition-name {
color: #edf5fb;
font-size: 21px;
font-weight: 650;
letter-spacing: -0.03em;
}
.condition-detail {
color: #8fa7bd;
font-size: 12px;
}
.metrics {
position: relative;
z-index: 1;
display: grid;
align-self: center;
grid-template-columns: 1fr 1fr;
gap: 12px;
}
.metric {
min-height: 154px;
padding: 20px 20px 17px;
border: 1px solid var(--line);
border-radius: 18px;
background: rgba(255, 255, 255, 0.045);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.04);
}
.metric.high {
border-color: rgba(255, 215, 131, 0.19);
background: linear-gradient(150deg, rgba(255, 215, 131, 0.13), rgba(255, 215, 131, 0.025));
}
.metric.low {
border-color: rgba(155, 220, 255, 0.19);
background: linear-gradient(150deg, rgba(155, 220, 255, 0.13), rgba(155, 220, 255, 0.025));
}
.metric-label {
display: block;
color: #91a7bb;
font-size: 10px;
font-weight: 700;
letter-spacing: 0.17em;
text-transform: uppercase;
}
.metric-value {
display: flex;
align-items: baseline;
gap: 4px;
margin-top: 22px;
}
.metric-value strong {
color: #fff;
font-size: 50px;
font-weight: 600;
letter-spacing: -0.075em;
line-height: 0.9;
}
.metric.high .metric-value strong {
color: #ffe3a5;
}
.metric.low .metric-value strong {
color: #bdeaff;
}
.metric-unit {
color: #9aafc3;
font-size: 16px;
font-weight: 600;
}
.metric-note {
display: block;
margin-top: 17px;
color: #6e879f;
font-size: 11px;
}
.hourly-section {
display: flex;
min-height: 0;
flex: 1;
flex-direction: column;
padding: 22px 42px 17px;
}
.section-head {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 20px;
margin-bottom: 12px;
}
.section-head h2 {
margin: 0;
color: #eff5fa;
font-size: 19px;
font-weight: 600;
letter-spacing: -0.035em;
}
.reading-badge {
padding: 8px 10px;
border: 1px solid rgba(132, 215, 189, 0.16);
border-radius: 7px;
color: #95b9af;
font-size: 9px;
letter-spacing: 0.12em;
background: rgba(132, 215, 189, 0.055);
white-space: nowrap;
}
.reading-badge .status-dot {
width: 5px;
height: 5px;
box-shadow: 0 0 0 3px rgba(132, 215, 189, 0.08), 0 0 9px rgba(132, 215, 189, 0.5);
}
.curve-panel {
display: grid;
min-height: 82px;
flex: 0 0 auto;
grid-template-columns: 135px minmax(0, 1fr);
align-items: center;
margin-bottom: 13px;
padding: 7px 14px 7px 17px;
border: 1px solid rgba(155, 220, 255, 0.1);
border-radius: 15px;
background: rgba(5, 18, 33, 0.25);
}
.curve-copy {
display: flex;
flex-direction: column;
gap: 6px;
}
.curve-copy span {
color: #718ba4;
font-size: 9px;
font-weight: 700;
letter-spacing: 0.16em;
text-transform: uppercase;
}
.curve-copy strong {
color: #d6e8f5;
font-size: 14px;
font-weight: 600;
}
#tempChart {
display: block;
width: 100%;
height: 68px;
overflow: visible;
}
.hourly-grid {
display: grid;
min-height: 0;
flex: 1;
align-content: center;
grid-template-columns: repeat(12, minmax(0, 1fr));
gap: 8px;
}
.hour-card {
position: relative;
display: grid;
min-width: 0;
min-height: 63px;
grid-template-columns: minmax(0, 1fr) 8px minmax(0, 1fr);
align-items: center;
gap: 5px;
padding: 9px 8px;
border: 1px solid rgba(255, 255, 255, 0.075);
border-radius: 11px;
background: rgba(255, 255, 255, 0.035);
transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}
.hour-card:hover {
border-color: rgba(155, 220, 255, 0.3);
background: rgba(155, 220, 255, 0.08);
transform: translateY(-2px);
}
.hour-card.peak {
border-color: rgba(255, 215, 131, 0.28);
background: rgba(255, 215, 131, 0.075);
}
.hour-card.dip {
border-color: rgba(155, 220, 255, 0.25);
background: rgba(155, 220, 255, 0.06);
}
.hour-time {
overflow: hidden;
color: #91a7bb;
font-size: 10px;
font-weight: 700;
letter-spacing: -0.02em;
text-overflow: ellipsis;
}
.hour-visual {
display: flex;
width: 8px;
height: 34px;
align-items: flex-end;
justify-content: center;
}
.hour-bar {
display: block;
width: 5px;
min-height: 7px;
border-radius: 999px;
background: linear-gradient(to top, #6eadd0, #b8e6f8);
box-shadow: 0 0 8px rgba(155, 220, 255, 0.15);
}
.hour-card.peak .hour-bar {
background: linear-gradient(to top, #f0a64f, #ffe5a3);
box-shadow: 0 0 9px rgba(255, 204, 115, 0.25);
}
.hour-temp {
color: #e6f2fa;
font-size: 12px;
font-weight: 650;
letter-spacing: -0.04em;
text-align: right;
white-space: nowrap;
}
.hour-card.peak .hour-temp {
color: #ffe3a5;
}
.hour-card.dip .hour-temp {
color: #bce9ff;
}
.card-footer {
display: flex;
flex: 0 0 auto;
align-items: center;
justify-content: space-between;
gap: 20px;
padding: 0 42px 21px;
color: #668099;
font-size: 10px;
letter-spacing: 0.05em;
}
.card-footer span:last-child {
color: #7792aa;
font-variant-numeric: tabular-nums;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
@media (max-width: 920px) {
.app {
padding: 16px;
}
.weather-card {
height: auto;
min-height: calc(100vh - 32px);
}
.overview {
grid-template-columns: 1fr;
gap: 28px;
}
.metrics {
align-self: stretch;
}
.hourly-grid {
grid-template-columns: repeat(6, minmax(0, 1fr));
}
}
@media (max-width: 600px) {
.topbar,
.overview,
.hourly-section {
padding-right: 22px;
padding-left: 22px;
}
.topbar {
min-height: 76px;
}
.data-meta {
display: none;
}
.overview {
gap: 24px;
padding-top: 25px;
}
.location-title h1 {
font-size: 46px;
}
.metrics {
gap: 8px;
}
.metric {
min-height: 132px;
padding: 16px;
}
.metric-value {
margin-top: 18px;
}
.metric-value strong {
font-size: 42px;
}
.hourly-grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.curve-panel {
grid-template-columns: 105px minmax(0, 1fr);
padding-left: 12px;
}
.card-footer {
padding-right: 22px;
padding-left: 22px;
}
}
</style>
</head>
<body>
<div class="app">
<section class="weather-card" aria-label="Daily weather card">
<header class="topbar">
<div class="brand">
<div class="brand-symbol" aria-hidden="true"><span></span></div>
<div>
<p class="brand-overline">Atmosphere / 24h</p>
<div class="brand-name">Weather card</div>
</div>
</div>
<div class="data-meta">
<span class="meta-dot" aria-hidden="true"></span>
<span id="modeLabel">Data view</span>
<span class="meta-divider" aria-hidden="true"></span>
<span>UTC · Celsius</span>
</div>
</header>
<div class="content-stage">
<div id="loadingState" class="state" role="status" aria-live="polite">
<div class="loading-ring" aria-hidden="true"></div>
<p>Reading atmospheric data…</p>
<small>Preparing your daily outlook in UTC</small>
</div>
<div id="errorState" class="state" role="alert" hidden>
<div class="error-symbol" aria-hidden="true">!</div>
<p>Unable to load weather data.</p>
<small id="errorDetail">The weather service did not return a usable response.</small>
<button id="retryButton" class="retry-button" type="button">Try again</button>
</div>
<main id="weatherContent" hidden>
<section class="overview">
<div class="overview-copy">
<div class="label-row">
<p class="section-label">Daily forecast</p>
<span id="dayType" class="day-type">Forecast</span>
</div>
<div class="location-title">
<h1 id="locationName">Berlin</h1>
<span class="location-pin" aria-hidden="true">⌖</span>
</div>
<p id="fullDate" class="date-line">Friday, August 14, 2026</p>
<div class="condition-row">
<div id="weatherIcon" class="weather-icon tone-clear" aria-hidden="true">☼</div>
<div class="condition-copy">
<strong id="conditionName" class="condition-name">Clear sky</strong>
<span id="conditionDetail" class="condition-detail">Daily condition · WMO code 0</span>
</div>
</div>
</div>
<div class="metrics" aria-label="Daily high and low temperatures">
<div class="metric high">
<span class="metric-label">Maximum</span>
<div class="metric-value">
<strong id="maxTemp">—</strong>
<span class="metric-unit">°C</span>
</div>
<span class="metric-note">Expected daily high</span>
</div>
<div class="metric low">
<span class="metric-label">Minimum</span>
<div class="metric-value">
<strong id="minTemp">—</strong>
<span class="metric-unit">°C</span>
</div>
<span class="metric-note">Expected daily low</span>
</div>
</div>
</section>
<section class="hourly-section" aria-labelledby="hourlyHeading">
<div class="section-head">
<div>
<p class="section-label">Hourly temperature</p>
<h2 id="hourlyHeading">Temperature curve</h2>
</div>
<div class="reading-badge">
<span class="status-dot" aria-hidden="true"></span>
<span id="readingCount">24 readings · UTC</span>
</div>
</div>
<div class="curve-panel">
<div class="curve-copy">
<span>Hourly range</span>
<strong id="curveRange">—</strong>
</div>
<svg id="tempChart" viewBox="0 0 1000 92" preserveAspectRatio="none" role="img" aria-label="Hourly temperature curve"></svg>
</div>
<div id="hourlyGrid" class="hourly-grid" aria-label="Hourly temperatures"></div>
</section>
<footer class="card-footer">
<span id="sourceLabel">Open-Meteo compatible weather data</span>
<span id="coordinates">52.520°N, 13.405°E</span>
</footer>
</main>
</div>
</section>
</div>
<script>
(() => {
const params = new URLSearchParams(window.location.search);
const todayUTC = new Date().toISOString().slice(0, 10);
const defaultLatitude = 52.52;
const defaultLongitude = 13.405;
const defaultName = "Berlin";
function isValidDate(value) {
if (!/^\d{4}-\d{2}-\d{2}$/.test(value || "")) {
return false;
}
const [year, month, day] = value.split("-").map(Number);
const parsed = new Date(Date.UTC(year, month - 1, day));
return parsed.getUTCFullYear() === year &&
parsed.getUTCMonth() === month - 1 &&
parsed.getUTCDate() === day;
}
function parseCoordinate(value, fallback, minimum, maximum) {
if (value === null || value.trim() === "") {
return fallback;
}
const number = Number(value);
return Number.isFinite(number) && number >= minimum && number <= maximum ? number : fallback;
}
const latitude = parseCoordinate(params.get("lat"), defaultLatitude, -90, 90);
const longitude = parseCoordinate(params.get("lon"), defaultLongitude, -180, 180);
const locationName = (params.get("name") || defaultName).trim() || defaultName;
const requestedDate = isValidDate(params.get("date")) ? params.get("date") : todayUTC;
const isArchive = requestedDate < todayUTC;
const loadingState = document.getElementById("loadingState");
const errorState = document.getElementById("errorState");
const errorDetail = document.getElementById("errorDetail");
const weatherContent = document.getElementById("weatherContent");
const retryButton = document.getElementById("retryButton");
const weatherMeta = {
0: { label: "Clear sky", icon: "☼", tone: "clear" },
1: { label: "Mainly clear", icon: "☼", tone: "clear" },
2: { label: "Partly cloudy", icon: "◐", tone: "cloud" },
3: { label: "Overcast", icon: "☁", tone: "cloud" },
45: { label: "Fog", icon: "≋", tone: "cloud" },
48: { label: "Depositing rime fog", icon: "≋", tone: "cloud" },
51: { label: "Light drizzle", icon: "☂", tone: "rain" },
53: { label: "Moderate drizzle", icon: "☂", tone: "rain" },
55: { label: "Dense drizzle", icon: "☂", tone: "rain" },
56: { label: "Light freezing drizzle", icon: "☂", tone: "rain" },
57: { label: "Dense freezing drizzle", icon: "☂", tone: "rain" },
61: { label: "Slight rain", icon: "☂", tone: "rain" },
63: { label: "Moderate rain", icon: "☂", tone: "rain" },
65: { label: "Heavy rain", icon: "☂", tone: "rain" },
66: { label: "Light freezing rain", icon: "☂", tone: "rain" },
67: { label: "Heavy freezing rain", icon: "☂", tone: "rain" },
71: { label: "Slight snowfall", icon: "❄", tone: "snow" },
73: { label: "Moderate snowfall", icon: "❄", tone: "snow" },
75: { label: "Heavy snowfall", icon: "❄", tone: "snow" },
77: { label: "Snow grains", icon: "❄", tone: "snow" },
80: { label: "Slight rain showers", icon: "☂", tone: "rain" },
81: { label: "Moderate rain showers", icon: "☂", tone: "rain" },
82: { label: "Violent rain showers", icon: "☂", tone: "rain" },
85: { label: "Slight snow showers", icon: "❄", tone: "snow" },
86: { label: "Heavy snow showers", icon: "❄", tone: "snow" },
95: { label: "Thunderstorm", icon: "ϟ", tone: "storm" },
96: { label: "Thunderstorm with hail", icon: "ϟ", tone: "storm" },
99: { label: "Thunderstorm with heavy hail", icon: "ϟ", tone: "storm" }
};
function toFiniteNumber(value) {
if (value === null || value === undefined || value === "") {
return null;
}
const number = Number(value);
return Number.isFinite(number) ? number : null;
}
function formatTemperature(value) {
const number = toFiniteNumber(value);
if (number === null) {
return "—";
}
const rounded = Math.round(number);
return String(Object.is(rounded, -0) ? 0 : rounded);
}
function temperatureWithDegree(value) {
return `${formatTemperature(value)}°`;
}
function formatDate(dateString) {
return new Intl.DateTimeFormat("en-US", {
weekday: "long",
month: "long",
day: "numeric",
year: "numeric",
timeZone: "UTC"
}).format(new Date(`${dateString}T00:00:00Z`));
}
function formatHour(isoTime) {
const match = String(isoTime).match(/T(\d{2}):(\d{2})/);
return match ? `${match[1]}:${match[2]}` : "--:--";
}
function conditionFor(code) {
const numericCode = Number(code);
return weatherMeta[numericCode] || {
label: "Weather condition unavailable",
icon: "·",
tone: "cloud"
};
}
function coordinateLabel(value, positive, negative) {
return `${Math.abs(value).toFixed(3)}°${value >= 0 ? positive : negative}`;
}
function showError(message) {
loadingState.hidden = true;
weatherContent.hidden = true;
errorState.hidden = false;
errorDetail.textContent = message || "The weather service did not return a usable response.";
}
function renderChart(hours) {
const values = hours.map(hour => hour.temperature);
const minimum = Math.min(...values);
const maximum = Math.max(...values);
const span = Math.max(maximum - minimum, 1);
const width = 1000;
const top = 10;
const bottom = 78;
const side = 8;
const denominator = Math.max(hours.length - 1, 1);
const points = hours.map((hour, index) => {
const x = side + (index / denominator) * (width - side * 2);
const y = bottom - ((hour.temperature - minimum) / span) * (bottom - top);
return `${x.toFixed(1)},${y.toFixed(1)}`;
});
const maximumIndex = values.indexOf(maximum);
const minimumIndex = values.indexOf(minimum);
const pointAt = index => points[index].split(",");
const highPoint = pointAt(maximumIndex);
const lowPoint = pointAt(minimumIndex);
document.getElementById("curveRange").textContent =
`${temperatureWithDegree(minimum)} – ${temperatureWithDegree(maximum)} C`;
const svg = document.getElementById("tempChart");
svg.setAttribute(
"aria-label",
`Hourly temperature curve from ${temperatureWithDegree(minimum)} to ${temperatureWithDegree(maximum)} Celsius`
);
svg.innerHTML = `
<defs>
<linearGradient id="chartFill" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#9bdcff" stop-opacity="0.23"></stop>
<stop offset="100%" stop-color="#9bdcff" stop-opacity="0"></stop>
</linearGradient>
<linearGradient id="chartLine" x1="0" y1="0" x2="1" y2="0">
<stop offset="0%" stop-color="#72bce1"></stop>
<stop offset="52%" stop-color="#d2f0ff"></stop>
<stop offset="100%" stop-color="#ffd783"></stop>
</linearGradient>
</defs>
<line x1="${side}" y1="${bottom}" x2="${width - side}" y2="${bottom}" stroke="#9bdcff" stroke-opacity="0.12" stroke-width="1"></line>
<polygon points="${side},${bottom} ${points.join(" ")} ${width - side},${bottom}" fill="url(#chartFill)"></polygon>
<polyline points="${points.join(" ")}" fill="none" stroke="url(#chartLine)" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"></polyline>
<circle cx="${highPoint[0]}" cy="${highPoint[1]}" r="4.5" fill="#ffd783" stroke="#162e45" stroke-width="3"></circle>
<circle cx="${lowPoint[0]}" cy="${lowPoint[1]}" r="4.5" fill="#9bdcff" stroke="#162e45" stroke-width="3"></circle>
`;
}
function renderHours(hours) {
const values = hours.map(hour => hour.temperature);
const minimum = Math.min(...values);
const maximum = Math.max(...values);
const span = Math.max(maximum - minimum, 1);
const maximumIndex = values.indexOf(maximum);
const minimumIndex = values.indexOf(minimum);
const grid = document.getElementById("hourlyGrid");
grid.replaceChildren();
grid.setAttribute(
"aria-label",
`${hours.length} hourly temperatures in Celsius for ${formatDate(requestedDate)}`
);
hours.forEach((hour, index) => {
const card = document.createElement("div");
card.className = "hour-card";
card.title = `${hour.time} UTC: ${temperatureWithDegree(hour.temperature)} Celsius`;
if (index === maximumIndex) {
card.classList.add("peak");
}
if (index === minimumIndex) {
card.classList.add("dip");
}
const time = document.createElement("span");
time.className = "hour-time";
time.textContent = hour.time;
const visual = document.createElement("span");
visual.className = "hour-visual";
const bar = document.createElement("span");
bar.className = "hour-bar";
bar.style.height = `${22 + ((hour.temperature - minimum) / span) * 68}%`;
visual.appendChild(bar);
const temperature = document.createElement("span");
temperature.className = "hour-temp";
temperature.textContent = temperatureWithDegree(hour.temperature);
card.append(time, visual, temperature);
grid.appendChild(card);
});
document.getElementById("readingCount").textContent = `${hours.length} readings · UTC`;
}
function renderWeather(data) {
const daily = data && data.daily;
const hourly = data && data.hourly;
if (!daily || !hourly || !Array.isArray(daily.time) || !Array.isArray(hourly.time)) {
throw new Error("The weather response was incomplete.");
}
const dailyIndex = daily.time.indexOf(requestedDate);
const index = dailyIndex >= 0 ? dailyIndex : 0;
const maximum = toFiniteNumber(daily.temperature_2m_max && daily.temperature_2m_max[index]);
const minimum = toFiniteNumber(daily.temperature_2m_min && daily.temperature_2m_min[index]);
const weatherCode = toFiniteNumber(daily.weather_code && daily.weather_code[index]);
if (maximum === null || minimum === null || weatherCode === null) {
throw new Error("The weather response was incomplete.");
}
const temperatures = Array.isArray(hourly.temperature_2m) ? hourly.temperature_2m : [];
const hours = hourly.time
.map((time, hourlyIndex) => {
const temperature = toFiniteNumber(temperatures[hourlyIndex]);
if (String(time).slice(0, 10) !== requestedDate || temperature === null) {
return null;
}
return {
time: formatHour(time),
temperature
};
})
.filter(Boolean);
if (!hours.length) {
throw new Error("No hourly temperatures were returned for this date.");
}
const condition = conditionFor(weatherCode);
const icon = document.getElementById("weatherIcon");
document.title = `${locationName} · Weather`;
document.getElementById("locationName").textContent = locationName;
document.getElementById("fullDate").textContent = formatDate(requestedDate);
document.getElementById("maxTemp").textContent = formatTemperature(maximum);
document.getElementById("minTemp").textContent = formatTemperature(minimum);
document.getElementById("conditionName").textContent = condition.label;
document.getElementById("conditionDetail").textContent =
`Daily condition · WMO code ${weatherCode}`;
document.getElementById("dayType").textContent = isArchive ? "Archive" : "Forecast";
document.getElementById("modeLabel").textContent = isArchive ? "Historical archive" : "Forecast";
document.getElementById("sourceLabel").textContent =
isArchive ? "Historical archive · Open-Meteo compatible" : "Forecast · Open-Meteo compatible";
document.getElementById("coordinates").textContent =
`${coordinateLabel(latitude, "N", "S")}, ${coordinateLabel(longitude, "E", "W")}`;
icon.className = `weather-icon tone-${condition.tone}`;
icon.textContent = condition.icon;
renderChart(hours);
renderHours(hours);
loadingState.hidden = true;
errorState.hidden = true;
weatherContent.hidden = false;
}
async function loadWeather() {
loadingState.hidden = false;
errorState.hidden = true;
weatherContent.hidden = true;
const endpoint = isArchive ? "/api/om/archive" : "/api/om/forecast";
const query = 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
});
try {
const response = await fetch(`${endpoint}?${query.toString()}`, {
headers: { Accept: "application/json" },
cache: "no-store"
});
let data;
try {
data = await response.json();
} catch {
throw new Error("The weather service returned invalid data.");
}
if (!response.ok || data.error) {
throw new Error(data.reason || "The weather service could not fulfill the request.");
}
renderWeather(data);
} catch (error) {
showError("The weather service did not return a usable response.");
}
}
retryButton.addEventListener("click", loadWeather);
loadWeather();
})();
</script>
</body>
</html>L1 —— 廉价的确定性描述量
| bytes 总计 | 36,034 | html / css / js | 4,668 / 17,072 / 14,294 |
|---|---|---|---|
| dom 节点 | 78 | dom 深度 | 11 |
| css 规则 | 106 | 含 js | 是 |
| brightness | 31.5 | contrast | 17.5 |
| colorfulness | 16.3 | 留白 | 88.6% |
该 slot 的 telemetry
| prompt tokens | 3 | completion tokens | 20,622 |
|---|---|---|---|
| total tokens | 20,625 | wall | 169.9 s |
| cost | — | request id | — |
config.json568 B
{
"N": 2,
"auth": {
"credential_ref": "WCB_NONE",
"method": "oauth-login"
},
"billing": "plan",
"config_id": "gpt-5.6-luna-eff-max--cli--cursor-xl--dev",
"effort": "max",
"family": "gpt",
"m": {
"min": 2,
"q": 2
},
"model_id": "gpt-5.6-luna",
"protocol": "cli",
"served_model": "gpt-5.6-luna-max",
"telemetry": {
"completion_tokens": 72221,
"cost_usd": null,
"prompt_tokens": 12,
"total_tokens": 72233,
"wall_ms": 615807
},
"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.6-luna-eff-max--cli--cursor-xl--dev",
"positions": [
{
"attempts": [
{
"attempt_index": 0,
"backoff_ms": null,
"charged": true,
"ended_at": "2026-08-13T15:14:55.319431+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T15:12:05.466347+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:17:13.596025+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T15:14:58.980065+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:18:39.897324+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T15:17:17.032205+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-13T15:22:32.007838+00:00",
"http_status": null,
"outcome": "valid",
"reached_model": true,
"reason": "ok",
"request_id": null,
"started_at": "2026-08-13T15:18:43.527642+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
}
}
}