/* Community board + floating chat. Kept separate so the visual design can be changed later. */
:root {
  --cv-community-bg:#111820; --cv-community-panel:#151c25; --cv-community-card:#121820;
  --cv-community-border:#2b3643; --cv-community-text:#e7edf4; --cv-community-muted:#8996a6;
  --cv-community-accent:#5aa2ff; --cv-community-danger:#ff6b6b; --cv-community-input:#0d141b;
}
body.light-mode { --cv-community-bg:#f4f6f8; --cv-community-panel:#ffffff; --cv-community-card:#ffffff; --cv-community-border:#d7dce3; --cv-community-text:#18212b; --cv-community-muted:#66717f; --cv-community-accent:#1769d1; --cv-community-danger:#c62828; --cv-community-input:#f7f8fa; }
#home-board-summary { margin:0 0 14px; border:1px solid var(--cv-community-border); border-radius:10px; overflow:visible; background:var(--cv-community-panel); }
.home-headline-row { width:100%; display:grid; grid-template-columns:36px 1fr; gap:10px; align-items:center; min-height:42px; padding:9px 12px; border:0; border-bottom:1px solid var(--cv-community-border); background:transparent; color:var(--cv-community-text); text-align:left; cursor:pointer; }
.home-headline-row:last-child{border-bottom:0}.home-headline-row:hover{background:rgba(128,150,180,.08)}.home-headline-rank{font-size:12px;color:var(--cv-community-muted);text-align:center}.home-headline-title{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.home-headline-row.notice .home-headline-title{font-weight:700}
#board-section{display:none}.#board-section{} #board-section.cv-board-visible{display:block}
.cv-board-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.cv-board-head h2,.cv-board-stream-head h3{margin:0;color:var(--cv-community-text)}.cv-board-head-actions,.cv-inline-actions,.cv-post-actions,.cv-comment-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.cv-board-stream-head{margin:15px 0 9px}.cv-post-card,.cv-detail-card{background:var(--cv-community-card);border:1px solid var(--cv-community-border);border-radius:12px;padding:14px;margin-bottom:10px}.cv-post-title-btn{display:block;width:100%;border:0;background:transparent;color:var(--cv-community-text);font-size:17px;font-weight:700;text-align:left;cursor:pointer;padding:0;margin-bottom:8px}.cv-post-title-btn:hover{color:var(--cv-community-accent)}.cv-post-preview,.cv-detail-body{color:var(--cv-community-text);opacity:.88;line-height:1.6;white-space:normal}.cv-post-meta,.cv-comment-meta{font-size:12px;color:var(--cv-community-muted)}.cv-action-btn,.cv-primary-btn{border:1px solid var(--cv-community-border);border-radius:8px;padding:7px 10px;background:var(--cv-community-panel);color:var(--cv-community-text);cursor:pointer}.cv-primary-btn{background:var(--cv-community-accent);color:#fff;border-color:var(--cv-community-accent)}.cv-action-btn:hover{filter:brightness(1.07)}.cv-action-btn.active{border-color:var(--cv-community-accent)}.cv-action-btn.danger{color:var(--cv-community-danger)}
.cv-write-panel{margin:10px 0;padding:12px;border:1px solid var(--cv-community-border);border-radius:10px;background:var(--cv-community-panel)}.cv-write-panel[hidden]{display:none}.cv-write-panel input,.cv-write-panel textarea,#home-comment-input{width:100%;box-sizing:border-box;margin:0 0 9px;padding:10px;border:1px solid var(--cv-community-border);border-radius:8px;background:var(--cv-community-input);color:var(--cv-community-text);font:inherit}.cv-status{min-height:18px;font-size:13px}.cv-status.success{color:#2e9d6a}.cv-status.error,.cv-error{color:var(--cv-community-danger)}.cv-loading,.cv-empty{padding:18px;color:var(--cv-community-muted);text-align:center}.cv-comment{padding:11px 0;border-bottom:1px solid var(--cv-community-border)}.cv-comment:last-child{border-bottom:0}.cv-comment-body{margin-top:5px;line-height:1.5;color:var(--cv-community-text)}
.cv-share-wrap{position:relative}.cv-share-menu{display:none;position:absolute;right:0;top:calc(100% + 6px);z-index:2000;min-width:190px;padding:6px;border:1px solid var(--cv-community-border);border-radius:9px;background:var(--cv-community-panel);box-shadow:0 10px 28px rgba(0,0,0,.25)}.cv-share-menu.open{display:block}.cv-share-menu button{display:block;width:100%;border:0;border-radius:7px;padding:9px;background:transparent;color:var(--cv-community-text);text-align:left;cursor:pointer}.cv-share-menu button:hover{background:rgba(128,150,180,.1)}
.board-focus-mode #charts-section,.board-focus-mode #market-section,.board-focus-mode #home-board-summary{display:none!important}.board-focus-mode #promo-space{margin-bottom:12px}.board-focus-mode main{max-width:none}
#floating-chat{z-index:10000}#chat-header{position:relative}.#floating-chat{} #floating-chat [hidden]{display:none!important}.cv-chat-tools{display:flex;gap:5px;align-items:center}.cv-chat-tool-btn,.cv-chat-setting-btn{border:0;background:transparent;color:inherit;cursor:pointer;padding:4px 6px;border-radius:6px}.cv-chat-tool-btn:hover,.cv-chat-setting-btn:hover{background:rgba(128,150,180,.15)}.cv-chat-settings{display:none;padding:9px;border-bottom:1px solid var(--cv-community-border);background:var(--cv-community-panel);color:var(--cv-community-text);font-size:12px}.cv-chat-settings.open{display:block}.cv-chat-setting-title{font-weight:700;margin-bottom:8px}.cv-chat-setting-group{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;margin-bottom:8px}.cv-chat-skin-list{display:flex;gap:5px;flex-wrap:wrap}.cv-chat-skin-option{border:1px solid var(--cv-community-border);border-radius:7px;padding:4px 7px;background:transparent;color:inherit;cursor:pointer}.cv-chat-skin-option.active{border-color:var(--cv-community-accent)}.cv-chat-sound{display:flex;gap:5px;align-items:center}.cv-chat-reply-preview{padding:6px 9px;background:rgba(90,162,255,.10);border-top:1px solid var(--cv-community-border);font-size:12px}.cv-chat-reply-preview button{float:right;border:0;background:transparent;color:inherit;cursor:pointer}.cv-chat-emoji-panel{display:flex;gap:4px;flex-wrap:wrap;padding:7px;border-top:1px solid var(--cv-community-border);background:var(--cv-community-panel)}.cv-chat-emoji-panel button{border:0;background:transparent;font-size:19px;cursor:pointer;padding:3px}.cv-chat-unread{position:absolute;right:8px;top:8px;min-width:18px;height:18px;line-height:18px;padding:0 5px;border-radius:99px;background:#ef4444;color:#fff;font-size:11px;text-align:center}
#floating-chat[data-chat-skin="telegram"] #chat-messages{background:linear-gradient(180deg,#0e1620,#101820)}#floating-chat[data-chat-skin="kakao"] #chat-messages{background:#b2c7da}#floating-chat[data-chat-skin="normal"] #chat-messages{background:var(--cv-community-bg)}.cv-chat-msg{max-width:86%;padding:7px 9px;margin:6px 8px;border-radius:10px;background:var(--cv-community-panel);color:var(--cv-community-text);box-shadow:0 1px 2px rgba(0,0,0,.12);cursor:pointer}.cv-chat-msg.mine{margin-left:auto}.cv-chat-msg .cv-chat-meta{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:var(--cv-community-muted);margin-bottom:2px}.cv-chat-text{font-size:13px;line-height:1.45}.cv-chat-image{display:block;max-width:min(260px,100%);max-height:220px;border-radius:8px}.cv-chat-reply-ref{font-size:11px;color:var(--cv-community-accent);padding-left:5px;border-left:3px solid var(--cv-community-accent);margin-bottom:4px}.cv-chat-system{padding:8px;text-align:center;color:var(--cv-community-muted);font-size:11px}.cv-chat-system.error{color:var(--cv-community-danger)}
@media(max-width:700px){.cv-board-head{align-items:flex-start;flex-direction:column}.cv-board-head-actions{width:100%}.cv-board-head-actions .cv-action-btn{flex:1}.cv-post-actions .cv-action-btn{font-size:12px;padding:6px 8px}}

.cv-chat-compose{display:flex;gap:4px;align-items:center;padding:6px;background:var(--cv-community-panel);border-top:1px solid var(--cv-community-border)}.cv-chat-compose input{flex:1;min-width:0;margin:0;border:1px solid var(--cv-community-border);border-radius:7px;padding:8px;background:var(--cv-community-input);color:var(--cv-community-text)}.cv-chat-compose button[type=submit]{border:1px solid var(--cv-community-accent);border-radius:7px;padding:7px 10px;background:var(--cv-community-accent);color:#fff;cursor:pointer}
.cv-edit-comment{width:100%;box-sizing:border-box;min-height:90px;padding:9px;border:1px solid var(--cv-community-border);border-radius:8px;background:var(--cv-community-input);color:var(--cv-community-text);font:inherit;margin-top:6px}

/* =========================================================
   ChartView Trade board / floating chat refinements
   ========================================================= */
/* Skin variables are scoped to the floating chat so its entire window changes. */
#floating-chat[data-chat-skin="telegram"] {
  --cv-community-bg:#0e1620;
  --cv-community-panel:#172532;
  --cv-community-card:#182b3a;
  --cv-community-border:#26384a;
  --cv-community-text:#e8f1f8;
  --cv-community-muted:#9bb0c1;
  --cv-community-input:#0f1a24;
  --cv-community-accent:#2a9df4;
}
#floating-chat[data-chat-skin="kakao"] {
  --cv-community-bg:#b2c7d9;
  --cv-community-panel:#f6f6f6;
  --cv-community-card:#ffffff;
  --cv-community-border:#95aabd;
  --cv-community-text:#222222;
  --cv-community-muted:#6d7881;
  --cv-community-input:#ffffff;
  --cv-community-accent:#3b7ddd;
}
#floating-chat[data-chat-skin="normal"] {
  --cv-community-bg:#111820;
  --cv-community-panel:#151c25;
  --cv-community-card:#121820;
  --cv-community-border:#2b3643;
  --cv-community-text:#e7edf4;
  --cv-community-muted:#8996a6;
  --cv-community-input:#0d141b;
  --cv-community-accent:#5aa2ff;
}
body.light-mode #floating-chat[data-chat-skin="normal"] {
  --cv-community-bg:#f4f6f8;
  --cv-community-panel:#ffffff;
  --cv-community-card:#ffffff;
  --cv-community-border:#d7dce3;
  --cv-community-text:#18212b;
  --cv-community-muted:#66717f;
  --cv-community-input:#f7f8fa;
  --cv-community-accent:#1769d1;
}

