@import url('./palette.css');
/* Shared OPERO frame. Screenshot and embedded previews show only the demo. */
html.opero-demo-shell {--opero-return-height:calc(48px + env(safe-area-inset-top,0px));scroll-padding-top:calc(var(--opero-return-height) + 88px)}
html.opero-demo-shell[data-opero-preview="true"] {--opero-return-height:0px}
html.opero-demo-shell body {box-sizing:border-box;padding-top:var(--opero-return-height)}
body .opero-return-original {display:none !important}
.opero-demo-return-bar {position:fixed;inset:0 0 auto;z-index:2147483646;height:var(--opero-return-height);box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);background:var(--opero-accent);color:var(--opero-ink);box-shadow:0 1px 0 rgb(24 24 27 / .12)}
.opero-demo-return-bar a[data-opero-return] {display:flex;align-items:center;gap:12px;width:100%;height:100%;box-sizing:border-box;padding:0 max(24px,env(safe-area-inset-right)) 0 max(24px,env(safe-area-inset-left));border:0;border-radius:0;background:var(--opero-accent);color:var(--opero-ink);font:700 14px/1.3 Arial,Helvetica,sans-serif;letter-spacing:0;text-transform:none;text-decoration:none;white-space:nowrap;-webkit-tap-highlight-color:transparent;transition:background-color .16s,color .16s}
.opero-demo-return-bar a[data-opero-return]:hover {background:var(--opero-action-hover);color:white}
.opero-demo-return-bar a[data-opero-return]:focus-visible {outline:3px solid var(--opero-ink);outline-offset:-5px}
.opero-demo-return-bar a>span:first-child {font-size:23px;font-weight:400;line-height:1}
.opero-demo-return-note {margin-left:auto;font-size:12px;font-weight:400}
/* Keep each demo's navigation and full-screen stage below the shared bar. */
body[data-opero-demo="demo-fronda"]>.header,
body[data-opero-demo="demo-soglia"]>.header,
body[data-opero-demo="demo-giardino-immersivo"]>.header,
body[data-opero-demo="demo-onda"]>.onda-header {top:var(--opero-return-height)}
body[data-opero-demo="demo-soglia"] .viewport {top:var(--opero-return-height)}
body[data-opero-demo="demo-giardino-immersivo"] .stage {top:var(--opero-return-height);height:calc(100svh - var(--opero-return-height))}
body[data-opero-demo="demo-giardino-immersivo"] .mobile-nav:not([hidden]) {top:calc(78px + var(--opero-return-height))}
body[data-opero-demo="demo-brasa"] .brasa-stage {top:var(--opero-return-height);height:calc(100svh - var(--opero-return-height))}
body[data-opero-demo="demo-tondo"] .pizza-side {top:calc(26px + var(--opero-return-height))}
body[data-opero-demo="demo-tondo"] .mobile-preview {top:var(--opero-return-height)}
body[data-opero-demo="app-forma"] .product-workspace .stage {top:calc(20px + var(--opero-return-height))}
/* Native-style app frames retain their complete content and bottom navigation. */
html.opero-demo-shell body[data-opero-demo="app-tondo"] {padding-top:calc(24px + var(--opero-return-height))}
body[data-opero-demo="app-tondo"] .app-shell {height:min(900px,calc(100dvh - var(--opero-return-height) - 48px));min-height:0}
body[data-opero-demo="app-aura"] .device {height:min(900px,calc(100dvh - var(--opero-return-height) - 32px))}
body[data-opero-demo="app-aura"] .app-header {grid-template-columns:58px 1fr 58px}
body[data-opero-demo="app-riva"] .app-shell {height:min(900px,calc(100dvh - var(--opero-return-height)));margin-top:max(0px,calc((100dvh - var(--opero-return-height) - min(900px,100dvh - var(--opero-return-height)))/2))}
@media(max-width:760px) {
  .opero-demo-return-note {display:none}
  .opero-demo-return-bar a[data-opero-return] {padding-inline:max(18px,env(safe-area-inset-left))}
  html.opero-demo-shell body[data-opero-demo="app-tondo"] {padding-top:var(--opero-return-height)}
  body[data-opero-demo="app-tondo"] .app-shell {height:calc(100dvh - var(--opero-return-height))}
  body[data-opero-demo="app-forma"] .product-workspace .stage {top:var(--opero-return-height)}
}
@media(max-width:600px),(max-height:600px) {
  body[data-opero-demo="app-aura"] .device {height:calc(100dvh - var(--opero-return-height))}
}
@media(prefers-reduced-motion:reduce) {.opero-demo-return-bar a[data-opero-return] {transition:none}}
