:root {

  --primary:      #4f8ef7;
  --primary-h:    #7fb0ff;
  --primary-d:    #1a2e6b;
  --primary-rgb:  79,142,247;

  --accent:       #34d399;
  --accent-h:     #10b981;
  --accent-rgb:   52,211,153;

  --teal:         #22d3ee;
  --teal-h:       #67e8f9;
  --violet:       #a78bfa;
  --amber:        #fbbf24;

  --success:      #34d399;
  --warning:      #fbbf24;
  --danger:       #f87171;
  --info:         #60a5fa;

  --bg:           #0b1120;
  --bg-2:         #121b2d;
  --bg-3:         #182336;
  --card:         #152033;
  --card-2:       #1d2c45;
  --border:       #243551;
  --border-2:     #365176;

  --text:         #e2e8f0;
  --text-2:       #b2c0d4;
  --text-3:       #7c8faa;

  --shadow-sm:    0 1px 4px rgba(0,0,0,.4);
  --shadow:       0 4px 20px rgba(0,0,0,.5);
  --shadow-lg:    0 16px 48px rgba(0,0,0,.65);
  --glow-primary: 0 0 20px rgba(79,142,247,.25);
  --glow-accent:  0 0 20px rgba(52,211,153,.2);

  --r:            12px;
  --r-sm:         8px;
  --r-lg:         20px;
  --nav-h:        64px;

  --font:         Inter, ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-display: var(--font);
  --font-mono:    ui-monospace, 'Cascadia Code', Menlo, Monaco, Consolas, monospace;

  --t:            .18s cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after { box-sizing:border-box;margin:0;padding:0 }
html { scroll-behavior:smooth;-webkit-text-size-adjust:100% }
html,body { min-height:100% }
body {
  font-family:var(--font);
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg { display:block;max-width:100% }
a { color:inherit;text-decoration:none }
button { cursor:pointer;font-family:inherit;border:none;background:none }
input,textarea,select { font-family:inherit;font-size:inherit;color:inherit }
h1,h2,h3,h4 { line-height:1.2;color:var(--text) }
main { display:block }
summary { cursor:pointer }
summary::-webkit-details-marker { display:none }

.skip-link {
  position:fixed;left:1rem;top:0;z-index:1000;
  padding:.75rem 1rem;border-radius:var(--r-sm);
  background:var(--primary);color:#fff;font-weight:600;
  transform:translateY(-200%);opacity:0;
  transition:transform var(--t),opacity var(--t);
  pointer-events:none;
}
.skip-link:focus { transform:translateY(1rem);opacity:1;pointer-events:auto;outline:2px solid #fff;outline-offset:2px }

.nav {
  position:sticky;top:0;z-index:200;height:var(--nav-h);
  background:linear-gradient(180deg,rgba(11,17,32,.96),rgba(11,17,32,.9));
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  display:flex;align-items:center;
}
.nav-inner {
  max-width:1280px;width:100%;margin:0 auto;
  padding:0 1.5rem;display:flex;align-items:center;gap:1rem;
}

.nav-logo {
  display:flex;align-items:center;gap:.625rem;
  font-weight:800;font-size:1.15rem;
  color:var(--text);white-space:nowrap;
}
.nav-logo-mark { width:34px;height:34px;flex-shrink:0;border-radius:10px;box-shadow:0 10px 26px rgba(79,142,247,.18) }
.brand-lockup { display:flex;flex-direction:column;line-height:1.05 }
.brand-wordmark { font-size:1.02rem;font-weight:800;letter-spacing:-.02em;color:var(--text) }
.brand-wordmark span { color:var(--primary) }
.brand-kicker { font-size:.63rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3) }

.nav-links { display:flex;align-items:center;gap:.125rem;margin:0 auto }
.nav-link {
  padding:.45rem .875rem;border-radius:var(--r-sm);
  font-size:.875rem;font-weight:500;
  color:var(--text-2);transition:all var(--t);
  white-space:nowrap;
}
.nav-link:hover { color:var(--text);background:rgba(255,255,255,.06) }
.nav-link.active { color:var(--primary);background:rgba(79,142,247,.1) }

.nav-cta { display:flex;align-items:center;gap:.5rem;flex-shrink:0 }
#nav-auth { display:flex;align-items:center;gap:.5rem }

.nav-mobile-btn {
  display:none;width:36px;height:36px;align-items:center;justify-content:center;
  border-radius:var(--r-sm);background:rgba(255,255,255,.07);
  color:var(--text-2);margin-left:auto;
}
.mobile-menu {
  display:none;position:fixed;inset:0;z-index:300;
  background:var(--bg-2);flex-direction:column;
  padding:1.25rem 1.5rem;gap:.375rem;overflow-y:auto;
  border-right:1px solid var(--border);
}
.mobile-menu.open { display:flex }
.mobile-menu .nav-link { font-size:.9375rem;padding:.75rem 1rem;border-radius:var(--r-sm) }
#mobile-nav-auth { display:flex;flex-direction:column;gap:.625rem;margin-top:auto;padding-top:1rem;border-top:1px solid var(--border) }
.mobile-menu .btn { width:100%;justify-content:center }

@media(max-width:1240px) {
  .nav-links { display:none }
  .nav-cta { display:none }
  .nav-mobile-btn { display:flex!important }
}

.footer {
  background:#070d1a;
  border-top:1px solid var(--border);
  padding:3.5rem 0 2rem;
  color:var(--text-2);
}
.footer-grid {
  display:grid;
  grid-template-columns:minmax(260px,2fr) repeat(4,minmax(150px,1fr));
  gap:2rem;max-width:1280px;margin:0 auto;padding:0 1.5rem;
}
@media(max-width:1220px) { .footer-grid { grid-template-columns:minmax(260px,2fr) repeat(2,minmax(180px,1fr)); } .footer-grid>:first-child { grid-column:1/-1 } }
.footer-brand { display:flex;align-items:center;gap:.75rem;font-weight:800;font-size:1.1rem;color:var(--text);margin-bottom:.625rem }
.footer-desc { font-size:.82rem;line-height:1.7;color:var(--text-3) }
.footer-title {
  font-size:.68rem;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text-3);margin-bottom:.75rem;
}
.footer-ul { list-style:none;display:flex;flex-direction:column;gap:.5rem }
.footer-ul a { font-size:.82rem;color:var(--text-3);transition:color var(--t) }
.footer-ul a:hover { color:var(--primary) }
.footer-bottom {
  max-width:1280px;margin:2.5rem auto 0;
  padding:1.25rem 1.5rem 0;
  border-top:1px solid var(--border);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:.75rem;
  font-size:.75rem;color:var(--text-3);
}
.footer-meta-links {
  max-width:1280px;margin:.85rem auto 0;padding:0 1.5rem;
  display:flex;align-items:center;justify-content:center;gap:1rem 1.5rem;flex-wrap:wrap;
  font-size:.78rem;color:var(--text-3);
}
.footer-meta-links a { color:var(--text-3); transition:color var(--t) }
.footer-meta-links a:hover { color:var(--primary) }
@media(max-width:900px) { .footer-grid { grid-template-columns:1fr 1fr } .footer-grid>:first-child { grid-column:1/-1 } }
@media(max-width:580px) { .footer-grid { grid-template-columns:1fr } }

.container { max-width:1200px;margin:0 auto;padding:0 1.5rem }
.container-sm { max-width:760px;margin:0 auto;padding:0 1.5rem }
.section { padding:5rem 0 }
.section-sm { padding:3rem 0 }

.btn {
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.6rem 1.25rem;border-radius:var(--r-sm);
  font-weight:600;font-size:.875rem;
  transition:all var(--t);white-space:nowrap;cursor:pointer;border:none;
  text-align:center;
}
.btn-lg { padding:.875rem 1.875rem;font-size:1rem;border-radius:var(--r) }
.btn-sm { padding:.35rem .875rem;font-size:.8rem;border-radius:6px }

.btn-primary {
  background:var(--primary);color:#fff;
  box-shadow:0 2px 12px rgba(79,142,247,.3);
}
.btn-primary:hover {
  background:var(--primary-h);
  box-shadow:0 4px 20px rgba(79,142,247,.45);
  transform:translateY(-1px);
}
.btn-accent:hover { background:var(--accent-h);transform:translateY(-1px) }
.btn-outline {
  border:1px solid var(--border-2);color:var(--text);background:rgba(79,142,247,.04);
}
.btn-outline:hover { border-color:var(--primary);color:#fff;background:rgba(79,142,247,.14) }
.btn-ghost { color:var(--text-2);background:transparent }
.btn-ghost:hover { color:var(--text);background:rgba(255,255,255,.07) }
.btn-danger:hover { background:#ef4444 }
.btn:disabled { opacity:.45;cursor:not-allowed;transform:none!important;box-shadow:none!important }
.btn-full { width:100%;justify-content:center }
.btn-icon { width:2rem;height:2rem;padding:0;border-radius:999px;justify-content:center;flex-shrink:0 }

.card {
  background:linear-gradient(180deg,rgba(21,32,51,.96),rgba(18,27,45,.96));
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:1.5rem;
  box-shadow:0 10px 28px rgba(0,0,0,.16);
}
.card-lg { padding:2rem }
.card-hover { transition:transform var(--t),box-shadow var(--t),border-color var(--t) }
.card-hover:hover { transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--border-2) }

.badge {
  display:inline-flex;align-items:center;gap:.3rem;
  padding:.2rem .65rem;border-radius:20px;font-size:.73rem;font-weight:600;
  white-space:nowrap;
}
.badge-primary { background:rgba(79,142,247,.18);color:#bfdbfe;border:1px solid rgba(79,142,247,.34) }
.badge-accent { background:rgba(52,211,153,.16);color:#bbf7d0;border:1px solid rgba(52,211,153,.3) }
.badge-success { background:rgba(52,211,153,.16);color:#bbf7d0;border:1px solid rgba(52,211,153,.28) }
.badge-warning { background:rgba(251,191,36,.16);color:#fde68a;border:1px solid rgba(251,191,36,.28) }
.badge-danger { background:rgba(248,113,113,.16);color:#fecaca;border:1px solid rgba(248,113,113,.28) }
.badge-muted { background:rgba(148,163,184,.14);color:#dbe7f5;border:1px solid rgba(124,143,170,.28) }

.form-group { display:flex;flex-direction:column;gap:.4rem }
.form-label { font-size:.84rem;font-weight:600;color:var(--text) }
.form-hint { font-size:.77rem;color:var(--text-3) }
.form-error { font-size:.77rem;color:var(--danger) }
.input {
  width:100%;padding:.65rem .9rem;
  border:1.5px solid var(--border-2);
  border-radius:var(--r-sm);
  background:linear-gradient(180deg,rgba(24,35,54,.96),rgba(17,25,41,.96));
  color:var(--text);font-size:.9rem;
  transition:all var(--t);outline:none;
}
.input::placeholder { color:var(--text-3) }
.input:focus {
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(79,142,247,.15);
  background:var(--bg-3);
}
.input-lg { padding:.825rem 1.125rem;font-size:1rem }
textarea.input { resize:vertical;min-height:100px }
select.input {
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2360a5fa' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right .9rem center;
  padding-right:2.5rem;
}

.alert {
  padding:.875rem 1rem;border-radius:var(--r-sm);
  font-size:.875rem;display:flex;align-items:flex-start;gap:.625rem;
}
.alert-success { background:rgba(52,211,153,.12);border:1px solid rgba(52,211,153,.26);color:#bbf7d0 }
.alert-warning { background:rgba(251,191,36,.12);border:1px solid rgba(251,191,36,.26);color:#fde68a }
.alert-danger { background:rgba(248,113,113,.12);border:1px solid rgba(248,113,113,.26);color:#fecaca }
.alert-info { background:rgba(96,165,250,.12);border:1px solid rgba(96,165,250,.26);color:#bfdbfe }

.progress { height:5px;background:var(--bg-3);border-radius:20px;overflow:hidden }
.progress-bar { height:100%;background:var(--primary);border-radius:20px;transition:width .5s }

.spinner {
  width:20px;height:20px;
  border:2px solid var(--border-2);
  border-top-color:var(--primary);
  border-radius:50%;
  animation:spin .75s linear infinite;
  display:inline-block;flex-shrink:0;
}
.spinner-lg { width:40px;height:40px;border-width:3px }
@keyframes spin { to { transform:rotate(360deg) } }

.table-wrap { overflow-x:auto;border-radius:var(--r);border:1px solid var(--border);background:linear-gradient(180deg,rgba(21,32,51,.98),rgba(18,27,45,.98));box-shadow:0 8px 24px rgba(0,0,0,.14) }
table { width:100%;border-collapse:collapse;font-size:.875rem }
thead th {
  padding:.75rem 1rem;text-align:left;
  font-size:.71rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--text-3);background:var(--bg-3);
  border-bottom:1px solid var(--border);
}
tbody td { padding:.875rem 1rem;border-bottom:1px solid var(--border);vertical-align:middle }
tbody tr:last-child td { border-bottom:none }
tbody tr:hover td { background:rgba(255,255,255,.02) }

.panel-anchor-target { scroll-margin-top: 5.5rem; }
.panel-anchor-target:focus-visible { outline:2px solid var(--primary); outline-offset:4px; border-radius:14px; }
.panel-quick-nav {
  position: sticky; top: .75rem; z-index: 5;
  display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;
  padding:.8rem 1rem;margin-bottom:1rem;
  border:1px solid var(--border);border-radius:16px;
  background:rgba(11,17,32,.88);backdrop-filter:blur(10px);
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.panel-quick-nav-compact { top:.5rem;padding:.65rem .85rem }
.panel-quick-nav-title { font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-3) }
.panel-quick-nav-links { display:flex;gap:.45rem;row-gap:.45rem;flex-wrap:wrap }
.panel-quick-nav-link {
  border:1px solid var(--border);background:rgba(148,163,184,.08);color:var(--text);
  padding:.45rem .8rem;border-radius:999px;font-size:.82rem;font-weight:600;cursor:pointer;transition:all var(--t)
}
.panel-quick-nav-link:hover { border-color:var(--primary);color:var(--primary);background:rgba(79,142,247,.12) }
.panel-quick-nav-link.is-active,
.panel-quick-nav-link[aria-current="location"] { border-color:var(--primary); color:var(--primary); background:rgba(79,142,247,.18); box-shadow:0 0 0 1px rgba(79,142,247,.18) inset; }
@media (max-width: 768px) {
  .panel-quick-nav { position:static; padding:.7rem .85rem }
  .panel-quick-nav-title, .panel-quick-nav-links { width:100% }
}

.tabs { display:flex;gap:.25rem;border-bottom:1px solid var(--border);margin-bottom:1.5rem }
.tab {
  padding:.625rem 1rem;font-size:.875rem;font-weight:500;
  color:var(--text-3);border-bottom:2px solid transparent;
  margin-bottom:-1px;transition:all var(--t);cursor:pointer;
}
.tab:hover { color:var(--text) }
.tab.active { color:var(--primary);border-bottom-color:var(--primary);font-weight:600 }

.modal-overlay {
  position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:1000;
  display:flex;align-items:center;justify-content:center;
  padding:1rem;animation:fadeIn .15s ease;
}
.modal {
  background:var(--card-2);border:1px solid var(--border-2);
  border-radius:var(--r-lg);padding:2rem;
  width:100%;max-width:520px;max-height:90vh;
  overflow-y:auto;box-shadow:var(--shadow-lg);
  animation:slideUp .2s .05s both;
}
.modal-head { display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem }
.modal-title { font-size:1.15rem;font-weight:700;color:var(--text) }
.modal-close {
  width:30px;height:30px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--text-3);transition:all var(--t);cursor:pointer;
}
.modal-close:hover { background:var(--bg-3);color:var(--text) }
@keyframes fadeIn { from{opacity:0}to{opacity:1} }
@keyframes slideUp { from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none} }

.conf-bar { display:flex;align-items:center;gap:.5rem }
.conf-track { flex:1;height:5px;background:var(--bg-3);border-radius:20px;overflow:hidden }
.conf-fill { height:100%;border-radius:20px;transition:width .5s }
.conf-high { background:linear-gradient(90deg,#34d399,#6ee7b7) }
.conf-mid { background:linear-gradient(90deg,#fbbf24,#fcd34d) }
.conf-low { background:linear-gradient(90deg,#f87171,#fca5a5) }

#toasts { position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999;display:flex;flex-direction:column;gap:.5rem }
.toast {
  padding:.875rem 1.25rem;border-radius:var(--r);
  font-size:.875rem;font-weight:500;
  display:flex;align-items:center;gap:.625rem;
  box-shadow:var(--shadow-lg);animation:slideInRight .2s ease;
  min-width:240px;max-width:360px;
}
.toast-success { background:#064e3b;color:#34d399;border:1px solid rgba(52,211,153,.3) }
.toast-error { background:#4c1d1d;color:#f87171;border:1px solid rgba(248,113,113,.3) }
.toast-info { background:var(--primary-d);color:#93c5fd;border:1px solid rgba(79,142,247,.3) }
@keyframes slideInRight { from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none} }
@media(max-width:640px) { #toasts { left:1rem;right:1rem;bottom:1rem } .toast { min-width:0;max-width:none } }

.panel-wrap { display:flex;min-height:100vh;background:var(--bg) }
.sidebar {
  width:256px;background:var(--bg-2);
  border-right:1px solid var(--border);
  display:flex;flex-direction:column;
  position:fixed;top:0;left:0;height:100vh;
  overflow-y:auto;z-index:100;
  transition:transform var(--t);
}
.sidebar-head {
  padding:1.125rem 1rem;border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:.625rem;
}
.sidebar-brand { font-weight:800;font-size:.9rem;color:var(--text) }
.sidebar-nav { padding:.625rem .5rem;flex:1 }
.nav-sec {
  font-size:.65rem;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text-3);
  padding:.75rem .875rem .3rem;
}
.nav-item {
  display:flex;align-items:center;gap:.625rem;
  padding:.525rem .875rem;border-radius:var(--r-sm);
  font-size:.85rem;font-weight:500;color:var(--text-2);
  cursor:pointer;transition:all var(--t);
}
.nav-item:hover { background:rgba(255,255,255,.05);color:var(--text) }
.nav-item.active { background:rgba(79,142,247,.12);color:var(--primary);font-weight:600 }
.nav-item.is-locked { opacity:.55;cursor:default }
.nav-item.is-locked:hover { background:transparent;color:var(--text-2) }
.nav-item svg { opacity:.6;flex-shrink:0 }
.nav-item.active svg { opacity:1 }
.sidebar-foot { padding:.75rem .625rem;border-top:1px solid var(--border) }
.sidebar-user {
  display:flex;align-items:center;gap:.625rem;
  padding:.475rem .625rem;border-radius:var(--r-sm);cursor:pointer;
}
.sidebar-user:hover { background:rgba(255,255,255,.05) }
.panel-main { flex:1;margin-left:256px;display:flex;flex-direction:column;min-height:100vh }
.panel-topbar {
  height:60px;border-bottom:1px solid var(--border);
  display:flex;align-items:center;padding:0 1.5rem;gap:1rem;
  background:var(--bg-2);position:sticky;top:0;z-index:50;
}
.panel-content { flex:1;padding:1.5rem;overflow-y:auto }
.sidebar-overlay { display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:99 }
.sidebar-overlay.show { display:block }
.mob-toggle {
  display:none;width:36px;height:36px;align-items:center;justify-content:center;
  border-radius:var(--r-sm);background:rgba(255,255,255,.07);cursor:pointer;
}
@media(max-width:900px) {
  .sidebar { transform:translateX(-100%) }
  .sidebar.open { transform:none }
  .panel-main { margin-left:0 }
  .mob-toggle { display:flex!important }
}

.avatar {
  width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--teal));
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.875rem;flex-shrink:0;
}

.result-box { border:1px solid rgba(52,211,153,.28);border-radius:var(--r);overflow:hidden;background:linear-gradient(180deg,rgba(12,35,32,.92),rgba(15,29,38,.95));box-shadow:0 10px 28px rgba(0,0,0,.14) }
.result-head {
  padding:1.25rem 1.5rem;
  background:rgba(52,211,153,.05);
  border-bottom:1px solid rgba(52,211,153,.15);
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;
}
.result-body { padding:1.5rem }
.kpd-code { font-family:var(--font-mono);font-size:1.5rem;font-weight:700;color:var(--primary);letter-spacing:.04em }
.kpd-name { font-size:1rem;font-weight:600;margin-top:.25rem;color:var(--text) }
.result-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1rem;align-items:start }
.result-item label { font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3) }
.result-item p { font-size:.9rem;font-weight:500;margin-top:.2rem;word-break:break-word;color:var(--text) }
@media(max-width:600px) { .result-grid { grid-template-columns:1fr } }

.grid-1 { display:grid;grid-template-columns:1fr;gap:1.5rem }
.grid-2 { display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem }
.grid-3 { display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem }
.grid-4 { display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem }
@media(max-width:960px) { .grid-3,.grid-4 { grid-template-columns:repeat(2,1fr) } }
@media(max-width:680px) { .grid-2,.grid-3,.grid-4 { grid-template-columns:1fr } .result-grid { grid-template-columns:1fr } }

.flex { display:flex } .flex-col { flex-direction:column }
.items-center { align-items:center } .items-start { align-items:flex-start } .items-end { align-items:flex-end }
.justify-between { justify-content:space-between } .justify-center { justify-content:center }
.gap-1{gap:.25rem} .gap-2{gap:.5rem} .gap-3{gap:.75rem} .gap-4{gap:1rem} .gap-5{gap:1.25rem} .gap-6{gap:1.5rem}
.flex-wrap { flex-wrap:wrap }
.mt-1{margin-top:.25rem} .mt-2{margin-top:.5rem} .mt-3{margin-top:.75rem} .mt-4{margin-top:1rem}
.mt-5{margin-top:1.25rem} .mt-6{margin-top:1.5rem} .mt-8{margin-top:2rem}
.mb-1{margin-bottom:.25rem} .mb-2{margin-bottom:.5rem} .mb-3{margin-bottom:.75rem} .mb-4{margin-bottom:1rem}
.mb-5{margin-bottom:1.25rem} .mb-6{margin-bottom:1.5rem} .mb-8{margin-bottom:2rem} .mb-10{margin-bottom:2.5rem}
.ml-auto{margin-left:auto}
.p-3{padding:.75rem} .p-4{padding:1rem} .p-6{padding:1.5rem} .p-8{padding:2rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem} .py-2{padding-top:.5rem;padding-bottom:.5rem}
.text-sm{font-size:.875rem} .text-xs{font-size:.75rem} .text-lg{font-size:1.125rem}
.font-bold{font-weight:700} .font-semibold{font-weight:600} .font-medium{font-weight:500} .font-normal{font-weight:400}
.text-muted { color:var(--text-2) }
.text-light { color:#9db0c8 }
.text-primary{ color:var(--primary) }

.text-success{ color:var(--success) }
.text-danger { color:var(--danger) }
.text-warning{ color:var(--warning) }

.text-center { text-align:center } .text-right { text-align:right } .text-left { text-align:left }
.w-full{width:100%} .flex-1{flex:1} .flex-shrink-0{flex-shrink:0} .min-w-0{min-width:0}
.hidden{display:none!important} .block{display:block}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mono { font-family:var(--font-mono) }
.rounded{border-radius:var(--r-sm)} .rounded-lg{border-radius:var(--r)}
.relative{position:relative} .absolute{position:absolute}
.uppercase{text-transform:uppercase}
.border-b { border-bottom:1px solid var(--border) }

.fade-in { animation:fadeIn .3s ease }
.slide-up { animation:slideUp .3s ease }
.pulse-dot {
  display:inline-block;width:9px;height:9px;border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 0 rgba(52,211,153,.5);
  animation:pulse 2s infinite;
}
@keyframes pulse {
  0% { box-shadow:0 0 0 0 rgba(52,211,153,.5) }
  70% { box-shadow:0 0 0 10px rgba(52,211,153,0) }
  100% { box-shadow:0 0 0 0 rgba(52,211,153,0) }
}

.page-hero {
  padding:4rem 0 2.5rem;
  border-bottom:1px solid var(--border);
  text-align:center;
  background:radial-gradient(circle at top center,rgba(79,142,247,.12),transparent 45%), radial-gradient(circle at 15% 20%,rgba(52,211,153,.08),transparent 30%);
}
.page-hero p { max-width:720px;margin:.875rem auto 0 }
.page-hero h1 { font-size:clamp(1.875rem,4vw,2.75rem);font-weight:800;letter-spacing:-.025em }
.page-breadcrumb {
  display:flex;align-items:center;justify-content:center;
  gap:.5rem;font-size:.8rem;color:var(--text-3);margin-bottom:.875rem;
}
.page-breadcrumb a { color:var(--primary) }
.page-breadcrumb a:hover { text-decoration:underline }

.price-card {
  border:1px solid var(--border);border-radius:var(--r-lg);
  padding:1.75rem;background:var(--card);
  transition:all var(--t);display:flex;flex-direction:column;height:100%;
}
.price-card:hover { border-color:var(--border-2);box-shadow:var(--shadow) }
.price-card.popular {
  border-color:rgba(79,142,247,.4);
  background:rgba(79,142,247,.06);
  box-shadow:0 0 0 1px rgba(79,142,247,.2),var(--glow-primary);
}
.price-num { font-size:2.5rem;font-weight:800;line-height:1;color:var(--text) }
.price-num sup { font-size:1.1rem;vertical-align:top;margin-top:.4rem }
.price-num small { font-size:.9rem;font-weight:400;color:var(--text-3) }
.check-list li { display:flex;align-items:flex-start;gap:.5rem;font-size:.83rem;color:var(--text-2) }
.check-list li.no { color:var(--text-3) }
.price-toggle { display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:2.5rem }
.toggle-btn {
  padding:.45rem 1.125rem;border-radius:999px;font-size:.85rem;font-weight:600;
  cursor:pointer;transition:all var(--t);
  border:1px solid var(--border-2);color:var(--text-2);background:transparent;
}
.toggle-btn:hover { border-color:var(--primary);color:var(--primary) }
.toggle-btn.active { background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:var(--glow-primary) }

.article-content { overflow-wrap:anywhere;color:var(--text-2);line-height:1.8 }
.article-content h2 { font-size:1.4rem;margin:2rem 0 .875rem;font-weight:700;color:var(--text) }
.article-content h3 { font-size:1.125rem;margin:1.5rem 0 .75rem;font-weight:600;color:var(--text) }
.article-content p,.article-content ul,.article-content ol,.article-content blockquote { margin:0 0 1rem }
.article-content ul,.article-content ol { padding-left:1.25rem }
.article-content a { color:var(--primary) }
.article-content a:hover { text-decoration:underline }
.article-content code { background:var(--bg-3);padding:.15rem .4rem;border-radius:5px;font-family:var(--font-mono);font-size:.85em;color:var(--accent) }
.article-content pre { overflow:auto;padding:1rem;border-radius:var(--r-sm);background:var(--bg-3);border:1px solid var(--border) }
.article-content blockquote { padding-left:1rem;border-left:3px solid var(--primary);color:var(--text-3) }
.article-content table { width:100%;border-collapse:collapse;max-width:100%;display:block;overflow-x:auto }
.article-content th,.article-content td { padding:.6rem .8rem;border:1px solid var(--border);text-align:left }
.article-content hr { border:0;border-top:1px solid var(--border);margin:1.5rem 0 }

::-webkit-scrollbar { width:5px;height:5px }
::-webkit-scrollbar-track { background:transparent }
::-webkit-scrollbar-thumb { background:var(--border-2);border-radius:3px }

.empty { text-align:center;padding:3rem 1rem }
.empty-icon { font-size:2.5rem;margin-bottom:.75rem }
.empty h3 { font-size:1.05rem;font-weight:600;margin-bottom:.5rem;color:var(--text) }
.empty p { font-size:.875rem;color:var(--text-2) }

.auth-wrap {
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:2.5rem 1.5rem;background:var(--bg);
}
.auth-card {
  width:100%;max-width:460px;
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:2.5rem;
  box-shadow:var(--shadow-lg);
}
@media(max-width:520px) { .auth-card { padding:1.75rem } }
@media(max-width:375px) { .auth-card { padding:1.5rem } }

.classify-box {
  background:linear-gradient(180deg,rgba(21,32,51,.98),rgba(18,27,45,.96));
  border:1px solid rgba(127,176,255,.22);
  border-radius:24px;
  padding:2rem;
  box-shadow:var(--shadow-lg), 0 0 60px rgba(79,142,247,.08), 0 0 0 1px rgba(52,211,153,.08) inset;
  max-width:880px;
  margin:0 auto;
  position:relative;
  overflow:hidden;
}
.classify-box::before {
  content:'';
  position:absolute;inset:0;
  background:radial-gradient(circle at top right,rgba(79,142,247,.2),transparent 32%), radial-gradient(circle at bottom left,rgba(52,211,153,.12),transparent 28%);
  pointer-events:none;
}

@media(max-width:960px) { .nav-inner { padding:0 1rem } }
@media(max-width:580px) {
  .page-hero { padding:3rem 0 2rem }
  .btn-lg { width:100%;justify-content:center }
  .section { padding:3.5rem 0 }
}

.public-section-head { text-align:center; max-width:760px; margin:0 auto 2rem }
.public-section-head p { margin:.75rem auto 0; color:var(--text-2) }
@media(max-width:580px) { .brand-kicker { display:none } .nav-logo-mark { width:32px;height:32px } }

[data-example] { transition:all .15s }
[data-example]:hover { border-color:var(--primary)!important;color:var(--primary)!important }

.btn, .nav-item, .nav-link, .tab, a[href], button, select, input, [data-example] { touch-action:manipulation }

.classify-box button, .classify-box input, .classify-box select,
.btn, .nav-item, .nav-link, .tab, .toggle-btn, a[onclick] {
  touch-action:manipulation;
}

.table-wrap {
  background:
    linear-gradient(to right, rgba(21,32,51,.98) 30%, transparent) left center,
    linear-gradient(to left, rgba(18,27,45,.98) 30%, transparent) right center,
    linear-gradient(to right, rgba(255,255,255,.08), transparent 15px) left center,
    linear-gradient(to left, rgba(255,255,255,.08), transparent 15px) right center;
  background-size: 40px 100%, 40px 100%, 15px 100%, 15px 100%;
  background-repeat: no-repeat;
  background-attachment: local, local, scroll, scroll;
}

.cookie-banner {
  position:fixed;bottom:0;left:0;right:0;z-index:9990;
  background:rgba(18,27,45,.97);
  border-top:1px solid var(--border);
  backdrop-filter:blur(12px);
  padding:1rem 1.5rem;
  display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;
  animation:slideUpBanner .3s ease;
  box-shadow:0 -4px 20px rgba(0,0,0,.4);
}
.cookie-banner p { font-size:.84rem;color:var(--text-2);max-width:600px;text-align:center }
.cookie-banner a { color:var(--primary) }
@keyframes slideUpBanner { from{transform:translateY(100%)}to{transform:none} }

.footer-powered {
  text-align:center;padding:.75rem 0;
  font-size:.72rem;color:var(--text-3);
  border-top:1px solid rgba(36,53,81,.5);
  margin-top:1rem;
}
.footer-powered a { color:var(--primary);font-weight:600 }
.footer-powered a:hover { text-decoration:underline }

.stat-item { text-align:center;padding:.5rem 0 }
.stat-num { font-size:2rem;font-weight:800;line-height:1;color:var(--primary) }
.stat-label { font-size:.8rem;color:var(--text-3);margin-top:.3rem }

.feature-row {
  display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;
  padding:3rem 0;border-bottom:1px solid var(--border);
}
.feature-row:last-child { border-bottom:none }
.feature-row.reverse .feature-text { order:2 }
.feature-row.reverse .feature-visual { order:1 }
@media(max-width:768px) {
  .feature-row { grid-template-columns:1fr;gap:1.5rem }
  .feature-row.reverse .feature-text, .feature-row.reverse .feature-visual { order:unset }
}

.page-breadcrumb { flex-wrap:wrap }
.examples-result-col { position:sticky; top:76px }
.js-example-trigger { width:100% }
@media(max-width:900px) {
  .panel-content { padding:1rem }
  .panel-topbar { padding:0 1rem }
}
@media(max-width:680px) {
  .examples-result-col { position:static; top:auto }
  .btn.btn-lg { width:100%; justify-content:center }
}
@media(max-width:480px) {
  .btn { min-height:44px }
  .panel-content { padding:.875rem }
  .card, .card-lg, .classify-box { padding:1rem }
}

@media(max-width:768px) {
  .page-hero h1 { font-size:1.75rem }
  .table-wrap th, .table-wrap td { padding:.5rem .4rem }
}
@media(max-width:480px) {
  .page-hero h1 { font-size:1.5rem }
  .feature-text h3 { font-size:1rem }
  .feature-visual { max-width:100% }
}

.btn:active { transform:scale(0.98) }
.btn:disabled { cursor:not-allowed;opacity:.45;transform:none }
.input, select.input, textarea.input { -webkit-appearance:none;appearance:none }
button, [role="button"], .btn, a.btn { touch-action:manipulation }
.sidebar .nav-item:hover { background:rgba(255,255,255,.06) }
details summary { cursor:pointer;user-select:none }
details summary::-webkit-details-marker { display:none }

.panel-content .form-group { margin-bottom:1rem }
.panel-content .form-label { display:block;margin-bottom:.35rem;font-size:.82rem;font-weight:600;color:var(--text) }
.panel-content .form-hint { font-size:.75rem;color:var(--text-3);margin-top:.25rem }
.panel-content .input { width:100%;box-sizing:border-box }
.panel-content select.input { width:100%;box-sizing:border-box;cursor:pointer }
.panel-content textarea.input { resize:vertical;min-height:80px }

.sidebar .nav-item, .sidebar a.nav-item { display:flex;align-items:center;gap:.625rem;padding:.5rem .75rem;border-radius:var(--r-sm);color:var(--text-2);font-size:.85rem;text-decoration:none;transition:all .15s;cursor:pointer }
.sidebar .nav-item:hover, .sidebar a.nav-item:hover { background:rgba(255,255,255,.06);color:var(--text) }
.sidebar .nav-item.active, .sidebar a.nav-item.active { background:var(--primary);color:#fff }

@keyframes slideIn { from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none} }

.scroll-top {
  position:fixed;bottom:2rem;right:2rem;z-index:999;
  width:44px;height:44px;border-radius:50%;
  background:var(--primary);color:#fff;border:none;
  display:none;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,.3);
  transition:opacity .2s,transform .2s;
}
.scroll-top:hover { transform:scale(1.1) }
.scroll-top.show { display:flex }

#ac-dropdown .ac-item:hover, #ac-dropdown .ac-item:focus {
  background:rgba(79,142,247,.1) !important;outline:none
}

.skeleton {
  background:linear-gradient(90deg,var(--bg-2) 25%,rgba(255,255,255,.05) 50%,var(--bg-2) 75%);
  background-size:200% 100%;animation:skeletonPulse 1.5s ease-in-out infinite;
  border-radius:var(--r-sm);
}
.skeleton-text { height:.875rem;margin-bottom:.5rem }
.skeleton-title { height:1.5rem;margin-bottom:.75rem;width:60% }
.skeleton-card { height:120px;margin-bottom:1rem }
@keyframes skeletonPulse { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(.85)} }

@media print {
  .nav, .footer, .cookie-banner, .scroll-top, #toasts, .mobile-menu,
  .sidebar, .panel-topbar, .btn, button, .nav-cta { display:none !important }
  body { background:#fff !important;color:#000 !important }
  .card, .classify-box { border:1px solid #ccc !important;box-shadow:none !important }
  a { color:#000 !important;text-decoration:underline }
}

[title] { position:relative }

.table-wrap table { width:100%;border-collapse:collapse }
.table-wrap th { text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-3);padding:.6rem .5rem;border-bottom:2px solid var(--border) }
.table-wrap td { padding:.6rem .5rem;border-bottom:1px solid var(--border);vertical-align:middle }
.table-wrap tr:hover { background:rgba(255,255,255,.02) }

html { scroll-behavior:smooth }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto } }

:focus-visible { outline:2px solid var(--primary);outline-offset:2px;border-radius:var(--r-sm) }
button:focus:not(:focus-visible), a:focus:not(:focus-visible) { outline:none }

::selection { background:rgba(79,142,247,.3);color:#fff }

details[open] summary > span:last-child { transform:rotate(45deg) }
details summary > span:last-child { transition:transform .2s ease }


.sr-only {
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after {
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
  }
  .scroll-top { transition:none }
  .spinner, .spinner-lg { animation:none }
}

.ml-1 { margin-left:.25rem } .ml-2 { margin-left:.5rem } .ml-3 { margin-left:.75rem }
.mr-1 { margin-right:.25rem } .mr-2 { margin-right:.5rem }
.pt-3 { padding-top:.75rem } .pb-3 { padding-bottom:.75rem }
.py-2 { padding-top:.5rem;padding-bottom:.5rem }
.py-6 { padding-top:1.5rem;padding-bottom:1.5rem }
.px-3 { padding-left:.75rem;padding-right:.75rem }
.text-left { text-align:left }
.text-right { text-align:right }
.text-lg { font-size:1.125rem }
.min-w-0 { min-width:0 }
.flex-shrink-0 { flex-shrink:0 }
.overflow-hidden { overflow:hidden }
.whitespace-nowrap { white-space:nowrap }

[hidden] { display:none !important; }
body.mobile-menu-open { overflow:hidden; }
.btn-busy-content { display:inline-flex; align-items:center; gap:.5rem; }
.loading-stack { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.75rem; padding:1.25rem; text-align:center; }
.kbd-help-overlay { position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; padding:1rem; background:rgba(0,0,0,.6); }
.kbd-help-card { width:min(100%, 400px); }
.kbd-help-list { display:flex; flex-direction:column; gap:.5rem; font-size:.88rem; }
.kbd-shortcut { display:inline-flex; align-items:center; justify-content:center; min-width:2.25rem; padding:2px 8px; border-radius:4px; border:1px solid var(--border); background:var(--bg-2); font-family:var(--font-mono); font-size:.78rem; }

.panel-shell-error { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:2rem; }
.panel-shell-error-card { max-width:420px; }
.panel-shell-error-icon { font-size:2rem; margin-bottom:1rem; }
.panel-shell-error-title { font-weight:700; margin-bottom:.5rem; }
.panel-shell-error-actions { margin-top:.25rem; }
.panel-sidebar-action { width:100%; text-align:left; background:none; border:0; }
.panel-sidebar-link { display:flex; width:100%; }
.panel-sidebar-heading { color:var(--text); }
.panel-sidebar-user-name { font-size:.85rem; font-weight:600; }
.panel-sidebar-badge { font-size:.65rem; }
.panel-avatar-sm { width:28px; height:28px; font-size:.75rem; }
.panel-avatar-md { width:30px; height:30px; font-size:.8rem; }
.panel-avatar-action { cursor:pointer; border:0; background:none; }
.panel-usage-card { padding:.4rem .75rem .75rem; font-size:.75rem; }
.panel-usage-card.is-unlimited { color:var(--success); }
.panel-usage-card:not(.is-unlimited) { color:var(--text-2); }
.panel-usage-summary { display:flex; justify-content:space-between; margin-bottom:.25rem; }
.panel-topbar-title { font-weight:700; font-size:1rem; flex:1; color:var(--text); }
.panel-topbar-meta { display:flex; align-items:center; gap:.75rem; }
.password-strength { display:flex; align-items:center; gap:.5rem; margin-top:.35rem; }
.password-strength-track { flex:1; height:4px; background:var(--border); border-radius:4px; overflow:hidden; }
.password-strength-fill { height:100%; border-radius:4px; transition:width .3s, background .3s; }
.password-strength-label { min-width:80px; text-align:right; font-size:.75rem; }

.mobile-menu {
  width:min(100vw, 420px);
  left:auto;
  right:0;
  box-shadow:-20px 0 60px rgba(0,0,0,.35);
}
.mobile-menu.open { display:flex }
body.mobile-menu-open { overflow:hidden }
body.mobile-menu-open::before {
  content:'';
  position:fixed;
  inset:0;
  background:rgba(2,6,23,.55);
  z-index:299;
}
.nav { position:sticky; top:0; z-index:250; backdrop-filter:blur(14px) }
.nav-mobile-btn { position:relative; z-index:251; min-width:40px; min-height:40px }
.mobile-nav-primary { color:var(--primary)!important; font-weight:700 }
.footer-social-link:hover { color:var(--primary)!important }

.status-overview-card {
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(260px,.9fr);
  gap:1.25rem;
  align-items:stretch;
}
.status-overview-copy,
.status-overview-meta {
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  padding:1.5rem;
}
.status-overview-meta {
  display:grid;
  gap:1rem;
}
.status-meta-card {
  display:flex;
  flex-direction:column;
  gap:.35rem;
}
.status-meta-card strong { font-size:1.1rem; color:var(--text) }
.status-pill {
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  border-radius:999px;
  padding:.45rem .85rem;
  font-size:.8rem;
  font-weight:700;
}
.status-pill.is-ok { background:rgba(16,185,129,.12); color:var(--success); border:1px solid rgba(16,185,129,.18) }
.status-pill.is-issue { background:rgba(248,113,113,.12); color:var(--danger); border:1px solid rgba(248,113,113,.18) }
.status-service-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}
.status-service-card {
  display:flex;
  align-items:flex-start;
  gap:1rem;
  min-height:132px;
}
.status-service-icon {
  width:48px;
  height:48px;
  border-radius:14px;
  background:rgba(79,142,247,.1);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.25rem;
  flex-shrink:0;
}
@media(max-width:900px){
  .status-overview-card,
  .status-service-grid { grid-template-columns:1fr }
}
@media(max-width:680px){
  .mobile-menu { width:100vw; padding:1rem 1rem 1.25rem }
  .status-overview-copy,
  .status-overview-meta,
  .status-service-card { padding:1rem }
}

body.public-site {
  line-height: 1.72;
}
body.public-site main {
  isolation: isolate;
}
body.public-site .container {
  max-width: 1240px;
}
body.public-site .container-sm {
  max-width: 860px;
}
body.public-site .section {
  padding: 5.5rem 0;
}
body.public-site .section-sm {
  padding: 3.5rem 0;
}
body.public-site .page-hero {
  padding: 4.75rem 0 3rem;
}
body.public-site .page-hero .container {
  max-width: 920px;
}
body.public-site .page-hero p {
  font-size: 1.02rem;
  line-height: 1.8;
  color: var(--text-2);
}
body.public-site h1,
body.public-site h2,
body.public-site h3 {
  letter-spacing: -.02em;
}
body.public-site .card {
  border-radius: 18px;
  padding: 1.75rem;
}
body.public-site .card-lg {
  padding: 2.25rem;
}
body.public-site .grid-2,
body.public-site .grid-3,
body.public-site .grid-4 {
  align-items: start;
}
body.public-site .grid-2 > *,
body.public-site .grid-3 > *,
body.public-site .grid-4 > *,
body.public-site .feature-row > *,
body.public-site .public-contact-layout > *,
body.public-site .public-examples-layout > *,
body.public-site .status-overview-card > *,
body.public-site .status-service-grid > *,
body.public-site .public-card-grid > * {
  min-width: 0;
}
body.public-site :is(section[id], h2[id], h3[id], .card[id]) {
  scroll-margin-top: 110px;
}
body.public-site .grid-2 { gap: 2rem; }
body.public-site .grid-3,
body.public-site .grid-4 { gap: 1.5rem; }
body.public-site .feature-row {
  gap: 3.5rem;
  align-items: start;
  padding: 3.25rem 0;
}
body.public-site .feature-text p,
body.public-site .text-muted {
  line-height: 1.8;
}
body.public-site .table-wrap {
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow: auto;
  padding: .3rem .5rem;
}
body.public-site .table-wrap table {
  width: max(100%, 640px);
  min-width: 640px;
}
body.public-site .table-wrap :is(th, td, code) {
  overflow-wrap: anywhere;
  word-break: break-word;
}
body.public-site .table-wrap th {
  padding: .95rem .8rem;
}
body.public-site .table-wrap td {
  padding: .9rem .8rem;
  color: var(--text-2);
}
body.public-site details {
  border: 1px solid rgba(54,81,118,.72);
  border-radius: 14px;
  background: rgba(21,32,51,.72);
  padding: 1rem 1.1rem;
}
body.public-site details + details {
  margin-top: .9rem;
}
body.public-site details summary {
  font-weight: 700;
}
body.public-site details p {
  margin-top: .85rem;
  color: var(--text-2);
  line-height: 1.8;
}
body.public-site .public-card-grid {
  display: grid;
  gap: 1.25rem;
}
body.public-site .public-card-grid-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
body.public-site .public-card-grid-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
body.public-site .pricing-grid .price-card {
  min-height: 100%;
}
body.public-site .pricing-grid .price-card ul {
  margin-top: .35rem;
}
body.public-site .pricing-grid .price-card li {
  line-height: 1.55;
}
body.public-site .public-code-block {
  background: linear-gradient(180deg, rgba(8,13,24,.96), rgba(12,18,31,.96));
  border: 1px solid rgba(54,81,118,.7);
  border-radius: 14px;
  padding: 1.1rem 1.15rem;
  font-family: var(--font-mono);
  font-size: .82rem;
  max-width: 100%;
  overflow: auto;
  line-height: 1.75;
}
body.public-site .public-code-block-sm {
  font-size: .78rem;
}
body.public-site .public-contact-layout {
  gap: 1.5rem;
}
body.public-site .public-form-card {
  box-shadow: var(--shadow-lg);
}
body.public-site .public-examples-layout {
  gap: 2rem;
}
body.public-site .public-sticky-panel {
  position: sticky;
  top: 88px;
}
body.public-site .public-search-shell .input {
  min-height: 52px;
}
body.public-site .public-scroll-table {
  background: rgba(10,15,26,.4);
}
body.public-site .public-blog-feature {
  justify-content: space-between;
}
body.public-site .blog-card-grid article {
  min-height: 100%;
}
body.public-site .legal-copy {
  padding: 2.25rem;
}
body.public-site .legal-copy h2 {
  margin-top: 1.5rem;
}
body.public-site .legal-copy h2:first-child {
  margin-top: 0;
}
body.public-site .legal-copy p,
body.public-site .legal-copy li {
  color: var(--text-2);
  line-height: 1.85;
}
body.public-site .public-about-shell > .card + .card {
  margin-top: 1.5rem;
}
body.public-site .public-note-card {
  box-shadow: 0 12px 30px rgba(0,0,0,.16);
}
body.public-site.page-home .section > .container > .text-center,
body.public-site.page-home .public-section-head {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}
body.public-site.page-home .classify-box {
  max-width: 960px;
}
body.public-site.page-home .feature-visual .card,
body.public-site.page-how-it-works .feature-visual .card,
body.public-site.page-contact .feature-visual .card,
body.public-site.page-codebook .feature-visual .card,
body.public-site.page-packages .feature-visual .card {
  border-radius: 18px;
}
body.public-site.page-blog .page-hero .container,
body.public-site.page-packages .page-hero .container,
body.public-site.page-contact .page-hero .container,
body.public-site.page-api-docs .page-hero .container,
body.public-site.page-codebook .page-hero .container,
body.public-site.page-examples .page-hero .container,
body.public-site.page-how-it-works .page-hero .container,
body.public-site.page-status .page-hero .container,
body.public-site.page-about .page-hero .container,
body.public-site.page-legal .page-hero .container {
  max-width: 860px;
}
@media (max-width: 1100px) {
  body.public-site .public-card-grid-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.public-site .public-card-grid-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 900px) {
  body.public-site .section {
    padding: 4.5rem 0;
  }
  body.public-site .page-hero {
    padding: 4rem 0 2.6rem;
  }
  body.public-site .feature-row {
    gap: 2rem;
    padding: 2.35rem 0;
  }
  body.public-site .public-sticky-panel {
    position: static;
    top: auto;
  }
}
@media (max-width: 680px) {
  body.public-site .container,
  body.public-site .container-sm {
    padding: 0 1rem;
  }
  body.public-site .section {
    padding: 3.6rem 0;
  }
  body.public-site .page-hero {
    padding: 3.35rem 0 2.25rem;
  }
  body.public-site .card,
  body.public-site .card-lg,
  body.public-site .legal-copy {
    padding: 1.2rem;
  }
  body.public-site .grid-2,
  body.public-site .grid-3,
  body.public-site .grid-4,
  body.public-site .public-card-grid-3,
  body.public-site .public-card-grid-4 {
    grid-template-columns: 1fr;
  }
  body.public-site .table-wrap {
    padding: .2rem .3rem;
  }
  body.public-site .page-hero p {
    font-size: .97rem;
  }
}

.auth-divider{display:flex;align-items:center;gap:.85rem;margin:1.1rem 0 .9rem;color:var(--text-2);font-size:.82rem}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--border)}
.auth-divider span{white-space:nowrap}
#google-auth-wrap{display:flex;justify-content:center;margin-bottom:.5rem}
#google-auth-btn>div{margin:0 auto}

.spinner-sm { width:16px;height:16px }
.btn-inline-status { display:inline-flex;align-items:center;gap:.5rem }
.visually-hidden-trap {
  position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;
}
.text-link-primary { color:var(--primary);font-weight:600 }
.text-link-inline { color:var(--primary) }
.auth-brand-title { font-weight:800;font-size:1.3rem;color:var(--text) }
.auth-title { font-size:1.4rem;font-weight:700;text-align:center;margin-bottom:.3rem }
.auth-legal-copy a,
.auth-muted-link,
.auth-secondary-link { color:var(--primary) }
.auth-secondary-link { font-weight:600 }
.auth-warning-text { font-size:.82rem }
.password-field { position:relative }
.password-field .input { padding-right:2.75rem }
.password-toggle {
  position:absolute;right:.75rem;top:50%;transform:translateY(-50%);
  background:none;border:none;cursor:pointer;color:var(--text-2);
  display:flex;align-items:center;padding:0;
}
.password-label-row { display:flex;justify-content:space-between;align-items:center }
.password-help-link { font-weight:400;font-size:.78rem;color:var(--primary) }
.pwd-strength { margin-bottom:1.25rem }
.pwd-strength-row { display:flex;align-items:center;gap:.5rem;margin-top:.35rem }
.pwd-strength-track { flex:1;height:4px;background:var(--border);border-radius:4px;overflow:hidden }
.pwd-strength-value { height:100%;transition:width .3s,background .3s;border-radius:4px }
.pwd-strength-label { font-size:.75rem;min-width:80px;text-align:right }
.contact-success-alert { padding:1.5rem;text-align:center;font-size:1rem }
.page-card-centered { max-width:600px;margin:3rem auto }
.page-card-narrow { max-width:400px;margin:0 auto 1.5rem }
.popular-links { line-height:1.6 }
.popular-links strong { color:var(--text) }
.quick-results-list { display:grid;gap:.35rem }
.quick-result-row { display:flex;gap:.5rem;align-items:center;padding:.35rem 0;border-bottom:1px solid var(--border) }
.quick-result-row:last-child { border-bottom:0 }
.quick-search-link { color:var(--primary) }
.sifrarnik-results-meta { margin-bottom:1rem }
.sifrarnik-results-scroll { max-height:600px;overflow-y:auto }
.sifrarnik-cta-card { background:rgba(79,142,247,.04);border-color:rgba(79,142,247,.15) }
.footer-socials-empty { margin-top:1rem }
.footer-socials-empty p { margin:0;color:var(--text-3);font-size:.78rem }

.stats-strip { background:var(--bg-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:1.75rem 0 }
.mobile-menu-close { width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:var(--text-2);border:0;cursor:pointer }
.footer-socials { display:flex;gap:.75rem;flex-wrap:wrap;align-items:center;margin-top:1rem }
.footer-social-link,
.footer-social-link:hover, .footer-social-link:focus-visible { color:var(--primary)!important }
.footer-social-link.is-disabled { opacity:.55; cursor:default; pointer-events:none }
.footer-social-link { display:inline-flex; align-items:center; justify-content:center; width:2.25rem; height:2.25rem; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.03) }
.footer-social-glyph { font-size:.72rem; font-weight:800; text-transform:lowercase; letter-spacing:.02em }

.nav-link[aria-current="page"] { color:var(--text);font-weight:700 }
.cookie-banner[hidden] { display:none !important }
.ac-dropdown {
  position:absolute;
  left:0;
  right:0;
  top:100%;
  z-index:100;
  max-height:280px;
  overflow-y:auto;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:0 0 var(--r-sm) var(--r-sm);
  box-shadow:var(--shadow-lg);
}
.ac-item {
  width:100%;
  display:flex;
  gap:.75rem;
  align-items:center;
  padding:.5rem .75rem;
  border:0;
  border-bottom:1px solid var(--border);
  background:transparent;
  cursor:pointer;
  font-size:.84rem;
  text-align:left;
  transition:background .12s ease;
}
.ac-item:last-child { border-bottom:0; }
.ac-item:hover,
.ac-item:focus-visible { background:rgba(79,142,247,.08); outline:none; }

.admin-settings-panel .form-hint { display:block; }

.admin-settings-card-copy { margin:-.35rem 0 1rem; max-width:70ch; }
.admin-settings-quick-nav { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1rem; }
.admin-settings-status { min-height:1.25rem; }
.admin-settings-is-dirty { box-shadow:0 0 0 1px rgba(245,158,11,.35), 0 0 0 4px rgba(245,158,11,.08); }
.user-settings-actions .btn[disabled],
#sp-pass-btn[disabled],
#sp-save-btn[disabled],
[data-action="add-team-member"][disabled] { opacity:.65; cursor:not-allowed; }
.admin-settings-toolbar { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:1rem 1.15rem; margin:0 0 1rem; border:1px solid rgba(79,142,247,.18); border-radius:16px; background:rgba(11,17,32,.55); }
.admin-settings-subsection { padding:1rem 0 0; border-top:1px solid rgba(79,142,247,.12); }
.admin-settings-subsection:first-child { padding-top:0; border-top:0; }
.admin-settings-subsection-head { margin-bottom:.85rem; }
.admin-settings-subsection-title { margin:0 0 .2rem; font-size:1rem; font-weight:800; }
.admin-settings-subsection-copy { margin-bottom:0; }
.admin-settings-panel { width:100%; max-width:1240px; }
.admin-settings-panel .card { padding:1.35rem 1.4rem; overflow:hidden; }
.admin-settings-panel .form-group,
.admin-settings-panel .admin-settings-switch-row,
.admin-settings-panel .admin-settings-payment-grid { min-width:0; }
.admin-settings-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); align-items:start; }
.admin-settings-field-wide { grid-column:1 / -1; }
.admin-settings-switch-stack { display:grid; gap:.9rem; }
.admin-settings-switch-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:1rem; padding:1rem 1.1rem; border:1px solid rgba(79,142,247,.18); border-radius:16px; background:linear-gradient(180deg,rgba(17,25,41,.92),rgba(12,19,33,.96)); min-height:92px; }
.admin-settings-switch-copy { min-width:0; }
.admin-settings-switch-title { display:block; font-weight:700; color:var(--text); cursor:pointer; margin-bottom:.35rem; }
.admin-settings-switch-hint { margin-top:0; }
.admin-settings-switch { position:relative; display:inline-flex; flex:0 0 56px; width:56px!important; min-width:56px!important; max-width:56px!important; align-items:center; justify-content:center; justify-self:end; cursor:pointer; }
.admin-settings-checkbox-native { position:absolute; opacity:0; pointer-events:none; }
.admin-settings-switch-ui { position:relative; display:inline-block; width:56px!important; min-width:56px!important; max-width:56px!important; height:32px; border-radius:999px; background:rgba(77,94,125,.55); border:1px solid rgba(96,165,250,.28); box-shadow:inset 0 1px 1px rgba(255,255,255,.05); transition:background .16s ease,border-color .16s ease; }
.admin-settings-switch-ui::after { content:''; position:absolute; top:3px; left:3px; width:24px; height:24px; border-radius:50%; background:#fff; box-shadow:0 4px 10px rgba(0,0,0,.25); transition:transform .16s ease; }
.admin-settings-toggle:checked + .admin-settings-switch-ui { background:linear-gradient(135deg,var(--primary),#2563eb); border-color:rgba(96,165,250,.9); }
.admin-settings-toggle:checked + .admin-settings-switch-ui::after { transform:translateX(24px); }
.admin-settings-toggle:focus-visible + .admin-settings-switch-ui { outline:2px solid rgba(96,165,250,.75); outline-offset:3px; }
.admin-settings-action-row { margin-top:1rem; display:flex; justify-content:flex-end; }
.admin-settings-auto-grid { grid-template-columns:minmax(360px,1.05fr) minmax(300px,.95fr); align-items:start; }
.admin-settings-billing-grid { grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
.admin-settings-payment-grid,
.user-billing-methods-grid { grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
@media (max-width: 900px) {
  .admin-settings-auto-grid { grid-template-columns:1fr; }
  .admin-settings-switch-row { padding:.9rem 1rem; }
  .admin-settings-toolbar { flex-direction:column; align-items:flex-start; }
}

@media (max-width: 640px) {
  .admin-settings-grid { grid-template-columns:1fr; }
  .admin-settings-switch-row { grid-template-columns:1fr; align-items:start; }
  .admin-settings-switch { justify-self:start; }
}

.user-billing-active-card { background:rgba(26,46,107,.04); border-color:var(--primary); }
.user-billing-plan-badge { font-size:.9rem; padding:.35rem .75rem; }
.user-billing-limit-value { font-size:1.15rem; }
.user-billing-plan-spacer { height:26px; }
.user-billing-plan-features { flex:1; }
.user-billing-active-button { opacity:.5; cursor:default; }
.user-billing-history-row,
.user-billing-transaction-row { padding:.75rem 0; border-bottom:1px solid var(--border); }
.user-billing-history-row { padding:.65rem 0; }
.user-billing-provider-card { min-height:unset; }
.admin-invoice-filter-action { align-self:end; }

.panel-title-xl { font-size:1.75rem; font-weight:800; }
.panel-card-title { font-weight:700; margin-bottom:1rem; }
.panel-metric-value { font-size:1.7rem; font-weight:800; margin:.35rem 0; }
.panel-rank-row, .panel-simple-row { padding:.55rem 0; border-bottom:1px solid var(--border); }
.panel-health-card { padding:1.25rem 1.5rem; }
.panel-health-dot { width:12px; height:12px; }
.panel-health-title { font-size:1rem; }
.panel-code-inline { background:rgba(0,0,0,.06); padding:2px 6px; border-radius:4px; }
.panel-code-block { background:var(--bg); border:1px solid var(--border); border-radius:var(--r-sm); padding:.85rem; word-break:break-all; font-family:var(--font-mono); font-size:.82rem; }
.panel-outline-soft { border-color:rgba(79,142,247,.25); }
.panel-field-wrap { position:relative; }
.panel-field-input-right { padding-right:2.5rem; }
.panel-field-toggle { position:absolute; right:.75rem; top:50%; transform:translateY(-50%); }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: 4px;
}
.skip-link:focus {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 99999;
  padding: 12px 20px;
  background: var(--primary);
  color: #fff;
  border-radius: 8px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(0,0,0,.3);
}

@media print {
  .nav, .footer, .cookie-banner, .scroll-top, #mobile-menu { display: none !important; }
  body { background: #fff; color: #000; }
  .card { border: 1px solid #ddd; box-shadow: none; }
  a { color: #1d4ed8; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.8em; }
}

@keyframes skeleton-pulse {
  0% { opacity: .6 }
  50% { opacity: .3 }
  100% { opacity: .6 }
}
.skeleton {
  background: linear-gradient(90deg, var(--border) 25%, rgba(255,255,255,.04) 50%, var(--border) 75%);
  background-size: 200% 100%;
  animation: skeleton-pulse 1.5s ease-in-out infinite;
  border-radius: 8px;
  min-height: 1rem;
}
.skeleton-title { height: 1.5rem; width: 60%; margin-bottom: .75rem }
.skeleton-text { height: .875rem; margin-bottom: .5rem }
.skeleton-text:last-child { width: 80% }
.skeleton-card { height: 120px; border-radius: 12px; margin-bottom: .75rem }
.skeleton-avatar { width: 40px; height: 40px; border-radius: 50% }
.skeleton-btn { height: 2.5rem; width: 120px; border-radius: 10px }

img[loading="lazy"] {
  opacity: 0;
  transition: opacity .4s ease;
}
img[loading="lazy"].loaded,
img[loading="lazy"][complete] {
  opacity: 1;
}

.toast-enter { animation: toast-slide-in .3s ease forwards }
.toast-exit { animation: toast-slide-out .25s ease forwards }
@keyframes toast-slide-in { from { transform: translateY(-20px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }
@keyframes toast-slide-out { from { opacity: 1 } to { transform: translateY(-10px); opacity: 0 } }

.page-transition-enter {
  animation: page-fade-in .3s ease;
}
@keyframes page-fade-in {
  from { opacity: 0; transform: translateY(8px) }
  to { opacity: 1; transform: translateY(0) }
}

.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--primary), #34d399);
  z-index: 9999;
  transition: width .1s linear;
  pointer-events: none;
}

.mobile-menu {
  transition: transform .3s cubic-bezier(.4,0,.2,1), opacity .3s ease;
}
.mobile-menu:not(.open) {
  transform: translateX(100%);
  opacity: 0;
  pointer-events: none;
}
.mobile-menu.open {
  transform: translateX(0);
  opacity: 1;
}

.admin-chart-wrap {
  position: relative;
  width: 100%;
  height: 280px;
  margin: 1rem 0;
}
.admin-chart-wrap canvas {
  width: 100% !important;
  height: 100% !important;
}

[data-count] {
  transition: opacity .3s ease;
}

/* ══════════════════════════════════════════════════════
   HOMEPAGE REDESIGN — Modern sections + animations
   ══════════════════════════════════════════════════════ */

/* ── Reveal on scroll animation ── */
.reveal {
  opacity: 1;
  transform: none;
}
.js.reveal-ready .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1);
}
.js.reveal-ready .reveal.visible {
  opacity: 1;
  transform: translateY(0);
}
.reveal-delay-1 { transition-delay: .1s }
.reveal-delay-2 { transition-delay: .2s }
.reveal-delay-3 { transition-delay: .3s }
.reveal-delay-4 { transition-delay: .4s }

@media (prefers-reduced-motion: reduce) {
  .js.reveal-ready .reveal,
  .js.reveal-ready .reveal.visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ── Hero particle/gradient background ── */
.hero-bg-glow {
  position: absolute;
  top: -30%;
  left: 50%;
  transform: translateX(-50%);
  width: 900px;
  height: 700px;
  background: radial-gradient(ellipse, rgba(79,142,247,.14) 0%, rgba(52,211,153,.07) 35%, transparent 65%);
  pointer-events: none;
  animation: hero-glow-pulse 8s ease-in-out infinite alternate;
}
@keyframes hero-glow-pulse {
  0% { opacity: .7; transform: translateX(-50%) scale(1) }
  100% { opacity: 1; transform: translateX(-50%) scale(1.08) }
}

/* ── Hero floating badge ── */
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .4rem 1.1rem;
  background: rgba(79,142,247,.08);
  border: 1px solid rgba(79,142,247,.22);
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 600;
  color: #7eb3ff;
  animation: hero-badge-in .8s cubic-bezier(.16,1,.3,1) both;
}
.hero-badge .pulse-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #34d399;
  animation: pulse-glow 2s ease-in-out infinite;
}
@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(52,211,153,.5) }
  50% { box-shadow: 0 0 0 6px rgba(52,211,153,0) }
}
@keyframes hero-badge-in {
  from { opacity: 0; transform: translateY(-12px) }
  to { opacity: 1; transform: translateY(0) }
}

/* ── Hero title gradient ── */
.hero-gradient-text {
  background: linear-gradient(135deg, #4f8ef7 0%, #34d399 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── Trust badges row ── */
.trust-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.25rem;
  font-size: .78rem;
  color: var(--text-3);
}
.trust-badges span {
  transition: color .2s;
}
.trust-badges span:hover {
  color: var(--text-2);
}

/* ── Stats strip enhanced ── */
.stats-strip {
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 2rem 0;
  background: var(--bg-2);
}
.stat-item { text-align: center; padding: .5rem 0 }
.stat-num {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--text);
  line-height: 1.2;
}
.stat-label {
  font-size: .82rem;
  color: var(--text-3);
  margin-top: .25rem;
}

/* ── Feature cards with hover ── */
.feature-card {
  position: relative;
  padding: 1.5rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  transition: border-color .25s, transform .25s, box-shadow .25s;
}
.feature-card:hover {
  border-color: rgba(79,142,247,.3);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
.feature-card-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(79,142,247,.1);
  color: var(--primary);
  margin-bottom: 1rem;
  font-size: 1.25rem;
}
.feature-card h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: .5rem;
}
.feature-card p {
  font-size: .88rem;
  color: var(--text-2);
  line-height: 1.65;
}

/* ── Testimonial / social proof cards ── */
.proof-card {
  padding: 1.25rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  font-size: .9rem;
  line-height: 1.7;
  color: var(--text-2);
}
.proof-card-author {
  margin-top: .75rem;
  font-size: .78rem;
  font-weight: 600;
  color: var(--text-3);
}

/* ── CTA section gradient ── */
.cta-section {
  padding: 5rem 0;
  text-align: center;
  background: linear-gradient(135deg, rgba(79,142,247,.08) 0%, rgba(52,211,153,.05) 100%);
  border-top: 1px solid var(--border);
}

/* ── Mobile responsiveness for homepage ── */
@media (max-width: 768px) {
  .hero-bg-glow { width: 500px; height: 400px }
  .trust-badges { gap: .75rem; font-size: .72rem }
  .grid-4 { grid-template-columns: repeat(2, 1fr) }
}
@media (max-width: 480px) {
  .grid-4 { grid-template-columns: 1fr }
}

/* ══════════════════════════════════════════════════════
   PRICING PAGE — Conversion-optimized cards
   ══════════════════════════════════════════════════════ */
.pricing-card {
  position: relative;
  padding: 2rem 1.5rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  transition: border-color .3s, transform .3s, box-shadow .3s;
  display: flex;
  flex-direction: column;
}
.pricing-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0,0,0,.18);
}
.pricing-card.popular {
  border-color: var(--primary);
  box-shadow: 0 0 0 1px var(--primary), 0 8px 24px rgba(79,142,247,.15);
}
.pricing-card.popular::before {
  content: 'Najpopularniji';
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  padding: .3rem 1rem;
  background: var(--primary);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-radius: 999px;
  white-space: nowrap;
}
.pricing-price {
  font-size: 2.5rem;
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1;
  margin: 1rem 0 .25rem;
}
.pricing-price-note {
  font-size: .82rem;
  color: var(--text-3);
}
.pricing-features {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0;
  flex: 1;
}
.pricing-features li {
  padding: .4rem 0;
  font-size: .88rem;
  color: var(--text-2);
  line-height: 1.5;
  display: flex;
  gap: .5rem;
  align-items: flex-start;
}
.pricing-features li::before {
  content: '✓';
  color: #34d399;
  font-weight: 700;
  flex-shrink: 0;
}
.pricing-cta {
  margin-top: auto;
}

/* ── Guarantee badge ── */
.guarantee-badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1.25rem;
  background: rgba(52,211,153,.08);
  border: 1px solid rgba(52,211,153,.2);
  border-radius: 12px;
  font-size: .85rem;
  color: #34d399;
  font-weight: 600;
}

/* ── Social proof strip ── */
.social-proof-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2rem;
  padding: 1.5rem 0;
  font-size: .85rem;
  color: var(--text-3);
}
.social-proof-strip strong {
  color: var(--text-2);
}

/* ══════════════════════════════════════════════════════
   RUNDA 7: VISUAL CONSISTENCY — All pages match homepage
   ══════════════════════════════════════════════════════ */

/* ── Enhanced page-hero with homepage-style glow ── */
.page-hero {
  padding: 4.5rem 0 3rem;
  border-bottom: 1px solid var(--border);
  text-align: center;
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at top center, rgba(79,142,247,.12), transparent 45%), radial-gradient(circle at 15% 20%, rgba(52,211,153,.08), transparent 30%);
}
.page-hero::before {
  content: '';
  position: absolute;
  top: -30%;
  left: 50%;
  transform: translateX(-50%);
  width: 700px;
  height: 500px;
  background: radial-gradient(ellipse, rgba(79,142,247,.1) 0%, rgba(52,211,153,.05) 35%, transparent 65%);
  pointer-events: none;
  animation: hero-glow-pulse 8s ease-in-out infinite alternate;
}
.page-hero .container { position: relative; z-index: 1 }
.page-hero h1 {
  font-size: clamp(1.875rem, 4vw, 2.75rem);
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.15;
}
.page-hero p { max-width: 720px; margin: .875rem auto 0 }

/* ── Section eyebrow badge (like homepage) ── */
.section-eyebrow {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--primary);
  margin-bottom: .5rem;
}

/* ── Section heading enhanced ── */
.section-heading h2 {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  letter-spacing: -.02em;
  margin-bottom: .75rem;
}
.section-heading p {
  color: var(--text-2);
  max-width: 640px;
  line-height: 1.75;
}

/* ── Content cards with consistent styling ── */
.content-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 1.75rem;
  transition: border-color .25s, transform .25s, box-shadow .25s;
}
.content-card:hover {
  border-color: rgba(79,142,247,.25);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,.12);
}

