* {margin: 0;padding: 0;box-sizing: border-box;}body, header, section, footer {transition: background 0.6s ease, color 0.6s ease;}body {font-family: 'Segoe UI', system-ui, sans-serif;min-height: 100vh;color: #3b2f2f;background: url('img/code-image.png') center/cover no-repeat, linear-gradient(135deg, #e8cda5, #c19a6b);background-attachment: fixed;}@supports (background-image: url("img/code-image.webp")) {body {background: url('img/code-image.webp') center/cover no-repeat, linear-gradient(135deg, #e8cda5, #c19a6b);}}header {background: rgba(255, 255, 255, 0.25);backdrop-filter: blur(12px);padding: 20px 30px;}.header-top {display: flex;justify-content: space-between;align-items: center;}.header-actions {display: flex;gap: 10px;}#menu-toggle, #theme-toggle {font-size: 1.4rem;background: none;border: none;cursor: pointer;}nav ul {list-style: none;display: flex;gap: 20px;}nav a {text-decoration: none;color: inherit;padding: 8px 14px;border-radius: 10px;position: relative;overflow: hidden;transition: color 0.3s ease;}nav a::before {content: "";position: absolute;left: 0;bottom: 0;width: 100%;height: 0%;background: rgba(255, 255, 255, 0.2);z-index: -1;transition: height 0.3s ease;}nav a:hover::before {height: 100%;}nav a:hover {color: #fff;}main {padding: 80px 20px;display: flex;justify-content: center;}section {background: rgba(255, 255, 255, 0.35);backdrop-filter: blur(14px);padding: 50px;border-radius: 24px;max-width: 620px;text-align: center;box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);}footer {text-align: center;padding: 20px;}body.dark {color: #e6dccf;background: url('img/code-image.png') center/cover no-repeat, linear-gradient(135deg, #0f2027, #203a43, #2c5364);}body.dark header, body.dark section {background: rgba(0, 0, 0, 0.35);}@supports (background-image: url("img/code-image.webp")) {body.dark {background: url('img/code-image.webp') center/cover no-repeat, linear-gradient(135deg, #0f2027, #203a43, #2c5364);}}.reveal {opacity: 0;transform: translateY(40px);transition: all 0.8s ease;}.reveal.active {opacity: 1;transform: translateY(0);}#menu-toggle {display: none;}@media (max-width: 768px) {#menu-toggle {display: block;}nav {display: none;margin-top: 20px;}nav.open {display: block;}nav ul {flex-direction: column;gap: 10px;}body {background-attachment: scroll;}}.switch {position: relative;display: inline-block;width: 50px;height: 26px;}.switch input {opacity: 0;width: 0;height: 0;}.slider {position: absolute;cursor: pointer;inset: 0;background-color: #ccc;transition: 0.4s;border-radius: 34px;}.slider::before {content: "";position: absolute;height: 20px;width: 20px;left: 3px;bottom: 3px;background-color: white;transition: 0.4s;border-radius: 50%;}input:checked + .slider {background-color: #4a90e2;}input:checked + .slider::before {transform: translateX(24px);}