/* ───────────────────────── Control Tower — base styles ─────────────────────────
   Palette sampled from greenmyexperience.com: forest-green primary (#285D45)
   with a lime accent (#87C43F) against warm cream neutrals.
*/

:root {
    --bg:          #F4F2EE;
    --surface:     #FFFFFF;
    --surface-alt: #FAF8F3;
    --text:        #2A2822;
    --muted:       #67645F;
    --border:      #DBD9D5;
    --border-soft: #EDEBE4;

    --brand:       #285D45;
    --brand-dark:  #143326;
    --brand-soft:  #E1EDE6;
    --accent:      #87C43F;
    --accent-dark: #6BA328;
    --accent-soft: #EDF6DE;

    --danger:      #B3261E;
    --danger-soft: #FBE9E7;
    --warn:        #8A5A00;
    --warn-soft:   #FBEFCB;
    --info-soft:   #E2ECF6;

    --radius:      10px;
    --radius-sm:   6px;
    --shadow:      0 1px 2px rgba(20, 51, 38, .04), 0 2px 10px rgba(20, 51, 38, .05);
    --shadow-lg:   0 8px 24px rgba(20, 51, 38, .08);

    --font:        system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;
    --mono:        ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
    margin: 0;
    font-family: var(--font);
    font-size: 14px;
    color: var(--text);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
}
a { color: var(--brand-dark); text-decoration: none; }
a:hover { text-decoration: underline; }

code, .mono { font-family: var(--mono); font-size: .92em; }

/* ── Brand mark ─────────────────────────────────────────────── */
.brand {
    display: inline-flex; align-items: center; gap: .6rem;
    font-weight: 600; color: var(--text); text-decoration: none;
    margin: 0; font-size: 16px;
}
.brand-logo {
    width: 28px; height: 28px; flex: 0 0 28px;
    display: block;
}
.brand-wordmark {
    display: inline-flex; flex-direction: column; line-height: 1.1;
}
.brand-wordmark .brand-name { font-size: 15px; font-weight: 600; letter-spacing: -.005em; }
.brand-wordmark .brand-sub  { font-size: 10px; font-weight: 500; color: var(--muted); letter-spacing: .1em; text-transform: uppercase; }

/* ── Auth layout (login, reset, invite) ─────────────────────── */
.auth-body {
    display: flex; align-items: center; justify-content: center;
    min-height: 100vh; padding: 1.25rem;
    background:
        radial-gradient(circle at 10% 0%, rgba(135, 196, 63, .08), transparent 45%),
        radial-gradient(circle at 90% 100%, rgba(40, 93, 69, .08), transparent 45%),
        var(--bg);
}
.auth-wrap { width: 100%; max-width: 420px; }
.auth-card {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 2rem 2rem 1.5rem;
    box-shadow: var(--shadow-lg);
}
.auth-header { text-align: center; margin-bottom: 1.75rem; }
.auth-header .brand { display: inline-flex; }
.auth-title { font-size: 17px; margin: 0 0 .5rem; text-align: center; font-weight: 600; }
.auth-footer { text-align: center; margin-top: 1rem; font-size: 13px; }

/* ── App layout (logged-in) ────────────────────────────────── */
.app-body { background: var(--bg); }
.topbar {
    background: var(--surface); border-bottom: 1px solid var(--border);
    position: sticky; top: 0; z-index: 10;
}
.topbar-inner {
    display: flex; align-items: center; gap: 1rem;
    max-width: 1200px; margin: 0 auto; padding: .7rem 1.25rem;
}
.topnav { display: flex; gap: .1rem; margin-left: .75rem; flex: 1; }
.navlink {
    color: var(--text); font-size: 13.5px; padding: .45rem .75rem;
    border-radius: var(--radius-sm); font-weight: 500;
}
.navlink:hover { background: var(--border-soft); text-decoration: none; }
.navlink.muted { color: var(--muted); cursor: not-allowed; pointer-events: none; }
.navlink.active { background: var(--brand-soft); color: var(--brand-dark); }

.usermenu { display: flex; align-items: center; gap: .5rem; }
.username { font-size: 13px; color: var(--muted); }
.logout-form { margin: 0; }

.app-main { padding: 2rem 1.25rem 4rem; }
.app-inner { max-width: 1200px; margin: 0 auto; }

