*,::after,::before{box-sizing:border-box}body{font-family:Georgia,serif;background-color:#fff;color:#222;margin:0;padding:0;overflow-x:hidden}html{scroll-behavior:smooth}code,pre{font-family:'Courier New',monospace;font-size:.95rem;background:#f4f4f4;padding:1rem;border-left:4px solid #ccc;white-space:pre-wrap;overflow-x:auto;word-wrap:break-word}header{text-align:center;margin-bottom:2rem}h1{font-size:2.2rem;margin-bottom:.5rem}.subtitle{font-size:1rem;color:#666}article h2{font-size:1.4rem;margin-top:2rem;color:#444}footer{text-align:center;margin-top:3rem;font-size:.9rem;color:#888}.container{max-width:1000px;margin:0 auto;padding:2rem}.navbar{background-color:#2c3e50;color:#fff;padding:.75rem 1.5rem;position:sticky;top:0;z-index:1000;box-shadow:0 2px 5px rgba(0,0,0,.2)}.nav-container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.nav-logo{font-size:1.3rem;font-weight:700}.nav-links{list-style:none;display:flex;gap:1.5rem;margin:0;padding:0}.nav-links a{color:#fff;text-decoration:none;font-size:1rem;transition:color .3s}.nav-links a:hover{color:#1abc9c}.main-layout{display:flex;flex-direction:row;gap:2rem;flex-wrap:wrap}.sidebar{width:250px;height:calc(100vh - 3.5rem);background-color:#f9f9f9;border-right:1px solid #ddd;padding:1rem;overflow-y:auto;position:sticky;top:3.5rem;flex-shrink:0;z-index:100}.sidebar-title{font-size:1.1rem;margin-bottom:1rem;color:#444;text-align:center}.manual-toc ul{list-style:none;padding-left:0}.manual-toc li{margin-bottom:.75rem}.manual-toc a{color:#2c3e50;text-decoration:none;font-size:.95rem}.manual-toc a:hover{color:#1abc9c}.content-area{flex:1;padding:2rem;max-width:100%}.right-panel{width:250px;background-color:#f1f1f1;border-left:1px solid #ccc;padding:1rem;position:sticky;top:3.5rem;height:calc(100vh - 3.5rem);overflow-y:auto;flex-shrink:0}.next-button,.previous-button{padding:12px 25px;font-size:16px;border-radius:5px;color:#fff;text-decoration:none;text-align:center;display:inline-block;transition:background-color .3s ease;margin:1rem 0}.next-button{background-color:#1abc9c}.next-button:hover{background-color:#16a085}.previous-button{background-color:#3498db}.previous-button:hover{background-color:#2980b9}.read-more-btn{display:inline-block;padding:10px 20px;font-size:16px;font-weight:600;color:#fff;background-color:#007acc;border:none;border-radius:6px;text-decoration:none;transition:background-color .3s ease,transform .2s ease;box-shadow:0 4px 8px rgba(0,0,0,.1)}.read-more-btn:hover{background-color:#005fa3;transform:translateY(-2px)}.read-more-btn:active{transform:translateY(0);background-color:#004d80}code,pre{font-family:'Courier New',monospace;font-size:.95rem;background:#f4f4f4;padding:1rem;border-left:4px solid #ccc;white-space:pre-wrap;word-wrap:break-word;overflow-x:auto;max-width:100%;display:block;box-sizing:border-box}@media (max-width:768px){.main-layout{flex-direction:column;gap:1rem}.right-panel,.sidebar{width:100%;height:auto;position:relative;border:none;padding:1rem;margin-bottom:1rem}.content-area{padding:1rem;width:100%}.nav-container{flex-direction:column;align-items:flex-start}.nav-links{flex-direction:column;gap:.5rem;margin-top:.5rem}.container{padding:1rem}h1{font-size:1.6rem}article h2{font-size:1.2rem}.next-button,.previous-button{width:100%;font-size:14px;padding:12px}code,pre{font-size:.85rem;word-wrap:break-word;white-space:pre-wrap;overflow-x:auto;max-width:100%;padding:.8rem}}