/* The 500 kr overlay on article pages (pop.js) and the survey page /enkat/ (enkat.js). */
.dp-bg { position: fixed; inset: 0; z-index: 45; background: rgba(20,16,12,0); display: flex; align-items: center; justify-content: center; padding: 16px; transition: background .3s; }
.dp-bg.up { background: rgba(20,16,12,.55); }
.dp { position: relative; width: 420px; max-width: 100%; background: var(--paper-hi); color: var(--ink); border-top: 5px solid var(--accent); border-radius: 10px; padding: 24px 24px 14px; box-shadow: 0 16px 50px rgba(0,0,0,.3); font: 15px/1.45 var(--sans); transform: translateY(30px); opacity: 0; transition: transform .35s var(--ease), opacity .35s; }
.dp-bg.up .dp { transform: none; opacity: 1; }
.dp-x { position: absolute; top: 6px; right: 8px; border: 0; background: none; font-size: 28px; line-height: 1; cursor: pointer; color: var(--muted); padding: 4px 8px; }
.dp-lbl { font: 700 11px var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--accent); margin: 0 0 8px; }
.dp-h { font: 700 25px/1.18 var(--serif); margin: 0 0 8px; padding-right: 20px; }
.dp-sub { color: var(--muted); margin: 0 0 16px; }
.dp-btn { border: 0; cursor: pointer; border-radius: 6px; padding: 14px 18px; font: 700 16px var(--sans); background: var(--accent); color: #fff; }
.dp-btn.w { width: 100%; }
.dp-no { display: block; margin: 8px auto 0; border: 0; background: none; color: var(--muted); font: 14px var(--sans); cursor: pointer; padding: 6px; }
.kv-bar.away { transform: translateY(110%) !important; }
@media (max-width: 700px) {
  .dp-bg { align-items: flex-end; padding: 0; }
  .dp { width: 100%; border-radius: 14px 14px 0 0; padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
}

.en { max-width: 680px; margin: 0 auto; padding-bottom: 80px; font-family: var(--sans); }
.en [hidden] { display: none !important; }
.en-ing { font: 19px/1.5 var(--serif); margin: 0 0 24px; }
.en-q { border: 1px solid var(--rule); border-radius: 8px; background: var(--paper-hi); padding: 16px; margin: 0 0 14px; min-width: 0; }
.en-q.miss { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-wash); }
.en-t { display: block; font: 600 17px/1.35 var(--sans); margin: 0 0 8px; padding: 0; }
.en-n { display: inline-block; min-width: 26px; height: 26px; border-radius: 13px; background: var(--ink); color: #fff; font: 700 13px/26px var(--sans); text-align: center; margin-right: 8px; }
.en-hint { font-size: 13px; color: var(--muted); margin: -2px 0 8px; }
.en-opts { display: flex; flex-direction: column; gap: 6px; }
.en-opt { text-align: left; border: 1.5px solid var(--rule); background: #fff; border-radius: 8px; padding: 11px 13px; font: 500 15px/1.3 var(--sans); color: var(--ink); cursor: pointer; }
.en-opt.on { border-color: var(--ink); background: var(--ink); color: #fff; }
.en-fact { margin: -2px 0 10px; color: var(--muted); font: 14px/1.4 var(--sans); }
.en-opt:disabled { opacity: .45; cursor: default; }
.en select, .en textarea, .en-f input, .en-other { display: block; width: 100%; margin-top: 5px; padding: 11px 12px; border: 1.5px solid var(--rule); border-radius: 6px; font: 16px var(--sans); background: #fff; color: var(--ink); }
.en textarea { resize: vertical; }
.en-other { margin-top: 8px; }
.en-me { border-top: 4px solid var(--accent); background: var(--paper-hi); border-radius: 8px; padding: 18px 16px; margin-top: 24px; }
.en-me h2, .en-gh { font: 700 24px/1.2 var(--serif); margin: 0 0 4px; }
.en-f { display: block; font: 600 14px var(--sans); margin: 12px 0; }
.en-ck { display: flex; gap: 8px; align-items: flex-start; font: 13px/1.4 var(--sans); margin: 14px 0; }
.en-ck input { margin-top: 3px; flex: none; }
.en-ck a { text-decoration: underline; }
.en-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.en-err { color: var(--accent-deep); font: 600 14px var(--sans); margin: 0 0 10px; }
.en-btn { width: 100%; border: 0; cursor: pointer; border-radius: 6px; padding: 14px 18px; font: 700 16px var(--sans); background: var(--accent); color: #fff; margin-top: 4px; }
.en-btn:disabled { opacity: .6; }
.en-bar[hidden] { display: none; }
.en-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: var(--paper-hi); border-top: 1px solid var(--rule); padding: 8px 16px calc(8px + env(safe-area-inset-bottom)); font: 600 13px var(--sans); text-align: center; box-shadow: 0 -6px 18px rgba(0,0,0,.06); }
.en-bar i { display: block; max-width: 680px; height: 5px; margin: 6px auto 0; background: var(--rule); border-radius: 3px; overflow: hidden; }
.en-bar b { display: block; height: 100%; width: 0; background: var(--accent); transition: width .25s; }
.en-gift { background: var(--paper-hi); border: 1px solid var(--rule); border-top: 4px solid var(--accent); border-radius: 8px; padding: 20px 16px; }
.en-gift .en-big { margin: 14px 0; }
.en-gift .en-big .en-opt { padding: 15px; font-weight: 600; font-size: 16px; }
.en-done p { font-size: 16px; margin: 10px 0; }
.en-code { font: 700 32px var(--sans) !important; letter-spacing: .06em; text-align: center; background: #fff; border: 2px dashed var(--accent); border-radius: 8px; padding: 12px; }
