@charset "utf-8";

/* Shared Figma foundations for the four menu boards.  Individual layouts follow
   in the board-skin phase; this file intentionally does not change PHP markup. */
body.board-page {
  color:var(--color-gray-100, #121213);
  font-family:'IBM Plex Mono', 'Pretendard Variable', monospace;
}

/* Skin CSS is loaded before this file. Reassert the text stack without
   replacing Font Awesome, Material Icons, or skin-provided icon fonts. */
body.board-page :not(:where([class*="textggu--"], [class*="textggu--"] *, .blur-txt, .blur-txt *, .txt-box, .txt-box *)):not(.fa):not(.fas):not(.far):not(.fab):not(.fa-solid):not(.fa-regular):not(.fa-brands):not([class^="fa-"]):not([class*=" fa-"]):not(.material-icons):not([class^="icon-"]):not([class*=" icon-"]) {
  font-family:var(--site-text-font, 'IBM Plex Mono', 'Pretendard Variable', monospace) !important;
}

body.board-page #body > .fix-layout {
  box-sizing:border-box;
  width:min(1200px, 100%);
  max-width:1200px !important;
  margin:0 auto;
}
/* Keep the board body painted to the viewport bottom even when a thread is
   shorter than the available space. The 49px GNB remains outside this area. */
