.gastroDeviceSwitcher{display:none}.gastroDeviceSwitcher button{appearance:none;-webkit-appearance:none;width:38px;height:38px;min-width:38px;padding:0;border:1px solid rgba(148,163,184,.24);border-radius:999px;background:rgba(15,23,42,.62);color:rgba(226,232,240,.68);box-shadow:0 10px 26px rgba(0,0,0,.24);font-size:17px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:transform .15s ease,border-color .15s ease,background .15s ease,color .15s ease,box-shadow .15s ease}.gastroDeviceSwitcher button svg{width:19px;height:19px;display:block;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.gastroDeviceSwitcher button:hover{transform:translateY(-1px);border-color:rgba(249,115,22,.42);color:#fff}.gastroDeviceSwitcher button.active{border-color:rgba(249,115,22,.72);background:rgba(249,115,22,.18);color:#fff;box-shadow:0 10px 28px rgba(249,115,22,.18),inset 0 0 0 1px rgba(255,255,255,.05)}.gastroDeviceSwitcher button:focus-visible{outline:3px solid rgba(249,115,22,.24);outline-offset:3px}.deviceViewportMount{position:relative;display:block;min-width:0;min-height:0}:root[data-theme="light"] .gastroDeviceSwitcher button{background:rgba(255,255,255,.82);color:#64748b;border-color:rgba(148,163,184,.34)}:root[data-theme="light"] .gastroDeviceSwitcher button.active{background:rgba(249,115,22,.14);color:#c2410c;border-color:rgba(249,115,22,.48)}

.deviceScreen>.inlinePanelHost{position:absolute!important;inset:0!important;z-index:24!important;width:100%!important;height:100%!important;min-height:0!important;background:var(--bg,#05070b)!important;overflow:hidden!important}.deviceScreen>.inlinePanelHost iframe{display:block!important;width:100%!important;height:100%!important;min-height:0!important;border:0!important}

@media(min-width:761px){
  .deviceStage{grid-template-rows:auto minmax(0,1fr);align-content:center;gap:10px;padding:14px 24px 26px}
  .gastroDeviceSwitcher{position:relative;z-index:80;display:flex;align-items:center;justify-content:center;gap:7px;height:40px;align-self:end}
  :root[data-device-mode="phone"] .deviceViewportMount{width:390px;height:min(820px,calc(100vh - 92px))}
  :root[data-device-mode="phone"] .deviceFrame{width:390px;height:100%}

  :root[data-device-mode="laptop"] .deviceStage{gap:7px;padding:8px 12px 12px}
  :root[data-device-mode="laptop"] .deviceFrame,
  :root[data-device-mode="laptop"] .deviceFrame.landscape{
    position:absolute;left:0;top:0;
    width:1920px;height:1200px;min-width:1920px;min-height:1200px;max-width:none;max-height:none;aspect-ratio:auto;
    border-radius:24px;padding:10px 10px 18px;transform-origin:top left;
    background:linear-gradient(145deg,#334155 0%,#090d14 12%,#111827 74%,#475569 100%);
    box-shadow:0 48px 120px rgba(0,0,0,.62),0 20px 50px rgba(0,0,0,.42),inset 0 0 0 2px rgba(255,255,255,.13),inset 0 0 0 6px rgba(0,0,0,.36)
  }
  :root[data-device-mode="laptop"] .deviceFrame:before,
  :root[data-device-mode="laptop"] .deviceFrame.landscape:before{display:block;content:"";position:absolute;inset:7px 7px 15px;border:1px solid rgba(255,255,255,.12);border-radius:17px;pointer-events:none}
  :root[data-device-mode="laptop"] .deviceFrame:after,
  :root[data-device-mode="laptop"] .deviceFrame.landscape:after{display:block;content:"";position:absolute;left:50%;right:auto;top:auto;bottom:-13px;transform:translateX(-50%);width:min(46%,760px);height:14px;border-radius:0 0 18px 18px;background:linear-gradient(180deg,#64748b,#1e293b 46%,#0f172a);box-shadow:0 12px 24px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.20)}
  :root[data-device-mode="laptop"] .deviceIsland{display:none}
  :root[data-device-mode="laptop"] .deviceScreen,
  :root[data-device-mode="laptop"] .deviceFrame.landscape .deviceScreen{border-radius:14px;border:1px solid rgba(255,255,255,.12)}
  :root[data-device-mode="laptop"] .deviceScreen:before{border-radius:inherit}

  :root[data-device-mode="laptop"]:not([data-device-embedded="true"]) .shell,
  :root[data-device-mode="laptop"]:not([data-device-embedded="true"]) .deviceFrame.landscape .shell{padding:18px 24px 16px;overflow-y:auto}
  :root[data-device-mode="laptop"]:not([data-device-embedded="true"]) .topbar{min-height:58px;padding:8px 12px;margin-bottom:10px;border-radius:18px}
  :root[data-device-mode="laptop"]:not([data-device-embedded="true"]) .brandLogo{width:38px;height:38px}
  :root[data-device-mode="laptop"]:not([data-device-embedded="true"]) .brand h1{font-size:22px}
  :root[data-device-mode="laptop"]:has(#dashboard) #loginScreen{width:min(560px,100%);margin:80px auto 0}
  :root[data-device-mode="laptop"]:has(#dashboard) #dashboard .panelGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
  :root[data-device-mode="laptop"]:has(#dashboard) #dashboard .panelCard{min-height:132px}
  :root[data-device-mode="laptop"]:has(#dashboard) #dashboard .hero{margin-bottom:10px}
  :root[data-device-mode="laptop"]:has(#dashboard) #dashboard .hero h2{font-size:25px}

  :root[data-device-embedded="true"] .deviceStage{display:block;width:100%;height:100%;min-height:0;padding:0;overflow:hidden}
  :root[data-device-embedded="true"] .gastroDeviceSwitcher{display:none!important}
  :root[data-device-embedded="true"] .deviceViewportMount{width:100%!important;height:100%!important}
  :root[data-device-embedded="true"] .deviceFrame,
  :root[data-device-embedded="true"] .deviceFrame.landscape{
    position:relative!important;inset:auto!important;transform:none!important;width:100%!important;height:100%!important;min-height:0!important;min-width:0!important;max-width:none!important;max-height:none!important;aspect-ratio:auto!important;border-radius:0!important;padding:0!important;background:transparent!important;box-shadow:none!important
  }
  :root[data-device-embedded="true"] .deviceFrame:before,
  :root[data-device-embedded="true"] .deviceFrame:after,
  :root[data-device-embedded="true"] .deviceIsland{display:none!important}
  :root[data-device-embedded="true"] .deviceScreen,
  :root[data-device-embedded="true"] .deviceFrame.landscape .deviceScreen{width:100%!important;height:100%!important;min-height:0!important;border:0!important;border-radius:0!important}
  :root[data-device-embedded="true"] .deviceScreen:before{display:none!important}
}

@media(max-width:1280px) and (min-width:761px){
  :root[data-device-mode="laptop"]:has(#dashboard) #dashboard .panelGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media(max-width:960px) and (min-width:761px){
  :root[data-device-mode="laptop"]:has(#dashboard) #dashboard .panelGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  .gastroDeviceSwitcher{display:none!important}
  .deviceViewportMount{width:100%!important;height:100%!important}
  .deviceScreen>.inlinePanelHost{position:absolute!important;inset:0!important}
}
