:root {
  color-scheme: light;
  --bg: #edf2ef;
  --panel: #ffffff;
  --panel-2: #f7faf8;
  --panel-3: #f1f5f2;
  --line: #d8e1dc;
  --line-strong: #bdcbc3;
  --text: #17231f;
  --muted: #61716a;
  --faint: #87938d;
  --green: #176047;
  --cyan: #167b80;
  --amber: #c76535;
  --rose: #bb4f58;
  --purple: #6558a6;
  --shadow: 0 22px 55px rgba(32, 57, 47, .10);
}

body {
  color: var(--text) !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(23, 96, 71, .08), transparent 32%),
    radial-gradient(circle at 92% 8%, rgba(220, 107, 55, .08), transparent 27%),
    linear-gradient(rgba(23, 96, 71, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23, 96, 71, .035) 1px, transparent 1px),
    var(--bg) !important;
  background-size: auto, auto, 42px 42px, 42px 42px, auto !important;
}

body::before {
  background: linear-gradient(180deg, rgba(255,255,255,.48), transparent 25%) !important;
}

.subpage-topbar,
.topbar {
  padding: 9px 10px;
  border: 1px solid rgba(189,203,195,.82);
  border-radius: 14px 4px 14px 4px;
  background: rgba(255,255,255,.74);
  box-shadow: 0 8px 24px rgba(32,57,47,.06);
  backdrop-filter: blur(14px);
}

.subpage-mark,
.mark {
  border: 0 !important;
  border-radius: 10px 3px 10px 3px !important;
  color: #fff !important;
  background: var(--green) !important;
  box-shadow: inset 0 -8px 18px rgba(0,0,0,.10);
}

.subpage-home,
.back,
.back-link,
.top-actions .btn {
  border-color: var(--line) !important;
  background: #fff !important;
  color: var(--green) !important;
}

.subpage-home:hover,
.back:hover,
.back-link:hover,
.top-actions .btn:hover {
  border-color: var(--green) !important;
  background: #f3f8f5 !important;
}

.hero,
.header,
.frame {
  border-color: var(--line-strong) !important;
  border-radius: 20px 5px 20px 5px !important;
  background:
    linear-gradient(132deg, rgba(23,96,71,.075), transparent 43%),
    linear-gradient(310deg, rgba(220,107,55,.065), transparent 40%),
    #fff !important;
  box-shadow: var(--shadow) !important;
}

.panel,
.card,
.section-card,
.result-box,
.api-info,
.project,
.editor-card {
  border-color: var(--line) !important;
  border-radius: 16px 4px 16px 4px !important;
  background: rgba(255,255,255,.94) !important;
  box-shadow: 0 10px 30px rgba(32,57,47,.055) !important;
}

h1, h2, h3, .panel-title, .brand-title, .project-title { color: var(--text) !important; }
.subtitle, .panel-subtitle, .muted, .sub, .footer, .project-meta { color: var(--muted) !important; }

.badge,
.tag,
.status-chip,
.real-badge,
.success-badge,
.view-toggle {
  border-color: rgba(23,96,71,.20) !important;
  border-radius: 999px !important;
  background: #eaf3ee !important;
  color: var(--green) !important;
}

textarea,
input,
select,
.password-input {
  border-color: var(--line) !important;
  border-radius: 10px !important;
  background: #fbfdfc !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 2px rgba(32,57,47,.035) !important;
}

textarea:focus,
input:focus,
select:focus {
  border-color: var(--green) !important;
  box-shadow: 0 0 0 3px rgba(23,96,71,.10) !important;
}

button,
.btn {
  border-color: rgba(23,96,71,.24) !important;
  border-radius: 10px 3px 10px 3px !important;
  background: #edf5f1 !important;
  color: var(--green) !important;
}

button:hover,
.btn:hover {
  border-color: rgba(23,96,71,.48) !important;
  background: #e4f0e9 !important;
}

