@charset "UTF-8";

/* ═══════════════════════════════════════════════════
   생기부분석 - 안내 모달 & 비밀번호 게이트
   ═══════════════════════════════════════════════════ */

#sgbGateModal .modal-content{width:90%; max-width:440px}
#sgbGateModal .gate-body{text-align:center; padding:3rem 2.4rem 2rem}
#sgbGateModal .gate-icon{font-size:4.8rem; color:#006fff; margin-bottom:1.6rem; display:block}
#sgbGateModal .gate-title{font-size:1.7rem; color:#202020; font-weight:600; margin-bottom:1rem}
#sgbGateModal .gate-desc{font-size:1.35rem; color:#6b7280; line-height:1.7; margin-bottom:2.4rem}
#sgbGateModal .gate-footer{display:flex; justify-content:center; padding:0 2.4rem 2rem}
#sgbGateModal .gate-footer .btn{min-width:12rem}
#sgbGateModal .gate-secret{display:inline-flex; align-items:center; gap:0.3rem; margin-top:1.6rem; cursor:pointer; color:#c0c0c0; font-size:1.1rem; transition:color .2s}
#sgbGateModal .gate-secret:hover{color:#909090}
#sgbGateModal .gate-secret i{font-size:1.2rem}

@media (max-width:600px){
    #sgbGateModal .modal-content{max-width:34rem !important; width:calc(100% - 3rem) !important; margin:0 auto !important}
    #sgbGateModal .gate-body{padding:2.2rem 1.8rem 1.4rem}
    #sgbGateModal .gate-icon{font-size:3.6rem; margin-bottom:1.2rem}
    #sgbGateModal .gate-title{font-size:1.5rem; margin-bottom:0.8rem}
    #sgbGateModal .gate-desc{font-size:1.2rem; line-height:1.6; margin-bottom:1.6rem}
    #sgbGateModal .gate-footer{padding:0 1.8rem 1.8rem}
    #sgbGateModal .gate-footer .btn{min-width:10rem; font-size:1.3rem}
    #sgbGateModal .modal-header{height:5rem; padding:0 1.6rem}
    #sgbGateModal .modal-header .modal-tit{font-size:1.4rem}
}

/* 비밀번호 입력 영역 */
#sgbPwArea{display:none; margin-top:1.6rem; padding-top:1.4rem; border-top:1px solid #ebebeb}
#sgbPwArea.show{display:block}
#sgbPwArea .pw-wrap{display:flex; gap:0.6rem; max-width:24rem; margin:0 auto}
#sgbPwArea .pw-input{flex:1; height:3.8rem; padding:0 1.2rem; border:1px solid #dadada; border-radius:0.6rem; font-size:1.3rem; outline:none}
#sgbPwArea .pw-input:focus{border-color:#006fff}
#sgbPwArea .pw-btn{height:3.8rem; padding:0 1.6rem; background:#006fff; color:#fff; border:none; border-radius:0.6rem; font-size:1.3rem; font-weight:600; cursor:pointer}
#sgbPwArea .pw-error{color:#dc2626; font-size:1.2rem; margin-top:0.6rem}

/* ═══════════════════════════════════════════════════
   생기부분석 - 메인 컨텐츠 (게이트 통과 후)
   ═══════════════════════════════════════════════════ */

#sgbMainContent{display:none}
#sgbMainContent.unlocked{display:block}

