:root{--bg:#09090b;--side:#1f1a0c;--panel:#18181b;--row:#27272a;--line:#3f3f46;--txt:#fafafa;--mut:#a1a1aa;--gold:#e0b656;--gold2:#c9973a;--err:#f87171;--ok:#4ade80}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--txt);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
[hidden]{display:none!important}

/* login */
.auth{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;background:var(--fundo) center/cover fixed #0b0a06}
.auth h1{font-size:28px;font-weight:800;margin:0 0 56px;text-align:center}
.auth-box{width:100%;max-width:450px;background:var(--panel);border-radius:10px;padding:48px 16px 40px;display:flex;flex-direction:column;align-items:center}
.auth-box img{width:100%;max-width:420px;height:auto;margin-bottom:28px}
.auth-box form{width:100%;max-width:330px;display:flex;flex-direction:column;gap:12px}
.field{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--mut)}
.field input,.field textarea,.field select{background:#0c0c0e;border:1px solid var(--line);border-radius:8px;padding:11px 12px;color:var(--txt);width:100%}
.field textarea{min-height:84px;resize:vertical}
.msg-erro{color:var(--err);font-size:14px;min-height:20px;margin:0}
.dica{color:var(--mut);font-size:13px;text-align:center;margin:8px 0 0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:11px 18px;border-radius:8px;font-weight:600;background:var(--row);color:var(--txt);border:1px solid var(--line);white-space:nowrap}
.btn:hover{background:#34343a}
.btn.ouro{background:linear-gradient(180deg,var(--gold),var(--gold2));color:#17120a;border:0}
.btn.ouro:hover{filter:brightness(1.08)}
.btn.branco{background:#fff;color:#111;border:0;font-size:20px;padding:12px 32px}
.btn.branco:hover{background:#e7e7e7}
.btn.peq{padding:6px 11px;font-size:13px}
.btn.perigo{color:var(--err)}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* layout */
.shell{display:flex;min-height:100vh}
.side{width:310px;flex:none;background:var(--side);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;transition:width .2s;z-index:20}
.side-top{display:flex;justify-content:flex-end;padding:8px 14px 0}
.ico{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px}
.ico:hover{background:#ffffff14}
.side-logo{padding:18px 0 28px;border-bottom:1px solid #ffffff22}
.side-logo img{width:100%;display:block}
.side nav{padding:18px 0;flex:1}
.side nav a,.side nav button{display:flex;align-items:center;gap:16px;padding:14px 12px;font-weight:600;width:100%;text-align:left}
.side nav a:hover,.side nav button:hover{background:#ffffff10}
.side nav a.ativo{color:var(--gold)}
.side-user{border-top:1px solid #ffffff22;position:relative}
.side-user>button{display:flex;align-items:center;gap:10px;width:100%;padding:18px 8px;font-weight:600;font-size:15px}
.avatar{width:44px;height:44px;flex:none;border-radius:50%;background:#0c0c0e;border:2px solid var(--gold2);display:flex;align-items:center;justify-content:center;color:var(--gold);font-weight:800}
.side-user .email{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.user-menu{position:absolute;bottom:100%;left:8px;right:8px;background:var(--row);border:1px solid var(--line);border-radius:8px;padding:6px}
.user-menu button{display:block;width:100%;text-align:left;padding:10px;border-radius:6px}
.user-menu button:hover{background:#ffffff12}
.shell.fechado .side{width:64px}
.shell.fechado .side-logo,.shell.fechado .side .rot,.shell.fechado .side-user .email,.shell.fechado .side-user .seta{display:none}
.shell.fechado .side-top{justify-content:center}
.shell.fechado .side nav a,.shell.fechado .side nav button{justify-content:center}
.main{flex:1;min-width:0}
.topo-mobile{display:none}

/* home */
.hero{position:relative;height:330px;background:var(--fundo) center 30%/cover;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0000 45%,var(--bg))}
.hero>*{position:relative;z-index:1}
.hero h1{font-size:clamp(34px,6vw,68px);font-weight:900;letter-spacing:.04em;margin:0;line-height:1.05;text-shadow:0 3px 18px #000}
.hero i{display:block;width:190px;height:4px;margin:20px auto 18px;background:linear-gradient(90deg,var(--gold),#0000)}
.hero p{font-size:clamp(17px,2.4vw,28px);letter-spacing:.05em;color:#ecc77a;margin:0}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:30px 40px 64px;max-width:1500px;margin:0 auto}
.card{position:relative;aspect-ratio:320/470;border-radius:10px;overflow:hidden;background:#141414 center/cover;text-align:left;padding:0;transition:transform .22s,box-shadow .22s;width:100%}
.card:hover:not(.vazio),.card:focus-visible:not(.vazio){transform:scale(1.05);box-shadow:0 14px 40px #000c;z-index:2}
.card .leg{position:absolute;left:0;right:0;bottom:0;padding:50px 20px 22px;background:linear-gradient(180deg,#0000,#000d 60%);font-size:clamp(15px,1.5vw,21px);font-weight:800;line-height:1.5}
.card .barra{position:absolute;left:0;right:0;bottom:0;height:4px;background:#ffffff1f}
.card .barra b{display:block;height:100%;background:var(--gold)}
.card.vazio{filter:grayscale(1) brightness(.7);cursor:not-allowed}
.card.vazio .aviso{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:#0009;font-size:14px;color:#ddd}
.card.vazio:hover .aviso{display:flex}

/* modal do curso */
.modal-fundo{position:fixed;inset:0;background:#000b;z-index:40;overflow-y:auto;padding:44px 16px}
.modal{position:relative;max-width:875px;margin:0 auto;background:var(--panel);border-radius:12px;overflow:hidden}
.modal-fechar{position:absolute;top:18px;right:20px;width:40px;height:40px;border-radius:50%;background:#2a2a2ed9;display:flex;align-items:center;justify-content:center;z-index:3}
.modal-hero{position:relative;height:490px;background:#0c0c0c center/cover;display:flex;flex-direction:column;justify-content:flex-end;padding:0 60px 30px}
.modal-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0000 35%,#0a0a0ae0)}
.modal-hero>*{position:relative}
.modal-hero small{font-weight:700;font-size:15px}
.modal-hero h2{font-size:24px;margin:14px 0 18px}
.modal-corpo{padding:26px 60px 44px}
.modal-corpo h3{font-size:30px;margin:0 0 8px}
.contagem{color:var(--mut);margin:0 0 20px}
.select{position:relative;max-width:452px;margin-bottom:16px}
.select>button{width:100%;display:flex;justify-content:space-between;align-items:center;background:#111113;border:1px solid var(--line);border-radius:6px;padding:15px 17px;font-size:18px;text-align:left}
.select-menu{position:absolute;bottom:calc(100% + 10px);left:0;right:0;background:var(--row);border:1px solid var(--line);border-radius:6px;z-index:5;max-height:300px;overflow:auto}
.select-menu input{width:100%;background:none;border:0;border-bottom:1px solid var(--line);padding:14px;position:sticky;top:0;background:var(--row);outline:0}
.select-menu button{display:flex;width:100%;justify-content:space-between;align-items:center;padding:9px 14px;text-align:left;border-radius:6px}
.select-menu button:hover:not(:disabled){background:#17171a}
.select-menu button:disabled{opacity:.5;cursor:not-allowed}
.select-menu small{display:block;color:var(--mut);font-size:14px;margin-top:2px}
.aula-item{display:flex;align-items:center;gap:20px;background:var(--row);border-radius:8px;padding:20px;margin-top:12px;cursor:pointer;width:100%}
.aula-item:hover{background:#303035}
.check{width:24px;height:24px;flex:none;border:1px solid #52525b;border-radius:5px;background:#18181b;display:flex;align-items:center;justify-content:center;padding:0}
.check.on{background:var(--gold);border-color:var(--gold);color:#17120a}
.aula-thumb{width:181px;aspect-ratio:16/9;flex:none;border-radius:6px;background:#000 center/cover}
.aula-item b{flex:1;font-size:18px;min-width:0}
.aula-item span{color:var(--mut);font-size:15px;font-weight:600;white-space:nowrap}

/* player */
.player-pag{display:grid;grid-template-columns:minmax(0,1fr) 360px;min-height:100vh}
.player-esq{padding:24px 32px 56px;min-width:0}
.voltar{display:inline-flex;align-items:center;gap:8px;color:var(--mut);margin-bottom:16px}
.voltar:hover{color:var(--txt)}
.video-box{aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;color:var(--mut);text-align:center}
.video-box video,.video-box iframe{width:100%;height:100%;border:0;display:block}
.player-esq h1{font-size:26px;margin:22px 0 4px}
.player-esq .sub{color:var(--mut);margin:0 0 18px}
.acoes{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.desc{white-space:pre-wrap;line-height:1.6;color:#d4d4d8}
.mat{margin-top:26px}
.mat h2{font-size:16px;margin:0 0 10px}
.mat a{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--row);border-radius:8px;margin-bottom:8px}
.mat a:hover{background:#303035}
.player-dir{background:var(--panel);padding:20px 16px;overflow-y:auto;max-height:100vh;position:sticky;top:0}
.player-dir h2{font-size:15px;margin:18px 6px 8px;color:var(--mut)}
.player-dir h2:first-child{margin-top:0}
.pl{display:flex;gap:10px;align-items:center;padding:10px;border-radius:6px;width:100%;text-align:left}
.pl:hover{background:var(--row)}
.pl.atual{background:var(--row);color:var(--gold)}
.pl small{color:var(--mut);margin-left:auto;white-space:nowrap}
.pl .ok{color:var(--gold);width:18px;flex:none;text-align:center}

/* admin */
.adm{padding:28px 40px 72px;max-width:1120px}
.adm h1{font-size:26px;margin:0 0 18px}
.abas{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:24px;flex-wrap:wrap}
.abas a{padding:10px 16px;border-bottom:2px solid #0000;color:var(--mut);font-weight:600}
.abas a.ativo{color:var(--txt);border-color:var(--gold)}
.bloco{background:var(--panel);border-radius:10px;padding:18px;margin-bottom:14px}
.bloco-cab{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bloco-cab img{width:58px;height:84px;object-fit:cover;border-radius:5px;background:#000}
.bloco-cab .tit{flex:1;min-width:180px}
.bloco-cab input{width:100%;background:#0c0c0e;border:1px solid var(--line);border-radius:6px;padding:9px 11px;font-weight:700}
.linha-aula{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--row);border-radius:7px;margin-top:8px;flex-wrap:wrap}
.linha-aula b{flex:1;min-width:160px}
.etq{font-size:12px;padding:2px 8px;border-radius:99px;background:#3f3f46;color:#e4e4e7}
.etq.ok{background:#14532d;color:#bbf7d0}
.etq.aviso{background:#713f12;color:#fde68a}
.grade{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grade .full{grid-column:1/-1}
.barra-up{height:8px;border-radius:9px;background:#3f3f46;overflow:hidden;margin-top:8px}
.barra-up b{display:block;height:100%;width:0;background:var(--gold);transition:width .2s}
table{width:100%;border-collapse:collapse;font-size:14px}
th{color:var(--mut);text-align:left;font-weight:600}
th,td{padding:10px 8px;border-bottom:1px solid #2c2c31;vertical-align:middle}
.tabela-scroll{overflow-x:auto}
.dialogo{position:fixed;inset:0;background:#000b;z-index:60;display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:48px 16px}
.dialogo>div{width:100%;max-width:620px;background:var(--panel);border-radius:12px;padding:24px}
.dialogo h2{margin:0 0 16px;font-size:20px}
.dialogo .fim{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
#toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:#27272a;border:1px solid var(--line);padding:10px 16px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:99}
#toast.on{opacity:1}

@media(max-width:1000px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr));padding:24px 18px 56px}
  .player-pag{grid-template-columns:1fr}
  .player-dir{position:static;max-height:none}
  .modal-hero{height:320px;padding:0 24px 22px}
  .modal-corpo{padding:22px 24px 34px}
}
@media(max-width:720px){
  .side{position:fixed;left:0;transform:translateX(-100%);transition:transform .2s}
  .shell.aberto .side{transform:none}
  .shell.fechado .side{width:310px}
  .topo-mobile{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--side);position:sticky;top:0;z-index:15}
  .topo-mobile img{height:26px}
  .hero{height:240px}
  .card .leg{font-size:12px;line-height:1.3;padding:8px 12px 12px;background:none}
  .aula-item{gap:12px;padding:12px}
  .aula-thumb{width:96px}
  .aula-item b{font-size:15px}
  .player-esq{padding:14px 12px 40px}
  .adm{padding:20px 14px 56px}
  .grade{grid-template-columns:1fr}
  .auth h1{margin-bottom:28px}
  .modal-fundo{padding:0}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.plano-tit{font-size:17px;margin:10px 0 2px;color:var(--gold)}
.linha2{display:flex;gap:10px}
.linha2>*{flex:1;min-width:0}
.aceite{display:flex;gap:10px;font-size:13px;color:var(--mut);align-items:flex-start;line-height:1.4}
.fin-topo{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:16px}
.fin-topo .field{max-width:190px}
.fin-h2{font-size:16px;margin:0 0 14px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:14px}
.tile{background:var(--panel);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:6px;min-width:0}
.tile span{color:var(--mut);font-size:13px}
.tile b{font-size:24px;line-height:1.15;overflow-wrap:anywhere}
.tile small{color:var(--mut);font-size:13px}
.grafico{display:flex;align-items:flex-end;gap:12px;height:210px;border-bottom:1px solid var(--line);padding-top:30px}
.barra-mes{position:relative;flex:1;height:100%;display:flex;align-items:flex-end;justify-content:center;outline-offset:2px}
.barra-mes i{display:block;width:min(44px,70%);background:#8a6f35;border-radius:4px 4px 0 0}
.barra-mes.atual i{background:var(--gold)}
.barra-mes em{position:absolute;bottom:-24px;left:0;right:0;text-align:center;font-style:normal;font-size:12px;color:var(--mut)}
.dica-bar{position:absolute;top:-28px;left:50%;transform:translateX(-50%);background:var(--row);border:1px solid var(--line);padding:3px 8px;border-radius:6px;font-size:12px;white-space:nowrap;opacity:0;pointer-events:none}
.barra-mes:hover .dica-bar,.barra-mes:focus .dica-bar{opacity:1}
.grafico+*{margin-top:30px}
.bloco:has(.grafico){padding-bottom:40px}
.vitrine{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.prod{background:var(--panel);border-radius:10px;overflow:hidden;display:flex;flex-direction:column}
.prod-img{aspect-ratio:16/9;background:#0c0c0e center/cover}
.prod-txt{padding:14px 16px;display:flex;flex-direction:column;gap:8px;flex:1}
.prod-txt h2{font-size:17px;margin:0}
.prod-txt p{color:var(--mut);font-size:14px;margin:0;white-space:pre-wrap;flex:1}
.prod-pe{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:6px}
.prod-pe b{font-size:18px}
.cartao-faixa{display:flex;align-items:center;gap:12px;background:var(--panel);border-radius:10px;padding:12px 16px;margin-bottom:16px;flex-wrap:wrap}
.cartao-faixa span{flex:1;min-width:180px}
.cartao-faixa svg,.cartao-atual svg,.cartao-linha svg{color:var(--gold);flex:none}
.cartao-atual{display:flex;align-items:center;gap:14px;max-width:460px}
.cartao-atual div{flex:1;display:flex;flex-direction:column;gap:4px}
.cartao-atual small{color:var(--mut)}
.cartao-linha{display:flex;align-items:center;gap:10px;margin:0;background:var(--row);padding:12px;border-radius:8px}
.cartao-linha span{flex:1}
.cartao-linha a{color:var(--gold)}
.marca-txt{display:block;font-size:24px;text-align:center;padding:10px 12px}
.curso-tit{max-width:1500px;margin:26px auto -14px;padding:0 40px;font-size:22px}
.curso-adm{margin-bottom:30px}
