:root {
  --bg:#f5f5f2;
  --fg:#111;
  --muted:#666;
  --line:#bdbdb8;
  --soft:#e9e9e5;
  --button:#111;
  --buttonText:#f5f5f2;
  --danger:#9d1818;
  --success:#24662c;
}
html[data-theme="dark"] {
  --bg:#050505;
  --fg:#f2f2f2;
  --muted:#9a9a9a;
  --line:#333;
  --soft:#111;
  --button:#f2f2f2;
  --buttonText:#050505;
  --danger:#ff7575;
  --success:#7cc985;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; color-scheme:light; }
html[data-theme="dark"] { color-scheme:dark; }
body {
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:Arial, Helvetica, sans-serif;
  font-size:15px;
  line-height:1.55;
}
a { color:inherit; }
button, input, textarea, select { font:inherit; }
.wrap {
  width:min(1040px, calc(100% - 40px));
  margin:0 auto;
}
.header {
  height:74px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
}
.wordmark {
  text-decoration:none;
  font-family:"Courier New", monospace;
  font-size:14px;
  font-weight:bold;
  letter-spacing:.08em;
}
nav { display:flex; align-items:center; gap:24px; }
nav a, #themeToggle {
  background:none;
  border:0;
  padding:0;
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:12px;
  text-decoration:none;
  cursor:pointer;
}
nav a:hover, #themeToggle:hover { color:var(--fg); text-decoration:underline; }

.hero { padding:92px 0 0; }
.hero-meta { display:flex; align-items:center; gap:12px; }
.kicker, .label, .small, .beta-mark {
  font-family:"Courier New", monospace;
  font-size:11px;
  letter-spacing:.08em;
}
.kicker, .label { color:var(--muted); }
.kicker { margin:0; }
.beta-mark {
  display:inline-block;
  padding:2px 6px;
  border:1px solid var(--fg);
  font-weight:bold;
}
h1 {
  margin:12px 0 0;
  font-family:"Arial Black", Arial, sans-serif;
  font-size:clamp(58px, 11vw, 118px);
  line-height:.9;
  letter-spacing:-.06em;
}
.headline {
  margin:25px 0 0;
  max-width:750px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(28px, 4vw, 46px);
  line-height:1.12;
}
.intro {
  max-width:640px;
  margin:20px 0 0;
  color:var(--muted);
  font-size:17px;
}
.actions { display:flex; gap:10px; margin-top:30px; flex-wrap:wrap; }
.button {
  display:inline-block;
  padding:11px 16px;
  border:1px solid var(--fg);
  border-radius:0;
  background:transparent;
  color:var(--fg);
  text-decoration:none;
  font-family:"Courier New", monospace;
  font-size:12px;
  font-weight:bold;
  cursor:pointer;
}
.button.invert {
  background:var(--button);
  color:var(--buttonText);
}
.button:hover { text-decoration:underline; }
.founding-banner {
  display:grid;
  grid-template-columns:260px 1fr;
  gap:28px;
  margin-top:38px;
  padding:14px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  font-family:"Courier New", monospace;
  font-size:11px;
}
.founding-banner span { color:var(--muted); }
.hero-demo { margin-top:58px; aspect-ratio:16/8.5; }

.media, .video {
  border:1px solid var(--line);
  background:var(--soft);
  overflow:hidden;
}
.media img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.placeholder {
  width:100%;
  height:100%;
  min-height:260px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:12px;
  text-align:center;
}
.placeholder strong { color:var(--fg); font-size:13px; }
.statement {
  display:flex;
  justify-content:space-between;
  padding:22px 0;
  border-bottom:1px solid var(--line);
  font-family:"Courier New", monospace;
}
.statement p { margin:0; font-weight:bold; }
.statement span { color:var(--muted); }

section.wrap:not(.hero):not(.statement):not(.subpage-hero) { padding-top:100px; }
.section-title {
  display:flex;
  align-items:baseline;
  gap:16px;
  padding-bottom:13px;
  border-bottom:1px solid var(--line);
}
.section-title span {
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:11px;
}
.section-title h2 {
  margin:0;
  font-family:"Courier New", monospace;
  font-size:14px;
  letter-spacing:.08em;
}
.feature {
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:42px;
  align-items:center;
  padding:62px 0;
  border-bottom:1px solid var(--line);
}
.feature.reverse .media { order:2; }
.feature .media { aspect-ratio:16/10; }
.copy h3, .buy h3 {
  margin:8px 0 14px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:33px;
  line-height:1.08;
  font-weight:normal;
}
.copy p:last-child { color:var(--muted); }
.tutorial .section-intro,
.section-intro {
  max-width:680px;
  color:var(--muted);
  margin:26px 0;
}
.section-intro.compact { margin-top:12px; }
.video { aspect-ratio:16/9; }
.video iframe { width:100%; height:100%; border:0; }

