@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

html,
body {
  height: 100%;
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: var(--c-bg);
  color: var(--c-text);
}
@media screen and (max-width: 1024px) {
  html,
  body {
    font-size: 15px;
  }
}
@media screen and (max-width: 640px) {
  html,
  body {
    font-size: 14px;
  }
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  font-weight: 600;
}

p,
span,
div,
strong,
b,
em,
i {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}

input,
textarea,
select,
button {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}

ul,
ol {
  list-style: none;
}

a {
  color: inherit;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

img,
video {
  max-width: 100%;
  vertical-align: middle;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

button,
input,
textarea,
select {
  font: inherit;
  border: none;
  outline: none;
  color: var(--c-text);
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

input[type=checkbox],
input[type=radio] {
  -webkit-appearance: auto;
  -moz-appearance: auto;
  appearance: auto;
}

input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=search]:focus,
textarea:focus,
select:focus {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border: none !important;
  outline: 1px solid var(--c-border);
  outline-offset: 0;
}

button {
  cursor: pointer;
  background-color: transparent;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  outline: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

hr {
  border: none;
  height: 1px;
  background-color: var(--c-border);
}

::before,
::after {
  box-sizing: border-box;
}

input[type=text],
input[type=email],
input[type=password],
input[type=search],
textarea,
p,
span,
div.content,
.selectable {
  -webkit-user-select: text;
  -khtml-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: var(--c-hover);
}

::-webkit-scrollbar-thumb {
  background: var(--c-scrollbar-thumb, var(--c-text-muted));
  border-radius: 3px;
}

::selection {
  background: var(--c-primary-600);
  color: var(--c-on-primary);
}

@font-face {
  font-family: "Pretendard";
  src: url("../fonts/Pretendard-Regular.subset.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("../fonts/Pretendard-SemiBold.subset.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard";
  src: url("../fonts/Pretendard-Bold.subset.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
.coinwhy-wrapper .sch_word {
  background: rgba(var(--c-primary-rgb), 0.15);
  color: var(--c-primary);
  font-weight: 600;
  border-radius: 3px;
  padding: 0;
  margin: 0;
}
.coinwhy-wrapper .toast-message {
  position: fixed;
  bottom: calc(var(--mobile-bottom-nav-height) + 24px);
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  max-width: 80%;
  text-align: center;
  background: var(--c-overlay-80);
  color: var(--c-text-inverse);
  padding: 12px 20px;
  border-radius: 6px;
  font-size: 0.9rem;
  z-index: 3100;
  opacity: 0;
}
.coinwhy-wrapper .toast-message.show {
  opacity: 1;
}
.coinwhy-wrapper #hd_pop p {
  position: absolute;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
}
.coinwhy-wrapper .pagination-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 16px 0 8px 0;
}
.coinwhy-wrapper .pagination-container .pg_wrap {
  margin: 0;
  padding: 0;
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_page,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_current,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_start,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_prev,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_next,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_end {
  display: inline-block;
  vertical-align: middle;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--c-text-muted);
  font-size: 0.9rem;
  height: auto;
  line-height: normal;
  padding: 8px 12px;
  min-width: 36px;
  text-align: center;
  text-decoration: none;
  margin: 0 1px;
  cursor: pointer;
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_page:hover,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_current:hover,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_start:hover,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_prev:hover,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_next:hover,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_end:hover {
  background-color: var(--c-hover);
  color: var(--c-text);
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_current {
  background: transparent;
  border: 1px solid var(--c-border);
  color: var(--c-text);
  font-weight: 500;
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_current:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_start,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_prev,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_next,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_end {
  background-image: none;
  text-indent: -9999px;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_start,
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_end {
  background-size: 13px 13px;
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_start {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23656565' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='19 4 11 12 19 20' /%3E%3Cpolyline points='13 4 5 12 13 20' /%3E%3C/svg%3E");
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_prev {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23656565' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 6 9 12 15 18' /%3E%3C/svg%3E");
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_next {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23656565' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 6 15 12 9 18' /%3E%3C/svg%3E");
}
.coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_end {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23656565' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 4 13 12 5 20' /%3E%3Cpolyline points='11 4 19 12 11 20' /%3E%3C/svg%3E");
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .pagination-container {
    margin: 10px 0 5px 0;
  }
  .coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_page,
  .coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_current,
  .coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_start,
  .coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_prev,
  .coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_next,
  .coinwhy-wrapper .pagination-container .pg_wrap .pg .pg_end {
    padding: 7px 6px;
    min-width: 30px;
  }
}

:root {
  /* 기본(라이트) 테마 토큰 */
  --c-bg: #F9F9F9;
  --c-surface: #ffffff;
  --c-text: #1c1e21;
  --c-text-muted: #65676b;
  --c-border: #e5e8eb;
  --c-hover: #f0f2f5;
  --c-scrollbar-thumb: #9ca3af;
  --c-primary: #007BF7;
  --c-primary-600: #2563eb;
  --c-danger: #ee0701;
  --c-warning: #ff8105;
  --c-success: #01c009;
  /* Metrics 전용 롱/숏 컬러 */
  --c-metrics-long: #5EC888;
  --c-metrics-long-rgb: 94, 200, 136;
  --c-metrics-long-2: #22ab94;
  --c-metrics-short: #E99797;
  --c-metrics-short-rgb: 233, 151, 151;
  --c-metrics-short-2: #f23645;
  /* LSR(롱숏비율) 캔버스 차트(히스토리) 색상 */
  --cw-lsr-history-grid: rgba(180, 180, 190, 0.3);
  --cw-lsr-history-axis: rgba(0, 0, 0, 0.7);
  --cw-lsr-history-point-stroke: #000000;
  --cw-lsr-history-point-fill: #ffffff;
  /* 보조/역상 텍스트 */
  --c-on-primary: #ffffff;
  --c-text-inverse: #ffffff;
  /* RGB 토큰 (알파용) */
  --c-primary-rgb: 0, 123, 247;
  --c-warning-rgb: 255, 203, 71;
  --c-success-rgb: 1, 192, 9;
  /* 도메인/배지/상태 */
  --c-like: #e41e3f;
  --c-like-rgb: 228, 30, 63;
  --c-hot: #ff3061;
  --c-short: #ff5a5f;
  --c-long: #00a389;
  --c-badge-new: #42b883;
  /* 배너/그래디언트 */
  --c-banner-grad-start: #667eea;
  --c-banner-grad-end: #764ba2;
  /* 오버레이/섀도우 프리셋 */
  --c-overlay-05: rgba(0, 0, 0, 0.05);
  --c-overlay-08: rgba(0, 0, 0, 0.08);
  --c-overlay-10: rgba(0, 0, 0, 0.10);
  --c-overlay-12: rgba(0, 0, 0, 0.12);
  --c-overlay-15: rgba(0, 0, 0, 0.15);
  --c-overlay-35: rgba(0, 0, 0, 0.35);
  --c-overlay-50: rgba(0, 0, 0, 0.50);
  --c-overlay-70: rgba(0, 0, 0, 0.70);
  --c-overlay-80: rgba(0, 0, 0, 0.80);
  --c-overlay-85: rgba(0, 0, 0, 0.85);
  --c-overlay-90: rgba(0, 0, 0, 0.90);
  /* 밝은면 오버레이 */
  --c-bg-overlay-90: rgba(255, 255, 255, 0.90);
  --c-bg-overlay-95: rgba(255, 255, 255, 0.95);
  /* 칩/배지 등 작은 구분 배경 */
  --c-chip-bg: #e5e7eb;
  /* 브랜드 컬러 */
  --c-brand-naver: #03c75a;
  --c-brand-kakao: #fee500;
  --c-brand-google: #4285f4;
  --c-brand-facebook: #1877f2;
  /* 모바일 차트 좌우 그림자 */
  --c-side-shadow: rgba(0, 0, 0, 0.16);
}

.theme-dark {
  /* 다크 테마 토큰 */
  --c-bg: #0f0f10;
  --c-surface: #121316;
  --c-text: #f5f6f8;
  --c-text-muted: #a8b0ba;
  --c-border: #2a2d33;
  --c-hover: #1a1c20;
  --c-scrollbar-thumb: #6b7280;
  --c-primary: #4A90E2;
  --c-primary-600: #3a78c5;
  --c-danger: #f74545;
  --c-warning: #ff8105;
  --c-success: #14d31c;
  /* Metrics 전용 롱/숏 컬러 */
  --c-metrics-long: #0ecb81;
  --c-metrics-long-rgb: 14, 203, 129;
  --c-metrics-short: #f6465d;
  --c-metrics-short-rgb: 246, 70, 93;
  /* LSR(롱숏비율) 캔버스 차트(히스토리) 색상 - 다크모드 */
  --cw-lsr-history-grid: rgba(255, 255, 255, 0.35);
  --cw-lsr-history-axis: rgba(255, 255, 255, 0.9);
  --cw-lsr-history-point-stroke: #000000;
  --cw-lsr-history-point-fill: #ffffff;
  /* 보조/역상 텍스트 */
  --c-on-primary: #ffffff;
  --c-text-inverse: #ffffff;
  /* RGB 토큰 (알파용) */
  --c-primary-rgb: 74, 144, 226;
  --c-warning-rgb: 255, 203, 71;
  --c-success-rgb: 20, 211, 28;
  /* 도메인/배지/상태 */
  --c-like: #e41e3f;
  --c-like-rgb: 228, 30, 63;
  --c-hot: #ff3061;
  --c-short: #ff5a5f;
  --c-long: #00a389;
  --c-badge-new: #42b883;
  /* 배너/그래디언트 */
  --c-banner-grad-start: #667eea;
  --c-banner-grad-end: #764ba2;
  /* 오버레이/섀도우 프리셋 */
  --c-overlay-05: rgba(0, 0, 0, 0.05);
  --c-overlay-08: rgba(0, 0, 0, 0.08);
  --c-overlay-10: rgba(0, 0, 0, 0.10);
  --c-overlay-12: rgba(0, 0, 0, 0.12);
  --c-overlay-15: rgba(0, 0, 0, 0.15);
  --c-overlay-35: rgba(0, 0, 0, 0.35);
  --c-overlay-50: rgba(0, 0, 0, 0.50);
  --c-overlay-70: rgba(0, 0, 0, 0.70);
  --c-overlay-80: rgba(0, 0, 0, 0.80);
  --c-overlay-85: rgba(0, 0, 0, 0.85);
  --c-overlay-90: rgba(0, 0, 0, 0.90);
  /* 어두운면 오버레이 */
  --c-bg-overlay-90: rgba(18, 19, 22, 0.90);
  --c-bg-overlay-95: rgba(18, 19, 22, 0.95);
  /* 칩/배지 등 작은 구분 배경 */
  --c-chip-bg: #2a2d33;
  /* 브랜드 컬러 */
  --c-brand-naver: #03c75a;
  --c-brand-kakao: #fee500;
  --c-brand-google: #4285f4;
  --c-brand-facebook: #1877f2;
  /* 모바일 차트 좌우 그림자 */
  --c-side-shadow: rgba(255, 255, 255, 0.18);
}

body.has-top-notice {
  padding-top: 52px;
}
body.has-top-notice.notice-closed {
  padding-top: 0;
}

body.has-top-notice:not(.notice-closed) .coinwhy-wrapper #mainHeader {
  top: 52px;
}

.coinwhy-wrapper .top-notice {
  background: linear-gradient(90deg, var(--c-primary) 0%, var(--c-primary-600) 100%);
  color: var(--c-on-primary);
  font-size: 0.95rem;
  width: 100%;
  height: 52px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .top-notice.closed {
  display: none;
}
.coinwhy-wrapper .top-notice .container {
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
  height: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  justify-content: center;
  color: var(--c-on-primary);
  text-decoration: none;
}
.coinwhy-wrapper .top-notice .container:hover {
  background: var(--c-overlay-05);
}
.coinwhy-wrapper .top-notice .notice-text {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .top-notice .notice-text .notice-text-icon {
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .top-notice .notice-text .notice-text-icon img {
  width: 16px;
  height: 16px;
  object-fit: contain;
}
.coinwhy-wrapper .top-notice .notice-text .notice-text-mobile {
  display: none;
}
.coinwhy-wrapper .top-notice .notice-text .notice-text-desktop {
  display: inline;
}
.coinwhy-wrapper .top-notice .notice-close {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--c-on-primary);
  font-size: 0.8rem;
  cursor: pointer;
  padding: 6px 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-radius: 4px;
  white-space: nowrap;
}
.coinwhy-wrapper .top-notice .notice-close:hover {
  opacity: 0.9;
}
.coinwhy-wrapper .top-notice .notice-close svg {
  stroke: currentColor;
  flex-shrink: 0;
}
.coinwhy-wrapper #mainHeader {
  background: var(--c-surface);
  border-bottom: 1px solid var(--c-border);
  padding: 12px 0;
  position: sticky;
  top: 0;
  z-index: 90;
}
.coinwhy-wrapper #mainHeader .container {
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}
.coinwhy-wrapper #mainHeader .header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
}
.coinwhy-wrapper #mainHeader .header-content .logo a {
  display: inline-block;
}
.coinwhy-wrapper #mainHeader .header-content .logo a img {
  width: 130px;
}
.coinwhy-wrapper #mainHeader .header-content .gnb {
  margin-right: auto;
  margin-left: 70px;
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list {
  display: flex;
  gap: 35px;
  align-items: center;
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li {
  position: relative;
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li a {
  color: var(--c-text);
  font-weight: 700;
  padding: 8px;
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li a:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li.active a {
  color: var(--c-primary);
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li.has-dropdown .dropdown-toggle {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding-right: 0;
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li.has-dropdown .dropdown-toggle svg {
  color: var(--c-text-muted);
  flex-shrink: 0;
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li.has-dropdown .dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  box-shadow: 0 4px 12px var(--c-overlay-10);
  display: none;
  min-width: 160px;
  z-index: 1000;
  overflow: hidden;
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li.has-dropdown .dropdown-menu li a {
  display: block;
  padding: 10px 16px;
  font-weight: 600;
  color: var(--c-text);
  white-space: nowrap;
  font-size: 0.9rem;
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li.has-dropdown .dropdown-menu li a:hover {
  background: var(--c-hover);
  color: var(--c-primary);
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li.has-dropdown .dropdown-menu li.active a {
  color: var(--c-primary);
  background: rgba(var(--c-primary-rgb), 0.05);
}
.coinwhy-wrapper #mainHeader .header-content .gnb .gnb-list li.has-dropdown:hover .dropdown-menu {
  display: block;
}
.coinwhy-wrapper #mainHeader .header-content .header-info {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .theme-toggle-btn {
  width: 30px;
  height: 30px;
  background: var(--c-surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .theme-toggle-btn svg {
  color: var(--c-text);
}
.coinwhy-wrapper #mainHeader .header-content .header-info .visitors {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  background: transparent;
  color: var(--c-text);
  padding: 0;
  border-radius: 0;
  font-size: 0.95rem;
  font-weight: 500;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .visitors .visitors-icon {
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .visitors .visitors-icon img,
.coinwhy-wrapper #mainHeader .header-content .header-info .visitors .visitors-icon svg {
  width: 20px;
  height: 20px;
  object-fit: contain;
  flex-shrink: 0;
  color: var(--c-primary);
}
.coinwhy-wrapper #mainHeader .header-content .header-info .visitors .visitors-count {
  font-weight: 600;
  color: var(--c-primary);
}
.coinwhy-wrapper #mainHeader .header-content .header-info .visitors.visitors-ws {
  cursor: pointer;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .visitors.visitors-ws .visitors-icon img,
.coinwhy-wrapper #mainHeader .header-content .header-info .visitors.visitors-ws .visitors-icon svg {
  color: var(--c-warning);
}
.coinwhy-wrapper #mainHeader .header-content .header-info .visitors.visitors-ws .visitors-count {
  color: var(--c-warning);
}
.coinwhy-wrapper #mainHeader .header-content .header-info .language-selector {
  position: relative;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--c-border);
  padding: 8px 12px;
  border-radius: 5px;
  background: var(--c-surface);
  cursor: pointer;
  font-size: 0.9rem;
  color: var(--c-text);
}
.coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-btn .flag-icon {
  width: 26px;
  height: 26px;
  background-color: var(--c-on-primary);
  border-radius: 50%;
  border: 1px solid var(--c-overlay-08);
  object-fit: contain;
  flex-shrink: 0;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-btn .lang-caret {
  color: var(--c-text-muted);
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  box-shadow: 0 4px 12px var(--c-overlay-10);
  display: none;
  min-width: 120px;
  padding: 8px 0;
  z-index: 1000;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-dropdown .language-option {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 12px;
  color: var(--c-text);
  font-size: 0.9rem;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-dropdown .language-option .flag-icon {
  width: 26px;
  height: 26px;
  background-color: var(--c-on-primary);
  border-radius: 50%;
  border: 1px solid var(--c-overlay-08);
  object-fit: contain;
  flex-shrink: 0;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .mobile-menu-btn {
  display: none;
  background: none;
  border: none;
  padding: 8px;
  cursor: pointer;
}
.coinwhy-wrapper #mainHeader .header-content .header-info .mobile-menu-btn svg {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .online-visitors-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: none;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .online-visitors-modal.is-open {
  display: flex;
}
.coinwhy-wrapper .online-visitors-modal .modal-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background: var(--c-overlay-50);
}
.coinwhy-wrapper .online-visitors-modal .modal-content {
  background: var(--c-surface);
  border-radius: 8px;
  border: 1px solid var(--c-border);
  overflow: hidden;
  box-shadow: 0 2px 4px var(--c-overlay-10), 0 8px 16px var(--c-overlay-10);
  width: min(480px, 100% - 32px);
  max-height: 80vh;
  position: relative;
  display: flex;
  flex-direction: column;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__header {
  padding: 12px 16px;
  border-bottom: 1px solid var(--c-border);
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__header .visitors-modal__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--c-text);
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__header .visitors-modal__close {
  background: none;
  border: none;
  padding: 4px;
  cursor: pointer;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__header .visitors-modal__close svg {
  width: 18px;
  height: 18px;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .modal-body {
  padding: 10px 16px 14px;
  overflow-y: auto;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__summary {
  font-size: 0.85rem;
  color: var(--c-text-muted);
  margin-bottom: 8px;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
  padding: 8px 0;
  gap: 10px;
  border-bottom: 1px solid var(--c-border-subtle);
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__item:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__avatar {
  flex-shrink: 0;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__avatar img {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  object-fit: cover;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__info {
  flex: 1 1 auto;
  min-width: 0;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__info .visitors-modal__primary {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--c-text);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__info .visitors-modal__secondary {
  font-size: 0.8rem;
  color: var(--c-text-muted);
  margin-top: 2px;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__meta {
  flex-shrink: 0;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__meta .visitors-modal__badge {
  display: inline-block;
  min-width: 24px;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  text-align: center;
  background: var(--c-bg-soft);
  color: var(--c-text-muted);
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__footer {
  margin-top: 8px;
  text-align: right;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__footer .visitors-modal__refresh {
  font-size: 0.8rem;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--c-border);
  background: var(--c-surface-elevated);
  color: var(--c-text-muted);
  cursor: pointer;
}
.coinwhy-wrapper .online-visitors-modal .modal-content .visitors-modal__footer .visitors-modal__refresh:hover {
  background: var(--c-hover);
  color: var(--c-text);
}
@media screen and (max-width: 1280px) {
  .coinwhy-wrapper #mainHeader .header-content .gnb {
    margin-left: 40px;
  }
  .coinwhy-wrapper #mainHeader .header-content .header-info {
    gap: 10px;
  }
  .coinwhy-wrapper #mainHeader .header-content .header-info .visitors {
    display: none;
  }
  .coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-btn {
    padding: 6px;
    gap: 0;
    border: none;
    background: transparent;
  }
  .coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-btn .language-name {
    display: none;
    color: var(--c-text);
  }
  .coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-btn .mobile-hide {
    display: none;
  }
  .coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-btn .flag-icon {
    width: 30px;
    height: 30px;
  }
  .coinwhy-wrapper #mainHeader .header-content .header-info .language-selector .language-dropdown {
    display: none;
  }
  .coinwhy-wrapper #mainHeader .header-content .header-info .mobile-menu-btn {
    display: flex;
  }
}
@media screen and (max-width: 1024px) {
  .coinwhy-wrapper .top-notice {
    height: 40px;
  }
  .coinwhy-wrapper .top-notice .container {
    padding: 0 15px;
  }
  .coinwhy-wrapper .top-notice .notice-text {
    font-size: 0.85rem;
  }
  .coinwhy-wrapper .top-notice .notice-close {
    right: 5px;
    font-size: 0.65rem;
    padding: 4px 8px;
    gap: 3px;
  }
  .coinwhy-wrapper .top-notice .notice-close .notice-close-text {
    display: none;
  }
  .coinwhy-wrapper #mainHeader {
    top: 0;
    padding: 6px 0;
  }
  .coinwhy-wrapper #mainHeader .container {
    padding: 0 15px;
  }
  .coinwhy-wrapper #mainHeader .header-content .gnb {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper #mainHeader {
    padding: 3px 0;
  }
  .coinwhy-wrapper #mainHeader .header-content .header-info {
    gap: 6px;
  }
  .coinwhy-wrapper .top-notice .notice-text .notice-text-desktop {
    display: none;
  }
  .coinwhy-wrapper .top-notice .notice-text .notice-text-mobile {
    display: inline;
  }
}

@media screen and (max-width: 1024px) {
  body.has-top-notice {
    padding-top: 40px;
  }
  body.has-top-notice.notice-closed {
    padding-top: 0;
  }
  body.has-top-notice:not(.notice-closed) .coinwhy-wrapper #mainHeader {
    top: 40px;
  }
}
:root {
  --mobile-bottom-nav-height: 0px;
}

.coinwhy-wrapper .footer {
  background-color: var(--c-surface);
  border-top: 1px solid var(--c-border);
  padding: 48px 80px;
  padding-bottom: calc(48px + var(--mobile-bottom-nav-height));
  width: 100%;
  margin: 0 auto;
  margin-top: 40px;
}
.coinwhy-wrapper .footer .container {
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
}
.coinwhy-wrapper .footer .footer-content {
  text-align: center;
}
.coinwhy-wrapper .footer .footer-links {
  margin-bottom: 30px;
}
.coinwhy-wrapper .footer .footer-links a {
  color: var(--c-text);
  margin: 0 16px;
  font-size: 0.9rem;
}
.coinwhy-wrapper .footer .footer-info .copyright {
  color: var(--c-text-muted);
  font-size: 0.9rem;
  margin-bottom: 12px;
  font-weight: 500;
}
.coinwhy-wrapper .footer .footer-info .company-info {
  color: var(--c-text-muted);
  font-size: 0.85rem;
  line-height: 1.6;
  max-width: 600px;
  margin: 0 auto;
}
.coinwhy-wrapper .footer #top_btn {
  position: fixed;
  bottom: calc(var(--mobile-bottom-nav-height) + 30px);
  right: 30px;
  width: 50px;
  height: 50px;
  background: var(--c-primary);
  color: var(--c-on-primary);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 4px 12px var(--c-overlay-15);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  opacity: 0;
  transform: translateY(80px);
  pointer-events: none;
}
.coinwhy-wrapper .footer #top_btn i {
  font-size: 1rem;
}
.coinwhy-wrapper .footer #top_btn.show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.coinwhy-wrapper #ft {
  min-width: 0;
}
.coinwhy-wrapper .mobile-bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--c-surface);
  border-top: 1px solid var(--c-border);
  z-index: 1000;
  display: none;
}
.coinwhy-wrapper .mobile-bottom-nav .nav-list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 10px;
  margin: 0;
  list-style: none;
}
.coinwhy-wrapper .mobile-bottom-nav .nav-list li {
  flex: 1;
}
.coinwhy-wrapper .mobile-bottom-nav .nav-list .nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  text-decoration: none;
  color: var(--c-text-muted);
  font-size: 11px;
  font-weight: 600;
}
.coinwhy-wrapper .mobile-bottom-nav .nav-list .nav-item .icon {
  line-height: 0;
}
.coinwhy-wrapper .mobile-bottom-nav .nav-list .nav-item.active {
  color: var(--c-primary);
}
.coinwhy-wrapper .mobile-bottom-nav .nav-list .nav-item.active svg {
  stroke: var(--c-primary);
}
.coinwhy-wrapper .mobile-bottom-nav .nav-list .nav-item:hover {
  color: var(--c-text);
}
.coinwhy-wrapper .mobile-bottom-nav .bottom-safe {
  height: env(safe-area-inset-bottom);
}
@media screen and (max-width: 1024px) {
  .coinwhy-wrapper .footer {
    padding: 32px 32px 80px 32px;
    padding-bottom: calc(80px + var(--mobile-bottom-nav-height));
  }
  .coinwhy-wrapper .footer #top_btn {
    bottom: calc(var(--mobile-bottom-nav-height) + 15px);
    right: 12px;
  }
  .coinwhy-wrapper .mobile-bottom-nav {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .footer {
    margin-top: 0;
    padding: 32px 10px 80px 10px;
    padding-bottom: calc(80px + var(--mobile-bottom-nav-height));
  }
  .coinwhy-wrapper .footer .footer-links {
    margin-bottom: 20px;
  }
  .coinwhy-wrapper .footer .footer-links a {
    margin: 0 8px;
  }
  .coinwhy-wrapper .footer #top_btn {
    width: 45px;
    height: 45px;
  }
}

.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .header-link-wrap {
  display: block;
  flex: 1;
  text-decoration: none;
  color: inherit;
  padding: 20px;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .profile-left {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .profile-left .profile-image {
  width: 60px;
  height: 60px;
  min-width: 60px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid var(--c-border);
  flex-shrink: 0;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .profile-left .profile-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .profile-left .username {
  font-size: 1rem;
  font-weight: 600;
  color: var(--c-text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .profile-left .profile-chevron {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .profile-right {
  min-width: 64px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .profile-right .admin-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--c-hover);
  color: var(--c-text-muted);
  text-decoration: none;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .profile-right .admin-btn:hover {
  background: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .user-panel-container .user-panel .user-profile-header .profile-right .admin-btn i {
  font-size: 0.9rem;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-menu-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  border-top: 1px solid var(--c-border);
}
.coinwhy-wrapper .user-panel-container .user-panel .user-menu-list li {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  border-right: 1px solid var(--c-border);
}
.coinwhy-wrapper .user-panel-container .user-panel .user-menu-list li:last-child {
  border-right: none;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-menu-list li a {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--c-text-muted);
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  position: relative;
  width: 100%;
  min-height: 40px;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-menu-list li a:hover {
  background: var(--c-hover);
  color: var(--c-primary);
}
.coinwhy-wrapper .user-panel-container .user-panel .user-menu-list li a .count {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--c-primary);
  color: var(--c-on-primary);
  border-radius: 50%;
  width: 20px;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.7rem;
  font-weight: 600;
}
.coinwhy-wrapper .user-panel-container .user-panel .user-menu-list li a .count:empty {
  display: none;
}

.coinwhy-wrapper .payback-card {
  display: block;
  width: 100%;
  padding: 14px 16px;
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(var(--c-primary-rgb), 0.98), rgba(var(--c-primary-rgb), 0.7));
  color: var(--c-on-primary);
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(var(--c-primary-rgb), 0.28);
  position: relative;
  overflow: hidden;
  transition: transform 0.15s ease-out, box-shadow 0.15s ease-out, opacity 0.15s ease-out;
}
.coinwhy-wrapper .payback-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(var(--c-primary-rgb), 0.34);
}
.coinwhy-wrapper .payback-card__header {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
}
.coinwhy-wrapper .payback-card__icon {
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .payback-card__icon-svg {
  color: var(--c-on-primary);
}
.coinwhy-wrapper .payback-card__title {
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.coinwhy-wrapper .payback-card__desc {
  margin: 0;
  margin-top: 2px;
  font-size: 0.85rem;
  line-height: 1.4;
  opacity: 0.9;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .auth-tabs, .coinwhy-wrapper .sidebar .tab-header {
  display: flex;
  padding: 0 20px;
  margin-bottom: 10px;
}
.coinwhy-wrapper .auth-tabs .tab-btn, .coinwhy-wrapper .sidebar .tab-header .tab-btn {
  flex: 1;
  padding-bottom: 5px;
  background: none;
  border: none;
  cursor: pointer;
  font-weight: 500;
  font-size: 1rem;
  color: var(--c-text-muted);
  position: relative;
  text-align: center;
}
.coinwhy-wrapper .auth-tabs .tab-btn.active, .coinwhy-wrapper .sidebar .tab-header .tab-btn.active {
  color: var(--c-primary);
  font-weight: 700;
}
.coinwhy-wrapper .auth-tabs .tab-btn.active::after, .coinwhy-wrapper .sidebar .tab-header .tab-btn.active::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 4px;
  background: var(--c-primary);
  border-radius: 4px;
}
.coinwhy-wrapper .auth-tabs .tab-btn:hover:not(.active), .coinwhy-wrapper .sidebar .tab-header .tab-btn:hover:not(.active) {
  color: var(--c-text);
}
.coinwhy-wrapper .auth-tabs .tab-title, .coinwhy-wrapper .sidebar .tab-header .tab-title {
  width: 100%;
  padding-bottom: 5px;
  font-weight: 700;
  font-size: 1rem;
  color: var(--c-primary);
  position: relative;
  text-align: center;
}
.coinwhy-wrapper .auth-tabs .tab-title::after, .coinwhy-wrapper .sidebar .tab-header .tab-title::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 4px;
  background: var(--c-primary);
  border-radius: 4px;
}
.coinwhy-wrapper .sidebar .sidebar-section {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 15px;
  margin-bottom: 10px;
}
.coinwhy-wrapper .sidebar .sidebar-section.login-section {
  padding: 15px 25px;
}
.coinwhy-wrapper .sidebar .sidebar-section.login-section:has(.user-panel-container) {
  padding: 0;
}
.coinwhy-wrapper .sidebar .sidebar-section.banner-section {
  padding: 0;
  border: none;
}
.coinwhy-wrapper .sidebar .sidebar-title {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 16px;
  color: var(--c-text);
  padding-bottom: 8px;
  border-bottom: 2px solid var(--c-primary);
  position: relative;
}
.coinwhy-wrapper .sidebar .sidebar-title::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 30px;
  height: 3px;
  background: var(--c-primary-600);
}
.coinwhy-wrapper .sidebar .tab-content {
  display: none;
}
.coinwhy-wrapper .sidebar .tab-content.active {
  display: block;
}
.coinwhy-wrapper .sidebar .latest-list .latest-item {
  padding: 5px 0;
}
.coinwhy-wrapper .sidebar .latest-list .latest-item:first-child .latest-subject {
  font-weight: 700;
}
.coinwhy-wrapper .sidebar .latest-list .latest-item:hover {
  background: rgba(var(--c-primary-rgb), 0.02);
  margin: 0 -8px;
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 4px;
}
.coinwhy-wrapper .sidebar .latest-list .latest-item .latest-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
}
.coinwhy-wrapper .sidebar .latest-list .latest-item .latest-link:hover .latest-subject {
  color: var(--c-primary);
}
.coinwhy-wrapper .sidebar .latest-list .latest-item .latest-link .latest-subject {
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.9rem;
  color: var(--c-text);
}
.coinwhy-wrapper .sidebar .latest-list .latest-item .latest-link .latest-time {
  color: var(--c-warning);
  font-size: 0.8rem;
  font-weight: 500;
  flex-shrink: 0;
  transform: translateY(-1px);
}
.coinwhy-wrapper .sidebar .latest-list .latest-item .latest-link .latest-content {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0;
}
.coinwhy-wrapper .sidebar .latest-list .latest-item .latest-link .latest-content .board-label {
  font-size: 0.85rem;
  color: var(--c-primary);
  font-weight: 600;
  flex-shrink: 0;
  margin-right: 4px;
}
.coinwhy-wrapper .sidebar .latest-list .latest-item .latest-link .latest-content .latest-subject {
  margin: 0;
  flex: 0 1 auto;
  min-width: 0;
}
.coinwhy-wrapper .sidebar .latest-list .latest-item .latest-link .latest-content .latest-comments {
  font-size: 0.8rem;
  color: var(--c-warning);
  font-weight: 500;
  flex-shrink: 0;
  white-space: nowrap;
  margin-left: 3px;
  transform: translateY(-1px);
}
.coinwhy-wrapper .sidebar .popular-section .tab-content {
  display: block;
}
.coinwhy-wrapper .sidebar .popular-section .latest-item .latest-link {
  display: flex;
  align-items: center;
  padding: 0;
}
.coinwhy-wrapper .sidebar .popular-section .latest-item .latest-link .latest-number {
  width: 20px;
  height: 20px;
  background: var(--c-primary);
  color: var(--c-on-primary);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.8rem;
  flex-shrink: 0;
}

.coinwhy-wrapper .mobile-sidebar-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: var(--c-overlay-50);
  z-index: 1001;
  opacity: 0;
  visibility: hidden;
}
.coinwhy-wrapper .mobile-sidebar-overlay.active {
  opacity: 1;
  visibility: visible;
}
@media screen and (min-width: 1280px) {
  .coinwhy-wrapper .mobile-sidebar-overlay {
    display: none;
  }
}
.coinwhy-wrapper .mobile-sidebar {
  position: fixed;
  top: 0;
  right: 0;
  width: 320px;
  height: 100vh;
  background: var(--c-surface);
  z-index: 1002;
  transform: translateX(100%);
  overflow-y: overlay;
  scrollbar-width: none;
}
.coinwhy-wrapper .mobile-sidebar::-webkit-scrollbar {
  width: 0;
}
.coinwhy-wrapper .mobile-sidebar.active {
  transform: translateX(0);
}
@media screen and (min-width: 1280px) {
  .coinwhy-wrapper .mobile-sidebar {
    display: none;
  }
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--c-surface);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5px 10px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--c-text);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .mobile-sidebar-header-left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding-left: 10px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .visitors {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  background: transparent;
  color: var(--c-text);
  padding: 0;
  border-radius: 0;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .visitors .visitors-icon {
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .visitors .visitors-icon img,
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .visitors .visitors-icon svg {
  width: 18px;
  height: 18px;
  object-fit: contain;
  flex-shrink: 0;
  color: var(--c-primary);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .visitors .visitors-count {
  font-weight: 700;
  color: var(--c-primary);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .visitors.visitors-ws {
  cursor: pointer;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .visitors.visitors-ws .visitors-icon img,
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .visitors.visitors-ws .visitors-icon svg {
  color: var(--c-warning);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .visitors.visitors-ws .visitors-count {
  color: var(--c-warning);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .mobile-sidebar-close {
  background: none;
  border: none;
  padding: 8px;
  cursor: pointer;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-header .mobile-sidebar-close svg {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content {
  padding: 0 20px 100px 20px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-banner-area {
  margin-bottom: 15px;
  padding-top: 10px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-banner-area .payback-card--mobile {
  padding: 13px 14px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-banner-area .payback-card--mobile .payback-card__title {
  font-size: 0.95rem;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-banner-area .payback-card--mobile .payback-card__desc {
  font-size: 0.82rem;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-auth-buttons {
  display: flex;
  gap: 12px;
  margin-bottom: 15px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-auth-buttons a {
  flex: 1;
  padding: 12px;
  border: 1px solid var(--c-border);
  border-radius: 5px;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-auth-buttons a.mobile-signup-btn {
  background: var(--c-surface);
  color: var(--c-text);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-auth-buttons a.mobile-login-btn {
  background: var(--c-primary);
  color: var(--c-on-primary);
  border-color: var(--c-primary);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel {
  margin-bottom: 10px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-header .header-link-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
  text-decoration: none;
  color: inherit;
  padding: 8px 0;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-header .header-link-wrap .profile-left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  align-items: center;
  gap: 10px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-header .header-link-wrap .profile-left .profile-image {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid var(--c-border);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-header .header-link-wrap .profile-left .profile-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-header .header-link-wrap .profile-left .username {
  font-weight: 600;
  color: var(--c-text);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-header .header-link-wrap .profile-chevron {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-quick {
  margin-top: 5px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-quick .quick-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-quick .quick-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  text-decoration: none;
  color: var(--c-text);
  font-weight: 600;
  font-size: 0.95rem;
  padding: 10px 0;
  background: none;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-quick .quick-item:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-quick .quick-item .quick-icon {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-quick .quick-item .icon-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-quick .quick-item .label {
  line-height: 1.2;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-quick .quick-item .count {
  position: absolute;
  top: -6px;
  right: -8px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  font-size: 11px;
  line-height: 18px;
  font-weight: 700;
  color: var(--c-on-primary);
  background: var(--c-primary);
  text-align: center;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-user-panel .mobile-user-quick .quick-item .count:empty {
  display: none;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav {
  margin-bottom: 20px;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list li {
  margin-bottom: 0;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list li > a {
  display: block;
  padding: 16px 0;
  color: var(--c-text);
  font-weight: 600;
  font-size: 1rem;
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list li > a:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list li.active > a {
  color: var(--c-primary);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown {
  margin-bottom: 0;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-toggle {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
  width: 100%;
  padding: 16px 0;
  background: none;
  border: none;
  border-bottom: 1px solid var(--c-border);
  color: var(--c-text);
  font-weight: 600;
  font-size: 1rem;
  text-align: left;
  cursor: pointer;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-toggle:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-toggle .user-info {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-toggle .user-info .profile-image {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid var(--c-border);
  flex-shrink: 0;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-toggle .user-info .profile-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-toggle .user-info .username {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--c-text);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-toggle .dropdown-arrow {
  color: var(--c-text-muted);
  flex-shrink: 0;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown.active .mobile-nav-dropdown-toggle {
  color: var(--c-primary);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-menu {
  max-height: 0;
  overflow: hidden;
  background: var(--c-hover);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-menu.active {
  max-height: none;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-menu li {
  margin-bottom: 0;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-menu li a {
  display: block;
  padding: 12px 20px;
  color: var(--c-text);
  font-size: 0.9rem;
  font-weight: 600;
  border-bottom: 1px solid var(--c-border);
  position: relative;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-menu li a:hover {
  color: var(--c-primary);
  background: var(--c-hover);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-menu li a:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-menu li a .count {
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  background: var(--c-primary);
  color: var(--c-on-primary);
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 600;
  min-width: 20px;
  height: 20px;
  text-align: center;
  line-height: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-menu li a .count:empty {
  display: none;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-nav .mobile-nav-list .mobile-nav-dropdown .mobile-nav-dropdown-menu li.active a {
  color: var(--c-primary);
  background: rgba(var(--c-primary-rgb), 0.05);
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-logout-wrap {
  padding: 16px 0 24px;
  text-align: center;
}
.coinwhy-wrapper .mobile-sidebar .mobile-sidebar-content .mobile-logout-wrap .mobile-logout-link {
  color: var(--c-text-muted);
  text-decoration: underline;
  font-weight: 600;
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .mobile-sidebar {
    width: 300px;
  }
}

html.mobile-sidebar-open {
  overflow: hidden;
}

.coinwhy-wrapper#wrapper {
  max-width: none;
  margin: 0;
  padding: 0;
  min-height: 100vh;
  min-width: 0;
  display: flex;
  flex-direction: column;
  background-color: var(--c-bg);
}
.coinwhy-wrapper #container {
  max-width: 1280px;
  min-height: auto;
  width: 100%;
  margin: 0 auto;
  padding: 20px;
  display: flex;
  gap: 10px;
  flex: 1;
  align-items: flex-start;
  overflow-x: hidden;
}
.coinwhy-wrapper #container .sidebar-wrapper {
  width: 320px;
  flex-shrink: 0;
}
.coinwhy-wrapper .main-content {
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .main-content section {
  margin-bottom: 10px;
}
body.has-sidebar .coinwhy-wrapper #container {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 10px;
}
@media screen and (max-width: 1280px) {
  body.has-sidebar .coinwhy-wrapper #container {
    grid-template-columns: 1fr;
  }
}
.coinwhy-wrapper #container::after {
  display: none;
  content: none;
}
@media screen and (max-width: 1280px) {
  .coinwhy-wrapper #container {
    max-width: 100%;
  }
  .coinwhy-wrapper #container .sidebar-wrapper {
    display: none;
  }
}
@media screen and (max-width: 1024px) {
  .coinwhy-wrapper #container {
    padding: 16px;
  }
  .coinwhy-wrapper .main-content section {
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper #container {
    padding: 0;
  }
}
.coinwhy-wrapper .metrics-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  align-items: stretch;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .metrics-grid {
    grid-template-columns: 1fr;
  }
}

html.cw-modal-open,
body.cw-modal-open {
  overflow: hidden !important;
}

.coinwhy-wrapper .profile-popover-wrapper {
  position: relative;
  display: inline-block;
}
.coinwhy-wrapper .profile-popover-wrapper .profile-popover-trigger {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}
.coinwhy-wrapper .profile-popover-wrapper .profile-popover-trigger:focus {
  outline: none;
}
.coinwhy-wrapper .profile-popover-wrapper .profile-popover-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  box-shadow: 0 4px 12px var(--c-overlay-15);
  padding: 8px 0;
  min-width: 140px;
  z-index: 100;
  display: none;
}
.coinwhy-wrapper .profile-popover-wrapper .profile-popover-menu .profile-menu-item {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 16px;
  color: var(--c-text);
  text-decoration: none;
  font-size: 0.9rem;
  border: none;
  background: none;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.2s;
}
.coinwhy-wrapper .profile-popover-wrapper .profile-popover-menu .profile-menu-item:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .profile-popover-wrapper .profile-popover-menu .profile-menu-item i {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 16px;
  font-size: 0.85rem;
  color: var(--c-text-muted);
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .profile-popover-wrapper .profile-popover-menu {
    min-width: 120px;
    padding: 6px 0;
  }
  .coinwhy-wrapper .profile-popover-wrapper .profile-popover-menu .profile-menu-item {
    padding: 6px 12px;
  }
  .coinwhy-wrapper .profile-popover-wrapper .profile-popover-menu .profile-menu-item i {
    width: 14px;
  }
}

.coinwhy-wrapper .cw-tip-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}
.coinwhy-wrapper .cw-tip-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--c-text-muted);
  cursor: pointer;
}
.coinwhy-wrapper .cw-tip-btn:focus-visible {
  outline: 2px solid var(--c-primary);
  outline-offset: 2px;
}
.coinwhy-wrapper .cw-tip-popover {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 6px);
  transform: translateX(calc(-50% + var(--cw-tip-shift-x, 0px)));
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  box-shadow: 0 4px 12px var(--c-overlay-12);
  padding: 10px 12px;
  font-size: 0.8rem;
  line-height: 1.5;
  color: var(--c-text);
  width: min(320px, 80vw);
  z-index: 10;
  display: none;
  opacity: 0;
  pointer-events: none;
  text-align: center;
  word-break: break-all;
  white-space: normal;
}
.coinwhy-wrapper .cw-tip-wrap:hover .cw-tip-popover,
.coinwhy-wrapper .cw-tip-wrap:focus-within .cw-tip-popover {
  display: block;
  opacity: 1;
  pointer-events: auto;
}

.coinwhy-wrapper .cw-notification-stack {
  position: fixed;
  right: 16px;
  bottom: calc(var(--mobile-bottom-nav-height, 0px) + 100px);
  z-index: 3000;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  pointer-events: none;
}
.coinwhy-wrapper .cw-notification {
  position: relative;
  min-width: 260px;
  max-width: 380px;
  background: var(--c-surface);
  color: var(--c-text);
  border-radius: 14px;
  border: 1px solid var(--c-border);
  box-shadow: 0 16px 40px var(--c-overlay-25, rgba(15, 23, 42, 0.3));
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  opacity: 0;
  transform: translateY(16px);
  pointer-events: auto;
  transition: opacity 0.2s ease-out, transform 0.2s ease-out, box-shadow 0.2s ease-out, background-color 0.2s ease-out;
  cursor: pointer;
}
.coinwhy-wrapper .cw-notification.is-entered {
  opacity: 1;
  transform: translateY(0);
}
.coinwhy-wrapper .cw-notification.is-leaving {
  opacity: 0;
  transform: translateY(-8px);
}
.coinwhy-wrapper .cw-notification__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}
.coinwhy-wrapper .cw-notification__title {
  font-size: 0.9rem;
  font-weight: 600;
  margin: 0;
}
.coinwhy-wrapper .cw-notification__title-wrap {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
}
.coinwhy-wrapper .cw-notification__meta {
  margin-left: 6px;
  font-size: 0.75rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .cw-notification__body {
  font-size: 0.85rem;
  line-height: 1.4;
}
.coinwhy-wrapper .cw-notification__user {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}
.coinwhy-wrapper .cw-notification__avatar {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  overflow: hidden;
  flex-shrink: 0;
}
.coinwhy-wrapper .cw-notification__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  display: block;
}
.coinwhy-wrapper .cw-notification__user-name {
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--c-text);
}
.coinwhy-wrapper .cw-notification__message {
  margin: 0;
  word-break: break-word;
}
.coinwhy-wrapper .cw-notification__footer {
  margin-top: 4px;
  display: flex;
  justify-content: flex-end;
}
.coinwhy-wrapper .cw-notification__link {
  font-size: 0.8rem;
  color: var(--c-primary);
  text-decoration: none;
}
.coinwhy-wrapper .cw-notification__link:hover {
  text-decoration: underline;
}
.coinwhy-wrapper .cw-notification__close {
  border: 0;
  background: transparent;
  padding: 2px;
  margin-left: 4px;
  cursor: pointer;
  color: var(--c-text-muted);
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.coinwhy-wrapper .cw-notification__close svg {
  width: 14px;
  height: 14px;
  display: block;
}
.coinwhy-wrapper .cw-notification__close:hover {
  color: var(--c-text);
}
@media screen and (max-width: 1024px) {
  .coinwhy-wrapper .cw-notification-stack {
    bottom: calc(var(--mobile-bottom-nav-height, 0px) + 80px);
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .cw-notification {
    min-width: 220px;
    max-width: 300px;
  }
}

.coinwhy-wrapper #mb_login {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 60vh;
  margin: 40px 0;
}
.coinwhy-wrapper #mb_login .mbskin_box {
  width: 100%;
  max-width: 400px;
  background: var(--c-surface);
  border-radius: 12px;
  padding: 40px 20px;
  border: 1px solid var(--c-border);
}
.coinwhy-wrapper #mb_login .mbskin_box h1 {
  text-align: center;
  margin-bottom: 30px;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--c-text);
}
.coinwhy-wrapper .auth-tabs .tab-btn.signup-link {
  text-decoration: none;
  color: inherit;
}
.coinwhy-wrapper .auth-tabs .tab-btn.signup-link:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .tab-content {
  display: block;
  padding: 0;
}
.coinwhy-wrapper .input-group {
  margin-bottom: 12px;
}
.coinwhy-wrapper .input-group label {
  display: block;
  margin-bottom: 5px;
  font-weight: 500;
  color: var(--c-text);
}
.coinwhy-wrapper .input-group input[type=text],
.coinwhy-wrapper .input-group input[type=password] {
  width: 100%;
  border: none;
  border-radius: 5px;
  padding: 0 15px;
  height: 40px;
  background: var(--c-hover);
  font-size: 0.8rem;
}
.coinwhy-wrapper .input-group input[type=text]::placeholder,
.coinwhy-wrapper .input-group input[type=password]::placeholder {
  color: var(--c-text-muted);
  font-size: 0.9rem;
}
.coinwhy-wrapper .login-btn {
  width: 100%;
  height: 44px;
  background: var(--c-primary);
  border: none;
  color: var(--c-on-primary);
  font-weight: 600;
  font-size: 0.9rem;
  border-radius: 4px;
  cursor: pointer;
  margin-bottom: 15px;
}
.coinwhy-wrapper .login-btn:hover {
  background: var(--c-primary-600);
}
.coinwhy-wrapper .login-options {
  display: flex;
  justify-content: center;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  font-size: 0.85rem;
}
.coinwhy-wrapper .login-options .auto-login {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
}
.coinwhy-wrapper .login-options .auto-login input[type=checkbox] {
  width: 16px;
  height: 16px;
  cursor: pointer;
  appearance: auto;
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  accent-color: var(--c-primary);
}
.coinwhy-wrapper .login-options .auto-login input[type=checkbox]:checked {
  background-color: var(--c-primary);
  border-color: var(--c-primary);
}
.coinwhy-wrapper .login-options .auto-login label {
  cursor: pointer;
  font-weight: normal;
  margin: 0;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .login-options .find-account a {
  color: var(--c-primary);
  text-decoration: none;
  font-size: 0.85rem;
}
.coinwhy-wrapper .login-options .find-account a:hover {
  text-decoration: underline;
}
.coinwhy-wrapper .divider {
  text-align: center;
  margin: 10px 0;
  color: var(--c-text-muted);
  position: relative;
}
.coinwhy-wrapper .divider::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--c-border);
  z-index: 1;
}
.coinwhy-wrapper .divider span {
  background: var(--c-surface);
  padding: 0 15px;
  position: relative;
  z-index: 2;
  font-size: 0.85rem;
}
.coinwhy-wrapper #sns_login {
  border: 0;
  background-color: transparent;
}
.coinwhy-wrapper #sns_login h3 {
  display: none;
}
.coinwhy-wrapper #sns_login .sns-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  margin-top: 0;
}
.coinwhy-wrapper #sns_login .sns-wrap .sns-icon {
  width: 40px;
  height: 40px;
  border: none;
  border-radius: 100%;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: none;
  margin: 0;
  padding: 0;
}
.coinwhy-wrapper #sns_login .sns-wrap .sns-icon .txt {
  display: none;
}
.coinwhy-wrapper #sns_login .sns-wrap .sns-icon .ico {
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: auto !important;
  background-repeat: no-repeat;
  background-position: center;
}
.coinwhy-wrapper #sns_login .sns-wrap .sns-icon.sns-naver {
  background-color: #1fc800;
  background-position: 5px 5px;
}
.coinwhy-wrapper #sns_login .sns-wrap .sns-icon.sns-naver .ico {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56"><path fill="%23FFF" d="M31.988 16.8v11.989L23.684 16.8H16.8v22.4h7.212V27.211L32.316 39.2H39.2V16.8z"/></svg>');
}
.coinwhy-wrapper #sns_login .sns-wrap .sns-icon.sns-kakao {
  background-color: #ffeb00;
  background-position: 5px 5px;
}
.coinwhy-wrapper #sns_login .sns-wrap .sns-icon.sns-kakao .ico {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56"><path d="M28 15.4c-7.732 0-14 4.823-14 10.778 0 3.825 2.596 7.183 6.496 9.098l-1.32 4.8a.39.39 0 0 0 .056.358c.077.104.2.166.33.166a.408.408 0 0 0 .246-.09l5.67-3.735c.825.115 1.664.18 2.522.18 7.73 0 14-4.824 14-10.777C42 20.223 35.73 15.4 28 15.4" fill="%233C1E1E" fill-rule="nonzero"/></svg>');
}
.coinwhy-wrapper #sns_login .sns-wrap .sns-icon.sns-google .ico {
  background-image: url('data:image/svg+xml;utf8,                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56">                          <rect width="56" height="56" rx="28" fill="%23F2F2F2"/>                          <g transform="translate(11.35,11.35) scale(1.85)">                            <path fill="%23EA4335" d="M17.64 9.2045c0-.638-.057-1.251-.163-1.84H9v3.48h4.844c-.209 1.125-.844 2.078-1.791 2.717l2.888 2.257C16.51 13.659 17.64 11.655 17.64 9.2045z"/>                            <path fill="%234285F4" d="M3.93 10.696A5.408 5.408 0 0 1 3.6 9c0-.585.1-1.148.275-1.696V4.97H.94A9.002 9.002 0 0 0 0 9c0 1.488.362 2.893.939 4.03l2.99-2.334z"/>                            <path fill="%23FBBC05" d="M9 3.58c1.319 0 2.504.454 3.437 1.349l2.575-2.575C13.463.938 11.426 0 9 0 5.48 0 2.423 2.623.939 5.97l2.936 2.334C4.646 5.169 6.643 3.58 9 3.58z"/>                            <path fill="%2334A853" d="M9 18c2.43 0 4.467-.806 5.956-2.186l-2.888-2.257c-.805.54-1.836.86-3.068.86-2.357 0-4.354-1.589-5.07-3.72H.939v2.334C2.423 15.377 5.481 18 9 18z"/>                          </g></svg>');
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper #mb_login {
    margin: 0;
    background-color: var(--c-surface);
  }
  .coinwhy-wrapper #mb_login .mbskin_box {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 24px;
    padding-right: 24px;
    max-width: 360px;
    border-top: 0;
    border-bottom: 0;
    padding-bottom: 60px;
  }
}

.coinwhy-wrapper .login-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .login-modal .modal-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background: var(--c-overlay-50);
}
.coinwhy-wrapper .login-modal .modal-content {
  background: var(--c-surface);
  border-radius: 8px;
  border: 1px solid var(--c-border);
  overflow: hidden;
  box-shadow: 0 2px 4px var(--c-overlay-10), 0 8px 16px var(--c-overlay-10);
  width: 90%;
  max-width: 380px;
  position: relative;
}
.coinwhy-wrapper .login-modal .modal-content .login-modal__header {
  padding: 20px 24px 8px;
  background: var(--c-surface);
  text-align: center;
}
.coinwhy-wrapper .login-modal .modal-content .login-modal__title {
  margin: 0;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--c-text);
}
.coinwhy-wrapper .login-modal .modal-content .login-modal__brand {
  color: var(--c-primary);
}
.coinwhy-wrapper .login-modal .modal-content .login-modal__highlight {
  color: var(--c-warning);
}
.coinwhy-wrapper .login-modal .modal-content .modal-body {
  padding: 16px 20px 20px;
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .login-modal .modal-content {
    width: 95%;
    max-width: 300px;
  }
  .coinwhy-wrapper .login-modal .modal-content .login-modal__header {
    padding: 16px 16px 6px;
  }
  .coinwhy-wrapper .login-modal .modal-content .modal-body {
    padding: 16px 20px;
  }
}

.coinwhy-wrapper .write-form-container {
  margin-bottom: 10px;
}
.coinwhy-wrapper .write-form-container .write-box {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 16px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 12px;
  align-items: flex-start;
}
.coinwhy-wrapper .write-form-container .write-avatar {
  flex-shrink: 0;
}
.coinwhy-wrapper .write-form-container .write-avatar img,
.coinwhy-wrapper .write-form-container .write-avatar .guest-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid var(--c-border);
  object-fit: cover;
}
.coinwhy-wrapper .write-form-container .write-avatar .guest-avatar {
  background: var(--c-hover);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .write-form-container .write-content-area {
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-category {
  margin-bottom: 12px;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-category .category-select {
  width: 100%;
  padding: 10px 12px;
  border: none;
  border-radius: 5px;
  background: var(--c-hover);
  color: var(--c-text);
  font-size: 0.9rem;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-category .category-select:focus {
  outline: none;
  background: var(--c-hover);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-subject {
  width: 100%;
  border: none;
  border-radius: 5px;
  background: var(--c-hover);
  font-size: 0.9rem;
  padding: 10px 12px;
  margin-bottom: 12px;
  color: var(--c-text);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-subject::placeholder {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-subject:focus {
  outline: none;
  background: var(--c-hover);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper {
  position: relative;
  width: 100%;
  border-radius: 5px;
  background: var(--c-hover);
  min-height: 100px;
  padding: 10px 12px;
  cursor: text;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper:focus-within {
  background: var(--c-hover);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .write-textarea {
  width: 100%;
  border: none;
  background: transparent;
  resize: none;
  font-family: inherit;
  font-size: 0.9rem;
  line-height: 1.4;
  color: var(--c-text);
  padding: 0;
  min-height: 40px;
  max-height: 180px;
  overflow-y: auto;
  cursor: text;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .write-textarea::placeholder {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .write-textarea:focus {
  outline: none;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
  padding: 0;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview {
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 6px;
  overflow: hidden;
  background: var(--c-hover);
  box-shadow: 0 0 3px var(--c-overlay-50);
  cursor: default;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .preview-loading {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  gap: 4px;
  background: var(--c-hover);
  color: var(--c-text-muted);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .preview-loading i.fa-spinner {
  font-size: 1.2rem;
  color: var(--c-primary);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .preview-loading span {
  font-size: 0.65rem;
  text-align: center;
  line-height: 1.2;
  max-width: 70px;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .image-error {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background: rgba(var(--c-like-rgb), 0.08);
  color: var(--c-danger);
  gap: 4px;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .image-error i {
  font-size: 1.2rem;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .image-error span {
  font-size: 0.6rem;
  text-align: center;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .file-info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, var(--c-overlay-80));
  color: var(--c-text-inverse);
  padding: 8px 4px 4px;
  font-size: 0.6rem;
  line-height: 1.1;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .file-info .file-name {
  display: block;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 2px;
  font-weight: 500;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .file-info .file-size {
  display: block;
  opacity: 0.8;
  font-size: 0.55rem;
  margin-bottom: 1px;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .file-info .file-dimensions {
  display: block;
  opacity: 0.7;
  font-size: 0.5rem;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .remove-file {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 18px;
  height: 18px;
  background: var(--c-overlay-80);
  color: var(--c-text-inverse);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview .remove-file:hover {
  background: var(--c-overlay-90);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 12px;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-options {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 12px;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-options .file-upload-btn {
  color: var(--c-text-muted);
  cursor: pointer;
  padding: 6px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-options .file-upload-btn:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-options .file-upload-btn i {
  font-size: 1.1rem;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-options .option-btn {
  color: var(--c-text-muted);
  cursor: pointer;
  font-size: 0.9rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-options .option-btn:hover {
  color: var(--c-text);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .edit-action-buttons {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .edit-action-buttons .cancel-btn {
  background: var(--c-hover);
  color: var(--c-text-muted);
  border: none;
  padding: 8px 20px;
  border-radius: 6px;
  font-size: 0.9rem;
  font-weight: 600;
  flex-shrink: 0;
  cursor: pointer;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .edit-action-buttons .cancel-btn:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .edit-action-buttons .post-submit-btn {
  background: var(--c-primary);
  color: var(--c-on-primary);
  border: none;
  padding: 8px 20px;
  border-radius: 6px;
  font-size: 0.9rem;
  font-weight: 600;
  flex-shrink: 0;
  cursor: pointer;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .edit-action-buttons .post-submit-btn:hover {
  background: var(--c-primary-600);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .edit-action-buttons .post-submit-btn:disabled {
  background: var(--c-hover);
  color: var(--c-text-muted);
  cursor: not-allowed;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-submit-btn {
  background: var(--c-primary);
  color: var(--c-on-primary);
  border: none;
  padding: 8px 24px;
  border-radius: 6px;
  font-size: 0.9rem;
  font-weight: 600;
  flex-shrink: 0;
  cursor: pointer;
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-submit-btn:hover {
  background: var(--c-primary-600);
}
.coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-submit-btn:disabled {
  background: var(--c-hover);
  color: var(--c-text-muted);
  cursor: not-allowed;
}
.coinwhy-wrapper .submit-loading-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9998;
  display: flex;
  justify-content: center;
  align-items: center;
  display: none;
}
.coinwhy-wrapper .submit-loading-modal .modal-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background: var(--c-overlay-50);
}
.coinwhy-wrapper .submit-loading-modal .modal-content {
  position: relative;
  background: var(--c-surface);
  border-radius: 10px;
  border: 1px solid var(--c-border);
  box-shadow: 0 2px 4px var(--c-overlay-10), 0 8px 16px var(--c-overlay-10);
  padding: 22px 22px 18px;
  width: 90%;
  max-width: 360px;
  text-align: center;
}
.coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__icon {
  margin-bottom: 12px;
}
.coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__icon .fa-spinner {
  font-size: 1.6rem;
  color: var(--c-primary);
}
.coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__title {
  margin: 0 0 6px;
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--c-text);
}
.coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__desc {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--c-text-muted);
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .write-form-container .write-box {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    border-top: none;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .write-form-container .write-box {
    padding: 12px;
    gap: 0px;
    flex-direction: column;
  }
  .coinwhy-wrapper .write-form-container .write-avatar {
    align-self: flex-start;
    margin-bottom: 8px;
  }
  .coinwhy-wrapper .write-form-container .write-avatar img,
  .coinwhy-wrapper .write-form-container .write-avatar .guest-avatar {
    width: 32px;
    height: 32px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area {
    width: 100%;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-category .category-select,
  .coinwhy-wrapper .write-form-container .write-content-area .write-subject {
    width: 100%;
    font-size: 0.9rem;
    padding: 10px 12px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper {
    min-height: 80px;
    padding: 8px 10px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .write-textarea {
    font-size: 0.9rem;
    min-height: 34px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews {
    margin-top: 8px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-input-wrapper .file-previews .file-preview {
    width: 60px;
    height: 60px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-options {
    gap: 12px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-options .file-upload-btn {
    width: 28px;
    height: 28px;
    padding: 4px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-options .file-upload-btn i {
    font-size: 1rem;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-actions .edit-action-buttons {
    gap: 6px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-actions .edit-action-buttons .cancel-btn,
  .coinwhy-wrapper .write-form-container .write-content-area .write-actions .edit-action-buttons .post-submit-btn {
    padding: 6px 14px;
  }
  .coinwhy-wrapper .write-form-container .write-content-area .write-actions .write-submit-btn {
    padding: 6px 14px;
  }
  .coinwhy-wrapper .submit-loading-modal .modal-content {
    width: 90%;
    max-width: 300px;
    padding: 18px 18px 16px;
  }
  .coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__title {
    font-size: 1.05rem;
  }
  .coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__desc {
    font-size: 0.85rem;
  }
}

.coinwhy-wrapper .comment-form-container {
  margin-top: 20px;
  margin-bottom: 20px;
}
.coinwhy-wrapper .comment-form-container .comment-box {
  background: var(--c-surface);
  border-radius: 8px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 12px;
  align-items: flex-start;
}
.coinwhy-wrapper .comment-form-container .comment-avatar {
  flex-shrink: 0;
}
.coinwhy-wrapper .comment-form-container .comment-avatar img,
.coinwhy-wrapper .comment-form-container .comment-avatar .guest-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--c-border);
  object-fit: cover;
}
.coinwhy-wrapper .comment-form-container .comment-avatar .guest-avatar {
  background: var(--c-hover);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .comment-form-container .comment-content-area {
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper {
  position: relative;
  width: 100%;
  border-radius: 5px;
  background: var(--c-hover);
  min-height: 80px;
  padding: 10px 12px;
  cursor: text;
  margin-bottom: 12px;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper:focus-within {
  background: var(--c-hover);
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .comment-textarea {
  width: 100%;
  border: none;
  background: transparent;
  resize: none;
  font-family: inherit;
  font-size: 0.9rem;
  line-height: 1.4;
  color: var(--c-text);
  padding: 0;
  min-height: 40px;
  max-height: 150px;
  overflow-y: auto;
  cursor: text;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .comment-textarea::placeholder {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .comment-textarea:focus {
  outline: none;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview {
  margin-top: 10px;
  cursor: default;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item {
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 6px;
  overflow: hidden;
  background: var(--c-hover);
  box-shadow: 0 0 3px var(--c-overlay-50);
  cursor: default;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item .image-error {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background: rgba(var(--c-like-rgb), 0.08);
  color: var(--c-danger);
  gap: 4px;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item .image-error i {
  font-size: 1.2rem;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item .image-error span {
  font-size: 0.6rem;
  text-align: center;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item .file-info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, var(--c-overlay-80));
  color: var(--c-text-inverse);
  padding: 8px 4px 4px;
  font-size: 0.6rem;
  line-height: 1.1;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item .file-info .file-name {
  display: block;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 2px;
  font-weight: 500;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item .file-info .file-size,
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item .file-info .file-dimensions {
  display: block;
  opacity: 0.8;
  font-size: 0.55rem;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item .remove-comment-file {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 18px;
  height: 18px;
  background: var(--c-overlay-80);
  color: var(--c-text-inverse);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item .remove-comment-file:hover {
  background: var(--c-overlay-90);
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-loading {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 80px;
  height: 80px;
  gap: 4px;
  background: var(--c-hover);
  color: var(--c-text-muted);
  border-radius: 6px;
  cursor: default;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-loading i.fa-spinner {
  font-size: 1.2rem;
  color: var(--c-primary);
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-loading span {
  font-size: 0.65rem;
  text-align: center;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 12px;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options .file-upload-btn {
  color: var(--c-text-muted);
  cursor: pointer;
  padding: 6px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options .file-upload-btn:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options .file-upload-btn i {
  font-size: 1.1rem;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options .option-btn {
  color: var(--c-text-muted);
  cursor: pointer;
  font-size: 0.85rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options .option-btn:hover {
  color: var(--c-text);
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options .option-btn input[type=checkbox] {
  margin-right: 4px;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .reply-action-buttons,
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .edit-action-buttons {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .reply-action-buttons .cancel-btn,
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .edit-action-buttons .cancel-btn {
  background: var(--c-hover);
  color: var(--c-text-muted);
  border: none;
  padding: 8px 20px;
  border-radius: 6px;
  font-size: 0.9rem;
  font-weight: 600;
  flex-shrink: 0;
  cursor: pointer;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .reply-action-buttons .cancel-btn:hover,
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .edit-action-buttons .cancel-btn:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-submit-btn {
  background: var(--c-primary);
  color: var(--c-on-primary);
  border: none;
  padding: 8px 20px;
  border-radius: 6px;
  font-size: 0.9rem;
  font-weight: 600;
  flex-shrink: 0;
  cursor: pointer;
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-submit-btn:hover {
  background: var(--c-primary-600);
}
.coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-submit-btn:disabled {
  background: var(--c-hover);
  color: var(--c-text-muted);
  cursor: not-allowed;
}
.coinwhy-wrapper .submit-loading-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9998;
  display: flex;
  justify-content: center;
  align-items: center;
  display: none;
}
.coinwhy-wrapper .submit-loading-modal .modal-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background: var(--c-overlay-50);
}
.coinwhy-wrapper .submit-loading-modal .modal-content {
  position: relative;
  background: var(--c-surface);
  border-radius: 10px;
  border: 1px solid var(--c-border);
  box-shadow: 0 2px 4px var(--c-overlay-10), 0 8px 16px var(--c-overlay-10);
  padding: 22px 22px 18px;
  width: 90%;
  max-width: 360px;
  text-align: center;
}
.coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__icon {
  margin-bottom: 12px;
}
.coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__icon .fa-spinner {
  font-size: 1.6rem;
  color: var(--c-primary);
}
.coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__title {
  margin: 0 0 6px;
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--c-text);
}
.coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__desc {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--c-text-muted);
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .comment-form-container {
    margin-bottom: 16px;
  }
  .coinwhy-wrapper .comment-form-container .comment-box {
    gap: 8px;
  }
  .coinwhy-wrapper .comment-form-container .comment-avatar img,
  .coinwhy-wrapper .comment-form-container .comment-avatar .guest-avatar {
    width: 30px;
    height: 30px;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper {
    min-height: 70px;
    padding: 8px 10px;
    margin-bottom: 10px;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .comment-textarea {
    min-height: 35px;
    max-height: 120px;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview {
    margin-top: 8px;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-item,
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-input-wrapper .file-preview .comment-file-loading {
    width: 60px;
    height: 60px;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .reply-action-buttons .cancel-btn,
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .edit-action-buttons .cancel-btn {
    padding: 6px 14px;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-submit-btn {
    padding: 6px 14px;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options {
    gap: 10px;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options .file-upload-btn {
    width: 26px;
    height: 26px;
    padding: 5px;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options .file-upload-btn i {
    font-size: 1rem;
  }
  .coinwhy-wrapper .comment-form-container .comment-content-area .comment-actions .comment-options .option-btn {
    font-size: 0.8rem;
  }
  .coinwhy-wrapper .submit-loading-modal .modal-content {
    width: 90%;
    max-width: 300px;
    padding: 18px 18px 16px;
  }
  .coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__title {
    font-size: 1.05rem;
  }
  .coinwhy-wrapper .submit-loading-modal .modal-content .submit-loading__desc {
    font-size: 0.85rem;
  }
}

.coinwhy-wrapper .post-card-free {
  background: var(--c-surface);
  margin-bottom: 0;
  position: relative;
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .post-card-free:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .post-card-free:hover::before {
  content: "";
  position: absolute;
  top: 0;
  left: -12px;
  width: calc(100% + 24px);
  height: 100%;
  background-color: var(--c-hover);
}
.coinwhy-wrapper .post-card-free .post-card-content {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  position: relative;
  z-index: 1;
}
.coinwhy-wrapper .post-card-free .post-checkbox-area {
  width: 30px;
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 19px;
}
.coinwhy-wrapper .post-card-free .post-checkbox-area input[type=checkbox] {
  width: 18px;
  height: 18px;
  cursor: pointer;
  appearance: none;
  background: var(--c-surface);
  border: 2px solid var(--c-border);
  border-radius: 3px;
  position: relative;
}
.coinwhy-wrapper .post-card-free .post-checkbox-area input[type=checkbox]:hover {
  border-color: var(--c-primary);
}
.coinwhy-wrapper .post-card-free .post-checkbox-area input[type=checkbox]:checked {
  background: var(--c-primary);
  border-color: var(--c-primary);
}
.coinwhy-wrapper .post-card-free .post-checkbox-area input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  top: 1px;
  left: 5px;
  width: 4px;
  height: 8px;
  border: solid var(--c-on-primary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.coinwhy-wrapper .post-card-free .post-checkbox-area label {
  position: absolute;
  top: 0;
  left: 0;
  width: 18px;
  height: 18px;
  cursor: pointer;
}
.coinwhy-wrapper .post-card-free .post-card-link {
  display: flex;
  flex-direction: column;
  padding: 16px 0;
  gap: 6px;
  flex: 1;
  min-width: 0;
  text-decoration: none;
  color: inherit;
}
.coinwhy-wrapper .post-card-free .post-card-link:hover {
  text-decoration: none;
  color: inherit;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area {
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-title {
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 5px;
  color: var(--c-text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-title .post-category {
  font-size: 0.8rem;
  color: var(--c-text-muted);
  background: var(--c-hover);
  padding: 3px 8px;
  border-radius: 5px;
  vertical-align: middle;
  display: inline-flex;
  margin-right: 5px;
  transform: translateY(-1px);
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-title .notice-badge {
  display: inline-block;
  background: var(--c-like);
  color: var(--c-on-primary);
  font-size: 0.7rem;
  padding: 2px 6px;
  border-radius: 3px;
  margin-right: 5px;
  vertical-align: middle;
  transform: translateY(-1px);
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-title .new-badge {
  display: inline-block;
  background: var(--c-badge-new);
  color: var(--c-on-primary);
  font-size: 0.7rem;
  padding: 2px 5px;
  border-radius: 3px;
  margin-left: 3px;
  vertical-align: middle;
  transform: translateY(-1px);
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-title .hot-badge {
  display: inline-block;
  background: var(--c-hot);
  color: var(--c-on-primary);
  font-size: 0.7rem;
  padding: 2px 5px;
  border-radius: 3px;
  margin-left: 3px;
  vertical-align: middle;
  transform: translateY(-1px);
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-preview {
  margin-bottom: 10px;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-preview p {
  color: var(--c-text-muted);
  font-size: 0.9rem;
  line-height: 1.6;
  margin: 0;
  padding-right: 10px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-author {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-author .author-profile {
  width: 20px;
  height: 20px;
  line-height: 0;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-author .author-profile img {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-author .author-name {
  font-weight: 600;
  color: var(--c-text);
  font-size: 0.8rem;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-author .time-separator {
  color: var(--c-text-muted);
  font-size: 0.8rem;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-author .post-time {
  font-size: 0.75rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-thumbnail {
  flex-shrink: 0;
  height: 80px;
  aspect-ratio: 120/84;
  margin: 2px 0;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-thumbnail .thumbnail-wrapper {
  width: 100%;
  height: 100%;
  border-radius: 6px;
  overflow: hidden;
  background: var(--c-hover);
}
.coinwhy-wrapper .post-card-free .post-card-link .post-top .post-thumbnail .thumbnail-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta {
  font-size: 0.8rem;
  color: var(--c-text-muted);
  display: block;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .scrap-toggle-btn {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 4px;
  color: var(--c-text-muted);
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .scrap-toggle-btn:hover {
  background: var(--c-hover);
  color: var(--c-text);
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .scrap-toggle-btn i {
  font-size: 18px;
  line-height: 1;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .scrap-toggle-btn.scrapped {
  color: var(--c-primary);
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .scrap-toggle-btn.scrapped i {
  opacity: 1;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .stat-item {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 0.75rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .stat-item .stat-icon {
  opacity: 0.7;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .stat-item .stat-number {
  display: inline-block;
  width: 50px;
  text-align: left;
  font-size: 0.8rem;
  padding-left: 2px;
}
.coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .stat-item i {
  font-size: 0.7rem;
  opacity: 0.7;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .post-card-free .post-checkbox-area {
    width: 24px;
  }
  .coinwhy-wrapper .post-card-free .post-card-link {
    padding-top: 12px;
    padding-bottom: 12px;
    gap: 3px;
    padding-left: 0;
    padding-right: 0;
  }
  .coinwhy-wrapper .post-card-free .post-card-link .post-top {
    gap: 12px;
  }
  .coinwhy-wrapper .post-card-free .post-card-link .post-top .post-thumbnail {
    height: 70px;
    aspect-ratio: 1/1;
  }
  .coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-title {
    margin-bottom: 3px;
  }
  .coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-title .post-category {
    padding: 3px 6px;
    margin-right: 3px;
  }
  .coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-preview {
    margin-bottom: 6px;
  }
  .coinwhy-wrapper .post-card-free .post-card-link .post-top .post-text-area .post-author {
    gap: 6px;
    margin-top: 6px;
  }
  .coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats {
    gap: 0;
  }
  .coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .stat-item {
    gap: 2px;
  }
  .coinwhy-wrapper .post-card-free .post-card-link .post-meta .post-stats .stat-item .stat-number {
    width: 40px;
  }
  .coinwhy-wrapper .post-card-free:hover::before {
    background-color: transparent;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .post-card-free .post-checkbox-area {
    padding-top: 17px;
  }
}

.coinwhy-wrapper .post-card-news .post-author .sentiment-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  border-radius: 9999px;
  font-size: 0.7rem;
  line-height: 1;
}
.coinwhy-wrapper .post-card-news .post-author .sentiment-badge .sentiment-icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
}
.coinwhy-wrapper .post-card-news .post-author .sentiment-badge.sentiment-neu, .coinwhy-wrapper .post-card-news .post-author .sentiment-badge.sentiment-neutral {
  background: var(--c-hover);
  color: var(--c-text-muted);
  border: 1px solid var(--c-border);
}
.coinwhy-wrapper .post-card-news .post-author .sentiment-badge.sentiment-pos, .coinwhy-wrapper .post-card-news .post-author .sentiment-badge.sentiment-positive, .coinwhy-wrapper .post-card-news .post-author .sentiment-badge.sentiment-vpos {
  background: rgba(var(--c-success-rgb, 28, 184, 65), 0.18);
  color: var(--c-success);
  border: 1px solid rgba(var(--c-success-rgb, 28, 184, 65), 0.35);
}
.coinwhy-wrapper .post-card-news .post-author .sentiment-badge.sentiment-neg, .coinwhy-wrapper .post-card-news .post-author .sentiment-badge.sentiment-negative, .coinwhy-wrapper .post-card-news .post-author .sentiment-badge.sentiment-vneg {
  background: rgba(var(--c-danger-rgb, 224, 43, 32), 0.18);
  color: var(--c-danger);
  border: 1px solid rgba(var(--c-danger-rgb, 224, 43, 32), 0.35);
}

.coinwhy-wrapper .post-card-feed .post-author .sentiment-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  border-radius: 9999px;
  font-size: 0.7rem;
  line-height: 1;
}
.coinwhy-wrapper .post-card-feed .post-author .sentiment-badge .sentiment-icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
}
.coinwhy-wrapper .post-card-feed .post-author .sentiment-badge.sentiment-neu, .coinwhy-wrapper .post-card-feed .post-author .sentiment-badge.sentiment-neutral {
  background: var(--c-hover);
  color: var(--c-text-muted);
  border: 1px solid var(--c-border);
}
.coinwhy-wrapper .post-card-feed .post-author .sentiment-badge.sentiment-pos, .coinwhy-wrapper .post-card-feed .post-author .sentiment-badge.sentiment-positive, .coinwhy-wrapper .post-card-feed .post-author .sentiment-badge.sentiment-vpos {
  background: rgba(var(--c-success-rgb, 28, 184, 65), 0.18);
  color: var(--c-success);
  border: 1px solid rgba(var(--c-success-rgb, 28, 184, 65), 0.35);
}
.coinwhy-wrapper .post-card-feed .post-author .sentiment-badge.sentiment-neg, .coinwhy-wrapper .post-card-feed .post-author .sentiment-badge.sentiment-negative, .coinwhy-wrapper .post-card-feed .post-author .sentiment-badge.sentiment-vneg {
  background: rgba(var(--c-danger-rgb, 224, 43, 32), 0.18);
  color: var(--c-danger);
  border: 1px solid rgba(var(--c-danger-rgb, 224, 43, 32), 0.35);
}

.coinwhy-wrapper .post-card-analysis .post-author {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}
.coinwhy-wrapper .post-card-analysis .post-author .author-profile {
  width: 20px;
  height: 20px;
  line-height: 0;
}
.coinwhy-wrapper .post-card-analysis .post-author .author-profile img {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .post-card-analysis .post-author .author-name {
  font-weight: 600;
  color: var(--c-text);
  font-size: 0.8rem;
}
.coinwhy-wrapper .post-card-analysis .post-author .time-separator {
  color: var(--c-text-muted);
  font-size: 0.8rem;
}
.coinwhy-wrapper .post-card-analysis .post-author .post-time {
  font-size: 0.75rem;
  color: var(--c-text-muted);
}

.coinwhy-wrapper .post-card-qa {
  background: var(--c-surface);
  margin-bottom: 0;
  position: relative;
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .post-card-qa:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .post-card-qa:hover::before {
  content: "";
  position: absolute;
  top: 0;
  left: -12px;
  width: calc(100% + 24px);
  height: 100%;
  background-color: var(--c-hover);
}
.coinwhy-wrapper .post-card-qa .post-card-content {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  position: relative;
  z-index: 1;
}
.coinwhy-wrapper .post-card-qa .post-checkbox-area {
  width: 30px;
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 19px;
}
.coinwhy-wrapper .post-card-qa .post-checkbox-area input[type=checkbox] {
  width: 18px;
  height: 18px;
  cursor: pointer;
  appearance: none;
  background: var(--c-surface);
  border: 2px solid var(--c-border);
  border-radius: 3px;
  position: relative;
}
.coinwhy-wrapper .post-card-qa .post-checkbox-area input[type=checkbox]:hover {
  border-color: var(--c-primary);
}
.coinwhy-wrapper .post-card-qa .post-checkbox-area input[type=checkbox]:checked {
  background: var(--c-primary);
  border-color: var(--c-primary);
}
.coinwhy-wrapper .post-card-qa .post-checkbox-area input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  top: 1px;
  left: 5px;
  width: 4px;
  height: 8px;
  border: solid var(--c-on-primary);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.coinwhy-wrapper .post-card-qa .post-checkbox-area label {
  position: absolute;
  top: 0;
  left: 0;
  width: 18px;
  height: 18px;
  cursor: pointer;
}
.coinwhy-wrapper .post-card-qa .post-card-link {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  align-items: flex-start;
  padding: 16px 0;
  gap: 16px;
  flex: 1;
  min-width: 0;
  text-decoration: none;
  color: inherit;
}
.coinwhy-wrapper .post-card-qa .post-card-link:hover {
  text-decoration: none;
  color: inherit;
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area {
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-title {
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 8px;
  color: var(--c-text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-title .post-category {
  font-size: 0.8rem;
  color: var(--c-text-muted);
  background: var(--c-hover);
  padding: 3px 8px;
  border-radius: 5px;
  vertical-align: middle;
  display: inline-flex;
  margin-right: 5px;
  transform: translateY(-1px);
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-title .notice-badge {
  display: inline-block;
  background: var(--c-like);
  color: var(--c-on-primary);
  font-size: 0.7rem;
  padding: 2px 6px;
  border-radius: 3px;
  margin-right: 5px;
  vertical-align: middle;
  transform: translateY(-1px);
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-title .new-badge {
  display: inline-block;
  background: var(--c-badge-new);
  color: var(--c-on-primary);
  font-size: 0.7rem;
  padding: 2px 5px;
  border-radius: 3px;
  margin-left: 3px;
  vertical-align: middle;
  transform: translateY(-1px);
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-title .hot-badge {
  display: inline-block;
  background: var(--c-hot);
  color: var(--c-on-primary);
  font-size: 0.7rem;
  padding: 2px 5px;
  border-radius: 3px;
  margin-left: 3px;
  vertical-align: middle;
  transform: translateY(-1px);
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-title .title-lock-icon {
  vertical-align: middle;
  transform: translateY(-2px);
  margin-left: -1px;
  margin-right: 1px;
  color: var(--c-primary);
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-meta {
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-meta .post-author {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-meta .post-author .author-profile {
  width: 20px;
  height: 20px;
  line-height: 0;
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-meta .post-author .author-profile img {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-meta .post-author .author-name {
  font-weight: 600;
  color: var(--c-text);
  font-size: 0.8rem;
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-meta .post-author .time-separator {
  color: var(--c-text-muted);
  font-size: 0.8rem;
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-meta .post-author .post-time {
  font-size: 0.75rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-answer {
  flex-shrink: 0;
  margin-left: auto;
  align-self: center;
  min-width: 150px;
  text-align: center;
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-answer .answer-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--c-on-primary);
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-answer .answer-badge.waiting {
  background: var(--c-text-muted);
}
.coinwhy-wrapper .post-card-qa .post-card-link .post-answer .answer-badge.done {
  background: var(--c-primary);
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .post-card-qa .post-checkbox-area {
    width: 24px;
  }
  .coinwhy-wrapper .post-card-qa .post-card-link {
    padding-top: 12px;
    padding-bottom: 12px;
    gap: 12px;
    padding-left: 0;
    padding-right: 0;
  }
  .coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-title {
    margin-bottom: 5px;
  }
  .coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-title .post-category {
    padding: 3px 6px;
    margin-right: 3px;
  }
  .coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-meta .post-author {
    gap: 6px;
  }
  .coinwhy-wrapper .post-card-qa .post-card-link .post-answer {
    min-width: 70px;
    text-align: right;
  }
  .coinwhy-wrapper .post-card-qa .post-card-link .post-answer .answer-badge {
    min-width: 70px;
    padding: 6px 10px;
    font-size: 0.85rem;
  }
  .coinwhy-wrapper .post-card-qa:hover::before {
    background-color: transparent;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .post-card-qa .post-checkbox-area {
    padding-top: 17px;
  }
  .coinwhy-wrapper .post-card-qa .post-card-link .post-text-area .post-title .title-lock-icon {
    width: 20px;
  }
}

.coinwhy-wrapper .comment-card[data-depth="1"],
.coinwhy-wrapper .edit-form-container[data-depth="1"] {
  margin-left: 30px;
}
.coinwhy-wrapper .comment-card[data-depth="2"],
.coinwhy-wrapper .edit-form-container[data-depth="2"] {
  margin-left: 60px;
}
.coinwhy-wrapper .comment-card[data-depth="3"],
.coinwhy-wrapper .edit-form-container[data-depth="3"] {
  margin-left: 90px;
}
.coinwhy-wrapper .comment-card[data-depth="4"],
.coinwhy-wrapper .edit-form-container[data-depth="4"] {
  margin-left: 120px;
}
.coinwhy-wrapper .comment-card[data-depth="5"],
.coinwhy-wrapper .edit-form-container[data-depth="5"] {
  margin-left: 150px;
}
.coinwhy-wrapper .comment-card[data-depth="6"], .coinwhy-wrapper .comment-card[data-depth="7"], .coinwhy-wrapper .comment-card[data-depth="8"], .coinwhy-wrapper .comment-card[data-depth="9"], .coinwhy-wrapper .comment-card[data-depth="10"], .coinwhy-wrapper .comment-card[data-depth="11"], .coinwhy-wrapper .comment-card[data-depth="12"], .coinwhy-wrapper .comment-card[data-depth="13"], .coinwhy-wrapper .comment-card[data-depth="14"], .coinwhy-wrapper .comment-card[data-depth="15"], .coinwhy-wrapper .comment-card[data-depth="16"], .coinwhy-wrapper .comment-card[data-depth="17"], .coinwhy-wrapper .comment-card[data-depth="18"], .coinwhy-wrapper .comment-card[data-depth="19"], .coinwhy-wrapper .comment-card[data-depth="20"],
.coinwhy-wrapper .edit-form-container[data-depth="6"],
.coinwhy-wrapper .edit-form-container[data-depth="7"],
.coinwhy-wrapper .edit-form-container[data-depth="8"],
.coinwhy-wrapper .edit-form-container[data-depth="9"],
.coinwhy-wrapper .edit-form-container[data-depth="10"],
.coinwhy-wrapper .edit-form-container[data-depth="11"],
.coinwhy-wrapper .edit-form-container[data-depth="12"],
.coinwhy-wrapper .edit-form-container[data-depth="13"],
.coinwhy-wrapper .edit-form-container[data-depth="14"],
.coinwhy-wrapper .edit-form-container[data-depth="15"],
.coinwhy-wrapper .edit-form-container[data-depth="16"],
.coinwhy-wrapper .edit-form-container[data-depth="17"],
.coinwhy-wrapper .edit-form-container[data-depth="18"],
.coinwhy-wrapper .edit-form-container[data-depth="19"],
.coinwhy-wrapper .edit-form-container[data-depth="20"] {
  margin-left: 150px;
}
.coinwhy-wrapper .comment-card.no-indent,
.coinwhy-wrapper .edit-form-container.no-indent {
  margin-left: 0 !important;
}
.coinwhy-wrapper .comment-card.no-indent.card_link,
.coinwhy-wrapper .edit-form-container.no-indent.card_link {
  cursor: pointer;
}
.coinwhy-wrapper .edit-form-container .comment-form-container {
  margin-bottom: 0;
  padding-bottom: 12px;
  position: relative;
}
.coinwhy-wrapper .edit-form-container .comment-form-container::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 30px;
  right: 0;
  height: 1px;
  background-color: var(--c-border);
}
.coinwhy-wrapper .edit-form-container:last-child .comment-form-container::before {
  display: none;
}
.coinwhy-wrapper .reply-form-container .comment-form-container {
  margin-top: 0;
  padding-bottom: 12px;
}
.coinwhy-wrapper .reply-form-container[data-depth="1"], .coinwhy-wrapper .reply-form-container[data-depth="2"], .coinwhy-wrapper .reply-form-container[data-depth="3"], .coinwhy-wrapper .reply-form-container[data-depth="4"], .coinwhy-wrapper .reply-form-container[data-depth="5"], .coinwhy-wrapper .reply-form-container[data-depth="6"], .coinwhy-wrapper .reply-form-container[data-depth="7"], .coinwhy-wrapper .reply-form-container[data-depth="8"], .coinwhy-wrapper .reply-form-container[data-depth="9"], .coinwhy-wrapper .reply-form-container[data-depth="10"], .coinwhy-wrapper .reply-form-container[data-depth="11"], .coinwhy-wrapper .reply-form-container[data-depth="12"], .coinwhy-wrapper .reply-form-container[data-depth="13"], .coinwhy-wrapper .reply-form-container[data-depth="14"], .coinwhy-wrapper .reply-form-container[data-depth="15"], .coinwhy-wrapper .reply-form-container[data-depth="16"], .coinwhy-wrapper .reply-form-container[data-depth="17"], .coinwhy-wrapper .reply-form-container[data-depth="18"], .coinwhy-wrapper .reply-form-container[data-depth="19"], .coinwhy-wrapper .reply-form-container[data-depth="20"] {
  margin-left: 30px;
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .comment-card[data-depth="1"],
  .coinwhy-wrapper .edit-form-container[data-depth="1"] {
    margin-left: 15px;
  }
  .coinwhy-wrapper .comment-card[data-depth="2"],
  .coinwhy-wrapper .edit-form-container[data-depth="2"] {
    margin-left: 30px;
  }
  .coinwhy-wrapper .comment-card[data-depth="3"], .coinwhy-wrapper .comment-card[data-depth="4"], .coinwhy-wrapper .comment-card[data-depth="5"], .coinwhy-wrapper .comment-card[data-depth="6"], .coinwhy-wrapper .comment-card[data-depth="7"], .coinwhy-wrapper .comment-card[data-depth="8"], .coinwhy-wrapper .comment-card[data-depth="9"], .coinwhy-wrapper .comment-card[data-depth="10"], .coinwhy-wrapper .comment-card[data-depth="11"], .coinwhy-wrapper .comment-card[data-depth="12"], .coinwhy-wrapper .comment-card[data-depth="13"], .coinwhy-wrapper .comment-card[data-depth="14"], .coinwhy-wrapper .comment-card[data-depth="15"], .coinwhy-wrapper .comment-card[data-depth="16"], .coinwhy-wrapper .comment-card[data-depth="17"], .coinwhy-wrapper .comment-card[data-depth="18"], .coinwhy-wrapper .comment-card[data-depth="19"], .coinwhy-wrapper .comment-card[data-depth="20"],
  .coinwhy-wrapper .edit-form-container[data-depth="3"],
  .coinwhy-wrapper .edit-form-container[data-depth="4"],
  .coinwhy-wrapper .edit-form-container[data-depth="5"],
  .coinwhy-wrapper .edit-form-container[data-depth="6"],
  .coinwhy-wrapper .edit-form-container[data-depth="7"],
  .coinwhy-wrapper .edit-form-container[data-depth="8"],
  .coinwhy-wrapper .edit-form-container[data-depth="9"],
  .coinwhy-wrapper .edit-form-container[data-depth="10"],
  .coinwhy-wrapper .edit-form-container[data-depth="11"],
  .coinwhy-wrapper .edit-form-container[data-depth="12"],
  .coinwhy-wrapper .edit-form-container[data-depth="13"],
  .coinwhy-wrapper .edit-form-container[data-depth="14"],
  .coinwhy-wrapper .edit-form-container[data-depth="15"],
  .coinwhy-wrapper .edit-form-container[data-depth="16"],
  .coinwhy-wrapper .edit-form-container[data-depth="17"],
  .coinwhy-wrapper .edit-form-container[data-depth="18"],
  .coinwhy-wrapper .edit-form-container[data-depth="19"],
  .coinwhy-wrapper .edit-form-container[data-depth="20"] {
    margin-left: 45px;
  }
  .coinwhy-wrapper .comment-card.no-indent,
  .coinwhy-wrapper .edit-form-container.no-indent {
    margin-left: 0 !important;
  }
  .coinwhy-wrapper .reply-form-container[data-depth="1"] {
    margin-left: 15px;
  }
  .coinwhy-wrapper .reply-form-container[data-depth="2"] {
    margin-left: 30px;
  }
  .coinwhy-wrapper .reply-form-container[data-depth="3"], .coinwhy-wrapper .reply-form-container[data-depth="4"], .coinwhy-wrapper .reply-form-container[data-depth="5"], .coinwhy-wrapper .reply-form-container[data-depth="6"], .coinwhy-wrapper .reply-form-container[data-depth="7"], .coinwhy-wrapper .reply-form-container[data-depth="8"], .coinwhy-wrapper .reply-form-container[data-depth="9"], .coinwhy-wrapper .reply-form-container[data-depth="10"], .coinwhy-wrapper .reply-form-container[data-depth="11"], .coinwhy-wrapper .reply-form-container[data-depth="12"], .coinwhy-wrapper .reply-form-container[data-depth="13"], .coinwhy-wrapper .reply-form-container[data-depth="14"], .coinwhy-wrapper .reply-form-container[data-depth="15"], .coinwhy-wrapper .reply-form-container[data-depth="16"], .coinwhy-wrapper .reply-form-container[data-depth="17"], .coinwhy-wrapper .reply-form-container[data-depth="18"], .coinwhy-wrapper .reply-form-container[data-depth="19"], .coinwhy-wrapper .reply-form-container[data-depth="20"] {
    margin-left: 45px;
  }
}
.coinwhy-wrapper .comment-card {
  background: var(--c-surface);
  margin-bottom: 0;
  position: relative;
}
.coinwhy-wrapper .comment-card .comment-card-link {
  display: contents;
  color: inherit;
  text-decoration: none;
}
.coinwhy-wrapper .comment-card::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 30px;
  right: 0;
  height: 1px;
  background-color: var(--c-border);
}
.coinwhy-wrapper .comment-card:last-child::before {
  display: none;
}
.coinwhy-wrapper .comment-card.highlight {
  position: relative;
  z-index: 0;
}
.coinwhy-wrapper .comment-card.highlight::after {
  content: "";
  position: absolute;
  top: 0;
  left: -12px;
  width: calc(100% + 24px);
  height: 100%;
  background-color: rgba(var(--c-primary-rgb), 0.2);
  z-index: -1;
  border-radius: 6px;
}
.coinwhy-wrapper .comment-card .comment-content {
  padding: 16px 0;
  padding-bottom: 12px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 12px;
  align-items: flex-start;
}
.coinwhy-wrapper .comment-card .comment-profile {
  flex-shrink: 0;
}
.coinwhy-wrapper .comment-card .comment-profile img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .comment-card .comment-body {
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5px;
  padding-right: 32px;
  position: relative;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-author-info {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-author-info .author-name {
  font-weight: 600;
  color: var(--c-text);
  font-size: 0.9rem;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-author-info .time-separator {
  color: var(--c-text-muted);
  font-size: 0.8rem;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-author-info .comment-time {
  color: var(--c-text-muted);
  font-size: 0.8rem;
  flex-shrink: 0;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-author-info .author-badge {
  background: var(--c-hover);
  color: var(--c-primary);
  font-size: 0.8rem;
  font-weight: 500;
  padding: 1px 5px;
  border-radius: 6px;
  flex-shrink: 0;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-author-info .secret-badge {
  color: var(--c-danger);
  font-size: 0.75rem;
  margin-left: 4px;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  position: absolute;
  right: 0;
  top: 0;
  background: transparent;
  border: none;
  border-radius: 50%;
  color: var(--c-text-muted);
  cursor: pointer;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu-btn:hover {
  background: var(--c-hover);
  color: var(--c-text);
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu-btn i {
  font-size: 1rem;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu {
  position: absolute;
  top: 40px;
  right: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  box-shadow: 0 4px 12px var(--c-overlay-15);
  padding: 8px 0;
  min-width: 100px;
  z-index: 100;
  display: none;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu .menu-item {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 0;
  color: var(--c-text);
  text-decoration: none;
  font-size: 0.9rem;
  border: none;
  background: none;
  text-align: left;
  cursor: pointer;
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu .menu-item:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu .menu-item i {
  width: 16px;
  font-size: 0.85rem;
}
.coinwhy-wrapper .comment-card .comment-body .comment-text {
  color: var(--c-text);
  font-size: 0.9rem;
  line-height: 1.5;
  margin-bottom: 5px;
  word-break: break-word;
}
.coinwhy-wrapper .comment-card .comment-body .comment-text .reply-mention {
  font-weight: 600;
  color: var(--c-primary);
  margin-right: 1px;
}
.coinwhy-wrapper .comment-card .comment-body .comment-text.secret-text {
  color: var(--c-text-muted);
  font-style: italic;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  align-items: center;
  gap: 6px;
}
.coinwhy-wrapper .comment-card .comment-body .comment-text img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  margin: 8px 0;
}
.coinwhy-wrapper .comment-card .comment-body .comment-text a,
.coinwhy-wrapper .comment-card .comment-body .comment-text a:visited {
  color: var(--c-primary);
  text-decoration: underline;
}
.coinwhy-wrapper .comment-card .comment-body .comment-text a:hover,
.coinwhy-wrapper .comment-card .comment-body .comment-text a:focus {
  color: var(--c-primary-600);
  text-decoration: underline;
}
.coinwhy-wrapper .comment-card .comment-body .comment-image {
  margin: 5px 0;
  display: inline-block;
  max-width: 300px;
  width: 100%;
}
.coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--c-border);
  cursor: pointer;
  width: 100%;
  max-width: 100%;
  aspect-ratio: 1/1;
}
.coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper:hover {
  transform: scale(1.02);
}
.coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper .image-badge {
  position: absolute;
  left: 8px;
  bottom: 8px;
  padding: 2px 6px;
  font-size: 0.7rem;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.55);
  color: var(--c-text-inverse);
}
.coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper .image-info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, var(--c-overlay-70));
  color: var(--c-text-inverse);
  padding: 8px;
  font-size: 0.75rem;
  opacity: 0;
}
.coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper .image-info .image-size,
.coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper .image-info .file-size {
  display: block;
  margin-bottom: 2px;
}
.coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper .image-info .file-size {
  font-size: 0.7rem;
  opacity: 0.8;
}
.coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper:hover .image-info {
  opacity: 1;
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
  align-items: center;
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar .action-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  background: transparent;
  border: none;
  color: var(--c-text-muted);
  font-size: 0.8rem;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar .action-btn.reply-btn {
  gap: 6px;
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar .action-btn:hover {
  background: var(--c-hover);
  color: var(--c-primary);
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar .action-btn i {
  font-size: 0.9rem;
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar .action-btn.comment-like-btn .like-count {
  font-size: 0.8rem;
  margin-left: 2px;
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar .action-btn.comment-like-btn.liked {
  color: var(--c-danger);
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar .action-btn.comment-like-btn.liked i::before {
  content: "\f004";
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar .action-btn.reply-btn:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .comment-card .comment-body .comment-footer .comment-actions-bar .action-btn.comment-share-btn:hover {
  color: var(--c-primary);
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .comment-card .comment-content {
    padding: 12px 0;
    padding-bottom: 8px;
    gap: 10px;
  }
  .coinwhy-wrapper .comment-card .comment-profile img {
    width: 28px;
    height: 28px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header {
    padding-right: 25px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-author-info {
    gap: 6px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-author-info .author-name {
    font-size: 0.85rem;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-author-info .comment-time {
    font-size: 0.75rem;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu-btn {
    width: 27px;
    height: 27px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu {
    min-width: 80px;
    top: 30px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu .menu-item {
    gap: 4px;
    padding: 6px 0;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-image {
    max-width: 250px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-image .image-wrapper img {
    max-width: 100%;
  }
  .coinwhy-wrapper .comment-image-modal .modal-content {
    max-width: 95%;
    max-height: 85%;
  }
  .coinwhy-wrapper .comment-image-modal .modal-content .modal-close {
    top: -35px;
    width: 30px;
    height: 30px;
  }
}
@media screen and (max-width: 1024px) {
  .coinwhy-wrapper .comment-card .comment-body .comment-header {
    padding-right: 30px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu-btn {
    width: 27px;
    height: 27px;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .comment-card .comment-body .comment-header {
    padding-right: 25px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu-btn {
    width: 22px;
    height: 22px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu {
    min-width: 80px;
    top: 30px;
  }
  .coinwhy-wrapper .comment-card .comment-body .comment-header .comment-actions .comment-menu .menu-item {
    gap: 4px;
    padding: 6px 0;
  }
}
@keyframes highlightPulse {
  0% {
    background-color: rgba(255, 193, 7, 0.3);
    transform: scale(1);
  }
  50% {
    background-color: rgba(255, 193, 7, 0.15);
    transform: scale(1.005);
  }
  100% {
    background-color: rgba(255, 193, 7, 0.1);
    transform: scale(1);
  }
}

.comment-image-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100dvh;
  background: var(--c-overlay-85);
  z-index: 3000;
  display: flex;
  justify-content: center;
  align-items: center;
  touch-action: none;
}
.comment-image-modal img {
  max-width: calc(100vw - 40px);
  max-height: calc(100dvh - 200px);
  object-fit: contain;
  border-radius: 8px;
}
.comment-image-modal .modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 36px;
  height: 36px;
  background: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
.comment-image-modal .modal-close svg {
  color: var(--c-text-inverse);
}

@media screen and (max-width: 640px) {
  .comment-image-modal .modal-close {
    right: 8px;
    width: 32px;
    height: 32px;
  }
}
html.image-modal-open {
  overflow: hidden;
}

.coinwhy-wrapper .trading-chart {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 14px 16px;
}
.coinwhy-wrapper .trading-chart .chart-header {
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
  gap: 10px;
}
.coinwhy-wrapper .trading-chart .chart-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 10px;
}
.coinwhy-wrapper .trading-chart .chart-title .chart-title-left {
  display: flex;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .chart-title h2 {
  color: var(--c-text);
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
}
.coinwhy-wrapper .trading-chart .chart-title .guide-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  color: var(--c-primary);
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.coinwhy-wrapper .trading-chart .chart-title .guide-btn img {
  display: block;
  flex-shrink: 0;
}
.coinwhy-wrapper .trading-chart .chart-title .guide-btn:hover {
  background: var(--c-hover);
  border-color: var(--c-primary);
  color: var(--c-primary);
}
.coinwhy-wrapper .trading-chart .live-indicator {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
  margin-left: 2px;
  flex-shrink: 0;
}
.coinwhy-wrapper .trading-chart .live-dot {
  position: relative;
  width: 10px;
  height: 10px;
  background-color: rgb(248, 81, 73);
  box-shadow: rgba(248, 81, 73, 0.4) 0px 0px 10px;
  border-radius: 50%;
  z-index: 1;
}
.coinwhy-wrapper .trading-chart .live-dot::before, .coinwhy-wrapper .trading-chart .live-dot::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: rgb(248, 81, 73);
}
.coinwhy-wrapper .trading-chart .live-dot::before {
  animation: live-pulse-1 2s ease infinite;
}
.coinwhy-wrapper .trading-chart .live-dot::after {
  animation: live-pulse-2 2s ease infinite;
}
@keyframes live-pulse-1 {
  0% {
    transform: scale(1);
    opacity: 0.8;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}
@keyframes live-pulse-2 {
  0% {
    transform: scale(1);
    opacity: 0.6;
  }
  100% {
    transform: scale(2);
    opacity: 0;
  }
}
.coinwhy-wrapper .trading-chart .chart-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector {
  position: relative;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  padding-right: 50px;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.8rem;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-btn:hover {
  border-color: var(--c-border);
  background: var(--c-hover);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-btn.active {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-btn.active .coin-name {
  opacity: 0.8;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  filter: grayscale(0.2);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-btn.disabled:hover {
  background: var(--c-surface);
  border-color: var(--c-border);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap {
  position: relative;
  display: inline-block;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap .coin-more-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 31px;
  height: 31px;
  box-sizing: border-box;
  border-radius: 6px;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
  cursor: pointer;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap .coin-more-btn:hover {
  border-color: var(--c-border);
  background: var(--c-hover);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap .coin-more-btn svg {
  display: block;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap .coin-more-btn.active {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap .coin-more-btn.active svg {
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap .coin-more-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  filter: grayscale(0.2);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap .coin-more-btn.disabled:hover {
  background: var(--c-surface);
  border-color: var(--c-border);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap .coin-more-btn.disabled svg {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover {
  position: absolute;
  z-index: 10;
  top: calc(100% + 8px);
  left: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  box-shadow: 0 8px 20px var(--c-overlay-12);
  padding: 12px;
  width: 400px;
  max-height: 60vh;
  overflow: auto;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover .coin-search {
  margin-bottom: 10px;
  position: sticky;
  top: 0;
  z-index: 1;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover .coin-search input {
  width: 100%;
  height: 36px;
  background: var(--c-hover);
  color: var(--c-text);
  border-radius: 8px;
  border: 1px solid var(--c-border);
  padding: 0 10px;
  font-size: 0.9rem;
  outline: none;
  caret-color: var(--c-primary);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover .coin-search input:focus {
  outline: none;
  background: var(--c-hover);
  border-color: var(--c-primary);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover .coin-search input::placeholder {
  color: var(--c-text-muted);
  opacity: 0.9;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover .coin-popover-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: linear-gradient(rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 8px, var(--c-surface) 8px);
  padding-top: 0;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover .coin-section-title {
  font-size: 12px;
  color: var(--c-text-muted);
  margin-bottom: 6px;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover .coin-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: flex-start;
  justify-content: flex-start;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover .coin-select-item.active {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-icon {
  width: 15px;
  height: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-icon img {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-fallback {
  font-size: 0.8rem;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-symbol {
  font-weight: 600;
  font-size: 0.8rem;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-name {
  font-size: 0.8rem;
  opacity: 0.7;
}
.coinwhy-wrapper .trading-chart .chart-controls .coin-selector .no-coins {
  color: var(--c-text-muted);
  font-size: 0.875rem;
  padding: 10px;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .coin-alert-settings-control {
  display: flex;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .coin-alert-settings-control .coin-alert-settings-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .coin-alert-settings-control .coin-alert-settings-btn:hover {
  border-color: var(--c-border);
  background: var(--c-hover);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .coin-alert-settings-control .coin-alert-settings-btn .coin-alert-settings-icon {
  display: inline-flex;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .coin-alert-settings-control .coin-alert-settings-btn .coin-alert-settings-icon svg {
  display: block;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .coin-alert-settings-control .coin-alert-settings-btn .coin-alert-settings-label {
  white-space: nowrap;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-control {
  display: flex;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-control .alert-subscribe-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-control .alert-subscribe-btn:hover {
  border-color: var(--c-border);
  background: var(--c-hover);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-control .alert-subscribe-btn.alert-subscribe-btn--on {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-control .alert-subscribe-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-control .alert-subscribe-btn.disabled:hover {
  background: var(--c-surface);
  border-color: var(--c-border);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-control .alert-subscribe-btn .alert-subscribe-icon {
  display: inline-flex;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-control .alert-subscribe-btn .alert-subscribe-icon svg {
  display: block;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-control .alert-subscribe-btn .alert-subscribe-label {
  white-space: nowrap;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector {
  position: relative;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-dropdown-toggle {
  display: none;
  position: relative;
  overflow: visible;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-dropdown-toggle::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1;
  color: inherit;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  text-shadow: 0 0 2px var(--c-surface), 0 0 4px var(--c-surface);
  transition: opacity 0.16s ease-out, transform 0.16s ease-out;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-dropdown-toggle.interval-btn--long-pulse {
  box-shadow: 0 0 3px var(--c-long);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-dropdown-toggle.interval-btn--long-pulse::before {
  content: attr(data-label-long);
  color: var(--c-long);
  opacity: 1;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-dropdown-toggle.interval-btn--short-pulse {
  box-shadow: 0 0 3px var(--c-short);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-dropdown-toggle.interval-btn--short-pulse::before {
  content: attr(data-label-short);
  color: var(--c-short);
  opacity: 1;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn {
  position: relative;
  overflow: visible;
  background: var(--c-surface);
  color: var(--c-text);
  border: 1px solid var(--c-border);
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
  min-width: 40px;
  text-align: center;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1;
  color: inherit;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  text-shadow: 0 0 2px var(--c-surface), 0 0 4px var(--c-surface);
  transition: opacity 0.16s ease-out, transform 0.16s ease-out;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn.interval-btn--long-pulse {
  box-shadow: 0 0 3px var(--c-long);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn.interval-btn--long-pulse::before {
  content: attr(data-label-long);
  color: var(--c-long);
  opacity: 1;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn.interval-btn--short-pulse {
  box-shadow: 0 0 3px var(--c-short);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn.interval-btn--short-pulse::before {
  content: attr(data-label-short);
  color: var(--c-short);
  opacity: 1;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn:hover {
  border-color: var(--c-border);
  background: var(--c-hover);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn.active {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn.disabled:hover {
  background: var(--c-surface);
  border-color: var(--c-border);
}
.coinwhy-wrapper .trading-chart .chart-container {
  position: relative;
  background: var(--c-surface);
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid var(--c-border);
  height: 450px;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .trading-chart .chart-container {
    height: auto;
    aspect-ratio: 16/13;
  }
}
@media screen and (max-width: 480px) {
  .coinwhy-wrapper .trading-chart .chart-container {
    aspect-ratio: 16/16;
  }
}
.coinwhy-wrapper .trading-chart .chart-container .chart-unsupported-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(2px);
  border-radius: 8px;
  z-index: 12;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 16px;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-unsupported-overlay .unsupported-message {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 16px 24px;
  box-shadow: 0 4px 12px var(--c-overlay-12);
}
.coinwhy-wrapper .trading-chart .chart-container .chart-unsupported-overlay .unsupported-message p {
  margin: 0;
  color: var(--c-text);
  font-size: 0.95rem;
  font-weight: 500;
  text-align: center;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-connection-overlay {
  position: absolute;
  inset: 0;
  display: none;
  background: var(--c-bg-overlay-80, rgba(0, 0, 0, 0.55));
  backdrop-filter: blur(3px);
  border-radius: 8px;
  z-index: 11;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 16px;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-connection-overlay .connection-message {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 14px 20px 12px;
  box-shadow: 0 6px 18px var(--c-overlay-16);
  text-align: center;
  max-width: 320px;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-connection-overlay .connection-message .connection-title {
  margin: 0 0 6px;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .chart-container .chart-connection-overlay .connection-message .connection-subtitle {
  margin: 0;
  font-size: 0.85rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .trading-chart .chart-container .chart-login-overlay {
  position: absolute;
  inset: 0;
  display: none;
  background: var(--c-bg-overlay-80, rgba(0, 0, 0, 0.55));
  backdrop-filter: blur(3px);
  border-radius: 8px;
  z-index: 12;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 16px;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-login-overlay .login-message {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 16px 22px 14px;
  box-shadow: 0 6px 18px var(--c-overlay-16);
  max-width: 360px;
  text-align: center;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-login-overlay .login-message .login-title {
  margin: 0 0 6px;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .chart-container .chart-login-overlay .login-message .login-subtitle {
  margin: 0 0 14px;
  font-size: 0.85rem;
  color: var(--c-text-muted);
  white-space: pre-line;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-login-overlay .login-message .login-actions {
  display: flex;
  justify-content: center;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-login-overlay .login-message .login-actions .login-primary-btn {
  min-width: 0;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  background: transparent;
  color: var(--c-text);
  transition: background 0.16s ease-out, border-color 0.16s ease-out, color 0.16s ease-out;
  border-color: var(--c-primary);
  background: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-chart .chart-container .chart-login-overlay .login-message .login-actions .login-primary-btn:hover {
  background: var(--c-primary-600);
  border-color: var(--c-primary-600);
}
.coinwhy-wrapper .trading-chart .chart-container.chart-connection-lost .trading-chart-canvas {
  filter: grayscale(0.3);
  opacity: 0.4;
  transition: opacity 0.2s ease-out, filter 0.2s ease-out;
}
.coinwhy-wrapper .trading-chart .chart-container.chart-connection-lost #signalBubblesLayer,
.coinwhy-wrapper .trading-chart .chart-container.chart-connection-lost .signal-bubbles-layer {
  opacity: 0.6;
}
.coinwhy-wrapper .trading-chart .chart-container.chart-login-locked .trading-chart-canvas {
  filter: grayscale(0.3);
  opacity: 0.4;
  transition: opacity 0.2s ease-out, filter 0.2s ease-out;
}
.coinwhy-wrapper .trading-chart .chart-container.chart-login-locked #signalBubblesLayer,
.coinwhy-wrapper .trading-chart .chart-container.chart-login-locked .signal-bubbles-layer {
  opacity: 0.6;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-watermark {
  position: absolute;
  z-index: 1;
  pointer-events: none;
  opacity: 0.3;
  transition: opacity 0.2s ease-out;
}
.coinwhy-wrapper .trading-chart .chart-container .chart-watermark img {
  display: block;
  max-width: 120px;
  max-height: 40px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(0.3);
}
.coinwhy-wrapper .trading-chart .chart-footer {
  margin-top: 10px;
  color: var(--c-text);
  font-size: 0.82rem;
  height: 45px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .chart-footer.is-empty .chart-footer-inner {
  justify-content: center;
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 3px;
  min-height: 22px;
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 6px 10px;
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-empty {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 2px;
  border-radius: 4px;
  border: none;
  background: transparent;
  white-space: nowrap;
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-item .chart-footer-item-label {
  font-weight: 600;
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-item .chart-footer-item-value {
  font-variant-numeric: tabular-nums;
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-item .chart-footer-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: currentColor;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.25);
  flex-shrink: 0;
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-item--entry {
  color: var(--c-primary);
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-item--sl {
  color: var(--c-danger);
}
.coinwhy-wrapper .trading-chart .chart-footer .chart-footer-item--tp {
  color: var(--c-long);
}
.coinwhy-wrapper .trading-chart .chart-instrument-overlay {
  position: absolute;
  top: 4px;
  left: 4px;
  z-index: 1;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 6px;
  color: var(--c-text);
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  pointer-events: none;
  box-shadow: 0 1px 2px var(--c-overlay-05);
  max-width: calc(100% - 8px - 100px);
  opacity: 0.8;
}
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .instrument-icon {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .instrument-icon img {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .instrument-icon .fallback {
  font-size: 16px;
  line-height: 1;
}
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .instrument-info {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: nowrap;
  min-width: 0;
  flex: 1 1 auto;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .instrument-info .sep {
  opacity: 0.6;
  font-weight: 500;
}
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .instrument-info #chartInstrumentName,
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .instrument-info #chartInstrumentSymbol,
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .instrument-info #chartInstrumentInterval,
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .instrument-info .instrument-exchange {
  white-space: nowrap;
}
.coinwhy-wrapper .trading-chart .chart-instrument-overlay .is-hidden {
  display: none;
}
.coinwhy-wrapper .trading-chart .signal-bubbles-layer {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}
.coinwhy-wrapper .trading-chart .peak-badge {
  position: absolute;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
  background: transparent;
  box-shadow: none;
  color: var(--c-text);
  will-change: transform, opacity;
}
.coinwhy-wrapper .trading-chart .peak-badge .pk-emoji,
.coinwhy-wrapper .trading-chart .peak-badge .pk-text {
  line-height: 1;
}
.coinwhy-wrapper .trading-chart .peak-badge.long {
  color: var(--c-long);
}
.coinwhy-wrapper .trading-chart .peak-badge.short {
  color: var(--c-danger);
}
.coinwhy-wrapper .trading-chart .signal-bubble {
  position: absolute;
  transform: translate(-50%, calc(-100% - 15px));
  background: var(--c-short);
  color: var(--c-on-primary);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  padding: 6px 8px;
  border-radius: 6px;
  white-space: nowrap;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}
.coinwhy-wrapper .trading-chart .signal-bubble::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -4px;
  transform: translateX(-50%);
  border-width: 6px 6px 0 6px;
  border-style: solid;
  border-color: var(--c-short) transparent transparent transparent;
}
.coinwhy-wrapper .trading-chart .signal-bubble.long {
  background: var(--c-long);
  transform: translate(-50%, 15px);
}
.coinwhy-wrapper .trading-chart .signal-bubble.long::after {
  bottom: auto;
  top: -4px;
  border-width: 0 6px 6px 6px;
  border-color: transparent transparent var(--c-long) transparent;
}
.coinwhy-wrapper .trading-chart .signal-bubble.short {
  background: var(--c-short);
}
.coinwhy-wrapper .trading-chart .tp-stack {
  position: absolute;
  transform: translate(-50%, calc(-100% - 10px));
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;
  z-index: 2;
}
.coinwhy-wrapper .trading-chart .tp-stack.short {
  transform: translate(-50%, 10px);
}
.coinwhy-wrapper .trading-chart .tp-bubble {
  position: relative;
  transform: none;
  background: transparent;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  padding: 0;
  border-radius: 0;
  white-space: nowrap;
  box-shadow: none;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .tp-bubble::after {
  display: none;
}
.coinwhy-wrapper .trading-chart .tp-bubble.long .tp-label {
  color: var(--c-long);
}
.coinwhy-wrapper .trading-chart .tp-bubble.short .tp-label {
  color: var(--c-danger);
  margin-top: 2px;
}
.coinwhy-wrapper .trading-chart .tp-bubble .tp-emoji {
  font-size: 14px;
  line-height: 1;
}
.coinwhy-wrapper .trading-chart .trading-chart-canvas {
  min-height: 1px;
}
.coinwhy-wrapper .trading-chart .chart-loading {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--c-bg-overlay-90);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  color: var(--c-text);
  z-index: 10;
}
.coinwhy-wrapper .trading-chart .loading-spinner {
  width: 40px;
  height: 40px;
  border: 3px solid var(--c-border);
  border-top: 3px solid var(--c-primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 15px;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.coinwhy-wrapper .trading-chart .chart-error {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--c-bg-overlay-95);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  color: var(--c-text);
  z-index: 10;
}
.coinwhy-wrapper .trading-chart .chart-error button {
  background: var(--c-primary);
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 6px;
  cursor: pointer;
  margin-top: 10px;
  font-weight: 500;
}
.coinwhy-wrapper .trading-chart .chart-error button:hover {
  background: var(--c-primary-600);
}
.coinwhy-wrapper .trading-chart .chart-error .chart-error-detail {
  margin-top: 6px;
  font-size: 0.9rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal {
  position: fixed;
  inset: 0;
  z-index: 2200;
  display: none;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal.is-open {
  display: block;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-backdrop {
  position: absolute;
  inset: 0;
  background: var(--c-bg-overlay-80, rgba(0, 0, 0, 0.6));
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-dialog {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(380px, 100% - 32px);
  max-height: 460px;
  padding: 18px 20px 16px;
  border-radius: 12px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  box-shadow: 0 14px 40px var(--c-overlay-18);
  color: var(--c-text);
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-header h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-header .coin-alert-settings-close-icon-btn {
  border: 0;
  background: transparent;
  padding: 2px;
  cursor: pointer;
  color: var(--c-text-muted);
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-header .coin-alert-settings-close-icon-btn svg {
  width: 24px;
  height: 24px;
  display: block;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-header .coin-alert-settings-close-icon-btn:hover {
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body {
  flex: 1 1 auto;
  min-height: 0;
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--c-text-muted);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-body-sub {
  font-size: 0.8rem;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
  padding-right: 6px;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 8px;
  border-radius: 8px;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-row-main {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-coin-icon {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-coin-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  display: block;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-coin-icon .coin-alert-settings-coin-fallback {
  font-size: 0.8rem;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-coin-symbol {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--c-text);
  white-space: nowrap;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-interval {
  font-size: 0.78rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-body .coin-alert-settings-empty {
  font-size: 0.85rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-actions {
  margin-top: 8px;
  display: flex;
  justify-content: flex-end;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-close-btn {
  min-width: 0;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .coin-alert-settings-close-btn:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .cw-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .cw-switch__input {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .cw-switch__track {
  position: relative;
  width: 36px;
  height: 20px;
  border-radius: 999px;
  box-sizing: border-box;
  background: var(--c-border);
  border: 1px solid var(--c-border);
  display: inline-flex;
  align-items: center;
  padding: 0 2px;
  transition: background-color 0.18s ease-out, border-color 0.18s ease-out;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .cw-switch__thumb {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.35);
  transform: translateX(0);
  transition: transform 0.18s ease-out;
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .cw-switch__input:checked + .cw-switch__track {
  background: var(--c-primary);
  border-color: var(--c-primary);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .cw-switch__input:checked + .cw-switch__track .cw-switch__thumb {
  transform: translateX(16px);
}
.coinwhy-wrapper .trading-chart .coin-alert-settings-modal .cw-switch__input:disabled + .cw-switch__track {
  opacity: 0.5;
  cursor: not-allowed;
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal {
  position: fixed;
  inset: 0;
  z-index: 2200;
  display: none;
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal.is-open {
  display: block;
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .telegram-alert-guide-backdrop {
  position: absolute;
  inset: 0;
  background: var(--c-bg-overlay-80, rgba(0, 0, 0, 0.6));
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .telegram-alert-guide-dialog {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 360px;
  padding: 18px 20px 16px;
  border-radius: 12px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  box-shadow: 0 14px 40px var(--c-overlay-18);
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .telegram-alert-guide-header {
  margin-bottom: 8px;
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .telegram-alert-guide-header h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .telegram-alert-guide-body {
  margin-bottom: 14px;
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .telegram-alert-guide-body p {
  margin: 0 0 4px;
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .telegram-alert-guide-body p:last-child {
  margin-bottom: 0;
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .telegram-alert-guide-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .tg-guide-btn {
  min-width: 0;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  background: transparent;
  color: var(--c-text);
  transition: background 0.16s ease-out, border-color 0.16s ease-out, color 0.16s ease-out;
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .tg-guide-btn.tg-guide-btn-secondary {
  border-color: var(--c-border);
  background: var(--c-surface);
  color: var(--c-text-muted);
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .tg-guide-btn.tg-guide-btn-secondary:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .tg-guide-btn.tg-guide-btn-primary {
  border-color: var(--c-primary);
  background: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .tg-guide-btn.tg-guide-btn-primary:hover {
  background: var(--c-primary-600);
  border-color: var(--c-primary-600);
}
@media screen and (max-width: 480px) {
  .coinwhy-wrapper .trading-chart .telegram-alert-guide-modal .telegram-alert-guide-dialog {
    max-width: calc(100% - 32px);
    padding: 16px 16px 14px;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .trading-chart {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    border-top: none;
  }
  .coinwhy-wrapper .trading-chart .chart-header {
    flex-direction: column;
    align-items: stretch;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector {
    justify-content: flex-start;
    gap: 4px;
    padding-right: 0;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover {
    max-width: 100%;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-list-popover .coin-list {
    gap: 4px;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-btn {
    min-width: auto;
    padding: 6px 9px;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-icon {
    width: 13px;
    height: 13px;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-icon img {
    width: 13px;
    height: 13px;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls {
    justify-content: flex-start;
    gap: 4px;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn {
    padding: 6px 8px;
    min-width: auto;
  }
  .coinwhy-wrapper .trading-chart .chart-instrument-overlay {
    padding: 2px 4px;
    font-size: 12px;
    border-radius: 4px;
    gap: 4px;
    max-width: calc(100% - 4px - 80px);
  }
  .coinwhy-wrapper .trading-chart .chart-footer {
    height: 60px;
  }
  .coinwhy-wrapper .trading-chart .chart-footer .chart-footer-inner {
    gap: 3px;
    font-size: 0.78rem;
  }
  .coinwhy-wrapper .trading-chart .chart-footer .chart-footer-row {
    gap: 4px 6px;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .trading-chart .chart-title .guide-btn {
    padding: 5px 10px;
    font-size: 0.8rem;
    gap: 4px;
  }
  .coinwhy-wrapper .trading-chart .chart-title .guide-btn img {
    width: 14px;
    height: 14px;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-more-wrap .coin-more-btn {
    width: 30px;
    height: 30px;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector {
    position: relative;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-dropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 10px;
    background: var(--c-primary);
    border: 1px solid var(--c-primary);
    color: var(--c-on-primary);
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 600;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-dropdown-toggle .interval-chevron {
    transition: transform 0.2s ease;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-dropdown-toggle[aria-expanded=true] .interval-chevron {
    transform: rotate(180deg);
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: 8px;
    box-shadow: 0 4px 12px var(--c-overlay-12);
    padding: 8px;
    flex-direction: column;
    gap: 8px;
    z-index: 13;
    max-height: 300px;
    overflow-y: auto;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper.open {
    display: flex;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .interval-selector .interval-buttons-wrapper .interval-btn {
    width: 100%;
    justify-content: center;
  }
  .coinwhy-wrapper .trading-chart .chart-container .chart-watermark img {
    max-width: 100px;
    max-height: 30px;
  }
}
@media screen and (max-width: 480px) {
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-btn {
    text-align: center;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector .coin-name {
    display: none;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .coin-selector > .coin-btn {
    min-height: 30px;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .coin-alert-settings-btn .coin-alert-settings-label {
    display: none;
  }
  .coinwhy-wrapper .trading-chart .chart-controls .interval-controls .alert-subscribe-btn .alert-subscribe-label {
    display: none;
  }
  .coinwhy-wrapper .trading-chart #chartInstrumentInterval,
  .coinwhy-wrapper .trading-chart .instrument-exchange {
    display: none;
  }
  .coinwhy-wrapper .trading-chart .instrument-info .sep {
    display: none;
  }
  .coinwhy-wrapper .trading-chart .instrument-info #chartInstrumentName + .sep {
    display: inline;
  }
  .coinwhy-wrapper .trading-chart .chart-footer {
    height: 75px;
  }
}

.coinwhy-wrapper .coin-metrics .cw-metric-list {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  overflow-y: visible;
  white-space: nowrap;
  padding-bottom: 1px;
  -ms-overflow-style: none;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  cursor: grab;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list::-webkit-scrollbar {
  display: none;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list.dragging {
  cursor: grabbing;
  user-select: none;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card {
  flex: 0 0 220px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 10px 14px;
  color: var(--c-text);
  contain: content;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .top-row {
  display: flex;
  align-items: center;
  gap: 4px;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .top-row .icon {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .top-row .name {
  font-size: 0.9rem;
  font-weight: 600;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .bottom-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .bottom-row .price {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--c-text);
  transition: color 0.8s ease;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.5px;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .bottom-row .price.flash-up {
  color: var(--c-success);
  animation: cwFadeBase 3s forwards;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .bottom-row .price.flash-down {
  color: var(--c-danger);
  animation: cwFadeBase 3s forwards;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .bottom-row .pct {
  font-size: 0.9rem;
  color: var(--c-text-muted);
  font-variant-numeric: tabular-nums;
  display: inline-flex;
  align-items: center;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .bottom-row .pct .arr {
  display: inline-flex;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .bottom-row .pct.up {
  color: var(--c-success);
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .bottom-row .pct.down {
  color: var(--c-danger);
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .content-left .bottom-row .pct .pct-text {
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: -0.5px;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .chart-right {
  min-width: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .chart-right .spark {
  width: 100%;
  height: 44px;
}
.coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card .chart-right .line {
  stroke: var(--c-danger);
  stroke-width: 1.5;
  fill: none;
}
@keyframes cwFadeBase {
  to {
    color: var(--c-text);
  }
}
@media screen and (max-width: 1024px) {
  .coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card {
    flex: 0 0 210px;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .coin-metrics .cw-metric-list {
    padding: 0 10px;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .coin-metrics .cw-metric-list .cw-metric-card {
    flex: 0 0 190px;
  }
}

.coinwhy-wrapper .btc-dom-section .btc-dom-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 14px 16px;
  color: var(--c-text);
  display: flex;
  flex-direction: column;
  gap: 0;
  height: 100%;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .header {
  display: flex;
  align-items: center;
  gap: 3px;
  margin-bottom: 10px;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .header .title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .header .tip-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .header .tip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--c-text-muted);
  cursor: pointer;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  justify-content: center;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 10px;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item {
  display: grid;
  grid-template-rows: auto auto;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item.btc .label .dot {
  background: #f7931a;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item.btc .value .num {
  color: #f7931a;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item.eth .label .dot {
  background: #3b82f6;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item.eth .value .num {
  color: #3b82f6;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item.others .label .dot {
  background: #6b7280;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item .label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item .label .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item .label .name {
  font-size: 0.8rem;
  font-weight: 600;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .items .item .value .num {
  font-weight: 700;
  font-size: 1.2rem;
  letter-spacing: -0.5px;
  color: var(--c-text);
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .bar {
  position: relative;
  height: 8px;
  background: var(--c-muted);
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 8px;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .bar .seg {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 0;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .bar .btc {
  left: 0;
  background: #f7931a;
  z-index: 3;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .bar .eth {
  background: #3b82f6;
  z-index: 2;
}
.coinwhy-wrapper .btc-dom-section .btc-dom-card .body .bar .others {
  background: #6b7280;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .btc-dom-section .btc-dom-card {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
  }
}

.coinwhy-wrapper .altseason-section .altseason-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 14px 16px;
  color: var(--c-text);
  display: flex;
  flex-direction: column;
  height: 100%;
}
.coinwhy-wrapper .altseason-section .altseason-card .header {
  display: flex;
  align-items: center;
  gap: 3px;
  margin-bottom: 5px;
}
.coinwhy-wrapper .altseason-section .altseason-card .header .title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
}
.coinwhy-wrapper .altseason-section .altseason-card .header .tip-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.coinwhy-wrapper .altseason-section .altseason-card .header .tip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--c-text-muted);
  cursor: pointer;
}
.coinwhy-wrapper .altseason-section .altseason-card .body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  justify-content: center;
}
.coinwhy-wrapper .altseason-section .altseason-card .body .score {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 12px;
}
.coinwhy-wrapper .altseason-section .altseason-card .body .score .value {
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--c-text);
}
.coinwhy-wrapper .altseason-section .altseason-card .body .score .max {
  color: var(--c-text-muted);
  font-weight: 600;
}
.coinwhy-wrapper .altseason-section .altseason-card .body .scale {
  padding: 10px 0 8px;
}
.coinwhy-wrapper .altseason-section .altseason-card .body .scale .rail {
  position: relative;
  height: 6px;
  border-radius: 6px;
  background: linear-gradient(90deg, #f7931a 0%, #f7931a 25%, #f8b26a 25%, #f8b26a 50%, #93c5fd 50%, #93c5fd 75%, #3b82f6 75%, #3b82f6 100%);
}
.coinwhy-wrapper .altseason-section .altseason-card .body .scale .tick {
  position: absolute;
  top: -22px;
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .altseason-section .altseason-card .body .scale .tick.btc {
  left: 0;
}
.coinwhy-wrapper .altseason-section .altseason-card .body .scale .tick.alt {
  right: 0;
}
.coinwhy-wrapper .altseason-section .altseason-card .body .scale .thumb-svg {
  position: absolute;
  left: 0;
  right: 0;
  top: -4px;
  height: 14px;
  pointer-events: none;
  width: 100%;
  display: block;
}
.coinwhy-wrapper .altseason-section .altseason-card .body .scale .thumb-dot {
  position: absolute;
  top: -4px;
  height: 14px;
  width: 14px;
  pointer-events: none;
  left: 0;
}
.coinwhy-wrapper .altseason-section .altseason-card .body .scale .thumb-dot .thumb {
  fill: var(--c-surface);
  stroke: var(--c-text);
  stroke-width: 3px;
  vector-effect: non-scaling-stroke;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .altseason-section .altseason-card {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
  }
}

.coinwhy-wrapper .fng-section .fng-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 14px 16px;
  padding-bottom: 8px;
  color: var(--c-text);
  display: flex;
  flex-direction: column;
  height: 100%;
}
.coinwhy-wrapper .fng-section .fng-card .header {
  display: flex;
  align-items: center;
  gap: 3px;
}
.coinwhy-wrapper .fng-section .fng-card .header .title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
}
.coinwhy-wrapper .fng-section .fng-card .header .tip-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.coinwhy-wrapper .fng-section .fng-card .header .tip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--c-text-muted);
  cursor: pointer;
}
.coinwhy-wrapper .fng-section .fng-card .body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  justify-content: center;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge {
  position: relative;
  height: 85px;
  overflow: hidden;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .arc {
  display: block;
  width: 200px;
  height: 100%;
  margin: 0 auto;
  position: relative;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .arc .seg {
  fill: none;
  stroke-linecap: round;
  stroke-width: 10;
  stroke-dasharray: 16 84;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .arc .seg1 {
  stroke: #ef4444;
  stroke-dasharray: 16 84;
  stroke-dashoffset: 0;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .arc .seg2 {
  stroke: #f59e0b;
  stroke-dasharray: 16 84;
  stroke-dashoffset: -21;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .arc .seg3 {
  stroke: #facc15;
  stroke-dasharray: 16 84;
  stroke-dashoffset: -42;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .arc .seg4 {
  stroke: #84cc16;
  stroke-dasharray: 16 84;
  stroke-dashoffset: -63;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .arc .seg5 {
  stroke: #10b981;
  stroke-dasharray: 16 84;
  stroke-dashoffset: -84;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .arc .thumb {
  fill: var(--c-surface);
  stroke: var(--c-text);
  stroke-width: 3px;
  vector-effect: non-scaling-stroke;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .label {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 7px;
  text-align: center;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .label .value {
  display: block;
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1.5rem;
}
.coinwhy-wrapper .fng-section .fng-card .body .gauge .label .state {
  color: var(--c-text-muted);
  font-size: 0.8rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .fng-section .fng-card {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
  }
}

.coinwhy-wrapper .trading-performance {
  position: relative;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 20px;
}
.coinwhy-wrapper .trading-performance .performance-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  flex-wrap: nowrap;
}
.coinwhy-wrapper .trading-performance .performance-header.dropdown-open {
  overflow: visible;
}
.coinwhy-wrapper .trading-performance .performance-title {
  display: flex;
  align-items: center;
}
.coinwhy-wrapper .trading-performance .performance-title h2 {
  color: var(--c-text);
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
}
.coinwhy-wrapper .trading-performance .performance-title h2 .period-label {
  color: var(--c-text-muted);
  font-size: 0.9rem;
  font-weight: 500;
}
.coinwhy-wrapper .trading-performance .live-indicator {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
  margin-left: 2px;
  flex-shrink: 0;
}
.coinwhy-wrapper .trading-performance .live-dot {
  position: relative;
  width: 10px;
  height: 10px;
  background-color: rgb(248, 81, 73);
  box-shadow: rgba(248, 81, 73, 0.4) 0px 0px 10px;
  border-radius: 50%;
  z-index: 1;
}
.coinwhy-wrapper .trading-performance .live-dot::before, .coinwhy-wrapper .trading-performance .live-dot::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: rgb(248, 81, 73);
}
.coinwhy-wrapper .trading-performance .live-dot::before {
  animation: live-pulse-1 2s ease infinite;
}
.coinwhy-wrapper .trading-performance .live-dot::after {
  animation: live-pulse-2 2s ease infinite;
}
@keyframes live-pulse-1 {
  0% {
    transform: scale(1);
    opacity: 0.8;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}
@keyframes live-pulse-2 {
  0% {
    transform: scale(1);
    opacity: 0.6;
  }
  100% {
    transform: scale(2);
    opacity: 0;
  }
}
.coinwhy-wrapper .trading-performance .performance-controls {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}
.coinwhy-wrapper .trading-performance .performance-coins {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .trading-performance .coin-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.8rem;
  color: var(--c-text);
}
.coinwhy-wrapper .trading-performance .coin-btn:hover {
  border-color: var(--c-border);
  background: var(--c-hover);
}
.coinwhy-wrapper .trading-performance .coin-btn.active {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-performance .coin-btn.active .coin-name {
  opacity: 0.8;
}
.coinwhy-wrapper .trading-performance .coin-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  filter: grayscale(0.2);
}
.coinwhy-wrapper .trading-performance .coin-btn.disabled:hover {
  background: var(--c-surface);
  border-color: var(--c-border);
}
.coinwhy-wrapper .trading-performance .coin-icon {
  width: 15px;
  height: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .trading-performance .coin-icon img {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .trading-performance .coin-fallback {
  font-size: 0.8rem;
}
.coinwhy-wrapper .trading-performance .coin-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.coinwhy-wrapper .trading-performance .coin-symbol {
  font-weight: 600;
  font-size: 0.8rem;
}
.coinwhy-wrapper .trading-performance .interval-selector {
  position: relative;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .trading-performance .interval-dropdown-toggle {
  display: none;
}
.coinwhy-wrapper .trading-performance .interval-buttons-wrapper {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .trading-performance .interval-btn {
  background: var(--c-surface);
  color: var(--c-text);
  border: 1px solid var(--c-border);
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
  min-width: 40px;
  text-align: center;
}
.coinwhy-wrapper .trading-performance .interval-btn:hover {
  border-color: var(--c-border);
  background: var(--c-hover);
}
.coinwhy-wrapper .trading-performance .interval-btn.active {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .trading-performance .interval-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.coinwhy-wrapper .trading-performance .interval-btn.disabled:hover {
  background: var(--c-surface);
  border-color: var(--c-border);
}
.coinwhy-wrapper .trading-performance .performance-stats {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.coinwhy-wrapper .trading-performance .performance-stats .unsupported-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(2px);
  border-radius: 8px;
  z-index: 12;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 16px;
}
.coinwhy-wrapper .trading-performance .performance-stats .unsupported-overlay .unsupported-message {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 16px 24px;
  box-shadow: 0 4px 12px var(--c-overlay-12);
}
.coinwhy-wrapper .trading-performance .performance-stats .unsupported-overlay .unsupported-message p {
  margin: 0;
  color: var(--c-text);
  font-size: 0.95rem;
  font-weight: 500;
  text-align: center;
}
.coinwhy-wrapper .trading-performance .stat-card {
  background: linear-gradient(135deg, rgba(var(--c-primary-rgb), 0.06), rgba(var(--c-success-rgb), 0.18));
  border: 1px solid rgba(var(--c-success-rgb), 0.35);
  border-radius: 8px;
  padding: 16px;
  text-align: center;
}
.coinwhy-wrapper .trading-performance .stat-card .stat-label {
  font-size: 0.85rem;
  color: var(--c-text-muted);
  margin-bottom: 3px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
}
.coinwhy-wrapper .trading-performance .stat-card .stat-label .cw-tip-wrap {
  margin-left: 0;
}
.coinwhy-wrapper .trading-performance .stat-card .stat-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--c-primary);
  line-height: 1.2;
}
.coinwhy-wrapper .trading-performance .stat-card .stat-value.success {
  color: var(--c-success);
}
.coinwhy-wrapper .trading-performance .stat-card .stat-value.danger {
  color: var(--c-danger);
}
.coinwhy-wrapper .trading-performance .stat-card .stat-value.warning {
  color: var(--c-warning);
}
.coinwhy-wrapper .trading-performance .stat-card .stat-value.neutral {
  color: var(--c-text);
}
.coinwhy-wrapper .trading-performance .performance-no-data {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 36px 20px;
  color: var(--c-text-muted);
  font-size: 0.95rem;
}
.coinwhy-wrapper .trading-performance .performance-no-data p {
  margin: 0;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .trading-performance {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
  }
  .coinwhy-wrapper .trading-performance .performance-header {
    gap: 8px;
  }
  .coinwhy-wrapper .trading-performance .coin-btn {
    min-width: auto;
    padding: 6px 9px;
  }
  .coinwhy-wrapper .trading-performance .coin-icon {
    width: 13px;
    height: 13px;
  }
  .coinwhy-wrapper .trading-performance .coin-icon img {
    width: 13px;
    height: 13px;
  }
  .coinwhy-wrapper .trading-performance .interval-selector {
    margin-left: auto;
    gap: 4px;
  }
  .coinwhy-wrapper .trading-performance .interval-btn {
    padding: 6px 8px;
    min-width: auto;
  }
  .coinwhy-wrapper .trading-performance .performance-stats {
    grid-template-columns: repeat(2, 1fr);
  }
  .coinwhy-wrapper .trading-performance .stat-card {
    padding: 10px;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .trading-performance .stat-card .stat-value {
    font-size: 1.3rem;
  }
  .coinwhy-wrapper .trading-performance .interval-selector {
    position: relative;
  }
  .coinwhy-wrapper .trading-performance .interval-dropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 10px;
    background: var(--c-primary);
    border: 1px solid var(--c-primary);
    color: var(--c-on-primary);
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 600;
  }
  .coinwhy-wrapper .trading-performance .interval-dropdown-toggle .interval-chevron {
    transition: transform 0.2s ease;
  }
  .coinwhy-wrapper .trading-performance .interval-dropdown-toggle[aria-expanded=true] .interval-chevron {
    transform: rotate(180deg);
  }
  .coinwhy-wrapper .trading-performance .interval-buttons-wrapper {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: 8px;
    box-shadow: 0 4px 12px var(--c-overlay-12);
    padding: 8px;
    flex-direction: column;
    gap: 4px;
    z-index: 13;
    max-height: 300px;
    overflow-y: auto;
  }
  .coinwhy-wrapper .trading-performance .interval-buttons-wrapper.open {
    display: flex;
  }
  .coinwhy-wrapper .trading-performance .interval-buttons-wrapper .interval-btn {
    width: 100%;
    justify-content: center;
  }
  .coinwhy-wrapper .trading-performance .performance-stats {
    gap: 10px;
  }
}
@media screen and (max-width: 480px) {
  .coinwhy-wrapper .trading-performance .coin-btn {
    text-align: center;
    min-height: 30px;
  }
  .coinwhy-wrapper .trading-performance .coin-info {
    display: none;
  }
  .coinwhy-wrapper .trading-performance .interval-selector {
    flex-shrink: 0;
  }
}

.coinwhy-wrapper .popular-posts-section {
  margin-bottom: 10px;
}
.coinwhy-wrapper .popular-posts-container {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 16px 24px;
}
.coinwhy-wrapper .popular-posts-container .popular-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.coinwhy-wrapper .popular-posts-container .popular-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--c-text);
  margin: 0;
}
.coinwhy-wrapper .popular-posts-container .popular-tabs {
  display: flex;
  align-items: center;
  gap: 0;
}
.coinwhy-wrapper .popular-posts-container .popular-tab-btn {
  padding: 0 8px;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 500;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .popular-posts-container .popular-tab-btn:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .popular-posts-container .popular-tab-btn.active {
  color: var(--c-primary);
  font-weight: 600;
}
.coinwhy-wrapper .popular-posts-container .popular-tab-separator {
  color: var(--c-text-muted);
  font-weight: 400;
}
.coinwhy-wrapper .popular-posts-container .popular-content {
  display: none;
}
.coinwhy-wrapper .popular-posts-container .popular-content.active {
  display: block;
}
.coinwhy-wrapper .popular-posts-container .popular-layout {
  display: flex;
  gap: 15px;
  align-items: start;
}
.coinwhy-wrapper .popular-posts-container .popular-list-area {
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .popular-posts-container .popular-thumbnail-area {
  width: 250px;
  height: 180px;
  flex-shrink: 0;
  border-radius: 8px;
  overflow: hidden;
  background: var(--c-bg);
  position: relative;
  margin: auto 0;
}
.coinwhy-wrapper .popular-posts-container .popular-thumbnail-area .popular-thumbnail-link {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.coinwhy-wrapper .popular-posts-container .popular-thumbnail-area .popular-thumbnail-link.active {
  display: block;
}
.coinwhy-wrapper .popular-posts-container .popular-thumbnail-area .popular-thumbnail-link:first-child {
  position: relative;
}
.coinwhy-wrapper .popular-posts-container .popular-thumbnail-area .popular-thumbnail {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.coinwhy-wrapper .popular-posts-container .popular-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.coinwhy-wrapper .popular-posts-container .popular-item {
  min-width: 0;
}
.coinwhy-wrapper .popular-posts-container .popular-item:not(:last-child) {
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .popular-posts-container .popular-item .popular-link {
  display: flex;
  align-items: center;
  gap: 0;
  padding: 10px 12px;
  text-decoration: none;
  color: var(--c-text);
  min-width: 0;
}
.coinwhy-wrapper .popular-posts-container .popular-item .popular-link:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .popular-posts-container .popular-item .popular-link:hover .popular-subject {
  color: var(--c-primary);
}
.coinwhy-wrapper .popular-posts-container .popular-item .popular-rank {
  font-size: 1rem;
  font-weight: 600;
  color: var(--c-primary);
  flex-shrink: 0;
  line-height: 1;
  padding-right: 12px;
}
.coinwhy-wrapper .popular-posts-container .popular-item .popular-title-wrap {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0;
  line-height: 1;
}
.coinwhy-wrapper .popular-posts-container .popular-item .popular-subject {
  font-size: 0.95rem;
  font-weight: normal;
  color: var(--c-text);
  line-height: 1;
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.coinwhy-wrapper .popular-posts-container .popular-item .popular-comments {
  font-size: 0.85rem;
  color: var(--c-primary);
  font-weight: 500;
  line-height: 1;
  flex-shrink: 0;
  white-space: nowrap;
  margin-left: 4px;
}
.coinwhy-wrapper .popular-posts-container .popular-item.rank-first .popular-subject {
  font-weight: 700;
}
.coinwhy-wrapper .popular-posts-container .popular-item.rank-first .popular-comments {
  font-weight: 700;
}
.coinwhy-wrapper .popular-posts-container .popular-item.rank-first .popular-rank {
  font-weight: 700;
}
.coinwhy-wrapper .popular-posts-container .popular-empty {
  padding: 20px;
  text-align: center;
  color: var(--c-text-muted);
  font-size: 0.9rem;
}
.coinwhy-wrapper .popular-posts-container .popular-empty p {
  margin: 0;
}
@media screen and (max-width: 1024px) {
  .coinwhy-wrapper .popular-posts-container .popular-thumbnail-area {
    width: 220px;
    height: 170px;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .popular-posts-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
  }
  .coinwhy-wrapper .popular-posts-container .popular-header {
    margin-bottom: 6px;
  }
  .coinwhy-wrapper .popular-posts-container .popular-tab-btn {
    padding: 0 6px;
  }
  .coinwhy-wrapper .popular-posts-container .popular-layout {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .coinwhy-wrapper .popular-posts-container .popular-thumbnail-area {
    display: none;
  }
  .coinwhy-wrapper .popular-posts-container .popular-list {
    gap: 0;
  }
  .coinwhy-wrapper .popular-posts-container .popular-item .popular-link {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 6px;
    padding-right: 6px;
  }
  .coinwhy-wrapper .popular-posts-container .popular-empty {
    padding: 15px;
  }
  .coinwhy-wrapper .popular-posts-container .popular-empty p {
    font-size: inherit;
  }
  .coinwhy-wrapper main > div:first-of-type .popular-posts-container {
    border-top: 0;
  }
}

.coinwhy-wrapper .board-search-section {
  margin-bottom: 10px;
}
.coinwhy-wrapper .board-search-section .board-top-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
  gap: 10px;
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form {
  flex: 1;
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-form {
  margin: 0;
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group {
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background: var(--c-hover);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  overflow: hidden;
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group:focus-within {
  background: var(--c-hover);
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group .search-input {
  flex: 1;
  width: 100%;
  height: 44px;
  padding: 0 50px 0 16px;
  border: none;
  background: transparent;
  font-size: 0.9rem;
  color: var(--c-text);
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group .search-input::placeholder {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group .search-input:focus {
  outline: none;
  background: var(--c-hover);
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group .search-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  background: transparent;
  color: var(--c-text-muted);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 0.9rem;
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group .search-btn:hover {
  background: rgba(var(--c-primary-rgb), 0.1);
  color: var(--c-primary);
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group .search-btn i {
  font-size: 1rem;
}
.coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group .search-btn .search-text {
  display: none;
}
.coinwhy-wrapper .board-search-section .board-top-controls .admin-controls {
  position: relative;
  border: 1px solid var(--c-border);
  border-radius: 5px;
}
.coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 44px;
  background: var(--c-hover);
  color: var(--c-text-muted);
  cursor: pointer;
}
.coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu-btn:hover {
  background: var(--c-hover);
  border-color: var(--c-border);
  color: var(--c-text);
}
.coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu-btn i {
  font-size: 1rem;
}
.coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu {
  position: absolute;
  top: 50px;
  right: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  box-shadow: 0 4px 12px var(--c-overlay-10);
  list-style: none;
  margin: 0;
  padding: 4px 0;
  min-width: 100px;
  z-index: 100;
}
.coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu li {
  margin: 0;
  padding: 0;
  width: 100%;
}
.coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu li button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 12px;
  background: none;
  border: none;
  color: var(--c-text);
  font-size: 0.85rem;
  cursor: pointer;
  text-align: left;
}
.coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu li button:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu li button i {
  font-size: 0.8rem;
  width: 12px;
}
.coinwhy-wrapper .board-list-container {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  margin-bottom: 24px;
  overflow: hidden;
  padding: 16px 24px;
  padding-bottom: 10px;
}
.coinwhy-wrapper .board-list-container .board-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
  padding: 0;
  margin: 0;
  margin-bottom: 10px;
}
.coinwhy-wrapper .board-list-container .board-header .board-title h2 {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--c-text);
  margin: 0;
}
.coinwhy-wrapper .board-list-container .board-header .select-all-container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .board-list-container .board-header .select-all-container .select-all-check {
  width: 18px;
  height: 18px;
  cursor: pointer;
  appearance: none;
  background: var(--c-surface);
  border: 2px solid var(--c-border);
  border-radius: 3px;
  position: relative;
  top: 1px;
}
.coinwhy-wrapper .board-list-container .board-header .select-all-container .select-all-check:hover {
  border-color: var(--c-primary);
}
.coinwhy-wrapper .board-list-container .board-header .select-all-container .select-all-check:checked {
  background: var(--c-primary);
  border-color: var(--c-primary);
}
.coinwhy-wrapper .board-list-container .board-header .select-all-container .select-all-check:checked::after {
  content: "";
  position: absolute;
  top: 1px;
  left: 5px;
  width: 4px;
  height: 8px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.coinwhy-wrapper .board-list-container .board-header .select-all-container .select-all-label {
  font-size: 0.9rem;
  color: var(--c-text-muted);
  cursor: pointer;
  user-select: none;
  margin: 0;
}
.coinwhy-wrapper .board-list-container .empty-posts {
  text-align: center;
  padding: 48px 24px;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .board-list-container .empty-posts .empty-icon {
  font-size: 3rem;
  margin-bottom: 16px;
  opacity: 0.5;
}
.coinwhy-wrapper .board-list-container .empty-posts p {
  margin: 8px 0;
  font-size: 0.9rem;
}
.coinwhy-wrapper .board-list-container .empty-posts p a {
  color: var(--c-primary);
  text-decoration: none;
}
.coinwhy-wrapper .board-list-container .empty-posts p a:hover {
  text-decoration: underline;
}
.coinwhy-wrapper #bo_btn_top {
  display: none;
}
.coinwhy-wrapper .bo_fx {
  display: flex;
  justify-content: flex-end;
  position: relative;
  top: -10px;
}
.coinwhy-wrapper .bo_fx .btn_bo_user {
  display: flex;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .board-list-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    border-top: 1px solid var(--c-border);
    margin-bottom: 16px;
  }
  .coinwhy-wrapper .board-list-container .board-header {
    margin-bottom: 4px;
  }
  .coinwhy-wrapper .board-search-section {
    padding: 0 10px;
    margin-top: 10px;
  }
  .coinwhy-wrapper .board-search-section .board-top-controls .board-search-form {
    width: 100%;
  }
  .coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group .search-input {
    font-size: 0.85rem;
    padding: 0 46px 0 14px;
    height: 40px;
  }
  .coinwhy-wrapper .board-search-section .board-top-controls .board-search-form .search-input-group .search-btn {
    width: 32px;
    height: 32px;
    right: 6px;
  }
  .coinwhy-wrapper .board-search-section .board-top-controls .admin-controls {
    align-self: flex-end;
  }
  .coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu-btn {
    width: 36px;
    height: 40px;
  }
  .coinwhy-wrapper .board-search-section .board-top-controls .admin-controls .admin-menu {
    top: 46px;
  }
}

.coinwhy-wrapper .board-view-container {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  margin-bottom: 24px;
}
.coinwhy-wrapper .board-view-container .view-header {
  padding: 16px 24px;
}
.coinwhy-wrapper .board-view-container .view-header .back-button-link {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  color: inherit;
}
.coinwhy-wrapper .board-view-container .view-header .back-button-link:hover {
  color: var(--c-text);
}
.coinwhy-wrapper .board-view-container .view-header .back-button-link:hover .back-icon svg {
  color: var(--c-text);
}
.coinwhy-wrapper .board-view-container .view-header .back-button-link .back-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
}
.coinwhy-wrapper .board-view-container .view-header .back-button-link .back-icon svg {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .board-view-container .view-header .back-button-link .board-name {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--c-text);
  margin: 0;
}
.coinwhy-wrapper .board-view-container .post-view {
  padding: 0 24px;
  padding-bottom: 24px;
  position: relative;
}
.coinwhy-wrapper .board-view-container .post-view::after {
  content: "";
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 0;
  height: 1px;
  background: var(--c-border);
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  align-items: flex-start;
  padding-top: 16px;
  border-top: 1px solid var(--c-border);
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .title-wrapper {
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .title-wrapper .post-title {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--c-text);
  line-height: 1.3;
  margin: 0;
  padding-right: 32px;
  word-wrap: break-word;
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .title-wrapper .post-title .post-category {
  display: inline-block;
  font-size: 0.8rem;
  color: var(--c-text-muted);
  background: var(--c-hover);
  padding: 3px 8px;
  border-radius: 5px;
  vertical-align: middle;
  display: inline-flex;
  margin-right: 5px;
  transform: translateY(-1px);
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions {
  position: relative;
  flex-shrink: 0;
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  position: absolute;
  right: 0;
  top: 0;
  background: transparent;
  border: none;
  border-radius: 50%;
  color: var(--c-text-muted);
  cursor: pointer;
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu-btn:hover {
  background: var(--c-hover);
  color: var(--c-text);
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu-btn i {
  font-size: 1rem;
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu {
  position: absolute;
  top: 40px;
  right: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  padding: 8px 0;
  min-width: 100px;
  z-index: 100;
  display: none;
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu .action-item {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 0;
  color: var(--c-text);
  text-decoration: none;
  font-size: 0.9rem;
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu .action-item:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu .action-item i {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 16px;
  font-size: 0.85rem;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid var(--c-border);
  margin-bottom: 24px;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .sentiment-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  border-radius: 9999px;
  font-size: 0.75rem;
  line-height: 1;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .sentiment-badge .sentiment-icon {
  width: 16px;
  height: 16px;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .sentiment-badge.sentiment-neutral {
  background: var(--c-hover);
  color: var(--c-text-muted);
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .sentiment-badge.sentiment-positive {
  background: var(--c-success);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .sentiment-badge.sentiment-negative {
  background: var(--c-danger);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .author-profile {
  flex-shrink: 0;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .author-profile img {
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .author-name {
  font-weight: 600;
  color: var(--c-text);
  font-size: 0.9rem;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .author-name .sv_member {
  color: var(--c-text);
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .time-separator {
  color: var(--c-text-muted);
  font-size: 0.9rem;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-info .post-time {
  font-size: 0.85rem;
  color: var(--c-text-muted);
  flex-shrink: 0;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .author-link {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: inherit;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .post-stats {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
  padding-left: 10px;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .post-stats .stat-item {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  font-size: 0.85rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .post-stats .stat-item .stat-icon {
  opacity: 0.7;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .post-stats .stat-item .stat-number {
  font-weight: 500;
  display: inline-block;
  font-size: 0.8rem;
}
.coinwhy-wrapper .board-view-container .post-view .post-meta .post-stats .stat-item i {
  font-size: 0.8rem;
  opacity: 0.8;
}
.coinwhy-wrapper .board-view-container .post-view .post-content {
  margin-bottom: 32px;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .admin-hit-increase {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin-bottom: 24px;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .admin-hit-increase .hit-increase-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .admin-hit-increase .hit-increase-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 60px;
  padding: 8px 16px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  color: var(--c-text);
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .admin-hit-increase .hit-increase-btn:hover:not(:disabled) {
  background: var(--c-primary);
  border-color: var(--c-primary);
  color: var(--c-on-primary);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(var(--c-primary-rgb), 0.3);
}
.coinwhy-wrapper .board-view-container .post-view .post-content .admin-hit-increase .hit-increase-btn:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: 0 1px 4px rgba(var(--c-primary-rgb), 0.2);
}
.coinwhy-wrapper .board-view-container .post-view .post-content .admin-hit-increase .hit-increase-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .post-images {
  margin-bottom: 20px;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .post-images img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  margin-bottom: 8px;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--c-text);
  word-wrap: break-word;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body p {
  margin-bottom: 16px;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body p:last-child {
  margin-bottom: 0;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  margin: 8px 0;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h1,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h2,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h3,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h4,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h5,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h6 {
  margin: 24px 0 16px 0;
  color: var(--c-text);
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h1:first-child,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h2:first-child,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h3:first-child,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h4:first-child,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h5:first-child,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body h6:first-child {
  margin-top: 0;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body ul,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body ol {
  margin: 16px 0;
  padding-left: 24px;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body ul li,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body ol li {
  margin-bottom: 4px;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body blockquote {
  margin: 16px 0;
  padding: 12px 16px;
  background: var(--c-hover);
  border-left: 4px solid var(--c-border);
  color: var(--c-text-muted);
  font-style: italic;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body code {
  background: var(--c-hover);
  padding: 2px 4px;
  border-radius: 3px;
  font-family: "Courier New", monospace;
  font-size: 0.9rem;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body pre {
  background: var(--c-hover);
  padding: 16px;
  border-radius: 6px;
  overflow-x: auto;
  margin: 16px 0;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body pre code {
  background: none;
  padding: 0;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body a,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body a:visited {
  color: var(--c-primary);
  text-decoration: underline;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body a:hover,
.coinwhy-wrapper .board-view-container .post-view .post-content .content-body a:focus {
  color: var(--c-primary-600);
  text-decoration: underline;
}
.coinwhy-wrapper .board-view-container .post-view .post-content .author-signature {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--c-border);
  font-size: 0.85rem;
  color: var(--c-text-muted);
  font-style: italic;
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding-bottom: 32px;
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  background-color: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 9999px;
  color: var(--c-text-muted);
  font-size: 0.85rem;
  cursor: pointer;
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn i {
  font-size: 0.9rem;
  vertical-align: middle;
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn i span {
  margin-left: 4px;
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn.scrap-btn:hover {
  background: rgba(var(--c-primary-rgb), 0.08);
  border-color: rgba(var(--c-primary-rgb), 0.4);
  color: var(--c-primary);
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn.scrap-btn.scrapped {
  border-color: var(--c-primary);
  background: rgba(var(--c-primary-rgb), 0.1);
  color: var(--c-primary);
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn.scrap-btn.scrapped:hover {
  background: rgba(var(--c-primary-rgb), 0.16);
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn.like-btn:hover {
  background: rgba(var(--c-like-rgb), 0.08);
  border-color: rgba(var(--c-like-rgb), 0.4);
  color: var(--c-like);
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn.like-btn.liked {
  border-color: var(--c-like);
  background: rgba(var(--c-like-rgb), 0.1);
  color: var(--c-like);
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn.like-btn.liked:hover {
  background: rgba(var(--c-like-rgb), 0.16);
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn.like-btn.liked i::before {
  content: "\f004";
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn.share-btn:hover {
  background: var(--c-hover);
  border-color: rgba(15, 23, 42, 0.35);
  color: var(--c-text);
}
.coinwhy-wrapper .board-view-container .post-view .post-actions-center .action-btn.share-btn:active {
  transform: translateY(1px);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}
.coinwhy-wrapper .board-view-container .post-view .attached-files {
  margin-bottom: 24px;
  padding: 20px;
  background: var(--c-hover);
  border-radius: 6px;
}
.coinwhy-wrapper .board-view-container .post-view .attached-files h3 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--c-text);
  margin: 0 0 12px 0;
}
.coinwhy-wrapper .board-view-container .post-view .attached-files .file-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.coinwhy-wrapper .board-view-container .post-view .attached-files .file-list .file-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .board-view-container .post-view .attached-files .file-list .file-item:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .board-view-container .post-view .attached-files .file-list .file-item .file-download {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  color: var(--c-text);
  text-decoration: none;
  flex: 1;
}
.coinwhy-wrapper .board-view-container .post-view .attached-files .file-list .file-item .file-download:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .board-view-container .post-view .attached-files .file-list .file-item .file-download i {
  color: var(--c-text-muted);
  font-size: 0.85rem;
}
.coinwhy-wrapper .board-view-container .post-view .attached-files .file-list .file-item .file-download .file-name {
  font-weight: 500;
}
.coinwhy-wrapper .board-view-container .post-view .attached-files .file-list .file-item .file-download .file-size {
  color: var(--c-text-muted);
  font-size: 0.85rem;
}
.coinwhy-wrapper .board-view-container .post-view .attached-files .file-list .file-item .download-count {
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .board-view-container .post-view .related-links {
  margin-bottom: 24px;
  padding: 20px;
  background: var(--c-hover);
  border-radius: 6px;
}
.coinwhy-wrapper .board-view-container .post-view .related-links h3 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--c-text);
  margin: 0 0 8px 0;
}
.coinwhy-wrapper .board-view-container .post-view .related-links .link-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.coinwhy-wrapper .board-view-container .post-view .related-links .link-list .link-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: flex-start;
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .board-view-container .post-view .related-links .link-list .link-item:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .board-view-container .post-view .related-links .link-list .link-item .external-link {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  color: var(--c-text);
  text-decoration: none;
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .board-view-container .post-view .related-links .link-list .link-item .external-link:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .board-view-container .post-view .related-links .link-list .link-item .external-link i {
  color: var(--c-text-muted);
  font-size: 0.85rem;
  position: relative;
  top: 1px;
}
.coinwhy-wrapper .board-view-container .post-view .related-links .link-list .link-item .external-link .link-title {
  font-size: 0.9rem;
  font-weight: 500;
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-all;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .board-view-container .post-view .post-navigation {
  border-top: 1px solid var(--c-border);
  padding-top: 16px;
}
.coinwhy-wrapper .board-view-container .post-view .post-navigation .nav-item {
  display: block;
  padding: 12px 0;
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .board-view-container .post-view .post-navigation .nav-item:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .board-view-container .post-view .post-navigation .nav-item:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .board-view-container .post-view .post-navigation .nav-item .nav-label {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
  color: var(--c-text-muted);
  margin-bottom: 4px;
}
.coinwhy-wrapper .board-view-container .post-view .post-navigation .nav-item .nav-label i {
  font-size: 0.75rem;
}
.coinwhy-wrapper .board-view-container .post-view .post-navigation .nav-item .nav-title {
  font-size: 0.95rem;
  color: var(--c-text);
  font-weight: 500;
  margin-bottom: 2px;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .board-view-container .post-view .post-navigation .nav-item .nav-date {
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .board-view-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    border-top: none;
    border-bottom: none;
  }
  .coinwhy-wrapper .board-view-container .view-header {
    padding: 12px 16px;
  }
  .coinwhy-wrapper .board-view-container .view-header .back-button-link .back-icon {
    width: 28px;
    height: 28px;
  }
  .coinwhy-wrapper .board-view-container .view-header .back-button-link .back-icon svg {
    width: 18px;
    height: 18px;
  }
  .coinwhy-wrapper .board-view-container .view-header .back-button-link .board-name {
    font-size: 1rem;
  }
  .coinwhy-wrapper .board-view-container .post-view {
    padding: 0 16px;
    padding-bottom: 16px;
  }
  .coinwhy-wrapper .board-view-container .post-view::after {
    left: 16px;
    right: 16px;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-meta .post-stats {
    gap: 8px;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-actions-center {
    gap: 8px;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-content .admin-hit-increase {
    margin-bottom: 20px;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-content .admin-hit-increase .hit-increase-buttons {
    gap: 6px;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-content .admin-hit-increase .hit-increase-btn {
    min-width: 50px;
    padding: 6px 12px;
  }
  .coinwhy-wrapper .board-view-container .post-view .attached-files,
  .coinwhy-wrapper .board-view-container .post-view .related-links {
    padding: 16px;
  }
}
@media screen and (max-width: 1024px) {
  .coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu-btn {
    width: 27px;
    height: 27px;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .board-view-container .post-view .post-title-section .title-wrapper .post-title {
    font-size: 1.2rem;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-title-section .title-wrapper .post-title .post-category {
    padding: 3px 6px;
    margin-right: 3px;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu-btn {
    width: 22px;
    height: 22px;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu {
    min-width: 80px;
    top: 30px;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-title-section .post-actions .action-menu .action-item {
    gap: 4px;
    padding: 6px 0;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-content .content-body {
    font-size: 0.95rem;
  }
  .coinwhy-wrapper .board-view-container .post-view .post-actions-center {
    flex-wrap: wrap;
    justify-content: center;
  }
}

.post-image-viewer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100dvh;
  background: var(--c-overlay-85);
  z-index: 3000;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  touch-action: none;
}
.post-image-viewer__topbar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  padding: 0 12px;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--c-text-inverse);
  font-size: 1rem;
  z-index: 3001;
}
.post-image-viewer__counter {
  pointer-events: none;
}
.post-image-viewer__close {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  background: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
.post-image-viewer__close svg {
  color: var(--c-text-inverse);
}
.post-image-viewer__body {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.post-image-viewer__swiper {
  width: 100%;
  height: 100%;
  touch-action: none;
}
.post-image-viewer .swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  touch-action: none;
  will-change: transform;
}
.post-image-viewer__img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 0;
  will-change: transform;
}

@media screen and (max-width: 640px) {
  .post-image-viewer__topbar {
    height: 42px;
    padding: 0 12px;
  }
  .post-image-viewer__close {
    right: 8px;
    width: 32px;
    height: 32px;
  }
  .post-image-viewer__img {
    max-width: 100%;
    max-height: 100%;
  }
}
.coinwhy-wrapper .comment-container {
  padding: 24px;
  padding-top: 0;
  background: var(--c-surface);
  border-radius: 8px;
}
.coinwhy-wrapper .comment-container .comment-write-area {
  margin-bottom: 20px;
}
.coinwhy-wrapper .comment-container .comment-count-header {
  padding: 0 4px;
}
.coinwhy-wrapper .comment-container .comment-count-header .comment-count-display {
  font-size: 1rem;
  font-weight: 600;
  color: var(--c-text);
}
.coinwhy-wrapper .comment-container .comment-count-header .total-comment-count {
  color: var(--c-primary);
}
.coinwhy-wrapper .comment-container #comment-list-container {
  background: var(--c-surface);
  border-radius: 8px;
  position: relative;
}
.coinwhy-wrapper .comment-container #comment-list-container .comment-loading {
  text-align: center;
  padding: 40px 20px;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .comment-container #comment-list-container .comment-loading i {
  font-size: 1.5rem;
  color: var(--c-primary);
  margin-bottom: 10px;
  display: block;
}
.coinwhy-wrapper .comment-container #comment-list-container .comment-loading span {
  font-size: 0.9rem;
}
.coinwhy-wrapper .comment-container #comment-list-container .no-comments {
  text-align: center;
  padding: 40px 20px;
  color: var(--c-text-muted);
  font-size: 0.9rem;
}
.coinwhy-wrapper .comment-container #comment-list-container .comment-error {
  text-align: center;
  padding: 40px 20px;
  color: var(--c-danger);
}
.coinwhy-wrapper .comment-container #comment-list-container .comment-error i {
  font-size: 1.5rem;
  margin-bottom: 10px;
  display: block;
}
.coinwhy-wrapper .comment-container #comment-list-container .comment-error span {
  display: block;
  margin-bottom: 15px;
  font-size: 0.9rem;
}
.coinwhy-wrapper .comment-container #comment-list-container .comment-error .retry-btn {
  background: var(--c-primary);
  color: var(--c-on-primary);
  border: none;
  padding: 8px 16px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.85rem;
}
.coinwhy-wrapper .comment-container #comment-list-container .comment-error .retry-btn:hover {
  background: var(--c-primary-600);
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .comment-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    border-top: none;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .comment-container .comment-write-area {
    margin-bottom: 16px;
  }
  .coinwhy-wrapper .comment-container .comment-count-header .comment-count-display {
    font-size: 0.9rem;
  }
  .coinwhy-wrapper .comment-container #comment-list-container .comment-loading,
  .coinwhy-wrapper .comment-container #comment-list-container .no-comments,
  .coinwhy-wrapper .comment-container #comment-list-container .comment-error {
    padding: 30px 15px;
  }
}

.comment-list-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: center;
  margin-top: 20px;
  margin-bottom: 10px;
}
.comment-list-header .comment-count {
  font-size: 1rem;
  color: var(--c-text);
}
.comment-list-header .comment-count strong#total-comment-count {
  color: var(--c-primary);
  font-weight: 600;
}
.comment-list-header .comment-sort {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.comment-list-header .comment-sort .sort-btn {
  padding: 6px 12px;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
  color: var(--c-text-muted);
  font-size: 0.85rem;
  cursor: pointer;
}
.comment-list-header .comment-sort .sort-btn:first-child {
  border-radius: 4px 0 0 4px;
}
.comment-list-header .comment-sort .sort-btn:last-child {
  border-radius: 0 4px 4px 0;
  border-left: none;
}
.comment-list-header .comment-sort .sort-btn:hover {
  background: var(--c-hover);
}
.comment-list-header .comment-sort .sort-btn.active {
  background: var(--c-primary);
  color: var(--c-on-primary);
  border-color: var(--c-primary);
}

.coinwhy-wrapper .hot-empty-posts {
  text-align: center;
  padding: 48px 24px;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .hot-empty-posts .empty-icon {
  font-size: 3rem;
  margin-bottom: 16px;
  opacity: 0.5;
  color: var(--c-hot);
}
.coinwhy-wrapper .hot-empty-posts p {
  margin: 8px 0;
  font-size: 0.9rem;
}
.coinwhy-wrapper .hot-empty-posts p a {
  color: var(--c-primary);
  text-decoration: none;
}
.coinwhy-wrapper .hot-empty-posts p a:hover {
  text-decoration: underline;
}
.coinwhy-wrapper .hot_icon {
  display: inline-block;
  background: var(--c-hot);
  color: var(--c-on-primary);
  font-size: 0.7rem;
  padding: 2px 5px;
  border-radius: 3px;
  margin-left: 3px;
  vertical-align: middle;
  transform: translateY(-1px);
  font-weight: bold;
}
.coinwhy-wrapper .post-card-free .post-title .hot-badge {
  background: var(--c-hot);
  color: var(--c-on-primary);
}
.coinwhy-wrapper .hot-board-header .board-title h2 {
  color: var(--c-hot);
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .hot-board-header .board-title h2::before {
  content: "🔥";
  margin-right: 5px;
  font-size: 1.2rem;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .hot-board-search {
    padding-top: 10px;
  }
}

.coinwhy-wrapper .my-page-container {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 16px 24px;
  margin-bottom: 24px;
  display: flex;
  flex-direction: column;
}
.coinwhy-wrapper .my-page-container .my-page-tabs {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: var(--c-surface-subtle, transparent);
  padding: 2px;
  margin-bottom: 10px;
  align-self: center;
}
.coinwhy-wrapper .my-page-container .my-page-tab {
  position: relative;
  padding: 4px 10px;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--c-text-muted);
  text-decoration: none;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease;
}
.coinwhy-wrapper .my-page-container .my-page-tab + .my-page-tab {
  margin-left: 10px;
}
.coinwhy-wrapper .my-page-container .my-page-tab:hover {
  color: var(--c-text);
}
.coinwhy-wrapper .my-page-container .my-page-tab.is-active {
  color: var(--c-text);
  font-weight: 600;
  background-color: var(--c-surface);
  border-radius: 999px;
  box-shadow: 0 0 0 1px var(--c-border-soft, var(--c-border));
  cursor: default;
}
.coinwhy-wrapper .my-page-container .my-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.coinwhy-wrapper .my-page-container .my-page-header .title {
  margin: 0;
  font-weight: 600;
  font-size: 1.2rem;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .my-page-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    border-top: none;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .my-page-container .my-page-tabs {
    margin-bottom: 8px;
  }
  .coinwhy-wrapper .my-page-container .my-page-header {
    margin-bottom: 20px;
  }
  .coinwhy-wrapper .my-page-container .my-page-header .title {
    margin-bottom: 0;
  }
}

.coinwhy-wrapper .message-container {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 16px 24px;
  margin-bottom: 24px;
  height: calc(100dvh - var(--page-header-height, 0px) - var(--page-footer-height, 0px) - var(--container-padding-y, 0px));
  display: flex;
  flex-direction: column;
  visibility: hidden;
}
.coinwhy-wrapper .message-container.ready {
  visibility: visible;
}
.coinwhy-wrapper .message-container::before {
  content: "";
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40px;
  height: 40px;
  border: 3px solid var(--c-border);
  border-top: 3px solid var(--c-primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  z-index: 10000;
  display: block;
}
.coinwhy-wrapper .message-container.ready::before {
  display: none;
}
@keyframes spin {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
.coinwhy-wrapper .message-container .my-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  flex-shrink: 0;
}
.coinwhy-wrapper .message-container .my-page-header .title {
  margin: 0;
  font-weight: 600;
  font-size: 1.2rem;
}
.coinwhy-wrapper .message-container .my-page-header .message-header-actions {
  display: flex;
  align-items: center;
  gap: 3px;
}
.coinwhy-wrapper .message-container .my-page-header .message-action-btn {
  background: transparent;
  border: none;
  padding: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--c-text);
  transition: color 0.2s;
}
.coinwhy-wrapper .message-container .my-page-header .message-action-btn:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .message-container .my-page-header .message-action-btn .action-icon {
  width: 20px;
  height: 20px;
}
.coinwhy-wrapper .message-container .message-search-bar {
  margin-bottom: 16px;
  display: none;
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity 0.18s ease, transform 0.18s ease;
  flex-shrink: 0;
}
.coinwhy-wrapper .message-container .message-search-bar.is-open {
  display: block;
  opacity: 1;
  transform: translateY(0);
}
.coinwhy-wrapper .message-container .message-search-bar .message-search-inner {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 999px;
  background-color: var(--c-hover);
  border: 1px solid var(--c-border-subtle, var(--c-border));
}
.coinwhy-wrapper .message-container .message-search-bar .message-search-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .message-container .message-search-bar .message-search-icon svg {
  width: 18px;
  height: 18px;
}
.coinwhy-wrapper .message-container .message-search-bar .message-search-input {
  flex: 1;
  border: 0;
  background: transparent;
  color: var(--c-text);
  font-size: 0.9rem;
  padding: 4px 0;
}
.coinwhy-wrapper .message-container .message-search-bar .message-search-input::placeholder {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .message-container .message-search-bar .message-search-input:focus {
  outline: none;
}
.coinwhy-wrapper .message-container .message-search-bar .message-search-close-btn {
  border: 0;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--c-text-muted);
  padding: 4px;
  margin-left: 4px;
}
.coinwhy-wrapper .message-container .message-search-bar .message-search-close-btn:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .message-container .message-search-bar .message-search-close-btn .message-search-close-icon {
  width: 18px;
  height: 18px;
}
.coinwhy-wrapper .message-container .message-list-container {
  position: relative;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}
.coinwhy-wrapper .message-container .message-list-container .empty {
  padding: 40px 20px;
  text-align: center;
  color: var(--c-text-muted);
  font-size: 0.95rem;
}
.coinwhy-wrapper .message-container .message-list-container .message-list-loading {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
}
.coinwhy-wrapper .message-container .message-list-container .message-list-loading .loading-spinner {
  width: 40px;
  height: 40px;
  border: 3px solid var(--c-border);
  border-top: 3px solid var(--c-primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 0;
  padding-right: 12px;
  border-bottom: 1px solid var(--c-border);
  text-decoration: none;
  color: inherit;
  transition: background-color 0.2s;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item:hover {
  background-color: var(--c-hover);
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-avatar {
  flex-shrink: 0;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-avatar img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-content .message-item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-content .message-item-header .message-item-nickname {
  font-weight: 600;
  color: var(--c-text);
  font-size: 0.95rem;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-content .message-item-header .message-item-time {
  font-size: 0.85rem;
  color: var(--c-text-muted);
  white-space: nowrap;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-content .message-item-body {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-content .message-item-body .message-item-preview {
  font-size: 0.9rem;
  color: var(--c-text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}
.coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-content .message-item-body .message-item-badge {
  flex-shrink: 0;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background-color: var(--c-primary);
  color: white;
  font-size: 0.75rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
}
.coinwhy-wrapper .message-container .message-view-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  flex-shrink: 0;
}
.coinwhy-wrapper .message-container .message-view-header .message-view-user {
  display: flex;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .message-container .message-view-header .message-view-user .avatar img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid var(--c-border);
  object-fit: cover;
}
.coinwhy-wrapper .message-container .message-view-header .message-view-user .username {
  font-weight: 600;
  font-size: 1rem;
  color: var(--c-text);
}
.coinwhy-wrapper .message-container .message-view-header .back-link {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--c-text);
  text-decoration: none;
  font-size: 0.9rem;
}
.coinwhy-wrapper .message-container .message-view-header .back-link:hover {
  color: var(--c-primary);
}
.coinwhy-wrapper .message-container .message-view-header .back-link .back-link-text {
  transform: translateY(1px);
}
.coinwhy-wrapper .message-container .message-view-header .back-link svg {
  width: 16px;
  height: 16px;
}
.coinwhy-wrapper .message-container .message-warning {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 12px;
  background-color: var(--c-hover);
  border-radius: 8px;
  margin-bottom: 16px;
  font-size: 0.85rem;
  color: var(--c-text-muted);
  text-align: center;
  flex-shrink: 0;
}
.coinwhy-wrapper .message-container .message-warning span {
  text-align: center;
}
.coinwhy-wrapper .message-container .message-connection-status {
  display: none;
  margin: 8px 0 12px;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 0.8rem;
  line-height: 1.4;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 6px;
}
.coinwhy-wrapper .message-container .message-connection-status.is-visible {
  display: flex;
}
.coinwhy-wrapper .message-container .message-connection-status.is-reconnecting {
  background-color: var(--c-chip-bg);
  color: var(--c-text-muted);
}
.coinwhy-wrapper .message-container .message-connection-status.is-error {
  background-color: rgba(244, 67, 54, 0.06);
  border: 1px solid rgba(244, 67, 54, 0.3);
  color: var(--c-text);
}
.coinwhy-wrapper .message-container .message-view-container {
  position: relative;
  overflow-y: auto;
  padding: 16px;
  background-color: var(--c-hover);
  border-radius: 8px;
  flex: 1;
  min-height: 0;
  opacity: 0;
}
.coinwhy-wrapper .message-container .message-view-container.scrolled {
  opacity: 1;
}
.coinwhy-wrapper .message-container .message-view-container .empty {
  padding: 40px 20px;
  text-align: center;
  color: var(--c-text-muted);
  font-size: 0.95rem;
}
.coinwhy-wrapper .message-container .message-view-container .message-loading {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--c-hover);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  color: var(--c-text);
  z-index: 10;
}
.coinwhy-wrapper .message-container .message-view-container .message-loading .loading-spinner {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  aspect-ratio: 1;
  border: 3px solid var(--c-border);
  border-top: 3px solid var(--c-primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.coinwhy-wrapper .message-container .message-view-container .message-thread {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-date-separator {
  display: flex;
  justify-content: center;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-date-separator .message-date-separator-inner {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 999px;
  background-color: var(--c-chip-bg);
  color: var(--c-text-muted);
  font-size: 0.8rem;
  line-height: 1.4;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-date-separator .message-date-separator-inner::before {
  content: "📅";
  margin-right: 3px;
  font-size: 0.8rem;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item {
  display: flex;
  width: 100%;
  align-items: flex-end;
  gap: 6px;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item.message-item-sent {
  justify-content: flex-end;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item.message-item-sent .message-bubble {
  background-color: var(--c-primary);
  color: white;
  border-radius: 18px 18px 4px 18px;
  max-width: 70%;
  order: 2;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item.message-item-sent .message-bubble .message-content a {
  color: rgba(255, 255, 255, 0.9);
  text-decoration-color: rgba(255, 255, 255, 0.7);
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item.message-item-sent .message-bubble .message-footer .message-time {
  color: rgba(255, 255, 255, 0.8);
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item.message-item-sent .message-read-indicator {
  font-size: 0.75rem;
  color: var(--c-text-muted);
  line-height: 1;
  margin-bottom: 2px;
  order: 1;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item.message-item-received {
  justify-content: flex-start;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item.message-item-received .message-bubble {
  background-color: var(--c-surface);
  color: var(--c-text);
  border-radius: 18px 18px 18px 4px;
  max-width: 70%;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item.message-item-received .message-bubble .message-footer .message-time {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-bubble {
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-bubble .message-content {
  font-size: 0.9rem;
  line-height: 1.5;
  word-wrap: break-word;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-bubble .message-content a {
  color: var(--c-primary);
  text-decoration: underline;
  text-decoration-color: var(--c-primary);
  text-underline-offset: 2px;
  transition: opacity 0.2s;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-bubble .message-content a:hover {
  opacity: 0.8;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-bubble .message-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  margin-top: 2px;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-bubble .message-footer .message-time {
  font-size: 0.75rem;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-bubble .message-content.is-long {
  max-height: 220px;
  overflow: hidden;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-more-wrap {
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  font-size: 0.8rem;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-more-dots {
  align-self: flex-start;
}
.coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-more-btn {
  align-self: flex-end;
  border: 0;
  background: transparent;
  font: inherit;
  padding: 0;
  cursor: pointer;
  color: inherit;
  text-decoration: none;
}
.coinwhy-wrapper .message-container .message-input-container {
  display: flex;
  gap: 8px;
  align-items: stretch;
  flex-shrink: 0;
  margin-top: 16px;
}
.coinwhy-wrapper .message-container .message-input-container .message-input {
  flex: 1;
  padding: 12px;
  border-radius: 8px;
  background: var(--c-hover);
  color: var(--c-text);
  font-size: 0.9rem;
  resize: none;
  overflow-y: auto;
  min-height: 40px;
  max-height: calc(7.5em + 24px);
  line-height: 1.5;
  font-family: inherit;
}
.coinwhy-wrapper .message-container .message-input-container .message-input:focus {
  outline: none;
}
.coinwhy-wrapper .message-container .message-input-container .message-send-btn {
  padding: 12px 20px;
  border: 1px solid var(--c-primary);
  border-radius: 8px;
  background: var(--c-primary);
  color: white;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.2s;
  opacity: 1;
}
.coinwhy-wrapper .message-container .message-input-container .message-send-btn:hover:not(:disabled) {
  opacity: 0.9;
}
.coinwhy-wrapper .message-container .message-input-container .message-send-btn:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed;
}
.coinwhy-wrapper .message-container .message-detail-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 3000;
}
.coinwhy-wrapper .message-container .message-detail-modal.is-open {
  display: flex;
  align-items: center;
  justify-content: center;
}
.coinwhy-wrapper .message-container .message-detail-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
}
.coinwhy-wrapper .message-container .message-detail-dialog {
  position: relative;
  max-width: 480px;
  max-height: 70vh;
  width: calc(100% - 32px);
  background: var(--c-surface);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.coinwhy-wrapper .message-container .message-detail-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .message-container .message-detail-header .message-detail-title {
  font-size: 1rem;
  font-weight: 600;
}
.coinwhy-wrapper .message-container .message-detail-header .message-detail-close {
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .message-container .message-detail-header .message-detail-close .message-detail-close-icon {
  width: 20px;
  height: 20px;
}
.coinwhy-wrapper .message-container .message-detail-body {
  padding: 16px;
  font-size: 0.9rem;
  line-height: 1.6;
  overflow-y: auto;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .message-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    border-top: none;
  }
  .coinwhy-wrapper .message-container .message-view-header .message-view-user .avatar img {
    width: 30px;
    height: 30px;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .message-container .my-page-header {
    margin-bottom: 12px;
  }
  .coinwhy-wrapper .message-container .message-search-bar {
    margin-bottom: 12px;
  }
  .coinwhy-wrapper .message-container .message-search-bar .message-search-inner {
    padding: 5px 10px;
    gap: 6px;
  }
  .coinwhy-wrapper .message-container .message-list-container .message-list .message-item {
    padding: 10px 0;
    padding-right: 10px;
    gap: 10px;
  }
  .coinwhy-wrapper .message-container .message-list-container .message-list .message-item .message-item-avatar img {
    width: 40px;
    height: 40px;
  }
  .coinwhy-wrapper .message-container .message-view-container {
    padding: 12px;
  }
  .coinwhy-wrapper .message-container .message-view-container .message-thread {
    gap: 10px;
  }
  .coinwhy-wrapper .message-container .message-view-container .message-thread .message-item .message-bubble {
    padding: 8px 12px;
    max-width: 80%;
  }
  .coinwhy-wrapper .message-container .message-input-container .message-input {
    padding: 10px;
  }
  .coinwhy-wrapper .message-container .message-input-container .message-send-btn {
    padding: 10px 16px;
  }
}

.coinwhy-wrapper .alarm-page-container {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 16px 24px;
  margin-bottom: 24px;
  display: flex;
  flex-direction: column;
  min-height: calc(100dvh - var(--page-header-height, 0px) - var(--page-footer-height, 0px) - var(--container-padding-y, 0px));
  visibility: hidden;
}
.coinwhy-wrapper .alarm-page-container.ready {
  visibility: visible;
}
.coinwhy-wrapper .alarm-page-container .my-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
}
.coinwhy-wrapper .alarm-page-container .my-page-header .title {
  margin: 0;
  font-weight: 600;
  font-size: 1.2rem;
}
.coinwhy-wrapper .alarm-page-container .my-page-header .alarm-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .alarm-page-container .my-page-header .alarm-action-btn {
  border: 1px solid var(--c-border);
  border-radius: 999px;
  background: transparent;
  padding: 6px 12px;
  font-size: 0.85rem;
  color: var(--c-text-muted);
  cursor: pointer;
  transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}
.coinwhy-wrapper .alarm-page-container .my-page-header .alarm-action-btn:hover {
  background: var(--c-hover);
  color: var(--c-text);
  border-color: var(--c-border);
}
.coinwhy-wrapper .alarm-page-container .alarm-list-wrapper {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.coinwhy-wrapper .alarm-page-container .alarm-list-container {
  position: relative;
  overflow-y: visible;
  flex: 1;
  min-height: 0;
}
.coinwhy-wrapper .alarm-page-container .alarm-list-container .empty {
  padding: 40px 20px;
  text-align: center;
  color: var(--c-text-muted);
  font-size: 0.95rem;
}
.coinwhy-wrapper .alarm-page-container .alarm-list-container .alarm-list-loading {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
}
.coinwhy-wrapper .alarm-page-container .alarm-list-container .alarm-list-loading .loading-spinner {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 3px solid var(--c-border);
  border-top-color: var(--c-primary);
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.coinwhy-wrapper .alarm-page-container .alarm-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  border-bottom: 1px solid var(--c-border);
  text-decoration: none;
  color: var(--c-text);
  transition: background-color 0.15s;
}
.coinwhy-wrapper .alarm-page-container .alarm-item:hover {
  background-color: var(--c-hover);
}
.coinwhy-wrapper .alarm-page-container .alarm-item:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .alarm-page-container .alarm-item .alarm-avatar {
  flex-shrink: 0;
}
.coinwhy-wrapper .alarm-page-container .alarm-item .alarm-avatar img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}
.coinwhy-wrapper .alarm-page-container .alarm-item .alarm-main {
  flex: 1;
  min-width: 0;
}
.coinwhy-wrapper .alarm-page-container .alarm-item .alarm-text {
  font-size: 0.9rem;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .alarm-page-container .alarm-item .alarm-text .alarm-highlight {
  color: var(--c-primary);
  font-weight: 600;
}
.coinwhy-wrapper .alarm-page-container .alarm-item .alarm-meta {
  margin-top: 4px;
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alarm-page-container .alarm-item .alarm-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--c-primary);
  flex-shrink: 0;
  margin-top: 6px;
}
.coinwhy-wrapper .alarm-page-container .alarm-item.alarm-unread {
  background-color: rgba(var(--c-primary-rgb, 82, 115, 255), 0.04);
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .alarm-page-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .alarm-page-container .alarm-list-container {
    max-height: none;
  }
  .coinwhy-wrapper .alarm-page-container .alarm-list-container .alarm-item {
    padding: 10px;
  }
}

.coinwhy-wrapper .alert-page-container {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 16px 24px;
  margin-bottom: 24px;
  display: flex;
  flex-direction: column;
  min-height: calc(100dvh - var(--page-header-height, 0px) - var(--page-footer-height, 0px) - var(--container-padding-y, 0px));
  visibility: hidden;
}
.coinwhy-wrapper .alert-page-container.ready {
  visibility: visible;
}
.coinwhy-wrapper .alert-page-container .my-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 14px;
}
.coinwhy-wrapper .alert-page-container .my-page-header__titles {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.coinwhy-wrapper .alert-page-container .my-page-header .title {
  margin: 0;
  font-weight: 600;
  font-size: 1.2rem;
}
.coinwhy-wrapper .alert-page-container .my-page-header .subtitle {
  margin: 0;
  font-size: 0.85rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-layout {
  display: flex;
  flex-direction: column;
}
.coinwhy-wrapper .alert-page-container .alert-status {
  margin: 10px 0 18px;
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.coinwhy-wrapper .alert-page-container .alert-status__hero {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.coinwhy-wrapper .alert-page-container .alert-status__hero-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-status__hero-main {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--c-text);
  min-width: 0;
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-hero-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.coinwhy-wrapper .alert-page-container .alert-status__rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-row__label {
  font-weight: 500;
  white-space: nowrap;
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-row__value {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-row__value .alert-status-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-badge {
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.75rem;
  border: 1px solid transparent;
  white-space: nowrap;
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-badge--pro {
  background: rgba(var(--c-primary-rgb, 0, 184, 255), 0.12);
  color: var(--c-primary);
  border-color: rgba(var(--c-primary-rgb, 0, 184, 255), 0.5);
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-badge--free {
  background: var(--c-hover);
  color: var(--c-text-muted);
  border-color: var(--c-border);
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-badge--ok {
  background: rgba(var(--c-success-rgb, 32, 201, 151), 0.12);
  color: var(--c-success);
  border-color: rgba(var(--c-success-rgb, 32, 201, 151), 0.5);
}
.coinwhy-wrapper .alert-page-container .alert-status .alert-status-badge--muted {
  background: var(--c-hover);
  color: var(--c-text-muted);
  border-color: var(--c-border);
}
.coinwhy-wrapper .alert-page-container .alert-layout__top {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.coinwhy-wrapper .alert-page-container .alert-card {
  border-radius: 10px;
  border: 1px solid var(--c-border);
  background: var(--c-bg);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.coinwhy-wrapper .alert-page-container .alert-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}
.coinwhy-wrapper .alert-page-container .alert-card__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
}
.coinwhy-wrapper .alert-page-container .alert-card__body {
  font-size: 0.85rem;
  color: var(--c-text-muted);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.coinwhy-wrapper .alert-page-container .alert-card__description {
  line-height: 1.5;
}
.coinwhy-wrapper .alert-page-container .alert-card--history {
  margin-top: 4px;
}
.coinwhy-wrapper .alert-page-container .alert-empty {
  margin: 4px 0;
  font-size: 0.85rem;
  color: var(--c-text-muted);
  line-height: 1.5;
}
.coinwhy-wrapper .alert-page-container .alert-helper-text {
  margin: 0 0 6px;
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.75rem;
  border: 1px solid transparent;
}
.coinwhy-wrapper .alert-page-container .alert-tag--success {
  background: rgba(var(--c-success-rgb, 32, 201, 151), 0.1);
  color: var(--c-success);
  border-color: rgba(var(--c-success-rgb, 32, 201, 151), 0.4);
}
.coinwhy-wrapper .alert-page-container .alert-tag--danger {
  background: rgba(239, 83, 80, 0.12);
  color: #ef5350;
  border-color: rgba(239, 83, 80, 0.5);
}
.coinwhy-wrapper .alert-page-container .alert-tag--pending {
  background: rgba(var(--c-warning-rgb, 255, 193, 7), 0.12);
  color: var(--c-warning);
  border-color: rgba(var(--c-warning-rgb, 255, 193, 7), 0.5);
}
.coinwhy-wrapper .alert-page-container .alert-tag--muted {
  background: var(--c-hover);
  color: var(--c-text-muted);
  border-color: var(--c-border);
}
.coinwhy-wrapper .alert-page-container .telegram-link-status {
  font-size: 0.85rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .telegram-link-status__label {
  margin-right: 6px;
}
.coinwhy-wrapper .alert-page-container .telegram-link-status__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  margin-top: 10px;
  width: 100%;
  border-radius: 999px;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
  color: var(--c-text);
  font-size: 0.8rem;
  cursor: pointer;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}
.coinwhy-wrapper .alert-page-container .telegram-link-status__btn:hover {
  background: var(--c-hover);
  border-color: var(--c-border);
}
.coinwhy-wrapper .alert-page-container .telegram-link-status--loading {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .telegram-link-status--error {
  color: var(--c-danger);
}
.coinwhy-wrapper .alert-page-container .telegram-link-status--connected {
  color: var(--c-success);
}
.coinwhy-wrapper .alert-page-container .alert-table-wrapper {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.coinwhy-wrapper .alert-page-container .alert-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}
.coinwhy-wrapper .alert-page-container .alert-table thead {
  background: var(--c-surface);
}
.coinwhy-wrapper .alert-page-container .alert-table thead th {
  padding: 6px 8px;
  font-weight: 500;
  text-align: left;
  border-bottom: 1px solid var(--c-border);
  white-space: nowrap;
  color: var(--c-text-muted);
  position: sticky;
  top: 0;
  z-index: 1;
  text-align: center;
}
.coinwhy-wrapper .alert-page-container .alert-table tbody tr {
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .alert-page-container .alert-table tbody tr:last-child {
  border-bottom: none;
}
.coinwhy-wrapper .alert-page-container .alert-table tbody tr.is-disabled {
  opacity: 0.6;
}
.coinwhy-wrapper .alert-page-container .alert-table tbody td {
  padding: 6px 8px;
  vertical-align: middle;
}
.coinwhy-wrapper .alert-page-container .alert-table .cell-symbol {
  font-weight: 600;
  white-space: nowrap;
}
.coinwhy-wrapper .alert-page-container .alert-table .cell-interval {
  white-space: nowrap;
}
.coinwhy-wrapper .alert-page-container .alert-table .cell-plan {
  text-transform: lowercase;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-table .cell-datetime {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-table .cell-message {
  max-width: 420px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix {
  table-layout: fixed;
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix col.col-symbol {
  width: 28%;
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix tbody tr:hover {
  background: var(--c-hover);
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix .cell-symbol {
  white-space: normal;
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix .cell-symbol .alert-coin {
  display: flex;
  align-items: center;
  gap: 8px;
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix .cell-symbol .alert-coin__icon {
  flex: 0 0 auto;
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix .cell-symbol .alert-coin__icon img {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  display: block;
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix .cell-symbol .alert-coin__meta {
  min-width: 0;
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix .cell-symbol .alert-coin__symbol {
  font-weight: 600;
  font-size: 0.86rem;
  color: var(--c-text);
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix .cell-symbol .alert-coin__name {
  margin-top: 2px;
  font-size: 0.78rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix .cell-toggle {
  text-align: center;
}
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix th:not(:first-child),
.coinwhy-wrapper .alert-page-container .alert-table.alert-matrix td.cell-toggle {
  min-width: 56px;
}
.coinwhy-wrapper .alert-page-container .alert-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 56px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
  color: var(--c-text-muted);
  font-size: 0.75rem;
  cursor: pointer;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s;
}
.coinwhy-wrapper .alert-page-container .alert-toggle-label {
  white-space: nowrap;
  display: inline-block;
}
.coinwhy-wrapper .alert-page-container .alert-toggle--on {
  background: rgba(var(--c-success-rgb, 32, 201, 151), 0.08);
  border-color: rgba(var(--c-success-rgb, 32, 201, 151), 0.5);
  color: var(--c-success);
}
.coinwhy-wrapper .alert-page-container .alert-toggle--on::before {
  content: "✓";
  display: inline-block;
  margin-right: 3px;
  font-size: 0.8em;
}
.coinwhy-wrapper .alert-page-container .alert-toggle--off {
  background: var(--c-bg);
  border-color: var(--c-border);
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-toggle--disabled {
  cursor: not-allowed;
  opacity: 0.6;
  background: var(--c-hover);
}
.coinwhy-wrapper .alert-page-container .alert-toggle:not(.coinwhy-wrapper .alert-page-container .alert-toggle--disabled):hover {
  box-shadow: 0 0 0 1px rgba(var(--c-primary-rgb, 0, 184, 255), 0.4);
  border-color: rgba(var(--c-primary-rgb, 0, 184, 255), 0.6);
}
.coinwhy-wrapper .alert-page-container .alert-toggle--chip {
  min-width: 0;
  padding-inline: 10px;
  border-radius: 999px;
}
.coinwhy-wrapper .alert-page-container .alert-coin-list {
  display: none;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card {
  border-radius: 10px;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__main {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__icon {
  flex: 0 0 auto;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__icon img {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: block;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__symbol {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--c-text);
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__name {
  font-size: 0.78rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__status {
  flex-shrink: 0;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__chevron {
  margin-left: 6px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__chevron .alert-coin-card__chevron-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__chevron .alert-coin-card__chevron-icon--up {
  display: none;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__chevron .alert-coin-card__chevron-icon svg {
  width: 16px;
  height: 16px;
  display: block;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__body {
  display: none;
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px dashed var(--c-border);
}
.coinwhy-wrapper .alert-page-container .alert-coin-card__helper {
  margin: 8px 0 0;
  font-size: 0.78rem;
  color: var(--c-text-muted);
  line-height: 1.4;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card.is-open .alert-coin-card__body {
  display: block;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card.is-open .alert-coin-card__chevron-icon--down {
  display: none;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card.is-open .alert-coin-card__chevron-icon--up {
  display: inline-flex;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card--disabled {
  opacity: 0.8;
}
.coinwhy-wrapper .alert-page-container .alert-coin-card--disabled .alert-interval-chips {
  opacity: 0.7;
}
.coinwhy-wrapper .alert-page-container .alert-interval-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.coinwhy-wrapper .alert-page-container .alert-table--logs th:first-child,
.coinwhy-wrapper .alert-page-container .alert-table--logs td.cell-symbol {
  min-width: 140px;
}
.coinwhy-wrapper .alert-page-container .alert-table--logs td.cell-symbol {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.coinwhy-wrapper .alert-page-container .alert-table--logs .alert-log-coin {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.coinwhy-wrapper .alert-page-container .alert-table--logs .alert-log-coin__icon {
  flex: 0 0 auto;
}
.coinwhy-wrapper .alert-page-container .alert-table--logs .alert-log-coin__icon img {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  display: block;
}
.coinwhy-wrapper .alert-page-container .alert-table--logs .alert-log-coin__symbol {
  font-weight: 600;
  font-size: 0.86rem;
  color: var(--c-text);
}
.coinwhy-wrapper .alert-page-container .alert-table--logs .alert-log-coin__dot {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .alert-page-container .alert-table--logs .alert-log-coin__interval {
  color: var(--c-text-muted);
  font-size: 0.82rem;
}
.coinwhy-wrapper .alert-page-container .alert-table--logs td.cell-message {
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coinwhy-wrapper .alert-page-container .alert-log-list {
  display: none;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .alert-page-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
  }
  .coinwhy-wrapper .alert-page-container .my-page-header {
    margin-bottom: 10px;
  }
  .coinwhy-wrapper .alert-page-container .my-page-header .subtitle {
    font-size: 0.82rem;
  }
  .coinwhy-wrapper .alert-page-container .alert-status {
    padding: 10px 12px;
  }
  .coinwhy-wrapper .alert-page-container .alert-table-wrapper--subscriptions {
    display: none;
  }
  .coinwhy-wrapper .alert-page-container .alert-coin-list--mobile {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 4px;
  }
  .coinwhy-wrapper .alert-page-container .alert-table.alert-table--logs {
    display: none;
  }
  .coinwhy-wrapper .alert-page-container .alert-log-list--mobile {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card {
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid var(--c-border);
    background: var(--c-surface);
    font-size: 0.85rem;
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card__left {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card__icon {
    flex: 0 0 auto;
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card__icon img {
    width: 20px;
    height: 20px;
    border-radius: 999px;
    display: block;
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card__symbol {
    font-weight: 600;
    color: var(--c-text);
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card__dot {
    color: var(--c-text-muted);
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card__interval {
    color: var(--c-text-muted);
    font-size: 0.82rem;
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card__time {
    flex-shrink: 0;
    font-size: 0.78rem;
    color: var(--c-text-muted);
  }
  .coinwhy-wrapper .alert-page-container .alert-log-card__message {
    font-size: 0.82rem;
    color: var(--c-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
  }
}

.telegram-link-helper {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: none;
  align-items: center;
  justify-content: center;
}
.telegram-link-helper.is-open {
  display: flex;
}
.telegram-link-helper__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}
.telegram-link-helper__panel {
  position: relative;
  z-index: 1;
  max-width: 420px;
  width: calc(100% - 32px);
  border-radius: 10px;
  border: 1px solid var(--c-border);
  background: var(--c-bg);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.32);
  padding: 14px 16px 16px;
  font-size: 0.85rem;
  color: var(--c-text);
}
.telegram-link-helper__title {
  margin: 0 0 6px;
  font-size: 0.9rem;
  font-weight: 600;
}
.telegram-link-helper__text {
  margin: 0 0 10px;
  line-height: 1.5;
  color: var(--c-text-muted);
}
.telegram-link-helper__text code {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
  font-size: 0.8em;
  background: var(--c-hover);
  padding: 1px 4px;
  border-radius: 4px;
}
.telegram-link-helper__code {
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px dashed var(--c-border);
  background: var(--c-surface);
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
}
.telegram-link-helper__code-text {
  font-size: 0.8rem;
  display: block;
  word-break: break-all;
  white-space: normal;
}
.telegram-link-helper__actions {
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.telegram-link-helper__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--c-border);
  background: var(--c-surface);
  color: var(--c-text);
  font-size: 0.8rem;
  cursor: pointer;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}
.telegram-link-helper__btn:hover {
  background: var(--c-hover);
}
.telegram-link-helper__btn--primary {
  border-color: rgba(var(--c-success-rgb, 32, 201, 151), 0.6);
  color: var(--c-success);
}
.telegram-link-helper__btn--ghost {
  background: transparent;
}

.coinwhy-wrapper .ctt_admin {
  text-align: right;
  margin-bottom: 10px;
}
.coinwhy-wrapper .content-container {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 20px 24px;
  margin-bottom: 24px;
  overflow: hidden;
}
.coinwhy-wrapper .content-container .content-header {
  margin-bottom: 20px;
}
.coinwhy-wrapper .content-container .content-header h2.page-title {
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--c-text);
  margin: 0;
}
.coinwhy-wrapper .content-container .content-body {
  line-height: 1.6;
}
.coinwhy-wrapper .content-container .content-body img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
}
.coinwhy-wrapper .content-container .content-body .ctt_img {
  text-align: center;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .content-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    border-top: none;
  }
  .coinwhy-wrapper .content-container .content-header {
    margin-bottom: 15px;
  }
}

.coinwhy-wrapper .member-confirm-container {
  max-width: 480px;
  margin: 80px auto 120px;
  padding: 0;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box {
  width: 100%;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 32px 24px 24px 24px;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box h1 {
  text-align: center;
  margin-bottom: 30px;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--c-text);
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-description {
  text-align: center;
  margin-bottom: 30px;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-description strong {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: var(--c-text);
  margin-bottom: 8px;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-description p {
  font-size: 14px;
  color: var(--c-text-muted);
  line-height: 1.5;
  margin: 0;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-form .input-group {
  margin-bottom: 20px;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-form .input-group label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
  color: var(--c-text);
  font-size: 14px;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-form .input-group .member-id {
  padding: 0 16px;
  height: 44px;
  background: var(--c-hover);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  display: flex;
  align-items: center;
  font-size: 15px;
  color: var(--c-text);
  font-weight: 500;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-form .input-group .form-input {
  width: 100%;
  padding: 0 16px;
  height: 44px;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  font-size: 15px;
  background: var(--c-surface);
  color: var(--c-text);
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-form .input-group .form-input::placeholder {
  color: var(--c-text-muted);
  font-size: 14px;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-form .btn-group {
  margin-top: 30px;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-form .btn-group .btn-submit {
  width: 100%;
  height: 52px;
  background: var(--c-primary-600);
  border: none;
  color: var(--c-on-primary);
  font-weight: 600;
  font-size: 16px;
  border-radius: 8px;
  cursor: pointer;
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-form .btn-group .btn-submit:hover {
  background: var(--c-primary-600);
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.06);
}
.coinwhy-wrapper .member-confirm-container .mbskin_box .confirm-form .btn-group .btn-submit:disabled {
  background: var(--c-text-muted);
  cursor: not-allowed;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .member-confirm-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    background-color: var(--c-surface);
    max-width: 100%;
    min-height: 60vh;
  }
  .coinwhy-wrapper .member-confirm-container .mbskin_box {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 24px;
    padding-right: 24px;
    width: min(360px, 100%);
    border-top: 0;
    border-bottom: 0;
    padding: 40px 20px;
    padding-bottom: 60px;
  }
}

.coinwhy-wrapper .register-terms-container .register,
.coinwhy-wrapper .social-register-container .register {
  max-width: 480px;
  margin: 80px auto 120px;
  padding: 32px 24px 24px 24px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  box-shadow: none;
}
.coinwhy-wrapper .register-terms-container .register .step-indicator,
.coinwhy-wrapper .social-register-container .register .step-indicator {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 24px;
}
.coinwhy-wrapper .register-terms-container .register .step-indicator .step-dots,
.coinwhy-wrapper .social-register-container .register .step-indicator .step-dots {
  display: flex;
  gap: 6px;
}
.coinwhy-wrapper .register-terms-container .register .step-indicator .step-dots .step-dot,
.coinwhy-wrapper .social-register-container .register .step-indicator .step-dots .step-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--c-border);
}
.coinwhy-wrapper .register-terms-container .register .step-indicator .step-dots .step-dot.active,
.coinwhy-wrapper .social-register-container .register .step-indicator .step-dots .step-dot.active {
  background: var(--c-primary-600);
}
.coinwhy-wrapper .register-terms-container .register .register-title,
.coinwhy-wrapper .social-register-container .register .register-title {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--c-text);
  text-align: left;
  margin-bottom: 28px;
}
.coinwhy-wrapper .register-terms-container .register .agree-all-section,
.coinwhy-wrapper .social-register-container .register .agree-all-section {
  padding: 0;
  margin-bottom: 10px;
}
.coinwhy-wrapper .register-terms-container .register .agree-all-section .agree-all-checkbox,
.coinwhy-wrapper .social-register-container .register .agree-all-section .agree-all-checkbox {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 15px;
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .register-terms-container .register .agree-all-section .agree-all-checkbox input[type=checkbox],
.coinwhy-wrapper .social-register-container .register .agree-all-section .agree-all-checkbox input[type=checkbox] {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  appearance: none;
  background: var(--c-border);
  position: relative;
  cursor: pointer;
  margin-right: 8px;
}
.coinwhy-wrapper .register-terms-container .register .agree-all-section .agree-all-checkbox input[type=checkbox]::before,
.coinwhy-wrapper .social-register-container .register .agree-all-section .agree-all-checkbox input[type=checkbox]::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 22px;
  height: 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 12.5L10 16.5L18 8.5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.coinwhy-wrapper .register-terms-container .register .agree-all-section .agree-all-checkbox input[type=checkbox]:checked,
.coinwhy-wrapper .social-register-container .register .agree-all-section .agree-all-checkbox input[type=checkbox]:checked {
  background: var(--c-primary-600);
  border-color: var(--c-primary-600);
}
.coinwhy-wrapper .register-terms-container .register .agree-all-section .agree-all-checkbox label,
.coinwhy-wrapper .social-register-container .register .agree-all-section .agree-all-checkbox label {
  font-size: 1.08rem;
  font-weight: 700;
  color: var(--c-text);
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .register-terms-container .register .terms-list .term-item,
.coinwhy-wrapper .social-register-container .register .terms-list .term-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
}
.coinwhy-wrapper .register-terms-container .register .terms-list .term-item .term-left,
.coinwhy-wrapper .social-register-container .register .terms-list .term-item .term-left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.coinwhy-wrapper .register-terms-container .register .terms-list .term-item .term-left input[type=checkbox],
.coinwhy-wrapper .social-register-container .register .terms-list .term-item .term-left input[type=checkbox] {
  width: 22px;
  height: 22px;
  border: none;
  border-radius: 0;
  appearance: none;
  background: var(--c-surface);
  position: relative;
  cursor: pointer;
  margin-right: 8px;
}
.coinwhy-wrapper .register-terms-container .register .terms-list .term-item .term-left input[type=checkbox]::before,
.coinwhy-wrapper .social-register-container .register .terms-list .term-item .term-left input[type=checkbox]::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 22px;
  height: 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 12.5L10 16.5L18 8.5' stroke='%23d1d5db' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.coinwhy-wrapper .register-terms-container .register .terms-list .term-item .term-left input[type=checkbox]:checked::before,
.coinwhy-wrapper .social-register-container .register .terms-list .term-item .term-left input[type=checkbox]:checked::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 12.5L10 16.5L18 8.5' stroke='%233a78c5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.coinwhy-wrapper .register-terms-container .register .terms-list .term-item .term-left label,
.coinwhy-wrapper .social-register-container .register .terms-list .term-item .term-left label {
  font-size: 1rem;
  font-weight: 500;
  color: var(--c-text);
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .register-terms-container .register .terms-list .term-item .term-left .required,
.coinwhy-wrapper .social-register-container .register .terms-list .term-item .term-left .required {
  background-image: none !important;
}
.coinwhy-wrapper .register-terms-container .register .terms-list .term-item .term-right .btn-view-terms,
.coinwhy-wrapper .social-register-container .register .terms-list .term-item .term-right .btn-view-terms {
  background: none;
  border: none;
  color: var(--c-primary-600);
  font-size: 0.97rem;
  cursor: pointer;
  text-decoration: underline;
  padding: 0 2px;
}
.coinwhy-wrapper .register-terms-container .register .btn_confirm,
.coinwhy-wrapper .social-register-container .register .btn_confirm {
  margin-top: 32px;
}
.coinwhy-wrapper .register-terms-container .register .btn_confirm .btn_submit,
.coinwhy-wrapper .social-register-container .register .btn_confirm .btn_submit {
  width: 100%;
  background: var(--c-border);
  color: var(--c-text-muted);
  border: none;
  border-radius: 8px;
  padding: 15px 0;
  font-size: 1.08rem;
  font-weight: 700;
  cursor: not-allowed;
}
.coinwhy-wrapper .register-terms-container .register .btn_confirm .btn_submit.active,
.coinwhy-wrapper .social-register-container .register .btn_confirm .btn_submit.active {
  background: var(--c-primary-600);
  color: var(--c-on-primary);
  cursor: pointer;
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .register-terms-container .register,
  .coinwhy-wrapper .social-register-container .register {
    padding: 20px 16px;
    margin: 40px auto 60px;
  }
  .coinwhy-wrapper .register-terms-container .register .register-title,
  .coinwhy-wrapper .social-register-container .register .register-title {
    font-size: 1.3rem;
    margin-bottom: 30px;
  }
}
.coinwhy-wrapper .social-register-container .register {
  margin-bottom: 20px;
}
.coinwhy-wrapper .social-register-container .register-form-container {
  margin-top: 0;
}
.coinwhy-wrapper .register-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.5);
  z-index: 2000;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
}
.coinwhy-wrapper .register-modal-overlay.active {
  opacity: 1;
  visibility: visible;
}
.coinwhy-wrapper .register-modal-overlay .register-modal {
  background: var(--c-surface);
  border-radius: 12px;
  max-width: 520px;
  width: 90vw;
  max-height: 80vh;
  overflow-y: overlay;
  box-shadow: 0 8px 32px var(--c-overlay-18, rgba(0, 0, 0, 0.18));
  padding: 0;
  position: relative;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px;
  padding-right: 16px;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-header .modal-title {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--c-text);
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-header .modal-close {
  color: var(--c-text-muted);
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-header .modal-close svg {
  width: 24px;
  height: 24px;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-content {
  max-height: 50vh;
  overflow-y: auto;
  padding: 24px;
  margin: 0 24px;
  font-size: 0.95rem;
  border-radius: 10px;
  line-height: 1.6;
  color: var(--c-text);
  background-color: var(--c-hover);
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-content table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-content table caption {
  font-weight: 600;
  margin-bottom: 10px;
  text-align: left;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-content table th,
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-content table td {
  padding: 12px;
  border: 1px solid var(--c-border);
  text-align: left;
  vertical-align: top;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-content table th {
  background: var(--c-hover);
  font-weight: 600;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-content table td {
  line-height: 1.5;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 24px;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-footer .btn-disagree {
  flex: 0 0 25%;
  height: 48px;
  background: var(--c-surface);
  color: var(--c-text-muted);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-footer .btn-disagree:hover {
  background: var(--c-hover);
  border-color: var(--c-border);
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-footer .btn-agree {
  flex: 0 0 70%;
  height: 48px;
  background: var(--c-primary);
  color: var(--c-on-primary);
  border: none;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}
.coinwhy-wrapper .register-modal-overlay .register-modal .modal-footer .btn-agree:hover {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.06);
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .register-modal-overlay .register-modal {
    width: 90vw;
    max-height: 85vh;
  }
  .coinwhy-wrapper .register-modal-overlay .register-modal .modal-header {
    padding: 16px;
    padding-right: 12px;
  }
  .coinwhy-wrapper .register-modal-overlay .register-modal .modal-header .modal-title {
    font-size: 1.1rem;
  }
  .coinwhy-wrapper .register-modal-overlay .register-modal .modal-header .modal-close svg {
    width: 20px;
    height: 20px;
  }
  .coinwhy-wrapper .register-modal-overlay .register-modal .modal-content {
    padding: 16px;
    font-size: 0.9rem;
  }
  .coinwhy-wrapper .register-modal-overlay .register-modal .modal-footer {
    padding: 16px;
    gap: 8px;
  }
  .coinwhy-wrapper .register-modal-overlay .register-modal .modal-footer .btn-disagree {
    font-size: 14px;
    height: 44px;
  }
  .coinwhy-wrapper .register-modal-overlay .register-modal .modal-footer .btn-agree {
    font-size: 15px;
    height: 44px;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .register-terms-container,
  .coinwhy-wrapper .social-register-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    background-color: var(--c-surface);
    max-width: 100%;
    min-height: 60vh;
  }
  .coinwhy-wrapper .register-terms-container .register,
  .coinwhy-wrapper .social-register-container .register {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 24px;
    padding-right: 24px;
    width: min(360px, 100%);
    margin: 0 auto;
    border-top: 0;
    border-bottom: 0;
    padding: 40px 20px;
    padding-bottom: 60px;
  }
  .coinwhy-wrapper .social-register-container .register {
    padding-bottom: 40px;
    position: relative;
  }
  .coinwhy-wrapper .social-register-container .register:after {
    content: "";
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 0;
    height: 0;
    border-bottom: 1px solid var(--c-border);
    pointer-events: none;
  }
}

.coinwhy-wrapper .register-form-container {
  max-width: 480px;
  margin: 80px auto 120px;
  padding: 0;
}
.coinwhy-wrapper .register-form-container .social-signup-section {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 32px 24px 24px 24px;
  margin-bottom: 16px;
  text-align: center;
}
.coinwhy-wrapper .register-form-container .social-signup-section h2 {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--c-text);
  margin-bottom: 20px;
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login {
  margin-bottom: 20px;
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register {
  background: var(--c-hover);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 20px;
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register h2 {
  font-size: 16px;
  font-weight: 500;
  color: var(--c-text);
  margin: 0 0 16px 0;
  text-align: left;
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register .sns-wrap {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register .sns-wrap .sns-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 6px;
  text-decoration: none;
  font-size: 0;
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register .sns-wrap .sns-icon .ico {
  width: 20px;
  height: 20px;
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register .sns-wrap .sns-icon .txt {
  display: none;
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register .sns-wrap .sns-icon.sns-naver {
  background: var(--c-brand-naver);
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register .sns-wrap .sns-icon.sns-kakao {
  background: var(--c-brand-kakao);
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register .sns-wrap .sns-icon.sns-google {
  background: var(--c-brand-google);
}
.coinwhy-wrapper .register-form-container .social-signup-section .social-login #sns_register .sns-wrap .sns-icon.sns-facebook {
  background: var(--c-brand-facebook);
}
.coinwhy-wrapper .register-form-container .social-signup-section .divider {
  position: relative;
  margin: 20px 0;
  text-align: center;
}
.coinwhy-wrapper .register-form-container .social-signup-section .divider::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--c-border);
}
.coinwhy-wrapper .register-form-container .social-signup-section .divider span {
  background: var(--c-surface);
  padding: 0 16px;
  color: var(--c-text-muted);
  font-size: 14px;
  position: relative;
  z-index: 1;
}
.coinwhy-wrapper .register-form-container .register-form {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 32px 24px 24px 24px;
}
.coinwhy-wrapper .register-form-container .register-form h2 {
  padding: 0;
  border-bottom: 0;
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--c-text);
  margin-bottom: 24px;
  text-align: center;
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 32px;
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-image-wrapper {
  position: relative;
  margin-bottom: 16px;
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-image-wrapper .profile-image {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--c-border);
  background: var(--c-hover);
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-image-wrapper .profile-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-image-wrapper .profile-image .profile-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-image-wrapper .profile-image-button {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 32px;
  height: 32px;
  background: var(--c-primary-600);
  border: 2px solid var(--c-surface);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  color: var(--c-on-primary);
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-image-wrapper .profile-image-button:hover {
  background: var(--c-primary-600);
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.08);
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-image-wrapper .profile-image-button svg {
  width: 16px;
  height: 16px;
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-actions .profile-delete-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-actions .profile-delete-wrapper input[type=checkbox] {
  width: 16px;
  height: 16px;
  cursor: pointer;
  appearance: auto;
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  accent-color: var(--c-primary);
}
.coinwhy-wrapper .register-form-container .register-form .profile-image-section .profile-actions .profile-delete-wrapper .profile-delete-text {
  font-size: 14px;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .register-form-container .register-form .input-group {
  margin-bottom: 20px;
}
.coinwhy-wrapper .register-form-container .register-form .input-group label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: var(--c-text);
  margin-bottom: 8px;
}
.coinwhy-wrapper .register-form-container .register-form .input-group .form-input {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  font-size: 15px;
  background: var(--c-surface);
}
.coinwhy-wrapper .register-form-container .register-form .input-group .form-input::placeholder {
  color: var(--c-text-muted);
  font-size: 14px;
}
.coinwhy-wrapper .register-form-container .register-form .input-group .form-input.error {
  border-color: var(--c-danger);
}
.coinwhy-wrapper .register-form-container .register-form .input-group .form-input.readonly, .coinwhy-wrapper .register-form-container .register-form .input-group .form-input[readonly] {
  background: var(--c-hover);
  color: var(--c-text-muted);
  cursor: not-allowed;
}
.coinwhy-wrapper .register-form-container .register-form .input-group .error-msg {
  display: block;
  font-size: 12px;
  color: var(--c-danger);
  margin-top: 6px;
  min-height: 16px;
}
.coinwhy-wrapper .register-form-container .register-form .input-group .email-notice {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--c-text-muted);
  margin-top: 6px;
}
.coinwhy-wrapper .register-form-container .register-form .input-group .email-notice .notice-icon {
  font-size: 14px;
}
.coinwhy-wrapper .register-form-container .register-form .cert-section {
  margin-bottom: 20px;
  padding: 20px;
  background: var(--c-hover);
  border: 1px solid var(--c-border);
  border-radius: 8px;
}
.coinwhy-wrapper .register-form-container .register-form .cert-section .cert-label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: var(--c-text);
  margin-bottom: 12px;
}
.coinwhy-wrapper .register-form-container .register-form .cert-section .cert-buttons {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .register-form-container .register-form .cert-section .cert-buttons .btn-cert {
  flex: 1;
  min-width: 120px;
  height: 40px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  color: var(--c-text);
  cursor: pointer;
}
.coinwhy-wrapper .register-form-container .register-form .cert-section .cert-required {
  font-size: 12px;
  color: var(--c-danger);
  font-weight: 500;
  margin-top: 8px;
}
.coinwhy-wrapper .register-form-container .register-form .cert-section .cert-complete {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: rgba(20, 211, 28, 0.1);
  border: 1px solid rgba(20, 211, 28, 0.3);
  border-radius: 6px;
  margin-top: 12px;
}
.coinwhy-wrapper .register-form-container .register-form .cert-section .cert-complete .check-icon {
  color: var(--c-success);
  font-weight: bold;
  font-size: 16px;
}
.coinwhy-wrapper .register-form-container .register-form .cert-section .cert-complete span {
  font-size: 13px;
  color: var(--c-success);
}
.coinwhy-wrapper .register-form-container .register-form .captcha-group {
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .register-form-container .register-form .notification-settings {
  margin-bottom: 10px;
}
.coinwhy-wrapper .register-form-container .register-form .notification-settings h3 {
  font-size: 14px;
  font-weight: 500;
  color: var(--c-text);
  margin-bottom: 12px;
}
.coinwhy-wrapper .register-form-container .register-form .notification-settings .checkbox-group {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}
.coinwhy-wrapper .register-form-container .register-form .notification-settings .checkbox-group:last-child {
  margin-bottom: 0;
}
.coinwhy-wrapper .register-form-container .register-form .notification-settings .checkbox-group input[type=checkbox] {
  width: 16px;
  height: 16px;
  cursor: pointer;
  margin-right: 8px;
  appearance: auto;
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
  background: white;
  border: 1px solid var(--c-border);
  outline: none;
  accent-color: var(--c-primary);
}
.coinwhy-wrapper .register-form-container .register-form .notification-settings .checkbox-group input[type=checkbox]:checked {
  background-color: var(--c-primary);
  border-color: var(--c-primary);
}
.coinwhy-wrapper .register-form-container .register-form .notification-settings .checkbox-group label {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 14px;
  color: var(--c-text);
  margin: 0;
}
.coinwhy-wrapper .register-form-container .register-form .btn-group {
  display: block;
  margin: 0;
}
.coinwhy-wrapper .register-form-container .register-form .btn-group .btn-submit {
  width: 100%;
  height: 52px;
  background: var(--c-primary-600);
  color: var(--c-on-primary);
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}
.coinwhy-wrapper .register-form-container .register-form .btn-group .btn-submit:disabled {
  background: var(--c-border);
  cursor: not-allowed;
}
.coinwhy-wrapper .register-form-container .register-form .btn-group .btn-submit:hover:not(:disabled) {
  background: var(--c-primary-600);
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.06);
}
.coinwhy-wrapper .register-form-container .register-form .btn-group .btn-cancel {
  display: none;
}
.coinwhy-wrapper .register-form-container .register-form .account-danger-link {
  margin-top: 20px;
  text-align: center;
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .register-form-container .register-form .account-danger-link a {
  text-decoration: underline;
  color: var(--c-text-muted);
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .register-form-container {
    margin: 40px auto 60px;
  }
  .coinwhy-wrapper .register-form-container .social-signup-section {
    padding: 20px 16px;
  }
  .coinwhy-wrapper .register-form-container .register-form {
    padding: 20px 16px;
  }
  .coinwhy-wrapper .register-form-container .register-form .cert-section {
    padding: 16px;
  }
  .coinwhy-wrapper .register-form-container .register-form .cert-section .cert-buttons {
    flex-direction: column;
  }
  .coinwhy-wrapper .register-form-container .register-form .cert-section .cert-buttons .btn-cert {
    min-width: auto;
  }
  .coinwhy-wrapper .register-form-container .register-form .input-group {
    margin-bottom: 16px;
  }
  .coinwhy-wrapper .register-form-container .register-form .input-group .form-input {
    height: 44px;
  }
  .coinwhy-wrapper .register-form-container .register-form .btn-group {
    display: block;
  }
  .coinwhy-wrapper .register-form-container .register-form .btn-group .btn-submit {
    width: 100%;
    height: 48px;
    font-size: 15px;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .register-form-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    background-color: var(--c-surface);
    max-width: 100%;
    min-height: 60vh;
  }
  .coinwhy-wrapper .register-form-container .register-form {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 24px;
    padding-right: 24px;
    width: min(360px, 100%);
    border-top: 0;
    border-bottom: 0;
    padding: 40px 20px;
    padding-bottom: 60px;
  }
}

.coinwhy-wrapper .register-email-container form[name=fregister_email] {
  max-width: 480px;
  margin: 80px auto 120px;
  padding: 32px 24px 24px 24px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  box-shadow: none;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] h2 {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--c-text);
  margin-bottom: 10px;
  text-align: center;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .rg_em_p {
  font-size: 14px;
  color: var(--c-text-muted);
  margin-bottom: 24px;
  line-height: 1.5;
  text-align: center;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em {
  margin-bottom: 24px;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table {
  width: 100%;
  border: none;
  border-collapse: collapse;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table caption {
  display: none;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr {
  display: block;
  margin-bottom: 20px;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr:last-child {
  margin-bottom: 0;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr th {
  display: block;
  background: none;
  padding: 0;
  border: none;
  text-align: left;
  margin-bottom: 8px;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr th.reg_mb_email_label {
  width: auto !important;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr th label {
  font-size: 14px;
  font-weight: 500;
  color: var(--c-text);
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr th .sound_only {
  display: none;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr td {
  display: block;
  padding: 0;
  border: none;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr td .frm_input {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  font-size: 15px;
  background: var(--c-surface);
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr td .frm_input::placeholder {
  color: var(--c-text-muted);
  font-size: 14px;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr td .frm_input.error {
  border-color: var(--c-danger);
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .tbl_frm01.tbl_frm.rg_em table tr td .captcha-group {
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .btn_confirm {
  display: flex;
  gap: 12px;
  margin-top: 24px;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .btn_confirm .btn_submit {
  flex: 1;
  height: 52px;
  background: var(--c-primary-600);
  color: var(--c-on-primary);
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .btn_confirm .btn_submit:hover {
  background: var(--c-primary-600);
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.06);
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .btn_confirm .btn_submit:disabled {
  background: var(--c-text-muted);
  cursor: not-allowed;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .btn_confirm .btn_cancel {
  flex: 0 0 120px;
  height: 52px;
  background: var(--c-surface);
  color: var(--c-text-muted);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .register-email-container form[name=fregister_email] .btn_confirm .btn_cancel:hover {
  background: var(--c-hover);
  border-color: var(--c-border);
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .register-email-container form[name=fregister_email] {
    margin: 40px auto 60px;
    padding: 20px 16px;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .register-email-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    background-color: var(--c-surface);
    max-width: 100%;
    min-height: 60vh;
  }
  .coinwhy-wrapper .register-email-container form[name=fregister_email] {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 24px;
    padding-right: 24px;
    width: min(360px, 100%);
    margin: 0 auto;
    border-top: 0;
    border-bottom: 0;
    padding: 40px 20px;
    padding-bottom: 60px;
  }
}

.coinwhy-wrapper .password-lost-container {
  max-width: 480px;
  margin: 80px auto 120px;
  padding: 0;
}
.coinwhy-wrapper .password-lost-container .password-lost-form {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 32px 24px 24px 24px;
  box-shadow: none;
}
.coinwhy-wrapper .password-lost-container .password-lost-form h2 {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--c-text);
  margin-bottom: 32px;
  text-align: center;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section h3 {
  font-size: 16px;
  font-weight: 600;
  color: var(--c-text);
  margin-bottom: 12px;
  text-align: center;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .find-description {
  font-size: 14px;
  color: var(--c-text-muted);
  line-height: 1.5;
  text-align: center;
  margin-bottom: 24px;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .input-group {
  margin-bottom: 24px;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .input-group label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: var(--c-text);
  margin-bottom: 8px;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .input-group .form-input {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  font-size: 15px;
  background: var(--c-surface);
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .input-group .form-input::placeholder {
  color: var(--c-text-muted);
  font-size: 14px;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .captcha-group {
  display: flex;
  justify-content: center;
  align-items: center;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .btn-group {
  margin-top: 24px;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .btn-group .btn-submit {
  width: 100%;
  height: 52px;
  background: var(--c-primary-600);
  color: var(--c-on-primary);
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .btn-group .btn-submit:hover {
  background: var(--c-primary-600);
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.06);
}
.coinwhy-wrapper .password-lost-container .password-lost-form .find-section .btn-group .btn-submit:disabled {
  background: var(--c-text-muted);
  cursor: not-allowed;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .divider {
  position: relative;
  margin: 32px 0;
  text-align: center;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .divider::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--c-border);
}
.coinwhy-wrapper .password-lost-container .password-lost-form .divider span {
  background: var(--c-surface);
  padding: 0 16px;
  color: var(--c-text-muted);
  font-size: 14px;
  position: relative;
  z-index: 1;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .cert-section h3 {
  font-size: 16px;
  font-weight: 600;
  color: var(--c-text);
  margin-bottom: 16px;
  text-align: center;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .cert-section .cert-buttons {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .cert-section .cert-buttons .btn-cert {
  flex: 1;
  min-width: 120px;
  height: 48px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--c-text);
  cursor: pointer;
}
.coinwhy-wrapper .password-lost-container .password-lost-form .cert-section .cert-buttons .btn-cert:hover {
  background: var(--c-hover);
  border-color: var(--c-border);
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .password-lost-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    background-color: var(--c-surface);
    max-width: 100%;
    min-height: 60vh;
  }
  .coinwhy-wrapper .password-lost-container .password-lost-form {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 24px;
    padding-right: 24px;
    width: min(360px, 100%);
    border-top: 0;
    border-bottom: 0;
    padding: 40px 20px;
    padding-bottom: 60px;
  }
}

.coinwhy-wrapper .social-register-container #fregisterform {
  width: 100%;
}
.coinwhy-wrapper .social-register-container #fregisterform .btn-group {
  margin-top: 30px;
}
.coinwhy-wrapper .social-register-section #sns_login {
  border: 0;
  margin-top: 0;
}
.coinwhy-wrapper .social-register-section #sns_login h3 {
  display: none;
}
.coinwhy-wrapper .social-register-section #sns_login .sns-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  margin-top: 0;
  justify-content: center;
}

.coinwhy-wrapper .register-result-container {
  max-width: 480px;
  margin: 80px auto 120px;
  padding: 0;
}
.coinwhy-wrapper .register-result-container .register-result {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 5px;
  padding: 40px 24px 32px 24px;
  box-shadow: none;
  text-align: center;
}
.coinwhy-wrapper .register-result-container .register-result .success-icon {
  font-size: 4rem;
  margin-bottom: 24px;
  line-height: 1;
}
.coinwhy-wrapper .register-result-container .register-result .success-message {
  margin-bottom: 32px;
}
.coinwhy-wrapper .register-result-container .register-result .success-message h1 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--c-text);
  margin-bottom: 12px;
  line-height: 1.4;
}
.coinwhy-wrapper .register-result-container .register-result .success-message p {
  font-size: 16px;
  color: var(--c-text-muted);
  margin: 0;
}
.coinwhy-wrapper .register-result-container .register-result .email-notice {
  background: rgba(66, 139, 202, 0.08);
  border: 1px solid rgba(66, 139, 202, 0.25);
  border-radius: 8px;
  padding: 24px 20px;
  margin-bottom: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 5px;
}
.coinwhy-wrapper .register-result-container .register-result .email-notice .notice-icon {
  font-size: 2rem;
  flex-shrink: 0;
}
.coinwhy-wrapper .register-result-container .register-result .email-notice .notice-content {
  flex: 1;
}
.coinwhy-wrapper .register-result-container .register-result .email-notice .notice-content h3 {
  font-size: 16px;
  font-weight: 600;
  color: var(--c-primary);
  margin-bottom: 8px;
}
.coinwhy-wrapper .register-result-container .register-result .email-notice .notice-content p {
  font-size: 14px;
  color: var(--c-text);
  line-height: 1.5;
  margin: 0;
}
.coinwhy-wrapper .register-result-container .register-result .member-info {
  background: var(--c-hover);
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 32px;
}
.coinwhy-wrapper .register-result-container .register-result .member-info .info-item {
  display: flex;
  align-items: flex-start;
  padding: 8px 0;
  gap: 15px;
  border-bottom: 1px solid var(--c-border);
}
.coinwhy-wrapper .register-result-container .register-result .member-info .info-item:first-child {
  padding-top: 0;
}
.coinwhy-wrapper .register-result-container .register-result .member-info .info-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.coinwhy-wrapper .register-result-container .register-result .member-info .info-item .info-label {
  font-size: 14px;
  color: var(--c-text-muted);
  font-weight: 500;
  white-space: nowrap;
  flex-shrink: 0;
}
.coinwhy-wrapper .register-result-container .register-result .member-info .info-item .info-value {
  font-size: 14px;
  color: var(--c-text);
  font-weight: 600;
  margin-left: auto;
  text-align: right;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.coinwhy-wrapper .register-result-container .register-result .btn-group .btn-main {
  display: inline-block;
  width: 100%;
  height: 52px;
  background: var(--c-primary-600);
  color: var(--c-on-primary);
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.coinwhy-wrapper .register-result-container .register-result .btn-group .btn-main:hover {
  background: var(--c-primary-600);
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.06);
  color: var(--c-on-primary);
  text-decoration: none;
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .register-result-container {
    margin: 40px auto 60px;
  }
  .coinwhy-wrapper .register-result-container .register-result {
    padding: 32px 20px 24px 20px;
  }
  .coinwhy-wrapper .register-result-container .register-result .success-icon {
    font-size: 3rem;
  }
  .coinwhy-wrapper .register-result-container .register-result .success-message h1 {
    font-size: 1.3rem;
  }
  .coinwhy-wrapper .register-result-container .register-result .email-notice {
    padding: 20px 16px;
  }
  .coinwhy-wrapper .register-result-container .register-result .email-notice .notice-content h3 {
    font-size: 15px;
  }
  .coinwhy-wrapper .register-result-container .register-result .member-info {
    padding: 16px;
  }
  .coinwhy-wrapper .register-result-container .register-result .btn-group .btn-main {
    height: 48px;
    font-size: 15px;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .register-result-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    background-color: var(--c-surface);
    max-width: 100%;
    min-height: 60vh;
  }
  .coinwhy-wrapper .register-result-container .register-result {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 24px;
    padding-right: 24px;
    width: min(360px, 100%);
    margin: 0 auto;
    border-top: 0;
    border-bottom: 0;
    padding: 40px 20px;
    padding-bottom: 60px;
  }
}

.coinwhy-wrapper .latest-cards {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  padding: 14px 16px;
  padding-bottom: 3px;
}
.coinwhy-wrapper .latest-cards .latest-header {
  margin-bottom: 10px;
}
.coinwhy-wrapper .latest-cards .latest-header .latest-title-link {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  color: inherit;
}
.coinwhy-wrapper .latest-cards .latest-header .latest-title-link:hover {
  color: var(--c-text);
}
.coinwhy-wrapper .latest-cards .latest-header .latest-title-link .latest-title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--c-text);
}
.coinwhy-wrapper .latest-cards .latest-header .latest-title-link .latest-title-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
}
.coinwhy-wrapper .latest-cards .latest-header .latest-title-link .latest-title-icon .title-chevron {
  display: inline-flex;
}
.coinwhy-wrapper .latest-cards .latest-header .latest-title-link .latest-title-icon svg {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .latest-cards .post-cards-container .post-meta {
  display: none !important;
}
.coinwhy-wrapper .latest-cards .empty-posts {
  text-align: center;
  padding: 12px;
  padding-top: 0;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .latest-cards .empty-posts .empty-icon {
  font-size: 2rem;
  opacity: 0.5;
}
.coinwhy-wrapper .latest-cards .empty-posts p {
  margin: 8px 0;
  font-size: 0.9rem;
}
.coinwhy-wrapper .latest-cards .empty-posts p a {
  color: var(--c-primary);
  text-decoration: none;
}
.coinwhy-wrapper .latest-cards .empty-posts p a:hover {
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .latest-cards {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
  }
}

.coinwhy-wrapper #container .guide-page-container {
  margin: 0 auto;
  padding: 24px 16px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 8px;
}
.coinwhy-wrapper #container .guide-page-container .guide-section {
  padding: 24px 0;
  margin-bottom: 24px;
  position: relative;
}
.coinwhy-wrapper #container .guide-page-container .guide-section:not(.disclaimer-section):not(.performance-section)::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 70%;
  height: 1px;
  background: var(--c-border);
}
.coinwhy-wrapper #container .guide-page-container .guide-section:last-child {
  margin-bottom: 0;
}
.coinwhy-wrapper #container .guide-page-container .guide-section .guide-title {
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--c-text);
  margin-bottom: 12px;
  line-height: 1.2;
  text-align: center;
}
.coinwhy-wrapper #container .guide-page-container .guide-section .guide-title .highlight-primary {
  color: var(--c-primary);
}
.coinwhy-wrapper #container .guide-page-container .guide-section .guide-subtitle {
  font-size: 1.1rem;
  color: var(--c-text-muted);
  margin-bottom: 16px;
  text-align: center;
}
.coinwhy-wrapper #container .guide-page-container .guide-section .guide-subtitle .mobile-break {
  display: none;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.intro-section {
  padding-top: 40px;
  padding-bottom: 40px;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.intro-section .feature-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: fit-content;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.intro-section .feature-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 0;
  color: var(--c-text);
}
.coinwhy-wrapper #container .guide-page-container .guide-section.intro-section .feature-list li .feature-check {
  flex-shrink: 0;
  color: var(--c-primary);
  width: 18px;
  height: 18px;
  display: block;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.intro-section .feature-list li span {
  display: inline-block;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .pc-note {
  font-size: 0.9rem;
  color: var(--c-primary);
  margin-top: 16px;
  text-align: center;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-image {
  margin-top: 12px;
  text-align: center;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-image img {
  max-width: 100%;
  height: auto;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list {
  list-style: none;
  padding: 0 6px;
  margin: 32px 0 0;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:first-child .feature-content, .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(2) .feature-content {
  transform: translateY(-3px);
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(3) .feature-content {
  transform: translateY(-2px);
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(4) .feature-content, .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(5) .feature-content, .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(6) .feature-content, .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(7) .feature-content {
  transform: translateY(-1px);
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  min-width: 22px;
  background: var(--c-primary);
  color: var(--c-on-primary);
  border-radius: 50%;
  font-weight: 600;
  font-size: 1rem;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content .feature-line {
  display: inline-block;
  line-height: 1.6;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content .badge {
  display: inline-block;
  padding: 0 6px;
  margin-right: 3px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.9rem;
  white-space: nowrap;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content .badge.badge-long {
  background: var(--c-long);
  color: var(--c-on-primary);
  border: 3px solid var(--c-long);
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content .badge.badge-short {
  background: var(--c-short);
  color: var(--c-on-primary);
  border: 3px solid var(--c-short);
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content .feature-text {
  color: var(--c-text);
  line-height: 1.6;
  font-size: 0.95rem;
  display: inline;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content .feature-text strong {
  font-weight: 600;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content .feature-image {
  margin: 8px 0;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content .feature-image img {
  max-width: 100%;
  height: auto;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.performance-section .performance-image {
  margin-top: 24px;
  text-align: center;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.performance-section .performance-image img {
  max-width: 100%;
  height: auto;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.disclaimer-section {
  text-align: center;
  padding-top: 16px;
  padding-bottom: 16px;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.disclaimer-section .live-chart-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  background: var(--c-surface);
  border: 1px solid var(--c-primary);
  border-radius: 24px;
  color: var(--c-primary);
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  margin-bottom: 20px;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.disclaimer-section .live-chart-btn svg {
  flex-shrink: 0;
  color: var(--c-primary);
}
.coinwhy-wrapper #container .guide-page-container .guide-section.disclaimer-section .live-chart-btn:hover {
  background: var(--c-primary);
  color: var(--c-on-primary);
}
.coinwhy-wrapper #container .guide-page-container .guide-section.disclaimer-section .live-chart-btn:hover svg {
  color: var(--c-on-primary);
}
.coinwhy-wrapper #container .guide-page-container .guide-section.disclaimer-section .disclaimer {
  font-size: 0.8rem;
  color: var(--c-text-muted);
  margin: 0;
  line-height: 1.6;
}
.coinwhy-wrapper #container .guide-page-container .guide-section.disclaimer-section .disclaimer .mobile-break {
  display: none;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper #container .guide-page-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    border-top: none;
    border-bottom: none;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section {
    padding: 20px 0;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section:not(.disclaimer-section):not(.performance-section)::after {
    width: 80%;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.intro-section {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.intro-section .feature-list li .feature-check {
    width: 16px;
    height: 16px;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list {
    margin-top: 24px;
    gap: 18px;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item {
    gap: 8px;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:first-child .feature-content, .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(2) .feature-content {
    transform: translateY(-2px);
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content {
    gap: 8px;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper #container .guide-page-container .guide-section {
    padding: 16px 0;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section:not(.disclaimer-section):not(.performance-section)::after {
    width: 90%;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section .guide-subtitle .mobile-break {
    display: block;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.intro-section {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.intro-section .feature-list li .feature-check {
    width: 14px;
    height: 14px;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list {
    margin-top: 20px;
    gap: 14px;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item {
    gap: 8px;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(3) .feature-content {
    transform: translateY(-1px);
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(4) .feature-content, .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(5) .feature-content, .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(6) .feature-content, .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item:nth-child(7) .feature-content {
    transform: translateY(0);
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.chart-section .chart-feature-list .chart-feature-item .feature-content {
    gap: 8px;
  }
  .coinwhy-wrapper #container .guide-page-container .guide-section.disclaimer-section .disclaimer .mobile-break {
    display: block;
  }
}

.coinwhy-wrapper .my-page-container .my-profile-card {
  margin-bottom: 12px;
}
.coinwhy-wrapper .my-page-container .my-profile-card .profile-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.coinwhy-wrapper .my-page-container .my-profile-card .profile-row .avatar img {
  border-radius: 50%;
  border: 1px solid var(--c-border);
  object-fit: cover;
}
.coinwhy-wrapper .my-page-container .my-profile-card .profile-row .nickname {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--c-text);
}
.coinwhy-wrapper .my-page-container .my-tabs {
  display: flex;
  align-items: center;
  margin: 0 auto 24px;
  padding: 4px;
  width: max-content;
  max-width: 100%;
  background: var(--c-hover);
  border-radius: 12px;
  overflow: hidden;
  gap: 4px;
}
.coinwhy-wrapper .my-page-container .my-tabs .tab-btn {
  background: transparent;
  border: 0;
  border-radius: 8px;
  padding: 12px 36px;
  color: var(--c-text-muted);
  font-weight: 600;
  line-height: 1;
}
.coinwhy-wrapper .my-page-container .my-tabs .tab-btn .count {
  margin-left: 4px;
  color: var(--c-primary);
}
.coinwhy-wrapper .my-page-container .my-tabs .tab-btn:hover {
  background: var(--c-hover);
  color: var(--c-text);
}
.coinwhy-wrapper .my-page-container .my-tabs .tab-btn.active {
  background: var(--c-surface);
  color: var(--c-text);
}
.coinwhy-wrapper .my-page-container .my-tab-content {
  position: relative;
}
.coinwhy-wrapper .my-page-container .my-tab-content .tab-panel {
  display: none;
  position: relative;
  min-height: 160px;
}
.coinwhy-wrapper .my-page-container .my-tab-content .tab-panel.active {
  display: block;
}
.coinwhy-wrapper .my-page-container .my-tab-content .empty {
  color: var(--c-text-muted);
  padding: 40px 20px;
  text-align: center;
}
.coinwhy-wrapper .my-page-container .my-tab-content .profile-tab-loading {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 8px;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .my-page-container .my-tab-content .profile-tab-loading .loading-spinner {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 3px solid var(--c-border);
  border-top-color: var(--c-primary);
  animation: spin 1s linear infinite;
}
.coinwhy-wrapper .my-page-container .my-tab-content .profile-tab-loading .loading-text {
  font-size: 0.9rem;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .my-page-container {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
    border-top: none;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .my-page-container .my-profile-card .profile-row {
    gap: 8px;
  }
  .coinwhy-wrapper .my-page-container .my-profile-card .profile-row .avatar img {
    width: 30px;
    height: 30px;
  }
  .coinwhy-wrapper .my-page-container .my-tabs {
    gap: 6px;
    margin-bottom: 10px;
  }
  .coinwhy-wrapper .my-page-container .my-tabs .tab-btn {
    padding: 6px 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
  }
  .coinwhy-wrapper .my-page-container .my-tabs .tab-btn .count {
    margin-left: 0;
  }
}

.coinwhy-wrapper .metrics-page {
  max-width: 1200px;
  margin: 0 auto 24px;
  padding: 16px 20px 24px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
}
.coinwhy-wrapper .metrics-page .metrics-page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-items: flex-end;
  margin-bottom: 20px;
}
.coinwhy-wrapper .metrics-page .metrics-page-header .metrics-page-title {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 700;
}
.coinwhy-wrapper .metrics-page .metrics-page-header .metrics-page-subtitle {
  margin: 6px 0 0;
  font-size: 0.9rem;
  line-height: 1.6;
}
.coinwhy-wrapper .metrics-page .metrics-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.coinwhy-wrapper .metrics-page .metrics-content .metrics-section {
  margin-bottom: 30px;
}
.coinwhy-wrapper .metrics-page .metrics-filter-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.coinwhy-wrapper .metrics-page .metrics-filter-bar .metrics-filter-group {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .metrics-page .metrics-filter-bar .metrics-filter-label {
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page .metrics-filter-bar .metrics-filter-chip {
  padding: 4px 10px;
  font-size: 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--c-border);
  background: var(--c-surface-subtle, transparent);
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page .metrics-filter-bar .metrics-filter-chip.is-active {
  border-color: var(--c-primary);
  background: rgba(var(--c-primary-rgb), 0.12);
  color: var(--c-primary);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page .metrics-table {
  width: 100%;
  font-size: 0.8rem;
}
.coinwhy-wrapper .metrics-page .metrics-table .metrics-table-header,
.coinwhy-wrapper .metrics-page .metrics-table .metrics-table-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
  gap: 8px;
  align-items: center;
}
.coinwhy-wrapper .metrics-page .metrics-table .metrics-table-header {
  padding-bottom: 6px;
  border-bottom: 1px solid var(--c-border-soft, var(--c-border));
  font-weight: 600;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page .metrics-table .metrics-table-body {
  margin-top: 4px;
}
.coinwhy-wrapper .metrics-page .metrics-table .metrics-table-row {
  padding: 6px 0;
}
.coinwhy-wrapper .metrics-page .metrics-skeleton-line {
  display: block;
  width: 100%;
  height: 10px;
  margin-bottom: 4px;
  border-radius: 4px;
  background: var(--c-hover);
}
.coinwhy-wrapper .metrics-page .metrics-skeleton-line--short {
  width: 40%;
}
.coinwhy-wrapper .metrics-page .metrics-skeleton-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 4px;
}
.coinwhy-wrapper .metrics-page .metrics-skeleton-table {
  margin-top: 4px;
}
.coinwhy-wrapper .metrics-page .metrics-skeleton-chart {
  width: 100%;
  height: 160px;
  border-radius: 6px;
  background: var(--c-hover);
}
.coinwhy-wrapper .metrics-page .metrics-link-more {
  color: var(--c-primary);
  text-decoration: none;
}
.coinwhy-wrapper .metrics-page .metrics-link-more:hover {
  text-decoration: underline;
}
.coinwhy-wrapper .metrics-page .metrics-info-text {
  font-size: 0.85rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-overview .metrics-content .metrics-grid.metrics-grid--overview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.coinwhy-wrapper .metrics-page.metrics-overview .metrics-widget-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  min-height: 120px;
}
.coinwhy-wrapper .metrics-page.metrics-overview .metrics-widget-card .metrics-widget-header {
  margin-bottom: 6px;
}
.coinwhy-wrapper .metrics-page.metrics-overview .metrics-widget-card .metrics-widget-header .metrics-widget-title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-overview .metrics-widget-card .metrics-widget-body {
  flex: 1 1 auto;
}
.coinwhy-wrapper .metrics-page.metrics-overview .metrics-widget-card .metrics-widget-body--compact {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}
.coinwhy-wrapper .metrics-page.metrics-overview .metrics-widget-card .metrics-widget-footer {
  margin-top: 8px;
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-overview .metrics-widget-card--span-2 {
  grid-column: span 2;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .metrics-page {
    border: none;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    padding: 16px 16px;
    border-top: none;
    margin-bottom: 20px;
  }
  .coinwhy-wrapper .metrics-page.metrics-overview .metrics-content .metrics-grid.metrics-grid--overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .coinwhy-wrapper .metrics-page.metrics-overview .metrics-widget-card--span-2 {
    grid-column: span 2;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .metrics-page .metrics-page-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .coinwhy-wrapper .metrics-page.metrics-overview .metrics-content .metrics-grid.metrics-grid--overview {
    grid-template-columns: minmax(0, 1fr);
  }
  .coinwhy-wrapper .metrics-page.metrics-overview .metrics-widget-card--span-2 {
    grid-column: auto;
  }
}

.coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-whale-summary .metrics-grid.metrics-grid--whale-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-section {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 12px 14px;
}
.coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-widget-card {
  background: var(--c-surface-subtle, transparent);
  border: none;
  padding: 0;
}
.coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale {
  font-size: 0.8rem;
}
.coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header,
.coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row {
  display: grid;
  grid-template-columns: 2.2fr 1fr 0.9fr 1.3fr 1.4fr 1.2fr 1.2fr 1.2fr;
  gap: 8px;
  align-items: center;
}
.coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header {
  padding-bottom: 6px;
  border-bottom: 1px solid var(--c-border-soft, var(--c-border));
  font-weight: 600;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row {
  padding: 6px 0;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-whale-summary .metrics-grid.metrics-grid--whale-summary {
    grid-template-columns: minmax(0, 1fr);
  }
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-section {
    margin-left: 0;
    margin-right: 0;
  }
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row {
    grid-template-columns: 1.8fr 1fr 0.9fr 1.3fr 1.3fr 1.2fr;
  }
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header .col.col-entry,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header .col.col-close,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row .col.col-entry,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row .col.col-close {
    display: none;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row {
    grid-template-columns: 1.8fr 1fr 0.9fr 1.3fr;
  }
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header .col.col-size,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header .col.col-unrealized,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header .col.col-entry,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-header .col.col-close,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row .col.col-size,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row .col.col-unrealized,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row .col.col-entry,
  .coinwhy-wrapper .metrics-page.metrics-whale-positions .metrics-table.metrics-table--whale .metrics-table-row .col.col-close {
    display: none;
  }
}

.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-filter-section {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 10px 14px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-filter-section .metrics-filter-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-filter-section .metrics-filter-bar .metrics-filter-group {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-filter-section .metrics-filter-bar .metrics-filter-label {
  font-size: 0.9rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-filter-section .metrics-filter-bar .metrics-filter-chip {
  padding: 4px 10px;
  font-size: 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--c-border);
  background: var(--c-surface-subtle, transparent);
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-filter-section .metrics-filter-bar .metrics-filter-chip.is-active {
  border-color: var(--c-primary);
  background: rgba(var(--c-primary-rgb), 0.12);
  color: var(--c-primary);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts {
  background: var(--c-surface);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-accounts-header {
  margin-bottom: 10px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-accounts-header .metrics-section-title {
  font-size: 1.1rem;
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-accounts-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-widget-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  column-gap: 10px;
  row-gap: 6px;
  margin-bottom: 6px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-widget-heading {
  display: flex;
  flex-direction: column;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-widget-heading .metrics-widget-title {
  font-size: 1rem;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-widget-heading .metrics-widget-subtitle {
  margin-top: 2px;
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-lsr-ratio-text {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-lsr-ratio-text.is-long {
  color: var(--c-metrics-long-2);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-lsr-ratio-text.is-short {
  color: var(--c-metrics-short-2);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-lsr-controls--inline {
  gap: 6px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-lsr-controls--inline .metrics-lsr-control {
  font-size: 0.9rem;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-card .metrics-widget-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-values-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
  font-size: 0.9rem;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-values-row .metrics-lsr-value {
  white-space: nowrap;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-values-row .metrics-lsr-value--long {
  color: var(--c-metrics-long);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-values-row .metrics-lsr-value--short {
  color: var(--c-metrics-short);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-values-row .metrics-lsr-value--ratio {
  font-weight: 600;
  color: var(--c-text-strong, var(--c-text));
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar {
  position: relative;
  width: 100%;
  height: 35px;
  border-radius: 0;
  overflow: hidden;
  background: transparent;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar .metrics-lsr-bar-inner {
  position: absolute;
  inset: 0;
  display: flex;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar .metrics-lsr-seg {
  height: 100%;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar .metrics-lsr-seg--long {
  background: linear-gradient(90deg, var(--c-metrics-long) 0%, #7AD28F 55%, #a6ebce 100%);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar .metrics-lsr-seg--short {
  background: linear-gradient(90deg, #a6ebce 0%, #F5B7BE 45%, var(--c-metrics-short) 100%);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar .metrics-lsr-bar-label {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
  font-size: 0.9rem;
  font-weight: 600;
  color: #000;
  text-shadow: none;
  pointer-events: none;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar .metrics-lsr-bar-label--long {
  left: 8px;
  text-align: left;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar .metrics-lsr-bar-label--short {
  right: 8px;
  text-align: right;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar-delta {
  font-size: 0.78rem;
  font-weight: 400;
  opacity: 0.95;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-updated {
  display: none;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges {
  background: var(--c-surface);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-lsr-exchanges-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  column-gap: 12px;
  row-gap: 6px;
  margin-bottom: 10px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-lsr-exchanges-header .metrics-lsr-exchanges-heading {
  flex: 1 1 auto;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-lsr-exchanges-header .metrics-lsr-controls {
  margin-left: 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-lsr-exchanges-header .metrics-section-title {
  font-size: 1.1rem;
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-lsr-exchanges-header .metrics-section-subtitle {
  margin-top: 2px;
  font-size: 0.88rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange {
  font-size: 0.9rem;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-table-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .col {
  min-width: 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .col-rank {
  font-size: 0.9rem;
  color: var(--c-text-muted);
  flex: 0 0 1rem;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .col-exchange {
  flex: 0 0 8.5rem;
  min-width: 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .col-bar {
  flex: 1 1 0;
  min-width: 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-meta {
  display: flex;
  align-items: center;
  gap: 6px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-logo-wrap {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-logo-wrap img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-name {
  font-weight: 700;
  white-space: nowrap;
  font-size: 0.95rem;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-bar {
  position: relative;
  width: 100%;
  height: 32px;
  border-radius: 0;
  overflow: hidden;
  background: transparent;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-bar .inner {
  position: absolute;
  inset: 0;
  display: flex;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-bar .seg-long {
  background: linear-gradient(90deg, #0ecb81 0%, #63dab0 55%, #a6ebce 100%);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-bar .seg-short {
  background: linear-gradient(90deg, #a6ebce 0%, #f7a4b5 45%, #f6465d 100%);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-label {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.9rem;
  color: #000;
  white-space: nowrap;
  pointer-events: none;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-label--long {
  left: 25%;
  text-align: center;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-label--short {
  left: 75%;
  text-align: center;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .col-amounts {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  white-space: nowrap;
  flex: 0 0 18rem;
  min-width: 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-amount {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  font-size: 0.9rem;
  flex: 1 1 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-amount .metrics-lsr-exchange-amount-label {
  font-weight: 400;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-amount .metrics-lsr-exchange-amount-value {
  font-weight: 400;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-amount .metrics-lsr-exchange-amount-value.is-up {
  color: var(--c-metrics-long-2);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-amount .metrics-lsr-exchange-amount-value.is-down {
  color: var(--c-metrics-short-2);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-amount--long .metrics-lsr-exchange-amount-value {
  color: var(--c-metrics-long-2);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-amount--short .metrics-lsr-exchange-amount-value {
  color: var(--c-metrics-short-2);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-skeleton-row .col .metrics-skeleton-line {
  width: 100%;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-skeleton-row .col-amounts .metrics-skeleton-line {
  max-width: 100%;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-skeleton-row .metrics-lsr-exchange-bar {
  background: var(--c-skeleton-bg, rgba(120, 120, 130, 0.12));
  border-color: transparent;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-control {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.9rem;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-control .metrics-lsr-control-label {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-select {
  min-width: 70px;
  padding: 6px 24px 6px 10px;
  font-size: 0.9rem;
  border-radius: 6px;
  border: 1px solid var(--c-border-soft, var(--c-border));
  background-color: var(--c-surface-subtle, var(--c-surface));
  color: var(--c-text);
  line-height: 1.3;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-select:focus {
  outline: none;
  border-color: var(--c-primary);
  box-shadow: 0 0 0 1px rgba(var(--c-primary-rgb), 0.35);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-select::-ms-expand {
  display: none;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-control--select .metrics-lsr-select-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-control--select .metrics-lsr-select-label {
  display: inline-block;
  white-space: nowrap;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-control--select .metrics-lsr-select-icon {
  position: absolute;
  right: 6px;
  pointer-events: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-control--select .metrics-lsr-select-icon .metrics-lsr-select-chevron {
  display: block;
  transition: transform 0.16s ease;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-select.is-open + .metrics-lsr-select-icon .metrics-lsr-select-chevron {
  transform: rotate(180deg);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-select-modal {
  position: fixed;
  z-index: 81;
  background: var(--c-surface);
  border-radius: 10px;
  border: 1px solid var(--c-border-soft, var(--c-border));
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.18);
  padding: 4px 0;
  min-width: 0;
  max-height: 260px;
  overflow-y: auto;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-4px) scale(0.98);
  transform-origin: top left;
  transition: opacity 0.16s ease, transform 0.16s ease;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-select-modal.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-select-modal-list {
  padding: 2px 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-select-option {
  width: 100%;
  padding: 7px 14px;
  font-size: 0.95rem;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--c-text);
  cursor: pointer;
  white-space: nowrap;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-select-option:hover {
  background: var(--c-surface-subtle, rgba(148, 163, 184, 0.12));
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-select-option.is-active {
  background: rgba(var(--c-primary-rgb), 0.14);
  color: var(--c-primary);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-longshort-faq:not(:first-of-type) {
  margin-top: 8px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-longshort-faq .metrics-section-title {
  font-size: 1.05rem;
  font-weight: 600;
  margin-bottom: 8px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-longshort-faq p {
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-longshort-faq p:not(:last-child) {
  margin-bottom: 8px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-longshort-faq p strong {
  color: var(--c-text);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-longshort-faq p a {
  color: var(--c-primary);
  text-underline-offset: 0.08em;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-longshort-faq p a:hover, .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-longshort-faq p a:focus-visible {
  color: var(--c-primary);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history {
  margin-top: 10px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history .metrics-lsr-history-chart {
  width: 100%;
  height: 150px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history .metrics-lsr-history-chart svg {
  width: 100%;
  height: 100%;
  display: block;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip {
  position: fixed;
  z-index: 90;
  pointer-events: none;
  background: var(--c-surface);
  color: var(--c-text);
  font-family: "Roboto", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  border-radius: 8px;
  border: 1px solid var(--c-border-soft, var(--c-border));
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.2);
  padding: 8px 10px;
  font-size: 0.8rem;
  line-height: 1.4;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.12s ease, transform 0.12s ease;
  min-width: 170px;
  max-width: 220px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip-time {
  font-size: 0.8rem;
  font-weight: 600;
  margin-bottom: 4px;
  white-space: nowrap;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 0.8rem;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip-row:not(:last-child) {
  margin-bottom: 2px;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip-label {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip-value {
  white-space: nowrap;
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip-row--long .metrics-lsr-history-tooltip-dot {
  background-color: var(--c-metrics-long);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip-row--short .metrics-lsr-history-tooltip-dot {
  background-color: var(--c-metrics-short);
}
.coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-history-tooltip-row--ratio .metrics-lsr-history-tooltip-dot {
  background-color: #000;
}
@media screen and (max-width: 1024px) {
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .col-amounts {
    flex: 0 0 16rem;
  }
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .col-amounts {
    flex: 0 0 14rem;
  }
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-filter-section {
    margin-left: 0;
    margin-right: 0;
  }
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-accounts-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-accounts .metrics-lsr-bar {
    height: 32px;
  }
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-lsr-exchange-bar {
    height: 30px;
  }
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .metrics-table-row {
    padding: 4px 0;
  }
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .col-amounts {
    display: none;
  }
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-controls .metrics-lsr-select {
    min-width: 60px;
  }
}
@media screen and (max-width: 480px) {
  .coinwhy-wrapper .metrics-page.metrics-long-short-ratio .metrics-lsr-exchanges .metrics-table.metrics-table--lsr-exchange .col-exchange {
    flex: 0 0 7.5rem;
  }
}

.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-tabs {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  flex-wrap: nowrap;
  padding: 3px;
  border-radius: 12px;
  border: 1px solid var(--c-border-soft, var(--c-border));
  background: var(--c-surface-subtle, rgba(148, 163, 184, 0.12));
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-tab {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--c-text-muted);
  font-size: 0.9rem;
  font-weight: 600;
  padding: 5px 12px;
  border-radius: 9px;
  cursor: pointer;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-tab.is-active {
  background: var(--c-surface);
  color: var(--c-text);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-search-input {
  width: 150px;
  max-width: 70vw;
  padding: 8px 10px;
  font-size: 0.9rem;
  border-radius: 10px;
  border: 1px solid var(--c-border-soft, var(--c-border));
  background: var(--c-surface);
  color: var(--c-text);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-search-input:focus {
  outline: none;
  border-color: var(--c-primary);
  box-shadow: 0 0 0 2px rgba(var(--c-primary-rgb), 0.25);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-btn {
  padding: 8px 12px;
  font-size: 0.9rem;
  border-radius: 10px;
  border: 1px solid var(--c-border-soft, var(--c-border));
  background: var(--c-surface-subtle, transparent);
  color: var(--c-text-muted);
  cursor: pointer;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-btn.is-active {
  border-color: var(--c-primary);
  background: rgba(var(--c-primary-rgb), 0.12);
  color: var(--c-primary);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-btn--ghost {
  background: transparent;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-btn--icon {
  padding: 0;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-btn--icon svg {
  width: 18px;
  height: 18px;
  display: block;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-btn--icon.is-active {
  border-color: #f5c542;
  background: rgba(245, 197, 66, 0.14);
  color: #f5c542;
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-table-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-updated {
  font-size: 0.85rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-table-scroll {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  cursor: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--c-scrollbar-thumb) transparent;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-table-scroll::-webkit-scrollbar {
  height: 6px;
  width: 6px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-table-scroll::-webkit-scrollbar-thumb {
  background-color: var(--c-scrollbar-thumb);
  border-radius: 999px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-table-scroll::-webkit-scrollbar-track {
  background: transparent;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-table-scroll.is-dragging {
  cursor: grabbing;
  user-select: none;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-heatmap {
  min-width: 1175px;
  width: max-content;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-size: 0.9rem;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table col.metrics-funding-col--symbol {
  width: 130px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table col.metrics-funding-col--exchange {
  width: 95px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--c-surface);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table th,
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table td {
  padding: 12px 10px;
  border-bottom: 1px solid var(--c-border-soft, var(--c-border));
  text-align: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  box-sizing: border-box;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .is-sticky-col {
  position: sticky;
  left: 0;
  z-index: 3;
  background: var(--c-surface);
  text-align: left;
  width: 130px;
  min-width: 130px;
  max-width: 130px;
  box-sizing: border-box;
  overflow: hidden;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-exchange {
  width: 95px;
  min-width: 95px;
  max-width: 95px;
  box-sizing: border-box;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-exchange-icon {
  width: 18px;
  height: 18px;
  display: inline-block;
  object-fit: contain;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-exchange-meta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-exchange-name {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--c-text-muted);
  max-width: 56px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-exchange-placeholder {
  font-size: 0.8rem;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-symbol-cell {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 100%;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-star {
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 0 2px 0 0;
  line-height: 1;
  color: var(--c-text-muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-star svg {
  width: 18px;
  height: 18px;
  display: block;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-star.is-on {
  color: #f5c542;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-star:hover, .coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-star:focus-visible {
  color: #f5c542;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-symbol {
  font-weight: 700;
  color: var(--c-text);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  flex: 1 1 auto;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-symbol-icon {
  width: 18px;
  height: 18px;
  display: inline-block;
  object-fit: contain;
  margin: 0 8px 0 2px;
  vertical-align: -3px;
  flex: 0 0 auto;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-symbol-icon-fallback {
  width: 18px;
  height: 18px;
  margin: 0 8px 0 2px;
  vertical-align: -3px;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-symbol-icon-fallback svg {
  width: 18px;
  height: 18px;
  display: block;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table td.is-sticky-col .metrics-funding-symbol-icon,
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table td.is-sticky-col .metrics-funding-symbol-icon-fallback {
  margin: 0;
  vertical-align: baseline;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-cell {
  width: 95px;
  min-width: 95px;
  max-width: 95px;
  box-sizing: border-box;
  position: relative;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-cell.is-empty {
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-cell.is-long {
  color: var(--c-metrics-long-2);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-cell.is-short {
  color: var(--c-metrics-short-2);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-cell.is-zero {
  color: var(--c-text-muted);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-cell-value {
  display: inline-block;
  width: 100%;
  font-weight: 600;
  transition: color 0.2s ease;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-cell-value.is-up {
  color: var(--c-metrics-long-2);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-cell-value.is-down {
  color: var(--c-metrics-short-2);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-interval-badge {
  position: absolute;
  top: 3px;
  right: 1px;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 1px solid var(--c-primary);
  background: transparent;
  color: var(--c-primary);
  font-size: 11px;
  line-height: 0.8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
  cursor: pointer;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-tooltip {
  position: fixed;
  z-index: 9999;
  width: max-content;
  max-width: min(320px, 100vw - 32px);
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--c-bg);
  color: var(--c-text);
  border: 1px solid var(--c-border);
  font-size: 0.85rem;
  line-height: 1.4;
  transform: translateX(var(--cw-fr-tip-shift-x, 0px));
  pointer-events: none;
  box-shadow: 0 4px 12px var(--c-overlay-12);
  word-break: keep-all;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-tooltip-line1 {
  font-weight: 700;
  margin-bottom: 4px;
  font-size: 0.9rem;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-tooltip-line2 {
  color: var(--c-text-muted);
  font-size: 0.78rem;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-empty {
  margin-top: 10px;
  font-size: 0.9rem;
  color: var(--c-text-muted);
  text-align: center;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-footer {
  display: flex;
  justify-content: center;
  margin-top: 12px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-more {
  padding: 8px 14px;
  font-size: 0.9rem;
  border-radius: 10px;
  border: 1px solid var(--c-border-soft, var(--c-border));
  background: var(--c-surface);
  color: var(--c-text);
  cursor: pointer;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-more:hover {
  border-color: var(--c-primary);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-faq:not(:first-of-type) {
  margin-top: 8px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-faq .metrics-section-title {
  font-size: 1.05rem;
  font-weight: 600;
  margin-bottom: 8px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-faq p {
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--c-text-muted);
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-faq p:not(:last-child) {
  margin-bottom: 8px;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-faq p strong {
  color: var(--c-text);
  font-weight: 600;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-faq p a {
  color: var(--c-primary);
  text-underline-offset: 0.08em;
}
.coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-faq p a:hover, .coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-faq p a:focus-visible {
  color: var(--c-primary);
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-search-input {
    width: 100%;
    max-width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table th,
  .coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table td {
    padding: 10px 8px;
  }
  .coinwhy-wrapper .metrics-page.metrics-funding-rates .metrics-funding-table .metrics-funding-exchange-icon {
    width: 16px;
    height: 16px;
  }
}

.coinwhy-wrapper .metrics-page.metrics-liquidations .metrics-section {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 12px 14px;
}
.coinwhy-wrapper .metrics-page.metrics-liquidations .metrics-filter-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.coinwhy-wrapper .metrics-page.metrics-liquidations .metrics-main-panel {
  margin-top: 10px;
}
.coinwhy-wrapper .metrics-page.metrics-liquidations .metrics-main-panel .metrics-main-chart {
  margin-bottom: 12px;
}
.coinwhy-wrapper .metrics-page.metrics-liquidations .metrics-extra-info {
  margin-top: 6px;
  background: var(--c-surface-subtle, transparent);
  border-radius: 10px;
  padding: 8px 2px;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .metrics-page.metrics-liquidations .metrics-section {
    margin-left: 0;
    margin-right: 0;
  }
}

.coinwhy-wrapper .metrics-page.metrics-exchange-reserves .metrics-section {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 12px 14px;
}
.coinwhy-wrapper .metrics-page.metrics-exchange-reserves .metrics-main-panel {
  margin-top: 10px;
}
.coinwhy-wrapper .metrics-page.metrics-exchange-reserves .metrics-main-panel .metrics-main-chart {
  margin-bottom: 12px;
}
.coinwhy-wrapper .metrics-page.metrics-exchange-reserves .metrics-main-panel .metrics-main-chart .metrics-skeleton-chart {
  height: 220px;
}
.coinwhy-wrapper .metrics-page.metrics-exchange-reserves .metrics-extra-info {
  margin-top: 6px;
  background: var(--c-surface-subtle, transparent);
  border-radius: 10px;
  padding: 8px 2px;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .metrics-page.metrics-exchange-reserves .metrics-section {
    margin-left: 0;
    margin-right: 0;
  }
}

.coinwhy-wrapper .metrics-page.metrics-futures-exchange-rankings .metrics-section {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 12px 14px;
}
.coinwhy-wrapper .metrics-page.metrics-futures-exchange-rankings .metrics-main-panel {
  margin-top: 10px;
}
.coinwhy-wrapper .metrics-page.metrics-futures-exchange-rankings .metrics-extra-info {
  margin-top: 6px;
  background: var(--c-surface-subtle, transparent);
  border-radius: 10px;
  padding: 8px 2px;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .metrics-page.metrics-futures-exchange-rankings .metrics-section {
    margin-left: 0;
    margin-right: 0;
  }
}

.coinwhy-wrapper .metrics-page.metrics-gainers-losers .metrics-section {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  padding: 12px 14px;
}
.coinwhy-wrapper .metrics-page.metrics-gainers-losers .metrics-main-panel {
  margin-top: 10px;
}
.coinwhy-wrapper .metrics-page.metrics-gainers-losers .metrics-extra-info {
  margin-top: 6px;
  background: var(--c-surface-subtle, transparent);
  border-radius: 10px;
  padding: 8px 2px;
}
@media screen and (max-width: 768px) {
  .coinwhy-wrapper .metrics-page.metrics-gainers-losers .metrics-section {
    margin-left: 0;
    margin-right: 0;
  }
}

/*# sourceMappingURL=style.css.map */
