:root{--gold:#c9a566;--night:#07111e;--pale:#eee4d1}*{box-sizing:border-box}body{margin:0;background:var(--night);color:var(--pale);font:18px 'IM Fell English',Georgia,serif}header{height:76px;display:flex;align-items:center;gap:22px;padding:12px 24px;border-bottom:1px solid #896b39;background:#0c1726}header a{text-decoration:none;color:var(--pale)}.brand{font:34px UnifrakturCook,serif;color:#e0bd77}.tag{font:11px Cinzel,serif;letter-spacing:.2em;color:var(--gold)}nav{margin-left:auto;display:flex;gap:20px;font:12px Cinzel,serif}main{display:grid;grid-template-columns:minmax(0,1fr) 340px;height:calc(100dvh - 76px)}#viewport{position:relative;overflow:hidden;background:#1c221a;cursor:grab;touch-action:none}#viewport.drawing{cursor:crosshair}#viewport:active{cursor:grabbing}#stage{position:absolute;transform-origin:0 0;width:1000px;height:1000px}#base,#shapes{position:absolute;width:100%;height:100%;inset:0}#base{user-select:none;pointer-events:none;object-fit:fill}#shapes{overflow:visible}#shapes .pin{cursor:pointer}#shapes polygon{cursor:pointer;stroke-width:2;vector-effect:non-scaling-stroke}#shapes .vertex{fill:#fff;stroke:#111;stroke-width:1.5;vector-effect:non-scaling-stroke;pointer-events:none}.zoom{position:absolute;right:14px;bottom:20px;display:grid;gap:4px}.zoom button{font-size:22px;width:40px;height:40px}button{cursor:pointer;border:1px solid #987946;background:#14263a;color:var(--pale);padding:10px;font:13px Cinzel,serif}button:hover{background:#30425a}input,textarea{background:#0a1522;border:1px solid #745b39;color:var(--pale);padding:10px;width:100%;font:17px 'IM Fell English',serif}aside{overflow:auto;padding:24px;background:linear-gradient(#122235,#07111e)}aside h1{font:42px UnifrakturCook,serif;color:#e0bd77;margin:0}.subhead{color:var(--gold);font:12px Cinzel,serif;letter-spacing:.1em}aside label{display:block;margin:14px 0 6px}#items{margin-top:16px}#items button{display:block;text-align:left;width:100%;margin:5px 0;font:17px 'IM Fell English',serif}.note{display:block;font-size:13px;color:#c1b298}.editor{border-top:1px solid #856b42;margin-top:24px;padding-top:15px}.editor h2{font:22px Cinzel,serif}.editor p{font-size:15px;color:#c9b58f}.actions{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0}#delete{border-color:#a64b4b}.hint{position:absolute;left:14px;bottom:18px;background:#07111ed9;padding:7px 12px;font-size:13px}#draw-status{min-height:20px}@media(max-width:800px){header{gap:8px;padding:8px 12px}.brand{font-size:25px}.tag{display:none}nav{gap:10px;font-size:10px}main{grid-template-columns:1fr;grid-template-rows:minmax(55dvh,1fr) minmax(240px,35dvh);height:calc(100dvh - 76px)}aside{padding:16px}}

#tiles{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}#tiles img{position:absolute;display:block;max-width:none;user-select:none}#shapes{z-index:1}#viewport .map-unavailable{position:absolute;inset:20px auto auto 20px;color:#e0c892;background:#07111eea;padding:12px;max-width:400px;pointer-events:none} .zoom{z-index:4}.hint{z-index:4}

.editor-info{color:#e7d6b7}.editor-login{display:inline-block;color:#e0bd77;text-decoration:underline;margin-top:8px}#viewport.drawing{cursor:crosshair}#viewport.drawing:active{cursor:crosshair}#viewport.drawing #shapes .pin,#viewport.drawing #shapes polygon{pointer-events:none}
/* Bohemian Tales navigation & map markers */
.site-header{height:90px;background:linear-gradient(180deg,rgba(5,12,22,.98),rgba(5,12,22,.87));border-bottom:1px solid rgba(201,165,102,.32);padding:0 32px;gap:28px}
.site-header .brand{display:flex;gap:12px;align-items:center;min-width:250px;text-decoration:none}
.brand-symbol{font:38px Georgia,serif;color:var(--gold)}
.brand-lockup{display:flex;flex-direction:column;gap:6px}
.brand-name{font:30px/1 UnifrakturCook,Georgia,serif;color:#eee4d1}
.brand-sub{font:9px Cinzel,serif;letter-spacing:.29em;color:var(--gold)}
.site-header .tag{margin-left:6px}
.site-header nav{align-items:center}
.site-header nav a{text-transform:uppercase;font-weight:600;letter-spacing:.07em;transition:color .2s}
.site-header nav a:hover{color:var(--gold)}
.site-header nav a:last-child{border:1px solid var(--gold);padding:12px 16px;color:var(--gold)}
.site-header nav a:last-child:hover{background:var(--gold);color:#081422}
main{height:calc(100dvh - 90px)}
.map-tooltip{position:absolute;z-index:6;transform:translate(-50%,-100%);pointer-events:none;background:rgba(7,17,30,.94);border:1px solid rgba(201,165,102,.7);color:#f0dfbd;font:15px Cinzel,serif;padding:6px 10px;max-width:260px;text-align:center;box-shadow:0 5px 18px #0008;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.map-tooltip[hidden]{display:none}
#shapes .pin circle{vector-effect:non-scaling-stroke}
@media(max-width:800px){.site-header{height:76px;padding:0 12px;gap:8px}.site-header .brand{min-width:0}.brand-symbol{font-size:25px}.brand-name{font-size:23px}.brand-sub{font-size:7px}.site-header .tag{display:none}main{height:calc(100dvh - 76px)}}

/* Consistent with the main authentication header, rather than a dark flat bar. */
.site-header{background:linear-gradient(180deg,#101f32 0%,#10263b 100%);border-bottom:1px solid rgba(201,165,102,.45)}
.site-header .brand-name{color:#e5c88b;font-family:UnifrakturCook,Georgia,serif}
.site-header nav a:last-child{border-color:#c9a566;background:rgba(201,165,102,.08)}
#toggle-editor{width:100%;text-align:center;background:transparent;color:#e4c58b;border:1px solid #b8965e;letter-spacing:.07em}
#toggle-editor[aria-pressed="true"]{background:#b8965e;color:#07111e}
#editor-tools[hidden]{display:none}
#editor-tools{padding-top:10px}

/* Brandfarbe wie im Hauptauftritt und Auth-Layout */
.site-header .brand-name{color:#eee4d1}
#items button.is-selected{border-color:#c9a566;background:#28354a;color:#f4e5ca}
#shapes .draft-marker{pointer-events:none}
#shapes .draft-marker circle{vector-effect:non-scaling-stroke}

/* Kopfzeile an Startseiten-Branding angleichen */
.site-header{height:90px;padding:0 38px;gap:24px;background:linear-gradient(180deg,rgba(5,12,22,.98),rgba(5,12,22,.86));border-bottom:1px solid rgba(201,165,102,.25)}
.site-header .brand{display:flex;gap:10px;align-items:center;min-width:240px;font-weight:normal}
.site-header .brand-symbol{font-size:40px;line-height:1}
.site-header .brand-lockup{gap:0}
.site-header .brand-name{font-family:UnifrakturCook,Georgia,serif;font-size:29px;line-height:.91;color:#eee4d1;font-weight:700}
.site-header .brand-sub{font-family:Cinzel,serif;font-size:9px;letter-spacing:.29em;margin-top:7px}
.site-header nav a:last-child{border:1px solid var(--gold);padding:15px 24px;background:rgba(201,165,102,.10);color:var(--gold)}
main{height:calc(100dvh - 90px)}
@media(max-width:800px){.site-header{height:76px;padding:0 20px}.site-header .brand{min-width:0}.site-header .brand-symbol{font-size:35px}.site-header .brand-name{font-size:25px}.site-header .brand-sub{font-size:9px}.site-header nav a:last-child{padding:9px 10px}main{height:calc(100dvh - 76px)}}