/* Shared visual language with NBEL lab. Business rules stay in the existing forms. */
:root { color-scheme:light; --ink:#0f172a; --muted:#475569; --rule:#e2e8f0; --bg:#f8fafc; --acc:#1d4ed8; --acc2:#b91c1c; --ok:#047857; --card:#fff; }
body { min-width:320px; min-height:100vh; font-size:16px; line-height:1.6; background:radial-gradient(circle at top left, rgb(219 234 254 / 70%), transparent 30rem),var(--bg); }
:focus-visible { outline:3px solid #93c5fd; outline-offset:2px; }
header.site-header { display:block; padding:0; background:#fff; border-bottom:1px solid var(--rule); }
.header-inner { max-width:1152px; margin:auto; padding:12px 20px; display:flex; align-items:center; gap:12px; }
.site-header .site-title { margin:0 auto 0 0; font-size:16px; font-weight:700; white-space:nowrap; }
.site-title a { color:#1e40af; }
.header-account { min-width:0; display:flex; justify-content:flex-end; align-items:center; gap:12px; flex-wrap:wrap; }
.professor-label { color:#1e40af; font-size:14px; font-weight:700; }
.account-name { font-size:14px; color:var(--muted); overflow-wrap:anywhere; }
.header-account form { margin:0; }
button.logout-button { padding:8px 12px; border:1px solid #cbd5e1; border-radius:8px; font-size:14px; font-weight:500; white-space:nowrap; }
.lab-logo { position:relative; display:block; width:112px; height:78px; flex-shrink:0; overflow:hidden; border-radius:8px; }
.lab-logo img { position:absolute; width:154px; height:auto; max-width:none; top:50%; left:50%; transform:translate(-50%,-50%); }
.site-navigation { border-top:1px solid #f1f5f9; }
.navigation-inner { max-width:1152px; margin:auto; padding:0 20px; display:flex; gap:24px; overflow-x:auto; }
.site-navigation a { display:flex; align-items:center; min-height:48px; padding:0 4px; border-bottom:2px solid transparent; color:var(--muted); font-size:14px; white-space:nowrap; }
.site-navigation a.active { padding-bottom:0; color:#1e40af; border-bottom-color:var(--acc); }
.site-navigation a:hover { color:var(--ink); background:#f8fafc; }
main { max-width:1152px; margin:28px auto; padding:0 20px 32px; }
.card { border-radius:16px; padding:24px; margin-bottom:24px; box-shadow:0 1px 2px rgb(15 23 42 / 4%); }
h2 { font-size:20px; line-height:1.4; margin-bottom:16px; }
h3 { font-size:16px; }
label { font-size:14px; margin:14px 0 6px; }
.hint,.panel .cap { font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
input[type=text],input[type=url],input[type=email],input[type=password],select,textarea { min-width:0; max-width:100%; padding:10px 12px; border-color:#cbd5e1; border-radius:8px; background:#fff; color:var(--ink); }
input:focus,select:focus,textarea:focus { border-color:#60a5fa; }
textarea { min-height:140px; }
.row { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.row3 { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.row>*,.row3>*,.board>* { min-width:0; }
button,.btn { padding:10px 16px; border-radius:8px; font-size:14px; font-weight:500; line-height:1.5; transition:background-color .15s; }
button:hover:not(:disabled),.btn:hover { filter:brightness(.96); }
.btn.secondary,button.secondary { border-color:#cbd5e1; color:#0f172a; }
.btn.sm,button.sm { padding:7px 12px; font-size:13px; }
button:disabled { cursor:not-allowed; }
.board { grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:20px; }
.col { padding:16px; background:rgb(241 245 249 / 75%); border:1px solid var(--rule); border-radius:16px; }
.col h2 { font-size:16px; gap:8px; flex-wrap:wrap; }
.col h2 small { font-size:12px; }
.mcard { border-radius:12px; padding:18px; margin-bottom:12px; box-shadow:0 1px 2px rgb(15 23 42 / 3%); }
.mcard .t { font-size:15px; line-height:1.6; overflow-wrap:anywhere; }
.mcard .meta { font-size:13px; }
.tag { padding:2px 8px; border-radius:6px; font-size:12px; }
.tag.ok,.check.ok { background:#ecfdf5; color:#065f46; }
.tag.warn,.warn,.check.bad,.panel.bad { background:#fef2f2; color:#991b1b; }
.panel { border-radius:12px; padding:18px; margin:16px 0; background:#f8fafc; border-left-width:4px; }
.panel .id { font-size:16px; }
.panel li { overflow-wrap:anywhere; }
.panel input[type=file] { max-width:100%; font-size:14px; }
::file-selector-button { padding:6px 10px; border:1px solid #cbd5e1; border-radius:6px; background:white; color:var(--ink); cursor:pointer; }
.check,.warn,.readonly { border-radius:8px; font-size:14px; padding:12px 16px; }
details.spec { margin-top:16px; padding-top:12px; }
details.spec summary { font-size:14px; }
.toolbar { gap:12px; }
.toolbar input[type=text],.toolbar input[type=email] { flex:1 1 220px; }
.login-card { max-width:448px; margin:48px auto; padding:32px; }
.login-card button { width:100%; }
@media(max-width:767px) {
  .header-inner { display:grid; grid-template-columns:minmax(0,1fr) 96px; gap:8px 12px; }
  .header-account { grid-column:1 / -1; grid-row:2; justify-content:flex-start; gap:8px 12px; }
  .lab-logo { grid-column:2; grid-row:1; width:96px; height:64px; }
  .lab-logo img { width:128px; }
  .header-account form { margin-left:auto; }
  .row,.row3 { grid-template-columns:minmax(0,1fr); gap:12px; }
  main { margin-top:20px; padding:0 16px 24px; }
  .card { padding:20px; }
  .panel { padding:14px; }
  .login-card { margin:24px auto; }
}