:root{
    --bg:#f6f3ee; --surface:#ffffff; --surface-2:#eef0ea;
    --ink:#28241f; --ink-soft:#6d6559; --line:#e2ddd2;
    --pine:#173e39; --pine-soft:#e4ece9;
    --rose:#b5637a; --rose-soft:#f6e7ea;
    --bad:#a24a3f; --bad-soft:#f5e5e1;
    --good:#3f7a5c; --good-soft:#e3ede6;
    --warn:#a97634; --warn-soft:#f3e9d8;
}
*{box-sizing:border-box;}
body{
    margin:0; background:var(--bg); color:var(--ink);
    font-family:-apple-system,'Segoe UI',Roboto,sans-serif; line-height:1.5;
}
a{color:var(--pine);}
.topbar{
    display:flex; align-items:center; justify-content:space-between;
    background:var(--surface); border-bottom:1px solid var(--line);
    padding:14px 24px;
}
.topbar .brand{font-weight:700; font-size:1.05rem;}
.topbar nav a{margin-right:18px; color:var(--ink); text-decoration:none; font-size:.92rem;}
.topbar nav a.active{color:var(--pine); font-weight:600;}
.topbar .user{font-size:.85rem; color:var(--ink-soft);}
.wrap{max-width:1100px; margin:0 auto; padding:28px 24px 80px;}
h1{font-size:1.5rem; margin:0 0 20px;}
.card{
    background:var(--surface); border:1px solid var(--line); border-radius:10px;
    padding:20px 22px; margin-bottom:18px;
}
table{width:100%; border-collapse:collapse; font-size:.92rem;}
th{
    text-align:left; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em;
    color:var(--ink-soft); padding:0 10px 10px; border-bottom:1px solid var(--line);
}
td{padding:12px 10px; border-bottom:1px solid var(--line); vertical-align:middle;}
tr:last-child td{border-bottom:none;}
.btn{
    display:inline-block; background:var(--pine); color:#fff; border:none; border-radius:7px;
    padding:9px 16px; font-size:.9rem; cursor:pointer; text-decoration:none;
}
.btn.secondary{background:var(--surface-2); color:var(--ink);}
.btn.danger{background:var(--bad);}
.btn:hover{filter:brightness(1.08);}
input, select, textarea{
    width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:7px;
    font-size:.92rem; background:var(--bg); color:var(--ink); font-family:inherit;
}
label{display:block; font-size:.82rem; color:var(--ink-soft); margin-bottom:5px; margin-top:14px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.pill{display:inline-block; font-size:.72rem; padding:3px 10px; border-radius:20px; font-weight:600;}
.pill.planned{background:var(--warn-soft); color:var(--warn);}
.pill.confirmed{background:var(--pine-soft); color:var(--pine);}
.pill.completed{background:var(--good-soft); color:var(--good);}
.pill.cancelled, .pill.no_show{background:var(--bad-soft); color:var(--bad);}
.pill.sent, .pill.delivered, .pill.read{background:var(--good-soft); color:var(--good);}
.pill.failed{background:var(--bad-soft); color:var(--bad);}
.pill.queued{background:var(--surface-2); color:var(--ink-soft);}
.login-wrap{
    max-width:360px; margin:14vh auto; background:var(--surface); border:1px solid var(--line);
    border-radius:12px; padding:32px 28px;
}
.stat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:24px;}
.stat{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:16px 18px;}
.stat .n{font-size:1.4rem; font-weight:700;}
.stat .l{font-size:.8rem; color:var(--ink-soft);}
.alert{padding:12px 16px; border-radius:8px; margin-bottom:16px; font-size:.9rem;}
.alert.error{background:var(--bad-soft); color:var(--bad);}
.alert.success{background:var(--good-soft); color:var(--good);}
.actions{display:flex; gap:8px;}
.muted{color:var(--ink-soft); font-size:.85rem;}
@media (max-width:700px){
    .form-row{grid-template-columns:1fr;}
    .stat-grid{grid-template-columns:1fr 1fr;}
}

/* Logo */
.topbar .brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);}
.topbar .brand img{height:26px;width:26px;object-fit:contain;}
.login-logo{display:block;width:72px;height:72px;margin:0 auto 10px;object-fit:contain;}
.login-wrap h1,.login-wrap .quote,.login-wrap .muted{text-align:center;}
.login-wrap .quote{color:#b8863f;}
.topbar .user a{color:var(--ink-soft);text-decoration:none;}
.topbar .user a.active,.topbar .user a:hover{color:var(--pine);}
.actions form{display:inline;}