* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box; 
}

@keyframes slideInFromTop {
  0% {
    transform: translateY(-100%);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes slideInFromLeft {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(0);
  }
}

:root {
  --background: rgba(0, 0, 0, 1); 
  --translucent: rgba(0, 0, 0, 0.5); 
  --translucentwhite: rgba(255, 255,255, 0.8); 
  --red: rgba(255, 0, 0, 1); 
  --forground: rgba(255, 255, 255, 1);    
  --forground-05: rgba(255, 255, 255,1);    
  --text: rgba(255, 255, 255, 1);    
  --highlight: rgba(255, 0, 0, 0.5);
  --outline: rgba(100, 100, 100, 1);
  --shadow: rgba(00, 00, 00, 1);
}

html.light {
  --background: rgba(255, 255, 255, 1);
  --translucent: rgba(255, 255, 255, 0.5);
  --translucentwhite: rgba(0, 0, 0, 0.8);
  --forground: rgba(0, 0, 0, 1);
  --forground-05: rgba(0, 0, 0, 1);
  --text: rgba(0, 0, 0, 1);
  --shadow: rgba(200, 200, 200, 1);
}

.container > * {
  padding-bottom: 1em;
}

.container {
  margin-left: auto;
  margin-right: auto;
}

.content {
  min-height: 100%;
}


a:hover {
  cursor:pointer;
}

a:link, a:visited 
{
  color: var(--forground);
  text-decoration-color: var(--background);
  text-decoration: none;
  transition: text-decoration-color 250ms linear;
  transition: color 250ms linear;
}

a:hover, a:active {
  color: var(--forground);
  text-decoration: none;
  text-decoration-color: var(--forground);
  transition: text-decoration-color 250ms linear;
  transition: color 250ms linear;
}
body {
  color: var(--forground);
  font-family: Helvetica, Arial, sans-serif;
  background-color: var(--background);
  overflow-x: hidden;
}


/* removed 2024-09-19 */
div.comment_input {
  border: 1px solid var(--forground);
}
div.comment {
  border-left: 1px solid var(--forground);
  border-bottom: 0px solid var(--forground);
  padding-left: 1em;
  padding-bottom: 1em;
  border-image: linear-gradient(to right, white, black) 1;
}

div.post_comment {
text-align: left;

}
div.comment hr{
  color: var(--background);
  border-top: 0px solid var(--forground);
  margin: 0px;
  padding: 0px;
  margin-left: -1em;
  border-image: linear-gradient(to right, white, black) 1;
}

div.comment div.comment_body{
  text-align:left;
}

div.comment div.comment_body pre {
  text-align: left;
  max-width: 80%;
}
div.comment div.header {
  background-color: var(--background);
  color: var(--forground);
  display:inline-block;
  width: 100%;
}

div.comment span {
  font-size: 1em;
  vertical-align: top;
  margin-top: 0em;
  float:left;
}

div.comment span.left {
  float: left;
  display: inline-block;
  margin-right: 1em;
}

div.comment span.center {
  display: inline-block;
  margin-right: 1em;
  margin-left: 1em;
}

div.comment span.right {
  float: right;
  margin-left: 1em;
  display: inline-block;
}

div.error_code {
  font-size: 10em;
}

.dropdown-content {
  display: none;
  position: absolute;
  z-index: 1;
  width: max-content;
  background-color: var(--background);
}

.dropdown-content div.menu_button {
  width: max-content;
  padding-top: 0em;
}

.sub_menu_button:hover .dropdown-content {
  display: block;
}

div.post_details {
  margin-left: 1em;
  margin-right: 1em;
}

div.post_detail {
  margin-bottom: 0em;
  margin-left: auto;
  margin-right: auto;
  padding: 1em;
  display: block;
  vertical-align: top;
  border: 0px solid white;
  width: 90%;
}

div.section {
  padding: 0em;
  width: 100%;
  margin: auto;
}

div.square {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

h1 {
  text-transform: capitalize;
  text-align: left;
  overflow: visible;
  font-size: 2em;
  padding-right: 0.5em;
}

h1 a, h1 a:visited{
  text-decoration: none;
  text-align: left;
  margin-bottom: 1em;
}

h1 a:hover {
  text-decoration: none;
  background-color: var(--forground);
  color: var(--background);
}

h2 {
  font-size: 1.5em;
}

h3 {
  text-align:left;
  margin-top: 1em;
  color: var(--forground);
}

h4 {
  padding-bottom: 0.1em;
  color: var(--forground);
}

header {
  padding: 0px;
  margin: 0px;
  top: 0;
  text-align: center;
  position: sticky;
  z-index: 1;
}

img {
  max-width:100%;
  max-height:100%;
}

img#glasses {
  float: right;
  width: 20%;
  display: block;
  margin-right: -8%;
}

li {
  list-style: none;
}

span.user {
  margin-right: 1em;
  float: right;
  text-align: right;
  font-size: 1em;
  display: inline;
  border: 0px solid red;
}
span.id {
  margin-right: 1em;
  float: left;
  text-align: left;
  font-size: 1em;
  display: inline;
  border: 0px solid blue;
}

span.date {
  margin-right: 1em;
  float: left;
  text-align: left;
  font-size: 1em;
  display: inline;
  border: 0px solid blue;
}

div.main {
  width: 100%;
}
main {
  width: 100%;
  margin: 0 auto;
  text-align: center;
  vertical-align: middle;
}

table.edit_post input {
  width: 100%;
}

input.login {
  text-align: center;
}

small#hint_id_password1 ul {
  padding: 1em;
}

small#hint_id_password1 ul li {
  border: 0px solid red;
  padding: 0em;
  list-style: circle;
}

.post_summary {
  min-height: 80vh;
  display: inline-block;
  text-align: left;
  vertical-align: top;
  border-left:  1px solid var(--forground);
  border-right: 0px solid var(--forground);
  border-top: 1px solid var(--forground);
  border-style: solid;
  border-image: linear-gradient(to bottom, var(--forground), var(--background)) 1;
  padding-right: 0.5em;
}


/* Release 245: post-card text must remain editorial/reading text, not centered UI chrome. */
.post_summary .url,
.post_summary .markdown-body,
.post_summary .markdown-summary,
.post_summary p,
.post_summary li {
  text-align: left;
}
.post_summary img {
  width: 100%;
  margin-top: 2em;
  margin-left: -1em;
}

.post_summary h1 {
  margin-top: 0.5em;
}

span.categories { 
  white-space: nowrap;
  display: flex;
  flex-direction: row;
  margin-left: -1.0em ;
  display: inline-block;
  width: 100%;
}
span.categories a.nimda {
  color: pink;
}

div.post_summary_header {
  width: 100%;
  margin-top: -2.7em;
}

input.comment_title {
  float: left;
  margin: 0px;
}

span.categories a {
  cursor:pointer;
  padding-top: 0.2em;
  padding-bottom: 0.2em;
  padding-left: 0.5em;
  padding-right: 0.5em;
  text-decoration: none;
  text-transform: uppercase;
  float: left;
  color: var(--forground);
  background: var(--background);
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
  font-size: 0.6em;
}

span.categories a.inverted {
  text-decoration: underline;
}

span.categories a.inverted:hover {
  color: var(--background);
  background-color: var(--forground);
}

span.categories a:hover {
  color: var(--background);
  background-color: var(--forground-05);
}

span.category {
  float: right;
  display: inline-block;
}

span.category a.normal {
  cursor:pointer;
  padding: 0em;
  text-decoration: none;
  text-transform: uppercase;
  color: var(--forground);
  background: var(--background);
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
  font-size: 0.6em;
  font-weight: 900;
}

span.category a.inverted {
  cursor:pointer;
  padding-top: 0.2em;
  padding-bottom: 0.2em;
  padding-left: 0.2em;
  padding-right: 0.2em;
  text-decoration: none;
  text-transform: uppercase;
  color: var(--background);
  background: var(--forground);
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
  font-size: 0.6em;
  font-weight: 900;
}

span.category a.normal:hover {
  color: var(--background);
  background-color: var(--forground-05);
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
}

span.category a.inverted:hover {
  color: var(--forground);
  background-color: var(--forground-05);
  transition: background-color 250ms linear, color 250ms linear;
  text-decoration: underline;
}

/* post list view */
table.posts {
  width: 100%;
  font-size: 0.8em;
  padding: 0px;
  margin: 0px;
  border-spacing: 0px!important;
}

table.posts tr.header {
}

table.posts td {
  text-align:left;
  min-width: 1em;
  padding: 0.2em;
  margin: 0;
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
}

table.posts td.date {
  text-align: left;
  padding: 0.2em;
  margin: 0px;
  min-width: 2em;
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
  max-width:100%;
  white-space:nowrap;
}

td.date {
  white-space:nowrap;
}

table.posts tr {
  padding: 0px;
  margin: 0px;
}

table.posts tr td.tags {
  min-width:20%; 
  text-align:right;
}

table tr.title {
  white-space: nowrap;
}

table.posts tr td.id {
  text-align:right;
}

table.posts tr td a{
  text-decoration: none;
}

table.posts tr.header td a {
  color: var(--background);
  background: var(--forground);
  cursor:pointer;
  text-decoration: underline;
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
  transition: color 250ms linear;
  transition: text-decoration-color 250ms linear;
  text-decoration-color: var(--red);
}

table.posts tr.header td:hover {
  color: var(--background);
  background: var(--forground);
  cursor:pointer;
  text-decoration: underline;
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
  transition: color 250ms linear;
  transition: text-decoration-color 250ms linear;
  text-decoration-color: var(--red);
}

table.posts tr.body:hover a {
  color: var(--background);
  background: var(--forground);
  cursor:pointer;
  text-decoration: underline;
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
  transition: color 250ms linear;
  transition: text-decoration-color 250ms linear;
  text-decoration-color: var(--red);
}

table.posts tr.body:hover td {
  color: var(--background);
  background: var(--forground);
  cursor:pointer;
  text-decoration: underline;
  transition: background 250ms linear, color 250ms linear, border 250ms linear;
  transition: color 250ms linear;
  transition: text-decoration-color 250ms linear;
  text-decoration-color: var(--red);
}

table.posts td.tags span.category {
  margin: 0px;
  padding: 0px;
  margin: 0px;
  float:right;
}

table.posts a{
  padding: 0px;
  margin: 0px;
  font-size: 1em;
}

img {
  margin: auto;
  display: block;
}

footer {
  text-align: center;
}

canvas { 
  display: block; 
  width: 100%; 
}

div.graph_container {
  display: flex;
}

table {
width: 100%;
}

tr {
  margin-bottom: 1em;
}
td {
  vertical-align: top;
  text-align:left;
  min-width: 4em;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

input[type=number] {
  -moz-appearance: textfield;
  width: 4em;
}

textarea {
  background-color: var(--background);
  color: var(--forground);
  /*
  border-top: 1px solid var(--forground);
  border-left: 1px solid var(--forground);
  border-right: 0px solid var(--forground);
  */
  border: 1px solid var(--forground);
  max-width: 95%;
  min-width: 95%;
  min-height: 6em;
  margin-top: 2px;
  font-size: 1em;
  white-space: pre-wrap;
  min-height: 40vh;
  border-image: linear-gradient(to bottom, var(--forground), var(--background)) 1;
}

input {
  background-color: var(--background);
  color: var(--forground);
  border: 1px solid var(--forground);
  min-width: 80%;
  max-width: 95%;
  font-size: 1em;
  margin: 0em;
}

button, input[type=button], input[type=submit], input[type=reset] {
  background-color: var(--background);
  color: var(--forground);
  padding-left: 0.5em;
  padding-right: 0.5em;
  text-align: center;
  border: 1px solid var(--forground);
  font-size: 0.8em;
  cursor:pointer;
  border-radius: 0px;
  min-width: 10%;
}

input.calendar {
  background-color: var(--background);
  color: var(--forground);
  padding-left: 0.5em;
  padding-right: 0.5em;
  text-align: center;
  border: 1px solid var(--forground);
  font-size: 1em;
  cursor:pointer;
  border-radius: 5px;
  min-width: 10%;

}

div.message {
  min-height: 1.5em;
}

button:hover, input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
  color: var(--background);
  background-color: var(--forground);
  transition: background-color 250ms linear, color 250ms linear;
}

input.left {
  float:left;
}
 
input.right {
  float:right;
}

div.tagcloud_hidden {
}

div.tagcloud {
  width: 100%;
  display:block;
}

hr {
  margin-top: 2em;
  margin-bottom: 2em;
}

iframe {
  aspect-ratio: 16 / 9;
}

button:hover {
  background-color: var(--forground);
  color: var(--background);
}

div.ticker { 
  float: right;
  text-align: center;
  border-left:  0px solid var(--forground);
  border-right: 0px solid var(--forground);
  border-top: 0px solid var(--forground);
  border-bottom: 0px solid var(--forground);
  border-style: solid;
  border-image: linear-gradient(to top, var(--background), 30%, var(--forground)) 2;
}

