@charset "utf-8";
/* ============================================================
   피클튜브(feedtube) PC 스킨 — 유튜브 스타일 (basic 복사본 전용)
   ============================================================ */
.fcyt-board, .fcyt-view { --yt-red:#ff0000; --yt-text:#0f0f0f; --yt-sub:#606060; --yt-chip:#f2f2f2; --yt-chip-hover:#e5e5e5; --yt-chip-on:#0f0f0f; --yt-ontext:#fff; --yt-line:#e5e5e5; --yt-bg:#fff; --yt-panel:#f8f8f8; --yt-link:#065fd4; --yt-file:#f7f7f7; font-family:'Nanum Barun Gothic','Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic',Roboto,sans-serif; color:var(--yt-text) }
.fcyt-board *, .fcyt-view * { box-sizing:border-box }
.fcyt-board a, .fcyt-view a { text-decoration:none }

#bo_list.fcyt-board, #bo_list_admin.fcyt-board, .fcyt-board { padding:0 28px 10px; box-sizing:border-box }
/* 채널 칩 (카테고리) */
.fcyt-chips { display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 14px; padding:0 2px }
.fcyt-chip { display:inline-block; padding:0 12px; height:32px; line-height:32px; border-radius:8px; background:var(--yt-chip); color:var(--yt-text) !important; font-size:13px; font-weight:500; white-space:nowrap; transition:background .15s }
.fcyt-chip:hover { background:var(--yt-chip-hover) }
.fcyt-chip.on { background:var(--yt-chip-on); color:var(--yt-ontext) !important }

/* 툴바: 타입 필터 · 개수 · 검색 · 도구 */
.fcyt-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:10px 14px; margin:0 0 16px; padding:10px 0 12px; border-bottom:1px solid var(--yt-line) }
.fcyt-seg { display:inline-flex; border:1px solid var(--yt-line); border-radius:6px; overflow:hidden; background:var(--yt-bg) }
.fcyt-seg a { padding:0 14px; height:34px; line-height:34px; font-size:13px; color:var(--yt-sub) !important; border-right:1px solid var(--yt-line); white-space:nowrap }
.fcyt-seg a:last-child { border-right:0 }
.fcyt-seg a i { margin-right:3px; font-size:11px }
.fcyt-seg a.on { background:var(--yt-chip-on); color:var(--yt-ontext) !important; font-weight:bold }
.fcyt-count { font-size:12px; color:var(--yt-sub) }
.fcyt-search { display:flex; align-items:center; margin-left:auto; height:36px; border:1px solid #ccc; border-radius:6px; overflow:hidden; background:var(--yt-bg); max-width:420px; flex:1 1 260px }
.fcyt-search-field { height:34px; border:0; border-right:1px solid var(--yt-line); background:var(--yt-panel); font-size:12px; padding:0 8px; color:var(--yt-sub); outline:none }
.fcyt-search-input { flex:1; min-width:0; height:34px; border:0 !important; padding:0 12px; font-size:14px; background:var(--yt-bg) !important; outline:none; color:var(--yt-text) }
.fcyt-search-btn { width:56px; height:34px; border:0; border-left:1px solid var(--yt-line); background:var(--yt-panel); color:var(--yt-text); cursor:pointer; font-size:14px }
.fcyt-search-btn:hover { background:var(--yt-chip-hover) }
.fcyt-tools { display:inline-flex; gap:6px }
.fcyt-icon-btn { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:6px; background:var(--yt-chip); color:var(--yt-text) !important; font-size:14px }
.fcyt-icon-btn:hover { background:var(--yt-chip-hover) }

/* 카드 그리드 */
.fcyt-grid { list-style:none; margin:0 0 18px; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:26px 16px }
@media (max-width:1100px) { .fcyt-grid { grid-template-columns:repeat(3,minmax(0,1fr)) } }
@media (max-width:768px) { .fcyt-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 10px } }
@media (max-width:420px) { .fcyt-grid { grid-template-columns:1fr } }
.fcyt-grid .fcyt-card { margin:0; padding:0; min-width:0; position:relative }
.fcyt-thumb { display:block; position:relative; width:100%; height:0; padding-bottom:56.25%; overflow:hidden; border-radius:8px; background:#0f0f0f }
.fcyt-thumb img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s ease }
.fcyt-card:hover .fcyt-thumb img { transform:scale(1.03) }
.fcyt-thumb .fcyt-blur { position:absolute; left:-10%; top:-10%; width:120%; height:120%; background-size:cover; background-position:center; filter:blur(18px); opacity:.85 }
.fcyt-thumb.fcyt-fit img { object-fit:contain }
.fcyt-noimg { position:absolute; left:0; top:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:#aaa; font-size:12px; background:#222 }
.fcyt-notice .fcyt-noimg { background:#3a3a3a; color:#fff; font-weight:bold; font-size:16px }
.fcyt-dur { position:absolute; right:6px; bottom:6px; padding:1px 5px; border-radius:4px; background:rgba(0,0,0,.8); color:#fff; font-size:12px; line-height:17px; font-weight:bold; letter-spacing:0 }
.fcyt-badge { display:inline-block; padding:1px 7px; border-radius:4px; background:var(--yt-red); color:#fff; font-size:11px; line-height:17px; font-weight:bold; letter-spacing:0; vertical-align:middle }
.fcyt-thumb .fcyt-badge { position:absolute; left:6px; top:6px }
.fcyt-badge.fcyt-live { background:#e62117 }
.fcyt-badge.fcyt-notice-badge { background:#333 }
.fcyt-body { display:flex; gap:10px; padding:10px 2px 0; align-items:flex-start }
.fcyt-avatar { width:36px; height:36px; border-radius:50%; flex:0 0 36px; object-fit:cover; background:#ddd }
.fcyt-text { min-width:0; flex:1 }
.fcyt-title { display:block; font-weight:bold; font-size:14px; line-height:1.4; max-height:2.8em; overflow:hidden; color:var(--yt-text) !important; word-break:break-all }
.fcyt-card:hover .fcyt-title { color:var(--yt-text) !important }
.fcyt-now .fcyt-title { color:var(--yt-red) !important }
.fcyt-meta { margin-top:4px; font-size:12px; color:var(--yt-sub); line-height:1.5 }
.fcyt-meta .fcyt-ch { display:block; color:var(--yt-sub) !important; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.fcyt-meta .fcyt-ch:hover { color:var(--yt-text) !important }
.fcyt-meta .fcyt-cmt { margin-left:6px }
.fcyt-meta .fcyt-new { display:inline-block; margin-left:5px; padding:0 4px; border-radius:3px; background:#f5a623; color:#fff; font-size:10px; font-weight:bold; line-height:15px }
.fcyt-meta .fcyt-hot { margin-left:5px; color:#e62117 }
.fcyt-chk { margin:6px 0 0; width:18px; height:18px }
.fcyt-grid .fcyt-empty { grid-column:1/-1; padding:60px 0; text-align:center; color:#888; font-size:14px; line-height:2 }
.fcyt-grid .fcyt-empty i { font-size:34px; color:#ccc }
/* 세로(쇼츠) 그리드 */
.fcyt-grid.fcyt-grid-vertical { grid-template-columns:repeat(6,minmax(0,1fr)); gap:20px 12px }
@media (max-width:1100px) { .fcyt-grid.fcyt-grid-vertical { grid-template-columns:repeat(5,minmax(0,1fr)) } }
@media (max-width:768px) { .fcyt-grid.fcyt-grid-vertical { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px 8px } }
@media (max-width:420px) { .fcyt-grid.fcyt-grid-vertical { grid-template-columns:repeat(2,minmax(0,1fr)) } }
.fcyt-grid-vertical .fcyt-thumb { padding-bottom:177.78% }
.fcyt-grid-vertical .fcyt-avatar { display:none }
.fcyt-grid-vertical .fcyt-title { font-size:13px }

/* 알약 버튼 */
.fcyt-pill { display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 16px; border-radius:6px; border:0; background:var(--yt-chip); color:var(--yt-text) !important; font-size:13px; font-weight:500; cursor:pointer; white-space:nowrap; line-height:1; vertical-align:middle; font-family:inherit }
.fcyt-pill:hover { background:var(--yt-chip-hover) }
.fcyt-pill i { font-size:13px }
.fcyt-pill-red { background:var(--yt-red); color:var(--yt-ontext) !important; font-weight:bold }
.fcyt-pill-red:hover { background:#cc0000 }
.fcyt-pill-dark { background:var(--yt-chip-on); color:var(--yt-ontext) !important }
.fcyt-pill-dark:hover { background:#333 }
.fcyt-pill-danger { color:#c62828 !important }
.fcyt-pill-danger:hover { background:#fdecec }
label.fcyt-pill input { margin:0 }

/* 하단 바 + 페이지네이션 */
.fcyt-bottom { display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:space-between; margin:6px 0 10px; padding:12px 0; border-top:1px solid var(--yt-line) }
.fcyt-bottom-left, .fcyt-bottom-right { display:flex; flex-wrap:wrap; gap:8px; align-items:center }
.fcyt-paging { text-align:center; margin:10px 0 24px }
.fcyt-paging .pg_wrap { display:inline-block; margin:0; padding:0 }
.fcyt-paging .pg_page, .fcyt-paging .pg_current { display:inline-block; min-width:36px; height:36px; line-height:36px; padding:0 10px; margin:0 2px; border-radius:6px; background:var(--yt-chip); color:var(--yt-text); font-size:13px; text-decoration:none }
.fcyt-paging .pg_page:hover { background:var(--yt-chip-hover) }
.fcyt-paging .pg_current { background:var(--yt-chip-on); color:var(--yt-ontext); font-weight:bold }
.fcyt-paging .pg_start, .fcyt-paging .pg_prev, .fcyt-paging .pg_next, .fcyt-paging .pg_end { font-size:0; position:relative }
.fcyt-paging .pg_start:before { content:'«'; font-size:13px } .fcyt-paging .pg_prev:before { content:'‹'; font-size:13px } .fcyt-paging .pg_next:before { content:'›'; font-size:13px } .fcyt-paging .pg_end:before { content:'»'; font-size:13px }

/* ================= 본문 (시청 페이지) ================= */
#bo_v.fcyt-view, .fcyt-view { margin:0 0 20px; padding:0 28px 16px; box-sizing:border-box }
.fcyt-stage { background:#000; border-radius:8px; overflow:hidden; margin:4px 0 14px }
.fcyt-stage .fc-yt-player { position:relative; width:100%; height:0; padding-bottom:56.25%; background:#000; margin:0 }
.fcyt-stage .fc-yt-player iframe { position:absolute; left:0; top:0; width:100%; height:100%; border:0 }
.fcyt-stage.fcyt-stage-short { background:#0f0f0f radial-gradient(ellipse at center, #2a2a2a 0%, #0f0f0f 70%); padding:14px 0 }
.fcyt-stage.fcyt-stage-short .fc-yt-player { max-width:400px; margin:0 auto; border-radius:8px; overflow:hidden }
@supports (aspect-ratio: 9 / 16) { .fcyt-stage.fcyt-stage-short .fc-yt-player { padding-bottom:0; height:auto; aspect-ratio:9/16 } }
.fcyt-v-head { margin:0 0 10px }
.fcyt-v-title { margin:0 0 6px; font-size:20px; line-height:1.4; font-weight:bold; color:var(--yt-text); word-break:keep-all }
.fcyt-v-meta { display:flex; flex-wrap:wrap; gap:4px 6px; align-items:center; font-size:13px; color:var(--yt-sub) }
.fcyt-v-meta .fcyt-badge { margin-left:4px }
.fcyt-v-cate { margin-left:6px; color:var(--yt-link) !important; font-weight:500 }
.fcyt-v-channel { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:12px 0; border-top:1px solid var(--yt-line); border-bottom:1px solid var(--yt-line) }
.fcyt-v-avatar { width:44px; height:44px; border-radius:50%; object-fit:cover; background:#ddd; flex:0 0 44px }
.fcyt-v-avatar-empty { display:inline-flex; align-items:center; justify-content:center; background:var(--yt-red); color:#fff; font-size:20px }
.fcyt-v-chinfo { min-width:0; flex:1 }
.fcyt-v-chname { display:block; font-size:15px; font-weight:bold; color:var(--yt-text) !important; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.fcyt-v-chname:hover { text-decoration:underline }
.fcyt-v-chsub { font-size:12px; color:var(--yt-sub); margin-top:2px }
.fcyt-v-chbtns { display:flex; gap:8px; flex-wrap:wrap; margin-left:auto }
.fcyt-v-actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:12px 0; position:relative }
.fcyt-v-actions .fcyt-like strong { font-weight:bold }
.fcyt-liked-msg { display:none; position:absolute; left:0; top:-30px; padding:6px 12px; border-radius:6px; background:var(--yt-chip-on); color:var(--yt-ontext); font-size:12px; font-weight:normal }
.fcyt-v-files ul { list-style:none; margin:0 0 10px; padding:0 }
.fcyt-v-files li { padding:6px 10px; border-radius:8px; background:var(--yt-file); margin-bottom:4px; font-size:13px }
.fcyt-v-files a { color:var(--yt-text) }
.fcyt-v-body { margin:0 0 20px }
.fcyt-v-desc { position:relative; padding:12px 14px; border-radius:8px; background:var(--yt-chip); font-size:14px; line-height:1.75; color:var(--yt-text) }
.fcyt-v-desc-inner { word-break:break-word; overflow:hidden }
.fcyt-v-desc.fcyt-collapsed .fcyt-v-desc-inner { max-height:150px; -webkit-mask-image:linear-gradient(#000 60%, transparent); mask-image:linear-gradient(#000 60%, transparent) }
.fcyt-v-desc a { color:var(--yt-link); word-break:break-all }
.fcyt-v-desc a:hover { text-decoration:underline }
.fcyt-v-more { display:inline-block; margin-top:6px; padding:0; border:0; background:none; color:var(--yt-text); font-weight:bold; font-size:13px; cursor:pointer; font-family:inherit }
.fcyt-v-more:hover { text-decoration:underline }
.fcyt-v-nodesc { color:#999 }
.fcyt-v-sign { margin:10px 0; color:var(--yt-sub) }
#bo_v_img img { max-width:100%; height:auto; border-radius:8px; margin-bottom:10px }
/* 본문 안 레거시 플레이어 (영상 글이 아닌 경우 대비) */
#bo_v_con .fc-yt-player { position:relative; width:100%; height:0; padding-bottom:56.25%; background:#000; margin:0 0 12px; border-radius:8px; overflow:hidden }
#bo_v_con .fc-yt-player iframe { position:absolute; left:0; top:0; width:100%; height:100%; border:0 }
#bo_v_con .fc-yt-meta { font-size:12px; color:var(--yt-sub); margin:0 0 10px }
#bo_v_con .fc-yt-links a { display:inline-block; margin:0 8px 8px 0; padding:7px 14px; border-radius:6px; background:var(--yt-chip); color:var(--yt-text); font-size:12px; font-weight:bold }
/* 댓글 영역 라운드 처리 */
.fcyt-view #bo_vc { border-radius:8px }
html[data-fcyt-theme="dark"] .fcyt-view #bo_vc { background:#1f1f1f; border-color:#3f3f3f; color:#f1f1f1 }
html[data-fcyt-theme="dark"] .fcyt-view #bo_vc a, html[data-fcyt-theme="dark"] .fcyt-view #bo_vc p { color:#f1f1f1 }
html[data-fcyt-theme="dark"] .fcyt-view #bo_vc_w textarea { background:#121212; color:#f1f1f1; border-color:#3f3f3f }
.fcyt-view #bo_vc_w .btn_submit { height:34px; padding:0 16px; border-radius:6px; background:var(--yt-chip-on); color:var(--yt-ontext); font-weight:bold; border:0; cursor:pointer }
/* 테마 전역 #bo_v_title 규칙보다 우선 */
.fcyt-view h1#bo_v_title.fcyt-v-title { margin:0 0 6px; padding:0; font-size:20px; line-height:1.4; font-weight:bold; text-align:left; color:var(--yt-text); border:0; background:none }
.fcyt-view .fcyt-v-head { text-align:left }

/* 테마 다크 모드(쿠키 mode=dark, dark.css) 연동: 스킨 JS가 html[data-fcyt-theme=dark]를 붙인다 */
html[data-fcyt-theme="dark"] .fcyt-board, html[data-fcyt-theme="dark"] .fcyt-mboard, html[data-fcyt-theme="dark"] .fcyt-view { --yt-text:#f1f1f1; --yt-sub:#aaaaaa; --yt-chip:#272727; --yt-chip-hover:#3f3f3f; --yt-chip-on:#f1f1f1; --yt-ontext:#0f0f0f; --yt-line:#3f3f3f; --yt-bg:#0f0f0f; --yt-panel:#1f1f1f; --yt-link:#3ea6ff; --yt-file:#1f1f1f }
html[data-fcyt-theme="dark"] .fcyt-stage { background:#000 }
html[data-fcyt-theme="dark"] .fcyt-thumb { background:#000 }
html[data-fcyt-theme="dark"] .fcyt-v-channel, html[data-fcyt-theme="dark"] .fcyt-v-actions, html[data-fcyt-theme="dark"] .fcyt-toolbar, html[data-fcyt-theme="dark"] .fcyt-bottom { border-color:#3f3f3f }
html[data-fcyt-theme="dark"] .fcyt-search-input::placeholder { color:#888 }

/* 채널 칩: 원형 채널 이미지 */
.fcyt-chip { display:inline-flex; align-items:center; gap:7px }
.fcyt-chip-avatar { width:22px; height:22px; border-radius:50%; object-fit:cover; background:#ddd; margin-left:-4px }
.fcyt-chip-all i { color:var(--yt-red) }
.fcyt-chip.on .fcyt-chip-all i, .fcyt-chip-all.on i { color:var(--yt-ontext) }
/* 댓글 입력: 글상자 + 버튼이 컨테이너 안에 들어오도록 */
.fcyt-view #bo_vc_w { padding:12px 0 0; border:0; background:none }
.fcyt-view #bo_vc_w .c_write { display:flex; gap:10px; align-items:stretch; width:100%; box-sizing:border-box }
.fcyt-view #bo_vc_w .c_textarea { flex:1; min-width:0; position:relative; margin:0; width:auto }
.fcyt-view #bo_vc_w .c_textarea textarea { width:100% !important; box-sizing:border-box; min-height:84px; border:1px solid var(--yt-line); border-radius:8px; padding:10px 12px; background:var(--yt-bg); color:var(--yt-text); resize:vertical; margin:0; font-size:14px }
.fcyt-view #bo_vc_w #char_cnt { position:absolute; right:10px; bottom:8px; font-size:11px; color:var(--yt-sub); font-weight:normal }
.fcyt-view #bo_vc_w .btn_submit { flex:0 0 auto; align-self:stretch; height:auto; min-height:84px; padding:0 18px; border-radius:8px; background:var(--yt-chip-on); color:var(--yt-ontext); font-weight:bold; border:0; cursor:pointer; white-space:nowrap; font-size:13px; margin:0; position:static; float:none }
.fcyt-view #bo_vc_w .btn_submit:hover { opacity:.9 }
.fcyt-view #bo_vc { margin:16px 0 0; padding:14px 16px; border:1px solid var(--yt-line); background:var(--yt-panel); border-radius:8px }
.fcyt-view #bo_vc h2 { margin:0 0 8px; font-size:14px }
/* 기본 스킨의 header 상하 검정 선 제거 (유튜브 스타일 유지) */
#bo_v.fcyt-view header.fcyt-v-head { border:0; padding:0; margin:0 0 10px }
.fcyt-view #bo_vc.fcyt-nocmt { display:none }
/* 테마(dark.css)가 header/제목에 주는 배경·색을 스킨 변수로 통일 */
#bo_v.fcyt-view header.fcyt-v-head, #bo_v.fcyt-view h1#bo_v_title.fcyt-v-title, .fcyt-view .fcyt-v-meta { background:transparent !important; color:var(--yt-text) }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view header.fcyt-v-head, html[data-fcyt-theme="dark"] #bo_v.fcyt-view h1#bo_v_title.fcyt-v-title { background:transparent !important; color:#f1f1f1 !important }
html[data-fcyt-theme="dark"] .fcyt-view .fcyt-v-meta { color:#aaa }

/* 메타 줄: 구분점 정렬 */
.fcyt-v-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px 0; font-size:13px; color:var(--yt-sub); line-height:1.4 }
.fcyt-v-meta .m { display:inline-flex; align-items:center; white-space:nowrap }
.fcyt-v-meta .m + .m:before { content:'·'; margin:0 7px; color:#aaa }
.fcyt-v-meta .fcyt-badge { margin-left:10px }
.fcyt-v-meta .fcyt-v-cate { margin-left:10px }
.fcyt-v-head { margin:4px 0 12px }
/* 댓글 입력: 테마의 #bo_v #bo_vc_w 규칙보다 우선 */
#bo_v.fcyt-view #bo_vc_w { margin:14px 0 20px !important; padding:0 !important; border:0; background:none }
#bo_v.fcyt-view #bo_vc_w .c_write { display:flex; gap:10px; align-items:stretch; width:100%; box-sizing:border-box; position:static }
#bo_v.fcyt-view #bo_vc_w .c_textarea { flex:1; min-width:0; position:relative; margin:0 !important; width:auto }
#bo_v.fcyt-view #bo_vc_w .c_textarea textarea { width:100% !important; box-sizing:border-box; min-height:84px; height:84px; border:1px solid var(--yt-line); border-radius:8px; padding:10px 12px; background:var(--yt-bg); color:var(--yt-text); resize:vertical; margin:0; font-size:14px }
#bo_v.fcyt-view #bo_vc_w .btn_submit, #bo_v.fcyt-view #bo_vc_w input.btn_submit { position:static !important; float:none; flex:0 0 auto; width:auto !important; min-width:96px; height:auto !important; min-height:84px; line-height:1.4 !important; padding:0 18px !important; border-radius:8px; background:var(--yt-chip-on) !important; color:var(--yt-ontext) !important; font:bold 13px/1.4 inherit !important; font-family:inherit !important; border:0; cursor:pointer; white-space:nowrap; margin:0 }
#bo_v.fcyt-view #bo_vc_w #char_cnt { position:absolute; right:10px; bottom:8px; font-size:11px; color:var(--yt-sub); font-weight:normal }
/* 카드 메타: 한 줄 정렬 */
.fcyt-meta { display:flex; flex-direction:column; gap:2px }
.fcyt-meta .fcyt-row { display:flex; align-items:center; gap:6px; white-space:nowrap; overflow:hidden }
.fcyt-meta .fcyt-row .fcyt-stat { overflow:hidden; text-overflow:ellipsis }
.fcyt-meta .fcyt-new { margin:0 }
.fcyt-meta .fcyt-cmt { margin:0 }
/* ===== 글쓰기 ===== */
.fcyt-write { padding:0 28px 30px; box-sizing:border-box }
.fcyt-write * { box-sizing:border-box }
.fcyt-w-title { font-size:18px; margin:10px 0 14px; display:flex; align-items:center; gap:8px }
.fcyt-w-title i { color:var(--yt-red, #f00) }
.fcyt-w-card { border:1px solid #e5e5e5; border-radius:8px; padding:16px 18px; margin:0 0 14px; background:#fff }
.fcyt-w-video { border-color:#ffb3ad; background:#fff8f7 }
.fcyt-w-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 12px }
.fcyt-w-head b { font-size:15px }
.fcyt-w-head small { font-weight:normal; color:#777; font-size:12px }
.fcyt-w-step { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:6px; background:#0f0f0f; color:#fff; font-size:12px; font-weight:bold }
.fcyt-w-video .fcyt-w-step { background:#f00 }
.fcyt-w-sub { font-size:12px; color:#777; flex-basis:100%; line-height:1.6 }
.fcyt-w-row { display:flex; gap:8px }
.fcyt-w-input { width:100%; height:40px; padding:0 12px; border:1px solid #ccc !important; border-radius:6px; background:#fff !important; font-size:14px; color:#0f0f0f; font-family:inherit }
.fcyt-w-input:focus { border-color:#f00 !important; outline:none }
select.fcyt-w-input { padding:0 8px }
.fcyt-w-preview { display:flex; gap:12px; align-items:center; margin:10px 0 0; padding:10px; border:1px solid #f1d4d1; border-radius:6px; background:#fff }
.fcyt-w-preview img { width:128px; height:72px; object-fit:cover; border-radius:4px; background:#000 }
.fcyt-w-preview-text { display:flex; flex-direction:column; gap:3px; font-size:12px; color:#555 }
.fcyt-w-preview-text b { font-size:13px; color:#0f0f0f }
.fcyt-w-check { display:flex; align-items:center; gap:6px; margin:10px 0 0; font-size:13px; cursor:pointer }
.fcyt-w-warn { margin:8px 0 0; font-size:12px; color:#c62828 }
.fcyt-w-warn a { color:#c62828; text-decoration:underline }
.fcyt-w-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px 16px }
.fcyt-w-field { display:flex; flex-direction:column; gap:6px; font-size:13px }
.fcyt-w-field.fcyt-w-wide { grid-column:1 / -1 }
.fcyt-w-label { font-size:12px; color:#555; font-weight:bold }
.fcyt-w-opts span label { margin-right:14px; font-size:13px }
.fcyt-w-editor { position:relative }
.fcyt-w-editor textarea { width:100%; min-height:200px; border:1px solid #ccc; border-radius:6px; padding:10px; font-size:14px }
.fcyt-w-count { position:absolute; right:0; top:-26px; font-size:11px; color:#777; font-weight:normal }
.fcyt-w-actions { display:flex; gap:10px; justify-content:center; margin:18px 0 10px }
.fcyt-w-actions .fcyt-pill { height:42px; padding:0 24px; font-size:14px }
button.fcyt-pill { font-family:inherit }
@media (max-width:768px) { .fcyt-w-grid { grid-template-columns:1fr } .fcyt-write { padding:0 12px 20px } }

/* 제목 줄: [Shorts] 제목 #채널  /  메타 줄: 등록일 · 길이 ... 조회(우측) */
#bo_v.fcyt-view h1#bo_v_title.fcyt-v-title { display:flex; align-items:center; flex-wrap:wrap; gap:8px 10px }
.fcyt-v-title .fcyt-badge { flex:0 0 auto; font-size:12px; line-height:20px; padding:0 8px }
.fcyt-v-title .fcyt-v-title-text { min-width:0 }
.fcyt-v-title .fcyt-v-cate { margin-left:0; font-size:13px; font-weight:500; white-space:nowrap }
.fcyt-v-meta { display:flex; align-items:center; flex-wrap:wrap; gap:6px 0 }
.fcyt-v-meta .m, .fcyt-v-meta .r { display:inline-flex; align-items:center; line-height:1; white-space:nowrap }
.fcyt-v-meta .m i, .fcyt-v-meta .r i { margin-right:5px; font-size:12px; line-height:1; position:relative; top:0 }
.fcyt-v-meta .r { margin-left:auto; color:var(--yt-sub) }
.fcyt-v-meta .fcyt-badge, .fcyt-v-meta .fcyt-v-cate { display:none }
.fcyt-v-channel { border-bottom:0; padding-bottom:4px }
.fcyt-v-actions { border-top:1px solid var(--yt-line); border-bottom:1px solid var(--yt-line); margin:0 0 14px }
/* 댓글 등록 버튼 글자 가로·세로 가운데 */
#bo_v.fcyt-view #bo_vc_w .btn_submit, #bo_v.fcyt-view #bo_vc_w input.btn_submit { text-align:center !important; text-indent:0 !important; height:84px !important; min-height:84px; line-height:84px !important; padding:0 16px !important; letter-spacing:0; box-sizing:border-box; display:block }
/* 댓글 입력: 글상자 아래에 가로 전체 버튼 (잘림 방지) */
#bo_v.fcyt-view #bo_vc_w .c_write { display:block !important; width:100%; position:static }
#bo_v.fcyt-view #bo_vc_w .c_textarea { width:100% !important; margin:0 !important }
#bo_v.fcyt-view #bo_vc_w .c_textarea textarea { width:100% !important; min-height:90px; height:90px }
#bo_v.fcyt-view #bo_vc_w .btn_submit, #bo_v.fcyt-view #bo_vc_w input.btn_submit { display:block !important; width:100% !important; min-width:0; height:42px !important; min-height:42px; line-height:42px !important; margin:8px 0 0 !important; padding:0 !important; text-align:center !important; position:static !important; float:none; box-sizing:border-box }
/* 제목 행 오른쪽 끝에 메타(등록일 · 길이 · 조회) 정렬 */
#bo_v.fcyt-view header.fcyt-v-head { display:flex; align-items:center; flex-wrap:wrap; gap:8px 18px; margin:6px 0 14px }
#bo_v.fcyt-view h1#bo_v_title.fcyt-v-title { flex:1 1 420px; margin:0; min-width:0 }
.fcyt-v-head .fcyt-v-meta { flex:0 0 auto; margin-left:auto; white-space:nowrap; gap:0 }
.fcyt-v-meta .r { margin-left:0 }

/* ---- view header: badge + title + inline channel chip; meta as icon chips at the top right ---- */
#bo_v.fcyt-view header.fcyt-v-head { display:flex; align-items:flex-start; flex-wrap:nowrap; gap:10px 20px; margin:8px 0 14px }
#bo_v.fcyt-view h1#bo_v_title.fcyt-v-title { display:block; flex:1 1 auto; min-width:0; margin:0; font-size:21px; line-height:1.4; word-break:keep-all }
#bo_v.fcyt-view .fcyt-v-title .fcyt-badge { display:inline-flex; align-items:center; gap:4px; vertical-align:middle; position:relative; top:-2px; margin:0 8px 0 0; height:22px; line-height:22px; padding:0 8px; font-size:12px }
#bo_v.fcyt-view .fcyt-v-title .fcyt-v-title-text { display:inline }
#bo_v.fcyt-view .fcyt-v-title .fcyt-v-cate { display:inline-flex; align-items:center; gap:6px; vertical-align:middle; position:relative; top:-2px; margin:0 0 0 10px; height:26px; padding:0 11px 0 4px; border-radius:13px; background:rgba(0,0,0,.06); color:var(--yt-text) !important; font-size:13px; font-weight:600; white-space:nowrap; text-decoration:none !important; transition:background .15s }
#bo_v.fcyt-view .fcyt-v-title .fcyt-v-cate:hover { background:rgba(0,0,0,.12) }
#bo_v.fcyt-view .fcyt-v-title .fcyt-v-cate.fcyt-v-cate-noav { padding-left:11px }
#bo_v.fcyt-view .fcyt-v-cate-av { width:20px; height:20px; border-radius:50%; object-fit:cover; background:#ddd; flex:0 0 20px }
#bo_v.fcyt-view .fcyt-v-cate-hash { color:var(--yt-link); font-weight:700; margin-right:-3px }
#bo_v.fcyt-view .fcyt-v-head .fcyt-v-meta { flex:0 0 auto; margin:2px 0 0 auto; display:flex; align-items:center; gap:6px; white-space:nowrap }
#bo_v.fcyt-view .fcyt-v-meta .m, #bo_v.fcyt-view .fcyt-v-meta .r { display:inline-flex; align-items:center; gap:5px; height:26px; padding:0 10px; border-radius:13px; background:rgba(0,0,0,.06); color:var(--yt-sub); font-size:12.5px; line-height:1; margin:0 }
#bo_v.fcyt-view .fcyt-v-meta .m + .m:before { content:none; margin:0 }
#bo_v.fcyt-view .fcyt-v-meta .m i, #bo_v.fcyt-view .fcyt-v-meta .r i { margin:0; font-size:12px; opacity:.85; position:static }
#bo_v.fcyt-view .fcyt-v-meta .m b { font-weight:600; color:var(--yt-text) }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-title .fcyt-v-cate, html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .m, html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .r { background:rgba(255,255,255,.1); color:#f1f1f1 }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .m b { color:#f1f1f1 }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-title .fcyt-v-cate:hover { background:rgba(255,255,255,.2) }
@media (max-width:760px) {
  #bo_v.fcyt-view header.fcyt-v-head { flex-wrap:wrap; gap:8px 0 }
  #bo_v.fcyt-view h1#bo_v_title.fcyt-v-title { flex:1 1 100%; font-size:18px }
  #bo_v.fcyt-view .fcyt-v-head .fcyt-v-meta { margin-left:0; flex-wrap:wrap }
}


/* Japanese titles have no word spaces: keep-all would wrap a whole sentence at once */
#bo_v.fcyt-view[lang="ja"] h1#bo_v_title.fcyt-v-title { word-break:normal; overflow-wrap:anywhere; line-break:strict }

/* ---- view meta: one rounded group, compact single row (icon · caption · value) ---- */
#bo_v.fcyt-view .fcyt-v-head .fcyt-v-meta { display:inline-flex; align-items:stretch; gap:0; margin:0 0 0 auto; padding:0; border:1px solid var(--yt-line, #e3e3e3); border-radius:10px; background:var(--yt-bg, #fff); overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,.05) }
#bo_v.fcyt-view .fcyt-v-meta .m, #bo_v.fcyt-view .fcyt-v-meta .r { display:inline-flex; align-items:center; gap:7px; height:32px; padding:0 12px 0 8px; border-radius:0; background:transparent; margin:0; color:var(--yt-text); font-size:13px; line-height:1; white-space:nowrap }
#bo_v.fcyt-view .fcyt-v-meta .m + .m { border-left:1px solid var(--yt-line, #e3e3e3) }
#bo_v.fcyt-view .fcyt-v-meta .m i, #bo_v.fcyt-view .fcyt-v-meta .r i { width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:11px; margin:0; opacity:1; flex:0 0 22px }
#bo_v.fcyt-view .fcyt-v-meta .m-date i { background:#e8f0fe; color:#1a73e8 }
#bo_v.fcyt-view .fcyt-v-meta .m-len i { background:#efe7fd; color:#6f42c1 }
#bo_v.fcyt-view .fcyt-v-meta .m-views i { background:#fdeaea; color:#e62117 }
#bo_v.fcyt-view .fcyt-v-meta .t { display:inline-flex; flex-direction:row; align-items:baseline; gap:5px; line-height:1; min-width:0 }
#bo_v.fcyt-view .fcyt-v-meta .t small { font-size:12px; font-weight:normal; color:var(--yt-sub); letter-spacing:0; white-space:nowrap }
#bo_v.fcyt-view .fcyt-v-meta .t b { font-size:13px; font-weight:700; color:var(--yt-text); white-space:nowrap }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-head .fcyt-v-meta { border-color:rgba(255,255,255,.14); background:#212121; box-shadow:none }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .m, html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .r { background:transparent; color:#f1f1f1 }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .m + .m { border-left-color:rgba(255,255,255,.14) }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .m-date i { background:rgba(26,115,232,.22); color:#8ab4f8 }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .m-len i { background:rgba(111,66,193,.28); color:#c7a6ff }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .m-views i { background:rgba(230,33,23,.24); color:#ff7a72 }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .t small { color:#aaa }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-meta .t b { color:#f1f1f1 }
@media (max-width:760px) { #bo_v.fcyt-view .fcyt-v-meta .m, #bo_v.fcyt-view .fcyt-v-meta .r { height:30px; padding:0 10px 0 7px; gap:6px; font-size:12px } #bo_v.fcyt-view .fcyt-v-meta .m i, #bo_v.fcyt-view .fcyt-v-meta .r i { width:20px; height:20px; flex-basis:20px; font-size:10px } #bo_v.fcyt-view .fcyt-v-meta .t small { font-size:11px } #bo_v.fcyt-view .fcyt-v-meta .t b { font-size:12px } }
@media (max-width:480px) { #bo_v.fcyt-view .fcyt-v-meta .t small { display:none } }

/* ---- view header v4: full-width single-line title; channel chip + meta group on the row below ---- */
#bo_v.fcyt-view header.fcyt-v-head { display:block; margin:8px 0 14px }
#bo_v.fcyt-view h1#bo_v_title.fcyt-v-title { display:block; margin:0; font-size:21px; line-height:1.4; min-width:0 }
#bo_v.fcyt-view .fcyt-v-sub { display:flex; align-items:center; gap:12px; margin-top:9px; min-width:0 }
#bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate { display:inline-flex; align-items:center; gap:6px; position:static; margin:0; height:30px; padding:0 13px 0 4px; border-radius:15px; background:rgba(0,0,0,.06); color:var(--yt-text) !important; font-size:13px; font-weight:600; white-space:nowrap; text-decoration:none !important; max-width:60%; overflow:hidden; text-overflow:ellipsis; transition:background .15s }
#bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate:hover { background:rgba(0,0,0,.12) }
#bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate.fcyt-v-cate-noav { padding-left:13px }
#bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate-av { width:22px; height:22px; flex:0 0 22px }
#bo_v.fcyt-view .fcyt-v-sub .fcyt-v-meta { margin-left:auto }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate { background:rgba(255,255,255,.1); color:#f1f1f1 !important }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate:hover { background:rgba(255,255,255,.2) }
@media (max-width:760px) {
  #bo_v.fcyt-view h1#bo_v_title.fcyt-v-title { font-size:18px }
  #bo_v.fcyt-view .fcyt-v-sub { flex-wrap:wrap; gap:8px }
  #bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate { max-width:100% }
  #bo_v.fcyt-view .fcyt-v-sub .fcyt-v-meta { margin-left:0 }
}

/* ---- player stage follows the theme: white in light mode, black in dark mode ---- */
#bo_v.fcyt-view .fcyt-stage, #bo_v.fcyt-view .fcyt-stage.fcyt-stage-short { background:var(--yt-bg, #fff); border:1px solid var(--yt-line, #e5e5e5); box-shadow:none }
#bo_v.fcyt-view .fcyt-stage .fc-yt-player, #bo_v.fcyt-view .fcyt-stage.fcyt-stage-short .fc-yt-player { background:transparent }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-stage, html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-stage.fcyt-stage-short { background:#000; border-color:#000 }

/* ---- channel row: info never squeezes into a vertical column; on phones the two buttons share a full row ---- */
#bo_v.fcyt-view .fcyt-v-chinfo { flex:1 1 220px; min-width:0 }
#bo_v.fcyt-view .fcyt-v-chsub { white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
@media (max-width:760px) {
  #bo_v.fcyt-view .fcyt-v-channel { flex-wrap:wrap; row-gap:10px }
  #bo_v.fcyt-view .fcyt-v-chinfo { flex:1 1 calc(100% - 56px) }
  #bo_v.fcyt-view .fcyt-v-chbtns { flex:1 1 100%; margin-left:0; display:flex; flex-wrap:nowrap; gap:8px }
  #bo_v.fcyt-view .fcyt-v-chbtns .fcyt-pill { flex:1 1 0; justify-content:center; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
}

/* ---- channel row and description as outlined cards: theme background (white / dark), thin border, no gray fill ---- */
#bo_v.fcyt-view .fcyt-v-channel { border:1px solid var(--yt-line, #e5e5e5); border-radius:12px; padding:12px 14px; background:var(--yt-bg, #fff); margin:0 0 12px }
#bo_v.fcyt-view .fcyt-v-body { margin:0 0 12px }
#bo_v.fcyt-view .fcyt-v-desc { background:var(--yt-bg, #fff); border:1px solid var(--yt-line, #e5e5e5); border-radius:12px; padding:14px 16px }
#bo_v.fcyt-view .fcyt-v-actions { border-top:0; border-bottom:1px solid var(--yt-line, #e5e5e5); margin:0 0 14px }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-channel, html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-desc { background:var(--yt-bg, #0f0f0f); border-color:rgba(255,255,255,.14) }

/* ---- channel chips: transparent boxed pills instead of gray fill (the active chip stays solid) ---- */
.fcyt-chips .fcyt-chip:not(.on) { background:transparent; border:1px solid var(--yt-line, #e5e5e5) }
.fcyt-chips .fcyt-chip:not(.on):hover { background:rgba(0,0,0,.04); border-color:#c6c6c6 }
.fcyt-chips .fcyt-chip.on { border:1px solid var(--yt-chip-on, #0f0f0f) }
html[data-fcyt-theme="dark"] .fcyt-chips .fcyt-chip:not(.on) { background:transparent; border-color:rgba(255,255,255,.22) }
html[data-fcyt-theme="dark"] .fcyt-chips .fcyt-chip:not(.on):hover { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.4) }
/* view page: the #channel chip under the title gets the same transparent box */
#bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate { background:transparent; border:1px solid var(--yt-line, #e5e5e5) }
#bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate:hover { background:rgba(0,0,0,.04); border-color:#c6c6c6 }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate { background:transparent; border-color:rgba(255,255,255,.22) }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-sub .fcyt-v-cate:hover { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.4) }

/* ---- description "more / less" button: outlined pill instead of bare text ---- */
#bo_v.fcyt-view .fcyt-v-more { display:inline-flex; align-items:center; height:28px; margin-top:10px; padding:0 14px; border:1px solid var(--yt-line, #e5e5e5); border-radius:14px; background:transparent; color:var(--yt-text); font-size:12px; font-weight:600; line-height:1; cursor:pointer; transition:background .15s, border-color .15s }
#bo_v.fcyt-view .fcyt-v-more:hover { background:rgba(0,0,0,.04); border-color:#c6c6c6; text-decoration:none }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-more { border-color:rgba(255,255,255,.22); color:#f1f1f1 }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-more:hover { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.4) }

/* ---- "visit channel" button: colored (YouTube blue) with the channel avatar instead of a gray ghost pill ---- */
#bo_v.fcyt-view .fcyt-v-chbtns .fcyt-pill-ch { background:#065fd4; color:#fff !important; font-weight:bold; gap:8px; padding-left:10px }
#bo_v.fcyt-view .fcyt-v-chbtns .fcyt-pill-ch:hover { background:#0550b8 }
#bo_v.fcyt-view .fcyt-v-chbtns .fcyt-pill-ch i { font-size:16px; margin-left:2px }
#bo_v.fcyt-view .fcyt-pill-av { width:22px; height:22px; border-radius:50%; object-fit:cover; background:#fff; box-shadow:0 0 0 2px rgba(255,255,255,.45); flex:0 0 22px }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-chbtns .fcyt-pill-ch { background:#3ea6ff; color:#0f0f0f !important }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-v-chbtns .fcyt-pill-ch:hover { background:#6fbcff }
html[data-fcyt-theme="dark"] #bo_v.fcyt-view .fcyt-pill-av { box-shadow:0 0 0 2px rgba(0,0,0,.25) }
@media (max-width:760px) { #bo_v.fcyt-view .fcyt-v-chbtns .fcyt-pill-ch { padding-left:10px } }
