:root{
  --myapp-bg:#070d13;
  --myapp-bg2:#0d1b24;
  --myapp-panel:#101d27;
  --myapp-panel2:#132735;
  --myapp-card:rgba(18,32,43,.78);
  --myapp-card2:rgba(11,20,28,.70);
  --myapp-ink:#edf7ff;
  --myapp-muted:#a8bfd0;
  --myapp-soft:#7e94a5;
  --myapp-line:rgba(255,255,255,.10);
  --myapp-line2:rgba(255,255,255,.16);
  --myapp-accent:#20b8a5;
  --myapp-accent2:#4f9cff;
  --myapp-warn:#ff5722;
  --myapp-danger:#ff4d5f;
  --myapp-shadow:0 24px 70px rgba(0,0,0,.42);
  --myapp-radius:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  color:var(--myapp-ink) !important;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  background:
    radial-gradient(circle at 18% 12%, rgba(32,184,165,.18), transparent 30%),
    radial-gradient(circle at 82% 8%, rgba(79,156,255,.17), transparent 32%),
    radial-gradient(circle at 52% 100%, rgba(255,87,34,.08), transparent 34%),
    linear-gradient(135deg,var(--myapp-bg),var(--myapp-bg2)) !important;
  min-height:100vh !important;
}
a{color:inherit}
.wrap,.container,.app,.page,.shell{
  width:min(1120px,100%) !important;
  margin-inline:auto !important;
  padding:28px 18px 36px !important;
}
.myapp-back{
  position:fixed !important;
  z-index:50 !important;
  left:14px !important;
  bottom:14px !important;
  top:auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  width:auto !important;
  min-width:0 !important;
  max-width:max-content !important;
  border:1px solid var(--myapp-line) !important;
  background:rgba(255,255,255,.08) !important;
  color:var(--myapp-ink) !important;
  border-radius:999px !important;
  padding:10px 15px !important;
  font-size:15px !important;
  line-height:1 !important;
  font-weight:650 !important;
  text-decoration:none !important;
  box-shadow:0 12px 30px rgba(0,0,0,.24) !important;
  backdrop-filter:blur(18px) !important;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}
