:root {
  --bg: #080706;
  --bg2: #14100c;
  --ink: #f4ede4;
  --muted: #b8a090;
  --line: #3d2a1c;
  --accent: #ff7a0c;
  --accent2: #1a5c4a;
  --peach: #ff7a0c;
  --danger: #d46464;
  --font: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --sans: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --mono: "IBM Plex Mono", "Cascadia Mono", ui-monospace, monospace;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  min-height: 100dvh;
  color: var(--ink);
  font-family: var(--sans);
  background: var(--bg);
  line-height: 1.45;
}
a { color: inherit; text-decoration: none; }
.brand {
  margin: 0;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-size: 0.72rem;
  color: var(--accent);
  font-weight: 650;
}
.muted { color: var(--muted); }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.hero {
  position: relative;
  min-height: min(72dvh, 640px);
  display: grid;
  align-items: end;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(8,7,6,0.12), rgba(8,7,6,0.88)),
    radial-gradient(900px 520px at 50% 8%, #a85622 0%, transparent 58%),
    radial-gradient(700px 420px at 8% 90%, #3d1c0c 0%, transparent 52%),
    linear-gradient(165deg, #1e1610, #080706 62%);
}
.hero.friendly { min-height: 0; align-items: start; overflow: visible; }
.brand-mark img {
  display: block;
  width: 72px;
  height: 72px;
  object-fit: contain;
}
.hello {
  color: var(--peach);
  font-weight: 600;
}
.welcome-row {
  display: flex;
  align-items: center;
  gap: 0.9rem 1.25rem;
  margin: 0 0 0.7rem;
}
.welcome-row .welcome {
  margin: 0;
  flex: 0 0 auto;
}
.welcome-row.has-lede .welcome-logo,
.welcome-row.has-lede .wx-logo-once {
  max-width: min(8.4rem, 36vw);
  max-height: 5.8rem;
}
.welcome-row .hero-lede {
  flex: 1 1 14rem;
  margin: 0;
  max-width: 28rem;
  font-size: 0.95rem;
  line-height: 1.4;
}
.welcome {
  font-family: var(--font);
  font-size: clamp(1.8rem, 5vw, 2.6rem);
  font-weight: 550;
  margin: 0 0 0.45rem;
  color: var(--ink);
}
.welcome-logo {
  display: block;
  width: min(11rem, 46vw);
  max-height: 11rem;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: left center;
}
.hero-veil {
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  opacity: 0.35;
  pointer-events: none;
}
.hero-inner {
  position: relative;
  z-index: 1;
  padding: 1.25rem 1.35rem 2.5rem;
  max-width: 980px;
  margin: 0 auto;
  width: 100%;
}
.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: clamp(1.4rem, 6vh, 2.4rem);
}
.top-nav { display: flex; gap: 1rem; align-items: center; font-size: 0.9rem; }
.wx-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.85rem 1.1rem;
  flex-wrap: wrap;
  margin-bottom: 1.15rem;
}
.wx-top .top-nav {
  margin-left: auto;
  flex-shrink: 0;
}
.wx-logo-once {
  width: auto;
  max-width: min(11rem, 58vw);
  max-height: 6.5rem;
  height: auto;
  object-fit: contain;
  object-position: center;
}
.wx-langs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  flex: 1 1 16rem;
}
.wx-langs a {
  display: inline-block;
  padding: 0.18rem 0.5rem;
  border: 1px solid rgba(244, 237, 228, 0.32);
  border-radius: 99px;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  font-weight: 650;
  color: #f4ede4;
  background: rgba(244, 237, 228, 0.06);
}
.wx-langs a:hover,
.wx-langs a:focus-visible {
  border-color: var(--peach);
  color: #ffd2a0;
  background: rgba(255, 122, 12, 0.14);
}
.wx-langs a.is-on,
.wx-langs a[aria-current="true"] {
  border-color: var(--peach);
  color: #ffb36a;
  background: rgba(255, 122, 12, 0.2);
}
.wx-langs-more select {
  appearance: none;
  background: #14100c;
  border: 1px solid rgba(244, 237, 228, 0.32);
  border-radius: 99px;
  padding: 0.2rem 0.7rem;
  font: inherit;
  font-size: 0.72rem;
  color: #f4ede4;
}
.badge {
  display: inline-block;
  margin: 0 0 0.65rem;
  padding: 0.2rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 99px;
  color: var(--accent2);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
}
.beta-mark {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.08rem 0.45rem;
  border-radius: 99px;
  background: #ff7a0c;
  color: #080706;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  vertical-align: 0.12em;
  text-transform: uppercase;
}
.hero-title {
  font-family: var(--font);
  font-weight: 550;
  font-size: clamp(3rem, 9vw, 5.2rem);
  line-height: 0.95;
  margin: 0 0 0.75rem;
  letter-spacing: -0.02em;
}
.home-jump {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0.85rem 0 0;
  max-width: 42rem;
}
.home-jump a {
  border: 1px solid var(--line);
  background: rgba(20, 16, 12, 0.72);
  color: inherit;
  border-radius: 999px;
  padding: 0.28rem 0.72rem;
  font-size: 0.82rem;
  line-height: 1.3;
}
.home-jump a:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.has-tip {
  position: relative;
}
.has-tip[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  left: 50%;
  top: calc(100% + 0.38rem);
  transform: translateX(-50%);
  background: #1a1510;
  color: #f4ece3;
  border: 1px solid var(--accent);
  border-radius: 0.45rem;
  padding: 0.28rem 0.58rem;
  font-size: 0.75rem;
  font-weight: 550;
  letter-spacing: 0.01em;
  line-height: 1.25;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 40;
  box-shadow: 0 0.45rem 1.1rem rgba(0, 0, 0, 0.4);
}
.has-tip[data-tip]:hover::after,
.has-tip[data-tip]:focus-visible::after {
  opacity: 1;
  visibility: visible;
}
.home-jump .has-tip[data-tip]::after {
  top: auto;
  bottom: calc(100% + 0.38rem);
}
.top-nav .has-tip[data-tip]::after {
  left: auto;
  right: 0;
  transform: none;
}
.wx-top,
.home-jump,
.top-nav,
.wx-langs {
  overflow: visible;
}
.hero-lede {
  max-width: 34rem;
  color: var(--muted);
  font-size: 1.05rem;
  margin: 0 0 1.25rem;
}
.search-hero {
  display: flex;
  gap: 0.5rem;
  max-width: 36rem;
  margin: 0 0 1.1rem;
}
.search-hero input,
.search-event input,
.search-event select {
  flex: 1;
  border: 1px solid var(--line);
  background: #14100c;
  color: var(--ink);
  border-radius: 999px;
  padding: 0.75rem 1rem;
  font: inherit;
  min-height: 2.85rem;
}
.search-event {
  display: grid;
  gap: 0.7rem;
  max-width: 46rem;
  margin: 0 0 1.1rem;
}
.search-event .search-fields {
  display: grid;
  gap: 0.55rem;
}
.search-event .field,
.search-event input,
.search-event select {
  min-width: 0;
  max-width: 100%;
}
.search-event .search-when {
  grid-template-columns: 1fr 1fr;
}
.search-event .field span {
  display: block;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 0.28rem 0.35rem;
}
.search-event select {
  appearance: none;
  min-width: 7.5rem;
  padding-right: 2rem;
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 1.05rem) 1.2rem, calc(100% - 0.7rem) 1.2rem;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}
.search-event .search-go {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
@media (min-width: 760px) {
  .search-event .search-fields {
    grid-template-columns: 1.15fr 1fr minmax(7.5rem, 0.7fr) auto;
    align-items: end;
  }
  .search-event .search-go { display: contents; }
  .search-event .search-when {
    grid-template-columns: minmax(9rem, 0.7fr) minmax(9rem, 0.7fr);
    max-width: 24rem;
  }
}
.search-hero button,
.search-event button,
.ki-form button,
.login-form button {
  border: 0;
  border-radius: 999px;
  padding: 0.75rem 1.2rem;
  background: var(--peach);
  color: #2a1c12;
  font-weight: 700;
  font: inherit;
  cursor: pointer;
}
.cta-row { display: flex; flex-wrap: wrap; gap: 0.65rem; }
.cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.15rem;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: rgba(0,0,0,0.25);
  font-weight: 600;
}
.cta:hover { border-color: var(--accent); }
.cta.primary {
  background: var(--accent);
  color: #1a140c;
  border-color: transparent;
}

