/* LIMINALsubTEXT 2.7.0
   Behind everything: a slow drive past a rainy pine treeline (three image layers + rain in code).
   Then: the wide refuge/ruins image with the large logo in its dark centre, Preserve buttons on the
   calm left, Protect buttons on the worn right, and the Trends Index screensaver underneath. */
html body.lst-canvas{background:#06090c}
.lst-site.lst-v27{position:relative;min-height:100vh;background:transparent;isolation:isolate}

/* ---------- the drive ---------- */
.lst-drive{position:fixed;inset:0;z-index:0;overflow:hidden;background:#0b1015;pointer-events:none}
.lst-drive-layer{position:absolute;left:0;background-repeat:repeat-x;background-size:auto 100%;background-position:0 0;will-change:transform}
.lst-drive-sky{top:0;height:100vh;width:calc(100vw + 132.43vh);animation:lst-drive-sky 420s linear infinite;opacity:.9}
.lst-drive-far{bottom:22vh;height:46vh;width:calc(100vw + 62.32vh);animation:lst-drive-far 140s linear infinite;opacity:.85}
.lst-drive-near{bottom:0;height:72vh;width:calc(100vw + 95.35vh);animation:lst-drive-near 46s linear infinite}
@keyframes lst-drive-sky{to{transform:translate3d(-132.43vh,0,0)}}
@keyframes lst-drive-far{to{transform:translate3d(-62.32vh,0,0)}}
@keyframes lst-drive-near{to{transform:translate3d(-95.35vh,0,0)}}
@keyframes lst-drive-near-m{to{transform:translate3d(-68.86vh,0,0)}}
@keyframes lst-drive-far-m{to{transform:translate3d(-46.06vh,0,0)}}
.lst-rain{position:absolute;inset:0;width:100%;height:100%}
.lst-drive-shade{position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 42%,rgba(5,8,11,.3),rgba(5,8,11,.6) 70%,rgba(4,6,8,.78)),linear-gradient(180deg,rgba(6,9,12,.35),rgba(6,9,12,.15) 40%,rgba(5,7,9,.7))}
html.lst-still .lst-drive-layer{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.lst-drive-layer{animation:none}}

/* ---------- page ---------- */
.lst-v27 .lst-home{position:relative;z-index:1;max-width:1320px;margin:0 auto;padding:22px 40px 30px}
.lst-v27 .lst-intro{text-align:center;padding:4px 90px 0}
.lst-v27 .lst-cinematic-line{margin:8px 0 0;font:400 clamp(17px,1.6vw,23px)/1.35 Georgia,'Times New Roman',serif;letter-spacing:-.01em;color:#ece8de;text-shadow:0 2px 14px #000c}
.lst-v27 .lst-meaning{position:relative;display:inline-block;font-size:11px;line-height:1.7;color:#e4cb92;z-index:10;text-align:left}
.lst-v27 .lst-meaning summary{cursor:pointer;list-style:none;letter-spacing:.08em;border-bottom:1px dotted #b9a67d;padding:3px 0}
.lst-v27 .lst-meaning summary::-webkit-details-marker{display:none}
.lst-v27 .lst-meaning summary:after{content:' +';color:#94c9c8}
.lst-v27 .lst-meaning[open] summary:after{content:' −'}
.lst-v27 .lst-meaning>p{display:none;position:absolute;left:50%;transform:translateX(-50%);top:100%;width:min(370px,calc(100vw - 40px));margin:8px 0 0;font-size:13px;color:#eee8dc;background:#101a20f2;padding:18px 20px;border:1px solid #8e947a;box-shadow:0 15px 40px #000a;line-height:1.75;white-space:normal}
.lst-v27 .lst-meaning:hover>p,.lst-v27 .lst-meaning:focus-within>p,.lst-v27 .lst-meaning[open]>p{display:block}

/* ---------- image + two lanes ---------- */
.lst-v27 .lst-split{display:grid;grid-template-columns:minmax(260px,1fr) minmax(0,720px) minmax(260px,1fr);gap:26px;align-items:center;margin-top:18px}
.lst-v27 .lst-hero{position:relative;margin:0;text-align:center}
.lst-v27 .lst-hero picture{display:block;-webkit-mask-image:radial-gradient(ellipse 60% 58% at 50% 50%,#000 58%,transparent 100%);mask-image:radial-gradient(ellipse 60% 58% at 50% 50%,#000 58%,transparent 100%)}
.lst-v27 .lst-art{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.lst-v27 .lst-hero-logo{position:absolute;z-index:2;left:47.1%;top:46%;height:72%;transform:translate(-50%,-50%);display:block;filter:drop-shadow(0 6px 24px #000)}
.lst-v27 .lst-hero-logo img{display:block;height:100%;width:auto}
.lst-v27 .lst-hero figcaption{margin:2px auto 0;font-size:10.5px;letter-spacing:.04em;color:#9ea7a5;text-shadow:0 1px 8px #000}
.lst-v27 .lst-side{display:flex;flex-direction:column;gap:10px;min-width:0}
.lst-v27 .lst-side .lst-kicker{margin:0 0 4px;font-size:10px;letter-spacing:.17em;text-shadow:0 1px 8px #000}

/* Left lane — Preserve: archives, safe places, protection resources. Calm, natural, kept. */
.lst-v27 .lst-side-left .lst-kicker{color:#cdbf86}
.lst-v27 .lst-side-left .ts-btn{border-radius:12px;border-color:#a9b98a40;background:linear-gradient(120deg,rgba(28,40,24,.5),rgba(10,15,10,.78)),url('scene/tex-preserve.webp') center/360px;box-shadow:inset 0 1px 0 #f2ecc612,0 8px 26px #0007}
.lst-v27 .lst-side-left .ts-btn strong{color:#eef0dc;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:15px;letter-spacing:.01em}
.lst-v27 .lst-side-left .ts-btn small{color:#b9c39c}
.lst-v27 .lst-side-left .ts-arrow{color:#d6c98f}
.lst-v27 .lst-side-left .ts-btn.is-feature{border-color:#d2bd7a8c;box-shadow:inset 0 1px 0 #f2ecc61c,0 0 22px #d2bd7a14,0 8px 26px #0007}
.lst-v27 .lst-side-left .ts-btn.is-feature small{color:#e2cf8e}
.lst-v27 .lst-side-left a.ts-btn:hover,.lst-v27 .lst-side-left button.ts-btn:hover,.lst-v27 .lst-side-left .ts-btn:focus-visible{border-color:#d8e2a8b0;background:linear-gradient(120deg,rgba(44,60,34,.48),rgba(14,20,12,.72)),url('scene/tex-preserve.webp') center/360px}

/* Right lane — Protect: the concern, the reason to protect yourself. Worn steel, burned, survived. */
.lst-v27 .lst-side-right .lst-kicker{color:#d79a63}
.lst-v27 .lst-side-right .ts-btn{border-radius:2px;border-color:#a7aeb83d;background:linear-gradient(120deg,rgba(12,13,16,.42),rgba(6,6,8,.72)),url('scene/tex-protect.webp') center/360px;box-shadow:inset 0 1px 0 #ffffff14,inset 0 -2px 0 #0009,0 8px 26px #0008}
.lst-v27 .lst-side-right .ts-btn strong{color:#e6e8ea;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:600;white-space:nowrap}
.lst-v27 .lst-side-right .ts-btn small{color:#b8aa9c}
.lst-v27 .lst-side-right .ts-arrow{color:#d79a63}
.lst-v27 .lst-side-right .ts-btn.is-feature{border-color:#c9773c99;box-shadow:inset 0 1px 0 #ffffff14,inset 0 -2px 0 #0009,0 0 22px #c9773c1f,0 8px 26px #0008}
.lst-v27 .lst-side-right .ts-btn.is-feature small{color:#e2a46e}
.lst-v27 .lst-side-right a.ts-btn:hover,.lst-v27 .lst-side-right .ts-btn:focus-visible{border-color:#e08a4ab3;background:linear-gradient(120deg,rgba(30,20,14,.4),rgba(8,7,8,.68)),url('scene/tex-protect.webp') center/360px}
.lst-v27 .ts-btn.is-soon{opacity:.74}

/* ---------- trends screensaver (under the image) ---------- */
.lst-v27 .lst-saver{position:relative;display:block;width:100%;height:clamp(180px,24vh,230px);padding:0;margin:22px 0 0;border:1px solid #afc8cf2e;border-radius:6px;overflow:hidden;cursor:pointer;background:linear-gradient(180deg,rgba(5,9,12,.72),rgba(5,9,12,.86));-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);box-shadow:inset 0 1px 0 #e5eaeb0b,0 18px 50px #0007;color:#e8ece9;text-align:left;font:inherit}
.lst-v27 .lst-saver canvas{position:absolute;inset:0;display:block}
.lst-v27 .lst-saver:hover,.lst-v27 .lst-saver:focus-visible{border-color:#b7d7d28a}
.lst-v27 .lst-saver:focus-visible{outline:2px solid #8fd3d8;outline-offset:3px}
.lst-v27 .lst-saver-label{position:absolute;left:46px;top:16px;font-size:11px;letter-spacing:.08em;color:#9fb0b3}
.lst-v27 .lst-saver-label b{font-weight:600;color:#eef0ea;letter-spacing:.04em;margin-right:6px}
.lst-v27 .lst-saver-cta{position:absolute;right:18px;top:12px;padding:7px 12px;border:1px solid #afc8cf47;border-radius:999px;background:#0b0a11b3;font-size:11px;letter-spacing:.05em;color:#cfe6e6;transition:border-color .2s,color .2s}
.lst-v27 .lst-saver:hover .lst-saver-cta{border-color:#8fd3d8;color:#fff}
.lst-v27 .lst-saver-legend{position:absolute;top:18px;right:200px;display:flex;flex-wrap:wrap;gap:4px 16px;justify-content:flex-end;pointer-events:none}
.lst-v27 .lst-saver-legend i{font-style:normal;font-size:10px;letter-spacing:.04em;color:var(--c);opacity:.18;transition:opacity .5s}
.lst-v27 .lst-saver-legend i.is-on{opacity:.95}
.lst-v27 .ts-cross{position:relative;z-index:1;margin-top:18px}
.lst-v27 .ts-cross a{text-shadow:0 1px 8px #000}

/* ---------- full Trends Index layer ---------- */
.lst-trends-layer{position:fixed;inset:0;z-index:9980;overflow-y:auto;overscroll-behavior:contain;background:#05080b;visibility:hidden;opacity:0;transition:opacity .2s,visibility 0s .2s}
.lst-trends-layer.is-open{visibility:visible;opacity:1;transition:opacity .2s}
html.lst-trends-open,html.lst-trends-open body{overflow:hidden}
html.lst-trends-open .tb-dock{display:none}
.lst-trends-bar{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 24px;border-bottom:1px solid #afc8cf26;background:#05080bf2;font-size:12px;letter-spacing:.06em;color:#c9d4d3}
body.admin-bar .lst-trends-layer{top:32px}
.lst-trends-bar button{appearance:none;padding:8px 14px;border:1px solid #afc8cf47;border-radius:999px;background:transparent;color:#e3eeee;font:500 12px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;cursor:pointer}
.lst-trends-bar button:hover,.lst-trends-bar button:focus-visible{border-color:#8fd3d8;color:#fff}
.lst-trends-inner{max-width:1460px;margin:0 auto;padding:18px 24px 50px}
.lst-trends-inner .lst-chart{margin:0}
.lst-trends-inner .lst-chart .plot-wrap{min-height:360px}
.lst-trends-inner .lst-chart .plot-panel{min-height:450px}

/* ---------- tablet: image across the top, lanes side by side under it ---------- */
@media(max-width:1100px){
  .lst-v27 .lst-home{padding:18px 24px 26px}
  .lst-v27 .lst-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
  .lst-v27 .lst-hero{grid-column:1/-1;grid-row:1;max-width:760px;margin:0 auto;width:100%}
  .lst-v27 .lst-saver-legend{display:none}
}
/* ---------- phone: tall image with the logo, then all buttons in two columns, then the screensaver ---------- */
@media(max-width:700px){
  .lst-v27 .lst-home{padding:14px 14px 22px}
  .lst-v27 .lst-intro{padding:0 132px 0 0;text-align:left}
  .lst-v27 .lst-cinematic-line{font-size:14.5px}
  .lst-v27 .lst-meaning>p{left:0;transform:none;width:calc(100vw - 28px)}
  .lst-v27 .lst-split{gap:8px;margin-top:12px}
  .lst-v27 .lst-side{display:contents}
  .lst-v27 .lst-side .lst-kicker{display:none}
  .lst-v27 .lst-hero{grid-column:1/-1;max-width:none}
  .lst-v27 .lst-hero picture{-webkit-mask-image:radial-gradient(ellipse 66% 62% at 50% 50%,#000 64%,transparent 100%);mask-image:radial-gradient(ellipse 66% 62% at 50% 50%,#000 64%,transparent 100%)}
  .lst-v27 .lst-art{aspect-ratio:2/3;max-height:58vh;width:auto;max-width:100%;margin:0 auto}
  .lst-v27 .lst-hero-logo{left:50%;top:51%;height:40%}
  .lst-v27 .ts-btn{min-height:50px;padding:9px 10px}
  .lst-v27 .ts-btn small{font-size:9.5px}
  .lst-v27 .lst-side-left .ts-btn strong{font-size:13.5px}
  .lst-v27 .lst-side-right .ts-btn strong{font-size:10.5px;letter-spacing:.06em;white-space:normal}
  .lst-v27 .lst-saver{height:170px;margin-top:14px}
  .lst-v27 .lst-saver-label{left:14px;top:10px;font-size:10px;max-width:calc(100% - 175px);line-height:1.4}
  .lst-v27 .lst-saver-label b{display:block;margin:0 0 1px}
  .lst-v27 .lst-saver-cta{right:10px;top:10px;padding:6px 10px;font-size:10px}
  .lst-drive-near{height:52vh;width:calc(100vw + 68.86vh);animation-name:lst-drive-near-m}
  .lst-drive-far{bottom:18vh;height:34vh;width:calc(100vw + 46.06vh);animation-name:lst-drive-far-m}
  .lst-trends-bar{padding:10px 14px}
  .lst-trends-inner{padding:10px 10px 40px}
  .lst-trends-inner .lst-chart .masthead .brand{display:none}
  .lst-trends-inner .lst-chart .plot-wrap{min-height:280px}
  .lst-trends-inner .lst-chart .plot-panel{min-height:370px}
}
@media(prefers-reduced-motion:reduce){.lst-trends-layer{transition:none}}