/* Resources (mobile) — a library you can scan: index tiles, Iris picks rail,
   sector decks behind tabs, demo videos, and the "notify me" card. */

/* ---------- hero index: what's in the library, one tap to each shelf ---------- */
.m-rs-index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:4px}
.m-rs-index a{position:relative;display:flex;flex-direction:column;gap:4px;padding:14px 12px 12px;border-radius:var(--rad-sm);
  border:1px solid var(--line2);background:var(--surface);color:var(--fg2);overflow:hidden}
.m-rs-index a::after{content:"";position:absolute;inset:auto -30% -60% auto;width:90px;height:90px;border-radius:50%;
  background:radial-gradient(circle,rgba(var(--tc),.28),transparent 70%);pointer-events:none}
.m-rs-index b{font-family:var(--serif);font-weight:400;font-size:1.9rem;line-height:1;color:var(--ink)}
.m-rs-index span{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgb(var(--tc))}
.m-rs-index a:active{background:var(--surface2)}

/* ---------- section heads ---------- */
.m-rs-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.m-rs-head .m-kick{margin:0}
/* Iris orb — booking.js draws the chatbot's animated orb into a canvas here */
.m-rs-orb{position:relative;flex:none;width:30px;height:30px}
.m-rs-orb canvas{position:absolute;inset:0;width:100%;height:100%;display:block}

/* ---------- Iris picks: a swipe rail ---------- */
.m-rs-rail{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  margin:20px calc(-1 * var(--gut)) 0;padding:4px var(--gut) 6px;scroll-padding-inline:var(--gut);scrollbar-width:none}
.m-rs-rail::-webkit-scrollbar{display:none}
.m-rs-pick{flex:0 0 86%;scroll-snap-align:start;display:flex;flex-direction:column;gap:12px;padding:18px 17px;
  border-radius:var(--rad);border:1px solid var(--line2);color:inherit;
  background:radial-gradient(120% 70% at 100% 0%,rgba(var(--tc),.16),transparent 60%),var(--surface)}
.m-rs-pick-top{display:flex;align-items:center;justify-content:space-between}
.m-rs-pick-n{font-family:var(--mono);font-size:.7rem;color:var(--fg3)}
.m-rs-tag{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;border-radius:999px;
  color:rgb(var(--tc));background:rgba(var(--tc),.1);border:1px solid rgba(var(--tc),.35)}
.m-rs-pick h3{font-family:var(--serif);font-weight:400;font-size:1.32rem;line-height:1.22;color:var(--ink);margin:0}
.m-rs-pick p{font-size:.9rem;line-height:1.58;margin:0}
.m-rs-why{margin-top:auto;display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:start;padding:12px;border-radius:12px;
  background:rgba(255,45,149,.06);border:1px solid rgba(255,45,149,.22);font-size:.82rem;line-height:1.5;color:var(--fg2)}
.m-rs-why .m-rs-orb{width:26px;height:26px;margin-top:-2px}
.m-rs-why b{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:#ff66b5;font-weight:500;margin-bottom:3px}
.m-rs-go{font-size:.86rem;font-weight:600;color:rgb(var(--tc))}
.m-rs-dots{display:flex;justify-content:center;gap:6px;margin-top:14px}
.m-rs-dots i{width:6px;height:6px;border-radius:3px;background:var(--line2);transition:width .3s,background .3s}
.m-rs-dots i.is-on{width:20px;background:var(--ac)}

/* ---------- decks: segmented tabs + rows ---------- */
.m-rs-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin:20px 0 14px;border-radius:14px;
  border:1px solid var(--line2);background:rgba(255,255,255,.02)}
.m-rs-tab{appearance:none;cursor:pointer;border:0;border-radius:10px;padding:11px 8px;min-height:var(--tap);
  display:flex;align-items:center;justify-content:center;gap:8px;background:transparent;
  font:500 .86rem var(--sans);color:var(--fg3);transition:background .25s,color .25s}
.m-rs-tab i{width:7px;height:7px;border-radius:50%;background:rgb(var(--tc));box-shadow:0 0 8px rgb(var(--tc))}
.m-rs-tab em{font-style:normal;font-family:var(--mono);font-size:.66rem;opacity:.8}
.m-rs-tab[aria-selected="true"]{color:var(--ink);background:rgba(var(--tc),.12);box-shadow:inset 0 0 0 1px rgba(var(--tc),.4)}
.m-rs-panel[hidden]{display:none}
.m-rs-panel-note{font-size:.84rem;color:var(--fg3);margin:0 0 12px}

