:root{
    --ink:#202c29;
    --muted:#77817c;
    --green:#175447;
    --green-deep:#123e35;
    --lime:#d9edac;
    --canvas:#f5f7f5;
    --border:#e5eae6;
    --radius:18px;
    --bs-body-color:var(--ink);
    --bs-primary:#175447;
    --bs-link-color:#175447;
    --bs-link-hover-color:#103d32}

*{
    box-sizing:border-box}
body{
    margin:0;
    font-family:'DM Sans',sans-serif;
    color:var(--ink);
    background:var(--canvas);
    font-size:14px;
    line-height:1.6}
h1,h2,h3,h4,.portal-brand{
    font-family:Manrope,sans-serif;
    letter-spacing:-.045em}
h1{
    font-weight:800!important}
a{
    color:var(--green);
    text-underline-offset:4px}
button,a,input,select,textarea{
     -webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{
    outline:3px solid #95b963;
    outline-offset:4px}
.text-muted{
    color:var(--muted)!important}
.skip-link{
    position:fixed;
    top:-70px;
    left:20px;
    z-index:2000;
    background:white;
    padding:12px}
.skip-link:focus{
    top:10px}
.app-sidebar{
    position:fixed;
    inset:0 auto 0 0;
    width:252px;
    background:white;
    border-right:1px solid var(--border);
    padding:30px 20px 18px;
    display:flex;
    flex-direction:column;
    z-index:1040}
.portal-brand{
    display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
    font-size:28px;
    font-weight:800;
    color:var(--green-deep);
    line-height:1.1}
.brand-mark{
    width:45px;
    height:47px;
    background:var(--green-deep);
    color:var(--lime);
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    position:relative}
.brand-mark>span{
    font-size:15px;
    position:absolute;
    right:5px;
    top:5px}
.brand-caption{
    display:block;
    font-family:'DM Sans',sans-serif;
    font-size:8px;
    letter-spacing:2px;
    color:var(--muted);
    font-weight:600;
    margin-top:7px}
.workspace-label{
    font-size:9px;
    letter-spacing:1.6px;
    font-weight:700;
    color:#8f9992;
    margin:45px 14px 14px}
.side-nav{
    display:grid;
    gap:5px}
.side-link{
    display:flex;
    align-items:center;
    gap:12px;
    padding:11px 14px;
    color:#6b7670;
    text-decoration:none;
    border-radius:10px;
    font-size:13px;
    font-weight:500;
    transition:background .18s,color .18s}
.side-link:hover{
    background:#f1f5ef;
    color:var(--green)}
.side-link.active{
    background:#eaf1e5;
    color:var(--green-deep);
    font-weight:700}
.nav-symbol{
    font-size:20px;
    width:23px;
    text-align:center;
    line-height:1}
.nav-group-label{
    margin:25px 14px 8px}
.sidebar-bottom{
    margin-top:auto;
    padding-top:28px}
.sidebar-note{
    background:#f5f7ed;
    padding:17px;
    border-radius:13px;
    margin-bottom:18px}
.sidebar-note strong{
    display:block;
    font-size:12px;
    margin:5px 0}
.sidebar-note p{
    font-size:11px;
    color:var(--muted);
    margin:0}
.note-spark{
    color:var(--green);
    font-size:22px}
.sidebar-person{
    display:flex;
    gap:10px;
    align-items:center;
    border-top:1px solid var(--border);
    padding:18px 5px 0;
    margin-top:12px}
.avatar{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:38px;
    height:38px;
    border-radius:50%;
    background:#e9eedf;
    color:var(--green);
    font-weight:700}
.sidebar-person strong{
    font-size:12px;
    display:block;
    overflow-wrap:anywhere}
.sidebar-person small{
    display:block;
    font-size:10px;
    color:var(--muted)}
.app-workspace{
    margin-left:252px;
    min-height:100vh;
    display:flex;
    flex-direction:column}
.workspace-topbar{
    height:85px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid var(--border);
    padding:0 38px;
    background:rgba(255,255,255,.8)}
.breadcrumb-label{
    font-size:12px;
    color:#929b95}
.breadcrumb-label span{
    margin:0 13px;
    color:#c2cac4}
.breadcrumb-label strong{
    font-weight:500;
    color:#35483c}
.topbar-right{
    display:flex;
    align-items:center;
    gap:20px}
.campus-label{
    font-size:11px;
    color:var(--muted);
    display:flex;
    align-items:center;
    gap:7px}
.live-dot{
    width:6px;
    height:6px;
    background:#78a44c;
    border-radius:50%;
    display:inline-block}
.avatar-small{
    width:33px;
    height:33px;
    font-size:12px}
.icon-button{
    width:35px;
    height:35px;
    border:1px solid var(--border);
    border-radius:10px;
    background:#fff;
    color:var(--green);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-size:19px}
.mobile-menu{
    display:none}
.workspace-content{
    padding:34px 38px 50px;
    max-width:1680px;
    width:100%;
    margin:0 auto;
    flex:1}
.workspace-footer{
    display:flex;
    justify-content:space-between;
    padding:18px 38px;
    border-top:1px solid var(--border);
    font-size:10px;
    color:#929b95}
.page-header{
    margin-top:0;
    margin-bottom:28px!important}
.page-header h1{
    font-size:28px;
    margin-bottom:8px!important}
.page-header p.text-muted{
    font-size:12px;
    max-width:650px}
.eyebrow{
    text-transform:uppercase;
    letter-spacing:1.9px;
    font-size:9px;
    font-weight:700;
    color:var(--green);
    margin-bottom:9px!important}
.btn{
    font-size:12px;
    font-weight:600;
    border-radius:9px;
    padding:11px 17px;
    transition:background .18s,box-shadow .18s,transform .18s}
.btn:active{
    transform:translateY(1px)}
.btn-dark{
    --bs-btn-bg:var(--green);
    --bs-btn-border-color:var(--green);
    --bs-btn-hover-bg:#103e33;
    --bs-btn-hover-border-color:#103e33;
    --bs-btn-active-bg:#103e33;
    --bs-btn-active-border-color:#103e33}
.btn-outline-dark,.btn-outline-secondary{
    --bs-btn-color:#45544b;
    --bs-btn-border-color:#dce3dd;
    --bs-btn-hover-bg:#edf2e9;
    --bs-btn-hover-color:var(--green);
    --bs-btn-hover-border-color:#cbd7c7;
    --bs-btn-active-bg:#e4eddf;
    background:white}
.btn-sm{
    padding:7px 11px;
    font-size:11px}
.btn-lg{
    padding:14px 23px;
    font-size:13px}
.surface-card,.section-card,.summary-card,.stat-card{
    background:white;
    border:1px solid var(--border)!important;
    border-radius:var(--radius);
    box-shadow:0 3px 9px #243b2b03!important}
.section-card{
    padding:25px}
.surface-card{
    padding:0}
.surface-card>.card-body{
    padding:28px!important}
.summary-card,.stat-card{
    padding:22px;
    position:relative;
    height:100%;
    overflow:hidden}
.summary-card span,.stat-card span{
    display:block;
    color:var(--muted);
    font-size:11px;
    margin-bottom:13px}
.summary-card strong,.stat-card strong{
    font-family:Manrope,sans-serif;
    font-size:32px;
    line-height:1.2;
    letter-spacing:-1.5px;
    font-weight:800}
.summary-card:after{
    content:'↗';
    position:absolute;
    right:19px;
    top:16px;
    color:#9ba993;
    font-size:17px}
.row>.col-md-3:first-child>.summary-card{
    background:var(--green-deep);
    color:white;
    border-color:var(--green-deep)!important}
.row>.col-md-3:first-child>.summary-card span{
    color:#bed1c5}
.row>.col-md-3:first-child>.summary-card:after{
    color:var(--lime)}
.section-title{
    font-size:15px;
    letter-spacing:-.3px;
    font-weight:800;
    margin-bottom:22px}
.table{
    --bs-table-bg:transparent;
    --bs-table-hover-bg:#f6f9f3;
    font-size:12px;
    margin-bottom:0}
.table>:not(caption)>*>*{
    padding:17px 15px;
    border-color:#edf0eb;
    vertical-align:middle}
.table thead th{
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:1px;
    font-weight:600;
    color:#7e8b81;
    white-space:nowrap;
    background:#fafbf8;
    border-bottom:1px solid var(--border)}
.table tbody tr:last-child td{
    border-bottom:0}
.table tbody td:first-child{
    color:var(--green);
    font-weight:600}
.table-responsive{
    border-radius:10px}
.card{
    overflow:hidden}
.status-pill{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 10px;
    border-radius:6px;
    background:#f1f3ee;
    color:#6c776c;
    font-weight:600;
    font-size:10px;
    white-space:nowrap}
.status-pill:before{
    content:'';
    height:5px;
    width:5px;
    border-radius:50%;
    background:currentColor}
.status-success{
    background:#eaf4ec;
    color:#45855c}
.status-pending{
    background:#fcf3df;
    color:#ac822f}
.status-progress{
    background:#eaf0fc;
    color:#5a7fb7}
.status-danger{
    background:#fbeceb;
    color:#bd635c}
.form-label{
    font-size:11px;
    color:#425248;
    font-weight:600;
    margin-bottom:8px}
.form-control,.form-select{
    border-radius:9px;
    min-height:46px;
    border-color:#dfe6df;
    background-color:#fff;
    font-size:12px;
    padding:11px 13px;
    color:#34453a}
.form-control::placeholder{
    color:#a0aaa1}
.form-control:focus,.form-select:focus{
    border-color:#719879;
    box-shadow:0 0 0 3px #17544710}
.form-text{
    font-size:10px;
    color:#909a92}
.form-check-input:checked{
    background-color:var(--green);
    border-color:var(--green)}
.form-check-label{
    font-size:12px;
    color:#748176}
.input-validation-error{
    border-color:#bb615b}
.text-danger{
    font-size:11px}
.alert{
    font-size:12px;
    border-radius:10px}
.alert-success{
    background:#edf5e7;
    border-color:#dceacb;
    color:#396039}
.detail-list{
    display:grid;
    grid-template-columns:145px minmax(0,1fr);
    gap:15px 20px;
    font-size:12px}
.detail-list dt{
    font-weight:500;
    color:var(--muted)}
.detail-list dd{
    margin:0;
    overflow-wrap:anywhere}
.remark-card,.attachment-card,.feedback-summary,.notification-item{
    padding:18px;
    border:1px solid var(--border);
    border-radius:12px;
    background:#fafcf8;
    font-size:12px}
.remark-card+.remark-card,.attachment-card+.attachment-card,.notification-item+.notification-item{
    margin-top:12px}
.notification-item{
    background:white;
    transition:border-color .2s}
.notification-item:hover{
    border-color:#a9bda2}
.notification-unread{
    background:#f4f8ef;
    border-left:3px solid #88a867}
.notification-item p{
    color:#7b877d;
    margin-top:5px}
.quick-actions .btn{
    display:flex;
    align-items:center;
    justify-content:space-between;
    text-align:left;
    padding:13px;
    border-color:#edf0e9}
.quick-actions .btn:after{
    content:'↗';
    color:#8e9d88}
.dashboard-banner{
    background:var(--green-deep);
    border-radius:18px;
    padding:27px 30px;
    color:white;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    margin-bottom:26px;
    position:relative;
    overflow:hidden}
.dashboard-banner:after{
    content:'✦';
    font-size:150px;
    position:absolute;
    right:170px;
    top:-55px;
    color:#ffffff06;
    pointer-events:none}
.dashboard-banner h2{
    font-size:22px;
    font-weight:700;
    letter-spacing:-.7px;
    margin-bottom:8px}
.dashboard-banner p{
    color:#b6ccc0;
    font-size:12px;
    margin:0;
    max-width:570px}
.dashboard-banner .btn{
    background:var(--lime);
    color:var(--green-deep);
    border:0;
    white-space:nowrap}
.table-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:20px 24px;
    border-bottom:1px solid var(--border);
    flex-wrap:wrap}
.table-toolbar h2{
    font-size:14px;
    font-weight:700;
    margin:0}
.table-toolbar input{
    max-width:270px;
    min-height:38px;
    background:#f9fbf7}
.metric-note{
    font-size:10px;
    color:var(--muted);
    margin-top:12px}
.stat-grid{
    display:grid;
    gap:15px}
.sidebar-backdrop{
    display:none}
.public-body{
    background:#f9faf7}
.public-header,.public-footer{
    max-width:1440px;
    margin:auto;
    padding:25px 55px;
    display:flex;
    align-items:center;
    justify-content:space-between}
.public-header nav{
    display:flex;
    align-items:center;
    gap:28px}
.public-home{
    font-size:12px;
    text-decoration:none;
    color:#748176}
.public-footer{
    font-size:10px;
    color:#95a08f;
    padding-top:25px;
    padding-bottom:25px}
.public-content{
    min-height:calc(100vh - 182px);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px 55px}
.auth-layout{
    display:grid;
    grid-template-columns:1.05fr 1fr;
    max-width:1180px;
    width:100%;
    min-height:660px;
    background:white;
    border:1px solid var(--border);
    border-radius:25px;
    overflow:hidden}
.auth-story{
    background:var(--green-deep);
    color:white;
    padding:55px;
    position:relative;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-between}
.auth-story:after{
    content:'';
    width:360px;
    height:360px;
    border:1px solid #ffffff10;
    border-radius:50%;
    position:absolute;
    right:-190px;
    bottom:40px;
    box-shadow:0 0 0 55px #ffffff04,0 0 0 110px #ffffff03;
    pointer-events:none}
.story-label{
    display:inline-flex;
    border:1px solid #6d8b6f60;
    border-radius:30px;
    padding:6px 12px;
    color:#c2d9b2;
    font-size:9px;
    letter-spacing:1.4px;
    align-self:flex-start}
.auth-story h2{
    font-size:46px;
    line-height:1.17;
    font-weight:700;
    letter-spacing:-2px;
    margin:34px 0 20px}
.auth-story h2 em{
    font-style:normal;
    color:var(--lime)}
.auth-story p{
    color:#a9c1b2;
    font-size:12px;
    line-height:1.9;
    max-width:330px}
.story-footer{
    font-size:10px;
    color:#a8bba9;
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:35px}
.story-steps{
    display:grid;
    gap:15px;
    margin-top:30px}
.story-step{
    display:flex;
    gap:13px;
    align-items:center;
    font-size:12px;
    color:#d0dece}
.story-step b{
    width:28px;
    height:28px;
    border:1px solid #ffffff20;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    color:var(--lime);
    font-size:10px}
.auth-form-panel{
    padding:58px 60px;
    display:flex;
    flex-direction:column;
    justify-content:center}
.auth-form-panel h1{
    font-size:29px;
    letter-spacing:-1px;
    margin:12px 0}
.auth-form-panel .intro{
    font-size:12px;
    color:var(--muted);
    margin-bottom:28px}
.auth-kicker{
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:2px;
    color:var(--green);
    font-weight:700}
.auth-footnote{
    border-top:1px solid var(--border);
    margin-top:25px;
    padding-top:22px;
    font-size:11px;
    color:var(--muted)}
.auth-footnote a{
    font-weight:700;
    text-decoration:none}
.password-field{
    position:relative}
.password-field input{
    padding-right:62px}
.password-toggle{
    position:absolute;
    right:12px;
    top:12px;
    border:0;
    background:none;
    font-size:10px;
    color:var(--green);
    padding:3px}
.register-layout{
    max-width:1280px;
    grid-template-columns:.8fr 1.2fr}
.register-layout .auth-story h2{
    font-size:42px}
.register-layout .auth-form-panel{
    padding:36px 45px}
.landing{
    max-width:1180px;
    width:100%}
.landing-hero{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:60px;
    align-items:center;
    padding:50px 0 65px}
.landing h1{
    font-size:64px;
    line-height:1.13;
    letter-spacing:-3.5px;
    margin:22px 0}
.landing h1 em{
    font-style:normal;
    color:#799653}
.landing .lead{
    font-size:15px;
    line-height:1.9;
    max-width:490px;
    color:var(--muted)}
.landing-art{
    background:var(--green-deep);
    border-radius:28px;
    padding:40px;
    color:#fff;
    transform:rotate(-2deg)}
.landing-art .eyebrow{
    color:var(--lime)}
.landing-art h2{
    font-size:26px;
    line-height:1.4;
    margin-bottom:28px}
.journey-item{
    display:flex;
    gap:15px;
    align-items:center;
    padding:18px 0;
    border-top:1px solid #ffffff17}
.journey-number{
    color:var(--lime);
    font-size:12px;
    border:1px solid #ffffff25;
    border-radius:50%;
    width:33px;
    height:33px;
    display:flex;
    align-items:center;
    justify-content:center}
.journey-item strong{
    font-size:12px;
    display:block}
.journey-item small{
    font-size:10px;
    color:#acc3b3}
.feature-row{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    border-top:1px solid var(--border);
    padding:30px 0}
.feature-row h3{
    font-size:14px;
    letter-spacing:-.3px}
.feature-row p{
    font-size:12px;
    color:var(--muted);
    margin:0}
.feature-number{
    font-size:10px;
    color:#879b73;
    display:block;
    margin-bottom:12px}

@media(min-width:1600px){
    .workspace-content{
    padding-top:44px}
.workspace-topbar{
    height:90px}
}

@media(max-width:1199px){
    .app-sidebar{
    width:220px;
    padding-inline:15px}
.app-workspace{
    margin-left:220px}
.workspace-content{
    padding:28px 24px}
.workspace-topbar{
    padding-inline:24px}
.campus-label{
    display:none}
.auth-story{
    padding:38px}
.auth-form-panel{
    padding:40px}
.auth-story h2{
    font-size:39px}
.landing h1{
    font-size:50px}
.public-content{
    padding:20px 30px}
.public-header,.public-footer{
    padding-inline:30px}
}

@media(max-width:991px){
    .app-sidebar{
    transform:translateX(-100%);
    transition:transform .2s;
    width:252px}
.app-workspace{
    margin-left:0}
.mobile-menu{
    display:inline-flex}
.navigation-open .app-sidebar{
    transform:translateX(0)}
.navigation-open .sidebar-backdrop{
    display:block;
    position:fixed;
    inset:0;
    background:#15251b66;
    border:0;
    z-index:1035}
.auth-layout{
    min-height:580px}
.auth-story{
    padding:30px}
.auth-story h2{
    font-size:33px}
.auth-form-panel{
    padding:32px}
.register-layout{
    grid-template-columns:1fr}
.register-layout .auth-story{
    display:none}
.landing-hero{
    gap:30px}
.landing h1{
    font-size:43px}
.landing-art{
    padding:28px}
.summary-card strong,.stat-card strong{
    font-size:28px}
}

@media(max-width:767px){
    .workspace-topbar{
    height:68px;
    padding:0 18px}
.workspace-content{
    padding:24px 18px 35px}
.breadcrumb-label{
    font-size:10px}
.breadcrumb-label span{
    margin:0 7px}
.topbar-right{
    gap:9px}
.workspace-footer{
    padding:17px 18px;
    font-size:9px}
.page-header h1{
    font-size:25px}
.summary-card,.stat-card{
    padding:17px}
.section-card{
    padding:20px}
.surface-card>.card-body{
    padding:22px!important}
.dashboard-banner{
    padding:24px;
    align-items:flex-start;
    flex-direction:column}
.dashboard-banner h2{
    font-size:21px}
.dashboard-banner:after{
    right:10px}
.detail-list{
    grid-template-columns:1fr;
    gap:5px}
.detail-list dd{
    margin-bottom:10px}
.public-header{
    padding:20px}
.public-content{
    padding:10px 18px}
.public-footer{
    padding:22px 20px;
    gap:15px;
    flex-wrap:wrap;
    font-size:9px}
.public-home{
    display:none}
.portal-brand{
    font-size:25px}
.brand-mark{
    width:40px;
    height:43px}
.auth-layout{
    grid-template-columns:1fr;
    border-radius:18px;
    min-height:0}
.auth-story{
    padding:30px;
    min-height:230px}
.auth-story h2{
    font-size:31px;
    margin:20px 0 14px}
.auth-story p,.story-steps,.story-footer{
    display:none}
.auth-form-panel,.register-layout .auth-form-panel{
    padding:30px 25px}
.auth-form-panel h1{
    font-size:26px}
.landing-hero{
    grid-template-columns:1fr;
    padding:30px 5px;
    gap:35px}
.landing h1{
    font-size:45px;
    letter-spacing:-2px}
.landing-art{
    transform:none}
.feature-row{
    grid-template-columns:1fr;
    gap:25px;
    padding:25px 5px}
.table-toolbar{
    padding:17px}
.table-toolbar input{
    max-width:none}
.public-header .btn{
    font-size:10px}
.row.g-3>.col-md-3:has(.summary-card),.row.g-3>.col-md-3:has(.stat-card){
    width:50%}
}

@media(prefers-reduced-motion:reduce){
    *,*:before,*:after{
    transition:none!important;
    scroll-behavior:auto!important}
}


.icon-definitions{
    position:absolute;
    width:0;
    height:0;
    overflow:hidden}
.nav-symbol{
    width:19px;
    height:19px;
    flex-shrink:0;
    fill:none;
    stroke:currentColor;
    stroke-width:1.6;
    stroke-linecap:round;
    stroke-linejoin:round}
.surface-card>.card-body.p-0{
    padding:0!important}
.sidebar-bottom>.side-link>.nav-symbol{
    font-size:20px;
    height:auto}

/* Keep account actions reachable on short screens and at browser zoom. */
.app-sidebar {
    height: 100vh;
    height: 100dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.app-sidebar > .portal-brand,
.app-sidebar > .workspace-label,
.sidebar-bottom {
    flex-shrink: 0;
}
.side-nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    align-content: start;
    overscroll-behavior: contain;
}
.sidebar-bottom {
    padding-top: 16px;
}
.topbar-signout {
    white-space: nowrap;
}
@media (max-height: 850px) {
    .sidebar-note { display: none; }
    .app-sidebar > .workspace-label { margin-top: 25px; }
    .sidebar-person { padding-top: 12px; }
}
@media (max-width: 575px) {
    .topbar-right { gap: 7px; }


    .breadcrumb-label { max-width: 125px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

.profile-toggle {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 4px;
    border: 1px solid transparent;
    border-radius: 30px;
    background: transparent;
    color: var(--green);
}
.profile-toggle:hover,
.profile-toggle[aria-expanded="true"] {
    background: #edf2e9;
    border-color: var(--border);
}
.profile-menu {
    min-width: 220px;
    max-width: calc(100vw - 32px);
    padding: 8px;
    margin-top: 10px !important;
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: 0 12px 35px #123e3518;
}
.profile-menu-heading { padding: 10px 12px 5px; overflow-wrap: anywhere; }
.profile-menu-heading strong { display: block; font-size: 12px; }
.profile-menu-heading small { color: var(--muted); font-size: 10px; }
.profile-menu .dropdown-divider { border-color: var(--border); margin: 8px 0; }
.profile-signout { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 10px 12px; border-radius: 8px; font-size: 12px; color: var(--green); }
.profile-signout:hover,
.profile-signout:focus { background: #edf2e9; color: var(--green-deep); }
.profile-signout:active { background: var(--green); color: white; }

.report-progress{width:100%;height:10px;accent-color:var(--green);border:0;border-radius:20px;overflow:hidden}.report-progress::-webkit-progress-bar{background:#edf2e9}.report-progress::-webkit-progress-value{background:var(--green);border-radius:20px}