.cl-cards{max-width: none}.cl-cards .request-card{display: grid;gap: 12px;align-content: start}.cl-cards input.live-code-in{min-height: 52px;border-radius: 14px;border: 1px solid var(--line-2);background: var(--surface-2);color: var(--ink)}.cl-ic{width: 56px;height: 56px;border-radius: 18px;display: grid;place-items: center;font-size: 24px;background: var(--brand-tint);color: var(--brand)}.cl-ic.gold{background: var(--accent-tint);color: var(--accent)}.cl-mine{display: grid;grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));gap: 10px}.cl-mine-item{display: grid;grid-template-columns: 1fr auto;align-items: center;padding: 14px 16px;border-radius: 16px;background: var(--surface);border: 1px solid var(--line)}.cl-mine-item small{grid-column: 1;color: var(--ink-3)}.cl-mine-item i{grid-row: 1 / 3;grid-column: 2;color: var(--ink-3)}.cl-join{max-width: 520px;margin: 0 auto;display: grid;gap: 14px;justify-items: start}.cl-top{display: flex;justify-content: space-between;align-items: center;gap: 14px;flex-wrap: wrap;padding: 20px 22px;border-radius: 22px;background: var(--grad-night);color: #fff;margin-bottom: 14px}.cl-top h2{color: #fff;font-size: 24px;margin: 6px 0 2px}.cl-top small{color: #c7d2e5}.cl-code{text-align: center;padding: 8px 18px;border-radius: 16px;background: rgba(255, 255, 255, .1)}.cl-code small{display: block;color: #c7d2e5}.cl-code b{font-size: 30px;letter-spacing: .12em;color: var(--gold-300)}.cl-share{margin-bottom: 8px;align-items: center}.cl-add{margin: 16px 0}.cl-add summary{cursor: pointer;font-weight: 700;font-size: 17px}.cl-add summary i{color: var(--accent)}.cl-add form{display: grid;gap: 12px;margin-top: 14px}.cl-h3{font-size: 18px;margin: 22px 0 10px}.cl-task{display: flex;align-items: center;gap: 12px;padding: 14px 16px;border-radius: 16px;background: var(--surface);border: 1px solid var(--line);margin-bottom: 8px}.cl-task > div{flex: 1;min-width: 0}.cl-task small{display: block;color: var(--ink-3);font-size: 13px}.cl-task.done{background: var(--surface-2)}.cl-score{font-weight: 700;color: var(--success);white-space: nowrap}.cl-score em, .cl-late{font-style: normal;font-size: 12px;color: var(--danger);font-weight: 600}.cl-task-t{border-radius: 18px;background: var(--surface);border: 1px solid var(--line);margin-bottom: 10px;overflow: hidden}.cl-task-t summary{display: flex;align-items: center;gap: 14px;padding: 14px 16px;cursor: pointer;list-style: none}.cl-task-t summary::-webkit-details-marker{display: none}.cl-task-t summary > div{flex: 1;min-width: 0}.cl-task-t summary small{display: block;color: var(--ink-3);font-size: 13px}.cl-meter{text-align: center;min-width: 64px}.cl-meter b{display: block;font-size: 18px;color: var(--brand)}.cl-meter small{color: var(--ink-3);font-size: 12px}.cl-task-body{padding: 4px 16px 16px;display: grid;gap: 12px}.cl-table{width: 100%;border-collapse: collapse;font-size: 14.5px}.cl-table th, .cl-table td{padding: 8px 10px;border-bottom: 1px solid var(--line);text-align: start}.cl-table th{color: var(--ink-3);font-weight: 600;font-size: 13px}.cl-pct{font-weight: 700;padding: 2px 10px;border-radius: var(--r-full)}.cl-pct.hi{background: var(--success-tint);color: var(--success)}.cl-pct.mid{background: var(--accent-tint);color: var(--accent)}.cl-pct.lo{background: var(--danger-tint);color: var(--danger)}.cl-missing{color: var(--ink-2);font-size: 14px;line-height: 1.8}.cl-task-body h4{font-size: 15px}.cl-task-body h4 i{color: var(--danger)}.cl-hard{display: grid;gap: 6px;list-style: none;padding: 0}.cl-hard li{display: flex;gap: 12px;align-items: flex-start;padding: 10px 12px;border-radius: 12px;background: var(--danger-tint)}.cl-hard em{font-style: normal;font-weight: 700;color: var(--danger);min-width: 44px}.cl-hard p{line-height: 1.8;font-size: 14.5px}.cl-hard small{display: block;color: var(--success);font-weight: 600}.cl-students{display: flex;flex-wrap: wrap;gap: 8px}.cl-students span{display: inline-flex;align-items: center;gap: 4px;padding: 4px 6px 4px 12px;border-radius: var(--r-full);background: var(--surface-2);font-size: 14px}.cl-students span{padding-inline: 12px 4px}@media (max-width: 760px){.cl-task, .cl-task-t summary{flex-wrap: wrap}.cl-table{font-size: 13px}.cl-table th:nth-child(3), .cl-table td:nth-child(3){display: none}}