Upload 67 files

app/static/style.css

@@ -761,3 +761,529 @@ label span,
 
 
 
+
+/* Emergency Restore: shared UI primitives */
+.glass-card,
+.form-panel,
+.table-panel,
+.quick-panel {
+  padding: 24px;
+  animation: rise-in 0.7s ease both;
+}
+
+.activity-card h3,
+.task-card h3,
+.review-card h3,
+.group-card h3,
+.stat-card strong {
+  margin: 0 0 10px;
+}
+
+.meta-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 12px;
+  margin: 18px 0;
+}
+
+.meta-grid strong {
+  display: block;
+  color: var(--primary-deep);
+  font-size: 1.05rem;
+}
+
+.progress-line {
+  width: 100%;
+  height: 12px;
+  margin: 18px 0 12px;
+  border-radius: 999px;
+  overflow: hidden;
+  background: rgba(78, 148, 97, 0.12);
+}
+
+.progress-line div {
+  height: 100%;
+  border-radius: inherit;
+  background: linear-gradient(90deg, #62b176, #8ac798, #f1c16b);
+}
+
+.card-footer,
+.card-topline,
+.section-head,
+.stack-item,
+.builder-title-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+}
+
+.section-head {
+  margin-bottom: 18px;
+}
+
+.tight-head {
+  margin-top: 8px;
+}
+
+.stack-list {
+  display: grid;
+  gap: 14px;
+}
+
+.stack-item {
+  padding: 14px 16px;
+  border-radius: 18px;
+  background: rgba(255, 255, 255, 0.62);
+  border: 1px solid rgba(78, 148, 97, 0.14);
+}
+
+.stack-item-block {
+  align-items: flex-start;
+}
+
+.form-stack,
+.compact-form {
+  display: grid;
+  gap: 14px;
+}
+
+.form-grid {
+  display: grid;
+  gap: 14px;
+}
+
+.cols-2 {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
+.cols-3 {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+
+.full-span {
+  grid-column: 1 / -1;
+}
+
+label {
+  display: grid;
+  gap: 8px;
+}
+
+input,
+select,
+textarea,
+button {
+  font: inherit;
+}
+
+input,
+select,
+textarea {
+  width: 100%;
+  padding: 14px 16px;
+  border-radius: 16px;
+  border: 1px solid rgba(91, 141, 99, 0.22);
+  background: rgba(255, 255, 255, 0.88);
+  color: var(--text);
+  transition: border-color 0.24s ease, box-shadow 0.24s ease, transform 0.24s ease;
+}
+
+input:focus,
+select:focus,
+textarea:focus {
+  outline: none;
+  border-color: rgba(78, 148, 97, 0.5);
+  box-shadow: 0 0 0 4px rgba(78, 148, 97, 0.12);
+  transform: translateY(-1px);
+}
+
+textarea {
+  resize: vertical;
+  min-height: 120px;
+}
+
+button {
+  padding: 12px 16px;
+  border-radius: 16px;
+  border: 1px solid rgba(91, 141, 99, 0.18);
+  background: rgba(255, 255, 255, 0.88);
+  color: var(--text);
+  cursor: pointer;
+}
+
+.btn,
+.full-width-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 10px;
+  padding: 13px 18px;
+  border-radius: 18px;
+  border: 1px solid transparent;
+  text-decoration: none;
+  transition: transform 0.24s ease, box-shadow 0.24s ease, background 0.24s ease, color 0.24s ease;
+}
+
+.btn:hover,
+.full-width-btn:hover {
+  transform: translateY(-1px);
+}
+
+.btn-primary {
+  background: linear-gradient(135deg, #63b67c, #7bc58f);
+  color: #fff;
+  box-shadow: 0 16px 28px rgba(76, 134, 91, 0.22);
+}
+
+.btn-secondary {
+  background: rgba(230, 244, 229, 0.92);
+  border-color: rgba(78, 148, 97, 0.16);
+  color: var(--primary-deep);
+}
+
+.btn-ghost {
+  background: rgba(255, 255, 255, 0.78);
+  border-color: rgba(78, 148, 97, 0.14);
+  color: var(--primary-deep);
+}
+
+.btn-danger {
+  background: linear-gradient(135deg, #de6d78, #d95b67);
+  color: #fff;
+  box-shadow: 0 16px 28px rgba(186, 70, 88, 0.18);
+}
+
+.small-btn {
+  padding: 10px 14px;
+  font-size: 0.92rem;
+}
+
+.full-width-btn {
+  width: 100%;
+}
+
+.spring-copy {
+  min-height: 520px;
+  background:
+    radial-gradient(circle at 16% 20%, rgba(255, 255, 255, 0.88), transparent 42%),
+    linear-gradient(145deg, rgba(125, 195, 137, 0.22), rgba(246, 184, 91, 0.18));
+}
+
+.admin-copy {
+  min-height: 420px;
+}
+
+.feature-list {
+  margin-top: 26px;
+}
+
+.feature-list span,
+.info-box,
+.feedback-box {
+  padding: 10px 14px;
+  border-radius: 16px;
+  background: rgba(255, 255, 255, 0.62);
+  border: 1px solid rgba(78, 148, 97, 0.12);
+}
+
+.panel-glow {
+  position: absolute;
+  inset: auto auto -50px -30px;
+  width: 140px;
+  height: 140px;
+  border-radius: 50%;
+  background: radial-gradient(circle, rgba(246, 184, 91, 0.25), transparent 68%);
+}
+
+.task-card {
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+
+.task-card-head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 14px;
+}
+
+.task-description {
+  min-height: 50px;
+}
+
+.task-media-wrap,
+.submission-preview {
+  display: grid;
+  gap: 10px;
+}
+
+.task-media,
+.submission-preview img,
+.review-image {
+  width: 100%;
+  aspect-ratio: 4 / 3;
+  object-fit: cover;
+  border-radius: 22px;
+  border: 1px solid rgba(78, 148, 97, 0.16);
+  box-shadow: 0 12px 30px rgba(86, 127, 93, 0.12);
+}
+
+.clue-toggle {
+  width: 48px;
+  height: 48px;
+  display: grid;
+  place-items: center;
+  border: none;
+  border-radius: 18px;
+  font-size: 1.2rem;
+  background: rgba(246, 184, 91, 0.14);
+  color: #c88929;
+  transition: transform 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
+}
+
+.clue-toggle.is-ready {
+  background: rgba(246, 184, 91, 0.26);
+  box-shadow: 0 14px 26px rgba(233, 173, 75, 0.22);
+}
+
+.clue-toggle.is-clue-view {
+  transform: rotate(-10deg) scale(1.04);
+}
+
+.release-note {
+  font-size: 0.88rem;
+  color: var(--muted);
+}
+
+.upload-form,
+.inline-form {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  align-items: end;
+}
+
+.inline-form-wide {
+  flex-direction: column;
+  align-items: stretch;
+}
+
+.visibility-form {
+  justify-content: flex-end;
+}
+
+.upload-label {
+  flex: 1 1 220px;
+}
+
+.feedback-box {
+  color: var(--text);
+}
+
+.leaderboard-card {
+  padding: 26px;
+}
+
+.rank-table-wrap,
+.table-shell {
+  overflow-x: auto;
+}
+
+.rank-table,
+.data-table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+.rank-table th,
+.rank-table td,
+.data-table th,
+.data-table td {
+  padding: 14px 12px;
+  border-bottom: 1px solid rgba(78, 148, 97, 0.12);
+  text-align: left;
+}
+
+.rank-table tbody tr:hover,
+.data-table tbody tr:hover {
+  background: rgba(78, 148, 97, 0.05);
+}
+
+.stat-card {
+  min-height: 130px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+.stat-card strong {
+  font-size: 2rem;
+  color: var(--primary-deep);
+}
+
+.info-box {
+  margin-top: 18px;
+  display: grid;
+  gap: 12px;
+}
+
+.member-list {
+  display: grid;
+  gap: 10px;
+  margin: 16px 0;
+}
+
+.member-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 12px 14px;
+  border-radius: 16px;
+  background: rgba(255, 255, 255, 0.62);
+}
+
+.checkbox-row {
+  display: inline-flex;
+  align-items: center;
+  gap: 10px;
+}
+
+.checkbox-row input {
+  width: 18px;
+  height: 18px;
+  padding: 0;
+}
+
+.compact-checkbox {
+  padding: 0;
+}
+
+.task-builder {
+  display: grid;
+  gap: 16px;
+}
+
+.task-builder-card {
+  padding: 18px;
+  border-radius: 22px;
+  background: rgba(255, 255, 255, 0.64);
+  border: 1px dashed rgba(78, 148, 97, 0.24);
+  display: grid;
+  gap: 14px;
+}
+
+.review-card {
+  display: grid;
+  gap: 14px;
+}
+
+.review-filter-form {
+  align-items: end;
+}
+
+.review-filter-action {
+  justify-content: end;
+}
+
+.empty-state {
+  padding: 32px;
+  border-radius: var(--radius-lg);
+  background: rgba(255, 255, 255, 0.68);
+  border: 1px dashed rgba(78, 148, 97, 0.24);
+  text-align: center;
+}
+
+.pulse-highlight {
+  animation: pulse-glow 1.8s ease;
+}
+
+@keyframes rise-in {
+  from {
+    opacity: 0;
+    transform: translateY(18px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes pulse-glow {
+  0% {
+    box-shadow: var(--shadow);
+  }
+  35% {
+    box-shadow: 0 0 0 8px rgba(246, 184, 91, 0.18), var(--shadow);
+  }
+  100% {
+    box-shadow: var(--shadow);
+  }
+}
+
+@media (max-width: 980px) {
+  .topbar,
+  .hero-card,
+  .page-grid,
+  .two-column-layout,
+  .login-page,
+  .compact-login-page,
+  .admin-activity-grid {
+    grid-template-columns: 1fr;
+    flex-direction: column;
+  }
+
+  .topbar {
+    border-radius: 28px;
+    align-items: flex-start;
+  }
+
+  .topnav {
+    width: 100%;
+    justify-content: flex-start;
+  }
+
+  .login-copy {
+    min-height: auto;
+  }
+}
+
+@media (max-width: 720px) {
+  .shell {
+    width: min(100% - 20px, 1200px);
+    padding-top: 18px;
+  }
+
+  .topbar,
+  .hero-card,
+  .glass-card,
+  .login-copy,
+  .login-panel {
+    padding: 20px;
+  }
+
+  .card-footer,
+  .card-topline,
+  .section-head,
+  .stack-item,
+  .builder-title-row,
+  .task-card-head,
+  .task-status-row {
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .cols-2,
+  .cols-3,
+  .form-grid,
+  .meta-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .btn,
+  .full-width-btn {
+    width: 100%;
+  }
+}