/* 1.3.3 app mark beside the name (divider moves onto the icon). */
.urg-header .app-icon{width:28px;height:28px;flex:0 0 auto;border-radius:6px;display:block;border-left:1px solid rgba(255,255,255,.35);padding-left:16px;box-sizing:content-box}
.urg-header .app-name{border-left:0;padding-left:10px}
@media (max-width:640px){.urg-header .app-icon{width:24px;height:24px;padding-left:12px}.urg-header .app-name{font-size:16px;padding-left:8px}}
form.inline{display:inline}
.layout{display:grid;grid-template-columns:240px 1fr;gap:20px}
@media (max-width:820px){.layout{grid-template-columns:1fr}}
.filters label{margin-top:10px}
.composer textarea{min-height:70px;resize:vertical}
.post{background:#fff;border:1px solid var(--urg-line);border-radius:10px;padding:14px 16px;margin-bottom:12px}
.post.pinned{border-color:var(--urg-accent);box-shadow:0 0 0 1px var(--urg-accent) inset}
.post .meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:13px;color:var(--urg-muted)}
.post .meta strong{color:var(--urg-ink)}
.post .body{margin:8px 0;white-space:normal;word-wrap:break-word}
.chip{display:inline-block;background:#eaf2f9;color:#245a86;border-radius:999px;padding:1px 9px;font-size:12px;text-decoration:none}
.chip.urg{background:#083346;color:#fff}
.tag{color:#2f6fa8;font-size:13px;text-decoration:none;margin-right:6px}
.icon{font-size:18px;line-height:1}
.auto{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--urg-line);border-radius:8px;padding:9px 14px;margin-bottom:8px;font-size:14px}
.auto.pinned{border-color:var(--urg-accent)}
.auto .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auto .when{color:var(--urg-muted);font-size:12px;white-space:nowrap}
.auto .res{color:var(--urg-ok);font-size:12px}
.photos{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.photos img{height:120px;border-radius:6px;border:1px solid var(--urg-line);object-fit:cover}
.photos.big img{height:auto;max-width:100%;max-height:640px}
.rx{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px}
.rx button{background:#f4f7fa;border:1px solid var(--urg-line);border-radius:999px;padding:2px 9px;font:inherit;font-size:14px;cursor:pointer}
.rx button.mine{background:#e4f1fb;border-color:var(--urg-accent)}
.rx a{font-size:13px;margin-left:auto}
.section-h{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--urg-muted);margin:6px 0 8px}
.pill.open{background:#fdecea;color:var(--urg-err)}.pill.resolved{background:#dff3e6;color:var(--urg-ok)}
.comment{border-top:1px solid var(--urg-line);padding:10px 0}
.pinbox{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}.pinbox>*{flex:0 0 auto;width:auto}
.mt{margin-top:12px}
details summary{cursor:pointer;color:#2f6fa8;font-size:13px}
label.inline{display:inline-flex;gap:4px;align-items:center;margin-right:12px;color:var(--urg-ink)} label.inline input{width:auto}
/* ---------- 1.2.0 timeline layout ---------- */
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:8px;z-index:20;background:#fff;padding:8px 12px;border-radius:6px;border:2px solid var(--urg-accent)}
.feed-page main{max-width:1280px}
a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,.c-photo:focus-within{outline:3px solid var(--urg-accent);outline-offset:2px}
.tl-layout{grid-template-columns:250px minmax(0,1fr);align-items:start;transition:grid-template-columns .15s}
.filter-col{position:sticky;top:16px}
.filter-toggle{display:flex;align-items:center;gap:8px;width:100%;background:var(--urg-navy);color:#fff;border:0;border-radius:10px 10px 0 0;padding:10px 14px;font:inherit;font-weight:600;cursor:pointer}
.filter-toggle .ft-chev{margin-left:auto}.filter-toggle .ft-chev::before{content:"‹";font-size:20px;line-height:1}
.ft-count{background:var(--urg-accent);border-radius:999px;font-size:12px;padding:0 7px;min-width:20px;text-align:center}
.filter-col .filters{border-radius:0 0 10px 10px;border-top:0}
.filters-collapsed .tl-layout{grid-template-columns:48px minmax(0,1fr)}
.filters-collapsed #filter-panel{display:none}
.filters-collapsed .filter-toggle{flex-direction:column;border-radius:10px;padding:12px 0;gap:10px}
.filters-collapsed .filter-toggle .ft-label{writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.06em}
.filters-collapsed .filter-toggle .ft-chev{margin:0}.filters-collapsed .filter-toggle .ft-chev::before{content:"›"}
/* composer: wide input, three controls under it (photo · type & tags · post) */
.tl-main{min-width:0}
.composer{max-width:760px;margin:0 auto 22px;padding:16px 18px;box-shadow:0 2px 8px rgba(8,51,70,.06)}
.composer textarea{min-height:64px;font-size:16px}
.c-controls{display:flex;gap:10px;align-items:flex-start;margin-top:10px;flex-wrap:wrap}
.c-btn{display:inline-flex;align-items:center;gap:4px;margin:0;padding:7px 14px;border:1px solid var(--urg-line);border-radius:999px;background:#f4f7fa;color:var(--urg-navy);font-size:14px;cursor:pointer;list-style:none}
.c-btn::-webkit-details-marker{display:none}.c-btn:hover{background:#e8f0f7}
.c-opts[aria-expanded="true"]{background:#e4f1fb;border-color:var(--urg-accent)}
/* 1.2.1: each label+field is one .field cell; panel spans the composer width from its left edge */
.c-pop{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;margin:4px 0 0;padding:12px 0 2px;border-top:1px solid var(--urg-line)}
.c-pop .field{display:flex;flex-direction:column;min-width:0}
.c-pop .field label{margin:0 0 4px}
.c-pop .f-tags{grid-column:1/-1}
.c-pop:not(:has(.f-building)) .f-type{grid-column:1/-1}
.c-pop .field[hidden],.c-pop[hidden]{display:none}
.c-post{margin-left:auto;padding:8px 22px;border-radius:999px;font-weight:600}
.c-help{margin:6px 0 0;font-size:12px}
/* pinned stays above the line */
.pinned-zone{max-width:760px;margin:0 auto 18px}
/* the timeline: center line = time, date pills on it, cards alternate and overlap the line a little */
.tl{list-style:none;margin:0;padding:6px 0 10px;position:relative}
.tl::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:3px;margin-left:-1.5px;background:linear-gradient(var(--urg-accent),#b9cfe3);border-radius:2px}
.tl>li{position:relative}
.tl-day{display:flex;justify-content:center;margin:18px 0 12px;z-index:2}
.tl-day:first-child{margin-top:0}
.date-pill{margin:0;background:var(--urg-navy);color:#fff;font-size:13px;font-weight:600;letter-spacing:.04em;padding:5px 16px;border-radius:999px;border:3px solid var(--urg-bg);box-shadow:0 0 0 1px var(--urg-accent)}
.tl-item{width:calc(50% + 28px);margin-bottom:10px;z-index:1}
.tl-item.left{margin-right:auto}.tl-item.right{margin-left:auto}
.tl-item>.post,.tl-item>.auto{margin:0;box-shadow:0 1px 4px rgba(8,51,70,.08)}
.tl-item.left>.post,.tl-item.left>.auto{border-right:3px solid var(--urg-accent)}
.tl-item.right>.post,.tl-item.right>.auto{border-left:3px solid var(--urg-accent)}
.tl-item.is-auto{width:calc(46% + 48px)}
.tl-item.is-auto>.auto{padding:7px 12px;font-size:13px;background:#fbfdfe}
.tl-item.is-auto.left{margin-left:auto;margin-right:calc(50% - 48px)}.tl-item.is-auto.right{margin-left:calc(50% - 48px);margin-right:auto}
/* 1.2.3: compact auto rows attach to the line exactly like full cards (no dot) */
.tl-empty{position:relative;z-index:1;max-width:420px;margin:0 auto}
.tl-more{text-align:center;margin-top:14px}.tl-more .btn{border-radius:999px;background:#fff}
@media (max-width:820px){
  .tl-layout,.filters-collapsed .tl-layout{grid-template-columns:1fr}
  .filter-col{position:static}
  .filters-collapsed .filter-toggle{flex-direction:row;padding:10px 14px}
  .filters-collapsed .filter-toggle .ft-label{writing-mode:horizontal-tb;transform:none}
  .filters-collapsed .filter-toggle .ft-chev{margin-left:auto}
  .filter-toggle .ft-chev::before{content:"⌃"}.filters-collapsed .filter-toggle .ft-chev::before{content:"⌄"}
  .tl::before{left:14px}
  .tl-day{justify-content:flex-start;padding-left:0}
  .date-pill{font-size:12px;padding:4px 12px}
  .tl-item,.tl-item.is-auto{width:auto;margin-left:13px!important;margin-right:0!important}
  .tl-item.left>.post,.tl-item.left>.auto{border-right:1px solid var(--urg-line);border-left:3px solid var(--urg-accent)}
  .auto{flex-wrap:wrap}.auto .t{white-space:normal}
  .c-post{margin-left:0}
  .c-pop{grid-template-columns:1fr}
}
.changelog h2{font-size:20px;margin-top:22px}.changelog h2:first-child{margin-top:0}.changelog li{margin:3px 0}.changelog code{background:#eef2f5;padding:0 4px;border-radius:4px;font-size:13px}
/* 1.2.3: whole card opens the post in a modal; external link sits far right */
.tl-item>.post[data-post],.tl-item>.auto[data-post],.pinned-zone [data-post]{cursor:pointer}
.tl-item>.post[data-post]:hover,.tl-item>.auto[data-post]:hover{box-shadow:0 2px 10px rgba(8,51,70,.16)}
[data-post]:focus-visible{outline:3px solid var(--urg-accent);outline-offset:2px}
.auto .ext{margin-left:auto;white-space:nowrap;font-weight:600;font-size:12px;padding:2px 9px;border:1px solid var(--urg-line);border-radius:999px;background:#fff;text-decoration:none}
.auto .ext:hover{border-color:var(--urg-accent)}
.pm-backdrop{position:fixed;inset:0;background:rgba(8,30,45,.55);z-index:50;display:flex;align-items:flex-start;justify-content:center;padding:5vh 12px;overflow-y:auto}
.pm-backdrop[hidden]{display:none}
.pm-dialog{background:var(--urg-bg,#f5f8fa);border-radius:12px;max-width:760px;width:100%;padding:44px 18px 18px;position:relative;box-shadow:0 10px 40px rgba(0,0,0,.3)}
.pm-close{position:absolute;top:8px;right:10px;font-size:22px;line-height:1;background:none;border:0;cursor:pointer;padding:4px 10px;border-radius:6px}
.pm-close:focus-visible{outline:3px solid var(--urg-accent)}
.pm-dialog [data-post]{cursor:default}
body.pm-open{overflow:hidden}
@media (max-width:820px){.auto .t{flex:1 1 calc(100% - 40px)}.auto .ext{margin-left:auto}.pm-backdrop{padding:0}.pm-dialog{border-radius:0;min-height:100%;padding:48px 12px 12px}}

/* 1.2.4: one straight, continuous center line drawn over the cards (cards no longer draw their own offset accent
   edge, which made the line kink where sides switch). Inner padding keeps card content clear of the line. */
.tl::before{z-index:3;pointer-events:none}
.tl>li.tl-day{z-index:4}
.tl-item{margin-bottom:0}
.tl-item.left>.post,.tl-item.left>.auto{border-right:1px solid var(--urg-line);padding-right:44px}
.tl-item.right>.post,.tl-item.right>.auto{border-left:1px solid var(--urg-line);padding-left:44px}
.tl-item.is-auto.left>.auto{padding-right:62px}.tl-item.is-auto.right>.auto{padding-left:62px}
/* time-proportional spacing: server sets g0…g120 (px above the item) */
.g0{margin-top:0px}.g10{margin-top:10px}.g20{margin-top:20px}.g30{margin-top:30px}.g40{margin-top:40px}.g50{margin-top:50px}.g60{margin-top:60px}.g70{margin-top:70px}.g80{margin-top:80px}.g90{margin-top:90px}.g100{margin-top:100px}.g110{margin-top:110px}.g120{margin-top:120px}
.tl-gap{display:flex;align-items:center;justify-content:center;z-index:4;height:0;margin-bottom:0}
.tl-gap.g0{height:0px;margin-top:0}.tl-gap.g10{height:10px;margin-top:0}.tl-gap.g20{height:20px;margin-top:0}.tl-gap.g30{height:30px;margin-top:0}.tl-gap.g40{height:40px;margin-top:0}.tl-gap.g50{height:50px;margin-top:0}.tl-gap.g60{height:60px;margin-top:0}.tl-gap.g70{height:70px;margin-top:0}.tl-gap.g80{height:80px;margin-top:0}.tl-gap.g90{height:90px;margin-top:0}.tl-gap.g100{height:100px;margin-top:0}.tl-gap.g110{height:110px;margin-top:0}.tl-gap.g120{height:120px;margin-top:0}
.gap-mark{background:var(--urg-bg);color:var(--urg-muted);font-size:11px;font-weight:600;letter-spacing:.03em;padding:1px 8px;border:1px solid #b9cfe3;border-radius:999px;white-space:nowrap}
@media (max-width:820px){
  .tl::before{left:14px;margin-left:0}
  .tl-item,.tl-item.is-auto{margin-left:14px!important}
  .tl-item.left>.post,.tl-item.left>.auto,.tl-item.right>.post,.tl-item.right>.auto{border-right:1px solid var(--urg-line);border-left:3px solid var(--urg-accent);padding-left:14px;padding-right:12px}
  .tl-item.is-auto.left>.auto,.tl-item.is-auto.right>.auto{padding-left:12px;padding-right:12px}
  .tl-gap{justify-content:flex-start}.gap-mark{margin-left:2px}
}

/* 1.2.5: center line sits BEHIND the cards. .tl is its own stacking context (isolation), the line is z-index 0,
   cards are z-index 1 with opaque backgrounds (they cover the line where they overlap), date pills and gap
   markers z-index 2 on top of the line. Modal (z 50, fixed, outside .tl) is unaffected. */
.tl{isolation:isolate}
.tl::before{z-index:0;pointer-events:none}
.tl>li.tl-item{z-index:1}
.tl>li.tl-day,.tl>li.tl-gap{z-index:2}
.tl-item>.post,.tl-item>.auto{position:relative;background:#fff}
.tl-item.is-auto>.auto{background:#fbfdfe}
.post.pinned{background:#fff}
.gap-mark{position:relative;background:var(--urg-bg,#f5f8fa)}

/* 1.3.0 header: greeting + name, then the buttons to its right; phones get a hamburger and no greeting. */
.urg-header .hdr-right{margin-left:auto;display:flex;align-items:center;gap:14px;position:relative}
.urg-header .greet{color:#cfe0ee;font-size:14px;white-space:nowrap}
.urg-header .hdr-right nav{margin-left:0}
.urg-header .hamburger{display:none;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:6px;font-size:20px;line-height:1;padding:6px 10px;cursor:pointer}
@media (max-width:640px){
  .urg-header{flex-wrap:nowrap}
  .urg-header .greet{display:none}
  .urg-header .app-name{font-size:16px;padding-left:12px}
  .js-nav .urg-header .hamburger{display:block}
  .js-nav .urg-header .hdr-right nav{display:none;position:absolute;right:0;top:calc(100% + 8px);z-index:60;flex-direction:column;align-items:stretch;gap:4px;width:200px;background:var(--urg-navy);padding:8px;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.3)}
  .js-nav.nav-open .urg-header .hdr-right nav{display:flex}
  .urg-header .hdr-right nav a{border-color:transparent;padding:10px 12px}
}

/* 1.3.0 reactions: one 👍 + ▾ for the rest (like Basecamp boosts); only reactions someone used show as chips. */
.rx-quick{display:inline-flex;align-items:stretch;position:relative}
.rx .rx-quick .rx-main{border-radius:999px 0 0 999px;border-right:0}
.rx-more{display:inline-block;position:relative}
.rx-caret{list-style:none;cursor:pointer;background:#f4f7fa;border:1px solid var(--urg-line);border-radius:0 999px 999px 0;padding:2px 8px;font-size:12px;color:var(--urg-muted);height:100%;display:flex;align-items:center}
.rx-caret::-webkit-details-marker{display:none}
.rx-more[open] .rx-caret{background:#e4f1fb;border-color:var(--urg-accent)}
.rx-menu{position:absolute;left:0;top:calc(100% + 4px);z-index:20;display:flex;gap:4px;background:#fff;border:1px solid var(--urg-line);border-radius:999px;padding:4px 6px;box-shadow:0 4px 14px rgba(8,51,70,.18);white-space:nowrap}
.rx .rx-menu button{border:0;background:transparent;font-size:18px;padding:2px 6px}
.rx .rx-menu button:hover{background:#eef4f9}
.rx .rx-chip{font-size:13px;padding:1px 8px}
.tl>li.tl-item:has(.rx-more[open]){z-index:5}

/* 1.3.0 phones: line and date pills centred like desktop; cards single column, full width, centred over the line
   (the line stays behind them, visible in the gaps; gap markers sit on it). */
@media (max-width:820px){
  .tl::before{left:50%;margin-left:-1.5px}
  .tl-day{justify-content:center}
  .tl-item,.tl-item.is-auto,.tl-item.left,.tl-item.right,.tl-item.is-auto.left,.tl-item.is-auto.right{width:100%;margin-left:0!important;margin-right:0!important}
  .tl-item.left>.post,.tl-item.left>.auto,.tl-item.right>.post,.tl-item.right>.auto{border:1px solid var(--urg-line);border-top:3px solid var(--urg-accent);padding-left:14px;padding-right:14px}
  .tl-item.is-auto.left>.auto,.tl-item.is-auto.right>.auto{padding-left:12px;padding-right:12px}
  .tl-gap{justify-content:center}.gap-mark{margin-left:0}
  .tl-item.g0{margin-top:10px}
}

/* 1.3.0 admin message types */
.type-swatch{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;font-size:20px;vertical-align:middle}
.tc-gray{background:#eceff2}.tc-blue{background:#e4f1fb}.tc-navy{background:#d6e2ea}.tc-green{background:#dff3e6}.tc-amber{background:#fdf1dc}.tc-red{background:#fdecea}.tc-purple{background:#efe6f8}
.type-card.retired{opacity:.7}
.icon-in{width:80px}
.type-actions{margin-bottom:0}

/* 1.3.1 search: header box (fits the greeting header; on phones it shrinks beside ☰) + result cards that open the post modal. */
.urg-header .hdr-search{display:flex;align-items:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:0 4px 0 12px;height:34px}
.urg-header .hdr-search:focus-within{background:#fff;border-color:#fff}
.urg-header .hdr-search input{background:transparent;border:0;color:#fff;font-size:14px;width:180px;padding:6px 0;outline:none;-webkit-appearance:none;appearance:none}
.urg-header .hdr-search input::placeholder{color:#cfe0ee}
.urg-header .hdr-search:focus-within input{color:#12151d}.urg-header .hdr-search:focus-within input::placeholder{color:#6b7785}
.urg-header .hdr-search-btn{background:transparent;border:0;cursor:pointer;font-size:15px;padding:4px 6px;line-height:1}
.urg-header .hdr-search-btn:focus-visible{outline:2px solid #5993C5;border-radius:50%}
.sr-head{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 12px}.sr-head h2{font-size:18px;margin:0}
.sresults{list-style:none;margin:0;padding:0}.sresults li{margin:0 0 10px}
.sr-card{cursor:pointer;transition:border-color .12s,box-shadow .12s}.sr-card:hover,.sr-card:focus-visible{border-color:#5993C5;box-shadow:0 2px 10px rgba(30,60,90,.12);outline:none}
.sr-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:13px}.sr-meta .when{margin-left:auto;color:var(--urg-muted)}
.sr-type{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--urg-muted)}
.sr-title{font-weight:600;margin-top:6px}.sr-snip{margin-top:6px;overflow-wrap:anywhere;line-height:1.45}
.sr-snip mark{background:#ffe58a;color:inherit;padding:0 1px;border-radius:2px}
@media (max-width:640px){
  .urg-header .hdr-right{gap:8px;min-width:0}
  .urg-header .hdr-search{height:32px;padding-left:10px;min-width:0}
  .urg-header .hdr-search input{width:96px}
  .urg-header .hdr-search:focus-within input{width:150px}
  .sr-meta .when{margin-left:0;width:100%}
}
@media (max-width:640px){.urg-header .hdr-search-btn{display:none}.urg-header .hdr-search{padding-right:10px}}