*{box-sizing:border-box}

body{

  margin:0;

  font-family:Arial,Helvetica,sans-serif;

  background:#f6f8fb;

  color:#1f2937;

  line-height:1.7;

}

header{

  background:#0f172a;

  color:#fff;

  padding:18px 20px;

}

.header-inner{

  max-width:1000px;

  margin:auto;

}

.logo{

  font-size:22px;

  font-weight:700;

}

.logo a{

  color:#fff;

  text-decoration:none;

}

nav{

  margin-top:10px;

}

nav a{

  color:#cbd5e1;

  text-decoration:none;

  margin-right:18px;

  font-size:14px;

}

main{

  max-width:900px;

  margin:35px auto;

  padding:0 20px;

}

article{

  background:#fff;

  padding:35px;

  border-radius:12px;

  box-shadow:0 4px 18px rgba(0,0,0,.06);

}

h1,h2,h3{

  color:#0f172a;

  line-height:1.3;

}

h1{

  font-size:36px;

  margin-top:0;

}

h2{

  margin-top:35px;

  font-size:26px;

}

h3{

  margin-top:25px;

  font-size:20px;

}

p{

  margin:14px 0;

}

ul{

  padding-left:22px;

}

li{

  margin:8px 0;

}

.box{

  background:#f1f5f9;

  border-left:4px solid #2563eb;

  padding:18px;

  margin:25px 0;

  border-radius:6px;

}

table{

  width:100%;

  border-collapse:collapse;

  margin:20px 0;

}

th,td{

  border:1px solid #d1d5db;

  padding:12px;

  text-align:left;

}

th{

  background:#eaf0f8;

}

.formula{

  background:#f8fafc;

  padding:18px;

  border:1px solid #dbe3ec;

  border-radius:8px;

  margin:18px 0;

  font-weight:600;

}

footer{

  text-align:center;

  padding:30px 20px;

  color:#64748b;

  font-size:14px;

}

@media(max-width:600px){

  h1{font-size:29px}

  article{padding:22px}

  table{font-size:14px}

}

.table-of-contents{

  margin:24px 0;

  border:1px solid #e1e6ee;

  border-radius:12px;

  background:#f8fafc;

  overflow:hidden;

}



.toc-toggle{

  width:100%;

  border:0;

  background:#071b35;

  color:#fff;

  padding:16px 18px;

  font-size:16px;

  font-weight:700;

  display:flex;

  justify-content:space-between;

  align-items:center;

  cursor:pointer;

}



.toc-arrow{

  font-size:18px;

  line-height:1;

}



.toc-content{

  display:none;

  padding:14px 22px;

}



.table-of-contents.open .toc-content{

  display:block;

}



.toc-content ul{

  margin:0;

  padding-left:18px;

}



.toc-content li{

  margin:10px 0;

}



.toc-content a{

  color:#0d3b66;

  text-decoration:none;

  font-weight:600;

}



.toc-content a:hover{

  text-decoration:underline;

}



@media(max-width:600px){

  .toc-toggle{

    padding:15px;

  }



  .toc-content{

    padding:12px 18px;

  }

}

.author-box{

    margin:30px 0;

    padding:20px;

    border:1px solid #ddd;

    border-radius:10px;

    background:#f8f9fa;

}

.author-box strong{

    display:block;

    font-size:18px;

    margin-bottom:5px;

}

.author-box span{

    display:block;

    font-size:14px;

    margin-bottom:12px;

    color:#555;

}

.author-box p{

    margin:0;

    line-height:1.6;

}
