/* ============ AWS Console recreation — base tokens, reset, typography ============ */
:root{
  --nav-bg:#232f3e; --nav-bg-2:#1c2634; --nav-hover:rgba(255,255,255,.09); --nav-border:rgba(255,255,255,.14);
  --rail-bg:#1a242f;
  --content-bg:#f2f3f3; --card:#ffffff;
  --border:#d5dbdb; --border-strong:#8d99a8; --hairline:#eaeded;
  --text:#16191f; --text-2:#5f6b7a; --text-3:#879199;
  --link:#0972d3; --link-hover:#0659a8;
  --blue:#0972d3; --blue-hover:#0870d1; --blue-active:#055fa8; --blue-dark:#0073bb;
  --orange:#ff9900;
  --green:#037f0c; --green-text:#1d8102; --red:#d91515; --warning:#8d6605; --info-blue:#0073bb;
  --row-hover:#f0f6ff; --sel-indicator:#0972d3;
  --focus-ring:#0073bb;
  --shadow-modal:0 6px 14px rgba(0,10,20,.18),0 0 3px rgba(0,10,20,.12);
  --shadow-pop:0 4px 12px rgba(0,10,20,.25),0 0 2px rgba(0,10,20,.16);
  --radius-card:8px; --radius-input:6px;
  --mono:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,"Courier New",monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:"Amazon Ember",-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;
  font-size:14px;color:var(--text);background:var(--content-bg);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;line-height:1.45;
}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#aab7c4;border-radius:8px;border:3px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background-color:#8d99a8;background-clip:padding-box;border:2px solid transparent}
.dark-scroll::-webkit-scrollbar-thumb{background:#4a586f;border:3px solid transparent;background-clip:padding-box}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline;color:var(--link-hover)}
button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:none;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:2px}
.hide-narrow{display:inline-flex}
img,svg{display:block}

h1.aws-h1{font-size:19px;font-weight:700;color:#16191f;letter-spacing:.2px}
h2.aws-h2{font-size:16px;font-weight:700}
.h-group-desc{color:var(--text-2);font-size:13px;margin-top:2px}
.hr{border:0;border-top:1px solid var(--hairline);margin:14px 0}
.text-subtle{color:var(--text-2)}
.small{font-size:12.5px}
.mono{font-family:var(--mono);font-size:12.5px}
.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flex{display:flex;align-items:center}.flex-col{display:flex;flex-direction:column}
.gap6{gap:6px}.gap8{gap:8px}.gap12{gap:12px}.gap16{gap:16px}
.mt4{margin-top:4px}.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}.mt24{margin-top:24px}
.mb8{margin-bottom:8px}.mb12{margin-bottom:12px}.mb16{margin-bottom:16px}
.right{margin-left:auto}
.nowrap{white-space:nowrap}

/* spinner */
.spinner{width:22px;height:22px;border-radius:50%;border:2.5px solid #bfe0f7;border-top-color:var(--blue);animation:spin .8s linear infinite;display:inline-block;vertical-align:-5px;margin-right:8px}
.spinner.sm{width:14px;height:14px;border-width:2px;margin-right:5px;vertical-align:-2.5px}
.spinner.on-dark{border-color:#40536b;border-top-color:#d5e8fa}
@keyframes spin{to{transform:rotate(360deg)}}

/* status colors shared */
.st-green{color:var(--green-text)} .st-red{color:var(--red)} .st-grey{color:var(--text-2)}
.st-blue{color:var(--info-blue)} .st-orange{color:#c46a04}
/* utility container widths */
.pad-page{padding:20px 24px 48px}
@media(max-width:900px){.pad-page{padding:16px}}
@media(max-width:600px){.pad-page{padding:12px}}