body {
    margin:0;
    font-family: 'IM Fell English', serif;
    background: url('assets/parchment-texture.jpg') repeat;
    color: #d4d4dc;
}
header {
    display: flex;
    align-items: center;
    padding: 10px;
    background-color: rgba(15, 14, 22, 0.95);
    border-bottom: 2px solid #3bb7a3;
}
.logo {
    height: 60px;
    margin-right: 15px;
}
h1 {
    font-family: 'UnifrakturCook', cursive;
    color: #3bb7a3;
    margin:0;
}
.tagline {
    font-style: italic;
    color: #b5b5c4;
}
#map-container {
    position: relative;
    display: inline-block;
}
#world-map {
    max-width: 100%;
    display: block;
}
.map-pin {
    position: absolute;
    width: 16px;
    height: 16px;
    background: #3bb7a3;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 0 8px #3bb7a3;
    transform: translate(-50%, -50%);
}
#search-results {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}
.scroll-fragment {
    background: url('assets/parchment-texture.jpg') repeat;
    padding: 10px;
    border: 2px solid #3b2b1a;
    border-radius: 6px;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    flex: 1 1 200px;
}
#loading-screen {
    position: fixed;
    top:0;left:0;width:100%;height:100%;
    background-color: #0d0c14;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction: column;
    z-index: 9999;
}
.loading-emblem {
    width: 100px;
    animation: fadeIn 2s ease-in-out infinite alternate;
}
@keyframes fadeIn {
    from { opacity:0.5; }
    to { opacity:1; }
}