/* math.css - Specific styles for the math page */

.system-notice {
    background: #eef2ff; /* Light blue/indigo background */
    border: 1px solid #c7d2fe; /* Medium blue/indigo border */
    border-radius: 16px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: var(--shadow-soft);
}

.system-notice h3 {
    color: #312e81; /* Darker blue/indigo for the title */
    font-weight: 700;
    margin-bottom: 12px;
}

.system-notice blockquote {
    border-left: 4px solid #a5b4fc; /* Lighter blue/indigo accent for blockquote */
    padding-left: 16px;
    margin: 16px 0;
    font-style: italic;
    color: #4338ca; /* Dark blue/indigo for quote text */
}

.system-notice p {
    color: #3730a3; /* Slightly darker blue for the main text */
    line-height: 1.7;
    margin-bottom: 1.5em; /* Add margin to the bottom of each paragraph */
}

.system-notice p:last-child {
    margin-bottom: 0; /* Remove margin from the last paragraph */
}

.emphasis-center {
    font-weight: 700;
    text-align: center;
    font-size: 1.1rem;
    color: #312e81;
    margin-top: 2em; /* Added top margin */
}

.whitepaper-content {
    font-family: 'Source Code Pro', monospace; /* Monospaced font for a technical feel */
    color: #374151; /* Slightly softer than pure black */
    font-size: 0.9rem; /* Slightly smaller font size */
}

.whitepaper-content h2 {
    font-size: 1.7rem; /* Adjusted for smaller base font */
    font-weight: 700;
    color: var(--text-primary);
    margin-top: 24px;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--border-color);
}

.whitepaper-content h4 {
    font-size: 1.0rem; /* Adjusted */
    font-weight: 500;
    color: var(--text-secondary);
    margin-bottom: 32px;
}

.whitepaper-content h5 {
    font-size: 1.2rem; /* Adjusted */
    font-weight: 600;
    color: var(--text-primary);
    margin-top: 28px;
    margin-bottom: 12px;
    padding-left: 10px;
    border-left: 4px solid var(--accent-primary);
}

.whitepaper-content p {
    font-size: 0.9rem; /* Match parent */
    line-height: 1.8;
    margin-bottom: 1.5em;
}

.whitepaper-content strong, .whitepaper-content b {
    font-weight: 600;
}

.whitepaper-content blockquote {
    background: #f9fafb; /* Light grey background for quotes */
    border-left: 4px solid var(--accent-primary);
    margin: 20px 0;
    padding: 15px 20px;
    font-style: italic;
    color: #4b5563;
}

.whitepaper-content hr {
    margin: 32px 0;
    border: 0;
    border-top: 1px solid var(--border-color);
}

/* MathJax styling */
.mjx-container {
    overflow-x: auto;
    overflow-y: hidden;
    padding: 8px 0;
}

/* --- 긴급 수정 패치 --- */

/* 1. 플렉스 박스 내에서 카드가 멍청하게 늘어나는 것 방지 */
.main-content .details-page-card {
    min-width: 0; /* 이게 핵심이야. 내용물이 커도 박스는 줄어들게 강제함 */
}

/* 2. MathJax 수식이 너무 길면 그 수식만 따로 스크롤 생기게 하기 */
mjx-container {
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

/* 3. 혹시 모르니 컨텐츠 래퍼에도 안전장치 */
.details-content {
    width: 100%;
    overflow-x: hidden; /* 전체 스크롤 방지 */
}

/* 4. 수식 감싸는 태그가 오버플로우 발생 시 처리 */
.details-content p, 
.details-content div {
    max-width: 100%;
}

@media screen and (max-width: 768px) {
    .whitepaper-content {
        padding: 10px; /* 모바일에서 여백 줄임 */
    }
}