:root{
      --bg:#fff;--fg:#0b1220;--muted:#6b7280;--brand:#49d1c1;--border:#e5e7eb;--card:#f9fafb;--dark:#1a1f36;
    }
  
 .page{padding:16px; box-sizing: border-box;}



    h1{font-size:34px;margin:0 0 12px}
    h2{font-size:24px;margin:28px 0 14px;color:var(--dark)}
   
    .block{margin:28px 0}
    .block b{
     font-weight: normal; 
     color: #49d1c1; 
    }

    .block ul{
     list-style: none; 

    }


    .imgwrap{width:100%;text-align:center;margin:24px 0}
    .imgwrap img{max-width:520px;border-radius:18px;box-shadow:0 8px 28px rgba(0,0,0,.12)}
    .note{background:var(--card);border-left:4px solid var(--brand);padding:14px 16px;border-radius:8px;margin-top:10px}
    .muted{color:var(--muted)}
    .toc{background:#1A1F36;color:#e5e7eb;border:1px solid var(--dark);border-radius:12px;padding:25px; box-sizing: border-box;}
    .toc a{color:var(--brand);text-decoration:none}
    .toc ol{margin:0 0 0 18px}
    .anchor{scroll-margin-top:90px}

   
    .faq{margin:28px 0}
    .faq-item{border:1px solid var(--border);border-radius:12px;background:#1A1F36; color: #fff; overflow:hidden;margin-bottom:12px}
    .faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
      background:#1A1F36; padding:16px; box-sizing: border-box; border:0;cursor:pointer;color: #fff;}
    .faq-q span{
      color: #49d1c1;
    }

    .faq-q:focus{outline:2px solid var(--brand);outline-offset:2px}
    .faq-q .tag{font-size:12px;font-weight:700;color:#0a0f14;background:var(--brand);padding:3px 8px;border-radius:999px}
    .faq-q .chev{transition:transform .2s ease}
    .faq-item[aria-expanded="true"] .chev{transform:rotate(180deg)}
    .faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease;}
    .faq-item[aria-expanded="true"] .faq-a{max-height:700px}
    .faq-a-inner{padding:0 20px 20px 20px; font-size: 14px}
    .faq-a-inner ul{margin:8px 0 0 18px}
    .faq-a-inner b{
     font-weight: normal; 
     color: #49d1c1;
    }


    .badge{
     display: inline-block;
    border: 1px solid var(--border);
    
    padding: 10px 11px;
    margin-right: 6px;
    font-size: 12px;
    background: #1A1F36;
    color: #49d1c1; 
    }
    .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
    @media (max-width:900px){.grid{grid-template-columns:1fr}}

    html{scroll-behavior:smooth}





@media (min-width: 400px)  and (max-width: 767px) {

 h1{
    font-size: 30px;
  }



}
@media (min-width: 380px)  and (max-width: 399px) {

 h1{
    font-size: 30px;
  }

.toc ol{
 margin:0; 
}


}
@media (min-width: 360px)  and (max-width: 379px) {

 h1{
    font-size: 30px;
  }

.toc ol{
 margin:0; 
}

.page{
 padding: 0; 
}

}
@media (min-width: 340px)  and (max-width: 359px) {

 h1{
    font-size: 26px;
  }

.toc{
 padding: 10px; 
}

.toc ol{
 margin:0; 
}

.page{
 padding: 0; 
}


}
@media (min-width: 320px)  and (max-width: 339px) {

 h1{
    font-size: 26px;
  }

.toc{
 padding: 10px; 
}

.toc ol{
 margin:0; 
}

.page{
 padding: 0; 
}

.block ul {
padding-left: 15px;
}

}
@media (min-width: 300px)  and (max-width: 319px) {

h1{
    font-size: 26px;
  }

.toc{
 padding: 10px; 
}

.toc ol{
 margin:0; 
}

.page{
 padding: 0; 
}

.block ul {
padding-left: 15px;
}
  
}