:root{--preview-h:36px}
body{padding-top:var(--preview-h)!important}
#hyle-preview-banner{position:fixed;inset:0 0 auto;z-index:2147483000;height:var(--preview-h);display:flex;align-items:center;justify-content:center;gap:20px;padding:4px 12px;box-sizing:border-box;background:#f4efe1;color:#242423;border-bottom:1px solid #d8d0bd;font:12px/1.3 Inter,system-ui,sans-serif}
#hyle-preview-banner a{color:inherit;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
body .app{min-height:calc(100dvh - var(--preview-h))}
body .app-side{top:var(--preview-h);height:calc(100dvh - var(--preview-h))}
body .app-top,body .public-nav,body .nav,body .pnav,body .sys-top{top:var(--preview-h)}
body .pmenu{top:var(--preview-h)}
body .l-specimen .spec-rail{top:var(--preview-h);height:calc(100dvh - var(--preview-h));max-height:calc(100dvh - var(--preview-h))}
html{scroll-padding-top:calc(var(--preview-h) + 70px)}
.hyle-launch-dialog{border:1px solid #d8d0bd;border-radius:16px;padding:24px;max-width:min(420px,calc(100vw - 32px));background:#faf9f5;color:#242423;box-shadow:0 20px 60px #0003;font:16px/1.5 Inter,system-ui,sans-serif}
.hyle-launch-dialog::backdrop{background:#17171755}.hyle-launch-dialog h2{font-size:20px;margin:0 0 12px}.hyle-launch-dialog button{margin-top:18px;padding:8px 18px;border:1px solid #d8d0bd;border-radius:8px;cursor:pointer}
@media(max-width:640px){:root{--preview-h:58px}#hyle-preview-banner{gap:6px 18px;flex-wrap:wrap;padding:6px 12px}#hyle-preview-banner span{flex-basis:100%;text-align:center}}
@media(max-width:960px){body .l-specimen .spec-rail{height:auto;max-height:none}}