div.chart_small {
  width: 95%;
  margin-left: -1.5em;

}
div.chart {
  padding: 0px;
  min-height: 60vh;
  width: 95%;
  resize: vertical;
}

@supports (hanging-punctuation: first) {
  q {
    hanging-punctuation: first;
  }
}

q {
  text-align: unset;
  text-indent: -0.3em;
  display: block;
}

pre {
  word-wrap: break-word; 
  white-space: pre-wrap;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  font-size: 1.2em;
  text-align: left;
}

div.url {
  text-align:left;
}

div.url a:hover {
  color: var(--background);
  background-color: var(--forground);
}

div.form {
  display: block;
}

a.selected {
  cursor:pointer;
  background-color: var(--forground);
  color: var(--background);
}

a.unselected {
  cursor:pointer;
}

/* styles set when user presses "compressed" view */
div.post_summary_compressed {
  width: 100%;
  display: inline-block;
  margin: 0px;
  padding: 0px;
  border-left:  0px solid var(--forground);
  border-right: 0px solid var(--forground);
  border-top: 1px solid var(--forground);
  border-style: solid;
  border-image: linear-gradient(to right, var(--background), 30%, var(--forground)) 2;
  border-bottom: 0px;
  margin-bottom: 1em;
  padding-left: 0.5em;
}

div.post_summary_compressed h1 {
  font-size: 1em;
  display: inline-block;
  float: left;
  overflow: hidden;
  max-width: 100%;
  margin: 0px;
}

div.post_summary_compressed img {
  margin: 0px;
  padding: 0px;
  float: left;
  width: 20%;
  font-size: 1em;
  display: inline-block;
}
div.post_summary_compressed pre.description {
  display: none;
  margin: 0px;
  padding: 0px;
  float: left;
  font-size: 1em;
}

div.menu {
  display: none;
}
div.menu_button a#close {
  display: none;
}
div.post_summary_compressed div.post_summary_header {
  display: block;
  margin-top: 0em;
  margin: 0px;
  padding: 0px;
  float: left;
  width: 100%;
}

div.post_summary_compressed div.post_summary_header span {
  display: inline-block;
  float: left;
  margin: 0px;
  padding: 0px;
}

div.post_summary_compressed div.post_summary_header span.categories { 
  float:left;
  overflow: hidden;
  white-space: hidden;
  font-size: 1em;
}

span.categories a{ 
  font-size: 0.8em;
}

div.post_summary_compressed div.post_summary_header span.user{ 
  /*flex-direction: row;*/
  display: inline-block;
  float:left;
  margin: 0px;
  padding: 0px;
}
div.post_summary_compressed div.post_summary_header span.date{ 
  display: inline-block;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  white-space: hidden;
  float:right;
}

div.post_summary_compressed div.url {
  text-align:right;
  font-size: 1em;
}

header {
  text-transform: uppercase;
  background-color: var(--background);

}
ul#menu {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  text-transform: uppercase;
  float:left;
  display:inline-block;
}

li {
  float: left;
}

li a, .dropbtn,
ul#menu .link-button {
  display: inline-block;
  color: var(--forground);
  padding: 0.5em;
  text-align: center;
  text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn,
ul#menu .link-button:hover {
  background-color: var(--forground);
  color: var(--background);
  text-decoration: none;
}
div.tags a.dropbtn:hover {
  color: var(--background);
  background-color: var(--forground);
}

li.dropdown {
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  min-width: 160px;
  z-index: 1;
}

.dropdown-content a {
  color: var(--forground);
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown:hover .dropdown-content, .dropdown:active .dropdown-content {
  display: block;
}

li a.inverted {
  color: var(--background);
  background-color: var(--forground);
}
a.pink {
  color: pink;
}

/*
svg {
  margin-top: 0px;
  padding: 0px;
}
svg#burger {
  filter: drop-shadow(0px 0px 3px rgb(255 255 255 / 0.0));

}
svg#burger:hover {
  filter: drop-shadow(0px 0px 5px rgb(255 255 255 /1));

}
*/
a#hide_menu {
  color: var(--forground);
  background: var(--translucent);
}

a#hide_menu svg {
  float:left;
  color: var(--forground);
  padding: 0.5em;
}

a#hide_menu p {
  float:left;
  padding: 0.5em;
  color: var(--forground);
}

/* Admin-only attention indicator is desktop-first; mobile keeps the existing
   compact toolbar and exposes user review through the Nimda menu. */
.new-user-menu-indicator {
  display: none;
}

div.main {
  width: 40%;
  float: left;
}
img[src*="charts"] {
  filter: invert(1);
}
html.light img[src*="charts"] {
  filter: none;
}

/* Security hardening: POST-backed menu actions rendered as links. */
.inline-menu-form,
.inline-form {
    display: inline;
    margin: 0;
    padding: 0;
}

.link-button {
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
    font: inherit;
    margin: 0;
    padding: 0;
    text-decoration: inherit;
}

.link-button:hover {
    text-decoration: underline;
}

/* CSP cleanup: moved former header inline boot colors into the static stylesheet. */
html,
body,
a {
  background: var(--background);
  color: var(--forground);
}

html.light,
html.light body,
html.light a {
  background: var(--background);
  color: var(--forground);
}

/* 216 style-CSP cleanup: classes replacing formerly inline template styles. */
.is-hidden {
  display: none;
}

.categories-left,
.float-left {
  float: left;
}

.comments-link,
.float-right {
  float: right;
}

.tag-selected {
  text-decoration: underline;
}

.ticker-negative {
  color: pink;
}

.ticker-positive {
  color: #90EE90;
}

.chart,
.chart-box {
  width: 100%;
  min-height: 320px;
}

.chart {
  height: 360px;
}

.chart-box-large {
  height: 400px;
}

.chart-box-medium {
  height: 320px;
}

