:root { color-scheme: light dark; --vora:#d9dee8; --fons:#ffffff; --tinta:#172033;
        --suau:#687386; --caixa:#f7f9fc; --accent:#2457e6; --accent-soft:#eef3ff;
        --perill:#b42318; --avis:#b45309; --notice:#6d28d9; --ok:#15803d;
        --radi-petit:8px; --radi-mitja:14px; --radi-pindola:999px;
        --ombra:0 8px 24px rgba(23,32,51,.07); }
@media (prefers-color-scheme: dark) {
  :root { --vora:#333941; --fons:#14171b; --tinta:#e7eaee; --suau:#9aa3ae;
          --caixa:#1c2026; --accent:#7aa2ff; --perill:#ff8a80; --avis:#f0b429;
          --notice:#c4b5fd; --ok:#6ee7a8; } }
* { box-sizing:border-box; }
body { margin:0; background:var(--caixa); color:var(--tinta);
       font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; min-height:100vh; }
a { color:var(--accent); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.app-header { position:sticky; top:0; z-index:30; height:64px; border-bottom:1px solid var(--vora); padding:.65rem 1.25rem;
              display:flex; gap:1.25rem; align-items:center; background:var(--fons); box-shadow:0 2px 12px rgba(23,32,51,.04); }
.brand { display:flex; align-items:center; gap:.55rem; color:var(--tinta); text-decoration:none; font-weight:800; letter-spacing:-.02em; }
.brand-mark { width:2rem; height:2rem; display:grid; place-items:center; border-radius:9px; background:var(--accent); color:#fff; font-weight:900; }
.header-context { flex:1; color:var(--suau); font-size:.86rem; }
.header-user { display:flex; align-items:center; gap:.65rem; }
.app-shell { width:100%; max-width:1500px; margin:0 auto; display:grid; grid-template-columns:230px minmax(0,1fr); }
.app-sidebar { position:sticky; top:64px; height:calc(100vh - 64px); display:flex; flex-direction:column;
               padding:1.15rem .85rem; border-right:1px solid var(--vora); background:var(--fons); }
.app-nav { display:grid; gap:.3rem; }
.app-nav a { position:relative; min-height:48px; display:grid; grid-template-columns:2rem minmax(0,1fr) auto; gap:.65rem; align-items:center;
             padding:.55rem .65rem; border-radius:11px; color:var(--suau); text-decoration:none; font-weight:680; }
.app-nav a:hover { color:var(--tinta); background:var(--caixa); }
.app-nav a.actiu { color:var(--accent); background:var(--accent-soft); }
.app-nav-icon { width:2rem; height:2rem; display:grid; place-items:center; border-radius:9px; background:var(--caixa);
                color:var(--tinta); font-weight:850; }
.app-nav a.actiu .app-nav-icon { color:#fff; background:var(--accent); }
.app-nav .badge { margin-left:auto; }
.sidebar-help { margin-top:auto; padding:.85rem .65rem 0; border-top:1px solid var(--vora); color:var(--suau); font-size:.78rem; }
.sidebar-help b { display:block; color:var(--tinta); font-size:.88rem; }
.login-brand { display:flex; align-items:center; gap:.85rem; max-width:520px; margin:2.5rem auto 1rem; }
.login-brand h1 { margin:0 0 .2rem; }
.login-brand + form { max-width:760px; margin:0 auto; }
.qui { color:var(--suau); font-size:.85rem; }
.app-main { min-width:0; width:100%; max-width:1270px; padding:1.6rem 2rem 3rem; margin:0 auto; }
.public-main { padding:1.6rem; max-width:1240px; margin:0 auto; width:100%; }
h1 { font-size:1.55rem; line-height:1.2; letter-spacing:-.025em; margin:0 0 1rem; }
h2 { font-size:1.05rem; margin:1.5rem 0 .6rem; }
.xips { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1rem; }
.xip { border:1px solid var(--vora); border-radius:999px; padding:.15rem .7rem;
       font-size:.85rem; text-decoration:none; color:inherit; background:var(--caixa); }
.xip b { font-weight:600; }
.caixa { border:1px solid var(--vora); border-radius:12px; padding:1rem;
         background:var(--fons); margin-bottom:1rem; box-shadow:var(--ombra); }
table { width:100%; border-collapse:collapse; font-size:.92rem; }
th,td { text-align:left; padding:.72rem .7rem; border-bottom:1px solid var(--vora);
        vertical-align:middle; }
tbody tr:hover { background:var(--caixa); }
th { font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--suau); }
.buit { color:var(--suau); font-style:italic; padding:1rem 0; }
.etiqueta { display:inline-flex; align-items:center; font-size:.75rem; border:1px solid var(--vora); border-radius:999px;
            padding:.16rem .52rem; white-space:nowrap; font-weight:650; background:var(--fons); }
.p-CRITICAL,.s-CRITICAL { color:var(--perill); border-color:currentColor; }
.p-HIGH,.s-WARNING { color:var(--avis); border-color:currentColor; }
.s-NOTICE { color:var(--notice); border-color:currentColor; }
.vencuda { color:var(--perill); font-weight:600; }
.badge { background:var(--perill); color:#fff; border-radius:999px;
         padding:0 .4rem; font-size:.75rem; margin-left:.25rem; }
form.filtres { display:flex; gap:.6rem; flex-wrap:wrap; align-items:flex-end; }
.task-search { flex:1 1 280px; }
.task-search input { width:100%; }
label { display:block; font-size:.78rem; color:var(--suau); margin-bottom:.15rem; }
input,select,textarea,button { font:inherit; padding:.35rem .5rem;
        border:1px solid var(--vora); border-radius:6px; background:var(--fons);
        color:var(--tinta); min-height:44px; }
textarea { width:100%; min-height:5rem; }
button { min-height:40px; cursor:pointer; background:var(--accent); color:#fff; border-color:transparent; border-radius:9px; font-weight:700; }
button:hover { filter:brightness(.97); }
button.discret { background:transparent; color:var(--tinta); border-color:var(--vora); font-weight:500; }
button.perill { background:var(--perill); color:#fff; }
button.delete-button { background:transparent; color:var(--perill); border-color:#efc0bc; }
button.delete-button:hover { background:#fff1f0; }
.linia { display:flex; gap:.6rem; align-items:flex-end; flex-wrap:wrap;
         margin-bottom:.6rem; }
.dades { display:grid; grid-template-columns:auto 1fr; gap:.3rem 1rem;
         font-size:.92rem; }
.dades dt { color:var(--suau); }
.dades dd { margin:0; }
.no-llegit { border-left:3px solid var(--accent); }
.avis { border:1px solid var(--avis); color:var(--avis); border-radius:6px;
        padding:.6rem .8rem; margin-bottom:1rem; font-size:.9rem; }
.error { border:1px solid var(--perill); color:var(--perill); border-radius:6px;
         padding:.6rem .8rem; margin-bottom:1rem; font-size:.9rem; }
.metric-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
               gap:.7rem; margin:1rem 0; }
.metric { border:1px solid var(--vora); border-radius:8px; padding:.8rem; background:var(--caixa); }
.metric b { display:block; font-size:1.25rem; margin-top:.1rem; }
.report-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.6rem; margin:1rem 0; }
.report-kpis div { padding:.75rem; border-radius:10px; background:var(--caixa); }
.report-kpis b,.report-kpis span { display:block; }
.report-kpis b { font-size:1.35rem; }
.report-kpis span { color:var(--suau); font-size:.78rem; }
.report-chart { height:70px; display:flex; align-items:flex-end; gap:.65rem; padding:.5rem; background:var(--caixa); border-radius:10px; }
.report-bar { width:38%; height:min(var(--value),100%); min-height:5px; border-radius:8px 8px 3px 3px; background:var(--avis); }
.report-bar.critical { background:var(--perill); }
@media print { .app-header,.app-sidebar,.monitor-subnav,.filtres { display:none!important; } .app-shell { display:block; } .app-main { max-width:none; } }
.timeline { display:flex; gap:3px; align-items:center; min-width:110px; }
.punt { width:9px; height:18px; border-radius:3px; background:var(--vora); display:inline-block; }
.punt.OK { background:var(--ok); } .punt.WARNING { background:var(--avis); }
.punt.CRITICAL { background:var(--perill); }
.page-head { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start;
             flex-wrap:wrap; margin-bottom:1rem; }
.page-head h1,.page-head h2 { margin-top:0; margin-bottom:.2rem; }
.boto-link { min-height:42px; display:inline-flex; align-items:center; justify-content:center; background:var(--accent); color:#fff; text-decoration:none;
             border-radius:9px; padding:.52rem .85rem; font-weight:700; }
.inline { display:inline; margin:0; }
.accions { display:flex; gap:.4rem; flex-wrap:wrap; align-items:center; }
.accions.vertical { flex-direction:column; align-items:flex-start; }
.action-form { display:flex; gap:.35rem; flex-wrap:wrap; align-items:center; }
.taula-scroll { width:100%; overflow-x:auto; border:1px solid var(--vora); border-radius:8px; }
.taula-scroll table { min-width:760px; }
.taula-scroll tr:last-child td { border-bottom:0; }
.estat-buit { border:1px dashed var(--vora); border-radius:8px; padding:1.2rem;
              display:flex; flex-direction:column; gap:.2rem; color:var(--suau); }
.estat-buit b { color:var(--ok); font-size:1rem; }
.operativa { border-left:3px solid var(--accent); }
.task-board { display:grid; grid-template-columns:repeat(6,minmax(120px,1fr)); gap:.7rem; margin:0 0 1rem; }
.task-board-card { min-height:82px; display:flex; align-items:center; gap:.75rem; padding:.8rem;
                   border:1px solid var(--vora); border-radius:12px; background:var(--fons); box-shadow:var(--ombra);
                   color:var(--tinta); text-decoration:none; transition:.15s ease; }
.task-board-card:hover { border-color:var(--accent); transform:translateY(-1px); }
.task-board-card.actiu { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; }
.task-board-card.urgent { border-color:var(--perill); }
.task-board-icon { width:2rem; height:2rem; display:flex; align-items:center; justify-content:center;
                   border-radius:8px; background:var(--fons); font-weight:800; }
.task-board-copy { display:flex; flex-direction:column; line-height:1.2; }
.task-board-copy b { font-size:1.45rem; }
.task-board-copy span { color:var(--suau); font-size:.85rem; margin-top:.15rem; }
.task-overdue-row { box-shadow:3px 0 0 var(--perill) inset; }
.task-overdue-row td:first-child a { font-weight:700; }
.task-new-cta { min-height:42px; display:flex; align-items:center; }
.task-list-head { margin-top:1rem; margin-bottom:.45rem; }
.task-detail-head h1 { margin:.55rem 0 .45rem; }
.task-detail-metrics .metric b { font-size:1rem; overflow-wrap:anywhere; }
.task-actions { display:grid; grid-template-columns:repeat(2,minmax(260px,1fr)); gap:.7rem; }
.task-actions form { margin:0; padding:.65rem; border:1px solid var(--vora); border-radius:8px; background:var(--fons); }
.task-actions .linia { align-items:flex-end; }
.task-description p { white-space:pre-wrap; margin-bottom:0; }

.task-table-form { margin:0; }
.task-bulk { display:flex; align-items:flex-end; gap:.55rem; flex-wrap:wrap; padding:.75rem;
             border:1px solid var(--vora); border-bottom:0; border-radius:12px 12px 0 0; background:var(--caixa); }
.task-bulk .bulk-spacer { flex:1 1 20px; }
.task-select { width:38px; text-align:center; }
.task-title-link { color:var(--tinta); text-decoration:none; font-weight:750; }
.task-title-link:hover { color:var(--accent); }
.task-meta { display:flex; flex-wrap:wrap; gap:.35rem .6rem; color:var(--suau); font-size:.8rem; margin-top:.18rem; }
.task-state-PENDING { color:#2457e6; border-color:#b9c8ff; background:#eef3ff; }
.task-state-IN_PROGRESS { color:#0f766e; border-color:#99e0da; background:#ecfdfb; }
.task-state-BLOCKED { color:#b45309; border-color:#f2c894; background:#fff8eb; }
.task-state-COMPLETED { color:#15803d; border-color:#a7ddb8; background:#effbf3; }
.task-state-CANCELLED { color:var(--suau); }
.task-archived-row { opacity:.8; }
.task-lifecycle-banner { padding:.85rem 1rem; border-radius:10px; margin-bottom:1rem; border:1px solid var(--vora); background:var(--caixa); }
.task-lifecycle-banner.archived { border-color:#d5b46c; background:#fff9e8; color:#7a5200; }
.task-lifecycle-banner.deleted { border-color:#e4a39e; background:#fff1f0; color:#8c1d18; }
.task-management { display:grid; grid-template-columns:repeat(2,minmax(260px,1fr)); gap:.7rem; margin-top:.8rem; }
.task-management .caixa { margin:0; box-shadow:none; }
.task-danger { border-color:#efc0bc; background:#fffafa; }
.task-danger h2 { color:var(--perill); margin-top:0; }
.task-quick-links { display:flex; gap:.45rem; flex-wrap:wrap; align-items:center; }
.task-list-summary { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; }


.task-detail-head { max-width:880px; }
.task-detail-head h1 { font-size:clamp(1.55rem,3vw,2rem); max-width:900px; }
.task-detail-shell { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:1rem; align-items:start; }
.task-detail-main { min-width:0; }
.task-summary-panel { position:sticky; top:5.3rem; box-shadow:none; }
.task-summary-panel h2 { margin:0 0 .85rem; }
.task-summary-list { display:grid; gap:0; margin:0; }
.task-summary-list div { display:grid; grid-template-columns:95px 1fr; gap:.75rem; padding:.7rem 0;
                         border-bottom:1px solid var(--vora); align-items:start; }
.task-summary-list div:last-child { border-bottom:0; }
.task-summary-list dt { color:var(--suau); font-size:.8rem; }
.task-summary-list dd { margin:0; font-weight:650; overflow-wrap:anywhere; }
.task-description { padding:1.2rem; border-left:4px solid var(--accent); }
.task-description h2 { margin:0 0 .45rem; font-size:.82rem; text-transform:uppercase;
                       letter-spacing:.055em; color:var(--suau); }
.task-description p { font-size:1.05rem; line-height:1.65; margin:0; }
.task-actions-title { margin-top:1.1rem; }
.task-actions form { display:flex; flex-direction:column; justify-content:space-between; min-height:112px; }
.task-actions form .linia { margin:0; }
.task-actions form button { white-space:nowrap; }
.task-fold { margin-top:1rem; border:1px solid var(--vora); border-radius:12px; background:var(--fons); }
.task-fold > summary { cursor:pointer; padding:1rem; font-weight:700; list-style:none; }
.task-fold > summary::-webkit-details-marker { display:none; }
.task-fold > summary::after { content:"+"; float:right; color:var(--accent); font-size:1.2rem; }
.task-fold[open] > summary::after { content:"−"; }
.task-fold-content { padding:0 1rem 1rem; }
.task-fold-content > h2:first-child { margin-top:.35rem; }
.task-technical-note { color:var(--suau); margin:-.25rem 0 .75rem; font-size:.85rem; }

.monitor-subnav { display:flex; align-items:flex-start; gap:.55rem; margin:0 0 1.15rem; border-bottom:1px solid var(--vora); }
.monitor-tabs { display:flex; flex:1 1 auto; gap:.25rem; overflow-x:auto; padding:0 0 .65rem; }
.monitor-tab { min-height:40px; display:flex; align-items:center; justify-content:center; gap:.38rem; white-space:nowrap;
               position:relative; padding:.45rem .65rem; border:1px solid transparent; border-radius:999px;
               color:var(--suau); text-decoration:none; font-weight:650; background:transparent; }
.monitor-tab:hover { border-color:var(--accent); color:var(--accent); }
.monitor-tab.actiu { background:var(--accent); color:#fff; border-color:var(--accent); }
.monitor-icon { width:1.45rem; height:1.45rem; display:inline-flex; align-items:center; justify-content:center;
                border-radius:6px; background:var(--caixa); color:var(--tinta); font-size:.9rem; font-weight:800; }
.monitor-tab.actiu .monitor-icon { background:rgba(255,255,255,.2); color:#fff; }
.monitor-badge { position:absolute; top:4px; right:5px; min-width:18px; height:18px; padding:0 5px;
                 display:flex; align-items:center; justify-content:center; border-radius:999px;
                 background:var(--perill); color:#fff; font-size:.7rem; font-weight:700; }
.monitor-add { min-width:126px; display:flex; align-items:center; justify-content:center; padding:.55rem .8rem;
               border-radius:8px; background:var(--accent); color:#fff; text-decoration:none; font-weight:700; }
.monitor-add:hover { filter:brightness(.95); }
.site-overview { margin-bottom:1rem; }
.site-title-line { display:flex; gap:.65rem; align-items:center; flex-wrap:wrap; }
.site-title-line h1 { margin:0; }
.site-metrics { margin-top:.55rem; }
.metric-state { min-height:1.8rem; display:flex !important; align-items:center; }
.boto-link.secundari { background:var(--fons); color:var(--tinta); border:1px solid var(--vora); }
.boto-link.secundari:hover { border-color:var(--accent); color:var(--accent); }
.settings-subnav { display:grid; grid-template-columns:repeat(2,minmax(180px,1fr)); gap:.55rem;
                   padding:.65rem; margin:0 0 1rem; border:1px solid var(--vora);
                   border-radius:10px; background:var(--caixa); }
.settings-tab { min-height:50px; display:flex; align-items:center; justify-content:center;
                gap:.5rem; padding:.55rem .8rem; border:1px solid transparent;
                border-radius:8px; background:var(--fons); color:var(--tinta);
                text-decoration:none; font-weight:600; }
.settings-tab:hover { border-color:var(--accent); color:var(--accent); }
.settings-tab.actiu { background:var(--accent); color:#fff; border-color:var(--accent); }

/* Interfície comercial i flux de tasca centrat en l'acció */
.login-shell { min-height:calc(100vh - 8rem); display:grid; grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
               gap:clamp(2rem,6vw,6rem); align-items:center; padding:clamp(1.5rem,5vw,4.5rem) 0; }
.login-promise { max-width:610px; }
.login-logo { display:flex; align-items:center; gap:.7rem; font-size:1.05rem; font-weight:850; margin-bottom:2.4rem; }
.login-logo .brand-mark { box-shadow:0 12px 28px rgba(36,87,230,.24); }
.login-eyebrow,.task-eyebrow { color:var(--accent); font-size:.76rem; font-weight:800; letter-spacing:.09em;
                               text-transform:uppercase; margin:0 0 .6rem; }
.login-promise h1 { font-size:clamp(2.5rem,5vw,4.6rem); line-height:1.02; max-width:720px; margin:0 0 1.3rem;
                    letter-spacing:-.055em; }
.login-lead { color:var(--suau); font-size:1.15rem; max-width:590px; margin:0 0 2rem; }
.login-benefits { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; list-style:none; padding:0; margin:0; }
.login-benefits li { min-height:116px; padding:1rem; border:1px solid var(--vora); border-radius:14px;
                     background:rgba(255,255,255,.65); }
.login-benefits strong { display:block; margin:.55rem 0 .2rem; }
.login-benefits span { color:var(--suau); font-size:.84rem; }
.login-benefit-icon { width:2rem; height:2rem; display:grid; place-items:center; border-radius:9px;
                      background:var(--accent-soft); color:var(--accent); font-weight:900; }
.login-card { padding:clamp(1.4rem,3vw,2.25rem); border:1px solid var(--vora); border-radius:22px;
              background:var(--fons); box-shadow:0 24px 70px rgba(23,32,51,.12); }
.login-card h2 { font-size:1.55rem; margin:0 0 .3rem; }
.login-card > p { margin:.15rem 0 1.4rem; }
.login-form { display:grid; gap:1rem; }
.login-form label { margin-bottom:.35rem; color:var(--tinta); font-weight:650; }
.login-form input { width:100%; min-height:48px; padding:.7rem .8rem; border-radius:10px; }
.login-form button { min-height:50px; margin-top:.35rem; border-radius:10px; font-size:1rem; }
.login-help { display:flex; justify-content:flex-end; margin-top:-.35rem; font-size:.86rem; }
.login-help a { font-weight:650; text-decoration:none; }
.login-help a:hover { text-decoration:underline; }
.login-trust { display:flex; align-items:center; gap:.45rem; margin:1rem 0 0; color:var(--suau); font-size:.8rem; }
.login-trust::before { content:"✓"; width:1.25rem; height:1.25rem; display:grid; place-items:center;
                       border-radius:999px; background:#eaf8ef; color:var(--ok); font-weight:900; }

.task-detail-head { max-width:100%; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; }
.task-detail-head h1 { max-width:900px; font-size:clamp(1.65rem,3vw,2.35rem); margin:.75rem 0 .55rem; }
.task-detail-shell { grid-template-columns:minmax(0,1fr) 285px; gap:1.25rem; }
.task-description { padding:1.35rem; border-left:0; border-radius:16px; box-shadow:none; background:var(--caixa); }
.task-description h2 { color:var(--tinta); font-size:1rem; letter-spacing:0; text-transform:none; }
.task-description p { font-size:1.08rem; line-height:1.65; }
.task-workflow { margin-top:1rem; }
.task-next { position:relative; overflow:hidden; padding:1.35rem; border:1px solid #b9c8ff; border-radius:16px;
             background:linear-gradient(135deg,var(--accent-soft),var(--fons)); box-shadow:var(--ombra); }
.task-next::after { content:""; position:absolute; width:150px; height:150px; right:-65px; top:-80px;
                    border-radius:999px; background:rgba(36,87,230,.08); }
.task-next h2 { margin:0 0 .3rem; font-size:1.25rem; }
.task-next > p { color:var(--suau); margin:.2rem 0 1rem; }
.task-primary-form { display:flex; gap:.6rem; align-items:flex-end; flex-wrap:wrap; position:relative; z-index:1; }
.task-primary-form label { color:var(--tinta); font-weight:700; }
.task-primary-form select { min-width:190px; min-height:46px; }
.task-primary-form button { min-height:46px; padding:.55rem 1rem; border-radius:9px; }
.task-complete-note { color:var(--ok); font-weight:750; margin:0; }
.task-edit-fold { margin-top:.8rem; border:1px solid var(--vora); border-radius:14px; background:var(--fons); }
.task-edit-fold > summary { cursor:pointer; display:flex; justify-content:space-between; gap:1rem; padding:1rem 1.1rem;
                            list-style:none; font-weight:750; }
.task-edit-fold > summary::-webkit-details-marker { display:none; }
.task-edit-fold > summary::after { content:"＋"; color:var(--accent); margin-left:auto; }
.task-edit-fold[open] > summary::after { content:"−"; }
.task-edit-fold summary small { color:var(--suau); font-weight:450; }
.task-edit-grid { display:grid; grid-template-columns:repeat(2,minmax(230px,1fr)); gap:.75rem;
                  padding:0 1rem 1rem; border-top:1px solid var(--vora); padding-top:1rem; }
.task-edit-grid form { padding:.85rem; border:1px solid var(--vora); border-radius:10px; background:var(--caixa); }
.task-edit-grid form .linia { margin:0; }
.task-summary-panel { top:5.3rem; border-radius:16px; padding:1.15rem; background:var(--fons); }
.task-summary-panel h2 { font-size:1rem; }
.task-summary-list div { grid-template-columns:86px 1fr; }
.task-fold { box-shadow:none; }
@media (max-width:720px) {
  .login-shell { grid-template-columns:1fr; padding:1.5rem 0 2.5rem; gap:2rem; }
  .login-promise h1 { font-size:clamp(2.25rem,10vw,3.5rem); }
  .login-benefits { grid-template-columns:1fr; }
  .login-benefits li { min-height:0; display:grid; grid-template-columns:2rem 1fr; gap:0 .75rem; }
  .login-benefits strong,.login-benefits span { grid-column:2; }
  .login-benefit-icon { grid-row:1 / span 2; }
  .task-edit-grid { grid-template-columns:1fr; }
  .task-edit-fold summary small { display:none; }
}


/* Portada de tasques: lectura ràpida, feina primer i eines avançades a demanda */
.tasks-hero { margin-bottom:1.15rem; }
.tasks-hero h1 { font-size:clamp(1.8rem,3vw,2.35rem); margin-bottom:.35rem; }
.tasks-hero-copy { color:var(--suau); margin:0; font-size:1rem; }
.tasks-topline { display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.tasks-topline .boto-link { min-height:44px; display:flex; align-items:center; border-radius:10px; padding:.55rem .9rem; }
.task-overview { display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; margin-bottom:1rem; }
.task-overview-card { min-height:104px; display:flex; flex-direction:column; justify-content:center; padding:1rem 1.15rem;
                      border:1px solid var(--vora); border-radius:16px; background:var(--fons);
                      color:var(--tinta); text-decoration:none; box-shadow:0 6px 22px rgba(23,32,51,.045); }
.task-overview-card:hover { border-color:var(--accent); transform:translateY(-1px); }
.task-overview-card.actiu { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; }
.task-overview-card strong { font-size:2rem; line-height:1; letter-spacing:-.04em; }
.task-overview-card span { color:var(--suau); margin-top:.35rem; }
.task-overview-card.attention { border-color:#efc0bc; }
.task-overview-card.attention strong,.task-overview-card.attention span { color:var(--perill); }
.task-view-tabs { display:flex; gap:.4rem; overflow-x:auto; margin:0 0 1rem; padding-bottom:.15rem; }
.task-view-tabs a { white-space:nowrap; padding:.5rem .75rem; border:1px solid var(--vora); border-radius:999px;
                    color:var(--suau); background:var(--fons); text-decoration:none; font-weight:650; }
.task-view-tabs a:hover { color:var(--tinta); border-color:var(--accent); }
.task-view-tabs a.actiu { color:#fff; border-color:var(--accent); background:var(--accent); }
.task-search-panel { padding:.8rem; border:1px solid var(--vora); border-radius:14px; background:var(--fons); margin-bottom:1.2rem; }
.task-search-row { display:grid; grid-template-columns:minmax(220px,1fr) auto auto; gap:.55rem; align-items:end; }
.task-search-row input { width:100%; min-height:44px; padding:.6rem .75rem; border-radius:9px; }
.task-search-row button { min-height:44px; border-radius:9px; padding:.5rem .9rem; }
.task-search-clear { min-height:44px; display:flex; align-items:center; padding:0 .7rem; color:var(--suau); text-decoration:none; }
.task-filter-more { margin-top:.65rem; border-top:1px solid var(--vora); }
.task-filter-more > summary { cursor:pointer; list-style:none; padding:.7rem .15rem 0; color:var(--suau); font-weight:650; }
.task-filter-more > summary::-webkit-details-marker { display:none; }
.task-filter-more > summary::after { content:"＋"; margin-left:.4rem; color:var(--accent); }
.task-filter-more[open] > summary::after { content:"−"; }
.task-filter-grid { display:grid; grid-template-columns:repeat(4,minmax(140px,1fr)); gap:.65rem; padding-top:.75rem; }
.task-filter-grid input,.task-filter-grid select { width:100%; min-height:40px; }
.task-list-head { display:flex; justify-content:space-between; align-items:end; gap:1rem; margin:.2rem 0 .7rem; }
.task-list-head h2 { font-size:1.15rem; margin:0; }
.task-list-head p { margin:.2rem 0 0; color:var(--suau); }
.task-table-form { display:block; }
.task-bulk-fold { border:1px solid var(--vora); border-radius:12px; background:var(--fons); margin-bottom:.7rem; }
.task-bulk-fold > summary { cursor:pointer; list-style:none; padding:.72rem .9rem; color:var(--suau); font-size:.86rem; font-weight:650; }
.task-bulk-fold > summary::-webkit-details-marker { display:none; }
.task-bulk-fold > summary::after { content:"＋"; float:right; color:var(--accent); }
.task-bulk-fold[open] > summary::after { content:"−"; }
.task-bulk-fold .task-bulk { border:0; border-top:1px solid var(--vora); border-radius:0 0 12px 12px; }
.task-list { display:grid; gap:.65rem; }
.task-item { display:grid; grid-template-columns:34px minmax(0,1fr) auto 155px 38px; gap:.85rem; align-items:center;
             padding:1rem; border:1px solid var(--vora); border-radius:14px; background:var(--fons);
             box-shadow:0 5px 18px rgba(23,32,51,.035); transition:.15s ease; }
.task-item:hover { border-color:#b9c8ff; box-shadow:0 8px 24px rgba(23,32,51,.07); }
.task-item.task-overdue-row { border-left:4px solid var(--perill); }
.task-item.task-archived-row { opacity:.76; }
.task-item-check { display:grid; place-items:center; margin:0; }
.task-item-check input { width:18px; height:18px; }
.task-item-main { min-width:0; }
.task-item-title { color:var(--tinta); text-decoration:none; font-size:1rem; font-weight:780; line-height:1.35; }
.task-item-title:hover { color:var(--accent); }
.task-item-meta { display:flex; flex-wrap:wrap; gap:.3rem .8rem; color:var(--suau); font-size:.8rem; margin-top:.35rem; }
.task-item-tags { display:flex; justify-content:flex-end; gap:.35rem; flex-wrap:wrap; }
.task-item-side { min-width:155px; color:var(--suau); font-size:.8rem; }
.task-item-side span { display:block; }
.task-item-side b { color:var(--tinta); font-weight:650; }
.task-item-open { width:38px; height:38px; display:grid; place-items:center; border-radius:10px;
                  border:1px solid var(--vora); color:var(--accent); text-decoration:none; font-size:1.2rem; font-weight:800; }
.task-item-open:hover { color:#fff; background:var(--accent); border-color:var(--accent); }
@media (max-width:980px) {
  .task-filter-grid { grid-template-columns:repeat(2,1fr); }
  .task-item { grid-template-columns:30px minmax(0,1fr) auto; }
  .task-item-tags { grid-column:2; justify-content:flex-start; }
  .task-item-side { grid-column:2; display:flex; gap:1rem; min-width:0; }
  .task-item-open { grid-column:3; grid-row:1 / span 3; }
}
@media (max-width:720px) {
  .tasks-topline { align-items:flex-start; }
  .task-overview { grid-template-columns:repeat(3,1fr); gap:.45rem; }
  .task-overview-card { min-height:84px; padding:.7rem; }
  .task-overview-card strong { font-size:1.55rem; }
  .task-overview-card span { font-size:.78rem; }
  .task-search-row { grid-template-columns:1fr auto; }
  .task-search-clear { grid-column:1 / -1; min-height:34px; padding:0; }
  .task-filter-grid { grid-template-columns:1fr; }
  .task-item { padding:.85rem .7rem; gap:.55rem; }
  .task-item-side { flex-direction:column; gap:.1rem; }
}



.alert-list { display:grid; gap:.75rem; }
.alert-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,auto); gap:1.1rem; padding:1.15rem;
              border:1px solid var(--vora); border-left:4px solid var(--avis); border-radius:15px; background:var(--fons); }
.alert-card-main h2 { margin:.45rem 0 .2rem; font-size:1.12rem; }
.alert-card-main > p { margin:.2rem 0 .65rem; }
.alert-card-main .fold-panel { margin:.8rem 0 0; box-shadow:none; }
.alert-card-actions { display:flex; flex-direction:column; align-items:stretch; justify-content:center; gap:.5rem; }
.alert-card-actions .action-form { display:grid; grid-template-columns:minmax(0,1fr) auto; }
@media (max-width:720px) {
  .alert-card { grid-template-columns:1fr; }
  .alert-card-actions { align-items:stretch; }
}

/* Jerarquia transversal: situació, decisió i acció abans que configuració */
.work-hero { display:flex; justify-content:space-between; gap:1.2rem; align-items:flex-end; margin:0 0 1.15rem; }
.work-hero h1 { font-size:clamp(1.8rem,3vw,2.35rem); margin:.15rem 0 .35rem; }
.work-kicker { color:var(--accent); font-size:.76rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; margin:0; }
.work-lead { color:var(--suau); font-size:1rem; margin:0; max-width:700px; }
.priority-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin:0 0 1.1rem; }
.priority-card { padding:1rem; border:1px solid var(--vora); border-radius:15px; background:var(--fons); box-shadow:0 5px 18px rgba(23,32,51,.04); }
.priority-card strong { display:block; font-size:1.65rem; line-height:1.1; }
.priority-card span { color:var(--suau); font-size:.84rem; }
.priority-card.attention { border-left:4px solid var(--perill); }
.priority-card.warning { border-left:4px solid var(--avis); }
.priority-card.ok { border-left:4px solid var(--ok); }
.situation-banner { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:1rem; align-items:center;
                    padding:1.15rem 1.25rem; margin:0 0 1rem; border:1px solid var(--vora);
                    border-radius:16px; background:var(--fons); box-shadow:var(--ombra); }
.situation-banner.critical { border-left:5px solid var(--perill); background:linear-gradient(90deg,#fff7f6,var(--fons) 45%); }
.situation-banner.warning { border-left:5px solid var(--avis); background:linear-gradient(90deg,#fffaf0,var(--fons) 45%); }
.situation-banner.ok { border-left:5px solid var(--ok); background:linear-gradient(90deg,#f2fbf5,var(--fons) 45%); }
.situation-icon { width:2.7rem; height:2.7rem; display:grid; place-items:center; border-radius:12px;
                  background:var(--accent-soft); color:var(--accent); font-size:1.25rem; font-weight:900; }
.situation-banner h2 { margin:0 0 .15rem; font-size:1.18rem; }
.situation-banner p { margin:0; color:var(--suau); }
.monitor-more { position:relative; flex:0 0 auto; }
.monitor-more > summary { min-height:40px; cursor:pointer; list-style:none; display:flex; align-items:center;
                          padding:.45rem .75rem; border:1px solid var(--vora); border-radius:999px;
                          color:var(--suau); font-weight:650; background:var(--fons); }
.monitor-more > summary::-webkit-details-marker { display:none; }
.monitor-more[open] > summary { border-color:var(--accent); color:var(--accent); }
.monitor-more-links { position:absolute; right:0; top:calc(100% + .4rem); z-index:15; min-width:220px;
                      display:grid; gap:.25rem; padding:.5rem; border:1px solid var(--vora); border-radius:12px;
                      background:var(--fons); box-shadow:0 16px 40px rgba(23,32,51,.14); }
.monitor-more-links .monitor-tab { justify-content:flex-start; border-radius:8px; }
.status-overview { display:grid; grid-template-columns:minmax(230px,.7fr) minmax(300px,1.3fr); gap:1.2rem; align-items:center;
                   padding:1rem 1.1rem; margin-bottom:.75rem; border:1px solid var(--vora); border-radius:14px; background:var(--caixa); }
.status-overview-copy b,.status-overview-copy span { display:block; }
.status-overview-copy span { margin-top:.3rem; color:var(--suau); font-size:.82rem; }
.legend-dot { display:inline-block; width:.55rem; height:.55rem; margin:0 .25rem 0 .45rem; border-radius:99px; background:var(--vora); }
.legend-dot:first-child { margin-left:0; }
.legend-dot.critical { background:var(--perill); }.legend-dot.warning { background:var(--avis); }.legend-dot.ok { background:var(--ok); }
.status-meter { display:grid; grid-auto-flow:column; grid-auto-columns:1fr; gap:.25rem; height:.7rem; }
.status-segment { min-width:.3rem; border-radius:99px; background:var(--vora); }
.status-segment.CRITICAL { background:var(--perill); }.status-segment.WARNING { background:var(--avis); }.status-segment.OK { background:var(--ok); }
.site-status-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.7rem; }
.site-status-card { display:flex; flex-direction:column; min-width:0; overflow:hidden;
                    padding:0; border:1px solid var(--vora); border-top:4px solid var(--vora); border-radius:15px; background:var(--fons);
                    color:var(--tinta); text-decoration:none; transition:.15s ease; }
.site-status-card.CRITICAL { border-top-color:var(--perill); }.site-status-card.WARNING { border-top-color:var(--avis); }.site-status-card.OK { border-top-color:var(--ok); }
.site-status-card:hover { border-color:var(--accent); transform:translateY(-1px); box-shadow:var(--ombra); }
.site-status-dot { width:.75rem; height:.75rem; border-radius:999px; background:var(--vora); }
.site-status-card.CRITICAL .site-status-dot { background:var(--perill); box-shadow:0 0 0 5px rgba(180,35,24,.09); }
.site-status-card.WARNING .site-status-dot { background:var(--avis); box-shadow:0 0 0 5px rgba(180,83,9,.09); }
.site-status-card.OK .site-status-dot { background:var(--ok); box-shadow:0 0 0 5px rgba(21,128,61,.09); }
.site-card-head { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.55rem; align-items:center; padding:.8rem .85rem .65rem; }
.site-card-head > b { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.site-card-head .etiqueta { font-size:.62rem; padding:.18rem .38rem; }
.site-card-kpis { display:grid; grid-template-columns:1fr 1fr; gap:.55rem; padding:0 .85rem .8rem; }
.site-kpi { min-width:0; padding:.65rem; border-radius:10px; background:var(--caixa); }
.site-kpi small,.site-kpi strong,.site-kpi em { display:block; }
.site-kpi small { color:var(--suau); font-size:.7rem; }
.site-kpi strong { margin:.12rem 0; font-size:1.13rem; line-height:1.15; white-space:nowrap; }
.site-kpi em { min-height:1rem; color:var(--suau); font-size:.68rem; font-style:normal; }
.site-kpi.latency-slow strong,.site-kpi.latency-slow em { color:var(--perill); }
.site-kpi.latency-watch strong,.site-kpi.latency-watch em { color:#9a4b08; }
.site-kpi progress,.performance-card progress { width:100%; height:.38rem; margin-top:.45rem; border:0; accent-color:var(--ok); }
.site-kpi.latency-slow progress { accent-color:var(--perill); }.site-kpi.latency-watch progress { accent-color:var(--avis); }
.site-card-foot { display:flex; justify-content:space-between; gap:.5rem; margin-top:auto; padding:.65rem .85rem;
                  border-top:1px solid var(--vora); color:var(--suau); font-size:.68rem; }
.site-card-foot b { color:var(--accent); white-space:nowrap; }
.performance-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; }
.performance-card { position:relative; min-height:138px; padding:1rem; overflow:hidden; border:1px solid var(--vora);
                    border-radius:15px; background:var(--fons); box-shadow:0 5px 18px rgba(23,32,51,.04); }
.performance-card .performance-icon { float:right; width:2.25rem; height:2.25rem; display:grid; place-items:center;
                                      border-radius:10px; background:var(--accent-soft); color:var(--accent); font-weight:900; }
.performance-card > span.qui,.performance-card > b,.performance-card > small { display:block; }
.performance-card > b { margin:.6rem 0 .15rem; font-size:1.8rem; letter-spacing:-.04em; }
.performance-card > small { color:var(--suau); }
.performance-card.latency-slow { border-top:4px solid var(--perill); }.performance-card.latency-watch { border-top:4px solid var(--avis); }
.performance-card.latency-slow > b,.performance-card.latency-slow > small { color:var(--perill); }
.performance-card.monitor-ok { border-top:4px solid var(--ok); }
.dashboard-alert { border-left:5px solid var(--avis); }
.dashboard-alert.CRITICAL { border-left-color:var(--perill); background:linear-gradient(90deg,#fff7f6,var(--fons) 38%); }
.task-audit-result { border-left:5px solid var(--avis); background:linear-gradient(90deg,#fffaf0,var(--fons) 45%); }
.task-audit-result.audit-OK { border-left-color:var(--ok); background:linear-gradient(90deg,#f2fbf5,var(--fons) 45%); }
.task-audit-result.audit-CRITICAL,.task-audit-result.audit-FAILED { border-left-color:var(--perill); background:linear-gradient(90deg,#fff7f6,var(--fons) 45%); }
.task-audit-result .audit-label { margin:0 0 .25rem; color:var(--suau); font-size:.78rem; font-weight:800;
                                 letter-spacing:.06em; text-transform:uppercase; }
.task-audit-result h2 { margin:0; font-size:1.25rem; }
.task-next.audit-next { border-color:#f2c894; background:linear-gradient(135deg,#fffaf0,var(--fons)); }
.task-summary-empty { color:var(--suau); font-weight:500 !important; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:1rem; margin:1.2rem 0 .65rem; }
.section-head h2 { margin:0; font-size:1.15rem; }
.section-head p { margin:.18rem 0 0; color:var(--suau); }
.fold-panel { border:1px solid var(--vora); border-radius:13px; background:var(--fons); margin:0 0 1rem; }
.fold-panel > summary { cursor:pointer; list-style:none; padding:.85rem 1rem; color:var(--suau); font-weight:700; }
.fold-panel > summary::-webkit-details-marker { display:none; }
.fold-panel > summary::after { content:"＋"; float:right; color:var(--accent); }
.fold-panel[open] > summary::after { content:"−"; }
.fold-body { padding:0 1rem 1rem; border-top:1px solid var(--vora); padding-top:1rem; }
.primary-form { max-width:820px; padding:1.25rem; border-radius:16px; }
.primary-form input[type="text"],.primary-form input[type="url"],.primary-form input[type="email"],
.primary-form input[type="tel"],.primary-form input[type="password"],.primary-form textarea { width:100%; min-height:46px; }
.primary-form textarea { min-height:120px; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.85rem; }
.form-grid .wide { grid-column:1/-1; }
.notif-list { display:grid; gap:.65rem; }
.notif-bulk { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem;
              margin:0 0 .75rem; padding:.8rem 1rem; border:1px solid var(--vora); border-radius:12px;
              background:var(--caixa); }
.notif-bulk-choice,.notif-select { display:flex; align-items:center; gap:.55rem; font-weight:700; }
.notif-bulk-choice input,.notif-select input { width:1.1rem; height:1.1rem; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
           clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.notif-item { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:1rem; padding:1rem 1.05rem;
              border:1px solid var(--vora); border-radius:14px; background:var(--fons); }
.notif-select { align-self:start; padding-top:.15rem; }
.notif-item.no-llegit { border-left:4px solid var(--accent); }
.notif-main h2 { margin:.2rem 0; font-size:1rem; }
.notif-meta { display:flex; flex-wrap:wrap; gap:.4rem .7rem; color:var(--suau); font-size:.8rem; }
.notif-summary { margin:.35rem 0 0; color:var(--tinta); }
.notif-actions { display:flex; flex-direction:column; align-items:flex-end; justify-content:center; gap:.45rem; }
.channel-grid { display:grid; gap:.55rem; }
.channel-row { display:grid; grid-template-columns:minmax(180px,.7fr) minmax(0,1.3fr); gap:1rem; align-items:center;
               padding:.85rem; border:1px solid var(--vora); border-radius:11px; }
.channel-options { display:flex; flex-wrap:wrap; gap:.45rem 1rem; }
.account-card { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
.account-card > div { padding:.8rem; border:1px solid var(--vora); border-radius:10px; background:var(--caixa); }
@media (max-width:720px) {
  .work-hero { align-items:flex-start; flex-direction:column; }
  .priority-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .form-grid,.account-card { grid-template-columns:1fr; }
  .situation-banner { grid-template-columns:auto minmax(0,1fr); }
  .situation-banner > :last-child { grid-column:2; justify-self:start; }
  .status-overview { grid-template-columns:1fr; }
  .site-status-grid,.performance-grid { grid-template-columns:1fr; }
  .channel-row { grid-template-columns:1fr; }
  .notif-item { grid-template-columns:auto minmax(0,1fr); }
  .notif-actions { grid-column:2; }
  .notif-actions { align-items:flex-start; }
}

@media (min-width:721px) and (max-width:1100px) {
  .site-status-grid,.performance-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:980px) {
  .app-shell { grid-template-columns:1fr; }
  .app-sidebar { top:64px; z-index:20; height:auto; padding:.45rem .7rem; border-right:0; border-bottom:1px solid var(--vora); }
  .app-nav { grid-template-columns:repeat(4,minmax(0,1fr)); gap:.25rem; }
  .app-nav a { grid-template-columns:auto 1fr auto; min-height:42px; padding:.35rem .5rem; }
  .app-nav-icon { width:1.7rem; height:1.7rem; }
  .sidebar-help { display:none; }
  .task-board { grid-template-columns:repeat(3,1fr); }
  .monitor-subnav { flex-direction:column; }
  .monitor-tabs { grid-template-columns:repeat(4,1fr); }
  .monitor-add { min-height:46px; }
}
@media (max-width:720px) {
  .task-actions { grid-template-columns:1fr; }
  .task-management { grid-template-columns:1fr; }
  .task-detail-shell { grid-template-columns:1fr; }
  .task-summary-panel { position:static; order:-1; }
  .task-summary-list div { grid-template-columns:88px 1fr; }
  .task-board { grid-template-columns:repeat(2,1fr); }
  .task-board-card { min-height:62px; }
  .app-main,.public-main { padding:.85rem; }
  .app-header { padding:.65rem .85rem; }
  .header-context,.header-user .qui { display:none; }
  .app-nav a { display:flex; flex-direction:column; justify-content:center; gap:.15rem; font-size:.72rem; }
  .app-nav .badge { position:absolute; margin:-1.55rem 0 0 1.65rem; }
  .dades { grid-template-columns:1fr; gap:.1rem; }
  .dades dd { margin-bottom:.5rem; }
  input,select,textarea,button { min-height:42px; font-size:16px; }
  .monitor-tabs { grid-template-columns:repeat(2,1fr); gap:.45rem; }
  .monitor-tab { min-height:50px; justify-content:flex-start; }
  .settings-subnav { grid-template-columns:1fr; }
  .settings-tab { justify-content:flex-start; }
}
footer { color:var(--suau); font-size:.8rem; padding:1rem 1.25rem;
         border-top:1px solid var(--vora); }



/* Portada operativa: menys soroll i estats que expliquen què passa */
.site-card-state {
  display:block; margin:-.15rem .85rem .7rem; color:var(--suau);
  font-size:.72rem; font-weight:700; line-height:1.25;
}
.site-kpi.latency-ok strong,.site-kpi.latency-ok em { color:var(--ok); }
.site-kpi.ssl-slow strong,.site-kpi.ssl-slow em { color:var(--perill); }
.site-kpi.ssl-watch strong,.site-kpi.ssl-watch em { color:#9a4b08; }
.site-kpi.ssl-slow progress { accent-color:var(--perill); }
.site-kpi.ssl-watch progress { accent-color:var(--avis); }
.performance-card.latency-ok { border-top:4px solid var(--ok); }
.performance-card.latency-watch > b,.performance-card.latency-watch > small { color:#9a4b08; }
.dashboard-alert h2 { font-size:1.05rem; line-height:1.3; }

/* Gestió massiva d'alertes: resolució reversible i historial intacte */
.bulk-alert-panel {
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.7rem 1rem;
  align-items:end; margin:0 0 .85rem; padding:.9rem 1rem;
  border:1px solid var(--vora); border-radius:14px; background:var(--caixa);
}
.bulk-alert-panel p {
  grid-column:1 / -1; margin:0; color:var(--suau); font-size:.78rem;
}
.bulk-alert-form { display:flex; flex-wrap:wrap; gap:.5rem; align-items:end; }
.bulk-alert-form label { width:100%; color:var(--suau); font-size:.74rem; font-weight:700; }
.bulk-alert-all { display:flex; align-items:end; }
.alert-card {
  grid-template-columns:auto minmax(0,1fr) minmax(230px,auto);
  align-items:start;
}
.alert-select {
  display:flex; flex-direction:column; align-items:center; gap:.2rem;
  padding-top:.15rem; color:var(--suau); font-size:.62rem; cursor:pointer;
}
.alert-select input { width:1.05rem; height:1.05rem; accent-color:var(--accent); }
.alert-select-spacer { width:1.05rem; }

@media (max-width:720px) {
  .bulk-alert-panel { grid-template-columns:1fr; align-items:stretch; }
  .bulk-alert-panel p { grid-column:1; }
  .bulk-alert-all,.bulk-alert-all button { width:100%; }
  .alert-card { grid-template-columns:auto minmax(0,1fr); }
  .alert-card-actions { grid-column:1 / -1; }
  .alert-select span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
}