/* styles_all.css — VT323 everywhere
   NOTE: Ensure your HTML includes:
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">
*/

/* Global font: apply VT323 to everything by inheritance */
html{
  font-family: 'VT323', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: clamp(18px, 2.2vw, 28px);
  line-height: 1.6;
}
*, *::before, *::after{ font-family: inherit; }

/* Legacy base (kept but font is inherited) */
body { background:#000; color:#ff3030; margin:0; }
pre { font: inherit; letter-spacing: 0; margin: 10px; }
img { width: 100%; height: auto; display: block; }

/* === Red CRT Stylesheet with transitions === */

/* Base */
:root{
  --bg: #000;
  --phosphor: #ff3030;       /* bright retro red */
  --phosphor-dim: #ff8080;   /* softer dim red */
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body{
  margin: 0;
  background: var(--bg);
  color: var(--phosphor);
  /* font is inherited */
  /* font-size is inherited */
  /* line-height is inherited */
}

/* Screen container with subtle CRT feel */
.crt{
  min-height: 100%;
  display: grid;
  place-items: center;
  padding: 6vh 4vw;
  position: relative;
  isolation: isolate; /* stack for pseudo effects */
}

/* Scanlines + vignette */
.crt::before,
.crt::after{
  content:"";
  position:absolute; inset:0;
  pointer-events:none;
}
.crt::before{
  background: repeating-linear-gradient(
    to bottom,
    rgba(255,48,48,0.05) 0px,
    rgba(0,0,0,0.05) 2px,
    transparent 3px
  );
  mix-blend-mode: screen;
}
.crt::after{
  background: radial-gradient(ellipse at center,
    rgba(255,48,48,0.10) 0%,
    rgba(0,0,0,0.0) 40%,
    rgba(0,0,0,0.35) 100%);
}

/* Boot block */
.boot{
  width: min(900px, 92vw);
  text-shadow: 0 0 8px rgba(255,48,48,0.6), 0 0 2px rgba(255,48,48,0.8);
}

/* Fake “]” prompt line */
.boot__lines{
  margin-bottom: 1.2em;
  letter-spacing: 0.04em;
}

/* Links (if used elsewhere) */
.link{
  color: var(--phosphor);
  text-decoration: underline;
}
.link:hover{ text-decoration: none; }

/* Blinking block cursor (no GIF needed) */
.cursor{
  display:inline-block;
  width: .7em; height: 1em;
  background: var(--phosphor);
  margin-left: .25em;
  vertical-align: -0.15em;
  box-shadow: 0 0 6px rgba(255,48,48,0.8);
  animation: blink .9s steps(1,end) infinite;
}
@keyframes blink { 50% { opacity: 0; } }

.cta{ margin-top: 1em; }
.tiny{ opacity:.7; font-size: .8em; }

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce){
  .cursor{ animation: none; }
  .crt::before{ background: none; }
}

/* === Transition effects === */
/* Quick phosphor flash overlay between frames */
.flash{
  position: fixed; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse at center,
    rgba(255,48,48,0.20) 0%,
    rgba(0,0,0,0.0) 55%,
    rgba(0,0,0,0.85) 100%);
  opacity: 0;
  animation: flash 140ms ease-out forwards;
  mix-blend-mode: screen;
}
@keyframes flash { 0%{opacity:.9} 100%{opacity:0} }

/* Micro fade-in to mimic phosphor persistence */
.frame{ opacity: 0; }
.frame.show{ animation: phosphorIn 180ms ease-out forwards; }
@keyframes phosphorIn { from{opacity:0} to{opacity:1} }


/* ================================
   ASCII SVG gallery (v1, v2, v3)
   ================================ */

/* Grid layout for the ASCII SVG gallery */
.ascii-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;

  /* Centering + width for desktop */
  width: 60%;
  margin: 0 auto;
}

/* Safe generic image reset inside grid (kept lightweight) */
.ascii-grid img {
  width: 100%;
  height: auto;
  display: block;
}

