@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Newsreader:opsz,wght@6..72,500;6..72,600&display=swap');

:root { font-family: 'DM Sans', Arial, sans-serif; color: #18251f; background: #fbfcfa; --ink:#18251f; --muted:#69746e; --line:#e5e9e5; --green:#1e6c49; --green-soft:#e7f2ea; --orange:#b74b29; --paper:#fbfcfa; }
* { box-sizing: border-box; }
body { min-width: 320px; margin: 0; background: radial-gradient(circle at 100% 0, #eef6e7, transparent 33%), var(--paper); }
button, input, select { font: inherit; } button { cursor:pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible { outline:3px solid rgba(30,108,73,.3); outline-offset:2px; }
[hidden] { display:none !important; }.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.login-view { display:grid; min-height:100vh; place-items:center; padding:24px; }.login-card { width:min(430px,100%); padding:38px; border:1px solid var(--line); background:#fff; border-radius:20px; box-shadow:0 18px 60px rgba(24,59,39,.12); }.brand-mark { display:grid; flex:0 0 auto; place-items:center; width:42px; height:42px; color:#16372a; background:#d8edb5; border-radius:13px; font-family:Newsreader,Georgia,serif; font-size:28px; font-weight:600; }.login-card .brand-mark { width:48px; height:48px; margin-bottom:22px; }.eyebrow { margin:0; color:var(--green); font-size:10px; font-weight:700; letter-spacing:.12em; line-height:1.3; text-transform:uppercase; }.login-card h1, .heading h1, .registry-heading h2 { font-family:Newsreader,Georgia,serif; font-weight:600; letter-spacing:-.045em; }.login-card h1 { margin:6px 0 8px; font-size:38px; line-height:1; }.login-card > p { margin:0 0 26px; color:var(--muted); font-size:13px; line-height:1.55; }.login-card form { display:grid; gap:15px; }.login-card label { display:grid; gap:6px; color:#40594a; font-size:12px; font-weight:700; }.login-card input, .filters input, .filters select { width:100%; border:1px solid #dbe3dd; padding:11px 12px; color:var(--ink); background:#fff; border-radius:9px; outline:0; }.login-card input:focus, .filters input:focus, .filters select:focus { border-color:var(--green); box-shadow:0 0 0 3px rgba(30,108,73,.1); }.form-message { min-height:18px; margin:0; color:var(--orange); font-size:12px; }
.app { min-height:100vh; }.topbar { display:flex; justify-content:space-between; gap:18px; align-items:center; min-height:74px; border-bottom:1px solid var(--line); padding:0 42px; background:rgba(251,252,250,.9); backdrop-filter:blur(12px); }.brand { display:flex; gap:10px; align-items:center; color:var(--ink); text-decoration:none; }.brand strong, .brand small { display:block; }.brand strong { font-size:14px; }.brand small { margin-top:2px; color:var(--muted); font-size:11px; }.topbar-actions { display:flex; gap:9px; align-items:center; }.operator-email { max-width:240px; overflow:hidden; color:var(--muted); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.button { display:inline-flex; justify-content:center; align-items:center; min-height:38px; border:1px solid transparent; padding:8px 13px; border-radius:9px; font-size:12px; font-weight:700; line-height:1.1; transition:transform .15s ease, box-shadow .15s ease, background .15s ease; }.button:hover { transform:translateY(-1px); box-shadow:0 5px 12px rgba(28,67,49,.11); }.button.primary { color:#fff; background:var(--green); }.button.secondary { border-color:#d8dfd9; color:#31503e; background:#fff; }.workspace { width:min(1540px,100%); margin:0 auto; padding:42px; }.heading { display:flex; justify-content:space-between; gap:25px; align-items:flex-end; margin-bottom:28px; }.heading h1 { margin:3px 0 8px; font-size:clamp(37px,4vw,52px); line-height:.98; }.heading p:not(.eyebrow) { margin:0; color:var(--muted); font-size:13px; }.updated { margin:0; color:var(--muted); font-size:11px; }.metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:16px; }.metrics article { padding:21px 22px; border:1px solid var(--line); background:#fff; border-radius:16px; box-shadow:0 12px 30px rgba(23,47,36,.055); }.metrics span { color:var(--muted); font-size:11px; }.metrics strong { display:block; margin-top:11px; font-family:Newsreader,Georgia,serif; font-size:39px; font-weight:600; letter-spacing:-.05em; }.surface-card { border:1px solid var(--line); background:#fff; border-radius:16px; box-shadow:0 12px 30px rgba(23,47,36,.055); }.registry { padding:25px; }.registry-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-end; }.registry-heading h2 { margin:4px 0 0; font-size:29px; }.filters { display:flex; gap:8px; }.filters input { width:220px; padding:9px 10px; font-size:12px; }.filters select { width:150px; padding:9px 10px; font-size:12px; }.registry-message { min-height:18px; margin:14px 0 0; color:var(--muted); font-size:12px; }.table-wrap { margin-top:10px; overflow-x:auto; }table { width:100%; min-width:1140px; border-collapse:collapse; }th { padding:12px 10px; color:#69746e; border-bottom:1px solid var(--line); font-size:10px; letter-spacing:.07em; text-align:left; text-transform:uppercase; }td { padding:15px 10px; border-bottom:1px solid #edf0ed; vertical-align:top; font-size:12px; }.site-name { display:block; color:var(--ink); font-size:13px; font-weight:700; }.site-url { display:inline-block; max-width:260px; margin-top:4px; overflow:hidden; color:var(--green); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:10px; text-decoration:none; text-overflow:ellipsis; white-space:nowrap; }.site-meta { display:block; margin-top:4px; color:var(--muted); font-size:10px; }.status { display:inline-flex; align-items:center; min-height:24px; padding:4px 8px; border-radius:99px; font-size:10px; font-weight:700; }.status.active { color:#17623e; background:#e7f4eb; }.status.paused { color:#80561c; background:#fff2d7; }.status.expired { color:#ad4428; background:#fff0e9; }.status.archived { color:#66726b; background:#eef1ee; }.date-input { width:142px; border:1px solid #dbe3dd; padding:6px 7px; color:var(--ink); background:#fff; border-radius:7px; font-size:11px; }.date-note { display:block; margin-top:5px; color:var(--muted); font-size:10px; }.admin-credentials { display:grid; gap:7px; min-width:170px; color:var(--muted); font-size:10px; }.admin-credentials span { display:flex; gap:5px; align-items:center; white-space:nowrap; }.credential-copy { overflow:hidden; border:0; padding:0; color:var(--green); background:transparent; font:inherit; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:10px; font-weight:700; text-align:left; text-decoration:underline; text-overflow:ellipsis; white-space:nowrap; }.credential-copy:hover { color:#173f2a; }.row-actions { display:flex; flex-wrap:wrap; gap:6px; min-width:190px; }.row-actions .button { min-height:32px; padding:6px 8px; font-size:10px; }.row-actions .danger { border-color:#efc7c3; color:#b33127; background:#fffafa; }.empty { padding:34px 10px; color:var(--muted); text-align:center; }
@media (max-width:780px) { .topbar { padding:12px 16px; align-items:flex-start; flex-direction:column; }.topbar-actions { width:100%; }.operator-email { margin-right:auto; }.workspace { padding:26px 16px; }.heading { display:grid; }.metrics { grid-template-columns:1fr; }.registry { padding:19px; }.registry-heading { display:grid; }.filters { display:grid; grid-template-columns:1fr 1fr; }.filters input { grid-column:1 / -1; width:100%; }.filters select { width:100%; } }
.ops-tabs { display:flex; gap:8px; margin-bottom:26px; padding:5px; width:max-content; max-width:100%; border:1px solid var(--line); border-radius:12px; background:#fff; }.ops-tabs button { border:0; border-radius:8px; padding:9px 13px; color:#5b6c61; background:transparent; font:700 12px/1.1 Inter,Arial,sans-serif; cursor:pointer; }.ops-tabs button.is-active { color:#fff; background:var(--green); }.ops-tabs span { display:inline-grid; min-width:17px; place-items:center; margin-left:4px; padding:1px 4px; border-radius:99px; color:inherit; background:rgba(255,255,255,.18); font-size:10px; }.operator-chats .heading { margin-bottom:8px; }.operator-chat-layout { display:grid; grid-template-columns:minmax(265px,.8fr) minmax(0,1.7fr); gap:16px; align-items:start; }.operator-chat-list, .operator-chat-detail { padding:18px; }.operator-chat-list__heading, .operator-chat-detail__heading, .operator-chat-detail__actions { display:flex; gap:10px; align-items:center; justify-content:space-between; }.operator-chat-list__heading { margin-bottom:10px; }.operator-chat-list__heading strong { font-size:15px; }.operator-chat-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:5px 10px; width:100%; border:0; border-top:1px solid #edf0ed; padding:13px 5px; color:var(--ink); background:transparent; text-align:left; cursor:pointer; }.operator-chat-row:first-child { border-top:0; }.operator-chat-row:hover, .operator-chat-row.is-active { background:#f1f7f1; }.operator-chat-row > span { min-width:0; }.operator-chat-row strong, .operator-chat-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.operator-chat-row strong { font-size:12px; }.operator-chat-row small, .operator-chat-row time, .operator-chat-row em { color:var(--muted); font-size:10px; font-style:normal; }.operator-chat-row time { white-space:nowrap; }.operator-chat-row em { grid-column:1 / -1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.subscription-pill { display:inline-flex; align-items:center; width:max-content; min-height:21px; padding:3px 7px; border-radius:99px; font-size:9px; font-style:normal; font-weight:700; }.subscription-pill.is-paid { color:#17623e; background:#e7f4eb; }.subscription-pill.is-unpaid { color:#80561c; background:#fff2d7; }.operator-chat-placeholder { margin:20px 0; color:var(--muted); font-size:12px; line-height:1.5; }.operator-chat-detail__heading { align-items:flex-start; padding-bottom:15px; border-bottom:1px solid var(--line); }.operator-chat-detail__heading h2 { margin:4px 0; font-family:Newsreader,Georgia,serif; font-size:28px; line-height:1; }.operator-chat-detail__heading p { margin:0; color:var(--muted); font-size:11px; }.operator-chat-detail__actions { flex-wrap:wrap; justify-content:flex-end; }.operator-chat-detail__actions .button { min-height:32px; padding:6px 8px; font-size:10px; }.operator-chat-detail__actions .danger { border-color:#efc7c3; color:#b33127; background:#fffafa; }.operator-chat-messages { display:grid; gap:10px; max-height:430px; min-height:220px; overflow:auto; padding:16px 2px; }.operator-message { width:min(83%,560px); padding:11px 13px; border:1px solid var(--line); border-radius:13px; background:#f7f8f6; }.operator-message--operator { justify-self:end; border-color:#d6e7da; background:#eaf4ec; }.operator-message small { color:var(--muted); font-size:10px; font-weight:700; }.operator-message p { margin:5px 0 0; font-size:12px; line-height:1.5; }.operator-chat-form { display:grid; gap:7px; padding-top:14px; border-top:1px solid var(--line); }.operator-chat-form label { color:#40594a; font-size:11px; font-weight:700; }.operator-chat-form textarea { width:100%; resize:vertical; border:1px solid #dbe3dd; border-radius:9px; padding:10px; color:var(--ink); font:inherit; font-size:12px; outline:0; }.operator-chat-form textarea:focus { border-color:var(--green); box-shadow:0 0 0 3px rgba(30,108,73,.1); }
@media (max-width:780px) { .ops-tabs { width:100%; }.ops-tabs button { flex:1; }.operator-chat-layout { grid-template-columns:1fr; }.operator-chat-list, .operator-chat-detail { padding:15px; }.operator-chat-detail__heading { display:grid; }.operator-chat-detail__actions { justify-content:flex-start; }.operator-chat-messages { max-height:50dvh; min-height:180px; }.operator-message { width:92%; } }
.subscription-pill.is-lead { color:#22516e; background:#e7f2fa; }

.operator-chat-file-controls { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:14px 0; }
.operator-chat-file-button { display:inline-flex; align-items:center; gap:8px; min-height:42px; padding:9px 14px; color:var(--accent-dark,#31503e); background:#f3f8f3; border:1px solid #c7d8c8; border-radius:10px; cursor:pointer; font:inherit; font-weight:700; }
.operator-chat-file-button:hover { background:#e8f2e8; }
.operator-chat-file-hint, .operator-chat-file-list { color:var(--muted); font-size:.88rem; }
.operator-chat-file-list { flex-basis:100%; }
.operator-chat-attachments { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.operator-chat-attachment { display:inline-flex; align-items:center; gap:9px; max-width:100%; padding:9px 11px; color:var(--ink); background:#fff; border:1px solid #d8e1d8; border-radius:10px; font-weight:700; text-decoration:none; }
.operator-chat-attachment:hover { border-color:var(--green); }
.operator-chat-attachment img { width:76px; height:58px; object-fit:cover; border-radius:7px; }
.operator-chat-attachment-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

#sites-registry-table { min-width:1420px; }
.selection-column { width:42px; text-align:center; }
.row-number-column { width:46px; color:#7b857f; text-align:center; font-variant-numeric:tabular-nums; }
.site-checkbox { width:17px; height:17px; margin:0; accent-color:var(--green); cursor:pointer; }
.site-checkbox:disabled { cursor:default; opacity:.55; }
.sort-button { display:inline-flex; align-items:center; gap:6px; appearance:none; border:0; padding:0; color:inherit; background:none; font:inherit; letter-spacing:inherit; text-transform:inherit; cursor:pointer; }
.sort-button:hover, .sort-button:focus-visible { color:var(--green); }
.sort-button:focus-visible { outline:2px solid rgba(30,108,73,.35); outline-offset:4px; border-radius:4px; }
.sort-indicator { font-size:13px; line-height:1; opacity:.55; }
th[aria-sort="ascending"] .sort-indicator, th[aria-sort="descending"] .sort-indicator { opacity:1; color:var(--green); }
#sites-table tr.is-selected td { background:#f3f8f3; }
#sites-table tr.is-selected td:first-child { box-shadow:inset 3px 0 0 var(--green); }

.site-detail-link { display:block; margin:8px 0 0; border:0; padding:0; color:var(--green); background:none; font-size:11px; font-weight:700; text-align:left; text-decoration:underline; }
.featured-site-shortcut { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; margin:0 0 16px; }
.featured-site-shortcut .button { border-color:#a9d0b3; color:#185a3b; background:#f3faf4; }
.featured-site-shortcut .button:disabled { opacity:.55; cursor:not-allowed; }
.site-detail-link:hover { color:#12452d; }
.site-detail { margin-bottom:18px; padding:25px; scroll-margin-top:18px; }
.site-detail-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; }
.site-detail-heading h2 { margin:4px 0 5px; font-family:Newsreader,Georgia,serif; font-size:32px; line-height:1.1; }
.site-detail-heading a { color:var(--green); font-size:12px; text-decoration:none; }
.site-detail-heading .status { margin-left:12px; }
.site-detail-actions { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 22px; }
.site-detail-actions .danger { border-color:#e6b5ab; color:#aa352c; background:#fff7f5; }
.site-detail-period { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:15px 0; border-top:1px solid var(--line); }
.site-detail-period strong { font-size:15px; }
.site-detail-period > div { display:flex; flex-wrap:wrap; gap:6px; }
.site-detail-period .is-current { border-color:var(--green); color:var(--green); background:var(--green-soft); }
.site-detail-date-range { display:flex; flex-wrap:wrap; align-items:flex-end; gap:8px; margin:0 0 14px; }
.site-detail-date-range label { display:grid; gap:5px; color:var(--muted); font-size:11px; font-weight:700; }
.site-detail-date-range input { min-height:38px; border:1px solid #d8dfd9; border-radius:9px; padding:7px 10px; color:var(--ink); background:#fff; }
.site-detail-date-range .is-current { border-color:var(--green); color:var(--green); background:var(--green-soft); }
.site-detail-error { margin:0 0 12px; color:var(--orange); font-size:12px; }
.site-detail-error:empty { display:none; }
.site-detail-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:0 0 23px; }
.site-detail-metrics article { min-width:0; border:1px solid var(--line); border-radius:12px; padding:15px; background:#f8faf8; }
.site-detail-metrics span,.site-detail-metrics small { display:block; color:var(--muted); font-size:11px; }
.site-detail-metrics strong { display:block; margin:5px 0 2px; font-family:Newsreader,Georgia,serif; font-size:36px; }
.site-detail-columns { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(300px,.8fr); gap:26px; }
.site-detail-columns h3 { margin:0 0 12px; font-size:15px; }
.site-chart-scroll { overflow-x:auto; }
.site-chart { display:flex; align-items:stretch; gap:3px; min-width:max(100%,520px); height:230px; padding:8px 4px 0; border-bottom:1px solid var(--line); }
.site-chart-day { display:flex; flex:1 0 8px; min-width:8px; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; }
.site-chart-count { min-height:12px; color:var(--green); font-size:9px; font-weight:700; }
.site-chart-bar { width:100%; max-width:26px; min-height:2px; border-radius:3px 3px 0 0; background:linear-gradient(#78b890,#216e4b); }
.site-chart-day:last-child .site-chart-bar { background:linear-gradient(#aad6b5,#206e49); }
.site-chart-date { overflow:hidden; width:100%; min-height:19px; color:var(--muted); font-size:8px; text-align:center; white-space:nowrap; }
.site-chart-day:not(:first-child):not(:last-child):not(:nth-child(5n)) .site-chart-date { visibility:hidden; }
.site-countries { min-width:0; width:100%; }
.site-countries th,.site-countries td { padding:9px 6px; font-size:11px; }
.site-countries td { text-align:right; font-variant-numeric:tabular-nums; }
.site-countries th small { display:block; margin-top:2px; color:var(--muted); font-size:9px; }
.site-detail-note { margin:10px 0 0; color:var(--muted); font-size:11px; line-height:1.5; }
@media (max-width:800px) { .site-detail { padding:18px; } .site-detail-columns { grid-template-columns:1fr; } }
@media (max-width:580px) { .site-detail-heading { flex-direction:column; } .site-detail-heading h2 { font-size:27px; } .site-detail-period { align-items:flex-start; flex-direction:column; } .site-detail-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } .site-detail-metrics article:last-child { grid-column:1 / -1; } }
