@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap');
:root{--bg:#09090c;--bg-soft:#101115;--surface:rgba(255,255,255,.04);--line:rgba(255,255,255,.08);--line-strong:rgba(255,255,255,.12);--text:#f5f5f7;--text-soft:#b7b9c3;--text-muted:#888b95;--accent:#ffcc00;--accent-2:#ff9900;--shadow:0 24px 54px rgba(0,0,0,.35);--shell-max:1720px;--border:rgba(255,255,255,.08);--search-bg:rgba(255,255,255,.04);--topbar:rgba(10,10,10,.9)}
html[data-theme="light"]{--bg:#f3f4f7;--bg-soft:#ededf1;--surface:rgba(255,255,255,.95);--line:rgba(18,20,28,.08);--line-strong:rgba(18,20,28,.14);--text:#11141b;--text-soft:#555d6d;--text-muted:#73798a;--shadow:0 18px 40px rgba(18,20,28,.08);--border:rgba(0,0,0,.08);--search-bg:rgba(0,0,0,.03);--topbar:rgba(255,255,255,.92)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'Montserrat',sans-serif;min-height:100vh;color:var(--text);background:radial-gradient(circle at top right,rgba(255,153,0,.08),transparent 18%),radial-gradient(circle at 12% 10%,rgba(255,204,0,.06),transparent 16%),var(--bg);transition:background .25s ease,color .25s ease}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{border:0;background:none}img{max-width:100%;display:block}::selection{background:rgba(255,204,0,.86);color:#111}
.eyebrow,.section-chip{display:inline-flex;align-items:center;gap:.45rem;width:max-content;min-height:36px;padding:0 .95rem;border-radius:999px;border:1px solid var(--line-strong);font-size:.73rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--text-soft);background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02))}
html[data-theme="light"] .eyebrow,html[data-theme="light"] .section-chip{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.92))}
h1,h2,h3,h4,p{margin-top:0}p{color:var(--text-soft);line-height:1.65}
.button,.topbar-button{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:48px;padding:.9rem 1.2rem;border-radius:999px;border:1px solid transparent;transition:transform .22s ease,background .22s ease,border-color .22s ease,color .22s ease,box-shadow .22s ease;cursor:pointer;font-weight:700}
.button:hover,.topbar-button:hover{transform:translateY(-2px)}.button-primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#111;box-shadow:0 12px 24px rgba(255,204,0,.18)}.button-secondary,.button-ghost,.topbar-button,.theme-toggle,.filter-pill{background:rgba(255,255,255,.04);border-color:var(--line-strong)}html[data-theme="light"] .button-secondary,html[data-theme="light"] .button-ghost,html[data-theme="light"] .topbar-button,html[data-theme="light"] .theme-toggle,html[data-theme="light"] .filter-pill{background:rgba(255,255,255,.9)}.button-ghost{color:var(--text-soft)}
.badge{display:inline-flex;align-items:center;justify-content:center;padding:.42rem .78rem;border-radius:999px;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;border:1px solid transparent}
.badge.in-progress,.badge.internal-review,.badge.healthy,.badge.on-track,.badge.approved,.badge.done{color:#ddfff0;background:rgba(44,207,134,.12);border-color:rgba(44,207,134,.28)}.badge.awaiting-client,.badge.pending-internal,.badge.ready-for-approval,.badge.changes-requested,.badge.attention,.badge.planned{color:#fff2d0;background:rgba(255,181,71,.14);border-color:rgba(255,181,71,.28)}.badge.blocked,.badge.urgent,.badge.rejected,.badge.cancelled{color:#ffd7df;background:rgba(255,93,124,.12);border-color:rgba(255,93,124,.28)}
.app-shell{width:min(100%,var(--shell-max));margin:0 auto;display:grid;grid-template-columns:276px minmax(0,1fr);min-height:100vh}
.app-sidebar{
    position:sticky;top:0;height:100vh;padding:18px 16px;border-right:1px solid var(--line);
    background:color-mix(in srgb,var(--bg) 92%,#000 8%);
    display:flex;flex-direction:column;gap:20px
}
html[data-theme="light"] .app-sidebar{background:#ececef}
.sidebar-brand-card,.sidebar-announcement-card,.app-topbar,.hero-strip,.page-head-row,.panel,.stat-card,.project-card,.filter-pill,.topbar-search,.user-pill{
    border:1px solid var(--line);
    background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));
    box-shadow:var(--shadow);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px)
}
html[data-theme="light"] .sidebar-brand-card,
html[data-theme="light"] .sidebar-announcement-card,
html[data-theme="light"] .app-topbar,
html[data-theme="light"] .hero-strip,
html[data-theme="light"] .page-head-row,
html[data-theme="light"] .panel,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .project-card,
html[data-theme="light"] .filter-pill,
html[data-theme="light"] .topbar-search,
html[data-theme="light"] .user-pill{
    background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.9))
}
.sidebar-brand-card{
    display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:22px;
    min-height:84px
}
.sidebar-brand-mark{
    width:54px;height:54px;border-radius:16px;overflow:hidden;display:flex;align-items:center;justify-content:center;
    background:rgba(255,204,0,.12);border:1px solid rgba(255,204,0,.18);padding:8px
}
.sidebar-brand-mark img{width:100%;height:100%;object-fit:contain}
.sidebar-brand-copy{display:grid;gap:4px}
.sidebar-brand-copy strong{font-size:1.18rem;line-height:1.1;max-width:150px}
.sidebar-brand-copy .eyebrow{min-height:30px;padding:0 .78rem;font-size:.64rem}
.sidebar-close,.sidebar-toggle{
    width:44px;height:44px;border-radius:14px;border:1px solid var(--line-strong);color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer
}
.sidebar-close{margin-left:auto;display:none}
.sidebar-nav{display:grid;gap:10px}
.sidebar-nav a{
    display:flex;align-items:center;gap:14px;min-height:56px;padding:0 16px;border-radius:18px;
    color:var(--text-soft);font-weight:700;transition:background .22s ease,color .22s ease,transform .22s ease,border-color .22s ease, box-shadow .22s ease;
    border:1px solid transparent
}
.sidebar-nav a:hover{
    background:rgba(255,255,255,.045);
    color:var(--text);
    border-color:var(--line)
}
.sidebar-nav a.is-active{
    background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));
    color:var(--text);
    border-color:var(--line);
    box-shadow:0 16px 30px rgba(0,0,0,.16)
}
html[data-theme="light"] .sidebar-nav a:hover{background:rgba(255,255,255,.82)}
html[data-theme="light"] .sidebar-nav a.is-active{
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.92));
    border-color:rgba(17,20,27,.08);
    box-shadow:0 10px 20px rgba(17,20,27,.06)
}
.sidebar-nav-icon{
    width:28px;height:28px;flex:0 0 28px;display:flex;align-items:center;justify-content:center;
    color:var(--text-muted)
}
.sidebar-announcement-card{
    margin-top:auto;padding:18px 16px;border-radius:22px;display:grid;gap:14px
}
.sidebar-announcement-body{display:flex;gap:12px;align-items:flex-start}
.sidebar-announcement-icon{
    width:42px;height:42px;border-radius:14px;flex:0 0 42px;display:flex;align-items:center;justify-content:center;
    background:rgba(255,204,0,.14);color:var(--accent)
}
.sidebar-announcement-copy{display:grid;gap:6px}
.sidebar-announcement-copy strong{font-size:1.02rem;line-height:1.35}
.sidebar-announcement-copy p{margin:0;font-size:.92rem;color:var(--text-soft);line-height:1.6}
.sidebar-announcement-dots{display:flex;gap:8px}
.sidebar-announcement-dot{width:10px;height:10px;border-radius:999px;background:rgba(255,255,255,.12);border:0;cursor:pointer;transition:transform .2s ease,background .2s ease}
.sidebar-announcement-dot.is-active{background:var(--accent);transform:scale(1.1)}
.sidebar-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;visibility:hidden;pointer-events:none;transition:.22s ease;z-index:28}.app-main{min-width:0;display:flex;flex-direction:column}.app-topbar{position:sticky;top:0;z-index:20;min-height:102px;padding:18px 28px;border-radius:0;border-left:0;border-right:0;display:flex;align-items:center;justify-content:space-between;gap:16px}
.topbar-left,.topbar-right,.topbar-search,.user-pill,.hero-strip-actions,.page-head-row,.panel-head,.progress-inline,.progress-labels,.project-card-head,.project-card-actions,.stack-meta{display:flex;align-items:center;gap:14px}.topbar-left h2{margin:10px 0 0;font-size:3rem;line-height:1;letter-spacing:-.03em}.topbar-right{justify-content:flex-end;flex-wrap:wrap}.topbar-search{min-width:260px;flex:1 1 280px;max-width:380px;min-height:58px;padding:0 18px;border-radius:20px}.topbar-search i{color:var(--text-muted)}.topbar-search input{width:100%;border:0;background:transparent;color:var(--text);outline:none}.topbar-search input::placeholder{color:var(--text-muted)}.theme-toggle,.topbar-button{min-height:58px;padding:0 18px;border-radius:18px;border:1px solid var(--line);color:var(--text)}.user-pill{min-height:58px;padding:8px 14px;border-radius:20px}.user-avatar{width:42px;height:42px;border-radius:999px;overflow:hidden;flex:0 0 42px;display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,204,0,.5);background:rgba(255,204,0,.1)}.user-avatar img{width:100%;height:100%;object-fit:cover}.user-pill strong{display:block}.user-pill small{color:var(--text-soft)}
.app-content{padding:30px 28px 34px;display:grid;gap:22px}.hero-strip,.page-head-row,.panel,.stat-card,.project-card{border-radius:28px;padding:22px}.hero-strip{justify-content:space-between;align-items:flex-end;gap:18px}.hero-strip h3,.page-head-row h3{margin:14px 0 10px;font-size:2.4rem;line-height:1.05;letter-spacing:-.03em;max-width:820px}.hero-strip p{max-width:780px;margin-bottom:0}.stats-grid,.content-grid,.project-card-grid{display:grid;gap:18px}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.content-grid,.content-grid-lg{grid-template-columns:repeat(3,minmax(0,1fr))}.panel-span-2{grid-column:span 2}.project-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-card h3{font-size:2.2rem;margin:18px 0 8px}.panel-head{justify-content:space-between;align-items:flex-start;margin-bottom:18px}.panel-head h3{margin:10px 0 0;font-size:1.55rem}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:680px}th,td{padding:16px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-weight:800}td strong{display:block;margin-bottom:4px}td small,.timeline-item span,.stack-item p,.project-card p,.info-list small,.shortcut-card span{color:var(--text-soft)}
.stack-list,.timeline-list{display:grid;gap:12px}.stack-item,.timeline-item,.shortcut-card,.filter-pill{border-radius:18px;padding:16px}.stack-item strong,.shortcut-card strong{display:block;margin-bottom:6px}.timeline-item:not(.timeline-item--project){display:flex;flex-wrap:wrap;align-items:flex-start;column-gap:.35em;row-gap:.2rem}.timeline-item:not(.timeline-item--project)>strong{display:inline;margin:0}.stack-meta{justify-content:space-between}.shortcut-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.shortcut-card{min-height:120px}.progress-block{display:grid;gap:10px}.progress-labels{justify-content:space-between}.progress-bar{width:100%;height:12px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.06);border:1px solid var(--line)}html[data-theme="light"] .progress-bar{background:rgba(17,20,27,.06)}.progress-bar span{display:block;height:100%;border-radius:999px;background:linear-gradient(135deg,var(--accent),var(--accent-2))}
.project-card-head{justify-content:space-between;align-items:flex-start}.project-card-head h3{margin:10px 0 0;font-size:1.34rem}.project-card-meta,.info-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.project-card-meta small,.info-list small{display:block;margin-bottom:6px;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em}.info-list strong{display:block}.filters-bar{display:flex;gap:10px;flex-wrap:wrap}.filter-pill{min-height:46px;border-radius:999px;padding:0 16px;font-weight:700;cursor:pointer}.filter-pill.active{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#111;border-color:transparent}.text-link{color:var(--accent);font-weight:700}.app-footer{padding:0 28px 28px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--text-muted);font-size:.9rem}
.panel,.stat-card,.project-card,.hero-strip,.page-head-row{opacity:1;transform:none;transition:opacity .45s ease,transform .45s ease}.panel.is-revealed,.stat-card.is-revealed,.project-card.is-revealed,.hero-strip.is-revealed,.page-head-row.is-revealed{opacity:1;transform:none}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px}.auth-card{width:min(100%,480px);border:1px solid var(--line);border-radius:32px;padding:28px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));box-shadow:var(--shadow);display:grid;gap:18px}html[data-theme="light"] .auth-card{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.92))}.auth-brand{display:flex;align-items:center;gap:12px}.auth-brand img{width:54px;height:54px;border-radius:16px}.auth-card h1{margin:0;font-size:2rem}.auth-form{display:grid;gap:14px}.auth-form label{display:grid;gap:8px;font-weight:700}.auth-form input{min-height:54px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);padding:0 16px;outline:none}html[data-theme="light"] .auth-form input{background:rgba(255,255,255,.94)}.auth-note{font-size:.92rem;color:var(--text-soft)}
@media (max-width:1280px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.content-grid,.content-grid-lg,.project-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.panel-span-2{grid-column:span 2}.topbar-left h2{font-size:2.5rem}}
@media (max-width:1080px){.app-shell{grid-template-columns:1fr}.app-sidebar{position:fixed;inset:0 auto 0 0;width:min(88vw,320px);height:100vh;transform:translateX(-104%);transition:transform .24s ease;z-index:30}.sidebar-close{display:inline-flex}body.sidebar-is-open .app-sidebar{transform:translateX(0)}body.sidebar-is-open .sidebar-overlay{opacity:1;visibility:visible;pointer-events:auto}.app-topbar{top:0;border-radius:0 0 24px 24px}}
@media (max-width:860px){.content-grid,.content-grid-lg,.project-card-grid,.stats-grid,.shortcut-grid{grid-template-columns:1fr}.panel-span-2{grid-column:auto}.topbar-left h2{font-size:2rem}.topbar-right{width:100%;justify-content:flex-start}.hero-strip,.page-head-row{flex-direction:column;align-items:flex-start}.project-card-meta,.info-list{grid-template-columns:1fr}.app-content{padding:24px 16px 26px}.app-topbar{padding:16px}.app-footer{padding:0 16px 24px}.topbar-search{max-width:none;min-width:100%}}
@media (max-width:560px){.topbar-left{width:100%}.topbar-left h2{font-size:1.75rem}.user-pill{width:100%;justify-content:flex-start}}


/* =========================
   Landing / Marketing Layout
   ========================= */
