.ka-wrap { max-width: 1100px; margin: 1em 0; font-size: 15px; }
.ka-wrap * { box-sizing: border-box; }
.ka-box { background: #f6f7f9; border: 1px solid #dcdfe4; border-radius: 8px; padding: 14px 16px; margin: 0 0 16px; }
.ka-box summary { cursor: pointer; font-weight: 600; }
.ka-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin-top: 10px; }
.ka-filter { margin-top: 0; }
.ka-grid label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: 13px; }
.ka-grid input[type=text], .ka-grid select, .ka-grid input[type=file] { width: 100%; padding: 7px 9px; border: 1px solid #c3c8d0; border-radius: 5px; background: #fff; font-size: 15px; font-weight: 400; }
.ka-full { grid-column: 1 / -1; }
.ka-btn { display: inline-block; padding: 7px 14px; border: 1px solid #b4bac4; border-radius: 5px; background: #fff; color: #222; font-size: 14px; line-height: 1.3; cursor: pointer; text-decoration: none; }
.ka-btn:hover { background: #eef0f3; }
.ka-btn-primary { background: #2563eb; border-color: #2563eb; color: #fff; }
.ka-btn-primary:hover { background: #1d4fc4; }
.ka-btn-danger { color: #b91c1c; border-color: #e0a3a3; }
.ka-btn-danger:hover { background: #fdecec; }
.ka-table-wrap { overflow-x: auto; }
.ka-table { width: 100%; border-collapse: collapse; background: #fff; }
.ka-table th, .ka-table td { padding: 10px 12px; border-bottom: 1px solid #e3e6ea; text-align: left; vertical-align: middle; }
.ka-table th { background: #f0f2f5; font-size: 13px; }
.ka-actions { white-space: nowrap; }
.ka-actions form { display: inline; margin: 0; }
.ka-msg { padding: 10px 14px; border-radius: 6px; margin-bottom: 14px; }
.ka-msg-success { background: #e7f6ec; border: 1px solid #a7d8b6; color: #14532d; }
.ka-msg-error { background: #fdecec; border: 1px solid #e0a3a3; color: #7f1d1d; }
.ka-notice { color: #555; }
.ka-count { color: #666; font-size: 13px; }

@media (max-width: 640px) {
	.ka-table thead { display: none; }
	.ka-table tr { display: block; border-bottom: 2px solid #dcdfe4; padding: 6px 0; }
	.ka-table td { display: flex; justify-content: space-between; gap: 12px; border: 0; padding: 6px 12px; }
	.ka-table td::before { content: attr(data-label); font-weight: 600; color: #555; }
	.ka-actions { flex-wrap: wrap; white-space: normal; }
}

.ka-edit { margin-top: 4px; font-size: 12px; }
.ka-edit summary { cursor: pointer; color: #2563eb; }
.ka-edit form { margin-top: 6px; display: flex; gap: 6px; flex-wrap: wrap; }
.ka-edit input[type=text] { padding: 5px 8px; border: 1px solid #c3c8d0; border-radius: 5px; min-width: 200px; }

.ka-userbar { margin: 0 0 12px; color: #555; font-size: 13px; }
.ka-login { max-width: 360px; }
.ka-login form p { margin: 0 0 10px; }
.ka-login label { display: block; font-weight: 600; font-size: 13px; margin-bottom: 4px; }
.ka-login input[type=text], .ka-login input[type=password] { width: 100%; padding: 8px 10px; border: 1px solid #c3c8d0; border-radius: 5px; }
.ka-login input[type=submit] { padding: 8px 16px; border: 1px solid #2563eb; border-radius: 5px; background: #2563eb; color: #fff; cursor: pointer; }

/* Version 2.0 */
.ka-grid input[type=email], .ka-grid input[type=password] { width: 100%; padding: 7px 9px; border: 1px solid #c3c8d0; border-radius: 5px; background: #fff; font-size: 15px; font-weight: 400; }
.ka-grid label.ka-check { flex-direction: row; align-items: center; gap: 8px; font-weight: 400; }
.ka-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ka-inline { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: 0; }
.ka-inline input[type=password] { padding: 5px 8px; border: 1px solid #c3c8d0; border-radius: 5px; }
.ka-login { max-width: 420px; }

.ka-sum { max-width: 420px; }
.ka-sum td:last-child, .ka-sum th:last-child { text-align: right; width: 90px; }
.ka-sum-total td { background: #f0f2f5; }

.ka-hr { border: 0; border-top: 1px solid #dcdfe4; margin: 18px 0 10px; }
.ka-userbar .ka-btn { margin-left: 4px; }