/* Game-specific styles. Loaded after mobile.css; does not change it. */
#ld-wrap { position: relative; min-height: 100vh; }
.ld-pb { padding-bottom: 120px; }
.ld-dark header nav { visibility: hidden; }
.ld-meta { text-transform: uppercase; letter-spacing: .08em; margin-bottom: 8px !important; }
.ld-anim { width: 100px; height: 100px; margin: 0 auto; }
.ld-card { background: rgba(255,255,255,.08); border: 2px solid #ff9999; border-radius: 15px; padding: 22px 18px; margin: 0 0 18px 0; text-align: center; min-height: 120px; display: flex; align-items: center; justify-content: center; }
.ld-card p { line-height: 1.5; }
.ld-hint { margin: 0 0 18px 0 !important; text-align: center; }
.ld-timer { text-align: center; margin: 0 0 18px 0; }
.ld-timer .ld-time { font-size: 2.6rem; font-weight: 700; color: #fff; line-height: 1.1; margin-bottom: 8px; }
.ld-timer .ld-time.done { color: #ff9999; }
.ld-levels { display: flex; justify-content: center; gap: 14px; margin-bottom: 12px; }
.ld-levels i { font-size: 18px; color: #ff9999; opacity: .35; }
.ld-levels i.on { opacity: 1; }
.ld-btn-row { display: flex; gap: 10px; }
.ld-btn-row > * { flex: 1 1 0; }
a[data-act], .ld-link { cursor: pointer; }
.ld-err { color: #ffd0d0 !important; text-align: center; min-height: 18px; margin-bottom: 12px !important; }
.player-names.bad { outline: 2px solid #ec135b !important; }
.ld-remove { color: #ff9999 !important; text-decoration: none; font-size: 20px; line-height: 44px; }
.button-salmon-small-less, .button-white-small, .button-salmon-small-less-double, .button-white-small-double { text-align: center; }

/* ---------- 18+ popup + cookie banner ---------- */
.ld-overlay { position: fixed; inset: 0; z-index: 3000; background: rgba(30,0,30,.92); display: flex; align-items: center; justify-content: center; padding: 20px; overflow-y: auto; }
.ld-modal { background: #fff; color: #330033; border-radius: 15px; padding: 20px; max-width: 420px; width: 100%; }
.ld-modal p { color: #330033 !important; font-size: 12px !important; }
.ld-modal h3 { color: #330033 !important; text-align: center; margin-bottom: 20px !important; }
.ld-modal a.plain { color: #330033 !important; }
.ld-modal .button-purple, .ld-modal .button-purple-naked { display: block; text-align: center; }
.ld-cookie { position: fixed; left: 0; right: 0; bottom: 0; z-index: 2900; background: #330033; border-top: 2px solid #ff9999; padding: 16px 20px calc(16px + env(safe-area-inset-bottom)); }
.ld-cookie .inner { max-width: 560px; margin: 0 auto; }
.ld-cookie p { font-size: 12px !important; margin-bottom: 12px !important; line-height: 1.45; }
.ld-cookie .ld-btn-row a { display: block; text-align: center; }
body.ld-lock { overflow: hidden; }

/* ---------- ad break (product stories) ---------- */
.ld-story { position: fixed; inset: 0; z-index: 2800; background: #1b001b; display: flex; flex-direction: column; }
.ld-story .bars { position: absolute; top: 12px; left: 12px; right: 12px; display: flex; gap: 5px; z-index: 3; }
.ld-story .bar { flex: 1; height: 3px; background: rgba(255,255,255,.3); border-radius: 3px; overflow: hidden; }
.ld-story .bar i { display: block; height: 100%; width: 0; background: #fff; }
.ld-story .tag { position: absolute; top: 24px; left: 16px; z-index: 3; font-size: 11px; color: #fff; opacity: .85; letter-spacing: .08em; text-transform: uppercase; }
.ld-story .slide { position: absolute; inset: 0; display: none; cursor: pointer; background-size: cover; background-position: center; }
.ld-story .slide.on { display: block; }
.ld-story .slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(30,0,30,.95) 0%, rgba(30,0,30,0) 55%); }
.ld-story .info { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 20px 20px calc(24px + env(safe-area-inset-bottom)); text-align: center; }
.ld-story .info h3 { font-size: 1.15rem !important; margin-bottom: 4px !important; }
.ld-story .info p { margin-bottom: 14px !important; font-size: 13px !important; }
.ld-story .info .button-salmon { display: block; max-width: 320px; margin: 0 auto; text-align: center; }

/* buttons inside game views: centred labels like the original mockups */
#view .d-grid, .ld-btn-row .d-grid { text-align: center; }
