:root {
  --color-primary: #2563eb;
  --color-primary-hover: #1d4ed8;
  --color-danger: #ef4444;
  --color-success-text: #065f46;
  --color-warning-bg: #fffbeb;
  --text-primary: #111827;
  --text-secondary: #374151;
  --text-tertiary: #6b7280;
  --bg-body: #f5f5f5;
  --bg-surface: #fff;
  --border-default: #e5e7eb;
  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Hiragino Sans', sans-serif;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --radius-lg: 6px;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg-body); color: var(--text-primary); font: 14px/1.6 var(--font-family); }
main { max-width: 1000px; margin: auto; padding: var(--space-6); }
h1 { font-size: 20px; } h2 { font-size: 18px; } h3 { font-size: 14px; }
p, h1, h2, h3 { margin: 0 0 var(--space-3); }
.btn { border: 1px solid var(--border-default); border-radius: var(--radius-lg); padding: var(--space-2) var(--space-3); font: inherit; background: var(--bg-surface); color: var(--text-primary); cursor: pointer; }
.btn-primary { background: var(--color-primary); color: white; }
.btn-primary:hover { background: var(--color-primary-hover); }
.btn-danger { background: var(--color-danger); color: white; }
:disabled { opacity: .5; cursor: default; }
:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.card { background: var(--bg-surface); border: 1px solid var(--border-default); border-radius: var(--radius-lg); padding: var(--space-4); margin: var(--space-3) 0; overflow-wrap: anywhere; }
.toolbar { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-bottom: var(--space-3); align-items: center; }
.layout { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(0, 2fr); gap: var(--space-4); }
.table { width: 100%; border-collapse: collapse; } .table td { border-bottom: 1px solid var(--border-default); padding: var(--space-2); }
.tag { display: inline-block; font-size: 12px; color: var(--color-success-text); background: var(--bg-body); padding: var(--space-1) var(--space-2); border-radius: var(--radius-lg); }
.muted { color: var(--text-tertiary); font-size: 12px; }
.notice { background: var(--color-warning-bg); padding: var(--space-3); margin-bottom: var(--space-3); white-space: pre-wrap; }
.mono { font-family: ui-monospace, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.match-code { font: bold 32px/1.5 ui-monospace, monospace; letter-spacing: 4px; }
label { display: block; margin: var(--space-2) 0; }
input, textarea { font: inherit; max-width: 100%; padding: var(--space-2); border: 1px solid var(--border-default); border-radius: var(--radius-lg); }
[hidden] { display: none !important; }
@media (max-width: 640px) { main { padding: var(--space-3); } .layout { grid-template-columns: 1fr; } .btn { min-height: 44px; } }

.fingerprint { font: bold 24px/1.5 ui-monospace, monospace; letter-spacing: 2px; }