@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Public+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --paper:#F1F0EA; --paper-raised:#FBFAF6;
  --ink:#1E2A28; --ink-soft:#5B6360;
  --line:#D8D5C9; --line-strong:#C3C0B2;
  --accent:#2B6E62; --accent-soft:#DCEAE6; --accent-ink:#173D36;

  --c-maint:#B5622A; --c-maint-soft:#F3E3D6;
  --c-lead:#2B6E62; --c-lead-soft:#DCEAE6;
  --c-tenant:#5B6EA6; --c-tenant-soft:#E1E5F3;
  --c-bill:#9A7A1F; --c-bill-soft:#F1E9D2;
  --c-general:#63696C; --c-general-soft:#E7E7E4;
  --c-vendor:#6C5E92; --c-vendor-soft:#E5E1EF;
  --c-owner:#2E4A7A; --c-owner-soft:#DEE5F1;
  --c-na:#8B9089; --c-na-soft:#E9E9E4;

  --u-high:#B23A2E; --u-high-soft:#F5DEDB;
  --u-normal:#63696C; --u-normal-soft:#E7E7E4;
  --u-low:#8B9089; --u-low-soft:#E9E9E4;

  --status-open:#B23A2E; --status-progress:#9A7A1F; --status-done:#2B6E62;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#14191A; --paper-raised:#1B2122;
    --ink:#E8E6DD; --ink-soft:#9FA79E;
    --line:#2B322E; --line-strong:#3B4440;
    --accent:#63B3A2; --accent-soft:#1D332F; --accent-ink:#BFE6DB;

    --c-maint:#D98B54; --c-maint-soft:#3A2A1E;
    --c-lead:#63B3A2; --c-lead-soft:#1D332F;
    --c-tenant:#8C9BD1; --c-tenant-soft:#232B45;
    --c-bill:#D4B25C; --c-bill-soft:#362D18;
    --c-general:#A7ACA8; --c-general-soft:#2A2C29;
    --c-vendor:#AB9DCB; --c-vendor-soft:#2C2740;
    --c-owner:#8FA9DA; --c-owner-soft:#212A3D;
    --c-na:#9BA097; --c-na-soft:#25271F;

    --u-high:#E08579; --u-high-soft:#3A2320;
    --u-normal:#A7ACA8; --u-normal-soft:#2A2C29;
    --u-low:#9BA097; --u-low-soft:#25271F;

    --status-open:#E08579; --status-progress:#D4B25C; --status-done:#63B3A2;
  }
}

*{box-sizing:border-box;}
html,body{margin:0;}
body{
  background:var(--paper); color:var(--ink);
  font-family:'Public Sans',system-ui,sans-serif;
  min-height:100vh;
}
.wrap{max-width:960px;margin-inline:auto;padding-inline:20px;padding-block:28px 60px;}
h1{font-family:'Fraunces',Georgia,serif;text-wrap:balance;margin:0;font-size:clamp(24px,4vw,32px);font-weight:600;}
.mono{font-family:'IBM Plex Mono',ui-monospace,monospace;}
a{color:var(--accent-ink);}

header.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding-block-end:16px;margin-block-end:20px;border-bottom:1px solid var(--line);}
header.top .who{font-size:13px;color:var(--ink-soft);display:flex;align-items:center;gap:10px;}
.logout-link{font-size:12.5px;color:var(--ink-soft);text-decoration:none;border:1px solid var(--line-strong);border-radius:7px;padding:5px 10px;}

.viewbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-block-end:20px;}
.chip{font-family:'Public Sans';font-size:13px;font-weight:600;border:1px solid var(--line-strong);border-radius:99px;background:var(--paper-raised);color:var(--ink-soft);padding:6px 13px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px;}
.chip.active{background:var(--accent);color:white;border-color:var(--accent);}
.impersonate-banner{background:var(--c-bill-soft);color:var(--c-bill);border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-size:13px;margin-block-end:18px;}

.filters{display:flex;gap:8px;flex-wrap:wrap;margin-block-end:16px;}
select{font-family:'Public Sans';font-size:13px;border:1px solid var(--line-strong);border-radius:7px;background:var(--paper-raised);color:var(--ink);padding:6px 10px;}

.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-block-end:18px;}
.tab{font-family:'Public Sans';font-size:13px;font-weight:600;border:1px solid var(--line-strong);border-radius:99px;background:var(--paper-raised);color:var(--ink-soft);padding:7px 14px;cursor:pointer;display:inline-flex;align-items:center;gap:5px;position:relative;}
.tab.active{background:var(--accent);color:white;border-color:var(--accent);}
.tab .tab-n{font-family:'IBM Plex Mono';font-size:11px;opacity:.75;}
.tab .dot,.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--u-high);}

