:root {
    color-scheme: light;
    --ink: #102a43;
    --muted: #627d98;
    --line: #d9e2ec;
    --paper: #f7fafc;
    --cyan: #087f8c;
    --cyan-dark: #05545c;
    --orange: #f2994a;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: var(--paper); color: var(--ink); font-family: Georgia, 'Times New Roman', serif; }
a { color: inherit; }
.topbar { display: flex; justify-content: space-between; align-items: center; padding: 24px clamp(20px, 5vw, 72px); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.86); }
.wordmark { text-decoration: none; font: 800 1rem/1.1 Arial, sans-serif; letter-spacing: .08em; }
.wordmark span { color: var(--cyan); font-weight: 500; }
.signout-link { color: var(--muted); font: 600 .85rem Arial, sans-serif; text-decoration: none; }
.landing-shell { min-height: calc(100vh - 129px); display: grid; place-items: center; padding: 48px 20px; background: radial-gradient(circle at 12% 18%, #d6f4f0 0, transparent 31%), linear-gradient(135deg, #f7fafc 0%, #eef6f7 100%); }
.landing-panel { width: min(760px, 100%); padding: clamp(32px, 7vw, 80px); border-left: 5px solid var(--orange); background: rgba(255,255,255,.82); box-shadow: 20px 20px 0 rgba(8,127,140,.08); }
.brand-mark { display: grid; place-items: center; width: 58px; height: 58px; margin-bottom: 42px; background: var(--ink); color: white; font: 800 1rem Arial, sans-serif; letter-spacing: .06em; }
.eyebrow, .status-label { margin: 0 0 14px; color: var(--cyan); font: 700 .72rem Arial, sans-serif; letter-spacing: .16em; }
h1 { max-width: 620px; margin: 0; font-size: clamp(2.6rem, 7vw, 5.8rem); line-height: .95; letter-spacing: 0; }
.lead { margin: 26px 0 0; color: var(--cyan-dark); font-size: clamp(1.25rem, 2vw, 1.65rem); }
.body-copy { max-width: 540px; margin: 18px 0 34px; color: var(--muted); font: 1rem/1.65 Arial, sans-serif; }
.primary-action, button { display: inline-flex; align-items: center; gap: 12px; border: 0; padding: 14px 20px; background: var(--cyan); color: white; cursor: pointer; font: 700 .9rem Arial, sans-serif; text-decoration: none; }
.primary-action:hover, button:hover { background: var(--cyan-dark); }
.trust-row { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 42px; color: var(--muted); font: 700 .7rem Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.admin-shell { width: min(1120px, 100%); margin: 0 auto; padding: clamp(38px, 7vw, 88px) 20px; }
.admin-heading h1 { font-size: clamp(2.8rem, 6vw, 5rem); }
.admin-heading > p:last-child { max-width: 560px; color: var(--muted); font: 1rem/1.6 Arial, sans-serif; }
.status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin: 48px 0; }
.status-card, .admin-actions { padding: 24px; border: 1px solid var(--line); background: white; }
.status-card-active { border-top: 4px solid var(--cyan); }
.status-card strong, .status-card small { display: block; }
.status-card strong { overflow-wrap: anywhere; font: 700 1rem Arial, sans-serif; }
.status-card small { margin-top: 12px; color: var(--muted); font: .8rem/1.5 Arial, sans-serif; }
.admin-actions { display: grid; gap: 18px; }
.admin-actions h2 { margin: 0; font-size: 1.8rem; }
.admin-actions p { color: var(--muted); font: .9rem/1.5 Arial, sans-serif; }
.key-form { display: grid; gap: 8px; max-width: 420px; }
.key-form label { font: 700 .8rem Arial, sans-serif; }
.key-form input { padding: 12px; border: 1px solid var(--line); font: 1rem Arial, sans-serif; }
.new-key { display: grid; gap: 10px; padding: 16px; border-left: 4px solid var(--orange); background: #fff8f0; }
.new-key code { overflow-wrap: anywhere; font: .85rem/1.5 monospace; }
.connection-actions { margin-bottom: 18px; }
.action-row { display: flex; flex-wrap: wrap; gap: 10px; }
.action-row form { margin: 0; }
.connection-message { margin: 18px 0; padding: 14px 18px; font: .9rem/1.5 Arial, sans-serif; }
.message-success { border-left: 4px solid var(--cyan); background: #e9f8f6; color: var(--cyan-dark); }
.message-error { border-left: 4px solid #c05640; background: #fff3f0; color: #8b2e1f; }
.workflow-status, .callback-hint { display: grid; gap: 6px; margin-top: 16px; padding: 14px; background: #f7fafc; border: 1px solid var(--line); font: .85rem/1.5 Arial, sans-serif; }
.workflow-status strong { color: var(--cyan-dark); }
.workflow-status small, .callback-hint small { color: var(--muted); }
.callback-hint code { overflow-wrap: anywhere; font: .8rem/1.5 monospace; color: var(--ink); }
.footer { padding: 24px; border-top: 1px solid var(--line); color: var(--muted); text-align: center; font: .75rem Arial, sans-serif; }
@media (max-width: 600px) { .landing-panel { border-left-width: 3px; } .trust-row { gap: 10px; } }