:root {
  --bg: #090b10;
  --bg-soft: #11141c;
  --panel: rgba(27, 30, 40, .92);
  --panel-strong: rgba(34, 38, 50, .94);
  --panel-soft: rgba(255,255,255,.045);
  --line: rgba(255,255,255,.095);
  --line-strong: rgba(255,255,255,.16);
  --text: #f2f5ff;
  --muted: #929bb1;
  --muted2: #6f778b;
  --green: #54f078;
  --green-soft: rgba(84,240,120,.14);
  --red: #ff5f73;
  --red-soft: rgba(255,95,115,.14);
  --blue: #6aa2ff;
  --blue-soft: rgba(106,162,255,.18);
  --purple: #8f75ff;
  --shadow: 0 18px 50px rgba(0,0,0,.34);
}

* { box-sizing: border-box; }

html,
body { min-height: 100%; }

body {
  margin: 0;
  color: var(--text);
  background: var(--bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans KR", sans-serif;
  font-size: 15px;
}

button,
input,
select { font: inherit; }

button { color: inherit; }

h1,
h2,
h3,
p { margin: 0; }

.page-bg {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 7% 16%, rgba(51, 150, 86, .23), transparent 29rem),
    radial-gradient(circle at 78% 20%, rgba(73, 89, 150, .14), transparent 34rem),
    linear-gradient(180deg, rgba(255,255,255,.018), transparent 20rem);
}

.good { color: var(--green); }
.bad { color: var(--red); }
.blue { color: var(--blue); }
.muted { color: var(--muted); }

.panel {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 19px 18px 11px;
}

.panel-head h2 {
  font-size: 17px;
  letter-spacing: -.02em;
}

.hint {
  color: var(--muted);
  font-size: 12px;
}

.pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 24px;
  padding: 4px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.dot {
  width: 7px;
  height: 7px;
  border-radius: 99px;
  background: var(--purple);
}

.dot.green {
  background: var(--green);
  box-shadow: 0 0 10px rgba(84,240,120,.6);
}

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(255,255,255,.28);
}
::-webkit-scrollbar-track { background: transparent; }

body {
  font-size: 15.5px !important;
}

.panel-head h2 {
  font-size: 18px !important;
}

.hint {
  font-size: 12.5px !important;
}

.pill {
  font-size: 12.5px !important;
}





body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(
      900px 900px at 4% 28%,
      rgba(52, 122, 92, .16) 0%,
      rgba(52, 122, 92, .10) 20%,
      rgba(52, 122, 92, .05) 38%,
      rgba(52, 122, 92, .018) 54%,
      rgba(52, 122, 92, 0) 72%
    );
  filter: blur(26px);
  opacity: .92;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(4, 12, 14, .14) 0%, rgba(4, 12, 14, .04) 12%, rgba(4, 12, 14, 0) 22%);
}





body {
  position: relative;
  overflow-x: hidden;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    linear-gradient(
      135deg,
      rgba(70, 150, 108, .072) 0%,
      rgba(70, 150, 108, .052) 8%,
      rgba(70, 150, 108, .028) 15%,
      rgba(70, 150, 108, .012) 22%,
      rgba(70, 150, 108, 0) 34%
    ),
    radial-gradient(
      1400px 900px at -18% -16%,
      rgba(70, 150, 108, .060) 0%,
      rgba(70, 150, 108, .034) 18%,
      rgba(70, 150, 108, .015) 34%,
      rgba(70, 150, 108, .006) 48%,
      rgba(70, 150, 108, 0) 62%
    );
  filter: blur(38px);
  opacity: .72;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    linear-gradient(
      180deg,
      rgba(0, 0, 0, .08) 0%,
      rgba(0, 0, 0, .03) 18%,
      rgba(0, 0, 0, 0) 36%
    );
}



html, body {
  background: #06080d !important;
}

body {
  overflow-x: hidden;
}

body::before,
body::after {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
  filter: none !important;
}



html,
body {
  background: #06080d !important;
}

