.container > * {
  margin: 0em;
  padding: 0em;
  margin: 0px;
}
/* Define the grid */
.container {
  display: grid;
  grid-template-rows: auto 1fr auto;
  grid-gap: 0px;
  height: 100%;
  padding-top: 0;
}

header {
}

h1{
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
h1 a {
  text-decoration: none;
}

input#id_title {
width: 100%;
}
div.comment_body button,input
{
  border: 1px solid;
  margin-bottom: 1em;
  font-size: 0.8em;
}
img#glasses {
  max-width: 10%;
  grid-column: 1 / -1;
}

img#rss {
  max-height: 1.2em;
}
.post_summary {
  min-height: 30vh;
  padding-left: 1em;
  padding-top: 1em;
  margin-right: -3px; /* adjust closer to the next div to the right. otherwise there is a small gap */
  width: 20%;
  margin-bottom: 4em;
}
.post_details .section {
  width: 100%;
  display: block;
  overflow: auto;
}
img.post, div.chart {
  /* display: inline-block; */
}

main {
  margin-left: 5em;
  margin-right: 5em;
}

div.tags {
  float: left;
  border-bottom: 1px solid white;
}

div.ticker {
  border-left: 0px solid white;
}

/* Release 216 layout hardening: use a real desktop grid for post/ticker
   cards. Inline-block whitespace made the server-rendered first page fit only
   four 20%-wide cards; JS-appended cards later had no whitespace and fit five. */
.post_index[data-stonkys-post-feed],
.post_index[data-stonkys-ticker-index] {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: start;
  text-align: left;
}

.post_index[data-stonkys-post-feed] > .post_summary,
.post_index[data-stonkys-ticker-index] > .post_summary {
  display: block;
  width: auto;
  min-width: 0;
  margin-right: 0;
}

.post_index[data-stonkys-post-feed] > .post_summary_compressed,
.post_index[data-stonkys-ticker-index] > .post_summary_compressed {
  grid-column: 1 / -1;
}


.nimda-link-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}



.stonkys-brand-mark img {
  width: 3.3rem;
}



/* Release 223: desktop brand mark stays menu-sized, not splash-sized. */
ul#menu .stonkys-brand-mark img {
  width: 3.1rem;
  max-height: 1.45rem;
}



/* Release 224: desktop ticker pages should breathe and keep cards below chart. */
.post_details {
  width: auto;
  max-width: none;
  text-align: left;
}

.post_details .section {
  text-align: left;
}

.post_details .main {
  max-width: 44rem;
}

.post_index[data-stonkys-ticker-posts] {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: start;
  gap: 0;
  text-align: left;
}

.post_index[data-stonkys-ticker-posts] > .post_summary {
  display: block;
  width: auto;
  min-width: 0;
  margin-right: 0;
  margin-top: 0;
}



/* Release 227: ticker chart is a two-column card inside the post grid. */
.ticker-page-grid,
.post_index[data-stonkys-ticker-posts].ticker-page-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: start;
  gap: 0;
  text-align: left;
}

.ticker-page-grid > .ticker-chart-card {
  grid-column: span 2;
  width: auto;
  min-width: 0;
}

.ticker-page-grid > .post_summary {
  display: block;
  width: auto;
  min-width: 0;
  margin: 0 0 4em 0;
}

.ticker-page-grid .ticker-chart-card .ticker-chart {
  height: 38rem;
  min-height: 34rem;
}



/* Release 229: ticker chart spans two columns, but only one grid row. */
.ticker-page-grid,
.post_index[data-stonkys-ticker-posts].ticker-page-grid {
  align-items: stretch;
}

.ticker-page-grid > .ticker-chart-card {
  grid-column: span 2;
  grid-row: span 1;
  min-height: 30vh;
  padding: 1em;
}

.ticker-page-grid .ticker-chart-card .ticker-chart {
  height: auto;
  min-height: 0;
  flex: 1 1 auto;
}

.ticker-page-grid > .post_summary {
  min-height: 30vh;
  padding: 1em;
  margin: 0 0 4em 0;
}