/* ── Info/highlight boxes (consistent across pages) ── */
.info-box {
  padding: 1.25rem 1.5rem;
  background: linear-gradient(135deg, rgba(79,142,247,.06) 0%, rgba(52,211,153,.04) 100%);
  border: 1px solid rgba(79,142,247,.15);
  border-radius: 12px;
  line-height: 1.75;
}
.info-box-success {
  background: linear-gradient(135deg, rgba(52,211,153,.06) 0%, rgba(52,211,153,.02) 100%);
  border-color: rgba(52,211,153,.18);
}
.info-box-warning {
  background: linear-gradient(135deg, rgba(251,191,36,.06) 0%, rgba(251,191,36,.02) 100%);
  border-color: rgba(251,191,36,.18);
}

/* ── Page CTA sections (consistent bottom CTA) ── */
.page-cta {
  padding: 4rem 0;
  text-align: center;
  background: linear-gradient(135deg, rgba(79,142,247,.07) 0%, rgba(52,211,153,.04) 100%);
  border-top: 1px solid var(--border);
}
.page-cta h2 {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  margin-bottom: .75rem;
}
.page-cta p {
  color: var(--text-2);
  max-width: 520px;
  margin: 0 auto 1.5rem;
  line-height: 1.75;
}

/* ── Code blocks for API docs and tech pages ── */
.public-code-block {
  background: #0d1117;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 1.25rem;
  font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;
  font-size: .82rem;
  line-height: 1.65;
  color: #c9d1d9;
  overflow-x: auto;
  white-space: pre;
  tab-size: 2;
}
.public-code-block-sm {
  font-size: .78rem;
  padding: 1rem;
}