body.board-asdf #body > .fix-layout, body.board-joy #body > .fix-layout { display:flex; min-height:calc(100dvh - 49px); overflow:visible; }
.board-content-scroll { flex:1 1 auto; min-width:0; height:auto; overflow:visible; padding:24px; }
body.board-asdf .board-content-scroll > * { width:100%; }
.spirit-tabs { align-self:flex-start; position:fixed; z-index:10; top:49px; left:max(0px, calc((100vw - 1200px) / 2)); width:154px; min-width:154px; max-width:154px; height:calc(100dvh - 49px); box-sizing:border-box; padding:24px 8px; border-right:1px solid var(--color-gray-100,#121213); overflow:hidden; }
body.board-joy .board-content-scroll { margin-left:154px; }
.spirit-tabs a { display:block; box-sizing:border-box; width:100%; min-width:0; padding:8px; border-bottom:1px solid var(--color-gray-100,#121213); color:var(--color-gray-100,#121213); font-family:'Pretendard Variable',sans-serif !important; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-decoration:none; }
.spirit-tabs a.is-active { text-decoration:underline; }
.spirit-tabs > a:hover,
.spirit-tabs > a:focus-visible { text-decoration:underline; }
.spirit-tabs .spirit-tab-depth {
  display:flex;
  align-items:stretch;
  box-sizing:border-box;
  min-height:0;
  margin:0;
  width:100%;
  max-width:100%;
  padding:0 8px;
  border-bottom:0;
  border-left:0;
  font-size:12px;
  line-height:normal;
}
.spirit-tabs .spirit-tab-depth::before { content:''; display:block; flex:0 0 1px; width:1px; background:var(--color-gray-080,rgba(18,18,19,.8)); }
.spirit-tabs .spirit-tab-depth span { display:block; flex:1 1 auto; min-width:0; margin-left:10px; padding:4px 4px 4px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.spirit-tabs .spirit-tab-depth.is-active span { text-decoration:underline; }
.spirit-tabs .spirit-tab-depth:hover span,
.spirit-tabs .spirit-tab-depth:focus-visible span { text-decoration:underline; }
.spirit-tabs .spirit-tab-depth-group { width:100%; min-width:0; padding:8px 0; overflow:hidden; }

/* Spirit uses the Figma left rail as its sole category navigation. */
body.board-joy #navi_category { display:none; }
body.board-joy .board-content-scroll > :is(.board-skin-basic, #list, #log_list, #load_log_board) {
  width:100%;
  margin:0;
}
body.board-joy .board-content-scroll > :is(.ui-paging, .searc-sub-box, .bo_fx) {
  width:100%;
  margin:24px 0 0;
}

body.board-page :is(button, input, select, textarea) {
  font-family:'IBM Plex Mono', 'Pretendard Variable', monospace;
}

/* Board-list shell — shared without altering each skin's PHP output. */
body.board-page :is(.board-skin-basic, #list, #log_list, #load_log_board) {
  box-sizing:border-box;
  width:min(100% - 48px, 1000px);
  margin:48px auto;
}
body.board-page :is(.thread_wrap .thread-box, #list .item, #log_list .item) {
  border:1px solid var(--color-gray-100, #121213) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:rgba(255,255,255,.8) !important;
}
body.board-page :is(.thread_wrap .thread-box, #list .item, #log_list .item):hover {
  background:var(--color-white-100, #fff) !important;
}
/* Load list items are part of the pink board canvas, not translucent cards. */
body.board-bbs #log_list .item,
body.board-bbs #log_list .item:hover,
body.board-bbs #log_list .item:focus-within {
  background:transparent !important;
  transition:none !important;
  transform:none !important;
}
/* The Load skin's manager CSS assigns white panels to its comment area.
   Keep those panels on the same board canvas as the post. */
body.board-bbs #log_list .item :is(.ui-comment, .item-comment, .comment-list-wrapper, .item-comment-form-box, .bo_vc_w) {
  background:transparent !important;
}
/* Load typography: legacy skin and manager styles use individual hex colours.
   Keep the same hierarchy through the shared gray tokens instead. */
body.board-bbs #log_list .item {
  color:var(--color-gray-090) !important;
}
body.board-bbs #log_list .item :is(
  .ui-pic .pic-header .no,
  .ui-comment,
  .item-comment,
  .item-comment .co-content,
  .load-box,
  .load-box.title,
  .load_btn,
  input,
  textarea
) {
  color:var(--color-gray-090) !important;
}
body.board-bbs #log_list .item :is(
  .ui-pic .pic-header span.date,
  .item-comment .co-footer .date,
  .item-comment .co-header,
  .ui-remove-blind span,
  input::placeholder,
  textarea::placeholder
) {
  color:var(--color-gray-040) !important;
  opacity:1;
}
body.board-page :is(.ui-btn, .ui-mmb-button a, .bo_fx a) {
  border:1px solid var(--color-gray-100, #121213) !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--color-gray-100, #121213) !important;
  box-shadow:none !important;
}
body.board-page :is(.ui-btn, .ui-mmb-button a, .bo_fx a):hover {
  background:var(--color-gray-100, #121213) !important;
  color:var(--page-accent, var(--color-violet-100, #e4dbeb)) !important;
}
body.board-page :is(.ui-paging, .searc-sub-box, .bo_fx) {
  width:min(100% - 48px, 1000px);
  margin:24px auto;
}
body.board-page .empty_list, body.board-page .no-data {
  padding:40px 24px;
  border:1px solid var(--color-gray-100, #121213);
  text-align:center;
}

/* Diary / Spirit: threaded list skins. */
body.board-asdf .thread_wrap, body.board-joy .thread_wrap { margin-top:0; }
body.board-asdf .thread_wrap .thread-box, body.board-joy .thread_wrap .thread-box {
  margin:0 0 12px;
  padding:20px;
}
body.board-asdf .thread_wrap .thread_title, body.board-joy .thread_wrap .thread_title {
  font-size:14px;
  font-weight:600;
}
body.board-asdf .thread_wrap .date, body.board-joy .thread_wrap .date { opacity:.7; font-size:12px; }
body.board-asdf .type_list > .list-box > a, body.board-joy .type_list > .list-box > a { border-radius:0; box-shadow:none; }

/* Spirit thumbnail card — Figma node 6:1128. */
body.board-joy .type_list {
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:20px;
}
body.board-joy .type_list > .list-box {
  position:relative;
  z-index:0;
  width:auto;
  height:auto;
  aspect-ratio:233 / 300;
  border:0;
  overflow:visible;
}
body.board-joy .type_list > .list-box::before {
  content:'';
  position:absolute;
  z-index:0;
  top:6px;
  right:-6px;
  bottom:-6px;
  left:6px;
  box-sizing:border-box;
  border:0;
  background:var(--color-gray-090, rgba(18,18,19,.9));
}
body.board-joy .type_list > .list-box > a {
  position:relative;
  z-index:1;
  display:block;
  box-sizing:border-box;
  width:100%;
  height:100%;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  text-decoration:none;
  transform:translate(0, 0);
  transition:transform 280ms cubic-bezier(.22, 1, .36, 1), background-color 280ms cubic-bezier(.22, 1, .36, 1);
  will-change:transform;
}
body.board-joy .type_list > .list-box > a::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  box-sizing:border-box;
  border:1px solid var(--color-gray-080, rgba(18,18,19,.8));
  background:transparent;
  pointer-events:none;
}
body.board-joy .type_list > .list-box > a:hover,
body.board-joy .type_list > .list-box > a:focus-visible { transform:translate(5px, 5px); }
body.board-joy .type_list > .list-box .list_thumb {
  width:100%;
  height:100%;
  overflow:hidden;
  background:var(--color-gray-005, rgba(18,18,19,.05));
  transition:none;
}
body.board-joy .type_list > .list-box .list_thumb img {
  width:100%;
  height:100%;
  object-fit:cover;
  transform:none !important;
  transition:none !important;
}
body.board-joy .type_list > .list-box > a:hover .list_thumb { transform:none; }
body.board-joy .type_list > .list-box .list_title {
  position:absolute;
  bottom:0;
  left:0;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  width:100%;
  min-height:0;
  padding:8px;
  color:var(--color-white-100, #fff);
  background:var(--color-gray-080, rgba(18,18,19,.8));
  font-family:'Pretendard Variable', sans-serif !important;
  font-size:14px;
  font-weight:400;
  line-height:normal;
}
body.board-joy .type_list > .list-box .list_title span {
  display:block;
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  color:inherit;
  font-family:'Pretendard Variable', sans-serif !important;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.board-joy .type_list > .list-box > a:hover .list_title,
body.board-joy .type_list > .list-box > a:focus-visible .list_title {
  background:var(--color-gray-100, #121213);
}
@media (max-width:1000px) and (min-width:801px) {
  body.board-joy .type_list { grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

/* Spirit thread detail — Figma node 6:926. Kept separate from the thumbnail list. */
body.board-joy:has(#bo_v_bot) .board-skin-basic {
  width:100%; max-width:none; margin:0;
}
body.board-joy:has(#bo_v_bot) .thread_wrap { margin:0; }
body.board-joy:has(#bo_v_bot) .thread_wrap .thread-box {
  position:relative; margin:0; padding:0; border:0 !important; background:transparent !important;
}
body.board-joy:has(#bo_v_bot) .thread_cate {
  display:inline-flex; align-items:center; margin:0; padding:4px 6px;
  border-radius:0; background:var(--color-gray-100,#121213); color:var(--page-accent,var(--color-violet-100,#e4dbeb));
  font-size:12px;
}
body.board-joy:has(#bo_v_bot) .thread_info {
  display:flex; align-items:center; gap:8px; margin:0; padding:16px 8px;
}
body.board-joy:has(#bo_v_bot) .thread_info .name {
  margin:0; color:var(--color-gray-100,#121213); font-family:'Pretendard Variable',sans-serif !important;
  font-size:14px; font-weight:700;
}
body.board-joy:has(#bo_v_bot) .thread_info .date {
  opacity:1; color:var(--color-gray-040,rgba(18,18,19,.4)); font-family:'IBM Plex Mono',monospace !important; font-size:12px;
}
body.board-joy:has(#bo_v_bot) .thread_title { margin:0; padding:4px 8px; font-size:16px; }
body.board-joy:has(#bo_v_bot) .thread_title .txt-point { color:var(--color-gray-100,#121213); font-family:'Pretendard Variable',sans-serif !important; font-size:16px; font-weight:700; }
body.board-joy:has(#bo_v_bot) .thread_admin { top:16px; right:8px; display:flex; gap:10px; margin:0; }
body.board-joy:has(#bo_v_bot) .thread_admin a { margin:0; color:var(--color-gray-100,#121213); }
body.board-joy:has(#bo_v_bot) .thread_main { margin:0; padding:16px 8px; }
body.board-joy:has(#bo_v_bot) .thread_content { color:var(--color-gray-090,rgba(18,18,19,.9)); font-family:'IBM Plex Mono','Pretendard Variable',monospace !important; font-size:14px; }
body.board-joy:has(#bo_v_bot) .img_box_wrap { margin:0 0 16px !important; border-radius:0 !important; }
body.board-joy:has(#bo_v_bot) .img_box { border-radius:0 !important; }
body.board-joy:has(#bo_v_bot) :is(.wr_good,.thread_reply) { display:inline-flex; align-items:center; margin:8px 0 0 8px; color:var(--color-gray-090,rgba(18,18,19,.9)); }
body.board-joy:has(#bo_v_bot) .wr_good { margin-left:0; column-gap:8px; }
body.board-joy:has(#bo_v_bot) .thread_reply button { color:inherit; background:transparent; border:0; }
body.board-joy:has(#bo_v_bot) .wr_good a {
  color:inherit;
  background:transparent;
  border:1px solid var(--color-gray-090,rgba(18,18,19,.9));
  border-radius:999px;
}
body.board-joy:has(#bo_v_bot) .wr_good.is_good a {
  border-color:crimson;
  background:crimson;
}
body.board-joy:has(#bo_v_bot) .thread_co_wrap { margin:0; padding:0 0 0 10px; border-left:1px solid var(--color-gray-090,rgba(18,18,19,.9)); }
body.board-joy:has(#bo_v_bot) .thread_co { margin:0; }
body.board-joy:has(#bo_v_bot) .thread_co .thread-box { padding:0; }
/* 3depth: replies stored by the legacy skin in .board-comment-list, not in
   .thread_co_wrap. Give that separate tree its own 16px inset and line. */
body.board-joy:has(#bo_v_bot) .thread_co .board-comment-list {
  margin:0; padding:0;
}
body.board-joy:has(#bo_v_bot) .thread_co .board-comment-list > .thread-depth-3 {
  position:relative; margin:0 0 0 16px; padding:0 0 0 16px;
  border:0 !important;
  border-left:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
  border-radius:0 !important;
}
body.board-joy:has(#bo_v_bot) .thread_co .board-comment-list > .thread-depth-3.thread-depth-4 {
  margin-left:32px;
}
body.board-joy:has(#bo_v_bot) .thread_co .board-comment-list .co_head_wrap {
  display:flex; align-items:center; gap:8px; padding:16px 8px;
}
body.board-joy:has(#bo_v_bot) .thread_co .board-comment-list .co-name {
  color:var(--color-gray-100,#121213) !important; font-family:'Pretendard Variable',sans-serif !important; font-size:14px; font-weight:700;
}
body.board-joy:has(#bo_v_bot) .thread_co .board-comment-list .co-info {
  display:flex; flex:1; gap:10px; color:var(--color-gray-040,rgba(18,18,19,.4)) !important; font-size:12px;
}
body.board-joy:has(#bo_v_bot) .thread_co .board-comment-list .co-info :is(span,a) { color:var(--color-gray-040,rgba(18,18,19,.4)) !important; }
body.board-joy:has(#bo_v_bot) .thread_co .board-comment-list .co-content {
  padding:0 8px 16px; color:var(--color-gray-090,rgba(18,18,19,.9)) !important; font-family:'Pretendard Variable',sans-serif !important; font-size:14px;
}
/* Some legacy Spirit replies are direct children of the root comment list,
   not descendants of .thread_co. They use the same Figma 3depth treatment. */
body.board-page.board-joy #body .board-comment-list { margin:0; padding:0; }
body.board-page.board-joy #body .board-comment-list > .item {
  margin:0 0 0 16px !important;
  padding:0 0 0 16px !important;
  border:0 !important;
  border-left:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
  border-radius:0 !important;
  background:transparent !important;
}
body.board-page.board-joy #body .board-comment-list > .item + .item { margin-top:0 !important; }
body.board-page.board-joy #body .board-comment-list > .thread-depth-4 { margin-left:32px !important; }
body.board-page.board-joy #body .board-comment-list .co_head_wrap {
  display:flex; align-items:center; gap:8px; padding:16px 8px !important;
}
body.board-page.board-joy #body .board-comment-list .co-name { color:var(--color-gray-100,#121213) !important; }
body.board-page.board-joy #body .board-comment-list .co-info,
body.board-page.board-joy #body .board-comment-list .co-info :is(span,a) { color:var(--color-gray-040,rgba(18,18,19,.4)) !important; }
body.board-page.board-joy #body .board-comment-list .co-content {
  padding:0 8px 16px !important;
  color:var(--color-gray-090,rgba(18,18,19,.9)) !important;
}
body.board-joy:has(#bo_v_bot) :is(.thread_title .txt-point,.thread_content, .thread_content *:not(:where([class*="textggu--"], [class*="textggu--"] *, .blur-txt, .blur-txt *, .txt-box, .txt-box *))) { color:var(--color-gray-090,rgba(18,18,19,.9)); }
body.board-joy:has(#bo_v_bot) .thread_title .txt-point { color:var(--color-gray-100,#121213) !important; }
body.board-joy:has(#bo_v_bot) #bo_v_bot {
  display:flex; justify-content:space-between; gap:24px; margin-top:24px; padding:12px 0 0; border-top:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
}
body.board-joy:has(#bo_v_bot) :is(.bo_v_nb,.bo_v_com) { display:flex; flex-wrap:wrap; gap:8px; float:none; }
body.board-joy:has(#bo_v_bot) .bo_v_com { justify-content:flex-end; }
body.board-joy:has(#bo_v_bot) #bo_v_bot .ui-btn {
  height:auto; padding:6px 10px; border:1px solid var(--color-gray-090,rgba(18,18,19,.9)); color:var(--color-gray-100,#121213) !important;
  font-family:'Pretendard Variable',sans-serif !important; font-size:14px; line-height:130%;
}
body.board-joy:has(#bo_v_bot) #bo_v_bot .ui-btn:hover,
body.board-joy:has(#bo_v_bot) #bo_v_bot .ui-btn:focus-visible {
  background:var(--color-gray-090,rgba(18,18,19,.9)) !important;
  color:var(--page-accent,var(--color-violet-100,#e4dbeb)) !important;
}
@media (max-width:800px) {
  body.board-joy:has(#bo_v_bot) #bo_v_bot { display:block; }
  body.board-joy:has(#bo_v_bot) .bo_v_com { margin-top:8px; justify-content:flex-start; }
}

/* Diary's list already renders full threads.  Use the same open-thread layout
   as Spirit's detail view for both its list and detail routes. */
body.board-asdf .diary-intro {
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-end;
  position:fixed;
  z-index:10;
  top:49px;
  left:max(0px, calc((100vw - 1200px) / 2));
  box-sizing:border-box;
  width:300px;
  height:calc(100dvh - 49px);
  padding:24px;
  border-right:1px solid var(--color-gray-100,#121213);
}
body.board-asdf .diary-intro span {
  display:block;
  box-sizing:border-box;
  width:100%;
  padding:8px;
  color:var(--color-gray-100,#121213);
  font-family:'IBM Plex Mono',monospace !important;
  font-size:40px;
  font-weight:700;
  line-height:normal !important;
  letter-spacing:0;
  text-align:right;
}
body.board-asdf .board-content-scroll {
  display:flex;
  flex-direction:column;
  gap:24px;
  align-items:stretch;
  padding:24px;
  margin-left:300px;
  background:var(--color-violet-100,#e4dbeb);
}
/* The legacy skin subtracts an additional 48px from every board wrapper.
   Diary's Figma column already owns its 24px outer padding, so each thread
   must fill the remaining column without a second inset. */
body.board-page.board-asdf .board-content-scroll :is(.board-skin-basic,.thread_wrap,.thread-box,.thread_info) {
  box-sizing:border-box;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}
/* This selector deliberately includes .thread_wrap: the legacy list-box rule
   has the same nesting and would otherwise win over the open-thread style. */
body.board-page.board-asdf .thread_wrap .thread-box { position:relative; margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; }
body.board-page.board-asdf #body .thread_wrap > .thread-box.theme-box {
  background-color:transparent !important;
  border:0 !important;
}
/* The Diary listing is rendered as an open thread, not as a card list.
   Its skin hides metadata and adds list-only gutters, so reset those values
   with the same scope used by the legacy skin. */
body.board-page.board-asdf #body .board-skin-basic,
body.board-page.board-asdf #body .thread_wrap { margin:0 !important; }
body.board-page.board-asdf #body .thread_info { padding:16px 8px !important; }
body.board-page.board-asdf #body .thread_info .name {
  color:var(--color-gray-100,#121213) !important;
  font-family:'Pretendard Variable',sans-serif !important;
}
body.board-page.board-asdf #body .thread_info .date {
  color:var(--color-gray-040,rgba(18,18,19,.4)) !important;
  font-family:'IBM Plex Mono',monospace !important;
}
body.board-page.board-asdf #body .thread_title { margin:0 !important; padding:4px 8px !important; }
body.board-page.board-asdf #body .thread_title,
body.board-page.board-asdf #body .thread_title .txt-point { color:var(--color-gray-100,#121213) !important; }
body.board-page.board-asdf #body .thread_main { margin:0 !important; padding:16px 8px !important; color:var(--color-gray-090,rgba(18,18,19,.9)) !important; }
body.board-page.board-asdf #body .thread_content { padding:0 !important; color:var(--color-gray-090,rgba(18,18,19,.9)) !important; }
body.board-page.board-asdf #body .thread_content *:not(:where([class*="textggu--"], [class*="textggu--"] *, .blur-txt, .blur-txt *, .txt-box, .txt-box *)) { color:var(--color-gray-090,rgba(18,18,19,.9)) !important; }
body.board-page.board-asdf #body .thread_admin a { color:var(--color-gray-100,#121213) !important; }
body.board-page.board-asdf #body :is(.wr_good,.thread_reply),
body.board-page.board-asdf #body :is(.wr_good a,.thread_reply button) { color:var(--color-gray-090,rgba(18,18,19,.9)) !important; }
body.board-page.board-asdf #body .thread_co_wrap { margin:0 !important; padding:0 0 0 10px !important; }
body.board-page.board-asdf #body .thread-more {
  display:block;
  padding:8px 16px !important;
  color:var(--color-gray-050,rgba(18,18,19,.5)) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:14px;
  text-decoration:none;
}
body.board-page.board-asdf #body .thread-more:hover,
body.board-page.board-asdf #body .thread-more:focus-visible { color:var(--color-gray-100,#121213) !important; }
/* Comments can be emitted either inside .thread_co or directly by the legacy
   comment include. Cover both paths so the old dashed card never returns. */
body.board-page.board-asdf #body .board-comment-list { margin:0 !important; padding:0 !important; }
body.board-page.board-asdf #body .board-comment-list > .item {
  margin:0 0 0 16px !important;
  padding:0 0 0 16px !important;
  border:0 !important;
  border-left:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
  border-radius:0 !important;
  background:transparent !important;
}
body.board-page.board-asdf #body .board-comment-list > .item + .item { margin-top:0 !important; }
body.board-page.board-asdf #body .board-comment-list > .thread-depth-4 { margin-left:32px !important; }
body.board-page.board-asdf #body .co_head_wrap,
body.board-page.board-asdf #body .co-name { color:var(--color-gray-100,#121213) !important; }
body.board-page.board-asdf #body .co-info,
body.board-page.board-asdf #body .co-info :is(span,a) { color:var(--color-gray-040,rgba(18,18,19,.4)) !important; }
body.board-page.board-asdf #body .co-content,
body.board-page.board-asdf #body .co-content *:not(:where([class*="textggu--"], [class*="textggu--"] *, .blur-txt, .blur-txt *, .txt-box, .txt-box *)) { color:var(--color-gray-090,rgba(18,18,19,.9)) !important; }
/* 3depth comments come from a separate legacy include. Give their metadata
   and body the same 8px / 16px rhythm as every other thread level. */
body.board-page.board-asdf #body .board-comment-list .co_head_wrap {
  display:flex;
  align-items:center;
  gap:8px;
  padding:16px 8px !important;
}
body.board-page.board-asdf #body .board-comment-list .co-content {
  padding:0 8px 16px !important;
}
body.board-asdf .thread_cate { display:inline-flex; margin:0; padding:4px 6px; border-radius:0; background:var(--color-gray-100,#121213); color:var(--page-accent,var(--color-violet-100,#e4dbeb)); font-size:12px; }
body.board-asdf .thread_info { display:flex; align-items:center; gap:8px; margin:0; padding:16px 8px; }
body.board-asdf .thread_info .name { margin:0; color:var(--color-gray-100,#121213); font-family:'Pretendard Variable',sans-serif !important; font-size:14px; font-weight:700; }
body.board-asdf .thread_info .date { opacity:1; color:var(--color-gray-040,rgba(18,18,19,.4)); font-family:'IBM Plex Mono',monospace !important; font-size:12px; }
body.board-asdf .thread_title { margin:0; padding:4px 8px; font-size:16px; }
body.board-asdf .thread_title .txt-point { color:var(--color-gray-100,#121213) !important; font-family:'Pretendard Variable',sans-serif !important; font-size:16px; font-weight:700; }
body.board-asdf .thread_admin { top:16px; right:8px; display:flex; gap:10px; margin:0; }
body.board-asdf .thread_admin a { margin:0; color:var(--color-gray-100,#121213); }
/* Thread edit/delete text actions — shared by Diary and Spirit posts/comments. */
body.board-page:is(.board-asdf,.board-joy) #body .thread_admin a:hover,
body.board-page:is(.board-asdf,.board-joy) #body .thread_admin a:focus-visible,
body.board-page:is(.board-asdf,.board-joy) #body .co-info a:hover,
body.board-page:is(.board-asdf,.board-joy) #body .co-info a:focus-visible {
  color:var(--color-gray-060,rgba(18,18,19,.6)) !important;
}
body.board-page:is(.board-asdf,.board-joy) #body :is(.thread_admin a,.thread_bottom button,.thread_reply button,.wr_good:not(.is_good) a) {
  transition:color 160ms ease;
}
body.board-page:is(.board-asdf,.board-joy) #body :is(.thread_admin a,.thread_bottom button,.thread_reply button,.wr_good:not(.is_good) a):hover,
body.board-page:is(.board-asdf,.board-joy) #body :is(.thread_admin a,.thread_bottom button,.thread_reply button,.wr_good:not(.is_good) a):focus-visible {
  color:var(--color-gray-060,rgba(18,18,19,.6)) !important;
}
body.board-asdf .thread_main { margin:0; padding:16px 8px; }
body.board-asdf :is(.thread_content,.thread_content *:not(:where([class*="textggu--"], [class*="textggu--"] *, .blur-txt, .blur-txt *, .txt-box, .txt-box *))) { color:var(--color-gray-090,rgba(18,18,19,.9)); font-family:'Pretendard Variable',sans-serif !important; font-size:14px; }
body.board-asdf .thread_co_wrap { margin:0; padding:0 0 0 10px; border-left:1px solid var(--color-gray-090,rgba(18,18,19,.9)); }
body.board-asdf .thread_co { margin:0; }
body.board-asdf .thread_co .board-comment-list > .thread-depth-3 { margin:0 0 0 16px; padding:0 0 0 16px; border:0 !important; border-left:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important; border-radius:0 !important; }
body.board-asdf .thread_co .board-comment-list > .thread-depth-4 { margin-left:32px; }
body.board-asdf .thread_co .co_head_wrap { display:flex; gap:8px; padding:16px 8px; }
body.board-asdf .thread_co .co-name { color:var(--color-gray-100,#121213) !important; font-family:'Pretendard Variable',sans-serif !important; font-size:14px; font-weight:700; }
body.board-asdf .thread_co .co-info, body.board-asdf .thread_co .co-info :is(span,a) { color:var(--color-gray-040,rgba(18,18,19,.4)) !important; font-size:12px; }
body.board-asdf .thread_co .co-content { padding:0 8px 16px; color:var(--color-gray-090,rgba(18,18,19,.9)) !important; font-family:'Pretendard Variable',sans-serif !important; font-size:14px; }
body.board-asdf:has(#bo_v_bot) #bo_v_bot { display:flex; justify-content:space-between; gap:24px; margin-top:24px; padding:12px 0 0; border-top:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important; }
body.board-asdf:has(#bo_v_bot) :is(.bo_v_nb,.bo_v_com) { display:flex; flex-wrap:wrap; gap:8px; float:none; }
body.board-asdf:has(#bo_v_bot) .bo_v_com { justify-content:flex-end; }
body.board-asdf:has(#bo_v_bot) #bo_v_bot .ui-btn { height:auto; padding:6px 10px; border:1px solid var(--color-gray-090,rgba(18,18,19,.9)); color:var(--color-gray-100,#121213) !important; font-family:'Pretendard Variable',sans-serif !important; font-size:14px; }
body.board-asdf:has(#bo_v_bot) #bo_v_bot .ui-btn:hover { background:var(--color-gray-090,rgba(18,18,19,.9)) !important; color:var(--page-accent,var(--color-violet-100,#e4dbeb)) !important; }
body.board-asdf .thread_btn {
  display:flex;
  justify-content:flex-end;
  width:100%;
  margin:0 0 24px;
}
body.board-asdf .thread_btn .ui-btn {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:0;
  padding:6px 10px;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:14px;
}
body.board-asdf .thread_btn .ui-btn i { display:none; }
body.board-asdf .thread_btn .ui-btn::after { content:'글쓰기'; }
/* Diary pagination — Figma node 6:875. The stock skin uses purple pills, so
   target its .pg markup rather than the unrelated shared paging classes. */
body.board-page.board-asdf #body .pg_wrap {
  display:flex;
  justify-content:center;
  width:100%;
  margin:24px 0 0;
  padding:0;
}
body.board-page.board-asdf #body .pg {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:8px;
}
body.board-page.board-asdf #body .pg :is(a,strong) {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  height:auto;
  margin:0;
  padding:6px 10px;
  border:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--color-gray-100,#121213) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:14px;
  font-weight:400;
  line-height:130% !important;
  text-decoration:none;
}
body.board-page.board-asdf #body .pg strong {
  background:var(--color-gray-090,rgba(18,18,19,.9)) !important;
  color:var(--page-accent,var(--color-violet-100,#e4dbeb)) !important;
}
body.board-page.board-asdf #body .pg a:hover,
body.board-page.board-asdf #body .pg a:focus-visible {
  background:var(--color-gray-090,rgba(18,18,19,.9)) !important;
  color:var(--page-accent,var(--color-violet-100,#e4dbeb)) !important;
}
/* Remove the stock end-page icon treatment: Figma renders this as text. */
body.board-page.board-asdf #body .pg .pg_end {
  width:auto;
  text-indent:0 !important;
  background-image:none !important;
}
body.board-page.board-asdf #body .pg .pg_end::before,
body.board-page.board-asdf #body .pg .pg_end::after { content:none !important; display:none !important; }
body.board-page.board-asdf #body .thread_bottom {
  display:flex;
  justify-content:flex-end;
  margin:0;
  padding:16px;
}
body.board-page.board-asdf #body .thread_bottom .txt-point,
body.board-page.board-asdf #body .thread_bottom .txt-point i {
  color:var(--color-gray-090,rgba(18,18,19,.9)) !important;
}
/* Comment and reply triggers across every threaded board. */
body.board-page #body :is(.thread_bottom .txt-point,.thread_reply .txt-point),
body.board-page #body :is(.thread_bottom .txt-point,.thread_reply .txt-point) i {
  color:var(--color-gray-090,rgba(18,18,19,.9)) !important;
}
body.board-page.board-asdf #body .board-skin-basic > .bo_fx .ui-btn.admin {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:auto;
  margin:0;
  padding:6px 10px;
  border:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:14px;
  line-height:130% !important;
}
body.board-page.board-asdf #body #bo_sch {
  box-sizing:border-box;
  width:100%;
  margin:24px 0 0;
  padding:16px;
}
/* Board action buttons shared by Spirit and the other board skins. */
body.board-page #body .board-content-scroll :is(#fboardlist .ui-btn.admin,.bo_fx .ui-btn,.bo_fx > a,.btn_submit.ui-btn) {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:auto;
  min-height:0;
  margin:0;
  padding:6px 10px;
  border:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--color-gray-100,#121213) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:14px;
  font-weight:400;
  line-height:150% !important;
  text-decoration:none;
}
body.board-page #body .board-content-scroll :is(#fboardlist .ui-btn.admin,.bo_fx .ui-btn,.bo_fx > a,.btn_submit.ui-btn):hover,
body.board-page #body .board-content-scroll :is(#fboardlist .ui-btn.admin,.bo_fx .ui-btn,.bo_fx > a,.btn_submit.ui-btn):focus-visible {
  background:var(--color-gray-090,rgba(18,18,19,.9)) !important;
  color:var(--page-accent,var(--color-violet-100,#e4dbeb)) !important;
}
/* The legacy paginator is .pg, separate from the board-specific pager wrappers.
   Make the Figma pagination treatment universal. */
body.board-page #body .pg_wrap {
  display:flex;
  justify-content:center;
  width:100%;
  margin:24px 0 0;
  padding:0;
}
body.board-page #body .pg {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:8px;
}
body.board-page #body .pg :is(a,strong) {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  height:auto;
  margin:0;
  padding:6px 10px;
  border:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--color-gray-100,#121213) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:14px;
  font-weight:400;
  line-height:150% !important;
  text-decoration:none;
}
body.board-page #body .pg strong,
body.board-page #body .pg a:hover,
body.board-page #body .pg a:focus-visible {
  background:var(--color-gray-090,rgba(18,18,19,.9)) !important;
  color:var(--page-accent,var(--color-violet-100,#e4dbeb)) !important;
}
body.board-page #body .pg .pg_end::before,
body.board-page #body .pg .pg_end::after { content:none !important; display:none !important; }
/* Keep the search controls visually separated from pagination on every board. */
body.board-page #body #bo_sch {
  box-sizing:border-box;
  width:100%;
  margin:24px 0 0;
  padding:16px;
}

/* Load uses a different search wrapper from Diary and Spirit. Keep this
   treatment board-scoped so it never changes their fixed-width search input. */
body.board-bbs #body .searc-sub-box {
  box-sizing:border-box;
  width:100%;
  margin:24px 0 0;
  padding:16px;
}
body.board-bbs #body .searc-sub-box form,
body.board-bbs #body .searc-sub-box .ui-search-box {
  display:flex;
  align-items:stretch;
  justify-content:center;
  gap:8px;
  margin:0;
}
body.board-bbs #body .searc-sub-box fieldset {
  min-width:0;
  margin:0;
  padding:0;
  border:0;
}
body.board-bbs #body .searc-sub-box :is(select, input[type="text"]) {
  box-sizing:border-box;
  width:auto;
  min-height:35px;
  height:35px;
  margin:0;
  padding:6px 10px;
  border:1px solid var(--color-gray-100,#121213) !important;
  border-radius:0 !important;
  background:var(--color-white-100,#fff) !important;
  color:var(--color-gray-100,#121213) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:14px;
  line-height:150% !important;
}
body.board-bbs #body .searc-sub-box input[type="text"] {
  width:180px;
  min-width:0;
}
body.board-bbs #body .searc-sub-box .ui-btn {
  flex:0 0 auto;
  min-height:35px;
}

/* Archive / Works: log-style list skins. */
body.board-ccc #list .item, body.board-rrrr #log_list .item {
  width:100%;
  max-width:100%;
  margin:0 0 12px;
  padding:20px;
}
body.board-ccc #list .item .more-box, body.board-rrrr #log_list .item .pic-header {
  color:var(--color-gray-070, rgba(18,18,19,.7));
  font-size:12px;
}
body.board-rrrr #log_list .item .ui-pic .pic-header .no {
  border:1px solid var(--color-gray-100, #121213);
  background:var(--page-accent, var(--color-violet-100, #e4dbeb));
  border-radius:0;
}

/* View / write / comment controls. */
body.board-page :is(.board-viewer, #bo_v, #bo_w, .board-write, #write_item) {
  box-sizing:border-box;
  width:min(100% - 48px, 1000px);
  margin:48px auto;
  border:1px solid var(--color-gray-100, #121213);
  border-radius:0 !important;
  background:rgba(255,255,255,.8);
  box-shadow:none !important;
}
body.board-page :is(input[type="text"], input[type="password"], select, textarea, .frm_input) {
  box-sizing:border-box;
  border:1px solid var(--color-gray-100, #121213) !important;
  border-radius:0 !important;
  background:var(--color-white-100, #fff) !important;
  color:var(--color-gray-100, #121213) !important;
  box-shadow:none !important;
}
body.board-page :is(input[type="text"], input[type="password"], select, textarea, .frm_input):focus {
  outline:1px solid var(--color-gray-100, #121213);
  outline-offset:1px;
}
body.board-page :is(.board-comment-list .item, .bo_vc_li, .item-comment, .bo_vc_w) {
  border-color:var(--color-gray-100, #121213) !important;
  border-radius:0 !important;
}

/* Load — action controls in the stock `load` skin are marked `.small`, which
   restores its legacy 25px button height. Keep list, search, and write actions
   on the same shared outlined-button component used by the other boards. */
body.board-bbs :is(.ui-mmb-button, #bo_w > .txt-center, #board_action) {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:8px;
}
body.board-bbs .ui-mmb-button {
  margin:24px auto 0;
  padding:0;
}
body.board-bbs :is(
  .ui-mmb-button .ui-btn,
  .searc-sub-box .ui-btn,
  #bo_w > .txt-center .ui-btn,
  #board_action .ui-btn
) {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:0;
  height:auto;
  margin:0;
  padding:6px 10px;
  border:1px solid var(--color-gray-100,#121213) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:var(--color-gray-100,#121213) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:14px;
  font-weight:400;
  line-height:150% !important;
  text-decoration:none;
}
body.board-bbs :is(
  .ui-mmb-button .ui-btn,
  .searc-sub-box .ui-btn,
  #bo_w > .txt-center .ui-btn,
  #board_action .ui-btn
):hover,
body.board-bbs :is(
  .ui-mmb-button .ui-btn,
  .searc-sub-box .ui-btn,
  #bo_w > .txt-center .ui-btn,
  #board_action .ui-btn
):focus-visible {
  border-color:var(--color-gray-100,#121213) !important;
  background:var(--color-gray-100,#121213) !important;
  color:var(--page-accent,var(--color-violet-100,#e4dbeb)) !important;
  outline:0;
}

/* Load thumbnail actions — Figma ButtonMini (node 11:2252).
   Keep the comment submit button fluid by retaining the skin's full width. */
body.board-bbs #log_list .pic-footer-right {
  gap:4px;
}
body.board-bbs #log_list .pic-footer-right .load_btn,
body.board-bbs #log_list .bo_vc_w .btn_confirm .ui-comment-submit.load_btn {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0;
  padding:4px 6px;
  border:1px solid var(--color-gray-070,rgba(18,18,19,.7)) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:var(--color-gray-060,rgba(18,18,19,.6)) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:12px;
  font-weight:400;
  line-height:normal !important;
  text-decoration:none;
  translate:none !important;
}
body.board-bbs #log_list .bo_vc_w .btn_confirm .ui-comment-submit.load_btn {
  display:flex;
  width:100%;
}
body.board-bbs #log_list .pic-footer-right .load_btn:hover,
body.board-bbs #log_list .pic-footer-right .load_btn:focus-visible,
body.board-bbs #log_list .bo_vc_w .btn_confirm .ui-comment-submit.load_btn:hover,
body.board-bbs #log_list .bo_vc_w .btn_confirm .ui-comment-submit.load_btn:focus-visible {
  border-color:var(--color-gray-070,rgba(18,18,19,.7)) !important;
  background:var(--color-gray-070,rgba(18,18,19,.7)) !important;
  color:var(--page-accent,var(--color-violet-100,#e4dbeb)) !important;
  -webkit-text-fill-color:var(--page-accent,var(--color-violet-100,#e4dbeb));
  box-shadow:none !important;
  outline:0;
}
body.board-bbs #log_list .pic-footer-right .load_btn:active,
body.board-bbs #log_list .pic-footer-right .load_btn.pretty {
  background:transparent !important;
  color:var(--color-gray-060,rgba(18,18,19,.6)) !important;
}

@media (max-width:800px) {
  body.board-joy .type_list {
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
  }
  body.board-page #body > .fix-layout {
    width:100%;
  }
  body.board-page :is(.board-skin-basic, #list, #log_list, #load_log_board, .ui-paging, .searc-sub-box, .bo_fx) {
    width:calc(100% - 30px);
    margin:30px auto;
  }
  body.board-page :is(.board-viewer, #bo_v, #bo_w, .board-write, #write_item) { width:calc(100% - 30px); margin:30px auto; }
  body.board-bbs #body .searc-sub-box form,
  body.board-bbs #body .searc-sub-box .ui-search-box { flex-wrap:wrap; }
  body.board-bbs #body .searc-sub-box input[type="text"] { width:180px; max-width:100%; }
  body.board-asdf #body > .fix-layout, body.board-joy #body > .fix-layout { display:block; min-height:calc(100dvh - 53px); }
  .board-content-scroll { padding:15px; }
  /* Mobile has no Diary side rail; the thread list starts directly below GNB. */
  body.board-asdf .diary-intro { display:none; }
  body.board-asdf .board-content-scroll { margin-left:0; }
  /* Spirit category navigation becomes one top-level horizontal tab row. */
  .spirit-tabs { position:static; display:flex; align-items:center; gap:0; min-height:0; width:100%; max-width:none; height:auto; padding:0 15px; border-right:0; border-bottom:1px solid var(--color-gray-100,#121213); overflow:visible; }
  .spirit-tabs > a { flex:0 0 auto; width:auto; padding:12px 8px; border-bottom:0; }
  .spirit-tabs .spirit-tab-depth-group { display:none; }
  body.board-joy .board-content-scroll { margin-left:0; }
}

/* Load / Archive feed (Figma 11:2206)
   The feed deliberately has one scroll owner: the document.  No list card or
   comment pane may create a competing vertical scrollbar. */
body.board-bbs #load_log_board {
  position:relative !important;
  display:flow-root;
  box-sizing:border-box;
  width:min(1200px, 100%) !important;
  max-width:1200px !important;
  min-height:calc(100dvh - 49px);
  margin:0 auto !important;
  background:var(--page-bg) !important;
}
body.board-bbs #body > .fix-layout {
  display:flow-root;
  min-height:calc(100dvh - 49px);
  background:var(--page-bg) !important;
}
body.board-bbs .load-archive-rail {
  position:sticky;
  float:left;
  z-index:10;
  top:49px;
  left:auto;
  display:flex;
  box-sizing:border-box;
  width:300px;
  height:calc(100dvh - 49px);
  padding:24px;
  align-items:flex-end;
  justify-content:flex-end;
  border-left:0;
  border-right:1px solid var(--color-gray-100,#121213);
  background:var(--page-bg);
  pointer-events:none;
}
body.board-bbs .load-archive-rail span {
  color:var(--color-gray-100,#121213);
  font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  font-size:40px;
  font-weight:700;
  line-height:1;
  letter-spacing:-.04em;
  text-align:right;
}
body.board-bbs .load-archive-content {
  position:relative;
  display:flow-root;
  box-sizing:border-box;
  min-width:0;
  min-height:calc(100dvh - 49px);
  margin-left:300px;
  background:var(--page-bg);
}
body.board-bbs .load-archive-content > :is(.ui-mmb-button, .ui-paging, .searc-sub-box, #log_list, #navi_category, .board-notice) {
  box-sizing:border-box;
  width:100%;
  max-width:none;
  margin-left:0;
  margin-right:0;
}
body.board-bbs .load-archive-content > .ui-mmb-button {
  min-height:67px;
  margin-top:0;
  padding:16px;
  justify-content:flex-end;
  border-bottom:1px solid var(--color-gray-070,rgba(18,18,19,.7));
}
body.board-bbs .load-archive-content > .ui-paging {
  margin-top:0;
  margin-bottom:24px;
  padding:16px;
}
/* Bottom controls retain their functions without a second large spacer. */
body.board-bbs .load-archive-content > #log_list + .ui-paging {
  margin-bottom:0;
  padding:8px 16px;
}
body.board-bbs .load-archive-content > #log_list + .ui-paging .pg_wrap { margin:0; }
body.board-bbs .load-archive-content > #log_list {
  position:relative;
  margin-top:0;
  margin-bottom:0;
  border-top:1px solid var(--color-gray-070,rgba(18,18,19,.7));
}
body.board-bbs #log_list .load-scroll-index {
  position:sticky;
  z-index:4;
  top:49px;
  left:0;
  inset-inline-start:0;
  align-self:flex-start;
  display:flex;
  box-sizing:border-box;
  width:24px;
  height:24px;
  margin:0 0 -24px 0;
  /* Sit over the content-column divider rather than one pixel inside it. */
  transform:translateX(-1px);
  align-items:center;
  justify-content:center;
  background:var(--color-gray-100,#121213);
  color:var(--color-violet-100,#e4dbeb);
  font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  font-size:12px;
  font-weight:400;
  line-height:1;
}
body.board-bbs #log_list .item,
body.board-bbs #log_list .item:hover,
body.board-bbs #log_list .item:focus-within {
  box-sizing:border-box;
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  border:0 !important;
  border-bottom:1px solid var(--color-gray-070,rgba(18,18,19,.7)) !important;
  background:transparent !important;
}
body.board-bbs #log_list .item-inner {
  display:grid !important;
  grid-template-columns:minmax(min(580px, 65%), 1fr) minmax(0, 1fr);
  align-items:stretch;
  width:100%;
}
/* Archive's desktop feed keeps an image at the GNB edge only while that
   image is taller than its paired comment column. A grid placeholder retains
   the row's original height, so the right-side comments continue to scroll. */
@media (min-width:801px) {
  /* The divider belongs to the full row, including the pinned image's pause. */
  body.board-bbs #log_list .item .item-inner::after {
    content:'';
    display:block;
    position:relative;
    z-index:4;
    grid-column:1;
    grid-row:1;
    align-self:stretch;
    justify-self:stretch;
    box-sizing:border-box;
    border-right:1px solid var(--color-gray-070,rgba(18,18,19,.7));
    pointer-events:none;
  }
  body.board-bbs #log_list .item .item-inner > .ui-pic { border-right-color:transparent; }
  body.board-bbs #log_list .item-inner > .ui-pic { grid-column:1; grid-row:1; align-self:start; }
  body.board-bbs #log_list .item .item-inner > .ui-comment { grid-column:2; grid-row:1; align-self:start; min-height:0; }
  body.board-bbs #log_list .item.load-picture-tall .item-inner { min-height:var(--load-row-height, 0px); }
  body.board-bbs #log_list .item.load-picture-pinned .item-inner::before {
    content:'';
    display:block;
    grid-column:1;
    grid-row:1;
    min-height:var(--load-picture-height, 0px);
  }
  body.board-bbs #log_list .item.load-picture-pinned .item-inner > .ui-pic {
    position:fixed !important;
    z-index:3;
    top:var(--load-picture-top, 49px);
    left:var(--load-picture-left, 0px);
    width:var(--load-picture-width, 580px) !important;
    max-width:var(--load-picture-width, 580px) !important;
  }
}
/* Figma's `scroll` frame owns the continuous line above both columns.
   Individual rows retain their bottom borders so the picture/comment pairs
   remain sequential without an inner scroller. */
body.board-bbs #log_list {
  border-top:1px solid var(--color-gray-070,rgba(18,18,19,.7));
}
body.board-bbs #log_list .item :is(.ui-pic, .ui-comment) {
  float:none;
  box-sizing:border-box;
  width:auto !important;
  max-width:none !important;
  min-width:0;
  margin:0;
  padding:0;
  overflow:visible;
  background:transparent !important;
}
/* The legacy thumbload skin adds `.ui-wrap` or `.both` for wide uploads and
   stacks the two columns.  Archive always scales the image into its responsive 580px-minimum
   column instead; only the mobile breakpoint may use a single column. */
body.board-bbs #log_list .item:is(.ui-wrap, .both) .ui-pic,
body.board-bbs #log_list .item:is(.ui-wrap, .both) .ui-comment {
  float:none !important;
  clear:none !important;
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
}
body.board-bbs #log_list .item .ui-pic {
  width:100% !important;
  max-width:none !important;
  border-right:1px solid var(--color-gray-070,rgba(18,18,19,.7));
}
body.board-bbs #log_list .item .ui-pic .pic-header { display:none; }
body.board-bbs #log_list .item .ui-pic .pic-data {
  box-sizing:border-box;
  width:100%;
  max-width:none !important;
  margin:0;
  padding:16px;
  text-align:left;
}
body.board-bbs #log_list .item .ui-pic .img-data,
body.board-bbs #log_list .item .ui-pic .img-data > a,
body.board-bbs #log_list .item .ui-pic .img-data img,
body.board-bbs #log_list .item .ui-pic .pic-data iframe {
  display:block;
  box-sizing:border-box;
  width:100% !important;
  max-width:100% !important;
  height:auto;
}
body.board-bbs #log_list .item .ui-pic .pic-data > .img-data > img {
  object-fit:contain;
}
body.board-bbs #log_list .item .ui-pic .images_wrapper { gap:16px; }
body.board-bbs #log_list .item .ui-pic .pic-footer {
  min-height:0;
  padding:0 16px 16px;
  align-items:flex-start;
  gap:8px;
}
body.board-bbs #log_list .item .pic-footer-left,
body.board-bbs #log_list .item .pic-footer-right {
  flex-wrap:wrap;
  height:auto;
  gap:4px;
}
body.board-bbs #log_list .item .pic-footer-left { min-width:0; }
body.board-bbs #log_list .item .pic-footer-right { margin-left:auto; justify-content:flex-end; }
body.board-bbs #log_list .item .load-box { padding:0; }
body.board-bbs #log_list .item .load-box.title {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.board-bbs #log_list .item .ui-comment {
  display:flex;
  flex-direction:column;
  gap:24px;
  min-height:100%;
  padding:16px !important;
}
body.board-bbs #log_list .item :is(.item-comment-box, .comment-list-wrapper, .item-comment-form-box, .bo_vc_w) {
  box-sizing:border-box;
  max-height:none !important;
  overflow:visible !important;
  padding:0;
  background:transparent !important;
}
body.board-bbs #log_list .item .item-comment-form-box {
  margin:0 !important;
  padding:0 !important;
  border-top:0;
}
body.board-bbs #log_list .item .bo_vc_w .input-comment textarea { min-height:120px; height:120px; }
/* Archive comment thread (Figma 12:2283). */
body.board-bbs #log_list .item .comment-list-wrapper {
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:0 !important;
}
body.board-bbs #log_list .item .item-comment {
  min-height:0;
  padding:8px 0 !important;
  border:0 !important;
  color:var(--color-gray-090,rgba(18,18,19,.9));
}
body.board-bbs #log_list .item .item-comment.item-reply {
  box-sizing:border-box;
  margin:0;
  padding-left:10px !important;
  border-left:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
}
body.board-bbs #log_list .item .item-comment .co-header {
  display:flex;
  align-items:center;
  min-height:0;
  margin:0;
  padding:0 !important;
  background:transparent !important;
  color:var(--color-violet-100,#e4dbeb) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:12px;
  font-weight:700;
  line-height:130% !important;
}
body.board-bbs #log_list .item .item-comment .co-header p {
  float:none;
  margin:0;
  padding:2px 4px;
  background:var(--color-gray-090,rgba(18,18,19,.9));
  color:var(--color-violet-100,#e4dbeb) !important;
}
body.board-bbs #log_list .item .item-comment .co-content {
  padding:8px 0 !important;
  color:var(--color-gray-090,rgba(18,18,19,.9));
  font-size:13px;
  line-height:130% !important;
}
body.board-bbs #log_list .item .item-comment .co-memo {
  display:inline-flex;
  box-sizing:border-box;
  margin:0 0 4px;
  padding:1px 2px;
  background:var(--color-gray-070,rgba(18,18,19,.7));
  color:var(--color-violet-100,#e4dbeb) !important;
  font-family:'Pretendard Variable',sans-serif !important;
  font-size:12px;
  font-weight:400;
  line-height:130% !important;
}
body.board-bbs #log_list .item .item-comment .co-footer {
  display:flex;
  align-items:center;
  min-height:0;
  padding:0;
  color:var(--color-gray-040,rgba(18,18,19,.4));
  font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  font-size:12px;
  line-height:130% !important;
}
body.board-bbs #log_list .item .item-comment .co-footer .date { flex:1 1 auto; }
body.board-bbs #log_list .item .item-comment .co-footer :is(.re, .mod, .del) {
  float:none;
  width:auto;
  height:auto;
  margin-left:10px;
  padding:0;
  color:var(--color-gray-060,rgba(18,18,19,.6)) !important;
  font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  overflow:visible;
  font-size:0;
  line-height:130% !important;
  text-indent:0;
}
body.board-bbs #log_list .item .item-comment .co-footer :is(.re, .mod, .del)::before {
  position:static;
  display:inline;
  color:inherit;
  font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  font-size:12px;
  font-weight:700;
  line-height:130%;
}
body.board-bbs #log_list .item .item-comment .co-footer .re { order:1; }
body.board-bbs #log_list .item .item-comment .co-footer .mod { order:2; }
body.board-bbs #log_list .item .item-comment .co-footer .del { order:3; }
body.board-bbs #log_list .item .item-comment-form-box .bo_vc_w,
body.board-bbs #log_list .item .item-comment-form-box .input-comment {
  display:flex;
  flex-direction:column;
  gap:12px;
  margin:0 !important;
  padding:0;
  border:0;
  background:transparent;
}
body.board-bbs #log_list .item .item-comment-form-box textarea.wr_content {
  box-sizing:border-box;
  width:100%;
  min-height:120px;
  height:120px;
  margin:0;
  padding:8px;
  border:1px solid var(--color-gray-060,rgba(18,18,19,.6)) !important;
  background:var(--color-white-100,#fff) !important;
}
body.board-bbs #log_list .item .item-comment-form-box .action-check {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  min-height:0 !important;
  height:auto !important;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  color:var(--color-gray-070,rgba(18,18,19,.7));
  font-size:12px;
  line-height:130% !important;
}
body.board-bbs #log_list .item .item-comment-form-box .action-check > span {
  display:inline-flex;
  align-items:center;
  gap:4px;
  margin:0;
  white-space:nowrap;
}
body.board-bbs #log_list .item .item-comment-form-box .action-check input[type="checkbox"] {
  box-sizing:border-box;
  width:12px;
  height:12px;
  margin:0;
  appearance:none;
  border:1px solid var(--color-gray-060,rgba(18,18,19,.6));
  border-radius:0;
  background:var(--color-white-100,#fff);
}
body.board-bbs #log_list .item .item-comment-form-box .action-check input[type="checkbox"]:checked {
  background:var(--color-gray-070,rgba(18,18,19,.7));
  box-shadow:inset 0 0 0 2px var(--color-white-100,#fff);
}
body.board-bbs #log_list .item .item-comment-form-box .action-check .new_win { color:var(--color-gray-060,rgba(18,18,19,.6)); }
body.board-bbs #log_list .item .item-comment-form-box .btn_confirm {
  width:100%;
  margin:0 !important;
  padding:0;
  border:0;
  background:transparent;
}
body.board-bbs #log_list .item .item-comment-form-box .btn_confirm .ui-comment-submit.load_btn {
  box-sizing:border-box;
  min-height:0;
  padding:4px 6px;
  border-color:var(--color-gray-070,rgba(18,18,19,.7)) !important;
  color:var(--color-gray-060,rgba(18,18,19,.6)) !important;
  font-size:12px;
  line-height:normal !important;
}
body.board-bbs #body .load-archive-content > .searc-sub-box {
  min-width:0;
  max-width:100% !important;
  margin:0;
  padding:8px 16px 16px;
  overflow:hidden;
  background:var(--page-bg) !important;
}
body.board-bbs .load-archive-content > .searc-sub-box :is(form, .ui-search-box) {
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
}

@media (max-width:800px) {
  body.board-bbs #body > .fix-layout { min-height:calc(100dvh - 53px); }
  body.board-bbs #load_log_board { min-height:calc(100dvh - 53px); }
  body.board-bbs .load-archive-rail { display:none; }
  body.board-bbs .load-archive-content { min-height:calc(100dvh - 53px); margin-left:0; }
  body.board-bbs .load-archive-content > .ui-mmb-button { min-height:0; padding:15px; justify-content:center; }
  body.board-bbs .load-archive-content > .ui-paging,
  body.board-bbs #body .load-archive-content > .searc-sub-box { padding:15px; }
  body.board-bbs #log_list .load-scroll-index { top:69px; }
  body.board-bbs #log_list .item-inner { grid-template-columns:1fr; }
  body.board-bbs #log_list .item .ui-pic { border-right:0; border-bottom:1px solid var(--color-gray-070,rgba(18,18,19,.7)); }
}

/* Diary: Figma 6:1337 separates complete post/comment groups. */
body.board-page.board-asdf #body .thread_wrap > .thread-box.theme-box + .thread-box.theme-box {
  margin-top:24px !important;
  padding-top:24px !important;
  border-top:1px solid var(--color-gray-090,rgba(18,18,19,.9)) !important;
}

/* Let Diary and Spirit comment/reply glyphs follow the button hover/focus color. */
body.board-page:is(.board-asdf,.board-joy) #body :is(.thread_bottom,.thread_reply) button.txt-point i {
  color:inherit !important;
}
body.board-page:is(.board-asdf,.board-joy) #body :is(.thread_bottom,.thread_reply) button.txt-point:is(:hover,:focus-visible) {
  color:var(--color-gray-060,rgba(18,18,19,.6)) !important;
}

/* Load hashtag links use the design's gray-40 token. */
body.board-bbs #log_list .item .item-inner .co-content .link_hash_tag {
  color:var(--color-gray-040,rgba(18,18,19,.4));
}

/* Load endpoint pagination: size the real label to its content. */
body.board-page.board-bbs #body .pg :is(.pg_start,.pg_end) {
  flex:0 0 auto;
  width:auto;
  min-width:max-content;
  text-indent:0;
  white-space:nowrap;
  text-align:center;
}
body.board-page.board-bbs #body .pg :is(.pg_start,.pg_end)::before,
body.board-page.board-bbs #body .pg :is(.pg_start,.pg_end)::after {
  content:none !important;
  display:none !important;
}

/* Keep linked Load comments below the fixed navigation. */
body.board-bbs #log_list [id^="c_"] { scroll-margin-top:65px; }
@media (max-width:800px) {
  body.board-bbs #log_list [id^="c_"] { scroll-margin-top:69px; }
}

/* Figma 13:2382 — shared comment presentation; posting logic is unchanged. */
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment {
  position:relative; display:flex; flex-direction:column; gap:4px;
  box-sizing:border-box; min-width:0; margin:0 !important;
  padding:8px 0 8px calc(var(--comment-depth,0) * 11px) !important;
  border:0 !important; border-radius:0 !important; background:transparent !important;
}
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment::before {
  content:""; position:absolute; top:0; bottom:0; left:0;
  width:calc(var(--comment-depth,0) * 11px); pointer-events:none;
  background:repeating-linear-gradient(to right,var(--color-gray-090) 0 1px,transparent 1px 11px);
}
body.board-page:is(.board-asdf,.board-joy) #body .board-comment-list { margin:8px 0 0; padding:0; }
body.board-page:is(.board-asdf,.board-joy) #body .board-comment-list .figma-comment .co_head_wrap { display:contents; }
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-name,.co-header) {
  order:0; align-self:flex-start; flex:none; margin:0; padding:0 !important;
}
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-name,.co-header p) {
  width:auto; margin:0; padding:2px 4px !important; background:var(--color-gray-090) !important;
  color:var(--color-violet-100) !important; font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  font-size:12px !important; font-weight:700; line-height:normal !important;
}
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment .co-content {
  order:2; min-width:0; margin:0; padding:8px 0 !important;
  color:var(--color-gray-090) !important; font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  font-size:13px !important; line-height:1.3 !important; overflow-wrap:anywhere;
}
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-inner,.original_comment_area) {
  font-family:'IBM Plex Mono','Pretendard Variable',monospace !important; font-size:13px !important; line-height:1.3 !important;
}
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-info,.co-footer) {
  order:3; display:flex; align-items:center; flex-wrap:wrap; gap:8px; width:100%;
  margin:0; padding:0; font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  font-size:12px !important; line-height:normal !important;
}
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-info > span:first-child,.co-footer .date) {
  flex:1 1 auto; color:var(--color-gray-040) !important; opacity:1;
}
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-info a,.co-footer a) {
  margin:0; color:var(--color-gray-060) !important; font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  font-weight:700; transition:color 160ms ease;
}
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-info a,.co-footer a):is(:hover,:focus-visible) { color:var(--color-gray-100) !important; }
body.board-page.board-bbs #body #log_list .figma-comment .figma-comment-memo {
  order:1; align-self:flex-start; margin:0; padding:1px 2px;
  background:var(--color-gray-070); color:var(--color-violet-100) !important;
  font-family:'IBM Plex Mono','Pretendard Variable',monospace !important; font-size:12px; line-height:normal;
}
/* Replies remain contiguous so the ancestor rails do not break between rows. */
body.board-page.board-bbs #body #log_list .figma-comment + .figma-comment.item-reply { margin-top:-8px !important; }

