const Logo = ({ size=36 }) => (
  <div style={{ display:'inline-flex', alignItems:'center', gap: 10 }}>
    <div style={{
      width: size, height: size, borderRadius: size*0.3,
      background: 'linear-gradient(135deg, var(--accent) 0%, #E8A84C 100%)',
      display:'grid', placeItems:'center', color:'#fff',
      boxShadow:'0 4px 14px rgba(224,93,60,.3), inset 0 1px 0 rgba(255,255,255,.3)'
    }}>
      <IconStar size={size*0.55} filled />
    </div>
    <div style={{ lineHeight: 1 }}>
      <div style={{ fontWeight: 700, fontSize: size*0.44, letterSpacing:'-.02em' }}>Behaviour Tracker</div>
      <div className="mono" style={{ fontSize: 10, color:'var(--fg-subtle)', letterSpacing:'.08em', marginTop: 4 }}>СЕМЕЙНЫЙ ТРЕКЕР · v1.0</div>
    </div>
  </div>
);

Object.assign(window, { Logo });