:root{
    --navy:#1B2A4A;
    --navy-d:#14192B;
    --navy-l:#2E3E5C;
    --page:#FFFFFF;
    --tint:#F4F6FA;
    --tint-2:#E7ECF3;
    --grey:#5A6377;
    --grey-2:#8D95A5;
    --sig:#0369A1;
    --sig-pale:#BFE5FA;
    --sig-lite:#08B8F8;
    --edge:rgba(20,25,43,0.09);
    --edge-2:rgba(20,25,43,0.14);
    --edge-d:rgba(255,255,255,0.15);
    --lift:0 4px 20px -2px rgba(20,25,43,0.06);
    --lift-2:0 10px 34px -8px rgba(20,25,43,0.12);
    --font-main:Inter,Aptos,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

:root[data-color-blind="true"]{
    --sig:#006A8E;
    --sig-pale:#D8EEF4;
    --sig-lite:#32B6C8;
    --navy:#16324F;
    --navy-d:#102438;
}

:root[data-high-contrast="true"]{
    --page:#FFFFFF;
    --tint:#EEF2F7;
    --tint-2:#DCE5EF;
    --grey:#2F3747;
    --grey-2:#4A5364;
    --edge:rgba(0,0,0,0.18);
    --edge-2:rgba(0,0,0,0.28);
}

:root[data-font-size="large"]{
    font-size:112%;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
:root[data-reduce-motion="true"]{scroll-behavior:auto;}
body{margin:0;background:var(--page);color:var(--navy-d);
    font-family:var(--font-main);font-size:16px;line-height:1.6;
    -webkit-font-smoothing:antialiased;overflow-x:hidden;zoom:0.9;}
@supports not (zoom:1){
    body{width:111.111%;transform:scale(0.9);transform-origin:top center;}
}
h1,h2,h3{font-family:inherit;font-weight:600;line-height:1.2;letter-spacing:0;margin:0;}
p{margin:0;}
a{color:inherit;}
img{max-width:100%;display:block;}
.shell{max-width:1180px;margin:0 auto;padding:0 34px;}
.tag{font-family:inherit;font-size:11px;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--sig);}
.ico{width:19px;height:19px;stroke-width:1.5;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;}

/* Base navigation link styling */
.navlinks a {
    color: #64748b;
    text-decoration: none;
    font-weight: 500;
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    transition: all 0.2s ease-in-out;
    position: relative;
}

/* Hover state */
.navlinks a:hover {
    color: #1e293b;
    background-color: #f1f5f9;
}

/* Active Link State */
.navlinks a.active {
    color: #0f172a;
    font-weight: 600;
    background-color: #e2e8f0;
}

.ph{background:var(--tint);border:1px dashed rgba(20,25,43,0.2);
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
    text-align:center;padding:22px;color:var(--grey);}
.ph .t{font-family:inherit;font-size:10.5px;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--sig);}
.ph .d{font-size:13.5px;line-height:1.5;max-width:30ch;}
.ph.tall{aspect-ratio:3/4;}
.ph.wide{aspect-ratio:4/3;}

.c {
    display: block;
    padding: 12px 24px;
}

.c h4,
.c p {
    margin: 4px 0;
}

.c h4 a {
    color: var(--sig-lite);
    text-decoration: none;
    transition: color 0.3s ease;
}

.c .num a {
    color: #fff;
    text-decoration: none;
    transition: color 0.3s ease;
}

.c h4 a:hover,
.c .num a:hover {
    color: #2980b9;
    text-decoration: none;
}

.emerg a {
    color: inherit;
    text-decoration: none;
}


.btn{font-family:inherit;font-size:14.5px;font-weight:500;
    border:1.5px solid var(--navy);border-radius:3px;padding:11px 22px;
    background:var(--navy);color:#fff;text-decoration:none;display:inline-flex;align-items:center;gap:8px;cursor:pointer;
    transition:background .18s,color .18s,transform .18s,box-shadow .18s;}
.btn:hover{color: #ccf0ff;background:var(--navy-d);transform:translateY(-1px);box-shadow:0 8px 20px -8px rgba(20,25,43,0.5);}
.btn.line{background:transparent;color:var(--navy);box-shadow:none;}
.btn.line:hover{background:var(--tint);transform:none;box-shadow:none;}
.btn.big{padding:13px 26px;font-size:15.5px;}
.invited{display:inline-flex;gap:7px;font-size:14px;text-decoration:none;border-bottom:2px solid var(--sig);padding-bottom:2px;}
.invited b{font-weight:600;}
:focus-visible{outline:2.5px solid var(--sig);outline-offset:3px;}

.pill{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--edge-2);border-radius:999px;
    padding:6px 15px 6px 12px;font-size:13px;color:var(--grey);background:var(--page);box-shadow:var(--lift);}