main #board-section {
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

#home-board-featured {
  margin: 0 0 14px;
  border: 1px solid var(--cv-community-border);
  border-radius: 10px;
  overflow: hidden;
  background: var(--cv-community-panel);
}

.cv-board-subtitle {
  padding: 10px 12px;
  font-size: 13px;
  font-weight: 700;
  color: var(--cv-community-muted);
  border-bottom: 1px solid var(--cv-community-border);
}

.cv-featured-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  width: 100%;
  min-height: 42px;
  padding: 9px 12px;
  border: 0;
  border-bottom: 1px solid var(--cv-community-border);
  background: transparent;
  color: var(--cv-community-text);
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.cv-featured-row:last-child { border-bottom: 0; }
.cv-featured-row:hover { background: rgba(128,150,180,.08); }
.cv-featured-rank { color: var(--cv-community-muted); text-align: center; }
.cv-featured-row > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv-featured-row.notice > span:last-child { font-weight: 700; }

#home-board-summary[hidden] { display: none !important; }

.board-focus-mode #charts-section,
.board-focus-mode #home-board-summary,
.board-focus-mode #market-section,
.board-focus-mode .seo-info {
  display: none !important;
}

.board-focus-mode #board-section.cv-board-visible {
  width: 100%;
  max-width: 1440px;
}