/* Thread author labels share the Load co-header tag treatment. */
body.board-page:is(.board-asdf,.board-joy) #body .thread_info .name {
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto;
  width:auto; margin:0; padding:2px 4px;
  background:var(--color-gray-090,rgba(18,18,19,.9));
  color:var(--color-violet-100,#e4dbeb) !important;
  font-family:'IBM Plex Mono','Pretendard Variable',monospace !important;
  font-size:12px !important; font-weight:700; line-height:normal !important;
}

/* The same configured administrator icon used by Load. */
body.board-page:is(.board-asdf,.board-joy) #body .thread_info .name { gap:4px; }
body.board-page:is(.board-asdf,.board-joy) #body .thread_info .name > .thread-author-icon {
  display:inline-block; flex:0 0 auto; width:auto; height:14px; max-width:24px;
  object-fit:contain; vertical-align:middle;
}

/* Comment metadata stays beside the author, above the body. */
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment {
  display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:8px; align-items:center;
}
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-name,.co-header) { grid-column:1; grid-row:1; }
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-info,.co-footer) { grid-column:2; grid-row:1; min-width:0; order:0; }
body.board-page:is(.board-asdf,.board-joy,.board-bbs) #body :is(#log_list,.board-comment-list) .figma-comment :is(.co-content,.figma-comment-memo) { grid-column:1 / -1; }
.comment-date { position:relative; display:inline-block; white-space:nowrap; }
@media(max-width:768px) { .comment-date .comment-clock { display:none; } }

