:root{--demo-height:42px}
body{padding-top:var(--demo-height)}
.demo-toolbar{position:fixed;inset:0 0 auto;height:var(--demo-height);z-index:1500;background:#142c3e;color:#e9f1f6;display:flex;align-items:center;gap:12px;padding:0 22px;font:12px 'Manrope',sans-serif;box-shadow:0 1px 0 #ffffff20}
.demo-pill{color:#14362b;background:#a5e4c4;border-radius:5px;padding:3px 8px;font-size:10px;font-weight:800;letter-spacing:1px}
.demo-toolbar-actions{margin-left:auto;display:flex;gap:8px;flex-shrink:0}
.demo-toolbar button{background:transparent;color:#fff;border:1px solid #ffffff38;border-radius:5px;padding:5px 10px;font:inherit;cursor:pointer}
.demo-toolbar button:hover{background:#ffffff18}.demo-toolbar button:focus-visible{outline:2px solid #a5e4c4;outline-offset:2px}
#sidebar{top:var(--demo-height);height:calc(100vh - var(--demo-height))}
#app{min-height:calc(100vh - var(--demo-height))}
#main{min-width:0}
.demo-guide-links{display:grid;gap:8px;margin:20px 0}.demo-guide-links a{display:grid;gap:4px;border:1px solid var(--border-color,#dce3ea);padding:14px;border-radius:8px;color:inherit;text-decoration:none}.demo-guide-links a:hover{background:var(--bg-hover,#edf5f7)}.demo-guide-links span{font-size:13px;color:var(--text-secondary,#64748b)}
.demo-exchange-actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.demo-exchange-note{padding:16px;border-left:3px solid #36a77d;background:var(--bg-secondary,#f4f8f7);margin-bottom:20px}
#login-form .login-submit{width:auto;padding:12px 24px;font-size:15px}
@media(max-width:768px){.demo-caption{display:none}.demo-toolbar{padding:0 12px;gap:6px}.demo-toolbar button{font-size:11px}.demo-toolbar-actions{gap:5px}#content{overflow-x:auto}.page-header{flex-wrap:wrap}.document-toolbar{flex-wrap:wrap}#main{width:100%;margin-left:0}.dash-grid .card{overflow-x:auto;min-width:0}#sidebar:not(.open){transform:translateX(-100%)}.modal-overlay{padding-top:calc(var(--demo-height) + 12px)}}
@media print{.demo-toolbar,#sidebar,.header{display:none!important}body{padding:0}#content{margin:0}}

/* Полное название помещается рядом с кнопкой сворачивания меню. */
.sidebar-logo { font-size: 1rem; white-space: nowrap; }