/* Card/container for each cover + caption/nav */
.ascii-item {
  /* aspect-ratio REMOVED: let the card grow to fit img + CTA */
  display: flex;
  flex-direction: column;            /* image above, caption/nav below */
  justify-content: flex-start;
  align-items: center;
  padding: 0.5rem;
  min-height: 0;                     /* fix Chrome min-content sizing */
  gap: 0.5rem;                       /* space between image and CTA/caption */
}

/* Inline variant (used elsewhere) */
.ascii-item2 {
  display: inline-block;
  background: transparent;
  padding: 0;
  vertical-align: top;
  line-height: 0;
  overflow: hidden;
}

.ascii-item2 img {
  display: block;
  width: 100%;
  height: auto;
}

/* Image sizing: keep cover ratio without consuming all card height */
.ascii-item img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 3;               /* move ratio to the image */
  object-fit: contain;
  flex: 0 0 auto;                    /* prevent stretching */
  min-height: 0;
}

/* Ensure CTA/caption remain inside the card */
.ascii-item nav { 
  flex: 0 0 auto; 
}

.ascii-item .caption {
  font: inherit;
  font-size: 40px;
  line-height: 40px;
  letter-spacing: 0;
  text-align: center;
}

/* Mobile: single column, full width */
@media (max-width: 768px) {
  .ascii-grid {
    grid-template-columns: 1fr;
    width: 100%;
    margin: 0;
  }
}

/* Grid layout for the ASCII SVG gallery v2 */
.ascii-grid-v2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);  /* 2 columns */
  gap: 1rem;

  /* Centering + width for desktop */
  width: 60%;
  margin: 0 auto;
}

.ascii-grid-v2 img {
  width: 100%;
  height: auto;
  display: block;
}

/* Card/container for each cover + caption/nav (v2) */
.ascii-item-v2 {
  /* aspect-ratio REMOVED: let the card grow to fit img + CTA */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 0.5rem;
  min-height: 0;                    /* fix Chrome min-content sizing */
  gap: 0.5rem;
}

.ascii-item2-v2 {
  display: inline-block;
  background: transparent;
  padding: 0;
  vertical-align: top;
  line-height: 0;
  overflow: hidden;
}

.ascii-item2-v2 img {
  display: block;
  width: 100%;
  height: auto;
}

/* Image sizing: keep cover ratio without consuming all card height (v2) */
.ascii-item-v2 img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 3;              /* move ratio to the image */
  object-fit: contain;
  flex: 0 0 auto;                   /* prevent stretching */
  min-height: 0;
}

/* Ensure CTA/caption remain inside the card (v2) */
.ascii-item-v2 nav { 
  flex: 0 0 auto; 
}

.ascii-item-v2 .caption {
  font: inherit;
  font-size: 40px;
  line-height: 40px;
  letter-spacing: 0;
  text-align: center;
}

/* Mobile: single column, full width */
@media (max-width: 768px) {
  .ascii-grid-v2 {
    grid-template-columns: 1fr;
    width: 100%;
    margin: 0;
  }
}

/* Single-row/column grid (v3) */
.ascii-grid-v3 {
  display: flex;                    /* use flexbox for centering */
  justify-content: center;          /* center horizontally */
  align-items: center;              /* center vertically */
  width: 60%;
  margin: 0 auto;
  min-height: 200px;                /* ensures space so centering is visible */
}

/* Container for the button (v3) */
.ascii-item-v3 {
  width: 100%;
  display: flex;
  justify-content: center;
}

/* Full-width link button (v3) */
.ascii-item-v3 nav {
  width: 100%;
}

.ascii-item-v3 nav a {
  display: block;
  width: 100%;
  text-align: center;
  text-decoration: none;

  /* Button look */
  padding: 0.85rem 1rem;
  border-radius: 10px;
  border: 2px solid currentColor;
  background: transparent;
  font: inherit;
  font-size: 40px;
  line-height: 40px;
}