.landing-page{overflow-x:hidden}
.interactive-cursor{display:none}
.landing-shell{min-height:100vh;display:grid;grid-template-rows:auto 1fr;gap:0}
.marketing-header{
    width:min(100%, var(--shell-max));
    margin:0 auto;
    padding:20px 28px 10px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
}
.marketing-brand{
    display:flex;
    align-items:center;
    gap:12px;
    font-weight:800;
}
.workspace-dot{
    width:12px;
    height:12px;
    border-radius:999px;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
    box-shadow:0 0 0 6px rgba(255,204,0,.12);
}
.marketing-brand strong{display:block;font-size:1.25rem;line-height:1}
.marketing-brand small{display:block;color:var(--text-soft);margin-top:3px}
.marketing-actions{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}
.theme-toggle-home{
    min-height:48px;
    padding:0 16px;
    border-radius:999px;
}
.landing-main{
    width:min(100%, var(--shell-max));
    margin:0 auto;
    padding:18px 28px 34px;
    display:grid;
    gap:22px;
}
.landing-hero,
.marketing-section{
    border:1px solid var(--line);
    border-radius:28px;
    background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));
    box-shadow:var(--shadow);
    padding:26px;
}
html[data-theme="light"] .landing-hero,
html[data-theme="light"] .marketing-section{
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.92));
}
.landing-hero{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
    gap:24px;
    align-items:center;
}
.landing-hero-copy h1{
    margin:14px 0 12px;
    font-size:clamp(2.4rem, 4vw, 4.3rem);
    line-height:.98;
    letter-spacing:-.045em;
    max-width:760px;
}
.landing-hero-copy p{
    max-width:860px;
    font-size:1.03rem;
}
.landing-cta-row{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin:24px 0 18px;
}
.landing-metric-row{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}
.landing-metric-card{
    border:1px solid var(--line);
    border-radius:22px;
    padding:18px;
    background:rgba(255,255,255,.03);
    display:grid;
    gap:8px;
}
html[data-theme="light"] .landing-metric-card{background:rgba(255,255,255,.78)}
.landing-metric-card strong{
    font-size:1.7rem;
    line-height:1;
}
.landing-metric-card small{
    color:var(--text-soft);
    line-height:1.5;
}
.landing-hero-preview{position:relative}
.hero-image-panel{
    position:relative;
    min-height:560px;
    border-radius:28px;
    padding:22px;
    overflow:hidden;
    border:1px solid var(--line);
    background:
        linear-gradient(180deg,rgba(0,0,0,.16),rgba(0,0,0,.35)),
        url('../images/concept-lab-hero.jpeg') center/cover no-repeat;
}
html[data-theme="light"] .hero-image-panel{
    background:
        linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.22)),
        url('../images/concept-lab-hero.jpeg') center/cover no-repeat;
}
.hero-image-overlay{
    position:absolute;
    inset:0;
    background:radial-gradient(circle at top right, rgba(255,204,0,.24), transparent 28%);
    pointer-events:none;
}
.hero-preview-card{
    position:relative;
    z-index:1;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(10,10,13,.78);
    box-shadow:0 24px 40px rgba(0,0,0,.28);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
}
html[data-theme="light"] .hero-preview-card{
    background:rgba(255,255,255,.88);
    border-color:rgba(17,20,27,.08);
}
.floating-card{
    position:absolute;
    width:min(280px, 44%);
    border-radius:24px;
    padding:18px;
}
.card-a{top:18px;right:18px}
.card-b{bottom:18px;left:18px}
.hero-preview-main{
    position:absolute;
    left:22px;
    right:22px;
    bottom:92px;
    width:auto;
    border-radius:26px;
}
.compact-head h3{font-size:1.55rem;margin:10px 0 0}
.preview-surface{
    display:grid;
    gap:12px;
    margin-top:18px;
}
.preview-row{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:center;
    border:1px solid var(--line);
    border-radius:18px;
    padding:14px 16px;
    background:rgba(255,255,255,.03);
}
html[data-theme="light"] .preview-row{background:rgba(17,20,27,.03)}
.preview-row-right{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.section-head{
    display:grid;
    gap:10px;
    margin-bottom:18px;
}
.center-head{text-align:center;justify-items:center}
.section-head h2{
    margin:0;
    font-size:clamp(1.8rem, 2.6vw, 3rem);
    line-height:1.04;
    letter-spacing:-.04em;
    max-width:840px;
}
.section-head p{
    max-width:840px;
    margin:0;
}
.marketing-grid{
    display:grid;
    gap:18px;
}
.marketing-grid-four{
    grid-template-columns:repeat(4,minmax(0,1fr));
}
.marketing-grid-two{
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.marketing-card,
.mini-card{
    border:1px solid var(--line);
    border-radius:24px;
    background:rgba(255,255,255,.03);
    box-shadow:var(--shadow);
}
html[data-theme="light"] .marketing-card,
html[data-theme="light"] .mini-card{
    background:rgba(255,255,255,.82);
}
.marketing-card{
    padding:22px;
    display:grid;
    gap:10px;
    min-height:220px;
}
.marketing-card h3{margin:0;font-size:1.28rem}
.marketing-card p{margin:0}
.split-section{
    display:grid;
    grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr);
    gap:20px;
    align-items:start;
}
.section-copy h2{
    margin:14px 0 10px;
    font-size:clamp(1.8rem, 2.8vw, 3rem);
    line-height:1.05;
    letter-spacing:-.04em;
}
.inline-link-row{
    display:flex;
    gap:16px;
    flex-wrap:wrap;
    margin-top:18px;
}
.marketing-mini-card{
    min-height:140px;
    padding:18px;
    display:grid;
    gap:8px;
}
.marketing-mini-card strong{font-size:1.06rem}
.marketing-mini-card span{line-height:1.6}
.home-page .app-footer,
.landing-page .app-footer{
    width:min(100%, var(--shell-max));
    margin:0 auto;
    padding:0 28px 28px;
}
@media (max-width:1280px){
    .landing-hero{grid-template-columns:1fr}
    .hero-image-panel{min-height:480px}
    .marketing-grid-four{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
    .marketing-header,
    .landing-main,
    .landing-page .app-footer{padding-left:16px;padding-right:16px}
    .marketing-header{flex-direction:column;align-items:flex-start}
    .landing-metric-row,
    .marketing-grid-two,
    .marketing-grid-four,
    .split-section{grid-template-columns:1fr}
    .floating-card{position:relative;width:auto;left:auto;right:auto;top:auto;bottom:auto}
    .hero-preview-main{position:relative;left:auto;right:auto;bottom:auto;margin-top:16px}
    .hero-image-panel{min-height:auto;display:grid;gap:16px;padding:18px}
}


.hero-strip{align-items:center}
.hero-strip-copy{display:grid;gap:0}
.hero-strip-actions{margin-top:18px;display:flex;flex-wrap:wrap;gap:12px}
.hero-brand-panel{
    width:min(100%, 360px);
    display:grid;
    gap:16px;
    padding:18px;
    border:1px solid var(--line);
    border-radius:24px;
    background:rgba(255,255,255,.03)
}
html[data-theme="light"] .hero-brand-panel{background:rgba(255,255,255,.76)}
.hero-brand-mark{
    width:82px;height:82px;border-radius:22px;padding:12px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(255,204,0,.12);
    border:1px solid rgba(255,204,0,.18)
}
.hero-brand-mark img{width:100%;height:100%;object-fit:contain}
.hero-brand-copy{display:grid;gap:8px}
.hero-brand-copy strong{font-size:1.3rem;line-height:1.15}
.hero-brand-copy p{margin:0}
html[data-theme="light"] .user-avatar img{object-fit:contain;padding:6px;background:#fff}
@media (max-width:1280px){
    .hero-brand-panel{width:100%}
}
@media (max-width:860px){
    .hero-brand-panel{width:100%}
}


/* =========================
   Admin-Shell-Matched Sidebar + Topbar
   ========================= */
.app-shell{grid-template-columns:308px 1fr}
.app-main{min-width:0;display:flex;flex-direction:column}
.admin-sidebar{
    position:sticky;top:0;height:100vh;border-right:1px solid var(--border);
    background:color-mix(in srgb, var(--bg-soft) 92%, transparent);
    backdrop-filter:blur(12px);z-index:30
}
.admin-sidebar__scroll{
    height:100%;
    overflow:hidden;
    padding:28px 20px;
    display:grid;
    grid-template-rows:auto auto auto 1fr auto;
    gap:24px
}
.admin-sidebar__scroll::-webkit-scrollbar{width:8px}
.admin-sidebar__scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--text) 10%, transparent);border-radius:999px}
.brand-mark{
    display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:18px;
    background:color-mix(in srgb, var(--text) 4%, transparent);border:1px solid var(--border)
}
.brand-logo-wrap{
    width:48px;height:48px;padding:8px;border-radius:15px;display:grid;place-items:center;
    background:linear-gradient(135deg, rgba(255,204,0,.18), rgba(255,153,0,.1));
    border:1px solid var(--border);box-shadow:0 10px 28px rgba(255, 204, 0, 0.12)
}
.brand-logo{width:100%;height:100%;object-fit:contain}
.brand-text-wrap{display:flex;flex-direction:column;gap:4px}
.brand-kicker{font-size:.77rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.brand-text-wrap strong{font-size:1.82rem;line-height:1}
.sidebar-mobile-meta{display:none}
.sidebar-user-card,.topbar-user-card{
    display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:16px;
    border:1px solid var(--border);background:color-mix(in srgb, var(--text) 3%, transparent)
}
.user-avatar{
    width:42px;height:42px;display:grid;place-items:center;border-radius:50%;overflow:hidden;
    background:linear-gradient(135deg, var(--accent), var(--accent-2))
}
.user-avatar img{width:72%;height:72%;object-fit:contain}
.sidebar-nav-shell{
    position:relative;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto
}
.sidebar-nav{
    display:grid;gap:10px;min-width:0;overflow-y:auto;overflow-x:hidden;padding-right:2px;
    scrollbar-width:none;-ms-overflow-style:none;min-height:0
}
.sidebar-nav::-webkit-scrollbar{width:0;height:0}
.sidebar-link{
    display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;color:var(--text-soft);
    border:1px solid transparent;transition:.25s ease;background:transparent
}
.sidebar-link:hover,.sidebar-link.is-active{
    background:color-mix(in srgb, var(--text) 5%, transparent);
    color:var(--text);border-color:var(--border);transform:translateX(2px)
}
.sidebar-icon{
    width:32px;height:32px;display:grid;place-items:center;border-radius:12px;
    background:color-mix(in srgb, var(--text) 5%, transparent);font-size:.95rem
}
.sidebar-scroll-indicator{
    position:relative;display:flex;justify-content:center;align-items:center;height:28px;opacity:0;visibility:hidden;
    transition:opacity .22s ease, visibility .22s ease;pointer-events:none;z-index:2
}
.sidebar-scroll-indicator.is-visible{opacity:1;visibility:visible}
.sidebar-scroll-indicator span{
    width:28px;height:28px;border-radius:999px;display:grid;place-items:center;
    background:color-mix(in srgb, var(--text) 6%, transparent);border:1px solid var(--border);color:var(--text-soft);box-shadow:var(--shadow)
}
.sidebar-scroll-indicator--top{margin-bottom:6px}
.sidebar-scroll-indicator--bottom{margin-top:6px}
.announcement-card{
    align-self:end;display:grid;grid-template-rows:auto 1fr auto;min-height:292px;
    background:linear-gradient(180deg, color-mix(in srgb, var(--text) 5%, transparent), color-mix(in srgb, var(--text) 2.5%, transparent));
    border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow);padding:22px
}
.announcement-card__top{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:14px}
.mini-label,.topbar-label,.section-chip{
    display:inline-flex;align-items:center;gap:8px;width:fit-content;padding:8px 12px;border-radius:999px;
    background:color-mix(in srgb, var(--text) 5%, transparent);border:1px solid var(--border);font-size:.78rem;font-weight:700;
    text-transform:uppercase;letter-spacing:.08em;color:var(--text-soft)
}
.announcement-viewport{position:relative;min-height:196px;padding-bottom:12px}
.announcement-slide{
    position:absolute;inset:0;display:grid;gap:12px;align-content:start;opacity:0;transform:translateY(8px);
    pointer-events:none;transition:opacity .55s ease, transform .55s ease
}
.announcement-slide.is-active{opacity:1;transform:translateY(0);pointer-events:auto}
.announcement-icon{
    width:42px;height:42px;display:grid;place-items:center;border-radius:14px;
    background:linear-gradient(135deg, rgba(255,204,0,.18), rgba(255,153,0,.1));border:1px solid var(--border);color:var(--text)
}
.announcement-slide h3{margin:0;font-size:1rem}
.announcement-slide p{margin:0;color:var(--text-soft);line-height:1.62;font-size:.98rem;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.announcement-dots{margin-top:18px;display:flex;gap:8px}
.announcement-dot{
    width:9px;height:9px;border-radius:999px;padding:0;background:color-mix(in srgb, var(--text) 18%, transparent);
    border:1px solid var(--border);display:inline-flex
}
.announcement-dot.is-active{width:24px;background:linear-gradient(135deg, var(--accent), var(--accent-2));border-color:transparent}
.admin-topbar{
    display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding:28px 30px 22px;
    border-bottom:1px solid var(--border);background:var(--topbar);backdrop-filter:blur(14px);position:sticky;top:0;z-index:20
}
.topbar-left{display:flex;flex-direction:column;gap:10px}
.topbar-left h1{margin:0;font-size:clamp(1.6rem, 2vw, 2.4rem);line-height:1}
.topbar-right{display:flex;align-items:center;gap:14px;flex-wrap:wrap;min-width:0}
.topbar-mobile-row{display:flex;align-items:center;gap:12px}
.mobile-menu-toggle{
    display:none;width:42px;height:42px;border-radius:12px;place-items:center;border:1px solid var(--border);
    background:color-mix(in srgb, var(--text) 5%, transparent);color:var(--text);transition:.25s ease;cursor:pointer
}
.mobile-menu-toggle:hover,.theme-toggle:hover,.topbar-button:hover{transform:translateY(-2px)}
.topbar-search{
    min-width:280px;display:flex;align-items:center;gap:10px;padding:0 14px;border-radius:14px;
    background:var(--search-bg);border:1px solid var(--border)
}
.topbar-search input{width:100%;padding:14px 0;border:0;background:transparent;color:var(--text);outline:none}
.topbar-search i{color:var(--text-muted)}
.theme-toggle{display:inline-flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;cursor:pointer}
.topbar-button{padding:12px 16px;border-radius:14px}
.topbar-user-card span{display:block}
.sidebar-overlay{display:none}

html[data-theme="light"] .admin-sidebar{background:color-mix(in srgb, var(--bg-soft) 96%, transparent)}
html[data-theme="light"] .sidebar-link.is-active,html[data-theme="light"] .sidebar-link:hover,
html[data-theme="light"] .brand-mark,html[data-theme="light"] .sidebar-user-card,html[data-theme="light"] .topbar-user-card{
    background:color-mix(in srgb, var(--text) 3%, transparent)
}

/* Content polish */
.hero-strip,.page-head-row,.panel,.stat-card,.project-card{padding:24px;border-radius:24px}
.hero-strip{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);gap:24px;align-items:center}
.hero-strip-copy h3,.page-head-row h3{font-size:clamp(2rem, 3.6vw, 3.4rem);line-height:1.02;letter-spacing:-.04em}
.hero-strip-copy p{max-width:920px;margin-bottom:0}
.hero-strip-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-strip-actions .button{min-height:52px;padding:0 22px}
.hero-brand-panel{width:100%;display:grid;gap:16px;padding:20px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.03)}
.hero-brand-mark{width:84px;height:84px;border-radius:22px;padding:12px;display:flex;align-items:center;justify-content:center;background:rgba(255,204,0,.12);border:1px solid rgba(255,204,0,.18)}
.hero-brand-mark img{width:100%;height:100%;object-fit:contain}
.hero-brand-copy{display:grid;gap:8px}
.hero-brand-copy strong{font-size:1.34rem;line-height:1.15}
.stats-grid,.content-grid,.content-grid-lg,.project-card-grid{gap:20px}
.stat-card h3{font-size:2.35rem}
.page-head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:18px}
.filters-bar{display:flex;gap:16px;flex-wrap:wrap}
.filter-pill{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:999px;font-weight:700;line-height:1.1}
.project-card{display:grid;gap:18px}
.project-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.project-card h3{margin:10px 0 0;font-size:1.42rem;line-height:1.15}
.project-card p{margin:0}
.project-card-meta{margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.progress-block{display:grid;gap:10px}
.progress-labels small{font-size:.9rem}
.progress-bar{height:14px}
.project-card-actions{display:flex;gap:14px;flex-wrap:wrap}
.project-card-actions .button{min-height:52px;padding:0 20px;flex:1 1 180px}
.button-ghost{border:1px solid var(--line-strong)}
.table-wrap{border-radius:18px;overflow:auto}

/* Mobile */
@media (max-width: 960px){
    .app-shell{grid-template-columns:1fr}
    .admin-sidebar{
        position:fixed;top:0;left:0;width:min(86vw, 320px);height:100vh;transform:translateX(-100%);
        transition:transform .28s ease;border-right:1px solid var(--border);border-bottom:0;overflow:hidden
    }
    .admin-sidebar.is-open{transform:translateX(0)}
    .sidebar-overlay{
        display:block;position:fixed;inset:0;background:rgba(0,0,0,.34);opacity:0;visibility:hidden;
        transition:opacity .28s ease, visibility .28s ease;z-index:25
    }
    .sidebar-overlay.is-visible{opacity:1;visibility:visible}
    .mobile-menu-toggle{display:grid}
    .topbar-theme-toggle,.topbar-user-card{display:none}
    .sidebar-mobile-meta{display:grid;gap:12px}
    .admin-topbar{align-items:stretch;gap:16px;padding:18px 20px 16px}
    .topbar-right{width:100%}
    .topbar-search{width:100%;min-width:0}
    .topbar-left h1{font-size:1.4rem}
}
@media (max-width: 768px){
    .app-content,.app-footer{padding-left:20px;padding-right:20px}
    .hero-strip,.page-head-row{grid-template-columns:1fr;display:grid;align-items:start}
    .stats-grid,.content-grid,.content-grid-lg,.project-card-grid,.project-card-meta{grid-template-columns:1fr}
    .page-head-row .hero-strip-actions,.hero-strip-actions{width:100%}
    .hero-strip-actions .button,.project-card-actions .button{width:100%;flex:1 1 100%}
    .filters-bar{gap:12px}
    .filter-pill{padding:0 16px;min-height:46px}
    .hero-brand-panel{min-width:0}
}
@media (max-width: 560px){
    .admin-sidebar__scroll{padding:20px 16px}
    .admin-topbar{padding:16px 16px 14px}
    .app-content{padding:18px 16px 24px}
    .brand-mark{padding:12px}
    .brand-text-wrap strong{font-size:1.55rem}
    .hero-strip,.page-head-row,.panel,.stat-card,.project-card,.announcement-card{padding:18px}
    .hero-strip-copy h3,.page-head-row h3{font-size:2rem}
    .topbar-search input{font-size:16px}
    .project-card-actions{gap:12px}
}


/* =========================
   Nexa Core UI map polish
   ========================= */
.hero-brand-mark--animated{
    position:relative;
    isolation:isolate;
    background:transparent;
    border:none;
    padding:14px;
    overflow:visible;
}
.hero-brand-mark--animated::before{
    content:"";
    position:absolute;
    inset:-3px;
    border-radius:24px;
    background:conic-gradient(from 0deg, rgba(255,204,0,0) 0deg, rgba(255,204,0,.95) 60deg, rgba(255,153,0,.95) 140deg, rgba(255,204,0,0) 220deg, rgba(255,204,0,0) 360deg);
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
    mask-composite:exclude;
    padding:2px;
    animation:nexaRingSweep 7s linear infinite;
    opacity:.95;
    pointer-events:none;
}
.hero-brand-mark--animated::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:22px;
    background:color-mix(in srgb, var(--bg-soft) 88%, transparent);
    border:1px solid var(--border);
    z-index:-1;
}
.hero-brand-mark--animated img{filter:none}
@keyframes nexaRingSweep{
    0%,12%{transform:rotate(0deg);opacity:.1}
    18%,78%{transform:rotate(360deg);opacity:1}
    100%{transform:rotate(360deg);opacity:.1}
}
.task-board-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.task-card{min-height:132px}
.mini-card h3{font-size:1.5rem;margin:10px 0 0}
.table-wrap table td small{display:block}
.project-card .eyebrow,.panel .eyebrow,.stat-card .eyebrow{margin-bottom:4px}
.panel p:last-child,.project-card p:last-child{margin-bottom:0}
.shortcut-card,.stack-item,.timeline-item{transition:transform .22s ease,border-color .22s ease,background .22s ease}
.shortcut-card:hover,.stack-item:hover,.timeline-item:hover{transform:translateY(-2px);border-color:var(--line-strong)}
@media (max-width:1200px){
    .task-board-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:768px){
    .task-board-grid{grid-template-columns:1fr}
}


/* =========================
   Phase 2.1 polish
   ========================= */

/* Premium snake border treatment */
.brand-logo-wrap,
.hero-brand-mark--animated{
    position:relative;
    isolation:isolate;
    overflow:visible;
    box-shadow:none !important;
}

.brand-logo-wrap{
    background:rgba(255, 204, 0, 0.06) !important;
    border:0 !important;
    border-radius:16px;
}

.hero-brand-mark--animated{
    background:transparent !important;
    border:0 !important;
    padding:14px;
}

.snake-border::before,
.hero-brand-mark--animated::before{
    content:"";
    position:absolute;
    inset:-2px;
    border-radius:inherit;
    padding:2px;
    background:
        linear-gradient(
            90deg,
            rgba(255,204,0,0) 0%,
            rgba(255,204,0,0) 22%,
            rgba(255,204,0,1) 42%,
            rgba(255,153,0,1) 52%,
            rgba(255,204,0,0) 68%,
            rgba(255,204,0,0) 100%
        );
    background-size:300% 300%;
    background-position:0% 50%;
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
    mask-composite:exclude;
    animation:nexaSnakeBorder 7.25s ease-in-out infinite;
    pointer-events:none;
    opacity:.9;
}

.snake-border::after,
.hero-brand-mark--animated::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:color-mix(in srgb, var(--bg-soft) 88%, transparent);
    border:1px solid var(--border);
    z-index:-1;
}

.brand-logo-wrap img,
.hero-brand-mark--animated img{
    position:relative;
    z-index:1;
}

@keyframes nexaSnakeBorder{
    0%, 10%{
        background-position:0% 50%;
        opacity:.18;
    }
    25%{
        background-position:100% 0%;
        opacity:1;
    }
    50%{
        background-position:100% 100%;
        opacity:1;
    }
    75%{
        background-position:0% 100%;
        opacity:1;
    }
    90%, 100%{
        background-position:0% 50%;
        opacity:.18;
    }
}

/* Make status colours readable in light mode */
html[data-theme="light"] .badge{
    font-weight:800;
}

html[data-theme="light"] .badge.in-progress,
html[data-theme="light"] .badge.internal-review,
html[data-theme="light"] .badge.healthy,
html[data-theme="light"] .badge.on-track,
html[data-theme="light"] .badge.approved,
html[data-theme="light"] .badge.done{
    color:#13653f;
    background:rgba(44,207,134,.18);
    border-color:rgba(44,207,134,.34);
}

html[data-theme="light"] .badge.awaiting-client,
html[data-theme="light"] .badge.pending-internal,
html[data-theme="light"] .badge.ready-for-approval,
html[data-theme="light"] .badge.changes-requested,
html[data-theme="light"] .badge.attention,
html[data-theme="light"] .badge.planned{
    color:#8a5600;
    background:rgba(255,181,71,.2);
    border-color:rgba(255,181,71,.34);
}

html[data-theme="light"] .badge.blocked,
html[data-theme="light"] .badge.urgent,
html[data-theme="light"] .badge.rejected,
html[data-theme="light"] .badge.cancelled{
    color:#9a2342;
    background:rgba(255,93,124,.16);
    border-color:rgba(255,93,124,.32);
}

html[data-theme="light"] .badge.high,
html[data-theme="light"] .badge.normal{
    color:#1a1f2c;
    background:rgba(17,20,27,.08);
    border-color:rgba(17,20,27,.16);
}

/* Task board clarity */
.task-board-grid > .panel{
    min-height:100%;
}

.task-board-grid .stack-list{
    gap:14px;
}

.task-card{
    min-height:152px;
    display:grid;
    gap:14px;
    align-content:start;
    padding:16px 16px 14px;
    border:1px solid var(--line-strong);
    background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
    box-shadow:0 14px 30px rgba(0,0,0,.14);
}

html[data-theme="light"] .task-card{
    background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.94));
    border-color:rgba(17,20,27,.1);
    box-shadow:0 10px 24px rgba(17,20,27,.06);
}

.task-card strong{
    margin:0;
    font-size:1.05rem;
    line-height:1.3;
}

.task-card__top,
.task-card__footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

.task-card__project{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(255,255,255,.04);
    border:1px solid var(--line);
    color:var(--text-soft);
    font-size:.78rem;
    font-weight:700;
    line-height:1.1;
}

html[data-theme="light"] .task-card__project{
    background:rgba(17,20,27,.04);
    border-color:rgba(17,20,27,.08);
    color:#586070;
}

.task-card__footer{
    padding-top:12px;
    border-top:1px solid var(--line);
}

.task-card__label{
    font-size:.74rem;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--text-muted);
}

.task-card__owner{
    font-weight:700;
    color:var(--text);
}

@media (max-width: 768px){
    .task-card{
        min-height:unset;
    }
}


/* =========================
   Phase 2.2 sidebar shell alignment
   ========================= */

/* Push the sidebar fully flush to the left edge like the live admin shell */
body{
    overflow-x:hidden;
}
.app-shell{
    width:100%;
    max-width:none;
    margin:0;
}

/* Keep the sidebar itself locked flush left, while preserving internal card padding */
.admin-sidebar{
    left:0;
    margin-left:0;
    border-left:0;
}

/* Use the same breathing room logic as the admin shell screenshot */
.admin-sidebar__scroll{
    padding:22px 18px 18px;
    display:flex;
    flex-direction:column;
    gap:22px;
    height:100%;
    min-height:100vh;
}

.sidebar-top{
    flex:0 0 auto;
}

.sidebar-nav-shell{
    flex:1 1 auto;
    min-height:0;
}

.sidebar-nav{
    gap:12px;
    padding-right:0;
}

/* Keep the announcement card pinned to the bottom and stop long content from blowing it out */
.announcement-card{
    margin-top:auto;
    align-self:stretch;
    min-height:316px;
    max-height:316px;
    padding:20px 18px 18px;
    overflow:hidden;
}

.announcement-card__top{
    margin-bottom:12px;
}

.announcement-viewport{
    min-height:196px;
    max-height:196px;
    overflow:hidden;
}

.announcement-slide{
    gap:10px;
}

.announcement-slide h3{
    margin:0;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    line-height:1.35;
}

.announcement-slide p{
    display:-webkit-box;
    -webkit-line-clamp:5;
    -webkit-box-orient:vertical;
    overflow:hidden;
    line-height:1.62;
    margin:0;
}

.announcement-dots{
    margin-top:14px;
    padding-top:0;
}

/* Match the sidebar card spacing more closely to the admin shell */
.brand-mark,
.sidebar-link{
    box-shadow:none;
}

.sidebar-link{
    min-height:58px;
}

@media (max-width:960px){
    .admin-sidebar__scroll{
        padding:20px 16px 16px;
        gap:20px;
    }

    .announcement-card{
        min-height:300px;
        max-height:300px;
        padding:18px 16px 16px;
    }

    .announcement-viewport{
        min-height:184px;
        max-height:184px;
    }
}


/* =========================
   Phase 2.3 mobile content fixes
   ========================= */
@media (max-width: 960px){
    .admin-topbar{
        align-items:flex-start;
    }

    .topbar-left,
    .topbar-right{
        width:100%;
    }

    .topbar-right{
        display:grid;
        grid-template-columns:1fr;
        gap:12px;
    }

    .topbar-search,
    .topbar-button,
    .theme-toggle{
        width:100%;
        max-width:none;
        min-width:0;
    }

    .topbar-button,
    .theme-toggle{
        justify-content:center;
    }

    .hero-strip{
        grid-template-columns:1fr;
        gap:18px;
    }

    .hero-strip-copy,
    .hero-brand-panel{
        width:100%;
        min-width:0;
    }

    .hero-strip-copy h3,
    .page-head-row h3{
        word-break:break-word;
        overflow-wrap:anywhere;
        max-width:100%;
    }

    .hero-strip-copy p,
    .page-head-row p,
    .hero-brand-copy p{
        max-width:100%;
        overflow-wrap:anywhere;
    }

    .hero-strip-actions{
        display:grid;
        grid-template-columns:1fr;
        gap:12px;
        width:100%;
    }

    .hero-strip-actions .button,
    .project-card-actions .button{
        width:100%;
        min-width:0;
        justify-content:center;
        padding-left:16px;
        padding-right:16px;
        text-align:center;
    }

    .project-card-actions{
        display:grid;
        grid-template-columns:1fr;
        gap:12px;
        width:100%;
    }

    .stats-grid,
    .content-grid,
    .content-grid-lg,
    .project-card-grid,
    .task-board-grid,
    .shortcut-grid,
    .project-card-meta,
    .info-list{
        grid-template-columns:1fr !important;
    }

    .panel-span-2{
        grid-column:auto !important;
    }

    .panel,
    .stat-card,
    .project-card,
    .hero-strip,
    .page-head-row{
        min-width:0;
    }

    .table-wrap{
        width:100%;
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
    }

    .table-wrap table{
        min-width:680px;
    }
}

@media (max-width: 768px){
    .admin-topbar{
        padding:16px 16px 14px;
        gap:14px;
    }

    .topbar-mobile-row{
        width:100%;
        justify-content:flex-start;
        flex-wrap:wrap;
        gap:10px;
    }

    .topbar-label{
        min-height:34px;
        padding:7px 11px;
        font-size:.72rem;
    }

    .topbar-left h1{
        font-size:1.85rem;
        line-height:1.02;
    }

    .app-content{
        padding:16px 16px 22px;
        gap:16px;
    }

    .app-footer{
        padding:0 16px 22px;
    }

    .hero-strip,
    .page-head-row,
    .panel,
    .stat-card,
    .project-card,
    .announcement-card{
        padding:16px;
        border-radius:20px;
    }

    .hero-strip-copy h3,
    .page-head-row h3{
        font-size:2rem;
        line-height:1.04;
        letter-spacing:-0.03em;
    }

    .hero-strip-copy p,
    .page-head-row p,
    .hero-brand-copy p,
    .panel p,
    .project-card p{
        font-size:.98rem;
        line-height:1.58;
    }

    .hero-brand-panel{
        padding:16px;
        border-radius:20px;
    }

    .hero-brand-mark{
        width:72px;
        height:72px;
        border-radius:18px;
        padding:10px;
    }

    .hero-brand-copy strong{
        font-size:1.2rem;
        line-height:1.18;
    }

    .button,
    .topbar-button,
    .theme-toggle{
        min-height:50px;
    }

    .filter-pill{
        width:100%;
        justify-content:center;
        padding:0 14px;
        min-height:44px;
        text-align:center;
    }

    .filters-bar{
        display:grid;
        grid-template-columns:1fr;
        gap:10px;
    }

    .stat-card h3{
        font-size:2rem;
    }

    .project-card h3{
        font-size:1.25rem;
        line-height:1.18;
        overflow-wrap:anywhere;
    }

    .stack-item,
    .timeline-item,
    .shortcut-card,
    .task-card{
        padding:14px;
    }

    .project-card-head,
    .panel-head{
        gap:12px;
    }
}

