/* ============================================================
   LOTTOIS 보충 유틸리티
   ------------------------------------------------------------
   승계한 Tailwind 빌드본(688de3a43b5952bd.css)은 원본 운세 사이트가
   "실제로 사용한 클래스"만 포함합니다. 원본은 노란색을 그라디언트
   텍스트로만 썼기 때문에 bg-yellow-400 같은 기본 CTA 스타일조차
   빌드에 없습니다.

   이 파일은 그 공백만 채웁니다. 승계 CSS는 수정하지 않습니다.
   (Tailwind 재빌드 환경을 붙이면 이 파일은 통째로 폐기 가능)
   ============================================================ */

:root{
  --lt-yellow-200:#fff085; --lt-yellow-300:#ffe02a; --lt-yellow-400:#fac800; --lt-yellow-500:#edb200;
  --lt-slate-100:#f1f5f9; --lt-slate-400:#94a3b8; --lt-slate-500:#64748b; --lt-slate-700:#334155;
  --lt-slate-800:#1e293b; --lt-slate-900:#0f172a;
  --lt-emerald-500:#00bb7f; --lt-indigo-400:#7c86ff; --lt-indigo-500:#615fff;
  --lt-red-400:#ff6568; --lt-red-500:#fb2c36; --lt-red-600:#e40014;
}

/* ---- 색상 ---- */
.bg-yellow-400{background-color:var(--lt-yellow-400)}
.text-slate-900{color:var(--lt-slate-900)}
.bg-yellow-400\/15{background-color:rgb(250 200 0/.15)}
.bg-slate-800\/70{background-color:rgb(30 41 59/.7)}
.bg-emerald-500\/15{background-color:rgb(0 187 127/.15)}
.bg-emerald-500\/10{background-color:rgb(0 187 127/.1)}
.bg-red-500\/5{background-color:rgb(251 44 54/.05)}
.bg-slate-100{background-color:#f1f5f9}

/* ---- 그라디언트 시작색 ---- */
.from-yellow-400\/15{--tw-gradient-from:rgb(250 200 0/.15);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,transparent)}
.from-yellow-400\/20{--tw-gradient-from:rgb(250 200 0/.2);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,transparent)}
.from-indigo-500\/10{--tw-gradient-from:rgb(97 95 255/.1);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,transparent)}
.from-emerald-500\/10{--tw-gradient-from:rgb(0 187 127/.1);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,transparent)}
.from-indigo-500\/15{--tw-gradient-from:rgb(97 95 255/.15);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,transparent)}
.from-indigo-500\/20{--tw-gradient-from:rgb(97 95 255/.2);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,transparent)}

/* ---- 테두리 ---- */
.border-yellow-400\/25{border-color:rgb(250 200 0/.25)}
.border-yellow-400\/30{border-color:rgb(250 200 0/.3)}
.border-yellow-400\/60{border-color:rgb(250 200 0/.6)}
.border-indigo-400\/25{border-color:rgb(124 134 255/.25)}
.border-emerald-500\/30{border-color:rgb(0 187 127/.3)}
.border-emerald-500\/25{border-color:rgb(0 187 127/.25)}
.border-red-500\/25{border-color:rgb(251 44 54/.25)}

/* ---- 상태: hover ---- */
.hover\:bg-yellow-300:hover{background-color:var(--lt-yellow-300)}
.hover\:bg-red-400:hover{background-color:var(--lt-red-400)}
.hover\:bg-slate-800\/50:hover{background-color:rgb(30 41 59/.5)}
.hover\:bg-slate-800\/60:hover{background-color:rgb(30 41 59/.6)}
.hover\:border-yellow-400\/60:hover{border-color:rgb(250 200 0/.6)}
.hover\:border-yellow-400\/70:hover{border-color:rgb(250 200 0/.7)}
.hover\:border-indigo-400\/60:hover{border-color:rgb(124 134 255/.6)}
.hover\:text-yellow-400:hover{color:var(--lt-yellow-400)}
.hover\:text-slate-400:hover{color:var(--lt-slate-400)}
.hover\:underline:hover{text-decoration-line:underline}
.group:hover .group-hover\:border-yellow-400\/60{border-color:rgb(250 200 0/.6)}

/* ---- 상태: active ---- */
.active\:bg-yellow-500:active{background-color:var(--lt-yellow-500)}
.active\:bg-red-600:active{background-color:var(--lt-red-600)}

