/* 3.13.0 큰 화면 맞춤 · 메뉴 묶음 · «← BPMS로» 띠 (업무 앱 / 자료·관리 앱 공통, 맨 마지막에 읽음)
   - 본문 고정 최대 폭(1240·1320·1560·1640·2240px)을 풀어 화면 폭을 따라 넓어지게 한다.
   - 글자·카드·지도·표 크기는 ui.js «화면 배율»(자동: ≥1920 1.1배 · ≥2560 1.25배 · ≥3840 1.6배)이 함께 키운다.
   - 너무 긴 글줄(안내문·설명)만 읽기 좋은 길이로 제한한다.
   - 조사 작성 화면(.sv-main) 폭은 건드리지 않는다(조사 기능 회귀 금지). */
html .work-app .work-page,
html[data-tier] .work-app .work-page,
html[data-purpose] .work-app .work-page { max-width: none }
html .work-app .work-page:has(> .survey-top),
html .work-app .work-page:has(> .sv-side) { max-width: none }
.work-app .work-page :is(.page-sub, .welcome-line p, .home-help p, .surface > p, .notice, .muted-note, .empty-state) { max-width: 110ch }
.work-app .work-page .work-head .page-sub { max-width: 110ch }

/* 자료·관리 앱: 숨김 사이드일 때 본문을 가운데 1680px로 묶던 것 → 화면 폭 따라 */
[data-side=hidden] body:not(.work-app):not(.legacy-mobile) #main { --ui-maxw: 100000px }

/* 대시보드(1080p 설계): 큰 화면에서는 가운데 지도·건물 무대와 옆 열이 남는 높이를 채운다 */
@media (min-width: 1900px) {
  .db-grid { grid-template-columns: minmax(300px, 22%) minmax(0, 1fr) minmax(340px, 24%) }
  .db-stage-body { min-height: 420px }
}

/* ── 사이드 메뉴 묶음(3.13.0) ── */
#sidebar.ui-shell .ui-nav-fold { display: flex; align-items: center; gap: 6px; width: 100%; border: 0; background: none; cursor: pointer; text-align: left; font: inherit; font-size: 11px; font-weight: 650; letter-spacing: .02em; color: var(--sb-mute); padding: 14px 10px 6px }
#sidebar.ui-shell .ui-nav-fold:hover { color: var(--sb-strong, var(--color-ink-fff)) }
#sidebar.ui-shell .ui-nav-fold:focus-visible { outline: 2px solid var(--color-line-8fb6ff); outline-offset: -2px; border-radius: 8px }
#sidebar.ui-shell .ui-nav-fold i { margin-left: auto; width: 8px; height: 8px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .2s }
#sidebar.ui-shell .ui-nav-g.ui-folded .ui-nav-fold i { transform: rotate(-45deg) }
#sidebar.ui-shell .ui-nav-badge { font-style: normal; font-size: 10.5px; font-weight: 750; letter-spacing: 0; padding: 1px 7px; border-radius: 999px; background: var(--color-surface-1b64da); color: var(--color-ink-fff); white-space: nowrap }
#sidebar.ui-shell .ui-nav-badge[hidden] { display: none }
#sidebar.ui-shell .ui-nav-badge.warn { background: var(--color-surface-c2410c) }   /* 3.17.2 접힌 묶음 안에 기한 경과가 있으면 */
html:not([data-side=rail]) #sidebar.ui-shell .ui-nav-g.ui-folded > a:not(.active),
html:not([data-side=rail]) #sidebar.ui-shell .ui-nav-g.ui-folded > .work-side-note { display: none !important }
[data-side=rail] #sidebar.ui-shell .ui-nav-fold { display: none }
#sidebar.ui-shell .ui-nav-g .work-side-note { margin: 6px 4px 4px; display: block }
#sidebar.ui-shell.ui-has-today .ui-nav-g .work-side-note { display: block }
[data-side=rail] #sidebar.ui-shell .ui-nav-g .work-side-note { display: none !important }