/* ── FAQ accordion enhanced ── */
.faq-item {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  margin-bottom: .625rem;
  overflow: hidden;
  transition: border-color .25s;
}
.faq-item:hover { border-color: rgba(79,142,247,.2) }
.faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.25rem;
  cursor: pointer;
  font-weight: 600;
  font-size: .95rem;
  user-select: none;
  transition: color .2s;
}
.faq-q:hover { color: var(--primary) }
.faq-q svg {
  flex-shrink: 0;
  transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.faq-item.open .faq-q svg { transform: rotate(180deg) }
.faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s cubic-bezier(.4,0,.2,1), padding .35s;
  padding: 0 1.25rem;
}
.faq-item.open .faq-a {
  max-height: 300px;
  padding: 0 1.25rem 1.25rem;
}
.faq-a p {
  font-size: .9rem;
  color: var(--text-2);
  line-height: 1.75;
  margin: 0;
}

/* ── Blog cards enhanced ── */
.blog-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 1.5rem;
  transition: border-color .25s, transform .25s, box-shadow .25s;
  display: flex;
  flex-direction: column;
}
.blog-card:hover {
  border-color: rgba(79,142,247,.25);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
.blog-card h3 a {
  color: var(--text);
  text-decoration: none;
  transition: color .2s;
}
.blog-card h3 a:hover { color: var(--primary) }

/* ── Contact form enhanced ── */
.contact-form-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 2rem;
}

