/* JIK Tools 2: manila folder, payslip ladder, exam hall, matatu route board. Mobile first. */
.jx-folder,.jx-hall,.jx-route,.jx-ladder,.jx-deck{--ink:#23201b;--paper:#fbf7ee;--manila:#e9c98f;--manila2:#d9b06a;--stamp:#b3261e;--ok:#1f6f43;margin:1.2rem 0;color:var(--ink)}
.jx-mono{font-family:"Courier New",Courier,ui-monospace,monospace}
/* 1 Clearance folder */
.jx-tabs{display:flex;gap:.25rem;overflow-x:auto;padding:0 .3rem;scrollbar-width:none}
.jx-tab{flex:0 0 auto;background:var(--manila2);border:1px solid #a9843f;border-bottom:0;border-radius:10px 10px 0 0;padding:.55rem .8rem;font:700 .8rem/1 "Courier New",monospace;letter-spacing:.05em;color:var(--ink);cursor:pointer;min-height:44px}
.jx-tab[aria-selected=true]{background:var(--manila);transform:translateY(2px)}
.jx-tab .d{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;margin-left:.35rem;background:#fff8;border:1px solid var(--ink)}
.jx-tab.done .d{background:var(--ok)}
.jx-sheet{background:var(--manila);border:1px solid #a9843f;border-radius:0 8px 8px 8px;padding:1rem;box-shadow:0 6px 0 -2px #c99b51,0 12px 0 -4px #b8893f;position:relative}
.jx-card{background:var(--paper);border-radius:4px;padding:1rem;box-shadow:inset 0 0 0 1px #e3d8c2}
.jx-card h3{font:700 1.1rem/1.3 "Courier New",monospace;margin:0 0 .3rem;text-transform:uppercase}
.jx-meta{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;margin:.6rem 0;font-size:.85rem}
.jx-meta div{border:1px dashed #b9ab8f;padding:.4rem .5rem;border-radius:4px}.jx-meta b{display:block;font:700 .68rem/1.2 "Courier New",monospace;text-transform:uppercase;color:#6b5a3a}
.jx-steps{margin:.5rem 0 0;padding:0;list-style:none;counter-reset:s}
.jx-steps li{counter-increment:s;display:flex;gap:.6rem;align-items:flex-start;padding:.55rem 0;border-top:1px dotted #cbbd9f;font-size:.93rem}
.jx-steps input{width:22px;height:22px;flex:0 0 22px;margin-top:.1rem;accent-color:var(--ok)}
.jx-stamp{position:absolute;right:.8rem;top:.6rem;transform:rotate(-8deg);border:3px double var(--stamp);color:var(--stamp);font:800 .8rem/1 "Courier New",monospace;padding:.3rem .5rem;letter-spacing:.1em;opacity:.85;background:#fbf7eecc}
.jx-stamp.ok{border-color:var(--ok);color:var(--ok)}
.jx-src{font-size:.8rem;margin-top:.6rem;color:#5b4f3a}.jx-src a{color:#7a3b00}
.jx-warn{background:#fff3f0;border-left:4px solid var(--stamp);padding:.5rem .7rem;font-size:.88rem;margin:.6rem 0}
.jx-sum{margin-top:.8rem;font:700 .85rem "Courier New",monospace}
/* 2 Payslip ladder */
.jx-ladder{border-left:6px solid var(--ink);padding-left:.8rem;display:grid;gap:.45rem}
.jx-rung{background:#fff;border:1px solid #cfc6b5;border-radius:3px;padding:.55rem .7rem;font:500 .88rem/1.35 "Courier New",monospace;position:relative;background-image:repeating-linear-gradient(90deg,transparent 0 12px,#f1ece2 12px 13px)}
.jx-rung::before{content:"";position:absolute;left:-1.25rem;top:50%;width:.8rem;border-top:6px solid var(--ink)}
.jx-rung b{font-weight:800}.jx-rung .u{color:var(--stamp);font-weight:700}
.jx-rung:target,.jx-rung.on{background:#fff6d6;outline:2px solid #c48a00}
/* 4-5 exam hall */
.jx-hall,.jx-deck{background:#fff;border:1px solid #bdb6a8;padding:1rem;border-radius:2px;box-shadow:0 1px 0 #bdb6a8,0 3px 0 #fff,0 4px 0 #bdb6a8}
.jx-head{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--ink);padding-bottom:.5rem;margin-bottom:.8rem;font:700 .8rem/1.2 "Times New Roman",serif;text-transform:uppercase;gap:.5rem}
.jx-clock{font:700 1.2rem/1 "Courier New",monospace;border:2px solid var(--ink);border-radius:50px;padding:.3rem .7rem;white-space:nowrap}
.jx-clock.low{color:var(--stamp);border-color:var(--stamp)}
.jx-q{font:1rem/1.5 "Times New Roman",Georgia,serif;margin:.4rem 0 .7rem}.jx-q b{font-family:"Courier New",monospace}
.jx-opts{display:grid;gap:.4rem}.jx-opt{display:block;text-align:left;width:100%;min-height:44px;border:1px solid #9c9486;background:#fdfcf8;padding:.55rem .7rem;font:1rem Georgia,serif;cursor:pointer;border-radius:2px;color:var(--ink)}
.jx-opt.r{background:#e3f3e8!important;border-color:var(--ok);color:#23201b!important}.jx-opt.w{background:#fbe6e3!important;border-color:var(--stamp);color:#23201b!important}.jx-opt:hover,.jx-opt:focus{color:#23201b;background:#f3efe4}
.jx-exp{font-size:.9rem;background:#f6f3ec;padding:.6rem .7rem;margin-top:.6rem;border-left:3px solid var(--ink)}
.jx-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.8rem}
.jx-btn{display:inline-block;min-height:44px;padding:.6rem 1rem;background:var(--ink,#23201b);color:#fff!important;border:0;border-radius:3px;font:700 .9rem/1.4 system-ui,sans-serif;cursor:pointer;text-decoration:none!important}
.jx-btn.alt{background:#fff;color:#23201b!important;border:2px solid #23201b}
.jx-marks{width:100%;border-collapse:collapse;font:.88rem "Courier New",monospace;margin-top:.6rem}.jx-marks td,.jx-marks th{border:1px solid #9c9486;padding:.35rem .5rem;text-align:left}
.jx-pick{display:grid;gap:.5rem}
.jx-deck details{border:1px solid #bdb6a8;margin:.5rem 0;background:#fdfcf8;border-radius:2px}
.jx-deck summary{cursor:pointer;padding:.75rem .8rem;font:700 1rem/1.4 "Times New Roman",Georgia,serif;list-style:none}
.jx-deck summary::-webkit-details-marker{display:none}
.jx-deck summary::before{content:"Q" counter(q) ". ";counter-increment:q;font-family:"Courier New",monospace;color:var(--stamp)}
.jx-deck{counter-reset:q}.jx-deck details>div{padding:0 .8rem .7rem;font-size:.94rem}
.jx-note{font-size:.85rem;border:1px dashed #9c9486;padding:.5rem .7rem;margin:.8rem 0;background:#fffdf6}
/* 6 Matatu route board */
.jx-route{background:#1d1d1b;color:#f5f1e6;border-radius:10px;padding:1rem;border:4px solid #f2c200;box-shadow:inset 0 0 0 2px #1d1d1b,inset 0 0 0 4px #f2c200}
.jx-route h3{color:#f2c200;font:800 1rem/1.2 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;margin:0 0 .6rem}
.jx-route input,.jx-route select{width:100%;min-height:44px;margin:.2rem 0 .5rem;padding:.5rem;border-radius:4px;border:0;font-size:16px;box-sizing:border-box}
.jx-route .jx-btn{background:#f2c200;color:#1d1d1b!important}
.jx-stops{display:flex;justify-content:space-between;margin:.8rem 0 1rem;position:relative;font:700 .66rem/1.1 system-ui;text-transform:uppercase}
.jx-stops::before{content:"";position:absolute;left:6%;right:6%;top:9px;border-top:3px dashed #f2c200}
.jx-stops span{position:relative;text-align:center;flex:1}.jx-stops span::before{content:"";display:block;width:16px;height:16px;margin:0 auto .3rem;border-radius:50%;background:#1d1d1b;border:3px solid #f2c200}
.jx-job{background:#2b2b28;border-radius:6px;padding:.7rem;margin:.5rem 0}
.jx-job a{color:#fff;font-weight:700}.jx-job small{color:#bdb8aa;display:block}
.jx-prog{display:flex;gap:3px;margin:.5rem 0}.jx-prog i{flex:1;height:8px;border-radius:4px;background:#555}.jx-prog i.on{background:#f2c200}.jx-prog i.no{background:#b3261e}
.jx-job .jx-row{margin-top:.4rem}.jx-job select{width:auto;min-height:40px;margin:0}.jx-del{background:none;border:1px solid #777;color:#ddd;border-radius:4px;min-height:40px;padding:0 .7rem}
.jx-jobbar{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0;padding:.8rem;border:2px dashed #23201b;background:#fbf7ee}
.jx-jobbar .jx-btn{flex:1 1 220px;text-align:center}
@media(min-width:720px){.jx-meta{grid-template-columns:repeat(4,1fr)}.jx-opts{grid-template-columns:1fr 1fr}}
/* 3 Cover letter: foolscap + postmark */
.jdoc[data-jdoc=coverletter] .jlt-paper{background:#fffef8 repeating-linear-gradient(transparent 0 27px,#c9d9ef 27px 28px);border-left:3px double #e6a1a1}
.jcl-post{display:grid;gap:.15rem;justify-items:center;text-align:center;width:min(260px,90%);margin:0 auto 1rem;padding:.8rem;border:3px dashed #b3261e;border-radius:50%;color:#b3261e;transform:rotate(-4deg);font:700 .8rem/1.3 "Courier New",monospace;text-transform:uppercase}
.jcl-post b{font-size:.95rem;color:#23201b}.jcl-post em{font-style:normal}.jcl-post a{font-size:.7rem;color:#23201b}
