/* Shared product typography and layout. Keep the dense board's existing layout. */
:root { --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-6:24px; }
body, button, input, select, textarea, .organizationLink, .tourDialog { font-family:var(--font-ui); }
h1,h2,h3,h4,h5,h6,.brand { font-family:var(--font-heading); font-weight:700; letter-spacing:-.02em; }
h1,.container h1,.docsIntro h1,.auth-story h1 { font-size:26px; line-height:1.25; letter-spacing:-.025em; }
h2,.docsArticle h2,.tourDialog h2 { font-size:19px; line-height:1.35; }
h3 { font-size:16px; line-height:1.4; text-transform:none; letter-spacing:0; }
button,.button,label { font-weight:500; }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color:transparent; }
summary { cursor:pointer; min-height:44px; padding-block:10px; }
:focus-visible { outline:2px solid var(--theme-fg); outline-offset:3px; }
[hidden] { display:none!important; }
.eyebrow { display:none; }
.container { gap:20px; padding-top:26px; }
.hero { gap:16px; align-items:center; }
.hero p { margin-top:6px; }
#pageHint:empty { display:none; }
.hero .contextHelp { display:inline-flex; align-items:center; min-height:32px; font-size:13px; }
.panel { padding:20px; border-radius:10px; }
.project-card { gap:12px; }
.project-card h2 { font-size:18px; }
.project-card > p { font-size:15px; }
.app-header { padding-block:10px; }
.organization-page .container { gap:14px; }
.organization-page #setupEntry { order:4; }
.organization-page #content { order:3; }
.organization-page #tabs { position:sticky; top:0; z-index:8; margin-inline:-4px; padding:8px 4px; background:var(--canvas); border-bottom:1px solid var(--line); }
.tabs button { border-radius:7px; }
.setup-entry { padding:10px 14px; margin:0; border-radius:8px; gap:10px; background:var(--theme-panel); }
.setup-entry p { display:none; }
.setup-entry .row { gap:8px; width:auto; }
.setup-entry .button,.setup-entry button { min-height:36px; padding:5px 10px; font-size:14px; }
.setup-entry strong { font-size:14px; font-weight:500; }
.member { padding-block:14px; gap:12px; }
.member strong { font-weight:600; }
.member .small { line-height:1.45; }
.member .avatar { width:32px; height:32px; font-size:12px; flex:none; }
.token-row { align-items:flex-start; }
.token-actions button { padding:7px 12px; min-height:40px; }
.token-actions .danger { color:var(--theme-bad); background:transparent; border-color:transparent; }
.project-options { max-height:none; }
.dialog { padding:0; overflow:hidden; border-radius:12px; width:min(620px,calc(100vw - 24px)); max-height:calc(100dvh - 32px); }
.dialog[open] { display:flex; flex-direction:column; }
.dialog > header { margin:0; padding:16px 20px; border-bottom:1px solid var(--line); flex:none; }
.dialog > header button { height:44px; min-width:44px; padding:8px; }
#dialogError:not(:empty) { flex:none; margin:12px 20px 0; max-height:25dvh; overflow:auto; }
#dialogBody { min-height:0; overflow:auto; overscroll-behavior:contain; padding:20px; }
#dialogFooter { flex:none; border-top:1px solid var(--line); background:var(--paper); padding:12px 20px max(12px,env(safe-area-inset-bottom)); }
#dialogFooter:empty { display:none; }
#dialogFooter .actions { margin:0; }
#dialogBody form { gap:16px; }
#dialogBody p { font-size:15px; }
#dialogBody .project-options { max-height:none; }
/* A compact overview and a single form column until a full sidebar fits. */
.setup-container { gap:10px; max-width:1100px; }
.setup-heading p { margin-top:6px; font-size:15px; }
#setupError:empty { display:none; }
.setup-layout { margin:12px 0; gap:24px; grid-template-columns:210px minmax(0,1fr); }
.step-menu { position:sticky; top:16px; }
.step-menu > summary { display:none; }
.setup-layout nav { display:grid; overflow:visible; gap:4px; padding:0; }
.setup-layout nav button { padding:10px; border-color:transparent; background:transparent; min-height:58px; }
.setup-layout nav button[aria-current] { background:var(--theme-panel2); border-color:var(--theme-edge); }
.step-number { width:24px; height:24px; font-size:13px; }
.step-label small { font-size:12px; }
.setup-layout .card { padding:24px; border-radius:10px; }
.setup-layout form { gap:18px; }
.setup-layout .actions { position:sticky; bottom:0; z-index:2; margin:6px -24px -24px; padding:14px 24px; background:var(--theme-panel); border-top:1px solid var(--theme-line); }
.setup-layout ol { padding-left:24px; margin:0; }
.setup-layout li { padding:0 0 12px 4px; }
.setup-layout #webhookUrl { margin:8px 0; }
.setup-layout h2 .small { display:inline-block; font:400 13px var(--font-ui); letter-spacing:0; margin-left:6px; }
.setup-layout h2:focus { outline:none; }
.setup-layout #stepPanel { scroll-margin-top:88px; }
.setup-layout .readout { font-size:12px; }
#organizationLabel { overflow-wrap:anywhere; font-size:14px; }
/* Ticket identity stays fixed, while the full title belongs with its content. */
.detailIdentity { flex:1; min-width:0; display:flex; flex-direction:column; justify-content:center; }
#detail .ticketTitle { font-size:22px; line-height:1.4; overflow-wrap:anywhere; white-space:normal; margin:0 0 18px; }
#detail .sheetHead { gap:10px; }
#detail .sheetHead .x { min-width:40px; font-size:14px; }
#detail .sheetHead .trail { display:none; }
/* Keep editable values together, followed by context that does not need editing. */
#detail .ticketTitle { margin-bottom:4px; }
#detail .ticketProperties { display:flex; align-items:center; flex-wrap:wrap; gap:8px 10px; }
#detail .ticketPropertyGrid { display:grid; grid-template-columns:1fr 1.25fr .8fr; gap:6px; flex:1 1 380px; min-width:0; margin:0; }
#detail .ticketProperty { min-width:0; }
/* Values identify these familiar controls; retain their labels for assistive technology. */
#detail .ticketProperty dt { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
#detail .ticketProperty dd { margin:0; min-width:0; font-size:14px; line-height:1.5; }
#detail .ticketProperty select { display:block; width:100%; min-width:0; min-height:44px; padding:8px 6px; font-size:14px; text-overflow:ellipsis; }
#detail .ticketFacts { display:flex; align-items:center; gap:8px; flex:1 1 370px; min-width:0; }
#detail .ticketFactValues { display:flex; align-items:center; gap:6px; margin:0; min-width:0; flex:0 1 auto; max-width:55%; }
#detail .ticketPriorityProperty { flex:none; }
#detail .ticketBoardProperty { min-width:0; max-width:120px; }
#detail .ticketPriority,#detail .ticketBoard { padding:3px 7px; border:1px solid var(--line); border-radius:6px; background:var(--panel2); color:var(--muted); font-size:12px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#detail .ticketPriority { text-transform:capitalize; }
#detail .ticketCreated { flex:1; min-width:0; margin:0; color:var(--muted); font-size:11px; line-height:1.45; overflow-wrap:anywhere; }
#detail .ticketCreated time { display:inline-block; }
#detail .ticketContext { display:flex; align-items:center; gap:8px; min-width:0; max-width:100%; }
#detail .ticketContext:has(.ticketEpicProperty) { flex:1 1 100%; }
#detail a.ticketEpicProperty { display:inline-flex; align-items:center; gap:5px; flex:0 1 460px; min-width:0; min-height:32px; padding:4px 7px; text-decoration:none; }
#detail a.ticketEpicProperty:hover { border-color:var(--purple); text-decoration:underline; text-underline-offset:3px; }
#detail .ticketEpicProperty > .uiIcon { flex:none; width:16px; height:16px; }
#detail .ticketEpicTitle { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }
#detail .ticketContext > .rework { flex:none; }
#detail .ticketContext > .claimed { min-width:0; overflow:hidden; text-overflow:ellipsis; }
@media(max-width:600px) {
 #detail .ticketPropertyGrid,#detail .ticketFacts { flex-basis:100%; }
 #detail .ticketProperty select { font-size:16px; }
}
.editorPropertiesTitle { font-weight:600; color:var(--muted); border-top:1px solid var(--line); padding-top:16px; }
#editor textarea { min-height:140px; }
.cardItem .t { font-size:15px; line-height:1.45; }
.col > h2 { font-family:var(--font-heading); font-size:15px; text-transform:none; letter-spacing:.02em; }
.treeBar { flex-wrap:wrap; }
.flowCaveat summary { padding:0; }
.flowCard h3 { margin-bottom:8px; }
.flowData { font-size:13px; }
.flowData table { width:100%; border-collapse:collapse; }
.flowData th,.flowData td { text-align:left; padding:6px; border-bottom:1px solid var(--line); }
@media(hover:hover){ .member:hover { background:var(--theme-shadow); } a:hover { text-decoration-thickness:2px; } }
@media(max-width:959px) {
 .setup-layout { grid-template-columns:minmax(0,1fr); gap:14px; }
 .step-menu { top:0; z-index:5; background:var(--canvas); border:1px solid var(--line); border-radius:8px; }
 .step-menu > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; font-weight:600; list-style:none; }
 .step-menu > summary::-webkit-details-marker { display:none; }
 .step-menu > summary::after { content:'+'; }
 .step-menu[open] > summary::after { content:'−'; }
 .step-menu > summary .small { margin-left:auto; font-weight:400; color:var(--muted); }
 .step-menu nav { padding:4px 8px 8px; }
 .setup-layout nav button { width:100%; }
 .docsLayout { grid-template-columns:minmax(0,1fr); max-width:780px; gap:18px; }
 .docsSidebar { position:static; max-height:none; }
 .docsBrowse { display:inline-flex; }
 .docsArticle { scroll-margin-top:85px; }
}
@media(max-width:700px) {
 h1,.container h1,.docsIntro h1 { font-size:23px; }
 h2,.docsArticle h2 { font-size:18px; }
 body { font-size:16px; }
 input,select,textarea { font-size:16px; }
 .container { padding:18px 14px 40px; gap:16px; }
 .panel { padding:16px; }
 .app-header { padding:10px 14px; gap:6px; }
 .app-header .brand { font-size:20px; }
 .hero { gap:10px; }
 .hero .row { gap:8px; }
 .hero .row .button,.hero .row button { min-height:44px; padding:8px 12px; font-size:15px; }
 .setup-entry { gap:8px; padding:10px; }
 .setup-entry > div:first-child { display:none; }
 .setup-entry .row { width:100%; }
 .setup-entry .row > * { min-height:44px; flex:1; }
 .organization-page #tabs { top:0; }
 .member .grow { flex-basis:calc(100% - 48px); }
 .member .row { gap:8px; }
 .token-actions { grid-template-columns:1fr 1fr; }
 .token-actions button { min-height:44px; }
 .dialog > header { padding:10px 14px; }
 #dialogBody { padding:16px; }
 #dialogFooter { padding:10px 14px max(10px,env(safe-area-inset-bottom)); }
 .setup-container { padding-top:16px; gap:8px; }
 .setup-container .setup-heading p { font-size:14px; }
 .setup-layout { margin:6px 0; }
 .setup-layout .card { padding:16px; }
 .setup-layout .actions { margin:4px -16px -16px; padding:10px 12px max(10px,env(safe-area-inset-bottom)); gap:6px; }
 .setup-layout .actions button { padding:8px 10px; font-size:15px; }
 .setup-layout .actions .primary { flex:2; }
 .setup-layout .actions > * { flex:1; }
 .setup-layout form { gap:16px; }
 .setup-layout .step-menu summary { font-size:14px; }
 .setup-layout .step-menu summary .small { font-size:12px; }
 #organizationLabel { display:none; }
 #saveExit { font-size:14px; }
 .setup-container #saveStatus { font-size:12px; }
 #detail .ticketTitle { font-size:20px; margin-bottom:14px; }
 #detail .sheetHead .x { min-width:44px; min-height:44px; }
 #detail .sheetHead { padding:8px 12px; gap:8px; }
 #detail .sheetHead .copy { font-size:0; }
 .docsArticle { padding:16px; }
 .docsIntro { margin-bottom:18px; }
 .docsLayout { padding:16px 14px 80px; }
 .tourDialog { padding:16px; font-size:15px; }
}
@media(max-height:500px){ .setup-layout .actions { position:static; } .step-menu { position:static; } }
@media(prefers-reduced-motion:reduce){ * { scroll-behavior:auto!important; transition:none!important; } }
@media(min-width:701px) and (max-width:1100px){
 header#top { gap:8px; padding:8px 12px; }
 #top .brandName, #top .organizationLink, #top > #findBtn, #top > #refreshBtn, .me > :not(#bellBtn) { display:none; }
 #top .boardHelp, #top .boardTour { display:none; }
 #fProject { max-width:210px; }
 #top .views { margin-left:auto; }
 #top .views button { font-size:0; padding:8px; min-width:38px; min-height:38px; }
 #top .views button svg { width:18px; height:18px; }
 #mobileMenuBtn { display:inline-flex!important; min-width:38px; align-items:center; justify-content:center; }
 .filters { display:flex; width:100%; gap:8px; }
 #q { flex:1; max-width:none; width:auto; }
 #filterToggle { display:inline-flex!important; }
 .filterPanel { position:fixed; z-index:42; inset:80px 16px auto auto; width:min(460px,calc(100vw - 32px)); max-height:calc(100dvh - 100px); overflow:auto; display:none; background:var(--panel); border:1px solid var(--line); padding:16px; border-radius:12px; }
 .filterPanel.open { display:flex; flex-direction:column; gap:12px; }
 .filterPanel select { min-height:44px; max-width:none; }
 .filterPanel #boardSort { max-width:none; }
 .filterSheetHead,.filterSheetFoot { display:flex!important; gap:8px; justify-content:space-between; }
 .filterScrim.open { display:block!important; position:fixed; inset:0; z-index:41; background:var(--theme-scrim); }
}
.treeDependencies { display:flex; flex-direction:row; align-items:center; gap:8px; min-height:44px; font-size:13px; color:var(--muted); }
.treeDependencies input { width:18px; height:18px; min-height:18px; }
.tourDialog { z-index:100; }
@media(min-width:701px){ .tourDialog { inset:auto 20px 20px auto; } }
@media(max-width:700px){ .tourDialog { max-height:45dvh; } }
.personManage,.personSummary { display:none; }
.personManagement .personControls { display:grid; gap:14px; }
.personManagement .personControls .danger { margin-top:12px; padding-top:16px; border-color:var(--theme-badTint); }
.personManagement .personControls select { width:100%; }
.setupPage .app-header { position:sticky; top:0; z-index:10; }
@media(max-width:959px){ .setupPage .step-menu { top:64px; } }
@media(max-width:700px){
 .personManage,.personSummary { display:block; }
 .member > .personControls { display:none; }
 .member:has(.personManage) .grow { flex:1; }
 .personManage { min-height:44px; padding:8px 12px; }
 .member:has(.personManage) { align-items:center; }
}
@media(max-height:500px){ .setupPage .app-header { position:static; } .setupPage .step-menu { position:static; } }
@media(max-width:959px){ .docsBrowse { position:fixed; bottom:16px; right:16px; z-index:8; min-height:44px; padding:8px 14px; background:var(--theme-panel2); border:1px solid var(--theme-edge); border-radius:8px; color:var(--theme-fg); text-decoration:none; } }
.organization-page .hero > div:first-child { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.organization-page .hero h1 { flex:1; }
.organization-page .hero .contextHelp { margin-left:auto; }
@media(max-width:700px){ .organization-page .hero > div:first-child { width:100%; } }
.manualCopy { font-size:14px; min-height:44px; padding:7px 12px; }
.docsArticle pre { white-space:pre-wrap; overflow-wrap:anywhere; }
@media(max-width:600px){ .token-actions .danger { grid-column:auto; justify-self:stretch; } }
/* The title slot stays reserved to prevent a jump while scrolling. */
.retainedHeading { visibility:hidden; display:block; width:100%; min-width:0; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; background:transparent; border:0; border-radius:4px; color:var(--fg,var(--theme-fg)); font:500 13px/20px var(--font-ui); letter-spacing:0; padding:0; }
.retainedHeading.is-visible { visibility:visible; }
.retainedHeading:hover { color:var(--theme-fg); background:transparent; }
#detail .detailIdentity { height:44px; }
#detail .detailIdentity > .k { align-self:flex-start; line-height:22px; font-size:15px; font-weight:700; color:var(--accent); }
#detail .retainedHeading { display:none; min-height:20px; }
#detail .retainedHeading.is-visible { display:block; }
#detail .sheetHead > .type { display:inline-flex; flex:none; }
#detail .sheetHead > .type .uiIcon { width:24px; height:24px; }
#detail .sheetHead { padding-block:8px; }
.cardItem .k { font-size:14px; font-weight:700; color:var(--accent); }
.cardItem .type .uiIcon { width:20px; height:20px; }
#detail .sheetHead > .x { flex:none; }
#compactOrganizationTitle { flex:0 0 100%; min-height:28px; padding:2px 10px; font-size:13px; }
.organization-page #tabs { flex-wrap:wrap; }
@media(max-width:700px){
 #detail .sheetHead { gap:4px; }
 #detail .sheetHead .copy { min-width:36px; }
 #detail .detailIdentity { min-height:44px; }
}
#compactOrganizationTitle { grid-column:1 / -1; }
/* Zain + Nunito typography and shared surface aliases. */
:root { color-scheme:dark; --brand-olive:var(--theme-panel2); --brand-gold:var(--theme-primary); --brand-cream:var(--theme-fg); --brand-surface:var(--theme-fg); --bg:var(--theme-bg); --canvas:var(--theme-bg); --panel:var(--theme-panel); --paper:var(--theme-panel); --panel2:var(--theme-panel); --line:var(--theme-line); --surface-recessed:var(--theme-bg); --surface-brand:var(--theme-panel); --surface-brand-hover:var(--theme-panel2); --surface-header:var(--theme-bg); --surface-selected:var(--theme-panel2); --border-selected:var(--theme-edge); --surface-overlay:var(--theme-bg); --fg:var(--theme-fg); --ink:var(--theme-fg); --muted:var(--theme-muted); --accent:var(--theme-primary); --accent2:var(--theme-primary); --soft:var(--theme-panel2); --scroll-thumb:var(--theme-edge); --scroll-thumb-hover:var(--theme-muted); }
h1,h2,h3,h4,h5,h6,.brand { font-weight:700; font-optical-sizing:auto; }
h1,.container h1,.docsIntro h1,.auth-story h1 { font-size:30px; letter-spacing:-.025em; }
h2,.docsArticle h2,.tourDialog h2 { font-size:23px; }
h3 { font-size:19px; }
.col > h2 { font-family:var(--font-heading); font-size:15px; font-weight:500; }
button.primary,.button.primary,button.primary:hover,.button.primary:hover { color:var(--theme-bg); }
input[type=checkbox],input[type=radio] { accent-color:var(--brand-gold); }
::selection { color:var(--brand-cream); background:var(--theme-edge); }
@media(max-width:700px){h1,.container h1,.docsIntro h1 { font-size:27px; }}
/* Organization context belongs to the shell; each section owns its actions. */
.app-header { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px 20px; }
.header-workspace { gap:14px; }
.app-header .adminMode { width:132px; min-height:44px; padding:8px 26px 8px 12px; font-size:13px; background:transparent; border-color:var(--line); color:var(--ink); }
.organization-context { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:16px; border-top:1px solid var(--line); padding-top:8px; margin-top:2px; }
.organization-context #pageTitle { font-size:21px; line-height:1.3; min-width:0; overflow-wrap:anywhere; }
.organization-context .contextHelp { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:8px 12px; font-size:13px; flex:none; border-radius:8px; text-decoration:none; }
.organization-context .contextHelp:hover { background:var(--panel2); }
.organization-page .container { gap:20px; padding-top:0; }
.organization-page .hero { order:2; display:flex; gap:20px; align-items:center; }
.organization-page .hero > div:first-child { display:block; flex:1; min-width:0; }
#sectionTitle { font-size:27px; line-height:1.25; }
.organization-page #pageHint { font-size:14px; line-height:1.6; max-width:560px; margin-top:6px; }
#pageActions { gap:8px; flex:none; }
#pageActions:empty { display:none; }
.organization-page #tabs { order:1; top:28px; margin:0; padding:8px 0; gap:4px; overflow:visible; }
.organization-page #tabs button[data-tab] { flex:1; border-radius:0; border-bottom:2px solid transparent; }
.organization-page #tabs button[data-tab][aria-pressed=true] { background:transparent; color:var(--ink); border-bottom-color:var(--accent); }
#compactOrganizationTitle { position:absolute; bottom:100%; left:0; width:100%; height:28px; min-height:28px; border-radius:0; background:var(--canvas); padding:2px 0; }
.organization-page #setupEntry { border:0; border-top:1px solid var(--line); background:transparent; border-radius:0; padding:16px 0 0; gap:8px 16px; }
.organization-page #setupEntry > div:first-child { display:block; }
.organization-page #setupEntry p { display:block; font-size:12px; }
.organization-page #setupEntry .row { width:auto; flex-wrap:wrap; }
.organization-page #setupEntry .row > * { flex:none; min-height:44px; padding:8px 10px; font-size:13px; background:transparent; border:1px solid var(--line); color:var(--ink); }
.project-card .row:last-child { gap:8px; }
.project-card .row:last-child .primary { background:transparent; color:var(--accent); border-color:var(--line); }
.project-card .row:last-child .primary:hover { background:var(--panel2); }
/* Shared shell surfaces follow the personal theme. */
header#top,.app-header { background:var(--surface-header); border-color:var(--line); }
.treeRow,.treeNode { border-color:var(--line); }
.auth-layout { min-height:100svh; margin:0 auto; padding-block:48px; column-gap:64px; row-gap:20px; align-content:center; }
.auth-story { grid-column:1; grid-row:1 / 3; }
.auth-card { grid-column:2; grid-row:1; }
.auth-support { grid-column:2; text-align:center; font-size:13px; }
.auth-support a { display:inline-flex; min-height:44px; align-items:center; }
.auth-footer { display:grid; gap:10px; font-size:13px; }
.auth-footer #recoveryHelp { display:inline-flex; align-items:center; min-height:44px; }
@media(max-width:700px){
 .app-header { grid-template-columns:minmax(0,1fr) auto; gap:6px 8px; padding:10px 14px; }
 .app-header .adminMode { width:132px; font-size:13px; }
 .header-workspace { gap:12px; }
 .organization-context { padding-top:6px; margin-top:2px; }
 .organization-context #pageTitle { font-size:20px; }
 .organization-page .container { gap:18px; }
 .organization-page .hero { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; }
 #sectionTitle { font-size:25px; }
 .organization-page #pageHint { font-size:13px; }
 #pageActions { display:flex; flex-wrap:wrap; width:100%; gap:8px; }
 #pageActions > * { flex:1 1 125px; min-height:44px; }

 .organization-page #setupEntry { display:grid; gap:10px; }
 .organization-page #setupEntry .row { gap:8px; }
 .organization-page #setupEntry .row > * { flex:1 1 120px; }
 .auth-layout { width:100%; max-width:460px; padding:24px 16px; gap:20px; justify-content:center; }
 .auth-story { align-items:center; justify-items:center; }
 .auth-story > :not(.brand) { display:none; }
 .auth-card { padding:24px 20px; gap:20px; box-shadow:none; }
 .auth-card header { gap:6px; }
 .auth-card header h2 { font-size:26px; }
 .auth-card header p { font-size:14px; }
 .auth-card form { gap:18px; }
 .auth-card label { font-size:14px; }
 .auth-support { font-size:13px; }
}
@media(max-width:360px){
 .workspace-nav a { padding-inline:8px; font-size:12px; }
 .header-account .sign-out { font-size:12px; }
 .project-card .row:last-child { display:grid; grid-template-columns:1fr 1fr; }
 .project-card .row:last-child .primary { grid-column:1 / -1; }
}
@media(max-width:700px){
 .organization-page #setupEntry { grid-template-columns:minmax(0,1fr); justify-content:stretch; }
 .project-card .row:last-child { display:grid; grid-template-columns:minmax(0,1.35fr) repeat(2,minmax(0,1fr)); }
 .project-card .row:last-child > * { padding:8px; min-height:44px; font-size:13px; }
}
@media(max-width:360px){
 .project-card .row:last-child { grid-template-columns:1fr 1fr; }
 .project-card .row:last-child .primary { grid-column:1 / -1; }
}
@media(max-width:480px){
 .member:has(.personManage) { display:grid; grid-template-columns:32px minmax(0,1fr); gap:8px 12px; align-items:start; }
 .member:has(.personManage) .avatar { margin-top:3px; }
 .member:has(.personManage) .grow { grid-column:2; }
 .member .personManage { grid-column:2; justify-self:start; }
}
/* Guide stays with the product; administration and sign-out stay together. */
.header-workspace > .contextHelp { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:8px 12px; border:1px solid var(--line); border-radius:8px; font-size:13px; text-decoration:none; }
.organization-context > a { min-height:44px; display:inline-flex; align-items:center; color:var(--muted); text-decoration:none; font-size:13px; }
.organization-context #currentWorkspaceLink { font:400 21px/1.3 var(--font-heading); color:var(--ink); min-width:0; overflow-wrap:anywhere; }
.organization-context #allWorkspaces { margin-left:auto; flex:none; padding:8px 0 8px 12px; }
.header-account { gap:10px; }
@media(max-width:700px){
 .app-header { padding-inline:10px; column-gap:4px; }
 .header-account { gap:3px; padding-left:6px; }
 .app-header .header-account .adminMode { width:104px; padding:8px 18px 8px 7px; font-size:12px; }
 .header-account .sign-out { width:44px; min-height:44px; padding:8px; }
 .header-account .sign-out span { display:none; }
 .app-header .workspace-nav { gap:0; }
 .workspace-nav a { padding:9px 4px; font-size:12px; }
 .organization-context #allWorkspaces { font-size:12px; max-width:145px; text-align:right; }
 .organization-context #pageTitle,.organization-context #currentWorkspaceLink { font-size:19px; }
}
.integration-guide { border:1px solid var(--line); border-radius:10px; min-width:0; }
.integration-guide > summary { display:flex; align-items:center; gap:8px; padding:12px 14px; flex-wrap:wrap; }
.integration-guide > summary::before { content:'›'; font-size:20px; line-height:1; }
.integration-guide[open] > summary::before { transform:rotate(90deg); }
.integration-guide > summary .badge { margin-left:auto; font-size:11px; }
.integration-content { padding:0 14px 16px; gap:20px; }
.integration-step { display:grid; gap:12px; padding-top:16px; border-top:1px solid var(--line); min-width:0; }
.integration-step h3 { display:flex; align-items:center; flex-wrap:wrap; gap:8px; font:600 17px/1.5 var(--font-heading); }
.integration-step h3 > span { display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%; background:var(--soft); font-size:12px; }
.integration-step h3 small { font:400 12px var(--font-ui); color:var(--muted); }
.integration-step input[readonly] { font-size:12px; }
.integration-step .contextHelp { overflow-wrap:anywhere; min-height:44px; display:flex; align-items:center; }
.webhook-checklist { display:grid; grid-template-columns:100px minmax(0,1fr); gap:8px 12px; margin:0; font-size:13px; }
.webhook-checklist dt { color:var(--muted); }
.webhook-checklist dd { margin:0; overflow-wrap:anywhere; }
@media(max-width:480px){ .webhook-checklist { grid-template-columns:minmax(0,1fr); gap:3px; } .webhook-checklist dd { margin-bottom:8px; } .integration-step .row > button { flex:1; padding-inline:8px; font-size:13px; } }
@media(max-width:700px){ #pageActions { align-items:stretch; } }
@media(max-width:360px){ .app-header .workspace-nav a { padding-inline:2px; } }
.github-backfill { border-top:1px solid var(--line); padding-top:14px; }
.github-backfill h4 { margin:0; font-size:14px; font-weight:600; }

.device-notifications { grid-column:1 / -1; scroll-margin-top:24px; }
.device-notifications .actions { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.device-notifications [data-push-status] { min-height:24px; }
.device-notification-link { padding:8px 12px; border-top:1px solid var(--line); background:var(--surface-overlay); }
.device-notification-link a { display:flex; align-items:center; min-height:44px; font-size:12px; }
@media(max-width:600px) { .device-notifications .actions > button { flex:1 1 180px; min-height:44px; } }

/* Shared import dialog in project settings and setup. */
.import-body { min-height:0; overflow:auto; overscroll-behavior:contain; padding:20px; }
.import-body form { gap:16px; }
.import-error:not(:empty) { flex:none; margin:12px 20px 0; max-height:25dvh; overflow:auto; }
.import-footer { flex:none; border-top:1px solid var(--line); background:var(--paper); padding:12px 20px max(12px,env(safe-area-inset-bottom)); }
.import-footer:empty { display:none; }
.import-footer .actions { margin:0; }
@media(max-width:600px) { .import-body { padding:16px; } .import-footer { padding:10px 14px max(10px,env(safe-area-inset-bottom)); } }

/* Mine keeps native checkbox behavior with a switch presentation. */
.mineSwitch { position:relative; display:inline-flex; align-items:center; gap:8px; min-height:44px; cursor:pointer; user-select:none; }
#fMine { position:absolute; left:0; top:50%; width:40px; height:24px; margin:0; padding:0; transform:translateY(-50%); opacity:0; cursor:pointer; }
.mineSwitch .switchTrack { position:relative; flex:none; width:40px; height:24px; border:1px solid var(--scroll-thumb); border-radius:999px; background:var(--panel2); transition:background-color 160ms ease,border-color 160ms ease; pointer-events:none; }
.mineSwitch .switchTrack::before { content:""; position:absolute; left:2px; top:2px; width:18px; height:18px; border-radius:50%; background:var(--muted); transition:transform 160ms ease,background-color 160ms ease; }
#fMine:checked + .switchTrack { background:var(--brand-gold); border-color:var(--brand-gold); }
#fMine:checked + .switchTrack::before { transform:translateX(16px); background:var(--canvas); }
#fMine:checked ~ span:last-child { color:var(--fg); }
#fMine:focus-visible + .switchTrack { outline:2px solid var(--brand-cream); outline-offset:3px; }
@media(prefers-reduced-motion:reduce) { .mineSwitch .switchTrack,.mineSwitch .switchTrack::before { transition:none; } }
@media(forced-colors:active) {
 .mineSwitch .switchTrack { forced-color-adjust:none; background:Canvas; border-color:ButtonText; }
 .mineSwitch .switchTrack::before { background:ButtonText; }
 #fMine:checked + .switchTrack { background:Highlight; border-color:Highlight; }
 #fMine:checked + .switchTrack::before { background:HighlightText; }
 #fMine:focus-visible + .switchTrack { outline-color:Highlight; }
}

/* Organization navigation shares the header's existing workspace identity. */
#top #organizationLink { display: flex; cursor: pointer; min-height: 44px; }
#organizationLink[aria-expanded=true]::after { transform: rotate(45deg); }
.organizationMenu {
  position: fixed; inset: auto; margin: 0; padding: 6px;
  width: min(304px, calc(100vw - 24px)); max-height: calc(100dvh - 24px);
  overflow: auto; border: 1px solid var(--line); border-radius: 13px;
  background: var(--panel); color: var(--fg);
  box-shadow: 0 12px 36px var(--theme-shadow), 0 2px 8px var(--theme-shadow);
  font: 400 13px/1.5 var(--font-ui);
}
.organizationMenu > p { margin: 0; padding: 8px 10px; color: var(--muted); font-size: 11px; }
.organizationMenu a {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 44px; padding: 10px; border-radius: 8px; color: var(--fg); text-decoration: none;
}
.organizationMenu a span { min-width: 0; overflow-wrap: anywhere; }
.organizationMenu a svg { flex: none; color: var(--accent); }
.organizationMenu a:hover, .organizationMenu a[aria-current=true] { background: var(--theme-hover); }
.organizationMenu a:focus-visible { outline-offset: -2px; background: var(--theme-hover); }
.organizationMenuFooter { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line); }
@media (max-width: 700px), (max-height: 500px) and (pointer: coarse) {
  #top .workspaceIdentity { grid-column: 1 / -1; min-width: 0; }
  #top #organizationLink { display: flex; max-width: calc(100% - 52px); }
  header#top { grid-template-columns: minmax(0, 1fr) auto auto auto; }
  header#top:has(#fProject.hidden) .workspaceIdentity { grid-column: auto; }
}