/* 
    telegram.pe.kr - secret-chat08 [포렌식 완전 삭제 가이드]
    Dark Steel & Crimson-Cyan Gradient Theme
    Risk Cards + Tabs + Checklist + Tips
    Strictly scoped to #tg-sc08-wrapper
*/

#tg-sc08-wrapper {
    --tg-sc08-bg: #060a0f;
    --tg-sc08-bg-light: #0c1118;
    --tg-sc08-glass: rgba(255, 255, 255, 0.033);
    --tg-sc08-primary: #06b6d4;
    --tg-sc08-primary-dim: rgba(6, 182, 212, 0.12);
    --tg-sc08-primary-glow: rgba(6, 182, 212, 0.14);
    --tg-sc08-red: #ef4444;
    --tg-sc08-red-dim: rgba(239, 68, 68, 0.12);
    --tg-sc08-amber: #f59e0b;
    --tg-sc08-amber-dim: rgba(245, 158, 11, 0.1);
    --tg-sc08-green: #22c55e;
    --tg-sc08-green-dim: rgba(34, 197, 94, 0.12);
    --tg-sc08-text-main: #f1f5f9;
    --tg-sc08-text-mute: #94a3b8;
    --tg-sc08-border: rgba(255, 255, 255, 0.07);
    --tg-sc08-radius: 16px;

    background: linear-gradient(170deg, #060a0f 0%, #0a1020 50%, #0c1520 100%);
    color: var(--tg-sc08-text-main);
    font-family: 'Inter', 'Pretendard', 'Noto Sans KR', sans-serif;
    line-height: 1.7;
    border-radius: var(--tg-sc08-radius);
    padding: 3rem 2.5rem;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
}

#tg-sc08-wrapper * { box-sizing: border-box; }

/* 배경 글로우 장식 */
#tg-sc08-wrapper::before {
    content: '';
    position: absolute; top: -80px; right: -80px;
    width: 280px; height: 280px;
    background: radial-gradient(circle, var(--tg-sc08-primary-glow), transparent 70%);
    border-radius: 50%; pointer-events: none; z-index: 0;
}
#tg-sc08-wrapper::after {
    content: '';
    position: absolute; bottom: -60px; left: -60px;
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(239, 68, 68, 0.07), transparent 70%);
    border-radius: 50%; pointer-events: none; z-index: 0;
}
#tg-sc08-wrapper > * { position: relative; z-index: 1; }