@media (max-width: 480px){
    .topbar-left h1{
        font-size:1.7rem;
    }

    .hero-strip-copy h3,
    .page-head-row h3{
        font-size:1.82rem;
    }

    .hero-strip-copy p,
    .page-head-row p{
        font-size:.95rem;
    }

    .hero-strip-actions .button,
    .project-card-actions .button,
    .topbar-button,
    .theme-toggle{
        min-height:48px;
        font-size:.96rem;
    }

    .eyebrow,
    .mini-label,
    .section-chip,
    .topbar-label{
        max-width:100%;
        white-space:normal;
        text-align:center;
        justify-content:center;
    }

    .brand-text-wrap strong{
        font-size:1.42rem;
    }
}


/* =========================
   Phase 4 CRUD workspace
   ========================= */
.notice-banner{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:16px 18px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.notice-banner strong{display:block;margin-bottom:4px}
.notice-banner p{margin:0}
.notice-banner.success{border-color:rgba(44,207,134,.28);background:rgba(44,207,134,.08)}
.notice-banner.error{border-color:rgba(255,93,124,.26);background:rgba(255,93,124,.08)}
.form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.form-grid--three{
    grid-template-columns:repeat(3,minmax(0,1fr));
}
.form-field{
    display:grid;
    gap:8px;
}
.form-field--full{
    grid-column:1 / -1;
}
.form-field label{
    font-size:.82rem;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:var(--text-muted);
}
.input,
.select,
.textarea{
    width:100%;
    min-height:52px;
    border-radius:16px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:var(--text);
    padding:0 14px;
    outline:none;
    transition:border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.textarea{
    min-height:120px;
    padding:14px;
    resize:vertical;
}
.input:focus,
.select:focus,
.textarea:focus{
    border-color:rgba(255,204,0,.42);
    box-shadow:0 0 0 4px rgba(255,204,0,.08);
}
html[data-theme="light"] .input,
html[data-theme="light"] .select,
html[data-theme="light"] .textarea{
    background:#fff;
}
.checkbox-row{
    display:flex;
    align-items:center;
    gap:12px;
    min-height:60px;
    border-radius:18px;
    border:1px solid var(--line);
    padding:0 16px;
    background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));
    transition:border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.checkbox-row:focus-within{
    border-color:rgba(255,204,0,.28);
    box-shadow:0 0 0 4px rgba(255,204,0,.06);
}
.checkbox-row input[type="checkbox"]{
    appearance:none;
    -webkit-appearance:none;
    width:20px;
    height:20px;
    border-radius:6px;
    border:1px solid rgba(255,255,255,.2);
    background:rgba(255,255,255,.04);
    position:relative;
    flex:0 0 20px;
    cursor:pointer;
    transition:border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.checkbox-row input[type="checkbox"]::after{
    content:'';
    position:absolute;
    inset:4px;
    border-radius:3px;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
    transform:scale(0);
    transition:transform .18s ease;
}
.checkbox-row input[type="checkbox"]:checked{
    border-color:rgba(255,204,0,.45);
    box-shadow:0 0 0 4px rgba(255,204,0,.08);
}
.checkbox-row input[type="checkbox"]:checked::after{
    transform:scale(1);
}
.checkbox-row label,
.checkbox-row span{
    margin:0;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--text-soft);
    cursor:pointer;
}
.checkbox-row input[type="checkbox"]:checked + label,
.checkbox-row input[type="checkbox"]:checked + span{
    color:var(--text);
}
html[data-theme="light"] .checkbox-row{
    background:rgba(255,255,255,.94);
}
html[data-theme="light"] .checkbox-row input[type="checkbox"]{
    border-color:rgba(17,20,27,.16);
    background:rgba(17,20,27,.03);
}
.form-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:6px;
}
.meta-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}
.data-list{
    display:grid;
    gap:12px;
}
.data-list-item{
    display:grid;
    gap:10px;
    padding:16px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.data-list-item__row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}
.data-list-item h4{
    margin:0;
    font-size:1.1rem;
}
.inline-badges{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}
@media (max-width:960px){
    .form-grid,
    .form-grid--three,
    .meta-grid{
        grid-template-columns:1fr;
    }
}


/* =========================
   Phase 4.1 select polish
   ========================= */
.select{
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    padding-right:52px;
    background-image:
        linear-gradient(45deg, transparent 50%, var(--text-soft) 50%),
        linear-gradient(135deg, var(--text-soft) 50%, transparent 50%);
    background-position:
        calc(100% - 22px) calc(50% - 3px),
        calc(100% - 16px) calc(50% - 3px);
    background-size:6px 6px, 6px 6px;
    background-repeat:no-repeat;
}

.select:hover{
    border-color:var(--line-strong);
}

.select option{
    color:var(--text);
    background:var(--bg-soft);
}

.select optgroup{
    color:var(--text);
    background:var(--bg-soft);
    font-weight:700;
}

html[data-theme="light"] .select{
    background-image:
        linear-gradient(45deg, transparent 50%, #5a6272 50%),
        linear-gradient(135deg, #5a6272 50%, transparent 50%);
}

html[data-theme="light"] .select option,
html[data-theme="light"] .select optgroup{
    color:#11141b;
    background:#ffffff;
}

@media (max-width:768px){
    .select{
        padding-right:48px;
        background-position:
            calc(100% - 20px) calc(50% - 3px),
            calc(100% - 14px) calc(50% - 3px);
    }
}


/* =========================
   Phase 4.2 Live edit modals
   ========================= */
.nexa-modal{
    position:fixed;
    inset:0;
    z-index:120;
    display:none;
}
.nexa-modal.is-open{
    display:block;
}
.nexa-modal__backdrop{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.54);
    backdrop-filter:blur(6px);
}
.nexa-modal__dialog{
    position:relative;
    width:min(820px, calc(100vw - 32px));
    max-height:min(88vh, 980px);
    margin:32px auto;
    overflow:hidden;
    border-radius:24px;
    border:1px solid var(--line);
    background:linear-gradient(180deg,rgba(16,17,21,.98),rgba(8,8,10,.98));
    box-shadow:0 26px 70px rgba(0,0,0,.38);
    display:grid;
    grid-template-rows:auto 1fr auto;
}
.nexa-modal__dialog--wide{
    width:min(1080px, calc(100vw - 32px));
}
.nexa-modal__dialog--small{
    width:min(520px, calc(100vw - 32px));
}
html[data-theme="light"] .nexa-modal__dialog{
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,248,251,.98));
}
.nexa-modal__head,
.nexa-modal__actions{
    padding:18px 20px;
    border-bottom:1px solid var(--line);
}
.nexa-modal__actions{
    border-bottom:0;
    border-top:1px solid var(--line);
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}
.nexa-modal__body{
    padding:18px 20px;
    overflow:auto;
    overscroll-behavior:contain;
}
html.nexa-modal-open,
body.nexa-modal-open{
    overflow:hidden;
    overscroll-behavior:none;
}
.nexa-modal__close{
    width:42px;
    height:42px;
    border-radius:14px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
    color:var(--text);
}
.nexa-modal__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
}
.nexa-modal__head h3{
    margin:8px 0 0;
    font-size:1.6rem;
    line-height:1.1;
}
.text-link--button{
    border:0;
    background:transparent;
    padding:0;
    color:var(--accent);
    font:inherit;
    cursor:pointer;
}
.is-hidden{
    display:none !important;
}
@media (max-width: 768px){
    .nexa-modal__dialog,
    .nexa-modal__dialog--wide,
    .nexa-modal__dialog--small{
        width:calc(100vw - 20px);
        margin:10px auto;
        max-height:calc(100vh - 20px);
        border-radius:20px;
    }
    .nexa-modal__head,
    .nexa-modal__body,
    .nexa-modal__actions{
        padding:16px;
    }
    .nexa-modal__actions .button{
        width:100%;
        justify-content:center;
    }
}


/* =========================
   Phase 4.3 modal reliability
   ========================= */
.nexa-modal{
    position:fixed;
    inset:0;
    z-index:120;
    display:none;
    align-items:center;
    justify-content:center;
    padding:20px;
}
.nexa-modal.is-open{
    display:flex;
}
.nexa-modal__dialog{
    margin:0;
}
.nexa-modal__head{
    position:relative;
    z-index:2;
}
.nexa-modal__close{
    cursor:pointer;
}
.nexa-loading-state{
    display:none;
    align-items:center;
    gap:12px;
    padding:12px 14px;
    margin-bottom:14px;
    border-radius:16px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:var(--text-soft);
    font-weight:700;
}
.nexa-loading-state.is-active{
    display:flex;
}
.nexa-loading-state__spinner{
    width:18px;
    height:18px;
    border-radius:50%;
    border:2px solid rgba(255,255,255,.18);
    border-top-color:var(--accent);
    animation:nexaSpin .7s linear infinite;
}
@keyframes nexaSpin{
    to{transform:rotate(360deg)}
}
html[data-theme="light"] .nexa-loading-state{
    background:rgba(17,20,27,.04);
}


/* =========================
   Phase 4.4 live-data revisit
   ========================= */
.field-help{
    display:block;
    margin-top:4px;
    color:var(--text-muted);
    font-size:.86rem;
    line-height:1.5;
}
.readonly-input{
    opacity:.92;
    background:rgba(255,255,255,.06);
    cursor:not-allowed;
}
html[data-theme="light"] .readonly-input{
    background:rgba(17,20,27,.05);
}
.priority-pill-group{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.priority-pill{
    position:relative;
}
.priority-pill input{
    position:absolute;
    inset:0;
    opacity:0;
    pointer-events:none;
}
.priority-pill span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
    color:var(--text-soft);
    font-weight:800;
    cursor:pointer;
    transition:border-color .22s ease, background .22s ease, color .22s ease, transform .22s ease;
}
.priority-pill input:checked + span{
    transform:translateY(-1px);
}
.priority-pill--normal input:checked + span{
    color:#1e1f24;
    background:#e9edf6;
    border-color:#cdd5e6;
}
.priority-pill--high input:checked + span{
    color:#7b4a00;
    background:rgba(255,181,71,.24);
    border-color:rgba(255,181,71,.4);
}
.priority-pill--urgent input:checked + span{
    color:#a31d48;
    background:rgba(255,93,124,.18);
    border-color:rgba(255,93,124,.34);
}
.text-button-readable{
    color:var(--text) !important;
}
.project-card-actions .button{
    white-space:nowrap;
}
html[data-theme="dark"] .project-card-actions .button.button-secondary,
html[data-theme="dark"] .project-card-actions .button.button-ghost{
    color:#f2f4f8;
}
.empty-state{
    display:grid;
    gap:12px;
    padding:24px;
    border-radius:20px;
    border:1px dashed var(--line-strong);
    background:rgba(255,255,255,.02);
    text-align:left;
}
.empty-state strong{
    font-size:1.12rem;
}
.empty-state p{
    margin:0;
}
.db-status-banner{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    padding:16px 18px;
    border-radius:20px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.db-status-banner.is-error{
    border-color:rgba(255,93,124,.26);
    background:rgba(255,93,124,.07);
}
.db-status-banner.is-ok{
    border-color:rgba(44,207,134,.24);
    background:rgba(44,207,134,.07);
}
.db-status-banner p{
    margin:0;
}
.date-shell{
    position:relative;
}
.date-shell .input{
    padding-right:50px;
}
.date-shell::after{
    content:"\f073";
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    position:absolute;
    right:16px;
    top:50%;
    transform:translateY(-50%);
    color:var(--accent);
    pointer-events:none;
    opacity:.9;
}
.input[type="date"]::-webkit-calendar-picker-indicator{
    opacity:0;
    cursor:pointer;
}
.form-divider{
    grid-column:1 / -1;
    height:1px;
    background:var(--line);
    margin:4px 0;
}
.status-roadmap{
    display:grid;
    gap:10px;
    padding:14px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.status-roadmap__item{
    display:grid;
    gap:3px;
}
.status-roadmap__item strong{
    font-size:.95rem;
}
.nexa-modal__actions{
    justify-content:flex-start;
}
.nexa-modal__dialog .button{
    min-height:48px;
}
.nexa-modal__body{
    scrollbar-width:thin;
}
@media (max-width: 768px){
    .priority-pill-group{
        display:grid;
        grid-template-columns:1fr;
    }
}

/* Phase 4.5.1 hardening */
html[data-theme="light"] .select{
    appearance:auto;
    -webkit-appearance:menulist;
    -moz-appearance:menulist;
    background-image:none !important;
    padding-right:14px;
    color:#11141b;
    background-color:#fff;
}
html[data-theme="light"] .select option{
    color:#11141b;
    background-color:#fff;
}
.nexa-modal__dialog{
    display:grid;
    grid-template-rows:auto minmax(0,1fr) auto;
    align-self:center;
}
.nexa-modal__body{
    overflow:auto;
    max-height:calc(84vh - 132px);
    -webkit-overflow-scrolling:touch;
}
@media (max-width: 768px){
    .nexa-modal{
        align-items:flex-start;
        padding:10px;
    }
    .nexa-modal__body{
        max-height:calc(100vh - 170px);
    }
}
.project-card-actions .button.button-secondary,
.project-card-actions .button.button-ghost,
.text-link--button{
    color:var(--text) !important;
}
.project-card-actions .button:hover{
    color:var(--text) !important;
}


/* =========================
   Phase 4.5.2 stability + modal fit
   ========================= */
.nexa-modal{
    box-sizing:border-box;
    padding:16px;
    align-items:center;
    justify-content:center;
    overscroll-behavior:contain;
}
html.nexa-modal-open,
body.nexa-modal-open{
    overflow:hidden;
    overscroll-behavior:none;
    height:100%;
}
body.nexa-modal-open{
    touch-action:none;
}

.nexa-modal__dialog,
.nexa-modal__dialog--wide,
.nexa-modal__dialog--small{
    width:min(1080px, calc(100vw - 32px));
    max-height:calc(100dvh - 32px);
    margin:0;
    display:flex;
    flex-direction:column;
    overflow:hidden;
}

.nexa-modal__dialog--small{
    width:min(520px, calc(100vw - 32px));
}

.nexa-modal__body{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;
    overscroll-behavior:contain;
    padding:18px 20px 26px;
}

.nexa-modal__actions{
    flex:0 0 auto;
    padding:16px 20px 18px;
    border-top:1px solid var(--line);
    background:inherit;
}

.nexa-modal__actions .button{
    min-height:50px;
}

.project-card-actions .button.button-secondary,
.project-card-actions .button.button-ghost{
    color:var(--text);
}

html[data-theme="light"] .select{
    background-image:none;
    padding-right:16px;
}

html[data-theme="light"] .project-card-actions .button.button-secondary,
html[data-theme="light"] .project-card-actions .button.button-ghost{
    color:#1b1f2a;
}

@media (max-width: 768px){
    .nexa-modal{
        padding:10px;
    }

    .nexa-modal__dialog,
    .nexa-modal__dialog--wide,
    .nexa-modal__dialog--small{
        width:calc(100vw - 20px);
        max-height:calc(100dvh - 20px);
        border-radius:20px;
    }

    .nexa-modal__body{
        padding:16px 16px 24px;
    }

    .nexa-modal__actions{
        padding:14px 16px 16px;
    }
}


/* =========================
   Phase 4.5.3 save interaction fix
   ========================= */
.nexa-modal__dialog{
    position:relative;
}

.nexa-modal__body{
    padding-bottom:34px;
}

.nexa-modal__actions{
    position:sticky;
    bottom:0;
    z-index:4;
    box-shadow:0 -10px 24px rgba(0,0,0,.18);
}

html[data-theme="light"] .nexa-modal__actions{
    box-shadow:0 -10px 24px rgba(17,20,27,.08);
}

.nexa-modal__actions .button{
    position:relative;
    z-index:5;
}

.nexa-modal__dialog .button.button-primary[disabled]{
    opacity:.72;
    cursor:wait;
}

.nexa-loading-state{
    position:sticky;
    top:0;
    z-index:3;
}

/* =========================
   Phase 4.5.4 refinement pass
   ========================= */
.button.is-disabled,
.button[aria-disabled="true"]{
    opacity:.48;
    pointer-events:none;
}

.input[type="number"]{
    -moz-appearance:textfield;
    appearance:textfield;
}
.input[type="number"]::-webkit-outer-spin-button,
.input[type="number"]::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}

.date-shell{
    position:relative;
}
.date-shell .input{
    padding-right:58px;
}
.date-shell::after{
    display:none;
}
.date-shell__trigger{
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    width:38px;
    height:38px;
    border-radius:12px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:var(--accent);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:border-color .22s ease, background .22s ease, transform .22s ease;
}
.date-shell__trigger:hover{
    transform:translateY(-50%) scale(1.02);
    border-color:rgba(255,204,0,.34);
    background:rgba(255,255,255,.08);
}
html[data-theme="light"] .date-shell__trigger{
    background:rgba(17,20,27,.04);
}

.status-roadmap--cards{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    padding:0;
    border:none;
    background:transparent;
}
.status-roadmap__card{
    display:grid;
    gap:8px;
    padding:14px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.status-roadmap__icon{
    width:34px;
    height:34px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,204,0,.08);
    color:var(--accent);
}
.status-roadmap__card strong{
    font-size:.96rem;
}
.status-roadmap__card small{
    color:var(--text-muted);
    line-height:1.45;
}

.settings-split-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.settings-card-lite{
    padding:18px;
    border-radius:20px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.settings-card-lite h4{
    margin:0 0 8px;
    font-size:1rem;
}
.settings-card-lite p{
    margin:0 0 14px;
    color:var(--text-muted);
}
.settings-chip-grid{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.settings-chip{
    display:inline-flex;
    align-items:center;
    min-height:38px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:var(--text-soft);
    font-weight:700;
}
.settings-inline-form{
    display:grid;
    gap:10px;
}
.settings-inline-form__row{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
}
.settings-type-list{
    display:grid;
    gap:10px;
    margin-top:14px;
}
.settings-type-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:14px;
    border-radius:16px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.settings-type-item strong{
    display:block;
    margin-bottom:2px;
}
.settings-type-item small,
.text-link--muted{
    color:var(--text-muted);
}
.empty-state--compact{
    padding:18px;
}

@media (max-width: 960px){
    .status-roadmap--cards,
    .settings-split-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 640px){
    .status-roadmap--cards,
    .settings-split-grid,
    .settings-inline-form__row{
        grid-template-columns:1fr;
    }

    .settings-type-item{
        align-items:flex-start;
        flex-direction:column;
    }

    .date-shell__trigger{
        width:36px;
        height:36px;
    }
}

.inline-actions{
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
}

.empty-state--tight{
    padding:26px;
}

[data-approval-reviewers]{
    min-height:140px;
}


/* =========================
   Phase 4.6.2 approval UX polish
   ========================= */
.approval-route-state{
    display:flex;
    align-items:flex-start;
    gap:14px;
    padding:16px 18px;
    border-radius:20px;
    border:1px solid var(--line-strong);
    background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
    transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}
.approval-route-state__icon{
    width:44px;
    height:44px;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--line-strong);
    background:rgba(255,255,255,.05);
    color:var(--accent);
    flex:0 0 44px;
}
.approval-route-state strong,
.reviewer-option__copy strong{
    display:block;
}
.approval-route-state small,
.reviewer-option__copy small{
    display:block;
    color:var(--text-soft);
    line-height:1.55;
    margin-top:4px;
}
.nexa-entity-form.is-internal-route .approval-route-state{
    transform:translateY(-1px);
    border-color:rgba(255,204,0,.35);
    box-shadow:0 18px 34px rgba(255,204,0,.08);
    background:linear-gradient(180deg, rgba(255,204,0,.08), rgba(255,255,255,.025));
}
.reviewer-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}
.reviewer-option{
    display:block;
}
.reviewer-option input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}
.reviewer-option__card{
    position:relative;
    display:flex;
    align-items:center;
    gap:14px;
    min-height:74px;
    padding:14px 16px;
    border-radius:18px;
    border:1px solid var(--line-strong);
    background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
    cursor:pointer;
    transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.reviewer-option__avatar,
.reviewer-option__check{
    width:36px;
    height:36px;
    border-radius:12px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 36px;
}
.reviewer-option__avatar{
    border:1px solid var(--line-strong);
    background:rgba(255,255,255,.05);
    color:var(--text-soft);
}
.reviewer-option__copy{
    min-width:0;
    flex:1;
}
.reviewer-option__copy strong{
    font-size:.98rem;
    line-height:1.2;
}
.reviewer-option__check{
    border:1px solid transparent;
    background:rgba(255,255,255,.04);
    color:transparent;
}
.reviewer-option__card:hover{
    transform:translateY(-1px);
    border-color:rgba(255,204,0,.28);
}
.reviewer-option input:checked + .reviewer-option__card{
    border-color:rgba(255,204,0,.42);
    background:linear-gradient(180deg, rgba(255,204,0,.12), rgba(255,255,255,.03));
    box-shadow:0 14px 30px rgba(255,204,0,.08);
}
.reviewer-option input:checked + .reviewer-option__card .reviewer-option__avatar{
    color:var(--accent);
    border-color:rgba(255,204,0,.28);
}
.reviewer-option input:checked + .reviewer-option__card .reviewer-option__check{
    color:#111;
    background:linear-gradient(135deg, var(--accent), var(--accent-2));
}
.reviewer-option input:disabled + .reviewer-option__card{
    opacity:.45;
    cursor:not-allowed;
}
.status-pill-group{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.status-pill{
    position:relative;
    display:block;
}
.status-pill input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}
.status-pill span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid var(--line-strong);
    background:rgba(255,255,255,.04);
    color:var(--text-soft);
    font-weight:700;
    line-height:1.1;
    cursor:pointer;
    transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease;
}
.status-pill span:hover{
    transform:translateY(-1px);
}
.status-pill--pending-internal input:checked + span,
.status-pill--awaiting-client input:checked + span,
.status-pill--changes-requested input:checked + span{
    color:#fff2d0;
    background:rgba(255,181,71,.16);
    border-color:rgba(255,181,71,.32);
    box-shadow:0 12px 24px rgba(255,181,71,.08);
}
.status-pill--approved input:checked + span{
    color:#ddfff0;
    background:rgba(44,207,134,.12);
    border-color:rgba(44,207,134,.28);
    box-shadow:0 12px 24px rgba(44,207,134,.07);
}
.status-pill--rejected input:checked + span{
    color:#ffd7df;
    background:rgba(255,93,124,.12);
    border-color:rgba(255,93,124,.28);
    box-shadow:0 12px 24px rgba(255,93,124,.08);
}
.inline-action-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:40px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid var(--line-strong);
    background:rgba(255,255,255,.04);
    color:var(--text);
    font-weight:700;
    cursor:pointer;
    transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.inline-action-pill i{
    font-size:.88rem;
}
.inline-action-pill:hover{
    transform:translateY(-1px);
    border-color:rgba(255,204,0,.28);
}
.inline-action-pill--accent{
    background:rgba(255,204,0,.1);
    border-color:rgba(255,204,0,.26);
}
.inline-action-pill--neutral{
    background:rgba(255,255,255,.045);
}
html[data-theme="light"] .approval-route-state,
html[data-theme="light"] .reviewer-option__card,
html[data-theme="light"] .inline-action-pill,
html[data-theme="light"] .status-pill span{
    background:rgba(255,255,255,.92);
}
html[data-theme="light"] .reviewer-option__avatar,
html[data-theme="light"] .reviewer-option__check,
html[data-theme="light"] .approval-route-state__icon{
    background:rgba(17,20,27,.04);
}
@media (max-width: 768px){
    .reviewer-grid{
        grid-template-columns:1fr;
    }
    .status-pill-group,
    .inline-actions{
        width:100%;
    }
    .inline-action-pill{
        justify-content:center;
        flex:1 1 calc(50% - 8px);
    }
}