.truncate-wide,
.truncate-medium {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.truncate-wide {
  max-width: 600px;
}

.truncate-medium {
  max-width: 400px;
}

.settings-group-heading {
  margin: 0.5em 0;
}

.setting-value {
  width: 100%;
}

.ticker-chart {
  width: 100%;
}

.post-image-half {
  width: 50%;
}


/* Front-end notices / API error feedback */
.stonkys-notices {
  position: fixed;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 10000;
  max-width: min(28rem, calc(100vw - 1.5rem));
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  pointer-events: none;
}

.stonkys-notice {
  border: 1px solid var(--outline);
  background: var(--background);
  color: var(--forground);
  box-shadow: 0 0 0.75rem var(--shadow);
  padding: 0.75rem 1rem;
  pointer-events: auto;
  font-size: 0.95rem;
}

.stonkys-notice-success { border-color: #33ff33; }
.stonkys-notice-info { border-color: var(--outline); }
.stonkys-notice-warning { border-color: #f2c94c; }
.stonkys-notice-error { border-color: #ff4d88; }

.stonkys-notice-title {
  font-weight: bold;
  margin-bottom: 0.25rem;
}

.stonkys-notice-message {
  overflow-wrap: anywhere;
}

.stonkys-notice-close {
  float: right;
  margin-left: 0.75rem;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
}

.is-busy {
  opacity: 0.65;
  cursor: progress;
}

/* Nimda diagnostics */
.diagnostics-table { width: 100%; }
.diag-status { white-space: nowrap; font-family: monospace; font-weight: bold; }
.diag-ok .diag-status { color: #33ff33; }
.diag-nok .diag-status { color: #ff4f4f; }
.diag-info .diag-status { color: var(--forground); }

button.donate-button {
  font-weight: 700;
}

/* Release 216 CSP/font cleanup: keep the original light-weight title feel
   without external Google Fonts. POST-backed menu buttons inherit the
   normal menu anchor styling above. */
h1,
h1 a,
.post_summary h1,
.post_summary h1 a {
  font-weight: 400;
}

.dropdown-content .inline-menu-form {
  display: block;
}

.dropdown-content .link-button {
  display: block;
  width: 100%;
  text-align: left;
}


/* Top menu POST actions must be visually indistinguishable from normal menu
   anchors. Light-theme global anchor rules are intentionally overridden here
   so hover inversion works the same in both themes. */
ul#menu .inline-menu-form {
  display: block;
  margin: 0;
  padding: 0;
}

ul#menu .link-button {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-sizing: border-box;
  color: var(--forground);
  cursor: pointer;
  display: inline-block;
  font: inherit;
  line-height: inherit;
  margin: 0;
  min-width: 0;
  padding: 0.5em;
  text-align: center;
  text-decoration: none;
  text-transform: inherit;
  vertical-align: top;
}

ul#menu li a,
ul#menu .dropbtn,
ul#menu .link-button {
  background: transparent;
  color: var(--forground);
}

ul#menu li a:hover,
ul#menu li.dropdown:hover > .dropbtn,
ul#menu .link-button:hover,
ul#menu .inline-menu-form:hover .link-button,
html.light ul#menu li a:hover,
html.light ul#menu li.dropdown:hover > .dropbtn,
html.light ul#menu .link-button:hover,
html.light ul#menu .inline-menu-form:hover .link-button {
  background-color: var(--forground);
  color: var(--background);
  text-decoration: none;
}

html.light ul#menu li a,
html.light ul#menu .dropbtn,
html.light ul#menu .link-button {
  background: transparent;
  color: var(--forground);
}

/* Admin statistics charts: first-party SVG renderer used instead of Plotly on
   Nimda statistics pages so strict style-src 'self' CSP remains intact. */
.admin-chart-svg {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 280px;
}

.admin-chart-grid {
  stroke-width: 1;
  opacity: 0.45;
}

.admin-chart-axis {
  stroke: var(--forground);
  stroke-width: 1;
  opacity: 0.8;
}

.admin-chart-line {
  stroke-width: 1.25;
  vector-effect: non-scaling-stroke;
}

.admin-chart-axis-text,
.admin-chart-axis-title,
.admin-chart-legend,
.admin-chart-empty {
  fill: var(--forground);
  font-family: "Courier New", monospace;
}

.admin-chart-axis-text {
  font-size: 12px;
}

.admin-chart-axis-title {
  font-size: 15px;
}

.admin-chart-legend {
  font-size: 13px;
}

.admin-chart-empty {
  font-size: 18px;
}

.admin-chart-bar-human {
  fill: var(--forground);
  opacity: 0.75;
}

.admin-chart-bar-bot {
  fill: #ff5c5c;
  opacity: 0.72;
}

/* 216 UI hardening: selected tag/menu states must be visibly inverted, not just
   underlined. This applies to public post tags and the top-menu tag filter. */
ul#menu li a.tag-selected,
ul#menu li a.inverted,
ul#menu .dropbtn.tag-selected,
ul#menu .dropbtn.inverted,
span.categories a.tag-selected,
span.categories a.inverted,
div.tags a.tag-selected,
div.tags a.inverted,
a.tag-selected {
  background-color: var(--forground);
  color: var(--background);
  text-decoration: none;
}

ul#menu li a.tag-selected:hover,
ul#menu li a.inverted:hover,
ul#menu .dropbtn.tag-selected:hover,
ul#menu .dropbtn.inverted:hover,
span.categories a.tag-selected:hover,
span.categories a.inverted:hover,
div.tags a.tag-selected:hover,
div.tags a.inverted:hover,
a.tag-selected:hover {
  background-color: var(--background);
  color: var(--forground);
  text-decoration: none;
}

/* Nimda pages use the same fixed global menu as public pages. Reserve vertical
   space so long statistics/site-health pages cannot scroll with their heading
   hidden behind the fixed header. */
main.nimda-main {
  padding-top: 3.25em;
  text-align: left;
}

main.nimda-main h1,
main.nimda-main h2,
main.nimda-main h3 {
  text-align: left;
}

main.nimda-main table {
  margin-left: 0;
  margin-right: auto;
}

/* First-party SVG ticker charts. Plotly is intentionally not loaded under the
   strict style-src 'self' policy because it injects runtime style rules. */
.ticker-chart-svg {
  display: block;
  width: 100%;
  min-height: 280px;
  overflow: visible;
}

.ticker-chart-grid {
  stroke: var(--outline);
  stroke-width: 1;
  opacity: 0.45;
}

.ticker-chart-axis {
  stroke: var(--forground);
  stroke-width: 1.2;
}

.ticker-chart-line {
  fill: none;
  stroke: var(--forground);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.ticker-chart-text,
.ticker-chart-axis-text,
.ticker-chart-empty {
  fill: var(--forground);
  font-family: Helvetica, Arial, sans-serif;
}

.ticker-chart-axis-text {
  font-size: 18px;
}

.ticker-chart-empty {
  font-size: 24px;
}

.ticker-percent {
  float: left;
}

/* 216 selected tag polish: active filter tags must remain visibly inverted
   in the global menu and in post summary/card tag strips. These rules are
   intentionally late and specific because older tag styles define `.inverted`
   as underline-only in some contexts. */
ul#menu a[data-stonkys-tag].tag-selected,
ul#menu a[data-stonkys-tag].inverted,
ul#menu a[data-stonkys-clear-tags].tag-selected,
ul#menu a[data-stonkys-clear-tags].inverted,
.post_summary .categories a[data-stonkys-tag].tag-selected,
.post_summary .categories a[data-stonkys-tag].inverted,
.post_summary_compressed .categories a[data-stonkys-tag].tag-selected,
.post_summary_compressed .categories a[data-stonkys-tag].inverted,
span.categories a[data-stonkys-tag].tag-selected,
span.categories a[data-stonkys-tag].inverted,
span.category a[data-stonkys-tag].tag-selected,
span.category a[data-stonkys-tag].inverted,
div.tags a[data-stonkys-tag].tag-selected,
div.tags a[data-stonkys-tag].inverted {
  background-color: var(--forground) !important;
  color: var(--background) !important;
  text-decoration: none !important;
}

ul#menu a[data-stonkys-tag].tag-selected:hover,
ul#menu a[data-stonkys-tag].inverted:hover,
ul#menu a[data-stonkys-clear-tags].tag-selected:hover,
ul#menu a[data-stonkys-clear-tags].inverted:hover,
.post_summary .categories a[data-stonkys-tag].tag-selected:hover,
.post_summary .categories a[data-stonkys-tag].inverted:hover,
.post_summary_compressed .categories a[data-stonkys-tag].tag-selected:hover,
.post_summary_compressed .categories a[data-stonkys-tag].inverted:hover,
span.categories a[data-stonkys-tag].tag-selected:hover,
span.categories a[data-stonkys-tag].inverted:hover,
span.category a[data-stonkys-tag].tag-selected:hover,
span.category a[data-stonkys-tag].inverted:hover,
div.tags a[data-stonkys-tag].tag-selected:hover,
div.tags a[data-stonkys-tag].inverted:hover {
  background-color: var(--forground) !important;
  color: var(--background) !important;
  text-decoration: none !important;
}



/* User font preferences. The default remains Helvetica/Arial. Space Mono is
   referenced by family name only; no external font provider is loaded. */
html.font-space-mono body,
html.font-space-mono button,
html.font-space-mono input,
html.font-space-mono select,
html.font-space-mono textarea {
  font-family: "Space Mono", "Courier New", Courier, monospace;
}

.profile-preference-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75em;
  align-items: center;
  margin: 0.5em 0;
}

.profile-preference-form select,
.profile-preference-form button {
  background: var(--background);
  color: var(--forground);
  border: 1px solid var(--forground);
  padding: 0.4em 0.6em;
}

.profile-preference-form button:hover,
.profile-preference-form button:focus {
  background: var(--forground);
  color: var(--background);
}

/* Release 364: text remains on the active theme foreground. Visual hierarchy
   uses size, weight, spacing, and borders instead of washed-out copy. */
.muted {
  color: var(--forground);
  opacity: 1;
}

/* Basic post Markdown and editor preview. */
.markdown-body p {
  margin: 0.55em 0;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3 {
  margin: 0.75em 0 0.35em;
  line-height: 1.1;
}

.markdown-body ul {
  margin: 0.5em 0 0.75em 1.5em;
}

.markdown-body li {
  margin: 0.25em 0;
}

.markdown-body code {
  border: 1px solid var(--outline);
  padding: 0.05em 0.25em;
}

.markdown-body pre {
  border: 1px solid var(--outline);
  padding: 0.75em;
  overflow-x: auto;
  white-space: pre-wrap;
}

.markdown-summary h1,
.markdown-summary h2,
.markdown-summary h3 {
  font-size: 1em;
}

.post-editor-preview-toolbar {
  margin: 0.75em 0;
}

.post-editor-preview-toolbar button,
.ticker-autocomplete button {
  background: var(--background);
  color: var(--forground);
  border: 1px solid var(--forground);
  padding: 0.35em 0.6em;
}

.post-editor-preview-toolbar button:hover,
.post-editor-preview-toolbar button:focus,
.ticker-autocomplete button:hover,
.ticker-autocomplete button:focus {
  background: var(--forground);
  color: var(--background);
}

.post-editor-preview {
  border: 1px solid var(--outline);
  padding: 1em;
  margin: 0.75em 0;
}

.post-editor-preview-meta {
  opacity: 1;
  margin-bottom: 0.75em;
}

.post-editor-preview img {
  max-width: min(420px, 100%);
  height: auto;
  display: block;
  margin: 0.75em 0;
}

.ticker-autocomplete {
  border: 1px solid var(--outline);
  max-width: 20em;
  margin-top: 0.25em;
  padding: 0.25em;
}

.ticker-autocomplete button {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  border-bottom: 1px solid var(--outline);
}

.ticker-autocomplete button:last-child {
  border-bottom: 0;
}


/* Post editor live preview and Markdown help. */
.post-preview {
  margin-top: 1.5em;
  border-top: 1px solid var(--outline);
  padding-top: 1em;
}

.post-preview-card {
  border: 1px solid var(--outline);
  padding: 1em;
  background: var(--background);
}

.post-preview-card .url {
  opacity: 1;
  margin-bottom: 1em;
  word-break: break-word;
}

.markdown-body p {
  margin: 0.75em 0;
}

.markdown-body ul {
  margin: 0.75em 0 0.75em 1.5em;
}

.markdown-body blockquote {
  border-left: 3px solid var(--outline);
  padding-left: 1em;
  opacity: 1;
}

.markdown-body code,
.markdown-body pre {
  border: 1px solid var(--outline);
  padding: 0.1em 0.25em;
}

.markdown-body pre {
  padding: 0.75em;
  overflow-x: auto;
}

.markdown-help {
  margin-top: 0.5em;
  border: 1px solid var(--outline);
  padding: 0.75em;
}

.markdown-help summary {
  cursor: pointer;
}

.markdown-help-grid {
  display: grid;
  gap: 0.35em;
  margin-top: 0.75em;
}

.markdown-help-grid code {
  border: 1px solid var(--outline);
  padding: 0.25em 0.4em;
}


/* Nimda/admin layout cleanup.
   The generic .square component is absolutely centered for small login-style
   pages. Long Nimda pages must remain horizontally centered but top-readable
   and scroll naturally. */
div.square.nimda-page {
  position: relative;
  top: auto;
  left: auto;
  transform: none;
  -ms-transform: none;
  width: min(1180px, calc(100vw - 3rem));
  max-width: 1180px;
  margin: 2rem auto 4rem auto;
  padding: 1rem;
}

.nimda-site-health {
  overflow-x: auto;
}

.nimda-site-health table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5rem;
}

.nimda-site-health th,
.nimda-site-health td {
  vertical-align: top;
  padding: 0.35rem 0.55rem;
  border-bottom: 1px solid var(--outline);
  word-break: break-word;
}

.nimda-site-health h1,
.nimda-site-health h2,
.nimda-site-health h3 {
  margin-top: 1.25rem;
}

.nimda-landing {
  width: min(760px, calc(100vw - 3rem));
}

.nimda-link-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
  margin-top: 1.5rem;
}

.nimda-link-grid a {
  display: block;
  border: 1px solid var(--outline);
  padding: 0.9rem 1rem;
  font-size: 1.25rem;
  line-height: 1.25;
}

.nimda-link-grid a:hover,
.nimda-link-grid a:focus {
  background: var(--forground);
  color: var(--background);
}


/* Nimda global square override.
   Nimda pages can be long editor/admin pages, so the global absolute-centered
   .square login-card behavior must not apply inside main.nimda-main. */
main.nimda-main div.square {
  position: relative;
  top: auto;
  left: auto;
  transform: none;
  -ms-transform: none;
  width: min(1180px, calc(100vw - 3rem));
  max-width: 1180px;
  margin: 2rem auto 4rem auto;
  padding: 1rem;
}

main.nimda-main {
  align-self: start;
  overflow-x: auto;
}


/* Post editor description + Markdown helper layout.
   Desktop: textarea left, collapsible helper to the right.
   Mobile: helper naturally stacks below the textarea and expands/collapses up/down. */
.post-editor-description-grid {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  width: 100%;
}

.post-editor-description-input {
  flex: 1 1 28rem;
  min-width: 0;
}

.post-editor-description-input textarea,
.post-editor-description-grid textarea {
  width: 100%;
  min-height: 14rem;
}

.markdown-help-side {
  flex: 0 0 18rem;
  max-width: 18rem;
  transition: max-width 160ms ease, flex-basis 160ms ease;
}

.markdown-help-side:not([open]) {
  flex-basis: 9rem;
  max-width: 9rem;
}

.markdown-help-side summary::before {
  content: "◀ ";
}

.markdown-help-side:not([open]) summary::before {
  content: "▶ ";
}

/* Post summaries support Markdown too, but keep headings compact inside cards. */
.markdown-summary h1 {
  font-size: 1.15em;
  margin: 0.5em 0 0.35em 0;
}

.markdown-summary h2 {
  font-size: 1.05em;
  margin: 0.45em 0 0.3em 0;
}

.markdown-summary h3 {
  font-size: 1em;
  margin: 0.4em 0 0.25em 0;
}

.markdown-summary p {
  margin: 0.45em 0;
}

.markdown-summary ul {
  margin-left: 1.25em;
}

.markdown-summary pre {
  max-height: 12em;
  overflow: auto;
}


/* Nimda action-first dashboard patterns. */
.nimda-primary-actions {
  margin: 1.25rem 0 2rem 0;
}

.nimda-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  align-items: stretch;
}

.nimda-action-button,
.nimda-action-button:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--outline);
  padding: 0.9rem 1.1rem;
  min-width: 10rem;
  font-size: 1.15rem;
  background: var(--background);
  color: var(--forground);
  text-decoration: none;
}

.nimda-action-primary,
.nimda-action-primary:visited {
  border-color: var(--outline);
  background: var(--background);
  color: var(--forground);
}

.nimda-action-button:hover,
.nimda-action-button:focus {
  background: var(--forground);
  color: var(--background);
}

.nimda-post-dashboard .nimda-post-table {
  margin-top: 0.75rem;
  width: 100%;
}

.nimda-features ul {
  margin-left: 1.5rem;
  margin-bottom: 1rem;
}

.nimda-features li {
  margin: 0.35rem 0;
}


/* Chart control alignment for post detail and Nimda statistics pages. */
.chart-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  margin-top: 0.5rem;
  margin-bottom: 1rem;
}

.chart-controls input.calendar {
  margin: 0;
  width: auto;
  min-width: 0;
}

.ticker-chart-controls,
.stats-chart-controls {
  max-width: 100%;
}

.nimda-statistics-page .chart {
  margin-bottom: 0;
}


/* Graph palette variables. Colorful graphs are opt-in per profile and per-chart checkbox. */
:root {
  --graph-positive: #39ff14;
  --graph-negative: #ff2a68;
  --graph-positive-fill: rgba(57, 255, 20, 0.18);
  --graph-negative-fill: rgba(255, 42, 104, 0.22);
  --graph-primary-line: #ff0000;
  --graph-primary-fill: rgba(110, 0, 0, 0.30);
}

html.graphs-palette-primary {
  --graph-positive: #ff0000;
  --graph-negative: #8b0000;
  --graph-positive-fill: rgba(110, 0, 0, 0.30);
  --graph-negative-fill: rgba(110, 0, 0, 0.30);
  --graph-primary-line: #ff0000;
  --graph-primary-fill: rgba(110, 0, 0, 0.30);
}

.chart-color-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border: 1px solid var(--outline);
  padding: 0.25rem 0.45rem;
}

.chart-color-toggle input {
  width: auto;
  min-width: 0;
}

.ticker-chart-start-line,
.admin-chart-start-line {
  stroke: var(--outline);
  stroke-dasharray: 4 3;
  opacity: 0.8;
}

.ticker-chart-area,
.admin-chart-area {
  pointer-events: none;
}

.ticker-chart-line-positive,
.admin-chart-line-positive,
.ticker-chart-line-negative,
.admin-chart-line-negative {
  stroke-width: 1.6;
}


/* Header glasses brand mark. */
.stonkys-brand-item {
  display: inline-flex;
  align-items: center;
}

.stonkys-brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding-right: 0.45rem;
}

.stonkys-brand-mark img {
  display: block;
  width: 3.2rem;
  max-width: 12vw;
  height: auto;
  filter: invert(1);
  opacity: 0.95;
}

html.light .stonkys-brand-mark img {
  filter: none;
}

