/* Extends the existing StormMu page guides without changing global navigation. */
.mcg { color: var(--sp-text); }
.mcg a:not(.sp-button):not(.sp-button-alt) { color: var(--sp-gold-soft); }
.mcg a:focus-visible,.mcg summary:focus-visible { outline: 2px solid var(--sp-gold-soft); outline-offset: 5px; }
.mcg [id] { scroll-margin-top: 105px; }
.mcg .sp-hero-copy h1 em { color: var(--sp-gold-soft); font-style: normal; }
.mcg .sp-hero-copy p strong { color: var(--sp-gold-soft); }
.mcg-diagram { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px; padding: 36px 25px; border-left: 1px solid var(--sp-line); background: radial-gradient(ellipse at center,rgba(212,175,55,.10),transparent 72%); text-align: center; }
.mcg-diagram-label { color: var(--sp-text-muted); font-size: .68rem; font-weight: 700; letter-spacing: .17em; }
.mcg-accounts { display: flex; align-items: center; gap: 20px; }
.mcg-account { min-width: 125px; display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 18px; border: 1px solid var(--sp-line); border-radius: 18px; background: rgba(10,14,24,.8); }
.mcg-account > i { color: var(--sp-gold-soft); font-size: 1.6rem; }
.mcg-account strong { font-size: .94rem; }
.mcg-account span { color: #79e6ad; font-size: .78rem; }
.mcg-link { color: var(--sp-gold); }
.mcg-same-ip { color: var(--sp-text-soft); font-size: .8rem; }
.mcg-same-ip i { color: var(--sp-gold-soft); margin-right: 4px; }
.mcg-bonus { width: 176px; height: 176px; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--sp-line-strong); border-radius: 50%; background: radial-gradient(circle,rgba(212,175,55,.16),rgba(10,14,24,.9) 75%); box-shadow: 0 0 0 7px rgba(212,175,55,.035),0 0 45px rgba(212,175,55,.08); }
.mcg-bonus strong { color: var(--sp-gold-soft); font-size: 3.6rem; line-height: 1.1; letter-spacing: -.055em; }
.mcg-bonus strong span { font-size: 2rem; }
.mcg-bonus > span { color: var(--sp-gold-soft); font-size: .68rem; font-weight: 700; letter-spacing: .16em; margin-top: 7px; }
.mcg-diagram p { color: var(--sp-text-soft); font-size: .85rem; line-height: 1.7; margin: 0; }
.mcg-diagram > small { color: var(--sp-text-muted); font-size: .68rem; }
.mcg-breadcrumb { display: flex; flex-wrap: wrap; gap: 12px; color: var(--sp-text-muted); font-size: .85rem; }
.mcg .sp-steps li p { margin: 5px 0 0; }
.mcg .sp-steps li > div > strong { color: var(--sp-text); }
.mcg-rule-note { margin: 22px 0 0; padding: 16px 18px; border: 1px solid rgba(59,199,128,.2); border-radius: 14px; background: rgba(59,199,128,.045); }
.mcg-rule-note i { color: #79e6ad; margin-right: 7px; }
.mcg-example { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; margin: 22px 0; }
.mcg-example > div:not(.mcg-example-plus) { padding: 24px; border: 1px solid rgba(255,255,255,.08); border-radius: 18px; background: rgba(255,255,255,.02); }
.mcg-example span,.mcg-example small { display: block; color: var(--sp-text-soft); font-size: .78rem; }
.mcg-example span { font-size: .68rem; letter-spacing: .08em; font-weight: 700; }
.mcg-example strong { display: block; color: var(--sp-text); font-size: clamp(2rem,4vw,3rem); line-height: 1.4; }
.mcg-example .mcg-example-total { border-color: var(--sp-line-strong); background: rgba(212,175,55,.05); }
.mcg-example-total strong,.mcg-example-plus { color: var(--sp-gold-soft); }
.mcg-example-plus { font-weight: 800; display: flex; gap: 10px; align-items: center; }
.mcg-command { display: inline-block; padding: 10px 18px; margin-top: 12px; color: var(--sp-gold-soft); border: 1px solid var(--sp-line); border-radius: 10px; background: #090d16; font-size: 1.1rem; }
.mcg-status { display: inline-block; padding: 7px 12px; border-radius: 999px; font-size: .82rem; font-weight: 700; }
.mcg-status-active { color: #79e6ad; background: rgba(59,199,128,.11); border: 1px solid rgba(59,199,128,.2); }
.mcg .sp-card > .mcg-status { margin-top: 12px; }
.mcg-status-table { margin-top: 22px; }
.mcg .sp-table { min-width: 520px; }
.mcg .sp-table caption { padding: 14px 16px; text-align: left; font-weight: 700; color: var(--sp-text); }
.mcg .sp-table td:first-child { width: 33%; }
.mcg-faq { display: grid; gap: 10px; }
.mcg-faq details { border: 1px solid rgba(255,255,255,.07); border-radius: 14px; background: rgba(255,255,255,.025); }
.mcg-faq summary { padding: 18px 20px; cursor: pointer; color: var(--sp-text); font-weight: 700; }
.mcg-faq details[open] { border-color: var(--sp-line-strong); }
.mcg-faq details p { padding: 0 20px 18px; margin: 0; color: var(--sp-text-soft); line-height: 1.8; }
.mcg-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.mcg-cta h2 { font-family: 'Cinzel',serif; font-size: 1.6rem; margin: 16px 0 8px; }
.mcg-cta p { color: var(--sp-text-soft); line-height: 1.7; margin: 0; }
.mcg-cta > a { flex-shrink: 0; }
@media(max-width:1100px) { .mcg-diagram { border-left: 0; border-top: 1px solid var(--sp-line); } .mcg-cta { flex-direction: column; align-items: flex-start; } }
@media(max-width:600px) { .mcg .sp-hero-copy { padding: 28px 22px; } .mcg-diagram { padding: 28px 16px; } .mcg-accounts { gap: 12px; } .mcg-account { min-width: 104px; padding: 16px 10px; } .mcg-example { grid-template-columns: 1fr; gap: 14px; } .mcg-example-plus { justify-content: center; } .mcg-example-plus i { transform: rotate(90deg); } .mcg .sp-table td:first-child { width: auto; } .mcg .sp-section-title h2 { line-height: 1.4; } }