/* ---- 상태: focus / focus-visible (접근성 필수) ---- */
.focus\:border-yellow-400:focus{border-color:var(--lt-yellow-400)}
.focus\:ring-2:focus{box-shadow:0 0 0 2px var(--lt-ring-color,rgb(250 200 0/.3))}
.focus\:ring-yellow-400\/30:focus{--lt-ring-color:rgb(250 200 0/.3);box-shadow:0 0 0 2px rgb(250 200 0/.3)}
.focus-visible\:outline:focus-visible{outline-style:solid}
.focus-visible\:outline-2:focus-visible{outline-width:2px}
.focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}
.focus-visible\:outline-yellow-400:focus-visible{outline-color:var(--lt-yellow-400)}
.focus-visible\:outline-red-400:focus-visible{outline-color:var(--lt-red-400)}
.accent-yellow-400{accent-color:var(--lt-yellow-400)}

/* ---- 간격 ---- */
.mb-2\.5{margin-bottom:.625rem}
.mb-7{margin-bottom:1.75rem}
.mt-3\.5{margin-top:.875rem}
.ml-5{margin-left:1.25rem}
.pt-5{padding-top:1.25rem}
.pt-7{padding-top:1.75rem}
.pb-5{padding-bottom:1.25rem}
.pb-24{padding-bottom:6rem}
.pb-28{padding-bottom:7rem}
.gap-x-4{column-gap:1rem}
.space-y-0\.5>:not([hidden])~:not([hidden]){margin-top:.125rem}
.py-14{padding-top:3.5rem;padding-bottom:3.5rem}
.p-1\.5{padding:.375rem}
.px-7{padding-left:1.75rem;padding-right:1.75rem}
.gap-3\.5{gap:.875rem}
.gap-x-3{column-gap:.75rem}
.gap-y-1{row-gap:.25rem}
.mr-1{margin-right:.25rem}
.mx-0\.5{margin-left:.125rem;margin-right:.125rem}
.-bottom-4{bottom:-1rem}

/* ---- 타이포 ---- */
.text-\[15px\]{font-size:15px}
.list-decimal{list-style-type:decimal}
.list-disc{list-style-type:disc}
.list-inside{list-style-position:inside}
.list-outside{list-style-position:outside}
.break-all{word-break:break-all}
.leading-snug{line-height:1.375}
.align-middle{vertical-align:middle}
.items-baseline{align-items:baseline}
.select-none{-webkit-user-select:none;user-select:none}

/* ---- 구분선 ---- */
.divide-y>:not([hidden])~:not([hidden]){border-top-width:1px;border-bottom-width:0}
.divide-slate-800>:not([hidden])~:not([hidden]){border-color:var(--lt-slate-800)}

/* ---- 모서리 ---- */
.rounded-tl-md{border-top-left-radius:.375rem}

/* ---- 전환 ---- */
.duration-200{transition-duration:.2s}
.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}

/* ---- details/summary (FAQ 아코디언) ---- */
.list-none{list-style:none}
summary.list-none::-webkit-details-marker{display:none}
details[open] .group-open\:rotate-180{transform:rotate(180deg)}
.pt-0{padding-top:0}
.pl-9{padding-left:2.25rem}
.pl-13{padding-left:3.25rem}

/* ---- 페이지 가로 스크롤 방지 (내부 표는 자체 overflow-x-auto 로 스크롤) ---- */
html,body{max-width:100%;overflow-x:hidden}

/* ---- 관리자 표 스크롤 래퍼: 그리드/플렉스 안에서 줄어들 수 있게 ---- */
.admin-scroll{min-width:0;max-width:100%}

/* ---- 모바일 관리자 메뉴 드로어 (JS 없이 체크박스 토글) ---- */
.admin-drawer{position:fixed;inset:0;z-index:60;visibility:hidden;pointer-events:none}
.admin-drawer .drawer-overlay{position:absolute;inset:0;background:rgba(2,6,23,.7);opacity:0;transition:opacity .2s ease}
.admin-drawer .drawer-panel{position:absolute;top:0;left:0;bottom:0;width:82%;max-width:300px;
  background:#0f172a;border-right:1px solid #1e293b;transform:translateX(-100%);transition:transform .26s cubic-bezier(.16,1,.3,1);
  overflow-y:auto;-webkit-overflow-scrolling:touch}
.admin-nav-toggle:checked ~ .admin-drawer{visibility:visible;pointer-events:auto}
.admin-nav-toggle:checked ~ .admin-drawer .drawer-overlay{opacity:1}
.admin-nav-toggle:checked ~ .admin-drawer .drawer-panel{transform:none}
@media (min-width:1024px){ .admin-drawer,.admin-hamburger{display:none!important} }

/* ---- 관리자 표 공통 여백 (칸 붙음 방지) ---- */
.a-tbl{width:100%;border-collapse:collapse}
.a-tbl th,.a-tbl td{padding:.7rem 1rem;white-space:nowrap;vertical-align:middle}
.a-tbl th{font-weight:500}