/* Diary: independent three-row index above one complete thread. */
body.board-asdf .diary-index { margin:0 0 16px; border-top:1px solid var(--color-gray-080); border-bottom:1px solid var(--color-gray-080); font-family:'IBM Plex Mono','Pretendard Variable',monospace; }
body.board-asdf .diary-index summary { display:flex; justify-content:space-between; padding:16px 8px; cursor:pointer; list-style:none; font-size:14px; }
body.board-asdf .diary-index summary::-webkit-details-marker { display:none; }
body.board-asdf .diary-index-toggle::after { content:'펼치기 +'; }
body.board-asdf .diary-index[open] .diary-index-toggle::after { content:'접기 −'; }
body.board-asdf .diary-index-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 8px; border-top:1px solid var(--color-gray-080); color:var(--color-gray-090); }
body.board-asdf .diary-index-row > span { min-width:0; overflow-wrap:anywhere; }
body.board-asdf .diary-index-row time { flex:none; color:var(--color-gray-060); font-size:12px; }
body.board-asdf .diary-index-row:is(:hover,[aria-current=page]) { background:var(--color-gray-090); color:var(--color-violet-100); }
body.board-asdf .diary-index-row:is(:hover,[aria-current=page]) time { color:inherit; }
body.board-asdf .diary-index-pages { display:flex; justify-content:center; align-items:center; gap:16px; padding:16px 8px; border-top:1px solid var(--color-gray-080); font-size:12px; }
body.board-asdf .diary-index-pages a { padding:4px 8px; border:1px solid var(--color-gray-080); }
body.board-asdf .diary-index-tools { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-bottom:24px; }
body.board-asdf .diary-index-tools form { display:flex; gap:8px; min-width:0; }
body.board-asdf .diary-index-tools input[type=search] { min-width:0; width:160px; background:transparent; border:1px solid var(--color-gray-080); padding:4px 8px; }
body.board-asdf #bo_v_bot { display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; padding:24px 8px; }
body.board-asdf #bo_v_bot :is(.bo_v_nb,.bo_v_com) { display:flex; flex-wrap:wrap; gap:8px; float:none; }

