.charge-window{--cw-ink:#252932;--cw-blue:#315cc8;--cw-soft:#edf0f5;color:var(--cw-ink);max-width:1120px;font-family:var(--font-sans,Arial, sans-serif);margin:0 auto;padding:clamp(12px,2vw,28px) 0 42px}.charge-window *{box-sizing:border-box}.cw-intro{margin-bottom:22px}.cw-eyebrow,.cw-stage-label{font:600 11px/1.4 var(--font-mono,monospace);letter-spacing:.11em;color:#596375}.cw-intro h2{letter-spacing:-.035em;margin:7px 0 4px;font-size:clamp(1.35rem,3vw,2rem);line-height:1.15}.cw-intro p{color:#596375;margin:0}.cw-workspace{grid-template-columns:minmax(280px,.85fr) minmax(330px,1.15fr);align-items:start;gap:clamp(20px,4vw,58px);display:grid}.cw-controls{padding-top:4px}.cw-fields{grid-template-columns:1fr 1fr;gap:15px 13px;display:grid}.cw-field:first-child,.cw-field:nth-child(4),.cw-field:nth-child(5){grid-column:1/-1}.cw-field{flex-direction:column;gap:5px;font-size:.9rem;font-weight:650;display:flex}.cw-field small{color:#596375;font-size:.73rem;font-weight:400;line-height:1.35}.cw-input{background:#fff;border:1px solid #b5bcc9;border-radius:8px;align-items:center;transition:border-color .15s,box-shadow .15s;display:flex}.cw-input:focus-within{border-color:var(--cw-blue);box-shadow:0 0 0 3px #315cc82a}.cw-input input{width:100%;min-width:0;color:var(--cw-ink);background:0 0;border:0;outline:none;padding:11px 12px;font-family:inherit;font-size:1rem;font-weight:600;line-height:1.2}.cw-input input::placeholder{color:#89919e;font-weight:400}.cw-input b{color:#596375;white-space:nowrap;padding-right:13px;font-size:.77rem}.cw-actions{align-items:center;gap:10px;margin-top:20px;display:flex}.cw-actions button{cursor:pointer;border-radius:8px;min-height:44px;padding:10px 16px;font-family:inherit;font-size:.92rem;font-weight:650;line-height:1.2}.cw-primary{background:var(--cw-blue);color:#fff;border:1px solid var(--cw-blue)}.cw-primary:hover{background:#254ba9}.cw-clear{color:var(--cw-ink);background:0 0;border:1px solid #9da6b5}.cw-clear:hover{background:var(--cw-soft)}.charge-window button:focus-visible,.charge-window input:focus-visible{outline-offset:3px;outline:3px solid #c58523}.cw-error{color:#9b2b25;margin:13px 0 0;font-size:.88rem;font-weight:600}.cw-stage{background:var(--cw-soft);border-radius:16px;flex-direction:column;min-height:365px;padding:clamp(20px,3vw,34px);display:flex}.cw-stage-label{justify-content:space-between;gap:10px;display:flex}.cw-stage-label span:last-child{letter-spacing:0;color:var(--cw-ink);font-size:.87rem}.cw-battery{align-items:center;width:100%;height:76px;margin:32px 0 25px;display:flex}.cw-battery-body{border:3px solid var(--cw-ink);background:repeating-linear-gradient(90deg,#d7dde7 0 1px,#0000 1px 10%);border-radius:12px;width:calc(100% - 11px);height:100%;position:relative;overflow:hidden}.cw-battery-fill{background:var(--cw-blue);transition:left .25s,width .25s;position:absolute;top:0;bottom:0}.cw-battery-tip{background:var(--cw-ink);border-radius:0 4px 4px 0;width:10px;height:32px}.cw-empty{color:#596375;flex-direction:column;gap:5px;margin:auto 0;display:flex}.cw-empty strong{color:var(--cw-ink);font-size:1.25rem}.cw-result{animation:.25s ease-out cw-appear}.cw-main-result{flex-direction:column;gap:4px;display:flex}.cw-main-result span,.cw-energy span,.cw-window-result span{color:#596375;font-size:.82rem}.cw-main-result strong{font-variant-numeric:tabular-nums;letter-spacing:-.055em;font-size:clamp(2rem,5vw,3.5rem);line-height:1.05}.cw-energy,.cw-window-result{justify-content:space-between;align-items:baseline;gap:12px;margin-top:18px;display:flex}.cw-energy strong,.cw-window-result strong{white-space:nowrap;font-variant-numeric:tabular-nums;font-size:1.25rem}.cw-window-result{border-top:1px solid #c3cad5;flex-wrap:wrap;padding-top:16px}.cw-window-result p{width:100%;margin:0;font-size:.85rem}.cw-caveat{color:#596375;max-width:56ch;margin:24px 0 0;font-size:.78rem;line-height:1.45}@keyframes cw-appear{0%{opacity:.3;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media (width<=750px){.cw-workspace{grid-template-columns:1fr;gap:20px}.cw-stage{min-height:300px}.cw-battery{margin:22px 0}.cw-intro{margin-bottom:18px}}@media (width<=390px){.cw-fields{grid-template-columns:1fr}.cw-field{grid-column:1/-1}.cw-energy,.cw-window-result{flex-direction:column;align-items:start;gap:3px}.cw-stage{padding:18px}.cw-actions{flex-wrap:wrap}}@media (prefers-reduced-motion:reduce){.cw-battery-fill,.cw-input{transition:none}.cw-result{animation:none}}
