:root{
  --max-width: 800px;
  --pad: 15px;
  --link: #0060c0;
  --muted: #666;
  --card-bg: #fafafa;
  --card-border: #eee;
  --radius: 10px;
  --gap: 12px;
  --shadow: 0 4px 18px rgba(0,0,0,0.12);
  --focus: rgba(0,114,198,0.25);
  --accent-hover-bg: #f2faff;
}

/* Layout */
html,body{height:100%}
body{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  margin: 0 auto;
  padding: var(--pad);
  max-width: var(--max-width);
  line-height: 1.55;
  color: #222;
  background: #fff;
  -webkit-font-smoothing:antialiased;
}

/* Headings */
h1{font-size:1.8rem;margin:0 0 6px}
h2{margin-top:28px;font-size:1.35rem}
.section-title{margin-top:32px;margin-bottom:12px;font-size:1.35rem;font-weight:600;color:#333}

/* Links */
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
a:focus{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}

/* Utility */
.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;
}

/* Cards / widgets */
.card, .widget {
  background: var(--card-bg);
  padding: 12px;
  border-radius: var(--radius);
  border: 1px solid var(--card-border);
  margin-top: 18px;
  box-sizing: border-box;
}
.card--p{padding: 14px}

/* Breadcrumb */
.breadcrumb{
  font-size:.85rem;
  margin:10px 0 18px;
  color:var(--muted);
  display:flex;flex-wrap:wrap;gap:4px;
}
.breadcrumb a{color:var(--link)}
.breadcrumb .sep{color:#999}
.breadcrumb .current{font-weight:600;color:#222}

/* Place list / items */
.place-list{list-style:none;padding:0;margin:0;display:grid;gap:var(--gap)}
.place-item{
  background: #fff;
  border: 1px solid var(--card-border);
  padding: 12px 14px;
  border-radius: 12px;
  transition: transform .18s ease, background .12s ease, border-color .12s ease;
  display:flex;align-items:center;gap:12px;
  box-sizing:border-box;
}
.place-item:hover{
  background: var(--accent-hover-bg);
  border-color:#cde5ff;
  transform: translateY(-1px);
}
.place-icon{width:26px;height:26px;font-size:18px;display:flex;align-items:center;justify-content:center;color:var(--link)}
.place-info{flex:1;display:flex;flex-direction:column}
.place-info a{color:var(--link);font-weight:600;text-decoration:none;font-size:1rem}
.place-meta{font-size:.82rem;color:var(--muted);margin-top:3px}

/* Recent variant */
.recent .place-item{background:#fff;border-color:#eaeaea}
.recent .place-item:hover{background:#f9f9f9}

/* Search box */
.search-box{margin:15px 0 10px;position:relative}
.search-box input{
  width:100%;padding:12px 14px;font-size:16px;border:2px solid #ddd;border-radius:10px;outline:none;transition:.18s;
}
.search-box input:focus{border-color:var(--link);box-shadow:0 0 6px var(--focus)}
.search-results{
  position:absolute;top:105%;left:0;right:0;background:#fff;border:1px solid #ddd;border-radius:10px;
  max-height:320px;overflow-y:auto;box-shadow:0 4px 16px rgba(0,0,0,0.12);z-index:40;display:none;
}
.search-results.visible{display:block}
.search-results a{display:block;padding:10px 14px;color:#333;text-decoration:none;border-bottom:1px solid #f1f1f1}
.search-results a:hover,.search-results a.active{background:var(--link);color:#fff}
.search-results small{display:block;color:var(--muted)}

/* Map/picture */
.map-wrapper{max-width:340px;margin:18px auto 25px}
.map{width:100%;height:auto;border-radius:12px;display:block;box-shadow:var(--shadow)}
.img-responsive{max-width:100%;height:auto;border-radius:8px;display:block}

/* Misc */
.back-link{display:inline-block;margin-bottom:.6rem;font-size:.95rem}
.muted{color:var(--muted)}

/* Focus-visible improvement */
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}

/* Responsive */
@media (max-width: 480px){
  h1{font-size:1.55rem}
  h2{font-size:1.2rem}
  body{padding:14px}
  .map-wrapper{max-width:300px}
  .place-item{padding:10px 12px}
  .place-info a{font-size:.95rem}
}

/* Dark mode */
@media (prefers-color-scheme: dark){
  body{background:#0b0b0b;color:#e6e6e6}
  .card, .widget{background:#111;border-color:#222}
  a{color:#7fb6ff}
}