/* The board stays the same width as the main chart content. */
#board-section .cv-board-head,
#board-section .cv-board-head-actions,
#board-section .cv-post-card,
#board-section .cv-detail-card,
#board-section #home-board-featured,
#board-section #home-board-stream {
  width: 100%;
  max-width: 100%;
}

/* Floating chat: window, header, settings, messages and composer are skin-aware. */
#floating-chat {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  background: var(--cv-community-panel);
  color: var(--cv-community-text);
  border: 1px solid var(--cv-community-border);
}

#floating-chat #chat-header {
  flex: 0 0 auto;
  min-height: 38px;
  background: var(--cv-community-panel);
  color: var(--cv-community-text);
  border-bottom: 1px solid var(--cv-community-border);
}

#floating-chat #chat-box {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  background: var(--cv-community-bg);
}

#floating-chat #chat-messages {
  flex: 1 1 auto;
  min-height: 0;
  height: auto !important;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 8px 0 6px;
}

#floating-chat #chat-form {
  flex: 0 0 auto;
  margin: 0;
  position: relative;
  z-index: 12;
  background: var(--cv-community-panel);
  border-top: 1px solid var(--cv-community-border);
}

#floating-chat .cv-chat-compose {
  min-height: 48px;
  position: relative;
  flex-shrink: 0;
}