/* ─── 헤더 ─── */
.tg-sc08-header {
    text-align: center;
    margin-bottom: 3.5rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid var(--tg-sc08-border);
}
.tg-sc08-header__badge {
    display: inline-flex; align-items: center; gap: 6px;
    background: linear-gradient(135deg, var(--tg-sc08-red-dim), var(--tg-sc08-primary-dim));
    color: var(--tg-sc08-primary) !important;
    padding: 8px 18px; border-radius: 24px;
    font-size: 0.85rem; font-weight: 700; margin-bottom: 1.5rem;
    border: 1px solid rgba(6, 182, 212, 0.2);
}
.tg-sc08-header__title {
    font-size: 2.1rem; font-weight: 900;
    margin: 0 0 1.2rem; word-break: keep-all; line-height: 1.3;
    background: linear-gradient(135deg, #fff 20%, var(--tg-sc08-primary) 60%, var(--tg-sc08-red));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.tg-sc08-header__desc {
    font-size: 1.05rem; color: var(--tg-sc08-text-mute) !important;
    max-width: 680px; margin: 0 auto; word-break: keep-all;
}

/* ─── 섹션 타이틀 ─── */
.tg-sc08-section-title {
    font-size: 1.5rem; font-weight: 800; margin: 0 0 2rem;
    display: flex; align-items: center; gap: 10px;
    color: var(--tg-sc08-text-main) !important;
}
.tg-sc08-section-title .material-symbols-outlined {
    font-size: 2rem; color: var(--tg-sc08-primary) !important;
}

/* ─── 위험 카드 (3열) ─── */
.tg-sc08-risks {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 1rem; margin-bottom: 2rem;
}
.tg-sc08-risk {
    border-radius: 12px; padding: 1.8rem;
    position: relative; overflow: hidden;
    transition: transform 0.25s ease, border-color 0.25s ease;
    text-align: left !important;
}
.tg-sc08-risk::before {
    content: ''; position: absolute; top: 0; left: 0;
    width: 100%; height: 4px;
}
.tg-sc08-risk:hover { transform: translateY(-3px); }

.tg-sc08-risk--red {
    background: var(--tg-sc08-red-dim);
    border: 1px solid rgba(239, 68, 68, 0.2);
}
.tg-sc08-risk--red::before { background: var(--tg-sc08-red); }
.tg-sc08-risk--red .tg-sc08-risk__icon { color: var(--tg-sc08-red) !important; background: var(--tg-sc08-red-dim); }

.tg-sc08-risk--amber {
    background: var(--tg-sc08-amber-dim);
    border: 1px solid rgba(245, 158, 11, 0.2);
}
.tg-sc08-risk--amber::before { background: var(--tg-sc08-amber); }
.tg-sc08-risk--amber .tg-sc08-risk__icon { color: var(--tg-sc08-amber) !important; background: var(--tg-sc08-amber-dim); }

.tg-sc08-risk--cyan {
    background: var(--tg-sc08-primary-dim);
    border: 1px solid rgba(6, 182, 212, 0.2);
}
.tg-sc08-risk--cyan::before { background: var(--tg-sc08-primary); }
.tg-sc08-risk--cyan .tg-sc08-risk__icon { color: var(--tg-sc08-primary) !important; background: var(--tg-sc08-primary-dim); }

.tg-sc08-risk__icon {
    display: flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border-radius: 12px; margin-bottom: 1rem;
}
.tg-sc08-risk__icon .material-symbols-outlined { font-size: 24px; }
.tg-sc08-risk__title {
    font-size: 1.05rem; font-weight: 700;
    color: var(--tg-sc08-text-main) !important; margin: 0 0 0.5rem;
    text-align: left !important;
}
.tg-sc08-risk__desc {
    font-size: 0.92rem; color: var(--tg-sc08-text-mute) !important;
    margin: 0; line-height: 1.55; text-align: left !important;
}

/* ─── 경고 박스 ─── */
.tg-sc08-warning {
    background: rgba(239, 68, 68, 0.08);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 12px; padding: 1.5rem 2rem;
    display: flex; gap: 14px; align-items: flex-start;
    margin-bottom: 1rem;
}
.tg-sc08-warning > .material-symbols-outlined {
    color: var(--tg-sc08-red) !important; font-size: 1.8rem; flex-shrink: 0;
}
.tg-sc08-warning__text { flex-grow: 1; text-align: left !important; }
.tg-sc08-warning__title {
    font-size: 1.05rem; font-weight: 800;
    color: var(--tg-sc08-red) !important; margin: 0 0 0.35rem; text-align: left !important;
}
.tg-sc08-warning__desc {
    font-size: 0.95rem; color: var(--tg-sc08-text-mute) !important;
    margin: 0; line-height: 1.55; text-align: left !important;
}
.tg-sc08-warning__desc strong { color: var(--tg-sc08-text-main) !important; }

/* ─── 탭 ─── */
.tg-sc08-tabs { margin-bottom: 2rem; }
.tg-sc08-tabs__nav {
    display: flex; gap: 0.5rem; margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--tg-sc08-border); padding-bottom: 0;
}
.tg-sc08-tabs__btn {
    display: flex; align-items: center; gap: 6px;
    padding: 0.7rem 1.3rem; border: none; background: none;
    color: var(--tg-sc08-text-mute) !important; font-family: inherit;
    font-size: 0.95rem; font-weight: 600; cursor: pointer;
    border-bottom: 2px solid transparent; margin-bottom: -1px;
    transition: color 0.2s ease, border-color 0.2s ease;
}
.tg-sc08-tabs__btn .material-symbols-outlined { font-size: 18px; }
.tg-sc08-tabs__btn:hover { color: var(--tg-sc08-text-main) !important; }
.tg-sc08-tabs__btn--active {
    color: var(--tg-sc08-primary) !important;
    border-bottom-color: var(--tg-sc08-primary);
}

.tg-sc08-tabs__panel { display: none; }
.tg-sc08-tabs__panel--active { display: block; }

/* PC 안내 박스 */
.tg-sc08-pc-info {
    display: flex; align-items: flex-start; gap: 10px;
    background: var(--tg-sc08-primary-dim); border: 1px solid rgba(6, 182, 212, 0.2);
    border-radius: 10px; padding: 1rem 1.2rem; margin-bottom: 1.5rem;
    font-size: 0.92rem; color: var(--tg-sc08-text-mute) !important;
}
.tg-sc08-pc-info .material-symbols-outlined { color: var(--tg-sc08-primary) !important; flex-shrink: 0; }