body.board-asdf .diary-index-pages a { color:var(--color-gray-090); opacity:1; }
body.board-asdf .diary-index-pages a:is(:hover,:focus-visible) { color:var(--color-violet-100); background:var(--color-gray-090); }

/* Compact Diary index rows. */
body.board-asdf .diary-index :is(summary,.diary-index-row,.diary-index-pages) { padding-top:8px; padding-bottom:8px; }

body.board-asdf .diary-thread-toggle { display:block; margin:8px 0; padding:4px 8px; border:0; background:transparent; color:var(--color-gray-090); font:inherit; text-decoration:underline; cursor:pointer; }
body.board-asdf #diary-thread-entries:not(.diary-thread-expanded) > .diary-thread-earlier { display:none !important; }

body.board-asdf .diary-thread-toggle { transition:color 160ms ease; }
body.board-asdf .diary-thread-toggle:is(:hover,:focus-visible) { color:var(--color-gray-060,rgba(18,18,19,.6)) !important; }

/* Diary list heading and its expand/collapse label. */
body.board-asdf .diary-index summary { font-weight:700; }

body.board-asdf .diary-index-toggle { font-weight:400; }

/* Diary index typography: regular 13px headings and titles. */
body.board-asdf .diary-index :is(summary,.diary-index-toggle,.diary-index-row,.diary-index-row > span) { font-size:13px; font-weight:400; }

