:root {
  --ps-bg: #21120c;
  --ps-bg-deep: #160b07;
  --ps-surface: #342016;
  --ps-surface-2: #452c1e;
  --ps-cream: #fff2d7;
  --ps-cream-soft: #e5cba3;
  --ps-gold: #ffd47f;
  --ps-gold-deep: #d6a14b;
  --ps-line: #8f6d45;
  --ps-safe: #1f7a3d;
  --ps-safe-bg: #164b2b;
  --ps-mediocre: #d99a2b;
  --ps-mediocre-bg: #624016;
  --ps-avoid: #d44d3f;
  --ps-avoid-bg: #68251f;
  --ps-shadow: 0 18px 50px rgba(0,0,0,.28);
}

html { scroll-behavior: smooth; }
body {
  color: var(--ps-cream) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,212,127,.11), transparent 24rem),
    radial-gradient(circle at 90% 10%, rgba(143,109,69,.12), transparent 30rem),
    linear-gradient(180deg, #2b180f 0%, var(--ps-bg) 42%, var(--ps-bg-deep) 100%) !important;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

a { color: var(--ps-gold) !important; }

.ps-topbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
  padding:12px 16px;
  border:1px solid rgba(255,212,127,.24);
  border-radius:18px;
  background:rgba(33,18,12,.86);
  box-shadow:0 12px 34px rgba(0,0,0,.18);
  backdrop-filter:blur(14px);
}
.ps-brand { display:flex; align-items:center; gap:11px; min-width:max-content; color:var(--ps-cream)!important; font-weight:900; font-size:1.05rem; }
.ps-brand img { width:38px; height:38px; border-radius:10px; }
.ps-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:6px; }
.ps-nav a { color:var(--ps-cream)!important; font-weight:800; padding:9px 11px; border-radius:12px; }
.ps-nav a:hover { background:rgba(255,212,127,.12); }
.ps-nav .ps-store { border:1px solid rgba(255,212,127,.42); color:var(--ps-gold)!important; }

.hero-main, .hero-side, .search-shell, .map-card, .results-card, .hero, .panel, .sidebar-card, .card {
  background:rgba(52,32,22,.96)!important;
  color:var(--ps-cream)!important;
  border:1px solid rgba(255,212,127,.22)!important;
  box-shadow:var(--ps-shadow)!important;
  backdrop-filter:blur(12px);
}
.hero-main, .hero { position:relative; isolation:isolate; }
.hero-main::after, .hero::after {
  background:radial-gradient(circle, rgba(255,212,127,.16), transparent 68%)!important;
}

.ps-hero-brand { display:grid; grid-template-columns:minmax(0,1fr) 210px; align-items:center; gap:22px; }
.ps-hero-copy { min-width:0; }
.ps-surfer { width:min(100%, 210px); height:auto; display:block; margin:auto; filter:drop-shadow(0 15px 24px rgba(0,0,0,.35)); }

h1, h2, h3, strong, label { color:var(--ps-cream)!important; }
h1 { letter-spacing:-.035em; }
.tagline, .section-head p, .muted, .note, .meta, .results-summary, .search-status, .stat-label, .footer-note { color:var(--ps-cream-soft)!important; }
.eyebrow {
  background:rgba(255,212,127,.13)!important;
  color:var(--ps-gold)!important;
  border:1px solid rgba(255,212,127,.2);
}
.humor-box {
  background:linear-gradient(180deg, rgba(255,212,127,.1), rgba(255,255,255,.035))!important;
  border:1px solid rgba(255,212,127,.18)!important;
  color:var(--ps-cream-soft)!important;
}
.stat { background:rgba(33,18,12,.62)!important; border-color:rgba(255,212,127,.17)!important; }
.stat-value { color:var(--ps-gold)!important; }

