body{
margin:0;
background:#eef3f8;
font-family:Inter,Arial,sans-serif;
}

.page-shell{
padding:24px;
max-width:1450px;
margin:auto;
}

.hero{
background:linear-gradient(135deg,#003a70,#005aa5);
color:white;
padding:24px;
border-radius:18px;
margin-bottom:24px;
text-align:center;
}

.layout{
display:grid;
grid-template-columns:minmax(0,1fr) 320px;
gap:24px;
align-items:start;
}

.main-content > div{
max-width:none !important;
background:white;
border:none !important;
box-shadow:0 8px 30px rgba(0,0,0,.08);
}

.sidebar-ad{
position:sticky;
top:20px;
}

.ad-card{
background:white;
padding:18px;
border-radius:16px;
box-shadow:0 8px 25px rgba(0,0,0,.08);
min-height:600px;
}

#citation-book-system h2,
#citation-book-system h3{
color:#003a70;
}

#citation-book-system button{
transition:.2s;
}

#citation-book-system button:hover{
transform:translateY(-1px);
}

@media(max-width:1000px){

.layout{
grid-template-columns:1fr;
}

.sidebar-ad{
position:static;
}

.ad-card{
min-height:auto;
}

}

@media(max-width:768px){

.page-shell{
padding:12px;
}

.person-row{
flex-direction:column;
align-items:stretch;
}

}


.layout{
display:block !important;
}

.main-content{
width:100% !important;
max-width:1200px !important;
margin:0 auto !important;
}

.main-content > div,
#citation-book-system{
max-width:1200px !important;
width:100% !important;
margin:0 auto !important;
}

.site-footer{
margin-top:30px;
padding:20px;
text-align:center;
background:#fff;
border-radius:12px;
}

.site-footer a{
text-decoration:none;
font-weight:600;
}

html,body{
margin:0;
padding:0;
width:100%;
overflow-x:hidden !important;
}

*{
box-sizing:border-box;
max-width:100%;
}

.page-shell,
.content,
main{
width:100%;
}

.content{
padding:20px;
margin:0 auto;
}

#citation-book-system{
width:100% !important;
max-width:1200px !important;
margin:0 auto !important;
}

input,textarea,select,button,
div[contenteditable="true"]{
max-width:100%;
}

#theme-toggle{
position:absolute;
right:16px;
top:16px;
width:52px;
height:52px;
border-radius:50%;
border:none;
cursor:pointer;
font-size:24px;
box-shadow:0 4px 12px rgba(0,0,0,.2);
}

.hero{
position:relative;
}

.site-footer{
width:100%;
padding:20px;
text-align:center;
background:linear-gradient(135deg,#003a70,#005aa5);
color:#fff;
}

.site-footer a{
color:#fff;
text-decoration:none;
font-weight:600;
}

body.dark{
background:#121212;
color:#f5f5f5;
}

body.dark h1,
body.dark h2,
body.dark h3,
body.dark h4,
body.dark h5,
body.dark h6{
color:#ffffff !important;
}

body.dark #citation-book-system{
background:#1e1e1e;
color:#f5f5f5;
}

body.dark input,
body.dark textarea,
body.dark select,
body.dark div[contenteditable="true"]{
background:#2a2a2a;
color:#fff;
border-color:#555;
}

body.dark .hero,
body.dark .site-footer{
background:linear-gradient(135deg,#1f1f1f,#2d2d2d);
}