/* 피드형 화면(look=feed) — 2026-10-31 사용자: 조건 보드형과 같은 부품·같은 차례를 버리고 이 화면만의 구성·정보 구조·시각 언어로 전부 새로.
   생각: '오늘의 장부'. 사진·유리 카드·둥근 알약 대신 종이 장부처럼 — 가는 괘선, 모노 숫자, 큰 제목, 네모진 칸. 색은 로고(주황 원)에 맞춘 따뜻한 회색 바탕 하나와 주황 하나.
   주황은 '받기'와 '실시간 신호'에만 쓰고, 찾기·메뉴 같은 보통 단추는 글자색(먹)으로 — 화면이 시끄럽지 않게.
   첫 화면 = 마스트헤드(날짜·시각·오늘 수) · 제목+검색 | 엑셀 주문서 · 오늘 바로 받는 묶음 · 24시간 시간표 · 들어오는 업체 장부 + 오늘 지역·분야 순위 · 다섯 자료 한 줄 · 이용권 한 줄.
   목록 = [장부형 리스트/카드 | 오른쪽 받기 칸(지금 조건 → 엑셀, 담아 두기)]. 조건·업체 정보는 오른쪽에서 나오는 판.
   틀: PC 왼쪽 세로 메뉴(views/_fd_side.php) · 휴대폰 아래 탭 + 위 작은 막대(_fd_mtop.php) · 바닥(_fd_foot.php). 창 밖 화면(이용권·고객센터·내 정보…)은 assets/feed-pages.css.
   assets/line.css 위에 덮는다(칸 이름·id 는 line.js 가 쓰는 그대로). 색은 모두 :root 토큰 — 기본 다크, 손님이 라이트로 바꿀 수 있다 */
:root {
  /* 라이트: 따뜻한 종이 */
  --bg: #f4f1ec; --sf: #fffdfa; --sf2: #f0ece5; --sf3: #e6e0d6;
  --ln: #e2dcd2; --ln2: #cdc5b8;
  --tx: #1b1916; --mu: #5e5850; --mu2: #8e867b;
  --ac: #c24300; --ac-h: #9e3600; --ac-t: #fcebe0; --ac-t2: #f6d3bf; --ac-tx: #ffffff;
  --btn: #ff5500; --btn-h: #e64c00; --btn-tx: #ffffff;
  --ok: #1f8a4c; --ok-t: #e1f3e8; --warn: #96580a; --warn-t: #fbefd8; --bad: #c0362b; --bad-t: #fbe7e4;
  --deep: #1b1916; --deep-tx: #f4f1ec; --deep-mu: #a9a196;   /* 어두운 강조 칸 (첫 방문 안내·이용권 띠) */
  --sh: 0 1px 2px rgb(27 25 22 / 5%); --sh2: 0 10px 30px -12px rgb(27 25 22 / 25%); --sh3: 0 24px 60px rgb(27 25 22 / 28%);
  --ring: 0 0 0 3px var(--ac-t2);
  --cb: var(--ln); --seg-on: #fffdfa;
  --mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --r: 8px; --r-sm: 5px;   /* line.css 창·단추의 모서리를 덜 둥글게 */
  --fd-w: 1480px; --fd-side: 224px; --fd-rail: 300px; --fd-tab: 0px;
  --top: 0px; --bar: 0px;
  --fd-heat: var(--btn);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #121110; --sf: #1a1816; --sf2: #211f1c; --sf3: #2b2824;
    --ln: #2a2724; --ln2: #3d3832;
    --tx: #f1ece4; --mu: #aba398; --mu2: #7a7268;
    --ac: #ff8a4c; --ac-h: #ffa471; --ac-t: #2d1c12; --ac-t2: #4b2a17; --ac-tx: #121110;
    --btn: #ff5a0a; --btn-h: #ff7433; --btn-tx: #ffffff;
    --ok: #52cb8c; --ok-t: #13301f; --warn: #ebb04b; --warn-t: #302410; --bad: #ff8c80; --bad-t: #371b19;
    --deep: #0b0a09; --deep-tx: #f1ece4; --deep-mu: #8f877c;
    --sh: 0 1px 2px rgb(0 0 0 / 40%); --sh2: 0 12px 30px -10px rgb(0 0 0 / 60%); --sh3: 0 24px 60px rgb(0 0 0 / 65%);
    --cb: var(--ln); --seg-on: #2b2824;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #121110; --sf: #1a1816; --sf2: #211f1c; --sf3: #2b2824;
  --ln: #2a2724; --ln2: #3d3832;
  --tx: #f1ece4; --mu: #aba398; --mu2: #7a7268;
  --ac: #ff8a4c; --ac-h: #ffa471; --ac-t: #2d1c12; --ac-t2: #4b2a17; --ac-tx: #121110;
  --btn: #ff5a0a; --btn-h: #ff7433; --btn-tx: #ffffff;
  --ok: #52cb8c; --ok-t: #13301f; --warn: #ebb04b; --warn-t: #302410; --bad: #ff8c80; --bad-t: #371b19;
  --deep: #0b0a09; --deep-tx: #f1ece4; --deep-mu: #8f877c;
  --sh: 0 1px 2px rgb(0 0 0 / 40%); --sh2: 0 12px 30px -10px rgb(0 0 0 / 60%); --sh3: 0 24px 60px rgb(0 0 0 / 65%);
  --cb: var(--ln); --seg-on: #2b2824;
  color-scheme: dark;
}
@media (min-width: 2200px) { :root { --fd-w: 1760px; --fd-side: 248px; --fd-rail: 340px; } body.fd { font-size: 16px; } .fd-h1 { font-size: 64px; } .fd-hero-g { grid-template-columns: minmax(0, 1fr) 440px; } }   /* 3840 같은 넓은 화면: 틀만 조금 넓히고 글자를 한 단계 키운다 — 늘어지지 않게 */

/* ===== 바탕 ===== */
body.fd { background: var(--bg); color: var(--tx); }
.fd a { color: inherit; }
.fd-w { width: 100%; max-width: var(--fd-w); margin-inline: auto; padding-inline: 32px; box-sizing: border-box; }
.fd-pulse { position: relative; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--btn); }
@media (prefers-reduced-motion: no-preference) { .fd-pulse { animation: fd-pulse 1.8s ease-out infinite; } }
@keyframes fd-pulse { 0% { box-shadow: 0 0 0 0 rgb(255 85 0 / 50%); } 70% { box-shadow: 0 0 0 7px rgb(255 85 0 / 0%); } 100% { box-shadow: 0 0 0 0 rgb(255 85 0 / 0%); } }
.fd-mono, .fd-n b, .fd-ws-n b { font-family: var(--mono); font-variant-numeric: tabular-nums; }
/* 단추: 보통은 먹색 테두리(ghost), 받기는 주황(pri) */
.fd-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 44px; padding: 0 18px; border: 1px solid var(--tx); border-radius: var(--r-sm); background: transparent; color: var(--tx); font: inherit; font-size: 14.5px; font-weight: 700; text-decoration: none; cursor: pointer; transition: background .12s, color .12s, border-color .12s; }
.fd a.fd-btn { color: var(--tx); }
.fd-btn:hover { background: var(--tx); color: var(--bg); }
.fd-btn.pri, .fd a.fd-btn.pri { border-color: var(--btn); background: var(--btn); color: var(--btn-tx); }
.fd-btn.pri:hover { border-color: var(--btn-h); background: var(--btn-h); }
.fd-btn.soft, .fd a.fd-btn.soft { border-color: var(--ln2); color: var(--mu); }
.fd-btn.soft:hover { border-color: var(--tx); background: transparent; color: var(--tx); }
.fd-btn:disabled { opacity: .45; cursor: default; }
.fd-btn:disabled:hover { background: transparent; color: var(--tx); }
.fd-btn.pri:disabled:hover { background: var(--btn); color: var(--btn-tx); }
.fd-btn:focus-visible { outline: 2px solid var(--ac); outline-offset: 2px; }
.fd-btn svg { width: 17px; height: 17px; }
/* 작은 이름표: 모노 숫자·구분 이름 */
.fd-tag { display: inline-flex; align-items: center; gap: 6px; color: var(--mu2); font-family: var(--mono); font-size: 11.5px; letter-spacing: .06em; }
.fd-sh { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 20px; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid var(--tx); }
.fd-sh h2 { margin: 0; font-size: 18px; font-weight: 800; letter-spacing: -.025em; }
.fd-sh h2 small { margin-left: 8px; color: var(--mu2); font-family: var(--mono); font-size: 11.5px; font-weight: 500; letter-spacing: .06em; }
.fd-sh p { margin: 3px 0 0; color: var(--mu); font-size: 13px; line-height: 1.5; }
.fd-sh > a, .fd-more { flex: none; color: var(--mu); font-size: 13px; font-weight: 700; text-decoration: none; border-bottom: 1px solid var(--ln2); padding-bottom: 1px; }
.fd .fd-sh > a:hover, .fd .fd-more:hover { color: var(--ac); border-color: var(--ac); }

