/* Brand skin layered over the two repertory apps */
:root{--accent:#0E7C6E;--av-saffron:#F2A33A;--av-rose:#C2437E;--av-indigo:#4C5FD5;--av-forest:#0B5D45}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--accent:#5FD0B8}}
:root[data-theme="dark"]{--accent:#5FD0B8}
.av-bar{position:relative;z-index:6;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:8px max(16px,env(safe-area-inset-left,0px));background:linear-gradient(100deg,#0B5D45 0%,#0E8C7E 55%,#1F7FA8 100%);color:#fff;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:.88rem}
.av-bar::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:linear-gradient(90deg,#F2A33A 0 33%,#C2437E 33% 66%,#4C5FD5 66%)}
.av-bar a{color:#fff;text-decoration:none}
.av-bar-brand{display:flex;align-items:center;gap:8px;min-width:0}
.av-bar-brand img{background:#fff;border-radius:7px;padding:2px}
.av-bar-brand span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.av-bar nav{display:flex;gap:4px;align-items:center}
.av-bar nav a,.av-bar nav button{padding:5px 10px;border-radius:7px;border:0;background:transparent;color:#fff;cursor:pointer;font:inherit}
.av-bar nav a:hover,.av-bar nav button:hover{background:rgba(255,255,255,.16)}
.av-bar nav button{border:1px solid rgba(255,255,255,.5)}
.av-demo{background:#FFF4DE;color:#7A4A06;font:500 .82rem "IBM Plex Sans",system-ui,sans-serif;padding:6px 16px;text-align:center;border-bottom:1px solid #F2D9A8}
header.top{border-bottom:1px solid var(--line)}
.brand h1{background:linear-gradient(90deg,var(--av-forest),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .brand h1{background:none;color:var(--ink)}}
body{margin:0}