:root[data-theme="terra"]{
  color-scheme: dark;

  --ink:      #0E1E2B;
  --panel:    #16293A;
  --paper:    #EAF2EE;
  --paper-dim:#C9DAD4;
  --muted:    #7096A3;
  --red-ink:  #C1573D;
  --gold-ink: #D9A441;
  --extra-ink:#3FA06B;
  --line:     #1C3244;
  --canvas-grid-line: var(--bg-panel);
  --font-ui:  -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-type: var(--font-ui);

  --text-size: 22px;
  --height: 24px;
  --line-height: var(--height);
  --tile-radius: 6px;

  --effect-3d: 1;

  --tile-locked: #2E4E5C;
  --tile-active: #D9A441;
  --tile-text:   #EAF2EE;

  --bg:        var(--ink);
  --bg-panel:  var(--panel);
  --text:      var(--paper);
  --border:    var(--line);
  --canvas-bg: #081521;

  --vignette-fade-width: 120px;

  --bg-gradient:
    radial-gradient(circle 1.5px at 6% 12%,  rgba(234,242,238,0.75), transparent),
    radial-gradient(circle 1px   at 4% 40%,  rgba(234,242,238,0.45), transparent),
    radial-gradient(circle 1.5px at 10% 62%, rgba(217,164,65,0.55), transparent),
    radial-gradient(circle 1px   at 5% 85%,  rgba(234,242,238,0.5), transparent),
    radial-gradient(circle 1.5px at 94% 18%, rgba(234,242,238,0.65), transparent),
    radial-gradient(circle 1px   at 90% 45%, rgba(234,242,238,0.4), transparent),
    radial-gradient(circle 1.5px at 96% 68%, rgba(217,164,65,0.5), transparent),
    radial-gradient(circle 1px   at 92% 90%, rgba(234,242,238,0.55), transparent),
    linear-gradient(
      to right,
      #05090D 0%,
      #05090D calc(50% - var(--content-half-width) - var(--vignette-fade-width)),
      var(--ink) calc(50% - var(--content-half-width)),
      var(--ink) calc(50% + var(--content-half-width)),
      #05090D calc(50% + var(--content-half-width) + var(--vignette-fade-width)),
      #05090D 100%
    ) no-repeat;

  --accent-ink: #5CC28A;
  --online-ink: #A9D14A;
  --found-bg: rgba(217,164,65,0.14);
  --card-shadow: 0 2px 6px rgba(0,5,10,.4);
  --card-shadow-hover: 0 4px 14px rgba(0,5,10,.5);
  --badge-shadow: 0 1px 2px rgba(0,5,10,.35);
  --log-divider: var(--border);

  --modal-bg:          #16293A;
  --modal-ink:         var(--paper);
  --modal-muted:       #9FC2C7;
  --modal-hint:        #7BA3A8;
  --modal-accent:      var(--gold-ink);
  --modal-accent-text: var(--ink);
}

:root[data-theme="terra"].day-mode{
  color-scheme: light;

  --bg:        #EFF6F5;
  --bg-panel:  #DCEAE6;
  --text:      #0E1E2B;
  --border:    #5B93A0;
  --canvas-bg: #E3EFEC;

  --bg-gradient:
    repeating-radial-gradient(
      circle at 30% 35%,
      transparent 0px,
      transparent 19px,
      rgba(14,30,43,0.05) 19px,
      rgba(14,30,43,0.05) 20px
    ),
    linear-gradient(
      to right,
      #A9C9C6 0%,
      #A9C9C6 calc(50% - var(--content-half-width) - var(--vignette-fade-width)),
      #EFF6F5 calc(50% - var(--content-half-width)),
      #EFF6F5 calc(50% + var(--content-half-width)),
      #A9C9C6 calc(50% + var(--content-half-width) + var(--vignette-fade-width)),
      #A9C9C6 100%
    ) no-repeat;

  --tile-locked: #CFE3DD;
  --tile-active: var(--gold-ink);

  --line:      #C3DAD5;
  --canvas-grid-line: #C3DAD5;
  --tile-text: #16323D;

  --muted:        #3F6B72;
  --accent-ink:   #1E7A52;
  --online-ink:   #5D8A33;
  --card-shadow: 0 1px 3px rgba(10,50,60,.15);
  --card-shadow-hover: 0 3px 10px rgba(10,50,60,.2);
  --badge-shadow: 0 1px 2px rgba(10,50,60,.12);
  --extra-ink:    #1D6B4A;
  --repeated-ink: #7A6B4F;
  --log-divider:  #B7D2CB;

  --modal-bg:          #FBFDFC;
  --modal-ink:         var(--ink);
  --modal-muted:       #3F6B72;
  --modal-hint:        #6B98A0;
  --modal-accent:      var(--accent-ink);
  --modal-accent-text: #FFFFFF;
}