:root{color-scheme:light dark;--base:#f5f5f7;--card:#fff;--ink:#202328;--muted:#74777e;--line:#e5e6e9;--accent:#357bc7;--soft:#eef3fa;--shadow:0 8px 32px #20232806;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.media-panel{padding:24px}.media-heading{display:flex;gap:18px;align-items:center;margin-bottom:28px}.media-heading img{width:140px;aspect-ratio:16/9;object-fit:cover;border-radius:8px}.media-heading h2{font-size:19px;margin:0;letter-spacing:-.4px}.media-heading p{font-size:12px;color:var(--muted);margin:8px 0}.media-panel label{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}.media-panel select{display:block;width:100%;border:1px solid var(--line);border-radius:8px;background:var(--base);color:var(--ink);padding:13px;font:inherit;font-size:13px;margin-bottom:18px}.media-panel .open-button{width:100%;padding:14px}.media-panel [role=status]{font-size:12px;color:var(--muted)}@media(max-width:600px){.media-heading{align-items:flex-start;flex-direction:column}.media-heading img{width:100%;max-width:340px}.media-panel{padding:18px}}
*{box-sizing:border-box}body{margin:0;background:var(--base);color:var(--ink)}button,input{font:inherit}button{cursor:pointer}a{color:inherit}[hidden]{display:none!important}.shell{max-width:1040px;margin:auto;padding:26px 28px max(92px,env(safe-area-inset-bottom))}.masthead{display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;gap:11px;align-items:center;text-decoration:none;font-size:21px;font-weight:700;letter-spacing:-.7px}.byline{font-size:12px;color:var(--muted)}.intro{margin:64px 0 28px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--muted)}h1{font-size:clamp(30px,5vw,50px);letter-spacing:-2px;line-height:1.12;margin:12px 0}p{line-height:1.6}.subtitle{font-size:15px;color:var(--muted);margin:14px 0}.link-form{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:14px;background:var(--card);padding:7px 8px 7px 16px;box-shadow:var(--shadow)}.link-icon{width:19px;height:19px;flex:none;fill:none;stroke:var(--muted);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.link-form input{border:0;outline:none;min-width:0;flex:1;background:transparent;color:var(--ink);font-size:14px;height:37px}.link-form:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent)}.open-button{border:0;border-radius:9px;padding:11px 16px;background:var(--ink);color:var(--card);font-size:13px;font-weight:600;white-space:nowrap}.open-button span{margin-left:8px}.viewer{margin-top:22px;border:1px solid var(--line);border-radius:16px;background:var(--card);overflow:hidden;box-shadow:var(--shadow);min-height:400px}.viewer-bar{min-height:56px;padding:11px 18px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line)}.status{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--muted)}.status-dot.loading{background:var(--accent);animation:pulse 1s ease-in-out infinite}.status-dot.loaded{background:#3c9874}.status-dot.error{background:#bc665e}.view-tabs{display:flex;background:var(--base);padding:3px;border-radius:8px}.view-tabs button{border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:11px;padding:6px 11px}.view-tabs button[aria-selected=true]{background:var(--card);color:var(--ink);box-shadow:0 1px 4px #00000009}.response-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:10px 18px;background:var(--base);color:var(--muted);font-size:10px;border-bottom:1px solid var(--line)}#response-url{flex-basis:100%;overflow-wrap:anywhere;font-size:11px}#response-code{margin-left:auto}.empty-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:340px;padding:36px 24px}.empty-mark{font-size:27px;color:var(--muted);margin:8px 0 12px}.empty-panel h2{font-size:17px;font-weight:600;margin:5px 0;letter-spacing:-.3px}.empty-panel p{font-size:13px;max-width:330px;color:var(--muted)}code{font-size:.92em}.preview-panel,.source-panel{min-height:340px}.preview-panel iframe{display:block;width:100%;height:58vh;min-height:340px;border:0;background:#fff}.preview-panel pre,.source-panel pre{margin:0;padding:22px;min-height:340px;max-height:65vh;overflow:auto;font:12px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.preview-panel img{display:block;margin:24px auto;max-width:calc(100% - 48px);max-height:62vh;object-fit:contain}.preview-note{margin:0;padding:12px 18px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 2px;color:var(--muted);font-size:11px}.quiet-button{border:0;background:transparent;color:var(--muted);font-size:11px;padding:6px 0}.quiet-button:hover{color:var(--ink)}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes pulse{50%{opacity:.3}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}@media(prefers-color-scheme:dark){:root{--base:#17191c;--card:#22252a;--ink:#e9ebef;--muted:#a0a5ad;--line:#353941;--accent:#78aae0;--soft:#29374b;--shadow:none}.status-dot.loaded{background:#76bda0}}@media(max-width:600px){.shell{padding:20px 16px 92px}.intro{margin:43px 0 22px}h1{letter-spacing:-1.3px}.subtitle{font-size:13px}.byline{font-size:10px}.viewer-bar{padding:10px 13px}.response-meta{padding:10px 13px}.preview-panel pre,.source-panel pre{padding:16px}.open-button{padding:11px 12px}.link-form{gap:9px;padding-left:12px}.link-form input{font-size:13px}}