@import"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;700;900&family=Space+Grotesk:wght@500;700&display=swap";:root{--font-heading: "Space Grotesk", sans-serif;--font-body: "Nunito", sans-serif;--color-bg: #0b0c10;--color-container-bg: #12141c;--color-card-teal: #1a2f3b;--color-card-green: #143d28;--color-card-orange: #402213;--color-card-grey: #212530;--color-text-white: #ffffff;--color-text-muted: #94a3b8;--color-vivid-green: #22c55e;--color-vivid-yellow: #facc15;--color-vivid-orange: #f97316;--color-vivid-red: #ef4444;--color-vivid-navy: #0f172a;--height-action: 76px;--height-nav: 96px}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--color-bg);color:var(--color-text-white);font-family:var(--font-body);display:flex;justify-content:center;height:100vh;height:100dvh;overflow:hidden}.app-container{width:100%;max-width:1200px;margin:0 auto;background-color:var(--color-container-bg);height:100%;position:relative;display:flex;flex-direction:column;box-shadow:0 0 40px #0009;overflow:hidden}h1,h2,h3,h4,.font-heading{font-family:var(--font-heading);font-weight:700}.giant-metric{font-size:76px;font-weight:900;line-height:1}.secondary-meta{font-weight:500;color:var(--color-text-muted)}.bottom-nav{width:100%;height:calc(var(--height-nav) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background-color:#12141cf2;backdrop-filter:blur(10px);border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-around;align-items:center;z-index:100;box-sizing:border-box}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--color-text-muted);text-decoration:none;font-size:14px;font-weight:700;width:25%;height:100%;transition:color .2s ease,transform .1s ease}.nav-item:active{transform:scale(.95)}.nav-item.active{color:var(--color-vivid-green)}.action-input{width:100%;height:var(--height-action);padding:0 24px;background-color:var(--color-card-grey);border:2px solid rgba(255,255,255,.1);border-radius:16px;color:var(--color-text-white);font-family:var(--font-body);font-size:18px;font-weight:500;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.action-input:focus{border-color:var(--color-vivid-green);box-shadow:0 0 15px #22c55e33}.action-input-sm{width:100%;height:44px;padding:0 14px;background-color:var(--color-card-grey);border:1px solid rgba(255,255,255,.12);border-radius:10px;color:var(--color-text-white);font-family:var(--font-body);font-size:14px;font-weight:500;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.action-input-sm:focus{border-color:var(--color-vivid-green);box-shadow:0 0 10px #22c55e33}.action-button{width:100%;height:var(--height-action);border-radius:16px;border:none;background-color:var(--color-vivid-green);color:var(--color-text-white);font-family:var(--font-heading);font-size:20px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:12px;transition:transform .1s ease,filter .2s ease}.action-button:active{transform:scale(.97)}.action-button.btn-secondary{background-color:var(--color-card-grey);border:2px solid rgba(255,255,255,.15)}.card-teal{background-color:var(--color-card-teal);color:var(--color-text-white);border-radius:20px;padding:24px}.card-green{background-color:var(--color-card-green);color:var(--color-text-white);border-radius:20px;padding:24px}.card-orange{background-color:var(--color-card-orange);color:var(--color-text-white);border-radius:20px;padding:24px}.card-grey{background-color:var(--color-card-grey);color:var(--color-text-white);border-radius:20px;padding:24px}.status-badge{display:inline-flex;align-items:center;justify-content:center;padding:8px 16px;border-radius:999px;font-weight:900;font-size:14px;text-transform:uppercase}.status-optimal{background-color:var(--color-vivid-green);color:var(--color-text-white)}.status-nominal{background-color:var(--color-vivid-yellow);color:var(--color-vivid-navy)}.status-warning{background-color:var(--color-vivid-orange);color:var(--color-text-white)}.status-danger{background-color:var(--color-vivid-red);color:var(--color-text-white)}