/* =========================
   Phase 4.7 task context + comments
   ========================= */
.task-card--rich{
    gap:16px;
}
.task-card__body{
    display:grid;
    gap:8px;
}
.task-card__details,
.task-list-details{
    margin:0;
    color:var(--text-soft);
    font-size:.95rem;
    line-height:1.55;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.task-card__meta-row,
.task-list-meta{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
}
.task-chip{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:34px;
    padding:0 12px;
    border-radius:999px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:var(--text-soft);
    font-size:.8rem;
    font-weight:700;
}
.task-chip i{
    font-size:.82rem;
    opacity:.85;
}
.task-chip--status.pending-approval,
.badge.pending-approval{
    color:#ffe4a5;
    background:rgba(255,188,71,.12);
    border-color:rgba(255,188,71,.3);
}
.task-chip--status.approved,
.badge.approved{
    color:#b8f5d1;
    background:rgba(47,196,120,.12);
    border-color:rgba(47,196,120,.28);
}
.task-chip--status.changes-requested,
.badge.changes-requested{
    color:#ffd6b0;
    background:rgba(255,128,48,.12);
    border-color:rgba(255,128,48,.28);
}
.task-chip--status.rejected,
.badge.rejected{
    color:#ffd2da;
    background:rgba(255,91,120,.12);
    border-color:rgba(255,91,120,.28);
}
.task-chip--status.not-sent,
.badge.not-sent{
    color:var(--text-soft);
    background:rgba(255,255,255,.04);
    border-color:var(--line);
}
.task-card__footer--stacked{
    display:grid;
    gap:12px;
}
.task-card__owner-line{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}
.inline-actions--tight{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.data-list--tasks{
    gap:14px;
}
.data-list-item--task{
    gap:14px;
}
.data-list-item__row--task-head{
    align-items:flex-start;
}
.task-context-section{
    display:grid;
    gap:18px;
    margin-top:22px;
    padding-top:22px;
    border-top:1px solid var(--line);
}
.task-context-summary{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px;
}
.task-context-card,
.task-comments-panel{
    border:1px solid var(--line);
    border-radius:22px;
    background:rgba(255,255,255,.03);
    padding:18px;
}
.task-context-card h4,
.task-comments-panel h4{
    margin:6px 0 0;
}
.task-context-meta,
.task-context-pill-row{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:14px;
}
.task-context-copy{
    margin:14px 0 0;
    color:var(--text-soft);
    line-height:1.6;
}
.task-comments-panel{
    display:grid;
    gap:16px;
}
.task-comments-panel__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}
.task-comment-count-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:38px;
    min-height:38px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(255,204,0,.12);
    border:1px solid rgba(255,204,0,.28);
    color:#ffe08a;
    font-weight:800;
}
.task-comments-list{
    display:grid;
    gap:14px;
}
.task-comment-item{
    display:grid;
    gap:14px;
    padding:16px 18px;
    border-radius:22px;
    border:1px solid rgba(255,255,255,.08);
    background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.025));
    box-shadow:0 18px 34px rgba(0,0,0,.16);
}
.task-comment-item--unread{
    border-color:rgba(255,204,0,.22);
    box-shadow:0 18px 34px rgba(0,0,0,.16), 0 0 0 1px rgba(255,204,0,.12) inset;
}
.task-comment-item__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}
.task-comment-item__meta{
    display:flex;
    align-items:flex-start;
    gap:12px;
    min-width:0;
}
.task-comment-item__avatar{
    width:42px;
    height:42px;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 42px;
    background:rgba(255,204,0,.12);
    border:1px solid rgba(255,204,0,.24);
    color:#ffe08a;
    font-weight:800;
    letter-spacing:.04em;
}
.task-comment-item__identity{
    min-width:0;
}
.task-comment-item__identity strong,
.task-comment-item__identity span,
.task-comment-item__stamp small{
    display:block;
}
.task-comment-item__identity strong{
    font-size:.98rem;
}
.task-comment-item__identity span,
.task-comment-item__stamp small,
.task-comments-empty{
    color:var(--text-muted);
}
.task-comment-item__identity span{
    margin-top:3px;
}
.task-comment-item__stamp{
    text-align:right;
    flex:0 0 auto;
    padding-top:2px;
    display:grid;
    justify-items:end;
    gap:8px;
}
.task-comment-item__new{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:24px;
    padding:0 10px;
    border-radius:999px;
    background:rgba(255,204,0,.12);
    border:1px solid rgba(255,204,0,.24);
    color:#ffe08a;
    font-size:.68rem;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}
.task-comment-item p,
.task-comments-empty{
    margin:0;
    line-height:1.72;
    white-space:pre-wrap;
    word-break:break-word;
}
.task-comments-empty{
    padding:16px 18px;
    border:1px dashed rgba(255,255,255,.1);
    border-radius:20px;
    background:rgba(255,255,255,.02);
}
.task-comment-compose{
    display:grid;
    gap:12px;
    padding-top:4px;
}
.task-comment-compose__label{
    font-weight:700;
}
.task-comment-compose__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}
.task-comment-compose__intro{
    margin:6px 0 0;
    color:var(--text-muted);
    line-height:1.55;
}
.task-comment-edit-flag{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(255,204,0,.12);
    border:1px solid rgba(255,204,0,.24);
    color:#ffe08a;
    font-size:.76rem;
    font-weight:800;
}
.task-comment-compose__controls{
    display:grid;
    grid-template-columns:minmax(0, 220px) minmax(0, 1fr);
    gap:14px;
    align-items:end;
}
.task-comment-compose__controls .form-field{
    margin:0;
}
.checkbox-row--compact{
    min-height:48px;
    padding:0 16px;
}
.task-comment-pin-toggle{
    justify-content:flex-start;
    gap:12px;
}

.checkbox-row--toggle{
    justify-content:space-between;
    gap:16px;
    padding:0 18px;
}
.checkbox-row--toggle label{
    flex:1 1 auto;
}
.checkbox-row--toggle input[type="checkbox"]{
    order:2;
    width:24px;
    height:24px;
    border-radius:8px;
}
.checkbox-row--toggle input[type="checkbox"]::after{
    inset:5px;
    border-radius:4px;
}

.checkbox-row--toggle{
    min-height:62px;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.03);
}
.checkbox-row--toggle label{
    display:flex;
    align-items:center;
    min-height:62px;
    font-weight:700;
    letter-spacing:.02em;
}
.checkbox-row--toggle:hover{
    border-color:rgba(255,204,0,.18);
}
.task-comment-pin-toggle.is-disabled{
    opacity:.72;
}
.task-comment-help-pill{
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:26px;
    padding:0 10px;
    border-radius:999px;
    font-size:.74rem;
    font-weight:800;
    letter-spacing:.03em;
    margin-right:8px;
    vertical-align:middle;
}
.task-comment-help-pill--comment{
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.1);
    color:var(--text-soft);
}
.task-comment-help-pill--internal{
    background:rgba(126,107,255,.12);
    border:1px solid rgba(126,107,255,.22);
    color:#d6ceff;
}
.task-comment-help-pill--approval{
    background:rgba(47,196,120,.12);
    border:1px solid rgba(47,196,120,.22);
    color:#c6f8dc;
}
.task-comment-help-pill--blocker{
    background:rgba(255,95,95,.12);
    border:1px solid rgba(255,95,95,.24);
    color:#ffd5d5;
}
.task-comment-type-select{
    padding-right:68px;
    background-position:
        calc(100% - 28px) calc(50% - 3px),
        calc(100% - 20px) calc(50% - 3px);
    color-scheme:dark;
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
}
.task-comment-type-select option{
    color:#f4f6fb;
    background:#131722;
}
.task-comment-type-help{
    display:grid;
    gap:8px;
    padding:14px 16px;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.03);
}
.task-comment-type-help p{
    margin:0;
    color:var(--text-soft);
    line-height:1.55;
}
.task-comment-type-help strong{
    color:var(--text);
}
.task-comment-compose__controls .select,
.task-comment-compose__controls .input,
.task-comment-compose .textarea{
    box-shadow:none;
}
.task-comment-compose .textarea{
    border-color:rgba(255,204,0,.28);
}
.task-comment-compose .textarea:focus,
.task-comment-compose__controls .select:focus{
    border-color:rgba(255,204,0,.42);
    box-shadow:0 0 0 4px rgba(255,204,0,.08);
}
html[data-theme="light"] .task-comment-type-select{
    color-scheme:light;
}
html[data-theme="light"] .task-comment-type-select option{
    color:#11141b;
    background:#ffffff;
}
html[data-theme="light"] .task-comment-type-help{
    background:#ffffff;
    border-color:rgba(17,20,27,.08);
}
.task-comment-compose__action-buttons{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.task-comment-group{
    display:grid;
    gap:12px;
}
.task-comment-group__head{
    padding:0 4px;
}
.task-comment-group__head strong,
.task-comment-group__head span{
    display:block;
}
.task-comment-group__head span{
    margin-top:4px;
    color:var(--text-muted);
    font-size:.86rem;
}
.task-comment-group__items{
    display:grid;
    gap:14px;
}
.task-comment-item__tags{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin-top:-4px;
}
.task-comment-tag,
.task-comment-item__pin,
.task-comment-item__edited{
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:28px;
    padding:0 10px;
    border-radius:999px;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.03em;
}
.task-comment-tag{
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.1);
    color:var(--text-soft);
}
.task-comment-tag--internal{
    background:rgba(126,107,255,.12);
    border-color:rgba(126,107,255,.22);
    color:#d6ceff;
}
.task-comment-tag--approval{
    background:rgba(47,196,120,.12);
    border-color:rgba(47,196,120,.22);
    color:#c6f8dc;
}
.task-comment-tag--blocker{
    background:rgba(255,95,95,.12);
    border-color:rgba(255,95,95,.24);
    color:#ffd5d5;
}
.task-comment-item--blocker-open{
    border-color:rgba(255,95,95,.34);
    box-shadow:0 18px 34px rgba(0,0,0,.16), 0 0 0 1px rgba(255,95,95,.14) inset;
}
.task-comment-item--blocker-resolved{
    border-color:rgba(47,196,120,.22);
}
.task-comment-item__resolved{
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:28px;
    padding:0 10px;
    border-radius:999px;
    background:rgba(47,196,120,.12);
    border:1px solid rgba(47,196,120,.22);
    color:#c6f8dc;
    font-size:.72rem;
    font-weight:800;
}
.task-comment-item__pin{
    background:rgba(255,204,0,.12);
    border:1px solid rgba(255,204,0,.24);
    color:#ffe08a;
}
.task-comment-item__edited{
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.08);
    color:var(--text-muted);
}
.task-comment-item__actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.task-comment-item__actions .inline-action-pill{
    min-height:34px;
}
.task-comment-item__actions .inline-action-pill--success{
    background:rgba(47,196,120,.12);
    border-color:rgba(47,196,120,.24);
    color:#c6f8dc;
}
.task-comment-item__actions .inline-action-pill--danger{
    background:rgba(255,95,95,.12);
    border-color:rgba(255,95,95,.24);
    color:#ffd5d5;
}
.inline-action-pill.is-disabled,
.inline-action-pill[disabled]{
    opacity:.62;
    pointer-events:none;
}
.task-comment-compose .textarea{
    min-height:132px;
    resize:vertical;
    background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.03));
    color:var(--text);
    border-color:rgba(255,204,0,.18);
}
.task-comment-compose .textarea::placeholder{
    color:var(--text-muted);
}
.task-comment-compose__actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}
.task-comment-compose__actions .button{
    min-width:154px;
}
.task-comment-compose__action-buttons .button{
    min-width:154px;
}
.task-comment-compose__actions .button.button-secondary{
    background:rgba(255,255,255,.08);
    border-color:rgba(255,255,255,.12);
    color:var(--text);
    box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.task-comment-compose__actions .button.button-secondary:hover{
    background:rgba(255,255,255,.12);
}
.task-comment-compose__actions .button.button-secondary.is-disabled,
.task-comment-compose__actions .button.button-secondary[disabled]{
    opacity:.62;
    color:var(--text-muted);
    background:rgba(255,255,255,.04);
    border-color:rgba(255,255,255,.08);
    box-shadow:none;
}
html[data-theme="light"] .task-comment-compose .textarea{
    background:#fff;
    border-color:rgba(196,144,0,.18);
}
html[data-theme="light"] .task-comment-compose__actions .button.button-secondary{
    background:rgba(17,20,27,.04);
    border-color:rgba(17,20,27,.12);
    color:var(--text);
    box-shadow:none;
}
.table-wrap--task-detail td small{
    display:block;
    margin-top:6px;
    color:var(--text-soft);
    line-height:1.5;
}
html[data-theme="light"] .task-chip,
html[data-theme="light"] .task-context-card,
html[data-theme="light"] .task-comments-panel,
html[data-theme="light"] .task-comment-item,
html[data-theme="light"] .data-list-item--task{
    background:rgba(255,255,255,.94);
}
html[data-theme="light"] .task-comment-item__avatar{
    background:rgba(255,204,0,.14);
    border-color:rgba(196,144,0,.2);
    color:#946c00;
}
html[data-theme="light"] .task-comment-tag{
    background:rgba(17,20,27,.04);
    border-color:rgba(17,20,27,.1);
    color:var(--text-soft);
}
html[data-theme="light"] .task-comment-item__edited{
    background:rgba(17,20,27,.04);
    border-color:rgba(17,20,27,.1);
    color:var(--text-soft);
}
html[data-theme="light"] .checkbox-row--toggle{
    background:#ffffff;
    border-color:rgba(17,20,27,.1);
}
html[data-theme="light"] .task-comment-help-pill--comment{
    background:rgba(17,20,27,.04);
    border-color:rgba(17,20,27,.1);
    color:var(--text-soft);
}
html[data-theme="light"] .task-comment-item--blocker-open{
    border-color:rgba(201,50,50,.22);
}
@media (max-width: 960px){
    .task-context-summary{
        grid-template-columns:1fr;
    }
}
@media (max-width: 768px){
    .task-card__owner-line,
    .task-comments-panel__head,
    .task-comment-compose__actions{
        align-items:flex-start;
    }
    .task-comment-compose__controls{
        grid-template-columns:1fr;
    }
    .task-chip,
    .inline-action-pill{
        width:100%;
        justify-content:center;
    }
}


.task-chip-stack{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}
.task-chip--unread,
.task-list-unread{
    color:#ffcc00;
    border-color:rgba(255,204,0,.24);
    background:rgba(255,204,0,.10);
}
.task-chip--unread i,
.task-list-unread i{
    font-size:10px;
}
.task-list-unread{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    border:1px solid rgba(255,204,0,.24);
    border-radius:999px;
    font-weight:700;
}
.task-modal-tabs{
    display:flex;
    gap:10px;
    margin-bottom:18px;
    flex-wrap:wrap;
}
.task-modal-tab{
    appearance:none;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
    color:var(--text-soft);
    padding:12px 16px;
    border-radius:999px;
    font-weight:700;
    cursor:pointer;
    transition:transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}
.task-modal-tab:hover{
    transform:translateY(-1px);
    border-color:rgba(255,204,0,.22);
    color:var(--text-main);
}
.task-modal-tab.is-active{
    background:linear-gradient(180deg, rgba(255,204,0,.96), rgba(234,170,0,.94));
    color:#1a1a1a;
    border-color:transparent;
    box-shadow:0 10px 24px rgba(255,204,0,.22);
}
.task-modal-panel.is-hidden{
    display:none;
}
.button.is-disabled,
.button:disabled{
    cursor:not-allowed;
    opacity:.58;
    box-shadow:none;
    filter:saturate(.55);
}
.button.is-disabled:hover,
.button:disabled:hover{
    transform:none;
}
html[data-theme="light"] .task-modal-tab{
    background:#ffffff;
}
@media (max-width: 768px){
    .task-modal-tabs{
        flex-direction:column;
    }
    .task-modal-tab,
    .task-list-unread{
        width:100%;
        justify-content:center;
    }
}

.button-danger{
    background:rgba(255,90,90,.12);
    border:1px solid rgba(255,90,90,.35);
    color:#ffb3b3;
}
.button-danger:hover{
    transform:translateY(-2px);
    background:rgba(255,90,90,.18);
}
.task-action-copy{
    margin:0 0 16px;
    color:var(--text-soft);
}

/* =========================
   Phase 4.7.6f feedback stacking hotfix
   ========================= */
#nexaFeedbackModal{
    z-index:1000;
}
#nexaFeedbackModal .nexa-modal__backdrop{
    z-index:0;
}
#nexaFeedbackModal .nexa-modal__dialog{
    position:relative;
    z-index:1;
}

.filters-bar--tasks{margin-bottom:20px}
.task-view-panel.is-hidden{display:none}
.task-board-empty,
.task-completed-empty{
    border:1px dashed var(--line-strong);
    border-radius:22px;
    padding:18px;
    color:var(--text-soft);
    background:rgba(255,255,255,.02);
}
.task-board-empty strong,
.task-completed-empty strong{display:block;color:var(--text);margin-bottom:8px}
.task-completed-panel{display:grid;gap:18px}
.task-completed-panel__copy{max-width:520px;color:var(--text-soft);margin:0}
.task-completed-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.task-card--completed{
    opacity:.82;
    filter:saturate(.78);
    background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
    border-color:rgba(255,255,255,.08);
}
.task-card--completed .task-card__project,
.task-card--completed .task-card__label,
.task-card--completed .task-card__details,
.data-list-item--completed .task-list-details,
.data-list-item--completed small,
.data-list-item--completed p{color:var(--text-soft)}
.task-card--completed .badge.completed,
.data-list-item--completed .badge.completed{
    background:rgba(255,255,255,.08);
    color:var(--text-soft);
    border-color:rgba(255,255,255,.14);
}
.inline-action-pill--success{
    background:rgba(102, 255, 178, .12);
    border:1px solid rgba(102, 255, 178, .22);
    color:#baffd9;
}
.inline-action-pill--success:hover{background:rgba(102, 255, 178, .18)}
.task-board-scroll{overflow-x:auto;padding-bottom:8px}
@media (max-width: 1280px){
    .task-board-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 860px){
    .task-completed-grid,.task-board-grid{grid-template-columns:1fr}
}


/* Phase 4.7.6k task workflow polish */
.filters-bar--tasks{margin-bottom:20px}
.filters-bar--tasks .filter-pill{
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.1);
    color:rgba(255,255,255,.88);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.filters-bar--tasks .filter-pill:hover{
    background:rgba(255,255,255,.08);
    border-color:rgba(255,255,255,.16);
}
.filters-bar--tasks .filter-pill.active{
    color:#111;
    border-color:transparent;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
}
html[data-theme="light"] .filters-bar--tasks .filter-pill{
    background:rgba(17,20,27,.05);
    border-color:rgba(17,20,27,.10);
    color:rgba(17,20,27,.82);
}
.task-completed-panel{margin-top:28px;padding-top:8px}
.task-completed-grid{align-items:start}
.nexa-modal__actions .button[data-delete-entity]{margin-left:auto}

