/* GENERISANO: node alati/izdvoji-ekran-css.mjs. Ne menjati ručno.
   Komponente aplikacije na početnoj, svaka u svom opsegu: .ekran-app
   (svetla ploča u „Kako radi") i .app-modal (modal za nalog, prati temu
   sajta). Tokeni aplikacije su vezani za opseg, ne za ceo sajt.
   Izvor: wwwroot/css/app/*.css. */

.ekran-app {
--us-radius-xs: 8px;  --us-radius-sm: 12px; --us-radius-md: 16px;
  --us-radius-lg: 18px; --us-radius-xl: 24px; --us-radius-pill: 9999px;
  --us-font: "Outfit", system-ui, sans-serif;
  --us-tracking-tight: -0.03em; --us-tracking-normal: -0.005em; --us-tracking-wide: 0.04em;

  
  --us-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --us-ease-izlaz: cubic-bezier(0.4, 0, 1, 1);
  --us-t-mikro: 160ms;
  --us-t-stanje: 240ms;
  --us-t-ulaz: 360ms;
  --us-t-sekcija: 520ms;
  --us-t-izlaz: 180ms;

  
  --us-traka-siroka: 248px;
  --us-traka-uska: 72px;
  --us-vrh-visina: 64px;
  --us-sadrzaj-max: 1180px;
  --us-tekst-max: 720px;
--us-bg: #0B1220;          --us-fg: #F8FAFC;
  --us-bg2: #0E1728;         --us-fg-muted: #A9B6CA;
  --us-surface: #162238;     --us-fg-subtle: #8A98B0;
  --us-surface2: #1B2A47;    --us-border: #22304E;
  --us-border-soft: #182238;
  --us-accent: #69A8FF;      --us-accent-cta: #2F6BFF;
  --us-na-cta: #FFFFFF;
  --us-tint: rgba(47,107,255,.14);
  --us-mark1: #2F6BFF;       --us-mark2: #69A8FF;

  
  --us-posao: #E879F9;       --us-posao-jak: #C026D3;
  --us-posao-tint: rgba(192,38,211,.16);

  
  --us-boost-fg: #D9F99D;    --us-boost-chip: rgba(217,249,157,.10);
  --us-boost-ivica: rgba(217,249,157,.30);
  --us-boost-polje: #D9F99D; --us-boost-munja: #365314;

  
  --us-ok-bg: #10291B;       --us-ok-fg: #4ADE80;
  --us-warn-bg: #2C2011;     --us-warn-fg: #FBBF24;
  --us-err-bg: #2C1517;      --us-err-fg: #F87171;
  --us-info-bg: #11253D;     --us-info-fg: #38BDF8;

  
  --us-oznaka: #DC2626;

  
  --us-skelet: #1B2A47;      --us-skelet2: #22304E;

  --us-shadow-sm: 0 2px 8px rgba(0,0,0,.30);
  --us-shadow-md: 0 18px 48px rgba(0,0,0,.45);
  --us-senka-podignuta: 0 22px 48px rgba(0,0,0,.5);
  --us-zatamnjenje: rgba(7,11,20,.62);
  color-scheme: dark;
--us-bg: #F7FAFC;          --us-fg: #0F172A;
  --us-bg2: #FFFFFF;         --us-fg-muted: #475569;
  --us-surface: #FFFFFF;     --us-fg-subtle: #64748B;
  --us-surface2: #F1F5F9;    --us-border: #E2E8F0;
  --us-border-soft: #EEF2F7;
  --us-accent: #2456CC;      --us-accent-cta: #2F6BFF;
  --us-na-cta: #FFFFFF;
  --us-tint: #E9F2FF;
  --us-mark1: #0E2F8C;       --us-mark2: #2463D8;
  --us-posao: #A21CAF;       --us-posao-jak: #C026D3;
  --us-posao-tint: #FAE8FF;
  --us-boost-fg: #365314;    --us-boost-chip: #F4FCE3;
  --us-boost-ivica: #D9F99D;
  --us-boost-polje: #D9F99D; --us-boost-munja: #365314;
  --us-ok-bg: #DCFCE7;       --us-ok-fg: #15803D;
  --us-warn-bg: #FEF3C7;     --us-warn-fg: #92400E;
  --us-err-bg: #FEF2F2;      --us-err-fg: #DC2626;
  --us-info-bg: #EFF6FF;     --us-info-fg: #0369A1;
  --us-oznaka: #DC2626;
  --us-skelet: #E8EDF3;      --us-skelet2: #DCE3EC;
  --us-shadow-sm: 0 2px 8px rgba(15,23,42,.06);
  --us-shadow-md: 0 18px 48px rgba(15,23,42,.10);
  --us-senka-podignuta: 0 18px 40px rgba(15,23,42,.14);
  
  --us-zatamnjenje: rgba(15,23,42,.28);
  color-scheme: light;
  color-scheme: light;
  color: var(--us-fg);
  font-family: var(--us-font);
}

.ekran-app a { color: inherit; text-decoration: none; font-weight: inherit; }
.ekran-app a:hover { text-decoration: none; }