/* Image URL panel sits just above the composer. */
#chat-image-panel {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 54px;
  z-index: 30;
  padding: 9px;
  border: 1px solid var(--cv-community-border);
  border-radius: 10px;
  background: var(--cv-community-panel);
  box-shadow: 0 12px 30px rgba(0,0,0,.28);
}
#chat-image-panel[hidden] { display: none !important; }
#chat-image-panel .chat-image-row { display: flex; gap: 6px; align-items: center; }
#chat-image-panel input { flex: 1; min-width: 0; border: 1px solid var(--cv-community-border); border-radius: 7px; padding: 8px; background: var(--cv-community-input); color: var(--cv-community-text); }
#chat-image-panel button { border: 1px solid var(--cv-community-border); border-radius: 7px; padding: 7px 9px; background: transparent; color: var(--cv-community-text); cursor: pointer; }

/* Entire floating window changes with the selected skin. */
#floating-chat[data-chat-skin="telegram"] {
  background: #0e1620;
  color: #e8f1f8;
  border-color: #26384a;
}
#floating-chat[data-chat-skin="telegram"] #chat-header,
#floating-chat[data-chat-skin="telegram"] #chat-settings-panel,
#floating-chat[data-chat-skin="telegram"] #chat-form,
#floating-chat[data-chat-skin="telegram"] .cv-chat-compose,
#floating-chat[data-chat-skin="telegram"] .cv-chat-emoji-panel,
#floating-chat[data-chat-skin="telegram"] .cv-chat-reply-preview {
  background: #172532;
  color: #e8f1f8;
}
#floating-chat[data-chat-skin="telegram"] .cv-chat-msg { background: #182b3a; color: #e8f1f8; border-radius: 9px; }
#floating-chat[data-chat-skin="telegram"] .cv-chat-msg.mine { background: #245a7d; }
#floating-chat[data-chat-skin="telegram"] #chat-input { background: #0f1a24; color: #e8f1f8; border-color: #2d465a; }

