/* Piccolo · Un pequeño mundo de celebraciones. Sin fuentes ni recursos externos. */
:root{
  --fiesta-ink:#25204f;--fiesta-purple:#6041b5;--fiesta-coral:#ee735b;
  --fiesta-sun:#ffcf56;--fiesta-mint:#d5f3e7;--fiesta-lilac:#e9e0ff;
  --green:#6041b5;--muted:#626079;--line:#e7e0f0;
  --piccolo-navy:#25204f;--piccolo-blue:#6041b5;--piccolo-ink:#25204f;
  --piccolo-cream:#fffcf4;--piccolo-yellow:#ffcf56;
  font-family:"Trebuchet MS","Segoe UI",sans-serif;color:var(--fiesta-ink);
}
html{background:#fffcf4}
body,body.piccolo-contributions{
  color:var(--fiesta-ink);font-family:"Trebuchet MS","Segoe UI",sans-serif;
  background:radial-gradient(circle at 4% 30%,#fae5cb 0 2px,transparent 3px) 0 0/62px 62px,
    radial-gradient(circle at 95% 20%,#e3d8f7 0 2px,transparent 3px) 12px 16px/78px 78px,#fffcf4;
}
h1,h2,h3,.hero h2,.calendar-heading h2{font-family:"Trebuchet MS","Segoe UI",sans-serif;color:var(--fiesta-ink);font-weight:800;letter-spacing:-.035em}
h1{font-size:clamp(30px,3.8vw,46px);line-height:1.12}
h2{line-height:1.25}
button,.button{border-radius:16px;background:#6041b5;color:#fff;box-shadow:0 4px 0 #41268a;font-weight:750;transition:transform .15s,box-shadow .15s}
button:hover,.button:hover{filter:none;transform:translateY(-1px);background:#51329e}
button:active,.button:active{transform:translateY(2px);box-shadow:0 1px 0 #41268a}
button:disabled{transform:none;cursor:default;box-shadow:none}
button.secondary,.button.secondary{background:#eee7ff;color:#4e318f;box-shadow:0 3px 0 #d7cbef}
button.danger{background:#ffe8e4;color:#a33138;box-shadow:0 3px 0 #f2c8c3}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #a84505;outline-offset:4px}
input:not([type=checkbox]),select,textarea{border:2px solid #e2dbef;border-radius:14px;background:#fffefa;color:#25204f}
input[readonly]{background:#f4f0fa;color:#615674}
.topbar,.piccolo-contributions>header{background:#6041b5;border-bottom:7px solid #ffcf56;box-shadow:none}
.topbar{height:108px}
.brand-copy strong,.brand-copy small,.piccolo-contributions header strong,.piccolo-contributions header a{color:white}
.brand-logo-wrap{background:#fffdf5;border:0;box-shadow:0 4px 0 #49318c;border-radius:20px}
.mode{background:#f0e8ff;color:#493077;border:0;font-weight:700}
.status-dot{background:#2d996e}
.shell{max-width:1380px;gap:36px;padding-top:36px}
.aside-title{color:#7a658d;letter-spacing:.13em}
aside nav{gap:10px}
.nav-link{font-weight:700;color:#645475;transition:background .15s}
.nav-link:hover{background:#eee7ff}
.nav-link.active{background:#ffda76;color:#392b50;border-radius:17px;box-shadow:0 4px 0 #e8bd54}
aside .nav-link:nth-child(2):not(.active){background:#ffe7e1}
aside .nav-link:nth-child(3):not(.active){background:#ddf1ff}
aside .nav-link:nth-child(4):not(.active){background:#dff2e7}
.nav-icon{background:#ffffff9c;border-radius:12px;padding:5px}
.aside-note{margin-top:35px;background:#dff2e7;border:2px dashed #a1cab5;box-shadow:none;transform:rotate(-2deg)}
.aside-note>span{font-family:inherit;font-weight:700;color:#2c5747}
.aside-note p{color:#426354}
.little-flower{color:#eaa744}
.page-head{margin-bottom:26px}
.eyebrow{color:#826498;letter-spacing:.14em}
.date-label{background:#fff;border:1px solid #e6dff0;border-radius:14px;padding:10px 14px;color:#655573}
.hero{border:3px solid #fff;background:linear-gradient(115deg,#eae0ff 0%,#f1e9ff 64%,#ffe4d9 100%);border-radius:32px;padding:32px 36px;box-shadow:0 7px 0 #ddd0ee;min-height:265px}
.hero::before{width:145px;height:145px;right:-45px;top:-50px;background:#ffcf56}
.hero::after{width:100px;height:100px;left:-45px;bottom:-55px;background:#ed9a85}
.hero .eyebrow{color:#67448c}
.hero h2{font-size:clamp(27px,3vw,39px);line-height:1.15;color:#3c2862;margin:16px 0 10px}
.hero p{color:#584771}
.hero a{background:#6041b5;color:white;border-radius:14px;padding:12px 16px;box-shadow:0 4px 0 #432780;gap:20px}
.hero-countdown{background:#fff5cc!important;color:#6e4c14!important;border:1px solid #efd28c}
.hero-art{width:185px;min-width:140px}
.calendar-art{border:3px solid white;width:135px;height:153px;box-shadow:8px 10px 0 #c9b5e3;transform:rotate(8deg);border-radius:22px}
.calendar-art span{background:#ee735b;color:#fff;font-weight:800;letter-spacing:.1em}
.calendar-art b{font-family:inherit;font-weight:900;color:#513477}
.spark{color:#aa5a0e;font-size:48px;top:-6px;right:0}
.section-heading{margin-top:32px}
.quick-card{border:2px solid #fff;border-radius:25px;padding:24px;box-shadow:0 5px 0 #e9ddcd;min-height:165px}
.quick-card:nth-child(1){background:#ffe6af;box-shadow:0 5px 0 #e9c989}
.quick-card:nth-child(2){background:#ddedff;box-shadow:0 5px 0 #bdd7ed}
.quick-card:nth-child(3){background:#def3e9;box-shadow:0 5px 0 #b7dac9}
.quick-card:nth-child(4){background:#f0e1ff}
.quick-card strong{font-size:19px;color:#352751}
.quick-card small{color:#615371;line-height:1.5}
.tile-icon{border-radius:16px;transform:rotate(-7deg);font-size:27px}
.panel,.person,.event,.notice{border:1px solid #e6deec;border-radius:26px;box-shadow:0 5px 0 #f0e8dc;background:#fff}
.person{border-top:5px solid #f4bd52}
.person:nth-child(3n+2){border-top-color:#a3d5be}
.person:nth-child(3n){border-top-color:#c3acec}
.avatar{background:#f0e5ff;color:#654096;border:3px solid #fff;box-shadow:0 0 0 1px #e2d5ef;font-weight:800}
.family-note{background:#e5f4ec;color:#365a4a;border:1px solid #badcca;border-radius:20px}
.calendar-top select{background:#f4edff;color:#5e3b90}
.month-choice{background:#f1edfa;color:#66547d;border-radius:14px;box-shadow:none}
.month-choice:nth-child(3n+1){background:#fff0cd}
.month-choice:nth-child(3n+2){background:#e4f4ed}
.month-choice.chosen{background:#6041b5;color:white;border:2px solid #42257d;box-shadow:0 3px 0 #d2c2ec}
.calendar-day{background:#f6f1fc;color:#504160;border:1px solid #eee5f7;border-radius:15px;box-shadow:none}
.calendar-day:hover{background:#e9dffc;color:#3d265b}
.calendar-day.is-today{border:3px solid #e5ac2c;background:#fff6d7;color:#644419}
.calendar-day.selected{background:#6041b5;color:#fff;border-color:#6041b5;box-shadow:0 3px 0 #432780}
.birthday-dot{background:#c54c3c}.party-dot{background:#16865c}
.tag{background:#ffe7be;color:#78501e}.party-tag{background:#dcf3e7;color:#235e45}
.event-date{background:#eee2ff;color:#674091;border-radius:18px}
.reminder-card{background:#fff0c9;border:1px solid #ecd18c;box-shadow:0 4px 0 #f1e1bc}
.reminder-card.compact{background:#fff8e9;border-color:#e9dccc}
.reminder-badge{background:#765022;color:#fff7de}
.whatsapp-button{background:#216d4e;color:#fff;box-shadow:0 4px 0 #154832}
.empty{background:#fffaf0;border:2px dashed #e2ceb0;border-radius:22px;color:#7a6344}
dialog{border:2px solid #e4d8f1;border-radius:26px;color:#25204f;box-shadow:0 20px 70px #35205038}
dialog::backdrop{background:#30204c77}
.bottom-nav{background:#fffdf9;border-top:4px solid #ffcf56}
.bottom-nav .nav-link{font-size:11px}
.bottom-nav .nav-link.active{background:#eee2ff;color:#513084;box-shadow:none}
/* El módulo financiero comparte la paleta y mantiene sus tablas despejadas. */
.piccolo-contributions{--navy:#25204f;--blue:#6041b5;--yellow:#ffcf56;--paper:#fffcf4}
.piccolo-contributions main{max-width:1240px;padding-top:34px}
.piccolo-contributions h1{font-size:clamp(32px,4vw,46px)}
.piccolo-contributions .lead{color:#625674}
.piccolo-contributions .panel{border-top:5px solid #c6b0ed}
.piccolo-contributions .grid>.panel:nth-child(2){border-top-color:#eec366}
.piccolo-contributions .metric{background:#f2eaff;border:0;border-radius:20px;color:#604185}
.piccolo-contributions .metric:nth-child(2){background:#dff3e8;color:#2e654d}
.piccolo-contributions .metric:nth-child(3){background:#fff0c9;color:#79551d}
.piccolo-contributions .metric b{color:inherit}
.piccolo-contributions .event-choices button{background:#f0e7ff;color:#563580;border:2px solid #ddcef3;box-shadow:0 3px 0 #dfd0ed}
.piccolo-contributions .event-choices button[aria-pressed=true]{background:#6041b5;color:#fff;border-color:#6041b5}
.piccolo-contributions th{background:#f3edfb;color:#594175;padding:15px 12px}
.piccolo-contributions td{padding:14px 12px;border-color:#eee6f2}
.piccolo-contributions tbody tr:nth-child(even){background:#fffcf5}
.piccolo-contributions tbody tr:hover{background:#f5f0ff}
.piccolo-contributions .payment-check{width:27px;height:27px;accent-color:#227453;padding:0;border-radius:6px}
.piccolo-contributions #editStudentDialog{border:2px solid #d6c2ed;color:#25204f}
@media(max-width:850px){
  .shell{gap:22px}.topbar{height:94px}.hero{padding:27px 25px}
}
@media(max-width:650px){
  .topbar{height:auto;min-height:84px;padding:12px 16px}.brand-logo-wrap{width:150px;height:53px}
  .shell{padding:24px 16px 115px}.hero{padding:25px 20px;min-height:245px;border-radius:26px}
  .hero-content{max-width:calc(100% - 70px)}.hero h2{font-size:27px;overflow-wrap:anywhere}
  .hero-art{width:68px;min-width:60px}.calendar-art{width:67px;height:97px;box-shadow:4px 6px 0 #c9b5e3;border-radius:13px}
  .calendar-art span{font-size:8px;padding:9px 2px;letter-spacing:0}.calendar-art b{font-size:34px;padding:7px}
  .spark{font-size:29px;right:-4px;top:15px}.quick-card{padding:18px;min-height:150px}
  .quick-card strong{font-size:17px}.quick-card small{font-size:12px}
  .page-head{align-items:flex-start;flex-wrap:wrap}.page-head .date-label{text-align:left}
  .calendar-day{min-height:48px;border-radius:11px}.month-choice{padding:10px 2px}
  .panel{border-radius:22px}.piccolo-contributions>header{padding:17px 20px}
  .piccolo-contributions main{padding:26px 14px 50px}.piccolo-contributions .panel{padding:20px 15px}
  .piccolo-contributions th,.piccolo-contributions td{white-space:nowrap}
  .piccolo-contributions .event-choices button{width:100%;text-align:left;white-space:normal}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}