.btn, button, input[type="submit"] { font-weight:900!important; }
.btn-primary, .search-grid button, form button[type="submit"] {
  background:var(--ps-gold)!important;
  color:#24130c!important;
  box-shadow:0 12px 24px rgba(214,161,75,.18)!important;
}
.btn-primary:hover, .search-grid button:hover, form button[type="submit"]:hover { background:#ffe09d!important; }
.btn-secondary { background:rgba(255,212,127,.08)!important; color:var(--ps-cream)!important; border:1px solid rgba(255,212,127,.28)!important; }

input, select, textarea {
  color:#2a1710!important;
  background:#fff7e8!important;
  border-color:#b79361!important;
}
input::placeholder, textarea::placeholder { color:#80664e!important; opacity:1; }
.method-toggle, .map-legend { background:rgba(22,11,7,.42)!important; border-color:rgba(255,212,127,.18)!important; }
.method-toggle label, .legend-item { color:var(--ps-cream-soft)!important; }

.content-grid .map-card { overflow:hidden; }
#map { border:1px solid rgba(255,212,127,.16); }

.result-item { background:rgba(22,11,7,.42)!important; border-color:rgba(255,212,127,.16)!important; }
.result-item:hover { border-color:rgba(255,212,127,.44)!important; transform:translateY(-1px); }
.result-name, .popup-title { color:var(--ps-cream)!important; }
.result-meta, .result-comment, .popup-meta, .popup-comment { color:var(--ps-cream-soft)!important; }
.badge-safe, .popup-badge-safe { background:rgba(31,122,61,.28)!important; color:#bcf0c8!important; }
.badge-mediocre, .popup-badge-mediocre { background:rgba(217,154,43,.22)!important; color:#ffe09d!important; }
.badge-avoid, .popup-badge-avoid { background:rgba(212,77,63,.22)!important; color:#ffc2ba!important; }

.sidebar-card { background:rgba(52,32,22,.96)!important; }
.pill { background:rgba(255,212,127,.1)!important; color:var(--ps-gold)!important; border-color:rgba(255,212,127,.2)!important; }
.alert-error { background:rgba(212,77,63,.14)!important; border-color:rgba(212,77,63,.35)!important; color:#ffd1cb!important; }
.alert-success { background:rgba(31,122,61,.16)!important; border-color:rgba(31,122,61,.4)!important; color:#c7f4d1!important; }

.ps-page-card { max-width:900px; margin:0 auto; }
.ps-page-card h1 { color:var(--ps-gold)!important; }
.ps-page-card h2 { color:var(--ps-gold)!important; }
.ps-page-lead { font-size:1.08rem; color:var(--ps-cream-soft); }
.ps-status-box { padding:14px 16px; border-radius:14px; background:rgba(255,212,127,.07); border:1px solid rgba(255,212,127,.18); }

.ps-footer {
  margin-top:28px;
  padding:22px 0 8px;
  text-align:center;
  color:var(--ps-cream-soft);
  font-size:.94rem;
}
.ps-footer-links { display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:8px; }
.ps-footer-links a { font-weight:800; }

@media (max-width: 900px) {
  .ps-topbar { align-items:flex-start; flex-direction:column; }
  .ps-nav { justify-content:flex-start; }
  .ps-hero-brand { grid-template-columns:1fr 145px; }
}
@media (max-width: 620px) {
  .ps-topbar { padding:10px 12px; border-radius:15px; }
  .ps-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; }
  .ps-nav a { text-align:center; border:1px solid rgba(255,212,127,.15); }
  .ps-hero-brand { grid-template-columns:1fr; text-align:left; }
  .ps-surfer { width:150px; margin:6px 0 0 auto; }
}

/* App-first homepage treatment */
.ps-app-callout {
  position: relative;
  margin-top: 22px;
  padding: 20px;
  border-radius: 18px;
  border: 1px solid rgba(255,212,127,.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(255,212,127,.14), transparent 15rem),
    rgba(22,11,7,.55);
  box-shadow: inset 0 1px rgba(255,255,255,.03);
}
.ps-app-kicker {
  color: var(--ps-gold);
  font-size: 1.06rem;
  font-weight: 950;
  letter-spacing: -.01em;
}
.ps-app-copy {
  max-width: 68ch;
  margin: 8px 0 16px;
  color: var(--ps-cream-soft);
  line-height: 1.58;
}
.ps-store-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: stretch;
}
.ps-store-button {
  min-width: 205px;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 10px 16px 11px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.2);
  background: #070707;
  color: #fff !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.28);
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.ps-store-button:hover {
  transform: translateY(-2px);
  border-color: rgba(255,212,127,.7);
  box-shadow: 0 14px 30px rgba(0,0,0,.35);
}
.ps-store-button small {
  display:block;
  color:#eee;
  font-size:.68rem;
  line-height:1;
  letter-spacing:.02em;
}
.ps-store-button strong {
  display:block;
  color:#fff!important;
  font-size:1.24rem;
  line-height:1.15;
  margin-top:3px;
  letter-spacing:-.025em;
}
.ps-store-symbol {
  display:grid;
  place-items:center;
  width:29px;
  height:29px;
  flex:0 0 29px;
  font-size:1.25rem;
  color:#fff;
}
.ps-play-symbol { font-size:1.15rem; }
.ps-platform-note {
  margin-top: 12px;
  color: var(--ps-cream-soft);
  font-size: .88rem;
}
.ps-web-actions { margin-top: 14px !important; }
.ps-web-actions .btn { font-size:.93rem; }

/* On phones, emphasize the store that belongs to the visitor's platform. */
.ps-device-ios .ps-store-ios,
.ps-device-android .ps-store-android {
  border-color: var(--ps-gold);
  box-shadow: 0 0 0 2px rgba(255,212,127,.12), 0 14px 30px rgba(0,0,0,.38);
}
.ps-device-ios .ps-store-android,
.ps-device-android .ps-store-ios { opacity:.72; }

@media (max-width: 620px) {
  .ps-app-callout { padding:16px; }
  .ps-store-buttons { display:grid; grid-template-columns:1fr; }
  .ps-store-button { width:100%; min-width:0; justify-content:flex-start; }
  .ps-device-ios .ps-store-ios { order:-1; }
  .ps-device-android .ps-store-android { order:-1; }
  .ps-web-actions { display:grid!important; grid-template-columns:1fr; }
  .ps-web-actions .btn { width:100%; }
}

/* Google Maps info-window contrast fix */
#map .popup-card {
  color: #2a1710 !important;
  background: #fffdf8 !important;
}
#map .popup-head {
  background: linear-gradient(180deg, #fff8e9 0%, #f7efe1 100%) !important;
  border-bottom-color: #dfcfb7 !important;
}
#map .popup-title {
  color: #2a1710 !important;
}
#map .popup-line {
  color: #5d4a3c !important;
}
#map .popup-comment {
  color: #3b291f !important;
}
#map .popup-footer,
#map .popup-rating {
  color: #2a1710 !important;
  font-weight: 700;
}
#map .popup-badge-safe {
  background: #d8f3df !important;
  color: #14532d !important;
}
#map .popup-badge-mediocre {
  background: #fff0c2 !important;
  color: #7c4700 !important;
}
#map .popup-badge-avoid {
  background: #ffe0dc !important;
  color: #8a2218 !important;
}