* { box-sizing: border-box; }
:root { color-scheme: light; --ink: #20242b; --muted: #68717e; --line: #e3e7ec; --blue: #315bea; --bg: #f6f8fb; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; }
main { max-width: 850px; margin: 0 auto; padding: 42px 22px 64px; }
h1 { font-size: 28px; margin: 0 0 8px; }
.intro { color: var(--muted); margin: 0 0 25px; line-height: 1.6; }
.search { display: flex; gap: 10px; align-items: center; margin-bottom: 10px; }
input { flex: 1; min-width: 0; padding: 13px 14px; border: 1px solid #cbd2dc; border-radius: 10px; background: #fff; font: inherit; font-size: 16px; }
#count { font-size: 13px; color: var(--muted); margin: 0 0 14px; }
.cards { display: grid; gap: 12px; }
.card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 17px 18px; display: flex; justify-content: space-between; align-items: center; gap: 16px; box-shadow: 0 2px 8px #1f29370a; }
.card h2 { font-size: 17px; margin: 0 0 5px; }
.meta { margin: 0; color: var(--muted); font-size: 14px; }
.button { flex: none; border: 0; border-radius: 9px; background: var(--blue); color: #fff; padding: 11px 15px; font: inherit; font-weight: 650; cursor: pointer; }
.button:hover { background: #2348c6; }
.empty { background: #fff; border: 1px dashed #cbd2dc; border-radius: 14px; padding: 26px; text-align: center; color: var(--muted); }
.note { font-size: 12px; line-height: 1.6; color: var(--muted); margin-top: 23px; }
@media (max-width: 560px) {
  main { padding: 28px 15px; }
  .card { align-items: flex-start; flex-direction: column; }
  .button { width: 100%; }
  h1 { font-size: 24px; }
}

.actions{flex:none;display:flex;gap:8px}.button.copy{background:#fff;color:var(--blue,#315bea);border:1px solid var(--blue,#315bea)}.button.copy:hover{background:#eef2ff}@media(max-width:560px){.actions{width:100%}.actions .button{flex:1}}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.tab{border:1px solid #cbd2dc;background:#fff;border-radius:999px;padding:8px 14px;font:inherit;font-size:14px;cursor:pointer}.tab.on{background:#315bea;border-color:#315bea;color:#fff}