/* First-load warp intro. Server-rendered for earliest possible first paint. */
#stonkys-warp-intro {
  position: fixed;
  inset: 0;
  z-index: 99999;
  pointer-events: none;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,0.95) 0 1px, transparent 2px),
    radial-gradient(circle at 82% 28%, rgba(255,255,255,0.70) 0 1px, transparent 2px),
    radial-gradient(circle at 46% 74%, rgba(255,255,255,0.80) 0 1px, transparent 2px),
    radial-gradient(circle at 62% 52%, rgba(255,255,255,0.55) 0 1px, transparent 2px),
    #000;
  animation: stonkys-warp-overlay-fade 1350ms ease-out forwards;
}

.stonkys-warp-stars,
.stonkys-warp-streaks,
.stonkys-warp-flash {
  position: absolute;
  inset: 0;
}

.stonkys-warp-stars {
  background:
    radial-gradient(circle at 20% 40%, rgba(255,255,255,0.9) 0 1px, transparent 2px),
    radial-gradient(circle at 74% 68%, rgba(255,255,255,0.8) 0 1px, transparent 2px),
    radial-gradient(circle at 38% 18%, rgba(255,255,255,0.7) 0 1px, transparent 2px),
    radial-gradient(circle at 91% 81%, rgba(255,255,255,0.9) 0 1px, transparent 2px);
  animation: stonkys-warp-stars-slide 900ms ease-out forwards;
}

.stonkys-warp-streaks {
  background:
    linear-gradient(100deg, transparent 0%, rgba(255,255,255,0.0) 38%, rgba(255,255,255,0.55) 50%, rgba(255,255,255,0.0) 62%, transparent 100%),
    repeating-linear-gradient(100deg, transparent 0 5.5rem, rgba(255,255,255,0.20) 5.6rem 5.75rem, transparent 5.9rem 10rem);
  transform: translateX(-120%);
  filter: blur(2px);
  animation: stonkys-warp-streak 850ms cubic-bezier(.15,.78,.25,1) forwards;
}

.stonkys-warp-glasses {
  position: absolute;
  left: 50%;
  top: 48%;
  width: min(46rem, 70vw);
  height: auto;
  transform: translate(-50%, -50%);
  filter: invert(1) blur(18px);
  opacity: 0;
  animation: stonkys-warp-glasses-desktop 1050ms cubic-bezier(.12,.78,.21,1) forwards;
}

.stonkys-warp-flash {
  background: radial-gradient(circle at 50% 50%, rgba(255,255,255,0.65), rgba(255,255,255,0.08) 28%, transparent 62%);
  opacity: 0;
  animation: stonkys-warp-flash 900ms ease-out forwards;
}

body.warp-entering header,
body.warp-entering main {
  animation: stonkys-warp-materialize 950ms cubic-bezier(.12,.78,.21,1) both;
}

@keyframes stonkys-warp-materialize {
  0% {
    opacity: 0;
    transform: translateX(-18vw) scaleX(1.55);
    filter: blur(18px);
  }
  58% {
    opacity: 1;
    transform: translateX(1.5vw) scaleX(0.97);
    filter: blur(3px);
  }
  100% {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

@keyframes stonkys-warp-overlay-fade {
  0% { opacity: 1; }
  70% { opacity: 0.82; }
  100% { opacity: 0; visibility: hidden; }
}

@keyframes stonkys-warp-stars-slide {
  0% { transform: translateX(10vw) scaleX(1.4); filter: blur(1px); }
  100% { transform: translateX(0) scaleX(1); filter: none; }
}

@keyframes stonkys-warp-streak {
  0% { transform: translateX(-120%) skewX(-12deg); opacity: 0; }
  20% { opacity: 1; }
  100% { transform: translateX(120%) skewX(-12deg); opacity: 0; }
}

@keyframes stonkys-warp-glasses-desktop {
  0% {
    opacity: 0;
    transform: translate(-78%, -50%) scaleX(1.75) scaleY(0.86);
    filter: invert(1) blur(22px);
  }
  52% {
    opacity: 0.95;
    transform: translate(-48%, -50%) scaleX(1.05) scaleY(1);
    filter: invert(1) blur(3px);
  }
  78% {
    opacity: 0.75;
    transform: translate(-50%, -50%) scale(1);
    filter: invert(1) blur(0);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.88);
    filter: invert(1) blur(4px);
  }
}

@keyframes stonkys-warp-flash {
  0% { opacity: 0; transform: scale(0.6); }
  45% { opacity: 0.55; transform: scale(1.1); }
  100% { opacity: 0; transform: scale(1.8); }
}

/* Nimda-configurable shorter warp timing. The keyframes are unchanged; only
   their durations are compressed so the visual identity remains the same. */
html.warp-fast #stonkys-warp-intro {
  animation-duration: 720ms;
}

html.warp-fast .stonkys-warp-stars {
  animation-duration: 480ms;
}

html.warp-fast .stonkys-warp-streaks {
  animation-duration: 460ms;
}

html.warp-fast .stonkys-warp-glasses {
  animation-duration: 620ms;
}

html.warp-fast .stonkys-warp-flash {
  animation-duration: 500ms;
}

html.warp-fast body.warp-entering header,
html.warp-fast body.warp-entering main {
  animation-duration: 620ms;
}

@media (prefers-reduced-motion: reduce) {
  #stonkys-warp-intro,
  body.warp-entering header,
  body.warp-entering main {
    animation: none !important;
    filter: none !important;
    transform: none !important;
  }
  #stonkys-warp-intro {
    display: none;
  }
}



/* Release 223 header/glasses CSS hardening.
   Keep the glasses mark isolated from the legacy img#glasses splash rules and
   from broad menu/link/input rules. */
ul#menu {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
}

ul#menu > li {
  float: none;
}

ul#menu .stonkys-brand-item {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

ul#menu .stonkys-brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.2rem;
  padding: 0.25rem 0.55rem 0.25rem 0.25rem;
  line-height: 0;
  background: transparent;
}

ul#menu .stonkys-brand-mark:hover,
ul#menu .stonkys-brand-mark:active {
  background: transparent;
}

ul#menu .stonkys-brand-mark img {
  display: block;
  width: 3.1rem;
  max-width: none;
  max-height: 1.45rem;
  height: auto;
  margin: 0;
  float: none;
  grid-column: auto;
  opacity: 0.92;
  filter: invert(1);
}

html.light ul#menu .stonkys-brand-mark img {
  filter: none;
}

#stonkys-warp-intro .stonkys-warp-glasses {
  max-width: none;
  max-height: none;
  margin: 0;
  float: none;
  grid-column: auto;
}

body.warp-entering {
  background-color: #000;
}



/* Release 224 chart/detail layout polish. */
.post_details,
.post_details .section,
.post_details .main,
.post_details .markdown-body,
.post_details .url,
.post_comment,
.post_comment ul,
.post_comment li {
  text-align: left;
}

.post_details .url {
  display: block;
  clear: both;
}

.post_details .main {
  float: none;
  width: min(44rem, 100%);
}

.post_details > .section {
  clear: both;
}

.post-detail-chart,
.ticker-detail-chart {
  clear: both;
  display: block;
  width: 100%;
  margin-top: 1.25rem;
  margin-bottom: 2rem;
  text-align: left;
}

.post-detail-chart .chart,
.post-detail-chart #ticker_div,
.ticker-detail-chart .ticker-chart,
.ticker-detail-chart #ticker_div {
  display: block;
  width: 100%;
  min-height: 58vh;
  height: clamp(32rem, 64vh, 52rem);
  margin: 0;
  padding: 0;
}

.ticker-chart-controls {
  justify-content: flex-end;
  align-items: center;
  clear: both;
  margin-top: 0.75rem;
  margin-bottom: 2.25rem;
}

.post_index[data-stonkys-ticker-posts] {
  clear: both;
  margin-top: 2.5rem;
  padding-top: 0.25rem;
}

.post_index[data-stonkys-ticker-posts] > .post_summary {
  overflow: hidden;
}

@media (min-width: 1000px) {
  .ticker-detail-chart .ticker-chart,
  .ticker-detail-chart #ticker_div {
    min-height: 66vh;
    height: clamp(38rem, 70vh, 58rem);
  }
}



/* Release 225 ticker detail/focus polish. */
.ticker-heading {
  display: flex;
  align-items: baseline;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.ticker-last-price {
  font-size: 0.72em;
  color: var(--forground);
  opacity: 1;
}

.ticker-chart-focus-line {
  stroke: var(--forground);
  stroke-width: 1;
  stroke-dasharray: 3 3;
  opacity: 0.7;
  pointer-events: none;
}

.ticker-chart-focus-dot {
  fill: var(--background);
  stroke: var(--forground);
  stroke-width: 2;
  pointer-events: none;
}

.ticker-chart-focus-text {
  fill: var(--forground);
  font-size: 0.72rem;
  opacity: 1;
  pointer-events: none;
}

.ticker-chart-focus-hitbox {
  fill: transparent;
  cursor: crosshair;
}



/* Release 225 Nimda version visibility. */
.nimda-version-strip {
  margin: 0.25rem 0 1rem 0;
  opacity: 1;
  text-align: left;
}



/* Release 226: the glasses are no longer displayed in the menu/header. */
.stonkys-brand-item,
.stonkys-brand-mark {
  display: none !important;
}



/* Release 227 ticker story-grid layout. */
.ticker-page {
  text-align: left;
}

.ticker-page .ticker-heading {
  margin-bottom: 0.75rem;
}

.ticker-page-grid {
  clear: both;
  margin-top: 0;
}

.ticker-chart-card {
  border-top: 1px solid var(--forground);
  min-height: 30vh;
  padding: 1em;
  overflow: hidden;
  text-align: left;
}

.ticker-chart-card-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}

.ticker-chart-card .ticker-chart {
  display: block;
  width: 100%;
  height: 28rem;
  min-height: 20rem;
  margin: 0;
  padding: 0;
}

.ticker-chart-card .ticker-chart-svg {
  display: block;
  width: 100%;
  height: 100%;
}

.ticker-chart-card .ticker-chart-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  justify-content: flex-start;
  margin: 0.65rem 0 0 0;
}

.ticker-chart-card .ticker-chart-controls input.calendar {
  width: auto;
  min-width: 0;
}

.ticker-chart-card-meta {
  margin-top: 0.5rem;
  opacity: 1;
  font-size: 0.85rem;
}

.ticker-no-posts {
  padding: 1rem;
}



/* Release 228 ticker grid fit/clipping fixes. */
.ticker-page-grid > .ticker-chart-card {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  overflow: visible;
}

.ticker-chart-card .ticker-chart {
  flex: 1 1 auto;
  min-height: 0;
  overflow: visible;
}

.ticker-chart-card .ticker-chart-svg {
  display: block;
  width: 100%;
  height: 100%;
}

.ticker-page-grid > .post_summary {
  box-sizing: border-box;
  overflow: visible;
  padding-top: 1em;
}

.ticker-page-grid > .post_summary .post_summary_header {
  display: flow-root;
  min-height: 1.4em;
  margin-top: 0;
  margin-bottom: 0.75em;
  overflow: visible;
}

.ticker-page-grid > .post_summary h1 {
  clear: both;
  margin-top: 0.65em;
}

.ticker-page-grid > .post_summary .markdown-body {
  overflow: visible;
}


/* Release 369: every mobile bottom-navigation control is hidden in base/desktop layouts.
   mobile.css is the only stylesheet allowed to expose them. */
.mobile-tags-menu,
.mobile-tickers-menu,
.mobile-sort-menu,
.mobile-nimda-menu {
  display: none;
}

/* Release 254: public feed card rhythm.
   Keep server-rendered cards and JS-appended cards visually identical: no
   negative header offset, no floated comment link inside the tag row, and no
   hidden/shifted first line at the top of each card. */
.post_index[data-stonkys-post-feed] > .post_summary,
.post_index[data-stonkys-ticker-index] > .post_summary,
.post_index[data-stonkys-ticker-posts] > .post_summary {
  box-sizing: border-box;
  overflow: visible;
  padding: 1em;
}

.post_summary > .post_summary_header,
.post_index[data-stonkys-post-feed] > .post_summary > .post_summary_header,
.post_index[data-stonkys-ticker-index] > .post_summary > .post_summary_header,
.post_index[data-stonkys-ticker-posts] > .post_summary > .post_summary_header {
  display: flow-root;
  margin-top: 0;
  margin-bottom: 0.75em;
  min-height: 1.4em;
  overflow: visible;
}

.post_summary > h1,
.post_index[data-stonkys-post-feed] > .post_summary > h1,
.post_index[data-stonkys-ticker-index] > .post_summary > h1,
.post_index[data-stonkys-ticker-posts] > .post_summary > h1 {
  clear: both;
  margin-top: 0.65em;
  overflow-wrap: anywhere;
}

.post_summary .categories,
.post_summary_compressed .categories {
  margin-left: 0;
  max-width: 100%;
  white-space: normal;
}

.post_summary .categories a,
.post_summary_compressed .categories a {
  display: inline-block;
  margin-right: 0.15em;
  width: auto;
}

.post_summary .comments-link,
.post_summary_compressed .comments-link {
  float: none;
}

