/* Shared style for the static guides (nervearena.com/guides/). The tokens and
   type are the landing page's own (index.html carries them inline), so a
   visitor arriving from search sees the same Nerve Arena as the home page.
   Dark only, like the rest of the site. Long-form reading is the job here, so body
   text is full --txt, never the muted tints, and nothing below 5:1 carries
   words. Logical properties throughout, so the layout holds if a guide is
   ever written right to left. */
:root{--bg:#161411;--deep:#100E0C;--card:#1E1B17;--cardHi:#26221D;--txt:#EDE8DE;--mut:rgba(237,232,222,0.78);--mut2:rgba(237,232,222,0.62);--line:rgba(237,232,222,0.10);--acc:#4566B4;--accHi:#7FA1E2;--bad:#C9604C;--fd:'IBM Plex Sans Condensed','Arial Narrow',sans-serif}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:'IBM Plex Sans',system-ui,sans-serif;background:var(--bg);color:var(--txt);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--accHi)}a:hover{color:#9FB8EE}
.nw{white-space:nowrap}
a:focus-visible{outline:2px solid var(--accHi);outline-offset:2px;border-radius:4px}
h1,h2,h3{font-family:var(--fd);font-weight:700;text-transform:uppercase;letter-spacing:0.005em;margin:0}

.btn{font-family:var(--fd);font-weight:700;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;min-height:44px;padding:10px 16px;border-radius:9px;text-decoration:none;color:#F2F5FC;background:var(--acc);display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;transition:background .2s}
.btn:hover{background:#3A5799;color:#fff}
/* inline-block, not the base inline-flex: a flex container drops the spaces
   around a child span (the no-wrap persona name inside the label). */
.btn.big{display:inline-block;font-size:14px;line-height:1.35;padding:15px 22px;border-radius:11px;white-space:normal;text-align:center}

/* ARTICLE */
.page{max-width:740px;margin:0 auto;padding:44px 20px 72px}
.crumbs{font-family:var(--fd);font-weight:600;font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--mut2);display:flex;flex-wrap:wrap;gap:8px;margin-block-end:22px}
.crumbs a{color:var(--mut);text-decoration:none}
.crumbs a:hover{color:var(--txt)}
.page h1{font-size:clamp(34px,7vw,54px);line-height:1.02}
.lede{font-size:20px;line-height:1.6;color:var(--mut);margin:22px 0 0}
.meta{font-size:14px;color:var(--mut2);margin:22px 0 0;padding-block-end:28px;border-block-end:1px solid var(--line)}
.page h2{font-size:clamp(24px,4.4vw,30px);line-height:1.1;margin:52px 0 0}
.page h3{font-size:19px;line-height:1.2;letter-spacing:0.02em;margin:34px 0 0;color:var(--txt)}
.page p,.page li{font-size:18px;line-height:1.7}
/* Long-form measure: about 70 characters a line. */
.page p,.page li,.lede{max-width:62ch}
.page p{margin:16px 0 0}
.page ul,.page ol{margin:16px 0 0;padding-inline-start:24px}
.page li{margin-block-start:10px}
.page li::marker{color:var(--accHi)}
.page strong{color:#fff;font-weight:600}

/* Spoken lines, drawn as the fight's own chat bubbles: "they" on the start
   side in the opponent's tint, "you" on the end side in the accent, each
   with its speaker named in text, so colour is never the only signal. */
.lines{list-style:none;padding:0 !important;margin:22px 0 0 !important;display:flex;flex-direction:column;gap:10px}
.lines li{margin:0;max-width:88%;background:rgba(201,96,76,0.09);border:1px solid rgba(201,96,76,0.30);border-radius:16px;border-end-start-radius:4px;padding:13px 18px;font-size:18px;line-height:1.5}
.ex{margin:22px 0 0;display:flex;flex-direction:column;gap:10px}
.ex p{margin:0;max-width:88%;border-radius:16px;padding:13px 18px;line-height:1.55}
.ex .them{background:rgba(201,96,76,0.09);border:1px solid rgba(201,96,76,0.30);border-end-start-radius:4px;align-self:flex-start}
.ex .you{background:rgba(69,102,180,0.16);border:1px solid rgba(69,102,180,0.42);border-end-end-radius:4px;align-self:flex-end}
.who{display:block;font-family:var(--fd);font-weight:700;font-size:11.5px;letter-spacing:0.18em;text-transform:uppercase;color:var(--mut2);margin-block-end:5px}
/* The early way in: one line right after the first script. */
.page .bridge{margin:22px 0 0;padding:14px 18px;border:1px solid rgba(127,161,226,0.32);border-radius:12px;background:rgba(69,102,180,0.08);font-size:17px;color:var(--mut)}
.page .bridge a{font-weight:600}
.note{margin:28px 0 0;padding:18px 20px;border:1px solid var(--line);border-radius:12px;background:var(--deep)}
.note p{margin:0;font-size:17px;color:var(--mut)}

/* The closing practice block. */
.cta{margin:60px 0 0;padding:30px 26px;border-radius:16px;background:var(--card);border:1px solid rgba(127,161,226,0.28)}
.cta h2{margin:0 !important}
.cta p{color:var(--mut)}
.cta .actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin:24px 0 0}
.cta .alt{display:inline-block;padding-block:11px;font-size:16px}
.cta .small{font-size:15px;color:var(--mut2);margin:18px 0 0}

.related{margin:56px 0 0;padding:26px 0 0;border-block-start:1px solid var(--line)}
.related h2{margin:0 !important;font-size:20px !important;letter-spacing:0.08em}
.cards{list-style:none;padding:0 !important;margin:18px 0 0 !important;display:grid;gap:12px}
.cards li{margin:0}
.cards a{display:block;padding:18px 20px;border-radius:12px;background:var(--card);border:1px solid var(--line);text-decoration:none;color:var(--txt);transition:border-color .2s,background .2s}
.cards a:hover{border-color:rgba(127,161,226,0.45);background:var(--cardHi)}
.cards .t{display:block;font-family:var(--fd);font-weight:700;font-size:20px;text-transform:uppercase;line-height:1.15}
.cards .d{display:block;font-size:16px;line-height:1.55;color:var(--mut);margin-block-start:6px}
.cards .k{display:block;font-family:var(--fd);font-weight:600;font-size:11.5px;letter-spacing:0.16em;text-transform:uppercase;color:var(--accHi);margin-block-end:8px}

@media (max-width:560px){
.page{padding:32px 16px 56px}
.lede{font-size:18px}
.page p,.page li,.lines li{font-size:17px}
.cta{padding:24px 18px}
}

/* SITE CHROME: landing/lib/chrome.mjs, written by landing/sync-static-chrome.mjs. Do not edit by hand. */
:root{color-scheme:dark}
html{scrollbar-color:#3A352E #100E0C;scroll-padding-top:84px}
::selection{background:rgba(69,102,180,0.5);color:#fff}
.sc-skip{position:absolute;inset-inline-start:12px;top:-80px;z-index:60;padding:12px 18px;border-radius:9px;background:#4566B4;color:#fff;font-family:'IBM Plex Sans Condensed','Arial Narrow',sans-serif;font-weight:700;font-size:13px;letter-spacing:0.12em;text-transform:uppercase;text-decoration:none}
.sc-skip:focus{top:12px;outline:2px solid #7FA1E2;outline-offset:2px}
.sc-skip:hover{color:#fff;background:#3A5799}
.sc-head{position:sticky;top:0;z-index:50;background:rgba(22,20,17,0.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-block-end:1px solid rgba(237,232,222,0.10);font-family:'IBM Plex Sans',system-ui,sans-serif;line-height:1.2}
.sc-bar{max-width:1200px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:14px 28px}
.sc-brand{display:inline-flex;align-items:center;gap:11px;min-height:44px;color:#fff;text-decoration:none;min-width:0}
.sc-bar .sc-brand{margin-inline-end:auto}
.sc-brand img{display:block;width:34px;height:34px;border-radius:9px;flex-shrink:0;box-shadow:0 0 0 1px rgba(237,232,222,0.14)}
.sc-brand span{font-family:'IBM Plex Sans Condensed','Arial Narrow',sans-serif;font-weight:700;font-size:19px;letter-spacing:0.03em;text-transform:uppercase;line-height:1;white-space:nowrap;color:#fff}
.sc-links{display:flex;align-items:center;gap:28px}
.sc-head nav a{font-family:'IBM Plex Sans Condensed','Arial Narrow',sans-serif;font-weight:600;font-size:12.5px;letter-spacing:0.15em;text-transform:uppercase;color:rgba(237,232,222,0.72);text-decoration:none;padding-block:6px;border-block-end:2px solid transparent;transition:color .2s}
.sc-head nav a:hover,.sc-head nav a[aria-current]{color:#EDE8DE}
.sc-head nav a[aria-current]{border-block-end-color:#4566B4}
.sc-cta{font-family:'IBM Plex Sans Condensed','Arial Narrow',sans-serif;font-weight:700;font-size:12px;letter-spacing:0.15em;text-transform:uppercase;min-height:44px;padding:0 18px;border-radius:9px;text-decoration:none;color:#fff;background:#4566B4;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;flex-shrink:0;transition:background .2s}
.sc-cta:hover{background:#3A5799;color:#fff}
.sc-ar{font-size:13px;line-height:1;letter-spacing:0}
[dir="rtl"] .sc-ar{transform:scaleX(-1)}
.sc-menu{display:none}
.sc-menu summary{list-style:none;cursor:pointer;width:44px;height:44px;display:grid;place-items:center;border-radius:9px;color:#EDE8DE;border:1px solid rgba(237,232,222,0.16)}
.sc-menu summary::-webkit-details-marker{display:none}
.sc-menu[open] summary{background:#26221D}
.sc-i-close,.sc-menu[open] .sc-i-open{display:none}
.sc-menu[open] .sc-i-close{display:block}
.sc-menu nav{position:absolute;inset-inline:0;top:100%;background:#161411;border-block-end:1px solid rgba(237,232,222,0.10);box-shadow:0 18px 30px rgba(0,0,0,0.45);padding:6px 20px 14px;display:flex;flex-direction:column}
.sc-menu nav a{font-size:14px;padding-block:15px;border-block-end:1px solid rgba(237,232,222,0.08)}
.sc-menu nav a:last-child{border-block-end:none}
.sc-menu nav a[aria-current]{color:#fff;border-block-end-color:rgba(237,232,222,0.08);box-shadow:inset 3px 0 0 #4566B4;padding-inline-start:14px}
[dir="rtl"] .sc-menu nav a[aria-current]{box-shadow:inset -3px 0 0 #4566B4}
.sc-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.sc-head a:focus-visible,.sc-menu summary:focus-visible,.sc-foot a:focus-visible{outline:2px solid #7FA1E2;outline-offset:2px;border-radius:4px}
.sc-foot{background:#100E0C;border-block-start:1px solid rgba(237,232,222,0.10);color:rgba(237,232,222,0.62);font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:14px;line-height:1.55;text-align:start}
.sc-wrap{max-width:1200px;margin:0 auto;padding:56px 20px 40px}
.sc-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(4,minmax(0,1fr));gap:36px}
.sc-about p{margin:14px 0 0;max-width:300px}
.sc-about .sc-tag{font-family:'IBM Plex Sans Condensed','Arial Narrow',sans-serif;font-weight:600;font-size:11px;letter-spacing:0.2em;text-transform:uppercase;margin-top:12px}
.sc-foot h2{font-family:'IBM Plex Sans Condensed','Arial Narrow',sans-serif;font-weight:600;font-size:11px;line-height:1.3;letter-spacing:0.2em;text-transform:uppercase;color:rgba(237,232,222,0.62);margin:0 0 14px}
.sc-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.sc-col a{display:inline-block;padding-block:6px;color:rgba(237,232,222,0.82);text-decoration:none;transition:color .2s}
.sc-col a:hover{color:#9FB8EE}
.sc-foot .langs{margin:44px 0 0;padding:24px 0 0;border:0;border-block-start:1px solid rgba(237,232,222,0.10)}
.sc-foot .langs h2{font-family:'IBM Plex Sans Condensed','Arial Narrow',sans-serif;font-weight:600;font-size:11px;letter-spacing:0.2em;text-transform:uppercase;color:rgba(237,232,222,0.62);margin:0 0 14px}
.sc-foot .langs ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:2px 14px}
.sc-foot .langs a{display:inline-block;padding:6px 4px;min-width:32px;text-align:center;font-size:13.5px;color:rgba(237,232,222,0.82);text-decoration:none}
.sc-foot .langs a:hover{color:#9FB8EE}
.sc-foot .langs a[aria-current="page"]{color:#EDE8DE;font-weight:600}
.sc-bottom{margin-top:32px;padding-top:20px;border-block-start:1px solid rgba(237,232,222,0.10);display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;font-size:12.5px}
.sc-bottom p{margin:0}
@media (max-width:1040px){.sc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sc-about{grid-column:1/-1}}
@media (max-width:899px){.sc-links{display:none}.sc-menu{display:block}.sc-bar{gap:12px}}
@media (max-width:520px){.sc-bar{padding:10px 16px}.sc-wrap{padding-inline:16px}.sc-cta{padding:0 14px;letter-spacing:0.1em}.sc-menu nav{padding-inline:16px}.sc-grid{grid-template-columns:1fr}}
@media (max-width:400px){.sc-bar .sc-brand span{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
:is(:lang(ar),:lang(fa),:lang(ur),:lang(hi),:lang(mr),:lang(bn),:lang(gu),:lang(pa),:lang(or),:lang(ta),:lang(te),:lang(kn),:lang(ml),:lang(th)) :is(.sc-brand span,.sc-foot h2){line-height:1.45}
:is(:lang(ar),:lang(fa),:lang(ur),:lang(hi),:lang(mr),:lang(bn),:lang(gu),:lang(pa),:lang(or),:lang(ta),:lang(te),:lang(kn),:lang(ml),:lang(th)) :is(.sc-head,.sc-foot) *{letter-spacing:normal !important}
/* END SITE CHROME */