:root {--ink:#273b2d;--sage:#49654d;--bg:#f7f8f3;--panel:#fff;--line:#dce4d8;--muted:#566555;--accent:#9d4e35;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--bg);line-height:1.45}
* {box-sizing:border-box}
[hidden] {display:none!important}
body {margin:0}
a {color:var(--sage);text-underline-offset:3px}
.top {display:flex;justify-content:space-between;align-items:center;gap:18px;padding:17px max(20px,calc((100vw - 1120px)/2));border-bottom:1px solid var(--line);background:white}
.top nav {display:flex;flex-wrap:wrap;gap:18px;font-size:14px}
.wordmark {font-size:20px;font-weight:700;text-decoration:none;white-space:nowrap}
.wordmark span {color:#688269}
.content {width:min(1120px,calc(100% - 40px));margin:32px auto 72px}
.content.privacy {max-width:750px}
h1 {font-size:clamp(36px,6vw,54px);line-height:1.12;margin:8px 0 15px}
h2 {font-size:23px;line-height:1.2;margin:0 0 12px}
h3 {margin:0 0 8px}
p {margin:0 0 14px}
.privacy h2 {margin-top:24px}
.eyebrow {font-size:12px;letter-spacing:.09em;text-transform:uppercase;font-weight:700;color:var(--sage)}
.muted,#identity {color:var(--muted)}
.tabs,.actions,.toolbar {display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tabs {margin:24px 0 20px}
button,input,textarea,select {font:inherit}
button {cursor:pointer;padding:9px 14px;border:1px solid #c9d5c5;border-radius:8px;background:#fff;color:var(--ink)}
button.primary,button.active {background:var(--sage);border-color:var(--sage);color:white}
button:disabled {opacity:.55;cursor:wait}
.panel {padding:22px;margin:0 0 20px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.notice,#notice {border-radius:8px;padding:11px 14px;background:#eef3ea;margin-bottom:16px}
.error,#notice.error {background:#fff0eb;color:#82361f}
.grid {display:grid;grid-template-columns:1fr 1fr;gap:14px}
label {display:grid;gap:6px;font-size:14px;font-weight:650}
label.check {display:flex;gap:8px;align-items:flex-start;font-weight:400}
label.check input {width:auto;margin-top:4px}
.wide {grid-column:1/-1}
label :is(input,textarea,select) {min-width:0;width:100%;padding:8px 10px;border:1px solid #c9d5c5;border-radius:7px;background:#fff;color:var(--ink)}
fieldset {border:1px solid var(--line);padding:12px;min-width:0;border-radius:8px}
fieldset label {margin:6px 0}
.toolbar {justify-content:space-between;margin-bottom:16px}
.table-wrap {overflow:auto}
table {border-collapse:collapse;width:100%;font-size:14px;white-space:nowrap}
th,td {text-align:left;padding:11px 12px;border-bottom:1px solid var(--line)}
th {background:#f0f4ee}
td .ref {padding:0;border:none;text-decoration:underline;color:var(--sage)}
.pager {margin-top:14px;justify-content:space-between}
dialog {width:min(760px,calc(100% - 24px));max-height:91vh;padding:24px;border:1px solid var(--line);border-radius:12px;background:white;color:var(--ink)}
dialog::backdrop {background:#21352a84}
.dialog-head {display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.dialog-head p {margin:0}
.dialog-head button {padding:2px 10px;font-size:22px}
.details {display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 18px}
.details dt {font-size:12px;color:var(--muted)}
.details dd {margin:0;font-weight:650;overflow-wrap:anywhere}
.excerpt {white-space:pre-wrap;overflow-wrap:anywhere;background:#f3f6f0;border-radius:8px;padding:12px}
.email-card {border-top:1px solid var(--line);padding-top:13px;margin-top:13px}
@media(max-width:620px){.top{align-items:flex-start;flex-direction:column}.content{margin-top:24px;width:calc(100% - 24px)}.panel{padding:15px}.grid{grid-template-columns:1fr}}
.tag {display:inline-block;margin-left:4px;padding:1px 8px;border-radius:999px;font-size:12px;font-weight:600;background:#eef2ea;color:var(--muted);border:1px solid var(--line)}
.email-card code, .details code {font-size:12px;overflow-wrap:anywhere}
details summary {cursor:pointer;margin:6px 0 10px;font-weight:600}
.tag-choices {display:flex;flex-wrap:wrap;gap:6px 18px}
form h3.wide {margin:18px 0 0;padding-top:12px;border-top:1px solid var(--line)}
.billing-card h3 {margin:0}
.state-paused, .state-grace {background:#fbe9e4;color:var(--accent);border-color:#efc9bd}
.state-active, .state-complimentary {background:#e6f0e3;color:var(--sage)}
ul.reasons {margin:6px 0 14px;padding-left:18px;color:var(--muted)}
#record h3 small {font-weight:400}
