:root{
	--bg:#0f0f12;
	--paper:#1a1a1f;
	--muted:#a1a1aa;
	--accent:#ff3b3b;
	--accent-dark:#cc2222;
	--text:#f4f4f5;
	--soft-shadow: 0 8px 24px rgba(0,0,0,0.45);
	--max-width:980px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
	margin:0;
	font-family: Georgia, 'Merriweather', serif;
	color:var(--text);
	background:linear-gradient(180deg,#121215 0%,#0a0a0c 100%);
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	font-size:16px;
	line-height:1.65;
}

.masthead{
	background:linear-gradient(90deg,#1c1c22 0%, #2a1212 100%);
	border-bottom:1px solid rgba(255,59,59,0.25);
}
.masthead-inner{
	max-width:var(--max-width);
	margin:0 auto;
	padding:28px 20px;
	position:relative;
}
.site-logo{width:56px;height:56px;object-fit:contain;display:inline-block;margin-right:12px}
.batatinha-large{display:block;margin:12px auto 18px;max-width:420px;width:80%;height:auto;object-fit:contain}
.hero-photos{display:flex;gap:12px;justify-content:flex-start;flex-wrap:wrap;margin-top:12px;align-items:flex-end}
.hero-photo{width:200px;height:auto;object-fit:contain;border-radius:8px;box-shadow:var(--soft-shadow);border:1px solid rgba(255,59,59,0.2)}
.batatinha-large{aspect-ratio:3/1;max-height:300px}

.skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:16px;top:12px;width:auto;height:auto;background:#1a1a1f;padding:8px 12px;border-radius:6px;box-shadow:var(--soft-shadow);z-index:1000;color:#fff}

.site-title{
	margin:0;
	font-family: 'Merriweather', serif;
	font-weight:700;
	letter-spacing:-0.5px;
	color:#ff4d4d;
	font-size:22px;
}
.site-tag{margin:6px 0 0;color:var(--muted);font-size:13px}

.container{max-width:var(--max-width);margin:28px auto;display:grid;grid-template-columns:280px 1fr;gap:28px;padding:0 20px}

.sidebar{padding:18px;background:var(--paper);border-radius:12px;box-shadow:var(--soft-shadow);border:1px solid rgba(255,59,59,0.15)}
.infobox{background:linear-gradient(180deg,#2a1515,#1f1212);border-radius:10px;padding:14px;border:1px solid rgba(255,59,59,0.3)}
.infobox h3{margin:0 0 8px;font-size:15px;color:#ff6b6b}
.infobox dt{font-weight:700;font-size:13px;color:#ff9f9f}
.infobox dd{margin:0 0 8px;color:var(--muted)}

.content{background:linear-gradient(180deg,#1c1c22,#16161a);padding:24px;border-radius:12px;box-shadow:var(--soft-shadow);border:1px solid rgba(255,59,59,0.12);overflow:hidden}
.page-header{border-bottom:1px solid rgba(255,59,59,0.2);padding-bottom:14px;margin-bottom:14px}
.page-title{font-family:'Merriweather',serif;margin:0;font-size:26px;color:#ff5252}
.lede{color:var(--muted);margin:6px 0 0}

.section{margin:18px 0;padding-top:18px;border-top:1px solid rgba(255,59,59,0.12)}
.section h3{font-size:20px;margin:0 0 10px;color:#ff6b6b}
.section p{line-height:1.65;color:#d4d4d8}
.section h4{margin:12px 0 8px;color:#fca5a5}

.traits{display:flex;flex-direction:column;gap:8px;padding-left:18px}
.traits li{list-style:disc;color:#e4e4e7}

.references{padding-left:18px}
.references li{margin:6px 0;color:var(--muted)}

.page-footer{margin-top:18px;border-top:1px dashed rgba(255,59,59,0.2);padding-top:12px}
.small{font-size:13px;color:var(--muted)}

.site-footer{max-width:var(--max-width);margin:28px auto;text-align:center;color:var(--muted);font-size:13px;padding:14px}

.hero{max-width:var(--max-width);margin:18px auto 0;padding:0 20px}

@media (max-width:900px){
	.container{grid-template-columns:1fr;gap:16px}
}
@media (max-width:520px){
	.hero-photos{justify-content:center}
}