/* 게시판 — easyclass-design 토큰(라벤더 바탕 · 흰 카드 그림자 · 주황 행동 단추 · 파스텔 칩 · 11px 대문자 라벨)
   목록 형태: 목록 · 피드 · 지역 행 · 사진 카드 · 웹진 · FAQ / 모바일은 앱처럼 / 쓰기 창(.bdc) */
.bd-app { --bd-ink: var(--c-text, #1c1c28); --bd-mut: var(--c-muted, #8a90a2); --bd-line: var(--c-line, #e7e9f0); --bd-ac: var(--c-accent, #f97316);
  --bd-acs: #fff1e6; --bd-pg: #f4f4f9; --bd-card: #fff; --bd-sh: 0 8px 28px rgba(28, 28, 40, .06); --bd-sh2: 0 18px 50px rgba(28, 28, 40, .12); --bd-r: 20px;
  --bd-ease: cubic-bezier(.2, .8, .2, 1); }
.bd-app svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.t-blue { background: #D9E8F5 !important; } .t-purple { background: #E4D6F7 !important; } .t-pink { background: #F9D2DA !important; }
.t-mint { background: #D8F3E3 !important; } .t-yellow { background: #FCF0D4 !important; } .t-peach { background: #FEEBDC !important; }
.bd-label { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--bd-mut, #8a90a2); }
.bd-label b { color: var(--bd-ink, #1c1c28); }
.bd-meta { font-size: 12.5px; color: var(--bd-mut); }
.bd-badge { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 99px; background: var(--bd-acs); color: var(--bd-ac); font-size: 11.5px; font-weight: 800; font-style: normal; flex: none; }
.bd-cc { margin-left: 6px; color: var(--bd-ac); font-size: 12.5px; font-weight: 800; font-style: normal; }

/* 머리 — 아이콘 칩 · 이름 · 설명 · 검색 · 글쓰기 */
.bd-hero { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 24px; flex-wrap: wrap; }
.bd-hero-l { display: flex; align-items: center; gap: 16px; min-width: 0; }
.bd-ico { flex: none; display: grid; place-items: center; width: 60px; height: 60px; border-radius: 18px; background: #EDEDF5; font-size: 28px; line-height: 1; box-shadow: inset 0 0 0 1px rgba(28, 28, 40, .04); }
.bd-ico.sm { width: 28px; height: 28px; border-radius: 9px; font-size: 15px; }
.bd-hero-t { min-width: 0; }
.bd-h1 { margin: 4px 0 0; font-size: clamp(24px, 3vw, 32px); font-weight: 800; letter-spacing: -.8px; line-height: 1.2; }
.bd-desc { margin: 6px 0 0; color: var(--bd-mut); font-size: 14.5px; }
.bd-tools { display: flex; gap: 10px; align-items: center; }
.bd-search { display: flex; align-items: center; height: 44px; padding: 0 6px 0 4px; border-radius: 99px; background: var(--bd-card); box-shadow: var(--bd-sh); margin: 0; }
.bd-search button { display: grid; place-items: center; width: 36px; height: 36px; border: 0; background: none; color: var(--bd-mut); cursor: pointer; }
.bd-search input { width: 200px; border: 0; outline: 0; background: none; font: inherit; font-size: 14px; color: inherit; }
.bd-write { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 20px; border-radius: 99px; background: var(--bd-ac); color: #fff !important; font-weight: 800; font-size: 14.5px; text-decoration: none; box-shadow: 0 10px 24px -10px rgba(249, 115, 22, .7); transition: transform .2s var(--bd-ease), box-shadow .2s; }
.bd-write:hover { transform: translateY(-2px); box-shadow: 0 14px 28px -10px rgba(249, 115, 22, .8); }

/* 게시판 칩 탭 · 지역 칩 */
.bd-tabs, .bd-regions { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding: 2px 2px 4px; margin: -2px; scroll-snap-type: x proximity; }
.bd-tabs::-webkit-scrollbar, .bd-regions::-webkit-scrollbar { display: none; }
.bd-tab { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 16px 0 12px; border-radius: 99px; background: var(--bd-card); color: var(--bd-ink); font-size: 14px; font-weight: 700; text-decoration: none; box-shadow: var(--bd-sh); scroll-snap-align: start; transition: background-color .15s, color .15s; }
.bd-tab span { font-size: 16px; }
.bd-tab:hover { background: var(--bd-pg); }
.bd-tab.is-on { background: var(--bd-ink); color: #fff; }
.bd-chip { flex: none; display: inline-flex; align-items: center; height: 32px; padding: 0 14px; border-radius: 99px; background: rgba(255, 255, 255, .7); color: var(--bd-ink); font-size: 13px; font-weight: 600; text-decoration: none; box-shadow: inset 0 0 0 1px var(--bd-line); }
.bd-chip.is-on { background: var(--bd-acs); color: var(--bd-ac); box-shadow: inset 0 0 0 1.5px var(--bd-ac); font-weight: 800; }

/* 고정 공지 (피드 · 행 · 카드) */
.bd-pins { list-style: none; margin: 0; padding: 6px; border-radius: var(--bd-r); background: var(--bd-card); box-shadow: var(--bd-sh); }
.bd-pins a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; text-decoration: none; color: var(--bd-ink); }
.bd-pins a:hover { background: var(--bd-pg); }
.bd-pins i { color: var(--bd-ac); display: flex; } .bd-pins i svg { width: 16px; height: 16px; }
.bd-pins b { flex: none; font-size: 12px; color: var(--bd-ac); }
.bd-pins span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 14.5px; font-weight: 600; }

/* 비었을 때 */
.bd-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 56px 20px; border-radius: var(--bd-r); background: var(--bd-card); box-shadow: var(--bd-sh); text-align: center; }
.bd-empty b { font-size: 17px; margin-top: 6px; } .bd-empty p { margin: 0 0 10px; color: var(--bd-mut); }

/* 목록 형태 — 줄(데스크톱 표 · 모바일 두 줄) */
.bd-lrows { list-style: none; margin: 0; padding: 6px 10px; border-radius: var(--bd-r); background: var(--bd-card); box-shadow: var(--bd-sh); }
.bd-lhead, .bd-lrow { display: grid; grid-template-columns: 64px minmax(0, 1fr) 110px 100px 64px; align-items: center; gap: 12px; padding: 14px 10px; }
.bd-lhead { padding: 12px 10px 10px; font-size: 12px; font-weight: 700; color: var(--bd-mut); border-bottom: 1px solid var(--bd-line); }
.bd-lrow + .bd-lrow { border-top: 1px solid #f1f2f6; }
.bd-lrow.is-notice { background: #fffaf5; border-radius: 12px; }
.bd-no, .bd-views { text-align: center; color: var(--bd-mut); font-size: 13px; }
.bd-author { font-size: 13.5px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bd-date { color: var(--bd-mut); font-size: 13px; }
.bd-lt { display: flex; align-items: center; gap: 6px; min-width: 0; color: var(--bd-ink); text-decoration: none; font-weight: 600; font-size: 15px; }
.bd-lt > span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bd-lt:hover > span { text-decoration: underline; text-underline-offset: 3px; }
.bd-clip { display: flex; color: var(--bd-mut); } .bd-clip svg { width: 15px; height: 15px; }
.bd-mo { display: none; }

/* 피드 (자유 · 노하우) */
.bd-feed { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.bd-feed-item > a { display: flex; gap: 18px; padding: 20px 22px; border-radius: var(--bd-r); background: var(--bd-card); box-shadow: var(--bd-sh); color: var(--bd-ink); text-decoration: none; transition: transform .2s var(--bd-ease), box-shadow .2s; }
.bd-feed-item > a:hover { transform: translateY(-2px); box-shadow: var(--bd-sh2); }
.bd-feed-main { flex: 1; min-width: 0; }
.bd-who { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 13px; color: var(--bd-mut); }
.bd-who b { color: var(--bd-ink); font-size: 13.5px; }
.bd-av { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; font-size: 14px; font-weight: 800; color: #3b3b52; }
.bd-av.sm { width: 30px; height: 30px; font-size: 12.5px; }
.bd-who .bd-av { width: 28px; height: 28px; font-size: 12px; }
.bd-feed-item h2 { margin: 0; font-size: 17px; font-weight: 800; letter-spacing: -.3px; line-height: 1.4; }
.bd-ex { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 6px 0 0; color: #5b6172; font-size: 14px; line-height: 1.6; }
.bd-stats { display: flex; gap: 14px; margin: 12px 0 0; color: var(--bd-mut); font-size: 12.5px; font-weight: 600; }
.bd-stats span { display: inline-flex; align-items: center; gap: 4px; }
.bd-stats svg { width: 15px; height: 15px; }
.bd-feed-th { flex: none; width: 112px; height: 112px; border-radius: 16px; overflow: hidden; background: var(--bd-pg); align-self: center; }
.bd-feed-th img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 지역 행 (구인 · 구직) */
.bd-rows { list-style: none; margin: 0; padding: 6px; border-radius: var(--bd-r); background: var(--bd-card); box-shadow: var(--bd-sh); }
.bd-row > a { display: flex; gap: 16px; align-items: flex-start; padding: 16px; border-radius: 16px; color: var(--bd-ink); text-decoration: none; transition: background-color .15s; }
.bd-row > a:hover { background: var(--bd-pg); }
.bd-row + .bd-row { border-top: 1px solid #f1f2f6; }
.bd-row-rg { flex: none; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 16px; font-size: 13.5px; font-weight: 800; letter-spacing: -.3px; color: #3b3b52; }
.bd-row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.bd-row-t { font-size: 16px; font-weight: 800; letter-spacing: -.3px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bd-row .bd-ex { margin: 0; -webkit-line-clamp: 1; }

/* 사진 카드 (모델모집 · 중고마켓 · 점포매매) */
.bd-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 26px 20px; }
.bd-card > a { display: flex; flex-direction: column; gap: 4px; color: var(--bd-ink); text-decoration: none; }
.bd-card-th { position: relative; display: grid; place-items: center; aspect-ratio: 1; border-radius: 18px; overflow: hidden; margin-bottom: 8px; box-shadow: var(--bd-sh); }
.bd-card-th img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s var(--bd-ease); }
.bd-card > a:hover .bd-card-th img { transform: scale(1.04); }
.bd-card-th > i { font-size: 46px; font-style: normal; opacity: .9; }
.bd-card-t { font-size: 15.5px; font-weight: 700; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bd-price { font-size: 16.5px; font-weight: 800; letter-spacing: -.3px; }
.bd-price.is-nego { color: var(--bd-ac); }
.bd-card .bd-stats { margin-top: 2px; }
.bd-card.is-done .bd-card-th img, .bd-card.is-done .bd-card-th > i { opacity: .45; filter: grayscale(.6); }
.bd-st { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 8px; font-size: 12px; font-weight: 800; font-style: normal; color: #fff; background: #16a34a; }
.bd-card-th .bd-st { position: absolute; left: 10px; top: 10px; }
.bd-st--reserved { background: #16a34a; } .bd-st--done { background: #3b3b52; } .bd-st--sale { background: var(--bd-ac); }

/* 웹진 · FAQ */
.bd-webzine { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.bd-wz-item { background: var(--bd-card); border-radius: var(--bd-r); overflow: hidden; text-decoration: none; color: var(--bd-ink); box-shadow: var(--bd-sh); transition: transform .2s var(--bd-ease), box-shadow .2s; }
.bd-wz-item:hover { transform: translateY(-3px); box-shadow: var(--bd-sh2); }
.bd-wz-item > div:last-child { padding: 14px 16px 16px; }
.bd-wz-item h2 { font-size: 16px; margin: 0 0 4px; }
.bd-wz-item p { margin: 0; }
.bd-wz-thumb { aspect-ratio: 16 / 10; background: linear-gradient(135deg, #e0edff, #f9d2da); }
.bd-wz-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bd-faq { display: flex; flex-direction: column; gap: 10px; }
.bd-faq-item { border-radius: 18px; background: var(--bd-card); box-shadow: var(--bd-sh); }
.bd-faq-item summary { display: flex; align-items: center; gap: 12px; padding: 18px 22px; cursor: pointer; font-weight: 700; list-style: none; }
.bd-faq-item summary::-webkit-details-marker { display: none; }
.bd-faq-item summary::after { content: "+"; margin-left: auto; font-size: 20px; color: var(--bd-mut); transition: transform .2s; }
.bd-faq-item[open] summary::after { transform: rotate(45deg); }
.bd-faq-item summary b { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: var(--bd-acs); color: var(--bd-ac); flex: none; }
.bd-faq-item .bd-body { padding: 0 22px 20px 62px; }

/* 떠 있는 글쓰기 단추 (모바일) */
.bd-fab { display: none; }

/* 글 보기 ------------------------------------------------------------------ */
.bd-read { max-width: 860px; }
.bd-appbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.bd-back { display: inline-flex; align-items: center; gap: 8px; color: var(--bd-ink); text-decoration: none; font-size: 14px; font-weight: 700; min-width: 0; }
.bd-back b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bd-back svg { width: 20px; height: 20px; }
.bd-share { display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--bd-card); color: var(--bd-ink); box-shadow: var(--bd-sh); cursor: pointer; }
.bd-post { padding: 30px 34px 34px; border-radius: 24px; background: var(--bd-card); box-shadow: var(--bd-sh); }
.bd-gal { position: relative; margin: -30px -34px 26px; border-radius: 24px 24px 0 0; overflow: hidden; background: #111; }
.bd-gal-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.bd-gal-track::-webkit-scrollbar { display: none; }
.bd-gal-item { flex: 0 0 100%; scroll-snap-align: center; display: grid; place-items: center; aspect-ratio: 4 / 3; max-height: 560px; }
.bd-gal-item img { width: 100%; height: 100%; object-fit: contain; display: block; }
.bd-gal-n { position: absolute; right: 14px; bottom: 14px; padding: 4px 11px; border-radius: 99px; background: rgba(0, 0, 0, .55); color: #fff; font-size: 12px; font-weight: 600; backdrop-filter: blur(6px); }
.bd-gal-n b { font-weight: 800; }
.bd-post-head { padding-bottom: 20px; margin-bottom: 24px; border-bottom: 1px solid #f1f2f6; }
.bd-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.bd-chips:empty { display: none; }
.bd-rg { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 8px; background: var(--bd-pg); color: #5b6172; font-size: 12px; font-weight: 700; font-style: normal; }
.bd-title { margin: 0; font-size: clamp(22px, 2.6vw, 28px); font-weight: 800; letter-spacing: -.6px; line-height: 1.35; word-break: keep-all; }
.bd-price-l { margin: 10px 0 0; font-size: 22px; font-weight: 800; letter-spacing: -.4px; }
.bd-price-l.is-nego { color: var(--bd-ac); }
.bd-by { display: flex; align-items: center; gap: 12px; margin-top: 18px; }
.bd-by-t { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.bd-by-t b { font-size: 14.5px; } .bd-by-t small { color: var(--bd-mut); font-size: 12.5px; }
.bd-more { position: relative; }
.bd-more summary { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; cursor: pointer; list-style: none; color: var(--bd-mut); }
.bd-more summary::-webkit-details-marker { display: none; }
.bd-more summary:hover { background: var(--bd-pg); }
.bd-more-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; min-width: 140px; padding: 6px; border-radius: 14px; background: var(--bd-card); box-shadow: var(--bd-sh2); }
.bd-more-menu a, .bd-more-menu button { display: block; width: 100%; padding: 10px 12px; border: 0; border-radius: 10px; background: none; color: var(--bd-ink); font: inherit; font-size: 14px; font-weight: 600; text-align: left; text-decoration: none; cursor: pointer; }
.bd-more-menu a:hover, .bd-more-menu button:hover { background: var(--bd-pg); }
.bd-more-menu form { margin: 0; } .bd-more-menu button { color: #dc2626; }
.bd-body { font-size: 16px; line-height: 1.8; word-break: keep-all; overflow-wrap: anywhere; }
.bd-body img { max-width: 100%; height: auto; border-radius: 14px; }
.bd-body iframe { max-width: 100%; }

/* 첨부 파일 — 레슨 리스트 모양 */
.bd-files { margin-top: 28px; padding: 18px 20px; border-radius: 20px; background: var(--bd-pg, #f1f2f6); }
.bd-files .bd-label { margin-bottom: 12px; }
.bd-files ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.bd-file { display: flex; align-items: center; gap: 12px; padding: 10px 10px 10px 12px; border-radius: 16px; background: #fff; box-shadow: 0 8px 24px rgba(28, 28, 40, .06); }
.bd-file-v { flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; overflow: hidden; background: #d9e8f5; }
.bd-file-v b { font-size: 11px; font-weight: 800; letter-spacing: .04em; opacity: .75; }
.bd-file-img { background: #f1f2f6; } .bd-file-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bd-k-pdf { background: #f9d2da; } .bd-k-sheet, .bd-k-audio { background: #d8f3e3; } .bd-k-slide { background: #fcf0d4; } .bd-k-archive, .bd-k-video { background: #e4d6f7; }
.bd-file-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.bd-file-info a { font-size: 14px; font-weight: 600; color: inherit; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bd-file-info a:hover { text-decoration: underline; }
.bd-file-info small { font-size: 12px; color: var(--bd-mut); }
.bd-file-dl { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 999px; background: #f1f2f6; color: inherit; font-size: 13px; font-weight: 700; text-decoration: none; }
.bd-file-dl:hover { background: #e6e7ee; }
.bd-file-dl svg { width: 16px; height: 16px; }

/* 댓글 */
.bd-comments { padding: 26px 30px; border-radius: 24px; background: var(--bd-card); box-shadow: var(--bd-sh); }
.bd-h2 { margin: 0 0 8px; font-size: 17px; font-weight: 800; } .bd-h2 b { color: var(--bd-ac); }
.bd-c-empty, .bd-c-login { color: var(--bd-mut); font-size: 14px; margin: 10px 0 4px; }
.bd-comment { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid #f1f2f6; position: relative; }
.bd-c-main { flex: 1; min-width: 0; }
.bd-c-who { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; color: var(--bd-mut); }
.bd-c-who b { color: var(--bd-ink); font-size: 13.5px; }
.bd-c-who em { font-style: normal; font-size: 11px; font-weight: 800; color: var(--bd-ac); background: var(--bd-acs); padding: 1px 7px; border-radius: 6px; }
.bd-c-body { margin: 4px 0 0; font-size: 14.5px; line-height: 1.65; }
.bd-cdel { margin: 0; } .bd-cdel button { border: 0; background: none; color: var(--bd-mut); font: inherit; font-size: 12.5px; cursor: pointer; }
.bd-cdel button:hover { color: #dc2626; }
.bd-cform { display: flex; align-items: flex-end; gap: 10px; margin: 16px 0 0; padding: 8px 8px 8px 10px; border-radius: 22px; background: var(--bd-pg); }
.bd-cform .bd-av { margin-bottom: 4px; }
.bd-cform textarea { flex: 1; min-height: 38px; max-height: 160px; padding: 8px 2px; border: 0; outline: 0; background: none; font: inherit; font-size: 14.5px; resize: none; line-height: 1.5; }
.bd-cform button { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--bd-ac); color: #fff; cursor: pointer; transition: transform .15s; }
.bd-cform button:active { transform: scale(.92); }
.bd-nav { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.bd-nav a { display: inline-flex; align-items: center; height: 40px; padding: 0 16px; border-radius: 99px; background: var(--bd-card); color: var(--bd-ink); font-size: 13.5px; font-weight: 700; text-decoration: none; box-shadow: var(--bd-sh); }
.bd-nav a:hover { background: var(--bd-pg); }
.bd-buybar { display: none; }

/* 본문 블록 (관리자 편집기 · 블록 넣기) */
.bd-body .bdx-note { margin: 18px 0; padding: 16px 20px; border-radius: 16px; background: #EEF4FB; border-left: 4px solid #60a5fa; }
.bd-body .bdx-note.is-warn { background: #FFF6E9; border-color: #f59e0b; }
.bd-body .bdx-note.is-ok { background: #ECF8F1; border-color: #22c55e; }
.bd-body .bdx-note > :first-child { margin-top: 0; } .bd-body .bdx-note > :last-child { margin-bottom: 0; }
.bd-body .bdx-btns { display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0; }
.bd-body .bdx-btn, .bd-body button.bdx-btn { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 24px; border: 0; border-radius: 99px; background: var(--bd-ac, #f97316); color: #fff !important; font: inherit; font-size: 15px; font-weight: 800; text-decoration: none !important; cursor: pointer; box-shadow: 0 10px 24px -10px rgba(249, 115, 22, .7); }
.bd-body .bdx-btn--ghost { background: #fff; color: var(--bd-ink, #1c1c28) !important; box-shadow: inset 0 0 0 1.5px #e2e4ec; }
.bd-body .bdx-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin: 20px 0; }
.bd-body .bdx-cols > div { padding: 18px 20px; border-radius: 16px; background: #f6f6fa; }
.bd-body .bdx-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 20px 0; }
.bd-body .bdx-card { padding: 20px; border-radius: 18px; background: #fff; box-shadow: 0 8px 26px rgba(28, 28, 40, .08); }
.bd-body .bdx-card h4 { margin: 10px 0 6px; font-size: 16px; } .bd-body .bdx-card p { margin: 0; font-size: 14px; color: #5b6172; }
.bd-body .bdx-emoji { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: #EDEDF5; font-size: 22px; }
.bd-body .bdx-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 20px 0; }
.bd-body .bdx-stats > div { padding: 20px; border-radius: 18px; background: #f6f6fa; text-align: center; }
.bd-body .bdx-stats b { display: block; font-size: 30px; font-weight: 800; letter-spacing: -1px; color: var(--bd-ac, #f97316); }
.bd-body .bdx-stats span { font-size: 13px; color: #5b6172; }
.bd-body .bdx-steps { list-style: none; counter-reset: s; margin: 20px 0; padding: 0; display: grid; gap: 10px; }
.bd-body .bdx-steps li { counter-increment: s; display: flex; gap: 14px; align-items: flex-start; padding: 14px 16px; border-radius: 16px; background: #f6f6fa; }
.bd-body .bdx-steps li::before { content: counter(s); flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--bd-ac, #f97316); color: #fff; font-weight: 800; font-size: 14px; }
.bd-body .bdx-steps li b { display: block; }
.bd-body .bdx-acc { margin: 8px 0; border-radius: 14px; background: #f6f6fa; }
.bd-body .bdx-acc summary { padding: 14px 18px; font-weight: 700; cursor: pointer; }
.bd-body .bdx-acc > :not(summary) { margin: 0; padding: 0 18px 14px; }
.bd-body .bdx-check { list-style: none; padding: 0; }
.bd-body .bdx-check li { position: relative; padding-left: 30px; margin: 8px 0; }
.bd-body .bdx-check li::before { content: "✓"; position: absolute; left: 0; top: 2px; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: #D8F3E3; color: #15803d; font-size: 12px; font-weight: 900; }
.bd-body .bdx-table { width: 100%; border-collapse: separate; border-spacing: 0; margin: 18px 0; border-radius: 14px; overflow: hidden; box-shadow: inset 0 0 0 1px #e7e9f0; font-size: 14.5px; }
.bd-body .bdx-table th { background: #f4f4f9; font-weight: 700; }
.bd-body .bdx-table th, .bd-body .bdx-table td { padding: 11px 14px; border-bottom: 1px solid #eef0f4; text-align: left; }
.bd-body .bdx-table tr:last-child td { border-bottom: 0; }
.bd-body .bdx-video, .bd-body .bdx-embed { position: relative; margin: 20px 0; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; background: #111; }
.bd-body .bdx-embed { aspect-ratio: 4 / 3; background: #f4f4f9; }
.bd-body .bdx-video iframe, .bd-body .bdx-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.bd-body blockquote { margin: 18px 0; padding: 4px 0 4px 18px; border-left: 4px solid var(--bd-ac, #f97316); color: #44475a; font-size: 17px; }
/* 본문 폼 (신청 · 설문 · 문의) */
.bd-body .bdx-form { display: grid; gap: 14px; margin: 24px 0; padding: 26px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 1px #eceef4, 0 14px 40px rgba(28, 28, 40, .08); }
.bd-body .bdx-form-head h3 { margin: 0; font-size: 20px; } .bd-body .bdx-form-head p { margin: 4px 0 0; color: #5b6172; font-size: 14px; }
.bd-body .bdx-f { display: grid; gap: 6px; margin: 0; padding: 0; border: 0; min-width: 0; }
.bd-body .bdx-f > span, .bd-body .bdx-f > legend { font-size: 13.5px; font-weight: 700; padding: 0; margin-bottom: 6px; }
.bd-body .bdx-f i, .bd-body .bdx-f legend i { color: var(--bd-ac, #f97316); font-style: normal; }
.bd-body .bdx-f input:not([type=radio]):not([type=checkbox]), .bd-body .bdx-f select, .bd-body .bdx-f textarea { width: 100%; box-sizing: border-box; padding: 12px 14px; border: 0; border-radius: 12px; background: #f4f4f9; font: inherit; font-size: 15px; color: inherit; outline: 0; transition: box-shadow .15s, background-color .15s; }
.bd-body .bdx-f input:focus, .bd-body .bdx-f select:focus, .bd-body .bdx-f textarea:focus { background: #fff; box-shadow: 0 0 0 2px var(--bd-ac, #f97316); }
.bd-body .bdx-f label { display: inline-flex; align-items: center; gap: 8px; margin: 0 16px 6px 0; font-size: 14.5px; font-weight: 500; }
.bd-body .bdx-form input[type=radio], .bd-body .bdx-form input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--bd-ac, #f97316); }
.bd-body .bdx-agree { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-radius: 12px; background: #fff7ef; font-size: 13.5px; font-weight: 600; }
.bd-body .bdx-form .bdx-btn { justify-self: start; }
.bd-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }

/* 게시판 모아보기 (/boards) */
.bd-hub-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 18px; }
.bd-hub-card { display: flex; flex-direction: column; border-radius: 22px; background: var(--bd-card); box-shadow: var(--bd-sh); overflow: hidden; transition: transform .2s var(--bd-ease), box-shadow .2s; }
.bd-hub-card:hover { transform: translateY(-3px); box-shadow: var(--bd-sh2); }
.bd-hub-top { display: flex; align-items: center; gap: 14px; padding: 20px 20px 14px; color: var(--bd-ink); text-decoration: none; }
.bd-hub-top .bd-ico { width: 50px; height: 50px; border-radius: 15px; font-size: 24px; }
.bd-hub-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bd-hub-t b { font-size: 16.5px; font-weight: 800; }
.bd-hub-t small { color: var(--bd-mut); font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bd-new { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 4px; border-radius: 99px; background: var(--bd-ac); color: #fff; font-size: 11px; font-style: normal; font-weight: 800; vertical-align: 2px; }
.bd-hub-go { color: var(--bd-mut); }
.bd-hub-latest { list-style: none; margin: 0 12px 14px; padding: 6px; border-radius: 16px; background: var(--bd-pg); }
.bd-hub-latest a { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; color: var(--bd-ink); text-decoration: none; font-size: 14px; }
.bd-hub-latest a:hover { background: #fff; }
.bd-hub-latest em { flex: none; font-style: normal; font-size: 11.5px; font-weight: 800; color: var(--bd-ac); }
.bd-hub-latest span { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bd-hub-latest time { flex: none; color: var(--bd-mut); font-size: 12px; }
.bd-hub-none { margin: 0 20px 18px; color: var(--bd-mut); font-size: 13.5px; }

/* 최신글 박스 숏코드 [board_latest] 는 _latest.php 안 스타일 */

/* 모바일 — 앱처럼 ------------------------------------------------------------ */
@media (max-width: 720px) {
  .bd-hero { align-items: center; }
  .bd-ico { width: 48px; height: 48px; border-radius: 15px; font-size: 23px; }
  .bd-hero-l { gap: 12px; flex: 1; }
  .bd-desc { font-size: 13.5px; }
  .bd-tools { width: 100%; }
  .bd-search { flex: 1; } .bd-search input { width: 100%; }
  .bd-hero .bd-write { display: none; }
  .bd-tabs, .bd-regions { margin-inline: -16px; padding-inline: 16px; scroll-padding-inline: 16px; }
  .bd-tab { height: 36px; font-size: 13.5px; }
  /* 목록은 가장자리까지 · 줄 사이 얇은 선 (앱 목록) */
  .bd-lrows, .bd-rows, .bd-pins, .bd-feed, .bd-comments { margin-inline: -16px; border-radius: 0; box-shadow: none; }
  .bd-lrows { padding: 0; background: var(--bd-card); }
  .bd-lhead { display: none; }
  .bd-lrow { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "t t" "a d"; gap: 4px 8px; padding: 14px 16px; }
  .bd-lrow + .bd-lrow { border-top: 1px solid #f1f2f6; }
  .bd-lrow .bd-no, .bd-lrow .bd-views { display: none; }
  .bd-lrow .bd-lt { grid-area: t; font-size: 15.5px; }
  .bd-lrow .bd-lt > span { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .bd-lrow .bd-author { grid-area: a; font-size: 12.5px; color: var(--bd-mut); }
  .bd-lrow .bd-date { grid-area: d; font-size: 12.5px; }
  .bd-lrow.is-notice { border-radius: 0; }
  .bd-mo { display: inline-flex; }
  .bd-pins { padding: 4px 6px; }
  .bd-feed { gap: 0; background: var(--bd-card); }
  .bd-feed-item + .bd-feed-item { border-top: 8px solid var(--c-bg, #EDEDF5); }
  .bd-feed-item > a { border-radius: 0; box-shadow: none; padding: 18px 16px; gap: 14px; }
  .bd-feed-item > a:hover { transform: none; box-shadow: none; }
  .bd-feed-th { width: 84px; height: 84px; border-radius: 14px; }
  .bd-feed-item h2 { font-size: 16px; }
  .bd-rows { padding: 0; }
  .bd-row > a { padding: 16px; border-radius: 0; gap: 14px; }
  .bd-row-rg { width: 52px; height: 52px; border-radius: 14px; font-size: 13px; }
  .bd-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 12px; }
  .bd-card-th { border-radius: 14px; }
  .bd-card-t { font-size: 14.5px; }
  .bd-price { font-size: 15.5px; }
  /* 떠 있는 글쓰기 단추 — 하단 탭바가 있으면 그 위 */
  .bd-fab { display: inline-flex; align-items: center; gap: 8px; position: fixed; right: 16px; bottom: calc(20px + env(safe-area-inset-bottom)); z-index: 60; height: 54px; padding: 0 22px 0 18px; border-radius: 99px; background: var(--bd-ac); color: #fff !important; font-weight: 800; font-size: 15px; text-decoration: none; box-shadow: 0 14px 30px -8px rgba(249, 115, 22, .65); animation: bd-fab-in .45s var(--bd-ease) both; }
  .bd-fab svg { width: 20px; height: 20px; }
  body:has(.enm-bar) .bd-fab { bottom: calc(86px + env(safe-area-inset-bottom)); }
  /* 글 보기 */
  .bd-read { gap: 12px; }
  .bd-post { margin-inline: -16px; padding: 22px 16px 26px; border-radius: 0; box-shadow: none; }
  .bd-gal { margin: -22px -16px 20px; border-radius: 0; }
  .bd-gal-item { aspect-ratio: 1; }
  .bd-gal-item img { object-fit: cover; }
  .bd-comments { padding: 20px 16px; }
  .bd-cform { position: sticky; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 5; box-shadow: 0 10px 30px rgba(28, 28, 40, .12); background: #fff; }
  body:has(.enm-bar) .bd-cform { bottom: calc(84px + env(safe-area-inset-bottom)); }
  .bd-nav a { height: 38px; padding: 0 14px; font-size: 13px; }
  .bd-buybar { display: flex; align-items: center; justify-content: space-between; gap: 12px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 61; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .96); backdrop-filter: blur(12px); box-shadow: 0 -1px 0 rgba(28, 28, 40, .08); }
  .bd-buybar span { display: flex; flex-direction: column; } .bd-buybar small { font-size: 11.5px; color: var(--bd-mut); } .bd-buybar b { font-size: 18px; font-weight: 800; }
  .bd-buy { display: inline-flex; align-items: center; height: 46px; padding: 0 22px; border-radius: 14px; background: var(--bd-ac); color: #fff !important; font-weight: 800; text-decoration: none; }
  body:has(.bd-buybar) .enm-bar { display: none; }
  body:has(.bd-buybar) { padding-bottom: calc(80px + env(safe-area-inset-bottom)) !important; }
  .bd-hub-grid { grid-template-columns: 1fr; gap: 12px; }
  .bd-files { padding: 14px; }
  .bd-file-dl span { display: none; } .bd-file-dl { width: 36px; padding: 0; justify-content: center; }
  .bd-body .bdx-cols, .bd-body .bdx-cards { grid-template-columns: 1fr; }
  .bd-body .bdx-form { padding: 20px 16px; }
  .bd-faq-item .bd-body { padding: 0 18px 18px; }
}
@keyframes bd-fab-in { from { opacity: 0; transform: translateY(20px) scale(.9); } to { opacity: 1; transform: none; } }

/* ── 프리미엄 쓰기 창 (.bdc) ─────────────────────────────────────────────── */
.bdc { --bdc-ac: var(--c-accent, #f97316); --bdc-ink: var(--c-text, #1c1c28); --bdc-mut: var(--c-muted, #8a90a2); --bdc-pg: #f4f4f9; --bdc-ease: cubic-bezier(.2, .8, .2, 1); }
.bdc svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.bdc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bdc--modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 24px; }
.bdc--modal[hidden] { display: none; }
.bdc-backdrop { position: absolute; inset: 0; background: rgba(20, 20, 32, .45); backdrop-filter: blur(4px); opacity: 0; transition: opacity .28s; }
.bdc--modal.is-open .bdc-backdrop { opacity: 1; }
.bdc-sheet { position: relative; display: flex; flex-direction: column; width: min(620px, 100%); max-height: min(860px, calc(100dvh - 48px)); margin: 0; border-radius: 28px; background: #fff; color: var(--bdc-ink); box-shadow: 0 40px 100px rgba(20, 20, 32, .3); overflow: hidden; }
.bdc--modal .bdc-sheet { transform: translateY(24px) scale(.98); opacity: 0; transition: transform .35s var(--bdc-ease), opacity .25s; }
.bdc--modal.is-open .bdc-sheet { transform: none; opacity: 1; }
.bdc--page .bdc-backdrop { display: none; }
.bdc--page .bdc-sheet { margin: 0 auto; max-height: none; box-shadow: 0 18px 50px rgba(28, 28, 40, .1); }
.bdc-grab { display: none; }
.bdc-head { display: flex; align-items: center; gap: 12px; padding: 16px 16px 12px 12px; border-bottom: 1px solid #f1f2f6; }
.bdc-x { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border: 0; border-radius: 50%; background: none; color: var(--bdc-ink); cursor: pointer; text-decoration: none; }
.bdc-x:hover { background: var(--bdc-pg); }
.bdc-ttl { flex: 1; min-width: 0; text-align: center; }
.bdc-ttl p { margin: 0; font-size: 11.5px; font-weight: 700; color: var(--bdc-mut); letter-spacing: .02em; }
.bdc-ttl h2 { margin: 1px 0 0; font-size: 17px; font-weight: 800; letter-spacing: -.3px; }
.bdc-done { flex: none; height: 38px; padding: 0 16px; border: 0; border-radius: 99px; background: var(--bdc-ac); color: #fff; font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; transition: opacity .15s, transform .15s; }
.bdc-done:active { transform: scale(.95); }
.bdc-body { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 18px 22px 8px; -webkit-overflow-scrolling: touch; }
.bdc-draft { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; background: #fff7ef; color: #9a4a10; font-size: 13px; font-weight: 600; }
.bdc-draft[hidden] { display: none; }
.bdc-draft button { border: 0; background: none; color: inherit; font: inherit; font-weight: 800; text-decoration: underline; cursor: pointer; }
/* 사진 칸 */
.bdc-photos { display: flex; gap: 10px; overflow-x: auto; padding: 4px 2px 8px; margin: 0 -2px; scrollbar-width: none; }
.bdc-photos::-webkit-scrollbar { display: none; }
.bdc-add { flex: none; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 78px; height: 78px; border-radius: 16px; background: var(--bdc-pg); color: var(--bdc-mut); cursor: pointer; box-shadow: inset 0 0 0 1.5px #e2e4ec; transition: background-color .15s, color .15s; }
.bdc-add:hover { background: #fff1e6; color: var(--bdc-ac); box-shadow: inset 0 0 0 1.5px var(--bdc-ac); }
.bdc-add input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.bdc-add svg { width: 24px; height: 24px; stroke-width: 1.8; }
.bdc-add span { font-size: 12px; font-weight: 600; } .bdc-add b { color: var(--bdc-ac); }
.bdc-plist { display: flex; gap: 10px; list-style: none; margin: 0; padding: 0; }
.bdc-ph { flex: none; position: relative; width: 78px; height: 78px; border-radius: 16px; overflow: visible; animation: bdc-pop .3s var(--bdc-ease); }
.bdc-ph img { width: 100%; height: 100%; object-fit: cover; border-radius: 16px; display: block; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .05); }
.bdc-ph:first-child::after { content: "대표 사진"; position: absolute; left: 0; right: 0; bottom: 0; padding: 3px 0; border-radius: 0 0 16px 16px; background: rgba(20, 20, 32, .72); color: #fff; font-size: 10.5px; font-weight: 700; text-align: center; }
.bdc-ph.is-busy img { opacity: .5; }
.bdc-ph.is-busy::before { content: ""; position: absolute; left: 50%; top: 50%; width: 22px; height: 22px; margin: -11px; border-radius: 50%; border: 2.5px solid #fff; border-top-color: var(--bdc-ac); animation: bdc-spin .8s linear infinite; z-index: 1; }
.bdc-rm { position: absolute; top: -7px; right: -7px; z-index: 2; display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 2px solid #fff; border-radius: 50%; background: #2b2b3a; color: #fff; cursor: pointer; }
.bdc-rm svg { width: 12px; height: 12px; stroke-width: 3; }
.bdc-hint { margin: 2px 0 14px; font-size: 12px; color: var(--bdc-mut); }
@keyframes bdc-pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes bdc-spin { to { transform: rotate(360deg); } }
/* 제목 · 본문 */
.bdc-title { display: block; width: 100%; box-sizing: border-box; padding: 12px 2px; border: 0; border-bottom: 1px solid #eef0f4; outline: 0; background: none; font: inherit; font-size: 20px; font-weight: 800; letter-spacing: -.4px; color: inherit; }
.bdc-title::placeholder, .bdc-text::placeholder { color: #b4b8c6; font-weight: inherit; }
.bdc-title:focus { border-bottom-color: var(--bdc-ac); }
.bdc-text { display: block; width: 100%; box-sizing: border-box; min-height: 180px; padding: 16px 2px; border: 0; outline: 0; background: none; font: inherit; font-size: 16px; line-height: 1.75; color: inherit; resize: none; }
/* 종류 칸 */
.bdc-fields { display: grid; gap: 16px; padding: 16px 0 6px; border-bottom: 1px solid #eef0f4; }
.bdc-field { display: grid; gap: 8px; }
.bdc-fl { font-size: 12.5px; font-weight: 700; color: var(--bdc-mut); }
.bdc-chips { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 2px; margin: -2px; }
.bdc-chips::-webkit-scrollbar { display: none; }
.bdc-chips label { flex: none; position: relative; }
.bdc-chips input, .bdc-seg input { position: absolute; opacity: 0; pointer-events: none; }
.bdc-chips span { display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 99px; background: var(--bdc-pg); font-size: 13.5px; font-weight: 600; cursor: pointer; transition: background-color .15s, color .15s, box-shadow .15s; }
.bdc-chips input:checked + span { background: #fff1e6; color: var(--bdc-ac); box-shadow: inset 0 0 0 1.5px var(--bdc-ac); font-weight: 800; }
.bdc-chips input:focus-visible + span, .bdc-seg input:focus-visible + span { outline: 2px solid var(--bdc-ac); outline-offset: 2px; }
.bdc-won { display: flex; align-items: center; gap: 8px; height: 52px; padding: 0 16px; border-radius: 14px; background: var(--bdc-pg); transition: box-shadow .15s, background-color .15s; }
.bdc-won:focus-within { background: #fff; box-shadow: 0 0 0 2px var(--bdc-ac); }
.bdc-won i { font-style: normal; font-weight: 800; color: var(--bdc-mut); }
.bdc-won input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 18px; font-weight: 800; color: inherit; }
.bdc-won small { flex: none; font-size: 12.5px; font-weight: 700; color: var(--bdc-ac); }
.bdc-won.is-off { opacity: .45; }
.bdc-seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 4px; border-radius: 14px; background: var(--bdc-pg); }
.bdc-seg label { position: relative; }
.bdc-seg span { display: grid; place-items: center; height: 38px; border-radius: 11px; font-size: 13.5px; font-weight: 700; color: var(--bdc-mut); cursor: pointer; transition: background-color .2s, color .2s, box-shadow .2s; }
.bdc-seg input:checked + span { background: #fff; color: var(--bdc-ink); box-shadow: 0 2px 10px rgba(28, 28, 40, .1); }
/* 스위치 */
.bdc-switch { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; cursor: pointer; user-select: none; }
.bdc-switch input { position: absolute; opacity: 0; pointer-events: none; }
.bdc-switch i { flex: none; position: relative; width: 42px; height: 26px; border-radius: 99px; background: #d9dce5; transition: background-color .2s; }
.bdc-switch i::after { content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, .18); transition: transform .25s var(--bdc-ease); }
.bdc-switch input:checked + i { background: var(--bdc-ac, #f97316); }
.bdc-switch input:checked + i::after { transform: translateX(16px); }
.bdc-switch input:focus-visible + i { outline: 2px solid var(--bdc-ac, #f97316); outline-offset: 2px; }
.bdc-switch--sm { font-size: 13px; } .bdc-switch--sm i { width: 36px; height: 22px; } .bdc-switch--sm i::after { width: 16px; height: 16px; } .bdc-switch--sm input:checked + i::after { transform: translateX(14px); }
/* 일반 첨부 */
.bdc-files { display: flex; flex-direction: column; gap: 8px; padding-bottom: 8px; }
.bdc-files:empty { display: none; }
.bdc-file { position: relative; display: flex; align-items: center; gap: 10px; padding: 8px 12px 8px 8px; border-radius: 14px; background: var(--bdc-pg); }
.bdc-fk { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: #D9E8F5; font-size: 10.5px; font-weight: 800; }
.bdc-fn { flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: 13.5px; font-weight: 600; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bdc-fn small { color: var(--bdc-mut); font-weight: 500; font-size: 12px; }
.bdc-file .bdc-rm { position: static; border: 0; }
/* 아래 바 */
.bdc-foot { padding: 10px 16px 16px; border-top: 1px solid #f1f2f6; background: #fff; }
.bdc-tools { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.bdc-tool { display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 12px; background: var(--bdc-pg); color: var(--bdc-ink); cursor: pointer; }
.bdc-tool:hover { background: #fff1e6; color: var(--bdc-ac); }
.bdc-grow { flex: 1; }
.bdc-saved { font-size: 12px; color: #16a34a; font-weight: 600; opacity: 0; transition: opacity .3s; }
.bdc-saved.is-on { opacity: 1; }
.bdc-len { font-size: 12px; color: var(--bdc-mut); } .bdc-len b { font-weight: 700; color: var(--bdc-ink); }
.bdc-submit { display: flex; align-items: center; justify-content: center; width: 100%; height: 54px; border: 0; border-radius: 16px; background: var(--bdc-ac); color: #fff; font: inherit; font-size: 16px; font-weight: 800; cursor: pointer; box-shadow: 0 12px 26px -12px rgba(249, 115, 22, .8); transition: transform .15s, filter .15s; }
.bdc-submit:hover { filter: brightness(1.04); } .bdc-submit:active { transform: scale(.985); }
.bdc-submit[disabled], .bdc-done[disabled] { opacity: .6; cursor: wait; }
.bdc-submit.is-busy span::before { content: ""; display: inline-block; width: 16px; height: 16px; margin-right: 8px; vertical-align: -3px; border-radius: 50%; border: 2.5px solid rgba(255, 255, 255, .45); border-top-color: #fff; animation: bdc-spin .8s linear infinite; }
.bdc-toast { position: absolute; left: 50%; bottom: 140px; z-index: 5; max-width: calc(100% - 40px); margin: 0; padding: 12px 18px; border-radius: 14px; background: #1f1f2e; color: #fff; font-size: 14px; font-weight: 600; transform: translateX(-50%); box-shadow: 0 14px 40px rgba(0, 0, 0, .25); animation: bdc-toast .3s var(--bdc-ease); }
.bdc-toast[hidden] { display: none; }
.bdc .is-shake { animation: bdc-shake .4s; }
@keyframes bdc-toast { from { opacity: 0; transform: translate(-50%, 10px); } to { opacity: 1; transform: translate(-50%, 0); } }
@keyframes bdc-shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
html.bdc-lock, html.bdc-lock body { overflow: hidden; }
.bd-compose-wrap { max-width: 720px; }

/* 모바일: 아래에서 올라오는 전체 화면 시트 */
@media (max-width: 720px) {
  .bdc--modal { padding: 0; align-items: flex-end; }
  .bdc--modal .bdc-sheet { width: 100%; height: calc(100dvh - 10px); max-height: none; border-radius: 24px 24px 0 0; transform: translateY(100%); opacity: 1; transition: transform .42s var(--bdc-ease); }
  .bdc--modal.is-open .bdc-sheet { transform: none; }
  .bdc--modal.is-drag .bdc-sheet { transition: none; }
  .bdc-grab { display: block; position: absolute; left: 50%; top: 7px; width: 40px; height: 5px; margin-left: -20px; border-radius: 99px; background: #d9dce5; z-index: 2; }
  .bdc-head { padding: 18px 12px 10px 6px; touch-action: none; }
  .bdc-body { padding: 14px 16px 8px; }
  .bdc-foot { padding: 8px 14px calc(12px + env(safe-area-inset-bottom)); }
  .bdc-submit { height: 52px; }
  .bdc--page { margin: -20px -16px 0; }
  .bdc--page .bdc-sheet { border-radius: 0; box-shadow: none; min-height: calc(100dvh - 140px); }
  .bdc-toast { bottom: 120px; }
}
@media (prefers-reduced-motion: reduce) {
  .bdc-sheet, .bdc-backdrop, .bd-fab, .bdc-ph { transition: none !important; animation: none !important; }
}