.wrap { max-width: 980px; margin: 0 auto; padding: 1.5rem 1.35rem 3rem; }
.block { margin-top: 1.5rem; }
.block h2, .notice h2 {
  font-family: var(--font);
  font-size: 1.55rem;
  margin: 0 0 0.35rem;
  font-weight: 550;
}
.section-lede { color: var(--muted); margin: 0 0 1rem; }
.disk-row, .usb-admin {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 0.75rem;
}
.usb-admin { margin-top: 1rem; }
.disk {
  background: #14100c;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0.75rem 0.85rem;
}
.disk-id { font-size: 0.78rem; letter-spacing: 0.04em; color: var(--muted); }
.disk-pct { font-size: 1.25rem; font-weight: 650; margin: 0.2rem 0 0.35rem; }
.disk-meta { font-size: 0.82rem; }
.mesh-list {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}
.mesh-list li {
  display: grid;
  gap: 0.15rem;
  background: var(--bg2, #14100c);
  border: 1px solid var(--line, #3d2a1c);
  border-radius: 10px;
  padding: 0.7rem 0.85rem;
}
.docker-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 0.65rem;
}
.disk .bar {
  height: 6px;
  background: #1e1610;
  border-radius: 99px;
  overflow: hidden;
  margin: 0.2rem 0 0.45rem;
}
.disk .bar span {
  display: block;
  height: 100%;
  background: var(--accent2);
}
.service-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.service-list li { border-bottom: 1px solid var(--line); }
.service-list a {
  display: grid;
  gap: 0.15rem;
  padding: 1rem 0.15rem;
}
.service-list a:hover { color: var(--accent); }
.s-name { font-size: 1.15rem; font-weight: 650; }
.s-desc { color: var(--muted); font-size: 0.92rem; }
.notice {
  margin-top: 2rem;
  padding: 1rem 1.05rem;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #14100c;
}
.notice.soft {
  background: rgba(20, 32, 28, 0.7);
  border-radius: 16px;
}
.notice p { margin: 0.35rem 0 0; color: var(--muted); }
.notice.soft p { margin: 0; }

.tile-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
}
@media (min-width: 700px) {
  .tile-grid { grid-template-columns: 1fr 1fr; }
}
.tile {
  display: grid;
  gap: 0.25rem;
  padding: 1.15rem 1.15rem 1.2rem;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(180deg, #1e1610, #14100c);
  transition: border-color 0.2s, transform 0.2s;
}
.tile:hover { border-color: var(--accent2); transform: translateY(-2px); }
.tile-accent { border-color: #4a3a2a; background: linear-gradient(180deg, #2a241c, #161410); }
.tile-accent:hover { border-color: var(--peach); }
.home-public .hero.friendly { min-height: min(42dvh, 380px); }
.home-public-main { max-width: 42rem; }
.home-register { margin-top: 1.6rem; }
.home-apply { margin-top: 1.4rem; }
.home-register h2 { margin: 0 0 0.4rem; font-size: 1.15rem; }
.reg-about {
  margin: 0.55rem 0 1rem;
  max-width: 42rem;
}
.reg-about h3 {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  font-weight: 650;
}
.reg-about p {
  margin: 0 0 0.7rem;
  line-height: 1.5;
}
.reg-about p:last-child { margin-bottom: 0; }
.reg-limits {
  margin: 0.85rem 0 0;
  padding: 0.85rem 1rem;
  border: 2px solid #ff1a1a;
  border-radius: 0.4rem;
  background: #3a0606;
  color: #ff3b3b;
  box-shadow: 0 0 0 1px rgba(255, 40, 40, 0.35);
}
.reg-limits p {
  margin: 0;
  color: #ff3b3b;
  font-weight: 600;
  line-height: 1.45;
}
.reg-limits a {
  color: #ff8a8a;
  text-decoration: underline;
}
.reg-limits a:hover { color: #ffc0c0; }
.reg-limits em {
  display: block;
  margin-top: 0.55rem;
  font-style: italic;
  font-weight: 500;
  color: #ff6a6a;
}
.legal-check.reg-limits-check {
  margin: 0.9rem 0 0.35rem;
  padding: 0.7rem 0.85rem;
  border: 2px solid #ff1a1a;
  border-radius: 0.4rem;
  background: #3a0606;
  color: #ff3b3b;
  font-weight: 650;
}
.legal-check.reg-limits-check a {
  color: #ff8a8a;
}
.home-register-form { margin-top: 0.85rem; }
.legal-check {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.55rem;
  align-items: start;
}
.legal-check input {
  width: 1.05rem;
  height: 1.05rem;
  margin-top: 0.2rem;
}
.wx-legal h2 {
  margin: 1.15rem 0 0.4rem;
  font-size: 1.05rem;
}
.wx-legal ul { margin: 0 0 0.7rem 1.15rem; }
.wx-legal li { margin: 0 0 0.35rem; }
.home-wx,
.home-news {
  text-decoration: none;
  color: inherit;
}
.home-wx .tile-logo,
.home-news .tile-logo,
.home-hit .tile-logo {
  width: 5.6rem;
  height: 5.6rem;
  object-fit: contain;
}
.home-dash {
  margin: 0 0 1.6rem;
}
.paper {
  background: #181410;
  border: 1px solid var(--line);
  padding: 0.95rem 1.05rem 1.15rem;
}
.paper-mast {
  display: grid;
  grid-template-columns: minmax(9rem, 0.85fr) minmax(12rem, 1.45fr) minmax(10rem, 0.95fr);
  grid-template-areas:
    "main teasers wx"
    "main sky sky";
  gap: 0.75rem 1rem;
  align-items: start;
  border-bottom: 3px double #6a4a32;
  padding-bottom: 0.75rem;
  margin-bottom: 1rem;
}
.paper-mast-main { grid-area: main; }
.paper-kicker {
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
}
.paper-name {
  margin: 0.15rem 0 0;
  font-family: var(--font);
  font-size: clamp(1.45rem, 3.4vw, 2.1rem);
  font-weight: 550;
  letter-spacing: 0.04em;
  line-height: 1;
}
.paper-date {
  margin: 0.45rem 0 0;
  font-size: 0.82rem;
  color: var(--muted);
}
.paper-charts {
  margin-top: 0.55rem;
  padding-top: 0.55rem;
  border-top: 1px solid var(--line);
}
.paper-charts ol {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0;
}
.paper-charts li {
  margin: 0 0 0.45rem;
  padding: 0 0 0.4rem;
  border-bottom: 1px solid #2a2018;
}
.paper-charts li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}
.paper-charts a {
  display: grid;
  gap: 0.08rem;
  text-decoration: none;
  color: inherit;
}
.paper-charts a:hover .paper-teaser-title { color: var(--peach); }
.paper-charts-more {
  margin: 0.45rem 0 0;
  font-size: 0.85rem;
}
.paper-charts-more a { color: var(--accent2); }
.paper-teasers {
  grid-area: teasers;
  list-style: none;
  margin: 0;
  padding: 0 0.9rem;
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
}
.paper-teasers li {
  margin: 0 0 0.55rem;
  padding: 0 0 0.5rem;
  border-bottom: 1px solid #2a2018;
}
.paper-teasers li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}
.paper-teasers a {
  display: grid;
  gap: 0.12rem;
  text-decoration: none;
  color: inherit;
}
.paper-teasers a:hover .paper-teaser-title { color: var(--peach); }
.paper-teaser-title {
  font-family: var(--font);
  font-size: 0.92rem;
  font-weight: 550;
  line-height: 1.22;
}
.paper-wx {
  grid-area: wx;
  display: grid;
  justify-items: end;
  align-content: start;
  gap: 0.12rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  text-decoration: none;
  color: inherit;
  text-align: right;
}
.paper-wx:hover { color: var(--peach); }
.paper-wx-k {
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.paper-wx-place { font-size: 0.82rem; }
.paper-wx-temp {
  font-family: var(--font);
  font-size: 1.85rem;
  line-height: 1;
  color: var(--peach);
  font-weight: 550;
}
.paper-wx-cond { font-size: 0.85rem; color: var(--muted); }
.paper-wx-map {
  display: block;
  width: min(13.5rem, 100%);
  max-height: 9.5rem;
  height: auto;
  object-fit: cover;
  object-position: center;
  margin-top: 0.4rem;
  border: 1px solid var(--line);
}
.paper-sky {
  grid-area: sky;
  min-width: 0;
  border-top: 1px solid var(--line);
  padding-top: 0.55rem;
}
.paper-sky ol {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0;
  columns: 2;
  column-gap: 1.1rem;
}
.paper-sky li {
  break-inside: avoid;
  margin: 0 0 0.45rem;
  padding: 0 0 0.4rem;
  border-bottom: 1px solid #2a2018;
}
.paper-sky li:last-child {
  margin-bottom: 0;
}
.paper-sky a {
  display: grid;
  gap: 0.08rem;
  text-decoration: none;
  color: inherit;
}
.paper-sky a:hover .paper-teaser-title { color: var(--peach); }
.paper-grid {
  display: grid;
  grid-template-columns: 1.45fr 1fr;
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.paper-col {
  display: grid;
  gap: 0.95rem;
  align-content: start;
}
.paper-lead a,
.paper-feat a,
.paper-briefs a {
  display: grid;
  gap: 0.28rem;
  text-decoration: none;
  color: inherit;
}
.paper-lead a:hover h3,
.paper-feat a:hover h3,
.paper-briefs a:hover .paper-brief-title {
  color: var(--peach);
}
.paper-photo {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: #100c0a;
  border: 1px solid var(--line);
}
.paper-feat .paper-photo {
  aspect-ratio: 16 / 9;
  max-height: 8.2rem;
}
.paper-desk {
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}
.paper-lead h3,
.paper-feat h3 {
  margin: 0;
  font-family: var(--font);
  font-weight: 550;
  line-height: 1.18;
}
.paper-lead h3 { font-size: clamp(1.35rem, 2.8vw, 2rem); }
.paper-feat h3 { font-size: 1.05rem; }
.paper-lead p {
  margin: 0;
  color: var(--muted);
  font-size: 0.95rem;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.paper-side {
  display: grid;
  gap: 0.95rem;
  align-content: start;
  border-left: 1px solid var(--line);
  padding-left: 1rem;
}
.paper-briefs {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0.95rem 0 0;
  border-top: 1px solid var(--line);
  columns: 2;
  column-gap: 1.4rem;
}
.paper-briefs li {
  break-inside: avoid;
  margin: 0 0 0.7rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #2a2018;
}
.paper-brief-title {
  font-family: var(--font);
  font-size: 1.02rem;
  font-weight: 550;
  line-height: 1.25;
}
.paper-more {
  margin: 0.85rem 0 0;
  text-align: right;
}
.paper-more a { color: var(--accent2); }
@media (max-width: 900px) {
  .paper-mast {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "main wx"
      "teasers teasers"
      "sky sky";
  }
  .paper-teasers {
    border-left: 0;
    border-right: 0;
    padding: 0.65rem 0 0;
    border-top: 1px solid var(--line);
    columns: 2;
    column-gap: 1.1rem;
  }
}
@media (max-width: 760px) {
  .paper-mast,
  .paper-grid { grid-template-columns: 1fr; }
  .paper-mast {
    grid-template-areas:
      "main"
      "wx"
      "teasers"
      "sky";
  }
  .paper-teasers { columns: 1; }
  .paper-sky ol { columns: 1; }
  .paper-side {
    border-left: 0;
    padding-left: 0;
    border-top: 1px solid var(--line);
    padding-top: 0.95rem;
  }
  .paper-wx {
    justify-items: start;
    text-align: left;
    width: 100%;
    border-top: 1px solid var(--line);
    padding-top: 0.7rem;
  }
  .paper-wx-map { max-height: none; width: min(16rem, 100%); }
  .paper-briefs { columns: 1; }
}
body.home .wrap { max-width: 1080px; }
.tile-ico { color: var(--accent2); font-size: 1.25rem; }
.foot {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.35rem 1.5rem;
  color: var(--muted);
  font-size: 0.8rem;
  border-top: 1px solid var(--line);
  max-width: 980px;
  margin: 0 auto;
}

body.auth {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 1.25rem;
  position: relative;
}
.auth-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(700px 400px at 20% 0%, #a85622, transparent 60%),
    radial-gradient(600px 400px at 100% 80%, #3d1c0c, transparent 55%),
    var(--bg);
  z-index: 0;
}
.login-shell {
  position: relative;
  z-index: 1;
  width: min(420px, 100%);
  padding: 1.6rem 1.4rem 1.5rem;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(8, 7, 6, 0.88);
}
.login-shell.friendly {
  text-align: center;
  border-radius: 20px;
  padding-top: 1.2rem;
  background: rgba(20, 16, 12, 0.92);
}
.login-logo {
  display: block;
  width: min(220px, 70%);
  height: auto;
  margin: 0 auto 0.4rem;
}
.login-shell.friendly h1 { margin-top: 0.15rem; }
.login-shell.friendly .login-form { text-align: left; }
.login-shell h1 {
  font-family: var(--font);
  font-size: 2.4rem;
  margin: 0.2rem 0 0;
  font-weight: 550;
}
.lede { color: var(--muted); margin: 0.4rem 0 1.1rem; }
.login-form { display: grid; gap: 0.75rem; }
.login-form label { display: grid; gap: 0.35rem; color: var(--muted); font-size: 0.85rem; }
.login-form input,
.login-form select,
.login-form textarea {
  border: 1px solid var(--line);
  background: #14100c;
  color: var(--ink);
  border-radius: 6px;
  padding: 0.7rem 0.75rem;
  font-size: 1rem;
}
.login-form select {
  appearance: none;
}
.login-form textarea {
  min-height: 6.5rem;
  resize: vertical;
  line-height: 1.4;
}
.disclaimer { color: var(--muted); font-size: 0.8rem; margin: 1rem 0 0; }
.err { color: var(--danger); }
.ok { color: var(--accent2); }
.user-search {
  grid-template-columns: 1fr auto;
  align-items: end;
  max-width: 36rem;
}
.user-search-actions {
  display: flex;
  gap: 0.45rem;
  align-items: center;
}
.user-search button { margin: 0; }
.user-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  padding: 1rem 0.15rem;
}
.user-row .ghost { background: transparent; color: var(--ink); cursor: pointer; }
.user-actions { display: flex; flex-wrap: wrap; gap: 0.45rem; align-items: center; }
.user-actions .login-form label.check {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.45rem;
}
.user-actions .login-form input[type="number"] { width: 6rem; }

.subhead {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-end;
  padding: 1.1rem 1.35rem;
  border-bottom: 1px solid var(--line);
  background: #080706;
}
.subhead h1 {
  font-family: var(--font);
  margin: 0.2rem 0 0;
  font-size: 1.7rem;
  font-weight: 550;
}
.ghost {
  border: 1px solid var(--line);
  padding: 0.4rem 0.7rem;
  border-radius: 5px;
  font-size: 0.9rem;
}
.viewer-actions button.ghost {
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
}
.viewer-actions { display: flex; flex-wrap: wrap; gap: 0.45rem; align-items: center; }

body.ki-page {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  height: 100dvh;
}
body.ki-page .subhead,
body.ki-page .foot { flex-shrink: 0; }
body.ki-page .ki-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding-top: 1rem;
  padding-bottom: 0.75rem;
}
.ki-log {
  flex: 1;
  min-height: 8rem;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 1rem;
  background: #14100c;
  display: grid;
  gap: 0.75rem;
  align-content: start;
}
.ki-msg { white-space: pre-wrap; }
.ki-msg.user { color: var(--accent); }
.ki-msg.assistant { color: var(--ink); }
.ki-form {
  display: grid;
  gap: 0.55rem;
  margin-top: 0.75rem;
  flex-shrink: 0;
  position: sticky;
  bottom: 0;
  z-index: 3;
  background: var(--bg);
  padding-top: 0.35rem;
  padding-bottom: max(0.35rem, env(safe-area-inset-bottom));
}
.ki-form textarea {
  width: 100%;
  resize: vertical;
  min-height: 3.4rem;
  border: 1px solid #6f8f80;
  background: #1e1610;
  color: var(--ink);
  border-radius: 12px;
  padding: 0.7rem 0.85rem;
  font: inherit;
  line-height: 1.4;
}
.ki-form textarea:focus {
  outline: 2px solid var(--peach);
  border-color: var(--peach);
}
.ki-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.ki-actions button { flex: 1; }
.ki-midi-row {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
}
body.ki-page #ki-status,
.ki-wait {
  flex-shrink: 0;
  margin: 0;
  min-height: 1.2em;
  color: var(--peach);
  font-size: 0.95rem;
}
.ki-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0 0 0.75rem;
}
.ki-chips button {
  border: 1px solid var(--line);
  background: #14100c;
  color: var(--ink);
  border-radius: 999px;
  padding: 0.28rem 0.75rem;
  font: inherit;
  font-size: 0.88rem;
  cursor: pointer;
}
.ki-chips button:hover { border-color: var(--accent); color: var(--accent); }
.ki-draft {
  border: 1px dashed #6f8f80;
  border-radius: 10px;
  padding: 0.75rem 0.85rem;
  display: grid;
  gap: 0.4rem;
  background: #14100c;
}
.ki-draft.ok { border-style: solid; border-color: #4a7a5c; }
.ki-draft-when { color: var(--muted); margin: 0; }
.ki-draft button {
  justify-self: start;
  border: 1px solid var(--accent);
  background: transparent;
  color: var(--accent);
  border-radius: 8px;
  padding: 0.4rem 0.75rem;
  font: inherit;
  cursor: pointer;
}

.results { list-style: none; padding: 0; margin: 0 0 1.2rem; }
.result { border-bottom: 1px solid var(--line); }
.result a {
  display: grid;
  gap: 0.2rem;
  padding: 0.95rem 0.1rem;
}
.result a:hover .result-title { color: var(--accent); }
.result-src {
  color: var(--accent2);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
}
.result-title { font-size: 1.12rem; font-weight: 650; }
.result-snip { color: var(--muted); font-size: 0.95rem; }
.result-url {
  color: #7a9188;
  font-size: 0.8rem;
  word-break: break-all;
}
.source-note { margin: 0.7rem 0 0; font-size: 0.88rem; }
.source-note a { text-decoration: underline; }
.ai-box {
  margin: 0 0 1.4rem;
  padding: 1rem 1.05rem 1.1rem;
  border: 1px solid #4a3a2a;
  border-radius: 16px;
  background: linear-gradient(180deg, #2a241c, #161410);
}
.ai-box h2 {
  font-family: var(--font);
  font-size: 1.35rem;
  margin: 0 0 0.35rem;
  font-weight: 550;
}
.ai-text {
  white-space: pre-wrap;
  margin-top: 0.7rem;
  line-height: 1.5;
}
#ai-status {
  min-height: 1.35em;
  color: var(--peach);
}

body.chat-page {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  height: 100dvh;
}
body.chat-page .subhead,
body.chat-page .foot { flex-shrink: 0; }
.chat-shell {
  flex: 1;
  display: grid;
  grid-template-columns: minmax(180px, 240px) 1fr;
  min-height: 0;
  max-width: 1100px;
  width: 100%;
  margin: 0 auto;
}
@media (max-width: 720px) {
  .chat-shell { grid-template-columns: 1fr; }
  .chat-side { border-right: 0; border-bottom: 1px solid var(--line); max-height: 34vh; }
}
.chat-side {
  padding: 1rem 1rem 1.2rem;
  border-right: 1px solid var(--line);
  overflow: auto;
  background: #14100c;
}
.chat-side h2 {
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0.85rem 0 0.4rem;
}
.chat-room-list { display: grid; gap: 0.3rem; }
.chat-room {
  text-align: left;
  border: 1px solid var(--line);
  background: transparent;
  color: inherit;
  border-radius: 8px;
  padding: 0.45rem 0.6rem;
  cursor: pointer;
}
.chat-room.on { border-color: var(--accent2); background: #1e1610; }
.chat-mini {
  display: grid;
  gap: 0.35rem;
  margin: 0.45rem 0 0.7rem;
}
.chat-mini input, .chat-mini select {
  border: 1px solid var(--line);
  background: #14100c;
  color: var(--ink);
  border-radius: 6px;
  padding: 0.4rem 0.5rem;
}
.chat-mini button, .chat-composer button, .chat-attach {
  border: 1px solid var(--line);
  background: #1e1610;
  color: var(--ink);
  border-radius: 6px;
  padding: 0.4rem 0.65rem;
  cursor: pointer;
}
.chat-main {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 0.75rem 1rem 0.5rem;
}
.chat-head h2 { font-family: var(--font); margin: 0 0 0.35rem; font-size: 1.45rem; font-weight: 550; }
.chat-logo img {
  display: block;
  height: 2.7rem;
  width: auto;
  max-width: 12.5rem;
  object-fit: contain;
  object-position: left center;
}
.tile-logo, .app-logo {
  display: block;
  width: 5.6rem;
  height: 5.6rem;
  margin-bottom: 0.35rem;
  object-fit: contain;
}
.install-steps {
  margin: 0;
  padding-left: 1.2rem;
  display: grid;
  gap: 0.55rem;
  color: var(--muted);
  line-height: 1.45;
}
.install-steps strong { color: var(--ink); }
.tile .ghost { margin-top: 0.55rem; display: inline-block; }
.chat-me { display: flex; align-items: center; gap: 0.7rem; }
.chat-logo img {
  display: block;
  height: 2.7rem;
  width: auto;
  max-width: 12.5rem;
  object-fit: contain;
  object-position: left center;
}
.chat-me-btn {
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
}
.chat-ava {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  object-fit: cover;
  background: #1e1610;
  flex-shrink: 0;
}
.chat-ava.tiny { width: 1.25rem; height: 1.25rem; }
.chat-contact {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 0.4rem;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0.35rem 0.45rem;
}
.chat-contact span { display: flex; align-items: center; gap: 0.35rem; min-width: 0; }
.chat-acts { display: flex; flex-wrap: wrap; gap: 0.2rem; justify-content: flex-end; }
.ghost.tiny {
  font-size: 0.72rem;
  padding: 0.15rem 0.4rem;
  border: 1px solid var(--line);
  background: transparent;
  color: inherit;
  border-radius: 6px;
  cursor: pointer;
}
.chat-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-right: 0.45rem;
}
.chat-uname { cursor: pointer; }
.chat-role { color: var(--peach); font-weight: 550; font-size: 0.85em; }
.chat-flag {
  margin-left: 0.35rem;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--muted);
  border-radius: 6px;
  padding: 0.05rem 0.4rem;
  cursor: pointer;
  font-size: 0.72rem;
}
.chat-room { display: flex; align-items: center; gap: 0.45rem; }
.chat-room.staff { border-color: #4a3a2a; color: var(--peach); }
.chat-dlg {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #14100c;
  color: var(--ink);
  padding: 1rem 1.1rem;
  max-width: 28rem;
  width: calc(100% - 2rem);
}
.chat-dlg::backdrop { background: rgba(0, 0, 0, 0.55); }
.chat-dlg h2 { font-family: var(--font); margin: 0 0 0.35rem; }
.chat-preview {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0.7rem 0;
}
.chat-preview .chat-ava { width: 3rem; height: 3rem; }
.chat-figures {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.4rem;
  margin: 0.5rem 0 0.85rem;
}
.chat-figure {
  display: grid;
  justify-items: center;
  gap: 0.25rem;
  border: 1px solid var(--line);
  background: #14100c;
  color: inherit;
  border-radius: 8px;
  padding: 0.4rem 0.3rem;
  cursor: pointer;
  font-size: 0.75rem;
}
.chat-figure img { width: 2.4rem; height: 2.4rem; border-radius: 50%; }
.chat-figure.on { border-color: var(--accent2); background: #1e1610; }
.chat-dlg-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.chat-presence { margin: 0 0 0.55rem; font-size: 0.82rem; color: var(--muted); }
.chat-user-list { display: grid; gap: 0.3rem; margin: 0 0 0.45rem; }
.chat-user {
  text-align: left;
  border: 1px solid var(--line);
  background: transparent;
  color: inherit;
  border-radius: 8px;
  padding: 0.4rem 0.6rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.45rem;
}
.chat-user:hover { border-color: var(--accent2); }
.chat-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #6fbf8a;
  flex-shrink: 0;
}
.chat-notice {
  margin: 0 0 0.65rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid #4a3a2a;
  border-radius: 8px;
  background: #1a1612;
  color: var(--peach);
  font-size: 0.88rem;
}
.chat-log {
  flex: 1;
  min-height: 8rem;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0.75rem;
  background: #14100c;
  display: grid;
  gap: 0.65rem;
  align-content: start;
}
.chat-msg header {
  display: flex;
  gap: 0.55rem;
  align-items: baseline;
  font-size: 0.82rem;
  color: var(--muted);
}
.chat-msg.mine { background: #2a1c10; border-radius: 8px; padding: 0.35rem 0.5rem; }
.chat-msg p { margin: 0.25rem 0 0; white-space: pre-wrap; }
.chat-img img {
  display: block;
  max-width: min(100%, 360px);
  max-height: 280px;
  margin-top: 0.4rem;
  border-radius: 8px;
}
.chat-del {
  margin-left: auto;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: 1.1rem;
}
.chat-composer {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 0.45rem;
  margin-top: 0.55rem;
  align-items: end;
}
.chat-composer textarea {
  width: 100%;
  resize: vertical;
  min-height: 2.8rem;
  border: 1px solid #6f8f80;
  background: #1e1610;
  color: var(--ink);
  border-radius: 10px;
  padding: 0.55rem 0.7rem;
  font: inherit;
}
.chat-attach input { display: none; }
.chat-hint { margin: 0.35rem 0 0; font-size: 0.8rem; }
@media (max-width: 720px) {
  .chat-composer { grid-template-columns: 1fr 1fr; }
  .chat-composer textarea { grid-column: 1 / -1; }
}

.cal-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}
.cal-nav h2 { margin: 0; font-size: 1.25rem; }
.cal-weekdays, .cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.35rem;
}
.cal-weekdays span {
  color: var(--muted);
  font-size: 0.75rem;
  text-align: center;
}
.cal-day, .cal-empty {
  min-height: 2.4rem;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 0.9rem;
  position: relative;
}
.cal-day { background: #14100c; border: 1px solid var(--line); }
.cal-day.is-today { border-color: var(--accent2); color: var(--accent2); }
.cal-day.has-event { background: #2a1c10; }
.cal-day i {
  position: absolute;
  bottom: 0.15rem;
  font-style: normal;
  font-size: 0.65rem;
  color: var(--peach);
}
.cal-reminds {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0.7rem 0.85rem 0.85rem;
  margin: 0;
  background: #14100c;
}
.cal-reminds legend {
  color: var(--muted);
  font-size: 0.85rem;
  padding: 0 0.25rem;
}
.cal-reminds .muted { margin: 0 0 0.55rem; }
.cal-remind-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 1rem;
}
.cal-remind-check {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--ink);
  font-size: 0.92rem;
}
.login-form .cal-remind-check {
  display: flex;
  color: var(--ink);
  font-size: 0.92rem;
}
.login-form .cal-remind-check input[type="checkbox"] {
  width: 1.15rem;
  height: 1.15rem;
  margin: 0;
  padding: 0;
  accent-color: var(--accent);
  background: transparent;
  border: 0;
}

.karte-frame {
  margin: 0.4rem 0 0.5rem;
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  background: #14100c;
}
#karte-map {
  display: block;
  width: 100%;
  height: 42vh;
  min-height: 220px;
  border: 0;
}
.osm-attr {
  margin: 0 0 1.2rem;
  color: var(--muted);
  font-size: 0.8rem;
}
.osm-attr a { color: var(--accent2); }
.karte-opts {
  align-items: center;
  flex-wrap: wrap;
}
label.dticket {
  display: flex;
  gap: 0.55rem;
  align-items: center;
  color: var(--text);
  font-size: 0.95rem;
}
.journey {
  margin: 0 0 0.85rem;
  padding: 1rem 1.05rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #14100c;
}
.journey-head {
  margin: 0 0 0.25rem;
  font-family: sans-serif;
  font-weight: 600;
}
.journey-legs {
  margin: 0.45rem 0 0;
  padding-left: 1.1rem;
  color: var(--muted);
}
.src-list {
  margin: 0;
  padding-left: 1.15rem;
}
.src-list li { margin: 0.35rem 0; }

.weather-page .wx-h {
  font-family: var(--font);
  font-size: 1.15rem;
  font-weight: 550;
  margin: 1.4rem 0 0.55rem;
  color: var(--accent);
}
.wx-now {
  margin: 0 0 1rem;
  padding: 1.05rem 1.1rem 1.15rem;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #14100c;
}
.wx-place { margin: 0 0 0.2rem; color: var(--peach); font-weight: 650; }
.wx-temp {
  margin: 0;
  font-family: var(--font);
  font-size: clamp(2rem, 6vw, 2.8rem);
  font-weight: 550;
  color: var(--accent);
}
.wx-meta { margin: 0.35rem 0 0; color: var(--muted); }
.wx-links { margin: 0.7rem 0 0; }
.wx-links a { text-decoration: underline; color: var(--accent2); }
.wx-hours, .wx-days {
  list-style: none;
  padding: 0;
  margin: 0 0 0.4rem;
}
.wx-hours {
  display: flex;
  gap: 0.55rem;
  overflow-x: auto;
  padding-bottom: 0.4rem;
}
.wx-chip {
  min-width: 5.4rem;
  padding: 0.65rem 0.7rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #14100c;
  display: grid;
  gap: 0.15rem;
  font-size: 0.85rem;
}
.wx-chip strong { font-size: 1.15rem; color: var(--accent); }
.wx-day {
  display: grid;
  grid-template-columns: 7.2rem 5.5rem 1fr;
  gap: 0.5rem;
  align-items: baseline;
  padding: 0.55rem 0.1rem;
  border-bottom: 1px solid var(--line);
}
.wx-day-name { font-weight: 650; }
.wx-day-range { color: var(--accent); }
@media (max-width: 560px) {
  .wx-day { grid-template-columns: 1fr 1fr; }
  .wx-day .muted { grid-column: 1 / -1; }
}
.wx-days {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.4rem;
  overflow: visible;
  padding-bottom: 0.2rem;
}
.wx-day-card {
  min-width: 0;
  padding: 0.55rem 0.3rem 0.6rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #14100c;
  display: grid;
  gap: 0.15rem;
  text-align: center;
  font-size: 0.78rem;
  cursor: pointer;
}
.wx-day-card:focus,
.wx-day-card.is-open {
  border-color: var(--accent);
}
.wx-day-detail {
  margin: 0.65rem 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #14100c;
}
.wx-day-detail[hidden] { display: none; }
.wx-day-detail h3 { margin: 0 0 0.4rem; font-size: 1rem; color: var(--accent); }
.wx-day-hours {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.25rem;
  font-size: 0.88rem;
}
.wx-day-card .wx-glyph {
  font-size: 1.7rem;
  line-height: 1.2;
}
.wx-day-card strong { color: var(--accent); font-size: 1.05rem; }
.wx-map {
  margin: 0 0 1rem;
  padding: 0;
}
.wx-map img {
  display: block;
  width: 100%;
  max-height: 22rem;
  object-fit: contain;
  border-radius: 14px;
  background: #14100c;
  border: 1px solid var(--line);
}
.wx-map figcaption {
  margin: 0.35rem 0 0;
  font-size: 0.82rem;
  color: var(--muted);
}
.wx-map a { color: var(--accent2); }
.wx-legal {
  margin: 1.6rem 0 0.4rem;
  padding: 0.95rem 1.05rem;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #14100c;
  color: var(--muted);
  font-size: 0.9rem;
}
.wx-legal p { margin: 0 0 0.65rem; }
.wx-legal p:last-child { margin-bottom: 0; }
.wx-legal a { color: var(--accent2); }

.news-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0 0 1rem;
}
.news-cat {
  border: 1px solid var(--line);
  background: #14100c;
  color: inherit;
  border-radius: 999px;
  padding: 0.35rem 0.75rem;
  font: inherit;
  font-size: 0.88rem;
  cursor: pointer;
}
.news-cat.is-on,
.news-cat:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.news-item.news-prio-warnung,
.news-item.news-prio-unwetter {
  border-left: 3px solid #c47a3e;
  padding-left: 0.65rem;
}
.news-item.news-prio-polizei {
  border-left: 3px solid #6eb4c8;
  padding-left: 0.65rem;
}
.news-item.news-prio-feuerwehr {
  border-left: 3px solid #d46464;
  padding-left: 0.65rem;
}
.news-item.news-prio-region {
  border-left: 3px solid #1a5c4a;
  padding-left: 0.65rem;
}
.news-item.news-prio-musik {
  border-left: 3px solid #c4a06a;
  padding-left: 0.65rem;
}
.news-item.news-prio-europa,
.news-item.news-prio-reise {
  border-left: 3px solid #7aa8c4;
  padding-left: 0.65rem;
}
.news-item.news-prio-alltag,
.news-item.news-prio-verkehr {
  border-left: 3px solid #a85622;
  padding-left: 0.65rem;
}
.news-item > a {
  display: grid;
  grid-template-columns: 7.2rem 1fr;
  gap: 0.75rem;
  align-items: start;
}
.news-thumb {
  display: block;
  width: 7.2rem;
  height: 5.1rem;
  object-fit: cover;
  border-radius: 8px;
  background: #1e1610;
}
.news-thumb-empty {
  background:
    linear-gradient(145deg, #2a1c14, #14100c 62%);
}
.news-body {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
@media (max-width: 520px) {
  .news-item > a {
    grid-template-columns: 5.2rem 1fr;
    gap: 0.55rem;
  }
  .news-thumb {
    width: 5.2rem;
    height: 4.2rem;
  }
}
.news-page .cta-row .ghost {
  text-decoration: none;
}
.chart-boards {
  display: grid;
  gap: 1.1rem;
  margin: 0 0 1.6rem;
}
.chart-board {
  background: #181410;
  border: 1px solid var(--line);
  padding: 0.9rem 1rem 1rem;
}
.chart-board-h h2 {
  margin: 0.15rem 0 0;
  font-family: var(--font);
  font-size: 1.35rem;
  font-weight: 550;
}
.chart-list {
  list-style: none;
  margin: 0.75rem 0 0;
  padding: 0;
}
.chart-list li {
  margin: 0;
  border-bottom: 1px solid #2a2018;
}
.chart-list a {
  display: grid;
  grid-template-columns: 1.6rem 1fr;
  gap: 0.45rem;
  align-items: start;
  padding: 0.45rem 0;
  text-decoration: none;
  color: inherit;
}
.chart-list a:hover .chart-title { color: var(--peach); }
.chart-rank {
  font-family: var(--font);
  color: var(--peach);
  font-weight: 550;
}
.chart-title {
  font-family: var(--font);
  font-weight: 550;
  line-height: 1.25;
}
@media (min-width: 800px) {
  .chart-boards {
    grid-template-columns: 1fr 1fr;
  }
}

.cloud-quota-label {
  margin: 0 0 0.4rem;
  color: var(--accent2);
  font-size: 0.95rem;
}
.cloud-quota {
  height: 0.55rem;
  border-radius: 99px;
  background: #14100c;
  border: 1px solid var(--line);
  overflow: hidden;
}
.cloud-quota span {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 99px;
}
.cloud-crumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
  margin: 0 0 1rem;
  font-size: 0.95rem;
}
.cloud-crumbs a { color: var(--accent2); }
.cloud-tools {
  display: grid;
  gap: 0.85rem;
}
.cloud-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.cloud-form input[type="text"],
.cloud-form input[type="file"] {
  flex: 1 1 12rem;
  min-height: 2.6rem;
  padding: 0.4rem 0.7rem;
  border: 1px solid var(--line);
  border-radius: 0.7rem;
  background: #14100c;
  color: inherit;
  font: inherit;
}
.cloud-form button {
  min-height: 2.6rem;
}

.brand-pic { display: block; }
.brand-pic img { display: block; }

@media (max-width: 719px) {
  html { -webkit-text-size-adjust: 100%; }
  .hero-inner,
  .wrap,
  .foot,
  .subhead {
    padding-left: max(1rem, env(safe-area-inset-left));
    padding-right: max(1rem, env(safe-area-inset-right));
  }
  .hero { min-height: 0; }
  .home-public .hero.friendly { min-height: 0; }
  .hero-inner { padding-top: 0.85rem; padding-bottom: 1.35rem; }
  .wx-top {
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
    margin-bottom: 0.65rem;
  }
  .wx-top .top-nav {
    margin-left: 0;
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 0.55rem 0.9rem;
    font-size: 0.95rem;
  }
  .wx-langs { flex: 1 1 auto; }
  .topbar {
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 0.85rem;
  }
  .topbar .brand-mark { display: none; }
  .welcome { margin-bottom: 0.35rem; }
  .welcome-logo,
  .wx-logo-once,
  .login-logo {
    width: min(100%, 22rem);
    max-width: 100%;
    max-height: 4.35rem;
    height: auto;
    object-fit: contain;
    object-position: left center;
  }
  body.auth { padding: 0.65rem 0.75rem; align-items: start; }
  .login-shell,
  .login-shell.friendly {
    width: 100%;
    padding: 0.85rem 0.95rem 1.1rem;
    border-radius: 16px;
  }
  .login-shell h1,
  .login-shell.friendly h1 { font-size: 1.75rem; }
  .tile {
    padding: 0.8rem 0.85rem 0.95rem;
    border-radius: 14px;
  }
  .tile-logo,
  .app-logo,
  .home-wx .tile-logo,
  .home-news .tile-logo,
  .home-hit .tile-logo {
    width: 100%;
    height: auto;
    max-height: 4.5rem;
    margin-bottom: 0.4rem;
    object-fit: contain;
    object-position: left center;
  }
  .chat-logo img {
    height: 2.7rem;
    width: auto;
    max-width: min(13.5rem, 62vw);
  }
  .subhead {
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.7rem;
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
  }
  .subhead h1 { font-size: 1.4rem; }
  .cta,
  .ghost,
  .login-form button,
  .search-hero button,
  .search-event button,
  .ki-form button {
    min-height: 44px;
  }
  .login-form input,
  .login-form select,
  .search-hero input,
  .search-event input {
    min-height: 44px;
    font-size: 16px;
  }
  .foot {
    flex-direction: column;
    gap: 0.45rem;
    padding-bottom: max(1.25rem, env(safe-area-inset-bottom));
  }
  .wx-days {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.cloud-files-head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.7rem;
}
.cloud-files-head h2 { margin: 0; }
.cloud-share-ttl {
  display: flex;
  gap: 0.45rem;
  align-items: center;
  font-size: 0.9rem;
  color: var(--muted);
}
.cloud-share-ttl select {
  min-height: 2.2rem;
  padding: 0.2rem 0.5rem;
  border: 1px solid var(--line);
  border-radius: 0.55rem;
  background: #14100c;
  color: inherit;
  font: inherit;
}
.cloud-view-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.cloud-view-bar button[aria-pressed="true"] {
  background: var(--accent);
  color: #2a1c12;
  border-color: var(--accent);
  font-weight: 700;
}
.cloud-list { list-style: none; padding: 0; margin: 0; }
.cloud-item { border-bottom: 1px solid var(--line); }
.cloud-item .user-row { gap: 0.7rem; }
.cloud-meta { flex: 1 1 auto; min-width: 0; }
.cloud-meta .s-name { display: block; }
.cloud-thumb,
.cloud-ico {
  flex: 0 0 auto;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 0.45rem;
  object-fit: cover;
  background: #1e1610;
}
.cloud-ico {
  position: relative;
  background: linear-gradient(180deg, #2a241c, #14100c);
  border: 1px solid var(--line);
}
.cloud-ico--folder {
  background:
    linear-gradient(180deg, transparent 0 0.45rem, #ff9a3c 0.45rem 0.7rem, var(--accent) 0.7rem),
    linear-gradient(90deg, #e88928 0 1.15rem, transparent 1.15rem);
  background-color: #14100c;
  border-color: #a85622;
}
.cloud-ico--video::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.4rem 0 0.4rem 0.7rem;
  border-color: transparent transparent transparent var(--accent);
}
.cloud-browser[data-view="folders"] .cloud-list,
.cloud-browser[data-view="icons"] .cloud-list {
  display: grid;
  gap: 0.7rem;
  border: 0;
}
.cloud-browser[data-view="folders"] .cloud-list {
  grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
}
.cloud-browser[data-view="icons"] .cloud-list {
  grid-template-columns: repeat(auto-fill, minmax(7.4rem, 1fr));
}
.cloud-browser[data-view="folders"] .cloud-item,
.cloud-browser[data-view="icons"] .cloud-item {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: linear-gradient(180deg, #1e1610, #14100c);
}
.cloud-browser[data-view="folders"] .cloud-item--file,
.cloud-browser[data-view="folders"] .cloud-item--image,
.cloud-browser[data-view="folders"] .cloud-item--video {
  grid-column: 1 / -1;
  background: transparent;
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  border-top: 0;
}
.cloud-browser[data-view="folders"] .cloud-item--folder .user-row,
.cloud-browser[data-view="icons"] .cloud-item .user-row {
  flex-direction: column;
  align-items: stretch;
  text-align: center;
  padding: 0.75rem 0.6rem 0.85rem;
}
.cloud-browser[data-view="folders"] .cloud-item--folder .cloud-ico,
.cloud-browser[data-view="icons"] .cloud-thumb,
.cloud-browser[data-view="icons"] .cloud-ico {
  width: 4.2rem;
  height: 3.4rem;
  margin: 0 auto;
}
.cloud-browser[data-view="icons"] .cloud-thumb {
  width: 100%;
  height: 5.6rem;
  border-radius: 0.5rem;
}
.cloud-browser[data-view="folders"] .cloud-item--folder form,
.cloud-browser[data-view="icons"] .cloud-item form {
  align-self: center;
}
.cloud-user-form {
  display: grid;
  gap: 0.65rem;
  margin-top: 0.8rem;
}
.cloud-user-form label {
  display: grid;
  gap: 0.25rem;
}
.cloud-user-form input[type="text"],
.cloud-user-form input[type="password"] {
  min-height: 2.6rem;
  padding: 0.4rem 0.7rem;
  border: 1px solid var(--line);
  border-radius: 0.7rem;
  background: #14100c;
  color: inherit;
  font: inherit;
}
.cloud-grant-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 1.2rem;
  border: 1px solid var(--line);
  border-radius: 0.7rem;
  padding: 0.75rem 1rem 0.9rem;
  margin: 0;
}
.cloud-grant-flags legend {
  padding: 0 0.35rem;
  font-weight: 550;
}
.cloud-grant-flags label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}
.cloud-share-jump {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.8rem;
  margin: 0 0 1rem;
}
.cloud-share-jump a {
  text-decoration: none;
}
.cloud-user-list {
  list-style: none;
  padding: 0;
  margin: 0.4rem 0 1rem;
}
.cloud-user-row {
  display: flex;
  gap: 0.7rem;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  padding: 0.55rem 0;
}
.cloud-share-info {
  cursor: pointer;
  min-width: 0;
  flex: 1;
}
.cloud-share-info .s-desc {
  display: block;
  margin-top: 0.2rem;
  color: var(--muted, #9a9084);
  font-size: 0.92rem;
}
.cloud-user-row-actions {
  display: flex;
  flex-shrink: 0;
  gap: 0.35rem;
}
.share-preview {
  max-width: 100%;
  max-height: 70vh;
  border-radius: 0.7rem;
}

.foto-year {
  margin: 0 0 0.2rem;
  font-family: var(--font);
  font-size: 1.45rem;
  font-weight: 550;
}
.foto-day {
  margin: 0 0 0.65rem;
  font-size: 0.92rem;
  color: var(--muted);
  font-weight: 500;
}
.foto-block { margin-top: 0.4rem; }
.foto-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(8.2rem, 1fr));
  gap: 0.35rem;
}
.foto-tile {
  position: relative;
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 0.5rem;
  background: #14100c;
  border: 1px solid var(--line);
}
.foto-tile img,
.foto-video-ph {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.foto-video-ph {
  background:
    radial-gradient(circle at 50% 50%, #2a241c, #14100c 70%);
}
.foto-video-badge {
  position: absolute;
  left: 0.4rem;
  bottom: 0.4rem;
  padding: 0.12rem 0.4rem;
  border-radius: 999px;
  background: #080706;
  color: var(--accent);
  font-size: 0.72rem;
}
.foto-tile--video::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.7rem 0 0.7rem 1.15rem;
  border-color: transparent transparent transparent rgba(255, 122, 12, 0.92);
  filter: drop-shadow(0 1px 2px #080706);
  pointer-events: none;
}
.foto-lite {
  width: min(96vw, 56rem);
  max-height: 94dvh;
  padding: 0.7rem 0.7rem 0.9rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #080706;
  color: var(--ink);
}
.foto-lite::backdrop { background: rgba(8, 7, 6, 0.82); }
.foto-lite-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 0.55rem;
}
.foto-lite-cap {
  flex: 1 1 8rem;
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.foto-lite-media {
  display: block;
  width: 100%;
  max-height: calc(94dvh - 4.5rem);
  object-fit: contain;
  background: #14100c;
}

.mail-setup {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
}
.mail-setup h3 {
  margin: 0 0 0.4rem;
  font-size: 1.05rem;
  font-weight: 600;
}
.mail-setup-grid {
  display: grid;
  grid-template-columns: minmax(7rem, 11rem) 1fr;
  gap: 0.45rem 1rem;
  margin: 0.85rem 0;
  max-width: 40rem;
}
.mail-setup-grid dt {
  margin: 0;
  color: var(--muted, #9a9084);
  font-size: 0.92rem;
}
.mail-setup-grid dd {
  margin: 0;
  font-size: 0.95rem;
}
.mail-setup-grid code {
  font-size: 0.92em;
  word-break: break-all;
}
.mail-setup-grid code {
  font-size: 0.92em;
  word-break: break-all;
}
button.btn-danger,
.btn-danger {
  background: #5c1e1e;
  border-color: #8a3030;
  color: #f6e8e8;
}
button.btn-danger:hover,
.btn-danger:hover {
  background: #722424;
}
@media (max-width: 520px) {
  .mail-setup-grid {
    grid-template-columns: 1fr;
    gap: 0.15rem 0;
  }
  .mail-setup-grid dt { margin-top: 0.45rem; }
  .mail-setup-grid dt:first-child { margin-top: 0; }
}

.settings-list { list-style: none; padding: 0; margin: 0; }
.settings-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.7rem;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--line);
}
.settings-row .brand-pic {
  flex: 0 0 auto;
  width: 2.25rem;
  height: 2.25rem;
}
.settings-row .brand-pic img,
.settings-ico {
  display: block;
  width: 2.25rem;
  height: 2.25rem;
  object-fit: contain;
}
.settings-meta { flex: 1 1 10rem; min-width: 0; }
.settings-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
  margin: 0;
  flex: 1 1 16rem;
}
.settings-inline input {
  min-width: 8rem;
  flex: 1 1 8rem;
  border: 1px solid var(--line);
  background: #14100c;
  color: var(--ink);
  border-radius: 6px;
  padding: 0.55rem 0.65rem;
  font: inherit;
  font-size: 0.95rem;
}
.settings-inline button {
  margin: 0;
  border: 1px solid var(--line);
  background: var(--accent);
  color: #2a1c12;
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}

.hit-card {
  display: grid;
  grid-template-columns: 7.2rem 1fr;
  gap: 0.75rem;
  align-items: start;
}
.hit-source {
  margin: 0 0 0.25rem;
  font-size: 0.88rem;
  font-weight: 600;
}
.hit-source a {
  color: var(--accent, #7dcea0);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
.hit-actions {
  margin: 0.85rem 0 1.1rem;
}
.hit-top {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0.2rem 0 0.65rem;
}
.hit-top-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
  padding: 0.38rem 0.7rem;
  border-radius: 999px;
  border: 1px solid #5a4330;
  background: #1a120e;
  color: #f0e2d0;
  text-decoration: none;
  font-weight: 650;
  font-size: 0.86rem;
}
.hit-top-btn img {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  object-fit: cover;
}
.hit-top-btn.is-on {
  background: #c4a574;
  border-color: #c4a574;
  color: #1a100c;
}
.hit-top-warm {
  display: grid;
  gap: 0.25rem;
  margin: 0 0 0.85rem;
}
.hit-apk-dl {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.55rem;
  margin: 0.35rem auto 0.15rem;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 0.82rem;
  max-width: var(--wrap, 52rem);
}
.hit-apk-dl .hit-apk-link {
  color: #c4a574;
  font-weight: 650;
  text-decoration: none;
}
.hit-apk-dl .hit-apk-link:hover {
  text-decoration: underline;
}
.hit-apk-dl .muted {
  font-size: 0.8rem;
}
body.kulu-in-app .hit-apk-dl {
  display: none;
}
.hit-continue {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.42rem 0.85rem;
  border-radius: 999px;
  background: #e8c9a0;
  color: #1a100c;
  font-weight: 750;
  text-decoration: none;
  width: fit-content;
  font-size: 0.9rem;
}
.hit-continue:hover {
  filter: brightness(1.05);
}
.hit-near {
  display: grid;
  gap: 0.45rem;
  margin: 0.7rem 0 1rem;
  max-width: 28rem;
}
.hit-near label {
  font-size: 0.92rem;
  opacity: 0.92;
}
.hit-near input[type="text"],
.hit-near input[type="number"] {
  width: 100%;
  box-sizing: border-box;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  border: 1px solid var(--stroke, #3d2a1c);
  background: var(--surface, #1e1610);
  color: inherit;
}
.hit-near button {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 0.55rem 1rem;
  background: #c4a574;
  color: #1a100c;
  font-weight: 700;
  cursor: pointer;
}
.hit-near-note {
  margin: 0;
  font-size: 0.85rem;
}
.hit-pick-list {
  margin-top: 0.7rem;
}
.hit-pick-list .settings-row {
  align-items: flex-start;
}
.hit-form {
  display: grid;
  gap: 0.45rem;
  max-width: 36rem;
}
.hit-form label,
.hit-form legend {
  margin-top: 0.45rem;
  color: var(--muted);
  font-size: 0.88rem;
}
.hit-form input[type="text"],
.hit-form input[type="url"],
.hit-form input[type="email"],
.hit-form input[type="tel"],
.hit-form input[type="number"],
.hit-form input[type="file"],
.hit-form select,
.hit-form textarea {
  border: 1px solid var(--line);
  background: #14100c;
  color: var(--ink);
  border-radius: 8px;
  padding: 0.55rem 0.7rem;
  font: inherit;
}
.hit-form textarea { min-height: 7rem; resize: vertical; }
.hit-form button {
  margin-top: 0.7rem;
  border: 1px solid var(--accent);
  background: var(--accent);
  color: #2a1c12;
  border-radius: 8px;
  padding: 0.65rem 1rem;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
  width: fit-content;
}
.hit-level {
  border: 0;
  padding: 0;
  margin: 0.3rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
}
.hit-contact-fields {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0.55rem 0.75rem 0.85rem;
  margin: 0.5rem 0 0;
  display: grid;
  gap: 0.35rem;
}
.hit-contact-fields legend {
  padding: 0 0.25rem;
  margin-top: 0;
}
.hit-check {
  display: flex;
  gap: 0.4rem;
  align-items: center;
  color: var(--ink);
}
.hit-del { margin-top: 0.7rem; }
.hit-item .hit-thumb,
.hit-form .hit-thumb {
  width: 4.2rem;
  height: 4.2rem;
  object-fit: cover;
  border-radius: 8px;
}
@media (max-width: 520px) {
  .hit-card { grid-template-columns: 5.2rem 1fr; }
}
.hit-page .hit-strip {
  display: flex;
  gap: 0.5rem;
  margin: 0.85rem 0 0;
  overflow-x: auto;
  padding-bottom: 0.15rem;
}
.hit-page .hit-strip img {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  object-fit: cover;
  flex: 0 0 auto;
  background: #14100c;
}
.hit-page .hit-comic-head {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 0.4rem;
  margin: 0;
  justify-content: flex-start;
  align-items: center;
}
.hit-page .hit-welcome {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
}
.hit-page .hit-welcome > a {
  display: block;
  flex: 0 0 auto;
  line-height: 0;
}
.hit-page .hit-welcome .hit-home-logo {
  margin-right: 0.15rem;
}
.hit-page .hit-welcome .hit-home-logo .brand-pic {
  display: block;
  line-height: 0;
}
/* Gleich hoch wie das Hitmaster-Logo (Desktop: Logo + bis zu 3 Comics). */
.hit-page .hit-welcome .welcome-logo,
.hit-page .hit-comic-head img {
  height: 5.6rem;
  max-height: 5.6rem;
  width: auto;
  flex: 0 0 auto;
}
.hit-page .hit-welcome .welcome-logo {
  max-width: none;
  object-fit: contain;
  object-position: left center;
}
.hit-page .hit-comic-head img {
  width: 5.6rem;
  border-radius: 8px;
  border: 2px solid #1a100c;
  box-shadow: 2px 2px 0 #2a1a12;
  object-fit: cover;
  background: #ece0ce;
}
/* Mobil: nur ein Comic, Logo bleibt dasselbe Hitmaster-Logo. */
.hit-page .hit-comic-head__desk {
  display: none;
}
@media (min-width: 720px) {
  .hit-page .hit-comic-head__desk {
    display: block;
  }
}
@media (max-width: 719px) {
  .hit-page .hit-welcome .welcome-logo,
  .hit-page .hit-comic-head img {
    height: 4.2rem;
    max-height: 4.2rem;
  }
  .hit-page .hit-comic-head img {
    width: 4.2rem;
  }
}
.hit-page .news-cat.hit-cat {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.hit-page .news-cat.hit-cat img {
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 50%;
  object-fit: cover;
}
.hit-page .news-thumb.hit-design,
.hit-page .hit-thumb.hit-design {
  object-fit: cover;
  border-radius: 50%;
  background: #14100c;
}
.hit-empty {
  list-style: none;
}
.hit-empty-art {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.35rem 0 0.7rem;
}
.hit-empty-art img {
  width: 3.8rem;
  height: 3.8rem;
  border-radius: 50%;
  object-fit: cover;
  background: #14100c;
}
.hit-ad {
  margin-top: 0.4rem;
}
.hit-ad h1.s-name {
  font-size: 1.45rem;
  margin: 0.15rem 0 0.35rem;
}
.hit-comic-mini {
  max-width: 22rem;
  margin: 0.85rem auto 1.15rem;
}
.hit-comic-mini--wide {
  max-width: 36rem;
}
.hit-comic-mini .hit-bubble {
  font-size: 0.88rem;
  font-weight: 600;
}
.hit-comic-slot {
  list-style: none;
  margin: 0.4rem 0 0.9rem;
  padding: 0;
}
.hit-comic-slot .hit-comic-mini {
  margin: 0.5rem auto;
}
.hit-entries {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.8rem;
  margin: 0.9rem 0 1.2rem;
  font-size: 0.92rem;
}
.hit-entries a {
  color: #e8d7c4;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
.hit-guide-page .hit-comic-hero {
  margin: 0.4rem 0 1.4rem;
}
.hit-guide-page .hit-comic {
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible;
}
.hit-guide-page .hit-comic img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
  background: transparent;
}
.hit-guide-page .hit-comic-cloud {
  background: transparent !important;
  text-align: center;
}
.hit-guide-page .hit-comic-cloud img {
  border-radius: 0;
  background: transparent;
  margin-inline: auto;
}
.hit-guide-page .hit-comic-cloud .hit-bubble {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 36rem;
}
.hit-guide-page .hit-bubble {
  margin: 0.45rem 0 0;
  padding: 0 !important;
  background: transparent !important;
  color: #e8d9c4;
  border: 0 !important;
  border-top: 0 !important;
  font-size: 0.95rem;
  line-height: 1.35;
  font-weight: 600;
}
.hit-comic {
  margin: 0;
  position: relative;
  border: 3px solid #1a100c;
  border-radius: 4px;
  background: #ece0ce;
  box-shadow: 4px 4px 0 #2a1a12;
  overflow: hidden;
}
.hit-comic img {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: middle;
}
.hit-bubble {
  margin: 0;
  padding: 0.7rem 0.9rem 0.85rem;
  background: #f2ebe0;
  color: #2a2018;
  font-size: 0.95rem;
  line-height: 1.35;
  border-top: 2px solid #1a100c;
  font-weight: 600;
}
.hit-comic-panel {
  display: grid;
  gap: 1rem;
  margin: 0 0 1.8rem;
  align-items: start;
}
@media (min-width: 720px) {
  .hit-comic-panel {
    grid-template-columns: 1.1fr 0.9fr;
    gap: 1.25rem;
  }
  .hit-comic-panel.hit-comic-flip .hit-comic-text { order: 2; }
  .hit-comic-panel.hit-comic-flip .hit-comic { order: 1; }
}
.hit-guide-list {
  margin: 0.55rem 0 0.7rem;
  padding-left: 1.15rem;
  line-height: 1.45;
}
.hit-guide-list li { margin: 0.28rem 0; }
.hit-guide-dl {
  margin: 0.6rem 0;
}
.hit-guide-dl dt {
  font-weight: 700;
  margin-top: 0.55rem;
  color: #f0dcc4;
}
.hit-guide-dl dd {
  margin: 0.2rem 0 0;
  opacity: 0.92;
}
.hit-guide-callout {
  margin: 0.8rem 0 0;
  padding: 0.75rem 0.9rem;
  border-left: 4px solid #c4a574;
  background: rgba(196, 165, 116, 0.12);
}
.hit-guide-next {
  margin-bottom: 1.5rem;
}

/* Akkorde & Harmonie */
.hit-chords-page .hit-chords-jump {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0 0 1.2rem;
}
.hit-chords-page .hit-chords-jump a {
  color: #e8d7c4;
  text-decoration: none;
  border-bottom: 1px solid #5a4330;
  padding-bottom: 0.1rem;
  font-weight: 600;
}
.hit-chords-page .hit-chords-jump a:hover {
  color: #c4a574;
  border-bottom-color: #c4a574;
}
.hit-chords-legend {
  margin-top: -0.35rem;
}
.hit-chord-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
  gap: 1rem;
  margin: 1rem 0 1.2rem;
}
.hit-chord-grid--piano {
  grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr));
}
.hit-chord {
  margin: 0;
  padding: 0.75rem 0.6rem 0.65rem;
  background: #14100c;
  border: 1px solid #3d2a1c;
  border-radius: 12px;
  text-align: center;
}
.hit-chord__name {
  font-size: 1.15rem;
  font-weight: 800;
  color: #f0e2d0;
  margin: 0 0 0.45rem;
}
.hit-chord__tab {
  margin: 0.4rem 0 0;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}
.hit-chord__hint {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
}
.hit-fret {
  display: grid;
  gap: 0;
  width: 6.2rem;
  margin: 0 auto;
}
.hit-fret__nut,
.hit-fret__row {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
}
.hit-fret__open {
  height: 1rem;
  line-height: 1;
  font-size: 0.85rem;
  color: #c4a574;
}
.hit-fret__row {
  border-top: 2px solid #c4a574;
  height: 1.15rem;
}
.hit-fret__cell {
  position: relative;
  border-right: 1px solid #5a4330;
}
.hit-fret__cell:last-child {
  border-right: 0;
}
.hit-fret__cell.is-on::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.72rem;
  height: 0.72rem;
  margin: -0.36rem 0 0 -0.36rem;
  border-radius: 50%;
  background: #f0e2d0;
  box-shadow: 0 0 0 1px #1a120e;
}
.hit-piano-notes {
  margin: 0.2rem 0 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: #e8d7c4;
  letter-spacing: 0.02em;
}
.hit-piano-notes i {
  font-style: normal;
  opacity: 0.45;
  margin: 0 0.15rem;
  font-weight: 400;
}
.hit-harmony-wrap {
  overflow-x: auto;
  margin: 0.9rem 0 0.7rem;
  -webkit-overflow-scrolling: touch;
}
.hit-harmony {
  width: 100%;
  min-width: 28rem;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}
.hit-harmony th,
.hit-harmony td {
  padding: 0.55rem 0.65rem;
  border: 1px solid #3d2a1c;
  text-align: center;
}
.hit-harmony thead th {
  background: #1a120e;
  color: #c4a574;
  font-weight: 700;
}
.hit-harmony tbody th {
  background: #14100c;
  color: #f0e2d0;
  font-weight: 700;
  text-align: left;
}
.hit-harmony td {
  color: #e8d7c4;
}
.hit-prog-list {
  list-style: none;
  margin: 0.9rem 0 1.2rem;
  padding: 0;
  display: grid;
  gap: 0.85rem;
}
.hit-prog {
  padding: 0.85rem 1rem;
  background: #14100c;
  border: 1px solid #3d2a1c;
  border-radius: 12px;
}
.hit-prog__roman {
  display: block;
  color: #c4a574;
  font-size: 1.05rem;
  margin-bottom: 0.4rem;
}
.hit-prog__ex {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.25rem;
}
.hit-prog__key {
  display: inline-block;
  min-width: 1.4rem;
  font-weight: 700;
  color: #f0e2d0;
  margin-right: 0.35rem;
}
.hit-pattern-tips h3.wx-h {
  margin-top: 1.1rem;
  font-size: 1.05rem;
}
.hit-pattern-code {
  margin: 0.55rem 0 0;
  padding: 0.7rem 0.9rem;
  background: #1a120e;
  border-radius: 10px;
  border: 1px solid #5a4330;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  font-size: 1.05rem;
  letter-spacing: 0.06em;
  color: #f0e2d0;
}

/* Songgenerator */
.hit-song-note {
  margin: 0 0 1rem;
  padding: 0.75rem 0.9rem;
  border-left: 4px solid #c4a574;
  background: rgba(196, 165, 116, 0.1);
  color: #e8d7c4;
  line-height: 1.4;
}
.hit-song-form .hit-song-label {
  display: block;
  margin: 0.85rem 0 0.35rem;
  font-weight: 700;
  color: #f0e2d0;
}
.hit-song-form textarea,
.hit-song-form input[type="text"],
.hit-song-form select {
  width: 100%;
  box-sizing: border-box;
  padding: 0.65rem 0.75rem;
  border-radius: 10px;
  border: 1px solid #5a4330;
  background: #14100c;
  color: #f0e2d0;
  font: inherit;
}
.hit-song-form textarea {
  min-height: 6rem;
  resize: vertical;
}
.hit-song-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.85rem;
}
@media (max-width: 640px) {
  .hit-song-row {
    grid-template-columns: 1fr;
  }
}
.hit-song-wait {
  margin: 0.6rem 0 0;
}
.hit-song-out {
  margin-top: 1.2rem;
}
.hit-song-text {
  margin: 0.7rem 0 0.8rem;
  padding: 1rem 1.05rem;
  background: #14100c;
  border: 1px solid #3d2a1c;
  border-radius: 12px;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  font-size: 0.95rem;
  line-height: 1.45;
  color: #f0e2d0;
  max-height: 70vh;
  overflow: auto;
}
.hit-song-row--opts {
  margin-top: 0.35rem;
  align-items: start;
}
.hit-song-check .hit-song-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.55rem;
  font-weight: 700;
  cursor: pointer;
}
.hit-song-check input[type="checkbox"] {
  width: 1.15rem;
  height: 1.15rem;
  accent-color: #c4a574;
}
.hit-song-out-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}
.hit-song-out-head .wx-h {
  margin: 0;
}
.hit-song-print-only {
  display: none;
}
@media print {
  body.hit-song-page {
    background: #fff !important;
    color: #111 !important;
  }
  .hit-song-no-print {
    display: none !important;
  }
  .hit-song-print-only {
    display: block !important;
    color: #111 !important;
  }
  .hit-song-out {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  .hit-song-text {
    max-height: none !important;
    overflow: visible !important;
    background: #fff !important;
    color: #111 !important;
    border: 0 !important;
    padding: 0 !important;
    font-size: 11pt !important;
  }
  .hero-veil,
  .foot {
    display: none !important;
  }
}

.contact-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.7rem;
}
.contact-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.8rem;
  align-items: start;
  padding: 0.85rem 1rem;
  background: var(--surface, #1e1610);
  border: 1px solid var(--stroke, #3d2a1c);
  border-radius: 14px;
}
.contact-row .s-name { margin: 0; }
.contact-row .s-desc { margin: 0.25rem 0 0; }
.contact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  justify-content: flex-end;
}
.contact-actions form { margin: 0; }
.contact-actions button.ghost {
  background: transparent;
  border: 1px solid var(--stroke, #3d2a1c);
  color: inherit;
  cursor: pointer;
}
@media (max-width: 640px) {
  .contact-row { grid-template-columns: 1fr; }
  .contact-actions { justify-content: flex-start; }
}

html[dir="rtl"] .wx-langs,
html[dir="rtl"] .top-nav,
html[dir="rtl"] .home-jump {
  direction: rtl;
}
html[dir="rtl"] .top-nav .has-tip[data-tip]::after {
  right: auto;
  left: 0;
  transform: none;
}

/* —— Find: Suche + KI (eine Fläche) —— */
.home-find .find-hero {
  position: relative;
  min-height: min(58dvh, 520px);
  display: grid;
  place-items: center;
  padding: 1.25rem 1rem 2rem;
  overflow: visible;
}
.find-topbar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 5;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.85rem 1.1rem;
  flex-wrap: wrap;
  padding: 0.75rem 1rem 0;
  overflow: visible;
}
.find-topbar .top-nav {
  margin-left: auto;
}
.find-topbar .top-nav a {
  color: #ffb36a;
  border-bottom: 1px solid transparent;
}
.find-topbar .top-nav a:hover,
.find-topbar .top-nav a:focus-visible {
  color: var(--accent);
  border-bottom-color: rgba(255, 122, 12, 0.55);
}
.find-topbar .hello {
  color: var(--muted);
  font-size: 0.9rem;
}
.home-find .find-hero-inner {
  padding-top: 2.4rem;
}
.find-hero-veil {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 55% at 50% 0%, rgba(61, 110, 90, 0.35), transparent 70%),
    linear-gradient(180deg, #0c1210 0%, #14110e 55%, #080706 100%);
  pointer-events: none;
}
.find-hero-inner {
  position: relative;
  z-index: 1;
  width: min(42rem, 100%);
  display: grid;
  gap: 0.85rem;
  justify-items: center;
  text-align: center;
}
.find-brand {
  display: grid;
  gap: 0.35rem;
  justify-items: center;
  color: inherit;
  text-decoration: none;
}
.find-brand img {
  width: clamp(4.5rem, 18vw, 7rem);
  height: auto;
  filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.35));
}
.find-brand-name {
  font-family: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino, serif;
  font-size: clamp(1.6rem, 5vw, 2.2rem);
  letter-spacing: 0.02em;
  font-weight: 600;
}
.home-comic-row {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  margin: 0.15rem 0 0.1rem;
}
.home-comic {
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 0.55rem;
  border: 1px solid rgba(180, 160, 130, 0.28);
  box-shadow: 0 0.35rem 0.9rem rgba(0, 0, 0, 0.28);
  object-fit: cover;
  background: #1a1612;
}
.home-comic--2 {
  display: none;
}
@media (min-width: 640px) {
  .home-comic {
    width: 4.1rem;
    height: 4.1rem;
  }
  .home-comic--2 {
    display: block;
  }
}
.find-tagline {
  margin: 0;
  color: var(--muted);
  max-width: 28rem;
  line-height: 1.45;
}
.find-bar {
  display: flex;
  align-items: stretch;
  width: 100%;
  gap: 0.4rem;
  padding: 0.35rem;
  border-radius: 999px;
  background: rgba(20, 24, 22, 0.92);
  border: 1px solid rgba(180, 200, 180, 0.18);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  position: relative;
}
.find-bar > input[type="hidden"] {
  display: none;
}
.find-bar input[type="search"] {
  flex: 1 1 auto;
  border: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 1.05rem;
  padding: 0.85rem 1.1rem;
  min-width: 0;
  outline: none;
}
.find-go,
.find-ai {
  border: 0;
  border-radius: 999px;
  min-width: 2.75rem;
  padding: 0 0.95rem;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}