/* ── .ekran-app, iz app-ljuska.css ── */
.ekran-app .ik {
  width: 20px;
  height: 20px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ekran-app .ik-sm {
  width: 16px;
  height: 16px;
}
.ekran-app .ik-lg {
  width: 28px;
  height: 28px;
}
.ekran-app .sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.ekran-app .avatar {
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--us-tint);
  color: var(--us-accent);
  font-weight: 700;
  font-size: 14px;
}
.ekran-app .avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ekran-app .avatar-sm {
  width: 28px;
  height: 28px;
  font-size: 12px;
}
.ekran-app .avatar-lg {
  width: 48px;
  height: 48px;
  font-size: 18px;
}
.ekran-app .avatar[data-pol="posao"] {
  background: var(--us-posao-tint);
  color: var(--us-posao);
}
.ekran-app .dugme {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: var(--us-radius-sm);
  font: 600 14px/1 var(--us-font);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--us-t-mikro) var(--us-ease), border-color var(--us-t-mikro) var(--us-ease), transform 120ms var(--us-ease);
}
.ekran-app .dugme:active {
  transform: scale(.98);
}
.ekran-app .dugme-glavno {
  background: var(--us-accent-cta);
  color: var(--us-na-cta);
  box-shadow: 0 10px 24px rgba(47,107,255,.25);
}
.ekran-app .dugme-glavno:hover {
  background: #1E54E5;
}
.ekran-app .dugme-posao {
  background: var(--us-posao-jak);
  color: #FFFFFF;
}
.ekran-app .dugme-posao:hover {
  background: #A21CAF;
}
.ekran-app .dugme-sporedno {
  background: var(--us-surface);
  color: var(--us-fg);
  border-color: var(--us-border);
}
.ekran-app .dugme-sporedno:hover {
  background: var(--us-surface2);
}
.ekran-app .dugme-tiho {
  background: transparent;
  color: var(--us-accent);
  padding: 0 10px;
}
.ekran-app .dugme-tiho:hover {
  background: var(--us-tint);
}
.ekran-app .dugme-malo {
  min-height: 36px;
  padding: 0 12px;
  font-size: 13px;
  border-radius: 10px;
}
.ekran-app .dugme-puno {
  width: 100%;
}
.ekran-app .dugme[disabled] {
  opacity: .5;
  pointer-events: none;
}
.ekran-app .kartica {
  background: var(--us-surface);
  border: 1px solid var(--us-border);
  border-radius: var(--us-radius-lg);
  box-shadow: var(--us-shadow-sm);
}
.ekran-app .kartica-telo {
  padding: 20px;
}
.ekran-app .priguseno {
  color: var(--us-fg-muted);
}
.ekran-app .sitno {
  font-size: 12px;
  color: var(--us-fg-subtle);
}
.ekran-app .oznaka-polja {
  display: block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: var(--us-tracking-wide);
  text-transform: uppercase;
  color: var(--us-fg-subtle);
  margin-bottom: 6px;
}
.ekran-app .polje {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid var(--us-border);
  border-radius: var(--us-radius-sm);
  background: var(--us-surface);
  color: var(--us-fg);
  font: 400 14px/1.4 var(--us-font);
  transition: border-color var(--us-t-mikro) var(--us-ease), box-shadow var(--us-t-mikro) var(--us-ease);
}
.ekran-app .polje:focus-within,
.ekran-app .polje:focus {
  outline: none;
  border-color: var(--us-accent);
  box-shadow: 0 0 0 4px var(--us-tint);
}
.ekran-app .polje input,
.ekran-app .polje textarea {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}
.ekran-app textarea.polje {
  padding: 12px 14px;
  min-height: 120px;
  resize: vertical;
}
.ekran-app .polje::placeholder,
.ekran-app .polje input::placeholder,
.ekran-app .polje textarea::placeholder {
  color: var(--us-fg-subtle);
}
.ekran-app .cip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--us-border);
  border-radius: var(--us-radius-pill);
  background: var(--us-surface);
  color: var(--us-fg-muted);
  font: 600 13px/1 var(--us-font);
  white-space: nowrap;
  cursor: pointer;
}
.ekran-app .cip[aria-pressed="true"] {
  background: var(--us-accent-cta);
  border-color: var(--us-accent-cta);
  color: var(--us-na-cta);
}
.ekran-app .stc .ik {
  width: 13px;
  height: 13px;
  stroke-width: 2.4;
}
.ekran-app .boost {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  padding: 0 8px 0 3px;
  border: 1px solid var(--us-boost-ivica);
  border-radius: var(--us-radius-pill);
  background: var(--us-boost-chip);
  color: var(--us-boost-fg);
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.ekran-app .boost-znak {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background: var(--us-boost-polje);
  color: var(--us-boost-munja);
}
.ekran-app .boost-znak svg {
  width: 12px;
  height: 12px;
  fill: currentColor;
  stroke: none;
}
.ekran-app .boost-ugao {
  position: absolute;
  top: 10px;
  left: 10px;
}
.ekran-app .pol-posao {
  color: var(--us-posao);
}
.ekran-app .jc {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  border-radius: var(--us-radius-lg);
  background: var(--us-surface);
  border: 1px solid var(--us-border);
  box-shadow: var(--us-shadow-sm);
  text-decoration: none;
  color: var(--us-fg);
  transition: transform 220ms var(--us-ease), box-shadow 220ms var(--us-ease);
}
.ekran-app .jc:hover {
  transform: translateY(-4px);
  box-shadow: var(--us-senka-podignuta);
}
.ekran-app .jc-vrh {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--us-fg-subtle);
}
.ekran-app .jc b {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
}
.ekran-app .jc-dno {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin-top: auto;
  font-size: 12px;
  color: var(--us-fg-muted);
}
.ekran-app .plata {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 10px;
  border-radius: var(--us-radius-pill);
  background: var(--us-posao-tint);
  color: var(--us-posao);
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.ekran-app .plata-vol {
  background: var(--us-ok-bg);
  color: var(--us-ok-fg);
}
.ekran-app .lc {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--us-radius-lg);
  background: var(--us-surface);
  border: 1px solid var(--us-border);
  box-shadow: var(--us-shadow-sm);
  color: var(--us-fg);
  text-decoration: none;
  transition: transform 220ms var(--us-ease), box-shadow 220ms var(--us-ease);
}
.ekran-app .lc:hover {
  transform: translateY(-4px);
  box-shadow: var(--us-senka-podignuta);
}
.ekran-app .lc-slika {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--us-skelet);
}
.ekran-app .lc-slika img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 400ms var(--us-ease);
}
.ekran-app .lc:hover .lc-slika img {
  transform: scale(1.04);
}
.ekran-app .lc-omiljeni {
  position: absolute;
  top: 8px;
  right: 8px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: color-mix(in srgb, var(--us-surface) 90%, transparent);
  color: var(--us-fg);
  cursor: pointer;
}
.ekran-app .lc-telo {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 12px 14px 14px;
}
.ekran-app .lc-kat {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: var(--us-tracking-wide);
  text-transform: uppercase;
  color: var(--us-accent);
}
.ekran-app .lc-naslov {
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ekran-app .lc-ko {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: var(--us-fg-muted);
  white-space: nowrap;
  overflow: hidden;
}
.ekran-app .lc-dno {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  font-size: 13px;
}
.ekran-app .lc-cena {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.ekran-app .lc-ocena {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--us-fg-muted);
  font-variant-numeric: tabular-nums;
}
.ekran-app .zvezda {
  width: 14px;
  height: 14px;
  fill: #F59E0B;
  stroke: none;
  flex: none;
}
.ekran-app .lc[data-boost="da"] {
  border-color: var(--us-boost-ivica);
  box-shadow: 0 0 0 1px var(--us-boost-ivica), var(--us-shadow-sm);
}
.ekran-app .ver {
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--us-accent-cta);
  color: #FFFFFF;
  flex: none;
}
.ekran-app .ver svg {
  width: 10px;
  height: 10px;
  stroke-width: 3;
}

