*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial,sans-serif;line-height:1.4;color:#222;background:#fafafa}
.topbar{display:flex;align-items:center;justify-content:center;padding:12px 16px;border-bottom:1px solid #eaeaea;background:#fff;position:sticky;top:0;z-index:10}
.brand{display:flex;gap:8px;align-items:center}
.brand h1{font-size:20px;margin:0}
.controls{display:flex;gap:16px;align-items:center}
.switch{display:flex;gap:6px;align-items:center;cursor:pointer}
.admin-link{font-size:14px;text-decoration:none;color:#444;border:1px solid #ddd;padding:6px 10px;border-radius:10px;background:#fff}
.view{max-width:960px;margin:0 auto;padding:16px}
#searchInput{width:100%;font-size:18px;padding:12px;border:1px solid #ccc;border-radius:12px;outline:none}
#results{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.result{display:flex;justify-content:space-between;align-items:center;padding:12px;border-radius:12px;border:1px solid #e5e5e5;background:#fff;cursor:pointer}
.result:hover{border-color:#ccc}
.meta{font-size:14px;color:#666}
.card{background:#fff;border:1px solid #eaeaea;border-radius:14px;padding:12px;margin:8px 0}
.map-wrap{position:relative;border:1px solid #eaeaea;background:#fff;border-radius:14px;overflow:hidden}
.map-wrap object{width:100%;height:auto;display:block}
.marker{position:absolute;width:28px;height:28px;border-radius:50%;border:4px solid #ffd60a;background:rgba(255, 214, 10, 0.25);transform:translate(-50%,-50%);animation:pulse 1.4s ease-in-out infinite}
.marker-note{position:absolute;left:2px;bottom:2px;background:#000;color:#fff;padding:6px 8px;border-radius:8px;opacity:0.85}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,214,10,0.6)}70%{box-shadow:0 0 0 16px rgba(255,214,10,0)}100%{box-shadow:0 0 0 0 rgba(255,214,10,0)}}
.warn{background:#fff3cd;border:1px solid #ffe69c;color:#7a5e00;padding:10px;border-radius:12px;margin-top:10px}
.back{background:#fff;border:1px solid #ddd;padding:8px 10px;border-radius:10px;cursor:pointer}
.footer{padding:16px;text-align:center;color:#666}
.large *{font-size:larger}

#searchTitle{font-size:18px}

#searchView{text-align:center}

#welcomePhoto{
  display:block;
  width:50vw;
  max-width:600px;
  height:auto;
  margin:12px auto 0 auto;
  border-radius:14px;
}

#seatView .card{
  width:min(720px,96%);
  max-width:720px;
  padding:10px 14px;
  margin:8px auto;
  display:block;
}
#seatView .card h2{margin:0}
#seatView .card p{margin:4px 0}
.back{margin-bottom:8px}

#seatTitleWrap{font-size:16px;line-height:1.3}

#welcomeLine{font-weight:400}

html, body, main, .view, .overlay { background: #F0E8FF; }

/* Banner: cropped, centered, full-bleed */
.banner{
  position: relative;
  background-image: url('1000010630.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100vw;
  max-width: 100%;
  height: calc(100vw * 0.7998046875); /* 1638 / 2048 */
  margin-left: calc(50% - 50vw);
  display:flex; align-items:center; justify-content:center;
  text-align:center;
}
.banner .title{
  background: rgba(255,255,255,0.12);
  padding: 10px 16px;
  border-radius: 12px;
  backdrop-filter: blur(2px);
  line-height: 1.25;

  transform: translateY(55%);}
@media (min-width: 768px){
  .banner{ height: min(520px, calc(100vw * 0.5)); }
}
html, body{ overflow-x: hidden; }

.overlay[hidden]{ display:none }
.overlay{ position:fixed; inset:0; z-index:9999; overflow:auto; -webkit-overflow-scrolling:touch }
.overlay-inner{ max-width:960px; margin:0 auto; padding:12px 16px }
.overlay-topbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; margin-top:4px }
.overlay-close{ background:#fff; border:1px solid #ddd; border-radius:10px; padding:6px 10px; cursor:pointer }
.overlay-instructions{ font-size:14px; line-height:1.4; color:#333; flex:1 }
#overlaySearch{ width:100%; font-size:16px; padding:10px 12px; border:1px solid #ddd; border-radius:10px; margin-top:8px }
.overlay-results{ list-style:none; margin:12px 0 24px; padding:0; display:grid; gap:8px }
.overlay-results .result{ background:#fff; border-radius:12px; padding:12px; border:1px solid #eee }
.overlay-results .result .name{ font-weight:600 }
.overlay-results .result .meta{ font-size:12px; opacity:.8 }

/* Button styled like an input */
.inputlike{
  display:block; width:100%;
  font: inherit; font-size:16px; line-height:1.3;
  padding:10px 12px; border:1px solid #ddd; border-radius:10px;
  background:#fff; text-align:left; color:#8a8a8a; cursor:text;
}