/* Sample board sales layer. Loaded on /sample-board only. */
.sb-tour{font:600 .82rem var(--sans);background:none;border:0;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:0}

/* entry screen */
.ss-entry{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:16px;background:rgba(4,10,20,.62);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.ss-box{width:100%;max-width:540px;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:24px;padding:28px;box-shadow:0 30px 80px -20px rgba(0,0,0,.5);font-family:var(--sans)}
.ss-eyebrow{margin:0 0 8px;font:700 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--link)}
.ss-box h2{margin:0 0 10px;font:800 1.55rem/1.15 var(--disp);color:var(--text)}
.ss-box>p{margin:0 0 18px;color:var(--soft);line-height:1.5}
.ss-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ss-choice{display:grid;gap:6px;text-align:left;padding:18px 16px;border-radius:18px;border:2px solid var(--line);background:var(--field);color:var(--text);cursor:pointer;font:inherit;transition:border-color .15s,transform .15s}
.ss-choice:hover,.ss-choice:focus-visible{border-color:var(--accent);transform:translateY(-1px);outline:none}
.ss-choice b{font:700 1rem var(--sans)}.ss-choice span{font-size:.86rem;color:var(--soft);line-height:1.4}
.ss-box .ss-fine{margin:16px 0 0;font-size:.78rem;color:var(--soft)}

