/* Identidad aprobada · Colegio Sor Juana · 14 octubre 2026 */
:root{--primary:#052e53;--accent:#c89b32;--paper:#f3f8fc;--ink:#081d57;--muted:#4e72aa;--line:#dfebf5;--tint:#eef5fd;--radius:10px;--side-width:clamp(230px,16.8vw,280px)}
body{font-family:"Montserrat","Segoe UI",Arial,sans-serif;color:var(--ink);background:linear-gradient(115deg,#f6f9fc,#f1f7fb);font-size:14px}h1,h2,.brand-text,.motto,.claim,.banner h2,.stat strong{font-family:"Playfair Display",Georgia,"Times New Roman",serif}h1{font-size:clamp(34px,3.25vw,54px);font-weight:700;letter-spacing:-1.8px}h2{font-size:23px;font-weight:700}.sub{font-size:clamp(15px,1.35vw,22px);color:#355d9f;margin-top:5px;line-height:1.4}.icon{stroke-width:1.7}.sidebar{width:var(--side-width);background:linear-gradient(110deg,#073759,#032747 72%,#073961);padding:24px 12px 28px;color:white;border-right:1px solid #b9cfdf;overflow:hidden;isolation:isolate}.sidebar:before{content:"";position:absolute;width:29px;height:650px;right:18px;bottom:-180px;background:#006eb3;transform:rotate(35deg);box-shadow:24px 0 #034376,27px 0 #cc9d30,55px 0 #063553,-26px 0 #064a79;z-index:-1}.sidebar:after{content:"";position:absolute;right:23px;bottom:175px;width:125px;height:125px;background:#6896b6;opacity:.18;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,80% 94%,50% 72%,20% 94%,32% 57%,2% 35%,39% 35%);z-index:-1}.brand{justify-content:center;color:white;padding:0 8px 27px;min-height:126px}.brand-text{text-align:center;line-height:1;color:inherit;font-size:clamp(27px,2.55vw,42px);letter-spacing:-1.3px;white-space:nowrap;width:100%;font-variant:small-caps}.brand-text small{font:10px "Segoe UI",Arial,sans-serif;letter-spacing:7px;color:inherit;padding-left:7px;margin-bottom:8px}.brand-text b{display:block;font-weight:500}.brand-text em{display:block;font-size:14px;letter-spacing:3px;font-style:normal;font-variant:normal;margin:3px 0 8px}.brand-text span{font:8px "Segoe UI",Arial,sans-serif;letter-spacing:2.1px;color:inherit;padding-top:9px;border-top:2px solid var(--accent);margin:0}.brand-text i{color:#e6b640;font-style:normal;padding:0 3px}.brand img{width:100%;max-height:112px}.sidebar nav{gap:7px}.sidebar nav button{min-height:49px;padding:10px 18px;color:#f8fbff;gap:18px;font-size:16px;border-radius:6px;position:relative}.sidebar nav button .icon{width:29px;height:29px}.sidebar nav button:hover{background:#ffffff12}.sidebar nav button.active{background:linear-gradient(100deg,#086eb0,#04568e);box-shadow:inset 0 1px #ffffff14}.sidebar nav button.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(#d39e25,#ffe58c,#ca8f10);border-radius:6px 0 0 6px}.sidebar-foot{padding:84px 25px 60px;position:relative}.sidebar-foot>.motif{display:none}.motto{font-weight:400;font-style:italic;line-height:1.2;font-size:22px;max-width:180px;position:relative}.motto:before{content:"";display:block;background:#d6a323;width:40px;height:2px;margin-bottom:20px}.main{margin-left:var(--side-width)}.topbar{height:70px;padding:0 28px;background:#ffffffed;box-shadow:0 3px 16px #0e44700a;justify-content:flex-start}.hamburger{display:flex;border-radius:0;border-right:1px solid var(--accent);padding:4px 23px 4px 0}.hamburger .icon{height:28px;width:28px}.topbar .tagline{font:italic 18px Georgia,serif;color:var(--ink)}.top-actions{margin-left:auto;gap:20px}.top-actions>.icon-btn:first-child{border-right:1px solid #c8d8e8;border-radius:0;padding-right:20px}.top-actions .icon{height:27px;width:27px}.user{gap:13px}.user .avatar{background:linear-gradient(135deg,#092664,#034272);color:white;width:45px;height:45px;font-size:18px}.user small{font-size:12px;color:var(--muted)}.user strong{font-size:15px}.content{max-width:1800px;padding:0 24px 15px}.page-head{min-height:139px;margin-bottom:0;padding:22px 7px;position:relative;overflow:hidden;isolation:isolate}.page-head>div{position:relative;z-index:2}.page-head>div:first-child{max-width:76%}.page-head:before{content:"";position:absolute;top:-70px;right:34%;width:50px;height:300px;background:linear-gradient(90deg,#0079bc,#0061a2);transform:rotate(36deg);box-shadow:28px 0 #064779,31px 0 #d0a640,-46px 0 #69a5d25c,-90px 0 #99c1df2e;z-index:0}.page-head:after{content:"";position:absolute;right:21%;top:10px;width:125px;height:125px;background:#72a8d4;opacity:.25;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,80% 94%,50% 72%,20% 94%,32% 57%,2% 35%,39% 35%);z-index:0}.page-head h1,.page-head .sub{position:relative;text-shadow:0 0 12px var(--paper),0 0 25px var(--paper)}.page-head .claim{font-weight:400;font-style:italic;border-left:2px solid var(--accent);font-size:22px;line-height:1.12;padding:5px 24px 5px 28px;min-width:180px}.claim em{color:#a16c09;font-style:inherit}.breadcrumb{margin:0 0 9px;font-size:12px;color:#4475b5}.grid{gap:16px}.two{grid-template-columns:minmax(0,1.65fr) minmax(285px,1fr)}.card{padding:19px;border-radius:10px;border:1px solid #e1ebf4;box-shadow:0 4px 20px #205b8610;background:#ffffffed}.card-head{margin-bottom:15px;gap:10px}.card-head h2{gap:12px}.card-head h2>.icon{height:29px;width:29px;color:#052c56}.stats{gap:15px;margin-bottom:16px}.stat{min-height:146px;position:relative;overflow:hidden;padding:20px 23px;gap:22px;isolation:isolate}.stat:after{content:"";position:absolute;right:10px;top:-20px;width:17px;height:230px;transform:rotate(35deg);background:#dceaf93d;box-shadow:23px 0 #dceaf935;z-index:-1}.stat-symbol{width:73px;height:73px;border-radius:50%;display:grid!important;place-items:center;background:#e4f1ff;flex-shrink:0;margin:0!important}.stat .icon{width:38px;height:38px;color:#064178}.stat strong{font-size:43px;letter-spacing:-1px;font-weight:700}.stat span{font-size:17px;margin-top:4px}.stat small{font-size:12px;margin-top:8px}.btn{background:linear-gradient(110deg,#084774,#052f53);border:1px solid #053454;border-radius:5px;font-weight:600;padding:10px 17px}.btn.secondary,.btn.ghost{background:#fff;color:#0b3563}.btn.small{font-size:12px}.link{color:#0756bd;font-size:13px}.link .icon{width:17px}.table-wrap table{font-size:13px}.table-wrap th{background:#edf4fa;color:#0b3063;font-size:12px;font-weight:600;padding:11px 10px}.table-wrap td{padding:12px 10px;border-bottom-color:#e3edf7}.table-wrap td .link{font-size:13px;text-align:left;line-height:1.4}.pill{font-size:11px;border-radius:5px;padding:6px 10px;background:#e8f2ff;color:#125ba4}.pill.good{background:#e2f8ee;color:#087741}.pill.warn{background:#fff4df;color:#a6690c}.pill.bad{background:#fdebf0;color:#b8083f}.pill.blue{background:#e5f1ff;color:#095bb5}.alert-row{background:#fcf1f5;border-radius:6px;padding:17px;line-height:1.4}.alert-row .icon{color:#ac1543}.alert-row small{color:#5079b2}.quick{border-radius:7px;background:#eaf4ff;padding:21px 16px;min-height:101px}.quick:nth-child(even){background:#fff7e9}.quick .icon{color:#07437b;width:37px;height:37px}.quick:nth-child(even) .icon{color:#99651b}.quick small{font-size:12px;line-height:1.35}.gap-top{margin-top:16px}.daybox{border-radius:6px;background:white;padding:11px 7px;font-size:12px}.daybox small{font-size:11px}.daybox strong{font-size:20px}.daybox.today{background:#fff8e9;border-color:#c29433}.banner{background:linear-gradient(110deg,#ffffff 40%,#e4f3fc);border:1px solid var(--line);padding:27px 30px;min-height:139px;margin-bottom:12px;border-radius:10px;isolation:isolate}.banner>div:first-child{position:relative;z-index:2;max-width:76%}.banner h2{font-size:40px;color:#061c50}.banner p{font-size:16px;color:#375f9f;margin-top:6px}.banner:before{content:"";position:absolute;right:100px;top:-60px;height:310px;width:25px;transform:rotate(36deg);background:#064a7d;border-right:2px solid #d5a52b;box-shadow:-26px 0 #0b6dad,-53px 0 #64a9d85c,-80px 0 #b8d7ec69;z-index:0}.motif{display:block;position:relative;margin:0;width:155px;height:90px;color:#082e55;flex-shrink:0}.motif i{display:none}.motif:before{content:"";position:absolute;left:22px;top:0;width:45px;height:45px;background:linear-gradient(135deg,#e5cd88,#b78418);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,80% 94%,50% 72%,20% 94%,32% 57%,2% 35%,39% 35%)}.motif:after{content:"MISMAS RAÍCES\A MÁS FUTURO";white-space:pre;position:absolute;left:0;bottom:0;font:10px/1.7 "Segoe UI",Arial,sans-serif;letter-spacing:3px;text-align:center}.banner .motif{width:128px;height:90px;opacity:1}.tabs{border-radius:5px;background:#eaf3ff;padding:3px;gap:0;margin-bottom:4px}.tabs button{font-size:12px;color:#0c4fa8;padding:9px 12px;border-radius:4px}.task-card{padding:20px 0;gap:16px}.subject-icon{width:52px;height:52px;border-radius:10px;background:#fff0df;color:#f37b13}.subject-icon .icon{width:31px;height:31px}.subject-icon.math{background:#fff0e0;color:#f4790b}.subject-icon.language{background:#fdebf0;color:#bf1451}.subject-icon.history{background:#f4eaff;color:#963cc3}.subject-icon.science{background:#e7f8ec;color:#00a05a}.subject-icon.english{background:#e8f1ff;color:#0066df}.subject-icon.art{background:#fff7df;color:#d99c02}.task-body .subject{color:#0d2e60}.task-body h3{font-size:15px;line-height:1.3;margin:4px 0}.task-body p{color:#5274a8;font-size:12px;line-height:1.4}.task-body small{display:block;font-size:11px;margin-top:7px}.task-controls{gap:8px}.calendar{gap:6px}.calendar button{font-size:14px}.calendar .weekday{font-size:12px;color:#143568}.calendar button.has:after{background:#087fe0;width:5px;height:5px}.calendar .today{background:#053655}.calendar+*{margin-top:0}.form-grid{gap:18px}.field{gap:6px;margin-bottom:15px}.field label{font-size:14px}.field small{font-size:11px}.field input:not([type=checkbox]):not([type=color]),.field textarea,.field select{border-color:#c5d8ed;border-radius:5px;min-height:39px;font-size:14px;padding:8px 11px}.field textarea{min-height:99px}.preview{background:linear-gradient(130deg,#f7fbff,#eef6fd);position:relative;overflow:hidden}.preview-paper{border:1px solid #eef3f8;box-shadow:0 5px 20px #1e54700a;padding:29px;background:white;position:relative;overflow:hidden;isolation:isolate}.preview-paper:before{content:"";position:absolute;top:-90px;right:15px;width:22px;height:235px;transform:rotate(35deg);background:#075184;box-shadow:3px 0 #c3962b,-25px 0 #82b6de70,-49px 0 #bbd8ee50;z-index:-1}.preview-paper h2{font-size:25px;line-height:1.25}.preview-meta{font-size:15px;gap:17px}.preview-meta .row{gap:17px}.preview-meta .row .icon{color:#06355f;width:27px;height:27px}.preview>.section-rule{display:flex;align-items:center;justify-content:space-between}.preview>.section-rule .eyebrow{font-size:10px;letter-spacing:3px;color:#285b9b;margin:0}.preview>.section-rule .motif{width:65px;height:45px;opacity:.28}.preview>.section-rule .motif:after{display:none}.eyebrow{color:#204d82;font-size:11px;letter-spacing:2.5px}.instructions{font-size:14px}.family-card{border-radius:6px;background:#f0f7ff;border:1px solid #bcd6f2;padding:16px;gap:22px;position:relative}.family-card:after{content:"›";margin-left:auto;font-size:28px}.family-card.active{border-color:#dd6596;background:#fff6f9}.family-card .avatar{height:54px;width:54px;background:#459dea;color:white;font-size:21px}.family-card.active .avatar{background:#d94d8b}.family-card strong{font-family:Georgia,serif;font-size:24px}.family-card small{font-size:13px}.summary{padding:19px 0 9px;gap:0}.summary>div{padding:0 14px;flex:1;border-right:1px solid #dce7f4}.summary>div:last-child{border:0}.summary .icon{height:31px;width:31px;color:#0963bb}.summary>div:nth-child(2) .icon{color:#b07715}.summary>div:nth-child(3) .icon{color:#07834e}.summary strong{font:700 38px Georgia,serif}.summary span{font-size:14px;line-height:1.4}.toggle-row input[type=checkbox]{appearance:none;width:44px;height:24px;border-radius:16px;background:#cad8e9;position:relative;cursor:pointer;margin:0}.toggle-row input:before{content:"";position:absolute;height:18px;width:18px;border-radius:50%;background:white;left:3px;top:3px;box-shadow:0 1px 3px #0002;transition:transform .15s}.toggle-row input:checked{background:#063462}.toggle-row input:checked:before{transform:translateX(20px)}.toggle-row small{font-size:12px}.teacher{padding:11px 0;margin:0;border-bottom:1px solid #edf2f8;font-size:14px}.teacher:last-child{border-bottom:0}.teacher small{font-size:12px}.teacher .avatar{background:#e2f0ff;color:#164b86}.teacher:nth-child(3n) .avatar{background:#e3f5ec;color:#057d58}.teacher:nth-child(4n) .avatar{background:#fff0df;color:#8b570b}.group-week{gap:5px}.group-day{padding:5px;min-height:155px;background:#f6faff;border-radius:5px}.group-day header{padding:5px 0 10px;color:#113a70}.calendar-task{border-left:2px solid #278dc6;background:white;color:#24589d;padding:9px 7px;font-size:11px;border-radius:4px;box-shadow:0 1px 4px #1a537a0a}.calendar-task strong{font-size:12px;color:#083c74}.progress span{background:#32b684}.notice{background:#eaf3fb;border-left:3px solid var(--accent)}.empty{padding:38px 16px;color:#607ea5}.empty strong{font-family:Georgia,serif;font-size:21px}.empty .icon{color:#1a689e}.footer{font-size:10px;color:#6b87a5}.toolbar{padding:12px 0;margin-bottom:8px}.preview-badge{margin:0}.login-identity{position:relative;overflow:hidden;background:linear-gradient(130deg,#052540,#074879 68%,#06304e);padding:6vh 6vw;isolation:isolate}.login-identity:before{content:"";position:absolute;right:10%;top:-15%;width:100px;height:140%;transform:rotate(30deg);background:#03619455;border-right:3px solid #b99139;box-shadow:60px 0 #07334c66,-70px 0 #0c6da233;z-index:-1}.login-identity .brand-text{max-width:320px;font-size:48px}.login-identity .brand-text small,.login-identity .brand-text span{color:white}.login-identity .brand-text em{font-size:18px}.login-identity h1{font-size:45px;margin:22px 0}.official-crest{width:100px;height:100px;object-fit:cover;border:1px solid #bb973f70;border-radius:14px;box-shadow:0 8px 25px #00162b30;margin-bottom:16px}.login-identity .motif{color:white;width:150px;height:90px;margin-top:26px}.login-identity>p{font-size:12px;color:#d4e6f4}.login-box{background:radial-gradient(circle at 100% 0,#e3f1fb,transparent 60%),#f8fbfd}.login-box h2{font-size:32px}.login-box .eyebrow:before{content:"";display:block;width:35px;height:2px;background:var(--accent);margin-bottom:18px}.shell[data-view="teacher"] .two{grid-template-columns:1.3fr 1fr}.shell[data-view="student"] .two{grid-template-columns:1.85fr 1fr}.shell[data-view="student"] .stats .stat{padding:18px 14px;gap:16px;min-height:126px}.shell[data-view="student"] .stat-symbol{width:55px;height:61px;border-radius:12px;background:#fff0f5}.shell[data-view="student"] .stat .icon{color:#b81247;width:32px;height:32px}.shell[data-view="student"] .stat:nth-child(2) .stat-symbol{background:#fff7e8}.shell[data-view="student"] .stat:nth-child(2) .icon{color:#d49a1d}.shell[data-view="student"] .stat:nth-child(3) .stat-symbol{background:#e9f9ef}.shell[data-view="student"] .stat:nth-child(3) .icon{color:#05a659}.shell[data-view="groups"] .two{grid-template-columns:2.5fr 1fr}.shell[data-view="groups"] .stat{min-height:112px;padding:18px;gap:15px}.shell[data-view="groups"] .stat-symbol{height:65px;width:65px}.shell[data-view="groups"] .stat span{font-size:14px}.shell[data-view="family"] .two{grid-template-columns:1.5fr 1fr}.shell[data-view="family"] .two>div:last-child>.card:first-child{background:#fffaf0}.shell.menu-collapsed .sidebar{transform:translateX(-100%)}.shell.menu-collapsed .main{margin-left:0}
@media(min-width:1500px){.card{padding:20px}.stat{min-height:158px;padding:22px 26px}.topbar{padding:0 30px}.content{padding:0 23px 14px}.sidebar nav button{min-height:52px;font-size:18px}.brand{padding-bottom:28px}.sidebar-foot{padding-bottom:65px}}
@media(max-width:1250px){.topbar .tagline{display:none}.page-head:before{right:26%;opacity:.5}.page-head:after{right:12%}.page-head .claim{display:none}.page-head>div:first-child{max-width:100%}.stat{gap:13px;padding:17px}.stat-symbol{width:55px;height:55px}.stat .icon{width:30px;height:30px}.stat strong{font-size:36px}.stat span{font-size:14px}.card-head h2{font-size:21px}.shell[data-view="groups"] .two,.shell[data-view="student"] .two{grid-template-columns:1.65fr 1fr}.banner h2{font-size:34px}.banner p{font-size:14px}.sidebar-foot{padding:55px 20px 35px}.task-card{flex-wrap:wrap}.task-controls{flex-direction:row;margin-left:68px;align-items:center}.shell[data-view="student"] .stats .stat{padding:16px 11px;gap:10px}.shell[data-view="student"] .stat-symbol{width:39px;height:45px}.shell[data-view="student"] .stat .icon{width:25px;height:25px}}
@media(max-width:1000px){:root{--side-width:210px}.brand-text{font-size:29px}.brand-text em{font-size:12px;letter-spacing:2px}.brand-text span{font-size:7px;letter-spacing:1px}.sidebar nav button{font-size:14px;padding:10px 12px;gap:12px}.sidebar nav button .icon{width:24px;height:24px}.content{padding:0 18px 15px}.stat-symbol{width:45px;height:45px}.stat{gap:10px}.stat strong{font-size:31px}.stat small{font-size:10px}.card{padding:16px}.two,.shell[data-view="family"] .two,.shell[data-view="student"] .two,.shell[data-view="groups"] .two{grid-template-columns:1fr}.shell[data-view="teacher"] .two{grid-template-columns:1fr 1fr}.banner .motif{height:80px}.sidebar-foot{padding-bottom:25px}.motto{font-size:20px}}
@media(max-width:850px){.sidebar{width:260px;transform:translateX(-100%)}.sidebar.open{transform:translateX(0)}.main{margin-left:0}.brand-text{font-size:37px}.brand-text em{font-size:15px}.brand-text span{font-size:8px}.sidebar nav button{font-size:16px;min-height:48px}.sidebar-foot{padding-top:50px}.topbar{height:62px;padding:0 18px}.top-actions{gap:11px}.top-actions>.icon-btn:first-child{padding-right:12px}.top-actions .icon{width:23px;height:23px}.hamburger{padding-right:16px}.user .avatar{width:37px;height:37px;font-size:14px}.page-head{min-height:126px;padding:23px 2px}.page-head:before{right:15%}.page-head:after{right:0;width:105px;height:105px}.page-head>div:first-child{max-width:100%}.page-head h1{font-size:38px}.sub{font-size:16px}.login-identity{display:none}.login-box{min-height:100vh}.shell[data-view="teacher"] .two{grid-template-columns:1fr}.shell.menu-collapsed .sidebar.open{transform:translateX(0)}}
@media(max-width:520px){.content{padding:0 13px 12px}.page-head h1{font-size:31px;letter-spacing:-1px}.page-head{min-height:125px}.page-head .sub{font-size:14px}.user strong{max-width:110px;font-size:12px}.user small{font-size:10px}.top-actions{gap:7px}.top-actions>.icon-btn:first-child{border:0;padding-right:5px}.topbar{gap:8px}.card{padding:15px}.card-head h2{font-size:21px}.stats{gap:9px}.stat{min-height:100px;padding:15px;gap:12px}.stat:last-child{min-height:86px}.stat-symbol{height:43px;width:43px}.stat strong{font-size:32px}.stat span{font-size:13px}.banner{padding:24px 20px;min-height:133px}.banner>div:first-child{max-width:82%}.banner h2{font-size:31px}.banner .motif{display:none}.banner:before{right:0;opacity:.6}.task-controls{margin-left:0;flex-wrap:wrap}.task-body h3{font-size:14px}.task-card{gap:11px}.subject-icon{width:43px;height:46px}.calendar button{font-size:13px}.preview-paper{padding:20px}.summary>div{padding:0 9px}.summary span{font-size:12px}.shell[data-view="student"] .stats .stat{min-height:100px}.family-card{padding:14px}.equal{grid-template-columns:1fr}.split-actions{grid-template-columns:1fr}.login-box{padding:28px}.login-box h2{font-size:30px}}
@media print{.page-head:before,.page-head:after,.banner:before{display:none}.sidebar{display:none}.main{margin-left:0}.card{box-shadow:none}.page-head{min-height:auto}.content{padding:0}}

.table-wrap .subject-icon{width:28px;height:30px;border-radius:5px}.table-wrap .subject-icon .icon{width:20px;height:20px;color:inherit}.table-wrap td .link{gap:10px}.shell[data-view="family"] .table-wrap td{padding:13px 8px}.shell[data-view="family"] .table-wrap th{padding:10px 8px}.shell[data-view="family"] .table-wrap td:first-child{min-width:110px}.shell[data-view="family"] .table-wrap td .link{padding:0}
@media(max-height:800px) and (min-width:851px){.sidebar{padding-top:18px;padding-bottom:18px}.brand{min-height:115px;padding-bottom:22px}.sidebar nav{gap:3px}.sidebar nav button{min-height:44px;padding-top:8px;padding-bottom:8px;font-size:15px}.sidebar nav button .icon{width:25px;height:25px}.sidebar-foot{padding:25px 22px 12px}.motto{font-size:20px}.motto:before{margin-bottom:14px}.sidebar:after{bottom:113px;width:105px;height:105px;opacity:.12}}
.banner .motif:after{text-shadow:0 0 5px white,0 0 10px white;background:#f5fbffb8;padding:3px 5px;border-radius:3px}.shell[data-view="teacher"] .page-head .sub{font-size:17px;max-width:750px}.shell[data-view="teacher"] .page-head>div:first-child{max-width:75%}@media(max-width:850px){.shell[data-view="teacher"] .page-head>div:first-child{max-width:100%}.shell[data-view="teacher"] .page-head .sub{font-size:14px}}