.buy-grid {
  display:grid;
  grid-template-columns:1fr 360px;
  gap:70px;
  padding:50px 0;
  border-bottom:1px solid var(--line);
}
.buy ul {
  padding:0;
  margin:24px 0 0;
  list-style:none;
}
.buy li { margin:8px 0; }
.buy li::before { content:"— "; color:var(--muted); }
.purchase {
  padding-left:28px;
  border-left:1px solid var(--line);
}
.price {
  margin:8px 0 0;
  font-family:Georgia, "Times New Roman", serif;
  font-size:48px;
}
.price small { font:12px Arial, sans-serif; color:var(--muted); }
.muted, .note { color:var(--muted); }
.note { font-size:11px; margin-top:18px; }
.founding-count {
  margin:16px 0 0;
  padding:8px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  font-family:"Courier New", monospace;
  font-size:11px;
}
.purchase .button { width:100%; text-align:center; margin-top:22px; }
.plain-link {
  display:block;
  margin-top:16px;
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:11px;
}
.disabled { opacity:.4; pointer-events:none; }

.install ol {
  padding:24px 0 0;
  margin:0;
  list-style:none;
  border-bottom:1px solid var(--line);
}
.install li {
  padding:15px 0;
  border-top:1px solid var(--line);
}
.install li:first-child { border-top:0; }
.install b {
  display:inline-block;
  width:36px;
  font-family:"Courier New", monospace;
}

.faq details { border-bottom:1px solid var(--line); }
.faq summary {
  padding:20px 0;
  cursor:pointer;
  font-family:"Courier New", monospace;
  font-size:12px;
  font-weight:bold;
}
.faq details p {
  max-width:700px;
  margin:0;
  padding:0 0 22px;
  color:var(--muted);
}

/* Subpages */
.subpage-hero { padding:88px 0 54px; border-bottom:1px solid var(--line); }
.subpage-title {
  margin-top:12px;
  font-size:clamp(48px, 9vw, 92px);
}
.subpage-intro {
  max-width:700px;
  margin:24px 0 0;
  color:var(--muted);
  font-family:Georgia, "Times New Roman", serif;
  font-size:24px;
  line-height:1.3;
}
.mode-note {
  margin:18px 0 0;
  padding:8px 10px;
  border:1px solid var(--line);
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:11px;
}

/* Upcoming */
.dev-feed { padding-top:58px !important; }
.dev-post {
  max-width:820px;
  padding:0 0 54px;
  border-bottom:1px solid var(--line);
}
.dev-post-meta {
  display:flex;
  justify-content:space-between;
  gap:20px;
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:11px;
}
.dev-post h2 {
  max-width:760px;
  margin:18px 0 18px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:36px;
  line-height:1.12;
  font-weight:normal;
}
.dev-post p { max-width:720px; color:var(--muted); font-size:17px; }
.dev-post .dev-signoff { margin-top:28px; color:var(--fg); font-family:"Courier New", monospace; font-size:12px; }
.dev-note {
  max-width:720px;
  padding:30px 0 0;
  font-family:"Courier New", monospace;
  font-size:11px;
}
.dev-note p { color:var(--muted); line-height:1.7; }

