/* The STX Wall v2 */
:root {
  --wall-bg: #121817;
  --wall-panel: #1a2321;
  --wall-panel-2: #202c29;
  --wall-text: #f4f4ef;
  --wall-muted: #aebbb7;
  --wall-line: rgba(255,255,255,.12);
  --wall-green: #74d09b;
  --wall-green-dark: #173a2e;
  --wall-paper: #e8dfc9;
  --wall-ink: #17211f;
  --wall-warm: #d2a764;
  --wall-danger: #e38d82;
}
html[data-theme="light"] {
  --wall-bg: #eef2ef;
  --wall-panel: #ffffff;
  --wall-panel-2: #f5f7f4;
  --wall-text: #17211f;
  --wall-muted: #5d6c67;
  --wall-line: rgba(20,35,31,.16);
  --wall-green: #176f4a;
  --wall-green-dark: #dceee5;
  --wall-paper: #f1e8cf;
  --wall-ink: #17211f;
  --wall-warm: #9d6c22;
  --wall-danger: #a64036;
}
* { box-sizing: border-box; }
/* The Wall now uses the canonical STX Online site header from assets/styles.css. */
body.stx-wall-body { margin: 0; background: var(--wall-bg); color: var(--wall-text); font-family: Inter, Arial, Helvetica, sans-serif; }
.stx-wall-shell { width: min(1160px, calc(100% - 32px)); margin: 0 auto; padding: 48px 0 70px; }
.stx-wall-hero { padding: 28px 0 30px; border-bottom: 1px solid var(--wall-line); }
.stx-wall-hero-simple { display: block; }
.stx-wall-kicker,.stx-wall-section-label { margin: 0 0 8px; color: var(--wall-green); font-size: 12px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.stx-wall-hero h1 { margin: 0; font-size: clamp(42px,8vw,86px); line-height: .92; letter-spacing: -.055em; }
.stx-wall-lead { max-width: 760px; margin: 20px 0 0; color: var(--wall-muted); font-size: clamp(17px,2.2vw,21px); line-height: 1.55; }
.stx-wall-composer,.stx-wall-feed-section,.stx-wall-mod-section { margin-top: 30px; padding: 26px; border: 1px solid var(--wall-line); border-radius: 18px; background: var(--wall-panel); }
.stx-wall-feed-first { margin-top: 24px; }
.stx-wall-posting-rules { margin: 14px 0 0; color: var(--wall-muted); font-size: 13px; line-height: 1.55; }
.stx-wall-composer-head,.stx-wall-feed-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.stx-wall-composer h2,.stx-wall-feed-section h2,.stx-wall-mod-section h2 { margin: 0; font-size: clamp(25px,4vw,38px); letter-spacing: -.035em; }
.stx-wall-mod-link { color: var(--wall-green); font-weight: 900; text-decoration: none; }
.stx-wall-signedout { margin-top: 18px; padding: 18px; border-radius: 14px; background: var(--wall-panel-2); }
.stx-wall-signedout p { margin: 0 0 14px; color: var(--wall-muted); line-height: 1.55; }
[data-wall-form] { margin-top: 18px; }
[data-wall-message] { width: 100%; resize: vertical; min-height: 116px; padding: 17px 18px; border: 1px solid var(--wall-line); border-radius: 14px; background: var(--wall-panel-2); color: var(--wall-text); font: 700 19px/1.45 Georgia, 'Times New Roman', serif; outline: none; }
[data-wall-message]:focus { border-color: var(--wall-green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--wall-green) 18%, transparent); }
.stx-wall-form-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 12px; }
.stx-wall-form-footer > div { display: flex; flex-direction: column; gap: 4px; color: var(--wall-muted); font-size: 12px; }
.stx-wall-form-footer strong { color: var(--wall-text); font-size: 13px; }
.stx-wall-button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 10px 15px; border: 0; border-radius: 10px; background: var(--wall-green); color: #102019; font: 900 14px/1 Inter,Arial,sans-serif; text-decoration: none; cursor: pointer; }
html[data-theme="light"] .stx-wall-button { color: #fff; }
.stx-wall-button:disabled { opacity: .45; cursor: not-allowed; }
.stx-wall-button-secondary { background: var(--wall-panel-2); color: var(--wall-text); border: 1px solid var(--wall-line); }
.stx-wall-status { margin: 14px 0 0; min-height: 1.4em; color: var(--wall-muted); font-size: 13px; line-height: 1.45; }
.stx-wall-status[data-type="error"] { color: var(--wall-danger); }
.stx-wall-status[data-type="success"] { color: var(--wall-green); }
.stx-wall-feed-section { background: linear-gradient(155deg, var(--wall-panel), var(--wall-panel-2)); overflow: hidden; }
.stx-wall-feed-head > span { color: var(--wall-muted); font-size: 13px; font-weight: 800; }
.stx-wall-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; align-items: start; margin-top: 0; padding: 8px 4px 18px; }
.stx-wall-note { position: relative; min-height: 154px; display: flex; flex-direction: column; justify-content: space-between; gap: 22px; padding: 22px 20px 16px; overflow-wrap: anywhere; transform-origin: center; }
.stx-wall-note p { margin: 0; }
.stx-wall-note-text { font-size: 20px; line-height: 1.28; }
.stx-wall-note-meta { display: flex; justify-content: space-between; gap: 12px; font: 800 10px/1.25 Inter,Arial,sans-serif; letter-spacing: .08em; text-transform: uppercase; opacity: .66; }
.stx-wall-admin-controls { display:flex; justify-content:flex-end; margin-top:-10px; }
.stx-wall-admin-controls button { min-height:28px; padding:5px 8px; border:1px solid currentColor; border-radius:7px; background:color-mix(in srgb,var(--wall-panel) 84%,transparent); color:var(--wall-danger); font:800 10px/1 Inter,Arial,sans-serif; text-transform:uppercase; letter-spacing:.06em; cursor:pointer; }
.stx-wall-admin-controls button:disabled { opacity:.45; cursor:not-allowed; }
.stx-wall-style-1 { border: 2px dashed var(--wall-green); color: var(--wall-text); background: transparent; transform: rotate(-1deg); }
.stx-wall-style-1 .stx-wall-note-text { font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; font-size: 24px; letter-spacing: .035em; text-transform: uppercase; text-shadow: 2px 2px 0 color-mix(in srgb,var(--wall-green) 22%,transparent); }
.stx-wall-style-2 { background: var(--wall-paper); color: var(--wall-ink); transform: rotate(.8deg); clip-path: polygon(1% 2%,99% 0,98% 96%,88% 99%,73% 96%,58% 99%,41% 96%,25% 99%,9% 96%,1% 98%); }
.stx-wall-style-2 .stx-wall-note-text { font-family: Georgia,'Times New Roman',serif; font-size: 21px; font-style: italic; }
.stx-wall-style-3 { border: 3px solid currentColor; background: var(--wall-panel-2); transform: rotate(.35deg); }
.stx-wall-style-3 .stx-wall-note-text { font-family: 'Courier New',monospace; font-size: 20px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.stx-wall-style-4 { background: var(--wall-green); color: #102019; border-radius: 8px; transform: rotate(-.65deg); }
html[data-theme="light"] .stx-wall-style-4 { color: #fff; }
.stx-wall-style-4 .stx-wall-note-text { font-family: 'Arial Black',Impact,sans-serif; font-size: 21px; font-weight: 900; }
.stx-wall-style-5 { border-left: 7px solid var(--wall-warm); background: var(--wall-panel-2); transform: rotate(.7deg); }
.stx-wall-style-5 .stx-wall-note-text { font-family: 'Trebuchet MS',Arial,sans-serif; font-size: 22px; font-weight: 900; font-style: italic; }
.stx-wall-style-6 { border: 1px solid var(--wall-line); border-radius: 4px; background: var(--wall-panel); transform: rotate(-.3deg); }
.stx-wall-style-6::before,.stx-wall-style-6::after { content: ''; position: absolute; width: 58px; height: 17px; top: -7px; background: color-mix(in srgb,var(--wall-paper) 72%,transparent); opacity: .75; }
.stx-wall-style-6::before { left: 16px; transform: rotate(-5deg); }.stx-wall-style-6::after { right: 16px; transform: rotate(6deg); }
.stx-wall-style-6 .stx-wall-note-text { font-family: 'Comic Sans MS','Trebuchet MS',cursive; font-size: 21px; font-weight: 700; }
.stx-wall-style-7 { border-radius: 999px 18px 999px 18px; background: var(--wall-panel-2); outline: 2px solid var(--wall-green); outline-offset: -8px; transform: rotate(.45deg); }
.stx-wall-style-7 .stx-wall-note-text { font-family: Impact,'Arial Black',sans-serif; font-size: 22px; text-align: center; text-transform: uppercase; }
.stx-wall-style-8 { background: transparent; border-bottom: 5px solid var(--wall-green); transform: rotate(-.55deg); }
.stx-wall-style-8 .stx-wall-note-text { font-family: Georgia,serif; font-size: 23px; font-weight: 800; font-style: italic; }
.stx-wall-empty { grid-column: 1/-1; padding: 42px 18px; text-align: center; color: var(--wall-muted); border: 1px dashed var(--wall-line); border-radius: 14px; }
.stx-wall-footer { width: min(1160px, calc(100% - 32px)); margin: 0 auto; padding: 25px 0 40px; display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid var(--wall-line); color: var(--wall-muted); font-size: 12px; }
.stx-wall-visually-hidden { position: absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.stx-wall-mod-hero { align-items: center; }.stx-wall-mod-hero .stx-wall-button { justify-self: end; }
.stx-wall-mod-list,.stx-wall-ban-list { display: grid; gap: 12px; margin-top: 20px; }
.stx-wall-mod-card,.stx-wall-ban-card { padding: 17px; border: 1px solid var(--wall-line); border-radius: 13px; background: var(--wall-panel-2); }
.stx-wall-mod-meta { display: flex; flex-wrap: wrap; gap: 7px 12px; color: var(--wall-muted); font-size: 12px; }
.stx-wall-mod-meta strong { color: var(--wall-text); }.stx-wall-mod-body { margin: 13px 0 16px; font: 700 18px/1.45 Georgia,serif; }
.stx-wall-mod-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.stx-wall-mod-actions button { min-height: 36px; padding: 8px 10px; border: 1px solid var(--wall-line); border-radius: 8px; background: var(--wall-panel); color: var(--wall-text); font-weight: 800; cursor: pointer; }
.stx-wall-mod-actions button[data-wall-mod-action="delete"] { color: var(--wall-danger); }
.stx-wall-mod-actions button[data-wall-mod-action="ban_permanent"] { background: color-mix(in srgb,var(--wall-danger) 18%,var(--wall-panel)); color: var(--wall-danger); }
.stx-wall-ban-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.stx-wall-ban-card p { margin: 4px 0 0; color: var(--wall-muted); font-size: 12px; }.stx-wall-ban-card strong { display:block; }
@media (max-width: 900px) { .stx-wall-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.stx-wall-mod-hero .stx-wall-button { justify-self: start; } }
@media (max-width: 620px) { .stx-wall-shell { width: min(100% - 20px,1160px); padding-top: 24px; }.stx-wall-grid { grid-template-columns: 1fr; gap: 18px; }.stx-wall-composer,.stx-wall-feed-section,.stx-wall-mod-section { padding: 18px; border-radius: 14px; }.stx-wall-composer-head,.stx-wall-feed-head,.stx-wall-form-footer,.stx-wall-ban-card { align-items: stretch; flex-direction: column; }.stx-wall-button { width: 100%; }.stx-wall-hero h1 { font-size: clamp(44px,17vw,70px); }.stx-wall-footer { width: calc(100% - 20px); flex-direction: column; }.stx-wall-note { min-height: 140px; } }