.post_summary .url,
.post_summary .url a,
.post_summary .markdown-summary,
.post_summary_compressed .url,
.post_summary_compressed .url a,
.post_summary_compressed .markdown-summary {
  overflow-wrap: anywhere;
}

.post_index[data-stonkys-post-feed] > .post_summary img,
.post_index[data-stonkys-ticker-index] > .post_summary img,
.post_index[data-stonkys-ticker-posts] > .post_summary img {
  margin-left: 0;
  margin-top: 1em;
}


/* Release 255: post detail pages show the same core metadata as feed cards. */
.post_details > .post_summary_header,
.post_details > .post_detail_header {
  margin-top: 0;
  margin-bottom: 0.85rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.7rem;
  width: 100%;
  min-height: 1.6rem;
}

.post_details > .post_summary_header .id,
.post_details > .post_summary_header .date,
.post_details > .post_summary_header .user {
  display: inline-block;
  white-space: nowrap;
}

.post_details > .post_summary_header .user {
  font-weight: 700;
}

.post_details > .post_summary_header span.categories {
  display: flex;
  flex: 1 1 18rem;
  flex-wrap: wrap;
  gap: 0.25rem;
  width: auto;
  margin-left: 0;
  white-space: normal;
}

.post_details > .post_summary_header span.categories a {
  float: none;
}


/* Release 257: profile page dashboard cleanup. The old profile view used a
   login-form style centered square and raw tables; keep the terminal aesthetic,
   but make account, preference, and activity information scannable. */
.profile-page,
.profile-page * {
  box-sizing: border-box;
}

.profile-page {
  width: min(68rem, calc(100% - 2rem));
  max-width: 100%;
  margin: 2rem auto 5rem auto;
  text-align: left;
}

.profile-hero,
.profile-card {
  border: 1px solid var(--forground);
  border-image: linear-gradient(to right, var(--forground), var(--background)) 1;
  background: var(--background);
}

.profile-hero {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  padding: 1rem;
  margin-bottom: 1rem;
}

.profile-kicker {
  margin: 0 0 0.25rem 0;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  opacity: 1;
}

.profile-identity h1 {
  margin: 0;
  padding: 0;
  overflow-wrap: anywhere;
  line-height: 1;
}

.profile-subtitle {
  margin-top: 0.5rem;
}

.profile-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
}

.profile-action,
.profile-action:visited,
.profile-card-header a,
.profile-card-header a:visited,
.profile-row-action,
.profile-row-action:visited {
  display: inline-block;
  border: 1px solid var(--forground);
  padding: 0.35rem 0.55rem;
  text-transform: uppercase;
  font-size: 0.72rem;
  line-height: 1;
  background: var(--background);
  color: var(--forground);
}

.profile-action:hover,
.profile-card-header a:hover,
.profile-row-action:hover,
.profile-tags a:hover,
.profile-stat:hover {
  background: var(--forground);
  color: var(--background);
  text-decoration: none;
}

.profile-action-strong,
.profile-action-strong:visited,
.profile-pill {
  background: var(--forground);
  color: var(--background);
}

.profile-grid,
.profile-activity-grid,
.profile-preference-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.profile-card {
  padding: 1rem;
  margin-bottom: 1rem;
}

.profile-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.75rem;
}

.profile-card h2,
.profile-card-header h2 {
  margin: 0;
  padding: 0;
  font-size: 1.25rem;
  line-height: 1;
}

.profile-pill,
.profile-count {
  display: inline-block;
  border: 1px solid var(--forground);
  padding: 0.2rem 0.45rem;
  text-transform: uppercase;
  font-size: 0.72rem;
  line-height: 1;
}

.profile-facts {
  display: grid;
  gap: 0.7rem;
}

.profile-facts div {
  display: grid;
  grid-template-columns: 9rem minmax(0, 1fr);
  gap: 1rem;
  border-top: 1px solid var(--outline);
  padding-top: 0.55rem;
}

.profile-facts dt {
  text-transform: uppercase;
  font-size: 0.72rem;
  opacity: 1;
}

.profile-facts dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.profile-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.profile-stat,
.profile-stat:visited {
  display: block;
  border: 1px solid var(--forground);
  padding: 0.8rem;
  color: var(--forground);
}

.profile-stat-number,
.profile-stat-label {
  display: block;
}

.profile-stat-number {
  font-size: 2rem;
  line-height: 1;
}

.profile-stat-label {
  margin-top: 0.35rem;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
}

.profile-preferences-card {
  margin-top: 1rem;
}

.profile-preference-form {
  display: block;
  margin: 0;
}

.profile-preference-form > label {
  display: block;
  margin-bottom: 0.35rem;
  text-transform: uppercase;
  font-size: 0.72rem;
  opacity: 1;
}

.profile-control-row {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  flex-wrap: wrap;
}

.profile-control-row select {
  flex: 1 1 12rem;
  min-width: 0;
}

.profile-control-row button {
  flex: 0 0 auto;
}

.profile-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border: 1px solid var(--forground);
  padding: 0.35rem 0.55rem;
  line-height: 1;
  text-transform: uppercase;
  font-size: 0.72rem;
}

.profile-checkbox input[type="checkbox"] {
  width: auto;
  margin: 0;
}

.profile-preference-form .muted {
  margin-top: 0.55rem;
  font-size: 0.88rem;
}

.profile-activity-list {
  display: grid;
  gap: 0.7rem;
  margin: 0;
  padding: 0;
}

.profile-activity-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  border-top: 1px solid var(--outline);
  padding-top: 0.7rem;
}

.profile-activity-title,
.profile-activity-title:visited {
  color: var(--forground);
  overflow-wrap: anywhere;
  font-weight: 700;
}

.profile-activity-title:hover {
  text-decoration: underline;
}

.profile-activity-meta {
  opacity: 1;
  white-space: nowrap;
  font-size: 0.85rem;
}

.profile-empty {
  margin-top: 0.5rem;
}

.profile-post-row-main {
  min-width: 16rem;
  flex: 1 1 24rem;
}

.profile-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  justify-content: flex-end;
}

.profile-tags a,
.profile-tags a:visited {
  display: inline-block;
  border: 1px solid var(--forground);
  padding: 0.25rem 0.45rem;
  text-transform: uppercase;
  font-size: 0.65rem;
  line-height: 1;
}

/* Release 260: Nimda statistics page/card polish.
   The statistics landing page had drifted back to raw text links and the async
   chart status message wrote into the global layout message at the far left of
   the viewport. Keep statistics inside the same gradient-card/button language
   as the cleaned-up profile page. */
main.nimda-main div.square.nimda-statistics-home,
main.nimda-main div.square.nimda-statistics-page {
  box-sizing: border-box;
  position: relative;
  top: auto;
  left: auto;
  transform: none;
  -ms-transform: none;
  width: min(72rem, calc(100vw - 3rem));
  max-width: 100%;
  margin: 2rem auto 5rem auto;
  padding: 0;
  text-align: left;
  overflow: visible;
}

main.nimda-main div.square.nimda-statistics-home {
  width: min(68rem, calc(100vw - 3rem));
}

main.nimda-main div.square.nimda-statistics-traffic-page {
  width: min(76rem, calc(100vw - 3rem));
}

.nimda-statistics-home,
.nimda-statistics-page,
.nimda-statistics-home *,
.nimda-statistics-page * {
  box-sizing: border-box;
}

.nimda-stats-hero,
.nimda-stats-card,
.nimda-stats-subgroup {
  border: 1px solid var(--forground);
  border-image: linear-gradient(to right, var(--forground), var(--background)) 1;
  background: var(--background);
}

.nimda-stats-hero,
.nimda-stats-card {
  padding: 1rem;
  margin-bottom: 1rem;
}

.nimda-stats-subgroup {
  padding: 0.9rem;
  margin-top: 1rem;
}

.nimda-stats-header-row,
.nimda-stats-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 0.8rem;
}

.nimda-stats-card-header {
  align-items: center;
}

.nimda-stats-kicker {
  margin: 0 0 0.25rem 0;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  opacity: 1;
}

.nimda-stats-subtitle {
  margin: 0.35rem 0 0 0;
  opacity: 1;
  overflow-wrap: anywhere;
}

.nimda-statistics-home h1,
.nimda-statistics-home h2,
.nimda-statistics-page h1,
.nimda-statistics-page h2 {
  margin: 0;
  padding: 0;
  line-height: 1.1;
}

.nimda-stat-button-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.nimda-stat-button-grid-four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.nimda-stat-button,
.nimda-stat-button:visited,
.nimda-stat-input-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--forground);
  border-radius: 0;
  padding: 0.55rem 0.75rem;
  min-width: 0;
  max-width: 100%;
  text-transform: uppercase;
  font-size: 0.72rem;
  line-height: 1;
  letter-spacing: 0.03em;
  background: var(--background);
  color: var(--forground);
  text-decoration: none;
  white-space: normal;
}

.nimda-stat-button:hover,
.nimda-stat-button:focus,
.nimda-stat-input-button:hover,
.nimda-stat-input-button:focus {
  background: var(--forground);
  color: var(--background);
  text-decoration: none;
}

.nimda-stats-message {
  min-height: 1.5em;
  margin: 0 0 0.5rem 0;
  opacity: 1;
}

.nimda-statistics-page .chart,
.nimda-statistics-page .chart-box {
  max-width: 100%;
}

.nimda-statistics-page .stats-chart-controls {
  margin-top: 0.75rem;
}

.nimda-stats-filter-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin: 0.75rem 0 0 0;
}

.nimda-stats-filter-form input.calendar {
  width: auto;
  min-width: 0;
  max-width: 100%;
  margin: 0;
}

.nimda-table-scroll {
  max-width: 100%;
  overflow-x: auto;
}

.nimda-stats-table {
  width: 100%;
  border-collapse: collapse;
}

.nimda-stats-table td {
  vertical-align: top;
  overflow-wrap: anywhere;
}

/* Release 261: align post-card tag text with the rest of the card content.
   Tag controls keep their button padding, but the row is nudged left by the
   same visual inset so the first tag label aligns with the card copy. */
.post_index[data-stonkys-post-feed] > .post_summary > .post_summary_header .categories,
.post_index[data-stonkys-ticker-index] > .post_summary > .post_summary_header .categories,
.post_index[data-stonkys-ticker-posts] > .post_summary > .post_summary_header .categories {
  margin-left: -0.35em;
  max-width: calc(100% + 0.35em);
}

/* Release 261: logout belongs on the profile page, not hidden in the compact
   top menu dropdown. Make the profile form look exactly like the other profile
   action controls. */
.profile-logout-form {
  display: inline-block;
  margin: 0;
}

.profile-logout-form .profile-action {
  cursor: pointer;
  font-family: inherit;
}

.profile-action-danger:hover,
.profile-action-danger:focus {
  background: var(--forground);
  color: var(--background);
  text-decoration: none;
}

/* Release 262: editable public pages, footer links, and improved Nimda ticker manager. */
.content-page,
.content-page * {
  box-sizing: border-box;
}

.content-page {
  width: min(62rem, calc(100vw - 3rem));
  max-width: 100%;
  margin: 2rem auto 5rem auto;
  text-align: left;
}

.content-page-hero,
.content-page-card {
  border: 1px solid var(--forground);
  border-image: linear-gradient(to right, var(--forground), var(--background)) 1;
  background: var(--background);
  padding: 1rem;
  margin-bottom: 1rem;
}

.content-page-kicker {
  margin: 0 0 0.25rem 0;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  opacity: 1;
}

.content-page h1 {
  margin: 0;
  line-height: 1.1;
  text-align: left;
}

.content-page-subtitle {
  margin-bottom: 0;
}

.stonkys-footer {
  width: 100%;
  margin: 2rem auto 1rem auto;
  text-align: center;
}

.footer-page-links {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.45rem;
  opacity: 1;
}

.footer-page-links a,
.footer-page-links a:visited {
  color: var(--forground);
}

main.nimda-main div.square.nimda-pages-list,
main.nimda-main div.square.nimda-page-editor,
main.nimda-main div.square.nimda-ticker-manager,
main.nimda-main div.square.nimda-ticker-detail {
  box-sizing: border-box;
  width: min(76rem, calc(100vw - 3rem));
  max-width: 100%;
  margin: 2rem auto 5rem auto;
  padding: 0;
  text-align: left;
  overflow: visible;
}

.nimda-pages-list *,
.nimda-page-editor *,
.nimda-ticker-manager *,
.nimda-ticker-detail * {
  box-sizing: border-box;
}

.nimda-edit-form input[type="text"],
.nimda-edit-form input[type="number"],
.nimda-edit-form textarea,
.nimda-ticker-filter input,
.nimda-ticker-filter select {
  width: 100%;
  max-width: 100%;
  border: 1px solid var(--forground);
  background: var(--background);
  color: var(--forground);
  padding: 0.5rem 0.6rem;
}