/* ── .ekran-app, iz app-stanja.css ── */
.ekran-app .greska > .ik {
  color: var(--us-err-fg);
  margin-top: 2px;
}
.ekran-app .veza .dugme {
  margin-left: auto;
  min-height: 32px;
  color: var(--us-warn-fg);
}
.ekran-app .nacrt .ik {
  color: var(--us-ok-fg);
}
.ekran-app .ulaz {
  animation: us-kartica-ulaz var(--us-t-ulaz) var(--us-ease) both;
}
.ekran-app .ulaz:nth-child(2) {
  animation-delay: 40ms;
}
.ekran-app .ulaz:nth-child(3) {
  animation-delay: 80ms;
}
.ekran-app .ulaz:nth-child(4) {
  animation-delay: 120ms;
}
.ekran-app .ulaz:nth-child(5) {
  animation-delay: 160ms;
}
.ekran-app .ulaz:nth-child(6) {
  animation-delay: 200ms;
}
.ekran-app .ulaz:nth-child(7) {
  animation-delay: 240ms;
}
.ekran-app .ulaz:nth-child(n+8) {
  animation-delay: 280ms;
}

/* ── .ekran-app, iz app-zivo.css ── */
.ekran-app .boost-znak svg {
  transform-origin: 50% 50%;
  animation: us-munja 6s var(--us-ease) infinite;
}
.ekran-app .boost:hover .boost-znak svg,
.ekran-app .dugme-boost:hover .boost-znak svg,
.ekran-app .boost-glava:hover .boost-znak svg {
  animation: us-munja-odmah 520ms var(--us-ease) both;
}
.ekran-app .boost {
  position: relative;
  overflow: hidden;
}
.ekran-app .boost::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%);
  transform: translateX(-130%);
  animation: us-sjaj-prolaz 6s var(--us-ease) infinite 1.2s;
}
.ekran-app .lc[data-boost="da"]::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 38%, rgba(217,249,157,.16) 50%, transparent 62%);
  transform: translateX(-130%);
  animation: us-sjaj-prolaz 6s var(--us-ease) infinite;
}
.ekran-app .lc[data-boost="da"]::after {
  background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.5) 50%, transparent 62%);
}
.ekran-app .lc[data-boost="da"]:hover {
  box-shadow: 0 0 0 1px var(--us-boost-ivica), var(--us-senka-podignuta);
}
.ekran-app .dugme-boost {
  position: relative;
  overflow: hidden;
}
.ekran-app .dugme-boost::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.6) 50%, transparent 70%);
  transform: translateX(-130%);
  transition: transform 700ms var(--us-ease);
}
.ekran-app .dugme-boost:hover::after {
  transform: translateX(130%);
}
.ekran-app .boost-glava {
  position: relative;
  isolation: isolate;
}
.ekran-app .boost-glava::before {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: -1;
  border-radius: inherit;
  box-shadow: 0 0 0 1px rgba(217,249,157,.35), 0 10px 28px rgba(132,204,22,.18);
  animation: us-sjaj-disanje 6s ease-in-out infinite;
}
.ekran-app .lc-omiljeni {
  transition: transform var(--us-t-mikro) var(--us-ease);
}
.ekran-app .lc-omiljeni:hover {
  transform: scale(1.08);
}
.ekran-app .lc-omiljeni:active {
  transform: scale(.92);
}
.ekran-app .lc-omiljeni[aria-pressed="true"] {
  color: #E11D48;
}
.ekran-app .lc-omiljeni[aria-pressed="true"] svg {
  fill: #E11D48;
  animation: us-srce 420ms var(--us-ease) both;
}
.ekran-app .stavka .ik {
  transition: transform var(--us-t-mikro) var(--us-ease);
}
.ekran-app .stavka:hover .ik {
  transform: translateX(2px);
}
.ekran-app .stavka[aria-current="page"] .ik {
  animation: us-oznaka-ulaz var(--us-t-ulaz) var(--us-ease) both;
}