/* Ideas */
.ideas-layout {
  display:grid;
  grid-template-columns:360px 1fr;
  gap:58px;
  padding-top:58px !important;
}
.idea-form-panel { align-self:start; }
.compact-title { padding-bottom:10px; }
.grow { flex:1; }
.idea-form { padding-top:24px; }
.idea-form label { display:block; margin-bottom:18px; }
.idea-form label > span {
  display:block;
  margin-bottom:7px;
  font-family:"Courier New", monospace;
  font-size:10px;
  font-weight:bold;
  letter-spacing:.06em;
}
.idea-form label em { color:var(--muted); font-style:normal; font-weight:normal; }
.idea-form input,
.idea-form textarea,
#ideaSort {
  width:100%;
  border:1px solid var(--line);
  border-radius:0;
  background:var(--bg);
  color:var(--fg);
  padding:10px;
  outline:none;
}
.idea-form textarea { resize:vertical; min-height:150px; }
.idea-form input:focus,
.idea-form textarea:focus,
#ideaSort:focus { border-color:var(--fg); }
.honeypot { position:absolute !important; left:-9999px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.captcha-row { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:end; }
.captcha-row label { margin:0; }
.text-button {
  border:0;
  background:none;
  color:var(--muted);
  padding:10px 0;
  cursor:pointer;
  font-family:"Courier New", monospace;
  font-size:10px;
  text-decoration:underline;
}
.submit-idea { width:100%; }
.form-status {
  min-height:20px;
  margin:12px 0 0;
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:10px;
}
.form-status.error { color:var(--danger); }
.form-status.success { color:var(--success); }
.ideas-feed-header { display:flex; gap:18px; align-items:flex-start; }
#ideaSort {
  width:auto;
  min-width:150px;
  padding:7px 8px;
  font-family:"Courier New", monospace;
  font-size:10px;
}
.ideas-list { border-top:1px solid var(--line); }
.idea-card {
  display:grid;
  grid-template-columns:72px 1fr;
  gap:20px;
  padding:26px 0;
  border-bottom:1px solid var(--line);
}
.vote-button {
  align-self:start;
  border:1px solid var(--line);
  background:var(--bg);
  color:var(--fg);
  padding:9px 5px;
  cursor:pointer;
  font-family:"Courier New", monospace;
  font-size:10px;
  text-align:center;
}
.vote-button strong { display:block; margin-top:3px; font-size:14px; }
.vote-button.voted { background:var(--soft); }
.idea-card h3 {
  margin:0 0 7px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:24px;
  line-height:1.2;
  font-weight:normal;
}
.idea-card-body { margin:0; color:var(--muted); white-space:pre-wrap; overflow-wrap:anywhere; }
.idea-meta {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:14px;
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:10px;
}
.idea-status {
  display:inline-block;
  border:1px solid var(--line);
  padding:1px 5px;
  color:var(--fg);
}
.ideas-empty {
  padding:60px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:11px;
}
.ideas-empty strong { display:block; color:var(--fg); margin-bottom:4px; }

.footer {
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:24px;
  align-items:start;
  margin-top:110px;
  padding:24px 0 35px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:11px;
}
.footer-brand, .footer-links { display:flex; gap:18px; flex-wrap:wrap; }
.footer-brand { flex-direction:column; gap:2px; }
.footer-links { justify-content:center; }
.footer a { color:var(--muted); }
.footer-copy { text-align:right; }

@media (max-width:760px) {
  .header { height:auto; padding:18px 0; align-items:flex-start; }
  nav { gap:12px; flex-wrap:wrap; justify-content:flex-end; }
  nav a { display:none; }
  .hero { padding-top:60px; }
  .founding-banner { grid-template-columns:1fr; gap:6px; }
  .hero-demo { margin-top:42px; aspect-ratio:4/3; }
  .statement { display:block; }
  .statement span { display:block; margin-top:4px; }
  section.wrap:not(.hero):not(.statement):not(.subpage-hero) { padding-top:72px; }
  .feature, .buy-grid, .ideas-layout { grid-template-columns:1fr; gap:38px; }
  .feature.reverse .media { order:0; }
  .purchase { padding-left:0; border-left:0; border-top:1px solid var(--line); padding-top:28px; }
  .subpage-hero { padding-top:58px; }
  .subpage-intro { font-size:20px; }
  .ideas-feed-header { display:block; }
  #ideaSort { margin:14px 0 18px; width:100%; }
  .idea-card { grid-template-columns:58px 1fr; gap:14px; }
  .footer { grid-template-columns:1fr; }
  .footer-links { justify-content:flex-start; }
  .footer-copy { text-align:left; }
}

/* ---------------------------------------------------------
   Purchase success / license delivery
--------------------------------------------------------- */

.success-page {
  padding-top:88px;
  max-width:1040px;
}

.success-title {
  margin-top:12px;
  font-size:clamp(58px, 10vw, 108px);
}

.success-intro {
  max-width:650px;
  margin:24px 0 54px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:28px;
  line-height:1.25;
}