/* ── 폰 아래 탭 «더보기» ── */
.work-app #compact-nav a[data-page=more] { cursor: pointer }

/* ── «← BPMS로» 띠(자료·관리 앱을 업무 앱에서 열었을 때) ── */
.gn-backbar { position: fixed; top: 0; left: var(--side-w, 0px); right: 0; z-index: 58; height: 42px; display: flex; align-items: center; gap: 14px; padding: 0 16px; background: var(--color-surface-0f2f5c); color: var(--color-ink-dbe6f4); font-size: 13px; box-shadow: 0 2px 10px var(--color-shadow-d1810fcdb7) }
.gn-backbar .gn-back-link { flex: none; color: var(--color-ink-fff); font-weight: 800; text-decoration: none; padding: 6px 14px; border-radius: 999px; background: var(--color-surface-57c94231f5); white-space: nowrap }
.gn-backbar .gn-back-link:hover { background: var(--color-surface-beb1d2f4aa) }
.gn-backbar .gn-back-note { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
html.gn-back body:not(.work-app) #main { padding-top: 62px }
html.gn-back .ro-banner { top: 42px }
html.gn-back:has(.ro-banner) body:not(.work-app) #main { padding-top: 92px }
html.gn-back[data-form=phone] .gn-backbar { top: 56px; left: 0; height: 40px }
html.gn-back[data-form=phone] body:not(.work-app) #main { padding-top: 108px }
html.gn-back[data-form=phone] .ro-banner { top: 96px }
html.gn-back[data-form=phone]:has(.ro-banner) body:not(.work-app) #main { padding-top: 172px }
@media (max-width: 800px) { .gn-backbar .gn-back-note { font-size: 12px } }

/* ── 폰·폴드 업무 앱: «더보기» = 사이드 메뉴 전체를 서랍으로 ── */
html.ui-drawer:not([data-side]) body.work-app #sidebar { display: flex !important; flex-direction: column; position: fixed; top: 0; bottom: 0; left: 0; width: min(304px, 86vw); z-index: 90; overflow-y: auto; overscroll-behavior: contain; box-shadow: 10px 0 44px var(--color-shadow-6b2494080e); padding-bottom: calc(16px + env(safe-area-inset-bottom)) }
html.ui-drawer:not([data-side]) .ui-scrim { opacity: 1; pointer-events: auto; z-index: 85 }
html.ui-drawer:not([data-side]) body.work-app #sidebar .ui-side-toggle { display: none }

/* ── 3.13.0 새 화면 조각 ── */
.view-toggle { display: inline-flex; gap: 0; border-radius: 10px; overflow: hidden; box-shadow: inset 0 0 0 1px var(--line, var(--color-shadow-dfe5ec)) }
.view-toggle .btn { border-radius: 0; margin: 0; box-shadow: none }
.ss-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0 0 18px }
.ss-card h2 { font-size: 16px; margin: 0 0 10px }
.ss-bar { display: flex; height: 10px; border-radius: 6px; overflow: hidden; background: var(--color-surface-e8edf3); margin-bottom: 12px }
.ss-bar i { display: block; height: 100% }
.ss-bar .ss-approved, .ss-n.ss-approved b { background: var(--color-surface-2e9e5b) } .ss-bar .ss-submitted, .ss-n.ss-submitted b { background: var(--color-surface-2a78d6) }
.ss-bar .ss-returned, .ss-n.ss-returned b { background: var(--color-surface-d9731a) } .ss-bar .ss-draft, .ss-n.ss-draft b { background: var(--color-surface-8fb3e0) }
.ss-nums { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px }
.ss-n { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px; border-radius: 10px; background: var(--color-surface-f6f8fb); color: inherit; text-decoration: none; min-width: 0 }
.ss-n b { font-size: 20px; line-height: 1; padding: 6px 8px; border-radius: 8px; background: var(--color-surface-c9d3df); color: var(--color-ink-fff) }
.ss-n span { font-size: 12.5px; color: var(--sub, var(--color-ink-5c6b7f)); white-space: nowrap }
.an-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin-bottom: 18px }
.an-card h2 { font-size: 17px; margin: 0 0 8px } .an-card p { margin: 0 0 14px; line-height: 1.7 }
.guide-page .surface { margin-bottom: 16px } .guide-page h2 { font-size: 17px; margin: 0 0 10px }
.guide-list { margin: 0; padding-left: 20px; line-height: 1.9 }
@media (max-width: 800px) {
  .ss-grid { grid-template-columns: 1fr } .ss-nums { grid-template-columns: repeat(3, minmax(0, 1fr)) }
  .work-head-actions:has(.view-toggle) { flex-wrap: wrap }
}
.login-purpose { margin: 18px 0 4px !important; font-size: 15px; letter-spacing: -.01em }
.login-purpose b { color: var(--color-ink-fff); font-weight: 750 }
.login-purpose-form{margin:2px 0 6px!important;font-size:14px;color:var(--color-ink-0f2f5c)}.login-purpose-form b{font-weight:750}
/* 업무 앱 대시보드 틀 안: 자료·관리 앱의 안내 띠·원격 배지는 숨김(틀 밖 업무 앱이 이미 보여 줌) */
.gn-embed-dash .ro-banner,.gn-embed-dash .gn-remote-badge,.gn-embed-dash .gn-backbar{display:none!important}
/* 3.14.0 업무 앱 시설 화면에 끼운 시설 상세: 머리·탭·정비 띠 없이 고른 탭 본문만 */
.gn-embed-fac #sidebar,.gn-embed-fac .ui-side-open,.gn-embed-fac .ui-scrim,.gn-embed-fac .ui-appbar,.gn-embed-fac #gn-touch-notice,.gn-embed-fac .detail-head,.gn-embed-fac #main>.tabs,.gn-embed-fac #main>[data-bpms-maintenance]{display:none!important}
.gn-embed-fac #app{height:100vh}.gn-embed-fac #main{padding:10px 12px 24px!important;max-width:none!important}
/* 자료·관리 앱: 역할 때문에 링크가 모두 감춰진 묶음(관리자 아닌 원격 계정의 [관리])은 머리도 숨김 */
html[data-gn-role]:not([data-gn-role=admin]) #sidebar.ui-shell .ui-nav-g[data-g=master] { display: none }

