/* ==========================================================================
   SENAI Luzerna / FIESC — Sistema de Votacao
   Tema institucional AZUL (FIESC / SENAI-SC). Vermelho so p/ erro e nota baixa.
   Autor do sistema: Prof. Douglas Melere
   ========================================================================== */
:root{
  --blue:#0064ac;         /* azul FIESC / SENAI-SC */
  --blue-dark:#00426f;
  --blue-soft:#e8f1fa;
  --ink:#15233a;          /* grafite azulado */
  --ink-2:#243247;
  --gray:#5b6472;
  --line:#e2e7ee;
  --line-2:#eef1f6;
  --bg:#f3f6fa;
  --card:#ffffff;
  --accent:#00a3e0;       /* azul claro de apoio (realces do telao) */
  --ok:#1f9d55; --warn:#b7791f;
  --err:#c8102e; --err-dark:#9c0b22; --err-soft:#fdecef;   /* vermelho SO p/ erro/perigo */
  --sc-a:#1f9d55; --sc-b:#0071bc; --sc-c:#b7791f; --sc-d:#c8102e; --sc-none:#9aa1ab;
  --radius:14px;
  --shadow:0 1px 2px rgba(16,24,40,.06), 0 8px 24px rgba(16,24,40,.06);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.5;-webkit-text-size-adjust:100%}
a{color:var(--blue)}
a:hover{text-decoration:underline}
h1{font-size:1.6rem;margin:.2rem 0}
h2{font-size:1.15rem;margin:.2rem 0 .6rem}
h3{font-size:1rem;margin:.6rem 0 .3rem}
code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:#eef1f6;padding:.08em .4em;border-radius:6px;font-size:.92em}
hr{border:none;border-top:1px solid var(--line);margin:1.1rem 0}
.muted{color:var(--gray)}
.sm{font-size:.82rem}
.mt{margin-top:.8rem}
.lead{font-size:1.05rem;color:var(--ink-2);margin:.2rem 0 .4rem}

