/* Studio: samo dopolnila k oblikovnemu sistemu WorkDZ beta (workdz/beta.css).
   Barve in mere izključno prek žetonov iz beta.css. */

[hidden] { display: none !important; }
.app { min-height: 100vh; }
.side { height: 100vh; }
.top-title { font-weight: 600; color: var(--ink-2); }

/* prijava */
.login { min-height: 100vh; display: grid; place-items: start center; padding: 16vh 16px 40px; }
.login-card { width: min(380px, 100%); display: flex; flex-direction: column; gap: 14px; padding: 32px 28px; box-shadow: var(--shadow-1); }
.login-card .title { font-size: var(--t-38); }
.login-card .lede { margin: -6px 0 6px; font-size: var(--t-14); }
.login-logo { width: 44px; height: 44px; border-radius: 50%; }
.btn.wide { justify-content: center; width: 100%; height: 40px; }

/* mreža dostopa: uporabniki × knjižnice */
.access th.lib { text-transform: none; letter-spacing: 0; font-size: var(--t-14); font-weight: 600; color: var(--ink); text-align: center; min-width: 140px; }
.access th.lib .sub { display: block; font-size: var(--t-12); font-weight: 500; color: var(--muted); margin-top: 1px; }
.access td.sw { text-align: center; }
.access .who { display: flex; align-items: center; gap: 10px; min-width: 200px; }
.access .who .ava { flex: none; }
.access td.sw .live { display: block; font-size: var(--t-11); color: var(--ok); font-weight: 600; margin-top: 4px; }
.person { display: flex; align-items: center; gap: 10px; min-width: 0; }
.person .main { display: block; }

/* stranska plošča kot obrazec */
.sh-form { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.sh-bd .stack { gap: 14px; }
.secret { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid var(--line-2); border-radius: var(--r-m); background: var(--surface-2); }
.secret span { font: 500 20px/1.2 var(--f-mono); letter-spacing: .04em; user-select: all; overflow-wrap: anywhere; }

/* vrstice z dejanji v tabelah */
.tbl .acts { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: nowrap; }
.side-foot .sf-b { text-decoration: none; }
.avabtn { margin-left: auto; }
.day-h { font: 500 var(--t-20)/1.2 var(--f-display); margin: 26px 0 12px; }
.sec-h { font: 500 var(--t-20)/1.2 var(--f-display); margin: 30px 0 12px; display: flex; align-items: center; gap: 12px; }
.sec-h .sp { flex: 1; }
.sec-h .btn { font: 500 var(--t-12)/1 var(--f-ui); }
.sec-p { margin: -4px 0 12px; color: var(--muted); max-width: 70ch; }
.stats.s3 { --cols: 3; }

@media (max-width: 720px) {
  .top-title { display: none; }
  .access .who { min-width: 150px; }
  .stats.s3 { --cols: 1; }
}