/* Projects: readable, neutral surfaces with one consistent information hierarchy.
   Typography is shared portal-wide; these rules define list and editor layout. */
:root #main :is(.projects-heading,.projects-section,.project-detail-heading,.project-editor){}
:root #main .projects-heading{display:flex!important;flex-wrap:wrap;align-items:center;gap:24px;margin-bottom:28px!important}
:root #main .projects-heading>div:first-child{margin-right:auto}
:root #main .projects-title{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
:root #main .projects-total{font-size:14px;font-weight:550;color:var(--im-muted)}
:root #main .projects-total strong{font-size:17px;font-weight:680;color:var(--im-ink)}
:root #main .projects-heading h1,:root #main .project-detail-heading h1{color:var(--im-ink)!important}
:root #main .projects-heading>.primary,:root #main .project-detail-heading>.primary{margin-left:0;min-height:46px;font-size:15px;padding:12px 20px}
:root #main .projects-heading .project-overview{order:10;flex:0 0 100%;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px;width:100%!important;max-width:none;overflow:visible;padding:0!important;margin:4px 0 0!important}
:root #main .projects-heading .overview-item{--overview-rgb:112,122,132;--overview-ink:var(--im-ink);display:flex!important;flex-direction:row;align-items:center;justify-content:flex-start;gap:12px;width:auto!important;min-width:0!important;max-width:none!important;height:72px!important;min-height:72px;padding:14px 16px!important;border:1px solid rgba(var(--overview-rgb),.24)!important;border-radius:10px!important;background:rgba(var(--overview-rgb),.055)!important;color:var(--im-ink)!important}
:root #main .projects-heading .overview-item:before,:root #main .projects-heading .overview-item:after{display:none!important}
:root #main .projects-heading .overview-item strong{font-size:28px!important;line-height:1!important;font-weight:720!important;letter-spacing:-.7px;align-self:center;color:var(--overview-ink)!important;font-variant-numeric:tabular-nums}
:root #main .projects-heading .overview-item>span{font-size:14px!important;line-height:1.2!important;font-weight:650!important;text-align:left!important;white-space:nowrap;color:var(--im-ink)!important}
:root #main .projects-heading .overview-all{--overview-rgb:22,119,255;--overview-ink:#1765c5}
:root #main .projects-heading .overview-active{--overview-rgb:22,119,255;--overview-ink:#1765c5}
:root #main .projects-heading .overview-completed{--overview-rgb:61,167,123;--overview-ink:#237a57}
:root #main .projects-heading .overview-churn{--overview-rgb:228,71,85;--overview-ink:#c23543}
:root #main .projects-heading .overview-pre-churn{--overview-rgb:235,143,72;--overview-ink:#b76325}
:root #main .projects-heading .overview-stalled{--overview-rgb:202,153,42;--overview-ink:#86620e}
:root[data-theme=dark] #main .projects-heading .overview-all{--overview-ink:#8fbeff}
:root[data-theme=dark] #main .projects-heading .overview-active{--overview-ink:#8fbeff}
:root[data-theme=dark] #main .projects-heading .overview-completed{--overview-ink:#82d3ae}
:root[data-theme=dark] #main .projects-heading .overview-churn{--overview-ink:#ff919c}
:root[data-theme=dark] #main .projects-heading .overview-pre-churn{--overview-ink:#f6b57f}
:root[data-theme=dark] #main .projects-heading .overview-stalled{--overview-ink:#f1ce77}
:root #main .projects-section>.filters{display:grid;grid-template-columns:minmax(200px,1.5fr) repeat(3,minmax(130px,1fr)) auto;gap:6px;background:var(--im-surface-muted)!important;border:1px solid var(--im-border)!important;padding:6px!important;border-radius:12px!important}
:root #main .projects-section .filters :is(.search,.select-trigger,select,.sort-trigger,.filter-reset){height:46px!important;min-height:46px;font-size:15px!important}
:root #main .projects-section .search input{font-size:15px!important}
:root #main .projects-section>.results-meta{margin:22px 0 14px;font-size:14px;color:var(--im-muted)!important}
:root #main .projects-section .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));align-items:stretch;gap:20px}
:root #main .project-card.compact-project{display:flex;flex-direction:column;gap:0;padding:24px!important;min-height:0;border:1px solid var(--im-border)!important;border-radius:12px!important;background:var(--im-surface)!important;color:var(--im-ink)!important;box-shadow:none!important;text-decoration:none;transition:border-color .15s ease!important}
:root #main .project-card.compact-project:hover{border-color:var(--im-border-strong)!important;background:var(--im-surface)!important;transform:none!important}
:root #main .project-card.compact-project:focus-visible{outline:2px solid var(--im-accent);outline-offset:3px}
:root #main .compact-project:before,:root #main .compact-project:after{display:none!important}
:root #main .compact-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 18px;min-height:26px}
:root #main .compact-card-top .reference-number{font-size:14px;font-weight:550;color:var(--im-muted)!important}
:root #main :is(.compact-project,.project-detail-heading) .badge{font-size:13px!important;line-height:1.3!important;font-weight:650!important;padding:5px 9px!important;border:0!important;border-radius:5px!important;background:rgba(var(--state-rgb),.12)!important;color:var(--state-ink)!important;white-space:nowrap}
:root #main .project-identity{margin-bottom:24px}
:root #main .project-identity h3{display:block;margin:0 0 10px!important;font-size:24px!important;font-weight:700!important;line-height:1.25!important;letter-spacing:-.5px!important;min-height:0!important;color:var(--im-ink)!important;overflow-wrap:anywhere;-webkit-line-clamp:unset}
:root #main .compact-project .location{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;min-height:22px;margin:0!important;font-size:15px!important;line-height:1.4;color:var(--im-muted)!important}
:root #main .compact-project .location .icon{width:16px;height:16px;flex:none;color:var(--im-muted)!important}
:root #main .compact-project .project-region{border-left:1px solid var(--im-border);padding-left:8px;color:var(--im-muted)!important}
:root #main .compact-project .card-people{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 24px!important;padding:0!important;border:0!important;background:transparent!important;min-height:0}
:root #main .card-people>div{display:block;min-width:0;margin:0;padding:0;border:0!important}
:root #main .card-people dt{font-size:13px;font-weight:500;line-height:1.3;margin:0 0 6px;color:var(--im-muted)}
:root #main .card-people dd{font-size:16px;font-weight:650;line-height:1.4;margin:0;color:var(--im-ink);overflow-wrap:anywhere}
:root #main .compact-project .compact-date{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 24px!important;padding:15px 0!important;border:0!important;border-top:1px solid var(--im-border)!important;border-bottom:1px solid var(--im-border)!important;min-height:0!important;background:transparent!important}
:root #main .compact-date>div{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
:root #main .compact-date>div>span{font-size:13px!important;color:var(--im-muted)!important}
:root #main .compact-date strong{font-size:17px!important;font-weight:650!important;line-height:1.3;color:var(--im-ink)!important}
:root #main .compact-date .project-time{font-size:15px;color:var(--im-muted)}
:root #main .compact-date .due-tag{padding:4px 7px;border-radius:5px;background:var(--im-surface-muted)!important;color:var(--im-ink)!important;font-size:12px;white-space:nowrap}
:root #main .compact-project .card-tracks{display:grid;gap:16px;margin:0!important;padding:0!important}
:root #main .compact-project .card-track-row{display:grid;grid-template-columns:1fr auto;gap:7px 12px;align-items:baseline}
:root #main .compact-project .track-caption{font-size:14px!important;font-weight:500!important;line-height:1.2;color:var(--im-muted)!important}
:root #main .compact-project .card-track-row>strong{font-size:14px!important;font-weight:600!important;line-height:1.2;color:var(--im-ink)!important}
:root #main .compact-project .card-track{display:flex;grid-column:1/-1;gap:4px;height:4px!important;margin:0!important}
:root #main .compact-project .card-track>span{flex:1;height:4px!important;border:0;background:var(--im-surface-muted)!important;border-radius:3px}
:root #main .compact-project .card-track>.filled{background:#6892c4!important}
:root #main .compact-project .is-ready .card-track>.filled{background:#49a580!important}
:root #main .compact-project .compact-alert{display:flex;align-items:flex-start;gap:8px;margin:20px 0 0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;font-size:13px!important;font-weight:550;line-height:1.5;color:#c93445!important}
:root #main .compact-project .compact-alert .icon{width:15px;height:15px;flex:none;margin-top:2px;color:#c93445!important}
:root[data-theme=dark] #main .compact-project .compact-alert,:root[data-theme=dark] #main .compact-project .compact-alert .icon{color:#ff8b98!important}
:root #main .imported-caption{font-size:13px;color:var(--im-muted)}
:root #main .project-status-archive{--section-rgb:112,122,132;--section-ink:var(--im-muted);margin-top:14px;border:1px solid rgba(var(--section-rgb),.24)!important;border-radius:10px;background:rgba(var(--section-rgb),.045)!important;overflow:hidden}
:root #main .project-status-active{--section-rgb:22,119,255;--section-ink:#1765c5;margin-top:22px}
:root #main .project-status-installed{--section-rgb:61,167,123;--section-ink:#237a57}
:root #main .project-status-stalled{--section-rgb:202,153,42;--section-ink:#86620e}
:root #main .project-status-prechurn{--section-rgb:235,143,72;--section-ink:#b76325}
:root #main .project-status-churn{--section-rgb:228,71,85;--section-ink:#c23543}
:root #main .project-status-archive>summary{min-height:64px;padding:18px 22px!important;font-size:17px!important}
:root #main .project-status-archive>summary strong{font-size:17px!important;font-weight:650!important}
:root #main .project-status-archive>summary .icon{color:var(--section-ink)!important}
:root #main .project-status-archive .archive-count{font-size:14px!important;margin-left:8px;padding:3px 8px;border-radius:5px;background:rgba(var(--section-rgb),.12)!important;color:var(--section-ink)!important}
:root #main .project-status-archive .archive-content{padding:0 20px 20px}
:root[data-theme=dark] #main .project-status-active{--section-ink:#8fbeff}
:root[data-theme=dark] #main .project-status-installed{--section-ink:#82d3ae}
:root[data-theme=dark] #main .project-status-stalled{--section-ink:#f1ce77}
:root[data-theme=dark] #main .project-status-prechurn{--section-ink:#f6b57f}
:root[data-theme=dark] #main .project-status-churn{--section-ink:#ff919c}