/* Full-width Diary sections; spacing belongs to each section, not the column. */
body.board-page.board-asdf .board-content-scroll:has(.diary-sections) { padding:0; gap:0; }
body.board-page.board-asdf #body .diary-sections { padding:0 !important; }
body.board-asdf .diary-section { box-sizing:border-box; min-width:0; width:100%; }
body.board-asdf .diary-section + .diary-section { border-top:1px solid var(--color-gray-080); }
body.board-asdf .diary-section-list .diary-index { margin:0; border:0; }
body.board-asdf .diary-section-list .diary-index :is(summary,.diary-index-row,.diary-index-pages) { padding-left:24px; padding-right:24px; }
body.board-asdf .diary-section-content, body.board-asdf .diary-section-actions { padding:24px; }
body.board-asdf .diary-section-actions #bo_v_bot { padding:0; }
body.board-page.board-asdf #body .diary-section-actions #bo_sch { padding:0; margin:24px 0 0; }

/* Match the fixed rail's edge, accounting for the outer layout's 1px border. */
@media (min-width:801px) {
 body.board-page.board-asdf .board-content-scroll:has(.diary-sections) { margin-left:299px; }
}
body.board-page.board-asdf #body .diary-section-actions #bo_v_bot { border-top:0 !important; margin-top:0; padding-top:0; }

