/* Full Support Hub */
.support-hero {
    width: min(1220px, calc(100% - 32px));
    margin: 0 auto;
    padding: 92px 0 42px;
    display: grid;
    grid-template-columns: 1.35fr .75fr;
    gap: 28px;
    align-items: stretch;
}

.support-hero h1 {
    margin: 10px 0 18px;
    font-size: clamp(42px, 7vw, 86px);
    line-height: .95;
    letter-spacing: -.06em;
    max-width: 920px;
}

.support-hero p {
    color: var(--muted);
    max-width: 780px;
    font-size: 18px;
    line-height: 1.7;
}

.support-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 28px;
}

.support-status-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(34,232,255,.2);
    border-radius: 30px;
    padding: 30px;
    background:
        radial-gradient(circle at top right, rgba(34,232,255,.18), transparent 38%),
        radial-gradient(circle at bottom left, rgba(157,92,255,.16), transparent 44%),
        var(--panel-strong);
    box-shadow: var(--shadow);
}

.support-status-card h2 {
    margin-top: 68px;
    font-size: 28px;
}

.status-orb {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 68px;
    height: 68px;
    border-radius: 999px;
    background: radial-gradient(circle, var(--green), rgba(77,255,191,.04) 70%);
    box-shadow: 0 0 38px rgba(77,255,191,.34);
}

.support-nav-strip {
    width: min(1220px, calc(100% - 32px));
    margin: 0 auto 34px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255,255,255,.04);
}

.support-nav-strip a {
    padding: 10px 15px;
    border-radius: 999px;
    color: var(--muted);
    font-weight: 900;
    transition: .2s ease;
}

.support-nav-strip a:hover {
    color: var(--text);
    background: rgba(255,255,255,.07);
}

.support-grid,
.docs-grid,
.checklist-grid {
    width: min(1220px, calc(100% - 32px));
    margin: 0 auto;
    display: grid;
    gap: 18px;
}

.support-grid {
    grid-template-columns: repeat(3, 1fr);
    padding-bottom: 40px;
}

.support-card {
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025)),
        rgba(7,9,24,.72);
    box-shadow: var(--shadow);
}

.support-card span {
    color: var(--cyan);
    font-weight: 950;
    letter-spacing: .18em;
}

.support-card h2 {
    margin: 14px 0 10px;
}

.support-card p,
.timeline p,
.doc-card p,
.faq-list p {
    color: var(--muted);
    line-height: 1.7;
}

.support-section {
    padding: 36px 0;
}

.timeline {
    width: min(1220px, calc(100% - 32px));
    margin: 0 auto;
    display: grid;
    gap: 16px;
}

.timeline-item {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 18px;
    border: 1px solid var(--line);
    border-radius: 26px;
    padding: 22px;
    background: rgba(255,255,255,.04);
}

.timeline-item > strong {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--purple), var(--cyan));
    color: #06101a;
    font-size: 22px;
}

.timeline-item code {
    display: block;
    margin-top: 12px;
    padding: 13px 15px;
    border-radius: 16px;
    background: rgba(0,0,0,.28);
    color: #d9e2ff;
    overflow-x: auto;
}

.docs-grid {
    grid-template-columns: repeat(2, 1fr);
}

.doc-card {
    border: 1px solid var(--line);
    border-radius: 30px;
    padding: 22px;
    background:
        radial-gradient(circle at top right, rgba(157,92,255,.12), transparent 34%),
        rgba(255,255,255,.045);
    box-shadow: var(--shadow);
}

.doc-card-top {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 16px;
    align-items: center;
}

.doc-card-top img {
    width: 150px;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.1);
}

.doc-card-top span {
    color: var(--cyan);
    font-size: 12px;
    letter-spacing: .12em;
    font-weight: 900;
}

.doc-card h3 {
    margin: 8px 0 0;
    font-size: 25px;
}

.doc-card h4 {
    margin: 22px 0 10px;
    color: var(--text);
}

.doc-card ul,
.doc-card ol {
    color: var(--muted);
    line-height: 1.8;
    padding-left: 20px;
}

.doc-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 22px;
}

.faq-list {
    width: min(980px, calc(100% - 32px));
    margin: 0 auto;
    display: grid;
    gap: 12px;
}

.faq-list details {
    border: 1px solid var(--line);
    border-radius: 20px;
    background: rgba(255,255,255,.045);
    padding: 18px 20px;
}

.faq-list summary {
    cursor: pointer;
    font-weight: 950;
    font-size: 18px;
}

.faq-list p {
    margin-bottom: 0;
}

