/* Landing page guide: spot-the-problems phone game, proof grid, checklist. */
.lp-guide .lp-game { margin:44px 0; padding:26px; border-radius:26px; border:1px solid var(--fe-border); background:var(--fe-surface); color:var(--fe-ink); scroll-margin-top:110px; }
.lp-guide .lp-title { margin-top:6px; font:400 clamp(1.6rem,3vw,2.1rem)/1.1 'DM Serif Display',serif; }
.lp-guide .lp-sub { margin-top:6px; color:var(--fe-muted); font-size:.92rem; line-height:1.55; }
.lp-guide .lp-layout { display:grid; grid-template-columns:minmax(0,330px) minmax(0,1fr); gap:24px; margin-top:20px; align-items:start; }
.lp-guide .lp-switch { display:flex; gap:4px; margin-bottom:12px; padding:4px; border-radius:14px; background:var(--fe-raised); border:1px solid var(--fe-border); }
.lp-guide .lp-switch button { flex:1; min-height:38px; border:0; border-radius:10px; background:transparent; color:var(--fe-muted); font:700 .84rem 'Manrope',sans-serif; cursor:pointer; }
.lp-guide .lp-switch button[aria-selected=true] { background:var(--fe-accent); color:var(--fe-raised); }
.lp-guide .lp-switch button[data-v=bad][aria-selected=true] { background:#c4523e; color:#fff; }
.lp-guide button:focus-visible { outline:3px solid var(--fe-accent-2); outline-offset:2px; }

/* Phone mock (always light, like a real web page) */
.lp-guide .lp-phone { overflow:hidden; height:560px; border:10px solid #15171a; border-radius:36px; background:#fff; color:#1b1b1b; box-shadow:0 30px 60px -30px rgba(0,0,0,.6); font-family:system-ui,-apple-system,'Segoe UI',sans-serif; }
.lp-guide .lp-screen { position:relative; display:grid; align-content:start; gap:10px; height:100%; padding:12px; overflow:hidden; }
.lp-guide .lp-hot { position:relative; display:block; width:100%; padding:4px; border:2px dashed transparent; border-radius:10px; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; transition:border-color .2s,background .2s; }
.lp-guide .lp-hot:hover { border-color:rgba(196,82,62,.45); }
.lp-guide .lp-hot.is-found { border:2px solid #c4523e; background:rgba(196,82,62,.07); }
.lp-guide .lp-pin { position:absolute; top:-9px; right:-6px; z-index:2; display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:#c4523e; color:#fff; font:800 .76rem 'Manrope',sans-serif; box-shadow:0 4px 10px -4px rgba(0,0,0,.5); }
.lp-guide .lp-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px; padding-bottom:8px; border-bottom:1px solid #eee; font-size:.68rem; color:#666; }
.lp-guide .lp-nav b { color:#2a5bd7; font-size:.95rem; }
.lp-guide .lp-h { font:800 1.5rem/1.15 Georgia,serif; color:#111; }
.lp-guide .lp-hs { margin-top:4px; color:#777; font-size:.8rem; }
.lp-guide .lp-img { display:grid; place-items:center; height:120px; border-radius:10px; font-size:2rem; }
.lp-guide .lp-stock { background:linear-gradient(135deg,#dbe6ff,#f4e3ff); }
.lp-guide .lp-stock small { font-size:.62rem; color:#8a8aa5; }
.lp-guide .lp-real { background:linear-gradient(135deg,#d7efe3,#bfe2d1); font-size:.82rem; font-weight:700; color:#225c43; }
.lp-guide .lp-form { display:grid; gap:5px; }
.lp-guide .lp-form i { display:block; padding:7px 9px; border:1px solid #ddd; border-radius:6px; color:#999; font-style:normal; font-size:.7rem; }
.lp-guide .lp-form b { padding:8px; border-radius:6px; background:#999; color:#fff; text-align:center; font-size:.72rem; letter-spacing:.1em; }
.lp-guide .lp-empty-proof { padding:10px; color:#aaa; text-align:center; font-size:.66rem; }
.lp-guide .lp-pop-veil { position:absolute; inset:0; z-index:3; display:grid; place-items:center; padding:18px; background:rgba(0,0,0,.55); }
.lp-guide .lp-pop { position:relative; display:grid; gap:8px; padding:22px 16px 16px; border-radius:12px; background:#fff; text-align:center; font-size:.78rem; color:#555; }
.lp-guide .lp-pop b { color:#d12; font-size:1rem; }
.lp-guide .lp-pop i { padding:8px; border:1px solid #ddd; border-radius:6px; font-style:normal; color:#aaa; }
.lp-guide .lp-pop em { position:absolute; top:4px; right:9px; color:#bbb; font-style:normal; font-size:.9rem; }
.lp-guide .lp-pop-veil .lp-hot { width:auto; }
.lp-guide .lp-good .lp-h { font-family:system-ui,sans-serif; }
.lp-guide .lp-call { padding:5px 10px; border-radius:999px; background:#eef4ff; color:#2a5bd7; font-weight:700; }
.lp-guide .lp-proofline { padding:8px 10px; border-radius:8px; background:#fff8e6; color:#6a5310; font-size:.74rem; font-weight:600; }
.lp-guide .lp-price { font-size:.78rem; color:#444; } .lp-guide .lp-price b { color:#111; }
.lp-guide .lp-wa { padding:12px; border-radius:10px; background:#1fa855; color:#fff; text-align:center; font-weight:800; font-size:.9rem; }
.lp-guide .lp-form-s { grid-template-columns:1fr 1fr; } .lp-guide .lp-form-s b { grid-column:1 / -1; background:#2a5bd7; letter-spacing:0; }

/* Side panel */
.lp-guide .lp-score { padding:18px; border-radius:18px; background:var(--fe-raised); border:1px solid var(--fe-border); }
.lp-guide .lp-score b { color:var(--fe-accent); font:400 2.6rem/1 'DM Serif Display',serif; }
.lp-guide .lp-score span { margin-left:8px; color:var(--fe-muted); font-weight:700; font-size:.88rem; }
.lp-guide .lp-bar { height:8px; margin-top:12px; border-radius:8px; background:var(--fe-border); overflow:hidden; }
.lp-guide .lp-bar i { display:block; height:100%; background:var(--fe-accent); transition:width .4s ease; }
.lp-guide .lp-found { display:grid; gap:8px; margin-top:12px; }
.lp-guide .lp-item { display:grid; grid-template-columns:30px minmax(0,1fr); gap:12px; padding:14px; border-radius:16px; border:1px solid var(--fe-border); background:var(--fe-raised); animation:lp-in .35s ease; }
@keyframes lp-in { from { opacity:0; transform:translateX(8px); } }
.lp-guide .lp-n { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#c4523e; color:#fff; font:800 .8rem 'Manrope',sans-serif; }
.lp-guide .lp-item b { display:block; font-size:.98rem; }
.lp-guide .lp-item > div > span { display:block; margin-top:3px; color:var(--fe-muted); font-size:.86rem; line-height:1.5; }
.lp-guide .lp-item em { display:block; margin-top:6px; color:var(--fe-accent); font-style:normal; font-weight:700; font-size:.84rem; }
.lp-guide .lp-hint, .lp-guide .lp-done { padding:14px; border-radius:14px; background:var(--fe-raised); color:var(--fe-muted); font-size:.9rem; }
.lp-guide .lp-done { background:color-mix(in srgb,var(--fe-accent) 14%,var(--fe-raised)); color:var(--fe-ink); font-weight:700; }
.lp-guide .lp-reveal { margin-top:12px; min-height:42px; padding:0 18px; border:1px solid var(--fe-border); border-radius:999px; background:var(--fe-surface); color:var(--fe-ink); font:700 .86rem 'Manrope',sans-serif; cursor:pointer; }

.lp-guide .lp-proof { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:22px 0; }
.lp-guide .lp-proof > div { display:grid; align-content:start; gap:4px; padding:16px; border-radius:16px; border:1px solid var(--fe-border); background:var(--fe-raised); color:var(--fe-muted); font-size:.88rem; line-height:1.55; }
.lp-guide .lp-proof b { color:var(--fe-ink); font-size:1rem; }
.lp-guide .lp-check { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:22px 0; }
.lp-guide .lp-check > div { display:flex; gap:12px; align-items:center; padding:14px; border-radius:14px; border:1px solid var(--fe-border); background:var(--fe-raised); color:var(--fe-ink); font-size:.9rem; line-height:1.45; }
.lp-guide .lp-check span { flex:none; display:grid; place-items:center; width:30px; height:30px; border-radius:10px; background:var(--fe-accent); color:var(--fe-raised); font:800 .85rem 'Manrope',sans-serif; }
@media (max-width:820px) {
  .lp-guide .lp-layout { grid-template-columns:1fr; }
  .lp-guide .lp-phone-wrap { max-width:340px; width:100%; margin:0 auto; }
  .lp-guide .lp-proof { grid-template-columns:1fr 1fr; }
}
@media (max-width:520px) {
  .lp-guide .lp-game { padding:16px; margin-left:-6px; margin-right:-6px; }
  .lp-guide .lp-proof, .lp-guide .lp-check { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { .lp-guide .lp-item { animation:none; } }