/* 예전 화면으로 띠 */
.fd-old { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 14px; padding: 7px 16px; border-bottom: 1px solid var(--ln); background: var(--sf2); color: var(--mu); font-size: 12.5px; }
.fd-old a { flex: none; color: var(--tx); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.fd-old a:hover { color: var(--ac); }

/* ===== 틀: [왼쪽 메뉴 | 본문] ===== */
.fd-app { display: grid; grid-template-columns: var(--fd-side) minmax(0, 1fr); min-height: 100vh; }
.fd-main { min-width: 0; display: flex; flex-direction: column; }
.fd-main > .ff { margin-top: auto; }
.fd-side { position: sticky; top: 0; z-index: 40; display: flex; flex-direction: column; height: 100vh; height: 100dvh; padding: 22px 14px 16px; box-sizing: border-box; overflow-y: auto; scrollbar-width: none; border-right: 1px solid var(--ln); background: var(--bg); color: var(--tx); }
.fd-side::-webkit-scrollbar { display: none; }
.fd-logo { display: flex; align-items: center; gap: 11px; padding: 0 8px 20px; color: var(--tx); text-decoration: none; }
.fd .fd-logo { color: var(--tx); }
.fd-logo svg { flex: none; width: 36px; height: 36px; display: block; }
.fd-logo span { font-size: 17px; font-weight: 850; letter-spacing: -.03em; }
.fd-lbl { display: block; margin: 14px 0 4px; padding: 0 10px; color: var(--mu2); font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; }
.fd-its { display: grid; gap: 2px; }
.fd-its > .fd-lbl:first-child { margin-top: 0; }
.fd-it { position: relative; display: flex; align-items: center; gap: 11px; height: 40px; padding: 0 10px; border-radius: var(--r-sm); color: var(--mu); font-size: 14px; font-weight: 600; text-decoration: none; transition: background .12s, color .12s; }
.fd .fd-side a.fd-it { color: var(--mu); }
.fd-it i { display: grid; place-items: center; flex: none; width: 22px; height: 22px; color: inherit; }
.fd-it i svg { width: 20px; height: 20px; }
.fd-it:hover, .fd .fd-side a.fd-it:hover { background: var(--sf2); color: var(--tx); }
.fd-it.on, .fd .fd-side a.fd-it.on { background: var(--sf2); color: var(--tx); box-shadow: inset 3px 0 0 var(--btn); }
.fd-it.on i { color: var(--ac); }
.fd-it span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fd-it small { flex: none; color: var(--ac); font-family: var(--mono); font-size: 11px; font-weight: 500; }
.fd-it.fd-sub { height: 32px; padding-left: 43px; font-size: 13px; font-weight: 500; }   /* '업체 찾기' 아래 DB 종류 (사이트 설정 cat_pages) — 그림 자리만큼 안으로 */
.fd-it.fd-sub::before { content: ''; position: absolute; left: 21px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--ln2); }
.fd-it.fd-sub.on::before { background: var(--btn); }
.fd-cnt { flex: none; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--btn); color: #ffffff; font-family: var(--mono); font-size: 11px; font-weight: 500; line-height: 20px; text-align: center; box-sizing: border-box; }
.fd-cnt[hidden] { display: none; }
.fd-only-m { display: none; }
.fd-side-f { margin-top: auto; display: grid; gap: 8px; padding-top: 14px; border-top: 1px solid var(--ln); }
.fd-side-f form { display: contents; }
.fd-pulsebox { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border-radius: var(--r-sm); color: var(--mu); text-decoration: none; }
.fd .fd-pulsebox { color: var(--mu); }
.fd-pulsebox:hover { background: var(--sf2); }
.fd-pulsebox small { flex: 1; font-size: 12.5px; font-weight: 600; }
.fd-pulsebox b { color: var(--tx); font-family: var(--mono); font-size: 14px; font-weight: 500; }
.fd-theme { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 36px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: transparent; color: var(--mu); font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.fd-theme:hover { border-color: var(--tx); color: var(--tx); }
.fd-theme svg { width: 15px; height: 15px; }
.fd-theme em { font-style: normal; }
.fd-theme span, .fd-mic span { display: inline-grid; }
.fd-theme .i-sun, :root[data-theme="dark"] .fd-theme .i-moon, .fd-mic .i-sun, :root[data-theme="dark"] .fd-mic .i-moon { display: none; }
:root[data-theme="dark"] .fd-theme .i-sun, :root[data-theme="dark"] .fd-mic .i-sun { display: inline-grid; }
.fd-me { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: var(--r-sm); color: var(--tx); font-size: 13.5px; font-weight: 700; text-decoration: none; }
.fd .fd-side a.fd-me { color: var(--tx); }
.fd-me i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--sf3); color: var(--mu); }
.fd-me i svg { width: 16px; height: 16px; }
.fd-me:hover { background: var(--sf2); }
.fd-me.on i { background: var(--btn); color: #ffffff; }
.fd-sl { padding: 5px 10px; border: 0; background: none; color: var(--mu); font: inherit; font-size: 12.5px; font-weight: 600; text-align: left; text-decoration: none; cursor: pointer; }
.fd .fd-side a.fd-sl { color: var(--mu); }
.fd-sl:hover, .fd .fd-side a.fd-sl:hover { color: var(--tx); }
.fd-join { display: grid; place-items: center; height: 38px; border-radius: var(--r-sm); background: var(--tx); color: var(--bg); font-size: 13.5px; font-weight: 800; text-decoration: none; }
.fd .fd-side a.fd-join { color: var(--bg); }
.fd-join:hover { background: var(--ac); color: #ffffff; }
.fd-reg { display: grid; place-items: center; height: 36px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: transparent; color: var(--tx); font-size: 13px; font-weight: 700; text-decoration: none; }
.fd .fd-side a.fd-reg { color: var(--tx); }
.fd-reg:hover, .fd .fd-side a.fd-reg:hover { border-color: var(--ac); color: var(--ac); }
.fd-side a:focus-visible, .fd-side button:focus-visible { outline: 2px solid var(--ac); outline-offset: 2px; }
.fd-mtop { display: none; }
.fd-dot { display: none; }

/* ===== 머리: 첫 화면(.big) = 마스트헤드 · 제목+검색 | 엑셀 주문서 / 목록 = 얇은 검색 줄 ===== */
.fd .ln-search.fd-hero { padding: 0; border: 0; background: none; }
.fd-hero-in { display: grid; padding-block: 14px 2px; }
.fd .fd-hero .ln-q.fd-q { max-width: 760px; height: 46px; margin: 0; padding-left: 14px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); box-shadow: none; }
.fd .fd-hero .ln-q.fd-q:focus-within { border-color: var(--tx); box-shadow: none; }
.fd .fd-hero .ln-q.fd-q svg { color: var(--mu2); }
.fd .fd-hero .ln-q.fd-q > button { border-radius: 3px; background: var(--tx); color: var(--bg); font-weight: 800; }
.fd .fd-hero .ln-q.fd-q > button:hover { background: var(--ac); color: #ffffff; }
.fd .ln-sug { border-radius: var(--r-sm); }
.fd-mast, .fd-ws { display: none; }
.fd-hero.big .fd-hero-in { padding-block: 0 0; }
.fd-hero:not(.big) .fd-hero-g { grid-template-columns: minmax(0, 1fr); gap: 0; padding-block: 12px 4px; }   /* 목록: 검색 줄만 */
.fd-hero.big .fd-mast { display: flex; }
.fd-mast { flex-wrap: wrap; align-items: center; gap: 6px 18px; padding: 16px 0 12px; border-bottom: 1px solid var(--ln); color: var(--mu); font-size: 12.5px; }
.fd-date { color: var(--tx); font-weight: 700; }
.fd-clock { padding: 1px 7px; border: 1px solid var(--ln2); border-radius: 4px; color: var(--tx); font-family: var(--mono); font-size: 12.5px; letter-spacing: .04em; }
.fd-livetag { display: inline-flex; align-items: center; gap: 7px; color: var(--ac); font-weight: 700; }
.fd-mast-n { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-left: auto; }
.fd-mast-n a { color: var(--mu); text-decoration: none; }
.fd-mast-n a:hover { color: var(--ac); }
.fd-mast-n b { margin: 0 1px 0 4px; color: var(--tx); font-family: var(--mono); font-size: 13.5px; font-weight: 500; }
.fd-mast-n b.wait { opacity: .4; }
.fd-hero-g { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 40px 56px; align-items: center; padding-block: 40px 44px; }
.fd-hero.big .fd-ws { display: grid; }
.fd-h1 { margin: 0; font-size: clamp(34px, 3.6vw, 56px); font-weight: 850; line-height: 1.08; letter-spacing: -.045em; text-wrap: balance; word-break: keep-all; }
.fd-sh h2, .fd-tk b, .fd-bl b { word-break: keep-all; }
.fd-h1 em { font-style: normal; color: var(--ac); }
.fd-h1[hidden] { display: none; }
.fd-lead { margin: 14px 0 28px; max-width: 40em; color: var(--mu); font-size: 16.5px; line-height: 1.6; }
.fd .fd-hero.big .ln-q.fd-q { max-width: 640px; height: 58px; padding: 0 6px 0 18px; border: 1px solid var(--ln2); border-bottom: 2px solid var(--tx); border-radius: var(--r-sm) var(--r-sm) 2px 2px; background: var(--sf); }
.fd .fd-hero.big .ln-q.fd-q:focus-within { border-color: var(--tx); }
.fd .fd-hero.big .ln-q.fd-q svg { width: 22px; height: 22px; color: var(--mu2); }
.fd .fd-hero.big .ln-q.fd-q input { font-size: 17px; }
.fd .fd-hero.big .ln-q.fd-q > button { padding: 0 24px; font-size: 15.5px; }
/* 많이 찾는 말: 알약 대신 점선 밑줄 글자 */
.fd .fd-ex.ln-ex { justify-content: flex-start; align-items: baseline; max-width: 640px; margin: 14px 0 0; gap: 2px 14px; color: var(--mu2); font-size: 13px; }
.fd .fd-ex.ln-ex > span { margin-right: 2px; font-family: var(--mono); font-size: 11.5px; letter-spacing: .06em; }
.fd .fd-ex.ln-ex a { height: auto; padding: 0; border: 0; border-radius: 0; background: none; color: var(--tx); font-size: 14px; font-weight: 600; text-decoration: underline dotted var(--ln2); text-underline-offset: 5px; text-decoration-thickness: 1.5px; }
.fd .fd-ex.ln-ex a:hover { color: var(--ac); text-decoration-color: var(--ac); background: none; }
/* 엑셀 주문서 (첫 화면 오른쪽) — 지역·분야·기간·연락처를 고르면 몇 곳인지 바로 세고, 목록 보기·엑셀로 받기 (assets/feed.js ws) */
.fd-ws { gap: 12px; padding: 18px 20px 20px; border: 1px solid var(--ln2); border-top: 3px solid var(--btn); border-radius: var(--r-sm); background: var(--sf); }
.fd-ws-h { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.fd-ws-h b { font-size: 16px; font-weight: 800; letter-spacing: -.02em; }
.fd-ws-h small { color: var(--mu2); font-size: 12px; font-weight: 600; }
.fd-ws-r { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 10px; align-items: center; }
.fd-ws-r > span { color: var(--mu2); font-size: 12.5px; font-weight: 700; }
.fd-ws select { width: 100%; height: 38px; padding: 0 30px 0 10px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf) var(--chev) no-repeat right 8px center / 16px; color: var(--tx); font: inherit; font-size: 14px; font-weight: 600; appearance: none; -webkit-appearance: none; }
.fd-ws select:focus { outline: 0; border-color: var(--tx); }
.fd-ws select.on { border-color: var(--ac); color: var(--ac); }
.fd-seg { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--ln2); border-radius: var(--r-sm); overflow: hidden; }
.fd-seg button { height: 34px; padding: 0 12px; border: 0; border-left: 1px solid var(--ln2); background: transparent; color: var(--mu); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.fd-seg button:first-child { border-left: 0; }
.fd-seg button:hover { color: var(--tx); }
.fd-seg button[aria-pressed="true"] { background: var(--tx); color: var(--bg); }
.fd-seg.multi button[aria-pressed="true"] { background: var(--ac-t); color: var(--ac); }
.fd-seg button:focus-visible { outline: 2px solid var(--ac); outline-offset: -2px; }
.fd-ws-n { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: 6px; padding-top: 14px; border-top: 1px dashed var(--ln2); }
.fd-ws-n span { color: var(--mu); font-size: 13px; }
.fd-ws-n b { font-size: 32px; font-weight: 500; letter-spacing: -.03em; }
.fd-ws-n b.wait { opacity: .35; }
.fd-ws-n small { margin-left: 2px; color: var(--mu); font-size: 14px; }
.fd-ws-acts { display: grid; grid-template-columns: 1fr 1.3fr; gap: 8px; }
.fd-ws-note { margin: 0; color: var(--mu2); font-size: 12px; line-height: 1.5; }
.fd-ws-note b { color: var(--mu); font-weight: 600; }

/* ===== 첫 화면 칸들 ===== */
.fd-land { display: grid; gap: 40px; padding-block: 0 56px; }
.fd-land[hidden] { display: none; }
.fd-sec { min-width: 0; }
/* 오늘 바로 받는 묶음 */
.fd-bl { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; }
.fd-bl a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 14px; align-items: center; min-height: 68px; padding: 12px 16px; border: 1px solid var(--ln); border-radius: var(--r-sm); background: var(--sf); color: var(--tx); text-decoration: none; transition: border-color .12s; }
.fd-bl a:hover { border-color: var(--tx); }
.fd-bl i { grid-column: 1; color: var(--mu2); font-family: var(--mono); font-size: 11px; font-style: normal; letter-spacing: .08em; }
.fd-bl b { grid-column: 1; overflow: hidden; font-size: 15px; font-weight: 700; letter-spacing: -.01em; text-overflow: ellipsis; white-space: nowrap; }
.fd-bl em { grid-column: 2; grid-row: 1 / 3; color: var(--tx); font-family: var(--mono); font-size: 20px; font-style: normal; font-weight: 500; letter-spacing: -.02em; }
.fd-bl em small { margin-left: 1px; color: var(--mu); font-size: 12px; }
.fd-bl em.wait { opacity: .35; }
.fd-bl .none { grid-column: 1 / -1; padding: 14px 4px; color: var(--mu); font-size: 14px; }
/* 24시간 시간표: 칸 24개, 많을수록 진하게, 지금 칸은 주황 테두리 */
.fd-hsum { display: flex; align-items: baseline; gap: 8px; color: var(--mu); font-size: 13px; }
.fd-hsum b { color: var(--tx); font-family: var(--mono); font-size: 20px; font-weight: 500; }
.fd-hsum small { font-size: 12.5px; }
.fd-strip { display: grid; grid-template-columns: repeat(24, minmax(0, 1fr)); gap: 3px; }
.fd-strip[aria-busy="true"] { min-height: 72px; }
.fd-strip a, .fd-strip .none { display: grid; align-content: space-between; min-height: 72px; padding: 7px 6px 6px; border-radius: 4px; background: color-mix(in srgb, var(--fd-heat) calc(var(--h, 0) * 1%), var(--sf2)); color: var(--tx); text-decoration: none; transition: transform .12s; }
.fd-strip a:hover { transform: translateY(-2px); }
.fd-strip a.hot { color: #ffffff; }
.fd-strip a.now { outline: 2px solid var(--btn); outline-offset: 1px; }
.fd-strip a .n { font-family: var(--mono); font-size: 12.5px; font-weight: 500; letter-spacing: -.02em; }
.fd-strip a .h { font-family: var(--mono); font-size: 10.5px; opacity: .72; }
.fd-strip a.now .h { color: var(--ac); font-weight: 500; opacity: 1; }
.fd-strip a.hot.now .h { color: #ffffff; }
.fd-strip .none { grid-column: 1 / -1; min-height: 0; padding: 14px; background: var(--sf2); color: var(--mu); font-size: 14px; }
/* 들어오는 업체 장부 | 오늘 지역 | 오늘 분야 */
.fd-three { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr); gap: 40px; }
.fd-ledger ol, .fd-rank ol { list-style: none; margin: 0; padding: 0; }
.fd-ledger li a { display: grid; grid-template-columns: 50px minmax(0, 1fr) minmax(0, 46%); gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--ln); color: var(--tx); text-decoration: none; }
.fd-ledger li a:hover { background: var(--sf2); box-shadow: 0 0 0 6px var(--sf2); }
.fd-ledger time { color: var(--ac); font-family: var(--mono); font-size: 13px; font-weight: 500; }
.fd-ledger .n { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 14.5px; font-weight: 700; }
.fd-ledger .n b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: inherit; }
.fd-ledger .k { overflow: hidden; color: var(--mu); font-size: 12.5px; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.fd-ledger .c-new { flex: none; }
.fd-ledger li.in a { animation: fd-in .8s ease-out; }
@keyframes fd-in { from { background: var(--ac-t); box-shadow: 0 0 0 6px var(--ac-t); } to { background: transparent; box-shadow: none; } }
.fd-ledger .none, .fd-rank .none { padding: 14px 0; color: var(--mu); font-size: 14px; }
.fd-ledger .fd-more { display: inline-block; margin-top: 14px; }
.fd-rank li a { position: relative; display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 10px; align-items: baseline; padding: 9px 0 11px; border-bottom: 1px solid var(--ln); color: var(--tx); text-decoration: none; }
.fd-rank li a:hover b { color: var(--ac); }
.fd-rank i { color: var(--mu2); font-family: var(--mono); font-size: 11.5px; font-style: normal; }
.fd-rank b { overflow: hidden; font-size: 14px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.fd-rank em { color: var(--tx); font-family: var(--mono); font-size: 13.5px; font-style: normal; font-weight: 500; }
.fd-rank s { position: absolute; left: 32px; right: 0; bottom: -1px; height: 2px; width: calc((100% - 32px) * var(--w, 0) / 100); background: var(--btn); opacity: .7; text-decoration: none; }
/* 다섯 자료 한 줄 */
.fd-srcl { list-style: none; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0 24px; margin: 0; padding: 0; }
.fd-srcl a { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1px 9px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--ln); color: var(--tx); text-decoration: none; }
.fd-srcl a:hover b { color: var(--ac); }
.fd-srcl i { width: 9px; height: 9px; border-radius: 2px; }
.fd-srcl span { display: contents; }
.fd-srcl b { font-size: 14.5px; }
.fd-srcl small { grid-column: 2; color: var(--mu2); font-size: 12px; }
.fd-srcl em { grid-column: 1 / -1; margin-top: 6px; color: var(--tx); font-family: var(--mono); font-size: 17px; font-style: normal; font-weight: 500; letter-spacing: -.02em; }
.fd-srcl .s-1 { background: var(--s1); } .fd-srcl .s-2 { background: var(--s2); } .fd-srcl .s-8 { background: var(--s8); } .fd-srcl .s-4 { background: var(--s4); } .fd-srcl .s-5 { background: var(--s5); }
/* 이용권 한 줄 */
.fd-tk { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; padding: 26px 28px; border-radius: var(--r-sm); background: var(--deep); color: var(--deep-tx); }
.fd-tk > div { flex: 1 1 360px; display: grid; gap: 4px; }
.fd-tk b { font-size: 21px; font-weight: 800; letter-spacing: -.03em; }
.fd-tk span { color: var(--deep-mu); font-size: 14px; line-height: 1.55; }
.fd-tk .fd-btn { border-color: var(--deep-tx); color: var(--deep-tx); }
.fd .fd-tk a.fd-btn { color: var(--deep-tx); }
.fd-tk .fd-btn:hover { background: var(--deep-tx); color: var(--deep); }
.fd-tk .fd-btn.pri, .fd .fd-tk a.fd-btn.pri { border-color: var(--btn); background: var(--btn); color: #ffffff; }
.fd-tk .fd-btn.pri:hover { background: var(--btn-h); }

/* ===== 목록 [장부 | 받기 칸] — 첫 화면이면 숨김 ===== */
body.fd-homeon .fd-listw, body.fd-homeon .fd-mbar { display: none !important; }
.fd .fd-fbar { display: none !important; }
.fd .ln-main.fd-body, .fd .ln-main.fd-body.det-on { display: grid; grid-template-columns: minmax(0, 1fr) var(--fd-rail); gap: 32px; padding-block: 18px 48px; align-items: start; }
.fd-res { min-width: 0; }
.fd-rh { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 14px; padding-bottom: 12px; border-bottom: 2px solid var(--tx); }
.fd-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 0; font-size: 24px; font-weight: 850; letter-spacing: -.035em; }
.fd-n { color: var(--mu); font-size: 15px; font-weight: 600; }
.fd-n b { margin-right: 2px; color: var(--ac); font-size: 24px; font-weight: 500; letter-spacing: -.03em; }
.fd-live { display: inline-flex; align-items: center; gap: 7px; color: var(--mu2); font-family: var(--mono); font-size: 11.5px; letter-spacing: .06em; }
.fd-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-left: auto; min-width: 0; }
.fd .fd-chips.ln-chips { flex: 0 1 auto; height: auto; padding: 0; border: 0; flex-wrap: wrap; overflow: visible; }
.fd .fd-chips.ln-chips:empty { display: none; }
.fd .fd-chips.ln-chips::before { content: none; }
.fd .ln-chip { border-radius: 4px; background: var(--sf2); color: var(--tx); font-weight: 600; }
.fd .ln-chip:hover { background: var(--sf3); }
.fd .ln-chip:hover i { background: var(--tx); color: var(--bg); }
.fd .ln-chip.qc { background: var(--tx); color: var(--bg); }
.fd .ln-chip.clear { background: none; color: var(--mu); }
.fd .ln-btn { border-radius: var(--r-sm); border-color: var(--ln2); font-weight: 700; }
.fd .ln-btn:hover { border-color: var(--tx); background: transparent; color: var(--tx); }
.fd .ln-btn.pri { background: var(--tx); border-color: var(--tx); color: var(--bg); }
.fd .ln-btn.pri:hover { background: var(--ac); border-color: var(--ac); color: #ffffff; }
.fd .ln-fbtn.fd-fbtn { display: inline-flex; height: 38px; padding: 0 14px 0 11px; }
.fd .ln-fbtn.fd-fbtn::before { content: none; }
.fd .ln-fbtn .ln-cnt { background: var(--btn); border-radius: 9px; }
.fd .ln-my { display: flex; gap: 4px; }
.fd button.ln-myb { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: transparent; color: var(--mu); cursor: pointer; }
.fd button.ln-myb svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linejoin: round; }
.fd button.ln-myb:hover { border-color: var(--tx); color: var(--tx); }
.fd button.ln-myb[aria-pressed="true"] { border-color: var(--fav); background: var(--fav-t); color: var(--fav-tx); }
.fd button.ln-myb[aria-pressed="true"] svg { fill: currentColor; }
.fd button.ln-sortb { height: 38px; border-color: var(--ln2); border-radius: var(--r-sm); background-color: transparent; font-weight: 700; }
.fd button.ln-sortb:hover, .fd button.ln-sortb[aria-expanded="true"] { border-color: var(--tx); }
.fd .ln-sortb .si svg { color: var(--ac); }
.fd .ln-sortm { border-radius: var(--r-sm); }
.fd-view { display: inline-flex; border: 1px solid var(--ln2); border-radius: var(--r-sm); overflow: hidden; }
.fd-view button { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border: 0; border-left: 1px solid var(--ln2); background: none; color: var(--mu); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.fd-view button:first-child { border-left: 0; }
.fd-view button[aria-pressed="true"] { background: var(--tx); color: var(--bg); }
.fd-view button:focus-visible { outline: 2px solid var(--ac); outline-offset: -2px; }
.fd .ln-note { border-radius: var(--r-sm); }
/* 장부형 리스트: 카드 바탕 없이 괘선만. 오른쪽 받기 칸이 있어 목록이 좁다 — 1560px 아래는 등록·출처 칸을(시간 머리가 있다), 1180px 아래는 주소 칸도 접는다 (line.css 는 화면 폭 기준이라 받기 칸을 모른다) */
.fd .ln-list.rows { border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: hidden; }
@media (min-width: 901px) and (max-width: 1560px) {
  .fd .ln-list.rows .ln-rowhead, .fd .ln-list.rows .ln-card .c-open, .fd .ln-main.det-on .ln-list.rows .ln-rowhead, .fd .ln-main.det-on .ln-list.rows .ln-card .c-open { grid-template-columns: minmax(160px, 1.3fr) minmax(130px, 1fr) minmax(180px, 1.5fr) minmax(180px, 1.3fr); }
  .fd .ln-list.rows .c-f, .fd .ln-list.rows .ln-rowhead span:nth-child(5) { display: none; }
}
@media (min-width: 901px) and (max-width: 1180px) {
  .fd .ln-list.rows .ln-rowhead, .fd .ln-list.rows .ln-card .c-open, .fd .ln-main.det-on .ln-list.rows .ln-rowhead, .fd .ln-main.det-on .ln-list.rows .ln-card .c-open { grid-template-columns: minmax(150px, 1.3fr) minmax(120px, 1fr) minmax(170px, 1.3fr); }
  .fd .ln-list.rows .c-a, .fd .ln-list.rows .ln-rowhead span:nth-child(3) { display: none; }
}
.fd .ln-list.rows .ln-rowhead { padding: 9px 12px; border-bottom: 1px solid var(--ln2); background: transparent; color: var(--mu2); font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .06em; }
.fd .ln-list.rows .ln-card .c-open { padding: 11px 12px; border-top: 1px solid var(--ln); }
.fd .ln-list.rows .ln-rowhead + .ln-card .c-open { border-top: 0; }
.fd .ln-list.rows .ln-card .c-open:hover { background: var(--sf2); }
.fd .ln-list.rows .ln-card.on .c-open { background: var(--ac-t); box-shadow: inset 3px 0 0 var(--btn); }
.fd .ln-list.rows .c-n { font-size: 14.5px; }
.fd .ln-list.rows .c-d1 { color: var(--tx); font-family: var(--mono); font-size: 11.5px; }
.fd .ln-list.rows .c-d2 { font-family: var(--mono); font-size: 11px; }
.fd .c-g { border-radius: 3px; }
.fd .ln-src b { border-radius: 3px; }
.fd .c-nts { border-radius: 3px; }
.fd .c-new { border-radius: 3px; background: var(--btn); color: #ffffff; }
.fd .ln-list.rows button.c-fav { left: 6px; }
.fd.fav-on .ln-list.rows .ln-rowhead, .fd.fav-on .ln-list.rows .ln-card .c-open { padding-left: 44px; }   /* 회원: 이름 앞 즐겨찾기 별 자리 (line.css 와 같은 세기라 여기서 다시) */
/* 카드 보기: 납작한 타일 */
.fd .ln-list.fd-list:not(.rows) { grid-template-columns: repeat(auto-fill, minmax(min(100%, 272px), 1fr)); gap: 10px; padding-top: 12px; }
.fd .ln-list:not(.rows) .ln-card .c-open { padding: 14px 16px 12px; border: 1px solid var(--ln); border-radius: var(--r-sm); background: var(--sf); box-shadow: none; }
.fd .ln-list:not(.rows) .ln-card .c-open:hover { border-color: var(--tx); box-shadow: none; transform: none; }
.fd .ln-list:not(.rows) .ln-card.on .c-open { border-color: var(--btn); box-shadow: inset 0 3px 0 var(--btn); }
.fd .ln-list:not(.rows) .c-c { grid-template-columns: 1fr; gap: 3px; }
.fd .ln-list:not(.rows) .c-c > span.none { display: none; }
.fd .ln-list:not(.rows) .c-d { font-family: var(--mono); font-size: 11.5px; }
.fd .ln-empty { border-radius: var(--r-sm); border-color: var(--ln); box-shadow: none; }
.fd .ln-empty-wait { border-radius: var(--r-sm); }
/* 시간 머리 (assets/feed.js): 같은 시각에 올라온 업체끼리 */
.fd-slot { display: flex; align-items: baseline; gap: 10px; list-style: none; }
.fd .ln-list:not(.rows) .fd-slot { grid-column: 1 / -1; padding: 14px 2px 0; }
.fd .ln-list:not(.rows) .fd-slot:first-child { padding-top: 2px; }
.fd .ln-list.rows .fd-slot { padding: 14px 12px 6px; border-top: 1px solid var(--ln2); }
.fd .ln-list.rows .ln-rowhead + .fd-slot { border-top: 0; }
.fd .ln-list.rows .fd-slot + .ln-card .c-open { border-top: 1px solid var(--ln); }
.fd-slot b { color: var(--tx); font-family: var(--mono); font-size: 14px; font-weight: 500; }
.fd-slot small { color: var(--mu2); font-size: 12.5px; font-weight: 600; }
.fd-slot::before { content: ''; align-self: center; width: 7px; height: 7px; border-radius: 50%; background: var(--btn); }
/* 쪽수 */
.fd .ln-pg button { border-radius: var(--r-sm); background: transparent; }
.fd .ln-pg button[aria-current] { border-color: var(--tx); background: var(--tx); color: var(--bg); font-weight: 700; }
.fd .ln-pg button:hover:not(:disabled):not([aria-current]) { border-color: var(--tx); color: var(--tx); }
.fd .ln-more:has(.ln-pg) { background: linear-gradient(to top, var(--bg) 70%, transparent); }

/* 오른쪽 받기 칸: 지금 조건 → 엑셀 · 담아 두기 · 내 이용권 */
.fd-rail { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 18px); display: grid; gap: 12px; min-width: 0; }
.fd-now { display: grid; gap: 6px; padding: 16px 18px 18px; border: 1px solid var(--ln2); border-top: 3px solid var(--btn); border-radius: var(--r-sm); background: var(--sf); }
.fd-now > span { color: var(--mu); font-size: 12.5px; font-weight: 700; }
.fd-now-n { display: flex; align-items: baseline; gap: 3px; }
.fd-now-n b { color: var(--tx); font-family: var(--mono); font-size: 30px; font-weight: 500; letter-spacing: -.03em; line-height: 1.1; }
.fd-now-n small { color: var(--mu); font-size: 14px; }
.fd-now .ln-dl.fd-btn { width: 100%; margin-top: 8px; height: 46px; font-size: 15px; }
.fd-now p { margin: 2px 0 0; color: var(--mu2); font-size: 12px; line-height: 1.5; }
.fd-bag { padding: 16px 18px 18px; border: 1px solid var(--ln); border-radius: var(--r-sm); background: var(--sf); }
.fd-bag-h { display: flex; align-items: center; gap: 8px; }
.fd-bag h3 { margin: 0; font-size: 15px; font-weight: 800; letter-spacing: -.02em; }
.fd-bagc { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--tx); color: var(--bg); font-family: var(--mono); font-size: 11px; font-weight: 500; line-height: 20px; text-align: center; box-sizing: border-box; }
.fd-bag > p { margin: 6px 0 12px; color: var(--mu); font-size: 12.5px; line-height: 1.55; }
.fd-bag .bag-l { display: grid; gap: 0; }
.fd-bag .bag-l:empty::before { content: '아직 담은 조건이 없습니다.'; display: block; padding: 10px 0; border-top: 1px dashed var(--ln2); color: var(--mu2); font-size: 12.5px; }
.fd-bag .bag-i { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 0; border-top: 1px solid var(--ln); }
.fd-bag .bag-i a { flex: 1; min-width: 0; overflow: hidden; color: var(--tx); font-size: 13.5px; font-weight: 700; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.fd-bag .bag-i a:hover { color: var(--ac); }
.fd-bag .bag-i span { flex: none; color: var(--mu); font-family: var(--mono); font-size: 12px; }
.fd-bag .bag-i button { flex: none; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 4px; background: none; color: var(--mu2); font-size: 16px; line-height: 1; cursor: pointer; }
.fd-bag .bag-i button:hover { background: var(--sf2); color: var(--tx); }
.fd-bag .bag-add { width: 100%; margin-top: 8px; height: 38px; border: 1px dashed var(--ln2); border-radius: var(--r-sm); background: none; color: var(--tx); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.fd-bag .bag-add:hover { border-color: var(--tx); border-style: solid; }
.fd-bag .bag-msg { min-height: 1em; margin: 8px 0 0; color: var(--ac); font-size: 12.5px; font-weight: 600; }
.fd-bag .bag-msg.err { color: var(--bad); }
.fd-bag-t { display: flex; align-items: baseline; justify-content: space-between; margin: 10px 0 8px; padding-top: 10px; border-top: 1px solid var(--ln2); color: var(--mu); font-size: 12.5px; font-weight: 600; }
.fd-bag-t b { color: var(--tx); font-family: var(--mono); font-size: 17px; font-weight: 500; }
.fd .fd-dl { width: 100%; height: 42px; font-size: 14px; }
.fd-mini { padding: 4px 4px 0; color: var(--mu); font-size: 13px; line-height: 1.55; }
.fd-mini h4 { margin: 0 0 4px; color: var(--mu2); font-size: 11.5px; font-weight: 700; letter-spacing: .02em; }
.fd-mini p { margin: 0; }
.fd-mini b { color: var(--tx); }
.fd-sub { margin-top: 3px !important; color: var(--mu2); font-size: 12.5px; }
.fd-link { display: inline-block; margin-top: 6px; color: var(--tx); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.fd a.fd-link { color: var(--tx); }
.fd a.fd-link:hover { color: var(--ac); }
.fd-mbar { display: none; }

/* 조건·업체 정보: 오른쪽에서 나오는 판 (PC) */
@media (min-width: 901px) {
  .fd .ln-main > .ln-side.fd-cond { display: flex; position: fixed; z-index: 52; top: 0; right: 0; bottom: 0; left: auto; width: 392px; max-height: none; border: 0; border-left: 1px solid var(--ln2); border-radius: 0; background: var(--sf); box-shadow: var(--sh3); transform: translateX(105%); transition: transform .22s ease; }
  .fd .ln-main > .ln-side.fd-cond.open { transform: none; }
  .fd .fd-cond .ln-side-h { display: flex; padding: 18px 14px 10px 20px; border-bottom: 1px solid var(--ln); }
  .fd .fd-cond .ln-side-h b { font-size: 17px; font-weight: 800; letter-spacing: -.02em; }
  .fd .fd-cond .ln-side-h .ln-x { display: grid; }
  .fd .fd-cond .ln-side-b { padding-top: 6px; }
  .fd .fd-cond .ln-side-f { display: flex; gap: 8px; padding: 12px 16px calc(14px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--ln); }
  .fd .fd-cond .ln-side-f #ln-side-go { display: inline-flex; flex: 1; }
  .fd .ln-scrim:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 51; background: rgb(18 17 16 / 45%); }
  .fd .ln-det.fd-det { position: fixed; z-index: 50; top: 0; right: 0; bottom: 0; width: min(480px, 92vw); max-height: none !important; border: 0; border-left: 1px solid var(--ln2); border-radius: 0; background: var(--sf); box-shadow: var(--sh3); display: flex; flex-direction: column; }
  .fd .ln-det.fd-det[hidden] { display: none; }
}
@media (prefers-reduced-motion: reduce) { .fd .ln-main > .ln-side.fd-cond { transition: none; } }
.fd .ln-det-h { height: 58px; }
.fd .ln-det-h b { font-size: 16px; font-weight: 800; }
.fd .d-n { font-size: 24px; font-weight: 850; letter-spacing: -.035em; }
.fd .d-tel a, .fd .d-tel span { border-radius: var(--r-sm); }
.fd .d-lock { border-radius: var(--r-sm); background: var(--ac-t); border-color: var(--ac-t2); }
.fd .d-why, .fd .d-src article, .fd .d-fold { border-radius: var(--r-sm); }
.fd .lk-ic { background: var(--ac-t2); }
.fd .fg select, .fd .fg input, .fd .seg, .fd button.fg-pick, .fd .kl { border-radius: var(--r-sm); }
.fd .seg label:has(input:checked) { color: var(--tx); }
.fd .ch:has(input:checked) { border-color: var(--tx); background: var(--sf2); color: var(--tx); }
.fd .kp-tabs button[aria-selected="true"], .fd .kp-tg button.in[aria-pressed="true"] { background: var(--tx); border-color: var(--tx); color: var(--bg); }
.fd .ln-dlg { border-radius: var(--r); border-color: var(--ln2); }
.fd .ln-dlg-h b { font-weight: 800; letter-spacing: -.02em; }
.fd .ln-toast { border-radius: var(--r-sm); }
.fd .ln-totop { border-radius: var(--r-sm); }
.fd .xf-file { background: var(--ok); }

/* ===== 바닥 ===== */
.ff { margin-top: 24px; padding-block: 34px 26px; border-top: 1px solid var(--ln); color: var(--mu); font-size: 13.5px; }
.ff-in { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 24px 32px; max-width: var(--fd-w); margin-inline: auto; padding-inline: 32px; box-sizing: border-box; }
.ff-brand { display: grid; gap: 12px; max-width: 360px; }
.ff-brand p { margin: 0; line-height: 1.65; }
.fh-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--tx); text-decoration: none; }
.fh-mk { display: inline-grid; width: 30px; height: 30px; }
.fh-mk svg { width: 100%; height: 100%; }
.fh-logo b { font-size: 17px; font-weight: 850; letter-spacing: -.03em; }
.ff-nav { display: contents; }
.ff-nav div { display: grid; align-content: start; gap: 7px; padding-top: 6px; border-top: 1px solid var(--ln2); }
.ff-nav b { margin-bottom: 4px; color: var(--mu2); font-size: 12px; font-weight: 700; letter-spacing: .02em; }
.ff-nav a { color: var(--mu); text-decoration: none; }
.ff-nav a:hover { color: var(--ac); }
.ff-nav strong { color: var(--tx); }
.ff-biz { max-width: var(--fd-w); margin: 26px auto 0; padding: 16px 32px 0; border-top: 1px solid var(--ln); box-sizing: border-box; color: var(--mu2); font-size: 12px; line-height: 1.7; }

