/* Signup Here – additions for stand-alone subdomain pages (content/standalone/*.json, e.g. etoro.signup-here.com).
   Loaded only by those pages, after site.css. Uses the tokens from site.css; no new colours except the warning tones
   already used by .callout-warn / .pc .cons. */

/* Header without main navigation: short label on the right instead of the 18+ badge */
.hdr-note{margin:0 0 0 auto;color:#cfd7e2;font-size:.82rem;line-height:1.3;text-align:right}
@media (max-width:980px){.site-header .bar{padding-bottom:12px;flex-wrap:nowrap}}
@media (max-width:560px){.hdr-note .x{display:none}}

/* Risk warning band directly under the header */
.risk-top{background:var(--rust-tint);border-bottom:1px solid #f0d3c2;color:#4a1d0c}
.risk-top-in{display:flex;gap:12px;align-items:flex-start;padding-top:12px;padding-bottom:12px}
.risk-top p{margin:0;font-size:.88rem;line-height:1.5}
.risk-top b{color:#7c2d12}
.risk-ico{display:inline-grid;place-items:center;flex:none;width:24px;height:24px;margin-top:1px;border-radius:50%;
  background:var(--rust);color:#fff;font:800 .85rem/1 var(--head)}
@media (max-width:640px){.risk-top p{font-size:.84rem}}

/* Footer risk block (takes the place of the responsible-gambling block, same .f-rg layout) */
.risk-ico-lg{width:46px;height:46px;margin-top:0;background:transparent;border:2px solid #e9edf3;font-size:1.25rem}
.f-risk p{max-width:88ch}
.f-risk p b{color:#fff}
.f-risk .f-disc{color:#fff;font-weight:600;margin-bottom:0}
.f-risk .f-src{font-size:.84rem;color:#8d99ab}
.f-risk .f-src a{color:var(--mint)}

/* Name as plain text in the place of an operator logo plate */
.name-badge{display:inline-flex;align-items:center;justify-content:center;height:56px;padding:0 18px;border-radius:11px;
  background:var(--paper-2);border:1px solid var(--line);color:var(--ink);font:800 1.45rem/1 var(--head);letter-spacing:-.01em;flex:none}
@media (max-width:520px){.name-badge{height:46px;padding:0 14px;font-size:1.2rem}}

/* "At a glance" panel (no score: these pages do not use the casino rating scheme) */
.panel-h{font-size:1.05rem;margin:0 0 10px;letter-spacing:0}
.glance{margin:0;border-top:1px solid var(--line)}
.glance div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.glance dt{font-size:.84rem;color:var(--muted);line-height:1.4}
.glance dd{margin:0;font-size:.88rem;font-weight:600;color:var(--ink);line-height:1.4;text-align:right}

/* Numbered source citations */
.cite{font-size:.7em;line-height:0;vertical-align:super;margin-left:1px;white-space:nowrap}
.cite a{text-decoration:none;font-weight:650;padding:0 1px}
.cite a:hover{text-decoration:underline}
.sources li{scroll-margin-top:20px}
.sources li:target{background:var(--go-tint);border-radius:6px}
.rv-body .facts dd p{margin:0}

/* Paragraph directly after a facts box */
.rv-body section > .facts + p{margin-top:1.05em}

/* Outline button inside the dark verdict box (".verdict a" would otherwise turn its label mint on white) */
.verdict a.btn-line{color:var(--ink)}
.verdict a.btn-line:hover{color:var(--ink);border-color:var(--mint)}

/* Footer: site.css sets padding shorthands on .f-main/.f-bottom that cancel the .wrap gutter (flush to the screen
   edge on phones). Restored here for these pages only; site.css is left untouched. */
.site-footer .f-main,.site-footer .f-bottom{padding-left:var(--gut);padding-right:var(--gut)}

/* Guide pages (content/standalone/*.json with "kind": "guide", e.g. xtb.signup-here.com): one column under the hero,
   no risk band (the page only explains how registration works), disclosure as a quiet aside at the top of the article. */
.guide{padding-top:34px}
.guide > *{max-width:76ch}
.guide h2{margin-top:1.6em}
.guide > h2:first-of-type{margin-top:0}
.guide .steps{margin:0 0 1.2em}
.guide .callout{margin:1.2em 0}
.guide-disclose{font-size:.9rem;line-height:1.55;color:var(--muted);border-left:3px solid var(--line-2);padding:2px 0 2px 14px;margin:0 0 1.6em}
.f-guide .risk-ico-lg{font-style:italic;font-family:var(--head)}

/* Top-ten list page (content/standalone/*.json with "kind": "toplist", topten.signup-here.com): one column under the hero,
   an overview table, then ten numbered cards with a small facts grid. No risk band, no rating scheme, no logos. */
.toplist{padding-top:34px}
.toplist > *{max-width:76ch}
.toplist h2{margin-top:1.6em}
.toplist > h2:first-of-type{margin-top:0}
.tl-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-s);box-shadow:var(--shadow)}
.tl-table{width:100%;min-width:560px;border-collapse:collapse;font-size:.92rem}
.tl-table th{font:650 .72rem/1.2 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:left;
  padding:11px 12px;background:#faf9f5;border-bottom:1px solid var(--line)}
.tl-table td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.45}
.tl-table tr:last-child td{border-bottom:0}
.tl-table .n{width:34px;text-align:center;font:800 .9rem/1.45 var(--head);color:var(--ink)}
.tl-table a{font-weight:650;color:var(--ink)}
.tl-criteria{margin:0 0 1.2em}
.tl-list{list-style:none;margin:0;padding:0}
.tl-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);
  padding:22px 24px;margin:0 0 18px;scroll-margin-top:20px}
.tl-head{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.tl-rank{display:inline-grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;
  font:800 1.1rem/1 var(--head)}
.tl-item:first-child .tl-rank{background:var(--go)}
.tl-head h3{margin:0;font-size:1.3rem;line-height:1.2}
.tl-tag{margin:3px 0 0;font-size:.86rem;color:var(--go-hover);font-weight:650}
.tl-glance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 16px;margin:0 0 14px;padding:12px 14px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-s)}
.tl-glance div{min-width:0}
.tl-glance dt{font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);line-height:1.3}
.tl-glance dd{margin:2px 0 0;font-size:.88rem;font-weight:600;color:var(--ink);line-height:1.4;overflow-wrap:anywhere}
.tl-item p{margin:0 0 .9em}
.tl-item h4{margin:1em 0 .4em;font-size:.95rem}
.tl-high{margin:0 0 1em;padding-left:1.2em}
.tl-note{font-size:.92rem;color:var(--muted)}
.tl-act{margin:0}
@media (max-width:640px){.tl-item{padding:18px 16px}.tl-glance{grid-template-columns:repeat(2,minmax(0,1fr))}.tl-head h3{font-size:1.18rem}}
/* Phones: the overview table becomes a stack of small cards instead of a sideways-scrolling table */
@media (max-width:640px){
  .tl-wrap{overflow:visible;background:transparent;border:0;box-shadow:none;border-radius:0}
  .tl-table,.tl-table tbody{display:block;min-width:0}
  .tl-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .tl-table tr{display:grid;grid-template-columns:30px minmax(0,1fr);gap:2px 10px;background:var(--surface);border:1px solid var(--line);
    border-radius:var(--r-s);box-shadow:var(--shadow);padding:12px 14px;margin:0 0 10px}
  .tl-table td{display:block;padding:0;border:0}
  .tl-table .n{grid-row:1/span 4;width:auto;text-align:left;line-height:1.5}
  .tl-table td:nth-child(3)::before{content:"Since ";color:var(--muted)}
  .tl-table td:nth-child(4)::before{content:"Based in ";color:var(--muted)}
  .tl-table td:nth-child(5){color:var(--go-hover);font-weight:600}
}