.checklist-grid {
    grid-template-columns: repeat(2, 1fr);
    padding-bottom: 70px;
}

@media (max-width: 900px) {
    .support-hero,
    .support-grid,
    .docs-grid,
    .checklist-grid {
        grid-template-columns: 1fr;
    }

    .doc-card-top {
        grid-template-columns: 1fr;
    }

    .doc-card-top img {
        width: 100%;
    }

    .support-nav-strip {
        border-radius: 24px;
    }

    .timeline-item {
        grid-template-columns: 1fr;
    }
}


.support-flash-wrap,
.support-access-box {
    width: min(1220px, calc(100% - 32px));
    margin: 0 auto 24px;
}

.support-access-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 22px;
    border: 1px solid rgba(34,232,255,.22);
    border-radius: 28px;
    padding: 22px;
    background:
        radial-gradient(circle at top right, rgba(34,232,255,.12), transparent 42%),
        rgba(255,255,255,.045);
    box-shadow: var(--shadow);
}

.support-access-box h2 {
    margin: 0 0 8px;
}

.support-access-box p {
    margin: 0;
    color: var(--muted);
    line-height: 1.6;
}

@media (max-width: 760px) {
    .support-access-box {
        flex-direction: column;
        align-items: stretch;
    }
}


/* Separated support pages */
.support-hero-premium {
    padding-bottom: 28px;
}

.support-page-tabs {
    margin-top: 4px;
    margin-bottom: 44px;
}

