*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Consolas,"Courier New",monospace}body{background:#080c14;color:#f5f7ff}.login-page{background:radial-gradient(circle at 50% 18%,#1f3060 0,#111936 34%,#080d1c 72%)}.login-shell{min-height:100vh;display:grid;place-items:center;padding:20px}.login-card{width:418px;max-width:100%;padding:34px 32px;border:1px solid #416394;border-radius:19px;background:linear-gradient(145deg,rgba(28,48,91,.92),rgba(17,24,53,.96));box-shadow:0 0 0 2px rgba(80,125,184,.18),0 24px 70px #050710}.login-brand{display:flex;align-items:center;justify-content:center;gap:12px;color:#60aaff;font:700 25px Segoe UI}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:linear-gradient(135deg,#4d9cff,#7148ef);color:#fff;font:700 14px Segoe UI;box-shadow:0 0 20px #426fe3}.brand-subtitle{text-align:center;margin:12px 0 31px;color:#4e84c1;font-size:12px;font-weight:bold;letter-spacing:1.7px}.login-copy h1{font:700 18px Segoe UI;margin:0;color:#75c7ff}.login-copy p{margin:5px 0 23px;color:#5681b1;font:14px Segoe UI}.login-form{display:grid}.login-form label{color:#69bfff;font-weight:bold;font-size:14px;margin:0 0 7px}.login-form label:not(:first-child){margin-top:17px}.login-form i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#7cceff;box-shadow:0 0 9px #57baff;margin-right:8px}.login-form input{height:45px;border:1px solid #31547d;border-radius:9px;background:#09142b;color:#d9edff;padding:0 14px;font:14px Consolas;outline:none}.login-form input:focus{border-color:#63bfff;box-shadow:0 0 0 2px rgba(67,160,255,.3),0 0 12px rgba(42,150,255,.36)}.login-form small{margin-top:8px;color:#294a70;font-weight:bold}.login-form hr{width:100%;border:0;border-top:1px solid #26385c;margin:25px 0 22px}.login-form button,.blue-btn{border:0;border-radius:9px;background:linear-gradient(100deg,#2d7de4,#55a3ff);color:white;font:700 16px Segoe UI;padding:11px 20px;text-decoration:none;box-shadow:0 7px 18px rgba(39,126,242,.35);cursor:pointer}.portal-page{background:#080c12;overflow-x:hidden}.bars{position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 0 4%,#0d1522 4% 7.5%,transparent 7.5% 74%,rgba(95,24,135,.16) 74% 78%,transparent 78% 82%,rgba(31,74,126,.18) 82% 86%,transparent 86% 90%,rgba(84,23,120,.2) 90% 94%,transparent 94%)}.menu-shell,.users-shell{position:relative;z-index:1;width:min(1140px,calc(100% - 50px));margin:auto;padding:40px 0}.menu-shell{padding-top:10vh}.kicker{color:#3f9cff;letter-spacing:1.6px;font-size:13px}.menu-shell h1,.users-shell h1{font:700 34px Segoe UI;margin:7px 0 2px}.menu-shell p,.users-shell>p{font:17px Segoe UI;color:#b8c9e8;margin:0 0 18px}.menu-buttons,.actions{display:flex;align-items:center;gap:12px;margin-top:20px}.ghost-link{color:#70b7ff;text-decoration:none;margin-left:auto}.load-msg{border:1px solid #244b7c;border-radius:9px;background:#0d1b2d;color:#63b8ff;padding:13px 16px;margin:18px 0}.actions .blue-btn{font-size:14px}.red-btn,.remove{border:1px solid #9b2528;border-radius:8px;background:#17090c;color:#ff4349;text-decoration:none;padding:10px 18px;font-weight:bold}.table-card{margin-top:16px;border:1px solid #222b37;border-radius:13px;background:#0d1219;overflow:auto}.table-card table{width:100%;border-collapse:collapse;min-width:790px}.table-card th{padding:14px 13px;color:#4cb2ff;text-align:left;font-size:12px;background:#141b23}.table-card td{padding:11px;border-top:1px solid #222b33}.table-card td:first-child{width:38%}.table-card input:not([type=checkbox]),.table-card select{width:100%;height:40px;border:1px solid #232e3d;border-radius:6px;background:#141b25;color:#f0f4ff;padding:0 11px;font:700 14px Consolas}.check{text-align:center}.admin{width:18px;height:18px}.pill{display:inline-block;min-width:86px;text-align:center;border:1px solid #145e2c;border-radius:20px;background:#082414;color:#20d34c;padding:6px 12px}.remove{padding:8px 16px}.row-remove{opacity:.45}.row-remove .pill{border-color:#8c2727;background:#250a0a;color:#ff4444}#saveMessage{min-height:20px;color:#ff5252;margin-top:10px}.flash{position:fixed;z-index:10;top:18px;right:18px;padding:12px 16px;background:#260d12;border:1px solid #a42b36;border-radius:8px;color:#ff7d85}@media(max-width:600px){.login-card{padding:28px 22px}.users-shell{width:calc(100% - 24px)}.actions{flex-wrap:wrap}.ghost-link{margin-left:0}}
/* BackGround.png is the shared visual background supplied for the project. */
.login-page,
.portal-page {
  background-color: #070b16;
  background-image:
    linear-gradient(rgba(5, 9, 20, .72), rgba(5, 9, 20, .84)),
    url('/static/BackGround.png');
  background-repeat: no-repeat, no-repeat;
  background-position: center, center;
  background-size: cover, cover;
  background-attachment: fixed, fixed;
}

/* More dimensional login presentation without changing its functionality. */
.login-shell {
  perspective: 1400px;
  position: relative;
  isolation: isolate;
}

.login-shell::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 35%, rgba(58, 126, 255, .22), transparent 34%),
    radial-gradient(circle at 22% 78%, rgba(122, 64, 255, .16), transparent 28%);
}