/* Detail/editor: aligned panels, legible field values, quieter explanations. */
:root #main .back-link:has(+.project-detail-heading){font-size:14px;margin-bottom:24px;padding:8px 0;border:0!important;background:transparent!important;color:var(--im-muted)!important}
:root #main .project-detail-heading{display:flex;gap:24px;align-items:flex-start;margin-bottom:32px}
:root #main .project-detail-heading>div{min-width:0;flex:1}
:root #main .project-detail-heading h1{margin:0 0 16px;overflow-wrap:anywhere}
:root #main .project-detail-heading .detail-meta{gap:12px 20px;font-size:16px;line-height:1.5}
:root #main .project-detail-heading .detail-location{font-size:16px;color:var(--im-muted)!important}
:root #main .project-detail-heading .project-id{font-size:14px;color:var(--im-muted)!important}
:root #project-form .information-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(350px,1fr);gap:24px!important;align-items:start}
:root #project-form .detail-main{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:24px;min-width:0}
:root #project-form .detail-main>.panel{grid-column:1!important;grid-row:auto!important}
:root #project-form .panel{padding:28px!important;margin:0!important;border-radius:12px!important;border:1px solid var(--im-border)!important;background:var(--im-surface)!important}
:root #project-form :is(.panel-title,.advancement-heading){display:flex;gap:0;min-height:0;margin:0 0 28px!important;padding:0!important;align-items:center;border:0!important}
:root #project-form .section-icon{display:none}
:root #project-form :is(.panel-title,.advancement-heading) h2{font-size:22px!important;line-height:1.3!important;font-weight:700!important;letter-spacing:-.4px!important;margin:0;color:var(--im-ink)!important}
:root #project-form .fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 20px}
:root #project-form .field{gap:8px;min-width:0}
:root #project-form .field>span{font-size:14px!important;font-weight:600!important;line-height:1.4;color:var(--im-muted)!important}
:root #project-form :is(.field input,.field textarea,.field select,.select-trigger){font-size:16px!important;font-weight:500!important;line-height:1.4;min-height:48px;height:48px;padding:11px 13px;color:var(--im-ink)!important;-webkit-text-fill-color:var(--im-ink)!important;border:1px solid var(--im-border)!important;border-radius:7px!important;background:var(--im-surface)!important;opacity:1}
:root #project-form .field input{width:100%;min-width:0}
:root #project-form.is-viewing :is(.field input,.field select,.select-trigger){background:var(--im-surface-muted)!important;border-color:transparent!important;font-weight:600!important;color:var(--im-ink)!important;-webkit-text-fill-color:var(--im-ink)!important;opacity:1}
:root #project-form.is-editing :is(.field input:disabled,.field input[readonly],.select-trigger:disabled){background:var(--im-surface-muted)!important;color:var(--im-muted)!important;-webkit-text-fill-color:var(--im-muted)!important}
:root #project-form .field input:focus-visible,:root #project-form .select-trigger:focus-visible{outline:2px solid var(--im-accent)!important;outline-offset:-2px;box-shadow:none!important}
:root #project-form .frozen-label{font-size:11px;font-weight:500;padding:2px 5px;line-height:1.2}
:root #project-form :is(.field small,.field-hint){font-size:13px!important;line-height:1.5;color:var(--im-muted)!important}
:root #project-form .field-hint{margin-top:20px}
:root #project-form .project-help{margin-top:24px;border-top:1px solid var(--im-border);padding-top:18px;color:var(--im-muted);font-size:13px;line-height:1.5}
:root #project-form .project-help summary{cursor:pointer;font-weight:500}
:root #project-form .project-help p{margin:10px 0 0}
:root #project-form .advancement{height:auto;align-self:start}
:root #project-form .advancement-row{display:block;padding:24px 0!important;margin:0;border:0;border-top:1px solid var(--im-border)!important}
:root #project-form .advancement-row:first-of-type{border-top:0!important;padding-top:0!important}
:root #project-form .advancement-row:last-child{padding-bottom:0!important}
:root #project-form .advancement-label{display:flex;align-items:center;gap:10px;margin:0 0 16px}
:root #project-form .advancement-label h3{font-size:17px!important;font-weight:650!important;line-height:1.3;flex:1;margin:0;color:var(--im-ink)!important}
:root #project-form .row-summary{font-size:13px;color:var(--im-muted)!important;white-space:nowrap}
:root #project-form .progress-info>summary{width:20px;height:20px;font-size:12px}
:root #project-form .check-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
:root #project-form .check-track .stage{display:flex;flex-direction:column;gap:10px;text-align:left;align-items:flex-start;padding:0 0 4px;min-height:52px;border:0!important;border-radius:0;background:transparent!important;opacity:1}
:root #project-form .check-track .track-line{width:100%;height:4px;margin:0;background:var(--im-surface-muted)!important;border-radius:3px}
:root #project-form .check-track .checked .track-line{background:#49a580!important}
:root #project-form .check-track .stage-name{font-size:14px!important;line-height:1.4;font-weight:500;color:var(--im-muted)!important}
:root #project-form .check-track .checked .stage-name{color:var(--im-ink)!important;font-weight:600}
:root #project-form.is-editing .check-track .stage:not(:disabled):hover .stage-name{color:var(--im-ink)!important;text-decoration:underline;text-underline-offset:3px}
:root #project-form .compact-state>summary{font-size:16px!important;min-height:50px;padding:12px 14px!important;border:1px solid var(--im-border)!important;border-radius:7px!important;background:var(--im-surface)!important;color:var(--im-ink)!important}
:root #project-form .compact-current{font-size:16px!important;font-weight:600}
:root #project-form .state-options button{font-size:15px!important;min-height:44px;padding:10px 12px}
:root #project-form :is(.progress-warning,.choice-hint){font-size:13px!important;line-height:1.5}
:root #project-form .progress-warning{display:flex;align-items:flex-start;gap:8px;margin:10px 0 0!important;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;color:#c93445!important;box-shadow:none!important}
:root #project-form .progress-warning .icon{width:16px;height:16px;flex:0 0 16px;margin-top:2px;color:currentColor!important}
:root[data-theme=dark] #project-form .progress-warning{background:transparent!important;border:0!important;color:#ff8b98!important}
:root #project-form .save-bar{margin-top:24px;padding:16px 20px;gap:16px}
:root #project-form .save-bar>span{font-size:15px;font-weight:600}
:root #project-form .save-bar small{font-size:13px;font-weight:400;margin-top:4px}
:root #project-form .save-bar button{min-height:46px;padding:12px 20px;font-size:15px}
@media(min-width:1700px){:root #main .projects-section .cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1200px){:root #main .projects-section>.filters{grid-template-columns:minmax(180px,1.4fr) repeat(2,minmax(140px,1fr))}:root #main .projects-section .filters .sort-control{justify-self:stretch}:root #main .projects-section .sort-trigger{width:100%}:root #project-form .information-layout{grid-template-columns:1fr}:root #main .projects-heading .overview-item{padding:16px!important}}
@media(max-width:760px){:root #main .projects-heading{gap:18px}:root #main .projects-heading .project-overview{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px}:root #main .projects-heading .overview-item{height:64px!important;min-height:64px;gap:8px;padding:12px!important}:root #main .projects-heading .overview-item strong{font-size:25px!important}:root #main .projects-heading .overview-item>span{font-size:12px!important}:root #main .projects-section>.filters{grid-template-columns:1fr 1fr}:root #main .projects-section .filters .search{grid-column:1/-1}:root #main .projects-section .cards{grid-template-columns:1fr}:root #main .project-card.compact-project{padding:22px!important}:root #main .project-detail-heading{flex-wrap:wrap;gap:18px}:root #main .project-detail-heading>div{flex-basis:100%}:root #project-form .panel{padding:22px!important}:root #project-form .fields{gap:20px;grid-template-columns:1fr}:root #project-form .panel h2{font-size:21px!important}:root #project-form .save-bar{flex-wrap:wrap}:root #project-form .save-bar>div{width:100%;display:flex}:root #project-form .save-bar button{flex:1;padding:12px}:root #main .project-status-archive .archive-content{padding:0 10px 10px}}
@media(prefers-reduced-motion:reduce){:root #main .project-card.compact-project{transition:none!important}}

:root #project-form .mini-status>.filled{background:#6892c4!important}
:root #project-form .mini-status.alternate>.filled{background:#49a580!important}
:root #project-form .calendar-control input{padding-right:40px}
:root #project-form .calendar-trigger{top:6px}

:root #project-form .mini-status.alternate>span{background:#49a580!important}
@supports(grid-template-rows:subgrid){
  :root #main .projects-section .cards{row-gap:0}
  :root #main .project-card.compact-project{display:grid;grid-row:span 6;grid-template-rows:subgrid;row-gap:0;margin-bottom:20px}
  :root #main .compact-project :is(.compact-card-top,.project-identity,.card-people,.compact-date,.card-tracks,.compact-alert){align-self:start}
  :root #main .compact-project .compact-alert{margin-bottom:0!important}
}

:root #main .projects-section .filters>*{grid-column:auto!important;grid-row:auto!important;min-width:0}
:root #main .projects-section .filters :is(.search,.select-trigger,select,.sort-trigger,.filter-reset){background:var(--im-surface)!important;border-color:transparent!important;color:var(--im-ink)!important;box-shadow:none!important}
:root #main .projects-section .filters :is(.search,.select-trigger,.sort-trigger,.filter-reset):hover{background:var(--im-surface-raised)!important;border-color:var(--im-border)!important}
:root #main .projects-section .filters :is(.search:focus-within,.select-trigger:focus-visible,.select-trigger[aria-expanded=true],.sort-trigger:focus-visible,.filter-reset:focus-visible){outline:2px solid var(--im-accent)!important;outline-offset:-2px!important;border-color:transparent!important;box-shadow:none!important}
:root #main .projects-section .filters .select-trigger.has-selection{background:rgba(22,119,255,.09)!important;color:#1765c5!important}
:root[data-theme=dark] #main .projects-section .filters .select-trigger.has-selection{background:rgba(22,119,255,.14)!important;color:#92c1ff!important}
:root #main .projects-section .filters .filter-reset:disabled{background:transparent!important;border-color:transparent!important;opacity:.35}
:root #main .project-filter-actions{display:flex;gap:8px}
:root #main .project-filter-actions .sort-control{flex:1;min-width:0}
:root #main .project-filter-actions .filter-reset{flex:0 0 46px;width:46px}
@media(max-width:1200px){:root #main .projects-section .filters>.search{grid-column:1/-1!important}:root #main .projects-section .filters{grid-template-columns:repeat(3,minmax(0,1fr))}:root #main .project-filter-actions{grid-column:2/-1!important;justify-self:end}}
@media(max-width:760px){:root #main .projects-section .filters{grid-template-columns:repeat(2,minmax(0,1fr))}:root #main .project-filter-actions{grid-column:auto!important;justify-self:stretch}:root #main .project-filter-actions .sort-trigger{padding:10px;font-size:14px!important;gap:5px}}
@media(max-width:480px){
 :root #main .projects-heading .project-overview{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}