/* 3.17.2 build 3 메뉴 나무(사용자 10/10 대학 포털 «전체메뉴» 예시): 홈(대시보드 · 나의 업무)만 보이고, 1단 묶음 → 2단 메뉴(아이콘)·하위 묶음 → 3단 하위 메뉴(점).
   열고 닫기 = 두루마리(ui-theme.js roll(): 높이 스프링 + 줄마다 펴짐 + 아래 끝 두루마리 막대). 데스크(자료·관리 앱)는 예전 묶음 그대로 */
#sidebar.ui-shell { --sb-guide: var(--color-paint-e56afd83c3); --sb-roll-hi: var(--color-paint-5fda6cf9f2); --sb-roll-sh: var(--color-paint-a45f63b35e); --sb-roll-rod: var(--color-paint-94b8b193a3) }
[data-skin=toss] #sidebar.ui-shell { --sb-guide: var(--color-paint-e5e8eb); --sb-roll-hi: var(--color-paint-0bcd00b495); --sb-roll-sh: var(--color-paint-67cde59c08); --sb-roll-rod: var(--color-paint-5c2dcdf344) }
#sidebar.ui-shell .ui-nav-h .ui-nav-badge { margin-left: 6px; vertical-align: 1px }
/* 1단 묶음 머리 */
#sidebar.ui-shell .ui-tree { gap: 0; padding: 0 }
#sidebar.ui-shell nav.ui-has-tree > .ui-nav-g[data-g=home] { padding-bottom: 4px }
#sidebar.ui-shell .ui-tree { border-top: 1px solid var(--sb-line); padding-top: 3px; margin-top: 1px }
#sidebar.ui-shell .ui-nav-h.ui-tree-h { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px; margin: 0; padding: 0 10px; border: 0; border-radius: var(--sb-r, 10px); background: none; color: var(--sb-fg); font: inherit; font-size: 13px; font-weight: 700; letter-spacing: -.01em; line-height: 1.2; text-align: left; white-space: nowrap; cursor: pointer; transition: background-color .18s, color .2s }
#sidebar.ui-shell .ui-tree-h:hover { background: var(--sb-hover); color: var(--sb-strong) }
#sidebar.ui-shell .ui-tree.open > .ui-tree-h { color: var(--sb-strong) }
#sidebar.ui-shell .ui-tree-h:focus-visible, #sidebar.ui-shell .ui-tree-pa:focus-visible { outline: 2px solid var(--sb-bar, var(--color-line-8fc0ff)); outline-offset: -2px }
#sidebar.ui-shell .ui-tree-h .ui-nav-ht { min-width: 0; overflow: hidden; text-overflow: ellipsis }
#sidebar.ui-shell .ui-tree.has-cur:not(.open) > .ui-tree-h .ui-nav-ht::after { content: ''; display: inline-block; width: 6px; height: 6px; margin-left: 7px; border-radius: 50%; background: var(--sb-ring, var(--color-surface-8fc0ff)); vertical-align: 2px }
#sidebar.ui-shell :is(.ui-tree-h, .ui-tree-pa) .ui-nav-badge { margin-left: auto }
#sidebar.ui-shell :is(.ui-tree-h, .ui-tree-pa) > i { flex: none; margin-left: auto; width: 7px; height: 7px; border-right: 1.7px solid currentColor; border-bottom: 1.7px solid currentColor; opacity: .75; transform: translateY(-2px) rotate(45deg); transition: transform var(--sp-d, 560ms) var(--sp-chewy, cubic-bezier(.34,1.36,.52,1)), opacity .2s }
#sidebar.ui-shell :is(.ui-tree-h, .ui-tree-pa) .ui-nav-badge:not([hidden]) + i { margin-left: 8px }
#sidebar.ui-shell .ui-tree.open > .ui-tree-h > i, #sidebar.ui-shell .ui-tree-sub.open > .ui-tree-pa > i { transform: translateY(2px) rotate(225deg); opacity: 1 }
/* 몸통(펼친 묶음) */
#sidebar.ui-shell .ui-tree-body { display: flex; flex-direction: column; gap: 2px; padding: 2px 0 8px; position: relative }
#sidebar.ui-shell :is(.ui-tree-body, .ui-tree-kids) { box-sizing: border-box }
#sidebar.ui-shell .ui-tree-body[hidden], #sidebar.ui-shell .ui-tree-kids[hidden] { display: none }
#sidebar.ui-shell .ui-tree-body > *, #sidebar.ui-shell .ui-tree-kids > * { transform-origin: 50% 0 }
/* 2단 하위 묶음 머리 */
#sidebar.ui-shell .ui-tree-sub { display: flex; flex-direction: column; gap: 2px }
#sidebar.ui-shell .ui-tree-sub.empty { display: none }
#sidebar.ui-shell .ui-tree-pa { position: relative; z-index: 1; display: flex; align-items: center; gap: 11px; width: 100%; min-height: 38px; margin: 0; padding: 0 10px; border: 0; border-radius: var(--sb-r, 10px); background: none; color: var(--sb-fg); font: inherit; font-size: 13.5px; font-weight: 500; letter-spacing: -.01em; text-align: left; cursor: pointer; transition: background-color .18s, color .22s .04s }
#sidebar.ui-shell .ui-tree-pa .bpms-nav-icon { flex: none; width: 18px; height: 18px; color: var(--sb-ic); opacity: 1; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; transition: color .22s .04s }
#sidebar.ui-shell .ui-tree-pa:hover { background: var(--sb-hover); color: var(--sb-strong) }
#sidebar.ui-shell .ui-tree-pa:hover .bpms-nav-icon, #sidebar.ui-shell .ui-tree-sub.open > .ui-tree-pa .bpms-nav-icon { color: var(--sb-strong) }
#sidebar.ui-shell .ui-tree-sub.open > .ui-tree-pa { color: var(--sb-strong) }
#sidebar.ui-shell .ui-tree-pt { flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
#sidebar.ui-shell .ui-tree-pa > i { width: 6px; height: 6px }
#sidebar.ui-shell .ui-tree-sub.has-cur:not(.open):not(.solo) > .ui-tree-pa { background: var(--sb-ind); color: var(--sb-act-fg); font-weight: 650 }
#sidebar.ui-shell .ui-tree-sub.has-cur:not(.open):not(.solo) > .ui-tree-pa .bpms-nav-icon { color: var(--sb-ic-act) }
/* 3단 하위 메뉴: 아이콘 대신 세로 줄 + 점 */
#sidebar.ui-shell .ui-tree-kids { display: flex; flex-direction: column; gap: 1px; position: relative; padding: 1px 0 5px }
#sidebar.ui-shell .ui-tree-kids::before { content: ''; position: absolute; left: 19px; top: 2px; bottom: 9px; width: 1px; background: var(--sb-guide); pointer-events: none }
#sidebar.ui-shell nav .ui-tree-kids > a { min-height: 34px; padding-left: 39px !important; font-size: 13px }
#sidebar.ui-shell nav .ui-tree-kids > a .bpms-nav-icon { display: none }
#sidebar.ui-shell nav .ui-tree-kids > a::before { content: ''; position: absolute; left: 17px; top: 50%; width: 5px; height: 5px; margin-top: -2.5px; border-radius: 50%; background: var(--sb-mute); box-shadow: 0 0 0 3px var(--sb-solid, var(--color-shadow-0e2c56)); transition: background-color .2s, transform .3s var(--sp-pop, ease) }
#sidebar.ui-shell nav .ui-tree-kids > a:hover::before { background: var(--sb-strong) }
#sidebar.ui-shell nav .ui-tree-kids > a.active::before { background: var(--sb-ring, var(--color-surface-8fc0ff)); box-shadow: none; transform: scale(1.3) }
/* 하위 메뉴가 하나뿐이거나 묶음 안 유일한 하위 묶음: 한 단 건너뛰어 2단처럼 */
#sidebar.ui-shell .ui-tree-sub.solo > .ui-tree-pa { display: none }
#sidebar.ui-shell .ui-tree-sub.solo > .ui-tree-kids { display: flex !important; gap: 2px; padding: 0 }
#sidebar.ui-shell .ui-tree-sub.solo > .ui-tree-kids::before { display: none }
#sidebar.ui-shell nav .ui-tree-sub.solo > .ui-tree-kids > a { min-height: 38px; padding-left: 10px !important; font-size: 13.5px }
#sidebar.ui-shell nav .ui-tree-sub.solo > .ui-tree-kids > a::before { display: none }
#sidebar.ui-shell nav .ui-tree-sub.solo > .ui-tree-kids > a .bpms-nav-icon { display: block }
/* 두루마리 움직임 중: 넘치는 줄 가리기 + 아래 끝 막대(풀리는/말리는 종이 끝) */
#sidebar.ui-shell .ui-rolling { overflow: hidden }
#sidebar.ui-shell .ui-rolling::after { content: ''; position: absolute; left: 4px; right: 4px; bottom: 0; height: 13px; border-radius: 0 0 9px 9px; pointer-events: none; z-index: 2;
  background: linear-gradient(180deg, transparent 0, var(--sb-roll-hi) 58%, var(--sb-roll-sh) 100%); border-bottom: 2px solid var(--sb-roll-rod); animation: uiRod var(--roll-d, 600ms) linear both }