/* ── Status page indicators ── */
.status-pill {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .45rem 1rem;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 600;
}
.status-pill.is-ok { background: rgba(52,211,153,.1); color: #34d399 }
.status-pill.is-issue { background: rgba(248,113,113,.1); color: #f87171 }

/* ── Webhook/notification status indicators ── */
.webhook-status {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .82rem;
}
.webhook-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.webhook-dot.active { background: #34d399; box-shadow: 0 0 6px rgba(52,211,153,.5) }
.webhook-dot.inactive { background: #64748b }
.webhook-dot.error { background: #f87171; box-shadow: 0 0 6px rgba(248,113,113,.5) }

/* ── Rate limit dashboard ── */
.rate-limit-bar {
  height: 6px;
  background: var(--border);
  border-radius: 3px;
  overflow: hidden;
}
.rate-limit-bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width .6s cubic-bezier(.16,1,.3,1);
}
.rate-limit-bar-fill.ok { background: #34d399 }
.rate-limit-bar-fill.warn { background: #fbbf24 }
.rate-limit-bar-fill.danger { background: #f87171 }

/* ── Notification bell ── */
.notification-bell {
  position: relative;
  cursor: pointer;
}
.notification-bell .badge-count {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  background: #f87171;
  color: #fff;
  font-size: .65rem;
  font-weight: 700;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
}


.public-hero-shell {
  position: relative;
  overflow: hidden;
}
body.public-site .page-hero,
.home-hero {
  width: 100%;
}
.home-hero {
  min-height: calc(100vh - var(--nav-h));
  display: flex;
  align-items: center;
}
body.public-site .page-hero {
  min-height: auto;
  display: block;
  padding: 4.5rem 0 3rem;
}
body.public-site .page-hero .container,
.home-hero .container {
  width: min(1240px, calc(100% - 2rem));
}

body.public-site:not(.page-home) .page-hero {
  min-height: 0 !important;
  height: auto !important;
  display: block !important;
}
body.public-site.page-about-us .page-hero .container,
body.public-site.page-categories .page-hero .container,
body.public-site.page-blog-article .container-sm {
  max-width: 860px;
}
.page-hero.page-hero-split .container,
.public-hero-grid {
  width: 100%;
}
.home-expert-modal .modal {
  max-width: 920px;
}
.home-expert-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}
.home-expert-helper {
  font-size: .92rem;
}
.home-expert-meta {
  font-size: .82rem;
}
@media (max-width: 820px) {
  .home-expert-grid { grid-template-columns: 1fr; }
  body.public-site .page-hero,
  .home-hero { min-height: auto; }
}
.public-hero-shell {
  position: relative;
  overflow: hidden;
}
.public-hero-shell::before {
  content: '';
  position: absolute;
  inset: auto auto 8% 50%;
  transform: translateX(-50%);
  width: min(880px, 88vw);
  height: 420px;
  background: radial-gradient(ellipse, rgba(79,142,247,.14) 0%, rgba(52,211,153,.08) 38%, transparent 72%);
  pointer-events: none;
  filter: blur(8px);
}
.public-hero-shell > .container { position: relative; z-index: 1; }
.public-hero-shell h1 {
  letter-spacing: -.03em;
  line-height: 1.08;
}
.public-hero-shell .public-hero-summary {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: 1rem;
}
.public-hero-shell .public-hero-summary span {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .45rem .8rem;
  border: 1px solid rgba(79,142,247,.16);
  border-radius: 999px;
  background: rgba(255,255,255,.03);
  color: var(--text-2);
  font-size: .8rem;
}
.public-hero-shell .public-hero-summary span::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(var(--accent-rgb), .08);
}


.public-section-shell {
  position: relative;
}
.public-section-shell::before {
  content: '';
  position: absolute;
  inset: 0 auto auto 50%;
  transform: translateX(-50%);
  width: min(1040px, 92vw);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(79,142,247,.22), transparent);
  pointer-events: none;
}
.panel-command-item.is-selected {
  background: rgba(79,142,247,.12);
  border-color: rgba(79,142,247,.34);
  transform: translateY(-1px);
}
.panel-command-item:focus-visible {
  outline: 2px solid rgba(127,176,255,.75);
  outline-offset: 2px;
}
.panel-command-item.is-selected .panel-command-item-badge {
  border-color: rgba(79,142,247,.34);
  color: var(--text);
  background: rgba(79,142,247,.1);
}
.user-settings-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1rem;
}
.user-settings-help-list {
  display: grid;
  gap: .65rem;
  margin-top: 1rem;
}
.user-settings-help-item {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .8rem .9rem;
  border: 1px solid rgba(54,81,118,.58);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
}
.user-settings-help-item strong {
  display: block;
  margin-bottom: .2rem;
  font-size: .92rem;
}
.user-settings-help-item span {
  color: var(--text-2);
  font-size: .82rem;
  line-height: 1.65;
}
.user-settings-help-item code {
  align-self: center;
  white-space: nowrap;
  color: var(--text);
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(54,81,118,.7);
  border-radius: 999px;
  padding: .22rem .55rem;
  font-size: .75rem;
}

/* ── Deep polish: shared public/page + panel UX ───────────────────────── */
.sidebar-search-wrap {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .75rem .75rem .5rem;
  background: linear-gradient(180deg, rgba(18,27,45,.98), rgba(18,27,45,.92));
  border-bottom: 1px solid rgba(54,81,118,.35);
}
.sidebar-search-icon {
  color: var(--text-3);
  flex-shrink: 0;
}
.sidebar-search-input {
  width: 100%;
  border: 1px solid rgba(54,81,118,.85);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: var(--text);
  padding: .62rem .9rem;
  font-size: .84rem;
}
.sidebar-search-input::placeholder { color: var(--text-3); }
.sidebar-search-clear {
  border: 0;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  color: var(--text-2);
  cursor: pointer;
  flex-shrink: 0;
}
.sidebar-search-empty {
  margin: .3rem .9rem 0;
  padding: .7rem .85rem;
  border: 1px dashed rgba(54,81,118,.8);
  border-radius: 12px;
  color: var(--text-3);
  font-size: .78rem;
}
.panel-topbar-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(54,81,118,.7);
  background: rgba(255,255,255,.04);
  color: var(--text-2);
  cursor: pointer;
}
.panel-topbar-btn:hover {
  color: var(--text);
  border-color: rgba(79,142,247,.55);
  background: rgba(79,142,247,.08);
}
.public-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .42rem 1rem;
  border-radius: 999px;
  background: rgba(79,142,247,.1);
  border: 1px solid rgba(79,142,247,.22);
  color: #8db8ff;
  font-size: .78rem;
  font-weight: 700;
  margin-bottom: 1.15rem;
}
.public-hero-actions,
.public-chip-grid,
.public-proof-list {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
}
.public-proof-list {
  justify-content: center;
  font-size: .8rem;
  color: var(--text-3);
}
.public-proof-list span {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.public-proof-list.is-left { justify-content: flex-start; }
.public-info-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 1rem;
}
.public-info-card {
  padding: 1.15rem 1rem;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: rgba(255,255,255,.02);
}
.public-info-card h3 {
  font-size: 1rem;
  margin-bottom: .45rem;
}
.public-info-card p {
  margin: 0;
  color: var(--text-2);
  font-size: .92rem;
  line-height: 1.8;
}
.public-cta-band {
  padding: 1.45rem;
  border-radius: 22px;
  border: 1px solid rgba(79,142,247,.18);
  background: linear-gradient(135deg, rgba(79,142,247,.09) 0%, rgba(52,211,153,.06) 100%);
  box-shadow: 0 18px 46px rgba(0,0,0,.18);
}
.public-cta-band h2,
.public-cta-band h3 { margin-bottom: .45rem; }
.public-cta-band p {
  margin: 0;
  color: var(--text-2);
}
.public-mini-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 1rem;
}
.public-mini-stat {
  padding: 1rem 1.1rem;
  border-radius: 16px;
  border: 1px solid rgba(54,81,118,.72);
  background: rgba(255,255,255,.025);
}
.public-mini-stat strong {
  display: block;
  font-size: 1.2rem;
  color: var(--text);
  margin-bottom: .2rem;
}
.public-mini-stat span {
  color: var(--text-2);
  font-size: .87rem;
}

.panel-recent-wrap {
  margin-top: .95rem;
  padding-top: .85rem;
  border-top: 1px solid rgba(54,81,118,.35);
}
.panel-recent-title {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-3);
  margin-bottom: .55rem;
}
.panel-recent-links {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.panel-recent-link {
  border: 1px solid rgba(54,81,118,.72);
  background: rgba(255,255,255,.04);
  color: var(--text-2);
  padding: .45rem .65rem;
  border-radius: 999px;
  font-size: .75rem;
  cursor: pointer;
  max-width: 100%;
}
.panel-recent-link:hover {
  color: var(--text);
  border-color: rgba(79,142,247,.55);
  background: rgba(79,142,247,.08);
}
.public-prefooter {
  padding: 1.25rem 0 0;
}
.public-prefooter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}
.public-prefooter-card {
  padding: 1.15rem 1rem;
  border: 1px solid rgba(54,81,118,.68);
  border-radius: 18px;
  background: rgba(255,255,255,.025);
  transition: transform var(--t), border-color var(--t), background var(--t);
}
.public-prefooter-card:hover {
  transform: translateY(-2px);
  border-color: rgba(79,142,247,.42);
  background: rgba(79,142,247,.05);
}
.public-prefooter-card strong {
  display: block;
  margin-bottom: .35rem;
  font-size: 1rem;
}
.public-prefooter-card span {
  display: block;
  color: var(--text-2);
  font-size: .9rem;
  line-height: 1.75;
}
@media (max-width: 960px) {
  .public-prefooter-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .public-prefooter-grid { grid-template-columns: 1fr; }
}
.public-legal-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.public-legal-summary .card {
  padding: 1.2rem 1.05rem;
  border-color: rgba(79,142,247,.14);
  background: rgba(255,255,255,.02);
}
.public-legal-summary h2,
.public-legal-summary h3 {
  font-size: 1rem;
  margin-bottom: .45rem;
}
.public-legal-summary p {
  margin: 0;
  color: var(--text-2);
  font-size: .9rem;
  line-height: 1.75;
}
.public-feature-list {
  display: grid;
  gap: .85rem;
}
.public-feature-item {
  padding: 1rem 1.1rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: rgba(255,255,255,.02);
}
.public-feature-item strong {
  display: block;
  margin-bottom: .3rem;
  color: var(--text);
}
.public-feature-item span {
  color: var(--text-2);
  font-size: .92rem;
  line-height: 1.8;
}
@media (max-width: 960px) {
  .public-info-grid,
  .public-mini-stat-grid,
  .public-legal-summary { grid-template-columns: 1fr; }
}

/* ── Shared public page section nav ───────────────────── */
.public-page-nav {
  padding: 0 0 1.25rem;
}
.public-page-nav .container {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
  align-items: center;
  justify-content: space-between;
  padding-top: .25rem;
}
.public-page-nav-title {
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-3);
}
.public-page-nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}
.public-page-nav-link {
  display: inline-flex;
  align-items: center;
  padding: .52rem .85rem;
  border-radius: 999px;
  border: 1px solid rgba(79,142,247,.16);
  background: rgba(79,142,247,.06);
  color: var(--text-2);
  font-size: .86rem;
  transition: background var(--t), border-color var(--t), color var(--t), transform var(--t);
}
.public-page-nav-link:hover,
.public-page-nav-link.is-active {
  color: var(--text);
  border-color: rgba(79,142,247,.34);
  background: rgba(79,142,247,.14);
  transform: translateY(-1px);
}

/* ── Panel command palette ────────────────────────────── */
.panel-command-open { overflow: hidden; }
.panel-command-palette {
  position: fixed;
  inset: 0;
  z-index: 950;
}
.panel-command-palette.hidden { display: none; }
.panel-command-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2,6,23,.66);
  backdrop-filter: blur(8px);
}
.panel-command-dialog {
  position: relative;
  width: min(720px, calc(100vw - 2rem));
  margin: 10vh auto 0;
  border-radius: 22px;
  border: 1px solid rgba(79,142,247,.2);
  background: linear-gradient(180deg, rgba(11,17,32,.98), rgba(18,27,45,.98));
  box-shadow: 0 30px 80px rgba(0,0,0,.55);
  overflow: hidden;
}
.panel-command-input-wrap {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1rem .85rem;
  border-bottom: 1px solid var(--border);
}
.panel-command-icon { color: var(--text-3); display: inline-flex; }
.panel-command-input {
  flex: 1;
  background: transparent;
  border: 0;
  outline: none;
  color: var(--text);
  font-size: 1rem;
}
.panel-command-close {
  border: 1px solid var(--border);
  background: rgba(255,255,255,.03);
  color: var(--text-2);
  border-radius: 999px;
  padding: .3rem .65rem;
  font-size: .78rem;
}
.panel-command-hint {
  padding: .7rem 1rem 0;
  color: var(--text-3);
  font-size: .78rem;
}
.panel-command-results {
  padding: .75rem;
  display: grid;
  gap: .45rem;
  max-height: min(60vh, 520px);
  overflow: auto;
}
.panel-command-item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  text-align: left;
  border-radius: 16px;
  border: 1px solid transparent;
  background: rgba(255,255,255,.03);
  color: var(--text);
  padding: .9rem 1rem;
  transition: background var(--t), border-color var(--t), transform var(--t);
}
.panel-command-item:hover {
  background: rgba(79,142,247,.1);
  border-color: rgba(79,142,247,.2);
  transform: translateY(-1px);
}
.panel-command-item-body {
  display: flex;
  flex-direction: column;
  gap: .18rem;
  min-width: 0;
}
.panel-command-item-title {
  font-size: .95rem;
  font-weight: 700;
}
.panel-command-item-meta {
  color: var(--text-3);
  font-size: .78rem;
}
.panel-command-item-badge {
  flex-shrink: 0;
  color: var(--text-3);
  font-size: .78rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  padding: .18rem .5rem;
}
.panel-command-empty {
  padding: 1rem;
  color: var(--text-3);
  text-align: center;
  font-size: .9rem;
}