.page-bg {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  background: none !important;
  background-image: none !important;
  filter: none !important;
}

body::before,
body::after {
  content: none !important;
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  background: none !important;
  background-image: none !important;
  filter: none !important;
}

.app-shell {
  position: relative;
  z-index: 1;
}

/* notice/help public pages - single source of truth */
.public-notice-page,
.public-help-page{
  width:min(1520px, calc(100vw - 96px));
  max-width:min(1520px, calc(100vw - 96px));
  min-width:0;
  box-sizing:border-box;
  padding:28px;
  border-radius:24px;
  overflow:hidden;
}

.public-notice-head,
.public-help-head{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:18px;
}

.public-notice-head h2,
.public-help-head h2{
  margin:0;
  font-size:24px;
  color:#f6f8ff;
}

.public-notice-head p,
.public-help-head p{
  margin:0;
  color:rgba(235,241,255,.68);
}

.public-notice-list,
.public-help-list{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  display:grid;
  gap:14px;
}

.public-notice-list{
  grid-template-columns:1fr;
}

.public-help-list{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.public-notice-item,
.public-help-item,
.public-notice-empty,
.public-help-empty{
  width:100%;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(255,255,255,.035);
  padding:18px;
}

.public-notice-title,
.public-help-title{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
  margin-bottom:10px;
  min-width:0;
}

.public-notice-title strong,
.public-help-title strong{
  color:#f6f8ff;
  font-size:18px;
}

.public-notice-title span,
.public-help-title span{
  display:inline-flex;
  padding:3px 7px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:rgba(235,241,255,.72);
  font-size:11px;
  font-weight:900;
}

.public-notice-body,
.public-help-body{
  color:rgba(235,241,255,.75);
  line-height:1.65;
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.public-notice-date{
  margin-top:18px;
  color:rgba(210,220,245,.68);
  font-size:13px;
}

.public-notice-empty,
.public-help-empty{
  text-align:center;
  color:rgba(235,241,255,.58);
}

.public-help-empty{
  grid-column:1/-1;
}

@media(max-width:1200px){
  .public-notice-page,
  .public-help-page{
    width:calc(100vw - 96px);
    max-width:calc(100vw - 96px);
  }
}

@media(max-width:760px){
  .public-notice-page,
  .public-help-page{
    width:calc(100vw - 32px);
    max-width:calc(100vw - 32px);
    padding:20px;
  }

  .public-help-list{
    grid-template-columns:1fr;
  }
}

/* streamer request page */
.streamer-request-layout{
  display:block;
}

.streamer-request-page{
  width:min(1520px, calc(100vw - 96px));
  max-width:min(1520px, calc(100vw - 96px));
  box-sizing:border-box;
  padding:28px;
  border-radius:24px;
}

.streamer-request-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}

.streamer-request-head h2{
  margin:0;
  color:#f6f8ff;
  font-size:24px;
}

.streamer-request-head p{
  margin:4px 0 0;
  color:rgba(235,241,255,.68);
}

.streamer-request-card{
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  background:rgba(255,255,255,.035);
  padding:20px;
  margin-top:16px;
}

.streamer-request-card h3{
  margin:0 0 14px;
  color:#f6f8ff;
  font-size:21px;
}

.streamer-request-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.streamer-request-form input{
  width:100%;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(10,14,22,.72);
  color:#f6f8ff;
  padding:14px 16px;
  outline:none;
}

.streamer-request-form input::placeholder{
  color:rgba(235,241,255,.38);
}

.streamer-request-form button{
  align-self:flex-start;
  border:0;
  border-radius:14px;
  background:rgba(255,255,255,.06);
  color:#f6f8ff;
  padding:12px 18px;
  font-weight:900;
  cursor:pointer;
}

.streamer-request-form button:hover{
  background:rgba(255,255,255,.10);
}

.streamer-request-form button:disabled{
  cursor:not-allowed;
  opacity:.55;
}

.streamer-request-form p{
  margin:8px 0 0;
  color:rgba(235,241,255,.58);
  font-size:13px;
}

.streamer-request-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.streamer-request-empty{
  color:rgba(235,241,255,.62);
  padding:14px 0;
}

.streamer-request-row{
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(255,255,255,.035);
  padding:16px;
}

.streamer-request-row-title{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}

.streamer-request-row-title strong{
  color:#f6f8ff;
  font-size:17px;
}

.streamer-request-status{
  display:inline-flex;
  padding:4px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:rgba(235,241,255,.74);
  font-size:12px;
  font-weight:900;
}

.streamer-request-status.good{
  background:rgba(81,242,115,.14);
  color:#8dffa5;
}

.streamer-request-status.bad{
  background:rgba(255,91,124,.14);
  color:#ff8fa7;
}

.streamer-request-status.wait{
  background:rgba(108,153,255,.14);
  color:#9fbaff;
}

.streamer-request-row-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:8px;
  color:rgba(235,241,255,.58);
  font-size:13px;
}

