/* Scam Swipe: poster style message card and swipe controls. Loaded after ../poster.css. */
body.game-swipe .intro{background:var(--indigo)}
body.game-swipe .intro .eyebrow{color:var(--gold)}
body.game-swipe .intro::after{background:var(--tomato)}
.stage-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 2px}
.progress-label,.live-score{margin:0;font-family:var(--mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em}
.pips{display:flex;gap:6px;margin:10px 2px 16px}
.pips .pip{flex:1;height:10px;border:2px solid var(--ink);border-radius:999px;background:var(--paper)}
.pips .pip.now{background:var(--gold)}
.pips .pip.right{background:var(--exact)}
.pips .pip.wrong{background:var(--tomato)}
.swipe-wrap{position:relative;padding:4px 6px 8px;touch-action:pan-y}
.msg-card{position:relative;background:var(--paper);border:4px solid var(--ink);border-radius:20px;box-shadow:var(--shadow);padding:0 0 18px;overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab;transition:transform .22s var(--km-ease-out,cubic-bezier(.2,.8,.2,1)),background-color .15s;will-change:transform}
.msg-card.dragging{cursor:grabbing;transition:none}
.msg-card.is-right{box-shadow:6px 6px 0 var(--exact)}
.msg-card.is-wrong{box-shadow:6px 6px 0 var(--tomato)}
.msg-card.is-right,.msg-card.is-wrong{cursor:default;user-select:text;-webkit-user-select:text}
.msg-top{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--sand);border-bottom:4px solid var(--ink)}
.msg-art{flex:none;display:inline-flex;width:56px;height:56px;align-items:center;justify-content:center}
.msg-art .kart{width:56px;height:56px}
.msg-from{min-width:0}
.msg-channel{margin:0;font-family:var(--mono);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--tomato)}
.msg-sender{margin:2px 0 0;font-weight:800;font-size:16px;line-height:1.25;overflow-wrap:anywhere}
.msg-body{margin:0;padding:16px 18px 6px;font-size:17px;line-height:1.6;white-space:pre-line;overflow-wrap:anywhere}
.flag{position:relative;isolation:isolate;border-radius:3px}
.flag.tell{font-weight:800;text-decoration:underline wavy var(--tomato);text-decoration-thickness:2px;text-underline-offset:4px}
.flag.km-mark-on{text-decoration:none}
.swipe-stamp{position:absolute;top:84px;z-index:3;padding:2px 12px;border:4px solid var(--ink);border-radius:8px;font-family:var(--disp);font-weight:800;font-size:28px;text-transform:uppercase;letter-spacing:.03em;opacity:0;pointer-events:none}
.stamp-scam{left:14px;background:var(--tomato);color:var(--cream);transform:rotate(-12deg)}
.stamp-real{right:14px;background:var(--exact);color:var(--cream);transform:rotate(12deg)}
.answer-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.swipe-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 16px;border:3px solid var(--ink);border-radius:999px;box-shadow:3px 3px 0 var(--ink);font-family:var(--disp);font-weight:800;font-size:18px;text-transform:uppercase;letter-spacing:.02em;cursor:pointer;transition:transform .1s,box-shadow .1s}
.swipe-btn:active{transform:translate(3px,3px);box-shadow:none}
.swipe-btn:focus-visible{outline:4px solid var(--indigo);outline-offset:3px}
.btn-scam{background:var(--tomato);color:var(--cream)}
.btn-real{background:var(--exact);color:var(--cream)}
.key-hint{margin:10px 2px 0;font-size:13px;color:var(--soft)}
.verdict{margin-top:14px;padding:14px 16px;border:4px solid var(--ink);border-radius:18px;background:var(--gold);box-shadow:4px 4px 0 var(--ink)}
.verdict.is-right{background:#CDE9DA}
.verdict.is-wrong{background:#FBD6CE}
.verdict h2{margin:2px 0 8px;font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:clamp(20px,5vw,26px);line-height:1.05;letter-spacing:-.01em}
.tells{list-style:none;margin:0 0 4px;padding:0;display:grid;gap:10px}
.tell-item{display:grid;gap:2px;padding-top:10px;border-top:2px dashed var(--ink)}
.tell-item:first-child{padding-top:0;border-top:0}
.tell-item b{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.tell-quote{font-weight:800;font-size:15px;overflow-wrap:anywhere}
.tell-why{font-size:15px;line-height:1.5}
.next-button{margin-top:12px}
.result-score{margin:4px 0 0;font-family:var(--disp);font-weight:800;font-size:clamp(56px,16vw,88px);line-height:.9;letter-spacing:-.03em}
.safety-list{margin:12px 0 0;padding:12px 16px 12px 32px;border:3px solid var(--ink);border-radius:14px;background:var(--sand);font-size:15px;line-height:1.5}
.review-wrap{margin-top:14px}
.review-wrap summary{min-height:44px;display:flex;align-items:center;font-weight:800;cursor:pointer}
.review{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px}
.rv-item{display:grid;gap:2px;padding:8px 10px;border:2px solid var(--ink);border-radius:12px;font-size:14px;line-height:1.4}
.rv-item.right{background:#CDE9DA}
.rv-item.wrong{background:#FBD6CE}
.rv-item b{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.next-timer-line{margin:14px 0 0;font-size:14px}
.next-timer-line b{font-family:var(--mono)}
.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 0}
.stats-grid .stat{padding:8px 10px;border:2px solid var(--ink);border-radius:12px;background:var(--cream)}
.stats-grid dt{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.stats-grid dd{margin:2px 0 0;font-family:var(--disp);font-weight:800;font-size:24px}
.takeaway{margin-top:10px;font-weight:700}
.how{margin:0;font-size:15px}
.share-fallback{width:100%;margin-top:8px;padding:8px;border:2px solid var(--ink);border-radius:10px;font:14px var(--mono)}
@media(max-width:380px){.msg-body{font-size:16px;padding:14px 14px 6px}.msg-top{padding:10px 12px}.swipe-btn{font-size:16px;padding:0 10px}.swipe-stamp{font-size:22px;top:76px}}
@media(prefers-reduced-motion:reduce){.msg-card,.swipe-btn{transition:none}}