@import "https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700&family=Barlow+Condensed:wght@300;400;500;600&display=swap";:root{--bg-dark:#000;--bg-panel:#00000080;--text-main:#fff;--text-muted:#a1a1aa;--primary:#058c51;--primary-hover:#046b3e;--danger:#ef4444;--danger-hover:#dc2626;--danger-glow:#ef444466;--warning:#f59e0b;--surface-border:#ffffff1a;--glass-bg:#0009;--glass-border:#ffffff14;--font-main:"Inter", system-ui, -apple-system, sans-serif;--transition-fast:.15s ease-in-out;--transition-normal:.3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-dark);color:var(--text-main);min-height:100vh;margin:0;line-height:1.5;overflow:hidden}#root{flex-direction:column;max-width:600px;min-height:100vh;margin:0 auto;display:flex;position:relative;overflow:hidden}.background-wrapper{z-index:0;background-color:var(--bg-dark);transform:translateY(var(--bg-offset,0px));will-change:transform;position:fixed;inset:-20vh 0}.bg-image{opacity:0;background-position:bottom;background-size:cover;transition:opacity 1.5s ease-in-out;position:absolute;inset:0}.bg-image.visible{opacity:1}.bg-image.bg-loading{animation:.8s ease-in-out forwards bgFadeIn}@keyframes bgFadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slideDown{0%{opacity:0;transform:translate(-50%)translateY(-16px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.background-wrapper:after{content:"";z-index:1;background:linear-gradient(#00000040 0%,#00000080 100%);position:absolute;inset:0}.glass-panel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--glass-border);background:#00000080;border-radius:16px;box-shadow:0 8px 32px #0000004d}.hero-spacer{flex-shrink:0;height:15vh}.app-content{z-index:10;scroll-behavior:smooth;flex-direction:column;flex:1;gap:20px;height:100vh;padding:24px 16px 180px;display:flex;position:relative;overflow-y:auto}.institutional-header{background:var(--primary);z-index:20;width:100%;padding:12px;padding-top:calc(5px + env(safe-area-inset-top,0px));color:#fff;border-bottom:none;grid-template-columns:1fr auto 1fr;align-items:center;font-weight:600;display:grid;position:sticky;top:0}.institutional-header:before{content:"";height:env(safe-area-inset-top,0px);background:var(--primary);z-index:999;position:fixed;top:0;left:0;right:0}.header-status-left{text-align:left;opacity:.9;min-width:80px;font-size:.75rem;line-height:1.2}.header-logo-center{justify-content:center;display:flex}.header-logo-center img{object-fit:contain;height:32px}.header-status-right{text-align:right;opacity:.9;min-width:80px;font-size:.75rem;line-height:1.2}h2,h3{color:var(--text-main);text-shadow:0 1px 3px #000c;margin-bottom:12px;font-size:1.15rem;font-weight:600}.text-muted{color:var(--text-muted)}.font-bold{font-weight:700}.secondary-text{opacity:.7;font-size:.8rem}button{font-family:var(--font-main);cursor:pointer;transition:all var(--transition-fast);border:none;outline:none}button:active{transform:scale(.96)}.btn-primary{background:var(--primary);color:#fff;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 20px;font-size:1rem;font-weight:600;display:flex;box-shadow:0 4px 14px #058c5166}.btn-primary:active{background:var(--primary-hover)}.btn-outline{background:var(--glass-bg);color:var(--text-main);border:1px solid var(--glass-border);border-radius:10px;padding:10px 16px;font-weight:500}.btn-outline:active{background:#ffffff0d}.btn-danger{background:var(--danger);color:#fff;border-radius:8px;padding:8px 16px;font-weight:600}.btn-danger:active{background:var(--danger-hover)}.stop-btn-wrap{z-index:100;position:fixed;bottom:90px;right:20px}.stop-btn{clip-path:polygon(30% 0%,70% 0%,100% 30%,100% 70%,70% 100%,30% 100%,0% 70%,0% 30%);color:#fff;width:62px;height:62px;box-shadow:0 10px 25px #00000080, 0 0 15px var(--danger-glow);cursor:pointer;background:linear-gradient(135deg,#ef4444,#b91c1c);border:2px solid #ffffff4d;border-radius:16px;justify-content:center;align-items:center;font-size:1.1rem;font-weight:800;transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s;display:flex}.stop-btn:active{box-shadow:0 4px 15px var(--danger-glow);transform:scale(.9)translateY(4px)}.status-dot{border-radius:50%;width:10px;height:10px;display:inline-block;box-shadow:0 0 8px}.status-online{color:#10b981;background-color:#10b981}.status-offline{background-color:var(--danger);color:var(--danger)}.form-group{flex-direction:column;gap:6px;margin-bottom:16px;display:flex}.form-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:.85rem;font-weight:600}.form-input,.form-select{border:1px solid var(--glass-border);color:var(--text-main);font-family:var(--font-main);background:#0000004d;border-radius:8px;padding:12px;font-size:1rem}.form-input:focus,.form-select:focus{border-color:var(--primary);outline:none}.day-selector{justify-content:space-between;gap:8px;display:flex}.day-circle{border:1px solid var(--glass-border);cursor:pointer;background:#0006;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:.85rem;font-weight:600;transition:all .2s;display:flex}.day-circle.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 0 10px #058c5166}.switch{width:52px;height:28px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;border:1px solid var(--glass-border);background-color:#ffffff26;border-radius:34px;transition:all .3s;position:absolute;inset:0}.slider:before{content:"";background-color:#fff;border-radius:50%;width:20px;height:20px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;bottom:3px;left:4px;box-shadow:0 2px 4px #0000004d}input:checked+.slider{background-color:var(--primary);border-color:var(--primary)}input:checked+.slider:before{transform:translate(24px)}.dot-typing{vertical-align:middle;align-items:center;gap:3px;margin-left:4px;display:inline-flex}.dot-typing span{opacity:.4;background-color:currentColor;border-radius:50%;width:3px;height:3px;animation:1.4s ease-in-out infinite dot-pulse}.dot-typing span:nth-child(2){animation-delay:.2s}.dot-typing span:nth-child(3){animation-delay:.4s}@keyframes dot-pulse{0%,to{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.3)}}