/* ─── 체크리스트 ─── */
.tg-sc08-checklist {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: 0.75rem;
}
.tg-sc08-checklist__item {
    display: flex; align-items: flex-start; gap: 14px;
    background: var(--tg-sc08-glass); border: 1px solid var(--tg-sc08-border);
    border-radius: 12px; padding: 1.2rem 1.4rem;
    transition: border-color 0.25s ease, background 0.25s ease;
}
.tg-sc08-checklist__item--done {
    border-color: rgba(34, 197, 94, 0.3) !important;
    background: rgba(34, 197, 94, 0.06) !important;
}
.tg-sc08-checklist__check {
    display: flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; flex-shrink: 0;
    border-radius: 50%; border: 2px solid var(--tg-sc08-border);
    background: none; cursor: pointer;
    color: transparent !important; transition: all 0.25s ease;
}
.tg-sc08-checklist__check .material-symbols-outlined { font-size: 18px; }
.tg-sc08-checklist__check:hover { border-color: var(--tg-sc08-green); }
.tg-sc08-checklist__item--done .tg-sc08-checklist__check {
    background: var(--tg-sc08-green-dim) !important;
    border-color: var(--tg-sc08-green) !important;
    color: var(--tg-sc08-green) !important;
}
.tg-sc08-checklist__content { flex-grow: 1; text-align: left !important; }
.tg-sc08-checklist__title {
    font-size: 1rem; font-weight: 700;
    color: var(--tg-sc08-text-main) !important; margin: 0 0 0.3rem;
    text-align: left !important;
}
.tg-sc08-checklist__item--done .tg-sc08-checklist__title { color: var(--tg-sc08-text-mute) !important; }
.tg-sc08-checklist__desc {
    font-size: 0.9rem; color: var(--tg-sc08-text-mute) !important;
    margin: 0; line-height: 1.55; text-align: left !important; word-break: keep-all;
}
.tg-sc08-checklist__desc strong { color: var(--tg-sc08-primary) !important; }
.tg-sc08-checklist__desc code {
    background: rgba(255, 255, 255, 0.08); border-radius: 4px;
    padding: 0 5px; font-size: 0.85rem; color: var(--tg-sc08-amber) !important;
}

/* ─── 팁 카드 (2x2) ─── */
.tg-sc08-tips {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 1rem; margin-bottom: 2rem;
}
.tg-sc08-tip {
    background: var(--tg-sc08-glass); border: 1px solid var(--tg-sc08-border);
    border-radius: 12px; padding: 1.5rem;
    text-align: left !important; position: relative; overflow: hidden;
    transition: transform 0.25s ease;
}
.tg-sc08-tip::before {
    content: ''; position: absolute; top: 0; left: 0;
    width: 100%; height: 4px;
    background: linear-gradient(90deg, var(--tg-sc08-primary), var(--tg-sc08-red));
}
.tg-sc08-tip:hover { transform: translateY(-3px); }
.tg-sc08-tip__icon {
    display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 10px;
    background: var(--tg-sc08-primary-dim); color: var(--tg-sc08-primary) !important;
    margin-bottom: 1rem;
}
.tg-sc08-tip__icon .material-symbols-outlined { font-size: 22px; }
.tg-sc08-tip__title {
    font-size: 1rem; font-weight: 700;
    color: var(--tg-sc08-text-main) !important; margin: 0 0 0.5rem; text-align: left !important;
}
.tg-sc08-tip__desc {
    font-size: 0.92rem; color: var(--tg-sc08-text-mute) !important;
    margin: 0; line-height: 1.55; text-align: left !important; word-break: keep-all;
}
.tg-sc08-tip__desc strong { color: var(--tg-sc08-primary) !important; }

/* ─── 결론 ─── */
.tg-sc08-conclusion {
    background: linear-gradient(135deg, var(--tg-sc08-primary-dim), var(--tg-sc08-red-dim));
    border: 1px solid rgba(6, 182, 212, 0.2);
    border-radius: 12px; padding: 2rem; text-align: center;
}
.tg-sc08-conclusion__text {
    font-size: 1.05rem; color: var(--tg-sc08-text-mute) !important;
    margin: 0; line-height: 1.7;
}
.tg-sc08-conclusion__text strong { color: var(--tg-sc08-primary) !important; }

/* ─── 반응형 ─── */
@media (max-width: 768px) {
    #tg-sc08-wrapper { padding: 2rem 1.2rem; }
    .tg-sc08-header__title { font-size: 1.6rem; }
    .tg-sc08-risks { grid-template-columns: 1fr; }
    .tg-sc08-tips { grid-template-columns: 1fr; }
    .tg-sc08-tabs__nav { flex-wrap: wrap; }
    .tg-sc08-tabs__btn { padding: 0.6rem 0.9rem; font-size: 0.88rem; }
    .tg-sc08-warning { flex-direction: column; gap: 0.8rem; }
}