.support-link-card {
    color: inherit;
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.support-link-card:hover {
    transform: translateY(-5px);
    border-color: rgba(34,232,255,.45);
    box-shadow: 0 0 40px rgba(34,232,255,.12), var(--shadow);
}

.docs-grid-full {
    grid-template-columns: 1fr;
    padding-bottom: 70px;
}

.docs-grid-full .doc-card {
    width: 100%;
}

.doc-code-stack {
    display: grid;
    gap: 12px;
    margin-top: 14px;
}

.doc-code-stack details {
    border: 1px solid rgba(34,232,255,.18);
    border-radius: 16px;
    background: rgba(0,0,0,.22);
    overflow: hidden;
}

.doc-code-stack summary {
    cursor: pointer;
    padding: 14px 16px;
    color: var(--cyan);
    font-weight: 900;
}

.doc-code-stack pre {
    margin: 0;
    padding: 16px;
    overflow-x: auto;
    color: #d9e2ff;
    line-height: 1.6;
}

.faq-page-list {
    padding-bottom: 40px;
}

.support-terms-panels {
    padding-bottom: 20px;
}


.support-link-card {
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.support-link-card:hover {
    transform: translateY(-4px);
    border-color: rgba(34,232,255,.34);
    box-shadow: 0 0 28px rgba(34,232,255,.12);
}


/* Phantom Documentation App */
.page-hero-docs-compact { padding-bottom: 20px; }
.docs-app-shell{width:min(1380px,calc(100% - 32px));margin:0 auto 70px;display:grid;grid-template-columns:290px minmax(0,1fr)250px;gap:18px;align-items:start}.docs-app-sidebar,.docs-app-toc,.docs-page{background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02)),rgba(7,9,24,.82)}.docs-app-sidebar,.docs-app-toc{position:sticky;top:92px;padding:0;overflow:hidden}.docs-app-sidebar-inner{padding:22px}.docs-app-label{display:inline-block;color:var(--cyan);font-size:11px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;margin-bottom:10px}.docs-app-head h3{margin:0 0 8px}.docs-app-head p{margin:0;color:var(--muted);line-height:1.6}.docs-external-links{display:grid;gap:8px;margin-top:18px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08)}.docs-external-links a{display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:10px;padding:12px 14px;border:1px solid rgba(255,255,255,.06);border-radius:16px;color:var(--muted);background:rgba(255,255,255,.025);transition:.2s ease}.docs-external-links a:hover{color:var(--text);border-color:rgba(34,232,255,.28);background:rgba(34,232,255,.07)}.docs-external-links strong{color:inherit}.docs-external-links em,.docs-nav-group-toggle em{font-style:normal;color:var(--cyan)}.docs-app-nav-groups{display:grid;gap:18px;margin-top:18px}.docs-nav-group{display:grid;gap:10px}.docs-nav-group-toggle{width:100%;display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:10px;margin:4px 0 0;border:0;background:transparent;color:var(--text);padding:6px 2px;cursor:pointer;text-align:left}.docs-nav-group-toggle strong{font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.docs-nav-group-toggle em{transition:transform .2s ease}.docs-nav-group:not(.open) .docs-nav-group-toggle em{transform:rotate(-90deg)}.docs-nav-group-items{display:none;gap:10px}.docs-nav-group.open .docs-nav-group-items{display:grid}.docs-nav-item{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);border-radius:18px;padding:14px 15px;color:var(--text);cursor:pointer;transition:.2s ease}.docs-nav-item:hover,.docs-nav-item.active{transform:translateY(-1px);border-color:rgba(34,232,255,.34);background:linear-gradient(180deg,rgba(34,232,255,.10),rgba(255,255,255,.03));box-shadow:0 0 28px rgba(34,232,255,.08)}.docs-nav-item-top{display:grid;gap:5px}.docs-nav-item strong{font-size:14px}.docs-nav-item small{color:var(--muted);line-height:1.4}.docs-nav-item-arrow{color:var(--cyan);font-size:24px;line-height:1}.docs-page{display:none;border-radius:30px;padding:24px}.docs-page.active{display:block}.docs-page-hero{display:grid;grid-template-columns:1.2fr 260px;gap:20px;align-items:center;margin-bottom:18px}.docs-page-hero-simple{grid-template-columns:1fr}.docs-page-copy h2{margin:0 0 10px;font-size:clamp(32px,4.8vw,58px);line-height:1.02;letter-spacing:-.05em}.docs-page-copy p{margin:0;color:var(--muted);line-height:1.75;font-size:18px}.docs-page-cover img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:22px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04)}.docs-page-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:16px;margin-bottom:10px;border-bottom:1px solid rgba(255,255,255,.08)}.docs-page-frameworks,.docs-page-pills{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.doc-meta-pill{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--muted);font-weight:700}.docs-section{padding:20px 0;border-bottom:1px solid rgba(255,255,255,.06);scroll-margin-top:110px}.docs-section:last-child{border-bottom:0}.docs-section h3{margin:0 0 12px;font-size:26px}.docs-section p,.docs-section li{color:var(--muted);line-height:1.85;font-size:16px}.doc-clean-list{margin:0;padding-left:20px}.docs-code{padding:16px 18px;border-radius:18px;background:rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.09);color:#d9e2ff;overflow-x:auto;margin-top:16px}.docs-large-image{margin:22px auto 6px;width:min(100%,980px);border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.22);box-shadow:0 22px 70px rgba(0,0,0,.34)}.docs-large-image img{width:100%;height:auto;display:block;object-fit:contain}.docs-large-image figcaption{padding:10px 14px;color:var(--muted);text-align:center;font-size:13px;border-top:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}.docs-quick-note{margin-top:14px;display:grid;gap:6px;border-radius:18px;padding:14px 16px;background:rgba(34,232,255,.06);border:1px solid rgba(34,232,255,.16)}.docs-quick-note strong{color:var(--text)}.docs-quick-note span{color:var(--muted);line-height:1.6}.docs-inline-link,.docs-inline-button{color:var(--cyan);font-weight:900;text-decoration:underline;text-underline-offset:4px}.docs-inline-button{border:0;background:transparent;cursor:pointer;font:inherit;padding:0}.docs-inline-link:hover,.docs-inline-button:hover{color:var(--text);text-shadow:0 0 16px rgba(34,232,255,.45)}.docs-video-embed{margin:22px auto 8px;width:min(100%,980px);aspect-ratio:16/9;border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:#000;box-shadow:0 22px 70px rgba(0,0,0,.34)}.docs-video-embed iframe{width:100%;height:100%;display:block;border:0}.docs-toc-panel{display:none;gap:8px;margin-top:18px}.docs-toc-panel.active{display:grid}.docs-toc-panel a{display:block;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);border-radius:16px;padding:11px 12px;color:var(--muted);transition:.2s ease}.docs-toc-panel a:hover{border-color:rgba(34,232,255,.28);color:var(--text);background:rgba(34,232,255,.07)}@media(max-width:1180px){.docs-app-shell{grid-template-columns:280px minmax(0,1fr)}.docs-app-toc{display:none}}@media(max-width:920px){.docs-app-shell{grid-template-columns:1fr}.docs-app-sidebar,.docs-app-toc{position:static}.docs-page-hero{grid-template-columns:1fr}}


.docs-rich-list {
    margin-top: 14px;
}

.docs-config-code-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    margin-top: 16px;
}

.docs-config-code-card {
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.04);
    overflow: hidden;
}

.docs-config-code-card h4 {
    margin: 0;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    color: var(--text);
}

.docs-config-code-card .docs-code {
    margin: 0;
    border-radius: 0;
    border: 0;
    background: rgba(0,0,0,.25);
}