.find-go {
  background: #2f5d4a;
  color: #e8f2ec;
}
.find-ai {
  background: #c9a66b;
  color: #1a140c;
  font-size: 0.85rem;
  letter-spacing: 0.04em;
}
.find-go:hover { filter: brightness(1.08); }
.find-bar.is-loading {
  pointer-events: none;
  opacity: 0.92;
}
.find-bar.is-loading::after {
  content: "";
  position: absolute;
  right: 6.4rem;
  top: 50%;
  width: 1.05rem;
  height: 1.05rem;
  margin-top: -0.52rem;
  border-radius: 50%;
  border: 2px solid rgba(232, 242, 236, 0.25);
  border-top-color: #e8f2ec;
  animation: find-spin 0.7s linear infinite;
  pointer-events: none;
}
.find-bar-compact.is-loading::after {
  right: 5.6rem;
}
@keyframes find-spin {
  to { transform: rotate(360deg); }
}
.find-busy {
  margin: 0.55rem 0 0;
  color: var(--muted);
  font-size: 0.95rem;
  min-height: 1.25em;
}
.find-busy[hidden] {
  display: none;
}
.find-ai:hover { filter: brightness(1.06); }
.find-disclaimer {
  margin: 0;
  font-size: 0.86rem;
  color: var(--muted);
  max-width: 32rem;
  line-height: 1.4;
}
.find-next {
  display: grid;
  gap: 0.15rem;
  width: 100%;
  max-width: 28rem;
  text-align: left;
  padding: 0.85rem 1.1rem;
  border-radius: 1rem;
  background: rgba(47, 93, 74, 0.22);
  border: 1px solid rgba(201, 166, 107, 0.28);
  color: inherit;
  text-decoration: none;
}
.find-next-k {
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #c9a66b;
}
.find-next-title { font-weight: 650; }
.find-next-when { color: var(--muted); font-size: 0.92rem; }
.find-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.85rem;
  justify-content: center;
  margin-top: 0.35rem;
}
.find-quick a {
  color: var(--muted);
  text-decoration: none;
  font-size: 0.92rem;
  border-bottom: 1px solid transparent;
}
.find-quick a:hover {
  color: var(--ink);
  border-bottom-color: rgba(201, 166, 107, 0.5);
}

