.siah-sp {
  --siah-navy: #082f49;
  --siah-blue: #0b5ea8;
  --siah-sky: #dff2ff;
  --siah-teal: #0f766e;
  --siah-gold: #f2b84b;
  --siah-ink: #122033;
  --siah-muted: #5f6f82;
  --siah-line: #dbe5ef;
  box-sizing: border-box;
  width: min(1180px, calc(100% - 28px));
  margin: 34px auto;
  color: var(--siah-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.siah-sp *, .siah-sp *::before, .siah-sp *::after { box-sizing: inherit; }
.siah-sp a { text-decoration: none; }

.siah-sp__login {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
  min-height: 650px;
  overflow: hidden;
  border: 1px solid rgba(8, 47, 73, .12);
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 26px 70px rgba(8, 47, 73, .16);
}

.siah-sp__login-copy {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(38px, 7vw, 84px);
  overflow: hidden;
  color: white;
  background:
    radial-gradient(circle at 86% 16%, rgba(242, 184, 75, .28) 0 7%, transparent 28%),
    radial-gradient(circle at 15% 84%, rgba(71, 186, 210, .27) 0 8%, transparent 36%),
    linear-gradient(145deg, #06263d 0%, #0b5ea8 64%, #0f766e 115%);
}

.siah-sp__login-copy::after {
  content: "SIAH";
  position: absolute;
  right: -34px;
  bottom: -48px;
  font-size: clamp(110px, 20vw, 260px);
  font-weight: 900;
  line-height: .8;
  letter-spacing: -.08em;
  color: rgba(255, 255, 255, .045);
}

.siah-sp__eyebrow {
  display: block;
  margin-bottom: 10px;
  color: #c9efff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .16em;
}

.siah-sp__login-copy h1 { margin: 0 0 18px; color: white; font-size: clamp(42px, 6vw, 76px); line-height: .98; letter-spacing: -.045em; }
.siah-sp__login-copy p { max-width: 590px; margin: 0 0 30px; color: rgba(255,255,255,.84); font-size: clamp(17px, 2vw, 21px); line-height: 1.65; }
.siah-sp__login-copy ul { position: relative; z-index: 1; display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; }
.siah-sp__login-copy li { display: flex; gap: 11px; align-items: center; color: rgba(255,255,255,.9); }
.siah-sp__login-copy li::before { content: "✓"; display: grid; width: 24px; height: 24px; place-items: center; border-radius: 50%; background: rgba(255,255,255,.13); color: #ffe7a8; font-weight: 900; }

.siah-sp__login-card { align-self: center; padding: clamp(34px, 6vw, 70px); }
.siah-sp__brand { display: grid; width: 58px; height: 58px; margin-bottom: 26px; place-items: center; border-radius: 18px; background: linear-gradient(145deg, var(--siah-blue), var(--siah-teal)); box-shadow: 0 12px 30px rgba(11,94,168,.25); color: white; font-size: 29px; font-weight: 900; }
.siah-sp__login-card h2 { margin: 0 0 8px; color: var(--siah-navy); font-size: 31px; letter-spacing: -.025em; }
.siah-sp__muted { margin: 0 0 26px; color: var(--siah-muted); line-height: 1.55; }
.siah-sp__login-alert { margin: 0 0 18px; padding: 12px 14px; border: 1px solid #efb6b6; border-radius: 10px; background: #fff1f1; color: #8e2424; font-size: 14px; line-height: 1.45; }
.siah-sp__login-card form p { margin: 0 0 18px; }
.siah-sp__login-card label { display: block; margin-bottom: 7px; color: #32465a; font-size: 14px; font-weight: 750; }
.siah-sp__login-card input[type="text"], .siah-sp__login-card input[type="password"] { width: 100%; min-height: 50px; padding: 11px 14px; border: 1px solid #cbd8e5; border-radius: 11px; background: #fbfdff; color: var(--siah-ink); font: inherit; transition: border-color .18s, box-shadow .18s; }
.siah-sp__login-card input:focus { outline: 0; border-color: var(--siah-blue); box-shadow: 0 0 0 4px rgba(11,94,168,.12); }
.siah-sp__login-card .login-remember label { display: flex; gap: 8px; align-items: flex-start; font-weight: 600; }
.siah-sp__login-card .button-primary { width: 100%; min-height: 50px; border: 0; border-radius: 11px; background: linear-gradient(135deg, var(--siah-blue), #087c8c); color: white; font: inherit; font-weight: 800; cursor: pointer; box-shadow: 0 12px 22px rgba(11,94,168,.18); }
.siah-sp__login-links { display: flex; justify-content: space-between; gap: 16px; margin-top: 18px; font-size: 14px; }
.siah-sp__login-links a { color: var(--siah-blue); font-weight: 700; }
.siah-sp__privacy-note { margin: 28px 0 0; padding-top: 20px; border-top: 1px solid var(--siah-line); color: var(--siah-muted); font-size: 12px; line-height: 1.55; }

.siah-sp__header {
  display: flex;
  justify-content: space-between;
  gap: 28px;
  align-items: center;
  margin-bottom: 24px;
  padding: clamp(28px, 5vw, 50px);
  border-radius: 24px;
  color: white;
  background: radial-gradient(circle at 85% 5%, rgba(242,184,75,.32), transparent 23%), linear-gradient(135deg, #06263d, #0b5ea8 68%, #0f766e);
  box-shadow: 0 20px 48px rgba(8,47,73,.17);
}

.siah-sp__header h1 { margin: 0 0 8px; color: white; font-size: clamp(30px, 4vw, 48px); letter-spacing: -.04em; }
.siah-sp__header p { margin: 0; color: rgba(255,255,255,.8); }
.siah-sp__account { display: grid; grid-template-columns: auto minmax(120px, 1fr); gap: 4px 11px; align-items: center; min-width: 270px; padding: 14px; border: 1px solid rgba(255,255,255,.18); border-radius: 16px; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); }
.siah-sp__avatar { grid-row: 1 / 3; display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; background: white; color: var(--siah-blue); font-weight: 900; }
.siah-sp__account strong, .siah-sp__account small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.siah-sp__account small { color: rgba(255,255,255,.7); }
.siah-sp__account a { grid-column: 1 / 3; margin-top: 7px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.14); color: #ffe7a8; font-size: 13px; font-weight: 800; text-align: right; }

.siah-sp__intro { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin: 34px 0 18px; }
.siah-sp__intro h2 { margin: 0 0 4px; color: var(--siah-navy); font-size: 27px; }
.siah-sp__intro p { margin: 0; color: var(--siah-muted); }
.siah-sp__secure { padding: 8px 12px; border-radius: 999px; background: #e6f7f3; color: var(--siah-teal); font-size: 12px; font-weight: 800; }
.siah-sp__secure::before { content: "●"; margin-right: 7px; color: #20a77a; }
.siah-sp__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.siah-sp__module { position: relative; min-height: 248px; padding: 25px; overflow: hidden; border: 1px solid var(--siah-line); border-radius: 19px; background: white; box-shadow: 0 8px 24px rgba(18,32,51,.06); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.siah-sp__module:hover, .siah-sp__module:focus-visible { transform: translateY(-3px); border-color: #9fc8e8; box-shadow: 0 17px 34px rgba(8,47,73,.12); outline: none; }
.siah-sp__module::after { content: ""; position: absolute; right: -45px; bottom: -45px; width: 120px; height: 120px; border-radius: 50%; background: var(--siah-sky); opacity: .55; }
.siah-sp__module-icon, .siah-sp__module-page-icon { display: grid; width: 50px; height: 50px; place-items: center; border-radius: 15px; background: linear-gradient(145deg, #e4f4ff, #e8f8f4); color: var(--siah-blue); }
.siah-sp__icon { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.siah-sp__module-state { position: absolute; top: 26px; right: 23px; padding: 5px 8px; border-radius: 999px; font-size: 10px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.siah-sp__module-state--connected { background: #e6f7f3; color: var(--siah-teal); }
.siah-sp__module-state--foundation { background: #fff4d9; color: #8a5a00; }
.siah-sp__module h3 { margin: 20px 0 8px; color: var(--siah-navy); font-size: 21px; }
.siah-sp__module p { min-height: 64px; margin: 0 0 18px; color: var(--siah-muted); font-size: 14px; line-height: 1.55; }
.siah-sp__module-link { position: relative; z-index: 1; color: var(--siah-blue); font-size: 14px; font-weight: 800; }

.siah-sp__back { margin: 30px 0 16px; }
.siah-sp__back a { color: var(--siah-blue); font-weight: 800; }
.siah-sp__module-page, .siah-sp__notice { max-width: 860px; margin: 0 auto; padding: clamp(28px, 6vw, 58px); border: 1px solid var(--siah-line); border-radius: 22px; background: white; box-shadow: 0 16px 42px rgba(8,47,73,.09); }
.siah-sp__module-page .siah-sp__eyebrow { margin-top: 22px; color: var(--siah-blue); }
.siah-sp__module-page h2, .siah-sp__notice h1, .siah-sp__notice h2 { margin: 0 0 12px; color: var(--siah-navy); }
.siah-sp__module-page > p, .siah-sp__notice p { color: var(--siah-muted); line-height: 1.65; }
.siah-sp__readiness { margin-top: 28px; padding: 20px; border-left: 4px solid var(--siah-gold); border-radius: 4px 13px 13px 4px; background: #fffaf0; }
.siah-sp__readiness strong { color: #6e4900; }
.siah-sp__readiness p { margin: 7px 0 0; color: #725f3d; line-height: 1.6; }
.siah-sp__scope { margin-top: 22px; padding: 20px; border-radius: 13px; background: #f3f8fc; }
.siah-sp__scope h3 { margin: 0 0 12px; color: var(--siah-navy); }
.siah-sp__scope ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.siah-sp__button { display: inline-block; padding: 11px 17px; border-radius: 10px; background: var(--siah-blue); color: white; font-weight: 800; }
.siah-sp__footer { display: flex; justify-content: space-between; gap: 20px; margin-top: 24px; padding: 18px 5px; border-top: 1px solid var(--siah-line); color: var(--siah-muted); font-size: 12px; }

.siah-sp__alert { margin: 0 0 18px; padding: 14px 17px; border: 1px solid; border-radius: 12px; font-weight: 700; }
.siah-sp__alert--success { border-color: #9bd9c8; background: #ecfaf5; color: #0d655e; }
.siah-sp__alert--error { border-color: #efb6b6; background: #fff1f1; color: #8e2424; }
.siah-sp__workspace { display: grid; gap: 20px; }
.siah-sp__workspace-header { display: flex; gap: 18px; align-items: flex-start; padding: 28px; border: 1px solid var(--siah-line); border-radius: 20px; background: linear-gradient(135deg, #f7fbff, #f0faf7); }
.siah-sp__workspace-header .siah-sp__eyebrow { margin: 2px 0 5px; color: var(--siah-blue); }
.siah-sp__workspace-header h2 { margin: 0 0 7px; color: var(--siah-navy); font-size: clamp(27px, 4vw, 38px); }
.siah-sp__workspace-header p { margin: 0; color: var(--siah-muted); }
.siah-sp__panel { padding: 24px; border: 1px solid var(--siah-line); border-radius: 17px; background: #fff; box-shadow: 0 7px 22px rgba(18,32,51,.045); }
.siah-sp__panel h3 { margin: 0 0 17px; color: var(--siah-navy); font-size: 21px; }
.siah-sp__panel-title { display: flex; justify-content: space-between; gap: 15px; align-items: center; margin-bottom: 16px; }
.siah-sp__panel-title h3 { margin: 0; }
.siah-sp__text-link { color: var(--siah-blue); font-weight: 800; }
.siah-sp__empty { padding: 24px; border: 1px dashed #b9cadb; border-radius: 13px; background: #f8fbfe; color: var(--siah-muted); }
.siah-sp__empty h3 { margin: 0 0 7px; color: var(--siah-navy); }
.siah-sp__empty p { margin: 0; }
.siah-sp__form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.siah-sp__form label, .siah-sp__filters label, .siah-sp__mini label { display: grid; gap: 7px; color: #32465a; font-size: 13px; font-weight: 750; }
.siah-sp__form input, .siah-sp__form select, .siah-sp__form textarea, .siah-sp__filters input, .siah-sp__decision input, .siah-sp__mini input, .siah-sp__mini select, .siah-sp__mini textarea { width: 100%; min-height: 43px; padding: 9px 11px; border: 1px solid #cbd8e5; border-radius: 9px; background: #fbfdff; color: var(--siah-ink); font: inherit; }
.siah-sp__form textarea, .siah-sp__mini textarea { resize: vertical; }
.siah-sp__form input:focus, .siah-sp__form select:focus, .siah-sp__form textarea:focus, .siah-sp__filters input:focus, .siah-sp__decision input:focus { outline: 0; border-color: var(--siah-blue); box-shadow: 0 0 0 3px rgba(11,94,168,.11); }
.siah-sp__form-wide { grid-column: 1 / -1; }
.siah-sp__disclosure > summary { cursor: pointer; color: var(--siah-navy); font-size: 18px; font-weight: 850; }
.siah-sp__disclosure[open] > summary { margin-bottom: 20px; }
.siah-sp__metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.siah-sp__metrics > div { display: grid; gap: 5px; padding: 19px; border: 1px solid var(--siah-line); border-radius: 15px; background: #fff; }
.siah-sp__metrics strong { color: var(--siah-navy); font-size: 25px; }
.siah-sp__metrics span { color: var(--siah-muted); font-size: 12px; font-weight: 750; }
.siah-sp__detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.siah-sp__detail { display: grid; gap: 6px; padding: 18px; border: 1px solid var(--siah-line); border-radius: 13px; background: #fff; }
.siah-sp__detail span { color: var(--siah-muted); font-size: 12px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.siah-sp__detail strong { color: var(--siah-navy); overflow-wrap: anywhere; }
.siah-sp__filters { display: flex; gap: 12px; align-items: end; margin-bottom: 18px; padding: 14px; border-radius: 12px; background: #f5f9fc; }
.siah-sp__filters button, .siah-sp__decision button, .siah-sp__mini button { min-height: 42px; padding: 9px 13px; border: 0; border-radius: 8px; background: var(--siah-blue); color: white; font-weight: 800; cursor: pointer; }
.siah-sp__decision { display: grid; gap: 7px; min-width: 185px; }
.siah-sp__decision .is-danger { background: #a93636; }
.siah-sp__table-wrap { width: 100%; overflow-x: auto; }
.siah-sp__table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 13px; }
.siah-sp__table th { padding: 11px 12px; border-bottom: 2px solid var(--siah-line); color: #405267; text-align: left; white-space: nowrap; }
.siah-sp__table td { padding: 13px 12px; border-bottom: 1px solid #e7eef5; vertical-align: top; color: #33475c; }
.siah-sp__table tbody tr:hover { background: #f8fbfe; }
.siah-sp__table small { color: var(--siah-muted); }
.siah-sp__badge { display: inline-flex; padding: 5px 8px; border-radius: 999px; background: #edf2f7; color: #405267; font-size: 10px; font-weight: 850; white-space: nowrap; text-transform: uppercase; letter-spacing: .035em; }
.siah-sp__badge--approved, .siah-sp__badge--present, .siah-sp__badge--remote { background: #e5f7ef; color: #0c6a4f; }
.siah-sp__badge--pending, .siah-sp__badge--late, .siah-sp__badge--partial { background: #fff3d7; color: #875800; }
.siah-sp__badge--rejected, .siah-sp__badge--absent { background: #ffeded; color: #992e2e; }
.siah-sp__badge--excused { background: #e8f1ff; color: #285d9b; }
.siah-sp__mini { min-width: 170px; }
.siah-sp__mini summary { cursor: pointer; color: var(--siah-blue); font-weight: 800; }
.siah-sp__mini form { display: grid; gap: 9px; margin-top: 10px; padding: 12px; border: 1px solid var(--siah-line); border-radius: 10px; background: #f9fcff; }

@media (max-width: 920px) {
  .siah-sp__login { grid-template-columns: 1fr; }
  .siah-sp__login-copy { min-height: 340px; }
  .siah-sp__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .siah-sp__header { align-items: flex-start; flex-direction: column; }
  .siah-sp__account { width: 100%; }
  .siah-sp__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
  .siah-sp { width: min(100% - 18px, 1180px); margin: 12px auto 24px; }
  .siah-sp__login { border-radius: 19px; }
  .siah-sp__login-copy, .siah-sp__login-card { padding: 30px 24px; }
  .siah-sp__login-copy h1 { font-size: 44px; }
  .siah-sp__login-links, .siah-sp__intro, .siah-sp__footer { align-items: flex-start; flex-direction: column; }
  .siah-sp__header { padding: 28px 23px; border-radius: 19px; }
  .siah-sp__grid { grid-template-columns: 1fr; }
  .siah-sp__module { min-height: 226px; }
  .siah-sp__workspace-header { padding: 22px; }
  .siah-sp__form, .siah-sp__detail-grid, .siah-sp__metrics { grid-template-columns: 1fr; }
  .siah-sp__filters, .siah-sp__panel-title { align-items: stretch; flex-direction: column; }
  .siah-sp__filters button { width: 100%; }
  .siah-sp__panel { padding: 19px; }
}

@media (prefers-reduced-motion: reduce) {
  .siah-sp__module, .siah-sp__login-card input { transition: none; }
}