:root{--ink:#0d172e;--blue:#eaf6ff;--accent:#0879ff;--muted:#667085;--line:#dbe3ee;--card:#fff}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:#f5f8fc}.landing,.auth{min-height:100vh;background:linear-gradient(180deg,#e8f6ff,#f7fbff);display:grid;place-items:center;padding:24px}.hero,.authcard{width:min(760px,100%);background:white;border-radius:40px;padding:48px;box-shadow:0 24px 70px rgba(24,57,89,.14)}.authcard{width:min(560px,100%)}.installcard{width:min(700px,100%)}.brandmark{width:88px;height:88px;border-radius:28px;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:34px;font-weight:800}.hero h1,.authcard h1{font-size:clamp(38px,6vw,64px);margin:28px 0 16px}.hero p,.authcard p{font-size:20px;line-height:1.5}.button{display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:16px;background:var(--ink);color:white;padding:14px 20px;font-weight:750;text-decoration:none;cursor:pointer}.button.secondary{background:#eef3f9;color:var(--ink)}.button.full{width:100%;font-size:19px}.ghost{color:var(--ink);text-decoration:none}.topbar{position:sticky;top:0;z-index:5;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:14px 5vw}.brand{display:flex;gap:12px;align-items:center}.brand img,.brand .brandmark{width:48px;height:48px;border-radius:15px;font-size:18px}.brand small{display:block;color:var(--muted)}.container{width:min(1100px,92vw);margin:28px auto 110px}.pagehead{display:flex;justify-content:space-between;align-items:end}.pagehead h1{margin:0;font-size:36px}.pagehead p{color:var(--muted)}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stats article,.card{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:0 8px 24px rgba(20,40,70,.05)}.stats strong{display:block;font-size:30px;margin-top:8px}.grid.two{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.actions,.adminlinks{display:flex;flex-wrap:wrap;gap:10px}.adminlinks{margin-bottom:16px}.adminlinks a{background:white;padding:12px 16px;border:1px solid var(--line);border-radius:14px;text-decoration:none;color:var(--ink)}.formgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:18px 0}.formgrid .wide{grid-column:1/-1}label{display:grid;gap:8px;font-weight:700}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:14px;padding:13px 14px;font:inherit;background:#fff}textarea{min-height:100px}.check{display:flex;align-items:center}.check input{width:auto}.list{display:grid;gap:12px;margin-top:18px}.row{display:flex;justify-content:space-between;align-items:center}.row h3{margin:0 0 7px}.row p{margin:0;color:var(--muted)}.alert{padding:12px 14px;border-radius:12px;margin:12px 0}.alert.error{background:#fff1f1;color:#bb1d1d}.alert.success{background:#eafaf0;color:#176b38}.bottomnav{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);display:flex;justify-content:center;gap:4vw;padding:12px;z-index:6}.bottomnav a{color:var(--ink);text-decoration:none;font-weight:700}.invoicehead{display:flex;justify-content:space-between}.invoice table{width:100%;border-collapse:collapse;margin:24px 0}.invoice th,.invoice td{text-align:left;padding:12px;border-bottom:1px solid var(--line)}.totals{margin-left:auto;width:min(360px,100%)}.totals p{display:flex;justify-content:space-between}.authcard label{margin:16px 0}.authcard small{display:block;margin-top:20px;color:var(--muted)}@media(max-width:760px){.hero,.authcard{padding:30px;border-radius:30px}.stats{grid-template-columns:1fr 1fr}.grid.two,.formgrid{grid-template-columns:1fr}.formgrid .wide{grid-column:auto}.pagehead h1{font-size:30px}.bottomnav{justify-content:space-around;gap:0;font-size:13px}.invoicehead{display:block}}@media print{.topbar,.bottomnav,.no-print,.pagehead{display:none!important}.container{width:100%;margin:0}.invoice{border:0;box-shadow:none}}
.herologo{display:block;max-width:180px;max-height:130px;width:auto;height:auto;object-fit:contain;margin-bottom:24px}.authbrand{display:flex;align-items:center;gap:20px;margin-bottom:18px}.authbrand h1{font-size:clamp(30px,5vw,48px);margin:0 0 8px}.authbrand p{font-size:17px;margin:0}.authlogo{width:104px;height:104px;object-fit:contain;border-radius:24px;background:#fff;border:1px solid var(--line);padding:8px}.settings-logo-preview{display:block;width:110px;height:110px;object-fit:contain;border:1px solid var(--line);border-radius:18px;padding:8px;background:#fff;margin-bottom:8px}.formgrid label small{font-weight:500;color:var(--muted)}@media(max-width:560px){.authbrand{align-items:flex-start;flex-direction:column}.authlogo{width:88px;height:88px}.herologo{max-width:150px;max-height:110px}}

/* Keen / V7 hydration homepage — v1.1.2 */
.hydration-home{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(145deg,#021a34 0%,#023a68 40%,#0a78a8 72%,#48d7e8 100%);color:#fff}
.hydration-scene{position:fixed;inset:0;overflow:hidden;z-index:-2;pointer-events:none}
.hydration-scene:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 18%,rgba(100,241,255,.34),transparent 30%),radial-gradient(circle at 86% 22%,rgba(52,153,255,.38),transparent 32%),linear-gradient(180deg,rgba(255,255,255,.06),transparent 38%)}
.aqua-glow{position:absolute;border-radius:50%;filter:blur(14px);opacity:.55;animation:aquaDrift 11s ease-in-out infinite alternate}
.glow-one{width:38vw;height:38vw;left:-10vw;top:-12vw;background:rgba(70,237,255,.36)}
.glow-two{width:32vw;height:32vw;right:-8vw;top:8vh;background:rgba(48,125,255,.3);animation-delay:-4s}
.bubble{position:absolute;bottom:-140px;border:1px solid rgba(255,255,255,.48);border-radius:50%;background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.62),rgba(255,255,255,.08) 42%,rgba(255,255,255,.02) 68%);box-shadow:inset -10px -14px 24px rgba(0,98,162,.18),0 0 22px rgba(125,240,255,.18);animation:bubbleRise linear infinite}
.bubble-1{left:8%;width:38px;height:38px;animation-duration:10s}
.bubble-2{left:22%;width:18px;height:18px;animation-duration:7s;animation-delay:-3s}
.bubble-3{left:46%;width:56px;height:56px;animation-duration:13s;animation-delay:-7s}
.bubble-4{left:67%;width:26px;height:26px;animation-duration:9s;animation-delay:-5s}
.bubble-5{left:82%;width:72px;height:72px;animation-duration:15s;animation-delay:-10s}
.bubble-6{left:92%;width:22px;height:22px;animation-duration:8s;animation-delay:-2s}
.water-wave{position:absolute;left:-10%;width:120%;height:34vh;bottom:-19vh;border-radius:46% 54% 0 0/28% 24% 0 0;transform-origin:center bottom;animation:waterSway 8s ease-in-out infinite alternate}
.wave-back{background:rgba(105,232,255,.18);bottom:-14vh;animation-duration:11s}
.wave-mid{background:rgba(25,174,225,.28);bottom:-18vh;animation-duration:8s;animation-delay:-3s}
.wave-front{background:linear-gradient(180deg,rgba(52,208,229,.42),rgba(1,67,116,.72));bottom:-22vh;animation-duration:6s;animation-delay:-1s}
.hydration-hero{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.28);background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.08));box-shadow:0 30px 90px rgba(0,18,45,.42),inset 0 1px 0 rgba(255,255,255,.38);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);color:#fff}
.hydration-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.22),transparent 32%,transparent 70%,rgba(120,244,255,.12));pointer-events:none}
.hero-shine{position:absolute;width:240px;height:700px;top:-230px;left:-310px;transform:rotate(24deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:shineSweep 7s ease-in-out infinite}
.hydration-hero .brandmark{position:relative;background:linear-gradient(145deg,#0d2848,#031626);box-shadow:0 15px 30px rgba(0,14,35,.35),inset 0 1px 0 rgba(255,255,255,.18)}
.hydration-hero .herologo{position:relative;filter:drop-shadow(0 14px 24px rgba(0,20,45,.28))}
.eyebrow{position:relative;display:inline-flex;margin-top:10px;padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.26);background:rgba(5,31,61,.23);font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.hydration-hero h1{position:relative;text-shadow:0 4px 28px rgba(0,25,65,.38)}
.hydration-hero p{position:relative;max-width:650px;color:rgba(255,255,255,.9)}
.hero-actions{position:relative;margin-top:28px}
.hydration-button{gap:18px;background:linear-gradient(135deg,#ffffff,#d8fbff);color:#07365a;box-shadow:0 16px 35px rgba(0,24,58,.3);transition:transform .22s ease,box-shadow .22s ease}
.hydration-button:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(0,24,58,.38)}
.hydration-button span{font-size:24px;line-height:1}
.hydration-stats{position:relative;display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.hydration-stats span{padding:9px 13px;border-radius:12px;background:rgba(0,31,67,.24);border:1px solid rgba(255,255,255,.2);font-size:13px;font-weight:750;color:rgba(255,255,255,.88)}
@keyframes bubbleRise{0%{transform:translate3d(0,0,0) scale(.8);opacity:0}12%{opacity:.75}55%{transform:translate3d(24px,-55vh,0) scale(1)}100%{transform:translate3d(-18px,-118vh,0) scale(1.12);opacity:0}}
@keyframes waterSway{0%{transform:translateX(-2%) rotate(-1deg) scaleX(1.02)}100%{transform:translateX(2%) rotate(1deg) scaleX(.99)}}
@keyframes aquaDrift{0%{transform:translate3d(-2%,0,0) scale(.96)}100%{transform:translate3d(6%,5%,0) scale(1.08)}}
@keyframes shineSweep{0%,20%{left:-310px;opacity:0}35%{opacity:1}58%,100%{left:115%;opacity:0}}
@media(max-width:560px){.hydration-home{padding:18px}.hydration-hero{padding:30px 24px}.hydration-hero h1{font-size:clamp(38px,13vw,58px)}.hydration-hero p{font-size:17px}.hydration-stats{display:grid;grid-template-columns:1fr 1fr}.water-wave{height:26vh}.bubble-5{width:50px;height:50px}}
@media(prefers-reduced-motion:reduce){.bubble,.water-wave,.aqua-glow,.hero-shine{animation:none!important}.hydration-button{transition:none}}


/* Keen / V7 centered homepage and sign-in — v1.1.3 */
.hydration-hero{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.hydration-hero .herologo,
.hydration-hero .brandmark{margin-left:auto;margin-right:auto}
.hydration-hero h1{
  width:100%;
  margin-left:auto;
  margin-right:auto;
  white-space:nowrap;
  font-size:clamp(28px,5.2vw,58px);
  line-height:1.05;
  letter-spacing:-.035em;
}
.hydration-hero p{margin-left:auto;margin-right:auto;text-align:center}
.hero-actions{display:flex;justify-content:center;width:100%}
.hydration-button{margin-left:auto;margin-right:auto}
.hydration-stats{justify-content:center}

.authcard{text-align:center;margin-left:auto;margin-right:auto}
.authbrand{
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  gap:14px;
}
.authbrand>div{width:100%;text-align:center}
.authbrand h1{
  white-space:nowrap;
  font-size:clamp(24px,5vw,44px);
  line-height:1.08;
  letter-spacing:-.03em;
  text-align:center;
}
.authbrand p{max-width:420px;margin-left:auto;margin-right:auto;text-align:center}
.authlogo,.authbrand .brandmark{margin-left:auto;margin-right:auto}
.authcard label{text-align:left}
.authcard .button.full{display:flex;margin-left:auto;margin-right:auto}
.authcard small{text-align:center}

@media(max-width:620px){
  .hydration-hero h1{font-size:clamp(23px,7.4vw,40px)}
  .authbrand h1{font-size:clamp(21px,6.6vw,34px)}
}
@media(max-width:390px){
  .hydration-hero h1{font-size:21px;letter-spacing:-.045em}
  .authbrand h1{font-size:20px;letter-spacing:-.04em}
}

/* Keen / V7 blurred hydration sign-in — v1.1.4 */
.hydration-login{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:linear-gradient(145deg,#021a34 0%,#023a68 40%,#0a78a8 72%,#48d7e8 100%);
}
.login-hydration-scene{
  z-index:-2;
  filter:blur(8px) saturate(.95);
  transform:scale(1.06);
  opacity:.92;
}
.hydration-login:before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(1,16,35,.18),rgba(2,38,67,.28));
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
.hydration-authcard{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.3);
  background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(242,252,255,.76));
  box-shadow:0 30px 90px rgba(0,18,45,.44),inset 0 1px 0 rgba(255,255,255,.72);
  backdrop-filter:blur(26px);
  -webkit-backdrop-filter:blur(26px);
}
.hydration-authcard:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg,rgba(255,255,255,.45),transparent 35%,transparent 72%,rgba(93,226,255,.12));
}
.hydration-authcard>*{position:relative}
.hydration-authcard .button.full{
  background:linear-gradient(135deg,#06365e,#0879ff);
  box-shadow:0 13px 30px rgba(3,58,104,.25);
}
.hydration-authcard input{
  background:rgba(255,255,255,.84);
  border-color:rgba(37,93,139,.2);
}
.hydration-authcard .authlogo{
  box-shadow:0 14px 35px rgba(0,46,83,.16);
}
@media(max-width:560px){
  .hydration-login{padding:18px}
  .login-hydration-scene{filter:blur(7px);transform:scale(1.1)}
  .hydration-authcard{padding:28px 22px}
}

/* Keen / V7 global footer — v1.1.5 */
.public-main{width:100%;flex:1;display:grid;place-items:center;padding:24px}
.landing,.auth{display:flex;flex-direction:column;align-items:stretch;padding:0}
.site-footer{position:relative;z-index:10;width:100%;padding:16px 24px;color:rgba(255,255,255,.9);background:rgba(1,18,36,.46);border-top:1px solid rgba(255,255,255,.18);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.site-footer__inner{width:min(1200px,100%);margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;text-align:center;font-size:13px;line-height:1.5}
.site-footer__company{font-weight:800}
.site-footer__links{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:8px}
.site-footer a{color:inherit;text-decoration:none;font-weight:700}
.site-footer a:hover,.site-footer a:focus{text-decoration:underline}
body:not(.landing):not(.auth):not(.legal-page) .site-footer{margin-bottom:64px;color:var(--muted);background:#fff;border-top:1px solid var(--line);backdrop-filter:none;-webkit-backdrop-filter:none}
.legal-page{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#e8f6ff,#f7fbff)}
.legal-shell{width:min(860px,92vw);margin:48px auto;flex:1}
.legal-card h1{font-size:clamp(34px,6vw,54px);margin:24px 0 12px}
.legal-card p{font-size:17px;line-height:1.7;color:#344054}
.legal-page .site-footer{color:var(--muted);background:#fff;border-top:1px solid var(--line);backdrop-filter:none;-webkit-backdrop-filter:none}
@media(max-width:640px){.public-main{padding:18px}.site-footer{padding:14px 16px}.site-footer__inner{font-size:12px;gap:6px}.site-footer__separator{display:none}.site-footer__links{width:100%;gap:10px}.legal-shell{margin:24px auto}}
@media print{.site-footer{display:none!important}}