/* Match the thread expand button's color interaction. */
body.board-asdf .diary-index summary { transition:color 160ms ease; }
body.board-asdf .diary-index summary:is(:hover,:focus-visible) { color:var(--color-gray-060,rgba(18,18,19,.6)) !important; }

/* Inline reply forms inherit comment text rules; keep the submit accent explicit. */
body.board-page:is(.board-asdf,.board-joy) #body .board-comment-list button[type="submit"].ui-btn:is(:hover,:focus-visible),
body.board-page:is(.board-asdf,.board-joy) #body .board-comment-write button[type="submit"].ui-btn:is(:hover,:focus-visible) {
 background:var(--color-gray-090,rgba(18,18,19,.9)) !important;
 color:var(--page-accent,var(--color-violet-100,#e4dbeb)) !important;
 -webkit-text-fill-color:var(--page-accent,var(--color-violet-100,#e4dbeb));
}

/* Comment author tags share the original post's configured admin icon. */
body.board-page:is(.board-asdf,.board-joy) #body .board-comment-list .figma-comment .co-name { display:inline-flex; align-items:center; gap:4px; }
body.board-page:is(.board-asdf,.board-joy) #body .board-comment-list .co-name > .comment-author-icon { display:inline-block; flex:none; width:auto; height:14px; max-width:24px; object-fit:contain; margin:0; vertical-align:middle; }

/* Figma 25:489: concealed thread body, line masks and centered reveal panel. */
body:is(.board-asdf,.board-joy) .thread_main.spoiler {
  position:relative; filter:none; opacity:1; margin:0;
}
body:is(.board-asdf,.board-joy) .thread_main.spoiler > :not(.spoiler-mask):not(.spoiler_sec) { visibility:hidden; }
body:is(.board-asdf,.board-joy) .thread_main.spoiler .spoiler-mask {
  position:absolute; inset:0; width:100%; height:100%; pointer-events:none; visibility:visible;
}
body:is(.board-asdf,.board-joy) .spoiler_sec { z-index:2; }
body:is(.board-asdf,.board-joy) .spoiler-box { box-sizing:border-box; width:202px; max-width:100%; border:1px solid var(--color-gray-100,#121213); }
body:is(.board-asdf,.board-joy) .spoiler-box p {
  margin:0; padding:4px 10px; background:var(--color-gray-100,#121213); color:#fff;
  font-family:'IBM Plex Mono',monospace !important; font-size:12px; font-weight:400; line-height:normal; text-align:center; text-shadow:none;
}
body:is(.board-asdf,.board-joy) .spoiler-actions { padding:8px; background:var(--color-violet-100,#e4dbeb); }
body:is(.board-asdf,.board-joy) .spoiler-actions button {
  box-sizing:border-box; display:block; width:100%; margin:0; padding:4px 6px; border:1px solid var(--color-gray-070,rgba(18,18,19,.7)); border-radius:0;
  background:transparent; color:var(--color-gray-080,rgba(18,18,19,.8)); font-family:'Pretendard Variable',sans-serif !important; font-size:12px; font-weight:400; line-height:normal; cursor:pointer; transition:color 160ms,background 160ms;
}
body:is(.board-asdf,.board-joy) .spoiler-actions button:is(:hover,:focus-visible) { background:var(--color-gray-090); color:var(--color-violet-100); }

/* Figma 25:538: violet-60, above the mask and below the reveal panel. */
body:is(.board-asdf,.board-joy) .thread_main.spoiler::after {
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:var(--color-violet-60,rgba(228,219,235,.6));
}