/* ── Classification guidance chips ────────────────────── */
.result-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin-top: .7rem;
}
.result-chip {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  border-radius: 999px;
  padding: .34rem .65rem;
  border: 1px solid rgba(79,142,247,.16);
  background: rgba(79,142,247,.07);
  color: var(--text-2);
  font-size: .76rem;
  line-height: 1.2;
}

@media (max-width: 768px) {
  .panel-command-dialog {
    width: calc(100vw - 1rem);
    margin-top: 7vh;
    border-radius: 18px;
  }
  .public-page-nav .container {
    align-items: flex-start;
  }
}

.result-box-compact .result-head {
  gap: 1rem;
}
.result-box-compact .result-body {
  padding-top: .85rem;
}
.result-box-compact .mt-4 { margin-top: .9rem !important; }
.result-box-compact .mt-3 { margin-top: .7rem !important; }
.result-box-compact .p-3 { padding: .8rem !important; }


@media (max-width: 1100px) {
  .nav-inner { gap: .75rem; }
  .brand-kicker { display: none; }
}
@media (max-width: 720px) {
  .public-hero-shell .public-hero-summary { gap: .5rem; }
  .public-hero-shell .public-hero-summary span { width: 100%; justify-content: center; }
}

/* ── Public code cleanup / shared content classes ───────────────────── */
.page-hero-inner {
  position: relative;
  z-index: 1;
}
.public-hero-lead {
  max-width: 760px;
  margin: .95rem auto 0;
  font-size: 1.04rem;
  line-height: 1.8;
  color: var(--text-2);
}
.public-hero-lead-wide { max-width: 820px; }
.public-hero-actions.is-centered { justify-content: center; }
.public-section-tight { padding: 0 0 1rem; }
.public-stack { display: grid; gap: 1rem; }
.public-split-top { align-items: start; }
.public-card-title {
  font-size: 1rem;
  font-weight: 800;
  margin-bottom: .45rem;
}
.public-card-copy {
  margin: 0;
  color: var(--text-2);
  font-size: .92rem;
  line-height: 1.78;
}
.public-card-copy + .public-card-copy { margin-top: .95rem; }
.public-card-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .34rem .7rem;
  border-radius: 999px;
  border: 1px solid rgba(79,142,247,.16);
  background: rgba(79,142,247,.08);
  color: #bfdbfe;
  font-size: .74rem;
  font-weight: 700;
}
.public-cta-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
}
.public-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: flex-end;
}
.public-note-card {
  background: rgba(79,142,247,.05);
  border-color: rgba(79,142,247,.16);
}
.public-note-flex {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  flex-wrap: wrap;
}
.public-note-icon {
  font-size: 1.45rem;
  line-height: 1;
}
.public-note-title {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: .45rem;
}
.public-note-copy {
  margin: 0;
  color: var(--text-2);
  line-height: 1.75;
}
.legal-copy h2 {
  font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: .75rem;
}
.legal-copy p {
  font-size: .875rem;
  line-height: 1.85;
}
.legal-copy p:not(:last-child) { margin-bottom: 1rem; }
.legal-link { color: var(--primary); }
.public-render-card,
.public-info-card,
.public-legal-summary > *,
.status-service-card,
.public-card-grid > * {
  content-visibility: auto;
  contain-intrinsic-size: 280px;
}
.js .reveal {
  backface-visibility: hidden;
  transform: translateZ(0);
}
@media (max-width: 860px) {
  .public-cta-grid {
    grid-template-columns: 1fr;
  }
  .public-cta-actions {
    justify-content: flex-start;
  }
}
@media (max-width: 640px) {
  .public-hero-lead {
    font-size: .98rem;
  }
  .public-card-title {
    font-size: .96rem;
  }
}


