/* Autoridad de marca: lámina entregada por Daniel, sección 11, 2026-10-14.
   Los cinco códigos base son exactos. Los tonos de interfaz son derivados. */
:root{
  --kindomy-coral:#E28A6C;
  --kindomy-turquesa:#58AFAF;
  --kindomy-amarillo:#EBBE3D;
  --kindomy-rosa:#EAB0A4;
  --kindomy-lavanda:#B2A7CD;
  --ink:#253C43;
  --green:#28676B;
  --muted:#5F6E75;
  --cream:#FCFAF5;
  --paper:#FFFDFA;
  --line:#E9E2DA;
  --orange:#96533E;
  --peach:#FBE9E2;
  --mint:#E7F3F2;
  --lilac:#EEEAF5;
  --yellow:#FCF4D5;
  --pink:#FBECE8;
  --blue:#E5F0F4;
}
.brand{display:block;width:157px;line-height:0;font-size:0;flex-shrink:0}
.brand img{display:block;width:100%;height:auto}
.primary,.family-hero .warm,.recommended .warm{background:var(--kindomy-turquesa);color:var(--ink)}
.primary:hover,.family-hero .warm:hover,.recommended .warm:hover{background:#82C3C1}
.warm{background:var(--kindomy-amarillo);color:var(--ink)}
.warm:hover{background:#F3CF6C}
.secondary{border-color:#B7CDCE}
.secondary:hover,.round-button:hover,.icon-button:hover{background:var(--mint)}
.demo-ribbon{background:var(--pink);color:#53626A}
.status-dot{background:var(--green)}
.family-hero{background:var(--mint);color:var(--ink)}
.family-hero .badge{background:var(--paper);color:var(--green)}
.family-hero p{color:var(--muted)}
.family-art{background:#D5E8E5}
.side-nav a{color:#5F6E75}
.side-nav a.active{background:var(--mint);color:var(--green);box-shadow:inset 3px 0 var(--kindomy-turquesa)}
.sidebar-garden{background:var(--peach)}
.sidebar-label{color:#62717A}
.sidebar-bottom{border-color:var(--line)}
.recommended{background:var(--lilac);color:var(--ink);border-color:#D4CBE4}
.recommended p,.recommended .price-caption,.recommended .quiet{color:var(--muted)}
.recommended ul{border-color:#D5CDE1}
.recommend-label{background:var(--kindomy-amarillo);color:var(--ink)}
.plan-pending,.soft-panel{background:#F8F0E6}
.track-category,.track-copy p,.catalog-note{color:#5F6E75}
.track-card.selected{background:var(--mint);border-color:var(--green)}
.selected .select-track,.name-field .round-button{background:var(--kindomy-turquesa);color:var(--ink)}
.track-card .favorite{color:#62717A}
.track-card .favorite.is-favorite{color:var(--orange)}
.is-favorite .icon{fill:var(--kindomy-rosa)}
.cover-badge{color:#53626A}
.empty-art{color:var(--green)}
.state-panel{background:#F3F8F6;border-color:#A6C5C6}
.how-steps li>span{background:var(--peach);color:var(--orange)}
.hello-sun{color:#997722}
.care-note{background:var(--yellow)}
.care-note p,.care-note .icon{color:#705A32}
.record-box{background:var(--mint)}
.record-box textarea{border-color:#B7CDCE}
.player-shell{background:var(--mint);color:var(--ink);border-color:#B8D3D1;box-shadow:0 10px 30px #2B63661A}
.player-title{color:var(--ink)}
.player-status,.player-timeline small,.continuous{color:#53626A}
.player-control-area .icon-button{color:var(--green)}
.player-thumb{background:var(--paper)}
.player-play{background:var(--kindomy-turquesa);color:var(--ink)}
.player-timeline input,.continuous input{accent-color:var(--green)}
.player-idle-link{color:var(--green)}
.badge{background:var(--mint);color:var(--green)}
.order-mark{background:var(--lilac)}
.round-button{border-color:#B7CDCE}
.fine-print,.footer-copy p,.footer-links,.price-caption,.order-card div>span{color:#5F6E75}
.form-row input,.form-row select{border-color:#BCCCCC}
.chips button{border-color:#D4DEDD;color:#53626A}
.chips button[aria-pressed=true]{background:var(--kindomy-turquesa);border-color:var(--green);color:var(--ink);font-weight:600}
.language-control button{color:#53626A}
.language-control button[aria-pressed=true]{background:var(--lilac);color:#4E4662}
.track-card.selected .select-track{border-color:var(--green)}
.profile-avatar{background:var(--pink)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:#28676B}
@media(max-width:700px){.brand{width:140px}.private .brand{margin-right:auto}.header-inner>.btn{margin-left:auto}}
@media(max-width:370px){.brand{width:120px}}
