.brandos-demo{color:#222;background:#fafafa;min-height:100vh}.demo-bar{color:#fafafa;background:#222;justify-content:space-between;align-items:center;gap:24px;padding:18px 28px;display:flex}.demo-bar>a{color:#fafafa;align-items:center;gap:24px;font-size:13px;text-decoration:none;display:flex}.demo-bar .brand-logo{width:92px;height:auto}.demo-bar nav{align-items:center;gap:12px;font:12px PT Mono,monospace;display:flex}.demo-bar nav a{color:#fafafa;text-underline-offset:5px}.demo-bar nav a[aria-current]{color:#ff7373}.demo-label{color:#e3f2fd;font:12px PT Mono,monospace}.demo-notice{color:#596468;background:#e3f2fd;padding:14px 28px;font-size:13px;line-height:1.6}.demo-layout{grid-template-columns:230px minmax(0,1fr);max-width:1600px;margin:auto;display:grid}.demo-sidebar{border-right:1px solid #d2d9dd;padding:32px 20px;position:relative;overflow:hidden}.demo-projects{gap:10px;margin:20px 0 28px;display:grid}.demo-projects>button{color:#222;text-align:left;background:0 0;border:1px solid #c9d2d7;align-items:center;gap:12px;padding:12px;display:flex}.demo-projects>button[aria-pressed=true]{background:#e3f2fd;border-color:#596468}.demo-projects>button>span{color:#596468;font:12px PT Mono,monospace}.demo-sidebar nav{gap:6px;display:grid}.demo-sidebar nav button{color:#222;text-align:left;background:0 0;border:0;gap:12px;padding:13px 10px;display:flex}.demo-sidebar nav button[aria-current]{background:#e3f2fd}.demo-sidebar nav button[aria-current] .nav-mark{color:#d92121}.demo-sidebar-note{color:#596468;margin-top:32px;font-size:13px;line-height:1.6}.demo-sidebar>.japie{width:100px;height:auto;margin-top:60px;margin-left:-30px}.demo-main{min-width:0;padding:28px clamp(20px,4vw,56px)}.demo-crumbs{color:#596468;align-items:center;gap:12px;margin-bottom:36px;font-size:13px;display:flex}.demo-crumbs button{color:#222;text-underline-offset:4px;background:0 0;border:0;padding:0;text-decoration:underline}.demo-heading{margin-bottom:36px}.demo-heading h1{margin:12px 0;font-size:clamp(32px,4vw,50px)}.demo-heading>p{max-width:78ch;line-height:1.7}.demo-heading>.muted{margin-top:16px;font-size:13px}.demo-section-head{justify-content:space-between;align-items:end;gap:24px;margin:40px 0 24px;display:flex}.demo-section-head h2{margin:0;font-size:24px}.demo-section-head label{color:#596468;gap:8px;font-size:12px;display:grid}.demo-section-head input{width:250px;max-width:100%;font-size:16px}.demo-discipline-head{padding:24px}.demo-discipline-head h3{margin:16px 0;font-size:22px}.demo-discipline-head p{color:#596468;font-size:14px;line-height:1.6}.demo-sources{gap:12px;display:grid}.demo-sources button{text-align:left;color:#222;background:#fff;border:1px solid #d2d9dd;align-items:center;gap:20px;padding:20px;line-height:1.6;display:flex}.demo-sources button>span:nth-child(2){flex:1}.demo-review-summary{border-block:1px solid #c9d2d7;grid-template-columns:1fr 1fr;margin:24px 0;display:grid}.demo-review-summary>div{gap:8px;padding:24px;display:grid}.demo-review-summary strong{font:40px PT Mono,monospace}.demo-review-summary span{color:#596468;font-size:14px}.demo-review-links{flex-wrap:wrap;gap:12px;margin:24px 0;display:flex}.demo-main>.public-guide{margin:20px -20px}.demo-main .public-guide .guide-hero,.demo-main .public-guide .guide-section{min-height:auto;padding:40px}.demo-main .public-guide>header{padding:24px 40px}.demo-main .public-guide .guide-dock{bottom:16px}.demo-guide-note{color:#596468;font-size:13px;line-height:1.6}.demo-contact{border-top:1px solid #c9d2d7;margin-top:48px;padding:24px 0 80px;font-size:15px}.demo-contact a{color:#c62222;text-underline-offset:4px}.demo-source-body{line-height:1.8}.brandos-demo :is(button,a,input):focus-visible{outline-offset:4px;outline:2px solid #d92121}@media (width<=900px){.demo-layout{grid-template-columns:1fr}.demo-sidebar{border-bottom:1px solid #c9d2d7;border-right:0;padding:20px 24px}.demo-sidebar>.eyebrow,.demo-sidebar-note,.demo-sidebar>.japie{display:none}.demo-projects{margin:0 0 16px;display:flex}.demo-projects>button{flex:1}.demo-sidebar nav{flex-wrap:wrap;gap:6px;display:flex}.demo-sidebar nav button{padding:10px;font-size:13px}.demo-main{padding:24px}.demo-bar{flex-wrap:wrap;gap:16px;padding:16px 24px}.demo-bar>a{gap:16px}.demo-label{order:3;width:100%}.demo-notice{padding:14px 24px}.demo-main .brand-strip{grid-template-columns:1fr 1fr}.demo-section-head{display:block}.demo-section-head label{margin-top:20px}.demo-section-head input{width:100%}.demo-main .discipline-grid{grid-template-columns:1fr}.demo-crumbs{margin-bottom:24px}.demo-heading{margin-bottom:28px}.demo-main .highlight-card{min-width:0}.demo-main .public-guide .guide-section,.demo-main .public-guide .guide-hero{padding:32px 24px}.demo-main .public-guide>header{padding:24px}.demo-sources button{gap:12px;padding:16px}.demo-review-summary>div{padding:16px}.demo-review-summary strong{font-size:32px}}@media (prefers-reduced-motion:reduce){.brandos-demo *{scroll-behavior:auto!important}}