/* Optional hover/focus */
.ascii-item-v3 nav a:hover,
.ascii-item-v3 nav a:focus {
  outline: none;
  filter: brightness(0.9);
}

/* Mobile: full width (v3) */
@media (max-width: 768px) {
  .ascii-grid-v3 {
    width: 100%;
    margin: 0;
    min-height: 150px;
  }
}


/* === Noderunner Profile Layout (merged) === */
:root{
  --bg: #000000;
  --panel: #0b0b0b;
  --ink: #ff3030;
  --muted: #ff7a7a;
  --accent: #ff3030;
  --accent-2: #ff5252;
  --danger: #ff6a7a;
  --ok: #2bff72;
  --grid: rgba(255, 82, 82, 0.08);
  --card: rgba(255, 255, 255, 0.03);
  --border: rgba(255, 48, 48, 0.35);
  --shadow: 0 10px 30px rgba(0,0,0,0.65);
  --radius: 18px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  /* use inherited font */
  background: var(--bg);
  color: var(--ink);
  background-image:
    linear-gradient(transparent 0 23px, var(--grid) 24px),
    linear-gradient(90deg, transparent 0 23px, var(--grid) 24px);
  background-size: 24px 24px;
}

a{ color: var(--ink); }
a:hover{ color: #fff; }

.wrap{max-width:1100px; margin:0 auto; padding: clamp(20px, 3vw, 40px)}

header{
  position: relative; background: var(--panel); border:1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow);
  overflow: hidden;
}
.hero{
  display:grid; grid-template-columns: 1.2fr 1fr; gap: clamp(16px, 3vw, 28px);
  align-items:center; padding: clamp(20px, 5vw, 36px);
}
@media (max-width: 860px){ .hero{grid-template-columns: 1fr} }

.brand{ display:flex; flex-direction:column; gap:18px; }
.kicker{letter-spacing:.18em; text-transform:uppercase; color:var(--muted); font-size:.82rem}
h1{ margin:0; font-size: clamp(28px, 5.4vw, 54px); line-height:1.1; letter-spacing: .01em; }
.tagline{color:var(--muted)}

.badges{display:flex; flex-wrap:wrap; gap:10px}
.badge{ border:1px solid var(--border); color:var(--ink); background: var(--card);
  padding:6px 10px; border-radius: 999px; font-size:.84rem; display:inline-flex; gap:8px; align-items:center }
.led{width:10px; height:10px; border-radius:50%; background:var(--ok); box-shadow:0 0 16px var(--ok)}
.led.off{background:var(--danger); box-shadow:0 0 10px var(--danger)}

.network{width:100%; height:auto; display:block; filter: drop-shadow(0 8px 30px rgba(0,0,0,.3));}

nav{ display:flex; gap:18px; flex-wrap:wrap; margin-top:8px }
nav a{ color:var(--ink); text-decoration:none; padding:10px 12px; border-radius:12px; background: var(--card); border:1px solid var(--border) }
nav a:hover{ outline:2px solid var(--accent-2)}