#floating-chat[data-chat-skin="kakao"] {
  background: #b2c7d9;
  color: #202020;
  border-color: #95aabd;
}
#floating-chat[data-chat-skin="kakao"] #chat-header,
#floating-chat[data-chat-skin="kakao"] #chat-settings-panel,
#floating-chat[data-chat-skin="kakao"] #chat-form,
#floating-chat[data-chat-skin="kakao"] .cv-chat-compose,
#floating-chat[data-chat-skin="kakao"] .cv-chat-emoji-panel,
#floating-chat[data-chat-skin="kakao"] .cv-chat-reply-preview {
  background: #f6f6f6;
  color: #222;
}
#floating-chat[data-chat-skin="kakao"] #chat-messages { background: #b2c7d9; }
#floating-chat[data-chat-skin="kakao"] .cv-chat-msg { background: #ffffff; color: #222; border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
#floating-chat[data-chat-skin="kakao"] .cv-chat-msg.mine { background: #ffe812; }
#floating-chat[data-chat-skin="kakao"] #chat-input { background: #fff; color: #222; border-color: #d4d4d4; }

#floating-chat[data-chat-skin="normal"] {
  background: var(--cv-community-panel);
  color: var(--cv-community-text);
  border-color: var(--cv-community-border);
}
#floating-chat[data-chat-skin="normal"] #chat-header,
#floating-chat[data-chat-skin="normal"] #chat-settings-panel,
#floating-chat[data-chat-skin="normal"] #chat-form,
#floating-chat[data-chat-skin="normal"] .cv-chat-compose,
#floating-chat[data-chat-skin="normal"] .cv-chat-emoji-panel,
#floating-chat[data-chat-skin="normal"] .cv-chat-reply-preview {
  background: var(--cv-community-panel);
  color: var(--cv-community-text);
}
#floating-chat[data-chat-skin="normal"] .cv-chat-msg { background: var(--cv-community-card); color: var(--cv-community-text); }

#chat-settings-panel,
#chat-image-panel,
#chat-emoji-panel,
#chat-reply-preview,
#chat-form,
#chat-messages {
  box-sizing: border-box;
}

@media (max-width: 700px) {
  #board-section .cv-board-head-actions .cv-action-btn { flex: 1 1 auto; }
  #chat-image-panel .chat-image-row { flex-wrap: wrap; }
  #chat-image-panel input { flex-basis: 100%; }
}

/* ===== Final unified board width ===== */
.board-focus-mode main #board-section.cv-board-visible {
  width: 100%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

#home-board-featured[hidden] { display: none !important; }

@media (max-width: 1440px) {
  main #board-section,
  #board-section.cv-board-visible,
  .board-focus-mode main #board-section.cv-board-visible {
    width: 100%;
    max-width: 100%;
  }
}