.license-state {
  max-width:760px;
  padding:28px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  color:var(--muted);
}

.license-state.error {
  color:var(--danger);
}

.license-status-label {
  display:block;
  margin-bottom:10px;
  color:var(--fg);
  font-family:"Courier New", monospace;
  font-size:11px;
  font-weight:bold;
  letter-spacing:.08em;
}

.license-panel {
  max-width:800px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:30px 0 34px;
}

.license-key-row {
  display:flex;
  gap:14px;
  align-items:center;
  margin-top:12px;
}

.license-key {
  flex:1;
  display:block;
  padding:18px 20px;
  border:1px solid var(--fg);
  background:var(--soft);
  color:var(--fg);
  font-family:"Courier New", monospace;
  font-size:clamp(17px, 3vw, 25px);
  font-weight:bold;
  letter-spacing:.035em;
  overflow-wrap:anywhere;
}

.license-key-row .button {
  flex:none;
  padding:18px 18px;
}

.license-details {
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  margin-top:18px;
  color:var(--muted);
  font-family:"Courier New", monospace;
  font-size:10px;
  letter-spacing:.07em;
}

.license-warning {
  max-width:620px;
  margin:30px 0 0;
  color:var(--muted);
}

.success-actions {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:30px;
}

@media (max-width:760px) {

  .success-page {
    padding-top:58px;
  }

  .success-intro {
    font-size:22px;
    margin-bottom:40px;
  }

  .license-key-row {
    display:block;
  }

  .license-key-row .button {
    width:100%;
    margin-top:10px;
  }

  .success-actions .button {
    width:100%;
    text-align:center;
  }

}

.hero-demo {
  width: 100%;
  height: auto;
}

.hero-video-player {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  background: #000;
}