/* ============================================================
   관리자 콘솔용 유틸리티 (승계 빌드에 없는 데스크톱 레이아웃 클래스)
   ============================================================ */
.whitespace-nowrap{white-space:nowrap}
.align-top{vertical-align:top}
.max-w-6xl{max-width:72rem}
.col-span-2{grid-column:span 2/span 2}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.gap-5{gap:1.25rem}
.gap-x-6{column-gap:1.5rem}
.gap-y-2{row-gap:.5rem}
.gap-\[3px\]{gap:3px}
.border-r{border-right-width:1px}
.h-screen{height:100vh}
.w-60{width:15rem}
.backdrop-blur{backdrop-filter:blur(8px)}
.resize-y{resize:vertical}
.rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem}
.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}
.to-yellow-400{--tw-gradient-to:#facc15}
.from-yellow-400\/30{--tw-gradient-from:rgb(250 200 0/.3);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,transparent)}
.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}
/* min-width (표 가로 스크롤 보장) */
.min-w-\[160px\]{min-width:160px}.min-w-\[180px\]{min-width:180px}.min-w-\[520px\]{min-width:520px}
.min-w-\[560px\]{min-width:560px}.min-w-\[600px\]{min-width:600px}.min-w-\[640px\]{min-width:640px}
.min-w-\[680px\]{min-width:680px}.min-w-\[720px\]{min-width:720px}.min-w-\[760px\]{min-width:760px}
.min-w-\[820px\]{min-width:820px}.min-w-\[860px\]{min-width:860px}.min-w-\[880px\]{min-width:880px}

@media (min-width:640px){
  .sm\:inline{display:inline}
  .sm\:p-6{padding:1.5rem}
  .sm\:max-w-xs{max-width:20rem}
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .sm\:grid-cols-\[1fr_auto\]{grid-template-columns:1fr auto}
  .sm\:col-span-2{grid-column:span 2/span 2}
}
@media (min-width:1024px){
  .lg\:flex{display:flex}
  .lg\:block{display:block}
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .lg\:col-span-2{grid-column:span 2/span 2}
}

/* ---- 토글 스위치 (peer/after) ---- */
.after\:content-\[\'\'\]::after{content:''}
.after\:absolute::after{position:absolute}
.after\:top-0\.5::after{top:.125rem}
.after\:left-0\.5::after{left:.125rem}
.after\:w-4::after{width:1rem}
.after\:h-4::after{height:1rem}
.after\:rounded-full::after{border-radius:9999px}
.after\:bg-white::after{background:#fff}
.after\:transition-transform::after{transition-property:transform;transition-duration:.15s}
.peer:checked ~ .peer-checked\:bg-yellow-400{background-color:#facc15}
.peer:checked ~ .peer-checked\:after\:translate-x-4::after{transform:translateX(1rem)}

/* ---- 보충 유틸 (승계 빌드 미포함분) ---- */
.border-slate-800\/60{border-color:rgb(30 41 59/.6)}
.divide-slate-800\/60>:not([hidden])~:not([hidden]){border-color:rgb(30 41 59/.6)}
.hover\:bg-slate-800\/40:hover{background-color:rgb(30 41 59/.4)}
.hover\:bg-emerald-500\/25:hover{background-color:rgb(0 187 127/.25)}
.hover\:bg-yellow-400\/25:hover{background-color:rgb(250 200 0/.25)}
.hover\:bg-red-500\/25:hover{background-color:rgb(251 44 54/.25)}
.hover\:border-red-500\/40:hover{border-color:rgb(251 44 54/.4)}
.from-yellow-400\/10{--tw-gradient-from:rgb(250 200 0/.1);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,transparent)}
.mt-2\.5{margin-top:.625rem}
.mr-1\.5{margin-right:.375rem}
.mb-3\.5{margin-bottom:.875rem}
.pt-0\.5{padding-top:.125rem}
.py-10{padding-top:2.5rem;padding-bottom:2.5rem}
.px-1{padding-left:.25rem;padding-right:.25rem}
.mx-2{margin-left:.5rem;margin-right:.5rem}
.-mr-1{margin-right:-.25rem}
.-ml-1{margin-left:-.25rem}
.gap-y-1\.5{row-gap:.375rem}
.h-40{height:10rem}
.w-28{width:7rem}
.tracking-widest{letter-spacing:.1em}

/* ---- 반응형 ---- */
@media (min-width:1024px){ .lg\:hidden{display:none} }

/* ---- 접근성: 모션 최소화 존중 ---- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}