:root {
  color-scheme: light dark;
  --bg: #f3f6f7;
  --card: #ffffff;
  --ink: #172d35;
  --muted: #4c616a;
  --line: #ccd8db;
  --accent: #006257;
  --soft: #e4f3ef;
  --hover: #f1f8f6;
  --active: #075c54;
  --on-active: #fff;
  --shadow: 0 3px 14px rgb(32 62 67 / 7%);
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #111b20; --card: #19282e; --ink: #edf4f5; --muted: #b6c8cc;
    --line: #3c5158; --accent: #8ad8c4; --soft: #233f3d; --hover: #21343a;
    --active: #91dfcd; --on-active: #102e29; --shadow: none;
  }
}
* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.55 system-ui, "Segoe UI", sans-serif; background: var(--bg); color: var(--ink); }
header, main { padding-inline: max(16px, calc((100% - 1140px)/2)); }
header { display: flex; gap: 14px; align-items: center; min-height: 60px; background: var(--card); border-bottom: 1px solid var(--line); }
header strong { color: var(--accent); font-size: 1.18rem; letter-spacing: -.035em; }
header span { padding-left: 14px; border-left: 1px solid var(--line); color: var(--muted); }
#logout { margin-left: auto; }
main { padding-block: 20px 56px; }
h1 { font-size: clamp(1.8rem, 3vw, 2.35rem); letter-spacing: -.045em; margin: 0 0 4px; line-height: 1.2; }
h2 { line-height: 1.25; }
button, select, textarea, input { font: inherit; color: inherit; }
button, select, textarea, input:not([type=checkbox]) { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; }
button, summary { cursor: pointer; }
button:hover:not(:disabled) { background: var(--hover); }
button:disabled { opacity: .65; cursor: default; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
#status { margin: 7px 0 18px; color: var(--muted); }
#tools { display: flex; align-items: end; gap: 10px; }
#tools label { display: grid; gap: 4px; font-weight: 600; flex: 1; max-width: 540px; }
#tools input { width: 100%; font-weight: 400; }
details { margin: 12px 0; }
summary, a { color: var(--accent); font-weight: 600; }
#providers, .actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.layout { display: grid; grid-template-columns: 224px minmax(0, 1fr); gap: 20px; align-items: start; margin-top: 16px; }
nav { display: grid; gap: 4px; padding: 6px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; }
nav button { text-align: left; border: 0; padding: 10px 12px; font-weight: 550; }
nav button[aria-pressed=true], nav button[aria-pressed=true]:hover { background: var(--active); color: var(--on-active); }
#list { min-width: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--card); box-shadow: var(--shadow); }
#list > p { padding: 12px 18px; color: var(--muted); }
article + article { border-top: 1px solid var(--line); }
.row { display: grid; gap: 2px; text-align: left; width: 100%; border: 0; border-radius: 0; padding: 13px 20px; background: transparent; overflow-wrap: anywhere; }
article:first-child .row { border-radius: 11px 11px 0 0; }
article:last-child .row[aria-expanded=false] { border-radius: 0 0 11px 11px; }
.row strong { font-size: 1.07rem; line-height: 1.4; font-weight: 680; }
.row > span:not(.meta) { color: var(--ink); }
.meta { color: var(--muted); font-size: .9rem; font-variant-numeric: tabular-nums; }
.row[aria-expanded=true] { background: var(--soft); box-shadow: inset 4px 0 var(--accent); }
.detail { padding: 18px clamp(16px, 3vw, 32px) 24px; border-top: 1px solid var(--line); }
.detail pre { font: 1.09rem/1.68 system-ui, "Segoe UI", sans-serif; white-space: pre-wrap; overflow-wrap: anywhere; max-width: 72ch; margin: 0 0 20px; tab-size: 4; }
.detail > p, .detail small { color: var(--muted); overflow-wrap: anywhere; }
.detail > p:empty { display: none; }
.actions { border-top: 1px solid var(--line); margin-top: 16px; padding-top: 16px; }
.actions label { display: inline-flex; align-items: center; gap: 5px; }
textarea { display: block; width: 100%; min-height: 124px; resize: vertical; margin: 16px 0 10px; line-height: 1.6; }
.detail > button { margin: 0 6px 8px 0; }
.detail small { display: block; }
#login { max-width: 420px; padding: 22px; margin: 22px 0; background: var(--card); border: 1px solid var(--line); border-radius: 12px; }
#login h2 { margin: 0 0 12px; }
#login input { display: block; width: 100%; margin: 6px 0 14px; }
#login button { background: var(--active); color: var(--on-active); }
@media (max-width: 760px) {
  .layout { display: block; }
  nav { display: flex; overflow-x: auto; margin-bottom: 12px; }
  nav button { flex: none; white-space: nowrap; }
  header, main { padding-inline: 16px; }
  .row { padding: 12px 14px; }
  .detail { padding: 16px; }
  .actions :is(select,button), #providers input { max-width: 100%; }
  #tools label { min-width: 0; }
}
/* Poczta: szeroki widok, niebieskie zaznaczenie i osobna karta nadawcy. */
:root { --accent:#075ca4; --active:#085da5; --soft:#e5f1fb; --hover:#f0f6fc; }
@media(prefers-color-scheme:dark){:root{--accent:#98cdff;--active:#a6d4ff;--on-active:#102c43;--soft:#203b50;--hover:#20333f}}
header,main {padding-inline:clamp(16px,2vw,36px)}
.mail-heading {display:grid;gap:2px;padding:0 0 14px;margin-bottom:12px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.mail-heading strong {color:var(--accent)}
.mail-heading span {font-size:.9rem;color:var(--muted)}
.mail-heading span:empty {display:none}
.detail iframe {max-width:960px;margin-inline:auto;border-radius:6px}
.detail iframe + h3 {margin-top:18px}
.detail div > button {margin:4px 6px 8px 0}
@media(max-width:760px){header,main{padding-inline:16px}}
.mail-row {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}.mail-row > button:last-child {margin-inline:6px;min-height:44px}

/* Compact message-list trash action */
.mail-row > button[aria-label*="do kosza"] { font-size:0; width:36px; height:36px; padding:0; align-self:center; display:inline-grid; place-items:center; }
.mail-row > button[aria-label*="do kosza"]:not(:has(svg))::before { content:"🗑"; font:18px/1 "Segoe UI Symbol", sans-serif; }

.mail-row > button[aria-label*="do kosza"]{background:transparent;border-color:transparent;color:var(--muted);border-radius:9px;}
.mail-row > button[aria-label*="do kosza"]:not(:has(svg))::before{content:"";width:19px;height:19px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.65%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4.5%207h15M9%207V5.5Q9%204%2010.5%204h3Q15%204%2015%205.5V7M6.5%207l.8%2012q.1%201.5%201.6%201.5h6.2q1.5%200%201.6-1.5l.8-12M10.2%2010.5l.3%206M13.8%2010.5l-.3%206%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.mail-row > button[aria-label*="do kosza"]:is(:hover,:focus-visible){color:light-dark(#ae3444,#ffadb8);background:color-mix(in srgb,currentColor 10%,transparent);}
#list{display:grid;align-content:start;gap:8px;border:0;background:transparent;box-shadow:none;}
#list article{border:1px solid var(--line);border-radius:14px;background:var(--card);overflow:clip;box-shadow:0 1px 3px rgb(16 42 59 / 7%);}
.mail-row{grid-template-columns:minmax(0,1fr) auto auto;}
.forward-shortcut{min-width:36px;min-height:44px;padding:0;border:0;background:transparent;color:var(--muted);font-size:21px;}
.forward-shortcut:is(:hover,:focus-visible){background:var(--hover);color:var(--accent);}
.message-scroll{max-height:min(60dvh,44rem);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;}
.forward-dialog{width:min(92vw,32rem);border:1px solid var(--line);border-radius:14px;background:var(--card);color:inherit;padding:20px;}
.forward-dialog::backdrop{background:#10213966;}
.forward-dialog input{width:100%;}
/* Read state and single-message actions */
.mail-row{grid-template-columns:minmax(0,1fr) auto auto auto;}
.read-shortcut{width:36px;min-height:44px;padding:0;border:0;border-radius:9px;background:transparent;color:var(--muted);font:20px/1 Arial,sans-serif;}
.read-shortcut:is(:hover,:focus-visible){background:var(--hover);color:var(--accent);}
#list article.mail-unread{border-inline-start:4px solid var(--accent);}
.mail-unread .row strong{color:var(--accent);font-weight:750;}
.mail-read .row strong{font-weight:400;}
.mail-unread .read-shortcut{color:var(--accent);}
textarea.growing-text{box-sizing:border-box;width:100%;min-height:180px;max-height:none;overflow-y:hidden;resize:vertical;line-height:1.55;}
.compose-dialog{box-sizing:border-box;width:min(94vw,880px);max-height:90dvh;overflow:auto;border:1px solid var(--line);border-radius:16px;background:var(--card);color:inherit;padding:24px;}
.compose-dialog::backdrop{background:#10213966;}
.compose-dialog form{display:grid;gap:10px;}
.compose-dialog input,.compose-dialog select{box-sizing:border-box;width:100%;min-height:42px;}
.compose-dialog>button{margin:12px 8px 0 0;}
#compose-new{margin-inline-end:8px;}


/* Attachment names and signature settings, light and dark themes. */
.attachment-item{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;margin:8px 0;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink)}
.attachment-name{flex:1 1 220px;min-width:0;overflow-wrap:anywhere;white-space:normal;color:var(--ink);font-size:14px;font-weight:600}
.outgoing-attachments label{display:grid;gap:8px}.outgoing-attachments input[type=file]{max-width:100%;color:var(--ink)}
.signature-preview{margin:12px 0;padding:12px;border:1px solid var(--line);border-radius:10px}.signature-preview pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;margin:8px 0;color:var(--ink)}.signature-preview img{display:block;width:180px;max-width:100%;height:auto;margin-top:10px}.signature-preview input[type=checkbox],.compose-dialog input[type=checkbox]{width:auto;min-height:0}
.signature-dialog{width:min(94vw,680px);max-height:90dvh;overflow:auto;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:24px}.signature-dialog::backdrop{background:#10213966}.signature-dialog label{display:grid;gap:6px;margin:12px 0}.signature-dialog textarea{min-height:200px}.signature-dialog input[type=file]{max-width:100%}.signature-dialog button{margin:6px 8px 0 0}#signature-settings{margin-inline-end:8px}

/* Unified mailbox workspace */
body.workbench{font-size:14px}body.workbench header{min-height:48px}body.workbench main{padding:8px 16px 16px}body.workbench main>h1{display:none}body.workbench #status{font-size:12px;margin:4px 0 8px}
[hidden]{display:none!important}
#workspace{display:grid;grid-template-columns:210px minmax(280px,360px) minmax(360px,1fr);gap:12px;height:calc(100dvh - 165px);min-height:360px}
#mail-sidebar,#mail-centre,#reading-pane{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain}
#mail-sidebar{padding:8px;background:var(--card);border:1px solid var(--line);border-radius:12px}#mail-sidebar h2{font-size:17px;margin:4px 8px 12px}#mail-sidebar h3{font-size:11px;text-transform:uppercase;color:var(--muted);margin:18px 8px 5px}#company-scope{width:100%;margin-bottom:12px}#mail-sidebar nav{border:0;padding:0;background:transparent}#mail-sidebar nav button{padding:8px 10px;font-size:13px}
#mail-centre{display:flex;flex-direction:column}#bulk-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:8px 4px;min-height:40px}#bulk-actions button{font-size:12px;padding:4px 7px}#list{overflow:auto;min-height:0;gap:6px;padding:2px 5px 10px 0;overscroll-behavior:contain}#list article{border-radius:10px;flex:none}#list .mail-row{display:grid;grid-template-columns:20px minmax(0,1fr);gap:5px;padding:7px 9px;position:relative}#list .mail-row>input{align-self:start;margin-top:6px}#list .row{padding:0;min-width:0;gap:3px}#list .row strong{font-size:13px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#list .row .sender{font-size:13px;font-weight:650}#list .meta{font-size:11px}#list .quick-actions{grid-column:2;display:flex;justify-content:flex-end;gap:3px;height:24px}#list .quick-actions button{font-size:15px;padding:0 5px;height:24px;min-height:0;border:0;background:transparent}#list .row[aria-expanded=true]{box-shadow:none}#list article:has(.row[aria-expanded=true]){background:var(--soft);border-color:var(--accent)}
#reading-pane{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}#reading-pane>h2{font-size:20px;margin:16px 0;overflow-wrap:anywhere}.reader-toolbar{display:flex;gap:6px;flex-wrap:wrap;position:sticky;top:-16px;background:var(--card);padding:8px 0;z-index:2}.reader-toolbar button,.reader-toolbar select{font-size:12px;padding:6px 8px}#reading-pane .detail{padding:10px 0;border:0}#reading-pane .message-scroll{max-height:none;overflow:visible}#reading-pane .detail pre{font-size:14px}#reading-pane .detail .actions{font-size:12px}#reading-pane>details button{display:block;margin:5px 0}
#tools{align-items:center;flex-wrap:wrap}#tools label{max-width:none}#tools label input{min-width:200px}#tools>button{font-size:13px;white-space:nowrap}#compose-new{background:var(--active);color:var(--on-active)}#today-summary{font-size:12px;color:var(--muted);margin:6px 0 10px}
#daily-tasks.task-drawer{position:fixed;z-index:20;right:16px;top:108px;width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 130px);overflow:auto;box-shadow:0 12px 48px #0004;margin:0!important}#daily-tasks.task-drawer>p{font-size:12px}#daily-tasks .task-card details{margin:0}#daily-tasks .task-card summary{color:var(--ink)}
#mail-settings{position:relative;margin:0}#mail-settings>summary{padding:8px;border:1px solid var(--line);border-radius:8px;list-style:none}#mail-settings[open]{position:absolute;z-index:30;right:16px;top:55px;width:min(430px,95vw);padding:16px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 30px #0003}#mail-settings input{max-width:100%}
#mail-toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:60;display:flex;gap:16px;align-items:center;background:var(--ink);color:var(--card);padding:12px 20px;border-radius:12px;box-shadow:0 5px 24px #0004;max-width:90vw}#mail-toast button{background:var(--card);color:var(--ink)}
@media(max-width:1100px){#workspace{grid-template-columns:170px minmax(250px,310px) minmax(300px,1fr)}#tools button{padding:7px}#reading-pane{padding:12px}}
@media(max-width:850px){#workspace{grid-template-columns:150px minmax(0,1fr)}#reading-pane{grid-column:1/-1;position:fixed;inset:105px 8px 8px;z-index:10}#reading-pane:not(:has(.detail)){display:none}#mail-sidebar nav{display:grid;overflow:visible}#tools label{flex-basis:100%}#workspace{height:calc(100dvh - 215px)}#daily-tasks.task-drawer{top:150px}}
/* Tasks above mail */
#daily-tasks.task-board{position:relative;inset:auto;width:auto;max-height:none;overflow:visible;box-shadow:none;margin:0 0 12px!important;padding:12px 16px;border-radius:12px}
#daily-tasks.task-board>h2{font-size:18px;margin:0!important;display:inline-block}
#daily-tasks.task-board>.task-tools{display:inline-block;margin:0 0 0 20px;vertical-align:top}
#daily-tasks.task-board>.task-tools[open]{display:block;margin:8px 0}
#daily-tasks.task-board>p{font-size:12px;margin:5px 0;color:var(--muted)}
#daily-tasks.task-board>details:not(.task-tools){font-size:12px;margin:4px 0}
.task-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-top:8px}
.task-column{min-width:0;border-radius:10px;padding:8px;background:var(--card);border:1px solid var(--line)}
.task-column>h3{font-size:15px;margin:0 4px 6px}.task-urgent>h3{color:#dc2626}.task-normal>h3{color:#2563eb}
.task-column-list{height:190px;overflow:auto;overscroll-behavior:contain;padding:0 4px 4px 0}
.task-column-list>h4{font-size:12px;color:var(--muted);margin:10px 4px 4px}
#daily-tasks .task-card details{margin:0}#daily-tasks .task-card summary{color:var(--ink)}
body.workbench #workspace{height:calc(100dvh - 480px);min-height:340px}
@media(max-width:600px){.task-columns{gap:8px}.task-column{padding:4px}.task-column-list{height:200px}#daily-tasks.task-board{padding:8px}#daily-tasks .task-card{padding:7px!important;gap:5px!important}.task-board .task-card strong{font-size:12px!important}}
/* Reading area can fill the viewport after tasks scroll away. */
body.workbench #workspace{height:calc(100dvh - 28px);min-height:420px}
body.mail-focus{overflow:hidden}
body.mail-focus #reading-pane{position:fixed;inset:8px;z-index:100;width:auto;height:auto;max-height:none;margin:0;border-radius:12px;display:block}
body.mail-focus #reading-pane .message-scroll{max-width:1100px;margin:auto}
body.mail-focus #reading-pane .reply-text{width:100%}

/* Compact mailbox navigation with a clear category divider. */
#mail-sidebar{padding:7px}
#mail-sidebar h2{font-size:16px;margin:2px 7px 8px}
#mail-sidebar #company-scope{padding:6px 8px;margin-bottom:7px}
#mail-sidebar nav{gap:2px}
#mail-sidebar nav button{padding:4px 8px;min-height:26px;line-height:17px;font-size:13px;margin:0;text-align:left}
#mail-sidebar h3{font-size:14px;font-weight:800;letter-spacing:.04em;color:var(--ink);background:var(--soft);border-top:2px solid var(--active);border-bottom:1px solid var(--line);border-radius:4px;margin:10px 0 6px;padding:8px;text-transform:uppercase}

/* Sender initials and compact Sent navigation */
.sender-avatar{display:inline-flex;width:34px;height:34px;flex:none;border-radius:50%;align-items:center;justify-content:center;font-size:12px;font-weight:750;letter-spacing:.02em;user-select:none}
#list .mail-row{grid-template-columns:18px 34px minmax(0,1fr);column-gap:7px}
#list .mail-row>.sender-avatar{align-self:start;margin-top:2px}
#list .quick-actions{grid-column:3}
.mail-heading>.sender-avatar{float:left;margin:0 10px 4px 0}
#mail-sidebar nav button{min-height:24px;padding:3px 8px}
#mail-sidebar h3{margin:8px 0 5px;padding:6px 8px}
#bulk-actions select{font-size:12px;padding:4px 6px;margin-left:auto}
/* Taller task windows; original typography preserved. */
#daily-tasks .task-column-list{height:340px}
@media(max-width:600px){#daily-tasks .task-column-list{height:300px}}