section{ margin-top: clamp(28px, 5vw, 56px); background: var(--panel); border:1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow)}
section .inner{ padding: clamp(20px, 4vw, 36px)}
.section-title{ display:flex; align-items:center; gap:12px; margin:0 0 12px 0; font-size: clamp(18px, 3vw, 22px); letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.divider{ height:1px; background: linear-gradient(90deg, transparent, var(--border), transparent); margin: 8px 0 18px }

.grid{ display:grid; grid-template-columns: repeat(12, 1fr); gap: clamp(12px, 2vw, 18px)}
.span-6{grid-column: span 6}
.span-4{grid-column: span 4}
.span-12{grid-column: span 12}
@media (max-width: 900px){ .span-6, .span-4 {grid-column: span 12}}

.card{ background: var(--card); border:1px solid var(--border); border-radius: 14px; padding:18px}
.mono{ font: inherit; letter-spacing:.02em }
.about p{margin:0 0 12px 0}

.form{ display:grid; grid-template-columns: 1fr auto; gap:10px }
.form input[type=email]{
  width:100%; padding: 12px 14px; border-radius:10px; border:1px solid var(--border); background: rgba(255,255,255,0.04); color:var(--ink)
}
.form button{ padding: 12px 16px; border-radius:10px; border:1px solid var(--border); background: var(--accent-2); color:#000; font-weight:700; cursor:pointer }
.form button:focus, .form input:focus{ outline:2px solid var(--accent) }

.contact-list{ list-style:none; padding:0; margin:0; display:grid; gap:10px }
.contact-list a{ color:var(--ink); text-decoration:none }
.contact-card{ display:flex; align-items:center; gap:12px; padding:12px; background: var(--card); border:1px solid var(--border); border-radius:12px }

footer{ color:var(--muted); text-align:center; padding: 26px 0; font-size:.9rem }

/* scan animation */
@media (prefers-reduced-motion: no-preference){
  .scan{ position:absolute; inset:0; background: linear-gradient(180deg, transparent 0, rgba(255,82,82,0.08) 50%, transparent 100%);
    mix-blend-mode: screen; transform: translateY(-100%); animation: sweep 6s linear infinite; }
  @keyframes sweep{ to{ transform: translateY(100%) } }
}

/* Ensure the ASCII grid works within the Books section width */
#books .ascii-grid{ width:100%; margin: 0; }
#books .ascii-item{ border-color: var(--border); }
#books .ascii-item .caption{ color: var(--muted); font-size: 18px; line-height: 1.2; }

/* ===============================
   Jotform → Red CRT skin (scoped)
   =============================== */

/* The outer card container + spacing from previous section */
#async-transmission{
  margin-top: 2.5rem;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: clamp(16px, 3vw, 24px);
}

/* Neutralize Jotform sheet background & paddings */
#async-transmission .form-all,
#async-transmission .supernova,
#async-transmission #stage{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

/* Typography & color */
#async-transmission .form-all,
#async-transmission .form-label,
#async-transmission .form-subHeader,
#async-transmission .form-required{
  font-family: 'VT323', ui-monospace, Menlo, Consolas, monospace !important;
  color: var(--ink) !important;    /* red */
}

/* UL wrapper cleanup */
#async-transmission .form-section{
  list-style: none !important;
  padding: 0 !important;
}

/* Field spacing */
#async-transmission .form-line{ margin: .8rem 0 !important; }
#async-transmission .form-header-group{ margin: 0 !important; padding: 0 !important; }

/* Inputs & textarea */
#async-transmission #input_5,
#async-transmission #input_8,
#async-transmission #input_12{
  width: 100% !important;
  max-width: 100% !important;
  background: #000 !important;
  color: var(--ink) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  box-shadow: none !important;
}
#async-transmission #input_8{ min-height: 180px !important; }
#async-transmission ::placeholder{ color: var(--muted); opacity: .85; }

#async-transmission #input_5:focus,
#async-transmission #input_8:focus,
#async-transmission #input_12:focus{
  outline: 2px solid var(--accent) !important;
  outline-offset: 0;
}

/* Captcha row tidy + image size cap */
#async-transmission .form-captcha{
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap;
}
#async-transmission #input_12_captcha{
  width: 150px !important;
  height: 41px !important;
  max-width: none !important;
  image-rendering: pixelated; /* optional */
}
#async-transmission #input_12{ width: 140px !important; }
#async-transmission #input_12_reload{
  width: 20px !important; height: 20px !important; vertical-align: middle !important;
}

/* Remove Jotform highlight blocks */
#async-transmission .form-line-active,
#async-transmission .form-line-error{
  background: transparent !important;
  box-shadow: none !important;
}
#async-transmission .form-line-error input,
#async-transmission .form-line-error textarea{
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent) !important;
}