.myapp-back:hover{transform:translateY(-2px) !important;background:rgba(255,255,255,.13) !important;box-shadow:0 18px 38px rgba(0,0,0,.32) !important}
.login-page,.login-wrap,.login-shell,.loginShell,body:has(> .login-card),body:has(> .loginCard){min-height:100vh !important}
.login-page,.login-wrap,.loginShell{display:flex !important;align-items:center !important;justify-content:center !important;padding:18px !important}
.login-box,.login-card,.loginCard,.glass,.panel,.card,.main-panel,.sidebar,.side .card,.form-card,.list,.form-shell .card,.hero .panel,.modal-card,.box,.section,.target,.task-card,.day-card,.stat,.overview,.quote,.composer,.note-card{
  background:linear-gradient(180deg,var(--myapp-card),var(--myapp-card2)) !important;
  border:1px solid var(--myapp-line) !important;
  border-radius:var(--myapp-radius) !important;
  box-shadow:var(--myapp-shadow) !important;
  backdrop-filter:blur(18px) !important;
  color:var(--myapp-ink) !important;
}
.login-card,.login-box,.loginCard{max-width:440px !important;padding:28px !important}
.logo,.brand-icon,.brand .logo,.login-logo,.heart-big,.logoMark,.iconBox,.app-icon{
  background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.06)) !important;
  border:1px solid var(--myapp-line2) !important;
  box-shadow:0 14px 34px rgba(0,0,0,.25) !important;
  color:var(--myapp-accent) !important;
}
.logoMark img,.iconBox img{filter:drop-shadow(0 10px 18px rgba(0,0,0,.22)) !important}
h1,.title,.login-title,.brand h1,.hero h2,.form-title,.card h3,.task-title,.target-title,h2,h3{
  color:var(--myapp-ink) !important;
  letter-spacing:-.04em !important;
  font-weight:740 !important;
}
p,.subtitle,.sub,.login-subtitle,.footer,.footer-note,.created,.txt,.task-notes,.notes,.day-info,.stat-label,label,.label,.brand p,.hero p,.card p,.copy,.small,.muted{
  color:var(--myapp-muted) !important;
}
input,textarea,select,.input,.search{
  color:var(--myapp-ink) !important;
  background:rgba(255,255,255,.08) !important;
  border:1px solid var(--myapp-line2) !important;
  border-radius:18px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06) !important;
  font-size:16px !important;
}
input::placeholder,textarea::placeholder{color:rgba(168,191,208,.70) !important}
select option{background:#101d27 !important;color:#edf7ff !important;font-size:16px !important}
input:focus,textarea:focus,select:focus,.input:focus,.search:focus{
  outline:none !important;
  border-color:rgba(32,184,165,.65) !important;
  box-shadow:0 0 0 4px rgba(32,184,165,.18) !important;
}
button,.btn,.top-btn,.logout,.save-btn,.reset-btn,.toolbtn,.openBtn,.mini-btn,.category-tab,.icon,.loginBtn,input[type='submit']{
  border-radius:999px !important;
  font-weight:650 !important;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease, color .18s ease, filter .18s ease !important;
}
button:hover,.btn:hover,.top-btn:hover,.logout:hover,.save-btn:hover,.reset-btn:hover,.toolbtn:hover,.openBtn:hover,.mini-btn:hover,.category-tab:hover,.icon:hover,.loginBtn:hover,input[type='submit']:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.32) !important;
  filter:brightness(1.06) !important;
}
.btn-primary,.btn:not(.ghost):not(.btn-soft),.save-btn,.top-btn.add-top-btn,button[name='login'],button[name='save'],.openBtn,.loginBtn,input[type='submit']{
  background:linear-gradient(135deg,var(--myapp-accent),var(--myapp-accent2)) !important;
  color:#041014 !important;
  border:1px solid rgba(255,255,255,.10) !important;
}
.btn-soft,.ghost,.logout,.toolbtn,.category-tab,.top-btn.logout-top-btn,.reset-btn,.mini-btn{
  background:rgba(255,255,255,.08) !important;
  color:var(--myapp-ink) !important;
  border:1px solid var(--myapp-line) !important;
}
.category-tab.active,.badge.active,.tag,.date-pill,.pill{
  background:rgba(32,184,165,.14) !important;
  color:#bdf8ed !important;
  border:1px solid rgba(32,184,165,.28) !important;
}
.card,.task-card,.target,.day-line,.stat,.stat-line,.overview,.quote,.note-card{
  border:1px solid var(--myapp-line) !important;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.045)) !important;
  border-radius:24px !important;
}
.card:hover,.task-card:hover,.target:hover,.note-card:hover{
  transform:translateY(-3px) !important;
  box-shadow:0 22px 56px rgba(0,0,0,.36) !important;
  border-color:rgba(32,184,165,.25) !important;
}
.card:after{background:rgba(32,184,165,.15) !important}
.targetArt:before{background:rgba(32,184,165,.14) !important}
.footer a,.copy a{color:var(--myapp-muted) !important;text-decoration:none !important;text-underline-offset:0 !important;transition:color .18s ease, opacity .18s ease, filter .18s ease !important}
.footer a:hover,.copy a:hover{color:#bdf8ed !important;text-decoration:none !important;filter:brightness(1.08) !important}
.footer,.copy,.footer-note{font-size:14px !important;color:var(--myapp-muted) !important}
.error,.login-error{
  border-radius:18px !important;
  border:1px solid rgba(255,77,95,.30) !important;
  background:rgba(255,77,95,.11) !important;
  color:#ffc4cb !important;
}
.success,.notice{
  border-radius:18px !important;
  border:1px solid rgba(32,184,165,.28) !important;
  background:rgba(32,184,165,.12) !important;
  color:#bdf8ed !important;
}
hr{border-color:var(--myapp-line) !important}
table{color:var(--myapp-ink) !important}
th,td{border-color:var(--myapp-line) !important}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:#071018}
::-webkit-scrollbar-thumb{background:#223848;border-radius:999px;border:3px solid #071018}
@media(max-width:800px){
  .myapp-back{position:fixed !important;left:12px !important;bottom:12px !important;top:auto !important;margin:0 !important;font-size:14px !important;padding:9px 13px !important}
  .wrap,.container,.app,.page,.shell{padding:18px 14px 28px !important}
}