/* Manual de Marca Fogler, secciones 2, 3, 5, 8 y 9; revisión 2026-09-23. */
:root{
 --fo-naranja:#F2823C;--fo-morado:#814FB3;--fo-lavanda:#B8A1D2;--fo-negro:#050405;--fo-blanco:#FFFFFF;--fo-crema:#FBF7F2;
 --fo-grad:linear-gradient(135deg,#35283F 0%,#814FB3 45%,#CF8A9C 75%,#F2823C 100%);
 --fo-nube:radial-gradient(60% 45% at 15% 95%,rgba(129,79,179,.55),transparent 70%),radial-gradient(55% 40% at 55% 100%,rgba(207,138,156,.55),transparent 70%),radial-gradient(60% 45% at 95% 95%,rgba(242,130,60,.6),transparent 70%),#FBF7F2;
 --fo-sombra:0 10px 30px rgba(21,13,31,.10);--fo-foco:0 0 0 4px rgba(129,79,179,.18);
 --muted:var(--fo-lavanda);--line:rgba(184,161,210,.22);--panel:var(--fo-negro);
}
.shell,.login{border-top:0}.shell::before,.login::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--fo-grad);z-index:10;pointer-events:none}
.wordmark{display:inline-flex;align-items:center;gap:24px;font-weight:800}.brand-icon{width:28px;height:28px;flex:none}.sidebar .wordmark{font-size:1.8rem}.brand-label{letter-spacing:.12em;font-size:.65rem}
.btn{font-size:1.0625rem;font-weight:600;border-radius:999px;padding:16px 30px;min-height:54px;background:var(--fo-naranja);color:var(--fo-negro)}
.btn.secondary,.btn.ghost{background:transparent;border:2px solid var(--fo-blanco);color:var(--fo-blanco)}.btn:hover{filter:none;box-shadow:var(--fo-foco)}
.hero{background:radial-gradient(ellipse at 88% 45%,rgba(129,79,179,.3),transparent 58%),var(--fo-negro);border-color:rgba(184,161,210,.35);border-radius:22px}
.hero .eyebrow{color:var(--fo-naranja)}.hero p{color:var(--fo-lavanda)}.hero-emphasis{color:var(--fo-naranja)}.fo-hl{background:var(--fo-naranja);color:var(--fo-negro);padding:0 .18em;border-radius:.14em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hero-img{mix-blend-mode:normal;opacity:1}.hero-copy{padding-top:34px;padding-bottom:34px}
.phase{background:var(--fo-blanco);border:0;border-radius:22px;box-shadow:var(--fo-sombra);color:var(--fo-negro);transform:none!important}.phase:hover{box-shadow:0 10px 30px rgba(129,79,179,.18)}
.phase .phase-art,.phase:nth-child(2) .phase-art,.phase:nth-child(3) .phase-art{background:var(--fo-grad)}
.phase-no,.phase-art svg{color:var(--fo-blanco);text-shadow:0 2px 8px rgba(5,4,5,.3)}.phase-art svg{filter:drop-shadow(0 2px 5px rgba(5,4,5,.3))}
.phase-body{padding:28px}.phase-body h3{color:var(--fo-morado);letter-spacing:-.01em;font-weight:800}.phase-body .eyebrow{color:var(--fo-morado)}.phase-body p,.phase-foot{color:var(--fo-negro)}.phase-foot{border-color:#D9CFE6}
.stat{border-radius:22px;background:rgba(129,79,179,.06)}.stat strong{font-weight:800}.stat svg{color:var(--fo-lavanda)}
.panel{background:var(--fo-blanco);color:var(--fo-negro);border:0;border-radius:22px;box-shadow:var(--fo-sombra);padding:28px}.panel h2,.panel h3{color:var(--fo-morado)}.panel .muted,.panel .prose,.panel .help,.panel label small{color:var(--fo-negro)}.panel .eyebrow{color:var(--fo-morado)}.panel .btn.ghost,.panel .btn.secondary{border-color:var(--fo-negro);color:var(--fo-negro)}.panel .materials a{color:var(--fo-morado)}.panel .tag{background:rgba(129,79,179,.1);color:var(--fo-morado)}.panel .tag.orange{background:rgba(242,130,60,.22);color:var(--fo-negro)}
.feedback{background:rgba(184,161,210,.16);border-color:var(--fo-morado);color:var(--fo-negro)}
.form input,.form textarea,.form select{border:1.5px solid #D9CFE6;border-radius:14px;padding:14px 16px;color:var(--fo-negro);background:var(--fo-blanco);font-size:1rem;color-scheme:light;font-weight:400}
.form input:focus,.form textarea:focus,.form select:focus{outline:none;border-color:var(--fo-morado);box-shadow:var(--fo-foco)}
.form label{font-weight:600;font-size:.875rem}.form input[type=file]::file-selector-button{background:var(--fo-morado);color:var(--fo-blanco);border-radius:999px;font-weight:600}.form .error{color:#B3261E;font-weight:600}.form input[aria-invalid=true],.form textarea[aria-invalid=true],.form select[aria-invalid=true]{border-color:#B3261E}.form .check input{accent-color:var(--fo-morado)}
.form input::placeholder,.form textarea::placeholder{color:#66586F}
dialog{background:var(--fo-nube);color:var(--fo-negro);border:0;border-radius:22px;box-shadow:var(--fo-sombra)}dialog::backdrop{background:rgba(5,4,5,.8);backdrop-filter:none}.dialog-head{background:var(--fo-blanco);border-color:#D9CFE6}.dialog-head h2{color:var(--fo-morado)}.dialog-head .icon-btn{color:var(--fo-negro)}.dialog-body{padding:28px}.dialog-body .form{background:var(--fo-blanco);padding:28px;border-radius:22px;box-shadow:var(--fo-sombra)}.dialog-body .form .help,.dialog-body .form label small,.dialog-body .help,.dialog-body .muted{color:var(--fo-negro)}.dialog-body .btn.secondary,.dialog-body .btn.ghost{border-color:var(--fo-negro);color:var(--fo-negro)}.dialog-body .materials a{color:var(--fo-morado)}.dialog-body .icon-btn{color:var(--fo-morado)}.dialog-body .notice{background:var(--fo-blanco);color:var(--fo-negro);border-color:#D9CFE6}.dialog-body .divider{background:#D9CFE6}
.login-form{background:var(--fo-nube);color:var(--fo-negro);padding:70px 12%}.login-form h2{color:var(--fo-morado);font-size:2rem;line-height:1.35}.login-form .eyebrow{color:var(--fo-morado)}.login-form>p,.login-footer{color:var(--fo-negro)}.login-form .form{background:var(--fo-blanco);border-radius:22px;box-shadow:var(--fo-sombra);padding:28px}.login-visual{background:radial-gradient(ellipse at 75% 40%,rgba(129,79,179,.2),transparent 70%),var(--fo-negro)}.login-visual img{opacity:1}.login-form .wordmark{color:var(--fo-negro)}.login-fo{width:72px;height:72px;object-fit:cover;align-self:start;justify-self:start;margin-bottom:20px;border-radius:50%}
.nav button.active{background:rgba(129,79,179,.22)}.nav button:hover{background:rgba(129,79,179,.12)}.avatar{background:var(--fo-morado);border:0;color:var(--fo-blanco)}.sidebar-note{border-color:var(--line)}.notice{border-radius:14px}.tag{background:rgba(129,79,179,.18);color:var(--fo-lavanda)}.footer{color:var(--fo-lavanda)}
.lesson-row{background:rgba(129,79,179,.05);border-radius:14px}.filters button.active{background:var(--fo-morado);border-color:var(--fo-morado);color:var(--fo-blanco)}.sub-count{background:var(--fo-morado)}
@media(max-width:800px){.page-head .btn,.section-head .btn{font-size:.9375rem;padding:14px 20px}.phase-body{padding:22px}.login-form{padding:50px 8%}}
@media(max-width:580px){.btn{font-size:1rem;padding:14px 22px}.hero-copy{padding:26px 22px;max-width:90%}.hero-img{right:-100px;opacity:1}.phase-body{padding:22px}.phase-body .eyebrow,.phase-foot{font-size:.75rem}.phase-body p{font-size:.875rem}.stat span{font-size:.75rem}.nav button{font-size:.875rem}.footer{font-size:.75rem;flex-wrap:wrap}.dialog-body{padding:18px}.dialog-body .form{padding:20px}.login-form{padding:32px 22px;min-height:100dvh}.login-form .wordmark{display:inline-flex;margin-bottom:32px}.login-form .form{padding:24px}.login-form h2{font-size:1.85rem}.login-fo{width:56px;height:56px}.section-head .btn{font-size:.875rem;padding:12px 16px}.brand-icon{width:26px;height:26px}.panel{padding:24px}}
.empty{border-color:rgba(184,161,210,.4);border-radius:22px}.icon-btn:hover{background:rgba(129,79,179,.18)}.tag.orange{background:rgba(242,130,60,.12);color:var(--fo-naranja)}.panel .tag.orange{background:rgba(242,130,60,.22);color:var(--fo-negro)}.progress::-webkit-progress-bar{background:rgba(129,79,179,.18)}.progress::-webkit-progress-value{background:var(--fo-morado)}

/* Thinking Orbs: only visible while a real request is pending. */
.orb-status{position:fixed;right:24px;bottom:24px;z-index:1000;display:flex;align-items:center;gap:8px;padding:8px 18px 8px 8px;border:1px solid #D9CFE6;border-radius:22px;background:#FBF7F2;color:#050405;box-shadow:0 10px 30px rgba(21,13,31,.1);font-size:14px;pointer-events:none;max-width:calc(100vw - 32px)}
.orb-status[hidden]{display:none}.orb-status canvas{width:48px;height:48px;flex:none}
@media(max-width:600px){.orb-status{right:16px;bottom:16px}}