.home-find .home-jump {
  justify-content: center;
  margin: 0.2rem 0 0;
  max-width: 40rem;
}
.home-find .home-jump a {
  border-color: rgba(255, 122, 12, 0.55);
  background: rgba(255, 122, 12, 0.14);
  color: #ffb36a;
  font-weight: 600;
}
.home-find .home-jump a:hover,
.home-find .home-jump a:focus-visible {
  border-color: var(--accent);
  background: rgba(255, 122, 12, 0.28);
  color: #ffd2a0;
}
.home-find .find-hero-inner {
  overflow: visible;
}

.find-page .find-top {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid rgba(180, 200, 180, 0.12);
  background: rgba(12, 18, 16, 0.94);
  position: sticky;
  top: 0;
  z-index: 20;
}
.find-top-brand img {
  width: 2.4rem;
  height: 2.4rem;
  object-fit: contain;
}
.find-bar-compact {
  max-width: 40rem;
  margin: 0 auto;
  width: 100%;
}
.find-top-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
  justify-content: flex-end;
}
.find-main { padding-top: 1.1rem; }
.find-q {
  font-size: 1.25rem;
  margin: 0 0 1rem;
  font-weight: 600;
}
.find-empty { text-align: center; padding: 2rem 0 1rem; }
.chip-link {
  display: inline-block;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  border: 1px solid rgba(180, 200, 180, 0.22);
  color: inherit;
  text-decoration: none;
  font-size: 0.9rem;
}
.chip-link:hover { border-color: #c9a66b; }

@media (max-width: 720px) {
  .find-page .find-top {
    grid-template-columns: auto 1fr;
    grid-template-areas:
      "brand nav"
      "bar bar";
  }
  .find-top-brand { grid-area: brand; }
  .find-top-nav { grid-area: nav; }
  .find-bar-compact { grid-area: bar; }

  /* Hauptseite: Topbar im Fluss, kein Überlappen mit Logo/Suche */
  .home-find .find-hero {
    min-height: 0;
    place-items: start center;
    padding: 0.55rem 0.75rem 1.1rem;
    overflow: hidden;
  }
  .home-find .find-topbar {
    position: static;
    display: grid;
    gap: 0.45rem;
    padding: 0.15rem 0 0.35rem;
  }
  .home-find .find-topbar .top-nav {
    margin-left: 0;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem 0.85rem;
    font-size: 0.92rem;
  }
  .home-find .find-hero-inner {
    padding-top: 0.25rem;
    gap: 0.55rem;
    width: 100%;
  }
  .home-find .find-brand img {
    width: clamp(3.4rem, 20vw, 4.6rem);
  }
  .home-find .find-brand-name {
    font-size: clamp(1.35rem, 6.2vw, 1.7rem);
  }
  .home-find .find-tagline {
    font-size: 0.9rem;
    max-width: 22rem;
    padding: 0 0.2rem;
  }
  .home-find .find-bar {
    border-radius: 1.15rem;
    padding: 0.28rem;
    gap: 0.28rem;
  }
  .home-find .find-bar input[type="search"] {
    font-size: 1rem;
    padding: 0.68rem 0.7rem;
  }
  .home-find .find-go,
  .home-find .find-ai {
    min-width: 2.45rem;
    padding: 0 0.65rem;
    font-size: 0.84rem;
  }
  .home-find .find-disclaimer {
    font-size: 0.78rem;
    line-height: 1.35;
    max-width: 100%;
  }
  .home-find .home-jump {
    width: 100%;
    max-width: none;
    gap: 0.35rem;
    justify-content: center;
  }
  .home-find .home-jump a {
    padding: 0.38rem 0.68rem;
    font-size: 0.8rem;
  }
  .home-find .wx-langs {
    flex: 1 1 100%;
    gap: 0.28rem;
  }
  .home-find .wx-langs a,
  .home-find .wx-langs-more select {
    padding: 0.28rem 0.48rem;
    font-size: 0.72rem;
    min-height: 2rem;
  }
  body.home .wrap {
    padding: 0.9rem 0.75rem 2rem;
  }
  body.home .home-dash {
    margin-bottom: 1.15rem;
  }
  body.home .paper {
    padding: 0.8rem 0.75rem 1rem;
  }
  body.home .paper-name {
    font-size: clamp(1.35rem, 7vw, 1.7rem);
  }
  body.home .paper-wx-temp {
    font-size: clamp(1.6rem, 8vw, 2.1rem);
  }
  body.home .paper-wx-map {
    width: min(100%, 18rem);
    max-height: none;
  }
  body.home .tile-grid {
    gap: 0.65rem;
  }
  body.home .tile {
    padding: 0.85rem 0.9rem;
  }
  body.home .tile-logo {
    width: 4.2rem;
    height: 4.2rem;
  }
  body.home .home-register {
    margin-top: 1.2rem;
  }
  body.home .foot {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.9rem 0.75rem 1.25rem;
    max-width: none;
  }
}

@media (max-width: 420px) {
  .home-find .find-go {
    padding: 0 0.55rem;
  }
  .home-find .find-ai {
    padding: 0 0.5rem;
    letter-spacing: 0.02em;
  }
  .home-find .find-bar input[type="search"] {
    padding-left: 0.55rem;
    padding-right: 0.35rem;
  }
}

.find-page .ai-box {
  margin: 0 0 1.25rem;
  padding: 1rem 1.1rem;
  border-radius: 1rem;
  background: rgba(47, 93, 74, 0.16);
  border: 1px solid rgba(201, 166, 107, 0.22);
}
.find-page .ai-box h2 {
  margin: 0 0 0.35rem;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #c9a66b;
  font-weight: 650;
}
.find-page .ai-text {
  margin-top: 0.55rem;
  white-space: pre-wrap;
  line-height: 1.5;
}
.find-page .results {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}
.find-page .result a {
  display: grid;
  gap: 0.2rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(180, 200, 180, 0.1);
}
.find-page .result-src {
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}
.find-page .result-title {
  font-weight: 650;
  font-size: 1.05rem;
}
.find-page .result-snip { color: var(--muted); font-size: 0.95rem; }
.find-page .result-url {
  font-size: 0.82rem;
  color: #8fb89a;
  word-break: break-all;
}
.find-page .find-sec {
  margin: 1.1rem 0 0.45rem;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  color: var(--muted);
  font-weight: 650;
}
.find-page .find-own-note {
  margin: 0.55rem 0 0.85rem;
}
.find-page .find-own-growing {
  margin: 0.35rem 0 0.75rem;
  font-size: 0.88rem;
}
.find-page .result-own a {
  border-radius: 12px;
  padding: 0.85rem 0.9rem;
  border: 1px solid rgba(232, 120, 47, 0.28);
  background: linear-gradient(160deg, rgba(232, 120, 47, 0.1), rgba(16, 28, 22, 0.35));
  border-bottom: 1px solid rgba(232, 120, 47, 0.28);
}
.find-page .result-own .result-src {
  color: #e8782f;
  font-weight: 700;
}

/* —— KI Chat UI —— */
body.ki-chat-ui .find-top { display: none; }
.ki-chrome {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid rgba(180, 200, 180, 0.12);
  background: rgba(12, 18, 16, 0.96);
  position: sticky;
  top: 0;
  z-index: 20;
}
.ki-chrome-brand {
  display: flex;
  gap: 0.65rem;
  align-items: center;
  font-weight: 650;
  text-decoration: none;
  color: inherit;
}
.ki-chrome-brand img {
  width: 2.4rem;
  height: 2.4rem;
  object-fit: contain;
}
.ki-chrome-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.65rem;
  align-items: center;
  justify-content: flex-end;
}
.ki-model-label {
  font-size: 0.78rem;
  color: var(--muted);
}
.ki-model {
  appearance: none;
  border: 1px solid rgba(180, 200, 180, 0.22);
  background: #141a17;
  color: var(--ink);
  border-radius: 999px;
  padding: 0.4rem 0.9rem;
  font: inherit;
  min-width: 11rem;
}
.ki-model:disabled {
  opacity: 0.85;
  cursor: default;
}
.ki-shell {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: min(52rem, 100%);
  margin: 0 auto;
  padding: 0.85rem 1rem 1rem;
  gap: 0.65rem;
}
.ki-note { margin: 0; }
body.ki-chat-ui .ki-log {
  border-radius: 1rem;
  border-color: rgba(180, 200, 180, 0.14);
  background: rgba(14, 18, 16, 0.9);
}
.ki-composer {
  display: grid;
  gap: 0.55rem;
  padding: 0.75rem;
  border-radius: 1rem;
  border: 1px solid rgba(180, 200, 180, 0.16);
  background: rgba(20, 24, 22, 0.95);
}
.ki-composer textarea {
  width: 100%;
  border: 0;
  resize: vertical;
  min-height: 3.2rem;
  max-height: 10rem;
  background: transparent;
  color: var(--ink);
  font: inherit;
  line-height: 1.45;
  outline: none;
}
.ki-composer-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  align-items: center;
}
.ki-send {
  border: 0;
  border-radius: 999px;
  padding: 0.55rem 1.15rem;
  background: #2f5d4a;
  color: #e8f2ec;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}
.ki-send:hover { filter: brightness(1.08); }
@media (max-width: 720px) {
  .ki-chrome { align-items: flex-start; }
  .ki-chrome-tools { width: 100%; justify-content: flex-start; }
  .ki-model { min-width: 0; flex: 1; }
}

/* Embedded in Kulu Dulu Android (WebView shell has its own top + tabs). */
body.kulu-in-app,
html.kulu-in-app {
  min-height: auto !important;
  height: auto !important;
  overflow-x: hidden;
}
body.kulu-in-app .ki-chrome-brand,
body.kulu-in-app .ki-chrome a.ghost,
body.kulu-in-app .ki-chrome #ki-clear {
  display: none !important;
}
body.kulu-in-app .ki-chrome {
  display: flex !important;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.7rem 0.15rem;
}
body.kulu-in-app .ki-chrome-tools {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  width: 100%;
}
body.kulu-in-app .foot,
body.kulu-in-app .hero,
body.kulu-in-app .hero-veil,
body.kulu-in-app .subhead {
  display: none !important;
}
body.kulu-in-app .find-top-brand,
body.kulu-in-app .find-top-nav {
  display: none !important;
}
body.kulu-in-app.find-page .find-top {
  /* Native Suchzeile in der App — Web-Leiste ausblenden, damit sie nicht wegrutscht */
  display: none !important;
}
body.kulu-in-app.find-page .find-bar-compact {
  display: none !important;
}
body.kulu-in-app .find-main,
body.kulu-in-app .wrap,
body.kulu-in-app .ki-shell {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0.55rem 0.7rem 0.75rem;
  box-sizing: border-box;
}
body.kulu-in-app .find-disclaimer {
  margin-top: 0.35rem;
}
body.kulu-in-app.ki-chat-ui {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}
body.kulu-in-app .ki-shell {
  flex: 1;
  min-height: 0;
  gap: 0.45rem;
}
body.kulu-in-app .ki-log {
  flex: 1;
  min-height: 10rem;
}
body.kulu-in-app .find-disclaimer,
body.kulu-in-app .ki-note {
  font-size: 0.82rem;
}
body.kulu-in-app .find-top-nav,
body.kulu-in-app .cta-row a.ghost[href="/ki"],
body.kulu-in-app .cta-row a.ghost[href^="/suche"] {
  /* less duplicate nav inside app */
}
@media (max-width: 720px) {
  body.kulu-in-app .wrap,
  body.kulu-in-app .find-main {
    padding-left: 0.65rem;
    padding-right: 0.65rem;
  }
}

