/* Refinements of the original green, six-column board. */
:root{--bg:#f3f5f2;--col:#ebefea;--t1:#24372d;--t2:#5a6b60;--t3:#69786e;--accent:#365e45;--ease:cubic-bezier(.2,.8,.2,1)}
body{background:var(--bg);-webkit-font-smoothing:antialiased}
header{padding:28px 32px 22px;background:#fff}
h1{font-size:26px;letter-spacing:-.6px;margin-top:12px}
.brand{font-size:11px;letter-spacing:1.8px;color:#5d7766;display:flex;align-items:center;gap:18px}
.sub{max-width:1050px;font-size:12px;line-height:1.8;margin-top:10px}
.hdact{right:32px;top:36px;gap:10px}
.summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:22px;max-width:960px}
.metric{border:1px solid #e3e9e2;border-radius:10px;padding:12px 16px;display:flex;flex-direction:column-reverse;align-items:flex-start;gap:7px;transition:background .18s,border-color .18s,box-shadow .18s}
.metric span{font-size:11px;letter-spacing:.2px;color:#66766c}
.metric b{font-size:25px;line-height:1.1;color:#2b4836}
.metric.warn b{color:#956333}
.metric.on{background:#edf4ee;border-color:#aac0ad;box-shadow:inset 0 0 0 1px #aac0ad}
.metric.on::after{display:none}
.metric:hover{background:#f2f6f1;border-color:#a9bfac}
main{padding:20px 32px 12px}
.toolbar{gap:8px;align-items:center;margin-bottom:12px}
select,input[type=text],input[type=search],input[type=date],textarea,.btn{border-radius:8px;min-height:38px;font-size:12px}
input[type=search]{max-width:350px;background:#fff}
select{padding-right:28px}
.btn{padding:9px 14px;transition:background .16s,border-color .16s,transform .16s,box-shadow .16s}
.btn.primary{background:var(--accent);border-color:var(--accent);box-shadow:0 2px 3px #203d2910}
.btn.primary:hover{background:#294c36;box-shadow:0 3px 9px #203d2922}
.btn:active{transform:translateY(1px)}
button:disabled{opacity:.55;cursor:wait}
button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #4c7958;outline-offset:3px}
#expBtn{margin-left:auto}
.note{font-size:11px;color:#69766c;line-height:1.7;margin:8px 0 16px}
.board{gap:12px;scrollbar-width:thin;scrollbar-color:#bdcbbb transparent;padding-bottom:2px}
.column{border:1px solid #e0e6dd;border-radius:12px;scrollbar-width:thin;scrollbar-gutter:stable;transition:box-shadow .18s,background .18s}
.colhead{border-top-width:3px;padding:13px 12px 14px;background:var(--col);border-radius:11px 11px 0 0}
.colhead .cl{font-size:13px}
.colhint{font-size:10px;margin-top:5px;color:#738076}
.colhead .cnt{background:#fff;border:1px solid #dce4da;min-width:25px;text-align:center;font-variant-numeric:tabular-nums}
.colbody{padding:0 8px 9px}
.card{padding:13px 12px 12px;border-radius:9px;border-color:#e0e7df;box-shadow:0 2px 3px #213a2810;transition:transform .18s var(--ease),box-shadow .18s,border-color .18s}
.card:hover{transform:translateY(-3px);border-color:#93b09a;box-shadow:0 7px 16px #213a2814}
.eyebrow{font-size:10px;gap:6px;margin-bottom:10px;color:#728076}
.chip{font-size:10px;padding:2px 5px;background:#eef2eb;color:#5d715c}
.card h3{font-size:13px;line-height:1.65;font-weight:600;margin-bottom:10px;overflow-wrap:anywhere}
.snippet{color:#758177;font-size:11px;line-height:1.7;margin-bottom:10px}
.badge{font-size:10px;border-radius:5px;padding:3px 6px;max-width:100%;overflow-wrap:anywhere}
.meta{border-top:1px solid #f0f3ee;padding-top:10px;margin-top:5px;display:flex;flex-wrap:wrap;gap:5px;font-size:10px;line-height:1.6;color:#6d7a70}
.meta span{overflow-wrap:anywhere}
.priority{font-size:10px;color:#a44236;background:#fbeee9;padding:2px 6px;border-radius:4px;display:inline-block;margin:0 4px 7px 0}
.empty{padding:35px 12px;color:#7f8e82;font-size:11px}
footer{font-size:10px;line-height:1.8;color:#7e8a80;padding-top:14px}
.sync-state{font-size:10px;font-weight:500;letter-spacing:0;color:#54735c;background:#edf4ed;border:1px solid #e1ebe1;border-radius:20px;padding:3px 9px;white-space:nowrap}
.sync-state.failed{background:#fff0e9;border-color:#ecd7ca;color:#a05b35}
.connection-alert,.conflict-banner{background:#fff4e9;color:#80532d;border:1px solid #efd5b8;padding:12px 14px;border-radius:8px;font-size:12px;line-height:1.8;margin-bottom:16px}
.conflict-banner .btn{display:block;margin-top:8px;color:#80532d}
[hidden]{display:none!important}
.loading-state{padding:24px;font-size:13px;color:var(--t2)}
.mask{background:#1c302858;backdrop-filter:blur(3px);transition:opacity .22s}
.sheet{width:560px;max-width:96vw;visibility:hidden;transition:transform .3s var(--ease),visibility .3s}
.sheet.on{visibility:visible}
.sheet .sh{padding:23px 24px;gap:16px;background:#fafcf9}
.sheet .sh h3{font-size:19px;line-height:1.6;margin-top:10px}
.sheet .sb{padding:20px 24px 30px;scrollbar-width:thin}
.sheet .sh .x,.modal .mh .x{width:auto;min-width:42px;height:32px;font-size:11px;border:1px solid #e3e9df;border-radius:6px}
.modal{visibility:hidden;transition:opacity .22s,visibility .22s}
.modal.on{visibility:visible}
.modal .box{border:1px solid #e2e9df;border-radius:16px;transform:translateY(16px) scale(.985);transition:transform .25s var(--ease);width:590px}
.modal.on .box{transform:translateY(0) scale(1)}
.modal .mh{padding:22px 24px;background:#fafcf9}
.modal .mh h3{font-size:18px}
.modal .mb{padding:22px 24px}
.modal .mf{padding:16px 24px;background:#fafcf9}
.fld{margin-bottom:17px}
.fld label{font-size:12px;font-weight:500;margin-bottom:7px}
.fld input,.fld select,.fld textarea{width:100%;background:#fbfcfa;border:1px solid #dce5d9;padding:10px 12px;border-radius:7px;line-height:1.6}
.fld textarea{resize:vertical;min-height:80px}
.fld input:focus,.fld textarea:focus,.fld select:focus{background:#fff}
.sect{font-size:12px;padding-top:20px;margin:24px 0 14px;color:#45604e}
.kv{line-height:1.8;font-size:13px}
.kv dd{white-space:pre-wrap}
.acts{gap:9px}
.acts .btn.primary{flex:1 1 100%}
.tl li{padding-bottom:20px;line-height:1.65}
.tl .t{margin-top:5px}
.toast{border-radius:10px;padding:13px 20px;max-width:min(560px,calc(100vw - 32px));line-height:1.7;text-align:center;transition:opacity .2s,transform .25s var(--ease)}
.overlay-open{overflow:hidden}
.just-saved{animation:saved 1.3s ease-out}
@keyframes saved{0%,40%{border-color:#5b9969;box-shadow:0 0 0 3px #7eb58a30}100%{border-color:#e0e7df;box-shadow:0 2px 3px #213a2810}}
@media(max-width:1240px){.summary{max-width:none}.board{grid-template-columns:repeat(3,minmax(0,1fr))}.column{scrollbar-gutter:auto}.hdact{top:26px}.sub{max-width:75%}}
@media(max-width:820px){header{padding:22px 18px 18px}main{padding:16px 18px}.hdact{margin-top:17px}.summary{gap:7px;margin-top:18px}.metric{padding:11px 9px;gap:7px}.metric b{font-size:23px}.metric span{font-size:10px}.sub{max-width:none;font-size:12px}.board{grid-template-columns:1fr}.column{border-radius:12px}.card{padding:15px}.card h3{font-size:14px}.meta{font-size:11px}.btn,select{min-height:42px}#expBtn{margin-left:0}.toolbar{gap:9px}.sheet{max-width:100%;width:100%}.modal{padding:16px 10px}.modal .box{max-height:calc(100dvh - 32px)}.modal .mb{padding:18px}.sheet .sh,.sheet .sb,.modal .mh{padding:18px}.sheet .sh h3{font-size:17px}.toast{bottom:16px}}
@media(max-width:480px){.summary{grid-template-columns:repeat(5,minmax(0,1fr))}.metric{padding:10px 6px}.metric span{font-size:9px;white-space:nowrap}.metric b{font-size:22px}.brand{font-size:10px;gap:10px}h1{font-size:21px}.row2{grid-template-columns:1fr}.hdact .btn:first-child{flex:0 0 76px}.hdact .btn.primary{flex:1}.toolbar select{flex:1;min-width:0}.colhint{font-size:11px}.fld input,.fld textarea,.fld select{font-size:16px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
