.karma-gate-placeholder {
    border: 1px solid rgba(128, 128, 128, 0.25);
    border-radius: 4px;
    padding: 28px 24px;
    text-align: center;
    background: rgba(128, 128, 128, 0.07);
    margin: 12px 0;
}

.karma-gate-lock {
    width: 36px;
    height: 36px;
    margin: 0 auto 12px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23888'%3E%3Cpath d='M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zM12 17c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z'/%3E%3C/svg%3E") center/contain no-repeat;
}

.karma-gate-msg {
    font-size: 15px;
    margin: 0 0 6px;
    font-weight: 500;
}

.karma-gate-hint {
    font-size: 13px;
    opacity: 0.6;
    margin: 0 0 14px;
}

.karma-gate-hint code {
    background: rgba(128, 128, 128, 0.15);
    border: 1px solid rgba(128, 128, 128, 0.25);
    color: inherit;
}

.karma-gate-btn {
    display: inline-block;
    padding: 8px 20px;
    background: #5cb85c;
    color: #fff;
    border: none;
    border-radius: 3px;
    font-size: 14px;
    cursor: pointer;
    margin-top: 4px;
}

.karma-gate-btn:hover {
    background: #449d44;
}

.karma-gate-btn:disabled {
    background: #aaa;
    cursor: not-allowed;
}

.karma-gate-error {
    color: #c0392b;
    font-size: 13px;
    margin-top: 8px;
}

.karma-gate-revealed {
    animation: kgFadeIn 0.3s ease;
}

@keyframes kgFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

#karmaGateOptions {
    margin-top: 16px;
    padding: 12px 16px;
    border: 1px solid rgba(128, 128, 128, 0.25);
    border-radius: 4px;
    background: transparent;
}

#karmaGateOptions h3 {
    margin: 0 0 10px;
    font-size: 14px;
}

#karmaGateFloorWrap {
    margin-left: 4px;
    font-size: 13px;
}

.theme-dark #karmaGateFloorWrap input[type="number"] {
    background-color: #303030;
    color: #fafafa;
    border-color: #555;
}

.theme-vbdark #karmaGateFloorWrap input[type="number"] {
    background-color: #1a2234;
    color: #c0cce0;
    border-color: #3a6090;
}

body.theme-dark .karma-gate-error {
    color: #ff8a80;
}

body.theme-vbdark .karma-gate-btn {
    background: #1e4070;
    color: #c8dff0;
}

body.theme-vbdark .karma-gate-btn:hover {
    background: #12305a;
}

body.theme-vbdark .karma-gate-btn:disabled {
    background: #2a3a50;
    color: #5a7a9a;
}

body.theme-vbdark .karma-gate-error {
    color: #ff8a80;
}

body.theme-vblight .karma-gate-btn {
    background: #336699;
    color: #ffffff;
}

body.theme-vblight .karma-gate-btn:hover {
    background: #003366;
}

body.theme-vblight .karma-gate-btn:disabled {
    background: #9baabf;
}
