/* SPDX-License-Identifier: AGPL-3.0-only */
:root { --owner-canvas: #0b0f0c; --owner-surface: #111712; --owner-raised: #161e17; --owner-text: #f0f3e9; --owner-secondary: #99a696; --owner-accent: #b6f36a; --owner-caution: #edbe70; --owner-border: #29332a; color-scheme: dark; font: 100%/1.5 "Segoe UI", Arial, sans-serif; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--owner-canvas); color: var(--owner-text); }
main { max-width: 76rem; min-width: 0; margin: 0 auto; padding: 1.5rem 1rem 4rem; }
footer { max-width: 76rem; margin: 0 auto; padding: 0 1rem 2rem; color: var(--owner-secondary); }
a { color: var(--owner-accent); }
header, .section-head, .actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.actions { flex-wrap: wrap; }
header { margin-bottom: 1.5rem; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 0; }
.eyebrow { color: var(--owner-secondary); font-size: .8rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; margin-bottom: .25rem; }
section { background: var(--owner-surface); border: 1px solid var(--owner-border); border-radius: .75rem; padding: 1.25rem; margin: 1rem 0; }
form { display: grid; gap: .6rem; margin-bottom: 1rem; }
label { font-weight: 600; }
input, select { box-sizing: border-box; width: 100%; padding: .65rem; border: 1px solid var(--owner-secondary); border-radius: .3rem; font: inherit; }
button { border: 1px solid var(--owner-accent); border-radius: .35rem; background: var(--owner-accent); color: var(--owner-canvas); padding: .6rem .85rem; font: inherit; cursor: pointer; touch-action: manipulation; }
button.quiet { background: transparent; color: var(--owner-accent); }
button:disabled { cursor: wait; opacity: .6; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline: 3px solid var(--owner-accent); outline-offset: 2px; }
dl { display: grid; grid-template-columns: minmax(8rem, 1fr) 2fr; gap: .4rem 1rem; }
dt { font-weight: 700; }
dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
code { font-size: .9rem; }
.fingerprint { overflow-wrap: anywhere; }
/* One click selects a whole one-time value for copying. */
#server-origin, #pair-id, #pair-token, #key-secret, #mfa-secret, #mfa-provisioning-uri, #recovery-codes li { -webkit-user-select: all; user-select: all; }
.check { display: flex; align-items: flex-start; gap: .5rem; }
.check input { width: auto; margin-top: .35rem; }
#device-list, #key-list, #message-list, #inbound-event-list, #webhook-delivery-list, #session-list, #subscriptions { padding: 0; list-style: none; }
#device-list li, #key-list li, #message-list > li, #inbound-event-list li, #webhook-delivery-list > li, #session-list li, #subscriptions li { border-top: 1px solid var(--owner-border); padding: .8rem 0; display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
#inbound-event-list li, #webhook-delivery-list > li, #session-list li { align-items: flex-start; flex-direction: column; gap: .15rem; }
#session-list span { color: var(--owner-secondary); }
.account-recovery { border-top: 1px solid var(--owner-border); padding-top: 1.2rem; margin-top: 1.2rem; }
.account-recovery details { margin-top: 1rem; }
summary { cursor: pointer; min-height: 2.75rem; padding: .6rem 0; }
.account-recovery summary { font-weight: 600; }
.account-recovery details form { margin-top: 1rem; }
#webhook-delivery-list ol { padding-left: 1.5rem; margin: .4rem 0 0; }
#webhook-delivery-list ol li { margin: .25rem 0; }
#webhook-delivery-list strong, #webhook-delivery-list span { overflow-wrap: anywhere; }
#device-list code, #key-list code, #message-list code, #key-secret { display: block; overflow-wrap: anywhere; }
#mfa-secret, #mfa-provisioning-uri, #recovery-codes code { display: block; overflow-wrap: anywhere; }
#recovery-codes { padding-left: 1.5rem; }
#recovery-codes li { overflow-wrap: anywhere; }
#message-list details { margin-top: .4rem; }
#message-list ol { padding-left: 1.5rem; }
#message-list ol li { padding: .25rem 0; }
#message-list time { color: var(--owner-secondary); }
.message-uncertain { border-left: 3px solid var(--owner-caution); padding: .45rem .65rem; margin: .5rem 0; font-weight: 600; }
#key-secret-panel { border: 1px solid var(--owner-secondary); border-radius: .3rem; padding: .8rem; margin-bottom: 1rem; }
#key-secret-panel button { margin-top: .8rem; }
[hidden] { display: none !important; }
#owner-holds-list, #opt-out-review-list { list-style: none; padding: 0; }
#owner-holds-list li, #opt-out-review-list li { border-top: 1px solid currentColor; padding: 1rem 0; overflow-wrap: anywhere; }
#opt-out-review-list form { margin: 1rem 0 0; }
@media (max-width: 35rem) { dl { grid-template-columns: 1fr; } .section-head, #device-list li, #key-list li { align-items: flex-start; } }
#device-list li > div > span { display: block; margin-top: .35rem; }

/* Shared shell contract: one responsive nav, unchanged page form IDs. */
* { box-sizing: border-box; }
body { overflow-wrap: anywhere; }
input, select, textarea { min-width: 0; max-width: 100%; background: var(--owner-canvas); color: var(--owner-text); }
button, .action-link { min-height: 2.75rem; max-width: 100%; }
button.quiet { background: transparent; color: var(--owner-accent); }
section, form, #owner-content { min-width: 0; }
.section-head { flex-wrap: wrap; }
code, .eyebrow, .rail-label, .rail-status, .nav-note { font-family: Consolas, "Courier New", monospace; }
.owner-shell { padding-left: 15rem; }
.owner-rail { position: fixed; inset: 0 auto 0 0; width: 15rem; padding: 1.5rem 1rem; background: var(--owner-canvas); border-right: 1px solid var(--owner-border); overflow-y: auto; }
.owner-brand { display: flex; align-items: center; gap: .65rem; color: var(--owner-text); text-decoration: none; font-size: 1.5rem; letter-spacing: -.04em; margin-bottom: 2rem; }
.owner-brand svg { width: 2rem; height: 2rem; flex: none; }
.rail-label { text-transform: uppercase; color: var(--owner-secondary); font-size: .75rem; letter-spacing: .06em; }
.owner-nav { display: grid; gap: .35rem; }
.owner-nav a { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; min-height: 2.75rem; padding: .65rem .75rem; color: var(--owner-secondary); text-decoration: none; border: 1px solid transparent; border-radius: .3rem; }
.owner-nav a:hover { background: var(--owner-raised); color: var(--owner-text); }
.owner-nav a[aria-current="page"] { color: var(--owner-accent); background: var(--owner-raised); border-color: var(--owner-border); }
.nav-note { color: var(--owner-caution); font-size: .7rem; }
.rail-status { color: var(--owner-secondary); font-size: .75rem; margin-top: 2rem; }
.owner-entry-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.25rem; }
.action-link { display: inline-flex; align-items: center; padding: .6rem .85rem; background: var(--owner-accent); color: var(--owner-canvas); text-decoration: none; border-radius: .35rem; font-weight: 600; }
.skip-link { position: fixed; left: 1rem; top: -10rem; z-index: 10; padding: .75rem; background: var(--owner-accent); color: var(--owner-canvas); }
.skip-link:focus { top: 1rem; }
:target { scroll-margin-top: 1rem; }
@media (max-width: 60rem) {
  .owner-shell { padding-left: 0; }
  .owner-rail { position: static; width: 100%; border-right: 0; border-bottom: 1px solid var(--owner-border); padding: 1rem; }
  .owner-brand { margin-bottom: .75rem; }
  .owner-nav { grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr)); }
  .owner-nav a { font-size: .875rem; padding: .5rem; }
  .rail-label { margin-bottom: .5rem; }
  .rail-status { margin: .75rem 0 0; }
}
@media (max-width: 35rem) {
  header { flex-wrap: wrap; align-items: flex-start; }
  main { padding: 1rem .75rem 3rem; }
  section { padding: 1rem; }
  #device-list li, #key-list li, #message-list > li { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }

.fleet-summary { padding: .8rem; background: var(--owner-raised); border: 1px solid var(--owner-border); border-radius: .35rem; }
.fleet-workspace { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(16rem, 1fr); gap: 1rem; align-items: start; }
.fleet-table { min-width: 0; }
.device-detail { min-width: 0; background: var(--owner-raised); border: 1px solid var(--owner-border); border-radius: .5rem; padding: 1rem; }
.device-detail code { display: block; margin-top: .5rem; }
#approved-devices #device-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding: 1rem; margin-bottom: .75rem; background: var(--owner-canvas); border: 1px solid var(--owner-border); border-radius: .5rem; }
#approved-devices #device-list li > div { grid-column: 1 / -1; min-width: 0; }
#approved-devices #device-list li span { display: block; margin-top: .4rem; }
.fleet-select[aria-pressed="true"] { background: var(--owner-raised); box-shadow: inset 0 0 0 2px var(--owner-accent); }
@media (max-width: 75rem) { .fleet-workspace { grid-template-columns: minmax(0, 1fr); } }
/* Outbound writer metadata stays readable without revealing sealed content. */
#message-activity .activity-head, #message-activity .activity-cells { display:grid;grid-template-columns:1.3fr .8fr 1.5fr 1fr 1.4fr;gap:.75rem;align-items:start; }
#message-activity .activity-head { padding:.75rem;border-bottom:1px solid var(--owner-border);font-weight:700; }
#message-activity #message-list { display:block;padding:0;list-style:none; }
#message-activity .activity-row { display:block;padding:1rem 0;border-bottom:1px solid var(--owner-border);overflow-wrap:anywhere; }
#message-activity .activity-row code { display:block;margin:.5rem 0;color:var(--owner-secondary); }
#message-activity .activity-state { display:block;border:1px solid var(--owner-border);border-radius:.5rem;padding:.35rem .5rem; }
#message-activity .activity-state[data-state="unknown"], #message-activity .activity-state[data-state="delivery_unknown"] { border-color:var(--owner-caution); }
#message-activity .activity-device { width:100%;white-space:normal;text-align:left; }
#message-activity .activity-row summary { min-height:44px;cursor:pointer;padding:.65rem 0; }
@media(max-width:60rem) { #message-activity .activity-head { display:none; } #message-activity .activity-cells { grid-template-columns:1fr;gap:.5rem; } }
.summary-cards { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1rem; }
.summary-cards > div { background:var(--owner-raised);border:1px solid var(--owner-border);border-radius:.5rem;padding:1rem;min-width:0;overflow-wrap:anywhere; }
.summary-value { font-size:2rem;font-weight:700;margin:.5rem 0;color:var(--owner-accent); }
#message-summary[data-stale="true"] .summary-value { color:var(--owner-caution); }
@media(max-width:55rem) { .summary-cards { grid-template-columns:1fr; } }

/* Overview precedes hardware and activity in both visual and keyboard order. */
#message-summary .summary-scope { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: 1rem 0; }
#message-summary .summary-scope select { flex: 1 1 16rem; width: auto; min-height: 2.75rem; }
#message-summary .summary-cards { gap: 0; border: 1px solid var(--owner-border); border-radius: .5rem; overflow: hidden; }
#message-summary .summary-cards > div { background: var(--owner-canvas); border: 0; border-radius: 0; padding: 1.25rem; }
#message-summary .summary-cards > div + div { border-left: 1px solid var(--owner-border); }
#message-summary .summary-cards h3 { font-size: 1rem; }
#message-summary .summary-cards p:last-child { color: var(--owner-secondary); margin-bottom: 0; }
@media(max-width:55rem) { #message-summary .summary-cards > div + div { border-left: 0; border-top: 1px solid var(--owner-border); } }

/* Owner onboarding shares the same controls and security gates as the dashboard. */
.page-intro { color: var(--owner-secondary); max-width: 42rem; margin: .5rem 0 0; }
.setup-nav { margin: 1.25rem 0 1.5rem; }
.setup-nav ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; list-style: none; padding: 0; margin: 0; }
.setup-nav li { min-width: 0; }
.setup-nav a { display: flex; align-items: flex-start; gap: .6rem; height: 100%; min-height: 2.75rem; padding: .9rem .75rem; border: 1px solid var(--owner-border); border-radius: .5rem; background: var(--owner-surface); color: var(--owner-text); font-size: .9rem; font-weight: 600; text-decoration: none; }
.setup-nav a:hover { background: var(--owner-raised); border-color: var(--owner-secondary); }
.setup-nav a[aria-current="step"] { border-color: var(--owner-accent); background: var(--owner-raised); }
.setup-nav a > span:last-child { min-width: 0; }
.setup-nav small { display: block; margin-top: .25rem; color: var(--owner-secondary); font-size: .75rem; font-weight: 400; }
.step-number { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 1.6rem; height: 1.6rem; border: 1px solid var(--owner-border); border-radius: 50%; color: var(--owner-accent); font-size: .8rem; }
.setup-nav [aria-current="step"] .step-number { background: var(--owner-accent); border-color: var(--owner-accent); color: var(--owner-canvas); }
.setup-note { margin: 1rem 0; padding: 1rem; border: 1px solid var(--owner-border); border-left: 3px solid var(--owner-accent); border-radius: .4rem; background: var(--owner-raised); }
.setup-note p { margin: .5rem 0 0; }
.setup-note p:last-child { margin-bottom: 0; }
.service-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.service-options article { min-width: 0; padding: 1.1rem; border: 1px solid var(--owner-border); border-radius: .5rem; background: var(--owner-canvas); }
.service-options h3 { margin-bottom: .65rem; }
.service-options article > a { display: inline-flex; align-items: center; min-height: 2.75rem; font-weight: 600; }
.availability-note { color: var(--owner-caution); }
.section-next { margin: 1rem 0 0; padding-top: 1rem; border-top: 1px solid var(--owner-border); }
.field-help, .utility-note { color: var(--owner-secondary); font-size: .875rem; }
.field-help { margin: 0 0 .5rem; }
.pairing-steps { padding-left: 1.3rem; max-width: 50rem; }
.pairing-steps li { padding-left: .2rem; margin-bottom: .65rem; }
.pairing-steps li::marker { color: var(--owner-accent); font-weight: 700; }
#pair-phone #create-form, body[data-owner-page="account"] form { max-width: 36rem; }
#pair-phone #create-form button, body[data-owner-page="account"] form button { justify-self: start; }
.pair-qr-panel { display: grid; grid-template-columns: minmax(0, 18rem) minmax(0, 1fr); align-items: center; gap: 1.25rem; margin: 1rem 0; padding: 1rem; border: 1px solid var(--owner-border); border-radius: .5rem; background: var(--owner-canvas); }
#pair-qr { display: block; width: 100%; max-width: 18rem; height: auto; aspect-ratio: 1; image-rendering: pixelated; background: #fff; }
.pair-qr-copy { min-width: 0; }
#pair-expiry { color: var(--owner-accent); font-weight: 600; }
#pair-qr-status { color: var(--owner-secondary); }
.pair-manual { margin: 1rem 0; padding: .2rem 1rem 1rem; border: 1px solid var(--owner-border); border-radius: .5rem; }
.pair-manual summary, .setup-help summary { display: list-item; min-height: 2.75rem; padding: .65rem 0; font-weight: 600; }
.pair-manual p { color: var(--owner-secondary); }
.pair-manual dl { margin-bottom: 0; }
.pair-manual input[readonly] { font-family: Consolas, "Courier New", monospace; font-size: .875rem; }
.setup-help { margin-top: 1.25rem; border-top: 1px solid var(--owner-border); }
.setup-help ol { padding-left: 1.3rem; }
.setup-help li { margin: .75rem 0; }
@media (max-width: 75rem) {
  .setup-nav ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 40rem) {
  .service-options, .pair-qr-panel { grid-template-columns: minmax(0, 1fr); }
  #pair-qr { margin-inline: auto; }
}
@media (max-width: 35rem) {
  .setup-nav a { gap: .4rem; padding: .65rem .5rem; font-size: .85rem; }
  .step-number { width: 1.4rem; height: 1.4rem; }
  .setup-note, .service-options article, .pair-qr-panel { padding: .85rem; }
  .pair-manual { padding-inline: .75rem; }
}

/* Workspace contract: real destinations, compact observation and one setup task. */
body[data-workspace-view] [data-workspace] { display: none; }
body[data-workspace-view="overview"] [data-workspace~="overview"],
body[data-workspace-view="phones"] [data-workspace~="phones"],
body[data-workspace-view="activity"] [data-workspace~="activity"],
body[data-workspace-view="integrations"] [data-workspace~="integrations"],
body[data-workspace-view="security"] [data-workspace~="security"],
body[data-workspace-view="setup"] [data-workspace~="setup"] { display: block; }
header > a { min-height: 2.75rem; display: inline-flex; align-items: center; }
.owner-menu { margin: 0; }
.owner-menu > summary { color: var(--owner-accent); font-weight: 600; }
.setup-progress ol { display: flex; flex-wrap: wrap; padding: 0; gap: .65rem; list-style: none; }
.setup-progress li { flex: 1 1 8rem; padding: .8rem; border-bottom: 2px solid var(--owner-border); color: var(--owner-secondary); }
.setup-progress [aria-current="step"] { border-color: var(--owner-accent); color: var(--owner-accent); font-weight: 700; }
.setup-resume { background: var(--owner-raised); }
.setup-resume h2 { margin-bottom: .4rem; }
body[data-workspace-view] #approved-devices #device-list .fleet-technical { display: none; }
body[data-workspace-view] #device-list .fleet-quick { color: var(--owner-secondary); }
#phone-inspector { max-width: min(36rem, calc(100% - 2rem)); max-height: calc(100dvh - 2rem); overflow: auto; background: var(--owner-surface); color: var(--owner-text); border: 1px solid var(--owner-border); border-radius: .75rem; padding: 1rem; }
#phone-inspector::backdrop { background: rgb(0 0 0 / .75); }
#phone-inspector-status { white-space: pre-line; }

/* Overview starts with phone status; summary options remain deliberate. */
body[data-workspace-view="overview"] header .eyebrow, body[data-workspace-view="overview"] #workspace-intro { display: none; }
body[data-workspace-view="overview"] header h1 { font-size: 1.5rem; }
body[data-workspace-view="overview"] .setup-resume { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .75rem; align-items: center; padding: .85rem 1rem; }
body[data-workspace-view="overview"] .setup-resume .section-head { display: contents; }
body[data-workspace-view="overview"] .setup-resume .section-head > div { display: none; }
body[data-workspace-view="overview"] #setup-resume-status { grid-column: 1; grid-row: 1; margin: 0; }
body[data-workspace-view="overview"] #setup-resume-link { grid-column: 2; grid-row: 1; }
body[data-workspace-view="overview"] #setup-refresh { grid-column: 3; grid-row: 1; }
body[data-workspace-view="overview"] #message-summary .summary-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body[data-workspace-view="overview"] #message-summary .summary-cards > div { padding: .7rem; flex-wrap: wrap; }
body[data-workspace-view="overview"] #message-summary .summary-cards h3 { font-size: .875rem; margin-bottom: .25rem; }
body[data-workspace-view="overview"] #message-summary .summary-value { font-size: 1.25rem; margin: .25rem 0; overflow-wrap: normal; white-space: nowrap; flex: none; }
body[data-workspace-view="overview"] #message-summary .summary-scope { margin: .5rem 0; }

/* Setup presents only its current, server-confirmed task. */
body[data-workspace-view="setup"] .owner-entry-actions,
body[data-workspace-view="setup"] #lines,
body[data-workspace-view="setup"] #setup-resume-link,
body[data-workspace-view="setup"] header .eyebrow,
body[data-workspace-view="setup"] #workspace-intro,
body[data-workspace-view="setup"][data-progress-state="ready"] #setup-resume,
body[data-workspace-view="setup"] #pair-phone > .eyebrow,
body[data-workspace-view="setup"] #activation > .eyebrow,
body[data-workspace-view="setup"] #approval-key > .eyebrow,
body[data-workspace-view="setup"] #setup-mfa > h3 { display: none; }
body[data-workspace-view="setup"]:is([data-setup-stage="connect"], [data-setup-stage="line"], [data-setup-stage="complete"]) #pair-phone,
body[data-workspace-view="setup"]:not([data-setup-stage="line"]) :is(#approval-key, #activation),
body[data-workspace-view="setup"][data-line-key-ready="true"] #approval-key,
body[data-workspace-view="setup"]:not([data-line-key-ready="true"]) #activation { display: none; }
body[data-workspace-view="setup"][data-pairing-active="true"] #create-form,
body[data-workspace-view="setup"][data-setup-stage="compare"] #pair-ticket,
body[data-workspace-view="setup"][data-setup-stage="compare"] #pair-phone > p:not([role="status"]):not(.eyebrow),
body[data-workspace-view="setup"][data-setup-stage="compare"] #approve-form > h3,
body[data-workspace-view="setup"][data-setup-stage="compare"] #approve-form > p,
body[data-workspace-view="setup"][data-setup-stage="compare"] .setup-help { display: none; }
body[data-workspace-view="setup"] header { margin-bottom: .5rem; }
body[data-workspace-view="setup"] .setup-progress { margin: .5rem 0; }
body[data-workspace-view="setup"] .setup-resume { padding: .75rem 1rem; }
body[data-workspace-view="setup"] .setup-resume .eyebrow { display: none; }
body[data-workspace-view="setup"] .setup-resume h2 { font-size: 1rem; margin: 0; }
body[data-workspace-view="setup"] .setup-resume p { margin: .5rem 0 0; color: var(--owner-secondary); }
#pair-phone #approve-form { max-width: 42rem; }
#pair-phone #browser-code { font: 700 2rem Consolas, monospace; color: var(--owner-accent); }
.pairing-recovery-help { color: var(--owner-secondary); font-size: .875rem; }
body[data-workspace-view="setup"] #activation-form > label[for="activation-device"],
body[data-workspace-view="setup"] #activation-device,
body[data-workspace-view="setup"] #activation-form > .line-advanced,
body[data-workspace-view="setup"][data-activation-capability="2"] #activation-form,
body[data-workspace-view="setup"] #activation > p:not(.line-decision-note):not(#activation-status),
body[data-workspace-view="setup"] #activation > .pairing-steps { display: none; }
body[data-workspace-view="setup"] #activation-review dl { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin: .75rem 0; }
body[data-workspace-view="setup"] #activation-review > h3 { font-size: 1rem; }
body[data-workspace-view="setup"] #approval-key:has(#setup-mfa:not([hidden])) > #key-summary { display: none; }

/* Hosted review keeps requirements and exact provider terms beside checkout. */
body[data-owner-page="hosted"] header .eyebrow, body[data-owner-page="hosted"] header .page-intro { display: none; }
body[data-owner-page="hosted"] header h1 { font-size: 1.5rem; }
body[data-owner-page="hosted"] #hosted-billing dl { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin: .75rem 0; }
body[data-owner-page="hosted"] #hosted-mode { margin-bottom: .5rem; }
body[data-owner-page="hosted"] .hosted-hardware { color: var(--owner-secondary); }
body[data-owner-page="hosted"] #hosted-checkout { width: 100%; }
body[data-hosted-phase="test_subscription_observed"] .hosted-hardware { display: none; }
@media (min-width:60.001rem) { .owner-menu > summary { display: none; } }
@media (max-width:60rem) {
  body[data-workspace-view] .device-detail { display: none; }
  .owner-rail .rail-label, .owner-rail .rail-status { display: none; }
  .owner-menu > summary { padding: .35rem 0; }
  body.owner-shell .owner-rail { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 1rem; position: relative; }
  body.owner-shell .owner-brand { margin: 0; }
  body.owner-shell .owner-menu[open] .owner-menu-content { position: absolute; top: 100%; left: 0; right: 0; z-index: 5; background: var(--owner-canvas); border-bottom: 1px solid var(--owner-border); padding: 1rem; }
  body[data-workspace-view="setup"] header h1 { font-size: 1.25rem; }
  body[data-workspace-view="setup"] main { padding-top: .75rem; }
}
@media (max-width:45rem) {
  body[data-workspace-view="overview"] .setup-resume { grid-template-columns: 1fr 1fr; }
  body[data-workspace-view="overview"] #setup-resume-status { grid-column: 1 / -1; }
  body[data-workspace-view="overview"] #setup-resume-link { grid-column: 1; grid-row: 2; }
  body[data-workspace-view="overview"] #setup-refresh { grid-column: 2; grid-row: 2; }
}
@media (max-width:35rem) { .setup-progress ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .25rem; } .setup-progress li { padding: .5rem .15rem; font-size: .8rem; } }
@media (max-width:25rem) {
  body[data-workspace-view="overview"] #message-summary .summary-cards { grid-template-columns: 1fr; }
  body[data-workspace-view="overview"] #message-summary .summary-cards > div { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .5rem .75rem; }
  body[data-workspace-view="overview"] #message-summary .summary-cards > div + div { border-left: 0; border-top: 1px solid var(--owner-border); }
}

.owner-utilities { display: grid; gap: .4rem; margin-top: 1rem; border-top: 1px solid var(--owner-border); padding-top: .75rem; }
.owner-utilities a { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.75rem; padding: .5rem .75rem; color: var(--owner-secondary); }
@media(min-width:60.001rem) {
  body[data-workspace-view] .device-detail { height: 16rem; max-height: 16rem; overflow-y: auto; overscroll-behavior: contain; }
  body[data-workspace-view="overview"] #owner-content { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
  body[data-workspace-view="overview"] #owner-content > .owner-entry-actions,
  body[data-workspace-view="overview"] #setup-resume,
  body[data-workspace-view="overview"] #approved-devices { grid-column: 1 / -1; }
  body[data-workspace-view="overview"] #owner-content > section { margin: 0; }
}
