:root{--ink:#23332e;--muted:#69786e;--green:#27664c;--bg:#f6f7f2;--line:#dee4db;--white:#fff;--danger:#a53832;font-family:Inter,Segoe UI,system-ui,sans-serif;color:var(--ink);background:var(--bg);font-size:15px}
.page-shell{max-width:1200px;margin:0 auto;padding:48px 36px}.page-heading,.board-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.page-heading h1{margin-bottom:8px}.page-heading .muted{margin-top:0}.badge{padding:7px 13px;border:1px solid var(--line);border-radius:20px;background:#fff;font-size:12px;font-weight:650}.badge.premium{color:var(--green);background:#e4efdc;border-color:#c8dbbb}.board-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:22px;margin-top:24px}.board-tile{padding:24px;border:1px solid var(--line);background:#fff;border-radius:14px;color:var(--ink);transition:transform .15s,box-shadow .15s}.board-tile:hover{text-decoration:none;transform:translateY(-3px);box-shadow:0 8px 22px #26472d10}.board-tile h2{font-size:21px}.tile-symbol{background:#ecf1e6;padding:8px 12px;display:inline-block;border-radius:9px;color:var(--green);font-size:23px}.mini-columns{display:flex;gap:7px;height:56px;margin:24px 0}.mini-columns span{background:#f1f4ed;border-radius:5px;flex:1}.mini-columns span:nth-child(2){background:#e7ecdd}.tile-open{font-size:13px;font-weight:650;color:var(--green)}.quiet-note{color:var(--muted);font-size:12px;margin-top:38px}.board-shell{padding:30px 36px 50px}.board-heading h1{margin:12px 0 6px}.breadcrumb{font-size:12px}.board-toolbar{display:flex;align-items:center;gap:20px;margin:24px 0}.search-box{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:9px;background:white;padding:0 12px}.search-box input{border:0;background:transparent;padding:10px 0;outline:0;width:215px}.sync-state{font-size:12px;color:var(--muted)}#column-toolbar{margin-left:auto}.columns{display:flex;align-items:flex-start;gap:18px;overflow-x:auto;padding:6px 0 24px;min-height:360px}.column{flex:0 0 285px;background:#eef1e8;padding:13px;border:1px solid #e0e5d9;border-radius:13px}.column-heading{display:flex;align-items:center;gap:8px;margin-bottom:15px;min-height:30px}.column-heading h2{font-size:13px;font-weight:750;margin:0;overflow-wrap:anywhere;flex:1}.column-dot{width:8px;height:8px;flex-shrink:0;background:#899980;border-radius:50%}.column:nth-child(2) .column-dot{background:#daaa43}.column:nth-child(3) .column-dot{background:#b98172}.column:nth-child(4) .column-dot{background:#4a9470}.column-count{font-size:11px;color:var(--muted);background:#e1e7d9;border-radius:5px;padding:2px 6px}.card-list{min-height:18px}.card{padding:16px;background:#fff;border:1px solid #dfe6da;border-radius:10px;margin-bottom:10px;box-shadow:0 2px 3px #25412804}.card-title{border:0;background:transparent;display:block;text-align:left;font-size:14px;line-height:1.5;padding:0;width:100%;cursor:grab;overflow-wrap:anywhere}.card-title:hover{background:transparent;color:var(--green)}.card-description{font-size:12px;line-height:1.65;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere;margin:9px 0 12px}.card-actions{display:flex;gap:14px;margin-top:12px}.card-actions button{font-size:10px;padding:0;border:0;background:none;color:var(--muted)}.card-actions button:hover{color:var(--green)}.card-actions .danger:hover{color:var(--danger)}.add-card{border:0;background:none;width:100%;color:#607254;font-size:12px;justify-content:flex-start;margin-top:4px}.empty-column{font-size:11px;color:#8b9585;text-align:center;padding:26px 12px;line-height:1.6}.card-ghost{opacity:.3}.dialog-card{width:520px;max-width:calc(100vw - 32px);padding:28px;border:1px solid var(--line);border-radius:16px;color:var(--ink);box-shadow:0 24px 70px #0003}.dialog-card::backdrop{background:#18251c70}.dialog-card h2{margin-top:0;font-size:24px}.dialog-card label{display:block;margin:16px 0 7px;font-size:13px;font-weight:600}.dialog-card input,.dialog-card select,.dialog-card textarea{width:100%}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.form-error{color:var(--danger);font-size:12px}.actions{display:flex;flex-wrap:wrap;gap:9px}#notification{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:90vw;background:#245d43;color:white;padding:14px 24px;border-radius:10px;z-index:20;display:none;box-shadow:0 6px 24px #0002}#notification.visible{display:block}#notification.error{background:#8d3832}.connection{background:white;padding:22px;border:1px solid var(--line);border-radius:12px;margin:16px 0}.column-menu button{padding:2px 5px;border:0;background:transparent;font-size:14px}.toolbar-note{font-size:12px;color:var(--muted)}@media(max-width:700px){.app-header{padding:0 18px;height:65px}.app-header nav{gap:12px;font-size:12px}.brand{font-size:23px}.page-shell,.board-shell{padding:24px 18px}.board-heading,.page-heading{align-items:flex-start}.board-heading{flex-wrap:wrap}.board-toolbar{flex-wrap:wrap;gap:12px}#column-toolbar{margin-left:0}.sync-state{font-size:10px}.columns{gap:12px}.column{flex-basis:265px}.auth-card{padding:25px}h1{font-size:27px}}
*{box-sizing:border-box}body{margin:0}a{color:var(--green);text-decoration:none}a:hover{text-decoration:underline}button,input,textarea,select{font:inherit}button,.button{border:1px solid var(--line);border-radius:9px;background:white;padding:10px 15px;cursor:pointer;color:var(--ink);font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px}button:hover,.button:hover{background:#edf2e9;text-decoration:none}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:var(--green);color:#fff;border-color:var(--green)}.primary:hover{background:#1c503a}.danger{color:var(--danger)}.muted{color:var(--muted);line-height:1.65}.eyebrow{font-size:11px;font-weight:750;letter-spacing:1.6px;color:var(--green)}h1{font-size:32px;letter-spacing:-1px;line-height:1.2}h2{letter-spacing:-.4px}.app-header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 36px;background:#fff;border-bottom:1px solid var(--line)}.brand{display:flex;gap:9px;font-size:27px;font-weight:750;letter-spacing:-1px}.app-header nav{display:flex;align-items:center;gap:24px}.app-header nav form{margin:0}.link-button{border:0;background:none;padding:0;color:var(--green)}.auth-shell{display:grid;place-items:center;min-height:calc(100vh - 76px);padding:35px 20px}.auth-card{max-width:480px;width:100%;padding:36px;background:white;border:1px solid var(--line);border-radius:18px;box-shadow:0 12px 40px #263d2910}.auth-card h1{margin:14px 0}.auth-card input:not([type=checkbox]),.auth-card button{width:100%}.auth-card label{display:block;margin-bottom:8px}.auth-card input[type=checkbox]{width:auto}.helptext{font-size:12px;color:var(--muted)}input,textarea,select{border:1px solid #cbd6c8;border-radius:8px;padding:11px;background:#fff;color:var(--ink);max-width:100%}input:focus,textarea:focus,select:focus{outline:3px solid #d7e7d4;border-color:var(--green)}.errorlist{color:var(--danger);padding-left:18px;font-size:13px}.divider{text-align:center;color:var(--muted);margin:20px 0}.messages{padding:8px 36px;background:#e3eedf}.messages p{margin:4px 0}:focus-visible{outline:3px solid #84b897;outline-offset:3px}

.card-details{max-height:calc(100dvh - 32px);overflow-y:auto}.card-details h2{overflow-wrap:anywhere}.card-details-description{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65;margin:20px 0}.card-details .dialog-actions{flex-wrap:wrap}
.board-toolbar{flex-wrap:wrap}.description-toggle{font-size:12px;min-height:42px}.description-toggle[aria-pressed="true"]{background:#e4efdc;border-color:#84b897;color:var(--green)}@media(max-width:700px){.board-toolbar .search-box{flex:1 1 100%;min-width:0}.board-toolbar .search-box input{width:100%;min-width:0}.description-toggle{min-height:44px}}

.card-details[open]{display:flex;flex-direction:column;overflow:hidden}.card-details h2,.card-details .dialog-actions{flex-shrink:0}.card-details-description{overflow-y:auto;min-height:0;margin-bottom:0}

@media(max-width:700px){.app-header{height:auto;min-height:65px;flex-wrap:wrap;gap:12px;padding:14px 18px}.app-header nav{flex-wrap:wrap}}

.dialog-card{max-height:calc(100dvh - 32px);overflow-y:auto}.card-details-content{overflow-y:auto;min-height:0}.card-details-description{overflow:visible}.card-participants-summary{border-top:1px solid var(--line);margin-top:24px;padding-top:8px;overflow-wrap:anywhere}.card-participants-summary h3{font-size:14px}.card-participants-summary p{font-size:13px}.participant-picker{border:1px solid var(--line);border-radius:8px;margin:22px 0 0;padding:12px;max-height:220px;overflow:auto}.participant-picker legend{font-weight:600;font-size:14px}.participant-picker p{font-size:12px;margin:0 0 8px}.dialog-card .participant-choice{display:flex;align-items:center;gap:10px;margin:10px 0;overflow-wrap:anywhere}.participant-choice input[type=checkbox]{width:18px;height:18px;flex-shrink:0}.participant-list{list-style:none;padding:0;max-height:230px;overflow:auto}.participant-list li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.participant-list span{min-width:0;overflow-wrap:anywhere}.participant-list button{font-size:12px;flex-shrink:0}.participant-dialog select{margin:6px 0 12px}.participant-dialog>button{margin-top:18px}

.unread-badge{display:inline-block;min-width:20px;padding:2px 6px;margin-left:3px;background:var(--green);color:white;border-radius:20px;font-size:11px;text-align:center}.unread-badge[hidden]{display:none}.notification-page{max-width:900px}.notification-list{list-style:none;padding:0;margin:24px 0}.notification-item{padding:20px;margin:12px 0;border:1px solid var(--line);border-radius:12px;background:white;overflow-wrap:anywhere}.notification-item.unread{border-left:4px solid var(--green);background:#f0f6ec}.notification-message{font-weight:600;line-height:1.6;display:block;margin:0}.notification-meta{display:flex;flex-wrap:wrap;gap:12px;color:var(--muted);font-size:12px;margin:10px 0}.notification-item button{font-size:12px}.notification-item .muted{font-size:12px}.notification-state{font-weight:600}#more-notifications[hidden]{display:none}.notification-page .actions{margin-top:20px}


/* Responsive content must wrap inside the page, while the board alone scrolls sideways. */
.page-heading>div,.board-heading>div:first-child{min-width:0;flex:1}
.board-heading{align-items:flex-start;flex-wrap:wrap}
.board-heading>div:first-child{flex-basis:280px}
.board-heading .actions{max-width:100%}
.page-heading h1,.board-heading h1,.board-tile h2{overflow-wrap:anywhere}
.badge{flex-shrink:0}
.board-grid{grid-template-columns:repeat(auto-fill,minmax(min(270px,100%),1fr))}
.board-tile{min-width:0}
.card-actions{flex-wrap:wrap;gap:4px 8px}
.card-actions button{font-size:12px;min-height:36px;padding:7px 8px}
.add-card{min-height:44px;font-size:13px}
.column-menu{display:flex;flex-shrink:0}
.column-menu button{min-width:32px;min-height:36px}
.dialog-card h2{line-height:1.35;overflow-wrap:anywhere}
.card-details-content{scrollbar-gutter:stable;overscroll-behavior:contain;padding:0 4px}
.card-details-content h2{font-size:clamp(20px,2.2vw,24px);margin:0 0 16px}
.card-details .dialog-actions{padding-top:14px;border-top:1px solid var(--line);margin-top:12px}
.account-navigation{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:24px}
.auth-card{overflow-wrap:anywhere}
@media(max-width:700px){
  .app-header nav{width:100%;gap:4px 16px;font-size:13px}
  .app-header nav>a,.app-header .link-button{min-height:40px;display:inline-flex;align-items:center}
  .page-heading{gap:12px}
  .board-toolbar{gap:10px}
  .card-actions button,.column-menu button{min-height:44px;min-width:44px}
  .description-toggle{font-size:13px}
  .sync-state{font-size:12px}
  .auth-card input:not([type=checkbox]){font-size:16px}
  .dialog-card{padding:20px}
}

.card-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}

.app-header{height:auto;min-height:76px;gap:16px;padding-top:12px;padding-bottom:12px}
.app-header .brand{flex-shrink:0}
.app-header nav{min-width:0;flex-wrap:wrap;justify-content:flex-end}
.connection{overflow-wrap:anywhere}
@media(max-width:700px){.app-header{min-height:65px}.app-header nav{justify-content:flex-start}}
@media(any-pointer:coarse){
  button,.button,.attachment-download{min-height:44px}
  .column-menu button{min-width:44px}
  .app-header nav>a{min-height:44px;display:inline-flex;align-items:center}
}

@media(any-pointer:coarse){
  .card-actions button,.column-menu button{min-height:44px;min-width:44px}
  .app-header .link-button{min-height:44px}
}


/* Two presentations share the same board and dialogs. */
.view-switch{display:inline-flex;gap:4px;padding:4px;background:#edf2e9;border:1px solid var(--line);border-radius:14px}
.view-switch button{min-height:44px;padding:8px 16px;background:transparent;border-color:transparent;font-size:13px;border-radius:10px}
.view-switch button[aria-pressed="true"]{background:var(--green);color:white;box-shadow:0 2px 5px #23332e12}
.view-switch button:hover{background:#dce9d5}.view-switch button[aria-pressed="true"]:hover{background:#1c503a}
.checklist-hint{font-size:13px;color:var(--muted);margin:0 0 18px}.checklist-hint[hidden]{display:none}
.columns.checklist{display:flex;flex-direction:column;min-height:0;gap:22px;overflow:visible;max-width:1100px;margin:0 auto;padding-bottom:24px;align-items:start}
.checklist>.column{flex:0 0 auto;width:100%;min-width:0;max-width:100%;padding:12px 16px;border-radius:18px}
.checklist .column-heading{min-height:44px;margin-bottom:8px;cursor:default}
.checklist .card-list{min-height:0;display:grid;gap:8px}
.checklist .card{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;margin:0;border-radius:13px;cursor:default}
.checklist-body{min-width:0}.checklist .card-title{font-size:15px;line-height:1.5;padding:4px 0;width:100%;cursor:pointer}
.checklist .card-description{margin:6px 0 2px}.checklist .card-actions{margin:0;border:0;padding:0}
.checklist-move{width:48px;min-height:48px;padding:10px;border-color:transparent;background:transparent;align-self:start}
.checklist-square{width:22px;height:22px;border:2px solid #7d9988;border-radius:6px;display:block}
.checklist-move:hover .checklist-square{background:#dceccb;border-color:var(--green)}
.checklist .add-card{margin-top:10px;text-align:left;justify-content:flex-start}
.move-task-title{overflow-wrap:anywhere;line-height:1.5}.move-dialog label{display:block;margin-bottom:8px}.move-dialog select{width:100%}.move-dialog .muted{font-size:13px}
@media(max-width:700px){
 .view-switch{flex:1 1 auto}.view-switch button{flex:1}.board-toolbar .sync-state{margin-left:0}
 .checklist>.column{padding:10px}.checklist .card{grid-template-columns:48px minmax(0,1fr);gap:8px;padding:8px}
 .checklist .card-actions{grid-column:2;justify-content:flex-end}.checklist .card-title{font-size:15px}
 .checklist .card-actions button{min-height:44px}.checklist .column-menu button{min-width:44px}
}

.checklist .empty-column{padding:12px 8px;text-align:left;margin:0}
/* Board-scoped recovery uses the same native dialog and both board views. */
.trash-access { display:flex; justify-content:flex-end; margin:0 0 .65rem; }
.trash-access button { color:var(--muted,#64748b); font-size:.9rem; }
.trash-dialog { width:min(680px,calc(100vw - 24px)); }
.trash-dialog [hidden] { display:none !important; }
.trash-dialog .view-switch { margin-bottom:1rem; }
.trash-list { display:grid; gap:1rem; }
.trash-item { padding:1rem; border:1px solid #dbe3ec; border-radius:12px; min-width:0; }
.trash-item h3,.trash-body,.trash-file,.trash-author { overflow-wrap:anywhere; }
.trash-item h3 { margin:0 0 .5rem; }
.trash-body { white-space:pre-wrap; max-height:14rem; overflow:auto; }
.trash-item select { width:100%; margin:.35rem 0 .75rem; }
.trash-empty { padding:1.5rem 0; text-align:center; color:#64748b; }
@media(max-width:600px) { .trash-dialog .dialog-actions { flex-wrap:wrap; } .trash-item { padding:.75rem; } }