/* Submit button = your pill CTA, centered */
#async-transmission .form-submit-button{
  display: inline-flex !important;
  align-items: center; justify-content: center;
  padding: 12px 18px !important;
  border-radius: 999px !important;
  border: 1px solid var(--border) !important;
  background: var(--accent-2) !important;
  color: #000 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  cursor: pointer;
}
#async-transmission .form-buttons-wrapper{ text-align: center !important; }

/* Responsive textarea comfort */
@media (max-width: 700px){
  #async-transmission #input_8{ min-height: 140px !important; }
}

/* Captcha reload icon styling */
#async-transmission #input_12_reload {
  width: 24px !important;
  height: 24px !important;
  margin-left: 8px !important;
  vertical-align: middle !important;

  filter: invert(36%) sepia(93%) saturate(7499%) hue-rotate(356deg) brightness(91%) contrast(108%);
  /* This tints the reload icon red to match your accent */
  cursor: pointer;
  transition: transform 0.2s ease, filter 0.2s ease;
}

#async-transmission #input_12_reload:hover {
  transform: rotate(90deg) scale(1.1); /* fun rotate spin effect */
  filter: invert(100%) sepia(100%) saturate(1000%) hue-rotate(0deg); /* bright red */
}

/* Force the Jotform "Send" button to match site buttons */
#async-transmission #input_2.form-submit-button.legacy-submit {
  display: block !important;
  width: 50% !important;           /* half-width, like "View All KeyPubs" */
  max-width: 420px !important;     /* cap so it doesn't get huge */
  margin: 1.5rem auto 0 !important;
  padding: 12px 20px !important;

  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;

  color: var(--ink) !important;    /* red text */
  font-family: 'VT323', ui-monospace, monospace !important;
  font-size: clamp(16px, 1.6vw, 20px) !important;
  font-weight: 400 !important;
  text-align: center !important;
  line-height: 1 !important;

  box-shadow: none !important;
  cursor: pointer;
}

/* Hover/focus like your other buttons */
#async-transmission #input_2.form-submit-button.legacy-submit:hover,
#async-transmission #input_2.form-submit-button.legacy-submit:focus {
  background: var(--accent) !important;  /* red fill */
  color: #000 !important;                /* black text */
  outline: none !important;
}
/* --- Jotform: silence stray helpers + oversized error widgets --- */

/* Jotform sometimes injects empty/undefined helper text; hide them */
#async-transmission .form-description,
#async-transmission .form-sub-label-container,
#async-transmission .form-sub-label {
  display: none !important;
}

/* Hide the per-field error bubbles (we rely on the submit summary) */
#async-transmission .form-error-message,
#async-transmission .form-error-message:before,
#async-transmission .form-error-message .form-error-arrow {
  display: none !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Also neutralize any leftover line-level error styling */
#async-transmission .form-line-error {
  background: transparent !important;
  box-shadow: none !important;
}
/* Force VT323 font + sizing on all Jotform form text */
#async-transmission,
#async-transmission input,
#async-transmission textarea,
#async-transmission label,
#async-transmission button,
#async-transmission .form-header,
#async-transmission .form-subHeader {
  font-family: 'VT323', monospace !important;
  font-size: 18px !important;
  line-height: 1.4em !important;
  color: #ff3333 !important; /* match your site’s red */
}
/* Jotform Send button styled like other site buttons */
#async-transmission .form-submit-button {
  background: transparent !important;
  border: 1px solid #ff3333 !important;
  border-radius: 8px !important;
  color: #ff3333 !important;
  font-family: 'VT323', monospace !important;
  font-size: 20px !important;
  padding: 10px 24px !important;
  text-transform: none !important;
  cursor: pointer !important;
  transition: all 0.2s ease-in-out;
  display: inline-block;
  margin-top: 1rem;
}

