:root:has(.demo-ribbon){--demo-top-h:40px}.demo-top-space{height:var(--demo-top-h,0px)}.demo-ribbon{z-index:80;height:40px;padding-left:var(--gutter);background:repeating-linear-gradient(-45deg, var(--tone-2) 0 10px, var(--tone-2-on) 10px 20px);border-bottom:3px solid var(--accent-mark);font-family:var(--fb);white-space:nowrap;font-size:15px;line-height:1.2;display:flex;position:fixed;top:0;left:0;right:0;overflow:hidden}.demo-ribbon-plate{background:var(--c-ink);min-width:0;color:var(--c-on-ink);border-inline:3px solid var(--c-on-ink);align-items:center;gap:10px;margin:0;padding:0 16px;display:flex}.demo-ribbon-label{font-family:var(--fd);letter-spacing:.16em;text-transform:uppercase;flex:none;font-size:15px;font-weight:700}.demo-ribbon-dot,.demo-ribbon-line{color:var(--c-on-ink-muted)}.demo-ribbon-dot{flex:none}.demo-ribbon-line{text-overflow:ellipsis;min-width:0;overflow:hidden}.demo-ribbon-long{display:none}@container gapp (min-width:900px){.demo-ribbon{--gutter:40px}.demo-ribbon-long{display:inline}.demo-ribbon-short{display:none}}html:root .staff-app,html:root .portal-app{--mock-h:var(--demo-top-h,0px);--stick-top:var(--demo-top-h,0px)}html:root .ps{--stick-top:var(--demo-top-h,0px)}html:root .g-side,html:root .g-sticky,html:root .g-ne-side{top:calc(24px + var(--demo-top-h,0px))}@container gapp (min-width:900px){html:root .g-auth-panel{top:var(--demo-top-h,0px);height:calc(100vh - var(--demo-top-h,0px) - var(--demo-h,0px));height:calc(100dvh - var(--demo-top-h,0px) - var(--demo-h,0px))}}html:root .g-sheet{max-height:min(88vh, calc(100vh - var(--demo-top-h,0px) - var(--demo-h,0px) - 16px))}@container gapp (min-width:1000px){html:root .g-sheet{top:var(--demo-top-h,0px);max-height:none}}:root:has(.demo-bar){--demo-h:64px}.demo-space{height:var(--demo-h,0px)}.demo-bar{z-index:80;min-height:60px;padding:8px var(--gutter);padding-bottom:max(8px, env(safe-area-inset-bottom));background:var(--c-ink);color:var(--c-on-ink);border-top:3px solid var(--accent-mark);font-family:var(--fb);align-items:center;gap:10px 14px;font-size:15px;line-height:1.35;display:flex;position:fixed;bottom:0;left:0;right:0}@container gapp (min-width:700px){.demo-bar{--gutter:40px;gap:10px 18px}}.demo-chip{border-radius:var(--r);background:var(--c-on-ink);color:var(--c-ink);font-family:var(--fd);letter-spacing:.18em;text-transform:uppercase;flex:none;padding:5px 10px;font-size:14px;font-weight:600;line-height:1.3}.demo-line{overflow-wrap:anywhere;flex:1;min-width:0;margin:0}.demo-note{font-weight:600}.demo-fill{flex:none}.demo-bar :focus-visible{outline-color:currentColor}html:root .g-sheet,html:root .g-dock,html:root .g-savebar,html:root .portal-app .tabbar,html:root .ps .dock{bottom:var(--demo-h,0px)}html:root .staff-app .rail,html:root .portal-app .rail{height:calc(100vh - var(--mock-h,0px) - var(--demo-h,0px))}html:root .ps .ps-ask-launch{bottom:calc(var(--ps-ask-bottom) + var(--demo-h,0px))}html:root .ps .ps-ask-launch[data-dock=shown]{bottom:calc(var(--ps-ask-bottom-dock) + var(--demo-h,0px))}html:root .ps .ps-ask-invite{bottom:calc(var(--ps-ask-bottom) + 68px + var(--demo-h,0px))}html:root .ps .ps-ask-invite[data-dock=shown]{bottom:calc(var(--ps-ask-bottom-dock) + 68px + var(--demo-h,0px))}@media print{.demo-ribbon,.demo-top-space,.demo-bar,.demo-space{display:none}}
