/* Ujian TeknopreneurHub — gaya tampilan (selaras dengan e-modul TeknopreneurHub) */
:root{--navy:#0e2a47;--hijau:#2f7d4f;--hijau2:#1f6f43;--emas:#e0a84a;--ink:#1f2a24;--mut:#6b7a70;--bd:#dfe7e1;--bg:#f3f6f4;--card:#fff;--merah:#c0392b;--r:14px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
a{color:#1d5fa0}h1{font:700 1.45rem/1.25 Georgia,"Times New Roman",serif;color:var(--navy);margin:.2em 0 .5em}h2{font:700 1.15rem Georgia,serif;color:var(--navy);margin:.2em 0 .6em}h3{font-size:1rem;margin:.2em 0 .6em;color:var(--navy)}
.card{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:18px 20px;margin:0 0 16px;box-shadow:0 2px 10px rgba(14,42,71,.05)}
.wrap{max-width:1180px;margin:0 auto;padding:18px 16px 40px}.wrap.narrow{max-width:760px}
.muted{color:var(--mut)}.small{font-size:.84rem}.c{text-align:center}.mono{font-family:ui-monospace,Consolas,monospace;letter-spacing:.04em}
.btn{display:inline-flex;align-items:center;gap:6px;justify-content:center;border:0;border-radius:10px;padding:10px 16px;background:var(--hijau);color:#fff;font:700 .93rem system-ui,Arial,sans-serif;cursor:pointer;text-decoration:none;line-height:1.2}
.btn:hover{filter:brightness(1.07)}.btn:disabled{opacity:.55;cursor:default}.btn.sec{background:#eef3ef;color:var(--hijau2);border:1px solid #cfe0d5}.btn.ok{background:#1f7a46}.btn.red{background:#fbe9e7;color:#a3271a;border:1px solid #f0c4be}
.btn.sm{padding:7px 12px;font-size:.84rem}.btn.xs{padding:4px 9px;font-size:.78rem;border-radius:8px}.btn-lg{padding:13px 22px;font-size:1.02rem;width:100%}.btn.wide{width:100%}
.linkbtn{background:none;border:0;color:#1d5fa0;text-decoration:underline;cursor:pointer;font-size:.85rem;padding:4px 0}
.err{background:#fdecea;border:1px solid #f3c2bc;color:#8e2418;border-radius:10px;padding:10px 14px}
.warn{background:#fff6e0;border:1px solid #f0d08a;color:#6f4b00;border-radius:10px;padding:10px 14px}
.okmsg{background:#e6f4ea;border:1px solid #b8dcc4;color:#1f5c38;border-radius:10px;padding:10px 14px}
.pill{display:inline-block;padding:2px 9px;border-radius:99px;font-size:.76rem;font-weight:700;background:#e8eef9;color:#1c4f9c;white-space:nowrap}
.pill.ok{background:#e3f2e8;color:#1f6f43}.pill.bad{background:#fde8e8;color:#a3271a}.pill.warnp{background:#fff3dc;color:#8a5a00}.pill.mut{background:#eef0ef;color:#55615a}
/* formulir */
.frm label{display:block;font-weight:600;font-size:.88rem;margin:12px 0 4px}
.frm input:not([type=checkbox]):not([type=radio]),.frm select,.frm textarea,.filt select{width:100%;padding:10px 12px;border:1px solid #cdd8d0;border-radius:10px;font:inherit;background:#fff;color:inherit}
.frm textarea{resize:vertical}.frm input:focus,.frm select:focus,.frm textarea:focus{outline:2px solid #9fd0b0;border-color:var(--hijau)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
fieldset{border:1px solid var(--bd);border-radius:12px;padding:6px 14px 14px;margin:14px 0}legend{font-weight:700;color:var(--navy);padding:0 6px}
.cks{display:flex;flex-direction:column;gap:6px;margin:10px 0}.ck{display:flex!important;gap:8px;align-items:flex-start;font-weight:400!important;margin:0!important}.ck input{margin-top:4px}.ck.big{font-size:1rem;background:#f3f8f4;border-radius:10px;padding:8px 10px}
.inrow{display:flex;gap:6px}.w60{width:64px!important;padding:6px!important}.w80{width:90px!important}
.token{text-transform:uppercase;letter-spacing:.25em;font-family:ui-monospace,Consolas,monospace;font-weight:700;font-size:1.1rem!important}
.kop{display:flex;gap:12px;align-items:center;border-bottom:3px double var(--hijau);padding-bottom:10px;margin-bottom:14px}.kop img{width:52px;height:52px;object-fit:contain}.kop b{display:block;color:var(--navy)}.kop span{font-size:.82rem;color:var(--mut)}
/* masuk */
.pg-masuk{background:radial-gradient(120% 90% at 100% 0,#1d4a7a 0,#0e2a47 55%,#091a2f 100%) fixed}
.masuk-wrap{max-width:560px;margin:0 auto;padding:28px 16px}.masuk-card{padding:24px}.foot{text-align:center;color:#9fb3cc;font-size:.8rem}
.info3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}.info3 div{background:#f3f8f4;border-radius:12px;padding:10px;text-align:center}.info3 b{display:block;font-size:1.4rem;color:var(--hijau2)}.info3 span{font-size:.78rem;color:var(--mut)}
.aturan{background:#f6f8fb;border:1px solid #dbe4ef;border-radius:12px;padding:10px 14px;margin:14px 0 4px;font-size:.86rem}.aturan ol{margin:6px 0 0;padding-left:20px}
/* ujian */
.pg-ujian{background:#eef2ef}
.ubar{position:sticky;top:0;z-index:20;background:var(--navy);color:#fff;box-shadow:0 2px 12px rgba(0,0,0,.18)}
.ubar-in{max-width:860px;margin:0 auto;display:flex;align-items:center;gap:10px;padding:8px 16px}.ubar img{width:34px;height:34px;border-radius:50%;background:#fff;object-fit:contain}
.uid{flex:1;min-width:0}.uid b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.uid span{font-size:.78rem;color:#b9c8da}
.utimer{font:700 1.35rem ui-monospace,Consolas,monospace;background:#183d64;border-radius:10px;padding:5px 12px;min-width:92px;text-align:center}.utimer.warn{background:#a86a00}.utimer.crit{background:#b3261e;animation:kedip 1s infinite}
@keyframes kedip{50%{opacity:.6}}
.uprog{height:4px;background:#183d64}.uprog i{display:block;height:100%;width:0;background:var(--emas);transition:width .3s}
.umain{max-width:860px;margin:0 auto;padding:16px}
.qhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}.qno{font:700 1.15rem Georgia,serif;color:var(--navy)}.qno small{font:400 .85rem system-ui;color:var(--mut)}
.qtag{font-size:.75rem;font-weight:700;border-radius:99px;padding:2px 10px;background:#e3f2e8;color:#1f6f43}.qtag.esai{background:#efe6fb;color:#5b2e9a}
.ragu{margin-left:auto;display:flex;gap:6px;align-items:center;font-size:.88rem;background:#fff;border:1px solid var(--bd);border-radius:99px;padding:4px 12px;cursor:pointer}
.qcard{user-select:none;-webkit-user-select:none}.qcard textarea{user-select:text;-webkit-user-select:text;width:100%;padding:12px;border:1px solid #cdd8d0;border-radius:10px;font:inherit;min-height:220px}
.qtext{font-size:1.05rem;margin-bottom:14px;line-height:1.6}
.opts{display:flex;flex-direction:column;gap:9px}
.opt{display:flex;gap:12px;align-items:flex-start;text-align:left;width:100%;background:#fff;border:2px solid #dbe3dd;border-radius:12px;padding:12px 14px;font:inherit;color:inherit;cursor:pointer;transition:border-color .15s,background .15s}
.opt:hover{border-color:#9fc9ad}.opt.on{border-color:var(--hijau);background:#eaf6ee}
.opt .lt{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#eef1ef;font-weight:700;color:var(--navy)}.opt.on .lt{background:var(--hijau);color:#fff}
.qnav{display:flex;align-items:center;gap:10px;margin:4px 0 16px}.qnav .simpan{flex:1;text-align:center}
.simpan{font-size:.8rem;color:var(--mut)}.simpan.ok{color:#1f7a46}.simpan.on{color:#8a5a00}.simpan.bad{color:#b3261e;font-weight:700}
.grid-card .gh{display:flex;justify-content:space-between;margin-bottom:8px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:6px}
.g{height:38px;border-radius:9px;border:1px solid #cdd8d0;background:#fff;font-weight:700;cursor:pointer;color:var(--ink);display:inline-block}
.g.j{background:var(--hijau);border-color:var(--hijau);color:#fff}.g.r{background:var(--emas);border-color:#c48b25;color:#2b1d00}.g.c{outline:3px solid #1d5fa0;outline-offset:1px}.g.e:not(.j):not(.r){border-style:dashed}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.78rem;color:var(--mut);margin:10px 0}.legend span{display:flex;gap:5px;align-items:center}.legend i.g{width:16px;height:16px;border-radius:4px;display:inline-block}
.modal{position:fixed;inset:0;background:rgba(9,26,47,.6);z-index:50;display:grid;place-items:center;padding:16px}.modal[hidden]{display:none}
.modal-in{background:#fff;border-radius:16px;padding:20px 22px;max-width:480px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.35)}.mbtn{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:12px}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:#1f2a24;color:#fff;padding:10px 16px;border-radius:12px;z-index:60;max-width:90vw;font-size:.9rem}
/* hasil */
.kv{border-collapse:collapse;width:100%;font-size:.92rem}.kv td{padding:5px 8px;border-bottom:1px solid #eef1ef;vertical-align:top}.kv td:nth-child(odd){color:var(--mut);width:150px}
.nilai-big{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin:6px 0 14px}.nilai-big>div:first-child{background:#f3f8f4;border-radius:16px;padding:12px 22px;text-align:center}
.nilai-big>div:first-child b{display:block;font:700 2.8rem/1 Georgia,serif}.nilai-big>div:first-child span{font-size:.82rem;color:var(--mut)}.nb-r{display:flex;flex-direction:column;gap:4px}
.prof2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 12px}.pbox{border:1px solid var(--bd);border-radius:12px;padding:10px 14px}.pbox span{font-weight:700;color:var(--navy)}.pbox b{display:block;font:700 1.8rem Georgia,serif}.pbox small{color:var(--mut)}
.tprof{width:100%;border-collapse:collapse;font-size:.88rem}.tprof td,.tprof th{padding:6px 6px;border-bottom:1px solid #eef1ef;text-align:left}.tprof th{font-size:.78rem;color:var(--mut)}
.plist{display:flex;flex-direction:column;gap:8px}.pi{border-bottom:1px solid #eef1ef;padding-bottom:7px}.pn{font-size:.88rem;margin-bottom:3px}.pb{display:flex;align-items:center;gap:8px}.pb .bar{flex:1;max-width:none;width:auto}.pb b{min-width:40px;text-align:right;font-size:.9rem}.pb .muted{min-width:58px;text-align:right}
.tbar{min-width:150px;white-space:nowrap}.bar{display:inline-block;vertical-align:middle;width:calc(100% - 48px);max-width:260px;height:10px;background:#e9eeea;border-radius:99px;overflow:hidden}.bar i{display:block;height:100%;border-radius:99px}.barv{display:inline-block;width:42px;text-align:right;font-size:.82rem}
.saran{background:#fff8e6;border-left:4px solid var(--emas);border-radius:10px;padding:8px 14px;margin-top:12px}.saran ul{margin:4px 0;padding-left:20px}
.bahas{border-left:4px solid #b8dcc4;padding:6px 10px;margin:8px 0;background:#fafcfb}.bahas.no{border-color:#f0b3ab}.bq{margin-bottom:4px}
/* panel dosen */
.abar{background:var(--navy);color:#fff;position:sticky;top:0;z-index:20}.abar-in{max-width:1180px;margin:0 auto;display:flex;gap:10px;align-items:center;padding:8px 16px;flex-wrap:wrap}.abar img{width:30px;height:30px;border-radius:50%;background:#fff}
.abar nav{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap}.abar nav a{color:#d6e2f0;text-decoration:none;padding:6px 10px;border-radius:8px;font-size:.88rem}.abar nav a.on,.abar nav a:hover{background:#1d4a7a;color:#fff}
.hrow{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.btns{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px}form.inl{display:inline-flex;gap:4px;align-items:center;margin:0}
.ucard .uc-h{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.uc-m{display:flex;gap:14px;flex-wrap:wrap;font-size:.86rem;color:var(--mut);margin:4px 0 10px}
.uc-s{display:flex;gap:10px;margin-bottom:12px}.uc-s div{background:#f3f8f4;border-radius:10px;padding:6px 14px;text-align:center}.uc-s b{display:block;font-size:1.25rem;color:var(--hijau2)}.uc-s span{font-size:.74rem;color:var(--mut)}.uc-a{display:flex;gap:6px;flex-wrap:wrap}
.kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:12px 0 16px}.kpi div{background:#fff;border:1px solid var(--bd);border-left:5px solid var(--hijau);border-radius:12px;padding:8px 12px}.kpi div.bad{border-left-color:var(--merah)}.kpi b{display:block;font-size:1.35rem;color:var(--navy)}.kpi span{font-size:.75rem;color:var(--mut)}
.filt{display:flex;gap:8px;align-items:center;margin:8px 0 6px;flex-wrap:wrap}.filt label{font-weight:600;font-size:.86rem}.filt select{width:auto;min-width:180px}
.tw{overflow-x:auto}.tbl{width:100%;border-collapse:collapse;font-size:.87rem}.tbl th,.tbl td{padding:7px 8px;border-bottom:1px solid #edf1ee;text-align:left;vertical-align:middle}.tbl th{background:#f4f7f5;font-size:.78rem;color:#45524a;white-space:nowrap}.tbl tr:hover td{background:#fafcfb}
.tbl tr.rok td:last-child{color:#1f7a46;font-weight:700}.tbl tr.rno td:last-child{color:#b3261e;font-weight:700}.heat td.hc{font-weight:700}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.grid2>.card{margin:0 0 16px}
.esai-blk{border:1px solid var(--bd);border-radius:12px;padding:12px 14px;margin:10px 0;background:#fcfdfc}.jaw{background:#fff;border:1px dashed #cdd8d0;border-radius:10px;padding:10px 12px;margin:8px 0 2px;white-space:normal}
.rub summary{cursor:pointer;color:#1d5fa0;font-size:.85rem;margin:6px 0}.skor{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.skor label{margin:0!important}.quick{display:inline-flex;gap:4px;flex-wrap:wrap}
.hist{display:flex;align-items:flex-end;gap:6px;height:180px;padding-top:16px}.hcol{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}.hcol i{display:block;width:100%;border-radius:6px 6px 0 0;min-height:2px}.hv{font-size:.75rem;font-weight:700}.hl{font-size:.66rem;color:var(--mut);margin-top:4px;white-space:nowrap}
.katg{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.katg ul{margin:6px 0 0;padding-left:18px;font-size:.86rem;max-height:300px;overflow:auto}
.soal.off{opacity:.6}.sh{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:8px}.sh .sp{flex:1}.olt{margin:6px 0;padding-left:22px}.olt li.kunci{color:#1f6f43;font-weight:700}
.optrow{display:flex;gap:8px;align-items:center;margin:6px 0}.optrow input[type=radio]{width:auto}.optrow input:not([type=radio]){flex:1}
.share textarea{font-family:inherit}
/* cetak */
.pg-cetak{background:#e9ecea}.cbar{position:sticky;top:0;background:var(--navy);padding:10px 16px;display:flex;gap:8px;z-index:5}.paper{background:#fff;max-width:297mm;margin:14px auto;padding:14mm 12mm;box-shadow:0 4px 18px rgba(0,0,0,.12)}
.ct{text-align:center;font-size:1.15rem}.tc{width:100%;border-collapse:collapse;font-size:.8rem;margin-top:10px}.tc th,.tc td{border:1px solid #cfd8d2;padding:4px 6px}.tc th{background:#f1f5f2}.tc tr{break-inside:avoid}
.ttd{display:flex;justify-content:flex-end;margin-top:24px}.ttd div{text-align:center;min-width:240px}
@page{size:A4 portrait;margin:12mm}
@media print{.cbar{display:none}.paper{margin:0;box-shadow:none;padding:0;max-width:none}body{background:#fff}.tbar .bar,.bar i{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
@media (max-width:760px){.row2,.row3,.grid2,.prof2,.katg{grid-template-columns:1fr}.card{padding:14px}.abar nav{margin-left:0;width:100%}.uc-s{flex-wrap:wrap}.qtext{font-size:1rem}.kv td:nth-child(odd){width:110px}h1{font-size:1.25rem}}

/* mode ketat */
html.ketat,html.ketat body{overscroll-behavior-y:none}
.kt{padding-left:20px;margin:6px 0}.kt li{margin:4px 0}
.kt-note{text-align:center;font-size:.82rem;color:#8a5a00;background:#fff6e0;border:1px solid #f0d08a;border-radius:10px;padding:8px 10px}
.live{background:#e6f4ea;border:1px solid #b8dcc4;color:#1f5c38;border-radius:10px;padding:8px 14px}