diff --git a/styles.css b/styles.css
index ca7600f..b0ff288 100644
--- a/styles.css
+++ b/styles.css
@@ -870,4 +870,262 @@
transform: none;
transition: none;
}
+ }
+
+ /* ---------- admin / management styles ---------- */
+ .admin-login-body {
+ min-height: 100vh;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1.5rem;
+ }
+
+ .login-card {
+ background: var(--surface);
+ border: 1px solid var(--rule);
+ border-radius: 0.25rem;
+ padding: 2.5rem 2rem;
+ width: 100%;
+ max-width: 25rem;
+ box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.4);
+ }
+
+ .login-header {
+ text-align: center;
+ margin-bottom: 2rem;
+ }
+
+ .login-header img {
+ width: 2rem;
+ height: 2rem;
+ margin: 0 auto 0.75rem;
+ }
+
+ .login-header h1 {
+ font-size: 1.5rem;
+ color: var(--gold-bright);
+ }
+
+ .login-header p {
+ font-family: 'IBM Plex Mono', monospace;
+ font-size: 0.72rem;
+ letter-spacing: 0.15em;
+ text-transform: uppercase;
+ color: var(--ink-muted);
+ margin-top: 0.35rem;
+ }
+
+ .form-group {
+ margin-bottom: 1.25rem;
+ }
+
+ .form-group.full-width {
+ grid-column: 1 / -1;
+ }
+
+ .form-group label {
+ display: block;
+ font-family: 'IBM Plex Mono', monospace;
+ font-size: 0.75rem;
+ letter-spacing: 0.08em;
+ text-transform: uppercase;
+ color: var(--gold);
+ margin-bottom: 0.45rem;
+ }
+
+ .form-control,
+ .form-input {
+ width: 100%;
+ background: var(--ground-2);
+ border: 1px solid var(--rule);
+ color: var(--ink);
+ font-family: 'Karla', sans-serif;
+ font-size: 0.95rem;
+ padding: 0.7rem 0.85rem;
+ border-radius: 0.125rem;
+ box-sizing: border-box;
+ outline: none;
+ transition: border-color .15s ease;
+ }
+
+ .form-control:focus,
+ .form-input:focus {
+ border-color: var(--gold-bright);
+ }
+
+ textarea.form-control {
+ resize: vertical;
+ min-height: 5.5rem;
+ line-height: 1.5;
+ }
+
+ .error-msg,
+ .alert-error {
+ background: rgba(180, 50, 40, 0.15);
+ border: 1px solid rgba(220, 80, 60, 0.4);
+ color: #ff9d9d;
+ padding: 0.85rem 1.1rem;
+ font-size: 0.88rem;
+ border-radius: 0.125rem;
+ margin-bottom: 1.25rem;
+ }
+
+ .alert-success {
+ background: rgba(51, 80, 63, 0.25);
+ border: 1px solid var(--green);
+ color: #bbf7d0;
+ padding: 0.9rem 1.25rem;
+ border-radius: 0.125rem;
+ margin-bottom: 1.5rem;
+ }
+
+ .login-btn {
+ width: 100%;
+ justify-content: center;
+ margin-top: 0.5rem;
+ cursor: pointer;
+ }
+
+ .back-link {
+ display: block;
+ text-align: center;
+ margin-top: 1.5rem;
+ font-family: 'IBM Plex Mono', monospace;
+ font-size: 0.75rem;
+ color: var(--ink-muted);
+ text-decoration: none;
+ }
+
+ .back-link:hover {
+ color: var(--gold-bright);
+ }
+
+ .admin-nav {
+ background: var(--ground-2);
+ border-bottom: 1px solid var(--rule);
+ padding: 0.85rem 0;
+ }
+
+ .admin-nav-inner {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+
+ .admin-brand {
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ text-decoration: none;
+ font-family: 'Fraunces', serif;
+ font-size: 1.15rem;
+ color: var(--ink);
+ }
+
+ .admin-user {
+ display: flex;
+ align-items: center;
+ gap: 1.25rem;
+ font-family: 'IBM Plex Mono', monospace;
+ font-size: 0.82rem;
+ color: var(--ink-muted);
+ }
+
+ .admin-user a {
+ color: var(--gold-bright);
+ text-decoration: none;
+ }
+
+ .admin-user a:hover {
+ text-decoration: underline;
+ }
+
+ .dashboard-layout {
+ padding-block: 2.5rem 4rem;
+ }
+
+ .dash-header {
+ margin-bottom: 2rem;
+ }
+
+ .dash-header h1 {
+ font-size: 2rem;
+ color: var(--ink);
+ }
+
+ .panel {
+ background: var(--surface);
+ border: 1px solid var(--rule);
+ border-radius: 0.25rem;
+ padding: 2rem;
+ margin-bottom: 2rem;
+ }
+
+ .panel h2 {
+ font-size: 1.35rem;
+ color: var(--gold-bright);
+ margin-bottom: 1.25rem;
+ display: flex;
+ align-items: center;
+ gap: 0.6rem;
+ }
+
+ .form-grid {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: 1.5rem;
+ }
+
+ @media (max-width: 47.5em) {
+ .form-grid {
+ grid-template-columns: 1fr;
+ }
+ }
+
+ .checkbox-group {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+ margin-top: 0.5rem;
+ }
+
+ .checkbox-label {
+ display: flex;
+ align-items: center;
+ gap: 0.6rem;
+ font-size: 0.92rem;
+ color: var(--ink);
+ cursor: pointer;
+ }
+
+ .checkbox-label input[type="checkbox"] {
+ width: 1.15rem;
+ height: 1.15rem;
+ accent-color: var(--gold);
+ cursor: pointer;
+ }
+
+ .status-badge {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.4rem;
+ font-family: 'IBM Plex Mono', monospace;
+ font-size: 0.72rem;
+ letter-spacing: 0.08em;
+ text-transform: uppercase;
+ padding: 0.25rem 0.6rem;
+ border-radius: 0.125rem;
+ }
+
+ .status-badge.active {
+ background: rgba(51, 80, 63, 0.4);
+ border: 1px solid var(--green);
+ color: #9fe2bf;
+ }
+
+ .status-badge.inactive {
+ background: rgba(138, 115, 74, 0.2);
+ border: 1px solid var(--rule);
+ color: var(--ink-muted);
}
\ No newline at end of file