:root{
    --bg:#f3f5f2;
    --ink:#20332e;
    --muted:#67766e;
    --line:#e0e7e1;
    --green:#23664e;
    --soft:#edf5ef;
    --radius:14px;
    font-family:Inter,"Segoe UI",system-ui,sans-serif;
    color:var(--ink);
    background:var(--bg);
    font-size:15px;
    line-height:1.6
}
*{
    box-sizing:border-box
}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body{
    margin:0
}
a{
    color:var(--green);
    text-decoration:none
}
a:hover{
    text-decoration:underline
}
button,input,select,textarea{
    font:inherit
}
button,a,input,select,textarea{
    touch-action:manipulation
}
button{
    cursor:pointer
}
button:disabled{
    cursor:not-allowed
}
a,button,input,select,textarea{
    outline-offset:4px
}
:focus-visible{
    outline:3px solid #b38227
}
::selection{
    background:#d6ebd8
}
h1,h2,h3,p{
    margin-top:0
}
h2{
    font-size:32px;
    line-height:1.2;
    letter-spacing:-1px;
    margin-bottom:14px;
    font-weight:650
}
h3{
    font-size:18px;
    letter-spacing:-.3px;
    margin-top:32px;
    margin-bottom:16px
}
p{
    color:var(--muted);
    margin-bottom:18px
}
small{
    font-size:12px
}
strong{
    font-weight:650
}
table{
    width:100%;
    border-collapse:collapse;
    background:white;
    font-size:13px
}
th{
    text-align:left;
    background:#f8faf7;
    color:var(--muted);
    font-size:11px;
    letter-spacing:.7px;
    text-transform:uppercase;
    font-weight:650;
    white-space:nowrap
}
th,td{
    padding:9px 14px;
    border-bottom:1px solid var(--line);
    vertical-align:middle
}
tbody tr:last-child td{
    border-bottom:0
}
tbody tr:hover{
    background:#fafcf9
}
td a{
    font-weight:600
}
td[colspan]{
    text-align:center;
    padding:40px;
    color:var(--muted)
}
.sidebar{
    position:fixed;
    inset:0 auto 0 0;
    width:250px;
    height:100vh;
    height:100dvh;
    background:#183e35;
    color:#d4e3d9;
    display:flex;
    flex-direction:column;
    padding:34px 20px;
    z-index:10
}
.sidebar-content{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    scrollbar-width:thin;
    scrollbar-color:#789886 #183e35;
    padding:4px;
    margin:-4px -4px 18px
}
.brand{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
    color:#fff;
    font-weight:650;
    font-size:15px;
    letter-spacing:-.3px
}
.brand:hover{
    text-decoration:none
}
.brand small{
    display:block;
    font-weight:400;
    color:#b5c9bd;
    font-size:11px;
    letter-spacing:.1px;
    margin-top:2px
}
.club-logo{
    display:block;
    width:100%;
    max-width:210px;
    height:auto;
    background:#fff;
    border-radius:8px
}
.nav-label{
    font-size:10px;
    letter-spacing:1.8px;
    color:#a1baac;
    margin:48px 12px 14px
}
.sidebar nav{
    display:flex;
    flex-direction:column;
    gap:7px
}
.sidebar nav a{
    color:#cbdacf;
    padding:12px 15px;
    border-radius:9px;
    display:flex;
    gap:13px;
    align-items:center;
    font-size:14px
}
.sidebar nav a span{
    font-size:20px;
    width:22px;
    text-align:center
}
.sidebar .nav-group{
    min-width:0;
}
.sidebar nav a.nav-subitem{
    margin-left:22px;
    padding-left:12px;
    font-size:12px;
    line-height:1.4;
}
.sidebar nav a.nav-subitem span{
    flex:0 0 16px;
    font-size:15px;
}
.sidebar nav a:hover{
    background:#285044;
    text-decoration:none
}
.sidebar nav a[aria-current]{
    background:#e3edda;
    color:#254833;
    font-weight:650
}
.sidebar-bottom{
    flex-shrink:0;
    margin-top:auto;
    display:flex;
    gap:11px;
    align-items:center;
    padding-top:22px;
    border-top:1px solid #3a5c50
}
.session-timer{
    flex-shrink:0;
    order:2;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:8px;
    margin-top:10px;
    padding:6px 8px;
    border-radius:8px;
    background:#285044;
    color:#d4e3d9;
    line-height:1.1
}
.session-timer span{
    min-width:0;
    white-space:nowrap;
    font-size:10px;
    letter-spacing:.15px
}
.session-timer strong{
    flex-shrink:0;
    color:#fff;
    font-size:10px;
    font-variant-numeric:tabular-nums;
    letter-spacing:.5px
}
.session-timer-warning{
    background:#7a3f24;
    color:#fff1e7
}
.sidebar-bottom strong{
    display:block;
    max-width:115px;
    overflow-wrap:anywhere;
    font-size:13px
}
.sidebar-bottom small{
    display:block;
    color:#afc6b6
}
.avatar{
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#456859;
    color:#fff;
    flex-shrink:0
}
.sidebar-bottom form{
    margin-left:auto
}
.logout{
    padding:3px 7px;
    background:transparent;
    border:0;
    color:#d6e4d9;
    font-size:25px
}
.workspace{
    margin-left:250px;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    min-width:0
}
.topbar{
    height:78px;
    padding:0 42px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    background:#fff;
    border-bottom:1px solid var(--line);
    font-size:10px;
    letter-spacing:1px;
    color:var(--muted)
}
.topbar strong{
    color:var(--ink);
    font-weight:500;
    letter-spacing:0;
    font-size:12px
}
.topbar-home{
    color:inherit
}
.action-menu{
    position:relative
}
.action-menu summary{
    cursor:pointer;
    list-style:none
}
.action-menu summary::-webkit-details-marker{
    display:none
}
.action-menu[open] .action-menu-items{
    display:grid
}
.action-menu-items{
    display:none;
    position:absolute;
    right:0;
    z-index:10;
    min-width:230px;
    padding:8px;
    border:1px solid var(--line);
    border-radius:10px;
    background:#fff;
    box-shadow:0 12px 28px rgba(32,51,46,.16)
}
.action-menu-items a{
    padding:8px 10px;
    border-radius:7px
}
.action-menu-items a:hover{
    background:var(--soft);
    text-decoration:none
}
.topbar-divider{
    margin:0 15px;
    color:#b9c5bc
}
.today{
    letter-spacing:0;
    font-size:12px
}
main{
    width:100%;
    max-width:1440px;
    margin:0 auto;
    padding:40px 42px;
    flex:1;
    min-width:0
}
.footer{
    padding:20px 42px;
    color:#7a8980;
    font-size:11px;
    border-top:1px solid var(--line);
    display:flex;
    justify-content:space-between
}
.skip-link{
    position:fixed;
    top:-100px;
    left:20px;
    z-index:50;
    background:white;
    padding:12px
}
.skip-link:focus{
    top:10px
}
button:not(.logout),.button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid var(--green);
    border-radius:8px;
    background:var(--green);
    color:#fff;
    padding:10px 18px;
    font-weight:600;
    font-size:13px;
    min-height:42px;
    text-decoration:none;
    transition:background .15s
}
button:not(.logout):hover,.button:hover{
    background:#194b39;
    text-decoration:none
}
button:not(.logout):disabled{
    background:#eef1eb;
    color:#727e72;
    border-color:#dce2d8
}
.button.secondary,button.secondary,button[type=button]{
    background:white;
    color:var(--green);
    border-color:#cad8cc
}
.button.secondary:hover,button.secondary:hover,button[type=button]:hover{
    background:var(--soft)
}
.button.danger,button.danger{
    background:#a24639;
    border-color:#a24639;
    color:#fff
}
.button.danger:hover,button.danger:hover{
    background:#7f3027;
    border-color:#7f3027
}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea{
    display:block;
    width:100%;
    max-width:640px;
    background:#fff;
    border:1px solid #cbd7ce;
    border-radius:8px;
    padding:10px 12px;
    color:var(--ink);
    min-height:43px
}
input:hover,select:hover,textarea:hover{
    border-color:#7c9c87
}
input:focus,select:focus,textarea:focus{
    border-color:var(--green)
}
input[type=checkbox]{
    width:18px;
    height:18px;
    accent-color:var(--green)
}
label{
    display:block;
    font-size:13px;
    color:var(--ink);
    font-weight:600;
    margin-bottom:7px
}
textarea{
    resize:vertical
}
form p{
    margin-bottom:21px
}
form p:has(input[type=date]) button{
    margin-top:8px
}
form br{
    display:none
}
.errorlist{
    padding:10px 14px 10px 30px;
    background:#fff0ed;
    color:#a03228;
    border-radius:7px;
    font-size:13px
}
.helptext{
    display:block;
    font-size:12px;
    color:var(--muted);
    margin-top:6px
}
main>form:not(:has(table)):not(.inline-form){
    background:white;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:28px;
    max-width:800px;
    margin:20px 0
}
main>form[method=get]{
    display:flex;
    flex-wrap:wrap;
    align-items:end;
    gap:14px
}
main>form[method=get] p{
    margin:0
}
main>form[method=get] input{
    max-width:150px
}
.page-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin-bottom:28px
}
.page-heading h2{
    margin-bottom:8px
}
.page-heading p{
    margin:0
}
.eyebrow{
    text-transform:uppercase;
    font-size:10px;
    letter-spacing:1.8px;
    color:var(--green);
    font-weight:700;
    margin-bottom:12px
}
.actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center
}
.panel,.table-scroll{
    background:white;
    border:1px solid var(--line);
    border-radius:var(--radius);
    overflow:hidden;
    margin-bottom:24px
}
.panel{
    padding:25px
}
.panel h3{
    margin-top:0
}
.table-scroll{
    overflow-x:auto
}
.table-scroll table{
    min-width:570px
}
.table-scroll:focus-visible{
    outline-offset:2px
}
.notice{
    padding:17px 20px;
    background:#edf4eb;
    border:1px solid #d3e2d0;
    border-radius:10px;
    font-size:13px;
    margin:20px 0;
    color:#3f5d41
}
.notice.error{
    background:#fff0ed;
    border-color:#edc8c0;
    color:#92392e
}
.notice p:last-child{
    margin-bottom:0
}
.badge{
    display:inline-block;
    border-radius:6px;
    padding:4px 9px;
    background:#edf3ed;
    color:#3c664a;
    font-size:11px;
    font-weight:650;
    line-height:1.5
}
.badge.passive,.badge.unknown{
    background:#f4f0e5;
    color:#80641e
}
.badge.left,.badge.critical{
    background:#fae9e6;
    color:#a24639
}
.badge.warning{
    background:#fff2da;
    color:#8b5b10
}
.badge.fulfilled{
    background:#e5f1e9;
    color:#236444
}
.badge.normal{
    background:#edf2f6;
    color:#486678
}
.alert-detail{
    margin:6px 0 0;
    min-width:240px;
    max-width:560px
}
.subtle{
    color:var(--muted);
    font-size:13px
}
.history-details{
    margin:8px 0 24px;
    color:var(--muted);
    font-size:13px
}
.history-details summary{
    width:max-content;
    cursor:pointer;
    color:var(--muted);
    font-weight:600
}
.history-details ul{
    margin:10px 0 0;
    padding-left:24px
}
.toolbar{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:15px;
    margin-bottom:18px
}
.finance-nav{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:0 0 26px;
    padding:12px;
    background:#e8eee9;
    border:1px solid #d6e0d9;
    border-radius:var(--radius)
}
.finance-nav a{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:40px;
    padding:8px 12px;
    color:#315c4a;
    background:#fff;
    border:1px solid #d3dfd7;
    border-radius:9px;
    font-size:13px;
    font-weight:600;
    line-height:1.25;
    white-space:nowrap;
    box-shadow:0 1px 2px rgba(24,62,53,.05)
}
.finance-nav a:hover{
    color:#173e33;
    background:#f5faf6;
    border-color:#9dbbaa;
    text-decoration:none
}
.finance-nav a[aria-current="page"]{
    color:#fff;
    background:var(--green);
    border-color:var(--green);
    box-shadow:0 3px 8px rgba(35,102,78,.2)
}
.finance-nav a span{
    display:inline-grid;
    width:20px;
    height:20px;
    place-items:center;
    border-radius:6px;
    background:#e8f1eb;
    font-size:14px
}
.finance-nav a[aria-current="page"] span{
    color:var(--green);
    background:#fff
}
.toolbar input{
    max-width:350px!important
}
.search-label{
    font-size:12px;
    white-space:nowrap;
    margin:0
}
.table-scroll [hidden]{
    display:none
}
.hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    border:1px solid #dce5d5;
    background:#eaf0e3;
    border-radius:16px;
    padding:36px;
    margin-bottom:28px;
    overflow:hidden
}
.hero h2{
    font-size:36px;
    max-width:620px
}
.hero p{
    max-width:540px;
    color:#52654f;
    margin-bottom:0
}
.hero-art{
    width:100px;
    height:100px;
    border:1px solid #b8caaa;
    transform:rotate(-15deg);
    border-radius:25px;
    display:grid;
    place-items:center;
    font-size:55px;
    color:#497047;
    flex-shrink:0
}
.module-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:20px;
    margin-bottom:28px
}
.module-card{
    background:white;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:27px;
    display:flex;
    flex-direction:column;
    min-height:215px;
    color:var(--ink);
    transition:transform .15s,border-color .15s
}
.module-card:hover{
    transform:translateY(-3px);
    border-color:#95b29d;
    text-decoration:none
}
.module-card h3{
    margin:16px 0 7px;
    font-size:19px
}
.module-card p{
    font-size:13px;
    margin-bottom:20px
}
.module-card .card-link{
    margin-top:auto;
    font-size:13px;
    color:var(--green);
    font-weight:650
}
.module-icon{
    width:38px;
    height:38px;
    border-radius:10px;
    background:#eff4eb;
    display:grid;
    place-items:center;
    font-size:23px;
    color:var(--green)
}
.role-list{
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    padding:0;
    margin:0
}
.guest .workspace{
    margin:0
}
.guest main{
    max-width:520px;
    padding-top:70px
}
.login-card{
    background:white;
    border:1px solid var(--line);
    border-radius:18px;
    padding:36px;
    box-shadow:0 16px 50px #233c2a08
}
.login-logo{
    max-width:280px;
    margin:0 auto 25px
}
.login-card button{
    width:100%
}
.login-card h2{
    font-size:29px
}
.login-card input{
    max-width:none
}
main>h3{
    padding-top:22px;
    border-top:1px solid var(--line)
}
main>p:has(>strong){
    background:white;
    padding:12px 18px;
    border-bottom:1px solid var(--line);
    margin:0;
    display:flex;
    flex-wrap:wrap;
    gap:10px
}
main>p>strong{
    min-width:190px;
    color:var(--ink)
}
td label{
    font-size:11px;
    font-weight:400;
    color:var(--muted)
}
td select{
    min-width:190px
}
main>form>button{
    margin-top:12px
}
@media(min-width:1100px){
    main>form:has(#id_member_number){
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:0 24px;
        max-width:100%
    }
    main>form:has(#id_member_number)>p:has(textarea){
        grid-column:1/-1
    }
    main>form:has(#id_member_number)>button{
        justify-self:start
    }
}
@media(max-width:1100px){
    .sidebar{
        width:215px;
        padding:26px 15px
    }
    .workspace{
        margin-left:215px
    }
    .brand{
        font-size:13px
    }
    main{
        padding:30px 25px
    }
    .topbar{
        padding:0 25px
    }
    .module-grid{
        grid-template-columns:1fr
    }
    .module-card{
        min-height:auto
    }
    .hero-art{
        display:none
    }
    .page-heading{
        align-items:flex-start;
        flex-direction:column
    }
}
@media(min-width:701px) and (max-height:700px){
    .sidebar{
        padding:18px 16px
    }
    .sidebar .club-logo{
        max-width:150px
    }
    .nav-label{
        margin:22px 12px 10px
    }
    .sidebar nav a{
        padding:8px 12px
    }
    .sidebar-bottom{
        padding-top:12px
    }
}
@media(max-width:700px){
    .sidebar{
        position:static;
        width:100%;
        height:auto;
        padding:18px
    }
    .sidebar-content{
        flex:none;
        overflow:visible;
        margin-bottom:0
    }
    .brand{
        font-size:15px
    }
    .brand small{
        display:none
    }
    .nav-label{
        display:none
    }
    .sidebar nav{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:6px;
        margin-top:18px
    }
    .sidebar nav a{
        padding:9px 12px;
        font-size:12px
    }
    .sidebar-bottom{
        margin-top:16px;
        padding-top:14px
    }
    .sidebar-bottom strong{
        max-width:none
    }
    .sidebar-bottom small{
        display:none
    }
    .sidebar-bottom .avatar{
        width:26px;
        height:26px;
        font-size:11px
    }
    .sidebar-bottom .logout{
        font-size:20px
    }
    .workspace{
        margin:0;
        min-height:65vh
    }
    .topbar{
        height:55px;
        padding:0 20px
    }
    .topbar-divider{
        margin:0 6px
    }
    main{
        padding:26px 18px
    }
    h2{
        font-size:27px
    }
    .hero{
        padding:24px
    }
    .hero h2{
        font-size:29px
    }
    .page-heading{
        gap:15px
    }
    .panel{
        padding:20px
    }
    .toolbar{
        flex-wrap:wrap
    }
    .finance-nav{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:7px;
        padding:9px
    }
    .finance-nav a{
        min-width:0;
        padding:8px 9px;
        white-space:normal
    }
    .toolbar input{
        max-width:none!important
    }
    .footer{
        padding:18px
    }
    .footer span{
        display:none
    }
    .footer .software-version{
        display:inline
    }
    .guest main{
        padding-top:35px
    }
    .login-card{
        padding:25px
    }
    main>form:not(:has(table)):not(.inline-form){
        padding:20px
    }
    main>p>strong{
        min-width:130px
    }
    .actions{
        width:100%
    }
    .table-scroll table{
        min-width:540px
    }
}
.working-group-chart{min-height:calc(100dvh - 158px);display:flex;flex-direction:column}
.chart-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.chart-heading h2{margin-bottom:6px}.chart-heading p{margin-bottom:0}.chart-actions{display:flex;flex:0 0 auto;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.chart-display{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:clamp(24px,4vw,70px);padding:8px 0 0}
.chart-visual{position:relative;display:grid;place-items:center;min-height:0}
.pie-chart{display:block;width:min(96vw,88vh);max-height:88vh;overflow:visible;filter:drop-shadow(0 12px 24px rgba(24,62,53,.12))}
.pie-chart path{transition:opacity .18s ease,transform .18s ease;transform-origin:450px 300px}
.pie-chart path:hover,.pie-chart path:focus{opacity:.82;transform:scale(1.015);outline:none}
.pie-label-line{fill:none;stroke:#9caaa3;stroke-width:1.5}.pie-label-dot{fill:#9caaa3}
.pie-segment-label{fill:var(--ink);font-size:13px;font-weight:500;pointer-events:none;letter-spacing:.1px}
.pie-segment-title{font-size:15px;font-weight:800;letter-spacing:.1px}.pie-member-line.first{font-weight:600}
.pie-speaker-line{fill:#9a6400;font-size:14px;font-weight:900;letter-spacing:.15px}
.chart-empty{position:absolute;max-width:180px;text-align:center}
.working-group-chart:fullscreen{width:100vw;height:100dvh;padding:clamp(24px,3vw,50px);background:var(--bg)}
.working-group-chart:fullscreen .chart-display{padding-bottom:0}.working-group-chart:fullscreen .pie-chart{width:min(96vw,90vh);max-height:90vh}
@media(max-width:900px){.pie-chart{width:min(96vw,78vh);max-height:78vh}}
@media(max-width:520px){.chart-heading{align-items:stretch;flex-direction:column}.chart-actions{justify-content:stretch}.chart-actions .button{flex:1}}

@media(prefers-reduced-motion:reduce){
    *{
        transition:none!important;
        scroll-behavior:auto!important
    }
    .module-card:hover{
        transform:none
    }
}