/* Project detail refresh */
.hero-strip--project-detail{
    align-items:flex-start;
    gap:24px;
}
.project-summary-grid{
    flex:1;
    min-width:320px;
    display:grid;
    grid-template-columns:repeat(2,minmax(220px,1fr));
    gap:16px;
}
.project-summary-card,
.project-status-card,
.project-stat-card{
    background:linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.015));
    border:1px solid var(--line);
    border-radius:22px;
    padding:18px;
    min-height:160px;
}
.project-summary-card h4,
.project-status-card h4,
.project-stat-card h4{
    margin:8px 0 10px;
}
.project-summary-list{
    display:grid;
    gap:12px;
}
.project-summary-list small,
.project-status-card p,
.project-stat-card p{
    color:var(--text-soft);
}
.project-summary-list strong,
.project-stat-card h4,
.project-status-card h4{
    display:block;
    margin-top:4px;
}
.project-status-card{
    box-shadow:inset 0 0 0 1px rgba(255,204,0,0.08);
}
.project-status-card--planned{box-shadow:inset 0 0 0 1px rgba(255,204,0,0.18);}
.project-status-card--active,
.project-status-card--in-progress{box-shadow:inset 0 0 0 1px rgba(31,181,114,0.22);}
.project-status-card--internal-review,
.project-status-card--awaiting-client{box-shadow:inset 0 0 0 1px rgba(88,156,255,0.25);}
.project-status-card--blocked{box-shadow:inset 0 0 0 1px rgba(255,100,100,0.28);}
.project-status-card--completed{box-shadow:inset 0 0 0 1px rgba(164,164,164,0.24);}
.filters-bar--project-detail{
    flex-wrap:wrap;
}
.project-overview-grid{
    align-items:start;
}
.project-overview-stats{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:12px;
    margin-bottom:18px;
}
.project-mini-stat{
    padding:14px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,0.02);
}
.project-mini-stat strong{
    display:block;
    font-size:1.35rem;
    margin-bottom:6px;
}
.project-mini-stat small{
    color:var(--text-soft);
}
.project-summary-copy{
    margin-bottom:18px;
    color:var(--text-soft);
}
.project-update-form .textarea{
    min-height:140px;
}
.project-update-actions{
    display:flex;
    justify-content:flex-end;
    padding-top:8px;
}
.project-view-panel.is-hidden{
    display:none;
}
.timeline-list{
    display:grid;
    gap:14px;
}
.timeline-item--project{
    display:grid;
    grid-template-columns:120px 1fr auto;
    gap:16px;
    align-items:start;
    padding:16px 18px;
    border:1px solid var(--line);
    border-radius:20px;
    background:rgba(255,255,255,0.02);
}
.timeline-item--project strong{
    font-size:.95rem;
}
.timeline-item--project h4{
    margin:0 0 6px;
}
.timeline-item--project p{
    margin:0;
    color:var(--text-soft);
}
.project-calendar-groups{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}
.project-calendar-day{
    border:1px solid var(--line);
    border-radius:20px;
    padding:18px;
    background:rgba(255,255,255,0.02);
}
.project-calendar-day > strong{
    display:block;
    margin-bottom:12px;
}
.task-board-grid--project{
    align-items:start;
}
.button.is-loading{
    opacity:.8;
    pointer-events:none;
}
html[data-theme="light"] .project-summary-card,
html[data-theme="light"] .project-status-card,
html[data-theme="light"] .project-stat-card,
html[data-theme="light"] .project-mini-stat,
html[data-theme="light"] .timeline-item--project,
html[data-theme="light"] .project-calendar-day{
    background:#fff;
}
@media (max-width: 1200px){
    .project-summary-grid,
    .project-overview-stats{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media (max-width: 900px){
    .project-summary-grid,
    .project-overview-stats,
    .project-calendar-groups{
        grid-template-columns:1fr;
    }
    .timeline-item--project{
        grid-template-columns:1fr;
    }
}


/* Phase 4.8.6 project polish */
.filters-bar--project-detail .filter-pill{
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.12);
    color:rgba(255,255,255,.9);
}
.filters-bar--project-detail .filter-pill:hover{
    background:rgba(255,255,255,.1);
    border-color:rgba(255,255,255,.18);
}
.filters-bar--project-detail .filter-pill.active{
    color:#111;
    border-color:transparent;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
}
html[data-theme="light"] .filters-bar--project-detail .filter-pill{
    background:rgba(17,20,27,.05);
    border-color:rgba(17,20,27,.12);
    color:rgba(17,20,27,.82);
}
.hero-strip--project-detail{
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(340px,.9fr);
    gap:20px;
    align-items:start;
}
.hero-strip--project-detail .hero-strip-copy{display:flex;flex-direction:column;gap:10px}
.hero-strip--project-detail .hero-strip-copy h3{margin:4px 0 0}
.project-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-content:start}
.project-summary-card, .project-status-card, .project-stat-card{min-height:auto;padding:20px}
.project-status-card h4{font-size:1.65rem}
.project-stat-card h4{font-size:2rem;margin-bottom:8px}
.project-card-grid--board-only{grid-template-columns:repeat(2,minmax(0,1fr))}
.project-card--summary .project-card-summary{margin:2px 0 18px;color:var(--text-soft);max-width:62ch}
.project-card-meta--project-summary{margin-bottom:18px;grid-template-columns:repeat(4,minmax(0,1fr));display:grid;gap:14px}
.project-card-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}
.project-stat-tile{padding:14px 16px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.project-stat-tile small{display:block;color:var(--text-soft);margin-bottom:6px}
.project-stat-tile strong{font-size:1.45rem}
.project-overview-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.project-help-note{color:var(--text-soft)}
.stack-list--project-help .stack-item{background:rgba(255,255,255,.03)}
.task-row-actions{margin-top:14px;display:flex;justify-content:flex-end}
.task-card__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.project-task-preview-body{display:grid;gap:18px}
.project-task-preview-summary{padding:18px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.03);display:grid;gap:14px}
.project-task-preview-meta{display:flex;flex-wrap:wrap;gap:10px}
.project-task-preview-summary-copy h4{margin:0 0 8px;font-size:1.45rem}
.project-task-preview-summary-copy p{margin:0;color:var(--text-soft)}
.task-comments-panel--preview{max-height:none}
.task-comments-panel--preview .task-comments-list{display:grid;gap:12px}
.project-preview-comment-card{padding:14px 16px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.project-preview-comment-card__meta{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:8px}
.project-preview-comment-card__meta strong{font-size:.95rem}
.project-preview-comment-card__meta small{color:var(--text-soft)}
.project-preview-comment-card--blocker{border-color:rgba(255,99,99,.35);box-shadow:inset 0 0 0 1px rgba(255,99,99,.12)}
@media (max-width: 1280px){
  .hero-strip--project-detail{grid-template-columns:1fr}
  .project-card-meta--project-summary,.project-card-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 900px){
  .project-summary-grid,.project-overview-stats,.project-card-grid--board-only,.project-card-meta--project-summary,.project-card-stats-grid{grid-template-columns:1fr}
}

/* Phase 4.8.8 root button, client workspace, and portal polish */
.button-secondary{
    color:var(--text);
}
.button-ghost{
    color:var(--text-soft);
}
.hero-strip-actions{
    align-items:center;
    row-gap:12px;
}
.hero-strip-copy,
.page-head-row > div:first-child{
    min-width:0;
}
.hero-strip-actions .button{
    flex:0 0 auto;
    max-width:100%;
    white-space:nowrap;
}
.text-button-readable{
    color:var(--text) !important;
}
html[data-theme="dark"] .filter-pill,
html[data-theme="dark"] .button-secondary,
html[data-theme="dark"] .button-ghost{
    color:var(--text);
}
html[data-theme="dark"] .filter-pill.active{
    color:#111;
}

.client-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.client-card__head{
    align-items:flex-start;
}
.client-card__meta{
    margin-bottom:16px;
}
.client-card-stats{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-bottom:16px;
}
.client-card-stat{
    padding:14px 16px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.client-card-stat small{
    display:block;
    color:var(--text-soft);
    margin-bottom:6px;
    text-transform:uppercase;
    letter-spacing:.06em;
    font-size:.74rem;
}
.client-card-stat strong{
    font-size:1.45rem;
}
.client-card__notes{
    margin:0 0 18px;
    color:var(--text-soft);
}

.hero-strip--client-workspace{
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(340px,.95fr);
    gap:20px;
    align-items:start;
}
.client-workspace-summary-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.filters-bar--client-workspace .filter-pill{
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.12);
    color:rgba(255,255,255,.92);
}
.filters-bar--client-workspace .filter-pill:hover{
    background:rgba(255,255,255,.1);
    border-color:rgba(255,255,255,.18);
}
.filters-bar--client-workspace .filter-pill.active{
    color:#111;
    border-color:transparent;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
}
html[data-theme="light"] .filters-bar--client-workspace .filter-pill{
    background:rgba(17,20,27,.05);
    border-color:rgba(17,20,27,.12);
    color:rgba(17,20,27,.84);
}
.client-workspace-view-panel.is-hidden,
.client-portal-view-panel.is-hidden{
    display:none;
}
.client-overview-grid{
    align-items:start;
}
.client-health-stats-grid{
    margin-bottom:18px;
}
.client-health-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}
.client-health-grid--single{
    grid-template-columns:1fr;
}
.client-health-card{
    padding:18px;
    border-radius:22px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
    display:grid;
    gap:12px;
}
.client-health-card__head{
    display:flex;
    flex-direction:column;
    gap:6px;
}
.client-health-card__head strong{
    font-size:1.25rem;
}
.client-health-card p{
    margin:0;
}
.project-summary-card .project-summary-list strong,
.project-stat-card h4,
.project-status-card h4{
    word-break:break-word;
}
.project-summary-list div{
    min-width:0;
}
.project-card-grid--board-only{
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.project-card--summary{
    min-width:0;
}
.project-card-actions .button{
    min-width:0;
}
.project-summary-card,
.project-status-card,
.project-stat-card{
    overflow:hidden;
}
.project-summary-card h4,
.project-status-card h4,
.project-stat-card h4{
    line-height:1.12;
}
.task-chip{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:36px;
    padding:0 12px;
    border-radius:999px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
    color:var(--text-soft);
}
.project-preview-comment-card--blocker{
    border-color:rgba(255,93,124,.38);
    background:rgba(255,93,124,.08);
}
.status-chip-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}
.status-chip-card{
    padding:16px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.status-chip-card h4{
    margin:8px 0 6px;
}
.status-chip-card p{
    margin:0;
}
html[data-theme="light"] .client-card-stat,
html[data-theme="light"] .client-health-card,
html[data-theme="light"] .status-chip-card,
html[data-theme="light"] .task-chip{
    background:#fff;
}

@media (max-width: 1260px){
    .hero-strip--project-detail,
    .hero-strip--client-workspace{
        grid-template-columns:1fr;
    }
    .client-workspace-summary-grid,
    .project-summary-grid,
    .client-health-grid,
    .project-card-grid--board-only,
    .client-card-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media (max-width: 860px){
    .client-workspace-summary-grid,
    .client-health-grid,
    .status-chip-grid,
    .project-card-grid--board-only,
    .client-card-grid,
    .client-card-stats{
        grid-template-columns:1fr;
    }
    .hero-strip-actions .button{
        white-space:normal;
    }
}

.notice{
    padding:16px 18px;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.08);
    margin-bottom:18px;
    background:rgba(16,18,24,.78);
}
.notice--success{
    border-color:rgba(50,205,120,.28);
    background:rgba(10,44,26,.7);
}
.notice--error{
    border-color:rgba(255,92,92,.26);
    background:rgba(52,14,14,.76);
}
.approval-action-card{
    gap:14px;
}
.approval-action-card__head{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-start;
}
.approval-action-card__head p{
    margin:6px 0 0;
    color:var(--text-muted);
}
.approval-inline-form{
    display:grid;
    gap:12px;
}
.approval-inline-form__actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.portal-user-summary{
    display:grid;
    gap:12px;
}
.client-card-stat small,
.project-stat-tile small{
    display:block;
}
.text-button-readable{
    color:var(--text-primary);
}
html[data-theme="light"] .approval-action-card__head p,
html[data-theme="light"] .notice{
    color:#1f2937;
}


/* Phase 4.8.10 project/client polish + health logic */
.button,
.topbar-button,
.filter-pill,
.inline-action-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}
.button-secondary,
.button-ghost,
.button-secondary:visited,
.button-ghost:visited{
    color:var(--text) !important;
}
.hero-strip--project-detail{
    grid-template-columns:minmax(0, 1.22fr) minmax(360px, .78fr);
    align-items:start;
}
.hero-strip--project-detail .hero-strip-copy,
.page-head-row > div:first-child{
    min-width:0;
}
.hero-strip--project-detail .hero-strip-actions,
.page-head-row .hero-strip-actions{
    align-items:flex-start;
    justify-content:flex-start;
    width:100%;
}
.hero-strip--project-detail .hero-strip-actions .button,
.page-head-row .hero-strip-actions .button{
    flex:0 1 auto;
    min-width:0;
    max-width:100%;
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
    line-height:1.18;
}
.hero-strip--project-detail .project-summary-grid{
    align-self:start;
}
.filters-bar--project-detail .filter-pill,
.filters-bar--client-workspace .filter-pill{
    color:var(--text);
}
html[data-theme="dark"] .filters-bar--project-detail .filter-pill,
html[data-theme="dark"] .filters-bar--client-workspace .filter-pill,
html[data-theme="dark"] .filters-bar--tasks .filter-pill{
    background:rgba(255,255,255,.04);
    color:var(--text) !important;
    border-color:var(--line-strong);
}
html[data-theme="dark"] .filters-bar--project-detail .filter-pill:hover,
html[data-theme="dark"] .filters-bar--client-workspace .filter-pill:hover,
html[data-theme="dark"] .filters-bar--tasks .filter-pill:hover,
html[data-theme="dark"] .button-secondary:hover,
html[data-theme="dark"] .button-ghost:hover{
    color:var(--text) !important;
    border-color:rgba(255,255,255,.16);
    background:rgba(255,255,255,.06);
}
html[data-theme="dark"] .filters-bar--project-detail .filter-pill.active,
html[data-theme="dark"] .filters-bar--client-workspace .filter-pill.active,
html[data-theme="dark"] .filters-bar--tasks .filter-pill.active{
    color:#111 !important;
}
.badge.attention-needed,
.badge.status-attention-needed,
.project-status-card--attention-needed{
    box-shadow:inset 0 0 0 1px rgba(255,170,0,.26);
}
.badge.at-risk,
.badge.status-at-risk,
.project-status-card--at-risk{
    box-shadow:inset 0 0 0 1px rgba(255,100,100,.3);
}
.badge.healthy,
.badge.status-healthy,
.project-status-card--healthy{
    box-shadow:inset 0 0 0 1px rgba(31,181,114,.22);
}
@media (max-width: 1280px){
    .hero-strip--project-detail{
        grid-template-columns:1fr;
    }
}

/* Phase 4.8.11 root tab fix + retainer module */
.filter-pill,
.filter-pill:visited,
.button-secondary,
.button-secondary:visited,
.button-ghost,
.button-ghost:visited{
    color:var(--text) !important;
    -webkit-text-fill-color:currentColor;
}
.filter-pill{
    background:rgba(255,255,255,.04) !important;
    border:1px solid var(--line-strong) !important;
}
.filter-pill:hover,
.button-secondary:hover,
.button-ghost:hover{
    color:var(--text) !important;
    -webkit-text-fill-color:currentColor;
}
.filter-pill.active{
    background:linear-gradient(135deg,var(--accent),var(--accent-2)) !important;
    border-color:transparent !important;
    color:#111 !important;
    -webkit-text-fill-color:#111 !important;
}
html[data-theme="light"] .filter-pill,
html[data-theme="light"] .button-secondary,
html[data-theme="light"] .button-ghost{
    color:var(--text) !important;
    -webkit-text-fill-color:currentColor;
}

.filters-bar--retainers{
    margin-bottom:22px;
}
.retainer-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.retainer-card__badges{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px;
}
.retainer-card__usage-grid{
    margin-bottom:18px;
}
.project-summary-grid--retainers{
    margin-bottom:18px;
}
.badge.active,
.badge.status-active{
    color:#d7f6e7;
    background:rgba(40,167,111,.14);
    border-color:rgba(40,167,111,.28);
}
.badge.paused,
.badge.status-paused{
    color:#f7df9e;
    background:rgba(212,168,60,.14);
    border-color:rgba(212,168,60,.28);
}
.badge.completed,
.badge.status-completed{
    color:#c7cad7;
    background:rgba(141,148,167,.16);
    border-color:rgba(141,148,167,.28);
}
.badge.healthy,
.badge.status-healthy{
    color:#cfeeda;
    background:rgba(62,168,110,.12);
    border-color:rgba(62,168,110,.24);
}
.badge.attention-needed,
.badge.status-attention-needed{
    color:#ffe2a4;
    background:rgba(217,150,33,.16);
    border-color:rgba(217,150,33,.28);
}
.badge.at-risk,
.badge.status-at-risk{
    color:#ffd3d3;
    background:rgba(203,66,66,.16);
    border-color:rgba(203,66,66,.28);
}
@media (max-width: 1180px){
    .retainer-card-grid{
        grid-template-columns:1fr;
    }
}

.template-card-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}
.template-card{
    display:grid;
    gap:16px;
    padding:20px;
    border-radius:24px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.template-card__head{
    display:flex;
    justify-content:space-between;
    gap:14px;
    align-items:flex-start;
}
.template-card__head h3{
    margin:10px 0 0;
    font-size:1.26rem;
}
.template-card__summary{
    margin:0;
    color:var(--text-soft);
    line-height:1.65;
}
.template-card__meta{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.template-card__meta small{
    display:block;
    margin-bottom:6px;
    font-size:.78rem;
    text-transform:uppercase;
    letter-spacing:.06em;
}
.template-card__actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}
.task-template-wizard{
    display:grid;
    gap:18px;
    margin-bottom:18px;
}
.task-template-wizard__steps{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}
.task-template-wizard__step{
    min-height:44px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
    color:var(--text-soft);
    font-weight:800;
    cursor:default;
}
.task-template-wizard__step.is-active{
    color:#111;
    border-color:transparent;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
}
.task-template-step-panel{
    display:grid;
    gap:18px;
}
.task-template-source-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.task-template-source-card{
    display:grid;
    gap:10px;
    padding:20px;
    border-radius:22px;
    border:1px solid var(--line);
    background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));
    color:var(--text-soft);
    text-align:left;
    cursor:pointer;
    transition:border-color .22s ease,background .22s ease,transform .22s ease,box-shadow .22s ease;
}
.task-template-source-card strong{
    font-size:1.15rem;
    color:var(--text);
}
.task-template-source-card p{margin:0}
.task-template-source-card:hover{
    transform:translateY(-2px);
    border-color:rgba(255,204,0,.22);
}
.task-template-source-card.is-active{
    border-color:rgba(255,204,0,.42);
    background:linear-gradient(180deg,rgba(255,204,0,.12),rgba(255,153,0,.05));
    box-shadow:0 20px 34px rgba(0,0,0,.18);
}
.task-template-source-card.is-disabled,
.task-template-source-card[aria-disabled="true"]{
    opacity:.5;
    cursor:not-allowed;
}
.task-template-preview,
.task-template-inline-banner{
    border-radius:22px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.task-template-preview{
    min-height:100%;
    display:grid;
    align-content:start;
    gap:10px;
    padding:18px;
}
.task-template-preview__meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}
.task-template-preview__meta span{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(255,255,255,.05);
    border:1px solid var(--line);
    font-size:.85rem;
    color:var(--text-soft);
}
.task-template-inline-banner{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:18px;
    margin-bottom:18px;
}
.task-template-inline-banner p{
    margin:6px 0 0;
    color:var(--text-soft);
    line-height:1.55;
}
html[data-theme="light"] .template-card,
html[data-theme="light"] .task-template-preview,
html[data-theme="light"] .task-template-inline-banner,
html[data-theme="light"] .task-template-source-card{
    background:#fff;
}
@media (max-width: 960px){
    .template-card-grid,
    .task-template-source-grid{
        grid-template-columns:1fr;
    }
    .template-card__meta{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media (max-width: 768px){
    .task-template-wizard__steps{
        flex-direction:column;
    }
    .task-template-wizard__step,
    .task-template-inline-banner,
    .template-card__actions .button{
        width:100%;
    }
    .task-template-inline-banner{
        flex-direction:column;
    }
    .template-card__meta{
        grid-template-columns:1fr;
    }
}

/* =========================
   Phase 4.9 retainers + calendar polish
   ========================= */
.selection-card-group{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.selection-card-group--two{
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.selection-card{
    position:relative;
    display:block;
}
.selection-card input{
    position:absolute;
    inset:0;
    opacity:0;
    pointer-events:none;
}
.selection-card__content{
    min-height:96px;
    display:grid;
    gap:8px;
    align-content:flex-start;
    padding:16px 18px;
    border-radius:20px;
    border:1px solid var(--line);
    background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));
    color:var(--text-soft);
    cursor:pointer;
    transition:border-color .22s ease,background .22s ease,transform .22s ease,box-shadow .22s ease,color .22s ease;
}
.selection-card__content strong{
    color:var(--text);
    font-size:1rem;
}
.selection-card__content small{
    color:var(--text-soft);
    line-height:1.5;
}
.selection-card:hover .selection-card__content,
.selection-card input:focus-visible + .selection-card__content{
    transform:translateY(-1px);
    border-color:rgba(255,204,0,.26);
}
.selection-card input:checked + .selection-card__content{
    border-color:rgba(255,204,0,.42);
    background:linear-gradient(180deg,rgba(255,204,0,.12),rgba(255,153,0,.06));
    box-shadow:0 16px 32px rgba(0,0,0,.18);
    color:var(--text);
}
html[data-theme="light"] .selection-card__content{
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.94));
}
html[data-theme="light"] .selection-card input:checked + .selection-card__content{
    background:linear-gradient(180deg,rgba(255,204,0,.12),rgba(255,255,255,.98));
    box-shadow:0 14px 28px rgba(17,20,27,.08);
}
.toggle-row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:16px 18px;
    border-radius:20px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.toggle-row span{
    display:grid;
    gap:4px;
}
.toggle-row strong{
    display:block;
    font-size:.98rem;
}
.toggle-row small{
    color:var(--text-soft);
    line-height:1.5;
}
.toggle-row input[type="checkbox"]{
    appearance:none;
    -webkit-appearance:none;
    width:54px;
    height:30px;
    border-radius:999px;
    border:1px solid var(--line-strong);
    background:rgba(255,255,255,.08);
    position:relative;
    margin:0;
    flex:0 0 54px;
    cursor:pointer;
    transition:border-color .22s ease,background .22s ease,box-shadow .22s ease;
}
.toggle-row input[type="checkbox"]::after{
    content:'';
    position:absolute;
    top:3px;
    left:4px;
    width:22px;
    height:22px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 4px 10px rgba(0,0,0,.2);
    transition:transform .22s ease;
}
.toggle-row input[type="checkbox"]:checked{
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
    border-color:transparent;
    box-shadow:0 0 0 4px rgba(255,204,0,.08);
}
.toggle-row input[type="checkbox"]:checked::after{
    transform:translateX(24px);
}
.toggle-row input[type="checkbox"]:disabled{
    opacity:.52;
    cursor:not-allowed;
}
html[data-theme="light"] .toggle-row{
    background:rgba(255,255,255,.94);
}
html[data-theme="light"] .toggle-row input[type="checkbox"]{
    background:rgba(17,20,27,.08);
}
.currency-shell{
    display:flex;
    align-items:center;
    min-height:52px;
    border-radius:16px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    overflow:hidden;
}
.currency-shell--compact{
    min-height:48px;
}
.currency-shell__prefix{
    min-width:52px;
    align-self:stretch;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    color:var(--accent);
    background:rgba(255,255,255,.04);
    border-right:1px solid var(--line);
}
.currency-shell .input{
    border:0;
    background:transparent;
    min-height:50px;
    box-shadow:none;
}
.currency-shell .input:focus{
    box-shadow:none;
}
html[data-theme="light"] .currency-shell{
    background:#fff;
}
html[data-theme="light"] .currency-shell__prefix{
    background:rgba(17,20,27,.03);
}
.retainer-wizard{
    display:grid;
    gap:18px;
}
.retainer-wizard__steps{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}
.retainer-wizard__step{
    min-height:44px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
    color:var(--text-soft);
    font-weight:800;
    cursor:default;
}
.retainer-wizard__step.is-active{
    color:#111;
    border-color:transparent;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
}
.retainer-step-panel{
    display:grid;
    gap:18px;
}
.retainer-source-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.retainer-source-card{
    display:grid;
    gap:10px;
    padding:20px;
    border-radius:22px;
    border:1px solid var(--line);
    background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));
    color:var(--text-soft);
    text-align:left;
    cursor:pointer;
    transition:border-color .22s ease,background .22s ease,transform .22s ease,box-shadow .22s ease;
}
.retainer-source-card strong{
    font-size:1.15rem;
    color:var(--text);
}
.retainer-source-card p{
    margin:0;
}
.retainer-source-card:hover{
    transform:translateY(-2px);
    border-color:rgba(255,204,0,.22);
}
.retainer-source-card.is-active{
    border-color:rgba(255,204,0,.42);
    background:linear-gradient(180deg,rgba(255,204,0,.12),rgba(255,153,0,.05));
    box-shadow:0 20px 34px rgba(0,0,0,.18);
}
.retainer-source-card.is-disabled,
.retainer-source-card[aria-disabled="true"]{
    opacity:.5;
    cursor:not-allowed;
}
.retainer-package-picker{
    align-items:start;
}
.retainer-package-preview,
.retainer-inline-banner,
.retainer-save-package-box,
.retainer-value-summary,
.retainer-breakdown-block,
.retainer-channel-board,
.retainer-card__usage-grid > div{
    border-radius:22px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.retainer-package-preview,
.retainer-value-summary,
.retainer-save-package-box,
.retainer-breakdown-block{
    padding:18px;
}
.retainer-package-preview{
    min-height:100%;
    display:grid;
    align-content:start;
    gap:10px;
}
.retainer-package-preview strong,
.retainer-value-summary strong,
.retainer-inline-banner strong,
.retainer-save-package-box strong,
.retainer-breakdown-block__head strong{
    display:block;
    font-size:1rem;
}
.retainer-package-preview p,
.retainer-value-summary p,
.retainer-inline-banner p,
.retainer-save-package-box p,
.retainer-breakdown-block__head p{
    margin:0;
}
.retainer-inline-banner{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:18px;
    background:linear-gradient(135deg,rgba(255,204,0,.12),rgba(255,255,255,.03));
}
.retainer-edit-only .select{
    background-color:rgba(255,255,255,.05);
}
.retainer-cycle-pills{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.retainer-cycle-pill{
    position:relative;
}
.retainer-cycle-pill input{
    position:absolute;
    inset:0;
    opacity:0;
    pointer-events:none;
}
.retainer-cycle-pill span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
    color:var(--text-soft);
    font-weight:800;
    cursor:pointer;
    transition:border-color .22s ease,background .22s ease,color .22s ease,transform .22s ease,box-shadow .22s ease;
}
.retainer-cycle-pill.is-active span,
.retainer-cycle-pill input:checked + span{
    color:#111;
    border-color:transparent;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
    box-shadow:0 12px 24px rgba(255,204,0,.18);
}
.retainer-financial-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px 16px;
    margin-top:6px;
    align-items:start;
}
.retainer-value-summary{
    display:grid;
    gap:10px;
    align-content:start;
}
.retainer-breakdown-block{
    display:grid;
    gap:14px;
}
.retainer-breakdown-block__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}
.retainer-breakdown-rows{
    display:grid;
    gap:12px;
}
.retainer-breakdown-row{
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(180px,.95fr) minmax(0,1fr) 48px;
    gap:12px;
    align-items:center;
    padding:14px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.025);
}
.retainer-breakdown-rows[data-retainer-breakdown-rows="budget"] .retainer-breakdown-row{
    grid-template-columns:minmax(0,1.2fr) minmax(180px,.95fr) 48px;
}
.retainer-breakdown-row__remove{
    width:44px;
    height:44px;
    border-radius:14px;
    border:1px solid rgba(255,93,124,.18);
    background:rgba(255,93,124,.08);
    color:#ffb9c8;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}
.retainer-breakdown-total{
    color:var(--text-soft);
    font-weight:700;
}
.retainer-channel-board{
    display:grid;
    gap:12px;
    padding:16px;
}
.retainer-channel-board__grid{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.retainer-channel-chip{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:38px;
    padding:0 12px;
    border-radius:999px;
    border:1px solid rgba(255,204,0,.16);
    background:rgba(255,204,0,.08);
    color:var(--text);
    font-size:.83rem;
    font-weight:700;
}
.retainer-card{
    display:grid;
    gap:18px;
}
.retainer-card__package-line{
    margin:6px 0 0;
    color:var(--text-soft);
    font-size:.9rem;
}
.retainer-card__badges{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    justify-content:flex-end;
}
.retainer-card__usage-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.retainer-card__usage-grid > div{
    padding:14px;
}
.retainer-card__usage-grid small{
    display:block;
    margin-bottom:8px;
    color:var(--text-muted);
    text-transform:uppercase;
    letter-spacing:.06em;
    font-size:.72rem;
}
.retainer-card__usage-grid strong{
    font-size:1.05rem;
}
.nexa-date-picker{
    position:absolute;
    z-index:160;
    width:292px;
    padding:14px;
    border-radius:22px;
    border:1px solid var(--line);
    background:linear-gradient(180deg,rgba(16,17,21,.98),rgba(8,8,10,.98));
    box-shadow:0 26px 60px rgba(0,0,0,.34);
    display:none;
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
}
.nexa-date-picker.is-open{
    display:block;
}
.nexa-date-picker__head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:12px;
}
.nexa-date-picker__head strong{
    font-size:1rem;
}
.nexa-date-picker__nav{
    width:36px;
    height:36px;
    border-radius:12px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:var(--text);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}
.nexa-date-picker__weekdays,
.nexa-date-picker__grid{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:6px;
}
.nexa-date-picker__weekdays{
    margin-bottom:10px;
}
.nexa-date-picker__weekdays span{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    color:var(--text-muted);
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.05em;
    text-transform:uppercase;
}
.nexa-date-picker__day{
    min-height:36px;
    border-radius:12px;
    border:1px solid transparent;
    background:rgba(255,255,255,.03);
    color:var(--text);
    font-weight:700;
    cursor:pointer;
    transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease;
}
.nexa-date-picker__day:hover{
    transform:translateY(-1px);
    border-color:rgba(255,204,0,.24);
}
.nexa-date-picker__day.is-muted{
    color:var(--text-muted);
    opacity:.72;
}
.nexa-date-picker__day.is-today{
    border-color:rgba(255,204,0,.32);
    color:var(--accent);
}
.nexa-date-picker__day.is-selected{
    color:#111;
    border-color:transparent;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
}
.nexa-date-picker__day.is-disabled,
.nexa-date-picker__day:disabled{
    opacity:.3;
    cursor:not-allowed;
}
.nexa-date-picker__actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:12px;
}
.nexa-date-picker__actions button{
    min-height:34px;
    padding:0 10px;
    border-radius:10px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
    color:var(--text-soft);
    font-weight:700;
    cursor:pointer;
}
html[data-theme="light"] .retainer-source-card,
html[data-theme="light"] .retainer-package-preview,
html[data-theme="light"] .retainer-inline-banner,
html[data-theme="light"] .retainer-save-package-box,
html[data-theme="light"] .retainer-value-summary,
html[data-theme="light"] .retainer-breakdown-block,
html[data-theme="light"] .retainer-channel-board,
html[data-theme="light"] .retainer-card__usage-grid > div,
html[data-theme="light"] .retainer-breakdown-row,
html[data-theme="light"] .nexa-date-picker{
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.94));
}
html[data-theme="light"] .retainer-inline-banner{
    background:linear-gradient(180deg,rgba(255,248,219,.96),rgba(255,255,255,.98));
}
@media (max-width:960px){
    .selection-card-group,
    .selection-card-group--two,
    .retainer-source-grid,
    .retainer-financial-grid{
        grid-template-columns:1fr;
    }
    .retainer-breakdown-row,
    .retainer-breakdown-rows[data-retainer-breakdown-rows="budget"] .retainer-breakdown-row{
        grid-template-columns:1fr;
    }
    .retainer-breakdown-row__remove{
        width:100%;
    }
    .retainer-inline-banner,
    .retainer-breakdown-block__head{
        flex-direction:column;
    }
}
@media (max-width:768px){
    .retainer-wizard__steps{
        display:grid;
        grid-template-columns:1fr;
    }
    .retainer-wizard__step{
        justify-content:center;
    }
    .retainer-card__badges,
    .retainer-cycle-pills,
    .retainer-channel-board__grid{
        justify-content:flex-start;
    }
    .nexa-date-picker{
        width:min(292px, calc(100vw - 20px));
    }
}