.login-shell::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 5.5%;
  width: min(460px, 82vw);
  height: 46px;
  z-index: -1;
  transform: translateX(-50%);
  border-radius: 50%;
  background: rgba(0, 0, 0, .72);
  filter: blur(24px);
}

.login-card {
  position: relative;
  overflow: hidden;
  transform: rotateX(1.8deg) rotateY(-1.2deg) translateZ(24px);
  transform-style: preserve-3d;
  border: 1px solid rgba(111, 173, 255, .62);
  background:
    linear-gradient(145deg, rgba(53, 82, 145, .42), rgba(13, 21, 49, .95) 46%, rgba(10, 15, 35, .98));
  box-shadow:
    0 2px 0 rgba(159, 202, 255, .28) inset,
    0 -2px 0 rgba(0, 0, 0, .4) inset,
    -16px 18px 44px rgba(0, 0, 0, .48),
    18px 28px 74px rgba(0, 0, 0, .62),
    0 0 34px rgba(56, 129, 255, .24);
  backdrop-filter: blur(15px) saturate(125%);
  -webkit-backdrop-filter: blur(15px) saturate(125%);
}

.login-card::before {
  content: "";
  position: absolute;
  inset: 1px;
  pointer-events: none;
  border-radius: 18px;
  background: linear-gradient(125deg, rgba(255, 255, 255, .15), transparent 24%, transparent 70%, rgba(70, 112, 255, .08));
}

.login-card::after {
  content: "";
  position: absolute;
  top: -110px;
  left: -80px;
  width: 260px;
  height: 220px;
  pointer-events: none;
  transform: rotate(-24deg);
  background: linear-gradient(90deg, transparent, rgba(161, 210, 255, .12), transparent);
}

.login-brand,
.brand-subtitle,
.login-copy,
.login-form {
  position: relative;
  z-index: 1;
  transform: translateZ(30px);
}

.brand-mark {
  border: 1px solid rgba(183, 209, 255, .48);
  box-shadow:
    0 2px 3px rgba(255, 255, 255, .24) inset,
    0 -5px 10px rgba(30, 20, 120, .38) inset,
    0 10px 20px rgba(22, 69, 185, .48),
    0 0 20px rgba(80, 135, 255, .55);
  transform: translateZ(18px);
}

.login-form input {
  box-shadow:
    0 2px 4px rgba(0, 0, 0, .48) inset,
    0 1px 0 rgba(121, 174, 255, .12);
}

