.cc-modal { font-family: Montserrat; position: fixed; z-index: 99999; left:0; top:0; width:100%; height:100%; background: rgba(0,0,0,0.45); display:none; }
.cc-modal-content { background:#fff; width:92%; max-width:980px; margin:3% auto; border-radius:8px; overflow:hidden; position:relative; box-shadow:0 20px 50px rgba(0,0,0,0.25); }
.cc-modal-header { padding:18px 22px; border-bottom:1px solid #eee; display:flex; align-items:center; justify-content:space-between; }
.cc-modal-header h3 { margin:0; font-weight:600; color:#333; font-size:20px; }
.cc-close { cursor:pointer; font-size:20px; color:#999; }
.cc-close:hover { color:#333; }
.cc-modal-body { padding:20px 24px; max-height:70vh; overflow:auto; }
.cc-modal-footer { padding:12px 18px; border-top:1px solid #f1f1f1; text-align:right; }
.cc-spinner { border:4px solid #f3f3f3; border-top:4px solid #B92224; border-radius:50%; width:36px; height:36px; animation: spin 1.4s linear infinite; margin:0 auto; }
@keyframes spin { 0%{ transform:rotate(0deg);}100%{transform:rotate(360deg);} }

/* New layout styles for CCCOCIN view */
.cc-view-layout { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; color:#222; }
.cc-view-header { display:flex; gap:20px; align-items:center; margin-bottom:14px; }
.cc-view-col { box-sizing:border-box; }
.cc-view-logo { flex: 0 0 20%; max-width:20%; display:flex; align-items:center; justify-content:center; }
.cc-view-logo-img { max-width:100%; max-height:90px; object-fit:contain; }
.cc-view-meta { flex:1 1 80%; max-width:80%; padding-left:6px; }
.cc-view-meta-line { color:#555; font-size:14px; margin-bottom:6px; text-align:right; }
.cc-view-body-section { margin-top:8px; }
.cc-view-title { margin:6px 0 12px; font-size:22px; color:#1f2937; font-weight:700; }
.cc-view-article { color:#333; line-height:1.65; font-size:15px; }

/* Responsive */
@media (max-width:720px) {
    .cc-modal-content { width:96%; margin:4% auto; }
    .cc-view-header { flex-direction:row; gap:12px; }
    .cc-view-logo { flex:0 0 30%; max-width:30%; }
    .cc-view-meta { max-width:70%; }
}
@media (max-width:520px) {
    .cc-view-header { flex-direction:column; align-items:flex-start; }
    .cc-view-logo { width:100%; max-width:100%; margin-bottom:8px; }
    .cc-view-meta { width:100%; max-width:100%; padding-left:0; }
    .cc-view-title { font-size:18px; }
}