:root{--bg:#f5f7f2;--ink:#1d2a2e;--muted:#5f6e72;--line:#d8dfd8;--panel:#fff;--accent:#176b5c;--soft:#e8f3ef}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px system-ui,-apple-system,"Segoe UI",sans-serif}.topbar{display:flex;justify-content:space-between;align-items:center;padding:20px clamp(18px,5vw,72px);background:#fff;border-bottom:1px solid var(--line)}.brand{color:var(--accent);font-weight:800;text-decoration:none;font-size:20px}.language{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px}.shell{width:min(900px,calc(100% - 32px));margin:40px auto}.panel{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:clamp(22px,5vw,48px);box-shadow:0 10px 35px #1d2a2e0b}.hero{text-align:center}.eyebrow{color:var(--accent);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}h1{font-size:clamp(28px,5vw,44px);line-height:1.1;margin:10px 0}p{color:var(--muted);line-height:1.5}.type-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-top:32px}.type-card{display:grid;gap:10px;text-align:left;padding:24px;border:2px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);cursor:pointer}.type-card:hover,.type-card:focus{border-color:var(--accent);background:var(--soft)}.type-icon{font-size:32px;color:var(--accent)}.type-card small{color:var(--muted)}.hidden{display:none!important}.section-heading{display:flex;justify-content:space-between;gap:20px;align-items:start}form{display:grid;gap:22px;margin-top:26px}label,fieldset{display:grid;gap:8px}label span,legend{font-weight:700}input,textarea,select{font:inherit;border:1px solid #b9c6c0;border-radius:10px;padding:13px;background:#fff;color:var(--ink)}textarea{min-height:110px;resize:vertical}fieldset{border:0;padding:0;margin:0}.answer-row{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;margin-bottom:10px}.correct{display:flex;align-items:center;gap:4px;color:var(--accent);padding:8px}.remove{border:0;background:transparent;color:#8d3f37;font-size:24px;cursor:pointer}.button{display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:10px;background:var(--accent);color:#fff;padding:13px 18px;font:inherit;font-weight:700;cursor:pointer;text-decoration:none}.secondary{background:var(--soft);color:var(--accent)}.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.error{color:#8d3f37;min-height:1.5em;margin:0}.loading{padding:30px;text-align:center}.h5p-container{max-width:100%}@media(max-width:560px){.topbar{padding:16px}.shell{margin:20px auto}.panel{padding:22px}.section-heading{display:grid}.answer-row{grid-template-columns:1fr auto auto}}
.library-filters{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}.library-filters input{flex:1 1 220px}.library-status{min-height:1.5em;margin:0 0 16px}.library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.library-card{border:1px solid var(--line);border-radius:16px;padding:18px;background:#fff;display:grid;gap:12px;align-content:start}.library-card h2{font-size:18px;margin:0}.library-meta{color:var(--muted);font-size:13px;margin:0}.library-card-actions{display:flex;flex-wrap:wrap;gap:8px}.library-card-actions .button{padding:8px 12px;font-size:14px}.library-admin{border-top:1px solid var(--line);margin-top:26px;padding-top:18px}.library-admin summary{cursor:pointer;font-weight:700;color:var(--accent)}.library-admin label{margin-top:14px}.muted{color:var(--muted);font-size:13px}
.compound-source {
  color: var(--muted, #667085);
  margin-inline: .5rem;
}

.bank-dialog {
  border: 0;
  border-radius: 1rem;
  box-shadow: 0 1rem 3rem rgb(0 0 0 / 25%);
  margin: auto;
  max-width: 42rem;
  padding: 1.25rem;
  width: min(92vw, 42rem);
}

.bank-dialog::backdrop { background: rgb(15 23 42 / 55%); }
.bank-list { display: grid; gap: .75rem; margin-top: 1rem; max-height: 55vh; overflow: auto; }
.bank-list .library-card { align-items: center; display: flex; gap: 1rem; justify-content: space-between; }
#catalogAdminEditor { border-top: 1px solid var(--line); margin-top: 1rem; padding-top: 1rem; }
#catalogAdminEditor fieldset { gap: 12px; }

.test-phase {
  background: var(--soft);
  border: 1px solid var(--accent);
  border-radius: 12px;
  color: var(--ink);
  font-size: 14px;
  margin: 18px auto 0;
  max-width: 640px;
  padding: 10px 14px;
}

.test-phase strong { color: var(--accent); }
