/* Original Razor/CSS implementation of the reviewed 21st table, sheet and timeline anatomy. */
.issue-center { --issue-blue:#156be8; color:var(--ink); min-width:0; }
.issue-center a { text-decoration:none; }
.issue-page-heading { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; margin-bottom:1.65rem; }
.issue-page-heading h1 { font-size:1.9rem; letter-spacing:-.04em; margin:.4rem 0; }
.issue-page-heading p { color:var(--muted); margin:.4rem 0 0; line-height:1.6; font-size:.9rem; }
.issue-center .primary-button,.issue-center .text-button { display:inline-flex; align-items:center; justify-content:center; gap:.45rem; min-height:44px; padding:.65rem .95rem; border-radius:8px; font-size:.8rem; font-weight:650; cursor:pointer; white-space:nowrap; }
.issue-center .primary-button { color:white; background:var(--issue-blue); border:1px solid var(--issue-blue); box-shadow:0 2px 4px #146ae51a; }
.issue-center .text-button { color:var(--ink); background:var(--surface); border:1px solid var(--line); box-shadow:none; }
.issue-header-actions { display:flex; gap:.75rem; align-items:center; flex-wrap:wrap; }
.issue-center button:disabled { cursor:not-allowed; opacity:.55; }
.issue-center :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid #1572ed; outline-offset:3px; }
.issue-center .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.issue-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; margin-bottom:1.35rem; }
.issue-metric { display:flex; align-items:flex-start; gap:1rem; padding:1.15rem; background:var(--surface); border:1px solid var(--line); border-radius:12px; min-height:113px; box-shadow:0 3px 9px #18384a03; color:var(--ink); }
.issue-metric:hover { border-color:var(--issue-blue); }
.issue-metric-icon { flex:none; display:grid; place-items:center; width:43px; height:43px; border-radius:10px; color:var(--issue-blue); background:#e9f1ff; }
.issue-metric[data-tone=red] .issue-metric-icon { color:#e34051; background:#fff0f1; }
.issue-metric[data-tone=amber] .issue-metric-icon { color:#aa6a11; background:#fff6df; }
.issue-metric[data-tone=green] .issue-metric-icon { color:#168263; background:#e8f7f1; }
.issue-metric small { display:block; color:var(--muted); font-size:.76rem; font-weight:600; line-height:1.4; }
.issue-metric strong { display:block; font-size:1.7rem; letter-spacing:-.04em; margin:.25rem 0; line-height:1; }
.issue-metric em { color:var(--muted); font-size:.7rem; font-style:normal; line-height:1.4; }
.issue-workspace { display:grid; grid-template-columns:minmax(0,1fr); align-items:start; gap:1.2rem; min-width:0; }
.issue-workspace.has-selection { grid-template-columns:minmax(0,1fr); }
.issue-workspace.has-selection .issue-directory,.issue-center:has(.has-selection) .issue-metrics { display:none; }
.issue-directory,.issue-investigation { min-width:0; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 4px 14px #193d5d04; }
.issue-directory-heading { display:flex; align-items:center; justify-content:space-between; padding:1.2rem; border-bottom:1px solid var(--line); }
.issue-directory-heading h2 { margin:0; font-size:.95rem; letter-spacing:-.02em; }
.issue-directory-heading h2 span { color:var(--muted); font-size:.75rem; padding:.15rem .5rem; border-radius:6px; background:var(--surface-soft); margin-left:.4rem; }
.issue-reset { color:var(--muted); font-size:.75rem; min-height:44px; display:flex; align-items:center; }
.issue-filters { display:flex; align-items:end; flex-wrap:wrap; gap:.65rem; padding:1rem 1.2rem; border-bottom:1px solid var(--line); }
.issue-filters label { display:grid; gap:.35rem; font-size:.67rem; color:var(--muted); flex:1 1 95px; min-width:0; font-weight:650; }
.issue-filters :is(input,select) { width:100%; min-width:0; min-height:44px; border:1px solid var(--line); padding:.6rem .65rem; border-radius:7px; color:var(--ink); background:var(--surface); font:inherit; font-size:.74rem; }
.issue-filters label.issue-search { position:relative; flex:1 1 100%; }
.issue-search svg { position:absolute; top:14px; left:12px; color:var(--muted); }
.issue-search input { padding-left:2.2rem; }
.issue-more-filters { flex:1 1 100%; }
.issue-more-filters summary { display:flex; align-items:center; gap:.5rem; color:var(--muted); cursor:pointer; font-size:.74rem; min-height:44px; }
.issue-filter-extra { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.7rem; padding:.5rem 0 1rem; }
.issue-filter-extra label { display:grid; }
.issue-filters > button { margin-left:auto; }
.issue-filter-note,.issue-count-definition { font-size:.7rem; line-height:1.55; color:var(--muted); margin:0; padding:.75rem 1.2rem; }
.issue-filter-note { background:var(--surface-tint); }
.issue-filter-note a { color:var(--issue-blue); }
.issue-table-scroll { overflow:auto; min-width:0; }
.issue-table { border-collapse:collapse; width:100%; min-width:940px; font-size:.74rem; table-layout:fixed; }
.issue-table th { padding:.8rem .8rem; text-align:left; background:#f8fafc; color:var(--muted); font-size:.66rem; font-weight:600; border-bottom:1px solid var(--line); }
.issue-table th:first-child { width:100px; padding-left:1.2rem; }
.issue-table th:nth-child(2) { width:240px; }
.issue-table th:nth-child(3) { width:160px; }
.issue-table th:nth-child(4) { width:90px; }
.issue-table th:nth-child(5) { width:100px; }
.issue-table th:nth-child(6) { width:155px; }
.issue-table th:nth-child(7) { width:130px; }
.issue-table th:last-child { width:90px; }
.issue-table td { padding:1rem .8rem; border-bottom:1px solid #eaf0f6; vertical-align:middle; line-height:1.5; overflow-wrap:anywhere; }
.issue-table td:first-child { padding-left:1.2rem; }
.issue-table tbody tr:hover,.issue-table tr.is-selected { background:#f6faff; }
.issue-table small { display:block; color:var(--muted); margin-top:.25rem; font-size:.65rem; }
.issue-number { color:var(--muted); font-size:.68rem; font-variant-numeric:tabular-nums; font-weight:650; }
.issue-title-link { color:var(--ink); font-weight:700; display:block; min-height:24px; }
.issue-title-link:hover { color:var(--issue-blue); }
.issue-badge { display:inline-flex; align-items:center; gap:.3rem; border-radius:6px; font-size:.66rem; font-weight:650; line-height:1.5; padding:.25rem .5rem; background:#edf2f8; color:#4a617b; overflow-wrap:normal; }
.issue-badge[data-severity=Critical],.issue-badge[data-severity=High] { background:#ffebee; color:#b9273d; }
.issue-badge[data-severity=Critical] { border:1px solid #efb7c2; font-weight:750; }
.issue-badge[data-severity=Medium] { color:#986413; background:#fff4dc; }
.issue-badge[data-severity=Low] { color:#456b9a; background:#edf4fe; }
.issue-badge[data-status=New],.issue-badge[data-status=Reopened] { color:#bb3447; background:#fff0f2; }
.issue-badge[data-status="In Progress"],.issue-badge[data-status=Investigating] { color:#2465bd; background:#eaf2ff; }
.issue-badge[data-status="Waiting on Customer"],.issue-badge[data-status="Awaiting Verification"] { color:#956512; background:#fff3d8; }
.issue-badge[data-status=Resolved] { color:#167657; background:#e5f6ee; }
.issue-platform-label { color:var(--muted); }
.issue-pagination { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; min-height:74px; padding:1rem 1.2rem; color:var(--muted); font-size:.72rem; }
.issue-pagination nav { display:flex; align-items:center; flex-wrap:wrap; gap:.8rem; }
.issue-pagination nav a { display:flex; align-items:center; min-height:44px; padding:.4rem .6rem; color:var(--issue-blue); border:1px solid var(--line); border-radius:6px; }
.issue-investigation { position:static; display:flex; flex-direction:column; }
.issue-panel-header { padding:1.25rem; background:var(--surface); border-bottom:1px solid var(--line); flex:none; }
.issue-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
.issue-panel-heading .issue-number { color:var(--issue-blue); font-size:.72rem; letter-spacing:.05em; }
.issue-close { width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--line); border-radius:8px; color:var(--muted); font-size:1.5rem; }
.issue-panel-header h2 { margin:.55rem 0 .8rem; font-size:1.22rem; line-height:1.4; letter-spacing:-.03em; overflow-wrap:anywhere; }
.issue-panel-header p { color:var(--muted); font-size:.8rem; line-height:1.6; }
.issue-panel-badges { display:flex; align-items:center; flex-wrap:wrap; gap:.6rem; }
.issue-panel-badges > small { color:var(--muted); font-size:.65rem; margin-left:auto; }
.issue-actions { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.issue-center .issue-actions :is(.text-button,.primary-button) { font-size:.68rem; padding:.5rem .65rem; }
.issue-tabs { display:flex; gap:.8rem; padding:0 1.25rem; border-bottom:1px solid var(--line); flex:none; overflow:auto; }
.issue-tabs a { font-size:.7rem; color:var(--muted); min-height:50px; display:flex; align-items:center; white-space:nowrap; border-bottom:2px solid transparent; }
.issue-tabs a.active { color:var(--issue-blue); font-weight:700; border-color:var(--issue-blue); }
.issue-panel-body { min-height:0; padding:1.5rem; }
.issue-form,.issue-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; min-width:0; }
.issue-form .wide { grid-column:1/-1; }
.issue-form label { display:grid; gap:.45rem; min-width:0; font-size:.73rem; font-weight:650; }
.issue-form label > span,.issue-form label > small { font-size:.65rem; font-weight:400; color:var(--muted); }
.issue-form :is(input:not([type=hidden]),textarea,select) { width:100%; min-width:0; min-height:44px; border:1px solid var(--line-strong); border-radius:7px; background:white; color:var(--ink); padding:.65rem .75rem; font:inherit; font-weight:400; line-height:1.55; }
.issue-form textarea { resize:vertical; }
.issue-form .issue-checkbox { display:flex; align-items:center; gap:.6rem; line-height:1.5; font-weight:400; }
.issue-form input[type=checkbox] { width:18px; min-height:18px; flex:none; }
.issue-form-footer { display:flex; justify-content:flex-end; gap:.7rem; border-top:1px solid var(--line); padding-top:1rem; }
.issue-additional { border-top:1px solid var(--line); padding-top:.3rem; }
.issue-additional summary { display:flex; align-items:center; justify-content:space-between; min-height:44px; cursor:pointer; font-weight:650; font-size:.77rem; }
.issue-additional summary small { color:var(--muted); font-weight:400; }
.issue-additional .issue-form-grid { margin-top:.65rem; }
.issue-privacy,.issue-help { color:var(--muted); font-size:.72rem; line-height:1.6; font-weight:400; margin:.3rem 0; }
.issue-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.15rem 1rem; margin:0 0 1.5rem; }
.issue-detail-grid dt { color:var(--muted); font-size:.66rem; margin-bottom:.35rem; }
.issue-detail-grid dd { margin:0; font-size:.77rem; overflow-wrap:anywhere; line-height:1.5; }
.issue-detail-section { border-top:1px solid var(--line); padding-top:1.2rem; margin-top:1.2rem; }
.issue-detail-section h3,.issue-section-title h3 { font-size:.82rem; margin:0 0 .65rem; letter-spacing:-.01em; }
.issue-prose { white-space:pre-wrap; overflow-wrap:anywhere; font-size:.78rem; line-height:1.75; margin:.5rem 0; }
.issue-section-title { display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
.issue-section-title > a { display:flex; align-items:center; min-height:44px; color:var(--issue-blue); font-size:.7rem; font-weight:650; }
.issue-company { border:1px solid var(--line); border-radius:8px; background:var(--surface-soft); padding:.85rem; margin:.6rem 0; }
.issue-company strong { font-size:.78rem; margin-right:.5rem; }
.issue-company > small { font-size:.65rem; color:var(--muted); line-height:1.6; margin-left:.4rem; }
.issue-company p { white-space:pre-wrap; overflow-wrap:anywhere; font-size:.75rem; line-height:1.6; margin:.5rem 0; }
.issue-timeline { margin:1rem 0; padding:0; list-style:none; }
.issue-timeline li { position:relative; display:flex; align-items:flex-start; gap:.8rem; padding:0 0 1.5rem; }
.issue-timeline li:not(:last-child):before { content:""; position:absolute; left:16px; width:1px; background:var(--line); top:35px; bottom:0; }
.issue-activity-avatar { display:grid; place-items:center; flex:none; width:34px; height:34px; background:#ecf3fe; border:1px solid #d7e4f7; border-radius:50%; color:#356fb1; font-size:.65rem; font-weight:700; z-index:1; }
.issue-timeline article { flex:1; min-width:0; }
.issue-timeline article > div { display:flex; flex-wrap:wrap; gap:.3rem; font-size:.74rem; line-height:1.6; }
.issue-timeline article > div > span { color:var(--muted); }
.issue-timeline article small { color:var(--muted); font-size:.62rem; margin-left:auto; }
.issue-timeline time { color:var(--muted); font-size:.64rem; display:block; margin:.2rem 0; }
.issue-timeline details summary { color:var(--muted); font-size:.67rem; cursor:pointer; min-height:35px; align-content:center; }
.issue-timeline pre { white-space:pre-wrap; overflow-wrap:anywhere; background:var(--surface-soft); border:1px solid var(--line); padding:.7rem; border-radius:7px; font-size:.65rem; line-height:1.7; max-height:350px; overflow:auto; }
.issue-history-pages { display:flex; justify-content:space-between; gap:1rem; font-size:.75rem; }
.issue-history-pages a { min-height:44px; color:var(--issue-blue); display:flex; align-items:center; }
.issue-related { display:grid; gap:.45rem; border:1px solid var(--line); border-radius:8px; padding:1rem; color:var(--ink); margin:.6rem 0; }
.issue-related strong { font-size:.78rem; }.issue-related small { color:var(--muted); font-size:.7rem; }
.issue-reference { display:grid; gap:.45rem; padding:.9rem 0; border-bottom:1px solid var(--line); font-size:.75rem; overflow-wrap:anywhere; }
.issue-reference a { color:var(--issue-blue); line-height:1.6; }
.issue-action-card { border:1px solid #bfd6f6; background:#fbfdff; padding:1rem; border-radius:10px; margin-bottom:1.4rem; }
.issue-action-card h3 { margin:0 0 1rem; font-size:.87rem; }
.issue-empty,.issue-state { display:grid; justify-items:center; align-content:center; text-align:center; gap:.7rem; min-height:230px; padding:2rem; color:var(--muted); }
.issue-empty strong { color:var(--ink); font-size:.85rem; }.issue-empty p { margin:0; max-width:390px; font-size:.76rem; line-height:1.7; }
.issue-state { background:white; border:1px solid var(--line); border-radius:12px; }.issue-state h2 { color:var(--ink); margin:0; font-size:1.2rem; }.issue-state p { max-width:550px; line-height:1.7; }
.issue-notice { display:flex; align-items:center; gap:.6rem; padding:.85rem 1rem; margin-bottom:1rem; border-radius:9px; font-size:.8rem; line-height:1.6; border:1px solid var(--line); }
.issue-notice.success { background:#eafaF2; border-color:#c0e7d1; color:#166044; }
.issue-notice.error { background:#fff3f4; border-color:#efc5cb; color:#963342; }
.issue-draft-notice { grid-column:1/-1; color:#795416; background:#fff6df; padding:.75rem; border:1px solid #e8d3a3; border-radius:7px; font-size:.75rem; line-height:1.6; }
@media(min-width:1800px) { .issue-table { min-width:100%; } }
@media(max-width:1250px) {
    .issue-workspace.has-selection { grid-template-columns:minmax(0,1fr); }
    .issue-workspace.has-selection .issue-directory { display:none; }
    .issue-investigation { position:static; max-height:none; }
    .issue-panel-body { overflow:visible; }
    .issue-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:650px) {
    .issue-page-heading { align-items:flex-start; flex-direction:column; gap:1rem; }
    .issue-page-heading h1 { font-size:1.65rem; }
    .issue-page-heading > a { width:100%; }
    .issue-metrics { gap:.65rem; }.issue-metric { gap:.65rem; padding:.85rem; min-height:110px; }.issue-metric-icon { width:33px; height:33px; }.issue-metric small { font-size:.65rem; }.issue-metric em { font-size:.6rem; }
    .issue-filter-extra { grid-template-columns:1fr 1fr; }
    .issue-form,.issue-form-grid { grid-template-columns:minmax(0,1fr); }
    .issue-detail-grid { grid-template-columns:minmax(0,1fr); }
    .issue-panel-body,.issue-panel-header { padding:1rem; }.issue-tabs { padding:0 1rem; }
    .issue-pagination { align-items:flex-start; flex-direction:column; }
    .issue-actions { gap:.4rem; }.issue-center .issue-actions .text-button { flex:1 1 40%; }
}
.issue-attachments { display: grid; gap: 16px; }
.issue-attachment-capacity { display: flex; justify-content: space-between; gap: 12px; color: var(--text-secondary, #526176); font-size: .78rem; }
.issue-attachment-upload { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--border, #dce4ee); border-radius: 12px; background: #f8fbff; }
.issue-attachment-upload label,.issue-attachment-retire label { display: grid; gap: 7px; font-size: .82rem; font-weight: 600; }
.issue-attachment-upload select,.issue-attachment-retire input { width: 100%; padding: 10px; border: 1px solid #ccd7e5; border-radius: 7px; background: white; font: inherit; }
.issue-attachment-drop { padding: 20px 12px; border: 1px dashed #9eb7d5; border-radius: 10px; background: white; text-align: center; justify-items: center; }
.issue-attachment-drop:focus-within { outline: 2px solid #1768ce; outline-offset: 3px; }
.issue-attachment-drop span { font-size: .75rem; font-weight: 400; color: #586d85; }
.issue-attachment-drop input { width: 100%; max-width: 300px; font-size: .8rem; }
.issue-attachment-paste { padding: 10px 12px; border-radius: 7px; background: #edf4fc; color: #365c85; font-size: .78rem; line-height: 1.5; }
.issue-attachment-paste:focus { outline: 2px solid #1768ce; outline-offset: 2px; }
.issue-attachment-upload button { justify-self: start; }
.issue-attachment-upload [data-upload-status] { margin: 0; font-size: .82rem; overflow-wrap: anywhere; }
.issue-attachment-upload [role="alert"],.issue-attachment-warning { color: #a22837; font-size: .8rem; }
.issue-attachment-list { display: grid; gap: 14px; }
.issue-attachment-card { padding: 16px; border: 1px solid #dce4ee; border-radius: 12px; background: white; }
.issue-attachment-heading { display: flex; align-items: start; gap: 10px; }
.issue-attachment-heading > div { min-width: 0; flex: 1; }
.issue-attachment-heading strong { display: block; overflow-wrap: anywhere; font-size: .9rem; }
.issue-attachment-heading small { display: block; margin-top: 4px; color: #607086; font-size: .72rem; }
.issue-attachment-scope { display: inline-block; padding: 5px 8px; border-radius: 6px; color: #315a84; background: #edf4fc; font-size: .75rem; }
.issue-attachment-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.issue-attachment-actions form { margin: 0; }
.issue-attachments .secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 12px; border: 1px solid #cfdae7; border-radius: 7px; background: white; color: #264e7d; font: inherit; font-size: .78rem; font-weight: 600; line-height: 1.35; text-decoration: none; cursor: pointer; }
.issue-attachments .secondary-button:hover { background: #f1f6fc; border-color: #9db5d3; }
.issue-attachments .secondary-button:focus-visible { outline: 2px solid #1768ce; outline-offset: 3px; }
.issue-attachment-drop input::file-selector-button { padding: 7px 9px; margin-right: 7px; border: 1px solid #c7d6e7; border-radius: 6px; background: #f5f9ff; color: #264e7d; font-weight: 600; cursor: pointer; }
.issue-attachment-retire { margin-top: 15px; padding-top: 12px; border-top: 1px solid #e7edf4; font-size: .8rem; }
.issue-attachment-retire summary { cursor: pointer; color: #546981; }
.issue-attachment-retire form { display: grid; gap: 10px; margin-top: 12px; }
.issue-attachment-retire button { justify-self: start; }