:root{
  --bg:#05070b;
  --fg:#e8eef5;
  --muted:#9aa7b4;
  --cyan:#00d7ff;
  --cyan-dim: rgba(0,215,255,.35);
  --red:#ff2a3a;
  --panel: rgba(10,14,20,.45);
  --panel-border: rgba(255,255,255,.06);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background: radial-gradient(1200px 800px at 55% 15%, rgba(0,215,255,.16), transparent 60%),
              radial-gradient(900px 700px at 70% 70%, rgba(255,42,58,.10), transparent 55%),
              var(--bg);
  color:var(--fg);
  font: 15px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;
}
a{color:inherit}
.site{min-height:100%; display:flex; flex-direction:column}
.site-header{
  position:relative;
  z-index:3;
  padding:22px 28px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}
.brand__title{
  display:inline-block;
  font-weight:700;
  text-decoration:none;
  letter-spacing:.2px;
}
.brand__desc{margin-top:4px; color:var(--muted); font-size:13px}
.site-nav nav a{margin-left:14px; color:var(--muted); text-decoration:none}
.site-nav nav a:hover{color:var(--fg)}
.site-footer{padding:18px 28px; color:var(--muted); font-size:12px; margin-top:auto}

.globe-page{flex:1; position:relative; min-height:calc(100vh - 140px)}
.globe-wrap{
  position:relative;
  height: calc(100vh - 140px);
  min-height: 520px;
  overflow:hidden;
  border-top: 1px solid var(--panel-border);
  border-bottom: 1px solid var(--panel-border);
}
.globe-canvas{
  position:absolute; inset:0;
  width:100%; height:100%;
  display:block;
}
.globe-hud{
  position:absolute; left:22px; bottom:18px; z-index:2;
  display:flex; gap:10px; align-items:center;
  padding:10px 12px;
  background: var(--panel);
  border: 1px solid var(--panel-border);
  border-radius: 14px;
  backdrop-filter: blur(10px);
}
.globe-hud__hint{color:var(--muted); font-size:12px}

.globe-tooltip{
  position:absolute;
  z-index:3;
  display:none;
  width: 240px;
  border-radius: 16px;
  overflow:hidden;
  text-decoration:none;
  background: rgba(10,14,20,.78);
  border: 1px solid rgba(255,42,58,.22);
  box-shadow: 0 18px 50px rgba(0,0,0,.55);
  backdrop-filter: blur(12px);
}
.globe-tooltip__img{
  height: 140px;
  background: rgba(255,255,255,.04);
  background-size: cover;
  background-position: center;
}
.globe-tooltip__title{
  padding: 12px 14px;
  font-weight: 650;
  font-size: 14px;
  letter-spacing: .1px;
}

.globe-data{display:none}

.content{max-width: 820px; padding: 28px; margin: 0 auto}
.post-title{margin:0 0 14px; font-size: 38px; line-height:1.1}
.post-media img{width:100%; height:auto; border-radius: 18px; border: 1px solid var(--panel-border)}
.post-body{color: rgba(232,238,245,.92)}
.post-body a{color: var(--cyan)}
.post-body a:hover{text-decoration:underline}

/* Koenig editor width classes */
.kg-width-wide{max-width: 1040px; margin-left:auto; margin-right:auto}
.kg-width-full{width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw)}
.kg-canvas img, .kg-canvas video, .kg-canvas iframe{max-width:100%}


/* Page template (Beta editor @page support) */
.gh-main{min-height:100vh}
.gh-article-header{max-width:960px;margin:0 auto;padding:64px 24px 24px}
.gh-article-title{margin:16px 0 0;font-size:40px;line-height:1.1}
.gh-article-excerpt{margin:12px 0 0;opacity:.8}
.gh-article-image{margin:0;border-radius:16px;overflow:hidden}
.gh-article-image img{display:block;width:100%;height:auto}

/* Koenig editor required width classes */
.kg-width-wide{width:100%;max-width:1200px;margin-left:auto;margin-right:auto}
.kg-width-full{width:100vw;max-width:none;margin-left:50%;transform:translateX(-50%)}