/* ── Public page cleanup / split hero + content helpers ───────────────── */
.page-hero.page-hero-split .container {
  max-width: 1160px;
  text-align: left;
}
.page-hero.page-hero-split .page-breadcrumb {
  margin-bottom: 1rem;
}
.page-hero.page-hero-split p {
  margin-left: 0;
  margin-right: 0;
  max-width: 680px;
}
.public-hero-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
  align-items: center;
}
.public-hero-grid .public-proof-list {
  justify-content: flex-start;
}
.public-highlight-stack,
.public-card-stack,
.public-step-list,
.public-field-list,
.public-status-list {
  display: grid;
  gap: .85rem;
}
.public-highlight-card,
.public-field-card,
.public-box-card {
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: rgba(255,255,255,.02);
}
.public-highlight-card.is-accent,
.public-box-card.is-accent {
  border-color: rgba(79,142,247,.16);
  background: rgba(79,142,247,.05);
}
.public-box-card.is-danger-soft {
  border-color: rgba(239,68,68,.16);
  background: rgba(239,68,68,.04);
}
.public-highlight-label {
  font-size: .78rem;
  color: var(--text-3);
  font-weight: 700;
  margin-bottom: .3rem;
}
.public-highlight-value {
  font-weight: 800;
  font-size: 1.05rem;
  line-height: 1.55;
}
.public-stat-card {
  padding: 1.2rem 1rem;
  text-align: center;
}
.public-stat-value {
  font-size: 1.85rem;
  font-weight: 800;
  color: var(--primary);
  line-height: 1.1;
}
.public-stat-label {
  margin-top: .35rem;
  font-size: .82rem;
  color: var(--text-3);
}
.public-section-alt {
  background: var(--bg-2);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.public-section-no-top {
  padding-top: 0 !important;
}
.public-step-item {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: .9rem;
  align-items: start;
}
.public-step-badge {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: rgba(79,142,247,.12);
  border: 1px solid rgba(79,142,247,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  color: var(--primary);
}
.public-step-title,
.public-box-title,
.public-card-title-strong {
  font-weight: 800;
  margin-bottom: .3rem;
}
.public-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
}
.public-inline-actions.is-start {
  justify-content: flex-start;
}
.public-list-muted {
  margin: 0;
  padding-left: 1.1rem;
  color: var(--text-2);
  font-size: .92rem;
  line-height: 2;
}
.public-checklist {
  margin: 0;
  padding-left: 1rem;
  color: var(--text-2);
  font-size: .92rem;
  line-height: 1.9;
}
.public-checklist li + li,
.public-list-muted li + li {
  margin-top: .1rem;
}
.public-field-key {
  font-family: var(--font-mono);
  font-size: .76rem;
  color: var(--text-3);
}
.public-field-title {
  font-weight: 700;
  margin-top: .2rem;
}
.public-status-row {
  display: flex;
  gap: .75rem;
  padding: .7rem 0;
  border-bottom: 1px solid var(--border);
  align-items: flex-start;
}
.public-status-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.public-status-code {
  min-width: 44px;
  font-family: var(--font-mono);
  font-size: .9rem;
  font-weight: 800;
}
.public-status-code.is-success { color: var(--success); }
.public-status-code.is-warning { color: var(--warning); }
.public-status-code.is-danger { color: var(--danger); }
.public-status-code.is-neutral { color: var(--text); }
.public-support-note {
  padding: 1rem;
  font-size: .88rem;
  background: rgba(79,142,247,.05);
  border-color: rgba(79,142,247,.15);
}
.public-copy-tight {
  margin: 0;
  color: var(--text-2);
  line-height: 1.8;
}
.public-copy-tight + .public-copy-tight {
  margin-top: .95rem;
}
@media (max-width: 860px) {
  .public-hero-grid {
    grid-template-columns: 1fr;
  }
  .page-hero.page-hero-split .container {
    text-align: center;
  }
  .page-hero.page-hero-split p {
    margin-left: auto;
    margin-right: auto;
  }
  .public-hero-grid .public-proof-list,
  .public-inline-actions.is-start {
    justify-content: center;
  }
}

/* ── Public page shared polish (r7) ─────────────────── */
.page-hero-inner { position: relative; z-index: 1; }
.public-badge-row { display:flex; gap:.75rem; flex-wrap:wrap; align-items:center; }
.public-lead-compact { max-width: 760px; font-size: 1.05rem; }
.public-lead-compact strong { color: var(--text); font-weight: 700; }
.public-hero-actions-band {
  display:flex;
  flex-wrap:wrap;
  gap:.875rem;
  justify-content:center;
  margin-top:1.5rem;
}
.public-section-heading {
  text-align:center;
  max-width:780px;
  margin:0 auto 2rem;
}
.public-section-heading h2 {
  font-size: clamp(1.5rem, 2vw, 2rem);
  font-weight: 800;
  margin: .35rem 0 .55rem;
}
.public-section-heading p {
  color: var(--text-2);
  line-height: 1.8;
}
.public-panel-card {
  border-color: rgba(79, 142, 247, .18);
}
.public-panel-card-alt {
  padding:1.35rem 1.25rem;
  background:linear-gradient(135deg,rgba(79,142,247,.08) 0%,rgba(52,211,153,.06) 100%);
  border-color:rgba(79,142,247,.18);
}
.public-panel-layout {
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  align-items:flex-start;
  justify-content:space-between;
}
.public-panel-copy { max-width: 760px; }
.public-chip-success {
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.3rem .7rem;
  border-radius:999px;
  background:rgba(16,185,129,.12);
  color:#10b981;
  font-size:.74rem;
  font-weight:700;
  margin-bottom:.85rem;
}
.public-price-emphasis { font-size:1.4rem; font-weight:900; color:var(--text); }
.public-price-emphasis s { opacity:.5; font-size:1rem; margin-right:.35rem; }
.public-panel-side {
  min-width:220px;
  display:flex;
  flex-direction:column;
  gap:.75rem;
  align-items:flex-start;
}
.public-terminal-head {
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-bottom:1.5rem;
  padding-bottom:1rem;
  border-bottom:1px solid var(--border);
}
.public-terminal-dots { display:flex; gap:.375rem; }
.public-terminal-dots span {
  width:11px; height:11px; border-radius:50%; display:block;
}
.public-terminal-dots .is-red { background:#f87171; }
.public-terminal-dots .is-yellow { background:#fbbf24; }
.public-terminal-dots .is-green { background:#34d399; }
.public-terminal-title {
  font-size:.75rem;
  font-family:var(--font-mono);
  color:var(--text-3);
  margin-left:.375rem;
}
.public-terminal-status {
  font-size:.72rem;
  color:var(--text-3);
}
.public-search-row,
.public-inline-form,
.public-actions-row {
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
}
.public-input-wrap {
  flex:1;
  min-width:260px;
  position:relative;
}
.public-input-wrap .input { padding-right:2.5rem; }
.public-input-icon {
  position:absolute;
  right:.875rem;
  top:50%;
  transform:translateY(-50%);
  opacity:.35;
}
.public-quick-examples {
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
  margin-bottom:1.25rem;
}
.public-quick-examples .label {
  font-size:.75rem;
  color:var(--text-3);
  align-self:center;
  margin-right:.125rem;
}
.public-pill-button,
.public-quick-examples button {
  font-size:.76rem;
  padding:.3rem .75rem;
  border-radius:20px;
  border:1px solid var(--border-2);
  color:var(--text-3);
  background:transparent;
  cursor:pointer;
  transition:all .15s ease;
}
.public-pill-button:hover,
.public-quick-examples button:hover {
  border-color: var(--primary);
  color: var(--text);
  background: rgba(79, 142, 247, .08);
}
.public-spotlight-card { box-shadow: var(--shadow-lg); }
.public-aside-card { border-color:rgba(79,142,247,.2); }
.public-help-list,
.price-feature-list,
.public-check-list {
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:.4rem;
}
.public-help-list { font-size:.8rem; color:var(--text-2); }
.public-check-list { font-size:.78rem; color:var(--text); }
.public-check-list li,
.price-feature-list li,
.public-help-list li { display:flex; gap:.45rem; align-items:flex-start; }
.public-check-list li::before,
.price-feature-list li::before,
.public-help-list li::before {
  content:'✓';
  flex-shrink:0;
  margin-top:1px;
}
.public-help-list li::before { color: var(--primary); content:'💡'; }
.public-kpd-format {
  font-family:var(--font-mono);
  font-size:1.8rem;
  font-weight:800;
  color:var(--primary);
  text-align:center;
  padding:.5rem 0;
  margin-bottom:.75rem;
}
.public-kpd-breakdown {
  display:flex;
  flex-direction:column;
  gap:.4rem;
  font-size:.78rem;
  color:var(--text-2);
}
.public-kpd-breakdown strong { font-weight:700; }
.public-section-split { margin-bottom:2.5rem; }
.public-search-shell .input.input-lg { min-width:260px; }
.public-scroll-table { max-height: 600px; overflow-y: auto; }
.sifrarnik-results-scroll { max-height: 600px; overflow-y: auto; }
.sifrarnik-results-meta { margin-bottom: 1rem; }
.price-card-badge-wrap {
  position:absolute;
  top:-12px;
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
}
.price-card-popular-badge { font-size:.78rem; padding:.3rem .75rem; }
.price-card-kicker { font-size:.75rem; color:var(--text-3); margin-bottom:.25rem; }
.price-card-title { font-size:1rem; font-weight:700; margin-bottom:.25rem; }
.price-card-title-lg { font-size:1.05rem; font-weight:800; margin-bottom:.25rem; }
.price-card-subtitle { font-size:.8rem; color:var(--text-2); margin-bottom:.75rem; }
.price-card-number { font-size:2rem; }
.price-card-number .unit,
.price-card-number sup { font-size:.9rem; }
.price-card-number small { font-size:.75rem; font-weight:400; color:var(--text-2); }
.price-card-note { font-size:.75rem; color:var(--text-3); margin-bottom:.35rem; }
.price-query-badge { font-size:.75rem; }
.public-modal-title { font-size:1.35rem; font-weight:800; margin:0 0 .5rem; }
.public-modal-text,
.public-copy-text { color:var(--text-2); line-height:1.8; }
.public-copy-text-sm { color:var(--text-2); line-height:1.8; font-size:.92rem; }
.public-codebook-actions,
.public-nav-pills { display:flex; gap:.5rem; flex-wrap:wrap; }
.public-table-head-code { width:120px; }
.public-table-head-actions { width:80px; }
.public-results-empty { text-align:center; color:var(--text-2); padding:2rem; }
.public-inline-note { font-size:.82rem; font-weight:600; color:var(--text); margin-bottom:.75rem; }
.public-example-layout { align-items:start; gap:2.5rem; }
.public-example-arrow {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
@media (max-width: 900px) {
  .public-panel-side,
  .public-panel-copy { max-width: 100%; width: 100%; }
  .public-panel-layout { flex-direction: column; }
}
.public-center-copy { max-width: 780px; margin: 0 auto; }
.public-title-md { font-size:1.25rem; font-weight:700; margin-bottom:1.25rem; }
.public-title-md-tight { font-size:1.25rem; font-weight:700; margin-bottom:.5rem; }
.public-card-center { text-align:center; }
.public-card-outline-danger { border-color:rgba(239,68,68,.18); }
.public-card-outline-primary-soft { border-color:rgba(79,142,247,.35); background:rgba(79,142,247,.04); }
.public-card-outline-strong { border-color:var(--border-2); }
.public-price-old { font-size:1.75rem; font-weight:800; color:var(--text); text-decoration:line-through; opacity:.7; }
.public-price-old sup { font-size:.85rem; }
.public-price-current { font-size:2rem; font-weight:900; color:var(--text); }
.public-price-support { font-size:1.1rem; font-weight:800; color:var(--text); }
.public-mini-note { font-size:.78rem; color:var(--text-2); margin-top:.5rem; }
.public-faq-wrap { max-width:760px; margin:0 auto; }
.public-faq-title { font-size:1.25rem; font-weight:700; margin-bottom:1.5rem; text-align:center; }
.public-faq-item { border-bottom:1px solid var(--border); padding:.875rem 0; }
.public-faq-summary {
  font-weight:600; font-size:.95rem; cursor:pointer; list-style:none;
  display:flex; justify-content:space-between; align-items:center;
}
.public-faq-icon { font-size:1.25rem; color:var(--text-2); transition:transform .2s ease; }
.public-faq-answer { font-size:.875rem; color:var(--text-2); margin-top:.625rem; line-height:1.7; }
.price-card { position: relative; }
.pricing-grid .price-feature-list { flex: 1; }


/* ── Public cleanup / quality pass r8 ───────────────────────────── */
.public-pulse-dot.is-success { background: var(--success); }
.public-pulse-dot.is-danger { background: var(--danger); }
.public-page-breadcrumb-spaced { margin-bottom: 1rem; }
.public-hero-number-badge { font-size: 1.5rem; padding: .5rem 1.5rem; }
.public-title-xl { font-size: clamp(1.75rem, 3.5vw, 2.5rem); font-weight: 800; margin-bottom: .75rem; }
.public-copy-relaxed { line-height: 1.7; }
.about-card-copy { margin: 0; }
.about-target-list { display: grid; gap: .85rem; }
.about-target-item { padding: .9rem 1rem; border: 1px solid var(--border); border-radius: var(--r-sm); }
.about-cta-grid { gap: 1rem; align-items: center; }
.about-cta-actions { justify-content: flex-end; }
.public-section-mini-title { font-size: 1.1rem; font-weight: 800; margin-bottom: .45rem; }
.public-section-mini-title.no-margin { margin-bottom: 0; }
.public-stat-number-inline { font-size: 1.4rem; font-weight: 800; }
.public-stat-number-sm { font-size: 1.15rem; font-weight: 800; }
.public-link-strong { color: var(--primary); font-weight: 700; }
.public-link-reset { color: inherit; }
.public-link-reset:hover,
.public-link-strong:hover { text-decoration: underline; }
.public-blog-lead { font-size: 1.05rem; max-width: 620px; }
.blog-feature-card { display: flex; gap: 2rem; align-items: center; flex-wrap: wrap; }
.blog-feature-copy { flex: 1; min-width: 220px; }
.blog-feature-title { font-size: 1.7rem; font-weight: 700; margin-bottom: .75rem; }
.blog-list-card { display: block; transition: all .2s ease; }
.blog-list-title { font-weight: 700; margin-bottom: .5rem; font-size: 1rem; line-height: 1.45; }
.blog-article-excerpt { background: rgba(26,46,107,.03); margin-bottom: 2rem; font-size: 1.05rem; font-weight: 500; }
.blog-toc-list { margin: 0; padding-left: 1rem; display: grid; gap: .45rem; }
.blog-toc-item.is-child { margin-left: 1rem; }
.blog-article-body { line-height: 1.85; font-size: .975rem; }
.blog-nav-grid { gap: 1rem; align-items: start; }
.blog-nav-next { text-align: right; }
.public-title-sm { font-size: .95rem; font-weight: 700; }
.public-context-select { width: 130px; }
.public-example-button { justify-content: space-between; }
.public-code-accent.is-primary { color: var(--primary); }
.public-code-accent.is-accent { color: var(--accent); }
.public-code-accent.is-success { color: var(--success); }
@media (max-width: 720px) {
  .about-cta-actions { justify-content: flex-start; }
  .blog-nav-next { text-align: left; }
  .public-context-select { width: 100%; }
}

/* ══════════════════════════════════════════════════════
   RUNDA 9: HOMEPAGE CLEAN REFACTOR
   ══════════════════════════════════════════════════════ */
.home-hero {
  padding: 5rem 0 3.5rem;
  position: relative;
  overflow: hidden;
  text-align: center;
}
.home-hero .container { position: relative; }
.home-hero-badge-wrap { margin-bottom: 2rem; }
.home-hero-title {
  font-size: clamp(2.25rem, 5.5vw, 4rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.1;
  margin-bottom: 1.125rem;
}
.home-hero-lead {
  max-width: 560px;
  margin: .75rem auto 2.5rem;
  color: var(--text-2);
  line-height: 1.75;
  font-size: 1.0625rem;
}
.home-hero-actions,
.home-cta-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .875rem;
}
.home-promo-section { padding: 1rem 0 0; }
.home-promo-card {
  padding: 1.35rem 1.25rem;
  background: linear-gradient(135deg, rgba(79,142,247,.08) 0%, rgba(52,211,153,.06) 100%);
  border-color: rgba(79,142,247,.18);
}
.home-promo-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: flex-start;
  justify-content: space-between;
}
.home-promo-copy { max-width: 760px; }
.home-promo-badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .3rem .7rem;
  margin-bottom: .85rem;
  border-radius: 999px;
  background: rgba(16,185,129,.12);
  color: #10b981;
  font-size: .74rem;
  font-weight: 700;
}
.home-promo-title {
  margin: 0 0 .5rem;
  font-size: 1.35rem;
  font-weight: 800;
}
.home-promo-text,
.home-promo-subtext {
  margin: 0;
  color: var(--text-2);
  line-height: 1.8;
  font-size: .95rem;
}
.home-promo-subtext { margin-top: .7rem; font-size: .92rem; }
.home-promo-cta {
  min-width: 220px;
  display: flex;
  flex-direction: column;
  gap: .75rem;
  align-items: flex-start;
}
.home-promo-price {
  font-size: 1.4rem;
  font-weight: 900;
  color: var(--text);
}
.home-promo-price-old {
  margin-right: .35rem;
  opacity: .5;
  font-size: 1rem;
  text-decoration: line-through;
}
.home-section-alt {
  background: var(--bg-2);
  border-top: 1px solid var(--border);
}
.home-section-head h2 {
  font-size: 1.875rem;
  font-weight: 700;
}
.home-section-head p {
  max-width: 620px;
  margin: .625rem auto 0;
  color: var(--text-2);
}
.home-section-note {
  max-width: 760px;
  margin: .5rem auto 0;
  color: var(--text-3);
  font-size: .85rem;
}
.home-section-intro-card {
  max-width: 760px;
  margin: 0 auto;
  padding: 1.2rem 1.3rem;
  border: 1px solid rgba(148,163,184,.14);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(15,23,42,.42), rgba(15,23,42,.2));
  box-shadow: 0 24px 44px rgba(2,6,23,.16);
}
.home-section-intro-card.is-secondary {
  border-color: rgba(52,211,153,.16);
  background: linear-gradient(180deg, rgba(15,23,42,.48), rgba(11,31,31,.22));
}
.home-section-intro-card h2 {
  margin-top: .55rem;
}
.home-section-intro-card p {
  max-width: 62ch;
}
.home-terminal-head {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border);
}
.home-terminal-dots { display: flex; gap: .375rem; }
.home-terminal-dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
}
.home-terminal-dot.is-red { background: #f87171; }
.home-terminal-dot.is-amber { background: #fbbf24; }
.home-terminal-dot.is-green { background: #34d399; }
.home-terminal-label {
  margin-left: .375rem;
  font-size: .75rem;
  font-family: var(--font-mono);
  color: var(--text-3);
}
.home-terminal-status-dot { margin-left: auto; }
.home-terminal-status { font-size: .72rem; color: var(--text-3); }
.home-classify-row {
  display: flex;
  gap: .75rem;
  flex-wrap: wrap;
  margin-bottom: .875rem;
}
.home-classify-input-wrap {
  flex: 1;
  min-width: 260px;
  position: relative;
}
.home-classify-input { padding-right: 2.5rem; }
.home-classify-input-icon {
  position: absolute;
  right: .875rem;
  top: 50%;
  transform: translateY(-50%);
  opacity: .35;
}
.home-classify-select {
  width: 190px;
  flex-shrink: 0;
}
.home-classify-button {
  min-width: 140px;
  flex-shrink: 0;
}
.home-example-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1.25rem;
}
.home-example-label {
  align-self: center;
  margin-right: .125rem;
  color: var(--text-3);
  font-size: .75rem;
}
.home-example-chip {
  padding: .3rem .75rem;
  border-radius: 999px;
  border: 1px solid var(--border-2);
  color: var(--text-3);
  background: transparent;
  cursor: pointer;
  transition: all .15s ease;
  font-size: .76rem;
}
.home-example-chip:hover,
.home-example-chip:focus-visible {
  border-color: rgba(79,142,247,.4);
  color: var(--text);
  background: rgba(79,142,247,.08);
  outline: none;
}
.home-icon-box {
  width: 44px;
  height: 44px;
  margin-bottom: 1rem;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  color: var(--primary);
}
.home-icon-box.is-primary,
.home-step-number.is-primary { background: rgba(79,142,247,.1); border-color: rgba(79,142,247,.18); color: #4f8ef7; }
.home-icon-box.is-teal,
.home-step-number.is-teal { background: rgba(34,211,238,.12); border-color: rgba(34,211,238,.24); color: #22d3ee; }
.home-icon-box.is-accent,
.home-step-number.is-accent,
.home-check-list.is-accent { color: #34d399; }
.home-icon-box.is-accent { background: rgba(52,211,153,.1); border-color: rgba(52,211,153,.18); }
.home-step-number.is-accent { background: rgba(52,211,153,.1); border-color: rgba(52,211,153,.24); }
.home-icon-box.is-warning { background: rgba(251,191,36,.1); border-color: rgba(251,191,36,.2); color: #fbbf24; }
.home-icon-box.is-danger { background: rgba(248,113,113,.1); border-color: rgba(248,113,113,.2); color: #f87171; }
.home-icon-box.is-blue,
.home-check-list.is-blue { color: #3b82f6; }
.home-icon-box.is-blue { background: rgba(59,130,246,.1); border-color: rgba(59,130,246,.2); }
.home-icon-box.is-emerald,
.home-check-list.is-emerald { color: #10b981; }
.home-icon-box.is-emerald { background: rgba(16,185,129,.1); border-color: rgba(16,185,129,.2); }
.home-icon-box.is-violet,
.home-check-list.is-violet,
.home-step-number.is-violet { color: #8b5cf6; }
.home-icon-box.is-violet { background: rgba(139,92,246,.1); border-color: rgba(139,92,246,.2); }
.home-step-number.is-violet { background: rgba(139,92,246,.1); border-color: rgba(139,92,246,.24); }
.home-feature-title {
  margin-bottom: .5rem;
  font-size: 1.15rem;
  font-weight: 700;
}
.home-feature-copy {
  color: var(--text-2);
  font-size: .9rem;
  line-height: 1.78;
}
.home-feature-copy + .home-feature-copy { margin-top: 1rem; }
.home-visual-card { border-color: rgba(79,142,247,.18); }
.home-visual-card.is-primary { border-color: rgba(79,142,247,.2); }
.home-visual-card.is-accent { border-color: rgba(52,211,153,.2); }
.home-visual-card.is-warning { border-color: rgba(251,191,36,.2); }
.home-visual-card.is-danger { border-color: rgba(248,113,113,.15); }
.home-visual-card.is-blue { border-color: rgba(59,130,246,.2); }
.home-visual-card.is-emerald { border-color: rgba(16,185,129,.2); }
.home-visual-card.is-violet { border-color: rgba(139,92,246,.2); }
.home-visual-status {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1rem;
  color: var(--accent);
  font-size: .8rem;
}
.home-result-code {
  font-size: 1.3rem;
  font-weight: 700;
  font-family: var(--font-mono);
  color: var(--primary);
}
.home-result-title { margin-top: .25rem; font-size: .85rem; }
.home-result-meta {
  margin-top: .5rem;
  color: var(--text-3);
  font-size: .75rem;
}
.home-pill-stack,
.home-check-list,
.home-step-list {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.home-pill-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .5rem .75rem;
  border-radius: 8px;
  background: rgba(52,211,153,.06);
  font-size: .8rem;
}
.home-pill-check { color: var(--accent); font-weight: 800; }
.home-card-kicker {
  margin-bottom: .75rem;
  font-size: .82rem;
  font-weight: 600;
  color: var(--text);
}
.home-table-list {
  display: flex;
  flex-direction: column;
  gap: .25rem;
}
.home-table-list-mono { font-family: var(--font-mono); font-size: .78rem; }
.home-table-list-row {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .35rem 0;
}
.home-table-list-row + .home-table-list-row { border-top: 1px solid var(--border); }
.home-table-code { color: var(--primary); }
.home-check-list {
  gap: .5rem;
  font-size: .84rem;
}
.home-check-item {
  display: flex;
  gap: .5rem;
  align-items: center;
  color: var(--text);
}
.home-check-item svg { flex-shrink: 0; }
.home-step-item {
  display: flex;
  gap: .85rem;
  align-items: flex-start;
  padding: .9rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.02);
}
.home-step-number {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-weight: 800;
  border: 1px solid transparent;
}
.home-step-title {
  margin-bottom: .2rem;
  font-size: .92rem;
  font-weight: 700;
}
.home-step-copy {
  color: var(--text-2);
  font-size: .82rem;
  line-height: 1.6;
}
.home-api-kicker {
  margin-bottom: .5rem;
  color: var(--text-3);
  font-size: .75rem;
  font-family: var(--font-mono);
}
.home-api-snippet {
  padding: .75rem;
  border-radius: 8px;
  background: rgba(0,0,0,.15);
  color: var(--text-2);
  font-size: .72rem;
  line-height: 1.8;
  font-family: var(--font-mono);
}
.home-faq-wrap {
  max-width: 760px;
  margin: 0 auto;
  display: grid;
  gap: .75rem;
}
.home-faq-item {
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(21,32,51,.96), rgba(18,27,45,.96));
}
.home-faq-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.1rem;
  font-size: .96rem;
  font-weight: 600;
  color: var(--text);
  list-style: none;
}
.home-faq-icon {
  flex-shrink: 0;
  color: var(--text-3);
  transition: transform .2s ease, color .2s ease;
}
.home-faq-item[open] .home-faq-icon {
  transform: rotate(180deg);
  color: var(--primary);
}
.home-faq-answer {
  padding: 0 1.1rem 1rem;
  color: var(--text-2);
  line-height: 1.78;
  font-size: .9rem;
}
.home-use-card,
.home-testimonial-card {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.home-use-card { gap: .75rem; }
.home-use-icon { width: 48px; height: 48px; border-radius: 14px; display:flex; align-items:center; justify-content:center; background: rgba(79,142,247,.1); border:1px solid rgba(79,142,247,.18); color: var(--primary); }
.home-use-icon svg { width: 22px; height: 22px; }
.home-use-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}
.home-use-copy {
  margin: 0;
  color: var(--text-2);
  font-size: .88rem;
  line-height: 1.75;
}
.home-testimonials-section {
  background: linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%);
  border-top: 1px solid var(--border);
}
.home-testimonial-card {
  gap: .85rem;
  padding: 1.35rem 1.25rem;
}
.home-stars {
  color: #fbbf24;
  font-size: .9rem;
  letter-spacing: .08em;
}
.home-testimonial-quote {
  margin: 0;
  color: var(--text);
  line-height: 1.85;
  font-size: .92rem;
  font-weight: 500;
}
.home-testimonial-meta {
  margin-top: auto;
  padding-top: .35rem;
  border-top: 1px solid var(--border);
}
.home-testimonial-role {
  color: var(--text);
  font-size: .9rem;
  font-weight: 700;
}
.home-testimonial-benefit {
  margin-top: .2rem;
  color: var(--text-3);
  font-size: .8rem;
}
.home-cta-section {
  padding: 5rem 0;
  text-align: center;
  background: linear-gradient(135deg, rgba(79,142,247,.08) 0%, rgba(52,211,153,.05) 100%);
  border-top: 1px solid var(--border);
}
.home-cta-title {
  margin-bottom: .75rem;
  font-size: 2.125rem;
  font-weight: 800;
}
.home-cta-copy {
  max-width: 440px;
  margin: 0 auto 2rem;
  color: var(--text-2);
  line-height: 1.7;
}
.ac-item-code {
  min-width: 70px;
}
.ac-item-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .home-promo-cta {
    width: 100%;
    min-width: 0;
  }
}
@media (max-width: 768px) {
  .home-hero-title { font-size: clamp(2rem, 7vw, 3rem); }
  .home-classify-select,
  .home-classify-button { width: 100%; }
}

.ac-anchor { position: relative; }


/* ── Non-home public hero hard stop (prevents full-screen carry-over) ───────────────── */
body.public-site:not(.page-home) main .page-hero,
body.public-site:not(.page-home) main .page-hero.public-hero-shell,
body.public-site:not(.page-home) main .page-hero.page-hero-split {
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  display: block !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  padding: clamp(2.8rem, 4vw, 4.5rem) 0 clamp(1.8rem, 3vw, 3rem) !important;
}
body.public-site:not(.page-home) main .page-hero::before {
  max-height: 420px;
}


/* ── Mobile responsiveness hardening (r16) ───────────────────────────── */
body.mobile-menu-open { overflow: hidden; }
.mobile-menu { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)); overscroll-behavior: contain; }
.table-wrap,
.public-scroll-table,
.sifrarnik-results-scroll {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
.table-wrap table.responsive-table td,
.table-wrap table.responsive-table th {
  word-break: break-word;
}
@media (max-width: 920px) {
  .container,
  .container-sm,
  .nav-inner,
  .footer-grid,
  .footer-bottom,
  .footer-meta-links { padding-left: 1rem; padding-right: 1rem; }
  .panel-topbar {
    height: auto;
    min-height: 60px;
    padding: .75rem 1rem;
    flex-wrap: wrap;
    align-items: center;
  }
  .panel-topbar-title {
    min-width: 0;
    line-height: 1.3;
  }
  .panel-topbar-meta {
    max-width: 100%;
    flex-wrap: wrap;
    gap: .5rem;
  }
  .sidebar {
    width: min(86vw, 320px);
    max-width: 320px;
    box-shadow: 0 18px 60px rgba(0,0,0,.45);
  }
  body.public-site .footer-bottom,
  body.public-site .footer-meta-links {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  .card,
  .card-lg,
  .panel-health-card { padding: 1rem; }
  .modal {
    padding: 1rem;
    border-radius: 16px;
  }
  .btn {
    white-space: normal;
    min-height: 42px;
  }
  .nav-logo,
  .footer-brand { min-width: 0; }
  .brand-lockup,
  .brand-wordmark { min-width: 0; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  body.public-site .page-hero,
  body.public-site .page-hero.public-hero-shell,
  body.public-site .page-hero.page-hero-split {
    padding-top: 2.4rem !important;
    padding-bottom: 1.8rem !important;
  }
  body.public-site .page-hero h1 {
    font-size: clamp(1.7rem, 7vw, 2.35rem);
  }
  body.public-site .page-hero p {
    font-size: .98rem;
    line-height: 1.75;
  }
  body.public-site .public-hero-grid,
  body.public-site .public-panel-layout,
  body.public-site .public-example-layout,
  body.public-site .feature-row,
  body.public-site .home-expert-grid,
  body.public-site .public-cta-grid {
    grid-template-columns: 1fr !important;
    flex-direction: column;
  }
  body.public-site .public-input-wrap,
  body.public-site .public-search-shell .input.input-lg {
    min-width: 0;
    width: 100%;
  }
  body.public-site .public-hero-actions-band .btn,
  body.public-site .public-cta-actions .btn,
  body.public-site .public-codebook-actions .btn,
  body.public-site .public-nav-pills .btn,
  body.public-site .blog-topic-links .btn,
  body.public-site .public-search-row > .btn,
  body.public-site .public-inline-form > .btn {
    width: 100%;
    justify-content: center;
  }
  body.public-site .blog-card-grid article,
  body.public-site .public-panel-card,
  body.public-site .public-panel-card-alt,
  body.public-site .price-card {
    min-width: 0;
  }
}

@media (max-width: 680px) {
  .panel-content {
    padding: .875rem;
  }
  .panel-content > * {
    min-width: 0;
  }
  .panel-content .slide-up,
  .panel-content .card,
  .panel-content .table-wrap,
  .panel-content .result-box {
    max-width: 100% !important;
  }
  .panel-content .grid,
  .panel-content [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
  .panel-content [style*="min-width:220px"],
  .panel-content [style*="min-width:260px"],
  .panel-content [style*="min-width:320px"] {
    min-width: 0 !important;
    width: 100% !important;
  }
  .panel-content [style*="max-width:300px"],
  .panel-content [style*="max-width:320px"] {
    max-width: none !important;
  }
  .panel-content .flex.gap-2.flex-wrap .btn,
  .panel-content .flex.gap-2.flex-wrap a.btn,
  .panel-content .flex.gap-3.flex-wrap .btn,
  .panel-content .flex.gap-3.flex-wrap a.btn {
    flex: 1 1 100%;
    justify-content: center;
  }
  .result-head,
  .panel-topbar-meta,
  .panel-shell-error-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .result-head > *,
  .panel-topbar-meta > * {
    width: 100%;
  }
  .panel-content .table-wrap {
    margin-inline: -.125rem;
  }
  body.public-site .table-wrap table {
    min-width: 640px;
  }
}

/* Generic mobile card layout for data tables */
@media (max-width: 640px) {
  .table-wrap.responsive-cards {
    overflow: visible;
    background: transparent;
    border: 0;
    box-shadow: none;
  }
  .table-wrap.responsive-cards table.responsive-table,
  .article-content table.responsive-table {
    min-width: 0 !important;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: transparent;
  }
  .table-wrap.responsive-cards table.responsive-table thead,
  .article-content table.responsive-table thead {
    display: none;
  }
  .table-wrap.responsive-cards table.responsive-table tbody,
  .table-wrap.responsive-cards table.responsive-table tr,
  .article-content table.responsive-table tbody,
  .article-content table.responsive-table tr {
    display: block;
    width: 100%;
  }
  .table-wrap.responsive-cards table.responsive-table tr,
  .article-content table.responsive-table tr {
    padding: .9rem 1rem;
    margin-bottom: .75rem;
    border: 1px solid var(--border);
    border-radius: var(--r);
    background: linear-gradient(180deg,rgba(21,32,51,.96),rgba(18,27,45,.96));
    box-shadow: 0 10px 24px rgba(0,0,0,.14);
  }
  .table-wrap.responsive-cards table.responsive-table td,
  .article-content table.responsive-table td {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .9rem;
    width: 100%;
    padding: .38rem 0;
    border: 0;
    text-align: right;
    background: transparent !important;
  }
  .table-wrap.responsive-cards table.responsive-table td::before,
  .article-content table.responsive-table td::before {
    content: attr(data-label);
    flex: 0 0 42%;
    max-width: 42%;
    text-align: left;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--text-3);
  }
  .table-wrap.responsive-cards table.responsive-table td[data-label=""]::before,
  .article-content table.responsive-table td[data-label=""]::before {
    content: '';
    display: none;
  }
  .table-wrap.responsive-cards table.responsive-table td > :is(div,span,a,button),
  .article-content table.responsive-table td > :is(div,span,a,button) {
    margin-left: auto;
    max-width: 58%;
  }
  .table-wrap.responsive-cards table.responsive-table td .btn,
  .article-content table.responsive-table td .btn {
    width: auto;
    min-height: 36px;
  }
}

/* HUB3 responsive helpers */
.hub3-main-grid,
.hub3-slip-layout,
.hub3-slip-grid,
.hub3-info-grid,
.hub3-detail-grid,
.hub3-payer-grid {
  display: grid;
  gap: .8rem;
}
.hub3-main-grid { grid-template-columns: minmax(0,1.15fr) minmax(320px,.85fr); }
.hub3-slip-layout { grid-template-columns: minmax(0,1.15fr) minmax(260px,.85fr); align-items: start; }
.hub3-slip-grid-2,
.hub3-detail-grid,
.hub3-payer-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.hub3-slip-grid-iban { grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); }
.hub3-slip-grid-ref { grid-template-columns: minmax(0,.5fr) minmax(0,1fr); }
.hub3-info-grid { grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); }
.hub3-slip-card {
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 22px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(15,23,42,.08);
}
.hub3-slip-head {
  padding: 1rem 1rem .85rem;
  border-bottom: 1px solid rgba(15,23,42,.08);
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: flex-start;
  flex-wrap: wrap;
  background: linear-gradient(180deg,#f8fbff,#ffffff);
}
.hub3-slip-body { padding: 1rem; }
.hub3-slip-box,
.hub3-info-card {
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  padding: .8rem;
}
.hub3-info-card {
  background: #fff;
  min-height: 96px;
}
.hub3-slip-box-title {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: #64748b;
  font-weight: 700;
  margin-bottom: .45rem;
}
.hub3-slip-value,
.hub3-info-card-value {
  font-weight: 700;
  color: #0f172a;
  word-break: break-word;
}
.hub3-slip-value.is-strong { font-weight: 800; font-size: 1.05rem; }
.hub3-slip-value.is-amount { font-size: 1.15rem; }
.hub3-slip-muted {
  font-size: .82rem;
  color: #64748b;
  margin-top: .22rem;
}
.hub3-barcode-card {
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  padding: 1rem;
  background: #fbfdff;
}
.hub3-barcode-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 240px;
  border: 1px dashed rgba(15,23,42,.14);
  border-radius: 16px;
  background: #fff;
  padding: 1rem;
}
.hub3-barcode-note {
  font-size: .85rem;
  color: #475569;
  line-height: 1.55;
  margin-top: .85rem;
}
@media (max-width: 860px) {
  .hub3-main-grid,
  .hub3-slip-layout { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .hub3-slip-grid-2,
  .hub3-slip-grid-iban,
  .hub3-slip-grid-ref,
  .hub3-detail-grid,
  .hub3-payer-grid { grid-template-columns: 1fr; }
  .hub3-slip-head { padding: .9rem; }
  .hub3-slip-body,
  .hub3-barcode-card { padding: .9rem; }
  .hub3-barcode-frame { min-height: 200px; padding: .75rem; }
}


/* ── r17 public/legal/result polish ─────────────────────────────────── */
body.public-site:not(.page-home) main .page-hero > .container,
body.public-site:not(.page-home) main .page-hero.page-hero-split > .container,
body.public-site:not(.page-home) main .page-hero.public-hero-shell > .container,
body.public-site:not(.page-home) .page-hero-inner {
  min-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
body.public-site.page-legal .section {
  padding-top: 1.25rem;
}
body.public-site .legal-article {
  max-width: 860px;
  margin: 0 auto;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
body.public-site .legal-article h2 {
  margin-top: 2rem;
}
body.public-site .legal-article h2:first-child {
  margin-top: 0;
}
body.public-site .legal-article .table-wrap {
  margin-top: 1rem;
}
.result-verified-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem;
  padding: .8rem 1rem;
  border-radius: 14px;
  background: rgba(22,163,74,.09);
  border: 1px solid rgba(22,163,74,.18);
  color: var(--text);
}
.result-supplement-box {
  padding: 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: rgba(15,23,42,.03);
}
@media (max-width: 760px) {
  body.public-site:not(.page-home) main .page-hero,
  body.public-site:not(.page-home) main .page-hero.public-hero-shell,
  body.public-site:not(.page-home) main .page-hero.page-hero-split {
    padding-top: 2rem !important;
    padding-bottom: 1.4rem !important;
  }
  .result-verified-banner,
  .result-supplement-box {
    padding: .85rem;
  }
}


.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.public-anchor-nav {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: center;
  margin: 1.25rem auto 0;
}
.public-anchor-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  padding: .65rem .9rem;
  border: 1px solid rgba(127,176,255,.18);
  border-radius: 999px;
  background: rgba(17, 24, 39, .52);
  color: var(--text-2);
  font-size: .83rem;
  font-weight: 600;
  line-height: 1.2;
  transition: background var(--t), border-color var(--t), color var(--t), transform var(--t);
}
.public-anchor-link:hover,
.public-anchor-link:focus-visible,
.public-anchor-link.is-active {
  color: var(--text);
  border-color: rgba(127,176,255,.48);
  background: rgba(79,142,247,.14);
  transform: translateY(-1px);
}
.public-anchor-link:focus-visible {
  outline: 2px solid rgba(127,176,255,.4);
  outline-offset: 2px;
}
body.public-site main [id] {
  scroll-margin-top: calc(var(--nav-h) + 1rem);
}
.home-feature-card,
.home-use-card,
.home-testimonial-card,
.price-card,
.public-card-grid > article,
.public-card-grid > div,
.feature-row,
.status-overview-card,
.status-service-card {
  content-visibility: auto;
  contain-intrinsic-size: 320px;
}
@media (max-width: 680px) {
  .public-anchor-nav {
    gap: .5rem;
  }
  .public-anchor-link {
    width: 100%;
  }
}

/* ── SEO/content hub polish ───────────────────────────── */
.heading-anchor-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: .5rem;
  color: var(--text-3);
  font-size: .9rem;
  opacity: 0;
  transform: translateY(-1px);
  transition: opacity var(--t), color var(--t);
}
article h2:hover .heading-anchor-link,
article h3:hover .heading-anchor-link,
section h2:hover .heading-anchor-link,
section h3:hover .heading-anchor-link,
.heading-anchor-link:focus-visible {
  opacity: 1;
  color: var(--primary-h);
}

.blog-cluster-grid,
.blog-inline-related-grid {
  align-items: stretch;
}
.blog-cluster-card,
.blog-inline-related-card,
.blog-list-card {
  height: 100%;
}
.blog-cluster-title {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: .85rem;
}
.blog-cluster-list {
  display: grid;
  gap: .95rem;
  list-style: none;
}
.blog-cluster-list li + li {
  padding-top: .95rem;
  border-top: 1px solid rgba(148, 163, 184, .12);
}
.blog-cluster-grid-wrap,
.blog-topic-links,
.blog-feature-card,
.blog-list-card,
.blog-inline-related-card,
.public-blog-feature,
.public-panel-card {
  content-visibility: auto;
  contain-intrinsic-size: 320px;
}

@media (max-width: 900px) {
  .heading-anchor-link {
    opacity: 1;
  }
}


/* ── R55 content polish ───────────────────────────── */
.blog-listing-stats {
  font-size: .8rem;
  color: var(--text-2);
}
body.public-site .api-language-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}
body.public-site.page-api-docs .api-contract-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
body.public-site.page-api-docs .api-contract-grid > *,
body.public-site.page-api-docs .api-language-grid > *,
body.public-site.page-api-docs .home-story-split > * {
  min-width: 0;
}
body.public-site.page-api-docs .public-render-card {
  min-width: 0;
}
body.public-site.page-api-docs .public-code-block {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}
body.public-site.page-api-docs .public-code-block code,
body.public-site.page-api-docs code {
  overflow-wrap: anywhere;
  word-break: break-word;
}
body.public-site.page-api-docs .api-endpoint-block {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.home-story-row {
  align-items: stretch;
}
.home-story-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.home-story-panel {
  height: 100%;
  border: 1px solid rgba(79,142,247,.18);
  background: linear-gradient(180deg, rgba(17,26,42,.9), rgba(12,19,31,.92));
}
.home-story-panel.is-accent {
  border-color: rgba(52,211,153,.2);
}
.home-story-panel.is-teal {
  border-color: rgba(45,212,191,.2);
}
.home-story-panel.is-warning {
  border-color: rgba(251,191,36,.22);
}
.home-story-kicker {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--text-3);
  margin-bottom: 1rem;
}
.home-story-stack {
  display: grid;
  gap: 1rem;
}
.home-story-stack > div {
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(148,163,184,.12);
}
.home-story-stack > div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.home-story-stack h4 {
  margin: 0 0 .35rem;
  font-size: 1rem;
}
.home-story-stack p {
  margin: 0;
  color: var(--text-2);
  line-height: 1.75;
}
.home-story-steps {
  margin: 0;
  padding-left: 1.2rem;
  display: grid;
  gap: .95rem;
}
.home-story-steps li {
  color: var(--text-2);
  line-height: 1.65;
}
.home-story-steps li strong {
  display: block;
  margin-bottom: .18rem;
  color: var(--text);
}
.home-story-steps li span {
  display: block;
}
@media (max-width: 1100px) {
  body.public-site .api-language-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 1040px) {
  body.public-site.page-api-docs .api-contract-grid {
    grid-template-columns: 1fr;
  }
}


/* ── R55.1 layout and listing polish ─────────────────── */
body.public-site .blog-card-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}
.home-story-layout {
  display: grid;
  gap: 2.2rem;
}
.home-story-split {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, .92fr);
  gap: 2.5rem;
  align-items: start;
  padding: 1.2rem 0 2.2rem;
  border-bottom: 1px solid rgba(148,163,184,.12);
}
.home-story-split:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.home-story-side {
  min-width: 0;
}
.home-story-prose {
  max-width: 64ch;
}
.home-story-prose h3 {
  margin: 0 0 .9rem;
  font-size: clamp(1.35rem, 1.1rem + .75vw, 1.9rem);
}
.home-story-prose p + p {
  margin-top: 1rem;
}
.home-story-prose-compact {
  margin-bottom: 1rem;
}
.home-story-textlist {
  display: grid;
  gap: 1rem;
}
.home-story-textlist > div {
  padding: 0 0 1rem;
  border-bottom: 1px solid rgba(148,163,184,.12);
}
.home-story-textlist > div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.home-story-textlist h4 {
  margin: 0 0 .35rem;
  font-size: 1rem;
}
.home-story-textlist p {
  margin: 0;
  color: var(--text-2);
  line-height: 1.8;
}
.home-story-steps-soft {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  gap: .95rem;
}
.home-story-steps-soft li {
  padding-bottom: .95rem;
  border-bottom: 1px solid rgba(148,163,184,.12);
}
.home-story-steps-soft li:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.home-story-steps-soft span {
  display: block;
  color: var(--text-2);
  margin-top: .25rem;
  line-height: 1.75;
}
@media (max-width: 1100px) {
  body.public-site .blog-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 900px) {
  .home-story-split {
    grid-template-columns: 1fr;
    gap: 1.4rem;
  }
}
@media (max-width: 680px) {
  body.public-site .blog-card-grid {
    grid-template-columns: 1fr;
  }
  body.public-site .table-wrap {
    padding: .2rem .35rem;
  }
  body.public-site .table-wrap table {
    width: max(100%, 520px);
    min-width: 520px;
  }
  body.public-site .public-code-block {
    padding: .95rem 1rem;
    font-size: .76rem;
  }
}


/* ── R57 stability and layout polish ───────────────── */
body.page-blog .blog-cluster-grid-wrap,
body.page-blog .blog-topic-links,
body.page-blog .blog-feature-card,
body.page-blog .blog-list-card,
body.page-blog .blog-inline-related-card,
body.page-blog .public-blog-feature,
body.page-blog .public-panel-card {
  content-visibility: visible;
  contain-intrinsic-size: auto;
}
body.page-blog .blog-card-grid {
  align-items: start;
}
.blog-archive-list {
  display: grid;
  gap: 1rem;
}
.blog-archive-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: start;
  padding: 1rem 0;
  border-bottom: 1px solid rgba(148,163,184,.12);
}
.blog-archive-item:first-child {
  padding-top: 0;
}
.blog-archive-item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.page-home #prednosti .home-story-layout,
.page-home #kako-funkcionira .home-story-layout {
  gap: 2.8rem;
}
.page-home #prednosti .home-story-split,
.page-home #kako-funkcionira .home-story-split {
  grid-template-columns: minmax(0, 1.16fr) minmax(320px, .84fr);
  gap: 2.9rem;
  padding: 1.4rem 0 2.5rem;
}
.page-home #prednosti .home-story-side,
.page-home #kako-funkcionira .home-story-side {
  display: grid;
  gap: 1rem;
  align-content: start;
}
.page-home #prednosti .home-story-prose,
.page-home #kako-funkcionira .home-story-prose {
  max-width: 70ch;
}
.page-home #prednosti .home-story-textlist,
.page-home #kako-funkcionira .home-story-textlist,
.page-home #kako-funkcionira .home-story-steps-soft {
  padding: 1.15rem 1.25rem;
  border: 1px solid rgba(148,163,184,.14);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(15,23,42,.48), rgba(15,23,42,.28));
}
.page-home #kako-funkcionira .home-story-steps-soft {
  padding-left: 2rem;
}
.page-home #prednosti .home-story-kicker,
.page-home #kako-funkcionira .home-story-kicker {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .35rem .7rem;
  border-radius: 999px;
  background: rgba(79,142,247,.1);
  color: var(--primary);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