.ticker-page-grid > .post_summary .post_summary_header {
  padding-top: 0;
}

/* Release 293: MENU is the first header item in DOM and visual order.
   The same toggle stays anchored at the top-left whether the menu is visible
   or hidden; opening the menu expands links to its right without moving it. */
header#header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
}

header#header > a#hide_menu {
  order: 0;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  overflow: hidden;
  box-sizing: border-box;
  border-bottom: 1px solid var(--background);
}

header#header > a#hide_menu p {
  float: none;
}

header#header > a#hide_menu.inverted {
  background-color: var(--forground);
  color: var(--background);
}

header#header > a#hide_menu.inverted p {
  color: var(--background);
}

header#header > a#hide_menu:hover,
header#header > a#hide_menu:focus-visible {
  background-color: var(--forground);
  color: var(--background);
  border-bottom-color: var(--forground);
  text-decoration: none;
}

header#header > a#hide_menu.inverted {
  border-bottom-color: var(--forground);
}

header#header > a#hide_menu:hover p,
header#header > a#hide_menu:focus-visible p {
  color: var(--background);
}

/* Release 386: surface unreviewed registrations beside MENU for admins. */
header#header > .new-user-menu-indicator {
  order: 1;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 2.15em;
  padding: 0.5em;
  border-bottom: 1px solid var(--background);
  background: var(--background);
  color: var(--forground);
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}

header#header > .new-user-menu-indicator:hover,
header#header > .new-user-menu-indicator:focus-visible {
  border-bottom-color: var(--forground);
  background: var(--forground);
  color: var(--background);
  text-decoration: none;
}

header#header > ul#menu {
  order: 1;
  float: none;
  flex: 1 1 auto;
  min-width: 0;
  transform-origin: left center;
}

header#header > ul#menu.stonkys-menu-slide-in {
  animation: stonkys-desktop-menu-slide-in 90ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

header#header > ul#menu.stonkys-menu-slide-out {
  animation: stonkys-desktop-menu-slide-out 70ms cubic-bezier(0.4, 0, 1, 1) both;
  pointer-events: none;
}

@keyframes stonkys-desktop-menu-slide-in {
  from {
    opacity: 0;
    transform: translateX(-0.65rem);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes stonkys-desktop-menu-slide-out {
  from {
    opacity: 1;
    transform: translateX(0);
  }
  to {
    opacity: 0;
    transform: translateX(-0.45rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  header#header > ul#menu.stonkys-menu-slide-in,
  header#header > ul#menu.stonkys-menu-slide-out {
    animation: none;
  }
}



/* Release 303: TICKERS is a first-class post-index filter row below TAGS.
   The viewport is exactly one control-line high. Ticker choices wrap into
   additional internal rows and are reached by vertical scrolling without
   increasing header height. */
header#header > .ticker-filter-bar {
  order: 2;
  flex: 0 0 100%;
  width: 100%;
  min-width: 0;
  height: 2.15em;
  display: grid;
  grid-template-columns: auto minmax(8.5em, 14em) minmax(0, 1fr);
  align-items: stretch;
  overflow: hidden;
  background: var(--background);
}

.ticker-filter-label,
.ticker-filter-items a {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.15em;
  padding: 0.45em 0.55em;
  color: var(--forground);
  background: transparent;
  text-decoration: none;
  white-space: nowrap;
}

.ticker-filter-label:hover,
.ticker-filter-items a:hover {
  color: var(--background);
  background: var(--forground);
  text-decoration: none;
}

.ticker-filter-label.ticker-selected,
.ticker-filter-items a.ticker-selected,
.ticker-filter-label.inverted,
.ticker-filter-items a.inverted {
  color: var(--background);
  background: var(--forground);
}

.ticker-filter-search {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 2.15em;
  margin: 0;
  padding: 0.35em 0.55em;
  border: 0;
  border-left: 1px solid var(--outline);
  border-right: 1px solid var(--outline);
  border-radius: 0;
  outline: none;
  background: var(--background);
  color: var(--forground);
  font: inherit;
  text-transform: uppercase;
}

.ticker-filter-search:focus {
  box-shadow: inset 0 0 0 1px var(--forground);
}

.ticker-filter-viewport {
  min-width: 0;
  height: 2.15em;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  background: var(--background);
}

.ticker-filter-items {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  min-width: 100%;
}

.ticker-filter-items a[hidden] {
  display: none !important;
}

/* Release 308: first-class TAGS / TICKERS / NIMDA / SETTINGS rows and closed-header geometry. */
header#header {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

header#header.stonkys-menu-closed {
  width: max-content;
  max-width: 100%;
  background: var(--background);
}

header#header.stonkys-menu-closed > a#hide_menu {
  background: var(--background);
}

