/* HMB-360 V101 PLATFORM UI + RESPONSIVE DESIGN SYSTEM */
:root{
  --hmb-bg:#f6f8fb;--hmb-surface:#ffffff;--hmb-surface-2:#f8fafc;
  --hmb-text:#17324d;--hmb-muted:#60758a;--hmb-border:#dbe5ed;
  --hmb-blue:#1768ac;--hmb-teal:#0e7490;--hmb-orange:#f97316;
  --hmb-success:#087a55;--hmb-warning:#b45309;--hmb-danger:#b42318;
  --hmb-radius:10px;--hmb-shadow:0 1px 2px rgba(15,23,42,.05);
  --hmb-focus:0 0 0 3px rgba(23,104,172,.20);
  --hmb-space-1:4px;--hmb-space-2:8px;--hmb-space-3:12px;
  --hmb-space-4:16px;--hmb-space-5:20px;--hmb-space-6:24px;--hmb-space-8:32px
}
html{box-sizing:border-box;-webkit-text-size-adjust:100%}
*,*:before,*:after{box-sizing:inherit}
body[data-hmb-ui="v101"]{
  margin:0;background:var(--hmb-bg);color:var(--hmb-text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  line-height:1.45;text-rendering:optimizeLegibility
}
body[data-hmb-ui="v101"] main{max-width:100%;min-width:0}
body[data-hmb-ui="v101"] h1,body[data-hmb-ui="v101"] h2,body[data-hmb-ui="v101"] h3{
  color:var(--hmb-text);letter-spacing:-.015em
}
body[data-hmb-ui="v101"] h1{font-size:clamp(1.55rem,2vw,2rem);line-height:1.15}
body[data-hmb-ui="v101"] h2{font-size:clamp(1.15rem,1.5vw,1.4rem)}
body[data-hmb-ui="v101"] p{max-width:78ch}
body[data-hmb-ui="v101"] a{color:var(--hmb-blue);text-underline-offset:2px}
body[data-hmb-ui="v101"] a:hover{color:#0f578f}
body[data-hmb-ui="v101"] img,body[data-hmb-ui="v101"] svg{max-width:100%;height:auto}

/* content frames */
body[data-hmb-ui="v101"] .wrap,
body[data-hmb-ui="v101"] .w,
body[data-hmb-ui="v101"] .container,
body[data-hmb-ui="v101"] .workspace,
body[data-hmb-ui="v101"] .content,
body[data-hmb-ui="v101"] .page{
  min-width:0
}
body[data-hmb-ui="v101"] .panel,
body[data-hmb-ui="v101"] .card,
body[data-hmb-ui="v101"] .tile,
body[data-hmb-ui="v101"] .box,
body[data-hmb-ui="v101"] section.panel{
  background:var(--hmb-surface);border-color:var(--hmb-border);
  border-radius:var(--hmb-radius);box-shadow:var(--hmb-shadow)
}

/* controls */
body[data-hmb-ui="v101"] input:not([type="checkbox"]):not([type="radio"]),
body[data-hmb-ui="v101"] select,
body[data-hmb-ui="v101"] textarea{
  max-width:100%;min-height:40px;border:1px solid #c8d5df;border-radius:8px;
  background:#fff;color:var(--hmb-text);padding:9px 10px;font:inherit
}
body[data-hmb-ui="v101"] textarea{min-height:88px;resize:vertical}
body[data-hmb-ui="v101"] input::placeholder,
body[data-hmb-ui="v101"] textarea::placeholder{color:#8a9aaa}
body[data-hmb-ui="v101"] input:disabled,
body[data-hmb-ui="v101"] select:disabled,
body[data-hmb-ui="v101"] textarea:disabled{background:#f1f5f9;color:#718096;cursor:not-allowed}
body[data-hmb-ui="v101"] label{color:#314b63;font-weight:650}
body[data-hmb-ui="v101"] button,
body[data-hmb-ui="v101"] .btn,
body[data-hmb-ui="v101"] input[type="submit"]{
  min-height:40px;border-radius:8px;font:inherit;font-weight:750;cursor:pointer
}
body[data-hmb-ui="v101"] .btn:not(.secondary):not(.ghost):not(.danger),
body[data-hmb-ui="v101"] button.primary,
body[data-hmb-ui="v101"] input[type="submit"]{
  background:var(--hmb-orange);border-color:var(--hmb-orange);color:#fff
}
body[data-hmb-ui="v101"] .btn:hover,
body[data-hmb-ui="v101"] button:hover{filter:brightness(.98)}
body[data-hmb-ui="v101"] :where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid var(--hmb-blue);outline-offset:2px;box-shadow:var(--hmb-focus)
}

/* tables */
body[data-hmb-ui="v101"] table{border-collapse:collapse;max-width:100%}
body[data-hmb-ui="v101"] th{
  color:#38536a;background:var(--hmb-surface-2);font-size:.78rem;
  letter-spacing:.025em;text-transform:none
}
body[data-hmb-ui="v101"] th,body[data-hmb-ui="v101"] td{
  border-color:#e5edf3;padding:10px 11px;vertical-align:top
}
body[data-hmb-ui="v101"] tbody tr:hover{background:#fbfdff}

/* status helpers */
body[data-hmb-ui="v101"] .badge,
body[data-hmb-ui="v101"] .pill,
body[data-hmb-ui="v101"] .status{
  display:inline-flex;align-items:center;gap:5px;max-width:100%;
  border-radius:999px;border:1px solid var(--hmb-border);padding:4px 8px;
  background:#fff;font-size:.78rem;font-weight:750
}
body[data-hmb-ui="v101"] .success,body[data-hmb-ui="v101"] .ok{color:var(--hmb-success)}
body[data-hmb-ui="v101"] .warning{color:var(--hmb-warning)}
body[data-hmb-ui="v101"] .danger,body[data-hmb-ui="v101"] .error{color:var(--hmb-danger)}

/* nav/header normalization */
body[data-hmb-ui="v101"] header{max-width:100%}
body[data-hmb-ui="v101"] header nav,
body[data-hmb-ui="v101"] header .nav,
body[data-hmb-ui="v101"] .topnav{
  min-width:0
}
body[data-hmb-ui="v101"] header a{white-space:nowrap}
body[data-hmb-ui="v101"] .ey,
body[data-hmb-ui="v101"] .eyebrow{
  color:var(--hmb-teal);font-weight:800;letter-spacing:.05em
}

/* prevent layout explosions */
body[data-hmb-ui="v101"] pre,
body[data-hmb-ui="v101"] code{max-width:100%;overflow-wrap:anywhere}
body[data-hmb-ui="v101"] pre{overflow:auto}
body[data-hmb-ui="v101"] td,body[data-hmb-ui="v101"] th{overflow-wrap:anywhere}
body[data-hmb-ui="v101"] form{max-width:100%}

/* tablet */
@media(max-width:1024px){
 body[data-hmb-ui="v101"] .grid,
 body[data-hmb-ui="v101"] .cards,
 body[data-hmb-ui="v101"] .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body[data-hmb-ui="v101"] .wrap,
 body[data-hmb-ui="v101"] .w{width:min(100%,calc(100% - 28px))!important}
}

/* mobile */
@media(max-width:720px){
 body[data-hmb-ui="v101"]{font-size:15px}
 body[data-hmb-ui="v101"] .wrap,
 body[data-hmb-ui="v101"] .w{width:min(100%,calc(100% - 20px))!important}
 body[data-hmb-ui="v101"] .grid,
 body[data-hmb-ui="v101"] .cards,
 body[data-hmb-ui="v101"] .stats,
 body[data-hmb-ui="v101"] .cols,
 body[data-hmb-ui="v101"] .columns{
   grid-template-columns:minmax(0,1fr)!important
 }
 body[data-hmb-ui="v101"] header .w,
 body[data-hmb-ui="v101"] header .wrap,
 body[data-hmb-ui="v101"] header nav,
 body[data-hmb-ui="v101"] header .nav{
   flex-wrap:wrap;gap:7px 10px
 }
 body[data-hmb-ui="v101"] table{
   display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch
 }
 body[data-hmb-ui="v101"] th,body[data-hmb-ui="v101"] td{
   min-width:110px;white-space:normal
 }
 body[data-hmb-ui="v101"] input:not([type="checkbox"]):not([type="radio"]),
 body[data-hmb-ui="v101"] select,
 body[data-hmb-ui="v101"] textarea,
 body[data-hmb-ui="v101"] button,
 body[data-hmb-ui="v101"] .btn,
 body[data-hmb-ui="v101"] input[type="submit"]{min-height:44px}
 body[data-hmb-ui="v101"] .actions,
 body[data-hmb-ui="v101"] .toolbar{flex-wrap:wrap}
}

/* very small devices */
@media(max-width:430px){
 body[data-hmb-ui="v101"] h1{font-size:1.45rem}
 body[data-hmb-ui="v101"] .panel,
 body[data-hmb-ui="v101"] .card,
 body[data-hmb-ui="v101"] .tile,
 body[data-hmb-ui="v101"] .box{border-radius:8px}
 body[data-hmb-ui="v101"] .grid,
 body[data-hmb-ui="v101"] .cards,
 body[data-hmb-ui="v101"] .stats{gap:10px!important}
}

/* accessibility */
@media(prefers-reduced-motion:reduce){
 body[data-hmb-ui="v101"] *,body[data-hmb-ui="v101"] *:before,body[data-hmb-ui="v101"] *:after{
   scroll-behavior:auto!important;animation-duration:.001ms!important;
   animation-iteration-count:1!important;transition-duration:.001ms!important
 }
}
@media(forced-colors:active){
 body[data-hmb-ui="v101"] .btn,
 body[data-hmb-ui="v101"] button{border:1px solid ButtonText}
}