c/* Rethinking Earth — ink / amber / teal design system
   Fraunces (italic display) for the editorial voice, Inter for UI, Space Mono for
   word-points, counters and timestamps. Palette: deep-ink background, warm amber
   for the northern hemisphere, muted teal for the southern — sun and sea. */

:root{
  --bg:#0A1410;
  --ink-1:#0D1915;
  --ink-2:#122019;
  --panel:rgba(18,32,25,0.62);
  --panel-border:rgba(227,168,87,0.20);
  --panel-border-soft:rgba(244,239,228,0.10);
  --text:#F4EFE4;
  --muted:#8FA396;
  --muted-2:#5E6F65;
  --amber:#E3A857;
  --amber-ink:#2A1D0C;
  --teal:#4FB8A6;
  --teal-ink:#08211D;

  --font-display:'Fraunces', Georgia, serif;
  --font-body:'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono:'Space Mono', 'Courier New', monospace;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  min-height:100vh;
}
a{color:inherit;}
::selection{background:var(--amber);color:var(--amber-ink);}

.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 28px;
  background:linear-gradient(to bottom, rgba(10,20,16,0.9), transparent);
}
.site-nav .brand{
  font-family:var(--font-display);font-style:italic;font-weight:500;
  letter-spacing:0.01em;text-decoration:none;font-size:19px;color:var(--text);
}
.site-nav .links a{
  margin-left:22px;font-size:12px;color:var(--muted);text-decoration:none;
  font-family:var(--font-mono);text-transform:uppercase;letter-spacing:0.08em;
}
.site-nav .links a:hover, .site-nav .links a.active{color:var(--amber);}

/* ---------- Landing / globe hero ---------- */
.globe-hero{position:relative;height:100vh;width:100%;overflow:hidden;}
#globe-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;}
.hero-fade-bottom{
  position:absolute;left:0;right:0;bottom:0;height:180px;
  background:linear-gradient(to top, var(--bg), transparent);
  pointer-events:none;
}

.prompt-card{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(560px, 92vw);
  background:var(--panel);
  border:1px solid var(--panel-border);
  border-radius:6px;
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 24px 70px rgba(0,0,0,0.55);
  padding:28px 30px 24px;
  z-index:10;
}
.prompt-card .eyebrow{
  font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:0.16em;
  color:var(--amber);margin:0 0 14px;
}
.category-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px;}
.category-row label, .location-row label{
  display:block;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;
  letter-spacing:0.1em;color:var(--muted-2);margin-bottom:5px;
}
.select-wrap{flex:1;min-width:180px;}

select{
  width:100%;appearance:none;-webkit-appearance:none;
  background:rgba(244,239,228,0.05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238FA396'/%3E%3C/svg%3E") right 12px center no-repeat;
  border:1px solid var(--panel-border-soft);
  color:var(--text);
  border-radius:4px;
  padding:9px 30px 9px 12px;
  font-size:13px;
  font-family:var(--font-body);
}
select:focus{outline:1px solid var(--amber);outline-offset:1px;}

.question-text{
  font-family:var(--font-display);font-style:italic;font-weight:500;
  font-size:24px;line-height:1.32;color:var(--text);margin:18px 0 20px;min-height:64px;
}

textarea{
  width:100%;
  background:rgba(244,239,228,0.05);
  border:1px solid var(--panel-border-soft);
  color:var(--text);
  border-radius:4px;
  padding:11px 13px;
  font-size:14px;
  font-family:var(--font-body);
  resize:vertical;min-height:64px;margin-bottom:8px;
}
textarea:focus{outline:1px solid var(--amber);outline-offset:1px;}

.submit-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:6px;}
button.primary{
  background:var(--amber);color:var(--amber-ink);border:none;border-radius:4px;
  padding:11px 22px;font-weight:700;font-size:13px;cursor:pointer;
  font-family:var(--font-body);letter-spacing:0.01em;
}
button.primary:disabled{opacity:0.5;cursor:default;}
button.primary:hover:not(:disabled){filter:brightness(1.08);}

