/* ConferenceRooms.org Help Center. Part of the website: same top bar, colors, type, rounded surfaces and closing band as the public pages.
   No sidebar: a search box and a "Browse Topics" panel replace it, so it works the same on phones and desktops. No shadows anywhere.
   Bootstrap 6 (6.0.0-alpha.1, jsDelivr) supplies the reboot and navbar; every rule here is ours so the page also works without the CDN.
   The top bar is the site's bar (identical geometry on every page): 8px navbar padding + 68px bar + 1px line = 85px. */
:root { --navy: #102a56; --blue: #1c4570; --navy-soft: #e9f0f7; --red: #b91f3b; --red-d: #9c1830; --red-soft: #fdecef; --ink: #17233a; --muted: #55627a; --line: #dde3ec; --panel: #f5f8fc; --navh: 85px; --hbarh: 60px; }
* { box-sizing: border-box; }
html { scroll-padding-top: 160px; }
body { margin: 0; background: #fff; color: var(--ink); font: 16px/1.7 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; -webkit-font-smoothing: antialiased; font-variant-numeric: tabular-nums; }
a { color: var(--blue); text-decoration: underline; text-underline-offset: 2px; }
a:hover { color: var(--red); }
a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; border-radius: 6px; }
.cr-skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; border-radius: 8px; background: var(--navy); color: #fff; font-weight: 650; text-decoration: none; }
.cr-skip:focus { top: 10px; color: #fff; }

/* ---- the site's top bar ---- */
.cr-nav { position: sticky; top: 0; z-index: 50; padding: 8px 0; line-height: 1.6; font-size: 16px; background: rgba(255,255,255,.94); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.cr-nav .container { max-width: 1120px; width: 100%; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; gap: 28px; height: 68px; }
.cr-brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1.05rem; line-height: 1.6; color: var(--navy); text-decoration: none; white-space: nowrap; }
.cr-brand:hover { color: var(--navy); }
.cr-brand img { width: 36px; height: 36px; border-radius: 9px; }
.cr-links { list-style: none; margin: 0 0 0 12px; padding: 0; display: flex; flex-direction: row; gap: 4px; }
.cr-links .nav-item { display: flex; }
.cr-links a.nav-link { padding: 8px 12px; border-radius: 8px; color: var(--ink); font-size: .95rem; text-decoration: none; }
.cr-links a.nav-link:hover { background: var(--panel); color: var(--ink); }
.cr-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.cr-cta, .cr-nav .btn { display: inline-flex; align-items: center; justify-content: center; padding: 10px 19px; border: 1px solid var(--red); border-radius: 10px; background: var(--red); color: #fff; font-weight: 650; font-size: .92rem; line-height: 1.2; text-decoration: none; }
.cr-cta:hover, .cr-nav .btn:hover { background: var(--red-d); border-color: var(--red-d); color: #fff; }

/* ---- the help bar: title, search, topics ---- */
.hbar { position: sticky; top: var(--navh); z-index: 45; background: var(--panel); border-bottom: 1px solid var(--line); }
.hbar-in { max-width: 1120px; margin: 0 auto; height: var(--hbarh); padding: 0 24px; display: flex; align-items: center; gap: 14px; }
.hb-title { flex: none; font-weight: 700; color: var(--navy); text-decoration: none; letter-spacing: -.01em; }
.hb-title:hover { color: var(--navy); }
.search { position: relative; flex: 1; max-width: 520px; }
.search input { width: 100%; height: 40px; padding: 0 14px 0 40px; border: 1px solid var(--line); border-radius: 10px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2355627a' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") 12px 50% / 18px no-repeat; font: inherit; font-size: 15px; color: var(--ink); }
.search input:focus { outline: 2px solid var(--navy); outline-offset: 0; }
.results { position: absolute; left: 0; right: 0; top: 46px; z-index: 60; max-height: 70vh; overflow: auto; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.results a { display: block; padding: 10px 14px; text-decoration: none; color: var(--ink); border-bottom: 1px solid var(--line); }
.results a:last-child { border: 0; }
.results a.sel, .results a:hover { background: var(--navy-soft); color: var(--ink); }
.results b { display: block; color: var(--navy); font-size: 14.5px; line-height: 1.4; }
.results span { display: block; color: var(--muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.results .none { padding: 12px 14px; color: var(--muted); }
.topicsbtn { flex: none; margin-left: auto; height: 40px; padding: 0 18px 0 16px; border: 1px solid var(--line); border-radius: 10px; background: #fff; font: inherit; font-size: 15px; font-weight: 650; color: var(--navy); cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
.topicsbtn::before { content: ""; width: 16px; height: 12px; background: linear-gradient(var(--navy), var(--navy)) 0 0 / 100% 2px no-repeat, linear-gradient(var(--navy), var(--navy)) 0 50% / 100% 2px no-repeat, linear-gradient(var(--navy), var(--navy)) 0 100% / 100% 2px no-repeat; }
.topicsbtn:hover, .topicsbtn[aria-expanded="true"] { border-color: var(--navy); }

/* ---- the topics panel (replaces the old sidebar) ---- */
.topics { position: fixed; z-index: 48; left: 0; right: 0; top: calc(var(--navh) + var(--hbarh) + 1px); bottom: 0; background: rgba(16,42,86,.3); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.topics[hidden] { display: none; }
.topics-in { background: #fff; border-bottom: 1px solid var(--line); max-height: 100%; overflow: auto; overscroll-behavior: contain; }
.topics-wrap { max-width: 1120px; margin: 0 auto; padding: 18px 24px 30px; }
.topics-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; color: var(--navy); font-size: 1.15rem; }
.topics-x { width: 40px; height: 40px; border: 0; border-radius: 10px; background: none; font-size: 28px; line-height: 1; color: var(--muted); cursor: pointer; }
.topics-x:hover { background: var(--panel); color: var(--ink); }
.tgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 24px; align-items: start; }
.tg { border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.tg > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px; font-weight: 650; color: var(--navy); }
.tg > summary::-webkit-details-marker { display: none; }
.tg > summary::after { content: ""; flex: none; width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .15s; }
.tg[open] > summary::after { transform: rotate(-135deg); }
.tg > summary span { margin-left: auto; margin-right: 8px; font-weight: 500; font-size: 13px; color: var(--muted); }
.tg ul { list-style: none; margin: 0; padding: 6px 8px 12px; }
.tg li a { display: block; padding: 7px 10px; border-radius: 8px; text-decoration: none; color: #2d3a4b; font-size: 15px; line-height: 1.4; }
.tg li a:hover { background: var(--panel); color: var(--ink); }
.tg li a.cur { background: var(--navy-soft); color: var(--navy); font-weight: 650; }
.tg.opg > summary { color: var(--red); }
.tg.opg li a.cur { background: var(--red-soft); color: var(--red); }
.opdiv { grid-column: 1 / -1; margin: 8px 0 0; padding-top: 10px; border-top: 1px solid var(--red); color: var(--red); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
body.topics-open { overflow: hidden; }

/* ---- help home hero ---- */
.hc-hero { padding: clamp(28px, 4vw, 48px) 24px clamp(24px, 3vw, 36px); text-align: center; background: radial-gradient(800px 300px at 50% -20%, #dce8f6 0, rgba(220,232,246,0) 70%), linear-gradient(#fff, var(--panel)); border-bottom: 1px solid var(--line); }
.hc-hero h1 { margin: 0 auto 22px; max-width: 16ch; font-size: clamp(2rem, 4.2vw, 3rem); line-height: 1.04; letter-spacing: -.045em; color: var(--navy); text-wrap: balance; }
.hc-hero p { margin: 0 auto 24px; max-width: 600px; font-size: clamp(1.05rem, 1.8vw, 1.25rem); color: var(--muted); }
.hc-hero .search { max-width: 560px; margin: 0 auto; text-align: left; }
.hc-hero .search input { height: 54px; padding-left: 48px; border-radius: 14px; font-size: 17px; background-position: 16px 50%; background-size: 20px; }
.hc-hero .results { top: 60px; }
.hc-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 18px auto 0; max-width: 640px; }
.hc-chips a { padding: 7px 14px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--navy); font-size: 14.5px; font-weight: 600; text-decoration: none; }
.hc-chips a:hover { border-color: var(--navy); color: var(--navy); }
.hc-home .page { max-width: 1120px; }
.hc-home .hbar .search { visibility: hidden; }
.hc-home .page > .crumbs, .hc-home .page > h1, .hc-home .page > .lead, .hc-home .page > #toc { display: none; }
.hc-cats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 4px 0 40px; }
.hc-cat { display: flex; flex-direction: column; padding: 20px 22px 18px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.hc-cat:hover { border-color: var(--border-strong, #aebfd6); }
.hc-cat h3 { margin: 0 0 4px; font-size: 1.15rem; letter-spacing: -.015em; }
.hc-cat h3 a { color: var(--navy); text-decoration: none; }
.hc-cat > p { margin: 0 0 12px; color: var(--muted); font-size: .96rem; line-height: 1.5; }
.hc-cat ul { list-style: none; margin: 0 0 12px; padding: 0; border-top: 1px solid var(--line); }
.hc-cat li { margin: 0; border-bottom: 1px solid #eef1f6; }
.hc-cat li a { display: block; padding: 8px 0; text-decoration: none; font-size: 15px; line-height: 1.4; color: var(--blue); }
.hc-cat li a:hover { color: var(--red); }
.hc-cat .all { margin-top: auto; font-weight: 650; font-size: 14.5px; text-decoration: none; }
.hc-cat .all::after { content: " \203A"; }
.hc-h { margin: 8px 0 14px; font-size: 1.5rem; letter-spacing: -.03em; color: var(--navy); }

/* ---- article ---- */
.page { max-width: 1120px; margin: 0 auto; padding: 28px 24px 64px; }
.crumbs { font-size: 13.5px; color: var(--muted); margin-bottom: 10px; }
.crumbs a { color: var(--muted); }
h1 { font-size: 2.4rem; line-height: 1.1; margin: 4px 0 12px; color: var(--navy); letter-spacing: -.04em; font-weight: 700; }
.lead { font-size: 1.2rem; line-height: 1.55; color: var(--muted); margin: 0 0 22px; }
.toc { margin: 0 0 26px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); }
.toc-h { padding: 11px 16px 0; font-weight: 650; color: var(--navy); }
.toc ol { margin: 0; padding: 6px 16px 14px 36px; }
.toc li { margin: 2px 0; font-size: 15px; }
h2 { font-size: 1.55rem; line-height: 1.2; margin: 44px 0 10px; color: var(--navy); letter-spacing: -.03em; }
h3 { font-size: 1.15rem; margin: 26px 0 4px; color: var(--navy); }
p { margin: 0 0 14px; }
ul, ol { padding-left: 22px; margin: 0 0 16px; }
li { margin: 4px 0; }
code { background: #eaf1f9; border: 1px solid #c3d3e6; color: #0b2a4a; font: 500 13.5px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; border-radius: 5px; padding: 1px 6px; }
.code { margin: 0 0 18px; border: 1px solid #c3d3e6; border-radius: 12px; background: #f1f6fc; overflow: hidden; }
.code .lang { display: block; padding: 4px 14px; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #36506f; font-weight: 600; background: #dfe9f5; border-bottom: 1px solid #c3d3e6; }
.code pre { margin: 0; padding: 12px 16px; overflow-x: auto; font: 500 13.5px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: #0b2a4a; white-space: pre-wrap; word-break: break-word; }
.tw { overflow-x: auto; margin: 0 0 18px; }
table { border-collapse: collapse; width: 100%; font-size: 14.5px; }
th, td { border-bottom: 1px solid var(--line); padding: 10px 14px 10px 0; text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; border-bottom: 1px solid #b9c4d4; white-space: nowrap; }
td:first-child { min-width: 8ch; }
td:first-child code { white-space: nowrap; }
kbd { display: inline-block; min-width: 22px; padding: 1px 7px; border: 1px solid #b9c2cf; border-bottom-width: 2px; border-radius: 6px; background: #fff; font: 12.5px ui-monospace, Consolas, monospace; text-align: center; }
.menu { padding: 1px 8px; border-radius: 6px; background: var(--navy-soft); color: var(--navy); font-size: 14px; white-space: nowrap; }
.callout { margin: 0 0 18px; padding: 14px 18px; border-radius: 12px; }
.callout.note { background: #eef4fb; }
.callout.tip { background: #eef8f2; }
.callout.careful { background: var(--red-soft); }
.callout.platform { background: var(--panel); }
.pn-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 48px 0 0; }
.pn { display: block; padding: 14px 18px; border: 1px solid var(--line); border-radius: 14px; text-decoration: none; color: var(--ink); }
.pn:hover { border-color: var(--navy); color: var(--ink); }
.pn span { display: block; font-size: 12.5px; color: var(--muted); }
.pn b { color: var(--navy); }
.pn.next { text-align: right; grid-column: 2; }
.pn.previous { grid-column: 1; }
.more { margin: 44px 0 0; padding-top: 24px; border-top: 1px solid var(--line); }
.more h2 { margin: 0 0 12px; font-size: 1.25rem; }
.more ul { list-style: none; margin: 0 0 12px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; }
.more li { margin: 0; }
.more li a { display: block; height: 100%; padding: 11px 16px; border: 1px solid var(--line); border-radius: 12px; text-decoration: none; color: var(--navy); font-weight: 600; font-size: 15px; line-height: 1.4; }
.more li a:hover { border-color: var(--navy); color: var(--navy); }
.more li a small { display: block; margin-top: 2px; color: var(--muted); font-weight: 400; font-size: 13px; }
.more .browse { font-weight: 650; font-size: 15px; background: none; border: 0; padding: 0; color: var(--blue); cursor: pointer; font-family: inherit; text-decoration: underline; text-underline-offset: 2px; }
.more .browse:hover { color: var(--red); }
dialog { border: 1px solid var(--line); border-radius: 14px; padding: 22px 24px; width: min(92vw, 340px); }
dialog::backdrop { background: rgba(20,30,45,.35); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }

/* operator box and notice */
.optick { display: flex; align-items: center; gap: 8px; margin: 2px 4px 12px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; font-size: 13.5px; color: var(--ink); cursor: pointer; }
.optick input { width: 16px; height: 16px; accent-color: var(--navy); margin: 0; }
.optick.inline { display: inline-flex; margin: 6px 0 0; background: #fff; }
.foottick { width: fit-content; margin: 22px 0 0; padding: 4px 6px; border: 0; font-size: 12.5px; color: #8a96a8; }
.foottick input { width: 14px; height: 14px; }
.foottick:hover, .foottick:focus-within { color: var(--muted); }
.optoast { position: fixed; z-index: 70; left: 50%; bottom: 18px; transform: translateX(-50%); width: min(560px, calc(100vw - 24px)); padding: 12px 40px 12px 16px; background: #fff; border: 1px solid var(--red); border-radius: 12px; color: var(--ink); font-size: 14px; }
.optoast a { white-space: nowrap; }
.optoast button { position: absolute; right: 6px; top: 6px; width: 28px; height: 28px; border: 0; background: none; font-size: 20px; line-height: 1; color: var(--muted); cursor: pointer; }

p, li, td, th, h1, h2, h3, .lead, code { overflow-wrap: break-word; word-break: normal; }

@media (max-width: 991px) {
  .cr-links { display: none; }
  .cr-nav .container { padding: 0 76px 0 24px; }
  .tgrid { grid-template-columns: repeat(2, 1fr); }
  .hc-cats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
  html { scroll-padding-top: 150px; }
  .hbar-in { padding: 0 12px; gap: 10px; }
  .hb-title { display: none; }
  .search { max-width: none; }
  .search input { font-size: 16px; }
  .results { position: fixed; left: 12px; right: 12px; top: calc(var(--navh) + var(--hbarh) + 6px); max-height: 60vh; }
  .hc-hero .results { position: absolute; left: 0; right: 0; top: 60px; }
  .topics-wrap { padding: 14px 16px 90px; }
  .tgrid { grid-template-columns: 1fr; gap: 10px; }
  .tg > summary { padding: 14px 16px; }
  .tg li a { padding: 10px; }
  .page { padding: 20px 16px 52px; }
  h1 { font-size: 2rem; }
  .lead { font-size: 1.08rem; margin-bottom: 18px; }
  h2 { font-size: 1.4rem; margin-top: 34px; }
  table { font-size: 13.5px; }
  .code pre { font-size: 12.5px; padding: 10px 12px; }
  .pn-row { grid-template-columns: 1fr; gap: 10px; margin-top: 34px; }
  .pn.next, .pn.previous { grid-column: 1; text-align: left; }
  .pn-row > span { display: none; }
  .more ul, .hc-cats { grid-template-columns: 1fr; }
  .hc-hero { padding: 24px 16px 22px; text-align: left; }
  .hc-hero h1 { margin-left: 0; font-size: 2.3rem; }
  .hc-hero p { margin-left: 0; }
  .hc-chips { justify-content: flex-start; }
  .code pre { font-size: 12px; line-height: 1.5; overflow-x: visible; }
  code { font-size: 12.5px; white-space: normal; }
  .tw { overflow: visible; }
  .tw table, .tw tbody, .tw tr, .tw td { display: block; width: 100%; }
  .tw thead { display: none; }
  .tw tr { border: 1px solid var(--line); border-radius: 12px; margin: 0 0 10px; overflow: hidden; background: #fff; }
  .tw td { border: 0; border-bottom: 1px solid #eef0f3; padding: 8px 12px; }
  .tw td:last-child { border-bottom: 0; }
  .tw td::before { content: attr(data-label); display: block; font-size: 11px; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
  .tw td:first-child { font-weight: 600; background: var(--panel); }
  .tw td:first-child::before { color: var(--navy); }
  .tw td:first-child code { white-space: normal; }
  td:first-child { min-width: 0; }
  th { white-space: normal; }
  ul, ol { padding-left: 20px; }
}
@media (max-width: 600px) {
  .cr-nav .container { padding: 0 64px 0 16px; gap: 12px; flex-wrap: nowrap; }
  .cr-brand { margin-right: 0; min-width: 0; }
  .cr-brand span { overflow: hidden; text-overflow: ellipsis; }
  .cr-nav .cr-cta { display: none; }
}
@media print { .cr-nav, .hbar, .topics, .hc-hero, .pn-row, .more, .toc, .cx-cta, .cx-foot { display: none !important; } .page { padding: 0; max-width: none; } }

/* Help Center: pin the "Say hi" block light (Bootstrap's --bs-bg-1 turns near-black under a dark color scheme) */
.ct.ct-faces .container{background:#f5f8fc;border-color:#dde3ec;color:#1b2430}
.ct.ct-faces h2{color:#102a56}.ct.ct-faces p{color:#3b4a5e}
.ct,.cx-cta,.cx-foot{color-scheme:light}
/* closing block: chat-bubble call to action + full footer (shared by Help Center and /chat/ lobby) */
.cx-wrap{max-width:1120px;margin:0 auto;padding:0 max(24px,env(safe-area-inset-right)) 0 max(24px,env(safe-area-inset-left))}
.cx-cta{background:#102a56;color:#fff;padding:clamp(40px,6vw,72px) 0}
.cx-ctain{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(20px,5vw,64px);align-items:center}
.cx-cta h2{margin:0 0 10px;padding:0;border:0;font-size:clamp(2rem,4.6vw,3.2rem);line-height:1.05;letter-spacing:-.045em;color:#fff}
.cx-cta p{margin:0 0 26px;max-width:520px;color:#c9d6ea;font-size:1.1rem}
.cx-btn{display:inline-flex;align-items:center;justify-content:center;min-width:232px;padding:13px 26px;border-radius:10px;background:#fff;color:#102a56;font-weight:650;text-decoration:none}
.cx-btn:hover{background:#e9f0f7;color:#102a56}
.cx-art svg{display:block;width:100%;max-width:240px;height:auto;margin-left:auto}
.cx-foot{border-top:1px solid #dde3ec;background:#f5f8fc;color:#647089;font:400 .9rem/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.cx-foot .cx-wrap{padding-top:44px;padding-bottom:30px}
.cx-cols{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:28px}
.cx-cols h3{margin:0 0 12px;font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:#17233a}
.cx-cols ul{list-style:none;margin:0;padding:0}.cx-cols li{margin:0 0 8px}
.cx-cols a{color:#55627a;text-decoration:none}.cx-cols a:hover{color:#102a56;text-decoration:underline}
.cx-brand{display:flex;align-items:center;gap:10px;font-weight:700;color:#102a56!important;text-decoration:none}.cx-brand img{width:30px;height:30px;border-radius:8px}
.cx-cols p{margin:12px 0 0;max-width:280px;color:#647089}
.cx-base{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;margin-top:30px;padding-top:18px;border-top:1px solid #dde3ec}
.cx-flags{display:flex;gap:8px}.cx-flags img.kr{width:26px;height:auto}.cx-flags img{display:block;width:28px;height:auto;border:1px solid #dde3ec;border-radius:3px;padding:2px;background:#fff}
.cx-legal{flex:1 1 100%;margin:0;color:#6a7688;font-size:.78rem;line-height:1.55;max-width:900px}
@media (max-width:991px){.cx-cols{grid-template-columns:repeat(2,1fr)}}
@media (max-width:700px){.cx-ctain{grid-template-columns:1fr}.cx-art{order:-1}.cx-art svg{max-width:120px;margin:0}.cx-btn{display:flex;width:100%}}
@media (max-width:600px){.cx-wrap{padding:0 max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left))}.cx-cols{grid-template-columns:1fr 1fr}.cx-cols>div:first-child{grid-column:1/-1}}
@media print{.cx-cta,.cx-foot{display:none}}

/* ===== call to action blocks ct01-ct15 (site/ctas.py) ===== */
.ct{padding:clamp(28px,5vw,56px) 0}.ct .container{max-width:1120px;margin:0 auto;padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
.ct h2{margin:0 0 10px;font-size:clamp(1.6rem,3.4vw,2.4rem);line-height:1.1;letter-spacing:-.035em;color:var(--cr-navy,#102a56);text-wrap:balance}
.ct h3{margin:0 0 6px;font-size:1.15rem;letter-spacing:-.01em;color:var(--cr-navy,#102a56)}
.ct p{margin:0;color:var(--bs-fg-3,#4a5468)}
.ct .cr-actions{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;margin-top:18px}
.ct .card{border:1px solid var(--bs-border-color,#dde3ec);border-radius:18px;background:var(--bs-bg-body,#fff);box-shadow:0 1px 2px rgba(16,42,86,.05);overflow:hidden}
.ct .badge{display:inline-block;margin:0 0 10px;padding:4px 11px;border-radius:999px;background:#e9f0f7;color:var(--cr-navy,#102a56);font-size:.78rem;font-weight:700;letter-spacing:.02em}
.ct .ct-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:#e9f0f7;color:var(--cr-navy,#102a56);flex:none}.ct .ct-ico svg{width:28px;height:28px}
/* 01 banner */
.ct-banner{padding:0;background:var(--cr-navy,#102a56);color:#fff}.ct-banner .container{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding-top:16px;padding-bottom:16px}
.ct-banner .badge{margin:0;background:#fff;color:var(--cr-navy,#102a56)}.ct-banner p{flex:1 1 280px;margin:0;color:#dbe6f3}.ct-banner p b{color:#fff}
/* 02 split */
.ct-split .card-body{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(18px,4vw,48px);align-items:center;padding:clamp(22px,4vw,44px)}
.ct-split p{max-width:46ch;font-size:1.08rem}.ct-art{color:var(--cr-navy,#102a56)}.ct-art svg{display:block;width:100%;max-width:240px;height:auto;margin-left:auto}
/* 03 pill */
.ct-pill{padding:clamp(22px,4vw,40px) 0}.ct-pillbar{display:flex;align-items:center;gap:14px;padding:10px 10px 10px clamp(18px,4vw,34px);border-radius:999px;background:linear-gradient(135deg,#102a56,#1c4570);color:#fff;text-decoration:none;box-shadow:0 10px 30px rgba(16,42,86,.2)}
.ct-pillbar span{flex:1;color:#c9d6ea;font-size:1.05rem}.ct-pillbar b{font-size:1.15rem;letter-spacing:-.01em}
.ct-pillbar i{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;color:var(--cr-navy,#102a56);flex:none;transition:transform .2s}.ct-pillbar i svg{width:22px;height:22px}.ct-pillbar:hover i{transform:translateX(4px)}
/* 04 steps */
.ct-steps{text-align:center}.ct-steps h2{margin-bottom:24px}.ct-line{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:0;padding:0;list-style:none;position:relative}
.ct-line::before{content:"";position:absolute;left:16%;right:16%;top:44px;border-top:2px dashed #c3d3e6}.ct-line .card{position:relative;text-align:center}.ct-line .card-body{padding:20px 18px}
.ct-line b{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 12px;border-radius:50%;background:var(--cr-red,#b91f3b);color:#fff;font-size:1.3rem}.ct-steps .cr-actions{justify-content:center}
/* 05 spotlight */
.ct-spot .card{border-left:6px solid var(--cr-red,#b91f3b)}.ct-spot .card-body{display:flex;gap:clamp(16px,3vw,28px);align-items:flex-start;padding:clamp(22px,4vw,38px)}.ct-spot p{max-width:60ch;font-size:1.05rem}
/* 06 address */
.ct-addr{text-align:center}.ct-addr p{margin-bottom:20px}.ct-bar{display:flex;align-items:center;gap:12px;max-width:760px;margin:0 auto;padding:8px 8px 8px 18px;border:2px solid var(--cr-navy,#102a56);border-radius:16px;background:#fff;box-shadow:0 8px 26px rgba(16,42,86,.12)}
.ct-lock{width:12px;height:12px;border-radius:50%;background:#1f7a4d;flex:none}.ct-url{flex:1;min-width:0;text-align:left;font:600 clamp(.95rem,2.2vw,1.2rem)/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#647089;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ct-url b{color:var(--cr-navy,#102a56)}
/* 07 trust */
.ct-trust{padding:clamp(22px,4vw,34px) 0;background:var(--bs-bg-1,#f5f8fc);border-top:1px solid var(--bs-border-subtle,#e6ecf4);border-bottom:1px solid var(--bs-border-subtle,#e6ecf4)}
.ct-trust .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px}.ct-trust ul{display:flex;flex-wrap:wrap;gap:10px 28px;margin:0;padding:0;list-style:none}
.ct-trust li,.ct-checks li{display:flex;align-items:center;gap:9px;font-weight:600;color:var(--cr-navy,#102a56)}.ct-trust li svg,.ct-checks li svg{width:20px;height:20px;padding:3px;border-radius:50%;background:#1f7a4d;color:#fff;flex:none}
.ct-promisebar{padding:clamp(8px,2vw,20px) 0 clamp(36px,6vw,64px)}.ct-promisebar .ct-promises{margin-top:0}
.ct-promises{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 26px;margin:22px 0 0;padding:0;list-style:none}
.ct-promises li{display:flex;align-items:center;gap:8px;font-size:.95rem;font-weight:600;color:var(--bs-fg-3,#4a5468)}.ct-promises li svg{width:18px;height:18px;padding:3px;border-radius:50%;background:#1f7a4d;color:#fff;flex:none}
/* 08 gradient */
.ct-panel{position:relative;overflow:hidden;padding:clamp(32px,6vw,72px);border-radius:26px;background:radial-gradient(420px 300px at 92% 8%,rgba(255,255,255,.16),rgba(255,255,255,0) 70%),radial-gradient(520px 360px at 6% 110%,rgba(255,255,255,.1),rgba(255,255,255,0) 70%),linear-gradient(135deg,#102a56 0%,#1c4570 100%);color:#fff}
.ct-panel h2{color:#fff;font-size:clamp(2rem,5vw,3.4rem);max-width:16ch}.ct-panel p{color:#c9d6ea;font-size:1.15rem;max-width:44ch}.ct-ghost{display:inline-flex;align-items:center;font-weight:650;color:#fff;text-decoration:underline;text-underline-offset:4px}
/* 09 help and 11 choice share the two-card row */
.ct-help h2{margin-bottom:20px}.ct-two{display:grid;grid-template-columns:1fr 1fr;gap:18px}.ct-two .card{display:flex;flex-direction:column;text-decoration:none}.ct-two .card-body{padding:22px;flex:1}.ct-two .card-footer{padding:14px 22px 20px;background:none;border:0}
.ct-choice .card{transition:transform .15s,box-shadow .15s}.ct-choice .card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(16,42,86,.14)}
.ct-choice .card-body h3{font-size:1.4rem}.ct-choice .card-footer{display:flex;align-items:center;justify-content:space-between;font-weight:700;color:var(--cr-red,#b91f3b)}.ct-choice .card-footer svg{width:22px;height:22px}
.ct-choice .ct-dark{background:var(--cr-navy,#102a56);border-color:var(--cr-navy,#102a56)}.ct-choice .ct-dark h3,.ct-choice .ct-dark .card-footer{color:#fff}.ct-choice .ct-dark p{color:#c9d6ea}.ct-choice .ct-dark .badge{background:rgba(255,255,255,.16);color:#fff}
/* 10 floating bar */
.ct-float{position:sticky;bottom:14px;z-index:20;padding:0;pointer-events:none}.ct-fbar{pointer-events:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 18px;padding:12px 14px 12px 22px;border:1px solid var(--bs-border-emphasized,#c9d3e3);border-radius:999px;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 12px 34px rgba(16,42,86,.2)}
.ct-fbar span{display:flex;align-items:center;gap:10px;color:var(--bs-fg-3,#4a5468)}.ct-fbar span svg{width:24px;height:24px;color:var(--cr-navy,#102a56);flex:none}.ct-fbar b{color:var(--cr-navy,#102a56)}
/* 12 command */
.ct-code{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding:clamp(22px,4vw,38px);border-radius:20px;background:#0f1d38;color:#e6edf8}
.ct-dots{display:flex;gap:6px;margin-bottom:14px}.ct-dots i{width:10px;height:10px;border-radius:50%;background:#34507f}.ct-code code{display:block;font:600 clamp(1.5rem,4vw,2.4rem)/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#fff;background:none;padding:0}
.ct-code code span{color:#7fb2ff}.ct-code p{margin-top:12px;color:#aebfda}
/* 13 checks */
.ct-checks .card-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,4vw,44px);align-items:center;padding:clamp(22px,4vw,40px)}.ct-checks ul{display:grid;gap:12px;margin:0;padding:0;list-style:none}
/* 14 aside */
.ct-aside{padding:clamp(18px,3vw,28px) 0}.ct-aside .card{display:flex;align-items:center;gap:16px;max-width:520px;margin-left:0;padding:16px 18px;text-decoration:none;transition:border-color .15s}.ct-aside .card:hover{border-color:var(--cr-navy,#102a56)}
.ct-aside b{color:var(--cr-navy,#102a56);font-size:1.05rem}.ct-aside p{font-size:.92rem}.ct-aside i{margin-left:auto;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cr-red,#b91f3b);color:#fff;flex:none}.ct-aside i svg{width:18px;height:18px}
/* 15 faces */
.ct-faces .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px;padding-top:clamp(22px,4vw,34px);padding-bottom:clamp(22px,4vw,34px);border:1px solid var(--bs-border-color,#dde3ec);border-radius:22px;background:var(--bs-bg-1,#f5f8fc)}
.ct-who{display:flex;align-items:center;gap:clamp(14px,3vw,26px);flex:1 1 420px}.ct-who h2{margin:0 0 4px;font-size:clamp(1.4rem,3vw,2rem)}
.ct-stack{display:flex;flex:none}.ct-stack i,.ct-stack em{display:grid;place-items:center;width:46px;height:46px;margin-left:-12px;border:3px solid #fff;border-radius:50%;background:#e9f0f7;font-style:normal;font-size:1.35rem;font-family:'Segoe UI Emoji','Apple Color Emoji','Noto Color Emoji',sans-serif}
.ct-stack i:first-child{margin-left:0}.ct-stack em{background:var(--cr-navy,#102a56);color:#fff;font-size:1.1rem;font-weight:700}
@media (max-width:720px){.ct-split .card-body,.ct-checks .card-body,.ct-two,.ct-line{grid-template-columns:1fr}.ct-line::before{display:none}.ct-art{display:none}.ct-spot .card-body{flex-direction:column}
.ct-pillbar span{display:none}.ct-bar{flex-wrap:wrap}.ct-bar .btn{width:100%}.ct-fbar{border-radius:22px}.ct-float{bottom:8px}.ct-trust .btn,.ct-code .btn,.ct-faces .btn{width:100%}}

.ct .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;min-width:232px;padding:13px 26px;border-radius:10px;border:0;background:#b91f3b;color:#fff;font-family:inherit;font-size:16px;font-weight:650;line-height:21px;text-decoration:none;cursor:pointer}
.ct .btn:hover{background:#9c1830;color:#fff}.ct .btn.theme-onband{background:#fff;color:#102a56}
.ct .cr-more{font-weight:650;color:#102a56;text-decoration:none}.ct .cr-more::after{content:" \203A";font-size:1.2em}.ct .cr-more:hover{text-decoration:underline}
.cx-btn{box-sizing:border-box;min-width:232px;min-height:47px;padding:13px 26px;font-size:16px;font-weight:650;line-height:21px}
.ct .card-body{display:block}.ct a.card{color:inherit}.ct h2,.ct h3{border:0;padding:0}.ct{font-family:inherit}

/* ===== top bar drop-down (site/navdd.py): Features v -> How It Works, Security ===== */
.cr-links .cr-dd{position:relative;align-items:center}
.cr-links .cr-dd>a.nav-link{padding-right:4px}
.cr-links .cr-dd.on>a.nav-link{color:#b91f3b;font-weight:650}
.cr-links .cr-ddb{appearance:none;display:grid;place-items:center;width:26px;height:32px;margin:0 2px 0 0;padding:0;border:0;border-radius:8px;background:none;color:#5b6779;cursor:pointer}
.cr-links .cr-ddb svg{width:14px;height:14px;transition:transform .15s}
.cr-links .cr-ddb:hover,.cr-links .cr-ddb:focus-visible{background:#eef2f7;color:#102a56}
.cr-links .cr-ddb:focus-visible{outline:3px solid #b91f3b;outline-offset:1px}
.cr-links .cr-dd.open .cr-ddb svg{transform:rotate(180deg)}
.cr-nav .cr-ddm{position:absolute;left:-10px;top:calc(100% + 8px);z-index:60;width:320px;margin:0;padding:8px;list-style:none;background:#fff;border:1px solid #dde3ec;border-radius:16px;box-shadow:0 18px 44px rgba(16,42,86,.18);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .14s,transform .14s,visibility .14s}
.cr-nav .cr-ddm:before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.cr-nav .cr-dd.open .cr-ddm,.cr-nav .cr-dd:focus-within .cr-ddm{opacity:1;visibility:visible;transform:none}
@media (hover:hover){.cr-nav .cr-dd:hover .cr-ddm{opacity:1;visibility:visible;transform:none}.cr-links .cr-dd:hover .cr-ddb svg{transform:rotate(180deg)}}
.cr-nav .cr-ddm a.cr-ddi{display:block;padding:10px 12px;border-radius:10px;color:#1d2733;text-decoration:none}
.cr-nav .cr-ddm a.cr-ddi b{display:flex;align-items:center;gap:8px;font-size:.98rem;font-weight:650;color:#102a56}
.cr-nav .cr-ddm a.cr-ddi b i{font-style:normal;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:#e9f0f7;color:#1c4570}
.cr-nav .cr-ddm a.cr-ddi span{display:block;margin-top:2px;font-size:.86rem;color:#5b6779}
.cr-nav .cr-ddm a.cr-ddi:hover,.cr-nav .cr-ddm a.cr-ddi:focus-visible{background:#f3f6fa;outline:none}
.cr-nav .cr-ddm a.cr-ddi.on{background:#e9f0f7}
.cr-nav .cr-ddm .cr-dds{height:1px;margin:6px 10px;background:#e6ebf2}
@media (prefers-reduced-motion:reduce){.cr-nav .cr-ddm,.cr-links .cr-ddb svg{transition:none}}