/* Keep the logo from shrinking inside the sidebar's flex column. */
.login-panel>.brand-logo{height:auto;max-width:100%;object-fit:contain;flex-shrink:0}
@media(min-width:1101px){.app-shell .sidebar{overflow-y:auto;overflow-x:hidden}}
.app-shell .sidebar-logo{flex-shrink:0;min-height:112px;height:112px;padding:12px 18px;overflow:hidden}
.app-shell .sidebar-logo img{display:block;width:190px;max-width:100%;height:auto;max-height:86px;object-fit:contain;transform:none}
@media(max-width:1100px){
    .app-shell .sidebar-logo{min-height:52px;height:52px;padding:4px 0}
    .app-shell .sidebar-logo img{width:116px;max-width:100%;max-height:44px}
}
@media(max-width:720px){.app-shell .sidebar-logo img{width:92px}}
.login-password-field{display:grid;gap:8px}
.login-password-control{position:relative}
.login-password-control input{width:100%;padding-right:80px}
.login-password-control .password-visibility{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:auto;min-width:64px;min-height:44px;padding:8px 10px;border:0;background:transparent;color:#555a54;font:inherit;font-size:13px;cursor:pointer}
.login-password-control .password-visibility[hidden]{display:none}
.password-visibility:focus-visible{outline:2px solid #8a7964;outline-offset:-2px;border-radius:3px}

/* Equal project cards; shade only the text area so the photo stays visible. */
.page-dashboard .app-shell .project-list{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:18px}
.page-dashboard .app-shell .project-row{display:flex;flex-direction:column;padding-top:150px;min-height:380px;grid-column:auto;grid-row:auto}
.page-dashboard .app-shell .project-row::after{display:none}
.page-dashboard .app-shell .project-info{position:relative;inset:auto;margin-top:auto;width:100%;overflow-wrap:anywhere;padding:36px 22px 22px;background:linear-gradient(180deg,transparent,rgba(10,15,18,.78) 36px,rgba(10,15,18,.94))}
.page-dashboard .app-shell .project-info h3,
.page-dashboard .app-shell .project-info p,
.page-dashboard .app-shell .project-info>div:first-child small,
.page-dashboard .app-shell .project-progress>span,
.page-dashboard .app-shell .project-progress small,
.page-dashboard .app-shell .project-progress b,
.page-dashboard .app-shell .project-progress .percentage,
.page-dashboard .app-shell .project-progress .percentage__value,
.page-dashboard .app-shell .project-progress .percentage__mark{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.page-dashboard .app-shell .project-progress>span{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.page-dashboard .app-shell .project-progress{display:grid;width:100%}
.page-dashboard .app-shell .project-status{max-width:calc(100% - 36px)}
.page-dashboard .app-shell .project-status span{background:#f3f1ed;color:#303330;text-shadow:none;white-space:normal}

.page-dashboard .app-shell .project-thumb img{filter:none}
.page-dashboard .app-shell .project-row:first-child{grid-column:auto;grid-row:auto}
.page-dashboard .app-shell .project-row[hidden],
.page-dashboard .app-shell .project-row.list-item-collapsed{display:none}
@media(max-width:1100px){.page-dashboard .app-shell .project-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.page-dashboard .app-shell .project-list{grid-template-columns:1fr}}
/* Compact desktop directory: two rows within a standard desktop viewport. */
@media(min-width:1101px){
 .page-dashboard .app-shell .project-row{padding-top:60px;min-height:270px}
 .page-dashboard .app-shell .project-list{gap:14px}
 .page-dashboard .app-shell .project-info{padding:22px 16px 14px}
 .page-dashboard .app-shell .project-info h3{font-size:20px;line-height:1.4;margin:4px 0}
 .page-dashboard .app-shell .project-info p{font-size:14px;line-height:1.5;margin:4px 0}
 .page-dashboard .app-shell .project-info>div:first-child small{font-size:13px;line-height:1.5;letter-spacing:.08em}
 .page-dashboard .app-shell .project-progress{margin-top:8px;gap:4px}
 .page-dashboard .app-shell .project-progress small{font-size:14px;line-height:1.5}
 .page-dashboard .app-shell .project-status{top:12px;right:12px}
 .page-dashboard .app-shell .project-status span{padding:6px 12px}
}
/* Compact mobile cards while keeping all project text visible. */
@media(max-width:720px){
 .page-dashboard .app-shell .project-list{grid-auto-rows:auto;gap:14px}
 .page-dashboard .app-shell .project-row{padding-top:72px;min-height:270px}
 .page-dashboard .app-shell .project-info{padding:22px 16px 16px}
 .page-dashboard .app-shell .project-info h3{font-size:21px;line-height:1.4;margin:4px 0}
 .page-dashboard .app-shell .project-info p{font-size:15px;line-height:1.5;margin:4px 0}
 .page-dashboard .app-shell .project-info>div:first-child small{font-size:13px;line-height:1.5;letter-spacing:.07em}
 .page-dashboard .app-shell .project-progress{margin-top:10px;gap:4px}
 .page-dashboard .app-shell .project-progress small{font-size:14px;line-height:1.5}
 .page-dashboard .app-shell .project-status{top:12px;right:12px}
 .page-dashboard .app-shell .project-status span{padding:6px 12px}
}
/* Approved split card preview: unobstructed photo above a light information panel. */
.page-dashboard .app-shell .project-row{padding:0;min-height:0;background:#fff;color:#303330;border:1px solid #e3e0da}
.page-dashboard .app-shell .project-thumb{position:relative;inset:auto;z-index:auto;width:100%;height:140px;flex:0 0 140px}
.page-dashboard .app-shell .project-thumb img{width:100%;height:100%;object-fit:cover;object-position:center 65%;filter:none}
.page-dashboard .app-shell .project-info{margin:0;padding:12px 16px 14px;background:#fff;color:#303330;flex:1}
.page-dashboard .app-shell .project-info h3{font-size:20px;line-height:1.4;margin:3px 0 5px;color:#303330;text-shadow:none}
.page-dashboard .app-shell .project-info p,
.page-dashboard .app-shell .project-info>div:first-child small,
.page-dashboard .app-shell .project-progress>span,
.page-dashboard .app-shell .project-progress small,
.page-dashboard .app-shell .project-progress b,
.page-dashboard .app-shell .project-progress .percentage,
.page-dashboard .app-shell .project-progress .percentage__value,
.page-dashboard .app-shell .project-progress .percentage__mark{color:#56564f;text-shadow:none}
.page-dashboard .app-shell .project-info p{font-size:14px;line-height:1.5;margin:4px 0}
.page-dashboard .app-shell .project-info>div:first-child small{font-size:13px;letter-spacing:.06em}
.page-dashboard .app-shell .project-progress{margin-top:8px;gap:4px}
.page-dashboard .app-shell .project-status{position:static;padding:0 16px 12px;max-width:100%;justify-content:flex-end}
.page-dashboard .app-shell .project-status span{font-size:12px;padding:3px 9px;background:#f0eee8}
@media(max-width:720px){.page-dashboard .app-shell .project-thumb{height:140px;flex-basis:140px}}
.page-dashboard .app-shell .project-info .project-status{float:right;display:block;padding:0;margin:0 0 5px 8px}
.page-dashboard .app-shell .project-info h3{clear:both}
body .app-shell .project-hero{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);grid-template-rows:auto 1fr;min-height:320px;padding:24px 32px;margin:20px 0 0;gap:20px 30px;background:#fff;color:#303330;border:1px solid #e3e0da;border-radius:14px}
body .app-shell .project-hero-image{position:static;grid-column:2;grid-row:1 / 3;display:block;width:100%;height:300px;object-fit:contain;filter:none;align-self:center;background:#f5f4f0}
body .app-shell .project-hero-overlay{display:none}
body .app-shell .project-hero .hero-back{grid-column:1;grid-row:1;color:#69635b;font-size:14px;max-width:100%}
body .app-shell .project-hero-copy{grid-column:1;grid-row:2;align-self:center;min-width:0}
body .app-shell .project-hero-copy p{font-size:14px;color:#817366;letter-spacing:.08em}
body .app-shell .project-hero-copy h1{font-size:clamp(28px,3vw,42px);line-height:1.4;margin:10px 0;color:#303330;overflow-wrap:anywhere}
body .app-shell .project-hero-copy span{font-size:16px;color:#66625e;line-height:1.7}
@media(max-width:720px){
 body .app-shell .project-hero{grid-template-columns:1fr;padding:16px;gap:14px}
 body .app-shell .project-hero .hero-back{grid-column:1;grid-row:1}
 body .app-shell .project-hero-image{grid-column:1;grid-row:2;height:auto;max-height:240px}
 body .app-shell .project-hero-copy{grid-column:1;grid-row:3}
}
/* Fit desktop navigation without a visible scrollbar; retain scrolling on short screens. */
@media(min-width:1101px){
 body .app-shell .sidebar{padding:16px 20px;scrollbar-width:none;overflow-y:auto}
 body .app-shell .sidebar::-webkit-scrollbar{display:none}
 body .app-shell .sidebar-logo{margin:-16px -20px 0;height:94px;min-height:94px;padding:10px 18px}
 body .app-shell .sidebar-logo img{max-height:74px}
 body .app-shell .sidebar .portal-label{margin-top:16px;padding-top:0}
 body .app-shell .sidebar nav{margin-top:14px;gap:2px}
 body .app-shell .sidebar nav a{padding:8px 10px;min-height:42px;font-size:15px}
 body .app-shell .sidebar-user{padding:12px 0 6px}
 body .app-shell .sidebar .logout-button{min-height:36px;padding:6px 0;font-size:14px}
}
body.login-page .stack-form .remember-login{display:flex;align-items:center;gap:10px;font-size:15px;line-height:1.5;cursor:pointer;min-height:44px}
body.login-page .stack-form .remember-login input[type=checkbox]{width:20px;height:20px;min-height:20px;flex:0 0 20px;margin:0;padding:0;accent-color:#65615b}
.login-panel .remember-login span{overflow-wrap:anywhere}
.push-actions{display:flex;gap:12px;flex-wrap:wrap}.push-actions button{min-height:44px;white-space:normal}
.push-actions [hidden]{display:none!important}
.page-push .panel.stack-form{gap:18px;padding:28px;align-content:start}
.page-push .panel.stack-form>p,.page-push .panel.stack-form>h2{margin:0}
.page-push .push-actions:has(button:not([hidden])){margin:4px 0}
.page-push #push-status{padding:12px 16px;background:#f3f2ef;border-radius:8px}
@media(max-width:720px){.push-actions{flex-direction:column;align-items:stretch}}

