body {
    font-family: system-ui, -apple-system, sans-serif;
    margin: 0;
    background: #f7f7f9;
    color: #222;
}
.container {
    max-width: 800px;
    margin: 20px auto;
    padding: 0 16px;
}
.site-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid #e5e5e5;
}
.site-title { margin: 0; font-size: 20px; }
.site-title a { text-decoration: none; color: inherit; }
.site-nav { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.site-nav a, .site-nav button {
    padding: 6px 10px;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 6px;
    text-decoration: none;
    color: #222;
    cursor: pointer;
}
.inline { display: inline; }
.lang-select select { padding: 6px; border-radius: 6px; }
.flash {
    padding: 10px 12px;
    border-radius: 6px;
    margin-bottom: 12px;
}
.flash.success { background: #e8f7e8; border: 1px solid #b9e0b9; }
.flash.error { background: #fdeaea; border: 1px solid #f0b9b9; }
form .field { margin-bottom: 10px; }
label { display: block; font-weight: 600; margin-bottom: 4px; }
input[type="text"], input[type="email"], input[type="password"], input[type="url"] {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-sizing: border-box;
}
button {
    padding: 8px 12px;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 6px;
    cursor: pointer;
}
table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
}
th, td { padding: 8px; border-bottom: 1px solid #eee; text-align: left; }
tr:last-child td { border-bottom: none; }

.error-text {
    color: #b00020;
    font-size: 0.9em;
    margin-top: 4px;
}
.help-text {
    color: #666;
    font-size: 0.85em;
    margin-top: 2px;
}
.button-link {
    display: inline-block;
    padding: 6px 10px;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 6px;
    text-decoration: none;
    color: #222;
}
.share-url-row {
    display: flex;
    gap: 8px;
    align-items: center;
}
.share-url-row input { flex: 1; }
.qr-section {
    margin: 16px 0;
    padding: 12px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 6px;
}
.qr-title { font-weight: 600; margin-bottom: 8px; }
#qrcode { width: 256px; height: 256px; margin-bottom: 8px; }
.card-view {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 6px;
    padding: 12px;
}
.card-row { margin-bottom: 6px; }
.actions a { margin-right: 6px; }