/* ── .ekran-app, iz app-pretraga.css ── */
.ekran-app .pt-forma {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}
.ekran-app .pt-forma .polje {
  flex: 1 1 260px;
}
.ekran-app .pt-forma .pt-grad {
  flex: 0 1 220px;
}
.ekran-app .seg {
  position: relative;
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
  padding: 4px;
  border-radius: 14px;
  background: var(--us-surface2);
  border: 1px solid var(--us-border);
  flex: none;
}
.ekran-app .seg-klizac {
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 4px;
  width: calc(50% - 4px);
  border-radius: 10px;
  background: var(--us-accent-cta);
  transition: transform var(--us-t-stanje) var(--us-ease), background-color var(--us-t-stanje) var(--us-ease);
}
.ekran-app .seg[data-vrsta="posao"] .seg-klizac {
  transform: translateX(100%);
  background: var(--us-posao-jak);
}
.ekran-app .seg button {
  position: relative;
  z-index: 1;
  min-width: 96px;
  min-height: 36px;
  padding: 0 14px;
  border: 0;
  background: transparent;
  color: var(--us-fg-muted);
  font: 600 14px/1 var(--us-font);
  cursor: pointer;
  transition: color var(--us-t-stanje) var(--us-ease);
}
.ekran-app .seg button[aria-pressed="true"] {
  color: #FFFFFF;
}
.ekran-app .pt-cena .polje {
  padding: 0 10px;
  min-width: 0;
}
.ekran-app .pt-aktivni .cip {
  min-height: 30px;
  padding: 0 8px 0 12px;
  font-size: 12px;
}

/* ── .ekran-app, iz app-javno.css ── */
.ekran-app .dugme-blok {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ekran-app a.dugme {
  text-decoration: none;
}
.ekran-app .vrh-radnja.dugme-posao {
  box-shadow: 0 8px 22px rgba(192, 38, 211, .3);
}
.ekran-app .seg a {
  position: relative;
  z-index: 1;
  display: inline-grid;
  place-items: center;
  min-width: 96px;
  min-height: 36px;
  padding: 0 14px;
  color: var(--us-fg-muted);
  font: 600 14px/1 var(--us-font);
  text-decoration: none;
  transition: color var(--us-t-stanje) var(--us-ease);
}
.ekran-app .seg a[aria-current="page"] {
  color: #FFFFFF;
}
.ekran-app .lc-bez-slike {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: var(--us-fg-subtle);
}
.ekran-app .lc a.lc-omiljeni {
  text-decoration: none;
}
.ekran-app .dt-radnja a.dugme,
.ekran-app .dt-cta-tel a.dugme {
  justify-content: center;
}
.ekran-app img.avatar {
  object-fit: cover;
  padding: 0;
}
.ekran-app .zbir-ocena {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
}
.ekran-app .zbir-broj {
  font-size: 44px;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
}
.ekran-app .zbir-raspodela {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 200px;
  min-width: 180px;
}
.ekran-app .zbir-red {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) 28px;
  gap: 8px;
  align-items: center;
  font-size: 12px;
}
.ekran-app .zbir-traka {
  height: 6px;
  border-radius: 999px;
  background: var(--us-surface2);
  overflow: hidden;
}
.ekran-app .zbir-traka i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--us-accent-cta);
}
.ekran-app .nalog-forma .polje {
  width: 100%;
}
.ekran-app .nalog-forma .sitno {
  margin-top: 4px;
}
.ekran-app .pt-grad {
  position: relative;
}
.ekran-app .grad-lista {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 50;
  max-height: 220px;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid var(--us-border-soft);
  border-radius: 14px;
  background: var(--us-surface);
  box-shadow: var(--us-shadow-md);
}
.ekran-app .grad-stavka {
  display: block;
  width: 100%;
  padding: 11px 14px;
  border: 0;
  border-bottom: 1px solid var(--us-border-soft);
  background: none;
  color: var(--us-fg);
  font: 500 13px/1.3 var(--us-font);
  text-align: left;
  cursor: pointer;
}
.ekran-app .grad-stavka:last-child {
  border-bottom: 0;
}
.ekran-app .grad-stavka:hover,
.ekran-app .grad-stavka[aria-selected="true"] {
  background: var(--us-surface2);
}
.ekran-app .greska[data-vrsta="info"] > .ik {
  color: var(--us-accent);
}

/* ── .ekran-app, iz app-ostalo.css ── */
.ekran-app .red-l .ik {
  color: var(--us-fg-muted);
}
.ekran-app .red-l[data-opasno="da"] .ik {
  color: var(--us-err-fg);
}
.ekran-app .prof-telo .avatar {
  width: 88px;
  height: 88px;
  font-size: 30px;
  border: 4px solid var(--us-surface);
}
.ekran-app .zvezde {
  display: flex;
  gap: 6px;
}
.ekran-app .zvezde button {
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 12px;
  background: var(--us-surface2);
  cursor: pointer;
  display: grid;
  place-items: center;
}
.ekran-app .zvezde button svg {
  width: 26px;
  height: 26px;
  fill: var(--us-fg-subtle);
  opacity: .4;
  stroke: none;
  transition: transform var(--us-t-mikro) var(--us-ease);
}
.ekran-app .zvezde button[aria-pressed="true"] svg {
  fill: #F59E0B;
  opacity: 1;
}
.ekran-app .zvezde button:active svg {
  transform: scale(.9);
}
.ekran-app .lc-link {
  display: flex;
  flex-direction: column;
  color: inherit;
  text-decoration: none;
}
.ekran-app .lc-link:focus-visible {
  outline-offset: -2px;
}

