Release v0.30.0

2026-06-18 15:18:40 +02:00
commit 16b521f6d9
5 changed files with 723 additions and 0 deletions
@@ -0,0 +1,229 @@
+:root {
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  color: #172033;
+  background: #f3f6fb;
+}
+
+* { box-sizing: border-box; }
+
+body {
+  margin: 0;
+  min-height: 100vh;
+}
+
+.app {
+  width: min(1120px, calc(100% - 32px));
+  margin: 0 auto;
+  padding: 40px 0;
+}
+
+.hero {
+  display: flex;
+  justify-content: space-between;
+  gap: 24px;
+  align-items: end;
+  margin-bottom: 24px;
+}
+
+.eyebrow {
+  margin: 0 0 8px;
+  color: #566277;
+  font-weight: 700;
+  letter-spacing: .08em;
+  text-transform: uppercase;
+  font-size: .8rem;
+}
+
+h1 {
+  margin: 0;
+  font-size: clamp(2rem, 4vw, 3.2rem);
+}
+
+.intro {
+  max-width: 700px;
+  color: #566277;
+  line-height: 1.6;
+}
+
+.settings {
+  background: white;
+  border: 1px solid #dde5f2;
+  border-radius: 18px;
+  padding: 16px;
+  box-shadow: 0 12px 30px rgba(29, 45, 68, .08);
+}
+
+.settings label {
+  display: grid;
+  gap: 8px;
+  font-size: .9rem;
+  color: #566277;
+}
+
+.settings input {
+  border: 1px solid #cbd5e1;
+  border-radius: 10px;
+  padding: 10px 12px;
+  font: inherit;
+  color: #172033;
+}
+
+.settings small {
+  color: #566277;
+  line-height: 1.4;
+}
+
+.drop-zone {
+  position: relative;
+  display: grid;
+  place-items: center;
+  min-height: 190px;
+  border: 2px dashed #9aa8bd;
+  border-radius: 24px;
+  background: white;
+  cursor: pointer;
+  transition: .2s ease;
+}
+
+.drop-zone.dragover {
+  border-color: #2f6fed;
+  background: #eef4ff;
+}
+
+.drop-zone input {
+  position: absolute;
+  inset: 0;
+  opacity: 0;
+  cursor: pointer;
+}
+
+.drop-content {
+  display: grid;
+  gap: 8px;
+  text-align: center;
+  color: #566277;
+}
+
+.drop-content strong {
+  color: #172033;
+  font-size: 1.25rem;
+}
+
+.summary {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 16px;
+  margin: 24px 0;
+}
+
+.card {
+  background: white;
+  border: 1px solid #dde5f2;
+  border-radius: 20px;
+  padding: 20px;
+  box-shadow: 0 12px 30px rgba(29, 45, 68, .08);
+}
+
+.card span {
+  display: block;
+  color: #566277;
+  font-size: .9rem;
+  margin-bottom: 8px;
+}
+
+.card strong {
+  display: block;
+  font-size: 1.8rem;
+}
+
+.positive { color: #137333; }
+.negative { color: #b3261e; }
+.neutral { color: #172033; }
+
+.results {
+  background: white;
+  border: 1px solid #dde5f2;
+  border-radius: 24px;
+  padding: 24px;
+  box-shadow: 0 12px 30px rgba(29, 45, 68, .08);
+}
+
+.table-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 16px;
+  margin-bottom: 16px;
+}
+
+.table-header h2 { margin: 0; }
+
+button {
+  border: 0;
+  border-radius: 12px;
+  background: #172033;
+  color: white;
+  padding: 10px 14px;
+  font: inherit;
+  cursor: pointer;
+}
+
+.table-wrap {
+  overflow-x: auto;
+}
+
+table {
+  width: 100%;
+  border-collapse: collapse;
+  min-width: 680px;
+}
+
+th, td {
+  padding: 12px 10px;
+  border-bottom: 1px solid #e6edf7;
+  text-align: left;
+  white-space: nowrap;
+}
+
+th {
+  color: #566277;
+  font-size: .85rem;
+  text-transform: uppercase;
+  letter-spacing: .04em;
+}
+
+.details {
+  margin-top: 24px;
+}
+
+.details summary {
+  cursor: pointer;
+  font-weight: 700;
+  margin-bottom: 16px;
+}
+
+.error {
+  margin-top: 16px;
+  padding: 14px 16px;
+  border-radius: 14px;
+  background: #fff1f0;
+  border: 1px solid #ffccc7;
+  color: #8a1f11;
+}
+
+.hidden { display: none; }
+
+@media (max-width: 820px) {
+  .hero { display: grid; align-items: start; }
+  .summary { grid-template-columns: 1fr 1fr; }
+}
+
+@media (max-width: 520px) {
+  .summary { grid-template-columns: 1fr; }
+}
+
+.hint {
+  color: #566277;
+  margin: 16px 0 0;
+  font-size: .95rem;
+}