/* devcheck.css - the Device check page's styles (post-launch: moved out of devcheck.html; its CSP allows no inline styles) */
:root { --bg: #0d0d10; --fg: #f2f2f5; --dim: #9a9aa6; --card: #17171c; --line: #2a2a33; --ok: #5ad48a; --bad: #ff6b6b; --warn: #ffc857; --accent: #ff9f2e; }
@media (prefers-color-scheme: light) { :root { --bg: #f6f6f8; --fg: #1c1c1e; --dim: #6b6b75; --card: #fff; --line: #e2e2e8; --ok: #1f9d55; --bad: #d63b3b; --warn: #b7791f; --accent: #c96a00; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 15px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
main { max-width: 760px; margin: 0 auto; padding: 16px 16px 48px; }
h1 { font-size: 22px; margin: 8px 0 4px; } h2 { font-size: 16px; margin: 22px 0 8px; }
p { margin: 6px 0; } .dim { color: var(--dim); }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin: 10px 0; overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: 13px; } td, th { text-align: left; padding: 4px 8px 4px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.ok { color: var(--ok); } .bad { color: var(--bad); } .warn { color: var(--warn); }
button { font: inherit; padding: 10px 16px; border-radius: 10px; border: 0; background: var(--accent); color: #111; font-weight: 600; min-height: 44px; }
button.ghost { background: transparent; color: var(--fg); border: 1px solid var(--line); }
.row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
code, pre { font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; } pre { white-space: pre-wrap; word-break: break-word; margin: 0; }
.note { border-left: 3px solid var(--warn); padding: 8px 12px; background: var(--card); border-radius: 8px; margin: 10px 0; }