/* Homepage inside the Kulu Dulu website app (WebView). */
body.home.kulu-in-app .find-hero {
  min-height: auto;
  padding-bottom: 1.1rem;
}
body.home.kulu-in-app .find-hero-inner {
  padding-top: 0.35rem;
}
body.home.kulu-in-app .find-topbar .top-nav {
  display: none;
}
body.home.kulu-in-app .home-register {
  display: none;
}
body.home.kulu-in-app .home-jump {
  flex-wrap: wrap;
}

/* Wetter in der App: Ortsfeld nicht im (ausgeblendeten) Hero lassen. */
body.kulu-in-app.weather-page .wx-place-bar {
  margin: 0 0 0.45rem;
}
body.kulu-in-app.weather-page .wx-place-loc {
  margin: 0 0 0.55rem;
}
body.kulu-in-app.weather-page .wx-place-loc .ghost {
  display: inline-flex;
}

/* Hitmaster tuner */
.hit-tuner-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem 1.1rem;
  align-items: flex-end;
  margin: 0 0 1.25rem;
}
.hit-tuner-field {
  display: grid;
  gap: 0.35rem;
  font-weight: 650;
  color: #e8d8c4;
}
.hit-tuner-field select {
  min-width: 8rem;
  padding: 0.55rem 0.75rem;
  border-radius: 0.55rem;
  border: 1px solid #5a4330;
  background: #14100c;
  color: #f4ece3;
  font-size: 1rem;
}
.hit-tuner-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
}
.hit-tuner-go {
  padding: 0.7rem 1.25rem;
  border-radius: 999px;
  border: none;
  background: #e8c9a0;
  color: #1a100c;
  font-weight: 750;
  font-size: 1.02rem;
  cursor: pointer;
}
.hit-tuner-go:disabled {
  opacity: 0.55;
  cursor: default;
}
.hit-tuner-display {
  text-align: center;
  padding: 1.1rem 0.5rem 1.4rem;
  border-radius: 1rem;
  border: 1px solid #3a2a1e;
  background: linear-gradient(180deg, #16110d 0%, #0c0a08 100%);
  margin-bottom: 1rem;
}
.hit-tuner-note {
  margin: 0;
  font-size: clamp(2.4rem, 8vw, 3.6rem);
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #f6e9d8;
  line-height: 1.05;
}
.hit-tuner-hz {
  margin: 0.35rem 0 0;
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.hit-tuner-cents {
  margin: 0.45rem 0 0;
  font-size: 1.55rem;
  font-weight: 750;
  color: #c4a574;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.hit-tuner-status {
  margin: 0.55rem 0 0.9rem;
  font-size: 1.05rem;
  color: #dcc9b0;
}
.hit-tuner-gauge {
  position: relative;
  height: 2.75rem;
  margin: 0.4rem auto 0;
  max-width: 26rem;
  border-radius: 999px;
  border: 1px solid #4a3524;
  background:
    linear-gradient(90deg,
      rgba(126, 184, 232, 0.18) 0%,
      rgba(126, 184, 232, 0.06) 35%,
      rgba(125, 206, 160, 0.22) 47%,
      rgba(125, 206, 160, 0.35) 50%,
      rgba(125, 206, 160, 0.22) 53%,
      rgba(232, 160, 125, 0.06) 65%,
      rgba(232, 160, 125, 0.18) 100%);
  overflow: hidden;
}
.hit-tuner-gauge__mid {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 2px;
  margin-left: -1px;
  background: #e8c9a0;
  opacity: 0.95;
  z-index: 1;
}
.hit-tuner-gauge__tick {
  position: absolute;
  top: 0.35rem;
  bottom: 0.35rem;
  width: 1px;
  background: rgba(240, 226, 208, 0.28);
  z-index: 1;
}
.hit-tuner-gauge__tick--sm {
  top: 0.7rem;
  bottom: 0.7rem;
  background: rgba(240, 226, 208, 0.18);
}
.hit-tuner-gauge__mark {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.95rem;
  color: #8a6f55;
  opacity: 0.9;
  z-index: 1;
}
.hit-tuner-gauge__mark--l { left: 0.65rem; }
.hit-tuner-gauge__mark--r { right: 0.65rem; }
.hit-tuner-needle {
  position: absolute;
  top: 0.2rem;
  bottom: 0.2rem;
  width: 0.28rem;
  margin-left: -0.14rem;
  left: 50%;
  border-radius: 999px;
  background: #f0e2d0;
  box-shadow: 0 0 0.55rem rgba(0, 0, 0, 0.5);
  transition: left 0.05s linear, background 0.12s ease;
  z-index: 2;
}
.hit-tuner-gauge.is-ok .hit-tuner-needle { background: #7dcea0; box-shadow: 0 0 0.65rem rgba(125, 206, 160, 0.55); }
.hit-tuner-gauge.is-near .hit-tuner-needle { background: #e8d48a; }
.hit-tuner-gauge.is-flat .hit-tuner-needle { background: #7eb8e8; }
.hit-tuner-gauge.is-sharp .hit-tuner-needle { background: #e8a07d; }
.hit-tuner-string-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0 0 1rem;
  justify-content: center;
}
.hit-tuner-str {
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  border: 1px solid #5a4330;
  background: #1a120e;
  color: #f0e2d0;
  font-weight: 650;
  cursor: pointer;
}
.hit-tuner-str.is-on {
  background: #c4a574;
  border-color: #c4a574;
  color: #1a100c;
}
.hit-tuner-str.is-heard:not(.is-on) {
  border-color: #7dcea0;
  box-shadow: 0 0 0 1px rgba(125, 206, 160, 0.35);
}
.hit-tuner-note-txt,
.hit-tuner-src {
  max-width: 42rem;
}
@media (max-width: 719px) {
  .hit-tuner-controls {
    flex-direction: column;
    align-items: stretch;
  }
  .hit-tuner-field select {
    width: 100%;
  }
}

/* Hitmaster Synth — desktop plaything (Web Audio, no external libs) */
.hit-synth-mobile-note {
  display: none;
}
.hit-synth-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem 1.1rem;
  align-items: flex-end;
  margin: 0 0 1rem;
}
.hit-synth-actions {
  display: flex;
  gap: 0.5rem;
}
.hit-synth-go {
  appearance: none;
  border: 0;
  border-radius: 0.45rem;
  background: linear-gradient(160deg, #e8782f, #c45a18);
  color: #1a100c;
  font-weight: 700;
  font-size: 0.9rem;
  padding: 0.4rem 0.9rem;
  cursor: pointer;
}
.hit-synth-field {
  display: grid;
  gap: 0.3rem;
  font-weight: 650;
  font-size: 0.86rem;
}
.hit-synth-field select {
  min-width: 8.5rem;
  background: #14110e;
  color: #f4ece3;
  border: 1px solid rgba(244, 236, 227, 0.18);
  border-radius: 0.45rem;
  padding: 0.4rem 0.55rem;
}
.hit-synth-field-bpm {
  min-width: 11rem;
}
.hit-synth-field-bpm input[type="range"] {
  width: 100%;
}
.hit-synth-field-bpm em {
  font-style: normal;
  color: var(--muted);
  font-size: 0.82rem;
}
.hit-synth-status {
  margin: 0;
  align-self: center;
}
.hit-synth-rack,
.hit-synth-drums-rack {
  margin: 0 0 1.1rem;
  padding: 0.85rem 1rem 1rem;
  border-radius: 0.85rem;
  border: 1px solid rgba(244, 236, 227, 0.12);
  background:
    linear-gradient(180deg, rgba(28, 24, 20, 0.95), rgba(14, 12, 10, 0.98)),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 11px,
      rgba(255, 255, 255, 0.015) 11px,
      rgba(255, 255, 255, 0.015) 12px
    );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.hit-synth-rack-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: baseline;
  margin-bottom: 0.75rem;
}
.hit-synth-panel {
  display: grid;
  gap: 1rem;
}
.hit-synth-knobs {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.65rem;
}
.hit-synth-knob {
  display: grid;
  justify-items: center;
  gap: 0.35rem;
  font-size: 0.78rem;
  color: var(--muted);
}
.hit-synth-knob input[type="range"] {
  writing-mode: vertical-lr;
  direction: rtl;
  width: 2rem;
  height: 5.5rem;
  accent-color: #e8782f;
}
.hit-synth.is-running .hit-synth-knob input[type="range"] {
  filter: drop-shadow(0 0 4px rgba(232, 120, 47, 0.35));
}
.hit-synth-patchbay {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  min-height: 5.5rem;
  padding: 0.75rem 0.5rem 1.1rem;
  border-radius: 0.55rem;
  background: rgba(0, 0, 0, 0.28);
  border: 1px dashed rgba(244, 236, 227, 0.14);
}
.hit-synth-cables {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}
.hit-synth-jack {
  position: relative;
  z-index: 2;
  width: 3.4rem;
  height: 3.4rem;
  border-radius: 50%;
  border: 2px solid rgba(244, 236, 227, 0.35);
  background:
    radial-gradient(circle at 50% 45%, #2a241e 0 38%, #0c0a08 42% 100%);
  color: #f4ece3;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  cursor: pointer;
}
.hit-synth-jack.is-pick {
  border-color: #e8782f;
  box-shadow: 0 0 0 2px rgba(232, 120, 47, 0.35);
}
.hit-synth-pads {
  list-style: none;
  margin: 0 0 0.75rem;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
}
.hit-synth-pads li {
  border-radius: 0.55rem;
  border: 1px solid rgba(244, 236, 227, 0.14);
  background: #16120f;
  min-height: 3.2rem;
  display: grid;
  place-items: center;
  font-weight: 650;
  transition: background 0.08s linear, border-color 0.08s linear;
}
.hit-synth-pads li.is-hit {
  background: rgba(232, 120, 47, 0.35);
  border-color: #e8782f;
}
.hit-synth-steps {
  display: grid;
  grid-template-columns: repeat(16, minmax(0, 1fr));
  gap: 0.25rem;
}
.hit-synth-dot {
  height: 0.55rem;
  border-radius: 999px;
  background: rgba(244, 236, 227, 0.12);
}
.hit-synth-dot.is-on {
  background: #7ec8a3;
}
.hit-synth-src {
  max-width: 46rem;
  margin-top: 0.75rem;
}
@media (max-width: 900px) {
  .hit-synth-page .hit-synth {
    display: none !important;
  }
  .hit-synth-page .hit-synth-mobile-note {
    display: block;
    margin: 1rem 0 1.5rem;
    padding: 1rem 1.1rem;
    border-radius: 0.65rem;
    border: 1px solid rgba(232, 120, 47, 0.35);
    background: rgba(232, 120, 47, 0.08);
  }
}
@media (min-width: 901px) {
  .hit-synth-page .hit-synth-mobile-note {
    display: none !important;
  }
}




/* KuDuLu fantasy accents */
.find-brand-name,.brand,.hero h1{
  letter-spacing:-.04em;
  text-shadow:3px 3px 0 #ff7a0c,6px 6px 0 rgba(108,63,165,.45);
}
.tile{
  border-radius:18px;
  box-shadow:0 8px 0 rgba(73,39,22,.45),0 14px 28px rgba(0,0,0,.22);
  transition:transform .18s,box-shadow .18s,border-color .18s;
}
.tile:hover{
  transform:translateY(-4px) rotate(-.3deg);
  border-color:#ff7a0c;
  box-shadow:0 12px 0 rgba(255,122,12,.18),0 18px 34px rgba(0,0,0,.3);
}
.login-shell.friendly{
  border:1px solid #5d3b25;
  border-radius:22px;
  background:linear-gradient(160deg,#231812,#1b1321 55%,#14100c);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
}
.auth-bg{
  background:
    radial-gradient(circle at 20% 10%,rgba(255,122,12,.18),transparent 35%),
    radial-gradient(circle at 80% 0%,rgba(108,63,165,.2),transparent 40%),
    #080706 !important;
}