*{margin:0;padding:0;box-sizing:border-box;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}body{background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:#333;scroll-behavior:smooth}button,input,select,textarea{font:inherit}.top-header{background:linear-gradient(90deg,#2d3561,#667eea);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:20px 30px;box-shadow:0 4px 15px #0003}.top-header h2{margin:0 auto;font-size:28px;font-weight:700;letter-spacing:1px;text-align:center}.top-nav ul{list-style:none;display:flex;gap:20px;margin:0;padding:0}.top-nav .nav-link{color:#fff;text-decoration:none;font-weight:500;background:transparent;border:none;cursor:pointer;transition:color .2s ease}.top-nav .nav-link:hover{color:gold}.section-card,.content-box{background:#fffffff5;border:1px solid rgba(102,126,234,.18);border-radius:18px;padding:28px 30px;box-shadow:0 16px 40px #2d356114}.section-card h2,.content-box h2{margin-top:0;margin-bottom:18px;color:#1f2b6c;font-size:30px;letter-spacing:.6px}.section-card h3{color:#3f4bc7;margin-bottom:10px}.section-card p,.section-card li,.content-box p,.content-box li{color:#4f547f;line-height:1.8;margin-bottom:12px}.section-card strong,.content-box strong{color:#3f4bc7}.section-card a,.content-box a{color:#4f4ce3;text-decoration:none}.section-card a:hover,.content-box a:hover{text-decoration:underline}.section-list{list-style:disc inside;padding-left:0;margin-top:12px}.section-list li{margin-bottom:10px}.layout{display:flex;min-height:calc(100vh - 70px);gap:0}.sidebar{position:fixed;top:70px;left:0;bottom:0;width:320px;max-width:100%;background:linear-gradient(180deg,#0c143cfa,#202953fa);color:#fff;padding:30px;box-shadow:4px 0 40px #00000040;overflow-y:auto;transform:translate(-100%);transition:transform .3s ease;z-index:1001}.sidebar.open{transform:translate(0)}.sidebar-panel{display:flex;flex-direction:column;gap:18px}.sidebar h3{margin:0;font-size:20px;text-transform:uppercase;letter-spacing:1.8px;color:#f6f9ff}.sidebar-close{position:absolute;top:22px;right:22px;background:#ffffff1f;color:#fff;border:none;width:36px;height:36px;border-radius:50%;font-size:20px;cursor:pointer;transition:transform .2s ease,background .2s ease}.sidebar-close:hover{background:#ffffff38;transform:scale(1.05)}.sidebar-toggle{background:#ffffff29;color:#fff;border:1px solid rgba(255,255,255,.24);border-radius:999px;padding:10px 16px;font-size:14px;font-weight:700;cursor:pointer;transition:background .2s ease,transform .2s ease}.sidebar-toggle:hover{background:#ffffff47;transform:translateY(-1px)}.sidebar-overlay{position:fixed;top:70px;right:0;bottom:0;left:0;background:#00000073;opacity:0;visibility:hidden;transition:opacity .25s ease;z-index:1000}.sidebar-overlay.active{opacity:1;visibility:visible}.main-content{display:flex;justify-content:center;padding:30px;margin:auto;width:100%}.content-box{width:100%;max-width:980px;margin:0 auto;padding:80px;background:linear-gradient(135deg,#fffffff5,#4545dd38);border:1px solid rgba(120,130,242,.18);border-radius:12px;box-shadow:0 8px 30px #0000001a}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:12px 18px;border-radius:999px;border:1px solid transparent;font-weight:700;font-size:.95rem;letter-spacing:.02em;cursor:pointer;transition:background .2s ease,transform .2s ease,box-shadow .2s ease,border-color .2s ease;text-decoration:none}.btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px #26468b1f}.btn-primary{background:linear-gradient(135deg,#71a1ff,#4a60d0);color:#fff;border-color:#6f8bff59}.btn-primary:hover{background:linear-gradient(135deg,#5d88ff,#3d4fc0)}.btn-dark{background:#2d3561;color:#fff;border-color:#ffffff24}.btn-dark:hover{background:#3c4a85}.btn-success{background:#28a745;color:#fff;border-color:#48b46159}.btn-success:hover{background:#22863a}.btn-secondary{background:#6c757d;color:#fff;border-color:#ffffff2e}.btn-secondary:hover{background:#5a6268}.btn-danger{background:#dc3545;color:#fff;border-color:#dc354559}.btn-danger:hover{background:#c82333}.card-list{margin-top:15px;list-style:none;padding:0}.form-group{margin-bottom:15px}.form-row{display:flex;flex-direction:column;gap:8px}.form-label{font-weight:700;color:#2d3561}.form-input,.form-select,.form-textarea{padding:10px 12px;border:1px solid #ccc;border-radius:8px;width:100%;box-sizing:border-box;font-size:14px}.form-input.small,.form-select.small{max-width:260px}.panel-card{margin-top:20px;padding:20px;background:#f9f9f9;border-radius:16px}.result-box{margin-top:20px;padding:16px;background:#e7f3ff;border-radius:12px}.result-box h3{margin-top:0}.inline-actions{display:flex;gap:10px;flex-wrap:wrap}.card-list-item,.inline-card{padding:10px;background:#f0f0f0;border-radius:12px;margin-bottom:10px}.card-list-item.alt{background:#fff3cd}.text-muted{font-size:.95rem;color:#4f547f}.exercise-menu{list-style:none;margin:0;padding:0}.exercise-menu>li{margin-bottom:14px}.exercise-link,.activity-item{display:block;width:100%;text-align:left;border:none;background:#ffffff14;color:#f0f4ff;padding:12px 14px;border-radius:8px;cursor:pointer;font-size:15px;transition:background .2s ease,transform .2s ease}.exercise-link:hover,.activity-item:hover{background:#ffffff29;transform:translateY(-1px)}.exercise-link.active{background:#ffffff38;box-shadow:0 0 0 1px #ffffff2e}.activity-sublist{list-style:none;padding-left:10px;margin:8px 0 0;display:none}.activity-sublist.show{display:block}.activity-item{background:#ffffff0d;margin-bottom:8px}.activity-item.selected{background:#ffffff24}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.content-box h1{color:#1c2e94;margin-bottom:15px;font-size:32px}.content-box h2{color:#5a4be7;margin-bottom:15px;font-size:28px}.content-box p{color:#555;line-height:1.8;margin-bottom:15px;font-size:16px}.exercise-panel{margin-top:16px}.exercise-output{margin-top:20px;padding:15px;background:#f8f9ff;border-left:4px solid #667eea;border-radius:4px;font-size:14px;color:#666}.activity-inline-iframe{margin-top:20px;border:2px solid #46589c!important;border-radius:6px!important}.footer{background:linear-gradient(90deg,#2d3561,#667eea);color:#fff;text-align:center;padding:20px;font-size:14px;box-shadow:0 -4px 15px #0000001a}.back-to-top{position:fixed;bottom:20px;right:20px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:50%;width:50px;height:50px;font-size:18px;cursor:pointer;box-shadow:0 4px 15px #0000004d;transition:all .3s ease;opacity:0;visibility:hidden;z-index:1000}.back-to-top.show{opacity:1;visibility:visible}.back-to-top:hover{transform:translateY(-3px);box-shadow:0 6px 20px #0006}.loader{text-align:center;padding:50px}.spinner{border:4px solid #f3f3f3;border-top:4px solid #3061c3;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto 20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.layout{flex-direction:column}.sidebar{width:100%;padding:20px;border-bottom:2px solid rgba(102,126,234,.3)}.main-content{flex:1;padding:20px}.content-box{padding:20px}.top-header{padding:15px 20px}.top-header h2{font-size:22px}.content-box h1{font-size:24px}.content-box h2{font-size:20px}.dropdown-menu{font-size:14px;padding:10px 12px}.sidebar h3{font-size:16px}}@media (max-width: 480px){.top-header{padding:12px 15px}.top-header h2{font-size:18px;letter-spacing:0}.sidebar{padding:15px}.sidebar h3{font-size:16px}.main-content{padding:15px}.content-box{padding:15px;border-radius:8px}.content-box h1{font-size:20px}.content-box h2{font-size:18px}.content-box p{font-size:15px}.dropdown-menu{font-size:13px}.dropdown-container label{font-size:12px}}