:root{
  --bg:#000; --panel:#0b0f12; --ink:#d9e3ea; --muted:#9aa4ad;
  --barBg:rgba(255,255,255,.86); --barText:#000;
  --hr:#12ff6a; --spo2:#23c3ff; --rr:#ffe066; --bp:#ff6b6b; --temp:#ffffff;
  --btn-bd:#dcdcdc;
  --badgeBg:#0b1220; --badgeBd:#1e3a8a; --badgeFg:#60a5fa; /* cooler blue badge */
}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,Segoe UI,Roboto,Inter,ui-sans-serif}
.wrap{min-height:100%;display:flex;flex-direction:column}

header{
  position:sticky;top:0;
  background:var(--barBg);color:var(--barText);
  border-bottom:1px solid #dcdcdc;
  padding:10px 16px;
  font:12px ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;
  display:flex;align-items:center;justify-content:space-between
}
.brand{font-weight:800;letter-spacing:.5px}

main{flex:1;display:flex;align-items:center;justify-content:center;padding:28px}
.shell{width:min(980px,100%);display:grid;gap:18px}

.hero{
  display:grid;gap:14px;padding:22px;border:1px solid #222;border-radius:14px;background:var(--panel)
}
.eyebrow{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.badge{
  font:12px ui-monospace, Menlo, Consolas;
  border:1px solid var(--badgeBd); color:var(--badgeFg); background:var(--badgeBg);
  padding:4px 8px;border-radius:999px
}
.title{font-weight:900;letter-spacing:.5px;line-height:1.1;margin:2px 0;font-size:clamp(28px,5.6vw,48px)}
.title strong{ color:var(--hr) }
.sub{color:var(--muted);line-height:1.6;max-width:80ch}

/* Feature tags with icons */
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tag{
  display:inline-flex; align-items:center; gap:6px;
  font:12px ui-monospace, Menlo, Consolas;border:1px dashed #2a2a2a;border-radius:6px;padding:4px 8px
}
.tag svg{width:12px;height:12px;stroke-width:2}
.tag.hr{color:var(--hr)} .tag.spo2{color:var(--spo2)} .tag.rr{color:var(--rr)} .tag.bp{color:var(--bp)} .tag.temp{color:var(--temp)}

/* Disclaimer */
.disclaimer{
  border:1px solid #1b2530; background:#0c1116; color:#cfe2f2;
  border-radius:10px; padding:10px 12px; font:12px/1.5 ui-monospace, Menlo, Consolas;
}
.disclaimer label{ display:flex; gap:8px; align-items:flex-start; }
.disclaimer input[type="checkbox"]{ margin-top:2px; width:16px; height:16px }

/* Actions row split: Start (left) | Demos (right) */
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:2px; align-items:center}
.startGroup{display:flex;gap:12px;align-items:center}
.demoGroup{display:flex;gap:12px;align-items:center; margin-left:auto}

.btn{
  appearance:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;
  border-radius:8px;padding:12px 16px;text-decoration:none;
  font:700 12px ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;letter-spacing:.6px;text-transform:uppercase;
  transition:transform .04s ease, box-shadow .12s ease, background .12s ease, opacity .12s ease
}
.btn svg{width:16px;height:16px;stroke-width:2}
.btn.primary{background:var(--barBg);color:var(--barText);border:1px solid var(--btn-bd);box-shadow:0 1px 0 #fff inset,0 0 0 1px rgba(0,0,0,.04)}
.btn.secondary{background:transparent;color:var(--ink);border:1px solid #2a2a2a}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn:hover{opacity:.95}
.btn:active{transform:translateY(1px)}

.card{border:1px solid #222;border-radius:14px;background:var(--panel);padding:16px;display:grid;gap:12px}

.createdGrid{display:grid;gap:18px;grid-template-columns:1fr;align-items:start}
.barHeader{
  display:flex;align-items:center;gap:10px;
  background:var(--barBg); color:var(--barText);
  border:1px solid #dcdcdc; border-radius:10px; padding:8px 10px;
  font:800 12px ui-monospace, Menlo, Consolas; letter-spacing:.6px; text-transform:uppercase;
  margin-bottom: 20px !important;
}
.barHeader .copyBtn{margin-left:auto;color:var(--barText);border-color:#999}

.mono{font:13px ui-monospace, Menlo, Consolas}
code{background:#111;border:1px solid #222;padding:6px 8px;border-radius:6px;color:#9fe870;display:inline-block}
.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;width:100%}
a.link{color:#9fe870;word-break:break-all;text-decoration:none;border-bottom:1px dashed #305a2e;display:inline}
.copyBtn{appearance:none;background:transparent;border:1px solid #2a2a2a;color:#9fe870;border-radius:8px;padding:6px 8px;cursor:pointer;font:12px ui-monospace, Menlo, Consolas}
.muted{color:var(--muted);font-size:12px}

.sessionCards{display:grid;gap:14px;grid-template-columns:1fr}
@media (min-width:860px){ .sessionCards{grid-template-columns:1fr 1fr} }
.sessionCard{border:1px solid #222;border-radius:14px;background:#080c0f;padding:14px;display:grid;gap:12px}
.sessionCard.private{border-color:#3a2616;background:#100b07}
.sessionTop{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.sessionTitle{font:800 13px ui-monospace, Menlo, Consolas;text-transform:uppercase;letter-spacing:.6px}
.sessionHint{margin-top:4px;color:var(--muted);font-size:12px;line-height:1.45}
.detailGrid{display:grid;gap:8px}
.detailLabel{color:var(--muted);font-size:12px}
.cardActions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:2px}
.qrBox{width:140px;height:140px;background:#fff;border-radius:8px;border:1px solid #222;display:grid;place-items:center;flex:0 0 auto}
.qrBox img{display:block;width:140px;height:140px}

footer{background:var(--barBg);color:var(--barText);border-top:1px solid #dcdcdc;padding:10px 16px;font:12px ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;display:flex;align-items:center;justify-content:space-between}
footer a{color:var(--barText);text-decoration:none;border-bottom:1px dotted #555}
footer a:hover{opacity:.8}

.footerHomeLinks{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.footerHomeLinks a{color:inherit;text-decoration:none;border-bottom:1px dotted #555}
.footerHomeLinks a:hover{opacity:.8}