/* =========================
   Phase 4.10.2 rich selects, client logos, approval routing
   ========================= */
.rich-select-native{
    position:absolute !important;
    opacity:0 !important;
    pointer-events:none !important;
    width:1px !important;
    height:1px !important;
    overflow:hidden !important;
}
.rich-picker{
    position:relative;
    margin-top:10px;
}
.rich-picker__trigger{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    min-height:58px;
    padding:14px 16px;
    border-radius:18px;
    border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
    color:var(--text);
    cursor:pointer;
    transition:border-color .18s ease, transform .18s ease, background .18s ease;
}
.rich-picker__trigger:hover{
    border-color:rgba(255,204,0,.38);
    background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
}
.rich-picker__trigger-copy{
    min-width:0;
    display:flex;
    align-items:center;
    gap:12px;
}
.rich-picker__copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:4px;
    text-align:left;
}
.rich-picker__copy strong,
.rich-picker__copy small{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.rich-picker__copy small{
    color:var(--text-soft);
}
.rich-picker__media{
    flex:0 0 auto;
}
.rich-picker__image,
.entity-inline__image{
    width:36px;
    height:36px;
    border-radius:50%;
    object-fit:cover;
    display:block;
    border:1px solid rgba(255,255,255,.12);
    background:rgba(255,255,255,.05);
}
.rich-picker__image--logo,
.entity-inline__image--logo{
    border-radius:12px;
    object-fit:contain;
    padding:6px;
    background:rgba(255,255,255,.06);
}
.rich-picker__fallback,
.entity-inline__avatar{
    width:36px;
    height:36px;
    border-radius:50%;
    display:grid;
    place-items:center;
    font-size:.76rem;
    font-weight:800;
    letter-spacing:.04em;
    color:#111;
    background:linear-gradient(135deg, var(--accent), rgba(255,204,0,.72));
}
.rich-picker__fallback--logo,
.entity-inline__avatar--logo{
    border-radius:12px;
}
.rich-picker__menu{
    position:absolute;
    left:0;
    right:0;
    top:calc(100% + 10px);
    z-index:25;
    padding:8px;
    border-radius:20px;
    border:1px solid var(--line);
    background:rgba(11,14,24,.98);
    box-shadow:0 26px 60px rgba(0,0,0,.38);
    max-height:320px;
    overflow:auto;
}
.rich-picker__menu.is-hidden{
    display:none;
}
.rich-picker__option{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:12px 14px;
    border:0;
    border-radius:16px;
    background:transparent;
    color:var(--text);
    cursor:pointer;
    text-align:left;
}
.rich-picker__option:hover,
.rich-picker__option.is-selected{
    background:rgba(255,255,255,.06);
}
.rich-picker__option-main{
    min-width:0;
    display:flex;
    align-items:center;
    gap:12px;
}
.rich-picker__option-copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:3px;
}
.rich-picker__option-copy strong,
.rich-picker__option-copy small{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.rich-picker__option-copy small,
.rich-picker__option-check{
    color:var(--text-soft);
}
.entity-inline{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-width:0;
}
.entity-inline > span:last-child{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.project-card__manager,
.project-card__client{
    display:flex;
    align-items:center;
    gap:10px;
}
.project-card__client-copy,
.project-card__manager-copy{
    display:flex;
    flex-direction:column;
    gap:3px;
}
.project-card__manager-copy small,
.project-card__client-copy small{
    color:var(--text-soft);
}
.task-context-approval-route{
    margin-top:12px;
    padding:14px 16px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.task-context-approval-route strong{
    display:block;
    margin-bottom:5px;
}
.nexa-modal__dialog--small{
    max-width:560px;
}
html[data-theme="light"] .rich-picker__menu{
    background:rgba(255,255,255,.98);
}
html[data-theme="light"] .task-context-approval-route{
    background:#fff;
}
@media (max-width: 720px){
    .rich-picker__trigger,
    .rich-picker__option{
        padding:12px 13px;
    }
}

/* =========================
   Phase 4.10.3 Fixes
   ========================= */
.client-card__badges{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.badge--retainer-live{
    background:rgba(255,194,15,.12);
    color:var(--accent-primary);
    border:1px solid rgba(255,194,15,.3);
}
.retainer-package-admin{
    margin-top:28px;
}
.template-card-grid--retainer-packages{
    margin-top:18px;
}
.retainer-custom-end-toggle{
    margin-bottom:12px;
}
.form-field.is-disabled{
    opacity:.56;
}
.form-field.is-disabled .input,
.form-field.is-disabled .select,
.form-field.is-disabled .textarea{
    background:rgba(255,255,255,.025);
    cursor:not-allowed;
}
.form-field.is-disabled .field-help{
    color:var(--text-dim);
}
.date-shell{
    position:relative;
}
.date-shell .input{
    padding-right:64px;
}
.date-shell__trigger{
    position:absolute;
    top:50%;
    right:12px;
    transform:translateY(-50%);
}
.date-shell.is-disabled{
    opacity:.58;
}
.date-shell.is-disabled .input{
    cursor:not-allowed;
}
.date-shell.is-disabled .date-shell__trigger{
    opacity:.45;
    pointer-events:none;
}
.empty-state--compact{
    margin-top:14px;
}
html[data-theme="light"] .badge--retainer-live{
    background:rgba(255,194,15,.16);
    border-color:rgba(255,194,15,.35);
}


/* Phase 4.10.5 retainer/package spacing + allocation rules */
.retainer-step-panel[data-retainer-step="details"]{
    display:grid;
    gap:24px;
}
.retainer-step-panel[data-retainer-step="details"] .form-grid,
.retainer-step-panel[data-retainer-step="details"] .retainer-financial-grid,
.retainer-step-panel[data-retainer-step="details"] .retainer-breakdown-block{
    margin-top:0;
}
.retainer-financial-grid{
    gap:22px 18px;
}
.retainer-value-summary,
.retainer-breakdown-block{
    margin-top:6px;
}
.retainer-breakdown-block{
    gap:16px;
}
.retainer-breakdown-block__head{
    gap:16px;
    margin-bottom:2px;
}
.retainer-breakdown-rows{
    gap:14px;
}
.retainer-breakdown-row{
    padding:16px;
    gap:14px;
}
.retainer-breakdown-total{
    margin-top:2px;
    color:var(--text-soft);
    font-weight:700;
}
.retainer-breakdown-row .select:disabled,
.retainer-breakdown-row .input:disabled{
    opacity:.62;
    cursor:not-allowed;
}
.retainer-breakdown-block .button[disabled]{
    opacity:.58;
    cursor:not-allowed;
    pointer-events:none;
}
@media (max-width: 900px){
    .retainer-step-panel[data-retainer-step="details"]{
        gap:20px;
    }
    .retainer-financial-grid{
        gap:18px;
    }
}


/* Phase 4.10.6 restore panels + client logo upload */
.archived-list-panel{
    margin-top:28px;
}
.archived-entity-list{
    display:grid;
    gap:14px;
    margin-top:18px;
}
.archived-entity-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:16px 18px;
    border-radius:20px;
    border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
}
.archived-entity-row strong{
    display:block;
    margin-bottom:5px;
}
.archived-entity-row p{
    margin:0;
    color:var(--text-soft);
}
.archived-entity-row__actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.client-logo-upload{
    display:grid;
    grid-template-columns:160px minmax(0,1fr);
    gap:18px;
    align-items:start;
}
.client-logo-upload__preview{
    min-height:144px;
    border-radius:22px;
    border:1px solid rgba(255,204,0,.24);
    background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
    display:grid;
    place-items:center;
    padding:18px;
    position:relative;
    overflow:hidden;
}
.client-logo-upload__image{
    max-width:100%;
    max-height:88px;
    object-fit:contain;
}
.client-logo-upload__image.is-hidden{
    display:none;
}
.client-logo-upload__fallback{
    color:var(--text-soft);
    font-weight:700;
    text-align:center;
}
.client-logo-upload__fallback.is-hidden{
    display:none;
}
.client-logo-upload__controls{
    display:grid;
    gap:12px;
}
.client-logo-upload__input{
    position:absolute;
    opacity:0;
    pointer-events:none;
    width:1px;
    height:1px;
}
.client-logo-upload__button{
    width:max-content;
}
.client-logo-upload__url{
    margin-top:2px;
    display:grid;
    gap:4px;
}
.client-logo-upload__url strong{
    font-size:.92rem;
}
.client-logo-upload__url small{
    color:var(--text-soft);
    line-height:1.5;
    word-break:break-word;
}
.portal-brand-mark{
    display:inline-flex;
    align-items:center;
    gap:12px;
    margin-bottom:14px;
}
.portal-brand-mark img{
    width:54px;
    height:54px;
    object-fit:contain;
    border-radius:18px;
    padding:8px;
    background:rgba(255,255,255,.06);
    border:1px solid var(--line-strong);
}
.portal-brand-mark strong{
    display:block;
    font-size:1rem;
}
.retainer-financial-grid{
    gap:26px 18px;
    margin-top:10px;
}
.retainer-breakdown-block{
    padding:20px;
    border-radius:24px;
    border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.018));
}
.retainer-breakdown-block__head{
    margin-bottom:6px;
}
.retainer-breakdown-total{
    padding-top:4px;
}
.retainer-step-panel[data-retainer-step="details"] .form-field > label,
.retainer-step-panel[data-retainer-step="details"] .form-field .field-help{
    display:block;
}
@media (max-width: 860px){
    .client-logo-upload,
    .archived-entity-row{
        grid-template-columns:1fr;
        display:grid;
    }
    .archived-entity-row{
        align-items:flex-start;
    }
    .client-logo-upload__button{
        width:100%;
    }
}


/* Phase 4.10.7 project templates + logo polish */
.client-card__head > div:first-child{min-width:0;}
.client-card__head .entity-inline{display:flex;align-items:center;gap:14px;min-width:0;}
.client-card__head .entity-inline span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.client-logo-upload__preview{background:linear-gradient(180deg, rgba(255,204,0,.08), rgba(255,255,255,.02));box-shadow:inset 0 0 0 1px rgba(255,204,0,.12);}
.client-logo-upload__preview.is-empty{background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.012));}
.client-logo-upload__image{max-width:100%;max-height:94px;object-fit:contain;display:block;margin-inline:auto;}
.client-logo-upload__fallback{max-width:112px;line-height:1.35;}
.rich-picker__trigger,.rich-picker__option{min-height:64px;}
.rich-picker__option{justify-content:flex-start;align-items:center;}
.rich-picker__option-main{width:100%;display:flex;align-items:center;gap:12px;min-width:0;}
.rich-picker__option-copy{min-width:0;display:flex;flex-direction:column;gap:3px;justify-content:center;}
.rich-picker__image--logo,.entity-inline__image--logo{width:40px;height:40px;border-radius:14px;padding:7px;background:rgba(255,255,255,.03);}
.project-template-wizard{display:grid;gap:22px;}
.project-template-wizard__steps{display:flex;gap:12px;flex-wrap:wrap;}
.project-template-wizard__step{min-width:132px;padding:12px 18px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--text-soft);font-weight:700;}
.project-template-wizard__step.is-active{background:linear-gradient(135deg, rgba(255,204,0,.98), rgba(255,184,0,.92));color:#111;border-color:transparent;box-shadow:0 14px 26px rgba(255,204,0,.18);}
.project-template-step-panel{display:grid;gap:22px;}
.retainer-step-panel[data-retainer-step="details"] .retainer-financial-grid + .form-grid,.retainer-financial-grid + .form-grid,.retainer-financial-grid + .retainer-breakdown-block{margin-top:12px;}
.retainer-step-panel[data-retainer-step="details"] .form-grid .form-field > label,.retainer-step-panel[data-retainer-step="details"] .retainer-financial-grid .form-field > label,.retainer-step-panel[data-retainer-step="details"] .retainer-breakdown-block + .form-field > label{margin-bottom:10px;}
.retainer-breakdown-block + .form-field{margin-top:18px;}
.retainer-breakdown-block + .form-field .field-help{margin-top:10px;}


/* Phase 4.10.8 core badge readability + project/template cleanup */
.badge{
    --badge-fg: var(--text);
    --badge-bg: rgba(255,255,255,.06);
    --badge-border: rgba(255,255,255,.16);
    color: var(--badge-fg);
    background: var(--badge-bg);
    border-color: var(--badge-border);
}
.badge.active,
.badge.status-active{
    --badge-fg:#d7f6e7;
    --badge-bg:rgba(40,167,111,.14);
    --badge-border:rgba(40,167,111,.28);
}
.badge.paused,
.badge.status-paused{
    --badge-fg:#f7df9e;
    --badge-bg:rgba(212,168,60,.14);
    --badge-border:rgba(212,168,60,.28);
}
.badge.completed,
.badge.status-completed{
    --badge-fg:#c7cad7;
    --badge-bg:rgba(141,148,167,.16);
    --badge-border:rgba(141,148,167,.28);
}
.badge.healthy,
.badge.status-healthy{
    --badge-fg:#cfeeda;
    --badge-bg:rgba(62,168,110,.12);
    --badge-border:rgba(62,168,110,.24);
}
.badge.attention-needed,
.badge.status-attention-needed{
    --badge-fg:#ffe2a4;
    --badge-bg:rgba(217,150,33,.16);
    --badge-border:rgba(217,150,33,.28);
}
.badge.at-risk,
.badge.status-at-risk{
    --badge-fg:#ffd3d3;
    --badge-bg:rgba(203,66,66,.16);
    --badge-border:rgba(203,66,66,.28);
}
.badge--retainer-live{
    --badge-fg: var(--accent-primary);
    --badge-bg: rgba(255,194,15,.12);
    --badge-border: rgba(255,194,15,.3);
}
html[data-theme="light"] .badge.active,
html[data-theme="light"] .badge.status-active{
    --badge-fg:#16643f;
    --badge-bg:rgba(44,207,134,.16);
    --badge-border:rgba(44,207,134,.32);
}
html[data-theme="light"] .badge.paused,
html[data-theme="light"] .badge.status-paused,
html[data-theme="light"] .badge.attention-needed,
html[data-theme="light"] .badge.status-attention-needed,
html[data-theme="light"] .badge.awaiting-client,
html[data-theme="light"] .badge.pending-internal,
html[data-theme="light"] .badge.ready-for-approval,
html[data-theme="light"] .badge.changes-requested,
html[data-theme="light"] .badge.attention,
html[data-theme="light"] .badge.planned{
    --badge-fg:#7b4a00;
    --badge-bg:rgba(255,181,71,.18);
    --badge-border:rgba(255,181,71,.34);
}
html[data-theme="light"] .badge.completed,
html[data-theme="light"] .badge.status-completed{
    --badge-fg:#384152;
    --badge-bg:rgba(80,92,116,.12);
    --badge-border:rgba(80,92,116,.2);
}
html[data-theme="light"] .badge.healthy,
html[data-theme="light"] .badge.status-healthy,
html[data-theme="light"] .badge.in-progress,
html[data-theme="light"] .badge.internal-review,
html[data-theme="light"] .badge.on-track,
html[data-theme="light"] .badge.approved,
html[data-theme="light"] .badge.done{
    --badge-fg:#13653f;
    --badge-bg:rgba(44,207,134,.18);
    --badge-border:rgba(44,207,134,.34);
}
html[data-theme="light"] .badge.at-risk,
html[data-theme="light"] .badge.status-at-risk,
html[data-theme="light"] .badge.blocked,
html[data-theme="light"] .badge.urgent,
html[data-theme="light"] .badge.rejected,
html[data-theme="light"] .badge.cancelled{
    --badge-fg:#972643;
    --badge-bg:rgba(255,93,124,.16);
    --badge-border:rgba(255,93,124,.32);
}
html[data-theme="light"] .badge--retainer-live{
    --badge-fg:#7b5a00;
    --badge-bg:rgba(255,194,15,.18);
    --badge-border:rgba(255,194,15,.32);
}
.client-card__head > div:first-child{
    display:grid;
    gap:10px;
    min-width:0;
}
.entity-inline--client{
    display:flex;
    align-items:center;
    gap:14px;
}
.entity-inline__media{
    width:40px;
    height:40px;
    flex:0 0 40px;
    display:grid;
    place-items:center;
    border-radius:14px;
    overflow:hidden;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
}
.entity-inline__media.is-broken{
    background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
}
.entity-inline__avatar--fallback{
    width:100%;
    height:100%;
}
.client-logo-upload__preview{
    min-height:160px;
    background:linear-gradient(180deg, rgba(255,204,0,.04), rgba(255,255,255,.015));
}
.client-logo-upload__preview.is-empty,
.client-logo-upload__preview.is-broken{
    background:linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.012));
}
.client-logo-upload__image{
    max-height:108px;
}
.client-logo-upload__fallback{
    max-width:120px;
    line-height:1.45;
}
.rich-picker__media{
    width:40px;
    height:40px;
    border-radius:14px;
    overflow:hidden;
    display:grid;
    place-items:center;
    flex:0 0 40px;
    background:rgba(255,255,255,.03);
}
.rich-picker__media.is-broken{
    background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
}
.rich-picker__option,
.rich-picker__trigger{
    align-items:center;
}
.rich-picker__option-copy strong,
.rich-picker__copy strong{
    line-height:1.15;
}
.rich-picker__copy,
.rich-picker__option-copy{
    justify-content:center;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}