/* Release 348: the closed-menu background rule must not override the MENU
   hover/focus inversion. Keep this selector after the closed-state rule so
   both foreground and background invert together. */
header#header.stonkys-menu-closed > a#hide_menu:hover,
header#header.stonkys-menu-closed > a#hide_menu:focus-visible {
  background: var(--forground);
  color: var(--background);
}

header#header.stonkys-menu-closed > a#hide_menu:hover p,
header#header.stonkys-menu-closed > a#hide_menu:focus-visible p {
  color: var(--background);
}


header#header > .tag-filter-bar,
header#header > .ticker-filter-bar,
header#header > .sort-filter-bar,
header#header > .nimda-menu-bar,
header#header > .settings-filter-bar {
  flex: 0 0 100%;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  background: var(--background);
}

header#header > .tag-filter-bar { order: 2; }
header#header > .ticker-filter-bar { order: 3; }
header#header > .sort-filter-bar { order: 4; }
header#header > .nimda-menu-bar { order: 5; }
header#header > .settings-filter-bar { order: 6; }

.tag-filter-bar,
.sort-filter-bar,
.nimda-menu-bar,
.settings-filter-bar {
  display: flex;
  align-items: stretch;
}

.filter-row-label,
.tag-filter-items a,
.sort-filter-items a,
.sort-filter-items .link-button,
.nimda-menu-items a,
.settings-filter-items a,
.settings-filter-items .link-button {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.15em;
  padding: 0.45em 0.55em;
  color: var(--forground);
  background: transparent;
  border: 0;
  border-radius: 0;
  font: inherit;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}

.filter-row-label {
  flex: 0 0 auto;
}

.filter-row-label[href]:hover,
.tag-filter-items a:hover,
.sort-filter-items a:hover,
.sort-filter-items .link-button:hover,
.nimda-menu-items a:hover,
.settings-filter-items a:hover,
.settings-filter-items .link-button:hover {
  color: var(--background);
  background: var(--forground);
}

.filter-row-label.inverted,
.tag-filter-items a.inverted {
  color: var(--background);
  background: var(--forground);
}

/* Release 388: sort modes are neutral choices, not filter-like inverted states. */
.sort-filter-items .sort-selected {
  background: var(--background);
  color: var(--forground);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.tag-filter-items,
.sort-filter-items,
.nimda-menu-items,
.settings-filter-items {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-wrap: wrap;
  align-items: stretch;
}

.settings-filter-items .inline-menu-form {
  display: inline-flex;
  margin: 0;
}

/* Preserve the one-line ticker viewport while moving it below TAGS. */
header#header > .ticker-filter-bar {
  height: 2.15em;
  display: grid;
  grid-template-columns: auto minmax(8.5em, 14em) minmax(0, 1fr);
  align-items: stretch;
  overflow: hidden;
}

.ticker-hover-description {
  position: fixed;
  z-index: 5000;
  max-width: min(28rem, calc(100vw - 2rem));
  padding: 0.32rem 0.5rem;
  color: var(--background);
  background: var(--forground);
  border: 1px solid var(--outline);
  font-size: 0.82rem;
  line-height: 1.25;
  text-align: left;
  text-transform: none;
  pointer-events: none;
  white-space: normal;
}