.feature .media {
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

.feature .media img,
.feature .media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.tutorial-video-player {
  display: block;
  width: 100%;
  height: auto;
  background: #000;
}

.purchase-note {
  margin-top: 14px;
  font-size: 0.75rem;
  font-family: inherit;
  letter-spacing: 0.04em;
  opacity: 0.9;
}

/* Free download / Pro journey: extend the existing monochrome theme. */
.homepage, .download-page { font-size:16px; }
.homepage .hero { padding-top:64px; }
.homepage h1 { font-size:clamp(56px, 9vw, 104px); }
.homepage .hero-demo { margin-top:36px; }
.hero-note, .download-note {
  color:var(--muted);
  font-size:14px;
  line-height:1.6;
}
.hero-note { margin:14px 0 0; }
.homepage .founding-banner { font-size:13px; }
.homepage nav a, .download-page nav a,
.homepage .button, .download-page .button { font-size:14px; }
.homepage .label, .download-page .label,
.homepage .section-title h2, .download-page .section-title h2 { font-size:14px; }
.homepage section.wrap:not(.hero):not(.statement) { padding-top:72px; }
.free-download-panel {
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:40px;
  margin-top:28px;
  padding:30px;
  border:1px solid var(--line);
}
.free-download-copy { min-width:0; }
.free-download-copy h3, .activation-copy h3, .success-download h2 {
  margin:8px 0 20px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:30px;
  line-height:1.2;
  font-weight:normal;
}
.free-download-copy h3 { margin:0 0 10px; }
.free-download-copy p { margin:0; max-width:640px; color:var(--muted); }
.free-download-panel .button { white-space:nowrap; }
.download-intro { max-width:660px; margin:24px 0 0; }
.download-note { max-width:720px; margin-top:18px; }
.download-status { color:var(--muted); max-width:650px; }
.install-steps {
  counter-reset:installation;
  list-style:none;
  margin:0;
  padding:0;
  max-width:820px;
}
.install-steps li {
  position:relative;
  padding:24px 0 24px 58px;
  border-bottom:1px solid var(--line);
}
.install-steps li::before {
  counter-increment:installation;
  content:counter(installation, decimal-leading-zero);
  position:absolute;
  left:0;
  top:26px;
  color:var(--muted);
  font:14px "Courier New", monospace;
}
.install-steps h3 { margin:0 0 8px; font-size:20px; }
.install-steps p { margin:0; color:var(--muted); }
.activation-copy { max-width:740px; padding-top:28px; }
.activation-copy li { margin:12px 0; }
.success-download { max-width:800px; margin-top:36px; padding-top:28px; border-top:1px solid var(--line); }
[hidden] { display:none !important; }
.button:focus-visible, nav a:focus-visible { outline:2px solid var(--fg); outline-offset:4px; }
@media (max-width:760px) {
  .homepage .header, .download-page .header { gap:20px; flex-wrap:wrap; }
  .homepage nav, .download-page nav { gap:14px; }
  .homepage nav a, .download-page nav a { display:inline; font-size:12px; }
  .homepage .hero { padding-top:44px; }
  .homepage .hero-meta { flex-wrap:wrap; }
  .free-download-panel { grid-template-columns:1fr; gap:22px; padding:24px; }
  .free-download-panel .button { width:100%; text-align:center; white-space:normal; }
  .homepage .actions .button, .download-page .actions .button { width:100%; text-align:center; }
  .install-steps li { padding-left:40px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Free extensions reuse the site's typography, colors, and section rhythm. */
.extension-page { font-size:16px; }
.extension-page .header { height:auto; min-height:74px; gap:20px; padding-top:18px; padding-bottom:18px; flex-wrap:wrap; }
.extension-page nav { flex-wrap:wrap; }
.extension-page nav a { display:inline; }
.extension-intro, .extension-details > p, .extension-details > ol { max-width:760px; }
.extension-intro { color:var(--muted); margin-top:24px; }
.extension-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:40px; }
.extension-card { border:1px solid var(--line); padding:28px; display:flex; flex-direction:column; align-items:flex-start; }
.extension-card h2 { font:normal 34px/1.2 Georgia,"Times New Roman",serif; margin:8px 0; }
.extension-card > p:not(.label) { color:var(--muted); }
.extension-card .button { margin-top:auto; }
.extension-download { margin-top:28px; }
.extension-demo { margin:36px 0 0; }
.extension-demo video { display:block; width:100%; height:auto; background:var(--soft); border:1px solid var(--line); }
.extension-demo figcaption { margin-top:12px; color:var(--muted); font-size:14px; }
.demo-toggle { background:none; color:var(--fg); border:1px solid var(--line); padding:8px 12px; margin-top:12px; cursor:pointer; font:12px "Courier New",monospace; }
.extension-details > p, .extension-details li { color:var(--muted); }
.extension-details li { margin:14px 0; }
.extension-crosslink { margin-top:40px; padding-top:24px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; }
.extension-page a:focus-visible, .demo-toggle:focus-visible { outline:2px solid var(--fg); outline-offset:4px; }
.extension-skip { position:absolute; top:8px; left:20px; transform:translateY(-200%); padding:10px; background:var(--bg); z-index:2; }
.extension-skip:focus { transform:none; }
@media (max-width:760px) {
  .extension-cards { grid-template-columns:1fr; }
  .extension-page nav { justify-content:flex-start; gap:14px; }
  .extension-page .subpage-title { overflow-wrap:anywhere; }
  .homepage .header { height:auto; min-height:74px; padding-top:18px; padding-bottom:18px; }
}

/* Legal page: readable policy text within the existing site theme. */
.legal-page { font-size:16px; }
.legal-page .subpage-hero > p { max-width:760px; }
.legal-page .legal-date { margin-top:24px; color:var(--muted); font-size:14px; }
.legal-page .legal-contents { display:flex; flex-wrap:wrap; justify-content:flex-start; gap:14px 24px; margin-top:28px; }
.legal-page .legal-contents a { display:inline; font-size:14px; text-decoration:underline; }
.legal-page .legal-section { scroll-margin-top:24px; }
.legal-page .section-title h2 { font-size:14px; }
.legal-page .legal-copy { max-width:760px; padding-top:14px; overflow-wrap:anywhere; }
.legal-page .legal-copy h3 { margin:30px 0 12px; font:normal 26px/1.2 Georgia, "Times New Roman", serif; }
.legal-page .legal-copy p, .legal-page .legal-copy li, .legal-page .legal-copy dd { color:var(--muted); line-height:1.7; }
.legal-page .legal-copy li { margin:12px 0; }
.legal-page .legal-copy dt { margin-top:22px; font-weight:bold; }
.legal-page .legal-copy dd { margin:8px 0 0; }
.legal-page a:focus-visible { outline:2px solid var(--fg); outline-offset:4px; }
@media (max-width:760px) {
  .legal-page .section-title { gap:12px; }
  .legal-page .legal-contents { flex-direction:column; align-items:flex-start; }
}
