getobsrv 0.3.0

package/out/renderer/assets/index-VleEBVgL.css

@@ -0,0 +1,446 @@
+/* ibm-plex-mono-cyrillic-ext-400-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 400;
+  src: url(./ibm-plex-mono-cyrillic-ext-400-normal-xuaO2J-f.woff2) format('woff2'), url(./ibm-plex-mono-cyrillic-ext-400-normal-DMdlQ8Kv.woff) format('woff');
+  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
+}
+
+/* ibm-plex-mono-cyrillic-400-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 400;
+  src: url(./ibm-plex-mono-cyrillic-400-normal-BSMlKf0J.woff2) format('woff2'), url(./ibm-plex-mono-cyrillic-400-normal-CEL4l2ZJ.woff) format('woff');
+  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
+}
+
+/* ibm-plex-mono-vietnamese-400-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 400;
+  src: url(./ibm-plex-mono-vietnamese-400-normal-BulugwFq.woff2) format('woff2'), url(./ibm-plex-mono-vietnamese-400-normal-DDuiU_S-.woff) format('woff');
+  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
+}
+
+/* ibm-plex-mono-latin-ext-400-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 400;
+  src: url(./ibm-plex-mono-latin-ext-400-normal-BmRBH3aV.woff2) format('woff2'), url(./ibm-plex-mono-latin-ext-400-normal-D3D2R8hC.woff) format('woff');
+  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
+}
+
+/* ibm-plex-mono-latin-400-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 400;
+  src: url(./ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2) format('woff2'), url(./ibm-plex-mono-latin-400-normal-CvHOgSBP.woff) format('woff');
+  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+}/* ibm-plex-mono-cyrillic-ext-600-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 600;
+  src: url(./ibm-plex-mono-cyrillic-ext-600-normal-V-xxqcpd.woff2) format('woff2'), url(./ibm-plex-mono-cyrillic-ext-600-normal-9HEixskS.woff) format('woff');
+  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
+}
+
+/* ibm-plex-mono-cyrillic-600-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 600;
+  src: url(./ibm-plex-mono-cyrillic-600-normal-CTOM6hUh.woff2) format('woff2'), url(./ibm-plex-mono-cyrillic-600-normal-fLZuRloM.woff) format('woff');
+  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
+}
+
+/* ibm-plex-mono-vietnamese-600-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 600;
+  src: url(./ibm-plex-mono-vietnamese-600-normal-D2EvbN8M.woff2) format('woff2'), url(./ibm-plex-mono-vietnamese-600-normal-iLQfcSjf.woff) format('woff');
+  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
+}
+
+/* ibm-plex-mono-latin-ext-600-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 600;
+  src: url(./ibm-plex-mono-latin-ext-600-normal-D38SheWl.woff2) format('woff2'), url(./ibm-plex-mono-latin-ext-600-normal-DmB0ttJJ.woff) format('woff');
+  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
+}
+
+/* ibm-plex-mono-latin-600-normal */
+@font-face {
+  font-family: 'IBM Plex Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 600;
+  src: url(./ibm-plex-mono-latin-600-normal-BgSNZQsw.woff2) format('woff2'), url(./ibm-plex-mono-latin-600-normal-DWFSQ4vo.woff) format('woff');
+  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+}:root {
+  color-scheme: dark;
+  font: 13px/1.4 system-ui, -apple-system, sans-serif;
+
+  /* Every grey is exactly neutral (R = G = B). A blue- or warm-tinted chrome
+     shifts the perceived hue of the render sitting next to it, which is the
+     one thing this app must never do. See docs/superpowers/specs/
+     2026-08-23-obsrv-ui-style.md. */
+  --void: #000000;
+  --chrome-0: #141414;
+  --chrome-1: #1c1c1c;
+  --chrome-2: #262626;
+  --line: #333333;
+  --text-0: #ededed;
+  --text-1: #8a8a8a;
+  /* Text fields sit a step below the chrome so their contents read as content. */
+  --field: #0d0d0d;
+
+  /* The only chromatic values in the whole chrome. Colour means attention,
+     never decoration — there is deliberately no brand accent. */
+  --warn: #d8a33a;
+  --error: #e5484d;
+
+  /* Overwritten by the surround control; the pane field only. */
+  --surround: #2a2a2a;
+
+  --mono: 'IBM Plex Mono', ui-monospace, monospace;
+}
+
+:root[data-surround='black'] { --surround: #000000; }
+:root[data-surround='graphite'] { --surround: #2a2a2a; }
+:root[data-surround='grey50'] { --surround: #808080; }
+
+html, body, #root { margin: 0; height: 100%; background: var(--chrome-0); color: var(--text-0); }
+.app { height: 100%; display: flex; flex-direction: column; }
+.muted { color: var(--text-1); }
+.warn { color: var(--warn); }
+.toolbar .warn { white-space: nowrap; }
+
+/* 44px matches TOOLBAR_H in src/main/ipc.ts, used until NativeSlot reports. */
+.toolbar {
+  flex: 0 0 44px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 0 10px;
+  background: var(--chrome-1);
+  border-bottom: 1px solid var(--line);
+}
+.toolbar button {
+  background: var(--chrome-2);
+  color: var(--text-0);
+  border: 1px solid var(--line);
+  border-radius: 4px;
+  width: 26px;
+  height: 24px;
+  cursor: pointer;
+}
+.toolbar select {
+  background: var(--chrome-2);
+  color: var(--text-0);
+  border: 1px solid var(--line);
+  border-radius: 4px;
+  height: 24px;
+}
+.url-form { flex: 1 1 auto; min-width: 120px; }
+.url-form input {
+  width: 100%;
+  height: 24px;
+  box-sizing: border-box;
+  padding: 0 8px;
+  background: var(--field);
+  color: var(--text-0);
+  border: 1px solid var(--line);
+  border-radius: 4px;
+}
+.url-form input[readonly] { color: var(--text-1); }
+.badge-error {
+  color: var(--error);
+  border: 1px solid var(--error);
+  border-radius: 4px;
+  padding: 1px 6px;
+  font-variant-numeric: tabular-nums;
+}
+.pixel-exact { display: flex; align-items: center; gap: 4px; white-space: nowrap; }
+/* The checked state would otherwise take the OS accent colour. */
+.toolbar input[type='checkbox'] { accent-color: var(--text-0); }
+
+/* Focus is a 1px inset neutral ring (the style spec's "weight and a 1px
+   inset ring"), never Chromium's accent-coloured outline. Pointer focus on
+   buttons and selects shows nothing; keyboard focus (and any focus in a
+   text field) shows the ring. */
+.toolbar :is(button, select, input):focus { outline: none; }
+.toolbar :is(button, select, input):focus-visible {
+  outline: 1px solid var(--text-1);
+  outline-offset: -1px;
+}
+
+.panes { flex: 1 1 auto; display: flex; min-height: 0; }
+.pane {
+  flex: 1 1 50%;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  background: var(--surround);
+}
+.target-pane { border-left: 1px solid var(--line); }
+/* Square corners, no shadow, no blur: a rounded or blurred pane edge would
+   destroy the very corner pixels the user opened this app to inspect. */
+.pane-body { flex: 1 1 auto; min-height: 0; overflow: auto; }
+.native-slot { width: 100%; height: 100%; }
+/* The backing store is already at device resolution; this only guards against
+   a fractional CSS size introducing a resample. */
+.target-canvas { display: block; image-rendering: pixelated; }
+/* The canvas itself never carries a ring: an outline over its edge would sit
+   on the very pixels under inspection. Keyboard focus in the target pane is
+   shown on the pane's own hairlines instead, which touch no page pixel. */
+.target-canvas:focus { outline: none; }
+.target-pane:has(.target-canvas:focus-visible) { border-left-color: var(--text-1); }
+.target-pane:has(.target-canvas:focus-visible) .pane-footer { border-top-color: var(--text-1); }
+
+/* Signature: each pane always states what it is showing, so a screenshot of
+   Obsrv is self-documenting. */
+.pane-footer {
+  flex: 0 0 auto;
+  display: flex;
+  gap: 10px;
+  padding: 5px 10px;
+  font: 400 11px/1.4 var(--mono);
+  font-variant-numeric: tabular-nums;
+  color: var(--text-1);
+  background: var(--chrome-1);
+  border-top: 1px solid var(--line);
+  white-space: nowrap;
+  overflow: hidden;
+}
+.pane-footer .role { color: var(--text-0); letter-spacing: 0.08em; }
+
+/* Segmented surround control. Active state is weight and a border, not hue. */
+.surround-control { display: flex; border: 1px solid var(--line); border-radius: 4px; }
+.surround-control button {
+  width: 22px;
+  height: 22px;
+  border: 0;
+  border-right: 1px solid var(--line);
+  border-radius: 0;
+  background: var(--chrome-2);
+  cursor: pointer;
+}
+.surround-control button:last-child { border-right: 0; }
+.surround-control button[aria-pressed='true'] { box-shadow: inset 0 0 0 2px var(--text-0); }
+.surround-swatch { display: block; width: 12px; height: 12px; margin: 0 auto; }
+
+/* Numbers never jitter as a slider moves. */
+.num { font-family: var(--mono); font-variant-numeric: tabular-nums; }
+
+/* An open drawer's button: weight and a 1px border, not hue. */
+.toolbar :is(.toggle-panel, .toggle-settings)[aria-pressed='true'] {
+  border-color: var(--text-0);
+  background: var(--chrome-1);
+}
+
+/* Drawers sit beside the panes, never over them: the native WebContentsView is
+   an OS-level overlay and would cover anything painted on top of it. */
+.body { flex: 1 1 auto; display: flex; min-height: 0; }
+.panes { min-width: 0; }
+.drawer {
+  flex: 0 0 280px;
+  overflow: auto;
+  padding: 12px 14px;
+  background: var(--chrome-1);
+  border-left: 1px solid var(--line);
+}
+
+/* Dense inspector: ~11px labels, the value pinned right in the mono face. */
+.controls h2 {
+  margin: 18px 0 8px;
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--text-1);
+}
+.controls h2:first-child { margin-top: 0; }
+.controls p { margin: 6px 0; font-size: 11px; }
+.control { display: block; margin: 10px 0; }
+.control-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: baseline;
+  gap: 8px;
+  margin-bottom: 4px;
+  font-size: 11px;
+  color: var(--text-1);
+}
+.control-row .num { color: var(--text-0); }
+.control.inline { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--text-1); }
+.control.inline > span { margin: 0; }
+/* accent-color pins the thumb and filled track to a neutral; unset, Chromium
+   paints them in the OS accent — the one hue this chrome may never carry. */
+.control input[type='range'] { display: block; width: 100%; margin: 0; accent-color: var(--text-0); }
+.control input[type='checkbox'] { margin: 0; accent-color: var(--text-0); }
+.control input[type='number'], .control select {
+  width: 100%;
+  height: 24px;
+  box-sizing: border-box;
+  padding: 0 6px;
+  background: var(--field);
+  color: var(--text-0);
+  border: 1px solid var(--line);
+  border-radius: 4px;
+}
+/* A numeric field reads like the readouts: digits flush right. */
+.control input.num { text-align: right; }
+.readout {
+  font: 400 11px/1.6 var(--mono);
+  font-variant-numeric: tabular-nums;
+  color: var(--text-1);
+}
+.field-error { color: var(--error); }
+
+/* Same 1px inset neutral ring as the toolbar; a range input's ring sits just
+   outside its track instead, where an inset one would cross the thumb. */
+.drawer :is(button, select, input):focus { outline: none; }
+.drawer :is(button, select, input):focus-visible {
+  outline: 1px solid var(--text-1);
+  outline-offset: -1px;
+}
+.drawer input[type='range']:focus-visible { outline-offset: 2px; }
+
+.fatal { padding: 48px; max-width: 44em; }
+.fatal h1 { font-size: 20px; margin: 0 0 12px; }
+
+/* Image mode. In normal flow, above the panes: an overlay here would sit
+   behind the native WebContentsView. */
+.strip {
+  flex: 0 0 auto;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 10px;
+  background: var(--chrome-1);
+  border-bottom: 1px solid var(--line);
+}
+.strip button {
+  background: var(--chrome-2);
+  color: var(--text-0);
+  border: 1px solid var(--line);
+  border-radius: 4px;
+  height: 24px;
+  padding: 0 10px;
+  cursor: pointer;
+}
+.strip button:focus { outline: none; }
+.strip button:focus-visible { outline: 1px solid var(--text-1); outline-offset: 1px; }
+.toolbar .close-image { width: auto; padding: 0 8px; }
+/* `safe`: a file wider than the pane scrolls from its left edge instead of
+   losing it off-screen. */
+.image-pane .pane-body { display: flex; align-items: flex-start; justify-content: safe center; }
+.image-pane img { display: block; image-rendering: pixelated; }
+
+/* Pinned to the right so they land over the target pane, never over the native
+   view on the left. The drag hint is fixed rather than a strip: a strip would
+   shift the panes under the pointer and flicker dragleave/dragenter. */
+.toast,
+.drop-hint {
+  position: fixed;
+  right: 16px;
+  bottom: 16px;
+  padding: 8px 12px;
+  background: var(--chrome-2);
+  color: var(--text-0);
+  border: 1px solid var(--line);
+  border-radius: 6px;
+  pointer-events: none;
+}
+.strip button[aria-pressed='true'] { border-color: var(--text-1); font-weight: 600; }
+
+/* Spec §9 stall notice. Inside the target pane's scroll box, never over the
+   native view on the left. Sticky rather than absolute so it stays visible
+   while the pane is scrolled; a direct block child of `.pane-body` (a sibling
+   before `.target-wrap`, not inside it), so it is the pane's width and its
+   `left: 0` holds while a wide canvas is scrolled horizontally. The fill is a
+   neutral grey: only the rule under it is red, so the one chromatic thing on
+   screen is the error itself. */
+.target-wrap { min-width: min-content; }
+.stall {
+  position: sticky;
+  top: 0;
+  left: 0;
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 8px 12px;
+  background: var(--chrome-1);
+  border-bottom: 1px solid var(--error);
+  color: var(--text-0);
+}
+.stall button {
+  background: var(--chrome-2);
+  color: var(--text-0);
+  border: 1px solid var(--line);
+  border-radius: 4px;
+  height: 22px;
+  padding: 0 10px;
+  cursor: pointer;
+}
+.stall button:focus { outline: none; }
+.stall button:focus-visible { outline: 1px solid var(--text-1); outline-offset: 1px; }
+
+/* v1.1 fit & pan. The 1:1/Fit segmented control follows the surround
+   control's grammar: active state is weight and an inset ring, never hue. */
+.view-control { display: flex; border: 1px solid var(--line); border-radius: 4px; }
+.view-control button {
+  width: auto;
+  height: 22px;
+  padding: 0 8px;
+  border: 0;
+  border-right: 1px solid var(--line);
+  border-radius: 0;
+  background: var(--chrome-2);
+  font-variant-numeric: tabular-nums;
+  cursor: pointer;
+}
+.view-control button:last-child { border-right: 0; }
+.view-control button[aria-pressed='true'] {
+  box-shadow: inset 0 0 0 1px var(--text-0);
+  font-weight: 600;
+}
+
+/* The overview invites the jump-to-1:1 click; the pan chords (middle drag,
+   Option+drag) show the grab affordances. Cursors only — no overlay may sit
+   on the pixels under inspection. */
+.target-canvas.fit { cursor: zoom-in; }
+.target-canvas.pan-ready { cursor: grab; }
+.target-canvas.panning { cursor: grabbing; }
+
+/* Notice shown when the renderer loads outside Electron (plain browser tab). */
+.browser-notice {
+  max-width: 32rem;
+  margin: 20vh auto 0;
+  padding: 1.5rem;
+  background: var(--chrome-1);
+  border: 1px solid var(--chrome-2);
+  color: var(--text-0);
+  line-height: 1.5;
+}
+.browser-notice p { margin: 0.75rem 0 0; color: var(--text-1); }
+.browser-notice code { font-family: var(--mono); }

