.history-page{box-sizing:border-box;background:#f0f4f8;min-height:100vh;padding:24px;font-family:system-ui,sans-serif}.history-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.history-title{align-items:baseline;gap:12px;display:flex}.history-title h2{color:#0f3460;margin:0;font-size:1.4rem}.history-meta{color:#888;font-size:.8rem}.logout-btn{color:#fff;cursor:pointer;background:#0f3460;border:none;border-radius:8px;padding:8px 20px;font-size:.88rem;font-weight:600;transition:background .2s}.logout-btn:hover{background:#16213e}.history-table-wrap{background:#fff;border-radius:14px;overflow-x:auto;box-shadow:0 2px 16px #00000012}.history-table{border-collapse:collapse;width:100%;font-size:.88rem}.history-table thead{color:#fff;background:#0f3460}.history-table thead th{text-align:left;white-space:nowrap;letter-spacing:.03em;padding:12px 14px;font-weight:600}.history-table thead th:first-child{border-radius:14px 0 0}.history-table thead th:last-child{border-radius:0 14px 0 0}.history-table tbody tr{border-bottom:1px solid #f0f0f0;transition:background .15s}.history-table tbody tr:last-child{border-bottom:none}.history-table tbody tr:hover{background:#f7f9fc}.history-table tbody td{color:#333;vertical-align:middle;padding:12px 14px}.history-table code{color:#0f3460;background:#f0f4f8;border-radius:4px;padding:2px 6px;font-family:Courier New,monospace;font-size:.82rem}.history-table .col-id{color:#aaa;width:40px}.history-table .col-user{color:#0f3460;font-weight:600}.history-table .col-date{white-space:nowrap;color:#555}.history-table .col-screen,.history-table .col-ip{white-space:nowrap}.history-table .empty{text-align:center;color:#aaa;padding:40px}.tag{white-space:nowrap;border-radius:6px;padding:3px 8px;font-size:.78rem;font-weight:600;display:inline-block}.tag-browser{color:#1a73e8;background:#e8f0fe}.tag-device{color:#2e7d32;background:#e8f5e9}.tag-device.tag-mobile{color:#e65100;background:#fff3e0}.tag-device.tag-tablet{color:#6a1b9a;background:#f3e5f5}.history-pagination{flex-wrap:wrap;justify-content:center;align-items:center;gap:4px;margin-top:20px;display:flex}.page-btn{color:#0f3460;cursor:pointer;background:#fff;border:1.5px solid #dde3ed;border-radius:8px;min-width:36px;height:36px;padding:0 10px;font-size:.88rem;font-weight:600;transition:background .15s,border-color .15s,color .15s}.page-btn:hover:not(:disabled):not(.active){background:#e8f0fe;border-color:#0f3460}.page-btn.active{color:#fff;cursor:default;background:#0f3460;border-color:#0f3460}.page-btn:disabled{opacity:.35;cursor:not-allowed}.page-btn.page-prev,.page-btn.page-next{font-size:1rem}.page-ellipsis{color:#aaa;justify-content:center;align-items:center;width:36px;height:36px;font-size:.9rem;display:inline-flex}.history-loading,.history-error{color:#888;justify-content:center;align-items:center;min-height:200px;font-size:1rem;display:flex}.history-error{color:#e74c3c}.empty.loading{color:#aaa;font-style:italic}.app-login{max-width:480px;margin:0 auto;padding:16px}.app-login .login-logo{justify-content:center;display:flex}.app-login .login-logo img{width:6em;height:6em}.app-login .login-container{background:#fff;border-radius:16px;margin-top:60px;padding:40px 32px;box-shadow:0 4px 24px #00000014}.app-login .login-container h1{text-align:center;color:#0f3460;margin-bottom:28px;font-size:1.4rem}.app-login .form-group{margin-bottom:16px}.app-login .form-group label{color:#555;text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;font-size:.8rem;font-weight:600;display:block}.app-login .form-group input{border:1.5px solid #ddd;border-radius:10px;outline:none;width:100%;padding:12px 14px;font-size:1rem;transition:border-color .2s}.app-login .form-group input:focus{border-color:#0f3460}.app-login button{color:#fff;cursor:pointer;background:#0f3460;border:none;border-radius:10px;width:100%;margin-top:8px;padding:13px;font-size:1rem;font-weight:600;transition:background .2s,opacity .2s}.app-login button:hover{background:#16213e}.app-login button:disabled{opacity:.6;cursor:not-allowed}.app-login .error-msg{color:#e74c3c;text-align:center;min-height:20px;margin-top:12px;font-size:.88rem}