/* =====================================================================
   AOM TRADERS — V61 GUIDE PAGE (/app)
   Self-contained, scoped to .v61-guide. One left edge for every block,
   one heading scale, even section rhythm.
   ===================================================================== */
.v61-guide{
  --g-ink:var(--q-ink,#f2fbff);--g-ink-2:var(--q-ink-2,rgba(226,244,252,.74));--g-ink-3:var(--q-ink-3,rgba(200,228,240,.52));
  --g-cyan:var(--q-cyan,#3fe3ff);--g-mint:var(--q-mint,#3cf2b0);
  --g-line:var(--p-border,rgba(63,227,255,.14));
  --g-bg:var(--p-bg,linear-gradient(160deg,rgba(10,34,50,.80),rgba(4,14,22,.92)));
  --g-shadow:var(--p-shadow,0 24px 60px -36px rgba(0,0,0,.85));
  --g-mono:var(--q-mono,ui-monospace,Menlo,Consolas,monospace);
  --g-display:var(--q-display,"Segoe UI",Roboto,Inter,system-ui,sans-serif);
  --g-gap:clamp(40px,5vw,72px);
  position:relative;z-index:2;
}

/* shared card */
.v61-guide .v61-card{
  position:relative;border:1px solid var(--g-line);border-radius:18px;
  background:var(--g-bg);box-shadow:var(--g-shadow);
}
.v61-guide .v61-card::before{
  content:"";position:absolute;top:-1px;left:-1px;width:22px;height:22px;pointer-events:none;
  border-top:1.5px solid var(--g-cyan);border-left:1.5px solid var(--g-cyan);border-top-left-radius:18px;opacity:.7;
}
.v61-guide .v61-k{font:600 10px/1.2 var(--g-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--g-ink-3)}

/* ---------- hero ------------------------------------------------------ */
.v61-guide .v61-hero{padding:clamp(18px,3vh,36px) 0 0!important;min-height:0!important;border:0!important;background:none!important}
.v61-guide .v61-hero::before,.v61-guide .v61-hero::after{display:none!important}
.v61-guide .v61-hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:clamp(24px,4vw,64px);align-items:center}
.v61-guide .v61-hero-copy{text-align:left}
.v61-guide .v61-hero h1{
  margin:12px 0 14px!important;max-width:18ch;
  font:800 clamp(34px,2.2vw + 14px,56px)/1.04 var(--g-display)!important;letter-spacing:-.035em!important;color:var(--g-ink);
}
.v61-guide .v61-hero .lead{max-width:620px;margin:0;font-size:clamp(14px,.3vw + 12px,16px);line-height:1.65;color:var(--g-ink-2)}
.v61-guide .v61-hero .hero-actions{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px}

.v61-guide .v61-glance{padding:20px 22px}
.v61-guide .v61-glance dl{margin:12px 0 0;display:grid;gap:0}
.v61-guide .v61-glance dl > div{display:grid;grid-template-columns:118px 1fr;gap:12px;align-items:baseline;padding:11px 0;border-top:1px solid rgba(255,255,255,.06)}
.v61-guide .v61-glance dl > div:first-child{border-top:0}
.v61-guide .v61-glance dt{font:700 11px/1.3 var(--g-mono);letter-spacing:.08em;color:var(--g-cyan)}
.v61-guide .v61-glance dd{margin:0;font-size:13.5px;line-height:1.45;color:var(--g-ink-2)}

/* ---------- sections -------------------------------------------------- */
.v61-guide .v61-sec{padding:var(--g-gap) 0 0!important;background:none!important;border:0!important}
.v61-guide .v61-sec-last{padding-bottom:var(--g-gap)!important}
.v61-guide .v61-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:18px}
.v61-guide .v61-head h2{margin:8px 0 0!important;font:800 clamp(24px,.9vw + 16px,34px)/1.1 var(--g-display)!important;letter-spacing:-.028em!important;color:var(--g-ink)}
.v61-guide .v61-head p{margin:0;max-width:440px;font-size:14px;line-height:1.6;color:var(--g-ink-3);text-align:right}