@media (max-width: 900px) {
  .blog-archive-item {
    grid-template-columns: 1fr;
  }
  .page-home #prednosti .home-story-split,
  .page-home #kako-funkcionira .home-story-split {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}

/* Panel mobile readability refresh */
.panel-wrap-user,
.panel-wrap-admin {
  min-width: 0;
}
.panel-main-user,
.panel-main-admin,
.panel-content-user,
.panel-content-admin {
  min-width: 0;
}
.panel-topbar-meta-user,
.panel-topbar-meta-admin {
  min-width: 0;
}
.panel-topbar-usage {
  display: inline-flex;
  align-items: center;
  padding: .32rem .65rem;
  border-radius: 999px;
  border: 1px solid rgba(54,81,118,.7);
  background: rgba(255,255,255,.04);
  white-space: nowrap;
}
.user-overview-page,
.user-query-page {
  min-width: 0;
}
.user-overview-recent-card,
.user-overview-shortcuts,
.user-overview-quick-card,
.user-query-card {
  min-width: 0;
}
.user-overview-recent-row > .flex-1,
.user-overview-recent-row > .flex-shrink-0 {
  min-width: 0;
}
.user-overview-shortcuts-grid > .card,
.user-overview-shortcuts-grid > button,
.user-query-examples .btn,
.user-quick-example-list .btn {
  min-width: 0;
}

@media (max-width: 760px) {
  .panel-main-user .panel-topbar,
  .panel-main-admin .panel-topbar {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    align-items: center;
    row-gap: .55rem;
    column-gap: .75rem;
  }
  .panel-main-user .panel-topbar-title,
  .panel-main-admin .panel-topbar-title {
    min-width: 0;
    font-size: .98rem;
    line-height: 1.28;
  }
  .panel-main-user .panel-topbar-meta,
  .panel-main-admin .panel-topbar-meta {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: nowrap;
    gap: .5rem;
    width: 100%;
    overflow-x: auto;
    padding-bottom: .15rem;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .panel-main-user .panel-topbar-meta::-webkit-scrollbar,
  .panel-main-admin .panel-topbar-meta::-webkit-scrollbar {
    display: none;
  }
  .panel-main-user .panel-topbar-meta > *,
  .panel-main-admin .panel-topbar-meta > * {
    flex: 0 0 auto;
    width: auto;
  }
  .panel-main-user .panel-topbar-avatar,
  .panel-main-admin .panel-topbar-avatar {
    flex-shrink: 0;
  }
  .panel-main-user .panel-topbar-btn-copy,
  .panel-main-user .panel-topbar-btn-history-forward,
  .panel-main-user .panel-topbar-btn-recent,
  .panel-main-admin .panel-topbar-btn-copy,
  .panel-main-admin .panel-topbar-btn-history-forward,
  .panel-main-admin .panel-topbar-btn-recent {
    display: none;
  }

  .user-overview-hero {
    align-items: flex-start !important;
    margin-bottom: 1rem !important;
  }
  .user-overview-hero-actions {
    width: 100%;
  }
  .user-overview-hero-actions .btn {
    flex: 1 1 calc(50% - .5rem);
    justify-content: center;
  }
  .user-overview-stats,
  .user-overview-shortcuts-grid {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: .75rem !important;
  }
  .user-overview-main {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
  }
  .user-overview-recent-row {
    flex-direction: column;
    align-items: stretch;
    gap: .55rem !important;
  }
  .user-overview-recent-row > .flex-shrink-0 {
    justify-content: space-between;
  }
  .user-overview-recent-row .btn {
    min-height: 34px;
  }
  .user-quick-classify-form {
    flex-direction: column;
  }
  .user-quick-classify-form .btn {
    width: 100%;
    justify-content: center;
  }
  .user-quick-example-list,
  .user-query-examples {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: .55rem !important;
  }
  .user-quick-example-list .btn,
  .user-query-examples .btn {
    width: 100%;
    justify-content: center;
    padding-inline: .65rem;
    font-size: .76rem;
  }
  .user-query-page {
    max-width: 100% !important;
  }
  .user-query-heading {
    display: none;
  }
  .user-query-card {
    padding: 1rem;
  }
  .user-query-meta {
    flex-direction: column;
    align-items: flex-start;
    gap: .2rem;
  }
}

@media (max-width: 560px) {
  .panel-main-user .panel-topbar,
  .panel-main-admin .panel-topbar {
    padding: .75rem .875rem;
  }
  .panel-main-user .panel-topbar-btn-search,
  .panel-main-admin .panel-topbar-btn-search {
    display: none;
  }
  .panel-main-user .panel-topbar-usage,
  .panel-main-admin .panel-topbar-badge {
    display: none;
  }
  .panel-content-user,
  .panel-content-admin {
    padding: .75rem;
  }
  .user-overview-hero-actions .btn,
  .user-overview-stats,
  .user-overview-shortcuts-grid,
  .user-quick-example-list,
  .user-query-examples {
    grid-template-columns: 1fr !important;
    flex-basis: 100%;
  }
  .user-overview-hero-actions .btn {
    width: 100%;
  }
}


/* User panel mobile deep refinement */
@media (max-width: 760px) {
  .panel-main-user .panel-content-user {
    padding: .8rem .8rem calc(1rem + env(safe-area-inset-bottom));
  }
  .panel-main-user .panel-content-user > .slide-up {
    max-width: 100% !important;
  }
  .panel-main-user .panel-content-user > .slide-up > h2 {
    display: none;
  }
  .panel-main-user .panel-quick-nav {
    gap: .55rem;
    padding: .7rem .8rem;
    margin-bottom: .85rem;
    border-radius: 16px;
  }
  .panel-main-user .panel-quick-nav-links {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: .1rem;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .panel-main-user .panel-quick-nav-links::-webkit-scrollbar {
    display: none;
  }
  .panel-main-user .panel-quick-nav-link {
    flex: 0 0 auto;
    white-space: nowrap;
  }
  .panel-main-user .card {
    padding: 1rem;
    border-radius: 18px;
  }

  .user-history-page .user-history-header,
  .user-favorites-page .user-history-header,
  .user-batch-page > .flex.items-center.justify-between,
  .user-hub3-page > .flex.items-center.justify-between {
    align-items: flex-start !important;
    gap: .85rem !important;
    margin-bottom: .9rem !important;
  }
  .user-history-page .user-history-header-actions,
  .user-favorites-page .user-history-header-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .user-history-page .user-history-header-actions .btn,
  .user-favorites-page .user-history-header-actions .btn {
    width: 100%;
    justify-content: center;
  }
  .user-history-page .user-history-pager,
  .user-favorites-page .user-history-pager {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .55rem;
  }
  .user-history-page .user-history-pager .input,
  .user-history-page .user-history-pager .btn,
  .user-favorites-page .user-history-pager .input,
  .user-favorites-page .user-history-pager .btn {
    width: 100%;
    max-width: none !important;
    min-height: 42px;
    justify-content: center;
  }
  .user-history-page .user-history-filters,
  .user-favorites-page .user-favorites-filters,
  #manual-batch-filter-form,
  #batch-history-filter-form,
  #hub3-history-search-form,
  .user-billing-panel .grid-3.mb-3 {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: .65rem !important;
  }
  .user-history-page .user-history-filters .input,
  .user-favorites-page .user-favorites-filters .input,
  #manual-batch-filter-form .input,
  #manual-batch-filter-form .btn,
  #batch-history-filter-form .input,
  #batch-history-filter-form .btn,
  #hub3-history-search-form .input,
  #hub3-history-search-form .btn,
  .user-billing-panel .grid-3.mb-3 .input {
    width: 100%;
    max-width: none !important;
    min-width: 0 !important;
  }
  .user-history-page .user-history-table,
  .user-favorites-page .user-favorites-table {
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .user-batch-page .grid-4,
  .user-hub3-page .grid-4,
  .user-billing-panel .grid-4,
  .user-billing-panel .grid-2,
  .user-batch-page .grid-2,
  .user-settings-page .grid-2 {
    gap: .8rem !important;
  }
  .user-batch-page #batch-drop-zone,
  .user-hub3-page #hub3-dropzone {
    padding: 1.1rem !important;
    border-radius: 16px !important;
  }
  .user-batch-page .card.card-lg,
  .user-hub3-page .card.card-lg {
    padding: 1rem;
  }
  .user-batch-page .card .flex.gap-2.mt-3.flex-wrap,
  .user-hub3-page .flex.gap-2.flex-wrap.items-center,
  .user-billing-panel .flex.gap-2.flex-wrap.mt-3,
  .user-settings-page .user-settings-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: .65rem;
  }
  .user-batch-page .card .flex.gap-2.mt-3.flex-wrap .btn,
  .user-hub3-page .flex.gap-2.flex-wrap.items-center .btn,
  .user-billing-panel .flex.gap-2.flex-wrap.mt-3 .btn,
  .user-settings-page .user-settings-actions .btn,
  .user-billing-panel .btn.btn-full,
  .user-billing-panel .btn {
    width: 100%;
    justify-content: center;
  }
  .user-hub3-page .hub3-info-grid,
  .user-hub3-page .hub3-detail-grid,
  .user-hub3-page .hub3-payer-grid {
    gap: .75rem;
  }
  .user-hub3-page #hub3-res .btn,
  .user-batch-page #batch-res .btn {
    min-height: 42px;
  }

  .user-billing-panel #user-billing-active,
  .user-billing-panel .user-billing-methods-grid,
  .user-billing-panel #user-billing-plans,
  .user-billing-panel .grid-2.mb-4,
  .user-billing-panel .grid-4.mb-3 {
    grid-template-columns: 1fr !important;
  }
  .user-billing-panel .user-billing-transaction-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: .4rem;
  }
  .user-billing-panel .user-billing-limit-value {
    font-size: 1.05rem;
  }

  .user-settings-page .panel-field-wrap {
    width: 100%;
  }
  .user-settings-page .panel-field-input-right {
    width: 100%;
  }
  .user-settings-page label.flex.items-start.gap-2 {
    padding: .15rem 0;
  }
}

@media (max-width: 560px) {
  .panel-main-user .panel-content-user {
    padding-inline: .7rem;
  }
  .panel-main-user .mob-toggle {
    width: 40px;
    height: 40px;
  }
  .user-history-page .user-history-header-actions,
  .user-favorites-page .user-history-header-actions,
  .user-history-page .user-history-pager {
    grid-template-columns: 1fr;
  }
  .user-batch-page .grid-4,
  .user-hub3-page .grid-4,
  .user-billing-panel .grid-4,
  .user-billing-panel .grid-2,
  .user-batch-page .grid-2,
  .user-settings-page .grid-2 {
    grid-template-columns: 1fr !important;
  }
  .user-batch-page .badge,
  .user-hub3-page .badge,
  .user-billing-panel .badge {
    white-space: normal;
    text-align: center;
  }
}

/* Admin panel small-screen cleanup */
@media (max-width: 760px) {
  .panel-main-admin .panel-content-admin {
    padding: .8rem .8rem calc(1rem + env(safe-area-inset-bottom));
  }
  .panel-main-admin .card {
    padding: 1rem;
    border-radius: 18px;
  }
}


/* User panel mobile app-style navigation */
.panel-mobile-close {
  display: none;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(54,81,118,.7);
  background: rgba(255,255,255,.04);
  color: var(--text);
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
}
.user-mobile-tabbar {
  display: none;
}