.login-form button {
  position: relative;
  border: 1px solid rgba(148, 201, 255, .42);
  background: linear-gradient(180deg, #66b4ff 0%, #3d91f3 48%, #2872d5 100%);
  box-shadow:
    0 2px 0 rgba(255, 255, 255, .32) inset,
    0 -3px 0 rgba(12, 68, 151, .38) inset,
    0 9px 0 #154e9d,
    0 15px 24px rgba(21, 91, 205, .5),
    0 0 24px rgba(69, 155, 255, .35);
  transform: translateY(-4px) translateZ(22px);
  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

.login-form button:hover {
  filter: brightness(1.08);
  transform: translateY(-6px) translateZ(24px);
  box-shadow:
    0 2px 0 rgba(255, 255, 255, .38) inset,
    0 -3px 0 rgba(12, 68, 151, .38) inset,
    0 11px 0 #154e9d,
    0 19px 28px rgba(21, 91, 205, .55),
    0 0 28px rgba(69, 155, 255, .42);
}

.login-form button:active {
  transform: translateY(4px) translateZ(12px);
  box-shadow:
    0 2px 0 rgba(255, 255, 255, .22) inset,
    0 -2px 0 rgba(12, 68, 151, .4) inset,
    0 2px 0 #154e9d,
    0 6px 12px rgba(21, 91, 205, .38);
}

@media (max-width: 600px) {
  .login-card {
    transform: none;
  }
}


/* Left navigation based on the supplied visual reference. */
.with-sidebar {
    overflow: hidden;
}

.app-layout {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 264px minmax(0, 1fr);
    background:
        linear-gradient(rgba(5, 9, 20, .72), rgba(5, 9, 20, .84)),
        url('/static/BackGround.png') center / cover fixed no-repeat;
}

.app-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    color: #9faabd;
    background: rgba(25, 32, 47, .97);
    border-right: 1px solid rgba(124, 148, 179, .12);
    box-shadow: 12px 0 34px rgba(0, 0, 0, .24);
    overflow: hidden;
}

.sidebar-brand-row {
    min-height: 72px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 15px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.sidebar-logo {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    border: 1px solid #315469;
    border-radius: 7px;
    color: #65b5d8;
    background: #172536;
    font: 800 11px "Segoe UI", sans-serif;
    box-shadow: 0 0 15px rgba(61, 166, 211, .12);
}

.sidebar-brand-copy strong,
.sidebar-brand-copy span {
    display: block;
}

.sidebar-brand-copy strong {
    color: #f1f4fa;
    font: 700 13px "Segoe UI", sans-serif;
}

.sidebar-brand-copy span {
    margin-top: 3px;
    color: #748195;
    font: 800 7px "Segoe UI", sans-serif;
    letter-spacing: 1.8px;
}

.sidebar-nav {
    flex: 1;
    padding: 6px 11px 22px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #364155 transparent;
}

.sidebar-section {
    margin-top: 18px;
}

.sidebar-heading {
    padding: 0 12px 7px;
    color: #657183;
    font: 800 8px "Segoe UI", sans-serif;
    letter-spacing: 1.7px;
}

.sidebar-link {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 8px 12px;
    border-left: 3px solid transparent;
    border-radius: 4px;
    color: #aeb7c6;
    text-decoration: none;
    font: 500 13px "Segoe UI", sans-serif;
    transition: color .15s ease, background .15s ease, border-color .15s ease;
}

.sidebar-link:hover,
.sidebar-link.active {
    color: #f7f9fc;
    background: #2b3445;
    border-left-color: #3a7184;
}

.sidebar-icon {
    width: 17px;
    flex: 0 0 17px;
    color: #7d899a;
    text-align: center;
    font: 700 16px "Segoe UI Symbol", "Segoe UI", sans-serif;
}

.sidebar-link:hover .sidebar-icon,
.sidebar-link.active .sidebar-icon {
    color: #a9c1ce;
}

.sidebar-footer {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 14px 20px 17px;
    border-top: 1px solid rgba(255, 255, 255, .06);
    background: rgba(15, 21, 33, .38);
}

.sidebar-footer span {
    color: #7e8a9d;
    font: 10px "Segoe UI", sans-serif;
    overflow-wrap: anywhere;
}

.sidebar-footer a {
    color: #69aee9;
    font: 700 11px "Segoe UI", sans-serif;
    text-decoration: none;
}

.app-content {
    min-width: 0;
    height: 100vh;
    overflow: auto;
    padding: 46px clamp(24px, 5vw, 72px);
}

.menu-content {
    display: flex;
    align-items: flex-start;
}

.content-panel {
    width: min(700px, 100%);
    margin-top: 4vh;
    padding: 34px;
    border: 1px solid rgba(103, 153, 211, .16);
    border-radius: 16px;
    background: rgba(8, 15, 31, .7);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .28);
    backdrop-filter: blur(10px);
}

.content-panel h1,
.users-content h1 {
    margin: 7px 0 4px;
    color: #f5f7ff;
    font: 700 34px "Segoe UI", sans-serif;
}

.content-panel p,
.page-description {
    margin: 0;
    color: #b8c9e8;
    font: 16px "Segoe UI", sans-serif;
}

.users-content {
    width: auto;
    margin: 0;
}

@media (max-width: 760px) {
    .app-layout {
        grid-template-columns: 78px minmax(0, 1fr);
    }

    .sidebar-brand-row {
        justify-content: center;
        padding: 14px 8px;
    }

    .sidebar-brand-copy,
    .sidebar-heading,
    .sidebar-link span:last-child,
    .sidebar-footer span {
        display: none;
    }

    .sidebar-link {
        justify-content: center;
        padding: 9px 6px;
    }

    .sidebar-icon {
        font-size: 18px;
    }

    .sidebar-footer {
        align-items: center;
        padding: 14px 6px;
    }

    .app-content {
        padding: 28px 16px;
    }
}

/* 3D navigation refinement and cache-busted release. */
.app-layout {
    grid-template-columns: 286px minmax(0, 1fr);
    perspective: 1600px;
}

.app-sidebar {
    z-index: 5;
    width: 286px;
    transform-style: preserve-3d;
    background:
        linear-gradient(90deg, rgba(255,255,255,.045), transparent 7%),
        linear-gradient(145deg, rgba(39, 49, 69, .985), rgba(20, 27, 41, .99) 68%);
    border-right: 1px solid rgba(141, 180, 216, .25);
    box-shadow:
        1px 0 0 rgba(255,255,255,.08) inset,
        -8px 0 18px rgba(0,0,0,.32) inset,
        12px 0 0 rgba(8, 13, 23, .38),
        26px 0 55px rgba(0,0,0,.48);
}

.app-sidebar::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(112deg, rgba(255,255,255,.07), transparent 18%),
        radial-gradient(circle at 15% 0%, rgba(72, 168, 214, .11), transparent 28%);
}