package/out/renderer/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' blob: data:" />
+    <title>Obsrv</title>
+    <script type="module" crossorigin src="./assets/index-BAEO9_6W.js"></script>
+    <link rel="stylesheet" crossorigin href="./assets/index-VleEBVgL.css">
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>

package/out/shared/calibration.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ppi = ppi;
+exports.computeScale = computeScale;
+exports.maxCssViewport = maxCssViewport;
+exports.clampViewport = clampViewport;
+const presets_1 = require("./presets");
+function ppi(width, height, diagonalInches) {
+    if (!(diagonalInches > 0))
+        throw new RangeError('diagonalInches must be > 0');
+    return Math.hypot(width, height) / diagonalInches;
+}
+/**
+ * Physical host pixels per target *device* pixel. The target's PPI is a
+ * device-pixel density: a 393x852 CSS phone at 3x packs 1179x2556 pixels into
+ * its 6.1" diagonal, so each of them gets ~0.3 host pixels on a desktop
+ * monitor — physically smaller than any 1x screen's pixel, which is the point.
+ */
+function computeScale(host, target, pixelExact) {
+    if (pixelExact)
+        return host.scaleFactor;
+    const dsf = target.deviceScaleFactor ?? 1;
+    return (ppi(host.physicalWidth, host.physicalHeight, host.diagonalInches) /
+        ppi(target.width * dsf, target.height * dsf, target.diagonalInches));
+}
+/**
+ * The CSS-pixel budget for a surface rasterising at `deviceScaleFactor`:
+ * `MAX_VIEWPORT` limits *device* pixels, so the CSS clamp shrinks with the
+ * factor (393x852 at 3x is 1179x2556 device pixels and fits). A non-finite or
+ * sub-1 factor counts as 1.
+ */
+function maxCssViewport(deviceScaleFactor) {
+    const dsf = Number.isFinite(deviceScaleFactor) && deviceScaleFactor > 1 ? deviceScaleFactor : 1;
+    return Math.max(1, Math.floor(presets_1.MAX_VIEWPORT / dsf));
+}
+function clampViewport(width, height, max = presets_1.MAX_VIEWPORT) {
+    const finite = (v) => (Number.isFinite(v) ? v : 1);
+    const w = Math.min(max, Math.max(1, Math.floor(finite(width))));
+    const h = Math.min(max, Math.max(1, Math.floor(finite(height))));
+    return { width: w, height: h, clamped: w !== width || h !== height };
+}

