.yv-list { margin: 18px 0 24px; }
.yd-shell .yv-board .read_body .xe_content { color: #e9f0f7; }
.yd-shell .yv-board .read_body .xe_content :is(p, div, span, li, td, th, blockquote, h1, h2, h3, h4, h5, h6, strong, em, b, i, font) { color: inherit !important; }
.yd-shell .yv-board .read_body .xe_content a { color: #8fd7ff !important; }
.yv-layout-toggle { display: none; }
@media (max-width: 640px) {
  .yd-page-heading.yv-has-layout-toggle > strong { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .yd-page-heading .yv-layout-toggle { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 36px; height: 30px; margin-left: auto; padding: 4px; border: 1px solid #da5262; border-radius: 5px; background: #bd3347; color: #fff; cursor: pointer; }
  .yd-page-heading .yv-layout-toggle:hover,.yd-page-heading .yv-layout-toggle:focus-visible { background: #d84355; }
  .yv-layout-toggle svg { display: block; width: 20px; height: 20px; fill: currentColor; }
  .yv-list.yv-mobile-one-column[data-cat] .yv-grid { grid-template-columns: minmax(0, 1fr); }
}
.yv-popular { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:12px 0 15px; font-family:Pretendard,system-ui,-apple-system,sans-serif; }
.yv-popular-panel { min-width:0; border:1px solid #364655; background:#121923; color:#e9f0f7; }
.yv-popular-panel h2 { display:flex; align-items:center; justify-content:center; gap:9px; min-height:31px; margin:0; padding:4px 8px; background:#22303e; border-bottom:1px solid #364655; color:#fff; font-size:14px; font-weight:700; }
.yv-popular-panel h2 small { font-size:11px; color:#bdcad8; font-weight:500; }
.yv-popular-panel ol { list-style:none; margin:0; padding:5px 9px; }
.yv-popular-panel li { margin:0; padding:0; }
.yv-popular-panel li a { display:flex; align-items:center; gap:8px; min-width:0; padding:5px 3px; color:#e9f0f7; font-size:13px; line-height:20px; text-decoration:none; }
.yv-popular-panel li a:hover .yv-popular-title,.yv-popular-panel li a:focus-visible .yv-popular-title { color:#ff8088; text-decoration:underline; }
.yv-popular-rank { flex:none; display:grid; place-items:center; width:22px; height:20px; background:#344557; color:#fff; font-size:12px; font-weight:700; }
.yv-popular-rank--top { background:#dc2626; }
.yv-popular-title { flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.yv-popular-panel time { flex:none; width:40px; color:#a7b4c2; font-size:12px; text-align:right; }
.yv-popular-empty { margin:0; padding:11px; color:#a7b4c2; font-size:13px; text-align:center; }
.yv-list-controls { position:relative; z-index:12; display:flex; align-items:center; justify-content:center; gap:8px; min-width:0; margin:0 auto 10px; pointer-events:none; }
.yv-list-controls > * { pointer-events:auto; }
.list_footer .btnArea { float:none; position:absolute; top:0; right:0; margin:0; }
@media (max-width: 1050px) {
  .list_footer .btnArea { position:static; display:flex; flex-wrap:wrap; justify-content:center; gap:4px; width:100%; margin:0 0 10px; }
}
.yv-sort-bar { position:relative; display:flex; flex:none; align-items:center; gap:8px; margin:0; font-family:Pretendard,system-ui,-apple-system,sans-serif; }
.yv-sort-current { flex:none; color:#a7b4c2; font:500 12px Pretendard,system-ui,-apple-system,sans-serif; white-space:nowrap; }
.yv-sort { position:relative; }
.yv-sort summary { display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; min-width:51px; list-style:none; border:1px solid #da5262; border-radius:6px; background:#bd3347; color:#fff; padding:7px 10px; font-size:13px; font-weight:700; line-height:18px; text-align:center; cursor:pointer; }
.yv-sort summary::-webkit-details-marker { display:none; }
.yv-sort summary:hover,.yv-sort summary:focus-visible { background:#d84355; }
.yv-sort-menu { position:absolute; top:calc(100% + 6px); right:0; display:grid; min-width:144px; padding:5px; border:1px solid #526477; border-radius:7px; background:#1b2734; box-shadow:0 12px 24px #0009; }
.yv-sort-option { display:block; padding:8px 10px; border-radius:4px; color:#e9f0f7; font-size:13px; text-decoration:none; white-space:nowrap; }
.yv-sort-option:hover,.yv-sort-option:focus-visible,.yv-sort-option.is-active { background:#344557; color:#fff; }
.yv-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 12px; }
.yv-list[data-cat="1"] .yv-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.yv-card { position: relative; min-width: 0; padding: 6px; border: 1px solid #e4e8ee; border-radius: 10px; background: #fff; }
.yv-card-link { display: block; color: #1f2937; text-decoration: none; }
.yv-card-link:hover, .yv-card-link:focus { color: #b42318; }
.yv-thumb { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 7px; background: #18212c; }
.yv-list[data-cat="1"] .yv-thumb { aspect-ratio: 3 / 4; }
.yv-thumb img, .yv-thumb video { display: block; width: 100%; height: 100%; object-fit: cover; }
.yv-no-thumb { position: absolute; inset: 0; display: grid; place-items: center; color: #d3dce6; font-size: 13px; }
.yv-play { position: absolute; right: 10px; bottom: 10px; display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; background: rgba(0,0,0,.68); color: white; font-size: 13px; pointer-events: none; }
.yv-card-title { display: block; overflow: hidden; white-space: nowrap; min-height: 0; margin: 9px 3px 6px; line-height: 1.45; font-size: 14px; font-weight: 600; }
.yv-card-title-text { display: block; overflow: hidden; text-overflow: ellipsis; }
.yv-card-title.yv-title-scrolling .yv-card-title-text { width: max-content; overflow: visible; animation: yv-title-scroll var(--yv-title-duration) linear infinite alternate; }
@keyframes yv-title-scroll { from { transform: translateX(0); } to { transform: translateX(var(--yv-title-offset)); } }
@media (prefers-reduced-motion: reduce) { .yv-card-title.yv-title-scrolling .yv-card-title-text { width: auto; overflow: hidden; animation: none; } }
.yv-card-meta { display: flex; justify-content: flex-end; gap: 6px; padding: 0 3px 4px; color: #657184; font-size: 12px; }
.yv-card-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yv-empty { padding: 40px 10px; text-align: center; color: #667085; }
.yv-notices { margin-bottom: 12px; border-block: 1px solid #d8dfe8; }
.yv-notice { display: flex; gap: 12px; padding: 10px 8px; color: #243244; text-decoration: none; border-bottom: 1px solid #edf0f4; }
.yv-notice strong { flex: none; color: #bb231b; }
.yv-table-wrap { overflow-x: auto; }
.yv-table { width: 100%; border-collapse: collapse; }
.yv-table th, .yv-table td { padding: 11px 9px; border-bottom: 1px solid #e7ebf0; text-align: center; }
.yv-table th { background: #f4f6f8; color: #3e4b5c; }
.yv-table td:nth-child(2) { text-align: left; }
.yv-table td a { color: #243244; text-decoration: none; }
.yv-table td a:hover { color: #b42318; }
.yv-players { display: grid; gap: 18px; margin: 20px 0 26px; }
.yv-read .yv-players { margin-bottom: 13px; }
.yv-read .yv-player-banners--after { margin-top: 5px; margin-bottom: 5px; }
.yv-read .read_body { padding-top: 7px; padding-bottom: 7px; }
.yv-read .read_footer .tns { margin: 7px 0; }
.yv-read .read_footer .tags { height: auto; font-size: 11.5px; line-height: 17px; }
.yv-read .read_footer .tags .xi-tags { font-size: 15px; }
.yv-player { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px; background: #0b0f15; }
.yv-player video, .yv-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.yv-player video { object-fit: contain; }
.yv-player-poster { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.yv-player.yv-main-playing .yv-player-poster { display: none; }
.yv-center-play { position: absolute; top: 50%; left: 50%; z-index: 3; display: grid; place-items: center; width: clamp(66px, 9vw, 104px); aspect-ratio: 1; padding: 0; transform: translate(-50%, -50%); border: 0; border-radius: 50%; background: #f00; color: #fff; box-shadow: 0 8px 28px rgba(0,0,0,.5); cursor: pointer; }
.yv-center-play span { margin-left: .12em; font-size: clamp(28px, 4vw, 45px); line-height: 1; }
.yv-center-play:hover, .yv-center-play:focus-visible { background: #c00; outline: 3px solid #fff; outline-offset: 2px; }
.yv-center-play[hidden] { display: none; }
.yv-player.yv-playing-ad .yv-overlay-ad, .yv-player.yv-playing-ad .yv-center-play { display: none; }
.yv-video-ad { position: absolute; inset: 0; z-index: 12; display: flex; align-items: center; justify-content: center; background: #000; color: #fff; }
.yv-video-ad-body { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.yv-player .yv-video-ad-body video, .yv-video-ad-body img { position: static; display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; }
.yv-video-ad-label, .yv-video-ad-sound, .yv-video-ad-skip { position: absolute; z-index: 2; border: 1px solid #ffffff47; background: #000b; color: #fff; font-family: inherit; font-weight: 700; }
.yv-video-ad-label { top: 12px; left: 12px; padding: 5px 9px; border-radius: 4px; font-size: 12px; }
.yv-video-ad-sound { top: 12px; right: 12px; min-height: 34px; padding: 0 10px; border-radius: 20px; font-size: 12px; cursor: pointer; }
.yv-video-ad-sound[hidden] { display: none; }
.yv-video-ad-skip { right: 14px; bottom: 14px; min-width: 94px; min-height: 36px; padding: 0 14px; border-radius: 4px; font-size: 13px; cursor: pointer; }
.yv-video-ad-skip:disabled { color: #fffa; cursor: default; }
.yv-gallery { display: grid; gap: 12px; justify-items: center; margin: 22px auto; }
.yv-gallery img { display: block; max-width: 100%; height: auto; border-radius: 6px; }
.yv-read .yv-video-placeholder { display: none; }
.yv-meta-editor { margin: 18px 0 24px; padding: 20px; border: 1px solid #d9e1ea; border-radius: 10px; background: #f8fafc; color: #243244; }
.yv-meta-editor h2 { margin: 0 0 5px; font-size: 20px; }
.yv-meta-help { margin: 0 0 18px; color: #596779; line-height: 1.5; }
.yv-meta-field { display: grid; gap: 7px; margin: 0 0 17px; }
.yv-meta-field > label { font-weight: 700; }
.yv-meta-field input[type="url"], .yv-meta-field input[type="text"], .yv-meta-field textarea { box-sizing: border-box; width: 100%; max-width: none; padding: 10px 12px; border: 1px solid #bfcbd8; border-radius: 6px; background: #fff; color: #182230; font: inherit; }
.yv-meta-field textarea { min-height: 66px; resize: vertical; }
.yv-meta-field input:focus, .yv-meta-field textarea:focus { border-color: #2676ac; outline: 2px solid rgba(38,118,172,.17); }
.yv-meta-field small { color: #64748b; line-height: 1.45; }
.yv-thumb-options { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.yv-thumb-options label, .yv-check { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.yv-meta-editor input[type="file"] { padding: 8px 0; }
.yv-thumb-preview { display: flex; align-items: center; justify-content: center; width: min(100%, 320px); min-height: 120px; overflow: hidden; border: 1px dashed #bac7d7; border-radius: 7px; background: #e8edf3; color: #617084; }
.yv-thumb-preview img { display: none; width: 100%; max-height: 220px; object-fit: contain; }
.yv-preview-status { color: #415569; font-size: 13px; }
.yv-preview-status img, .yv-preview-status video { display: block; max-width: 180px; max-height: 110px; margin-top: 6px; border-radius: 4px; object-fit: contain; }
.yv-check { margin: 2px 0 13px; font-weight: 600; }
@media (max-width: 900px) { .yv-grid, .yv-list[data-cat="1"] .yv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .yv-grid, .yv-list[data-cat="1"] .yv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 6px; } .yv-card { padding: 4px; } .yv-card-title { font-size: 13px; } .yv-card-meta { font-size: 11px; } .yv-table th:first-child, .yv-table td:first-child, .yv-table th:last-child, .yv-table td:last-child { display: none; } .yv-meta-editor { padding: 14px; } }
@media (max-width: 640px) { .yv-popular { grid-template-columns:1fr; } }

@media (min-width: 641px) {
  .list_footer .board_search {
    float: none;
    clear: both;
    width: max-content;
    max-width: 100%;
    margin: 0;
  }
}

@media (max-width: 640px) {
  .list_footer .board_search {
    float: none;
    clear: both;
    display: flex;
    align-items: center;
    flex: 0 1 245px;
    min-width: 0;
    max-width: 245px;
    margin: 0;
  }
  .yv-list-controls { gap:6px; }
  .yv-sort-current { font-size:11px; }
  .yv-sort summary { min-width:44px; padding:3px 6px; font-size:12px; }
  .list_footer .board_search .search_input {
    display: block;
    flex: 1;
    min-width: 0;
  }
  .list_footer .board_search .iText,
  .list_footer .board_search .iText:focus {
    width: 100%;
  }
  .list_footer .board_search select {
    -webkit-appearance: none;
    appearance: none;
    flex: 0 0 auto;
    max-width: 45%;
    border-radius: 0;
    padding: 0 22px 0 6px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='none' stroke='%23d1dbe6' stroke-width='1.5' d='m1 1 4 4 4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 6px center;
  }
}

/* Give the document title and tags the same readable dark inputs as the video fields. */
.board .board_write .write_header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px;
}
.board .board_write .write_header select {
  height: 48px;
  padding: 0 10px;
  border-color: #526477;
  border-radius: 6px;
  background: #1b2734;
  color: #f4f8fc;
}
.board .board_write .yv-title-field {
  display: grid;
  flex: 1 1 360px;
  gap: 7px;
  min-width: min(100%, 260px);
}
.board .board_write .yv-title-field label,
.board .board_write .yv-tags-field .yv-write-label {
  display: block;
  margin: 0;
  padding: 0;
  color: #dce6f1;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}
.board .board_write .yv-title-field input.iText[name="title"] {
  width: 100%;
}
.board .board_write .yv-tags-field {
  display: inline-grid;
  gap: 7px;
  vertical-align: top;
}
.board .board_write .yv-tags-field .yv-write-help {
  display: block;
  color: #aebdcd;
  font-size: 13px;
  line-height: 1.45;
}
.board .board_write .write_header input.iText[name="title"],
.board .board_write .write_author input.iText[name="tags"] {
  box-sizing: border-box;
  height: 48px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid #526477;
  border-radius: 6px;
  background: #1b2734;
  color: #f4f8fc;
  font: 500 15px/46px Pretendard, system-ui, -apple-system, sans-serif;
  vertical-align: middle;
}
.board .board_write .write_header input.iText[name="title"]:focus,
.board .board_write .write_author input.iText[name="tags"]:focus {
  border-color: #ff626d;
  outline: 0;
  box-shadow: 0 0 0 3px #e33d4e36;
}
.board .board_write .write_author label[for="tags"] {
  color: #dce6f1;
}
@media (max-width: 640px) {
  .board .board_write .write_header input.iText[name="title"] {
    max-width: 100%;
  }
  .board .board_write .write_author input.iText[name="tags"] {
    max-width: calc(100vw - 48px);
  }
}