#async-transmission .form-submit-button:hover {
  background: #ff3333 !important;
  color: #000 !important;
}
/* --- VT323 everywhere inside the Jotform (strong scope) --- */
#async-transmission .form-all,
#async-transmission .form-all *:not(img):not(svg):not(path) {
  font-family: 'VT323', ui-monospace, Menlo, Consolas, monospace !important;
  font-size: clamp(18px, 2vw, 22px) !important;
  line-height: 1.45 !important;
  color: var(--ink) !important; /* your red */
}

/* Make placeholders readable in your theme */
#async-transmission ::placeholder { color: var(--muted) !important; opacity: .9; }

/* --- Send button: force your site style (match "View All KeyPubs") --- */
#async-transmission .form-buttons-wrapper { text-align: center !important; }

#async-transmission #input_2.form-submit-button.legacy-submit,
#async-transmission .form-submit-button.form-submit-button-orange-500,
#async-transmission button[type="submit"].form-submit-button {
  background: transparent !important;
  background-image: none !important;       /* kill Jotform gradient */
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;

  color: var(--ink) !important;             /* red text */
  font-family: 'VT323', ui-monospace, monospace !important;
  font-size: clamp(16px, 1.6vw, 20px) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-align: center !important;

  display: block !important;
  width: min(50%, 420px) !important;        /* 50% like your center button */
  margin: 1.5rem auto 0 !important;
  padding: 12px 20px !important;

  box-shadow: none !important;
  cursor: pointer !important;
  text-decoration: none !important;
}

#async-transmission #input_2.form-submit-button.legacy-submit:hover,
#async-transmission .form-submit-button.form-submit-button-orange-500:hover,
#async-transmission button[type="submit"].form-submit-button:hover,
#async-transmission #input_2.form-submit-button.legacy-submit:focus {
  background: var(--accent) !important;     /* red fill on hover */
  color: #000 !important;                   /* black text, like other buttons */
  outline: none !important;
}
/* ——— Jotform SEND button: force same style as site buttons ——— */

/* Center the button row */
#async-transmission .form-buttons-wrapper { text-align: center !important; }

/* Base state — kill Jotform skins completely */
#async-transmission #input_2,
#async-transmission #input_2.form-submit-button,
#async-transmission #input_2.form-submit-button.legacy-submit,
#async-transmission .form-submit-button,
#async-transmission .form-submit-button.form-submit-button-orange-500,
#async-transmission button[type="submit"].form-submit-button {
  display: block !important;
  width: min(50%, 420px) !important;
  margin: 1.5rem auto 0 !important;
  padding: 12px 20px !important;

  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;

  border: 1px solid var(--border) !important;
  border-radius: 12px !important;

  color: var(--ink) !important;              /* red text */
  font-family: 'VT323', ui-monospace, monospace !important;
  font-size: clamp(16px, 1.6vw, 20px) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-transform: none !important;
  text-shadow: none !important;

  box-shadow: none !important;
  filter: none !important;
  outline: none !important;
  cursor: pointer !important;
}

/* Hover / focus / active — same behavior as your other buttons */
#async-transmission #input_2:hover,
#async-transmission #input_2:focus,
#async-transmission #input_2:active,
#async-transmission .form-submit-button:hover,
#async-transmission .form-submit-button:focus,
#async-transmission .form-submit-button:active {
  background: var(--accent) !important;      /* red fill */
  background-image: none !important;
  border-color: var(--accent) !important;
  color: #000 !important;                    /* black text on red */
  box-shadow: none !important;
}

/* Jotform sometimes injects state classes; override those too */
#async-transmission .form-submit-button.form-submit-button-orange-500,
#async-transmission .form-submit-button.form-submit-button-orange-500:hover,
#async-transmission .form-submit-button.form-submit-button-orange-500:focus,
#async-transmission .form-submit-button.form-submit-button-orange-500:active {
  background: transparent !important;
  background-image: none !important;
  color: var(--ink) !important;
  border-color: var(--border) !important;
}