.sidebar-brand-row,
.sidebar-nav,
.sidebar-footer {
    position: relative;
    z-index: 1;
}

.sidebar-brand-row {
    min-height: 82px;
    padding: 17px 19px;
    background: linear-gradient(180deg, rgba(55, 67, 91, .72), rgba(25, 33, 49, .32));
    box-shadow:
        0 1px 0 rgba(255,255,255,.08) inset,
        0 -1px 0 rgba(0,0,0,.5) inset,
        0 8px 20px rgba(0,0,0,.2);
}

.sidebar-logo {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    border-color: rgba(92, 195, 225, .48);
    border-radius: 10px;
    color: #7ed9f4;
    background: linear-gradient(145deg, #263c50, #142232);
    box-shadow:
        1px 1px 0 rgba(255,255,255,.13) inset,
        -3px -4px 8px rgba(0,0,0,.35) inset,
        0 7px 14px rgba(0,0,0,.36),
        0 0 18px rgba(45, 171, 211, .13);
    text-shadow: 0 0 8px rgba(101, 210, 244, .55);
}

.sidebar-brand-copy strong {
    font-size: 14px;
    text-shadow: 0 2px 4px rgba(0,0,0,.55);
}

.sidebar-nav {
    padding: 8px 13px 24px;
}

.sidebar-section {
    margin-top: 20px;
}

.sidebar-heading {
    padding: 0 12px 8px;
    color: #718096;
    text-shadow: 0 1px 0 rgba(0,0,0,.8);
}

.sidebar-link {
    min-height: 41px;
    margin: 3px 0;
    padding: 9px 12px;
    border: 1px solid transparent;
    border-left: 3px solid transparent;
    border-radius: 7px;
    text-shadow: 0 2px 3px rgba(0,0,0,.6);
    transform: translateZ(0);
    transition: transform .15s ease, color .15s ease, background .15s ease, box-shadow .15s ease;
}

.sidebar-link:hover,
.sidebar-link.active {
    color: #fff;
    border-color: rgba(118, 155, 188, .18);
    border-left-color: #55b6d3;
    background: linear-gradient(180deg, #39465c, #2a3448);
    box-shadow:
        0 1px 0 rgba(255,255,255,.11) inset,
        0 -2px 4px rgba(0,0,0,.21) inset,
        0 6px 12px rgba(0,0,0,.24),
        5px 0 16px rgba(45, 148, 185, .08);
    transform: translateX(3px) translateY(-1px);
}

.sidebar-link:active {
    transform: translateX(3px) translateY(1px);
    box-shadow:
        0 2px 5px rgba(0,0,0,.35) inset,
        0 2px 5px rgba(0,0,0,.18);
}

.sidebar-icon {
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    flex-basis: 22px;
    border-radius: 6px;
    color: #8998ab;
    background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(0,0,0,.08));
    box-shadow:
        1px 1px 0 rgba(255,255,255,.06) inset,
        -1px -1px 0 rgba(0,0,0,.18) inset;
    font-size: 14px;
}

.sidebar-link:hover .sidebar-icon,
.sidebar-link.active .sidebar-icon {
    color: #bdeeff;
    background: linear-gradient(145deg, #324d60, #233545);
    box-shadow:
        1px 1px 0 rgba(255,255,255,.1) inset,
        0 4px 8px rgba(0,0,0,.3),
        0 0 12px rgba(80, 185, 221, .13);
}

.sidebar-footer {
    padding: 15px 20px 18px;
    background: linear-gradient(180deg, rgba(13,18,29,.46), rgba(9,14,23,.92));
    box-shadow: 0 1px 0 rgba(255,255,255,.05) inset, 0 -12px 25px rgba(0,0,0,.2) inset;
}

.content-panel {
    border-color: rgba(116, 166, 220, .28);
    background: linear-gradient(145deg, rgba(29, 43, 72, .82), rgba(8, 15, 31, .82));
    box-shadow:
        1px 1px 0 rgba(255,255,255,.09) inset,
        -4px -5px 16px rgba(0,0,0,.24) inset,
        0 24px 60px rgba(0,0,0,.4);
}

@media (max-width: 760px) {
    .app-layout {
        grid-template-columns: 86px minmax(0, 1fr);
    }

    .app-sidebar {
        width: 86px;
    }
}


/* Attestation and acknowledgement module. */
.attestation-content { padding-bottom: 70px; }
.attestation-header { max-width: 920px; }
.attestation-header h1 { margin: 8px 0; font: 700 36px "Segoe UI", sans-serif; }
.attestation-header p { margin: 0; color: #aebbd0; font: 15px/1.6 "Segoe UI", sans-serif; }
.attestation-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 28px 0; }
.stat-card { display: flex; gap: 16px; min-height: 126px; padding: 20px; border: 1px solid rgba(123,153,190,.24); border-radius: 14px; background: linear-gradient(145deg, rgba(38,50,76,.92), rgba(13,21,38,.96)); box-shadow: 1px 1px 0 rgba(255,255,255,.08) inset, -4px -5px 14px rgba(0,0,0,.25) inset, 0 16px 30px rgba(0,0,0,.25); }
.stat-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 10px; background: #1c2b44; font: 800 21px "Segoe UI"; box-shadow: 0 7px 14px rgba(0,0,0,.3), 1px 1px 0 rgba(255,255,255,.1) inset; }
.stat-card.warning .stat-icon { color: #f8c65e; }.stat-card.danger .stat-icon { color: #ff6975; }.stat-card.success .stat-icon { color: #43dda2; }
.stat-card small,.stat-card strong,.stat-card p { display: block; }.stat-card small { color: #8390a4; font: 800 9px "Segoe UI"; letter-spacing: 1.5px; }.stat-card strong { margin-top: 6px; font: 700 30px "Segoe UI"; }.stat-card p { margin: 4px 0 0; color: #8190a5; font: 12px "Segoe UI"; }
.attestation-tabs { display: flex; gap: 8px; border-bottom: 1px solid #263144; }
.att-tab { padding: 12px 18px; border: 0; border-bottom: 3px solid transparent; background: transparent; color: #8896aa; font: 700 13px "Segoe UI"; cursor: pointer; }.att-tab.active { border-color: #4da4ff; color: #e8f4ff; }
.att-tab-panel { display: none; padding-top: 22px; }.att-tab-panel.active { display: block; }
.attestation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.attestation-card,.register-panel { border: 1px solid #273349; border-radius: 13px; background: linear-gradient(145deg, rgba(31,42,64,.95), rgba(12,18,31,.97)); box-shadow: 1px 1px 0 rgba(255,255,255,.06) inset, 0 14px 30px rgba(0,0,0,.28); }
.attestation-card { padding: 20px; }.att-card-top { display: flex; gap: 8px; }.attestation-card h2 { margin: 17px 0 8px; font: 700 17px/1.35 "Segoe UI"; }.att-meta { color: #75839a; font-size: 10px; letter-spacing: 1px; }.attestation-card blockquote { margin: 14px 0 0; color: #9caabd; font: italic 12px/1.5 "Segoe UI"; }
.status-pill { display: inline-flex; padding: 5px 9px; border: 1px solid; border-radius: 20px; font: 800 10px "Segoe UI"; }.status-pill.warning { color: #f6c955; border-color: #715b20; background: #28220f; }.status-pill.danger { color: #ff737c; border-color: #6d2e36; background: #2c1015; }.status-pill.success { color: #49dfa4; border-color: #226347; background: #0d2b20; }.status-pill.neutral { color: #a5b4ca; border-color: #39465a; background: #1a2332; }
.att-card-actions { display: flex; align-items: center; gap: 16px; margin-top: 20px; padding-top: 16px; border-top: 1px solid #273247; }.att-card-actions .blue-btn { font-size: 12px; padding: 9px 13px; }.att-card-actions a { color: #67b6ff; font: 700 12px "Segoe UI"; text-decoration: none; }.att-card-actions span { color: #8290a4; font: 12px "Segoe UI"; }
.att-empty { padding: 70px 24px; border: 1px dashed #334059; border-radius: 14px; color: #7e8da2; text-align: center; background: rgba(12,19,32,.68); }.att-empty>span { display: grid; place-items: center; width: 52px; height: 52px; margin: auto; border-radius: 50%; color: #45d7a0; background: #0c2b20; font-size: 25px; }.att-empty h2 { margin: 16px 0 6px; color: #e2e8f2; font: 700 18px "Segoe UI"; }.att-empty p { margin: 0; font: 13px "Segoe UI"; }.att-empty.compact { padding: 38px 20px; }
.register-tools { display: grid; grid-template-columns: 1fr 210px; gap: 12px; margin-bottom: 14px; }.register-tools input,.register-tools select,.att-dialog textarea { border: 1px solid #32415b; border-radius: 8px; background: #111a29; color: #e8eef7; padding: 11px 13px; font: 13px "Segoe UI"; outline: none; }.register-panel { padding: 8px 20px; }.register-row { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 14px 2px; border-bottom: 1px solid #263145; }.register-row:last-child { border: 0; }.register-row>div:first-child strong,.register-row>div:first-child span { display: block; }.register-row strong { font: 600 13px "Segoe UI"; }.register-row span { margin-top: 4px; color: #74839a; font: 10px "Segoe UI"; }.register-row>div:last-child { display: flex; align-items: center; gap: 14px; }
.att-dialog[hidden] { display: none; }.att-dialog { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 22px; }.att-dialog-backdrop { position: absolute; inset: 0; background: rgba(3,7,14,.8); backdrop-filter: blur(7px); }.att-dialog-card { position: relative; z-index: 1; width: min(570px,100%); padding: 28px; border: 1px solid #4a6b94; border-radius: 16px; background: linear-gradient(145deg,#263958,#0d1628 72%); box-shadow: 1px 1px 0 rgba(255,255,255,.12) inset, 0 28px 80px rgba(0,0,0,.68); }.att-dialog-card h2 { margin: 8px 0; font: 700 25px "Segoe UI"; }.att-dialog-card>p { color: #a7b4c8; font: 13px/1.6 "Segoe UI"; }.dialog-document { color: #68b8ff!important; font-weight: 700!important; }.att-dialog textarea { width: 100%; resize: vertical; }.dialog-close { position: absolute; top: 14px; right: 16px; border: 0; background: transparent; color: #aab7ca; font-size: 25px; cursor: pointer; }.dialog-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 18px; }.outline-btn,.decision-btn { padding: 10px 15px; border-radius: 8px; font: 700 12px "Segoe UI"; cursor: pointer; }.outline-btn { border: 1px solid #48566b; background: #172131; color: #b8c3d2; }.decision-btn.decline { border: 1px solid #8b343e; background: #2b1116; color: #ff747c; }.decision-btn.acknowledge { border: 1px solid #64b4ff; background: linear-gradient(180deg,#5caeff,#2875d8); color: white; box-shadow: 0 6px 0 #174b91,0 10px 18px rgba(32,105,207,.35); }#dialogMessage { min-height: 18px; margin-top: 12px; color: #ff7982; font: 12px "Segoe UI"; }
@media(max-width:960px){.attestation-stats{grid-template-columns:1fr}.attestation-grid{grid-template-columns:1fr}}@media(max-width:650px){.register-tools{grid-template-columns:1fr}.register-row{align-items:flex-start;flex-direction:column}.dialog-actions{flex-wrap:wrap}}

/* Policy library, policy detail and training modules. */
.module-page{padding-bottom:70px}.module-header{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:26px}.module-header h1{margin:8px 0 5px;font:700 34px "Segoe UI"}.module-header p{max-width:820px;margin:0;color:#a9b7cc;font:15px/1.55 "Segoe UI"}.header-buttons{display:flex;flex-wrap:wrap;gap:9px}.filter-bar{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:11px;margin-bottom:20px}.filter-bar input,.filter-bar select,.form-grid input,.form-grid select,.form-grid textarea{width:100%;border:1px solid #32415b;border-radius:8px;background:#111a29;color:#e8eef7;padding:11px 13px;font:13px "Segoe UI";outline:none}.module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.module-card,.detail-panel{padding:20px;border:1px solid #29364c;border-radius:14px;background:linear-gradient(145deg,rgba(35,47,72,.96),rgba(12,19,33,.98));box-shadow:1px 1px 0 rgba(255,255,255,.07) inset,-4px -5px 14px rgba(0,0,0,.22) inset,0 16px 32px rgba(0,0,0,.28)}.card-pills{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}.module-title,.module-card h2{display:block;margin:0;color:#edf4ff;text-decoration:none;font:700 17px/1.4 "Segoe UI"}.module-card p{color:#93a1b5;font:13px/1.55 "Segoe UI"}.card-facts{display:flex;flex-wrap:wrap;gap:12px;color:#78879c;font:11px "Segoe UI"}.progress-label{display:flex;justify-content:space-between;margin:16px 0 6px;color:#74839a;font:800 9px "Segoe UI"}.progress{height:7px;overflow:hidden;border-radius:7px;background:#101722;box-shadow:0 2px 4px rgba(0,0,0,.45) inset}.progress i{display:block;height:100%;border-radius:7px;background:linear-gradient(90deg,#2c83ea,#62b8ff);box-shadow:0 0 12px rgba(73,159,255,.45)}.card-actions{display:flex;align-items:center;gap:12px;margin-top:18px;padding-top:15px;border-top:1px solid #293448}.card-actions a,.card-actions button:not(.remove){color:#66b6ff;background:transparent;border:0;text-decoration:none;font:700 12px "Segoe UI";cursor:pointer}.result-count,.back-link{color:#75859c;font:12px "Segoe UI"}.back-link{display:inline-block;margin-bottom:22px;text-decoration:none}.detail-grid{display:grid;grid-template-columns:.9fr 1.25fr;gap:18px;margin-top:20px}.detail-panel h2{font:700 19px "Segoe UI"}.detail-row{display:flex;justify-content:space-between;gap:20px;padding:11px 0;border-bottom:1px solid #293448}.detail-row span{color:#74839a;font:800 9px "Segoe UI";letter-spacing:1px}.detail-row strong{text-align:right;font:600 13px "Segoe UI"}.att-dialog-card.wide{width:min(760px,100%)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-grid label{color:#9aa8bb;font:700 11px "Segoe UI"}.form-grid label input,.form-grid label select,.form-grid label textarea{display:block;margin-top:6px}.form-grid textarea{min-height:85px;resize:vertical}.span-2{grid-column:span 2}.check-label{display:flex;align-items:center;gap:9px}.check-label input{width:auto!important;margin:0!important}.outline-btn{display:inline-flex;align-items:center;text-decoration:none}.remove-training{border:1px solid #8d303a!important;border-radius:7px!important;background:#2b1015!important;color:#ff747c!important;padding:8px 11px!important}.module-card[hidden]{display:none}@media(max-width:1050px){.filter-bar{grid-template-columns:1fr 1fr}.detail-grid{grid-template-columns:1fr}}@media(max-width:800px){.module-grid{grid-template-columns:1fr}.module-header{flex-direction:column}.attestation-stats{grid-template-columns:1fr}}@media(max-width:580px){.filter-bar,.form-grid{grid-template-columns:1fr}.span-2{grid-column:auto}}