input[type="number"]{
    -moz-appearance:textfield;
}
.retainer-financial-grid{
    gap:30px 22px;
}
.retainer-financial-grid + .form-grid,
.retainer-step-panel[data-retainer-step="details"] .retainer-financial-grid + .form-grid,
.retainer-step-panel[data-retainer-step="details"] .retainer-financial-grid + .retainer-breakdown-block{
    margin-top:20px;
}
.retainer-financial-grid .field-help{
    margin-top:12px;
}
.retainer-breakdown-block{
    margin-top:14px;
}
.retainer-breakdown-block + .form-field{
    margin-top:24px;
}
.retainer-breakdown-block + .form-field .field-help{
    margin-top:12px;
}
.button--compact{
    min-height:46px;
    padding:0 16px;
    border-radius:16px;
    font-size:.92rem;
    box-shadow:none;
}
.button--compact.button-primary{
    box-shadow:0 12px 22px rgba(255,204,0,.14);
}

/* Phase 4.10.10b retainer layout comfort + mobile modal action fix */
.retainer-step-panel[data-retainer-step="details"]{
    gap:28px;
}

.retainer-financial-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px 18px;
    align-items:start;
}

.retainer-section--media{
    display:grid;
    gap:18px;
    margin-top:4px;
}

.retainer-media-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(320px, 0.92fr);
    gap:18px;
    align-items:start;
}

.retainer-media-grid__mode{
    grid-column:1 / -1;
}

.retainer-media-grid__budget,
.retainer-media-grid__summary,
.retainer-media-grid__split,
.retainer-edit-only .retainer-breakdown-block{
    min-width:0;
}

.retainer-media-grid__budget,
.retainer-media-grid__summary{
    display:grid;
    gap:10px;
    align-content:start;
}

.retainer-media-grid__split{
    grid-column:2;
    grid-row:2 / span 2;
    height:100%;
    align-content:start;
}

.retainer-media-grid__summary,
.retainer-media-grid__split,
.retainer-edit-only .retainer-breakdown-block{
    padding:18px;
    border-radius:22px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}

.retainer-media-grid__summary strong{
    font-size:1.08rem;
    line-height:1.2;
}

.retainer-media-grid__summary p,
.retainer-breakdown-block__head p,
.retainer-breakdown-total{
    margin:0;
    line-height:1.6;
}

.retainer-breakdown-block__head{
    align-items:flex-start;
}

.retainer-breakdown-block__head .button{
    flex:0 0 auto;
}

.retainer-breakdown-rows[data-retainer-breakdown-rows="budget"]{
    min-height:0;
}

.retainer-breakdown-row{
    align-items:end;
}

.retainer-breakdown-row__remove{
    align-self:stretch;
    min-height:52px;
}

.retainer-edit-only .retainer-breakdown-block{
    margin-top:0;
}

.nexa-modal__body{
    padding-bottom:40px;
}

@media (max-width: 1100px){
    .retainer-media-grid{
        grid-template-columns:minmax(0,1fr);
    }
    .retainer-media-grid__split{
        grid-column:auto;
        grid-row:auto;
    }
}

@media (max-width: 768px){
    .retainer-step-panel[data-retainer-step="details"]{
        gap:22px;
    }
    .retainer-financial-grid{
        grid-template-columns:1fr;
        gap:18px;
    }
    .retainer-section--media{
        gap:16px;
    }
    .retainer-media-grid{
        grid-template-columns:1fr;
        gap:16px;
    }
    .retainer-media-grid__summary,
    .retainer-media-grid__split,
    .retainer-edit-only .retainer-breakdown-block{
        padding:16px;
        border-radius:20px;
    }
    .retainer-breakdown-block__head{
        flex-direction:column;
        align-items:stretch;
    }
    .retainer-breakdown-block__head .button{
        width:100%;
        justify-content:center;
    }
    .retainer-breakdown-row{
        grid-template-columns:1fr;
        gap:12px;
        padding:14px;
    }
    .retainer-breakdown-rows[data-retainer-breakdown-rows="budget"] .retainer-breakdown-row{
        grid-template-columns:1fr;
    }
    .retainer-breakdown-row__remove{
        width:100%;
        min-height:48px;
    }
    .nexa-modal__actions{
        position:static;
        box-shadow:none;
    }
    .nexa-modal__body{
        padding-bottom:24px;
    }
}


/* Phase 4.10.11 retainer create/edit layout polish */
.retainer-step-panel[data-retainer-step="details"] .retainer-financial-grid{
    margin-top:18px;
    gap:22px 18px;
}
.retainer-step-panel[data-retainer-step="details"] .retainer-financial-grid .form-field > label,
.retainer-step-panel[data-retainer-step="details"] .retainer-section--media .form-field > label{
    margin-bottom:10px;
}
.retainer-section--media{
    margin-top:26px;
    gap:20px;
}
.retainer-media-grid{
    grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);
    gap:20px;
}
.retainer-media-grid__mode{
    margin-bottom:2px;
}
.retainer-media-grid__mode .selection-card-group{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.retainer-media-grid__budget,
.retainer-media-grid__summary{
    width:100%;
    min-width:0;
}
.retainer-media-grid__summary{
    min-height:100%;
}
.retainer-media-grid__summary strong{
    margin-bottom:2px;
}
.retainer-media-grid__split{
    min-width:0;
}
.retainer-breakdown-block__head{
    gap:16px;
}
.retainer-breakdown-block__head .button{
    min-width:132px;
}
.retainer-breakdown-rows{
    min-width:0;
}
.retainer-breakdown-row{
    grid-template-columns:minmax(0,1.1fr) minmax(160px,.85fr) 48px;
    align-items:end;
}
.retainer-breakdown-row__field--platform{
    min-width:0;
}
.retainer-breakdown-row__field--amount{
    min-width:0;
}
.retainer-breakdown-row .currency-shell{
    width:100%;
}
.retainer-breakdown-total{
    font-weight:700;
}
@media (max-width: 1180px){
    .retainer-media-grid{
        grid-template-columns:minmax(0,1fr);
    }
    .retainer-media-grid__split{
        grid-column:auto;
        grid-row:auto;
    }
}
@media (max-width: 768px){
    .retainer-step-panel[data-retainer-step="details"] .retainer-financial-grid{
        margin-top:14px;
        grid-template-columns:1fr;
        gap:18px;
    }
    .retainer-section--media{
        margin-top:20px;
        gap:16px;
    }
    .retainer-media-grid{
        grid-template-columns:1fr;
        gap:16px;
    }
    .retainer-media-grid__mode .selection-card-group{
        grid-template-columns:1fr;
        gap:14px;
    }
    .retainer-breakdown-block__head .button{
        min-width:0;
    }
    .retainer-breakdown-row{
        grid-template-columns:1fr;
        gap:12px;
    }
}


/* Phase 4.10.12 retainer safety, history, and confirm modal */
.toggle-row.is-disabled,
[data-retainer-auto-renew-row].is-disabled,
[data-retainer-cancel-row].is-disabled{
    opacity:.56;
}
.toggle-row.is-disabled input[type="checkbox"],
[data-retainer-auto-renew-row].is-disabled input[type="checkbox"],
[data-retainer-cancel-row].is-disabled input[type="checkbox"]{
    cursor:not-allowed;
}
.client-overview-grid--history{
    row-gap:18px;
    grid-auto-flow:row dense;
}
.stack-list--retainer-history{
    display:grid;
    gap:12px;
}
.stack-item--retainer-history{
    padding:16px 18px;
}
.client-retainer-history-panel{
    margin-top:0;
}

/* Phase 4.10.12b retainer term row + confirm stacking fix */
.retainer-step-panel[data-retainer-step="details"] .form-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:start;
}
.retainer-step-panel[data-retainer-step="details"] .form-field--toggles{
    grid-column:1 / -1;
    display:grid;
    gap:16px;
    align-content:start;
}
#nexaConfirmModal{
    z-index:10000 !important;
}
#nexaConfirmModal .nexa-modal__backdrop{
    z-index:0;
}
#nexaConfirmModal .nexa-modal__dialog{
    position:relative;
    z-index:1;
}
@media (max-width: 768px){
    .retainer-step-panel[data-retainer-step="details"] .form-grid{
        grid-template-columns:1fr;
    }
}


/* Phase 4.10.14 root badge legibility + workspace packing guardrails
   DO NOT override these light-mode badge colors with weaker variants.
   Status badges must stay readable on white/light cards across Clients, Projects, Tasks, Approvals, Retainers, Workspace, and Portal.
   Workspace overview uses dense packing so the Portal Access card stays in the first row instead of dropping beside Previous Retainer Terms. */
html[data-theme="light"] .badge{
    color:var(--badge-fg) !important;
    background:var(--badge-bg) !important;
    border-color:var(--badge-border) !important;
    font-weight:800;
    text-shadow:none;
    box-shadow:none;
}
html[data-theme="light"] .badge.active,
html[data-theme="light"] .badge.status-active,
html[data-theme="light"] .badge.healthy,
html[data-theme="light"] .badge.status-healthy,
html[data-theme="light"] .badge.in-progress,
html[data-theme="light"] .badge.internal-review,
html[data-theme="light"] .badge.on-track,
html[data-theme="light"] .badge.approved,
html[data-theme="light"] .badge.done{
    --badge-fg:#0f5a37;
    --badge-bg:#e6f7ef;
    --badge-border:#7cc39e;
}
html[data-theme="light"] .badge.paused,
html[data-theme="light"] .badge.status-paused,
html[data-theme="light"] .badge.attention-needed,
html[data-theme="light"] .badge.status-attention-needed,
html[data-theme="light"] .badge.awaiting-client,
html[data-theme="light"] .badge.pending-internal,
html[data-theme="light"] .badge.ready-for-approval,
html[data-theme="light"] .badge.changes-requested,
html[data-theme="light"] .badge.attention,
html[data-theme="light"] .badge.planned{
    --badge-fg:#7a4700;
    --badge-bg:#fff1d8;
    --badge-border:#e3b252;
}
html[data-theme="light"] .badge.at-risk,
html[data-theme="light"] .badge.status-at-risk,
html[data-theme="light"] .badge.blocked,
html[data-theme="light"] .badge.urgent,
html[data-theme="light"] .badge.rejected,
html[data-theme="light"] .badge.cancelled{
    --badge-fg:#8d1f34;
    --badge-bg:#fde7ec;
    --badge-border:#df8b9b;
}
html[data-theme="light"] .badge.completed,
html[data-theme="light"] .badge.status-completed{
    --badge-fg:#374151;
    --badge-bg:#edf1f6;
    --badge-border:#b8c1cf;
}
html[data-theme="light"] .badge--retainer-live{
    --badge-fg:#6d5000;
    --badge-bg:#fff4ce;
    --badge-border:#e4bf4b;
}

/* Phase 4.10.15 footer + release notes reference layer */
.app-footer{
    align-items:flex-start;
    gap:18px;
}

.app-footer__meta{
    max-width:780px;
    display:grid;
    gap:10px;
}

.app-footer__meta strong{
    display:block;
    color:var(--text);
    font-size:1rem;
    line-height:1.5;
}

.app-footer__meta p{
    margin:0;
    color:var(--text-muted);
    max-width:760px;
}

.app-footer__links{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:10px;
    margin-left:auto;
}

.app-footer__links a{
    display:inline-flex;
    align-items:center;
    min-height:42px;
    padding:10px 14px;
    border-radius:999px;
    border:1px solid var(--line);
    background:var(--panel-soft);
    color:var(--text);
    font-weight:700;
    text-decoration:none;
    transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.app-footer__links a:hover{
    transform:translateY(-1px);
    border-color:rgba(212,163,63,.45);
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}

.doc-layout{
    align-items:start;
}

.doc-sidebar{
    position:sticky;
    top:24px;
}

.doc-prose{
    max-width:100%;
    color:var(--text);
}

.doc-prose h1,
.doc-prose h2,
.doc-prose h3{
    color:var(--text);
    letter-spacing:-0.03em;
    line-height:1.08;
    margin:0 0 14px;
}

.doc-prose h1{
    font-size:2.2rem;
    margin-top:0;
}

.doc-prose h2{
    font-size:1.55rem;
    margin-top:32px;
}

.doc-prose h3{
    font-size:1.1rem;
    margin-top:24px;
}

.doc-prose p,
.doc-prose li{
    color:var(--text-muted);
    font-size:1rem;
    line-height:1.72;
}

.doc-prose p{
    margin:0 0 14px;
}

.doc-prose ul,
.doc-prose ol{
    margin:0 0 14px 20px;
    padding:0;
}

.doc-prose li + li{
    margin-top:6px;
}

.doc-prose hr{
    border:none;
    border-top:1px solid var(--line);
    margin:24px 0;
}

.doc-prose code{
    background:var(--panel-soft);
    border:1px solid var(--line);
    border-radius:8px;
    padding:2px 6px;
    font-size:.92em;
    color:var(--text);
}

.stack-list--tight{
    gap:10px;
}

.stack-item--link{
    text-decoration:none;
}

.stack-item--link strong,
.stack-item--link p{
    transition:color .18s ease;
}

.stack-item--link:hover strong{
    color:var(--accent);
}

[data-theme="light"] .app-footer__links a{
    background:#ffffff;
    border-color:rgba(23,23,23,.14);
    box-shadow:0 10px 26px rgba(17,17,17,.06);
}

@media (max-width: 980px){
    .doc-sidebar{
        position:static;
    }
}

@media (max-width: 860px){
    .app-footer__links{
        margin-left:0;
        justify-content:flex-start;
    }

    .doc-prose h1{
        font-size:1.9rem;
    }

    .doc-prose h2{
        font-size:1.35rem;
    }
}

/* Phase 4.10.16 release notes layout + public-ready footer guardrail */
.panel-span-3{
    grid-column:1 / -1;
}

.release-summary-grid{
    align-items:start;
}

.release-summary-grid > .panel:first-child{
    grid-column:span 2;
}

.release-summary-list{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}

.release-summary-item{
    min-height:132px;
    padding:18px;
    border-radius:22px;
    border:1px solid var(--line);
    background:var(--panel-soft);
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:10px;
}

.release-summary-item strong{
    font-size:2rem;
    line-height:1;
    color:var(--text);
}

.release-summary-item span{
    color:var(--text-muted);
    line-height:1.5;
}

.release-links-panel{
    position:sticky;
    top:24px;
}

.release-links-list{
    max-height:520px;
    overflow:auto;
    padding-right:4px;
}

.release-reference-grid,
.release-reference-panel{
    align-items:start;
}

.release-reference-head{
    gap:18px;
}

.doc-prose--release-notes{
    max-width:980px;
}

.doc-prose--release-notes h1:first-child{
    display:none;
}

.doc-prose--release-notes h2{
    padding-top:6px;
    border-top:1px solid var(--line);
}

.doc-prose--release-notes h2:first-of-type{
    border-top:none;
    padding-top:0;
}

@media (max-width: 1100px){
    .release-summary-grid > .panel:first-child,
    .release-links-panel,
    .panel-span-3{
        grid-column:auto;
    }
}

@media (max-width: 980px){
    .release-links-panel{
        position:static;
    }

    .release-summary-list{
        grid-template-columns:1fr;
    }

    .doc-prose--release-notes{
        max-width:100%;
    }
}


/* Phase 4.11.9 guardrail: core content blocks must stay visible by default.
   Do not hide .panel, .stat-card, .project-card, .hero-strip, or .page-head-row behind JS reveal state.
   Motion can decorate visibility, but it must never control whether dashboard or reference content renders. */


.settings-action-row{
    display:flex;
    justify-content:flex-end;
    margin-top:16px;
}
.settings-type-list--spacious{
    gap:14px;
}
.settings-role-item{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:16px;
    align-items:center;
    padding:18px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.settings-role-item.is-inactive{
    opacity:.7;
}
.settings-role-item__copy{
    display:grid;
    gap:6px;
}
.settings-role-item__copy small{
    color:var(--text-muted);
    line-height:1.55;
}
.settings-role-item__title-row{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}
.settings-role-pills{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}
.checkbox-row{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-bottom:10px;
    color:var(--text-soft);
}
.checkbox-row input{
    margin-top:3px;
}
html[data-theme="light"] .settings-card-lite,
html[data-theme="light"] .settings-role-item,
html[data-theme="light"] .settings-type-item{
    background:#fff;
}
@media (max-width: 640px){
    .settings-role-item{
        grid-template-columns:1fr;
        align-items:flex-start;
    }
    .settings-action-row{
        justify-content:flex-start;
    }
}


/* Phase 4.12.3 files restoration + dashboard scroll lock */
.files-stats-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
}
.files-main-panel,
.files-side-panel,
.dashboard-operating-panel,
.dashboard-activity-panel{
    display:flex;
    flex-direction:column;
    min-height:0;
}
.files-main-panel .panel-head,
.files-side-panel .panel-head,
.dashboard-operating-panel .panel-head,
.dashboard-activity-panel .panel-head{
    flex:0 0 auto;
}
.files-table-wrap{
    flex:1 1 auto;
    min-height:0;
}
.files-table-meta,
.files-context-copy{
    display:grid;
    gap:4px;
}
.files-table-meta strong,
.files-context-copy strong{
    margin-bottom:0;
}
.files-table-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}
.files-side-panel .stack-list{
    gap:14px;
}
.files-side-actions{
    margin-top:18px;
}
.files-empty-state{
    padding:10px 0;
}
.files-empty-actions{
    margin-top:14px;
}
.files-modal-actions{
    justify-content:flex-end;
}
.files-modal-actions .button{
    min-width:120px;
}
.dashboard-operating-wrap{
    flex:1 1 auto;
    min-height:0;
    max-height:480px;
    overscroll-behavior:contain;
}
.dashboard-operating-wrap thead th{
    position:sticky;
    top:0;
    z-index:1;
    background:rgba(9,11,15,.96);
    backdrop-filter:blur(8px);
}
.dashboard-activity-list{
    flex:1 1 auto;
    min-height:0;
    max-height:480px;
    overflow:auto;
    padding-right:6px;
    overscroll-behavior:contain;
}
html[data-theme="light"] .dashboard-operating-wrap thead th{
    background:rgba(255,255,255,.94);
}
@media (max-width: 1280px){
    .files-stats-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media (max-width: 860px){
    .files-stats-grid{
        grid-template-columns:1fr;
    }
    .dashboard-operating-wrap,
    .dashboard-activity-list{
        max-height:380px;
    }
    .files-table-actions{
        flex-direction:column;
        align-items:flex-start;
    }
    .files-modal-actions .button{
        width:100%;
    }
}


/* Phase 4.12.4 files preview, upload polish, status selects, and modal layout cleanup */
html[data-theme="dark"] .sidebar-brand-card,
html[data-theme="dark"] .sidebar-announcement-card,
html[data-theme="dark"] .app-topbar,
html[data-theme="dark"] .hero-strip,
html[data-theme="dark"] .page-head-row,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .project-card,
html[data-theme="dark"] .filter-pill,
html[data-theme="dark"] .topbar-search,
html[data-theme="dark"] .user-pill,
html[data-theme="dark"] .task-card{
    background:rgba(11,13,17,.9);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.015), var(--shadow);
}

.nexa-modal__body .form-grid,
.nexa-modal__body .form-grid--three,
.nexa-modal__body .meta-grid,
.nexa-modal__body .retainer-financial-grid,
.nexa-modal__body .selection-card-group{
    align-items:start;
}
.nexa-modal__body .form-field{
    align-content:start;
    align-self:start;
}

.input[type="file"]{
    min-height:60px;
    padding:9px 12px;
    line-height:1.35;
    color:var(--text-soft);
    cursor:pointer;
}
.input[type="file"]::file-selector-button{
    min-height:40px;
    margin-right:12px;
    border-radius:12px;
    border:1px solid rgba(255,204,0,.24);
    padding:0 16px;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
    color:#111;
    font-weight:800;
    cursor:pointer;
    transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.input[type="file"]::file-selector-button:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 20px rgba(255,204,0,.16);
    filter:saturate(1.05);
}
.input[type="file"]::-webkit-file-upload-button{
    min-height:40px;
    margin-right:12px;
    border-radius:12px;
    border:1px solid rgba(255,204,0,.24);
    padding:0 16px;
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
    color:#111;
    font-weight:800;
    cursor:pointer;
}
html[data-theme="light"] .input[type="file"]{
    color:#586070;
    background:#fff;
}

