.mwb-demo{background:var(--jos-cream);border:1px solid var(--jos-stone-2);width:100%;max-width:640px;box-shadow:var(--jos-shadow-lg);font-family:var(--jos-font-sans);border-radius:10px;overflow:hidden}.mwb-demo--tablet{max-width:520px}.mwb-demo--mobile{max-width:360px}.mwb-demo--fluid{border-radius:clamp(10px,.9vw,18px);width:100%;max-width:none}.mwb-demo--fluid .mwb-topbar{padding:clamp(10px,1.1vw,18px) clamp(14px,1.6vw,28px)}.mwb-demo--fluid .mwb-brand{font-size:clamp(13px,1.2vw,19px)}.mwb-demo--fluid .mwb-brand img{width:clamp(22px,1.9vw,30px);height:auto}.mwb-demo--fluid .mwb-pill{font-size:clamp(9px,.75vw,12px)}.mwb-demo--fluid .mwb-avatar{width:clamp(26px,2.2vw,36px);height:clamp(26px,2.2vw,36px);font-size:clamp(10px,.9vw,14px)}.mwb-demo--fluid .mwb-frame{min-height:clamp(280px,34vw,560px)}.mwb-demo--fluid .mwb-side{width:clamp(148px,15vw,240px);padding:clamp(10px,1vw,16px) clamp(8px,.8vw,14px)}.mwb-demo--fluid .mwb-nav-item{gap:clamp(8px,.8vw,12px);padding:clamp(7px,.7vw,11px) clamp(8px,.8vw,14px);font-size:clamp(11.5px,1vw,15px)}.mwb-demo--fluid .mwb-nav-item .count{font-size:clamp(9px,.7vw,12px)}.mwb-demo--fluid .mwb-tabs{padding:clamp(8px,.9vw,14px) clamp(12px,1.4vw,24px) 0}.mwb-demo--fluid .mwb-tab{padding:clamp(6px,.7vw,11px) clamp(10px,1.1vw,18px);font-size:clamp(11px,.95vw,14px)}.mwb-demo--fluid .mwb-note{padding:clamp(16px,1.8vw,34px) clamp(16px,2vw,40px) clamp(20px,2.2vw,40px)}.mwb-demo--fluid .mwb-cap{font-size:clamp(9px,.78vw,12px)}.mwb-demo--fluid .mwb-note-title{font-family:var(--jos-font-serif);margin-bottom:clamp(12px,1.4vw,24px);font-size:clamp(22px,3vw,46px)}.mwb-demo--fluid .mwb-props{gap:clamp(6px,.7vw,12px) clamp(12px,1.4vw,28px);padding:clamp(10px,1.1vw,18px) clamp(12px,1.4vw,22px)}.mwb-demo--fluid .mwb-prop{font-size:clamp(10px,.85vw,13px)}.mwb-demo--fluid .mwb-prop span:last-child{font-size:clamp(10.5px,.9vw,14px)}.mwb-demo--fluid .mwb-metrics{gap:clamp(8px,1vw,16px);margin-bottom:clamp(12px,1.4vw,22px)}.mwb-demo--fluid .mwb-metric{padding:clamp(8px,1vw,16px) clamp(10px,1.1vw,18px)}.mwb-demo--fluid .mwb-metric .k{font-size:clamp(8.5px,.72vw,11px)}.mwb-demo--fluid .mwb-metric .v{font-size:clamp(13px,1.6vw,24px)}.mwb-demo--fluid .mwb-brief{font-size:clamp(11.5px,1.05vw,16px);line-height:1.6}.mwb-demo--fluid .mwb-margin{padding:clamp(8px,1vw,16px) clamp(10px,1.1vw,18px)}.mwb-demo--fluid .mwb-margin p{font-size:clamp(10.5px,.95vw,14px)}.mwb-demo--fluid .mwb-right{width:clamp(132px,14vw,220px);padding:clamp(12px,1.2vw,20px) clamp(10px,1vw,16px)}.mwb-demo--fluid .mwb-right-cap{font-size:clamp(8.5px,.72vw,11px)}.mwb-demo--fluid .mwb-backlink-src{font-size:clamp(10px,.85vw,13px)}.mwb-demo--fluid .mwb-backlink-snip{font-size:clamp(9.5px,.8vw,12px)}.mwb-demo--fluid .mwb-status{padding:clamp(6px,.7vw,12px) clamp(12px,1.4vw,24px);font-size:clamp(9px,.75vw,12px)}.mwb-topbar{background:var(--jos-charcoal);color:var(--jos-cream);justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;display:flex}.mwb-brand{font-family:var(--jos-font-display);letter-spacing:-.01em;align-items:center;gap:8px;font-size:13px;font-weight:700;display:flex}.mwb-topbar-right{align-items:center;gap:10px;display:flex}.mwb-entity{background:color-mix(in oklab, var(--jos-cream) 12%, transparent);border:1px solid color-mix(in oklab, var(--jos-cream) 18%, transparent);color:var(--jos-cream);border-radius:7px;flex:none;align-items:center;gap:5px;padding:4px 9px;font-size:11.5px;font-weight:600;display:inline-flex}.mwb-entity svg{color:var(--jos-mist-3)}.mwb-search{background:color-mix(in oklab, var(--jos-cream) 8%, transparent);border:1px solid color-mix(in oklab, var(--jos-cream) 14%, transparent);min-width:0;color:var(--jos-mist-3);border-radius:8px;flex:1;align-items:center;gap:8px;margin:0 4px;padding:6px 10px;font-size:11.5px;display:flex}.mwb-search>span:first-of-type{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.mwb-search svg{flex:none}.mwb-kbd{font-family:var(--jos-font-mono);background:color-mix(in oklab, var(--jos-cream) 14%, transparent);color:var(--jos-mist-2,var(--jos-mist-3));border-radius:5px;flex:none;padding:2px 5px;font-size:9px}.mwb-pill{font-family:var(--jos-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--jos-mist-3);font-size:9px}.mwb-avatar{background:var(--jos-forest);width:26px;height:26px;color:var(--jos-cream);border-radius:50%;justify-content:center;align-items:center;font-size:10px;font-weight:600;display:flex}.mwb-mobile-head{background:var(--jos-charcoal);color:var(--jos-cream);justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.mwb-mobile-co{font-family:var(--jos-font-display);font-size:14px;font-weight:700}.mwb-frame{min-height:280px;display:flex}.mwb-side{border-right:1px solid var(--jos-stone);background:color-mix(in oklab, var(--jos-stone) 22%, var(--jos-cream));flex:none;width:148px;padding:10px 8px}.mwb-nav-item{color:var(--jos-ink-3);border-radius:8px;align-items:center;gap:8px;margin-bottom:2px;padding:7px 8px;font-size:11.5px;display:flex}.mwb-nav-item .ico{color:var(--jos-ink-mute);flex:none;display:flex}.mwb-nav-item.active{background:var(--jos-cream-2);color:var(--jos-ink);box-shadow:var(--jos-shadow-sm);font-weight:600}.mwb-nav-item.active .ico{color:var(--jos-forest)}.mwb-nav-item .count{font-family:var(--jos-font-mono);color:var(--jos-ink-mute);margin-left:auto;font-size:9px}.mwb-nav-item .count.hot{background:var(--rd-heat,#c45c26);color:var(--jos-cream);border-radius:6px;padding:0 4px;font-weight:700}.mwb-nav-item .count.ok{color:var(--jos-success);font-weight:600}.mwb-side-divider{background:var(--jos-stone-2);height:1px;margin:10px 4px}.mwb-main{background:var(--jos-cream);flex:1;min-width:0}.mwb-tabs{border-bottom:1px solid var(--jos-stone);padding:8px 12px 0}.mwb-tab{color:var(--jos-ink);border:1px solid var(--jos-stone);background:var(--jos-cream-2);border-bottom:0;border-radius:8px 8px 0 0;padding:6px 10px;font-size:11px;font-weight:600;display:inline-block}.mwb-note{padding:14px 16px 18px}.mwb-cap{font-family:var(--jos-font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--jos-ink-mute);margin-bottom:6px;font-size:9px}.mwb-note-title{font-family:var(--jos-font-serif);letter-spacing:-.015em;color:var(--jos-ink);margin:0 0 12px;font-size:24px;font-weight:500}.mwb-props{border:1px solid var(--jos-stone);background:var(--jos-cream-2);border-radius:8px;grid-template-columns:1fr 1fr;gap:6px 12px;margin-bottom:12px;padding:10px 12px;display:grid}.mwb-prop{flex-direction:column;gap:2px;font-size:10px;display:flex}.mwb-prop span:first-child{color:var(--jos-ink-mute)}.mwb-prop span:last-child{color:var(--jos-ink);font-size:10.5px;font-weight:600}.mwb-metrics{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;display:grid}.mwb-metric{border:1px solid var(--jos-stone);background:var(--jos-cream-2);border-radius:8px;padding:8px 10px}.mwb-metric .k{font-family:var(--jos-font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--jos-ink-mute);font-size:8.5px}.mwb-metric .v{color:var(--jos-ink);margin-top:4px;font-size:13px;font-weight:700}.mwb-brief{color:var(--jos-ink-2);margin:0 0 10px;font-size:11.5px;line-height:1.55}.mwb-brief b{color:var(--jos-ink);font-weight:600}.mwb-margin{border-left:2px solid var(--jos-copper);background:color-mix(in oklab, var(--jos-copper) 8%, var(--jos-cream));border-radius:0 6px 6px 0;padding:8px 10px}.mwb-margin-label{font-family:var(--jos-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--jos-copper);margin-bottom:4px;font-size:8.5px;display:block}.mwb-margin p{color:var(--jos-ink-2);margin:0;font-size:10.5px;line-height:1.45}.mwb-right{border-left:1px solid var(--jos-stone);background:color-mix(in oklab, var(--jos-stone) 18%, var(--jos-cream));flex:none;width:132px;padding:12px 10px}.mwb-right-cap{font-family:var(--jos-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--jos-ink-mute);margin-bottom:8px;font-size:8.5px}.mwb-backlink{border:1px solid var(--jos-stone);background:var(--jos-cream-2);border-radius:8px;margin-bottom:6px;padding:8px}.mwb-backlink-src{color:var(--jos-ink);align-items:center;gap:5px;margin-bottom:3px;font-size:10px;font-weight:600;display:flex}.mwb-backlink-snip{color:var(--jos-ink-3);font-size:9.5px;line-height:1.4}.mwb-status{border-top:1px solid var(--jos-stone);background:color-mix(in oklab, var(--jos-stone) 30%, var(--jos-cream));font-family:var(--jos-font-mono);letter-spacing:.05em;color:var(--jos-ink-mute);align-items:center;gap:12px;padding:6px 12px;font-size:9px;display:flex}.mwb-status span{align-items:center;gap:5px;display:flex}.mwb-status-right{margin-left:auto}.mwb-mobile-tabs{border-top:1px solid var(--jos-stone);background:var(--jos-cream-2);color:var(--jos-ink-mute);justify-content:space-around;padding:8px 4px 10px;font-size:9px;font-weight:600;display:flex}.mwb-mobile-tabs .active{color:var(--jos-forest)}.mwb-demo--tablet .mwb-side{width:56px}.mwb-demo--tablet .mwb-nav-item .lbl,.mwb-demo--tablet .mwb-nav-item .count,.mwb-demo--tablet .mwb-right,.mwb-demo--tablet .mwb-search{display:none}.mwb-demo--tablet .mwb-entity{margin-right:auto}.mwb-demo--mobile .mwb-frame{min-height:220px}.mwb-demo--mobile .mwb-metrics{grid-template-columns:1fr 1fr}.mwb-demo--mobile .mwb-metrics>:last-child{grid-column:span 2}