.dot{width:7px;height:7px;border-radius:50%;background:#2E9E6B;box-shadow:0 0 0 3px rgba(46,158,107,0.16);flex:none;}

/* ACCESSIBILITY CONTROLS */
.accessibility-widget{position:fixed;right:22px;bottom:22px;z-index:80;}
.accessibility-trigger{width:46px;height:46px;border-radius:50%;border:1px solid var(--edge-2);
    background:var(--page);color:var(--navy);box-shadow:var(--lift-2);font-weight:700;font-size:16px;
    cursor:pointer;display:flex;align-items:center;justify-content:center;}
.accessibility-trigger:hover{border-color:var(--sig);color:var(--sig);}
.accessibility-panel{position:absolute;right:0;bottom:58px;width:250px;padding:16px;background:var(--page);
    border:1px solid var(--edge-2);border-radius:6px;box-shadow:var(--lift-2);}
.accessibility-title{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.14em;
    text-transform:uppercase;color:var(--grey);margin-bottom:12px;}
.accessibility-option{display:flex;align-items:center;gap:10px;padding:9px 0;color:var(--navy-d);
    font-size:14px;line-height:1.35;cursor:pointer;}
.accessibility-option + .accessibility-option{border-top:1px solid var(--edge);}
.accessibility-option input{width:18px;height:18px;accent-color:var(--sig);flex:none;}
:root[data-reduce-motion="true"] *,
:root[data-reduce-motion="true"] *:before,
:root[data-reduce-motion="true"] *:after{animation:none !important;transition:none !important;}

/* AUTH LAYOUT — sign in, accept invitation, reset password */
.auth{min-height:100vh;display:grid;grid-template-columns:1.1fr 0.9fr;}
.auth-form{display:flex;flex-direction:column;justify-content:center;padding:48px 5vw;}
.auth-inner{width:100%;max-width:400px;margin:0 auto;padding-top:12px;}
.auth-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:34px;}
.auth-back{font-size:12.5px;color:var(--grey);text-decoration:none;display:inline-flex;align-items:center;gap:4px;}
.auth-back:hover{color:var(--navy-d);}
.auth-form h1{font-size:32px;margin-bottom:6px;}
.auth-form .sub{font-size:14.5px;color:var(--grey);margin-bottom:24px;}
.auth-form .btn{width:100%;justify-content:center;}
.reset-link{display:inline-block;margin-top:14px;color:var(--sig-lite);font-size:14px;text-decoration:none;
    border-bottom:1px solid rgba(8,184,248,0.45);}
.reset-link:hover{color:var(--sig);border-bottom-color:rgba(3,105,161,0.55);}
.auth-fine{margin-top:24px;padding-top:16px;border-top:1px solid var(--edge);
    font-family:inherit;font-size:10.5px;font-weight:600;letter-spacing:0.04em;
    text-transform:uppercase;color:var(--grey-2);}
.auth-aside{background:var(--navy);padding:48px 5vw;display:flex;flex-direction:column;justify-content:center;}
.auth-aside-inner{width:100%;max-width:380px;}
.auth-aside .tag{color:var(--sig-lite);display:block;margin-bottom:14px;}
.auth-aside h2{font-size:23px;color:#fff;line-height:1.25;margin-bottom:16px;}
.auth-aside p{font-size:14.5px;line-height:1.65;color:#B2BACB;margin-bottom:13px;}
.auth-aside a{color:var(--sig-lite);font-size:13px;text-decoration:none;
    border-bottom:1px solid rgba(8,184,248,0.4);display:inline-block;margin-top:10px;}

@media (max-width:800px){
    .auth{min-height:0;grid-template-columns:1fr;}
    .auth-form{padding:36px 24px 30px;}
    .auth-aside{padding:32px 24px 36px;}
    .accessibility-widget{right:16px;bottom:16px;}
    .accessibility-panel{width:min(250px,calc(100vw - 32px));}
}

/* Live password requirement feedback — see webroot/js/password-strength.js */
.pw-rules{list-style:none;padding:0;margin:0 0 18px;}
.pw-rules li{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--grey-2);padding:2.5px 0;
    transition:color .15s ease;}
.pw-rules li.is-met{color:#0F6E56;}
.pw-mark{width:13px;display:inline-block;text-align:center;flex:none;}

.pw-field .input{position:relative;}
.pw-field input{padding-right:40px;}
.pw-eye{position:absolute;right:4px;bottom:0;height:48px;width:36px;border:0;background:transparent;
    padding:0;cursor:pointer;color:var(--grey-2);display:flex;align-items:center;justify-content:center;}
.pw-eye:hover{color:var(--navy-d);}
.pw-eye svg{width:18px;height:18px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;}
.pw-match{font-size:12.5px;margin:7px 0 0;min-height:17px;color:var(--grey-2);}
.pw-match.is-met{color:#0F6E56;}

:root[data-reduce-motion="true"] .pw-rules li{transition:none;}