/* Main layout alignment: chart, ad, board and news share one container */
main { width:min(100% - 32px, 1440px); margin-left:auto; margin-right:auto; }
#charts-section, #promo-space, #home-board-summary, #board-section, #market-section { width:100%; max-width:1440px; margin-left:auto; margin-right:auto; }
#charts-section, #promo-space, #home-board-summary, #board-section, #market-section { margin-bottom:18px; }
#promo-space { min-height:50px; }
#board-section.cv-board-visible { display:block; }
.board-focus-mode main { width:min(100% - 32px,1440px); max-width:1440px; margin-left:auto; margin-right:auto; }
.board-focus-mode #promo-space { width:100%; max-width:1440px; margin-top:18px; margin-bottom:18px; }
.board-focus-mode #board-section { width:100%; max-width:1440px; margin-top:18px; margin-bottom:18px; }
@media(max-width:700px){ main,.board-focus-mode main{width:calc(100% - 20px);} #charts-section,#promo-space,#home-board-summary,#board-section,#market-section{margin-bottom:12px;} }

#chat-notice-area{flex:0 0 auto;background:var(--cv-community-panel);color:var(--cv-community-text);border-bottom:1px solid var(--cv-community-border);padding:3px 8px}#chat-notice-area[hidden]{display:none!important}.cv-chat-notice-line{font-size:11px;line-height:1.35;padding:3px 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}


/* =========================================================
   Final mobile/global layout correction
   - Mobile order must remain: Brand > Board > Auth > Settings > Theme
   - Advertisement must remain visible on mobile and board focus mode
   - All main sections share the same responsive width
   ========================================================= */
#top-menu-bar{
  display:flex !important;
  align-items:center !important;
  flex-wrap:nowrap !important;
  width:100%;
}
#top-menu-brand{order:1 !important; flex:0 1 auto !important; min-width:0 !important;}
#top-menu-spacer{order:2 !important; display:block !important; flex:1 1 auto !important; min-width:12px !important;}
#top-menu-items{order:3 !important; flex:0 0 auto !important; width:auto !important; min-width:max-content !important;}
#top-menu-controls{order:4 !important; flex:0 0 auto !important; min-width:max-content !important; display:flex !important; align-items:center !important;}
#auth-box{display:flex !important; align-items:center !important; flex:0 0 auto !important;}
#global-settings-wrap{flex:0 0 auto !important; position:relative !important;}
#theme-toggle-btn{flex:0 0 auto !important;}

main{width:min(calc(100% - 32px),1440px) !important; max-width:1440px !important; margin-left:auto !important; margin-right:auto !important;}
#charts-section,#promo-space,#home-board-summary,#board-section,#market-section{
  width:100% !important;
  max-width:1440px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
#promo-space{
  display:flex !important;
  visibility:visible !important;
  min-height:50px !important;
  height:50px;
  margin-top:18px !important;
  margin-bottom:18px !important;
}
.board-focus-mode #promo-space{
  display:flex !important;
  visibility:visible !important;
  width:100% !important;
  max-width:1440px !important;
  margin-top:18px !important;
  margin-bottom:18px !important;
}
.board-focus-mode main{
  width:min(calc(100% - 32px),1440px) !important;
  max-width:1440px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

@media (max-width:700px){
  #top-menu-bar{
    height:50px !important;
    min-height:50px !important;
    padding:0 6px !important;
    gap:3px !important;
  }
  #top-menu-brand a{
    font-size:clamp(11px,3vw,14px) !important;
    white-space:nowrap !important;
  }
  #top-menu-spacer{
    min-width:2px !important;
    flex:1 1 4px !important;
  }
  #top-menu-items > button,
  #top-menu-controls button,
  #global-settings-btn{
    min-width:0 !important;
    min-height:28px !important;
    padding:4px 6px !important;
    font-size:10px !important;
    white-space:nowrap !important;
  }
  #auth-user-nickname{max-width:68px !important;}
  #theme-toggle-btn,#global-settings-btn{width:28px !important; min-width:28px !important; padding:4px !important;}
  main,.board-focus-mode main{width:calc(100% - 20px) !important; max-width:none !important;}
  #charts-section,#promo-space,#home-board-summary,#board-section,#market-section{width:100% !important; max-width:none !important;}
  #promo-space,.board-focus-mode #promo-space{display:flex !important; min-height:50px !important; height:50px !important; margin-top:12px !important; margin-bottom:12px !important;}
}

@media (max-width:420px){
  #top-menu-bar{gap:2px !important; padding:0 4px !important;}
  #top-menu-brand a{font-size:10px !important;}
  #top-menu-items > button,
  #top-menu-controls button,
  #global-settings-btn{font-size:9px !important; padding:3px 4px !important; min-height:26px !important;}
  #auth-user-nickname{max-width:54px !important;}
  #theme-toggle-btn,#global-settings-btn{width:26px !important; min-width:26px !important;}
}