.select--status-pill{
    min-height:52px;
    border-radius:999px;
    padding-left:18px;
    padding-right:58px;
    font-weight:800;
    letter-spacing:.01em;
    background-image:
        radial-gradient(circle at calc(100% - 22px) 50%, rgba(255,255,255,.06) 0 18px, transparent 18px),
        linear-gradient(45deg, transparent 50%, var(--text-soft) 50%),
        linear-gradient(135deg, var(--text-soft) 50%, transparent 50%);
    background-position:
        0 0,
        calc(100% - 24px) calc(50% - 3px),
        calc(100% - 18px) calc(50% - 3px);
    background-size:
        100% 100%,
        6px 6px,
        6px 6px;
    background-repeat:no-repeat;
}
.select--status-pill[data-status-tone="success"]{
    color:#c8f2db;
    border-color:rgba(50,180,118,.3);
    background-color:rgba(44,175,116,.14);
}
.select--status-pill[data-status-tone="warning"]{
    color:#ffe4ab;
    border-color:rgba(225,171,47,.28);
    background-color:rgba(214,155,38,.14);
}
.select--status-pill[data-status-tone="danger"]{
    color:#ffd7dd;
    border-color:rgba(213,86,108,.28);
    background-color:rgba(203,74,97,.14);
}
.select--status-pill[data-status-tone="neutral"]{
    color:var(--text);
    border-color:var(--line-strong);
    background-color:rgba(255,255,255,.045);
}
html[data-theme="light"] .select--status-pill{
    background-image:
        radial-gradient(circle at calc(100% - 22px) 50%, rgba(17,20,27,.05) 0 18px, transparent 18px),
        linear-gradient(45deg, transparent 50%, #5a6272 50%),
        linear-gradient(135deg, #5a6272 50%, transparent 50%);
}
html[data-theme="light"] .select--status-pill[data-status-tone="success"]{
    color:#146540;
    border-color:rgba(37,154,95,.24);
    background-color:rgba(37,154,95,.1);
}
html[data-theme="light"] .select--status-pill[data-status-tone="warning"]{
    color:#9b6504;
    border-color:rgba(205,149,17,.26);
    background-color:rgba(235,183,52,.14);
}
html[data-theme="light"] .select--status-pill[data-status-tone="danger"]{
    color:#8f2037;
    border-color:rgba(200,78,101,.24);
    background-color:rgba(220,92,116,.12);
}
html[data-theme="light"] .select--status-pill[data-status-tone="neutral"]{
    color:#273042;
    border-color:rgba(17,20,27,.12);
    background-color:#fff;
}

.date-shell{
    position:relative;
}
.date-shell .input{
    padding-right:60px;
}
.date-shell__trigger{
    top:7px;
    right:8px;
    bottom:7px;
    width:40px;
    height:auto;
    transform:none;
}
.date-shell__trigger:hover{
    transform:none;
}
.date-shell__trigger i{
    pointer-events:none;
}
.date-shell.is-disabled .date-shell__trigger{
    opacity:.55;
}

.files-inline-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:12px;
}
.file-preview-modal__shell{
    display:grid;
    gap:16px;
}
.file-preview-modal__meta{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}
.file-preview-modal__summary{
    display:grid;
    gap:8px;
}
.file-preview-modal__summary strong{
    font-size:1.15rem;
    color:var(--text);
}
.file-preview-modal__summary p{
    margin:0;
    color:var(--text-soft);
}
.file-preview-modal__viewport{
    border:1px solid var(--line);
    border-radius:22px;
    overflow:hidden;
    background:rgba(6,8,11,.72);
    min-height:min(58vh, 720px);
}
.file-preview-modal__frame-wrap,
.file-preview-modal__image-wrap{
    width:100%;
    min-height:min(58vh, 720px);
}
.file-preview-modal__frame{
    width:100%;
    height:min(58vh, 720px);
    border:0;
    background:#0b0d11;
}
.file-preview-modal__image-wrap{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:22px;
}
.file-preview-modal__image{
    max-width:100%;
    max-height:min(54vh, 680px);
    object-fit:contain;
}
.file-preview-modal__empty{
    min-height:min(58vh, 720px);
    display:grid;
    place-content:center;
    gap:10px;
    padding:28px;
    text-align:center;
}
.file-preview-modal__empty p{
    margin:0;
    color:var(--text-soft);
}

/* Phase 4.12.5 targeted polish */
.topbar-left,
.topbar-mobile-row{
    align-items:flex-start;
}
.topbar-label{
    padding-left:12px;
    padding-right:12px;
}
.topbar-left h1{
    padding-left:12px;
}

.toggle-row{
    align-items:center;
}
.toggle-row span{
    flex:1 1 auto;
}
.toggle-row input[type="checkbox"]{
    width:56px;
    height:32px;
    border-radius:999px;
}
.toggle-row input[type="checkbox"]::after{
    top:3px;
    left:3px;
    width:24px;
    height:24px;
    border-radius:50%;
}
.toggle-row input[type="checkbox"]:checked::after{
    transform:translateX(24px);
}

.select--status-pill{
    background-image:
        linear-gradient(45deg, transparent 50%, currentColor 50%),
        linear-gradient(135deg, currentColor 50%, transparent 50%);
    background-position:
        calc(100% - 24px) calc(50% - 3px),
        calc(100% - 18px) calc(50% - 3px);
    background-size:6px 6px, 6px 6px;
    background-repeat:no-repeat;
}
html[data-theme="light"] .select--status-pill{
    background-image:
        linear-gradient(45deg, transparent 50%, currentColor 50%),
        linear-gradient(135deg, currentColor 50%, transparent 50%);
}

.nexa-modal__dialog{
    max-height:calc(100vh - 32px);
    margin:16px auto;
}
.nexa-modal__actions{
    position:sticky;
    bottom:0;
    z-index:2;
    background:linear-gradient(180deg, rgba(16,17,21,.98), rgba(8,8,10,.99));
}
html[data-theme="light"] .nexa-modal__actions{
    background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,247,250,.99));
}
.nexa-modal__body{
    padding-bottom:28px;
}

.stack-list--retainer-time-modal{
    margin-bottom:16px;
}
.stack-item--retainer-time-summary{
    padding:18px 20px;
}
.stack-item--retainer-time-summary p{
    margin:6px 0 0;
}
.retainer-time-table-wrap table{
    min-width:720px;
}
.retainer-time-hours-input{
    min-width:96px;
    max-width:120px;
    text-align:right;
}
.retainer-breakdown-block--modal-spend{
    margin-top:0;
}
.retainer-breakdown-block--modal-spend .retainer-breakdown-row{
    grid-template-columns:minmax(0,1.1fr) minmax(160px,.85fr) 48px;
}
@media (max-width: 768px){
    .nexa-modal__dialog{
        max-height:calc(100vh - 20px);
        margin:10px auto;
    }
    .nexa-modal__actions{
        position:sticky;
    }
    .retainer-breakdown-block--modal-spend .retainer-breakdown-row,
    .retainer-time-table-wrap table{
        min-width:0;
    }
}

.retainer-time-entry-board{display:grid;gap:1rem;}
.retainer-time-entry-rows{display:grid;gap:.9rem;}
.retainer-time-entry-row{
    grid-template-columns:minmax(0,1.45fr) minmax(210px,.7fr) minmax(120px,.28fr) 48px;
    align-items:end;
}
.retainer-time-entry-row__field--date,
.retainer-time-entry-row__field--hours{
    min-width:0;
    max-width:none;
}
.retainer-time-entry-row .date-shell,
.retainer-time-entry-row .input,
.retainer-time-entry-row .retainer-time-hours-input{
    width:100%;
}
.retainer-time-entry-row .form-field{
    min-width:0;
}
.retainer-time-history{
    display:grid;
    gap:.9rem;
    padding:18px 20px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:22px;
    background:rgba(255,255,255,.02);
}
.retainer-time-history__head p{
    margin:.35rem 0 0;
    color:var(--text-secondary);
}
.retainer-time-history__list{
    display:grid;
    gap:.75rem;
}
.retainer-time-history__item{
    display:grid;
    gap:.4rem;
    padding:.9rem 1rem;
    border:1px solid rgba(255,255,255,.07);
    border-radius:18px;
    background:rgba(255,255,255,.025);
}
.retainer-time-history__meta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
}
.retainer-time-history__date{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    color:var(--text-secondary);
    font-size:.92rem;
}
.retainer-time-history__hours{
    font-weight:700;
    color:var(--text-primary);
}
.retainer-time-history__description{
    color:var(--text-primary);
}
.retainer-time-history__empty{
    padding:.95rem 1rem;
    border:1px dashed rgba(255,255,255,.1);
    border-radius:16px;
    color:var(--text-secondary);
}
@media (max-width: 900px){
    .retainer-time-entry-row{
        grid-template-columns:minmax(0,1fr);
    }
    .retainer-time-history__meta{
        align-items:flex-start;
        flex-direction:column;
    }
}


.retainer-time-entry-row .retainer-breakdown-row__remove{
    align-self:end;
    min-height:44px;
}
.retainer-time-entry-row.is-targeted{
    border-color:rgba(255,204,0,.36);
    box-shadow:0 0 0 1px rgba(255,204,0,.14), 0 10px 26px rgba(0,0,0,.22);
}
.retainer-time-history{
    background:rgba(255,255,255,.018);
}
.retainer-time-history__item{
    background:rgba(255,255,255,.018);
    border-color:rgba(255,255,255,.055);
    opacity:.78;
}
.retainer-time-history__item:hover{
    opacity:.96;
    border-color:rgba(255,255,255,.1);
}
.retainer-time-history__description{
    color:rgba(255,255,255,.86);
}
.retainer-time-history__actions{
    display:flex;
    justify-content:flex-end;
    gap:.55rem;
    margin-top:.25rem;
}
.button-ghost--sm{
    min-height:36px;
    padding:.5rem .8rem;
    border-radius:12px;
    font-size:.88rem;
}
.button-ghost-danger{
    border-color:rgba(255,93,124,.18);
    color:#ffb9c8;
}
.button-ghost-danger:hover{
    border-color:rgba(255,93,124,.34);
    background:rgba(255,93,124,.08);
    color:#ffd0da;
}
@media (max-width: 900px){
    .retainer-time-history__actions{
        justify-content:flex-start;
        flex-wrap:wrap;
    }
}

/* =========================
   Announcements Module + Sidebar Sync
   ========================= */
.announcement-card {
    background: linear-gradient(180deg, color-mix(in srgb, var(--text) 5%, transparent), color-mix(in srgb, var(--text) 2.5%, transparent));
    border: 1px solid var(--border);
    border-radius: 22px;
    box-shadow: var(--shadow);
}

.announcement-card__top {
    margin-bottom: 18px;
}

.announcement-viewport {
    position: relative;
    min-height: 178px;
    padding-bottom: 8px;
}

.announcement-slide {
    position: absolute;
    inset: 0;
    display: grid;
    gap: 12px;
    align-content: start;
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity .55s ease, transform .55s ease;
}

.announcement-slide.is-active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.announcement-slide p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.65;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.announcement-dots {
    margin-top: 24px;
    position: relative;
    z-index: 2;
}

.announcement-dot,
.icon-picker-option {
    cursor: pointer;
}

.announcement-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 18px;
}

.announcement-metric-card {
    display: grid;
    gap: 10px;
}

.announcement-metric-card h3,
.announcement-metric-card p,
.announcement-metric-card strong {
    margin: 0;
}

.announcement-metric-card strong {
    font-size: clamp(1.6rem, 2vw, 2.25rem);
    line-height: 1;
}

.announcement-module-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(340px, .95fr);
    gap: 18px;
    align-items: start;
}

.announcement-table-panel,
.announcement-editor-panel {
    min-width: 0;
}

.announcement-table-wrap {
    border: 1px solid var(--border);
    border-radius: 18px;
    overflow-x: auto;
}

.announcement-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
}

.announcement-table th,
.announcement-table td {
    padding: 16px 18px;
    text-align: left;
    border-bottom: 1px solid var(--border);
    vertical-align: top;
}

.announcement-table th {
    color: var(--text-faint);
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.announcement-table tr:last-child td {
    border-bottom: 0;
}

.announcement-table td strong,
.empty-state-inline strong {
    display: block;
    margin-bottom: 6px;
}

.announcement-table td small,
.empty-state-inline p {
    display: block;
    color: var(--text-soft);
    line-height: 1.6;
}

.empty-state-inline {
    display: grid;
    gap: 6px;
}

.announcement-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid var(--border);
    font-size: .72rem;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: .04em;
}

.announcement-status-pill--live {
    color: var(--status-active-text);
    background: var(--status-active-bg);
    border-color: rgba(var(--success-rgb), .28);
}

.announcement-status-pill--draft {
    color: var(--status-neutral-text);
    background: var(--status-neutral-bg);
}

.announcement-status-pill--hidden {
    color: var(--status-warning-text);
    background: var(--status-warning-bg);
    border-color: rgba(var(--warning-rgb), .28);
}

.announcement-action-stack,
.announcement-editor-actions,
.page-head-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.announcement-editor-actions {
    margin-top: 18px;
}

.announcement-editor-actions__push {
    flex: 1 1 auto;
}

.announcement-delete-button {
    color: #f7c6ce;
    border-color: rgba(220, 64, 91, .26);
    background: linear-gradient(135deg, rgba(220, 64, 91, .12), rgba(220, 64, 91, .05));
}

.notice-box {
    padding: 16px 18px;
    border-radius: 18px;
    border: 1px solid var(--border);
    background: linear-gradient(135deg, rgba(255,204,0,.1), rgba(255,153,0,.05));
    margin-bottom: 18px;
}

.notice-box strong {
    display: block;
    margin-bottom: 8px;
}

.notice-box p {
    margin: 0;
    color: var(--text-soft);
}

.notice-box--danger {
    background: linear-gradient(135deg, rgba(220, 64, 91, .14), rgba(220, 64, 91, .05));
    border-color: rgba(220, 64, 91, .26);
}

.notice-box--warning {
    background: linear-gradient(135deg, rgba(255, 174, 0, .14), rgba(255, 174, 0, .05));
    border-color: rgba(255, 174, 0, .24);
}

.icon-picker-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.icon-picker-option {
    justify-content: flex-start;
    gap: 10px;
}

.icon-picker-option i {
    width: 18px;
    text-align: center;
    font-size: 1rem;
}

.icon-picker-option.is-on {
    border-color: rgba(255, 204, 0, .35);
    background: linear-gradient(135deg, rgba(255,204,0,.14), rgba(255,153,0,.08));
    box-shadow: 0 0 0 1px rgba(255, 204, 0, .15) inset;
}

.icon-picker-option:focus-visible {
    outline: 2px solid rgba(255,204,0,.7);
    outline-offset: 2px;
}

@media (max-width: 1180px) {
    .announcement-module-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 960px) {
    .announcement-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .icon-picker-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .announcement-metric-grid,
    .icon-picker-grid {
        grid-template-columns: 1fr;
    }
}

/* Phase 4.13.7 — Sidebar announcement card module link */
.announcement-card__module-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.03);
    color:var(--text-soft);
    transition:transform .2s ease,border-color .2s ease,color .2s ease,background .2s ease;
}
.announcement-card__module-link:hover{
    transform:translateY(-1px);
    border-color:rgba(255,204,0,.35);
    background:rgba(255,204,0,.08);
    color:var(--text);
}

/* Phase 4.14.0 auth foundation */
.auth-card--wide{width:min(100%,680px)}
.auth-grid{display:grid;gap:18px}.auth-grid--two{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;row-gap:18px}
.auth-note-list{display:flex;flex-wrap:wrap;gap:10px}.auth-note-list span{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text-soft);font-size:.9rem}
.logout-form-inline{display:inline-flex;margin:0}.logout-form-inline .topbar-button{width:100%}
@media (max-width:760px){.auth-grid--two{grid-template-columns:1fr}.auth-card--wide{width:min(100%,520px)}}


/* =========================
   Auth Experience Refresh
   ========================= */
.login-page{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    padding:0;
    overflow-x:hidden;
}
.login-page .app-footer{
    width:min(100%,1360px);
    margin:0 auto;
    padding:18px 28px 24px;
    border-top:1px solid var(--line);
    color:var(--text-soft);
}
.auth-shell{
    position:relative;
    flex:1 1 auto;
    width:min(100%,1360px);
    margin:0 auto;
    padding:32px 28px 12px;
    display:flex;
    align-items:center;
}
.auth-ambient{
    position:absolute;
    border-radius:999px;
    filter:blur(18px);
    opacity:.22;
    pointer-events:none;
}
.auth-ambient--one{
    width:420px;height:420px;
    top:6%;left:-4%;
    background:radial-gradient(circle,rgba(255,204,0,.22) 0%,rgba(255,153,0,.08) 48%,transparent 72%);
    animation:authFloatOne 14s ease-in-out infinite;
}
.auth-ambient--two{
    width:360px;height:360px;
    right:-2%;bottom:8%;
    background:radial-gradient(circle,rgba(255,153,0,.18) 0%,rgba(255,204,0,.06) 46%,transparent 70%);
    animation:authFloatTwo 18s ease-in-out infinite;
}
.auth-grid-shell{
    position:relative;
    z-index:1;
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(440px,.82fr);
    gap:26px;
    align-items:stretch;
}
.auth-stage-panel,
.auth-panel-card{
    position:relative;
    border:1px solid var(--line);
    border-radius:34px;
    box-shadow:var(--shadow);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
}
.auth-stage-panel{
    overflow:hidden;
    padding:34px;
    background:
        linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.018)),
        radial-gradient(circle at top right,rgba(255,204,0,.10),transparent 28%),
        radial-gradient(circle at bottom left,rgba(255,153,0,.09),transparent 26%);
    display:grid;
    align-content:space-between;
    gap:24px;
    isolation:isolate;
}
.auth-stage-panel::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size:34px 34px;
    mask-image:linear-gradient(180deg,rgba(0,0,0,.8),transparent 92%);
    pointer-events:none;
    opacity:.34;
}
html[data-theme="light"] .auth-stage-panel,
html[data-theme="light"] .auth-panel-card{
    background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.9));
}
.auth-stage-brand{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:auto 1fr;
    gap:18px;
    align-items:flex-start;
}
.auth-stage-brand__mark{
    width:74px;height:74px;border-radius:22px;
    display:flex;align-items:center;justify-content:center;
    padding:12px;
    background:linear-gradient(145deg,rgba(255,204,0,.18),rgba(255,153,0,.08));
    border:1px solid rgba(255,204,0,.24);
    box-shadow:0 16px 36px rgba(0,0,0,.18);
}
.auth-stage-brand__mark img{width:100%;height:100%;object-fit:contain}
.auth-stage-brand h1{
    margin:14px 0 10px;
    font-size:clamp(2.4rem,4vw,4.25rem);
    line-height:.96;
    letter-spacing:-.05em;
    max-width:12ch;
}
.auth-stage-brand p{max-width:58ch;font-size:1rem;margin-bottom:0}
.auth-stage-glass{
    position:relative;
    z-index:1;
    display:grid;
    gap:18px;
    padding:22px;
    border-radius:28px;
    border:1px solid rgba(255,255,255,.08);
    background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.018));
}
.auth-stage-glass__head{display:grid;gap:10px}
.auth-stage-glass__head strong{font-size:1.28rem;line-height:1.2}
.auth-stage-pill-row{
    display:flex;flex-wrap:wrap;gap:10px;
}
.auth-stage-pill-row span,
.auth-stage-rail span{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:38px;padding:0 14px;border-radius:999px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:var(--text-soft);
    font-size:.84rem;font-weight:700;
    white-space:nowrap;
}
.auth-stage-metric-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}
.auth-stage-metric-grid article{
    display:grid;
    gap:6px;
    padding:16px;
    border-radius:22px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}
.auth-stage-metric-grid small{
    color:var(--text-muted);
    font-size:.74rem;
    text-transform:uppercase;
    letter-spacing:.09em;
    font-weight:800;
}
.auth-stage-metric-grid strong{font-size:1.05rem;line-height:1.2}
.auth-stage-metric-grid p{margin:0;font-size:.92rem;line-height:1.55}
.auth-stage-rail{
    position:relative;
    z-index:1;
    display:flex;
    gap:10px;
    overflow:hidden;
    mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.95) 10%,rgba(0,0,0,.95) 90%,transparent);
}
.auth-stage-rail span{
    flex:0 0 auto;
    animation:authTicker 18s linear infinite;
}
.auth-panel-card{
    padding:30px;
    display:grid;
    align-content:start;
    gap:20px;
    background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022));
}
.auth-panel-card__top{display:grid;gap:10px}
.auth-panel-card__top h2{margin:0;font-size:2rem;letter-spacing:-.04em;line-height:1.02}
.auth-panel-card__top p{margin:0}
.auth-form{
    display:grid;
    gap:18px;
}
.auth-form label{
    display:grid;
    gap:10px;
    font-weight:600;
    color:var(--text);
}
.auth-form input{
    min-height:58px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.05);
    color:var(--text);
    padding:0 16px;
    outline:none;
    font-weight:400;
    letter-spacing:0;
    transition:border-color .2s ease, box-shadow .2s ease, background .2s ease, transform .2s ease;
}
.auth-form input:focus{
    border-color:rgba(255,204,0,.48);
    box-shadow:0 0 0 4px rgba(255,204,0,.12);
    background:rgba(255,255,255,.065);
}
html[data-theme="light"] .auth-form input{background:rgba(255,255,255,.96)}
.auth-form input::placeholder{font-weight:400;color:rgba(255,255,255,.38)}
html[data-theme="light"] .auth-form input::placeholder{color:rgba(15,23,42,.38)}
.auth-form .button{width:100%;min-height:54px;margin-top:6px}
.auth-note-list{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.auth-note-list span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:38px;
    padding:0 12px;
    border-radius:999px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:var(--text-soft);
    font-size:.84rem;
    font-weight:700;
}
.auth-grid-shell--single{max-width:640px;margin:0 auto;grid-template-columns:minmax(0,1fr)}
.auth-panel-card--centered{max-width:640px;margin:0 auto;width:100%}
.auth-note a{color:var(--accent);font-weight:700;text-decoration:none}
.auth-note a:hover{text-decoration:underline}
.auth-note{
    padding:14px 16px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.035);
    color:var(--text-soft);
    font-size:.93rem;
    line-height:1.6;
}
@keyframes authFloatOne{
    0%,100%{transform:translate3d(0,0,0) scale(1)}
    50%{transform:translate3d(18px,22px,0) scale(1.04)}
}
@keyframes authFloatTwo{
    0%,100%{transform:translate3d(0,0,0) scale(1)}
    50%{transform:translate3d(-22px,-16px,0) scale(1.06)}
}
@keyframes authTicker{
    from{transform:translateX(0)}
    to{transform:translateX(calc(-100% - 10px))}
}
@media (max-width:1120px){
    .auth-grid-shell{grid-template-columns:1fr}
    .auth-stage-brand h1{max-width:none}
}
@media (max-width:760px){
    .auth-shell{padding:20px 16px 10px}
    .auth-stage-panel,.auth-panel-card{padding:22px}
    .auth-stage-brand{grid-template-columns:1fr}
    .auth-stage-brand__mark{width:64px;height:64px}
    .auth-stage-metric-grid{grid-template-columns:1fr}
    .auth-grid--two{grid-template-columns:1fr}
    .login-page .app-footer{padding:16px 16px 22px}
}

/* Phase 5.0 — Authorization and team foundation */
.team-overview-grid{
    grid-template-columns:minmax(0,2fr) minmax(320px,1fr);
}
.team-role-matrix,
.team-guardrail-list,
.team-member-grid{
    display:grid;
    gap:18px;
}
.team-role-card{
    display:grid;
    gap:14px;
    padding:18px 20px;
    border-radius:22px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.025);
}
.team-role-card.is-current{
    border-color:rgba(255,194,15,.28);
    box-shadow:0 0 0 1px rgba(255,194,15,.08) inset;
}
.team-role-card__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}
.team-role-card__head h4{
    margin:0;
    font-size:1.05rem;
}
.team-role-card__head p{
    margin:.45rem 0 0;
    color:var(--text-secondary);
}
.team-guardrail-item{
    display:grid;
    gap:6px;
    padding:16px 18px;
    border-radius:20px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.025);
}
.team-guardrail-item span{
    color:var(--text-secondary);
}
.team-member-card{
    display:grid;
    gap:16px;
}
.team-member-card.is-inactive{
    opacity:.82;
}
.team-member-card__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}
.team-member-card__identity{
    display:grid;
    gap:6px;
}
.team-member-card__identity h3{
    margin:0;
}
.team-member-card__email{
    margin:0;
    color:var(--text-secondary);
    word-break:break-word;
}
.team-member-card__pill-row{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    justify-content:flex-end;
}
.team-member-card__actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.team-toggle-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    margin-top:18px;
}
.team-toggle-card{
    align-items:flex-start;
    gap:12px;
}
.team-toggle-card strong{
    display:block;
    margin-bottom:4px;
}
.team-toggle-card small{
    color:var(--text-secondary);
}
.team-form-notice{
    margin-bottom:16px;
}
@media (max-width:1180px){
    .team-overview-grid,
    .team-toggle-grid{
        grid-template-columns:1fr;
    }
}
@media (max-width:860px){
    .team-member-card__head,
    .team-role-card__head{
        flex-direction:column;
        align-items:flex-start;
    }
    .team-member-card__pill-row{
        justify-content:flex-start;
    }
}