.v61-guide .v61-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.v61-guide .v61-steps > li{padding:20px 22px 22px;display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:6px;align-content:start}
.v61-guide .v61-n{
  grid-row:span 2;display:inline-grid;place-items:center;width:38px;height:38px;border-radius:10px;
  font:700 12px/1 var(--g-mono);color:var(--g-cyan);border:1px solid rgba(63,227,255,.3);background:rgba(63,227,255,.06);
}
.v61-guide .v61-steps h3{margin:2px 0 0!important;font:700 17px/1.25 var(--g-display)!important;letter-spacing:-.01em;color:var(--g-ink)}
.v61-guide .v61-steps p{margin:0;font-size:14px;line-height:1.6;color:var(--g-ink-2)}

.v61-guide .v61-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.v61-guide .v61-panel{padding:22px 24px;display:flex;flex-direction:column;gap:10px}
.v61-guide .v61-h{margin:4px 0 2px!important;font:800 clamp(20px,.6vw + 15px,26px)/1.15 var(--g-display)!important;letter-spacing:-.022em!important;color:var(--g-ink)}
.v61-guide .v61-panel p{margin:0;font-size:14px;line-height:1.6;color:var(--g-ink-2)}
.v61-guide .v61-panel p b{color:var(--g-ink)}
.v61-guide .v61-list{margin:6px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.v61-guide .v61-list li{position:relative;padding-left:20px;font-size:13.5px;line-height:1.5;color:var(--g-ink-2)}
.v61-guide .v61-list li::before{content:"";position:absolute;left:2px;top:.55em;width:7px;height:7px;border-radius:2px;background:var(--g-cyan);box-shadow:0 0 10px rgba(63,227,255,.6)}
.v61-guide .v61-codes{display:grid;gap:8px;margin-top:4px}
.v61-guide .v61-codes > div{display:grid;grid-template-columns:200px 1fr;gap:12px;align-items:baseline;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.06);background:rgba(0,0,0,.18)}
.v61-guide .v61-codes b{font:700 11px/1.3 var(--g-mono);letter-spacing:.04em;color:var(--g-ink);word-break:break-word}
.v61-guide .v61-codes > div:first-child b{color:var(--g-mint)}
.v61-guide .v61-codes span{font-size:13px;line-height:1.45;color:var(--g-ink-2)}
.v61-guide .v61-mini{flex-direction:row;align-items:center;justify-content:space-between;gap:20px}
.v61-guide .v61-mini > div{display:flex;flex-direction:column;gap:6px;min-width:0}
.v61-guide .v61-mini .btn{flex:0 0 auto}

/* ---------- responsive ------------------------------------------------ */
@media (max-width:1100px){
  .v61-guide .v61-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v61-guide .v61-codes > div{grid-template-columns:1fr;gap:4px}
}
@media (max-width:900px){
  .v61-guide .v61-hero-grid,.v61-guide .v61-two{grid-template-columns:1fr}
  .v61-guide .v61-head{flex-direction:column;align-items:flex-start}
  .v61-guide .v61-head p{text-align:left}
  .v61-guide .v61-mini{flex-direction:column;align-items:flex-start}
}
@media (max-width:620px){
  .v61-guide .v61-steps{grid-template-columns:1fr}
  .v61-guide .v61-glance dl > div{grid-template-columns:1fr;gap:3px}
  .v61-guide .v61-steps > li,.v61-guide .v61-panel{padding:18px}
}

/* ---------- finishing ------------------------------------------------- */
.v61-guide .v61-hero h1 span{color:var(--g-ink)!important;-webkit-text-fill-color:currentColor;background:none!important}
.v61-guide .v61-hero h1 em{font-style:normal;color:var(--g-cyan);-webkit-text-fill-color:currentColor;text-shadow:0 0 34px rgba(63,227,255,.25)}
html body.page-app #main > .aom-guide-page.v61-guide > .v61-hero + .v61-sec{padding-top:var(--g-gap)!important}
html body.page-app #main .v61-guide .v61-sec-last{padding-bottom:clamp(28px,3vw,48px)!important}

/* ---------- V63 access hub ---------- */
.v61-guide.v63-access .v61-hero .v61-hero-copy{max-width:760px}
.v61-guide .v63-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:8px}
.v61-guide.v63-access .v62-guide-link{margin-top:16px}