:root{--primary-color: #005C53;--secondary-color: #DBF227;--secondary-color-light: #eaff48;--secondary-color-dark: #60741f;--secondary-color-dark-tr: #86a22a70;--box-color: #D6D58E;--background-color: #042940;--background-color-light: #285571;--background-color-lighter: #397194;--background-color-dark: #02131e;--error-color: #892f28;--text-color: #d9fdf9;--text-color-inverted: #030303;--shadow-strong: 0 24px 55px rgba(0, 0, 0, .8);--shadow-medium: 0 18px 38px rgba(0, 0, 0, .7);--shadow-soft: 0 10px 20px rgba(0, 0, 0, .7);--shadow-outline: 0 0 0 2px #04131ecc, 0 0 0 4px #dbf227e6}*{margin:0;padding:0;box-sizing:border-box}body{width:100%;display:flex;align-items:center;justify-content:center;height:100vh;color:var(--text-color);background:linear-gradient(to bottom,var(--background-color),var(--background-color-dark));background-size:cover;background-position:center}@media(max-width:750px){body{align-items:flex-start;padding:5rem 1rem}}.stop-watch{min-width:360px;max-width:520px;padding:2.5rem 3rem;border-radius:2rem;border:1px solid var(--background-color);background:linear-gradient(180deg,var(--background-color-light),var(--background-color),var(--background-color-dark));box-shadow:0 20px 40px #000;display:flex;flex-direction:column;align-items:center;gap:2rem}@media(max-width:750px){.stop-watch{max-width:unset;min-height:450px;justify-content:space-between;margin-inline:2rem}}@media(max-width:480px){body{padding:7.5rem 0 4rem;margin:0%}.stop-watch{padding:2rem 1.5rem;border-radius:1.5rem;margin-inline:.5rem}}@media(max-width:400px){.stop-watch{padding:2rem .75rem;min-width:340px}}.timer{display:flex;align-items:baseline;justify-content:center;gap:.1rem;font-family:IBM Plex Mono,Menlo,Consolas,monospace;font-size:clamp(5rem,8vw + 1rem,6rem);color:var(--text-color);text-shadow:5px 5px 15px black}.digits{line-height:1}.digits.centiseconds{font-size:.6em;margin-bottom:.1rem}@media(max-width:750px){.timer{font-size:clamp(3.75rem,15vw + 1rem,7rem);gap:0}}.stop-watch-controls{margin-top:1.5rem;display:flex;justify-content:space-between;gap:1.25rem}.stop-watch-controls button{position:relative;flex:1 1 0;display:flex;align-items:center;justify-content:center;padding:1.25rem 2.5rem;max-width:160px;border-radius:9999px;border:none;font-size:1.125rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;box-shadow:0 14px 26px #000;transition:transform .14s ease-out,box-shadow .14s ease-out,filter .14s ease-out}.stop-watch-controls button:hover,.stop-watch-controls button:focus-visible{outline:none;transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 20px 34px #000}.stop-watch-controls .btn-main{background:linear-gradient(180deg,var(--secondary-color),var(--secondary-color-dark));color:var(--text-color-inverted)}.btn-main:hover,.btn-main:focus-visible{background:linear-gradient(180deg,var(--secondary-color-light),var(--secondary-color-dark))}.stop-watch-controls .btn-secondary{position:relative;top:2px;left:2px;display:flex;height:calc(100% - 2px);width:calc(100% - 2px);text-align:center;background:linear-gradient(180deg,var(--background-color),var(--background-color-dark));color:var(--secondary-color);border-radius:999px}.stop-watch-controls .btn-secondary:after{content:"";height:calc(100% - 2px);width:calc(100% - 2px);position:absolute;top:0;left:0;padding:2px;background:linear-gradient(180deg,var(--secondary-color-light),var(--secondary-color-dark));border-radius:9999px;z-index:0}.stop-watch-controls .btn-secondary:before{content:"";height:calc(100% - 2px);width:calc(100% - 2px);position:absolute;top:2px;left:2px;background:linear-gradient(180deg,var(--background-color),var(--background-color-dark));border-radius:999px;z-index:1}.btn-text{position:relative;z-index:2}.stop-watch-controls .btn-secondary:hover,.stop-watch-controls .btn-secondary:focus-visible{filter:brightness(1.04)}@media(max-width:750px){.stop-watch-controls{width:100%;justify-content:space-between;align-items:center;padding:0 .125rem}.stop-watch-controls button{font-size:2rem;justify-content:center;padding:1.5rem 6rem}}@media(max-width:520px){.stop-watch-controls button{padding:1.5rem 4rem}}@media(max-width:480px){.stop-watch-controls{max-width:none;gap:.75rem}.stop-watch-controls button{font-size:1.75rem;padding:1.75rem}}