* { box-sizing: border-box; } html,body { margin:0; } h1,h2,h3,p { margin-top:0; } a { color:inherit; text-decoration:none; } button,input,textarea { font:inherit; } button { cursor:pointer; } img { max-width:100%; } 
body {
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
}

html { scroll-behavior: smooth; }
* { box-sizing: border-box; }
a, button { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #31b8ae; outline-offset: 3px; }

.site-shell { background: #f6f8f8; color: #102b35; min-height: 100vh; }
.site-header { height: 78px; border-bottom: 1px solid #dce7e8; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 max(5vw, 24px); background: #fff; }
.brand { display: flex; align-items: center; gap: 11px; color: #112d37; font-weight: 800; font-size: 19px; letter-spacing: .045em; white-space: nowrap; }
.brand-mark { width: 35px; height: 35px; display: grid; place-items: center; background: #102b35; color: #54d8c8; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); font-size: 17px; }
.brand-suffix { color: #75898c; font-size: 10px; letter-spacing: .17em; font-weight: 700; margin-left: 3px; }
.site-nav { display: flex; align-items: center; gap: clamp(18px, 3vw, 45px); font-size: 14px; font-weight: 600; }
.site-nav a:hover, .manage-link:hover, .text-action:hover { color: #008f83; }
.manage-link { display: flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.intro-section { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .93fr); min-height: 460px; background: #0d2731; color: #fff; overflow: hidden; }
.intro-copy { padding: clamp(58px, 7vw, 104px) 24px clamp(60px, 7vw, 90px) max(5vw, 24px); max-width: 700px; }
.eyebrow { display: flex; align-items: center; gap: 13px; color: #70d9cd; font-size: 12px; font-weight: 800; letter-spacing: .18em; }
.eyebrow-line { width: 24px; height: 2px; background: #71e0d0; }
.intro-copy h1 { font-size: clamp(48px, 6vw, 88px); line-height: 1.05; letter-spacing: -.045em; font-weight: 800; margin: 22px 0 24px; }
.intro-copy h1 span { color: #65d9c7; }
.intro-copy p { color: #bad0d1; font-size: 17px; line-height: 1.8; max-width: 540px; }
.intro-actions { display: flex; align-items: center; gap: 28px; margin-top: 32px; }
.primary-action { display: inline-flex; align-items: center; gap: 28px; background: #5bd6c4; color: #073039; padding: 15px 20px; font-weight: 800; border-radius: 4px; }
.primary-action:hover { background: #83e5d7; }
.text-action { display: inline-flex; align-items: center; gap: 8px; color: #e9f4f3; font-size: 15px; font-weight: 700; }
.intro-graphic { position: relative; min-height: 460px; background: radial-gradient(circle at 65% 47%, #2a6267 0, #163e47 27%, #0a2530 68%); border-left: 1px solid #31535a; overflow: hidden; }
.intro-graphic::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(#ffffff13 1px, transparent 1px), linear-gradient(90deg, #ffffff13 1px, transparent 1px); background-size: 38px 38px; mask-image: linear-gradient(90deg, transparent, black); }
.graphic-label, .graphic-caption { position: absolute; color: #96bfc1; font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.graphic-label { top: 34px; right: 35px; }.graphic-caption { left: 36px; bottom: 32px; }
.graphic-grid { position: absolute; width: min(65%, 400px); aspect-ratio: 1; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-17deg); border: 2px solid #6edecb; border-radius: 50%; box-shadow: 0 0 0 33px #5bd6c40b, 0 0 0 67px #5bd6c408, inset 0 0 80px #6edecb12; }
.graphic-grid::before, .graphic-grid::after { content: ""; position: absolute; left: 50%; top: -1px; height: 100%; width: 1px; background: #72d9ca9c; transform-origin: center; }
.graphic-grid::before { transform: rotate(60deg); }.graphic-grid::after { transform: rotate(-60deg); }
.graphic-node { width: 12px; height: 12px; border-radius: 50%; background: #ffb45d; box-shadow: 0 0 0 6px #ffb45d25; position: absolute; z-index: 2; }.n1 { left: 13%; top: 15%; }.n2 { right: -6px; top: 48%; }.n3 { left: 49%; bottom: -6px; }.n4 { left: -5px; top: 53%; }.n5 { left: 56%; top: 18%; background: #6be2d2; box-shadow: 0 0 0 6px #6be2d225; }
.status-banner { max-width: 1200px; margin: 22px auto 0; padding: 14px 20px; background: #fff1db; border: 1px solid #edc982; color: #6a4610; border-radius: 6px; }
.content-section { max-width: 1200px; margin: 0 auto; padding: 68px 24px 0; scroll-margin-top: 20px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }.section-number { display: block; color: #0c9a8d; font-size: 12px; font-weight: 800; letter-spacing: .16em; margin-bottom: 10px; }.section-heading h2 { font-size: clamp(29px, 3vw, 38px); font-weight: 800; letter-spacing: -.035em; }.section-heading p { color: #718589; font-size: 14px; }
.download-card { display: flex; align-items: center; gap: 22px; background: #fff; border: 1px solid #dce7e8; box-shadow: 0 16px 35px #132e3609; border-radius: 9px; padding: 28px 30px; }
.download-icon { flex: none; width: 62px; height: 62px; display: grid; place-items: center; background: #e3f5f2; border-radius: 8px; color: #0c796f; }.download-main { flex: 1; min-width: 0; }.download-topline { display: flex; align-items: center; gap: 12px; }.download-topline strong { font-size: 22px; }.download-main p { color: #657c80; margin-top: 6px; line-height: 1.6; font-size: 14px; overflow-wrap: anywhere; }.pill { color: #6b7e81; background: #edf1f1; padding: 4px 9px; border-radius: 3px; font-size: 12px; font-weight: 800; white-space: nowrap; }.pill-live { color: #007d6e; background: #dff8f0; }.download-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; background: #102f38; color: #fff; padding: 15px 20px; font-size: 14px; font-weight: 800; border-radius: 5px; white-space: nowrap; }.download-button:hover { background: #146c6b; }.download-button.disabled { background: #edf1f1; color: #91a1a3; cursor: not-allowed; }
.updates-section { padding-top: 70px; }.update-entry { display: grid; grid-template-columns: 180px 1fr auto; gap: 28px; padding: 28px 30px; border: 1px solid #dce7e8; background: #fff; border-radius: 9px; }.update-date { color: #57727a; font-weight: 700; display: flex; align-items: start; gap: 8px; padding-top: 5px; font-size: 14px; }.update-title { font-size: 19px; font-weight: 800; margin-bottom: 8px; }.update-entry p { color: #586f73; line-height: 1.75; white-space: pre-wrap; }.update-tag { align-self: start; color: #087d73; background: #e4f8f1; padding: 6px 10px; border-radius: 3px; font-size: 12px; font-weight: 800; }.empty-panel { min-height: 170px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; background: #fff; border: 1px dashed #c7d7d9; color: #688084; text-align: center; border-radius: 9px; padding: 25px; }.empty-panel strong { color: #29434b; font-size: 17px; }.empty-panel span { font-size: 14px; }
.cases-section { padding-bottom: 92px; }.upload-button { height: 44px; padding: 0 18px; background: #116e70; color: #fff; font-size: 14px; }.upload-button:hover { background: #0d575b; }.case-empty { min-height: 250px; }.cases-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }.case-card { background: #fff; border: 1px solid #dce7e8; border-radius: 9px; overflow: hidden; }.case-image { background: #d6e6e7; aspect-ratio: 16 / 10; }.case-image img { width: 100%; height: 100%; object-fit: cover; }.case-card-body { padding: 20px; }.case-card-body > span { color: #789093; font-size: 12px; font-weight: 700; }.case-card-body h3 { font-size: 18px; font-weight: 800; margin: 8px 0; }.case-card-body p { color: #61777b; line-height: 1.7; font-size: 14px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }.case-card-body a { display: inline-flex; align-items: center; gap: 4px; color: #087f74; font-size: 14px; font-weight: 800; margin-top: 16px; }
.case-dialog { color: #102b35; background: #fff; max-height: min(90vh, 800px); overflow: auto; }.case-dialog [data-slot="dialog-title"] { font-size: 21px; }.upload-form { display: grid; gap: 14px; }.upload-form label { display: grid; gap: 7px; font-size: 14px; font-weight: 700; }.upload-form label span { color: #718488; font-size: 12px; font-weight: 400; }.upload-form input, .upload-form textarea { background: #fff; }.submit-button { height: 42px; margin-top: 3px; }.form-message { background: #e5f7f0; color: #116258; padding: 10px 12px; border-radius: 5px; font-size: 14px; line-height: 1.5; }
.site-footer { border-top: 1px solid #dce7e8; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 24px max(5vw, 24px); font-size: 12px; color: #7a8d90; font-weight: 700; letter-spacing: .05em; }.site-footer a:hover { color: #0d7f76; }
@media (max-width: 850px) { .site-nav { display: none; }.intro-section { grid-template-columns: 1fr; }.intro-graphic { display: none; }.intro-copy { padding: 66px 24px; }.cases-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 610px) { .site-header { height: 68px; }.brand-suffix { display: none; }.intro-copy h1 { font-size: 54px; }.intro-copy p { font-size: 16px; }.content-section { padding: 55px 18px 0; }.section-heading { align-items: start; }.section-heading p { display: none; }.download-card { align-items: flex-start; flex-wrap: wrap; padding: 22px; }.download-icon { width: 48px; height: 48px; }.download-main { flex-basis: calc(100% - 72px); }.download-topline strong { font-size: 18px; }.download-button { width: 100%; }.update-entry { grid-template-columns: 1fr; gap: 12px; padding: 22px; }.update-tag { justify-self: start; }.cases-grid { grid-template-columns: 1fr; }.cases-section { padding-bottom: 65px; }.site-footer span:nth-child(2) { display: none; } }

.manage-shell { min-height: 100vh; background: #f4f7f7; color: #102b35; }.manage-header { height: 72px; padding: 0 max(5vw, 24px); background: #fff; border-bottom: 1px solid #dce7e8; display: flex; align-items: center; justify-content: space-between; }.manage-back { display: inline-flex; align-items: center; gap: 8px; color: #39565d; font-size: 14px; font-weight: 700; }.manage-back:hover { color: #087f74; }.manage-main { max-width: 1200px; margin: 0 auto; padding: 57px 24px 90px; }.manage-title h1 { font-size: clamp(32px, 4vw, 46px); font-weight: 800; letter-spacing: -.04em; }.manage-title p { margin-top: 8px; color: #6e8488; font-size: 16px; }.manage-message { margin-top: 22px; padding: 13px 16px; border: 1px solid #ace3d5; border-radius: 6px; background: #e7f8f2; color: #0a6e61; font-size: 14px; }.manage-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; margin-top: 32px; }.manage-panel { background: #fff; border: 1px solid #dce7e8; border-radius: 9px; padding: 27px; margin-top: 30px; }.manage-grid .manage-panel { margin-top: 0; }.manage-panel h2 { font-size: 20px; font-weight: 800; }.manage-panel p { color: #72888b; margin-top: 6px; line-height: 1.6; }.manage-panel > button { margin-top: 20px; }.manage-panel-title { display: flex; align-items: start; gap: 13px; padding-bottom: 22px; border-bottom: 1px solid #e8eeee; }.manage-panel-icon { width: 40px; height: 40px; display: grid; place-items: center; color: #0b8175; background: #e3f6f0; border-radius: 7px; flex: none; }.manage-form { display: grid; gap: 19px; margin-top: 22px; }.manage-form label { display: grid; gap: 7px; font-size: 14px; font-weight: 700; }.manage-form label span { color: #839699; font-size: 12px; font-weight: 400; }.manage-form input, .manage-form textarea { background: #fff; }.manage-submit { width: fit-content; min-width: 120px; height: 42px; }.pending-list { margin-top: 9px; }.pending-item { display: flex; align-items: start; gap: 14px; padding: 18px 0; border-bottom: 1px solid #e8eeee; }.pending-item:last-child { border-bottom: 0; }.pending-item img { width: 98px; height: 76px; object-fit: cover; background: #e5eeee; border-radius: 5px; flex: none; }.pending-copy { min-width: 0; }.pending-copy h3 { font-weight: 800; font-size: 16px; }.pending-copy p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; color: #647c80; font-size: 13px; }.pending-copy a { display: inline-flex; align-items: center; gap: 3px; margin-top: 9px; color: #0d7c72; font-size: 13px; font-weight: 700; }.pending-actions { display: flex; gap: 8px; margin-top: 13px; }
@media (max-width: 800px) { .manage-grid { grid-template-columns: 1fr; } }
@media (max-width: 610px) { .manage-main { padding: 46px 18px 68px; }.manage-panel { padding: 21px; } }

button { border: 0; }
.download-icon { font-size: 34px; font-weight: 300; }
.upload-button,.submit-button,.manage-submit,.pending-actions button { background:#116e70; color:#fff; border-radius:5px; font-weight:700; padding:11px 17px; }
.upload-button:hover,.submit-button:hover,.manage-submit:hover,.pending-actions button:hover { background:#0a5c60; }
button:disabled { opacity:.65; cursor:wait; }
.case-dialog { width:min(92vw,520px); border:1px solid #dce7e8; border-radius:10px; box-shadow:0 24px 90px #001a2270; padding:30px; }
.case-dialog::backdrop { background:#061d25a8; }
.case-dialog h2 { font-size:23px; margin-bottom:6px; }
.case-dialog > p { color:#718488; line-height:1.6; font-size:14px; margin-bottom:18px; }
.dialog-close { float:right; margin:-14px -12px 8px 8px; }
.dialog-close button { color:#536b71; background:transparent; font-size:28px; width:36px; height:36px; }
.upload-form input,.upload-form textarea,.manage-form input,.manage-form textarea { display:block; width:100%; border:1px solid #cbd9d9; border-radius:5px; padding:10px 11px; color:#102b35; }
.upload-form input[type=file],.manage-form input[type=file] { padding:8px; }
.upload-form textarea,.manage-form textarea { resize:vertical; }
.form-message:empty,.manage-message:empty { display:none; }
.form-message { margin:0; }
.login-panel { max-width:420px; }
.manage-header-actions { display:flex; align-items:center; gap:20px; }
.manage-header-actions button { background:transparent; }
.pending-actions button:nth-child(2) { background:#fff; color:#39565d; border:1px solid #cbd9d9; }
.pending-actions button:nth-child(2):hover { background:#f0f7f7; }
.manage-panel-icon { font-size:22px; font-weight:700; }
@media (max-width:610px) { .case-dialog { padding:22px; }.manage-header-actions { gap:9px; } }

