/* WWR Style System v1: shared UI primitives */
.wwr-card {
  position: relative;
  background: var(--wwr-surface-1);
  border: 1px solid var(--wwr-border-subtle);
  border-radius: var(--wwr-radius-card);
  box-shadow: var(--wwr-shadow-card);
  width: 100%;
  max-width: 100%;
}

.wwr-panel {
  position: relative;
  background: var(--wwr-surface-1);
  border: 1px solid var(--wwr-border-subtle);
  border-radius: var(--wwr-radius-card);
  box-shadow: var(--wwr-shadow-card);
  width: 100%;
  max-width: 100%;
}

.wwr-page-shell {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 1.25rem;
}

.wwr-card h1,
.wwr-card h2,
.wwr-card h3,
.wwr-panel h1,
.wwr-panel h2,
.wwr-panel h3 {
  margin: 0 0 0.5rem;
}

.wwr-panel--narrow {
  max-width: min(var(--wwr-panel-narrow-max, 760px), 100%);
  margin-left: auto;
  margin-right: auto;
}

.wwr-panel--legal {
  max-width: min(var(--wwr-panel-legal-max, 900px), 100%);
  margin-left: auto;
  margin-right: auto;
}

body[data-page="login"] .message {
  border: 1px solid var(--wwr-border-subtle);
  border-radius: 12px;
  background: rgba(var(--wwr-bg-primary-rgb), 0.6);
}

body[data-page="login"] .message.success {
  background: rgba(78, 120, 111, 0.08);
  border-color: rgba(78, 120, 111, 0.3);
  color: #4e786f;
}

body[data-page="login"] .message.error {
  background: rgba(248, 113, 113, 0.08);
  border-color: rgba(248, 113, 113, 0.3);
  color: #f87171;
}

body[data-page="login"] .login-link-btn {
  background: transparent;
  border: none;
}

body[data-page="whats-new"] .update-date,
body[data-page="whats-new"] .update-version {
  background: rgba(var(--brand-primary-rgb), 0.08);
  border-radius: 8px;
  border: 1px solid var(--border-subtle);
}

body[data-page="internal"] .internal-badge,
body[data-page="internal-beta"] .internal-badge {
  background: var(--danger);
  border-radius: 6px;
}

body[data-page="internal"] thead th,
body[data-page="internal-beta"] thead th {
  border-bottom: 1px solid var(--border);
}

body[data-page="internal"] tbody td,
body[data-page="internal-beta"] tbody td {
  border-bottom: 1px solid rgba(var(--wwr-text-primary-rgb), 0.05);
}

body[data-page="internal"] tbody tr.top-tier,
body[data-page="internal-beta"] tbody tr.top-tier {
  background: rgba(var(--wwr-accent-primary-rgb), 0.12);
}

body[data-page="internal"] tbody tr:hover,
body[data-page="internal-beta"] tbody tr:hover {
  background: rgba(var(--wwr-text-primary-rgb), 0.03);
}

body[data-page="internal"] .badge,
body[data-page="internal-beta"] .badge {
  border-radius: 999px;
  border: 1px solid rgba(var(--wwr-text-primary-rgb), 0.15);
}

body[data-page="internal"] .priority-high,
body[data-page="internal-beta"] .priority-high {
  border-color: var(--danger);
}

@media (max-width: 900px) {
  body[data-page="internal"] tbody tr,
  body[data-page="internal-beta"] tbody tr {
    border: 1px solid var(--border);
    border-radius: 12px;
  }
}

@media (max-width: 600px) {
  .wwr-panel,
  .wwr-card {
    padding: clamp(1.25rem, 6vw, 1.75rem);
  }
}
