/* Reader's Digest — Veriza light theme (shared) */
:root{
  --brand:#9c1c86; --brand-2:#7d146b; --brand-soft:#f7e9f4;
  --ink:#1c1e26; --muted:#6b7280; --line:#e7e8ee; --soft:#f6f6f9;
  --amber:#e0942f; --good:#1f9d57; --bad:#d64545; --run:#7c4dff;
  --card:#ffffff; --bg:#f4f5f8;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;line-height:1.5}

/* top bar */
.topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.topbar-in{max-width:960px;margin:0 auto;display:flex;align-items:center;gap:14px;padding:11px 20px}
.brandmark{display:flex;align-items:baseline;gap:9px;text-decoration:none}
.brandmark img{height:24px;width:auto;display:block}
.brandmark .word{font-size:18px;font-weight:700;color:var(--ink);letter-spacing:-.01em;position:relative;top:0}
.brandmark .word b{font-weight:800}
.nav{display:flex;gap:8px;margin-left:auto;flex-wrap:wrap}
.tab{display:inline-flex;align-items:center;gap:6px;padding:7px 15px;border-radius:20px;font-size:13.5px;font-weight:600;
     text-decoration:none;color:#5a5f6b;background:#f1f2f6;border:1px solid transparent}
.tab:hover{background:#e9eaf0}
.tab.active{background:var(--brand-soft);color:var(--brand);border-color:#eccfe4}
.tab .d{width:8px;height:8px;border-radius:50%;background:#c9ccd6}
.tab.active .d{background:var(--brand)}

/* layout */
.wrap{max-width:960px;margin:0 auto;padding:26px 20px 90px}
.page-h{font-size:15px;color:var(--muted);margin:0 0 18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:16px;box-shadow:0 1px 2px rgba(20,20,40,.04)}
.flash{background:#eafaf0;border:1px solid #bfe8cf;color:#1f7a45;padding:11px 14px;border-radius:10px;margin-bottom:16px;font-size:13.5px}

/* inputs + buttons */
textarea,input{width:100%;background:#fff;border:1.5px solid #d9dbe3;border-radius:11px;color:var(--ink);padding:12px 13px;font-size:14px;font-family:inherit}
textarea{min-height:90px;resize:vertical}
textarea:focus,input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
button{border:0;border-radius:10px;padding:11px 18px;font-weight:700;font-size:14px;cursor:pointer}
.primary{background:var(--brand);color:#fff}
.primary:hover{background:var(--brand-2)}
.go{background:var(--run);color:#fff}
.ghost{background:#fff;color:#41454f;border:1px solid #d9dbe3}
.ghost:hover{background:#f6f6f9}
button:disabled{opacity:.5;cursor:not-allowed}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

/* table */
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{text-align:left;color:var(--muted);font-weight:600;padding:9px 10px;border-bottom:1px solid var(--line);font-size:12px}
td{padding:11px 10px;border-bottom:1px solid #f0f1f5;vertical-align:top}
tr:last-child td{border-bottom:0}
a{color:var(--brand)} a:hover{text-decoration:underline}
.muted{color:var(--muted)}

/* status pills */
.st{font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;display:inline-block;white-space:nowrap}
.st.pending{background:#fdf3e0;color:#b5771a}
.st.done{background:#e7f7ee;color:#1f9d57}
.st.error{background:#fdeaea;color:#c53b3b}
.st.working{background:#efeaff;color:#6a3ff0}

/* attempts chips (which of the tools tried) */
.chips{display:flex;flex-wrap:wrap;gap:4px}
.chip{font-size:10.5px;padding:2px 7px;border-radius:12px;white-space:nowrap;border:1px solid transparent}
.chip.ok{background:#e7f7ee;color:#1f8f50;border-color:#bfe8cf}
.chip.fail{background:#fdeaea;color:#c04a4a;border-color:#f2cccc}
.chip.skip{background:#f1f2f6;color:#8a8f9c}

/* live progress panel */
.live{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px;margin-bottom:16px;display:none}
.live.show{display:block}
.live-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.live-title{font-weight:700;font-size:14.5px}
.timer{font-variant-numeric:tabular-nums;font-weight:700;color:var(--brand);font-size:15px;background:var(--brand-soft);padding:4px 12px;border-radius:20px}
.stage{color:var(--muted);font-size:13px;margin:8px 0 10px}
.bar{height:6px;background:#eef0f4;border-radius:6px;overflow:hidden;margin-bottom:12px}
.bar > i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--brand),#c23fae);transition:width .4s}
.spin{display:inline-block;width:12px;height:12px;border:2px solid #e4d4de;border-top-color:var(--brand);border-radius:50%;animation:sp .7s linear infinite;vertical-align:-1px;margin-right:6px}
@keyframes sp{to{transform:rotate(360deg)}}

.foot{color:#9aa0ad;font-size:11.5px;margin-top:26px}
.env{font-size:11.5px;color:#9aa0ad;margin-top:12px}
.env b{color:#6b7280;font-weight:600}
.count{background:#fdf3e0;color:#b5771a;border-radius:20px;padding:2px 10px;font-size:12px;font-weight:700}
@media(max-width:680px){.hide-sm{display:none}}

/* live log */
.log{max-height:340px;overflow:auto;background:#0f1017;border-radius:10px;padding:10px 12px;margin-top:10px;
     font-family:"SFMono-Regular",ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;line-height:1.5}
.log-group{margin-bottom:10px}
.log-group:last-child{margin-bottom:0}
.log-head{color:#c9b3e0;font-weight:700;margin:2px 0 4px;font-family:var(--sans)}
.log-row{display:flex;align-items:center;gap:8px;padding:2px 0;color:#cdd3e0}
.log-row .ic{width:14px;text-align:center;flex:none}
.log-row .lb{flex:1;white-space:pre;overflow:hidden;text-overflow:ellipsis}
.log-row .ti{color:#8b93a7;font-variant-numeric:tabular-nums;flex:none}
.log-row.run .lb{color:#fff}
.log-row.ok  .ic{color:#3ecf7f}
.log-row.fail .ic{color:#ff6b6b}
.log-row.fail .lb{color:#ff9a9a}
.log-row.skip .ic{color:#e0b020}
.log-row.run .ic{color:#b98cff}
.miniSpin{display:inline-block;width:9px;height:9px;border:2px solid #3a2f4d;border-top-color:#b98cff;border-radius:50%;animation:sp .7s linear infinite}

/* library */
.lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin-top:16px}
.lib-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 1px 2px rgba(20,20,40,.05);display:flex;flex-direction:column}
.lib-thumb{position:relative;aspect-ratio:16/9;background:#eceef3;overflow:hidden}
.lib-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.lib-dur{position:absolute;right:8px;bottom:8px;background:rgba(15,16,23,.86);color:#fff;font-size:11.5px;font-weight:700;padding:2px 7px;border-radius:5px;font-variant-numeric:tabular-nums}
.lib-body{padding:12px 13px;display:flex;flex-direction:column;gap:8px;flex:1}
.lib-title{font-size:13.5px;font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lib-open{margin-top:auto;font-size:13px;font-weight:700;color:var(--brand)}
.lib-empty{color:var(--muted);text-align:center;padding:40px 0}
.logout{margin-left:8px;color:#9aa0ad;font-size:13px;text-decoration:none;align-self:center}

.lib-actions{margin-top:auto;display:flex;flex-wrap:wrap;gap:6px}
.lib-actions a{font-size:11.5px;font-weight:700;padding:5px 9px;border-radius:8px;border:1px solid var(--line);color:var(--brand);text-decoration:none;background:#fff}
.lib-actions a:hover{background:var(--brand-soft);border-color:#eccfe4}

.lib-actions .del{font-size:11.5px;font-weight:700;padding:5px 9px;border-radius:8px;border:1px solid #f0cccc;color:#c53b3b;background:#fff;cursor:pointer;font-family:var(--sans)}
.lib-actions .del:hover{background:#fdeaea;border-color:#e8b4b4}

.lib-meta{display:flex;align-items:center;gap:8px;font-size:11.5px;margin:-2px 0 2px}
.lib-ver{background:var(--brand-soft);color:var(--brand);font-weight:700;font-size:10.5px;padding:1px 7px;border-radius:10px}

.modeSel{background:#fff;border:1px solid #d9dbe3;border-radius:10px;padding:10px 12px;font-size:13.5px;font-family:inherit;color:var(--ink);cursor:pointer}
.modeSel:focus{outline:none;border-color:var(--brand)}
.lib-eng{background:#eef0f4;color:#5a5f6b;font-weight:600;font-size:10.5px;padding:1px 7px;border-radius:10px;text-transform:capitalize}

/* library toolbar + view modes + selection */
.lib-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;flex-wrap:wrap}
.viewmodes{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.vm{border:0;background:#fff;padding:7px 14px;font-size:13px;font-weight:600;color:#5a5f6b;cursor:pointer;font-family:inherit}
.vm+.vm{border-left:1px solid var(--line)}
.vm.on{background:var(--brand-soft);color:var(--brand)}
.lib-tools{display:flex;gap:8px;align-items:center}
.selbar{display:none;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin-bottom:12px}
.selbar #selcount{font-weight:700;font-size:13.5px}
.lib-card{position:relative}
.lib-check{position:absolute;top:9px;left:9px;z-index:3;width:20px;height:20px;display:none;cursor:pointer;accent-color:var(--brand)}
.selecting .lib-check{display:block}
.selecting .lib-card{cursor:pointer}
.lib-card.sel-on{outline:2.5px solid var(--brand);outline-offset:1px}
.lib-rename{font-size:11.5px;font-weight:700;padding:5px 9px;border-radius:8px;border:1px solid var(--line);color:#5a5f6b;background:#fff;cursor:pointer;font-family:inherit}
.lib-rename:hover{background:#f1f2f6}
/* small mode */
.lib-grid.mode-small{grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:12px}
.mode-small .lib-title{font-size:12px;-webkit-line-clamp:2}
.mode-small .lib-actions a,.mode-small .lib-actions button{font-size:10.5px;padding:4px 7px}
.mode-small .lib-body{padding:9px 10px;gap:6px}
/* list mode */
.lib-grid.mode-list{display:flex;flex-direction:column;gap:10px}
.mode-list .lib-card{flex-direction:row;align-items:stretch}
.mode-list .lib-thumb{width:160px;flex:none;aspect-ratio:16/9}
.mode-list .lib-body{flex:1;padding:12px 14px}
.mode-list .lib-actions{margin-top:8px}
@media(max-width:560px){.mode-list .lib-thumb{width:108px}}

/* homework */
.hw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin-top:8px}
.hw-card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.hw-thumb{display:block;aspect-ratio:4/3;background:#eceef3;overflow:hidden}
.hw-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.hw-foot{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;font-size:12px}
.hw-foot .del{font-size:11px;padding:4px 8px;border-radius:7px;border:1px solid #f0cccc;color:#c53b3b;background:#fff;cursor:pointer;font-family:inherit}

/* camera button on landing */
.cambtn{background:#fff;border:1.5px solid var(--line);border-radius:12px;font-size:20px;line-height:1;padding:0 14px;height:44px;cursor:pointer}
.cambtn:hover{background:var(--brand-soft);border-color:#eccfe4}

/* homework: info button, lightbox, info modal */
.hw-card{position:relative}
.hw-i{width:26px;height:26px;border-radius:50%;border:1px solid var(--line);background:#fff;color:#5a5f6b;font-weight:800;font-style:italic;cursor:pointer;font-family:Georgia,serif}
.hw-i:hover{background:var(--brand-soft);color:var(--brand)}
.ov{position:fixed;inset:0;background:rgba(15,14,26,.82);display:none;align-items:center;justify-content:center;z-index:60}
.ov.show{display:flex}
.lb-stage{position:relative;max-width:96vw;max-height:88vh;overflow:hidden;display:flex;align-items:center;justify-content:center}
.lb-stage img{max-width:96vw;max-height:82vh;transition:transform .12s ease;transform-origin:center;user-select:none}
.lb-bar{position:fixed;top:14px;left:50%;transform:translateX(-50%);display:flex;gap:8px;background:#1c1b28;border:1px solid #34324a;border-radius:12px;padding:7px 9px;z-index:61}
.lb-bar button{background:#2a2840;border:1px solid #3d3a58;color:#e8e6f4;border-radius:8px;padding:7px 12px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
.lb-bar button:hover{background:#3a3758}
.info-modal{background:#fff;border-radius:14px;max-width:440px;width:92vw;max-height:82vh;overflow:auto;padding:18px 20px}
.info-modal h3{margin:0 0 10px;font-size:15px}
.info-modal table{width:100%;font-size:12.5px}
.info-modal td{padding:4px 6px;border-bottom:1px solid var(--line);vertical-align:top;word-break:break-word}
.info-modal td:first-child{color:var(--muted);font-weight:600;white-space:nowrap;width:34%}
.info-modal .x{display:block;margin:14px auto 0;background:var(--brand);color:#fff;border:0;border-radius:9px;padding:9px 16px;font-weight:700;cursor:pointer}