.m-rs-decks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.m-rs-decks li{margin:0}
.m-rs-deck{display:grid;grid-template-columns:54px minmax(0,1fr) 18px;gap:14px;align-items:center;padding:12px 14px 12px 12px;
  border-radius:var(--rad-sm);border:1px solid var(--line);background:var(--surface);color:inherit;transition:border-color .25s,background .25s}
.m-rs-deck:active{background:var(--surface2);border-color:rgba(var(--acc),.5)}
.m-rs-sw{position:relative;width:54px;height:66px;border-radius:9px;overflow:hidden;
  background:linear-gradient(160deg,rgba(var(--acc),.55),rgba(var(--acc),.08) 70%),#0B1222;border:1px solid rgba(var(--acc),.45)}
.m-rs-sw::before{content:"";position:absolute;width:30px;height:30px;right:-8px;top:-8px;border-radius:50%;
  background:radial-gradient(circle,rgba(var(--acc),.95),transparent 70%)}
.m-rs-sw b{position:absolute;left:7px;bottom:6px;font-family:var(--mono);font-weight:500;font-size:.66rem;color:#fff;opacity:.9}
.m-rs-deck-tx{min-width:0}
.m-rs-deck-tx span{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:rgb(var(--acc));margin-bottom:4px}
.m-rs-deck-tx h3{font-size:.98rem;font-weight:600;line-height:1.3;color:var(--ink);margin:0 0 4px}
.m-rs-deck-tx p{font-size:.8rem;line-height:1.5;color:var(--fg3);margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.m-rs-arrow{width:18px;height:18px;color:var(--fg3)}

/* ---------- demo videos ---------- */
.m-rs-videos{display:flex;flex-direction:column;gap:14px;margin-top:20px}
.m-rs-video{display:block;border-radius:var(--rad);border:1px solid var(--line2);background:var(--surface);color:inherit;overflow:hidden}
.m-rs-thumb{position:relative;aspect-ratio:16/9;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(70% 90% at 30% 20%,rgba(229,162,75,.35),transparent 60%),
             radial-gradient(60% 80% at 90% 100%,rgba(21,242,242,.25),transparent 60%),#0A0F1C}
.m-rs-thumb::before{content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:22px 22px}
.m-rs-vlabel{position:absolute;left:12px;top:12px;font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--amber)}
.m-rs-play{position:relative;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.95);box-shadow:0 0 0 8px rgba(255,255,255,.08),0 12px 30px -8px rgba(0,0,0,.8)}
.m-rs-play svg{width:20px;height:20px;margin-left:3px;fill:#05080F}
.m-rs-dur{position:absolute;right:12px;bottom:12px;font-family:var(--mono);font-size:.68rem;color:var(--ink);
  padding:4px 8px;border-radius:6px;background:rgba(5,8,15,.75);border:1px solid var(--line2)}
.m-rs-vbody{padding:16px 17px 18px}
.m-rs-vbody h3{font-family:var(--serif);font-weight:400;font-size:1.2rem;line-height:1.25;color:var(--ink);margin:0 0 8px}
.m-rs-vbody p{font-size:.88rem;line-height:1.58;margin:0 0 12px}
.m-rs-vbody .m-rs-go{--tc:229,162,75}

/* ---------- notify me ---------- */
.m-rs-nl{position:relative;overflow:hidden;padding:24px 18px;border-radius:var(--rad);border:1px solid rgba(var(--acr),.35);
  background:radial-gradient(90% 80% at 100% 0%,rgba(var(--acr),.18),transparent 65%),radial-gradient(80% 70% at 0% 100%,rgba(155,123,255,.16),transparent 65%),var(--bg2)}
.m-rs-nl h2{margin-bottom:18px}
.m-rs-form{display:flex;flex-direction:column;gap:8px}
.m-rs-form input{width:100%;min-height:var(--tap);padding:0 15px;border-radius:12px;border:1px solid var(--line2);
  background:rgba(5,8,15,.6);color:var(--ink);font:400 1rem var(--sans)}   /* 16px: no iOS zoom on focus */
.m-rs-form input:focus{outline:none;border-color:var(--ac);box-shadow:0 0 0 3px rgba(var(--acr),.18)}
.m-rs-form .m-btn{width:100%}
.m-rs-msg{margin:12px 0 0;font-size:.86rem}
.m-rs-msg.ok{color:#3FD9A4}
.m-rs-msg.err{color:#F0544A}

@media (prefers-reduced-motion:reduce){.m-rs-orb{animation:none}.m-rs-dots i,.m-rs-tab,.m-rs-deck{transition:none}}