*{box-sizing:border-box}
:root{color-scheme:dark;--bg:#061226;--bg2:#0a1a33;--panel:#0d1e38;--panel2:#122847;--border:#203b60;--border2:#31547f;--text:#f3f7ff;--muted:#a9bad2;--accent:#e2b44f;--accent2:#f4d47d;--danger:#9f3f3f;--success:#26734d}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -10%,rgba(45,115,210,.24),transparent 38%),linear-gradient(180deg,#07162f,#040b18);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}
.container{width:min(1120px,calc(100% - 28px));margin:auto}.page{padding:24px 0 52px}
.topbar{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--border);background:rgba(5,17,36,.96);backdrop-filter:blur(14px)}
.topbar-inner{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{font-weight:900;letter-spacing:.1px}
.nav-actions,.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.actions{margin-top:14px}
.card{background:linear-gradient(180deg,#102441,#0b1a30);border:1px solid var(--border);border-radius:18px;padding:20px;box-shadow:0 18px 55px rgba(0,0,0,.28)}
.card+.card{margin-top:16px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.hero{padding:30px;margin-bottom:16px}.hero h1{margin:0 0 8px;font-size:clamp(1.8rem,5vw,2.8rem)}.hero p{color:var(--muted);line-height:1.6}
.btn{border:1px solid var(--border2);border-radius:11px;padding:10px 14px;background:#172b48;color:var(--text);transition:.15s}.btn:hover{filter:brightness(1.14);transform:translateY(-1px)}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#17130e;font-weight:800}.btn-success{background:#36583e;border-color:#4d7656}.btn-danger{background:#733232;border-color:#8d4242}.btn-warning{background:#745728;border-color:#9b7842}.btn-small{padding:7px 10px;font-size:.88rem}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.form{display:grid;gap:6px}label{font-weight:750;margin-top:7px}input,textarea,select{width:100%;border:1px solid #443a2f;border-radius:11px;background:#08162a;color:var(--text);padding:11px 12px;outline:none}input:focus,textarea:focus,select:focus{border-color:var(--accent2);box-shadow:0 0 0 3px rgba(176,141,87,.13)}textarea{resize:vertical}
.quiz-card{display:block;min-height:150px;padding:18px;border:1px solid var(--border);border-radius:15px;background:linear-gradient(180deg,#1b1916,#141311);transition:.15s}.quiz-card:hover{transform:translateY(-2px);border-color:#685943}.quiz-card h3{margin:0 0 8px}
.question{background:#0e0d0c;border:1px solid var(--border2);border-radius:16px;padding:20px}
.answer-grid{display:grid;gap:10px}.answer-grid .btn{text-align:left;min-height:52px}
.muted{color:var(--muted)}.small{font-size:.88rem}
.message{min-height:24px;margin-top:12px;border-radius:10px;padding:9px 11px}.message:empty{display:none}.message.info{background:#292219;color:#e9d5ad}.message.success{background:#16261a;color:#b9d6bd}.message.error{background:#321717;color:#efb8b8}.message.warning{background:#332615;color:#e7c78e}
.badge{display:inline-flex;padding:4px 8px;border-radius:999px;font-size:.78rem;font-weight:800;background:#1b3558}.badge-success{background:#203d28;color:#b9d6bd}.badge-warning{background:#4b371d;color:#ead09e}.badge-danger{background:#4b2020;color:#efb8b8}.badge-blue{background:#1b3c69;color:#dceaff}
.kpi{padding:18px;border-radius:14px;background:#122744;border:1px solid var(--border)}.kpi strong{display:block;font-size:1.8rem;margin-top:5px}
.stat-list{display:grid;gap:9px}.stat-row{display:flex;justify-content:space-between;gap:12px;padding:12px;background:#10233e;border:1px solid var(--border);border-radius:11px}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:650px}th,td{padding:11px 10px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle}th{color:#c8bca9;font-size:.88rem}
.empty{padding:24px;text-align:center;color:var(--muted);border:1px dashed var(--border2);border-radius:13px}
hr{border:0;border-top:1px solid var(--border)}
@media(max-width:650px){.container{width:min(100% - 18px,1120px)}.topbar-inner{padding:10px 0;align-items:flex-start}.hero,.card{padding:16px}.page{padding-top:14px}.nav-actions .btn{padding:7px 9px}.stat-row{flex-direction:column}.grid{grid-template-columns:1fr}}

.pix-box{margin-top:14px;padding:18px;border:1px solid var(--border2);border-radius:16px;background:#08162a;text-align:center}.pix-box h3{margin:0 0 6px}.qr-wrap{display:flex;justify-content:center;align-items:center;min-height:220px;margin:16px 0}.pix-qr{width:min(280px,80vw);height:auto;background:#fff;padding:10px;border-radius:12px}.pix-box label,.pix-box textarea{text-align:left}.pix-box textarea{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem}


.quiz-folder{margin-top:12px;border:1px solid var(--border,#2b2b2b);border-radius:16px;background:rgba(255,255,255,.02);overflow:hidden}
.quiz-folder:first-child{margin-top:0}
.quiz-folder-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 18px;cursor:pointer;list-style:none;user-select:none;transition:background .18s ease}
.quiz-folder-head::-webkit-details-marker{display:none}
.quiz-folder-head:hover{background:rgba(255,255,255,.035)}
.quiz-folder-title{display:flex;align-items:center;gap:13px;min-width:0}
.quiz-folder-icon{font-size:25px;line-height:1}
.quiz-folder-title strong{display:block;font-size:16px;line-height:1.25}
.quiz-folder-title .small{display:block;margin-top:3px}
.quiz-folder-arrow{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;font-size:28px;line-height:1;transform:rotate(0deg);transition:transform .18s ease,background .18s ease;flex:0 0 auto}
.quiz-folder-head:hover .quiz-folder-arrow{background:rgba(255,255,255,.06)}
.quiz-folder[open] .quiz-folder-arrow{transform:rotate(90deg)}
.quiz-folder[open] .quiz-folder-icon{filter:drop-shadow(0 0 5px rgba(255,196,0,.18))}
.quiz-folder-grid{margin:0;padding:0 18px 18px}
.admin-folder-row{display:grid;grid-template-columns:minmax(180px,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--border,#2b2b2b)}
.admin-folder-row:last-child{border-bottom:0}
@media(max-width:640px){.admin-folder-row{grid-template-columns:1fr}.quiz-folder{padding:12px}}

/* V12 — matérias em páginas próprias */
.subject-card{display:flex;flex-direction:column;min-height:190px;padding:20px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(145deg,#191714,#11100f);box-shadow:0 12px 30px rgba(0,0,0,.18);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;position:relative;overflow:hidden}
.subject-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(176,141,87,.08),transparent 55%);pointer-events:none}
.subject-card:hover{transform:translateY(-4px);border-color:#69583f;box-shadow:0 18px 40px rgba(0,0,0,.3)}
.subject-card-top{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}
.subject-card-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:#211d17;border:1px solid #40372b;font-size:23px}
.subject-card-arrow{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#1d1a16;color:var(--accent2);font-size:20px;transition:transform .18s ease}
.subject-card:hover .subject-card-arrow{transform:translateX(3px)}
.subject-card-body{position:relative;z-index:1;margin-top:18px;flex:1}.subject-card-body h3{margin:0;font-size:1.05rem;line-height:1.35}.subject-card-body p{margin:7px 0 0;color:var(--muted);font-size:.9rem}
.subject-card-open{position:relative;z-index:1;margin-top:14px;color:var(--accent2);font-size:.86rem;font-weight:800}
.subject-page-head{margin-bottom:16px;padding:26px 28px}.subject-page-head h1{margin:5px 0 4px;font-size:clamp(1.7rem,4vw,2.35rem)}
.subject-quiz-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.subject-quiz-grid .quiz-card{min-height:185px;display:flex;flex-direction:column}
.quiz-card-number{font-size:.72rem;letter-spacing:.12em;color:var(--accent2);font-weight:900;margin-bottom:9px}.quiz-card h3{line-height:1.35}.quiz-card p{line-height:1.5}.quiz-card-action{margin-top:auto;padding-top:12px;color:var(--accent2);font-weight:800;font-size:.88rem}.quiz-card-locked .quiz-card-action{display:none}
@media(max-width:650px){.subject-card{min-height:170px}.subject-page-head{padding:20px}.subject-quiz-grid{grid-template-columns:1fr}}

/* V12 — matérias em páginas próprias */
.subject-card{display:flex;flex-direction:column;min-height:190px;padding:20px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(145deg,#191714,#11100f);box-shadow:0 12px 30px rgba(0,0,0,.18);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;position:relative;overflow:hidden}
.subject-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(176,141,87,.08),transparent 55%);pointer-events:none}
.subject-card:hover{transform:translateY(-4px);border-color:#69583f;box-shadow:0 18px 40px rgba(0,0,0,.3)}
.subject-card-top{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}
.subject-card-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:#211d17;border:1px solid #40372b;font-size:23px}
.subject-card-arrow{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#1d1a16;color:var(--accent2);font-size:20px;transition:transform .18s ease}.subject-card:hover .subject-card-arrow{transform:translateX(3px)}
.subject-card-body{position:relative;z-index:1;margin-top:18px;flex:1}.subject-card-body h3{margin:0;font-size:1.05rem;line-height:1.35}.subject-card-body p{margin:7px 0 0;color:var(--muted);font-size:.9rem}
.subject-card-open{position:relative;z-index:1;margin-top:14px;color:var(--accent2);font-size:.86rem;font-weight:800}
.subject-page-head{margin-bottom:16px;padding:26px 28px}.subject-page-head h1{margin:5px 0 4px;font-size:clamp(1.7rem,4vw,2.35rem)}
.subject-quiz-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.subject-quiz-grid .quiz-card{min-height:185px;display:flex;flex-direction:column}
.quiz-card-number{font-size:.72rem;letter-spacing:.12em;color:var(--accent2);font-weight:900;margin-bottom:9px}.quiz-card h3{line-height:1.35}.quiz-card p{line-height:1.5}.quiz-card-action{margin-top:auto;padding-top:12px;color:var(--accent2);font-weight:800;font-size:.88rem}.quiz-card-locked .quiz-card-action{display:none}
@media(max-width:650px){.subject-card{min-height:170px}.subject-page-head{padding:20px}.subject-quiz-grid{grid-template-columns:1fr}}

/* Layout didático V4 — foco na leitura, no progresso e no estudo mobile */
:root{--accent:#e3b54e;--accent2:#f5d77d}
.hero{position:relative;overflow:hidden;background:linear-gradient(125deg,#12345c,#0b1b33 68%);border-color:#285181}
.hero:after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;right:-70px;top:-80px;background:rgba(60,135,230,.12);pointer-events:none}
.hero p{max-width:760px;font-size:1.03rem}
.home-section-heading{display:flex;align-items:center;gap:10px;margin:0 0 8px}
.home-section-hint{margin:0 0 18px;color:var(--muted);font-size:.92rem;line-height:1.5}
.subject-card{background:linear-gradient(145deg,#102b4c,#0b1a30);border-color:#23446d}
.subject-card:before{background:linear-gradient(135deg,rgba(57,135,224,.14),transparent 58%)}
.subject-card-icon{background:#16375e;border-color:#2b5788}
.subject-card-open,.quiz-card-number,.quiz-card-action{color:#f0c75f}
.quiz-card{background:linear-gradient(180deg,#102744,#0b1a30);border-color:#23446d}
.quiz-shell{max-width:850px;margin:0 auto}
.quiz-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.quiz-progress-track{height:6px;background:#203754;border-radius:99px;overflow:hidden;margin:10px 0 20px}
.quiz-progress-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,#438ce3,#e3b54e);border-radius:99px;transition:width .2s}
.quiz-question-label{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;font-weight:850;color:#9dbbe0}
.question{background:#09182d;border:1px solid #29496f;border-radius:18px;padding:clamp(18px,4vw,28px);font-size:clamp(1.08rem,2.5vw,1.3rem);line-height:1.7;font-weight:650}
.answer-grid{margin-top:14px;gap:11px}
.answer-grid .btn{min-height:58px;padding:14px 16px;border-radius:14px;background:#102542;border-color:#27466b;line-height:1.5;white-space:normal}
.answer-grid .btn:hover:not(:disabled){border-color:#e3b54e;background:#163153}
.answer-grid .btn:disabled{opacity:.82}
.quiz-feedback-card{margin-top:16px;padding:16px;border-radius:14px;border:1px solid #2b4a6e;background:#102440;line-height:1.6}
.quiz-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:18px}
@media(max-width:650px){.hero{padding:22px 18px}.subject-card{min-height:158px}.quiz-topline{align-items:flex-start}.question{padding:18px}.answer-grid .btn{min-height:56px}}


/* Identidade visual CTSP — marca d'água monocromática e tipografia didática */
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;500;600;700;800;900&display=swap');
body{font-family:"Nunito Sans", "Segoe UI", Arial, sans-serif}
.card,.hero,.question,.quiz-card,.subject-card,.kpi,.pix-box,.quiz-folder,.quiz-feedback-card,.stat-row,.empty{
  position:relative;
  isolation:isolate;
}
.card::after,.hero::before,.question::after,.quiz-card::after,.subject-card::after,
.kpi::after,.pix-box::after,.quiz-folder::after,.quiz-feedback-card::after,
.stat-row::after,.empty::after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  width:clamp(108px,18%,190px);
  aspect-ratio:184 / 273;
  right:-12px;
  top:-18px;
  background:url("../insignia_watermark_monochrome.png") center / contain no-repeat;
  opacity:.13;
  transform:rotate(-13deg);
  transform-origin:center;
  filter:grayscale(1);
}
.hero::before{width:clamp(125px,19%,205px);right:8px;top:-32px;opacity:.15}
.card,.hero,.question,.quiz-card,.subject-card,.kpi,.pix-box,.quiz-folder,.quiz-feedback-card,.stat-row,.empty{overflow:hidden}
.card > *, .hero > *, .question > *, .quiz-card > *, .subject-card > *, .kpi > *,
.pix-box > *, .quiz-folder > *, .quiz-feedback-card > *, .stat-row > *, .empty > *{
  position:relative;
}
.hero:after{right:-70px;top:-80px;z-index:-1}
h1,h2,h3,h4,button,.btn,label,.brand{font-family:"Nunito Sans","Segoe UI",Arial,sans-serif}
h1,h2,h3{letter-spacing:-.025em}
.question{background:#09182d}
@media(max-width:650px){
  .hero::before{width:115px;right:-16px;top:-12px;opacity:.11}
  .card::after,.question::after,.quiz-card::after,.subject-card::after,.kpi::after,.pix-box::after,.quiz-folder::after,.quiz-feedback-card::after,.stat-row::after,.empty::after{width:100px;right:-18px;top:-10px;opacity:.10}
}

/* V14 — marca-d'água somente no quadro principal de boas-vindas */
.card::after,
.question::after,
.quiz-card::after,
.subject-card::after,
.kpi::after,
.pix-box::after,
.quiz-folder::after,
.quiz-feedback-card::after,
.stat-row::after,
.empty::after{content:none!important;display:none!important}
.hero::before{display:block}
@media(max-width:650px){
  .hero::before{display:block}
}


/* V15 — aplica a marca-d'água também ao painel principal da tela de login */
.login-panel::after{
  content:""!important;
  display:block!important;
  position:absolute;
  z-index:0;
  pointer-events:none;
  width:clamp(105px,30%,155px);
  aspect-ratio:184 / 273;
  right:8px;
  top:-12px;
  background:url("../insignia_watermark_monochrome.png") center / contain no-repeat;
  opacity:.12;
  transform:rotate(-13deg);
  transform-origin:center;
  filter:grayscale(1);
}
.login-panel{position:relative;isolation:isolate;overflow:hidden}
.login-panel>*{position:relative}
@media(max-width:520px){.login-panel::after{width:95px;right:-8px;top:-4px;opacity:.09}}

/* Identidade visual da tela de login: substitui o emoji de livros pela insígnia. */
.login-panel .login-insignia {
  width: 48px;
  height: 48px;
  margin: 0 0 14px 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
}
.login-panel .login-insignia img {
  display: block;
  width: 40px;
  height: 48px;
  object-fit: contain;
  opacity: .62;
  filter: grayscale(1);
  transform: rotate(-12deg);
}


/* V17 — login mais limpo: somente a marca-d'água de fundo e recuperação como link textual */
.login-panel .login-insignia { display: none !important; }
.login-panel .forgot-password { margin: 12px 0 0; font-size: .92rem; }
.login-panel .forgot-password a { color: var(--muted, #b9c9df); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.login-panel .forgot-password a:hover { color: var(--text, #fff); }
.login-panel .forgot-password a:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 2px; }

/* V22 — opções de pagamento */
.payment-methods{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.payment-methods button{min-height:44px}
@media(max-width:520px){.payment-methods{flex-direction:column;align-items:stretch}.payment-methods .btn{width:100%;justify-content:center}}