/* JARVIS Homeschool — Base Styles: variables, resets, animations, shared, landing, login */

    :root{
      --cream:#FDFBF7;--cream-d:#F5F0E8;--gold:#F5A623;--gold-dk:#D98F10;--gold-lt:#FFF3D6;
      --sky:#4AADE8;--sky-lt:#EAF5FD;--mint:#4CAF88;--mint-lt:#E8F5EE;
      --coral:#FF7F6E;--coral-lt:#FFF0EE;--navy:#1A2B4A;--slate:#2D3E55;--slate-lt:#5A718A;
      --gray-100:#F8F6F2;--gray-200:#EDEBE5;--gray-300:#D5D2C8;--white:#FFFFFF;
      --shadow-sm:0 2px 8px rgba(26,43,74,0.08);--shadow-md:0 4px 20px rgba(26,43,74,0.12);
      --shadow-lg:0 8px 40px rgba(26,43,74,0.15);
      --r-sm:10px;--r-md:16px;--r-lg:24px;
      --font-c:'Nunito',sans-serif;--font-a:'Inter',sans-serif;
    }
    *,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
    html,body{height:100%;}
    body{font-family:var(--font-a);background:var(--cream);color:var(--navy);min-height:100vh;overflow-x:hidden;}
    button{font-family:inherit;cursor:pointer;}
    input{font-family:inherit;}
    .screen{display:none;min-height:100vh;}
    .screen.active{display:flex;}

    @keyframes spin{to{transform:rotate(360deg);}}
    @keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
    @keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}
    @keyframes pop{0%{transform:scale(0.9);opacity:0}60%{transform:scale(1.04)}100%{transform:scale(1);opacity:1}}
    @keyframes slideUp{0%{transform:translateY(20px);opacity:0}100%{transform:translateY(0);opacity:1}}
    @keyframes xpBurst{0%{transform:scale(0) translateY(0);opacity:1}70%{transform:scale(1.4) translateY(-40px);opacity:1}100%{transform:scale(1) translateY(-60px);opacity:0}}
    @keyframes confettiFall{0%{transform:translateY(-10px) rotate(0deg);opacity:1}100%{transform:translateY(130px) rotate(540deg);opacity:0}}
    @keyframes pulseGold{0%,100%{box-shadow:0 0 0 0 rgba(245,166,35,0.35)}50%{box-shadow:0 0 0 10px rgba(245,166,35,0)}}
    @keyframes jarvisFade{0%{opacity:0;transform:scale(0.94)}100%{opacity:1;transform:scale(1)}}
    @keyframes timerWarn{0%,100%{color:var(--coral)}50%{color:#e63030}}
    @keyframes statPop{0%{transform:scale(1)}50%{transform:scale(1.3)}100%{transform:scale(1)}}

    /* SHARED */
    .btn-gold{padding:14px 28px;background:var(--gold);color:var(--navy);border:none;border-radius:var(--r-sm);font-size:16px;font-weight:800;font-family:var(--font-c);transition:all 0.18s;}
    .btn-gold:hover{background:var(--gold-dk);transform:translateY(-2px);box-shadow:var(--shadow-sm);}
    .btn-gold:active{transform:translateY(0);}
    .back-link{background:none;border:none;color:var(--slate-lt);font-family:var(--font-c);font-weight:600;font-size:14px;cursor:pointer;padding:8px;display:inline-flex;align-items:center;gap:5px;transition:color 0.2s;}
    .back-link:hover{color:var(--navy);}

    /* LOADING */
    #screen-loading{flex-direction:column;align-items:center;justify-content:center;gap:24px;}
    .loading-icon{width:80px;height:80px;background:var(--gold);border-radius:24px;display:flex;align-items:center;justify-content:center;font-family:var(--font-c);font-weight:900;font-size:42px;color:var(--navy);}
    .loading-ring{width:40px;height:40px;border:3px solid var(--gray-200);border-top-color:var(--gold);border-radius:50%;animation:spin 0.75s linear infinite;}
    .loading-label{font-family:var(--font-c);font-size:15px;color:var(--slate-lt);font-weight:600;}

    /* LANDING */
    #screen-landing{flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;position:relative;overflow:hidden;}
    #screen-landing::before{content:'';position:absolute;top:-120px;right:-120px;width:400px;height:400px;background:radial-gradient(circle,rgba(245,166,35,0.09) 0%,transparent 70%);pointer-events:none;}
    #screen-landing::after{content:'';position:absolute;bottom:-80px;left:-80px;width:300px;height:300px;background:radial-gradient(circle,rgba(74,173,232,0.09) 0%,transparent 70%);pointer-events:none;}
    .land-hero{text-align:center;margin-bottom:48px;}
    .land-icon{width:96px;height:96px;background:var(--gold);border-radius:30px;display:flex;align-items:center;justify-content:center;font-family:var(--font-c);font-weight:900;font-size:52px;color:var(--navy);box-shadow:0 10px 36px rgba(245,166,35,0.38);margin:0 auto 18px;}
    .land-title{font-family:var(--font-c);font-weight:900;font-size:38px;color:var(--navy);letter-spacing:5px;margin-bottom:8px;}
    .land-sub{font-family:var(--font-c);font-size:13px;color:var(--slate-lt);max-width:260px;line-height:1.55;margin:0 auto;}
    .land-cards{display:flex;flex-direction:column;gap:14px;width:100%;max-width:360px;}
    .land-card{background:var(--white);border-radius:var(--r-lg);padding:22px 26px;cursor:pointer;box-shadow:var(--shadow-sm);border:2.5px solid transparent;transition:all 0.2s;display:flex;align-items:center;gap:18px;animation:pop 0.35s ease;}
    .land-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
    .land-card.child{background:linear-gradient(135deg,#FFF8EC,#FFFDF8);border-color:var(--gold);}
    .land-card.admin{border-color:var(--gray-200);}
    .land-card.admin:hover{border-color:var(--slate-lt);}
    .lc-emoji{font-size:42px;flex-shrink:0;}
    .lc-text h3{font-family:var(--font-c);font-weight:800;font-size:17px;margin-bottom:3px;}
    .lc-text p{font-size:13px;color:var(--slate-lt);}
    .land-card.child .lc-text h3{color:var(--gold-dk);}

    /* CHILD PIN LOGIN */
    #screen-child-login{flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;background:linear-gradient(160deg,#FFF8EC,var(--cream) 65%);}
    .cl-header{text-align:center;margin-bottom:28px;}
    .jarvis-face-pin{width:90px;height:90px;background:var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:48px;margin:0 auto 14px;box-shadow:0 6px 28px rgba(245,166,35,0.32);animation:float 3.2s ease-in-out infinite;}
    .cl-greeting{font-family:var(--font-c);font-weight:900;font-size:26px;color:var(--navy);margin-bottom:4px;}
    .cl-prompt{font-family:var(--font-c);font-size:16px;color:var(--slate-lt);}
    .pin-dots{display:flex;gap:14px;justify-content:center;margin-bottom:26px;}
    .pin-dot{width:18px;height:18px;border-radius:50%;border:3px solid var(--gray-300);background:transparent;transition:all 0.18s;}
    .pin-dot.filled{background:var(--gold);border-color:var(--gold);transform:scale(1.1);}
    .pin-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;max-width:272px;width:100%;margin-bottom:14px;}
    .pin-btn{aspect-ratio:1;border:none;border-radius:var(--r-md);background:var(--white);box-shadow:var(--shadow-sm);font-family:var(--font-c);font-weight:800;font-size:26px;color:var(--navy);transition:all 0.14s;display:flex;align-items:center;justify-content:center;user-select:none;}
    .pin-btn:hover{background:var(--gold-lt);transform:scale(1.06);}
    .pin-btn:active{transform:scale(0.94);}
    .pin-btn.zero{grid-column:2;}
    .pin-btn.del{background:var(--coral-lt);color:var(--coral);font-size:20px;}
    .pin-btn.del:hover{background:var(--coral);color:var(--white);}
    .child-err{font-family:var(--font-c);font-size:14px;color:var(--coral);text-align:center;min-height:20px;font-weight:700;}

    /* ADMIN LOGIN */
    #screen-admin-login{flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;}
    .al-card{background:var(--white);border-radius:var(--r-lg);padding:40px 36px;width:100%;max-width:400px;box-shadow:var(--shadow-md);animation:pop 0.3s ease;}
    .al-title{font-size:22px;font-weight:700;color:var(--navy);margin-bottom:3px;}
    .al-sub{font-size:13px;color:var(--slate-lt);margin-bottom:28px;}
    .fg{margin-bottom:18px;}
    .fg label{display:block;font-size:12px;font-weight:600;color:var(--slate);margin-bottom:7px;letter-spacing:0.3px;text-transform:uppercase;}
    .fg input{width:100%;padding:12px 15px;border:2px solid var(--gray-200);border-radius:var(--r-sm);font-size:15px;color:var(--navy);background:var(--cream);outline:none;transition:all 0.2s;}
    .fg input:focus{border-color:var(--gold);background:var(--white);}
    .btn-primary{width:100%;padding:14px;background:var(--navy);color:var(--white);border:none;border-radius:var(--r-sm);font-size:15px;font-weight:600;transition:all 0.2s;}
    .btn-primary:hover{background:var(--slate);transform:translateY(-1px);}
    .btn-primary:disabled{background:var(--gray-300);cursor:not-allowed;transform:none;}
    .al-err{font-size:13px;color:#dc3545;margin-top:12px;text-align:center;min-height:18px;}
    .al-divider{display:flex;align-items:center;gap:12px;margin:18px 0;}
    .al-divider::before,.al-divider::after{content:'';flex:1;height:1px;background:var(--gray-200);}
    .al-divider span{font-size:12px;color:var(--slate-lt);font-weight:600;white-space:nowrap;}
    .btn-google{width:100%;padding:13px;background:var(--white);color:var(--slate);border:2px solid var(--gray-200);border-radius:var(--r-sm);font-size:14px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:10px;transition:all 0.2s;cursor:pointer;}
    .btn-google:hover{border-color:var(--slate-lt);background:var(--gray-100);transform:translateY(-1px);box-shadow:var(--shadow-sm);}
    .btn-google:disabled{opacity:0.45;cursor:not-allowed;transform:none;box-shadow:none;}
    .btn-google svg{width:18px;height:18px;flex-shrink:0;}

/* ── Curriculum Generator Wizard ────────────────────────── */
.cg-subj-btn {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:10px 6px;border-radius:var(--r-sm);border:1.5px solid var(--gray-200);
  background:var(--gray-100);color:var(--slate);cursor:pointer;font-size:11px;
  font-weight:700;text-align:center;transition:all 0.15s;line-height:1.3;
}
.cg-subj-btn:hover { border-color:var(--navy);background:var(--navy);color:white; }
.cg-grade-btn {
  padding:10px 14px;border-radius:var(--r-sm);border:1.5px solid var(--gray-200);
  background:var(--white);color:var(--slate);cursor:pointer;font-size:13px;
  font-weight:700;text-align:left;transition:all 0.15s;width:100%;
}
.cg-grade-btn:hover { border-color:var(--gold);background:var(--gold-lt); }
.cg-voice-btn {
  padding:12px;border-radius:var(--r-sm);border:1.5px solid var(--gray-200);
  background:var(--gray-100);color:var(--slate);cursor:pointer;text-align:center;
  transition:all 0.15s;
}
.cg-voice-btn:hover { border-color:var(--navy);background:var(--navy);color:white; }
.cg-voice-btn:hover div { color:white !important; }
.cg-depth-btn {
  padding:14px 16px;border-radius:var(--r-sm);border:1.5px solid var(--gray-200);
  background:var(--white);color:var(--slate);cursor:pointer;text-align:left;
  transition:all 0.15s;width:100%;
}
.cg-depth-btn:hover { border-color:var(--navy);background:var(--navy); }
.cg-depth-btn:hover div { color:rgba(255,255,255,0.9) !important; }
.cg-qcount-btn {
  flex:1;padding:10px 8px;border-radius:var(--r-sm);border:1.5px solid var(--gray-200);
  background:var(--white);color:var(--slate);cursor:pointer;font-size:13px;
  font-weight:700;text-align:center;transition:all 0.15s;
}
.cg-qcount-btn:hover { border-color:var(--gold);background:var(--gold-lt); }