ul.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.card{background:var(--paper-raised);border:1px solid var(--line);border-radius:12px;padding:15px 17px;}
.card.urgency-high{border-left:3px solid var(--u-high);}
.card[data-status="done"],.card[data-status="auto_closed"]{opacity:.5;}
.row1{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap;}
.meta{font-size:11.5px;color:var(--ink-soft);font-family:'IBM Plex Mono';}
.pills{display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.pill{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;letter-spacing:.02em;padding:3px 8px;border-radius:99px;white-space:nowrap;}
.due-flag{color:var(--u-high);font-weight:700;}

.task-text{font-size:15px;line-height:1.5;margin-block:9px 6px;font-weight:500;}
.task-note{font-size:12.5px;color:var(--ink-soft);font-style:italic;margin-block-end:8px;}

.row-actions{display:flex;gap:8px;align-items:center;margin-block-start:10px;flex-wrap:wrap;}
.status-select{font-family:'Public Sans';font-size:12.5px;font-weight:600;border-radius:7px;padding:6px 10px;cursor:pointer;border:1px solid transparent;color:white;}
.status-select.status-open{background:var(--status-open);}
.status-select.status-progress{background:var(--status-progress);}
.status-select.status-waiting_vendor{background:var(--c-vendor,#6C5E92);}
.status-select.status-waiting_owner_tenant{background:var(--c-owner,#2E4A7A);}
.status-select.status-blocked{background:#6b6b6b;}
.status-select.status-done{background:var(--status-done);}
.status-select.status-auto_closed{background:var(--ink-soft);}
.status-select option{color:var(--ink);background:var(--paper-raised);font-weight:500;}
.assignee-select{font-family:'Public Sans';font-size:12.5px;border:1px solid var(--line-strong);border-radius:7px;background:var(--paper);color:var(--ink);padding:5px 8px;}
.merge-select{font-family:'Public Sans';font-size:12.5px;border:1px solid var(--line-strong);border-radius:7px;background:var(--paper);color:var(--ink);padding:5px 8px;max-width:180px;}

.btn{font-family:'Public Sans';font-size:13px;font-weight:600;border:1px solid var(--line-strong);border-radius:7px;background:var(--accent);color:white;padding:6px 12px;cursor:pointer;}

.new-task-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-block-end:16px;padding:12px;border:1px dashed var(--line-strong);border-radius:10px;background:var(--paper-raised);}
.new-task-form input[type="text"]{flex:1 1 260px;font-family:'Public Sans';font-size:13px;border:1px solid var(--line-strong);border-radius:7px;background:var(--paper);color:var(--ink);padding:6px 9px;}

.linked-messages{margin-block-start:12px;border-top:1px solid var(--line);padding-block-start:10px;}
.linked-messages-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);margin-block-end:6px;}
.linked-message{background:var(--accent-soft);border-radius:8px;padding:8px 10px;margin-block-end:6px;font-size:12.5px;}
.linked-message-meta{color:var(--ink-soft);font-size:11px;font-family:'IBM Plex Mono';}
.linked-message-text{color:var(--ink);margin-block-start:3px;}

.comments{margin-block-start:12px;border-top:1px solid var(--line);padding-block-start:10px;}
.comment{margin-block-end:8px;font-size:12.5px;}
.comment-author{font-weight:600;color:var(--ink);}
.comment-time{color:var(--ink-soft);font-size:11px;margin-inline-start:6px;}
.comment-text{color:var(--ink-soft);margin-block-start:2px;}
.comment-form{display:flex;gap:6px;margin-block-start:8px;}
.comment-input{flex:1;font-family:'Public Sans';font-size:13px;border:1px solid var(--line-strong);border-radius:7px;background:var(--paper);color:var(--ink);padding:6px 9px;}

.empty{color:var(--ink-soft);font-size:14px;padding:30px 10px;text-align:center;border:1px dashed var(--line-strong);border-radius:12px;}

/* login page */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;}
.login-card{background:var(--paper-raised);border:1px solid var(--line);border-radius:16px;padding:40px 36px;max-width:380px;width:100%;text-align:center;}
.login-card h1{font-size:26px;margin-block-end:8px;}
.login-card p{color:var(--ink-soft);font-size:14px;line-height:1.5;margin-block-end:24px;}
.google-btn{display:inline-flex;align-items:center;gap:10px;background:var(--accent);color:white;text-decoration:none;font-weight:600;font-size:14.5px;padding:12px 22px;border-radius:9px;}
.error-msg{background:var(--u-high-soft);color:var(--u-high);border-radius:8px;padding:10px 14px;font-size:13px;margin-block-end:18px;text-align:left;}

@media (max-width:480px){ .wrap{padding-inline:16px;} }