/* ── Forms ──────────────────────────────────────────────────── */
.form { display: flex; flex-direction: column; gap: 1rem; margin: 0; }
.form-inline { flex-direction: row; align-items: flex-end; gap: 1rem; }
.form-narrow { max-width: 480px; }
.field { display: flex; flex-direction: column; gap: .35rem; }
.field .label { font-size: 12.5px; font-weight: 500; color: var(--text); letter-spacing: .01em; }
.field input[type="email"],
.field input[type="password"],
.field input[type="text"],
.field input[type="number"],
.field textarea,
.field select {
    font: inherit; color: var(--text);
    padding: .55rem .7rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    outline: none;
    transition: border-color .1s ease, box-shadow .1s ease;
}
.field input:focus, .field textarea:focus, .field select:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-soft);
}
.field input[readonly] { background: var(--surface-alt); color: var(--muted); }
.field.readonly .readonly-value {
    padding: .55rem .7rem; background: var(--surface-alt);
    border: 1px solid var(--border-soft); border-radius: var(--radius-sm);
    font-size: 14px;
}

.checkbox-field {
    display: inline-flex; align-items: center; gap: .5rem;
    font-size: 13px; color: var(--text); user-select: none;
}
.checkbox-field input[type="checkbox"] { accent-color: var(--brand); }

.hint { font-size: 12px; color: var(--muted); }
.form-actions { display: flex; gap: .5rem; justify-content: flex-end; margin-top: .5rem; }

