/* Aprende con Javiera · Inicio responsive · 2026-10-12 */
.dashboard-shell{display:block;min-width:0;background:#fffaf8}
.dashboard-shell .sidebar{display:none}
.dashboard-shell .sidebar.open{display:flex;position:fixed;top:0;bottom:0;left:0;z-index:80;width:255px;box-shadow:22px 0 70px #233d4e35}
.dashboard-shell .main{display:block;width:100%;min-width:0}
.dashboard-shell .topbar{height:82px;padding:0 max(26px,calc((100vw - 1410px)/2));background:#fffefa}
.dashboard-shell .topbar .context{display:none}
.dashboard-shell .topbar .mobilebrand{display:block;font:normal 26px Georgia,serif;letter-spacing:-.7px;color:#263d49}
.dashboard-shell .topbar .menu-toggle{display:inline-flex;min-height:43px;min-width:43px;padding:8px 12px;align-items:center;font-size:20px;border-radius:14px}
.dashboard-shell .topbar .avatar .bubble{width:43px;height:43px}
.dashboard-shell .content{max-width:1410px;padding:28px 32px 62px}
.dj-dashboard{font-family:'Segoe UI',Arial,sans-serif;color:#233a49;min-width:0}
.dj-dashboard h1,.dj-dashboard h2,.dj-dashboard h3{letter-spacing:-.5px}
.dj-hero{position:relative;display:flex;align-items:center;min-height:250px;overflow:hidden;padding:32px 42px;background:linear-gradient(107deg,#fff3f3 0%,#fff8f4 45%,#fff2ea 100%);border-radius:28px;margin-bottom:18px;border:1px solid #f6e8e7}
.dj-hero:after{content:'♡';position:absolute;right:41%;top:14%;font-size:38px;color:#ed9daf;font-family:Georgia,serif;transform:rotate(-15deg);opacity:.55}
.dj-hero-copy{position:relative;z-index:2;max-width:56%}
.dj-hero-kicker{font-size:12px;letter-spacing:1.4px;color:#a47785;text-transform:uppercase;margin-bottom:8px;font-weight:600}
.dj-hero h1{font-family:Georgia,serif;font-size:clamp(34px,3.6vw,54px);line-height:1.07;margin:0 0 4px;color:#233747}
.dj-hero h1 span{font:normal 39px Georgia,serif;color:#e8a0b0;vertical-align:5px}
.dj-hero h2{font:normal clamp(22px,2.4vw,32px) Georgia,serif;color:#2c3f4d;margin:0 0 10px}
.dj-hero p{color:#6e7b83;font-size:15px;line-height:1.5;margin:0 0 17px;max-width:405px}
.dj-hero p span{color:#d88aa3}
.dj-hero-art{position:absolute;right:10px;bottom:-8px;width:min(54%,650px);height:108%;object-fit:contain;object-position:right bottom;pointer-events:none}
.dj-hero-actions{display:flex;gap:14px;align-items:center}
button.dj-primary{background:#264c59;border-radius:15px;padding:12px 23px;color:white;font-size:13px;box-shadow:0 5px 14px #254b5715}
button.dj-primary:hover{background:#315f6e}
.dj-notification-link{background:transparent;color:#9f5273;font-size:12px;padding:10px}
.dj-notification-link:hover{background:#fce1e8}
.dj-metrics,.dj-report-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:16px 0 21px}
.dj-metric{display:flex;align-items:center;justify-content:flex-start;gap:16px;text-align:left;background:white;color:#233a49;border:1px solid #f4eae8;padding:19px 20px;border-radius:19px;min-width:0;min-height:101px;box-shadow:0 6px 18px #29394408}
.dj-metric:hover,.dj-student:hover,.dj-tile:hover{background:#fff8fa;transform:translateY(-1px)}
.dj-metric-icon{flex:0 0 51px;width:51px;height:51px;display:grid;place-items:center;background:#fce0e7;color:#a54465;font-size:25px;border-radius:50%}
.dj-metric.dj-blue .dj-metric-icon{background:#e5f4fb;color:#467e9d}
.dj-metric.dj-mint .dj-metric-icon{background:#e4f3e9;color:#397d67}
.dj-metric-copy{min-width:0;display:block}
.dj-metric strong{font:bold 28px Georgia,serif;line-height:1.15;display:block}
.dj-metric small{font-size:13px;display:block;line-height:1.25;color:#72808a;margin-top:5px}
.dj-main-grid{display:grid;grid-template-columns:minmax(0,1.33fr) minmax(300px,1fr);gap:19px;align-items:start}
.dj-left,.dj-right{min-width:0}
.dj-panel{background:white;border:1px solid #f0eeee;border-radius:23px;padding:23px 25px;box-shadow:0 6px 25px #34465b09;min-width:0}
.dj-section-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.dj-section-heading h2{margin:0;font:bold 23px Georgia,serif;color:#263a49;display:flex;align-items:center;gap:12px}
.dj-section-ico{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:50%;font-family:'Segoe UI',sans-serif;font-size:21px}
.pink-icon{color:#9b4761;background:#fae5e9}
.mint-icon{color:#3c776d;background:#e6f5ee}
.peach-icon{color:#b9785d;background:#fff0e9}
.dj-week-switch{display:flex;gap:7px;align-items:center;white-space:nowrap}
.dj-week-switch>span{font-size:12px;color:#687782;text-transform:capitalize;margin-right:5px}
.dj-week-switch button{border-radius:50%;font-size:23px;font-weight:400;padding:0;background:#fbebee;color:#934e68;width:35px;height:35px}
.dj-week-switch button:hover{background:#f3d4dd}
.dj-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.dj-day{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:80px;border:1px solid #efeded;border-radius:14px;background:#fff;color:#3d4c58;padding:10px 3px;font-weight:normal}
.dj-day:hover{background:#fff5f6;color:#87425c}
.dj-day.selected{background:#fadfe6;border-color:#f8d3dd;color:#a64162}
.dj-day span{font-size:12px}
.dj-day b{font:bold 20px Georgia,serif;line-height:1.1}
.dj-day i{width:6px;height:6px;border-radius:50%;background:#d3d4d3;display:block;margin-top:3px}
.dj-day i.has-events{background:#ae536e}
.dj-day.selected i{background:#a64162}
.dj-day-status{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid #f6eff0;color:#809096;font-size:12px}
.dj-day-status button,.dj-link{background:#f6f7f6;color:#475d6a;font-size:12px;border-radius:22px;padding:8px 14px;white-space:nowrap}
.dj-day-status button:hover,.dj-link:hover{background:#f6e7ea;color:#9c5270}
.dj-day-bookings{margin-top:11px;display:grid;gap:7px}
.dj-day-bookings button{background:#fff9f9;color:#384852;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;text-align:left;padding:9px 11px;font-size:12px;border:1px solid #f6eced}
.dj-day-bookings button small{color:#9f526d}
.dj-next{display:flex;align-items:center;gap:20px;min-height:143px;margin:18px 0 0;background:linear-gradient(110deg,#fae0e4,#fff0eb);border-radius:23px;padding:21px 27px}
.dj-graduation{display:grid;place-items:center;flex:0 0 64px;width:64px;height:64px;background:#f6d0db;color:#a24461;font-size:37px;border-radius:50%}
.dj-next-info{flex:1;min-width:0}
.dj-caption{font-size:12px;color:#8e7c81;display:block}
.dj-next h2{font:bold 23px Georgia,serif;line-height:1.2;margin:2px 0 7px}
.dj-next p{margin:0;color:#6c7580;font-size:12px;line-height:1.5}
.dj-next-button{flex:0 0 auto;background:#fffafc;color:#94516a;border-radius:30px;padding:12px 19px;font-size:12px;box-shadow:0 5px 15px #a8556b16}
.dj-next-button:hover{background:#fff}
.dj-tiles{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.dj-tile{width:100%;display:flex;align-items:flex-start;gap:11px;text-align:left;background:white;border:1px solid #f0eeee;border-radius:22px;color:#243b49;padding:23px 17px;min-width:0;min-height:155px;box-shadow:0 6px 25px #34465b09;position:relative}
.dj-tile-icon{width:40px;height:40px;flex:0 0 40px;display:grid;place-items:center;border-radius:50%;font-size:21px}
.dj-tile>div{min-width:0}
.dj-tile h3{margin:1px 0 11px;font-size:14px;line-height:1.3}
.dj-tile strong{display:block;font:bold 28px Georgia,serif;white-space:nowrap}
.dj-tile strong span{font:normal 11px 'Segoe UI',sans-serif;color:#7b878c;white-space:normal}
.dj-tile p{font-size:11px;color:#7c8890;line-height:1.4;margin:7px 0 0}
.dj-tile small{font-size:10px;color:#6b8b83;display:block;margin-top:7px}
.dj-tile .dj-chevron{position:absolute;top:20px;right:14px;color:#a04e6b}
.dj-pet{font-size:36px;position:absolute;right:11px;bottom:13px;filter:drop-shadow(0 4px 2px #9d7b8821)}
.dj-game>div{padding-right:3px}
.dj-game strong{font-size:22px}
.dj-reminders{margin-top:18px}
.dj-reminders .dj-section-heading{margin-bottom:10px}
.dj-reminders button:not(.dj-link){display:flex;align-items:center;gap:9px;background:#fff;color:#657581;width:100%;border-top:1px solid #f4eff1;border-radius:0;text-align:left;padding:13px 4px;font-size:12px;font-weight:normal;justify-content:flex-start}
.dj-reminders button:not(.dj-link):hover{background:#fff8f9}
.dj-reminders button>span:first-child{font-size:17px;color:#ae637e;min-width:25px}
.dj-reminders button b{font:bold 16px Georgia,serif;color:#314755}
.dj-reminders .dj-chevron{margin-left:auto;font-size:20px}
.dj-students{margin-top:19px}
.dj-student-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.dj-student{display:flex;align-items:center;gap:11px;min-width:0;text-align:left;border-radius:15px;border:1px solid #f1ecec;background:#fff;padding:13px;color:#334a56}
.dj-student-avatar{width:45px;height:45px;flex:0 0 45px;border-radius:50%;display:grid;place-items:center;font-weight:bold;font-size:13px;color:#a14d6c;background:linear-gradient(135deg,#ffdfdf,#faedf5)}
.dj-student-1 .dj-student-avatar{background:linear-gradient(135deg,#d8f0dd,#e8f7ef);color:#4f8771}
.dj-student-2 .dj-student-avatar{background:linear-gradient(135deg,#e7e6fe,#f8eafb);color:#806ab2}
.dj-student-3 .dj-student-avatar{background:linear-gradient(135deg,#dceffa,#e2fbff);color:#4e86a0}
.dj-student-copy{display:flex;flex-direction:column;min-width:0;gap:3px;flex:1}
.dj-student-copy b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.dj-student-copy small{font-size:11px;color:#986280}
.dj-student-copy>span{font-size:10px;color:#839198}
.dj-student .dj-chevron{font-size:22px;font-weight:normal;color:#a4a9ad}
.dj-footnote{text-align:center;font-size:11px;color:#96a0a6;margin:18px 0}
.dashboard-bottom-nav{display:none}
.dj-reports{max-width:1250px;margin:auto}
.dj-reports>.dj-section-heading{margin-bottom:22px}
.dj-reports>.dj-section-heading h1{font:normal 35px Georgia,serif;margin:0}
.dj-report-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.dj-report-chart{margin:20px 0}
.dj-bars{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;min-height:240px;padding:8px 10px 3px;align-items:end}
.dj-bar-column{min-width:0;height:245px;display:flex;flex-direction:column;align-items:center;gap:8px}
.dj-bar-column>b{font-size:11px;white-space:nowrap;color:#78848e}
.dj-bar-column>small{font-size:12px;text-transform:capitalize;color:#79818a}
.dj-bar-track{width:90%;max-width:75px;flex:1;background:#fcf7f8;border-radius:11px 11px 3px 3px;display:flex;align-items:end;overflow:hidden}
.dj-bar-track>div{width:100%;background:linear-gradient(#c16b87,#f2c9d6);border-radius:10px 10px 0 0}
.dj-report-bottom{display:grid;grid-template-columns:320px minmax(0,1fr);gap:17px}
.dj-report-bottom .dj-reminders,.dj-report-bottom .dj-students{margin-top:0}
.dj-report-bottom .dj-student-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1100px){
 .dj-main-grid{grid-template-columns:1fr}
 .dj-tiles{grid-template-columns:1fr 1fr}
 .dj-right{display:grid;grid-template-columns:1fr 1fr;gap:15px}
 .dj-reminders{margin-top:0}
 .dj-student-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .dj-report-stats{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
 .dashboard-shell .topbar{height:68px;padding:0 15px}
 .dashboard-shell .topbar .mobilebrand{font-size:20px}
 .dashboard-shell .topbar .menu-toggle{min-width:42px;min-height:42px;border-radius:14px}
 .dashboard-shell .topbar .avatar{gap:8px}
 .dashboard-shell .topbar .avatar .bubble{width:38px;height:38px}
 .dashboard-shell .topbar .avatar button{font-size:11px;padding:8px}
 .dashboard-shell .content{padding:15px 12px 108px}
 .dj-hero{min-height:227px;padding:23px 19px;border-radius:22px;margin-bottom:12px}
 .dj-hero-copy{max-width:64%}
 .dj-hero-kicker{font-size:9px;letter-spacing:.7px;margin-bottom:6px}
 .dj-hero h1{font-size:clamp(29px,7vw,39px)}
 .dj-hero h1 span{font-size:25px}
 .dj-hero h2{font-size:clamp(19px,5.2vw,25px)}
 .dj-hero p{font-size:12px;max-width:230px;line-height:1.45;margin-bottom:15px}
 .dj-hero-art{width:53%;height:78%;right:-22px;bottom:-1px}
 .dj-hero:after{top:13%;right:27%;font-size:23px}
 .dj-hero-actions{gap:6px}
 .dj-hero button.dj-primary{font-size:11px;padding:10px 12px}
 .dj-notification-link{font-size:10px;padding:5px}
 .dj-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:9px 0 13px}
 .dj-metric{padding:11px 6px;min-height:101px;display:flex;flex-direction:column;gap:7px;text-align:center;justify-content:center;border-radius:17px}
 .dj-metric-icon{width:33px;height:33px;flex:0 0 33px;font-size:18px}
 .dj-metric strong{font-size:clamp(17px,5vw,24px)}
 .dj-metric small{font-size:10px;margin-top:2px}
 .dj-main-grid{gap:12px}
 .dj-panel{padding:16px 13px;border-radius:20px}
 .dj-section-heading{margin-bottom:13px}
 .dj-section-heading h2{font-size:17px;gap:8px}
 .dj-section-ico{width:33px;height:33px;flex-basis:33px;font-size:17px}
 .dj-week-switch{gap:4px}
 .dj-week-switch>span{font-size:9px;margin-right:1px}
 .dj-week-switch button{width:28px;height:28px;font-size:20px}
 .dj-days{gap:5px}
 .dj-day{min-height:70px;padding:6px 1px;border-radius:12px}
 .dj-day span{font-size:10px}
 .dj-day b{font-size:17px}
 .dj-day-status{font-size:10px}
 .dj-day-status button{font-size:10px;padding:7px 10px}
 .dj-next{gap:11px;min-height:113px;padding:16px 12px;margin-top:12px;border-radius:19px}
 .dj-graduation{width:40px;height:40px;flex-basis:40px;font-size:27px}
 .dj-next h2{font-size:16px}
 .dj-next p{font-size:10px}
 .dj-caption{font-size:10px}
 .dj-next-button{font-size:10px;padding:10px 12px;white-space:nowrap}
 .dj-right{display:block}
 .dj-tiles{gap:9px}
 .dj-tile{padding:15px 11px;min-height:137px;border-radius:19px;gap:8px}
 .dj-tile-icon{width:33px;height:33px;flex-basis:33px;font-size:17px}
 .dj-tile h3{font-size:11px;margin-bottom:8px}
 .dj-tile strong{font-size:22px}
 .dj-tile p{font-size:10px}
 .dj-game strong{font-size:17px}
 .dj-game small{font-size:9px}
 .dj-pet{font-size:28px;right:5px;bottom:5px}
 .dj-reminders{margin-top:12px}
 .dj-students{margin-top:13px}
 .dj-student-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .dj-student{padding:10px 8px;gap:7px}
 .dj-student-avatar{width:34px;height:34px;flex-basis:34px;font-size:11px}
 .dj-student-copy b{font-size:11px}
 .dj-student-copy small,.dj-student-copy>span{font-size:9px}
 .dj-student .dj-chevron{font-size:17px}
 .dashboard-bottom-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;z-index:40;background:#fffdfaee;backdrop-filter:blur(15px);border-top:1px solid #f0ebeb;padding:9px 6px calc(9px + env(safe-area-inset-bottom));gap:2px;box-shadow:0 -4px 18px #32495711}
 .dashboard-bottom-nav button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 1px;color:#758089;background:none;border-radius:14px;font-weight:400;min-width:0}
 .dashboard-bottom-nav button:hover,.dashboard-bottom-nav button.active{background:#fbeaf0;color:#a5486d}
 .dashboard-bottom-nav button>span{font-size:23px;height:27px;line-height:25px}
 .dashboard-bottom-nav button>small{font-size:10px;line-height:15px;white-space:nowrap}
 .shell:has(.dashboard-bottom-nav) .content{padding-bottom:110px}
 .dj-reports>.dj-section-heading h1{font-size:26px}
 .dj-reports>.dj-section-heading .dj-primary{font-size:10px;padding:9px 11px}
 .dj-report-stats{grid-template-columns:repeat(2,1fr)}
 .dj-report-bottom{grid-template-columns:1fr}
 .dj-bars{gap:5px;padding:4px 1px;min-height:175px}
 .dj-bar-column{height:180px}
 .dj-bar-column>b{font-size:8px}
 .dj-bar-column>small{font-size:10px}
 .dj-report-bottom .dj-student-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:360px){
 .dashboard-shell .topbar .mobilebrand{font-size:17px}
 .dj-hero-copy{max-width:66%}
 .dj-hero-art{width:48%;right:-27px}
 .dj-hero h1{font-size:26px}
 .dj-hero h2{font-size:19px}
 .dj-next h2{font-size:14px}
 .dj-graduation{display:none}
 .dj-week-switch>span{display:none}
 .dj-student-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.dj-dashboard button{transition:none!important}}



/* Imagen aprobada 13-10-2026: sin deformación, tamaños adaptables */
.dj-hero{min-height:310px}
.dj-hero-art{
 width:min(48%,540px);
 height:auto;
 aspect-ratio:1672 / 941;
 max-width:none;
 max-height:none;
 right:10px;
 bottom:-4px;
 object-fit:contain;
 object-position:right bottom;
 pointer-events:none;
}
@media(max-width:1100px) and (min-width:761px){
 .dj-hero{min-height:285px}
 .dj-hero-art{width:min(50%,490px);right:0;bottom:0}
}
@media(max-width:760px){
 .dj-hero{min-height:252px;align-items:flex-start;padding:23px 18px 17px}
 .dj-hero-copy{max-width:68%;align-self:flex-start}
 .dj-hero-kicker{display:none}
 .dj-hero h1{font-size:clamp(28px,7.2vw,36px);margin-bottom:6px}
 .dj-hero h1 span{display:none}
 .dj-hero h2{font-size:clamp(20px,5.5vw,25px)}
 .dj-hero p{max-width:195px;font-size:12px;margin-bottom:14px}
 .dj-hero-art{
  width:min(83%,330px);
  height:auto;
  max-height:none;
  right:-5px;
  bottom:-5px;
  object-fit:contain;
  object-position:right bottom;
 }
 .dj-hero:after{display:none}
}
@media(max-width:360px){
 .dj-hero{min-height:232px}
 .dj-hero-copy{max-width:69%}
 .dj-hero-art{width:77%;right:-12px;bottom:-4px}
 .dj-hero h1{font-size:27px}
}