.nimda-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1.5fr) minmax(8rem, 0.5fr);
  gap: 0.75rem;
}

.nimda-form-grid label,
.nimda-ticker-filter label {
  display: grid;
  gap: 0.25rem;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
}

.nimda-check-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 0.9rem;
}

.nimda-page-body {
  min-height: 22rem;
  font-family: inherit;
}

.nimda-page-errors {
  margin: 0.25rem 0 0 1.2rem;
}

.nimda-table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.nimda-table-actions .nimda-action-button {
  min-width: 0;
  padding: 0.45rem 0.55rem;
  font-size: 0.72rem;
  text-transform: uppercase;
}

.nimda-state-pill {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--forground);
  padding: 0.15rem 0.4rem;
  text-transform: uppercase;
  font-size: 0.66rem;
  line-height: 1;
  white-space: nowrap;
}

.nimda-state-pill.state-ok {
  background: var(--forground);
  color: var(--background);
}

.nimda-state-pill.state-stale,
.nimda-state-pill.state-never,
.nimda-state-pill.state-unknown,
.nimda-state-pill.state-neutral {
  background: var(--background);
  color: var(--forground);
}

.nimda-ticker-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
}

.nimda-ticker-stat {
  border: 1px solid var(--outline);
  padding: 0.75rem;
}

.nimda-ticker-stat-number,
.nimda-ticker-stat-label {
  display: block;
}

.nimda-ticker-stat-number {
  font-size: 1.5rem;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.nimda-ticker-stat-label {
  text-transform: uppercase;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  opacity: 1;
  margin-top: 0.25rem;
}

.nimda-ticker-filter {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(12rem, 0.6fr) auto auto;
  gap: 0.55rem;
  align-items: end;
}

.nimda-ticker-symbol {
  font-weight: bold;
  letter-spacing: 0.04em;
}

.nimda-pages-table th,
.nimda-ticker-table th,
.nimda-ticker-post-table th {
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  opacity: 1;
}

.nimda-pages-table td,
.nimda-ticker-table td,
.nimda-ticker-post-table td {
  padding: 0.5rem 0.55rem;
  border-bottom: 1px solid var(--outline);
}

/* Release 264-267: post-card bottom actions and public article submissions. */
.post_summary .post-card-tags,
.post_summary_compressed .post-card-tags,
span.categories.post-card-tags {
  margin-left: -0.5em;
  max-width: calc(100% + 0.5em);
}

.post-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: baseline;
  justify-content: flex-start;
  margin-top: 0.9rem;
  padding-top: 0;
  border-top: 0;
  clear: both;
  font-size: 0.72rem;
  line-height: 1.25;
}

.post-card-action,
.post-card-action:visited,
.post_summary .post-card-actions a,
.post_summary_compressed .post-card-actions a {
  display: inline;
  border: 0;
  padding: 0;
  min-width: 0;
  width: auto;
  background: transparent;
  color: var(--forground);
  text-decoration: none;
  text-transform: none;
  font-size: inherit;
  line-height: inherit;
  float: none;
}

.post-card-action:hover,
.post-card-action:focus,
.post_summary .post-card-actions a:hover,
.post_summary_compressed .post-card-actions a:hover {
  background: transparent;
  color: var(--forground);
  text-decoration: underline;
}

.public-submit-form {
  display: grid;
  gap: 0.85rem;
}

.public-submit-form label {
  display: grid;
  gap: 0.25rem;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
}

.public-submit-form input[type="text"],
.public-submit-form input[type="url"],
.public-submit-form input[type="email"],
.public-submit-form textarea {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--forground);
  background: var(--background);
  color: var(--forground);
  padding: 0.55rem 0.65rem;
  font: inherit;
  text-transform: none;
  letter-spacing: normal;
}

.submission-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.submission-tag-picker {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

.submission-tag-picker legend {
  margin: 0 0 0.35rem 0;
  padding: 0;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
}

.submission-tag-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.submission-tag-input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.public-submit-form .submission-tag-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 2rem;
  padding: 0.4rem 0.65rem;
  border: 1px solid var(--forground);
  background: var(--background);
  color: var(--forground);
  cursor: pointer;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
}

.submission-tag-input:checked + .submission-tag-button {
  background: var(--forground);
  color: var(--background);
}

.submission-tag-input:focus-visible + .submission-tag-button {
  outline: 2px solid var(--forground);
  outline-offset: 2px;
}

.submission-tag-button:hover {
  text-decoration: underline;
}

.submission-tag-empty {
  margin: 0;
}

.submission-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.submission-button,
.submission-button:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--forground);
  padding: 0.65rem 0.9rem;
  background: var(--background);
  color: var(--forground);
  text-decoration: none;
  text-transform: uppercase;
  font: inherit;
  cursor: pointer;
}

.submission-button:hover,
.submission-button:focus,
.submission-primary:hover,
.submission-primary:focus {
  background: var(--forground);
  color: var(--background);
  text-decoration: none;
}

.submission-success,
.submission-errors {
  border-image: linear-gradient(to right, var(--forground), var(--background)) 1;
}

main.nimda-main div.square.nimda-submissions-list,
main.nimda-main div.square.nimda-submission-detail {
  box-sizing: border-box;
  width: min(76rem, calc(100vw - 3rem));
  max-width: 100%;
  margin: 2rem auto 5rem auto;
  padding: 0;
  text-align: left;
  overflow: visible;
}

.nimda-submissions-list *,
.nimda-submission-detail * {
  box-sizing: border-box;
}

.nimda-submission-detail .nimda-full-label {
  display: grid;
  gap: 0.25rem;
  margin-top: 0.75rem;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
}

.nimda-submissions-table th,
.nimda-submissions-table td {
  padding: 0.5rem 0.55rem;
  border-bottom: 1px solid var(--outline);
  vertical-align: top;
}

.nimda-submission-filters .nimda-action-button {
  min-width: 0;
}

.setting-checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}


/* Release 267: remove all visual separators around post-card bottom action text.
   The edit/comments row is metadata-style text, not a footer control area. */
.post_summary > .post-card-actions,
.post_summary_compressed > .post-card-actions,
.post_index[data-stonkys-post-feed] > .post_summary > .post-card-actions,
.post_index[data-stonkys-ticker-index] > .post_summary > .post-card-actions,
.post_index[data-stonkys-ticker-posts] > .post_summary > .post-card-actions {
  border: 0 !important;
  border-top: 0 !important;
  border-image: none !important;
  box-shadow: none !important;
  background-image: none !important;
  padding-top: 0 !important;
}

.post_summary > .post-card-actions::before,
.post_summary_compressed > .post-card-actions::before {
  content: none !important;
  display: none !important;
}

.post_summary .markdown-summary + .post-card-actions,
.post_summary_compressed .markdown-summary + .post-card-actions {
  border-top: 0 !important;
  margin-top: 0.75rem;
}

.post_summary .markdown-summary > hr:last-child,
.post_summary_compressed .markdown-summary > hr:last-child {
  display: none;
}

/* Reputation-specific data UI. The public explainer itself uses the shared
   content-page/content-article layout and typography. */
.comment-reputation,
.comment-reputation * {
  box-sizing: border-box;
}

.reputation-formula {
  width: 100%;
  overflow-x: auto;
  margin: 1rem 0;
  border: 0;
  border-left: 2px solid var(--outline);
  padding: 0.65rem 0 0.65rem 1rem;
  font-size: 0.9rem;
  line-height: 1.5;
  white-space: pre-wrap;
  background: transparent;
}

.reputation-facts {
  margin: 1rem 0;
}

.reputation-facts-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 2rem;
}

.reputation-facts > div {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  min-width: 10rem;
}

.reputation-facts dt {
  text-transform: uppercase;
  font-size: 0.68rem;
  letter-spacing: 0.07em;
  opacity: 1;
}

.reputation-facts dd {
  margin: 0;
}

.reputation-dimension-list,
.reputation-concept-list {
  margin: 1rem 0 0 0;
}

.reputation-dimension-list > div,
.reputation-concept-list > div {
  display: grid;
  grid-template-columns: minmax(9rem, 0.28fr) minmax(0, 1fr);
  gap: 1.2rem;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--outline);
}

.reputation-dimension-list dt,
.reputation-concept-list dt {
  font-weight: bold;
}

.reputation-dimension-list dd,
.reputation-concept-list dd {
  margin: 0;
}

.reputation-dimension-list dd {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.reputation-tier-table {
  width: min(36rem, 100%);
  margin: 1rem 0;
  border-collapse: collapse;
}

.reputation-tier-table th,
.reputation-tier-table td {
  padding: 0.45rem 0.65rem 0.45rem 0;
  border-bottom: 1px solid var(--outline);
  text-align: left;
  vertical-align: top;
}

.reputation-tier-table th {
  text-transform: uppercase;
  font-size: 0.68rem;
  letter-spacing: 0.07em;
  opacity: 1;
}

.comment-reputation {
  clear: both;
  margin: 0.65rem 0 0.8rem 0;
  font-size: 0.76rem;
  line-height: 1.4;
}

.comment-reputation-scores {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.75rem;
  align-items: baseline;
}

.comment-reputation-score {
  white-space: nowrap;
}

.comment-rating-panel {
  margin-top: 0.35rem;
}

.comment-rating-panel > summary {
  cursor: pointer;
  display: inline-block;
  list-style: none;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.comment-rating-panel > summary::-webkit-details-marker {
  display: none;
}

.comment-rating-dimensions {
  display: grid;
  gap: 0.3rem;
  margin-top: 0.45rem;
}

.comment-rating-dimension {
  display: grid;
  grid-template-columns: minmax(7rem, auto) minmax(0, 1fr);
  gap: 0.6rem;
  align-items: baseline;
}

.comment-rating-label {
  text-transform: uppercase;
  font-size: 0.68rem;
  letter-spacing: 0.06em;
}

.comment-rating-values {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: baseline;
}

.reputation-rating-value,
.reputation-rating-clear {
  appearance: none;
  border: 0;
  padding: 0;
  min-width: 0;
  width: auto;
  background: transparent;
  color: var(--forground);
  font: inherit;
  line-height: inherit;
  cursor: pointer;
  text-decoration: none;
}

.reputation-rating-value:hover,
.reputation-rating-value:focus,
.reputation-rating-clear:hover,
.reputation-rating-clear:focus {
  background: transparent;
  color: var(--forground);
  text-decoration: underline;
}

.reputation-rating-value.selected {
  font-weight: bold;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.reputation-rating-clear {
  margin-left: 0.35rem;
  opacity: 1;
}

.comment-rating-self-note {
  display: inline-block;
  margin-top: 0.35rem;
}

.profile-reputation-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.profile-reputation-primary {
  border: 1px solid var(--outline);
  padding: 0.65rem;
  min-width: 0;
}

.profile-reputation-primary .profile-stat-number {
  overflow-wrap: anywhere;
}

.profile-reputation-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.9rem;
  margin-top: 0.75rem;
  font-size: 0.75rem;
  opacity: 1;
}

.profile-reputation-dimensions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: 0.55rem;
  margin-top: 0.8rem;
}

.profile-reputation-dimensions > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.15rem 0.65rem;
  border-top: 1px solid var(--outline);
  padding-top: 0.4rem;
}

.profile-reputation-dimensions small {
  grid-column: 1 / -1;
  opacity: 1;
}

/* Release 274: editable public pages read as continuous articles, not a stack
   of title/body cards. Submission intake and review share the post Markdown
   editor renderer so preview semantics stay aligned with published posts. */
.content-article-page {
  width: min(58rem, calc(100vw - 3rem));
}

.content-article {
  width: 100%;
  max-width: 100%;
  text-align: left;
}

.content-article-header {
  margin: 0 0 1.6rem 0;
  padding: 0 0 1.1rem 0;
  border-bottom: 1px solid var(--outline);
}

.content-article-header h1 {
  margin: 0;
  line-height: 1.08;
}

.content-article-body {
  max-width: 54rem;
}

/* The page title already supplies the document H1. Older seeded page bodies
   may begin with the same Markdown H1; suppress only that leading duplicate. */
.content-article-body > h1:first-child {
  display: none;
}

.content-article-body h2 {
  margin-top: 1.8rem;
}

.content-article-body h3 {
  margin-top: 1.35rem;
}

.content-article-body p,
.content-article-body ul,
.content-article-body ol,
.content-article-body blockquote,
.content-article-body pre {
  max-width: 52rem;
}

.submission-markdown-editor {
  margin-top: 0.25rem;
}

.public-submit-form [data-markdown-source],
.nimda-submission-detail [data-markdown-source] {
  width: 100%;
  max-width: 100%;
  min-height: 16rem;
  box-sizing: border-box;
  border: 1px solid var(--forground);
  background: var(--background);
  color: var(--forground);
  padding: 0.65rem;
  font: inherit;
  text-transform: none;
  letter-spacing: normal;
}