/* ── Buttons ───────────────────────────────────────────────── */
.btn {
    display: inline-flex; align-items: center; justify-content: center;
    font: inherit; font-weight: 500; font-size: 13.5px;
    padding: .55rem 1rem;
    border-radius: var(--radius-sm);
    border: 1px solid transparent;
    cursor: pointer; text-decoration: none;
    transition: background .1s ease, border-color .1s ease, box-shadow .1s ease;
}
.btn:focus-visible { box-shadow: 0 0 0 3px var(--brand-soft); outline: none; }
.btn-primary { background: var(--brand); color: #fff; border-color: var(--brand); }
.btn-primary:hover { background: var(--brand-dark); border-color: var(--brand-dark); text-decoration: none; }
.btn-accent { background: var(--accent); color: var(--brand-dark); border-color: var(--accent); }
.btn-accent:hover { background: var(--accent-dark); border-color: var(--accent-dark); color: #fff; text-decoration: none; }
.btn-ghost { background: transparent; color: var(--text); border-color: var(--border); }
.btn-ghost:hover { background: var(--border-soft); text-decoration: none; }
.btn-link { background: none; border: 0; padding: 0; color: var(--brand-dark); cursor: pointer; font: inherit; font-size: 13.5px; }
.btn-link:hover { text-decoration: underline; }
.btn-link-danger { color: var(--danger); }

/* ── Flash messages ────────────────────────────────────────── */
.flash {
    padding: .7rem .85rem; border-radius: var(--radius-sm); font-size: 13px;
    margin-bottom: 1rem; border: 1px solid transparent;
}
.flash-success { background: var(--brand-soft); color: var(--brand-dark); border-color: #BFDCCC; }
.flash-error   { background: var(--danger-soft); color: #7A1B15; border-color: #F1BDB8; }
.flash-info    { background: var(--info-soft);   color: #284669; border-color: #C3D4E8; }

/* ── Page header ───────────────────────────────────────────── */
.page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.page-title  { font-size: 22px; font-weight: 600; margin: 0 0 .25rem; letter-spacing: -.01em; }
.muted       { color: var(--muted); }

/* ── Tables ────────────────────────────────────────────────── */
.table {
    width: 100%; border-collapse: collapse;
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
    overflow: hidden;
}
.table th, .table td {
    text-align: left; padding: .75rem 1rem; border-bottom: 1px solid var(--border-soft);
    font-size: 13.5px; vertical-align: middle;
}
.table thead th {
    font-weight: 500; color: var(--muted); font-size: 11px;
    text-transform: uppercase; letter-spacing: .05em;
    background: var(--surface-alt);
}
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr:hover { background: var(--surface-alt); }
.row-actions { display: flex; gap: .75rem; align-items: center; }
.inline-form { display: inline; margin: 0; }
.payload-cell { max-width: 340px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── Pills & avatars ───────────────────────────────────────── */
.avatar {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: 50%;
    color: #fff; font-size: 11px; font-weight: 600;
    margin-right: .5rem; vertical-align: middle;
    letter-spacing: .02em;
}
.avatar-sm { width: 22px; height: 22px; font-size: 10px; }

.pill { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 500; text-transform: capitalize; letter-spacing: .01em; }
.pill-role            { background: var(--border-soft); color: var(--text); }
.pill-status-active   { background: var(--brand-soft); color: var(--brand-dark); }
.pill-status-invited  { background: var(--warn-soft); color: var(--warn); }
.pill-status-disabled { background: #EDEBE4; color: var(--muted); }

/* ── Welcome / home stub ───────────────────────────────────── */
.welcome { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 2rem; box-shadow: var(--shadow); }
.welcome h1 { margin: 0 0 .75rem; font-size: 22px; letter-spacing: -.01em; }
.welcome p { margin: .4rem 0; }

/* ── API token reveal panel ────────────────────────────────── */
.token-reveal {
    background: var(--accent-soft);
    border: 1px solid #CBE29A;
    border-radius: var(--radius);
    padding: 1rem 1.15rem;
    margin-bottom: 1.5rem;
}
.token-reveal-header { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: .55rem; font-size: 13px; }
.token-reveal-body code {
    display: block;
    font-family: var(--mono); font-size: 13px;
    background: var(--surface); color: var(--text);
    padding: .65rem .8rem; border-radius: var(--radius-sm);
    border: 1px solid var(--border); word-break: break-all; user-select: all;
}
.token-reveal-hint { font-size: 12px; margin-top: .55rem; }
.token-reveal-hint code { background: transparent; padding: 0; border: 0; font-size: 12px; }

/* ── Bugs: filter bar ──────────────────────────────────────── */
.filter-bar {
    display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: flex-end;
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 1rem 1.15rem;
    margin-bottom: 1.25rem;
}
.filter-bar .filter-group { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.filter-bar .filter-group .label { font-size: 12px; color: var(--muted); font-weight: 500; letter-spacing: .02em; text-transform: uppercase; }
.filter-bar input[type="text"], .filter-bar select {
    font: inherit; padding: .45rem .6rem; border: 1px solid var(--border);
    border-radius: var(--radius-sm); background: var(--surface); color: var(--text);
}
.filter-bar select[multiple] { min-width: 180px; }
.filter-actions { flex-direction: row; align-items: center; gap: .75rem; margin-left: auto; }

/* ── Bugs: table ───────────────────────────────────────────── */
.bugs-table .bug-title-link { color: var(--text); font-weight: 500; }
.bugs-table .bug-title-link:hover { color: var(--brand-dark); text-decoration: none; }
.bugs-table .row-archived { opacity: .55; }
.avatar-stack { display: inline-flex; align-items: center; }
.avatar-stack .avatar { margin-right: -6px; border: 2px solid var(--surface); }
.avatar-stack .avatar:last-child { margin-right: 0; }

/* ── Bugs: detail layout ───────────────────────────────────── */
.bug-layout {
    display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1.5rem;
}
.bug-main, .bug-sidebar { display: flex; flex-direction: column; gap: 1rem; }
.panel {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 1.1rem 1.2rem;
    box-shadow: var(--shadow);
}
.panel-title { margin: 0 0 .75rem; font-size: 13px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.bug-description { white-space: pre-wrap; line-height: 1.55; }

/* Attachments */
.attachment-list { list-style: none; padding: 0; margin: 0 0 .75rem; }
.attachment-list li {
    display: flex; align-items: center; gap: .65rem; padding: .35rem 0;
    border-bottom: 1px solid var(--border-soft); font-size: 13.5px;
}
.attachment-list li:last-child { border-bottom: 0; }
.attachment-upload { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; padding-top: .5rem; border-top: 1px dashed var(--border); }
.attachment-upload .hint { margin-left: .5rem; }

/* Comments */
.comment-list { list-style: none; padding: 0; margin: 0 0 1rem; display: flex; flex-direction: column; gap: .9rem; }
.comment { border: 1px solid var(--border-soft); border-radius: var(--radius-sm); padding: .65rem .85rem; background: var(--surface-alt); }
.comment-header { display: flex; align-items: center; gap: .5rem; margin-bottom: .35rem; font-size: 13px; }
.comment-header .inline-form { margin-left: auto; }
.comment-body { white-space: pre-wrap; line-height: 1.5; font-size: 14px; }

/* Sidebar lists */
.people-list, .history-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .4rem; font-size: 13.5px; }
.history-list li { padding: .35rem 0; border-bottom: 1px solid var(--border-soft); }
.history-list li:last-child { border-bottom: 0; }

.detail-list { display: grid; grid-template-columns: 80px 1fr; gap: .35rem .75rem; margin: 0; font-size: 13px; }
.detail-list dt { color: var(--muted); font-weight: 500; }
.detail-list dd { margin: 0; }

/* Bug form tweaks */
.form-narrow-wide { max-width: 720px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.assignee-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .5rem; }
.assignee-check {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .4rem .6rem; border: 1px solid var(--border); border-radius: var(--radius-sm);
    cursor: pointer; font-size: 13px; user-select: none;
}
.assignee-check:hover { background: var(--surface-alt); }
.assignee-check input[type="checkbox"] { accent-color: var(--brand); }

/* ── Checklist ─────────────────────────────────────────────── */
.progress {
    position: relative;
    height: 10px;
    background: var(--border-soft, #EDEBE7);
    border-radius: 999px;
    overflow: hidden;
}
.progress-lg { height: 14px; }
.progress-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--brand), var(--accent-dark));
    transition: width .2s ease;
}
.progress-label {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 600; color: var(--text);
    mix-blend-mode: normal;
}

.section-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
}
.section-card {
    display: block;
    padding: 1rem 1.15rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    text-decoration: none;
    color: var(--text);
    transition: border-color .15s, transform .15s, box-shadow .15s;
}
.section-card:hover {
    border-color: var(--brand);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(40, 93, 69, 0.08);
}
.section-card-head {
    display: flex; justify-content: space-between; align-items: flex-start;
    gap: .5rem; margin-bottom: .25rem;
}
.section-card-title {
    margin: 0; font-size: 15px; font-weight: 600; line-height: 1.3;
}
.section-card-desc {
    font-size: 13px; margin: .25rem 0 .75rem; line-height: 1.4;
}
.section-card-meta {
    display: flex; justify-content: space-between;
    font-size: 12px; color: var(--muted);
    margin-top: .4rem;
}
.pill-phase {
    background: var(--brand-soft);
    color: var(--brand-dark);
    font-size: 11px;
    padding: 2px 8px;
}

.sev-row {
    display: flex; flex-wrap: wrap; gap: .25rem;
    margin-top: .5rem;
}
.sev-tag {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}
.sev-must    { background: #FDECEC; color: #8C2323; }
.sev-should  { background: #FEF3E0; color: #8C5A1A; }
.sev-nice    { background: #EDF6DE; color: #4F7220; }
.sev-missing { background: #F4E8F8; color: #5B3A72; }
.sev-design  { background: #E4EEF8; color: #2F6690; }
.sev-new     { background: var(--brand-soft); color: var(--brand-dark); }
.sev-pro     { background: #EAE6F2; color: #4A3C74; }
.sev-default { background: var(--border-soft); color: var(--muted); }

.checklist-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 1.5rem;
}

.panel-header {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: .75rem;
}
.panel-header .panel-title { margin: 0; }

.check-list {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: .25rem;
}
.check-row {
    display: grid;
    grid-template-columns: 28px 1fr auto;
    gap: .75rem;
    align-items: center;
    padding: .5rem .5rem .5rem 0;
    border-bottom: 1px solid var(--border-soft, #EDEBE7);
}
.check-row:last-child { border-bottom: 0; }
.check-row.is-done .check-title {
    text-decoration: line-through;
    color: var(--muted);
}
.check-list-compact .check-row { padding: .35rem 0; }

.check-toggle {
    width: 22px; height: 22px;
    border: 2px solid var(--border);
    border-radius: 6px;
    background: var(--surface);
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 700;
    color: transparent;
    transition: background-color .12s, border-color .12s, color .12s;
    padding: 0;
}
.check-toggle:hover { border-color: var(--brand); }
.check-row.is-done .check-toggle {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
}
.check-body { min-width: 0; }
.check-title {
    font-size: 14px;
    line-height: 1.3;
    word-break: break-word;
}
.check-sub {
    display: flex; gap: .4rem; align-items: center;
    font-size: 12px;
    margin-top: .15rem;
    flex-wrap: wrap;
}

.add-item-form { margin-top: 1rem; padding-top: 1rem; border-top: 1px dashed var(--border); }

.dod-pct-row {
    display: flex; gap: .75rem; align-items: center;
}
.dod-pct-row input[type="range"] {
    flex: 1; accent-color: var(--brand);
}
.dod-pct-row output {
    min-width: 44px; text-align: right;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 600;
}
.dod-flags {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .4rem;
    margin: .75rem 0;
}

/* ── Roadmap ───────────────────────────────────────────────── */
.roadmap-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1rem;
    align-items: start;
}
.roadmap-block {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 1rem 1rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: .75rem;
}
.roadmap-block-head {
    border-left: 4px solid var(--brand);
    padding-left: .75rem;
}
.roadmap-block-title {
    display: flex; justify-content: space-between; align-items: baseline; gap: .5rem;
}
.roadmap-block-title h2 {
    margin: 0; font-size: 16px; font-weight: 700; line-height: 1.25;
}
.roadmap-block-subtitle {
    margin: .15rem 0 0;
    font-size: 12px;
    color: var(--muted);
    line-height: 1.35;
}
.roadmap-block-progress {
    display: flex; align-items: center; gap: .6rem;
    margin-top: .5rem;
    font-size: 12px;
}
.roadmap-block-progress .progress { flex: 1; }

.roadmap-actions {
    display: inline-flex; gap: .5rem; align-items: baseline; font-size: 12px;
}
.roadmap-actions .inline-form { display: inline; }

.roadmap-section-list {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: .4rem;
}
.roadmap-section-list > li {
    background: var(--surface);
    border: 1px solid var(--border-soft, var(--border));
    border-radius: 8px;
    padding: .55rem .7rem;
}
.roadmap-section-link {
    display: block;
    color: var(--text);
    text-decoration: none;
}
.roadmap-section-link:hover .roadmap-section-title { color: var(--brand); }
.roadmap-section-title {
    font-size: 13px; font-weight: 600; line-height: 1.25;
    display: flex; align-items: center; gap: .4rem;
    flex-wrap: wrap;
}
.roadmap-section-progress {
    display: flex; align-items: center; gap: .5rem;
    margin-top: .25rem;
    font-size: 11px;
}
.roadmap-section-progress .progress { flex: 1; height: 6px; }

.roadmap-empty { margin: .25rem 0 0; font-size: 13px; }

.roadmap-assign {
    display: flex; gap: .35rem; margin-top: .4rem;
    align-items: center;
}
.roadmap-assign select {
    flex: 1; padding: 3px 6px; font-size: 12px;
    background: var(--bg); border: 1px solid var(--border); border-radius: 6px;
}
.roadmap-assign .roadmap-phase-input {
    width: 48px; padding: 3px 6px; font-size: 12px;
    border: 1px solid var(--border); border-radius: 6px;
    font-family: var(--font-mono, ui-monospace, monospace);
    text-align: center;
}

.roadmap-unassigned {
    margin-top: 1.5rem;
    padding: 1rem;
    background: var(--surface-alt, #F8F7F3);
    border: 1px dashed var(--border);
    border-radius: 10px;
}

.color-field {
    display: flex; gap: .5rem; align-items: center;
}
.color-field input[type="color"] {
    width: 42px; height: 32px; padding: 0;
    border: 1px solid var(--border); border-radius: 6px;
    background: transparent; cursor: pointer;
}
.color-readonly {
    flex: 1;
    background: var(--bg);
    color: var(--muted);
    border: 1px solid var(--border); border-radius: 6px;
    padding: 4px 8px;
}

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 880px) {
    .bug-layout { grid-template-columns: 1fr; }
    .checklist-layout { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .topbar-inner { flex-wrap: wrap; }
    .topnav { order: 3; width: 100%; margin-left: 0; overflow-x: auto; }
    .page-header { flex-direction: column; align-items: stretch; }
    .form-inline { flex-direction: column; align-items: stretch; }
    .form-row { grid-template-columns: 1fr; }
    .brand-wordmark .brand-sub { display: none; }
    .filter-actions { margin-left: 0; width: 100%; justify-content: flex-start; }
    .section-grid { grid-template-columns: 1fr; }
    .roadmap-grid { grid-template-columns: 1fr; }
}

/* ── Tower dashboard ──────────────────────────────────────────── */
.tower-hero {
    display: flex; justify-content: space-between; align-items: flex-end;
    gap: 1rem; flex-wrap: wrap;
    margin-bottom: 1.5rem;
}
.tower-hello { margin: 0; font-size: 22px; letter-spacing: -.01em; }
.tower-sub   { margin: .35rem 0 0; }

.tower-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.kpi-card {
    display: block;
    padding: 1rem 1.15rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--text);
    text-decoration: none;
    transition: border-color .15s, transform .15s, box-shadow .15s;
}
.kpi-card:hover {
    border-color: var(--brand);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(40, 93, 69, 0.08);
    text-decoration: none;
}
.kpi-label { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.kpi-value { font-size: 30px; font-weight: 600; line-height: 1.1; margin: .25rem 0 .5rem; color: var(--brand-dark); }
.kpi-sub   { font-size: 12px; margin-top: .5rem; }
.kpi-card .progress { height: 6px; }

.tower-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}
.tower-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 1rem 1.15rem;
}
.tower-card-wide { grid-column: 1 / -1; }
.tower-card-head {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: .75rem;
}
.tower-card-head h2 { margin: 0; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }

.priority-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .5rem; }
.priority-row {
    display: grid;
    grid-template-columns: auto 1fr auto 2fr;
    align-items: center; gap: .75rem;
    font-size: 13.5px;
}
.priority-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.priority-label { color: var(--text); }
.priority-count { font-weight: 600; min-width: 2ch; text-align: right; }
.priority-bar { position: relative; height: 6px; background: var(--border-soft); border-radius: 999px; overflow: hidden; }
.priority-bar-fill { position: absolute; inset: 0 auto 0 0; height: 100%; border-radius: 999px; }

.mybugs-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.mybugs-list li + li { border-top: 1px solid var(--border-soft); }
.mybugs-link {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center; gap: .6rem;
    padding: .55rem 0;
    color: var(--text);
    text-decoration: none;
    font-size: 13.5px;
}
.mybugs-link:hover { color: var(--brand-dark); }
.mybugs-link:hover .mybugs-title { text-decoration: underline; }
.mybugs-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mybugs-due { font-size: 11.5px; }
.status-pill { padding: 1px 8px; font-size: 11px; }

.focus-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.focus-list li + li { border-top: 1px solid var(--border-soft); }
.focus-link { display: block; padding: .55rem 0; color: var(--text); text-decoration: none; }
.focus-link:hover .focus-title { color: var(--brand-dark); text-decoration: underline; }
.focus-title { display: flex; align-items: center; gap: .5rem; font-size: 13.5px; margin-bottom: .3rem; }
.focus-progress { display: flex; align-items: center; gap: .75rem; }
.focus-progress .progress { flex: 1; height: 6px; }

.roadmap-mini { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .6rem; }
.roadmap-mini-row { display: flex; align-items: center; gap: .6rem; font-size: 13.5px; margin-bottom: .2rem; }
.roadmap-mini-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.roadmap-mini-title { flex: 1; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.roadmap-mini .progress { height: 6px; }

.activity-feed { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.activity-feed li + li { border-top: 1px solid var(--border-soft); }
.activity-row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center; gap: .6rem;
    padding: .5rem 0;
    font-size: 13px;
}
.activity-text { color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.activity-text strong { font-weight: 600; margin-right: .25rem; }
.activity-time { font-size: 11.5px; white-space: nowrap; }

@media (max-width: 880px) {
    .tower-grid { grid-template-columns: 1fr; }
    .tower-card-wide { grid-column: auto; }
    .priority-row { grid-template-columns: auto 1fr auto; }
    .priority-row .priority-bar { grid-column: 1 / -1; }
    .mybugs-link { grid-template-columns: auto 1fr auto; }
    .mybugs-due { display: none; }
    .activity-row { grid-template-columns: auto 1fr; }
    .activity-time { grid-column: 2; font-size: 11px; padding-top: .2rem; }
}

