/* Shared public simulation; customer CSS is only used on the full demo page. */
.mcr-demo-page { margin:0; background:#111316; color:#e8e9e4; font-family:system-ui,sans-serif; }
.mcr-demo-header,.mcr-demo-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; max-width:1440px; margin:auto; padding:24px; }
.mcr-demo-header { border-bottom:1px solid #343a36; }
.mcr-demo-header img { max-width:100%; height:auto; }
.mcr-demo-header a,.mcr-demo-footer a { color:#e9d0ad; }
.mcr-demo-main { max-width:1440px; margin:auto; padding:40px 24px; }
.mcr-demo-heading { max-width:780px; margin-bottom:32px; }
.mcr-demo-heading h1 { font-size:clamp(2rem,4vw,3.5rem); font-weight:800; line-height:1.12; margin:12px 0 20px; letter-spacing:-.04em; }
.mcr-demo-heading>p:last-child { color:#b9c1b8; font-size:1.1rem; line-height:1.7; }
.mcr-demo-eyebrow { font-size:.7rem; letter-spacing:.18em; color:#e7b78a; font-weight:700; margin:0 0 8px; }
.mcr-simulator { margin:32px 0; color:#e8e9e4; font:15px/1.6 system-ui,sans-serif; }
.mcr-simulator * { box-sizing:border-box; }
.mcr-simulator [hidden] { display:none !important; }
.mcr-simulator button,.mcr-simulator input,.mcr-simulator select { font:inherit; }
.mcr-simulator button { min-height:44px; padding:9px 14px; border:1px solid #536053; border-radius:8px; color:#edf0e9; background:#29312b; cursor:pointer; transition:background-color 160ms,transform 160ms; }
.mcr-simulator button:hover:enabled { background:#3b483c; transform:translateY(-1px); }
.mcr-simulator button:disabled { opacity:.5; cursor:default; }
.mcr-simulator :is(button,a,input,select):focus-visible { outline:3px solid #f4cc8c; outline-offset:3px; }
.mcr-simulator button.mcr-demo-primary { color:#fff; background:#a62e26; border-color:#dd6655; font-weight:700; }
.mcr-simulator button.mcr-demo-primary:hover:enabled { background:#bd3d30; }
.mcr-demo-notice { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 18px; border:1px solid #655236; border-radius:12px; background:#29271f; color:#f0dfc3; }
.mcr-demo-notice strong { color:#ffda91; }
.mcr-demo-fineprint { color:#acb5ab; font-size:.8rem; margin:12px 0 24px; max-width:900px; }
.mcr-demo-layout { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,1.6fr); gap:24px; align-items:start; }
.mcr-demo-cards { display:grid; gap:16px; min-width:0; }
.mcr-demo-page .mcr-demo-layout { grid-template-columns:1fr; }
.mcr-demo-page .mcr-demo-cards { grid-template-columns:repeat(3,minmax(0,1fr)); }
.mcr-demo-server-picker { max-width:360px; margin-bottom:20px; }
.mcr-demo-cards>[data-demo-card] { border:2px solid transparent; border-radius:16px; transition:border-color 180ms; min-width:0; }
.mcr-demo-cards>[data-selected="true"] { border-color:#ddab69; }
.mcr-demo-cards [data-state="running"] .status-dot { background:#80c579; }
.mcr-demo-cards [data-state="offline"] .status-dot { background:#9ca3af; }
.mcr-demo-cards :is([data-state="starting"],[data-state="stopping"]) .status-dot { background:#f0bd60; }
.mcr-demo-cards [data-mcr-card] { content-visibility:visible; }
.mcr-demo-cards .server-actions { flex-wrap:wrap; gap:8px; }
.mcr-demo-cards .server-actions>* { margin-left:0 !important; }
.mcr-demo-cards .server-action-primary { min-width:120px; }
.mcr-demo-preview-card { border:1px solid #4e5547; border-radius:14px; background:#212820; padding:24px; }
.mcr-demo-card-art { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:4px 0 22px; color:#e9c595; }
.mcr-demo-card-art svg { width:64px; height:64px; }
.mcr-demo-preview-card h3 { font-size:1.35rem; line-height:1.3; margin:0 0 10px; color:#f6eee0; }
.mcr-demo-preview-card p { margin:8px 0; color:#b7c0b1; }
.mcr-demo-preview-card button { margin-top:20px; width:100%; }
.mcr-demo-address { font-size:.8rem; overflow-wrap:anywhere; }
.mcr-demo-workspace { min-width:0; border:1px solid #4e5547; border-radius:16px; overflow:hidden; background:#191f1b; box-shadow:0 20px 50px #0003; }
.mcr-demo-workspace-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:24px; background:linear-gradient(115deg,#33382a,#22291f); border-bottom:1px solid #4a5141; }
.mcr-demo-workspace-header h2 { font-size:clamp(1.25rem,2vw,1.7rem); line-height:1.3; font-weight:700; margin:0; overflow-wrap:anywhere; }
.mcr-demo-state { color:#d0d5cc; border:1px solid #697063; padding:4px 10px; border-radius:30px; white-space:nowrap; font-size:.85rem; }
.mcr-demo-state[data-state="running"] { color:#b9eeab; border-color:#69925b; background:#304327; }
.mcr-demo-state[data-state="starting"],.mcr-demo-state[data-state="stopping"] { color:#f8d399; border-color:#a48141; }
.mcr-demo-controls { border:0; margin:0; padding:24px; min-width:0; }
.mcr-demo-actions { display:flex; flex-wrap:wrap; gap:8px; }
.mcr-demo-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:20px 0; }
.mcr-demo-metrics>div { border:1px solid #3c483d; background:#222c24; border-radius:10px; padding:12px; }
.mcr-demo-metrics span { display:block; font-size:.72rem; color:#b5c0b0; overflow-wrap:anywhere; }
.mcr-demo-metrics strong { display:block; font-size:clamp(.9rem,1.7vw,1.4rem); white-space:nowrap; color:#e1eed9; }
.mcr-demo-tabs { display:flex; gap:6px; flex-wrap:wrap; border-bottom:1px solid #46503f; padding-bottom:16px; margin-bottom:20px; }
.mcr-demo-tabs button { display:flex; align-items:center; gap:7px; font-size:.8rem; padding:7px 10px; }
.mcr-demo-tabs svg { width:24px; height:24px; }
.mcr-demo-tabs [aria-pressed="true"] { border-color:#d7a35d; background:#49402b; color:#ffe2ad; }
.mcr-demo-console { height:245px; padding:16px; overflow:auto; overscroll-behavior:contain; border:1px solid #41483b; border-radius:10px; background:#101510; color:#b9d6a4; font:12px/1.9 ui-monospace,monospace; overflow-wrap:anywhere; }
.mcr-simulator form { margin-top:16px; }
.mcr-simulator label { display:block; margin:14px 0 6px; color:#d0d9c9; font-weight:600; }
.mcr-simulator :is(input,select) { display:block; width:100%; min-width:0; min-height:44px; color:#eef1e9; background:#101810; border:1px solid #63715a; padding:10px 12px; border-radius:8px; }
.mcr-simulator input::placeholder { color:#a0ac98; }
.mcr-demo-input-row { display:flex; gap:8px; }
.mcr-demo-input-row input { flex:1; width:0; }
.mcr-demo-input-row button { flex-shrink:0; }
.mcr-demo-hint { font-size:.8rem; color:#a9b5a0; margin:8px 0; }
.mcr-demo-feedback { min-height:26px; margin:16px 0 0; color:#edca8e; font-size:.9rem; }
.mcr-simulator [data-demo-panel] h3 { font-size:1.2rem; font-weight:700; margin:0 0 12px; }
.mcr-simulator [data-demo-panel]>p { color:#bac6b2; margin-bottom:16px; }
.mcr-simulator [data-demo-panel] ul { list-style:none; padding:0; margin:16px 0; }
.mcr-simulator [data-demo-panel] li { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid #414b3b; overflow-wrap:anywhere; }
.mcr-simulator [data-demo-panel] li button { font-size:.8rem; }
.mcr-simulator [data-demo-settings]>button { margin-top:20px; }
.mcr-demo-file-list { display:flex; gap:8px; flex-wrap:wrap; }
.mcr-simulator pre { white-space:pre-wrap; overflow-wrap:anywhere; padding:18px; border-radius:8px; background:#101510; color:#bdd5ac; margin-top:18px; font-size:.85rem; }
.mcr-demo-full-link { display:block; padding:18px 24px; border-top:1px solid #4e5547; color:#f2d7af; font-weight:700; text-decoration:none; }
.mcr-demo-full-link:hover { background:#333b2d; }
.mcr-demo-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
@keyframes mcr-section-arrive { from { opacity:.65; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
@keyframes mcr-journey-signal { from { background-position:100% 0; } to { background-position:-100% 0; } }
[data-mcr-home] .mcr-journey { position:relative; }
[data-mcr-home] .mcr-journey::before { content:""; position:absolute; top:-12px; left:0; right:0; height:2px; background:linear-gradient(90deg,#5f3125 30%,#ed9970 48%,#ffd7a3 50%,#5f3125 68%); background-size:200% 100%; animation:mcr-journey-signal 5s linear 3; }
[data-mcr-home] .mcr-motion-enter { animation:mcr-section-arrive 550ms ease-out both; }
[data-mcr-home] .mcr-feature-grid article { transition:transform 180ms,border-color 180ms; }
@media(hover:hover) { [data-mcr-home] .mcr-feature-grid article:hover { transform:translateY(-4px); border-color:#c18d5e; } }
@media(max-width:900px) {
  .mcr-demo-layout { grid-template-columns:1fr; }
  .mcr-demo-cards { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .mcr-simulator-compact .mcr-demo-cards { grid-template-columns:1fr; }
}
@media(max-width:680px) {
  .mcr-demo-main { padding:24px 12px; }
  .mcr-demo-header,.mcr-demo-footer { padding:20px 16px; }
  .mcr-demo-cards { grid-template-columns:1fr; }
  .mcr-demo-page .mcr-demo-cards { grid-template-columns:1fr; }
  .mcr-demo-page [data-ready="true"] [data-demo-card][data-selected="false"] { display:none; }
  .mcr-demo-notice { flex-direction:column; align-items:flex-start; }
  .mcr-demo-workspace-header { flex-wrap:wrap; padding:18px; }
  .mcr-demo-controls { padding:16px; }
  .mcr-demo-metrics { gap:6px; }
  .mcr-demo-metrics>div { padding:9px; }
  .mcr-demo-tabs button { flex:1 1 40%; }
  .mcr-simulator [data-demo-panel] li { flex-wrap:wrap; }
}
@media(prefers-reduced-motion:reduce) {
  [data-mcr-home] .mcr-motion-enter,[data-mcr-home] .mcr-journey::before { animation:none; }
  .mcr-simulator *,[data-mcr-home] .mcr-feature-grid article { transition:none !important; animation:none !important; scroll-behavior:auto !important; }
}
