:root{
  --bg:#0b1220;--text:#0f172a;--muted:#64748b;--border:#e2e8f0;--primary:#2563eb;
  --radius:16px;--font:"Segoe UI",system-ui,-apple-system,sans-serif;
  --safe-top:env(safe-area-inset-top,0px);
  --safe-bot:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;font-family:var(--font);color:var(--text);background:#f4f7fb}
html.is-standalone body{overscroll-behavior:none}
a{color:var(--primary);text-decoration:none}
.app-header{background:#0f172a;color:#fff;position:sticky;top:0;z-index:30;padding-top:var(--safe-top)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px}
.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;min-width:0}
.brand-logo{height:36px;width:36px;object-fit:contain;background:#fff;border-radius:10px;flex-shrink:0}
.brand span{min-width:0}
.brand strong{display:block;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand small{display:block;color:#94a3b8;font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.notify-btn{font-size:.78rem;padding:7px 10px}
.wrap{max-width:720px;margin:0 auto;padding:16px 14px 96px}
.page-head{margin-bottom:14px}
.eyebrow{margin:0;color:var(--muted);font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
h1{margin:4px 0 8px;font-size:1.45rem}
.muted{color:var(--muted)}.small{font-size:.85rem}
.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:12px;padding:11px 14px;font-weight:700;cursor:pointer;font:inherit}
.btn-primary{background:var(--primary);color:#fff}
.btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.22)}
.btn-ghost-dark{background:#fff;color:var(--text);border:1px solid var(--border)}
.btn-block{width:100%;margin-top:12px}
.form-control{width:100%;padding:12px;border:1px solid var(--border);border-radius:12px;margin:4px 0 12px;font:inherit;font-size:16px}
label{font-weight:650;font-size:.9rem}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:0 10px 30px rgba(15,23,42,.05)}
.file-list{display:flex;flex-direction:column;gap:10px}
.file-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:6px}
.file-card .meta{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.chip{display:inline-flex;background:#eff6ff;color:#1d4ed8;border-radius:999px;padding:3px 8px;font-size:.75rem;font-weight:700}
.chip.danger{background:#fee2e2;color:#b91c1c}
.alert{padding:12px 14px;border-radius:12px;margin-bottom:14px}
.alert-ok{background:#d1fae5;color:#065f46}
.alert-error{background:#fee2e2;color:#991b1b}
.alert-error a{color:#991b1b;font-weight:700;text-decoration:underline}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid-2 .full{grid-column:1/-1}
.days{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 14px}
.chk{display:inline-flex;align-items:center;gap:6px;font-weight:600;background:#fff;border:1px solid var(--border);border-radius:999px;padding:8px 10px}
.user-row{display:flex;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid var(--border)}
.tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:40;
  display:flex;background:#0f172a;border-top:1px solid rgba(255,255,255,.08);
  padding:6px 6px calc(8px + var(--safe-bot));
}
.tab,.tab-form{flex:1;margin:0}
.tab{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  color:#94a3b8;font-size:.7rem;font-weight:700;background:none;border:0;padding:8px 4px;width:100%;cursor:pointer;
  position:relative;
}
.tab.is-on{color:#fff}
.tab-ico{font-size:1.05rem;line-height:1}
.badge{position:absolute;top:2px;right:18%;background:#ef4444;color:#fff;border-radius:999px;min-width:16px;height:16px;font-size:.62rem;display:inline-flex;align-items:center;justify-content:center;padding:0 4px}
.install-bar{
  position:fixed;left:10px;right:10px;bottom:calc(72px + var(--safe-bot));z-index:80;
  background:#0f172a;color:#fff;border-radius:16px;padding:12px;display:flex;gap:8px;align-items:center;
  box-shadow:0 16px 40px rgba(0,0,0,.35);
}
.install-bar[hidden],.ios-tip[hidden],.install-bar.is-off,.ios-tip.is-off{display:none!important}
html.is-standalone .install-bar,html.is-standalone .ios-tip,
html.is-native-app .install-bar,html.is-native-app .ios-tip{display:none!important}
.install-bar div{flex:1;min-width:0}
.install-bar span{display:block;color:#94a3b8;font-size:.78rem}
.install-close{
  width:44px;height:44px;min-width:44px;padding:0;flex-shrink:0;font-size:1.5rem;line-height:1;font-weight:700;
}
.ios-tip{position:fixed;left:12px;right:12px;bottom:calc(80px + var(--safe-bot));z-index:90;background:#fff;border-radius:16px;padding:16px 48px 16px 16px;box-shadow:0 18px 40px rgba(0,0,0,.25)}
.ios-tip .install-close{position:absolute;top:8px;right:8px;color:#0f172a;border-color:#cbd5e1}
.login-page{background:var(--bg);min-height:100dvh}
.login-shell{min-height:100dvh;display:flex;flex-direction:column}
.login-hero{color:#e2e8f0;padding:calc(28px + var(--safe-top)) 24px 20px;background:linear-gradient(160deg,#0b1220,#111a2e)}
.login-hero .app-mark{width:64px;height:64px;border-radius:16px;margin-bottom:14px}
.login-panel{flex:1;display:flex;align-items:flex-start;justify-content:center;background:#eef2ff;padding:20px 16px calc(28px + var(--safe-bot))}
.login-card{width:100%;max-width:420px;background:#fff;border-radius:18px;padding:22px}
@media(min-width:880px){
  .login-shell{display:grid;grid-template-columns:1.05fr 1fr}
  .login-panel{align-items:center}
  .tabbar{max-width:720px;left:50%;transform:translateX(-50%);border-radius:16px 16px 0 0}
}
