:root{--bg:#f9fafb;--primary:#2563eb;--text:#1f2937;--muted:#6b7280;--border:#e5e7eb}*{box-sizing:border-box}body{background-color:var(--bg);color:var(--text);margin:0;font-family:Inter,sans-serif}.header{border-bottom:1px solid var(--border);background-color:#fff;justify-content:space-between;align-items:center;padding:16px 40px;display:flex}.logo h1{margin:0;font-size:20px;font-weight:600}.main-nav a{color:var(--muted);margin:0 16px;padding:5px;font-size:14px;text-decoration:none;transition:color .2s}.main-nav a:hover{color:var(--primary)}.main-nav .active{border-bottom:2px solid var(--primary)}.login-btn{background-color:var(--primary);color:#fff;border-radius:6px;padding:8px 16px;font-size:14px;text-decoration:none;transition:background .2s}.login-btn:hover{background-color:#1e4fd6}.link{color:var(--muted);margin:0 16px;padding:5px;font-size:14px;text-decoration:none;transition:color .2s}#logout-btn{cursor:pointer}.content{text-align:center;flex-direction:column;align-items:center;max-width:700px;margin:50px auto;padding:0 20px;display:flex}.content h2{margin-bottom:16px;font-size:32px}.content p{color:var(--muted);font-size:16px;line-height:1.6}.content img{width:100%;height:auto;display:block}ul{text-align:left;color:var(--muted);font-size:16px;line-height:1.6}ul:is(ul) li{margin-bottom:10px}.login-form{width:100%;max-width:350px;margin-top:50px}label{margin:10px 0;font-weight:600;display:block}input,textarea{border:1px solid var(--border);border-radius:6px;width:100%;padding:10px 12px;font-family:inherit;font-size:14px;transition:border .2s,box-shadow .2s}input:focus,textarea:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 2px #2563eb1a}textarea{resize:vertical}button{background-color:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:10px 18px;font-size:14px;transition:background .2s,transform .1s}button:hover{background-color:#1e4fd6}button:active{transform:translateY(1px)}.login-btn{margin-top:10px}#error-message{margin-top:10px;font-weight:500}@media (width<=600px){header{flex-direction:column;row-gap:30px}}