button.secondary,
.btn.secondary {
  border-color: var(--line) !important;
  background: #fff !important;
  color: var(--muted) !important;
}

.warning,
.notice {
  border-color: rgba(199,101,53,.28) !important;
  background: #fff5ee !important;
  color: #845238 !important;
}

pre,
code,
.debug,
.response-view {
  border-color: var(--line) !important;
  background: #f4f7f5 !important;
  color: #41534b !important;
}

/* Text diff: keep the editor itself dark for long coding sessions. */
.diff-shell { --tool-accent: #167b80; }
.diff-shell .subpage-mark { background: var(--tool-accent) !important; }
.diff-shell .diff-header { padding: 13px 4px 8px; }
.diff-shell .diff-header h1 { color: #183b39 !important; }
.diff-shell .toolbar {
  border-color: var(--line) !important;
  border-radius: 16px 4px 16px 4px !important;
  background: rgba(255,255,255,.92) !important;
  box-shadow: 0 10px 28px rgba(32,57,47,.055);
}
.diff-shell .toolbar-group { border-color: var(--line) !important; }
.diff-shell .editor-card { background: #101713 !important; }
.diff-shell .editor-top,
.diff-shell .statusbar {
  border-color: #2f4038 !important;
  background: #16221d !important;
  color: #9fb0a8 !important;
}
.diff-shell .editor-caption { color: #d5e0da !important; }
.diff-shell .statusbar strong { color: #79c9b8 !important; }
.diff-shell .toast { background: #173128 !important; color: #fff !important; }

/* Analyzer: a warmer editorial accent distinguishes it from system tools. */
.container .hero .badge { background: #f9ecec !important; color: #a5444d !important; border-color: rgba(187,79,88,.22) !important; }
.container .hero { border-top: 4px solid #bb4f58 !important; }
.container .main-section .panel:first-child { border-top: 3px solid #bb4f58 !important; }
.container .actions-row .btn:not(.secondary) { background: #bb4f58 !important; color: #fff !important; border-color: #bb4f58 !important; }

/* Server monitor: dense data stays highly readable without terminal-black panels. */
.shell { width: min(1240px, calc(100% - 32px)) !important; }
.shell .topbar { margin-bottom: 16px; }
.shell .frame { overflow: hidden; }
.shell .frame-bar { border-color: var(--line) !important; background: #f3f6f4 !important; }
.shell .toolbar { border-color: var(--line) !important; background: linear-gradient(110deg,#f7fbf8,#fff6ef) !important; }
.shell .content { background: rgba(247,250,248,.72); }
.shell .card { border-top: 3px solid var(--green) !important; }
.shell .card:nth-child(2) { border-top-color: var(--cyan) !important; }
.shell .card:nth-child(3) { border-top-color: var(--amber) !important; }
.shell .card:nth-child(4) { border-top-color: #6558a6 !important; }
.shell .bar,
.shell canvas { border-color: var(--line) !important; background: #f2f6f3 !important; }
.shell .checks,
.shell .services,
.shell .info-list { border-color: var(--line) !important; background: var(--line) !important; }
.shell .check,
.shell .info-item,
.shell .project-head { background: #f6f9f7 !important; }
.shell th { background: #f2f6f3 !important; color: var(--faint) !important; }
.shell td,
.shell th { border-color: var(--line) !important; }
.shell td { color: var(--muted) !important; }
.shell td:first-child { color: var(--text) !important; }
.shell .alert { background: #f5f8f6 !important; }
.shell .login-layer { background: rgba(31,48,41,.42) !important; }
.shell .login-box,
.login-box { border-color: var(--line-strong) !important; border-radius: 18px 5px 18px 5px !important; background: #fff !important; }

@media (max-width: 720px) {
  .subpage-topbar,
  .topbar { padding: 10px; }
  .diff-shell .toolbar { gap: 10px; }
  .shell { width: min(100% - 18px, 1240px) !important; }
  .shell .content { padding: 10px !important; }
}