:root{--blue:#0d5db8;--line:rgba(113,177,255,.35);--text:#f5f9ff;--muted:#b6cbe6;--green:#22c55e;--red:#ef4444}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,Segoe UI,Arial,sans-serif!important;color:var(--text)!important;background:linear-gradient(90deg,rgba(0,5,12,.96),rgba(0,8,18,.9)),url("./assets/hmm-background-dark.jpg") center/cover fixed no-repeat!important}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 82% 10%,rgba(80,160,255,.22),transparent 35%),linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.65));z-index:0}body>*{position:relative;z-index:1}
#hmmShell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}#hmmSide{height:100vh;position:sticky;top:0;padding:24px 18px;background:linear-gradient(180deg,rgba(3,10,20,.96),rgba(0,4,10,.98));border-right:1px solid var(--line)}
#hmmBrand{font-size:25px;font-weight:900;font-style:italic;margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid rgba(110,170,240,.25)}
#hmmNav button{display:block;width:100%;margin:6px 0;padding:12px 13px;background:transparent;border:1px solid transparent;color:#edf6ff;text-align:left;font-size:15px;cursor:pointer}
#hmmNav button.active,#hmmNav button:hover{background:linear-gradient(90deg,rgba(13,93,184,.96),rgba(6,45,92,.45));border-color:rgba(90,170,255,.55);box-shadow:inset 3px 0 0 #5ab0ff}
#hmmMain{padding:0 28px 40px;min-width:0}#hmmHero{min-height:320px;padding:32px 34px 24px;background:linear-gradient(90deg,rgba(2,8,16,.99) 0%,rgba(2,10,20,.9) 40%,rgba(2,10,20,.3) 72%,rgba(2,10,20,.08) 100%),url("./assets/hmm-background.jpg") right top/contain no-repeat;border-bottom:1px solid var(--line);border-radius:0 0 18px 18px}
#hmmHero h1{margin:0;font-size:clamp(35px,4vw,58px);text-transform:uppercase;letter-spacing:.04em;text-shadow:0 4px 0 rgba(0,0,0,.35)}#hmmHero .sub{text-transform:uppercase;letter-spacing:.11em;color:var(--muted);font-size:18px;margin-top:5px}
.quick{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}.quick div{width:min(330px,100%);padding:22px 24px;background:linear-gradient(180deg,rgba(10,28,52,.92),rgba(4,10,18,.94));border:1px solid rgba(110,175,255,.42);border-radius:10px}
.page{display:none;padding-top:18px}.page.active{display:block}.panel,.card,section,.container,.login-container{background:linear-gradient(180deg,rgba(7,20,36,.9),rgba(3,10,18,.92))!important;border:1px solid var(--line)!important;border-radius:10px!important;color:var(--text)!important;box-shadow:0 12px 32px rgba(0,0,0,.44)!important;backdrop-filter:blur(6px)}
.kpis{display:grid;grid-template-columns:repeat(6,minmax(145px,1fr));gap:9px;margin:16px 0 18px}.kpi{padding:18px 14px;min-height:136px;text-align:center;background:rgba(7,20,36,.95);border:1px solid var(--line);border-radius:9px}.kpi .label{font-size:12px;text-transform:uppercase}.kpi .value{font-size:34px;font-weight:850;margin-top:8px}.kpi .trend{font-size:12px;color:var(--green);margin-top:10px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.gridWide{display:grid;grid-template-columns:.9fr 1.6fr;gap:18px}.panel{padding:18px}
table{width:100%;border-collapse:collapse;color:#eff7ff!important;background:transparent!important}th,td{padding:10px 12px;border-bottom:1px solid rgba(110,170,240,.18);text-align:left}th{text-transform:uppercase;font-size:12px;color:#b9d8ff!important}
input,textarea,select{width:100%;padding:10px 12px;margin-top:6px;background:rgba(2,9,18,.96)!important;color:white!important;border:1px solid rgba(90,160,240,.48)!important;border-radius:7px!important}
button,input[type=submit]{background:linear-gradient(180deg,#0d5db8,#053a78)!important;color:#fff!important;border:1px solid rgba(120,190,255,.65)!important;border-radius:7px!important;padding:10px 14px!important;cursor:pointer}
.badge{display:inline-block;padding:4px 9px;border-radius:5px;font-size:12px;color:#fff}.high{background:#b82222}.normal{background:#a15a14}.low{background:#a58d10}.complete{background:#1f7e42}.progress{background:#115aad}.waiting{background:#a58d10}
@media(max-width:900px){#hmmShell{grid-template-columns:1fr}#hmmSide{height:auto;position:relative}.kpis,.grid2,.gridWide{grid-template-columns:1fr}#hmmHero{background-size:cover}}