:root{--ink:#102731;--muted:#71838a;--line:#dce6e8;--paper:#f5f7f6;--green:#0d4a40;--red:#c44957;--purple:#251d2a;--blue:#21789a}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--paper);color:var(--ink);font-size:14px}
.demo-banner{position:fixed;z-index:90;right:18px;top:14px;background:#b9ff3e;color:#122319;padding:8px 12px;border-radius:999px;font:800 10px/1 monospace;letter-spacing:.7px;box-shadow:0 5px 18px #0003}
.app{display:flex;min-height:100vh}
.sidebar{position:fixed;inset:0 auto 0 0;width:242px;background:#0d2029;color:#b9cbd1;padding:18px 13px;display:flex;flex-direction:column;z-index:5}
.am .sidebar{background:var(--purple)}
.mediscope .sidebar{width:220px;background:#0c2632}
.logo-row{display:flex;align-items:center;gap:10px;padding:0 7px 18px;border-bottom:1px solid #ffffff12}
.logo-row img{width:61px;height:42px;object-fit:contain;border-radius:5px}
.logo-row strong{display:block;color:white;font-size:14px}
.logo-row small{display:block;margin-top:4px;color:#89bfb5;font-size:9px;letter-spacing:1px}
.am .logo-row small{color:#e7a5ad}
.workspace{margin:15px 4px;padding:11px;background:#ffffff0b;border:1px solid #ffffff0d;border-radius:10px}
.workspace strong{display:block;color:white;font-size:12px}
.workspace span{font-size:10px;color:#8fa5ad}
.nav-label{padding:6px 11px;color:#6f8a94;font-size:9px;font-weight:800;letter-spacing:1.2px}
.nav{display:grid;gap:2px}
.nav span{padding:9px 11px;border-radius:8px;font-size:12px}
.nav .active{background:#ffffff10;color:#91f1e1;font-weight:700}
.am .nav .active{background:var(--red);color:white}
.mediscope .nav .active{background:#18657a;color:white}
.user{margin-top:auto;border-top:1px solid #ffffff12;padding:14px 9px 3px;display:flex;align-items:center;gap:9px}
.avatar{width:31px;height:31px;border-radius:8px;background:#ffffff14;color:white;display:grid;place-items:center;font-weight:800;font-size:10px}
.user strong{display:block;color:white;font-size:11px}
.user small{font-size:9px}
.main{margin-left:242px;min-width:0;width:calc(100% - 242px)}
.mediscope .main{margin-left:220px;width:calc(100% - 220px)}
.topbar{height:60px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 25px;position:sticky;top:0;z-index:4}
.crumb{font-size:12px;color:var(--muted)}
.crumb b{color:var(--ink)}
.topbar .spacer{flex:1}
.scope-pill{border:1px solid var(--line);background:#f9fbfb;border-radius:8px;padding:8px 11px;font-size:11px}
.live{color:#16826f;font-weight:800;font-size:10px}
.content{padding:25px;max-width:1450px}
.heading{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:18px}
.heading small{font-size:10px;color:var(--muted);letter-spacing:.7px}
.heading h1{font-size:27px;margin:5px 0 4px;letter-spacing:-.6px}
.heading p{margin:0;color:var(--muted);font-size:12px}
.primary{border:0;border-radius:8px;background:var(--green);color:white;font-weight:700;padding:10px 14px}
.am .primary{background:var(--red)}
.mediscope .primary{background:var(--blue)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.kpi,.card{background:white;border:1px solid var(--line);border-radius:10px}
.kpi{padding:16px;min-height:105px}
.kpi label{display:block;font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.kpi strong{display:block;font-size:24px;margin:12px 0 7px;letter-spacing:-.5px}
.kpi span{font-size:10px;color:#268774}
.am .kpi span{color:var(--red)}
.grid{display:grid;grid-template-columns:1.55fr 1fr;gap:14px}
.card-head{display:flex;align-items:center;border-bottom:1px solid var(--line);padding:14px 16px;font-weight:800;font-size:12px}
.card-head span{margin-left:auto;color:var(--muted);font-weight:500;font-size:10px}
.card-body{padding:16px}
.bars{height:178px;display:flex;gap:9px;align-items:flex-end;padding:15px 8px 0;border-bottom:1px solid var(--line)}
.bars i{flex:1;background:linear-gradient(#70d2c3,#1c665e);border-radius:4px 4px 0 0}
.am .bars i{background:linear-gradient(#e7929d,#a53a48)}
.insight{border:1px solid var(--line);border-radius:8px;padding:12px;margin-bottom:8px}
.insight b{font-size:11px}
.insight p{margin:5px 0 0;color:var(--muted);font-size:10px;line-height:1.5}
.table{width:100%;border-collapse:collapse}
.table th,.table td{text-align:left;padding:10px 8px;border-bottom:1px solid #edf1f2;font-size:10px}
.table th{color:var(--muted);font-size:9px;text-transform:uppercase}
.tag{font-size:9px;padding:4px 7px;border-radius:999px;background:#e4f4ef;color:#287867}
.tag.red{background:#fae8ea;color:#a8404d}
.notice{padding:11px 14px;border-radius:8px;background:#eff8df;border:1px solid #d6edac;color:#39551f;font-size:11px;margin-bottom:14px}
.am .notice{background:#fff0f1;border-color:#f0cfd3;color:#7e3039}
.patient-layout{display:grid;grid-template-columns:250px minmax(360px,1fr) 260px;gap:13px}
.patient-search{padding:12px}
.search{border:1px solid var(--line);border-radius:7px;padding:9px;color:#91a0a6;font-size:10px;margin-bottom:9px}
.patient{padding:10px;border:1px solid transparent;border-radius:8px;margin-bottom:5px}
.patient.active{background:#e5f3f6;border-color:#badde5}
.patient b{font-size:11px}
.patient span{display:block;font-size:9px;color:var(--muted);margin-top:3px}
.camera{background:#06131a;border-radius:10px;min-height:450px;position:relative;overflow:hidden;display:grid;place-items:center}
.scope{width:260px;height:260px;border-radius:50%;background:radial-gradient(circle at 60% 42%,#e19a8c 0 5%,#a84d4c 18%,#5f242a 44%,#180b11 72%);box-shadow:0 0 0 12px #19333e,0 0 45px #3e899588}
.scope:after{content:"ENDOSCOPY PREVIEW";position:absolute;left:20px;top:18px;color:#91dce4;font:9px monospace;letter-spacing:1px}
.camera-tools{position:absolute;bottom:18px;display:flex;gap:8px}
.camera-tools span{background:#ffffff16;color:white;border:1px solid #ffffff22;border-radius:7px;padding:9px 12px;font-size:10px}
.camera-tools .capture{background:#248aa1}
.panel{padding:14px}
.panel h3{font-size:12px;margin:0 0 11px}
.field{border:1px solid var(--line);border-radius:7px;padding:9px;margin-bottom:8px;font-size:10px;color:#566a72}
.thumbs{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.thumb{height:62px;border-radius:6px;background:radial-gradient(circle,#bd6963,#421b21 70%);border:2px solid white;box-shadow:0 0 0 1px var(--line)}
.integration{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.integration span{border-radius:999px;background:#e2f5f2;color:#26776f;padding:6px 8px;font-size:9px;font-weight:700}
@media(max-width:900px){.sidebar{width:190px}
.main{margin-left:190px;width:calc(100% - 190px)}
.mediscope .sidebar{width:180px}
.mediscope .main{margin-left:180px;width:calc(100% - 180px)}
.content{padding:18px}
.kpis{grid-template-columns:repeat(2,1fr)}
.grid{grid-template-columns:1fr}
.patient-layout{grid-template-columns:190px minmax(330px,1fr)}
.patient-layout>.card:last-child{display:none}
}
@media(max-width:620px){.sidebar{display:none}
.main,.mediscope .main{margin:0;width:100%}
.content{padding:14px}
.heading h1{font-size:22px}
.kpis{grid-template-columns:1fr 1fr}
.patient-layout{grid-template-columns:1fr}
.patient-layout>.card:first-child{display:none}
.camera{min-height:380px}
.demo-banner{right:10px;top:10px}
}

button{font:inherit}.nav button{border:0;background:transparent;color:inherit;text-align:left;padding:9px 11px;border-radius:8px;font-size:12px;cursor:pointer}.nav button:hover{background:#ffffff0b;color:white}.nav button:focus-visible,.demo-action:focus-visible{outline:2px solid #91f1e1;outline-offset:2px}.kpi.demo-action{cursor:pointer;text-align:left}.kpi.demo-action:hover,.demo-tile:hover{border-color:#86aca6;transform:translateY(-2px)}.kpi,.demo-tile{transition:transform .18s,border-color .18s}.feature-grid-demo{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:14px}.demo-tile{width:100%;text-align:left;cursor:pointer;color:var(--ink)}.demo-tile .card-body{min-height:160px}.demo-tile b{display:block;font-size:14px;margin:13px 0 7px}.demo-tile p{font-size:11px;line-height:1.6;color:var(--muted);margin:0 0 14px}.demo-tile span{font-size:10px;color:#247d70}.tile-icon{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:#e4f3f0;color:#1b7568;font-weight:800}.table-wrap{overflow-x:auto}.patient{display:block;width:100%;text-align:left;background:transparent;cursor:pointer;color:var(--ink)}.camera-tools button{border:1px solid #ffffff30;border-radius:7px;background:#173944;color:white;padding:9px 11px;cursor:pointer;font-size:11px}.camera-tools .capture{background:#21789a}.thumb{cursor:pointer;padding:0}.mini{border:1px solid var(--line);border-radius:6px;background:white;padding:5px 8px;color:#21789a;cursor:pointer}.demo-toast{position:fixed;z-index:120;left:50%;bottom:28px;transform:translate(-50%,20px);padding:12px 16px;border-radius:9px;background:#102731;color:white;box-shadow:0 12px 32px #0005;font-size:12px;opacity:0;pointer-events:none;transition:.2s}.demo-toast.show{opacity:1;transform:translate(-50%,0)}.integration-note{margin-top:14px;padding:18px;border:1px solid #b8d9d4;border-radius:10px;background:#edf8f5}.integration-note b{font-size:13px}.integration-note p{color:#536e68;line-height:1.7;font-size:12px;margin:7px 0 0}.report-preview{display:grid;place-items:center;padding:18px;border-radius:12px;background:#dfe7e8}.report-paper{width:min(760px,100%);min-height:560px;background:white;box-shadow:0 14px 35px #15323d24;padding:38px}.report-head{display:flex;gap:14px;align-items:center;padding-bottom:18px;border-bottom:2px solid #173b48}.report-head img{width:62px;height:42px;object-fit:contain}.report-head b,.report-head small{display:block}.report-head small{margin-top:4px;font-size:9px;color:var(--muted)}.report-paper h2{font-size:24px;margin:28px 0 20px}.report-paper h3{font-size:12px;margin:23px 0 8px}.report-paper p{font-size:11px;line-height:1.7;color:#536a72}.report-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:13px;background:#f2f6f6;border-radius:8px}.report-meta span{font-size:10px}.report-meta b{display:block;font-size:8px;color:var(--muted);text-transform:uppercase;margin-bottom:4px}.report-images{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.report-images i{display:block;height:95px;border-radius:6px;background:radial-gradient(circle,#477f83,#0d3037)}.dashboard-grid>.card{min-width:0}
@media(max-width:620px){.app{display:block}.sidebar,.mediscope .sidebar{position:sticky;top:0;width:100%;height:auto;display:block;padding:8px 10px}.logo-row{padding:0 2px 7px}.logo-row img{width:46px;height:31px}.logo-row small,.workspace,.nav-label,.user{display:none}.nav{display:flex;overflow-x:auto;gap:5px;padding-bottom:3px}.nav button{white-space:nowrap;background:#ffffff08}.main,.mediscope .main{margin:0;width:100%}.topbar{height:50px;padding:0 14px}.scope-pill{display:none}.content{padding:14px}.notice{padding-right:105px}.heading{align-items:stretch;flex-direction:column}.heading .primary{align-self:flex-start}.kpis{grid-template-columns:1fr 1fr}.feature-grid-demo{grid-template-columns:1fr}.patient-layout{grid-template-columns:1fr}.patient-layout>.patient-search{display:block}.camera{min-height:340px}.camera-tools{left:12px;right:12px;justify-content:center;flex-wrap:wrap}.report-paper{padding:23px}.report-meta{grid-template-columns:1fr 1fr}.report-images i{height:70px}.demo-banner{font-size:8px;padding:7px 9px}}

/* Screenshot-faithful NG Super Apps demo */
.super{--pink:#ec2870;--pink-dark:#7d0c45;--pink-mid:#9b185c;--pink-line:#efcfde;--paper:#fff9fc;background:#fff9fc;color:#2c0e1d}.super .sidebar{width:194px;padding:0;background:linear-gradient(180deg,#790b45 0%,#a61a61 54%,#70318d 100%);color:#f8dce9}.super .main{margin-left:194px;width:calc(100% - 194px);background:radial-gradient(circle at 92% 2%,#fde7f3 0,transparent 24%),#fffafd;min-height:100vh}.super .topbar{display:none}.super .logo-row{height:80px;padding:12px 11px;border-color:#ffffff25;align-items:flex-start}.super .logo-row img{width:68px;height:48px}.super .logo-row strong{font-size:12px;line-height:1.05}.super .logo-row small{color:#fff;font-size:8px;line-height:1.05;margin-top:4px;max-width:80px}.version-chip{margin-left:auto;background:#ffe1a8;color:#694a12;border-radius:10px;font-size:7px;padding:3px 5px}.super .nav{display:block;overflow-y:auto;padding:8px 9px;scrollbar-width:thin;flex:1}.super .nav-section{display:block;margin:12px 4px 5px;color:#e8a9c6;font-size:8px;font-weight:800;letter-spacing:1.2px}.super .nav button{position:relative;display:block;width:100%;height:31px;padding:7px 8px;color:#f4d6e5;font-size:11px;font-weight:600;border-radius:7px}.super .nav button i{position:absolute;right:8px;top:6px;width:17px;height:17px;border-radius:50%;background:#ffd45c;color:#7d0c45;display:grid;place-items:center;font-size:8px;font-style:normal}.super .nav button.active{background:#ffffff16;color:#ffe071}.super .role-preview{padding:7px 10px;border-top:1px solid #ffffff1f}.role-preview small,.role-preview span,.role-preview b{display:block}.role-preview small{font-size:8px;letter-spacing:.7px;color:#e4b7d1}.role-preview span{margin:5px 0 9px;border:1px solid #ffffff5c;border-radius:7px;padding:6px 8px;font-size:9px;color:white}.role-preview b{font-size:8px;color:#57edb0}.super .user{margin:0;padding:10px;background:#5c236f;border-color:#ffffff1f}.super .content{max-width:none;padding:18px 23px 50px}.super .notice{display:none}.super .heading{margin-bottom:14px}.super .heading h1{font-size:20px;margin:0 0 3px}.super .heading small{display:none}.super .heading p{color:#9e6680;font-size:10px}.super .kpis{grid-template-columns:repeat(4,1fr);gap:11px;margin-bottom:14px}.super .kpi{min-height:76px;padding:12px;border-color:var(--pink-line);border-radius:10px;background:linear-gradient(145deg,#fff 70%,#fdeaf4);box-shadow:0 5px 15px #a6225d14;color:#30101f}.super .kpi label{color:#92506e;font-size:9px}.super .kpi strong{font-size:18px;margin:7px 0 3px}.super .kpi span{color:#ce345f;font-size:9px}.super-main-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:12px}.super .card{border-color:var(--pink-line);border-radius:10px;box-shadow:0 5px 15px #a6225d12}.super .card-head{padding:11px 13px;border-color:var(--pink-line);font-size:11px}.super .card-head span{color:#e53278}.super .bars{height:166px;border-color:#f0dce5}.super .bars i{background:#186e57}.super .bars i:last-child{background:#d3a520}.bar-labels{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:6px}.bar-labels span{padding:6px 2px;border:1px solid var(--pink-line);border-radius:6px;text-align:center;font-size:7px;color:#7d5065}.bar-labels b{display:block;margin-top:2px;color:#168266}.plain{border-bottom:0;padding-top:2px!important}.ai-column .insight{background:#fff;padding:9px 11px;margin-bottom:8px;border-color:#ecd2de;border-left:2px solid #dc365f}.ai-column .insight.good{border-left-color:#188668}.ai-column .insight b{font-size:10px}.ai-column .insight p{font-size:8px;line-height:1.55}.super-bottom-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:12px;align-items:start}.task-row{padding:8px;background:#fff0f5;border:1px solid #f0c6d8;border-radius:7px;font-size:9px}.task-row b,.task-row small{display:block;margin-left:19px}.task-row small{color:#a07186;margin-top:3px}.stock-list p,.activity-list p{position:relative;margin:0;padding:7px 0;border-bottom:1px solid #f4e5ec;font-size:8px}.stock-list p:last-child,.activity-list p:last-child{border:0}.stock-list strong{float:right;color:#d13458}.activity-list b{color:#50152f}

/* Screenshot-faithful NG AM demo */
.am{--ink:#1c1420;--muted:#817785;--red:#df4f52;--red-soft:#fff0f0;--paper:#f5f3f6;background:#f5f3f6}.am .sidebar{width:168px;padding:0;background:#19151f;color:#9f95a5}.am .main{margin-left:168px;width:calc(100% - 168px);background:#f5f3f6}.am .logo-row{height:60px;padding:10px 7px;border-color:#2c2732}.am .logo-row img{width:54px;height:37px}.am .logo-row strong{font-size:12px}.am .logo-row small{color:#ef555a;font-size:8px}.outside{display:block;padding:12px 0 2px;font-size:8px;color:#776d7c;letter-spacing:1px}.am .workspace{display:flex;gap:9px;align-items:center;margin:5px 10px 8px;padding:8px;background:#29232f;border:0}.am-mark{width:27px;height:27px;border-radius:7px;background:#df4f52;color:white;display:grid;place-items:center;font-size:10px;font-weight:800}.am .workspace strong{font-size:10px}.am .workspace span{display:block;font-size:8px}.am .nav{display:block;overflow-y:auto;padding:0 5px 10px;scrollbar-width:thin;flex:1}.am .nav button{position:relative;display:block;width:100%;height:31px;padding:7px 5px;color:#9f95a5;font-size:10px;border-radius:7px}.am .nav button.active{background:#df4f52;color:white}.am .nav button i{position:absolute;right:6px;top:7px;background:#262131;color:#fff;border-radius:8px;min-width:15px;padding:1px 4px;font-size:8px;font-style:normal}.am .protected{margin:8px 10px;padding:10px;background:#29232f;border:1px solid #342d3b;border-radius:10px}.protected>*{display:block}.protected>b{width:26px;height:26px;border-radius:7px;background:#df4f52;color:#fff;display:grid;place-items:center}.protected strong{margin-top:7px;color:#fff;font-size:9px}.protected span{margin-top:3px;font-size:7px;line-height:1.4}.am .user{margin:0;padding:9px 7px;background:#151219}.am .topbar{height:45px;padding:0 18px}.am .crumb{font-size:10px}.menu-search{border:1px solid #e4dfe7;border-radius:8px;padding:7px 9px;color:#958b99;font-size:8px}.menu-search b{color:#26a75c}.am .scope-pill{padding:8px 12px;color:#1c1420}.am .content{max-width:none;padding:17px 20px}.am .notice{display:none}.am .heading{margin-bottom:14px}.am .heading small{color:#df4f52;font-size:8px;font-weight:800}.am .heading h1{font-size:23px;margin:5px 0}.am .heading p{font-size:9px}.am .primary{padding:10px 16px;background:#df4f52}.system-strip,.attention-strip{display:flex;align-items:center;gap:9px;border-radius:11px;padding:11px 13px;margin-bottom:10px;box-shadow:0 3px 8px #1c142012}.system-strip{background:#fff;border:1px solid #bfe5cf}.system-strip>b{width:27px;height:27px;border-radius:8px;background:#1fa55b;color:#fff;display:grid;place-items:center}.system-strip span{flex:1}.system-strip strong,.system-strip small{display:block}.system-strip strong{font-size:10px}.system-strip small{font-size:7px;color:#807685;margin-top:2px}.system-strip i{font-style:normal;font-size:7px;background:#e5f7ec;color:#1a9a52;border-radius:9px;padding:3px 7px}.attention-strip{background:#fff6e5;border:1px solid #f1d29b;font-size:9px}.attention-strip>span{background:#fff;border-radius:10px;padding:3px 9px}.attention-strip>i{margin-left:auto;font-style:normal}.am .kpis{grid-template-columns:repeat(4,1fr);gap:12px;margin:14px 0}.am .kpi{min-height:112px;padding:15px;border-radius:14px;border-color:#e9e4eb;box-shadow:0 4px 12px #1c142012}.am .kpi label{font-size:9px;text-transform:none}.am .kpi strong{font-size:24px;margin:18px 0 6px}.am .kpi span{color:#df4f52;font-size:8px}.am-overview{display:grid;grid-template-columns:1.65fr 1fr;gap:13px}.am .card{border-color:#e8e3ea;border-radius:14px}.am .card-head{display:grid;grid-template-columns:1fr auto;padding:14px 17px}.am .card-head span{grid-column:1;color:#df4f52;font-size:8px;font-weight:800}.am .card-head b{grid-column:1;font-size:11px;margin-top:5px}.am .card-head i{grid-column:2;grid-row:1/3;align-self:center;color:#df4f52;font-style:normal;font-size:8px}.big-amount{display:block;font-size:22px}.am .card-body>small{display:block;color:#8c828f;font-size:8px;margin-top:3px}.mini-branch-bars{height:90px;display:flex;align-items:flex-end;gap:17px;margin-top:15px;border-bottom:1px solid #eee9ef}.mini-branch-bars i{width:14%;background:#df4f52;border-radius:5px 5px 0 0}.appointment-card p{font-size:9px;color:#847a88}.appointment-card button{border:0;background:none;color:#df4f52;margin-top:20px;font-size:8px}

/* Screenshot-faithful NG Mediscope demo */
.mediscope{--ink:#0b2d2b;--muted:#607875;--line:#cadeda;--teal:#078a80;--pale:#f0f7f5;background:#f0f6f4}.mediscope .med-header{position:fixed;inset:0 0 auto 0;width:100%;height:62px;padding:0 12px;background:#fff;color:#0b2d2b;display:flex;flex-direction:row;align-items:center;border-bottom:1px solid #d9e6e3}.mediscope .logo-row{border:0;padding:0;min-width:280px}.mediscope .logo-row img{width:52px;height:38px}.mediscope .logo-row strong{color:#092d2a;font-size:14px}.mediscope .logo-row small{color:#66817e;font-size:8px}.mediscope .med-header>.nav{display:flex;gap:3px;margin-left:15px}.mediscope .med-header>.nav button{color:#56736f;border:1px solid transparent;padding:7px 9px;font-size:9px}.mediscope .med-header>.nav button.active{color:#078a80;background:#edf8f6;border-color:#c8e4df}.med-actions{display:flex;gap:10px;align-items:center;margin-left:auto}.med-actions span,.med-actions b{border:1px solid #cbdeda;border-radius:8px;padding:9px 12px;font-size:8px;font-weight:500}.med-actions b{background:#fff5d8;border-color:#edc86a;color:#9a6500;border-radius:15px}.med-actions small{color:#58726f;font-size:8px}.mediscope .main{margin-left:0;padding-top:62px;width:100%}.mediscope .topbar{display:none}.mediscope .content{max-width:none;padding:0}.mediscope .notice{position:fixed;left:50%;top:70px;z-index:30;transform:translateX(-50%);width:max-content;max-width:80%;margin:0;padding:7px 11px;opacity:.93}.mediscope #demo-content>.heading{display:none}.exact-med{display:grid;grid-template-columns:255px minmax(500px,1fr) 365px;gap:0;min-height:calc(100vh - 62px)}.patient-rail{background:#fff;border-right:1px solid #cbdeda;padding:18px 12px;overflow-y:auto}.rail-heading{display:grid;grid-template-columns:1fr auto;align-items:center;margin-bottom:12px}.rail-heading>span{grid-column:1/-1;font-size:8px;letter-spacing:1.3px;color:#078a80;font-weight:800}.rail-heading h2{font-size:20px;margin:5px 0}.rail-heading button{grid-column:2;grid-row:2;border:0;border-radius:9px;background:#e6f4f1;color:#08776f;padding:9px;font-size:8px}.patient-rail .search{height:40px;padding:13px 8px}.patient-rail .patient{border:1px solid #bdd9d4;border-radius:9px;padding:10px;margin-bottom:16px}.patient-rail .patient i{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#d7f0eb;color:#08776f;font-style:normal;font-size:8px;margin-right:8px}.history-title{display:block;margin:15px 0 8px;font-size:8px;color:#078a80;font-weight:800;letter-spacing:1px}.history-row{display:block;width:100%;text-align:left;border:1px solid #cddeda;border-radius:8px;background:#fff;padding:9px;margin-bottom:5px;color:#173c38}.history-row b,.history-row span{display:block;font-size:8px}.history-row span{color:#718b87;margin-top:4px}.med-center{padding:16px;background:#eff6f4;min-width:0}.patient-form{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;background:#fff;border:1px solid #d6e6e2;border-radius:12px;padding:10px;margin-bottom:12px}.patient-form span,.patient-form button{border:1px solid #cadeda;border-radius:8px;background:#fff;padding:13px 10px;text-align:left;color:#36524f;font-size:8px}.patient-form span:nth-child(6){grid-column:1}.patient-form button{grid-column:2/4;background:#078a80;color:#fff;text-align:center;border:0;font-weight:700}.patient-form button.muted{grid-column:4/5;background:#e8f5f3;color:#64aaa4;border:1px solid #bddfd9}.mediscope .camera{min-height:596px;border-radius:12px;background:#020b0a;display:block}.camera-status{display:flex;gap:12px;align-items:center;height:39px;padding:0 14px;background:#0e1d1b;color:#a9d3cd;font-size:8px}.camera-status b{background:#e73737;color:#fff;border-radius:5px;padding:5px}.camera-status time{margin-left:auto}.mediscope .camera>p{position:absolute;inset:0;display:grid;place-items:center;color:#a7c5c0;font-size:9px;margin:0}.patient-overlay{position:absolute;left:16px;bottom:70px;color:#fff;font-size:8px;line-height:1.5}.mediscope .camera-tools{left:0;right:0;bottom:0;height:63px;background:#0e1d1b;display:flex;align-items:center;justify-content:center}.mediscope .camera-tools button{min-width:172px;background:#263936;border-color:#536864;font-size:8px}.mediscope .camera-tools .capture{background:#078a80;border-color:#078a80}.doc-panel{background:#fff;border-left:1px solid #cbdeda;padding:18px;overflow-y:auto}.doc-panel>span{font-size:8px;color:#078a80;font-weight:800;letter-spacing:1.2px}.doc-panel h2{font-size:20px;margin:6px 0 14px}.doc-panel label{display:block;font-size:8px;font-weight:700;margin:10px 0 5px}.doc-panel .field{min-height:32px;padding:9px;border-radius:7px;font-size:8px}.doc-panel .field.area{min-height:58px}.template-box{margin-top:12px;border:1px solid #cbdeda;border-radius:10px;padding:10px}

@media(max-width:1000px){.super-main-grid,.super-bottom-grid,.am-overview{grid-template-columns:1fr}.super .kpis,.am .kpis{grid-template-columns:repeat(2,1fr)}.mediscope .med-actions{display:none}.mediscope .logo-row{min-width:220px}.exact-med{grid-template-columns:220px 1fr}.doc-panel{display:none}}
@media(max-width:700px){.super .sidebar,.am .sidebar{position:sticky;display:block;width:100%;height:auto}.super .logo-row,.am .logo-row,.super .role-preview,.am .workspace,.am .protected,.super .user,.am .user,.outside{display:none}.super .nav,.am .nav{display:flex;overflow-x:auto;padding:8px}.super .nav-section{display:none}.super .nav button,.am .nav button{width:auto;min-width:max-content}.super .main,.am .main{margin-left:0;width:100%}.super .content,.am .content{padding:14px}.super .kpis,.am .kpis{grid-template-columns:1fr 1fr}.super-main-grid,.super-bottom-grid,.am-overview{grid-template-columns:1fr}.mediscope .med-header{height:auto;position:sticky;display:block;padding:7px}.mediscope .logo-row{display:flex;min-width:0}.mediscope .med-header>.nav{margin:5px 0 0;overflow-x:auto}.mediscope .main{padding-top:0}.mediscope .notice{position:static;transform:none;width:auto;max-width:none}.exact-med{grid-template-columns:1fr}.patient-rail{max-height:310px}.med-center{padding:10px}.patient-form{grid-template-columns:1fr 1fr}.patient-form span:nth-child(n),.patient-form button,.patient-form button.muted{grid-column:auto}.mediscope .camera{min-height:420px}.doc-panel{display:block}.demo-banner{top:8px;right:8px}}

/* The demo badge already labels this as dummy data; keep the capture workspace unobstructed. */
.mediscope .notice{display:none!important}

/* A stable desktop canvas for the marketing preview; standalone demos remain responsive. */
body.is-preview{overflow:hidden!important;pointer-events:none}
body.is-preview .demo-banner{display:none}
body.is-preview .sidebar{overflow:hidden}
body.is-embedded .demo-banner{display:none}
body.is-embedded{overflow-x:hidden}
.mediscope #demo-content>.heading{display:flex}
.mediscope.capture-view #demo-content>.heading{display:none}
.mediscope:not(.capture-view) .content{padding:32px;max-width:1440px;margin:auto}
.mediscope:not(.capture-view) .heading p{font-size:14px;line-height:1.6}
.mediscope:not(.capture-view) .demo-tile p,.mediscope:not(.capture-view) .integration-note p{font-size:14px;line-height:1.7}
.mediscope:not(.capture-view) .demo-tile b{font-size:18px}
@media(min-width:621px) and (max-width:700px){.app{display:block}.super .sidebar,.am .sidebar{position:relative;inset:auto}.super .main,.am .main{width:100%;margin-left:0}}
@media(max-width:700px){.super .sidebar,.am .sidebar{max-width:100vw}.super .nav,.am .nav{width:100%;max-width:100vw}.super .nav button,.am .nav button{flex-shrink:0}.super .main,.am .main{min-width:0}.mediscope .camera-tools button{min-width:0;flex:1}.attention-strip{flex-wrap:wrap}.mediscope .exact-med{min-width:0}.mediscope .patient-form{min-width:0}}
