/* Style 6 depth and geometry, with the user's selected style 1 matte palette. */
.matte-site { min-height: 100vh; }
.matte-site .public-shell :is(.contents_wrap, .header_wrap) { background: transparent; }
.matte-site #wrap.public-shell { background: transparent; }
.matte-site .public-shell .noonting-lockup { mix-blend-mode: lighten; }
.matte-site .public-shell .site-main { background: transparent; }
.matte-site .public-shell :is(.left_login_box, .left_my_box, .right_board_box, .brand-feature, .service-tiles > a, .chat-panel, .left_customer_box, .left_event_box, .left_new_box, .left_notice_box, .home-introduction .hulk_seo_title_box, .home-introduction .hulk_seo_imfortant_box, .home-introduction .faq) {
  border: 1px solid var(--matte-edge); border-radius: var(--matte-radius);
  background: var(--matte-surface); box-shadow: var(--matte-shadow);
}
.matte-site .public-shell :is(.right_board_box, .left_event_box, .left_new_box) { overflow: hidden; }
.matte-site .public-shell :is(.right_board_box_title, .left_chat_title, .left_event_title, .left_new_tab, .top_wrap, .gnb_wrap, .m_header, .m_menu_fix) {
  background: var(--matte-head); border-color: var(--matte-edge); color: #e1eded;
}
.matte-site .public-shell .left_chat_title { border-radius: var(--matte-radius) var(--matte-radius) 0 0; }
.matte-site .public-shell .left_chat_box .chat-panel { border-top-left-radius: 0; border-top-right-radius: 0; }
.matte-site .public-shell .right_board_box_title { border-bottom: 1px solid var(--matte-edge); }
.matte-site .public-shell .left_event_title { color: #f6b86e; }
.matte-site .public-shell :is(.login-field > input, .top_serch, .chat-compose input) {
  background: var(--matte-field); box-shadow: var(--matte-field-shadow); border-radius: calc(var(--matte-radius) * .65); border-color: var(--matte-edge);
}
.matte-site .public-shell :is(.login-form .button.is-primary, .util_btn1) {
  background: var(--matte-button); box-shadow: var(--matte-button-shadow); border: 1px solid #88c4ca; color: #142c32; border-radius: calc(var(--matte-radius) * .65);
}
.matte-site .public-shell .svc-action { background: #f6b86e; color: #30251b; border: 1px solid #f6b86e; border-radius: calc(var(--matte-radius) * .65); box-shadow: var(--matte-button-shadow); }
.matte-site .public-shell .home-sports-banner { border-radius: var(--matte-radius); border-color: var(--matte-edge); box-shadow: var(--matte-shadow); }
.matte-site .public-shell .gnb_depth { background: #232a2d; border-color: var(--matte-edge); border-radius: var(--matte-radius); }
.matte-site .public-shell .home-introduction :is(h1, h2, h3) { text-shadow: none; }
.matte-site .public-shell .service-tiles :is(strong, small) { text-shadow: none; }
.matte-site .public-shell .left_notice_box { overflow: hidden; }
.matte-site .public-shell .left_notice_title { background: #376b76; color: #f1f4f0; }


.matte-site .public-shell :is(.gnb_title, .gnb > ul > li.gnb_highlight .gnb_title) { text-shadow: 0 1px 1px #0008; }
.matte-site .public-shell .service-tiles .tile-figure { transform: none; }
.matte-site .public-shell .home-sports-title { text-shadow: 0 2px 3px #0005; }
.matte-site .public-shell .service-tiles > a:hover { border-color: #88c4ca; }
.matte-site .public-shell .login-form .button.is-primary:hover { filter: brightness(1.08); }
.matte-site .public-shell .login-form .button.is-primary:active { box-shadow: inset 0 2px 5px #16373c77, 0 1px #a5d8de55; transform: translateY(2px); }


.matte-site {
  --matte-radius: 10px;
  --matte-surface: #232a2d;
  --matte-edge: #394449;
  --matte-shadow: inset 1px 1px 1px #a8c1c528, inset -1px -1px 2px #0a141777, -5px -5px 12px #41545b33, 8px 9px 15px #080d10b3;
  --matte-head: #20272a;
  --matte-field: #171719;
  --matte-field-shadow: inset 4px 4px 7px #0b141ac9, inset -3px -3px 6px #6c889044;
  --matte-button: #88c4ca;
  --matte-button-shadow: inset 1px 1px 2px #e3f5f566, inset -1px -2px 3px #376b7680, 4px 5px 9px #0b141ac9, -2px -2px 5px #a2cdd426;
  background: #171719;
}
.matte-site .public-shell .gnb_wrap { border-bottom: 1px solid #88c4ca; box-shadow: inset 0 1px #a8c1c526, 0 8px 15px #080d108c; }
.matte-site .public-shell .gnb > ul > li > a:hover { background: #2c3438; }
.matte-site .public-shell .brand-feature { background: #20282b; }
.matte-site .public-shell .right_board_box_title { background: var(--matte-surface); border-bottom-color: var(--matte-edge); box-shadow: 0 1px #111d2255; }
.matte-site .public-shell .left_chat_title { border: 1px solid var(--matte-edge); border-bottom: 0; box-shadow: inset 1px 1px #a8c1c528; }
.matte-site .public-shell .service-tiles .tile-figure { border-radius: 9px; border-color: #52636a; background: #2c3438; box-shadow: inset 1px 1px #a8cdd23b, inset -1px -1px #122c3599, -3px -3px 7px #8babb31f, 5px 5px 7px #0b141ac9; }
.matte-site .public-shell .service-tiles .tile-calendar .tile-figure { color: #f6b86e; }
.matte-site .public-shell .left_new_tab li.active a { background: #376b76; color: #edf4f3; }
.matte-site .public-shell .svc-action { background: var(--matte-amber); box-shadow: inset 1px 1px 2px #fff0d866, inset -1px -2px 3px #95663880, 4px 5px 9px #0b141ac9, -2px -2px 5px #d4ba9826; }
/* 채팅 내용: 검정 배경이 채팅 칸을 가득 채우고(안쪽 테두리·여백 없음), 아래 입력 칸은 구분선으로 나눔 */
.matte-site .public-shell .chat-stream { border-radius: 0; background: var(--matte-field); box-shadow: none; }
.matte-site .public-shell .chat-compose { border-top: 1px solid #5a6d73; }
.matte-site .public-shell .chat-feedback { background: var(--matte-field); border-color: var(--matte-edge); }
.matte-site .public-shell .home-sports-banner { box-shadow: inset 0 0 0 1px #a8c1c526, -5px -5px 12px #41545b33, 9px 10px 18px #080d10b3; }

/* Public content pages use the same material as the selected homepage sample. */
.matte-site {
  --matte-amber: #f6b86e;
  --matte-amber-shadow: inset 1px 1px 2px #fff0d866, inset -1px -2px 3px #95663880, 4px 5px 9px #0b141ac9, -2px -2px 5px #d4ba9826;
  --matte-control-shadow: inset 1px 1px #a8c1c52b, inset -1px -1px #0a141777, -2px -2px 5px #41545b44, 3px 4px 7px #080d1099;
}
.matte-site .site-main :is(.page-head, .svc-panel, .empty-state, .video-card, .post-list, .auth-card, .faq),
.matte-site .site-main .community-page :is(.board-heading, .board-panel, .board-article, .board-editor, .comments, .faq) {
  border: 1px solid var(--matte-edge); border-radius: var(--matte-radius);
  background: var(--matte-surface); box-shadow: var(--matte-shadow);
}
.matte-site .site-main .page-head::before, .matte-site .site-main .page-head::after { display: none; }
.matte-site .site-main .community-page { --board-panel: var(--matte-surface); --board-border: var(--matte-edge); --board-muted: #bdcdcf; }
.matte-site .site-main .community-page :is(.board-heading-mark, .board-avatar) {
  transform: none; border-color: #52636a; border-radius: 10px; color: #d4efec;
  background: #2c3438;
  box-shadow: inset 1px 1px #a8cdd23b, inset -1px -1px #122c3599, -3px -3px 7px #8babb31f, 5px 5px 7px #0b141ac9;
}

/* Raised actions, with pressed active tabs; geometry remains responsive. */
.matte-site .public-shell .site-main .button,
.matte-site .site-main :is(.board-navigation, .section-tabs, .category-tabs, .sort-tabs, .pager) a,
.matte-site .auth-dialog-close {
  border: 1px solid #52636a; border-radius: 7px; background: var(--matte-surface);
  box-shadow: var(--matte-control-shadow); color: #e1eded;
}
.matte-site .public-shell .site-main .button.is-primary {
  border: 1px solid #e8bb81; background: var(--matte-amber);
  box-shadow: var(--matte-amber-shadow); color: #30251b;
}
.matte-site .public-shell .site-main .login-form .button.is-primary,
.matte-site .auth-dialog .button.is-primary {
  border: 1px solid #88c4ca; border-radius: 7px; background: var(--matte-button);
  box-shadow: var(--matte-button-shadow); color: #142c32;
}
.matte-site .public-shell .site-main .button.is-danger { border-color: #87635e; background: linear-gradient(145deg, #473a3a, #342b2d); color: #ffd0c7; }
.matte-site .site-main :is(.board-navigation, .section-tabs, .category-tabs, .sort-tabs, .pager) a[aria-current] {
  background: var(--matte-field); box-shadow: var(--matte-field-shadow); border-color: #6c9da6; color: #b2e0e3;
}
.matte-site .site-main .pager span[aria-current] {
  border: 1px solid #6c9da6; border-radius: 7px; color: #b2e0e3;
  background: var(--matte-field); box-shadow: var(--matte-field-shadow);
}
.matte-site .site-main :is(.board-navigation, .section-tabs, .category-tabs, .sort-tabs, .pager) a:hover { border-color: #88c4ca; }
.matte-site .public-shell .site-main .button:active:not(:disabled),
.matte-site .auth-dialog .button:active:not(:disabled), .matte-site .auth-dialog-close:active {
  box-shadow: inset 2px 3px 6px #0b141a88, inset -1px -1px 2px #a8c1c533; transform: translateY(1px);
}

/* Inset fields keep native checkbox, radio and file controls intact. */
.matte-site .site-main input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
.matte-site .site-main textarea, .matte-site .site-main select,
.matte-site .auth-dialog input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), .matte-site .auth-dialog select {
  border: 1px solid var(--matte-edge); border-radius: 7px;
  background: var(--matte-field); box-shadow: var(--matte-field-shadow); color: #edf4f3;
}
.matte-site .site-main :is(input, textarea)::placeholder { color: #b3c6ca; opacity: 1; }
.matte-site .site-main :is(input, textarea, select, button, a):focus-visible,
.matte-site .auth-dialog :is(input, select, button, a):focus-visible {
  outline: 2px solid #f6b86e; outline-offset: 3px;
}
.matte-site .auth-dialog [aria-invalid="true"] { border-color: #f6b86e; }

/* Lists and article surfaces: recessed dividers without heavy stacked rims. */
.matte-site .site-main .community-page :is(.board-toolbar, .board-article .post-head, .board-editor-footer, .board-article-footer, .board-publish-settings) {
  background: var(--matte-head); border-color: var(--matte-edge);
}
.matte-site .site-main .community-page :is(.board-columns, .board-list-bottom) {
  background: var(--matte-field); border-color: var(--matte-edge); box-shadow: inset 0 2px 5px #0b141a55;
}
.matte-site .site-main .community-page .board-row { border-color: var(--matte-edge); }
.matte-site .site-main .community-page .board-row.is-notice { background: #2c3438; }
.matte-site .site-main .community-page .board-row:hover { background: #303b3f; }
.matte-site .site-main .community-page .board-photo-card {
  background: var(--matte-surface); border-color: var(--matte-edge); box-shadow: var(--matte-control-shadow);
}
.matte-site .site-main .community-page .board-photo-card:hover { border-color: #88c4ca; }
.matte-site .site-main .partners-page .partners-hero { border-color: var(--matte-edge); border-radius: var(--matte-radius); box-shadow: var(--matte-shadow); }
.matte-site .site-main .partners-page .partner-card { border-color: var(--matte-edge); border-radius: var(--matte-radius); background: var(--matte-surface); box-shadow: var(--matte-shadow); }
.matte-site .site-main .partners-page .partner-card:not(.is-pending):hover { border-color: #88c4ca; }
.matte-site .site-main .partners-page :is(.partners-total, .partner-card-info) { background: var(--matte-field); box-shadow: var(--matte-field-shadow); }
.matte-site .site-main .partners-page :is(.partner-card-action, .partner-image-empty svg) { box-shadow: var(--matte-control-shadow); }
.matte-site .site-main .partners-page .partner-card-action:disabled { background: var(--matte-field); box-shadow: var(--matte-field-shadow); }
.matte-site .site-main .community-page :is(.board-article-photo, .comment-login, .report-target) {
  background: var(--matte-field); border-color: #526a73; box-shadow: var(--matte-field-shadow);
}
.matte-site .site-main .community-page .board-article .post-head { border-radius: 9px 9px 0 0; }
.matte-site .site-main .community-page .board-article-footer { border-radius: 0 0 9px 9px; }
.matte-site .site-main .community-page .recommend-button {
  border-radius: 8px; background: var(--matte-surface); border-color: #6c9da6; box-shadow: var(--matte-control-shadow);
}
.matte-site .site-main .community-page .recommend-button:hover:not(:disabled) { background: #2c3438; }
.matte-site .site-main .community-page .recommend-button[aria-pressed="true"] {
  background: var(--matte-amber); box-shadow: var(--matte-amber-shadow); border-color: #e8bb81; color: #30251b;
}
.matte-site .site-main .community-page .recommend-button:disabled { box-shadow: var(--matte-field-shadow); background: var(--matte-field); }
.matte-site .site-main .community-page .report-reason { background: var(--matte-surface); box-shadow: var(--matte-control-shadow); }
.matte-site .site-main .community-page .report-reason:has(input:checked) { background: var(--matte-field); box-shadow: var(--matte-field-shadow); }

/* Writing and editing share this treatment, including toolbar popovers. */
.matte-site .site-main .community-page .board-editor { overflow: visible; }
.matte-site .site-main .community-page .board-editor-footer { border-radius: 0 0 9px 9px; }
.matte-site .site-main .rich-editor { border-color: #4b626b; border-radius: 8px; background: var(--matte-field); box-shadow: var(--matte-field-shadow); }
.matte-site .site-main .rich-toolbar {
  gap: 8px; border-radius: 7px 7px 0 0; border-color: var(--matte-edge);
  background: var(--matte-head); box-shadow: inset 0 1px #a8c1c526, 0 4px 10px #0004;
}
.matte-site .site-main .rich-group { gap: 4px; border-color: var(--matte-edge); }
.matte-site .site-main .rich-toolbar .rich-tool {
  background: var(--matte-surface); border-color: #455c64; box-shadow: var(--matte-control-shadow); color: #dce8e9;
}
.matte-site .site-main .rich-toolbar .rich-tool:hover { border-color: #88c4ca; }
.matte-site .site-main .rich-toolbar .rich-tool:is([aria-pressed="true"], [aria-expanded="true"]) {
  background: var(--matte-field); border-color: #77afb9; box-shadow: var(--matte-field-shadow); color: #b2e0e3;
}
.matte-site .site-main .rich-editor .rich-content[contenteditable="true"] {
  background: var(--matte-field); box-shadow: inset 3px 4px 8px #0b141a88, inset -2px -2px 5px #6c889022;
}
.matte-site .site-main .rich-editor .rich-content:focus-visible { outline: 2px solid #88c4ca; outline-offset: -2px; }
.matte-site .site-main .rich-panel {
  border: 1px solid #52636a; border-radius: 8px; background: var(--matte-surface);
  box-shadow: inset 1px 1px #a8c1c526, 0 12px 24px #080d10cc;
}
.matte-site .site-main .rich-panel-option { border-radius: 5px; color: #e1eded; }
.matte-site .site-main .rich-panel-option:hover { background: #2c3438; }
.matte-site .site-main :is(.rich-image-tools, .rich-draft, .rich-status) { background: var(--matte-head); border-color: var(--matte-edge); }
.matte-site .site-main .rich-status { border-radius: 0 0 7px 7px; color: #bdcdcf; }
.matte-site .auth-dialog { border-color: #526a73; border-radius: 12px; background: var(--matte-surface); box-shadow: var(--matte-shadow), 0 24px 80px #000a; }
.matte-site .auth-dialog-head { background: var(--matte-head); border-color: var(--matte-edge); }

