/* Letras Bonitas — estilos del generador */
.lbg-wrap { max-width: 860px; margin: 0 auto; font-size: 1rem; line-height: 1.55; }
.lbg-label { display: block; font-weight: 700; margin: 0 0 .4rem; color: #1f2430; }
.lbg-input {
    width: 100%; min-height: 84px; padding: .8rem 1rem;
    border: 2px solid #d9d4ea; border-radius: 12px;
    font-size: 1.05rem; font-family: inherit; color: #1f2430;
    background: #fff; resize: vertical;
}
.lbg-input:focus { outline: 3px solid #7c3aed; outline-offset: 2px; border-color: #7c3aed; }
.lbg-meta { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; margin: .5rem 0 1rem; }
.lbg-count { font-weight: 600; color: #4b4356; }
.lbg-count-note { color: #6b6478; }
.lbg-btn {
    display: inline-block; padding: .55rem 1.1rem; border: 0; border-radius: 999px;
    background: #7c3aed; color: #fff; font-weight: 700; cursor: pointer; font-size: .95rem;
}
.lbg-btn:hover { background: #6d28d9; }
.lbg-btn:focus-visible { outline: 3px solid #7c3aed; outline-offset: 2px; }
.lbg-btn-ghost { background: #efeafb; color: #5b21b6; }
.lbg-btn-ghost:hover { background: #e2d8f8; }
.lbg-btn-small { padding: .35rem .8rem; font-size: .85rem; }
.lbg-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; }
.lbg-chip {
    padding: .45rem 1rem; border-radius: 999px; border: 2px solid #d9d4ea;
    background: #fff; color: #4b4356; font-weight: 600; cursor: pointer; font-size: .9rem;
}
.lbg-chip:hover { border-color: #7c3aed; color: #5b21b6; }
.lbg-chip.is-active { background: #7c3aed; border-color: #7c3aed; color: #fff; }
.lbg-chip:focus-visible { outline: 3px solid #7c3aed; outline-offset: 2px; }
.lbg-deco { display: flex; align-items: center; gap: .6rem; margin: 0 0 1.25rem; flex-wrap: wrap; }
.lbg-deco-label { font-weight: 600; color: #4b4356; }
.lbg-deco-sel {
    padding: .45rem .8rem; border: 2px solid #d9d4ea; border-radius: 10px;
    font-size: .95rem; font-family: inherit; background: #fff; color: #1f2430;
}
.lbg-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.lbg-results { display: grid; gap: .9rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .lbg-results { grid-template-columns: 1fr 1fr; } }
.lbg-empty { color: #6b6478; background: #f6f3fd; border: 2px dashed #d9d4ea; border-radius: 12px; padding: 1.25rem; text-align: center; }
.lbg-card {
    background: #fff; border: 2px solid #e9e4f5; border-radius: 14px;
    padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: .6rem;
}
.lbg-card-head { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.lbg-card-name { font-weight: 700; color: #5b21b6; }
.lbg-fav { background: none; border: 0; cursor: pointer; font-size: .85rem; color: #8a8199; padding: .25rem; }
.lbg-fav:hover { color: #7c3aed; }
.lbg-fav:focus-visible { outline: 3px solid #7c3aed; outline-offset: 2px; border-radius: 6px; }
.lbg-card-prev {
    margin: 0; padding: .8rem; background: #faf8ff; border-radius: 10px;
    font-size: 1.15rem; line-height: 1.6; word-break: break-word; min-height: 3.2em; color: #1f2430;
}
.lbg-card-prev.is-ghost { color: #a79fb8; }
.lbg-card-row { display: flex; align-items: center; gap: .75rem; }
.lbg-ok { font-size: .85rem; font-weight: 700; color: #15803d; }
.lbg-card-note { color: #6b6478; font-size: .8rem; }
.lbg-favs { margin-top: 2rem; border-top: 2px solid #e9e4f5; padding-top: 1.25rem; }
.lbg-favs-title { font-size: 1.1rem; color: #1f2430; margin: 0 0 .75rem; }
.lbg-favs-list { display: grid; gap: .7rem; }
.lbg-favs-empty { color: #6b6478; }
.lbg-fav-item { background: #fff; border: 2px solid #e9e4f5; border-radius: 12px; padding: .8rem 1rem; }
.lbg-fav-text { margin: 0 0 .3rem; font-size: 1.05rem; word-break: break-word; color: #1f2430; }
.lbg-fav-meta { display: block; color: #8a8199; margin-bottom: .5rem; }
.lbg-favs-clear { margin-top: .75rem; }
.lbg-toolbar { display: flex; gap: .75rem; align-items: center; margin: 0 0 .75rem; flex-wrap: wrap; }
.lbg-search {
    flex: 1 1 220px; padding: .55rem 1rem; border: 2px solid #d9d4ea; border-radius: 999px;
    font-size: .95rem; font-family: inherit; color: #1f2430; background: #fff;
}
.lbg-search:focus { outline: 3px solid #7c3aed; outline-offset: 2px; border-color: #7c3aed; }
.lbg-total { font-weight: 700; color: #5b21b6; white-space: nowrap; }
.lbg-more-wrap { text-align: center; margin: 1.25rem 0; }
.lbr-flip { display: inline-flex; align-items: center; gap: .4rem; font-size: .9rem; color: #4b4356; cursor: pointer; }
.lbr-flip input { width: 1.1rem; height: 1.1rem; accent-color: #7c3aed; }
.lbs-group-title { font-size: 1.05rem; color: #1f2430; margin: 1.25rem 0 .5rem; }
.lbs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(52px, 1fr)); gap: .5rem; }
.lbs-btn {
    font-size: 1.5rem; line-height: 1; padding: .6rem 0; border: 2px solid #e9e4f5;
    border-radius: 10px; background: #fff; cursor: pointer; color: #1f2430;
}
.lbs-btn:hover { border-color: #7c3aed; background: #faf8ff; }
.lbs-btn:focus-visible { outline: 3px solid #7c3aed; outline-offset: 2px; }
.lbs-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