/* 탭 메뉴 */
.sgb-tab-menu{display:flex; flex-wrap:wrap; gap:0.4rem; padding:0; margin-bottom:3rem; border-bottom:2px solid #ebebeb; position:relative}
.sgb-tab-btn{position:relative; padding:1.2rem 1.8rem; border:none; background:none; color:#808080; font-size:1.4rem; font-weight:500; cursor:pointer; white-space:nowrap; transition:color .2s}
.sgb-tab-btn.active{color:#006fff; font-weight:700}
.sgb-tab-btn.sgb-tab-dashboard{color:#dc2626}
.sgb-tab-btn.sgb-tab-dashboard.active{color:#dc2626}
.sgb-tab-btn.sgb-tab-dashboard.active:after{background:#dc2626}
.sgb-tab-btn.active:after{content:''; position:absolute; bottom:-2px; left:0; right:0; height:2px; background:#006fff}
.sgb-tab-btn:hover{color:#006fff}

.sgb-tab-content{display:none}
.sgb-tab-content.active{display:block}

/* ── 업로드 영역 ── */
.sgb-upload-area{display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:30rem; border:2px dashed #d0d7e2; border-radius:1.6rem; background:#f9fafb; text-align:center; padding:4rem 2rem; margin-bottom:30rem; transition:border-color .2s, background .2s; cursor:pointer}
.sgb-upload-area.dragover{border-color:#006fff; background:#f0f5ff}
.sgb-upload-area .upload-icon{font-size:5rem; color:#93a3b8; margin-bottom:1.6rem}
.sgb-upload-area .upload-title{font-size:1.6rem; color:#202020; font-weight:600; margin-bottom:0.6rem}
.sgb-upload-area .upload-desc{font-size:1.3rem; color:#808080; line-height:1.6; margin-bottom:2rem}
.sgb-upload-area .upload-btn{display:inline-flex; align-items:center; gap:0.5rem; padding:1rem 2.4rem; background:#006fff; color:#fff; border:none; border-radius:0.8rem; font-size:1.4rem; font-weight:600; cursor:pointer}
.sgb-upload-area .upload-btn:hover{background:#0055cc}

/* ── 로딩 오버레이 ── */
.sgb-loading{display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(255,255,255,0.85); z-index:9999; align-items:center; justify-content:center; flex-direction:column}
.sgb-loading.show{display:flex}
.sgb-loading .spinner{width:4rem; height:4rem; border:3px solid #e0e0e0; border-top-color:#006fff; border-radius:50%; animation:sgb-spin 0.8s linear infinite}
.sgb-loading .loading-text{margin-top:1.6rem; font-size:1.4rem; color:#505050; font-weight:500}
@keyframes sgb-spin{to{transform:rotate(360deg)}}

/* ── 비밀번호 모달 (암호화 PDF) ── */
#sgbPdfPwModal .modal-content{width:90%; max-width:380px}

/* ── 대시보드 생기부 가이드 ── */
.sgb-intro-guide{margin-bottom:2.4rem; background:#fffbeb; border:1px solid #fde68a; border-radius:1.2rem; overflow:hidden}
.intro-guide-header{display:flex; justify-content:space-between; align-items:center; padding:1.6rem 2rem; cursor:pointer; user-select:none}
.intro-guide-header:hover{background:#f9fafb}
.intro-guide-title{font-size:1.5rem; font-weight:700; color:#202020; display:flex; align-items:center; gap:0.6rem}
.intro-guide-title i{color:#f59e0b; font-size:1.8rem}
.intro-guide-toggle{font-size:2.4rem; color:#fff; background:#006fff; border-radius:50%; width:3rem; height:3rem; display:flex; align-items:center; justify-content:center; transition:transform 0.2s; flex-shrink:0}
.sgb-intro-guide.collapsed .intro-guide-toggle{transform:rotate(180deg)}
.intro-guide-body{padding:0 2rem 2rem}
.sgb-intro-guide.collapsed .intro-guide-body{display:none}
.intro-section-title{font-size:1.4rem; font-weight:700; color:#006fff; margin-bottom:1.2rem; display:flex; align-items:center; gap:0.5rem}
.intro-item{margin-bottom:1.4rem}
.intro-item:last-child{margin-bottom:0}
.intro-item-title{font-size:1.35rem; font-weight:700; color:#303030; margin-bottom:0.4rem; display:flex; align-items:center; gap:0.4rem}
.intro-item-title i{color:#006fff; font-size:1.4rem}
.intro-item-desc{font-size:1.3rem; color:#505050; line-height:1.8}
.intro-item-example{margin-top:0.6rem; padding:1rem 1.4rem; background:#fff; border-left:3px solid #006fff; border-radius:0 0.6rem 0.6rem 0; font-size:1.25rem; color:#404040; line-height:1.7}

/* ── AI 분석 소견 카드 ── */
.sgb-insight-card{margin-bottom:2.4rem; padding:2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem}
.insight-title{font-size:1.6rem; font-weight:700; color:#202020; margin-bottom:0.4rem; display:flex; align-items:center; gap:0.5rem}
.insight-title i{color:#7c3aed; font-size:1.8rem}
.insight-subtitle{font-size:1.2rem; color:#93a3b8; margin-bottom:2rem}
.insight-items{display:grid; grid-template-columns:repeat(2, 1fr); gap:1.4rem; margin-bottom:2rem}
.insight-item{padding:1.4rem; background:#f9fafb; border-radius:0.8rem}
.insight-item-label{font-size:1.25rem; font-weight:700; margin-bottom:0.5rem; display:flex; align-items:center; gap:0.4rem}
.insight-item-text{font-size:1.3rem; color:#404040; line-height:1.7}
.insight-overall{padding:1.6rem; background:#f0f4ff; border-radius:0.8rem; border-left:4px solid #006fff}
.insight-overall-label{font-size:1.3rem; font-weight:700; color:#006fff; margin-bottom:0.6rem; display:flex; align-items:center; gap:0.4rem}
.insight-overall-text{font-size:1.35rem; color:#303030; line-height:1.8}
@media screen and (max-width:800px) {
    .insight-items{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════════════════
   공통 패널 그림자
   ═══════════════════════════════════════════════════ */
.sgb-student-card,
.sgb-stat-card,
.sgb-chart-card,
.sgb-keywords-card,
.sgb-seteuk-item,
.sgb-att-card,
.sgb-creative-grade,
.sgb-behavioral-card,
.sgb-reading-grade,
.sgb-charcount-card,
.sgb-curriculum-card,
.sgb-career-card,
.sgb-insight-card,
.sgb-toc-card,
.gi-table-wrapper{
    box-shadow:0 .4rem 1.6rem rgba(0,0,0,0.10);
}

/* ═══════════════════════════════════════════════════
   대시보드 탭
   ═══════════════════════════════════════════════════ */

.sgb-dashboard{display:flex; flex-direction:column; gap:2.4rem}

/* 학생 정보 카드 */
.sgb-student-card{display:flex; align-items:center; gap:2rem; padding:2rem 2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem}
.sgb-student-card .student-avatar{display:flex; align-items:center; justify-content:center; width:5.6rem; height:5.6rem; background:#f0f4ff; border-radius:50%; font-size:2.4rem; color:#006fff}
.sgb-student-card .student-info{display:flex; flex-direction:column; gap:0.3rem}
.sgb-student-card .student-name{font-size:1.8rem; font-weight:700; color:#202020}
.sgb-student-card .student-school{font-size:1.3rem; color:#808080}

/* 통계 카드 그리드 */
.sgb-stats-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:1.6rem}
.sgb-stat-card{display:flex; flex-direction:column; align-items:center; padding:2rem 1.6rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem; text-align:center}
.sgb-stat-card .stat-label{font-size:1.2rem; color:#808080; margin-bottom:0.6rem}
.sgb-stat-card .stat-value{font-size:2.4rem; font-weight:700; color:#202020}
.sgb-stat-card .stat-sub{font-size:1.15rem; color:#93a3b8; margin-top:0.3rem}

/* 성적 추이 차트 */
.sgb-chart-card{padding:2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem}
.sgb-chart-card .chart-title{font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:1.6rem}
.sgb-chart-wrap{position:relative; width:100%; height:38rem}
.sgb-chart-wrap canvas{width:100%!important; height:100%!important}

/* 키워드 섹션 */
.sgb-keywords-card{padding:2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem}
.sgb-keywords-card .kw-title{font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:1.6rem}
.sgb-kw-list{display:flex; flex-wrap:wrap; gap:0.8rem}
.sgb-kw-tag{display:inline-flex; align-items:center; gap:0.4rem; padding:0.6rem 1.2rem; background:#f0f4ff; border-radius:2rem; font-size:1.3rem; color:#006fff; font-weight:500; transition:all .15s}
.sgb-kw-tag .kw-count{font-size:1.1rem; opacity:0.6; font-weight:400}
.sgb-kw-tag .kw-cat{font-size:1.05rem; font-weight:600; margin-left:0.2rem}
.sgb-kw-tag[data-kw-word]{border:1.5px solid transparent}
.sgb-kw-tag[data-kw-word]:hover{filter:brightness(0.95); transform:translateY(-1px)}
.sgb-kw-tag.kw-active{border-color:currentColor; box-shadow:0 0 0 2px rgba(0,0,0,0.08)}

/* 키워드 요약 문장 */
.sgb-kw-summary{font-size:1.35rem; color:#404040; line-height:1.7; margin-bottom:1.4rem; padding:1.2rem 1.6rem; background:#f9fafb; border-radius:0.8rem; border-left:3px solid #006fff}

/* 키워드 하이라이트 */
.sgb-kw-highlight{background:#fff3bf; color:#202020; padding:0.1rem 0.2rem; border-radius:0.3rem}

/* ═══════════════════════════════════════════════════
   성적 탭
   ═══════════════════════════════════════════════════ */

.sgb-grade-table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch}
.sgb-grade-table{width:100%; border-collapse:collapse; font-size:1.3rem}
.sgb-grade-table th{padding:1rem 1.2rem; background:#f5f7fa; color:#505050; font-weight:600; text-align:center; border-bottom:1px solid #e0e0e0; white-space:nowrap}
.sgb-grade-table td{padding:0.9rem 1.2rem; text-align:center; border-bottom:1px solid #f0f0f0; color:#202020}
.sgb-grade-table tbody tr:hover{background:#f9fafb}

/* 성적 패널 */
.sgb-grade-panel{display:none}
.sgb-grade-panel.active{display:block}

/* 등급 색상 */
.sgb-rank{display:inline-flex; align-items:center; justify-content:center; width:2.6rem; height:2.6rem; border-radius:50%; font-size:1.2rem; font-weight:700; color:#fff}
.sgb-rank-1{background:#1e40af}
.sgb-rank-2{background:#2563eb}
.sgb-rank-3{background:#3b82f6}
.sgb-rank-4{background:#60a5fa}
.sgb-rank-5{background:#f59e0b}
.sgb-rank-6{background:#f97316}
.sgb-rank-7{background:#ef4444}
.sgb-rank-8{background:#dc2626}
.sgb-rank-9{background:#991b1b}

/* ═══════════════════════════════════════════════════
   세특 탭
   ═══════════════════════════════════════════════════ */

.sgb-seteuk-wrap{display:flex; flex-direction:column; gap:2rem}
.sgb-seteuk-filter{display:flex; align-items:center; gap:1.2rem; margin-bottom:1rem; flex-wrap:wrap; position:sticky; top:8.4rem; z-index:10; background:#fff; padding:1.2rem 0; border-bottom:1px solid #f0f0f0}
.sgb-seteuk-filter label{font-size:1.3rem; color:#505050; font-weight:600}
/* 샘플 미리보기 오버레이 */
#sgbSampleOverlay{position:absolute; top:0; left:0; right:0; bottom:0; z-index:10; display:flex; align-items:flex-start; justify-content:center; padding-top:8rem; background:rgba(255,255,255,0.55)}
.sgb-sample-overlay-inner{display:flex; flex-direction:column; align-items:center; text-align:center; background:#fff; border-radius:1.6rem; padding:3.6rem 3rem; box-shadow:0 8px 40px rgba(0,0,0,0.12); max-width:48rem; width:90%}
#sgbMainContent{position:relative}

/* AI 분석 안내 페이지 */
.sgb-ai-prompt-wrap{display:flex; flex-direction:column; align-items:center; justify-content:center; padding:6rem 2rem; text-align:center}
.sgb-ai-prompt-icon{font-size:4.8rem; color:#7c3aed; margin-bottom:1.6rem}
.sgb-ai-prompt-title{font-size:2.2rem; font-weight:700; color:#202020; margin-bottom:1.2rem}
.sgb-ai-prompt-desc{font-size:1.4rem; color:#606060; line-height:2; margin-bottom:2.4rem}
.sgb-ai-prompt-btn{display:inline-flex; align-items:center; gap:0.6rem; height:4.8rem; padding:0 3.2rem; border:none; border-radius:0.8rem; background:#7c3aed; color:#fff; font-size:1.5rem; font-weight:700; cursor:pointer; transition:all .15s}
.sgb-ai-prompt-btn:hover{background:#6d28d9}
.sgb-ai-prompt-btn:disabled{opacity:0.6; cursor:not-allowed}
.sgb-ai-prompt-btn i{font-size:1.8rem}
.sgb-ai-prompt-note{margin-top:1.2rem; font-size:1.2rem; color:#a0a0a0}
.kw-title-row{display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem}
.sgb-reanalyze-btn{display:inline-flex; align-items:center; gap:0.3rem; padding:0.4rem 1rem; border:1px solid #dc2626; border-radius:0.5rem; background:#fff; color:#dc2626; font-size:1.2rem; cursor:pointer; transition:all .15s}
.sgb-reanalyze-btn:hover{background:#dc2626; color:#fff}
.sgb-pdf-btn{display:inline-flex; align-items:center; gap:0.3rem; padding:0.4rem 1rem; border:1px solid #006fff; border-radius:0.5rem; background:#fff; color:#006fff; font-size:1.2rem; cursor:pointer; transition:all .15s}
.sgb-pdf-btn:hover{background:#006fff; color:#fff}
.sgb-pdf-btn:disabled{opacity:0.5; cursor:not-allowed}
@keyframes ri-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.ri-spin{animation:ri-spin 1s linear infinite}
.sgb-seteuk-filter select{height:3.6rem; padding:0 3rem 0 1.2rem; border:1px solid #dadada; border-radius:0.6rem; font-size:1.3rem; color:#202020; background:#fff url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23808080' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 1rem center; -webkit-appearance:none; appearance:none}
/* 커스텀 드롭다운 (과목 필터) */
.sgb-custom-select{position:relative; display:inline-block}
.sgb-custom-select .cs-trigger{display:flex; align-items:center; justify-content:space-between; height:3.6rem; min-width:14rem; padding:0 1.2rem; border:1px solid #dadada; border-radius:0.6rem; font-size:1.3rem; color:#202020; background:#fff; cursor:pointer; user-select:none}
.sgb-custom-select .cs-trigger:after{content:'\ea4e'; font-family:'remixicon'; font-size:1.4rem; color:#808080; margin-left:0.8rem; transition:transform .2s}
.sgb-custom-select.open .cs-trigger{border-color:#006fff}
.sgb-custom-select.open .cs-trigger:after{transform:rotate(180deg)}
.sgb-custom-select .cs-list{display:none; position:absolute; top:calc(100% + 4px); left:0; min-width:100%; max-height:22rem; overflow-y:auto; background:#fff; border:1px solid #dadada; border-radius:0.8rem; box-shadow:0 .4rem 1.2rem rgba(0,0,0,0.1); z-index:20; padding:0.4rem 0}
.sgb-custom-select.open .cs-list{display:block}
.sgb-custom-select .cs-item{padding:0.8rem 1.4rem; font-size:1.3rem; color:#202020; cursor:pointer; white-space:nowrap; transition:background .15s}
.sgb-custom-select .cs-item:hover{background:#f5f7ff; color:#006fff}
.sgb-custom-select .cs-item.selected{color:#006fff; font-weight:600}

#sgbSeteukList{display:flex; flex-direction:column; gap:1.2rem}
.sgb-seteuk-item{padding:2rem 2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem}
.sgb-seteuk-item .seteuk-header{display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem}
.sgb-seteuk-item .seteuk-subject{font-size:1.5rem; font-weight:700; color:#202020}
.sgb-seteuk-item .seteuk-meta{font-size:1.2rem; color:#93a3b8}
.sgb-seteuk-item .seteuk-content{font-size:1.35rem; color:#404040; line-height:1.8; word-break:keep-all}
.sgb-seteuk-item .seteuk-keywords{display:flex; flex-wrap:wrap; gap:0.5rem; margin-top:1.2rem; padding-top:1.2rem; border-top:1px solid #f0f0f0}
.sgb-seteuk-item .seteuk-kw{padding:0.3rem 0.8rem; background:#f5f7ff; border-radius:1rem; font-size:1.15rem; color:#6b7280}

/* ═══════════════════════════════════════════════════
   출결 탭
   ═══════════════════════════════════════════════════ */

.sgb-attendance-grid{display:flex; flex-direction:column; gap:1.6rem}
.sgb-attendance-cards{display:grid; grid-template-columns:repeat(auto-fit, minmax(28rem, 1fr)); gap:1.6rem}
.sgb-att-card{padding:2rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem; overflow-x:auto}
.sgb-att-card .att-grade{font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:0.4rem}
.sgb-att-card .att-days{font-size:1.2rem; color:#808080; margin-bottom:1.4rem}
.sgb-att-card .att-table{width:100%; border-collapse:collapse; font-size:1.25rem}
.sgb-att-card .att-table th{padding:0.6rem 0.8rem; background:#f5f7fa; color:#808080; font-weight:500; text-align:center; border-bottom:1px solid #e0e0e0}
.sgb-att-card .att-table td{padding:0.6rem 0.8rem; text-align:center; border-bottom:1px solid #f0f0f0; color:#202020}
.sgb-att-card .att-note{margin-top:1rem; font-size:1.2rem; color:#6b7280; line-height:1.5}

.sgb-att-rate{display:inline-flex; align-items:center; gap:0.4rem; padding:0.4rem 1rem; background:#ecfdf5; color:#059669; border-radius:2rem; font-size:1.2rem; font-weight:600}

/* ═══════════════════════════════════════════════════
   창체 탭
   ═══════════════════════════════════════════════════ */

.sgb-creative-wrap{display:flex; flex-direction:column; gap:2rem}
.sgb-creative-grade{padding:2rem 2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem}
.sgb-creative-grade .cg-title{font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:1.6rem}
.sgb-creative-item{display:flex; flex-direction:column; gap:0.6rem; padding:1.4rem 0; border-bottom:1px solid #f0f0f0}
.sgb-creative-item:last-child{border-bottom:none}
.sgb-creative-item .ci-header{display:flex; align-items:center; gap:1rem}
.sgb-creative-item .ci-area{display:inline-flex; padding:0.3rem 1rem; background:#f0f4ff; color:#006fff; border-radius:0.6rem; font-size:1.2rem; font-weight:600}
.sgb-creative-item .ci-hours{font-size:1.2rem; color:#808080}
.sgb-creative-item .ci-desc{font-size:1.3rem; color:#404040; line-height:1.7; word-break:keep-all}

/* ═══════════════════════════════════════════════════
   행특 탭
   ═══════════════════════════════════════════════════ */

.sgb-behavioral-wrap{display:flex; flex-direction:column; gap:2rem}
.sgb-behavioral-card{padding:2rem 2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem}
.sgb-behavioral-card .bh-grade{font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:1rem}
.sgb-behavioral-card .bh-content{font-size:1.35rem; color:#404040; line-height:1.8; word-break:keep-all}
.sgb-behavioral-card .bh-chars{font-size:1.2rem; color:#93a3b8; margin-top:0.8rem}

/* ═══════════════════════════════════════════════════
   독서 탭
   ═══════════════════════════════════════════════════ */

.sgb-reading-wrap{display:flex; flex-direction:column; gap:2rem}
.sgb-reading-grade{padding:2rem 2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem}
.sgb-reading-grade .rg-title{font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:1.6rem}
.sgb-reading-subject{margin-bottom:1.2rem}
.sgb-reading-subject .rs-name{font-size:1.3rem; font-weight:600; color:#505050; margin-bottom:0.6rem}
.sgb-reading-subject .rs-books{display:flex; flex-wrap:wrap; gap:0.6rem}
.sgb-reading-subject .rs-book{display:inline-flex; align-items:center; gap:0.4rem; padding:0.5rem 1rem; background:#f9fafb; border:1px solid #e8edf3; border-radius:0.6rem; font-size:1.25rem; color:#404040; transition:transform 0.12s ease, box-shadow 0.12s ease}
.sgb-reading-subject .rs-book:hover{transform:translateY(-1px); box-shadow:0 2px 6px rgba(15,35,80,0.08)}
.sgb-reading-subject .rs-book i{color:#f59e0b; font-size:1.3rem}
.sgb-reading-subject .rs-book-title{font-weight:600; color:#202020}
.sgb-reading-subject .rs-book-author{color:#909090; font-size:1.15rem}
.sgb-reading-subject .rs-book-mentioned{background:#fff7f7; border-color:#fca5a5; box-shadow:0 1px 4px rgba(220,38,38,0.12)}
.sgb-reading-subject .rs-book-mentioned .rs-book-title{color:#991b1b}
.sgb-reading-subject .rs-book-mentioned i{color:#dc2626}
.sgb-reading-subject .rs-book-badge{display:inline-flex; align-items:center; margin-left:0.4rem; padding:0.2rem 0.6rem; background:#dc2626; color:#fff; border-radius:0.4rem; font-size:1.05rem; font-weight:600; white-space:nowrap}

/* ═══════════════════════════════════════════════════
   가이드 박스 (각 탭 상단)
   ═══════════════════════════════════════════════════ */

.sgb-guide-box{margin-bottom:2rem; background:#fffde7; border:1px solid #f0e68c; border-radius:1.2rem; overflow:hidden; box-shadow:0 .2rem .8rem rgba(0,0,0,0.06)}
.sgb-guide-box .guide-header{display:flex; align-items:center; justify-content:space-between; padding:1.4rem 2rem; cursor:pointer; user-select:none; transition:background .15s}
.sgb-guide-box .guide-header:hover{background:#fff9c4}
.sgb-guide-box .guide-header-left{display:flex; align-items:center; gap:0.8rem}
.sgb-guide-box .guide-name{font-size:1.4rem; font-weight:700; color:#202020}
.sgb-guide-box .guide-imp{display:inline-block; padding:0.2rem 0.8rem; border-radius:1rem; color:#fff; font-size:1.1rem; font-weight:600}
.sgb-guide-box .guide-toggle{font-size:2rem; color:#93a3b8; transition:transform .2s}
.sgb-guide-box.collapsed .guide-toggle{transform:rotate(180deg)}
.sgb-guide-box .guide-body{padding:0 2rem 1.6rem; border-top:1px solid #f0e68c}
.sgb-guide-box.collapsed .guide-body{display:none}
.sgb-guide-box .guide-summary{font-size:1.3rem; color:#505050; line-height:1.7; margin:1.2rem 0 0}
.sgb-guide-box .guide-detail{font-size:1.25rem; color:#6b7280; line-height:1.7; margin:1rem 0 0; padding:1rem 1.4rem; background:#fff8e1; border-radius:0.8rem}
.sgb-guide-box .guide-detail b{color:#202020}

/* ═══════════════════════════════════════════════════
   대시보드 목차
   ═══════════════════════════════════════════════════ */

.sgb-toc-card{padding:2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem}
.sgb-toc-card .toc-title{display:flex; align-items:center; gap:0.6rem; font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:1.6rem}
.sgb-toc-card .toc-badge-legend{font-size:1.25rem; color:#fff; line-height:2.2; margin-bottom:1.2rem; padding:1.2rem 1.6rem; border-radius:0.8rem; background:#404040}
.sgb-toc-card .toc-badge-legend .toc-imp{vertical-align:middle; margin-right:0.2rem; margin-left:0.8rem}
.sgb-toc-card .toc-badge-legend .toc-imp:first-child{margin-left:0}
.sgb-toc-list{display:flex; flex-direction:column; gap:0.4rem}
.sgb-toc-item{display:flex; align-items:center; justify-content:space-between; padding:1.2rem 1.6rem; border-radius:0.8rem; cursor:pointer; transition:background .15s}
.sgb-toc-item:hover{background:#f5f7ff}
.sgb-toc-item .toc-left{display:flex; align-items:center; gap:1rem}
.sgb-toc-item .toc-left i{font-size:1.6rem; color:#006fff; width:2rem; text-align:center}
.sgb-toc-item .toc-name{font-size:1.35rem; color:#202020; font-weight:500}
.sgb-toc-item .toc-right{display:flex; align-items:center; gap:0.8rem}
.sgb-toc-item .toc-imp{display:inline-block; padding:0.2rem 0.8rem; border-radius:1rem; color:#fff; font-size:1.1rem; font-weight:600}
.sgb-toc-item .toc-right > i{font-size:1.6rem; color:#c0c0c0}

/* ═══════════════════════════════════════════════════
   세특 글자수 분석
   ═══════════════════════════════════════════════════ */

.sgb-charcount-card{padding:2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem; margin-bottom:2rem; overflow-x:auto}
.sgb-charcount-card .cc-title{font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:1.6rem}
.sgb-cc-table{width:100%; border-collapse:collapse; font-size:1.3rem}
.sgb-cc-table th{padding:1rem 1.2rem; background:#f5f7fa; color:#505050; font-weight:600; text-align:center; border-bottom:1px solid #e0e0e0; white-space:nowrap}
.sgb-cc-table td{padding:0.8rem 1.2rem; text-align:center; border-bottom:1px solid #f0f0f0; color:#202020}
.sgb-cc-table td.subj-name{text-align:left; font-weight:500}
.sgb-cc-bar{display:inline-block; height:1.6rem; border-radius:0.4rem; vertical-align:middle; min-width:2px}
.sgb-cc-high{background:#dcfce7; color:#166534}
.sgb-cc-low{background:#fef2f2; color:#991b1b}
.sgb-cc-summary{display:flex; gap:1.6rem; flex-wrap:wrap; margin-bottom:1.2rem}
.sgb-cc-summary-item{flex:1; min-width:16rem; padding:1.6rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem; text-align:center; box-shadow:0 2px 8px rgba(15,35,80,0.06); transition:transform 0.15s ease, box-shadow 0.15s ease}
.sgb-cc-summary-item:hover{transform:translateY(-2px); box-shadow:0 6px 16px rgba(15,35,80,0.1)}
.sgb-cc-summary-item .cc-label{font-size:1.2rem; color:#808080; margin-bottom:0.4rem}
.sgb-cc-summary-item .cc-value{font-size:2rem; font-weight:700; color:#202020}
.sgb-cc-bridge-note{font-size:1.2rem; color:#606060; margin-bottom:2rem; padding:0.8rem 1.2rem; background:#f4f7fc; border-left:3px solid #006fff; border-radius:0.4rem}

/* 키워드 목적 안내 박스 (대시보드) */
.sgb-kw-purpose{margin:1.2rem 0 1.6rem; padding:1.2rem 1.6rem; background:#faf5ff; border:1px solid #e9d5ff; border-radius:0.8rem}
.sgb-kw-purpose .kp-title{font-size:1.3rem; font-weight:700; color:#6d28d9; margin-bottom:0.6rem}
.sgb-kw-purpose .kp-title i{margin-right:0.3rem}
.sgb-kw-purpose ul{margin:0; padding-left:1.6rem; font-size:1.2rem; color:#4c1d95; line-height:1.8}
.sgb-kw-purpose ul li{margin-bottom:0.4rem}
.sgb-kw-purpose .kp-warn{color:#dc2626; font-weight:500}

/* 세특 탭 키워드 hint (1줄) */
.sgb-kw-hint{margin-bottom:1.4rem; padding:0.8rem 1.2rem; background:#faf5ff; border-left:3px solid #7c3aed; border-radius:0.4rem; font-size:1.2rem; color:#4c1d95; line-height:1.6}

/* 키워드 클릭 시 원문 맥락 박스 */
.sgb-kw-context-box{margin-top:0.8rem; padding:1rem 1.2rem; background:#fffbeb; border:1px solid #fde68a; border-radius:0.6rem; position:relative}
.sgb-kw-context-box .ctx-head{font-size:1.2rem; font-weight:700; color:#92400e; margin-bottom:0.4rem}
.sgb-kw-context-box .ctx-head i{margin-right:0.3rem}
.sgb-kw-context-box .ctx-head .ctx-sub{font-weight:400; color:#b45309; font-size:1.1rem; margin-left:0.3rem}
.sgb-kw-context-box .ctx-body{font-size:1.25rem; color:#78350f; line-height:1.7; font-style:italic}

/* ═══════════════════════════════════════════════════
   AI 분석 로딩 오버레이 (단계별)
   ═══════════════════════════════════════════════════ */
.sgb-ai-loader-overlay{position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(250,250,255,0.97); backdrop-filter:blur(3px); z-index:9999; display:flex; align-items:center; justify-content:center; padding:2rem; opacity:1; transition:opacity 0.3s ease}
.sgb-ai-loader-overlay.hiding{opacity:0}
.sgb-ai-loader-overlay .ail-wrap{max-width:56rem; width:100%; padding:3.2rem 3rem; background:#fff; border-radius:1.6rem; box-shadow:0 20px 60px rgba(76,29,149,0.15), 0 8px 24px rgba(15,35,80,0.08); text-align:center}
.sgb-ai-loader-overlay .ail-title{font-size:2.2rem; font-weight:800; color:#4c1d95; margin-bottom:0.6rem; display:flex; align-items:center; justify-content:center; gap:0.5rem}
.sgb-ai-loader-overlay .ail-title i{color:#7c3aed; animation:ail-sparkle 1.8s ease-in-out infinite}
@keyframes ail-sparkle{0%,100%{transform:scale(1) rotate(0deg); opacity:1} 50%{transform:scale(1.25) rotate(15deg); opacity:0.7}}
.sgb-ai-loader-overlay .ail-subtitle{font-size:1.35rem; color:#606060; margin-bottom:2rem; line-height:1.6}

/* 진행률 바 */
.sgb-ai-loader-overlay .ail-progress-bar{width:100%; height:0.6rem; background:#ede9fe; border-radius:1rem; overflow:hidden; margin-bottom:2rem}
.sgb-ai-loader-overlay .ail-progress-fill{height:100%; width:0%; background:linear-gradient(90deg, #a78bfa 0%, #7c3aed 50%, #6d28d9 100%); border-radius:1rem; transition:width 0.5s ease; animation:ail-shine 2s linear infinite; background-size:200% 100%}
@keyframes ail-shine{0%{background-position:200% 0} 100%{background-position:-200% 0}}

/* 단계 리스트 */
.sgb-ai-loader-overlay .ail-steps{display:flex; flex-direction:column; gap:0.8rem; margin-bottom:2rem; text-align:left}
.sgb-ai-loader-overlay .ail-step{display:flex; align-items:center; gap:1rem; padding:1rem 1.2rem; background:#f7f7fb; border:1px solid #e8edf3; border-radius:0.8rem; transition:all 0.3s ease; position:relative}
.sgb-ai-loader-overlay .ail-step-icon{width:3.4rem; height:3.4rem; border-radius:50%; background:#e8edf3; color:#a0a0a0; display:flex; align-items:center; justify-content:center; font-size:1.6rem; flex-shrink:0; transition:all 0.3s ease}
.sgb-ai-loader-overlay .ail-step-label{font-size:1.35rem; color:#808080; font-weight:500; flex:1}
.sgb-ai-loader-overlay .ail-step-badge{font-size:1.15rem; font-weight:600; color:transparent; min-width:3rem; text-align:right}

.sgb-ai-loader-overlay .ail-step.active{background:linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%); border-color:#c4b5fd; box-shadow:0 0 0 3px rgba(124,58,237,0.08), 0 4px 12px rgba(124,58,237,0.1)}
.sgb-ai-loader-overlay .ail-step.active .ail-step-icon{background:#7c3aed; color:#fff; animation:ail-pulse 1.4s ease-in-out infinite}
.sgb-ai-loader-overlay .ail-step.active .ail-step-label{color:#4c1d95; font-weight:700}
.sgb-ai-loader-overlay .ail-step.active .ail-step-badge{color:#7c3aed}
.sgb-ai-loader-overlay .ail-step.active .ail-step-badge::after{content:'진행 중'}
@keyframes ail-pulse{0%,100%{box-shadow:0 0 0 0 rgba(124,58,237,0.5)} 70%{box-shadow:0 0 0 12px rgba(124,58,237,0)}}

.sgb-ai-loader-overlay .ail-step.done{background:#f0fdf4; border-color:#bbf7d0}
.sgb-ai-loader-overlay .ail-step.done .ail-step-icon{background:#16a34a; color:#fff}
.sgb-ai-loader-overlay .ail-step.done .ail-step-label{color:#166534; font-weight:600}
.sgb-ai-loader-overlay .ail-step.done .ail-step-badge{color:#16a34a}
.sgb-ai-loader-overlay .ail-step.done .ail-step-badge::after{content:'✓ 완료'}

/* 팁 박스 */
.sgb-ai-loader-overlay .ail-tip-box{padding:1.1rem 1.4rem; background:#fffbeb; border-left:4px solid #f59e0b; border-radius:0.6rem; font-size:1.3rem; color:#78350f; text-align:left; line-height:1.6; margin-bottom:1.4rem; display:flex; align-items:flex-start; gap:0.6rem}
.sgb-ai-loader-overlay .ail-tip-box i{color:#d97706; flex-shrink:0; margin-top:0.2rem; font-size:1.5rem}
.sgb-ai-loader-overlay .ail-tip-text{transition:opacity 0.35s ease; opacity:1}
.sgb-ai-loader-overlay .ail-tip-text.fading{opacity:0}

/* 푸터 (경과 시간 + 예상 안내) */
.sgb-ai-loader-overlay .ail-footer{display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap}
.sgb-ai-loader-overlay .ail-elapsed{font-size:1.3rem; color:#4c1d95; font-weight:700; display:inline-flex; align-items:center; gap:0.4rem}
.sgb-ai-loader-overlay .ail-elapsed i{color:#7c3aed}
.sgb-ai-loader-overlay .ail-note{font-size:1.15rem; color:#a0a0a0}

/* 모바일 대응 */
@media (max-width: 640px) {
    .sgb-ai-loader-overlay .ail-wrap{padding:2rem 1.6rem}
    .sgb-ai-loader-overlay .ail-title{font-size:1.8rem}
    .sgb-ai-loader-overlay .ail-step-label{font-size:1.25rem}
    .sgb-ai-loader-overlay .ail-step-badge{display:none}
    .sgb-ai-loader-overlay .ail-footer{flex-direction:column; align-items:flex-start}
}

/* ═══════════════════════════════════════════════════
   교과 이수현황
   ═══════════════════════════════════════════════════ */

.sgb-curriculum-card{padding:2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem; margin-bottom:2rem; overflow-x:auto}
.sgb-curriculum-card .cur-title{font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:1.6rem}
.sgb-cur-table{width:100%; border-collapse:collapse; font-size:1.3rem}
.sgb-cur-table th{padding:1rem 1.2rem; background:#f5f7fa; color:#505050; font-weight:600; text-align:center; border-bottom:1px solid #e0e0e0; white-space:nowrap}
.sgb-cur-table td{padding:0.8rem 1.2rem; text-align:center; border-bottom:1px solid #f0f0f0; color:#202020}
.sgb-cur-table td.cat-name{text-align:left; font-weight:600}
.sgb-cur-ratio{display:flex; gap:1.6rem; flex-wrap:wrap; margin-bottom:2rem}
.sgb-cur-ratio-item{flex:1; min-width:14rem; padding:1.6rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem; text-align:center}
.sgb-cur-ratio-item .ratio-label{font-size:1.2rem; color:#808080; margin-bottom:0.4rem}
.sgb-cur-ratio-item .ratio-value{font-size:2rem; font-weight:700; color:#202020}
.sgb-cur-ratio-item .ratio-bar{display:flex; height:0.8rem; border-radius:0.4rem; overflow:hidden; margin-top:0.8rem; background:#f0f0f0}
.sgb-cur-ratio-item .ratio-fill{height:100%; border-radius:0.4rem}

/* ═══════════════════════════════════════════════════
   진로 일관성 분석
   ═══════════════════════════════════════════════════ */

.sgb-career-card{padding:2.4rem; background:#fff; border:1px solid #e8edf3; border-radius:1.2rem; margin-bottom:2rem}
.sgb-career-card .career-title{font-size:1.5rem; font-weight:700; color:#202020; margin-bottom:1.6rem}
.sgb-career-kw-list{display:flex; flex-wrap:wrap; gap:0.8rem; margin-bottom:1.6rem}
.sgb-career-kw{display:inline-flex; align-items:center; gap:0.4rem; padding:0.6rem 1.4rem; border-radius:2rem; font-size:1.3rem; font-weight:600}
.sgb-career-kw.large{background:#dbeafe; color:#1e40af; font-size:1.5rem; padding:0.8rem 1.8rem}
.sgb-career-kw.medium{background:#e0e7ff; color:#3730a3}
.sgb-career-kw.small{background:#f0f4ff; color:#6366f1; font-size:1.2rem}
.sgb-career-timeline{display:flex; flex-direction:column; gap:1.6rem}
.sgb-career-year{display:flex; gap:1.6rem; align-items:flex-start}
.sgb-career-year .cy-badge{flex-shrink:0; width:6rem; height:6rem; display:flex; align-items:center; justify-content:center; background:#006fff; color:#fff; font-size:1.4rem; font-weight:700; border-radius:50%}
.sgb-career-year .cy-content{flex:1}
.sgb-career-year .cy-grade{font-size:1.4rem; font-weight:700; color:#202020; margin-bottom:0.6rem}
.sgb-career-year .cy-keywords{display:flex; flex-wrap:wrap; gap:0.5rem}
.sgb-career-year .cy-kw{padding:0.3rem 0.8rem; background:#f5f7ff; border-radius:1rem; font-size:1.2rem; color:#505050}
.sgb-career-sources{margin-top:1.2rem; font-size:1.2rem; color:#808080; line-height:1.6}

/* ═══════════════════════════════════════════════════
   반응형
   ═══════════════════════════════════════════════════ */

/* 탭 메뉴 가로 스크롤: 태블릿/모바일 (1200px 이하 — 2줄 밀림 방지) */
.sgb-tab-scroll-hint{display:none}
@media screen and (max-width:1200px) {
    .sgb-tab-menu{flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scroll-behavior:smooth; scrollbar-width:thin}
    .sgb-tab-menu::-webkit-scrollbar{height:3px}
    .sgb-tab-menu::-webkit-scrollbar-track{background:#f7f7f7}
    .sgb-tab-menu::-webkit-scrollbar-thumb{background:#c4b5fd; border-radius:2px}
    .sgb-tab-btn{flex-shrink:0}

    /* 탭 메뉴 하단 스크롤 힌트 (좌우 화살표 + 안내) */
    .sgb-tab-scroll-hint{display:flex; align-items:center; justify-content:center; gap:0.5rem; margin-top:-2.4rem; margin-bottom:2rem; padding:0.4rem; font-size:1.15rem; color:#808080}
    .sgb-tab-scroll-hint i{color:#7c3aed; font-size:1.4rem; animation:sgb-hint-arrow 1.6s ease-in-out infinite}
    @keyframes sgb-hint-arrow{
        0%,100% { transform: translateX(0); opacity:0.6; }
        50%     { transform: translateX(4px); opacity:1; }
    }
}

@media screen and (max-width:800px) {
    .sgb-stats-grid{grid-template-columns:1fr}
    .sgb-student-card{flex-direction:column; text-align:center}
    .sgb-tab-btn{padding:1rem 1.2rem; font-size:1.3rem}
    .sgb-seteuk-item{padding:1.6rem}
    .sgb-creative-grade{padding:1.6rem}
    .sgb-behavioral-card{padding:1.6rem}
    .sgb-reading-grade{padding:1.6rem}
    .sgb-attendance-cards{grid-template-columns:1fr}
    .sgb-cc-summary{flex-direction:column}
    .sgb-cc-summary-item{min-width:100%}
    .sgb-cur-ratio{flex-direction:column}
    .sgb-cur-ratio-item{min-width:100%}
    .sgb-seteuk-item .seteuk-content{word-break:break-word}
    .sgb-creative-item .ci-desc{word-break:break-word}
    .sgb-behavioral-card .bh-content{word-break:break-word}
}

/* 모바일 테이블 가로스크롤 안내 오버레이 */
.sgb-scroll-overlay{display:none}
@media screen and (max-width:800px) {
    .sgb-scroll-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(30,58,95,0.55);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:0.6rem;cursor:pointer}
    .sgb-scroll-overlay-inner{text-align:center;color:#fff;padding:16px}
}

@media screen and (max-width:600px) {
    .sgb-stat-card .stat-value{font-size:2rem}
    .sgb-chart-wrap{height:30rem}
}