/* ---------- Topbar ---------- */
.topbar{display:flex;align-items:center;gap:1.2rem;background:var(--ink);color:#fff;padding:.55rem 1.1rem;flex-wrap:wrap;box-shadow:var(--shadow);position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:.6rem}
.brand-bar{width:8px;height:34px;background:var(--blue);border-radius:3px}
.brand-bar.big{width:12px;height:54px}
.brand-logo{height:40px;width:auto;display:block}
.brand-logo.big{height:60px}
.brand-txt{display:flex;flex-direction:column;line-height:1.05}
.brand-senai{font-weight:800;letter-spacing:.5px}
.brand-luz{font-weight:500;color:#a9cdec;margin-left:.35rem}
.brand-senai,.brand-luz{display:inline}
.brand-sub{font-size:.68rem;color:#aeb8c6;letter-spacing:.3px;margin-top:2px}
.mainnav{display:flex;gap:.2rem;flex-wrap:wrap;margin-left:.4rem;flex:1}
.mainnav a{color:#d7dce4;padding:.4rem .7rem;border-radius:8px;font-size:.92rem;font-weight:500}
.mainnav a:hover{background:#ffffff18;text-decoration:none;color:#fff}
.mainnav a.active{background:var(--blue);color:#fff}
.topbar-right{display:flex;align-items:center;gap:.7rem;margin-left:auto}
.userchip{text-align:right;line-height:1.15}
.uc-name{font-weight:600;font-size:.9rem}
.uc-sub{font-size:.72rem;color:#aeb8c6}

/* ---------- Layout ---------- */
.wrap{max-width:1080px;margin:0 auto;padding:1.4rem 1.1rem 3rem}
.pagehead{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.6rem}
.credits{text-align:center;color:var(--gray);font-size:.8rem;padding:1.4rem 1rem 2rem;border-top:1px solid var(--line);margin-top:1rem}
.empty{background:var(--card);border:1px dashed var(--line);border-radius:var(--radius);padding:2rem;text-align:center;color:var(--gray)}
.back{display:inline-block;margin-bottom:.6rem;font-size:.9rem}

/* ---------- Panels / cards ---------- */
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.2rem;box-shadow:var(--shadow);margin-bottom:1.1rem}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
@media(max-width:820px){.cols{grid-template-columns:1fr}}

/* ---------- Buttons ---------- */
.btn{display:inline-block;border:1px solid transparent;border-radius:10px;padding:.6rem 1rem;font-size:.95rem;font-weight:600;cursor:pointer;background:#eceff3;color:var(--ink);font-family:inherit;transition:filter .12s,background .12s}
.btn:hover{filter:brightness(.97);text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-dark)}
.btn-outline{background:#fff;border-color:var(--blue);color:var(--blue)}
.btn-outline:hover{background:var(--blue-soft)}
.btn-ghost{background:transparent;color:inherit;border-color:transparent}
.btn-ghost:hover{background:#00000010}
.btn-danger{background:#fff;border-color:var(--err);color:var(--err)}
.btn-danger:hover{background:var(--err-soft)}
.btn-block{display:block;width:100%}
.btn-sm{padding:.4rem .7rem;font-size:.85rem}
.btn-xs{padding:.25rem .5rem;font-size:.78rem;font-weight:500}
.topbar .btn-ghost{color:#d7dce4}
.topbar .btn-ghost:hover{background:#ffffff22;color:#fff}

/* ---------- Forms ---------- */
form.inline{display:inline-flex;gap:.4rem;align-items:center;margin:0}
form.stack,.stack{display:flex;flex-direction:column;gap:.7rem}
label{font-size:.85rem;font-weight:600;color:var(--ink-2);display:flex;flex-direction:column;gap:.3rem}
input,select,textarea{font-family:inherit;font-size:1rem;padding:.6rem .7rem;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue)}
textarea{resize:vertical}
select{cursor:pointer}

.flash{padding:.7rem 1rem;border-radius:10px;margin-bottom:1rem;font-weight:500;border:1px solid}
.flash-ok{background:#e9f7ef;border-color:#b7e4c7;color:#14663a}
.flash-error{background:var(--err-soft);border-color:#f3c0c8;color:var(--err-dark)}
.flash-warn{background:#fdf3e2;border-color:#f5dcae;color:#8a5a12}

.tag{display:inline-block;font-size:.72rem;font-weight:700;padding:.15rem .55rem;border-radius:999px;letter-spacing:.4px}
.tag-ok{background:#e9f7ef;color:#14663a}
.tag-off{background:#eef1f6;color:#5b6472}
.tag-danger{background:var(--err-soft);color:var(--err-dark)}

/* ---------- Login ---------- */
.login-page{background:linear-gradient(135deg,var(--blue-dark),#0a3a63 45%,var(--ink))}
.login-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;gap:1rem}
.login-card{background:#fff;border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.35);padding:1.8rem;width:100%;max-width:400px}
.login-brand{display:flex;align-items:center;gap:.8rem;margin-bottom:1.2rem}
.login-logo{max-height:64px;width:auto}
.login-title{font-size:1.5rem}
.login-title b{color:var(--blue)}
.login-sub{font-size:.82rem;color:var(--gray)}
.login-hint{font-size:.8rem;color:var(--gray);margin:1rem 0 0}
.login-credit{color:#c7dcf0;font-size:.78rem;text-align:center;max-width:420px}
.login-card input{font-size:1.05rem}
.login-or{display:flex;align-items:center;gap:.7rem;margin:1.1rem 0 .3rem;color:var(--gray);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em}
.login-or::before,.login-or::after{content:"";flex:1;height:1px;background:#dbe6f0}

/* ---------- Aluno: grid de equipes ---------- */
.progresspill{background:var(--ink);color:#fff;padding:.4rem .9rem;border-radius:999px;font-size:.85rem;font-weight:600}
.teamgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.9rem;margin-top:.8rem}
.teamcard{display:block;background:var(--card);border:1px solid var(--line);border-left:5px solid var(--blue);border-radius:var(--radius);padding:1rem 1.1rem;box-shadow:var(--shadow);color:inherit}
.teamcard:hover{text-decoration:none;transform:translateY(-2px);transition:transform .12s;box-shadow:0 10px 26px rgba(16,24,40,.12)}
.teamcard.done{border-left-color:var(--ok);background:#fbfefc}
.teamcard.current{border-left-color:var(--accent);box-shadow:0 0 0 2px #00a3e033,var(--shadow)}
.tc-top{display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.tc-name{font-weight:700;font-size:1.05rem}
.tc-live{background:var(--accent);color:#fff;font-size:.62rem;font-weight:700;padding:.1rem .4rem;border-radius:5px;margin-left:.4rem;vertical-align:middle;text-transform:uppercase}
.tc-badge{font-size:.72rem;font-weight:700;color:var(--ok);white-space:nowrap}
.tc-badge.todo{color:var(--blue)}
.tc-project{margin-top:.3rem;font-weight:500;color:var(--ink-2)}
.tc-desc{margin-top:.2rem;font-size:.85rem;color:var(--gray)}

/* ---------- Formulario de voto ---------- */
.votecard{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem;box-shadow:var(--shadow)}
.votecard h2{margin-top:1.2rem;border-top:1px solid var(--line-2);padding-top:1rem}
.votecard h2:first-of-type{border-top:none;margin-top:.2rem;padding-top:0}
.critrow{display:flex;align-items:center;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--line-2)}
.critrow:last-child{border-bottom:none}
.crit-info{flex:1;min-width:0}
.crit-name{font-weight:600}
.crit-desc{font-size:.82rem;color:var(--gray)}
.crit-weight{font-size:.72rem;color:var(--blue);font-weight:600;margin-top:.15rem}
.critrow.member .crit-info{font-weight:500}
.votehint{background:var(--blue-soft);border:1px solid #cfe0f2;color:#274b73;border-radius:10px;padding:.6rem .8rem;font-size:.88rem;margin:0 0 .6rem}
.form-error{background:var(--err-soft);border:1px solid #f3c0c8;color:var(--err-dark);border-radius:10px;padding:.6rem .8rem;font-weight:600;margin:.2rem 0 .6rem}
.critrow.missing{background:#fdf3e2;border-radius:8px;box-shadow:inset 3px 0 0 var(--warn);padding-left:.6rem}
.slider input[type=range].untouched{accent-color:#b9bfc8;opacity:.65}
.slider-val{transition:color .1s}
.slider{display:flex;align-items:center;gap:.7rem;min-width:170px}
.slider input[type=range]{width:130px;accent-color:var(--blue)}
.slider-val{font-weight:800;font-size:1.25rem;min-width:2.2ch;text-align:center;color:var(--blue);background:var(--blue-soft);border-radius:8px;padding:.1rem .3rem}
@media(max-width:560px){
  .critrow{flex-direction:column;align-items:stretch;gap:.4rem}
  .slider{min-width:0;justify-content:space-between}
  .slider input[type=range]{width:100%;flex:1}
}
.qbox{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.2rem;box-shadow:var(--shadow);margin-top:1.1rem}
.qmine{list-style:none;padding:0;margin:.8rem 0 0}
.qmine li{padding:.4rem 0;border-bottom:1px solid var(--line-2);font-size:.9rem}
.qstatus{font-size:.68rem;font-weight:700;padding:.1rem .4rem;border-radius:5px;margin-left:.3rem}
.qs-pending{background:#eef1f6;color:#5b6472}
.qs-answering{background:#e7f0fb;color:var(--blue)}
.qs-answered{background:#e9f7ef;color:#14663a}

/* ---------- Admin ---------- */
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.8rem;margin-bottom:1.1rem}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;text-align:center;box-shadow:var(--shadow)}
.stat-v{font-size:1.9rem;font-weight:800;color:var(--blue)}
.stat-l{font-size:.8rem;color:var(--gray);text-transform:uppercase;letter-spacing:.5px}
.urlpill{display:inline-block;background:var(--ink);color:#fff;padding:.3rem .6rem;border-radius:8px;font-size:.9rem}
.steps{margin:.3rem 0 0;padding-left:1.2rem}
.steps li{margin:.3rem 0}
.danger-zone{border-color:#f3c0c8}
.danger-zone h2{color:var(--err-dark)}

.team-panel .team-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}
.editbox{margin:.5rem 0}
.editbox summary{cursor:pointer;color:var(--gray);font-size:.85rem}
.ministu{list-style:none;padding:0;margin:.3rem 0}
.ministu li{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.35rem 0;border-bottom:1px solid var(--line-2);font-size:.9rem}
.addstu{margin-top:.8rem;background:var(--bg);padding:.8rem;border-radius:10px}

.tbl{width:100%;border-collapse:collapse;font-size:.92rem}
.tbl th,.tbl td{padding:.55rem .6rem;text-align:left;border-bottom:1px solid var(--line)}
.tbl th{font-size:.75rem;text-transform:uppercase;letter-spacing:.4px;color:var(--gray);vertical-align:bottom}
.rowact{display:flex;gap:.2rem;justify-content:flex-end}
.tablescroll{overflow-x:auto;border-radius:var(--radius);border:1px solid var(--line);background:#fff;box-shadow:var(--shadow)}
.results{min-width:760px}
.results .rank{font-weight:800;color:var(--gray)}
.results tbody tr:first-child .rank{color:var(--blue)}
.results .tname{min-width:150px}
.results .final .score{font-size:1.1rem}
.results .members{min-width:200px}
.memchip{display:inline-flex;align-items:center;gap:.25rem;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:.1rem .5rem;font-size:.8rem;margin:.1rem}

.score{display:inline-block;min-width:2.4ch;text-align:center;font-weight:800;color:#fff;border-radius:7px;padding:.1rem .45rem;font-size:.9rem}
.sc-a{background:var(--sc-a)} .sc-b{background:var(--sc-b)} .sc-c{background:var(--sc-c)} .sc-d{background:var(--sc-d)} .sc-none{background:var(--sc-none)}

.critpanel .critform{margin:0}
.critgrid{display:grid;grid-template-columns:1fr 90px;gap:.7rem}
.qblock{margin-bottom:.6rem}
.qblock ul{margin:.2rem 0}

/* ---------- Credenciais (impressao) ---------- */
.credgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.7rem;margin-top:1rem}
.cred{border:1.5px dashed #b9bfc8;border-radius:12px;padding:.8rem .9rem;background:#fff;break-inside:avoid}
.cred-top{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--blue);padding-bottom:.3rem;margin-bottom:.4rem}
.cred-brand b{color:var(--blue)}
.cred-logo{height:22px;width:auto}
.cred-role{font-size:.7rem;color:var(--gray);font-weight:600;text-align:right;max-width:55%}
.cred-name{font-weight:700;font-size:1.05rem;margin-bottom:.4rem}
.cred-fields{display:flex;gap:1rem;margin-bottom:.4rem}
.cred-fields div{display:flex;flex-direction:column}
.cred-fields span{font-size:.65rem;color:var(--gray);text-transform:uppercase;letter-spacing:.5px}
.cred-fields b{font-size:1.1rem}
.cred-fields .mono{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:1px}
.cred-url{font-size:.72rem;color:var(--blue);border-top:1px solid var(--line-2);padding-top:.3rem}

/* ---------- Telao ---------- */
.telao-page{background:radial-gradient(circle at 30% 20%,#123a5e,#0a1626 70%);color:#fff;min-height:100vh}
.telao-controls{display:flex;gap:.5rem;align-items:center;padding:.6rem 1rem;background:#00000055;flex-wrap:wrap}
.telao-controls select{width:auto}
#stage{min-height:calc(100vh - 60px);display:flex;align-items:center;justify-content:center;padding:2rem}
.stage{width:100%;max-width:1100px;text-align:center}
.stage-logo{max-height:130px;width:auto;margin-bottom:1rem}
.stage-brand{font-size:2.5rem;font-weight:300;letter-spacing:2px}
.stage-brand b{color:var(--accent);font-weight:800}
.stage-event{font-size:1.3rem;color:#9fb6cc;margin-top:.5rem}
.stage-wait{font-size:1.4rem;color:#7f93a8;margin-top:2rem}
.stage-kicker{text-transform:uppercase;letter-spacing:4px;color:var(--accent);font-weight:700;font-size:1rem}
.stage-team{font-size:clamp(2.2rem,6vw,4.5rem);font-weight:800;margin:.3rem 0;line-height:1.05}
.stage-project{font-size:1.5rem;color:#c3d2e2}
.stage-qhead{margin:2rem 0 1rem;font-size:1.1rem;text-transform:uppercase;letter-spacing:3px;color:#7f93a8}
.qlist{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.8rem;text-align:left}
.qcard{background:#ffffff12;border-left:5px solid #5b6472;border-radius:12px;padding:1rem 1.3rem;font-size:clamp(1.1rem,2.4vw,1.7rem);display:flex;justify-content:space-between;align-items:center;gap:1rem}
.qcard.qs-answering{border-left-color:var(--accent);background:#00a3e022;box-shadow:0 0 0 2px #00a3e055}
.qcard.qs-answered{opacity:.45;border-left-color:var(--ok);text-decoration:line-through}
.qempty{color:#7f93a8;font-size:1.3rem;text-align:center;list-style:none}
.qctrl{display:flex;gap:.2rem;flex-shrink:0}
.qctrl .btn{color:#fff}
.qctrl .btn:hover{background:#ffffff22}
.telao-page .btn-ghost,.telao-page .btn-outline{color:#fff;border-color:#ffffff55}

.reveal .stage-title{font-size:clamp(2rem,5vw,3.5rem);margin-bottom:2rem}
.podiums{display:flex;justify-content:center;align-items:flex-end;gap:1.2rem;flex-wrap:wrap}
.podium{background:#ffffff14;border-radius:14px;padding:1.4rem 1.6rem;min-width:180px}
.podium.p1{background:linear-gradient(180deg,#ffd70033,#ffffff10);border:2px solid #ffd700;transform:scale(1.12)}
.podium.p2{border:2px solid #c0c0c0}
.podium.p3{border:2px solid #cd7f32}
.medal{font-size:2.6rem}
.pod-name{font-size:1.5rem;font-weight:700;margin:.3rem 0}
.pod-score{font-size:2rem;font-weight:800;color:var(--accent)}
.rankrest{max-width:500px;margin:2rem auto 0;text-align:left;font-size:1.2rem;color:#c3d2e2}
.rankrest li{padding:.3rem 0;border-bottom:1px solid #ffffff22}

/* ---------- Print ---------- */
@media print{
  body{background:#fff}
  .topbar,.credits,.noprint,.mainnav,.topbar-right{display:none !important}
  .wrap{max-width:none;padding:0}
  .cred{border:1.5px dashed #999}
  .credgrid{grid-template-columns:repeat(2,1fr)}
  a{color:#000}
}