/* Light inner pages — wall + open (aligned with services palette) */
.page-wall,
.page-open {
  --bg: #f3f7fc;
  --bg-elev: #ffffff;
  --panel: #ffffff;
  --line: rgba(18, 70, 120, 0.12);
  --text: #0c1b2e;
  --muted: #5b7290;
  --accent: #1a8cff;
  --accent-2: #00b4d8;
  --warn: #c45a3a;
  --light-surface: #ffffff;
  --light-shadow: 0 18px 50px rgba(20, 70, 120, 0.08);
  --light-blue: #1a8cff;
  --light-mint: #00c2a0;
  color: var(--text);
  background:
    radial-gradient(1000px 520px at 8% -5%, rgba(26, 140, 255, 0.14), transparent 55%),
    radial-gradient(820px 480px at 96% 0%, rgba(0, 194, 160, 0.1), transparent 50%),
    radial-gradient(700px 420px at 70% 40%, rgba(255, 61, 122, 0.04), transparent 55%),
    linear-gradient(180deg, #f7fbff 0%, #f3f7fc 35%, #eef4fb 100%);
  min-height: 100vh;
}

.page-wall .topbar,
.page-open .topbar {
  background: rgba(255, 255, 255, 0.86);
  border-bottom-color: var(--line);
  color: var(--text);
  backdrop-filter: blur(12px);
}
.page-wall .topbar nav,
.page-open .topbar nav {
  color: var(--muted);
}
.page-wall .topbar nav a:hover,
.page-open .topbar nav a:hover {
  color: var(--light-blue);
}
.page-wall .topbar nav a.active,
.page-open .topbar nav a.active {
  color: rgba(26, 140, 255, 0.82);
  font-weight: 500;
}
.page-wall .topbar .menu-btn,
.page-open .topbar .menu-btn {
  border-color: var(--line);
  background: #fff;
}
.page-wall .topbar .menu-btn span,
.page-open .topbar .menu-btn span {
  background: var(--text);
}
@media (max-width: 860px) {
  .page-wall .topbar.open nav,
  .page-open .topbar.open nav {
    background: rgba(255, 255, 255, 0.98);
    border-bottom-color: var(--line);
  }
  .page-wall .topbar.open nav a,
  .page-open .topbar.open nav a {
    border-top-color: var(--line);
    color: var(--text);
  }
}

.page-wall .btn,
.page-open .btn {
  background: var(--light-blue);
  color: #fff;
  box-shadow: 0 10px 28px rgba(26, 140, 255, 0.22);
}
.page-wall .btn:hover,
.page-open .btn:hover {
  box-shadow: 0 14px 34px rgba(26, 140, 255, 0.3);
}
.page-wall .btn-ghost,
.page-open .btn-ghost {
  background: #fff;
  color: var(--text);
  border-color: var(--line);
  box-shadow: none;
}
.page-wall .btn-ghost:hover,
.page-open .btn-ghost:hover {
  border-color: var(--light-blue);
  color: var(--light-blue);
  box-shadow: none;
}

.page-wall .notice,
.page-open .notice {
  background: rgba(26, 140, 255, 0.06);
  border-color: rgba(26, 140, 255, 0.16);
  color: var(--muted);
}
.page-wall .open-notice,
.page-open .open-notice {
  background: linear-gradient(90deg, rgba(26, 140, 255, 0.07), rgba(255, 255, 255, 0.7));
  border-color: rgba(26, 140, 255, 0.16);
}

.page-wall .open-kicker,
.page-open .open-kicker {
  color: var(--light-blue);
  font-family: "JetBrains Mono", "Space Grotesk", ui-monospace, monospace;
  letter-spacing: 0.16em;
}

.page-wall .card,
.page-open .card {
  background: var(--light-surface);
  border-color: var(--line);
  box-shadow: var(--light-shadow);
}
.page-wall .card.soft-light::after,
.page-open .card.soft-light::after {
  background: radial-gradient(
    420px circle at var(--mx) var(--my),
    rgba(26, 140, 255, 0.1),
    transparent 42%
  );
}

.page-wall .chip,
.page-open .chip {
  background: rgba(255, 255, 255, 0.85);
  border-color: var(--line);
  color: var(--muted);
}
.page-wall .chip.on,
.page-open .chip.on,
.page-open .filter-row .chip.on {
  color: var(--light-blue);
  border-color: rgba(26, 140, 255, 0.35);
  background: rgba(26, 140, 255, 0.1);
}
.page-open .filter-row .chip:hover {
  color: var(--text);
  border-color: rgba(26, 140, 255, 0.35);
  background: rgba(26, 140, 255, 0.06);
}

.page-wall .form input,
.page-wall .form textarea,
.page-wall .form select,
.page-open .form input,
.page-open .form textarea,
.page-open .form select {
  background: #fff;
  border-color: var(--line);
  color: var(--text);
}
.page-wall .form input:focus,
.page-wall .form textarea:focus,
.page-wall .form select:focus {
  border-color: rgba(26, 140, 255, 0.55);
}

.page-wall .foot,
.page-open .foot {
  border-top-color: var(--line);
  color: var(--muted);
  background: rgba(255, 255, 255, 0.55);
}
.page-wall .foot a:hover,
.page-open .foot a:hover {
  color: var(--light-blue);
}
.page-wall .foot .warn,
.page-open .foot .warn {
  color: var(--warn);
}

/* —— open: project cards —— */
.page-open .project-card.tone-quant {
  border-left-color: var(--light-mint);
  background:
    linear-gradient(135deg, rgba(0, 194, 160, 0.06), transparent 42%),
    var(--light-surface);
}
.page-open .project-card.tone-auto {
  border-left-color: var(--light-blue);
  background:
    linear-gradient(135deg, rgba(26, 140, 255, 0.07), transparent 42%),
    var(--light-surface);
}
.page-open .project-card.is-open {
  box-shadow: 0 0 0 1px rgba(26, 140, 255, 0.22), var(--light-shadow);
}
.page-open .project-idx { color: var(--light-blue); }
.page-open .project-detail {
  border-color: var(--line);
  background: rgba(26, 140, 255, 0.04);
}
.page-open .project-detail p { color: var(--muted); }
.page-open .clone-block {
  border-color: var(--line);
  background: #f0f5fb;
}
.page-open .clone-cmd { color: #2a4a6a; }

/* —— wall specifics —— */
.page-wall .wall-fields dt { color: var(--light-blue); }
.page-wall .wall-hist-btn {
  background: #fff;
  border-color: var(--line);
  color: var(--text);
}
.page-wall .wall-hist-btn:hover {
  border-color: var(--light-blue);
  color: var(--light-blue);
}
.page-wall .wall-bid-meta {
  background: var(--light-surface);
  border-color: var(--line);
  box-shadow: var(--light-shadow);
}
@media (hover: hover) {
  .page-wall .card:hover,
  .page-open .project-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 22px 48px rgba(20, 70, 120, 0.11);
  }
}
.page-wall .card,
.page-open .project-card {
  transition: transform 0.35s var(--motion-ease, ease), box-shadow 0.35s ease;
}