:root {
  --paper:#f2efe8;
  --paper-2:#e7e2d8;
  --ink:#171816;
  --muted:#6d6d65;
  --line:#c9c3b7;
  --accent:#dc4d2f;
  --accent-dark:#a93421;
  --map-bg:#dcded8;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--paper);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--paper)}
body{min-height:100dvh}
a{color:inherit}
button{font:inherit;cursor:pointer}
[hidden]{display:none!important}
.game-shell{min-height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr)}
.game-header{height:68px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 24px;border-bottom:1px solid var(--line);background:rgba(242,239,232,.96);position:relative;z-index:1000}
.game-brand{text-decoration:none;display:grid;gap:2px}
.game-brand-kicker{font-size:9px;font-weight:850;letter-spacing:.14em;color:var(--muted)}
.game-brand-title{font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:23px;line-height:1;letter-spacing:-.025em}
.game-nav{display:flex;gap:18px;align-items:center}
.game-nav a{font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.game-nav a:hover{text-decoration:underline;text-underline-offset:4px}
.game-screen{display:grid;place-items:center;padding:36px 24px;min-height:0}
.start-card,.results-card{width:min(760px,100%);padding:42px;border:1px solid var(--line);background:#fffdf8;box-shadow:0 20px 70px rgba(23,24,22,.08)}
.screen-kicker{margin:0 0 12px;color:var(--accent-dark);font-size:10px;font-weight:900;letter-spacing:.16em}
.start-card h1,.results-card h1{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(42px,7vw,70px);line-height:.94;letter-spacing:-.045em}
.start-lead{max-width:680px;margin:20px 0 0;font-family:Georgia,"Times New Roman",serif;font-size:20px;line-height:1.48;color:#30322e}
.rules-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:30px;background:var(--line);border:1px solid var(--line)}
.rules-grid>div{display:grid;gap:4px;padding:18px;background:var(--paper)}
.rules-grid strong{font-family:Georgia,"Times New Roman",serif;font-size:31px;line-height:1;color:var(--accent-dark)}
.rules-grid span{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.start-note{margin:18px 0 0;font-size:12px;color:var(--muted)}
.start-actions,.results-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.game-button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 17px;border:1px solid var(--ink);border-radius:999px;text-decoration:none;font-size:12px;font-weight:850;background:transparent;color:var(--ink)}
.game-button-primary{background:var(--ink);color:var(--paper)}
.game-button-primary:hover{background:var(--accent-dark);border-color:var(--accent-dark)}
.game-button-secondary:hover{background:var(--ink);color:var(--paper)}
.game-button:disabled{opacity:.34;cursor:not-allowed}
.round-screen{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;overflow:hidden;background:var(--paper)}
.round-status{position:relative;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 20px 19px;border-bottom:1px solid var(--line)}
.round-label,.round-prompt{margin:0}
.round-label{font-size:10px;font-weight:900;letter-spacing:.14em;color:var(--accent-dark)}
.round-prompt{margin-top:3px;font-family:Georgia,"Times New Roman",serif;font-size:18px}
.timer{display:grid;place-items:center;min-width:72px;height:42px;padding:0 14px;border:1px solid var(--ink);border-radius:999px;font-variant-numeric:tabular-nums;font-size:18px;font-weight:900}
.timer.is-urgent{background:var(--accent);border-color:var(--accent);color:#fff}
.timer-track{position:absolute;left:0;right:0;bottom:0;height:8px;background:var(--paper-2);overflow:hidden}
.timer-track span{display:block;width:100%;height:100%;background:var(--accent);transform-origin:left center;transform:scaleX(1)}
.round-stage{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);gap:1px;min-height:0;background:var(--line)}
.mystery-stage{position:relative;margin:0;min-width:0;min-height:0;display:grid;place-items:center;background:#111210;overflow:hidden}
.mystery-stage img{display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;opacity:0;transition:opacity .18s ease}
.mystery-stage img.is-loaded{opacity:1}
.photo-loading{position:absolute;color:#88867f;font-size:11px;font-weight:850;letter-spacing:.1em;text-transform:uppercase}
.guess-map-wrap{position:relative;min-width:0;min-height:0;background:var(--map-bg)}
#guess-map{width:100%;height:100%;min-height:320px}
.leaflet-container{font-family:inherit;background:var(--map-bg)}
.leaflet-tile-pane{filter:grayscale(.35) saturate(.72) contrast(.94)}
.map-instruction{position:absolute;z-index:500;left:50%;top:14px;transform:translateX(-50%);pointer-events:none;padding:8px 12px;border-radius:999px;background:rgba(242,239,232,.94);border:1px solid rgba(23,24,22,.2);font-size:10px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.map-instruction.is-hidden{display:none}
.guess-marker,.answer-marker{border-radius:50%;box-shadow:0 2px 9px rgba(0,0,0,.28)}
.guess-marker{width:18px!important;height:18px!important;margin:-9px 0 0 -9px!important;background:var(--accent);border:3px solid #fff}
.answer-marker{width:22px!important;height:22px!important;margin:-11px 0 0 -11px!important;background:var(--ink);border:4px solid #fff}
.round-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;border-top:1px solid var(--line);background:var(--paper)}
.guess-status{margin:0;font-size:12px;color:var(--muted)}
.reveal-panel{grid-column:1/-1;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px;padding:15px 20px;border-top:1px solid var(--line);background:#fffdf8}
.reveal-score-block{min-width:150px;padding-right:20px;border-right:1px solid var(--line)}
.reveal-distance{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:21px;font-weight:700}
.reveal-score{margin:4px 0 0;color:var(--accent-dark);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.reveal-place{min-width:0}
.reveal-kicker{margin:0 0 3px;color:var(--muted);font-size:9px;font-weight:900;letter-spacing:.12em}
.reveal-place h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:25px;line-height:1.05}
.reveal-place p:not(.reveal-kicker){margin:4px 0 0;font-size:11px;color:var(--muted)}
.reveal-link{display:inline-block;margin-top:7px;font-size:11px;font-weight:800;color:var(--accent-dark);text-underline-offset:3px}
.final-score{display:flex;align-items:baseline;gap:9px;margin-top:24px}
.final-score strong{font-family:Georgia,"Times New Roman",serif;font-size:clamp(56px,10vw,92px);line-height:.9;color:var(--accent-dark);letter-spacing:-.045em}
.final-score span{font-size:15px;font-weight:800;color:var(--muted)}
.final-message{margin:18px 0 0;font-family:Georgia,"Times New Roman",serif;font-size:21px}
.round-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:26px}
.round-summary-item{padding:12px 10px;border:1px solid var(--line);background:var(--paper);min-width:0}
.round-summary-item strong{display:block;font-size:14px}
.round-summary-item span{display:block;margin-top:4px;color:var(--muted);font-size:10px;line-height:1.35}
.played-tags{margin-top:30px;padding-top:24px;border-top:1px solid var(--line)}
.played-tags h2{margin:0 0 12px;font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}
.played-tag-list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.played-tag{display:grid;grid-template-columns:54px 1fr auto;gap:12px;align-items:center;padding:11px 12px;background:#fffdf8;text-decoration:none}
.played-tag:hover{background:var(--paper)}
.played-tag-number{font-family:Georgia,"Times New Roman",serif;font-size:18px;color:var(--accent-dark);font-weight:700}
.played-tag-name{min-width:0;font-size:13px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.played-tag-meta{font-size:10px;color:var(--muted)}
@media(max-width:860px){
  .game-shell{grid-template-rows:minmax(0,1fr)}
  .game-header{display:none}
  .game-screen{padding:max(16px,env(safe-area-inset-top)) 12px max(16px,env(safe-area-inset-bottom));align-items:start}.start-card,.results-card{padding:28px 22px}.start-card h1,.results-card h1{font-size:44px}.start-lead{font-size:17px}
  .round-screen{height:100dvh;overflow:auto;grid-template-rows:auto auto auto auto}.round-status{position:sticky;top:0;z-index:900;padding-top:max(13px,env(safe-area-inset-top));background:rgba(242,239,232,.97)}
  .round-stage{grid-template-columns:1fr;grid-template-rows:minmax(290px,38dvh) minmax(330px,44dvh)}
  .mystery-stage{min-height:290px}.guess-map-wrap{min-height:330px}.round-footer{position:sticky;bottom:0;z-index:850}.reveal-panel{grid-template-columns:1fr;gap:12px}.reveal-score-block{border:0;border-bottom:1px solid var(--line);padding:0 0 11px}.reveal-panel>.game-button{width:100%}
  .round-summary{grid-template-columns:1fr}.rules-grid{grid-template-columns:1fr}.results-actions,.start-actions{display:grid}.game-button{width:100%}
}


/* Daily challenge refinements */
.daily-status{margin:12px 0 0;font-size:11px;font-weight:800;color:var(--accent-dark)}
.reveal-links{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:7px}
.reveal-links .reveal-link{margin-top:0}
.game-report-toggle,.game-report-cancel{appearance:none;border:0;background:transparent;padding:0;color:var(--accent-dark);font:inherit;font-size:11px;font-weight:800;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.game-report-toggle[aria-expanded="true"]{text-decoration:none}
.game-report-form{display:grid;gap:8px;margin-top:10px;padding:10px;border:1px solid var(--line);background:var(--paper)}
.game-report-form[hidden]{display:none!important}
.game-report-form label{display:grid;gap:4px;font-size:9px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.game-report-form em{font-style:normal;font-weight:600;text-transform:none;letter-spacing:0}
.game-report-form select,.game-report-form textarea{width:100%;border:1px solid var(--line);border-radius:0;background:#fffdf8;color:var(--ink);font:inherit;font-size:11px;padding:7px 8px;resize:vertical}
.game-report-form textarea{min-height:48px}
.game-report-actions{display:flex;align-items:center;gap:12px}.game-report-actions .game-button{min-height:34px;padding:6px 12px;font-size:10px}
.game-report-status{margin:0;font-size:10px;color:var(--muted)}
.report-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.results-scoreboard{display:grid;grid-template-columns:minmax(0,.9fr) minmax(300px,1.1fr);gap:24px;align-items:start;margin-top:22px}
.your-score-panel{min-width:0;padding:18px 0}
.results-scoreboard .final-score{margin-top:0}
.player-rank{margin:14px 0 0;font-size:11px;font-weight:800;color:var(--accent-dark)}
.daily-leaderboard{border:1px solid var(--line);background:var(--paper);padding:16px}
.leaderboard-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding-bottom:11px;border-bottom:1px solid var(--line)}
.leaderboard-kicker{margin:0;color:var(--accent-dark);font-size:9px;font-weight:900;letter-spacing:.13em}
.leaderboard-heading h2{margin:3px 0 0;font-family:Georgia,"Times New Roman",serif;font-size:20px;line-height:1}
.leaderboard-date{font-size:9px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}
.leaderboard-list{list-style:none;margin:9px 0 0;padding:0;display:grid}
.leaderboard-list li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:9px;align-items:center;padding:7px 2px;border-bottom:1px solid rgba(201,195,183,.65);font-size:11px}
.leaderboard-list li:last-child{border-bottom:0}
.leaderboard-rank{font-family:Georgia,"Times New Roman",serif;font-size:14px;color:var(--muted)}
.leaderboard-rider{font-weight:850}.leaderboard-score{font-variant-numeric:tabular-nums;font-weight:900;color:var(--accent-dark)}
.leaderboard-list li.is-you{background:#fffdf8;margin:0 -7px;padding-left:9px;padding-right:9px}
.leaderboard-empty{display:block!important;color:var(--muted);font-style:italic}
.leaderboard-count{margin:9px 0 0;padding-top:9px;border-top:1px solid var(--line);font-size:9px;color:var(--muted)}
.tomorrow-note{margin:14px 0 0;font-size:11px;color:var(--muted)}

@media(min-width:861px){
  .round-screen{height:calc(100dvh - 68px)}
  .round-stage,.mystery-stage,.guess-map-wrap,#guess-map{min-height:0}
}

@media(max-width:860px){
  .results-scoreboard{grid-template-columns:1fr;gap:12px}.your-score-panel{padding:0}.daily-leaderboard{padding:14px}
  .reveal-links{align-items:flex-start;flex-direction:column;gap:7px}.game-report-form{margin-top:8px}.game-report-actions{align-items:stretch;flex-direction:column}.game-report-actions .game-button{width:100%}
}
.results-card{width:min(940px,100%)}


/* Daily 502 mobile P0 optimization */
@media(max-width:860px){
  .game-button,
  .timer,
  .game-report-toggle,
  .game-report-cancel { min-height:44px; }
  .game-report-toggle,
  .game-report-cancel { display:inline-flex; align-items:center; }
  .game-report-form select,
  .game-report-form textarea { font-size:16px; }
  .round-footer {
    padding-right:max(18px, env(safe-area-inset-right));
    padding-bottom:max(12px, calc(env(safe-area-inset-bottom) + 8px));
    padding-left:max(18px, env(safe-area-inset-left));
  }
  .round-status {
    padding-right:max(20px, env(safe-area-inset-right));
    padding-left:max(20px, env(safe-area-inset-left));
  }
}


/* Android/mobile start + round reveal pass */
@media(max-width:860px){
  /* The complete start decision should fit in one phone viewport. */
  .start-screen {
    height:100dvh;
    min-height:0;
    padding:max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom));
    place-items:stretch;
    overflow:hidden;
  }
  .start-card {
    width:100%;
    height:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:14px 16px;
    border:0;
    box-shadow:none;
  }
  .screen-kicker { margin-bottom:7px; font-size:8px; }
  .start-card h1 { font-size:32px; line-height:.96; }
  .start-lead { margin-top:10px; font-size:14px; line-height:1.35; }
  .rules-grid { grid-template-columns:repeat(3,1fr); margin-top:12px; }
  .rules-grid>div { gap:2px; padding:9px 7px; }
  .rules-grid strong { font-size:23px; }
  .rules-grid span { font-size:8px; line-height:1.2; }
  .start-note { margin-top:10px; font-size:10px; line-height:1.35; }
  .daily-status { margin-top:7px; font-size:10px; }
  .start-actions { display:grid; gap:7px; margin-top:11px; }
  .start-actions .game-button { min-height:44px; padding:8px 12px; }

  /* Once locked, the lock footer has no job. Replace it immediately with the
     result panel and remove the redundant timer pill from the reveal state. */
  .round-screen.is-revealed .round-footer { display:none; }
  .round-screen.is-revealed .timer { display:none; }
  .round-screen.is-revealed .round-status { padding-bottom:12px; }
  .round-screen.is-revealed .timer-track { display:none; }
  .reveal-panel {
    position:sticky;
    bottom:0;
    z-index:860;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px 12px;
    padding:10px max(12px, env(safe-area-inset-right)) max(10px, calc(env(safe-area-inset-bottom) + 6px)) max(12px, env(safe-area-inset-left));
    box-shadow:0 -8px 24px rgba(23,24,22,.10);
  }
  .reveal-score-block {
    grid-column:1 / -1;
    display:flex;
    align-items:baseline;
    gap:10px;
    min-width:0;
    padding:0 0 7px;
    border-bottom:1px solid var(--line);
  }
  .reveal-distance { font-size:19px; }
  .reveal-score { margin:0; font-size:11px; }
  .reveal-place { min-width:0; }
  .reveal-place h2 { font-size:20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .reveal-place p:not(.reveal-kicker) { margin-top:2px; }
  .reveal-links { flex-direction:row; flex-wrap:wrap; gap:8px 12px; margin-top:5px; }
  .reveal-links .reveal-link, .game-report-toggle { min-height:32px; font-size:10px; }
  .reveal-panel > .game-button { width:auto; min-width:104px; align-self:center; }
  .game-report-form { grid-column:1 / -1; }
}

@media(max-width:380px), (max-height:680px) and (max-width:860px){
  .start-card h1 { font-size:28px; }
  .start-lead { font-size:13px; }
  .start-note { font-size:9px; }
  .rules-grid strong { font-size:20px; }
}

/* A locked round has ended; the reveal replaces the countdown everywhere. */
.round-screen.is-revealed .timer,
.round-screen.is-revealed .timer-track { display:none; }


/* Mobile timer + map attribution refinement */
.round-prompt-mobile { display:none; }

/* Keep map attribution inside the map's own lower-right control corner and
   below any post-round UI that overlaps the map on small screens. */
#guess-map .leaflet-bottom.leaflet-right {
  z-index:700;
  right:0;
  bottom:0;
}
#guess-map .leaflet-control-attribution {
  margin:0 4px 4px 0;
  padding:1px 4px;
  max-width:calc(100% - 8px);
  background:rgba(242,239,232,.88);
  font-size:9px;
  line-height:1.2;
  white-space:nowrap;
}
.round-screen.is-revealed .reveal-panel { z-index:1100; }

@media(max-width:860px){
  /* The bar carries the visual countdown on phones. Keep the numerical timer
     available to assistive technology without spending screen space on it. */
  .timer {
    position:absolute!important;
    width:1px!important;
    min-width:1px!important;
    height:1px!important;
    min-height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    clip-path:inset(50%)!important;
    white-space:nowrap!important;
    border:0!important;
  }
  .round-status {
    padding:max(8px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 12px max(14px,env(safe-area-inset-left));
  }
  .round-status > div:first-child {
    display:flex;
    align-items:baseline;
    gap:9px;
    min-width:0;
    white-space:nowrap;
  }
  .round-label { font-size:9px; line-height:1; }
  .round-prompt {
    margin:0;
    font-family:inherit;
    font-size:12px;
    line-height:1;
    font-weight:800;
    color:var(--muted);
  }
  .round-prompt-full { display:none; }
  .round-prompt-mobile { display:inline; }
  #guess-map .leaflet-control-attribution {
    margin:0 3px 3px 0;
    padding:1px 3px;
    font-size:8px;
  }
}


/* Client-side Instagram Story share card */
body.story-modal-open{overflow:hidden}
.story-modal{position:fixed;inset:0;z-index:1400;display:grid;place-items:center;padding:24px}
.story-modal-backdrop{position:absolute;inset:0;background:rgba(23,24,22,.54)}
.story-modal-dialog{position:relative;z-index:1;width:min(540px,100%);max-height:calc(100dvh - 48px);overflow:auto;padding:22px;border:1px solid var(--line);background:#fffdf8;box-shadow:0 24px 80px rgba(23,24,22,.24)}
.story-modal-close{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:999px;background:#fffdf8;color:var(--ink);font-size:24px;line-height:1}
.story-modal-header h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:34px;line-height:.98;letter-spacing:-.035em}
.story-modal-note{margin:10px 0 0;font-size:12px;line-height:1.45;color:var(--muted)}
.story-preview-shell{display:grid;place-items:center;margin-top:16px;padding:12px;border:1px solid var(--line);background:var(--paper)}
.story-preview{display:block;width:min(100%,320px);aspect-ratio:9/16;object-fit:contain;background:#ebe6da;border:1px solid rgba(23,24,22,.12);box-shadow:0 12px 32px rgba(23,24,22,.12)}
.story-modal-actions{display:grid;gap:10px;margin-top:16px}
.story-modal-status{min-height:1.3em;margin:12px 0 0;font-size:11px;color:var(--accent-dark)}
@media(min-width:700px){
  .story-modal-actions{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .story-modal{padding:12px}
  .story-modal-dialog{width:min(100%,540px);max-height:calc(100dvh - 24px);padding:18px 16px 16px}
  .story-modal-header h2{font-size:28px}
  .story-preview{width:min(100%,282px)}
  .story-modal-actions{grid-template-columns:1fr}
}
