/* 맨즈벳 — 공지/규정 · 이벤트 화면
   기존 디자인 CSS 는 건드리지 않고 .ess-sheet / .ess-notice-* 클래스만 추가한다.

   톤: 스포츠 보드와 동일 (다크네이비 + 골드)
     패널 #0c1117 → #06090d / 테두리 #3a2f1d
     골드 #f7dda6(밝음) · #f1c978(기본) · #805315(진함)

   이 파일은 ess/shell.php 에서만 로드된다. 구버전 /renewal/index.php 는
   이 파일을 포함하지 않으므로(확인함) 여기서 값을 바꿔도 구버전은 영향이 없다. */

.ess-sheet{display:none;position:fixed;inset:0;z-index:200000;box-sizing:border-box}
.ess-sheet.is-open{display:block}
.ess-sheet__backdrop{position:absolute;inset:0;background:rgba(3,5,8,.82)}

.ess-sheet__box{
  position:relative;z-index:1;display:flex;flex-direction:column;
  width:min(880px,calc(100% - 32px));max-height:calc(100dvh - 80px);
  margin:40px auto;box-sizing:border-box;overflow:hidden;
  background:linear-gradient(180deg,#0c1117,#06090d);
  border:1px solid #3a2f1d;border-radius:12px;
  box-shadow:0 22px 70px #000c,inset 0 1px 0 #ffffff08;
  font-family:'Malgun Gothic','맑은 고딕',sans-serif;color:#f6efe2;
}

.ess-sheet__head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px 13px;border-bottom:1px solid #1e1a11;
  background:linear-gradient(180deg,#121820,#0a0e13);
}
.ess-sheet__ttl{font-size:16px;font-weight:900;color:#f1c978;letter-spacing:.04em}
.ess-sheet__close{
  display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  padding:0;border:1px solid #2f2a1c;border-radius:7px;background:#0a0e13;
  color:#a99a78;font-size:15px;line-height:1;cursor:pointer;
  transition:border-color .14s,color .14s,background .14s;
}
.ess-sheet__close:hover{border-color:#c39b52;background:#121820;color:#f1c978}

.ess-sheet__tabs{display:flex;gap:6px;padding:12px 20px 0}
.ess-sheet__tab{
  display:inline-block;padding:8px 16px;border:1px solid #2f2a1c;border-radius:7px;
  background:#0a0e13;color:#cbb98f;font-size:12px;font-weight:800;line-height:1.2;
  text-decoration:none;transition:border-color .14s,color .14s,background .14s;
}
.ess-sheet__tab:hover{border-color:#c39b52;background:#121820;color:#f1c978}
.ess-sheet__tab.is-on{
  border-color:#f7dda6;
  background:linear-gradient(180deg,#f1c978,#805315);
  color:#1a1002;font-weight:900;
  box-shadow:0 4px 14px #f1c97826;
}

.ess-sheet__body{padding:16px 20px 22px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.ess-sheet__body::-webkit-scrollbar{width:8px}
.ess-sheet__body::-webkit-scrollbar-track{background:#080b0f}
.ess-sheet__body::-webkit-scrollbar-thumb{background:#2f2a1c;border-radius:999px}
.ess-sheet__body::-webkit-scrollbar-thumb:hover{background:#3a2f1d}

/* 빈 목록 / 로딩 / 오류 */
.ess-sheet__state{
  padding:34px 12px;border:1px dashed #2f2a1c;border-radius:8px;
  background:#080b0f;color:#7d6d4d;font-size:13px;font-weight:700;text-align:center;
}

/* 목록 */
.ess-notice-list{list-style:none;margin:0;padding:0;border-top:1px solid #1e1a11}
.ess-notice-list li{border-bottom:1px solid #1e1a11}
.ess-notice-list li:last-child{border-bottom:0}
.ess-notice-list__item{
  display:flex;align-items:center;gap:12px;padding:13px 6px;
  text-decoration:none;color:#f6efe2;
  border-left:3px solid transparent;
  transition:background .14s,border-color .14s;
}
.ess-notice-list__item:hover{background:#121820;border-left-color:#c39b52}
.ess-notice-list__ttl{flex:1 1 auto;min-width:0;font-size:13px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ess-notice-list__date{flex:0 0 auto;font-size:11px;font-weight:700;color:#8d7a55;font-variant-numeric:tabular-nums}

/* 상세 */
.ess-notice-view{padding:2px 0}
.ess-notice-view__ttl{
  margin:0 0 8px;padding-bottom:10px;
  border-bottom:1px solid #1e1a11;
  font-size:16px;font-weight:900;line-height:1.45;color:#f1c978;word-break:keep-all;
}
.ess-notice-view__date{display:block;margin-bottom:14px;font-size:11px;font-weight:700;color:#8d7a55;font-variant-numeric:tabular-nums}
.ess-notice-view__img{display:block;max-width:100%;height:auto;margin:0 0 14px;border:1px solid #2f2a1c;border-radius:8px}
.ess-notice-view__content{font-size:13px;line-height:1.8;color:#cbb98f;word-break:keep-all;overflow-wrap:anywhere}
.ess-notice-view__content p{margin:0 0 12px}
.ess-notice-view__content p:last-child{margin-bottom:0}
.ess-notice-view__content img{display:block;max-width:100%;height:auto;margin:14px auto;border-radius:8px}
.ess-notice-view__content h2,.ess-notice-view__content h3,.ess-notice-view__content h4{margin:18px 0 8px;color:#f1c978;line-height:1.4;font-weight:900}
.ess-notice-view__content ul,.ess-notice-view__content ol{margin:0 0 12px;padding-left:20px}
.ess-notice-view__content li{margin:0 0 6px}
.ess-notice-view__content strong{color:#f6efe2}
.ess-notice-view__content a{color:#f1c978;text-decoration:underline;text-underline-offset:2px}
.ess-notice-view__content a:hover{color:#f7dda6}
.ess-notice-view__content hr{border:0;border-top:1px solid #1e1a11;margin:16px 0}
.ess-notice-view__content blockquote{
  margin:0 0 12px;padding:10px 13px;
  border-left:3px solid #c39b52;border-radius:8px;
  background:#121820;color:#cbb98f;
}
.ess-notice-view__content table{width:100%;border-collapse:collapse;margin:0 0 12px;font-size:12px}
.ess-notice-view__content th,.ess-notice-view__content td{border:1px solid #2f2a1c;padding:8px 10px;text-align:left}
.ess-notice-view__content th{background:#0a0e13;color:#8d7a55;font-weight:800}

/* 하단 버튼 */
.ess-sheet__foot{display:flex;justify-content:center;padding:18px 0 2px}
.ess-sheet__btn{
  display:inline-block;min-width:120px;padding:10px 18px;text-align:center;text-decoration:none;
  font-size:13px;font-weight:900;color:#1a1002;
  background:linear-gradient(180deg,#f1c978,#805315);
  border:1px solid #f7dda6;border-radius:7px;
  box-shadow:0 4px 14px #f1c97826;
  transition:filter .14s;
}
.ess-sheet__btn:hover{filter:brightness(1.07)}

/* 화면 스크롤 잠금 */
body.ess-sheet-open{overflow:hidden}

@media(max-width:767px){
  .ess-sheet__box{margin:12px auto;width:calc(100% - 16px);max-height:calc(100dvh - 24px);border-radius:10px}
  .ess-sheet__head{padding:13px 14px 11px}
  .ess-sheet__tabs{padding:10px 14px 0}
  .ess-sheet__body{padding:12px 14px 18px}
  .ess-sheet__ttl{font-size:15px}
  .ess-sheet__tab{padding:7px 13px;font-size:12px}
  .ess-notice-list__item{padding:12px 4px;gap:8px}
  .ess-notice-list__ttl{font-size:13px;line-height:1.45;white-space:normal}
  .ess-notice-list__date{font-size:11px}
  .ess-notice-view__ttl{font-size:15px}
  .ess-notice-view__content{font-size:13px}
  .ess-sheet__btn{min-width:100%;padding:12px 16px;font-size:14px}
}