/* DanceScore portal - shared look for the Nov 2026 pages (dashboard, Downloads, Email, password reset). */
:root{
--blue:#1e3c72;--blue2:#2a5298;--gold:#FFC107;--gold2:#FFA000;
--teal:#16a085;--teal2:#1abc9c;--ink:#2c3e50;--muted:#6b7a89;
--line:#e3e8ef;--bg:#eef1f6;--card:#ffffff;--red:#c0392b;--green:#1e8449;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background:var(--bg);color:var(--ink);line-height:1.55;min-height:100vh}
a{color:var(--blue2)}
.container{max-width:1100px;margin:0 auto;padding:20px 16px 48px}

/* header bar */
.header{background:linear-gradient(135deg,var(--blue),var(--blue2));border-radius:12px;border-top:4px solid var(--gold);
 box-shadow:0 8px 28px rgba(30,60,114,.25);margin-bottom:24px;padding:22px 26px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:16px}
.logo{width:58px;height:58px;border-radius:12px;background:linear-gradient(135deg,var(--gold),var(--gold2));display:flex;align-items:center;justify-content:center;
 font-weight:700;font-size:21px;color:var(--blue);flex:none}
.header .brand h1{color:#fff;font-weight:400;font-size:24px;line-height:1.2}
.header .brand p{color:rgba(255,255,255,.8);font-size:13px}
.header-right{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.who{color:#fff;font-size:14px;margin-right:6px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border:0;border-radius:8px;cursor:pointer;
 font:600 14px 'Segoe UI',Tahoma,sans-serif;text-decoration:none;color:#fff;background:#7f8c8d;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,.15)}
.btn-primary{background:linear-gradient(135deg,var(--teal),var(--teal2))}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold2));color:var(--blue)}
.btn-ghost{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35)}
.btn-light{background:#fff;color:var(--blue);border:1px solid var(--line)}
.btn-danger{background:var(--red)}
.btn-sm{min-height:34px;padding:6px 12px;font-size:13px}
.btn[disabled],.btn.disabled{background:#c5ccd4;color:#6b7a89;cursor:not-allowed;transform:none;box-shadow:none}
.btn:focus-visible{outline:3px solid rgba(22,160,133,.5);outline-offset:2px}

/* panels and messages */
.panel{background:var(--card);border-radius:12px;box-shadow:0 4px 18px rgba(0,0,0,.06);padding:22px 24px;margin-bottom:22px}
.panel-title{font-size:20px;font-weight:600;color:var(--blue);margin-bottom:12px}
.msg{border-radius:8px;padding:12px 16px;margin-bottom:18px;font-size:15px}
.msg-ok{background:#e8f6ee;border:1px solid #9fd8b6;color:#145a32}
.msg-err{background:#fdecea;border:1px solid #f1a9a0;color:#922b21}
.msg-info{background:#eef4fc;border:1px solid #b9cdea;color:var(--blue)}
.muted{color:var(--muted);font-size:13px}

/* download sections */
.section{margin-bottom:30px}
.section-head{border-left:5px solid var(--gold);padding-left:12px;margin-bottom:14px}
.section-head h2{font-size:21px;font-weight:600;color:var(--blue)}
.section-head p{color:var(--muted);font-size:14px;max-width:760px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.card{background:var(--card);border-radius:12px;box-shadow:0 4px 18px rgba(0,0,0,.06);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line)}
.card-top{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;padding:16px 18px}
.card-top h3{font-size:18px;font-weight:500;line-height:1.3}
.chips{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px}
.chip{background:var(--gold);color:var(--blue);font-size:12px;font-weight:700;padding:3px 10px;border-radius:20px}
.chip-light{background:rgba(255,255,255,.18);color:#fff;font-weight:600}
.card-body{padding:16px 18px;display:flex;flex-direction:column;gap:12px;flex:1}
.card-body .desc{font-size:14px;color:#4a5866}
.card-body .btn{width:100%;margin-top:auto}
.contents{background:#f7f9fc;border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.contents strong{display:block;font-size:13px;color:var(--blue);margin-bottom:4px}
.contents ul{list-style:none;font-size:14px}
.contents li{display:flex;justify-content:space-between;gap:10px;padding:3px 0;border-bottom:1px dashed var(--line)}
.contents li:last-child{border-bottom:0}
.contents li span{color:var(--muted);white-space:nowrap;font-size:13px}
.note-lock{font-size:13px;color:var(--red);text-align:center}

/* forms and tables */
label{display:block;font-weight:600;font-size:14px;margin:12px 0 4px}
input[type=text],input[type=email],input[type=password],input[type=number],select,textarea{width:100%;padding:10px 12px;border:1px solid #c9d2dc;border-radius:8px;
 font:15px 'Segoe UI',Tahoma,sans-serif;background:#fff;color:var(--ink)}
textarea{min-height:200px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(22,160,133,.18)}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;margin:10px 0}
.check input{margin-top:4px;width:18px;height:18px;flex:none}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.row3{display:grid;grid-template-columns:2fr 1fr 1fr;gap:0 18px}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.grid{width:100%;border-collapse:collapse;font-size:14px}
.grid th{text-align:left;background:#f5f7fa;color:var(--blue);padding:9px 10px;border-bottom:2px solid var(--line)}
.grid td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.grid tr.inactive td{color:#9aa6b2;background:#fafafa}
.tag{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:12px;background:#e3e8ef;color:var(--ink)}
.tag-ok,.tag-on{background:#e8f6ee;color:var(--green)}
.tag-done{background:#e8f6ee;color:var(--green)}
.tag-todo{background:#fff4d6;color:#8a6200}
.tag-err,.tag-off,.tag-missing{background:#fdecea;color:var(--red)}
.userpick{max-height:300px;overflow-y:auto;overflow-x:hidden;border:1px solid var(--line);border-radius:8px;padding:6px 12px;
 display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:0 16px}
.userpick .check{margin:4px 0}
.auth{max-width:440px;margin:60px auto}

@media (max-width:700px){
 .header{padding:18px}
 .header .brand h1{font-size:20px}
 .row2,.row3{grid-template-columns:1fr}
 .cards{grid-template-columns:1fr}
 .userpick{grid-template-columns:1fr}
 .grid .hide-sm{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