/* Release 332: theme switching lives inside the main menu. */
header#header > ul#menu {
  order: 2;
}

header#header > .tag-filter-bar { order: 3; }
header#header > .ticker-filter-bar { order: 4; }
header#header > .sort-filter-bar { order: 5; }
header#header > .nimda-menu-bar { order: 6; }

/* Release 348: reserve desktop menu-row borders at all times so hover/focus
   emphasis never changes geometry. Idle borders match the page background;
   active borders use the current theme foreground. */
header#header > ul#menu,
header#header > .tag-filter-bar,
header#header > .ticker-filter-bar,
header#header > .sort-filter-bar,
header#header > .nimda-menu-bar,
header#header > .settings-filter-bar {
  box-sizing: border-box;
  border-top: 1px solid var(--background);
  border-bottom: 1px solid var(--background);
}

header#header > ul#menu:hover,
header#header > ul#menu:focus-within,
header#header > .tag-filter-bar:hover,
header#header > .tag-filter-bar:focus-within,
header#header > .ticker-filter-bar:hover,
header#header > .ticker-filter-bar:focus-within,
header#header > .sort-filter-bar:hover,
header#header > .sort-filter-bar:focus-within,
header#header > .nimda-menu-bar:hover,
header#header > .nimda-menu-bar:focus-within,
header#header > .settings-filter-bar:hover,
header#header > .settings-filter-bar:focus-within {
  border-top-color: var(--forground);
  border-bottom-color: var(--forground);
}


/* Release 361: full right-column post media, fully visible on first load. */
.post_details .post-detail-content {
  display: grid;
  grid-template-columns: minmax(20rem, 44rem) minmax(24rem, 1fr);
  grid-template-areas:
    "body image"
    "url image"
    "reputation image";
  column-gap: 2rem;
  align-items: start;
  width: 100%;
  max-width: none;
}

.post_details .post-detail-content > .markdown-body {
  grid-area: body;
  min-width: 0;
}

.post_details .post-detail-content > .url {
  grid-area: url;
}

.post_details .post-detail-content > .post-reputation,
.post_details .post-detail-content > [data-post-reputation] {
  grid-area: reputation;
}

.post_details .post-detail-image {
  grid-area: image;
  display: block;
  justify-self: stretch;
  align-self: start;
  width: 100%;
  height: calc(100vh - 10rem);
  max-width: none;
  max-height: calc(100vh - 10rem);
  object-fit: contain;
  object-position: top right;
  margin: 0;
}

/* Release 368: desktop-only progressive disclosure.
   The primary row is permanent. The secondary rows collapse at rest and are
   temporarily revealed by the primary-row hover/focus state. */
header#header > ul#menu {
  display: flex !important;
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

header#header.stonkys-menu-closed {
  width: 100%;
  max-width: 100%;
}

header#header > [data-stonkys-menu-aux] {
  max-height: 30rem;
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  transform-origin: left top;
  pointer-events: auto;
  overflow: hidden;
  transition:
    max-height 90ms cubic-bezier(0.2, 0.8, 0.2, 1),
    opacity 90ms cubic-bezier(0.2, 0.8, 0.2, 1),
    transform 90ms cubic-bezier(0.2, 0.8, 0.2, 1),
    visibility 0s linear 0s;
}

header#header.stonkys-menu-closed:not(.stonkys-menu-peek) > [data-stonkys-menu-aux] {
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateX(-0.65rem);
  pointer-events: none;
  border-top-width: 0;
  border-bottom-width: 0;
  transition:
    max-height 70ms cubic-bezier(0.4, 0, 1, 1),
    opacity 70ms cubic-bezier(0.4, 0, 1, 1),
    transform 70ms cubic-bezier(0.4, 0, 1, 1),
    visibility 0s linear 70ms;
}

header#header.stonkys-menu-closed.stonkys-menu-peek > [data-stonkys-menu-aux] {
  max-height: 30rem;
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  pointer-events: auto;
  border-top-width: 1px;
  border-bottom-width: 1px;
  transition-delay: 0s;
}