.voice-count{font-family:var(--font-mono);font-size:12px;color:var(--muted);}
.voice-count strong{color:var(--amber);font-size:15px;}
.char-count{font-family:var(--font-mono);font-size:11px;color:var(--muted-2);text-align:right;margin:-4px 0 8px;}
.form-msg{font-size:12px;margin-top:8px;min-height:16px;font-family:var(--font-body);}
.form-msg.err{color:#e08a7d;}
.form-msg.ok{color:var(--teal);}

/* ---------- Recent voices strip ---------- */
.recent-strip-wrap{position:absolute;left:0;right:0;bottom:22px;z-index:10;padding:0 24px;}
.recent-strip-label{
  font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:0.14em;
  color:var(--muted-2);margin:0 4px 8px;
}
.recent-strip{display:flex;gap:10px;overflow-x:auto;padding:4px 4px 8px;scrollbar-width:thin;}
.voice-chip{
  flex:0 0 auto;max-width:280px;
  background:var(--panel);border:1px solid var(--panel-border-soft);
  border-radius:4px;padding:8px 12px;font-size:13px;
  backdrop-filter:blur(10px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-family:var(--font-body);
}
.voice-chip .chip-topic{
  font-family:var(--font-mono);font-size:10px;color:var(--amber);margin-right:8px;letter-spacing:0.05em;
}
.voice-chip .chip-loc{color:var(--muted-2);margin-right:6px;font-size:11px;font-family:var(--font-mono);}

/* ---------- Below-fold sections on index ---------- */
.explainer{max-width:720px;margin:70px auto;padding:0 24px;text-align:center;color:var(--muted);}
.explainer h2{
  font-family:var(--font-display);font-style:italic;font-weight:500;color:var(--text);
  font-size:26px;margin-bottom:14px;
}
.explainer p{font-size:15px;line-height:1.7;}
.cta-archive{
  display:inline-block;margin-top:16px;padding:10px 22px;border:1px solid var(--panel-border);
  border-radius:4px;text-decoration:none;color:var(--text);font-family:var(--font-mono);
  font-size:12px;text-transform:uppercase;letter-spacing:0.08em;
}
.cta-archive:hover{border-color:var(--amber);color:var(--amber);}
footer.site-footer{
  text-align:center;color:var(--muted-2);font-size:11px;padding:34px 20px 54px;
  font-family:var(--font-mono);letter-spacing:0.02em;
}

/* ---------- Archive page ---------- */
.archive-wrap{max-width:900px;margin:0 auto;padding:110px 20px 60px;}
.archive-wrap h1{
  font-family:var(--font-display);font-style:italic;font-weight:500;font-size:32px;margin-bottom:6px;
}
.archive-wrap .lede{color:var(--muted);font-size:14px;}
.filters{
  display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 28px;
  background:var(--panel);border:1px solid var(--panel-border-soft);border-radius:6px;
  padding:14px 16px;backdrop-filter:blur(12px);
}
.filters select, .filters input{width:auto;min-width:140px;}
.filters input[type=text], .filters input[type=date]{
  background:rgba(244,239,228,0.05);border:1px solid var(--panel-border-soft);color:var(--text);
  border-radius:4px;padding:9px 12px;font-size:13px;font-family:var(--font-body);color-scheme:dark;
}
.date-group{margin-bottom:32px;}
.date-heading{
  font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:0.12em;
  color:var(--muted-2);margin:0 0 14px;padding-bottom:8px;border-bottom:1px solid var(--panel-border-soft);
}
.entry-card{
  background:var(--panel);border:1px solid var(--panel-border-soft);border-radius:6px;
  padding:16px 20px;margin-bottom:10px;backdrop-filter:blur(10px);
}
.entry-meta{display:flex;gap:10px;align-items:center;font-size:11px;color:var(--muted-2);margin-bottom:8px;flex-wrap:wrap;font-family:var(--font-mono);}
.topic-pill{
  padding:2px 9px;border-radius:3px;font-size:10px;font-weight:700;letter-spacing:0.06em;
  color:var(--amber);border:1px solid rgba(227,168,87,0.35);text-transform:uppercase;
}
.entry-question{
  font-family:var(--font-display);font-style:italic;font-size:14px;color:var(--muted);margin-bottom:6px;
}
.entry-text{font-size:15px;line-height:1.6;font-family:var(--font-body);}
.load-more{
  display:block;margin:22px auto;padding:10px 24px;border-radius:4px;background:transparent;
  border:1px solid var(--panel-border-soft);color:var(--text);cursor:pointer;
  font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:0.06em;
}
.load-more:hover{border-color:var(--amber);color:var(--amber);}
.empty-note{color:var(--muted-2);text-align:center;padding:44px 0;font-family:var(--font-mono);font-size:13px;}

.suggest-card{
  margin-top:54px;background:var(--panel);border:1px solid var(--panel-border-soft);border-radius:6px;
  padding:24px 26px;backdrop-filter:blur(12px);
}
.suggest-card h2{
  margin-top:0;font-family:var(--font-display);font-style:italic;font-weight:500;font-size:20px;
}
.suggest-card .muted{color:var(--muted);font-size:13px;margin-top:-6px;}
.suggest-card label{
  display:block;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;
  letter-spacing:0.1em;color:var(--muted-2);margin:12px 0 5px;
}
.suggest-card input[type=text]{
  background:rgba(244,239,228,0.05);border:1px solid var(--panel-border-soft);color:var(--text);
  border-radius:4px;padding:9px 12px;font-size:13px;font-family:var(--font-body);width:100%;
}

@media (max-width:640px){
  .prompt-card{padding:20px 20px 18px;}
  .question-text{font-size:19px;}
  .category-row{flex-direction:column;}
}