html,body{height:100%;margin:0;padding:0}body{font-family:system-ui,sans-serif;background:#f4f4f4;display:flex;flex-direction:column;min-height:100vh}header{background:#06c;color:#fff;padding:1rem;text-align:center}header h1{margin:0}nav.nav{background:#eaeaea;display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;padding:1rem}nav.nav a{text-decoration:none;padding:.6rem 1.2rem;border-radius:6px;color:#06c;background:#fff;border:1px solid #ccc;transition:all .2s ease-in-out}nav.nav a:hover{background:#06c;color:#fff}nav.nav a.active{background:#06c;color:#fff;font-weight:bold}main{flex:1;padding:2rem}footer{background:#eaeaea;text-align:center;padding:1rem;font-size:.9rem;width:100%;margin-top:auto}footer a{color:#06c;text-decoration:none;margin:0 .5rem}footer a:hover{text-decoration:underline}.form-box{background:#fff;max-width:500px;width:90%;margin:4rem auto;padding:2rem;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.05)}label{display:block;margin-bottom:.5rem;font-weight:bold}input[type="email"],input[type="password"],input[type="text"],input[type="date"],input[type="number"],input[type="url"],select,textarea{width:100%;padding:.7rem;margin-bottom:1rem;border:1px solid #ccc;border-radius:6px;font-size:1rem;box-sizing:border-box}input[readonly],textarea[readonly]{background:#f0f0f0}textarea{resize:vertical}button,.form-box button{width:100%;padding:.8rem;background-color:#06c;color:#fff;border:none;border-radius:6px;font-size:1rem;cursor:pointer}button:hover{background-color:#004a99}a.button{display:inline-block;padding:.5rem 1rem;background-color:#06c;color:#fff;border-radius:6px;text-decoration:none;font-size:.85rem;transition:background .2s ease-in-out;margin-right:.4rem}a.button:hover{background-color:#004a99}.button-small{display:inline-block;padding:.3rem .6rem;font-size:.8rem;border-radius:4px;background-color:#06c;color:#fff;border:none;cursor:pointer;text-decoration:none}.button-small:hover{background-color:#004a99}.success{color:green;background:#e0ffe0;padding:1rem;margin-bottom:1rem;text-align:center;border-radius:6px}.error{color:#8b0000;background:#ffe0e0;padding:1rem;margin-bottom:1rem;text-align:center;border-radius:6px}.info{text-align:center;margin-top:1rem}.container{flex:1;display:flex;justify-content:center;align-items:center;padding:2rem;text-align:center}.buttons{display:flex;flex-direction:column;gap:1rem}.buttons a{display:inline-block;padding:.8rem 2rem;background:#06c;color:#fff;text-decoration:none;border-radius:6px;transition:background .3s}.buttons a:hover{background:#004999}main ul{list-style:none;padding:0;margin-top:2rem;text-align:center}main ul li{margin:1rem 0}main ul li a{color:#06c;font-size:1.1rem;text-decoration:none}main ul li a:hover{text-decoration:underline}table{width:100%;border-collapse:collapse;margin-top:1rem;background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.05)}th,td{padding:.75rem;text-align:left;border-bottom:1px solid #ddd}th{background-color:#f2f2f2;font-weight:bold}td:last-child{white-space:nowrap}@media (max-width:600px){nav.nav{flex-direction:column;align-items:center}.form-box{margin:2rem 1rem}table,thead,tbody,th,td,tr{display:block}th{display:none}td{position:relative;padding-left:50%;border-bottom:1px solid #eee}td::before{position:absolute;top:.75rem;left:1rem;width:45%;white-space:nowrap;font-weight:bold;color:#666;content:attr(data-label)}}