@media (prefers-reduced-motion: reduce) {
  header#header > [data-stonkys-menu-aux],
  header#header.stonkys-menu-closed:not(.stonkys-menu-peek) > [data-stonkys-menu-aux],
  header#header.stonkys-menu-closed.stonkys-menu-peek > [data-stonkys-menu-aux] {
    transition: none;
    transform: none;
  }
}

/* Release 371: the desktop progressive-disclosure menu is an opaque surface.
   The old compact-menu implementation made the closed header transparent;
   with the permanent top row and hover-revealed auxiliary rows that allowed
   post text and media to show through the menu and through one-pixel row seams. */
header#header,
header#header.stonkys-menu-closed,
header#header.stonkys-menu-closed.stonkys-menu-peek,
header#header > ul#menu,
header#header > [data-stonkys-menu-aux] {
  background-color: var(--background);
}

header#header {
  row-gap: 0;
  column-gap: 0;
}


/* Release 372: keep the pinned-open MENU toggle visually continuous through
   the desktop row boundary. Firefox exposed the reserved idle border as a
   one-pixel background-coloured seam below the inverted toggle. */
header#header > a#hide_menu.inverted,
header#header > a#hide_menu.inverted:hover,
header#header > a#hide_menu.inverted:focus-visible {
  border-bottom: 1px solid var(--forground) !important;
  box-shadow: inset 0 -1px 0 var(--forground);
}

/* Release 374: one exact ticker search result carries its description inline,
   and ranking parameters open as a compact menu row instead of navigating away. */
.ticker-filter-single-description {
  align-items: center;
  box-sizing: border-box;
  color: var(--forground);
  display: inline-flex;
  flex: 1 1 20rem;
  min-height: 2.15em;
  min-width: 8rem;
  overflow: hidden;
  padding: 0.45em 0.65em;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
}

.ticker-filter-single-description[hidden] { display: none !important; }

header#header > .ranking-parameter-panel {
  background: var(--background);
  box-sizing: border-box;
  flex: 0 0 100%;
  max-height: min(30rem, 70vh);
  order: 6;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.7rem;
  width: 100%;
}

header#header > .nimda-menu-bar { order: 7; }
header#header > .settings-filter-bar { order: 8; }

.ranking-parameter-panel .ranking-inline-form {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(3, minmax(16rem, 1fr));
}

.ranking-parameter-panel .ranking-inline-group {
  align-self: start;
}

.ranking-parameter-panel .ranking-inline-actions,
.ranking-parameter-panel .ranking-inline-status {
  grid-column: 1 / -1;
}

.ranking-parameter-panel .ranking-inline-slider {
  grid-template-columns: minmax(8rem, 0.9fr) minmax(9rem, 1.1fr);
}

@media screen and (max-width: 1050px) and (min-width: 481px) {
  .ranking-parameter-panel .ranking-inline-form {
    grid-template-columns: repeat(2, minmax(15rem, 1fr));
  }
}

/* Release 375: PARAMETERS is visibly subordinate to RANKED, while LATEST is
   separated as the independent chronological mode.  The inline ticker
   description is placed directly after the sole match or active ticker. */
.sort-filter-divider {
  align-items: center;
  box-sizing: border-box;
  color: var(--forground);
  display: inline-flex;
  flex: 0 0 auto;
  justify-content: center;
  min-height: 2.15em;
  padding: 0 0.2em;
  user-select: none;
}

.ticker-filter-bar[data-stonkys-single-description-active="1"] .ticker-filter-single-description {
  min-width: 0;
}

.ticker-filter-single-result {
  align-items: stretch;
  display: inline-flex;
  flex: 1 1 20rem;
  max-width: 100%;
  min-width: 0;
  white-space: nowrap;
}

.ticker-filter-single-result > [data-stonkys-ticker-filter] {
  flex: 0 0 auto;
}

.ticker-filter-single-result > .ticker-filter-single-description {
  flex: 1 1 auto;
}