.submission-markdown-preview {
  margin-top: 1rem;
}

.submission-markdown-preview .post-preview-card {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* Release 289: first-class public profile fields; shared profile layout retained. */
.public-profile-identity-row,
.profile-public-editor {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

.profile-avatar {
  display: block;
  width: 4rem;
  height: 4rem;
  border: 1px solid var(--forground);
  object-fit: cover;
  background: var(--background);
}

.profile-avatar-large {
  width: 7rem;
  height: 7rem;
  flex: 0 0 7rem;
}

.profile-avatar-fallback {
  display: grid;
  place-items: center;
  font-size: 2.5rem;
  font-weight: 700;
  text-transform: uppercase;
}

.public-reputation-score {
  margin: 0.75rem 0 0 0;
}

.public-reputation-score .profile-stat-number {
  display: inline-block;
  margin-right: 0.5rem;
}

.public-reputation-score .profile-stat-label {
  display: inline-block;
}

.profile-public-editor {
  display: grid;
  grid-template-columns: minmax(14rem, 0.8fr) minmax(0, 2fr);
}

.profile-avatar-editor,
.profile-public-form {
  min-width: 0;
}

.profile-avatar-editor {
  display: grid;
  gap: 0.75rem;
  align-content: start;
}

.profile-public-form {
  display: grid;
  gap: 0.55rem;
}

.profile-public-form > label {
  margin-top: 0.35rem;
  text-transform: uppercase;
  font-size: 0.72rem;
  opacity: 1;
}

.profile-public-form textarea {
  resize: vertical;
  min-height: 10rem;
}

.public-profile-location {
  margin: 0 0 1rem 0;
  font-weight: 700;
}

.profile-private-card h2 {
  margin-top: 0;
}


/* Release 317: /tags is a true weighted tag cloud, not a second post index. */
.tag-cloud-page {
  width: min(72rem, calc(100% - 2rem));
  max-width: 100%;
  margin: 3rem auto 6rem;
}

.tag-cloud {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 0.35rem 0.8rem;
  padding: clamp(1.25rem, 4vw, 3.5rem);
  border: 1px solid var(--forground);
  border-image: linear-gradient(to right, var(--forground), var(--background)) 1;
  background: var(--background);
  line-height: 1.15;
}

.tag-cloud-item,
.tag-cloud-item:visited {
  display: inline-block;
  padding: 0.12em 0.18em;
  color: var(--forground);
  background: transparent;
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: none;
  overflow-wrap: anywhere;
  transition: transform 120ms ease, background-color 120ms ease, color 120ms ease;
}

.tag-cloud-item:hover,
.tag-cloud-item:focus-visible {
  color: var(--background);
  background: var(--forground);
  text-decoration: none;
  transform: translateY(-0.08em);
}

.tag-cloud-weight-1 { font-size: 0.78rem; opacity: 1; }
.tag-cloud-weight-2 { font-size: 0.92rem; opacity: 1; }
.tag-cloud-weight-3 { font-size: 1.08rem; opacity: 1; }
.tag-cloud-weight-4 { font-size: 1.3rem; }
.tag-cloud-weight-5 { font-size: 1.6rem; }
.tag-cloud-weight-6 { font-size: 2rem; }
.tag-cloud-weight-7 { font-size: clamp(2.3rem, 5vw, 3.4rem); }

/* Release 317: account/interface controls live on /settings, not inside /profile. */
.settings-page .settings-appearance-card {
  margin-bottom: 1rem;
}

.settings-page .profile-preference-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.settings-page .settings-signin-note {
  border: 1px solid var(--outline);
  padding: 0.8rem;
}

.settings-page .settings-signin-note p:first-child {
  margin-top: 0;
}

.settings-page .settings-signin-note p:last-child {
  margin-bottom: 0;
}

.settings-action-stack {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem;
}

/* Release 332: theme switching is an ordinary menu action; no persistent quick toggle. */



/* 338 post editor tag cleanup: suppress the duplicate global tag-filter row
   on add/edit pages. Preserve the existing tag geometry and only make the
   selected state explicit in both light and dark themes. */
body.post-editor-page #tag_filter_bar {
  display: none !important;
}

body.post-editor-page a[data-post-tag-id].selected,
body.post-editor-page a[data-post-tag-id][aria-pressed="true"] {
  background-color: var(--forground) !important;
  color: var(--background) !important;
  text-decoration: none !important;
}

body.post-editor-page a[data-post-tag-id].selected:hover,
body.post-editor-page a[data-post-tag-id][aria-pressed="true"]:hover {
  background-color: var(--forground) !important;
  color: var(--background) !important;
}


/* Nimda media browser */
.nimda-media-filters { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; margin-bottom: 1rem; }
.nimda-media-filters label { display: grid; gap: .25rem; }
.nimda-media-summary { margin: .5rem 0 1rem; }
.nimda-media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }
.nimda-media-card { border: 1px solid var(--forground); min-width: 0; }
.nimda-media-preview { display: grid; place-items: center; min-height: 160px; background: var(--background); overflow: hidden; }
.nimda-media-preview img { display: block; width: 100%; height: 180px; object-fit: contain; }
.nimda-media-card-body { display: grid; gap: .3rem; padding: .65rem; overflow-wrap: anywhere; }
.nimda-media-badge { width: fit-content; border: 1px solid currentColor; padding: .1rem .35rem; text-transform: uppercase; font-size: .75rem; }
.nimda-media-detail-preview { max-width: 900px; margin-bottom: 1rem; }
.nimda-media-detail-preview img { display: block; max-width: 100%; max-height: 70vh; object-fit: contain; }

/* Release 365: transparent, user-adjustable public feed ranking. */
.sort-filter-items .link-button {
  min-width: 0;
  margin: 0;
}

.ranking-page .content-article-body section {
  margin-bottom: 3rem;
}

.ranking-parameter-form,
.ranking-reset-form {
  margin: 1rem 0;
}

.ranking-sort-choice,
.ranking-parameter-group {
  border: 1px solid var(--outline);
  margin: 1rem 0;
  padding: 1rem;
}

.ranking-sort-choice legend,
.ranking-parameter-group legend {
  color: var(--forground);
  font-weight: 700;
  padding: 0 0.35rem;
}

.ranking-sort-choice {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.5rem;
}

.ranking-sort-choice label {
  align-items: center;
  display: inline-flex;
  gap: 0.4rem;
  text-transform: uppercase;
}

.ranking-sort-choice input[type="radio"] {
  margin: 0;
  min-width: 0;
  width: auto;
}

.ranking-slider-row {
  align-items: center;
  border-top: 1px solid var(--outline);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(14rem, 1fr) minmax(18rem, 1.2fr);
  padding: 1rem 0;
}

.ranking-slider-row:first-of-type {
  border-top: 0;
}

.ranking-slider-copy,
.ranking-slider-control {
  display: grid;
  gap: 0.35rem;
}

.ranking-slider-copy strong,
.ranking-slider-copy span,
.ranking-slider-control output {
  color: var(--forground);
}

.ranking-slider-control {
  align-items: center;
  grid-template-columns: minmax(10rem, 1fr) minmax(7rem, auto);
}

.ranking-slider-control input[type="range"] {
  accent-color: var(--forground);
  margin: 0;
  max-width: none;
  min-width: 0;
  width: 100%;
}

.ranking-slider-control output {
  font-variant-numeric: tabular-nums;
  min-width: 7rem;
  text-align: right;
  white-space: nowrap;
}

.ranking-actions {
  display: flex;
  justify-content: flex-start;
}

.ranking-actions button,
.ranking-reset-form button {
  min-width: 0;
}

@media screen and (max-width: 720px) {
  .ranking-slider-row,
  .ranking-slider-control {
    grid-template-columns: minmax(0, 1fr);
  }

  .ranking-slider-control output {
    min-width: 0;
    text-align: left;
  }
}

/* Release 373: discreet, theme-aware post-card rating indicator and voting popover. */
.post-card-rating {
  position: relative;
  margin-left: auto;
  flex: 0 0 auto;
}

.post-card-rating-trigger,
.post-card-rating-save,
.post-card-rating-close,
.post-card-rating-auth-prompt button,
.post-card-rating-value {
  appearance: none;
  border: 0;
  padding: 0;
  min-width: 0;
  width: auto;
  background: transparent;
  color: var(--forground);
  font: inherit;
  line-height: inherit;
  text-transform: none;
  cursor: pointer;
}

.post-card-rating-trigger {
  white-space: nowrap;
  text-decoration: none;
}

.post-card-rating-trigger:hover,
.post-card-rating-trigger:focus,
.post-card-rating-save:hover,
.post-card-rating-save:focus,
.post-card-rating-close:hover,
.post-card-rating-close:focus,
.post-card-rating-auth-prompt a:hover,
.post-card-rating-auth-prompt a:focus,
.post-card-rating-auth-prompt button:hover,
.post-card-rating-auth-prompt button:focus {
  text-decoration: underline;
  background: transparent;
  color: var(--forground);
}

.post-card-rating-popover {
  display: none;
  position: absolute;
  right: 0;
  bottom: 100%;
  z-index: 80;
  width: min(20rem, calc(100vw - 1rem));
  box-sizing: border-box;
  padding: 0.75rem;
  border: 1px solid var(--forground);
  background: var(--background);
  color: var(--forground);
  font-size: 0.76rem;
  line-height: 1.35;
}

.post-card-rating:hover > .post-card-rating-popover,
.post-card-rating:focus-within > .post-card-rating-popover,
.post-card-rating.is-open > .post-card-rating-popover {
  display: block;
}

.post-card-rating-heading,
.post-card-rating-dimension-heading,
.post-card-rating-actions,
.post-card-rating-auth-prompt {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.65rem;
}

.post-card-rating-heading {
  margin-bottom: 0.55rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid var(--outline);
}

.post-card-rating-dimensions {
  display: grid;
  gap: 0.6rem;
}

.post-card-rating-dimension {
  display: grid;
  gap: 0.18rem;
}

.post-card-rating-label {
  font-weight: bold;
}

.post-card-rating-aggregate {
  white-space: nowrap;
}

.post-card-rating-description {
  font-size: 0.72rem;
}

.post-card-rating-values {
  display: flex;
  gap: 0.35rem;
  align-items: center;
  margin-top: 0.15rem;
}

.post-card-rating-value {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border: 1px solid var(--outline);
}

.post-card-rating-value:hover,
.post-card-rating-value:focus {
  border-color: var(--forground);
}

.post-card-rating-value.selected {
  border-color: var(--forground);
  background: var(--forground);
  color: var(--background);
}

.post-card-rating-actions {
  justify-content: flex-start;
  margin-top: 0.7rem;
  padding-top: 0.45rem;
  border-top: 1px solid var(--outline);
}

.post-card-rating-save,
.post-card-rating-close {
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.post-card-rating-status,
.post-card-rating-note {
  margin-top: 0.45rem;
}

.post-card-rating-auth-prompt {
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-top: 0.45rem;
  padding-top: 0.45rem;
  border-top: 1px solid var(--outline);
}

.post-card-rating-auth-prompt[hidden] {
  display: none;
}

/* Release 374: compact in-menu controls for the actual feed-ranking parameters. */
.ranking-inline-form {
  box-sizing: border-box;
  color: var(--forground);
  margin: 0;
  width: 100%;
}

.ranking-inline-group {
  border: 1px solid var(--outline);
  margin: 0;
  min-width: 0;
}

.ranking-inline-group > summary {
  box-sizing: border-box;
  color: var(--forground);
  cursor: pointer;
  font-weight: 700;
  list-style: none;
  padding: 0.48rem 0.6rem;
  text-transform: uppercase;
}

.ranking-inline-group > summary::-webkit-details-marker { display: none; }
.ranking-inline-group > summary::after { content: ' +'; }
.ranking-inline-group[open] > summary::after { content: ' −'; }

.ranking-inline-group-body {
  border-top: 1px solid var(--outline);
  display: grid;
  gap: 0;
}

.ranking-inline-slider {
  align-items: center;
  border-top: 1px solid var(--outline);
  box-sizing: border-box;
  display: grid;
  gap: 0.5rem;
  grid-template-columns: minmax(9rem, 0.8fr) minmax(12rem, 1.2fr);
  min-width: 0;
  padding: 0.48rem 0.6rem;
}

.ranking-inline-slider:first-child { border-top: 0; }
.ranking-inline-label {
  color: var(--forground);
  min-width: 0;
  overflow-wrap: anywhere;
}

.ranking-inline-control {
  align-items: center;
  display: grid;
  gap: 0.5rem;
  grid-template-columns: minmax(7rem, 1fr) minmax(5.6rem, auto);
  min-width: 0;
}

.ranking-inline-control input[type="range"] {
  accent-color: var(--forground);
  margin: 0;
  min-width: 0;
  width: 100%;
}

.ranking-inline-control output {
  color: var(--forground);
  min-width: 5.6rem;
  text-align: right;
  white-space: nowrap;
}

.ranking-inline-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin-top: 0.55rem;
}

