/* Public, non-operational AR2 walkthrough. AR2 Console source design is ar2-design.css. */
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:18px;top:10px;z-index:99;padding:8px;background:#fff;color:#111}
.ar2-back{color:var(--copper);font:650 11px/1.4 var(--mono);text-decoration:none;padding:10px;border:1px solid var(--line);border-radius:8px}
.demo-warning{margin:16px 0 10px;padding:14px 18px;border-left:3px solid var(--amber);background:var(--surface);font-size:13px;line-height:1.55;color:var(--muted-bright)}
.demo-warning strong{color:var(--text);margin-right:8px}
.system-banner{grid-template-columns:repeat(4,minmax(0,1fr))}
.page-intro{display:flex;align-items:end;justify-content:space-between;gap:24px;padding:24px 4px 18px}
.page-intro h2{margin:0 0 6px;font-size:clamp(22px,3vw,32px)}
.page-intro p:not(.eyebrow){margin:0;line-height:1.65;color:var(--muted-bright)}
.demo-setup{margin-bottom:14px}
.demo-set-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:4px 20px 20px;font-size:13px}
.demo-set-row label{color:var(--text);font-weight:700}
.demo-set-row select{min-height:42px;min-width:min(100%,300px);padding:9px 12px;background:var(--surface2);color:var(--text);border:1px solid var(--line2);border-radius:9px;font:inherit}
.demo-set-row span{font-size:11px;color:var(--muted);line-height:1.5}
.demo-overview{display:grid;grid-template-columns:minmax(0,2fr) minmax(250px,1fr);gap:14px}
.demo-overview .environment-card{grid-column:auto}
.demo-context .context-body{border-top:1px solid var(--line);padding:18px 20px}
.demo-context .context-body strong{display:block;margin-bottom:12px;font-size:15px}
.demo-context .context-body p{font-size:13px;line-height:1.55;color:var(--muted)}
.demo-context .context-body .node-pill{display:inline-block}
.demo-bottom-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:22px 0}
.primary-action{appearance:none;background:var(--copper);color:#101820;border:1px solid var(--copper);border-radius:8px;padding:13px 20px;font:700 11px/1.35 var(--mono);text-decoration:none;cursor:pointer}
.primary-action:hover,.primary-action:focus-visible{background:#e0a089}
.demo-bottom-actions .quiet-button{font-size:11px;border:1px solid var(--line2);padding:13px 16px;border-radius:8px}
.view[hidden]{display:none!important}
.ar2-records{padding:6px 20px}
.ar2-record{display:grid;grid-template-columns:100px 1.5fr 1fr auto;gap:16px;border-bottom:1px solid var(--line);padding:15px 0;align-items:center;font-size:12px}
.ar2-record strong{color:var(--copper);font:600 11px var(--mono)}
.ar2-record span{color:var(--muted-bright)}
.ar2-record small{font:600 9px var(--mono);color:var(--green)}
.demo-camera{min-height:330px}
.demo-request{padding:28px;max-width:820px}
.demo-request p{max-width:680px;color:var(--muted-bright);line-height:1.65;font-size:13px}
.ar2-footer{border-top:1px solid var(--line);padding:26px 0 12px;margin-top:50px;font:11px var(--mono);color:var(--muted)}
.ar2-footer a{color:var(--copper);text-decoration:none}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:900px){.demo-overview{grid-template-columns:1fr}}
@media(max-width:700px){.system-banner{grid-template-columns:repeat(2,minmax(0,1fr))}.system-banner>div:nth-child(3){border-left:0;border-top:1px solid var(--line)}.system-banner>div:nth-child(4){border-top:1px solid var(--line)}
.metric-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.metric:nth-child(3){border-left:0}
.ar2-record{grid-template-columns:80px 1fr;gap:8px}.ar2-record small{text-align:right}
.demo-set-row{align-items:stretch;flex-direction:column}.demo-set-row select{width:100%}
.demo-bottom-actions{align-items:stretch;flex-direction:column}.demo-bottom-actions>*{width:100%;text-align:center}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Accessibility bypass link and consistent return-to-home navigation. */
main:focus { outline:none; }
.skip-link {
  position:fixed; top:12px; left:16px; z-index:9999;
  padding:12px 18px; background:var(--surface2); color:var(--text);
  border:2px solid var(--copper); border-radius:8px;
  font-weight:750; text-decoration:none;
  transform:translateY(calc(-100% - 30px));
}
.skip-link:focus,.skip-link:focus-visible{
  left:16px; transform:translateY(0);
  outline:3px solid var(--text); outline-offset:2px;
}
.ar2-back:hover { background:var(--surface2); text-decoration:underline; text-underline-offset:3px; }