@media (max-width: 760px) {
  .panel-wrap-user .sidebar-overlay {
    background: rgba(2,6,23,.72);
    backdrop-filter: blur(4px);
  }
  .panel-wrap-user .sidebar {
    width: min(88vw, 348px);
    max-width: 348px;
    box-shadow: 18px 0 48px rgba(0,0,0,.46);
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
  }
  .panel-wrap-user .sidebar-head {
    justify-content: space-between;
    align-items: center;
    padding: 1rem .95rem;
  }
  .panel-wrap-user .sidebar-brand {
    font-size: 1rem;
  }
  .panel-wrap-user .panel-mobile-close {
    display: inline-flex;
  }
  .panel-wrap-user .sidebar-nav {
    padding: .55rem .7rem .9rem;
  }
  .panel-wrap-user .nav-sec {
    padding: .8rem .45rem .35rem;
  }
  .panel-wrap-user .nav-item,
  .panel-wrap-user .panel-sidebar-action,
  .panel-wrap-user .panel-sidebar-link {
    min-height: 46px;
    padding: .78rem .9rem;
    font-size: .92rem;
    border-radius: 14px;
  }
  .panel-wrap-user .sidebar-foot {
    padding: .8rem .75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: .75rem;
  }

  .panel-main-user .panel-topbar {
    grid-template-columns: auto minmax(0,1fr) auto;
    padding: .8rem .9rem;
    min-height: 62px;
    height: auto;
    row-gap: 0;
  }
  .panel-main-user .panel-topbar-title {
    font-size: 1rem;
    line-height: 1.25;
  }
  .panel-main-user .panel-topbar-meta {
    grid-column: auto;
    width: auto;
    overflow: visible;
    justify-content: flex-end;
    align-items: center;
    padding-bottom: 0;
  }
  .panel-main-user .panel-topbar-btn-history-back,
  .panel-main-user .panel-topbar-btn-history-forward,
  .panel-main-user .panel-topbar-btn-search,
  .panel-main-user .panel-topbar-btn-copy,
  .panel-main-user .panel-topbar-btn-recent {
    display: none;
  }
  .panel-main-user .panel-topbar-meta > * {
    flex: 0 0 auto;
  }
  .panel-main-user .panel-topbar-avatar {
    width: 38px;
    height: 38px;
  }
  .panel-main-user .panel-topbar-usage {
    padding: .35rem .6rem;
    font-size: .72rem;
  }
  .panel-main-user .panel-content-user {
    padding-bottom: calc(5.9rem + env(safe-area-inset-bottom));
  }

  .user-mobile-tabbar {
    position: sticky;
    bottom: 0;
    z-index: 65;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .45rem;
    padding: .7rem .75rem calc(.75rem + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(54,81,118,.65);
    background: linear-gradient(180deg, rgba(11,17,32,.88), rgba(11,17,32,.97));
    backdrop-filter: blur(16px);
  }
  .user-mobile-tab {
    min-width: 0;
    min-height: 54px;
    border: 1px solid rgba(54,81,118,.58);
    border-radius: 16px;
    background: rgba(255,255,255,.035);
    color: var(--text-2);
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .28rem;
    padding: .45rem .3rem;
    font-size: .68rem;
    font-weight: 700;
  }
  .user-mobile-tab svg {
    opacity: .9;
  }
  .user-mobile-tab.is-active {
    color: var(--primary-h);
    border-color: rgba(79,142,247,.75);
    background: rgba(79,142,247,.14);
    box-shadow: 0 0 0 1px rgba(79,142,247,.18) inset;
  }
  .user-mobile-tab-label {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
  }

  .user-overview-page h2 {
    font-size: 1.4rem !important;
  }
  .user-overview-stats {
    gap: .7rem !important;
  }
  .user-overview-stats .card {
    padding: .95rem;
  }
  .user-overview-recent-row {
    padding-block: .7rem !important;
  }
  .user-overview-recent-row .text-xs.text-muted.mt-1 {
    line-height: 1.55;
  }
  .user-overview-recent-row > .flex-shrink-0 {
    width: 100%;
  }

  .user-query-card textarea.input {
    min-height: 170px;
    font-size: 1rem;
    line-height: 1.55;
  }
  .user-query-card #upit-btn {
    min-height: 52px;
    font-size: .98rem;
  }
}

@media (max-width: 560px) {
  .panel-wrap-user .sidebar {
    width: 100vw;
    max-width: 100vw;
  }
  .panel-main-user .panel-topbar-title {
    font-size: .94rem;
  }
  .panel-main-user .panel-topbar-usage {
    display: none;
  }
  .user-mobile-tabbar {
    gap: .35rem;
    padding-inline: .55rem;
  }
  .user-mobile-tab {
    border-radius: 14px;
    min-height: 52px;
    font-size: .64rem;
  }
}


/* User/admin panel mobile deep polish (r18) */
.user-api-keys-page,
.user-support-page,
.user-invoices-panel,
.user-team-panel,
.admin-api-keys-page,
.admin-invoices-panel {
  min-width: 0;
}
.user-api-keys-page .panel-code-block,
.admin-api-keys-page .panel-code-block {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.user-api-keys-page .panel-code-inline,
.admin-api-keys-page .panel-code-inline {
  white-space: nowrap;
}

@media (max-width: 760px) {
  .user-api-keys-page > .flex.items-center.justify-between,
  .user-api-keys-page .user-api-keys-header,
  .user-support-page .user-support-header,
  .user-team-panel .user-team-header,
  .user-invoices-panel > .flex.items-center.justify-between {
    align-items: flex-start !important;
    gap: .85rem !important;
  }
  .user-api-keys-page .user-api-keys-header .btn,
  .user-support-page .user-support-header .btn {
    width: 100%;
    justify-content: center;
  }
  .user-api-keys-page .user-api-keys-create-grid,
  .user-team-panel .user-team-create-grid,
  .user-support-page .user-support-layout,
  .user-support-page #user-support-new-message .grid-2,
  .user-support-page #user-support-inbox .grid-2,
  .user-invoices-panel .user-invoices-filters,
  .user-invoices-panel .user-invoices-stats {
    grid-template-columns: 1fr !important;
    gap: .75rem !important;
  }
  .user-api-keys-page .user-api-keys-create-actions .btn,
  .user-team-panel .user-team-create-actions .btn,
  .user-invoices-panel .user-invoices-header-actions .btn,
  .user-invoices-panel .user-invoice-row-actions .btn,
  .user-support-page #user-support-inbox .flex.gap-2.flex-wrap.mt-3 .btn,
  .user-support-page #user-support-thread-detail .btn,
  .user-support-page #user-support-new-message .btn,
  .admin-api-keys-page .admin-api-keys-create-actions .btn,
  .admin-api-keys-page .admin-api-keys-row-actions .btn {
    width: 100%;
    justify-content: center;
  }
  .user-api-keys-page #user-api-keys-create-form,
  .user-support-page #user-support-new-message,
  .user-support-page #user-support-inbox,
  .user-support-page #user-support-thread-detail > .card,
  .user-invoices-panel #user-invoice-preview,
  .user-team-panel .card,
  .admin-api-keys-page #admin-api-keys-create-form,
  .admin-invoices-panel .card {
    border-radius: 18px;
  }
  .user-support-page #user-support-thread-detail .card.card-primary {
    background: linear-gradient(180deg, rgba(79,142,247,.12), rgba(79,142,247,.08));
  }
  .user-support-page .support-attachment-thumb img {
    max-width: 100% !important;
    width: 100%;
    max-height: 220px !important;
  }
  .user-support-page .user-support-thread-wrap {
    position: relative;
  }
  .user-support-page .user-support-filter-card {
    padding: .85rem !important;
  }
  .user-support-page #user-support-thread-detail {
    display: grid;
    gap: .85rem;
  }
  .user-invoices-panel .user-invoices-header-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .55rem;
    align-items: stretch;
  }
  .user-invoices-panel .user-invoice-row-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: .45rem;
    justify-content: stretch;
  }
  .user-invoices-panel #user-invoice-preview iframe {
    min-height: 62vh !important;
  }
  .user-team-panel .user-team-summary-grid,
  .admin-api-keys-page .admin-api-keys-create-grid {
    grid-template-columns: 1fr !important;
    gap: .75rem !important;
  }
  .user-api-keys-page .user-api-keys-create-actions,
  .user-team-panel .user-team-create-actions,
  .admin-api-keys-page .admin-api-keys-create-actions,
  .admin-api-keys-page .admin-api-keys-row-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .45rem;
  }
  .admin-invoices-panel .grid-2,
  .admin-invoices-panel .grid-3 {
    grid-template-columns: 1fr !important;
    gap: .75rem !important;
  }
}

@media (max-width: 560px) {
  .user-api-keys-page .user-api-keys-create-actions,
  .user-team-panel .user-team-create-actions,
  .user-invoices-panel .user-invoices-header-actions,
  .admin-api-keys-page .admin-api-keys-create-actions,
  .admin-api-keys-page .admin-api-keys-row-actions {
    grid-template-columns: 1fr !important;
  }
  .user-invoices-panel #user-invoice-preview {
    padding: .9rem;
  }
  .user-invoices-panel #user-invoice-preview iframe {
    min-height: 56vh !important;
    border-radius: 12px !important;
  }
  .user-support-page #user-support-thread-detail .card,
  .user-support-page #user-support-inbox,
  .user-support-page #user-support-new-message,
  .user-api-keys-page .card,
  .user-team-panel .card,
  .user-invoices-panel .card,
  .admin-api-keys-page .card,
  .admin-invoices-panel .card {
    padding: .9rem;
  }
}


/* Broad user/admin panel refinement (r20) */
.panel-topbar-compact .panel-topbar-meta {
  gap: .5rem;
}

@media (max-width: 760px) {
  .panel-main-user .panel-content-user {
    padding: .85rem .85rem calc(6.15rem + env(safe-area-inset-bottom));
  }
  .user-overview-page,
  .user-query-page,
  .user-history-page,
  .user-batch-page,
  .user-hub3-page,
  .user-billing-panel,
  .user-api-keys-page,
  .user-support-page,
  .user-team-panel,
  .user-invoices-panel {
    max-width: none !important;
    width: 100%;
  }
  .user-overview-page .user-overview-hero,
  .user-query-page .user-query-meta,
  .user-history-page .user-history-header,
  .user-history-page .user-history-header-actions,
  .user-batch-page > .flex.items-center.justify-between,
  .user-hub3-page > .flex.items-center.justify-between,
  .user-billing-panel > .flex.items-center.justify-between {
    align-items: flex-start !important;
    gap: .85rem !important;
  }
  .user-overview-page .user-overview-hero-actions,
  .user-history-page .user-history-header-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .55rem;
  }
  .user-overview-page .user-overview-hero-actions .btn,
  .user-history-page .user-history-header-actions .btn,
  .user-batch-page [data-action="batch-download-template"],
  .user-batch-page [data-action="batch-preview-current"] {
    width: 100%;
    justify-content: center;
  }
  .user-overview-page .user-overview-stats,
  .user-overview-page .user-overview-shortcuts-grid,
  .user-batch-page > .grid-4,
  .user-billing-panel .grid-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .7rem !important;
  }
  .user-overview-page .user-overview-main,
  .user-batch-page > .grid-2,
  .user-billing-panel .grid-2,
  .user-hub3-page .grid-2,
  .user-support-page .grid-2,
  .user-team-panel .grid-2,
  .user-team-panel .grid-3,
  .user-history-page .grid-2,
  .user-history-page .grid-3,
  .user-billing-panel .grid-3,
  .user-billing-panel .user-billing-methods-grid {
    grid-template-columns: 1fr !important;
    gap: .85rem !important;
  }
  .user-overview-page .user-overview-recent-row {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: .45rem;
    align-items: start !important;
  }
  .user-overview-page .user-overview-recent-row > .flex-shrink-0 {
    width: 100%;
    justify-content: space-between;
  }
  .user-overview-page .user-quick-classify-form {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto;
    gap: .55rem;
    align-items: stretch;
  }
  .user-overview-page .user-quick-example-list,
  .user-query-page .user-query-examples {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
  }
  .user-overview-page .user-quick-example-list .btn,
  .user-query-page .user-query-examples .btn {
    min-height: 42px;
    justify-content: flex-start;
    white-space: normal;
    text-align: left;
  }
  .user-query-page .user-query-card,
  .user-batch-page .card,
  .user-billing-panel .card,
  .user-hub3-page .card,
  .user-history-page .card,
  .user-api-keys-page .card,
  .user-support-page .card,
  .user-team-panel .card,
  .user-invoices-panel .card,
  .admin-invoices-panel .card,
  .admin-api-keys-page .card,
  .admin-content-page .card {
    border-radius: 18px;
  }
  .user-query-page .user-query-card textarea.input {
    min-height: 180px;
  }
  .user-history-page .table-wrap td,
  .user-history-page .table-wrap th,
  .user-invoices-panel .table-wrap td,
  .user-invoices-panel .table-wrap th,
  .user-batch-page .table-wrap td,
  .user-batch-page .table-wrap th {
    vertical-align: top;
  }
  .user-history-page .truncate,
  .user-invoices-panel .truncate,
  .user-batch-page .truncate {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;
  }
  .user-billing-panel .user-billing-transaction-row,
  .user-billing-panel .user-billing-history-row {
    align-items: flex-start !important;
  }
  .user-billing-panel .user-billing-transactions-list,
  .user-batch-page #batch-res,
  .user-hub3-page #hub3-result,
  .user-support-page #user-support-thread-detail,
  .user-support-page #user-support-inbox {
    min-width: 0;
  }
  .admin-panel .card,
  .panel-main-admin .card {
    min-width: 0;
  }
}

@media (max-width: 560px) {
  .panel-main-user .panel-content-user {
    padding-inline: .7rem;
  }
  .user-overview-page .user-overview-stats,
  .user-overview-page .user-overview-shortcuts-grid,
  .user-batch-page > .grid-4,
  .user-billing-panel .grid-4,
  .user-overview-page .user-overview-hero-actions,
  .user-history-page .user-history-header-actions,
  .user-overview-page .user-quick-example-list,
  .user-query-page .user-query-examples {
    grid-template-columns: 1fr !important;
  }
  .user-overview-page .user-quick-classify-form {
    grid-template-columns: 1fr;
  }
  .user-overview-page .user-overview-hero-actions .btn,
  .user-query-page .user-query-card #upit-btn {
    min-height: 48px;
  }
}


body.public-site .grid-2 > *,
body.public-site .grid-3 > *,
body.public-site .grid-4 > *,
body.public-site .feature-row > *,
body.public-site .public-card-grid > * {
  min-width: 0;
}

body.public-site .public-example-layout,
body.public-site .pricing-grid,
body.public-site .blog-card-grid,
body.public-site .footer-grid {
  align-items: start;
}

body.public-site .price-card,
body.public-site .blog-list-card,
body.public-site .public-panel-card,
body.public-site .public-panel-card-alt {
  min-width: 0;
  overflow: hidden;
}

body.page-entrepreneurs .feature-row,
body.page-entrepreneurs .feature-row > *,
body.page-entrepreneurs .public-panel-card-alt,
body.page-entrepreneurs .entrepreneurs-visual-card {
  content-visibility: visible;
  contain-intrinsic-size: auto;
}

body.page-entrepreneurs .entrepreneurs-feature-row {
  gap: 2.25rem;
  align-items: start;
}

body.page-entrepreneurs .entrepreneurs-visual-card {
  height: 100%;
}

body.page-entrepreneurs .entrepreneurs-benefits-grid {
  gap: 2rem;
}


.public-hero-kicker { font-size:.84rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--text-3); margin-bottom:.85rem; }
.public-hero-number { font-size:clamp(3rem,8vw,5rem); line-height:1; font-weight:900; color:var(--danger); }
.public-status-text,
.public-meta-label,
.cookie-status-text,
.public-list-check,
.public-release-marker {
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.01em;
}
.public-status-text.is-ok,
.public-meta-label.is-ok,
.cookie-status-text.is-ok,
.public-list-check { color:var(--success); }
.public-status-text.is-live,
.public-meta-label.is-live,
.cookie-status-text.is-live { color:var(--primary); }
.public-status-text.is-muted,
.public-meta-label.is-muted,
.cookie-status-text.is-muted { color:var(--text-3); }
.public-release-marker { position:absolute; left:-4rem; top:.15rem; font-size:.9rem; color:var(--primary); font-weight:800; }
@media(max-width:980px){ .public-release-marker { position:static; margin-bottom:.85rem; } }

/* ── R20 mobile polish + consent-mode UX ───────────────── */
.mobile-menu .nav-link {
  min-height: 46px;
  display: flex;
  align-items: center;
}
.mobile-menu #mobile-nav-auth {
  gap: .75rem;
}
.mobile-menu #mobile-nav-auth .btn,
.mobile-menu #mobile-nav-auth .nav-link {
  min-height: 46px;
}

@media (max-width: 760px) {
  .cookie-banner {
    padding: .95rem 1rem calc(.95rem + env(safe-area-inset-bottom));
    align-items: stretch;
  }
  .cookie-banner p {
    max-width: none;
    width: 100%;
    text-align: left;
  }
  .cookie-banner .btn {
    flex: 1 1 calc(50% - .5rem);
    justify-content: center;
    min-height: 44px;
  }

  body.public-site .public-hero-actions,
  body.public-site .public-hero-actions-band,
  body.public-site .public-cta-actions,
  body.public-site .public-actions-row,
  body.public-site .public-search-row,
  body.public-site .public-inline-form {
    flex-direction: column;
    align-items: stretch;
  }
  body.public-site .public-hero-actions .btn,
  body.public-site .public-hero-actions-band .btn,
  body.public-site .public-cta-actions .btn,
  body.public-site .public-actions-row .btn,
  body.public-site .public-search-row .btn,
  body.public-site .public-inline-form .btn {
    width: 100%;
    justify-content: center;
  }
  body.public-site .public-search-row > .input,
  body.public-site .public-search-row > .input.input-lg,
  body.public-site .public-inline-form > .input {
    width: 100%;
  }
  body.public-site .public-contact-layout,
  body.public-site .public-examples-layout,
  body.public-site .api-contract-grid,
  body.public-site .blog-nav-grid,
  body.public-site .public-card-grid-2,
  body.public-site .public-split-top,
  body.page-entrepreneurs .entrepreneurs-benefits-grid {
    grid-template-columns: 1fr !important;
  }
  body.public-site .pricing-grid,
  body.public-site .public-example-layout {
    gap: .9rem;
  }
  body.public-site .price-card-number {
    font-size: 1.75rem;
  }
  body.public-site .public-panel-card,
  body.public-site .public-panel-card-alt,
  body.public-site .price-card,
  body.public-site .public-form-card {
    border-radius: 18px;
  }
  body.public-site .public-badge-row {
    gap: .5rem;
  }
  body.public-site .public-badge-row .btn {
    flex: 1 1 calc(50% - .25rem);
    justify-content: center;
  }

  .panel-wrap-admin .sidebar-overlay {
    background: rgba(2,6,23,.72);
    backdrop-filter: blur(4px);
  }
  .panel-wrap-admin .sidebar {
    width: min(90vw, 360px);
    max-width: 360px;
    box-shadow: 18px 0 48px rgba(0,0,0,.46);
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
  }
  .panel-wrap-admin .sidebar-head {
    justify-content: space-between;
    align-items: center;
    padding: 1rem .95rem;
  }
  .panel-wrap-admin .sidebar-brand {
    font-size: 1rem;
  }
  .panel-wrap-admin .panel-mobile-close {
    display: inline-flex;
  }
  .panel-wrap-admin .sidebar-nav {
    padding: .55rem .7rem .9rem;
  }
  .panel-wrap-admin .nav-sec {
    padding: .8rem .45rem .35rem;
  }
  .panel-wrap-admin .nav-item,
  .panel-wrap-admin .panel-sidebar-action,
  .panel-wrap-admin .panel-sidebar-link {
    min-height: 46px;
    padding: .78rem .9rem;
    font-size: .92rem;
    border-radius: 14px;
  }
  .panel-wrap-admin .sidebar-foot {
    padding: .8rem .75rem 1rem;
  }
  .panel-main-admin .panel-topbar {
    grid-template-columns: auto minmax(0,1fr) auto;
    padding: .8rem .9rem;
    min-height: 62px;
    height: auto;
    row-gap: 0;
  }
  .panel-main-admin .panel-topbar-meta {
    grid-column: auto;
    width: auto;
    overflow: visible;
    justify-content: flex-end;
    align-items: center;
    padding-bottom: 0;
  }
  .panel-main-admin .panel-topbar-meta > * {
    flex: 0 0 auto;
  }
  .panel-main-admin .panel-topbar-btn-history-back,
  .panel-main-admin .panel-topbar-btn-history-forward,
  .panel-main-admin .panel-topbar-btn-search,
  .panel-main-admin .panel-topbar-btn-copy,
  .panel-main-admin .panel-topbar-btn-recent {
    display: none;
  }
  .panel-main-admin .panel-topbar-avatar {
    width: 38px;
    height: 38px;
  }
  .panel-main-admin .panel-content-admin {
    padding: .8rem .8rem calc(1rem + env(safe-area-inset-bottom));
  }
  .panel-main-admin .card,
  .panel-main-admin .table-wrap,
  .panel-main-admin .result-box {
    max-width: 100%;
  }
}

@media (max-width: 560px) {
  .cookie-banner .btn {
    flex-basis: 100%;
  }
  body.public-site .public-badge-row .btn {
    flex-basis: 100%;
  }
  .panel-wrap-admin .sidebar {
    width: 100vw;
    max-width: 100vw;
  }
  .panel-main-admin .panel-topbar-badge {
    display: none;
  }
}


/* PWA install affordance */
.nav-utilities {
  display: flex;
  align-items: center;
  gap: .5rem;
}
.mobile-nav-utilities {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  margin-top: .85rem;
}
.install-app-btn {
  display: none;
  align-items: center;
  justify-content: center;
  gap: .45rem;
}
.install-app-btn.is-visible {
  display: inline-flex;
}
.mobile-nav-utilities .install-app-btn.is-visible {
  display: inline-flex;
  width: 100%;
}
.panel-install-trigger {
  display: none;
  align-items: center;
  gap: .4rem;
  white-space: nowrap;
}
.panel-install-trigger.is-visible {
  display: inline-flex;
}
@media (max-width: 1240px) {
  .nav-utilities {
    display: none;
  }
}
@media (max-width: 760px) {
  .panel-install-trigger .label {
    display: none;
  }
}