@keyframes uiRod { 0% { opacity: 0 } 12% { opacity: 1 } 76% { opacity: 1 } 100% { opacity: 0 } }
/* 고른 메뉴 표시(.ui-nav-ind)는 움직이는 동안 쉬고, 그동안은 고른 메뉴 자체 바탕으로(한 프레임 늦게 따라오는 흔들림 없음) */
#sidebar.ui-shell nav:has(.ui-rolling) .ui-nav-ind { opacity: 0 !important; transition: none !important }
#sidebar.ui-shell nav.has-ind:has(.ui-rolling) a.active { background: var(--sb-ind) !important }
[data-form=tablet] #sidebar.ui-shell :is(.ui-tree-h, .ui-tree-pa) { min-height: 44px }
[data-form=tablet] #sidebar.ui-shell nav .ui-tree-kids > a { min-height: 42px }
/* 아이콘만 보이는 좁은 메뉴(rail): 묶음 머리는 숨기고 2단 아이콘을 모두 펼친 채, 하위 묶음 아이콘을 누르면 첫 하위 메뉴로 */
[data-side=rail] #sidebar.ui-shell .ui-tree { border-top: 0; padding-top: 0; margin-top: 0 }
[data-side=rail] #sidebar.ui-shell .ui-tree-h { display: none }
[data-side=rail] #sidebar.ui-shell .ui-tree-body, [data-side=rail] #sidebar.ui-shell .ui-tree-body[hidden] { display: flex !important; padding: 0; height: auto !important }
[data-side=rail] #sidebar.ui-shell .ui-tree-kids, [data-side=rail] #sidebar.ui-shell .ui-tree-kids[hidden] { display: none !important }
[data-side=rail] #sidebar.ui-shell .ui-tree-sub.solo > .ui-tree-kids { display: flex !important }
[data-side=rail] #sidebar.ui-shell .ui-tree-pa { justify-content: center; gap: 0; padding: 0; min-height: 46px; border-radius: 12px }
[data-side=rail] #sidebar.ui-shell .ui-tree-pa :is(.ui-tree-pt, i) { display: none }
[data-side=rail] #sidebar.ui-shell .ui-tree-pa .bpms-nav-icon { width: 22px; height: 22px }
[data-side=rail] #sidebar.ui-shell .ui-tree-pa .ui-nav-badge { position: absolute; top: 5px; right: 6px; margin: 0; min-width: 16px; height: 16px; padding: 0 4px; font-size: 9.5px; line-height: 16px; box-shadow: 0 0 0 2px var(--sb-solid) }
[data-side=rail] #sidebar.ui-shell .ui-tree-sub.open > .ui-tree-pa { color: var(--sb-fg) }
[data-side=rail] #sidebar.ui-shell .ui-tree-sub.open > .ui-tree-pa .bpms-nav-icon { color: var(--sb-ic) }
[data-side=rail] #sidebar.ui-shell .ui-tree-pa:hover, [data-side=rail] #sidebar.ui-shell .ui-tree-pa:hover .bpms-nav-icon { color: var(--sb-strong) }
[data-side=rail] #sidebar.ui-shell .ui-tree-sub.has-cur:not(.solo) > .ui-tree-pa { background: var(--sb-ind); color: var(--sb-act-fg) }
[data-side=rail] #sidebar.ui-shell .ui-tree-sub.has-cur:not(.solo) > .ui-tree-pa .bpms-nav-icon { color: var(--sb-ic-act) }
@media (prefers-reduced-motion: reduce) { #sidebar.ui-shell :is(.ui-tree-h, .ui-tree-pa) > i { transition: none } #sidebar.ui-shell .ui-rolling::after { display: none } }
html[data-motion=off] #sidebar.ui-shell :is(.ui-tree-h, .ui-tree-pa) > i { transition: none }
html[data-motion=less] #sidebar.ui-shell .ui-rolling::after { display: none }

/* 3.17.2 build 3 건물 보기: 앨범형 · 썸네일 목록 · 리스트형 (buildings.js, 그림·카드 모양은 시설 목록 카드와 같은 틀) */
.toolbar .bld-view { flex: none }
.toolbar .bld-view button { white-space: nowrap }
.bld-gallery { margin-top: 2px }
.bld-tile.has-alert { box-shadow: inset 0 3px 0 var(--alert, var(--color-shadow-d0463f)) }
.bld-tile-alert { position: absolute; right: 10px; top: 10px; z-index: 1 }
.bld-tile .ft-nm em { margin-left: 2px }
.bld-tile .ft-foot span { max-width: 100% }
.fac-thumb.mid { width: 120px; height: 80px; border-radius: 12px }
.fac-thumb.mid img { inset: 5px 7px 4px; width: calc(100% - 14px); height: calc(100% - 9px); transition: transform var(--sp-dp, .4s) var(--sp-pop, ease) }
.fac-thumb.mid .fac-ic { width: 30px; height: 30px; stroke-width: 1.5 }
.bld-rows { display: flex; flex-direction: column; gap: 8px }
.bld-row { position: relative; display: grid; grid-template-columns: 120px minmax(0, 1fr) 236px 56px; align-items: center; gap: 16px; padding: 10px 14px 10px 10px; border: 1px solid var(--line); border-radius: var(--r, 14px); background: var(--panel, var(--color-surface-fff)); cursor: pointer;
  transition: transform var(--sp-d, .5s) var(--sp-chewy, ease), box-shadow .3s, border-color .2s; animation: uiRise var(--sp-d, .5s) var(--sp-soft, ease) backwards }
.bld-row:nth-child(n+2) { animation-delay: 20ms } .bld-row:nth-child(n+5) { animation-delay: 50ms } .bld-row:nth-child(n+9) { animation-delay: 80ms }
.bld-row:hover { transform: translateY(-2px); box-shadow: 0 10px 24px var(--color-shadow-c2201c29bd); border-color: transparent }
.bld-row:hover .fac-thumb.mid img { transform: scale(1.07) translateY(-1px) }
.bld-row:active { transform: scale(.99) }
.bld-row:focus-visible { outline: 3px solid var(--color-line-719ee8); outline-offset: 2px }
.bld-row.has-alert { box-shadow: inset 4px 0 0 var(--alert, var(--color-shadow-d0463f)) }
.bld-row.has-alert:hover { box-shadow: inset 4px 0 0 var(--alert, var(--color-shadow-d0463f)), 0 10px 24px var(--color-shadow-c2201c29bd) }
.br-main { min-width: 0; display: flex; flex-direction: column; gap: 5px }
.br-nm { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 15px; letter-spacing: -.02em }
.br-nm b { font-weight: 800; color: var(--txt); white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.br-nm .badge { flex: none }
.br-sub { font-size: 12.5px; color: var(--sub); white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.br-flags { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; min-height: 22px }
.br-flags .badge { font-size: 11.5px }
.bld-row .br-stats { padding-top: 0; border-top: 0; border-left: 1px solid var(--line-soft, var(--color-line-eef1f5)); padding-left: 12px }
.br-alert { justify-self: end }
.bld-empty { padding: 40px 0; text-align: center }
@media (max-width: 900px) {
  .bld-row { grid-template-columns: 96px minmax(0, 1fr) auto; gap: 12px }
  .bld-row .br-stats { display: none }
  .fac-thumb.mid { width: 96px; height: 66px }
}
@media (max-width: 560px) {
  .toolbar .bld-view { width: 100% } .toolbar .bld-view button { flex: 1; justify-content: center; padding: 0 8px }
  .bld-row { grid-template-columns: 84px minmax(0, 1fr); gap: 10px; padding: 10px 10px 10px 8px }
  .fac-thumb.mid { width: 84px; height: 60px }
  .br-nm { flex-wrap: wrap; row-gap: 4px } .br-nm b { flex: 1 1 100%; white-space: normal; line-height: 1.35 }
  .bld-row.has-alert .br-nm { padding-right: 52px }
  .br-alert { position: absolute; right: 10px; top: 10px }
}
:root[data-motion=off] .bld-row { animation: none; transition: none }