/* ── .ekran-app, iz app-obrasci.css ── */
.ekran-app .ob-nacrt .ik {
  color: var(--us-ok-fg);
}
.ekran-app .ob-nacrt[data-stanje="lokalno"] .ik {
  color: var(--us-warn-fg);
}
.ekran-app .ob-red {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.ekran-app .ob-polje {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ekran-app .ob-polje > span:first-child {
  font-size: 13px;
  font-weight: 600;
}
.ekran-app .ob-pomoc {
  font-size: 12px;
  color: var(--us-fg-subtle);
}
.ekran-app .ob-polje[data-greska="da"] .polje {
  border-color: var(--us-err-fg);
}
.ekran-app .ob-polje[data-greska="da"] .ob-pomoc {
  color: var(--us-err-fg);
}
.ekran-app .ob-izbor {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ekran-app .ob-spisak span[data-ok="da"] .ik {
  color: var(--us-ok-fg);
}
.ekran-app .ob-spisak span[data-ok="ne"] .ik {
  color: var(--us-fg-subtle);
}

.app-modal {
--us-radius-xs: 8px;  --us-radius-sm: 12px; --us-radius-md: 16px;
  --us-radius-lg: 18px; --us-radius-xl: 24px; --us-radius-pill: 9999px;
  --us-font: "Outfit", system-ui, sans-serif;
  --us-tracking-tight: -0.03em; --us-tracking-normal: -0.005em; --us-tracking-wide: 0.04em;

  
  --us-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --us-ease-izlaz: cubic-bezier(0.4, 0, 1, 1);
  --us-t-mikro: 160ms;
  --us-t-stanje: 240ms;
  --us-t-ulaz: 360ms;
  --us-t-sekcija: 520ms;
  --us-t-izlaz: 180ms;

  
  --us-traka-siroka: 248px;
  --us-traka-uska: 72px;
  --us-vrh-visina: 64px;
  --us-sadrzaj-max: 1180px;
  --us-tekst-max: 720px;
--us-bg: #0B1220;          --us-fg: #F8FAFC;
  --us-bg2: #0E1728;         --us-fg-muted: #A9B6CA;
  --us-surface: #162238;     --us-fg-subtle: #8A98B0;
  --us-surface2: #1B2A47;    --us-border: #22304E;
  --us-border-soft: #182238;
  --us-accent: #69A8FF;      --us-accent-cta: #2F6BFF;
  --us-na-cta: #FFFFFF;
  --us-tint: rgba(47,107,255,.14);
  --us-mark1: #2F6BFF;       --us-mark2: #69A8FF;

  
  --us-posao: #E879F9;       --us-posao-jak: #C026D3;
  --us-posao-tint: rgba(192,38,211,.16);

  
  --us-boost-fg: #D9F99D;    --us-boost-chip: rgba(217,249,157,.10);
  --us-boost-ivica: rgba(217,249,157,.30);
  --us-boost-polje: #D9F99D; --us-boost-munja: #365314;

  
  --us-ok-bg: #10291B;       --us-ok-fg: #4ADE80;
  --us-warn-bg: #2C2011;     --us-warn-fg: #FBBF24;
  --us-err-bg: #2C1517;      --us-err-fg: #F87171;
  --us-info-bg: #11253D;     --us-info-fg: #38BDF8;

  
  --us-oznaka: #DC2626;

  
  --us-skelet: #1B2A47;      --us-skelet2: #22304E;

  --us-shadow-sm: 0 2px 8px rgba(0,0,0,.30);
  --us-shadow-md: 0 18px 48px rgba(0,0,0,.45);
  --us-senka-podignuta: 0 22px 48px rgba(0,0,0,.5);
  --us-zatamnjenje: rgba(7,11,20,.62);
  color-scheme: dark;
  color: var(--us-fg);
  font-family: var(--us-font);
}

:root[data-theme="light"] .app-modal {
--us-bg: #F7FAFC;          --us-fg: #0F172A;
  --us-bg2: #FFFFFF;         --us-fg-muted: #475569;
  --us-surface: #FFFFFF;     --us-fg-subtle: #64748B;
  --us-surface2: #F1F5F9;    --us-border: #E2E8F0;
  --us-border-soft: #EEF2F7;
  --us-accent: #2456CC;      --us-accent-cta: #2F6BFF;
  --us-na-cta: #FFFFFF;
  --us-tint: #E9F2FF;
  --us-mark1: #0E2F8C;       --us-mark2: #2463D8;
  --us-posao: #A21CAF;       --us-posao-jak: #C026D3;
  --us-posao-tint: #FAE8FF;
  --us-boost-fg: #365314;    --us-boost-chip: #F4FCE3;
  --us-boost-ivica: #D9F99D;
  --us-boost-polje: #D9F99D; --us-boost-munja: #365314;
  --us-ok-bg: #DCFCE7;       --us-ok-fg: #15803D;
  --us-warn-bg: #FEF3C7;     --us-warn-fg: #92400E;
  --us-err-bg: #FEF2F2;      --us-err-fg: #DC2626;
  --us-info-bg: #EFF6FF;     --us-info-fg: #0369A1;
  --us-oznaka: #DC2626;
  --us-skelet: #E8EDF3;      --us-skelet2: #DCE3EC;
  --us-shadow-sm: 0 2px 8px rgba(15,23,42,.06);
  --us-shadow-md: 0 18px 48px rgba(15,23,42,.10);
  --us-senka-podignuta: 0 18px 40px rgba(15,23,42,.14);
  
  --us-zatamnjenje: rgba(15,23,42,.28);
  color-scheme: light;
}

@media (prefers-color-scheme: light) {
:root:not([data-theme]) .app-modal {
--us-bg: #F7FAFC;          --us-fg: #0F172A;
  --us-bg2: #FFFFFF;         --us-fg-muted: #475569;
  --us-surface: #FFFFFF;     --us-fg-subtle: #64748B;
  --us-surface2: #F1F5F9;    --us-border: #E2E8F0;
  --us-border-soft: #EEF2F7;
  --us-accent: #2456CC;      --us-accent-cta: #2F6BFF;
  --us-na-cta: #FFFFFF;
  --us-tint: #E9F2FF;
  --us-mark1: #0E2F8C;       --us-mark2: #2463D8;
  --us-posao: #A21CAF;       --us-posao-jak: #C026D3;
  --us-posao-tint: #FAE8FF;
  --us-boost-fg: #365314;    --us-boost-chip: #F4FCE3;
  --us-boost-ivica: #D9F99D;
  --us-boost-polje: #D9F99D; --us-boost-munja: #365314;
  --us-ok-bg: #DCFCE7;       --us-ok-fg: #15803D;
  --us-warn-bg: #FEF3C7;     --us-warn-fg: #92400E;
  --us-err-bg: #FEF2F2;      --us-err-fg: #DC2626;
  --us-info-bg: #EFF6FF;     --us-info-fg: #0369A1;
  --us-oznaka: #DC2626;
  --us-skelet: #E8EDF3;      --us-skelet2: #DCE3EC;
  --us-shadow-sm: 0 2px 8px rgba(15,23,42,.06);
  --us-shadow-md: 0 18px 48px rgba(15,23,42,.10);
  --us-senka-podignuta: 0 18px 40px rgba(15,23,42,.14);
  
  --us-zatamnjenje: rgba(15,23,42,.28);
  color-scheme: light;
}
}

.app-modal a { color: inherit; text-decoration: none; font-weight: inherit; }
.app-modal a:hover { text-decoration: none; }

/* ── .app-modal, iz app-ljuska.css ── */
.app-modal .ik {
  width: 20px;
  height: 20px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.app-modal .ik-sm {
  width: 16px;
  height: 16px;
}
.app-modal .ik-lg {
  width: 28px;
  height: 28px;
}
.app-modal .sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.app-modal .avatar {
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--us-tint);
  color: var(--us-accent);
  font-weight: 700;
  font-size: 14px;
}
.app-modal .avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.app-modal .avatar-sm {
  width: 28px;
  height: 28px;
  font-size: 12px;
}
.app-modal .avatar-lg {
  width: 48px;
  height: 48px;
  font-size: 18px;
}
.app-modal .avatar[data-pol="posao"] {
  background: var(--us-posao-tint);
  color: var(--us-posao);
}
.app-modal .ikon-dugme {
  position: relative;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: var(--us-radius-sm);
  background: transparent;
  color: var(--us-fg-muted);
  cursor: pointer;
}
.app-modal .ikon-dugme:hover {
  background: var(--us-surface2);
  color: var(--us-fg);
}
.app-modal .ikon-dugme .broj {
  position: absolute;
  top: 4px;
  right: 2px;
  min-width: 18px;
  height: 18px;
  line-height: 15px;
  font-size: 10px;
  padding: 0 4px;
  border: 1.5px solid var(--us-bg);
}
.app-modal .dugme {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: var(--us-radius-sm);
  font: 600 14px/1 var(--us-font);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--us-t-mikro) var(--us-ease), border-color var(--us-t-mikro) var(--us-ease), transform 120ms var(--us-ease);
}
.app-modal .dugme:active {
  transform: scale(.98);
}
.app-modal .dugme-glavno {
  background: var(--us-accent-cta);
  color: var(--us-na-cta);
  box-shadow: 0 10px 24px rgba(47,107,255,.25);
}
.app-modal .dugme-glavno:hover {
  background: #1E54E5;
}
.app-modal .dugme-posao {
  background: var(--us-posao-jak);
  color: #FFFFFF;
}
.app-modal .dugme-posao:hover {
  background: #A21CAF;
}
.app-modal .dugme-sporedno {
  background: var(--us-surface);
  color: var(--us-fg);
  border-color: var(--us-border);
}
.app-modal .dugme-sporedno:hover {
  background: var(--us-surface2);
}
.app-modal .dugme-tiho {
  background: transparent;
  color: var(--us-accent);
  padding: 0 10px;
}
.app-modal .dugme-tiho:hover {
  background: var(--us-tint);
}
.app-modal .dugme-malo {
  min-height: 36px;
  padding: 0 12px;
  font-size: 13px;
  border-radius: 10px;
}
.app-modal .dugme-puno {
  width: 100%;
}
.app-modal .dugme[disabled] {
  opacity: .5;
  pointer-events: none;
}
.app-modal .sitno {
  font-size: 12px;
  color: var(--us-fg-subtle);
}
.app-modal .oznaka-polja {
  display: block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: var(--us-tracking-wide);
  text-transform: uppercase;
  color: var(--us-fg-subtle);
  margin-bottom: 6px;
}
.app-modal .polje {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid var(--us-border);
  border-radius: var(--us-radius-sm);
  background: var(--us-surface);
  color: var(--us-fg);
  font: 400 14px/1.4 var(--us-font);
  transition: border-color var(--us-t-mikro) var(--us-ease), box-shadow var(--us-t-mikro) var(--us-ease);
}
.app-modal .polje:focus-within,
.app-modal .polje:focus {
  outline: none;
  border-color: var(--us-accent);
  box-shadow: 0 0 0 4px var(--us-tint);
}
.app-modal .polje input,
.app-modal .polje textarea {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}
.app-modal textarea.polje {
  padding: 12px 14px;
  min-height: 120px;
  resize: vertical;
}
.app-modal .polje::placeholder,
.app-modal .polje input::placeholder,
.app-modal .polje textarea::placeholder {
  color: var(--us-fg-subtle);
}
.app-modal .stc .ik {
  width: 13px;
  height: 13px;
  stroke-width: 2.4;
}

/* ── .app-modal, iz app-stanja.css ── */
.app-modal .greska > .ik {
  color: var(--us-err-fg);
  margin-top: 2px;
}
.app-modal .veza .dugme {
  margin-left: auto;
  min-height: 32px;
  color: var(--us-warn-fg);
}
.app-modal .modal {
  width: min(440px, 100%);
  padding: 24px;
  border: 1px solid var(--us-border);
  border-radius: var(--us-radius-xl);
  background: var(--us-surface);
  box-shadow: var(--us-shadow-md);
  animation: us-modal-ulaz var(--us-t-ulaz) var(--us-ease) both;
}
.app-modal .modal h2 {
  margin: 0 0 6px;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.app-modal .modal p {
  margin: 0 0 16px;
  color: var(--us-fg-muted);
}
.app-modal .nacrt .ik {
  color: var(--us-ok-fg);
}

/* ── .app-modal, iz app-javno.css ── */
.app-modal .lnk {
  padding: 0;
  border: 0;
  background: none;
  color: var(--us-accent);
  font: inherit;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.app-modal .lnk:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.app-modal .dugme-blok {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.app-modal a.dugme {
  text-decoration: none;
}
.app-modal .vrh-radnja.dugme-posao {
  box-shadow: 0 8px 22px rgba(192, 38, 211, .3);
}
.app-modal .dt-radnja a.dugme,
.app-modal .dt-cta-tel a.dugme {
  justify-content: center;
}
.app-modal img.avatar {
  object-fit: cover;
  padding: 0;
}
.app-modal .nalog-forma {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.app-modal .nalog-forma label {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.app-modal .nalog-forma .polje {
  width: 100%;
}
.app-modal .nalog-forma .sitno {
  margin-top: 4px;
}
.app-modal .nalog-saglasnost {
  flex-direction: row !important;
  align-items: flex-start;
  gap: 10px !important;
  font-size: 13.5px;
  line-height: 1.45;
}
.app-modal .nalog-saglasnost input {
  margin-top: 2px;
  flex: none;
}
.app-modal .nalog-modal {
  position: fixed;
  padding: 24px;
  border-color: color-mix(in srgb, var(--us-accent) 35%, var(--us-border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--us-accent) 18%, transparent), 0 30px 80px rgba(2, 8, 23, .55);
}
.app-modal .nalog-modal h2 {
  padding-right: 36px;
}
.app-modal .nalog-modal[open] {
  display: block;
}
.app-modal .nalog-modal::backdrop {
  background: rgba(7, 11, 20, .72);
  backdrop-filter: blur(3px);
}
.app-modal .nalog-tabovi {
  position: relative;
  padding: 4px;
  border: 1px solid var(--us-border);
  border-radius: 14px;
}
.app-modal .nalog-tabovi::before {
  content: "";
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 4px;
  width: calc(50% - 4px);
  border-radius: 10px;
  background: var(--us-accent-cta);
  box-shadow: 0 6px 16px rgba(47, 107, 255, .35);
  transition: transform var(--us-t-stanje) var(--us-ease);
}
.app-modal .nalog-modal[data-tab-aktivan="registracija"] .nalog-tabovi::before {
  transform: translateX(100%);
}
.app-modal .nalog-tabovi [role="tab"] {
  position: relative;
  z-index: 1;
  height: 40px;
  border-radius: 10px;
  font-size: 14.5px;
  transition: color var(--us-t-stanje) var(--us-ease);
}
.app-modal .nalog-tabovi [role="tab"]:hover {
  color: var(--us-fg);
}
.app-modal .nalog-tabovi [role="tab"][aria-selected="true"] {
  background: transparent;
  box-shadow: none;
  color: #FFFFFF;
}
.app-modal .nalog-tabovi [role="tab"]:focus-visible {
  outline: 2px solid var(--us-accent);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
.app-modal .nalog-tabovi::before {
  transition: none;
}
}
.app-modal .nalog-google {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  border: 1px solid var(--us-border);
  border-radius: 12px;
  background: #FFFFFF;
  color: #1F1F1F;
  font: 600 14.5px/1 var(--us-font);
  text-decoration: none;
}
.app-modal .nalog-google:hover {
  box-shadow: 0 4px 14px rgba(2, 8, 23, .25);
}
.app-modal .nalog-google svg {
  width: 18px;
  height: 18px;
  flex: none;
}
.app-modal .nalog-spoljno {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 14px;
}
.app-modal .nalog-spoljno:empty {
  display: none;
}
.app-modal .grad-polje {
  position: relative;
}
.app-modal .grad-lista {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 50;
  max-height: 220px;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid var(--us-border-soft);
  border-radius: 14px;
  background: var(--us-surface);
  box-shadow: var(--us-shadow-md);
}
.app-modal .grad-stavka {
  display: block;
  width: 100%;
  padding: 11px 14px;
  border: 0;
  border-bottom: 1px solid var(--us-border-soft);
  background: none;
  color: var(--us-fg);
  font: 500 13px/1.3 var(--us-font);
  text-align: left;
  cursor: pointer;
}
.app-modal .grad-stavka:last-child {
  border-bottom: 0;
}
.app-modal .grad-stavka:hover,
.app-modal .grad-stavka[aria-selected="true"] {
  background: var(--us-surface2);
}
.app-modal .ob-slika-pomeri .ikon-dugme {
  width: 28px;
  height: 28px;
  background: var(--us-surface);
  box-shadow: var(--us-shadow-sm);
}
.app-modal .greska[data-vrsta="info"] > .ik {
  color: var(--us-accent);
}
.app-modal .nalog-uspeh {
  padding: 10px 12px;
  border-radius: var(--us-radius-sm);
  background: var(--us-ok-bg);
  color: var(--us-ok-fg);
  font-size: 13.5px;
}

/* ── .app-modal, iz app-prijava.css ── */
.app-modal .auth-zasto .ik {
  color: var(--us-accent);
  margin-top: 1px;
}
.app-modal .ili {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--us-fg-subtle);
  font-size: 12px;
}
.app-modal .ili::before,
.app-modal .ili::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--us-border);
}
.app-modal .oauth-koraci [data-stanje="gotovo"] .ik {
  color: var(--us-ok-fg);
}
.app-modal .oauth-koraci [data-stanje="sada"] .ik {
  color: var(--us-accent);
  animation: us-puls 1.2s ease-in-out infinite;
}
.app-modal .u-aplikaciji .dugme {
  margin-left: auto;
}
.app-modal .nalog-modal {
  width: min(460px, calc(100% - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  color: var(--us-fg);
}
.app-modal .nalog-modal::backdrop {
  background: var(--us-zatamnjenje);
  animation: us-bledi-ulaz 200ms var(--us-ease) both;
}
.app-modal .nalog-modal .nalog-zatvori {
  position: absolute;
  top: 12px;
  right: 12px;
}
.app-modal .nalog-kontekst {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 12px;
  margin-bottom: 16px;
  border-radius: var(--us-radius-md);
  background: var(--us-surface2);
}
.app-modal .nalog-kontekst b {
  display: block;
  font-size: 14px;
  font-weight: 600;
}
.app-modal .nalog-kontekst span {
  font-size: 13px;
  color: var(--us-fg-muted);
}
.app-modal .nalog-tabovi {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  margin-bottom: 16px;
  border-radius: var(--us-radius-pill, 999px);
  background: var(--us-surface2);
}
.app-modal .nalog-tabovi [role="tab"] {
  height: 36px;
  border: 0;
  border-radius: inherit;
  background: transparent;
  color: var(--us-fg-muted);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.app-modal .nalog-tabovi [role="tab"][aria-selected="true"] {
  background: var(--us-surface);
  color: var(--us-fg);
  box-shadow: var(--us-shadow-sm);
}
.app-modal .nalog-greska {
  padding: 10px 12px;
  margin-bottom: 12px;
  border-radius: var(--us-radius-sm);
  background: var(--us-err-bg);
  color: var(--us-err-fg);
  font-size: 13.5px;
}
.app-modal .nalog-modal [aria-invalid="true"] {
  border-color: var(--us-err-fg);
}
.app-modal .nalog-modal button[disabled] {
  opacity: .7;
  cursor: progress;
}
.app-modal .nalog-oauth {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}
@media (max-width: 559px) {
.app-modal .nalog-modal {
  width: 100%;
  max-width: none;
  max-height: none;
  height: 100dvh;
  margin: 0;
  border-radius: 0;
  border: 0;
}
}
@media (prefers-reduced-motion: reduce) {
.app-modal .nalog-modal,
.app-modal .nalog-modal::backdrop {
  animation: none;
}
}

@keyframes us-kartica-ulaz {
from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; }
}

@keyframes us-sjaj-disanje {
0%, 100% { opacity: .45; } 50% { opacity: 1; }
}

@keyframes us-munja {
0%, 10%, 100% { transform: scale(1) rotate(0); } 4% { transform: scale(1.28) rotate(-10deg); } 7% { transform: scale(.94) rotate(4deg); }
}

@keyframes us-munja-odmah {
0% { transform: scale(1); } 40% { transform: scale(1.3) rotate(-12deg); } 70% { transform: scale(.94) rotate(4deg); } 100% { transform: scale(1) rotate(0); }
}

@keyframes us-sjaj-prolaz {
0% { transform: translateX(-130%); } 15%, 100% { transform: translateX(130%); }
}

@keyframes us-oznaka-ulaz {
0% { opacity: 0; transform: scale(.4); } 60% { opacity: 1; transform: scale(1.15); } 100% { transform: scale(1); }
}

@keyframes us-srce {
0% { transform: scale(.6); } 55% { transform: scale(1.28); } 100% { transform: scale(1); }
}

@keyframes us-puls {
0%, 100% { opacity: 1; } 50% { opacity: .55; }
}

@keyframes us-bledi-ulaz {
from { opacity: 0; } to { opacity: 1; }
}

@keyframes us-modal-ulaz {
from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; }
}