:root {
  --app-bg: #f5f7fb;
  --card-radius: 16px;
}
body { background: var(--app-bg); }
.app-container { padding: 18px; max-width: 1680px; }
.hero-card { background: #fff; border-radius: var(--card-radius); padding: 22px; box-shadow: 0 10px 30px rgba(18,38,63,.08); }
.card { border: 0; border-radius: var(--card-radius); overflow: hidden; }
.card-header { border-bottom: 1px solid rgba(0,0,0,.06); }
.language-select { min-width: 150px; }
.check-tile { border: 1px solid rgba(0,0,0,.1); border-radius: 12px; padding: 10px 12px; background: #fff; cursor: pointer; min-height: 44px; display: flex; align-items: center; gap: 8px; transition: .15s ease; }
.check-tile:hover { border-color: #0d6efd; background: #f8fbff; }
.check-tile input { flex: 0 0 auto; }
.tld-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(0,0,0,.12); border-radius: 999px; padding: 7px 10px; margin: 4px; background: #fff; cursor: pointer; }
.tld-chip:hover { border-color: #0d6efd; }
.results-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.results-grid.empty-state { display: block; }
.result-card { border: 1px solid rgba(0,0,0,.08); border-radius: 16px; padding: 14px; background: #fff; box-shadow: 0 5px 18px rgba(18,38,63,.05); }
.result-title { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; border-bottom:1px solid rgba(0,0,0,.06); padding-bottom:10px; margin-bottom:10px; }
.result-domain { font-size: 1.05rem; font-weight: 700; word-break: break-all; }
.result-section { background:#f8f9fa; border-radius:12px; padding:10px; margin-top:8px; }
.kv { display:grid; grid-template-columns: 140px minmax(0,1fr); gap:6px 10px; font-size:.92rem; }
.kv .k { color:#6c757d; }
.kv .v { word-break: break-word; white-space: pre-wrap; }
.badge-soft { border-radius:999px; padding:6px 10px; }
.history-item { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; margin:3px; border-radius:999px; background:#f1f3f5; cursor:pointer; }
.footer { padding-left: 18px; padding-right: 18px; }
@media (max-width: 991px) { .results-grid { grid-template-columns: 1fr; } .app-container { padding: 12px; } .hero-card { padding: 16px; } .input-group-lg>.form-control, .input-group-lg>.btn, .input-group-lg>.input-group-text { font-size: 1rem; } .kv { grid-template-columns: 110px minmax(0,1fr); } }
@media (max-width: 575px) { .navbar .container-fluid { gap: 10px; } .language-select { width: 100%; } .result-title { flex-direction: column; } .kv { grid-template-columns: 1fr; } .kv .k { font-weight: 700; } }