/* Mi Ruta B · Escritorio, revisión v4.
   Exclusivamente >=900px: móvil conserva su diseño y navegación. */
.home-view{display:contents}
.top-context,.top-class-b,.hero-counter{display:none}
@media (min-width:900px){
 :root{--blue:#2853a6;--navy:#182944;--muted:#6b7b92;--bg:#f8fafc;--soft:#edf4ff;--line:#e4eaf1;--glass-shadow:0 8px 28px rgba(24,45,83,.04)}
 html,body,body .app-shell,body .page{background:#f8fafc}
 body{font-size:15px;color:#182944}
 .workspace{display:grid;grid-template-columns:236px minmax(0,1fr);max-width:100%;min-height:100vh}
 .nav-column{position:sticky;top:0;height:100vh;min-height:0;overflow-y:auto;display:flex;flex-direction:column;align-items:stretch;padding:32px 15px 24px;background:#fff;border-right:1px solid #e7edf4;box-shadow:none}
 .side-identity{padding:0 9px 0;gap:12px;color:#182943;min-height:59px;display:flex;align-items:center}
 .side-mark{width:41px;height:41px;background:#214c9d;color:#fff;border:0;border-radius:12px;box-shadow:0 4px 10px #234a951b}
 .side-identity strong{font-size:17px;font-weight:800;letter-spacing:-.65px}
 .side-identity small{font-size:11px;color:#8492a7;letter-spacing:0;margin-top:3px}
 .side-label{font-size:10px;margin:45px 12px 12px;color:#a0aec1;letter-spacing:1.45px;font-weight:780}
 .nav-column .bottom-nav{position:static;top:auto;gap:5px;padding:0;margin:0;border:0;box-shadow:none;display:flex;flex-direction:column;align-items:stretch;background:transparent;backdrop-filter:none;width:100%;height:auto}
 .nav-column .navitem{min-height:46px;padding:0 14px;width:100%;font-size:13px;letter-spacing:-.1px;border-radius:10px;color:#687b91;background:transparent;display:flex;flex:0 0 auto;flex-direction:row;justify-content:flex-start;gap:13px;text-align:left;font-weight:650;transition:background .18s,color .18s}
 .nav-column .navitem .navicon{display:grid;place-items:center;width:19px;height:19px;color:#8293aa}
 .nav-column .navitem .navicon .icon-svg{width:19px;height:19px}
 .nav-column .navitem:hover{background:#f2f6fc;color:#153b77}
 .nav-column .navitem.active{background:#edf3fd;color:#1c4f9f;font-weight:800;box-shadow:inset 3px 0 0 #3265bd}
 .nav-column .navitem.active .navicon{color:#2558af}
 .side-foot{display:flex;align-items:flex-start;gap:10px;margin:auto 5px 0;padding:17px 10px 0;border-top:1px solid #edf1f6;color:#506781;font-size:11px;line-height:1.4}
 .side-foot-line{display:none}.side-foot-icon{width:29px;height:29px;flex:0 0 29px;display:grid;place-items:center;background:#f1f5fc;border-radius:9px;color:#406bae}
 .side-foot-icon .icon-svg{width:16px;height:16px}
 .side-foot strong{display:block;font-weight:760;color:#375174;font-size:11px;white-space:nowrap}.side-foot small{display:block;color:#9aa8b9;font-size:10px;margin-top:4px}
 .page{padding:0 clamp(27px,3.6vw,65px) 55px;max-width:none;min-width:0;min-height:100vh;background:#f8fafc}
 .top{max-width:none;min-height:81px;margin:0 -0px 39px;padding:0;border-bottom:1px solid #e6ebf2;display:flex;align-items:center}
 .top .brand{display:none}.top-context{display:flex;gap:11px;align-items:center;font-size:12px;color:#8090a5;letter-spacing:.05px}
 .top-context strong{font-size:12px;color:#283e5e;font-weight:700}.context-dot{height:7px;width:7px;background:#3c77cc;border-radius:50%;box-shadow:0 0 0 4px #ecf3ff}
 .context-sep{font-size:15px;color:#c9d3df}
 .top-actions{gap:11px;align-items:center}.top-class-b{display:inline-flex;gap:6px;align-items:center;border:1px solid #e0e7f1;padding:8px 11px;background:#fff;border-radius:9px;color:#6e7e94;font-size:10px;font-weight:780;letter-spacing:.8px;margin-right:7px}
 .top-class-b span{color:#b3bed0}
 .round-btn{width:39px;height:39px;border-radius:11px;border-color:#e3e9f1;background:#fff;box-shadow:0 1px 3px #203a590a;color:#344b6c}
 .round-btn:hover{background:#f2f7fd;border-color:#cfdded}
 .page-content{max-width:1220px;margin:0 auto;min-width:0}
 .eyebrow{font-size:10px;letter-spacing:1.5px;color:#3767b4;font-weight:830}
 .heading{font-size:clamp(28px,2.8vw,37px);letter-spacing:-1.3px;line-height:1.1;font-weight:800;margin:8px 0 9px}
 .subhead{font-size:14px;line-height:1.6;color:#78879c;margin:0 0 28px}
 .home-view{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;row-gap:0;align-content:start}
 .home-view>.eyebrow{grid-column:1/-1;grid-row:1}
 .home-view>.heading{grid-column:1/-1;grid-row:2}
 .home-view>.subhead{grid-column:1/-1;grid-row:3}
 .home-view>.hero{grid-column:1/9;grid-row:4;align-self:stretch}
 .home-view>.stat-grid{grid-column:9/-1;grid-row:4;align-self:stretch}
 .home-view>.hero-after{grid-column:1/9;grid-row:5;justify-content:flex-start;margin-top:12px}
 .home-view>.section-head{grid-column:1/-1;grid-row:7;margin:32px 0 17px}
 .home-view>.tile-grid{grid-column:1/-1;grid-row:8}
 .home-view>.space16{grid-column:1/-1;grid-row:9;height:17px}
 .home-view>.status-note{grid-column:1/-1;grid-row:10;margin:0}
 .home-view>.btn[data-view="quiz"]{grid-column:1/-1;grid-row:6;margin:14px 0 0;max-width:440px}
 .hero{color:#1a2c49;position:relative;overflow:hidden;display:flex;align-items:center;min-height:288px;padding:34px 31px;border:1px solid #dfe7f1;border-radius:18px;background:#fff!important;box-shadow:0 8px 25px rgba(26,49,91,.035)}
 .hero:before{content:'';position:absolute;inset:auto auto -165px -100px;width:370px;height:250px;border:0;border-radius:100%;background:radial-gradient(closest-side,#eaf2ff 0%,transparent 100%);box-shadow:none;z-index:0}
 .hero>div:first-child{z-index:1;max-width:calc(100% - 174px);position:relative}
 .hero-art{display:none}
 .hero .hero-label{font-size:9px;letter-spacing:1.55px;color:#4371b8;font-weight:840;margin-bottom:13px}
 .hero h2{margin:0 0 12px;font-size:clamp(24px,2.3vw,33px);max-width:490px;line-height:1.13;letter-spacing:-1.14px;font-weight:800;color:#162c51}
 .hero p{font-size:13px;line-height:1.55;color:#697e99;max-width:430px;margin:0 0 23px}
 .hero .whitebtn,.hero .hero-secondary{min-height:43px;border-radius:10px;font-size:12px;letter-spacing:0;font-weight:760;padding:10px 14px;box-shadow:none;margin:0 6px 4px 0}
 .hero .whitebtn{color:#fff;background:#2454a6;border:1px solid #2454a6}
 .hero .whitebtn:hover{background:#173f86}
 .hero .hero-secondary{color:#244a88;background:#eff4fc;border:1px solid #d9e5f4}
 .hero .hero-secondary:hover{background:#e6effb}
 .hero-counter{display:flex;position:absolute;right:26px;top:30px;bottom:30px;width:156px;flex-direction:column;justify-content:center;align-items:center;background:#152f5c;border-radius:15px;color:#fff;border:1px solid #244678;box-shadow:0 12px 22px #183f8619;padding:13px;z-index:1}
 .hero-counter span{font-size:9px;font-weight:780;letter-spacing:1.4px;color:#aecbff}
 .hero-counter strong{display:block;font-size:74px;line-height:1.04;letter-spacing:-5px;font-weight:820;margin-top:10px}
 .hero-counter small{font-size:12px;color:#e7effe;letter-spacing:.1px}
 .hero-counter i{width:35px;height:1px;background:#5073a6;display:block;margin:17px 0 15px}
 .hero-counter b{font-size:12px;font-weight:730}
 .hero-counter em{font-size:9px;font-style:normal;color:#a8bfdf;margin-top:7px;white-space:nowrap}
 .hero-after .link-btn{font-size:12px;font-weight:690;color:#4270b2}
 .stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:15px}
 .home-view .stat-grid{margin:0;display:grid;grid-template-columns:1fr;grid-template-rows:repeat(3,minmax(0,1fr));gap:12px}
 .home-view .stat{min-height:0;display:grid;grid-template-columns:43px minmax(0,1fr);grid-template-rows:auto auto;align-content:center;align-items:center;gap:2px 13px;padding:13px 17px;border-radius:14px}
 .home-view .stat .symbol{grid-row:1/3;grid-column:1;display:grid;place-items:center;width:43px;height:43px;background:#eef4fd;border-radius:12px;color:#3866af;margin:0}
 .home-view .stat .symbol .icon-svg{width:20px;height:20px}
 .home-view .stat strong{grid-column:2;grid-row:1;font-size:25px;line-height:1.05;letter-spacing:-.6px;margin:0;color:#1b2f50}
 .home-view .stat small{grid-column:2;grid-row:2;font-size:11px;line-height:1.3;color:#8391a5}
 .section-head h2{font-size:18px;letter-spacing:-.5px;font-weight:790;color:#1d3151}
 .section-head small{font-size:12px;color:#95a0b3}
 .tile-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
 .tile-grid .tile{min-height:98px;padding:17px 17px;gap:13px;align-items:center;background:#fff;border:1px solid #e3eaf2;border-radius:14px;box-shadow:0 3px 13px #1f416008}
 .tile-grid .tile:hover{transform:translateY(-2px);border-color:#b7cbe9;box-shadow:0 8px 25px #224f9a12}
 .tile .ico{width:42px;height:42px;flex:0 0 42px;border-radius:12px;background:#eef4ff;color:#315fab;border:1px solid #e4edfb;margin:0}
 .tile .ico .icon-svg{width:20px;height:20px}
 .tile-copy{gap:5px}.tile-copy strong{font-size:13px;font-weight:780;color:#19345d}
 .tile-copy span{font-size:11px;color:#8a98aa;line-height:1.35}
 .tile .tile-arrow{color:#b0bfd2}.tile .tile-arrow .icon-svg{width:16px;height:16px}
 .status-note{padding:13px 15px;font-size:11px;line-height:1.55;background:#eef3f9;border:1px solid #e4eaf3;color:#7b8ca4;border-radius:11px}
 .card,.form-card,.review-card,.stat{border:1px solid #e3eaf2;background:#fff;border-radius:14px;box-shadow:0 2px 12px #143d6408}
 .card,.form-card{padding:25px 28px}
 .form-card{max-width:880px}
 .button-stack{gap:12px}
 .btn{border-radius:10px;min-height:45px;font-size:13px;background:#2858a6;font-weight:740;box-shadow:none}
 .btn:hover:not(:disabled){background:#17468e}
 .btn.ghost{background:#fff;border-color:#dbe4ee}
 .form-control{border-radius:10px;background:#fff}
 .chip{border-radius:9px}
 .option{max-width:960px;padding:17px 19px;border-radius:12px}
 .question{max-width:960px;font-size:24px;line-height:1.45}
 .question-img{max-height:460px}
 .review-card{padding:18px 21px;margin-top:12px}
 .review-card h3{font-size:14px;line-height:1.55}
 .calendar-card{max-width:900px;margin-left:0;margin-right:auto}
 .cal-day{min-height:68px}
 .search-wrap{max-width:970px}
 .filter-row{flex-wrap:wrap;overflow:visible;scrollbar-width:auto;max-width:1120px;gap:8px}
 #library-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;max-width:1150px}
 #library-results>.panel-head,#library-results>.btn,#library-results>.space16{grid-column:1/-1}
 #library-results>.review-card{margin:0;min-height:145px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between}
 #library-results .review-card h3{font-size:13px;line-height:1.55;font-weight:690;letter-spacing:0}
 #library-results .link-btn{margin-top:auto}
 .empty{max-width:820px}
 .battle-art{font-size:45px}
 .card.center{max-width:820px}
 #toast{bottom:24px}
}
/* Compact laptop windows retain spacious but responsive columns. */
@media (min-width:900px) and (max-width:1199px){
 .workspace{grid-template-columns:207px minmax(0,1fr)}
 .nav-column{padding:26px 11px 20px}
 .page{padding:0 27px 48px}
 .top{margin-bottom:30px}
 .home-view{column-gap:13px}
 .home-view>.hero{grid-column:1/9}
 .home-view>.stat-grid{grid-column:9/-1}
 .hero{padding:23px 19px;min-height:270px}
 .hero>div:first-child{max-width:calc(100% - 138px)}
 .hero h2{font-size:25px}
 .hero .whitebtn,.hero .hero-secondary{font-size:11px;padding:10px 11px}
 .hero-counter{right:16px;top:25px;bottom:25px;width:125px}
 .hero-counter strong{font-size:57px}
 .home-view .stat{grid-template-columns:31px minmax(0,1fr);gap:1px 9px;padding:11px}
 .home-view .stat .symbol{width:30px;height:30px;border-radius:9px}
 .home-view .stat .symbol .icon-svg{width:17px;height:17px}
 .home-view .stat strong{font-size:21px}
 .home-view .stat small{font-size:10px}
 .tile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* Keep system-selected or manual dark mode equally intentional on desktop. */
@media (min-width:900px){
 body.dark{--bg:#111a2a;--navy:#e7eefc;--muted:#9cafc8;--line:#31425a;color:#e7eefc;background:#111a2a}
 body.dark .app-shell,body.dark .page{background:#111a2a}
 body.dark .nav-column{background:#121f31;border-color:#2c3c50}
 body.dark .side-identity{color:#f1f5ff}body.dark .side-identity small{color:#95a8c4}
 body.dark .side-mark{background:#3260ac}
 body.dark .side-label{color:#7690b1}
 body.dark .nav-column .navitem{color:#9eb0c8}
 body.dark .nav-column .navitem:hover{background:#20314a;color:#dce8ff}
 body.dark .nav-column .navitem.active{background:#233f68;color:#cde0ff;box-shadow:inset 3px 0 0 #729fee}
 body.dark .nav-column .navitem.active .navicon{color:#a8c6ff}
 body.dark .side-foot{border-color:#2d3e55}
 body.dark .side-foot strong{color:#cad9f0}
 body.dark .side-foot small{color:#92a5bf}
 body.dark .side-foot-icon{background:#203553;color:#b3ceff}
 body.dark .top{border-color:#293951}
 body.dark .top-context strong{color:#d7e3f6}
 body.dark .top-class-b{background:#1a2b44;border-color:#354763;color:#9fb4d1}
 body.dark .round-btn{background:#1c2b41;border-color:#36465c;color:#dbe6fa}
 body.dark .hero{background:#19293f!important;border-color:#334761;color:#f4f7ff;box-shadow:none}
 body.dark .hero h2{color:#f2f6ff}
 body.dark .hero p{color:#bdcce0}
 body.dark .hero .hero-label{color:#9bbcff}
 body.dark .hero .hero-secondary{background:#263e61;color:#d9e9ff;border-color:#3c5681}
 body.dark .hero-counter{background:#12213a;border-color:#364f78}
 body.dark .home-view .stat,.dark .tile-grid .tile{background:#1a2a40;border-color:#30445d}
 body.dark .home-view .stat strong,.dark .tile-copy strong,.dark .section-head h2{color:#e9f2ff}
 body.dark .home-view .stat small,.dark .tile-copy span{color:#9dadc3}
 body.dark .home-view .stat .symbol,.dark .tile .ico{background:#243d5e;border-color:#3c557a;color:#a4c4ff}
 body.dark .status-note{background:#192b43;border-color:#31435c;color:#a3b5ce}
 body.dark .card,body.dark .form-card,body.dark .review-card{background:#1a2940;border-color:#30425b}
 body.dark .form-control{background:#1a2940}
 body.dark .option{background:#1a2940;border-color:#31415d}
}
/* Desktop calendar should remain compact, not an oversized grid of square days. */
@media (min-width:900px){
 .calendar-card{max-width:820px;padding:22px 24px}
 .calendar-grid,.calendar-weekdays{gap:6px}
 .cal-day,.cal-empty{aspect-ratio:auto;min-height:53px;height:53px;border-radius:10px}
 .cal-day{font-size:13px}
 .cal-legend{margin-top:17px}
}