.streamer-request-message{
  margin:10px 0 0;
  color:rgba(235,241,255,.72);
  line-height:1.55;
}

.streamer-request-message.admin{
  color:rgba(160,185,255,.82);
}

@media(max-width:900px){
  .streamer-request-page{
    width:calc(100vw - 32px);
    max-width:calc(100vw - 32px);
    padding:20px;
  }
}

/* public inquiry page */
.inquiry-layout{
  display:block;
}

.inquiry-page{
  width:min(1520px, calc(100vw - 96px));
  max-width:min(1520px, calc(100vw - 96px));
  box-sizing:border-box;
  padding:28px;
  border-radius:24px;
}

.inquiry-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}

.inquiry-head h2{
  margin:0;
  color:#f6f8ff;
  font-size:24px;
}

.inquiry-head p{
  margin:4px 0 0;
  color:rgba(235,241,255,.68);
}

.inquiry-card{
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  background:rgba(255,255,255,.035);
  padding:20px;
  margin-top:16px;
}

.inquiry-card h3{
  margin:0 0 14px;
  color:#f6f8ff;
  font-size:21px;
}

.inquiry-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.inquiry-form label{
  display:flex;
  flex-direction:column;
  gap:7px;
  color:rgba(235,241,255,.76);
  font-size:12px;
  font-weight:900;
}

.inquiry-form input,
.inquiry-form select,
.inquiry-form textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(10,14,22,.72);
  color:#f6f8ff;
  padding:13px 15px;
  outline:none;
  resize:vertical;
}

.inquiry-form input::placeholder,
.inquiry-form textarea::placeholder{
  color:rgba(235,241,255,.38);
}

.inquiry-form button{
  align-self:flex-start;
  border:0;
  border-radius:14px;
  background:rgba(255,255,255,.06);
  color:#f6f8ff;
  padding:12px 18px;
  font-weight:900;
  cursor:pointer;
}

.inquiry-form button:hover{
  background:rgba(255,255,255,.10);
}

.inquiry-form button:disabled{
  cursor:not-allowed;
  opacity:.55;
}

.inquiry-empty{
  color:rgba(235,241,255,.62);
  padding:14px 0;
}



























@media(max-width:900px){
  .inquiry-page{
    width:calc(100vw - 32px);
    max-width:calc(100vw - 32px);
    padding:20px;
  }
}

/* Market platform pills */
.platform-pill.chzzk {
  background: rgba(0, 200, 83, 0.12);
  border-color: rgba(0, 200, 83, 0.32);
  color: #00994a;
}

.platform-pill.youtube {
  background: rgba(255, 0, 0, 0.10);
  border-color: rgba(255, 0, 0, 0.30);
  color: #d71920;
}


.chart-hover-tooltip,
.chart-hover-xlabel {
  white-space: nowrap;
  word-break: keep-all;
  width: max-content;
  max-width: none;
}


.chart-average-line {
  position: absolute;
  left: 0;
  right: 0;
  border-top: 2px dashed rgba(96, 165, 250, 0.95);
  pointer-events: none;
  z-index: 5;
}