/* ===== 중간 폭 (태블릿·좁은 PC) ===== */
@media (max-width: 1280px) {
  .fd-hero-g { grid-template-columns: minmax(0, 1fr) 360px; gap: 32px; }
  .fd-three { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .fd-three .fd-ledger { grid-column: 1 / -1; }
  .fd .ln-main.fd-body, .fd .ln-main.fd-body.det-on { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .fd-rail { position: static; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .fd-mini { grid-column: 1 / -1; }
}
@media (max-width: 1080px) and (min-width: 901px) {
  .fd-hero-g { grid-template-columns: minmax(0, 1fr); gap: 28px; padding-block: 32px 36px; }
  .fd-hero.big .fd-ws { max-width: 560px; }
  .fd-bl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fd-srcl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ff-in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

/* ===== 휴대폰 ===== */
@media (max-width: 900px) {
  :root { --fd-tab: 60px; }
  .fd-w, .ff-in, .ff-biz { padding-inline: 16px; }
  .fd-app { grid-template-columns: minmax(0, 1fr); }
  /* 왼쪽 메뉴 → 아래 탭 다섯 칸 (실시간·찾기·이용권·고객센터·내 정보/로그인) */
  .fd-side { position: fixed; top: auto; left: 0; right: 0; bottom: 0; z-index: 46; height: auto; flex-direction: row; padding: 4px 4px calc(4px + env(safe-area-inset-bottom, 0px)); overflow: visible; border-right: 0; border-top: 1px solid var(--ln2); background: var(--sf); }
  .fd-logo, .fd-side-f, .fd-it:not(.m), .fd-lbl { display: none; }
  .fd-only-m { display: flex; }
  .fd-its { flex: 1; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; }
  .fd-it { flex-direction: column; justify-content: center; gap: 3px; height: 52px; padding: 0; border-radius: 0; font-size: 10.5px; }
  .fd-it i { width: auto; height: 22px; }
  .fd-it span { flex: none; overflow: visible; }
  .fd-it.on, .fd .fd-side a.fd-it.on { background: none; color: var(--ac); box-shadow: inset 0 2px 0 var(--btn); }
  .fd-it:hover, .fd .fd-side a.fd-it:hover { background: none; }
  .fd-it small { display: none; }
  .fd-it .fd-cnt { position: absolute; top: 4px; left: calc(50% + 6px); }
  .fd-dot { display: block; position: absolute; top: 6px; left: calc(50% + 8px); width: 7px; height: 7px; border-radius: 50%; background: var(--btn); }
  body.fd { padding-bottom: calc(var(--fd-tab) + env(safe-area-inset-bottom, 0px)); }
  /* 위 작은 막대 */
  .fd-mtop { position: sticky; top: 0; z-index: 44; display: flex; align-items: center; gap: 8px; padding: calc(8px + env(safe-area-inset-top, 0px)) 16px 8px; border-bottom: 1px solid var(--ln); background: color-mix(in srgb, var(--bg) 92%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
  .fd-mlogo { display: inline-flex; align-items: center; gap: 8px; margin-right: auto; color: var(--tx); text-decoration: none; }
  .fd .fd-mlogo { color: var(--tx); }
  .fd-mlogo svg { width: 28px; height: 28px; }
  .fd-mlogo b { font-size: 16.5px; font-weight: 850; letter-spacing: -.03em; }
  .fd-mtk { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 10px; border: 1px solid var(--ln2); border-radius: var(--r-sm); color: var(--mu); font-family: var(--mono); font-size: 12px; font-weight: 500; text-decoration: none; }
  .fd-mtk i { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); }
  .fd-mtk.off { border-color: var(--btn); color: var(--ac); font-family: inherit; font-weight: 700; }
  .fd-mic { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: transparent; color: var(--mu); cursor: pointer; }
  .fd-mic svg { width: 17px; height: 17px; }
  .fd-mjoin { display: inline-flex; align-items: center; height: 34px; padding: 0 12px; border-radius: var(--r-sm); background: var(--tx); color: var(--bg); font-size: 13px; font-weight: 800; text-decoration: none; }
  .fd a.fd-mjoin { color: var(--bg); }
  .fd-mast { gap: 4px 12px; padding: 12px 0 10px; font-size: 12px; }
  .fd-mast-n { width: 100%; margin-left: 0; }
  .fd-hero-g { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-block: 24px 26px; }
  .fd-h1 { font-size: 32px; }
  .fd-lead { margin: 10px 0 18px; font-size: 15px; }
  .fd .fd-hero.big .ln-q.fd-q { height: 52px; padding-left: 14px; }
  .fd .fd-hero.big .ln-q.fd-q > button { padding: 0 16px; font-size: 14.5px; }
  .fd .fd-ex.ln-ex { margin-inline: -16px; padding-inline: 16px; }
  .fd .fd-ex.ln-ex > span { display: none; }
  .fd .fd-ex.ln-ex a { flex: none; }
  .fd-ws { padding: 16px 16px 18px; }
  .fd-ws-r { grid-template-columns: 46px minmax(0, 1fr); }
  .fd-seg button { padding: 0 10px; font-size: 12.5px; }
  .fd-ws-n b { font-size: 28px; }
  .fd-land { gap: 28px; padding-bottom: 32px; }
  .fd-sh { margin-bottom: 10px; }
  .fd-sh h2 { font-size: 16.5px; }
  .fd-bl { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .fd-bl a { min-height: 0; padding: 10px 14px; }
  .fd-strip { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2px; }
  .fd-strip a, .fd-strip .none { min-height: 54px; padding: 5px 4px 4px; }
  .fd-strip a .n { font-size: 11px; }
  .fd-strip a .h { font-size: 9.5px; }
  .fd-three { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .fd-ledger li a { grid-template-columns: 46px minmax(0, 1fr); gap: 0 10px; padding: 9px 0; }
  .fd-ledger .k { grid-column: 2; text-align: left; font-size: 12px; }
  .fd-srcl { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
  .fd-tk { padding: 20px 18px; }
  .fd-tk b { font-size: 18px; }
  .fd-tk .fd-btn { flex: 1 1 140px; }
  .fd .ln-main.fd-body, .fd .ln-main.fd-body.det-on { padding-block: 8px 24px; gap: 14px; }
  .fd-rh { gap: 8px; padding-bottom: 10px; }
  .fd-h { font-size: 19px; }
  .fd-n b { font-size: 19px; }
  .fd-live { display: none; }
  .fd-tools { width: 100%; margin-left: 0; gap: 6px; }
  .fd .ln-fbtn.fd-fbtn { height: 36px; }
  .fd button.ln-myb { width: 36px; height: 36px; }
  .fd button.ln-sortb { height: 36px; }
  .fd-view { margin-left: auto; }
  .fd-view button { height: 34px; padding: 0 9px; }
  .fd-view button span { display: none; }
  .fd .fd-chips.ln-chips { order: 9; flex-basis: 100%; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .fd .ln-list.rows { margin-inline: 0; border-inline: 0; }
  .fd .ln-list.rows .ln-card .c-open { padding-inline: 4px; }
  .fd.fav-on .ln-list.rows .ln-card .c-open { padding-left: 38px; }
  .fd .ln-list.rows button.c-fav { left: 0; }
  .fd .ln-list.rows .fd-slot { padding: 12px 4px 6px; }
  .fd-rail { grid-template-columns: minmax(0, 1fr); }
  .fd-mbar { position: fixed; z-index: 44; left: 10px; right: 10px; bottom: calc(var(--fd-tab) + env(safe-area-inset-bottom, 0px) + 8px); display: flex; align-items: center; gap: 8px; padding: 8px 8px 8px 14px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: var(--sf); color: var(--tx); box-shadow: var(--sh2); }
  .fd-mbar > span { flex: 1; color: var(--mu); font-size: 12.5px; }
  .fd-mbar > span b { color: var(--tx); font-family: var(--mono); font-size: 16px; font-weight: 500; }
  .fd-mbar-bag { position: relative; height: 38px; padding: 0 12px; border: 1px solid var(--ln2); border-radius: var(--r-sm); background: none; color: var(--tx); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
  .fd-mbar-bag i { position: absolute; top: -7px; right: -7px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--btn); color: #ffffff; font-family: var(--mono); font-size: 11px; font-style: normal; line-height: 18px; box-sizing: border-box; }
  .fd-mbar .fd-btn { height: 38px; padding: 0 14px; font-size: 14px; }
  body.fd:not(.fd-homeon) .fd-listw { padding-bottom: 66px; }
  .fd .ln-totop { bottom: calc(var(--fd-tab) + env(safe-area-inset-bottom, 0px) + 70px); }
  body.fd-homeon .ln-totop { bottom: calc(var(--fd-tab) + env(safe-area-inset-bottom, 0px) + 14px); }
  .fd .ln-toasts { bottom: calc(var(--fd-tab) + env(safe-area-inset-bottom, 0px) + 70px); }
  .ff { padding-block: 26px 20px; }
  .ff-in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px 16px; }
  .ff-brand { grid-column: 1 / -1; }
  .ff-biz { padding-top: 14px; }
}
@media (max-width: 420px) { .fd-h1 { font-size: 29px; } .fd-srcl { grid-template-columns: minmax(0, 1fr); } .fd-ws-acts { grid-template-columns: minmax(0, 1fr); } }

/* 처음 안내 (views/_moved.php .mv-feed) — 오른쪽 아래 쪽지 (휴대폰은 아래에서 올라오는 판) */
.mv.mv-feed { position: fixed; inset: auto 24px 24px auto; width: min(400px, calc(100vw - 32px)); max-width: 100vw; max-height: calc(100vh - 48px); height: auto; margin: 0; padding: 0; border: 0; background: transparent; overflow: visible; }
.mv.mv-feed::backdrop { background: rgb(18 17 16 / 22%); }
.mv-feed .mv-in { display: flex; flex-direction: column; gap: 14px; padding: 22px 22px 18px; border: 1px solid var(--ln2); border-top: 3px solid var(--btn); border-radius: var(--r-sm); background: var(--sf); color: var(--tx); box-shadow: var(--sh3); box-sizing: border-box; }
.mv-feed .mv-hd { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: start; }
.mv-feed .mv-hd svg { width: 40px; height: 40px; }
.mv-feed .mv-hd small { display: block; color: var(--ac); font-family: var(--mono); font-size: 11.5px; letter-spacing: .04em; }
.mv-feed .mv-hd b { display: block; margin-top: 3px; font-size: 18px; font-weight: 800; line-height: 1.3; letter-spacing: -.02em; text-wrap: balance; }
.mv-feed .mv-l { list-style: none; margin: 0; padding: 0; display: grid; }
.mv-feed .mv-l li { position: relative; display: grid; gap: 1px; padding: 9px 0 9px 22px; border-top: 1px solid var(--ln); }
.mv-feed .mv-l li::before { content: ''; position: absolute; left: 4px; top: 16px; width: 7px; height: 7px; border-radius: 50%; background: var(--btn); }
.mv-feed .mv-l b { font-size: 14px; font-weight: 700; }
.mv-feed .mv-l span { color: var(--mu); font-size: 12.5px; line-height: 1.5; }
.mv-feed .mv-ft { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; margin-top: 2px; }
.mv-feed .mv-pri { height: 42px; padding: 0 16px; border: 1px solid var(--tx); border-radius: var(--r-sm); background: var(--tx); color: var(--bg); font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; }
.mv-feed .mv-pri:hover { background: var(--ac); border-color: var(--ac); color: #ffffff; }
.mv-feed .mv-sec { display: grid; place-items: center; height: 42px; padding: 0 14px; color: var(--mu); font-size: 13px; font-weight: 600; text-decoration: none; }
.mv-feed .mv-sec:hover { color: var(--tx); }
.mv-feed .mv-skip { justify-self: start; border: 0; background: none; color: var(--mu2); font: inherit; font-size: 12.5px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
@media (max-width: 900px) {
  .mv.mv-feed { inset: auto 0 0 0; width: 100vw; max-height: 90vh; }
  .mv-feed .mv-in { border-radius: var(--r) var(--r) 0 0; border-inline: 0; border-bottom: 0; padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)); }
}

/* 알림은 위 오른쪽에 (받기 칸·아래 탭을 가리지 않게), 휴대폰은 가장 최근 것 하나만 */
@media (min-width: 901px) { .fd .ln-toasts { top: calc(env(safe-area-inset-top, 0px) + 16px); bottom: auto; } }
@media (max-width: 900px) { .fd .ln-toasts > :not(:last-child) { display: none; } }
/* 휴대폰 받기 바구니 창 (assets/feed.js bagSheet) */
.fd-bagdlg { width: 100%; max-width: 560px; max-height: 86vh; margin: auto auto 0; padding: 0 0 calc(env(safe-area-inset-bottom, 0px) + 14px); border: 0; border-radius: 18px 18px 0 0; background: var(--bg); color: var(--tx); overflow: auto; box-shadow: 0 -18px 40px -20px rgb(0 0 0 / 45%); }
.fd-bagdlg::backdrop { background: rgb(10 14 30 / 45%); }
.fd-bagdlg-h { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; padding: 14px 18px 10px; background: var(--bg); }
.fd-bagdlg-h b { font-size: 16px; font-weight: 800; }
.fd-bagdlg-x { width: 34px; height: 34px; border: 1px solid var(--ln); border-radius: 50%; background: var(--sf); color: var(--tx); font-size: 14px; }
.fd-bagdlg .fd-bag { margin: 0 14px; }
.fd-bagdlg .fd-bag-h { display: none; }