package/out/shared/presets.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PANEL_PROFILES = exports.SCREEN_PRESETS = exports.DEFAULT_SETTINGS = exports.MAX_VIEWPORT = void 0;
+exports.findPreset = findPreset;
+exports.findProfile = findProfile;
+exports.MAX_VIEWPORT = 4096;
+exports.DEFAULT_SETTINGS = { hostDiagonalInches: 27, hostNits: 500 };
+exports.SCREEN_PRESETS = [
+    // Laptops — ordered largest to smallest panel, then the denser 1080p outlier.
+    { id: 'laptop-768', label: '1366×768 15.6"', width: 1366, height: 768, diagonalInches: 15.6, deviceScaleFactor: 1, group: 'laptop' },
+    { id: 'laptop-768-14', label: '1366×768 14"', width: 1366, height: 768, diagonalInches: 14, deviceScaleFactor: 1, group: 'laptop' },
+    { id: 'laptop-768-11', label: '1366×768 11.6" (Chromebook)', width: 1366, height: 768, diagonalInches: 11.6, deviceScaleFactor: 1, group: 'laptop' },
+    { id: 'laptop-800-11', label: '1280×800 11.6" (Chromebook)', width: 1280, height: 800, diagonalInches: 11.6, deviceScaleFactor: 1, group: 'laptop' },
+    { id: 'laptop-900-17', label: '1600×900 17.3"', width: 1600, height: 900, diagonalInches: 17.3, deviceScaleFactor: 1, group: 'laptop' },
+    { id: 'laptop-1080-15', label: '1080p 15.6"', width: 1920, height: 1080, diagonalInches: 15.6, deviceScaleFactor: 1, group: 'laptop' },
+    // Desktops.
+    { id: '1080p-24', label: '1080p 24"', width: 1920, height: 1080, diagonalInches: 24, deviceScaleFactor: 1, group: 'desktop' },
+    { id: '1080p-27', label: '1080p 27"', width: 1920, height: 1080, diagonalInches: 27, deviceScaleFactor: 1, group: 'desktop' },
+    { id: '1440p-27', label: '1440p 27"', width: 2560, height: 1440, diagonalInches: 27, deviceScaleFactor: 1, group: 'desktop' },
+    { id: 'sxga-19', label: '1280×1024 19" (5:4)', width: 1280, height: 1024, diagonalInches: 19, deviceScaleFactor: 1, group: 'desktop' },
+    { id: '1440x900-19', label: '1440×900 19"', width: 1440, height: 900, diagonalInches: 19, deviceScaleFactor: 1, group: 'desktop' },
+    // Mobiles — CSS viewport x the device's real scale factor. A phone preset
+    // rendered at 1x would look worse than any real phone; these rasterise at
+    // 2x/3x and are shown at true physical size (usually minified on a desktop).
+    { id: 'android-65', label: 'Budget Android 6.5" @2x', width: 360, height: 800, diagonalInches: 6.5, deviceScaleFactor: 2, group: 'mobile' },
+    { id: 'iphone-se', label: 'iPhone SE 4.7" @2x', width: 375, height: 667, diagonalInches: 4.7, deviceScaleFactor: 2, group: 'mobile' },
+    { id: 'iphone-61', label: 'iPhone 6.1" @3x', width: 393, height: 852, diagonalInches: 6.1, deviceScaleFactor: 3, group: 'mobile' },
+    { id: 'ipad-109', label: 'iPad 10.9" @2x', width: 820, height: 1180, diagonalInches: 10.9, deviceScaleFactor: 2, group: 'mobile' },
+];
+exports.PANEL_PROFILES = [
+    { id: 'reference', label: 'Reference (off)', contrastRatio: null, gamutCoverage: 1, bits: 8, frc: false, nits: null },
+    { id: 'office-ips', label: 'Office IPS', contrastRatio: 1000, gamutCoverage: 1, bits: 8, frc: false, nits: 300 },
+    { id: 'budget-tn', label: 'Budget TN', contrastRatio: 700, gamutCoverage: 0.72, bits: 6, frc: true, nits: 250 },
+    { id: 'old-laptop', label: 'Old laptop', contrastRatio: 600, gamutCoverage: 0.6, bits: 6, frc: false, nits: 220 },
+];
+function findPreset(id) {
+    const p = exports.SCREEN_PRESETS.find(x => x.id === id);
+    if (!p)
+        throw new Error(`unknown preset: ${id}`);
+    return p;
+}
+function findProfile(id) {
+    const p = exports.PANEL_PROFILES.find(x => x.id === id);
+    if (!p)
+        throw new Error(`unknown profile: ${id}`);
+    return p;
+}

