*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
        :root{
            --parchment:#f5eedc;
            --parchment-mid:#e8dbbf;
            --parchment-dark:#c9b98a;
            --ink:#2c1f0e;
            --ink-light:#5a3e1b;
            --accent:#7a3b1e;
        }
        html,body{
            min-height:100%;
            background:var(--parchment);
            font-family:'Crimson Text',Georgia,serif;
            color:var(--ink);
            overflow-x:hidden;
            overflow-y:auto;
        }
        .page-wrap{display:flex;flex-direction:column;height:100vh}

        /* Header */
        .map-header{
            flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;
            padding:10px 24px;background:var(--parchment);
            border-bottom:2px solid var(--parchment-dark);position:relative;z-index:1000;
        }
        .map-header::after{
            content:'';position:absolute;bottom:-5px;left:0;right:0;height:3px;
            background:repeating-linear-gradient(90deg,var(--parchment-dark) 0 6px,transparent 6px 12px);
        }
        .header-title{font-family:'Cinzel',serif;font-size:1.5rem;font-weight:600;letter-spacing:.12em;color:var(--ink);text-transform:uppercase}
        .header-subtitle{font-family:'Crimson Text',serif;font-size:.85rem;font-style:italic;color:var(--ink-light);letter-spacing:.05em}
        .header-left{display:flex;flex-direction:column;gap:1px}
        .header-right{display:flex;align-items:center;gap:16px}
        .header-hint{font-family:'Crimson Text',serif;font-size:.8rem;font-style:italic;color:var(--ink-light)}

        /* Map */
        .map-wrap{position:relative;flex:1 1 auto;display:flex;flex-direction:column}
        #map{flex:1 1 auto;position:relative}
        .leaflet-container{background:var(--parchment) !important}
        .leaflet-map-pane{filter:drop-shadow(0 6px 32px rgba(44,31,14,.28)) drop-shadow(0 2px 8px rgba(44,31,14,.18))}
        .leaflet-control-zoom a{
            background:var(--parchment) !important;color:var(--ink) !important;
            border-color:var(--parchment-dark) !important;font-family:'Cinzel',serif !important;
        }
        .leaflet-control-zoom a:hover{background:var(--parchment-mid) !important}
        .leaflet-control-attribution{display:none}

        .atlas-legend{
            position:absolute;
            bottom:16px;
            right:16px;
            z-index:1000;

            background:var(--parchment);
            border:1px solid var(--parchment-dark);
            border-radius:4px;

            padding:10px 12px;
            min-width:140px;

            box-shadow:2px 3px 8px rgba(44,31,14,.15);
        }

        .legend-title{
            font-family:'Cinzel',serif;
            font-size:.75rem;
            font-weight:600;
            letter-spacing:.08em;
            text-transform:uppercase;
            color:var(--ink);

            margin-bottom:8px;
        }

        .legend-row{
            display:flex;
            align-items:center;
            gap:8px;

            font-size:.8rem;
            margin-bottom:4px;
        }

        .legend-swatch{
            width:14px;
            height:14px;
            border:1px solid rgba(0,0,0,.2);
            border-radius:2px;
            flex-shrink:0;
        }

        .legend-swatch.land{
            background: rgb(165, 176, 140);
        }

        .legend-swatch.forest{
            background: rgb(108, 128, 92);
        }

        .legend-swatch.mountain{
            background: rgb(132, 122, 108);
        }

        .legend-swatch.water{
            background: rgb(127, 159, 178);
        }

        .legend-swatch.desert{
            background: rgb(201, 168, 106);
        }

        .legend-swatch.wetland{
            background: rgb(118, 152, 145);
        }

        .legend-swatch.hills{
            background: rgb(184, 191, 161);
        }

        .legend-swatch.shore{
            background: rgb(196, 205, 174);
        }

        /* ── Layer toggle ── */
        .layer-toggle{
            position:absolute;bottom:16px;left:50%;transform:translateX(-50%);
            z-index:1000;display:flex;gap:6px;
            background:var(--parchment);border:1px solid var(--parchment-dark);
            border-radius:4px;padding:5px 8px;
            box-shadow:2px 3px 8px rgba(44,31,14,.15);
        }
        .layer-btn{
            font-family:'Cinzel',serif;font-size:.65rem;font-weight:600;
            letter-spacing:.08em;text-transform:uppercase;
            padding:4px 10px;border-radius:3px;border:1px solid var(--parchment-dark);
            background:var(--parchment-mid);color:var(--ink-light);
            cursor:pointer;transition:background .15s,color .15s;
        }
        .layer-btn.active{background:var(--ink);color:var(--parchment);border-color:var(--ink)}

        /* ── Map markers ── */
        .map-marker-town{
            width:10px;height:10px;border-radius:50%;
            background:#2c1f0e;
            border:1px solid var(--parchment);
            box-shadow:0 4px 4px rgba(0,0,0,.3);
            cursor:pointer;
        }
        .map-marker-landmark{
            width:12px;height:12px;
            background: #b85c38;
            border:1px solid var(--parchment);
            clip-path:polygon(50% 0%,100% 100%,0% 100%);
            box-shadow:0 1px 4px rgba(0,0,0,.3);
            cursor:pointer;
        }
        .map-label{
            font-family:'Crimson Text',serif;font-size:.72rem;font-style:italic;
            color:var(--ink);white-space:nowrap;
            text-shadow:0 0 3px var(--parchment),0 0 3px var(--parchment),0 0 3px var(--parchment);
            pointer-events:none;
            transform-origin:left center;
        }

        .cap {
            font-family: 'Cinzel', serif;
            font-size: .75rem;
            font-weight: 600;
            color: var(--ink);
            text-shadow: 0 0 4px rgba(255, 255, 255, .9), 0 0 8px rgba(212, 175, 55, .6);
        }
        .map-marker-capital{
            color:#d4af37;
            font-size:18px;
            line-height:1;
            text-shadow:
                    0 0 4px rgba(255,255,255,.9),
                    0 0 8px rgba(212,175,55,.6);
        }

        .map-marker-custom{
            color: #b85c38;
            font-size:12px;
            line-height:1;
            text-shadow: 1px 1px var(--parchment);
            filter:drop-shadow(0 1px 2px rgba(0,0,0,.35));
        }
        /* Tooltip */
        .leaflet-tooltip{
            background:var(--parchment) !important;border:1.5px solid var(--parchment-dark) !important;
            border-radius:2px !important;box-shadow:2px 3px 8px rgba(44,31,14,.18) !important;
            padding:5px 12px !important;font-family:'Cinzel',serif !important;
            font-size:.75rem !important;font-weight:600 !important;letter-spacing:.1em !important;
            color:var(--ink) !important;text-transform:uppercase !important;pointer-events:none !important;
        }
        .leaflet-interactive:focus,
        .leaflet-container :focus,
        .leaflet-container .leaflet-interactive:focus {
            outline: none !important;
        }
        /* Popup */
        .leaflet-popup-content-wrapper{
            background:var(--parchment) !important;border:1.5px solid var(--parchment-dark) !important;
            border-radius:3px !important;box-shadow:3px 4px 14px rgba(44,31,14,.22) !important;
            padding:0 !important;
        }
        .leaflet-popup-content{margin:0 !important}
        .leaflet-popup-tip{background:var(--parchment) !important}
        .leaflet-popup-close-button{color:var(--ink-light) !important;top:8px !important;right:8px !important}
        .popup-inner{padding:14px 18px;min-width:200px}
        .popup-swatch{width:100%;height:4px;border-radius:1px;margin-bottom:12px}
        .popup-name{font-family:'Cinzel',serif;font-size:.95rem;font-weight:600;color:var(--ink);letter-spacing:.08em;margin-bottom:6px}
        .popup-desc{font-family:'Crimson Text',serif;font-size:.88rem;font-style:italic;color:var(--ink-light);line-height:1.45;margin-bottom:12px}
        .popup-link{
            display:inline-block;font-family:'Cinzel',serif;font-size:.68rem;font-weight:600;
            letter-spacing:.1em;text-transform:uppercase;color:var(--accent);text-decoration:none;
            border:1px solid var(--accent);padding:4px 10px;border-radius:2px;transition:background .15s,color .15s;
        }
        .popup-link:hover{background:var(--accent);color:var(--parchment)}

        /* Decorative corner marks */
        .corner{position:absolute;width:24px;height:24px;pointer-events:none;z-index:600;opacity:.4}
        .corner svg{width:100%;height:100%}
        .corner-tl{top:8px;left:8px}
        .corner-tr{top:8px;right:8px;transform:scaleX(-1)}
        .corner-bl{bottom:8px;left:8px;transform:scaleY(-1)}
        .corner-br{bottom:8px;right:8px;transform:scale(-1)}


        /* ── Scale bar ── */
        .scale-bar{
            position:absolute;
            bottom:16px;
            left:16px;
            z-index:1000;
            background:var(--parchment);
            border:1px solid var(--parchment-dark);
            border-radius:4px;
            padding:6px 10px 5px;
            box-shadow:2px 3px 8px rgba(44,31,14,.15);
            font-family:'Cinzel',serif;
            font-size:.65rem;
            font-weight:600;
            letter-spacing:.06em;
            color:var(--ink-light);
            text-transform:uppercase;
            min-width:120px;
        }
        .scale-bar-track{
            display:flex;
            height:6px;
            margin-bottom:3px;
            border:1px solid var(--parchment-dark);
            overflow:hidden;
            border-radius:1px;
        }
        .scale-bar-seg{flex:1;}
        .scale-bar-seg:nth-child(odd){background:var(--ink);}
        .scale-bar-seg:nth-child(even){background:var(--parchment);}
        .scale-bar-labels{display:flex;justify-content:space-between;}
        .scale-bar-unit{margin-top:4px;display:flex;gap:6px;justify-content:flex-end;}
        .scale-bar-unit button{
            font-family:'Cinzel',serif;font-size:.6rem;font-weight:600;
            letter-spacing:.06em;text-transform:uppercase;
            background:none;border:1px solid var(--parchment-dark);border-radius:2px;
            color:var(--ink-light);padding:1px 5px;cursor:pointer;transition:background .12s,color .12s;
        }
        .scale-bar-unit button.active{background:var(--ink);color:var(--parchment);border-color:var(--ink);}
        @media (max-width: 768px){

            .page-wrap{
                height:auto;
                min-height:100vh;
            }

            .map-wrap{
                min-height:700px;
            }

            #map{
                height:70vh;
                min-height:500px;
            }

            .map-header{
                padding:12px;
                flex-direction:column;
                align-items:flex-start;
                gap:.5rem;
            }

            .header-right{
                width:100%;
                justify-content:flex-start;
            }

            .atlas-legend{
                position:static;
                margin:12px;
                width:auto;
            }

            .layer-toggle{
                position:static;
                transform:none;
                margin:12px;
                justify-content:center;
                flex-wrap:wrap;
            }
        }