.ranking-inline-actions button,
.ranking-inline-actions a {
  background: var(--background);
  border: 1px solid var(--forground);
  border-radius: 0;
  color: var(--forground);
  display: inline-flex;
  font: inherit;
  margin: 0 -1px 0 0;
  padding: 0.45rem 0.6rem;
  text-decoration: none;
  text-transform: uppercase;
}

.ranking-inline-actions button:hover,
.ranking-inline-actions button:focus-visible,
.ranking-inline-actions a:hover,
.ranking-inline-actions a:focus-visible {
  background: var(--forground);
  color: var(--background);
}

.ranking-inline-status {
  color: var(--forground);
  margin: 0.45rem 0 0;
  min-height: 1.2em;
}

[data-stonkys-ranking-parameters-panel][hidden] {
  display: none !important;
}

/* Release 385: prominent anonymous rating authentication, with desktop
   sign-in and registration kept inside the rating box. */
.post-card-rating-popover {
  width: min(26rem, calc(100vw - 1rem));
}

.post-card-rating-auth-prompt {
  display: block;
  margin-top: 0.65rem;
  padding: 0.65rem;
  border: 1px solid var(--forground);
  background: var(--background);
  color: var(--forground);
}

.post-card-rating-auth-prompt[hidden],
.post-card-rating-auth-form[hidden] {
  display: none;
}

.post-card-rating-auth-heading,
.post-card-rating-auth-form-actions,
.post-card-rating-auth-mobile-links {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.65rem;
}

.post-card-rating-auth-prompt > p {
  margin: 0.35rem 0 0.55rem;
}

.post-card-rating-auth-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 0.55rem;
  border: 1px solid var(--forground);
}

.post-card-rating-auth-tabs button,
.post-card-rating-auth-form button,
.post-card-rating-auth-dismiss {
  appearance: none;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--forground);
  font: inherit;
  text-transform: none;
  cursor: pointer;
}

.post-card-rating-auth-tabs button {
  flex: 1 1 50%;
  padding: 0.35rem 0.5rem;
}

.post-card-rating-auth-tabs button + button {
  border-left: 1px solid var(--forground);
}

.post-card-rating-auth-tabs button.selected {
  background: var(--forground);
  color: var(--background);
}

.post-card-rating-auth-form {
  display: grid;
  gap: 0.45rem;
}

.post-card-rating-auth-form label {
  display: grid;
  grid-template-columns: minmax(6.5rem, 0.7fr) minmax(0, 1.3fr);
  align-items: center;
  gap: 0.55rem;
}

.post-card-rating-auth-form input[type="text"],
.post-card-rating-auth-form input[type="email"],
.post-card-rating-auth-form input[type="password"] {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  padding: 0.3rem 0.4rem;
  border: 1px solid var(--outline);
  border-radius: 0;
  background: var(--background);
  color: var(--forground);
  font: inherit;
}

.post-card-rating-auth-form input:focus {
  border-color: var(--forground);
  outline: 1px solid var(--forground);
  outline-offset: 1px;
}

.post-card-rating-auth-consent {
  grid-template-columns: auto 1fr !important;
  justify-content: start;
}

.post-card-rating-auth-consent input {
  margin: 0;
}

.post-card-rating-auth-form-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-top: 0.15rem;
}

.post-card-rating-auth-form-actions button,
.post-card-rating-auth-primary {
  padding: 0.35rem 0.55rem;
  border: 1px solid var(--forground);
  background: var(--forground);
  color: var(--background);
  text-decoration: none;
}

.post-card-rating-auth-form-actions button:hover,
.post-card-rating-auth-form-actions button:focus,
.post-card-rating-auth-primary:hover,
.post-card-rating-auth-primary:focus {
  background: var(--background);
  color: var(--forground);
  text-decoration: none;
}

.post-card-rating-auth-message {
  min-height: 1.1em;
}

.post-card-rating-auth-dismiss {
  margin-top: 0.5rem;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.post-card-rating-auth-mobile-links {
  display: none;
}

.post-card-rating-auth-inline {
  display: block;
}

/* Release 386: server-persisted scheduled maintenance notice and write-freeze state. */
.maintenance-notice {
  position: relative;
  z-index: 80;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  box-sizing: border-box;
  padding: 0.55rem 0.8rem;
  border-bottom: 1px solid var(--forground);
  background: var(--background);
  color: var(--forground);
  font-size: 0.82rem;
  line-height: 1.35;
}
.maintenance-notice-copy,
.maintenance-notice-time {
  display: flex;
  align-items: baseline;
  gap: 0.65rem;
  min-width: 0;
}
.maintenance-notice-copy strong {
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.maintenance-notice-time {
  justify-content: flex-end;
  text-align: right;
  white-space: nowrap;
}
.maintenance-notice-soon {
  border-bottom-width: 2px;
}
.maintenance-notice-imminent,
.maintenance-notice-due,
.maintenance-notice-active {
  background: var(--forground);
  color: var(--background);
  border-bottom-color: var(--forground);
}
.maintenance-notice-active {
  position: sticky;
  top: 0;
}
.maintenance-notice-complete {
  border-bottom-style: double;
}
@media (max-width: 760px) {
  .maintenance-notice,
  .maintenance-notice-copy,
  .maintenance-notice-time {
    align-items: flex-start;
    flex-direction: column;
  }
  .maintenance-notice-time {
    gap: 0.2rem;
    text-align: left;
    white-space: normal;
  }
}

/* Release 386: Nimda scheduled-maintenance controls. */
.nimda-maintenance-settings {
  margin: 1rem 0 1.5rem;
  padding: 0.9rem;
  border: 1px solid var(--forground);
}
.maintenance-admin-grid {
  display: grid;
  grid-template-columns: minmax(15rem, 1fr) minmax(10rem, 0.45fr);
  gap: 0.8rem;
}
.maintenance-admin-grid label {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.maintenance-admin-message {
  grid-column: 1 / -1;
}
.maintenance-admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.8rem;
}
.maintenance-admin-status {
  border-left: 3px solid var(--forground);
  padding-left: 0.6rem;
}
@media (max-width: 760px) {
  .maintenance-admin-grid { grid-template-columns: 1fr; }
  .maintenance-admin-message { grid-column: auto; }
}

/* Release 390: explain the authoritative mail configuration without muting it. */
.settings-group-note {
  margin: 0.35rem 0 0.75rem;
  max-width: 72rem;
  color: var(--forground);
}

/* Release 391: focused Nimda support inbox backed by authoritative IMAP. */
.nimda-inbox-page,
.nimda-inbox-message-page {
  width: min(96vw, 110rem);
}

.nimda-inbox-status,
.nimda-inbox-message-meta dl {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 0.25rem 0.8rem;
  margin: 1rem 0;
}

.nimda-inbox-status dt,
.nimda-inbox-message-meta dt {
  font-weight: 700;
}

.nimda-inbox-status dd,
.nimda-inbox-message-meta dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.nimda-inbox-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.7rem;
  margin: 1rem 0;
}

.nimda-inbox-filter label {
  display: grid;
  gap: 0.25rem;
}

.nimda-inbox-filter input[type="search"] {
  min-width: min(34rem, 80vw);
}

.nimda-inbox-table {
  width: 100%;
  table-layout: auto;
}

.nimda-inbox-table th,
.nimda-inbox-table td {
  vertical-align: top;
  text-align: left;
  padding: 0.45rem 0.55rem;
  border-bottom: 1px solid var(--forground);
}

.nimda-inbox-unread td {
  font-weight: 700;
}

.nimda-inbox-notice,
.nimda-inbox-error {
  border-left: 3px solid var(--forground);
  padding: 0.55rem 0.75rem;
  color: var(--forground);
  background: var(--background);
}

.nimda-inbox-pagination {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin: 0.8rem 0 1.5rem;
}

.nimda-inbox-audit {
  margin-top: 2rem;
}

.nimda-inbox-audit > summary {
  cursor: pointer;
  font-weight: 700;
}

.nimda-inbox-message-body {
  margin: 1rem 0;
  border: 1px solid var(--forground);
  background: var(--background);
  color: var(--forground);
}

.nimda-inbox-message-body pre {
  margin: 0;
  padding: 1rem;
  max-height: 60vh;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font: inherit;
  line-height: 1.45;
}

.nimda-inbox-actions,
.nimda-inbox-reply,
.nimda-inbox-attachments,
.nimda-inbox-thread {
  margin: 1.25rem 0;
  padding-top: 0.75rem;
  border-top: 1px solid var(--forground);
}

.nimda-inbox-reply form,
.nimda-inbox-reply label {
  display: grid;
  gap: 0.45rem;
}

.nimda-inbox-reply textarea {
  width: min(100%, 70rem);
  min-height: 12rem;
  box-sizing: border-box;
}

@media (max-width: 760px) {
  .nimda-inbox-status,
  .nimda-inbox-message-meta dl {
    grid-template-columns: 1fr;
    gap: 0.15rem;
  }

  .nimda-inbox-status dd,
  .nimda-inbox-message-meta dd {
    margin-bottom: 0.55rem;
  }

  .nimda-inbox-filter,
  .nimda-inbox-filter label,
  .nimda-inbox-filter input,
  .nimda-inbox-filter select,
  .nimda-inbox-filter button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
}

/* Release 395: μ2¢ user-to-user post action. Public cards intentionally show
   no amount received, supporter count, or rating count. */
.post-card-micro-support {
  display: inline-flex;
  margin-left: 0.7rem;
  position: relative;
}

.post-card-micro-support-trigger,
.post-card-micro-support-popover button,
.micro-support-topup-actions button,
.micro-support-payout-form button {
  background: var(--background);
  border: 1px solid var(--forground);
  color: var(--forground);
  cursor: pointer;
  font: inherit;
}

.post-card-micro-support-trigger {
  border: 0;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0;
  white-space: nowrap;
}

.post-card-micro-support-trigger:hover,
.post-card-micro-support-trigger:focus,
.post-card-micro-support-popover button:hover,
.post-card-micro-support-popover button:focus {
  text-decoration: underline;
}

.post-card-micro-support-popover {
  background: var(--background);
  border: 1px solid var(--forground);
  box-sizing: border-box;
  color: var(--forground);
  display: none;
  min-width: min(28rem, 92vw);
  padding: 0.85rem;
  position: absolute;
  right: 0;
  top: calc(100% + 0.45rem);
  z-index: 1500;
}

.post-card-micro-support:focus-within > .post-card-micro-support-popover,
.post-card-micro-support.is-open > .post-card-micro-support-popover {
  display: block;
}

.micro-support-confirm,
.micro-support-auth,
.micro-support-auth form,
.micro-support-payout-form {
  display: grid;
  gap: 0.65rem;
}

.micro-support-confirm[hidden],
.micro-support-auth[hidden],
.micro-support-auth form[hidden] {
  display: none !important;
}

.micro-support-confirm p,
.micro-support-auth p {
  margin: 0;
}

.micro-support-checkbox {
  align-items: center;
  display: flex;
  gap: 0.45rem;
}

.micro-support-actions,
.micro-support-auth-tabs,
.micro-support-auth-mobile-links,
.micro-support-popover-footer,
.micro-support-topup-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.micro-support-actions button,
.micro-support-auth-tabs button,
.micro-support-popover-footer button,
.micro-support-topup-actions button,
.micro-support-payout-form button {
  padding: 0.35rem 0.65rem;
}

.micro-support-auth-tabs .selected {
  text-decoration: underline;
  text-decoration-thickness: 2px;
}

.micro-support-auth-inline {
  border-top: 1px solid var(--forground);
  padding-top: 0.7rem;
}

.micro-support-auth-inline label {
  display: grid;
  gap: 0.2rem;
}

.micro-support-auth-inline input,
.micro-support-payout-form input {
  background: var(--background);
  border: 1px solid var(--forground);
  color: var(--forground);
  box-sizing: border-box;
  min-width: 0;
  padding: 0.4rem;
  width: 100%;
}

.micro-support-auth-mobile-links { display: none; }

.micro-support-status {
  min-height: 1.3em;
  padding-top: 0.45rem;
}

.micro-support-popover-footer {
  border-top: 1px solid var(--forground);
  justify-content: space-between;
  margin-top: 0.45rem;
  padding-top: 0.55rem;
}

.micro-support-account-page .profile-card strong {
  display: block;
  font-size: 1.35rem;
  margin: 0.4rem 0;
}

.micro-support-balance-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.micro-support-topup-actions form { margin: 0; }
.micro-support-account-notice {
  border: 1px solid var(--forground);
  padding: 0.7rem;
}

.micro-support-settings-card { margin-bottom: 1rem; }
.micro-support-settings-balance { margin-top: 1rem; }