/* LOOTR guide. Native details and the shared controller own all interactions. */
#page-help.lootr-help { --help-line:#35596b; --help-muted:#a2bfce; color:#eaf7ff; }
.lootr-help * { min-width:0; }
.lootr-help h1,.lootr-help h2,.lootr-help h3 { font-family:var(--font-display,'Barlow Condensed',sans-serif); font-weight:800; letter-spacing:-.025em; line-height:1.02; }
.lootr-help p { margin:0; color:var(--help-muted); font-size:13px; line-height:1.75; }
.help-eyebrow { display:block; color:#94d6e9; font-size:9px; font-weight:650; letter-spacing:.16em; line-height:1.4; }
.help-eyebrow::before { content:'✦'; margin-right:9px; color:#c0f4ff; }
.help-hero-copy,.help-hero-art { position:relative; z-index:1; }
.help-hero-copy { padding:28px 0 30px; }
.help-hero-copy h1 { margin:20px 0 18px; font-size:clamp(60px,6.3vw,88px); font-style:italic; text-transform:uppercase; }
.help-hero-copy h1 em { font-style:inherit; color:#a4e9ff; }
.help-hero-copy>p { max-width:390px; font-size:14px; }
.lootr-help-hero { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.04fr); align-items:center; gap:12px; border-bottom:1px solid var(--help-line); margin-bottom:40px; isolation:isolate; }
.lootr-help-hero::before { content:''; position:absolute; inset:-40px -22px 0 25%; z-index:-1; background:radial-gradient(ellipse at 60% 45%,#14658045,transparent 67%); pointer-events:none; }
.help-hero-art { aspect-ratio:1.12; max-height:430px; display:grid; place-items:center; overflow:hidden; }
.help-hero-art>img { position:relative; z-index:1; width:100%; max-width:none; height:auto; object-fit:contain; transform:rotate(-9deg); filter:drop-shadow(0 18px 22px #0005); }
.help-hero-word { position:absolute; top:12%; left:0; width:100%; text-align:center; color:transparent; -webkit-text-stroke:1px #76c8e31f; font-family:var(--font-display,'Barlow Condensed',sans-serif); font-size:clamp(90px,13vw,190px); font-weight:800; font-style:italic; letter-spacing:-.04em; }
.help-hero-orbit { position:absolute; width:78%; aspect-ratio:1; border:1px solid #81d8f324; border-radius:50%; transform:rotateX(63deg) rotate(-18deg); box-shadow:0 0 0 28px #83dbef08,0 0 0 52px #83dbef04; }
.help-art-caption { position:absolute; z-index:2; bottom:8%; left:0; width:100%; text-align:center; color:#83b1c7; font-size:7px; font-weight:600; letter-spacing:.15em; }
.help-art-caption i { margin:0 13px; font-style:normal; color:#8ce4fc; }
.help-hero-actions { display:flex; align-items:center; gap:10px 20px; flex-wrap:wrap; margin-top:26px; }
.help-primary-link,.help-secondary-link,.help-inline-link { display:inline-flex; justify-content:space-between; align-items:center; gap:14px; min-height:44px; font-size:11px; line-height:1.4; font-weight:600; }
.help-primary-link { padding:12px 16px; color:#062333; background:linear-gradient(135deg,#c7f6ff,#78d2eb); border:1px solid #bcefff; border-radius:5px; box-shadow:inset 0 1px #fff9,0 7px 24px #3fd5ff12; }
.help-primary-link:hover { background:#d5f9ff; }
.help-secondary-link,.help-inline-link { color:#bce7f5; }
.help-secondary-link:hover,.help-inline-link:hover { color:#fff; }
.help-primary-link>svg,.help-secondary-link>svg,.help-inline-link>svg,.help-answer-action svg,.help-quick-links>a>svg,.help-quick-links>button>svg { width:17px; height:17px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.help-secondary-link>svg,.help-inline-link>svg { color:#77d6f0; }
.lootr-help :is(a,button,summary):focus-visible { outline:2px solid #c4f5ff; outline-offset:4px; }
.help-section-heading h2 { margin:12px 0 0; font-size:clamp(36px,3.5vw,49px); }
.help-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:0; margin:24px 0 0; list-style:none; border-top:1px solid var(--help-line); border-bottom:1px solid var(--help-line); }
.help-steps>li { position:relative; padding:20px 25px 22px 0; display:flex; flex-direction:column; }
.help-steps>li+li { padding-left:25px; border-left:1px solid #3153647a; }
.help-steps>li:last-child { padding-right:0; }
.help-step-top { display:flex; justify-content:space-between; align-items:center; height:82px; margin-bottom:15px; }
.help-step-number { font-family:var(--font-display,'Barlow Condensed',sans-serif); font-size:63px; line-height:1; font-weight:800; font-style:italic; color:#6db1c755; -webkit-text-stroke:1px #8bd9ed40; }
.help-step-token { width:80px; height:80px; background:url('token.webp') center/contain no-repeat; filter:drop-shadow(0 7px 9px #0005); }
.help-step-chest { width:98px; height:80px; background:url('chest-selector-atlas.webp') 50% center/300% auto no-repeat; filter:drop-shadow(0 7px 9px #0005); }
.help-step-logo { width:75px; height:75px; background:url('logo.webp') center/contain no-repeat; filter:drop-shadow(0 7px 9px #0005); }
.help-steps h3 { margin:0 0 13px; font-size:30px; }
.help-steps p { font-size:12px; flex:1; }
.help-steps .help-inline-link { margin-top:15px; gap:9px; font-size:10px; align-self:flex-start; }
.help-preview-note { display:flex; align-items:center; gap:18px; padding:20px 22px; margin:24px 0 50px; background:linear-gradient(110deg,#0d344751,#05192410); border-left:2px solid #77d8f0; }
.help-preview-symbol { flex:none; display:grid; place-items:center; width:44px; height:44px; border:1px solid #7cc9df50; border-radius:50%; color:#b8effe; background:#1743573b; }
.help-preview-symbol>svg { width:19px; height:19px; }
.help-preview-note strong { display:block; margin-bottom:5px; font-size:14px; color:#d7edf8; }
.help-preview-note p { font-size:11px; }
.help-preview-note>.help-inline-link { flex:none; margin-left:auto; }
.help-answers-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; }
.help-answers-heading>p { font-size:11px; text-align:right; }
.help-faq-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px 34px; margin-top:28px; }
.help-faq-group { min-width:0; }
.help-faq-title { display:flex; align-items:center; gap:10px; min-height:44px; margin-bottom:8px; }
.help-faq-title>span:first-child { font-size:9px; font-variant-numeric:tabular-nums; color:#6b9fb5; }
.help-faq-title h3 { margin:0; font-size:27px; }
.help-faq-title>span:last-child { margin-left:auto; color:#7ebcd0; }
.help-faq-title svg { width:21px; height:21px; }
.help-answer { border-top:1px solid #315363; }
.help-answer:last-child { border-bottom:1px solid #315363; }
.help-answer>summary { display:flex; justify-content:space-between; align-items:center; gap:15px; min-height:64px; padding:17px 0; list-style:none; color:#c4dce9; font-size:12px; line-height:1.55; font-weight:500; }
.help-answer>summary::-webkit-details-marker { display:none; }
.help-answer>summary:hover { color:#fff; }
.help-answer-toggle { position:relative; display:block; flex:none; width:18px; height:18px; color:#7cbace; }
.help-answer-toggle::before,.help-answer-toggle::after { content:''; position:absolute; background:currentColor; left:4px; right:4px; top:8px; height:1px; }
.help-answer-toggle::after { transform:rotate(90deg); transition:transform 160ms; }
.help-answer[open] .help-answer-toggle::after { transform:rotate(0); }
.help-answer[open]>summary { color:#e5f8ff; }
.help-answer-body { padding:0 26px 20px 0; }
.help-answer-body>p { font-size:12px; line-height:1.8; }
.help-answer-action { display:flex; align-items:center; gap:10px; margin-top:10px; color:#a7e6f7; font-size:11px; font-weight:600; }
.help-answer-action>a,.help-answer-action>button { display:inline-flex; align-items:center; gap:10px; min-height:44px; text-align:left; line-height:1.5; }
.help-answer-action>a:hover,.help-answer-action>button:hover { color:#fff; }
.help-answer-action svg { width:14px; }
.help-quick-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; margin-top:45px; border-top:1px solid #315363; border-bottom:1px solid #315363; background:#0b2b3b38; }
.help-quick-links>a,.help-quick-links>button { display:flex; align-items:center; gap:13px; min-height:92px; padding:17px; text-align:left; color:#d1e9f6; }
.help-quick-links>a+*,.help-quick-links>button+* { border-left:1px solid #315363; }
.help-quick-links>a:hover,.help-quick-links>button:hover { background:#153e5055; color:#fff; }
.help-quick-links>a>span:first-child,.help-quick-links>button>span:first-child { color:#85cadf; flex:none; }
.help-quick-links svg.icon { width:23px; height:23px; }
.help-quick-links small { display:block; color:#749eb2; font-size:7px; letter-spacing:.1em; margin-bottom:7px; }
.help-quick-links strong { display:block; font-size:12px; line-height:1.4; font-weight:600; }
.help-quick-links>a>svg,.help-quick-links>button>svg { margin-left:auto; width:15px; color:#8ccee3; }
@media(max-width:1100px) and (min-width:761px) {
  .help-hero-copy h1 { font-size:64px; }
  .help-hero-copy>p { font-size:12px; }
  .help-hero-actions { gap:5px 14px; margin-top:20px; }
  .help-primary-link,.help-secondary-link { font-size:10px; }
  .help-steps>li { padding-right:18px; }
  .help-steps>li+li { padding-left:18px; }
  .help-steps h3 { font-size:27px; }
  .help-faq-title h3 { font-size:24px; }
  .help-quick-links>a,.help-quick-links>button { padding:15px 10px; gap:9px; }
  .help-quick-links strong { font-size:11px; }
}
@media(max-width:760px) {
  .lootr-help-hero { grid-template-columns:minmax(0,1fr) minmax(0,.85fr); gap:0; margin-bottom:29px; }
  .help-hero-copy { padding:12px 0 24px; }
  .help-hero-copy h1 { font-size:54px; }
  .help-hero-copy>p { font-size:12px; }
  .help-hero-art { aspect-ratio:.9; }
  .help-hero-art>img { width:100%; }
  .help-art-caption { font-size:6px; letter-spacing:.05em; }
  .help-art-caption i { margin:0 6px; }
  .help-hero-actions { gap:7px; margin-top:20px; }
  .help-primary-link { padding:11px 13px; }
  .help-secondary-link { font-size:10px; }
  .help-steps>li { padding-right:15px; }
  .help-steps>li+li { padding-left:15px; }
  .help-steps h3 { font-size:25px; }
  .help-step-top { height:65px; }
  .help-step-number { font-size:48px; }
  .help-step-token,.help-step-chest,.help-step-logo { width:65px; height:65px; }
  .help-preview-note { gap:12px; padding:17px 15px; }
  .help-preview-note strong { font-size:12px; }
  .help-preview-note>.help-inline-link { font-size:10px; }
  .help-faq-groups { gap:24px; }
  .help-faq-title h3 { font-size:24px; }
  .help-quick-links>a,.help-quick-links>button { padding:13px 10px; gap:8px; }
  .help-quick-links strong { font-size:10px; }
  .help-quick-links svg.icon { width:19px; }
}
@media(max-width:600px) {
  .lootr-help-hero { display:flex; flex-direction:column; align-items:stretch; gap:0; margin-bottom:28px; }
  .lootr-help-hero::before { inset:20% -14px 0; }
  .help-hero-copy { padding:5px 0 0; }
  .help-eyebrow { font-size:8px; }
  .help-hero-copy h1 { font-size:62px; margin:15px 0; }
  .help-hero-copy>p { max-width:340px; font-size:12px; }
  .help-hero-actions { margin-top:17px; gap:10px 17px; }
  .help-primary-link { font-size:11px; padding:12px 14px; }
  .help-secondary-link { font-size:10px; gap:8px; }
  .help-hero-art { aspect-ratio:1.8; height:auto; max-height:225px; margin:10px 0 4px; }
  .help-hero-art>img { width:90%; transform:rotate(-6deg); margin-top:-15px; }
  .help-hero-word { top:3%; font-size:125px; }
  .help-hero-orbit { width:65%; }
  .help-art-caption { bottom:10px; font-size:6px; }
  .help-section-heading h2 { font-size:37px; margin-top:12px; }
  .help-steps { display:block; margin-top:19px; }
  .help-steps>li,.help-steps>li+li { display:grid; grid-template-columns:52px minmax(0,1fr); gap:0 17px; padding:22px 0; border-left:0; }
  .help-steps>li+li { border-top:1px solid #3153647a; }
  .help-step-top { display:block; height:auto; grid-column:1; grid-row:1/4; margin:0; }
  .help-step-number { display:block; font-size:48px; margin-bottom:17px; }
  .help-step-token,.help-step-chest,.help-step-logo { display:block; width:52px; height:55px; }
  .help-steps h3 { grid-column:2; font-size:30px; margin:0 0 10px; }
  .help-steps p { grid-column:2; font-size:12px; }
  .help-steps .help-inline-link { grid-column:2; font-size:10px; margin-top:9px; }
  .help-preview-note { display:grid; grid-template-columns:35px minmax(0,1fr); gap:0 12px; margin:20px 0 33px; padding:17px 14px; }
  .help-preview-symbol { width:34px; height:34px; }
  .help-preview-symbol>svg { width:15px; }
  .help-preview-note strong { font-size:13px; line-height:1.5; }
  .help-preview-note p { font-size:11px; }
  .help-preview-note>.help-inline-link { grid-column:2; margin:4px 0 0; justify-self:start; font-size:11px; }
  .help-answers-heading { display:block; }
  .help-answers-heading>p { margin-top:15px; text-align:left; }
  .help-answers-heading>p br { display:none; }
  .help-faq-groups { grid-template-columns:1fr; gap:25px; margin-top:22px; }
  .help-faq-title { margin-bottom:6px; }
  .help-faq-title h3 { font-size:28px; }
  .help-answer>summary { min-height:62px; font-size:12px; gap:15px; }
  .help-answer-body { padding-right:20px; }
  .help-answer-body>p { font-size:12px; }
  .help-quick-links { grid-template-columns:1fr; margin-top:29px; }
  .help-quick-links>a,.help-quick-links>button { padding:18px 13px; min-height:81px; gap:14px; }
  .help-quick-links>a+*,.help-quick-links>button+* { border-left:0; border-top:1px solid #315363; }
  .help-quick-links strong { font-size:13px; }
  .help-quick-links small { font-size:7px; }
  .help-quick-links svg.icon { width:23px; }
}
@media(max-width:360px) {
  .help-hero-copy h1 { font-size:55px; }
  .help-hero-actions { gap:8px; }
  .help-primary-link { padding:11px; gap:10px; font-size:10px; }
  .help-secondary-link { font-size:9px; gap:5px; }
  .help-secondary-link>svg { width:14px; }
  .help-hero-art { aspect-ratio:1.7; }
  .help-hero-art>img { width:89%; margin-top:-10px; }
  .help-steps>li,.help-steps>li+li { grid-template-columns:43px minmax(0,1fr); gap:0 14px; }
  .help-step-number { font-size:42px; }
  .help-step-token,.help-step-chest,.help-step-logo { width:44px; height:48px; }
  .help-steps h3 { font-size:28px; }
  .help-faq-title h3 { font-size:26px; }
}
@media(prefers-reduced-motion:reduce) { .help-answer-toggle::after { transition:none; } }