:root{--lime:#dfff00}
*{box-sizing:border-box}html,body{margin:0;background:#050708;color:white;font-family:Arial,sans-serif;overflow-x:auto}
#viewport{width:100%;min-height:100vh}#stage{width:1536px;height:1024px;position:relative;margin:0 auto;background:#050708;transform-origin:top left}
.slice{position:absolute;display:block;pointer-events:none;user-select:none}.header{left:0;top:0;width:1536px;height:70px}.left{left:0;top:70px;width:330px;height:850px}.main{left:330px;top:70px;width:770px;height:850px}.summary{left:1100px;top:70px;width:436px;height:850px}.footer{left:0;top:920px;width:1536px;height:104px}
.ui{position:absolute;inset:0}.hit{position:absolute;border:0;background:transparent;cursor:pointer;z-index:5;border-radius:9px}.date{z-index:4}.time{z-index:20;pointer-events:auto}.hit:hover{background:#dfff0012}.hit.chosen{box-shadow:inset 0 0 0 3px var(--lime),0 0 18px #dfff0060}.extra.chosen{background:#dfff0018}.time.chosen{background:#dfff00;color:#050708}
.location-box{position:absolute;z-index:7}.location-box input{width:100%;height:100%;background:#080d0f;border:1px solid #4a565a;border-radius:7px;color:#fff;padding:0 35px 0 42px;font-size:11px;outline:none}.location-box input:focus{border-color:var(--lime);box-shadow:0 0 0 2px #dfff0025}
.selection{position:absolute;pointer-events:none;z-index:6;border:2px solid var(--lime);border-radius:9px;box-shadow:0 0 15px #dfff0048}.service-selection{left:360px;top:313px;width:175px;height:234px}.home-selection{left:360px;top:590px;width:175px;height:72px}.time-selection{display:none}.service-selection,.home-selection{transition:.12s}
.summary-ui{position:absolute;z-index:10;left:1118px;top:84px;width:405px;height:352px;background:linear-gradient(180deg,#111719,#080d0e);border:1px solid #364145;border-radius:10px;padding:12px;box-shadow:0 10px 30px #0008;overflow:visible}.sum-title{background:var(--lime);color:#050708;border-radius:7px;padding:12px;font-size:16px;font-weight:1000;font-style:italic}.sum-row{display:grid;grid-template-columns:28px 1fr auto;gap:7px;align-items:center;border-bottom:1px solid #303a3e;padding:8px 2px}.sum-row>span{font-size:16px}.sum-row b{font-size:10px;display:block}.sum-row small{font-size:8px;color:#899497;display:block;margin-top:2px}.sum-row strong{font-size:11px}.sum-total{display:flex;justify-content:space-between;align-items:center;padding:9px 2px 5px;font-size:10px}.sum-total strong{font-size:28px;color:var(--lime)}.continue{display:none}.continue:hover,.finish:hover{filter:brightness(1.1)}
.modal{position:absolute;z-index:30;inset:0;background:#000b;display:grid;place-items:center}.hidden{display:none}.modal-card{width:410px;background:#0c1113;border:1px solid #536065;border-radius:12px;box-shadow:0 20px 80px #000; padding:20px}.modal-card h2{margin:0 0 15px;color:var(--lime);font-style:italic}.close{float:right;background:none;border:0;color:#fff;font-size:28px;cursor:pointer}.monthbar{display:flex;justify-content:space-between;align-items:center;font-size:14px}.monthbar button{background:none;border:0;color:white;font-size:28px}.week{font-size:9px;color:#8e989b;margin:12px 0 6px;text-align:center;word-spacing:15px}.modal #calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.modal #calendar button{height:38px;background:#101719;border:1px solid #364145;color:#fff;border-radius:6px}.modal #calendar button:hover,.modal #calendar button.sel{background:var(--lime);color:#050708;border-color:var(--lime)}.checkout{width:500px}.checkout label{display:block;font-size:9px;color:#aab2b4;font-weight:bold;margin-top:12px}.checkout input{display:block;width:100%;height:42px;margin-top:5px;background:#080d0f;border:1px solid #3b464a;color:#fff;border-radius:6px;padding:0 10px}.finish{margin-top:18px;width:100%;height:48px;background:var(--lime);border:0;border-radius:7px;font-weight:1000}.detail{border-bottom:1px solid #303a3e;padding:9px 0;font-size:12px}.detail span{float:right;color:var(--lime)}#toast{position:absolute;z-index:50;left:50%;top:20px;transform:translateX(-50%);background:#111719;border:1px solid var(--lime);color:#fff;padding:10px 18px;border-radius:7px;display:none;font-weight:bold}
@media(max-width:1536px){#stage{transform:scale(calc(100vw / 1536));margin-left:0;margin-right:0;margin-bottom:calc(-1024px + 66.6667vw)}}

/* Selection state: the ORIGINAL checkbox artwork is the box. Code supplies only a centered lime checkmark. */
.hit.service.chosen::after,.hit.home.chosen::after{content:'✓';position:absolute;left:12px;top:10px;width:25px;height:25px;display:flex;align-items:center;justify-content:center;color:var(--lime);font:900 18px/1 Arial,sans-serif;pointer-events:none;text-shadow:none}
.time.chosen{background:transparent !important;color:inherit !important;box-shadow:inset 0 0 0 2px var(--lime),0 0 12px #dfff0050 !important}
.time.chosen::after{content:'✓';position:absolute;right:5px;top:4px;color:var(--lime);font-weight:1000;font-size:12px;pointer-events:none}
.selection{box-shadow:none;border:0}

#homePrices{position:absolute;inset:0;z-index:8;pointer-events:none;font-family:"Liberation Sans Narrow",Arial,sans-serif;font-weight:700;font-size:25px;line-height:1;text-align:center;}
#homePrices span{
  position:absolute;
  top:636px;
  width:80px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-shadow:0 1px 1px rgba(0,0,0,.25);
}
#hp1{left:408px;color:#dfff00;}#hp2{left:589px;color:#d7e6f4;}#hp3{left:769px;color:#d7e6f4;}#hp4{left:949px;color:#d7e6f4;}

/* Functional button sits exactly in the existing summary CTA area. */
.summary-ui .continue{display:block !important;position:absolute;left:1px;top:352px;width:390px;height:58px;margin:0;padding:0;border:0;border-radius:7px;background:transparent;color:#050708;font:italic 1000 15px/58px Arial,sans-serif;text-align:center;cursor:pointer;z-index:20}.summary-ui .continue::before{content:'FINISH & CHECKOUT →';display:block;font:italic 1000 15px/58px Arial,sans-serif;color:#050708;text-align:center;white-space:nowrap}.summary-ui .continue{font-size:0}.summary-ui .continue:hover{filter:none;background:transparent;}

/* Dynamic date text occupies the ORIGINAL date field's text area only.
   It is hidden until a date is selected, so the original artwork remains visible. */
.form-date-label{
  position:absolute;
  left:430px;
  top:820px;
  width:120px;
  height:25px;
  display:none;
  align-items:center;
  color:#f4f6f6;
  font:400 11px/25px Arial,sans-serif;
  white-space:nowrap;
  overflow:hidden;
  z-index:12;
  pointer-events:none;
  background:#101619;
}
.form-date-label.visible{display:flex}

/* V24: improve readability inside the existing cleaning summary only */
#summary .sum-main { font-size:16px !important; line-height:1.15; }
#summary .sum-sub { font-size:12px !important; line-height:1.2; }
#summary .sum-label { font-size:15px !important; line-height:1.15; }

/* V25: slightly larger Cleaning Summary typography */
#summary .sum-main { font-size:18px !important; }
#summary .sum-sub { font-size:13px !important; }
#summary .sum-label { font-size:16px !important; }

/* V26: 25% larger Cleaning Summary typography */
#summary .sum-main { font-size:22.5px !important; }
#summary .sum-sub { font-size:16.25px !important; }
#summary .sum-label { font-size:20px !important; }

/* V27: actual summary selectors, increased for readability */
.summary-ui .sum-row b { font-size:14px !important; line-height:1.15; }
.summary-ui .sum-row small { font-size:10px !important; line-height:1.2; }
.summary-ui .sum-row strong { font-size:14px !important; }
.summary-ui .sum-row>span { font-size:18px !important; }
.summary-ui .sum-total { font-size:12px !important; }
.summary-ui .sum-total strong { font-size:30px !important; }

/* V28: activate the EXISTING Finish & Checkout artwork only after Step 5 is complete. */
.finish-hit{
  position:absolute;
  left:1118px;
  top:650px;
  width:405px;
  height:64px;
  border:0;
  background:transparent;
  cursor:default;
  z-index:15;
  border-radius:8px;
  pointer-events:none;
}
.finish-hit.ready{
  pointer-events:auto;
  cursor:pointer;
  box-shadow:0 0 18px rgba(223,255,0,.35);
}
.finish-hit.ready::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:8px;
  background:rgba(223,255,0,.10);
  pointer-events:none;
}


/* V28 FIX: the original CTA becomes visibly active only when all required steps are complete. */
.summary-ui .continue.ready{
  cursor:pointer;
  filter:none;
  background:rgba(223,255,0,.28);
  box-shadow:inset 0 0 22px rgba(223,255,0,.28),0 0 0 2px rgba(223,255,0,.85),0 0 24px rgba(223,255,0,.65);
  animation:finishPulse 1.35s ease-in-out infinite;
  transition:background .18s ease,box-shadow .18s ease,transform .12s ease;
}
.summary-ui .continue.ready:hover{
  background:rgba(223,255,0,.42);
  box-shadow:inset 0 0 26px rgba(223,255,0,.38),0 0 0 2px rgba(223,255,0,1),0 0 32px rgba(223,255,0,.85);
}
.summary-ui .continue.ready:active{
  background:rgba(223,255,0,.52);
  transform:translateY(1px);
}
.summary-ui .continue.ready::before{
  color:#050708;
}
@keyframes finishPulse{
  0%,100%{background:rgba(223,255,0,.24);box-shadow:inset 0 0 18px rgba(223,255,0,.24),0 0 0 2px rgba(223,255,0,.65),0 0 16px rgba(223,255,0,.42)}
  50%{background:rgba(223,255,0,.36);box-shadow:inset 0 0 28px rgba(223,255,0,.34),0 0 0 3px rgba(223,255,0,.95),0 0 30px rgba(223,255,0,.78)}
}
.summary-ui .continue:not(.ready){cursor:default;box-shadow:none;filter:none;}

/* V30: make the ORIGINAL Finish & Checkout control visibly active when all 5 steps are complete. */
.summary-ui .continue.ready{
  background:#dfff00 !important;
  color:#050708 !important;
  opacity:1 !important;
  box-shadow:0 0 0 2px #dfff00, 0 0 14px #dfff00, 0 0 30px #dfff0080, inset 0 0 18px #f4ff8a !important;
}
.summary-ui .continue.ready::before{
  color:#050708 !important;
  text-shadow:0 0 1px rgba(255,255,255,.35);
}
.summary-ui .continue.ready:hover{
  background:#efff38 !important;
  box-shadow:0 0 0 2px #efff38, 0 0 18px #dfff00, 0 0 38px #dfff00aa, inset 0 0 20px #ffffff66 !important;
  transform:translateY(-1px);
}
.summary-ui .continue.ready:active{
  background:#c8e900 !important;
  transform:translateY(1px);
  box-shadow:0 0 0 2px #dfff00, 0 0 12px #dfff00, inset 0 0 12px #a9c700 !important;
}