/* MCL – Building Blocks & Balloons */
.mcl-bbt { --bg:#fff; --fg:#222; --accent:#0a62a5; --muted:#f5f7fb; --brand:#0a62a5; --brand-2:#ffd166; --font: Aptos, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; font-family: var(--font); color: var(--fg); }
.mcl-bbt * { box-sizing: border-box; }
.mcl-bbt__header { border-bottom: 2px solid var(--muted); padding: 1rem 0; margin-bottom: 1rem; display:flex; align-items:center; gap:1rem; }
.mcl-bbt__brand { font-size: .9rem; color:#666; display:flex; align-items:center; gap:.5rem; }
.mcl-bbt__logo { max-height: 40px; width: auto; display:block; }
.mcl-bbt__title { margin: .25rem 0; font-size: 1.6rem; }
.mcl-bbt__tagline { margin: 0; color:#555; }
.mcl-bbt__app { background: var(--bg); border: 1px solid #e5e7eb; border-radius: 8px; padding: .75rem; }
.mcl-bbt__toolbar { display: flex; flex-wrap: wrap; gap: .5rem .75rem; align-items: center; position: sticky; top: 0; background: #fff; padding: .5rem; border: 1px solid #e5e7eb; border-radius: 6px; z-index: 5; }
.mcl-bbt__toolbar label { display: inline-flex; align-items: center; gap: .4rem; font-size: .95rem; }
.mcl-bbt__btn { background: var(--accent); color: #fff; border: 0; padding: .45rem .7rem; border-radius: 6px; cursor: pointer; }
.mcl-bbt__btn:hover { filter: brightness(1.05); }
.mcl-bbt__spacer { flex: 1 1 auto; }
.mcl-bbt__note { margin: .5rem 0 0 0; font-size: .9rem; color:#666; }
.mcl-bbt__canvas { min-height: 420px; background: #fff; border: 1px dashed #cdd6e1; border-radius: 6px; margin-top: .75rem; padding: 1rem; display: grid; gap: .75rem; }
.mcl-bbt__item { display: grid; grid-template-columns: 1fr auto; gap: .5rem; align-items: start; padding: .75rem; border: 1px solid #cdd6e1; border-radius: 8px; background: var(--muted); }
.mcl-bbt__item-title { font-weight: 600; margin: 0; }
.mcl-bbt__item-balloon { justify-self: start; background: var(--brand-2); color:#402a00; border-radius: 999px; padding: .35rem .7rem; font-size: .9rem; }
.mcl-bbt__item-controls { display: flex; gap: .35rem; justify-self: end; }
.mcl-bbt__iconbtn { border: 1px solid #cdd6e1; background: #fff; border-radius: 6px; padding: .25rem .45rem; cursor: pointer; }
.mcl-bbt__iconbtn:hover { background:#f0f5fb; }
@media print { .mcl-bbt__toolbar, .mcl-bbt__note { display: none !important; } .mcl-bbt__canvas { border: 0; } }