@media (max-width: 600px){
    .banner-header{ flex-direction: column; align-items: center; text-align: center; }
    .banner-logo{ margin: 0 0 .5rem 0; }
    nav{ flex-wrap: wrap; justify-content: center; gap: .5rem; font-size: 1rem; }


    .theme-toggle {
	position: static;
	order: 2; 
	margin-left: .5rem;
	padding: .3rem .6rem;
	background: transparent;
  }

    .banner-header {
	flex-wrap: wrap;
	justify-content: center;
    }
    .banner-header nav {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
    }

    body.no-sidenotes {
	margin-left: 1em;
	margin-right: 1em;
    }

    #mobile-move-panel {
	display: block;
    }

}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
      --bg: #0f1115;
      --fg: #e6e6e6;
      --link: #8ab4ff;
      --heading: #9ecbff;
      --code-bg: #1a1d24;
      
      --note-color: #c2c7cf;
      --note-bg: transparent;
      
      --border: #2a2f3a;
      --chip-bg: #1f2330;
      --chip-fg: #cfd3da;
      --muted: #a9b0bb;
  }
    .countdown-wrap {
	color: var(--fg, #ddd);
    }
    time.countdown {
	color: var(--accent, #7abfff);
	background: color-mix(in srgb, var(--accent, #7abfff) 15%, transparent);
	box-shadow: 0 0 6px rgba(255,255,255,0.05);
    }
    time.countdown.expired {
	color: #777;
    }
}

@media (max-width: 1250px){
    #preamble.status{
	padding-right: var(--body-pad);
    }
    
    #content.content{
	padding-right: var(--body-pad);
    }
    .sidenote,
  .marginnote{
      float: none;
      clear: both;
      width: auto;
      display: block;
      margin: 0.5rem 0 0.75rem;
      padding-left: 0.75rem;
      border-left: 3px solid rgba(0,0,0,.08);
      margin-right: 0;
  }
    .fullwidth{
	max-width: calc(100vw - 2 * var(--body-pad));
    }
    .sidenote, .marginnote{
	border-left: 3px solid color-mix(in oklab, var(--fg) 12%, transparent);
    }
    .sidenote .mn-img,
  .marginnote .mn-img{
      border-color: color-mix(in oklab, var(--fg) 12%, transparent);
  }
   
  #table-of-contents{
      float: none;
      position: static;
      width: auto;
      margin: 0 0 1rem;
      padding: .5rem .75rem;
      border-right: 0;
      border-left: 3px solid color-mix(in oklab, var(--fg) 12%, transparent);
      background: color-mix(in oklab, var(--bg) 96%, var(--fg) 4%);
      border-radius: 4px;
  }

}