@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@700&display=swap');

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    min-height:100vh;
    min-height:100svh;
    display:flex;
    justify-content:center;
    align-items:center;
    background-color:#D5D5D5;
    font-family:'Comic Neue', cursive;
    padding:clamp(12px,3vh,20px);
    overflow-y:auto;
}

.login-box{
    width:100%;
    max-width:420px;
    background:white;
    border:5px solid black;
    box-shadow:12px 12px 0 black;
    padding:clamp(22px,4vh,40px);
    text-align:center;
}

.login-logo{
    width:clamp(74px,13vh,110px);
    height:clamp(74px,13vh,110px);
    object-fit:cover;
    border-radius:50%;
    margin-bottom:14px;
}

.login-box h1{
    font-family:'Comic Neue','Segoe UI',Arial,sans-serif;
    font-size:clamp(2.35rem,6vh,3.4rem);
    color:#ff4d00;
    letter-spacing:4px;
    text-shadow:3px 3px 0 black;
    margin-bottom:10px;
}

.subtitle{
    font-size:1.1rem;
    margin-bottom:clamp(16px,3vh,30px);
}

.login-box label{
    display:block;
    font-size:1.2rem;
    font-weight:bold;
    margin-top:clamp(12px,2.4vh,20px);
    margin-bottom:10px;
}

.login-box input{
    width:100%;
    padding:clamp(11px,1.8vh,15px);
    border:4px solid black;
    background:white;
    box-shadow:5px 5px 0 black;
    font-size:1rem;
    font-family:'Comic Neue', cursive;
    text-align:center;
}

.login-box input:focus{
    outline:none;
    transform:translate(-2px,-2px);
    box-shadow:7px 7px 0 black;
}

.login-box button{
    width:100%;
    margin-top:clamp(18px,3.5vh,35px);
    padding:clamp(10px,1.8vh,15px);
    border:4px solid black;
    background:#A0FF9F;
    box-shadow:5px 5px 0 black;
    font-family:'Comic Neue','Segoe UI',Arial,sans-serif;
    font-size:2rem;
    letter-spacing:2px;
    cursor:pointer;
    transition:box-shadow .12s;
}

.login-box button:hover{
    box-shadow:8px 8px 0 black;
}

.login-box button:active{
    box-shadow:2px 2px 0 black;
}

.turnstile-widget{
    display:flex;
    justify-content:center;
    min-height:clamp(58px,9vh,70px);
    margin-top:8px;
}

.login-box button:disabled{
    cursor:not-allowed;
    opacity:.6;
    transform:none;
}

#error{
    color:red;
    font-weight:bold;
    margin-top:clamp(12px,2.4vh,20px);
    min-height:24px;
}

.legal-links{
    display:flex;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top:12px;
    font-size:.95rem;
}

.legal-links a{
    color:#111;
    font-weight:700;
}

@media(max-width:520px){
    body{
        align-items:flex-start;
        padding:14px;
    }

    .login-box{
        max-width:none;
        min-height:calc(100svh - 28px);
        display:flex;
        flex-direction:column;
        justify-content:center;
        padding:24px 18px;
        border-width:4px;
        box-shadow:6px 6px 0 black;
    }

    .login-logo{
        width:82px;
        height:82px;
        margin-inline:auto;
        margin-bottom:10px;
    }

    .login-box h1{
        font-size:2.55rem;
        letter-spacing:2px;
        text-shadow:2px 2px 0 black;
        overflow-wrap:anywhere;
    }

    .subtitle{
        margin-bottom:18px;
    }

    .login-box label{
        margin-top:14px;
        margin-bottom:7px;
        font-size:1rem;
    }

    .login-box input{
        min-height:48px;
        padding:12px;
        border-width:3px;
        box-shadow:3px 3px 0 black;
        font-size:16px;
    }

    .turnstile-widget{
        min-height:64px;
        overflow:hidden;
    }

    .login-box button{
        margin-top:22px;
        min-height:50px;
        padding:10px;
        border-width:3px;
        box-shadow:3px 3px 0 black;
        font-size:1.65rem;
    }

    .legal-links{
        gap:8px 12px;
        font-size:.9rem;
    }
}

/* Standardized clean interface overrides */
.header,.right-panel,.legend-container,.database-panel,.volunteer-form,.search-panel,.profile-card,.statistics-toolbar,.analytics-panel,.session-card,.activity-card,.legal-card,.flag-panel,.warning-card{
    border:1px solid var(--line)!important;
    border-radius:var(--radius)!important;
    box-shadow:var(--shadow)!important;
    background:var(--panel)!important;
}
.log-box{border:1px solid var(--line)!important;border-radius:var(--radius)!important;box-shadow:var(--shadow)!important;background:var(--panel)!important;color:var(--ink)!important}
.log-box:hover{border-color:var(--primary)!important;background:var(--sky-soft)!important;box-shadow:0 18px 38px rgba(29,78,216,.12)!important}
.choice-card,.summary-card,.meeting-row,.message-log-row,.result-row,.attendance-card,.calendar-card,.notes-card{border:1px solid var(--line)!important;border-radius:var(--radius)!important;background:var(--card)!important;box-shadow:none!important}
.choice-number{background:var(--primary)!important;color:#fff!important;border:0!important;border-radius:50%!important}
.danger-btn,.session-card button:last-child{background:var(--danger)!important;color:#fff!important}
.session-card button:nth-child(2){background:var(--primary)!important;color:#fff!important}