/* Eko-style front door: video in front of the board, choices over the video */
.ss-tv{position:fixed;inset:0;z-index:85;display:grid;place-items:center;padding:20px;background:rgba(4,10,20,.86);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);font-family:var(--sans)}
.ss-tv-stage{position:relative;width:min(100%,calc((100vh - 40px) * 16 / 9),1040px);aspect-ratio:16/9;border-radius:22px;overflow:hidden;background:#000;box-shadow:0 30px 90px -20px rgba(0,0,0,.7)}
.ss-tv.is-tall .ss-tv-stage{width:min(100%,calc((100vh - 40px) * 9 / 16),460px);aspect-ratio:9/16}
.ss-tv-v{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.ss-tv-bar{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;background:linear-gradient(rgba(4,10,20,.6),rgba(4,10,20,0));color:#fff;z-index:2}
.ss-tv-now{font:700 .78rem var(--mono);letter-spacing:.06em;text-transform:uppercase;opacity:.9}
.ss-tv-btns{display:flex;gap:8px}
.ss-tv-vb{display:inline-flex;align-items:center;gap:6px;background:rgba(10,22,40,.55);color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:0 16px;min-height:40px;font:700 .85rem var(--sans);cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ss-tv-vb:hover{background:rgba(33,118,214,.8)}.ss-tv-vb svg{width:14px;height:14px}
.ss-tv-prog{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.18);z-index:2}.ss-tv-prog i{display:block;height:100%;width:0;background:#58D68D;transition:width .25s linear}
.ss-tv.is-picking .ss-tv-bar,.ss-tv.is-picking .ss-tv-prog{display:none}
.ss-tv-pick{position:absolute;inset:0;z-index:3;display:none;flex-direction:column;justify-content:center;padding:28px 40px;background:rgba(6,16,32,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#fff;overflow:auto}
.ss-tv.is-first .ss-tv-pick{background:rgba(6,16,32,.93)}
.ss-tv-lede{margin:-8px 0 20px;max-width:58ch;font-size:1.02rem;line-height:1.5;color:rgba(255,255,255,.86)}
.ss-tv.is-picking .ss-tv-pick{display:flex}
.ss-tv-eyebrow{margin:0 0 6px;font:700 .72rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#5FA9FB}
.ss-tv-pick h2{margin:0 0 18px;font:800 clamp(1.25rem,2.6vw,1.9rem)/1.15 var(--disp);color:#fff;max-width:30ch}
.ss-tv-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin-bottom:16px}
.ss-tv-opt{display:flex;align-items:center;gap:12px;text-align:left;padding:12px 14px;min-height:56px;border-radius:16px;border:1px solid rgba(255,255,255,.22);background:#13243F;color:#fff;cursor:pointer;font:inherit;transition:background .15s,border-color .15s,transform .15s}
.ss-tv-opt:hover,.ss-tv-opt:focus-visible{background:rgba(33,118,214,.55);border-color:#5FA9FB;transform:translateY(-1px);outline:none}
.ss-tv-num{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#2176D6;color:#fff;font:700 .8rem var(--mono)}
.ss-tv-opt.seen{opacity:.85}.ss-tv-opt.seen .ss-tv-num{background:#58D68D;color:#08261A;font-size:.95rem}
.ss-tv-txt{display:grid;gap:2px}.ss-tv-txt b{font:700 .95rem/1.2 var(--sans)}.ss-tv-txt small{font-size:.78rem;opacity:.8}
.ss-tv-acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ss-tv-board,.ss-tv-lc{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;border:0;background:#fff;color:#0A1628;font:700 .95rem var(--sans);cursor:pointer;text-decoration:none}
.ss-tv-lc{background:#2176D6;color:#fff}
.ss-tv-board.ghost,.ss-tv-lc.ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.45)}
.ss-tv-start{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.ss-tv-start .ss-tv-lede{margin:-6px 0 6px}
.ss-tv-play{display:inline-flex;align-items:center;gap:14px;min-height:60px;padding:0 28px 0 12px;border-radius:999px;border:0;background:#2176D6;color:#fff;font:800 1.15rem var(--sans);cursor:pointer;box-shadow:0 16px 36px -12px rgba(33,118,214,.8)}
.ss-tv-play:hover{filter:brightness(1.08)}.ss-tv-pi{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fff;color:#2176D6}.ss-tv-pi svg{width:14px;height:14px;margin-left:2px}
.ss-tv-fine{margin:12px 0 0;font-size:.78rem;opacity:.75}
body.ss-watching{overflow:hidden}
body.ss-watching .ss-sticky{display:none}
.ss-card .ss-show{margin-top:0;color:var(--link)}
@media (max-width:720px){
  .ss-tv{padding:0}
  .ss-tv .ss-tv-stage,.ss-tv.is-tall .ss-tv-stage{width:100%;height:100%;aspect-ratio:auto;border-radius:0}
  .ss-tv-pick{justify-content:flex-end;padding:20px 16px calc(20px + env(safe-area-inset-bottom))}
  .ss-tv-lede{font-size:.92rem;margin-bottom:14px}
  .ss-tv-start{align-items:stretch}.ss-tv-play{justify-content:center}
  .ss-tv-opts{grid-template-columns:1fr;gap:8px;margin-bottom:12px}
  .ss-tv-opt{min-height:52px;padding:10px 12px}
  .ss-tv-acts{flex-direction:column;align-items:stretch}
}

/* walk */
.ss-ring{position:fixed;z-index:70;border-radius:22px;box-shadow:0 0 0 3px var(--accent2),0 0 0 9999px rgba(4,10,20,.5);pointer-events:none;transition:top .2s,left .2s,width .2s,height .2s}
.ss-card{position:fixed;z-index:75;width:340px;max-width:calc(100vw - 32px);background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:0 24px 60px -16px rgba(0,0,0,.55);font-family:var(--sans)}
.ss-card.ss-center{top:50%!important;left:50%!important;transform:translate(-50%,-50%);width:420px}
.ss-card.ss-end{box-shadow:0 0 0 9999px rgba(4,10,20,.55),0 24px 60px -16px rgba(0,0,0,.55)}
.ss-n{margin:0 0 6px;font:700 .7rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--link)}
.ss-card h3{margin:0 0 8px;font:800 1.2rem/1.2 var(--disp);text-transform:none;letter-spacing:normal;color:var(--text)}
.ss-card p{margin:0 0 16px;color:var(--soft);line-height:1.5;font-size:.93rem}
.ss-acts{display:flex;justify-content:space-between;align-items:center;gap:10px}
.ss-skip,.ss-close{background:none;border:0;color:var(--soft);font:600 .88rem var(--sans);cursor:pointer;padding:8px 4px}
.ss-close{display:block;margin:10px auto 0}
.ss-next,.ss-go{background:var(--accent);color:#fff;border:0;border-radius:999px;padding:11px 20px;font:700 .92rem var(--sans);cursor:pointer;text-decoration:none;text-align:center}
.ss-end-acts{flex-direction:column;align-items:stretch}
.ss-price{color:var(--link);font:600 .9rem var(--sans);text-align:center;padding:6px}

/* sticky CTA: pinned button on desktop, slim bar on phone above the tab bar */
.ss-sticky{position:fixed;right:22px;bottom:22px;z-index:40;display:flex;align-items:center;gap:12px;font-family:var(--sans)}
.ss-st-t{display:none}
.ss-st-b{display:inline-block;background:var(--accent);color:#fff;text-decoration:none;font:700 .92rem var(--sans);padding:13px 20px;border-radius:999px;box-shadow:0 14px 34px -10px rgba(33,118,214,.7)}
.ss-st-b:hover{filter:brightness(1.08)}
.ss-sticky[hidden],.ss-ring[hidden],.ss-card[hidden]{display:none}
body.ss-walking .ss-sticky{display:none}
@media (max-width:720px){
  .ss-box{padding:22px 18px;border-radius:20px}.ss-box h2{font-size:1.3rem}
  .ss-choices{grid-template-columns:1fr}
  .askbox .ask-chips .chip-q:nth-child(n+3){display:none}  /* keep Your top 5 in the first screen */
  .ss-sticky{left:8px;right:8px;bottom:8px;justify-content:space-between;background:var(--pop);color:var(--poptext);border-radius:16px;padding:8px 8px 8px 14px;box-shadow:0 10px 30px -8px rgba(0,0,0,.45)}
  .ss-st-t{display:none}
  .ss-st-b{flex:1;text-align:center;font-size:.86rem;padding:11px 12px;border-radius:12px;box-shadow:none}
  .ss-sticky{padding:6px}
  body{padding-bottom:84px}
  body.ss-has-nav{padding-bottom:150px}
  .ss-card.ss-sheet{left:8px!important;right:8px;top:auto!important;bottom:8px;width:auto;max-width:none;border-radius:20px}
  .ss-card.ss-center{width:calc(100vw - 32px)}
  .ss-tv{padding:8px}.ss-tv-box{padding:12px 12px 10px;border-radius:18px}
  .ss-tv-t{font-size:1.05rem;margin-bottom:8px}
  .ss-tv-box.is-tall .ss-tv-frame{max-height:58vh;max-height:58dvh}
  .ss-tv-dots{grid-template-columns:repeat(5,auto);justify-content:center;gap:10px;margin:10px 0 6px}
  .ss-tv-dot{padding:0;border:0;background:none}.ss-tv-dot b{display:none}
  .ss-tv-dot span{width:30px;height:30px;font-size:.8rem}
}