package/out/shared/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/package.json

@@ -0,0 +1,62 @@
+{
+  "name": "getobsrv",
+  "version": "0.3.0",
+  "description": "See your site the way 1x screens see it",
+  "main": "./out/main/index.js",
+  "bin": {
+    "obsrv": "./bin/obsrv.js",
+    "obsrv-mcp": "./bin/obsrv-mcp.js"
+  },
+  "author": "Opeyemi Ajagbe <auto-report@hydrogenpay.com>",
+  "homepage": "https://github.com/vibesyemmy/obsrv",
+  "scripts": {
+    "dev": "electron-vite dev",
+    "build": "electron-vite build && npm run build:mcp",
+    "typecheck": "tsc --noEmit -p tsconfig.node.json && tsc --noEmit -p tsconfig.web.json && tsc --noEmit -p tsconfig.mcp.json",
+    "test": "vitest run --project unit",
+    "test:browser": "vitest run --project browser",
+    "test:e2e": "npm run build && playwright test",
+    "dist": "npm run build && electron-builder --mac",
+    "build:mcp": "tsc -p tsconfig.mcp.json",
+    "prepublishOnly": "npm run build"
+  },
+  "dependencies": {
+    "@fontsource/ibm-plex-mono": "^5.3.0",
+    "@modelcontextprotocol/sdk": "^1.30.0",
+    "react": "^19.2.8",
+    "react-dom": "^19.2.8",
+    "zod": "^4.4.3",
+    "zustand": "^5.0.15",
+    "electron": "^43.4.1"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.62.1",
+    "@types/node": "^26.2.0",
+    "@types/react": "^19.2.18",
+    "@types/react-dom": "^19.2.4",
+    "@vitejs/plugin-react": "^5.2.0",
+    "@vitest/browser": "^3.2.7",
+    "electron-builder": "^26.15.3",
+    "electron-vite": "^3.1.0",
+    "playwright": "^1.62.1",
+    "typescript": "^5.9.3",
+    "vite": "^6.4.3",
+    "vitest": "^3.2.7"
+  },
+  "productName": "Obsrv",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vibesyemmy/obsrv.git"
+  },
+  "license": "MIT",
+  "files": [
+    "bin",
+    "out",
+    "skills",
+    "README.md",
+    "LICENSE"
+  ],
+  "engines": {
+    "node": ">=20"
+  }
+}