:root { color-scheme: light; --pine:#153c31; --muted:#637670; --line:#dce5de; --canvas:#f6f8f5; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:var(--canvas); color:#203431; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; }
button,input,select { font:inherit; }
button { cursor:pointer; }
a { color:var(--pine); }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px max(24px,calc((100vw - 980px)/2)); border-bottom:1px solid var(--line); background:#fbfcfa; }
.brand { color:var(--pine); font-family:Georgia,serif; font-size:23px; font-weight:bold; text-decoration:none; }
.brand span { color:var(--muted); font:10px "Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.back { font-size:13px; text-decoration:none; font-weight:600; }
main { max-width:980px; margin:0 auto; padding:48px 24px 80px; }
.eyebrow { margin:0 0 10px; color:#608072; font-size:10px; font-weight:700; letter-spacing:.17em; text-transform:uppercase; }
h1 { margin:0; color:var(--pine); font:normal clamp(34px,5vw,48px)/1.15 Georgia,serif; letter-spacing:-.035em; }
.intro { max-width:680px; margin:16px 0 32px; color:var(--muted); line-height:1.7; }
.card { margin:0 0 18px; padding:26px; border:1px solid var(--line); border-radius:19px; background:#fff; box-shadow:0 14px 34px rgba(21,60,49,.035); }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:14px; margin-bottom:20px; }
h2 { margin:0; color:var(--pine); font:normal 26px Georgia,serif; }
h2 span { color:#6d8576; font:14px "Helvetica Neue",Helvetica,Arial,sans-serif; }
label { display:block; margin:0 0 8px; font-size:12px; font-weight:700; color:var(--pine); }
.invite-controls { display:flex; gap:10px; }
input,select { width:100%; min-width:0; padding:12px 14px; border:1px solid #c9d8ce; border-radius:10px; background:#fff; color:#203431; }
button,.created-actions a { min-height:44px; padding:11px 17px; border:1px solid var(--pine); border-radius:10px; background:var(--pine); color:white; font-size:13px; font-weight:700; text-decoration:none; white-space:nowrap; }
button:hover,.created-actions a:hover { background:#245343; }
button:disabled { opacity:.55; cursor:wait; }
:focus-visible { outline:2px solid #7da68a; outline-offset:2px; }
.note { margin:12px 0 0; color:var(--muted); font-size:12px; line-height:1.55; }
.message { margin:16px 0 0; color:var(--pine); font-size:13px; }
.message.error { color:#9a3c35; }
.created { margin-top:20px; padding:18px; border:1px solid #c9d8ce; border-radius:12px; background:#f5f9f5; }
.created strong { color:var(--pine); }
.created p { margin:7px 0 13px; color:var(--muted); font-size:13px; }
.created-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.created-actions button { background:#fff; color:var(--pine); }
.list { display:grid; gap:0; }
.list-row { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:15px 0; border-top:1px solid var(--line); }
.list-row:first-child { border-top:0; }
.person { min-width:0; }
.person strong { display:block; overflow-wrap:anywhere; color:var(--pine); font-size:14px; }
.person small { display:block; margin-top:5px; color:var(--muted); font-size:12px; }
.badge { flex:none; padding:7px 10px; border-radius:999px; background:#edf5ee; color:var(--pine); font-size:11px; font-weight:700; }
.badge.expired { background:#f3eee8; color:#876a4a; }
.empty { margin:0; padding:12px 0; color:var(--muted); font-size:13px; }
@media(max-width:600px) { .topbar { padding:17px 20px; } .brand { font-size:20px; } .brand span { display:none; } main { padding:34px 17px 60px; } .card { padding:20px; } .invite-controls { flex-direction:column; } .invite-controls button { width:100%; } .list-row { align-items:flex-start; } }
[hidden] { display:none !important; }
.admin-tabs { display:flex; gap:8px; margin:0 0 24px; border-bottom:1px solid var(--line); }
.admin-tabs .tab { border:0; border-radius:10px 10px 0 0; background:transparent; color:var(--muted); }
.admin-tabs .tab.active { background:var(--pine); color:#fff; }
.period-controls { display:flex; align-items:flex-end; flex-wrap:wrap; gap:12px; }
.period-controls label { flex:1 1 155px; margin:0; }
.period-controls input { display:block; margin-top:7px; }
.period-controls .secondary { background:#fff; color:var(--pine); }
.metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:18px; }
.metrics.compact { margin:18px 0 0; }
#manual-cost-form { margin-top:18px; padding-top:18px; border-top:1px solid var(--line); }
.metric { min-width:0; padding:20px; border:1px solid var(--line); border-radius:15px; background:#fff; }
.metric span,.metric small { display:block; color:var(--muted); font-size:12px; line-height:1.45; }
.metric strong { display:block; margin:8px 0 4px; color:var(--pine); font:normal 30px Georgia,serif; overflow-wrap:anywhere; }
.activity-chart { display:flex; align-items:flex-end; min-height:190px; gap:5px; margin:24px 0 10px; padding:12px 0 0; border-bottom:1px solid var(--line); overflow-x:auto; }
.chart-group { display:flex; flex:1 0 12px; min-width:12px; flex-direction:column; align-items:center; height:185px; }
.chart-bars { display:flex; align-items:flex-end; justify-content:center; gap:2px; width:100%; height:158px; }
.chart-bar { display:block; width:45%; min-width:3px; border-radius:3px 3px 0 0; }
.chart-bar.users { background:#4f8069; }
.chart-bar.messages { background:#7d9dae; }
.chart-bar.costs { background:#c1a676; width:70%; }
.chart-group small { margin-top:6px; color:var(--muted); font-size:9px; writing-mode:vertical-rl; }
.print-report { display:none; }
@media(max-width:700px) { .metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } .metric { padding:15px; } .metric strong { font-size:25px; } .period-controls button { flex:1 1 150px; } }
@media(max-width:400px) { .metrics { grid-template-columns:1fr; } }
@media print {
  @page { size:A4; margin:18mm; }
  body { background:#fff; color:#203431; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .topbar, main { display:none !important; }
  .print-report { display:block; font-size:11px; line-height:1.5; }
  .print-report h1 { font-size:34px; }
  .print-report h2 { margin:24px 0 10px; font-size:20px; break-after:avoid; }
  .print-report p { margin:8px 0; }
  .print-report .report-period { color:var(--muted); }
  .print-report .metrics { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  .print-report .metric { padding:10px; break-inside:avoid; }
  .print-report .metric strong { font-size:22px; }
  .print-report .activity-chart { min-height:140px; gap:3px; overflow:visible; break-inside:avoid; }
  .print-report .chart-group { height:135px; }
  .print-report .chart-bars { height:110px; }
}

#cost-details { margin-top:18px; }
#cost-details summary { cursor:pointer; min-height:44px; display:flex; align-items:center; text-decoration:underline; }
#cost-daily { max-height:320px; overflow:auto; }
@media(max-width:600px) { [aria-labelledby="cost-title"] .section-heading { align-items:flex-start; flex-direction:column; } }

#accounts .list-row{flex-wrap:wrap}#accounts .person{flex:1 1 180px}#accounts .created{flex:1 0 100%;max-width:100%;box-sizing:border-box}#accounts .created input{margin-bottom:12px}#backup-check-result{line-height:1.6;overflow-wrap:anywhere}