:root{--bg:#f5f0e6;--paper:#fffdf8;--ink:#222;--muted:#6e675c;--must:#c59a2e;--line:#e4dac5;--ok:#477a59;--bad:#b54a42}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--ink)}
header{background:#292620;color:white;padding:14px 4vw;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:5}.brand{font-weight:800}.brand small{display:block;font-weight:400;opacity:.7;margin-top:3px}
main{width:min(1160px,92vw);margin:26px auto 70px}.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:24px;margin-bottom:20px;box-shadow:0 12px 28px rgba(50,40,25,.07)}
.hero{display:flex;justify-content:space-between;gap:24px;align-items:center}.hero h1{font-size:clamp(28px,5vw,48px);line-height:1;margin:.2em 0}.muted{color:var(--muted)}.eyebrow{font-size:12px;letter-spacing:.15em;color:#95701c;font-weight:800}
.grid{display:grid;grid-template-columns:1.4fr .9fr;gap:20px}.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
button{cursor:pointer}.btn{border:0;border-radius:10px;padding:10px 14px;font-weight:800;background:var(--must);color:#211a0d}.btn.alt{background:transparent;border:1px solid #a79d8a;color:inherit}.btn.red{background:var(--bad);color:white}
label{display:block;font-size:14px;font-weight:700;margin:12px 0}input,select,textarea{width:100%;margin-top:6px;padding:11px;border:1px solid #d8cdb9;border-radius:10px;background:white}.check{display:flex;gap:8px;font-weight:400}.check input{width:auto}
video{width:100%;border-radius:14px;background:#111;max-height:520px}.placeholder{height:330px;border-radius:14px;background:#24211d;color:white;display:grid;place-items:center;text-align:center}.progress{height:10px;background:#e8e0d4;border-radius:99px;overflow:hidden;margin-top:12px}.bar{height:100%;width:0;background:var(--must)}.meta{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-top:7px}
.badge{padding:6px 9px;border-radius:999px;font-size:12px;font-weight:800;background:#f1ddb0;color:#735012}.badge.ok{background:#d9eadf;color:#2c663e}.hidden{display:none!important}.notice{background:#f1eadc;padding:12px;border-radius:10px;color:#5f5544;font-size:14px}
.stat{min-width:160px;background:#2e2b25;color:white;border-radius:18px;padding:20px;text-align:center}.stat b{font-size:2.2rem;display:block}.stat span{font-size:.8rem;opacity:.75}
.question{padding:18px 0;border-top:1px solid var(--line)}.question:first-child{border-top:0}.question h3{font-size:16px;line-height:1.4}.opt{display:flex;gap:9px;padding:10px;border:1px solid #ded4c2;border-radius:10px;margin:7px 0;background:white}.opt input{width:auto;margin:2px 0 0}
.result{display:grid;grid-template-columns:1fr 160px;gap:20px;align-items:center}.score{width:145px;height:145px;border:14px solid #e8dfcc;border-radius:50%;display:grid;place-items:center;align-content:center;margin:auto}.score b{font-size:30px}.review{border-left:4px solid var(--line);padding:10px;margin:9px 0;background:#faf7f0}.review.ok{border-color:var(--ok)}.review.bad{border-color:var(--bad)}
.narrow{max-width:520px;margin:auto}.qedit{border:1px solid var(--line);border-radius:12px;padding:14px;margin:12px 0}.qhead{display:flex;justify-content:space-between}.qopt{display:grid;grid-template-columns:32px 1fr;gap:8px;align-items:center;margin:7px 0}.qopt input[type=radio]{width:auto;margin:0}
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:12px 0 20px}.kpis div{background:#f8f3e8;border:1px solid var(--line);border-radius:14px;padding:16px}.kpis b{display:block;font-size:28px}.kpis span{font-size:12px;color:var(--muted);font-weight:700}.tools{display:grid;grid-template-columns:1.2fr .8fr .8fr auto;gap:10px;align-items:end}.rank{display:grid;gap:8px}.rank-row{display:grid;grid-template-columns:46px 1.5fr .8fr .65fr .65fr;gap:10px;align-items:center;border:1px solid var(--line);background:white;border-radius:12px;padding:10px 12px}.rank-pos{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#eee5d1;font-weight:900}.rank-row:nth-child(1) .rank-pos{background:#e8c968}.rank-row:nth-child(2) .rank-pos{background:#d9d9d9}.rank-row:nth-child(3) .rank-pos{background:#d7aa7a}.pill{display:inline-block;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}.pass{background:#d9eadf;color:#2e683e}.fail{background:#f2d9d5;color:#89362f}.none{background:#ece7de;color:#6d6558}.staff{display:grid;grid-template-columns:1.2fr .9fr .9fr .9fr auto;gap:10px;align-items:end}
.scroll{overflow:auto}table{width:100%;border-collapse:collapse;min-width:880px}th,td{text-align:left;padding:9px;border-bottom:1px solid var(--line);font-size:13px}.toast{position:fixed;right:20px;bottom:20px;background:#222;color:white;padding:11px 14px;border-radius:10px}
@media(max-width:900px){.grid,.row3,.tools,.staff,.result{grid-template-columns:1fr}.hero,.head{display:block}.kpis{grid-template-columns:repeat(2,1fr)}.rank-row{grid-template-columns:42px 1fr}.rank-row .mobilehide{display:none}.placeholder{height:220px}}
