:root{--bg:#0b1020;--surface:#111a33;--card:#141f3d;--text:#e8ecff;--muted:#e8ecffb3;--border:#e8ecff1f;--primary:#7c5cff;--primary-dark:#5a3dd4;--primary-contrast:#fff;--danger:#ff4d6d;--warning:#fc6;--success:#2bd4a0;color:var(--text);background:var(--bg);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{margin:0}a{color:inherit}button,input{font:inherit}.appShell{min-height:calc(100svh + env(safe-area-inset-top,0px) + env(safe-area-inset-bottom,0px));flex-direction:column;display:flex}.appMain{flex:auto;width:100%;max-width:980px;margin:0 auto;padding:16px;animation:.35s ease-out both fadeSlideUp}.nav{z-index:10;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);padding-top:env(safe-area-inset-top,0px);background:#0b1020e0;position:sticky;top:0}.navInner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;width:100%;max-width:980px;margin:0 auto;padding:14px 16px;display:flex}.navBrandLink{letter-spacing:.2px;font-weight:700;text-decoration:none}.navLinks{flex-wrap:wrap;flex:auto;justify-content:center;align-items:center;gap:8px;display:flex}.navLink{color:var(--muted);white-space:nowrap;border:1px solid #0000;border-radius:10px;padding:7px 10px;font-size:13.5px;text-decoration:none;transition:color .15s,background .15s}.navLink:hover{color:var(--text);background:#7c5cff14}.navLinkActive{color:var(--text);background:#7c5cff2e;border-color:#7c5cff40}.navRight{align-items:center;gap:10px;display:flex}.navUser{text-align:right;align-items:center;gap:8px;line-height:1.1;display:none}.navUserName{color:var(--text);font-size:12px;font-weight:600}.navUserRole{color:var(--muted);font-size:11px}@media (width>=720px){.appMain{padding:22px 16px}.navInner,.navLinks{flex-wrap:nowrap}.navUser{display:flex}}.bottomTabBar{display:none}@media (width<=719px){.navBrand{order:1}.navRight{order:2;margin-left:auto}.navLinksDesktop{display:none}.navInner{flex-wrap:nowrap}.bottomTabBar{z-index:10;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--border);padding:8px 0;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 6px);background:#0b1020fa;justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.bottomTabLink{color:var(--muted);-webkit-tap-highlight-color:transparent;flex-direction:column;align-items:center;gap:2px;padding:4px 8px;font-size:10px;font-weight:600;text-decoration:none;transition:color .15s;display:flex}.bottomTabLink svg{transition:transform .15s}.bottomTabLinkActive{color:var(--primary)}.bottomTabLinkActive svg{transform:scale(1.1)}.appFooter{margin-bottom:calc(env(safe-area-inset-bottom,0px) + 56px)}}@media (width<=719px) and (display-mode:standalone){.appShell{min-height:108svh}}.pageTitle{letter-spacing:-.2px;margin:0 0 10px;font-size:26px}.pageSubtitle{color:var(--muted);margin:0 0 16px;font-size:14px;line-height:1.45}.grid{gap:12px;display:grid}.card{border:1px solid var(--border);background:linear-gradient(160deg,#141f3df2,#0f1630d9);border-radius:14px;padding:14px;transition:border-color .2s,box-shadow .2s}.card:hover{border-color:#7c5cff2e;box-shadow:0 4px 24px #00000040}.row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.badge{border:1px solid var(--border);color:var(--muted);border-radius:999px;align-items:center;gap:8px;padding:6px 10px;font-size:12px;display:inline-flex}.badgeOpen{color:#2bd4a0f2;background:#2bd4a01a;border-color:#2bd4a040}.badgeClosed{color:#ffcc66f2;background:#ffcc661a;border-color:#ffcc6640}.form{gap:12px;display:grid}.fieldLabel{color:var(--muted);margin-bottom:6px;font-size:13px;display:block}.input{border:1px solid var(--border);width:100%;max-width:100%;color:var(--text);background:#111a338c;border-radius:12px;outline:none;padding:12px;transition:border-color .15s,box-shadow .15s}.input:focus{border-color:#7c5cff99;box-shadow:0 0 0 4px #7c5cff24}.inputError{border-color:#ff4d6db3!important}.inputError:focus{box-shadow:0 0 0 4px #ff4d6d24}.errorText{color:var(--danger);margin-top:6px;font-size:12px}.helpText{color:var(--muted);margin-top:6px;font-size:12px}@keyframes errorFadeIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.errorBanner{color:#ff4d6dfa;background:#ff4d6d1a;border:1px solid #ff4d6d47;border-radius:12px;align-items:flex-start;gap:8px;padding:11px 14px;font-size:13px;line-height:1.5;animation:.2s ease-out errorFadeIn;display:flex}.errorBannerIcon{flex-shrink:0;margin-top:2px}.loadingBox{color:var(--muted);align-items:center;gap:10px;display:inline-flex}.spinner{border:2px solid #e8ecff3d;border-top-color:#e8ecffbf;border-radius:50%;width:16px;height:16px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes emptyPulse{0%,to{transform:scale(1)translateY(0)}50%{transform:scale(1.06)translateY(-4px)}}@keyframes barFill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.skeleton{background:linear-gradient(90deg,#e8ecff0f 25%,#e8ecff1f 50%,#e8ecff0f 75%) 0 0/200% 100%;border-radius:8px;animation:1.5s ease-in-out infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.btn{cursor:pointer;border:1px solid #0000;border-radius:12px;width:100%;padding:12px 14px;font-weight:600;transition:opacity .15s,box-shadow .2s,transform .1s}.btnPrimary{background:linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);color:var(--primary-contrast)}.btnPrimary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 0 0 4px #7c5cff47,0 4px 16px #5a3dd466}.btnPrimary:active:not(:disabled){transform:translateY(0);box-shadow:0 0 0 3px #7c5cff33}.btnSecondary{border-color:var(--border);color:var(--text);background:#e8ecff14}.btnSecondary:hover:not(:disabled){background:#e8ecff1f;border-color:#e8ecff33}.btnDanger{color:#ff4d6df2;background:#ff4d6d1f;border-color:#ff4d6d47}.btnDanger:hover:not(:disabled){background:#ff4d6d2e;border-color:#ff4d6d66}.btnInline{width:auto;padding:10px 12px}.btn:disabled{opacity:.55;cursor:not-allowed}.twoCols{grid-template-columns:1fr;gap:12px;display:grid}.twoCols>*{min-width:0}input[type=date],input[type=time]{appearance:none;min-height:48px}@keyframes modalBackdropIn{0%{opacity:0}to{opacity:1}}@keyframes modalDialogIn{0%{opacity:0;transform:scale(.94)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.modalOverlay{z-index:1000;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0b1020d1;justify-content:center;align-items:center;padding:16px;animation:.2s ease-out both modalBackdropIn;display:flex;position:fixed;inset:0}.modalDialog{background:linear-gradient(#141f3dfa,#141f3df2);border:1px solid #e8ecff1f;border-radius:16px;gap:16px;width:100%;max-width:440px;padding:24px;animation:.25s ease-out 50ms both modalDialogIn;display:grid}@keyframes dropdownIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.navGroupBtn{cursor:pointer;white-space:nowrap;background:#7c5cff1a;border:1px solid #7c5cff40;border-radius:8px;align-items:center;gap:6px;max-width:140px;padding:4px 10px;font-size:12px;font-weight:700;transition:background .15s,border-color .15s;display:flex}.navGroupBtn:hover{background:#7c5cff2e;border-color:#7c5cff66}.navDropdown{background:var(--card);z-index:100;border:1px solid #7c5cff33;border-radius:14px;min-width:220px;max-width:min(280px,100vw - 16px);animation:.18s ease-out both dropdownIn;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden;box-shadow:0 12px 40px #0000008c,0 0 0 1px #7c5cff14}.navDropdownGroup{border-bottom:1px solid var(--border);background:linear-gradient(135deg,#7c5cff14 0%,#0000 60%);align-items:flex-start;gap:12px;padding:14px 16px;display:flex}.navDropdownGroupBtn{cursor:pointer;text-align:left;border:none;width:100%;transition:background .15s}.navDropdownGroupBtn:hover{background:linear-gradient(135deg,#7c5cff29 0%,#7c5cff0a 60%)}.navDropdownGroupAvatar{background:linear-gradient(135deg, var(--primary), #9d7fff);color:#fff;letter-spacing:-.5px;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:16px;font-weight:800;display:flex;box-shadow:0 4px 12px #7c5cff59}.navDropdownGroupInfo{flex:1;min-width:0}.navDropdownGroupLabel{color:var(--muted);text-transform:uppercase;letter-spacing:1px;opacity:.7;margin-bottom:3px;font-size:9px}.navDropdownGroupName{color:var(--text);word-break:break-word;overflow-wrap:anywhere;font-size:14px;font-weight:800;line-height:1.25}.navDropdownGroupCode{color:var(--primary);letter-spacing:1.5px;opacity:.8;margin-top:3px;font-size:10px;font-weight:600}.navDropdownItem{cursor:pointer;text-align:left;width:100%;color:var(--muted);white-space:normal;word-break:break-word;background:0 0;border:none;align-items:center;gap:10px;padding:11px 16px;font-size:13px;transition:background .12s,color .12s;display:flex}.navDropdownItemIcon{width:22px;height:22px;color:var(--primary);background:#7c5cff1f;border:1px solid #7c5cff33;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-size:16px;line-height:1;display:flex}.navDropdownItem:hover{color:var(--text);background:#e8ecff0d}.historyRow{border:1px solid var(--border);background:linear-gradient(#141f3df2,#141f3dbf);border-radius:14px;transition:border-color .18s,box-shadow .18s,transform .12s;display:flex;overflow:hidden}.historyRow[role=button]{cursor:pointer;border-color:#7c5cff2e}.historyRow[role=button]:hover{border-color:#7c5cff59;transform:translateY(-1px);box-shadow:0 4px 20px #0000004d}.historyRow[role=button]:active{box-shadow:none;transform:translateY(0)}.btnSecondary:active:not(:disabled),.btnDanger:active:not(:disabled){transform:scale(.98)}.textLink{cursor:pointer;text-underline-offset:3px;background:0 0;border:none;padding:0;font-size:13px;text-decoration:underline;transition:opacity .12s}.textLink:hover{opacity:.8}.textLinkPrimary{color:var(--primary);font-weight:700}.textLinkMuted{color:var(--muted)}@media (width>=720px){.twoCols{grid-template-columns:1fr 1fr}.pageTitle{font-size:30px}}